/*
 * Max Blank Preisanzeige – Übersichtsseiten (Produktkategorien), Darstellung „E2 Katalog-Beschriftung“.
 * Greift nur mit body.mbpa-liste (serverseitig gesetzt, wenn die Preisanzeige für diesen Besucher aktiv ist).
 */

/* Kopf: Dachzeile (rot), Überschrift Light, Preishinweis rechtsbündig */
body.mbpa-liste .mbpa-l-titel { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 40px; margin: 0 0 56px; }
body.mbpa-liste .mbpa-l-titel__text { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
body.mbpa-liste .mbpa-l-dach { font-size: 11px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: #ab182e; line-height: 1.2; }
body.mbpa-liste .product-listing .category-headline { font-size: 3.8rem; font-weight: 300; letter-spacing: -.3px; line-height: 1.1; }
body.mbpa-liste .mbpa-l-titel .category-headline { margin: 0; }
body.mbpa-liste .mbpa-l-hinweis { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; margin-left: auto; text-align: right; min-height: 38px; }
body.mbpa-liste .mbpa-l-hinweis__1 { font-size: 10.5px; font-weight: 600; letter-spacing: 1.8px; text-transform: uppercase; color: #6b6b6b; line-height: 1.3; }
body.mbpa-liste .mbpa-l-hinweis__2 { font-size: 14px; color: #222; line-height: 1.4; }

/* Raster: mehr Zeilenabstand */
body.mbpa-liste .product-listing__list { row-gap: 72px; }

/* Kachel: Hochformat 4:5 */
body.mbpa-liste .product-listing__list .product { text-align: left; }
body.mbpa-liste .product-listing__list .product__link { display: flex; flex-direction: column; color: #000; text-decoration: none; }
body.mbpa-liste .product-listing__list .product__link__image { margin-bottom: 20px; overflow: hidden; }
body.mbpa-liste .product-listing__list .product__link__image::before { padding-top: 125%; }
body.mbpa-liste .product-listing__list .product__link__image img { max-height: 86%; transition: transform .7s ease; }
body.mbpa-liste .product-listing__list .product__link:hover img { margin-top: 0; transform: translate(-50%, -50%) scale(1.03); }

/* Beschriftung: Linie, Name links, Preis rechts */
body.mbpa-liste .product-listing__list .product__link__name { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-top: 14px; border-top: 1px solid #000; font-size: 18px; font-weight: 500; letter-spacing: .2px; line-height: 1.3; transition: border-color .3s ease; }
body.mbpa-liste .product-listing__list .product__link:hover .product__link__name { border-top-color: #ab182e; }
body.mbpa-liste .product-listing__list .product__link__name svg { display: none; }
body.mbpa-liste .mbpa-l-preis { display: inline-flex; align-items: baseline; gap: 6px; white-space: nowrap; font-variant-numeric: tabular-nums; flex: 0 0 auto; }
body.mbpa-liste .mbpa-l-preis__ab { font-size: 10.5px; font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; color: #6b6b6b; }
body.mbpa-liste .mbpa-l-preis__wert { font-size: 18px; font-weight: 300; color: #000; }
body.mbpa-liste .mbpa-l-preis--anfrage { font-size: 10.5px; font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; color: #6b6b6b; }
body.mbpa-liste .mbpa-l-preis--laden { display: block; width: 92px; height: 17px; background: #ececec; animation: mbpa-l-puls 1.4s ease-in-out infinite; }
@keyframes mbpa-l-puls { 0% { opacity: .45; } 50% { opacity: 1; } 100% { opacity: .45; } }

/* „Ausführung wählen →“ beim Überfahren (Text per Inline-Stil in der Seitensprache) */
body.mbpa-liste .product-listing__list .product__link::after { display: block; margin-top: 10px; font-size: 13px; font-weight: 500; letter-spacing: .3px; color: #ab182e; opacity: 0; transform: translateY(-4px); transition: opacity .3s ease, transform .3s ease; }
body.mbpa-liste .product-listing__list .product__link:hover::after,
body.mbpa-liste .product-listing__list .product__link:focus-visible::after { opacity: 1; transform: none; }
body.mbpa-liste .product-listing__list .product__link:focus-visible { outline: 2px solid #ab182e; outline-offset: 8px; }

/* Abschluss: Linie, Hinweis, Rahmen-Button */
body.mbpa-liste .mbpa-l-fuss { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; margin: 0 auto 80px; padding-top: 36px; border-top: 1px solid #000; }
body.mbpa-liste .mbpa-l-fuss__text { margin: 0; max-width: 620px; font-size: 14px; line-height: 1.65; color: #444; }
body.mbpa-liste .mbpa-l-fuss__text + .mbpa-l-fuss__text { margin-top: 6px; }
body.mbpa-liste .mbpa-l-fuss__btn { display: inline-flex; align-items: center; min-height: 48px; padding: 0 26px; border: 1px solid #000; color: #000; text-decoration: none; font-size: 14px; font-weight: 600; letter-spacing: .3px; transition: background .2s ease, color .2s ease; }
body.mbpa-liste .mbpa-l-fuss__btn:hover, body.mbpa-liste .mbpa-l-fuss__btn:focus-visible { background: #000; color: #fff; }

/* Händlerpreise des Händlershops nicht doppelt zeigen (nur Testansicht von Admins betroffen) */
body.mbpa-liste .mbhs-lprice, body.mbpa-liste .mbhs-lprice-hint { display: none !important; }

/* Smartphone: Preis unter dem Namen, Hinweis linksbündig */
@media (max-width: 767px) {
	body.mbpa-liste .mbpa-l-titel { margin-bottom: 28px; }
	body.mbpa-liste .product-listing .category-headline { font-size: 2.8rem; line-height: 1.15; }
	body.mbpa-liste .mbpa-l-hinweis { align-items: flex-start; margin-left: 0; text-align: left; min-height: 0; }
	body.mbpa-liste .product-listing__list { row-gap: 36px; }
	body.mbpa-liste .product-listing__list .product__link__image { margin-bottom: 12px; }
	body.mbpa-liste .product-listing__list .product__link__name { flex-direction: column; align-items: flex-start; gap: 3px; padding-top: 9px; font-size: 15px; }
	body.mbpa-liste .mbpa-l-preis__ab { font-size: 9.5px; letter-spacing: 1.3px; }
	body.mbpa-liste .mbpa-l-preis__wert { font-size: 15px; }
	body.mbpa-liste .mbpa-l-preis--anfrage { font-size: 9.5px; letter-spacing: 1.3px; white-space: normal; }
	body.mbpa-liste .product-listing__list .product__link::after { display: none; }
	body.mbpa-liste .mbpa-l-fuss { flex-direction: column; align-items: stretch; padding-top: 18px; margin-bottom: 48px; }
	body.mbpa-liste .mbpa-l-fuss__text { font-size: 12.5px; }
	body.mbpa-liste .mbpa-l-fuss__btn { justify-content: center; }
}
@media (max-width: 380px) {
	body.mbpa-liste .product-listing__list .product { margin-bottom: 36px; }
}
@media (prefers-reduced-motion: reduce) {
	body.mbpa-liste .product-listing__list .product__link__image img,
	body.mbpa-liste .product-listing__list .product__link__name,
	body.mbpa-liste .product-listing__list .product__link::after { transition: none; }
	body.mbpa-liste .mbpa-l-preis--laden { animation: none; }
}