/* =============================================================
   FACKINER'S EVENTWERK — DESIGN TOKENS

   GOLDEN MASTER RULE
   The two .dc.html Golden Masters are the sole visual and geometric
   source of truth:
     design/full-home-page/Fackiners-Full-Homepage.html          (1440)
     design/full-home-page/Fackerins-Full-Homepage--Mobile.html  (390)

   Every size below is pinned so that it evaluates to the Golden
   Master's exact value at BOTH approved endpoints — 390px and 1440px —
   and interpolates linearly between them. Nothing here is an
   interpretation; each value is transcribed from an inline style in
   the Golden Master.

   Naming follows docs/design-system.md (--fkn-*). There is exactly one
   token system.
   ============================================================= */

:root {
  /* ---------- Color · surfaces (Golden Master literals) ---------- */
  --fkn-night: #14110C;
  --fkn-coal: #24211C;
  --fkn-plaque: #0B0A08;
  --fkn-ivory: #F4F0E6;
  --fkn-paper: #FAF8F2;
  --fkn-bg-subtle: #EEE9DE;
  --fkn-passepartout: #FFFFFF;

  /* ---------- Color · text on light ---------- */
  --fkn-ink: #1C1812;
  --fkn-text-2: #3A342A;       /* hero lead, section intros */
  --fkn-text-3: #4A4336;       /* entry copy, step copy */
  --fkn-stone-deep: #6E6553;   /* region line, coordinates, partner caption */
  --fkn-stone: #8B8272;        /* production stamps, captions, note header */

  /* ---------- Color · text on night ---------- */
  --fkn-text-dark: #F0EBDD;
  --fkn-text-dark-hi: #F5F1E6;
  --fkn-text-dark-2: #B7AE9C;
  --fkn-meta-dark: #9C927D;

  /* ---------- Color · gold ---------- */
  --fkn-gold-deep: #8A671F;    /* gold text on light */
  --fkn-gold: #B98A2E;         /* gold lines, ticks, separators on light */
  --fkn-gold-light: #D9B45C;   /* gold on night */
  --fkn-gold-light-0: rgba(217, 180, 92, 0);

  /* ---------- Borders ---------- */
  --fkn-border: #E2DCCD;
  --fkn-border-strong: #D8D1C0;
  --fkn-border-dark: rgba(240, 235, 221, 0.14);
  --fkn-border-gold-soft: rgba(217, 180, 92, 0.5);
  --fkn-plaque-border: rgba(240, 235, 221, 0.1);
  --fkn-passmark: rgba(28, 24, 18, 0.4);
  --fkn-werk: rgba(28, 24, 18, 0.05);

  --fkn-focus: var(--fkn-gold-deep);

  /* ---------- Form validation (not in the Golden Master) ---------- */
  --fkn-error: #8A2417;
  --fkn-error-border: #9B2C1C;

  /* ---------- Typography families — LOCKED ---------- */
  --fkn-font-display: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  --fkn-font-body: "Figtree", "Helvetica Neue", Arial, sans-serif;
  --fkn-font-hand: "Caveat", "Segoe Script", cursive;
  --fkn-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* ---------- Type scale · exact at 390 and at 1440 ----------
     Read as: clamp(<mobile GM>, <linear>, <desktop GM>) */
  --fkn-fs-eyebrow: clamp(10.5px, 9.9429px + 0.1429vw, 12px);
  --fkn-fs-meta: clamp(10.5px, 10.3143px + 0.0476vw, 11px);
  --fkn-fs-stamp: clamp(9.5px, 9.3143px + 0.0476vw, 10px);
  --fkn-fs-display: clamp(40px, 27.3714px + 3.2381vw, 74px);
  --fkn-fs-lead: clamp(16.5px, 15.5714px + 0.2381vw, 19px);
  --fkn-fs-hand: clamp(20px, 18.5143px + 0.381vw, 24px);
  --fkn-fs-hand-note: 21px;
  --fkn-fs-promise: clamp(33px, 22.9714px + 2.5714vw, 60px);
  --fkn-fs-promise-label: clamp(10.5px, 10.1286px + 0.0952vw, 11.5px);
  --fkn-fs-promise-quote: clamp(15.5px, 14.9429px + 0.1429vw, 17px);
  --fkn-fs-h2-section: clamp(28px, 23.5429px + 1.1429vw, 40px);
  --fkn-fs-intro: clamp(15px, 13.8857px + 0.2857vw, 18px);
  --fkn-fs-time: clamp(17px, 15.1429px + 0.4762vw, 22px);
  --fkn-fs-station: clamp(19px, 16.7714px + 0.5714vw, 25px);
  --fkn-fs-entry: clamp(14.5px, 14.1286px + 0.0952vw, 15.5px);
  --fkn-fs-note-body: clamp(13.5px, 13.3143px + 0.0476vw, 14px);
  --fkn-fs-foot-note: clamp(14px, 13.6286px + 0.0952vw, 15px);
  --fkn-fs-cta: 15px;
  --fkn-fs-h2-network: clamp(26px, 23.7714px + 0.5714vw, 32px);
  --fkn-fs-stamp-label: clamp(9.5px, 9.1286px + 0.0952vw, 10.5px);
  --fkn-fs-partner-caption: clamp(12px, 13.3714px - 0.0952vw, 13px);
  --fkn-fs-centre-name: clamp(14px, 13.6286px + 0.0952vw, 15px);
  --fkn-fs-centre-meta: clamp(9.5px, 9.3143px + 0.0476vw, 10px);
  --fkn-fs-specialists: clamp(11px, 10.6286px + 0.0952vw, 12px);
  --fkn-fs-occasion: clamp(31px, 25.4286px + 1.4286vw, 46px);
  --fkn-fs-werk: clamp(120px, 82.8571px + 9.5238vw, 220px);
  --fkn-fs-turn: clamp(19px, 17.1429px + 0.4762vw, 24px);
  --fkn-fs-dim-marker: clamp(24px, 20.2857px + 0.9524vw, 34px);
  --fkn-fs-dim-note: clamp(14.5px, 13.9429px + 0.1429vw, 16px);
  --fkn-fs-place: clamp(9.5px, 9.1286px + 0.0952vw, 10.5px);
  --fkn-fs-quote: clamp(21px, 17.6571px + 0.8571vw, 30px);
  --fkn-fs-voice-flag: clamp(10.5px, 9.9429px + 0.1429vw, 12px);
  --fkn-fs-gesture: clamp(15px, 14.2571px + 0.1905vw, 17px);
  --fkn-fs-step-index: clamp(15px, 14.2571px + 0.1905vw, 17px);
  --fkn-fs-step-title: clamp(18px, 17.6286px + 0.0952vw, 19px);
  --fkn-fs-step-body: 14.5px;
  --fkn-fs-region: clamp(14px, 13.6286px + 0.0952vw, 15px);
  --fkn-fs-region-coords: clamp(10px, 9.6286px + 0.0952vw, 11px);
  --fkn-fs-h2-invitation: clamp(32px, 26.8px + 1.3333vw, 46px);
  --fkn-fs-invitation-lead: clamp(15.5px, 14.9429px + 0.1429vw, 17px);
  --fkn-fs-signature: clamp(26px, 24.5143px + 0.381vw, 30px);
  --fkn-fs-footer-brandline: 13px;
  --fkn-fs-footer-title: clamp(10.5px, 10.3143px + 0.0476vw, 11px);
  --fkn-fs-footer-nav: clamp(14px, 15.3714px - 0.0952vw, 15px);
  --fkn-fs-footer-item: 14px;
  --fkn-fs-footer-meta: clamp(10px, 9.6286px + 0.0952vw, 11px);

  /* ---------- Line heights · Golden Master MOBILE endpoint ----------
     Overridden to the desktop endpoint at the composition switch. */
  --fkn-lh-display: 1.04;
  --fkn-lh-promise: 1.18;
  --fkn-lh-h2-section: 1.15;
  --fkn-lh-h2-network: 1.15;
  --fkn-lh-h2-invitation: 1.15;
  --fkn-lh-station: 1.25;
  --fkn-lh-occasion: 1.12;
  --fkn-lh-turn: 1.5;
  --fkn-lh-dim-marker: 1.3;
  --fkn-lh-quote: 1.45;
  --fkn-lh-lead: 1.6;
  --fkn-lh-intro: 1.6;

  /* ---------- Letter spacing · Golden Master MOBILE endpoint ---------- */
  --fkn-ls-eyebrow: 0.18em;
  --fkn-ls-display: -0.028em;
  --fkn-ls-stamp: 0.1em;
  --fkn-ls-coords: 0.06em;
  --fkn-ls-promise-label: 0.16em;
  --fkn-ls-stamp-label: 0.16em;
  --fkn-ls-partner-caption: 0em;
  --fkn-ls-centre-meta: 0.14em;
  --fkn-ls-specialists: 0.12em;
  --fkn-ls-place: 0.1em;
  --fkn-ls-voice-flag: 0.12em;
  --fkn-ls-footer-title: 0.16em;
  --fkn-ls-region-coords: 0.08em;

  /* ---------- Spacing ----------
     The complete 11-step scale from docs/design-system.md §5 is kept
     intact so the documented system and the code stay in step, even
     where a step is not currently referenced. */
  --fkn-space-1: 4px;
  --fkn-space-2: 8px;
  --fkn-space-3: 12px;
  --fkn-space-4: 16px;
  --fkn-space-5: 24px;
  --fkn-space-6: 32px;
  --fkn-space-7: 48px;
  --fkn-space-8: 64px;
  --fkn-space-9: 96px;
  --fkn-space-10: 128px;
  --fkn-space-11: 160px;

  /* ---------- Layout ----------
     The Golden Master desktop artboard is exactly 1440 wide with a
     64px leading gutter column and a 24px column gap. Below 1440 the
     artboard scales proportionally; at and above 1440 it is frozen and
     centred, so the approved endpoint renders 1:1.
     Mobile uses the Golden Master's plain 20px page padding. */
  --fkn-artboard: 1440px;
  --fkn-pad-x: 20px;                  /* GM mobile: padding 0 20px */
  --fkn-gutter: 20px;                 /* leading gutter column */
  --fkn-gap: 16px;                    /* column gap */

  /* ---------- Radius ---------- */
  --fkn-radius-0: 0;
  --fkn-radius-xs: 2px;

  /* ---------- Rules ---------- */
  --fkn-rule: 1px;
  --fkn-rule-thread: 1px;
  --fkn-rule-underline: 1.5px;
  --fkn-rule-centre: 1.5px;

  /* ---------- Motion (docs/design-freeze.md interaction inventory) ---------- */
  --fkn-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --fkn-duration-fast: 180ms;
  --fkn-duration-base: 260ms;
  --fkn-duration-reveal: 700ms;
  --fkn-duration-draw: 600ms;

  /* ---------- Dimming Moment (Signature C) ----------
     GM mobile band is 440px tall, GM desktop 760px. */
  --fkn-dim-distance: 440px;
  --fkn-dim: 1;
  --fkn-dim-run: linear-gradient(
    180deg,
    #f4f0e6 0%,
    #e4ddcb 14%,
    #a99e88 38%,
    #4a4336 60%,
    #231e16 80%,
    #14110c 100%
  );

  /* ---------- Header (GM: 64px mobile, 96px desktop) ---------- */
  --fkn-header-h: 64px;
  --fkn-logo-h: 26px;
  /* The footer plaque sizes its lockup independently of the header. */
  --fkn-logo-ftr-h: 26px;
  --fkn-plaque-pad: 6px 10px;

  /* ---------- Image slot heights · Golden Master literals ----------
     The Golden Master sizes every slot by explicit height, not by
     aspect ratio. Transcribed mobile → desktop. */
  --fkn-h-hero: clamp(292px, 133.0286px + 40.7619vw, 720px);
  --fkn-h-ros-bar: clamp(210px, 176.5714px + 8.5714vw, 300px);
  --fkn-h-ros-pass: 260px;
  --fkn-h-moment-wide: clamp(300px, 188.5714px + 28.5714vw, 600px);
  --fkn-h-moment-portrait: clamp(400px, 340.5714px + 15.2381vw, 560px);
  --fkn-h-moment-detail: clamp(300px, 255.4286px + 11.4286vw, 420px);

  /* ---------- Section padding · Golden Master literals ---------- */
  --fkn-pad-hero-top: clamp(44px, 27.6571px + 4.1905vw, 88px);
  --fkn-pad-s02-top: clamp(72px, 57.1429px + 3.8095vw, 112px);
  --fkn-pad-s02-bottom: clamp(64px, 49.1429px + 3.8095vw, 104px);
  --fkn-pad-s03-top: clamp(56px, 41.1429px + 3.8095vw, 96px);
  --fkn-pad-s03-bottom: clamp(64px, 52.1143px + 3.0476vw, 96px);
  --fkn-pad-s04-y: clamp(56px, 50.0571px + 1.5238vw, 72px);
  --fkn-pad-s05-top: clamp(88px, 64.9714px + 5.9048vw, 150px);
  --fkn-pad-s05-bottom: clamp(84px, 63.2px + 5.3333vw, 140px);
  --fkn-pad-s07-bottom: clamp(80px, 71.0857px + 2.2857vw, 104px);
  --fkn-pad-s08-top: clamp(72px, 51.2px + 5.3333vw, 128px);
  --fkn-pad-s08-bottom: clamp(56px, 41.1429px + 3.8095vw, 96px);
  --fkn-pad-s09-top: clamp(72px, 60.1143px + 3.0476vw, 104px);
  --fkn-pad-s09-bottom: clamp(56px, 44.1143px + 3.0476vw, 88px);
  --fkn-pad-ftr-top: clamp(44px, 39.5429px + 1.1429vw, 56px);
  --fkn-pad-ftr-bottom: clamp(36px, 34.5143px + 0.381vw, 40px);

  /* ---------- Component-local properties ----------
     Set per element or per breakpoint; listed here so the full custom
     property surface is visible in one place. Mobile values shown. */
  --fkn-photo-h: 292px;              /* image slot height */
  --fkn-drift: 0px;                  /* passive image drift offset */
  --fkn-nav-gap: 36px;               /* desktop navigation spacing */
  --fkn-centre-size: 180px;          /* network centre diameter */
  --fkn-partner-h: 64px;             /* partner passe-partout height */
  --fkn-partner-pad: 10px;
  --fkn-partner-logo-h: 40px;
  --fkn-partner-logo-h-isswat: 32px;
  --fkn-note-pad-y: 16px;            /* production note paper insets */
  --fkn-note-pad-x: 18px;
  --fkn-note-head-gap: 10px;
  --fkn-note-rule-gap: 12px;
  --fkn-note-row-gap: 7px;
  --fkn-note-dash-gap: 10px;

  --fkn-shadow-overlay: 0 8px 24px rgba(20, 17, 12, 0.18);
}

/* -----------------------------------------------------------------
   Desktop composition — Golden Master 1440 endpoint.
   Line heights, tracking and layout metrics switch to the desktop
   artboard's literal values; font sizes have already interpolated to
   them via the clamps above.
   ----------------------------------------------------------------- */
@media (min-width: 1024px) {
  :root {
    --fkn-lh-display: 1;
    --fkn-lh-promise: 1.14;
    --fkn-lh-h2-section: 1.1;
    --fkn-lh-h2-network: 1.1;
    --fkn-lh-h2-invitation: 1.1;
    --fkn-lh-station: 1.2;
    --fkn-lh-occasion: 1.35;
    --fkn-lh-turn: 1.45;
    --fkn-lh-dim-marker: 1.25;
    --fkn-lh-quote: 1.4;
    --fkn-lh-lead: 1.55;
    --fkn-lh-intro: 1.55;

    --fkn-ls-eyebrow: 0.2em;
    --fkn-ls-display: -0.026em;
    --fkn-ls-stamp: 0.12em;
    --fkn-ls-coords: 0.08em;
    --fkn-ls-promise-label: 0.18em;
    --fkn-ls-stamp-label: 0.18em;
    --fkn-ls-partner-caption: 0.04em;
    --fkn-ls-centre-meta: 0.16em;
    --fkn-ls-specialists: 0.14em;
    --fkn-ls-place: 0.12em;
    --fkn-ls-voice-flag: 0.14em;
    --fkn-ls-footer-title: 0.18em;
    --fkn-ls-region-coords: 0.1em;

    /* 64 / 1440 = 4.4444vw · 24 / 1440 = 1.6667vw — proportional below
       the artboard width, frozen at the Golden Master value from 1440. */
    --fkn-pad-x: min(64px, 4.4444vw);
    --fkn-gutter: min(64px, 4.4444vw);
    --fkn-gap: min(24px, 1.6667vw);

    --fkn-dim-distance: 760px;
    --fkn-header-h: 96px;
    --fkn-logo-h: 38px;
    --fkn-logo-ftr-h: 30px;
    --fkn-plaque-pad: 9px 14px;
  }
}