/*
 * ShopDesign 1.9.0 – Mega-Menü B2.1 (Schalter menuDesign). Panel-Design (body.le-mm-v31) + Navigation B (body.le-nb).
 * Tokens = Design-System v2/V3 (--le-*). Ohne die Körperklassen wirkt nichts. Regeln tragen .le-mm-v31.le-hd-v3 bzw.
 * .le-nb.… → stärker als v3/le-header.css, unabhängig von der Ladereihenfolge.
 */
.le-mm-v31 {
    --le-ink: #1b1b1b; --le-text: #3b3934; --le-muted: #777164; --le-label: #5f5a50; --le-gold: #dab44a; --le-gold-deep: #86691d;
    --le-line: #e6e0d2; --le-paper: #faf8f3;
    --le-serif: 'LE Cormorant', 'Cormorant Garamond', Georgia, serif; --le-sans: 'Raleway', 'Open Sans', Arial, sans-serif;
}

/* ================================================================ Mega-Menü ≥ 1024 px */
@media screen and (min-width: 64em) {
    /* Versalziffern auch in Links (V3-Regeln setzen font: als Kurzform → je Element zurückgesetzt, QA D-14) */
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31, .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 * { font-variant-numeric: lining-nums; }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .button-container { padding-bottom: 14px; }
    /* Startseite: le-home.css setzt .content--wrapper auf padding 0 !important – im Panel zurückholen (QA D-01) */
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .content--wrapper { gap: 40px; padding: 22px 0 24px !important; align-items: flex-start; }
    /* Clearfix ist hier ein Flex-Kind und verdoppelt den Abstand rechts (QA D-08) */
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .content--wrapper::after { content: none; display: none; }
    /* Festes Raster (kein Spaltenausgleich, der beim Hover umbrechen könnte – QA A-01) */
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--list.menu--level-0 {
        display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 40px; align-items: start; columns: auto; column-count: auto;
    }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--list.menu--level-0.le-hd-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--list.menu--level-0.le-hd-cols-1 { grid-template-columns: minmax(0, 1fr); }

    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--level-0 > .item--level-0 { display: block; margin: 0; padding: 0; list-style: none; }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .item--level-0 > .menu--list-item-link { font-size: 18.5px; margin-bottom: 6px; }
    /* Unterpunkte: Hover ändert nur die Farbe/Unterstreichung, nie die Höhe (QA A-01); Umbrüche enger als der Eintragsabstand (QA D-09) */
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .item--level-1 > .menu--list-item-link,
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .item--level-1 > .menu--list-item-link:hover {
        display: block; line-height: 1.35; padding: 4px 0 5px; border-bottom: 0 !important;
        text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; text-decoration-thickness: 1px;
    }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .item--level-1 > .menu--list-item-link:hover { text-decoration-color: var(--le-gold); }

    /* Teaser-Karte mit Bild (nur ≥ 1260 px – darunter bleibt V-03: kein Teaser) */
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--teaser { display: flex !important; flex-direction: column; width: 260px !important; flex: 0 0 260px; padding: 0 0 0 28px; }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--teaser::before { margin: 2px 0 10px; }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .le-hd-teaser__media {
        display: block !important; position: static !important; width: 100% !important; height: auto !important; aspect-ratio: 16 / 10;
        margin: 0 0 12px; background: var(--le-paper) !important; overflow: hidden; cursor: pointer;
    }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .le-hd-teaser__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--teaser:hover .le-hd-teaser__media img { transform: scale(1.03); }
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .teaser--headline { font-size: 18px; line-height: 1.3; text-wrap: balance; }
}
@media screen and (min-width: 64em) and (max-width: 78.74em) {
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--teaser { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
    .le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .le-hd-teaser__media img { transition: none; }
}

/* ================================================================ Navigation B2.1 */
.le-nb {
    --le-ink: #1b1b1b; --le-text: #3b3934; --le-muted: #777164; --le-label: #5f5a50; --le-gold: #dab44a; --le-gold-deep: #86691d;
    --le-line: #e6e0d2; --le-paper: #faf8f3;
    --le-serif: 'LE Cormorant', 'Cormorant Garamond', Georgia, serif; --le-sans: 'Raleway', 'Open Sans', Arial, sans-serif;
}
@media screen and (min-width: 64em) {
    /* vier Gruppen: schmalere Teaser-Karte, engere Abstände → Spalten ≈ 190 px (QA DB-03) */
    .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--list.menu--level-0.le-hd-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px 24px; }
    .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .le-nb-panel.le-nb-cols4 .content--wrapper { gap: 32px; }
    .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .le-nb-panel.le-nb-cols4 .menu--teaser { width: 220px !important; flex: 0 0 220px; padding-left: 24px; }
    /* Gruppenköpfe sind Überschriften (kein Ziel) */
    .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .le-nb-head { cursor: default; }
    .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .le-nb-head:hover { color: var(--le-ink) !important; }
    /* „Alle …“ am Listenende: Link-Hinweis; Pfeil nicht vorlesen (QA A11Y-05) */
    .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .le-nb-all > .menu--list-item-link { color: var(--le-gold-deep) !important; font-weight: 600 !important; }
    .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .le-nb-all > .menu--list-item-link::after { content: '\00a0→'; content: '\00a0→' / ''; }
    /* aktuelles Ziel */
    .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--list-item-link[aria-current="page"] { color: var(--le-ink) !important; font-weight: 600; text-decoration: underline; text-decoration-color: var(--le-gold-deep); text-decoration-thickness: 2px; }
    /* Marke im Teaser (z. B. LE Projects) statt „Bereich“ */
    .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .le-hd-panel.le-hd-v31 .menu--teaser[data-eyebrow]::before { content: attr(data-eyebrow); }
}
/* 1024–1259 px: Hauptleiste mit acht Punkten – „Home“ entfällt (Logo führt zur Startseite), Abstände etwas enger (QA A11Y-06) */
@media screen and (min-width: 64em) and (max-width: 78.74em) {
    .le-nb.le-hd-v3 .navigation-main .navigation--entry.is--home { display: none; }
    .le-nb.le-hd-v3 .navigation-main .navigation--link,
    .le-nb.le-hd-v3 .navigation-main .navigation--list .navigation--entry.is--hovered .navigation--link { padding-left: 8px; padding-right: 8px; }
    .le-nb.le-hd-v3 .navigation-main .navigation--link::after { left: 8px; right: 8px; }
    /* Logo (bis x≈67 px) frei halten: Leiste zentriert im Raum rechts davon (QA A11Y-06, WCAG 1.4.12) */
    .le-nb.le-hd-v3 .navigation-main .navigation--list.container { padding-left: 80px; padding-right: 10px; }
}

/* ---------------------------------------------------------------- Off-Canvas (< 1024 px): Akkordeon */
/* Geschlossenes Off-Canvas: per inert (le-nav-b.js) aus Tab-Reihenfolge und Accessibility-Tree – die Schiebe-Animation des
   Themes bleibt unberührt (QA A11Y-01, P-B2-01). */
.le-nb .sidebar-main .le-nb-oc { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--le-line); }
.le-nb .sidebar-main .le-nb-oc__item { margin: 0; padding: 0; border-bottom: 1px solid var(--le-line); }
.le-nb .sidebar-main .le-nb-oc__toggle, .le-nb .sidebar-main .le-nb-oc__link {
    display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; padding: 14px 20px;
    font: 500 17px/1.3 var(--le-sans); color: var(--le-ink) !important; background: #fff; border: 0; text-align: left; cursor: pointer; text-decoration: none;
}
.le-nb .sidebar-main .le-nb-oc__item.is--current > .le-nb-oc__toggle { font-weight: 600; }
.le-nb .sidebar-main .le-nb-oc__toggle::after {
    content: ''; width: 9px; height: 9px; border-right: 1.5px solid var(--le-gold-deep); border-bottom: 1.5px solid var(--le-gold-deep);
    transform: rotate(45deg); margin: -4px 4px 0 12px; transition: transform .18s;
}
.le-nb .sidebar-main .le-nb-oc__toggle[aria-expanded="true"]::after { transform: rotate(-135deg); margin-top: 4px; }
.le-nb .sidebar-main .le-nb-oc__toggle:focus-visible, .le-nb .sidebar-main .le-nb-oc a:focus-visible { outline: 2px solid var(--le-ink); outline-offset: -2px; }
.le-nb .sidebar-main .le-nb-oc__panel { padding: 4px 20px 18px; background: var(--le-paper); }
.le-nb .sidebar-main .le-nb-oc__panel[hidden] { display: none; }
.le-nb .sidebar-main .le-nb-oc__all { display: flex; align-items: center; min-height: 44px; margin: 4px 0 0; font: 700 12px/1.3 var(--le-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--le-gold-deep) !important; text-decoration: none; }
.le-nb .sidebar-main .le-nb-oc__group { margin: 16px 0 4px; font: 600 17px/1.25 var(--le-serif); color: var(--le-ink); }
.le-nb .sidebar-main .le-nb-oc__panel ul { list-style: none; margin: 0; padding: 0; }
.le-nb .sidebar-main .le-nb-oc__panel li a { display: flex; align-items: center; min-height: 44px; padding: 8px 0; font: 400 15.5px/1.35 var(--le-sans); color: var(--le-text) !important; text-decoration: none; }
.le-nb .sidebar-main .le-nb-oc__panel li + li a { border-top: 1px solid var(--le-line); }
.le-nb .sidebar-main .le-nb-oc__panel li.le-nb-oc__alle a { color: var(--le-gold-deep) !important; font-weight: 600; }
.le-nb .sidebar-main .le-nb-oc__panel li.le-nb-oc__alle a::after { content: '\00a0→'; content: '\00a0→' / ''; }
.le-nb .sidebar-main .le-nb-oc a[aria-current="page"] { font-weight: 600; color: var(--le-ink) !important; box-shadow: inset 3px 0 0 var(--le-gold); padding-left: 10px; }
/* Seiten mit Seitenleisten-Spalte (Newsletter, Sitemap, Rechtsseiten, Konto …): Auf der Seite bleibt der Theme-Kategorienbaum
   (.le-nb-keep, Sichtbarkeit wie bisher vom Theme gesteuert), das B-Akkordeon gibt es dort nur im geöffneten Off-Canvas bzw. unter
   768 px, wo die Seitenleiste nur Off-Canvas ist (Betreiberentscheid zu ADV-06; ersetzt die NP-02-Regel) */
@media screen and (max-width: 47.99em) { .le-nb .sidebar-main .le-nb-keep { display: none !important; } }
.le-nb .sidebar-main.is--open .le-nb-keep { display: none !important; }
@media screen and (min-width: 48em) { .le-nb .sidebar-main:not(.is--open) .le-nb-keep ~ .le-nb-oc { display: none; } }
/* Tablet 768–1023 px, Menü geschlossen: Wo das Theme-Plugin den Wrapper bisher ausblendete (Rechtsseiten, Unterkategorien), bleibt er
   eingeklappt – sonst belegte die geschlossene Seitenleiste dort zusätzlichen Platz (+128 px auf Impressum/AGB) */
@media screen and (min-width: 48em) and (max-width: 63.99em) { .le-nb .sidebar-main:not(.is--open) .le-nb-oc-wrap.le-nb-ist-zu { display: none; } }
/* Fokus auf „Menü schließen“: Gold statt dunkel auf dunkel (QA A11Y-12) */
.le-nb .sidebar-main .entry--close-off-canvas a:focus-visible { outline: 2px solid var(--le-gold) !important; outline-offset: -3px; }
@media (forced-colors: active) {
    .le-nb .sidebar-main .le-nb-oc a[aria-current="page"], .le-nb.le-mm-v31.le-hd-v3 .advanced-menu .menu--list-item-link[aria-current="page"] { text-decoration: underline 2px; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
    .le-nb .sidebar-main .le-nb-oc__toggle::after { transition: none; }
    /* Off-Canvas ohne Gleiten (QA A11Y-09); nur bei reduzierter Bewegung, sonst bleibt die Theme-Animation unberührt */
    .le-nb .sidebar-main.off-canvas, .le-nb .page-wrap { transition: none !important; }
}