/* QDS Retail Architecture Library — client-neutral design tokens (v2, 2026-11-02).
   Spacing, radius, container and breakpoints inherit from
   qds_client_delivery_factory_v1.design_system(). Colour and type values are neutral
   placeholders; every client overrides them in its own theme file. */
:root {
  /* colour roles */
  --qr-bg: #ffffff;
  --qr-surface: #f4f4f1;
  --qr-ink: #1f1f1f;
  --qr-ink-muted: #55575a;
  --qr-rule: rgba(0,0,0,.14);
  --qr-accent: #1f1f1f;          /* fills, large type, decoration */
  --qr-accent-ink: #ffffff;      /* text on accent fills */
  --qr-link: #1f1f1f;            /* body-size links; must pass 4.5:1 on --qr-bg */
  --qr-inverse-bg: #050505;
  --qr-inverse-ink: #ffffff;
  --qr-inverse-muted: #c8c8c4;
  --qr-alt-bg: #e9e6df;          /* third ground for section rhythm */
  --qr-alt-ink: #1f1f1f;
  --qr-focus: #3b82f6;
  --qr-notice-bg: #fff4d6;
  --qr-notice-ink: #3d2e00;
  --qr-scrim: linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.45) 45%, rgba(0,0,0,.05) 100%);
  --qr-scrim-mobile: linear-gradient(180deg, rgba(0,0,0,.1) 0%, rgba(0,0,0,.55) 45%, rgba(0,0,0,.88) 100%);

  /* type */
  --qr-font-display: Georgia, "Times New Roman", serif;
  --qr-font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --qr-display-weight: 700;
  --qr-size-xs: 0.8125rem;
  --qr-size-sm: 0.9375rem;
  --qr-size-md: 1.0625rem;
  --qr-size-lg: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);
  --qr-size-xl: clamp(2rem, 1.3rem + 2.6vw, 3.4rem);
  --qr-size-2xl: clamp(2.6rem, 1.4rem + 4.6vw, 5.4rem);
  --qr-size-3xl: clamp(3rem, 1.2rem + 6.8vw, 7.6rem);
  --qr-leading-tight: 1.02;
  --qr-leading-body: 1.62;
  --qr-track-display: -0.022em;
  --qr-track-label: .16em;

  /* spacing (factory scale 4,8,12,16,24,32,48,72 + section rhythm) */
  --qr-s1: 4px; --qr-s2: 8px; --qr-s3: 12px; --qr-s4: 16px;
  --qr-s5: 24px; --qr-s6: 32px; --qr-s7: 48px; --qr-s8: 72px;
  --qr-section: clamp(64px, 5vw + 40px, 128px);
  --qr-gutter: clamp(16px, 4vw, 56px);

  /* shape */
  --qr-radius-control: 999px;
  --qr-radius-card: 18px;
  --qr-radius-media: 0px;        /* frameless media by default */

  /* layout */
  --qr-container: min(1280px, calc(100% - 2 * var(--qr-gutter)));
  --qr-header-h: 76px;

  /* motion */
  --qr-ease: cubic-bezier(.2,.7,.2,1);
  --qr-ease-out: cubic-bezier(.16,1,.3,1);
  --qr-dur: 220ms;
  --qr-dur-slow: 900ms;
}
/* Breakpoints (documented; media queries cannot read custom properties):
   large_desktop 1440, standard_desktop 1280, tablet 768, mobile_large 430, mobile_small 320 */
@media (prefers-reduced-motion: reduce) { :root { --qr-dur: 0ms; --qr-dur-slow: 0ms; } }
