/* ==========================================================================
   Dergi Anadolu — anasayfa
   Referanslar: haber7.com (üst şerit + manşet slaytı + numaralı sayfalama +
   Gilroy bölüm başlıkları) ve ensonhaber.com (dar konteyner, tek tip kart
   ızgarası, "kategori bloğu" ritmi, yazar karuseli, tam genişlik koyu bant).
   Marka kırmızısı logodan: #E63A30
   ========================================================================== */

/* --- 1. Yazı tipi -------------------------------------------------------- */
@font-face{font-family:Gilroy;src:url(font/Gilroy-Regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Gilroy;src:url(font/Gilroy-Medium.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Gilroy;src:url(font/Gilroy-Bold.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Gilroy;src:url(font/Gilroy-Heavy.woff2) format('woff2');font-weight:800;font-display:swap}

/* --- 2. Değişkenler ------------------------------------------------------ */
:root{
  --kirmizi:#e63a30;
  --kirmizi-koyu:#c42b22;
  --murekkep:#16181d;
  --murekkep-2:#20242c;
  --metin:#1a1c20;
  --metin-2:#454a52;
  --soluk:#767c86;
  --cizgi:#e4e6ea;
  --cizgi-2:#eef0f3;
  --zemin:#fff;
  --zemin-2:#f2f4f7;

  --kap:1200px;
  --bosluk:20px;
  --ara:22px;              /* ızgara boşluğu */
  --yaricap:4px;
  --gezinti-y:50px;

  --font:Gilroy,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --gecis:160ms ease;
}

/* --- 3. Sıfırlama -------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--zemin-2);color:var(--metin);
  font-family:var(--font);font-size:16px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4{margin:0;font-weight:700;line-height:1.28}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--kirmizi);outline-offset:2px}
.gizle{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.kap{width:min(100% - var(--bosluk)*2,var(--kap));margin-inline:auto}
.beyaz{background:var(--zemin)}

/* --- 4. Ortak parçalar --------------------------------------------------- */
.gorsel{
  position:relative;overflow:hidden;background:var(--cizgi-2);
  border-radius:var(--yaricap);
}
.gorsel img{width:100%;height:100%;object-fit:cover;transition:transform 500ms cubic-bezier(.2,.6,.3,1)}
a:hover .gorsel img{transform:scale(1.045)}

/* --- Sığdırma kipi -------------------------------------------------------
   Haber görselleri her zaman 16:9 gelmiyor: afiş, dikey kare, ekran
   görüntüsü… Bunları kırpınca üzerlerindeki yazı kesiliyordu. Bu kipte
   görsel kutuya TAM sığar, arkasına da kendi bulanık kopyası serilir.

   Oranı zaten kutuya uyan fotoğraflarda hiçbir fark oluşmaz — bulanık
   zemin yalnız kenarda boşluk kalırsa görünür. */
.gorsel--sigdir::before{
  content:"";position:absolute;inset:0;
  background-image:var(--foto);background-size:cover;background-position:center;
  filter:blur(22px) saturate(1.15) brightness(.62);transform:scale(1.18);
}
.gorsel--sigdir img{position:relative;object-fit:contain}
a:hover .gorsel--sigdir img{transform:scale(1.02)}
.o-169{aspect-ratio:16/9}
.o-32{aspect-ratio:3/2}
.o-43{aspect-ratio:4/3}
.o-34{aspect-ratio:3/4}

/* kategori rozeti (görsel üzerinde) */
.rozet{
  position:absolute;top:8px;left:8px;z-index:2;
  background:var(--kirmizi);color:#fff;
  font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
  padding:4px 8px;border-radius:2px;
}
.rozet--koyu{background:rgba(0,0,0,.72)}

.us{                                        /* üst etiket (kırmızı, küçük) */
  display:inline-block;color:var(--kirmizi);
  font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
}
.tarih{font-size:12px;font-weight:500;color:var(--soluk)}

/* bölüm başlığı — kalın ad + altında kısa kırmızı çizgi (ensonhaber) */
.bolum-basi{
  display:flex;align-items:flex-end;justify-content:space-between;gap:20px;
  border-bottom:1px solid var(--cizgi);
  margin-bottom:20px;
}
.bolum-basi h2{
  font-size:22px;font-weight:800;letter-spacing:-.01em;
  padding-bottom:10px;border-bottom:3px solid var(--kirmizi);margin-bottom:-1px;
}
.bolum-basi a{
  font-size:13px;font-weight:700;color:var(--soluk);
  display:inline-flex;align-items:center;gap:5px;padding-bottom:12px;
  transition:color var(--gecis);
}
.bolum-basi a:hover{color:var(--kirmizi)}
.bolum-basi a svg{width:12px;height:12px}
.bolum-basi--acik{border-bottom-color:rgba(255,255,255,.16)}
.bolum-basi--acik h2{color:#fff}
.bolum-basi--acik a{color:rgba(255,255,255,.6)}
.bolum-basi--acik a:hover{color:#fff}

/* başlık bağlantısı */
.bag{transition:color var(--gecis)}
a:hover .bag{color:var(--kirmizi)}

/* --- 5. Tepe çizgisi + başlık -------------------------------------------- */
.tepe-cizgi{height:3px;background:var(--kirmizi)}

/* kurumsal bağlantılar için ince üst şerit */
.ust-serit{background:var(--zemin-2);border-bottom:1px solid var(--cizgi)}
.ust-serit__ic{display:flex;align-items:center;gap:20px;height:36px;font-size:12px}
.ust-serit__sol{color:var(--soluk);font-weight:600;white-space:nowrap}
.ust-serit__bag{margin-left:auto;display:flex;gap:22px;min-width:0}
.ust-serit__bag a{font-weight:700;color:var(--metin-2);white-space:nowrap;transition:color var(--gecis)}
.ust-serit__bag a:hover{color:var(--kirmizi)}

.baslik{background:var(--zemin)}
.baslik__ic{display:flex;align-items:center;gap:24px;height:76px}
.baslik__logo img{width:206px}
.baslik__sag{margin-left:auto;display:flex;align-items:center;gap:8px}
.baslik__bilgi{
  display:flex;flex-direction:column;line-height:1.3;text-align:right;
  padding-right:16px;margin-right:8px;border-right:1px solid var(--cizgi);
}
.baslik__bilgi b{font-size:13px;font-weight:800}
.baslik__bilgi span{font-size:12px;color:var(--soluk);font-weight:500}
.ikon{
  width:36px;height:36px;display:grid;place-items:center;border-radius:var(--yaricap);
  color:var(--metin-2);transition:background var(--gecis),color var(--gecis);
}
.ikon:hover{background:var(--zemin-2);color:var(--kirmizi)}
.ikon svg{width:18px;height:18px}

/* --- 6. Gezinti ---------------------------------------------------------- */
.gezinti{
  position:sticky;top:0;z-index:60;background:var(--zemin);
  border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);
}
.gezinti.kaydi{box-shadow:0 6px 18px -12px rgba(0,0,0,.4)}
.gezinti__ic{display:flex;align-items:center;height:var(--gezinti-y);gap:2px}
/* kategoriler ayrı kaydırma kabında: MENÜ düğmesi şeridin dışında kalır,
   dar ekranda üstüne binmez */
.gezinti__kaydir{
  display:flex;align-items:center;flex:1;min-width:0;
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.gezinti__kaydir::-webkit-scrollbar{display:none}
.gezinti__mini{display:none;align-items:center;margin-right:18px}
.gezinti__mini img{width:132px}
.gezinti.kaydi .gezinti__mini{display:flex}
.gezinti a.g-bag{
  position:relative;display:flex;align-items:center;height:var(--gezinti-y);
  padding-inline:12px;font-size:14px;font-weight:700;white-space:nowrap;
  transition:color var(--gecis);
}
.gezinti a.g-bag::after{
  content:"";position:absolute;left:12px;right:12px;bottom:0;height:3px;
  background:var(--kirmizi);transform:scaleX(0);transform-origin:left;
  transition:transform 180ms ease;
}
.gezinti a.g-bag:hover{color:var(--kirmizi)}
.gezinti a.g-bag:hover::after,.gezinti a.g-bag[aria-current="page"]::after{transform:scaleX(1)}
.gezinti a.g-bag[aria-current="page"]{color:var(--kirmizi)}
.menu-dugme{
  margin-left:auto;display:flex;align-items:center;gap:9px;
  font-size:13px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  padding-inline:12px;height:34px;border-radius:var(--yaricap);
  transition:background var(--gecis);
}
.menu-dugme:hover{background:var(--zemin-2)}
.menu-dugme svg{width:17px;height:17px}

/* --- 7. Son eklenen şeridi ----------------------------------------------- */
.serit{background:var(--zemin);border-bottom:1px solid var(--cizgi)}
.serit__ic{display:flex;align-items:center;gap:0;height:44px;overflow:hidden}
.serit__etiket{
  flex-shrink:0;background:var(--kirmizi);color:#fff;
  font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  padding:6px 12px;border-radius:2px;margin-right:16px;
}
.serit__akis{flex:1;min-width:0;position:relative;height:22px}
.serit__akis a{
  position:absolute;inset:0;display:flex;align-items:center;gap:10px;
  font-size:14px;font-weight:700;
  opacity:0;transform:translateY(8px);transition:opacity 400ms,transform 400ms;
}
.serit__akis a.aktif{opacity:1;transform:none}
.serit__akis time{font-size:12px;font-weight:500;color:var(--soluk);flex-shrink:0}
/* kırpma flex çocuğunda min-width:0 olmadan çalışmıyor */
.serit__akis b{font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.serit__tum{flex-shrink:0;font-size:12px;font-weight:700;color:var(--soluk);margin-left:16px}
.serit__tum:hover{color:var(--kirmizi)}

/* --- 8. Reklam ----------------------------------------------------------- */
.reklam{display:block;padding-block:20px;text-align:center}
.reklam span{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#a7adb6;margin-bottom:6px}
.reklam img{width:100%;border-radius:var(--yaricap)}

/* --- 9. Manşet ----------------------------------------------------------- */
.manset{padding-block:22px}
/* Yükseklik SAĞ sütundan gelir (3 kompakt kart); slayt görseli kalanı doldurur.
   Slayta sabit aspect-ratio verilirse sütunlar eşleşmiyor ve altta siyah boşluk kalıyor. */
.manset__ic{
  display:grid;grid-template-columns:minmax(0,2.02fr) minmax(0,1fr);
  gap:var(--ara);align-items:stretch;
}

/* overflow:hidden .slayt'ta DEĞİL kutuda: dış kapta olunca, dar kalan
   yüksekliklerde sayfalama satırı kırpılıyordu. */
.slayt{display:flex;flex-direction:column;background:transparent}
.slayt__kutu{
  position:relative;flex:1 1 auto;min-height:300px;
  border-radius:var(--yaricap) var(--yaricap) 0 0;overflow:hidden;background:#000;
}
.slayt__oge{
  position:absolute;inset:0;opacity:0;visibility:hidden;
  transition:opacity 500ms ease,visibility 500ms;
}
.slayt__oge.aktif{opacity:1;visibility:visible}
/* Manşet: afiş de gelebiliyor, kırpma yerine sığdır + bulanık zemin. */
.slayt__oge img{width:100%;height:100%;object-fit:contain;position:relative}
.slayt__oge::before{content:"";position:absolute;inset:0;
  background-image:var(--foto);background-size:cover;background-position:center;
  filter:blur(26px) saturate(1.1) brightness(.55);transform:scale(1.2)}
.slayt__yazi{
  position:absolute;left:0;right:0;bottom:0;padding:56px 26px 24px;color:#fff;
  background:linear-gradient(to top,rgba(0,0,0,.88) 0%,rgba(0,0,0,.6) 45%,transparent 100%);
}
.slayt__yazi .us{color:#fff;background:var(--kirmizi);padding:4px 8px;border-radius:2px}
.slayt__yazi h2{font-size:30px;font-weight:800;line-height:1.2;margin-top:12px;max-width:24ch}
.slayt__yazi p{margin-top:9px;font-size:14px;color:rgba(255,255,255,.76);max-width:60ch;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* numaralı sayfalama (haber7 kurgusu) — flex-shrink:0, asla sıkışmasın */
.slayt__nokta{display:flex;gap:3px;background:var(--zemin);padding:5px 0 0;flex:0 0 auto}
.slayt__nokta button{
  position:relative;overflow:hidden;
  flex:0 0 52px;height:26px;font-size:12px;font-weight:700;color:var(--soluk);
  background:var(--zemin-2);border-radius:2px;transition:background var(--gecis),color var(--gecis);
}
.slayt__nokta button:hover{background:var(--cizgi)}
.slayt__nokta button[aria-current="true"]{background:var(--kirmizi);color:#fff}
/* geçişe kalan süreyi gösteren dolgu — JS her slaytta yeniden başlatır */
.slayt__ilerleme{
  position:absolute;inset:0;background:rgba(0,0,0,.22);
  transform:scaleX(0);transform-origin:left;pointer-events:none;
}
.slayt__nokta button span{position:relative;z-index:1}
.slayt__ok{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:38px;height:52px;display:grid;place-items:center;
  background:rgba(0,0,0,.42);color:#fff;transition:background var(--gecis);
}
.slayt__ok:hover{background:rgba(0,0,0,.72)}
.slayt__ok--geri{left:0;border-radius:0 3px 3px 0}
.slayt__ok--ileri{right:0;border-radius:3px 0 0 3px}
.slayt__ok svg{width:18px;height:18px}

.manset__yan{display:grid;grid-template-rows:repeat(3,1fr);gap:14px}
.yan-kart{
  display:grid;grid-template-columns:150px minmax(0,1fr);gap:13px;
  min-height:150px;background:var(--zemin);border-radius:var(--yaricap);overflow:hidden;
}
.yan-kart .gorsel{height:100%;border-radius:0}
.yan-kart__yazi{align-self:center;padding:12px 13px 12px 0}
.yan-kart h3{font-size:15px;font-weight:700;line-height:1.34}
.yan-kart .tarih{display:block;margin-top:7px;font-size:11px}

/* --- 10. Kart ızgarası --------------------------------------------------- */
.izgara{padding-block:26px}
.izgara__ic{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--ara) var(--ara)}
.kart .gorsel{aspect-ratio:16/9}
.kart h3{font-size:15px;font-weight:700;line-height:1.36;margin-top:10px}
.kart .tarih{margin-top:6px;display:block}

/* --- 11. Kategori bloğu -------------------------------------------------- */
.kategori{padding-block:26px}
.kategori__ic{display:grid;grid-template-columns:minmax(0,1.28fr) minmax(0,1fr);gap:var(--ara)}
.kategori--ayna .kategori__ic{grid-template-columns:minmax(0,1fr) minmax(0,1.28fr)}
.kategori--ayna .kategori__lider{order:2}
.kategori--ayna .kategori__kucukler{order:1}

.kategori__lider .gorsel{aspect-ratio:3/2}
.kategori__lider h3{font-size:21px;font-weight:800;line-height:1.24;margin-top:13px}
.kategori__lider p{
  margin-top:9px;font-size:14px;color:var(--metin-2);line-height:1.58;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.kategori__lider .tarih{margin-top:9px;display:block}

.kategori__kucukler{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--ara)}

/* --- 11b. Portre dizisi --------------------------------------------------
   Arşivdeki portrelerin çerçeveleri dar; her kırpma yüzü kesiyordu. Görseller
   3:4 tuvale TAMAMI sığacak şekilde, kendi bulanık kopyaları zemin yapılarak
   önceden hazırlandı (p-*-d.jpg). Burada ek kırpma yok.                     */
.portre-dizi{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--ara)}
.portre-kart .gorsel{aspect-ratio:3/4;background:#151515}
.portre-kart h3{font-size:15px;font-weight:700;line-height:1.32;margin-top:11px}
.portre-kart .tarih{display:block;margin-top:5px}
.mini .gorsel{aspect-ratio:16/9}
.mini h3{font-size:14px;font-weight:700;line-height:1.36;margin-top:9px}
.mini .tarih{margin-top:5px;display:block;font-size:11px}

/* --- 12. Koyu bant (Geçmiş Zaman) ---------------------------------------- */
.koyu{background:var(--murekkep);color:#fff;padding-block:34px}
.koyu__giris{
  margin:-8px 0 20px;font-size:14px;color:rgba(255,255,255,.55);max-width:70ch;
}
.koyu__ic{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--ara)}
.eski .gorsel{aspect-ratio:3/4;background:#000}
.eski .gorsel img{filter:grayscale(1) contrast(1.05)}
.eski:hover .gorsel img{filter:grayscale(1) contrast(1.13) brightness(1.06)}
.eski h3{font-size:15px;font-weight:700;line-height:1.32;margin-top:11px;color:#fff}
.eski .tarih{margin-top:5px;display:block;color:rgba(255,255,255,.45)}
.eski:hover h3{color:var(--kirmizi)}

/* --- 13. Yazarlar --------------------------------------------------------
   Küçük künye kartları yerine, yazarın son yazısını da gösteren geniş kartlar. */
.yazarlar{background:var(--zemin-2);padding-block:34px;border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi)}
.yazar-ray-sar{position:relative}
.yazar-ray{
  display:grid;grid-auto-flow:column;grid-auto-columns:minmax(288px,1fr);
  gap:var(--ara);overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;
  padding-bottom:2px;
}
.yazar-ray::-webkit-scrollbar{display:none}

.yazar{
  position:relative;overflow:hidden;scroll-snap-align:start;
  display:block;padding:22px 22px 20px;background:var(--zemin);
  border:1px solid var(--cizgi);border-radius:var(--yaricap);
  transition:border-color var(--gecis),box-shadow var(--gecis),transform var(--gecis);
}
.yazar::before{                              /* soldan çizilen kırmızı vurgu */
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--kirmizi);
  transform:scaleY(0);transform-origin:top;transition:transform 280ms cubic-bezier(.22,.7,.3,1);
}
.yazar:hover{border-color:var(--cizgi-2);box-shadow:0 12px 26px -18px rgba(0,0,0,.35);transform:translateY(-2px)}
.yazar:hover::before{transform:scaleY(1)}
.yazar__tirnak{
  position:absolute;top:6px;right:16px;
  font-size:56px;line-height:1;color:var(--kirmizi);opacity:.12;
  font-weight:800;pointer-events:none;
}

.yazar__ust{display:flex;align-items:center;gap:14px;margin-bottom:16px}
/* Yazar fotoğrafı: daire kırpma kaçınılmaz, o yüzden hem büyütüldü hem de
   kırpma üstten hizalandı — yüz genelde karenin üst yarısında oluyor. */
.yazar__foto{width:78px;height:78px;flex-shrink:0;border-radius:50%;overflow:hidden;background:var(--cizgi-2)}
.yazar__foto img{width:100%;height:100%;object-fit:cover;object-position:center 22%;
  filter:grayscale(1);transition:filter 320ms}
.yazar:hover .yazar__foto img{filter:grayscale(0)}
.yazar__ad{font-size:16px;font-weight:800;line-height:1.24}
.yazar__rol{display:block;font-size:12px;color:var(--kirmizi);font-weight:700;margin-top:4px;letter-spacing:.03em}
.yazar__yazi{
  font-size:15px;font-weight:700;line-height:1.42;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  transition:color var(--gecis);
}
.yazar:hover .yazar__yazi{color:var(--kirmizi)}
.yazar__tarih{display:block;font-size:11px;color:var(--soluk);margin-top:10px;font-weight:500}
.ray-ok{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:34px;height:34px;display:grid;place-items:center;border-radius:50%;
  background:var(--zemin);border:1px solid var(--cizgi);
  box-shadow:0 4px 12px -4px rgba(0,0,0,.2);
  transition:background var(--gecis),color var(--gecis),opacity var(--gecis);
}
.ray-ok:hover{background:var(--kirmizi);color:#fff;border-color:var(--kirmizi)}
.ray-ok[disabled]{opacity:0;pointer-events:none}
.ray-ok--geri{left:-14px}
.ray-ok--ileri{right:-14px}
.ray-ok svg{width:15px;height:15px}

/* --- 13b. Başlıktaki hava / vakit kutucukları ---------------------------- */
.baslik__kutucuk{display:flex;align-items:center;gap:16px;padding-right:16px;margin-right:4px;border-right:1px solid var(--cizgi)}
.baslik__kutucuk > span{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;white-space:nowrap}
.baslik__kutucuk svg{width:19px;height:19px;color:var(--kirmizi);flex-shrink:0}
.baslik__kutucuk small{display:block;font-size:11px;font-weight:500;color:var(--soluk)}

/* --- 13c. Arşivden Bugün ------------------------------------------------- */
.bugun{background:var(--zemin);border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi)}
.bugun__ic{display:grid;grid-template-columns:auto minmax(0,1fr);gap:32px;align-items:center;padding-block:18px}
.bugun__basi{display:flex;align-items:center;gap:12px;padding-right:32px;border-right:1px solid var(--cizgi)}
.bugun__basi svg{width:26px;height:26px;color:var(--kirmizi);flex-shrink:0}
.bugun__basi b{display:block;font-size:15px;font-weight:800;line-height:1.2}
.bugun__basi span{font-size:12px;color:var(--soluk);font-weight:500}
.bugun__liste{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.bugun-oge{display:flex;gap:11px;align-items:flex-start}
.bugun-oge__yil{
  flex-shrink:0;font-size:12px;font-weight:800;color:var(--kirmizi);
  padding-top:1px;font-variant-numeric:tabular-nums;
}
.bugun-oge h3{font-size:13px;font-weight:700;line-height:1.38;transition:color var(--gecis)}
.bugun-oge:hover h3{color:var(--kirmizi)}

/* --- 13d. Son sayı + bülten ---------------------------------------------- */
.sayi{background:var(--murekkep);color:rgba(255,255,255,.7);padding-block:38px}
.sayi__ic{display:grid;grid-template-columns:172px minmax(0,1fr) minmax(0,1fr);gap:34px;align-items:center}
.sayi__kapak{
  border-radius:var(--yaricap);overflow:hidden;box-shadow:0 18px 40px -18px rgba(0,0,0,.75);
  transition:transform 320ms cubic-bezier(.2,.6,.3,1);
}
.sayi__kapak:hover{transform:translateY(-5px)}
.sayi__kapak img{width:100%}
/* Kapak yüklenmemişse kutu çökmesin, yer tutucu dergi oranında dursun */
.sayi__kapak.gorsel--bos{aspect-ratio:3/4;border-radius:var(--yaricap)}
.sayi h2{color:#fff;font-size:22px;font-weight:800;margin-bottom:10px}
.sayi p{font-size:14px;line-height:1.66;max-width:44ch}
.sayi__etiket{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--kirmizi);margin-bottom:9px}
.sayi__dugme{
  display:inline-flex;align-items:center;gap:9px;margin-top:18px;
  height:44px;padding-inline:22px;border-radius:var(--yaricap);
  background:var(--kirmizi);color:#fff;font-size:13px;font-weight:800;
  transition:background var(--gecis);
}
.sayi__dugme:hover{background:var(--kirmizi-koyu)}
.sayi__dugme svg{width:15px;height:15px}
.sayi__bulten{border-left:1px solid rgba(255,255,255,.14);padding-left:34px}
.sayi__bulten form{display:flex;margin-top:16px;border-radius:var(--yaricap);overflow:hidden;background:rgba(255,255,255,.08)}
.sayi__bulten input{flex:1;min-width:0;border:0;background:none;color:#fff;height:46px;padding-inline:16px;font:inherit;font-size:14px}
.sayi__bulten input::placeholder{color:rgba(255,255,255,.38)}
.sayi__bulten input:focus{outline:none}
.sayi__bulten button{padding-inline:20px;background:#fff;color:var(--murekkep);font-size:13px;font-weight:800;transition:background var(--gecis)}
.sayi__bulten button:hover{background:var(--kirmizi);color:#fff}
.sayi__bulten small{display:block;margin-top:11px;font-size:11px;color:rgba(255,255,255,.34)}

/* --- 14. Üçlü liste bloğu ------------------------------------------------ */
.uclu{padding-block:26px}
.uclu__ic{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ara)}
.liste-kutu{border:1px solid var(--cizgi);border-radius:var(--yaricap);background:var(--zemin);padding:18px}
.liste-kutu h2{
  font-size:16px;font-weight:800;padding-bottom:10px;
  border-bottom:2px solid var(--kirmizi);display:inline-block;margin-bottom:4px;
}
.liste-kutu li{border-bottom:1px solid var(--cizgi-2)}
.liste-kutu li:last-child{border-bottom:0}
.liste-kutu li a{display:flex;gap:11px;align-items:flex-start;padding-block:12px;transition:color var(--gecis)}
.liste-kutu li a:hover{color:var(--kirmizi)}
.liste-kutu__no{
  flex-shrink:0;width:20px;height:20px;display:grid;place-items:center;border-radius:2px;
  background:var(--zemin-2);color:var(--soluk);font-size:11px;font-weight:800;margin-top:1px;
}
.liste-kutu li a:hover .liste-kutu__no{background:var(--kirmizi);color:#fff}
.liste-kutu h3{font-size:14px;font-weight:700;line-height:1.36}
.liste-kutu .tarih{display:block;margin-top:4px;font-size:11px}

/* --- 15. Alt ------------------------------------------------------------- */
.alt{background:var(--murekkep);color:rgba(255,255,255,.62)}
.alt__ust{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:34px;padding-block:40px}
/* Panelden kaldırılan sütunun yeri boş kalmaz: kalan sütunlar sağa yaslanır,
   marka bloğu solda aynı genişlikte durur (dar ekranda sıra zaten akıyor) */
@media (min-width:1081px){
  .alt__ust--2 > :nth-child(2){grid-column-start:3}
  .alt__ust--1 > :nth-child(2){grid-column-start:4}
}
.alt__marka img{width:216px;margin-bottom:16px}
.alt__ust p{font-size:14px;line-height:1.68}
.alt h4{color:#fff;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px}
.alt li+li{margin-top:9px}
.alt li a{font-size:14px;transition:color var(--gecis)}
.alt li a:hover{color:var(--kirmizi)}
.alt__sosyal{display:flex;gap:8px;margin-top:18px}
.alt__sosyal a{
  width:34px;height:34px;display:grid;place-items:center;border-radius:var(--yaricap);
  background:rgba(255,255,255,.08);transition:background var(--gecis);
}
.alt__sosyal a:hover{background:var(--kirmizi);color:#fff}
.alt__sosyal svg{width:15px;height:15px}
.alt__son{
  border-top:1px solid rgba(255,255,255,.1);padding-block:18px;
  display:flex;flex-wrap:wrap;gap:16px;align-items:center;font-size:12px;color:rgba(255,255,255,.4);
}
.alt__son div{margin-left:auto;display:flex;flex-wrap:wrap;gap:20px}
.alt__son a:hover{color:#fff}
/* Yapımcı imzası — telif satırının hemen yanında, ondan bir tık belirgin */
.alt__son{gap:6px 16px}
.alt__imza{color:rgba(255,255,255,.62);font-weight:700}
.alt__imza:hover{color:var(--kirmizi)}

/* --- 16. Menü katmanı ---------------------------------------------------- */
.perde{position:fixed;inset:0;z-index:110;background:rgba(10,12,15,.55);opacity:0;visibility:hidden;transition:opacity 220ms,visibility 220ms}
.perde.acik{opacity:1;visibility:visible}
.cekmece{
  position:fixed;top:0;right:0;bottom:0;z-index:120;width:min(400px,90vw);
  background:var(--zemin);transform:translateX(100%);transition:transform 280ms cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;overflow-y:auto;
}
.cekmece.acik{transform:none}
.cekmece__basi{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--cizgi)}
.cekmece__basi img{width:170px}
.cekmece__kapat{width:38px;height:38px;display:grid;place-items:center;border-radius:var(--yaricap)}
.cekmece__kapat:hover{background:var(--zemin-2)}
.cekmece__kapat svg{width:20px;height:20px}
.cekmece__ara{display:flex;gap:0;margin:18px 22px;border:1px solid var(--cizgi);border-radius:var(--yaricap);overflow:hidden}
.cekmece__ara input{flex:1;min-width:0;border:0;padding:0 14px;height:42px;font:inherit;font-size:14px}
.cekmece__ara input:focus{outline:none}
.cekmece__ara button{width:44px;display:grid;place-items:center;background:var(--kirmizi);color:#fff}
.cekmece__ara svg{width:16px;height:16px}
.cekmece nav{padding-bottom:16px}
.cekmece nav a{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 22px;font-size:15px;font-weight:700;border-bottom:1px solid var(--cizgi-2);
}
.cekmece nav a:hover{background:var(--zemin-2);color:var(--kirmizi)}
.cekmece nav a span{font-size:11px;color:var(--soluk);font-weight:700}
.cekmece__alt{margin-top:auto;padding:22px;border-top:1px solid var(--cizgi);font-size:13px;color:var(--soluk)}
.cekmece__alt a{color:var(--kirmizi);font-weight:700}

/* --- 17. Duyarlılık ------------------------------------------------------ */
@media (max-width:1180px){
  .baslik__kutucuk{display:none}
}

@media (max-width:1080px){
  .gezinti a.g-bag{padding-inline:9px;font-size:13px}
  .izgara__ic{grid-template-columns:repeat(3,1fr)}
  .koyu__ic,.portre-dizi{grid-template-columns:repeat(4,1fr)}
  .koyu__ic .eski:nth-child(5),.portre-dizi .portre-kart:nth-child(5){display:none}
  .alt__ust{grid-template-columns:repeat(2,1fr);gap:28px}
  .sayi__ic{grid-template-columns:150px minmax(0,1fr);gap:28px}
  .sayi__bulten{grid-column:1/-1;border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.14);padding-top:24px}
}

@media (max-width:880px){
  :root{--bosluk:16px;--ara:16px}
  .ust-serit__sol{display:none}
  .ust-serit__bag{margin-left:0;overflow-x:auto;scrollbar-width:none;gap:18px}
  .ust-serit__bag::-webkit-scrollbar{display:none}
  .baslik__ic{height:64px;gap:14px}
  .baslik__logo img{width:172px}
  .baslik__bilgi{display:none}
  .baslik__sag{gap:4px}
  .menu-dugme{flex-shrink:0;padding-inline:10px;border-left:1px solid var(--cizgi);border-radius:0;margin-left:8px}
  .manset__ic{grid-template-columns:1fr}
  .manset__yan{grid-template-rows:none;grid-template-columns:1fr 1fr}
  .slayt__yazi h2{font-size:22px}
  .slayt__yazi{padding:44px 18px 18px}
  .kategori__ic,.kategori--ayna .kategori__ic{grid-template-columns:1fr}
  .kategori--ayna .kategori__lider,.kategori--ayna .kategori__kucukler{order:0}
  .uclu__ic{grid-template-columns:1fr}
  .koyu__ic,.portre-dizi{grid-template-columns:repeat(3,1fr)}
  .koyu__ic .eski:nth-child(4),.koyu__ic .eski:nth-child(5),
  .portre-dizi .portre-kart:nth-child(4),.portre-dizi .portre-kart:nth-child(5){display:none}
  .bugun__ic{grid-template-columns:1fr;gap:16px}
  .bugun__basi{border-right:0;padding-right:0;padding-bottom:14px;border-bottom:1px solid var(--cizgi)}
  .bugun__liste{grid-template-columns:1fr;gap:12px}
}

@media (max-width:600px){
  /* dar başlıkta sosyal ikonlar taşmaya yol açıyor; alt ve menüde zaten var */
  .baslik__sag .ikon:not(#aramaAc){display:none}
  .baslik__logo img{width:158px}
  .izgara__ic{grid-template-columns:repeat(2,1fr)}
  .manset__yan{grid-template-columns:1fr}
  .kategori__kucukler{grid-template-columns:1fr 1fr}
  .koyu__ic,.portre-dizi{grid-template-columns:repeat(2,1fr)}
  .koyu__ic .eski:nth-child(3),.portre-dizi .portre-kart:nth-child(3){display:none}
  .sayi__ic{grid-template-columns:120px minmax(0,1fr);gap:20px}
  .slayt__nokta button:nth-child(n+5){display:none}
  .alt__ust{grid-template-columns:1fr;gap:26px}
  .alt__son div{margin-left:0;width:100%}
  .serit__tum{display:none}
  .bolum-basi h2{font-size:19px}
  .kategori__lider h3{font-size:18px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* ==========================================================================
   18. İÇ SAYFALAR
   ========================================================================== */

/* --- kırıntı yolu --------------------------------------------------------- */
.kirinti{background:var(--zemin);border-bottom:1px solid var(--cizgi)}
.kirinti__ic{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-block:12px;font-size:12px;color:var(--soluk)}
.kirinti a{font-weight:600;transition:color var(--gecis)}
.kirinti a:hover{color:var(--kirmizi)}
.kirinti svg{width:11px;height:11px;opacity:.5}

/* --- sayfa başlığı -------------------------------------------------------- */
.sayfa-basi{background:var(--zemin);padding-block:34px 30px;border-bottom:1px solid var(--cizgi)}
.sayfa-basi h1{font-size:clamp(26px,3.4vw,38px);font-weight:800;letter-spacing:-.02em;line-height:1.14}
.sayfa-basi__us{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--kirmizi);margin-bottom:10px}
.sayfa-basi p{margin-top:12px;font-size:15px;color:var(--metin-2);line-height:1.66;max-width:64ch}
.sayfa-basi__sayi{margin-top:14px;font-size:12px;color:var(--soluk);font-weight:600}

/* --- iki kolonlu iç sayfa ------------------------------------------------- */
.icerik-2{padding-block:30px}
.icerik-2__ic{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:38px;align-items:start}

/* --- haber detay ---------------------------------------------------------- */
.yazi__basi h1{font-size:clamp(26px,3.6vw,40px);font-weight:800;line-height:1.18;letter-spacing:-.022em}
.yazi__giris{margin-top:16px;font-size:18px;line-height:1.62;color:var(--metin-2)}
.yazi__kunye{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;
  margin-top:20px;padding-block:16px;border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);
}
.yazi__kunye img{width:38px;height:38px;border-radius:50%;object-fit:cover;object-position:center 22%;filter:grayscale(1)}
.yazi__kunye b{font-size:13px;font-weight:700}
.yazi__kunye span{display:block;font-size:12px;color:var(--soluk);font-weight:500}
.paylas{margin-left:auto;display:flex;gap:7px}
.paylas a{
  width:34px;height:34px;display:grid;place-items:center;border-radius:var(--yaricap);
  background:var(--zemin-2);color:var(--metin-2);transition:background var(--gecis),color var(--gecis);
}
.paylas a:hover{background:var(--kirmizi);color:#fff}
.paylas svg{width:15px;height:15px}

.yazi__medya{margin-top:24px}
.yazi__medya img{width:100%;border-radius:var(--yaricap)}
.yazi__medya figcaption{margin-top:9px;font-size:12px;color:var(--soluk);line-height:1.5}

.yazi-govde{margin-top:26px;font-size:16.5px;line-height:1.78;color:#26292e}
.yazi-govde p+p{margin-top:18px}
.yazi-govde h2{font-size:22px;font-weight:800;margin-top:32px;margin-bottom:12px;letter-spacing:-.01em}
.yazi-govde a{color:var(--kirmizi);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.yazi-govde blockquote{
  margin:28px 0;padding:22px 24px;background:var(--zemin-2);
  border-left:3px solid var(--kirmizi);border-radius:0 var(--yaricap) var(--yaricap) 0;
  font-size:19px;font-weight:700;line-height:1.5;color:var(--metin);
}
.yazi-govde blockquote cite{display:block;margin-top:10px;font-size:13px;font-weight:600;font-style:normal;color:var(--soluk)}
.yazi-govde figure{margin:26px 0}
.yazi-govde figure img{width:100%;border-radius:var(--yaricap)}
.yazi-govde figcaption{margin-top:9px;font-size:12px;color:var(--soluk)}

.etiketler{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px;padding-top:22px;border-top:1px solid var(--cizgi)}
.etiketler span{font-size:12px;font-weight:700;color:var(--soluk);margin-right:4px;align-self:center}
.etiketler a{
  font-size:12px;font-weight:700;padding:7px 13px;border-radius:var(--yaricap);
  background:var(--zemin-2);transition:background var(--gecis),color var(--gecis);
}
.etiketler a:hover{background:var(--kirmizi);color:#fff}

/* --- kenar kutuları ------------------------------------------------------- */
.kenar-kutu{background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--yaricap);padding:18px}
.kenar-kutu+.kenar-kutu,.kenar-kutu+.reklam-kenar{margin-top:20px}
.kenar-kutu h2{font-size:15px;font-weight:800;padding-bottom:9px;border-bottom:2px solid var(--kirmizi);display:inline-block;margin-bottom:6px}
.kenar-kutu li{border-bottom:1px solid var(--cizgi-2)}
.kenar-kutu li:last-child{border-bottom:0}
.kenar-kutu li a{display:flex;gap:11px;padding-block:12px;transition:color var(--gecis)}
.kenar-kutu li a:hover{color:var(--kirmizi)}
.kenar-kutu__no{
  flex-shrink:0;width:20px;height:20px;display:grid;place-items:center;border-radius:2px;
  background:var(--zemin-2);color:var(--soluk);font-size:11px;font-weight:800;margin-top:1px;
}
.kenar-kutu li a:hover .kenar-kutu__no{background:var(--kirmizi);color:#fff}
.kenar-kutu h3{font-size:13.5px;font-weight:700;line-height:1.4}
.kenar-kutu .tarih{display:block;margin-top:4px;font-size:11px}
.kenar-mini{display:flex;gap:11px;padding-block:12px;border-bottom:1px solid var(--cizgi-2)}
.kenar-mini:last-child{border-bottom:0}
.kenar-mini .gorsel{width:78px;flex-shrink:0;aspect-ratio:4/3}
.kenar-mini h3{font-size:13.5px;font-weight:700;line-height:1.38}
.reklam-kenar{display:block;margin-top:20px}
.reklam-kenar img{width:100%;border-radius:var(--yaricap);border:1px solid var(--cizgi)}
.reklam-kenar span{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#a7adb6;margin-bottom:6px}

/* --- kategori / liste ızgarası -------------------------------------------- */
.liste-izgara{display:grid;grid-template-columns:repeat(3,1fr);gap:26px var(--ara)}
.liste-izgara .kart h3{font-size:16px}
.sayfalama{display:flex;justify-content:center;align-items:center;gap:6px;margin-top:38px}
.sayfalama a,.sayfalama span{
  min-width:38px;height:38px;display:grid;place-items:center;padding-inline:12px;
  border:1px solid var(--cizgi);border-radius:var(--yaricap);
  font-size:13px;font-weight:700;transition:background var(--gecis),color var(--gecis),border-color var(--gecis);
}
.sayfalama a:hover{border-color:var(--kirmizi);color:var(--kirmizi)}
.sayfalama .simdi{background:var(--kirmizi);border-color:var(--kirmizi);color:#fff}
.sayfalama .bosluk{border:0}

/* --- yazar profili -------------------------------------------------------- */
.yazar-profil{background:var(--zemin);border-bottom:1px solid var(--cizgi);padding-block:34px}
.yazar-profil__ic{display:flex;gap:26px;align-items:flex-start}
.yazar-profil__foto{width:120px;height:120px;flex-shrink:0;border-radius:50%;overflow:hidden;background:var(--zemin-2)}
.yazar-profil__foto img{width:100%;height:100%;object-fit:cover;object-position:center 22%;filter:grayscale(1)}
.yazar-profil h1{font-size:clamp(24px,3vw,32px);font-weight:800;letter-spacing:-.02em}
.yazar-profil__rol{display:block;margin-top:6px;font-size:13px;font-weight:800;color:var(--kirmizi);letter-spacing:.04em}
.yazar-profil p{margin-top:14px;font-size:15px;line-height:1.7;color:var(--metin-2);max-width:64ch}
.yazar-profil__alt{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px;align-items:center}
.yazar-profil__sayi{font-size:12px;color:var(--soluk);font-weight:600}

.yazi-listesi article{display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px;padding-block:22px;border-bottom:1px solid var(--cizgi)}
.yazi-listesi article:first-child{padding-top:0}
.yazi-listesi .gorsel{aspect-ratio:4/3}
.yazi-listesi h3{font-size:19px;font-weight:800;line-height:1.28;margin-top:8px}
.yazi-listesi p{margin-top:8px;font-size:14px;color:var(--metin-2);line-height:1.6;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.yazi-listesi .tarih{display:block;margin-top:9px}

/* --- video ---------------------------------------------------------------- */
.video-one{position:relative;border-radius:var(--yaricap);overflow:hidden;background:#000;aspect-ratio:16/9}
.video-one img{width:100%;height:100%;object-fit:cover;opacity:.75}
.video-one__oynat{
  position:absolute;inset:0;display:grid;place-items:center;
}
.video-one__oynat span{
  width:74px;height:74px;border-radius:50%;background:var(--kirmizi);
  display:grid;place-items:center;color:#fff;transition:transform var(--gecis);
  box-shadow:0 10px 30px -8px rgba(0,0,0,.6);
}
.video-one:hover .video-one__oynat span{transform:scale(1.08)}
.video-one__oynat svg{width:26px;height:26px;margin-left:4px}
.video-one__yazi{position:absolute;left:0;right:0;bottom:0;padding:44px 24px 20px;color:#fff;
  background:linear-gradient(to top,rgba(0,0,0,.85),transparent)}
.video-one__yazi h2{font-size:22px;font-weight:800}
.video-izgara{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--ara);margin-top:26px}
.video-kart .gorsel{aspect-ratio:16/9;position:relative;background:#111}
.video-kart .gorsel img{opacity:.8}
.video-kart .gorsel::before{
  content:"";position:absolute;inset:0;z-index:2;margin:auto;width:46px;height:46px;border-radius:50%;
  background:rgba(230,58,48,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M8 5l11 7-11 7z'/%3E%3C/svg%3E") center/16px no-repeat;
  transition:transform var(--gecis);
}
.video-kart:hover .gorsel::before{transform:scale(1.12)}
.video-kart h3{font-size:14px;font-weight:700;line-height:1.36;margin-top:10px}
.video-kart .tarih{display:block;margin-top:5px}

/* --- yayınlar (sayı arşivi) ----------------------------------------------- */
.sayi-izgara{display:grid;grid-template-columns:repeat(4,1fr);gap:30px var(--ara)}
.sayi-kart .gorsel{aspect-ratio:3/4;box-shadow:0 14px 30px -18px rgba(0,0,0,.5)}
.sayi-kart h3{font-size:15px;font-weight:800;margin-top:14px}
.sayi-kart span{display:block;font-size:12px;color:var(--soluk);margin-top:4px;font-weight:600}
.sayi-kart__oku{
  display:inline-flex;align-items:center;gap:7px;margin-top:10px;
  font-size:12px;font-weight:800;color:var(--kirmizi);
}
.sayi-kart__oku svg{width:12px;height:12px;transition:transform var(--gecis)}
.sayi-kart:hover .sayi-kart__oku svg{transform:translateX(3px)}

/* --- iletişim ------------------------------------------------------------- */
.iletisim__ic{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:38px;align-items:start}
.bilgi-kart{display:flex;gap:14px;padding:18px;border:1px solid var(--cizgi);border-radius:var(--yaricap);background:var(--zemin)}
.bilgi-kart+.bilgi-kart{margin-top:14px}
.bilgi-kart__ikon{
  width:42px;height:42px;flex-shrink:0;display:grid;place-items:center;border-radius:var(--yaricap);
  background:var(--zemin-2);color:var(--kirmizi);
}
.bilgi-kart__ikon svg{width:19px;height:19px}
.bilgi-kart b{display:block;font-size:13px;font-weight:800;margin-bottom:3px}
.bilgi-kart a,.bilgi-kart p{font-size:14px;color:var(--metin-2);line-height:1.55}
.bilgi-kart a:hover{color:var(--kirmizi)}

.form-kutu{background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--yaricap);padding:26px}
.form-kutu h2{font-size:19px;font-weight:800;margin-bottom:6px}
.form-kutu > p{font-size:14px;color:var(--soluk);margin-bottom:20px}
.form-satir{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-alan{margin-bottom:14px}
.form-alan label{display:block;font-size:12px;font-weight:700;margin-bottom:6px}
.form-alan input,.form-alan textarea,.form-alan select{
  width:100%;border:1px solid var(--cizgi);border-radius:var(--yaricap);
  padding:11px 13px;font:inherit;font-size:14px;background:var(--zemin);
  transition:border-color var(--gecis);
}
.form-alan textarea{min-height:130px;resize:vertical}
.form-alan input:focus,.form-alan textarea:focus,.form-alan select:focus{outline:none;border-color:var(--kirmizi)}
.form-kutu button{
  height:46px;padding-inline:26px;border-radius:var(--yaricap);
  background:var(--kirmizi);color:#fff;font-size:13px;font-weight:800;
  transition:background var(--gecis);
}
.form-kutu button:hover{background:var(--kirmizi-koyu)}
.harita{margin-top:20px;border-radius:var(--yaricap);overflow:hidden;border:1px solid var(--cizgi);aspect-ratio:16/9;background:var(--zemin-2);
  display:grid;place-items:center;color:var(--soluk);font-size:13px;font-weight:600;text-align:center;padding:20px}

/* --- iç sayfa duyarlılık --------------------------------------------------- */
@media (max-width:1080px){
  .icerik-2__ic{grid-template-columns:minmax(0,1fr) 290px;gap:28px}
  .video-izgara,.sayi-izgara{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:880px){
  .icerik-2__ic{grid-template-columns:1fr}
  .liste-izgara{grid-template-columns:repeat(2,1fr)}
  .iletisim__ic{grid-template-columns:1fr}
  .video-izgara,.sayi-izgara{grid-template-columns:repeat(2,1fr)}
  .yazar-profil__ic{gap:18px}
  .yazar-profil__foto{width:88px;height:88px}
}
@media (max-width:600px){
  .liste-izgara{grid-template-columns:1fr}
  .video-izgara{grid-template-columns:1fr}
  .yazi-listesi article{grid-template-columns:1fr;gap:12px}
  .yazi__giris{font-size:16px}
  .yazi-govde{font-size:16px}
  .form-satir{grid-template-columns:1fr}
  .yazar-profil__ic{flex-direction:column}
  .paylas{margin-left:0;width:100%}
}

/* alt bilgide logonun altındaki slogan — panel > Ayarlar > Slogan */
.alt__slogan{display:block;margin:10px 0 -4px;font-size:12.5px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:var(--kirmizi)}

/* Bölüm görseli verilmişse sayfa başlığı fotoğrafın üstüne biner —
   panel > Bölümler > Görsel. Verilmezse başlık düz zeminde kalır. */
.sayfa-basi--kapakli{
  position:relative;background-size:cover;background-position:center;
  border-bottom:none;padding-block:56px 48px;
}
.sayfa-basi--kapakli::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(16,18,23,.58) 0%,rgba(16,18,23,.82) 100%);
}
.sayfa-basi--kapakli>.kap{position:relative}
.sayfa-basi--kapakli h1,
.sayfa-basi--kapakli p{color:#fff}
.sayfa-basi--kapakli .sayfa-basi__sayi{color:rgba(255,255,255,.7)}

/* Kapak görseli girilmemiş kayıtlar için yer tutucu. Yayıncı isteği:
   boş kare, taslaktaki gibi marka kırmızısında dursun. */
.gorsel--bos{display:flex;align-items:center;justify-content:center;
  background:var(--kirmizi);color:#fff}
.gorsel--bos svg{width:30%;max-width:52px;height:auto;opacity:.65}

/* --- Kaydırmalı görsel kutusu -------------------------------------------
   Yazıya birden çok görsel eklendiğinde kareler kutunun içinde kendiliğinden
   döner. Tek görselde bu sınıf hiç basılmaz, davranış değişmez. */
.kaydir img{position:absolute;inset:0;opacity:0;transition:opacity 620ms ease}
.kaydir img.aktif{opacity:1}
/* Galeri okları — yalnız birden çok karesi olan kutularda basılır.
   Kart bir bağlantının içinde olduğu için ok tıklaması yazıyı açmamalı;
   betik4.js olayı durduruyor. */
.kaydir__ok{
  position:absolute;top:50%;transform:translateY(-50%);z-index:4;
  width:28px;height:28px;display:grid;place-items:center;border-radius:50%;
  background:rgba(0,0,0,.42);color:#fff;border:0;cursor:pointer;
  opacity:0;transition:opacity var(--gecis),background var(--gecis);
}
.kaydir:hover .kaydir__ok,.kaydir:focus-within .kaydir__ok{opacity:1}
.kaydir__ok:hover{background:var(--kirmizi)}
.kaydir__ok--geri{left:6px}
.kaydir__ok--ileri{right:6px}
.kaydir__ok svg{width:14px;height:14px}
@media (hover:none){.kaydir__ok{display:none}}   /* dokunmatikte parmakla kaydırılıyor */

.kaydir__nokta{
  position:absolute;left:0;right:0;bottom:8px;z-index:3;
  display:flex;gap:5px;justify-content:center;pointer-events:none;
}
.kaydir__nokta i{
  width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.45);
  box-shadow:0 0 0 1px rgba(0,0,0,.25);transition:background 260ms,width 260ms;
}
.kaydir__nokta i.aktif{background:#fff;width:16px;border-radius:20px}
@media (prefers-reduced-motion:reduce){
  .kaydir img{transition:none}
}


/* --- Sürükleyerek kaydırma (bkz. betik0.js) ------------------------------
   Yayıncı isteği: sliderlar fareyle de çekilebilsin. touch-action:pan-y
   dikey sayfa kaydırmayı bırakır, yalnız yatay çekişi bize verir. */
.suruklenebilir{cursor:grab;touch-action:pan-y}
.suruklenebilir.surukleniyor{cursor:grabbing}
.suruklenebilir img,.suruklenebilir a{-webkit-user-drag:none;user-select:none}
.suruklenebilir.surukleniyor a{pointer-events:none}
