
.eco-cards .card:hover{ transform:translateY(-6px); box-shadow:0 18px 36px rgba(0,0,0,.18); }
:root{
  --eco-blue:#4197CB;
  --eco-yellow:#FFC32A;
  --eco-orange:#F05528;
  --eco-green:#22B36F;
  --eco-gray:#737373;
  --eco-dark:#0e0e11;

  --panel:#6ab0d6;
  --ink:#16223a;
  --muted:#8b97ad;
  --grid:#e8edf3;
  --bg:#f7f8fb;
  --card:#fff;

  --c-holiday:#ef4444;
  --c-winter:#f59e0b;
  --c-summer:#ffff88;
  --c-end:#2463eb;
  --c-ptc:#f97316;
  --c-term:#16a34a;

  --ieyc-option1: #c4a4d3;
  --ieyc-option2: #ade0bd;
  --ieyec-option3: #f5df6b; 
  --ieyc-option4: #f3c9a0;
  --ieyc-option5: #df6d84;
  --ieyc-option6: #2babb4;


  --shadow-lg:0 30px 60px rgba(0,0,0,.35);
  --shadow-md:0 12px 26px rgba(0,0,0,.12);
  --radius:14px;
  --nav-brand: var(--eco-green);
  --nav-brand-soft:#cef3e0;

  --font-family-base:'Karla-Regular';
  --font-size-base:16px;
  --font-weight-regular:300;
  --line-height-base:1.65;
  --letter-spacing-body:.02em;
  --letter-spacing-heading:.04em;
}
@supports (color:color-mix(in srgb, black 50%, white 50%)){
  :root{
    --nav-brand-soft:color-mix(in srgb, var(--nav-brand) 28%, white);
  }
}


@font-face{
  font-family:'Karla-Regular';
  src:url('../fonts/Karla-Regular.ttf') format('opentype');
  font-weight:200; font-style:normal; font-display:swap;
}

/* =====================
   Base & utilities
   ===================== */
*{ box-sizing:border-box; margin:0; padding:0; }
html,body{ height:100%; }
body{
  font-family:var(--font-family-base);
  font-size:var(--font-size-base);
  font-weight:var(--font-weight-regular);
  color:var(--eco-gray);
  background:var(--bg);
  line-height:var(--line-height-base);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  letter-spacing:var(--letter-spacing-body);
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

main{
  flex:1 0 auto;
  width:100%;
}
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-family-base);
  font-weight:var(--font-weight-regular);
  letter-spacing:var(--letter-spacing-heading);
  line-height:1.25;
  color:var(--ink);
}
p,li,span,small{
  font-family:var(--font-family-base);
  font-size:inherit;
  font-weight:inherit;
  letter-spacing:var(--letter-spacing-body);
}
img{ max-width:100%; height:auto; display:block; }
.container{ width:min(92vw,1280px); margin:0 auto; }
.btn{
  display:inline-block; padding:.75rem 1.25rem; border-radius:999px;
  text-decoration:none; font-weight:300; background:var(--eco-green); color:#fff;
  transition:transform .15s ease, filter .15s ease;
}
.btn:hover{ transform:translateY(-1px); filter:brightness(1.05); }
.badge{ display:inline-block; padding:.25rem .5rem; border-radius:.375rem; font-size:.8rem; background:#e9f3fb; color:#195b9f; }

/* =====================
   Header & navigation
   ===================== */
.header{
    position:absolute;
    inset:0 auto auto 0;
    height:108px;
    width:100%;
    z-index:50;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px 0;
}

@media (min-width: 1024px){
  .header{
    background:linear-gradient(180deg, rgba(65,151,203,.82), rgba(65,151,203,.24), transparent);
    backdrop-filter:saturate(120%) blur(4px);
  }
}
.header .container{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding:0 32px;
    margin:0;
}
.logo{ display:flex; align-items:center; justify-content:flex-start; }
.logo-img{ height:114px; width:auto; object-fit:contain; }
.nav{ margin-left:auto; display:flex; justify-content:flex-end; width:100%; }
.menu{ margin-left:auto; }
.menu{ display:none; list-style:none; gap:32px; align-items:flex-start; }
.menu-link{
  background:none; border:0; cursor:pointer; color:#fff; text-decoration:none;
  display:flex; flex-direction:column; align-items:center; gap:6px; padding:.3rem .55rem; font-weight:300;
}
.menu-icon{ width:28px; height:28px; display:grid; place-items:center; opacity:.95; }
.menu-title{ white-space:nowrap; text-shadow:0 1px 2px rgba(0,0,0,.45); font-size:1.7rem; }
.menu-caret{ font-size:2.2rem; opacity:.9; line-height:1; }
/* Dropdown (desktop hover; mobile uses the slide-down menu) */
.has-sub{ position:relative; }
.menu-sub{
  position:absolute; top:100%; left:50%; transform:translate(-50%,12px);
  min-width:220px; background:#fff; border-radius:.5rem; padding:.75rem .5rem;
  box-shadow:0 20px 40px rgba(13,38,76,.25); border:1px solid rgba(14,14,17,.08);
  opacity:0; pointer-events:none; transition:.18s ease; z-index:60;
}
.menu-sub::before{ content:""; position:absolute; top:-3px; left:0; right:0; height:3px; border-radius:.5rem .5rem 0 0; background:var(--eco-green); }
.menu-sub a{ display:block; color:#2262a8; padding:.55rem .75rem; border-radius:.35rem; text-decoration:none; font-weight:300; white-space:nowrap; }
.menu-sub a:hover{ background:#e9f3fb; }
.has-sub:hover>.menu-sub,.has-sub:focus-within>.menu-sub{ opacity:1; pointer-events:auto; transform:translate(-50%,8px); }
.has-sub:hover>.menu-link .menu-caret,.has-sub:focus-within>.menu-link .menu-caret{ transform:rotate(180deg); }

/* Hamburger & mobile nav */
.hamburger{ margin-left:auto; width:42px; height:42px; border:0; background:rgba(255,255,255,.25); border-radius:.75rem; display:grid; place-items:center; }
.hamburger span{ width:22px; height:2px; background:#fff; border-radius:2px; display:block; }
.hamburger span+span{ margin-top:5px; }
.hamburger:focus{ outline:2px dashed #fff; outline-offset:4px; }

.mobile{
  position:fixed;
  inset:0;
  z-index:1000;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s ease;
}
.mobile.open{
  opacity:1;
  pointer-events:auto;
}
body.mobile-open{
  overflow:hidden;
}
.mobile__backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.55);
  backdrop-filter:blur(3px);
}
.mobile__panel{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:min(340px, 90vw);
  padding:20px 0;
  background:var(--eco-green);
  color:#fff;
  display:flex;
  flex-direction:column;
  transform:translateX(100%);
  transition:transform .32s ease;
  box-shadow:-6px 0 28px rgba(15,23,42,.3);
}
.mobile.open .mobile__panel{
  transform:translateX(0);
}
.mobile__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 24px 12px;
  border-bottom:1px solid rgba(255,255,255,.2);
}
.mobile__brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:#fff;
}
.mobile__brand-name{
  font-size:1rem;
  font-weight:300;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.mobile__brand-icon{
  width:46px;
  height:46px;
  border-radius:14px;
  background:rgba(255,255,255,.16);
  display:grid;
  place-items:center;
}
.mobile__brand-icon img{
  width:32px;
  height:32px;
  object-fit:contain;
}
.mobile__close{
  border:0;
  background:transparent;
  color:#fff;
  font-size:1.75rem;
  line-height:1;
  padding:6px 8px;
  cursor:pointer;
}
.mobile__menu{
  list-style:none;
  margin:0;
  padding:16px 0;
  overflow-y:auto;
  flex:1;
}
.mobile__item + .mobile__item{
  margin-top:4px;
}
.mobile__link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  padding:14px 24px;
  border:0;
  background:transparent;
  color:#fff;
  text-decoration:none;
  font-size:.95rem;
  font-weight:300;
  text-transform:uppercase;
  letter-spacing:.08em;
  cursor:pointer;
}
.mobile__link:hover,
.mobile__link:focus-visible{
  background:rgba(255,255,255,.12);
  outline:none;
}
.mobile__toggle{
  text-align:left;
}
.mobile__item--has-sub .mobile__link{
  background:rgba(255,255,255,.06);
}
.mobile__item--open .mobile__link{
  background:rgba(255,255,255,.18);
}
.mobile__caret{
  width:12px;
  height:12px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
  transition:transform .2s ease;
}
.mobile__item--open .mobile__caret{
  transform:rotate(-135deg);
}
.mobile__submenu{
  list-style:none;
  margin:0;
  padding:0 0 0 24px;
  max-height:0;
  overflow:hidden;
  transition:max-height .25s ease, opacity .25s ease, padding .25s ease;
  opacity:0;
}
.mobile__item--open .mobile__submenu{
  max-height:400px;
  padding:6px 0 14px 24px;
  opacity:1;
}
.mobile__submenu a{
  display:block;
  padding:10px 0;
  color:rgba(255,255,255,.82);
  text-decoration:none;
  font-size:.9rem;
  letter-spacing:var(--letter-spacing-body);
  text-transform:none;
}
.mobile__submenu a:hover,
.mobile__submenu a:focus-visible{
  color:#fff;
}
@media (min-width: 769px){
  .mobile{ display:none; }
}
/* =====================
   Hero / Slides
   ===================== */
.hero-slider{ position:relative; height:46vh; min-height:320px; overflow:hidden; color:#fff; }
.slides{ position:relative; height:100%; width:100%; }
.slide{
  position:absolute; inset:0; background-size:cover; background-position:center; opacity:0;
  transition:opacity 1s ease-in-out; display:flex; justify-content:center; align-items:center; text-align:center; padding:0 1rem;
}
.slide.active{ opacity:1; z-index:1; }
.slide .content{ position:relative; z-index:2; max-width:820px; }
.slide h1{ font-size:clamp(1.75rem,6vw,2.4rem); margin-bottom:.6rem; }
.slide p{ margin-bottom:1rem; }
.btn.alt{ background:var(--eco-green); }

/* =====================
   Sections & cards
   ===================== */
/* =====================
   Early Years bubbles
   ===================== */
.eyp-bubbles{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:50px;
  padding:24px 0 34px;
  margin:0;
}

.eyp-bubbles .bubble{
  position:relative;
  width:200px;
  height:200px;
  border-radius:50%;
  background:var(--ieyc-option1);
  box-shadow:0 14px 28px rgba(15,23,42,.18);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:0 18px;
  color:#ffffff;
  font-family:var(--font-family-base);
  font-weight:300;
  font-size:1rem;
  letter-spacing:.01em;
  line-height:1.35;
  cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease;
}

.eyp-bubbles .bubble:hover,
.eyp-bubbles .bubble:focus-visible{
  transform:translateY(-6px);
  box-shadow:0 20px 36px rgba(15,23,42,.22);
}

.page-eyp .eyp-bubbles .bubble:nth-child(1){
  background:var(--ieyc-option1);
}

.page-eyp .eyp-bubbles .bubble:nth-child(2){
  background:var(--ieyc-option2);
}

.page-eyp .eyp-bubbles .bubble:nth-child(3){
  background:var(--ieyec-option3);
}

.page-eyp .eyp-bubbles .bubble:nth-child(4){
  background:var(--ieyc-option4);
}

.page-eyp .eyp-bubbles .bubble{
  color:#433f36;
}

.page-kindergarten .eyp-bubbles .bubble:nth-child(1){
  background:var(--c-holiday);
}

.page-kindergarten .eyp-bubbles .bubble:nth-child(2){
  background:var(--c-ptc);
}

.page-kindergarten .eyp-bubbles .bubble:nth-child(3){
  background:var(--c-term);
}

.page-kindergarten .eyp-bubbles .bubble:nth-child(4){
  background:var(--ieyc-option5);
}
.page-kindergarten .eyp-bubbles .bubble:nth-child(5){
  background:var(--ieyc-option6);
}

.page-primary .eyp-bubbles .bubble:nth-child(1){
  background:var(--c-holiday);
}

.page-primary .eyp-bubbles .bubble:nth-child(2){
  background:var(--c-winter);
}

.page-primary .eyp-bubbles .bubble:nth-child(3){
  background:var(--c-term);
}

.page-primary .eyp-bubbles .bubble:nth-child(4){
  background:var(--ink);
}
.page-primary .eyp-bubbles .bubble:nth-child(5){
  background:var(--ieyc-option6);
}

.eyp-bubbles .bubble span{
  position:relative;
  z-index:1;
  font-weight:600;
}

@media (max-width:768px){
  .eyp-bubbles{
    gap:16px;
  }
  .eyp-bubbles .bubble{
    width:148px;
    height:148px;
    padding:0 14px;
  }
}

@media (max-width:480px){
  .eyp-bubbles{
    justify-content:center;
    gap:18px;
  }
  .eyp-bubbles .bubble{
    width:172px;
    height:172px;
    padding:0 12px;
    flex:0 0 172px;
    font-size:.88rem;
    line-height:1.35;
  }
  .eyp-features{
    flex-direction:column;
    align-items:center;
    gap:24px;
  }
.eyp-features .feat{
  max-width:260px;
  width:100%;
}
.eyp .eyp-subtitle{
  text-align:center;
  font-size: clamp(1.1rem, 4.5vw, 1.4rem);
}
.eyp-goals-block__title{
  font-size: clamp(1.1rem, 4.5vw, 1.4rem);
}

.footer-copy{
  display:block;
  margin:0;
  text-align:left;
  color:#fff;
  font-weight:400;
  font-size:1.15rem;
  line-height:1.4;
  letter-spacing:var(--letter-spacing-body);
  flex:1 1 auto;
  width:auto;
  white-space:nowrap;
}

@media (max-width:900px){
  .eco-footer__bar-inner-footer{ flex-wrap:wrap; justify-content:center; }
  .eco-footer__social-wrap{
    order:1;
    justify-content:center;
  }
  .footer-copy{
    order:2;
    margin:16px 0 0;
    text-align:center;
    flex:0 0 100%;
    width:100%;
    white-space:normal;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:12px 16px;
    background:var(--eco-yellow);
  }
}

@media (max-width:560px){
  .footer-copy{
    position:static;
    display:flex;
    width:100%;
    min-height:54px;
    padding:12px 16px;
    background:var(--eco-yellow);
    align-items:center;
    justify-content:center;
    text-align:center;
    font-size:1.05rem;
    white-space:normal;
  }
}
}
.section{ padding:2.25rem 0; }
.section h2{ font-size:clamp(1.4rem,4.8vw,1.8rem); color:#0b2f55; margin-bottom:1rem; }
.grid{ display:grid; gap:16px; }
.grid.cards{ grid-template-columns:1fr; }
.card{ background:#fff; border-radius:1rem; overflow:hidden; box-shadow:0 10px 24px rgba(13,38,76,.07); display:flex; flex-direction:column; }
.card img{ width:100%; height:160px; object-fit:cover; }
.card .body{
  font-family:var(--font-family-base);
  font-size:var(--font-size-base);
  font-weight:var(--font-weight-regular);
  color:var(--eco-gray);
  background:var(--bg);
  line-height:var(--line-height-base);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  letter-spacing:var(--letter-spacing-body);
}
.card .body h3{ color:#0b2f55; font-size:1.06rem; margin-bottom:.35rem; }
.card .body p{ font-size:.95rem; }

/* =====================
   About Us
   ===================== */
.eco-about{ text-align:center; padding:20px; max-width:1280px; margin:0 auto; }
.section-title{
  font-size:clamp(2rem,10vw,3rem);
  font-weight:300;
  color:var(--eco-blue);
  margin-bottom:10px;
  margin-top: 16px;;
  letter-spacing:var(--letter-spacing-body); }
.eco-intro{ display:flex; flex-direction:column; gap:16px; align-items:center; justify-content:center; margin-bottom:40px; text-align: center;}
.eco-photo img{ width:100%; max-width:1000px; border-radius:14px; box-shadow:0 8px 20px rgba(0,0,0,.12); }
.eco-text{
  max-width:800px;
  text-align:center;
  line-height:1.9;
  font-size:1.2rem;
  color:var(--eco-gray);
  padding:70px; }
.eco-cards{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  margin-top:50px;
  margin-bottom:50px;
}
.eco-cards .card{
  border-radius:18px; padding:26px 24px; color:#fff; box-shadow:0 12px 24px rgba(0,0,0,.15); text-align:center; min-height:260px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:12px; transition:transform .35s ease, box-shadow .35s ease; }
.eco-cards .card h2{
  margin:0;
  font-size:2.2rem;
  font-weight:300;
  color: #fff;
}
.eco-cards .card p{
  margin:0;
  font-size:1.2rem;
  line-height:1.55;
  max-width:100%;
  display:flex;
  flex-direction:column; align-items:center; justify-content:flex-start; min-height:120px; text-align:center; }
.card.philosophy{ background:linear-gradient(145deg,#4197CB,#2971C9); }
.card.vision{ background:linear-gradient(145deg,#FFC32A,#f0a500); }
.card.mission{ background:linear-gradient(145deg,#F05528,#d84315); }

/* =====================
/* =====================
   Our Campuses - hero + cards
   ===================== */
.gallery-title{ text-align:center; font-size:clamp(2.2rem,6vw,3.6rem); color:var(--eco-blue); margin-bottom:24px; font-weight:300; }   
.campuses-hero{ position:relative; width:100vw; left:50%; margin-left:-50vw; right:50%; margin-right:-50vw; isolation:isolate; overflow:hidden; min-height:676px; display:flex; align-items:center; }
.campuses-hero__bg{ position:absolute; inset:0; background:linear-gradient(rgba(10,15,30,.55), rgba(10,15,30,.55)), url("assets/img/bg_gallery.jpg") center/cover no-repeat; filter:none; transform:none; z-index:-2; }
.campuses-hero::after{ content:""; position:absolute; inset:0; z-index:-1; background:rgba(8,14,28,.35); }
.campuses-hero__inner{ width:min(1280px,92vw); margin:0 auto; padding:40px 0; display:flex; flex-direction:column; gap:24px; align-items:center; justify-content:center; text-align:center; }
.campuses-hero__title{ text-align:center; color:var(--eco-blue); font-weight:300; letter-spacing:var(--letter-spacing-body); font-size:2.2rem; margin:0 0 14px; }
.campuses-grid5{ display:grid; grid-template-columns:repeat(5,minmax(288px,1fr)); gap:24px; align-items:start; justify-items:center; }
.campus-card{ background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-md); transition:transform .18s ease, box-shadow .18s ease; cursor:pointer; display:flex; flex-direction:column; color:#0b2f55; text-align:center; height:100%; }
.campus-card:hover{ transform:translateY(-15px); box-shadow:0 18px 36px rgba(0,0,0,.18); }
.campus-card__img{ width:100%; height:190px; object-fit:cover; display:block; border-radius:var(--radius); }
.campus-card__cap{
  margin-top: 15px;
  padding:16px 14px 18px;
  text-align:center; color:#0b2f55; display:flex; flex-direction:column; justify-content:flex-start; align-items:center; gap:10px; min-height:150px; }
.campus-card__cap strong{
  display:block;
  font-weight:300;
  margin:0;
   font-size:1.5rem;
  letter-spacing:.01em;
  color: var(--eco-blue)
}
.campus-card__cap span{
  color:var(--eco-gray);
  font-size:1rem;
  line-height:1.45; display:block; max-width:100%; margin:0 auto; }

@media (max-width:640px){
  .why-photo img{ aspect-ratio:3/4; }
}
/* =====================
   Popup Gallery (unified)
   ===================== */
.campus-pop[hidden]{ display:none; }
.campus-pop{
  position:fixed; inset:0; z-index:1000; display:grid; place-items:center; padding:14px;
  background:rgba(15,23,42,.65); backdrop-filter:saturate(120%) blur(2px);
}
.campus-pop__body{
  font-family:var(--font-family-base);
  font-size:var(--font-size-base);
  font-weight:var(--font-weight-regular);
  color:var(--eco-gray);
  background:#fff;
  line-height:var(--line-height-base);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  letter-spacing:var(--letter-spacing-body);
  width:min(880px, calc(100vw - 40px));
  max-height:calc(100vh - 40px);
  border-radius:22px;
  box-shadow:0 32px 80px rgba(15,23,42,.35);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  position:relative;
}
.campus-pop__viewer{ width:100%; aspect-ratio:16/9; max-height:60vh; background:#000; overflow:hidden; border-radius:22px 22px 0 0; }
#campus-pop-img{ width:100% !important; height:100% !important; object-fit:cover !important; display:block; background:#000; }
.campus-pop__cap{ background:#fff; padding:10px 14px; display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; }
.campus-pop__cap strong{ color:#0b2f55; font-size:1.05rem; }
.campus-pop__cap span{ color:#4b5563; }
.campus-pop__count{ margin-left:auto; font-weight:300; color:#0b2f55; }
.campus-pop__close,.campus-pop__nav{
  position:absolute; border:0; border-radius:50%; cursor:pointer; background:#fff; color:#111; line-height:1;
  box-shadow:0 8px 20px rgba(0,0,0,.25); z-index:5;
}
.campus-pop__close{ top:12px; right:12px; width:40px; height:40px; font-size:26px; }
.campus-pop__nav{ top:50%; transform:translateY(-50%); width:44px; height:44px; font-size:28px; }
.campus-pop__prev{ left:10px; }
.campus-pop__next{ right:10px; }
.campus-pop__thumbs{
  width:100% !important; padding:8px 10px !important; gap:8px !important; margin:0 !important;
  display:flex; flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; background:#fff; -webkit-overflow-scrolling:touch; border-top:1px solid #eef1f5;
}
.campus-pop__thumbs button{ flex:0 0 68px; width:68px; height:40px; border:2px solid transparent; padding:0; border-radius:8px; background:#fff; cursor:pointer; }
.campus-pop__thumbs img{ width:100%; height:100%; object-fit:cover; border-radius:6px; display:block; }
.campus-pop__thumbs button[aria-current="true"]{ border-color:var(--eco-blue); }

@media (max-width:768px){
  .campus-pop{ padding:10px; }
  .campus-pop__body{
    width:100%;
    max-width:100%;
    max-height:calc(100vh - 20px);
    border-radius:18px;
  }
  .campus-pop__viewer{
    max-height:55vh;
    border-radius:18px 18px 0 0;
  }
  .campus-pop__nav{
    width:38px;
    height:38px;
    font-size:24px;
  }
  .campus-pop__close{
    width:36px;
    height:36px;
    font-size:24px;
    top:10px;
    right:10px;
  }
  .campus-pop__thumbs button{ flex:0 0 60px; width:60px; }
}
@media (max-width:480px){
  .campus-pop__viewer{
    max-height:50vh;
  }
  .campus-pop__cap{ padding:10px 12px; }
}

/* =====================
   Programs
   ===================== */
.programs{ padding:24px 0 40px; }
.programs-grid{ display:grid; grid-template-columns:1fr; gap:18px; align-items:stretch; }
.programs-title{ text-align:center; font-size:clamp(2.4rem,6vw,3.6rem); font-weight:300; color:var(--eco-blue); margin:0 0 14px; }
.programs-panel{ background:#eaf4fb; border-radius:14px; padding:22px 16px; }
.programs-list{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.programs-list>li+li{ border-top:1px solid #eceff5; }
.program-item{
  background:#fff; border:1px solid #e8edf3; border-radius:10px; padding:14px; text-decoration:none; color:inherit;
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:12px; box-shadow:0 8px 18px rgba(13,38,76,.06);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.program-item:hover{ transform:translateY(-2px); box-shadow:0 12px 24px rgba(13,38,76,.12); border-color:#dbe5f0; }
.program-item__text{ display:flex; flex-direction:column; gap:4px; }
.program-item__title{ font-size:1.5rem; font-weight:300; color:#1f2a37; }
.program-item__sub{ font-size:1rem; color:#6b7280; }
.program-item__chev{ width:22px; height:22px; display:grid; place-items:center; }
.program-item__chev svg{ width:18px; height:18px; stroke:#b0b7c4; stroke-width:2; transition:transform .15s ease, stroke .15s ease; }
.program-item:hover .program-item__chev svg{ stroke:#8993a0; transform:translateX(2px); }
.program-item.is-disabled{ cursor:default; opacity:.72; background:#fafbfe; pointer-events:none; }
.programs-heroimg{
  position:relative;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 16px 32px rgba(13,38,76,.14);
  background:#000;
  min-height:220px;
  display:grid;
  place-items:center;
  height:100%;
}
.programs-heroimg img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  pointer-events:none;
  border-radius:14px;
}

/* =====================
   Why Us
   ===================== */

.why{ padding:24px 0 44px; }
.why .container{ width:min(92vw,1280px); margin:0 auto; }
.why-title{ text-align:center; font-size:clamp(2.4rem,6vw,3.6rem); color:var(--eco-blue); margin-bottom:24px; font-weight:300; }
.why-grid{ width:min(1280px,92vw); margin:0 auto; display:grid; grid-template-columns:minmax(0,540px) minmax(0,1fr); gap:48px; align-items:center; justify-content:center; }
.why-photo{ margin:0; border-radius:18px; overflow:hidden; box-shadow:0 24px 40px rgba(13,38,76,.12); }
.why-photo img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:18px; }
.why-features{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,320px));
  gap:20px 20px;
  justify-content:center;
}
.why-feature{
  display:flex;
  align-items:center;
  gap:14px;
  background:#fff;
  border-radius:14px;
  padding:14px 18px;
  box-shadow:0 10px 24px rgba(13,38,76,.08);
  width:100%;
}
.why-feature img{ flex-shrink:0; width:50px; height:50px; padding:10px; border-radius:12px; border:2px solid var(--eco-yellow); background:rgba(255,195,42,.08); object-fit:contain; }
.why-feature span{
  font-size:1.2rem;
  color:var(--eco-gray);
  line-height:1.5;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3; overflow:hidden; text-overflow:ellipsis;
  width:100%;
}
@media (max-width:1024px){
  .why-grid{ grid-template-columns:1fr; gap:36px; }
  .why-photo img{ max-width:520px; margin:0 auto; }
  .why-features{ justify-content:center; }
}
@media (max-width:900px){
  .why-grid{ grid-template-columns:1fr; gap:32px; text-align:center; }
  .why-photo img{ max-width:520px; margin:0 auto; }
  .why-features{ grid-template-columns:repeat(2,minmax(0,220px)); }
}
@media (max-width:640px){
  .why{ margin:0 10px; }
  .why .container{ width:100%; margin:0 auto; }
  .why-grid{ width:100%; margin:0; justify-items:center; }
  .why-features{ grid-template-columns:repeat(2,minmax(150px,1fr)); gap:16px; justify-content:center; width:100%; max-width:520px; margin:0 auto; }
  .why-feature{ flex-direction:row; align-items:center; justify-content:flex-start; width:100%; padding:12px 16px; gap:10px; border-radius:18px; }
  .why-feature img{ width:44px; height:44px; padding:8px; }
  .why-feature span{ font-size:.96rem; text-align:left; display:block; line-height:1.45; -webkit-line-clamp:unset; text-overflow:clip; overflow:visible; }
  .why-photo img{ aspect-ratio:3/4; }
}\r
/* =====================\r
   Admission
   ===================== */
.admission{ padding:24px 0 44px; }
.admission .container{ width:min(92vw,1200px); margin:0 auto; }
.admission-grid{ display:grid; gap:22px; grid-template-columns:1fr; align-items:start; }
.adm-title{ text-align:center; color:var(--eco-blue); font-weight:300; letter-spacing:var(--letter-spacing-body); margin:0 0 8px; font-size:clamp(2rem,8vw,3.4rem); }
.adm-lead{ text-align:center; color:#3d4956; margin:0; font-size:1rem; line-height:1.55; }
.adm-photo{ margin:16px 0 12px; position:relative; isolation:isolate; border-radius:4px; overflow:hidden; box-shadow:0 14px 28px rgba(13,38,76,.12); }
.adm-photo::before,.adm-photo::after{ content:""; position:absolute; left:0; right:0; height:6px; background:var(--eco-green); z-index:2; }
.adm-photo::before{ top:0; } .adm-photo::after{ bottom:0; }
.tour-title{ text-align:center; color:var(--eco-blue); margin:10px 0 8px; font-weight:300; letter-spacing:var(--letter-spacing-body); font-size:clamp(1.4rem,6vw,2rem); }
.tour-copy{ max-width:780px; margin:0 auto; text-align:center; color:#4a5663; line-height:1.8; font-size:.98rem; }
.enroll-title{ margin:6px 0 12px; color:var(--eco-blue); font-weight:300; letter-spacing:var(--letter-spacing-body); font-size:clamp(1.4rem,6vw,2rem); }
.steps{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.step{ display:grid; grid-template-columns:1fr; gap:10px; align-items:center; }
.step-icon{ width:74px; height:74px; border-radius:999px; display:grid; place-items:center; background:#f7fbff; box-shadow:inset 0 0 0 8px rgba(65,151,203,.18), inset 0 0 0 2px rgba(65,151,203,.75); color:var(--eco-blue); }
.step-icon svg{ width:36px; height:36px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.step-card{ position:relative; background:var(--eco-green); color:#fff; border-radius:8px; padding:14px 56px 14px 16px; box-shadow:0 16px 30px rgba(13,38,76,.18); }
.step-card::before{ content:""; position:absolute; left:-10px; top:50%; width:20px; height:20px; background:var(--eco-green); transform:translateY(-50%) rotate(45deg); border-radius:3px; box-shadow:-2px 2px 0 rgba(255,255,255,.25); }
.step-card::after{ content:""; position:absolute; left:10px; top:50%; width:8px; height:8px; background:#fff; border-radius:999px; transform:translateY(-50%); }
.step-heading{ margin:0 0 6px; font-size:1.02rem; font-weight:300; }
.step-heading a{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.step-points{ margin:0; padding-left:1.1em; }
.step-points li{ color:#e9f4fc; line-height:1.45; margin:.15rem 0; }
.step-num{ position:absolute; right:12px; top:50%; transform:translateY(-50%); width:44px; height:44px; display:grid; place-items:center; border-radius:999px; color:#fff; font-weight:300; border:2px solid rgba(255,255,255,.60); background:rgba(255,255,255,.16); letter-spacing:var(--letter-spacing-body); }


/* =====================
   Admission
   ===================== */
.admission-adm{
  background:#fff;
  padding:40px 0 56px;
  --adm-row-h:clamp(130px,16vw,170px);
  --adm-photo-h:clamp(180px,22vw,350px);
}
.admission-adm .admission-inner{ width:min(1180px,92vw); margin:0 auto; }
.admission-adm .grid_adm{
  display:grid;
  grid-template-columns:minmax(0,1fr) 420px;
  gap:28px 36px;
  align-items:stretch;
}
.admission-adm .left_adm,
.admission-adm .right_adm{ width:100%; }
.admission-adm .title_adm{
  margin:0 0 8px;
  font-weight:300;
  letter-spacing:var(--letter-spacing-body);
  color:var(--eco-blue);
  font-size:clamp(34px,5vw,56px);
  text-align:center;
}
.admission-adm .lead_adm{
  max-width:820px;
  margin:0 auto 14px;
  text-align:center;
  color:#5a6675;
}
.admission-adm .photo_adm{
  position:relative;
  margin:14px 0;
  border-radius:4px;
  overflow:hidden;
  box-shadow:0 14px 28px rgba(13,38,76,.12);
}
.admission-adm .photo_adm::before,
.admission-adm .photo_adm::after{
  content:"";
  position:absolute;
  left:0; right:0;
  height:6px;
  background:var(--eco-green);
  z-index:1;
}
.admission-adm .photo_adm::before{ top:0; }
.admission-adm .photo_adm::after{ bottom:0; }
.admission-adm .photo_adm img{
  display:block;
  width:100%;
  height:var(--adm-photo-h);
  object-fit:cover;
  object-position:center;
}
.admission-adm .sub_adm{
  margin:16px 0 6px;
  text-align:center;
  color:var(--eco-blue);
  font-weight:300;
  letter-spacing:var(--letter-spacing-body);
  font-size:clamp(22px,3.4vw,36px);
}
.admission-adm .copy_adm{
  max-width:860px;
  margin:0 auto;
  color:#4a5663;
  text-align:center;
}
.admission-adm .side_title_adm{
  margin:10px 0 12px;
  color:var(--eco-blue);
  font-weight:300;
  letter-spacing:var(--letter-spacing-body);
  font-size:clamp(22px,3.2vw,32px);
  text-align:left;
}
.admission-adm .row_adm{
  display:grid;
  grid-template-columns:80px 1fr;
  gap:12px;
  align-items:stretch;
  min-height:var(--adm-row-h);
  width:100%;
  margin:10px 0 14px;
}
.admission-adm .row_adm:hover .card_adm{
  background:var(--eco-ink);
  cursor:pointer;
  transition:.35s ease;
}
.admission-adm .badge_adm{
  align-self:center;
  justify-self:center;
  width:64px; height:64px;
  border-radius:50%;
  display:grid; place-items:center;
  color:var(--eco-blue);
  background:
    linear-gradient(#fff,#fff) padding-box,
    radial-gradient(circle at 50% 50%, #b8d8ef, #7fb4da) border-box;
  border:6px solid transparent;
}
.admission-adm .badge_adm-icon{
  width:28px;
  height:28px;
  display:block;
  object-fit:contain;
}
.admission-adm .card_adm{
  position:relative;
  background:#3a8fc8;
  color:#eaf4fc;
  border-radius:6px;
  padding:12px 60px 12px 14px;
  box-shadow:0 12px 26px rgba(13,38,76,.12);
  height:100%;
  display:flex;
  flex-direction:column;
}
.admission-adm .card_head_adm{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:0 0 6px;
}
.admission-adm .card_link_adm{
  color:#fff;
  text-decoration:underline;
  text-underline-offset:3px;
  font-weight:300;
}
.admission-adm .card_num_adm{
  position:absolute; right:10px; top:10px;
  display:inline-grid; place-items:center;
  width:46px; height:34px;
  border-radius:6px;
  background:#e7f1f9; color:#2a6e9d;
  font-weight:300;
}
.admission-adm .card_list_adm{
  margin:0;
  padding-left:1.1em;
  display:grid;
  gap:6px;
  overflow:hidden;
}
.admission-adm .card_list_adm li{
  color:#fff;
  line-height:1.55;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:5;
  line-clamp:5;
  overflow:hidden;
}
@media (max-width:1024px){
  .admission-adm{ --adm-row-h:clamp(140px,28vw,200px); }
  .admission-adm .grid_adm{ grid-template-columns:1fr; }
  .admission-adm .side_title_adm{ text-align:center; }
  .admission-adm .row_adm{ grid-template-columns:64px 1fr; gap:10px; }
}
@media (min-width:1024px){
  .admission-adm .right_adm{ align-self:center; }
}
/* =====================
   FAQ
   ===================== */
.faq{ padding:24px 0 40px; }
.faq__container{ width:min(92vw,1200px); margin:0 auto; }
.faq__title{ text-align:center; color:var(--eco-blue); font-weight:300; letter-spacing:var(--letter-spacing-body); margin:0 0 18px; font-size:clamp(2.4rem,6vw,3.6rem); }
.faq__list{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.faq__list>li{ background:var(--card); border-radius:14px; box-shadow:0 10px 26px rgba(15,23,42,.08); overflow:hidden; transition:transform .18s ease; }
.faq__list>li.is-open{ transform:translateY(-1px); }
.faq__q{ display:block; position:relative; cursor:pointer; user-select:none; padding:14px 46px 14px 14px; color:#0f172a; font-weight:300; line-height:1.35; margin:0; font-size:1.2rem; }
.faq__q::after,.faq__q::before{ content:""; position:absolute; right:14px; top:50%; width:18px; height:2px; background:#9aa3af; border-radius:2px; transform:translateY(-50%); transition:transform .18s ease, background .18s ease; }
.faq__q::before{ transform:translateY(-50%) rotate(90deg); }
.faq__list>li.is-open .faq__q::before{ transform:translateY(-50%) rotate(45deg); background:#6b7684; }
.faq__list>li.is-open .faq__q::after{ transform:translateY(-50%) rotate(-45deg); background:#6b7684; }
.faq__a{ padding:0 14px 14px; color:#6b7280; font-size:1.2rem; line-height:1.9; border-top:1px solid rgba(15,23,42,.06); overflow:hidden; max-height:0; opacity:0; transition:max-height 160ms ease, opacity 200ms ease; margin-left:10px; }
.faq__a strong{ font-weight:700; color:var(--eco-gray); }
.faq__label{ display:block; font-weight:700; color:var(--eco-gray); margin:0 0 6px; font-size:1.05rem; }
.faq__label--inline{ display:inline; margin:0; font-size:inherit; }
.faq__list>li.is-open .faq__a{ max-height:1000px; opacity:1; }
.faq__q:focus-visible{ outline:2px solid #4197CB; outline-offset:4px; border-radius:10px; }

/* =====================
   Calendar (scoped)
   ===================== */
.cal-wrap_calendar{max-width:980px;margin:24px auto;padding:0 16px}
.card_calendar{background:#fff;border-radius:10px;box-shadow:0 16px 40px rgba(10,22,49,.08);overflow:hidden}
.head_calendar{position:relative;display:grid;grid-template-columns:120px 1fr auto;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--grid)}
.year_calendar{color:var(--muted);font-weight:300;display:flex;align-items:center;gap:8px}
.month_calendar{justify-self:center;font-weight:300;letter-spacing:.06em;text-transform:uppercase}
.controls_calendar{display:flex;gap:8px}
.btn_calendar{height:34px;display:grid;place-items:center;border-radius:6px;border:0;cursor:pointer;padding:0 12px}
.prev_calendar{width:34px;background:#eef3f8;color:#3b4a68}
.next_calendar{width:34px;background:#0B4A82;color:#fff}
.today_calendar{background:#fff;border:1px solid var(--grid);color:#1f2a44}
.today_calendar:hover{box-shadow:0 0 0 3px rgba(11,74,130,.15)}
.weekdays_calendar{display:grid;grid-template-columns:repeat(7,1fr);padding:8px 10px;color:var(--muted);font-weight:300}
.grid_calendar{display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:64px;border-top:1px solid var(--grid);border-left:1px solid var(--grid)}
.cell_calendar{position:relative;background:#fff;border-right:1px solid var(--grid);border-bottom:1px solid var(--grid);overflow:hidden}
.cell_calendar.empty_calendar{background:#fafcff}
.num_calendar{position:absolute;right:6px;top:6px;font-weight:300;color:#2b3550;font-size:12px}
.cell_calendar.is-today_calendar{ outline:2px solid #ef4444; outline-offset:-2px; }
.cell_calendar.is-today_calendar .num_calendar{ color:#ef4444; }
.dots_calendar{position:absolute;left:6px;bottom:6px;display:flex;gap:5px}
.dot_calendar{width:8px;height:8px;border-radius:50%;display:inline-block;}
.bar_calendar{ position:absolute; height:4px; bottom:16px; background:#ddd; border-radius:3px; }
.bar_calendar.cap-left_calendar{ border-top-left-radius:6px; border-bottom-left-radius:6px; }
.bar_calendar.cap-right_calendar{ border-top-right-radius:6px; border-bottom-right-radius:6px; }
.tooltip_calendar{ position:fixed; z-index:1000; pointer-events:none; background:#fff; border:1px solid var(--grid); border-radius:10px; box-shadow:0 16px 40px rgba(10,22,49,.08); padding:8px 10px; min-width:200px; max-width:86vw; opacity:0; transform:translateY(-6px); transition:opacity .12s ease, transform .12s ease; }
.tooltip_calendar.show_calendar{ opacity:1; transform:translateY(0); }
.tooltip_calendar h4{ margin:0 0 6px; font-size:12px; color:var(--muted); }
.trow_calendar{ display:flex; gap:8px; align-items:flex-start; font-size:13px; padding:6px 0; border-top:1px solid #edf2f7; }
.trow_calendar:first-of-type{ border-top:0; }
.trow_calendar .dot_calendar{ width:9px; height:9px; border-radius:50%; margin-top:4px; flex:none; }
.legend_calendar{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; padding:10px; border-top:1px solid var(--grid); background:#fff; }
.legend__title_calendar{ margin-right:6px; color:var(--muted); font-weight:300; font-size:12px; letter-spacing:var(--letter-spacing-body); }
.legend__item_calendar{ display:inline-flex; align-items:center; gap:6px; padding:6px 8px; border:1px solid var(--grid); border-radius:7px; font-size:12px; white-space:nowrap; }

/* =====================
   Footer
   ===================== */
 .campus-body{
  display:none;
  max-height:0;
  overflow:hidden;
  transition:max-height .28s ease;
}

.camp-card.open .campus-body{
  display:block;
  margin-top:6px;
  max-height:500px;
}



/* =====================================================
   TABLET >=768px
   ===================================================== */
@media (min-width:768px){
  .header{ height:126px; padding:15px 30px; }
  .logo-img{ height:86px; }
  .hamburger{ display:none; }
  .menu{ display:flex; }

  .hero-slider{ height:56vh; min-height:420px; }
  .grid.cards{ grid-template-columns:repeat(2,1fr); }

  .eco-intro{ flex-direction:row; gap:24px; }
  .eco-photo img{ max-width:528px; }
  .eco-text{ text-align:center; }
  .eco-cards{ grid-template-columns:repeat(3,1fr); gap:20px; }

  .campuses-grid5{ grid-template-columns:repeat(3,minmax(220px,1fr)); gap:20px; }
  .campus-card__img{ aspect-ratio:16/9; }

  .programs-grid{ grid-template-columns:1.05fr 1fr; gap:24px; }
  .programs-heroimg{ min-height:300px; }

  .why-grid{ width:min(1180px,92vw); margin:0 auto; display:grid; grid-template-columns:minmax(0,540px) minmax(0,1fr); gap:48px; align-items:center; justify-content:center; }
  .why-features{ display:grid; grid-template-columns:repeat(2, minmax(0, 260px)); gap:24px 28px; justify-content:center; }

  .admission-grid{ grid-template-columns:1.05fr 1fr; gap:24px 32px; }
  .step{ grid-template-columns:94px 1fr; gap:12px; }
  .step-icon{ width:94px; height:94px; }
  .step-card{ padding:16px 66px 16px 18px; }
  .step-num{ right:14px; }

  .footer-top{ grid-template-columns:1fr 320px; align-items:start; gap:22px; }
  .campuses{ grid-template-columns:repeat(3, minmax(220px,1fr)); gap:18px; }

  /* Calendar taller rows on tablet */
  .grid_calendar{ grid-auto-rows:90px; }
  .num_calendar{ right:8px; top:8px; font-size:13px; }
  .bar_calendar{ height:5px; bottom:18px; }
  .dots_calendar{ gap:6px; left:8px; bottom:8px; }
}
/* =====================================================
   DESKTOP >=1024px
   ===================================================== */
@media (min-width:1024px){
  .header{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:120;
    padding:0;
    height:auto;
    background:transparent;
    backdrop-filter:none;
  }
  .header .container{
    width:100%;
    margin:0;
    max-width:none;
    padding:12px clamp(24px,3vw,40px);
    border-radius:0;
    background:var(--nav-brand);
    box-shadow:0 6px 24px rgba(13,38,76,.15);
    align-items:center;
    gap:28px;
    transition:background .35s ease, box-shadow .35s ease, transform .35s ease, padding .2s ease;
  }
  .nav-soft .header .container{
    background:color-mix(in srgb, var(--nav-brand) 35%, transparent 65%);
    box-shadow:0 10px 28px rgba(13,38,76,.12);
    padding:10px clamp(22px,2.8vw,36px);
  }
  .nav-soft .header .container:hover,
  .nav-soft .header .container:focus-within{
    background:var(--nav-brand);
    box-shadow:0 14px 36px rgba(13,38,76,.24);
  }
  .logo{ gap:12px; }
  .logo-img{ height:96px; width:auto; }
  .nav{ margin-left:auto; }
  .menu{ display:flex; align-items:center; gap:28px; }
  .menu-link{
    position:relative;
    display:inline-flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
    padding:8px .75rem;
    background:none;
    color:#fff;
    font-weight:300;
    font-size:1.1rem;
    text-shadow:none;
    transition:color .2s ease;
  }
  .menu-link::after{
    content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px;
    background:currentColor; transform:scaleX(0); transform-origin:left; opacity:.45;
    transition:transform .25s ease, opacity .25s ease;
  }
  .menu-link:hover::after,
  .menu-link:focus-visible::after,
  .has-sub.open>.menu-link::after{
    transform:scaleX(1);
    opacity:.75;
  }
  .menu-link:hover,
  .menu-link:focus-visible{ color:var(--eco-dark); }
  .menu-icon{
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
  }
  .menu-icon img{
    width:34px;
    height:34px;
    object-fit:contain;
    filter:brightness(0) invert(1);
  }
  .menu-title{ font-size:1.1rem; }
  .menu-caret{
    font-size:.7rem;
    margin-left:6px;
    color:inherit;
    opacity:.7;
    line-height:1;
    position:relative;
    top:1px;
  }
  .hero-slider{ height:72vh; min-height:520px; margin-top:0; }

  .grid.cards{ grid-template-columns:repeat(3,1fr); }

  .section{ padding:3rem 0; }
  .section-title{ font-size:3.2rem; }

  .campuses-hero__inner{ width:min(1400px,95vw); margin:0 auto; padding:40px 0; display:flex; flex-direction:column; gap:24px; align-items:center; justify-content:center; text-align:center; }
  .campuses-grid5{ grid-template-columns:repeat(5,minmax(260px,1fr)); gap:24px; }
  .campus-card:hover{ transform:translateY(-4px); }
  .campus-card__cap{ padding:0; }

  
  .programs-heroimg{ min-height:360px; }

  .why-title{ text-align:center; font-size:clamp(2.4rem,6vw,3.6rem); color:var(--eco-blue); margin-bottom:24px; font-weight:300; }
  .why-grid{ width:min(1400px,95vw); justify-items:center; align-items:center; }
  .why-photo{ margin:0 auto; }
  .why-features{ display:grid; grid-template-columns:repeat(2, minmax(0, 660px)); gap:36px 44px; justify-content:center; margin:0 auto; }

  .adm-title{ font-size:3.8rem; }
  .tour-title,.enroll-title{ font-size:2.2rem; }

  .campuses{ grid-template-columns:repeat(4, minmax(220px,1fr)); gap:26px; }
  .footer-top{ padding:18px 0; }

  /* Calendar large */
  .grid_calendar{ grid-auto-rows:110px; }
  .bar_calendar{ height:6px; bottom:24px; }
  .num_calendar{ right:10px; top:8px; font-size:14px; }
}

/* Hero title emphasis */
#about-title{ white-space:nowrap; font-size:clamp(2.5rem,6vw,4rem); letter-spacing:.05em; max-width:100%; }
@media (max-width:600px){
  #about-title{
    font-size:clamp(1.6rem,7vw,2.2rem);
    white-space:normal;
  }
}









@media (max-width:640px){
  .eco-cards .card p{ justify-content:center; min-height:auto; }
}
@media (max-width:640px){
  .why{ margin:0 10px; }
  .why .container{ width:100%; margin:0 auto; }
  .why-grid{ width:100%; margin:0; justify-items:center; }
  .why-features{ grid-template-columns:repeat(2,minmax(150px,1fr)); gap:16px; justify-content:center; }
  .why-feature{ flex-direction:row; justify-content:flex-start; align-items:center; width:100%; padding:12px 16px; gap:10px; }
  .why-feature img{ width:44px; height:44px; padding:8px; }
  .why-feature span{ max-width:100%; font-size:.95rem; text-align:left; display:block; line-height:1.45; -webkit-line-clamp:unset; text-overflow:clip; overflow:visible; }
  .why-photo img{ aspect-ratio:3/4; }
}
@media (max-width:1024px){}

/* =====================
   EYP Section
   ===================== */

.eyp{
  font-family:var(--font-family-base);
  color:var(--eco-gray);
  letter-spacing:var(--letter-spacing-body);
}

.eyp-intro{
  font-size:1.2rem;
  line-height:1.75;
  margin-bottom:26px;
  text-align: center;
}

.eyp-subtitle{
  font-size:1.6rem;
  font-weight:300;
  color:var(--eco-blue);
  margin:28px 0 16px;
  text-align: center;
}

.eyp-features{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  justify-items:center;
  align-items:start;
  gap:28px 36px;
  padding:10px 0 24px;
  margin:0;
}
.eyp-features.cols-5{
  grid-template-columns:repeat(5,minmax(0,1fr));
}

.eyp-features .feat{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  text-align:center;
  font-size:0.98rem;
  width:100%;
  max-width:260px;
}

.eyp-features .feat img{
  height:120px;
  width:auto;
  max-width:140px;
  object-fit:contain;
}
.eyp-features .feat img[src*="School Code Of Conduct Poster"]{
  height:150px;
  max-width:170px;
}

.eyp-features .feat span{
  font-size:1.2rem;
  font-weight:300;
  color:var(--eco-blue);
}
.eyp-goals-block{
  background:var(--nav-brand-soft);
  border-radius:12px;
  padding:32px clamp(1.5rem,6vw,48px);
  width:min(100%,1000px);
  margin:28px auto 40px;
  color:#433f36;
  box-shadow:0 10px 28px rgba(13,38,76,.08);
}
.eyp-goals-block__title{
  font-size:1.8rem;
  margin:0 0 12px;
  color:var(--eco-blue);
  text-align:center;
  text-decoration:underline;
  text-underline-offset:6px;
}
.eyp-goals-block__intro{
  margin:18px 0 16px;
  font-size:1.2rem;
  color:#4c4437;
  font-weight:600;
}
@media (min-width:1201px){
  .eyp-features.eyp-features--grid{
    grid-template-columns:repeat(8,minmax(0,1fr));
  }
  .eyp-features.eyp-features--grid .feat{
    grid-column:span 2;
  }
  .eyp-features.eyp-features--grid > li:nth-last-child(3):nth-child(4n+1){
    grid-column:2 / span 2;
  }
  .eyp-features.eyp-features--grid > li:nth-last-child(2):nth-child(4n+2){
    grid-column:4 / span 2;
  }
  .eyp-features.eyp-features--grid > li:last-child:nth-child(4n+3){
    grid-column:6 / span 2;
  }
}


.eyp-goals{
  margin:0 0 28px;
  padding:0 0 0 1.5rem;
  font-size:1.2rem;
  line-height:1.8;
  color:inherit;
  margin-top:12px;
}

.eyp-goals li{ margin-bottom:8px; }

@media (max-width:768px){
  .eyp-features{ gap:28px; }
  .eyp-features .feat{ max-width:260px; }
}










@media (max-width:1024px){
  .eyp-features{ grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:28px; row-gap:32px;}
}
@media (max-width:768px){
  .eyp-features{ display:flex; gap:24px; flex-wrap:wrap; justify-content:center; }
  .eyp-features .feat{ max-width:260px; }
}


@media (max-width:1200px){
  .eyp-features{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:900px){
  .eyp-features{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px){
  .eyp-features{ display:flex; flex-direction:column; align-items:center; gap:24px; }
  .eyp-features .feat{ max-width:260px; }
}

/* =====================
   Responsive Font Sizes
   ===================== */
@media (max-width:640px){
  body{
  font-family:var(--font-family-base);
  font-size:var(--font-size-base);
  font-weight:var(--font-weight-regular);
  color:var(--eco-gray);
  background:var(--bg);
  line-height:var(--line-height-base);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  letter-spacing:var(--letter-spacing-body);
}
  h1{ font-size:2.25rem; }
  h2{ font-size:1.8rem; }
  h3{ font-size:1.45rem; }
  h4{ font-size:1.25rem; }
  h5{ font-size:1.1rem; }
  h6{ font-size:1rem; }
  .why-title,
  .adm-title,
  .tour-title,
  .enroll-title,
  .programs-title,
  .faq__title{ font-size:1.8rem; }
  .eyp-subtitle,
  .news__title,
  
  .eyp-intro,
  .eyp-goals li,
  .program-item__sub,
  .news-card__excerpt,
  .eco-text {font-size:1rem; padding:10px;}
  .why-feature span,
  .program-item__title,
  .adm-lead,
  .tour-copy,
  .step-heading,
  .step-points li{ font-size:0.95rem; }
  .why-feature span{ line-height:1.5; }
}
@media (max-width:640px){
  .campuses-hero{ width:100% !important; left:auto !important; right:auto !important; margin:0 !important; height:auto !important; min-height:0 !important; overflow:visible !important; padding:0 0 20px; }
  .campuses-grid5{ display:flex !important; flex-direction:column !important; align-items:center !important; gap:22px !important; margin:0 auto !important; padding:24px 0 16px !important; width:100%; max-width:360px; }
  .campus-card{ width:100%; margin:0 auto; border-radius:16px; box-shadow:0 12px 26px rgba(15,23,42,.12); transition:transform .18s ease, box-shadow .18s ease; }
  .campus-card:hover{ transform:translateY(-8px); box-shadow:0 16px 28px rgba(15,23,42,.16); }
  .campus-card__img{ width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; border-radius:16px 16px 0 0; }
}


@media (max-width:640px){
  .faq__q{ font-size:.95rem; }
  .faq__a{ font-size:.95rem; }
}
.home-news{background:var(--bg);}










































.admission-adm .copy_adm{ font-weight:300; }
















