/* ============================================================
   BERUNDA — Design tokens for the Shopify theme
   Fonts + CSS custom properties only. NO global element selectors,
   so Dawn's other routes remain untouched. Page sections scope their
   own element styling under .bf / .ab / .lg / .col wrappers.
   Source of truth: design_src/project/tokens/*.css
   ============================================================ */

/* ---- Webfonts (Cinzel + Cormorant Garamond, embedded from the brand kit).
   Plain-CSS asset: sibling fonts resolve via relative url() in the same
   Shopify assets/ folder. ---- */
@font-face {
  font-family: "Cinzel";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url("Cinzel-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "Cinzel";
  font-style: normal; font-weight: 700; font-display: swap;
  src: url("Cinzel-Bold.ttf") format("truetype");
}
@font-face {
  font-family: "Cormorant Garamond";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url("CormorantGaramond-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "Cormorant Garamond";
  font-style: normal; font-weight: 700; font-display: swap;
  src: url("CormorantGaramond-Bold.ttf") format("truetype");
}
@font-face {
  font-family: "Cormorant Garamond";
  font-style: italic; font-weight: 400; font-display: swap;
  src: url("CormorantGaramond-Italic.ttf") format("truetype");
}
@font-face {
  font-family: "Cormorant Garamond";
  font-style: italic; font-weight: 700; font-display: swap;
  src: url("CormorantGaramond-BoldItalic.ttf") format("truetype");
}

:root {
  /* ---- Core brand palette ---- */
  --berunda-black:    #000000;
  --midnight-navy:    #01143c;
  --espresso-brown:   #422817;
  --regal-gold:       #c6871b;
  --ivory-beige:      #c4b79a;
  --crimson-burgundy: #460205;

  /* ---- Navy scale ---- */
  --navy-900: #00091f;
  --navy-800: #01143c;
  --navy-700: #042056;
  --navy-600: #0a2e6e;
  --navy-tint: #1b3a6b;

  /* ---- Gold scale (matte antique) ---- */
  --gold-700: #936212;
  --gold-600: #b0761a;
  --gold-500: #c6871b;
  --gold-400: #d6a23f;
  --gold-300: #e3bd6e;
  --gold-200: #efd9a6;

  /* ---- Espresso scale ---- */
  --espresso-900: #2a1810;
  --espresso-800: #422817;
  --espresso-700: #5c3a22;
  --espresso-600: #79502f;

  /* ---- Burgundy scale ---- */
  --burgundy-900: #2c0103;
  --burgundy-800: #460205;
  --burgundy-700: #66070b;
  --burgundy-600: #8a1218;

  /* ---- Ivory / parchment scale ---- */
  --parchment:  #f4ecdc;
  --ivory-200:  #ece0c9;
  --ivory-300:  #ddccac;
  --ivory-400:  #c4b79a;
  --ivory-500:  #a89a7c;

  /* ---- Functional neutrals ---- */
  --ink-900: #1a140d;
  --ink-700: #3a2e20;
  --ink-500: #6b5b45;
  --hairline-dark:  rgba(198, 135, 27, 0.28);
  --hairline-light: rgba(66, 40, 23, 0.18);

  /* ---- Semantic aliases ---- */
  --surface-base:      var(--parchment);
  --surface-raised:    #fbf6ea;
  --surface-sunken:    var(--ivory-200);
  --surface-dark:      var(--midnight-navy);
  --surface-dark-alt:  var(--espresso-900);
  --surface-ceremonial:var(--crimson-burgundy);
  --surface-card:      var(--surface-raised);
  --surface-inverse:   var(--midnight-navy);

  --text-body:       var(--berunda-black);
  --text-heading:    var(--midnight-navy);
  --text-supporting: var(--espresso-brown);
  --text-muted:      var(--ink-500);
  --text-on-dark:    var(--parchment);
  --text-on-dark-muted: var(--ivory-400);
  --text-gold:       var(--regal-gold);
  --text-gold-bright:var(--gold-300);

  --brand-primary:   var(--midnight-navy);
  --brand-gold:      var(--regal-gold);
  --brand-accent:    var(--crimson-burgundy);

  --border-default:  var(--hairline-light);
  --border-on-dark:  var(--hairline-dark);
  --border-gold:     var(--regal-gold);
  --rule-gold:       var(--gold-400);

  --gold-hover:   var(--gold-400);
  --gold-press:   var(--gold-700);
  --navy-hover:   var(--navy-700);
  --navy-press:   var(--navy-900);
  --focus-ring:   var(--gold-400);

  /* ---- Typography ---- */
  --font-display: "Cinzel", "Trajan Pro", Georgia, serif;
  --font-body:    "Cormorant Garamond", "EB Garamond", Georgia, serif;
  --font-sans:    ui-sans-serif, system-ui, "Segoe UI", Arial, sans-serif;

  --text-2xs: 0.6875rem;
  --text-xs:  0.8125rem;
  --text-sm:  0.9375rem;
  --text-base:1.125rem;
  --text-lg:  1.375rem;
  --text-xl:  1.75rem;
  --text-2xl: 2.25rem;
  --text-3xl: 3rem;
  --text-4xl: 4rem;
  --text-5xl: 5.5rem;
  --text-6xl: 7.5rem;

  --weight-regular: 400;
  --weight-bold:    700;

  --leading-tight:   1.1;
  --leading-snug:    1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.65;

  --tracking-display: 0.08em;
  --tracking-label:   0.22em;
  --tracking-wide:    0.14em;
  --tracking-body:    0.005em;
  --tracking-tight:   -0.01em;

  /* ---- Spacing & layout (4px base) ---- */
  --space-0:  0;
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.5rem;
  --space-6:  2rem;
  --space-7:  3rem;
  --space-8:  4rem;
  --space-9:  6rem;
  --space-10: 8rem;

  --container-sm:  640px;
  --container-md:  860px;
  --container-lg:  1120px;
  --container-xl:  1320px;
  --gutter:        var(--space-6);
  --section-pad-y: var(--space-9);
  --measure:       68ch;

  /* ---- Elevation, radii, borders, motion ---- */
  --radius-none: 0;
  --radius-xs:   2px;
  --radius-sm:   4px;
  --radius-md:   6px;
  --radius-lg:   10px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  --border-hairline: 1px;
  --border-regular:  1.5px;
  --border-frame:    2px;

  --shadow-xs: 0 1px 2px rgba(26, 20, 13, 0.08);
  --shadow-sm: 0 2px 8px rgba(26, 20, 13, 0.10);
  --shadow-md: 0 8px 24px rgba(26, 20, 13, 0.12);
  --shadow-lg: 0 18px 48px rgba(1, 20, 60, 0.18);
  --shadow-dark: 0 16px 40px rgba(0, 0, 0, 0.45);

  --ring-gold: 0 0 0 1px var(--regal-gold);
  --ring-gold-soft: 0 0 0 1px rgba(198, 135, 27, 0.45);

  --foil-gold: linear-gradient(100deg, #936212 0%, #c6871b 22%, #e3bd6e 42%, #c6871b 60%, #936212 80%, #d6a23f 100%);
  --scrim-bottom: linear-gradient(to top, rgba(0,9,31,0.92) 0%, rgba(0,9,31,0.55) 35%, rgba(0,9,31,0) 100%);
  --scrim-full:   linear-gradient(to top, rgba(0,9,31,0.85) 0%, rgba(0,9,31,0.25) 60%, rgba(0,9,31,0) 100%);

  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-entrance: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-exit:     cubic-bezier(0.4, 0, 1, 1);
  --dur-fast:   140ms;
  --dur-normal: 240ms;
  --dur-slow:   480ms;
}

/* ============================================================
   Neutralize Dawn's global `body { letter-spacing: .06rem }` inside the
   Berunda page scopes. The design tracks only headings/labels (each sets
   its own letter-spacing); body copy is normal spacing. Without this,
   Dawn's 0.6px leaks into every paragraph. Scoped to the page wrappers so
   Dawn's other routes are untouched; elements that set their own
   letter-spacing still win.
   ============================================================ */
.bf, .ab, .col, .lg { letter-spacing: normal; }
