/* Bolum duzen varyantlari.
   Ayni bolum turu farkli yerlesimde cizilebilsin diye. Referans setteki
   420 bolumun cogu ayni arketipin farkli duzeniydi; tur cogaltmak yerine
   duzen secenegi eklendi.

   Sinif kaynagi: bilesenin stil.duzen alani -> "duzen-<deger>".
   Karsiligi olmayan deger zararsizdir, bolum varsayilan haliyle cizilir.

   Hedef sinif adlari sitenin GERCEK isaretlemesinden alindi:
   izgara/kart (cogu bolum), adim-listesi/adim, sss-grubu/sss-oge,
   ent-izgara/ent-kart, vaka-izgara/vaka-kart, bilgi-kutu, sayi-oge. */

/* Duzen varyantlarinin dokunacagi ortak kart kumesi */
.duzen-serit .kart, .duzen-serit .bilgi-kutu, .duzen-serit .ent-kart,
.duzen-serit .sss-oge, .duzen-serit .vaka-kart, .duzen-serit .yazi-kart,
.duzen-serit .adim {
  background: transparent; border: 0; border-radius: 0;
  border-bottom: 1px solid var(--kenar);
  box-shadow: none; padding-inline: 0;
}
.duzen-serit .kart:hover, .duzen-serit .ent-kart:hover,
.duzen-serit .vaka-kart:hover, .duzen-serit .yazi-kart:hover {
  transform: none; box-shadow: none;
}
.duzen-serit .izgara, .duzen-serit .ent-izgara, .duzen-serit .vaka-izgara { gap: 0; }

/* ── Sutun sayisini gorunum sekmesinden ez ─────────────── */
.sutun-1 .izgara, .sutun-1 .ent-izgara, .sutun-1 .vaka-izgara { grid-template-columns: 1fr; }
.sutun-2 .izgara, .sutun-2 .ent-izgara, .sutun-2 .vaka-izgara { grid-template-columns: repeat(2, 1fr); }
.sutun-3 .izgara, .sutun-3 .ent-izgara, .sutun-3 .vaka-izgara { grid-template-columns: repeat(3, 1fr); }
.sutun-4 .izgara, .sutun-4 .ent-izgara, .sutun-4 .vaka-izgara { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) {
  .sutun-3 .izgara, .sutun-4 .izgara,
  .sutun-3 .ent-izgara, .sutun-4 .ent-izgara { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px) {
  .sutun-2 .izgara, .sutun-3 .izgara, .sutun-4 .izgara,
  .sutun-2 .ent-izgara, .sutun-3 .ent-izgara, .sutun-4 .ent-izgara,
  .sutun-2 .vaka-izgara, .sutun-3 .vaka-izgara { grid-template-columns: 1fr; }
}

/* ── duzen-kutu: dolgulu zemin, cercevesiz ─────────────── */
.duzen-kutu .kart, .duzen-kutu .bilgi-kutu, .duzen-kutu .ent-kart,
.duzen-kutu .sss-oge, .duzen-kutu .yazi-kart {
  background: var(--zemin-3); border: 0; box-shadow: none;
}

/* ── duzen-cizgili: sol kenarda renkli serit ───────────── */
.duzen-cizgili .kart, .duzen-cizgili .bilgi-kutu, .duzen-cizgili .sss-oge {
  border-left: 3px solid var(--ana);
  border-radius: 0 var(--kose-orta) var(--kose-orta) 0;
}

/* ── duzen-numarali: kartlara sira numarasi ────────────── */
.duzen-numarali .izgara { counter-reset: kart; }
.duzen-numarali .kart, .duzen-numarali .bilgi-kutu {
  counter-increment: kart; position: relative;
}
.duzen-numarali .kart::before, .duzen-numarali .bilgi-kutu::before {
  content: counter(kart, decimal-leading-zero);
  position: absolute; top: .9rem; right: 1.2rem;
  font-family: var(--yazi-baslik); font-size: 2.1rem; font-weight: 600;
  color: color-mix(in srgb, var(--ana) 20%, transparent);
  line-height: 1; pointer-events: none;
}

/* ── duzen-yatay: simge solda, yazi sagda ──────────────── */
.duzen-yatay .kart, .duzen-yatay .bilgi-kutu {
  display: grid; grid-template-columns: auto 1fr;
  gap: 1rem; align-items: start; text-align: left;
}
.duzen-yatay .kart-simge { margin: 0; }

/* ── duzen-merkez: kart icerigi ortali ─────────────────── */
.duzen-merkez .kart, .duzen-merkez .bilgi-kutu, .duzen-merkez .adim { text-align: center; }
.duzen-merkez .kart-simge, .duzen-merkez .adim-no { margin-inline: auto; }

/* ── duzen-buyuk-ilk: ilk kart genis ───────────────────── */
@media (min-width: 760px) {
  .duzen-buyuk-ilk .izgara > *:first-child { grid-column: span 2; }
  .duzen-buyuk-ilk .izgara > *:first-child .kart-baslik { font-size: 1.45rem; }
}

/* ── duzen-kaydir: yatay kaydirilan serit ──────────────── */
.duzen-kaydir .izgara, .duzen-kaydir .ent-izgara, .duzen-kaydir .vaka-izgara {
  display: flex; overflow-x: auto; scroll-snap-type: x mandatory;
  gap: 1rem; padding-bottom: .9rem;
}
.duzen-kaydir .izgara > *, .duzen-kaydir .ent-izgara > *, .duzen-kaydir .vaka-izgara > * {
  flex: 0 0 min(320px, 78vw); scroll-snap-align: start;
}

/* ── duzen-ters: iki sutunlu bolumlerde taraflari degistirir ── */
.duzen-ters .metin-gorsel, .duzen-ters .guv-duzen.guv-ikili,
.duzen-ters .kahraman-duzen.kahraman-ikili { direction: rtl; }
.duzen-ters .metin-gorsel > *, .duzen-ters .guv-duzen.guv-ikili > *,
.duzen-ters .kahraman-duzen.kahraman-ikili > * { direction: ltr; }

/* ── duzen-genis-baslik: baslik sola, aciklama yanina ──── */
.duzen-genis-baslik .bolum-tepe {
  max-width: none; text-align: left; margin-inline: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: end;
}
.duzen-genis-baslik .bolum-tepe .bolum-alt { margin: 0; }
@media (max-width: 760px) {
  .duzen-genis-baslik .bolum-tepe { grid-template-columns: 1fr; gap: .6rem; }
}

/* ── duzen-sade: cerceve ve golge yok ──────────────────── */
.duzen-sade .kart, .duzen-sade .bilgi-kutu, .duzen-sade .ent-kart,
.duzen-sade .fiyat-kart, .duzen-sade .vaka-kart, .duzen-sade .yazi-kart,
.duzen-sade .sss-oge {
  background: transparent; border: 0; box-shadow: none; padding-inline: 0;
}
.duzen-sade .kart:hover, .duzen-sade .yazi-kart:hover,
.duzen-sade .vaka-kart:hover { transform: none; box-shadow: none; }
