/* ─── Design tokens ──────────────────────────────────────────
   Single source of truth for color, type, space, motion.
   Anything hard-coded outside this file is a bug.
   ──────────────────────────────────────────────────────── */

:root {
  /* ── Color ── */
  --ivory:        #F7F4EF;   /* base background */
  --ivory-deep:   #EFEAE2;   /* alt section background */
  --paper:        #FBF9F4;   /* cards / surfaces */
  --ink:          #13110F;   /* primary text */
  --ink-soft:     #3A332C;   /* body */
  --ink-mute:     #6B6058;   /* captions, meta */
  --rule:         #C8BEB0;   /* hairlines */
  --rule-soft:    #DDD4C5;   /* softer hairline */
  --accent:       #5A1F1A;   /* deep oxblood */
  --accent-hover: #7A2A22;
  --shadow-soft:  0 1px 2px rgba(19, 17, 15, 0.04),
                  0 8px 32px rgba(19, 17, 15, 0.06);
  --shadow-lift:  0 2px 4px rgba(19, 17, 15, 0.06),
                  0 18px 48px rgba(19, 17, 15, 0.10);

  /* ── Type ── */
  --font-display: "Source Serif 4", "Source Serif Pro", "Tiempos Headline",
                  Georgia, "Times New Roman", serif;
  --font-body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
                  Helvetica, Arial, sans-serif;

  --fz-12: clamp(11px, 0.72vw, 12px);
  --fz-14: clamp(12.5px, 0.85vw, 14px);
  --fz-16: clamp(15px, 1.02vw, 16px);
  --fz-18: clamp(16px, 1.15vw, 18px);
  --fz-20: clamp(17px, 1.28vw, 20px);
  --fz-24: clamp(20px, 1.55vw, 24px);
  --fz-32: clamp(26px, 2.1vw, 32px);
  --fz-40: clamp(32px, 2.7vw, 40px);
  --fz-56: clamp(40px, 4vw, 56px);
  --fz-72: clamp(48px, 5.4vw, 72px);
  --fz-display:   clamp(60px, 9vw, 144px);

  --lh-tight:  1.05;
  --lh-snug:   1.18;
  --lh-base:   1.5;
  --lh-loose:  1.65;

  --tracking-tight:  -0.02em;
  --tracking-snug:   -0.01em;
  --tracking-base:    0;
  --tracking-wide:    0.04em;
  --tracking-caps:    0.18em;

  /* ── Space (8px scale) ── */
  --sp-1:    4px;
  --sp-2:    8px;
  --sp-3:   12px;
  --sp-4:   16px;
  --sp-5:   24px;
  --sp-6:   32px;
  --sp-7:   48px;
  --sp-8:   64px;
  --sp-9:   96px;
  --sp-10: 128px;
  --sp-11: 192px;
  --sp-12: 256px;

  /* ── Layout ── */
  --max-page:   1280px;
  --max-prose:   62ch;
  --gutter:     clamp(20px, 4vw, 64px);
  --rule-w:      1px;

  /* ── Motion ── */
  --ease-brand: cubic-bezier(0.22, 1, 0.36, 1);   /* slow-in / slow-out, "luxury" curve */
  --ease-snap:  cubic-bezier(0.16, 1, 0.3, 1);    /* slightly tighter for hovers */
  --ease-out:   cubic-bezier(0, 0, 0.2, 1);

  --dur-fast:  200ms;
  --dur-base:  300ms;
  --dur-slow:  600ms;
  --dur-glide: 900ms;

  /* ── Radius (used sparingly — editorial = mostly square) ── */
  --r-1: 2px;
  --r-2: 4px;
  --r-card: 0;  /* cards stay square by default */

  /* ── Z ── */
  --z-nav: 50;
  --z-modal: 100;

  /* ── Background atmosphere (D: grain + breathing gradient) ── */
  --grain-opacity: 0.045;             /* Static film grain. Keep ≤0.05. */
  --glow-tint:     #FBF6EE;           /* Warmer ivory the breath drifts toward. */
  --glow-x: 82%;                      /* Default origin: top-right. Pages override. */
  --glow-y: 8%;
  --glow-radius: 70vw;
  --glow-strength: 0.78;              /* Peak alpha at the gradient core. */
  --breathe-duration: 28s;
}

/* Honor the user's reduced-motion preference everywhere. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast:  0ms;
    --dur-base:  0ms;
    --dur-slow:  0ms;
    --dur-glide: 0ms;
  }
}
