/* Pepswerk Home 2.25.1 - Taste-Refresh (Basis 2.20).
   Identität bleibt: violetter Akzent, Karo-Raster, PW Serif, Ticker. Video und Raster-Kopplung unverändert.
   Formsystem: Buttons asymmetrisch (14/5/14/5), Karten 22px, Bildfläche 16px, Chips als Pille. */
.pwh.pwh-home-v2171{
 --pw-ink:#17131c;--pw-muted:#6f6578;--pw-line:#e7ddf0;--pw-violet:#6a1fb4;--pw-violet-deep:#4e1688;
 --pw-ease:cubic-bezier(.16,1,.3,1);--pw-btn-r:14px 5px 14px 5px;
}

/* ---------- Buttons: eine Form für alle ---------- */
.pwh.pwh-home-v2171 .pwh-btn:active{transform:translateY(1px) scale(.985)}

/* ---------- Sortiment: Kopf ---------- */
.pwh.pwh-home-v2171 .pwh-range .pwh-section-head{margin-bottom:26px}
.pwh.pwh-home-v2171 .pwh-p-grid{gap:20px!important;align-items:stretch}

/* ---------- Produktkarte ---------- */
.pwh.pwh-home-v2171 .pwh-p-card{
 padding:10px!important;border-radius:22px!important;border:1px solid var(--pw-line)!important;
 background:linear-gradient(180deg,#fff 0%,#fff 62%,#fcfaff 100%)!important;
 box-shadow:0 1px 0 #fff inset,0 1px 2px #3c1a5a0d,0 12px 32px -14px #4a1f6e2e!important;
 transition:transform .45s var(--pw-ease),box-shadow .45s var(--pw-ease),border-color .45s var(--pw-ease)!important;
}
/* Kopfzeile: Kategorie links, Lagerstatus rechts */
.pwh.pwh-home-v2171 .pwh-p-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:28px;padding:4px 6px 10px 4px}
.pwh.pwh-home-v2171 .pwh-p-category{
 margin:0!important;min-height:0;padding:5px 10px 5px!important;border:0!important;border-radius:999px!important;
 background:var(--tint)!important;color:var(--tone)!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rim) 45%,transparent);
 font-size:10.5px!important;font-weight:750!important;letter-spacing:.09em!important;line-height:1.2!important;white-space:nowrap;
}
.pwh.pwh-home-v2171 .pwh-p-category:before{content:none!important;display:none!important}
.pwh.pwh-home-v2171 .pwh-p-category--empty{background:none!important;box-shadow:none;padding:0!important}
.pwh.pwh-home-v2171 .pwh-p-top .pwh-stock{margin:0!important;font-size:12px!important;font-weight:600;letter-spacing:.01em;gap:6px!important}
.pwh.pwh-home-v2171 .pwh-p-top .pwh-stock:before{width:6px;height:6px}

/* Bildfläche mit Kategorie-Tönung */
.pwh.pwh-home-v2171 .pwh-p-media{
 margin:0!important;border-radius:16px!important;aspect-ratio:1.12/1!important;
 background:
  radial-gradient(70% 58% at 50% 58%,color-mix(in srgb,var(--tint) 92%,#fff) 0%,transparent 72%),
  linear-gradient(180deg,#fdfcff,color-mix(in srgb,var(--tint) 55%,#fff))!important;
 box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rim) 16%,transparent),inset 0 -24px 40px -28px color-mix(in srgb,var(--tone) 22%,transparent);
}
.pwh.pwh-home-v2171 .pwh-p-media img.pwh-p-img{inset:6% 6% 6%!important;width:88%!important;height:88%!important;transition:transform .6s var(--pw-ease)!important}

/* Info */
.pwh.pwh-home-v2171 .pwh-p-info{padding:14px 6px 4px!important}
.pwh.pwh-home-v2171 .pwh-p-name{font-size:clamp(19px,1.5vw,22px)!important;font-weight:750!important;letter-spacing:-.03em;line-height:1.18!important;margin:0 0 6px!important}
.pwh.pwh-home-v2171 .pwh-p-name a{color:var(--pw-ink)!important;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .4s var(--pw-ease)}
.pwh.pwh-home-v2171 .pwh-p-name a:hover{background-size:100% 1px}
.pwh.pwh-home-v2171 .pwh-p-spec{font-size:12.5px!important;color:var(--pw-muted)!important;font-variant-numeric:tabular-nums;letter-spacing:.01em;margin:0 0 14px!important}
.pwh.pwh-home-v2171 .pwh-p-spec>span:first-child{color:#4b3f57;font-weight:650}
.pwh.pwh-home-v2171 .pwh-p-divider{height:10px!important;background:#d6c8e2!important}
.pwh.pwh-home-v2171 .pwh-p-buyline{margin:auto 0 12px!important;padding-top:12px!important;border-top:1px dashed #e2d6ec}
.pwh.pwh-home-v2171 .pwh-p-price{font-size:21px!important;font-weight:750!important;letter-spacing:-.02em;color:var(--pw-ink);font-variant-numeric:tabular-nums}
.pwh.pwh-home-v2171 .pwh-p-price del{font-size:.72em;font-weight:500;color:#958b9d;margin-right:6px}

/* Warenkorb-Button */
.pwh.pwh-home-v2171 .pwh-atc{
 margin-top:0!important;min-height:46px;border-radius:var(--pw-btn-r)!important;border:1px solid #2a2230!important;
 background:var(--pw-ink)!important;box-shadow:inset 0 1px 0 #ffffff1f,0 6px 16px -8px #17131c80!important;
 font:700 12.5px/1.3 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;letter-spacing:.06em!important;text-transform:uppercase;
 position:relative;isolation:isolate;overflow:hidden;transition:transform .3s var(--pw-ease),border-color .3s var(--pw-ease),box-shadow .3s var(--pw-ease)!important;
}
.pwh.pwh-home-v2171 .pwh-atc:before{
 content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
 background:linear-gradient(115deg,var(--pw-violet-deep),#7d2fc6 55%,var(--pw-violet-deep));
 transform:translateY(101%);transition:transform .45s var(--pw-ease);
}
.pwh.pwh-home-v2171 .pwh-atc__idle>span[aria-hidden]{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#ffffff1f;font-size:14px;line-height:1;transition:transform .45s var(--pw-ease)}
.pwh.pwh-home-v2171 .pwh-atc:active{transform:scale(.98)!important}
.pwh.pwh-home-v2171 .pwh-atc:focus-visible{outline:2px solid var(--pw-violet);outline-offset:3px}
.pwh.pwh-home-v2171 .pwh-atc.is-done{background:#1f5a39!important;border-color:#2f7a50!important}
.pwh.pwh-home-v2171 .pwh-atc.is-done:before{content:none}
.pwh.pwh-home-v2171 .pwh-atc.is-disabled{background:#f1edf4!important;border-color:#ddd3e4!important;color:#756b7d!important;box-shadow:none!important}
.pwh.pwh-home-v2171 .pwh-atc.is-disabled:before{content:none}

@media(hover:hover) and (pointer:fine){
 .pwh.pwh-home-v2171 .pwh-p-card:hover,.pwh.pwh-home-v2171 .pwh-p-card:focus-within{
  transform:translateY(-4px)!important;border-color:color-mix(in srgb,var(--rim) 45%,var(--pw-line))!important;
  box-shadow:0 1px 0 #fff inset,0 2px 4px #3c1a5a0f,0 26px 46px -20px #4a1f6e47!important;
 }
 .pwh.pwh-home-v2171 .pwh-p-card:hover .pwh-p-media img.pwh-p-img{transform:translateY(-4px) scale(1.04)!important}
 .pwh.pwh-home-v2171 .pwh-atc:hover{border-color:#5a2394!important;box-shadow:inset 0 1px 0 #ffffff26,0 10px 22px -10px #6a1fb48c!important}
 .pwh.pwh-home-v2171 .pwh-atc:hover:before{transform:translateY(0)}
 .pwh.pwh-home-v2171 .pwh-atc:hover .pwh-atc__idle>span[aria-hidden]{transform:rotate(90deg)}
}

/* ---------- Handy: Slider ohne Punkte ---------- */
.pwh.pwh-home-v2171 .pwh-dots{display:none!important}
@media(max-width:700px){
 .pwh.pwh-home-v2171 .pwh-range .pwh-section-head{margin-bottom:16px}
 .pwh.pwh-home-v2171 .pwh-p-grid{gap:12px!important;padding:6px 14px 22px!important;scroll-padding-left:14px}
 .pwh.pwh-home-v2171 .pwh-p-grid:after{content:"";flex:0 0 2px}
 .pwh.pwh-home-v2171 .pwh-p-card{flex:0 0 80%!important;padding:9px!important;border-radius:20px!important;box-shadow:0 1px 0 #fff inset,0 10px 26px -14px #4a1f6e33!important}
 .pwh.pwh-home-v2171 .pwh-p-card.is-current{border-color:color-mix(in srgb,var(--rim) 40%,var(--pw-line))!important}
 .pwh.pwh-home-v2171 .pwh-p-card.is-current .pwh-p-media img.pwh-p-img{transform:none!important}
 .pwh.pwh-home-v2171 .pwh-p-top{padding:3px 4px 9px 3px}
 .pwh.pwh-home-v2171 .pwh-p-media{aspect-ratio:1.15/1!important;border-radius:14px!important;margin:0!important}
 .pwh.pwh-home-v2171 .pwh-p-info{padding:12px 5px 3px!important}
 .pwh.pwh-home-v2171 .pwh-p-name{font-size:20px!important}
 .pwh.pwh-home-v2171 .pwh-p-spec{margin-bottom:12px!important}
 .pwh.pwh-home-v2171 .pwh-p-buyline{margin-bottom:10px!important;padding-top:10px!important}
 .pwh.pwh-home-v2171 .pwh-p-price{font-size:19px!important}
}
@media(max-width:360px){
 .pwh.pwh-home-v2171 .pwh-p-card{flex-basis:84%!important}
 .pwh.pwh-home-v2171 .pwh-p-category{font-size:9.5px!important;padding:4px 8px!important;letter-spacing:.07em!important}
 .pwh.pwh-home-v2171 .pwh-p-top .pwh-stock{font-size:11px!important}
}

/* Ohne color-mix: einfache Ersatzwerte */
@supports not (background:color-mix(in srgb,red,blue)){
 .pwh.pwh-home-v2171 .pwh-p-media{background:radial-gradient(70% 58% at 50% 58%,var(--tint),#fdfcff 72%)!important;box-shadow:inset 0 0 0 1px #00000008}
 .pwh.pwh-home-v2171 .pwh-p-category{box-shadow:none}
}

@media(prefers-reduced-motion:reduce){
 .pwh.pwh-home-v2171 .pwh-p-card,.pwh.pwh-home-v2171 .pwh-p-media img.pwh-p-img,.pwh.pwh-home-v2171 .pwh-atc,
 .pwh.pwh-home-v2171 .pwh-atc:before,.pwh.pwh-home-v2171 .pwh-p-name a{transition:none!important}
 .pwh.pwh-home-v2171 .pwh-p-card:hover,.pwh.pwh-home-v2171 .pwh-p-card:hover .pwh-p-media img.pwh-p-img{transform:none!important}
}

/* Shop entdecken: Design aus 2.20 (violette Lichtflächen), asymmetrische Ecken */
.pwh.pwh-home-v2171 .pwh-btn-purple{border-radius:var(--pw-btn-r)!important}

/* =========================================================
   2.21 Hero: weiche Einblendung beim Laden (nur Text, Video unverändert)
   ========================================================= */
@keyframes pwRise{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
.pwh.pwh-home-v2171 .pwh-top h1{animation:pwRise .9s var(--pw-ease) both}
.pwh.pwh-home-v2171 .pwh-tagline{animation:pwRise .9s var(--pw-ease) .18s both}
.pwh.pwh-home-v2171 .pwh-description{animation:pwRise .9s var(--pw-ease) .28s both}
.pwh.pwh-home-v2171 .pwh-actions{animation:pwRise .9s var(--pw-ease) .38s both}

/* Video: nie Bedienelemente oder Play-Symbol zeigen, Antippen stört die Wiedergabe nicht */
.pwh .pwh-video{pointer-events:none;-webkit-user-select:none;user-select:none}
.pwh .pwh-video::-webkit-media-controls,
.pwh .pwh-video::-webkit-media-controls-panel,
.pwh .pwh-video::-webkit-media-controls-overlay-play-button,
.pwh .pwh-video::-webkit-media-controls-start-playback-button,
.pwh .pwh-video::-webkit-media-controls-play-button{display:none!important;-webkit-appearance:none!important;opacity:0!important}
.pwh .pwh-video-wrap .pwh-video{max-width:none!important;max-height:none!important;min-width:0!important;min-height:0!important;aspect-ratio:auto!important;flex:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important}

/* 2.24: Standbild unter dem Video, exakt gleiche Größe und Position wie das Video.
   Ein Hintergrund (kein <img>) kann von Theme-Regeln nicht gestaucht werden. */
.pwh .pwh-video-wrap{position:relative}
.pwh .pwh-video-still{
 position:absolute;left:50%;top:0;z-index:0;pointer-events:none;
 width:calc(var(--pwh-cols) * var(--pwh-c));height:calc(var(--pwh-rows) * var(--pwh-c));
 margin-top:calc(-1 * var(--pwh-shift));transform:translateX(-50%);
 background-position:center;background-repeat:no-repeat;background-size:100% 100%;
}
.pwh .pwh-video-wrap .pwh-video{position:relative;z-index:1}
.pwh .pwh-video-wrap--still .pwh-video{display:none!important}

/* 2.24: Qualitätsbild (fliegende Fläschchen) schwebt sanft */
.pwh.pwh-home-v2171 .pwh-stats-media img{animation:pwhVialFloat 6.5s ease-in-out infinite;filter:drop-shadow(0 22px 28px #4a1f6e26);will-change:transform}
@media(min-width:701px){.pwh.pwh-home-v2171 .pwh-stats-media{padding:24px 24px 12px 0;box-sizing:border-box}.pwh.pwh-home-v2171 .pwh-stats-media img{translate:0 56px}.pwh.pwh-home-v2171 .pwh-stats{padding-bottom:64px!important}.pwh.pwh-home-v2171 .pwh-stats-media img{max-height:440px}}
@keyframes pwhVialFloat{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-10px) rotate(-.6deg)}}
@media(prefers-reduced-motion:reduce){.pwh.pwh-home-v2171 .pwh-stats-media img{animation:none}}

/* =========================================================
   2.21 Scroll-Einblendung und Kennzahlen (Klasse setzt das Skript)
   ========================================================= */
.pwh.pw-reveal-ready [data-pw-reveal]{
 opacity:0;translate:0 26px;
 transition:opacity .9s var(--pw-ease),translate .9s var(--pw-ease),transform .5s var(--pw-ease),border-color .5s,box-shadow .5s,background .35s!important;
 transition-delay:calc(var(--d,0) * 90ms),calc(var(--d,0) * 90ms),0s,0s,0s,0s!important;
}
.pwh.pw-reveal-ready [data-pw-reveal].is-visible{opacity:1;translate:0 0}
.pwh.pwh-home-v2171 .pwh-stat__n{font-variant-numeric:tabular-nums}
.pwh.pwh-home-v2171 .pwh-stats-nums{border-top-color:#d9c7ea}
.pwh.pwh-home-v2171 .pwh-stat{position:relative}

@media(prefers-reduced-motion:reduce){
 .pwh.pwh-home-v2171 .pwh-top h1,.pwh.pwh-home-v2171 .pwh-tagline,.pwh.pwh-home-v2171 .pwh-description,.pwh.pwh-home-v2171 .pwh-actions{animation:none}
 .pwh.pw-reveal-ready [data-pw-reveal]{opacity:1;translate:none}
}


/* =========================================================
   2.25 Alle Produkte ansehen: Produkt-Stapel, Verlaufsrahmen, Pfeil-Chip
   ========================================================= */
.pwh.pwh-home-v2171 .pwh-range-action{margin-top:28px;text-align:center}
.pwh.pwh-home-v2171 .pwh-catalog{
 position:relative;isolation:isolate;overflow:hidden;
 display:inline-flex;align-items:center;gap:14px;min-height:64px;padding:10px 10px 10px 12px;
 border:1.5px solid transparent;border-radius:18px 6px 18px 6px;
 background:linear-gradient(180deg,#fff,#fbf7ff) padding-box,linear-gradient(120deg,#d9bdf3,#7d2fc6 45%,#b16bff 70%,#e7d6f8) border-box;
 color:var(--pw-ink)!important;text-decoration:none!important;text-align:left;
 box-shadow:0 1px 0 #fff inset,0 14px 32px -16px #6a1fb466;
 transition:transform .45s var(--pw-ease),box-shadow .45s var(--pw-ease);
}
.pwh.pwh-home-v2171 .pwh-catalog:after{
 content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:linear-gradient(115deg,transparent 30%,#b16bff14 42%,#ffffffb3 50%,#b16bff14 58%,transparent 70%);
 transform:translateX(-110%);transition:transform .9s var(--pw-ease);
}
.pwh.pwh-home-v2171 .pwh-catalog__stack{display:inline-flex;align-items:center;flex:none;padding-left:2px}
.pwh.pwh-home-v2171 .pwh-catalog__thumb{
 display:grid;place-items:center;width:40px;height:40px;margin-left:-12px;border-radius:50%;overflow:hidden;
 background:#f3ecfa;box-shadow:0 0 0 2px #fff,0 4px 10px -4px #4a1f6e59;
 transform:translateX(calc(var(--k,0) * -2px));transition:transform .5s var(--pw-ease);
}
.pwh.pwh-home-v2171 .pwh-catalog__thumb:first-child{margin-left:0}
.pwh.pwh-home-v2171 .pwh-catalog__thumb img{display:block;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;margin:0;border:0;border-radius:0;box-shadow:none}
.pwh.pwh-home-v2171 .pwh-catalog__text{display:flex;flex-direction:column;gap:2px;min-width:0;padding-right:6px}
.pwh.pwh-home-v2171 .pwh-catalog__label{font-size:16px;font-weight:750;line-height:1.2;letter-spacing:-.015em;white-space:nowrap}
.pwh.pwh-home-v2171 .pwh-catalog__meta{font-size:12.5px;font-weight:550;line-height:1.2;color:var(--pw-muted)}
.pwh.pwh-home-v2171 .pwh-catalog__arrow{
 display:inline-grid;place-items:center;flex:none;width:44px;height:44px;margin-left:auto;border-radius:13px 5px 13px 5px;
 background:linear-gradient(140deg,#7d2fc6,#4e1688);color:#fff;font-size:19px;line-height:1;
 box-shadow:inset 0 1px 0 #ffffff33,0 6px 14px -6px #4e1688b3;transition:transform .45s var(--pw-ease)
}
.pwh.pwh-home-v2171 .pwh-catalog:focus-visible{outline:3px solid #b16bff;outline-offset:4px}
.pwh.pwh-home-v2171 .pwh-catalog:active{transform:scale(.985)}
@media(hover:hover) and (pointer:fine){
 .pwh.pwh-home-v2171 .pwh-catalog:hover{transform:translateY(-2px);box-shadow:0 1px 0 #fff inset,0 20px 40px -18px #6a1fb48c}
 .pwh.pwh-home-v2171 .pwh-catalog:hover:after{transform:translateX(110%)}
 .pwh.pwh-home-v2171 .pwh-catalog:hover .pwh-catalog__thumb{transform:translateX(calc(var(--k,0) * 4px))}
 .pwh.pwh-home-v2171 .pwh-catalog:hover .pwh-catalog__arrow{transform:translateX(3px)}
}
@media(max-width:700px){
 .pwh.pwh-home-v2171 .pwh-range-action{margin-top:18px}
 .pwh.pwh-home-v2171 .pwh-catalog{display:flex;width:100%;max-width:420px;margin:0 auto;min-height:62px}
 .pwh.pwh-home-v2171 .pwh-catalog__thumb{width:36px;height:36px;margin-left:-11px}
 .pwh.pwh-home-v2171 .pwh-catalog__label{font-size:15.5px}
}

/* =========================================================
   2.25 Holografischer Glanz über den Produktbildern (wie Produktseite), einmal beim Einblenden
   ========================================================= */
.pwh.pwh-home-v2171 .pwh-p-card .pwh-p-media::after{
 content:""!important;display:block!important;position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;
 background:linear-gradient(115deg,transparent 30%,#b16bff10 42%,#ffffff8c 50%,#b16bff10 58%,transparent 70%);
 transform:translateX(-110%);
}
.pwh.pwh-home-v2171 .pwh-p-card.is-in .pwh-p-media::after{animation:pwhHolo 1.5s var(--pw-ease) calc(.35s + var(--i,0) * 110ms) forwards}
@keyframes pwhHolo{to{transform:translateX(110%)}}
@media(hover:hover) and (pointer:fine){
 .pwh.pwh-home-v2171 .pwh-p-card:hover .pwh-p-media::after{animation:pwhHoloHover 1.1s var(--pw-ease) forwards}
}
@keyframes pwhHoloHover{from{transform:translateX(-110%)}to{transform:translateX(110%)}}

/* =========================================================
   2.25 Kennzahlen als dunkles Laborpanel (Sprache der Produktseite)
   ========================================================= */
.pwh.pwh-home-v2171 .pwh-stats-nums{
 position:relative;overflow:hidden;margin-top:4px;padding:20px 22px!important;border:0!important;border-radius:18px 6px 18px 6px;
 background:radial-gradient(70% 120% at 0% 0%,#3a1466 0%,transparent 60%),#0d0a13;
 box-shadow:inset 0 0 0 1px #ffffff12,0 20px 40px -24px #17111fb3;
}
.pwh.pwh-home-v2171 .pwh-stats-nums:before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,#b16bff,#7d2fc6 60%,transparent)}
.pwh.pwh-home-v2171 .pwh-stat__n{color:#fbf8ff!important}
.pwh.pwh-home-v2171 .pwh-stat__l{max-width:22ch!important;color:#a99ac0!important;font-family:'SFMono-Regular',ui-monospace,Menlo,Consolas,monospace;font-weight:500!important;letter-spacing:.02em}
@media(max-width:700px){
 .pwh.pwh-home-v2171 .pwh-stats-nums{padding:16px 16px!important;gap:14px!important;border-radius:16px 5px 16px 5px}
 .pwh.pwh-home-v2171 .pwh-stat__l{font-size:10.5px!important}
}
@media(prefers-reduced-motion:reduce){
 .pwh.pwh-home-v2171 .pwh-p-card .pwh-p-media::after,.pwh.pwh-home-v2171 .pwh-catalog:after{display:none!important;animation:none!important}
 .pwh.pwh-home-v2171 .pwh-catalog,.pwh.pwh-home-v2171 .pwh-catalog__thumb,.pwh.pwh-home-v2171 .pwh-catalog__arrow{transition:none}
}

/* 2.26.0: Produktkarten etwas schmaler */
@media(min-width:981px){
 .pwh.pwh-home-v2171 .pwh-p-grid{grid-template-columns:repeat(auto-fit,minmax(240px,300px));justify-content:center}
}
@media(max-width:700px){
 .pwh.pwh-home-v2171 .pwh-p-card{flex-basis:70%!important;max-width:300px}
}
/* 2.26.0: Handy – schwebendes Bild etwas tiefer */
@media(max-width:700px){
 .pwh.pwh-home-v2171 .pwh-stats-media img{translate:0 28px}
 .pwh.pwh-home-v2171 .pwh-stats{padding-bottom:36px}
}
