/* Dezente Effekte – nur aktiv, wenn html.bi-fx gesetzt ist (JS) und keine reduzierte Bewegung gewünscht ist */
html.bi-fx .bi-reveal { opacity: 0; transform: translateY(14px); transition: opacity .55s ease, transform .55s cubic-bezier(.2,.7,.2,1); transition-delay: var(--bi-d, 0ms); }
html.bi-fx .bi-reveal.bi-in { opacity: 1; transform: none; }
/* Lichtstreifen auf Hauptknöpfen */
html.bi-fx .my_catalog_add_item, html.bi-fx .details-btn, html.bi-fx .bi-vc-teaser__btn, html.bi-fx .faq-help__btn--primary, html.bi-fx .bi-call-modal__btn--primary { position: relative; overflow: hidden; }
html.bi-fx .my_catalog_add_item::after, html.bi-fx .details-btn::after, html.bi-fx .bi-vc-teaser__btn::after, html.bi-fx .faq-help__btn--primary::after, html.bi-fx .bi-call-modal__btn--primary::after {
  content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.38), transparent); transform: skewX(-18deg); transition: left .6s ease; }
html.bi-fx .my_catalog_add_item:hover::after, html.bi-fx .details-btn:hover::after, html.bi-fx .bi-vc-teaser__btn:hover::after, html.bi-fx .faq-help__btn--primary:hover::after, html.bi-fx .bi-call-modal__btn--primary:hover::after { left: 130%; }
/* Karten-Tilt */
html.bi-fx .product-card__shell.bi-tilt { transition: transform .18s ease-out, box-shadow .18s ease-out; will-change: transform; }
html.bi-fx .product-card__shell.bi-tilt.bi-tilting { box-shadow: 0 18px 38px rgba(43,38,33,.16); }
/* FAQ sanft auf-/zuklappen */
html.bi-fx .faq-list .box.active .faq-answer { animation: biFaqIn .28s ease both; }
@keyframes biFaqIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
/* Scroll-Fortschritt */
#biProgress { position: fixed; left: 0; top: 0; height: 3px; width: 100%; z-index: 2147482000; background: linear-gradient(90deg, #c2461a, #e0742b, #ffb27a); transform-origin: 0 50%; transform: scaleX(0); pointer-events: none; }
html.bi-fx #menu-wrapper.bi-scrolled, html.bi-fx #header.bi-scrolled { box-shadow: 0 10px 30px -18px rgba(43,38,33,.45); }
/* Seitliche Abschnitts-Punkte */
#biDots { position: fixed; right: 18px; top: 50%; transform: translateY(-50%); z-index: 55; display: flex; flex-direction: column; align-items: flex-end; gap: 0; padding: 6px 0; max-height: 80vh; font-family: "Segoe UI", Arial, sans-serif; }
#biDots a { position: relative; display: flex; align-items: center; justify-content: center; width: 26px; height: 22px; text-decoration: none; }
#biDots a::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: rgba(120,100,85,.45); border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.25); transition: transform .2s, background .2s; box-sizing: border-box; }
#biDots a span { position: absolute; right: 30px; top: 50%; transform: translateY(-50%) translateX(6px); white-space: nowrap; font-size: 12px; font-weight: 600; line-height: 1; color: #2b2621; background: #fff; border: 1px solid #e8e2db; border-radius: 999px; padding: 7px 12px; box-shadow: 0 6px 18px rgba(43,38,33,.14); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
#biDots a:hover span, #biDots a:focus-visible span { opacity: 1; transform: translateY(-50%); }
#biDots a.act::before { background: #e0742b; transform: scale(1.4); }
#biDots a:hover::before { background: #c2461a; }
@media (max-width: 1179px) { #biDots { display: none; } }
/* Wortweise Überschriften */
html.bi-fx h2.bi-split .bi-w { display: inline-block; opacity: 0; transform: translateY(.5em); transition: opacity .5s ease, transform .5s cubic-bezier(.2,.7,.2,1); transition-delay: var(--bi-wd, 0ms); }
html.bi-fx h2.bi-split.bi-go .bi-w { opacity: 1; transform: none; }
/* Klick-Welle */
.bi-rip { position: absolute; border-radius: 50%; background: rgba(255,255,255,.45); transform: scale(0); animation: biRip .6s ease-out forwards; pointer-events: none; }
@keyframes biRip { to { transform: scale(3); opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  #biProgress { display: none; }
  html.bi-fx h2.bi-split .bi-w { opacity: 1 !important; transform: none !important; transition: none !important; }
  .bi-rip { display: none; }

  html.bi-fx .bi-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  html.bi-fx .faq-list .box.active .faq-answer { animation: none; }
}

/* ===== Stufe 2 (nach Habermann-Vorbild) ===== */
/* Menü: Streifen unter Hauptpunkten, Glas-Header beim Scrollen */
html.bi-fx .slimmenu > li > a { position: relative; }
html.bi-fx .slimmenu > li > a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #e0742b, #ffb27a); transform: scaleX(0); transform-origin: 0 50%; transition: transform .3s cubic-bezier(.2,.7,.2,1); pointer-events: none; }
html.bi-fx .slimmenu > li > a:hover::after, html.bi-fx .slimmenu > li > a:focus-visible::after, html.bi-fx .slimmenu > li:hover > a::after { transform: scaleX(1); }
@media (min-width: 901px) {
  html.bi-fx #menu-wrapper.bi-scrolled { -webkit-backdrop-filter: saturate(1.5) blur(14px); backdrop-filter: saturate(1.5) blur(14px); }
}
/* Hero: sanfter Ken-Burns + Maus-Parallaxe + warmer Lichtschein */
html.bi-fx #topimg { position: relative; overflow: hidden; }
html.bi-fx #topimg .i1, html.bi-fx #topimg .i1i { translate: var(--hx, 0) var(--hy, 0); transition: translate .6s cubic-bezier(.2,.7,.2,1); }
html.bi-fx #topimg::before { content: ""; position: absolute; inset: -20% -10% 20% 30%; z-index: 0; pointer-events: none; opacity: .75;
  background: radial-gradient(34% 30% at 62% 28%, rgba(255,160,90,.30), transparent 70%), radial-gradient(26% 24% at 86% 46%, rgba(255,214,170,.22), transparent 70%), radial-gradient(24% 20% at 44% 10%, rgba(224,116,43,.20), transparent 70%);
  animation: biAurora 16s ease-in-out infinite alternate; }
@keyframes biAurora { 0% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(-4%,3%,0) scale(1.08); } 100% { transform: translate3d(3%,-2%,0) scale(1.02); } }
html.bi-fx #topimg > * { position: relative; z-index: 1; }
html.bi-fx #topimg h1 { animation: biHeroIn 1s cubic-bezier(.2,.75,.15,1) both; }
@keyframes biHeroIn { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
/* Lichtschein, der der Maus folgt (Karten) */
html.bi-fx .product-card__shell { position: relative; }
html.bi-fx .bi-glow { position: absolute; inset: 0; z-index: 3; pointer-events: none; border-radius: inherit; opacity: 0; transition: opacity .3s; background: radial-gradient(240px circle at var(--mx, 50%) var(--my, 50%), rgba(255,170,100,.20), transparent 62%); }
html.bi-fx .product-card__shell:hover > .bi-glow, html.bi-fx .faq-help:hover > .bi-glow, html.bi-fx .bi-vc-teaser:hover > .bi-glow { opacity: 1; }
/* Bild-Wischblende bei Karten */
html.bi-fx .bi-reveal .product-card__media-zone img, html.bi-fx .bi-reveal .product-card__media-zone picture { clip-path: inset(0 0 100% 0); transition: clip-path 1s cubic-bezier(.7,0,.2,1) .12s; }
html.bi-fx .bi-reveal.bi-in .product-card__media-zone img, html.bi-fx .bi-reveal.bi-in .product-card__media-zone picture { clip-path: inset(0 0 0 0); }
/* Lichtkegel auf dunklen Flächen (Footer) */
html.bi-fx #footer { position: relative; overflow: hidden; }
html.bi-fx #footer::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .4s; background: radial-gradient(420px circle at var(--sx, 50%) var(--sy, 50%), rgba(255,170,100,.14), transparent 65%); }
html.bi-fx #footer:hover::after { opacity: 1; }
/* Magnet-Knöpfe */
html.bi-fx .bi-mag { translate: var(--bx, 0) var(--by, 0); transition: translate .25s cubic-bezier(.2,.7,.2,1); }
/* Dock/Hauptknöpfe: weicher Atem-Puls auf dem Telefon-Knopf im Header */
html.bi-fx .catalog-hero-cta__primary::after { content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; pointer-events: none; background: linear-gradient(100deg, transparent, rgba(255,255,255,.4), transparent); transform: skewX(-18deg); transition: left .7s cubic-bezier(.2,.7,.2,1); }
html.bi-fx .catalog-hero-cta__primary { position: relative; overflow: hidden; }
html.bi-fx .catalog-hero-cta__primary:hover::after { left: 130%; }
@media (max-width: 960px) { html.bi-fx #footer::after, html.bi-fx #topimg::before { display: none; } }
@media (prefers-reduced-motion: reduce) {
  html.bi-fx #topimg::before, html.bi-fx #topimg h1 { animation: none; }
  html.bi-fx .bi-reveal .product-card__media-zone img, html.bi-fx .bi-reveal .product-card__media-zone picture { clip-path: none !important; }
}

/* Entwickler-Hinweis im Footer: eigene, zentrierte Zeile (Legacy-Footer-Regeln überschreiben) */
html body #footer .copyr > p.bi-credit { grid-column: 1 / -1 !important; grid-row: auto !important; justify-self: center !important; width: auto !important; max-width: none !important; margin: 6px 0 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: center !important; }
html body #footer .copyr > p.bi-credit .bi-credit-btn { display: inline-block; color: #f5f1ed; font-size: 12.5px; opacity: .8; }
html body #footer .copyr > p:nth-of-type(3) { grid-column: 1 / -1 !important; max-width: 1140px !important; padding-top: 12px !important; border-top: 1px solid rgba(255,255,255,.22) !important; }

/* === Einheitliche Hauptleiste auf allen Seiten (wie Katalog) === */
@media (min-width: 801px) {
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper,
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu,
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu {
    background: #20282d !important;
    box-shadow: none !important;
  }
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu {
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
  }
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li {
    background: transparent !important;
    border-color: rgba(255,255,255,.08) !important;
  }
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li > a,
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li > button {
    color: #fff !important;
    background: transparent !important;
    border-radius: 0 !important;
    font-weight: 800 !important;
  }
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li > a i,
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li > button i {
    color: #fff !important;
  }
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li:hover > a,
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li:focus-within > a {
    background: rgba(255,255,255,.08) !important;
  }
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li:nth-child(2) > a {
    box-shadow: inset 0 -3px 0 #c84b13 !important;
  }
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li > a,
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li > button {
    border: 0 !important;
    outline-offset: -3px;
  }
  html body.bi-modern-ui:not(.is-catalog-page) #menu-wrapper #menu > ul.slimmenu > li:first-child > a {
    box-shadow: none !important;
  }
}

/* Mindestbestellmenge: Zahl steht hinter dem Text (altes strong{order:-1} aufgehoben) */
html body .item_qty_block .product-order-parameters strong { order: 0 !important; margin-right: 0 !important; margin-left: -2px; }
html body .item_qty_block .product-order-parameters { gap: 4px 8px !important; }