/* Proxima marka token'ları. Tek kaynak: tokens.json (elle senkron tutulur). */

@font-face {
  font-family: "Bricolage Grotesque";
  src: url("fonts/web/BricolageGrotesque-Variable.woff2") format("woff2");
  font-weight: 200 800;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Sans";
  src: url("fonts/web/InstrumentSans-Variable.woff2") format("woff2");
  font-weight: 400 700;
  font-display: swap;
}

:root {
  /* Renkler (Palet 3: Grafit ve turkuaz) */
  --color-grafit: #141A1F;
  --color-turkuaz: #12B5A9;  /* vurgu/nokta; açık zeminde yazı veya buton rengi olarak kullanma */
  --color-derin: #0B7D74;    /* açık zeminde buton ve vurgulu metin */
  --color-kagit: #F5F6F4;
  --color-beyaz: #FFFFFF;

  /* Anlamsal roller */
  --bg: var(--color-beyaz);
  --bg-alt: var(--color-kagit);
  --bg-inverse: var(--color-grafit);
  --text: var(--color-grafit);
  --text-inverse: var(--color-beyaz);
  --accent: var(--color-derin);
  --accent-on-dark: var(--color-turkuaz);
  --border: color-mix(in srgb, var(--color-grafit) 14%, transparent);
  --muted: color-mix(in srgb, var(--color-grafit) 68%, var(--color-beyaz));

  /* Yazı tipleri */
  --font-display: "Bricolage Grotesque", system-ui, sans-serif;
  --font-body: "Instrument Sans", system-ui, sans-serif;

  /* Köşe yarıçapları */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;

  /* Boşluk ölçeği */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
}