/* Cihaz katmani
   Tek duzeni kucultup buyutmek yetmez - her cihaz sinifinin kendi yerlesimi olur.
   Esikler: mobil 0-479 | buyuk mobil 480-767 | tablet 768-1023 | web 1024-1439 | masaustu 1440+ */

/* ═══════ MASAUSTU (1440+) — okuma genisligi korunur ═══════ */
@media (min-width: 1440px) {
  :root { --kapsayici: 1260px; }
  .kahraman-baslik { font-size: var(--olcek-9); }
}

/* ═══════ TABLET (768-1023) ═══════ */
@media (max-width: 1023px) {
  :root { --aralik-8: 3rem; --aralik-9: 4rem; }

  .izgara-3, .izgara-4 { grid-template-columns: repeat(2, 1fr); }
  .adim-listesi { grid-template-columns: 1fr; gap: var(--aralik-5); }
  .paket-grubu { grid-template-columns: 1fr; max-width: 34rem; margin-inline: auto; }
  .gorus-grubu { grid-template-columns: repeat(2, 1fr); }
  .kisi-grubu { grid-template-columns: repeat(3, 1fr); }
  .iletisim-duzen { grid-template-columns: repeat(2, 1fr); gap: var(--aralik-6); }
  .alt-duzen { grid-template-columns: repeat(2, 1fr); }

  .kahraman-ikili { grid-template-columns: 1fr; gap: var(--aralik-6); }
  .kahraman-gorsel { order: -1; }

  /* Menu acilir panele doner */
  .menu-dugme { display: inline-flex; }
  .menu {
    position: fixed;
    inset: 72px 0 auto 0;
    background: var(--zemin);
    border-bottom: 1px solid var(--kenar);
    box-shadow: var(--golge-2);
    padding: var(--aralik-4);
    margin: 0;
    display: none;
  }
  .menu[data-acik="evet"] { display: block; }
  .menu > ul { flex-direction: column; align-items: stretch; gap: 0; }
  .menu a { padding: var(--aralik-3) var(--aralik-4); font-size: var(--olcek-3); }
  .menu-alt {
    position: static; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: 0; border-left: 2px solid var(--kenar);
    border-radius: 0; margin-left: var(--aralik-4); padding: 0;
  }
  .menu-ok { display: none; }
}

/* ═══════ BUYUK MOBIL (480-767) ═══════ */
@media (max-width: 767px) {
  .kapsayici { width: min(100% - 2rem, var(--kapsayici)); }

  .izgara-2, .izgara-3, .izgara-4 { grid-template-columns: 1fr; }
  .gorus-grubu { grid-template-columns: 1fr; }
  .kisi-grubu { grid-template-columns: repeat(2, 1fr); }
  .sayi-grubu { grid-template-columns: 1fr; gap: var(--aralik-3); }
  .iletisim-duzen { grid-template-columns: 1fr; }
  .alt-duzen { grid-template-columns: 1fr; gap: var(--aralik-6); }
  .alt-serit { flex-direction: column; text-align: center; }
  .alt-kunye { text-align: center; }

  .bolum { padding-top: var(--aralik-7); padding-bottom: var(--aralik-7); }
  .marka-alt { display: none; }

  /* Ust sag kose dar ekranda tasiyordu: menu dugmesi ve tema yeter,
     panel baglantisi zaten menude var. */
  .tepe-sag .dugme { display: none; }
  .tepe-ic { gap: var(--aralik-3); }
}

/* ═══════ MOBIL (0-479) — tek elle kullanim ═══════ */
@media (max-width: 479px) {
  .kapsayici { width: min(100% - 1.5rem, var(--kapsayici)); }

  .kahraman-baslik { font-size: clamp(1.8rem, 1.2rem + 4vw, 2.4rem); }
  .dugme-grubu { flex-direction: column; align-items: stretch; }
  .dugme { width: 100%; padding-block: 0.95rem; }   /* dokunma hedefi 44px+ */
  .tepe-ic { min-height: 64px; gap: var(--aralik-3); }
  .menu { inset-block-start: 64px; }
  .kart { padding: var(--aralik-5); }
  .paket { padding: var(--aralik-5); }
  .sss-oge { padding: var(--aralik-3) var(--aralik-4); }
}

/* ═══════ DOKUNMATIK — imlec varsayimi yapilmaz ═══════ */
@media (hover: none) {
  .kart-bagli:hover { transform: none; box-shadow: none; }
  .serit-oge { opacity: 1; }
  .menu-acilir:hover .menu-alt { opacity: 1; visibility: visible; }
}

/* ═══════ YAZDIRMA ═══════ */
@media print {
  .tepe, .alt, .tema-dugme, .menu-dugme, .dugme-grubu { display: none !important; }
  .bolum { padding: 1rem 0; break-inside: avoid; }
  body { background: #fff; color: #000; }
}