/* ═══════════════════════════════════════════════════════════════════════════
   DER SHOP (14.10.2026) — eigenes Kachelsystem auf Weiß.

   Christopher: „mehr Weiß und das Kachelsystem wie bei Augenoptik bei Meta … ein
   High-End-Design-Shop." Zweite Runde am selben Tag: „Die Schriftart soll die gleiche bleiben
   wie auf der Webseite … die rote Farbe möchte ich nicht, bleib bei einem weißen Hintergrund und
   nimm Blau und Goldtöne." Darum: Nunito überall, Haus-Blau als Akzent, Gold für Höhepunkte,
   Bildflächen kühl-hell (das Rot biss sich mit den farbigen Gläsern der Produktbilder).

   WooCommerces eigene Stile sind abgeschaltet (inc/shop.php, woocommerce_enqueue_styles) —
   alles, was der Shop braucht, steht hier. Vorlagen: woocommerce.php, inc/shop.php,
   woocommerce/content-product.php, woocommerce/content-single-product.php.
   ═══════════════════════════════════════════════════════════════════════════ */

.bv-shop{
  --akzent:#13376D; --akzent-tief:#0B2347; --akzent-hell:#2E63A8;
  --hell:#F2F6FB; --hell-2:#E4ECF7; --hell-3:#D3E0F2;
  --tinte:#1A1F2B; --grau:#6B7280; --rand:rgba(26,31,43,.08);
  --gruen:#1F8A5B; --bernstein:#B7791F;
  --sh-r:26px; --sh-r-s:16px;
  --sh-schatten:0 1px 2px rgba(26,31,43,.04), 0 8px 28px rgba(26,31,43,.06);
  --sh-schatten-hoch:0 2px 6px rgba(26,31,43,.05), 0 24px 60px rgba(19,55,109,.16);
  --sh-gasse:clamp(10px,1.2vw,18px);
  color:var(--tinte);
  padding:clamp(18px,3vw,44px) clamp(14px,3vw,48px) clamp(40px,5vw,80px);
  max-width:var(--breite); margin:0 auto;
  --oben:96px;   /* Unterkante der festen Kopfleiste (gemessen 85 px) + Luft */
}
.seitenblatt.bv-shop-blatt{ background:#fff; overflow:clip }   /* hidden würde position:sticky aushebeln */
.bv-shop section{ padding:0 }                 /* grund.css gibt jeder section 105,6 px */
.bv-shop a{ color:inherit }
.admin-bar .bv-shop{ --oben:128px }   /* + 32 px Admin-Leiste */
.bv-shop img{ max-width:100%; height:auto; display:block }
.bv-shop .screen-reader-text{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap }
.bv-shop ul.products, .bv-shop .sh-zusagen, .bv-shop .sh-schritte{ list-style:none; margin:0; padding:0 }

/* ── Grundbausteine ─────────────────────────────────────────────────────── */
.sh-kachel{
  position:relative; background:#fff; border:1px solid var(--rand);
  border-radius:var(--sh-r); box-shadow:var(--sh-schatten); overflow:hidden;
}
.sh-zeile{
  margin:0 0 .7em; font-size:.72rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:var(--akzent);
}
.sh-gross{
  font-family:inherit; font-weight:900; letter-spacing:-.03em;
  font-size:clamp(2.3rem,1.5rem + 3.4vw,4.4rem); line-height:1; margin:0 0 .3em;
}
.sh-mittel{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:clamp(1.8rem,1.2rem + 1.8vw,2.6rem); line-height:1; margin:0 0 .6em }
.sh-punkt{ color:var(--gold) }
.sh-krume{ display:flex; flex-wrap:wrap; gap:.5em; align-items:center; font-size:.85rem; color:var(--grau); margin:0 0 1.2em }
.sh-krume a{ text-decoration:none; color:var(--akzent); font-weight:700 }
.sh-krume a:hover{ text-decoration:underline }

.sh-knopf, .bv-shop .button, .bv-shop button[type=submit], .bv-shop #place_order{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  min-height:46px; padding:.7em 1.4em; border-radius:999px; border:0; cursor:pointer;
  font:inherit; font-weight:800; font-size:.92rem; line-height:1.1; text-decoration:none;
  background:var(--akzent); color:#fff;
  box-shadow:0 6px 18px rgba(19,55,109,.22);
  transition:transform .3s var(--weich), box-shadow .3s var(--weich), background .2s;
}
.sh-knopf:hover, .bv-shop .button:hover, .bv-shop button[type=submit]:hover, .bv-shop #place_order:hover{
  background:var(--akzent-hell); transform:translateY(-2px); box-shadow:0 12px 30px rgba(19,55,109,.30);
}
.sh-knopf:active, .bv-shop .button:active{ transform:none }
.bv-shop .button:disabled, .bv-shop .button.disabled{ opacity:.45; pointer-events:none }
.bv-shop .button.loading{ opacity:.7 }
.bv-shop .button.added::after{ content:"✓"; margin-left:.2em }
.sh-knopf-hell{ background:rgba(255,255,255,.14); color:#fff; box-shadow:none;
  border:1px solid rgba(255,255,255,.35); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px) }
.sh-knopf-hell:hover{ background:#fff; color:var(--akzent) }

/* ── Bühne: das Kachelfeld oben ─────────────────────────────────────────── */
.sh-buehne{
  display:grid; gap:var(--sh-gasse);
  grid-template-columns:repeat(12,minmax(0,1fr));
  grid-template-rows:auto auto auto;
  margin-bottom:clamp(18px,2.4vw,32px);
}
.sh-intro{
  grid-column:1 / 8; grid-row:1 / 3;
  padding:clamp(26px,3.6vw,56px); color:#fff; border:0;
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(203,176,130,.42) 0%, rgba(203,176,130,0) 48%),
    radial-gradient(90% 120% at 0% 100%, rgba(46,99,168,.85) 0%, rgba(46,99,168,0) 60%),
    linear-gradient(140deg, var(--akzent-tief) 0%, var(--akzent) 55%, #1E4A8A 100%);
  display:flex; flex-direction:column; justify-content:flex-end; min-height:clamp(320px,34vw,470px);
}
.sh-intro::before{  /* feines Raster als Struktur, kein Bild */
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.14;
  background-image:linear-gradient(rgba(255,255,255,.5) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.5) 1px, transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(80% 80% at 80% 10%, #000, transparent 70%); mask-image:radial-gradient(80% 80% at 80% 10%, #000, transparent 70%);
}
.sh-intro .sh-zeile{ color:var(--gold) }
.sh-intro .sh-gross{ color:#fff }
.sh-leit{ max-width:40ch; font-size:clamp(1rem,.9rem + .35vw,1.18rem); line-height:1.5; color:rgba(255,255,255,.86); margin:0 0 1.4em }
.sh-knoepfe{ display:flex; flex-wrap:wrap; gap:10px }

.sh-schau{
  grid-column:8 / 13; grid-row:1 / 3; border:0; min-height:clamp(300px,30vw,470px);
  background:radial-gradient(70% 60% at 50% 55%, #fff 0%, var(--hell) 55%, var(--hell-2) 100%);
}
.sh-schau-bild{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; text-decoration:none;
  opacity:0; transform:translateX(18px) scale(.98); transition:opacity .9s var(--weich), transform 1.1s var(--weich); pointer-events:none }
.sh-schau-bild.ist-an{ opacity:1; transform:none; pointer-events:auto }
.sh-schau-bild img{ width:92%; margin:0 auto; mix-blend-mode:multiply; filter:drop-shadow(0 26px 22px rgba(19,55,109,.14));
  animation:sh-schweben 7s ease-in-out infinite }
.sh-schau-text{ position:absolute; left:clamp(18px,2vw,28px); bottom:clamp(18px,2vw,26px); display:flex; flex-direction:column; gap:2px }
.sh-schau-marke{ font-weight:800; font-size:.95rem; color:var(--tinte) }
.sh-schau-preis{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:1.7rem; line-height:1; color:var(--akzent) }
.sh-schau-punkte{ position:absolute; right:clamp(18px,2vw,28px); bottom:clamp(22px,2.2vw,30px); display:flex; gap:6px }
.sh-schau-punkte span{ width:7px; height:7px; border-radius:99px; background:rgba(19,55,109,.22); transition:width .4s var(--weich), background .4s }
.sh-schau-punkte span.ist-an{ width:22px; background:var(--akzent) }

.sh-fakt{ grid-column:span 2; padding:clamp(16px,1.6vw,24px); display:flex; flex-direction:column; justify-content:space-between; gap:.6em; min-height:132px }
.sh-fakt-zahl{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:clamp(2rem,1.4rem + 1.6vw,2.9rem); line-height:1; color:var(--akzent) }
.sh-fakt-wort{ font-size:.86rem; font-weight:700; color:var(--grau); line-height:1.3 }
.sh-fakt-hell{ background:var(--hell); border-color:transparent }
.sh-fakt-gold{ background:var(--gold-zart); border-color:transparent }
.sh-fakt-gold .sh-fakt-zahl{ color:var(--gold-tief) }

.sh-sehstaerke{
  grid-column:span 4; text-decoration:none; padding:clamp(18px,1.8vw,26px); border:0;
  display:flex; flex-direction:column; justify-content:space-between; gap:.6em; min-height:132px;
  background:linear-gradient(135deg, #E9D9B8 0%, var(--gold) 100%); color:#2A2113;
  transition:transform .35s var(--weich), box-shadow .35s var(--weich);
}
.sh-sehstaerke .sh-zeile{ color:#5B4A2A; margin:0 }
.sh-sehstaerke-titel{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:clamp(1.4rem,1.1rem + .9vw,1.9rem); line-height:1.05 }
.sh-pfeil{ font-weight:800; font-size:.9rem; transition:transform .3s var(--weich) }
.sh-sehstaerke:hover{ transform:translateY(-3px); box-shadow:var(--sh-schatten-hoch) }
.sh-sehstaerke:hover .sh-pfeil{ transform:translateX(6px) }

/* ── Filterleiste ───────────────────────────────────────────────────────── */
.sh-filter{ position:sticky; top:var(--oben); z-index:20; margin:0 0 var(--sh-gasse) }
.sh-filter-innen{
  display:flex; flex-wrap:nowrap; align-items:center; justify-content:space-between; gap:12px;
  padding:10px; border-radius:22px; background:rgba(255,255,255,.86); border:1px solid var(--rand);
  -webkit-backdrop-filter:blur(16px) saturate(1.4); backdrop-filter:blur(16px) saturate(1.4);
  transition:box-shadow .3s;
}
.sh-filter.klebt .sh-filter-innen{ box-shadow:0 12px 34px rgba(26,31,43,.12) }
.sh-chips{ display:flex; flex-wrap:nowrap; gap:6px; align-items:center; flex:1 1 0; min-width:0; overflow-x:auto; scrollbar-width:none;
  padding:2px; -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent); mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent) }
.sh-chips::-webkit-scrollbar{ display:none }
.sh-chip{ white-space:nowrap; flex:none }
.sh-chip{
  font:inherit; font-size:.86rem; font-weight:700; cursor:pointer;
  padding:.5em .95em; border-radius:999px; border:1px solid var(--rand); background:#fff; color:var(--tinte);
  transition:background .2s, color .2s, border-color .2s, transform .2s;
}
.sh-chip span{ font-weight:800; font-size:.75rem; opacity:.5; margin-left:.25em }
.sh-chip:hover{ border-color:var(--akzent); transform:translateY(-1px) }
.sh-chip.ist-an{ background:var(--akzent); border-color:var(--akzent); color:#fff }
.sh-chip.ist-an span{ opacity:.75 }
.sh-chip-leise{ background:var(--hell); border-color:transparent }
.sh-chips-trenner{ width:1px; height:22px; background:var(--rand); margin:0 4px }
.sh-filter-rechts{ display:flex; align-items:center; gap:8px }
.bv-shop .woocommerce-ordering{ margin:0 }
.bv-shop .woocommerce-ordering select, .bv-shop select{
  font:inherit; font-size:.86rem; font-weight:700; color:var(--tinte);
  padding:.55em 2.2em .55em 1em; border-radius:999px; border:1px solid var(--rand); background:#fff;
  -webkit-appearance:none; appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2313376D' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1em center;
}
.bv-shop .sh-korb{ color:#fff }
.sh-korb{ position:relative; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:999px;
  background:var(--tinte); color:#fff; text-decoration:none }
.sh-korb-zahl{ position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 5px; border-radius:99px;
  background:var(--gold); color:#2A2113; font-size:.72rem; font-weight:900; display:flex; align-items:center; justify-content:center;
  transform:scale(0); transition:transform .3s var(--weich) }
.sh-korb.hat-inhalt .sh-korb-zahl{ transform:scale(1) }
.sh-korb.hupf{ animation:sh-hupf .5s var(--weich) }

/* ── Produktraster und Karten ──────────────────────────────────────────── */
.bv-shop ul.products{ display:grid; gap:var(--sh-gasse); grid-template-columns:repeat(auto-fill,minmax(min(100%,262px),1fr)) }
.sh-karte{
  display:flex; flex-direction:column; background:#fff; border:1px solid var(--rand); border-radius:var(--sh-r);
  box-shadow:var(--sh-schatten); overflow:hidden; position:relative;
  transition:transform .45s var(--weich), box-shadow .45s var(--weich), border-color .3s;
}
.sh-karte[hidden]{ display:none }
.sh-karte:hover{ transform:translateY(-6px); box-shadow:var(--sh-schatten-hoch); border-color:rgba(19,55,109,.16) }
.sh-karte-bild{
  position:relative; display:block; aspect-ratio:4 / 3; margin:8px 8px 0; border-radius:calc(var(--sh-r) - 8px); overflow:hidden;
  background:radial-gradient(75% 70% at 50% 58%, #fff 0%, var(--hell) 62%, var(--hell-2) 100%);
}
.sh-karte-bild img{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:8% 6%;
  mix-blend-mode:multiply; transition:opacity .5s var(--weich), transform .8s var(--weich) }
.sh-karte-bild .sh-bild-zwei{ opacity:0 }
.sh-karte:hover .sh-karte-bild.hat-zweit .sh-bild-eins{ opacity:0 }
.sh-karte:hover .sh-karte-bild.hat-zweit .sh-bild-zwei{ opacity:1 }
.sh-karte:hover .sh-karte-bild img{ transform:scale(1.05) }
.sh-reihe{ position:absolute; top:12px; left:12px; padding:.3em .8em; border-radius:99px; font-size:.7rem; font-weight:900;
  letter-spacing:.08em; text-transform:uppercase; background:rgba(255,255,255,.85); color:var(--akzent);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px) }
.sh-karte-text{ display:flex; flex-direction:column; flex:1; padding:16px 18px 18px }
.sh-marke{ margin:0 0 .35em; font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--akzent) }
.sh-titel{ margin:0 0 .9em; font-size:.98rem; font-weight:700; line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden }
.sh-titel a{ text-decoration:none }
.sh-titel a::after{ content:""; position:absolute; inset:0; z-index:1 }   /* ganze Karte klickbar */
.sh-karte-fuss{ margin-top:auto; display:flex; flex-direction:column; gap:10px }
.sh-karte-fuss .button, .sh-karte-fuss .added_to_cart{ position:relative; z-index:2 }
.sh-karte-fuss .button{ width:100% }
.sh-karte-fuss .added_to_cart{ text-align:center; font-size:.82rem; font-weight:800; color:var(--akzent) }

.bv-shop .price{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:1.75rem; line-height:1; color:var(--tinte); display:flex; flex-wrap:wrap; align-items:baseline; gap:.15em .5em; margin:0 }
.bv-shop .price del{ font-size:.6em; color:var(--grau) }
.bv-shop .price ins{ text-decoration:none; color:var(--akzent) }
.bv-shop .woocommerce-price-suffix{ flex-basis:100%; font-size:1rem; line-height:1.2 }
.bv-shop .bv-preisangabe{ font-size:.74rem; font-weight:600; color:var(--grau); letter-spacing:0 }
.bv-shop .bv-preisangabe a{ color:var(--grau) }

.sh-lieferzeit, .bv-shop p.stock{ display:inline-flex; align-items:center; gap:.5em; margin:0; font-size:.8rem; font-weight:800 }
.sh-ampel, .bv-shop p.stock::before{ width:8px; height:8px; border-radius:99px; flex:none; box-shadow:0 0 0 4px rgba(0,0,0,.04) }
.bv-shop p.stock::before{ content:"" }
.sh-lieferzeit.ist-lagernd, .bv-shop p.stock.in-stock{ color:var(--gruen) }
.sh-lieferzeit.ist-lagernd .sh-ampel, .bv-shop p.stock.in-stock::before{ background:var(--gruen); box-shadow:0 0 0 4px rgba(31,138,91,.14) }
.sh-lieferzeit.ist-nachlieferung, .bv-shop p.stock.available-on-backorder{ color:var(--bernstein) }
.sh-lieferzeit.ist-nachlieferung .sh-ampel, .bv-shop p.stock.available-on-backorder::before{ background:var(--bernstein); box-shadow:0 0 0 4px rgba(183,121,31,.14) }

.sh-leer{ margin:24px 0; text-align:center; color:var(--grau) }
.bv-shop .woocommerce-pagination ul{ display:flex; gap:6px; justify-content:center; list-style:none; padding:0; margin:28px 0 0 }
.bv-shop .woocommerce-pagination .page-numbers{ display:inline-flex; min-width:40px; height:40px; align-items:center; justify-content:center; border-radius:99px; border:1px solid var(--rand); text-decoration:none; font-weight:800 }
.bv-shop .woocommerce-pagination .current{ background:var(--akzent); color:#fff; border-color:var(--akzent) }

/* ── Produktseite ───────────────────────────────────────────────────────── */
.sh-produkt-raster{ display:grid; gap:var(--sh-gasse); grid-template-columns:repeat(12,minmax(0,1fr)); align-items:start }
.sh-galerie{ grid-column:1 / 8; border:0; padding:clamp(14px,2vw,28px);
  background:radial-gradient(70% 60% at 50% 45%, #fff 0%, var(--hell) 60%, var(--hell-2) 100%) }
.sh-kauf{ grid-column:8 / 13; position:sticky; top:var(--oben); padding:clamp(22px,2.4vw,36px) }
.sh-produkt-titel{ font-size:clamp(1.35rem,1.05rem + .9vw,1.9rem); line-height:1.2; font-weight:800; margin:0 0 .7em; letter-spacing:-.01em }
.sh-kauf-preis .price{ font-size:clamp(2.2rem,1.7rem + 1.4vw,3rem) }
.sh-kauf-form{ margin:1.2em 0 0 }
.bv-shop form.cart{ display:flex; flex-wrap:wrap; gap:10px; align-items:stretch; margin:14px 0 0 }
.bv-shop form.cart .single_add_to_cart_button{ flex:1; min-height:56px; font-size:1rem }
.bv-shop .quantity .qty{ width:4.4em; height:100%; min-height:56px; text-align:center; font:inherit; font-weight:800;
  border:1px solid var(--rand); border-radius:18px; background:var(--hell) }
.sh-zusagen{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:22px 0 0 }
.sh-zusagen a{ display:flex; flex-direction:column; gap:2px; height:100%; padding:12px 14px; border-radius:var(--sh-r-s); background:var(--hell); text-decoration:none;
  transition:background .2s, transform .2s }
.sh-zusagen a:hover{ background:var(--hell-2); transform:translateY(-1px) }
.sh-zusagen strong{ font-size:.86rem; color:var(--tinte) }
.sh-zusagen span{ font-size:.76rem; color:var(--grau) }
.sh-artnr{ margin:16px 0 0; font-size:.76rem; color:var(--grau) }

/* Galerie (WooCommerce-Markup, ohne seine Stile) */
.bv-shop .woocommerce-product-gallery{ position:relative; margin:0 }
.bv-shop .woocommerce-product-gallery__wrapper{ margin:0 }
.bv-shop .woocommerce-product-gallery__image{ position:relative; overflow:hidden; border-radius:var(--sh-r-s) }
.bv-shop .woocommerce-product-gallery__image img{ width:100%; height:auto; mix-blend-mode:multiply }
.bv-shop .woocommerce-product-gallery__image .zoomImg{ background:#fff }
.bv-shop .woocommerce-product-gallery__trigger{ position:absolute; top:10px; right:10px; z-index:5; width:42px; height:42px; border-radius:99px;
  background:#fff; box-shadow:var(--sh-schatten); display:flex; align-items:center; justify-content:center; text-decoration:none; font-size:1rem }
.bv-shop .woocommerce-product-gallery__trigger img{ display:none }
.bv-shop .flex-control-thumbs{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:14px 0 0; padding:0 }
.bv-shop .flex-control-thumbs li{ width:clamp(56px,7vw,84px) }
.bv-shop .flex-control-thumbs img{ border-radius:12px; background:#fff; padding:4px; opacity:.55; cursor:pointer; border:2px solid transparent; transition:opacity .2s, border-color .2s }
.bv-shop .flex-control-thumbs img.flex-active, .bv-shop .flex-control-thumbs img:hover{ opacity:1; border-color:var(--akzent) }

.sh-produkt-unten{ display:grid; gap:var(--sh-gasse); grid-template-columns:repeat(12,minmax(0,1fr)); margin-top:var(--sh-gasse); align-items:start }
.sh-beschreibung{ grid-column:1 / 9; padding:clamp(22px,3vw,48px) }
.sh-produkt-unten .sh-sehstaerke{ grid-column:9 / 13; min-height:220px; position:sticky; top:var(--oben) }
.sh-text{ max-width:72ch; line-height:1.7 }
.sh-text h1, .sh-text h2, .sh-text h3, .sh-text h4{ font-size:1.08rem; font-weight:800; margin:1.6em 0 .5em; line-height:1.3 }
.sh-text p{ margin:0 0 1em }
.sh-text ul{ padding:0; list-style:none; display:grid; gap:8px; grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr)); margin:0 0 1.2em }
.sh-text ul li{ padding:12px 14px 12px 34px; border-radius:var(--sh-r-s); background:var(--hell); position:relative; font-size:.92rem; line-height:1.45 }
.sh-text ul li::before{ content:""; position:absolute; left:14px; top:1.05em; width:8px; height:8px; border-radius:99px; background:var(--akzent) }
.sh-text .MsoNoSpacing{ margin:0 0 .6em }

.bv-shop .related.products{ margin-top:clamp(28px,4vw,56px) }
.bv-shop .related.products > h2{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:clamp(1.8rem,1.2rem + 1.8vw,2.6rem); margin:0 0 .6em }

/* ── Modelle mit Varianten (Farbe × Größe, wie meta.com) ───────────────── */
.sh-vgalerie-buehne{ position:relative; aspect-ratio:2 / 1; display:flex; align-items:center; justify-content:center }
.sh-vgalerie-bild{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; transition:opacity .25s ease, transform .5s var(--weich) }
.sh-vgalerie-bild.wechselt{ opacity:.25; transform:scale(.985) }
.sh-vgalerie-leiste{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; justify-content:center }
.sh-vgalerie-daumen{ width:clamp(56px,7vw,84px); aspect-ratio:2 / 1; padding:4px; border-radius:12px; border:2px solid transparent;
  background:#fff; cursor:pointer; opacity:.6; transition:opacity .2s, border-color .2s }
.sh-vgalerie-daumen img{ width:100%; height:100%; object-fit:contain }
.sh-vgalerie-daumen.ist-an, .sh-vgalerie-daumen:hover{ opacity:1; border-color:var(--akzent) }

.bv-shop table.variations{ width:100%; border-collapse:collapse; margin:0 }
.bv-shop table.variations tr{ display:block; margin:0 0 16px }
.bv-shop table.variations th, .bv-shop table.variations td{ display:block; padding:0; text-align:left }
.bv-shop table.variations th label{ font-size:.82rem; font-weight:800; color:var(--tinte) }
.sh-wahl-name{ margin-left:.4em; font-size:.82rem; font-weight:600; color:var(--grau) }
.sh-versteckt{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); opacity:0; pointer-events:none }
.sh-wahl{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px }
.sh-wahl-farbe{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) }
.sh-wahl-knopf{ font:inherit; cursor:pointer; border:1.5px solid var(--rand); background:#fff; color:var(--tinte);
  border-radius:14px; transition:border-color .2s, box-shadow .2s, transform .2s, opacity .2s }
.sh-wahl-farbe .sh-wahl-knopf{ aspect-ratio:1 / 1; padding:6px; background:var(--hell); display:flex; align-items:center; justify-content:center; font-size:.72rem }
.sh-wahl-farbe .sh-wahl-knopf img{ width:100%; height:100%; object-fit:contain }
.sh-wahl-groesse .sh-wahl-knopf{ padding:.6em 1.1em; font-size:.88rem; font-weight:700; border-radius:999px }
.sh-wahl-knopf:hover{ border-color:var(--akzent-hell); transform:translateY(-1px) }
.sh-wahl-knopf.ist-an{ border-color:var(--akzent); box-shadow:0 0 0 3px rgba(19,55,109,.14) }
.sh-wahl-groesse .sh-wahl-knopf.ist-an{ background:var(--akzent); color:#fff }
.sh-wahl-knopf.ist-aus{ opacity:.35 }
.bv-shop .reset_variations{ font-size:.8rem; color:var(--grau); margin-top:6px; display:inline-block }
.bv-shop .single_variation_wrap .woocommerce-variation-price{ display:none }   /* der Preis steht oben und wechselt mit (shop.js) */
.bv-shop .woocommerce-variation-add-to-cart{ display:flex; flex-wrap:wrap; gap:10px; align-items:stretch }
.bv-shop .woocommerce-variation-add-to-cart .single_add_to_cart_button{ flex:1; min-height:56px; font-size:1rem }
.bv-shop .woocommerce-variation-add-to-cart.woocommerce-variation-add-to-cart-disabled .single_add_to_cart_button{ opacity:.45 }
.bv-shop .woocommerce-variation-availability{ margin:0 0 10px }
.bv-shop .woocommerce-variation-description p{ margin:0 0 8px; font-size:.85rem; color:var(--grau) }
.bv-shop .sh-ab{ font-size:.55em; font-weight:700; color:var(--grau); letter-spacing:0 }

.sh-farbreihe{ display:flex; align-items:center; gap:4px; margin:-.3em 0 .8em }
.sh-farbpunkt{ width:30px; height:20px; border-radius:6px; background:var(--hell); overflow:hidden; display:inline-flex }
.sh-farbpunkt img{ width:100%; height:100%; object-fit:contain }
.sh-farbzahl{ margin-left:4px; font-size:.74rem; font-weight:700; color:var(--grau) }

/* ── Warenkorb, Kasse, Konto ───────────────────────────────────────────── */
.sh-seitenkopf{ margin:0 0 clamp(18px,2.4vw,30px); display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:12px 24px }
.sh-seitenkopf .sh-krume{ flex-basis:100%; margin:0 }
.sh-seitenkopf .sh-gross{ margin:0 }
.sh-schritte{ display:flex; gap:6px; flex-wrap:wrap }
.sh-schritte li{ display:flex; align-items:center; gap:.5em; padding:.45em .9em .45em .45em; border-radius:99px; background:var(--hell); font-size:.82rem; font-weight:800; color:var(--grau) }
.sh-schritte li span{ width:24px; height:24px; border-radius:99px; display:flex; align-items:center; justify-content:center; background:#fff; color:var(--tinte); font-size:.75rem }
.sh-schritte li.ist-an{ background:var(--akzent); color:#fff }
.sh-schritte li.ist-an span{ color:var(--akzent) }
.sh-schritte li.ist-erledigt span{ background:var(--gruen); color:#fff }

.sh-seiteninhalt > .woocommerce{ display:grid; gap:var(--sh-gasse); grid-template-columns:minmax(0,1fr) minmax(300px,400px); align-items:start }
.sh-seiteninhalt > .woocommerce > *{ grid-column:1 / -1 }
.woocommerce-cart .sh-seiteninhalt .woocommerce-cart-form{ grid-column:1 }
.woocommerce-cart .sh-seiteninhalt .cart-collaterals{ grid-column:2; position:sticky; top:var(--oben) }

.bv-shop table.shop_table{ width:100%; border-collapse:separate; border-spacing:0; background:#fff; border:1px solid var(--rand); border-radius:var(--sh-r); box-shadow:var(--sh-schatten); overflow:hidden }
.bv-shop table.shop_table th, .bv-shop table.shop_table td{ padding:14px 16px; text-align:left; border-bottom:1px solid var(--rand); vertical-align:middle }
.bv-shop table.shop_table thead th{ font-size:.72rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--grau); background:var(--hell) }
.bv-shop table.shop_table tr:last-child > *{ border-bottom:0 }
.bv-shop table.cart .product-thumbnail img{ width:84px; border-radius:14px; background:var(--hell); mix-blend-mode:multiply }
.bv-shop table.cart .product-name a{ font-weight:800; text-decoration:none }
.bv-shop table.cart .product-name dl.variation{ margin:.4em 0 0; font-size:.8rem; color:var(--bernstein); display:flex; gap:.3em }
.bv-shop table.cart .product-name dl.variation dt, .bv-shop table.cart .product-name dl.variation dd{ margin:0 }
.bv-shop table.cart .product-name dl.variation p{ margin:0 }
.bv-shop table.cart a.remove{ display:inline-flex; width:30px; height:30px; border-radius:99px; align-items:center; justify-content:center; background:var(--hell); color:var(--akzent); text-decoration:none; font-size:1.2rem; line-height:1 }
.bv-shop table.cart a.remove:hover{ background:var(--akzent); color:#fff }
.bv-shop table.cart .quantity .qty{ min-height:42px; border-radius:12px }
.bv-shop table.cart td.actions{ text-align:right; background:#fff }
.bv-shop table.cart td.actions .coupon{ display:none }

.bv-shop .cart_totals{ background:#fff; border:1px solid var(--rand); border-radius:var(--sh-r); box-shadow:var(--sh-schatten); padding:clamp(18px,2vw,28px) }
.bv-shop .cart_totals h2{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:1.9rem; margin:0 0 .4em }
.bv-shop .cart_totals table.shop_table{ border:0; box-shadow:none; border-radius:0 }
.bv-shop .cart_totals table.shop_table th{ padding-left:0; font-size:.86rem; color:var(--grau); font-weight:700; width:38% }
.bv-shop .cart_totals table.shop_table td{ padding-right:0 }
.bv-shop .order-total strong .amount, .bv-shop .order-total .amount{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:1.7rem; font-weight:400; color:var(--akzent) }
.bv-shop .includes_tax{ display:block; font-size:.76rem; color:var(--grau) }
.bv-shop .includes_tax .amount{ font-family:inherit; font-size:inherit; color:inherit }
.bv-shop #order_review dl.variation, .bv-shop table.cart dl.variation{ display:flex; gap:.3em; margin:.3em 0 0; font-size:.78rem; color:var(--bernstein); font-weight:700 }
.bv-shop dl.variation dt, .bv-shop dl.variation dd, .bv-shop dl.variation p{ margin:0; padding:0 }
/* Auswahlfelder von selectWoo (Bundesland) — WooCommerces Stile sind abgeschaltet */
.bv-shop .select2-container{ width:100% !important }   /* selectWoo schreibt die Breite inline — nur hier geht es nicht ohne */
.bv-shop .select2-container .select2-selection--single{ height:auto; min-height:46px; display:flex; align-items:center; padding:0 1em; border-radius:14px; border:1px solid rgba(26,31,43,.14); background:#fff; cursor:pointer }
.bv-shop .select2-container .select2-selection__rendered{ padding:0; color:var(--tinte); line-height:1.4 }
.bv-shop .select2-container .select2-selection__arrow{ display:none }
.select2-container--open .select2-dropdown{ border:1px solid rgba(26,31,43,.14); border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 18px 40px rgba(26,31,43,.14) }
.select2-results__option{ padding:.55em 1em; list-style:none }
.select2-results__options{ margin:0; padding:0; max-height:260px; overflow:auto }
.select2-results__option--highlighted{ background:#13376D; color:#fff }
.select2-search--dropdown{ padding:8px }
.select2-search--dropdown .select2-search__field{ width:100%; padding:.5em .8em; border:1px solid rgba(26,31,43,.14); border-radius:10px; font:inherit }
.select2-hidden-accessible{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0) }
.bv-shop .wc-proceed-to-checkout{ margin-top:14px }
.bv-shop .wc-proceed-to-checkout .checkout-button{ width:100%; min-height:58px; font-size:1.02rem }
.bv-shop .woocommerce-shipping-calculator{ font-size:.85rem }
.bv-shop .woocommerce-shipping-destination{ font-size:.82rem; color:var(--grau); margin:.4em 0 }

/* Versand- und Abholwahl als auswählbare Kacheln */
.bv-shop ul#shipping_method{ list-style:none; margin:0; padding:0; display:grid; gap:6px }
.bv-shop ul#shipping_method li{ position:relative; padding:10px 12px 10px 38px; border-radius:14px; border:1px solid var(--rand); background:#fff; font-size:.86rem; line-height:1.3; transition:border-color .2s, background .2s }
.bv-shop ul#shipping_method li:has(input:checked){ border-color:var(--akzent); background:var(--hell) }
.bv-shop ul#shipping_method li input{ position:absolute; left:13px; top:50%; transform:translateY(-50%); accent-color:var(--akzent); margin:0 }
.bv-shop ul#shipping_method li label{ cursor:pointer; display:block }

/* Kasse */
.woocommerce-checkout .sh-seiteninhalt form.checkout{ display:grid; gap:var(--sh-gasse); grid-template-columns:minmax(0,1fr) minmax(320px,440px); align-items:start; grid-column:1 / -1 }
.bv-shop form.checkout #customer_details{ grid-column:1; grid-row:1 / span 3 }
.bv-shop form.checkout #order_review_heading{ grid-column:2; grid-row:1; margin:0; font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:1.9rem }
.bv-shop form.checkout #order_review{ grid-column:2; grid-row:2; position:sticky; top:var(--oben) }
.bv-shop .col2-set{ display:grid; gap:var(--sh-gasse) }
.bv-shop .col2-set > div{ background:#fff; border:1px solid var(--rand); border-radius:var(--sh-r); box-shadow:var(--sh-schatten); padding:clamp(18px,2.2vw,32px) }
.bv-shop .col2-set h3{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:1.7rem; margin:0 0 .6em }
.bv-shop .woocommerce-billing-fields__field-wrapper, .bv-shop .woocommerce-shipping-fields__field-wrapper, .bv-shop .woocommerce-additional-fields__field-wrapper{ display:grid; grid-template-columns:1fr 1fr; gap:4px 14px }
.bv-shop .form-row{ grid-column:1 / -1; margin:0 0 10px; display:flex; flex-direction:column; gap:5px }
.bv-shop .form-row-first{ grid-column:1 }
.bv-shop .form-row-last{ grid-column:2 }
.bv-shop .form-row label{ font-size:.8rem; font-weight:800; color:var(--tinte) }
.bv-shop .form-row .required{ color:var(--akzent); text-decoration:none; border:0 }
.bv-shop .form-row .optional{ font-weight:600; color:var(--grau) }
.bv-shop .input-text, .bv-shop textarea, .bv-shop input[type=email], .bv-shop input[type=tel], .bv-shop input[type=text], .bv-shop input[type=password]{
  width:100%; box-sizing:border-box; font:inherit; font-size:.95rem; padding:.8em 1em; border-radius:14px; border:1px solid rgba(26,31,43,.14); background:#fff; color:var(--tinte);
  transition:border-color .2s, box-shadow .2s }
.bv-shop .input-text:focus, .bv-shop textarea:focus, .bv-shop input:focus, .bv-shop select:focus{ outline:none; border-color:var(--akzent); box-shadow:0 0 0 4px rgba(19,55,109,.12) }
.bv-shop .form-row.woocommerce-invalid .input-text{ border-color:#C0392B }
.bv-shop textarea{ min-height:90px }
.bv-shop #ship-to-different-address{ font-size:1rem; font-family:inherit; font-weight:800; margin:0 0 .6em }
.bv-shop #ship-to-different-address label{ display:flex; gap:.6em; align-items:center; cursor:pointer }
.bv-shop input[type=checkbox], .bv-shop input[type=radio]{ accent-color:var(--akzent); width:18px; height:18px }

.bv-shop #order_review{ background:#fff; border:1px solid var(--rand); border-radius:var(--sh-r); box-shadow:var(--sh-schatten); padding:clamp(16px,2vw,26px) }
.bv-shop #order_review table.shop_table{ border:0; box-shadow:none; border-radius:0 }
.bv-shop #order_review table.shop_table th, .bv-shop #order_review table.shop_table td{ padding:10px 0; font-size:.9rem }
.bv-shop #order_review thead th{ background:none; padding-top:0 }
.bv-shop #order_review .product-name{ padding-right:12px }
.bv-shop #order_review .product-total{ text-align:right }
.bv-shop #order_review tfoot td{ text-align:right }
.bv-shop #order_review tfoot ul#shipping_method li{ text-align:left }
.bv-shop #payment{ margin-top:14px }
.bv-shop #payment ul.payment_methods{ list-style:none; margin:0 0 14px; padding:0; display:grid; gap:8px }
.bv-shop #payment li.wc_payment_method{ padding:12px 14px; border-radius:14px; border:1px solid var(--rand); background:#fff }
.bv-shop #payment li.wc_payment_method:has(input:checked){ border-color:var(--akzent); background:var(--hell) }
.bv-shop #payment li.wc_payment_method > label{ font-weight:800; cursor:pointer; display:inline-flex; align-items:center; gap:.5em; flex-wrap:wrap }
.bv-shop #payment li.wc_payment_method > label img{ display:inline; max-height:24px; width:auto }
.bv-shop #payment li.wc_payment_method > label a.about_paypal{ font-size:.78rem; font-weight:600; color:var(--grau) }
.bv-shop #payment .payment_box{ margin-top:8px; font-size:.85rem; color:var(--grau) }
.bv-shop #payment .payment_box p{ margin:0 }
.bv-shop .woocommerce-terms-and-conditions-wrapper{ font-size:.8rem; color:var(--grau); margin:0 0 12px }
.bv-shop .woocommerce-terms-and-conditions-wrapper a{ color:var(--akzent) }
.bv-shop .woocommerce-form__label-for-checkbox{ display:flex; gap:.6em; align-items:flex-start; font-size:.85rem; color:var(--tinte) }
.bv-shop #place_order{ width:100%; min-height:60px; font-size:1.05rem }

/* Hinweise */
.bv-shop .woocommerce-notices-wrapper:empty{ display:none }
.bv-shop .woocommerce-message, .bv-shop .woocommerce-info, .bv-shop .woocommerce-error, .bv-shop .cart-empty{
  list-style:none; margin:0 0 var(--sh-gasse); padding:16px 20px; border-radius:var(--sh-r-s); background:var(--hell);
  border-left:4px solid var(--akzent); display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; justify-content:space-between; font-weight:600; font-size:.92rem }
.bv-shop .woocommerce-error{ background:#FDECEA; border-left-color:#C0392B; flex-direction:column; align-items:flex-start }
.bv-shop .woocommerce-message .button, .bv-shop .woocommerce-info .button{ min-height:38px; padding:.5em 1.1em; font-size:.85rem; order:2 }
.bv-shop .return-to-shop{ margin:0 }

/* Konto */
.bv-shop .woocommerce-MyAccount-navigation ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px }
.bv-shop .woocommerce-MyAccount-navigation a{ display:inline-flex; padding:.5em 1em; border-radius:99px; background:var(--hell); text-decoration:none; font-weight:800; font-size:.86rem }
.bv-shop .woocommerce-MyAccount-navigation .is-active a{ background:var(--akzent); color:#fff }
.bv-shop .woocommerce-MyAccount-content, .bv-shop form.woocommerce-form-login, .bv-shop form.woocommerce-form-register, .bv-shop .woocommerce-ResetPassword{
  background:#fff; border:1px solid var(--rand); border-radius:var(--sh-r); box-shadow:var(--sh-schatten); padding:clamp(18px,2.2vw,32px); max-width:640px }
.bv-shop .u-columns{ display:grid; gap:var(--sh-gasse); grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)) }

/* Bestätigung */
.bv-shop .woocommerce-order-overview{ list-style:none; padding:0; margin:0 0 var(--sh-gasse); display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)) }
.bv-shop .woocommerce-order-overview li{ padding:14px 16px; border-radius:var(--sh-r-s); background:var(--hell); font-size:.8rem; color:var(--grau) }
.bv-shop .woocommerce-order-overview li strong{ display:block; font-size:1rem; color:var(--tinte); margin-top:2px }
.bv-shop .woocommerce-thankyou-order-received{ font-family:inherit; font-weight:900; letter-spacing:-.02em; font-size:clamp(1.6rem,1.2rem + 1.4vw,2.4rem); line-height:1.1; color:var(--akzent) }
.bv-shop .woocommerce-customer-details address{ font-style:normal; background:#fff; border:1px solid var(--rand); border-radius:var(--sh-r-s); padding:16px }

/* ── Bewegung ──────────────────────────────────────────────────────────── */
@keyframes sh-auf{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }
@keyframes sh-schweben{ 0%,100%{ transform:translateY(0) rotate(-.6deg) } 50%{ transform:translateY(-8px) rotate(.6deg) } }
@keyframes sh-hupf{ 0%{ transform:scale(1) } 40%{ transform:scale(1.18) } 100%{ transform:scale(1) } }
.sh-auftakt{ animation:sh-auf .8s var(--weich) both }
.sh-intro.sh-auftakt{ animation-delay:.05s }
.sh-schau.sh-auftakt{ animation-delay:.15s }
.sh-fakt.sh-auftakt{ animation-delay:calc(var(--n,1) * .08s + .1s) }
.sh-sehstaerke.sh-auftakt{ animation-delay:.55s }
.bv-shop ul.products .sh-karte{ animation:sh-auf .7s var(--weich) both }
.bv-shop ul.products .sh-karte:nth-child(-n+12){ animation-delay:calc(var(--i, 1) * 40ms) }
.sh-karte.sh-neu{ animation:sh-auf .5s var(--weich) both; animation-delay:calc(var(--i, 1) * 30ms) }
@media (prefers-reduced-motion: reduce){
  .sh-auftakt, .sh-karte, .sh-karte.sh-neu, .sh-schau-bild img{ animation:none }
  .sh-karte, .sh-schau-bild{ transition:none }
}

/* ── Breiten ───────────────────────────────────────────────────────────── */
@media (max-width:1100px){
  .sh-buehne{ grid-template-columns:repeat(6,minmax(0,1fr)) }
  .sh-intro{ grid-column:1 / -1; grid-row:auto; min-height:300px }
  .sh-schau{ grid-column:1 / -1; grid-row:auto; min-height:320px }
  .sh-fakt{ grid-column:span 3 }
  .sh-sehstaerke{ grid-column:1 / -1 }
  .sh-galerie, .sh-kauf, .sh-beschreibung, .sh-produkt-unten .sh-sehstaerke{ grid-column:1 / -1; position:static }
  .sh-seiteninhalt > .woocommerce, .woocommerce-checkout .sh-seiteninhalt form.checkout{ grid-template-columns:minmax(0,1fr) }
  .woocommerce-cart .sh-seiteninhalt .cart-collaterals, .bv-shop form.checkout #order_review{ grid-column:1; position:static }
  .bv-shop form.checkout #customer_details, .bv-shop form.checkout #order_review_heading, .bv-shop form.checkout #order_review{ grid-column:1; grid-row:auto }
}
@media (max-width:760px){
  .sh-filter-innen{ border-radius:18px; flex-wrap:wrap }
  .sh-chips{ flex-basis:100% }
  .sh-filter-rechts{ width:100%; justify-content:space-between }
}
@media (max-width:640px){
  .bv-shop{ padding-inline:10px }
  .sh-fakt{ grid-column:span 3; min-height:110px }
  .sh-chips{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; max-width:100%; padding-bottom:2px }
  .sh-chips::-webkit-scrollbar{ display:none }
  .sh-chip{ white-space:nowrap }
  .sh-filter-rechts{ width:100%; justify-content:space-between }
  .bv-shop ul.products{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px }
  .sh-karte-text{ padding:12px }
  .sh-titel{ font-size:.86rem }
  .bv-shop .sh-karte .price{ font-size:1.4rem }
  .sh-zusagen{ grid-template-columns:1fr }
  .bv-shop .woocommerce-billing-fields__field-wrapper, .bv-shop .woocommerce-shipping-fields__field-wrapper{ grid-template-columns:1fr }
  .bv-shop .form-row-first, .bv-shop .form-row-last{ grid-column:1 }
  /* Warenkorb-Tabelle wird zu Karten */
  .bv-shop table.cart thead{ display:none }
  .bv-shop table.cart tr.cart_item{ display:grid; grid-template-columns:72px 1fr auto; gap:4px 12px; padding:12px; border-bottom:1px solid var(--rand) }
  .bv-shop table.cart tr.cart_item td{ border:0; padding:0 }
  .bv-shop table.cart td.product-thumbnail{ grid-row:1 / span 3 }
  .bv-shop table.cart td.product-remove{ grid-column:3; grid-row:1 }
  .bv-shop table.cart td.product-name{ grid-column:2; grid-row:1 }
  .bv-shop table.cart td.product-price{ display:none }
  .bv-shop table.cart td.product-quantity{ grid-column:2 }
  .bv-shop table.cart td.product-subtotal{ grid-column:2; font-weight:800 }
  .bv-shop table.cart tr:not(.cart_item){ display:block }
  .bv-shop table.cart td.actions{ display:block }
}
@media (max-width:340px){
  .bv-shop ul.products{ grid-template-columns:minmax(0,1fr) }
  .sh-fakt{ grid-column:1 / -1 }
}