/* ============================================================
   Sandeep Nandi — Design tokens
   Editorial base, illustrated punctuation. See DESIGN.md.
   ============================================================ */
:root {
  /* —— Color —————————————————————————————————————————— */
  --paper:      #FFFFFF;          /* clean white canvas */
  --paper-2:    #F4F4F4;          /* raised surfaces, image mats, alt sections */
  --paper-3:    #E9E9E9;          /* deepest mat / hover surface */
  --ink:        #1A1A1A;
  --ink-70:     rgba(26, 26, 26, .70);   /* body-safe ≥4.5:1 */
  --ink-50:     rgba(26, 26, 26, .50);   /* meta, captions   */
  --ink-35:     rgba(26, 26, 26, .35);   /* faint meta       */
  --line:       rgba(26, 26, 26, .14);
  --line-2:     rgba(26, 26, 26, .08);
  --accent:     #DD3D24;          /* vermilion — motif, hover, hero italic */
  --accent-ink: #B8301A;          /* darker vermilion for text needing 4.5:1 */
  --accent-wash: rgba(221, 61, 36, .10);
  --white:      #FFFFFF;

  /* —— Type —————————————————————————————————————————— */
  --serif: "Spectral", Georgia, "Times New Roman", serif;
  --sans:  "Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Fluid type scale (≥1.25 ratio, clamp) */
  --fs-display: clamp(2.4rem, 1.4rem + 5vw, 5.5rem);   /* hero, ceiling ≤6rem */
  --fs-h1:      clamp(2rem, 1.3rem + 3.2vw, 3.5rem);
  --fs-h2:      clamp(1.6rem, 1.2rem + 1.8vw, 2.4rem);
  --fs-h3:      clamp(1.25rem, 1.05rem + .9vw, 1.6rem);
  --fs-lead:    clamp(1.05rem, .98rem + .5vw, 1.3rem);
  --fs-body:    1.0625rem;        /* 17px */
  --fs-meta:    .75rem;           /* 12px tracked caps */
  --fs-small:   .8125rem;

  /* —— Space (fluid rhythm) ———————————————————————— */
  --space-2xs: .375rem;
  --space-xs:  .625rem;
  --space-sm:  1rem;
  --space-md:  1.75rem;
  --space-lg:  clamp(2rem, 1.4rem + 2.6vw, 3.5rem);
  --space-xl:  clamp(3rem, 2rem + 4.5vw, 6rem);
  --space-2xl: clamp(4.5rem, 3rem + 7vw, 9rem);

  /* —— Layout ————————————————————————————————————— */
  --measure:   72ch;              /* reading width cap */
  --container: 1180px;
  --gutter:    clamp(1.25rem, .6rem + 3vw, 3rem);
  --radius:    14px;
  --radius-sm: 10px;

  /* —— Motion ————————————————————————————————————— */
  --ease-out: cubic-bezier(.22, 1, .36, 1);   /* quart-ish */
  --dur-fast: .25s;
  --dur-mid:  .45s;
  --dur-slow: .8s;

  /* —— Z-index scale ———————————————————————————— */
  --z-sticky:  100;
  --z-nav:     200;
  --z-overlay: 300;
}
