/* =====================================================================
   Kalenta — ortak stil
   =====================================================================
   🔴 TEK KAYNAK. Once her sayfanin kendi <style> blogu vardi ve ayni
   renk BES dosyada birden yaziliydi. Bu projede tam olarak bu kalip
   (ayni deger birden cok yerde yasarsa sessizce ayrisir) defalarca
   soruna yol acti - `CLAUDE.md` "Ayar-kod ayrismasi".

   ⚠️ Dis adrese HICBIR istek yok: yazi tipi sistemden geliyor, simgeler
   SVG olarak gomulu, gorseller kendi alan adimizda. Her dis istek
   ziyaretcinin IP'sini ucuncu tarafa gonderir; "bu sitede ziyaretci
   takibi yok" diyen bir sitenin bunu yapmasi celiskidir.
   ===================================================================== */

:root{
  color-scheme:light dark;
  --zemin:#FFFFFF;
  --yuzey:#F5F5F2;
  --ink:#1B1D1C;
  --govde:#555B57;
  --soluk:#7D827D;
  --accent:#0E7365;
  --accent-ink:#0B5F53;
  --uyari:#C2410C;
  --iz:#E2E2DA;
  --golge:0 1px 2px rgba(27,29,28,.05), 0 8px 24px -12px rgba(27,29,28,.14);
  --cerceve:#1B1D1C;
}
@media (prefers-color-scheme:dark){
  :root{
    --zemin:#121413;
    --yuzey:#1B1E1C;
    --ink:#F1F2EF;
    --govde:#AFB5B0;
    --soluk:#878D89;
    --accent:#3FBFAB;
    --accent-ink:#5FD0BE;
    --uyari:#F0793F;
    --iz:#2C302D;
    --golge:0 1px 2px rgba(0,0,0,.4), 0 10px 30px -14px rgba(0,0,0,.7);
    --cerceve:#2C302D;
  }
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--zemin);color:var(--ink);
  font:17px/1.7 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,
       'Helvetica Neue',Arial,sans-serif;
  -webkit-text-size-adjust:100%;
  font-feature-settings:'kern' 1;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent-ink);text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;
  border-radius:6px}

/* ---------------- ic sayfa kabugu ---------------- */
/* Ic sayfalar tersine boyanir: zemin hafif tonlu, kart beyaz. Ana sayfa
   `.ic` sinifini TASIMAZ, o yuzden etkilenmez. */
.ic{background:var(--yuzey)}
.ic .kart{background:var(--zemin)}
/* Ana sayfa bu genisligi kendi <style> blogunda EZER (1060px). Sirasi
   onemli: <link> once, sayfa ici <style> sonra. */
.kabuk{max-width:760px;margin:0 auto;padding:34px 22px 76px}
.kabuk.odak{max-width:560px;padding-top:52px}

.kilit{display:flex;align-items:center;gap:10px;margin-bottom:28px;
  text-decoration:none;color:inherit}
.kabuk.odak .kilit{justify-content:center}
.kilit svg{width:36px;height:36px;display:block;flex:none}
.kilit b{font-size:20px;letter-spacing:-.025em}

.kart{
  background:var(--yuzey);border:1px solid var(--iz);border-radius:22px;
  padding:30px 26px;border-top:4px solid var(--accent);
  box-shadow:var(--golge);
}
.kabuk.odak .kart{text-align:center;padding:34px 26px}
.kart.uyari{border-top-color:var(--uyari)}

h1{font-size:clamp(23px,4.4vw,29px);line-height:1.22;letter-spacing:-.025em;
  margin:0 0 6px;font-weight:800}
h2{font-size:19.5px;margin:34px 0 10px;padding-top:24px;
  border-top:1px solid var(--iz);letter-spacing:-.015em}
h2:first-of-type{border-top:0;padding-top:0;margin-top:24px}
h3{font-size:16.5px;margin:24px 0 8px;letter-spacing:-.01em}
p,li{color:var(--govde)}
p:first-of-type{margin-top:0}
strong{color:var(--ink)}
ul,ol{padding-left:22px}
code{background:var(--zemin);border:1px solid var(--iz);padding:2px 6px;
  border-radius:6px;font-size:14px}
hr{border:0;border-top:1px solid var(--iz);margin:30px 0}

/* ---------------- tablolar ---------------- */
/* Genis icerik kendi kutusu icinde kayar; sayfa govdesi yatay kaymaz. */
.tablo{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:16px 0}
table{border-collapse:collapse;width:100%;font-size:15px;min-width:420px}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--iz);
  vertical-align:top}
th{color:var(--ink);font-weight:600;white-space:nowrap}
td{color:var(--govde)}

/* ---------------- dugmeler ---------------- */
.eposta,.dugme{
  display:inline-block;margin:8px 0 4px;padding:14px 28px;
  background:var(--accent);color:#FFFFFF;text-decoration:none;
  font-weight:600;border-radius:13px;
}
@media (prefers-color-scheme:dark){
  .eposta,.dugme{color:#0B1614}
}

/* ---------------- dogrulama rozeti ---------------- */
/* 🔴 `.kart` ile kapsandi. Ana sayfada da `.rozet` var ama o bir HAP
   (yakinda-magazada etiketi); kapsam olmadan bu 64px'lik daire onu
   eziyordu. Ayni ad, iki farkli bilesen - kapsam sart. */
.kart .rozet{width:64px;height:64px;margin:0 auto 18px;border-radius:32px;
  background:color-mix(in srgb, var(--accent) 16%, transparent);
  display:flex;align-items:center;justify-content:center}
.kart.uyari .rozet{background:color-mix(in srgb, var(--uyari) 16%, transparent)}
.kart .rozet svg{width:32px;height:32px;display:block}
.ipucu{font-size:14.5px;color:var(--soluk);margin-top:18px}
.gizli{display:none}

/* ---------------- alt bilgi ---------------- */
.dip{margin-top:28px;font-size:13.5px;color:var(--soluk);text-align:center}
.dip a{color:var(--soluk)}

@media(max-width:520px){
  .kabuk{padding:22px 16px 58px}
  .kart{padding:24px 18px}
}
