/* =============================================================
   School of Stars — Master Design System
   Modern, elegant, simple & clean special education website
   ============================================================= */

/* --- Google Fonts --- */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Inter:wght@300;400;500;600;700&display=swap');

/* ================================================================
   CSS VARIABLES — Design Tokens
   ================================================================ */
:root {
  /* Brand Colors (from Logo) */
  --brand-navy:    #1a2a5e;
  --brand-navy-light: #263b7e;
  --brand-orange:  #f97316;
  --brand-orange-dark: #ea580c;

  /* Simple Harmonious Palette */
  --color-primary:   #1a2a5e;
  --color-accent:    #f97316;
  --color-blue:      #2563eb;
  --color-teal:      #0284c7;
  --color-emerald:   #059669;

  /* Clean Gradients */
  --grad-hero:       linear-gradient(135deg, #1a2a5e 0%, #263b7e 100%);
  --grad-accent:     linear-gradient(135deg, #f97316 0%, #ea580c 100%);
  --grad-primary:    linear-gradient(135deg, #1a2a5e 0%, #2563eb 100%);

  /* Neutrals */
  --white:         #ffffff;
  --gray-50:       #f8fafc;
  --gray-100:      #f1f5f9;
  --gray-200:      #e2e8f0;
  --gray-300:      #cbd5e1;
  --gray-400:      #94a3b8;
  --gray-500:      #64748b;
  --gray-600:      #475569;
  --gray-700:      #334155;
  --gray-800:      #1e293b;
  --gray-900:      #0f172a;

  /* Typography */
  --font-heading:  'Outfit', sans-serif;
  --font-body:     'Inter', sans-serif;

  /* Spacing */
  --section-py:    5rem;
  --container-px:  1.25rem;

  /* Borders */
  --radius-sm:     0.5rem;
  --radius-md:     1rem;
  --radius-lg:     1.5rem;
  --radius-xl:     2rem;
  --radius-full:   9999px;

  /* Shadows */
  --shadow-sm:     0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
  --shadow-md:     0 4px 16px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.04);
  --shadow-lg:     0 10px 30px rgba(0,0,0,.10), 0 4px 12px rgba(0,0,0,.05);
  --shadow-xl:     0 20px 50px rgba(0,0,0,.12);

  /* Transitions */
  --transition:    all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

  /* Navbar */
  --navbar-h:      72px;
  --topbar-h:      44px;
}

/* ================================================================
   RESET & BASE
   ================================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body { font-family: var(--font-body); color: var(--gray-800); background: var(--white); line-height: 1.7; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: var(--transition); }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

h1,h2,h3,h4,h5,h6 { font-family: var(--font-heading); font-weight: 700; line-height: 1.2; color: var(--gray-900); }
h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); }
h2 { font-size: clamp(1.8rem, 4vw, 2.8rem); }
h3 { font-size: clamp(1.4rem, 3vw, 2rem); }
h4 { font-size: 1.25rem; }
p { color: var(--gray-600); line-height: 1.8; }

/* ================================================================
   LAYOUT
   ================================================================ */
.container { max-width: 1200px; margin: 0 auto; padding: 0 var(--container-px); }
.container-wide { max-width: 1400px; margin: 0 auto; padding: 0 var(--container-px); }
.section { padding: var(--section-py) 0; }
.section-sm { padding: 3rem 0; }
.text-center { text-align: center; }
.bg-gray { background: var(--gray-50); }
.bg-white { background: var(--white); }

.section-header { text-align: center; margin-bottom: 3.5rem; }

.section-label {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--font-heading); font-size: .8rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  padding: .35rem 1rem; border-radius: var(--radius-full); margin-bottom: 1rem;
  background: rgba(26,42,94,.08);
  color: var(--brand-navy); border: 1px solid rgba(26,42,94,.15);
}

.section-title { font-size: clamp(1.9rem,4vw,2.8rem); font-weight: 800; color: var(--gray-900); line-height: 1.15; margin-bottom: 1rem; }
.section-subtitle { font-size: 1.1rem; color: var(--gray-500); max-width: 640px; margin: 0 auto; line-height: 1.7; }

.section-divider { width: 60px; height: 4px; background: var(--brand-orange); border-radius: var(--radius-full); margin: .75rem auto 0; }

/* ================================================================
   BUTTONS
   ================================================================ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .75rem 1.75rem; font-family: var(--font-heading); font-size: .95rem;
  font-weight: 600; border-radius: var(--radius-full); transition: var(--transition);
  white-space: nowrap; position: relative; overflow: hidden;
}
.btn::before { content:''; position:absolute; inset:0; background:rgba(255,255,255,.15); opacity:0; transition:var(--transition); }
.btn:hover::before { opacity:1; }
.btn-primary { background:var(--grad-accent); color:var(--white); box-shadow:0 4px 16px rgba(249,115,22,.3); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(249,115,22,.4); color:var(--white); }
.btn-outline { background:transparent; color:var(--white); border:2px solid rgba(255,255,255,.7); }
.btn-outline:hover { background:var(--white); color:var(--brand-navy); transform:translateY(-2px); }
.btn-dark { background:var(--brand-navy); color:var(--white); box-shadow:0 4px 16px rgba(26,42,94,.25); }
.btn-dark:hover { background:var(--brand-navy-light); transform:translateY(-2px); color:var(--white); }
.btn-teal { background:var(--color-teal); color:var(--white); box-shadow:0 4px 16px rgba(2,132,199,.25); }
.btn-teal:hover { background:#0369a1; transform:translateY(-2px); color:var(--white); }
.btn-violet { background:var(--brand-navy); color:var(--white); box-shadow:0 4px 16px rgba(26,42,94,.25); }
.btn-violet:hover { background:var(--brand-orange); transform:translateY(-2px); color:var(--white); }
.btn-lg { padding:1rem 2.5rem; font-size:1.05rem; }
.btn-sm { padding:.5rem 1.25rem; font-size:.875rem; }

/* ================================================================
   TOPBAR
   ================================================================ */
.topbar { background:var(--brand-navy); color:rgba(255,255,255,.85); font-size:.82rem; font-family:var(--font-heading); height:var(--topbar-h); display:flex; align-items:center; position:relative; z-index:1001; }
.topbar .container { display:flex; align-items:center; justify-content:space-between; width:100%; }
.topbar-left,.topbar-right { display:flex; align-items:center; gap:1.5rem; }
.topbar-item { display:flex; align-items:center; gap:.4rem; color:rgba(255,255,255,.75); }
.topbar-item i { color:var(--brand-orange); font-size:.85rem; }
.topbar-item a:hover { color:var(--brand-orange); }
.topbar-cta { background:var(--brand-orange); color:var(--white); padding:.3rem 1rem; border-radius:var(--radius-full); font-weight:600; font-size:.8rem; transition:var(--transition); }
.topbar-cta:hover { background:var(--brand-orange-dark); transform:scale(1.04); color:var(--white); }

/* ================================================================
   NAVBAR
   ================================================================ */
.navbar { position:sticky; top:0; z-index:1000; background:var(--white); box-shadow:var(--shadow-sm); height:var(--navbar-h); transition:var(--transition); }
.navbar.scrolled { box-shadow:var(--shadow-md); height:64px; }
.navbar .container { display:flex; align-items:center; justify-content:space-between; height:100%; }
.navbar-brand { display:flex; align-items:center; gap:.75rem; }
.navbar-brand img { height:50px; width:auto; }
.navbar-brand-text { display:flex; flex-direction:column; line-height:1.2; }
.navbar-brand-name { font-family:var(--font-heading); font-size:1.1rem; font-weight:800; color:var(--brand-navy); }
.navbar-brand-tagline { font-size:.7rem; color:var(--gray-500); font-weight:500; letter-spacing:.04em; }
.navbar-nav { display:flex; align-items:center; gap:.25rem; }
.nav-link { display:flex; align-items:center; gap:.3rem; padding:.5rem .875rem; font-family:var(--font-heading); font-size:.9rem; font-weight:500; color:var(--gray-700); border-radius:var(--radius-sm); transition:var(--transition); position:relative; }
.nav-link::after { content:''; position:absolute; bottom:4px; left:50%; transform:translateX(-50%); width:0; height:2px; background:var(--brand-orange); border-radius:var(--radius-full); transition:var(--transition); }
.nav-link:hover,.nav-link.active { color:var(--brand-navy); }
.nav-link:hover::after,.nav-link.active::after { width:calc(100% - 1.75rem); }
.navbar-cta { background:var(--grad-accent) !important; color:var(--white) !important; padding:.55rem 1.5rem; border-radius:var(--radius-full); font-weight:700; box-shadow:0 4px 16px rgba(249,115,22,.3); }
.navbar-cta:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(249,115,22,.4); }
.navbar-cta::after { display:none; }
.navbar-toggle { display:none; flex-direction:column; gap:5px; padding:.5rem; cursor:pointer; }
.navbar-toggle span { display:block; width:24px; height:2px; background:var(--gray-700); border-radius:2px; transition:var(--transition); }
.navbar-toggle.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.navbar-toggle.open span:nth-child(2) { opacity:0; }
.navbar-toggle.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* ================================================================
   HERO
   ================================================================ */
.hero {
  position: relative;
  min-height: calc(100vh - var(--topbar-h) - var(--navbar-h));
  min-height: 580px;
  background: var(--brand-navy);
  overflow: hidden;
  display: flex;
  align-items: center;
}

.hero-bg-shapes { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.hero-shape { position: absolute; border-radius: 50%; opacity: .1; filter: blur(70px); animation: floatShape 8s ease-in-out infinite alternate; }
.hero-shape-1 { width: 500px; height: 500px; background: var(--brand-orange); top: -150px; right: -100px; animation-duration: 9s; }
.hero-shape-2 { width: 400px; height: 400px; background: var(--color-blue); bottom: -100px; left: -100px; animation-duration: 11s; animation-direction: alternate-reverse; }

@keyframes floatShape { from{transform:translate(0,0) scale(1);} to{transform:translate(25px,15px) scale(1.08);} }

.hero-split-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  align-items: center;
  gap: 4rem;
  padding: 4.5rem 0;
  width: 100%;
}

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  color: rgba(255,255,255,.9);
  font-family: var(--font-heading);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .4rem 1rem;
  border-radius: var(--radius-full);
  margin-bottom: 1.5rem;
}

.hero-badge .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-orange);
  animation: pulse 2s infinite;
}

.hero-title {
  color: var(--white);
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  font-weight: 900;
  line-height: 1.15;
  margin-bottom: 1.5rem;
}

.hero-title span { color: var(--brand-orange); }

.hero-subtitle {
  color: rgba(255,255,255,.85);
  font-size: 1.08rem;
  line-height: 1.8;
  margin-bottom: 2.25rem;
  max-width: 620px;
}

.hero-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 2.5rem;
}

.hero-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}

.hero-chip {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  color: rgba(255,255,255,.9);
  font-size: .78rem;
  font-weight: 500;
  padding: .35rem .9rem;
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  gap: .4rem;
}

.hero-chip i { font-size: .75rem; color: var(--brand-orange); }

/* Hero Visual Column */
.hero-visual-col {
  position: relative;
}

.hero-img-frame {
  position: relative;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-xl);
}

.hero-img-main {
  width: 100%;
  height: 380px;
  object-fit: cover;
  border-radius: var(--radius-xl);
  border: 2px solid rgba(255,255,255,.15);
  box-shadow: var(--shadow-xl);
}

.hero-float-badge {
  position: absolute;
  background: var(--white);
  border-radius: var(--radius-md);
  padding: .85rem 1.15rem;
  box-shadow: var(--shadow-lg);
  display: flex;
  align-items: center;
  gap: .75rem;
  border: 1px solid var(--gray-100);
  animation: floatCard 4s ease-in-out infinite alternate;
}

.float-badge-1 { bottom: -20px; left: -25px; animation-delay: 0s; }
.float-badge-2 { top: 25px; right: -20px; animation-delay: 1s; }

.float-icon {
  width: 42px;
  height: 42px;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  background: var(--brand-navy);
  color: var(--brand-orange);
  flex-shrink: 0;
}

.hero-float-badge h6 {
  font-size: .82rem;
  font-weight: 700;
  color: var(--gray-900);
  line-height: 1.25;
}

.hero-float-badge p {
  font-size: .72rem;
  color: var(--gray-500);
  margin-top: .15rem;
  line-height: 1;
}

/* ================================================================
   STATS BAR
   ================================================================ */
.stats-bar { background:var(--white); box-shadow:var(--shadow-lg); border-radius:var(--radius-xl); margin:-2.5rem 0 0; position:relative; z-index:5; padding:2.5rem 3rem; display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; border:1px solid var(--gray-100); }
.stat-item { text-align:center; position:relative; }
.stat-item:not(:last-child)::after { content:''; position:absolute; right:0; top:20%; height:60%; width:1px; background:var(--gray-200); }
.stat-number { font-family:var(--font-heading); font-size:2.5rem; font-weight:900; color:var(--brand-navy); line-height:1; margin-bottom:.25rem; }
.stat-label { font-size:.85rem; color:var(--gray-500); font-weight:500; line-height:1.4; }
.stat-icon { width:44px; height:44px; border-radius:var(--radius-md); margin:0 auto .6rem; display:flex; align-items:center; justify-content:center; font-size:1.1rem; color:var(--white); background:var(--brand-navy); }

/* ================================================================
   ABOUT SNIPPET
   ================================================================ */
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.about-img-wrap { position:relative; }
.about-img-main { width:100%; border-radius:var(--radius-xl); object-fit:cover; height:440px; box-shadow:var(--shadow-xl); }
.about-img-badge { position:absolute; bottom:2rem; left:-1.5rem; background:var(--white); border-radius:var(--radius-lg); padding:1.25rem 1.5rem; box-shadow:var(--shadow-lg); display:flex; align-items:center; gap:1rem; border:1px solid var(--gray-100); }
.about-img-badge-icon { width:52px; height:52px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:1.4rem; color:var(--white); flex-shrink:0; background:var(--brand-navy); }
.about-img-badge h5 { font-weight:800; font-size:1.5rem; color:var(--gray-900); line-height:1; }
.about-img-badge p { font-size:.78rem; color:var(--gray-500); margin-top:.15rem; }
.about-features { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin:2rem 0; }
.about-feature { display:flex; align-items:flex-start; gap:.75rem; padding:.875rem; background:var(--gray-50); border-radius:var(--radius-md); border:1px solid var(--gray-100); transition:var(--transition); }
.about-feature:hover { background:var(--white); box-shadow:var(--shadow-md); transform:translateY(-2px); }
.about-feature-icon { width:36px; height:36px; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; font-size:.9rem; color:var(--white); flex-shrink:0; background:var(--brand-navy); }
.about-feature h6 { font-size:.875rem; font-weight:600; color:var(--gray-800); line-height:1.3; }
.about-feature p { font-size:.75rem; color:var(--gray-500); line-height:1.5; margin-top:.15rem; }

/* ================================================================
   THERAPY CARDS
   ================================================================ */
.therapy-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.5rem; }
.therapy-card { background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius-lg); padding:1.75rem; transition:var(--transition); position:relative; overflow:hidden; }
.therapy-card::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:var(--brand-navy); }
.therapy-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--brand-orange); }
.therapy-card:hover::before { background:var(--brand-orange); }
.therapy-card-icon { width:56px; height:56px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin-bottom:1rem; background:var(--gray-50); color:var(--brand-navy); border:1px solid var(--gray-200); }
.therapy-card h4 { font-size:1.05rem; font-weight:700; color:var(--gray-900); margin-bottom:.5rem; }
.therapy-card p { font-size:.875rem; color:var(--gray-500); line-height:1.6; }

/* ================================================================
   ICEP HIGHLIGHT (Indian Cognitive Enrichment Programme)
   ================================================================ */
.icep-highlight { background:var(--grad-hero); border-radius:var(--radius-xl); padding:4rem; color:var(--white); position:relative; overflow:hidden; }
.icep-highlight::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size:40px 40px; }
.icep-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; position:relative; z-index:2; }
.icep-label { display:inline-flex; align-items:center; gap:.5rem; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); color:rgba(255,255,255,.9); font-size:.75rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:.35rem .9rem; border-radius:var(--radius-full); margin-bottom:1rem; }
.icep-highlight h2 { color:var(--white); margin-bottom:1rem; }
.icep-highlight p { color:rgba(255,255,255,.8); margin-bottom:1.5rem; }
.icep-skills { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.icep-skill { display:flex; align-items:center; gap:.75rem; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); border-radius:var(--radius-md); padding:.875rem 1rem; }
.icep-skill i { color:var(--brand-orange); font-size:1.1rem; }
.icep-skill span { font-size:.875rem; font-weight:500; color:rgba(255,255,255,.9); }

/* ================================================================
   ROADMAP (Preview)
   ================================================================ */
.roadmap-steps { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; position:relative; }
.roadmap-steps::before { content:''; position:absolute; top:28px; left:10%; right:10%; height:3px; background:var(--gray-200); border-radius:var(--radius-full); }
.roadmap-step { flex:1; text-align:center; position:relative; z-index:2; }
.roadmap-step-num { width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--font-heading); font-size:1.1rem; font-weight:800; color:var(--white); margin:0 auto 1rem; box-shadow:var(--shadow-md); transition:var(--transition); background:var(--brand-navy); }
.roadmap-step:hover .roadmap-step-num { transform:scale(1.15); background:var(--brand-orange); }
.roadmap-step h5 { font-size:.85rem; font-weight:700; color:var(--gray-800); margin-bottom:.3rem; line-height:1.3; }
.roadmap-step p { font-size:.75rem; color:var(--gray-500); line-height:1.5; }

/* ================================================================
   GALLERY
   ================================================================ */
.gallery-filter { display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center; margin-bottom:2.5rem; }
.filter-btn { padding:.5rem 1.25rem; border-radius:var(--radius-full); font-family:var(--font-heading); font-size:.85rem; font-weight:600; border:1.5px solid var(--gray-200); color:var(--gray-600); background:var(--white); transition:var(--transition); cursor:pointer; }
.filter-btn:hover,.filter-btn.active { background:var(--brand-navy); border-color:var(--brand-navy); color:var(--white); }
.gallery-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem; }
.gallery-item { position:relative; border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/3; cursor:pointer; background:var(--gray-200); }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:var(--transition-slow); }
.gallery-item:hover img { transform:scale(1.08); }
.gallery-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(26,42,94,.8) 0%,transparent 60%); opacity:0; transition:var(--transition); display:flex; align-items:flex-end; padding:1rem; }
.gallery-item:hover .gallery-overlay { opacity:1; }
.gallery-overlay-content h5 { font-size:.9rem; font-weight:700; color:var(--white); }
.gallery-overlay-content p { font-size:.75rem; color:rgba(255,255,255,.8); }
.gallery-zoom { position:absolute; top:.75rem; right:.75rem; width:36px; height:36px; background:rgba(255,255,255,.9); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--brand-navy); font-size:.85rem; opacity:0; transform:scale(.8); transition:var(--transition); }
.gallery-item:hover .gallery-zoom { opacity:1; transform:scale(1); }

/* Lightbox */
.lightbox { display:none; position:fixed; inset:0; background:rgba(0,0,0,.92); z-index:9999; align-items:center; justify-content:center; padding:1.5rem; }
.lightbox.open { display:flex; }
.lightbox-img { max-width:90vw; max-height:85vh; border-radius:var(--radius-lg); object-fit:contain; box-shadow:var(--shadow-xl); animation:lbFade .25s ease; }
@keyframes lbFade { from{opacity:0;transform:scale(.95);} to{opacity:1;transform:scale(1);} }
.lightbox-close { position:absolute; top:1.5rem; right:1.5rem; width:44px; height:44px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); color:var(--white); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.1rem; cursor:pointer; transition:var(--transition); }
.lightbox-close:hover { background:rgba(255,255,255,.2); transform:rotate(90deg); }
.lightbox-nav { position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); color:var(--white); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.1rem; cursor:pointer; transition:var(--transition); }
.lightbox-nav:hover { background:rgba(255,255,255,.2); }
.lightbox-prev { left:1.5rem; }
.lightbox-next { right:1.5rem; }
.lightbox-caption { position:absolute; bottom:1.5rem; left:50%; transform:translateX(-50%); background:rgba(0,0,0,.6); color:var(--white); padding:.5rem 1.5rem; border-radius:var(--radius-full); font-size:.875rem; font-weight:500; white-space:nowrap; }

/* ================================================================
   TESTIMONIALS
   ================================================================ */
.testimonials-slider { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.testimonial-card { background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius-xl); padding:2rem; position:relative; transition:var(--transition); }
.testimonial-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-4px); border-color:transparent; }
.testimonial-card::before { content:'"'; position:absolute; top:1rem; right:1.5rem; font-size:5rem; color:var(--gray-100); font-family:Georgia,serif; line-height:1; pointer-events:none; }
.testimonial-stars { color:var(--brand-orange); margin-bottom:1rem; font-size:.9rem; }
.testimonial-text { font-size:.95rem; color:var(--gray-600); line-height:1.75; margin-bottom:1.5rem; font-style:italic; }
.testimonial-author { display:flex; align-items:center; gap:.875rem; }
.testimonial-avatar { width:48px; height:48px; border-radius:50%; object-fit:cover; border:2px solid var(--gray-200); }
.testimonial-info h6 { font-size:.95rem; font-weight:700; color:var(--gray-900); }
.testimonial-info span { font-size:.8rem; color:var(--gray-500); }
.testimonial-tag { display:inline-block; font-size:.68rem; font-weight:700; padding:.2rem .6rem; border-radius:var(--radius-full); margin-top:.3rem; background:rgba(26,42,94,.08); color:var(--brand-navy); }

/* ================================================================
   ENQUIRY FORM
   ================================================================ */
.enquiry-form-wrap { background:var(--grad-hero); border-radius:var(--radius-xl); padding:4rem; position:relative; overflow:hidden; }
.enquiry-form-wrap::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size:40px 40px; }
.enquiry-grid { display:grid; grid-template-columns:1fr 1.4fr; gap:4rem; align-items:center; position:relative; z-index:2; }
.enquiry-info h2 { color:var(--white); margin-bottom:1rem; }
.enquiry-info p { color:rgba(255,255,255,.8); margin-bottom:2rem; }
.enquiry-info-items { display:flex; flex-direction:column; gap:1rem; }
.enquiry-info-item { display:flex; align-items:center; gap:1rem; color:rgba(255,255,255,.85); font-size:.9rem; }
.enquiry-info-item i { width:38px; height:38px; background:rgba(255,255,255,.12); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; color:var(--brand-orange); flex-shrink:0; font-size:.95rem; }
.enquiry-form-box { background:var(--white); border-radius:var(--radius-xl); padding:2.5rem; box-shadow:var(--shadow-xl); }

/* ================================================================
   FORMS
   ================================================================ */
.form-group { margin-bottom:1.25rem; }
.form-label { display:block; font-size:.85rem; font-weight:600; color:var(--gray-700); margin-bottom:.4rem; font-family:var(--font-heading); }
.form-control { width:100%; padding:.75rem 1rem; border:1.5px solid var(--gray-200); border-radius:var(--radius-md); font-family:var(--font-body); font-size:.9rem; color:var(--gray-800); background:var(--gray-50); transition:var(--transition); outline:none; }
.form-control:focus { border-color:var(--brand-navy); background:var(--white); box-shadow:0 0 0 3px rgba(26,42,94,.1); }
.form-control::placeholder { color:var(--gray-400); }
textarea.form-control { resize:vertical; min-height:100px; }
.form-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-message { padding:.75rem 1rem; border-radius:var(--radius-md); font-size:.875rem; font-weight:500; margin-top:1rem; display:none; }
.form-message.success { display:block; background:rgba(5,150,105,.1); color:var(--color-emerald); border:1px solid rgba(5,150,105,.25); }
.form-message.error { display:block; background:rgba(239,68,68,.1); color:#dc2626; border:1px solid rgba(239,68,68,.25); }

/* ================================================================
   FAQ ACCORDION
   ================================================================ */
.faq-list { max-width:800px; margin:0 auto; }
.faq-item { border:1.5px solid var(--gray-200); border-radius:var(--radius-lg); margin-bottom:.75rem; overflow:hidden; transition:var(--transition); }
.faq-item.open { border-color:var(--brand-navy); box-shadow:0 0 0 3px rgba(26,42,94,.06); }
.faq-question { width:100%; padding:1.25rem 1.5rem; display:flex; align-items:center; justify-content:space-between; background:none; border:none; cursor:pointer; text-align:left; transition:var(--transition); }
.faq-question h5 { font-size:.95rem; font-weight:600; color:var(--gray-800); line-height:1.4; }
.faq-question:hover h5 { color:var(--brand-navy); }
.faq-icon { width:28px; height:28px; border-radius:50%; background:var(--gray-100); display:flex; align-items:center; justify-content:center; font-size:.8rem; color:var(--gray-500); flex-shrink:0; transition:var(--transition); }
.faq-item.open .faq-icon { background:var(--brand-navy); color:var(--white); transform:rotate(180deg); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .4s ease,padding .3s ease; }
.faq-answer-inner { padding:0 1.5rem 1.25rem; font-size:.9rem; color:var(--gray-600); line-height:1.75; }
.faq-item.open .faq-answer { max-height:400px; }

/* ================================================================
   BLOG
   ================================================================ */
.blog-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:2rem; }
.blog-card { background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius-xl); overflow:hidden; transition:var(--transition); }
.blog-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:transparent; }
.blog-card-img-wrap { overflow:hidden; }
.blog-card-img { width:100%; height:220px; object-fit:cover; transition:var(--transition-slow); }
.blog-card:hover .blog-card-img { transform:scale(1.04); }
.blog-card-body { padding:1.75rem; }
.blog-tag { display:inline-flex; align-items:center; gap:.35rem; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; padding:.3rem .75rem; border-radius:var(--radius-full); margin-bottom:.875rem; background:rgba(26,42,94,.08); color:var(--brand-navy); }
.blog-card-title { font-size:1.1rem; font-weight:700; color:var(--gray-900); line-height:1.4; margin-bottom:.625rem; transition:var(--transition); }
.blog-card:hover .blog-card-title { color:var(--brand-orange); }
.blog-card-excerpt { font-size:.875rem; color:var(--gray-500); line-height:1.7; margin-bottom:1.25rem; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.blog-meta { display:flex; align-items:center; gap:1rem; font-size:.78rem; color:var(--gray-400); border-top:1px solid var(--gray-100); padding-top:.875rem; }

/* ================================================================
   RESOURCES
   ================================================================ */
.resources-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.5rem; }
.resource-card { background:var(--white); border:1.5px solid var(--gray-200); border-radius:var(--radius-xl); padding:1.75rem; display:flex; align-items:flex-start; gap:1.25rem; transition:var(--transition); }
.resource-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--brand-navy); }
.resource-icon { width:54px; height:54px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:1.4rem; flex-shrink:0; background:var(--brand-navy); color:var(--brand-orange); }
.resource-card h5 { font-size:1rem; font-weight:700; color:var(--gray-900); margin-bottom:.25rem; line-height:1.35; }
.resource-card p { font-size:.825rem; color:var(--gray-500); line-height:1.55; margin-bottom:.75rem; }
.resource-size { font-size:.72rem; color:var(--gray-400); display:flex; align-items:center; gap:.3rem; margin-bottom:.75rem; }
.resource-download-btn { display:inline-flex; align-items:center; gap:.4rem; font-size:.8rem; font-weight:600; font-family:var(--font-heading); color:var(--brand-navy); padding:.4rem .875rem; border:1.5px solid var(--brand-navy); border-radius:var(--radius-full); transition:var(--transition); }
.resource-download-btn:hover { background:var(--brand-navy); color:var(--white); }

/* ================================================================
   CONTACT
   ================================================================ */
.contact-grid { display:grid; grid-template-columns:1fr 1.4fr; gap:3.5rem; }
.contact-info-cards { display:flex; flex-direction:column; gap:1.25rem; }
.contact-card { background:var(--white); border:1.5px solid var(--gray-200); border-radius:var(--radius-xl); padding:1.5rem; display:flex; align-items:flex-start; gap:1rem; transition:var(--transition); }
.contact-card:hover { box-shadow:var(--shadow-md); border-color:var(--brand-navy); transform:translateY(-2px); }
.contact-card-icon { width:48px; height:48px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:1.1rem; color:var(--white); flex-shrink:0; background:var(--brand-navy); }
.contact-card h5 { font-size:.9rem; font-weight:700; color:var(--gray-900); margin-bottom:.25rem; }
.contact-card p,.contact-card a { font-size:.875rem; color:var(--gray-600); line-height:1.55; }
.contact-card a:hover { color:var(--brand-orange); }
.map-wrap { border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-lg); border:1.5px solid var(--gray-200); height:320px; margin-top:1.25rem; }
.map-wrap iframe { width:100%; height:100%; border:none; display:block; }
.contact-form-wrap { background:var(--white); border:1.5px solid var(--gray-200); border-radius:var(--radius-xl); padding:2.5rem; box-shadow:var(--shadow-sm); }
.contact-form-wrap h3 { font-size:1.5rem; font-weight:700; color:var(--gray-900); margin-bottom:.5rem; }
.contact-form-wrap>p { font-size:.9rem; color:var(--gray-500); margin-bottom:2rem; }

/* ================================================================
   PAGE HERO (inner pages)
   ================================================================ */
.page-hero { background:var(--grad-hero); padding:5rem 0; position:relative; overflow:hidden; text-align:center; }
.page-hero::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size:40px 40px; }
.page-hero-content { position:relative; z-index:2; }
.page-hero h1 { color:var(--white); margin-bottom:.75rem; }
.page-hero p { color:rgba(255,255,255,.8); font-size:1.1rem; max-width:600px; margin:0 auto; }
.breadcrumb { display:flex; align-items:center; justify-content:center; gap:.5rem; margin-top:1.25rem; font-size:.85rem; color:rgba(255,255,255,.6); }
.breadcrumb a { color:rgba(255,255,255,.75); transition:var(--transition); }
.breadcrumb a:hover { color:var(--white); }

/* ================================================================
   FOOTER
   ================================================================ */
.footer { background:var(--gray-900); color:rgba(255,255,255,.7); padding:5rem 0 0; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:3rem; margin-bottom:4rem; }
.footer-brand-logo { display:flex; align-items:center; gap:.75rem; margin-bottom:1.25rem; }
.footer-brand-logo img { height:44px; width:auto; filter:brightness(1.1); }
.footer-brand-logo span { font-family:var(--font-heading); font-size:1.1rem; font-weight:800; color:var(--white); }
.footer-brand-desc { font-size:.875rem; line-height:1.8; margin-bottom:1.5rem; color:rgba(255,255,255,.6); }
.footer-socials { display:flex; gap:.75rem; }
.social-link { width:38px; height:38px; border-radius:var(--radius-sm); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.7); font-size:.9rem; transition:var(--transition); }
.social-link:hover { background:var(--brand-orange); border-color:var(--brand-orange); color:var(--white); transform:translateY(-3px); }
.footer-col h4 { font-family:var(--font-heading); font-size:1rem; font-weight:700; color:var(--white); margin-bottom:1.25rem; position:relative; padding-bottom:.75rem; }
.footer-col h4::after { content:''; position:absolute; bottom:0; left:0; width:30px; height:2px; background:var(--brand-orange); border-radius:var(--radius-full); }
.footer-links { display:flex; flex-direction:column; gap:.5rem; }
.footer-link { font-size:.875rem; color:rgba(255,255,255,.6); display:flex; align-items:center; gap:.5rem; transition:var(--transition); padding:.2rem 0; }
.footer-link:hover { color:var(--brand-orange); padding-left:.25rem; }
.footer-link i { font-size:.65rem; color:var(--brand-orange); }
.footer-contact-item { display:flex; align-items:flex-start; gap:.875rem; margin-bottom:1rem; font-size:.875rem; color:rgba(255,255,255,.65); }
.footer-contact-icon { width:32px; height:32px; background:rgba(255,255,255,.08); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; font-size:.85rem; color:var(--brand-orange); flex-shrink:0; margin-top:.1rem; }
.footer-contact-item a { color:rgba(255,255,255,.65); transition:var(--transition); }
.footer-contact-item a:hover { color:var(--brand-orange); }
.footer-bar { border-top:1px solid rgba(255,255,255,.08); padding:1.5rem 0; display:flex; align-items:center; justify-content:space-between; font-size:.8rem; color:rgba(255,255,255,.4); }
.footer-bar a { color:rgba(255,255,255,.5); transition:var(--transition); }
.footer-bar a:hover { color:var(--brand-orange); }
.footer-rainbow { height:4px; background:var(--brand-orange); }

/* ================================================================
   FLOATING BUTTONS
   ================================================================ */
.whatsapp-float { position:fixed; bottom:2rem; right:2rem; width:56px; height:56px; background:#25d366; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:var(--white); box-shadow:0 4px 20px rgba(37,211,102,.5); z-index:999; transition:var(--transition); animation:waPulse 3s infinite; }
.whatsapp-float:hover { transform:scale(1.12); box-shadow:0 8px 30px rgba(37,211,102,.6); color:var(--white); animation:none; }
@keyframes waPulse { 0%,100%{box-shadow:0 4px 20px rgba(37,211,102,.5);} 50%{box-shadow:0 4px 40px rgba(37,211,102,.8),0 0 0 8px rgba(37,211,102,.1);} }
.whatsapp-tooltip { position:absolute; right:calc(100% + 12px); top:50%; transform:translateY(-50%); background:var(--gray-800); color:var(--white); font-size:.78rem; font-weight:600; padding:.4rem .875rem; border-radius:var(--radius-full); white-space:nowrap; opacity:0; pointer-events:none; transition:var(--transition); }
.whatsapp-tooltip::after { content:''; position:absolute; left:100%; top:50%; transform:translateY(-50%); border:6px solid transparent; border-left-color:var(--gray-800); }
.whatsapp-float:hover .whatsapp-tooltip { opacity:1; }
.scroll-top { position:fixed; bottom:2rem; right:5.5rem; width:44px; height:44px; background:var(--brand-navy); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.9rem; color:var(--white); box-shadow:var(--shadow-md); z-index:999; transition:var(--transition); opacity:0; pointer-events:none; }
.scroll-top.visible { opacity:1; pointer-events:auto; }
.scroll-top:hover { background:var(--brand-orange); transform:translateY(-3px); color:var(--white); }

/* ================================================================
   ABOUT PAGE
   ================================================================ */
.values-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1.25rem; }
.value-card { text-align:center; padding:2rem 1.5rem; border-radius:var(--radius-xl); border:1.5px solid var(--gray-200); background:var(--white); transition:var(--transition); }
.value-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--brand-navy); }
.value-icon { width:64px; height:64px; border-radius:var(--radius-lg); margin:0 auto 1.25rem; display:flex; align-items:center; justify-content:center; font-size:1.6rem; color:var(--white); background:var(--brand-navy); }
.value-card h4 { font-size:1.05rem; font-weight:700; color:var(--gray-900); margin-bottom:.5rem; }
.value-card p { font-size:.85rem; color:var(--gray-500); line-height:1.6; }
.mothers-highlight { background:var(--gray-50); border:2px solid var(--gray-200); border-radius:var(--radius-xl); padding:3.5rem; position:relative; overflow:hidden; }
.mothers-highlight::before { content:'♡'; position:absolute; right:2rem; top:1rem; font-size:8rem; color:rgba(26,42,94,.05); line-height:1; }
.mothers-highlight h3 { color:var(--brand-navy); margin-bottom:1rem; }
.mothers-highlight p { color:var(--gray-700); font-size:1rem; }

/* ================================================================
   PROGRAMS PAGE
   ================================================================ */
.program-tabs { display:flex; gap:.5rem; border-bottom:2px solid var(--gray-200); margin-bottom:2.5rem; flex-wrap:wrap; }
.program-tab { padding:.75rem 1.5rem; font-family:var(--font-heading); font-size:.9rem; font-weight:600; color:var(--gray-500); cursor:pointer; border:none; background:none; border-bottom:3px solid transparent; margin-bottom:-2px; transition:var(--transition); display:flex; align-items:center; gap:.5rem; }
.program-tab:hover { color:var(--gray-800); }
.program-tab.active { color:var(--brand-navy); border-bottom-color:var(--brand-orange); }
.program-tab-panel { display:none; }
.program-tab-panel.active { display:block; animation:fadeIn .3s ease; }
@keyframes fadeIn { from{opacity:0;transform:translateY(8px);} to{opacity:1;transform:translateY(0);} }
.therapy-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; }
.therapy-detail-img { width:100%; height:360px; object-fit:cover; border-radius:var(--radius-xl); box-shadow:var(--shadow-lg); }
.therapy-outcomes { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-top:1.5rem; }
.therapy-outcome-item { display:flex; align-items:center; gap:.5rem; font-size:.85rem; color:var(--gray-700); font-weight:500; }
.therapy-outcome-item i { color:var(--color-emerald); font-size:.85rem; }

/* ================================================================
   ADMISSIONS PAGE
   ================================================================ */
.admissions-roadmap { max-width:900px; margin:0 auto; }
.roadmap-step-full { display:flex; gap:2rem; margin-bottom:1.5rem; position:relative; align-items:flex-start; }
.roadmap-step-full:not(:last-child)::after { content:''; position:absolute; left:35px; top:72px; width:2px; height:calc(100% + 1.5rem - 72px); background:var(--gray-200); z-index:0; }
.roadmap-num-wrap { flex-shrink:0; position:relative; z-index:1; }
.roadmap-num-circle { width:70px; height:70px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--font-heading); font-size:1.4rem; font-weight:900; color:var(--white); box-shadow:var(--shadow-md); background:var(--brand-navy); }
.roadmap-step-body { flex:1; background:var(--white); border:1.5px solid var(--gray-200); border-radius:var(--radius-xl); padding:1.75rem; transition:var(--transition); }
.roadmap-step-body:hover { box-shadow:var(--shadow-md); border-color:var(--brand-navy); transform:translateX(4px); }
.roadmap-step-body h4 { font-size:1.1rem; font-weight:700; color:var(--gray-900); margin-bottom:.5rem; }
.roadmap-step-body p { font-size:.9rem; color:var(--gray-500); line-height:1.7; }

/* ================================================================
   BLOG POST DETAIL
   ================================================================ */
.blog-post-body { max-width:800px; margin:4rem auto; padding:0 1.25rem; }
.blog-post-body h2,.blog-post-body h3 { color:var(--gray-900); margin:2rem 0 1rem; }
.blog-post-body p { color:var(--gray-600); font-size:1rem; line-height:1.85; margin-bottom:1.25rem; }
.blog-post-body ul,.blog-post-body ol { padding-left:1.5rem; margin-bottom:1.25rem; }
.blog-post-body ul { list-style:disc; }
.blog-post-body ol { list-style:decimal; }
.blog-post-body li { color:var(--gray-600); font-size:1rem; line-height:1.75; margin-bottom:.4rem; }
.blog-post-body img { width:100%; border-radius:var(--radius-xl); margin:2rem 0; box-shadow:var(--shadow-md); }
.blog-post-body blockquote { border-left:4px solid var(--brand-navy); padding:1.25rem 1.5rem; background:var(--gray-50); border-radius:0 var(--radius-md) var(--radius-md) 0; margin:1.75rem 0; font-style:italic; color:var(--gray-600); }

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width:1024px) {
  .hero-split-grid { grid-template-columns: 1fr; text-align: center; gap: 3rem; }
  .hero-subtitle { margin-left: auto; margin-right: auto; }
  .hero-btns { justify-content: center; }
  .hero-chips { justify-content: center; }
  .hero-visual-col { max-width: 520px; margin: 0 auto; width: 100%; }
  .stats-bar { grid-template-columns:repeat(2,1fr); gap:1.5rem; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:2.5rem; }
  .about-grid { grid-template-columns:1fr; gap:2.5rem; }
  .enquiry-grid { grid-template-columns:1fr; gap:2rem; }
  .contact-grid { grid-template-columns:1fr; }
  .testimonials-slider { grid-template-columns:1fr 1fr; }
  .icep-grid { grid-template-columns:1fr; gap:2rem; }
  .therapy-detail-grid { grid-template-columns:1fr; }
}

@media (max-width:768px) {
  :root { --section-py:3.5rem; }
  .topbar { display:none; }
  .navbar-nav { display:none; }
  .navbar-toggle { display:flex; }
  .navbar-nav.mobile-open { display:flex; flex-direction:column; position:fixed; top:var(--navbar-h); left:0; right:0; background:var(--white); padding:1.5rem; box-shadow:var(--shadow-xl); z-index:999; gap:.25rem; border-top:1px solid var(--gray-100); max-height:calc(100vh - var(--navbar-h)); overflow-y:auto; }
  .navbar-nav.mobile-open .nav-link { padding:.875rem 1rem; border-radius:var(--radius-md); border-bottom:1px solid var(--gray-100); }
  .navbar-nav.mobile-open .navbar-cta { margin-top:.5rem; text-align:center; justify-content:center; }
  .hero-content-wrap { padding:3rem 0; }
  .hero-btns { flex-direction:column; }
  .hero-btns .btn { width:100%; }
  .stats-bar { grid-template-columns:1fr 1fr; margin:0; border-radius:var(--radius-lg); padding:1.75rem 1.25rem; }
  .stat-item:nth-child(2)::after { display:none; }
  .form-grid-2 { grid-template-columns:1fr; }
  .testimonials-slider { grid-template-columns:1fr; }
  .roadmap-steps { flex-direction:column; gap:1.5rem; }
  .roadmap-steps::before { display:none; }
  .roadmap-step { display:flex; align-items:center; gap:1rem; text-align:left; }
  .roadmap-step-num { margin:0; flex-shrink:0; }
  .footer-grid { grid-template-columns:1fr; gap:2rem; }
  .footer-bar { flex-direction:column; gap:.5rem; text-align:center; }
  .enquiry-form-wrap,.icep-highlight { padding:2rem; }
  .about-img-main { height:280px; }
  .about-img-badge { left:.5rem; }
  .mothers-highlight { padding:2rem; }
  .mothers-highlight::before { display:none; }
  .roadmap-step-full { flex-direction:column; }
  .roadmap-step-full:not(:last-child)::after { display:none; }
  .program-tab { padding:.6rem .875rem; font-size:.8rem; }
  .page-hero { padding:3rem 0; }
}

@media (max-width:480px) {
  .stats-bar { padding:1.25rem 1rem; }
  .stat-number { font-size:1.75rem; }
  .icep-skills { grid-template-columns:1fr; }
  .about-features { grid-template-columns:1fr; }
  .therapy-outcomes { grid-template-columns:1fr; }
  .whatsapp-float { bottom:1.25rem; right:1.25rem; }
  .scroll-top { right:4.5rem; bottom:1.25rem; }
}

@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; } }
:focus-visible { outline:3px solid var(--brand-navy); outline-offset:2px; border-radius:4px; }
.skip-link { position:absolute; top:-999px; left:.5rem; background:var(--brand-navy); color:var(--white); padding:.5rem 1rem; border-radius:var(--radius-sm); font-size:.875rem; z-index:10000; font-weight:600; transition:top .2s; }
.skip-link:focus { top:.5rem; }
::selection { background:rgba(26,42,94,.15); color:var(--gray-900); }
