/* ============================================================
   YATPAK — Responsive Düzeltmeler
   Bootstrap grid'in kapsamadığı ince ayarlar.
   Breakpoint'ler: 320 / 375 / 425 / 768 / 992 / 1200 / 1400 / 1920
   ============================================================ */

/* 1920px+ — geniş ekranlarda hero'yu sınırla */
@media (min-width: 1920px) {
  .hero { min-height: 900px; }
}

/* 1200px altı */
@media (max-width: 1199.98px) {
  .section { padding: 72px 0; }
  .cta-banner { padding: 44px; }
}

/* 992px altı — tablet */
@media (max-width: 991.98px) {
  .hero { min-height: 720px; padding: 90px 0 60px; align-items: flex-start; }
  .glass-card { margin: 40px auto 0; max-width: 480px; }
  .yp-navbar .navbar-collapse {
    background: var(--yp-surface);
    border: 1px solid var(--yp-border);
    border-radius: 14px;
    box-shadow: var(--yp-shadow-md);
    padding: 14px 18px;
    margin-top: 10px;
  }
  .cta-banner { text-align: center; }
  .cta-banner .cta-badges { justify-content: center; }
  .cta-banner img { margin-top: 30px; }
}

/* 768px altı — mobil yatay/dikey */
@media (max-width: 767.98px) {
  .section { padding: 56px 0; }
  .section-title { font-size: 1.7rem; }
  .topbar .badge-item { margin-right: 12px; }
  .topbar .badge-item span { display: none; }        /* mobilde sadece ikonlar */
  .topbar .badge-item:first-child span { display: inline; }
  .hero { min-height: 640px; }
  .hero-subtitle { margin-bottom: 26px; }
  .cta-banner { padding: 34px 24px; }
  .cta-banner img { max-height: 190px; }
  .yp-footer { padding-top: 52px; text-align: center; }
  .yp-footer .social-icons { justify-content: center; }
  .whatsapp-float { width: 50px; height: 50px; font-size: 1.5rem; bottom: 18px; left: 18px; }
  .back-to-top { bottom: 18px; right: 18px; }
  /* Ürün detayda mobil sticky bar görünürken alt boşluk */
  body.has-sticky-atc { padding-bottom: 76px; }
}

/* 425px altı — küçük telefonlar */
@media (max-width: 424.98px) {
  .hero-title { font-size: 2.1rem; }
  .hero .btn { width: 100%; }
  .glass-card { padding: 20px; }
  .product-card { padding: 20px; }
  .pd-price { font-size: 1.6rem; }
}

/* 320px — en dar */
@media (max-width: 340px) {
  .section-title { font-size: 1.45rem; }
  .topbar { font-size: .72rem; }
}