/*
 * ShopDesign V3 (Vorschau) – Startseite v2. Alles unter body.le-hm-v3 (Schalter homeMode). Tokens = Design-System v2,
 * Hero-/Showroom-Split = Einkaufswelt v2 (Text 42 % | Bild 58 %), Produktkarten = Listing v2 (le-listing.css).
 */
.le-hm-v3 {
    --le-ink: #1b1b1b; --le-text: #3b3934; --le-muted: #777164; --le-label: #5f5a50; --le-gold: #dab44a; --le-gold-deep: #86691d; /* 1.7.3 V-05: #9c7c25 erreichte auf Hell nur 3,4–3,9:1, jetzt ≥ 4,5:1 */
    --le-line: #e6e0d2; --le-paper: #faf8f3; --le-serif: 'LE Cormorant', 'Cormorant Garamond', Georgia, serif;
    --le-sans: 'Raleway', 'Open Sans', Arial, sans-serif;
    --hm-on-dark: #d9d4c8; --hm-lead: 1160px; --hm-pad: max(20px, calc((100vw - var(--hm-lead)) / 2));
}
.le-hm-v3 .content-main, .le-hm-v3 .content-main--inner, .le-hm-v3 .content--wrapper, .le-hm-v3 .content.content--home { max-width: none !important; width: 100% !important; padding: 0 !important; margin: 0 !important; background: #fff; }
.le-hm-v3 .content-main { box-shadow: none !important; border: 0 !important; }
.le-hm { font-family: var(--le-sans); color: var(--le-text); }
.le-hm *, .le-hm *::before, .le-hm *::after { box-sizing: border-box; }
.le-hm :where(img) { display: block; max-width: 100%; }
.le-hm :where(ul) { list-style: none; margin: 0; padding: 0; }
.le-hm :where(a) { text-decoration: none; }
/* Theme-Überschriften (Farbe/Schnitt) neutralisieren */
.le-hm-v3 .le-hm h1, .le-hm-v3 .le-hm h2, .le-hm-v3 .le-hm h3 { text-transform: none; font-weight: 500; }
.le-hm a:focus-visible { outline: 2px solid var(--le-ink); outline-offset: 3px; }
.le-hm-hero a:focus-visible, .le-hm-showroom a:focus-visible { outline-color: var(--le-gold); }

/* Bausteine */
/* 1.7.3 A-03: am Inhaltscontainer, damit die Header-Variable (.le-hd-v3 am body) sie nicht überschreibt */
.le-hm-v3 #le-home { --le-gold-deep: #86691d; }
.le-hm-eyebrow { display: flex; align-items: center; gap: 14px; margin: 0 0 16px; font: 700 11px/1.3 var(--le-sans); letter-spacing: .26em; text-transform: uppercase; color: var(--le-gold); }
.le-hm-eyebrow::after { content: ''; width: 48px; height: 1px; background: currentColor; flex: 0 0 auto; }
.le-hm-eyebrow--dark { color: var(--le-gold-deep); }
.le-hm-v3 .le-hm .le-hm-h2 { margin: 0; font: 500 32px/1.15 var(--le-serif); color: var(--le-ink); letter-spacing: -.005em; text-wrap: balance; }
.le-hm-v3 .le-hm .le-hm-h2--light { color: #fff; font-size: 38px; }
.le-hm-note { margin: 10px 0 0; font-size: 14px; line-height: 1.6; color: var(--le-muted); }
.le-hm-head { max-width: var(--hm-lead); margin: 0 auto 28px; padding: 0 20px; }
.le-hm-head--split { display: flex; justify-content: space-between; align-items: flex-end; gap: 28px; }
.le-hm-head__links { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.le-hm-btn {
    display: inline-flex; align-items: center; gap: 14px; min-height: 48px; padding: 0 24px; border: 1px solid var(--le-gold); background: #111; color: #fff !important;
    font: 700 11.5px/1 var(--le-sans); letter-spacing: .22em; text-transform: uppercase; transition: background .18s, color .18s;
}
.le-hm-btn::after { content: '→'; color: var(--le-gold); font-size: 15px; letter-spacing: 0; }
.le-hm-btn:hover { background: var(--le-gold); color: var(--le-ink) !important; }
.le-hm-btn:hover::after { color: var(--le-ink); }
.le-hm-textlink { display: inline-block; padding-bottom: 4px; border-bottom: 1px solid var(--le-gold); font: 700 11.5px/1.2 var(--le-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--le-ink) !important; }
.le-hm-textlink::after { content: ' →'; color: var(--le-gold-deep); }
.le-hm-textlink--light { color: #fff !important; }
.le-hm-textlink--light::after { color: var(--le-gold); }
.le-hm-textlink:hover { color: var(--le-gold-deep) !important; }
.le-hm-textlink--light:hover { color: var(--le-gold) !important; }

/* S1 Hero */
.le-hm-hero { display: grid; grid-template-columns: 45% 55%; min-height: clamp(520px, calc(100svh - 171px), 720px); background: var(--le-ink); }
.le-hm-hero__text { display: flex; flex-direction: column; justify-content: flex-end; padding: 56px 56px 72px var(--hm-pad); }
.le-hm-v3 .le-hm .le-hm-hero__h1 { margin: 0 0 18px; font: 500 44px/1.08 var(--le-serif); color: #fff; letter-spacing: -.01em; text-wrap: balance; max-width: 560px; }
/* H1 zweizeilig (Betreiber-H1 2026-10-08): Hauptzeile Serif groß, Unterzeile ruhiger – gleicher Wortlaut, ein Element */
.le-hm-hero__h1-main, .le-hm-hero__h1-sub { display: block; }
.le-hm-v3 .le-hm .le-hm-hero__h1-sub { margin-top: 10px; font: 400 26px/1.25 var(--le-serif); color: var(--hm-on-dark); letter-spacing: 0; text-wrap: balance; }
.le-hm-hero__lead { margin: 0 0 28px; font-size: 17px; line-height: 1.7; color: var(--hm-on-dark); max-width: 470px; }
.le-hm-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }
.le-hm-hero__media { margin: 0; position: relative; overflow: hidden; }
/* F-B2: weicher Übergang vom dunklen Textblock ins Bild (A und B) */
@media (min-width: 768px) { .le-hm-hero__media::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 18%; background: linear-gradient(90deg, rgba(27, 27, 27, .5), rgba(27, 27, 27, 0)); z-index: 1; pointer-events: none; } }
.le-hm-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--le-hero-focus, 50% 55%); }

/* S2 Fakten */
.le-hm-facts { border-bottom: 1px solid var(--le-line); background: #fff; }
.le-hm-facts__list { max-width: var(--hm-lead); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); }
.le-hm-facts__item { display: flex; flex-direction: column; gap: 6px; padding: 26px 20px; border-left: 1px solid var(--le-line); }
.le-hm-facts__item:first-child { border-left: 0; }
.le-hm-facts__value { font: 500 24px/1.2 var(--le-serif); color: var(--le-ink) !important; font-variant-numeric: lining-nums; }
a.le-hm-facts__value:hover { color: var(--le-gold-deep) !important; }
.le-hm-facts__text { font-size: 13.5px; line-height: 1.5; color: var(--le-muted); }

/* S3 Bereiche */
.le-hm-areas { padding: 72px 0 64px; }
.le-hm-areas__grid { max-width: var(--hm-lead); margin: 0 auto; padding: 0 20px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.le-hm-area__media { display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--le-paper); margin-bottom: 18px; }
.le-hm-area__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.le-hm-area:hover .le-hm-area__media img { transform: scale(1.03); }
.le-hm-v3 .le-hm .le-hm-area__name { margin: 0 0 6px; font: 600 26px/1.15 var(--le-serif); }
.le-hm-area__name a { color: var(--le-ink) !important; }
.le-hm-area:hover .le-hm-area__name a, .le-hm-area__name a:hover { color: var(--le-gold-deep) !important; }
.le-hm-area__text { margin: 0 0 14px; font-size: 14.5px; line-height: 1.5; color: var(--le-muted); min-height: 3em; }
.le-hm-area__links li { border-top: 1px solid var(--le-line); }
.le-hm-area__links li:last-child { border-bottom: 1px solid var(--le-line); }
.le-hm-area__link { display: flex; justify-content: space-between; align-items: center; min-height: 40px; font-size: 14.5px; color: var(--le-ink) !important; }
.le-hm-area__link::after { content: '→'; color: var(--le-gold-deep); }
.le-hm-area__link:hover { color: var(--le-gold-deep) !important; }
.le-hm-chips { display: none; }

/* S4 Ausgestellte Modelle */
.le-hm-pick { background: var(--le-paper); padding: 64px 0; }
.le-hm-v3 .le-hm .le-hm-pick__grid.listing { max-width: var(--hm-lead); margin: 0 auto !important; padding: 0 20px !important; display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.le-hm-pick__item, .le-hm-v3 .le-hm-pick__item .product--box { width: auto !important; max-width: none !important; flex: none !important; float: none !important; margin: 0 !important; padding: 0 !important; height: 100%; }
.le-hm-pick__item .box--content { height: 100%; }
.le-hm-v3 .le-hm-pick .product--badge.badge--showroom, .le-hm-v3 .le-hm-pick .product--badge.le-badge--showroom { display: none !important; } /* Abschnitt sagt bereits „Im Showroom“ (F-09) */ /* Alt-Badge des Themes; v2-Badge bleibt */

/* S5 Showroom & Beratung */
.le-hm-showroom { display: grid; grid-template-columns: 58% 42%; background: var(--le-ink); min-height: 600px; }
.le-hm-showroom__media { margin: 0; position: relative; overflow: hidden; }
.le-hm-showroom__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--le-sr-focus, 50% 50%); }
.le-hm-showroom__text { padding: 64px var(--hm-pad) 64px 64px; display: flex; flex-direction: column; justify-content: center; }
.le-hm-showroom__p { margin: 18px 0 22px; font-size: 16px; line-height: 1.7; color: var(--hm-on-dark); max-width: 460px; }
.le-hm-showroom__rows { margin: 0 0 28px; max-width: 460px; }
.le-hm-showroom__row { display: grid; grid-template-columns: 150px 1fr; gap: 14px; padding: 12px 0; border-top: 1px solid rgba(218, 180, 74, .3); }
.le-hm-showroom__row:last-child { border-bottom: 1px solid rgba(218, 180, 74, .3); }
.le-hm-showroom__row dt { font: 700 10.5px/1.6 var(--le-sans); letter-spacing: .16em; text-transform: uppercase; color: #a59f92; }
.le-hm-showroom__row dd { margin: 0; font-size: 15px; line-height: 1.5; color: #fff; }
.le-hm-showroom__ext { color: #fff !important; border-bottom: 1px solid var(--le-gold); }
.le-hm-showroom__ext::after { content: ' ↗'; color: var(--le-gold); }
.le-hm-showroom__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px; }
.le-hm-contact { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.le-hm-contact__label { font: 700 10.5px/1 var(--le-sans); letter-spacing: .26em; text-transform: uppercase; color: #a59f92; }
.le-hm-contact__nr { font: 600 26px/1.1 var(--le-serif); color: #fff !important; font-variant-numeric: lining-nums; }
.le-hm-contact__nr:hover { color: var(--le-gold) !important; }

/* S6 Marken */
.le-hm-brands { padding: 56px 0 64px; background: #fff; }
.le-hm-brands__label { max-width: var(--hm-lead); margin: 0 auto 22px; padding: 0 20px; }
.le-hm-brands__grid { max-width: calc(var(--hm-lead) - 40px); margin: 0 auto; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--le-line); border-left: 1px solid var(--le-line); }
.le-hm-brands__grid li { border-right: 1px solid var(--le-line); border-bottom: 1px solid var(--le-line); }
.le-hm-brand { display: flex; align-items: center; justify-content: center; height: 88px; padding: 0 18px; }
.le-hm-brand img { max-width: 132px; max-height: 40px; width: auto; height: auto; opacity: .85; transition: opacity .18s; } /* keine Graustufen: Vollflächen-Logos würden graue Kästen (F-25) */
.le-hm-brand:hover img, .le-hm-brand:focus-visible img { opacity: 1; }
/* Harmonisiert: Breite je Logo nach gleicher optischer Fläche, volle Deckkraft (Logos unverfälscht) */
.le-hm-brand img.le-hm-brand__img--sized { width: var(--le-logo-w); max-width: 100%; max-height: none; height: auto; opacity: 1; }

/* Tablet */
@media (max-width: 1023px) {
    .le-hm-hero { grid-template-columns: 46% 54%; min-height: 520px; }
    .le-hm-hero__text { padding: 44px 36px 52px 28px; }
    .le-hm-v3 .le-hm .le-hm-hero__h1 { font-size: 38px; }
    .le-hm-v3 .le-hm .le-hm-hero__h1-sub { font-size: 23px; }
    .le-hm-hero__lead { font-size: 16px; }
    .le-hm-areas__grid, .le-hm-v3 .le-hm .le-hm-pick__grid.listing { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
    .le-hm-area__media { aspect-ratio: 3 / 2; }
    .le-hm-showroom { grid-template-columns: 1fr 1fr; min-height: 0; }
    .le-hm-showroom__text { padding: 44px 28px; }
    .le-hm-brands__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
/* Mobil */
@media (max-width: 767px) {
    .le-hm-hero { display: flex; flex-direction: column; min-height: 0; }
    .le-hm-hero__text { padding: 26px 20px 30px; }
    .le-hm-v3 .le-hm .le-hm-hero__h1 { font-size: 32px; line-height: 1.1; }
    .le-hm-v3 .le-hm .le-hm-hero__h1-sub { margin-top: 8px; font-size: 20px; line-height: 1.3; }
    .le-hm-hero__lead { font-size: 15px; line-height: 1.6; margin-bottom: 22px; }
    .le-hm-hero__actions { flex-direction: column; align-items: stretch; }
    .le-hm-btn { justify-content: center; }
    .le-hm-hero__actions .le-hm-textlink { align-self: flex-start; }
    .le-hm-hero__media { aspect-ratio: var(--le-hero-ratio-m, 16 / 9); order: -1; }
    .le-hm-hero__media img { object-position: var(--le-hero-focus-m, var(--le-hero-focus, 50% 55%)); } /* Bild zuerst: erster Bildschirm zeigt Motiv + H1 trotz Cookie-Hinweis (F-19) */
    .le-hm-hero .le-hm-eyebrow::after { display: none; } /* F-31 */
    .le-hm-facts__list { grid-template-columns: 1fr; }
    .le-hm-facts__item { border-left: 0; border-top: 1px solid var(--le-line); padding: 16px 20px; }
    .le-hm-facts__item:first-child { border-top: 0; }
    .le-hm-facts__value { font-size: 21px; }
    .le-hm-areas { padding: 44px 0 36px; }
    .le-hm-v3 .le-hm .le-hm-h2 { font-size: 27px; }
    .le-hm-v3 .le-hm .le-hm-h2--light { font-size: 29px; }
    .le-hm-areas__grid { gap: 12px; }
    .le-hm-area__media { aspect-ratio: 1 / 1; margin-bottom: 10px; }
    .le-hm-v3 .le-hm .le-hm-area__name { font-size: 20px; margin: 0; }
    .le-hm-area__text, .le-hm-area__links { display: none; }
    .le-hm-chips { display: block; max-width: var(--hm-lead); margin: 26px auto 0; padding: 0 20px; }
    .le-hm-chips__label { margin: 0 0 10px; font: 700 11px/1 var(--le-sans); letter-spacing: .26em; text-transform: uppercase; color: var(--le-gold-deep); }
    .le-hm-chips ul { display: flex; flex-wrap: wrap; gap: 8px; }
    .le-hm-chip { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 1px solid var(--le-line); font-size: 14px; color: var(--le-ink) !important; background: #fff; }
    .le-hm-head--split { flex-direction: column; align-items: flex-start; }
    .le-hm-head__links { align-items: flex-start; }
    .le-hm-pick { padding: 44px 0; }
    .le-hm-v3 .le-hm .le-hm-pick__grid.listing { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; padding: 0 20px 6px !important; }
    .le-hm-v3 .le-hm .le-hm-pick__item { flex: 0 0 72vw !important; width: 72vw !important; scroll-snap-align: start; }
    .le-hm-showroom { display: flex; flex-direction: column; }
    .le-hm-showroom__media { aspect-ratio: 4 / 3; }
    .le-hm-showroom__media img { object-position: var(--le-sr-focus-m, var(--le-sr-focus, 50% 50%)); } /* 1.7.5 */
    .le-hm-showroom__text { padding: 30px 20px 38px; }
    .le-hm-showroom__row { grid-template-columns: 1fr; gap: 4px; }
    .le-hm-brands { padding: 40px 0 44px; }
    .le-hm-brands__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .le-hm-brand { height: 72px; padding: 0 10px; }
    .le-hm-brand img { max-width: 92px; max-height: 30px; }
    .le-hm-brand img.le-hm-brand__img--sized { width: calc(var(--le-logo-w) * .85); max-height: none; } /* F-L5 */
}
@media (prefers-reduced-motion: reduce) { .le-hm-area__media img { transition: none; } }

/* nur für Screenreader (Hinweis „externe Seite“) */
.le-sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* G: Rahmen des Marken-Rasters bündig mit den Zellen (Randabstand außerhalb des Rasters) */
@media (max-width: 1199px) { .le-hm .le-hm-brands__grid { margin: 0 20px; max-width: none; } }

/* G-D6 */
.le-hm .le-hm-showroom__p, .le-hm .le-hm-facts__text, .le-hm .le-hm-contact__nr, .le-hm .le-hm-facts__value, .le-hm .le-hm-showroom__row dd { font-variant-numeric: lining-nums; }

/* F-X1: Eyebrow über der H1 auf Tablets einzeilig, Linie nur wenn Platz */
@media (min-width: 768px) and (max-width: 1199px) { .le-hm-hero .le-hm-eyebrow { letter-spacing: .2em; } }
@media (max-width: 900px) { .le-hm-hero .le-hm-eyebrow::after { display: none; } }

/* UX-QA (Q-U Touch): Textlinks mobil mit 44 px Trefferfläche, Fokus sichtbar */
@media (max-width: 767px) { .le-hm-textlink, .le-hm-contact__nr { position: relative; } .le-hm-textlink::before, .le-hm-contact__nr::before { content: ''; position: absolute; inset: -12px -4px; } } /* unsichtbare Trefferfläche ≥ 44 px, Optik unverändert */
.le-hm a:focus-visible { outline: 2px solid var(--le-ink); outline-offset: 3px; }
.le-hm-hero a:focus-visible, .le-hm-showroom a:focus-visible { outline-color: #dab44a; }