/* ─── Design tokens ───────────────────────────────────────────────────────────
   Colors are NEVER hardcoded here. The base roles are Customizer values
   (printed on :root by wps_inline_styles(), includes/customizer/
   customizer.php; the declarations below are only the fallback for before
   that block loads). Every other color is a color-mix() derivation of them.
   Palette roles: primary = brass, secondary = oxblood, text = cream,
   muted = smoke, bg = walnut, bg-light = walnut 2, surface = walnut 3,
   border = walnut 4. See docs/styling.md.
   ────────────────────────────────────────────────────────────────────────── */

:root {
  /* Base colors (Customizer) */
  --primary-color: #c89b3c;
  --secondary-color: #6e1f1f;
  --text-color: #efe6d2;
  --text-muted: #8c8279;
  --bg-light: #271d17;
  --bg-color: #1e1612;
  --surface-color: #33261e;
  --border-color: #46352a;
  --positive-color: #7c8a3e;
  --negative-color: #d2493f;

  /* Fonts (printed by wps_inline_styles(); fallbacks here) */
  --font-title: "Fraunces", Georgia, "Times New Roman", serif;
  --font-text: "Work Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Derived colors */
  --accent: var(--primary-color);
  --accent-hi: color-mix(in srgb, var(--primary-color) 78%, white);
  --accent-lo: color-mix(in srgb, var(--primary-color) 62%, black);
  --secondary-hi: color-mix(in srgb, var(--secondary-color) 82%, white);
  --secondary-deep: color-mix(in srgb, var(--secondary-color) 68%, black);
  --text-soft: color-mix(in srgb, var(--text-color) 86%, var(--bg-color));
  --muted-hi: color-mix(in srgb, var(--text-muted) 72%, var(--text-color));
  --deep: color-mix(in srgb, var(--bg-color) 80%, black);
  --panel-top: var(--bg-light);
  --panel-bot: color-mix(in srgb, var(--bg-light) 88%, var(--bg-color));
  --tint: color-mix(in srgb, var(--primary-color) 5%, transparent);
  --tint-strong: color-mix(in srgb, var(--primary-color) 18%, transparent);
  --focus: var(--accent-hi);

  /* Shape + rhythm */
  --radius: 6px;
  --radius-lg: 14px;
  --shadow: 0 1px 0 color-mix(in srgb, var(--text-color) 4%, transparent) inset, 0 18px 40px -18px color-mix(in srgb, black 70%, transparent);
  --gutter: clamp(16px, 4vw, 48px);
  --max: 1240px;
  --header-h: 72px;
  --section-y: clamp(56px, 8vw, 112px);

  /* Motion */
  --ease: cubic-bezier(0.22, 0.7, 0.2, 1);
  --hover-duration: 0.25s;
}