/* MPJ School Website Home 3 visual fitting v14. Scoped to the EduCare school template only. */
:root{--mpj-primary:#173d60;--mpj-accent:#dba82e}
html{overflow-x:hidden;scroll-behavior:smooth}body{overflow-x:hidden;min-width:320px}
.page-wraper,.page-content,.site-footer{max-width:100%;overflow-x:clip}
.site-header .main-bar,.site-header .main-bar .container{min-height:76px}
.site-header .main-bar .container{display:flex;align-items:center;gap:12px;justify-content:space-between;flex-wrap:nowrap}
.site-header .logo-header{float:none!important;position:relative!important;min-width:115px;max-width:210px;width:clamp(125px,17vw,210px);height:70px!important;display:flex;align-items:center;justify-content:flex-start;margin:0!important;padding:5px 0!important;flex-shrink:0}
.site-header .logo-header a{height:100%;width:100%;display:flex;align-items:center}
.site-header .logo-header img{display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:62px!important;object-fit:contain!important;object-position:left center!important;filter:none!important;vertical-align:middle}
.site-header .header-nav{margin:0!important;flex:1 1 auto;min-width:0}
.site-header .header-nav .nav{display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:0}
.site-header .header-nav .nav>li{float:none!important}
.site-header .header-nav .nav>li>a{font-size:12px;line-height:24px;padding:24px 8px!important;white-space:nowrap}
.site-header .extra-nav{float:none!important;position:relative!important;margin:0!important;padding:0!important;flex:0 0 auto;order:4}
.site-header .extra-cell{display:flex;align-items:center;gap:6px;white-space:nowrap}
.site-header .extra-cell .site-button{display:inline-flex;align-items:center;justify-content:center;margin:0;border-radius:4px;padding:9px 12px;font-size:12px}
.site-header .navbar-toggle{order:5;flex:0 0 auto}
.top-bar .container,.top-bar .row{max-width:100%}
.top-bar .rdx-topbar-left ul{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.top-bar .rdx-topbar-left li{font-size:12px;overflow-wrap:anywhere}
.main-slider .tp-banner-container,.main-slider .tp-banner,.main-slider .rev_slider_wrapper{max-width:100%;overflow:hidden}
.main-slider .rev-slidebg{object-fit:cover;object-position:center}
#slide-2971-layer-2{font-size:clamp(24px,3.3vw,48px)!important;line-height:1.2!important;letter-spacing:.01em!important;text-align:center!important;white-space:normal!important;overflow-wrap:break-word!important;max-width:92vw!important;font-family:Roboto,Arial,sans-serif!important}
#slide-2971-layer-4{font-size:clamp(12px,1.3vw,18px)!important;line-height:1.4!important;white-space:normal!important;text-align:center!important;max-width:88vw!important}
.tp-caption .site-button,.site-button{border-radius:4px;min-height:34px;line-height:1.4;transition:background-color .2s,transform .2s,box-shadow .2s}
.site-button:hover{transform:translateY(-1px);box-shadow:0 3px 10px rgba(0,0,0,.14)}
/* Flexible content/images in services, teacher cards, gallery and activities */
.page-content section,.page-content .section-full,.page-content .container{max-width:100%}
.page-content .row{display:flex;flex-wrap:wrap}
.page-content .row>[class*=col-]{min-width:0}
.page-content img:not(.rev-slidebg){max-width:100%;height:auto}
.page-content .rdx-box,.page-content .rdx-box img,.page-content .rdx-thum-bx img,.page-content .rdx-media img{max-width:100%}
.page-content .rdx-thum-bx img,.page-content .rdx-media img{object-fit:cover;object-position:center}
.page-content .section-head h2,.page-content .section-head h3{overflow-wrap:break-word;line-height:1.3}
.page-content p{overflow-wrap:break-word;line-height:1.7}
.page-content .owl-carousel .owl-item img{max-width:100%;object-fit:cover}
.site-footer .footer-top .row{display:flex;flex-wrap:wrap}
.site-footer .footer-col-4{margin-bottom:18px;min-width:0}
.site-footer img{max-width:100%;height:auto;object-fit:contain}
.site-footer a,.site-footer p{overflow-wrap:anywhere}
@media(min-width:992px) and (max-width:1199px){.site-header .logo-header{width:145px}.site-header .header-nav .nav>li>a{font-size:11px;padding:20px 5px!important}}
@media(max-width:991px){
 .site-header .main-bar .container{min-height:68px;flex-wrap:wrap;position:relative;padding:0 15px}
 .site-header .logo-header{height:65px!important;width:175px;max-width:45%;margin-right:auto!important}
 .site-header .logo-header img{max-height:55px!important}
 .site-header .navbar-toggle{display:block!important;order:3;margin:10px 0 10px 8px!important;position:relative!important;float:none!important;background:var(--mpj-primary)!important}
 .site-header .navbar-toggle .icon-bar{background:#fff!important}
 .site-header .extra-nav{order:2;margin-left:auto!important}
 .site-header .header-nav{order:6;flex:0 0 100%;width:100%!important;max-height:70vh;overflow-y:auto;background:#fff;box-shadow:0 8px 16px rgba(0,0,0,.09)}
 .site-header .header-nav:not(.in){display:none!important}
 .site-header .header-nav.in{display:block!important}
 .site-header .header-nav .nav{display:block;width:100%}
 .site-header .header-nav .nav>li{display:block;width:100%;border-top:1px solid #eee}
 .site-header .header-nav .nav>li>a{padding:11px 14px!important;font-size:14px;white-space:normal}
 .main-slider .rev_slider_wrapper,.main-slider .tp-banner-container{min-height:370px!important}
 .page-content [class*=col-md-]{margin-bottom:12px}
}
@media(max-width:767px){
 .top-bar{display:none!important}
 .site-header .main-bar .container{padding:0 12px;gap:6px}
 .site-header .logo-header{height:60px!important;width:135px;max-width:42%}
 .site-header .logo-header img{max-height:52px!important}
 .site-header .extra-cell #quik-search-btn{display:none!important}
 .site-header .extra-cell .sign-in{padding:8px 10px;font-size:11px}
 .site-header .navbar-toggle{margin:10px 0 10px 2px!important;padding:9px!important}
 .main-slider .rev_slider_wrapper,.main-slider .tp-banner-container{min-height:290px!important}
 #slide-2971-layer-2{font-size:clamp(22px,6vw,32px)!important;line-height:1.2!important;max-width:90vw!important}
 #slide-2971-layer-4{font-size:13px!important;max-width:85vw!important}
 .section-head h2,.section-head h3{font-size:clamp(22px,5.5vw,30px)!important}
 .page-content .container,.site-footer .container{padding-left:16px;padding-right:16px}
 .page-content .row>[class*=col-]{width:100%;float:none}
 .page-content .row>[class*=col-xs-6]{width:50%}
 .site-footer .footer-col-4{width:50%;float:none}
}
@media(max-width:420px){.site-header .logo-header{width:105px}.site-header .extra-cell .sign-in{padding:7px 8px}.site-footer .footer-col-4{width:100%}.page-content .row>[class*=col-xs-6]{width:100%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* V16 mobile-first: prevent excessively tall school banners */
.mpj-static-hero{height:clamp(380px,56vw,660px)!important;min-height:380px!important;max-height:660px!important;overflow:hidden!important;position:relative!important}
.mpj-static-hero>.mpj-hero-photo{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-height:100%!important;object-fit:cover!important;object-position:center center!important}
.mpj-static-hero .mpj-hero-copy{position:relative!important;z-index:3!important;max-width:960px!important;margin:auto!important;padding:1rem!important}
.mpj-static-hero h1{font-size:clamp(1.7rem,4.3vw,3.6rem)!important;line-height:1.16!important;overflow-wrap:anywhere!important}
.logo-header img{max-width:190px!important;max-height:64px!important;width:auto!important;height:auto!important;object-fit:contain!important}
.header-nav .nav{display:flex;flex-wrap:wrap;align-items:center}
@media(max-width:767px){.mpj-static-hero{height:430px!important;min-height:430px!important;max-height:430px!important}.mpj-static-hero .mpj-hero-photo{object-position:center center!important}.logo-header img{max-width:145px!important;max-height:58px!important}.header-nav .nav{display:block}.mpj-static-hero .mpj-hero-copy{padding:18px!important}}

/* V17 hard bounds for static Home 3 hero – eliminates runaway vertical slider height. */
html,body{max-width:100%;overflow-x:clip}
.mpj-static-hero{height:clamp(340px,52vw,650px)!important;min-height:340px!important;max-height:650px!important;position:relative!important;overflow:hidden!important;display:flex!important;align-items:center!important;justify-content:center!important}
.mpj-static-hero>.mpj-hero-photo{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;max-height:100%!important;object-fit:cover!important;object-position:center!important}
.mpj-static-hero .mpj-hero-copy{position:relative!important;z-index:3!important;width:min(94%,980px)!important;margin:auto!important;text-align:center!important}
.mpj-static-hero h1{font-size:clamp(1.65rem,4.2vw,3.7rem)!important;line-height:1.17!important;overflow-wrap:anywhere!important}
.logo-header img,.logo-header a img{max-height:74px!important;max-width:min(270px,60vw)!important;width:auto!important;height:auto!important;object-fit:contain!important}
img{max-width:100%} .site-button,a.site-button{min-height:40px;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:767px){.mpj-static-hero{height:420px!important;min-height:420px!important;max-height:420px!important}.mpj-static-hero h1{font-size:clamp(1.5rem,7vw,2.4rem)!important}.mpj-static-hero>.mpj-hero-photo{object-position:center!important}.logo-header img{max-height:58px!important}}
