/* Homepage styles. Layout: full-width navy hero with the 50-state tile map, then light bands, then a navy closing band with the 50-star field. */
:root{
  --night:#0D1733; --night-2:#16234A; --night-line:#2A3A6B; --on-night:#F2F4FA; --on-night-muted:#A9B3D1; --hot:#FF8A8E;
  --tile:#1E2C5A; --tile-hub:#2B3E7E;
  --tag-myth-bg:#FBE8E9; --tag-myth:#A81F25; --tag-real-bg:#E3F2EA; --tag-real:#1D774A;
  --watch-bg:#FCEFD9; --watch:#8A5A00;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --tag-myth-bg:#3B1A22; --tag-myth:#FF8A8E; --tag-real-bg:#14301F; --tag-real:#5FC28F; --watch-bg:#3A2C12; --watch:#E4B252}}
:root[data-theme="dark"]{
  --tag-myth-bg:#3B1A22; --tag-myth:#FF8A8E; --tag-real-bg:#14301F; --tag-real:#5FC28F; --watch-bg:#3A2C12; --watch:#E4B252}

.home{display:block;gap:0}
.home h1,.home h2,.home h3{font-family:var(--f-display);margin:0;text-wrap:balance}
.h-wrap{max-width:1160px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.h-eyebrow{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--crimson)}
.h-night .h-eyebrow{color:var(--on-night-muted)}
.h-night .h-eyebrow.h-eyebrow-hot{color:var(--hot)}
.h-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;padding:14px 22px;font-weight:600;font-size:1.02rem;text-decoration:none;border:1px solid transparent;cursor:pointer;font-family:var(--f-body);transition:transform .15s ease,background .15s ease}
.h-btn:hover{transform:translateY(-1px)}
.h-btn.h-sm{padding:10px 16px;font-size:.95rem}
.h-red{background:var(--crimson);color:#fff}
.h-red:hover{background:#A81F25}
.h-ghost{border-color:var(--night-line);color:var(--on-night);background:transparent}
.h-ghost:hover{background:var(--night-2)}
.h-line{border-color:var(--line);color:var(--ink);background:var(--surface)}
.h-row{display:flex;gap:10px;flex-wrap:wrap}
.h-small{font-size:.88rem;color:var(--muted)}

/* hero */
.h-night{background:var(--night);color:var(--on-night)}
.h-hero{padding-block:60px 72px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center}
@media (max-width:900px){.h-hero{grid-template-columns:1fr;padding-block:40px 56px;gap:36px}}
.h-hero h1{font-size:clamp(2.6rem,6.4vw,4.9rem);font-weight:700;letter-spacing:-.025em;line-height:1.02;margin-top:16px;color:var(--on-night)}
.h-hero h1 em{font-style:normal;color:#E5484D;white-space:nowrap}
.h-lead{color:var(--on-night-muted);font-size:1.18rem;max-width:52ch;margin-top:20px}
.h-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.h-fine{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:24px;color:var(--on-night-muted);font-size:.92rem}
.h-fine span::before{content:"✓";color:#7FD3A6;margin-right:7px;font-weight:700}

.h-mapcard{background:var(--night-2);border:1px solid var(--night-line);border-radius:22px;padding:22px 22px 18px;display:grid;gap:16px;min-width:0}
.h-maphead{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.h-count{font-family:var(--f-mono);font-size:.82rem;color:var(--on-night-muted)}
.h-tiles{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:5px}
.h-tile{aspect-ratio:1;border-radius:7px;border:0;background:var(--tile);color:#7F8DB8;font-family:var(--f-mono);font-size:clamp(.5rem,1.15vw,.72rem);font-weight:500;cursor:pointer;display:grid;place-items:center;padding:0;transition:background .3s ease,color .3s ease,transform .2s ease;min-width:0}
.h-tile:hover{background:#2C3D75;color:var(--on-night)}
.h-tile.hub{background:var(--tile-hub);color:#C9D3F5}
.h-tile.on{background:var(--crimson);color:#fff;transform:scale(1.12);box-shadow:0 0 0 3px rgba(214,47,53,.25)}
.h-spacer{aspect-ratio:1}
.h-mapinfo{border-top:1px solid var(--night-line);padding-top:14px;min-height:78px;display:grid;gap:4px}
.h-mapinfo strong{font-family:var(--f-display);font-size:1.35rem;font-weight:700}
.h-mapinfo span{color:var(--on-night-muted);font-size:.95rem}
.h-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:.8rem;color:var(--on-night-muted)}
.h-legend i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.sw-hub{background:var(--tile-hub)}
.sw-on{background:var(--crimson)}

/* bands */
.h-band{padding-block:80px}
.h-band-tight{padding-top:8px}
@media (max-width:700px){.h-band{padding-block:52px}.h-band-tight{padding-top:4px}}
.h-sechead{display:grid;gap:12px;max-width:780px;margin-bottom:36px}
.h-sechead h2{font-size:clamp(2rem,4.4vw,3rem);font-weight:700;letter-spacing:-.02em;line-height:1.05}
.h-sechead p{color:var(--muted);font-size:1.12rem;max-width:62ch}
.h-big{font-family:var(--f-display);font-weight:700;font-size:clamp(3rem,6.5vw,4.6rem);letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.h-redtext{color:var(--crimson)}
.h-src{font-family:var(--f-mono);font-size:.74rem;color:var(--muted)}

.h-truth,.h-after{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:2px solid var(--ink)}
@media (max-width:800px){.h-truth,.h-after{grid-template-columns:1fr}}
.h-truth article,.h-after article{padding:26px 26px 26px 0;display:grid;gap:10px;align-content:start;border-bottom:1px solid var(--line);min-width:0}
@media (min-width:801px){.h-truth article+article,.h-after article+article{padding-left:26px;border-left:1px solid var(--line)}}
.h-truth h3,.h-after h3{font-size:1.12rem;font-weight:700;line-height:1.25}
.h-truth p,.h-after p{color:var(--muted);font-size:.98rem}

/* myths */
.h-myths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:900px){.h-myths{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.h-myths{grid-template-columns:1fr}}
.h-myths article{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;display:grid;gap:10px;align-content:start}
.h-myths h3{font-size:1.1rem;font-weight:700;line-height:1.25;color:var(--muted);text-decoration:line-through;text-decoration-color:var(--crimson);text-decoration-thickness:2px}
.h-myths p{font-size:.97rem}
.h-tag{justify-self:start;font-family:var(--f-mono);font-size:.72rem;padding:3px 9px;border-radius:999px;letter-spacing:.04em}
.h-tag-myth{background:var(--tag-myth-bg);color:var(--tag-myth)}
.h-tag-real{background:var(--tag-real-bg);color:var(--tag-real)}

/* interview */
.h-interview{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px;align-items:start}
@media (max-width:900px){.h-interview{grid-template-columns:1fr}}
.h-promise{display:grid;gap:4px}
.h-pitem{display:grid;grid-template-columns:52px 1fr;gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
.h-pitem:first-child{border-top:2px solid var(--ink)}
.h-pn{font-family:var(--f-mono);color:var(--crimson);font-size:.95rem;padding-top:3px}
.h-pitem h3{font-size:1.12rem;font-weight:700}
.h-pitem p{color:var(--muted);font-size:.97rem}
.h-practice{background:var(--night);color:var(--on-night);border-radius:20px;padding:24px;display:grid;gap:16px}
.h-practice .h-eyebrow{color:var(--hot)}
.h-q{font-size:1.45rem;font-weight:700;line-height:1.2;color:var(--on-night);min-height:2.4em}
.h-timer{font-family:var(--f-mono);font-size:2.6rem;font-variant-numeric:tabular-nums;color:var(--on-night)}
.h-timer.done{color:var(--hot)}
.h-practice .h-line{background:transparent;color:var(--on-night);border-color:var(--night-line)}
.h-check{display:grid;gap:8px;border-top:1px solid var(--night-line);padding-top:14px}
.h-checkhead{color:var(--on-night-muted);font-size:.92rem}
.h-check label{display:flex;gap:10px;align-items:flex-start;font-size:.97rem;cursor:pointer}
.h-check input{margin-top:5px;accent-color:#E5484D}
.h-level{font-weight:600;color:#7FD3A6;font-size:.97rem}

/* money */
.h-money{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;counter-reset:none}
@media (max-width:900px){.h-money{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.h-money{grid-template-columns:1fr}}
.h-money li{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:6px;align-content:start}
.h-money li.h-free{background:var(--night);border-color:var(--night);color:var(--on-night)}
.h-money li.h-free p{color:var(--on-night-muted)}
.h-money li.h-free strong{color:#7FD3A6}
.h-mstep{font-family:var(--f-mono);font-size:.78rem;color:var(--crimson)}
.h-money li.h-free .h-mstep{color:var(--hot)}
.h-money h3{font-size:1.08rem;font-weight:700}
.h-money p{color:var(--muted);font-size:.93rem}
.h-money strong{font-family:var(--f-display);font-size:1.35rem;font-weight:700;margin-top:6px;font-variant-numeric:tabular-nums}

/* after graduation */
.h-scholar{margin-top:28px;background:var(--tag-real-bg);border-radius:18px;padding:24px 26px}
.h-scholar .h-eyebrow{color:var(--tag-real)}
.h-scholar h3{font-size:1.35rem;font-weight:700;margin-top:6px}
.h-scholar p{margin-top:8px;max-width:72ch}
.h-honest{margin-top:16px;color:var(--muted);font-size:.92rem}

/* compare */
.h-compare{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--surface)}
.h-crow{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr);border-top:1px solid var(--line)}
.h-crow:first-child{border-top:0}
.h-crow>div{padding:15px 20px;min-width:0}
.h-chead>div{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--paper)}
.h-chead>div.h-us{color:#fff;background:var(--night)}
.h-crow>div:first-child{font-weight:600}
.h-crow>div.h-us{background:color-mix(in srgb,var(--blue-soft) 60%,transparent);font-weight:600}
.h-yes::before{content:"✓ ";color:var(--tag-real);font-weight:700}
.h-no::before{content:"✕ ";color:var(--crimson);font-weight:700}
@media (max-width:640px){.h-crow{grid-template-columns:1fr 1fr}.h-crow>div:first-child{grid-column:1/-1;padding-bottom:2px}.h-chead>div:first-child{display:none}}

/* journey */
.h-journey{display:flex;gap:14px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x mandatory}
.h-jstep{flex:0 0 220px;scroll-snap-align:start;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:8px;align-content:start}
.h-jstep .n{font-family:var(--f-mono);font-size:.8rem;color:var(--crimson)}
.h-jstep h3{font-size:1.06rem;font-weight:700;line-height:1.2}
.h-jstep p{color:var(--muted);font-size:.92rem}
.h-jstep.phase{background:var(--night);border-color:var(--night);color:var(--on-night)}
.h-jstep.phase p{color:var(--on-night-muted)}
.h-jstep.phase .n{color:var(--hot)}
.h-hint{font-size:.88rem;color:var(--muted);margin-top:10px}

/* readiness */
.h-readygrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}
@media (max-width:860px){.h-readygrid{grid-template-columns:1fr}}
.h-qcard{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:26px;display:grid;gap:18px}
.h-qprog{display:flex;gap:6px}
.h-qprog i{flex:1;height:5px;border-radius:3px;background:var(--line)}
.h-qprog i.done{background:var(--crimson)}
.h-qcard h3{font-size:1.35rem;font-weight:700}
.h-opts{display:grid;gap:10px}
.h-opt{text-align:left;padding:14px 16px;border-radius:12px;border:1px solid var(--line);background:var(--paper);font:inherit;color:var(--ink);cursor:pointer;font-weight:600}
.h-opt:hover{border-color:var(--blue)}
.h-score{font-family:var(--f-display);font-weight:700;font-size:3.2rem;line-height:1}
.h-result{display:grid;gap:14px}
.h-result ul{margin:0;padding-left:20px;display:grid;gap:6px}
.h-side{display:grid;gap:14px;padding-top:6px}
.h-side h3{font-size:1.15rem;font-weight:700}
.h-side p{color:var(--muted)}

/* news */
.h-news{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:18px}
@media (max-width:860px){.h-news{grid-template-columns:1fr}}
.h-ncard{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;display:grid;gap:10px;align-content:start}
.h-ncard time{font-family:var(--f-mono);font-size:.8rem;color:var(--muted)}
.h-ncard h3{font-size:1.1rem;font-weight:700;line-height:1.25}
.h-ncard p{color:var(--muted);font-size:.95rem}
.h-ncard .h-tag.warn{background:var(--watch-bg);color:var(--watch)}
.h-ncard .h-tag.info{background:var(--blue-soft);color:var(--blue)}
.h-ncard .h-tag.ok{background:var(--tag-real-bg);color:var(--tag-real)}

/* final */
.h-final{padding-block:80px}
.h-finalgrid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px;align-items:center}
@media (max-width:860px){.h-finalgrid{grid-template-columns:1fr}}
.h-final h2{font-size:clamp(2.4rem,5.6vw,4rem);font-weight:700;letter-spacing:-.02em;line-height:1.02;margin-top:12px;color:var(--on-night)}
.h-final p{color:var(--on-night-muted);font-size:1.12rem;margin-top:14px;max-width:52ch}
.h-promises{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:10px}
.h-promises li{display:flex;gap:12px;align-items:flex-start}
.h-promises li::before{content:"";flex:none;width:10px;height:10px;margin-top:8px;background:var(--crimson);clip-path:polygon(0 0,100% 50%,0 100%)}
.h-stars{background:var(--night-2);border:1px solid var(--night-line);border-radius:22px;padding:22px;display:grid;gap:8px;max-width:440px;width:100%;justify-self:center}
.h-srow{display:flex;justify-content:space-between}
.h-srow.short{padding-inline:calc((100% / 6) / 2)}
.h-star{width:clamp(18px,4.4vw,34px);aspect-ratio:1;background:#C9D3F5;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);opacity:.85}
.h-star.you{background:#E5484D;opacity:1;animation:h-pulse 2.4s ease-in-out infinite}
.h-starcap{font-family:var(--f-mono);font-size:.78rem;color:var(--on-night-muted);text-align:center;margin-top:6px}
@keyframes h-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}
@media (prefers-reduced-motion:reduce){.h-star.you{animation:none}.h-btn,.h-tile{transition:none}}
