/* ════════════════════════════════════════════════════════════════
   hedj — Design Tokens · BRUTALIST EDITORIAL
   Bone paper · ink black · acid-lime accent · Clash Display
   ════════════════════════════════════════════════════════════════ */

/* ── FONTS (self-hosted, licensed-free) ── */
@font-face { font-family:'Satoshi'; src:url('../fonts/Satoshi-400.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Satoshi'; src:url('../fonts/Satoshi-500.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Satoshi'; src:url('../fonts/Satoshi-700.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Satoshi'; src:url('../fonts/Satoshi-900.woff2') format('woff2'); font-weight:900; font-style:normal; font-display:swap; }
@font-face { font-family:'DM Mono'; src:url('../fonts/DMMono-400.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'DM Mono'; src:url('../fonts/DMMono-500.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Clash Display'; src:url('../fonts/ClashDisplay-500.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Clash Display'; src:url('../fonts/ClashDisplay-600.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Clash Display'; src:url('../fonts/ClashDisplay-700.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }

:root {
  /* ── CORE PALETTE — from hedj logo ── */
  --green:#30B078;         /* logo green — MAJOR */
  --green-2:#2BA46E;       /* deeper green (alt sections) */
  --green-3:#23925F;       /* deepest green */
  --orange:#E88830;        /* logo orange — secondary accent */
  --orange-deep:#D2761F;
  --blue:#7898B0;          /* logo slate-blue — minimal */
  --yellow:#F8C000;        /* logo yellow — minimal (dot) */

  --bone:#FBF8F0;          /* PAGE BACKGROUND = bright warm cream */
  --bone-2:#F3EEE1;        /* alt surface — slightly deeper cream */
  --paper:#FEFCF8;         /* lightest cards — warm near-white, lifts on cream */
  --ink:#111111;           /* near-black (text + borders) */
  --ink-2:#26261f;
  --lime:var(--green);     /* PRIMARY ACCENT = logo green */
  --lime-deep:var(--green-3);
  --lime-ink:#06231A;      /* dark text on green */

  --pos:#111111;
  --neg:#C7421F;           /* loss — deep orange-red */

  /* ── TEXT (on bone bg) ── */
  --text:#111111;
  --text-muted:#56544a;
  --text-soft:#8a877a;
  --on-ink:#F2EFE6;        /* cream text on dark ink */
  --on-ink-muted:rgba(242,239,230,0.66);
  --on-ink-soft:rgba(242,239,230,0.42);

  /* ── LINES / DOTS ── */
  --line:rgba(17,17,17,0.16);
  --line-2:rgba(17,17,17,0.28);
  --line-strong:#111111;
  --dot:rgba(17,17,17,0.22);

  /* ── TYPE ── */
  --font-sans:'Satoshi',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-display:'Clash Display','Satoshi',-apple-system,sans-serif;
  --font-logo:'Roboto',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-mono:'DM Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --fs-display:clamp(3rem,7.5vw,6.5rem);
  --fs-h2:clamp(2.1rem,4.5vw,4rem);
  --fs-h3:clamp(1.35rem,1.8vw,1.7rem);
  --fs-lead:clamp(1.05rem,1.35vw,1.3rem);
  --fs-body:1.0625rem;
  --fs-sm:0.9375rem;
  --fs-xs:0.8125rem;
  --eyebrow-ls:0.16em;

  /* ── LAYOUT ── */
  --container:1320px;
  --container-wide:1480px;
  --pad-x:clamp(20px,5vw,72px);
  --section-y:clamp(2.5rem,5vw,4.5rem);
  --header-h:74px;

  /* ── RADIUS (brutalist = sharp) ── */
  --r-pill:0px;
  --r-lg:6px;
  --r-md:5px;
  --r-sm:3px;

  /* ── SHADOW (used sparingly) ── */
  --sh-card:6px 6px 0 var(--ink);   /* hard offset shadow */
  --sh-md:0 18px 50px -28px rgba(17,17,17,.3);
  --sh-lg:0 30px 70px -30px rgba(17,17,17,.4);

  /* ── MOTION ── */
  --ease:cubic-bezier(0.22,0.61,0.36,1);
  --ease-out:cubic-bezier(0.16,1,0.3,1);
  --ease-vt:cubic-bezier(.075,.82,.165,1);
  --dur:0.6s;
}

/* ── DARK INVERSION (toggle) — deep green-black ── */
[data-theme="dark"] {
  --bone:#0d1119;
  --bone-2:#0c101d;
  --paper:#020d18;;
  --ink:#f5f5e8;
  --text:#edf2e0;
  --text-muted:#8FB7A1;
  --text-soft:#5E8772;
  --on-ink:#08160F;
  --on-ink-muted:rgba(8,22,15,0.66);
  --on-ink-soft:rgba(8,22,15,0.42);
  --line:rgba(48,176,120,0.26);
  --line-2:rgba(48,176,120,0.4);
  --line-strong:#30B078;
  --dot:rgba(48,176,120,0.22);
  --sh-card:6px 6px 0 var(--green);
}