/*
 * ═══════════════════════════════════════════════════════
 * ABIA GREEN — DESIGN TOKENS
 * File: css/tokens.css
 *
 * Single source of truth for every colour, font, spacing
 * and layout value used across all three pages.
 * Imported first by shared.css and all page CSS files.
 * ═══════════════════════════════════════════════════════
 */

:root {

  /* ── PALETTE ─────────────────────────────────────── */
  --cream:      #F7F3EC;
  --cream-2:    #EDE8DF;
  --white:      #FDFAF5;
  --ink:        #1A1208;
  --ink-2:      #2C2115;
  --forest:     #1A6B3C;
  --deep:       #0F3D22;
  --amber:      #E8941A;
  --amber-2:    #C27A10;
  --ash:        #8B7355;
  --ash-2:      #6B5840;
  --red:        #C0392B;
  --blue:       #2471A3;

  /* ── PER-PAGE ACCENT (overridden in page CSS) ────── */
  --accent:       var(--forest);
  --accent-deep:  var(--deep);
  --accent-glow:  rgba(26, 107, 60, 0.18);

  /* ── TYPOGRAPHY ──────────────────────────────────── */
  --font-serif: 'DM Serif Display', 'Georgia', 'Times New Roman', serif;
  --font-sans:  'Inter', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --font-mono:  'Space Mono', 'Courier New', 'Lucida Console', monospace;

  /* ── LAYOUT ──────────────────────────────────────── */
  --pad:    clamp(20px, 5vw, 72px);
  --max:    1160px;
  --radius: 3px;

  /* ── PLATFORM BAR HEIGHT ─────────────────────────── */
  --pb-h:  36px;
  --nav-h: 56px;
  --top-offset: 92px; /* pb-h + nav-h */

  /* ── ULI CROSSHATCH PATTERNS ─────────────────────── */
  --uli-light: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 32L32 0M-8 8L8-8M24 40L40 24' stroke='%231A1208' stroke-width='0.6' opacity='0.05'/%3E%3Cpath d='M0 0L32 32M-8 24L8 40M24-8L40 8' stroke='%231A1208' stroke-width='0.6' opacity='0.03'/%3E%3C/svg%3E");
  --uli-dark:  url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 32L32 0M-8 8L8-8M24 40L40 24' stroke='%23F7F3EC' stroke-width='0.6' opacity='0.05'/%3E%3Cpath d='M0 0L32 32M-8 24L8 40M24-8L40 8' stroke='%23F7F3EC' stroke-width='0.6' opacity='0.04'/%3E%3C/svg%3E");
}