/* ═══════════════════════════════════════════════════════════════════════
   IADEOS · Güneş / Ay (aydınlık / koyu) · bütün sayfalar
   Güneş = A kolu (beyaz kâğıt #FFFFFF / #F6F8FB, mürekkep metin #0B1220)
   Ay    = B kolu (mürekkep zemin #0B1220, açık metin #EEF2F8)
   Bileşenler token kullanır; koyu görünüm token'ları yeniden eşler.
   Mürekkep bantları (.on-ink) koyu sayfada daha derin bir zemine iner ve
   kendi içinde aydınlık görünümün anlamını korur.
   ═══════════════════════════════════════════════════════════════════════ */
html { background: var(--white); }
html, body { overscroll-behavior-y: none; }

:root[data-theme="dark"] {
  --white: #0B1220;
  --ink: #EEF2F8;
  --surface: #101A2C;
  --line: #223049;
  --gray-600: #A9B4C6;
  --blue-700: #8DB4FF;
  --blue-100: #1C2F55;
  --blue-50: #13213D;
  --ink-2: #111A2C;
  --ink-line: #24324D;
  --ink-text-2: #A9B4C6;
  color-scheme: dark;
}
/* mürekkep bantları: aydınlık anlam, daha derin zemin */
:root[data-theme="dark"] .on-ink, :root[data-theme="dark"] .sec--ink {
  --ink: #060A13; --white: #FFFFFF; --surface: #F6F8FB; --line: #E3E7EE; --gray-600: #4A5363;
  --blue-700: #0F4FC4; --blue-100: #D6E4FF; --blue-50: #EEF4FF; --ink-2: #0E1626; --ink-line: #1E2A42; --ink-text-2: #A9B4C6;
  background: #060A13; color: #FFFFFF;
}

/* sabit renkli kalıntılar */
:root[data-theme="dark"] .nav { background: rgba(11,18,32,.92); }
:root[data-theme="dark"] .nav.is-scrolled { border-bottom-color: var(--line); }
:root[data-theme="dark"] .hero__scrim { background: linear-gradient(to right, #0B1220 0%, rgba(11,18,32,.5) 28%, rgba(11,18,32,0) 62%); }
:root[data-theme="dark"] .input, :root[data-theme="dark"] .select, :root[data-theme="dark"] .textarea, :root[data-theme="dark"] .sw, :root[data-theme="dark"] .inp { border-color: #33435F; }
:root[data-theme="dark"] .kmetrics { background: rgba(11,18,32,.86); }
:root[data-theme="dark"] .hp__f { background: var(--surface); }
:root[data-theme="dark"] .dz { border-color: #4A5A78; }
:root[data-theme="dark"] .dock { background: rgba(11,18,32,.94); }
:root[data-theme="dark"] .az { background: rgba(11,18,32,.96); }
:root[data-theme="dark"] .btn--primary, :root[data-theme="dark"] .btn--primary:hover { color: #FFFFFF; }
:root[data-theme="dark"] .btn--ink:hover { background: #FFFFFF; color: #0B1220; }
:root[data-theme="dark"] ::selection { background: #1C2F55; color: #FFFFFF; }
:root[data-theme="dark"] :focus-visible { outline-color: #3D6FD8; }

/* çizgi sanatı (3B webp) ve mürekkep logolar: ton ters çevrilir, mavi korunur */
:root[data-theme="dark"] img[src*="assets/3b/"],
:root[data-theme="dark"] .nav__logo img,
:root[data-theme="dark"] .panel__logo img,
:root[data-theme="dark"] img[data-tema-ters] { filter: invert(1) hue-rotate(180deg) brightness(.94); }
:root[data-theme="dark"] .on-ink img[src*="assets/3b/"] { filter: none; }

/* 1/f gren: koyu zeminde düz dijital siyah olmasın */
:root[data-theme="dark"] body::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .028; mix-blend-mode: screen;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* ── güneş / ay düğmesi ─────────────────────────────────────────────── */
.tema { position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none; border: 1px solid var(--line); border-radius: var(--r-ctl); background: transparent; color: var(--ink); cursor: pointer; touch-action: manipulation; transition: border-color var(--t-fast); }
.tema:hover { border-color: var(--ink); }
.tema:active { transform: translateY(1.5px) scale(.985); transition-duration: 0ms; filter: brightness(.92); }
.tema svg { position: absolute; width: 20px; height: 20px; transition: opacity .2s var(--ease), transform .32s cubic-bezier(.16,1,.3,1); }
.tema .tema__ay { opacity: 0; transform: rotate(-40deg) scale(.7); }
:root[data-theme="dark"] .tema .tema__gunes { opacity: 0; transform: rotate(40deg) scale(.7); }
:root[data-theme="dark"] .tema .tema__ay { opacity: 1; transform: none; }
.on-ink .tema { border-color: var(--ink-line); color: #FFFFFF; }
.nav .tema { margin-left: 4px; }
@media (max-width: 900px) { .nav .tema { margin-left: auto; } .nav .tema + .nav__cta + .nav__menu { margin-left: 8px; } }
.foot__tema { display: inline-flex; align-items: center; gap: 10px; }

/* radyal geçiş: View Transitions varsa tıklanan noktadan açılır */
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
::view-transition-old(root) { z-index: 1; } ::view-transition-new(root) { z-index: 2; }

@media (prefers-reduced-motion: reduce) { .tema svg { transition: none; } }

/* ── grafik SVG'leri: sunum öznitelikleri koyu görünümde eşlenir ───────
   (CSS, SVG sunum özniteliğinden önce gelir; mürekkep bantları hariç) */
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [fill="#FFFFFF"], :root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [fill="#fff"] { fill: #0B1220; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [fill="#0B1220"] { fill: #EEF2F8; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [stroke="#0B1220"] { stroke: #EEF2F8; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [stroke="#FFFFFF"] { stroke: #0B1220; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [stroke="#E3E7EE"], :root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [stroke="#D5DBE5"] { stroke: #24324D; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [fill="#E3E7EE"] { fill: #24324D; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [fill="#D6E4FF"] { fill: #1C2F55; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [stroke="#D6E4FF"] { stroke: #3D6FD8; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [fill="#EEF4FF"] { fill: #13213D; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [stroke="#4A5363"] { stroke: #A9B4C6; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [fill="#4A5363"] { fill: #A9B4C6; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [fill="#A9B4C6"] { fill: #6B7A96; }
:root[data-theme="dark"] svg:not(.on-ink svg):not(.sec--ink svg) [stroke="#A9B4C6"] { stroke: #6B7A96; }