/* ==========================================================================
   THE ADORÉE — DESIGN TOKENS
   Single source of truth. No hex value and no type/space px value may appear
   anywhere else in the codebase. Carried verbatim into the child theme.

   WP-00.8 ruling 1 — tokens.css outranks the brand kit PDF. The PDF lists two
   colours because it is a brand document; this file is the working system
   derived from them, with every value tested against every other. When the two
   disagree, this file wins. The palette below is the original, restored.
   ========================================================================== */
:root{
  /* ---- colour ---- */
  /* Primitive. WP-00.8 ruling 8 — white as a fixed value, for a label, border
     or mark sitting on a coloured or photographic ground. Unlike --c-surface it
     is never redefined by a scope, so it stays white inside .dark. That is the
     whole distinction: --c-surface is "the surface of wherever you are",
     --c-white is "white". */
  --c-white:#FFFFFF;

  --c-bg:#F9F4F5;          /* blush page background */
  --c-surface:#FFFFFF;     /* cards, panels */
  --c-surface-2:#F3EAEA;   /* tinted band, image placeholders */
  --c-accent:#B5958B;      /* rose taupe — accents, hairlines, dots, rules */
  --c-accent-deep:#9D7F76; /* accent hover, non-button */

  /* Button fill. WP-00.8 ruling 5 — buttons get their own tokens rather than
     borrowing --c-accent. White on --c-accent is 2.75:1 and fails AA, but
     --c-accent is also hairlines, palette dots, eyebrow accents and Luxe
     detailing; deepening it would shift the whole site from powdery to earthy.
     Same hue (14.3°) and saturation (22.1%) as --c-accent, lightness dropped
     62.7% -> 48.2%, so the family reads as one.
     --c-btn 4.51:1 with white. --c-btn-hover 6.21:1 with white.
     Only the .btn component points here. */
  --c-btn:#966D60;         /* primary button fill */
  --c-btn-hover:#7B594E;   /* primary button hover fill, ghost hover label */
  --c-text:#3D3536;        /* all body copy */
  --c-muted:#8A7D7E;       /* secondary copy, 14px+ only */
  --c-inactive:#DDD0CB;    /* borders, disabled, empty dots */
  --c-line:#E8DDDD;        /* hairlines */
  --c-dark:#332C2D;        /* footer, hero overlay, dark bands */
  --c-on-dark:#F9F4F5;
  --c-on-dark-muted:#B6A8A8;

  /* Form feedback. WP-01 A4 — the palette carried no error colour and the
     newsletter's error state needs one. Muted, desaturated warm reds chosen to
     sit inside the rose-taupe family rather than read as a generic alert.
     --c-error 5.64:1 on --c-bg, 6.14:1 on --c-surface.
     --c-error-on-dark 6.48:1 on --c-dark. */
  --c-error:#9A4A3C;         /* error text on light grounds */
  --c-error-on-dark:#D9A79D; /* error text on the dark bands */

  /* ---- type ---- */
  /* Bodoni Moda (Google Fonts) for display type at 28px and up.
     Marcellus is retained for display type below 28px.
     Jost unchanged for body and UI. */
  --f-display:'Bodoni Moda',Georgia,'Times New Roman',serif;
  --f-display-sub:'Marcellus',Georgia,'Times New Roman',serif;
  --f-body:'Jost',system-ui,-apple-system,sans-serif;

  /* Step-specific family bindings — Bodoni hard floor: 28px at ANY viewport.
     Steps that resolve below 28px on mobile use Marcellus (--f-display-sub). */
  --f-hero:var(--f-display);
  --f-h1:var(--f-display);
  --f-h2:var(--f-display);
  --f-h3:var(--f-display-sub);
  --f-h4:var(--f-display-sub);

  /* Widened display scale */
  --t-hero:clamp(52px,8.8vw,120px);
  --t-h1:clamp(38px,6.2vw,84px);
  --t-h2:clamp(30px,4.4vw,62px);
  --t-h3:clamp(24px,2.2vw,32px);
  --t-h4:clamp(18px,1.4vw,20px);
  --t-lead:clamp(18px,1.35vw,19px);
  --t-body:16px;
  --t-small:14px;
  --t-micro:12px;
  --t-eyebrow:11px;

  --ls-display:-0.025em;   /* tight tracking for Bodoni display authority */
  --ls-h:-0.018em;
  --ls-body:-0.006em;
  --ls-eyebrow:0.28em;
  --ls-ui:0.16em;
  --ls-btn:0.18em;

  --lh-display:1.0;
  --lh-h:1.06;
  --lh-body:1.55;
  --lh-tight:1.2;

  /* ---- body measure ---- */
  --measure:65ch;          /* line length cap at 62–68 characters for prose */

  /* ---- space & section rhythm ---- */
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px; --s-11:160px;
  --gutter:clamp(20px,4.5vw,72px);
  --maxw:1440px;

  /* Section rhythm scales: tight (utility), standard (discovery/content), expansive (theatre/manifesto) */
  --sec-y-tight:clamp(40px,4.8vw,68px);
  --sec-y-standard:clamp(60px,7.5vw,120px);
  --sec-y-expansive:clamp(84px,10.5vw,176px);
  --sec-y:var(--sec-y-standard);

  /* ---- brand lockup ---- */
  /* WP-00.8 ruling 2 — scoped, not global. min(480px,80vw) exists to stop the
     lockup being compressed toward a square in large standalone placements.
     The header is not one of those: there the lockup sizes to the bar, with the
     aspect ratio locked by `height:auto`, so it never distorts or crops and the
     header stays one row from 320px to 1440px. */
  --logo-w:min(480px,80vw);          /* large standalone placements: footer, 404, splash */
  --logo-w-header:clamp(112px,30vw,196px); /* header lockup, sized to the bar */
  --logo-ratio:4.303;                /* the logo asset's intrinsic ratio, 1024x238 */
  --header-h:calc(var(--s-4) * 2 + var(--logo-w-header) / var(--logo-ratio));

  /* ---- form ---- */
  --r-none:0px;
  --r-sm:2px;
  --r-pill:999px;

  /* ---- motion ---- */
  --e-out:cubic-bezier(0.16, 1, 0.3, 1);
  --e-ui:cubic-bezier(0.22, 1, 0.36, 1);
  --e-soft:cubic-bezier(.4,0,.2,1);
  --d-fast:.25s;
  --d-mid:.5s;
  --d-slow:1.2s;
  --rise:12px;
  --stagger:60ms;
}


/* ==========================================================================
   SCOPES

   A scope is a class that redefines token VALUES for its subtree. Everything
   below the scope keeps using the same token names, so no component needs to
   know which scope it is in.

   WP-10 ruling 9 — the dark scope's values used to live in dark-scope.css,
   which meant a second palette existed outside this file and the hex gate
   could never be clean. They are folded in here, unchanged.

   THE RULE FOR ANY FUTURE SCOPE
   A scope may override the value of a token that already exists at :root.
   It may NEVER introduce a colour that has no :root equivalent — that is a
   new brand colour, and a new brand colour is a brand decision, not a CSS
   one. If a scope needs a colour the root palette does not have, stop and
   ask for it to be added to :root first.

   .dark satisfies this: all nine overrides below name tokens defined at :root,
   and it adds none.
   ========================================================================== */

/* ---- .dark — the dark scope ----
   Applied to a whole page (Luxe, Make Your Own) or to a single band
   (the homepage's dark split). Nine of the root colours invert; the rest —
   --c-accent, --c-btn, --c-white, the error pair, and every type, space,
   form and motion token — deliberately do not, which is what keeps a dark
   page recognisably the same system rather than a second design.

   --c-white is absent on purpose. It is the primitive from ruling 8 and must
   stay white inside a dark scope; redefining it here would defeat its reason
   for existing. */
.dark{
  --c-bg:#221D1E;          /* dark page background   (root: #F9F4F5) */
  --c-surface:#2C2526;     /* cards, panels          (root: #FFFFFF) */
  --c-surface-2:#332C2D;   /* tinted band, image placeholders (root: #F3EAEA) */
  --c-text:#F2E9EA;        /* all body copy          (root: #3D3536) */
  --c-muted:#B0A0A0;       /* secondary copy         (root: #8A7D7E) */
  --c-line:#413738;        /* hairlines              (root: #E8DDDD) */
  --c-inactive:#584C4D;    /* borders, disabled      (root: #DDD0CB) */
  --c-dark:#1A1516;        /* the darkest ground     (root: #332C2D) */
  --c-on-dark:#F2E9EA;     /* text on a dark ground  (root: #F9F4F5) */
}
