/* ══════════════════════════════════════════════════════════════════
   SHOP.HTML RESPONSIVE — Alle Breakpoints
   ─────────────────────────────────────────────────────────────────
   Additive Overrides, bestehende Styles unberührt.
══════════════════════════════════════════════════════════════════ */


/* ── Shop: Globale Mobile-Basis (≤767px) ──────────────────────── */
@media (max-width: 767px) {

  /* Topbar */
  #topbar {
    padding: 0 20px;
  }
  #shopLogo {
    font-size: .68rem;
    letter-spacing: .25em;
    gap: 7px;
  }
  #shopLogoSub {
    display: none; /* "Shop" ausblenden auf xs */
  }
  #cartBtn {
    font-size: .58rem;
    letter-spacing: .18em;
    gap: 5px;
  }
  #cartCount {
    font-size: .55rem;
    padding: 1px 4px;
  }

  /* Feed-Hero (Fullscreen-Slider) — Typo unten, volle Höhe */
  .feed-hero-mega {
    min-height: 100svh;
  }
  .feed-hero-inner,
  #feedHero {
    min-height: 100svh;
    min-height: 100dvh;
    padding: calc(var(--nav-h) + 20px) 20px clamp(150px, 26vh, 220px);
  }
  #feedHeroTitle {
    font-size: clamp(2.2rem, 10vw, 4rem) !important;
    line-height: .9;
  }
  #feedHeroSub {
    font-size: .72rem;
  }
  .feed-hero-controls {
    bottom: 52px;
  }
  .feed-hero-arrow {
    width: 38px;
    height: 38px;
    font-size: 1.2rem;
  }

  /* Filter-Leiste — gleiche Glas-Leiste wie Desktop, engerer Rand */
  #feedFilters {
    margin: 0 20px 22px;
    padding: 12px 14px;
    gap: 8px;
  }
  #filterSearch {
    min-width: 100%;
    order: -1; /* Suche zuerst */
    margin-bottom: 6px;
    margin-left: 0;
  }
  #filterSep {
    display: none;
  }
  .flt-btn {
    font-size: .52rem;
    padding: 6px 12px;
    letter-spacing: .2em;
  }

  /* Produkt-Grid */
  #feedGrid {
    padding: 0 20px 60px;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
  #feedEmpty {
    grid-column: 1 / -1;
  }

  /* Produkt-Karten */
  .prod-card-info {
    padding: 10px 12px 14px;
  }
  .prod-card-name {
    font-size: .72rem;
    letter-spacing: .08em;
  }
  .prod-card-sub {
    font-size: .58rem;
  }
  .prod-card-price {
    font-size: .82rem;
  }
  .prod-ov-buy {
    font-size: .6rem;
    letter-spacing: .2em;
    padding: 7px 0;
  }

  /* Cart-Overlay */
  #cartOverlay {
    width: 100vw; /* Volle Breite auf Mobile */
  }
  #cartHeader {
    padding: 16px 20px;
  }
  #cartItems {
    padding: 16px 20px;
  }
  #cartDiscountRow {
    padding: 12px 20px;
  }
  #cartTotals {
    padding: 12px 20px;
  }
  #cartFooter {
    padding: 16px 20px;
  }

  /* Print-Popup */
  #printPopupInner {
    max-height: 95vh;
  }
  #printPreviewCol {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,.06);
    padding: 16px 20px;
  }
  #printFormatsCol {
    padding: 16px 20px;
  }
  .print-fmt-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 6px;
  }

  /* Unlock-Overlay */
  #unlockOverlay {
    padding: 40px 20px;
  }
  #downloadArea {
    width: 100%;
  }
  .dl-item {
    padding: 14px 16px;
  }

}


/* ── Shop: 375–429px ──────────────────────────────────────────── */
@media (max-width: 429px) {

  #feedGrid {
    grid-template-columns: 1fr; /* 1-spaltig auf sehr kleinen Geräten */
    gap: 12px;
  }

  .prod-card-img .prod-badge {
    font-size: .42rem;
  }

  #printPopupBody {
    flex-direction: column;
  }
  .print-fmt-grid {
    grid-template-columns: 1fr !important;
  }

  /* Hero-Info unten links ausblenden */
  #detailHeroInfo {
    display: none !important;
  }

}


/* ── Shop: Tablet (768–1023px) ────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1023px) {

  #topbar {
    padding: 0 40px;
  }

  .feed-hero-inner,
  #feedHero {
    min-height: 100svh;
    padding: calc(var(--nav-h) + 28px) 40px clamp(160px, 22vh, 240px);
  }

  #feedFilters {
    margin: 0 40px 28px;
    padding: 14px 18px;
  }

  #feedGrid {
    padding: 0 40px 80px;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
  }

  /* Detail: Panel-Breite auf Tablet */
  #detailInner {
    grid-template-columns: 1fr min(380px, 44vw) !important;
  }
  #detailInfo {
    padding: calc(var(--nav-h) + 24px) 28px 80px;
  }

  /* Print-Popup: Body anpassen */
  #printPreviewCol {
    width: 200px;
  }

}


/* ── Shop: Desktop-S (1024–1279px) ───────────────────────────── */
@media (min-width: 1024px) and (max-width: 1279px) {

  #topbar {
    padding: 0 6vw;
  }

  .feed-hero-inner,
  #feedHero {
    min-height: 100vh;
    min-height: 100dvh;
    padding: calc(var(--nav-h) + 28px) 6vw clamp(170px, 20vh, 250px);
  }

  #feedFilters {
    margin: 0 6vw 32px;
    padding: 14px 18px;
  }

  #feedGrid {
    padding: 0 6vw 80px;
    gap: 16px;
  }

  /* Detail-Panel etwas schmaler */
  #detailInner {
    grid-template-columns: 1fr min(420px, 38vw) !important;
  }

}