/* ============================================================
   ESTE Bilişim × Apple Human Interface Guidelines — iOS tasarım katmanı
   ============================================================
   Bu dosya her sayfada EN SON yüklenir (sayfa içi <style> bloklarından
   da sonra), böylece ortak bileşenleri tek yerden iOS diline çevirir.

   İlkeler (HIG): netlik (clarity), içeriğe saygı (deference), derinlik
   (depth). ESTE marka renkleri (este / plum / coral) korunur; nötr
   griler, malzemeler (material), tipografi ve hareket iOS'tan gelir.

   Tailwind tarafı: tailwind.config.js → ink = Apple sistem grileri,
   font = SF Pro (Apple) / Inter (diğer), ağırlık + yarıçap + gölge.
   ============================================================ */

/* ---------- 1. Tasarım değişkenleri (semantic colors) ---------- */
:root {
  --ios-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Helvetica Neue", Inter, "Segoe UI", system-ui, sans-serif;
  --ios-ease: cubic-bezier(0.32, 0.72, 0, 1);
  --ios-spring: cubic-bezier(0.34, 1.36, 0.64, 1);

  --ios-tint: #2563eb;              /* este-600 — marka mavisi = iOS tint */
  --ios-tint-hover: #1d4ed8;
  --ios-tint-soft: rgba(37, 99, 235, 0.12);

  --ios-bg: #ffffff;                /* systemBackground */
  --ios-bg-grouped: #f5f5f7;        /* systemGroupedBackground */
  --ios-card: #ffffff;              /* secondarySystemGroupedBackground */
  --ios-card-raised: #ffffff;
  --ios-label: #1d1d1f;
  --ios-label-2: #6e6e73;           /* secondaryLabel */
  --ios-label-3: #8e8e93;           /* tertiaryLabel */
  --ios-separator: rgba(60, 60, 67, 0.16);
  --ios-separator-strong: rgba(60, 60, 67, 0.29);
  --ios-fill: rgba(120, 120, 128, 0.12);       /* tertiarySystemFill */
  --ios-fill-strong: rgba(120, 120, 128, 0.2);
  --ios-material: rgba(255, 255, 255, 0.72);   /* .regularMaterial */
  --ios-material-thick: rgba(250, 250, 252, 0.88);
  --ios-shadow-card: 0 1px 1px rgba(0, 0, 0, 0.02), 0 4px 18px -4px rgba(0, 0, 0, 0.07);
  --ios-shadow-card-hover: 0 2px 4px rgba(0, 0, 0, 0.03), 0 18px 40px -12px rgba(0, 0, 0, 0.14);
  --ios-shadow-pop: 0 12px 40px -8px rgba(0, 0, 0, 0.18), 0 0 0 0.5px rgba(0, 0, 0, 0.05);

  --ios-radius-card: 22px;
  --ios-radius-control: 12px;
  --ios-hit: 44px;                  /* HIG asgari dokunma hedefi */
}
.dark {
  --ios-tint: #3b82f6;              /* koyu modda bir ton açık tint (HIG) */
  --ios-tint-hover: #60a5fa;
  --ios-tint-soft: rgba(59, 130, 246, 0.18);

  --ios-bg: #000000;
  --ios-bg-grouped: #000000;
  --ios-card: #1c1c1e;
  --ios-card-raised: #2c2c2e;
  --ios-label: #f5f5f7;
  --ios-label-2: #a1a1a6;
  --ios-label-3: #6e6e73;
  --ios-separator: rgba(84, 84, 88, 0.55);
  --ios-separator-strong: rgba(84, 84, 88, 0.8);
  --ios-fill: rgba(118, 118, 128, 0.24);
  --ios-fill-strong: rgba(118, 118, 128, 0.36);
  --ios-material: rgba(22, 22, 23, 0.72);
  --ios-material-thick: rgba(30, 30, 32, 0.9);
  --ios-shadow-card: 0 0 0 0.5px rgba(255, 255, 255, 0.06);
  --ios-shadow-card-hover: 0 0 0 0.5px rgba(255, 255, 255, 0.1), 0 18px 40px -12px rgba(0, 0, 0, 0.7);
  --ios-shadow-pop: 0 16px 48px -8px rgba(0, 0, 0, 0.7), 0 0 0 0.5px rgba(255, 255, 255, 0.08);
}

/* ---------- 2. Temel tipografi ve davranış ---------- */
html {
  font-family: var(--ios-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
}
body { font-family: var(--ios-font); letter-spacing: -0.003em; }
h1, h2, h3 { letter-spacing: -0.022em; }
h1 { text-wrap: balance; }
h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }
::selection { background: var(--ios-tint-soft); }

/* Klavye odağı: iOS tint halkası (fare tıklamasında görünmez) */
:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--ios-tint) 55%, transparent);
  outline-offset: 2px;
}

/* Kaydırma çubuğu: ince, nötr (macOS overlay scrollbar hissi) */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(120, 120, 128, 0.4);
  border-radius: 10px;
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background-color: rgba(120, 120, 128, 0.6); }
html { scrollbar-color: rgba(120, 120, 128, 0.45) transparent; scrollbar-width: thin; }

/* Büyük harfli "eyebrow" etiketleri: iOS bölüm başlığı (footnote) ölçüsü */
.uppercase.tracking-wider, .uppercase.tracking-widest { font-weight: 600; }

/* ---------- 3. Üst şerit (topbar) ---------- */
.este-topbar { font-size: 12px; letter-spacing: -0.005em; }
.este-topbar > div { height: 36px; }

/* ---------- 4. Navigasyon çubuğu — yarı saydam malzeme ---------- */
#mainNav {
  background: var(--ios-material);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 0.5px solid var(--ios-separator);
}
#mainNav > nav { padding-top: 10px; padding-bottom: 10px; }

/* Masaüstü menü: Apple tarzı sade metin, kapsül hover */
#mainNav > nav > ul > li > :is(a, button) {
  border-radius: 980px;
  padding: 7px 14px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--ios-label);
  transition: background-color 0.2s var(--ios-ease), color 0.2s var(--ios-ease);
}
#mainNav > nav > ul > li > :is(a, button) > svg:first-child { display: none; }  /* öndeki ikonlar */
#mainNav > nav > ul > li > :is(a, button) > svg:last-child { width: 12px; height: 12px; opacity: 0.6; }
#mainNav > nav > ul > li > :is(a, button):hover { background: var(--ios-fill); }
#mainNav > nav > ul > li > :is(a, button)[class*="bg-este-50"] {
  background: var(--ios-tint-soft);
  color: var(--ios-tint);
}

/* Açılır menüler — iOS bağlam menüsü / popover */
.menu-panel,
.dark .menu-panel {
  background: var(--ios-material-thick);
  -webkit-backdrop-filter: saturate(180%) blur(30px);
  backdrop-filter: saturate(180%) blur(30px);
  border: 0.5px solid var(--ios-separator);
  border-radius: 16px;
  box-shadow: var(--ios-shadow-pop);
}
.menu-panel a { border-radius: 10px; }
.menu-panel a:hover { background: var(--ios-fill); }
.nav-dropdown {
  transform: translateY(6px) scale(0.98);
  transform-origin: top left;
  transition: opacity 0.18s var(--ios-ease), transform 0.32s var(--ios-spring), visibility 0.18s;
}
.nav-item:hover .nav-dropdown,
.nav-item:focus-within .nav-dropdown { transform: translateY(0) scale(1); }

/* Navigasyon çubuğu düğmeleri (tema, hamburger): dairesel dolgu */
#themeToggleNav, #themeToggleMobile {
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 0;
  background: var(--ios-fill);
  color: var(--ios-label);
}
#themeToggleNav:hover, #themeToggleMobile:hover { background: var(--ios-fill-strong); }
.burger {
  width: 36px; height: 36px;
  border-radius: 50%;
  flex-direction: column; align-items: center; justify-content: center;
  background: var(--ios-fill);
  color: var(--ios-label);
}
/* display yalnız mobilde — masaüstünde Tailwind'in lg:hidden kuralı geçerli kalmalı */
@media (max-width: 1023.98px) { .burger { display: inline-flex; } }
.burger span { width: 16px; height: 1.75px; margin: 2px 0; border-radius: 2px; transition: transform 0.35s var(--ios-spring), opacity 0.2s; }
.burger.open span:nth-child(1) { transform: translateY(5.75px) rotate(45deg); }
.burger.open span:nth-child(3) { transform: translateY(-5.75px) rotate(-45deg); }

/* ---------- 5. Mobil menü — iOS "Ayarlar" listesi (inset grouped) ---------- */
#mobileMenu {
  background: var(--ios-bg-grouped);
  border-top: 0.5px solid var(--ios-separator);
  max-height: calc(100dvh - 60px);
  overscroll-behavior: contain;
}
#mobileMenu:not(.hidden) { animation: iosSheetIn 0.38s var(--ios-ease) both; }
@keyframes iosSheetIn {
  from { opacity: 0; transform: translateY(-10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.ios-list {
  background: var(--ios-card);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--ios-shadow-card);
}
.ios-list + .ios-list-header, .ios-list-header { margin: 22px 16px 7px; font-size: 13px; color: var(--ios-label-2); text-transform: uppercase; letter-spacing: 0.02em; }
.ios-row {
  position: relative;
  display: flex; align-items: center; gap: 12px;
  min-height: var(--ios-hit);
  padding: 6px 14px;
  font-size: 17px; letter-spacing: -0.02em;
  color: var(--ios-label);
  cursor: pointer;
  list-style: none;
  transition: background-color 0.15s;
}
.ios-row::-webkit-details-marker { display: none; }
.ios-row:active { background: var(--ios-fill); }
/* Satır ayırıcı: ikonun sağından başlar (iOS inset separator) */
.ios-list > :not(:last-child) > .ios-row::after,
.ios-list > a.ios-row:not(:last-child)::after,
.ios-list > :not(:last-child) .ios-sublist > .ios-row::after,
.ios-sublist > .ios-row:not(:last-child)::after {
  content: ""; position: absolute; left: 56px; right: 0; bottom: 0;
  height: 0.5px; background: var(--ios-separator);
}
.ios-row-label { flex: 1; min-width: 0; }
.ios-row.is-active .ios-row-label { color: var(--ios-tint); font-weight: 600; }
.ios-chev { width: 14px; height: 14px; color: var(--ios-label-3); flex-shrink: 0; transition: transform 0.3s var(--ios-spring); }
details[open] > .ios-row .ios-chev { transform: rotate(90deg); }
/* Ayarlar uygulaması ikon karosu */
.ios-icon {
  width: 30px; height: 30px; flex-shrink: 0;
  border-radius: 7px;
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff;
}
.ios-icon svg { width: 18px; height: 18px; stroke-width: 2.1; }
.ios-icon.t-este  { background: linear-gradient(180deg, #3b82f6, #2563eb); }
.ios-icon.t-plum  { background: linear-gradient(180deg, #a855f7, #9333ea); }
.ios-icon.t-coral { background: linear-gradient(180deg, #fb7185, #f43f5e); }
.ios-icon.t-gray  { background: linear-gradient(180deg, #8e8e93, #636366); }
.ios-icon.t-sky   { background: linear-gradient(180deg, #38bdf8, #0284c7); }
.ios-sublist .ios-row { padding-left: 56px; font-size: 16px; color: var(--ios-label); }

/* iOS segmented control (dil seçimi) */
.ios-segmented {
  display: flex; gap: 2px; padding: 2px;
  background: var(--ios-fill);
  border-radius: 9px;
}
.ios-segmented > button {
  flex: 1; min-height: 32px;
  border-radius: 7px;
  font-size: 13px; font-weight: 600;
  color: var(--ios-label);
  background: transparent;
  transition: background-color 0.25s var(--ios-ease), box-shadow 0.25s var(--ios-ease);
}
.ios-segmented > button.is-on {
  background: var(--ios-card-raised);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.12), 0 3px 1px rgba(0, 0, 0, 0.04);
}
.dark .ios-segmented > button.is-on { background: #636366; }

/* ---------- 6. Butonlar — kapsül, basma geri bildirimi ---------- */
:is(a, button).inline-flex.rounded-xl:is(.py-3, .py-3\.5, .py-4):is(.px-5, .px-6, .px-7, .px-8) {
  border-radius: 980px;
  font-weight: 600;
  letter-spacing: -0.01em;
  min-height: var(--ios-hit);
  transition: transform 0.25s var(--ios-spring), background-color 0.2s var(--ios-ease),
              box-shadow 0.25s var(--ios-ease), filter 0.2s var(--ios-ease), color 0.2s;
}
/* Kenarlıklı ikincil butonlar → iOS "gray" (tinted fill) buton */
:is(a, button).inline-flex.rounded-xl:is(.py-3, .py-3\.5, .py-4):is(.border, .border-2):is([class*="border-ink-"]) {
  border-color: transparent;
  background-color: var(--ios-fill);
  color: var(--ios-label);
}
:is(a, button).inline-flex.rounded-xl:is(.py-3, .py-3\.5, .py-4):is(.border, .border-2):is([class*="border-ink-"]):hover {
  background-color: var(--ios-fill-strong);
}
/* Basma: iOS'taki hafif küçülme */
:is(a, button):is(.rounded-xl, .rounded-lg, .rounded-full, .rounded-2xl)[class*="px-"]:active,
.cookie-btn:active, .sticky-cta-btn:active, .fab:active {
  transform: scale(0.97);
  transition-duration: 0.08s;
}
/* Gradyan CTA: marka gradyanı korunur, gölge tinte uyar */
:is(a, button)[class*="bg-gradient-to-r"][class*="from-este-6"].rounded-xl {
  box-shadow: 0 8px 22px -8px rgba(37, 99, 235, 0.55);
}
:is(a, button)[class*="bg-gradient-to-r"][class*="from-este-6"].rounded-xl:hover { filter: brightness(1.06); }

/* ---------- 7. Kartlar — gruplanmış yüzey ---------- */
:is(.este-card, .feature-card, .case-card, .blog-card, .news-card, .event-card, .story-card,
    .iso-card, .perk-card, .exp-card, .job-card) {
  border-radius: var(--ios-radius-card);
  border-color: var(--ios-separator) !important;
  border-width: 0.5px;
  box-shadow: var(--ios-shadow-card);
  transition: transform 0.45s var(--ios-ease), box-shadow 0.35s var(--ios-ease), background-color 0.3s;
}
.dark :is(.este-card, .feature-card, .case-card, .blog-card, .news-card, .event-card, .story-card,
    .iso-card, .perk-card, .exp-card, .job-card) {
  background-color: var(--ios-card);
  box-shadow: var(--ios-shadow-card);
}
:is(.este-card, .feature-card, .case-card, .blog-card, .news-card, .event-card, .story-card, .job-card):hover {
  transform: translateY(-2px);
  box-shadow: var(--ios-shadow-card-hover);
}
/* Kart içi ikon kutuları: iOS uygulama ikonu yarıçapı */
:is(.este-card, .feature-card, .case-card) :is(.w-12.h-12, .w-14.h-14).rounded-xl { border-radius: 13px; }
:is(.este-card, .feature-card, .case-card) .w-10.h-10.rounded-xl { border-radius: 10px; }

/* Rozet / chip'ler: kapsül */
.rounded-full.text-xs.uppercase, .rounded-full.text-\[10px\], .rounded-full.text-\[11px\] { letter-spacing: 0.02em; }

/* Müşteri logoları */
.logo-chip { border-radius: 16px; border: 0.5px solid var(--ios-separator); box-shadow: var(--ios-shadow-card); }
.dark .logo-chip { border-color: transparent; }
.logo-chip:hover { border-color: var(--ios-separator); box-shadow: var(--ios-shadow-card-hover); }
.dark .logo-chip:hover { border-color: transparent; box-shadow: 0 12px 28px -10px rgba(0, 0, 0, 0.8); }

/* İskelet (yükleniyor) kartları */
.skel-card { border-radius: var(--ios-radius-card); border: 0.5px solid var(--ios-separator); }
.dark .skel-card { background: var(--ios-card); }

/* ---------- 8. Form alanları — iOS metin alanı ---------- */
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]):not([type="hidden"]),
       select, textarea):not(.ql-editor *) {
  border-radius: var(--ios-radius-control);
  font-size: max(16px, 1em);    /* iOS Safari'nin odakta yakınlaştırmasını önler */
  transition: border-color 0.2s var(--ios-ease), box-shadow 0.2s var(--ios-ease), background-color 0.2s;
}
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]):not([type="hidden"]),
       select, textarea):focus {
  border-color: var(--ios-tint) !important;
  box-shadow: 0 0 0 4px var(--ios-tint-soft) !important;
  outline: none;
}
input[type="checkbox"], input[type="radio"], input[type="range"], progress { accent-color: var(--ios-tint); }

/* iOS anahtar (switch): <input type="checkbox" class="ios-switch"> */
input[type="checkbox"].ios-switch {
  appearance: none; -webkit-appearance: none;
  width: 51px; height: 31px; border-radius: 31px;
  background: var(--ios-fill-strong);
  position: relative; cursor: pointer; flex-shrink: 0;
  transition: background-color 0.25s var(--ios-ease);
}
input[type="checkbox"].ios-switch::after {
  content: ""; position: absolute; top: 2px; left: 2px;
  width: 27px; height: 27px; border-radius: 50%;
  background: #fff;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15), 0 3px 1px rgba(0, 0, 0, 0.06);
  transition: transform 0.3s var(--ios-spring);
}
input[type="checkbox"].ios-switch:checked { background: #34c759; }
input[type="checkbox"].ios-switch:checked::after { transform: translateX(20px); }

/* ---------- 9. Çerez bandı — iOS alt sayfa (sheet) ---------- */
.cookie-banner,
.dark .cookie-banner {
  background: var(--ios-material-thick);
  -webkit-backdrop-filter: saturate(180%) blur(30px);
  backdrop-filter: saturate(180%) blur(30px);
  border: 0.5px solid var(--ios-separator);
  border-radius: 22px;
  box-shadow: var(--ios-shadow-pop);
  transition: transform 0.5s var(--ios-ease);
  bottom: max(16px, env(safe-area-inset-bottom));
}
.cookie-banner-text, .dark .cookie-banner-text { color: var(--ios-label-2); font-size: 13px; }
.cookie-banner-text strong, .dark .cookie-banner-text strong { color: var(--ios-label); font-weight: 600; }
.cookie-banner-text a { color: var(--ios-tint); text-decoration: none; }
.cookie-btn { border-radius: 980px; font-weight: 600; min-height: 40px; padding: 9px 18px; transition: transform 0.25s var(--ios-spring), background-color 0.2s; }
.cookie-btn.primary { background: var(--ios-tint); box-shadow: none; }
.cookie-btn.primary:hover { background: var(--ios-tint-hover); transform: none; box-shadow: none; }
.cookie-btn.ghost, .dark .cookie-btn.ghost { background: var(--ios-fill); border: 0; color: var(--ios-label); }
.cookie-btn.ghost:hover, .dark .cookie-btn.ghost:hover { background: var(--ios-fill-strong); color: var(--ios-label); }

/* ---------- 10. Yapışkan CTA çubuğu — malzeme + kapsül ---------- */
.sticky-cta { padding-bottom: max(12px, env(safe-area-inset-bottom)); transition: bottom 0.5s var(--ios-ease); }
.sticky-cta-btn { border-radius: 980px; font-weight: 600; }
.sticky-cta-close { border-radius: 50%; }

/* ---------- 11. FAB + sohbet paneli ---------- */
.fab-stack { bottom: max(24px, calc(env(safe-area-inset-bottom) + 12px)); }
.chat-panel, .dark .chat-panel {
  border-radius: 24px;
  border: 0.5px solid var(--ios-separator);
  box-shadow: var(--ios-shadow-pop);
  transition: transform 0.42s var(--ios-spring), opacity 0.25s var(--ios-ease), bottom 0.4s var(--ios-ease);
}
.dark .chat-panel { background: var(--ios-card); }
.dark .chat-body, .dark .chat-quick-wrap { background: #000; }
.chat-msg { border-radius: 18px; }
.chat-msg.user { border-bottom-right-radius: 5px; }
.chat-msg.bot { border-bottom-left-radius: 5px; }
.dark .chat-msg.bot { background: var(--ios-card-raised); border-color: transparent; }
.chat-input { border-radius: 980px !important; }
.chat-send { border-radius: 50%; }
.chat-quick-btn, .chat-contact { border-radius: 980px; }
.dark :is(.chat-input-row, .chat-footer) { background: var(--ios-card); border-color: var(--ios-separator); }
.dark :is(.chat-quick-btn, .chat-contact, .chat-input) { background: var(--ios-card-raised); border-color: transparent; }

/* Geri arama penceresi — iOS alert/sheet */
.callback-modal, .dark .callback-modal { border-radius: 22px; box-shadow: var(--ios-shadow-pop); }
.dark .callback-modal { background: var(--ios-card); }
.callback-btn-primary, .callback-btn-cancel { border-radius: 980px; }

/* ---------- 12. Footer — Apple tarzı sakin, gruplanmış zemin ---------- */
.site-footer { background-color: var(--ios-bg-grouped); color: var(--ios-label-2); }
.dark .site-footer { background-color: #0a0a0b; color: var(--ios-label-2); }
.site-footer > .absolute.h-px { display: none; }        /* gradyan çizgi yerine ince ayırıcı */
.site-footer { border-top: 0.5px solid var(--ios-separator) !important; }
.site-footer h4 { letter-spacing: 0.02em; font-weight: 600; font-size: 12px; color: var(--ios-label); }
.site-footer ul a { color: var(--ios-label-2); }
.site-footer ul a:hover { color: var(--ios-label); }
.ios-social { border-radius: 11px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0.5px 0 rgba(255, 255, 255, 0.25); }

/* ---------- 13. Bölüm zeminleri ---------- */
/* Hero'lardaki ızgara deseni iOS'un sade zeminine göre yumuşatılır.
   (opacity DEĞİL — .grid-bg içerik taşıyan bölümlerde de kullanılıyor) */
.grid-bg {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 0, 0, 0.035) 1px, transparent 1px);
}
.dark .grid-bg {
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
}
/* Koyu modda düz siyah taban (OLED, HIG) */
.dark body { background-color: #000; }

/* ---------- 14. Hareket — iOS eğrileri ---------- */
.reveal {
  transform: translateY(16px);
  transition: opacity 0.7s var(--ios-ease), transform 0.8s var(--ios-ease);
}
.reveal.visible { transform: none; }
::view-transition-old(root) { animation: vt-fade-out 200ms var(--ios-ease) both; }
::view-transition-new(root) { animation: vt-fade-in 300ms var(--ios-ease) both; }

/* ---------- 15. Erişilebilirlik tercihleri ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; }
  #mobileMenu:not(.hidden) { animation: none; }
  .reveal { transform: none; }
}
/* "Saydamlığı Azalt" açıkken malzemeler opak olur (iOS davranışı) */
@media (prefers-reduced-transparency: reduce) {
  #mainNav, .menu-panel, .cookie-banner { -webkit-backdrop-filter: none; backdrop-filter: none; }
  #mainNav { background: var(--ios-bg); }
  .menu-panel, .cookie-banner { background: var(--ios-card); }
}
/* "Kontrastı Artır" */
@media (prefers-contrast: more) {
  :root { --ios-separator: rgba(60, 60, 67, 0.45); --ios-label-2: #3a3a3c; }
  .dark { --ios-separator: rgba(160, 160, 168, 0.6); --ios-label-2: #d1d1d6; }
}