/* ════════════════════════════════════════════════════════════════
   SCHOLAXIA — Sunny Hero + Purple Brand  v4.0
   ════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&display=swap');

:root {
  /* ── Original purple brand ── */
  --red:        #7c3aed;
  --red-dark:   #6d28d9;
  --purple:     #7c3aed;
  --purple-d:   #6d28d9;
  --purple-l:   #8b5cf6;
  --purple-s:   #ede9fe;
  --purple-ss:  #f5f3ff;

  /* Gold is an accent only; purple remains the primary brand. */
  --gold:       #f5c518;
  --gold-d:     #d9a800;
  --amber:      #ff9f1c;
  --amber-d:    #d97800;
  --sun-1:      #fffbef;
  --sun-2:      #fff3c4;
  --sun-3:      #ffe066;

  /* Navy + neutrals */
  --navy:       #0b1f44;
  --navy-mid:   #1a4388;
  --ink:        #142033;
  --ink-soft:   #4b5a70;
  --muted:      #7a8799;
  --line:       #e4eaf2;
  --bg:         #faf8ff;
  --bg-soft:    #f3efff;
  --blue:       #3b82f6;
  --gold-soft:  #ffe6a3;

  --font:   'Outfit','Segoe UI',sans-serif;
  --pad:    clamp(1.25rem,5vw,5.5rem);
  --max:    1180px;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
a    { color:inherit; text-decoration:none; }
button { font:inherit; border:0; background:none; cursor:pointer; color:inherit; }
img,video { display:block; max-width:100%; }

/* ════ BODY ════ */
body {
  font-family:var(--font);
  color:var(--ink);
  background:
    radial-gradient(ellipse at 0% 0%, rgba(124,58,237,.10), transparent 42%),
    radial-gradient(ellipse at 100% 8%, rgba(139,92,246,.08), transparent 45%),
    var(--bg);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  position:relative;
}
main,.topbar,.ending-cta,.site-footer,.mobile-nav,.trust-strip { position:relative; z-index:1; }
.topbar     { z-index:40; }
.mobile-nav { z-index:50; }

/* ════ TOPBAR ════ */
.topbar {
  position:sticky; top:0; z-index:40;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.85rem var(--pad);
  background:rgba(255,255,255,.9);
  border-bottom:1px solid transparent;
  backdrop-filter:blur(14px);
  transition:border-color .3s,box-shadow .3s;
}
.topbar.is-scrolled {
  border-bottom-color:var(--line);
  box-shadow:0 8px 24px rgba(15,23,42,.04);
}

.logo { display:inline-flex; align-items:center; padding:.15rem .25rem; border-radius:10px; overflow:hidden; line-height:0; }
.logo img      { height:48px; width:auto; max-width:200px; object-fit:contain; display:block; }
.logo-main img { height:54px; max-width:240px; }

.nav { display:flex; flex-wrap:wrap; justify-content:center; gap:clamp(.85rem,1.6vw,1.45rem); }
.nav a {
  font-size:.92rem; font-weight:500; color:#4b5563;
  transition:color .2s; position:relative;
}
.nav a::after {
  content:''; position:absolute; bottom:-3px; left:0;
  width:0; height:2px;
  background:linear-gradient(90deg,var(--purple),var(--purple-l));
  border-radius:2px; transition:width .3s cubic-bezier(.22,1,.36,1);
}
.nav a:hover,.nav a.is-active { color:var(--ink); }
.nav a:hover::after,.nav a.is-active::after { width:100%; }

.top-actions { display:flex; align-items:center; gap:.55rem; }

/* ── Buttons ── */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  min-height:2.55rem; padding:0 1.2rem; border-radius:8px;
  font-size:.92rem; font-weight:700; font-family:var(--font);
  transition:background .2s,transform .2s,box-shadow .2s,color .2s,border-color .2s;
}
.btn-red {
  background:linear-gradient(135deg,#7c3aed,#6d28d9); color:#fff;
  box-shadow:0 4px 14px rgba(124,58,237,.35);
}
.btn-red:hover { background:linear-gradient(135deg,#8b5cf6,#7c3aed); transform:translateY(-1px); box-shadow:0 10px 22px rgba(124,58,237,.45); }
.btn-ghost { border:1px solid var(--line); background:#fff; color:var(--ink); }
.btn-ghost:hover { border-color:#c4b5fd; color:#6d28d9; background:#f5f3ff; }
.btn-pill { border-radius:999px; padding-inline:1.25rem; }
.btn-cta  { min-height:3rem; padding-inline:1.45rem; font-size:.98rem; border-radius:6px; }
.btn-outline { border:1px solid var(--line); background:#fff; color:var(--ink); }
.btn-outline:hover { border-color:#cbd5e1; background:var(--bg-soft); }

.icon-btn { width:36px;height:36px;border-radius:999px;display:grid;place-items:center;color:#64748b; }
.icon-btn:hover { background:var(--bg-soft); color:var(--ink); }

.mobile-nav {
  display:none; flex-direction:column; gap:.85rem;
  padding:1rem var(--pad) 1.25rem;
  border-bottom:1px solid var(--line); background:#fff;
  position:relative; z-index:50;
}
.mobile-nav a { font-weight:600; color:#4b5563; }
.mobile-nav .btn { width:fit-content; }

/* Hero — Scholaxia purple brand */
.hero-banner {
  position:relative; width:100%;
  min-height:clamp(600px,96vh,980px); overflow:hidden;
  background:linear-gradient(145deg,#2e1065 0%,#5b21b6 38%,#7c3aed 68%,#8b5cf6 100%);
  display:flex; flex-direction:column; justify-content:flex-end;
}
.hero-banner::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(ellipse 75% 55% at 50% -8%,rgba(196,181,253,.48) 0%,transparent 62%),
    radial-gradient(ellipse 40% 35% at 88% 92%,rgba(167,139,250,.28) 0%,transparent 55%),
    radial-gradient(ellipse 35% 30% at 8% 82%,rgba(221,214,254,.20) 0%,transparent 50%);
  animation:heroBreathe 9s ease-in-out infinite alternate;
}
@keyframes heroBreathe {
  from { opacity:.75; transform:scale(1); }
  to   { opacity:1;   transform:scale(1.06); }
}

/* 16-ray sun burst */
.hero-sun-rays {
  position:absolute; top:-30vw; left:50%; transform:translateX(-50%);
  width:180vw; height:180vw; pointer-events:none; z-index:0; opacity:.14;
  animation:heroRaysRotate 40s linear infinite;
}
.hero-sun-rays span {
  position:absolute; top:50%; left:50%;
  width:50%; height:4px; transform-origin:0 50%;
  background:linear-gradient(to right,rgba(221,214,254,.9),transparent); border-radius:4px;
}
.hero-sun-rays span:nth-child(1) {transform:rotate(0deg);}
.hero-sun-rays span:nth-child(2) {transform:rotate(22.5deg);}
.hero-sun-rays span:nth-child(3) {transform:rotate(45deg);}
.hero-sun-rays span:nth-child(4) {transform:rotate(67.5deg);}
.hero-sun-rays span:nth-child(5) {transform:rotate(90deg);}
.hero-sun-rays span:nth-child(6) {transform:rotate(112.5deg);}
.hero-sun-rays span:nth-child(7) {transform:rotate(135deg);}
.hero-sun-rays span:nth-child(8) {transform:rotate(157.5deg);}
.hero-sun-rays span:nth-child(9) {transform:rotate(180deg);}
.hero-sun-rays span:nth-child(10){transform:rotate(202.5deg);}
.hero-sun-rays span:nth-child(11){transform:rotate(225deg);}
.hero-sun-rays span:nth-child(12){transform:rotate(247.5deg);}
.hero-sun-rays span:nth-child(13){transform:rotate(270deg);}
.hero-sun-rays span:nth-child(14){transform:rotate(292.5deg);}
.hero-sun-rays span:nth-child(15){transform:rotate(315deg);}
.hero-sun-rays span:nth-child(16){transform:rotate(337.5deg);}
@keyframes heroRaysRotate {
  from { transform:translateX(-50%) rotate(0deg); }
  to   { transform:translateX(-50%) rotate(360deg); }
}

/* Particles */
.hero-particles { position:absolute; inset:0; pointer-events:none; z-index:1; overflow:hidden; }
.hp {
  position:absolute; border-radius:50%; background:rgba(255,255,255,.55);
  animation:heroParticleFloat linear infinite; filter:blur(1.5px);
}
.hp:nth-child(1) {width:10px;height:10px;left:5%; animation-duration:11s;animation-delay:0s;   opacity:.6;}
.hp:nth-child(2) {width:6px; height:6px; left:14%;animation-duration:14s;animation-delay:1.8s;opacity:.45;}
.hp:nth-child(3) {width:13px;height:13px;left:24%;animation-duration:9s; animation-delay:3.2s;opacity:.55;}
.hp:nth-child(4) {width:5px; height:5px; left:38%;animation-duration:16s;animation-delay:.6s; opacity:.4;}
.hp:nth-child(5) {width:8px; height:8px; left:52%;animation-duration:12s;animation-delay:2.4s;opacity:.6;}
.hp:nth-child(6) {width:7px; height:7px; left:63%;animation-duration:13s;animation-delay:4.5s;opacity:.5;}
.hp:nth-child(7) {width:11px;height:11px;left:74%;animation-duration:8s; animation-delay:1.2s;opacity:.55;}
.hp:nth-child(8) {width:5px; height:5px; left:83%;animation-duration:15s;animation-delay:2.8s;opacity:.4;}
.hp:nth-child(9) {width:9px; height:9px; left:91%;animation-duration:10s;animation-delay:.9s; opacity:.5;background:rgba(255,210,50,.7);}
.hp:nth-child(10){width:6px; height:6px; left:44%;animation-duration:17s;animation-delay:5s;  opacity:.45;background:rgba(255,210,50,.6);}
@keyframes heroParticleFloat {
  0%   { transform:translateY(108%) scale(.7); opacity:0; }
  8%   { opacity:1; }
  92%  { opacity:.7; }
  100% { transform:translateY(-8%) scale(1.25); opacity:0; }
}

.hero-slider  { position:absolute; inset:0; z-index:2; overflow:hidden; }
.hero-track   { display:flex; width:100%; height:100%; transition:transform .9s cubic-bezier(.22,1,.36,1); will-change:transform; }
.hero-slide   { position:relative; flex:0 0 100%; width:100%; height:100%; }
.hero-slide img { width:100%; height:100%; object-fit:cover; object-position:center; }

.hero-tint {
  position:absolute; inset:0; z-index:3; pointer-events:none;
  background:
    linear-gradient(110deg,rgba(20,8,0,.72) 0%,rgba(60,28,0,.52) 38%,rgba(120,65,0,.22) 65%,rgba(255,160,30,.06) 100%),
    linear-gradient(180deg,rgba(255,180,0,.1) 0%,transparent 35%,rgba(10,4,0,.72) 100%);
}
.hero-sparkle {
  position:absolute; inset:0; z-index:3; pointer-events:none;
  background:
    radial-gradient(circle at 16% 22%,rgba(255,215,60,.3),transparent 20%),
    radial-gradient(circle at 74% 18%,rgba(255,255,200,.16),transparent 14%),
    radial-gradient(circle at 88% 72%,rgba(255,160,30,.18),transparent 18%);
  animation:heroSparkleDrift 9s ease-in-out infinite alternate;
}
@keyframes heroSparkleDrift {
  from { opacity:.65; transform:scale(1); }
  to   { opacity:1;   transform:scale(1.06) translateY(-6px); }
}

.hero-stars { position:absolute; inset:0; z-index:4; pointer-events:none; }
.hstar {
  position:absolute; color:rgba(255,240,100,.9); font-size:14px;
  animation:heroStarTwinkle ease-in-out infinite;
  text-shadow:0 0 8px rgba(255,220,0,.8); user-select:none;
}
.hstar:nth-child(1){top:9%; left:7%; font-size:16px;animation-duration:2.6s;animation-delay:0s;}
.hstar:nth-child(2){top:14%;left:78%;font-size:11px;animation-duration:3.4s;animation-delay:.6s;}
.hstar:nth-child(3){top:28%;left:91%;font-size:14px;animation-duration:2.8s;animation-delay:1.2s;}
.hstar:nth-child(4){top:6%; left:48%;font-size:9px; animation-duration:3.8s;animation-delay:.3s;}
.hstar:nth-child(5){top:18%;left:35%;font-size:12px;animation-duration:2.4s;animation-delay:1.8s;}
.hstar:nth-child(6){top:7%; left:62%;font-size:10px;animation-duration:3.1s;animation-delay:.9s;}
@keyframes heroStarTwinkle {
  0%,100% { opacity:.15; transform:scale(.7) rotate(0deg);  }
  50%      { opacity:1;   transform:scale(1.4) rotate(18deg); }
}

/* Hero copy */
.hero-inner {
  position:relative; z-index:5; width:100%; max-width:none; margin:0 auto;
  padding:clamp(6rem,14vh,9rem) var(--pad) clamp(3.5rem,8vh,5.5rem);
  display:flex; align-items:flex-end;
}
/* Hero copy is ALWAYS visible — no hidden-until-reveal on the hero itself */
.hero-copy { max-width:34rem; color:#fff; opacity:1 !important; transform:none !important; }

.hero-badge {
  display:inline-flex; align-items:center; gap:.45rem; margin-bottom:1.1rem;
  padding:.38rem .9rem .38rem .5rem; border-radius:999px;
  background:rgba(255,215,60,.18); border:1.5px solid rgba(255,215,60,.5);
  backdrop-filter:blur(10px);
  animation:heroFadeUp .8s cubic-bezier(.22,1,.36,1) .2s both;
}
.hero-badge-dot {
  width:8px;height:8px;border-radius:50%;background:#ffe033;
  animation:badgePing 1.8s ease-in-out infinite;
}
@keyframes badgePing {
  0%,100% { box-shadow:0 0 0 0   rgba(255,224,51,.7); }
  50%      { box-shadow:0 0 0 7px rgba(255,224,51,0);  }
}
.hero-badge span { font-size:.78rem;font-weight:700;letter-spacing:.04em;color:#fff3b0;text-transform:uppercase; }

@keyframes heroFadeUp {
  from { opacity:0; transform:translateY(22px) scale(.97); }
  to   { opacity:1; transform:translateY(0) scale(1); }
}

.hero-copy h1 {
  font-size:clamp(1.85rem,3.2vw,2.55rem); font-weight:800;
  letter-spacing:-.03em; line-height:1.12; color:#fff;
  margin-bottom:.8rem; text-shadow:0 8px 32px rgba(0,0,0,.35);
  animation:heroFadeUp .95s cubic-bezier(.22,1,.36,1) .3s both;
}
.hero-copy h1 .accent {
  display:inline;
  background:linear-gradient(100deg,#ffe033 10%,#ffb300 55%,#ff8c00 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  filter:drop-shadow(0 2px 12px rgba(255,180,0,.45));
}
.hero-sub {
  font-size:clamp(.95rem,1.25vw,1.05rem); line-height:1.55;
  color:rgba(255,255,255,.88); margin-bottom:1.5rem;
  max-width:40ch; font-weight:500;
  animation:heroFadeUp 1s cubic-bezier(.22,1,.36,1) .4s both;
}
.hero-actions {
  display:flex; flex-wrap:wrap; gap:.9rem; align-items:center;
  animation:heroFadeUp 1.05s cubic-bezier(.22,1,.36,1) .5s both;
}

/* Primary CTA — gold */
.btn-join {
  min-height:3.2rem; padding:0 .55rem 0 1.35rem; border-radius:999px;
  background:linear-gradient(135deg,#ffe033 0%,#ffb300 55%,#ff8c00 100%);
  color:#1a0e00; font-weight:800; gap:.75rem;
  box-shadow:0 14px 32px rgba(255,180,0,.45),0 4px 12px rgba(255,120,0,.25);
  border:1.5px solid rgba(255,255,255,.35);
}
.btn-join:hover {
  background:linear-gradient(135deg,#fff066 0%,#ffc820 55%,#ffa020 100%);
  transform:translateY(-3px) scale(1.02);
  box-shadow:0 22px 48px rgba(255,180,0,.55),0 6px 18px rgba(255,120,0,.3);
}
.btn-circle { width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-size:1rem; }

/* Secondary on hero */
.btn-ai {
  min-height:3.2rem; padding:0 1.35rem; border-radius:999px;
  border:1.5px solid rgba(255,255,255,.42);
  background:rgba(255,255,255,.12); color:#fff; font-weight:700;
  backdrop-filter:blur(10px);
}
.btn-ai:hover { background:rgba(255,255,255,.22); border-color:rgba(255,255,255,.65); }

.hero-slide.is-active img { animation:kenBurns 5.5s ease-out both; }
@keyframes kenBurns {
  from { transform:scale(1.1) translateX(8px); filter:brightness(.95); }
  to   { transform:scale(1) translateX(0);     filter:brightness(1); }
}

/* ════ TRUST STRIP ════ */
.trust-strip {
  position:relative; z-index:3;
  /* NO negative margin — sits cleanly below hero */
  margin-top:0;
  padding:1.5rem var(--pad) 0.5rem;
  background: linear-gradient(180deg, #f5f3ff 0%, var(--bg) 100%);
  border-bottom: 1px solid var(--line);
}
.trust-inner {
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.75rem; padding:1.25rem 1.5rem; border-radius:20px;
  background:#fff;
  border:1px solid #e4eaf2;
  box-shadow:0 8px 32px rgba(124,58,237,.1), 0 2px 8px rgba(0,0,0,.04);
}
.trust-inner article { text-align:center; padding:.65rem .4rem; }
.trust-inner strong {
  display:block; font-size:clamp(1.4rem,2.4vw,1.8rem);
  font-weight:800; letter-spacing:-.03em;
  background:linear-gradient(135deg,#7c3aed,#6d28d9);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.trust-inner span { font-size:.84rem; color:var(--ink-soft); font-weight:600; }
@media(max-width:720px){ .trust-inner { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.hero-stats { display:none; }

/* ════ SCROLL REVEALS ════ */
.scroll-reveal {
  opacity:0; transform:translateY(48px) scale(.96); filter:blur(8px);
  transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1),filter .85s cubic-bezier(.16,1,.3,1);
  will-change:opacity,transform,filter;
}
.scroll-reveal.reveal-left  { transform:translateX(-56px) rotate(-1.5deg) scale(.96); }
.scroll-reveal.reveal-right { transform:translateX( 56px) rotate( 1.5deg) scale(.96); }
.scroll-reveal.reveal-pop   { transform:translateY(28px) scale(.82); }
.scroll-reveal.is-in        { opacity:1; transform:translate(0,0) rotate(0) scale(1); filter:blur(0); }
.scroll-reveal.is-animating.is-in { animation:revealPunch .85s cubic-bezier(.16,1,.3,1); }
@keyframes revealPunch {
  0%   { filter:blur(8px); }
  60%  { filter:blur(0); transform:translateY(-6px) scale(1.02); }
  100% { filter:blur(0); transform:none; }
}
.reveal-drop {
  opacity:0; transform:translateY(40px) scale(.97);
  transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1);
}
.reveal-drop.is-in { opacity:1; transform:none; }

/* ════ AMBIENT FX ════ */
.page-fx { position:fixed; inset:0; pointer-events:none; z-index:0; overflow:hidden; }
.fx-orb  { position:absolute; border-radius:50%; filter:blur(40px); opacity:.45; animation:orbFloat 12s ease-in-out infinite alternate; }
.fx-a { width:280px;height:280px;left:-60px;top:18%;background:radial-gradient(circle,rgba(245,192,66,.45),transparent 70%); }
.fx-b { width:340px;height:340px;right:-80px;top:48%;background:radial-gradient(circle,rgba(124,58,237,.35),transparent 70%);animation-duration:16s;animation-delay:-3s; }
.fx-c { width:220px;height:220px;left:35%;bottom:8%;background:radial-gradient(circle,rgba(26,67,136,.35),transparent 70%);animation-duration:14s;animation-delay:-6s; }
@keyframes orbFloat {
  from { transform:translate3d(0,0,0) scale(1); }
  to   { transform:translate3d(40px,-50px,0) scale(1.15); }
}
.cursor-glow {
  position:fixed; top:0; left:0; width:180px; height:180px; border-radius:50%;
  pointer-events:none; z-index:60; opacity:0;
  background:radial-gradient(circle,rgba(245,192,66,.22),transparent 70%);
  mix-blend-mode:screen; transition:opacity .35s; will-change:transform;
}
.cursor-glow.is-on { opacity:1; }
.btn-magnetic { transition:transform .18s ease,background .2s ease,box-shadow .2s ease !important; }
.btn-join,.btn-gold { animation:ctaPulse 2.8s ease-in-out infinite; }
@keyframes ctaPulse {
  0%,100% { box-shadow:0 14px 32px rgba(255,180,0,.4), 0 4px 12px rgba(255,120,0,.22); }
  50%      { box-shadow:0 22px 48px rgba(255,200,0,.65),0 6px 20px rgba(255,140,0,.35); }
}

/* ════ SECTIONS shared ════ */
.section { max-width:var(--max); margin:0 auto; padding:clamp(3.5rem,8vh,5.5rem) var(--pad); }
.section-head { max-width:40rem; margin-bottom:2.25rem; }
.section-head.center,.about .section-head,.product .section-head,.stories .section-head { text-align:center; margin-inline:auto; }
.kicker {
  font-size:.72rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--red); margin-bottom:.7rem;
}
.section-head h2,.showcase-copy h2 {
  font-size:clamp(1.7rem,3vw,2.35rem); font-weight:800; letter-spacing:-.03em;
  color:#30343b; margin-bottom:.75rem;
}
.section-head p,.showcase-copy p { color:var(--ink-soft); font-size:1.02rem; line-height:1.65; }

/* ════ ABOUT ════ */
.about {
  background:var(--bg-soft); max-width:none; padding-inline:0;
  position:relative; overflow:hidden;
}
.about::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 55% 60% at 90% 50%,rgba(124,58,237,.05),transparent 60%);
}
.about .section-head,.about .stat-row { max-width:var(--max); margin-inline:auto; padding-inline:var(--pad); position:relative; z-index:1; }
.stat-row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; text-align:center; }
.stat-row strong { display:block; font-size:clamp(1.5rem,2.5vw,2rem); font-weight:800; letter-spacing:-.03em; color:var(--ink); margin-bottom:.2rem; }
.stat-row span { color:var(--muted); font-size:.88rem; font-weight:600; }

/* ════ PRODUCT CARDS — purple accent ════ */
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.feature-grid article {
  padding:0; overflow:hidden; border-radius:16px; background:#fff;
  border:1px solid var(--line);
  box-shadow:0 4px 18px rgba(15,23,42,.05);
  transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,border-color .35s ease;
}
.feature-grid article:hover {
  transform:translateY(-8px) scale(1.015);
  border-color:#c4b5fd;
  box-shadow:0 22px 44px rgba(124,58,237,.14);
}
.feature-media { aspect-ratio:16/11; overflow:hidden; background:#f3f4f6; }
.feature-media img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.feature-grid article:hover .feature-media img { transform:scale(1.06); }
.feature-grid .ico,.feature-grid h3,.feature-grid p { margin-left:1.15rem; margin-right:1.15rem; }
.feature-grid .ico { margin-top:1rem; }
.ico {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:44px; height:32px; padding:0 .65rem; margin-bottom:.7rem;
  border-radius:999px; background:#ede9fe; color:#6d28d9;
  font-size:.72rem; font-weight:800; letter-spacing:.04em;
}
.feature-grid h3 { font-size:1.05rem; font-weight:750; margin-bottom:.4rem; }
.feature-grid p  { color:var(--ink-soft); font-size:.94rem; line-height:1.55; margin-bottom:1.2rem; }

/* ════ SHOWCASE / DEMO ════ */
/* ════ SHOWCASE / DEMO ════ */
.showcase { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(1.5rem,4vw,3rem); align-items:center; }
.showcase-copy .btn { margin-top:1.35rem; }

/* Full-width demo section wrapper */
.section.showcase-visual-only {
  background:
    radial-gradient(ellipse 55% 50% at 10% 40%, rgba(124,58,237,.06), transparent 55%),
    radial-gradient(ellipse 45% 45% at 90% 60%, rgba(245,192,66,.08), transparent 55%),
    linear-gradient(180deg, var(--bg-soft) 0%, #eef2ff 100%);
  max-width:none;
  padding-inline:0;
  padding-top:clamp(3rem,6vh,4.5rem);
  padding-bottom:clamp(3rem,6vh,4.5rem);
}

.showcase-visual-only {
  grid-template-columns:1fr;
}

.showcase-frame-full {
  width:100%;
  max-width:min(1000px,92vw);
  margin:0 auto;
  padding-inline:var(--pad);
}

.browser {
  border:1.5px solid var(--line);
  border-radius:20px;
  overflow:hidden;
  background:#fff;
  box-shadow:
    0 40px 80px rgba(15,23,42,.12),
    0 8px 24px rgba(124,58,237,.08);
  animation:browserFloat 7s ease-in-out infinite alternate;
}
@keyframes browserFloat {
  from { transform:translateY(0) rotate(-.15deg); box-shadow:0 40px 80px rgba(15,23,42,.12),0 8px 24px rgba(124,58,237,.08); }
  to   { transform:translateY(-12px) rotate(.15deg); box-shadow:0 56px 100px rgba(15,23,42,.16),0 12px 32px rgba(124,58,237,.12); }
}

.browser-bar {
  display:flex; align-items:center; gap:.4rem;
  padding:.75rem 1rem;
  border-bottom:1px solid var(--line);
  background:linear-gradient(90deg, #f8fafc, #f1f5f9);
}
.browser-bar span { width:10px;height:10px;border-radius:50%;background:#cbd5e1; }
.browser-bar span:nth-child(1){ background:#f87171; }
.browser-bar span:nth-child(2){ background:#fbbf24; }
.browser-bar span:nth-child(3){ background:#34d399; }
.browser-bar p { margin-left:.6rem; font-size:.78rem; color:var(--muted); font-weight:500; }

.demo-video { width:100%; aspect-ratio:16/9; object-fit:cover; background:#0f172a; display:block; }

.demo-media {
  position:relative;
  aspect-ratio:16/9;
  background:#0f172a;
  overflow:hidden;
  width:100%;
}
.demo-media .demo-video { position:absolute; inset:0; width:100%; height:100%; z-index:1; object-fit:cover; }
.demo-slide-track { position:absolute; inset:0; z-index:2; pointer-events:none; }
.demo-slide {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0;
  transform:scale(1.08) translateY(12px);
  transition:opacity .9s ease,transform 1.1s cubic-bezier(.22,1,.36,1);
}
.demo-slide.is-active { opacity:1; transform:scale(1); }

/* ════ INSTRUCTORS — live data grid ════ */
.instructors {
  max-width:none;
  padding:clamp(3.5rem,8vh,5.5rem) var(--pad);
  background:linear-gradient(160deg,#faf8ff 0%,#f0eaff 100%);
  border-top:1px solid #e9ddff;
  border-bottom:1px solid #e9ddff;
  position:relative; overflow:hidden;
}
.instructors::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 55% 60% at 90% 50%, rgba(124,58,237,.07), transparent 60%);
}

.instructors-inner {
  max-width:var(--max); margin:0 auto;
  position:relative; z-index:1;
}

/* Section header row */
.instructors-head {
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:1rem; margin-bottom:2.5rem; flex-wrap:wrap;
}
.instructors-head h2 {
  font-size:clamp(1.7rem,3vw,2.4rem); font-weight:800;
  letter-spacing:-.03em; line-height:1.15; color:var(--ink);
  max-width:22ch;
}
.instructors-head p { color:var(--ink-soft); font-size:1rem; line-height:1.6; max-width:40ch; }

/* One horizontal instructor row; JS advances it automatically. */
.teacher-grid {
  display:flex;
  flex-wrap:nowrap;
  gap:1.25rem;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  padding:.25rem .1rem 1rem;
}
.teacher-grid::-webkit-scrollbar { display:none; }
.teacher-grid > .instructor-card,
.teacher-grid > .teacher-skeleton {
  flex:0 0 calc((100% - 5rem) / 5);
  min-width:190px;
  scroll-snap-align:start;
}

/* Skeleton loading state */
.teacher-skeleton {
  border-radius:18px;
  background:#fff;
  border:1.5px solid #e2eaf4;
  padding:1.25rem 1rem 1.4rem;
  display:flex; flex-direction:column; align-items:center; gap:.85rem;
  box-shadow:0 4px 16px rgba(22,58,102,.05);
}
.skel-avatar {
  width:100%; aspect-ratio:1;
  border-radius:999px 999px 14px 14px;
  background:linear-gradient(90deg,#e8eef6 25%,#f0f4fa 50%,#e8eef6 75%);
  background-size:200% 100%;
  animation:shimmer 1.4s ease-in-out infinite;
}
.skel-line {
  height:14px; border-radius:6px; width:70%;
  background:linear-gradient(90deg,#e8eef6 25%,#f0f4fa 50%,#e8eef6 75%);
  background-size:200% 100%;
  animation:shimmer 1.4s ease-in-out infinite;
}
.skel-line.short { width:48%; animation-delay:.15s; }
.skel-btn {
  height:34px; width:90%; border-radius:999px;
  background:linear-gradient(90deg,#e8eef6 25%,#f0f4fa 50%,#e8eef6 75%);
  background-size:200% 100%;
  animation:shimmer 1.4s ease-in-out infinite;
  animation-delay:.25s;
}
@keyframes shimmer {
  0%   { background-position:200% 0; }
  100% { background-position:-200% 0; }
}

/* Real teacher cards */
.instructor-card {
  background:#fff; border-radius:18px;
  border:1.5px solid #e2eaf4;
  padding:1.25rem 1rem 1.4rem;
  text-align:center;
  box-shadow:0 4px 18px rgba(22,58,102,.06);
  transition:transform .32s cubic-bezier(.16,1,.3,1), box-shadow .32s ease, border-color .32s ease;
  display:flex; flex-direction:column; align-items:center; gap:.6rem;
  flex-shrink:0;
}

@media (max-width:980px) {
  .teacher-grid > .instructor-card,
  .teacher-grid > .teacher-skeleton { flex-basis:calc((100% - 2.5rem) / 3); }
}

@media (max-width:640px) {
  .teacher-grid > .instructor-card,
  .teacher-grid > .teacher-skeleton { flex-basis:82%; min-width:240px; }
}
.instructor-card:hover {
  transform:translateY(-8px) scale(1.02);
  box-shadow:0 24px 48px rgba(124,58,237,.14);
  border-color:#c4b5fd;
}
.instructor-photo {
  width:100%; aspect-ratio:1;
  border-radius:999px 999px 14px 14px;
  overflow:hidden; background:#e8eef6;
  flex-shrink:0;
}
.instructor-photo img { width:100%; height:100%; object-fit:cover; object-position:center top; }
.instructor-photo.placeholder { display:grid; place-items:center; }
.instructor-photo.placeholder span {
  width:64px; height:64px; border-radius:50%;
  display:grid; place-items:center;
  background:linear-gradient(135deg,#ede9fe,#c4b5fd);
  color:#6d28d9; font-weight:800; font-size:1.15rem; letter-spacing:.02em;
}
.instructor-card h3 {
  font-size:.97rem; font-weight:750; color:var(--ink);
  line-height:1.3; margin:0;
}
.instructor-subjects {
  font-size:.78rem; color:var(--ink-soft); font-weight:600;
  line-height:1.4; min-height:2.2em;
}
.btn-profile {
  min-height:2.2rem; padding:0 1rem; border-radius:999px;
  border:1.5px solid #c4b5fd; color:#6d28d9;
  background:transparent; font-size:.82rem; font-weight:700; width:100%;
  transition:background .2s, color .2s, border-color .2s;
  margin-top:auto;
}
.btn-profile:hover { background:#ede9fe; border-color:#6d28d9; }

/* Error state */
.teachers-error {
  grid-column:1/-1; text-align:center;
  padding:3rem 1rem; color:var(--ink-soft);
}
.teachers-error p { font-size:1.05rem; margin-bottom:1rem; }
.teachers-error button {
  padding:.6rem 1.4rem; border-radius:999px;
  background:var(--red); color:#fff;
  font-weight:700; font-size:.9rem; cursor:pointer;
  border:0; font-family:var(--font);
  transition:background .2s, transform .2s;
}
.teachers-error button:hover { background:var(--purple-d); transform:translateY(-1px); }

/* ════ STORIES — purple quote cards ════ */
.stories { background:var(--bg); }
.quote-slider { overflow:hidden; width:100%; }
.quote-track  { display:flex; gap:1rem; transition:transform .95s cubic-bezier(.22,1,.36,1); will-change:transform; }
.quote-card {
  flex:0 0 calc((100% - 2rem) / 3);
  padding:1.5rem 1.35rem; border-radius:18px;
  background:linear-gradient(180deg,#fff,#f5f3ff);
  border:1px solid #c4b5fd;
  box-shadow:0 14px 32px rgba(124,58,237,.08);
  transition:transform .3s ease,box-shadow .3s ease;
}
.quote-card:hover { transform:translateY(-6px); box-shadow:0 24px 48px rgba(124,58,237,.16); }
.quote-mark { font-size:2.4rem; line-height:1; color:#7c3aed; font-weight:800; margin-bottom:.35rem; }
.quote-card > p { font-size:1.02rem; line-height:1.6; color:#374151; margin-bottom:1.2rem; min-height:4.8em; }
.quote-card footer { display:flex; align-items:center; gap:.7rem; }
.quote-av {
  width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,#7c3aed,#8b5cf6); color:#fff; font-size:.8rem; font-weight:800;
}
.quote-card strong { display:block; font-size:.92rem; }
.quote-card span   { color:var(--muted); font-size:.8rem; }

/* ════ PARTNERS ════ */
.partners { max-width:none; padding:clamp(2.5rem,6vh,4rem) var(--pad); background:#f7f9fc; text-align:center; }
.partners h2 {
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.6rem,2.8vw,2.2rem); color:#163a66; margin-bottom:1.75rem;
}
.partners-slider { max-width:var(--max); margin:0 auto; overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.partners-track { display:flex; gap:1.25rem; width:max-content; animation:partnerMarquee 22s linear infinite; }
.partner-card { flex:0 0 220px; display:flex; flex-direction:column; align-items:center; gap:.75rem; padding:1rem; }
.partner-logo { width:96px;height:96px;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#fff;box-shadow:0 10px 24px rgba(15,23,42,.12); }
.partner-logo.eriam { background:linear-gradient(145deg,#1d4ed8,#60a5fa); border:3px solid #93c5fd; }
.partner-logo.jamb  { background:linear-gradient(145deg,#15803d,#22c55e); border:3px solid #86efac; }
.partner-logo.chris { background:linear-gradient(145deg,#ca8a04,#eab308); color:#14532d; border:3px solid #fde047; }
.partner-card p { font-size:.86rem; color:#334155; font-weight:650; max-width:16ch; line-height:1.35; }
@keyframes partnerMarquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }

/* ════ AFFILIATE — dark navy with gold ════ */
.affiliate-section {
  position:relative; overflow:hidden;
  padding:clamp(4rem,9vw,6.5rem) var(--pad); margin-top:1rem; color:#fff;
}
.affiliate-bg { position:absolute; inset:0; z-index:0; }
.affiliate-bg img { width:100%; height:100%; object-fit:cover; transform:scale(1.04); filter:saturate(1.05); }
.affiliate-tint {
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(115deg,rgba(11,31,68,.94) 0%,rgba(26,67,136,.82) 55%,rgba(11,31,68,.75) 100%),
    radial-gradient(circle at 85% 20%,rgba(245,192,66,.28),transparent 35%);
}
.affiliate-inner {
  position:relative; z-index:2; max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:1.4fr .9fr; gap:clamp(1.5rem,4vw,3rem); align-items:center;
}
.affiliate-kicker {
  display:inline-flex; margin-bottom:.85rem; padding:.35rem .8rem; border-radius:999px;
  background:rgba(245,192,66,.16); border:1px solid rgba(245,192,66,.35);
  color:var(--gold-soft); font-size:.8rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
}
.affiliate-copy h2 { font-size:clamp(2rem,3.8vw,3rem); font-weight:800; letter-spacing:-.03em; line-height:1.1; margin-bottom:.85rem; }
.affiliate-copy > p { color:rgba(255,255,255,.82); font-size:1.05rem; line-height:1.6; max-width:40ch; margin-bottom:1.5rem; font-weight:500; }
.affiliate-actions { display:flex; flex-wrap:wrap; gap:.75rem; }
.btn-gold {
  min-height:3rem; padding:0 1.35rem; border-radius:999px;
  background:linear-gradient(135deg,var(--gold),#e8a820);
  color:var(--navy); font-weight:800; box-shadow:0 12px 28px rgba(245,192,66,.3);
}
.btn-gold:hover { transform:translateY(-2px); background:linear-gradient(135deg,#ffd76a,var(--gold)); }
.btn-glass { min-height:3rem;padding:0 1.25rem;border-radius:999px;border:1.5px solid rgba(255,255,255,.4);background:rgba(255,255,255,.08);color:#fff;font-weight:700;backdrop-filter:blur(8px); }
.btn-glass:hover { background:rgba(255,255,255,.16); }
.affiliate-perks { list-style:none; display:grid; gap:.85rem; }
.affiliate-perks li {
  display:grid; gap:.15rem; padding:1rem 1.15rem; border-radius:18px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(10px); transition:transform .35s ease,background .35s ease;
}
.affiliate-perks li:hover { transform:translateX(8px) scale(1.03); background:rgba(255,255,255,.16); }
.affiliate-perks strong { font-size:1.15rem; color:var(--gold); }
.affiliate-perks span   { color:rgba(255,255,255,.78); font-size:.92rem; font-weight:600; }
@media(max-width:860px){ .affiliate-inner { grid-template-columns:1fr; } }

/* ════ ENDING CTA — electric blue ════ */
.ending-cta {
  position:relative; overflow:hidden;
  background:linear-gradient(135deg,#5b21b6 0%,#7c3aed 55%,#6d28d9 100%);
  padding:clamp(2.4rem,5vw,3.4rem) var(--pad);
}
.ending-cta::before {
  content:''; position:absolute; inset:-40%;
  background:conic-gradient(from 0deg,transparent,rgba(245,192,66,.18),transparent 40%);
  animation:spinGlow 10s linear infinite; pointer-events:none;
}
@keyframes spinGlow { to { transform:rotate(360deg); } }
.ending-cta-inner {
  position:relative; z-index:1; max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:minmax(0,1.4fr) auto; gap:1.75rem; align-items:center;
}
.ending-kicker { font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.78);margin-bottom:.7rem; }
.ending-cta-copy h2 { font-size:clamp(1.55rem,3vw,2.25rem);font-weight:800;letter-spacing:-.03em;line-height:1.15;color:#fff;margin-bottom:.75rem;max-width:20ch; }
.ending-cta-copy p { color:rgba(255,255,255,.82);font-size:1rem;line-height:1.65;max-width:48ch; }
.ending-cta-actions { display:grid; gap:.75rem; min-width:200px; }
.btn-ending-solid,.btn-ending-ghost,.btn-subscribe { min-height:2.9rem;border-radius:12px;font-weight:700;padding:0 1.25rem;justify-content:center; }
.btn-ending-solid { background:#fff; color:#6d28d9; }
.btn-ending-solid:hover { background:#f5f3ff; transform:translateY(-1px); }
.btn-ending-ghost { border:1.5px solid rgba(255,255,255,.55); color:#fff; background:transparent; }
.btn-ending-ghost:hover { background:rgba(255,255,255,.1); }

/* ════ DOWNLOAD ════ */
.download-section {
  padding:clamp(2.5rem,6vw,4rem) var(--pad);
  background:
    radial-gradient(ellipse at 10% 0%,rgba(245,192,66,.12),transparent 45%),
    linear-gradient(180deg,#f8fafc 0%,#eef2ff 100%);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.download-inner { max-width:var(--max);margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem; }
.download-inner h2 { font-size:clamp(1.45rem,2.6vw,2rem);font-weight:800;letter-spacing:-.02em;color:var(--ink);margin-bottom:.55rem; }
.download-inner > div > p:not(.kicker) { color:var(--ink-soft);max-width:44ch;line-height:1.55;font-weight:500; }
.download-actions { display:grid; gap:.45rem; justify-items:start; }
.download-note { color:var(--muted); font-size:.84rem; font-weight:600; }

/* ══ GOOGLE PLAY BUTTON ══ */
.btn-google-play {
  display:inline-flex; align-items:center; gap:.55rem;
  background:#000; color:#fff; border:none; cursor:pointer;
  padding:.55rem 1.1rem; border-radius:10px; font-size:.92rem; font-weight:700;
  transition:background .2s, transform .15s, box-shadow .2s;
  box-shadow:0 2px 10px rgba(0,0,0,.3);
}
.btn-google-play:hover { background:#1a1a1a; transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,.4); }
.btn-google-play svg { flex-shrink:0; }

/* ══ MODAL (dialog) ══ */
.scholaxia-modal {
  border:none; border-radius:20px; padding:0; max-width:420px; width:90%;
  box-shadow:0 24px 64px rgba(0,0,0,.35);
  animation:modal-pop .25s cubic-bezier(.34,1.56,.64,1) both;
}
.scholaxia-modal::backdrop { background:rgba(0,0,0,.55); backdrop-filter:blur(4px); }
@keyframes modal-pop {
  from { opacity:0; transform:scale(.88) translateY(12px); }
  to   { opacity:1; transform:scale(1) translateY(0); }
}
.modal-inner {
  position:relative; padding:2.2rem 2rem; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:1rem;
}
.modal-icon { font-size:3rem; line-height:1; }
.modal-inner h3 { margin:0; font-size:1.4rem; font-weight:800; color:#1a0533; }
.modal-inner p  { margin:0; color:#555; font-size:.97rem; line-height:1.6; max-width:32ch; }
.modal-inner .btn { margin-top:.5rem; min-width:160px; justify-content:center; }
.modal-close {
  position:absolute; top:.85rem; right:.85rem;
  background:rgba(0,0,0,.06); border:none; border-radius:50%;
  width:32px; height:32px; font-size:1rem; cursor:pointer; color:#555;
  display:grid; place-items:center; transition:background .15s;
}
.modal-close:hover { background:rgba(0,0,0,.12); }

/* ════ FOOTER ════ */
.site-footer { background:#0b1020; color:rgba(255,255,255,.78); padding:clamp(2.75rem,6vw,3.75rem) var(--pad) 1.5rem; position:relative; z-index:2; }
.site-footer-inner { max-width:var(--max);margin:0 auto 2rem;display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:1.75rem; }
.footer-logo { display:inline-flex;align-items:center;margin-bottom:.9rem;line-height:0;border-radius:12px;overflow:hidden;background:#fff;padding:.35rem .5rem; }
.footer-logo img { height:56px;width:auto;max-width:220px;object-fit:contain;display:block; }
.footer-about p,.footer-news p { font-size:.92rem;line-height:1.65;color:rgba(255,255,255,.62);max-width:34ch; }
.footer-phones { display:grid; gap:.35rem; margin-top:.9rem; }
.footer-phones a { color:rgba(255,255,255,.85); font-weight:700; font-size:.9rem; }
.footer-phones a:hover { color:#fff; }
.footer-col h4 { color:#fff;font-size:.95rem;font-weight:750;margin-bottom:.95rem; }
.footer-col > a { display:block;color:rgba(255,255,255,.62);font-size:.9rem;margin-bottom:.55rem;transition:color .2s; }
.footer-col > a:hover { color:#c4b5fd; }
.footer-link-hot { display:inline-flex !important;align-items:center;gap:.4rem;padding:.35rem .65rem;border-radius:8px;background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff !important;width:fit-content;margin-bottom:.65rem !important;font-weight:700; }
.hot-ico { font-size:.75rem; }
.course-chip { display:block;padding:.45rem .7rem;border-radius:8px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);margin-bottom:.45rem !important; }
.course-chip:hover { background:rgba(124,58,237,.2); color:#c4b5fd !important; }
.news-form { display:grid; gap:.45rem; margin-top:.85rem; }
.news-form label { font-size:.78rem; color:rgba(255,255,255,.55); }
.news-form input { min-height:2.7rem;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:#fff;padding:0 .9rem;font:inherit; }
.news-form input::placeholder { color:rgba(255,255,255,.35); }
.news-form input:focus { outline:none; border-color:#c4b5fd; }
.btn-subscribe { background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff;border:0;cursor:pointer;margin-top:.25rem; }
.btn-subscribe:hover { background:linear-gradient(135deg,#8b5cf6,#7c3aed); }
.site-footer-bottom { max-width:var(--max);margin:0 auto;padding-top:1.25rem;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.82rem;color:rgba(255,255,255,.45); }
.footer-legal { display:flex; gap:1rem; }
.footer-legal a { color:rgba(255,255,255,.5); }
.footer-legal a:hover { color:#c4b5fd; }

@keyframes floatY { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }

/* ════ RESPONSIVE ════ */
@media(max-width:980px){
  .nav { display:none; }
  .menu-btn { display:grid; }
  .mobile-nav.is-open { display:flex; }
  .showcase { grid-template-columns:1fr; }
  .hero-banner { min-height:clamp(640px,100dvh,900px); }
  .hero-tint { background:linear-gradient(180deg,rgba(10,5,0,.55) 0%,rgba(20,10,0,.72) 45%,rgba(8,4,0,.88) 100%); }
  .feature-grid,.stat-row { grid-template-columns:1fr 1fr; }
  .instructors-inner { grid-template-columns:1fr; }
  .instructor-card { flex-basis:calc((100% - .9rem) / 2); }
  .quote-card { flex-basis:calc((100% - 1rem) / 2); }
  .site-footer-inner,.ending-cta-inner { grid-template-columns:1fr; }
  .ending-cta-actions { grid-template-columns:1fr 1fr; min-width:0; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:640px){
  .top-actions .btn-pill { display:none; }
  .feature-grid,.stat-row,.site-footer-inner,.ending-cta-actions { grid-template-columns:1fr; }
  .instructor-card,.quote-card { flex-basis:100%; }
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after { animation:none !important; transition:none !important; }
  .page-fx,.cursor-glow { display:none !important; }
  .reveal-drop,.scroll-reveal { opacity:1 !important; transform:none !important; filter:none !important; }
}

/* ════════════════════════════════════════════════════════════════
   LANGUAGE + CURRENCY DROPDOWNS (topbar)
   ════════════════════════════════════════════════════════════════ */
.lang-wrap {
  position:relative; display:inline-flex; align-items:center;
}
.lang-btn {
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.38rem .7rem; border-radius:8px;
  border:1.5px solid var(--line); background:#fff;
  font-size:.82rem; font-weight:700; color:var(--ink);
  cursor:pointer; white-space:nowrap;
  transition:border-color .2s, background .2s;
  font-family:var(--font);
}
.lang-btn:hover { border-color:#c4b5fd; background:#f5f3ff; }
.lang-btn .lang-arrow {
  font-size:.65rem; transition:transform .25s;
  display:inline-block; margin-left:.1rem;
}
.lang-wrap.open .lang-arrow { transform:rotate(180deg); }

.lang-dropdown {
  display:none; position:absolute; top:calc(100% + 6px); right:0;
  min-width:180px; border-radius:12px;
  background:#fff; border:1.5px solid var(--line);
  box-shadow:0 16px 40px rgba(0,0,0,.12);
  z-index:200; overflow:hidden;
}
.lang-wrap.open .lang-dropdown { display:block; animation:dropDown .2s cubic-bezier(.22,1,.36,1); }
@keyframes dropDown {
  from { opacity:0; transform:translateY(-8px); }
  to   { opacity:1; transform:translateY(0); }
}
.lang-option {
  display:flex; align-items:center; gap:.65rem;
  padding:.7rem 1rem; font-size:.88rem; font-weight:600;
  cursor:pointer; transition:background .15s;
}
.lang-option:hover { background:#f5f3ff; }
.lang-option.active { background:#ede9fe; color:#6d28d9; }
.lang-flag { font-size:1.1rem; line-height:1; }

/* RTL support for Arabic */
html[dir="rtl"] body { font-family:'Outfit','Arial',sans-serif; }
html[dir="rtl"] .hero-copy { text-align:right; }
html[dir="rtl"] .topbar  { flex-direction:row-reverse; }
html[dir="rtl"] .nav     { flex-direction:row-reverse; }

/* currency dropdown reuses .lang-wrap / .lang-btn / .lang-dropdown / .lang-option */

/* ════════════════════════════════════════════════════════════════
   TESTIMONIAL FLAG / LOCATION
   ════════════════════════════════════════════════════════════════ */
.quote-location {
  font-size:.72rem; color:var(--muted); font-weight:500;
  display:flex; align-items:center; gap:.25rem; margin-top:.15rem;
}
.quote-location .flag { font-size:.9rem; }

/* ════════════════════════════════════════════════════════════════
   FOOTER LEGAL BADGES
   ════════════════════════════════════════════════════════════════ */
.footer-legal-badges {
  display:flex; flex-wrap:wrap; gap:.45rem; margin-top:1rem;
}
.legal-badge {
  display:inline-flex; align-items:center; gap:.3rem;
  padding:.28rem .65rem; border-radius:6px;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.07);
  font-size:.68rem; font-weight:700; color:rgba(255,255,255,.7);
  letter-spacing:.04em; text-transform:uppercase;
}
.legal-badge .badge-icon { font-size:.8rem; }

/* ════════════════════════════════════════════════════════════════
   HERO EXAM TYPES TAGS
   ════════════════════════════════════════════════════════════════ */
.hero-exams {
  display:flex; flex-wrap:wrap; gap:.4rem;
  margin-bottom:1rem;
  animation:heroFadeUp .85s cubic-bezier(.22,1,.36,1) .55s both;
}
.exam-tag {
  padding:.22rem .65rem; border-radius:999px;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.35);
  font-size:.72rem; font-weight:700; color:#fff;
  letter-spacing:.04em; backdrop-filter:blur(6px);
}

/* Trust strip global text */
.trust-global {
  grid-column:1/-1; text-align:center;
  font-size:.8rem; font-weight:700; color:#6d28d9;
  padding:.35rem 0 .1rem; border-top:1px solid #e4eaf2;
  margin-top:.25rem;
  display:flex; align-items:center; justify-content:center; gap:.4rem;
}
.trust-globe { font-size:1rem; }

/* ═══════════ HERO SHOWCASE — circle-wipe carousel (PC only) ═══════════
   The circle is ONLY the transition: each image wipes in from a growing
   circle, shows in its natural shape, then shrinks away for the next. */
.hero-phone {
  position:absolute; right:2.5rem; bottom:5.5rem; z-index:4;
  width:clamp(250px,22vw,330px); aspect-ratio:1/1;
  pointer-events:none;
}
.hero-reveal {
  position:absolute; inset:0;
  clip-path:circle(0% at 50% 50%);
  opacity:0;
}
.hero-reveal img {
  width:100%; height:100%; object-fit:contain; display:block; user-select:none;
  filter:drop-shadow(0 22px 44px rgba(0,0,0,.5));
}
.hero-reveal.is-active {
  opacity:1;
  animation:heroRevealIn 7s cubic-bezier(.22,1,.36,1) forwards;
}
@keyframes heroRevealIn {
  0%   { clip-path:circle(0% at 50% 50%); opacity:1; }
  16%  { clip-path:circle(75% at 50% 50%); opacity:1; }
  84%  { clip-path:circle(75% at 50% 50%); opacity:1; }
  100% { clip-path:circle(0% at 50% 50%); opacity:1; }
}
/* Gentle breathing float on the whole showcase */
.hero-phone { animation:heroPhoneFloat 7s ease-in-out infinite; will-change:transform; }
@keyframes heroPhoneFloat {
  0%,100% { transform:translateY(0) rotate(0.001deg); }
  50%     { transform:translateY(-10px) rotate(0.001deg); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-phone { animation:none; }
  .hero-reveal.is-active { clip-path:circle(75% at 50% 50%); animation:none; opacity:1; }
}
/* Hide on touch / narrow screens */
@media (max-width:1024px), (hover:none) {
  .hero-phone { display:none; }
}