/* ==========================================================================
   Design Tokens — the single source of truth for colour, type, space, motion.
   Change values here; every page follows.

   PALETTE: taken from Vicky's own rebrand material (Aug 2026 countdown posts),
   sampled off the artwork rather than guessed:

       gold   #D4A853    the VIARA metallic gold (mid-tone of the gradient)
       black  #0A0908    the logo ground — essentially black
       cream  #F8EFE4    warm ivory

   The logo's gold is a *gradient*, not a flat colour: highlight #F6E2AD through
   #D4A853 and #B8862F down to #A3761F. --grad-gold reproduces it, and
   .gold-text paints it onto type. Flat --gold is the fallback.

   Her graphics are built as cream-and-black splits with gold as the connective
   tissue, so the site works the same way: a cream light theme, a black dark
   theme, and `.lux` bands that are black-and-gold in *both* themes.

   CONTRAST — read before changing a gold:
   The VIARA gold (#D4A853) is bright, so on cream it is DECORATIVE ONLY —
   rules, borders, the ring, large numerals. Gold *text* on a light background
   must use --accent (#8A6620). On black, the brand gold is fine as text.
   `.gold-text` paints the gradient onto type; only ever use it on dark grounds
   or at display sizes, never for body copy on cream.
   ========================================================================== */

:root {
  /* ---- Brand palette (raw, sampled) ---------------------------------- */
  --gold:         #d4a853;   /* VIARA gold — decorative on light, text on dark */
  --gold-light:   #f6e2ad;   /* gradient highlight */
  --gold-mid:     #d9ae5c;
  --gold-shadow:  #a3761f;   /* gradient shadow */
  --gold-deep:    #8a6620;   /* text-safe gold for cream backgrounds */
  --gold-deeper:  #6b4f16;
  /* Lightened from #f3e7d2 so --gold-deep text on it clears AA (was 4.32:1) */
  --gold-pale:    #f7eede;
  --gold-mist:    #fbf5ea;

  --noir:         #0a0908;   /* the logo ground — essentially black */
  --noir-2:       #12100d;
  --noir-3:       #1c1813;

  --cream:        #f8efe4;   /* brand cream */
  --cream-light:  #fbf6ef;
  --cream-deep:   #f0e4d3;

  --taupe:        #6f6154;   /* warm muted ink */
  --taupe-2:      #948577;

  /* A whisper of her older blush badge, kept as a secondary accent only */
  --blush:        #e3b8ad;
  --blush-pale:   #f9e8e2;

  /* ---- Semantic: light theme (cream) --------------------------------- */
  --bg:            var(--cream-light);
  --bg-tint:       var(--cream);
  --surface:       #fffdfa;
  --surface-2:     var(--cream);
  --surface-3:     var(--cream-deep);
  --surface-invert: var(--noir);

  --text:          var(--noir);
  --text-soft:     #3a3229;
  --text-muted:    var(--taupe);
  --text-invert:   var(--cream);

  --accent:        var(--gold-deep);
  --accent-hover:  var(--gold-deeper);
  --accent-tint:   var(--gold-pale);
  --accent-wash:   var(--gold-mist);
  --accent-ink:    #fffdfa;

  --secondary:     var(--blush);
  --secondary-tint: var(--blush-pale);
  --hairline:      var(--gold);

  --border:        #ece0cf;
  --border-strong: #dbc9b0;

  --success:       #4a6b3f;
  --success-tint:  #eaf0e4;
  --warning:       #8a5a1e;
  --warning-tint:  #f9eeda;
  --danger:        #9c3b32;
  --danger-tint:   #f9e6e3;

  /* Gradients & atmosphere */
  --grad-warm: linear-gradient(135deg, #fbf6ef 0%, #f6ece0 45%, #f0e4d3 100%);
  /* Black-and-gold band. Lightest stop capped at #2b2318 so cream body text
     over it still clears 4.5:1. */
  --grad-accent: linear-gradient(150deg, #0a0908 0%, #17130d 55%, #2b2318 100%);
  /* The metallic sweep from the logo ring, for .gold-text and gilt rules. */
  --grad-gold: linear-gradient(115deg, #f6e2ad 0%, #d4a853 26%, #b8862f 52%, #eccd88 74%, #a3761f 100%);
  --grad-blush: linear-gradient(140deg, #f3e7d2 0%, #f0ded0 55%, #f6ece0 100%);
  --grad-sunrise: linear-gradient(120deg, #fbf5ea 0%, #f8efe4 40%, #f9e8e2 100%);
  --glow: radial-gradient(60% 60% at 50% 0%, rgba(190, 149, 96, .22), transparent 70%);
  --glow-blush: radial-gradient(70% 70% at 30% 10%, rgba(227, 184, 173, .22), transparent 72%);

  /* ---- Typography ---------------------------------------------------- */
  --font-display: "Cormorant Garamond", "Iowan Old Style", "Palatino Linotype",
                  Palatino, Georgia, "Times New Roman", serif;
  /* Echoes the gold script in her logo. Accent words only — never body text. */
  --font-script:  "Parisienne", "Segoe Script", "Brush Script MT", cursive;
  --font-body:    "Inter", ui-sans-serif, system-ui, -apple-system,
                  "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono:    ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;

  --step--2: clamp(0.72rem, 0.70rem + 0.10vw, 0.78rem);
  --step--1: clamp(0.84rem, 0.81rem + 0.14vw, 0.92rem);
  --step-0:  clamp(0.98rem, 0.94rem + 0.19vw, 1.09rem);
  --step-1:  clamp(1.14rem, 1.07rem + 0.34vw, 1.34rem);
  --step-2:  clamp(1.33rem, 1.21rem + 0.57vw, 1.66rem);
  --step-3:  clamp(1.55rem, 1.36rem + 0.90vw, 2.07rem);
  --step-4:  clamp(1.80rem, 1.51rem + 1.38vw, 2.58rem);
  --step-5:  clamp(2.10rem, 1.66rem + 2.07vw, 3.21rem);
  --step-6:  clamp(2.44rem, 1.80rem + 3.02vw, 4.00rem);
  --step-7:  clamp(2.84rem, 1.90rem + 4.35vw, 4.99rem);

  --lh-tight: 1.06;
  --lh-snug:  1.22;
  --lh-body:  1.68;

  --tracking-display: -0.015em;
  /* Her lockups are set in wide letterspaced caps — match that. */
  --tracking-eyebrow: 0.26em;

  /* ---- Space --------------------------------------------------------- */
  --sp-1: 0.25rem;  --sp-2: 0.5rem;  --sp-3: 0.75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;   --sp-6: 2rem;    --sp-7: 3rem;     --sp-8: 4rem;
  --sp-9: 6rem;     --sp-10: 8rem;
  --section-y: clamp(3.5rem, 2rem + 7vw, 7.5rem);

  /* ---- Layout -------------------------------------------------------- */
  --measure: 68ch;
  --width-xs: 30rem;  --width-sm: 42rem;  --width-md: 58rem;
  --width-lg: 72rem;  --width-xl: 82rem;
  --gutter: clamp(1.15rem, 0.6rem + 2.6vw, 2.75rem);
  --header-h: 4.75rem;

  /* ---- Radii & elevation --------------------------------------------- */
  --r-xs: 4px;
  --r-sm: 8px;
  /* Tighter than the blush build: her material is architectural and
     gold-ruled, and softer corners read boutique rather than luxury. */
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 26px;
  --r-pill: 999px;

  /* Shadows carry a warm brown cast, never grey */
  --shadow-xs: 0 1px 2px rgba(31, 24, 14, .06);
  --shadow-sm: 0 2px 10px -3px rgba(31, 24, 14, .12), 0 1px 2px rgba(31, 24, 14, .06);
  --shadow-md: 0 14px 32px -14px rgba(31, 24, 14, .24), 0 2px 8px rgba(31, 24, 14, .07);
  --shadow-lg: 0 34px 64px -30px rgba(31, 24, 14, .34), 0 6px 16px rgba(31, 24, 14, .08);
  --shadow-glow: 0 16px 38px -18px rgba(138, 101, 40, .40);
  --shadow-peach: 0 16px 38px -18px rgba(190, 149, 96, .38);
  --ring: 0 0 0 3px color-mix(in oklab, var(--accent) 32%, transparent);

  /* ---- Motion -------------------------------------------------------- */
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --t-fast: 140ms;  --t-med: 260ms;  --t-slow: 520ms;  --t-reveal: 760ms;

  color-scheme: light;
}

/* The dark palette that used to live here was removed on 14 Aug 2026 — the
   site is one committed look now. See "One theme, on purpose" in README.md
   before reintroducing a second one. */