/* ============================================================
   Ward BOYL — Design Tokens
   Source: WARD-4038 Brand Guide_FINAL.pdf (logo p.4, colors p.5,
   typography p.6). Extracted values mirrored in
   ./extracted-palette.json. Emerald is primary but should rarely
   overpower Sage in white space; Pebble is body copy.
   ============================================================ */

:root {
  /* --- Brand palette (raw) ------------------------------- */
  --ward-emerald: #093F3C;
  --ward-sage:    #C7D1C2;
  --ward-newday:  #8CBEE2;
  --ward-citrus:  #F9A025;
  --ward-cloud:   #FFFFFF;
  --ward-pebble:  #555555;

  /* RGB channel triplets for rgba() composition */
  --ward-emerald-rgb: 9, 63, 60;
  --ward-sage-rgb:    199, 209, 194;
  --ward-newday-rgb:  140, 190, 226;
  --ward-citrus-rgb:  249, 160, 37;
  --ward-pebble-rgb:  85, 85, 85;

  /* --- Semantic aliases ---------------------------------- */
  --ward-primary:        var(--ward-emerald);
  --ward-bg-primary:     var(--ward-cloud);
  --ward-bg-secondary:   rgba(var(--ward-sage-rgb), 0.10); /* 10% Sage tint */
  --ward-text-primary:   var(--ward-emerald);
  --ward-text-body:      var(--ward-pebble);
  --ward-accent-warm:    var(--ward-citrus);
  --ward-accent-cool:    var(--ward-newday);

  /* --- Type scale ---------------------------------------- */
  --fs-12:  0.75rem;   /* 12px */
  --fs-14:  0.875rem;  /* 14px */
  --fs-16:  1rem;      /* 16px — base */
  --fs-18:  1.125rem;  /* 18px */
  --fs-24:  1.5rem;    /* 24px */
  --fs-32:  2rem;      /* 32px */
  --fs-48:  3rem;      /* 48px */
  --fs-72:  4.5rem;    /* 72px */
  --fs-96:  6rem;      /* 96px */
  --fs-128: 8rem;      /* 128px */

  /* --- Spacing scale ------------------------------------- */
  --space-4:   0.25rem;
  --space-8:   0.5rem;
  --space-16:  1rem;
  --space-24:  1.5rem;
  --space-32:  2rem;
  --space-48:  3rem;
  --space-64:  4rem;
  --space-96:  6rem;
  --space-128: 8rem;
  --space-192: 12rem;

  /* --- Motion -------------------------------------------- */
  --ease-standard:  200ms;
  --ease-cinematic: 800ms;
  --ease-out:       cubic-bezier(0.16, 1, 0.3, 1);
}