/* ===========================================================
   Bufanatic Design Tokens v1.0
   Base CSS custom properties — scope to your own theme.
   =========================================================== */
:root {
  --bf-color-brand: #FFD600;
  --bf-color-ink: #000;
  --bf-color-paper: #FFF;
  --bf-color-body: #555;
  --bf-color-band: #F5F5F7;
  --bf-color-accent: #DD3333;
  --bf-color-badge: #C62828;
  --bf-font-primary: 'Montserrat', system-ui, -apple-system, sans-serif;
  --bf-font-weight-bold: 700;
  --bf-font-weight-heading: 800;
  --bf-font-style-heading: italic;
  --bf-text-transform-heading: uppercase;
  --bf-line-height-body: 1.875;
  --bf-font-h1: clamp(2.4rem, 5vw, 3.5rem);
  --bf-font-h2: clamp(1.9rem, 3.2vw, 2.5rem);
  --bf-font-h3: clamp(1.2rem, 2vw, 1.6rem);
  --bf-ls-tight: -0.02em;
  --bf-ls-normal: -0.01em;
  --bf-ls-wide: 0.04em;
  --bf-ls-wider: 0.1em;
  --bf-ls-widest: 0.12em;
  --bf-space-1: 0.25rem;
  --bf-space-2: 0.5rem;
  --bf-space-3: 0.75rem;
  --bf-space-4: 1rem;
  --bf-space-5: 1.25rem;
  --bf-space-6: 1.5rem;
  --bf-space-7: 2rem;
  --bf-space-8: 2.5rem;
  --bf-space-9: 3rem;
  --bf-space-10: 5rem;
  --bf-space-11: 6rem;
  --bf-section-pad: 5rem 0;
  --bf-max-width: 1410px;
  --bf-page-gutter: 1.5rem;
  --bf-duration-fast: 0.2s;
  --bf-duration-normal: 0.3s;
  --bf-easing-default: ease;
  --bf-radius: 0;
  --bf-shadow: none;
  --bf-skew-x: -10deg;
  --bf-border-thin: 1px solid var(--bf-color-band);
  --bf-border-medium: 2px solid var(--bf-color-ink);
  --bf-border-strong: 4px solid var(--bf-color-accent);
  --bf-form-left-border: 4px solid var(--bf-color-brand);
  --bf-focus-outline: 3px solid var(--bf-color-brand);
  --bf-focus-offset: 3px;
}