/* Blog indeksi + yazi sayfasi — mavi_build.py uretir, elle duzenleme.
   Kart/govde stilleri style.css'te zaten var; burasi yalnizca EKLER. */
.blog-page{padding-top:76px}
.blog-hero .wrap{padding-bottom:clamp(40px,6vh,72px)}
.blog-hero .sec-title{margin-bottom:14px}

/* ⚠️ Menu blog sayfalarinda HER ZAMAN koyu-yazi ("scrolled") gorunumunde kalmali.
   Sebep: .nav'in varsayilan hali BEYAZ yazi — ana sayfadaki koyu hero gorseli icin
   tasarlanmis. Blog sayfasinda hero yok, zemin krem. JS her scroll'da
   toggle('scrolled', scrollY>40) calistirdigi icin sayfa basina donunce sinifi
   SILIYOR ve menu krem zeminde kremlesip kayboluyordu. Sinifa guvenme, CSS ile sabitle. */
.blog-page .nav{background:rgba(250,247,240,.94);backdrop-filter:blur(12px);
  box-shadow:0 1px 0 rgba(45,74,158,.12)}
.blog-page .nav .brand{color:var(--ink)}
.blog-page .nav .brand span{color:var(--gold)}
.blog-page .nav .nav-links a{color:var(--ink-soft)}
.blog-page .nav .nav-links a:hover{color:var(--mavi)}
.blog-page .nav .nav-cta{color:var(--mavi)!important;border-color:var(--mavi)}
.blog-page .nav .nav-cta:hover{background:var(--gold);border-color:var(--gold);color:#fff!important}
.blog-page .nav .burger{color:var(--ink)}
.blog-page .nav .lang a{border-color:rgba(45,74,158,.4);color:var(--mavi)}
.blog-page .nav .lang a:hover{background:var(--mavi);border-color:var(--mavi);color:#fff}

/* kirinti + geri donus */
.crumbs{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);
  font-weight:700;margin-bottom:18px}
.crumbs a{color:var(--ink-faint);text-decoration:none}
.crumbs a:hover{color:var(--mavi)}
.post-back{display:inline-block;margin-top:26px;color:var(--mavi);font-weight:700;
  font-size:14px;letter-spacing:.04em;text-decoration:none}
.post-back:hover{text-decoration:underline}

/* yazi basi gorseli */
.post-hero{margin:26px 0 34px;border-radius:6px;overflow:hidden;
  box-shadow:0 18px 40px rgba(35,41,70,.10)}
.post-hero img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block}

/* yazi govdesinde style.css'te olmayan ogeler */
.blog-body h3{font-size:21px;margin:26px 0 8px}
.blog-body ul,.blog-body ol{margin:0 0 18px 22px;color:var(--ink-soft)}
.blog-body li{margin-bottom:8px}
.blog-body strong{color:var(--ink);font-weight:700}
.blog-body em{font-style:italic}
.blog-body a{color:var(--mavi);border-bottom:1px solid rgba(45,74,158,.35);text-decoration:none}
.blog-body blockquote{border-left:3px solid var(--gold);padding:4px 0 4px 20px;margin:24px 0;
  font-family:var(--serif);font-style:italic;font-size:21px;color:var(--ink)}
.blog-body table{width:100%;border-collapse:collapse;margin:24px 0;font-size:15px}
.blog-body th,.blog-body td{padding:11px 12px;border-bottom:1px solid rgba(35,41,70,.12);
  text-align:left;color:var(--ink-soft)}
.blog-body th{color:var(--gold);font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;font-size:12px}

.blog-more .wrap{padding-top:clamp(48px,7vh,80px)}

@media(max-width:700px){
  .blog-page{padding-top:64px}
  .blog-body{padding-top:104px}
  /* dar ekranda tablo sayfayi degil kendini kaydirsin */
  .blog-body table{display:block;overflow-x:auto;white-space:nowrap}
  .blog-body td,.blog-body th{white-space:normal;min-width:120px}
}