/* ============================================================
   Hedonic Intelligence — design tokens + reset + base
   Cream / ink / gold. Source Serif 4 · Inter · JetBrains Mono.
   Ground-up rebuild 2026-05-29.
   ============================================================ */

:root {
  --paper:   #F5F2EC;
  --paper-2: #EFEBE3;
  --paper-3: #E7E2D6;
  --ink:     #171614;
  --ink-2:   #2B2925;
  --ink-3:   #4A463F;
  --ink-4:   #76716A;
  --ink-5:   #A39E94;
  --accent:     #A8842B;
  --accent-ink: #6E561B;
  --accent-soft:#A8842B14;
  --accent-line:#A8842B33;
  --rule:   #1716141A;
  --rule-2: #17161426;
  --rule-3: #17161440;
  --up:   #2F5D4F;  --signal-up:   #2F5D4F;
  --down: #7A1F2B;  --signal-down: #7A1F2B;

  /* on dark-ink sections */
  --ink-paper:   #F5F2EC;
  --ink-paper-2: #C9C3B6;
  --ink-paper-3: #8E887C;
  --ink-rule:    #F5F2EC1A;
  --accent-on-ink:#CBA34A;

  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --mono:  "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;

  --wrap: 1300px;
  --gut: clamp(20px, 5vw, 96px);

  --r: 6px;
  --r-lg: 12px;

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --t: 200ms var(--ease);

  --fs-eyebrow: 12.5px;
  --fs-display: clamp(44px, 7.4vw, 118px);
  --fs-h1:      clamp(32px, 4.6vw, 64px);
  --fs-h2:      clamp(25px, 3.1vw, 42px);
  --fs-lede:    clamp(18px, 1.7vw, 25px);
  --fs-body:    clamp(16px, 1.1vw, 18px);

  /* spacing scale + secondary accents + durations — used by the cohort-117 page's bespoke blocks */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;
  --accent-2:#3A5A88; --accent-2-ink:#28456E; --accent-2-soft:#3A5A881A;
  --accent-3:#2E6F60; --accent-3-ink:#1B4F45; --accent-3-soft:#2E6F601A;
  --d-fast:140ms; --d-med:280ms;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 88px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: var(--fs-body);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "kern", "liga";
  overflow-x: hidden;
}

h1, h2, h3, h4 { font-weight: 500; line-height: 1.06; letter-spacing: -0.02em; }
em { font-style: italic; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
button { font: inherit; color: inherit; cursor: pointer; background: none; border: none; }
ul { list-style: none; }
code { font-family: var(--mono); font-size: 0.92em; }

::selection { background: var(--accent); color: var(--paper); }

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gut); }

.skip {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--ink); color: var(--paper); padding: 12px 18px; font-size: 14px;
}
.skip:focus { left: 12px; top: 12px; }

.serif { font-family: var(--serif); }
.mono { font-family: var(--mono); }
.eyebrow {
  font-family: var(--sans); font-size: var(--fs-eyebrow); font-weight: 600;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--accent-ink);
}
.eyebrow .num { font-family: var(--mono); letter-spacing: 0.02em; }
.accent { color: var(--accent-ink); }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 2px; }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity 720ms var(--ease), transform 720ms var(--ease); }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; transition: none; }
}