/* ═══════════════════════════════════════════════════════════════════════════
   İÇ SAYFALAR — ortak tasarım.

   Tanıtım sayfası dışarıdan gelen 1440 piksel sabit bir dışa aktarımdı ve
   satır içi stillerle doluydu. İç sayfalar ONA BENZEMESİN diye değil, aynı
   dili konuşsun diye buradaki değişkenlerle yazıldı: aynı renkler, aynı
   yarıçap, aynı yazı tipi — ama akışkan ve okunur işaretleme.

   ⚠️ Renk ve ölçüler tanıtım sayfasından ÖLÇÜLEREK alındı; iki taraf
      ayrışmasın diye burada değişken olarak duruyor.
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
  --z:#F6F4EF;          /* sayfa zemini */
  --k:#FFFFFF;          /* kart */
  --k2:#FAF9F6;         /* ikincil zemin */
  --cz:#E7E4DB;         /* kenarlık */
  --cz2:#F0EEE7;        /* iç ayraç */
  --ink:#16211C;        /* başlık */
  --ink2:#2C3E36;       /* gövde */
  --ink3:#5C6660;       /* ikincil */
  --ink4:#7C857E;       /* soluk */
  --ak:#143126;         /* koyu yeşil — birincil */
  --ak2:#1C4032;
  --ak-ink:#2C5E45;     /* açık zeminde yeşil metin */
  --ak-yum:#E7EFE8;     /* yumuşak yeşil zemin */
  --uy-ink:#8A5A1E; --uy-yum:#F6EFE1;
  --sans:'Plus Jakarta Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%}
body{background:var(--z);color:var(--ink2);font-family:var(--sans);
  font-size:15px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:var(--ak-ink);text-decoration:none}
a:hover{text-decoration:underline}
svg{display:block}
::selection{background:var(--ak-yum)}

/* ⚠️ GENİŞLİK VE DOLGU ANA SAYFAYLA AYNI (1440 / 60px). Eskiden 1140/28px
   idi: ana sayfa 1436px, iç sayfalar 1140px çiziliyordu ve menüde gezerken
   logo ile menü her geçişte ~150px kayıyordu (ölçüldü). Ana sayfa sabit
   1440 bir dışa aktarım; onu daraltmak menüyü sardırıp hero görselini
   kırpıyor (denendi) — o yüzden dar olan değil GENİŞ olan taban alındı. */
.kap{width:100%;max-width:1440px;margin:0 auto;padding:0 60px}
/* Ana sayfanın kırılım noktasıyla aynı (site.css:87). */
@media(max-width:1100px){ .kap{padding:0 26px} }

/* ── başlık şeridi ── */
.ust{background:var(--k);border-bottom:1px solid var(--cz);position:sticky;top:0;z-index:20}
.ust .kap{display:flex;align-items:center;gap:34px;height:64px}
.marka{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.marka:hover{text-decoration:none}
.marka i{width:28px;height:28px;border-radius:8px;background:var(--ak);flex:none;
  display:flex;align-items:center;justify-content:center;gap:1.5px}
.marka i b{display:block;width:2px;height:12px;background:#EDEAE1;border-radius:1px}
.marka i b:nth-child(2),.marka i b:nth-child(4){width:1px}
.marka i b:nth-child(3){width:3px}
.marka span{font-size:15.5px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.ust nav{display:flex;align-items:center;gap:24px;margin-right:auto}
.ust nav a{font-size:13.5px;font-weight:500;color:var(--ink3)}
.ust nav a:hover{color:var(--ink);text-decoration:none}
.ust nav a.on{color:var(--ink);font-weight:600}
.ust .dugler{display:flex;align-items:center;gap:9px;flex:0 0 auto}

.dug{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:40px;padding:0 18px;border-radius:11px;font-size:13.5px;font-weight:600;
  border:1px solid var(--cz);background:var(--k);color:var(--ink);white-space:nowrap}
.dug:hover{background:var(--k2);text-decoration:none}
.dug.ana{background:var(--ak);border-color:var(--ak);color:#fff}
.dug.ana:hover{background:var(--ak2)}
.dug.kucuk{height:34px;padding:0 14px;font-size:12.5px}

/* ── sayfa başı ── */
.bas{padding:56px 0 8px}
.eyebrow{display:inline-block;background:var(--ak-yum);color:var(--ak-ink);
  font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:6px 11px;border-radius:7px}
.bas h1{margin:20px 0 0;font-size:44px;line-height:1.1;font-weight:700;
  letter-spacing:-.025em;color:var(--ink);max-width:16ch}
.bas .lead{margin:18px 0 0;font-size:16.5px;line-height:1.68;color:var(--ink3);max-width:62ch}

/* ── bölümler ── */
section.blok{padding:44px 0 0}
section.blok>h2{margin:0 0 6px;font-size:26px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
section.blok>p.alt{margin:0 0 22px;font-size:14.5px;color:var(--ink3);max-width:70ch}

.izgara{display:grid;gap:16px}
.izgara.iki{grid-template-columns:repeat(2,minmax(0,1fr))}
.izgara.uc{grid-template-columns:repeat(3,minmax(0,1fr))}

.kart{background:var(--k);border:1px solid var(--cz);border-radius:14px;padding:22px}
.kart h3{margin:0 0 8px;font-size:16px;font-weight:700;letter-spacing:-.012em;color:var(--ink)}
.kart p{margin:0;font-size:14px;line-height:1.62;color:var(--ink3)}
.kart .ikon{width:34px;height:34px;border-radius:10px;background:var(--ak-yum);
  display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.kart ul{margin:12px 0 0;padding-left:0;list-style:none}
.kart li{position:relative;padding-left:18px;font-size:13.5px;line-height:1.6;
  color:var(--ink3);margin-top:6px}
.kart li::before{content:'';position:absolute;left:2px;top:9px;width:5px;height:5px;
  border-radius:50%;background:var(--ak-ink);opacity:.55}

/* ── bilgi/uyarı şeridi ── */
.serit{display:flex;gap:11px;background:var(--uy-yum);border:1px solid #E8DCC4;
  border-radius:12px;padding:14px 16px;font-size:13.5px;line-height:1.6;color:var(--uy-ink)}
.serit svg{flex:none;margin-top:3px}
.serit b{font-weight:700}
.serit.duz{background:var(--k2);border-color:var(--cz);color:var(--ink3)}

/* ── tablo ── */
.tab{width:100%;background:var(--k);border:1px solid var(--cz);border-radius:14px;
  overflow:hidden;border-collapse:collapse}
.tab th,.tab td{text-align:left;padding:12px 16px;font-size:13.5px;
  border-bottom:1px solid var(--cz2);vertical-align:top}
.tab th{background:var(--k2);font-size:11.5px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink4)}
.tab tr:last-child td{border-bottom:0}
.tab td b{color:var(--ink);font-weight:600}
.tab code,.satirici{font-family:var(--mono);font-size:12.5px;color:var(--ink);
  background:var(--k2);border:1px solid var(--cz);border-radius:6px;padding:1px 6px}
.tab-sar{overflow-x:auto;border-radius:14px}

/* ── kod ── */
.kod{background:var(--ak);border-radius:14px;overflow:hidden}
.kod .kod-bas{display:flex;align-items:center;gap:10px;padding:11px 16px;
  border-bottom:1px solid rgba(255,255,255,.1)}
.kod .yon{font-family:var(--mono);font-size:11.5px;font-weight:700;color:#9DC7AC;
  background:rgba(157,199,172,.14);border-radius:6px;padding:3px 8px}
.kod .yol{font-family:var(--mono);font-size:12.5px;color:#D6DED8}
.kod pre{margin:0;padding:16px;overflow-x:auto;font-family:var(--mono);
  font-size:12.5px;line-height:1.75;color:#CFE0D5;white-space:pre}
.kod .anh{color:#9DC7AC}
.kod .dz{color:#E5C98A}
.kod .sy{color:#EDE7D6}

/* ── alt bilgi ──
   ⚠️ Kurallar `footer.alt` ile SINIRLI. Yalnız `.alt` yazılıydı ve bölüm alt
      başlıkları da (`section.blok>p.alt`) beyaz zemin alıyordu — ekranda
      metnin arkasında kutu gibi görünüyordu (ölçüldü). İki farklı şey için
      aynı sınıf adı; kapsam daraltıldı. */
footer.alt{margin-top:56px;border-top:1px solid var(--cz);background:var(--k)}
footer.alt .kap{display:flex;gap:34px;flex-wrap:wrap;padding-top:30px;padding-bottom:30px}
footer.alt .sut{display:flex;flex-direction:column;gap:7px;min-width:140px}
footer.alt .sut b{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ink4);margin-bottom:2px}
footer.alt .sut a{font-size:13.5px;color:var(--ink3)}
footer.alt .sut a:hover{color:var(--ink)}
footer.alt .not{flex:1 1 260px;font-size:12.5px;line-height:1.65;color:var(--ink4)}

@media(max-width:900px){
  .izgara.uc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bas h1{font-size:36px;max-width:none}
  .ust nav{display:none}
}
@media(max-width:640px){
  .kap{padding:0 18px}
  .izgara.iki,.izgara.uc{grid-template-columns:minmax(0,1fr)}
  .bas{padding:36px 0 4px}
  .bas h1{font-size:30px}
  .bas .lead{font-size:15px}
  section.blok{padding:34px 0 0}
  section.blok>h2{font-size:21px}
  .ust .kap{gap:8px}
  .marka span{font-size:14px}
  .dug{height:36px;padding:0 13px;font-size:12.5px}
  /* ⚠️ TELEFONDA YATAY KAYDIRMA VARDI. Başlık çubuğu `nowrap`: logo(134) +
     düğmeler(304) + boşluk = 484px, oysa 375px ekranda 371px yer var —
     113px taşıyordu (ölçüldü, sayfa 467px genişliğinde kayıyordu).
     Çözüm: kelime-logo gizlenir, işaret kalır; hiçbir bağlantı kaybolmaz. */
  .marka span{display:none}
  .dugler{gap:6px}
}

/* ═══ FİYATLANDIRMA ═══ */
.fiyat-izgara{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;
  align-items:stretch}
.fk{position:relative;display:flex;flex-direction:column;background:var(--k);
  border:1px solid var(--cz);border-radius:16px;padding:24px 22px}
.fk.one{border-color:#B9CDBF;box-shadow:0 10px 30px -18px rgba(20,49,38,.35)}
.fk-rozet{position:absolute;top:-11px;left:22px;background:var(--ak);color:#fff;
  font-size:10.5px;font-weight:700;letter-spacing:.04em;padding:4px 10px;border-radius:7px}
.fk h3{margin:0;font-size:15.5px;font-weight:700;letter-spacing:-.012em;color:var(--ink)}
.fk-fiyat{margin:12px 0 4px;display:flex;align-items:baseline;gap:6px;min-height:44px}
.fk-fiyat .tutar{font-size:34px;font-weight:700;letter-spacing:-.03em;color:var(--ink)}
.fk-fiyat .teklif{font-size:21px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.fk-fiyat .donem{font-size:13px;font-weight:500;color:var(--ink4)}
.fk ul{list-style:none;margin:14px 0 0;padding:0;flex:1 1 auto}
.fk li{position:relative;padding-left:20px;margin-top:8px;font-size:13.5px;
  line-height:1.55;color:var(--ink3)}
.fk li::before{content:'';position:absolute;left:3px;top:7px;width:8px;height:5px;
  border-left:1.8px solid var(--ak-ink);border-bottom:1.8px solid var(--ak-ink);
  transform:rotate(-45deg);opacity:.75}
.fk li b{color:var(--ink);font-weight:700}
.fk-alt{margin-top:20px}
.fk-alt .dug{width:100%}
.bos{font-size:14px;color:var(--ink3)}

@media(max-width:1100px){ .fiyat-izgara{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:620px){ .fiyat-izgara{grid-template-columns:minmax(0,1fr)} }

/* ── talep formu ── */
.talep{display:flex;flex-direction:column;gap:13px}
.talep label{display:flex;flex-direction:column;gap:6px}
.talep label>span{font-size:12.5px;font-weight:600;color:var(--ink3)}
.talep input,.talep select,.talep textarea{width:100%;border:1px solid var(--cz);
  border-radius:10px;background:var(--k);padding:0 12px;height:42px;outline:0;
  font-family:var(--sans);font-size:14px;color:var(--ink)}
.talep textarea{height:auto;padding:10px 12px;resize:vertical;line-height:1.55}
.talep input:focus,.talep select:focus,.talep textarea:focus{
  border-color:#B7C6BB;box-shadow:0 0 0 3px rgba(20,49,38,.08)}
.talep .dug{width:100%;margin-top:4px}
.talep .kucuk{font-size:12px;line-height:1.55;color:var(--ink4)}

/* ═══ GÖRSELLER ═══
   ⚠️ Hepsi SVG ve hepsi KENDİ mantığımızdan üretildi — stok görsel ya da
      başka markanın ekran görüntüsü yok. Sayılar da gerçek: kontrol basamağı
      hesabı sayfada elle yazılmadı, ürünün kullandığı mod-10 kuralıyla
      hesaplandı. */
.gorsel{background:var(--k);border:1px solid var(--cz);border-radius:16px;
  padding:24px;overflow-x:auto}
.gorsel.duz{background:var(--k2)}
.gorsel svg{display:block;margin:0 auto}
.gorsel-bas{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.gorsel-bas b{font-size:14.5px;font-weight:700;color:var(--ink)}
.gorsel-bas span{font-size:12.5px;color:var(--ink4)}
.gorsel-not{margin:14px 0 0;padding-top:13px;border-top:1px solid var(--cz2);
  font-size:12.5px;line-height:1.6;color:var(--ink4)}
.gorsel-not b{color:var(--ink3);font-weight:600}
/* Efsane — renk ne demek. */
.efsane{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;font-size:11.5px;color:var(--ink4)}
.efsane i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:6px;
  vertical-align:baseline}
/* ⚠️ Dar ekranda ÖLÇEKLEMEK YERİNE KAYDIRMAK.
   Ölçüldü (390px): çizimler kutuya sığsın diye 0,53 kata inince 12,5px
   metin 6,6px'e düşüyordu — okunmuyordu. Artık çizim okunabilir boyda
   kalıyor, kutu yana kayıyor. Rakamı okunmayan çizimin bilgi değeri sıfır. */
@media(max-width:640px){
  .gorsel{padding:16px}
  .gorsel svg{min-width:520px;margin:0}
  .gorsel-bas span::after{content:' · yana kaydırın';color:var(--ink4)}
}

/* ── numaralı adımlar ── */
.adimlar{list-style:none;counter-reset:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.adimlar li{display:flex;gap:14px;background:var(--k);border:1px solid var(--cz);
  border-radius:14px;padding:18px 20px}
.adimlar .no{flex:none;width:26px;height:26px;border-radius:8px;background:var(--ak);
  color:#fff;font-size:12.5px;font-weight:700;display:flex;align-items:center;
  justify-content:center;margin-top:1px}
.adimlar b{display:block;font-size:14.5px;font-weight:700;color:var(--ink)}
.adimlar p{margin:5px 0 0;font-size:13.5px;line-height:1.58;color:var(--ink3)}

/* ── vurgu bloğu ──
   Sayfayı kartlarla doldurmamak için: tek cümlelik, büyük puntolu bir duruş. */
.vurgu{background:var(--ak);border-radius:18px;padding:34px 38px}
.vurgu b{display:block;font-size:23px;line-height:1.42;font-weight:700;
  letter-spacing:-.02em;color:#fff;max-width:34ch}
.vurgu p{margin:14px 0 0;font-size:14px;line-height:1.65;
  color:rgba(255,255,255,.66);max-width:60ch}

@media(max-width:820px){ .adimlar{grid-template-columns:minmax(0,1fr)} }
@media(max-width:640px){
  .vurgu{padding:24px}
  .vurgu b{font-size:19px}
}

/* ═══ HUKUK SAYFALARI ═══
   Gizlilik / şartlar / künye: uzun metin. Satır uzunluğu okunabilirlik için
   dar tutulur — 1440px'lik kolonda göz satır başını kaybediyor. */
.kap.dar{max-width:760px}
.kap.dar .blok p{font-size:14.5px;line-height:1.72;color:var(--ink3);margin:0 0 14px}
.kap.dar .blok h2{font-size:19px;margin-bottom:14px}

.hukuk-liste{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:9px}
.hukuk-liste li{font-size:14.5px;line-height:1.65;color:var(--ink3)}

/* Künye alanları — tanım listesi, iki sütun. */
.kunye-liste{display:grid;grid-template-columns:170px minmax(0,1fr);gap:10px 20px;margin:0}
.kunye-liste dt{font-size:13px;font-weight:600;color:var(--ink4)}
.kunye-liste dd{margin:0;font-size:14.5px;color:var(--ink)}
/* ⚠️ Doldurulmamış alan UYDURULMAZ, açıkça eksik gösterilir. Sahte adres ya
   da sicil numarası yazmak, künyeyi hiç koymamaktan daha kötüdür. */
.kunye-liste dd.bos-alan{color:var(--uy,#8A5A1E);font-style:italic}
@media(max-width:560px){
  .kunye-liste{grid-template-columns:minmax(0,1fr);gap:3px 0}
  .kunye-liste dd{margin-bottom:10px}
}

/* ═══ DİL SEÇİCİ ═══
   ⚠️ Bayrak KULLANILMAZ. Bayrak ülkeyi gösterir, dili değil: Almanca'yı
      Avusturya'da da konuşuyorlar, İngilizce bayrağı diye bir şey yok.
      Dilin kendi adı, kendi dilinde yazılır — arayanlar onu arar. */
.dil-sec{display:flex;align-items:center;gap:2px;margin-right:6px;
  background:var(--k2);border:1px solid var(--cz);border-radius:9px;padding:2px}
.dil-sec a{font-size:11.5px;font-weight:600;color:var(--ink4);
  padding:4px 7px;border-radius:6px;line-height:1;white-space:nowrap}
.dil-sec a:hover{color:var(--ink);background:var(--k);text-decoration:none}
.dil-sec a.on{color:var(--ink);background:var(--k);
  box-shadow:0 1px 2px rgba(0,0,0,.05)}
/* ⚠️ EŞİK 900 DEĞİL 1320. Ölçüldü: 1280px'de beş dilin tam adı başlık
   şeridini 1308px'e taşırıyor ve "Kostenlos starten" düğmesi kesiliyordu.
   Tam ad ancak gerçekten yer varken gösterilir. */
@media(max-width:1320px){
  /* Tam ad yerine İKİ HARFLİ KOD: "Deutsch" değil "DE".
     ⚠️ İlk harfi göstermek yetmez — English ve Español ikisi de "E". */
  .dil-sec a{font-size:0;padding:5px 6px}
  .dil-sec a::after{content:attr(data-kod);font-size:11px;letter-spacing:.02em}
}
@media(max-width:820px){ .dil-sec{display:none} }

/* Sayfa başındaki eylem düğmeleri — kahraman metninin hemen altında. */
.bas-dug{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}