/* =======================
Root-Variablen & Grund-Setup
======================= */

:root{
/* Farben */
--grau:#e0e0e0;
--hellgrau:#f5f5f5;
--hellschwarz:#333333;
--text:#4d4d4d;
--akzent:#00a9c4;
--bg:#ffffff;
--hover:#555555;
--black80:rgba(0,0,0,.8);

/* Layout & Typo */
--max-width:1200px;
--inner-narrow:900px;
--font-base:16px;
--font-small:14px;
--font-large:24px;

/* Vertikalabstand (fix 1 cm) */
--vspace:1cm;

/* Sonstiges */
--home-gap:1.25rem;
--box-radius:16px;
--btn-radius-pill:999px;
--btn-radius:30px;
--divider-color:var(--black80);
--grid-gap-x:2rem;
--box-padding:1.5rem;
--box-shadow-soft:0 4px 12px rgba(0,0,0,.06);
--section-padding-x:1rem;
--font-heading-card:1.25rem;
}

/* =======================
Reset & Basis
======================= */

*{margin:0;padding:0;box-sizing:border-box;}
html{
  scroll-behavior:smooth;
  font-size:var(--font-base);
  overflow-y:scroll;
}

html, body {
  height: 100%;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family:Arial,sans-serif;
  background:var(--hellgrau);
  color:var(--text);
  line-height:1.6;
}

main {
  flex: 1 0 auto;
  padding-bottom: 20rem; 
}

.mega-footer {
  margin-top: auto;
}

/* =======================
Utilities
======================= */

.u-leonardo-up{text-transform:uppercase;}
.u-text-black80{color:var(--black80)!important;}
.u-text-pelipal{color:var(--akzent)!important;}
.u-left{text-align:left!important;}
.u-center{text-align:center!important;}
.u-heading-black80{color:var(--black80)!important;}


.section-divider{height:2px;background:var(--black80);width:40cm;margin-left: -4cm;}

.home-narrow,.text-narrow{max-width:var(--inner-narrow);margin:0 auto;text-align:left;}
.u-gap-home{margin-top:var(--home-gap)!important;}
.stack-home>+{margin-top:var(--home-gap);}

.headline-wrap{display:flex;align-items:flex-start;gap:12px;}
.headline-top{letter-spacing:1px;font-weight:700;color:var(--akzent);font-size:1.05rem;}
.headline-big{font-size:clamp(36px,7vw,64px);font-weight:700;line-height:1.1;color:var(--akzent);}

.heading-page{
  font-size:2rem;
}
.u-text-pelipal{color:var(--akzent)!important;}

.page-title{
  font-size:clamp(12px,7vw,36px);
  font-weight:700;
  color:var(--akzent);
  text-align:left;
  margin:0;
  line-height:1.1;
}

.popup-img,
.kq-big img,
.kq-stack img {
  pointer-events: auto;
  transition: none !important;
}

.popup-img:hover,
.kq-big img:hover,
.kq-stack img:hover {
  transform: none !important;
  opacity: 1 !important;
  filter: none !important;
  cursor: default !important;
}
/* =======================
Layout
======================= */

.container{max-width:var(--max-width);margin:0 auto;padding:0 1rem;}
section{padding:0 1rem;}

section + section{margin-top:var(--vspace);}
.hero-slider + section{margin-top:var(--vspace);}
body > * + .mega-footer{margin-top:var(--vspace);}

section > * + *{margin-top:var(--vspace);}
section > .container > * + *{margin-top:var(--vspace);}

.grid,.grid-2,.grid-3,.grid-4{display:flex;flex-wrap:wrap;gap:2rem;}
.grid-2 > *{flex:1 1 calc(50% - 1rem);}
.grid-3 > *{flex:1 1 calc(33.333% - 1.33rem);}
.grid-4 > *{flex:1 1 calc(25% - 1.5rem);}
.full-width{width:100%;}

/* =======================
Header & Navigation
======================= */

.site-header{background:var(--hellschwarz);color:#fff;padding:1rem 0;margin-bottom:var(--vspace);}
.logo{height:50px;}
.main-nav{position:relative;z-index:10;}
.nav-list{list-style:none;display:flex;gap:1.5rem;align-items:center;margin:0;padding:0;flex-wrap:wrap;}
.nav-list li{position:relative;}
.nav-list a{color:#fff;text-decoration:none;padding:10px 15px;display:block;transition:background .3s,color .3s;}
.nav-list a:hover{background:var(--grau);color:#000;}
.has-submenu{position:relative;}
.submenu{display:none;position:absolute;top:100%;left:0;background:var(--hellschwarz);border:1px solid var(--grau);box-shadow:0 4px 8px rgba(0,0,0,.1);min-width:200px;flex-direction:column;z-index:999;list-style:none;padding:0;}
.submenu li{width:100%;}
.submenu a{padding:10px 15px;white-space:nowrap;text-align:left;color:#fff;}
.submenu a:hover{background:var(--grau);color:#000;}
.has-submenu:hover .submenu{display:flex;flex-direction:column;}

/* =======================
Links, Buttons & Inputs
======================= */

a{color:var(--akzent);text-decoration:none;transition:color .3s;}
a:hover{color:var(--hover);text-decoration:underline;}

.button-primary{background:#fff;color:var(--akzent);border:2px solid var(--akzent);padding:.8rem 1.5rem;font-size:1rem;border-radius:var(--btn-radius);cursor:pointer;line-height:1;transition:background .25s,color .25s,border-color .25s,box-shadow .25s;display:inline-block;}
.button-primary:hover{background:var(--akzent);color:#fff;}
.button-primary--black80{background:#fff;color:var(--akzent);border:2px solid var(--akzent);}
.button-primary--black80:hover{background:var(--akzent);color:#fff;}
.button--pill{border-radius:var(--btn-radius-pill);}
.button-small{background:#ccc;color:#000;font-weight:bold;padding:6px 12px;font-size:13px;display:inline-block;border-radius:4px;}

input,select,textarea{width:100%;padding:.6rem;border:1px solid var(--grau);border-radius:4px;font-family:inherit;font-size:1rem;}
label{display:block;margin-bottom:.3rem;font-weight:bold;}

.checkbox-wrapper,.checkbox-stacked{display:flex;align-items:flex-start;gap:.5rem;font-size:14px;line-height:1.4;color:var(--text);}
.checkbox-wrapper input[type="checkbox"],.checkbox-stacked input[type="checkbox"]{flex-shrink:0;margin-top:.2rem;transform:scale(1.2);}

/* =======================
Cards / Intro / Info-Boxen
======================= */

.card{background:#fff;border-radius:6px;box-shadow:0 0 10px rgba(0,0,0,.05);padding:1.5rem;flex:1 1 30%;text-align:center;}
.card img{width:100%;height:auto;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.1);object-fit:cover;object-position:center;}
.card h3{font-size:1.1rem;margin-top:0;color:var(--akzent);}
.card p{font-size:.95rem;color:var(--text);}

.intro-box{background:#fff;border-radius:var(--box-radius);padding:2rem;box-shadow:0 6px 18px rgba(0,0,0,.06);font-size:1.05rem;line-height:1.7;color:var(--text);}

/* =======================
Testimonials
======================= */

.testimonial-card{background:#fff;border-radius:10px;padding:1.5rem;box-shadow:0 4px 12px rgba(0,0,0,.05);position:relative;font-style:italic;text-align:left;display:flex;flex-direction:column;justify-content:space-between;min-height:180px;transition:transform .2s ease;}
.testimonial-card:hover{transform:translateY(-4px);}
.testimonial-card::before{content:"❝";font-size:40px;color:var(--akzent);position:absolute;top:10px;left:15px;}
.testimonial-card p{margin-top:0;font-size:.95rem;line-height:1.5;color:#333;}
.testimonial-name{margin-top:1rem;font-weight:bold;color:var(--akzent);font-style:normal;}
.media-placeholder{background:#eaeaea;border:1px dashed #aaa;height:160px;display:flex;align-items:center;justify-content:center;color:#777;font-style:italic;}

/* =======================
Footer
======================= */

.mega-footer{background:#444;color:#fff;font-size:14px;}
.footer-columns{display:flex;flex-wrap:wrap;gap:2rem;padding:3rem 1rem 1rem;justify-content:space-between;}
.footer-column{flex:1 1 160px;}
.footer-column h4{font-size:14px;font-weight:bold;margin-bottom:1rem;text-transform:uppercase;}
.footer-column ul{list-style:none;padding:0;margin:0;}
.footer-column li{margin-bottom:.5rem;}
.footer-column a{color:#ccc;text-decoration:none;transition:color .3s;}
.footer-column a:hover
.footer-bottom{background:var(--hellschwarz);padding:1rem;text-align:center;border-top:1px solid #555;}
.footer-bottom ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;font-size:13px;}
.footer-bottom a{color:#ccc;text-decoration:none;}
.footer-bottom a:hover
.social-icons{display:flex;gap:10px;margin-top:.5rem;}
.social-icons img{width:24px;height:24px;background:#fff;border-radius:4px;}

/* =======================
Küchenvorschau Slider
======================= */

.kuechen-slider{position:relative;overflow:hidden;width:100%;max-width:1200px;margin:0 auto;}
.kuechen-slider-track{display:flex;transition:transform .8s ease-in-out;width:100%;}
.kueche-slide{flex:0 0 100%;display:flex;justify-content:center;align-items:center;}
.kueche-box{display:flex;background:#f9f9f9;border-radius:10px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,.1);width:100%;max-width:1000px;}
.kueche-bild{flex:1;min-width:300px;}
.kueche-bild img{width:100%;height:100%;object-fit:cover;display:block;}
.kueche-text{flex:1;padding:2rem;text-align:left;}
.kueche-text h3{color:var(--akzent);margin-bottom:0;}

/* =======================
Typenplan
======================= */

.section-typenplan-slider h2,.section-traumweg h2{color:var(--akzent);text-align:center;}
.typenplan-slider-wrapper{position:relative;overflow:hidden;width:100%;}
.typenplan-slider-track{display:flex;transition:transform .6s ease-in-out;}
.typenplan-slide{flex:0 0 100%;display:flex;justify-content:center;align-items:center;}
.typenplan-slide img{max-width:100%;height:auto;border-radius:8px;box-shadow:0 0 10px rgba(0,0,0,.1);cursor:pointer;}

/* =======================
Kontakte Seite
======================= */

.contact-form{display:flex;flex-direction:column;gap:1rem;}
@media (min-width:900px){
.contact-form .grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem 2rem;}
}
.checkbox-row{display:flex;align-items:center;gap:.5rem;margin-top:1rem;max-width:150px;}
.checkbox-row input[type="checkbox"]{margin-top:.2rem;}
.contact-form .button-primary{align-self:flex-start;margin-top:1rem;}

/* =======================
FAQ Seite
======================= */

.faq-list{list-style:none;padding:0;margin:0;}
.faq-item{border-bottom:1px solid var(--akzent);padding:1.2rem 0}
.faq-question{background:none;border:none;font:inherit;color:var(--text);text-align:left;width:100%;padding:0;cursor:pointer;font-weight:600;transition:color .3s ease;}
.faq-question:hover{color:var(--hover);}
.faq-answer{display:none;margin-top:0;color:var(--text);font-size:.95rem;line-height:1.4;}
.faq-item.open .faq-answer{display:block;}

/* =======================
Module
======================= */

.module-grid-horizontal{display:grid;grid-template-columns:repeat(auto-fit,minmax(480px,1fr));gap:2rem;justify-content:center;margin-bottom:3rem;}
.module-card.horizontal{display:flex;flex-direction:row;align-items:center;gap:1.5rem;background:#fff;border:1px solid var(--grau);border-radius:10px;padding:1rem;box-shadow:0 4px 10px rgba(0,0,0,.05);transition:transform .3s ease;max-width:100%;}
.module-card.horizontal:hover{transform:scale(1.015);}
.module-card.horizontal img{width:45%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.05);}
.module-text{flex:1;color:var(--black80);}
.module-text h3{color:var(--black80);margin-bottom:0;font-size:1.05rem;}
.module-text p{font-size:1.05rem;color:var(--text);line-height:1.7;}}

/* =======================
Bildverhältnisse (global)
======================= */

.equal-image{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;}
.kueche-bild img,.typenplan-slide img,.card img,.zusatzbilder-grid img{aspect-ratio:4/3;object-fit:cover;}

.hero-img.sharp {
  filter: contrast(110%) saturate(110%) brightness(105%);
  image-rendering: crisp-edges;
  image-rendering: -webkit-optimize-contrast;
}

/* =======================
Zusatzbilder
======================= */

.zusatzbilder-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem;}
.zusatzbilder-grid img{width:100%;max-width:400px;height:auto;border-radius:10px;box-shadow:0 0 12px rgba(0,0,0,.1);}

/* =======================
HIGHLIGHTS – V2 (Hover-Caption, JS-Endloslauf)
======================= */

.carousel-wrapper{overflow:hidden;width:100%;position:relative;margin:0 auto;max-width:100%;}
.section-highlights .carousel-track{display:flex;gap:2rem;align-items:center;will-change:transform;animation:hl-marquee var(--hl-duration, 40s) linear infinite;}
.section-highlights .carousel-wrapper{margin-top:var(--vspace);}
.section-highlights .hl-item{position:relative;display:inline-block;border-radius:8px;overflow:hidden;flex-shrink:0;}
.section-highlights .hl-item img{height:200px;width:auto;display:block;object-fit:cover;}
.section-highlights .hl-caption{
position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.65);color:#fff;font-size:14px;line-height:1.35;
padding:8px 10px;border-bottom-left-radius:8px;border-bottom-right-radius:8px;opacity:0;transition:opacity .25s;pointer-events:none;
}
.section-highlights .hl-item:hover .hl-caption{opacity:1;}
@keyframes hl-marquee{from{transform:translateX(0);}to{transform:translateX(calc(-1 * var(--hl-distance, 1000px)));}}
@media (max-width:600px){ .section-highlights .hl-item img{height:140px;} }

/* =======================
TRAUMKÜCHE – Kartenleiste (links, 3 nebeneinander)
======================= */

.cards-row{max-width:var(--max-width);margin:0 auto;display:flex;flex-wrap:wrap;gap:2rem;justify-content:flex-start;align-items:stretch;}
.cards-row > .card-concept{flex:0 1 calc((100% - 2rem * 2)/3);max-width:calc((100% - 2rem * 2)/3);min-width:280px;}
@media (max-width:960px){.cards-row > .card-concept{flex:0 1 calc((100% - 2rem)/2);max-width:calc((100% - 2rem)/2);}}
@media (max-width:600px){.cards-row > .card-concept{flex:0 1 100%;max-width:100%;}}
.card-concept{background:#fff;border:1px solid var(--grau);border-radius:16px;box-shadow:0 4px 12px rgba(0,0,0,.06);padding:1.25rem 1.25rem 1.5rem;text-align:left;}
.card-concept > .row{display:flex;gap:12px;align-items:flex-start;}
.card-concept .bar{width:4px;height:40px;background:var(--akzent);border-radius:2px;}
.card-concept .k-top{font-size:.95rem;}
.card-concept .k-title{font-size:1.25rem;font-weight:700;}

/* =======================
Cards / Intro / Info-Boxen – globales Box-System
======================= */

.card,
.intro-box,
.testimonial-card,
.kueche-box,
.card-concept,
.module-card.horizontal{
background:#fff;
border-radius:var(--box-radius);
box-shadow:var(--box-shadow-soft);
padding:var(--box-padding);
}

/* Karten allgemein */
.card{text-align:center;flex:1 1 30%;}
.card img{
width:100%;
height:auto;
border-radius:var(--box-radius);
box-shadow:0 4px 8px rgba(0,0,0,.1);
object-fit:cover;
object-position:center;
}
.card h3{font-size:var(--font-heading-card);margin-top:0;color:var(--black80);}
.card p{font-size:.95rem;color:var(--text);}

/* Intro-Box (z.B. Einführungs-Text) */
.intro-box{font-size:1.05rem;line-height:1.7;color:var(--text);}

/* Module – horizontale Karten */
.module-grid-horizontal{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(480px,1fr));
column-gap:var(--grid-gap-x);
row-gap:var(--vspace);
justify-content:center;
margin-bottom:var(--vspace);
}
.module-card.horizontal{
display:flex;
flex-direction:row;
align-items:center;
gap:1.5rem;
max-width:100%;
}
.module-card.horizontal img{
width:45%;
aspect-ratio:4/3;
object-fit:cover;
border-radius:var(--box-radius);
box-shadow:0 2px 8px rgba(0,0,0,.05);
}
.module-text{flex:1;color:var(--black80);}
.module-text h3{color:var(--black80);margin-bottom:0;font-size:var(--font-heading-card);}
.module-text p{font-size:1.05rem;color:var(--text);line-height:1.7;}

/* =======================
Testimonials
======================= */

.testimonial-card{
position:relative;
font-style:italic;
text-align:left;
display:flex;
flex-direction:column;
justify-content:space-between;
min-height:180px;
transition:transform .2s ease;
}
.testimonial-card:hover{transform:translateY(-4px);}
.testimonial-card::before{
content:"❝";
font-size:40px;
color:var(--akzent);
position:absolute;
top:10px;
left:15px;
}
.testimonial-card p{margin-top:0;font-size:.95rem;line-height:1.5;color:#333;}
.testimonial-name{margin-top:1rem;font-weight:bold;color:var(--black80);font-style:normal;}
.media-placeholder{background:#eaeaea;border:1px dashed #aaa;height:160px;display:flex;align-items:center;justify-content:center;color:#777;font-style:italic;}

/* =======================
Footer
======================= */

.mega-footer{background:#444;color:#fff;font-size:14px;}
.footer-columns{
display:flex;
flex-wrap:wrap;
column-gap:var(--grid-gap-x);
row-gap:var(--vspace);
padding:3rem var(--section-padding-x) 1rem;
justify-content:space-between;
max-width:var(--max-width);
margin:0 auto;
}
.footer-column{flex:1 1 160px;}
.footer-column h4{font-size:14px;font-weight:bold;margin-bottom:1rem;text-transform:uppercase;}
.footer-column ul{list-style:none;padding:0;margin:0;}
.footer-column li{margin-bottom:.5rem;}
.footer-column a{color:#ccc;text-decoration:none;transition:color .3s;}
.footer-column a:hover{color:#fff;}

.footer-bottom{
background:var(--hellschwarz);
padding:1rem;
text-align:center;
border-top:1px solid #555;
}
.footer-bottom ul{
list-style:none;
margin:0;
padding:0;
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:1rem;
font-size:13px;
}
.footer-bottom a{color:#ccc;text-decoration:none;transition:color .3s,text-decoration .3s;}
.footer-bottom a:hover{color:#fff;text-decoration:underline;}

.social-icons{display:flex;gap:10px;margin-top:.5rem;}
.social-icons img{width:24px;height:24px;background:#fff;border-radius:4px;}

/* =======================
Hero Slider
======================= */

.hero-slider{padding:0;position:relative;overflow:hidden;height:500px;margin-bottom:0;}
.hero-slide{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background-size:cover;
background-position:center;
opacity:0;
transition:opacity 1s ease-in-out;
}
.hero-slide.active{opacity:1;z-index:1;}
.hero-btn,.slider-btn,.prev-btn,.next-btn,.prev-hero,.next-hero,.prev-kueche,.next-kueche{
position:absolute;
top:50%;
transform:translateY(-50%);
background:none!important;
border:none!important;
color:inherit;
font-size:2rem;
line-height:1;
padding:.25rem .5rem;
cursor:pointer;
z-index:10;
}
.prev-hero{left:10px;}
.next-hero{right:10px;}
.hero-btn{color:rgba(0,0,0,.8);text-shadow:0 1px 2px rgba(0,0,0,.2);}
.hero-btn:hover{color:rgba(0,169,196,.85);}

/* =======================
Küchenvorschau Slider
======================= */

.kuechen-slider{position:relative;overflow:hidden;width:100%;max-width:var(--max-width);margin:0 auto;}
.kuechen-slider-track{display:flex;transition:transform .8s ease-in-out;width:100%;}
.kueche-slide{flex:0 0 100%;display:flex;justify-content:center;align-items:center;}
.kueche-box{display:flex;overflow:hidden;width:100%;max-width:1000px;}
.kueche-bild{flex:1;min-width:300px;}
.kueche-bild img{
width:100%;
height:100%;
object-fit:cover;
display:block;
border-radius:0;
}
.kueche-text{flex:1;padding:2rem;text-align:left;}
.kueche-text h3{color:var(--black80);margin-bottom:0;}

/* =======================
Typenplan
======================= */

.section-typenplan-slider h2,.section-traumweg h2{
color:var(--black80);
text-align:center;
}
.typenplan-slider-wrapper{position:relative;overflow:hidden;width:100%;}
.typenplan-slider-track{display:flex;transition:transform .6s ease-in-out;}
.typenplan-slide{flex:0 0 100%;display:flex;justify-content:center;align-items:center;}
.typenplan-slide img{
max-width:100%;
height:auto;
border-radius:var(--box-radius);
box-shadow:0 0 10px rgba(0,0,0,.1);
cursor:pointer;
}

/* =======================
Kontakte Seite
======================= */

.contact-form{display:flex;flex-direction:column;gap:1rem;}
@media (min-width:900px){
.contact-form .grid-2{
display:grid;
grid-template-columns:repeat(2,1fr);
column-gap:var(--grid-gap-x);
row-gap:var(--vspace);
}
}
.checkbox-row{display:flex;align-items:center;gap:.5rem;margin-top:1rem;max-width:150px;}
.checkbox-row input[type="checkbox"]{margin-top:.2rem;}
.contact-form .button-primary{align-self:flex-start;margin-top:1rem;}

/* =======================
FAQ Seite
======================= */

.faq-list{list-style:none;padding:0;margin:0;}
.faq-item{border-bottom:1px solid var(--akzent);padding:1.2rem 0}
.faq-question{
background:none;
border:none;
font:inherit;
color:var(--text);
text-align:left;
width:100%;
padding:0;
cursor:pointer;
font-weight:600;
transition:color .3s ease;
}
.faq-question:hover{color:var(--hover);}
.faq-answer{display:none;margin-top:0;color:var(--text);font-size:.95rem;line-height:1.4;}
.faq-item.open .faq-answer{display:block;}

/* =======================
Bildverhältnisse (global)
======================= */

.equal-image{
width:100%;
aspect-ratio:4/3;
object-fit:cover;
border-radius:var(--box-radius);
}
.kueche-bild img,
.typenplan-slide img,
.card img,
.zusatzbilder-grid img{
aspect-ratio:4/3;
object-fit:cover;
}

/* =======================
Zusatzbilder
======================= */

.zusatzbilder-grid{
display:flex;
flex-wrap:wrap;
justify-content:center;
column-gap:var(--grid-gap-x);
row-gap:var(--vspace);
}
.zusatzbilder-grid img{
width:100%;
max-width:400px;
height:auto;
border-radius:var(--box-radius);
box-shadow:0 0 12px rgba(0,0,0,.1);
}

/* =======================
HIGHLIGHTS – V2 (Hover-Caption, JS-Endloslauf)
======================= */

.carousel-wrapper{overflow:hidden;width:100%;position:relative;margin:0 auto;max-width:100%;}
.section-highlights .carousel-track{
display:flex;
gap:var(--grid-gap-x);
align-items:center;
will-change:transform;
animation:hl-marquee var(--hl-duration, 40s) linear infinite;
}
.section-highlights .carousel-wrapper{margin-top:var(--vspace);}
.section-highlights .hl-item{
position:relative;
display:inline-block;
border-radius:8px;
overflow:hidden;
flex-shrink:0;
}
.section-highlights .hl-item img{
height:200px;
width:auto;
display:block;
object-fit:cover;
}
.section-highlights .hl-caption{
position:absolute;
left:0;
right:0;
bottom:0;
background:rgba(0,0,0,.65);
color:#fff;
font-size:14px;
line-height:1.35;
padding:8px 10px;
border-bottom-left-radius:8px;
border-bottom-right-radius:8px;
opacity:0;
transition:opacity .25s;
pointer-events:none;
}
.section-highlights .hl-item:hover .hl-caption{opacity:1;}
@keyframes hl-marquee{
from{transform:translateX(0);}
to{transform:translateX(calc(-1 * var(--hl-distance, 1000px)));}
}
@media (max-width:600px){
.section-highlights .hl-item img{height:140px;}
}

/* =======================
TRAUMKÜCHE – Kartenleiste (links, 3 nebeneinander)
======================= */

.cards-row{
max-width:var(--max-width);
margin:0 auto;
display:flex;
flex-wrap:wrap;
column-gap:var(--grid-gap-x);
row-gap:var(--vspace);
justify-content:flex-start;
align-items:stretch;
}
.cards-row > .card-concept{
flex:0 1 calc((100% - var(--grid-gap-x) * 2)/3);
max-width:calc((100% - var(--grid-gap-x) * 2)/3);
min-width:280px;
}
@media (max-width:960px){
.cards-row > .card-concept{
flex:0 1 calc((100% - var(--grid-gap-x))/2);
max-width:calc((100% - var(--grid-gap-x))/2);
}
}
@media (max-width:600px){
.cards-row > .card-concept{flex:0 1 100%;max-width:100%;}
}

/* Card-Content in der Traumküche-Leiste */
.card-concept > .row{display:flex;gap:12px;align-items:flex-start;}
.card-concept .bar{width:4px;height:40px;background:var(--akzent);border-radius:2px;}
.card-concept .k-top{font-size:.95rem;}
.card-concept .k-title{font-size:var(--font-heading-card);font-weight:700;}


