/* ============================================================
   DÜZELTME — PARTİ 4
   Şablon sayfaları: /sektor/*, /tema/*, /usta/*
   style.css'e dokunmadan yapılan düzeltmeler. Tasarım dili aynı:
   siyah #0E0E0C + krem #F4F3EE + asit lime #D8FF3E.
   ============================================================ */

/* ---- 1 · SAYFA BAŞLIĞI: yan yana akan iki paragraf -------------
   *{margin:0} sıfırlaması yüzünden giriş paragrafı ile ikinci
   paragraf arasında boşluk kalmıyor, tek blok gibi görünüyordu. */
.page-hero p + p{margin-top:1rem}

/* Tema sayfalarında giriş paragrafı .lede sınıfı taşıyor ve
   .lead için yazılmış biçim ona uymuyordu: sektör/usta ile aynı
   parlaklık ve ölçü. */
.page-hero .lede{
  color:var(--ink);
  font-size:clamp(1rem,1.7vw,1.18rem);
  line-height:1.62;
  max-width:44em;
}

/* Kırıntı bağlantıları telefonda 27 px yüksekliğindeydi. */
@media (max-width:640px){
  .crumb a{display:inline-block;padding:.3rem 0}
}

/* ---- 2 · SEKTÖR: modül listesi --------------------------------
   repeat(2,1fr) idi; 3 modüllü sektörlerde son hücre boş kalıyordu. */
.sk-modul ul{grid-template-columns:repeat(auto-fit,minmax(255px,1fr))}
@media (max-width:900px){
  .sk-modul ul{grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
}
@media (max-width:520px){
  .sk-modul ul{grid-template-columns:1fr}
}

/* ---- 3 · SEKTÖR: hazır tema kartları --------------------------
   a) Küçük resimler 800×500 (16:10); kart 3:2 kırpıyordu, tema
      ekran görüntüsünün üstü ve altı kesiliyordu.
   b) 35 sektörün 28'inde tek tema var; repeat(3,1fr) ızgarası
      satırın üçte ikisini boş bırakıyordu. Tek tema artık yatay
      kart olarak satırı dolduruyor, iki tema iki kolona yayılıyor. */
.sk-tema img{aspect-ratio:16/10}

.sk-tema > div{display:flex;flex-direction:column}
.sk-tema-et{
  display:block;font-family:var(--font-mono);
  font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--acid);margin-bottom:.5rem;
}
.sk-tema h3{margin:0 0 .45rem}
.sk-tema > div > p{
  font-size:.86rem;line-height:1.58;color:var(--muted);
  margin:0 0 .95rem;
}

/* Kart içindeki iki bağlantı 23 px yüksekliğindeydi: parmak hedefi. */
.sk-tema-lnk{gap:.35rem 1.2rem;margin-top:auto}
.sk-tema-lnk a{display:inline-flex;align-items:center;min-height:44px}

@media (min-width:701px){
  .sk-temalar:has(.sk-tema:nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
  .sk-temalar:has(.sk-tema:only-child){grid-template-columns:1fr}
  .sk-tema:only-child{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
  .sk-tema:only-child > a{display:block;height:100%}
  .sk-tema:only-child img{height:100%;object-fit:cover}
  .sk-tema:only-child > div{
    padding:clamp(1.3rem,2.6vw,2.1rem);
    justify-content:center;
  }
  .sk-tema:only-child h3{font-size:1.25rem}
  .sk-tema:only-child > div > p{font-size:.92rem;max-width:42ch}
  /* Yatay kartta bağlantılar metinle aynı öbekte kalsın; margin-top:auto
     onları kartın dibine itip ortada boşluk bırakıyordu. */
  .sk-tema:only-child .sk-tema-lnk{margin-top:.25rem}
}

/* ---- 4 · TEMA: onay listeleri --------------------------------
   .check-list li padding 1.7rem + .tema-liste li margin-bottom .85rem
   üst üste binince satır aralığı hem çok açılıyor hem de ayırıcı
   çizgi metnin altına/üstüne eşit olmayan uzaklıkta kalıyordu. */
.tema-govde .tema-liste li{margin-bottom:0;padding:1.05rem .4rem}
.tema-govde .tema-liste .tick{width:26px;height:26px;margin-top:.12rem}
.tema-govde .tema-liste p{color:var(--text)}

/* ---- 5 · TEMA: masaüstünde boş kalan sağ kolon ----------------
   .tema-govde 78ch ile sınırlıydı; 1440'ta sağda ~%35 boşluk
   kalıyor, sayfa gereksiz uzuyordu. Paragraf ölçüsü korunuyor,
   listeler ve kapanış kutusu genişliği kullanıyor. */
@media (min-width:1080px){
  .tema-detay .tema-govde{max-width:none}
  .tema-govde > h2,
  .tema-govde > p,
  .tema-govde > .tema-adim{max-width:78ch}
  .tema-govde .tema-liste{
    display:grid;grid-template-columns:repeat(2,1fr);
    column-gap:2.6rem;border-top:0;
  }
  /* Ayırıcı çizgi kolon başına: üstte aç, altta yalnız son satırı kapat.
     Hem üst hem alt kenarlık kalsa satır aralarında 2 px çizgi olurdu. */
  .tema-govde .tema-liste li{border-top:1px solid var(--line);border-bottom:0}
  .tema-govde .tema-liste li:nth-last-child(-n+2){border-bottom:1px solid var(--line)}
  .tema-govde .tema-cta{max-width:none}
}

/* ---- 6 · TEMA: telefonda düğme genişlikleri -------------------
   Alt alta düşen düğmeler farklı genişlikteydi, sol kenara
   dayanıp dağınık görünüyordu. Sektör/usta sayfalarındaki
   davranışın aynısı. */
@media (max-width:620px){
  .page-hero .hero-actions{flex-direction:column;align-items:stretch;gap:.7rem}
  .page-hero .hero-actions .btn{width:100%;justify-content:center}
  .tema-cta .btn{display:flex;width:100%;justify-content:center;margin:.65rem 0 0}
}

/* ---- 7 · USTA: giriş altındaki not ---------------------------- */
.usta-not{
  margin-top:1.1rem;font-size:.88rem;color:var(--muted);
  max-width:52ch;
}
