/* ==========================================================================
   BRAND TOKENS: the only place colours, fonts and radii are defined.
   Brand Option A "Heritage Tree" (provisional). To change the brand, edit
   this file, then follow BRAND-SWAP.md for the logo snippets.
   site.css references tokens only; it holds no hex values or font names.
   ========================================================================== */

/* ---- Fonts (self-hosted, latin subset). Swap files + names here. ---- */
@font-face {
  font-family: "Marcellus";
  src: url("../fonts/marcellus-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: url("../fonts/public-sans-var.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- Palette: raw brand colours ---- */
  --brand-heartwood: #2B2520;      /* text, dark sections */
  --brand-copper: #A4531F;         /* accent, buttons, links (4.7:1 on Bark Light) */
  --brand-copper-light: #E8A170;   /* copper on dark backgrounds only */
  --brand-bark: #8C8F8A;           /* lines, icons. Not for body text */
  --brand-bark-light: #EEEEEA;     /* main light background */
  --brand-blond: #E6D3BC;          /* warm panels: price and warranty */
  --brand-paper: #FAFAF8;          /* cards, header, form fields */

  /* ---- Palette: derived, contrast-checked ---- */
  --brand-copper-dark: #8A4318;    /* button hover, 6.2:1 on Bark Light */
  --brand-copper-deep: #7A3A12;    /* copper text on Beech Blond, 5.9:1 */
  --brand-muted: #5E574F;          /* secondary text, 6.1:1 on Bark Light */
  --brand-muted-on-dark: #C9C3B8;  /* secondary text on Heartwood, 8.6:1 */
  --brand-line: #D5D3CB;           /* hairlines on light */
  --brand-line-dark: #4A423B;      /* hairlines on Heartwood */
  --brand-blond-line: #CDB799;     /* hairlines on Beech Blond */

  /* ---- Semantic colour tokens (what site.css uses) ---- */
  --color-text: var(--brand-heartwood);
  --color-text-muted: var(--brand-muted);
  --color-bg: var(--brand-bark-light);
  --color-surface: var(--brand-paper);
  --color-line: var(--brand-line);
  --color-icon: var(--brand-bark);
  --color-accent: var(--brand-copper);
  --color-accent-hover: var(--brand-copper-dark);
  --color-on-accent: var(--brand-paper);
  --color-warm-bg: var(--brand-blond);
  --color-warm-text: var(--brand-heartwood);
  --color-warm-accent: var(--brand-copper-deep);
  --color-warm-line: var(--brand-blond-line);
  --color-dark-bg: var(--brand-heartwood);
  --color-dark-text: var(--brand-paper);
  --color-dark-muted: var(--brand-muted-on-dark);
  --color-dark-accent: var(--brand-copper-light);
  --color-dark-line: var(--brand-line-dark);
  --color-scrim: rgba(43, 37, 32, .86);        /* caption gradient over photos */
  --color-scrim-clear: rgba(43, 37, 32, 0);
  --shadow-menu: 0 18px 30px -20px rgba(43, 37, 32, .35);
  --color-focus: var(--brand-copper);
  --color-focus-on-dark: var(--brand-copper-light);

  /* ---- Type ---- */
  --font-display: "Marcellus", Georgia, serif;
  --font-body: "Public Sans", system-ui, sans-serif;
  --weight-display: 400;   /* Marcellus ships one weight: never bold it */
  --weight-body: 400;
  --weight-strong: 600;
  --weight-heavy: 700;

  --step--1: clamp(.83rem, .8rem + .15vw, .9rem);
  --step-0:  clamp(1rem, .95rem + .25vw, 1.125rem);
  --step-1:  clamp(1.25rem, 1.1rem + .6vw, 1.5rem);
  --step-2:  clamp(1.56rem, 1.3rem + 1.1vw, 2.1rem);
  --step-3:  clamp(1.95rem, 1.5rem + 2vw, 3rem);
  --step-4:  clamp(2.15rem, 1.4rem + 3.3vw, 4rem);

  /* ---- Radii ---- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-pill: 999px;
}