/* ============================================================================
   AIVE ONE — Base layer (reset · typography · utilities)
   Depends on tokens.css.
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--bg); color:var(--text);
  font-family:var(--font-sans); font-size:var(--fs-base); line-height:var(--lh-normal);
  font-weight:var(--fw-regular); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,svg,video,canvas{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent-soft);color:var(--text)}

/* Headings */
h1,h2,h3,h4,h5{font-family:var(--font-display);font-weight:var(--fw-semibold);letter-spacing:var(--tracking-tight);line-height:var(--lh-tight);color:var(--text)}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3);letter-spacing:var(--tracking-snug)} h4{font-size:var(--fs-h4);letter-spacing:var(--tracking-snug)}
p{color:var(--text-2);text-wrap:pretty}

/* Focus — visible only, never on mouse */
:focus{outline:none}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:var(--radius-xs)}

/* Scrollbars */
*{scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:99px;border:3px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-track{background:transparent}

/* ── Brand helpers ──────────────────────────────────────────────────────── */
.prism-text{background:var(--p-prism);-webkit-background-clip:text;background-clip:text;color:transparent}
.wordmark{font-family:var(--font-display);font-weight:var(--fw-bold);letter-spacing:var(--tracking-snug);
  display:inline-flex;align-items:baseline;gap:.34em;line-height:1}
.kicker{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-3)}
.mono{font-family:var(--font-mono)}

/* ── Layout utilities ───────────────────────────────────────────────────── */
.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--space-6)}
.container-wide{max-width:var(--container-wide);margin-inline:auto;padding-inline:var(--space-6)}
.container-narrow{max-width:var(--container-narrow);margin-inline:auto;padding-inline:var(--space-6)}
.stack{display:flex;flex-direction:column;gap:var(--space-4)}
.cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3)}
.row{display:flex;align-items:center;gap:var(--space-3)}
.spread{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.grid{display:grid;gap:var(--space-4)}
.center{display:flex;align-items:center;justify-content:center}
.hidden{display:none!important}
.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}
/* shared text/layout utilities (available on EVERY surface) */
.spread-h{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.muted{color:var(--text-2)}
.dim{color:var(--text-3)}
.section-title{font-family:var(--font-mono);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:var(--tracking-wide);color:var(--text-3);margin:var(--space-10) 0 var(--space-4)}