/* RK Lights design tokens — v3 "Bright Gallery", Version A (Ink). Approved 20 Oct 2026.
   Source of truth for every colour, size, space, radius, shadow and duration.
   Layer 1 (editable in RK Store → Settings → Brand): --color-brand, --color-brand-text, --color-ink, --color-surface.
   Everything else is fixed. Do not add raw values in component CSS: add a token here first. */

/* Metric-matched fallback for Lexend Deca 400 (docs/09 §2 CLS): Arial scaled to Lexend's average width and line
   metrics, so text does not shift when the web font swaps in. Computed with fontTools from the self-hosted
   lexend-deca-latin-400 file and Arial (average advance of English text; hhea ascent 1000, descent 250, gap 0). */
@font-face {
  font-family: 'Lexend Deca Fallback';
  src: local('Arial'), local('ArialMT'), local('Helvetica'), local('Liberation Sans');
  size-adjust: 110.55%;
  ascent-override: 90.46%;
  descent-override: 22.61%;
  line-gap-override: 0%;
}
:root {

  /* Colour: ground and ink */
  --color-bg: #FFFFFF;
  --color-surface: #F7F5F1;  /* L1 editable */
  --color-surface-2: #EFEBE4;
  --color-plate: #F2EFEA;
  --color-ink: #1A1917;  /* L1 editable */
  --color-ink-2: #4A4743;
  --color-ink-3: #6B675F;
  --color-line: #E7E3DC;
  --color-line-strong: #CFC9BF;
  --color-line-input: #8A847A;

  /* Colour: brand and status */
  --color-brand: #B8892F;  /* L1 editable */
  --color-brand-text: #845F1C;  /* L1 editable */
  --color-brand-soft: #F6EEDC;
  --color-offer: #1E7A4C;
  --color-alert: #B3261E;
  --color-on-ink: #FFFFFF;
  --color-on-ink-2: #C9C4BB;
  --color-on-photo: #FFFFFF;
  --color-scrim: rgba(17, 16, 14, 0.62);
  --color-scrim-soft: rgba(17, 16, 14, 0.38);
  --color-overlay: rgba(17, 16, 14, 0.44);
  --color-focus: #1A1917;
  --color-focus-on-dark: #FFFFFF;
  --color-offer-soft: #EAF4EE;
  --color-offer-ink: #1B5E3B;
  --color-alert-soft: #FBECEA;
  --color-alert-ink: #8C1D17;
  --color-on-photo-line: rgba(255, 255, 255, 0.6);
  --color-on-photo-track: rgba(255, 255, 255, 0.35);
  --color-on-dark-hover: rgba(255, 255, 255, 0.08);
  --color-on-dark-line: rgba(255, 255, 255, 0.12);
  --color-swatch-edge: rgba(0, 0, 0, 0.14);

  /* Type */
  --font: 'Lexend Deca', 'Lexend Deca Fallback', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fs-display: clamp(2.5rem, 1.4rem + 3.6vw, 4.5rem);
  --fs-h2: clamp(1.75rem, 1.25rem + 1.6vw, 2.75rem);
  --fs-h3: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
  --fs-title: 1.0625rem;
  --fs-body-lg: 1.125rem;
  --fs-body: 1rem;
  --fs-sm: 0.875rem;
  --fs-xs: 0.8125rem;
  --fs-eyebrow: 0.75rem;
  --fs-2xs: 0.6875rem;
  --fs-3xs: 0.625rem;
  --fs-wordmark: 1.375rem;
  --fs-wordmark-sm: 1.125rem;
  --fs-price-lg: 1.625rem;
  --lh-tight: 1.08;
  --lh-heading: 1.2;
  --lh-body: 1.6;
  --lh-ui: 1.35;
  --ls-display: -0.035em;
  --ls-heading: -0.02em;
  --ls-eyebrow: 0.14em;
  --ls-wordmark: 0.22em;

  /* Space (4-pt) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-section: clamp(4rem, 2.5rem + 5vw, 7.5rem);
  --gutter: clamp(1rem, 0.4rem + 3vw, 3rem);
  --container: 88rem;
  --measure: 36rem;

  /* Shape and depth */
  --radius-focus: 2px;
  --radius-xs: 3px;
  --radius-media: 4px;
  --radius-control: 6px;
  --radius-pill: 999px;
  --border: 1px;
  --shadow-float: 0 12px 32px -8px rgba(26, 25, 23, 0.22);
  --shadow-panel: 0 24px 64px -16px rgba(26, 25, 23, 0.28);

  /* Sizes */
  --control-sm: 2.25rem;
  --control-md: 2.75rem;
  --control-lg: 3.25rem;
  --icon: 1.25rem;
  --icon-sm: 1rem;
  --header-h: 4.5rem;
  --nav-h: 3rem;

  /* Motion */
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --dur-fast: 150ms;
  --dur: 250ms;
  --dur-slow: 600ms;
  --dur-drift: 8s;
  --hero-interval: 7000ms;
  color-scheme: light;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0.01ms; --dur: 0.01ms; --dur-slow: 0.01ms; }
}