/* ============================================================
   AthDash — shared theme
   Canonical tokens + base components, extracted verbatim from the
   landing page so every page in the site shares one source of truth.
   ============================================================ */
:root{
  /* surfaces — anodized carbon */
  --bg:#0A0C10; --surface:#13161B; --surface-2:#1A1E25;
  --line:#262B33; --line-dim:#1C2027; --line-bright:#333A42;
  /* ink */
  --ink:#F1F4F8; --ink-2:#A4AEBA; --ink-3:#8E98A5;
  /* the one scarce signal + semantic-only states */
  --accent:#5FE3A1; --accent-deep:#1E5C42;
  --exploratory:#E0A33E; --insufficient:#7E8794;
  --sheen:#3A4250;
  /* type */
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Hanken Grotesk",ui-sans-serif,system-ui,-apple-system,sans-serif;
  --mono:"Geist Mono",ui-monospace,"JetBrains Mono","SF Mono",Menlo,monospace;
  /* shape — machined */
  --r:6px; --r-sm:3px;
  /* layout */
  --maxw:1140px; --gutter:clamp(24px,7vw,110px);
  --ease:cubic-bezier(0.2,0.6,0.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
html,body{margin:0}
body{
  background:var(--bg); color:var(--ink-2);
  font-family:var(--sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
::selection{background:rgba(95,227,161,.22);color:var(--ink)}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--accent);color:#06140d;font-family:var(--mono);font-size:13px;padding:10px 16px;border-radius:var(--r-sm)}
.skip:focus{left:8px;top:8px}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.tnum{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
a{color:inherit;text-decoration:none}
em{font-style:italic;font-family:var(--serif);color:var(--accent);font-weight:400}

/* ── graph-paper margins ── */
.grid-rails{position:fixed;inset:0;z-index:0;pointer-events:none;display:flex;justify-content:center}
.grid-rails .inner{
  width:min(var(--maxw), calc(100% - 2*var(--gutter)));
  height:100%;
  border-left:1px solid var(--line-dim);
  border-right:1px solid var(--line-dim);
}

/* ── layout ── */
.wrap{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter)}
section{position:relative;z-index:1}
.sectpad{padding-block:clamp(84px,13vh,168px)}

/* section index divider */
.sx{display:flex;align-items:center;gap:18px;margin-bottom:clamp(34px,5vh,64px)}
.sx .sx-lab{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);white-space:nowrap}
.sx .sx-lab b{color:var(--ink-2);font-weight:500}
.sx .sx-line{height:1px;background:var(--line);flex:1;transform:scaleX(0);transform-origin:left;
  transition:transform .6s var(--ease)}
.reveal.in .sx-line,.sx-line.in{transform:scaleX(1)}

/* eyebrow */
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3);margin:0 0 18px}
.eyebrow .dotsq{display:inline-block;width:7px;height:7px;border-radius:1px;background:var(--accent);margin-right:9px;vertical-align:baseline;
  box-shadow:0 0 0 3px rgba(30,92,66,.45)}

/* headings */
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--ink);letter-spacing:-.02em;margin:0;text-wrap:balance}
h1{font-size:clamp(40px,6vw,76px);line-height:1.04}
h2{font-size:clamp(30px,3.6vw,46px);line-height:1.1}
h3{font-size:20px;letter-spacing:-.01em;line-height:1.25}
.lead{font-size:clamp(18px,1.5vw,20px);line-height:1.62;color:var(--ink-2);max-width:62ch;margin:22px 0 0}
.lead.tight{margin-top:18px}
p{margin:0}

/* calibration ticks scale */
.ticks{height:8px;background-image:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 30px);background-position:left bottom;background-repeat:repeat-x;opacity:.9}
.ticks.bright{background-image:repeating-linear-gradient(90deg,var(--line-bright) 0 1px,transparent 1px 30px)}

/* ── buttons ── */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-weight:500;font-size:14.5px;
  padding:12px 20px;border-radius:var(--r);border:1px solid var(--line-bright);background:transparent;color:var(--ink);
  cursor:pointer;transition:border-color .2s var(--ease),color .2s var(--ease),background .2s var(--ease)}
.btn:hover{border-color:var(--accent);color:var(--ink)}
.btn.primary{background:var(--accent);color:#06140d;border-color:var(--accent);font-weight:600;
  box-shadow:inset 0 -2px 0 rgba(30,92,66,.55)}
.btn.primary:hover{background:#6ee9aa;color:#06140d;border-color:#6ee9aa}
.btn .arr{font-family:var(--mono);font-size:13px;transition:transform .2s var(--ease)}
.btn:hover .arr{transform:translateX(3px)}

/* ── nav ── */
.nav{position:fixed;top:0;left:0;right:0;z-index:40;height:60px;
  background:rgba(10,12,16,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
.nav .wrap{height:100%;display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--sans);font-weight:600;font-size:16px;color:var(--ink);letter-spacing:-.01em;min-width:0}
.brand .dotsq{width:8px;height:8px;border-radius:2px;background:var(--accent);box-shadow:0 0 0 3px rgba(30,92,66,.5)}
.brand-mark{width:32px;height:32px;display:block;object-fit:contain;flex:0 0 32px;border:1px solid var(--line-bright);border-radius:8px;background:#05070a;box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 0 0 3px rgba(95,227,161,.07)}
.brand:hover .brand-mark{border-color:rgba(95,227,161,.75);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 0 4px rgba(95,227,161,.12)}
.nav .links{display:none;gap:26px;margin-left:14px}
@media(min-width:900px){.nav .links{display:flex}}
.nav .links a{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink-3);transition:color .2s var(--ease)}
.nav .links a:hover{color:var(--ink)}
.nav .links a.cur{color:var(--ink)}
.nav .right{margin-left:auto;display:flex;align-items:center;gap:18px}
.nav .status{display:none;font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--ink-3)}
@media(min-width:1060px){.nav .status{display:inline-flex;align-items:center;gap:8px}}
.nav .status .lv{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(30,92,66,.4)}
@media(max-width:430px){.brand-name{display:none}.nav .btn{padding-inline:12px;font-size:13px}}

/* ── milled card ── */
.card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:inset 0 1px 0 rgba(58,66,80,.35);
  transition:border-color .25s var(--ease),box-shadow .25s var(--ease)}
.card:hover{border-color:var(--line-bright);box-shadow:inset 0 1px 0 rgba(58,66,80,.7)}
.card .corner-tick{position:absolute;top:0;right:0;width:0;height:0;border-top:8px solid transparent;border-right:8px solid transparent;opacity:0;transition:opacity .25s var(--ease)}
.card:hover .corner-tick{opacity:1;border-right-color:var(--accent);border-top-color:var(--accent)}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);display:inline-flex;align-items:center;gap:8px}
.kicker::before{content:"";width:6px;height:6px;border-radius:1px;background:var(--line-bright)}

/* ── footer ── */
footer{padding-block:46px 60px;position:relative;z-index:1}
.foot-top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid var(--line)}
.foot-links{display:flex;gap:24px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink-3)}
.foot-links a:hover{color:var(--ink)}
.disclaimer{margin-top:22px;font-family:var(--mono);font-size:11px;line-height:1.7;color:var(--ink-3);max-width:78ch;letter-spacing:.01em}
.copyline{margin-top:18px;font-family:var(--mono);font-size:11px;color:var(--ink-3);letter-spacing:.04em}

/* ── reveal animation ── */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.06s}.reveal.d2{transition-delay:.12s}.reveal.d3{transition-delay:.18s}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .reveal{opacity:1;transform:none}
  .sx-line{transform:scaleX(1)}
}
