/* Serenity in the Stadium — Colour tokens
   The locked palette: six brand colours + neutral tints.
   Balance — cream canvas ~50%, navy type ~20%, gold + clay warmth ~20%, blush ~10%, teal tertiary. */

:root {
  /* ---- Brand palette (the six) ---- */
  --navy:          #173A52;  /* Deep Sea Navy — primary · ink */
  --navy-700:      #102C40;  /* deeper navy, pressed/contrast */
  --navy-900:      #0B1F2E;  /* near-black navy */
  --gold:          #E0AD45;  /* Sunlit Gold — primary · the sun */
  --gold-600:      #C99A33;  /* gold, hover/darker */
  --clay:          #C0773F;  /* Clay — accent · warmth (primary CTA) */
  --clay-600:      #A6632F;  /* clay, hover/darker */
  --blush:         #E7B1C4;  /* Blush — accent · soft */
  --teal:          #5AA8A2;  /* Calm Teal — tertiary */

  /* ---- Neutrals ---- */
  --cream:         #F6EAD5;  /* Warm Cream — canvas */
  --paper:         #FAF2E3;  /* Paper — lightest page */
  --cream-200:     #EFE0C6;  /* cream, slightly deeper (lines, fills) */
  --cream-300:     #E6D3B4;  /* hairline borders on cream */
  --white:         #FFFFFF;

  /* ---- Semantic aliases ---- */
  --surface-page:    var(--paper);
  --surface-canvas:  var(--cream);
  --surface-card:    var(--white);
  --surface-sunk:    var(--cream-200);
  --surface-ink:     var(--navy);      /* dark sections / scrims */
  --surface-ink-2:   var(--navy-700);

  --text-strong:     var(--navy);      /* headings, primary copy */
  --text-body:       #2C4456;          /* body on light (navy, slightly lifted) */
  --text-muted:      #5C7184;          /* secondary copy */
  --text-on-dark:    var(--cream);     /* copy on navy/photo */
  --text-on-dark-muted: #B9CAD4;
  --text-gold:       var(--clay);      /* warm sub-labels (the "IN THE STADIUM" tone) */

  --border-subtle:   var(--cream-300);
  --border-strong:   rgba(23, 58, 82, 0.16);
  --border-on-dark:  rgba(246, 234, 213, 0.22);

  --accent-primary:  var(--clay);      /* primary CTA warmth */
  --accent-sun:      var(--gold);
  --accent-soft:     var(--blush);
  --accent-cool:     var(--teal);

  --focus-ring:      rgba(224, 173, 69, 0.55); /* gold focus halo */
}