/* Motogate tasarım token'ları — tek kaynak. */
:root {
  /* Marka */
  --color-teal: #0d3b40;
  --color-teal-dark: #092a2e;
  --color-teal-light: #1f6e74;
  --color-mint: #2fa39a;

  /* Metin & yüzey */
  --color-text: #141817;
  --color-text-muted: #5b6360;
  --color-bg: #ffffff;
  --color-surface: #f4f5f5;
  --color-surface-dark: #111716;
  --color-border: #e4e6e6;

  /* Fonksiyonel / kampanya */
  --color-accent: #f5a623;      /* amber — indirim/aciliyet */
  --color-accent-ink: #3a2600;
  --color-sale: #0d3b40;        /* indirim rozeti teal */
  --color-danger: #c0392b;
  --color-price: #35b34a;       /* açık yeşil — indirimli fiyat */

  /* Rozet paleti */
  --badge-summer: #f5a623;   /* koyu sarı — SUMMER */
  --badge-sale:   #0d3b40;   /* koyu yeşil — İNDİRİM */
  --badge-firsat: #2c302e;   /* kırık siyah — FIRSAT */
  --badge-outlet: #092a2e;
  --badge-junior: #2fa39a;
  --badge-woman:  #7a4fa3;
  --badge-vizor:  #b07d0a;   /* altın — VİZÖR HEDİYE (premium kask) */
  --badge-taksit: #0d5c63;   /* petrol teal — vade farksız taksit (güven) */
  --badge-kupon:  #c0392b;   /* kırmızı — KUPON (AEGIS ev-markası avantajı) */

  /* Tipografi */
  --font-head: "Oswald", "Anton", system-ui, sans-serif;
  --font-body: "Inter", system-ui, -apple-system, sans-serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: clamp(0.95rem, 0.9rem + 0.2vw, 1.05rem);
  --text-lg: clamp(1.1rem, 1rem + 0.4vw, 1.35rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1vw, 2.25rem);
  --text-hero: clamp(2.75rem, 1.5rem + 6vw, 7rem);
  --tracking-tight: -0.01em;
  --tracking-wide: 0.06em;

  /* Boşluk / ritim */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-section: clamp(1.5rem, 1rem + 1.6vw, 2.75rem);

  /* Yüzey biçimi */
  --radius-sm: 2px;
  --radius: 3px;
  --radius-lg: 6px;
  --shadow-sm: 0 1px 3px rgba(9, 42, 46, 0.08);
  --shadow: 0 6px 24px rgba(9, 42, 46, 0.12);

  /* Hareket */
  --dur-fast: 150ms;
  --dur: 280ms;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);

  /* Layout */
  --container: 1680px;
  --header-h: 60px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}