/* ==========================================================================
   KINETO — Design tokens
   Single source of truth for color, type, spacing, radius and motion.
   ========================================================================== */

:root {
  /* Surfaces */
  --bg: #080806;
  --bg-elevated: #0d0d0b;
  --bg-soft: #12120f;
  --bg-panel: #10100f;

  --paper: #f1eee6;
  --paper-soft: #e9e5db;
  --paper-bright: #f7f4ed;

  /* Text on dark */
  --text-light: #f3f0e8;
  --text-light-muted: rgba(243, 240, 232, .62);
  --text-light-subtle: rgba(243, 240, 232, .38);

  /* Text on paper */
  --text-dark: #151512;
  --text-dark-muted: rgba(21, 21, 18, .62);
  --text-dark-subtle: rgba(21, 21, 18, .38);

  /* Hairlines */
  --line-dark: rgba(255, 255, 255, .10);
  --line-dark-soft: rgba(255, 255, 255, .06);
  --line-light: rgba(18, 18, 16, .13);
  --line-light-soft: rgba(18, 18, 16, .07);

  /* Signature accent — acid green. Accent only, never a surface. */
  --accent: #7dff00;
  --accent-soft: rgba(125, 255, 0, .18);
  --accent-glow: rgba(125, 255, 0, .10);

  /* Radius */
  --radius-control: 8px;
  --radius-button: 4px;
  --radius-panel: 14px;
  --radius-section: 18px;
  --radius-image: 6px;

  /* Layout */
  --shell: 1520px;
  --gutter: clamp(20px, 3.2vw, 56px);
  --grid-gap: clamp(24px, 2vw, 32px);
  --header-h: 88px;
  --header-h-stuck: 74px;

  /* Vertical rhythm */
  --section-y: clamp(72px, 9vw, 160px);
  --section-y-tight: clamp(64px, 6.5vw, 96px);

  /* Typography */
  --font-serif: "Instrument Serif", "Iowan Old Style", "Times New Roman", Georgia, serif;
  --font-sans: "Manrope", "Inter", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;

  --fs-hero: clamp(4.4rem, 6vw, 6.5rem);
  --fs-statement: clamp(3.2rem, 5vw, 5.8rem);
  --fs-heading: clamp(2.5rem, 4vw, 4.6rem);
  --fs-project: clamp(2rem, 3vw, 3.5rem);
  --fs-body-lg: clamp(1.125rem, 1.1vw, 1.25rem);
  --fs-body: 1rem;
  --fs-label: .72rem;
  --fs-nav: .74rem;

  --tracking-label: .2em;
  --tracking-nav: .12em;
  --tracking-display: -.025em;

  /* Motion — one small easing set, engineered not playful */
  --ease-reveal: cubic-bezier(.16, 1, .3, 1);
  --ease-editorial: cubic-bezier(.215, .61, .355, 1);
  --ease-fast: cubic-bezier(.2, .8, .2, 1);

  --dur-fast: 220ms;
  --dur-hover: 280ms;
  --dur-row: 400ms;
  --dur-rise: 780ms;
  --dur-line: 900ms;
  --dur-mask: 1000ms;

  --stagger-line: 95ms;
}