/* Linke Sidebar nur auf Artikellistenseiten fixieren */
@media (min-width: 992px) {
    #content-wrapper.is-item-list #sidepanel_left {
        position: sticky;
        top: 70px;
        align-self: flex-start;
    }
}

/* JTL-Shop 5 / NOVAChild – Kategorieblock v10.
   Nicht parallel mit den alten Versionen des Kategorieblock-CSS einfügen.
   Eigenes CSS-Grid statt Bootstrap-row/col: Einzelkategorien nutzen die ganze Breite
   des umgebenden Shop-Inhaltsbereichs.
   Desktop: Beschreibungsgröße abhängig von der Anzahl der Kategorien. */
.nova-cat-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0 0 24px;
}

.nova-cat-grid__item {
    display: block;
    min-width: 0;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}

.nova-cat-card {
    width: 100%;
    min-width: 0;
    max-width: none;
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid #e4eaf0;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 6px 24px rgba(16, 38, 59, .055);
    transition: transform .25s ease, box-shadow .25s ease;
}

.nova-cat-card__media {
    display: block;
    position: relative;
    width: 100%;
    max-width: none;
    aspect-ratio: 16 / 11;
    overflow: hidden;
    background: #e9eef3;
    color: inherit;
    text-decoration: none;
    isolation: isolate;
}

.nova-cat-card__image,
.nova-cat-card__placeholder {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
}

.nova-cat-card__image {
    display: block;
    object-fit: cover;
    transition: transform .5s ease;
}

.nova-cat-card__placeholder {
    background: linear-gradient(135deg, #dfe8f1, #f2f5f8 65%, #cadbe8);
}

.nova-cat-card__media::after {
    content: '';
    position: absolute;
    z-index: 0;
    inset: 45% 0 0;
    background: linear-gradient(transparent, rgba(10, 28, 45, .22));
    pointer-events: none;
}

.nova-cat-card__button {
    position: absolute;
    z-index: 1;
    right: 14px;
    bottom: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    max-width: calc(100% - 28px);
    padding: 11px 14px;
    border-radius: 9px;
    background: #fff;
    color: #18344d;
    box-shadow: 0 5px 18px rgba(0, 0, 0, .16);
    font-size: .92rem;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
    transition: background-color .2s ease, color .2s ease;
}

.nova-cat-card__button-label {
    min-width: 0;
    overflow-wrap: anywhere;
}

.nova-cat-card__button svg {
    flex: 0 0 18px;
    transition: transform .2s ease;
}

.nova-cat-card__content {
    padding: 17px 18px 19px;
}

.nova-cat-card__description {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    color: #58697a;
    font-size: .91rem;
    line-height: 1.65;
}

.nova-cat-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(16, 38, 59, .11);
}

.nova-cat-card:hover .nova-cat-card__image,
.nova-cat-card:focus-within .nova-cat-card__image {
    transform: scale(1.045);
}

.nova-cat-card__media:hover .nova-cat-card__button,
.nova-cat-card__media:focus-visible .nova-cat-card__button {
    background: #18344d;
    color: #fff;
}

.nova-cat-card__media:hover .nova-cat-card__button svg,
.nova-cat-card__media:focus-visible .nova-cat-card__button svg {
    transform: translateX(3px);
}

.nova-cat-card__media:focus-visible {
    outline: 3px solid #1676d2;
    outline-offset: -3px;
}

/* Eine Kategorie: Bild/Kachel IMMER 100 % des Inhaltsbereichs breit. */
.nova-cat-grid--single {
    grid-template-columns: minmax(0, 1fr);
}

.nova-cat-grid--single > .nova-cat-grid__item,
.nova-cat-grid--single .nova-cat-card,
.nova-cat-grid--single .nova-cat-card__media {
    width: 100% !important;
    max-width: none !important;
}

.nova-cat-grid--single .nova-cat-card__image {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover;
}

@media (min-width: 576px) {
    .nova-cat-grid--double,
    .nova-cat-grid--triple,
    .nova-cat-grid--default {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Auf Tablets wird die dritte Kategorie in einer neuen Reihe zentriert. */
@media (min-width: 576px) and (max-width: 991.98px) {
    .nova-cat-grid--triple > .nova-cat-grid__item:last-child {
        grid-column: 1 / -1;
        width: calc((100% - 24px) / 2);
        justify-self: center;
    }
}

@media (min-width: 992px) {
    .nova-cat-grid--triple,
    .nova-cat-grid--default {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    /* Bewusst KEIN max-height mit aspect-ratio kombiniert: volle Bildbreite. */
    .nova-cat-grid--single .nova-cat-card__media {
        aspect-ratio: auto;
        height: clamp(320px, 31vw, 500px);
    }

    .nova-cat-grid--single .nova-cat-card__content {
        padding: 22px 28px 24px;
    }

    .nova-cat-grid--double .nova-cat-card__media {
        aspect-ratio: 16 / 10;
    }

    /* Schriftgröße der Meta-Description nach Anzahl der Unterkategorien. */
    .nova-cat-grid--single .nova-cat-card__description {
        font-size: 1.18rem;
        line-height: 1.65;
    }

    .nova-cat-grid--double .nova-cat-card__description {
        font-size: 1.04rem;
        line-height: 1.65;
    }

    /* Bei drei Kategorien bleibt die Standardgröße (.91rem) erhalten. */
    .nova-cat-grid--default .nova-cat-card__description {
        font-size: .84rem;
        line-height: 1.6;
    }
}

@media (min-width: 1200px) {
    .nova-cat-grid--default {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (prefers-reduced-motion: reduce) {
    .nova-cat-card,
    .nova-cat-card__image,
    .nova-cat-card__button,
    .nova-cat-card__button svg {
        transition: none;
    }
}

/* ===== stoppball NOVA Megamenue SEO v3.1 Transparenz: BEGIN ===== */
/* JTL-Shop 5.8.2 / NOVAChild 5.8.0 – nur Desktop-Megamenue.
   Die Kategorie-Kacheln und die Produktlisten-CSS darueber bleiben unveraendert. */
#mainNavigation {
    --nova-mega-width: 1618px;
    --nova-mega-accent: #2458b8;
    --nova-mega-muted: #64748b;
    --nova-mega-soft: #f5f8fc;
    --nova-mega-border: #e6ebf2;
}

@media (min-width: 992px) {
    /* Hauptfenster gerade; Inhaltsbreite zentriert bis maximal 1618 px. */
    #mainNavigation .dropdown.dropdown-full > .dropdown-menu {
        /* Ueber der per JS direkt an <body> fixierten Filterleiste (z-index 1010).
           Das Dropdown liegt im Sticky-Header (z-index 1020) bzw.
           auch bei nicht-sticky Headern oberhalb des Filters. */
        z-index: 1025;
        border: 1px solid var(--nova-mega-border);
        border-radius: 0;
        box-shadow: 0 18px 55px rgba(12, 30, 62, .16);
        overflow: hidden;
        /* Gut lesbare, leicht transparente Glasflaeche; Blur nur im Desktop-Dropdown. */
        background: rgba(255, 255, 255, .78);
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px);
    }
    /* NOVA-Backdrop nur waehrend eines geoeffneten Desktop-Megamenues aufhellen.
       Das uebrige Modalsystem und andere Dropdowns bleiben unberuehrt.
       Eine 30-prozentige Abdunklung sorgt fuer Orientierung bei erkennbarem Shopinhalt.
       :has() ist in aktuellen Desktop-Browsern verfuegbar. */
    body:has(#mainNavigation .dropdown.dropdown-full.show) .modal-backdrop.show,
    body:has(#mainNavigation .dropdown.dropdown-full > .dropdown-menu.show) .modal-backdrop.show {
        background-color: rgba(0, 0, 0, .30);
        opacity: 1;
    }
    #mainNavigation .dropdown.dropdown-full > .dropdown-menu > .dropdown-body {
        padding: 0 8px 100px; /* Bestehende 100 px Freiraum unten beibehalten. */
        min-height: min(50vh, 460px); /* Bei wenigen Kategorien etwas groesser. */
        max-height: min(80vh, 760px, calc(100vh - 160px)); /* Bei viel Inhalt scrollbar. */
        background: transparent;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    #mainNavigation .dropdown.dropdown-full > .dropdown-menu .subcategory-wrapper,
    #mainNavigation .dropdown.dropdown-full > .dropdown-menu .dropdown-body > .container,
    #mainNavigation .dropdown.dropdown-full > .dropdown-menu .dropdown-body > .container-fluid {
        width: min(100%, var(--nova-mega-width));
        max-width: var(--nova-mega-width);
        margin-left: auto;
        margin-right: auto;
    }
    #mainNavigation .dropdown.dropdown-full .subcategory-wrapper > .row.nav {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        column-gap: 15px;
        row-gap: 11px;
        margin: 0;
    }
    #mainNavigation .dropdown.dropdown-full .subcategory-wrapper > .row.nav > .nav-item-lg-m {
        width: auto;
        max-width: none;
        min-width: 0;
        flex: none;
        margin: 0;
        padding: 10px 10px;
        border-radius: 10px;
        transition: background-color 170ms ease, box-shadow 170ms ease;
    }
    #mainNavigation .dropdown.dropdown-full .subcategory-wrapper > .row.nav > .nav-item-lg-m:hover,
    #mainNavigation .dropdown.dropdown-full .subcategory-wrapper > .row.nav > .nav-item-lg-m:focus-within {
        background: var(--nova-mega-soft);
    }

    /* Kompakte Kopfzeile ohne Suchfeld. Kategorie-CTA bleibt erhalten. */
    #mainNavigation .mega-menu-intro {
        width: min(calc(100% - 40px), var(--nova-mega-width));
        margin: 12px auto 9px;
        padding: 9px 12px 13px;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        border-bottom: 1px solid var(--nova-mega-border);
    }
    #mainNavigation .mega-menu-intro-text {
        display: flex;
        flex-direction: column;
        min-width: 0;
        gap: 2px;
    }
    #mainNavigation .mega-menu-heading {
        font-size: 20px;
        font-weight: 750;
        line-height: 1.25;
        color: #15243d;
    }
    #mainNavigation .mega-menu-intro-subtitle {
        color: var(--nova-mega-muted);
        font-size: 12px;
    }
    #mainNavigation .mega-menu-actions {
        display: flex;
        align-items: center;
        gap: 10px;
    }
    #mainNavigation .mega-all-link {
        display: inline-flex;
        gap: 10px;
        align-items: center;
        flex-shrink: 0;
        border-radius: 999px;
        padding: 8px 13px;
        background: var(--nova-mega-accent);
        color: white;
        font-size: 12.5px;
        font-weight: 650;
        text-decoration: none;
        transition: filter 160ms ease, transform 160ms ease;
    }
    #mainNavigation .mega-all-link:hover,
    #mainNavigation .mega-all-link:focus-visible {
        color: white;
        filter: brightness(.9);
        transform: translateY(-1px);
    }
    #mainNavigation .dropdown-full .submenu-headline-toplevel {
        padding: 5px 4px;
        font-weight: 700;
        color: #18283f;
        text-decoration: none;
    }
    #mainNavigation .dropdown-full .submenu-headline-toplevel:hover {
        color: var(--nova-mega-accent);
    }
    #mainNavigation .mega-link-copy {
        display: block;
        min-width: 0;
        line-height: 1.3;
    }
    #mainNavigation .mega-link-name { display: block; }
    #mainNavigation .mega-meta-excerpt {
        max-width: 100%;
        margin-top: 4px;
        color: var(--nova-mega-muted);
        font-size: 11px;
        font-weight: 400;
        line-height: 1.4;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    /* Kategoriebilder bis 200 px hoch; abgerundete Bildecken bleiben erhalten. */
    #mainNavigation .mega-menu-column > .categories-recursive-link .submenu-headline-image {
        display: block;
        max-width: 100%;
        max-height: 200px;
        object-fit: cover;
        border-radius: 11px;
    }

    /* Unter-Unterkategorien: zwei Spalten mit etwas mehr vertikalem Abstand.
       Dies ist die NOVA-Liste unter categories-recursive-dropdown, nicht das mobile Menue. */
    #mainNavigation .mega-menu-column > .categories-recursive-dropdown.dropdown-menu {
        padding: 3px 0 0 5px;
        margin: 0;
        background: transparent; /* Keine deckend weissen Inseln auf Glasflaeche. */
    }
    #mainNavigation .mega-menu-column > .categories-recursive-dropdown > .nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 12px;
        row-gap: 4px;
        margin: 0;
        padding: 0;
        align-items: start;
    }
    #mainNavigation .mega-menu-column > .categories-recursive-dropdown > .nav > .nav-item {
        width: auto;
        min-width: 0;
        margin: 0;
        padding: 0;
    }
    #mainNavigation .mega-menu-column > .categories-recursive-dropdown > .nav > .nav-item > a {
        display: block;
        min-width: 0;
        padding: 4px 2px;
        font-size: .86rem;
        line-height: 1.3;
    }
    #mainNavigation .mega-menu-column > .categories-recursive-dropdown > .nav > .nav-item .text-truncate {
        max-width: 100%;
    }
    #mainNavigation .dropdown-menu .nav-link:focus-visible,
    #mainNavigation .dropdown-menu a:focus-visible {
        outline: 2px solid var(--nova-mega-accent);
        outline-offset: 3px;
        border-radius: 4px;
    }
}

@media (min-width: 1200px) {
    #mainNavigation .dropdown.dropdown-full .subcategory-wrapper > .row.nav {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    /* NOVA-Offcanvas auf Mobilgeraeten ohne eigene Grid-/Bildanpassung. */
    #mainNavigation .mega-menu-intro { display: none !important; }
    #mainNavigation .mega-meta-excerpt { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    #mainNavigation .dropdown-full .nav-item-lg-m,
    #mainNavigation .mega-all-link { transition: none !important; }
}
/* ===== stoppball NOVA Megamenue SEO v3.1 Transparenz: END ===== */

/* ===== NOVAChild Artikelkacheln v1.3 / JTL-Shop 5.8.2: START ===== */
/* Galerieansicht ausschliesslich; Listenansicht und Kategorie-Kacheln bleiben unveraendert. */
.productbox.productbox-column .productbox-images {
    border-radius: 12px;
    overflow: hidden;
}

.productbox.productbox-column .productbox-images .square-image .inner {
    /* NOVA: muss absolut positioniert bleiben, sonst kollabiert der Bildbereich. */
    position: absolute;
    overflow: hidden;
    border-radius: 12px;
}

/* Dunkler Bildschleier (3 %) ohne Einwirkung auf Links / Klicks. */
.productbox.productbox-column .productbox-images .square-image .inner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #000;
    opacity: .03;
    pointer-events: none;
    z-index: 1;
}

.productbox.productbox-column .productbox-images .square-image .inner picture,
.productbox.productbox-column .productbox-images .square-image .inner img {
    border-radius: inherit;
}

/* Links Sterne/Liefertermin, rechts rechtsbuendig Preis/Bestand. */
.productbox.productbox-column .jtl-card-info {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 12px;
    align-items: start;
    margin-top: 10px;
}

.productbox.productbox-column .jtl-card-info__left,
.productbox.productbox-column .jtl-card-info__right { min-width: 0; }
.productbox.productbox-column .jtl-card-info__right { text-align: right; }
.productbox.productbox-column .jtl-card-info__rating {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    font-size: .84rem;
    line-height: 1.4;
}
.productbox.productbox-column .jtl-card-info__rating .rating,
.productbox.productbox-column .jtl-card-info__no-ratings { white-space: nowrap; }
.productbox.productbox-column .jtl-card-info__rating-count,
.productbox.productbox-column .jtl-card-info__delivery { color: #666; }
.productbox.productbox-column .jtl-card-info__delivery,
.productbox.productbox-column .jtl-card-info__stock {
    margin-top: 6px;
    font-size: .81rem;
    line-height: 1.4;
}
.productbox.productbox-column .jtl-card-info__stock .status { display: inline-block; }
.productbox.productbox-column .jtl-card-info__price .productbox-price { font-weight: 700; }
.productbox.productbox-column .jtl-card-info__action { margin-top: 14px; }
.productbox.productbox-column .jtl-card-info__action .btn {
    display: block;
    width: 100%;
    white-space: normal;
}
@media (max-width: 575.98px) {
    .productbox.productbox-column .jtl-card-info { gap: 7px; }
    .productbox.productbox-column .jtl-card-info__rating,
    .productbox.productbox-column .jtl-card-info__delivery,
    .productbox.productbox-column .jtl-card-info__stock { font-size: .74rem; }
}

/* Artikelkacheln v1.1: Ampelfarben aus NOVA-Detailansicht.
   Durch die Klasse .delivery-status greifen die bestehenden Originalfarben:
   status-0: rot, status-1: braunorange, status-2: gruen. */

/* Bewertete Artikel: gefuellte und halbe Sterne orange, leere Sterne grau. */
.productbox.productbox-column .jtl-card-info__rating .rating .fas.fa-star,
.productbox.productbox-column .jtl-card-info__rating .rating .fas.fa-star-half-alt {
    color: #ff9800;
}
.productbox.productbox-column .jtl-card-info__rating .rating .far.fa-star,
.productbox.productbox-column .jtl-card-info__no-ratings {
    color: #9a9a9a;
}
/* NOVAChild v1.3: Grundpreis/referenceQuantity ausschliesslich in Kacheln kleiner.
   Schema.org QuantitativeValue (Meta-Tags) bleibt erhalten. */
.productbox.productbox-column .jtl-card-info__price .base-price,
.productbox.productbox-column .jtl-card-info__price [itemprop="referenceQuantity"] {
    font-size: .72rem;
    line-height: 1.35;
}

/* NOVA 5.8.2 vergibt .productbox-hover in der Galerie automatisch.
   Es gibt dort keine separate Einstellung hover_productlist. Sichtbar ist die
   Mengenwahl nur bei aktivem Hover oder Tastatur-/Touch-Fokus. */
.productbox.productbox-column .jtl-card-info__quantity {
    display: none;
    margin: 0 0 9px;
    text-align: left;
}
.productbox.productbox-column.productbox-hover:hover .jtl-card-info__quantity,
.productbox.productbox-column.productbox-hover:focus .jtl-card-info__quantity,
.productbox.productbox-column.productbox-hover:focus-within .jtl-card-info__quantity,
.productbox.productbox-column.productbox-hover.focus .jtl-card-info__quantity {
    display: block;
}
.productbox.productbox-column .jtl-card-info__quantity-label {
    display: block;
    margin: 0 0 4px;
    font-size: .78rem;
}
.productbox.productbox-column .jtl-card-info__quantity .form-counter {
    max-width: 100%;
}
.productbox.productbox-column .jtl-card-info__quantity input.quantity {
    min-width: 0;
    text-align: center;
}

/* ===== NOVAChild Artikelkacheln v1.3: END ===== */

/* ===== NOVAChild Artikelkacheln v1.6: MOBILE GRID REFLOW / CACHE FALLBACK =====
   Gleichlautend am Ende von my-nova.css UND custom.css, weil JTL je nach
   Theme/Minify-Konfiguration die vorkompilierte Datei oder das Bundle ausliefert.
   Gilt nur fuer die 2-spaltige Artikel-Galerie auf Smartphone/kleinen Tablets.
   Der Grid-Container bestimmt seine Zeilenhoehe aus der TATSAECHLICHEN Kartenhoehe.
   Bei NOVA .transition/.focus/.pos-abs darf keine Karte aus dem Fluss fallen.
   Die internen absolut positionierten Bildcontainer bleiben unangetastet. */
@media (max-width: 767.98px) {
    #product-list.layout-gallery {
        --nova-mobile-reflow-version: 1.6;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: max-content;
        align-items: start;
        /* JTL-/Bootstrap-.row-Margins bleiben erhalten. */
    }

    #product-list.layout-gallery > .product-wrapper {
        box-sizing: border-box;
        display: block;
        width: 100%;
        min-width: 0;
        max-width: none;
        height: auto !important;
        min-height: 0;
        align-self: start;
        flex: none !important;
    }

    /* Spezifisch auch die durch JTL bei Variantenauswahl angehaengten
       Klassen .transition, .focus und den :focus-Zustand ueberstimmen. */
    #product-list.layout-gallery > .product-wrapper > .productbox.productbox-column,
    #product-list.layout-gallery > .product-wrapper > .productbox.productbox-column.productbox-show-variations.transition,
    #product-list.layout-gallery > .product-wrapper > .productbox.productbox-column.productbox-show-variations:focus,
    #product-list.layout-gallery > .product-wrapper > .productbox.productbox-column.productbox-show-variations.focus {
        position: relative !important;
        inset: auto !important;
        display: block;
        width: 100% !important;
        height: auto !important;
        min-height: 0;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
    }

    #product-list.layout-gallery > .product-wrapper > .productbox.productbox-column > form.form-basket,
    #product-list.layout-gallery > .product-wrapper > .productbox.productbox-column > form.form-basket > .productbox-inner,
    #product-list.layout-gallery > .product-wrapper > .productbox.productbox-column > form.form-basket > .productbox-inner.pos-abs {
        position: relative !important;
        inset: auto !important;
        display: block;
        width: 100% !important;
        height: auto !important;
        min-height: 0;
        max-height: none !important;
        overflow: visible;
        transform: none !important;
    }

    #product-list.layout-gallery .productbox.productbox-column .jtl-card-info__action {
        position: static !important;
        display: block;
        min-width: 0;
        height: auto !important;
        max-height: none !important;
        overflow: visible;
        margin-bottom: 0;
    }
    #product-list.layout-gallery .productbox.productbox-column .jtl-card-info__action .btn {
        max-width: 100%;
        min-width: 0;
        white-space: normal;
        overflow-wrap: anywhere;
    }
}

/* Auf echten Touchgeraeten keine Hoehenaenderung erst DURCH einen Tap:
   Die Menge steht bereits im normal berechneten Kartenlayout. Auf Desktop
   und bei Hover-faehigen Geraeten bleibt der bisherige Hover erhalten. */
@media (max-width: 767.98px) and (hover: none) and (pointer: coarse) {
    #product-list.layout-gallery .productbox.productbox-column .jtl-card-info__quantity {
        display: block;
    }
}
/* ===== NOVAChild Artikelkacheln v1.6: END ===== */

/* ===== NOVAChild Artikelkacheln v1.7: DESKTOP HOVER / ZEILENABSTAND =====
   Unabhaengig davon, ob Karten serverseitig oder via Endless Scroll kommen,
   soll die Desktop-Galerie dieselben Abstaende zwischen den Zeilen besitzen.
   Der Hover-Layer wird bei nachgeladenen Kacheln in seo-endless.js normalisiert.
   Mobil (bis 767,98 px) bleibt der bewaehrte v1.6-Grid-Reflow unberuehrt. */
@media (min-width: 768px) {
    #product-list.layout-gallery {
        --nova-desktop-hover-version: 1.7;
        row-gap: 3rem;
    }
    #product-list.layout-gallery > .product-wrapper {
        /* NOVA: :not(:last-child) hat 4rem margin-bottom.
           Ein spaeterer Append veraendert sonst die ehemalige letzte Kachel.
           Einheitlich den Abstand ueber row-gap festlegen. */
        margin-bottom: 0;
    }
}
/* ===== NOVAChild Artikelkacheln v1.7: END ===== */

/* ===== Stoppball Readmore v3.2 – NOVA / Bootstrap 4 Collapse =====
 * 70 Woerter mobil, 130 Woerter Desktop; nur Produktbeschreibung.
 * Ohne JavaScript oder bei kurzen Texten bleibt die volle Beschreibung sichtbar.
 */
.sb-readmore-controls {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin: 0.75rem 0 1.25rem;
    clear: both;
}
.sb-readmore-button[data-toggle="collapse"] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    width: auto;
    margin: 0;
    padding: 0.25rem 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #007bff;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.5;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}
.sb-readmore-button[data-toggle="collapse"]:hover {
    color: #0056b3;
    text-decoration: none;
}
.sb-readmore-button[data-toggle="collapse"]:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
}
.sb-readmore-ellipsis { display: inline; }
.sb-readmore-expanded .sb-readmore-ellipsis { display: none !important; }
/* Nur Bootstrap's Standard-Transition anpassen, keine eigene Animation. */
.sb-readmore-rest.collapsing {
    transition: height 0.45s ease;
}
.sb-readmore-rest > :first-child { margin-top: 0; }
@media (prefers-reduced-motion: reduce) {
    .sb-readmore-rest.collapsing { transition: none; }
}
/* ===== Stoppball Readmore v3.2: END ===== */