/* Ana sayfa — masaüstü */
/* Tam ekran banner: kenardan kenara, yükseklik = ekran - üst başlık (72 px). İçerik sitenin 1200 px hizasında. */
.banner-tam .banner { border-radius: 0; }
.banner-tam .banner-pencere { min-height: calc(100svh - 72px); }
.banner-kare {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 3rem;
  min-height: calc(100svh - 72px);
  padding: 4rem max(32px, calc((100% - 1200px) / 2)) 6.5rem;
}
.banner h1, .banner .banner-baslik { font-size: clamp(2.4rem, 1.6rem + 2.4vw, 3.9rem); line-height: 1.08; margin: 1rem 0 1.2rem; }
.banner .spot { font: 400 1.25rem/1.55 var(--sans); max-width: 36rem; margin-bottom: 2rem; }
.banner-gorsel .telefon { margin: 0 auto; width: 320px; }

.banner-denetim { justify-content: flex-start; left: max(32px, calc((100% - 1200px) / 2)); right: auto; bottom: 2rem; }

/* Yolculuk (yatay) */
.yol-bant { padding: 4.5rem 0; margin-top: 0; }
.yol-bas { max-width: 44rem; margin-bottom: 2.4rem; }
.yol-bas .sessiz { margin: .6rem 0 0; font-size: 1.05rem; }
.yol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.4rem; position: relative; }
.yol::before { content: ''; position: absolute; top: 20px; left: 20px; right: 20px; border-top: 2px dashed var(--mor-orta); }
.geciken { color: var(--hata-koyu) !important; }

/* Adımlar */
.adim-liste { list-style: none; counter-reset: adim; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.3rem; padding: 0; margin: 0; }
.adim-liste li { counter-increment: adim; padding: 1.4rem 1.4rem 1.5rem; border: 1px solid var(--kenar); border-radius: var(--kose-buyuk); }
.adim-liste li::before { content: counter(adim); display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 999px; background: var(--mor); color: #fff; font: 700 .95rem/1 var(--sans); margin-bottom: .9rem; }
.adim-liste b { display: block; font: 600 1.15rem/1.3 var(--sans); margin-bottom: .35rem; }
.adim-liste span { color: var(--murekkep-2); font-size: .95rem; }

/* Neden ücretsiz */
/* Başlık solda üstte; açıklama ile sağdaki kutu aynı hizadan başlar */
.kose { display: grid; grid-template-columns: 1.3fr 1fr; grid-template-areas: 'bas .' 'metin kunye'; gap: 0 3.5rem; align-items: start; }
.kose-bas { grid-area: bas; }
.kose-metin { grid-area: metin; }
.kose-kunye { grid-area: kunye; }
.kose-bas h2 { margin-bottom: .7rem; }
.kose-metin p:not(.etiket) { font-size: 1.05rem; color: var(--murekkep-2); }
.kose-kunye { background: #fff; border: 1px solid var(--kenar); border-radius: var(--kose-buyuk); box-shadow: var(--golge); padding: 1rem 1.4rem; }

/* Kapanış çağrısı */
.son-cagri { display: flex; align-items: center; justify-content: space-between; gap: 2rem; background: var(--mor); color: #f3eafa; border-radius: 28px; padding: 2.6rem 3rem; margin-top: 1rem; }
.son-cagri h2 { color: #fff; margin: 0 0 .3rem; }
.son-cagri p { margin: 0; }

@media (max-width: 1100px) {
  .banner-kare { padding: 3rem 32px 6rem; }
  .banner-denetim { left: 32px; }
  .yol { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 2.4rem; }
  .yol::before { display: none; }
}
@media (max-width: 900px) {
  .banner-kare { grid-template-columns: 1fr; }
  .kose { grid-template-columns: 1fr; grid-template-areas: 'bas' 'metin' 'kunye'; gap: 0; }
  .kose-kunye { margin-top: 2rem; }
  .banner-denetim { left: 0; right: 0; justify-content: center; }
  .yol, .adim-liste { grid-template-columns: 1fr; }
  .son-cagri { flex-direction: column; align-items: flex-start; }
  .hero-maddeler { flex-wrap: wrap; }
}

/* Rol kartları, banner'ın hemen altında */
/* Neyin yerine geçer: solda eski yöntemler, sağda tek bağlantı */
.yerine { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 3rem; align-items: center; }
.yerine-bas { grid-column: 1 / -1; }
.guven-bant { padding-bottom: 1rem; }
.sss-bant .dar-genis { align-items: start; }
@media (max-width: 1100px) { .guven { grid-template-columns: 1fr 1fr; } }
@media (max-width: 900px) {
  .yerine { grid-template-columns: 1fr; }
  .yerine-yeni { margin-top: 1rem; }
}
.nasil-bant { padding: 3.6rem 0 4rem; }
.nasil-sol { position: sticky; top: 104px; }
@media (max-width: 900px) {
  .nasil { grid-template-columns: 1fr; gap: 2rem; }
  .nasil-sol { position: static; }
}
.sss-bas .sessiz { margin: .7rem 0 1.2rem; max-width: 26rem; }