/* ============================================================
   STERI24 — Kategorieseiten (Autoklaven): GEMEINSAMES CSS
   GENERIERT von scripts/build-kategorie.py — nicht editieren.
   Quelle: category-pages/*.html. Upload nach /media/kategorie/kategorie.css
   Auto-Bildwechsel-Timing liegt seitenspezifisch inline in der Paste-Datei.
   ============================================================ */
/* ---- Scope .s24kt (Kopftext: Finder, Trust, Konfigurator-CTA) ---- */
/* Überschriften zentriert – auch auf Kategorieseiten (schlägt Theme-Regel
   .page-index-type-cat h2 { text-align:left !important }). */
#main .s24kt .s24kt-head__title, .s24kt .s24kt-head__title { text-align:center !important; font-weight:700 !important; text-transform:none !important; }

.s24kt-wrap { width:100%; max-width:100%; }
@media (max-width:767px){ .s24kt-wrap { padding-left:8px !important; padding-right:8px !important; } }
.s24kt, .s24kt *, .s24kt *::before, .s24kt *::after { box-sizing:border-box; margin:0; padding:0; }
.s24kt {
  --red:#A30027; --red-d:#7d001e; --red-t:#fdf2f5; --red-t2:#f9e0e6;
  --green:#1a5c33; --green-t:#f0faf4; --gold:#b78a2e;
  --ink:#1a1a1a; --ink-s:#404040; --mute:#6b6b6b;
  --line:#e6e6e6; --line-s:#f0f0f0; --bg:#fff; --bg-soft:#fafafa;
  --r:14px; --r-s:10px;
  --sh:0 1px 2px rgba(20,20,20,.04), 0 6px 22px rgba(20,20,20,.05);
  --sh-h:0 6px 24px rgba(163,0,39,.10), 0 18px 50px rgba(163,0,39,.14);
  font-family:"Fira Sans",Arial,sans-serif; color:var(--ink-s); line-height:1.55; font-size:15px;
  max-width:1500px; margin:0 auto; padding:8px 0 6px; -webkit-font-smoothing:antialiased;
}

/* Kopf */
.s24kt-head { text-align:center; max-width:760px; margin:0 auto 16px; }
.s24kt-head__title { font-size:clamp(22px,3vw,30px); font-weight:700; letter-spacing:-.02em; color:var(--ink); line-height:1.15; }
.s24kt-head__sub { margin-top:9px; font-size:15px; font-weight:500; color:var(--mute); }

/* Trust-Chips */
/* Goldene Trust-Bar (wie Branchen-Landingpages) */
.s24kt-trust { margin:4px 0 24px; background:#fff; border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--sh); display:grid; grid-template-columns:repeat(5,1fr); }
@media (max-width:860px){ .s24kt-trust { grid-template-columns:repeat(2,1fr); } }
@media (max-width:460px){ .s24kt-trust { grid-template-columns:1fr; } }
.s24kt-trust__item { display:flex; align-items:center; gap:12px; padding:18px 20px; border-right:1px solid var(--line-s); }
.s24kt-trust__item:last-child { border-right:0; }
@media (max-width:860px){ .s24kt-trust__item { border-bottom:1px solid var(--line-s); } }
.s24kt-trust__ico { position:relative; overflow:hidden; flex-shrink:0; width:36px; height:36px; border-radius:10px; background:linear-gradient(145deg,#caa14a 0%,#f1d68f 45%,#b8862e 100%); box-shadow:0 2px 6px rgba(183,138,46,.30), inset 0 1px 0 rgba(255,255,255,.5); display:inline-flex; align-items:center; justify-content:center; }
.s24kt-trust__ico svg { position:relative; z-index:1; width:18px; height:18px; stroke:#fff; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 1px 1px rgba(120,86,20,.35)); }
.s24kt-trust__ico::after { content:""; position:absolute; inset:0; background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.7) 50%, transparent 65%); transform:translateX(-130%); animation:s24ktShine 4.5s ease-in-out infinite; }
.s24kt-trust__item:nth-child(2) .s24kt-trust__ico::after { animation-delay:.25s; }
.s24kt-trust__item:nth-child(3) .s24kt-trust__ico::after { animation-delay:.5s; }
.s24kt-trust__item:nth-child(4) .s24kt-trust__ico::after { animation-delay:.75s; }
.s24kt-trust__item:nth-child(5) .s24kt-trust__ico::after { animation-delay:1s; }
@keyframes s24ktShine { 0%,55% { transform:translateX(-130%); } 78%,100% { transform:translateX(130%); } }
.s24kt-trust__t { display:block; font-size:14px; font-weight:700; color:var(--ink); line-height:1.25; }
.s24kt-trust__s { display:block; font-size:12px; color:var(--mute); line-height:1.3; }

/* Größen-Berater */
.s24kt-finder { background:none; border:0; border-radius:0; padding:0; }

.s24kt-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
@media (max-width:760px){ .s24kt-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:460px){ .s24kt-grid { grid-template-columns:1fr; } }

.s24kt-card { position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:var(--r-s); overflow:hidden; text-decoration:none !important; color:var(--ink) !important; box-shadow:var(--sh); transition:box-shadow .2s, transform .2s, border-color .2s; }
.s24kt-card:hover { box-shadow:var(--sh-h); transform:translateY(-3px); border-color:rgba(163,0,39,.30); }
.s24kt-card:focus-visible { outline:3px solid var(--red); outline-offset:3px; }
.s24kt-card__media { position:relative; width:100%; aspect-ratio:4/3; background:#fff; border-bottom:1px solid var(--line-s); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.s24kt-card__media img { width:100%; height:100%; object-fit:contain; padding:14px; transition:transform .3s ease; }
.s24kt-card:hover .s24kt-card__media img { transform:scale(1.04); }
/* Hover-Wechselbild: füllt den Container komplett (cover, kein weißer Rand), zoomt rein */
.s24kt-card__media img.s24kt-card__imgh { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; padding:0; opacity:0; transition:opacity .35s ease; }
/* Hover pausiert den Auto-Wechsel und zeigt die zweite Ansicht */
.s24kt-card:hover img.s24kt-card__imgh { animation:none; opacity:1; }
/* Rabatt-Bubble oben links über dem Bild */
.s24kt-card__badge { position:absolute; top:10px; left:10px; z-index:2; background:var(--red); color:#fff; font-size:13px; font-weight:800; letter-spacing:-.01em; padding:5px 10px; border-radius:999px; box-shadow:0 3px 10px rgba(163,0,39,.30); }
.s24kt-card__badge--gold { background:linear-gradient(135deg,#3d2600,#b78a2e 60%,#5c3800); box-shadow:0 3px 10px rgba(120,86,20,.30); }
.s24kt-card__now--soft { font-size:13px; font-weight:700; color:var(--mute); }
.s24kt-card__body { display:flex; flex-direction:column; padding:13px 16px 15px; }
.s24kt-card__size { font-size:22px; font-weight:800; color:var(--ink); letter-spacing:-.02em; line-height:1; }
.s24kt-card__pop { margin-top:7px; font-size:12px; font-weight:700; color:var(--ink); line-height:1.25; }
.s24kt-card__list { list-style:none; display:flex; flex-direction:column; gap:5px; margin:7px 0 0; padding:0; }
.s24kt-card__list li { display:flex; align-items:flex-start; gap:7px; font-size:12.5px; color:var(--ink-s); line-height:1.35; }
.s24kt-card__list svg { flex-shrink:0; width:14px; height:14px; stroke:var(--red); fill:none; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; margin-top:2px; }
/* Preis: Angebot rot & groß, Listenpreis durchgestrichen daneben */
.s24kt-card__price { display:flex; align-items:baseline; flex-wrap:wrap; gap:7px; margin-top:10px; }
.s24kt-card__now { font-size:19px; font-weight:800; color:var(--red); letter-spacing:-.01em; }
.s24kt-card__was { font-size:13px; font-weight:600; color:var(--mute); text-decoration:line-through; }
.s24kt-card__from { font-size:11.5px; font-weight:600; color:var(--mute); }
.s24kt-card__ship { display:inline-flex; align-items:center; gap:6px; margin-top:8px; font-size:12.5px; font-weight:700; color:var(--green); }
.s24kt-card__ship svg { width:17px; height:17px; stroke:var(--green); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }

.s24kt-setline { display:flex; align-items:center; gap:14px; margin-top:12px; padding:14px 18px; background:#fff; border:1px solid var(--line); border-radius:var(--r-s); text-decoration:none !important; color:var(--ink) !important; box-shadow:var(--sh); transition:box-shadow .2s, transform .2s, border-color .2s; }
.s24kt-setline:hover { box-shadow:var(--sh-h); transform:translateY(-2px); border-color:rgba(163,0,39,.30); }
.s24kt-setline:focus-visible { outline:3px solid var(--red); outline-offset:3px; }
.s24kt-setline__media { flex-shrink:0; width:64px; height:64px; border-radius:10px; background:#fff; border:1px solid var(--line-s); display:inline-flex; align-items:center; justify-content:center; overflow:hidden; }
.s24kt-setline__media img { width:100%; height:100%; object-fit:contain; padding:6px; }
.s24kt-setline__txt { flex:1; min-width:0; font-size:14px; color:var(--ink-s); line-height:1.45; }
.s24kt-setline__txt b { color:var(--ink); font-weight:700; }
.s24kt-setline__cta { flex-shrink:0; display:inline-flex; align-items:center; gap:8px; color:var(--red) !important; font-size:14px; font-weight:700; white-space:nowrap; }
.s24kt-setline__cta svg { width:15px; height:15px; stroke:var(--red); fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s; }
.s24kt-setline:hover .s24kt-setline__cta svg { transform:translateX(3px); }
@media (max-width:560px){ .s24kt-setline { flex-wrap:wrap; } .s24kt-setline__cta { width:100%; } }

/* Konfigurator-CTA */
.s24kt-config { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-top:14px; padding:22px 26px; background:linear-gradient(135deg,var(--red) 0%, var(--red-d) 100%); border-radius:var(--r); color:#fff; box-shadow:var(--sh); }
.s24kt-config__t { display:block; font-size:18px; font-weight:800; color:#fff; letter-spacing:-.01em; }
.s24kt-config__s { display:block; margin-top:3px; font-size:13.5px; color:rgba(255,255,255,.9); }
.s24kt-config__actions { display:flex; flex-wrap:wrap; gap:10px; }
.s24kt-btn { display:inline-flex; align-items:center; gap:9px; background:#fff; color:var(--red) !important; font-size:15px; font-weight:700; padding:13px 24px; border-radius:999px; text-decoration:none !important; transition:background .2s, box-shadow .2s, transform .2s, color .2s; }
.s24kt-btn svg { width:16px; height:16px; stroke:var(--red); fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s; }
.s24kt-btn:hover { background:var(--ink); color:#fff !important; transform:translateY(-2px); box-shadow:var(--sh-h); }
.s24kt-btn:hover svg { stroke:#fff; transform:translateX(3px); }
.s24kt-btn:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.s24kt-btn--ghost { background:transparent; color:#fff !important; border:1.5px solid rgba(255,255,255,.6); }
.s24kt-btn--ghost:hover { background:rgba(255,255,255,.12); color:#fff !important; }

/* Smartphone: Subline + Trust-Chips ausblenden, damit die Produkte sofort sichtbar sind */
@media (max-width:767px){
  .s24kt-head__sub, .s24kt-trust { display:none !important; }
  .s24kt-head { margin-bottom:14px; }
  /* Finder als vertikale Liste: Bild links, Text rechts */
  .s24kt-grid { grid-template-columns:1fr; gap:10px; }
  .s24kt-card { flex-direction:row; align-items:stretch; }
  .s24kt-card__media { flex:0 0 112px; width:112px; aspect-ratio:auto; min-height:112px; border-bottom:none; border-right:1px solid var(--line-s); }
  .s24kt-card__body { flex:1; min-width:0; justify-content:center; padding:12px 14px; }
  .s24kt-card__badge { display:none; }
  /* Auto-Bildwechsel NUR auf Smartphone: 24s-Zyklus, 4s Anwenderbild, 4s versetzt (v. links) */
  /* Sparpakete-Zeile wie die Produktkacheln: Bild links voll, Text + Link rechts gestapelt */
  .s24kt-setline { display:grid; grid-template-columns:112px 1fr; grid-template-areas:"media txt" "media cta"; align-items:stretch; gap:0; padding:0; overflow:hidden; }
  .s24kt-setline__media { grid-area:media; width:112px; height:100%; min-height:112px; border:0; border-right:1px solid var(--line-s); border-radius:0; }
  .s24kt-setline__txt { grid-area:txt; padding:12px 14px 4px; }
  .s24kt-setline__cta { grid-area:cta; justify-content:flex-start; width:auto; padding:0 14px 12px; }
}

@media (prefers-reduced-motion:reduce){
  .s24kt *, .s24kt *::before, .s24kt *::after { transition:none !important; animation:none !important; }
  .s24kt-card:hover, .s24kt-setline:hover, .s24kt-btn:hover { transform:none; }
  .s24kt-card:hover .s24kt-card__media img { transform:none; }
}

/* ---- Scope .s24kb (Fusstext: Warum, Vergleich, Reviews, FAQ, CTA) ---- */
/* Überschriften zentriert – auch auf Kategorieseiten (schlägt .page-index-type-cat h2 left). */
#main .s24kb .s24kb-head__title, .s24kb .s24kb-head__title,
#main .s24kb .s24kb-final h2, .s24kb .s24kb-final h2 { text-align:center !important; }
/* Theme entfettet h2/h3 auf Kategorieseiten (#main h2/h3 {font-weight:400!important}) -> Gewicht erzwingen */
#main .s24kb .s24kb-head__title, .s24kb .s24kb-head__title,
#main .s24kb .s24kb-final h2, .s24kb .s24kb-final h2,
#main .s24kb .s24kb-usp h3, .s24kb .s24kb-usp h3 { font-weight:700 !important; text-transform:none !important; }
#main .s24kb .s24kb-replace h2, .s24kb .s24kb-replace h2,
#main .s24kb .s24kb-cmp__col h3, .s24kb .s24kb-cmp__col h3 { font-weight:800 !important; text-transform:none !important; }

.s24kb-wrap { width:100%; max-width:100%; }
@media (max-width:767px){ .s24kb-wrap { padding-left:8px !important; padding-right:8px !important; } }
.s24kb, .s24kb *, .s24kb *::before, .s24kb *::after { box-sizing:border-box; margin:0; padding:0; }
.s24kb {
  --red:#A30027; --red-d:#7d001e; --red-t:#fdf2f5; --red-t2:#f9e0e6;
  --green:#1a5c33; --green-t:#f0faf4; --gold:#b78a2e;
  --ink:#1a1a1a; --ink-s:#404040; --mute:#6b6b6b;
  --line:#e6e6e6; --line-s:#f0f0f0; --bg:#fff; --bg-soft:#fafafa;
  --r:14px; --r-s:10px;
  --sh:0 1px 2px rgba(20,20,20,.04), 0 6px 22px rgba(20,20,20,.05);
  --sh-h:0 6px 24px rgba(163,0,39,.10), 0 18px 50px rgba(163,0,39,.14);
  font-family:"Fira Sans",Arial,sans-serif; color:var(--ink-s); line-height:1.6; font-size:15px;
  max-width:1500px; margin:0 auto; padding:10px 0 8px; -webkit-font-smoothing:antialiased;
}
.s24kb a { color:var(--red); text-decoration:none; }
.s24kb a:hover { text-decoration:underline; }

.s24kb-sec { padding:34px 0 6px; }
.s24kb-head { text-align:center; max-width:720px; margin:0 auto 22px; }
.s24kb-eyebrow { display:inline-block; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--red); margin-bottom:8px; }
.s24kb-head__title { font-size:clamp(20px,2.6vw,28px); font-weight:700; letter-spacing:-.02em; color:var(--ink); line-height:1.18; }
.s24kb-head__sub { margin-top:9px; font-size:14.5px; font-weight:500; color:var(--mute); }
.s24kb-video { max-width:900px; margin:0 auto; position:relative; aspect-ratio:16/9; border-radius:var(--r); overflow:hidden; box-shadow:var(--sh); border:1px solid var(--line); background:#000; }
.s24kb-video iframe { position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }

/* Buttons */
.s24kb-btn { display:inline-flex; align-items:center; gap:9px; background:var(--red); color:#fff !important; font-size:15px; font-weight:700; padding:13px 24px; border-radius:999px; text-decoration:none !important; transition:background .2s, box-shadow .2s, transform .2s; }
.s24kb-btn svg { width:16px; height:16px; stroke:#fff; fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s; }
.s24kb-btn:hover { background:var(--red-d); box-shadow:var(--sh-h); transform:translateY(-2px); }
.s24kb-btn:hover svg { transform:translateX(3px); }
.s24kb-btn:focus-visible { outline:3px solid var(--ink); outline-offset:3px; }
.s24kb-btn--ghost { background:#fff; color:var(--red) !important; border:1.5px solid var(--red-t2); }
.s24kb-btn--ghost:hover { background:var(--red-t); }

/* USP-Karten */
.s24kb-usps { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
@media (max-width:900px){ .s24kb-usps { grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .s24kb-usps { grid-template-columns:1fr; } }
.s24kb-usp { background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:20px 18px; box-shadow:var(--sh); }
.s24kb-usp__ico { width:40px; height:40px; border-radius:11px; background:var(--red-t); display:inline-flex; align-items:center; justify-content:center; margin-bottom:13px; }
.s24kb-usp__ico svg { width:21px; height:21px; stroke:var(--red); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.s24kb-usp h3 { font-size:15.5px; font-weight:700; color:var(--ink); margin-bottom:6px; letter-spacing:-.01em; }
.s24kb-usp p { font-size:13.5px; color:var(--mute); line-height:1.5; }

/* Pro vs Premium */
.s24kb-cmp { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:760px){ .s24kb-cmp { grid-template-columns:1fr; } }
.s24kb-cmp__col { position:relative; overflow:hidden; background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:24px 24px 22px; box-shadow:var(--sh); }
.s24kb-cmp__col--active { border-color:rgba(163,0,39,.35); }
.s24kb-cmp__media { display:flex; align-items:center; justify-content:center; margin:-24px -24px 16px; background:#fff; border-bottom:1px solid var(--line-s); aspect-ratio:16/10; overflow:hidden; }
.s24kb-cmp__media img { width:100%; height:100%; object-fit:contain; padding:18px; }
.s24kb-cmp__tag { display:inline-block; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:5px 11px; border-radius:999px; background:var(--red); color:#fff; margin-bottom:12px; }
.s24kb-cmp__tag--gold { background:linear-gradient(135deg,#3d2600,#b78a2e 60%,#5c3800); }
.s24kb-cmp__col h3 { font-size:19px; font-weight:800; color:var(--ink); letter-spacing:-.015em; }
.s24kb-cmp__for { font-size:13.5px; color:var(--mute); margin:2px 0 14px; }
.s24kb-cmp__col ul { list-style:none; display:flex; flex-direction:column; gap:9px; }
.s24kb-cmp__col li { display:flex; align-items:flex-start; gap:9px; font-size:14px; color:var(--ink-s); }
.s24kb-cmp__col li svg { flex-shrink:0; width:17px; height:17px; stroke:var(--red); fill:none; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; margin-top:2px; }
.s24kb-cmp__link { display:inline-flex; align-items:center; gap:8px; margin-top:16px; font-size:14px; font-weight:700; color:var(--red) !important; text-decoration:none !important; }
.s24kb-cmp__link svg { width:15px; height:15px; stroke:var(--red); fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s; }
.s24kb-cmp__link:hover svg { transform:translateX(3px); }
/* ── Pro-vs-Premium Vergleichstabelle ── */
.s24kb-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.s24kb-cmp2{ max-width:820px; margin:0 auto; background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; box-shadow:var(--sh); }
.s24kb-cmp2__head, .s24kb-cmp2__row{ display:grid; grid-template-columns:1fr 100px 100px; align-items:stretch; }
.s24kb-cmp2__row{ border-top:1px solid var(--line-s); }
.s24kb-cmp2__row:nth-child(even){ background:var(--bg-soft); }
.s24kb-cmp2__head{ background:#fff; border-bottom:1px solid var(--line); }
.s24kb-cmp2__feat{ padding:13px 16px; font-size:14px; color:var(--ink-s); line-height:1.35; display:flex; flex-direction:column; justify-content:center; }
.s24kb-cmp2__head .s24kb-cmp2__feat{ color:var(--ink); font-weight:700; }
.s24kb-cmp2__cell{ padding:13px 8px; text-align:center; display:flex; align-items:center; justify-content:center; }
.s24kb-cmp2__head .s24kb-cmp2__cell{ color:var(--ink); font-weight:800; font-size:13.5px; letter-spacing:.02em; display:flex; flex-direction:column; align-items:center; gap:7px; }
.s24kb-cmp2__thumb{ width:72px; height:72px; background:#fff; border-radius:8px; display:flex; align-items:center; justify-content:center; overflow:hidden; border:1px solid var(--line); }
.s24kb-cmp2__thumb img{ width:100%; height:100%; object-fit:contain; padding:4px; }
.s24kb-cmp2__cell--prem{ background:rgba(183,138,46,.10); }
.s24kb-cmp2__head .s24kb-cmp2__cell--prem{ background:rgba(183,138,46,.10); color:var(--ink); }
.s24kb-yes{ width:20px; height:20px; stroke:#1a5c33; fill:none; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; vertical-align:middle; }
.s24kb-no{ width:18px; height:18px; stroke:#c9c9c9; fill:none; stroke-width:2.6; stroke-linecap:round; vertical-align:middle; }
.s24kb-cmp2__sub{ display:block; font-size:12px; color:var(--mute); margin-top:3px; line-height:1.35; font-weight:400; }
.s24kb-cmp2__ftop{ display:flex; align-items:center; gap:8px; }
.s24kb-cmp2__info{ width:16px; height:16px; flex-shrink:0; stroke:var(--red); fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s; }
.s24kb-cmp2__row--info{ cursor:pointer; }
.s24kb-cmp2__row--info:hover{ background:var(--red-t); }
.s24kb-cmp2__row--info .s24kb-cmp2__sub{ display:none; }
.s24kb-cmp2__row--info.is-open .s24kb-cmp2__sub{ display:block; margin-top:6px; }
.s24kb-cmp2__row--info.is-open .s24kb-cmp2__info{ transform:rotate(180deg); }
.s24kb-cmp2__row--info:focus-visible{ outline:2px solid var(--red); outline-offset:-2px; }
.s24kb-cmp2__cta{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:18px; }
@media (max-width:560px){
  .s24kb-cmp2__head, .s24kb-cmp2__row{ grid-template-columns:1fr 60px 60px; }
  .s24kb-cmp2__feat{ font-size:13px; padding:11px 12px; }
  .s24kb-cmp2__thumb{ width:46px; height:46px; }
}

/* Altgerät ersetzen */
.s24kb-replace { background:linear-gradient(135deg,var(--ink) 0%, #2a2a2a 100%); color:#fff; border-radius:var(--r); padding:36px 40px; display:grid; grid-template-columns:1.4fr 1fr; gap:30px; align-items:center; }
@media (max-width:760px){ .s24kb-replace { grid-template-columns:1fr; padding:26px 22px; gap:20px; } }
.s24kb-replace h2 { font-size:clamp(20px,2.4vw,26px); font-weight:800; color:#fff; letter-spacing:-.02em; margin-bottom:10px; line-height:1.2; }
.s24kb-replace p { font-size:14.5px; color:rgba(255,255,255,.82); margin-bottom:18px; }
.s24kb-replace ul { list-style:none; display:flex; flex-direction:column; gap:11px; }
.s24kb-replace li { display:flex; align-items:flex-start; gap:10px; font-size:14px; color:#fff; font-weight:600; }
.s24kb-replace li svg { flex-shrink:0; width:18px; height:18px; stroke:#fff; fill:none; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; margin-top:1px; }
.s24kb-replace .s24kb-btn { background:#fff; color:var(--red) !important; }
.s24kb-replace .s24kb-btn svg { stroke:var(--red); }
.s24kb-replace .s24kb-btn:hover { background:var(--red-t); }

/* Reviews */
.s24kb-rev__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
@media (max-width:767px){ .s24kb-rev__grid { grid-template-columns:1fr; } }
.s24kb-rev__card { display:flex; flex-direction:column; gap:14px; background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:22px 24px; box-shadow:var(--sh); }
.s24kb-rev__top { display:flex; align-items:center; gap:13px; }
.s24kb-rev__img { width:50px; height:50px; border-radius:50%; object-fit:cover; flex:0 0 50px; background:var(--bg-soft); box-shadow:0 0 0 1px var(--line), 0 0 0 4px #fff; }
.s24kb-rev__name { font-size:15.5px; font-weight:700; color:var(--ink); line-height:1.2; }
.s24kb-rev__co { font-size:12.5px; font-weight:600; color:var(--ink-s); }
.s24kb-rev__stars { display:flex; gap:2px; }
.s24kb-rev__stars svg { width:15px; height:15px; fill:#f5b301; }
.s24kb-rev__text { font-size:14px; color:var(--ink-s); line-height:1.6; }
.s24kb-rev__pag { grid-column:1/-1; display:flex; justify-content:center; gap:7px; margin-top:8px; }
.s24kb-rev__pbtn { min-width:38px; height:38px; padding:0 6px; border:1px solid var(--line); background:#fff; color:var(--ink-s); border-radius:10px; font-family:inherit; font-size:14px; font-weight:700; cursor:pointer; transition:all .15s; }
.s24kb-rev__pbtn:hover:not(:disabled){ border-color:var(--red); color:var(--red); }
.s24kb-rev__pbtn.active { background:var(--red); border-color:var(--red); color:#fff; }
.s24kb-rev__pbtn:disabled { opacity:.4; cursor:not-allowed; }
.s24kb-rev__pbtn:focus-visible { outline:2px solid var(--red); outline-offset:2px; }
.s24kb-rev__empty { grid-column:1/-1; text-align:center; padding:26px; border:1px dashed var(--line); border-radius:var(--r); color:var(--ink-s); }

/* FAQ */
.s24kb-faq { max-width:820px; margin:0 auto; }
.s24kb-faq details { background:#fff; border:1px solid var(--line); border-radius:var(--r); margin-bottom:12px; overflow:hidden; }
.s24kb-faq summary { list-style:none; cursor:pointer; padding:18px 22px; font-size:15.5px; font-weight:700; color:var(--ink); display:flex; align-items:center; justify-content:space-between; gap:14px; }
.s24kb-faq summary::-webkit-details-marker { display:none; }
.s24kb-faq summary::after { content:""; flex-shrink:0; width:11px; height:11px; border-right:2px solid var(--red); border-bottom:2px solid var(--red); transform:rotate(45deg); transition:transform .2s; }
.s24kb-faq details[open] summary::after { transform:rotate(-135deg); }
.s24kb-faq summary:focus-visible { outline:3px solid var(--red); outline-offset:-3px; }
.s24kb-faq__a { padding:0 22px 20px; font-size:14.5px; color:var(--ink-s); line-height:1.65; }

/* Final CTA */
.s24kb-final { background:linear-gradient(135deg,var(--red) 0%, var(--red-d) 100%); border-radius:var(--r); padding:42px 40px; text-align:center; color:#fff; box-shadow:var(--sh); }
.s24kb-final h2 { font-size:clamp(22px,2.8vw,30px); font-weight:700; color:#fff; letter-spacing:-.02em; margin-bottom:10px; }
.s24kb-final p { font-size:15.5px; color:rgba(255,255,255,.9); max-width:560px; margin:0 auto 22px; }
.s24kb-final__actions { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.s24kb-final .s24kb-btn { background:#fff; color:var(--red) !important; }
.s24kb-final .s24kb-btn svg { stroke:var(--red); }
.s24kb-final .s24kb-btn:hover { background:var(--ink); color:#fff !important; }
.s24kb-final .s24kb-btn:hover svg { stroke:#fff; }
.s24kb-final .s24kb-btn--ghost { background:transparent; color:#fff !important; border:1.5px solid rgba(255,255,255,.6); }
.s24kb-final .s24kb-btn--ghost:hover { background:rgba(255,255,255,.12); color:#fff !important; }
.s24kb-foot { margin-top:16px; font-size:12px; color:var(--mute); text-align:center; }

@media (prefers-reduced-motion:reduce){
  .s24kb *, .s24kb *::before, .s24kb *::after { transition:none !important; animation:none !important; }
  .s24kb-btn:hover { transform:none; }
}
