/* ============================================================
   üret.me tasarım sistemi v3 — "gece paneli"
   odesin-register: koyu lacivert-slate zemin, cam yüzeyler,
   zümrüt/menekşe/kehribar ışımalar, süzülen belge kartları.
   Varsayılan tema: KOYU. Açık tema toggle ile.
   ============================================================ */

:root{
  --zemin:#0B0F18; --yuzey:#141A26; --cam:rgba(148,163,184,.055);
  --murekkep:#E7ECF5; --soluk:#94A3B8;
  /* --panel: her iki temada da KOYU kalır (footer ve formül kartı bilerek koyu,
     kendi açık yazı renklerini taşırlar). İçerik kutuları için --kutu kullanın:
     --panel'i içerik kutusunda kullanmak açık temada koyu-üstüne-koyu yazı üretir. */
  --panel:#101727; --panel-cizgi:rgba(148,163,184,.10);
  --kutu:#101727;
  --marka:#10B981; --marka-koyu:#0A8F66; --marka-parlak:#34D399;
  --marka-acik:rgba(16,185,129,.13);
  /* --marka-parlak KOYU zemin içindir (footer, koyu kutular). Sayfa içeriğinde
     vurgu YAZISI için --marka-yazi kullanın: açık temada parlak yeşil beyaz
     üstünde 2,29:1 kalıyor ve okunmuyor. */
  --marka-yazi:#34D399;
  --mor:#818CF8; --mavi:#60A5FA;
  --vurgu:#FBBF24; --vurgu-acik:rgba(251,191,36,.13);
  --hata:#F87171; --hata-acik:rgba(248,113,113,.12);
  --cizgi:rgba(148,163,184,.15); --cizgi-koyu:rgba(148,163,184,.30);
  --radius:16px; --radius-k:10px;
  --golge:0 1px 2px rgba(0,0,0,.35),0 10px 34px rgba(0,0,0,.35);
  --golge-buyuk:0 2px 8px rgba(0,0,0,.45),0 28px 80px rgba(0,0,0,.55);
  --isima:0 0 42px rgba(16,185,129,.16);
  --maxw:74rem;
  --baslik:Sora,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --govde:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --gecis:.22s cubic-bezier(.2,.7,.3,1);
}
:root[data-tema="acik"]{
  --zemin:#F6F4EF; --yuzey:#FFFFFF; --cam:rgba(20,27,24,.035);
  --murekkep:#131A22; --soluk:#5B6472;
  --panel:#0F1524; --panel-cizgi:rgba(148,163,184,.10);
  --kutu:#FFFFFF;
  --marka:#0C8A68; --marka-koyu:#086A50; --marka-parlak:#10B981;
  --marka-acik:rgba(12,138,104,.10);
  --marka-yazi:#086A50;
  --vurgu:#D98E1B; --vurgu-acik:rgba(217,142,27,.12);
  --hata:#B3261E; --hata-acik:rgba(179,38,30,.08);
  --cizgi:rgba(19,26,34,.13); --cizgi-koyu:rgba(19,26,34,.26);
  --golge:0 1px 3px rgba(19,26,34,.07),0 8px 28px rgba(19,26,34,.08);
  --golge-buyuk:0 2px 6px rgba(19,26,34,.07),0 22px 60px rgba(19,26,34,.14);
  --isima:none;
}

@font-face{font-family:Sora;src:url(/assets/fonts/sora-latin.woff2)format('woff2');
  font-weight:600 700;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;}
@font-face{font-family:Sora;src:url(/assets/fonts/sora-latinext.woff2)format('woff2');
  font-weight:600 700;font-display:swap;
  unicode-range:U+0100-02BA,U+1E00-1E9F,U+20A0-20C0;}

/* ---- Reset + taban ---- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--zemin);color:var(--murekkep);font-family:var(--govde);
  font-size:1.0625rem;line-height:1.68;-webkit-text-size-adjust:100%;
  background-image:
    radial-gradient(900px 520px at 82% -180px,rgba(16,185,129,.13),transparent 60%),
    radial-gradient(800px 480px at -12% 12%,rgba(129,140,248,.10),transparent 55%),
    radial-gradient(700px 420px at 108% 68%,rgba(96,165,250,.07),transparent 55%);
  background-attachment:fixed}
:root[data-tema="acik"] body{background-image:
    radial-gradient(900px 480px at 85% -160px,rgba(12,138,104,.07),transparent 60%),
    radial-gradient(700px 420px at -10% 20%,rgba(129,140,248,.05),transparent 55%)}
h1,h2,h3,.rakam{font-family:var(--baslik);line-height:1.22;color:var(--murekkep);letter-spacing:-.015em}
h1{font-size:clamp(1.7rem,4.5vw,2.35rem);font-weight:700;margin:.3em 0}
h2{font-size:clamp(1.3rem,3.5vw,1.6rem);font-weight:600;margin:2.2em 0 .6em;position:relative;padding-left:1rem}
h2::before{content:"";position:absolute;left:0;top:.28em;bottom:.28em;width:4px;border-radius:4px;
  background:linear-gradient(180deg,var(--marka-parlak),var(--mor))}
h3{font-size:1.12rem;font-weight:600;margin:1.5em 0 .4em}
p{margin:.7em 0}
a{color:var(--marka-parlak);text-underline-offset:3px}
a:hover{color:var(--marka)}
:root[data-tema="acik"] a{color:var(--marka)}
:root[data-tema="acik"] a:hover{color:var(--marka-koyu)}
img,svg{max-width:100%}
.ikn{vertical-align:-4px}
.icerik{max-width:var(--maxw);margin:0 auto;padding:0 1.1rem}
.dar{max-width:53rem}
::selection{background:var(--vurgu);color:#0B0F18}

/* ---- Giriş animasyonları ---- */
@keyframes belir{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes yuz{0%,100%{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-10px) rotate(-.4deg)}}
@keyframes nabizGolge{0%,100%{box-shadow:0 10px 30px rgba(16,185,129,.28),inset 0 1px 0 rgba(255,255,255,.25)}
  50%{box-shadow:0 14px 44px rgba(16,185,129,.5),inset 0 1px 0 rgba(255,255,255,.25)}}
@keyframes acil{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
html.js .reveal{opacity:0}
.reveal.girdi{animation:belir .65s var(--d,0s) cubic-bezier(.2,.7,.3,1) forwards}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1!important;animation:none!important}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* ---- Header: koyu cam ---- */
.ust{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--zemin) 74%,transparent);
  backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);
  border-bottom:1px solid var(--cizgi)}
@supports not (backdrop-filter:blur(1px)){.ust{background:var(--zemin)}}
.ust::before{content:"";display:block;height:2px;
  background:linear-gradient(90deg,var(--marka-parlak),var(--mavi) 45%,var(--mor) 75%,var(--vurgu))}
.ust-ic{max-width:var(--maxw);margin:0 auto;padding:.6rem 1.1rem;display:flex;align-items:center;gap:.9rem;position:relative}
.logo{display:flex;align-items:center;text-decoration:none;flex-shrink:0}
.logo img{height:42px;width:auto;border-radius:9px;box-shadow:0 2px 12px rgba(0,0,0,.35)}
/* Menü, kategori sayısı arttıkça (JS ile) taşanları "Diğer ▾" açılır menüsüne
   koyar. JS yoksa güvenli geri düşüş: sarar (hiçbir kategori kesilmez). */
.ust nav{display:flex;gap:.2rem;margin-left:auto;flex-wrap:wrap;justify-content:flex-end;align-items:center}
@media (min-width:1101px){.js .ust nav{flex:1 1 auto;min-width:0}}
@media (max-width:1240px){.ust nav a,.diger-dugme{padding-left:.55rem;padding-right:.55rem;font-size:.86rem}}
.ust nav a{display:inline-flex;align-items:center;gap:.45em;
  padding:.5rem .85rem;border-radius:99px;text-decoration:none;color:var(--murekkep);
  font-family:var(--baslik);font-weight:600;font-size:.87rem;white-space:nowrap;
  transition:background var(--gecis),color var(--gecis)}
.ust nav a .ikn{color:var(--marka-parlak)}
.ust nav a:hover,.ust nav a[aria-current]{background:var(--marka-acik);color:var(--marka-parlak)}
:root[data-tema="acik"] .ust nav a:hover,:root[data-tema="acik"] .ust nav a[aria-current]{color:var(--marka-koyu)}
/* "Diğer" taşma menüsü */
.ust-diger{position:relative;flex:none}
.ust-diger[hidden]{display:none}
.diger-dugme{display:inline-flex;align-items:center;gap:.38em;
  padding:.5rem .8rem;border-radius:99px;border:0;background:transparent;cursor:pointer;
  font-family:var(--baslik);font-weight:600;font-size:.87rem;color:var(--murekkep);white-space:nowrap;
  transition:background var(--gecis),color var(--gecis)}
.diger-dugme:hover,.ust-diger.acik .diger-dugme,.diger-dugme[aria-current]{background:var(--marka-acik);color:var(--marka-parlak)}
:root[data-tema="acik"] .diger-dugme:hover,:root[data-tema="acik"] .ust-diger.acik .diger-dugme,:root[data-tema="acik"] .diger-dugme[aria-current]{color:var(--marka-koyu)}
.diger-dugme .ok{transition:transform var(--gecis)}
.ust-diger.acik .diger-dugme .ok{transform:rotate(180deg)}
.diger-panel{position:absolute;top:calc(100% + .5rem);right:0;min-width:13rem;
  display:none;flex-direction:column;gap:.12rem;padding:.5rem;
  background:color-mix(in srgb,var(--zemin) 96%,transparent);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid var(--cizgi);border-radius:14px;box-shadow:0 22px 50px rgba(0,0,0,.5);z-index:60}
.ust-diger.acik .diger-panel{display:flex}
.diger-panel a{display:inline-flex;align-items:center;gap:.55em;padding:.6rem .8rem;border-radius:10px;
  text-decoration:none;color:var(--murekkep);font-family:var(--baslik);font-weight:600;font-size:.9rem;white-space:nowrap}
.diger-panel a .ikn{color:var(--marka-parlak)}
.diger-panel a:hover,.diger-panel a[aria-current]{background:var(--marka-acik);color:var(--marka-parlak)}
:root[data-tema="acik"] .diger-panel a:hover,:root[data-tema="acik"] .diger-panel a[aria-current]{color:var(--marka-koyu)}
#temaDugme,#menuDugme{border:1.5px solid var(--cizgi-koyu);background:var(--yuzey);border-radius:12px;
  width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:1.05rem;line-height:1;color:var(--murekkep);
  box-shadow:var(--golge);
  transition:border-color var(--gecis),transform var(--gecis);flex-shrink:0}
#temaDugme:hover,#menuDugme:hover{border-color:var(--marka-parlak)}
#temaDugme:hover{transform:scale(1.06);color:var(--marka-parlak)}
#temaDugme:active{transform:scale(.94)}
/* Durum göstergesi: koyu temada güneş ("aydınlığa geç"), açık temada ay görünür.
   CSS ile çözüldüğü için doğru ikon ilk boyamada görünür, JS'i beklemez. */
#temaDugme{position:relative}
#temaDugme svg{position:absolute;transition:opacity .22s,transform .28s cubic-bezier(.2,.7,.3,1)}
#temaDugme .tema-gunes{opacity:1;transform:rotate(0) scale(1)}
#temaDugme .tema-ay{opacity:0;transform:rotate(-70deg) scale(.6)}
:root[data-tema="acik"] #temaDugme .tema-gunes{opacity:0;transform:rotate(70deg) scale(.6)}
:root[data-tema="acik"] #temaDugme .tema-ay{opacity:1;transform:rotate(0) scale(1)}
@media (prefers-reduced-motion:reduce){#temaDugme svg{transition:none}}
#menuDugme{display:none}
#menuDugme svg path{transition:transform .25s cubic-bezier(.2,.7,.3,1),opacity .2s;transform-origin:center}
#menuDugme[aria-expanded="true"] .cizgi-1{transform:translateY(5px) rotate(45deg)}
#menuDugme[aria-expanded="true"] .cizgi-2{opacity:0}
#menuDugme[aria-expanded="true"] .cizgi-3{transform:translateY(-5px) rotate(-45deg)}
/* Mobil menü eşiği kategori sayısına bağlıdır: 4 kategoriyle 800px yetiyordu, 6
   kategoriyle menü 1024px'te sağa taşıyor ve sayfaya yatay kaydırma ekliyordu.
   Kategori eklenirse bu eşik yeniden ölçülmeli. */
@media (max-width:1100px){
  .ust-ic{padding:.6rem .9rem;gap:.55rem}
  .logo img{height:34px;border-radius:8px}
  #temaDugme{margin-left:auto;width:40px;height:40px}
  #menuDugme{display:inline-flex;width:40px;height:40px}
  .ust nav{position:absolute;top:100%;left:0;right:0;margin:0;
    flex-direction:column;gap:.15rem;padding:.7rem .9rem 1rem;
    background:color-mix(in srgb,var(--zemin) 96%,transparent);
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
    border-bottom:1px solid var(--cizgi);box-shadow:0 22px 50px rgba(0,0,0,.5);
    display:none}
  .ust nav.acik{display:flex;animation:acil .22s ease-out}
  .ust nav a{padding:.9rem 1rem;border-radius:12px;font-size:1.02rem;
    border:1px solid var(--cizgi);background:var(--cam)}
  .ust nav a .ikn{width:20px;height:20px}
  .ust nav a:hover,.ust nav a[aria-current]{border-color:color-mix(in srgb,var(--marka-parlak) 30%,transparent)}
  /* Mobilde "Diğer" yok: JS tüm kategorileri düz listeye geri koyar; JS yoksa
     bu kurallar taşan linkleri yine düz listeye açar. */
  .ust-diger{display:contents}
  .diger-dugme{display:none}
  .diger-panel{position:static;display:flex!important;min-width:0;padding:0;gap:.15rem;
    background:none;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .diger-panel a{padding:.9rem 1rem;border-radius:12px;font-size:1.02rem;border:1px solid var(--cizgi);background:var(--cam)}
  .diger-panel a .ikn{width:20px;height:20px}
}
.atla{position:absolute;left:-999px}
.atla:focus{position:fixed;left:1rem;top:1rem;background:var(--marka);color:#04110C;
  padding:.6rem 1rem;border-radius:9px;z-index:99}

/* ---- Kırıntı ---- */
.kirinti{font-size:.84rem;color:var(--soluk);padding:.9rem 0 0;
  font-family:var(--baslik);font-weight:600;letter-spacing:.01em}
.kirinti a{color:var(--soluk);text-decoration:none}
.kirinti a:hover{color:var(--marka-parlak)}
.kirinti span[aria-current]{color:var(--murekkep)}

/* ---- Rozetler ---- */
.rozet{display:inline-flex;align-items:center;gap:.4em;font-family:var(--baslik);font-size:.8rem;
  font-weight:600;padding:.32em .85em;border-radius:99px;background:var(--vurgu-acik);
  color:var(--vurgu);border:1px solid color-mix(in srgb,var(--vurgu) 40%,transparent)}
:root[data-tema="acik"] .rozet{color:#8a5a12}
.rozet-yesil{background:var(--marka-acik);color:var(--marka-parlak);
  border-color:color-mix(in srgb,var(--marka) 45%,transparent)}
:root[data-tema="acik"] .rozet-yesil{color:var(--marka-koyu)}
.rozet-mavi{background:color-mix(in srgb,var(--mavi) 15%,transparent);color:var(--mavi);
  border-color:color-mix(in srgb,var(--mavi) 40%,transparent)}
.rozet-mor{background:color-mix(in srgb,var(--mor) 15%,transparent);color:var(--mor);
  border-color:color-mix(in srgb,var(--mor) 40%,transparent)}
/* ---- Kısa cevap kutusu (öne çıkan snippet + AI Overview hedefi) ---- */
.kisa-cevap{margin:1rem 0 1.2rem;padding:.9rem 1.1rem;border-left:4px solid var(--marka);
  background:color-mix(in srgb,var(--marka) 7%,var(--kutu));border-radius:0 var(--radius-k) var(--radius-k) 0}
.kisa-cevap p{margin:0;font-size:1.02rem;line-height:1.65}
/* ---- Sonraki adım çip şeridi (sonuç sonrası ilgili araçlar) ---- */
.sonraki-adim{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:1.1rem 0;
  padding:.75rem .9rem;background:var(--kutu);border:1px solid var(--cizgi);border-radius:var(--radius-k)}
.sa-etiket{font-family:var(--baslik);font-weight:600;font-size:.82rem;color:var(--soluk);margin-right:.15rem}
.sa-cip{font-size:.84rem;padding:.36em .85em;border-radius:99px;background:var(--vurgu-acik);color:var(--vurgu);
  border:1px solid color-mix(in srgb,var(--vurgu) 32%,transparent);text-decoration:none;transition:var(--gecis);white-space:nowrap}
.sa-cip:hover{background:var(--vurgu);color:#1a1205;transform:translateY(-1px)}
.sa-tum{background:transparent;color:var(--marka-parlak);border-color:color-mix(in srgb,var(--marka) 40%,transparent)}
.sa-tum:hover{background:var(--marka);color:#04140d}

/* ---- Panel (hero) ---- */
.panel{position:relative;border-radius:calc(var(--radius) + 8px);overflow:hidden;
  background:
    radial-gradient(760px 420px at 8% -60px,rgba(52,211,153,.17),transparent 55%),
    radial-gradient(640px 380px at 78% -40px,rgba(129,140,248,.16),transparent 55%),
    radial-gradient(520px 300px at 100% 105%,rgba(251,191,36,.10),transparent 55%),
    linear-gradient(165deg,#111A2E 0%,var(--panel) 55%,#0D1420 100%);
  border:1px solid var(--panel-cizgi);
  color:#E7ECF5;box-shadow:var(--golge-buyuk),var(--isima)}
.panel::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(var(--panel-cizgi) 1px,transparent 1px),
    linear-gradient(90deg,var(--panel-cizgi) 1px,transparent 1px);
  background-size:30px 30px;
  -webkit-mask-image:radial-gradient(80% 90% at 45% 8%,#000 25%,transparent 100%);
  mask-image:radial-gradient(80% 90% at 45% 8%,#000 25%,transparent 100%)}
.panel::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--marka-parlak) 25%,var(--mavi) 55%,var(--mor) 75%,transparent);
  animation:cizgiAk 6s ease-in-out infinite alternate;opacity:.95}
@keyframes cizgiAk{from{transform:translateX(-10%)}to{transform:translateX(10%)}}
.panel h1,.panel h2,.panel h3{color:#F2F6FB}
.panel .ic{position:relative;padding:clamp(2rem,5vw,3.6rem);z-index:1}
.panel .soluk{color:#9FB0C4}
.panel a{color:var(--marka-parlak)}

/* ---- Hero düzeni + süzülen mock kart ---- */
.hero-izgara{display:grid;gap:2.4rem;grid-template-columns:1.15fr .85fr;align-items:center}
.hero-izgara > div{min-width:0}
.panel .ic > *{min-width:0}
@media (max-width:860px){.hero-izgara{grid-template-columns:1fr}.hero-mock{display:none}}
.hero-baslik{font-size:clamp(2.3rem,6.5vw,3.8rem);font-weight:700;letter-spacing:-.03em;margin:.15em 0}
.hero-baslik .amp{background:linear-gradient(95deg,var(--marka-parlak),var(--mavi));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.hero-alt{font-size:clamp(1.02rem,2.4vw,1.2rem);color:#9FB0C4;max-width:34rem;margin:.5rem 0 1.4rem}
.hero-ust-not{font-family:var(--baslik);font-weight:600;font-size:.78rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--marka-parlak);display:flex;align-items:center;gap:.6em}
.hero-ust-not::before{content:"";width:2.2rem;height:1px;
  background:linear-gradient(90deg,var(--marka-parlak),transparent)}
/* Dar ekranda üst-not çizgi + flex yüzünden sarınca girintili/kırık görünüyordu.
   Mobilde: çizgiyi üste al (kısa aksan), metni blok olarak sola hizalı sar. */
@media (max-width:600px){
  .hero-ust-not{display:block;position:relative;padding-top:.95rem;
    letter-spacing:.11em;font-size:.72rem;line-height:1.55}
  .hero-ust-not::before{position:absolute;top:0;left:0;width:2rem;height:2px;border-radius:2px}
}
.cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.5rem}
.cta .btn:first-child{animation:nabizGolge 3.2s ease-in-out infinite}
.hero-mock:hover{animation-play-state:paused}
.hero-mock .mock-kart{transition:transform .35s cubic-bezier(.2,.7,.3,1),box-shadow .35s}
.hero-mock:hover .mock-kart{transform:perspective(900px) rotateY(-4deg) rotateX(2deg) scale(1.02);
  box-shadow:0 36px 90px rgba(0,0,0,.65),0 0 70px rgba(16,185,129,.2)}
.hero-mock{position:relative;animation:yuz 7s ease-in-out infinite;will-change:transform}
.mock-kart{background:linear-gradient(170deg,rgba(23,31,48,.94),rgba(16,22,36,.94));
  border:1px solid rgba(148,163,184,.22);border-radius:var(--radius);
  box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 50px rgba(16,185,129,.13);
  padding:1.3rem 1.4rem;backdrop-filter:blur(8px)}
.mock-kart .seri{font-family:var(--baslik);font-weight:600;font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;color:#7C8DA6;display:flex;justify-content:space-between;gap:1rem}
.mock-kart .etiket{font-family:var(--baslik);font-size:.74rem;font-weight:600;color:#9FB0C4;
  text-transform:uppercase;letter-spacing:.12em;margin-top:.9rem}
.mock-kart .buyuk{font-family:var(--baslik);font-weight:700;font-size:2.15rem;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;
  background:linear-gradient(95deg,#34D399,#60A5FA);-webkit-background-clip:text;background-clip:text;color:transparent}
.mock-kart .satir{display:flex;justify-content:space-between;font-size:.85rem;color:#B9C6D8;
  padding:.42rem 0;border-top:1px solid rgba(148,163,184,.13);font-variant-numeric:tabular-nums}
.mock-kart .satir b{font-family:var(--baslik);color:#E7ECF5}
.mock-rozet{position:absolute;right:-14px;top:-16px;z-index:5;background:linear-gradient(120deg,var(--vurgu),#F59E0B);
  color:#221703;font-family:var(--baslik);font-weight:700;font-size:.76rem;letter-spacing:.02em;
  padding:.5em 1.05em;border-radius:99px;box-shadow:0 12px 30px rgba(251,191,36,.5),0 0 0 3px rgba(11,15,24,.55);
  animation:yuz 5.2s .6s ease-in-out infinite}
.hero-mock .mock-kart{position:relative;z-index:1}
.olcum{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:2.4rem;padding-top:1.5rem;
  border-top:1px solid var(--panel-cizgi)}
@media (max-width:700px){.olcum{grid-template-columns:repeat(2,1fr)}}
.olcum .o{min-width:0}
.olcum .deger{font-family:var(--baslik);font-weight:700;font-size:1.5rem;
  font-variant-numeric:tabular-nums;color:#F2F6FB;letter-spacing:-.01em}
.olcum .deger .birim{font-size:.85rem;color:var(--marka-parlak);font-weight:600}
.olcum .ad{font-size:.78rem;color:#7C8DA6;letter-spacing:.06em;text-transform:uppercase;
  font-family:var(--baslik);font-weight:600}

/* ---- Sezon şeridi ---- */
.sezon{display:flex;gap:.8rem;overflow-x:auto;padding:.6rem 0;margin:1.4rem 0;scrollbar-width:none}
.sezon::-webkit-scrollbar{display:none}
.sezon a{flex:0 0 auto;display:flex;align-items:center;gap:.55rem;background:var(--cam);
  border:1px solid var(--cizgi);border-radius:99px;padding:.55rem 1.05rem;text-decoration:none;
  font-family:var(--baslik);font-weight:600;font-size:.86rem;color:var(--murekkep);white-space:nowrap;
  transition:border-color var(--gecis),transform var(--gecis),background var(--gecis)}
.sezon a:hover{border-color:var(--marka-parlak);transform:translateY(-1px);background:var(--marka-acik);color:var(--murekkep)}
.sezon .ikn{color:var(--marka-parlak)}

/* ---- Form ---- */
.arac{background:linear-gradient(170deg,color-mix(in srgb,var(--yuzey) 92%,var(--mor) 3%),var(--yuzey));
  border:1px solid var(--cizgi);border-radius:var(--radius);
  box-shadow:var(--golge-buyuk);padding:clamp(1.2rem,3vw,1.8rem);margin:1.2rem 0;position:relative}
.arac::before{content:"";position:absolute;inset:0 0 auto;height:3px;border-radius:var(--radius) var(--radius) 0 0;
  background:linear-gradient(90deg,var(--marka-parlak),var(--mavi) 60%,var(--mor))}
/* Dengeli form ızgarası: yetim alan tam satıra yayılmaz, hep eş kolonlar */
.alanlar{display:grid;gap:1.1rem;grid-template-columns:repeat(2,1fr)}
.alanlar.uclu{grid-template-columns:repeat(3,1fr)}
@media (max-width:700px){.alanlar,.alanlar.uclu{grid-template-columns:1fr}}
.alan label{display:block;font-family:var(--baslik);font-size:.86rem;font-weight:600;margin-bottom:.35rem}
.alan .ipucu{font-size:.78rem;color:var(--soluk);font-weight:400;font-family:var(--govde)}
.alan input,.alan select{width:100%;min-height:50px;padding:.6rem .85rem;font-size:16px;
  color:var(--murekkep);background:color-mix(in srgb,var(--zemin) 70%,var(--yuzey));
  border:1.5px solid var(--cizgi-koyu);border-radius:var(--radius-k);
  transition:border-color var(--gecis),box-shadow var(--gecis),background var(--gecis);
  font-variant-numeric:tabular-nums;color-scheme:dark}
:root[data-tema="acik"] .alan input,:root[data-tema="acik"] .alan select{color-scheme:light}
.alan input:hover,.alan select:hover{border-color:color-mix(in srgb,var(--marka-parlak) 55%,var(--cizgi-koyu))}
.alan input:focus,.alan select:focus{outline:none;border-color:var(--marka-parlak);background:var(--yuzey);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--marka) 22%,transparent)}
.alan .hata-mesaj{display:none;font-size:.82rem;color:var(--hata);margin-top:.3rem}
.alan.hatali input{border-color:var(--hata);box-shadow:0 0 0 4px color-mix(in srgb,var(--hata) 15%,transparent)}
.alan.hatali .hata-mesaj{display:block}
.para{position:relative}
.para::after{content:"₺";position:absolute;right:.9rem;top:50%;transform:translateY(-50%);
  color:var(--soluk);pointer-events:none;font-family:var(--baslik);font-weight:600}
.para input{padding-right:2.1rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:50px;
  padding:.7rem 1.8rem;font-size:1.02rem;font-weight:600;font-family:var(--baslik);letter-spacing:.005em;
  color:#04110C;background:linear-gradient(120deg,#34D399 0%,#10B981 60%,#0EA5A0 100%);
  border:0;border-radius:99px;cursor:pointer;text-decoration:none;position:relative;
  box-shadow:0 10px 30px rgba(16,185,129,.28),inset 0 1px 0 rgba(255,255,255,.25);
  transition:transform var(--gecis),box-shadow var(--gecis),filter var(--gecis)}
.btn:hover{filter:brightness(1.08);transform:translateY(-1px);
  box-shadow:0 14px 40px rgba(16,185,129,.42),inset 0 1px 0 rgba(255,255,255,.25);color:#04110C}
.btn:active{transform:translateY(0) scale(.985)}
.btn-ikincil{background:var(--cam);color:var(--murekkep);border:1.5px solid var(--cizgi-koyu);box-shadow:none}
.btn-ikincil:hover{background:var(--marka-acik);border-color:var(--marka-parlak);color:var(--murekkep);filter:none;box-shadow:none}
.btn-kucuk{min-height:40px;padding:.45rem 1.1rem;font-size:.88rem}
details.gelismis{margin:1.1rem 0 0;border-top:1px dashed var(--cizgi-koyu);padding-top:.9rem}
details.gelismis summary{cursor:pointer;font-family:var(--baslik);font-weight:600;
  font-size:.9rem;color:var(--marka-parlak);list-style:none;display:flex;align-items:center;gap:.5em}
:root[data-tema="acik"] details.gelismis summary{color:var(--marka)}
details.gelismis summary::before{content:"+";font-size:1.15em;transition:transform var(--gecis)}
details.gelismis[open] summary::before{transform:rotate(45deg)}
details.gelismis > div{margin-top:.9rem}

/* ---- Sonuç kartı: "hesap belgesi" ---- */
.sonuc-alan{min-height:15rem;margin:1.2rem 0}
.sonuc-bos{min-height:15rem;display:flex;flex-direction:column;gap:.6rem;align-items:center;
  justify-content:center;text-align:center;color:var(--soluk);
  border:1.5px dashed var(--cizgi-koyu);border-radius:var(--radius);padding:1.2rem;background:var(--cam)}
.sonuc-bos .ikn{color:var(--marka-parlak);opacity:.75}
.sonuc-kart{position:relative;background:linear-gradient(170deg,color-mix(in srgb,var(--yuzey) 90%,var(--marka) 4%),var(--yuzey));
  border:1px solid var(--cizgi);
  border-radius:var(--radius);box-shadow:var(--golge-buyuk),var(--isima);
  padding:1.4rem 1.5rem 1.2rem;margin:0 0 1.1rem;overflow:hidden;
  animation:belir .55s cubic-bezier(.2,.7,.3,1) both}
.sonuc-kart:nth-of-type(2){animation-delay:.12s}
.sonuc-kart::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--marka-parlak),var(--mavi))}
.sonuc-kart::after{content:"";position:absolute;right:-36px;top:-36px;width:130px;height:130px;
  background:radial-gradient(circle,rgba(52,211,153,.14),transparent 70%);pointer-events:none}
.sonuc-seri{position:absolute;right:1.05rem;top:.9rem;font-family:var(--baslik);font-weight:600;
  font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;color:var(--soluk)}
.sonuc-etiket{font-family:var(--baslik);font-size:.78rem;font-weight:600;color:var(--soluk);
  text-transform:uppercase;letter-spacing:.13em;display:flex;align-items:center;gap:.5em}
.sonuc-etiket::before{content:"";width:1.4rem;height:1px;background:var(--marka-parlak)}
.sonuc-rakam{font-size:clamp(2.2rem,6.5vw,3.3rem);font-weight:700;font-family:var(--baslik);
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin:.12em 0;
  background:linear-gradient(95deg,var(--marka-parlak),var(--mavi));
  -webkit-background-clip:text;background-clip:text;color:transparent}
:root[data-tema="acik"] .sonuc-rakam{background:linear-gradient(95deg,var(--marka-koyu),var(--marka));
  -webkit-background-clip:text;background-clip:text}
.sonuc-detay{width:100%;border-collapse:collapse;margin:.9rem 0 0;font-size:.95rem}
.sonuc-detay td{padding:.5rem 0;border-top:1px solid var(--cizgi)}
.sonuc-detay tr:last-child td{border-top:1.5px solid var(--cizgi-koyu);padding-top:.65rem}
.sonuc-detay td.r{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;font-family:var(--baslik);font-size:.92rem}
.aksiyonlar{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:1.1rem}

/* ---- Uyarı / bilgi / formül ---- */
.uyari{background:var(--vurgu-acik);border:1px solid color-mix(in srgb,var(--vurgu) 35%,transparent);
  border-left:3px solid var(--vurgu);border-radius:var(--radius-k);
  padding:.85rem 1.05rem;font-size:.92rem;margin:1.1rem 0}
.bilgi{background:var(--marka-acik);border:1px solid color-mix(in srgb,var(--marka) 30%,transparent);
  border-left:3px solid var(--marka-parlak);border-radius:var(--radius-k);
  padding:.85rem 1.05rem;font-size:.95rem;margin:1.1rem 0}
.formul-kart{background:linear-gradient(165deg,#111A2E,var(--panel));color:#C9D5E4;
  border:1px solid var(--panel-cizgi);border-radius:var(--radius);
  padding:1.1rem 1.3rem;margin:1.1rem 0;font-variant-numeric:tabular-nums;position:relative;overflow:hidden}
.formul-kart::before{content:"ƒ";position:absolute;right:.9rem;top:.2rem;font-family:var(--baslik);
  font-size:2.6rem;font-weight:700;color:rgba(148,163,184,.12)}
.formul-kart code{font-size:.98rem;background:rgba(148,163,184,.12);padding:.2em .5em;
  border-radius:6px;color:#A7F3D0}
.formul-kart p{margin:.5em 0}

/* ---- Tablolar ---- */
.tablo-sar{overflow-x:auto;margin:1.1rem 0;-webkit-overflow-scrolling:touch;
  border-radius:var(--radius);box-shadow:var(--golge)}
table.veri{width:100%;border-collapse:collapse;font-size:.95rem;background:var(--yuzey);
  border:1px solid var(--cizgi);border-radius:var(--radius);overflow:hidden}
table.veri th{text-align:left;font-family:var(--baslik);font-weight:600;font-size:.78rem;
  letter-spacing:.07em;text-transform:uppercase;
  background:linear-gradient(120deg,#111A2E,var(--panel));color:#AEBDD1;padding:.7rem .9rem}
table.veri td{padding:.6rem .9rem;border-top:1px solid var(--cizgi)}
table.veri tr:hover td{background:var(--marka-acik)}
table.veri td.r,table.veri th.r{text-align:right;font-variant-numeric:tabular-nums}

/* ---- SSS ---- */
details.sss{border:1px solid var(--cizgi);border-radius:var(--radius-k);background:var(--cam);
  padding:0 1.15rem;margin:.65rem 0;transition:border-color var(--gecis),background var(--gecis)}
details.sss:hover{border-color:var(--cizgi-koyu);background:var(--yuzey)}
details.sss[open]{border-color:color-mix(in srgb,var(--marka-parlak) 45%,var(--cizgi));background:var(--yuzey)}
details.sss summary{cursor:pointer;font-family:var(--baslik);font-weight:600;font-size:.98rem;
  padding:.95rem 0;list-style:none;position:relative;padding-right:2.2rem}
details.sss summary::-webkit-details-marker{display:none}
details.sss summary::after{content:"+";position:absolute;right:.2rem;top:.72rem;
  font-size:1.35rem;color:var(--marka-parlak);transition:transform var(--gecis)}
details.sss[open] summary::after{transform:rotate(45deg)}
details.sss > p{margin-top:0;padding-bottom:1.05rem;color:color-mix(in srgb,var(--murekkep) 82%,var(--soluk))}
details.sss[open] > p{animation:acil .3s ease-out both}

/* ---- Araç kartları ---- */
/* Eş oranlı kart ızgarası: 3-2-1 kırılım, yetim kart yayılmaz */
.kart-grid{display:grid;gap:1rem;grid-template-columns:repeat(3,1fr);margin:1.1rem 0}
@media (max-width:900px){.kart-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.kart-grid{grid-template-columns:1fr}}
.arac-kart{display:block;background:var(--cam);border:1px solid var(--cizgi);border-radius:var(--radius);
  padding:1.2rem;text-decoration:none;color:var(--murekkep);
  position:relative;overflow:hidden;
  transition:transform var(--gecis),border-color var(--gecis),box-shadow var(--gecis),background var(--gecis)}
.arac-kart::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,var(--marka-parlak),var(--mavi),var(--mor));
  transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.arac-kart:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--marka-parlak) 50%,var(--cizgi));
  background:var(--yuzey);box-shadow:var(--golge-buyuk),var(--isima);color:var(--murekkep)}
.arac-kart:hover::after{transform:scaleX(1)}
.arac-kart .ikon{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.arac-kart:hover .ikon{transform:scale(1.12) rotate(-5deg)}
.arac-kart h3{margin:.6rem 0 .3rem;font-size:1.04rem}
.arac-kart p{margin:0;font-size:.87rem;color:var(--soluk);line-height:1.5}
.arac-kart .ikon{width:42px;height:42px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,var(--marka-acik),rgba(96,165,250,.12));
  color:var(--marka-parlak);border:1px solid color-mix(in srgb,var(--marka-parlak) 25%,transparent);border-radius:12px}
:root[data-tema="acik"] .arac-kart .ikon{color:var(--marka-koyu)}
.arac-kart[aria-disabled]{opacity:.55;pointer-events:none}
.arac-kart .rozet{position:absolute;right:.9rem;top:.9rem}

/* ---- Bölüm başlığı ---- */
.bolum-bas{display:flex;align-items:baseline;gap:.8rem;margin:2.6rem 0 .2rem;flex-wrap:wrap}
.bolum-bas h2{margin:0}
.bolum-bas .no{font-family:var(--baslik);font-weight:700;font-size:.78rem;
  background:linear-gradient(95deg,var(--marka-parlak),var(--mavi));
  -webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:.16em}
.bolum-bas a{margin-left:auto;font-family:var(--baslik);font-weight:600;font-size:.86rem;text-decoration:none}

/* ---- Güven şeridi ---- */
.nedenler{display:grid;gap:1rem;grid-template-columns:repeat(3,1fr);margin:2.4rem 0}
@media (max-width:800px){.nedenler{grid-template-columns:1fr}}
.nedenler .kutu{background:var(--cam);border:1px solid var(--cizgi);border-radius:var(--radius);
  padding:1.2rem;transition:border-color var(--gecis),background var(--gecis)}
.nedenler .kutu:hover{border-color:var(--cizgi-koyu);background:var(--yuzey)}
.nedenler .kutu .ikn{color:var(--marka-parlak);margin-bottom:.4rem}
.nedenler .kutu strong{font-family:var(--baslik);display:block;margin-bottom:.2rem}
.nedenler .kutu p{margin:.2em 0 0;font-size:.9rem;color:var(--soluk)}

/* ---- Reklam slotları ---- */
.reklam-slot{margin:1.4rem 0;background:var(--cam);
  border-radius:var(--radius);overflow:hidden;
  display:flex;align-items:center;justify-content:center;position:relative}
.reklam-slot::before{content:"Reklam";position:absolute;top:.35rem;left:.7rem;
  font-family:var(--baslik);font-size:.62rem;font-weight:600;color:var(--soluk);
  text-transform:uppercase;letter-spacing:.09em;pointer-events:none}
.reklam-yatay{min-height:100px}
.reklam-dikdortgen{min-height:290px}
@media (max-width:640px){.reklam-yatay{min-height:110px}.reklam-dikdortgen{min-height:260px}}
.reklam-hazir{border:1px solid var(--cizgi);
  background:repeating-linear-gradient(45deg,var(--cam) 0 14px,transparent 14px 28px)}
.reklam-hazir .reklam-orta{font-family:var(--baslik);font-weight:600;font-size:.74rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--soluk);opacity:.75}

/* ---- Kaynaklar ---- */
.kaynaklar{font-size:.88rem;color:var(--soluk);border-top:1px solid var(--cizgi);margin-top:2.4rem;padding-top:1.1rem}
.kaynaklar ul{padding-left:1.2rem}
.guncelleme{font-size:.85rem;color:var(--soluk);margin:1rem 0}

/* ---- Footer: kurumsal ızgara ----
   Sütunlar kayıt defterinin 'vitrin' listesinden (kategori başına tam 8) basılır;
   eşit yükseklik ve hizalı "Tüm N araç →" satırı bu sayede garanti. */
/* Footer her iki temada da koyu kalır (sayfanın çapası), bu yüzden zemin rengi
   var(--zemin)'e DEĞİL sabit koyu renge bağlıdır. Önceden var(--zemin) kullanılıyordu
   ve açık temada footer soluk griye dönüyordu. */
.alt-bilgi{background:
    radial-gradient(120% 100% at 50% 0,rgba(29,220,160,.07),transparent 60%),
    linear-gradient(180deg,#0D1220,#090D15);
  color:#AEBDD1;margin-top:4rem;position:relative;overflow:hidden;
  border-top:1px solid rgba(148,163,184,.14)}
.alt-bilgi::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,var(--marka-parlak),var(--mavi) 50%,var(--mor))}

/* ŞERİT 1 — marka + güven rozetleri.
   Marka artık kategori ızgarasının PARÇASI DEĞİL. Önceden aynı ızgarada 1.7fr'lik bir
   sütundu; kategori sayısı 4'ten 6'ya çıkınca ikinci satırın ilk kategorisi o 1.7fr'yi
   miras alıp diğerlerinden geniş kalıyordu. Ayrı şerit bu bağı tamamen koparır. */
.alt-tepe{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:1.6rem 2.5rem;padding-top:3rem;padding-bottom:1.9rem;
  border-bottom:1px solid rgba(148,163,184,.13)}
.alt-marka{display:flex;align-items:center;gap:1.15rem;min-width:0;flex:1 1 22rem}
.alt-marka img{display:block;width:132px;height:auto;border-radius:11px;flex:none}
.alt-vaat{font-size:.875rem;line-height:1.6;margin:0;max-width:23rem;color:#AEBDD1}
.alt-vaat strong{color:#EDF1EC;font-weight:600}

.alt-rozetler{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.alt-rozetler li{display:flex;align-items:center;gap:.45rem;font-size:.79rem;color:#9FB1C7;
  background:rgba(148,163,184,.06);border:1px solid rgba(148,163,184,.13);
  border-radius:999px;padding:.42rem .82rem;line-height:1;white-space:nowrap}
.alt-rozetler svg{flex:none;color:var(--marka-parlak);opacity:.9}
.alt-rozet-baglanti{padding:0;background:none;border-color:transparent}
.alt-rozet-baglanti a{display:flex;align-items:center;gap:.45rem;
  padding:.42rem .82rem;border-radius:999px;text-decoration:none;color:#9FB1C7;
  background:rgba(148,163,184,.06);border:1px solid rgba(148,163,184,.13);
  transition:color var(--gecis),border-color var(--gecis),background var(--gecis)}
.alt-rozet-baglanti a:hover{color:#EDF1EC;border-color:rgba(52,211,153,.45);
  background:rgba(52,211,153,.09)}

/* ŞERİT 2 — araç bağlantı ızgarası.
   Sütun sayısı kategori sayısının BÖLENLERİNDEN seçilir (6 → 6/3/2/1), böylece son
   satırda öksüz sütun kalmaz. Kategori sayısı değişirse buradaki eşikler gözden
   geçirilmeli; auto-fit kullanılmamasının sebebi tam da öksüz sütunu önlemektir. */
.alt-ag{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2.1rem 1.5rem;align-items:start;
  padding-top:2.3rem;padding-bottom:2.4rem}
/* align-items:start KULLANILMAZ. Varsayılan stretch sayesinde aynı satırdaki sütunlar
   eşit yükseklikte olur ve .alt-tum'daki margin-top:auto "Tüm N araç" bağlantılarını
   aynı hizaya oturtur. start ile, bir bağlantı adı iki satıra sardığında o sütunun
   alt bağlantısı komşularından yukarıda kalıyordu (dar ekranda görünür bir kayma). */

.alt-kolon{display:flex;flex-direction:column;min-width:0}
.alt-kolon .baslik{display:flex;align-items:center;gap:.42rem;
  font-family:var(--baslik);font-weight:600;font-size:.7rem;
  text-transform:uppercase;letter-spacing:.11em;color:#8FA3BB;
  padding-bottom:.65rem;margin-bottom:.55rem;border-bottom:1px solid rgba(148,163,184,.16)}
.alt-kolon .baslik span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.alt-kolon .baslik svg{flex:none;color:var(--marka-parlak);opacity:.85}
.alt-kolon ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.04rem}
.alt-kolon li{margin:0}
.alt-kolon a{display:block;color:#D6E0EC;text-decoration:none;font-size:.845rem;line-height:1.32;
  padding:.28rem 0 .28rem .6rem;margin-left:-.6rem;border-radius:6px;
  border-left:2px solid transparent;
  transition:color var(--gecis),border-color var(--gecis),padding-left var(--gecis)}
.alt-kolon a:hover,.alt-kolon a:focus-visible{color:var(--marka-parlak);
  border-left-color:var(--marka-parlak);padding-left:.76rem}
.alt-kolon .alt-tum{margin-top:auto;padding-top:.85rem;color:var(--marka-parlak);
  font-family:var(--baslik);font-weight:600;font-size:.775rem;border-left:0;margin-left:0;
  white-space:nowrap}
.alt-kolon .alt-tum:hover{border-left-color:transparent;padding-left:0;color:#EDF1EC}
.alt-kolon .alt-tum span{display:inline-block;transition:transform var(--gecis)}
.alt-kolon .alt-tum:hover span{transform:translateX(3px)}

/* --- kurumsal şerit --- */
.alt-serit{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:.8rem 1.6rem;padding-top:1.25rem;padding-bottom:1.25rem;
  border-top:1px solid rgba(148,163,184,.16)}
.alt-kurumsal{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem}
.alt-kurumsal a{color:#AEBDD1;text-decoration:none;font-size:.83rem;
  transition:color var(--gecis)}
.alt-kurumsal a:hover{color:var(--marka-parlak)}
.alt-ajans{margin:0;font-size:.83rem;color:#8FA3BB}
.alt-ajans a{color:#F97316;font-weight:600;text-decoration:none}
.alt-ajans a:hover{color:#FB923C;text-decoration:underline}

/* --- açık tema düzeltmesi ---
   :root[data-tema="acik"] a{color:var(--marka)} kuralı (özgüllük 0,2,1) footer'daki
   .alt-kolon a (0,1,1) kuralını eziyordu: koyu footer zemininde okunmayan yeşil linkler.
   Footer her iki temada da KOYU kaldığı için renkler burada geri alınır. */
:root[data-tema="acik"] .alt-bilgi a{color:#D6E0EC}
:root[data-tema="acik"] .alt-bilgi a:hover,
:root[data-tema="acik"] .alt-bilgi a:focus-visible{color:var(--marka-parlak)}
:root[data-tema="acik"] .alt-kolon .alt-tum{color:var(--marka-parlak)}
:root[data-tema="acik"] .alt-kolon .alt-tum:hover{color:#EDF1EC}
:root[data-tema="acik"] .alt-kurumsal a{color:#AEBDD1}
:root[data-tema="acik"] .alt-kurumsal a:hover{color:var(--marka-parlak)}
:root[data-tema="acik"] .alt-rozet-baglanti a{color:#9FB1C7}
:root[data-tema="acik"] .alt-rozet-baglanti a:hover{color:#EDF1EC}
:root[data-tema="acik"] .alt-ajans a{color:#F97316}
:root[data-tema="acik"] .alt-ajans a:hover{color:#FB923C}

/* --- kapanış --- */
.alt-kapanis{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:.5rem 1.6rem;padding-top:1rem;padding-bottom:1.6rem;
  border-top:1px solid rgba(148,163,184,.1);font-size:.79rem;color:#7C8DA6}
.alt-uyari{max-width:46rem}

/* --- duyarlı davranış: sütun sayısı hep 6'nın böleni --- */
@media (max-width:1180px){
  .alt-ag{grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem 1.6rem}
}
@media (max-width:860px){
  .alt-tepe{padding-top:2.6rem;padding-bottom:1.6rem}
  .alt-marka{flex:1 1 100%}
  .alt-rozetler{flex:1 1 100%}
}
@media (max-width:640px){
  /* Mobilde tek sütun 6x8 = 48 bağlantılık bir duvar üretiyordu (footer 2.640 px).
     İki sütun yüksekliği yarıya indirir ve hizayı korur. */
  .alt-ag{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.7rem 1.1rem;
    padding-top:1.9rem;padding-bottom:2rem}
  .alt-kolon .baslik{font-size:.66rem;letter-spacing:.08em;gap:.34rem}
  .alt-kolon a{font-size:.815rem;padding-top:.32rem;padding-bottom:.32rem}
  .alt-kolon .alt-tum{font-size:.75rem;padding-top:.7rem}
  /* Mobilde marka şeridi ve alt şeritler ORTALANIR; kategori sütunları sola hizalı
     kalır (ortalanmış bağlantı listesi göz için takip edilemez olur). */
  .alt-marka{flex-direction:column;align-items:center;text-align:center;gap:.85rem}
  .alt-marka img{width:118px}
  .alt-vaat{max-width:30rem}
  .alt-rozetler{gap:.42rem;justify-content:center}
  .alt-rozetler li,.alt-rozet-baglanti a{font-size:.745rem;padding:.38rem .7rem}
  .alt-serit,.alt-kapanis{flex-direction:column;align-items:center;text-align:center}
  .alt-kurumsal{gap:.35rem 1.1rem;justify-content:center}
  .alt-uyari{max-width:34rem}
}
/* 360 px telefonlar iki sütun görsün; tek sütun yalnız çok dar (320 px) ekranlarda. */
@media (max-width:344px){
  .alt-ag{grid-template-columns:1fr}
}


/* ---- Bebek ismi bulucu ---- */
.isim-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.8rem;margin:.4rem 0}
.isim-kart{background:var(--cam);border:1px solid var(--cizgi);border-radius:var(--radius-k);padding:.9rem 1rem;
  transition:border-color var(--gecis),background var(--gecis)}
.isim-kart:hover{border-color:var(--cizgi-koyu);background:var(--yuzey)}
.fav-btn{border:0;background:none;cursor:pointer;font-size:1.35rem;line-height:1;color:var(--soluk);
  padding:0 .1rem;transition:color var(--gecis),transform var(--gecis)}
.fav-btn:hover{transform:scale(1.15)}
.fav-btn.aktif{color:#F472B6}
#btnFavori.aktif{background:var(--marka-acik);border-color:var(--marka-parlak);color:var(--marka-parlak)}

/* ---- İlgili ---- */
.ilgili{margin:2.2rem 0}

/* ---- Print ---- */
@media print{
  .ust,.alt-bilgi,.reklam-slot,.aksiyonlar,.kirinti,nav,.ilgili,.sezon,#temaDugme,.sonuc-bos,.hero-mock{display:none!important}
  body{background:#fff!important;color:#000;font-size:11pt;background-image:none!important}
  .sonuc-kart,.arac,.formul-kart{box-shadow:none;border:1px solid #999;break-inside:avoid;background:#fff}
  .formul-kart{color:#000}
  .formul-kart code{background:#eee;color:#000}
  .sonuc-rakam{-webkit-background-clip:initial;background-clip:initial;background:none;color:#000}
  .sonuc-detay td,.sonuc-seri,.sonuc-etiket{color:#333}
  .print-damga{display:block!important;margin-top:1.5rem;padding-top:.5rem;
    border-top:1px solid #999;font-size:9pt;color:#555}
}
.print-damga{display:none}


/* ===== Mobil mega-menü (hamburger) ===== */
.mobil-menu{display:none}
@media (min-width:1101px){.mobil-menu{display:none!important}}
@media (max-width:1100px){
  /* Eski nav-dropdown yerine yeni mega-menü kullanılıyor: nav'ı mobilde gizle. */
  .ust nav#anaMenu{display:none!important}

  .mobil-menu{position:fixed;left:0;right:0;bottom:0;top:60px;z-index:45;
    background:var(--zemin);overflow-y:auto;-webkit-overflow-scrolling:touch;
    border-top:1px solid var(--cizgi);overscroll-behavior:contain}
  .mobil-menu.acik{display:block;animation:mmGir .2s ease-out}
}
@keyframes mmGir{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.mm-ic{padding:1rem .95rem 2.4rem;max-width:40rem;margin:0 auto}

/* Arama */
.mm-ara-sar{position:relative;display:flex;align-items:center;margin-bottom:1.1rem}
.mm-ara-ikon{position:absolute;left:.9rem;color:var(--soluk);pointer-events:none}
.mm-ara{width:100%;padding:.9rem 2.6rem .9rem 2.7rem;border-radius:13px;
  border:1.5px solid var(--cizgi-koyu);background:var(--yuzey);color:var(--murekkep);
  font-size:1rem;font-family:var(--govde)}
.mm-ara::placeholder{color:var(--soluk)}
.mm-ara:focus{outline:none;border-color:var(--marka-parlak);box-shadow:0 0 0 3px var(--marka-acik)}
.mm-ara-temizle{position:absolute;right:.55rem;width:30px;height:30px;border:0;background:none;
  color:var(--soluk);font-size:1.5rem;line-height:1;cursor:pointer;border-radius:50%}
.mm-ara-temizle:hover{color:var(--murekkep)}
.mm-bos{padding:1.4rem 1rem;color:var(--soluk);text-align:center;font-size:.92rem}

/* Kategori akordeonu */
.mm-kat{border-bottom:1px solid var(--cizgi)}
.mm-kat-bas{width:100%;display:flex;align-items:center;gap:.75rem;padding:.98rem .35rem;
  background:none;border:0;cursor:pointer;color:var(--murekkep);
  font-family:var(--baslik);font-weight:600;font-size:1.04rem;text-align:left}
.mm-kat-ikon{display:inline-flex;color:var(--marka-parlak);flex:none}
.mm-kat-ad{flex:1;min-width:0}
.mm-kat-say{font-size:.72rem;font-weight:700;color:var(--soluk);background:var(--cam);
  border:1px solid var(--cizgi);border-radius:99px;padding:.12rem .55rem;flex:none}
.mm-kat-ok{color:var(--soluk);transition:transform var(--gecis);flex:none}
.mm-kat.acik .mm-kat-ok{transform:rotate(180deg)}
.mm-kat.acik .mm-kat-bas{color:var(--marka-parlak)}
.mm-kat.acik .mm-kat-say{color:var(--marka-parlak);border-color:color-mix(in srgb,var(--marka-parlak) 35%,transparent)}
.mm-araclar{display:none;padding:.1rem 0 .85rem}
.mm-kat.acik .mm-araclar{display:block}
.mm-tum{display:block;padding:.55rem .85rem;margin-bottom:.35rem;font-family:var(--baslik);
  font-weight:600;font-size:.82rem;color:var(--marka-parlak);text-decoration:none;
  border-left:2px solid var(--marka-parlak)}
.mm-tum:hover{background:var(--marka-acik)}
.mm-arac{display:block;padding:.64rem .85rem;color:#C7D2E0;text-decoration:none;
  font-size:.95rem;line-height:1.3;border-radius:9px}
.mm-arac:hover,.mm-arac:active{background:var(--marka-acik);color:var(--marka-parlak)}
.mm-arac[hidden],.mm-kat[hidden]{display:none}
mark.mm-vur{background:transparent;color:var(--marka-parlak);font-weight:700}

/* Alt kurumsal linkler */
.mm-alt{display:flex;flex-wrap:wrap;gap:.4rem 1.3rem;padding:1.3rem .35rem 0;margin-top:.7rem;
  border-top:1px solid var(--cizgi)}
.mm-alt a{color:var(--soluk);text-decoration:none;font-size:.86rem}
.mm-alt a:hover{color:var(--marka-parlak)}

/* Açık tema uyumları */
:root[data-tema="acik"] .mm-arac{color:#33414f}
body.mm-kilit{overflow:hidden}