/* =====================================================================
   ACCEDE DESIGN TOKENS v0.1 · interim-industrial-minimal skin
   ---------------------------------------------------------------------
   Derived from client reference territories (industrial reliability x
   futurist minimalism). VALUES ARE PLACEHOLDERS pending designer
   origination; KEYS ARE THE CONTRACT. Revalue, never rename.
   Rules of this system:
   1. signal (#E87722) is the single accent · budget ONE per view.
   2. No rounded corners. No shadows. Hairlines separate.
   3. Display type is LIGHT (300), tight, calm. Never bold-shouty.
   4. carbon dark bands are allowed (footer, hero overlay) · text on
      carbon is canvas, hairlines use line-dark.
   5. Mostly air. Section padding is generous, content narrow.
   ===================================================================== */
:root{
  --canvas:#FAFAF7; --surface:#FFFFFF; --mist:#EFEEEA; --carbon:#141414;
  --ink:#131312; --ink-2:#4A4A46; --grey:#8A8A84;
  --line:#E2E1DC; --line-dark:rgba(250,250,247,.18);
  --signal:#E87722; --signal-deep:#C55F12;
  --ok:#3E7C4F; --warn:#B3541E; --err:#A32C21;

  --sans:Inter,-apple-system,"Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;

  --ease:cubic-bezier(.2,.6,.2,1);
  --fast:160ms; --base:240ms; --slow:420ms;

  --section-y:clamp(72px,10vw,140px);
  --page-pad:clamp(20px,4vw,64px);
  --maxw:1440px; --contentw:1180px; --prosew:680px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth}
body{background:var(--canvas);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6}
::selection{background:var(--signal);color:#fff}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

/* ---- type primitives ---- */
.t-hero{font-weight:300;font-size:clamp(44px,7vw,92px);line-height:1.02;letter-spacing:-.02em}
.t-h1{font-weight:300;font-size:clamp(34px,4.5vw,56px);line-height:1.06;letter-spacing:-.015em}
.t-h2{font-weight:400;font-size:clamp(26px,3vw,36px);line-height:1.15;letter-spacing:-.01em}
.t-h3{font-weight:500;font-size:20px;line-height:1.3}
.t-body{font-size:16px;line-height:1.6;color:var(--ink-2)}
.t-small{font-size:14px;line-height:1.55;color:var(--ink-2)}
.t-label{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.t-data{font-family:var(--mono);font-size:13px}

/* ---- layout primitives ---- */
.container{max-width:var(--contentw);margin:0 auto;padding:0 var(--page-pad)}
.container-wide{max-width:var(--maxw);margin:0 auto;padding:0 var(--page-pad)}
.prose{max-width:var(--prosew)}
.section{padding:var(--section-y) 0}
.section-mist{background:var(--mist)}
.section-carbon{background:var(--carbon);color:var(--canvas)}
.section-carbon .t-body,.section-carbon .t-small{color:rgba(250,250,247,.72)}
.section-carbon .t-label{color:rgba(250,250,247,.5)}
.hairline{border-top:1px solid var(--line)}
.section-carbon .hairline{border-top-color:var(--line-dark)}

/* ---- motion ---- */
.reveal{opacity:0;transform:translateY(14px);transition:opacity var(--slow) var(--ease),transform var(--slow) var(--ease)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}