/* Framecore Digital — Tier 3 product override.
 *
 * AGENTS.md: this file contains custom-property declarations and NOTHING else.
 * No selectors targeting Spectrum component classes, no !important, no layout,
 * no media queries re-specifying component internals. Page layout lives in
 * site.css; that is product code, not an override.
 *
 * Load order matters: vendor tokens first, then this file.
 *
 * Layering (AGENTS.md token discipline, one-way: primitives -> semantic -> component):
 *   1. --fc-*        Framecore primitives. The only place a raw value is typed.
 *   2. --spectrum-*  Adobe's semantic layer, re-pointed at our primitives.
 * Nothing here reads a component token, and no component reads an --fc-* directly.
 */

:root {
  /* ---- 1. Framecore primitives ------------------------------------------- */

  /* PALETTE: black, white, gold.
     The page ALTERNATES ground - sections run black, white, black - so there is no single
     "background colour" any more. A section declares which ground it is and the ink tokens
     follow it; see .fc-ink / .fc-paper in site.css.

     GOLD is the only emphasis, and it is a PATTERN rather than a flat colour: metal reads as
     metal because a light ramp crosses it. Five stops, dark -> highlight -> dark.

     CONTRAST, load-bearing. Mid gold on white measures roughly 1.9:1, far under the 4.5:1
     floor, so gold is NEVER body text on paper. On black it clears; on white it appears only
     as fill, rule or edge, with black text over it. */

  --fc-black: #0a0a0a;
  --fc-white: #fafafa;

  --fc-gold-100: #7a5c1e;
  --fc-gold-200: #b8892b;
  --fc-gold-300: #d9ae3c;
  --fc-gold-400: #e8c66a;
  --fc-gold-500: #fff3c4;

  /* The pattern itself, raked across the box so the sheen crosses a form rather than
     running with it. Used as a background, and as a text fill via background-clip. */
  --fc-gold-pattern: linear-gradient(
      105deg,
      var(--fc-gold-100) 0%,
      var(--fc-gold-200) 18%,
      var(--fc-gold-400) 38%,
      var(--fc-gold-500) 52%,
      var(--fc-gold-300) 68%,
      var(--fc-gold-100) 100%);

  /* The same metal, darkened, for use ON WHITE. The light rake above disappears on paper;
     this one keeps the highlight below mid so it still reads as metal and still passes:
     --fc-gold-100 on --fc-white measures about 5.9:1, over the 4.5:1 floor for body text. */
  --fc-gold-pattern-paper: linear-gradient(
      105deg,
      #5d4517 0%,
      var(--fc-gold-100) 22%,
      var(--fc-gold-200) 48%,
      #a87d27 70%,
      #6b501b 100%);

  /* A hairline of the same metal, for rules and edges. */
  --fc-gold-rule: linear-gradient(
      90deg,
      var(--fc-gold-200) 0%,
      var(--fc-gold-500) 45%,
      var(--fc-gold-300) 70%,
      var(--fc-gold-100) 100%);

  /* Typeface. Adobe Clean must not ship: it is licensed for use with Adobe products only.
     Two token layers are involved and BOTH have to move — overriding only the first is the
     trap, because it leaves the stack reading
       adobe-clean, <ours>, "Source Sans Pro", ...
     i.e. Adobe Clean still FIRST. The page then renders correctly on a machine where that
     face is absent and silently loads it on any machine with Adobe Fonts active, which is
     exactly the licensing case being avoided.
       ...-font-family        the family Spectrum interpolates INTO its stack
       ...-font-family-stack  the resolved list components actually read (global-vars.css:659) */
  --fc-font-sans:
    ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu,
    "Helvetica Neue", Arial, sans-serif;
  --fc-font-serif:
    ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --fc-font-mono:
    ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
    "Liberation Mono", monospace;

  /* ---- 2. Framecore semantics -------------------------------------------- */
  /* Named by role. These are the DEFAULTS (black ground); .fc-paper re-declares the same
     names for a white ground, and everything inside simply inherits whichever set applies. */

  --fc-surface-page: var(--fc-black);
  --fc-surface-raised: #141414;
  --fc-surface-sunken: #050505;
  --fc-border-hairline: #2a2a2a;

  --fc-ink-strong: var(--fc-white);
  --fc-ink-body: #d6d6d6;
  --fc-ink-muted: #9a9a9a;

  /* WAITING INK. The opening screen sets its words in this until the mark has finished
     assembling, then brings them up to their real colour - so the type reads as held back
     rather than as arriving twice.

     CONTRAST, AND THE TRADE IT MAKES. 3.05:1 on --fc-black. That clears the 3:1 floor for
     large text, which the wordmark is, but sits under the 4.5:1 body-text floor that the
     statement lines below it would normally answer to. The state is deliberate and lasts
     2.80s, and both resolve to fully compliant ink - the name to 18.97:1, the statement to
     13.62:1 - so nothing a reader has to actually read stays here. Raising this to #767676
     (4.36:1) or #808080 (5.01:1) walks that back if the hold is ever made longer, and either
     is a one-line change; the grey simply reads less held-back. */
  --fc-ink-waiting: #5e5e5e;

  /* Emphasis. On a black ground this is the metal; .fc-paper swaps it for black. */
  --fc-ink-accent: var(--fc-gold-400);

  /* THE TRIPTYCH. The Design question marks three words - libère / égaux / fraternisation -
     against liberté, égalité, fraternité, so the emphasis IS the tricolore. They are struck
     in the SAME metal as the gold: the identical 105deg rake and the identical stop
     positions, so all four patterns on the page catch the light from one direction and read
     as one material in three alloys rather than as three flat colours.

     TWO CONSTRAINTS SHAPED THE RAMPS, and both bite harder than they do for the gold:
       - these run at body size (~1rem), not at the 3rem of a section title, so no stop may
         sit at a contrast a small glyph cannot carry. Every stop below clears 4.5:1 on
         --fc-black; the flag's own #0055A4 measures 2.67:1 and was never usable here.
       - a gradient needs range or it stops reading as metal. Each ramp keeps a 2.8x spread
         between its darkest and brightest stop, which is enough sheen at this size.
     Blue 5.04 -> 14.02:1, red 5.05 -> 14.55:1, platinum 7.08 -> 19.80:1.

     The middle term is platinum rather than flat white: the flag's white, but struck so it
     belongs to the same set as the two beside it. */
  --fc-blue-100: #4a80d6;
  --fc-blue-200: #5f93e6;
  --fc-blue-300: #6d9cee;
  --fc-blue-400: #86b2f5;
  --fc-blue-500: #c2dbff;

  --fc-red-100: #d4585f;
  --fc-red-200: #e56f76;
  --fc-red-300: #e07c82;
  --fc-red-400: #f2939a;
  --fc-red-500: #ffd2d5;

  /* Laiton/platine, not silver. A neutral grey middle term sat outside the set - the two
     words beside it are metal and the gold is metal, and only this one was cold. Warming it
     to a pale brass keeps it reading as the flag's white while putting it in the same alloy
     family. Kept lighter than --fc-gold-400 so it stays the quiet term and never competes
     with the gold accent. 8.80 -> 18.69:1 on --fc-black. */
  --fc-platine-100: #b8ac8e;
  --fc-platine-200: #d0c4a6;
  --fc-platine-300: #c4b89a;
  --fc-platine-400: #e6dcc4;
  --fc-platine-500: #fff8e6;

  --fc-blue-pattern: linear-gradient(
      105deg,
      var(--fc-blue-100) 0%,
      var(--fc-blue-200) 18%,
      var(--fc-blue-400) 38%,
      var(--fc-blue-500) 52%,
      var(--fc-blue-300) 68%,
      var(--fc-blue-100) 100%);

  --fc-red-pattern: linear-gradient(
      105deg,
      var(--fc-red-100) 0%,
      var(--fc-red-200) 18%,
      var(--fc-red-400) 38%,
      var(--fc-red-500) 52%,
      var(--fc-red-300) 68%,
      var(--fc-red-100) 100%);

  --fc-platine-pattern: linear-gradient(
      105deg,
      var(--fc-platine-100) 0%,
      var(--fc-platine-200) 18%,
      var(--fc-platine-400) 38%,
      var(--fc-platine-500) 52%,
      var(--fc-platine-300) 68%,
      var(--fc-platine-100) 100%);

  /* Flat fallbacks. A browser without background-clip:text gets these instead of the
     patterns - never `color: transparent`, which would erase the words. */
  --fc-liberte: var(--fc-blue-200);
  --fc-egalite: var(--fc-white);
  --fc-fraternite: var(--fc-red-200);

  /* THE SPLIT: 1/3 rail, 2/3 content. Typed once, read by the stage and its media query. */
  --fc-rail: 33.3333%;

  /* Page rhythm. Spectrum's spacing scale stops at 96px, which is tight for full-page
     section breaks, so the page-level steps derive from its top step rather than being
     typed independently. */
  --fc-space-section: calc(var(--spectrum-spacing-1000) * 1.5);
  --fc-space-section-tight: var(--spectrum-spacing-1000);
  --fc-space-gutter: var(--spectrum-spacing-400);
  --fc-measure: 64ch;
  --fc-wrap: 76rem;

  /* ---- 3. Spectrum semantics, re-pointed --------------------------------- */

  --spectrum-sans-serif-font-family: var(--fc-font-sans);
  --spectrum-serif-font-family: var(--fc-font-serif);
  --spectrum-cjk-font-family: var(--fc-font-sans);
  --spectrum-code-font-family: var(--fc-font-mono);

  --spectrum-sans-font-family-stack: var(--fc-font-sans);
  --spectrum-serif-font-family-stack: var(--fc-font-serif);
  --spectrum-cjk-font-family-stack: var(--fc-font-sans);
  --spectrum-code-font-family-stack: var(--fc-font-mono);

  /* The dark theme resolves every accent surface through steps 700/800, so re-pointing the
     ramp moves every accent-bearing component at once. Gold now, not a neutral. */
  --spectrum-accent-color-600: var(--fc-gold-200);
  --spectrum-accent-color-700: var(--fc-gold-300);
  --spectrum-accent-color-800: var(--fc-gold-300);
  --spectrum-accent-color-900: var(--fc-gold-400);
  --spectrum-accent-color-1000: var(--fc-gold-400);
  --spectrum-accent-color-1100: var(--fc-gold-500);

  /* Focus indicator: the one affordance that must never read as decoration. */
  --spectrum-focus-indicator-color: var(--fc-gold-400);

  /* Label colour on FILLED buttons.
     Spectrum pairs a filled accent button with `var(--spectrum-white)` as its label, which
     assumes a saturated mid-dark accent. Ours is gold and light, so the label must invert to
     black or it would read near-white on near-white.
     Blast radius was checked against the vendored set: of the 21 references to
     --spectrum-white, 12 are exactly these filled-button labels, 4 are `staticBlack` button
     labels, and the rest are `static-white-text-color`, the opacity checkerboard and the
     colour-loupe border. This site ships none of those, so nothing else moves.
     WARNING: add a `--staticBlack` button, a colour loupe, or anything reading
     --spectrum-static-white-text-color and it inherits this inversion and is wrong. At that
     point this belongs behind a per-component --mod-* instead. */
  --spectrum-white: var(--fc-black);
}