/* ============================================================
 * Apple Fest Public Site — Design tokens
 * Port of design_handoff_public_site_2026/reference/styles/colors_and_type.css
 * Fonts loaded via Google Fonts in index.html (Oswald, Montserrat, DM Mono,
 * Caveat) to avoid shipping font binaries in the repo.
 * ============================================================ */

:root {
  /* ---------- BRAND PALETTE ---------- */
  --af-red:         #e51e25;
  --af-red-dark:    #a01515;
  --af-red-screen:  #CC1B1B;
  --af-black:       #231f20;
  --af-white:       #ffffff;

  --af-sky:         #41b6e6;
  --af-royal:       #0047bb;
  --af-green:       #31b700;
  --af-brown:       #3f1310;
  --af-gold:        #ffc72c;
  --af-gray:        #8c959d;

  --af-navy:        #1B2A4A;
  --af-cream:       #F7F3EE;
  --af-parchment:   #EDE8DF;
  --af-rule:        #D9D0C4;

  /* Saint Lawrence co-brand */
  --stl-yellow:     #FFC726;
  --stl-blue:       #002F6C;
  --stl-highlight:  #F5E1A4;
  --stl-white:      #FFFFFF;

  /* ---------- PUBLIC-SITE ALIASES ---------- */
  /* public.css references these short names. They layer on top of the
     brand palette so overrides in editorial direction are surgical. */
  --ink:         #1c1917;
  --ink-mid:     #44403c;
  --ink-light:   #78716c;
  --rule:        #E7E2D7;
  --rule-dk:     #D6D0C2;
  --red:         var(--af-red);
  --red-deep:    #B01216;
  --red-soft:    #fde8e8;
  --red-pale:    #FFF5F3;
  --sky:         var(--af-sky);
  --sky-pale:    #E7F5FC;
  --royal:       #1B4494;
  --royal-deep:  #0A2E72;
  --royal-pale:  #E9EEF9;
  --gold:        var(--af-gold);
  --cream:       var(--af-cream);
  --parchment:   var(--af-parchment);
  --white:       #ffffff;

  --max-w:        1200px;
  --max-w-narrow: 760px;

  --sh-sm: 0 1px 3px rgba(26,20,15,.06), 0 1px 2px rgba(26,20,15,.04);
  --sh-md: 0 4px 16px rgba(26,20,15,.08), 0 1px 4px rgba(26,20,15,.04);
  --sh-lg: 0 14px 44px rgba(26,20,15,.14), 0 4px 12px rgba(26,20,15,.06);

  /* ---------- TYPOGRAPHY ---------- */
  --font-display:   'Oswald', 'Impact', 'Arial Narrow Bold', sans-serif;
  --font-body:      'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono:      'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --font-hand:      'Caveat', 'Comic Sans MS', cursive;

  --text-hero:      52px;
  --text-h1:        40px;
  --text-h2:        32px;
  --text-h3:        22px;
  --text-h4:        16px;
  --text-label:     13px;
  --text-body:      15px;
  --text-small:     13px;
  --text-caption:   12px;
  --text-micro:     11px;

  --leading-tight:  1.05;
  --leading-snug:   1.3;
  --leading-normal: 1.55;
  --leading-loose:  1.78;

  --track-display:  0.04em;
  --track-label:    0.12em;
  --track-eyebrow:  0.18em;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 10px;

  --shadow-sm: 0 1px 2px rgba(27, 42, 74, 0.06);
  --shadow-md: 0 2px 10px rgba(27, 42, 74, 0.08);
  --shadow-lg: 0 8px 24px rgba(27, 42, 74, 0.12);
}