/*
 * Living Exclusive – Kategorie-/Listing-Seite v2 (LE Shop Design System v2, Referenz: PDP v2 1.0.3 + Inquiry Experience).
 * Tokens/Schriften/Komponenten kommen aus le-shop-design.css. Alles gilt nur unter body.is--le-listing.
 * Keine Regel blendet Kauf-, Filter-, Sortier-, Nachlade- oder Merkzettel-Funktionen aus.
 */

/* ================================================================ Kategorie-Kopf */
.is--le-listing .category--teaser,
.is--le-listing .category--teaser.panel.has--border {
    margin: 0 0 30px;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}
.is--le-listing .category--teaser .hero--headline,
.is--le-listing .category--teaser .hero--headline.panel--title {
    margin: 34px auto 0;
    padding: 0;
    max-width: 900px;
    border: 0 !important;
    font: 600 40px/1.15 var(--le-serif);
    letter-spacing: .005em;
    color: var(--le-ink);
    text-align: center;
    text-wrap: balance;
}
.is--le-listing .category--teaser .hero--headline::after {
    content: '';
    display: block;
    width: 64px;
    margin: 18px auto 0;
    border-top: 1px solid var(--le-gold);
}
.is--le-listing .category--teaser .hero--text {
    max-width: 980px;
    margin: 0 auto;
    padding: 24px 0 0;
    font: 400 15.5px/1.72 var(--le-sans);
    color: var(--le-text);
}
/* Kategorietext aus dem CMS: Inhalt unverändert, nur die Hülle an das Designsystem angleichen */
.is--le-listing .category--teaser .teaser--text-long > div[style] {
    padding: 28px 32px !important;
    border-radius: 0 !important;
    background: var(--le-paper) !important;
    font-family: var(--le-sans) !important;
    color: var(--le-text) !important;
}
.is--le-listing .category--teaser .teaser--text-long h2,
.is--le-listing .category--teaser .teaser--text-long h3 {
    font-family: var(--le-serif) !important;
    font-weight: 600;
    color: var(--le-ink);
}
/* Eingeklappter langer Text (le-listing.js) */
.is--le-listing .category--teaser .hero--text.le-teaser--collapsed:not(.le-teaser--open) {
    position: relative;
    max-height: 300px;
    overflow: hidden;
}
.is--le-listing .category--teaser .hero--text.le-teaser--collapsed:not(.le-teaser--open)::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 110px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff 88%);
    pointer-events: none;
}
.is--le-listing .le-teaser__toggle {
    display: block;
    margin: 14px auto 0;
    padding: 0 0 3px;
    border: 0;
    border-bottom: 1px solid var(--le-gold);
    background: none;
    font: 700 11px/1.4 var(--le-sans);
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--le-ink);
    cursor: pointer;
}
.is--le-listing .le-teaser__toggle:hover { color: var(--le-gold-deep); }
.is--le-listing .le-teaser__toggle:focus-visible { outline: none; box-shadow: var(--le-focus); }

/* ================================================================ Aktionsleiste: Filtern + Sortierung */
.is--le-listing .listing--actions {
    margin: 0 0 28px;
    padding: 14px 0;
    border: 0;
    border-top: 1px solid var(--le-line);
    border-bottom: 1px solid var(--le-line);
    border-radius: 0;
    background: none;
}
.is--le-listing .action--filter-btn .filter--trigger,
.is--le-listing .action--filter-btn .filter--trigger.btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 44px;
    padding: 0 20px;
    border: 1px solid var(--le-gold);
    border-radius: 0;
    background: #fff;
    background-image: none;
    box-shadow: none;
    font: 700 11px/1 var(--le-sans);
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--le-ink);
}
.is--le-listing .action--filter-btn .filter--trigger:before,
.is--le-listing .action--filter-btn .filter--trigger:after { display: none; }
.is--le-listing .action--filter-btn .filter--trigger .action--collapse-icon { display: none; }
.is--le-listing .action--filter-btn .filter--trigger:hover { background: var(--le-paper); border-color: var(--le-gold-deep); color: var(--le-ink); }
.is--le-listing .action--filter-btn .filter--trigger.is--active {
    background: var(--le-ink);
    background-image: none;
    border: 1px solid var(--le-ink);
    color: #fff;
    line-height: 1;
    padding: 0 20px;
}
.is--le-listing .action--filter-btn .filter--trigger .icon--filter { margin: 0; color: var(--le-gold-deep); }
.is--le-listing .action--filter-btn .filter--trigger.is--active .icon--filter { color: var(--le-gold); }
.is--le-listing .action--filter-btn .filter--trigger .action--collapse-icon { background: none; border-radius: 0; color: inherit; }
.is--le-listing .action--sort { margin-bottom: 0; }
.is--le-listing .action--sort .sort--label {
    font: 700 11px/44px var(--le-sans);
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--le-label);
}
.is--le-listing .action--sort .sort--select.select-field { height: auto; border-radius: 0; }
.is--le-listing .action--sort .sort--select select,
.is--le-listing .action--sort select.sort--field {
    height: 44px;
    padding: 0 40px 0 14px;
    border: 1px solid var(--le-field);
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    font: 500 14px/42px var(--le-sans);
    color: var(--le-ink);
}
.is--le-listing .action--sort .sort--select select:hover,
.is--le-listing .action--sort .sort--select select:focus { border-color: var(--le-gold); box-shadow: var(--le-focus); color: var(--le-ink); }
.is--le-listing .action--sort .sort--select:after { height: 42px; line-height: 42px; border-left: 0; color: var(--le-gold-deep); }

/* Filter-Panel (Desktop aufklappbar, mobil Off-Canvas des Themes) */
.is--le-listing .filter--container .filter-panel {
    border: 1px solid var(--le-line);
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}
.is--le-listing .filter--container .filter-panel .filter-panel--title {
    font: 700 11px/1.5 var(--le-sans);
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--le-ink);
}
.is--le-listing .filter--container .filter-panel .filter-panel--icon { color: var(--le-gold-deep); }
.is--le-listing .filter--container .filter-panel.is--collapsed,
.is--le-listing .filter--container .filter-panel:hover { border-color: var(--le-gold); }
.is--le-listing .filter--container .filter-panel--content label,
.is--le-listing .filter--container .filter-panel--option label { font: 400 14px/1.5 var(--le-sans); color: var(--le-text); }
.is--le-listing .filter--container .filter-panel--checkbox input:checked ~ .checkbox--state,
.is--le-listing .filter--container .filter-panel--radio input:checked ~ .radio--state { border-color: var(--le-gold); background: var(--le-gold); }
.is--le-listing .filter--container .range-slider--handle { border-color: var(--le-gold-deep); border-radius: 0; }
.is--le-listing .filter--container .range-slider--range { background: var(--le-gold); }
.is--le-listing .filter--container .filter--btn-apply,
.is--le-listing .filter--container .filter--btn-apply.btn.is--primary {
    border: 1px solid var(--le-ink);
    border-radius: 0;
    background: var(--le-ink);
    background-image: none;
    font: 700 11.5px/1 var(--le-sans);
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #fff;
}
.is--le-listing .filter--container .filter--btn-apply:hover { background: var(--le-gold); border-color: var(--le-gold); color: var(--le-ink); }
.is--le-listing .filter--active-container { margin: 0 0 18px; }
.is--le-listing .filter--active-container .filter--active {
    border: 1px solid var(--le-line);
    border-radius: 0;
    background: var(--le-paper);
    font: 500 12.5px/1.4 var(--le-sans);
    color: var(--le-ink);
}
.is--le-listing .filter--active-container .filter--active:hover { border-color: var(--le-gold); color: var(--le-ink); }
.is--le-listing .filter--active-container .filter--active-icon { color: var(--le-gold-deep); }

/* ================================================================ Produktkarten */
/* Raster: Karten einer Reihe gleich hoch (Theme floatet die Boxen) */
.is--le-listing .listing {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}
.is--le-listing .listing::before,
.is--le-listing .listing::after { content: none; display: none; }
.is--le-listing .listing .product--box { float: none; }

.is--le-listing .listing .product--box .box--content {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-sizing: border-box;
    padding: 0 0 18px;
    border: 1px solid var(--le-line);
    border-radius: 0;
    background: #fff;
    text-align: left;
    color: var(--le-text);
    transition: border-color .25s ease;
}
.is--le-listing .listing .product--box .box--content:hover { border-color: var(--le-gold); }
.is--le-listing .listing .product--box .product--info {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 0;
}

/* Bild: ruhige quadratische Bühne, dezenter Zoom beim Hover */
.is--le-listing .listing .product--box .product--image {
    position: relative;
    display: block;
    width: auto;
    height: auto;
    margin: 0 0 20px;
    padding: 0;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #fff;
    border-bottom: 1px solid var(--le-line);
}
.is--le-listing .listing .product--box .product--image .image--element,
.is--le-listing .listing .product--box .product--image .image--media {
    display: block;
    width: 100%;
    height: 100%;
}
.is--le-listing .listing .product--box .product--image .image--element { position: relative; }
/* Theme positioniert das Bild absolut (max-width 80 %, z-index 500) – hier bildfüllend und unter Badges/Merken */
.is--le-listing .listing .product--box .product--image .image--media img {
    position: absolute;
    top: 0;
    left: 0;
    right: auto;
    bottom: auto;
    z-index: 1;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    margin: 0;
    object-fit: cover;
    transition: transform .6s ease;
}
.is--le-listing .listing .product--box .box--content:hover .product--image .image--media img { transform: scale(1.03); }

/* Titel: Marke (Eyebrow) / Produktname (Serif) / Untertitel. Das LE-Theme ersetzt den Namensblock; der v2-Titel steht
   daher vor dem Preisblock – der Theme-Titel wird nur ausgeblendet, wenn der v2-Titel wirklich vorhanden ist. */
.is--le-listing .listing .product--box .product--info:has(.le-card__title) .product--title:not(.le-card__title) { display: none; }
.is--le-listing .listing .product--box .product--title.le-card__title,
.is--le-listing .listing .product--box .box--content .product--info .product--title.le-card__title {
    display: block;
    box-sizing: border-box;
    width: auto;
    height: auto;
    margin: 0 20px;
    padding: 0;
    overflow: visible;
    white-space: normal;
    text-align: left;
    text-decoration: none;
    font-weight: 400;
    color: var(--le-ink);
}
.is--le-listing .le-card__brand {
    display: block;
    margin: 0 0 7px;
    font: 700 10.5px/1.4 var(--le-sans);
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--le-gold-deep);
}
/* Name und Untertitel werden auf keiner Breite gekürzt (1.1.5: live bei 3 Spalten um 1024–1150 px noch „…“);
   die Preise bleiben über margin-top:auto und den Reihenabgleich in le-listing.js bündig. */
.is--le-listing .le-card__name {
    display: block;
    overflow-wrap: break-word;
    font: 600 21px/1.2 var(--le-serif);
    color: var(--le-ink);
    text-wrap: balance;
    transition: color .2s ease;
}
.is--le-listing .listing .product--box .box--content:hover .le-card__name { color: var(--le-gold-deep); }
.is--le-listing .le-card__sub {
    display: block;
    overflow-wrap: break-word;
    margin-top: 6px;
    font: 400 13px/1.5 var(--le-sans);
    color: var(--le-muted);
}

/* Beschreibungsauszug (Theme-Layout „Standard“) gehört nicht ins Kartenbild – Detailtext steht auf der Produktseite */
.is--le-listing .listing .product--box .product--description { display: none; }
.is--le-listing .listing .product--box .product--rating-container { margin: 8px 20px 0; text-align: left; }

/* Preis */
.is--le-listing .listing .product--box .product--price-info {
    box-sizing: border-box;
    height: auto;
    margin: auto 20px 0;
    padding-top: 22px;
    text-align: left;
}
.is--le-listing .listing .product--box .product--price-info .price--unit { height: auto; font-size: 11.5px; color: var(--le-muted); }
.is--le-listing .listing .product--box .product--price-info .price--unit:empty { display: none; }
.is--le-listing .listing .product--box .product--info .product--price,
.is--le-listing .listing .product--box .box--content .product--info .product--price {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none !important;
    color: var(--le-ink) !important;
    font-size: inherit;
    transition: none;
}
.is--le-listing .listing .product--box .product--price .price--default,
.is--le-listing .listing .product--box .product--price .price--default.is--discount {
    display: inline;
    font: 600 22px/1.2 var(--le-serif);
    color: var(--le-ink);
    font-variant-numeric: lining-nums;
}
.is--le-listing .listing .product--box .product--price .price--pseudo {
    display: inline;
    margin-left: 8px;
    font: 400 13px/1.2 var(--le-sans);
    color: var(--le-muted);
}
.is--le-listing .listing .product--box .product--price .price--pseudo .price--discount {
    display: inline;
    font: inherit;
    color: var(--le-muted);
    text-decoration: line-through;
}

/* Hinweise unter dem Preis: Ausführung/Konfiguration + Lieferinformation (Quelle wie Produktseite) */
.is--le-listing .le-card__meta { box-sizing: border-box; margin: 12px 20px 0; }
.is--le-listing .le-card__hint {
    display: block;
    margin: 0 0 4px;
    font: 700 10.5px/1.5 var(--le-sans);
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--le-label);
}
.is--le-listing .le-card__delivery .product--delivery { margin: 0; padding: 0; }
.is--le-listing .le-card__delivery .delivery--information { margin: 0; font: 400 12.5px/1.55 var(--le-sans); color: var(--le-text); }
.is--le-listing .le-card__delivery .delivery--text { color: var(--le-text); }
.is--le-listing .le-card__delivery .delivery--text-shipping-free { color: var(--le-ok); font-weight: 600; }
.is--le-listing .le-card__delivery .delivery--status-icon { transform: scale(.8); }

/* Merken: kleines Symbol oben rechts auf dem Bild (Funktion unverändert) */
.is--le-listing .listing .product--box .product--actions {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 6;
    margin: 0;
    padding: 0;
    overflow: visible;
}
.is--le-listing .listing .product--box .product--actions form { display: block; }
.is--le-listing .listing .product--box .product--actions .action--note {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--le-line);
    border-radius: 0;
    background: rgba(255, 255, 255, .94);
    color: var(--le-gold-deep);
    font-size: 14px;
    transition: border-color .2s ease, background-color .2s ease;
}
.is--le-listing .listing .product--box .product--actions .action--note:hover { border-color: var(--le-gold); background: #fff; }
.is--le-listing .listing .product--box .product--actions .action--note .action--text {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}
.is--le-listing .listing .product--box .product--actions .action--note i { margin: 0; }
.is--le-listing .listing .product--box .product--actions .action--compare { display: none; }

/* Badges: ruhige Etiketten statt farbiger Flaggen; Texte bleiben die des Shops */
.is--le-listing .listing .product--box .product--badges {
    top: 12px;
    left: 12px;
    z-index: 6;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
.is--le-listing .listing .product--box .product--badges .product--badge,
.is--le-listing .listing .product--box .box--content .product--badges .product--badge {
    position: static;
    margin: 0;
    padding: 6px 10px;
    border: 1px solid var(--le-line);
    border-radius: 0;
    background: rgba(255, 255, 255, .95);
    box-shadow: none;
    font: 700 10px/1.2 var(--le-sans);
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--le-ink);
    float: none;
}
.is--le-listing .listing .product--box .box--content .product--badges .badge--recommend { background: rgba(255, 255, 255, .95); border-color: var(--le-ink); color: var(--le-ink); }
.is--le-listing .listing .product--box .product--badges .badge--newcomer,
.is--le-listing .listing .product--box .box--content .product--badges .badge--newcomer { background: var(--le-gold); border-color: var(--le-gold); color: var(--le-ink); }
.is--le-listing .listing .product--box .box--content .product--badges .badge--discount { border-color: var(--le-ink); background: var(--le-ink); color: #fff; }
.is--le-listing .listing .product--box .product--badges .badge--discount i { display: none; }
.is--le-listing .listing .product--box .product--badges .badge--discount::after { content: 'Sale'; }
.is--le-listing .listing .product--box .box--content .product--badges .product--badge.badge--showroom {
    padding: 6px 10px;
    font-size: 9.5px;
    color: var(--le-ink);
    background: rgba(250, 248, 243, .96);
}
.is--le-listing .listing .product--box .product--badges .product--badge.badge--showroom i { margin-right: 6px; font-size: 8px; color: var(--le-gold-deep); }
/* Reihenfolge: Sale, Neu, Tipp, Projekt/Beratung, Showroom */
.is--le-listing .listing .product--box .product--badges .badge--discount { order: 1; }
.is--le-listing .listing .product--box .product--badges .badge--newcomer { order: 2; }
.is--le-listing .listing .product--box .product--badges .badge--recommend { order: 3; }
.is--le-listing .listing .product--box .product--badges .le-badge--project,
.is--le-listing .listing .product--box .product--badges .le-badge--consult { order: 4; }
.is--le-listing .listing .product--box .product--badges .le-badge--showroom,
.is--le-listing .listing .product--box .product--badges .badge--showroom { order: 5; }
/* Eigenes Showroom-Badge ersetzt das Theme-Badge nur, wo es vorhanden ist */
.is--le-listing .listing .product--box .product--badges:has(.le-badge--showroom) .badge--showroom { display: none; }
.is--le-listing .listing .product--box .box--content .product--badges .le-badge--showroom {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(250, 248, 243, .96);
    color: var(--le-ink);
}
.is--le-listing .listing .product--box .box--content .product--badges .le-badge--showroom i { font-size: 8px; color: var(--le-gold-deep); }
.is--le-listing .le-badge--showroom .le-badge__short { display: none; }
.is--le-listing .listing .product--box .box--content .product--badges .le-badge--consult,
.is--le-listing .listing .product--box .box--content .product--badges .le-badge--project { border-color: var(--le-gold); color: var(--le-gold-deep); }

/* ================================================================ Nachladen, leere Zustände */
.is--le-listing .infinite--actions { margin: 10px 0 30px; }
.is--le-listing .infinite--actions .btn,
.is--le-listing .infinite--actions .js--load-more,
.is--le-listing .infinite--actions .js--load-previous {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 30px;
    border: 1px solid var(--le-gold);
    border-radius: 0;
    background: #fff;
    background-image: none;
    box-shadow: none;
    font: 700 11.5px/1 var(--le-sans);
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--le-ink);
}
.is--le-listing .infinite--actions .btn:hover { background: var(--le-paper); border-color: var(--le-gold-deep); color: var(--le-ink); }
.is--le-listing .listing--paging .paging--link {
    border: 1px solid var(--le-line);
    border-radius: 0;
    background: #fff;
    color: var(--le-ink);
}
.is--le-listing .listing--paging .paging--link.is--active { background: var(--le-ink); border-color: var(--le-ink); color: #fff; }
.is--le-listing .listing-no-filter-result .alert,
.is--le-listing .listing--content > .alert.is--info {
    padding: 16px 20px;
    border: 1px solid var(--le-line);
    border-left: 2px solid var(--le-gold);
    border-radius: 0;
    background: var(--le-paper);
    color: var(--le-text);
    font: 400 14px/1.6 var(--le-sans);
}
.is--le-listing .listing-no-filter-result .alert .alert--icon { color: var(--le-gold-deep); }

/* ================================================================ Mobil: zwei Spalten, kompakte Karten */
@media screen and (max-width: 47.9375em) {
    .is--le-listing .category--teaser .hero--headline,
    .is--le-listing .category--teaser .hero--headline.panel--title { margin-top: 22px; font-size: 29px; }
    .is--le-listing .category--teaser .hero--text { padding: 16px 16px 0; font-size: 15px; }
    .is--le-listing .listing--actions { padding: 10px 0; margin-bottom: 18px; }
    .is--le-listing .listing .product--box,
    .is--le-listing .listing .product--box.box--image {
        width: 50%;
        padding: 0 5px 12px;
    }
    .is--le-listing .listing .product--box .box--content { padding-bottom: 14px; }
    .is--le-listing .listing .product--box .product--image { margin-bottom: 14px; }
    .is--le-listing .listing .product--box .product--title.le-card__title,
    .is--le-listing .listing .product--box .box--content .product--info .product--title.le-card__title { margin: 0 12px; }
    .is--le-listing .le-card__brand { margin-bottom: 4px; font-size: 9px; letter-spacing: .16em; }
    .is--le-listing .le-card__name { font-size: 16.5px; line-height: 1.2; }
    .is--le-listing .le-card__sub { font-size: 12px; margin-top: 4px; }
    /* Schmale Zwei-Spalten-Karten: lange SEO-Namen (bis 5 Zeilen) mit Silbentrennung */
    .is--le-listing .le-card__name,
    .is--le-listing .le-card__sub { hyphens: auto; }
    .is--le-listing .listing .product--box .product--price-info { margin: auto 12px 0; padding-top: 14px; }
    .is--le-listing .listing .product--box .product--price .price--default,
    .is--le-listing .listing .product--box .product--price .price--default.is--discount { font-size: 18px; }
    .is--le-listing .listing .product--box .product--price .price--pseudo { display: block; margin: 2px 0 0; font-size: 11.5px; }
    .is--le-listing .le-card__meta { margin: 9px 12px 0; }
    .is--le-listing .le-card__hint { font-size: 9.5px; letter-spacing: .1em; }
    .is--le-listing .le-card__delivery .delivery--information { font-size: 11.5px; }
    .is--le-listing .listing .product--box .product--badges { top: 8px; left: 8px; gap: 4px; }
    .is--le-listing .listing .product--box .product--badges .product--badge,
    .is--le-listing .listing .product--box .box--content .product--badges .product--badge { padding: 4px 7px; font-size: 8.5px; letter-spacing: .12em; }
    .is--le-listing .le-badge--showroom .le-badge__long { display: none; }
    .is--le-listing .le-badge--showroom .le-badge__short { display: inline; }
    /* Theme-Badge (Fallback, falls kein eigenes Showroom-Badge): mobil als kurzes Etikett */
    .is--le-listing .listing .product--box .box--content .product--badges .product--badge.badge--showroom {
        position: relative;
        font-size: 0;
        letter-spacing: 0;
    }
    .is--le-listing .listing .product--box .box--content .product--badges .product--badge.badge--showroom i { font-size: 7px; margin-right: 4px; }
    .is--le-listing .listing .product--box .box--content .product--badges .product--badge.badge--showroom::after {
        content: 'Showroom';
        font: 700 8.5px/1.2 var(--le-sans);
        letter-spacing: .12em;
        text-transform: uppercase;
    }
    .is--le-listing .listing .product--box .product--actions { top: 8px; right: 8px; }
    .is--le-listing .listing .product--box .product--actions .action--note { width: 32px; height: 32px; }
}

@media (prefers-reduced-motion: reduce) {
    .is--le-listing .listing .product--box * { transition: none !important; }
}