/* ==========================================================================
   Design tokens — Anna City Armoury
   "Range catalogue", white theme: white + warm paper bands, one blaze-orange signal colour.
   ========================================================================== */

:root {
  /* Fixed colours (do not change with theme) */
  --black: #121310;
  --white: #ffffff;

  /* Surfaces — white theme. "ink" = main page surface, "bone" = alternate band */
  --ink: #ffffff;
  --ink-2: #f6f5f1;
  --ink-3: #ecebe5;
  --bone: #f1eee6;
  --bone-2: #e9e5da;
  --bone-3: #ddd8ca;

  /* Text */
  --on-ink: #121310;
  --on-ink-dim: #55554b;
  --on-ink-faint: #8a897f;
  --on-bone: #121310;
  --on-bone-dim: #55554b;

  /* Signal */
  --signal: #ff4d1c;
  --signal-deep: #d93a0d;
  --olive: #8a8f5c;

  /* Rules */
  --rule-ink: rgba(18, 19, 16, 0.12);
  --rule-ink-strong: rgba(18, 19, 16, 0.32);
  --rule-bone: rgba(18, 19, 16, 0.16);
  --rule-bone-strong: rgba(18, 19, 16, 0.4);

  /* Status */
  --status-available: #3f8a2a;
  --status-limited: #c1840c;
  --status-out: #d9534f;

  /* Type */
  --font-display: "Big Shoulders Display", "Arial Narrow", sans-serif;
  --font-body: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;

  --fs-mega: clamp(4rem, 13.5vw, 13rem);
  --fs-hero: clamp(3.4rem, 9.2vw, 9.4rem);
  --fs-h1: clamp(3rem, 7vw, 6.8rem);
  --fs-h2: clamp(2.4rem, 5vw, 4.6rem);
  --fs-h3: clamp(1.5rem, 2.2vw, 2rem);
  --fs-lead: clamp(1.15rem, 1.6vw, 1.45rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-mono: 0.72rem;

  /* Layout */
  --gutter: clamp(1rem, 3vw, 2.5rem);
  --container-max: 1440px;
  --section-pad: clamp(5rem, 11vw, 10rem);
  --header-h: 72px;

  /* Shape — soft, rounded corners throughout */
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-xl: clamp(24px, 3vw, 40px);
  --r-band: clamp(28px, 4vw, 64px);
  --r-pill: 999px;

  /* Elevation — warm, diffuse shadows */
  --shadow-sm: 0 1px 2px rgba(60, 45, 20, 0.06), 0 2px 8px rgba(60, 45, 20, 0.05);
  --shadow-md: 0 4px 12px rgba(60, 45, 20, 0.07), 0 12px 32px rgba(60, 45, 20, 0.08);
  --shadow-lg: 0 10px 24px rgba(60, 45, 20, 0.08), 0 28px 64px rgba(60, 45, 20, 0.14);
  --shadow-signal: 0 10px 30px rgba(255, 77, 28, 0.32);

  /* Motion */
  --ease-out: cubic-bezier(0.19, 1, 0.22, 1);
  --ease-inout: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-soft: cubic-bezier(0.45, 0, 0.25, 1);
  --t-fast: 0.25s var(--ease-out);
  --t-base: 0.6s var(--ease-out);
  --t-slow: 1.1s var(--ease-out);
}