/* tokens.css — brand & layout tokens (Offscript) */
/* Source of truth: createoffscript.html values (colors, fonts, easing, radii, shadows) */
:root{
    /* Colors */
    --clr-sage-900: #314238;   /* primary text/nav */
    --clr-bronze-600: #b37945; /* accents, buttons, progress */
    --clr-cream-50:  #faf7f2;  /* page background */
    --clr-ink-800:   #2B3A31;  /* rich body copy */
  
    /* Typography */
    --ff-sans:  "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
    --ff-serif: "Playfair Display", Georgia, serif;
    --fs-hero:  clamp(2.8rem, 6vw, 4.2rem);
    --fs-h1:    clamp(2.0rem, 4.5vw, 3.2rem);
    --fs-h2:    clamp(1.6rem, 3.5vw, 2.4rem);
    --fs-lead:  clamp(1.1rem, 2.2vw, 1.3rem);
  
    /* Radii & Shadows */
    --radius-sm: 10px;
    --radius-md: 14px;
    --radius-lg: 16px;
  
    --sh-1: 0 8px 24px -16px rgba(0,0,0,.18);
    --sh-2: 0 14px 36px -22px rgba(0,0,0,.26);
    --sh-3: 0 26px 64px -28px rgba(0,0,0,.32);
  
    /* Motion */
    --ease: cubic-bezier(.22,.61,.36,1);
    --dur-quick: 120ms;
    --dur-std:   300ms;
  
    /* Process sticky defaults */
    --process-sticky-top: clamp(48px, 8vh, 96px);
  }
  
  /* Minimal utilities for places without Tailwind */
  .u-card{ background:#fff; border:1px solid #e0d9cc; border-radius:var(--radius-md); box-shadow:var(--sh-2); }
  .u-btn{ border-radius:9999px; font-weight:600; transition:all var(--dur-std) var(--ease); }
  .u-btn--primary{ background:var(--clr-bronze-600); color:#fff; }
  .u-btn--ghost{ border:2px solid var(--clr-sage-900); color:var(--clr-sage-900); background:transparent; }
  .u-hero-title{ font-family:var(--ff-serif); font-size:var(--fs-hero); line-height:1.1; }