/* Tema: PAZAR — Trendyol/Hepsiburada düzeni (5 Eyl 2026).
   Temel stilin (varsayılan temadan miras) ÜSTÜNE gelir; kendi şablonları
   (üst bar, kategori şeridi, kart, sol filtreli listeleme, alt çubuk)
   `pz-` öneki taşır. Renkler YALNIZ var(--token); önerilen palet "pazar". */

/* ── sayfa zemini: açık gri, içerik beyaz yüzeylerde ───────────────── */
body { background: var(--yuzey-2); }

main { padding-bottom: 5rem; }              /* mobil alt çubuk payı */

/* ── üst bar: arama merkezde ve geniş ──────────────────────────────── */
.pz-ust { background: var(--zemin); box-shadow: none; border-bottom: 1px solid var(--kenar); }

.pz-ust-ic { grid-template-columns: auto minmax(0, 1fr) auto; gap: 1.25rem; }

.pz-marka { font-size: var(--yazi-xl); }

.pz-ara { max-width: 44rem; }

.pz-ara .arama-alani { border: 2px solid var(--vurgu); border-radius: var(--yaricap-kucuk); }

/* 22 Eyl 2026 (Reis: "iki arama çubuğu üst üste binmiş gibi"): girdinin
   KENDİ çerçevesi + yuvarlak köşesi, dış kutunun çerçevesinin İÇİNDE ikinci
   bir kutu çiziyordu. Tek çerçeve dış kutudadır; odak halkası da oraya. */
.pz-ara .arama-alani input { border: 0; border-radius: var(--yaricap-kucuk); box-shadow: none; }
.pz-ara .arama-alani input:focus-visible { box-shadow: none; }
.pz-ara .arama-alani:focus-within { box-shadow: 0 0 0 3px color-mix(in srgb, var(--birincil) 22%, transparent); }

.pz-ara button { border-radius: var(--yaricap-kucuk); }

.pz-eylemler .ust-eylem { font-size: var(--yazi-xs); }

/* ── kategori şeridi: yatay, altı çizgili, hover alt menü ──────────── */
.pz-gezinme { background: var(--zemin); border-bottom: 1px solid var(--kenar); }

.pz-gezinme-ic { padding: 0; }

.pz-serit {
  list-style: none; margin: 0; padding: 0;
  display: flex; gap: 0; overflow-x: auto; scrollbar-width: none;
}

.pz-serit::-webkit-scrollbar { display: none; }

.pz-serit-oge { position: relative; flex: none; }

.pz-serit-oge > a {
  display: inline-flex; align-items: center; gap: .35rem;
  min-height: 44px; padding: 0 .9rem;
  color: var(--metin); text-decoration: none; font-size: var(--yazi-sm); font-weight: 600;
  border-bottom: 2px solid transparent; white-space: nowrap;
}

.pz-serit-oge > a:hover, .pz-serit-oge:focus-within > a {
  color: var(--birincil); border-bottom-color: var(--birincil);
}

.pz-serit-oge--vurgu > a { color: var(--birincil); }

.pz-alt-menu {
  list-style: none; margin: 0; padding: .5rem 0;
  position: absolute; left: 0; top: 100%; z-index: var(--z-yapiskan);
  min-width: 14rem; background: var(--zemin); border: 1px solid var(--kenar);
  border-radius: 0 0 var(--yaricap-kucuk) var(--yaricap-kucuk); box-shadow: var(--golge);
  display: none;
}

.pz-serit-oge--altli:hover .pz-alt-menu,
.pz-serit-oge--altli:focus-within .pz-alt-menu { display: block; }

.pz-alt-menu a {
  display: block; padding: .55rem 1rem; min-height: 40px;
  color: var(--metin); text-decoration: none; font-size: var(--yazi-sm);
}

.pz-alt-menu a:hover { background: var(--yuzey-2); color: var(--birincil); }

/* ── listeleme düzeni: sol filtre + ızgara ─────────────────────────── */
.pz-liste-duzen {
  display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: var(--b-4);
  align-items: start;
}

.pz-filtre { position: sticky; top: 4.5rem; }

.pz-filtre-katla {
  background: var(--zemin); border: 1px solid var(--kenar); border-radius: var(--yaricap-kucuk);
}

.pz-filtre-katla > summary {
  display: flex; align-items: center; gap: .5rem; cursor: pointer;
  min-height: 44px; padding: 0 1rem; font-weight: 700; list-style: none;
}

.pz-filtre-katla > summary::-webkit-details-marker { display: none; }

.pz-filtre-form { padding: 0 1rem 1rem; display: grid; gap: .25rem; }

.pz-filtre-grup { border: 0; border-top: 1px solid var(--ayrac); margin: 0; padding: .75rem 0; }

.pz-filtre-grup legend { font-weight: 700; font-size: var(--yazi-sm); padding: 0 0 .4rem; }

.pz-filtre-kategoriler { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }

.pz-filtre-kategoriler a {
  display: block; padding: .35rem 0; min-height: 32px;
  color: var(--metin); text-decoration: none; font-size: var(--yazi-sm);
}

.pz-filtre-kategoriler a[aria-current="page"] { color: var(--birincil); font-weight: 700; }

.pz-fiyat-araligi { display: flex; align-items: center; gap: .4rem; }

.pz-fiyat-araligi input { width: 100%; min-width: 0; }

.pz-filtre-eylem { display: flex; gap: .5rem; padding-top: .75rem; }

.pz-filtre-eylem button { flex: 1; }

.pz-liste-govde { min-width: 0; }

.pz-liste-basligi {
  display: flex; align-items: baseline; gap: .75rem; flex-wrap: wrap;
  padding: .25rem 0 .75rem;
}

.pz-liste-basligi h1 { margin: 0; font-size: var(--yazi-xl); }

.pz-liste-basligi .sonuc-sayisi { margin: 0; color: var(--soluk); }

.pz-kategori-aciklama { margin: 0 0 1rem; color: var(--soluk); font-size: var(--yazi-sm); }

.pz-liste-govde .izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }

/* ── ürün kartı: 3:4 görsel, kompakt gövde, sağ altta sepet ────────── */
.pz-kart { border: 1px solid var(--kenar); border-radius: var(--yaricap-kucuk); box-shadow: none; }

.pz-kart:hover { box-shadow: var(--golge); }

.pz-kapak, .pz-kapak img, .pz-kart .kapak-yok { aspect-ratio: 3 / 4; border-radius: var(--yaricap-kucuk) var(--yaricap-kucuk) 0 0; }

.pz-kart .rozet-indirim { font-weight: 800; }

.pz-govde { padding: .6rem .7rem .7rem; gap: .25rem; }

.pz-govde h3 {
  font-size: var(--yazi-sm); font-weight: 500; line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  min-height: 2.7em;
}

.pz-kargo {
  display: inline-flex; align-items: center; gap: .25rem;
  font-size: var(--yazi-xs); font-weight: 700; color: var(--basari);
}

.pz-fiyat-satiri { display: flex; align-items: end; justify-content: space-between; gap: .5rem; margin-top: auto; }

.pz-fiyat { display: flex; flex-direction: column; align-items: flex-start; gap: 0; margin: 0; }

.pz-fiyat .eski-fiyat { font-size: var(--yazi-xs); }

.pz-fiyat span { font-size: var(--yazi-lg); font-weight: 800; color: var(--metin); }

.pz-kart-eylem {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; padding: 0; flex: none;
  border: 1px solid var(--kenar); border-radius: var(--yaricap-kucuk);
  background: var(--zemin); color: var(--birincil); text-decoration: none;
}

.pz-kart-eylem:hover { background: var(--vurgu); color: var(--vurgu-metin); border-color: var(--vurgu); }

.pz-sepet { margin: 0; }

/* ── mobil alt çubuk ───────────────────────────────────────────────── */
.pz-alt-cubuk {
  display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-yapiskan);
  background: var(--zemin); border-top: 1px solid var(--kenar);
  grid-template-columns: repeat(4, 1fr);
}

.pz-alt-cubuk a {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .15rem;
  min-height: 56px; color: var(--soluk); text-decoration: none; font-size: var(--yazi-xs);
}

.pz-alt-cubuk a:hover, .pz-alt-cubuk a:focus-visible { color: var(--birincil); }

@media (max-width: 64rem) {
  .pz-liste-govde .izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 48rem) {
  .pz-alt-cubuk { display: grid; }
  .pz-liste-duzen { grid-template-columns: 1fr; }
  .pz-filtre { position: static; }
  .pz-filtre-katla[open] > summary { border-bottom: 1px solid var(--ayrac); }
  .pz-liste-govde .izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
  .pz-ust-ic { gap: .5rem; }
}

/* ── ana sayfa: banner kaydırıcı (scroll-snap, JS'siz) ─────────────── */
.pz-kaydirici { margin: var(--b-4) 0; }


.pz-kaydirici-ic {
  display: flex; gap: .75rem; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: thin; padding-bottom: .25rem;
}

.pz-kare {
  position: relative; flex: 0 0 min(100%, 56rem); scroll-snap-align: start;
  display: block; border-radius: var(--yaricap); overflow: hidden;
  background: var(--yuzey); text-decoration: none; color: var(--metin);
  aspect-ratio: 5 / 2;
}

.pz-kare img { width: 100%; height: 100%; object-fit: cover; display: block;
  object-position: var(--odak, 50% 50%); }

.pz-kare-metin {
  position: absolute; left: 0; right: 0; bottom: 0;
  display: grid; gap: .35rem; justify-items: start;
  padding: 1.25rem 1.5rem;
  background: linear-gradient(to top, color-mix(in srgb, var(--metin) 78%, transparent), transparent);
  color: var(--zemin);
}

.pz-kare-metin strong { font-size: clamp(1.2rem, 2.6vw, 1.9rem); line-height: 1.15; }

.pz-kare-metin .dugme { margin-top: .25rem; }

/* 23 Eyl 2026 (Reis): banner ve kategori şeridinde kaydırma ÇUBUĞU yok;
   iki yanda yuvarlak ok (vitrin.js `[data-kaydir]`). Alan kaydırılabilir
   kalır (dokunma, iz paneli, klavye); yalnız çubuk gizlenir. */
.pz-kaydir { position: relative; }
.pz-kaydirici-ic, .pz-kategori-kutulari { scrollbar-width: none; }
.pz-kaydirici-ic::-webkit-scrollbar, .pz-kategori-kutulari::-webkit-scrollbar { display: none; }
.pz-ok {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 44px; height: 44px; min-height: 44px; padding: 0; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--zemin); color: var(--metin); border: 1px solid var(--kenar);
  box-shadow: var(--golge);
}
.pz-ok:hover { background: var(--vurgu); color: var(--vurgu-metin); border-color: var(--vurgu); }
.pz-ok--sol { left: .5rem; }
.pz-ok--sag { right: .5rem; }
.pz-ok[disabled] { opacity: 0; pointer-events: none; }

/* 22 Eyl 2026 (Reis: "açıklama resmin tam ortasından ilerliyor"): başlık,
   açıklama ve düğme SOL SÜTUNDA tek blok — açıklama düğme hizasında kırılır,
   görselin ortasını kesmez. */
.pz-kare-metin > strong { max-width: 30rem; }
/* 23 Eyl 2026 (Reis, işaretli ekran görüntüsü): hero'da açıklama DÜĞMENİN
   SAĞINDA, aynı satırda — başlık üstte tam genişlik. */
.pz-kare--hero .pz-kare-metin {
  grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: 1.25rem;
}
.pz-kare--hero .pz-kare-metin > strong { grid-column: 1 / -1; }
.pz-kare--hero .pz-kare-metin > .dugme { grid-column: 1; grid-row: 2; margin-top: 0; }
.pz-kare--hero .pz-kare-metin > span:not(.dugme) { grid-column: 2; grid-row: 2; max-width: none; }

/* ── avantaj kutuları ──────────────────────────────────────────────── */
.pz-avantajlar {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem;
  margin: 0 0 var(--b-5);
}

.pz-avantaj {
  display: flex; align-items: center; gap: .75rem;
  padding: .75rem 1rem; background: var(--zemin); border: 1px solid var(--kenar);
  border-radius: var(--yaricap-kucuk); color: var(--birincil);
}

.pz-avantaj span { display: grid; color: var(--soluk); font-size: var(--yazi-xs); }

.pz-avantaj strong { color: var(--metin); font-size: var(--yazi-sm); }

/* ── kategori kutuları ─────────────────────────────────────────────── */
.pz-bolum { background: var(--zemin); border: 1px solid var(--kenar); border-radius: var(--yaricap-kucuk); padding: 1rem 1.25rem 1.25rem; margin-bottom: var(--b-4); }

/* Reis 22 Eyl 2026: TEK sıra, masaüstünde 7 kutu görünür, fazlası yatay
   kaydırılır (sarmaz). Dar ekranda 5 / 3,5 — yarım kutu kaydırma ipucudur. */
.pz-kategori-kutulari {
  --kat-gorunur: 7;
  display: grid; grid-auto-flow: column; gap: .75rem;
  grid-auto-columns: calc((100% - (var(--kat-gorunur) - 1) * .75rem) / var(--kat-gorunur));
  overflow-x: auto; scroll-snap-type: x proximity; padding-bottom: .25rem;
}

.pz-kategori-kutulari > .pz-kategori-kutu { scroll-snap-align: start; }

@media (max-width: 64rem) { .pz-kategori-kutulari { --kat-gorunur: 5; } }

@media (max-width: 48rem) { .pz-kategori-kutulari { --kat-gorunur: 3.5; } }

.pz-kategori-kutu {
  display: grid; justify-items: center; gap: .5rem; padding: .75rem .5rem;
  border: 1px solid var(--kenar); border-radius: var(--yaricap-kucuk);
  text-decoration: none; color: var(--metin); background: var(--yuzey);
}

.pz-kategori-kutu:hover { border-color: var(--birincil); color: var(--birincil); }

.pz-kategori-kutu img, .pz-kategori-harf {
  width: 5rem; height: 5rem; border-radius: var(--yaricap-kucuk); object-fit: cover;
  display: grid; place-items: center; background: var(--vurgu-zemin); font-weight: 800; font-size: 1.5rem;
}

.pz-kategori-ad { font-size: var(--yazi-sm); font-weight: 600; text-align: center; }

/* ── yatay ürün şeridi ─────────────────────────────────────────────── */
.pz-serit-izgara {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(11rem, 1fr);
  gap: .75rem; overflow-x: auto; scroll-snap-type: x proximity; padding-bottom: .25rem;
}

.pz-serit-izgara > .kart { scroll-snap-align: start; }

/* ── ürün sayfası: bilgi sütunu yapışkan, büyük sepet düğmesi ──────── */
.urun-bilgi { position: sticky; top: 5rem; align-self: start; }

.sepete-ekle button[type="submit"] { min-height: 52px; font-size: var(--yazi-lg); flex: 1; }

@media (max-width: 64rem) {
  .pz-avantajlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 48rem) {
  .pz-kare { flex-basis: 92%; aspect-ratio: 16 / 9; }
  /* 23 Eyl 2026: slayt yazısı SOLDA basıldığından görselin asıl konusu
     sağdadır (banner özelliği: ürün yatayda ~%20–%94); 16:9 kırpma ortadan
     yapılsaydı sağdaki ürün kesilirdi (LeylArt fincan, salyangoz sürahi). */
  .pz-kare img { object-position: var(--odak, 80% 50%); }
  .pz-avantajlar { grid-template-columns: 1fr 1fr; gap: .5rem; }
  .pz-avantaj { padding: .6rem .75rem; }
  .pz-bolum { padding: .75rem .75rem 1rem; }
  .urun-bilgi { position: static; }
}

@media (max-width: 48rem) {
  /* mobil banner: yalnız başlık + düğme (alt başlık görseli örtüyordu) */
  .pz-kare-metin > span:not(.dugme) { display: none; }
  .pz-kare-metin { padding: .9rem 1rem; }
}

/* ölçüm (5 Eyl): sepet ikon düğmesi formun içinde 20 px'e büzülüyordu; kategori
   bağlantıları satır genişliğini doldursun (24 px kuralı) */
.pz-sepet { flex: none; }
.pz-sepet .pz-kart-eylem, .pz-fiyat-satiri .pz-kart-eylem { width: 44px; min-width: 44px; height: 44px; padding: 0; }
.pz-filtre-kategoriler li { display: block; }
.pz-filtre-kategoriler a { display: flex; align-items: center; width: 100%; min-height: 44px; padding: .2rem 0; }

/* ── ürün sayfası, ikinci dilim (5 Eyl): iki sütun, satın alma kutusu, çapa sekmeleri ── */
.urun-sayfa { grid-template-columns: minmax(0, 1fr) 24rem; }

/* 23 Eyl 2026: açıklama galerinin altında (sol sütun, 2. satır); satın alma
   sütunu iki satır boyunca uzanır ki açıklama galerinin hemen altına otursun. */
.urun-sayfa > .pz-bilgi { grid-row: span 2; }
.pz-aciklama-alani { grid-column: 1; min-width: 0; }
.pz-aciklama-alani .tam-aciklama { margin-top: 0; }
.pz-paylas { margin: .25rem 0 1rem; }
/* Reis 23 Eyl: paylaş satırı galerinin altında ORTALI. */
.pz-paylas .paylas { justify-content: center; }
.pz-paylas .paylas-bilgi { text-align: center; }
@media (max-width: 48rem) {
  .urun-sayfa > .pz-bilgi { grid-row: auto; }
}

.pz-bilgi { display: grid; gap: .9rem; }

.pz-satin-kutu {
  border: 1px solid var(--kenar); border-radius: var(--yaricap); padding: 1rem;
  display: grid; gap: .8rem; background: var(--zemin);
}

.pz-satin-kutu .fiyat-satiri { margin: 0; }
.pz-satin-kutu .fiyat { font-size: var(--yazi-2xl); color: var(--birincil); font-weight: 800; }
.pz-satin-kutu .sepete-ekle { flex-wrap: wrap; }

.pz-hemen-al {
  flex-basis: 100%; min-height: 48px; font-size: var(--yazi-md);
  background: var(--zemin); color: var(--birincil); border: 2px solid var(--birincil);
}

.pz-hemen-al:hover:not(:disabled), .pz-hemen-al:focus-visible { background: var(--vurgu-zemin); }
.pz-hemen-al:disabled { opacity: .5; cursor: not-allowed; }

.pz-satin-kutu .stok-kargo { margin: 0; padding-top: .6rem; border-top: 1px solid var(--kenar); }

.pz-sekmeler {
  display: flex; gap: .25rem; overflow-x: auto; border-bottom: 2px solid var(--kenar);
  margin: 1.5rem 0 .5rem; scrollbar-width: thin;
}

.pz-sekmeler a {
  flex: none; padding: .7rem 1rem; min-height: 44px; display: inline-flex; align-items: center;
  color: var(--soluk); text-decoration: none; font-weight: 600; margin-bottom: -2px;
  border-bottom: 2px solid transparent;
}

.pz-sekmeler a:hover, .pz-sekmeler a:focus-visible { color: var(--birincil); border-bottom-color: var(--birincil); }

.pz-ozellikler { display: grid; gap: 1rem; scroll-margin-top: 5rem; }
.tam-aciklama, .yorumlar, .sorular { scroll-margin-top: 5rem; }

/* mobil: JS satın alma çubuğu açılınca genel alt çubuk çekilir (iki sabit çubuk üst üste binmesin) */
@media (max-width: 52rem) {
  .urun-sayfa { grid-template-columns: 1fr; }
  body.mobil-cta-var .pz-alt-cubuk { display: none; }
}

/* ölçüm (5 Eyl, ikinci dilim): satır içi bağlantılar da 24 px hedefe çekilir */
.kirilim a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.pz-bilgi .puan-satiri a { display: inline-block; padding: .2rem 0; }

/* destek başlatıcı: mobilde alt çubuğun üstünde (5 Eyl) */
@media (max-width: 48rem) {
  .destek { --destek-alt: 3.75rem; }
  body.mobil-cta-var .destek { --destek-alt: 5.25rem; }
}

/* ürün etiketleri (5 Eyl): TY deseni — küçük, köşeli, üst üste */
.pz-kart .rozet-etiket { border-radius: 4px; font-size: 11px; padding: .25rem .4rem; }
.pz-kart .rozet-video { bottom: auto; top: 3rem; }

/* ürün sayfası rozetleri (5 Eyl) */
.pz-bilgi ~ .urun-gorsel .kart-rozetler, .urun-gorsel .kart-rozetler { top: .9rem; left: .9rem; }

/* Reis 22 Eyl 2026: duyuru bandı %50 daha yüksek (39 → 59 px) ve yazısı
   bir kademe büyük. Renk mağazaya özeldir (Ayarlar → Duyuru → bant rengi). */
.duyuru { min-height: 59px; padding-top: .5rem; padding-bottom: .5rem; font-size: var(--yazi-md); }

/* ══ 24 Eyl 2026 — MOBİL UYGULAMA KALİTESİ (Reis: "mobilde uygulama
   kalitesinde düzgün görünmeli, insanların çoğu mobilden giriyor") ═══════
   Ölçüm (390 px): yapışkan üst bar 124 px + alt çubuk 57 px → ekranın
   üçte biri kabuktu; kart başlıkları 4 satıra taşıyor, fiyat kırılıyor,
   bölüm kutuları çift kenar boşluğu yiyordu. */
@media (max-width: 48rem) {
  main { padding-top: var(--b-3); }

  /* Üst bar: logo satırı kaydırınca yukarı çıkar, ARAMA üstte yapışık kalır
     (negatif `top`: başlık, ilk satırı + satır aralığı kadar yukarıda
     yapışır). Satır yüksekliği SABİT (4.25rem logo) — `top` ona bağlıdır. */
  .pz-ust { top: -4.75rem; }
  .pz-ust-ic {
    grid-template-rows: 4.25rem auto; row-gap: .5rem;
    padding: .375rem var(--b-3) .5rem;
  }
  .pz-marka { min-height: 0; height: 4.25rem; }
  /* Reis 24 Eyl: "mobildeki logoyu büyütebilir miyiz" — 52 → 68 px. */
  .pz-marka .marka-logo { height: 4.25rem; max-width: 12rem; }
  .pz-genis-eylem { display: none; }
  .pz-ara .arama-alani input { min-height: 44px; }
  .pz-ara button { padding: 0 1rem; min-height: 44px; }

  /* Duyuru bandı telefonda tek ince satır (masaüstü 59 px kalır). */
  /* 25 Eyl: bağlantılı duyuru 44 px — bant boşluğu bağlantıya verilir. */
  .duyuru { min-height: 44px; padding-top: 0; padding-bottom: 0; font-size: var(--yazi-sm); }

  /* Bölümler kenardan kenara (uygulama deseni); şeritler ekran kenarına
     kadar kayar, ilk kart hizalı başlar. */
  .pz-bolum {
    margin-inline: calc(-1 * var(--b-4)); border-radius: 0; border-left: 0; border-right: 0;
    padding: .9rem var(--b-4) 1rem; margin-top: 0; margin-bottom: .6rem;
  }

  /* Ürün görseli telefonda ekran genişliğinde, kart oranıyla (3:4): 1:1
     kutuda `contain` iken 3:4 fotoğrafın iki yanında boş şerit kalıyordu. */
  .urun-gorsel img.ana-gorsel { aspect-ratio: 3 / 4; }

  /* Ürün sayfası: satın alma kutusu telefonda çerçevesiz — kutu içinde
     kutu içinde kutu (satın alma › adet › stok) sıkışık görünüyordu. */
  .pz-satin-kutu { border: 0; padding: 0; background: transparent; }
  /* Reis 24 Eyl: "bazı resimler/ürünler yarım görünüyor, çirkin". Şerit
     TAM kart gösterir (2 ürün / 4 kategori / 1 banner) ve kaydırma kart
     başına oturur (mandatory snap) — ekran kenarında yarım kart kalmaz. */
  .pz-serit-izgara {
    grid-auto-columns: calc((100% - .5rem) / 2); gap: .5rem;
    scroll-snap-type: x mandatory;
  }
  .pz-kategori-kutulari { --kat-gorunur: 4; gap: .5rem; scroll-snap-type: x mandatory; }
  /* taban formül .75rem aralıkla hesaplar; aralık .5rem iken sağda 5. kutunun
     ucu görünüyordu — genişlik aynı aralıkla hesaplanır. */
  .pz-kategori-kutulari { grid-auto-columns: calc((100% - 3 * .5rem) / 4); }
  .pz-kare { flex-basis: 100%; }
  .pz-kaydirici-ic { gap: 0; }
  /* Banner görseli telefonda BÜTÜN görünür (5:2, kırpılmaz): 16:9 kırpma
     kolaj görsellerde bir buçuk fotoğraf gösteriyordu. Yazı görselin
     ALTINA iner — dar görselin üstüne binseydi görseli örterdi. */
  .pz-kaydirici .pz-kare {
    aspect-ratio: auto; display: flex; flex-direction: column;
    background: var(--zemin); border: 1px solid var(--kenar);
  }
  .pz-kaydirici .pz-kare img { aspect-ratio: 5 / 2; height: auto; object-position: var(--odak, 50% 50%); }
  .pz-kaydirici .pz-kare .pz-kare-metin {
    position: static; background: none; color: var(--metin);
    grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: .75rem;
    padding: .7rem .9rem .8rem;
  }
  .pz-kaydirici .pz-kare .pz-kare-metin > strong { grid-column: 1; grid-row: 1; font-size: 1.05rem; }
  .pz-kaydirici .pz-kare .pz-kare-metin > .dugme { grid-column: 2; grid-row: 1; margin: 0; padding: .55rem .9rem; }

  /* Kategori şeridi (üstte): yazı kenarda KESİLMEZ, sağda yumuşakça silinir
     — kaydırılabildiği de böyle anlaşılır. */
  .pz-serit { mask-image: linear-gradient(to right, black 82%, transparent); }

  /* Logo ORTADA: [menü] [logo] [sepet] — sola yaslı logo ile sağdaki sepet
     arasında boş bir koridor kalıyordu (Reis 24 Eyl). */
  .pz-ust-ic { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
  /* Menü düğmesi sepetle AYNI biçimde: çerçevesiz ikon + küçük etiket. */
  .pz-ust-ic > .menu-dugme {
    justify-self: start; border: 0; background: none; box-shadow: none;
    flex-direction: column; gap: .1rem; min-width: 44px; min-height: 44px; padding: .3rem .25rem;
    color: var(--metin); font-size: .66rem; font-weight: 600; line-height: 1.2;
  }
  .pz-ust-ic > .menu-dugme::after { content: "Menü"; }
  .pz-ust-ic > .pz-marka { justify-self: center; }
  .pz-ust-ic > .pz-eylemler { justify-self: end; }
  .pz-kategori-kutu { padding: .5rem .25rem; gap: .35rem; }
  .pz-kategori-kutu img, .pz-kategori-harf { width: 4rem; height: 4rem; }
  .pz-kategori-ad {
    font-size: .78rem; line-height: 1.25;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }

  /* Kart: fiyat tek satır, başlık 2 satır; kalp ve rozet küçülür. */
  .pz-govde { padding: .5rem .55rem .6rem; }
  .pz-fiyat span { font-size: var(--yazi-md); white-space: nowrap; }
  /* 25 Eyl (Reis): 40 → 44 px dokunma hedefi; fiyat tek satır kalır. */
  .pz-fiyat-satiri .pz-kart-eylem { width: 44px; min-width: 44px; height: 44px; }

  .pz-avantaj { gap: .5rem; }
  .pz-avantaj strong { font-size: .8rem; }

  /* Alt çubuk: 5 sekme, bulunulan bölüm işaretli, sepet rozeti. */
  .pz-alt-cubuk {
    grid-template-columns: repeat(5, 1fr);
    padding-bottom: env(safe-area-inset-bottom, 0);
    box-shadow: 0 -2px 10px color-mix(in srgb, var(--metin) 6%, transparent);
  }
  .pz-alt-cubuk a { position: relative; min-height: 54px; font-size: .68rem; font-weight: 600; }
  .pz-alt-cubuk a[aria-current="page"] { color: var(--birincil); }
  .pz-alt-cubuk .sepet-rozet { top: .3rem; right: calc(50% - 1.35rem); }
}

/* Dokunmatik ekranda kaydırma okları gereksiz ve kartların üstüne biner;
   alan parmakla kaydırılır. */
@media (hover: none) {
  .pz-ok, .sahne-ok { display: none; }
  .pz-alt-cubuk a:hover { color: var(--soluk); }
  .pz-alt-cubuk a[aria-current="page"]:hover { color: var(--birincil); }
}