/* =====================================================================
   Hızlı Okuyucu — içerik sayfaları ve ortak parçalar için stil.
   index.html Tailwind kullanıyor; burada çakışmayı önlemek için tüm
   kurallar ya değişken tanımı ya da "site-" / "icerik-" önekli sınıflar.
   ===================================================================== */

:root{
  --bg:#080b12;
  --surface:#111726;
  --surface-2:#1a2233;
  --border:#232c40;
  --text:#e8edf7;
  --muted:#8a93a8;
  --accent:#f43f5e;
  --accent-soft:rgba(244,63,94,.14);
  --brand:#818cf8;
}
html.light{
  --bg:#f4f6fb;
  --surface:#ffffff;
  --surface-2:#eef1f8;
  --border:#e0e5ef;
  --text:#141a26;
  --muted:#5f6a80;
  --accent:#e11d48;
  --accent-soft:rgba(225,29,72,.10);
  --brand:#4f46e5;
}

/* ---------------- İçerik sayfası gövdesi ---------------- */
body.icerik-sayfasi{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
.icerik-kapsayici{ max-width:52rem; margin:0 auto; padding:1.25rem 1rem 4rem; }

/* ---------------- Üst bar ---------------- */
.site-ust{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap;
  padding:.75rem 0 1.5rem;
}
.site-marka{
  display:inline-flex; align-items:center; gap:.6rem;
  font-weight:600; text-decoration:none; color:var(--text); font-size:1rem;
}
.site-marka span[aria-hidden]{
  display:grid; place-items:center; width:2rem; height:2rem;
  border-radius:.6rem; background:var(--accent-soft); color:var(--accent);
}
.site-nav{ display:flex; gap:1.1rem; flex-wrap:wrap; }
.site-nav a{
  color:var(--muted); text-decoration:none; font-size:.875rem;
  padding:.25rem 0; border-bottom:1px solid transparent;
}
.site-nav a:hover{ color:var(--text); }
.site-nav a[aria-current="page"]{ color:var(--text); border-bottom-color:var(--accent); }

/* ---------------- Metin ---------------- */
.icerik h1{ font-size:1.85rem; line-height:1.25; margin:.5rem 0 .35rem; letter-spacing:-.01em; }
.icerik h2{ font-size:1.2rem; margin:2.25rem 0 .5rem; letter-spacing:-.01em; }
.icerik h3{ font-size:1rem; margin:1.5rem 0 .35rem; }
.icerik p, .icerik li{ color:var(--text); }
.icerik .ozet{ color:var(--muted); font-size:1.02rem; margin-top:0; }
.icerik a{ color:var(--brand); }
.icerik ul, .icerik ol{ padding-left:1.2rem; }
.icerik li{ margin:.35rem 0; }
.icerik hr{ border:0; border-top:1px solid var(--border); margin:2.5rem 0; }
.icerik code{
  background:var(--surface-2); padding:.12rem .35rem;
  border-radius:.3rem; font-size:.9em;
}
.icerik table{ width:100%; border-collapse:collapse; margin:1rem 0; font-size:.92rem; }
.icerik th, .icerik td{ border:1px solid var(--border); padding:.5rem .6rem; text-align:left; }
.icerik th{ background:var(--surface-2); font-weight:600; }
.tablo-kaydir{ overflow-x:auto; }

.kutu{
  background:var(--surface); border:1px solid var(--border);
  border-radius:.9rem; padding:1rem 1.15rem; margin:1.25rem 0;
}
.kutu p:first-child{ margin-top:0; }
.kutu p:last-child{ margin-bottom:0; }

.cta{
  display:inline-block; background:var(--accent); color:#fff;
  text-decoration:none; font-weight:600; font-size:.925rem;
  padding:.65rem 1.15rem; border-radius:.75rem; margin-top:.5rem;
}
.cta:hover{ opacity:.9; }

/* ---------------- Reklam alanı ----------------
   Etiket, Google'ın "reklamlar içerikten ayırt edilebilir olmalı"
   kuralı için. Yer tutucu kimlik doldurulmadıysa reklam.js bu
   bloğu tamamen gizler, boş kutu görünmez.                       */
.reklam-alani{
  margin:2rem 0;
  padding-top:.35rem;
  min-height:0;
  text-align:center;
}
.reklam-etiket{
  display:block; font-size:.65rem; letter-spacing:.08em;
  text-transform:uppercase; color:var(--muted); margin-bottom:.35rem;
}
.reklam-alani ins{ display:block; }

/* ---------------- Alt bilgi ---------------- */
.site-alt{
  margin-top:3rem; padding-top:1.25rem;
  border-top:1px solid var(--border);
  font-size:.82rem; color:var(--muted);
}
.site-alt nav{ display:flex; gap:.9rem; flex-wrap:wrap; margin-bottom:.6rem; }
.site-alt a{ color:var(--muted); text-decoration:none; }
.site-alt a:hover{ color:var(--text); text-decoration:underline; }
.site-alt p{ margin:.35rem 0 0; }

/* ---------------- Makale listesi kartları ---------------- */
.makale-kart{
  border-bottom:1px solid var(--border);
  padding:1.1rem 0;
}
.makale-kart:last-of-type{ border-bottom:0; }
.makale-kart h2{
  margin:0 0 .35rem;
  font-size:1.12rem;
  line-height:1.35;
}
.makale-kart h2 a{
  color:var(--text);
  text-decoration:none;
}
.makale-kart h2 a:hover{ color:var(--accent); }
.makale-kart p{
  margin:.25rem 0;
  color:var(--muted);
  font-size:.94rem;
}
.makale-tarih{
  font-size:.8rem !important;
  opacity:.75;
}

/* Atlama bağlantısı: klavyeyle gezinenler menüyü atlayıp içeriğe geçebilsin */
.atla{
  position:absolute; left:-9999px;
  background:var(--accent); color:#fff;
  padding:.6rem 1rem; border-radius:0 0 .5rem 0; z-index:100;
}
.atla:focus{ left:0; top:0; }