/* ============================================================
   IQRA Kids — Light Playful theme
   Mint #6EDDC1 · Sunshine #FFC947 · Coral #FF9A8B on cream #FDF8F0
   Rounded, warm, SAFE. Space Grotesk headings + Inter body.
   ============================================================ */

:root {
  --mint:    #6EDDC1;
  --mint-deep:#3FBFA0;
  --sun:     #FFC947;
  --sun-deep:#F0A93A;
  --coral:   #FF9A8B;
  --coral-deep:#F26B57;
  --cream:   #FDF8F0;
  --cream-2: #FFFDF9;
  --paper:   #FFFFFF;
  --panel:   #FFF6E9;

  --ink:      #2B2A33;
  --ink-soft: rgba(43,42,51,0.74);
  --ink-mute: rgba(43,42,51,0.55);
  --ink-faint:rgba(43,42,51,0.34);

  --line:     rgba(43,42,51,0.10);
  --line-soft:rgba(43,42,51,0.06);

  --font-display: "Cormorant Garamond", Georgia, serif;
  --font-body:    "Manrope", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --text-xs:.75rem; --text-sm:.875rem; --text-base:1rem; --text-lg:1.125rem;
  --text-xl:1.25rem;
  --text-2xl: clamp(1.5rem,1.2rem + 1vw,2rem);
  --text-3xl: clamp(1.9rem,1.4rem + 1.8vw,2.7rem);
  --text-4xl: clamp(2.4rem,1.6rem + 3vw,3.6rem);
  --text-hero:clamp(2.7rem,1.9rem + 3.6vw,4.6rem);

  --lh-tight:1.06; --lh-snug:1.2; --lh-normal:1.5; --lh-relaxed:1.7;

  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px;
  --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px; --sp-20:80px; --sp-24:96px;

  --r:16px; --r-sm:12px; --r-lg:24px; --r-xl:32px; --r-pill:999px;
  --shadow-sm:0 4px 14px rgba(242,107,87,0.10);
  --shadow-md:0 12px 32px rgba(63,191,160,0.14);
  --shadow-lg:0 24px 60px rgba(43,42,51,0.12);

  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --container:1180px; --container-narrow:760px; --nav-h:74px;
}

:root[data-theme="dark"]{
  --cream:#062018;
  --cream-2:#08271e;
  --paper:#0b2d23;
  --panel:#11372b;
  --ink:#f4e9c9;
  --ink-soft:rgba(244,233,201,.76);
  --ink-mute:rgba(244,233,201,.58);
  --ink-faint:rgba(244,233,201,.34);
  --line:rgba(218,176,68,.22);
  --line-soft:rgba(244,233,201,.09);
  --mint:#78d7bd;
  --mint-deep:#55c3a6;
  --sun:#dab044;
  --sun-deep:#c9982b;
  --coral:#ee927f;
  --coral-deep:#ef7b67;
  --shadow-sm:0 4px 18px rgba(0,0,0,.2);
  --shadow-md:0 14px 34px rgba(0,0,0,.25);
  --shadow-lg:0 26px 66px rgba(0,0,0,.34);
}

*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;}
body{
  font-family:var(--font-body); font-size:var(--text-base);
  line-height:var(--lh-normal); color:var(--ink);
  background:var(--cream); overflow-x:hidden;
}
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(760px 460px at 6% -8%, rgba(110,221,193,0.22), transparent 60%),
    radial-gradient(700px 460px at 96% 4%, rgba(255,201,71,0.20), transparent 58%),
    radial-gradient(640px 640px at 84% 108%, rgba(255,154,139,0.16), transparent 60%);
}
:root[data-theme="dark"] body::before{background:radial-gradient(760px 520px at 8% -5%,rgba(85,195,166,.12),transparent 62%),radial-gradient(760px 520px at 96% 0,rgba(218,176,68,.1),transparent 62%),linear-gradient(rgba(255,255,255,.012),rgba(255,255,255,.012));}
img,svg,video{max-width:100%;height:auto;display:block;}

h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;letter-spacing:-.02em;color:var(--ink);line-height:var(--lh-tight);}
h1{font-size:var(--text-hero);letter-spacing:-.03em;}
h2{font-size:var(--text-4xl);letter-spacing:-.025em;}
h3{font-size:var(--text-2xl);}
h4{font-size:var(--text-xl);}
p{color:var(--ink-soft);line-height:var(--lh-relaxed);}
a{color:var(--coral-deep);text-decoration:none;transition:color .16s var(--ease);}
a:hover{color:var(--mint-deep);}

.container{max-width:var(--container);margin:0 auto;padding:0 var(--sp-6);}
.narrow{max-width:var(--container-narrow);margin:0 auto;padding:0 var(--sp-6);}

.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:var(--text-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--mint-deep);
}
.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--sun);}

/* ---- Nav ---- */
.nav{
  position:sticky;top:0;z-index:50;height:var(--nav-h);
  display:flex;align-items:center;
  background:rgba(253,248,240,0.82);backdrop-filter:blur(14px) saturate(1.3);
  border-bottom:1px solid var(--line-soft);
}
:root[data-theme="dark"] .nav{background:rgba(6,32,24,.9);border-color:rgba(218,176,68,.16);}
.nav-inner{max-width:var(--container);margin:0 auto;padding:0 var(--sp-6);width:100%;
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:700;font-size:1.15rem;color:var(--ink);}
.brand .mark{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--mint),var(--sun));color:#fff;box-shadow:var(--shadow-sm);}
.brand .mark svg{width:24px;height:24px;}
.brand .mark img{width:48px;height:48px;border-radius:11px;object-fit:cover;display:block;}
.brand small{display:block;font-family:var(--font-body);font-weight:600;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);}
.nav-links{display:flex;align-items:center;gap:var(--sp-5);}
.nav-links a{color:var(--ink-soft);font-weight:600;font-size:.94rem;}
.nav-links a:hover{color:var(--ink);}
.nav-cta{padding:10px 18px;border-radius:var(--r-pill);background:linear-gradient(135deg,var(--coral),var(--sun-deep));color:#fff !important;font-weight:700;box-shadow:var(--shadow-sm);}
.nav-cta:hover{filter:brightness(1.04);color:#fff;}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;color:var(--ink);}
.theme-toggle{flex:none;width:42px;height:42px;border-radius:13px;border:1px solid var(--line);background:var(--paper);color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-sm);font-size:1.05rem;}
.theme-toggle:hover{border-color:var(--sun-deep);}
.theme-toggle:focus-visible{outline:3px solid var(--sun);outline-offset:3px;}
.ecosystem-bar{background:var(--paper);border-bottom:1px solid var(--line-soft);}
.ecosystem-inner{max-width:var(--container);margin:auto;padding:8px var(--sp-6);display:flex;align-items:center;justify-content:center;gap:16px;font-size:.76rem;color:var(--ink-mute);}
.ecosystem-inner strong{color:var(--ink);font-weight:700;}
.ecosystem-links{display:flex;align-items:center;gap:12px;}
.ecosystem-links a{color:var(--ink-soft);font-weight:700;}
.ecosystem-links a:hover{color:var(--sun-deep);}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:var(--r-pill);
  font-family:var(--font-display);font-weight:700;font-size:1rem;cursor:pointer;border:none;transition:transform .18s var(--ease),filter .18s var(--ease),box-shadow .18s var(--ease);}
.btn:hover{transform:translateY(-2px);}
.btn:focus-visible,.nav a:focus-visible,.brand:focus-visible{outline:3px solid var(--ink);outline-offset:4px;}
.btn-primary{background:linear-gradient(135deg,var(--coral),var(--sun-deep));color:#fff;box-shadow:var(--shadow-md);}
.btn-primary:hover{color:#fff;filter:brightness(1.05);}
.btn-mint{background:linear-gradient(135deg,var(--mint),var(--mint-deep));color:#fff;box-shadow:var(--shadow-md);}
.btn-mint:hover{color:#fff;}
.btn-ghost{background:var(--paper);color:var(--ink);border:2px solid var(--line);}
.btn-ghost:hover{color:var(--ink);border-color:var(--mint);}

/* ---- Sections ---- */
section{padding:var(--sp-24) 0;}
.sec-head{max-width:640px;margin-bottom:var(--sp-12);}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.sec-head p{margin-top:var(--sp-4);font-size:var(--text-lg);}

/* ---- Hero ---- */
.hero{padding:var(--sp-20) 0 var(--sp-24);}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--sp-16);align-items:center;}
.hero h1{margin:var(--sp-5) 0;}
.hero .lede{font-size:var(--text-xl);color:var(--ink-soft);max-width:46ch;}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-8);}
.hero-art{position:relative;border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-lg);
  background:linear-gradient(135deg,var(--mint),var(--sun) 55%,var(--coral));padding:0;}
.hero-art img{border-radius:var(--r-xl);}
.hero-art::after{content:"LIVE PILOT";position:absolute;right:18px;top:18px;padding:8px 12px;border-radius:var(--r-pill);background:rgba(43,42,51,.86);color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.12em;box-shadow:var(--shadow-sm);}
.hero-badges{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-6);}
.pill{display:inline-flex;align-items:center;gap:8px;padding:8px 15px;border-radius:var(--r-pill);
  background:var(--paper);border:1px solid var(--line);font-weight:600;font-size:.85rem;color:var(--ink-soft);box-shadow:var(--shadow-sm);}
.pill .dot{width:9px;height:9px;border-radius:50%;background:var(--mint-deep);}

/* ---- Cards / grid ---- */
.grid{display:grid;gap:var(--sp-6);}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}

.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-8);
  box-shadow:var(--shadow-sm);transition:transform .2s var(--ease),box-shadow .2s var(--ease);}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);}
.card h3{font-size:var(--text-xl);margin-bottom:var(--sp-3);}
.card p{font-size:.98rem;}
.card .ico{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;margin-bottom:var(--sp-5);color:#fff;}
.ico.mint{background:linear-gradient(135deg,var(--mint),var(--mint-deep));}
.ico.sun{background:linear-gradient(135deg,var(--sun),var(--sun-deep));}
.ico.coral{background:linear-gradient(135deg,var(--coral),var(--coral-deep));}
.ico.mix{background:linear-gradient(135deg,var(--mint),var(--coral));}
.ico svg{width:30px;height:30px;}

.pillar{position:relative;overflow:hidden;}
.pillar::after{content:"";position:absolute;top:-30px;right:-30px;width:110px;height:110px;border-radius:50%;background:var(--panel);z-index:0;}
.pillar > *{position:relative;z-index:1;}

/* ---- Guided journey ---- */
.journey-section{background:rgba(255,255,255,.38);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);}
:root[data-theme="dark"] .journey-section{background:rgba(255,255,255,.018);}
.journey-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-5);}
.journey-card{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-8);box-shadow:var(--shadow-sm);overflow:hidden;}
.journey-card::after{content:"";position:absolute;right:-32px;bottom:-42px;width:110px;height:110px;border-radius:50%;background:linear-gradient(135deg,rgba(110,221,193,.18),rgba(255,201,71,.2));}
.journey-num{display:inline-grid;place-items:center;width:42px;height:42px;margin-bottom:var(--sp-5);border-radius:14px;background:var(--panel);color:var(--coral-deep);font-family:var(--font-display);font-weight:700;}
.journey-card h3{font-size:var(--text-xl);margin-bottom:var(--sp-3);}
.journey-card p{font-size:.94rem;}

/* ---- Play and parent progress ---- */
.progress-showcase{display:grid;grid-template-columns:.95fr 1.05fr;gap:var(--sp-16);align-items:center;}
.progress-copy h2{max-width:12ch;}
.progress-copy>p{font-size:var(--text-lg);margin:var(--sp-5) 0;max-width:50ch;}
.feature-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:var(--sp-8);}
.feature-chips span{padding:8px 13px;border-radius:var(--r-pill);background:var(--paper);border:1px solid var(--line);font-size:.84rem;font-weight:700;color:var(--ink-soft);}
.progress-panel{background:linear-gradient(145deg,#fff,#fff8ec);border:1px solid var(--line);border-radius:var(--r-xl);padding:var(--sp-8);box-shadow:var(--shadow-lg);}
:root[data-theme="dark"] .progress-panel{background:linear-gradient(145deg,var(--paper),#103629);}
.progress-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-6);}
.mini-label{display:block;margin-bottom:5px;color:var(--ink-mute);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;}
.level-pill{padding:8px 13px;border-radius:var(--r-pill);background:var(--sun);font-weight:700;font-size:.82rem;}
.progress-score{display:flex;align-items:center;gap:14px;padding:var(--sp-5);margin-bottom:var(--sp-5);border-radius:var(--r);background:linear-gradient(135deg,rgba(110,221,193,.2),rgba(255,201,71,.18));}
.progress-score strong{font-family:var(--font-display);font-size:2.8rem;line-height:1;color:var(--mint-deep);}
.progress-score span{font-weight:700;color:var(--ink-soft);line-height:1.35;}
.skill-row{display:grid;grid-template-columns:1fr auto;gap:7px;margin:16px 0;color:var(--ink-soft);font-size:.9rem;}
.skill-row>b{font-size:.8rem;color:var(--ink-mute);}
.skill-row i{grid-column:1/-1;height:9px;background:var(--panel);border-radius:20px;overflow:hidden;}
.skill-row em{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,var(--mint),var(--sun));}
.next-card{display:grid;gap:3px;margin-top:var(--sp-6);padding:var(--sp-5);border-radius:var(--r);background:var(--ink);color:#fff;}
.next-card span,.next-card small{color:rgba(255,255,255,.68);font-size:.76rem;}

/* ---- Subject library ---- */
.library-section{padding-top:0;}
.subject-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-5);}
.subject-card{min-height:230px;padding:var(--sp-8);border-radius:var(--r-lg);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-sm);transition:transform .2s var(--ease),box-shadow .2s var(--ease);}
.subject-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);color:var(--ink);}
.subject-card>span{display:inline-block;margin-bottom:var(--sp-8);font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;}
.subject-card h3{font-size:var(--text-xl);margin-bottom:var(--sp-3);}
.subject-card p{font-size:.92rem;}
.mint-card{background:linear-gradient(145deg,#fff,rgba(110,221,193,.25));}
.sun-card{background:linear-gradient(145deg,#fff,rgba(255,201,71,.25));}
.coral-card{background:linear-gradient(145deg,#fff,rgba(255,154,139,.23));}
.mix-card{background:linear-gradient(145deg,rgba(110,221,193,.14),rgba(255,154,139,.18));}
:root[data-theme="dark"] .mint-card{background:linear-gradient(145deg,var(--paper),rgba(85,195,166,.16));}
:root[data-theme="dark"] .sun-card{background:linear-gradient(145deg,var(--paper),rgba(218,176,68,.17));}
:root[data-theme="dark"] .coral-card{background:linear-gradient(145deg,var(--paper),rgba(238,146,127,.14));}
:root[data-theme="dark"] .mix-card{background:linear-gradient(145deg,rgba(85,195,166,.1),rgba(238,146,127,.1));}

/* ---- IQRA family connections ---- */
.family-section{padding-top:0;}
.family-panel{padding:var(--sp-12);border:1px solid var(--line);border-radius:var(--r-xl);background:linear-gradient(135deg,rgba(218,176,68,.12),rgba(110,221,193,.1));box-shadow:var(--shadow-md);}
.family-copy{max-width:760px;}
.family-copy p{margin-top:var(--sp-4);font-size:var(--text-lg);}
.family-links{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5);margin-top:var(--sp-8);}
.family-links a{display:grid;gap:5px;padding:var(--sp-6);border-radius:var(--r);background:var(--paper);border:1px solid var(--line);color:var(--ink);}
.family-links a:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);color:var(--ink);}
.family-links span{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--sun-deep);}
.family-links strong{font-family:var(--font-display);font-size:1.45rem;}
.family-links small{color:var(--ink-mute);font-size:.82rem;line-height:1.5;}
.parent-note{margin-top:var(--sp-5);font-size:.82rem;color:var(--ink-mute);}

/* ---- Safety strip ---- */
.safety-strip{background:linear-gradient(135deg,rgba(110,221,193,0.16),rgba(255,201,71,0.14));
  border:1px solid var(--line);border-radius:var(--r-xl);padding:var(--sp-12);}
.safety-list{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-5);margin-top:var(--sp-8);}
.safety-item{display:flex;gap:var(--sp-4);align-items:flex-start;}
.safety-item .check{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;
  background:var(--mint-deep);color:#fff;}
.safety-item .check svg{width:22px;height:22px;}
.safety-item h4{font-size:var(--text-base);margin-bottom:4px;}
.safety-item p{font-size:.92rem;}

/* ---- Honest "what parents see" cards ---- */
.honest{background:var(--panel);border:1px dashed var(--sun-deep);border-radius:var(--r-lg);padding:var(--sp-8);}
.honest .tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--sun-deep);margin-bottom:var(--sp-4);}
.honest p{color:var(--ink);font-style:italic;}
.honest .who{margin-top:var(--sp-4);font-style:normal;font-weight:700;font-size:.9rem;color:var(--ink-mute);}

/* ---- Age track (learning) ---- */
.track{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm);}
.track-head{padding:var(--sp-6) var(--sp-8);color:#fff;}
.track-head .age{font-family:var(--font-display);font-weight:700;font-size:2rem;line-height:1;}
.track-head .lbl{font-weight:600;opacity:.9;margin-top:4px;}
.track.a1 .track-head{background:linear-gradient(135deg,var(--mint),var(--mint-deep));}
.track.a2 .track-head{background:linear-gradient(135deg,var(--sun),var(--sun-deep));}
.track.a3 .track-head{background:linear-gradient(135deg,var(--coral),var(--coral-deep));}
.track-body{padding:var(--sp-8);}
.track-body ul{list-style:none;display:grid;gap:var(--sp-3);}
.track-body li{display:flex;gap:12px;align-items:flex-start;font-size:.96rem;color:var(--ink-soft);}
.track-body li::before{content:"";flex:none;width:20px;height:20px;border-radius:6px;margin-top:2px;
  background:var(--panel);border:2px solid var(--mint);}

/* ---- Curriculum tracks (Noorani etc) ---- */
.curriculum{display:grid;gap:var(--sp-5);}
.curr-row{display:grid;grid-template-columns:200px 1fr;gap:var(--sp-6);align-items:start;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:var(--sp-6);box-shadow:var(--shadow-sm);}
.curr-row h4{font-size:var(--text-lg);}
.curr-row .meta{font-size:.85rem;color:var(--mint-deep);font-weight:700;margin-top:6px;}
.curr-row p{font-size:.95rem;margin-top:0;}

/* ---- Feature list (parent) ---- */
.feature-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-12);align-items:center;margin-bottom:var(--sp-16);}
.feature-row:last-child{margin-bottom:0;}
.feature-row.rev .txt{order:2;}
.mock{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-6);box-shadow:var(--shadow-md);}
.mock-bar{height:12px;border-radius:8px;background:var(--panel);margin-bottom:12px;}
.mock-bar.fill{background:linear-gradient(90deg,var(--mint),var(--sun));}

/* ---- Policy / prose ---- */
.prose{max-width:var(--container-narrow);}
.prose h2{font-size:var(--text-2xl);margin:var(--sp-10) 0 var(--sp-4);}
.prose h3{font-size:var(--text-lg);margin:var(--sp-6) 0 var(--sp-3);}
.prose p{margin-bottom:var(--sp-4);}
.prose ul{margin:0 0 var(--sp-4) var(--sp-5);}
.prose li{margin-bottom:var(--sp-2);color:var(--ink-soft);}
.callout{background:linear-gradient(135deg,rgba(110,221,193,0.16),rgba(255,201,71,0.12));
  border:1px solid var(--mint);border-radius:var(--r);padding:var(--sp-6);margin:var(--sp-6) 0;}
.callout strong{color:var(--ink);}
.note{font-size:.85rem;color:var(--ink-mute);}
.marker{background:var(--sun);color:var(--ink);padding:1px 6px;border-radius:6px;font-size:.75rem;font-weight:700;}

/* ---- CTA band ---- */
.cta-band{background:linear-gradient(135deg,var(--mint) 0%,var(--sun) 55%,var(--coral) 100%);
  border-radius:var(--r-xl);padding:var(--sp-20) var(--sp-12);text-align:center;color:#fff;box-shadow:var(--shadow-lg);}
.cta-band h2{color:#fff;}
.cta-band p{color:rgba(255,255,255,0.92);max-width:52ch;margin:var(--sp-4) auto var(--sp-8);}
.cta-band .btn-ghost{background:rgba(255,255,255,0.16);color:#fff;border-color:rgba(255,255,255,0.4);}

/* ---- Story ---- */
.story-hero{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--sp-16);align-items:center;}
.story-hero .portrait{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-lg);}
.quote{font-family:var(--font-display);font-size:var(--text-2xl);line-height:1.3;color:var(--ink);
  border-left:4px solid var(--coral);padding-left:var(--sp-6);margin:var(--sp-8) 0;}

/* ---- Footer ---- */
.footer{background:var(--cream-2);border-top:1px solid var(--line);padding:var(--sp-20) 0 var(--sp-10);}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--sp-10);}
.footer h5{font-family:var(--font-display);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:var(--sp-4);}
.footer a{display:block;color:var(--ink-soft);font-size:.94rem;margin-bottom:10px;}
.footer a:hover{color:var(--coral-deep);}
.footer .tagline{color:var(--ink-soft);max-width:34ch;margin-top:var(--sp-4);font-size:.95rem;}
.footer-marks{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--sp-6);}
.mark-chip{font-size:.74rem;font-weight:600;color:var(--ink-mute);background:var(--panel);border:1px solid var(--line);border-radius:var(--r-pill);padding:6px 12px;}
.footer-base{margin-top:var(--sp-16);padding-top:var(--sp-6);border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:var(--sp-4);justify-content:space-between;align-items:center;color:var(--ink-mute);font-size:.85rem;}

/* ---- Responsive ---- */
@media(max-width:900px){
  .hero-grid,.story-hero{grid-template-columns:1fr;gap:var(--sp-10);}
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .grid-3{grid-template-columns:1fr;}
  .feature-row,.feature-row.rev{grid-template-columns:1fr;}
  .feature-row.rev .txt{order:0;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:var(--sp-8);}
  .safety-list{grid-template-columns:1fr;}
  .journey-grid,.subject-grid{grid-template-columns:repeat(2,1fr);}
  .family-links{grid-template-columns:1fr;}
  .progress-showcase{grid-template-columns:1fr;gap:var(--sp-10);}
}
@media(max-width:640px){
  .nav-links{display:none;}
  .nav-toggle{display:block;}
  .nav-links.open{display:flex;position:absolute;top:var(--nav-h);left:0;right:0;flex-direction:column;
    background:var(--cream-2);padding:var(--sp-6);gap:var(--sp-4);border-bottom:1px solid var(--line);box-shadow:var(--shadow-md);}
  .grid-2,.grid-4{grid-template-columns:1fr;}
  .curr-row{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .journey-grid,.subject-grid{grid-template-columns:1fr;}
  .progress-panel{padding:var(--sp-6);}
  .family-panel{padding:var(--sp-8) var(--sp-6);}
  .ecosystem-inner{justify-content:flex-start;overflow-x:auto;white-space:nowrap;}
  .theme-toggle{position:absolute;right:62px;top:16px;width:40px;height:40px;}
  section{padding:var(--sp-16) 0;}
}