@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/jakarta-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/jakarta-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url('/assets/fonts/jakarta-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/inter-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/inter-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Noto Sans Devanagari';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/noto-400-devanagari.woff2') format('woff2');unicode-range:U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;}
@font-face{font-family:'Noto Sans Devanagari';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/noto-700-devanagari.woff2') format('woff2');unicode-range:U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;}

/*═══════════════════════════════════════════════════════════════
  LEELAN FOUNDATION — DESIGN SYSTEM v3
  Premium education product. Mobile-first. Dark-mode ready.
═══════════════════════════════════════════════════════════════*/

/* metric-matched fallbacks — prevents font-swap CLS */
@font-face{font-family:'JakFB';src:local('Arial');size-adjust:104%;ascent-override:96%;descent-override:24%;line-gap-override:0%}
@font-face{font-family:'IntFB';src:local('Arial');size-adjust:107%;ascent-override:90%;descent-override:22%;line-gap-override:0%}
@font-face{font-family:'DevFB';src:local('Arial');size-adjust:104%;ascent-override:105%;descent-override:32%;line-gap-override:0%}

/*───────────────── TOKENS ─────────────────*/
:root{
  /* brand — deep indigo + saffron accent, avoids the generic coaching red/blue */
  --ink-900:#0B1020; --ink-800:#141A2E; --ink-700:#1E263F;
  --brand-50:#EEF2FF;  --brand-100:#E0E7FF; --brand-200:#C7D2FE;
  --brand-300:#A5B4FC; --brand-400:#818CF8; --brand-500:#6366F1;
  --brand-600:#4F46E5; --brand-700:#4338CA; --brand-800:#3730A3; --brand-900:#312E81;
  --gold-300:#FCD34D; --gold-400:#FBBF24; --gold-500:#F59E0B; --gold-600:#D97706;
  --teal-400:#2DD4BF; --teal-500:#14B8A6; --teal-600:#0D9488;

  /* semantic */
  --ok-50:#ECFDF5; --ok-200:#A7F3D0; --ok-600:#047857; --ok-700:#03674A;
  --warn-50:#FFFBEB; --warn-200:#FDE68A; --warn-600:#D97706; --warn-700:#B45309;
  --err-50:#FEF2F2; --err-200:#FECACA; --err-600:#DC2626; --err-700:#B91C1C;
  --info-50:#EFF6FF; --info-200:#BFDBFE; --info-600:#2563EB;

  /* neutral ramp */
  --n-0:#FFFFFF; --n-25:#FCFCFD; --n-50:#F9FAFB; --n-100:#F2F4F7; --n-200:#E4E7EC;
  --n-300:#D0D5DD; --n-400:#98A2B3; --n-500:#667085; --n-600:#475467;
  --n-700:#344054; --n-800:#1D2939; --n-900:#101828; --n-950:#0C111D;

  /* surfaces (theme-aware) */
  --bg:var(--n-0); --bg-sub:var(--n-50); --bg-mut:var(--n-100);
  --surface:var(--n-0); --surface-2:var(--n-25);
  --line:var(--n-200); --line-2:var(--n-300);
  --tx:var(--n-900); --tx-2:var(--n-700); --tx-3:var(--n-500); --tx-4:var(--n-400);
  --accent:var(--brand-600); --accent-h:var(--brand-700); --accent-sub:var(--brand-50);

  /* type scale — 1.2 minor third, fluid */
  --f-dsp:'Plus Jakarta Sans','Noto Sans Devanagari','JakFB','DevFB',system-ui,sans-serif;
  --f-txt:'Inter','Noto Sans Devanagari','IntFB','DevFB',system-ui,-apple-system,sans-serif;
  --f-mono:ui-monospace,SFMono-Regular,'SF Mono',Menlo,monospace;
  --t-xs:.75rem; --t-sm:.8125rem; --t-base:.9375rem; --t-md:1rem;
  --t-lg:1.125rem; --t-xl:1.25rem;
  --t-h4:clamp(1.0625rem,.98rem + .4vw,1.1875rem);
  --t-h3:clamp(1.1875rem,1.05rem + .7vw,1.4375rem);
  --t-h2:clamp(1.4375rem,1.15rem + 1.5vw,2rem);
  --t-h1:clamp(1.875rem,1.35rem + 2.6vw,3.25rem);
  --t-dsp:clamp(2.25rem,1.5rem + 3.6vw,4rem);

  /* spacing — 4px base */
  --s-1:.25rem; --s-2:.5rem; --s-3:.75rem; --s-4:1rem; --s-5:1.25rem;
  --s-6:1.5rem; --s-8:2rem; --s-10:2.5rem; --s-12:3rem; --s-16:4rem;
  --s-20:5rem; --s-24:6rem; --s-32:8rem;

  /* radius */
  --r-xs:6px; --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:20px; --r-2xl:28px; --r-full:999px;

  /* elevation — soft, layered, never harsh */
  --e-1:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06);
  --e-2:0 2px 4px -1px rgba(16,24,40,.04),0 4px 8px -2px rgba(16,24,40,.06);
  --e-3:0 4px 8px -2px rgba(16,24,40,.05),0 12px 20px -4px rgba(16,24,40,.08);
  --e-4:0 8px 16px -4px rgba(16,24,40,.06),0 24px 40px -8px rgba(16,24,40,.10);
  --e-5:0 16px 32px -8px rgba(16,24,40,.08),0 40px 64px -12px rgba(16,24,40,.14);
  --e-brand:0 8px 24px -6px rgba(79,70,229,.35);
  --e-gold:0 8px 24px -6px rgba(245,158,11,.35);

  /* motion */
  --ez:cubic-bezier(.4,0,.2,1); --ez-out:cubic-bezier(.16,1,.3,1);
  --ez-spring:cubic-bezier(.34,1.56,.64,1);
  --d-1:120ms; --d-2:200ms; --d-3:320ms; --d-4:480ms;

  --nav-h:64px; --wrap:1200px; --wrap-nar:760px;
  /* back-compat aliases so any legacy inline style still resolves */
  --royal-lt:var(--accent-sub); --royal:var(--brand-700); --royal-2:var(--accent);
  --sh-sm:var(--e-1); --sh-md:var(--e-2); --sh-lg:var(--e-3); --sh-xl:var(--e-4);
  --line-blue:var(--brand-200); --bg-2:var(--bg-sub); --bg-3:var(--bg-mut);
  --f-head:var(--f-dsp); --f-sans:var(--f-txt);
}

[data-theme="dark"]{
  --bg:var(--n-950); --bg-sub:#0F1521; --bg-mut:#161D2C;
  --surface:#111827; --surface-2:#151D2B;
  --line:#243044; --line-2:#2E3B52;
  --tx:#F9FAFB; --tx-2:#D0D5DD; --tx-3:#98A2B3; --tx-4:#667085;
  --accent:var(--brand-400); --accent-h:var(--brand-300); --accent-sub:rgba(99,102,241,.14);
  --ok-50:rgba(5,150,105,.14); --warn-50:rgba(217,119,6,.14);
  --err-50:rgba(220,38,38,.14); --info-50:rgba(37,99,235,.14);
  --ok-200:rgba(16,185,129,.4); --warn-200:rgba(245,158,11,.4);
  --err-200:rgba(239,68,68,.4); --info-200:rgba(59,130,246,.4);
  --e-1:0 1px 2px rgba(0,0,0,.3); --e-2:0 2px 6px rgba(0,0,0,.34);
  --e-3:0 6px 16px rgba(0,0,0,.4); --e-4:0 12px 32px rgba(0,0,0,.46);
  --e-5:0 24px 56px rgba(0,0,0,.55);
}

/*───────────────── RESET ─────────────────*/
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 20px);text-size-adjust:100%}
html{overflow-x:hidden}
body{max-width:100%;font-family:var(--f-txt);font-size:var(--t-base);line-height:1.65;color:var(--tx);
  background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;font-feature-settings:"cv02","cv03","cv04","cv11";
  transition:background var(--d-2) var(--ez),color var(--d-2) var(--ez)}
img,video,canvas{max-width:100%;height:auto;display:block}
svg{max-width:100%;display:inline-block;vertical-align:middle;flex-shrink:0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
table{border-collapse:collapse;width:100%}
h1,h2,h3,h4,h5{font-family:var(--f-dsp);font-weight:700;line-height:1.15;letter-spacing:-.022em;color:var(--tx)}
:focus-visible{outline:2.5px solid var(--accent);outline-offset:3px;border-radius:var(--r-xs)}
:focus:not(:focus-visible){outline:none}
::selection{background:var(--brand-200);color:var(--brand-900)}
[data-theme="dark"] ::selection{background:var(--brand-700);color:#fff}

.skip{position:fixed;left:-9999px;top:0;z-index:9999;background:var(--accent);color:#fff;
  padding:var(--s-3) var(--s-6);border-radius:0 0 var(--r-md) 0;font-weight:600;box-shadow:var(--e-4)}
.skip:focus{left:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/*───────────────── LAYOUT ─────────────────*/
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--s-5)}
.wrap-nar{max-width:var(--wrap-nar)}
.sec{padding-block:var(--s-16)}
.sec-sm{padding-block:var(--s-10)}
.sec-sub{background:var(--bg-sub)}
.center{text-align:center}
.stack{display:flex;flex-direction:column}
.row{display:flex;gap:var(--s-3);flex-wrap:wrap;align-items:center}
.row-c{justify-content:center}
.grid{display:grid;gap:var(--s-5)}
.g-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.g-3{grid-template-columns:repeat(auto-fit,minmax(272px,1fr))}
.g-4{grid-template-columns:repeat(auto-fit,minmax(248px,1fr))}
.mt-2{margin-top:var(--s-2)}.mt-4{margin-top:var(--s-4)}.mt-6{margin-top:var(--s-6)}
.mt-8{margin-top:var(--s-8)}.mt-10{margin-top:var(--s-10)}.mt-12{margin-top:var(--s-12)}
.mb-2{margin-bottom:var(--s-2)}.mb-4{margin-bottom:var(--s-4)}.mb-6{margin-bottom:var(--s-6)}
.mb-8{margin-bottom:var(--s-8)}.mb-10{margin-bottom:var(--s-10)}

/*───────────────── TYPOGRAPHY ─────────────────*/
.dsp{font-family:var(--f-dsp);font-size:var(--t-dsp);font-weight:800;letter-spacing:-.035em;line-height:1.04}
.h1{font-size:var(--t-h1);font-weight:800;letter-spacing:-.03em;line-height:1.1}
.h2{font-size:var(--t-h2);font-weight:700;letter-spacing:-.025em}
.h3{font-size:var(--t-h3);font-weight:700;letter-spacing:-.02em}
.h4{font-size:var(--t-h4);font-weight:600;letter-spacing:-.015em}
.lead{font-size:var(--t-lg);line-height:1.62;color:var(--tx-2)}
.body-lg{font-size:var(--t-md);line-height:1.7;color:var(--tx-2)}
.muted{color:var(--tx-3)}
.tiny{font-size:var(--t-xs);color:var(--tx-3)}
.mono{font-family:var(--f-mono);font-size:.9em}
.grad-tx{background:linear-gradient(112deg,var(--brand-500) 0%,var(--brand-400) 38%,var(--teal-400) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.grad-gold{background:linear-gradient(112deg,var(--gold-400),var(--gold-300) 60%,#FDE68A);
  -webkit-background-clip:text;background-clip:text;color:transparent}
@supports (text-wrap:balance){.balance{text-wrap:balance}}
@supports (text-wrap:pretty){.pretty{text-wrap:pretty}}

/* eyebrow */
.eyebrow{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--t-xs);
  font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);
  background:var(--accent-sub);border:1px solid var(--brand-200);
  padding:var(--s-1) var(--s-3);border-radius:var(--r-full)}
[data-theme="dark"] .eyebrow{border-color:rgba(129,140,248,.3)}

/* section head */
.sec-head{max-width:660px;margin-inline:auto;text-align:center;margin-bottom:var(--s-12)}
.sec-head .h2{margin-block:var(--s-4) var(--s-3)}
.sec-head p{color:var(--tx-2);font-size:var(--t-md)}
.sec-head-l{max-width:660px;text-align:left;margin-inline:0}

/*───────────────── BUTTONS ─────────────────*/
.btn{--bh:44px;display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);
  min-height:var(--bh);padding:0 var(--s-5);border-radius:var(--r-md);
  font-family:var(--f-txt);font-size:var(--t-base);font-weight:600;letter-spacing:-.01em;
  white-space:nowrap;cursor:pointer;position:relative;isolation:isolate;
  transition:transform var(--d-1) var(--ez),box-shadow var(--d-2) var(--ez),
             background var(--d-2) var(--ez),border-color var(--d-2) var(--ez),color var(--d-2) var(--ez)}
.btn:active{transform:translateY(1px) scale(.99)}
.btn svg{flex-shrink:0}

.btn-pri{background:linear-gradient(180deg,var(--brand-500),var(--brand-600));color:#fff;
  box-shadow:var(--e-2),inset 0 1px 0 rgba(255,255,255,.16)}
.btn-pri:hover{background:linear-gradient(180deg,var(--brand-600),var(--brand-700));
  box-shadow:var(--e-brand);transform:translateY(-1px);color:#fff}

.btn-gold{background:linear-gradient(180deg,var(--gold-400),var(--gold-500));color:#42210B;
  box-shadow:var(--e-2),inset 0 1px 0 rgba(255,255,255,.3)}
.btn-gold:hover{box-shadow:var(--e-gold);transform:translateY(-1px)}

.btn-sec{background:var(--surface);color:var(--tx);border:1px solid var(--line-2);box-shadow:var(--e-1)}
.btn-sec:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-sub);transform:translateY(-1px)}

.btn-ghost{background:transparent;color:var(--tx-2)}
.btn-ghost:hover{background:var(--bg-mut);color:var(--tx)}

.btn-glass{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.btn-glass:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.4);color:#fff;transform:translateY(-1px)}

.btn-wa{background:#0F7A41;color:#fff;box-shadow:var(--e-2)}
.btn-wa:hover{background:#0B5F33;color:#fff;transform:translateY(-1px);box-shadow:0 8px 24px -6px rgba(15,122,65,.4)}

.btn-sm{--bh:36px;padding:0 var(--s-4);font-size:var(--t-sm);border-radius:var(--r-sm)}
.btn-lg{--bh:52px;padding:0 var(--s-6);font-size:var(--t-md);border-radius:var(--r-lg)}
.btn-block{width:100%}
.btn-icon{padding:0;width:var(--bh);flex-shrink:0}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.5;pointer-events:none}

/* arrow nudge */
.btn .ar{transition:transform var(--d-2) var(--ez-out)}
.btn:hover .ar{transform:translateX(3px)}

/*───────────────── CARDS ─────────────────*/
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:var(--s-6);position:relative;
  transition:transform var(--d-2) var(--ez-out),box-shadow var(--d-2) var(--ez),border-color var(--d-2) var(--ez)}
.card-i{box-shadow:var(--e-1)}
.card-i:hover{transform:translateY(-3px);box-shadow:var(--e-4);border-color:var(--brand-200)}
[data-theme="dark"] .card-i:hover{border-color:var(--brand-700)}
.card-flat{box-shadow:none}
.card-pad-sm{padding:var(--s-5)}
.card h3{font-size:var(--t-h4);margin-bottom:var(--s-2)}
.card p{color:var(--tx-2);font-size:var(--t-base)}

/* gradient-ring feature card */
.card-ring{position:relative;background:var(--surface);border:1px solid transparent;
  background-clip:padding-box}
.card-ring::before{content:"";position:absolute;inset:-1px;border-radius:inherit;z-index:-1;
  background:linear-gradient(135deg,var(--brand-300),var(--teal-400) 50%,var(--gold-300));
  opacity:0;transition:opacity var(--d-3) var(--ez)}
.card-ring:hover::before{opacity:1}

/* glass card — for use over dark/gradient only */
.glass{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);
  border-radius:var(--r-xl);box-shadow:0 8px 32px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.14)}

/* link card */
a.card{display:block;color:inherit}
a.card:hover h3{color:var(--accent)}

/*───────────────── BADGES ─────────────────*/
.badge{display:inline-flex;align-items:center;gap:5px;font-size:var(--t-xs);font-weight:650;
  padding:3px 9px;border-radius:var(--r-full);border:1px solid;white-space:nowrap;line-height:1.5}
.b-ok{background:var(--ok-50);color:var(--ok-700);border-color:var(--ok-200)}
.b-warn{background:var(--warn-50);color:var(--warn-700);border-color:var(--warn-200)}
.b-err{background:var(--err-50);color:var(--err-700);border-color:var(--err-200)}
.b-info{background:var(--info-50);color:var(--info-600);border-color:var(--info-200)}
.b-neutral{background:var(--bg-mut);color:var(--tx-3);border-color:var(--line)}
.b-brand{background:var(--accent-sub);color:var(--accent);border-color:var(--brand-200)}
[data-theme="dark"] .b-ok{color:#6EE7B7}[data-theme="dark"] .b-warn{color:#FCD34D}
[data-theme="dark"] .b-err{color:#FCA5A5}[data-theme="dark"] .b-info{color:#93C5FD}
[data-theme="dark"] .b-brand{border-color:rgba(129,140,248,.32)}
.badge-dot::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.badge-live::before{animation:pulse 2s var(--ez) infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.8)}}

/*───────────────── ALERTS ─────────────────*/
.alert{display:flex;gap:var(--s-3);padding:var(--s-4) var(--s-5);border-radius:var(--r-md);
  border:1px solid;font-size:var(--t-base);line-height:1.65;margin-block:var(--s-5)}
.alert-ic{flex-shrink:0;margin-top:1px}
.alert b,.alert strong{font-weight:650}
.alert a{text-decoration:underline;font-weight:600;text-underline-offset:2px}
.a-info{background:var(--info-50);border-color:var(--info-200);color:#1E40AF}
.a-ok{background:var(--ok-50);border-color:var(--ok-200);color:var(--ok-700)}
.a-warn{background:var(--warn-50);border-color:var(--warn-200);color:var(--warn-700)}
.a-err{background:var(--err-50);border-color:var(--err-200);color:var(--err-700)}
[data-theme="dark"] .a-info{color:#93C5FD}[data-theme="dark"] .a-ok{color:#6EE7B7}
[data-theme="dark"] .a-warn{color:#FCD34D}[data-theme="dark"] .a-err{color:#FCA5A5}

/*───────────────── AI ANSWER BLOCK (GEO) ─────────────────*/
.answer{position:relative;background:linear-gradient(135deg,var(--accent-sub),transparent 70%),var(--surface);
  border:1px solid var(--brand-200);border-radius:var(--r-lg);padding:var(--s-6);
  margin-bottom:var(--s-8);box-shadow:var(--e-1)}
[data-theme="dark"] .answer{border-color:rgba(129,140,248,.28)}
.answer::before{content:"";position:absolute;left:0;top:var(--s-5);bottom:var(--s-5);width:3px;
  border-radius:0 3px 3px 0;background:linear-gradient(180deg,var(--brand-500),var(--teal-400))}
.answer>h2{font-size:var(--t-sm);font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--accent);display:flex;align-items:center;gap:var(--s-2);margin-bottom:var(--s-3)}
.answer p{font-size:var(--t-md);line-height:1.72;color:var(--tx-2)}
.answer p + p{margin-top:var(--s-3)}
.answer strong{color:var(--tx);font-weight:650}

/*───────────────── NAV ─────────────────*/
.nav{position:fixed;top:0;left:0;right:0;inset:0 0 auto;z-index:900;height:var(--nav-h);
  background:var(--bg);background:color-mix(in srgb,var(--bg) 82%,transparent);
  backdrop-filter:blur(18px) saturate(180%);-webkit-backdrop-filter:blur(18px) saturate(180%);
  border-bottom:1px solid transparent;transition:border-color var(--d-2) var(--ez),box-shadow var(--d-2) var(--ez)}
.nav.scrolled{border-bottom-color:var(--line);box-shadow:0 1px 3px rgba(16,24,40,.05)}
[data-theme="dark"] .nav.scrolled{box-shadow:0 1px 3px rgba(0,0,0,.4)}
.nav-in{height:100%;width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--s-5);
  display:flex;align-items:center;gap:var(--s-4);min-width:0}
.brand{display:flex;align-items:center;gap:var(--s-3);margin-right:auto;min-width:0;overflow:hidden}
.brand-mark{width:36px;height:36px;border-radius:10px;flex-shrink:0;
  background:linear-gradient(135deg,var(--brand-500),var(--brand-700));
  display:grid;place-items:center;color:var(--gold-300);font-family:var(--f-dsp);
  font-weight:800;font-size:19px;box-shadow:var(--e-2),inset 0 1px 0 rgba(255,255,255,.2)}
.brand-tx{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.brand-hi{font-family:var(--f-dsp);font-size:14.5px;font-weight:700;color:var(--tx);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand-en{font-size:9px;font-weight:600;letter-spacing:.12em;color:var(--tx-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.nav-links{display:flex;align-items:center;gap:2px;flex-wrap:nowrap;white-space:nowrap}
.nav-a{position:relative;white-space:nowrap;flex-shrink:0;padding:var(--s-2) var(--s-3);border-radius:var(--r-sm);
  font-size:var(--t-base);font-weight:500;color:var(--tx-2);
  transition:color var(--d-1) var(--ez),background var(--d-1) var(--ez)}
.nav-a:hover{color:var(--tx);background:var(--bg-mut)}
.nav-a[aria-current="page"]{color:var(--accent);font-weight:600}
.nav-a[aria-current="page"]::after{content:"";position:absolute;left:var(--s-3);right:var(--s-3);
  bottom:3px;height:2px;border-radius:2px;background:var(--accent)}
.nav-r{display:flex;align-items:center;gap:var(--s-2);flex-shrink:0;margin-left:auto}

.icon-btn{width:36px;height:36px;border-radius:var(--r-sm);display:grid;place-items:center;
  color:var(--tx-2);border:1px solid transparent;transition:all var(--d-1) var(--ez)}
.icon-btn:hover{background:var(--bg-mut);color:var(--tx);border-color:var(--line)}

.burger{display:none;width:38px;height:38px;border-radius:var(--r-sm);place-items:center;
  border:1px solid var(--line);color:var(--tx)}
.burger:hover{background:var(--bg-mut)}
.burger i{display:block;width:17px;height:1.8px;background:currentColor;border-radius:2px;position:relative;transition:all var(--d-2) var(--ez)}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:17px;height:1.8px;
  background:currentColor;border-radius:2px;transition:all var(--d-2) var(--ez)}
.burger i::before{top:-5.5px}.burger i::after{top:5.5px}
.burger[aria-expanded="true"] i{background:transparent}
.burger[aria-expanded="true"] i::before{top:0;transform:rotate(45deg)}
.burger[aria-expanded="true"] i::after{top:0;transform:rotate(-45deg)}

.mnav{position:fixed;top:var(--nav-h);left:0;right:0;bottom:auto;inset:var(--nav-h) 0 auto;z-index:890;background:var(--bg);
  border-bottom:1px solid var(--line);box-shadow:var(--e-4);
  max-height:calc(100vh - var(--nav-h));max-height:calc(100dvh - var(--nav-h));overflow-y:auto;overscroll-behavior:contain;
  padding:var(--s-4) var(--s-5) var(--s-8);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity var(--d-2) var(--ez),transform var(--d-2) var(--ez-out),visibility var(--d-2)}
.mnav.open{opacity:1;visibility:visible;transform:none}
.mnav a{display:flex;align-items:center;justify-content:space-between;
  padding:var(--s-3);border-radius:var(--r-sm);font-size:var(--t-md);font-weight:550;color:var(--tx-2)}
.mnav a:hover{background:var(--bg-mut);color:var(--accent)}
.mnav-h{font-size:var(--t-xs);font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--tx-4);padding:var(--s-5) var(--s-3) var(--s-2)}

/*───────────────── BREADCRUMB ─────────────────*/
.crumbs{padding-block:var(--s-3);border-bottom:1px solid var(--line);background:var(--bg-sub)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2);font-size:var(--t-sm)}
.crumbs li{display:flex;align-items:center;gap:var(--s-2);color:var(--tx-3)}
.crumbs li+li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--n-300)}
.crumbs a{color:var(--tx-3);transition:color var(--d-1)}
.crumbs a:hover{color:var(--accent)}
.crumbs [aria-current]{color:var(--tx);font-weight:600}

/*───────────────── HERO ─────────────────*/
.hero{position:relative;overflow:hidden;background:var(--ink-900);color:#fff;
  padding-top:calc(var(--nav-h) + var(--s-16));padding-bottom:var(--s-16)}
.hero-bg{position:absolute;inset:0;pointer-events:none}
.hero-bg::before{content:"";position:absolute;inset:0;
  background:
    radial-gradient(900px 500px at 8% -12%,rgba(99,102,241,.42),transparent 62%),
    radial-gradient(760px 420px at 92% 4%,rgba(20,184,166,.24),transparent 60%),
    radial-gradient(600px 400px at 60% 100%,rgba(245,158,11,.14),transparent 62%)}
.hero-bg::after{content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 100% 70% at 50% 0%,#000 40%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 100% 70% at 50% 0%,#000 40%,transparent 78%)}
.hero>.wrap{position:relative;z-index:1}
.hero h1{color:#fff}
.hero .lead{color:rgba(255,255,255,.74);max-width:34em}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--s-12);align-items:center}
@media (max-width:1079px){.hero-grid>aside{max-width:520px}}

/* trust strip */
.tstrip{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);align-items:center;
  padding-top:var(--s-6);margin-top:var(--s-8);border-top:1px solid rgba(255,255,255,.1)}
.tstrip-i{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-sm);color:rgba(255,255,255,.66)}
.tstrip-i svg{color:var(--teal-400);flex-shrink:0}

/*───────────────── STAT ─────────────────*/
.stat{text-align:center;padding:var(--s-5) var(--s-4)}
.stat-n{font-family:var(--f-dsp);font-size:clamp(1.75rem,1.3rem + 2vw,2.5rem);font-weight:800;
  letter-spacing:-.035em;line-height:1;background:linear-gradient(150deg,var(--brand-500),var(--teal-500));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.stat-l{font-size:var(--t-sm);font-weight:600;color:var(--tx-2);margin-top:var(--s-2)}
.stat-s{font-size:var(--t-xs);color:var(--tx-4);margin-top:2px}

/*───────────────── EXAM CARD ─────────────────*/
.xcard{display:flex;flex-direction:column;gap:var(--s-3);height:100%}
.xcard-top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3)}
.xcard-ic{width:42px;height:42px;border-radius:var(--r-md);display:grid;place-items:center;flex-shrink:0;
  background:linear-gradient(140deg,var(--accent-sub),transparent);color:var(--accent);
  border:1px solid var(--brand-200);transition:all var(--d-3) var(--ez-out)}
[data-theme="dark"] .xcard-ic{border-color:rgba(129,140,248,.28)}
.card-i:hover .xcard-ic{transform:scale(1.06) rotate(-3deg);
  background:linear-gradient(140deg,var(--brand-500),var(--brand-700));color:#fff;border-color:transparent}
.xcard h3{font-size:var(--t-md);line-height:1.35;margin:0}
.xcard-hi{font-size:var(--t-xs);color:var(--tx-3)}
.xcard p{font-size:var(--t-sm);line-height:1.6;color:var(--tx-2)}
.xcard-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:var(--s-3)}
.chip{display:inline-flex;align-items:center;gap:4px;font-size:var(--t-xs);font-weight:550;
  padding:3px 9px;border-radius:var(--r-full);background:var(--bg-mut);color:var(--tx-2);border:1px solid var(--line)}
.xcard-cta{display:flex;align-items:center;gap:6px;font-size:var(--t-sm);font-weight:650;
  color:var(--accent);padding-top:var(--s-3);margin-top:auto}

/*───────────────── TABLE ─────────────────*/
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);
  border-radius:var(--r-lg);background:var(--surface);margin-block:var(--s-5)}
.tbl-wrap table{margin:0;min-width:520px}
table.data{font-size:var(--t-base)}
table.data thead th{background:var(--bg-sub);text-align:left;padding:var(--s-3) var(--s-4);
  font-size:var(--t-xs);font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--tx-3);border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0}
table.data td{padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--line);color:var(--tx-2);vertical-align:top}
table.data tbody tr:last-child td{border-bottom:0}
table.data tbody tr{transition:background var(--d-1)}
table.data tbody tr:hover{background:var(--bg-sub)}
table.data a{color:var(--accent);font-weight:600}
table.data a:hover{text-decoration:underline}

/* spec table (label/value) */
table.spec th{width:36%;text-align:left;padding:var(--s-3) var(--s-4);background:var(--bg-sub);
  font-size:var(--t-sm);font-weight:650;color:var(--tx);border-bottom:1px solid var(--line);vertical-align:top}
table.spec td{padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--line);
  color:var(--tx-2);font-size:var(--t-base);vertical-align:top}
table.spec tbody tr:last-child th,table.spec tbody tr:last-child td{border-bottom:0}
@media (max-width:560px){
  table.spec{min-width:0}
  table.spec th{width:44%;font-size:var(--t-sm);padding:var(--s-3)}
  table.spec td{font-size:var(--t-sm);padding:var(--s-3)}
}

/*───────────────── VERIFICATION UI ─────────────────*/
.verify{display:flex;gap:var(--s-3);align-items:flex-start;padding:var(--s-4) var(--s-5);
  border-radius:var(--r-md);border:1px solid;margin-bottom:var(--s-6);font-size:var(--t-sm)}
.verify-t{font-weight:650;margin-bottom:2px}
.verify-d{font-size:var(--t-xs);line-height:1.6;color:inherit;opacity:1}
.verify-d a{text-decoration:underline;font-weight:600}
.verify.v-ok{background:var(--ok-50);border-color:var(--ok-200);color:var(--ok-700)}
.verify.v-warn,.verify.v-conf{background:var(--warn-50);border-color:var(--warn-200);color:var(--warn-700)}
.verify.v-none{background:var(--bg-sub);border-color:var(--line-2);color:var(--tx-2)}
[data-theme="dark"] .verify.v-ok{color:#6EE7B7}
[data-theme="dark"] .verify.v-warn,[data-theme="dark"] .verify.v-conf{color:#FCD34D}

.vbadge{display:inline-flex;align-items:center;gap:4px;font-size:var(--t-xs);font-weight:650;
  padding:2px 8px;border-radius:var(--r-full);border:1px solid;white-space:nowrap}
.vbadge.v-ok{background:var(--ok-50);border-color:var(--ok-200);color:var(--ok-700)}
.vbadge.v-warn,.vbadge.v-conf{background:var(--warn-50);border-color:var(--warn-200);color:var(--warn-700)}
.vbadge.v-none{background:var(--bg-mut);border-color:var(--line);color:var(--tx-3)}
[data-theme="dark"] .vbadge.v-ok{color:#6EE7B7}
[data-theme="dark"] .vbadge.v-warn,[data-theme="dark"] .vbadge.v-conf{color:#FCD34D}

.fx{font-weight:550}
.fx.v-ok{color:var(--tx)}
.fx.v-warn,.fx.v-conf{color:var(--tx);border-bottom:1.5px dotted var(--warn-600);cursor:help}
.fx.v-none{color:var(--tx-3);font-style:italic}

.stamp{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-xs);font-weight:600;
  color:var(--tx-3);background:var(--bg-mut);border:1px solid var(--line);
  padding:3px 10px;border-radius:var(--r-full)}

.sources{background:var(--bg-sub);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--s-5);margin-block:var(--s-6);font-size:var(--t-sm)}
.sources h3{font-size:var(--t-base);margin-bottom:var(--s-2);display:flex;align-items:center;gap:var(--s-2)}
.sources ul{margin-left:var(--s-5);list-style:disc}
.sources li{margin-block:4px;color:var(--tx-2)}
.sources a{color:var(--accent);text-decoration:underline;font-weight:600}

/*───────────────── STAGES ─────────────────*/
.stages{counter-reset:st;display:flex;flex-direction:column;gap:0;margin-block:var(--s-5)}
.stage{counter-increment:st;position:relative;padding:var(--s-4) 0 var(--s-4) var(--s-12);
  font-size:var(--t-base);color:var(--tx-2)}
.stage::before{content:counter(st);position:absolute;left:0;top:var(--s-4);
  width:30px;height:30px;border-radius:var(--r-full);
  background:var(--accent-sub);border:1px solid var(--brand-200);color:var(--accent);
  display:grid;place-items:center;font-weight:700;font-size:var(--t-sm);font-family:var(--f-dsp)}
[data-theme="dark"] .stage::before{border-color:rgba(129,140,248,.3)}
.stage::after{content:"";position:absolute;left:15px;top:calc(var(--s-4) + 34px);bottom:-2px;
  width:1px;background:var(--line)}
.stage:last-child::after{display:none}

/*───────────────── FAQ ─────────────────*/
.faq{display:flex;flex-direction:column;gap:var(--s-2)}
details.q{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;transition:border-color var(--d-2) var(--ez),box-shadow var(--d-2) var(--ez)}
details.q[open]{border-color:var(--brand-200);box-shadow:var(--e-1)}
[data-theme="dark"] details.q[open]{border-color:var(--brand-700)}
details.q>summary{list-style:none;cursor:pointer;padding:var(--s-4) var(--s-5);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);
  font-size:var(--t-md);font-weight:600;font-family:var(--f-dsp);letter-spacing:-.012em;
  color:var(--tx);transition:color var(--d-1),background var(--d-1);min-height:56px}
details.q>summary::-webkit-details-marker{display:none}
details.q>summary:hover{color:var(--accent);background:var(--bg-sub)}
details.q>summary::after{content:"";flex-shrink:0;width:22px;height:22px;border-radius:var(--r-full);
  background:var(--bg-mut);position:relative;transition:all var(--d-2) var(--ez)}
details.q>summary{position:relative}
details.q>summary::before{content:"";position:absolute;right:calc(var(--s-5) + 5px);top:50%;
  width:11px;height:1.8px;background:var(--tx-3);border-radius:2px;transform:translateY(-50%);z-index:1;
  transition:all var(--d-2) var(--ez)}
details.q>summary .plus{position:absolute;right:calc(var(--s-5) + 10px);top:50%;
  width:1.8px;height:11px;background:var(--tx-3);border-radius:2px;transform:translateY(-50%);z-index:1;
  transition:all var(--d-2) var(--ez)}
details.q[open]>summary .plus{transform:translateY(-50%) rotate(90deg);opacity:0}
details.q[open]>summary::after{background:var(--accent-sub)}
details.q[open]>summary::before{background:var(--accent)}
details.q .a{padding:0 var(--s-5) var(--s-5);font-size:var(--t-base);line-height:1.72;color:var(--tx-2)}
details.q .a p+p{margin-top:var(--s-3)}
details.q .a ul{margin:var(--s-2) 0 0 var(--s-5);list-style:disc}
details.q .a li{margin-block:4px}

/*───────────────── PROSE ─────────────────*/
.prose{max-width:70ch}
.prose h2{font-size:var(--t-h2);margin:var(--s-10) 0 var(--s-4);scroll-margin-top:calc(var(--nav-h) + 20px)}
.prose h3{font-size:var(--t-h3);margin:var(--s-8) 0 var(--s-3);color:var(--tx);scroll-margin-top:calc(var(--nav-h) + 20px)}
.prose p{margin-bottom:var(--s-4);font-size:var(--t-md);line-height:1.75;color:var(--tx-2)}
.prose ul,.prose ol{margin:0 0 var(--s-5) var(--s-6)}
.prose ul{list-style:disc}.prose ol{list-style:decimal}
.prose li{margin-block:var(--s-2);font-size:var(--t-md);line-height:1.72;color:var(--tx-2)}
.prose li::marker{color:var(--tx-4)}
.prose strong{color:var(--tx);font-weight:650}
.prose a{color:var(--accent);text-decoration:underline;text-underline-offset:2px;
  text-decoration-thickness:1.5px;text-decoration-color:var(--brand-300);font-weight:550}
.prose a:hover{text-decoration-color:var(--accent)}
.prose blockquote{border-left:3px solid var(--brand-300);padding-left:var(--s-5);
  margin-block:var(--s-5);color:var(--tx-2);font-style:italic}

/*───────────────── PRICING ─────────────────*/
.plan{position:relative;display:flex;flex-direction:column;height:100%}
.plan-feat{border:2px solid var(--brand-500);box-shadow:var(--e-4)}
.plan-tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);
  background:linear-gradient(135deg,var(--brand-500),var(--brand-700));color:#fff;
  font-size:var(--t-xs);font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:4px 14px;border-radius:var(--r-full);box-shadow:var(--e-brand);white-space:nowrap}
.plan-price{display:flex;align-items:baseline;gap:4px;margin-block:var(--s-3) var(--s-1)}
.plan-amt{font-family:var(--f-dsp);font-size:2.5rem;font-weight:800;letter-spacing:-.04em;
  line-height:1;color:var(--tx)}
.plan-per{font-size:var(--t-base);color:var(--tx-3);font-weight:500}
.plan-list{display:flex;flex-direction:column;gap:var(--s-2);margin-block:var(--s-5);flex:1}
.plan-list li{display:flex;gap:var(--s-2);align-items:flex-start;font-size:var(--t-base);color:var(--tx-2)}
.plan-list svg{flex-shrink:0;color:var(--ok-600);margin-top:3px}
[data-theme="dark"] .plan-list svg{color:#34D399}

/*───────────────── FORM ─────────────────*/
.field{margin-bottom:var(--s-5)}
.field label{display:block;font-size:var(--t-sm);font-weight:600;color:var(--tx);margin-bottom:6px}
.field .req{color:var(--err-600)}
.field input,.field select,.field textarea{width:100%;min-height:46px;padding:var(--s-3) var(--s-4);
  background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-md);
  font-size:var(--t-md);color:var(--tx);transition:border-color var(--d-1),box-shadow var(--d-1)}
.field input::placeholder,.field textarea::placeholder{color:var(--tx-4)}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--n-400)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3.5px var(--accent-sub)}
.field textarea{min-height:120px;resize:vertical;line-height:1.65}
.field .hint{font-size:var(--t-xs);color:var(--tx-3);margin-top:5px}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}

/*───────────────── CTA BAND ─────────────────*/
.band{position:relative;overflow:hidden;border-radius:var(--r-2xl);padding:var(--s-12) var(--s-8);
  text-align:center;background:var(--ink-900);color:#fff;box-shadow:var(--e-5)}
.band::before{content:"";position:absolute;inset:0;
  background:radial-gradient(700px 340px at 20% -20%,rgba(99,102,241,.45),transparent 60%),
             radial-gradient(600px 300px at 85% 110%,rgba(20,184,166,.3),transparent 60%)}
.band>*{position:relative;z-index:1}
.band h2{color:#fff;margin-bottom:var(--s-3)}
.band p{color:rgba(255,255,255,.72);max-width:52ch;margin-inline:auto;margin-bottom:var(--s-6)}

/*───────────────── FOOTER ─────────────────*/
.foot{background:var(--bg-sub);border-top:1px solid var(--line);padding-block:var(--s-16) var(--s-6);margin-top:var(--s-20)}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--s-10)}
.foot h3{font-size:var(--t-sm);font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--tx-3);margin-bottom:var(--s-4)}
.foot-links{display:flex;flex-direction:column;gap:var(--s-2)}
.foot-links a{font-size:var(--t-base);color:var(--tx-2);width:fit-content;
  transition:color var(--d-1),transform var(--d-1)}
.foot-links a:hover{color:var(--accent);transform:translateX(2px)}
.foot-brand{display:flex;align-items:center;gap:var(--s-3);margin-bottom:var(--s-4)}
.foot-desc{font-size:var(--t-base);color:var(--tx-2);line-height:1.7;max-width:38ch;margin-bottom:var(--s-5)}
.foot-contact{display:flex;flex-direction:column;gap:var(--s-2);margin-bottom:var(--s-5)}
.foot-contact a,.foot-contact span{display:flex;align-items:center;gap:var(--s-2);
  font-size:var(--t-base);color:var(--tx-2);width:fit-content}
.foot-contact a:hover{color:var(--accent)}
.foot-contact svg{color:var(--tx-4);flex-shrink:0}
.social{display:flex;gap:var(--s-2)}
.social a{width:36px;height:36px;border-radius:var(--r-sm);display:grid;place-items:center;
  background:var(--surface);border:1px solid var(--line);color:var(--tx-3);
  transition:all var(--d-2) var(--ez)}
.social a:hover{transform:translateY(-2px);box-shadow:var(--e-2);color:#fff}
.s-wa:hover{background:#0F7A41;border-color:#0F7A41}
.s-fb:hover{background:#1877F2;border-color:#1877F2}
.s-ig:hover{background:linear-gradient(45deg,#F09433,#DC2743,#BC1888);border-color:#DC2743}
.s-yt:hover{background:#FF0000;border-color:#FF0000}
.s-tg:hover{background:#0088CC;border-color:#0088CC}
.foot-bot{margin-top:var(--s-12);padding-top:var(--s-6);border-top:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--s-4);
  font-size:var(--t-sm);color:var(--tx-3)}
.foot-bot nav{display:flex;gap:var(--s-5);flex-wrap:wrap}
.foot-bot a:hover{color:var(--accent)}

/*───────────────── STICKY CTA / FAB ─────────────────*/
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:850;display:none;gap:var(--s-2);
  padding:var(--s-2) var(--s-4) calc(var(--s-2) + env(safe-area-inset-bottom));
  background:var(--bg);background:color-mix(in srgb,var(--bg) 92%,transparent);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-top:1px solid var(--line);box-shadow:0 -4px 20px rgba(16,24,40,.08)}
.sticky-cta .btn{flex:1;min-height:44px}
.fab{position:fixed;right:var(--s-5);bottom:var(--s-6);z-index:840;width:52px;height:52px;
  border-radius:var(--r-full);background:#0F7A41;color:#fff;display:grid;place-items:center;
  box-shadow:0 8px 24px rgba(15,122,65,.4);transition:transform var(--d-2) var(--ez-spring)}
.fab:hover{transform:scale(1.08);color:#fff}

/*───────────────── SKELETON ─────────────────*/
.skel{position:relative;overflow:hidden;background:var(--bg-mut);border-radius:var(--r-sm)}
.skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);
  animation:shimmer 1.5s infinite}
@keyframes shimmer{100%{transform:translateX(100%)}}
.skel-tx{height:.85em;margin-block:.4em;border-radius:4px}
.skel-tx.w-40{width:40%}.skel-tx.w-60{width:60%}.skel-tx.w-80{width:80%}
.skel-card{height:180px;border-radius:var(--r-lg)}

/*───────────────── EMPTY STATE ─────────────────*/
.empty{text-align:center;padding:var(--s-16) var(--s-5);max-width:420px;margin-inline:auto}
.empty-ic{width:64px;height:64px;margin:0 auto var(--s-5);border-radius:var(--r-lg);
  background:var(--bg-mut);display:grid;place-items:center;color:var(--tx-4)}
.empty h3{font-size:var(--t-h4);margin-bottom:var(--s-2)}
.empty p{color:var(--tx-3);font-size:var(--t-base);margin-bottom:var(--s-5)}

/*───────────────── SEARCH ─────────────────*/
.searchbox{display:flex;gap:var(--s-2);max-width:560px;margin-inline:auto}
.searchbox input{flex:1;min-height:48px;padding:0 var(--s-5);border-radius:var(--r-lg);
  border:1px solid var(--line-2);background:var(--surface);font-size:var(--t-md)}
.searchbox input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-sub)}

/*───────────────── 404 ─────────────────*/
.e404{text-align:center;padding-block:var(--s-24)}
.e404 .code{font-family:var(--f-dsp);font-size:clamp(5rem,16vw,10rem);font-weight:800;
  line-height:1;letter-spacing:-.05em;
  background:linear-gradient(135deg,var(--brand-500),var(--teal-400),var(--gold-400));
  -webkit-background-clip:text;background-clip:text;color:transparent}

/*───────────────── REVEAL ANIMATION ─────────────────*/
@media (prefers-reduced-motion:no-preference){
  .rv{opacity:0;transform:translateY(14px);
    transition:opacity var(--d-4) var(--ez-out),transform var(--d-4) var(--ez-out)}
  .rv.in{opacity:1;transform:none}
}

/*───────────────── RESPONSIVE ─────────────────*/
@media (max-width:1079px){
  .hero-grid{grid-template-columns:1fr;gap:var(--s-10)}
  .foot-grid{grid-template-columns:1fr 1fr;gap:var(--s-8)}
}
@media (max-width:1079px){
  .nav-links{display:none}
  .burger{display:grid}
}
@media (max-width:860px){
  .sec{padding-block:var(--s-12)}
  .hero{padding-top:calc(var(--nav-h) + var(--s-10));padding-bottom:var(--s-12)}
  .sticky-cta{display:flex}
  .fab{display:none}
  body{padding-bottom:68px}
  .foot{padding-bottom:80px;margin-top:var(--s-12)}
  .band{padding:var(--s-10) var(--s-5)}
  .hero .row .btn{width:100%}
}
@media (max-width:980px){ .brand-tx{display:none} }
@media (max-width:560px){
  .wrap{padding-inline:var(--s-4)}
  .foot-grid{grid-template-columns:1fr;gap:var(--s-6)}
  .foot-bot{flex-direction:column;text-align:center}
  .card{padding:var(--s-5)}
  .band{padding:var(--s-8) var(--s-4);border-radius:var(--r-xl)}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media print{
  .nav,.mnav,.sticky-cta,.fab,.crumbs,.band,.foot{display:none!important}
  body{padding:0;background:#fff;color:#000}
  .hero{background:#fff;color:#000;padding-top:var(--s-6)}
  .hero h1,.hero .lead{color:#000}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.8em;color:#555}
}


/*───── nav over dark hero: invert until scrolled ─────*/
body.hero-top .nav:not(.scrolled){background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
body.hero-top .nav:not(.scrolled) .brand-hi{color:#fff}
body.hero-top .nav:not(.scrolled) .brand-en{color:rgba(255,255,255,.6)}
body.hero-top .nav:not(.scrolled) .nav-a{color:rgba(255,255,255,.78)}
body.hero-top .nav:not(.scrolled) .nav-a:hover{color:#fff;background:rgba(255,255,255,.1)}
body.hero-top .nav:not(.scrolled) .nav-a[aria-current="page"]{color:#fff}
body.hero-top .nav:not(.scrolled) .nav-a[aria-current="page"]::after{background:var(--gold-400)}
body.hero-top .nav:not(.scrolled) .icon-btn{color:rgba(255,255,255,.78)}
body.hero-top .nav:not(.scrolled) .icon-btn:hover{color:#fff;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2)}
body.hero-top .nav:not(.scrolled) .burger{color:#fff;border-color:rgba(255,255,255,.24)}

/*───── FAB clears the footer CTA & content ─────*/
.fab{bottom:calc(var(--s-6) + env(safe-area-inset-bottom))}
@media (min-width:861px){ .fab{right:var(--s-6)} }

/*───── hero polish ─────*/
.hero{isolation:isolate}
.hero-grid > aside{align-self:start}
@media (max-width:980px){ .hero-grid > aside{max-width:460px} }


/*───── inline icons inside headings ─────*/
/* icon-in-heading: works everywhere; :has() only upgrades the alignment */
h1>svg,h2>svg,h3>svg,h4>svg{display:inline-block;vertical-align:-.12em;margin-right:.4em;
  color:var(--tx-4);flex-shrink:0}
@supports selector(h2:has(> svg)){
  h1:has(>svg),h2:has(>svg),h3:has(>svg),h4:has(>svg){display:flex;align-items:center;gap:.5em}
  h1:has(>svg)>svg,h2:has(>svg)>svg,h3:has(>svg)>svg,h4:has(>svg)>svg{margin-right:0;vertical-align:baseline}
}
.answer>h2>svg,.sources h3>svg{color:currentColor}
.answer h2>svg,.sources h3>svg{color:currentColor;margin-right:.35em;vertical-align:-.15em}
.sources h3{display:flex;align-items:center;gap:8px}
.sources h3>svg{margin-right:0}


/*───── migrated utility classes ─────*/
.plan-list-i{display:flex;gap:var(--s-2);align-items:flex-start;font-size:var(--t-base);color:var(--tx-2)}
.plan-list-i::before{content:"";flex-shrink:0;width:16px;height:16px;margin-top:3px;
  background:var(--ok-600);border-radius:50%;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat}
[data-theme="dark"] .plan-list-i::before{background:#34D399}
.grid.plan-list{display:flex;flex-direction:column}
.tbl-wrap table:not(.spec):not(.data){font-size:var(--t-base)}
.tbl-wrap th{background:var(--bg-sub);text-align:left;padding:var(--s-3) var(--s-4);
  font-size:var(--t-sm);font-weight:650;color:var(--tx);border-bottom:1px solid var(--line);vertical-align:top}
.tbl-wrap td{padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--line);color:var(--tx-2);vertical-align:top}
.tbl-wrap tbody tr:last-child>*{border-bottom:0}
.card-i.stat:hover{transform:none}


/*───── badge must never stretch in flex/grid parents ─────*/
.badge{align-self:flex-start;width:fit-content;max-width:100%}
.plan>.badge{margin-bottom:var(--s-1)}
.plan{gap:0}
.plan .plan-list{margin-block:var(--s-5)}
.plan-tag{z-index:2}

/* exam cards: keep title on 2 lines max, align rows */
.xcard h3{font-size:var(--t-base);line-height:1.35}
.xcard{min-height:100%}
.xcard-meta{gap:6px}


/*───── mobile nav: hide app-button label, prevent burger overlap ─────*/
@media (max-width:1079px){
  .nav-in{gap:var(--s-2)}
  .nav-r .btn .lbl{display:none}
  .nav-r .btn{padding:0 var(--s-3);min-width:40px}
  .burger{position:relative;z-index:2}
}
@media (max-width:860px){ .nav-in{padding-inline:var(--s-4)} }
@media (max-width:400px){
  .nav-r > .btn{display:none}            /* keep burger + theme reachable on tiny screens */
}

/* hard guard against nav overflow */
.nav,.nav-in{max-width:100vw;box-sizing:border-box}
.brand-mark{flex-shrink:0}


/*───── mobile menu polish ─────*/
.mnav{background:var(--bg);color:var(--tx)}
.mnav a{color:var(--tx-2)}
.mnav a>svg{color:var(--tx-4);opacity:.65;transition:transform var(--d-2) var(--ez-out),opacity var(--d-1)}
.mnav a:hover>svg,.mnav a:focus-visible>svg{opacity:1;transform:translateX(3px);color:var(--accent)}
.mnav a:active{background:var(--accent-sub)}
/* when nav is over the hero, the sheet still needs solid page bg */
body.hero-top .mnav{background:var(--bg)}
/* burger becomes a solid control once open so it reads on any bg */
.burger[aria-expanded="true"]{background:var(--surface);border-color:var(--line);color:var(--tx)}
body.hero-top .nav:not(.scrolled) .burger[aria-expanded="true"]{background:var(--surface);color:var(--tx);border-color:var(--line)}


/*═════ FAIL-SAFE: mobile menu must never render in-flow ═════
  Plain, universally-supported CSS. If any modern feature above fails
  to parse in an older engine, these rules still hold. */
#mnav{position:fixed;top:64px;left:0;right:0;width:100%;max-width:100vw;
  box-sizing:border-box;z-index:890;
  background:#fff;visibility:hidden;opacity:0;overflow-y:auto;overflow-x:hidden}
#mnav a{max-width:100%;box-sizing:border-box}
#mnav.open{visibility:visible;opacity:1}
[data-theme="dark"] #mnav{background:#0C111D}
#nav{position:fixed;top:0;left:0;right:0;z-index:900;background:#fff}
[data-theme="dark"] #nav{background:#0C111D}
/* transparent-over-hero is an enhancement; only apply where backdrop-filter works */
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  body.hero-top #nav:not(.scrolled){background:transparent}
}


/*═════ TAP TARGETS — WCAG 2.5.8 (min 24px, 44px comfortable on touch) ═════*/
@media (pointer:coarse), (max-width:860px){
  .foot-links a,
  .foot-bot nav a,
  .foot-contact a{
    min-height:44px;
    display:flex;
    align-items:center;
    gap:var(--s-2);
  }
  .foot-links{gap:0}
  .foot-bot nav{gap:var(--s-2) var(--s-4);row-gap:0}
  .foot-contact{gap:0}
  /* inline prose links inside centred helper text */
  .center a, p a{padding-block:2px}
  /* social icons already 36px -> lift to 44 on touch */
  .social a{width:44px;height:44px}
  /* breadcrumb links */
  .crumbs a{min-height:32px;display:inline-flex;align-items:center}
}
/* keep the footer visually tight despite taller hit areas */
@media (pointer:coarse), (max-width:860px){
  .foot{padding-block:var(--s-12) var(--s-6)}
  .foot h3{margin-bottom:var(--s-1)}
}


/*── remaining inline links: meet WCAG 2.5.8 (24px) without breaking prose flow ──*/
@media (pointer:coarse), (max-width:860px){
  .prose a:not(.btn), .answer a:not(.btn), .alert a:not(.btn), .sources a:not(.btn),
  .tbl-wrap a:not(.btn), .card a:not(.btn), .verify-d a:not(.btn),
  .muted a:not(.btn), .tiny a:not(.btn), details.q .a a:not(.btn), li a:not(.btn){
    display:inline-block;
    min-height:24px;
    line-height:24px;
    padding-block:1px;
  }
  /* team-card name links get the full comfortable target */
  .card h3 > a{min-height:32px;line-height:1.35;display:inline-block}
}


/*── buttons must never be squashed by a flex parent ──*/
.btn{flex-shrink:0}
.plan > .btn, .card > .btn{margin-top:auto}
.plan{display:flex;flex-direction:column}
.plan .plan-list{flex:1 1 auto;min-height:0}
/* guarantee the declared height survives flex layout */
.btn{min-height:44px;height:auto}
.btn-sm{min-height:36px}
.btn-lg{min-height:52px}


/*── buttons keep their own sizing regardless of context ──*/
a.btn, button.btn{min-height:44px}
a.btn-sm, button.btn-sm{min-height:36px}
a.btn-lg, button.btn-lg{min-height:52px}