/* Röntgen — tasarım token'ları
   Kaynak: tokens/design-tokens.json ile birebir aynı değerler. */
:root {
  /* Zemin ve yüzeyler */
  --color-bg: #F2F3EF;
  --color-surface: #FFFFFF;
  --color-surface-subtle: #F7F8F5;
  --color-surface-sunken: #F0F2EC;
  --color-grid: #E2E4DE;

  /* Metin */
  --color-ink: #12161A;
  --color-ink-2: #2A3036;
  --color-text-2: #3A4148;
  --color-text-3: #454D54;
  --color-text-hint: #4D555C;
  --color-muted: #545C63;
  --color-placeholder: #6B737A;

  /* Çizgiler */
  --color-line: #D4D8D0;
  --color-line-soft: #E4E7E0;
  --color-line-faint: #EEF0EB;

  /* Vurgu ve odak */
  --color-accent: #C6F432;
  --color-focus: #3B5BDB;
  --color-focus-ring: rgba(59, 91, 219, 0.35);

  /* Koyu bölümler */
  --color-dark: #12161A;
  --color-dark-raised: #2E353C;
  --color-dark-line: #3D454C;
  --color-on-dark: #F2F3EF;
  --color-on-dark-muted: #A9B1B8;
  --color-on-dark-body: #B3BBC2;
  --color-on-dark-caption: #9AA3AB;

  /* Durum renkleri — her zaman ikon + metinle birlikte kullanılır */
  --color-critical: #B42318;
  --color-critical-bg: #FCEBE9;
  --color-warning: #8F4700;
  --color-warning-bg: #FFF0DB;
  --color-warning-line: #F1CF9E;
  --color-pass: #1F4FD1;
  --color-pass-bg: #E7EDFF;

  /* Core Web Vitals ölçek bantları */
  --color-vital-good: #A9BDF7;
  --color-vital-ni: #F4C27E;
  --color-vital-poor: #F0A79E;

  /* Arama sonucu önizlemesi */
  --color-serp-link: #1F3FBF;
  --color-serp-site: #202124;
  --color-serp-text: #4D5156;

  /* Yazı tipleri */
  --font-display: 'Bricolage Grotesque', 'Helvetica Neue', Arial, sans-serif;
  --font-body: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;

  /* Köşe yarıçapları */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 14px;
  --radius-2xl: 18px;
  --radius-3xl: 28px;
  --radius-pill: 999px;

  /* Kenarlık ve gölgeler (ofsetli, bulanıksız gölge markanın imzası) */
  --border-strong: 1.5px solid var(--color-ink);
  --border-soft: 1px solid var(--color-line);
  --shadow-offset-lg: 12px 14px 0 var(--color-ink);
  --shadow-offset-sm: 4px 4px 0 var(--color-ink);

  /* Yerleşim */
  --container-landing: 1240px;
  --container-report: 1320px;
  --gutter-landing: clamp(16px, 4vw, 40px);
  --gutter-report: clamp(16px, 3vw, 32px);

  /* Hareket */
  --ease-press: 0.12s ease;
  --scan-duration: 3.4s;
  --scan-easing: cubic-bezier(0.65, 0, 0.35, 1);
}