/* 17 · CANDLELIGHT — seasonal, editorial, warm. Greige + coral, two faces. */
:root {
  /* Tier 1 — primitives */
  --greige:    #D2C7BC;
  --greige-up: #DAD0C6;
  --coral:     #CF5A4E;
  --coral-dk:  #9C463C;
  --ink:       #26221C;
  --ink-muted: #5F564C;
  --cream:     #F3EEE7;
  --line:      #C2B6A9;

  /* Tier 2 — color */
  --color-bg:          var(--greige);
  --color-surface:     var(--greige-up);
  --color-text:        var(--ink);
  --color-text-muted:  var(--ink-muted);
  --color-accent:      var(--coral);
  --color-on-accent:   var(--cream);
  --color-eyebrow:     var(--coral-dk);
  --color-border:      var(--line);
  --color-wordmark:    var(--ink);
  --color-link:        var(--coral);
  --color-display-accent: var(--coral);

  /* Tier 2 — type families */
  --font-display:        'termina','Archivo',sans-serif;
  --font-display-accent: 'garamond-premier-pro','Newsreader',serif;
  --font-body:           'neue-haas-grotesk-text','Hanken Grotesk',sans-serif;
  --font-accent:         'garamond-premier-pro','Newsreader',serif;
  --font-eyebrow:        'Space Mono',monospace;
  --font-label:          'Space Mono',monospace;
  --font-link:           'garamond-premier-pro','Newsreader',serif;

  /* mixed-face style hooks */
  --display-accent-style:  italic;
  --display-accent-weight: 500;
  --link-style: italic;

  /* Tier 2 — scale & treatment */
  --text-hero:     clamp(2.4rem, 5vw, 3.1rem);
  --text-h2:       1.7rem;
  --text-eyebrow:  0.6875rem;
  --text-body:     0.9375rem;
  --text-meta:     0.6875rem;
  --weight-display: 800;
  --weight-body:    400;
  --weight-body-strong: 600;
  --tracking-display: -0.01em;
  --tracking-eyebrow: 0.14em;
  --leading-display:  0.92;
  --transform-display: uppercase;

  /* Tier 2 — shape & space */
  --radius-button: 100px;
  --radius-card:   6px;
  --border-width:  1px;
  --border-style:  solid;
  --space-sm: 0.75rem;
  --space-md: 1.25rem;
  --space-lg: 2rem;
  --space-xl: 3.25rem;

  /* Tier 3 — component aliases */
  --btn-primary-bg:     var(--coral);
  --btn-primary-text:   var(--cream);
  --btn-secondary-bd:   #B09C8F;
  --btn-secondary-text: var(--ink);
  --shadow-card: 0 2px 20px rgba(40,30,26,0.10);
}