/* 00-tokens.css
   Design tokens (colors, typography, spacing, radii, shadows)
   Goal: single source of truth for the whole site.
*/

:root{
  /* Colors */
  --bg: #f6f7fb;
  --surface: rgba(255,255,255,0.78);
  --surface-solid: rgba(255,255,255,0.92);
  --ink: #0f1115;
  --muted: rgba(15,17,21,0.68);
  --border: rgba(15,17,21,0.12);
  --border-strong: rgba(15,17,21,0.18);
  --accent: #ed4624;

  /* Typography */
  --font-sans: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  --font-brand: "Montserrat", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial;

  /* Shadows / blur */
  --shadow: 0 10px 30px rgba(15,17,21,0.10);
  --shadow-soft: 0 2px 10px rgba(15,17,21,0.08);
  --blur: 16px;

  /* Radii */
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 18px;

  /* Layout */
  --container: 1200px;

  /* Used by .with-header-offset and scroll-margin */
  --header-offset: 37px;

  /* Motion */
  --ease: 180ms ease;
}