/* Sönmez v2 ortak tokenlar. Renkler A "Tek Hat"tan, yazı C "Saha"dan (Schibsted Grotesk).
   site.html ve portal.html bu dosyayı kullanır; sayfaya özel değerler sayfanın kendi <style>'ında. */
@import url("https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:wght@400;500;600;700;800&display=swap");

/* ₺ düzeltmesi: Schibsted Grotesk U+20BA'yı ₤/£ gibi çiziyor. Yalnız bu karakter sistem yazısından gelir
   (unicode-range); geri kalan her şey Schibsted. --f ailesinin başında "Lira" var. */
@font-face{font-family:"Lira";src:local("Segoe UI"),local("SegoeUI"),local("Helvetica Neue"),local("Roboto"),local("Arial");font-weight:400 500;unicode-range:U+20BA}
@font-face{font-family:"Lira";src:local("Segoe UI Semibold"),local("SegoeUI-Semibold"),local("HelveticaNeue-Medium"),local("Roboto Medium"),local("Arial Bold"),local("Arial-BoldMT");font-weight:600;unicode-range:U+20BA}
@font-face{font-family:"Lira";src:local("Segoe UI Bold"),local("SegoeUI-Bold"),local("HelveticaNeue-Bold"),local("Roboto Bold"),local("Arial Bold"),local("Arial-BoldMT");font-weight:700 800;unicode-range:U+20BA}

:root {
  /* Renk */
  --base: #F3F5F6;      /* sayfa zemini, soğuk açık gri (krem değil) */
  --white: #FFFFFF;     /* form, kart, portal yüzeyleri */
  --ink: #14212B;       /* ana metin, koyu yüzeyler */
  --ink-2: #33434F;     /* gövde metni ikincil */
  --steel: #5E6E7A;     /* açıklama, künye */
  --line: #C3CCD3;      /* ayırıcı çizgi */
  --hair: #DCE2E6;      /* en ince çizgi, tablo satırı */
  --field: #7F8D98;     /* form kenarı (3:1) */
  --board: #E4E9EC;     /* sunum zemini */
  --red: #C8102E;       /* canlı iletken: birincil düğme, harita işareti, logo noktaları, enerjili hat */
  --red-d: #A50C25;     /* kırmızı hover / basılı */

  /* Durum (yalnız portal; anlam taşır, süs değil) */
  --ok: #1F7A4D;
  --wait: #B58A00;      /* sarı-hardal, turuncuya kaymaz */
  --fault: var(--red);

  /* Yazı */
  --f: "Lira", "Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --t-12: 0.75rem;
  --t-14: 0.875rem;
  --t-16: 1rem;
  --t-18: 1.125rem;
  --t-22: 1.375rem;
  --t-28: 1.75rem;
  --t-40: 2.5rem;
  --t-56: 3.5rem;
  --t-72: 4.5rem;

  /* Boşluk */
  --s-4: 4px; --s-8: 8px; --s-12: 12px; --s-16: 16px; --s-24: 24px;
  --s-32: 32px; --s-48: 48px; --s-64: 64px; --s-96: 96px; --s-128: 128px;

  /* Biçim */
  --r: 3px;             /* düğme, alan; kartlarda çoğunlukla 0–4 */
  --gut: clamp(16px, 3.9vw, 56px);
  --max: 1360px;
  --focus: 0 0 0 3px var(--white), 0 0 0 5px var(--ink);
}

html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--base);
  color: var(--ink);
  font-family: var(--f);
  font-size: var(--t-16);
  line-height: 1.55;
  font-feature-settings: "kern" 1;
}
:focus-visible { outline: none; box-shadow: var(--focus); border-radius: var(--r); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}