/* ==========================================================================
   BRAND TOKENS, mirrors assets/js/brand.js. Change palette/type here.
   ========================================================================== */

:root {
  /* Brand palette (from product icon) */
  --brand-primary: #2563eb;
  --brand-primary-soft: #4f7df0;
  --brand-accent: #06b6d4;
  --brand-accent-soft: #37d3e8;

  /* Dark background system, kept refined and trustworthy rather than a cold
     server-room black, so it reads welcoming to a shop owner, not just a
     developer. A faint warm undertone (not brown, just less blue-black). */
  --bg-void: #07080d;
  --bg-base: #0c0f16;
  --bg-raised: #12161f;
  --bg-panel: #161b26;
  --bg-panel-2: #1c222e;
  --hairline: rgba(160, 172, 194, 0.14);
  --hairline-strong: rgba(160, 172, 194, 0.27);

  /* Text, warmed a shade off pure blue-gray for friendlier reading */
  --ink-000: #f6f5f2;
  --ink-100: #dcdce2;
  --ink-300: #adb3c2;
  --ink-500: #7c8399;
  --ink-700: #4e5567;

  /* Signal colors, slightly warmer/friendlier than clinical status-light hues */
  --signal-ok: #3ddc9b;
  --signal-warn: #f2b23e;
  --signal-danger: #f16a72;

  /* Type. No CDNs, no Google Fonts <link>, ever, this stays a strict-CSP,
     offline-safe, zero-network-call site. Fraunces and Hanken Grotesk are
     self-hosted instead: subsetted to the exact glyphs this site uses,
     converted to woff2, and inlined as base64 data URIs in fonts.css, so
     there is still no external request, just bytes shipped with the page.
     Display copy gets Fraunces (a warm, editorial serif with real
     character, the antidote to another Playfair/Inter pairing); UI copy
     gets Hanken Grotesk (humanist, confident, a little wider than the
     default-grotesk crowd); code/data keeps a real system monospace,
     a webfont buys nothing there and only adds weight. */
  --font-display: "Fraunces Disp", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --font-sans: "Hanken Grotesk", "Charter", "Segoe UI Semibold", "Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: "SFMono-Regular", "Berkeley Mono", Consolas, "Liberation Mono", Menlo, monospace;

  /* Rhythm */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --container: 1180px;
  --edge: clamp(20px, 5vw, 64px);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 180ms;
  --dur-med: 420ms;
  --dur-slow: 900ms;
}

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