/* ==========================================================================
   Kauf-Kachel (Redesign Okt. 2026) – siehe inc/kaufkachel.php
   Gilt nur für Matten, Pfosten, Tore, Sichtschutz (Klasse .dsp-kk am
   .summary, gesetzt von assets/js/dsp-kaufkachel.js).
   ========================================================================== */

.dsp-kk {
    --kk-green: var(--petrol, #2a7d6f);
    --kk-green-dark: #17594d;
    --kk-green-deep: #0f4f43;
    --kk-green-soft: #eaf5f1;
    --kk-line: #e3e8e6;
    --kk-text: var(--text-dark, #2d2d2d);
    --kk-muted: #6b7471;
    --kk-radius: 14px;
}

/* ── Kennzeichnungen ("Beliebt", "Empfohlen", "Optik" …) vorerst aus ── */
.dsp-kk .dsp-var-badge {
    display: none !important;
}

/* ── Oben: Preis-Karte, darunter Info-Box (Lager | Artikelnummer) ──── */
.dsp-kk .dsp-kk-toprow {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 14px 0 16px;
}

/* Original-Lagerbox + Artikelnummer-Zeile bleiben im DOM (werden von der
   Produkt-App gepflegt), angezeigt wird die Info-Box. */
.dsp-kk.dsp-kk-has-info .dsp-stock-box,
.dsp-kk.dsp-kk-has-info > .dsp-product-sku { display: none !important; }

.dsp-kk .dsp-kk-info {
    display: flex;
    align-items: stretch;
    padding: 10px 14px;
    background: var(--kk-green-soft);
    border: 1px solid #d7ebe3;
    border-radius: 14px;
    color: var(--kk-text);
}
.dsp-kk .dsp-kk-info__left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}
.dsp-kk .dsp-kk-info__row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    font-size: .86rem;
    font-weight: 600;
    white-space: nowrap;
}
.dsp-kk .dsp-kk-info__row[hidden] { display: none; }
.dsp-kk .dsp-kk-info__row + .dsp-kk-info__row {
    border-top: 1px solid #cfe3db;
    /* Trennlinie beginnt erst beim Text (wie im Entwurf) */
    margin-left: 30px;
    padding-left: 0;
}
.dsp-kk .dsp-kk-info__row + .dsp-kk-info__row .dsp-kk-info__icon { margin-left: -30px; }
.dsp-kk .dsp-kk-info__icon {
    display: inline-flex;
    flex: 0 0 22px;
    justify-content: center;
    color: var(--kk-green);
}
.dsp-kk .dsp-kk-info__icon svg { width: 20px; height: 20px; }
.dsp-kk .dsp-kk-info__dot {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    margin-left: -2px;
    border-radius: 50%;
    background: #1f8a5b;
}
.dsp-kk .dsp-kk-info.is-out .dsp-kk-info__dot { background: #c9493b; }
/* Damit "Auf Lager" und "3–21 Werktage" bündig untereinander stehen */
.dsp-kk .dsp-kk-info__delivery .dsp-kk-info__txt { padding-left: 15px; }

.dsp-kk .dsp-kk-info__sku {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    min-width: 0;
    margin-left: 16px;
    padding-left: 16px;
    border-left: 1px solid #c4dcd2;
}
.dsp-kk .dsp-kk-info__sku[hidden] { display: none; }
.dsp-kk .dsp-kk-info__label {
    font-size: .76rem;
    color: var(--kk-muted);
}
.dsp-kk .dsp-kk-info__skuval {
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .01em;
    word-break: break-all;
}

/* Preis-Karte mit schräger grüner Fläche dahinter */
.dsp-kk .dsp-kk-pricewrap {
    position: relative;
    align-self: flex-end;
    width: 326px;
    max-width: calc(100% - 10px);
    margin-right: 10px;
}
.dsp-kk .dsp-kk-pricewrap::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 12px -8px -7px 40%;
    border-radius: 14px;
    background: linear-gradient(135deg, #1f6f5f 0%, var(--kk-green-deep) 100%);
    transform: rotate(2.5deg);
    transform-origin: 70% 60%;
    opacity: .9;
}
.dsp-kk .dsp-kk-pricecard {
    position: relative;
    z-index: 1;
    min-width: 0;
    padding: 12px 14px 12px;
    background: linear-gradient(160deg, #fffefb 0%, #fbf6ea 100%);
    border: 1px solid #ece2c8;
    border-radius: 14px;
    box-shadow: 0 10px 24px rgba(15, 79, 67, .12), 0 1px 3px rgba(0, 0, 0, .05);
}

/* Merklisten-Stern als runder Knopf oben rechts an der Preis-Karte */
.dsp-kk .dsp-title-star-wrap.dsp-kk-star {
    position: absolute !important;
    top: -11px !important;
    right: -11px !important;
    left: auto !important;
    bottom: auto !important;
    z-index: 3;
    margin: 0 !important;
    transform: none !important;
    width: 32px;
    height: 32px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid #ece2c8;
    border-radius: 50%;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .12);
}
body.single-product .dsp-kk .dsp-kk-star .dsp-title-star,
body.single-product .dsp-kk .dsp-kk-star .dsp-title-star:hover,
body.single-product .dsp-kk .dsp-kk-star .dsp-title-star:focus,
body.single-product .dsp-kk .dsp-kk-star .dsp-title-star:focus-visible,
body.single-product .dsp-kk .dsp-kk-star .dsp-title-star:active {
    position: static !important;
    margin: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-tap-highlight-color: transparent;
}
body.single-product .dsp-kk .dsp-kk-star .dsp-title-star {
    transform: scale(.82);
    transition: transform .18s cubic-bezier(.34, 1.56, .64, 1);
}
/* Hover: Stern "ploppt" etwas raus statt grauem Kasten */
body.single-product .dsp-kk .dsp-kk-star .dsp-title-star:not(.is-disabled):hover {
    transform: scale(1.02);
}
body.single-product .dsp-kk .dsp-kk-star .dsp-title-star:not(.is-disabled):active {
    transform: scale(.74);
}
.dsp-kk .dsp-title-star-wrap.dsp-kk-star {
    transition: box-shadow .18s ease, transform .18s ease;
}
.dsp-kk .dsp-title-star-wrap.dsp-kk-star:hover {
    box-shadow: 0 5px 14px rgba(196, 167, 125, .45) !important;
}

.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price {
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: wrap;
    gap: 2px 5px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
    transform: none !important;
}
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__lead {
    font-size: .8rem !important;
    font-weight: 500 !important;
    color: var(--kk-muted) !important;
}
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__lead.is-hidden { display: none !important; }

.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__amount,
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__amount .price,
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__amount .woocommerce-Price-amount {
    font-size: 1.85rem !important;
    line-height: 1.05 !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    color: var(--kk-green-deep) !important;
    white-space: nowrap;
}
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__side { display: block !important; }
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__unit {
    font-size: .82rem !important;
    font-weight: 500 !important;
    color: var(--kk-muted) !important;
    white-space: nowrap;
}
/* "inkl. MwSt." steht unter dem Meterpreis (eigene Zeile) */
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__meta { display: none !important; }
.dsp-kk .dsp-kk-price-tax {
    margin-top: 5px;
    font-size: .7rem;
    color: var(--kk-muted);
}

.dsp-kk .dsp-kk-pricecard__foot {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: space-between;
    align-items: start;
    gap: 8px 10px;
    margin-top: 10px;
}
.dsp-kk .dsp-kk-pricecard__col {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}
.dsp-kk .dsp-kk-pricecard__col--left { align-items: flex-start; }
.dsp-kk .dsp-kk-pricecard__col--right { align-items: flex-end; }
.dsp-kk .dsp-kk-pricecard__foot .dsp-kk-meter-pill { margin-top: 0 !important; }
.dsp-kk .dsp-kk-pricecard__foot .dsp-kk-ship-btn {
    width: auto !important;
    margin: 0 !important;
}

/* Lagerstatus (links) und Lieferzeit (rechts) in der Karte */
.dsp-kk .dsp-kk-stockline,
.dsp-kk .dsp-kk-deliv {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .74rem;
    line-height: 1.2;
    white-space: nowrap;
}
.dsp-kk .dsp-kk-stockline[hidden],
.dsp-kk .dsp-kk-deliv[hidden] { display: none; }
.dsp-kk .dsp-kk-stockline {
    padding-left: 2px;
    font-weight: 600;
    color: #1f6f4e;
}
.dsp-kk .dsp-kk-stockline__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #1f8a5b;
    box-shadow: 0 0 0 3px rgba(31, 138, 91, .16);
}
.dsp-kk .dsp-kk-stockline.is-out { color: #b03a2e; }
.dsp-kk .dsp-kk-stockline.is-out .dsp-kk-stockline__dot { background: #c9493b; box-shadow: 0 0 0 3px rgba(201, 73, 59, .16); }
.dsp-kk .dsp-kk-deliv {
    padding-right: 2px;
    font-weight: 500;
    color: var(--kk-muted);
}
.dsp-kk .dsp-kk-deliv__icon { display: inline-flex; color: var(--kk-green); }
.dsp-kk .dsp-kk-deliv__icon svg { width: 14px; height: 14px; }

/* Artikelnummer unter der Preis-Karte */
.dsp-kk .dsp-kk-sku {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 7px;
    margin: 12px 0 0 !important;
    padding: 5px 11px 5px 9px;
    background: #fff;
    border: 1px solid #e3e8e6;
    border-radius: 999px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
    line-height: 1.2;
}
.dsp-kk .dsp-kk-sku[hidden] { display: none; }
.dsp-kk .dsp-kk-sku__icon { display: inline-flex; color: #b0935f; }
.dsp-kk .dsp-kk-sku__label {
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--kk-muted);
}
.dsp-kk .dsp-kk-sku__val {
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--kk-text);
}

/* Meterpreis */
.dsp-kk .dsp-kk-meter-pill {
    display: flex;
    width: max-content;
    max-width: 100%;
    align-items: center;
    gap: 5px;
    margin-top: 7px;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--kk-green-deep);
    color: #fff;
    font-weight: 600;
    font-size: .8rem;
    line-height: 1.4;
    white-space: nowrap;
}
.dsp-kk .dsp-kk-meter-pill svg { width: 13px; height: 13px; }
.dsp-kk .dsp-kk-meter-pill[hidden] { display: none; }

/* Versandkosten-Button: klein & fein, aber erkennbar klickbar */
.dsp-kk .dsp-kk-ship-btn {
    display: flex;
    align-items: center;
    gap: 5px;
    width: 100%;
    margin-top: 9px;
    padding: 5px 8px;
    background: #fff;
    border: 1px solid #b9d9cf;
    border-radius: 8px;
    color: var(--kk-text);
    font: inherit;
    font-size: .72rem;
    font-weight: 600;
    line-height: 1.2;
    text-align: left;
    overflow: hidden;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}
.dsp-kk .dsp-kk-ship-btn:hover,
.dsp-kk .dsp-kk-ship-btn:focus-visible {
    background: var(--kk-green-soft);
    border-color: var(--kk-green);
    outline: none;
}
.dsp-kk .dsp-kk-ship-btn__icon { display: inline-flex; color: var(--kk-green); }
.dsp-kk .dsp-kk-ship-btn__icon svg { width: 14px; height: 14px; }
.dsp-kk .dsp-kk-ship-btn__text { flex: 1; white-space: nowrap; }
.dsp-kk .dsp-kk-ship-btn__more {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: var(--kk-green-dark);
    font-weight: 700;
    white-space: nowrap;
}
.dsp-kk .dsp-kk-ship-btn__more span { text-decoration: underline; text-underline-offset: 2px; }

/* Schmale Ansicht: Info-Box untereinander */
@media (max-width: 359px) {
    .dsp-kk .dsp-kk-info { flex-direction: column; }
    .dsp-kk .dsp-kk-info__sku { margin: 8px 0 0; padding: 8px 0 0; border-left: 0; border-top: 1px solid #c4dcd2; }
}

/* ── Akkordeon-Schritte ──────────────────────────────────────────────── */
.dsp-kk .dsp-kk-acc {
    display: flex !important;
    flex-direction: column;
    gap: 0;
}


.dsp-kk .dsp-kk-acc > .dsp-var-row.dsp-kk-acc-item {
    /* display (Grid/Flex) bleibt wie im Original – nur die Karten-Optik */
    margin: 0 0 8px !important;
    padding: 0 12px !important;
    background: #fff !important;
    border: 1px solid var(--kk-line) !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
    opacity: 1 !important;
    filter: none !important;
    overflow: visible;
}
.dsp-kk .dsp-kk-acc > .dsp-var-row.dsp-kk-acc-item.is-open {
    padding-bottom: 12px !important;
    border-color: #b9d9cf !important;
    box-shadow: 0 4px 14px rgba(15, 79, 67, .08);
}

.dsp-kk .dsp-kk-acc-item > .dsp-kk-acc-head {
    display: flex !important;
    align-items: center;
    gap: 6px;
    width: 100%;
    min-height: 46px;
    margin: 0 !important;
    padding: 10px 0 !important;
    grid-column: 1 / -1;
    flex: 0 0 100%;
    font-size: .93rem !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    cursor: pointer;
    user-select: none;
    box-sizing: border-box;
}
.dsp-kk .dsp-kk-acc-item.has-sub:not(.is-open) > .dsp-kk-acc-head {
    min-height: 0;
    padding-bottom: 0 !important;
}
.dsp-kk .dsp-kk-acc-item > .dsp-kk-acc-head:focus-visible {
    outline: 2px solid var(--kk-green);
    outline-offset: -2px;
    border-radius: 12px;
}
.dsp-kk .dsp-kk-acc-head .dsp-var-label-text {
    color: inherit !important;
    font: inherit !important;
}

/* Unterzeile der Auswahl (zugeklappt) */
.dsp-kk .dsp-kk-acc-sub {
    grid-column: 1 / -1;
    flex: 0 0 100%;
    margin: 1px 0 0;
    padding: 0 0 10px;
    font-size: .74rem;
    line-height: 1.3;
    color: var(--kk-muted);
    cursor: pointer;
}
.dsp-kk .dsp-kk-acc-sub[hidden],
.dsp-kk .dsp-kk-acc-item.is-open > .dsp-kk-acc-sub { display: none !important; }

/* Auswahl-Chip: grün hinterlegt mit Haken */
.dsp-kk .dsp-kk-acc-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
    padding: 3px 9px 3px 7px;
    border-radius: 999px;
    background: var(--kk-green-soft);
    border: 1px solid #b9d9cf;
    color: var(--kk-green-deep);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.35;
    white-space: nowrap;
    max-width: 58%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.dsp-kk .dsp-kk-acc-chip::before {
    content: "";
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--kk-green-deep) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center / 9px no-repeat;
}
.dsp-kk .dsp-kk-acc-chip[hidden] { display: none; }

.dsp-kk .dsp-kk-acc-chevron {
    display: inline-flex;
    flex: 0 0 auto;
    margin-left: auto;
    color: var(--kk-muted);
    transition: transform .2s ease;
}
.dsp-kk .dsp-kk-acc-chevron svg { width: 18px; height: 18px; }
.dsp-kk .dsp-kk-acc-chip:not([hidden]) + .dsp-kk-acc-chevron { margin-left: 0; }
.dsp-kk .dsp-kk-acc-item.is-open > .dsp-kk-acc-head .dsp-kk-acc-chevron { transform: rotate(180deg); }

/* Body ist "unsichtbar" für das Layout (display: contents) – die Buttons
   bleiben damit im Original-Grid der Zeile, inkl. aller Media-Queries. */
.dsp-kk .dsp-kk-acc-body { display: contents; }

/* Zugeklappt: alles außer Kopf- und Unterzeile verbergen */
.dsp-kk .dsp-kk-acc-item:not(.is-open) > :not(.dsp-kk-acc-head):not(.dsp-kk-acc-sub) {
    display: none !important;
}

.dsp-kk .dsp-kk-acc-item:not(.is-open)::before,
.dsp-kk .dsp-kk-acc-item:not(.is-open)::after {
    display: none !important;
}

/* Titel dunkel (statt Gold-Verlauf der Produkt-App) */
.dsp-kk .dsp-var-ui .dsp-var-row.dsp-kk-acc-item > .dsp-var-label.dsp-kk-acc-head,
.dsp-kk .dsp-var-ui .dsp-var-row.dsp-kk-acc-item.dsp-step--active > .dsp-var-label.dsp-kk-acc-head,
.dsp-kk .dsp-var-ui .dsp-var-row.dsp-kk-acc-item > .dsp-kk-acc-head .dsp-var-label-text {
    color: var(--kk-text) !important;
    -webkit-text-fill-color: currentColor !important;
    background: none !important;
    animation: none !important;
    text-shadow: none !important;
}

/* Gesperrte (noch nicht wählbare) Schritte */
.dsp-kk .dsp-var-ui .dsp-var-row.dsp-kk-acc-item.dsp-var-row--locked > .dsp-var-label.dsp-kk-acc-head,
.dsp-kk .dsp-var-ui .dsp-var-row.dsp-kk-acc-item.dsp-var-row--locked > .dsp-kk-acc-head .dsp-var-label-text {
    color: #a3aaa7 !important;
    -webkit-text-fill-color: currentColor !important;
    cursor: not-allowed;
}
.dsp-kk .dsp-kk-acc-item.dsp-var-row--locked .dsp-kk-acc-chevron { opacity: .35; }

/* Info-"i" bleibt auch bei gesperrten Schritten anklickbar */
.dsp-kk .dsp-var-row--locked .dsp-var-info-trigger,
.dsp-kk .dsp-var-row--locked .dsp-var-info-popup {
    pointer-events: auto !important;
    cursor: pointer;
}
.dsp-kk .dsp-var-row--locked .dsp-var-info-trigger {
    opacity: 1 !important;
    color: var(--kk-muted) !important;
    -webkit-text-fill-color: var(--kk-muted) !important;
    border-color: #b9c4c9 !important;
}
.dsp-kk .dsp-var-row--locked .dsp-var-info-popup {
    color: var(--kk-text) !important;
    -webkit-text-fill-color: var(--kk-text) !important;
    cursor: auto;
}

/* Farb-Kacheln: ohne Radio-Kreis, Auswahl mit grünem Haken oben rechts */
.dsp-kk .dsp-var-row--farbe .dsp-var-btn-check { display: none !important; }
.dsp-kk .dsp-var-row--farbe .dsp-var-btn {
    position: relative;
    overflow: visible !important;
}
.dsp-kk .dsp-var-row--farbe .dsp-var-btn-name { white-space: nowrap; }
.dsp-kk .dsp-var-row--farbe .dsp-var-btn.is-active {
    border-color: var(--kk-green) !important;
    box-shadow: 0 0 0 1.5px var(--kk-green) !important;
    background: var(--kk-green-soft) !important;
}
.dsp-kk .dsp-var-row--farbe .dsp-var-btn.is-active::after {
    content: "";
    position: absolute;
    z-index: 2;
    top: -7px;
    right: -7px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--kk-green-deep) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center / 12px no-repeat;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}

/* Auswahl-Kreise statt eckiger Checkboxen (übrige Schritte) */
.dsp-kk .dsp-var-btn-check { border-radius: 50% !important; }

/* ── Technische Details: eine Karte mit feinen Trennlinien ─────────── */
.dsp-kk .dsp-kk-acc > .dsp-var-row.dsp-kk-tech {
    margin: 0 !important;
    background: #fff !important;
    border: 1px solid var(--kk-line) !important;
    border-top: 0 !important;
    border-bottom: 1px solid #eef1f0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.dsp-kk .dsp-kk-acc > .dsp-var-row.dsp-kk-tech.dsp-kk-tech-first {
    margin-top: 10px !important;
    border-top: 1px solid var(--kk-line) !important;
    border-radius: 12px 12px 0 0 !important;
}
.dsp-kk .dsp-kk-acc > .dsp-var-row.dsp-kk-tech.dsp-kk-tech-last {
    border-bottom: 1px solid var(--kk-line) !important;
    border-radius: 0 0 12px 12px !important;
    margin-bottom: 4px !important;
}
.dsp-kk .dsp-kk-acc > .dsp-var-row.dsp-kk-tech.dsp-kk-tech-first.dsp-kk-tech-last {
    border-radius: 12px !important;
}

/* ── Mengenrabatt ────────────────────────────────────────────────────── */
.dsp-kk .dsp-kk-coupon {
    display: inline-flex;
    vertical-align: -4px;
    margin-right: 5px;
    color: var(--kk-green);
    transform: rotate(-10deg);
}
.dsp-kk .dsp-rabatt-box .dsp-rabatt-box__item .dsp-rabatt-box__discount,
.dsp-kk .dsp-rabatt-box span.dsp-rabatt-box__discount {
    font-size: .86rem !important;
    font-weight: 800 !important;
    color: var(--kk-green-deep) !important;
}
.dsp-kk .dsp-rabatt-box .dsp-rabatt-box__item .dsp-rabatt-box__qty,
.dsp-kk .dsp-rabatt-box span.dsp-rabatt-box__qty {
    font-weight: 500 !important;
    color: var(--kk-muted) !important;
}
.dsp-kk .dsp-rabatt-box {
    background: var(--kk-green-soft) !important;
    border: 1px solid #d3e8e0 !important;
    border-radius: var(--kk-radius) !important;
}
.dsp-kk .dsp-rabatt-box__discount {
    color: var(--kk-green-dark) !important;
    font-weight: 800 !important;
}

/* ── Kaufbereich ─────────────────────────────────────────────────────── */
.dsp-kk .dsp-kk-atc .dsp-purchase-meta__total .dsp-purchase-meta__amount {
    color: var(--kk-text) !important;
    font-weight: 800 !important;
}
/* Versandbetrag nicht mehr direkt am Preis – steht im Pop-up */
.dsp-kk .dsp-kk-atc .dsp-purchase-meta__shipping-note {
    display: none !important;
}
.dsp-kk .dsp-kk-total-tax {
    display: block;
    font-size: .78rem;
    color: var(--kk-muted);
    text-align: right;
}

/* Warenkorb-Button volle Breite, "Für Planer merken" darunter */
.dsp-kk .dsp-kk-atc .dsp-btn-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}
.dsp-kk .dsp-kk-atc .dsp-btn-row > * {
    width: 100% !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
}
.dsp-kk .dsp-kk-atc .single_add_to_cart_button {
    min-height: 56px;
    border-radius: 12px !important;
    background: linear-gradient(180deg, #2f8f7c 0%, var(--kk-green-deep) 100%) !important;
    color: #fff !important;
    font-size: 1.08rem !important;
    font-weight: 800 !important;
    letter-spacing: .04em;
    box-shadow: 0 6px 16px rgba(15, 79, 67, .25);
}
.dsp-kk .dsp-kk-atc .single_add_to_cart_button.disabled,
.dsp-kk .dsp-kk-atc .single_add_to_cart_button:disabled {
    opacity: .55 !important;
    box-shadow: none;
}
.dsp-kk .dsp-kk-atc .dsp-planer-btn {
    min-height: 46px;
    border-radius: 12px !important;
}

/* Pflichthinweis */
.dsp-kk .dsp-kk-legal {
    margin: 10px 0 4px !important;
    font-size: .8rem;
    line-height: 1.4;
    color: var(--kk-muted);
    text-align: center;
}
.dsp-kk .dsp-kk-legal__link {
    padding: 0;
    border: 0;
    background: none;
    color: var(--kk-green-dark);
    font: inherit;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}
.dsp-kk .dsp-kk-legal__link:hover { color: var(--kk-green-deep); }

/* ── Versandkosten-Pop-up ────────────────────────────────────────────── */
html.dsp-kk-modal-open { overflow: hidden; }

.dsp-kk-modal {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    font-family: var(--font, 'Montserrat', sans-serif);
}
.dsp-kk-modal[hidden] { display: none; }

.dsp-kk-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(20, 28, 26, .55);
    animation: dspKkFade .15s ease;
}

.dsp-kk-modal__dialog {
    position: relative;
    width: 100%;
    max-width: 480px;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    overflow: auto;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .25);
    animation: dspKkPop .18s ease;
    outline: none;
}

.dsp-kk-modal__head {
    position: sticky;
    top: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 18px;
    background: #fff;
    border-bottom: 1px solid #e3e8e6;
}
.dsp-kk-modal__icon { display: inline-flex; color: #2a7d6f; }
.dsp-kk-modal__title {
    flex: 1;
    margin: 0 !important;
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    color: #2d2d2d;
}
.dsp-kk-modal__close {
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f0f2f1;
    color: #2d2d2d;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
}
.dsp-kk-modal__close:hover { background: #e3e8e6; }

.dsp-kk-modal__body { padding: 6px 18px 18px; color: #2d2d2d; }

.dsp-kk-ship-zone + .dsp-kk-ship-zone { margin-top: 10px; }
.dsp-kk-ship-zone__title {
    margin: 14px 0 4px !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #6b7471;
}

.dsp-kk-ship-method { padding: 10px 0; border-bottom: 1px solid #eef1f0; }
.dsp-kk-ship-method:last-child { border-bottom: 0; }
.dsp-kk-ship-method__title { font-weight: 700; margin-bottom: 6px; }
.dsp-kk-ship-method__note { margin: 12px 0 0 !important; font-size: .78rem; color: #6b7471; }

.dsp-kk-ship-list { list-style: none; margin: 0 !important; padding: 0 !important; }
.dsp-kk-ship-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: .95rem;
}
.dsp-kk-ship-row + .dsp-kk-ship-row { margin-top: 2px; }
.dsp-kk-ship-row { border: 1px solid #eef1f0; }
.dsp-kk-ship-row + .dsp-kk-ship-row { margin-top: 6px; }
.dsp-kk-ship-row.is-mine { background: #eaf5f1; border-color: #b9d9cf; }
.dsp-kk-ship-row__label { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; }
.dsp-kk-ship-row__name { font-weight: 600; }
.dsp-kk-ship-row__sub { flex-basis: 100%; font-size: .78rem; color: #6b7471; }
.dsp-kk-ship-row__price { font-weight: 700; white-space: nowrap; }
.dsp-kk-ship-row__tag {
    display: inline-block;
    padding: 1px 7px;
    border-radius: 999px;
    background: #0f4f43;
    color: #fff;
    font-size: .7rem;
    font-weight: 700;
    vertical-align: 1px;
}

.dsp-kk-modal__foot {
    margin: 14px 0 0 !important;
    font-size: .8rem;
    color: #6b7471;
}
.dsp-kk-modal__foot a { color: #17594d; font-weight: 600; }
.dsp-kk-modal__empty { margin: 12px 0 !important; }

@keyframes dspKkFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes dspKkPop { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
    .dsp-kk-modal__backdrop,
    .dsp-kk-modal__dialog { animation: none; }
}

@media (max-width: 600px) {
    .dsp-kk-modal { align-items: flex-end; padding: 0; }
    .dsp-kk-modal__dialog {
        max-width: none;
        border-radius: 16px 16px 0 0;
        max-height: 85vh;
        max-height: 85dvh;
    }
}

/* Stern-Grafik optisch zentrieren (die Sternform sitzt in der SVG etwas
   oberhalb der Mitte) */
body.single-product .dsp-kk .dsp-kk-star .dsp-title-star::before {
    transform: translateY(2.5px) !important;
}

/* ── Qualitäts-Badge oben rechts im Produktbild ─────────────────────── */
.dsp-kk.dsp-kk-has-quality .dsp-product-subtitle { display: none !important; }

.dsp-kk-active .woocommerce-product-gallery > .dsp-kk-quality {
    position: absolute;
    z-index: 6;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 11px 5px 9px;
    background: rgba(255, 255, 255, .88);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(196, 167, 125, .45);
    border-radius: 999px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .10);
    font-family: var(--font, 'Montserrat', sans-serif);
    line-height: 1;
    pointer-events: none;
    white-space: nowrap;
}
.dsp-kk-active .dsp-kk-quality__stars {
    font-size: .72rem;
    letter-spacing: .5px;
    color: #c9a24a;
    text-shadow: 0 0 1px rgba(150, 110, 30, .25);
}
.dsp-kk-active .dsp-kk-quality__label {
    font-size: .72rem;
    font-weight: 600;
    color: #3d4347;
}
@media (max-width: 600px) {
    .dsp-kk-active .woocommerce-product-gallery > .dsp-kk-quality { top: 8px; right: 8px; padding: 4px 9px 4px 7px; }
    .dsp-kk-active .dsp-kk-quality__stars,
    .dsp-kk-active .dsp-kk-quality__label { font-size: .66rem; }
}

/* ── Vertrauens-Symbole zwischen Untertitel und Preis-Karte ─────────── */
.dsp-kk .dsp-kk-trust {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 18px 0 4px !important;
    padding: 18px 0 0 !important;
    border-top: 1.5px solid #bcc6c2;
    list-style: none !important;
}
.dsp-kk .dsp-kk-trust__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    margin: 0 !important;
    padding: 0 6px;
    text-align: center;
    list-style: none !important;
}
.dsp-kk .dsp-kk-trust__item + .dsp-kk-trust__item {
    border-left: 1px solid #e6e9e7;
}
.dsp-kk .dsp-kk-trust__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
}
.dsp-kk .dsp-kk-trust__icon svg { width: 21px; height: 21px; }
.dsp-kk .dsp-kk-trust__item--gold .dsp-kk-trust__icon {
    background: #f5ecd9;
    color: #a07a32;
    box-shadow: inset 0 0 0 1px #ecdcb8;
}
.dsp-kk .dsp-kk-trust__item--green .dsp-kk-trust__icon {
    background: #e2f1eb;
    color: #2a7d6f;
    box-shadow: inset 0 0 0 1px #cde6dc;
}
.dsp-kk .dsp-kk-trust__text {
    font-size: .72rem;
    font-weight: 600;
    line-height: 1.3;
    color: #3d4347;
}

/* ══ Kopfbereich v2: links Titel/Untertitel/Artikelnummer, rechts Preis ══ */
.dsp-kk .dsp-kk-head.dsp-kk-toprow {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 204px;
    gap: 14px;
    align-items: start;
    margin: 0 0 18px;
}
.dsp-kk .dsp-kk-head__left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}
.dsp-kk .dsp-kk-head__left .product_title {
    margin: 0 !important;
}
.dsp-kk .dsp-kk-head__left .dsp-kk-sku {
    margin: 12px 0 0 !important;
    max-width: 100%;
    flex-wrap: wrap;
    row-gap: 2px;
}

/* Preis-Karte: schmal & hoch, oben rechts mit Abstand */
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap {
    width: auto;
    max-width: none;
    align-self: start;
    margin: 16px 8px 0 0;
}
.dsp-kk .dsp-kk-head .dsp-kk-pricecard {
    padding: 16px 14px 14px;
}
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price__amount,
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price__amount .price,
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price__amount .woocommerce-Price-amount {
    font-size: 1.95rem !important;
}
.dsp-kk .dsp-kk-pricecard__foot--stack {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 9px;
    margin-top: 12px;
}
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-meter-pill {
    align-self: flex-start;
    margin: 0 !important;
}
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-ship-btn {
    width: 100% !important;
    margin: 4px 0 0 !important;
    justify-content: flex-start;
}
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-deliv {
    justify-content: flex-start;
    padding: 0 2px;
}

/* Schmale Ansicht: untereinander, Karte volle Breite */
@media (max-width: 420px) {
    .dsp-kk .dsp-kk-head.dsp-kk-toprow { grid-template-columns: minmax(0, 1fr); }
    .dsp-kk .dsp-kk-head .dsp-kk-pricewrap { margin: 6px 8px 0 0; }
}
.dsp-kk .dsp-kk-head__left > * { order: 0 !important; }
.dsp-kk .dsp-kk-head__left .product_title .dsp-title-main {
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
    -webkit-hyphens: auto;
    hyphens: auto;
    overflow-wrap: anywhere;
}
.dsp-kk .dsp-kk-head__left .product_title .dsp-title-rest {
    font-size: .86rem !important;
    line-height: 1.45 !important;
    margin-top: 6px;
}
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-ship-btn {
    gap: 4px;
    padding: 6px 7px;
    font-size: .68rem;
}
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-ship-btn__icon svg { width: 13px; height: 13px; }
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-ship-btn { padding: 6px 5px 6px 6px; gap: 3px; }
.dsp-kk .dsp-kk-head__left .dsp-kk-sku { border-radius: 12px; padding: 6px 12px 6px 10px; }

/* Artikelnummer ohne Rahmen/Hintergrund, mit Trennlinie zum Untertitel */
.dsp-kk .dsp-kk-head__left .dsp-kk-sku {
    align-self: stretch;
    margin: 12px 0 0 !important;
    padding: 10px 0 0 !important;
    background: none !important;
    border: 0 !important;
    border-top: 1px solid #d5dbd8 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Preis-Karte etwas tiefer setzen (beginnt auf Höhe des Untertitels) */
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap { margin-top: 46px; }
@media (max-width: 420px) {
    .dsp-kk .dsp-kk-head .dsp-kk-pricewrap { margin-top: 6px; }
}
.dsp-kk .dsp-kk-sku__icon { display: none !important; }
.dsp-kk .dsp-kk-sku .dsp-kk-sku__label {
    text-transform: none;
    letter-spacing: 0;
    font-size: .74rem;
    font-weight: 500;
}

/* Trennlinie unter dem Untertitel in Gold */
.dsp-kk .dsp-kk-head__left .dsp-kk-sku { border-top: 1px solid #d6bd85 !important; }

/* "ab" steht klein über dem Preis, damit Preis und "/ Matte" immer in
   einer Zeile bleiben */
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price {
    flex-wrap: wrap;
    row-gap: 0;
}
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price__lead {
    flex: 0 0 100%;
    margin: 0 0 -2px !important;
    font-size: .76rem !important;
    line-height: 1.2 !important;
}
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price__amount,
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price__side {
    white-space: nowrap;
}
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price__amount,
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price__amount .price,
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-matte-header-price__amount .woocommerce-Price-amount {
    font-size: 1.8rem !important;
}
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-deliv { justify-content: flex-end; align-self: flex-end; }

/* Mengenrabatt: Überschrift darf umbrechen, Münz-Symbole statt Icons */
.dsp-kk .dsp-rabatt-box__title {
    white-space: normal !important;
    overflow-wrap: anywhere;
    font-size: .8rem !important;
    line-height: 1.4 !important;
}
.dsp-kk .dsp-rabatt-box { overflow: hidden; }
.dsp-kk .dsp-rabatt-box__icon.dsp-kk-coins {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    width: 24px !important;
    height: 24px !important;
    background: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: inherit !important;
    font-size: 0 !important;
}
.dsp-kk .dsp-rabatt-box__icon.dsp-kk-coins::before,
.dsp-kk .dsp-rabatt-box__icon.dsp-kk-coins::after { content: none !important; display: none !important; }
.dsp-kk .dsp-rabatt-box__icon.dsp-kk-coins svg { width: 24px; height: 24px; display: block; }
.dsp-kk .dsp-kk-rabatt-sub {
    display: block;
    margin: 1px 0 0 25px;
    font-size: .72rem;
    font-weight: 400;
    color: var(--kk-muted);
}
.dsp-kk .dsp-rabatt-box__icon.dsp-kk-coins,
.dsp-kk .dsp-rabatt-box__icon.dsp-kk-coins svg { width: 28px !important; height: 28px !important; flex-basis: 28px; }
.dsp-kk .dsp-rabatt-box__item { align-items: center !important; }
/* Rabatt-Spalten optisch mittig (minimal nach links) */
.dsp-kk .dsp-rabatt-box .dsp-rabatt-box__list {
    transform: translateX(-6px);
}
.dsp-kk .dsp-kk-rabatt-sub { display: inline; margin: 0 0 0 3px; }
/* Mengenrabatt: etwas größere Schrift */
.dsp-kk .dsp-rabatt-box__title { font-size: .9rem !important; }
.dsp-kk .dsp-rabatt-box__title .dsp-kk-rabatt-sub { font-size: .84rem; }
.dsp-kk .dsp-rabatt-box .dsp-rabatt-box__item .dsp-rabatt-box__qty,
.dsp-kk .dsp-rabatt-box span.dsp-rabatt-box__qty { font-size: .78rem !important; }
.dsp-kk .dsp-rabatt-box .dsp-rabatt-box__item .dsp-rabatt-box__discount,
.dsp-kk .dsp-rabatt-box span.dsp-rabatt-box__discount { font-size: .92rem !important; }
.dsp-kk .dsp-rabatt-box .dsp-rabatt-box__item { padding-left: 5px !important; padding-right: 4px !important; gap: 5px !important; }
.dsp-kk .dsp-rabatt-box__icon.dsp-kk-coins,
.dsp-kk .dsp-rabatt-box__icon.dsp-kk-coins svg { width: 24px !important; height: 24px !important; flex-basis: 24px; }
.dsp-kk .dsp-rabatt-box .dsp-rabatt-box__item .dsp-rabatt-box__qty,
.dsp-kk .dsp-rabatt-box span.dsp-rabatt-box__qty { font-size: .75rem !important; white-space: nowrap; }
.dsp-kk .dsp-rabatt-box .dsp-rabatt-box__text { min-width: 0; }

/* ══ Farbtausch: Preis-Karte grün, schräge Fläche gold ══ */
.dsp-kk .dsp-kk-pricewrap::before {
    background: linear-gradient(135deg, #e3c98d 0%, #c4a462 55%, #b08a34 100%) !important;
    opacity: 1 !important;
}
.dsp-kk .dsp-kk-pricecard {
    background: linear-gradient(160deg, #1d6a5b 0%, #0f4f43 100%) !important;
    border-color: #0c4339 !important;
    box-shadow: 0 10px 24px rgba(15, 79, 67, .22), 0 1px 3px rgba(0, 0, 0, .08) !important;
}
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__amount,
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__amount .price,
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__amount .woocommerce-Price-amount,
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__amount bdi {
    color: #fff !important;
}
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__lead,
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__unit {
    color: #cfe5dc !important;
}
.dsp-kk .dsp-kk-pricecard .dsp-kk-meter-pill {
    background: #ead6a4;
    color: #0f4f43;
}
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn {
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .35);
    color: #fff;
}
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn:hover,
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn:focus-visible {
    background: rgba(255, 255, 255, .16);
    border-color: #ead6a4;
}
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn__icon { color: #ead6a4; }
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn__more { color: #ead6a4; }
.dsp-kk .dsp-kk-pricecard .dsp-kk-deliv { color: #cfe5dc; }
.dsp-kk .dsp-kk-pricecard .dsp-kk-deliv__icon { color: #ead6a4; }
.dsp-kk .dsp-kk-pricewrap::before {
    background: linear-gradient(135deg, #faf1dc 0%, #f1e2bd 55%, #e8d39f 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(196, 167, 98, .25);
}

/* ══ Preis-Karte in Anthrazit (Seitenfarbe), Gold bleibt ══ */
.dsp-kk .dsp-kk-pricecard {
    background: linear-gradient(160deg, #4a5155 0%, var(--anthrazit, #3d4347) 55%, #33393c 100%) !important;
    border-color: #2f3437 !important;
    box-shadow: 0 10px 24px rgba(30, 34, 36, .25), 0 1px 3px rgba(0, 0, 0, .08) !important;
}
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__lead,
.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price__unit,
.dsp-kk .dsp-kk-pricecard .dsp-kk-deliv { color: #d3d8da !important; }
.dsp-kk .dsp-kk-pricecard .dsp-kk-meter-pill { color: var(--anthrazit, #3d4347); }
/* Versandkosten-Button in Grün */
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn {
    background: linear-gradient(160deg, #2f8f7c 0%, #1d6a5b 100%) !important;
    border-color: #2a7d6f !important;
    color: #fff !important;
}
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn:hover,
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn:focus-visible {
    background: linear-gradient(160deg, #35a08a 0%, #217563 100%) !important;
    border-color: #ead6a4 !important;
}

/* Merk-Stern oben rechts in der Ecke der Kachel-Spalte */
.dsp-kk.summary { position: relative; }
.dsp-kk > .dsp-title-star-wrap.dsp-kk-star {
    top: 14px !important;
    right: 14px !important;
}

/* Pastellgoldene Fläche guckt oben links hinter der Preis-Karte hervor */
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap::before {
    inset: -9px 38% 42% -9px !important;
    transform: rotate(-4deg) !important;
    transform-origin: 30% 30% !important;
}
/* Größere pastellgoldene Fläche (oben links) */
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap::before {
    inset: -16px 26% 30% -16px !important;
}
/* Inhalt etwas tiefer, Stern bleibt oben in der Ecke */
.dsp-kk .dsp-kk-head.dsp-kk-toprow { margin-top: 26px !important; }

/* ══ Preis-Karte breiter als hoch ══ */
.dsp-kk .dsp-kk-head.dsp-kk-toprow { grid-template-columns: minmax(0, 1fr) 222px; gap: 12px; }
.dsp-kk .dsp-kk-head .dsp-kk-pricecard { padding: 13px 14px 12px; }
.dsp-kk .dsp-kk-pricecard__foot--stack {
    display: grid !important;
    grid-template-columns: auto 1fr;
    grid-template-areas: "pill deliv" "btn btn";
    align-items: center;
    gap: 8px 8px;
    margin-top: 9px;
}
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-meter-pill { grid-area: pill; }
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-deliv { grid-area: deliv; justify-self: end; align-self: center; }
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-ship-btn { grid-area: btn; margin: 0 !important; }
/* Ohne Meterpreis (Pfosten/Tore/Sichtschutz): Lieferzeit rechts in Zeile 1 */
.dsp-kk .dsp-kk-pricecard__foot--stack:not(:has(.dsp-kk-meter-pill)) { grid-template-areas: "deliv deliv" "btn btn"; }

/* Versandkosten: nur grüne Umrandung, flacher */
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn {
    background: transparent !important;
    border: 1px solid #3aa58e !important;
    padding: 4px 8px !important;
    min-height: 0;
    line-height: 1.15;
    border-radius: 7px;
}
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn:hover,
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn:focus-visible {
    background: rgba(58, 165, 142, .14) !important;
    border-color: #4fc0a6 !important;
}
.dsp-kk .dsp-kk-pricecard .dsp-kk-ship-btn__more { margin-left: auto; }
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-meter-pill { padding: 3px 8px; font-size: .76rem; gap: 4px; }
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-deliv { font-size: .68rem; gap: 4px; padding: 0; }
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-deliv__icon svg { width: 12px; height: 12px; }
.dsp-kk .dsp-kk-head__left .product_title .dsp-title-main {
    font-size: 1.06rem !important;
    -webkit-hyphens: manual;
    hyphens: manual;
    overflow-wrap: normal;
}
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap { margin-right: 0 !important; }
.dsp-kk .dsp-kk-head .dsp-kk-pricecard { padding: 13px 11px 12px 12px; }
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-meter-pill svg { display: none; }

/* ══ Titel eine Zeile über volle Breite, Untertitel links ══ */
.dsp-kk .dsp-kk-head .dsp-kk-head__title {
    grid-column: 1 / -1;
    margin: 0 !important;
    white-space: nowrap;
}
.dsp-kk .dsp-kk-head .dsp-kk-head__title .dsp-title-main {
    font-size: 1.22rem !important;
    white-space: nowrap;
}
.dsp-kk .dsp-kk-head__sub { margin: 0 !important; }
.dsp-kk .dsp-kk-head__sub .dsp-title-rest {
    display: block;
    margin: 0 !important;
    font-size: .86rem !important;
    line-height: 1.45 !important;
}
.dsp-kk .dsp-kk-head.dsp-kk-toprow { row-gap: 10px; }
/* Dunkle Kachel etwas tiefer */
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap { margin-top: 22px !important; }

/* Lieferzeit ganz unten in der Kachel */
.dsp-kk .dsp-kk-pricecard__foot--stack { grid-template-areas: "pill pill" "btn btn" "deliv deliv" !important; }
.dsp-kk .dsp-kk-pricecard__foot--stack:not(:has(.dsp-kk-meter-pill)) { grid-template-areas: "btn btn" "deliv deliv" !important; }
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-meter-pill { justify-self: start; }
.dsp-kk .dsp-kk-pricecard__foot--stack .dsp-kk-deliv { justify-self: end; margin-top: -2px; }
@media (max-width: 420px) {
    .dsp-kk .dsp-kk-head .dsp-kk-head__title,
    .dsp-kk .dsp-kk-head .dsp-kk-head__title .dsp-title-main { white-space: normal; }
    .dsp-kk .dsp-kk-head .dsp-kk-pricewrap { margin-top: 6px !important; }
}
.dsp-kk .dsp-kk-head > .dsp-kk-head__title { order: -1 !important; }
.dsp-kk .dsp-kk-head > .dsp-kk-head__left,
.dsp-kk .dsp-kk-head > .dsp-kk-pricewrap { order: 0 !important; }
.dsp-kk .dsp-kk-head > .dsp-kk-head__left { position: relative; z-index: 2; }

/* Pastellgold-Fläche guckt oben RECHTS hinter der dunklen Kachel hervor */
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap::before {
    inset: -16px -10px 30% 26% !important;
    transform: rotate(4deg) !important;
    transform-origin: 70% 30% !important;
}
/* Untertitel im Blocksatz (mit Silbentrennung gegen große Lücken) */
.dsp-kk .dsp-kk-head__sub .dsp-title-rest {
    text-align: justify;
    text-justify: inter-word;
    -webkit-hyphens: auto;
    hyphens: auto;
}

/* Untertitel etwas tiefer; Artikelnummer schließt unten bündig mit der Kachel ab */
.dsp-kk .dsp-kk-head.dsp-kk-toprow { align-items: stretch; }
.dsp-kk .dsp-kk-head > .dsp-kk-pricewrap { align-self: start; }
.dsp-kk .dsp-kk-head__sub { margin-top: 10px !important; }
.dsp-kk .dsp-kk-head__left .dsp-kk-sku { margin-top: auto !important; }
.dsp-kk .dsp-kk-head__left .dsp-kk-head__sub { margin-bottom: 12px !important; }
/* Kachel unten bündig mit der Artikelnummer – egal welche Spalte höher ist */
.dsp-kk .dsp-kk-head > .dsp-kk-pricewrap { align-self: end !important; }

/* Pastellgold-Fläche tiefer, guckt nur noch leicht oben rechts heraus */
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap::before {
    inset: -7px -9px 26% 30% !important;
}

/* Untertitel linksbündig */
.dsp-kk .dsp-kk-head__sub .dsp-title-rest {
    text-align: left !important;
    -webkit-hyphens: manual !important;
    hyphens: manual !important;
}

/* Untertitel beginnt auf Höhe der Kachel-Oberkante; Kachel streckt sich
   bis zur Unterkante der Artikelnummer (oben UND unten bündig) */
.dsp-kk .dsp-kk-head.dsp-kk-toprow { row-gap: 16px; }
.dsp-kk .dsp-kk-head > .dsp-kk-pricewrap {
    align-self: stretch !important;
    margin-top: 0 !important;
    display: flex;
}
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap > .dsp-kk-pricecard {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-kk-pricecard__foot { margin-top: auto !important; padding-top: 9px; }
.dsp-kk .dsp-kk-head__sub { margin-top: 0 !important; }
.dsp-kk .dsp-kk-head__sub .dsp-title-rest { margin-top: 0 !important; }
.dsp-kk .dsp-kk-head .dsp-kk-pricecard > * { order: 0 !important; }
/* Inhalt der gestreckten Kachel senkrecht mittig statt Lücke in der Mitte */
.dsp-kk .dsp-kk-head .dsp-kk-pricewrap > .dsp-kk-pricecard { justify-content: center; }
.dsp-kk .dsp-kk-head .dsp-kk-pricecard .dsp-kk-pricecard__foot { margin-top: 0 !important; padding-top: 10px; }
/* Titel höher */
.dsp-kk .dsp-kk-head.dsp-kk-toprow { margin-top: 4px !important; }
/* Stern wieder oben rechts an der dunklen Kachel */
.dsp-kk .dsp-kk-pricecard > .dsp-title-star-wrap.dsp-kk-star {
    top: -11px !important;
    right: -11px !important;
}
.dsp-kk .dsp-kk-pricecard > .dsp-title-star-wrap.dsp-kk-star { top: -5px !important; right: -5px !important; }
.dsp-kk .dsp-kk-head.dsp-kk-toprow { row-gap: 24px !important; }
.dsp-kk .dsp-kk-pricecard > .dsp-title-star-wrap.dsp-kk-star { top: 9px !important; right: 9px !important; }
.dsp-kk .dsp-kk-head .dsp-kk-head__title .dsp-title-main { line-height: 1.22 !important; }

/* ══ Kopf v4: Titel + Untertitel volle Breite, darunter SKU (unten) | Kachel ══ */
.dsp-kk .dsp-kk-head > .dsp-kk-head__sub {
    grid-column: 1 / -1;
    order: -1 !important;
    margin: -14px 0 0 !important;   /* direkt unter den Titel (row-gap ausgleichen) */
}
.dsp-kk .dsp-kk-head > .dsp-kk-head__title { order: -2 !important; }
.dsp-kk .dsp-kk-head > .dsp-kk-head__sub .dsp-title-rest { max-width: none; }
.dsp-kk .dsp-kk-head .dsp-kk-head__title .dsp-title-main { white-space: nowrap; }
.dsp-kk .dsp-kk-head__left .dsp-kk-sku { margin-top: auto !important; }

/* ══ Mengenrabatt kompakt links neben der dunklen Kachel ══ */
.dsp-kk.dsp-kk-has-rabatt-mini .dsp-rabatt-box { display: none !important; }
.dsp-kk .dsp-kk-head__left .dsp-kk-sku { margin-top: 0 !important; }
.dsp-kk .dsp-kk-rabatt-mini {
    margin: auto 0 14px !important;
    padding: 0;
}
.dsp-kk .dsp-kk-rabatt-mini__head {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 7px;
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--kk-text);
}
.dsp-kk .dsp-kk-rabatt-mini__icon { display: inline-flex; color: #b0935f; transform: rotate(-10deg); }
.dsp-kk .dsp-kk-rabatt-mini__icon svg { width: 15px; height: 15px; }
.dsp-kk .dsp-kk-rabatt-mini__list {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}
.dsp-kk .dsp-kk-rabatt-mini__row {
    display: grid;
    grid-template-columns: 22px 1fr auto;
    align-items: center;
    gap: 6px;
    margin: 0 !important;
    padding: 4px 0;
    list-style: none !important;
    border-bottom: 1px dashed #e4dcc8;
}
.dsp-kk .dsp-kk-rabatt-mini__row:last-child { border-bottom: 0; }
.dsp-kk .dsp-kk-rabatt-mini__coins { display: inline-flex; }
.dsp-kk .dsp-kk-rabatt-mini__coins svg { width: 22px; height: 22px; }
.dsp-kk .dsp-kk-rabatt-mini__qty {
    font-size: .74rem;
    color: var(--kk-muted);
    white-space: nowrap;
}
.dsp-kk .dsp-kk-rabatt-mini__disc {
    font-size: .84rem;
    font-weight: 800;
    color: var(--kk-green-deep);
    white-space: nowrap;
}
.dsp-kk .dsp-kk-rabatt-mini__note {
    margin-top: 5px;
    font-size: .66rem;
    color: var(--kk-muted);
}
.dsp-kk .dsp-kk-rabatt-mini__row { padding: 2px 0; gap: 5px; grid-template-columns: 20px 1fr auto; }
.dsp-kk .dsp-kk-rabatt-mini__coins svg { width: 20px; height: 20px; }
.dsp-kk .dsp-kk-rabatt-mini__qty { font-size: .72rem; }
.dsp-kk .dsp-kk-rabatt-mini__head { margin-bottom: 4px; }
.dsp-kk .dsp-kk-rabatt-mini__note { margin-top: 3px; }
.dsp-kk .dsp-kk-rabatt-mini { margin-bottom: 10px !important; }

/* ══ Kaufbereich v3: ohne Kachel, feine Goldlinie, Länge + Einzel-/Gesamtpreis ══ */
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init {
    background: none !important;
    border: 0 !important;
    border-top: 1px solid #d6bd85 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 18px 2px 0 !important;
    margin-top: 6px !important;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init::before,
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init::after { display: none !important; }

html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-purchase-meta {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-purchase-meta__label {
    display: block !important;
    margin: 0 0 6px !important;
    font-size: .68rem !important;
    font-weight: 600 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: var(--kk-muted) !important;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-purchase-meta__label::after { display: none !important; }

/* Mengen-Stepper: niedrig, schmal, dezent */
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity {
    position: relative !important;
    display: inline-flex !important;
    align-items: stretch !important;
    width: auto !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #d9dfdd !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: none !important;
    overflow: hidden;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity input.qty {
    order: 1;
    width: 44px !important;
    height: 34px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-left: 1px solid #eceff0 !important;
    border-right: 1px solid #eceff0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    font-size: .95rem !important;
    font-weight: 700 !important;
    color: var(--kk-text) !important;
    text-align: center !important;
    -moz-appearance: textfield;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity input.qty::-webkit-outer-spin-button,
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity .dsp-qty-arrow {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 34px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    color: var(--kk-muted) !important;
    cursor: pointer;
    transition: background .15s, color .15s;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity .dsp-qty-arrow--down { order: 0; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity .dsp-qty-arrow--up { order: 2; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity .dsp-qty-arrow::before {
    position: static !important;
    transform: none !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    color: inherit !important;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity .dsp-qty-arrow::after { display: none !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity .dsp-qty-arrow:hover { background: #f3f5f4 !important; color: var(--kk-text) !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity .dsp-qty-arrow:focus-visible { outline: 2px solid #3aa58e; outline-offset: -2px; }

/* Länge unter der Menge */
.dsp-kk .dsp-kk-qty-len {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 7px;
    font-size: .76rem;
    line-height: 1.2;
    color: var(--kk-muted);
    white-space: nowrap;
}
.dsp-kk .dsp-kk-qty-len[hidden] { display: none; }
.dsp-kk .dsp-kk-qty-len strong { color: var(--kk-green-dark); font-weight: 700; }
.dsp-kk .dsp-kk-qty-len__icon { display: inline-flex; color: #3aa58e; }

/* Gesamtpreis rechts */
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-purchase-meta__total {
    text-align: right !important;
    align-items: flex-end !important;
    min-width: 0;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-purchase-meta__total > :not(.dsp-kk-sum) { display: none !important; }
.dsp-kk .dsp-kk-sum { display: flex; flex-direction: column; align-items: flex-end; }
.dsp-kk .dsp-kk-sum__label {
    margin-bottom: 4px;
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--kk-muted);
    white-space: nowrap;
}
.dsp-kk .dsp-kk-sum__count { letter-spacing: .02em; text-transform: none; font-weight: 500; }
.dsp-kk .dsp-kk-sum__old {
    font-size: .78rem;
    color: var(--kk-muted);
    text-decoration: line-through;
    line-height: 1.1;
}
.dsp-kk .dsp-kk-sum__old:empty { display: none; }
.dsp-kk .dsp-kk-sum__amount {
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -.01em;
    color: #3d4347;
    white-space: nowrap;
}
.dsp-kk .dsp-kk-sum.has-discount .dsp-kk-sum__amount { color: var(--kk-green-dark); }
.dsp-kk .dsp-kk-sum__unit {
    margin-top: 4px;
    font-size: .76rem;
    color: var(--kk-muted);
    white-space: nowrap;
}
.dsp-kk .dsp-kk-sum__unit strong { color: var(--kk-text); font-weight: 600; }

/* Mengenrabatt-Zeile */
.dsp-kk .dsp-kk-rabatt-line {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 14px 0 0;
    padding: 8px 11px;
    border-radius: 9px;
    background: #faf5e8;
    border: 1px solid #efe2c2;
    font-size: .78rem;
    line-height: 1.3;
    color: #6b5a33;
}
.dsp-kk .dsp-kk-rabatt-line[hidden] { display: none; }
.dsp-kk .dsp-kk-rabatt-line__icon { display: inline-flex; color: #c4a25a; }
.dsp-kk .dsp-kk-rabatt-line__icon svg { width: 15px; height: 15px; }
.dsp-kk .dsp-kk-rabatt-line strong { font-weight: 700; }
.dsp-kk .dsp-kk-rabatt-line.is-active {
    background: var(--kk-green-soft);
    border-color: #cfe5dc;
    color: var(--kk-green-dark);
}
.dsp-kk .dsp-kk-rabatt-line.is-active .dsp-kk-rabatt-line__icon { color: #3aa58e; }
.dsp-kk .dsp-kk-rabatt-line.is-active strong { margin-left: auto; }

/* Buttons */
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-atc-row,
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init > .dsp-btn-row { margin-top: 14px !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-btn-row { gap: 8px !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .single_add_to_cart_button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px;
    min-height: 52px !important;
    height: auto !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, #1d6a5b 0%, #0f4f43 100%) !important;
    color: #fff !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    letter-spacing: .01em !important;
    text-transform: none !important;
    box-shadow: 0 6px 16px rgba(15, 79, 67, .22) !important;
    transition: transform .15s, box-shadow .15s, filter .15s;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .single_add_to_cart_button::before {
    content: "";
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2.5 3.5h2.6l2.3 11.2a1.6 1.6 0 0 0 1.6 1.3h8.6a1.6 1.6 0 0 0 1.6-1.2l1.6-7.3H6.2'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2.5 3.5h2.6l2.3 11.2a1.6 1.6 0 0 0 1.6 1.3h8.6a1.6 1.6 0 0 0 1.6-1.2l1.6-7.3H6.2'/%3E%3C/svg%3E") center / contain no-repeat;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .single_add_to_cart_button:not(.disabled):not(:disabled):hover {
    transform: translateY(-1px);
    filter: brightness(1.06);
    box-shadow: 0 9px 20px rgba(15, 79, 67, .28) !important;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .single_add_to_cart_button.disabled,
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .single_add_to_cart_button:disabled {
    opacity: 1 !important;
    background: #b9c9c4 !important;
    box-shadow: none !important;
    cursor: not-allowed;
}

/* "Für Planer merken" als dezenter Textlink */
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-planer-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px;
    width: auto !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 2px auto 0 !important;
    padding: 6px 8px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: none !important;
    box-shadow: none !important;
    color: var(--kk-muted) !important;
    font-size: .82rem !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    opacity: 1 !important;
    align-self: center !important;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-btn-row > .dsp-planer-btn { width: auto !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-planer-btn::before { color: #c9a95e !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-planer-btn:not(.disabled):hover { color: var(--kk-text) !important; background: #f3f5f4 !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-planer-btn.disabled { opacity: .55 !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-planer-btn__label { text-decoration: none !important; }

/* Pflichthinweis + Häkchen */
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-kk-legal { margin: 4px 0 0 !important; font-size: .74rem; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-purchase-assurance { display: none !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .dsp-purchase-meta__qty {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    min-width: 0;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity .screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity { width: auto !important; min-width: 0 !important; }
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .quantity input.qty {
    position: static !important;
    inset: auto !important;
    flex: 0 0 44px !important;
    transform: none !important;
}
html body.dsp-kk-active .summary.dsp-kk form.cart .dsp-atc-wrap.dsp-kk-atc.dsp-kk-calc-init .single_add_to_cart_button::before {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    border: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

/* Original-Artikelnummer der Produkt-App überall ausblenden (eigene steht links neben der Kachel) –
   beim Sichtschutz hängt die App sie nachträglich in den Kopf. */
.dsp-kk.dsp-kk-has-info .dsp-product-sku { display: none !important; }
/* Ohne Mengenrabatt-Liste (Pfosten, Tore, Sichtschutz): Artikelnummer trotzdem an die Unterkante der dunklen Kachel */
.dsp-kk:not(.dsp-kk-has-rabatt-mini) .dsp-kk-head__left .dsp-kk-sku { margin-top: auto !important; }

/* ══ Hinweise unter dem Produktbild als Karten ══ */
body.dsp-kk-active .dsp-gallery-notes.dsp-kk-notes-host {
    border-top: 0 !important;
    padding: 18px 0 4px !important;
    background: none !important;
}
body.dsp-kk-active .dsp-gallery-notes.dsp-kk-notes-host::before,
body.dsp-kk-active .dsp-gallery-notes.dsp-kk-notes-host::after { display: none !important; }
body.dsp-kk-active .dsp-gallery-notes.dsp-kk-notes-host > :not(.dsp-kk-notes) { display: none !important; }

.dsp-kk-notes {
    --kk-note-accent: #3d4347;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
}
.dsp-kk-notes--n1 { grid-template-columns: minmax(0, 1fr); }
.dsp-kk-notes--n2,
.dsp-kk-notes--n4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.dsp-kk-note {
    --kk-note-accent: #3d4347;
    --kk-note-tint: #eef0f1;
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 15px 16px 14px;
    border: 1px solid #e3e8e6;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(15, 79, 67, .06);
    overflow: hidden;
    animation: dspKkNoteIn .35s ease both;
}
.dsp-kk-note::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
    background: var(--kk-note-accent);
    opacity: .85;
}
.dsp-kk-note:nth-child(2) { animation-delay: .05s; }
.dsp-kk-note:nth-child(3) { animation-delay: .1s; }
.dsp-kk-note:nth-child(4) { animation-delay: .15s; }
@keyframes dspKkNoteIn {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) { .dsp-kk-note { animation: none; } }

.dsp-kk-note--tech     { --kk-note-accent: #3d4347; --kk-note-tint: #eef0f1; }
.dsp-kk-note--material { --kk-note-accent: #6b7471; --kk-note-tint: #f0f2f1; }
.dsp-kk-note--safety   { --kk-note-accent: #c4a25a; --kk-note-tint: #faf3e2; }
.dsp-kk-note--quality  { --kk-note-accent: #c4a25a; --kk-note-tint: #faf3e2; }
.dsp-kk-note--privacy  { --kk-note-accent: #17594d; --kk-note-tint: #e6f2ee; }

.dsp-kk-note__head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 9px;
}
.dsp-kk-note__ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--kk-note-tint);
    color: var(--kk-note-accent);
}
.dsp-kk-note__ico svg { width: 17px; height: 17px; stroke: currentColor; }
.dsp-kk-note__title {
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.25;
    color: #2d3236;
}
.dsp-kk-note__body {
    margin: 0 !important;
    font-size: .82rem;
    line-height: 1.55;
    color: #4a5250;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    overflow: hidden;
}
.dsp-kk-note.is-expanded .dsp-kk-note__body {
    display: block;
    -webkit-line-clamp: unset;
    line-clamp: none;
    overflow: visible;
}
.dsp-kk-note__more {
    align-self: flex-start;
    margin-top: auto !important;
    padding: 8px 0 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
    color: var(--kk-note-accent) !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-transform: none !important;
    letter-spacing: 0 !important;
    cursor: pointer;
}
.dsp-kk-note__more[hidden] { display: none !important; }
.dsp-kk-note--safety .dsp-kk-note__more,
.dsp-kk-note--quality .dsp-kk-note__more { color: #9a7a32 !important; }

@media (max-width: 760px) {
    .dsp-kk-notes,
    .dsp-kk-notes--n2,
    .dsp-kk-notes--n4 { grid-template-columns: minmax(0, 1fr); gap: 10px; }
}

/* ══ Hinweis-Karten v2: kompakt & dezent ══ */
body.dsp-kk-active .dsp-gallery-notes.dsp-kk-notes-host { padding: 14px 0 2px !important; }
.dsp-kk-notes { gap: 8px; }
.dsp-kk-note {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    column-gap: 10px;
    align-items: start;
    padding: 10px 12px 10px 11px;
    border: 1px solid #e8ecea;
    border-radius: 10px;
    background: #fcfdfc;
    box-shadow: none;
}
.dsp-kk-note::before { display: none; }
.dsp-kk-note.is-clamped { cursor: pointer; transition: border-color .15s, background .15s; }
.dsp-kk-note.is-clamped:hover { border-color: #d6dedb; background: #fff; }
.dsp-kk-note__ico {
    flex: none;
    width: 24px;
    height: 24px;
    margin-top: 1px;
}
.dsp-kk-note__ico svg { width: 13px; height: 13px; }
.dsp-kk-note__main { min-width: 0; }
.dsp-kk-note__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    margin: 0 0 2px;
    min-height: 24px;
}
.dsp-kk-note__title {
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.2;
    color: #2d3236;
}
.dsp-kk-note__body {
    font-size: .75rem;
    line-height: 1.45;
    color: #5a6260;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}
.dsp-kk-note__more {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 22px;
    height: 22px;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    color: #8a9390 !important;
    text-decoration: none;
    transition: transform .2s, color .15s, background .15s;
}
.dsp-kk-note__more[hidden] { display: none !important; }
.dsp-kk-note.is-clamped:hover .dsp-kk-note__more { color: var(--kk-note-accent) !important; background: var(--kk-note-tint) !important; }
.dsp-kk-note.is-expanded .dsp-kk-note__more { transform: rotate(180deg); }
.dsp-kk-note--safety .dsp-kk-note__more,
.dsp-kk-note--quality .dsp-kk-note__more { color: #8a9390 !important; }

/* ══ Hinweis-Karten v3: dezente Farbakzente ══ */
.dsp-kk-note--tech     { --kk-note-accent: #4a5155; --kk-note-tint: #e9ecee; --kk-note-bg: #f8f9fa; --kk-note-line: #e2e6e8; }
.dsp-kk-note--material { --kk-note-accent: #7b8582; --kk-note-tint: #eceeed; --kk-note-bg: #fafbfa; --kk-note-line: #e6e9e8; }
.dsp-kk-note--safety   { --kk-note-accent: #b8913f; --kk-note-tint: #f6e9c8; --kk-note-bg: #fdf9ef; --kk-note-line: #efe1bd; }
.dsp-kk-note--quality  { --kk-note-accent: #c4a25a; --kk-note-tint: #f8eed6; --kk-note-bg: #fefbf4; --kk-note-line: #f1e6cc; }
.dsp-kk-note--privacy  { --kk-note-accent: #2a7d6f; --kk-note-tint: #dcefe8; --kk-note-bg: #f5faf8; --kk-note-line: #d9eae3; }

.dsp-kk-note {
    background: var(--kk-note-bg);
    border-color: var(--kk-note-line);
}
.dsp-kk-note::before {
    display: block;
    left: 0;
    top: 0;
    bottom: 0;
    right: auto;
    width: 3px;
    height: auto;
    background: var(--kk-note-accent);
    opacity: 1;
}
.dsp-kk-note.is-clamped:hover {
    background: var(--kk-note-bg);
    border-color: var(--kk-note-accent);
}
.dsp-kk-note__ico { background: var(--kk-note-tint); }
.dsp-kk-note__ico svg { stroke-width: 2.1; }
.dsp-kk-note--safety .dsp-kk-note__title { color: #6e5420; }
.dsp-kk-note.is-clamped:hover .dsp-kk-note__more { background: #fff !important; }

/* ══ Pfosten/Tor/Sichtschutz: Beratung links neben der dunklen Kachel ══ */
.dsp-kk .dsp-kk-help {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 9px;
    width: 100%;
    margin: auto 0 14px !important;
    padding: 0;
}
.dsp-kk.dsp-kk-has-help .dsp-kk-head__left .dsp-kk-sku { margin-top: 0 !important; }
.dsp-kk .dsp-kk-help__head {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: .86rem;
    font-weight: 700;
    color: var(--kk-text);
    line-height: 1.2;
}
.dsp-kk .dsp-kk-help__icon { display: inline-flex; color: #c4a25a; }
.dsp-kk a.dsp-kk-help__wa {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 12px 6px 9px;
    border: 1px solid #3aa58e;
    border-radius: 999px;
    background: #f3faf7;
    color: var(--kk-green-dark) !important;
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none !important;
    white-space: nowrap;
    transition: background .15s, color .15s, border-color .15s;
}
.dsp-kk a.dsp-kk-help__wa:hover,
.dsp-kk a.dsp-kk-help__wa:focus-visible {
    background: var(--kk-green-dark);
    border-color: var(--kk-green-dark);
    color: #fff !important;
}
.dsp-kk .dsp-kk-help__wa-ico { display: inline-flex; }
.dsp-kk a.dsp-kk-help__plan {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding-left: 2px;
    font-size: .76rem;
    font-weight: 600;
    color: var(--kk-muted) !important;
    text-decoration: none !important;
}
.dsp-kk a.dsp-kk-help__plan span { text-decoration: underline; text-underline-offset: 2px; text-decoration-color: #d6bd85; }
.dsp-kk a.dsp-kk-help__plan svg { transition: transform .15s; }
.dsp-kk a.dsp-kk-help__plan:hover { color: var(--kk-text) !important; }
.dsp-kk a.dsp-kk-help__plan:hover svg { transform: translateX(2px); }
.dsp-kk .dsp-kk-help__head { font-size: .8rem; gap: 6px; white-space: nowrap; }
.dsp-kk .dsp-kk-help__icon svg { width: 15px; height: 15px; }
.dsp-kk a.dsp-kk-help__wa {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    justify-content: center;
    padding: 6px 10px;
}
.dsp-kk .dsp-kk-head__left { overflow: visible; }

/* Beratung v2: "Noch Fragen?" + WhatsApp-Symbol als ein Button */
.dsp-kk .dsp-kk-help { gap: 10px; }
.dsp-kk a.dsp-kk-help__wa {
    width: auto;
    justify-content: flex-start;
    gap: 8px;
    padding: 5px 6px 5px 13px;
    border: 1px solid #3aa58e;
    background: #fff;
    color: var(--kk-text) !important;
    font-size: .82rem;
    font-weight: 700;
}
.dsp-kk .dsp-kk-help__wa-img {
    display: block;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    transition: transform .2s;
}
.dsp-kk a.dsp-kk-help__wa:hover,
.dsp-kk a.dsp-kk-help__wa:focus-visible {
    background: #f1f8f5;
    border-color: var(--kk-green-dark);
    color: var(--kk-green-dark) !important;
}
.dsp-kk a.dsp-kk-help__wa:hover .dsp-kk-help__wa-img { transform: scale(1.08) rotate(-6deg); }
/* Beratungs-Button: zarter Petrol-Ton passend zum WhatsApp-Symbol */
.dsp-kk a.dsp-kk-help__wa {
    background: linear-gradient(180deg, #f2f9f6 0%, #e4f2ec 100%);
    border-color: #9fd0c2;
    box-shadow: 0 1px 2px rgba(15, 79, 67, .06);
}
.dsp-kk a.dsp-kk-help__wa:hover,
.dsp-kk a.dsp-kk-help__wa:focus-visible {
    background: linear-gradient(180deg, #e8f4ef 0%, #d6ebe3 100%);
    border-color: #3aa58e;
}

/* "Zaun planen" als Schwester-Button in Pastellgold (passend zur Goldfläche hinter der Kachel) */
.dsp-kk .dsp-kk-help {
    display: inline-flex;
    width: auto;
    align-items: stretch;
    gap: 8px;
}
.dsp-kk a.dsp-kk-help__wa,
.dsp-kk a.dsp-kk-help__plan {
    justify-content: space-between;
}
.dsp-kk a.dsp-kk-help__plan {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 6px 5px 13px;
    border: 1px solid #e3cf9c;
    border-radius: 999px;
    background: linear-gradient(180deg, #fdf8ec 0%, #f8edd2 100%);
    box-shadow: 0 1px 2px rgba(120, 90, 30, .06);
    color: var(--kk-text) !important;
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    text-decoration: none !important;
    transition: background .15s, border-color .15s, color .15s;
}
.dsp-kk a.dsp-kk-help__plan span { text-decoration: none; }
.dsp-kk .dsp-kk-help__plan-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    border-radius: 50%;
    background: #c4a25a;
    color: #fff;
    transition: transform .2s;
}
.dsp-kk a.dsp-kk-help__plan:hover,
.dsp-kk a.dsp-kk-help__plan:focus-visible {
    background: linear-gradient(180deg, #faf1dc 0%, #f2e2bb 100%);
    border-color: #c4a25a;
    color: #6e5420 !important;
}
.dsp-kk a.dsp-kk-help__plan:hover .dsp-kk-help__plan-ico { transform: scale(1.08) rotate(-6deg); }
.dsp-kk a.dsp-kk-help__plan:hover svg { transform: none; }

/* ══ Beratung + Zaunplaner als Reihe UNTER der dunklen Kachel (alle Produktarten) ══ */
.dsp-kk .dsp-kk-head > .dsp-kk-help {
    grid-column: 1 / -1;
    order: 5 !important;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    margin: -8px 0 0 !important;
    padding: 0;
}
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__wa,
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__plan {
    width: 100%;
    box-sizing: border-box;
    justify-content: space-between;
    padding: 6px 7px 6px 15px;
}
.dsp-kk.dsp-kk-has-help .dsp-kk-head__left .dsp-kk-sku { margin-top: auto !important; }
.dsp-kk.dsp-kk-has-rabatt-mini .dsp-kk-head__left .dsp-kk-sku,
.dsp-kk.dsp-kk-has-need .dsp-kk-head__left .dsp-kk-sku { margin-top: 0 !important; }

/* Bedarf-Liste (Pfosten/Tor) im Stil der Mengenrabatt-Liste */
.dsp-kk .dsp-kk-need__row { grid-template-columns: minmax(0, 1fr) auto !important; }
.dsp-kk .dsp-kk-need__icon { transform: none; }
.dsp-kk .dsp-kk-need__val {
    font-size: .76rem;
    font-weight: 700;
    color: var(--kk-green-deep);
    white-space: nowrap;
}

/* Sichtschutz-Rechner */
.dsp-kk .dsp-kk-sscalc__h {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    margin: 0 0 3px !important;
    font-size: .72rem;
    color: var(--kk-muted);
    white-space: nowrap;
}
.dsp-kk .dsp-kk-sscalc__h select {
    width: auto !important;
    min-width: 0 !important;
    height: 24px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 20px 0 7px !important;
    border: 1px solid #e3cf9c !important;
    border-radius: 7px !important;
    background: #fdf8ec url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b0935f' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") right 5px center / 11px no-repeat !important;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none !important;
    font-size: .74rem !important;
    font-weight: 700 !important;
    color: var(--kk-text) !important;
    line-height: 22px !important;
    cursor: pointer;
}
.dsp-kk .dsp-kk-sscalc__h select:focus-visible { outline: 2px solid #c4a25a; outline-offset: 1px; }
.dsp-kk .dsp-kk-need__row.is-active .dsp-kk-rabatt-mini__qty { color: var(--kk-text); font-weight: 700; }
.dsp-kk .dsp-kk-need__row.is-active .dsp-kk-need__val { color: var(--kk-green-dark); text-decoration: underline; text-decoration-color: #c4a25a; text-underline-offset: 3px; }
.dsp-kk .dsp-kk-sscalc { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
.dsp-kk .dsp-kk-sscalc .dsp-kk-need__row { gap: 4px; }
.dsp-kk .dsp-kk-sscalc__h select { width: 82px !important; flex: 0 0 82px; padding-right: 18px !important; text-overflow: clip; }

/* ══ Sichtschutz v2: oben Fakten, unten Rechnung zur Menge ══ */
.dsp-kk.dsp-kk-has-sscalc .dsp-kk-qty-len { display: none !important; }
.dsp-kk .dsp-kk-sscalc .dsp-kk-need__val { font-size: .74rem; }
.dsp-kk .dsp-kk-sscalc-line {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 14px 0 0;
    padding: 10px 12px;
    border-radius: 10px;
    background: #faf5e8;
    border: 1px solid #efe2c2;
    color: #5c4b26;
    font-size: .8rem;
    line-height: 1.4;
}
.dsp-kk .dsp-kk-sscalc-line__icon { display: inline-flex; color: #b8913f; margin-top: 1px; }
.dsp-kk .dsp-kk-sscalc-line__body { min-width: 0; }
.dsp-kk .dsp-kk-sscalc-line__main strong { color: var(--kk-green-dark); font-weight: 800; }
.dsp-kk .dsp-kk-sscalc-line__sub {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 5px;
    margin-top: 4px;
    font-size: .74rem;
    color: #7a6a45;
}
.dsp-kk .dsp-kk-sscalc-line__sel select {
    width: 84px !important;
    height: 24px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 18px 0 7px !important;
    border: 1px solid #e3cf9c !important;
    border-radius: 7px !important;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b0935f' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") right 5px center / 11px no-repeat !important;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none !important;
    font-size: .74rem !important;
    font-weight: 700 !important;
    color: var(--kk-text) !important;
    line-height: 22px !important;
    cursor: pointer;
}
/* Mattenhöhe-Auswahl oben etwas schmaler, mehr Luft zur dunklen Kachel */
.dsp-kk .dsp-kk-sscalc__h select {
    width: 72px !important;
    flex: 0 0 72px;
    height: 22px !important;
    padding: 0 15px 0 5px !important;
    background-position: right 4px center !important;
    background-size: 9px !important;
    font-size: .7rem !important;
    line-height: 20px !important;
}
.dsp-kk .dsp-kk-sscalc { padding-right: 8px !important; }
/* Mattenhöhe-Auswahl: grün statt gold */
.dsp-kk .dsp-kk-sscalc__h select {
    border-color: #3aa58e !important;
    background-color: #fff !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f4f43' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
    color: var(--kk-green-deep) !important;
}
.dsp-kk .dsp-kk-sscalc__h select:focus-visible { outline-color: #3aa58e; }
/* Mattenhöhe-Auswahl: größere Schrift */
.dsp-kk .dsp-kk-sscalc__h select {
    width: 76px !important;
    flex: 0 0 76px;
    height: 24px !important;
    padding: 0 14px 0 5px !important;
    background-position: right 3px center !important;
    font-size: .8rem !important;
    line-height: 22px !important;
}
.dsp-kk .dsp-kk-sscalc { padding-right: 4px !important; }
/* Sichtschutz oben: größere Beschriftungen, Auswahl nur mit Unterstrich */
.dsp-kk .dsp-kk-sscalc .dsp-kk-sscalc__h,
.dsp-kk .dsp-kk-sscalc .dsp-kk-rabatt-mini__qty { font-size: .78rem !important; }
.dsp-kk .dsp-kk-sscalc .dsp-kk-need__val { font-size: .8rem !important; }
.dsp-kk .dsp-kk-sscalc__h select {
    width: 72px !important;
    flex: 0 0 72px;
    height: 22px !important;
    padding: 0 14px 0 0 !important;
    border: 0 !important;
    border-bottom: 1.5px solid #3aa58e !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    background-position: right 1px center !important;
    text-align: left;
}
.dsp-kk .dsp-kk-sscalc__h select:hover { border-bottom-color: var(--kk-green-deep) !important; }
.dsp-kk .dsp-kk-sscalc__h { gap: 4px; }
.dsp-kk .dsp-kk-sscalc__h select { width: 64px !important; flex: 0 0 64px; padding-right: 12px !important; background-position: right 0 center !important; }
.dsp-kk .dsp-kk-sscalc__h select { width: 70px !important; flex: 0 0 70px; padding-right: 13px !important; font-size: .78rem !important; }
.dsp-kk .dsp-kk-sscalc .dsp-kk-sscalc__h { font-size: .76rem !important; gap: 2px; }
.dsp-kk .dsp-kk-sscalc .dsp-kk-sscalc__h { gap: 6px; justify-content: flex-start; }

/* Sichtschutz oben v3: Zahl zuerst, dann kurzer Text */
.dsp-kk .dsp-kk-sscalc__list { margin: 2px 0 0 !important; padding: 0 !important; list-style: none !important; }
.dsp-kk .dsp-kk-sscalc__row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin: 0 !important;
    padding: 4px 0;
    list-style: none !important;
    border-bottom: 1px dashed #e4dcc8;
    white-space: nowrap;
}
.dsp-kk .dsp-kk-sscalc__row:last-child { border-bottom: 0; }
.dsp-kk .dsp-kk-sscalc__val {
    font-size: .9rem;
    font-weight: 800;
    color: var(--kk-green-deep);
    line-height: 1.2;
}
.dsp-kk .dsp-kk-sscalc__txt {
    font-size: .78rem;
    color: var(--kk-muted);
}
.dsp-kk .dsp-kk-sscalc__sel select {
    width: 72px !important;
    height: 22px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 13px 0 0 !important;
    border: 0 !important;
    border-bottom: 1.5px solid #3aa58e !important;
    border-radius: 0 !important;
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f4f43' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") right 0 center / 10px no-repeat !important;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none !important;
    font-size: .9rem !important;
    font-weight: 800 !important;
    color: var(--kk-green-deep) !important;
    line-height: 20px !important;
    cursor: pointer;
}
.dsp-kk .dsp-kk-sscalc__sel select:hover { border-bottom-color: var(--kk-green-deep) !important; }
.dsp-kk .dsp-kk-sscalc__sel select:focus-visible { outline: 2px solid #3aa58e; outline-offset: 2px; }
.dsp-kk .dsp-kk-sscalc__sel select { width: 88px !important; padding-right: 14px !important; }
.dsp-kk .dsp-kk-sscalc__sel select { font-weight: 500 !important; width: 84px !important; }
/* Sichtschutz oben: Zahlen in Gold, Höhe fett in gleicher Schrift wie die Werte */
.dsp-kk .dsp-kk-sscalc__val { color: #a8842f !important; }
.dsp-kk .dsp-kk-sscalc__sel select {
    font-family: inherit !important;
    font-size: .9rem !important;
    font-weight: 800 !important;
    letter-spacing: normal !important;
    color: #a8842f !important;
    width: 88px !important;
    border-bottom-color: #d6bd85 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a8842f' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
}
.dsp-kk .dsp-kk-sscalc__sel select:hover { border-bottom-color: #a8842f !important; }
.dsp-kk .dsp-kk-sscalc__sel select:focus-visible { outline-color: #c4a25a; }
.dsp-kk .dsp-kk-sscalc__val { color: var(--kk-text) !important; }
.dsp-kk .dsp-kk-sscalc__sel select, .dsp-kk .dsp-kk-sscalc__sel select:hover { border-bottom: 0 !important; }
.dsp-kk .dsp-kk-rabatt-mini__head { font-size: .84rem !important; }
/* Buttons unter der Kachel: Verlauf von links (Farbe) nach rechts (weiß) */
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__wa {
    background: linear-gradient(90deg, #cfe9df 0%, #e9f5f0 45%, #ffffff 100%) !important;
}
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__wa:hover,
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__wa:focus-visible {
    background: linear-gradient(90deg, #b9dfd1 0%, #ddefe8 50%, #ffffff 100%) !important;
}
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__plan {
    background: linear-gradient(90deg, #f2e1b6 0%, #f9f0d9 45%, #ffffff 100%) !important;
}
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__plan:hover,
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__plan:focus-visible {
    background: linear-gradient(90deg, #ebd29a 0%, #f5e6c2 50%, #ffffff 100%) !important;
}

/* ══ Eigene Höhen-Auswahl (Sichtschutz) ══ */
.dsp-kk .dsp-kk-sscalc .dsp-kk-sscalc__row { overflow: visible; }
.dsp-kk .dsp-kk-head__left, .dsp-kk .dsp-kk-sscalc { overflow: visible !important; }
.dsp-kk .dsp-kk-hsel { position: relative; display: inline-flex; z-index: 30; }
.dsp-kk .dsp-kk-hsel.is-open { z-index: 60; }
.dsp-kk button.dsp-kk-hsel__btn {
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    width: auto !important;
    min-height: 0 !important;
    height: auto !important;
    margin: -3px 0 !important;
    padding: 3px 7px 3px 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: none !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-size: .9rem !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: #a8842f !important;
    cursor: pointer;
}
.dsp-kk .dsp-kk-hsel__chev { display: inline-flex; transition: transform .2s; }
.dsp-kk .dsp-kk-hsel.is-open .dsp-kk-hsel__chev { transform: rotate(180deg); }
.dsp-kk button.dsp-kk-hsel__btn:hover { color: #8a6a22 !important; }
.dsp-kk button.dsp-kk-hsel__btn:focus-visible { outline: 2px solid #c4a25a; outline-offset: 2px; }

.dsp-kk .dsp-kk-hsel__pop {
    position: absolute;
    top: calc(100% + 8px);
    left: -10px;
    width: 196px;
    padding: 10px;
    border: 1px solid #ece3cc;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(30, 36, 40, .16), 0 2px 6px rgba(30, 36, 40, .06);
    animation: dspKkPopIn .16s ease both;
}
.dsp-kk .dsp-kk-hsel__pop[hidden] { display: none; }
.dsp-kk .dsp-kk-hsel__pop::before {
    content: "";
    position: absolute;
    top: -6px;
    left: 22px;
    width: 10px;
    height: 10px;
    background: #fff;
    border-left: 1px solid #ece3cc;
    border-top: 1px solid #ece3cc;
    transform: rotate(45deg);
}
@keyframes dspKkPopIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.dsp-kk .dsp-kk-hsel__title {
    margin: 0 2px 8px;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--kk-muted);
}
.dsp-kk .dsp-kk-hsel__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}
.dsp-kk button.dsp-kk-hsel__opt {
    position: relative;
    display: inline-flex !important;
    align-items: baseline;
    justify-content: center;
    gap: 3px;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 7px 6px !important;
    border: 1px solid #ebe7de !important;
    border-radius: 9px !important;
    background: #faf9f6 !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: var(--kk-text) !important;
    cursor: pointer;
    transition: background .12s, border-color .12s, color .12s;
}
.dsp-kk button.dsp-kk-hsel__opt small { font-size: .68rem; font-weight: 600; color: var(--kk-muted); }
.dsp-kk button.dsp-kk-hsel__opt:hover { background: #fdf6e6 !important; border-color: #e3cf9c !important; }
.dsp-kk button.dsp-kk-hsel__opt:focus-visible { outline: 2px solid #c4a25a; outline-offset: 1px; }
.dsp-kk button.dsp-kk-hsel__opt.is-selected {
    background: linear-gradient(90deg, #f2e1b6 0%, #f9f0d9 100%) !important;
    border-color: #c4a25a !important;
    color: #6e5420 !important;
}
.dsp-kk button.dsp-kk-hsel__opt.is-selected small { color: #8a6a22; }
.dsp-kk .dsp-kk-hsel__tick {
    position: absolute;
    top: -5px;
    right: -5px;
    display: none;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #c4a25a;
    color: #fff;
}
.dsp-kk button.dsp-kk-hsel__opt.is-selected .dsp-kk-hsel__tick { display: inline-flex; }
/* Offene Höhen-Auswahl liegt über Kachel und Akkordeon */
.dsp-kk.dsp-kk-hsel-open .dsp-kk-head { position: relative; z-index: 50 !important; }
.dsp-kk.dsp-kk-hsel-open .dsp-kk-head > .dsp-kk-head__left { z-index: 60 !important; }
/* Buttons unter der Kachel – Variante B: nur Rahmen, Hintergrund wie die Seite */
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__wa,
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__plan {
    background: transparent !important;
    box-shadow: none !important;
}
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__wa { border-color: #3aa58e !important; }
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__plan { border-color: #c4a25a !important; }
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__wa:hover,
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__wa:focus-visible {
    background: rgba(58, 165, 142, .07) !important;
    border-color: var(--kk-green-dark) !important;
}
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__plan:hover,
.dsp-kk .dsp-kk-head > .dsp-kk-help a.dsp-kk-help__plan:focus-visible {
    background: rgba(196, 162, 90, .08) !important;
    border-color: #a8842f !important;
}

/* Auswahl-Chips im Akkordeon: Anthrazit wie die Preiskarte, leichter Glanz, grüner Haken */
.dsp-kk .dsp-kk-acc-chip {
    background: linear-gradient(160deg, #545b5f 0%, #42484c 50%, #363c3f 100%);
    border: 1px solid #2f3437;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 1px 3px rgba(30, 36, 40, .18);
    color: #f2f4f3;
    padding: 3px 10px 3px 6px;
}
.dsp-kk .dsp-kk-acc-chip::before {
    width: 15px;
    height: 15px;
    background: #34b98a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center / 9px no-repeat;
    box-shadow: 0 0 0 2px rgba(52, 185, 138, .18);
}

/* Tor: Lieferumfang */
.dsp-kk .dsp-kk-incl__list { margin: 2px 0 0 !important; padding: 0 !important; list-style: none !important; }
.dsp-kk .dsp-kk-incl__row {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin: 0 !important;
    padding: 3px 0;
    list-style: none !important;
    font-size: .76rem;
    line-height: 1.3;
    color: var(--kk-text);
}
.dsp-kk .dsp-kk-incl__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 14px;
    width: 14px;
    height: 14px;
    margin-top: 1px;
    border-radius: 50%;
    font-size: .7rem;
    font-weight: 800;
    line-height: 1;
}
.dsp-kk .dsp-kk-incl__row.is-in .dsp-kk-incl__mark {
    background: #34b98a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center / 9px no-repeat;
}
.dsp-kk .dsp-kk-incl__row.is-ex {
    margin-top: 3px !important;
    padding-top: 5px;
    border-top: 1px dashed #e4dcc8;
    color: var(--kk-muted);
    font-size: .72rem;
}
.dsp-kk .dsp-kk-incl__row.is-ex .dsp-kk-incl__mark { background: #f3ead2; color: #a8842f; }
.dsp-kk .dsp-kk-incl__row { white-space: nowrap; }

/* Tor-Lieferumfang: nur grüner Haken bzw. goldenes Plus, ohne Kreis */
.dsp-kk .dsp-kk-incl__row.is-in .dsp-kk-incl__mark {
    border-radius: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2322a374' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.5 12.5 5 5L19.5 7'/%3E%3C/svg%3E") center / 13px no-repeat;
}
.dsp-kk .dsp-kk-incl__row.is-ex .dsp-kk-incl__mark {
    border-radius: 0;
    background: none;
    color: #b8913f;
    font-size: .95rem;
    font-weight: 700;
}

/* ══ Vorteile links neben dem Produktbild: etwas größer, Symbole im zarten Kreis ══ */
@media (min-width: 769px) {
    body.dsp-kk-active .dsp-inline-usps__item { gap: 14px !important; align-items: flex-start !important; }
    body.dsp-kk-active .dsp-inline-usps__icon {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 42px !important;
        width: 42px !important;
        height: 42px !important;
        margin-top: 1px;
        border-radius: 50% !important;
        background: radial-gradient(circle at 30% 25%, #f3faf7 0%, #e2f1eb 60%, #d3e9e0 100%) !important;
        box-shadow: inset 0 0 0 1px rgba(42, 125, 111, .14), 0 2px 6px rgba(15, 79, 67, .06) !important;
        color: #237566 !important;
    }
    body.dsp-kk-active .dsp-inline-usps__icon svg {
        width: 22px !important;
        height: 22px !important;
        stroke-width: 1.8 !important;
        stroke-linecap: round;
        stroke-linejoin: round;
    }
    body.dsp-kk-active .dsp-inline-usps__title {
        font-size: .9rem !important;
        line-height: 1.25 !important;
        color: #2d3236 !important;
    }
    body.dsp-kk-active .dsp-inline-usps__desc {
        margin-top: 3px !important;
        font-size: .74rem !important;
        line-height: 1.5 !important;
        color: #4f5856 !important;
    }
}
/* Vorteile links: Symbol-Kreise in Anthrazit (wie Preiskarte) mit leichtem Glanz */
@media (min-width: 769px) {
    body.dsp-kk-active .dsp-inline-usps__icon {
        background: linear-gradient(160deg, #545b5f 0%, #42484c 50%, #33393c 100%) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 3px 8px rgba(30, 36, 40, .18) !important;
        color: #f2f4f3 !important;
    }
    body.dsp-kk-active .dsp-inline-usps__icon svg { stroke: #f2f4f3 !important; }
}
/* Auswahl-Chips v3: kein Hintergrund, nur Unterstrich; Haken dezent im Kreisrahmen */
.dsp-kk .dsp-kk-acc-chip {
    background: none !important;
    border: 0 !important;
    border-bottom: 1.5px solid rgba(61, 67, 71, .45) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 1px 1px 2px 0 !important;
    color: var(--anthrazit, #3d4347) !important;
    font-weight: 700;
    gap: 6px;
}
.dsp-kk .dsp-kk-acc-chip::before {
    width: 14px !important;
    height: 14px !important;
    box-sizing: border-box;
    border: 1.3px solid #34b98a;
    box-shadow: none !important;
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2322a374' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5.5 12.5 4.2 4.2L18.5 7.5'/%3E%3C/svg%3E") center / 8px no-repeat !important;
}
/* Auswahl-Chips: Haken kräftiger */
.dsp-kk .dsp-kk-acc-chip::before {
    width: 16px !important;
    height: 16px !important;
    border-width: 1.6px !important;
    border-color: #22a374 !important;
    background: rgba(34, 163, 116, .08) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b9467' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5.5 12.5 4.2 4.2L18.5 7.5'/%3E%3C/svg%3E") center / 10px no-repeat !important;
}

/* Pfosten: Welche Montage? */
.dsp-kk .dsp-kk-mount__list { margin: 2px 0 0 !important; padding: 0 !important; list-style: none !important; }
.dsp-kk .dsp-kk-mount__row {
    display: flex;
    flex-direction: column;
    margin: 0 !important;
    padding: 4px 0 4px 9px;
    list-style: none !important;
    border-left: 2px solid #e4dcc8;
    line-height: 1.25;
    transition: border-color .15s, opacity .15s;
}
.dsp-kk .dsp-kk-mount__row + .dsp-kk-mount__row { margin-top: 4px !important; }
.dsp-kk .dsp-kk-mount__row strong { font-size: .8rem; font-weight: 700; color: var(--kk-text); }
.dsp-kk .dsp-kk-mount__row span { font-size: .72rem; color: var(--kk-muted); white-space: nowrap; }
.dsp-kk .dsp-kk-mount.has-choice .dsp-kk-mount__row:not(.is-active) { opacity: .55; }
.dsp-kk .dsp-kk-mount__row.is-active { border-left-color: #22a374; }
.dsp-kk .dsp-kk-mount__rule {
    margin-top: 7px;
    padding-top: 6px;
    border-top: 1px dashed #e4dcc8;
    font-size: .76rem;
    color: var(--kk-text);
}
.dsp-kk .dsp-kk-mount__rule strong { font-weight: 700; }
.dsp-kk .dsp-kk-mount__row { padding: 2px 0 2px 8px; line-height: 1.2; }
.dsp-kk .dsp-kk-mount__row + .dsp-kk-mount__row { margin-top: 3px !important; }
.dsp-kk .dsp-kk-mount__rule { margin-top: 5px; padding-top: 4px; }
.dsp-kk .dsp-kk-mount.has-choice .dsp-kk-mount__row:not(.is-active) { opacity: 1; }

/* ══════════════════════ MOBIL (≤ 768 px) – Desktop bleibt unberührt ══════════════════════ */
@media (max-width: 768px) {
    /* Kopf: Titel → Untertitel → Preiskarte (volle Breite) → Info-Block + Artikelnummer → Buttons */
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-head.dsp-kk-toprow {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        row-gap: 14px !important;
        margin-top: 4px !important;
    }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-head > .dsp-kk-head__title { order: -2 !important; margin: 0 !important; }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-head > .dsp-kk-head__sub { order: -1 !important; margin: -8px 0 0 !important; }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-head > .dsp-kk-pricewrap {
        order: 0 !important;
        width: 100% !important;
        max-width: none !important;
        margin: 4px 0 0 !important;
        align-self: stretch !important;
    }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-head > .dsp-kk-head__left {
        order: 1 !important;
        width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: end;
        column-gap: 16px;
    }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-head__left > .dsp-kk-rabatt-mini { margin: 0 !important; width: 100%; max-width: 230px; }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-head__left > .dsp-kk-sku {
        margin: 0 !important;
        padding: 0 !important;
        border-top: 0 !important;
        text-align: right;
        align-self: end;
    }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-head > .dsp-kk-help { order: 5 !important; margin: 0 !important; }

    /* Doppelte Artikelnummer der Mobil-Ansicht ausblenden */
    html body.dsp-kk-active .summary.dsp-kk .dsp-mobile-title-sku { display: none !important; }

    /* Preiskarte: Preis oben, darunter Pill / Versand / Lieferzeit */
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-pricecard .dsp-matte-header-price { order: 0 !important; }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-pricecard .dsp-kk-pricecard__foot { order: 1 !important; }

    /* Stern: kleiner runder Knopf wie am Desktop, ohne "Merken"-Text */
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-pricecard > .dsp-title-star-wrap {
        position: absolute !important;
        top: 9px !important;
        right: 9px !important;
        left: auto !important;
        bottom: auto !important;
        width: 32px !important;
        height: 32px !important;
        min-width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border-radius: 50% !important;
        background: #fff !important;
        border: 1px solid #ece2c8 !important;
        box-shadow: 0 3px 10px rgba(0, 0, 0, .12) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-pricecard > .dsp-title-star-wrap .dsp-title-star {
        width: 32px !important;
        height: 32px !important;
        min-width: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
        flex-direction: row !important;
        gap: 0 !important;
        transform: scale(.82) !important;
    }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-pricecard > .dsp-title-star-wrap .dsp-title-star::before {
        width: 24px !important;
        height: 24px !important;
        margin: 0 !important;
    }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-pricecard > .dsp-title-star-wrap .dsp-title-star::after { display: none !important; content: none !important; }
}
@media (max-width: 768px) {
    /* Trust-Band (mobil): Bezugselement Rabatt-Box ist bei uns ausgeblendet -> Innenabstand fest setzen */
    html body.dsp-kk-active .summary.dsp-kk.dsp-kk-has-rabatt-mini .dsp-mobile-trustbar-shell {
        padding: 7px 53px 7px 8px !important;
    }
    /* Artikelnummer rechts: Label über dem Wert */
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-head__left > .dsp-kk-sku {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-end !important;
        gap: 1px !important;
    }
}
@media (max-width: 768px) {
    /* Hinweis-Karten mobil: kein zusätzlicher weißer Rahmen um die Karten */
    html body.dsp-kk-active.single-product div.product .dsp-gallery-notes.dsp-kk-notes-host:not([hidden]) {
        padding: 0 !important;
        background: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    html body.dsp-kk-active.single-product div.product .dsp-gallery-notes.dsp-kk-notes-host:not([hidden])::before { content: none !important; display: none !important; }
}
@media (max-width: 768px) {
    /* Zugeklappte Schritte: Kopfzeile vertikal mittig (Tor/Pfosten-Mobil-CSS setzt Mindesthöhe) */
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-acc-item:not(.is-open) > .dsp-kk-acc-head {
        min-height: 0 !important;
        margin-bottom: 0 !important;
        align-items: center !important;
    }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-acc-item:not(.is-open) > .dsp-kk-acc-head > * { align-self: center !important; }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-acc-item:not(.is-open) { padding-bottom: 8.8px !important; }
}
@media (max-width: 768px) {
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-acc-item:not(.is-open) > .dsp-kk-acc-head { padding: 6px 0 !important; height: auto !important; }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-acc > .dsp-kk-acc-item { margin: 0 0 10px !important; }
}
@media (max-width: 768px) {
    /* Lange Auswahlwerte (z. B. "Premium (680g/m²)") dürfen umbrechen statt abgeschnitten zu werden */
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-acc-chip {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        max-width: 52% !important;
        line-height: 1.2 !important;
        text-align: right;
    }
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-acc-chip::before { align-self: center; }
}
/* Höhen-Auswahl: nicht durch globale max-width-Regeln stauchen */
html body.dsp-kk-active .summary.dsp-kk .dsp-kk-hsel__pop { max-width: none !important; width: 196px !important; }
@media (max-width: 768px) {
    html body.dsp-kk-active .summary.dsp-kk .dsp-kk-hsel__pop { left: -4px !important; width: 210px !important; }
}
/* Tor-Lieferumfang: Link zum Profilzylinder */
.dsp-kk a.dsp-kk-incl__link {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: #8a6a22 !important;
    font-weight: 600;
    text-decoration: underline !important;
    text-decoration-color: #d6bd85 !important;
    text-underline-offset: 2px;
}
.dsp-kk a.dsp-kk-incl__link svg { width: 11px; height: 11px; transition: transform .15s; }
.dsp-kk a.dsp-kk-incl__link:hover { color: #6e5420 !important; }
.dsp-kk a.dsp-kk-incl__link:hover svg { transform: translateX(2px); }
