section.background {
    padding: 4rem 0 !important;
}

section.frame-space-before- {
    margin-top:0;
}

section.frame-space-after- {
    margin-bottom:0;
}

.uk-link, a {
    color: var(--leda-red);
}

/* ========================================================================
   Hero Element
 ========================================================================== */

header {
    position: relative;
    display: block;
}

header > video {
    width: 100%;
    height: 100%;
    pointer-events: none;
    max-height: calc(100vh - 5.15rem);
    object-fit: cover;
    vertical-align: bottom;
}

header div.content {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 85.25rem;
    max-width: 90%;
    display: grid;
    grid-template-columns: repeat(10, 8.525rem);
    grid-template-rows: auto 16.25rem;
    grid-column-gap: 0;
}

header div.content div.box-text {
    grid-column: 1 / 9;
    grid-row: 2 / 3;
    background: #BFCABF;
    font-family: 'Quicksand', sans-serif;
    font-size: 3.2rem;
    line-height: 3.8rem;
    align-content: center;
    text-align: left;
    padding: 1.6rem 3.2rem;
    overflow: hidden;
}

header div.content div.box-text h1, .h1 {
    font-size: 4rem;
    line-height: 5rem;
}

header div.content div.box-text h1 {
    margin-bottom: 0;
}

header div.content div.box-box {
    grid-column: 9 / 11;
    grid-row: 2 / 3;
    background: #DFE4DF;
}

header div.content div.box-image {
    grid-column: 9 / 11;
    grid-row: 1 / 3;
    text-align: center;
}

header div.content div.box-image img {
    max-height: 500px;
    width: auto;
}


/* Quotebig Element */
section {
    max-width: 100vw;
    overflow: hidden;
}
/*
section.background {
    margin: 3.6rem 0;
    padding: 3.6rem 0;
}
*/
.background-blue {
    background: #8FA1B5;
}

.background-green {
    background: #DFE4DF;
}

.background-silver {
    background: #C6CEDA;
}

section div.quote-big {
    display: grid;
}

section div.quote-big .quote-image {
    grid-column: 1 / 6;
    align-content: center;
    display: grid;
    grid-template-columns: repeat(5, 6.1rem);
    grid-template-rows: auto max-content 3.7rem;
    grid-column-gap: 0.8rem;
}

section div.quote-big .quote-image img {
    grid-column: 2 / 6;
    grid-row: 1 / 4;
    height: auto;
}

section div.quote-big .quote-image div {
    grid-column: 1 / 3;
    grid-row: 2 / 3;
    background: #C6CEDA;
    padding: 2rem 0.6rem 2rem 1rem;
}

section div.quote-big .quote-image .h4 {
    font-family: 'Quicksand', sans-serif;
    font-weight: 600;
    font-size: 1.4rem;
    font-style: normal;
    line-height: 1.6rem;
    margin-bottom: 0.8rem;
}

section div.quote-big .quote-text {
    grid-column: 7 / 12;
    align-content: center;
}

section div.quote-big .quote-text .subheadline {
    text-transform: uppercase;
    font-weight: 600;
}

section div.quote-big .quote-text .h2 {
    font-family: 'Quicksand', sans-serif;
    font-weight: 400;
    font-size: 2.6rem;
    line-height: 3.4rem;
    margin-bottom: 1.7rem;
}

section div.quote-big .quote-text p {
    padding: 0 0 2rem 0;
}

section div.quote-big .quote-text p a.button {
    margin: 0.8rem 0 1.6rem 0;
}

section div.quote-big .quote-text p a.button {
    background: #E3000E;
    color: #FFFFFF;
    padding: 0.8em 2.4em;
    border-radius: 20em;
    box-shadow: 0 0 0 0 #E3000E;
    transition: background 0.5s, box-shadow 0.5s;
    display: inline-block;
    text-decoration: none;
    font-weight: 400;
}


/* ========================================================================
   Quote-Big Element
 ========================================================================== */

/* Wrapper fuer Bild + Overlay */
.leda-quote-image-wrapper {
    position: relative;
    width: 100%;
    min-height: 700px;
    background: transparent;
}

/* Bild nach rechts versetzt */
.leda-quote-image {
    position: absolute;
    top: 0;
    left: 8rem;  /* 128px Versatz nach rechts */
    right: 0;
    bottom: 0;
    overflow: hidden;
}

.leda-quote-image img {
    width: 90%;
    height: auto;
    object-fit: cover;
}

/* Overlay linksbuendig (ueber dem freien Raum) */
.leda-quote-overlay {
    position: absolute;
    bottom: 4rem;
    left: 0;
    background: var(--leda-silver);
    padding: 1.5rem 2rem;
    max-width: 220px;
    z-index: 10;  /* ueber dem Bild */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.leda-quote-overlay p {
    margin: 0;
    font-family: 'Roboto', sans-serif;
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.4;
}

/* Quote Content */
.leda-quote-content {
    padding: 3rem;
    height: 100%;
    /*
    min-height: 500px;
    display: flex;
    flex-direction: column;
    justify-content: center;
     */
}

.leda-quote-author {
    font-family: 'Roboto', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 1rem;
    color: var(--leda-font);
    display: block;
}

.leda-quote-text {
    font-size: 3.25rem;
    line-height: 4rem;
    margin-bottom: 2rem;
    font-weight: 300;
    margin-top: 1rem;
}

.leda-quote-body p {
    margin-bottom: 1rem;
}

/* Button */
.uk-button-danger {
    box-shadow: 0 0 0 0 var(--leda-red);
    transition: background 0.5s, box-shadow 0.5s;
    background: var(--leda-red);
    color: var(--leda-white);
    font-family: 'Roboto', sans-serif;
    font-size: 1.25rem;
    font-weight: 400;
    text-transform: unset;
    padding: 0.9rem 2.5rem;
    border-radius: 2.5rem;
    margin-top: 1rem;
    border: none;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
}

.uk-button-danger:hover {
    color: var(--leda-white);
    font-weight: inherit;
    background: var(--leda-font);
    box-shadow: 0 0 0 0.5em var(--leda-font);
}

/* Responsive */
@media (max-width: 959px) {
    .leda-quote-image {
        left: 2rem;  /* Weniger Versatz auf Tablet */
    }
}

@media (max-width: 767px) {
    .leda-quote-image-wrapper {
        min-height: 400px;
    }

    .leda-quote-image {
        left: 1rem;  /* Noch weniger auf Mobile */
    }

    .leda-quote-overlay {
        left: 1rem;
        bottom: 1rem;
        max-width: 200px;
    }

    .leda-quote-content {
        padding: 2rem;
        min-height: auto;
    }

    .leda-quote-text {
        font-size: 1.3rem;
        line-height: 1.7rem;
    }
}


/* ========================================================================
   3er-Box mit Hintergrundbild
 ========================================================================== */

.leda-promise {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    padding: var(--section-padding) 0;
    color: var(--leda-white);
}

/* Overlay fuer bessere Lesbarkeit (optional) */
.leda-promise::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0);
    /*background: rgba(0, 0, 0, 0.3);*/  /* Dunkles Overlay */
    z-index: 1;
}

.leda-promise-inner {
    position: relative;
    z-index: 2;
}

/* Header */
.leda-promise-header {
    text-align: left;
    margin-bottom: 3rem;
    margin-top: 3.5rem;
}

.leda-promise-header h2 {
    color: var(--leda-white);
    font-size: 3.25rem;
    line-height: 3.4rem;
    margin: 0;
}

/* Promise Boxen */
.leda-promise-box {
    background: var(--leda-white);
    color: var(--leda-font);
    padding: 2.5rem 2.5rem 0.5rem;
    text-align: center;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.leda-promise-number {
    font-family: 'Quicksand', sans-serif;
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--leda-red);
    margin-bottom: 0;
    display: block;
}

.leda-promise-box h3 {
    font-size: 2.25rem;
    line-height: 3rem;
    margin-bottom: 3rem;
    font-weight: 400;
}

.leda-promise-box p {
    font-family: 'Roboto', sans-serif;
    font-size: 1.25rem;
    line-height: 1.6;
    margin: 0;
}

/* Buttons */
.leda-promise-buttons {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 5rem;
    margin-bottom: 5.5rem;
}



/* ========================================================================
   Bild + Bild
 ========================================================================== */

.leda-fullimages-grid {
    width: 100%;
}

.leda-fullimages-item {
    min-height: 500px;         /* Mindesthoehe */
    overflow: hidden;
    position: relative;
}

.leda-fullimages-item::before {
    content: '';
    display: block;
    padding-bottom: 75%;       /* Aspect Ratio 4:3 */
}

.leda-fullimages-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}



/* ========================================================================
   Text + Tiles
 ========================================================================== */

.image-tiles p a {
    color: var(--leda-red);
}



/* ========================================================================
   Feature-Liste
 ========================================================================== */

.leda-feature-inner {
    margin-bottom: 1rem;
}

.leda-feature-inner .leda-feature-img img {
    width:100%;
}

.leda-feature-padding {
    padding-left: 1rem;
}



/* ========================================================================
   Zitat klein
 ========================================================================== */

.quotesmall p.leda-quote {
    font-family: 'Quicksand', sans-serif;
    font-size: 2.93rem;
    line-height: 3.4rem;
    font-weight: 400;
    color: var(--leda-font);
    /*
    margin-bottom: 1.7rem;
    margin-right: 3.49rem;
     */
    margin: 0 3.49rem 1.7rem 0 !important;
}

.quotesmall .leda-quote-author {
    color: var(--leda-red);
    margin-right: 3.49rem;
}


/* ========================================================================
   Text mit Bild-Cloud
 ========================================================================== */

div.image-cloud-images {
    display: grid;
    grid-template-areas:
        "a a a b b b"
        "c c d d e e";
    grid-template-columns: repeat(6, 1fr);
    grid-gap: 0.9rem;
}

div.image-cloud-images .image-cloud-item {
    overflow: hidden;
}

div.image-cloud-images .image-cloud-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

div.image-cloud-images .image-cloud-item:nth-child(1) {
    grid-area: a;
    justify-self: end;
    align-self: end;
    width: 14.63rem;
    height: 14.63rem;
}

div.image-cloud-images .image-cloud-item:nth-child(2) {
    grid-area: b;
    justify-self: start;
    align-self: end;
    width: 14.63rem;
    height: 21.88rem;
}

div.image-cloud-images .image-cloud-item:nth-child(3) {
    grid-area: c;
    width: 14.63rem;
    height: 14.63rem;
}

div.image-cloud-images .image-cloud-item:nth-child(4) {
    grid-area: d;
    width: 14.63rem;
    height: 21.88rem;
}

div.image-cloud-images .image-cloud-item:nth-child(5) {
    grid-area: e;
    width: 18.45rem;
    height: 14.63rem;
}


/* ========================================================================
   Accordion
 ========================================================================== */

div.accordion span.subheader {
    font-family: 'Quicksand', sans-serif;
    font-weight: 500;
    font-size: 2.25rem;
    line-height: 4.25rem;
    display: block;
}



/* ========================================================================
   Containerstripe Slider - Full Width Layout (LEDA-Vielfalt)
   ======================================================================== */

.slider.slider-start {
    padding: var(--section-margin, 4rem) 0;
}

.slider.slider-start > .leda-container > header {
    margin-bottom: 2rem;
}

/* Slider Elements Container */
.slider.slider-start .elements {
    width: 100%;
}

/* Reset fuer Slick-Slides - WICHTIG */
.slider.slider-start .slick-slide {
    margin: 0;
    padding: 0;
    vertical-align: top;
}

.slider.slider-start .slick-track {
    display: flex;
    align-items: flex-start;
}

/* Einzelne Slides */
.slider.slider-start .slide-item {
    margin-right: 1rem;
    display: flex !important;
    flex-direction: column;
}

/* ----------------------------------------
   EINHEITLICHE HOEHE FUER ALLE SLIDE-MEDIA
   ---------------------------------------- */
.slider.slider-start .slide-item-image .slide-media,
.slider.slider-start .slide-item-text .slide-media {
    height: 36.125rem; /* 578px - GLEICHE Hoehe fuer alle! */
}

/* ----------------------------------------
   Bild-Slides
   ---------------------------------------- */
.slider.slider-start .slide-item-image .slide-media {
    position: relative;
    overflow: hidden;
}

.slider.slider-start .slide-item-image .slide-media img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Cover, damit Bilder die Hoehe fuellen */
    display: block;
}

/* ----------------------------------------
   Text-Slides (Textboxen) - HOCHKANT!
   ---------------------------------------- */
.slider.slider-start .slide-item-text {
    width: 24.88rem !important; /* Feste schmale Breite */
    flex-shrink: 0;
}

.slider.slider-start .slide-item-text .slide-media {
    padding: 2rem;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.slider.slider-start .slide-text-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.slider.slider-start .slide-text-content p {
    font-family: 'Quicksand', sans-serif;
    font-size: 2.25rem;
    line-height: 3.25rem;
    margin: 0;
}

.slider.slider-start .slide-text-content p strong {
    font-weight: 600;
}

.slider.slider-start .slide-text-button {
    margin-top: auto;
    padding-top: 1.5rem;
}

/* Hintergrundfarben */
.slider.slider-start .slide-text.background-green {
    background: var(--leda-green, #DFE4DF);
}

.slider.slider-start .slide-text.background-blue {
    background: var(--leda-bg-blue-dark, #8FA1B5);
}

.slider.slider-start .slide-text.background-blue strong {
    color: var(--leda-white, #fff);
}

.slider.slider-start .slide-text.background-silver {
    background: var(--leda-silver, #C6CEDA);
}

.slider.slider-start .slide-text.background-olive {
    background: var(--leda-olive, #BFCABF);
}

/* ----------------------------------------
   Captions (unterhalb der Slides)
   ---------------------------------------- */
.slider.slider-start .slide-caption {
    padding: 1.5rem 0 1rem 0;
    min-height: 4rem;
}

.slider.slider-start .slide-caption em {
    display: block;
    font-family: 'Quicksand', sans-serif;
    font-weight: 600;
    font-size: 1.75rem;
    font-style: normal;
    line-height: 2rem;
    color: var(--leda-font);
    margin-bottom: 1rem;
}

.slider.slider-start .slide-caption span {
    display: block;
    font-size: 1.25rem;
    line-height: 2rem;
    color: var(--leda-font);
    font-weight: 400;
}

/* ========================================================================
   Slider Controls
   ======================================================================== */

.slider.slider-start > .leda-container > .controls {
    display: flex;
    justify-content: flex-start;
    margin-top: 2rem;
}

.slider .controls > a {
    position: relative;
    display: inline-block;
    background: var(--leda-red);
    color: var(--leda-white);
    width: 5rem;
    height: 3.75rem;
    margin-right: 1rem;
    border-radius: 6.25rem;
    text-decoration: none;
    transition: width 0.3s ease, margin 0.3s ease, background 0.5s ease;
}

.slider .controls > a.slick-disabled {
    background: var(--leda-bg-grey);
}

/* Pfeil zurueck */
.slider .arrowed-prev::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 1.5em;
    transform: translateY(-50%) rotate(-135deg);
    width: 0.5em;
    height: 0.5em;
    border-top: 0.1em solid currentColor;
    border-right: 0.1em solid currentColor;
    transition: left 0.3s ease;
}

.slider .arrowed-prev::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 1.5em;
    transform: translateY(-50%);
    height: 0.05em;
    background-color: currentColor;
    width: 1em;
    transition: width 0.3s ease, left 0.3s ease;
}

/* Pfeil vor */
.slider .arrowed-next::before {
    content: '';
    position: absolute;
    top: 50%;
    right: 1.5em;
    transform: translateY(-50%) rotate(45deg);
    width: 0.5em;
    height: 0.5em;
    border-top: 0.1em solid currentColor;
    border-right: 0.1em solid currentColor;
    pointer-events: none;
    transition: right 0.3s ease;
}

.slider .arrowed-next::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 1.5em;
    transform: translateY(-50%);
    display: inline-block;
    height: 0.05em;
    background-color: currentColor;
    width: 1em;
    transition: width 0.3s ease;
}

/* Hover-Effekt */
.slider .controls > a:not(.slick-disabled):hover {
    width: 6.25rem;
}

.slider .arrowed-prev:not(.slick-disabled):hover::after,
.slider .arrowed-next:not(.slick-disabled):hover::after {
    width: 1.5em;
}

/* ========================================================================
   RESPONSIVE BREAKPOINTS
   ======================================================================== */

/* Mittlere Bildschirme (1024px - 1599px) */
@media (max-width: 1599px) {
    .slider.slider-start .slide-item-image .slide-media,
    .slider.slider-start .slide-item-text .slide-media {
        height: 30rem; /* Alle Slides gleich hoch */
    }

    .slider.slider-start .slide-item-text {
        width: 21rem !important; /* Textbox schmaler */
    }

    .slider.slider-start .slide-text-content p {
        font-size: 2rem;
        line-height: 2.8rem;
    }
}

/* Tablets (768px - 1023px) - 2 Slides */
@media (max-width: 1023px) {
    .slider.slider-start .slide-item-image .slide-media,
    .slider.slider-start .slide-item-text .slide-media {
        height: 24rem; /* Alle Slides gleich hoch */
    }

    .slider.slider-start .slide-item-text {
        width: 18rem !important;
    }

    .slider.slider-start .slide-item-text .slide-media {
        padding: 1.5rem;
    }

    .slider.slider-start .slide-text-content p {
        font-size: 1.6rem;
        line-height: 2.2rem;
    }
}

/* Mobile (< 768px) - 1 Slide */
@media (max-width: 767px) {
    .slider.slider-start .slide-item {
        margin-right: 0.5rem;
    }

    .slider.slider-start .slide-item-image .slide-media,
    .slider.slider-start .slide-item-text .slide-media {
        height: 20rem; /* Alle Slides gleich hoch */
    }

    .slider.slider-start .slide-item-text {
        width: 100% !important;
        max-width: 20rem;
    }

    .slider.slider-start .slide-item-text .slide-media {
        padding: 1.5rem;
    }

    .slider.slider-start .slide-text-content p {
        font-size: 1.4rem;
        line-height: 2rem;
    }

    .slider.slider-start .slide-caption em {
        font-size: 1.5rem;
        line-height: 1.8rem;
        padding-left: 0.5rem;
    }

    .slider.slider-start .slide-caption span {
        font-size: 1.1rem;
        line-height: 1.6rem;
        padding-left: 0.5rem;
    }
}



/* ========================================================================
   Slider Fade - Einzelbild mit ueberlagernder Textbox
   ======================================================================== */

.slider.slider-fade {
    padding: var(--section-margin, 4rem) 0;
}

.slider-fade-wrapper {
    position: relative;
}

/* WICHTIG: Overflow sichtbar machen fuer figcaption */
.slider.slider-fade .slick-list {
    overflow: visible;
}

/* Grid: 11/12 Bild + 1/12 Spacer */
.slide-fade-grid {
    display: grid;
    grid-template-columns: 11fr 1fr;
}

.slide-fade-item {
    position: relative;
}

/* Bild */
.slide-fade-image {
    margin: 0;
    overflow: hidden;
}

.slide-fade-image img {
    width: 100%;
    height: auto;
    display: block;
}

/* Spacer (1/12) */
.slide-fade-spacer {
    /* Bleibt leer, dient nur als Platzhalter */
}

/* Textbox (figcaption) - quadratisch, ueberlagert */
.slide-fade-caption {
    position: absolute;
    right: 0;
    width: calc(100% / 3); /* 4/12 = 1/3 */
    aspect-ratio: 1 / 1; /* Quadratisch */
    padding: 3rem;
    display: flex;
    flex-direction: column;
    /* justify-content: center; */
    top: calc(50% - 6rem);
}

.slide-fade-caption em {
    display: block;
    font-family: 'Quicksand', sans-serif;
    font-weight: 400;
    font-size: 3.25rem;
    font-style: normal;
    line-height: 4.25rem;
    margin-bottom: 1.5rem;
    color: var(--leda-font);
}

.slide-fade-caption.background.background-blue em {
    color: var(--leda-white);

}

.slide-fade-caption p {
    font-size: 1.40rem;
    line-height: 2.25rem;
    margin: 0;
}

/* Controls - unterhalb der figcaption-Unterkante */
.slider.slider-fade .controls {
    display: flex;
    justify-content: flex-start;
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translateY(calc(100% + 2rem));
}

/* Wrapper braucht Platz fuer die ueberstehende figcaption + Controls */
.slider-fade-wrapper {
    position: relative;
    margin-bottom: 8rem; /* Platz fuer Controls */
}

/* Slick Fade Overrides */
.slider.slider-fade .slick-track {
    display: flex;
}

.slider.slider-fade .slick-slide {
    opacity: 0;
    transition: opacity 0.5s ease;
}

.slider.slider-fade .slick-slide.slick-active {
    opacity: 1;
}

/* ========================================================================
   Responsive
   ======================================================================== */

@media (max-width: 767px) {
    .slide-fade-grid {
        grid-template-columns: 1fr;
    }

    .slide-fade-spacer {
        display: none;
    }

    .slide-fade-caption {
        position: relative;
        top: 0;
        width: auto;
        left: 0;
        right: 0;
        aspect-ratio: auto;
        padding: 1.5rem;
    }

    .slider.slider-fade .controls {
        position: relative;
        transform: none;
        margin-top: 1.5rem;
    }

    .slider-fade-wrapper {
        margin-bottom: 0;
    }
}

/* ========================================================================
   Slider Fade - Variante B (Textbox gross, mittig)
   ======================================================================== */

/* Variante B: Bild volle Breite */
.slider-fade-variante_b .slide-fade-image-full {
    width: 100%;
    margin: 0;
}

.slider-fade-variante_b .slide-fade-image-full img {
    width: 100%;
    height: auto;
    display: block;
}

/* Variante B: Textbox - mittig, ragt oben und unten ueber */
.slider-fade-variante_b .slide-fade-caption {
    position: absolute;
    left: 45%;
    top: 50%;
    transform: translateY(-50%);
    width: calc(100% / 3);
    height: calc(100% + (100vw / 12) * 2 - 20rem);
    aspect-ratio: auto;
    padding: 4rem 3rem;
    justify-content: end;
}

/* Controls Position fuer Variante B */
.slider-fade-variante_b .controls {
    position: absolute;
    bottom: 0;
    left: 0;
    /* Baseline = Unterkante Textbox = Bildhoehe/2 + Ueberhang */
    transform: translateY(calc(50% + (100vw / 12) + 2rem));
}

.slider-fade-variante_b .slider-fade-wrapper {
    margin-bottom: 10rem; /* Mehr Platz fuer groessere Textbox */
}

/* ========================================================================
   Responsive - Variante B
   ======================================================================== */

@media (max-width: 767px) {
    .slider-fade-variante_b .slide-fade-caption {
        position: relative;
        left: 0;
        top: 0;
        transform: none;
        width: auto;
        height: auto;
        margin-right: 2rem;
    }

    .slider-fade-variante_b .controls {
        position: relative;
        transform: none;
        margin-top: 1.5rem;
    }

    .slider-fade-variante_b .slider-fade-wrapper {
        margin-bottom: 0;
    }
}



/* ========================================================================
   Responsive
 ========================================================================== */

@media (max-width: 1600px) {
    header div.content {
        width: 95%;
        grid-template-columns: repeat(10, 1fr);
    }
}

@media (max-width: 1280px) {
    header div.content div.box-text h1, .h1 {
        font-size: 3.2rem;
        line-height: 4rem;
    }
}

@media (max-width: 1199px) {
    section.leda-promise div.uk-grid div.uk-first-column {
        margin-bottom: auto;
    }
}

/* Tablet */
@media (max-width: 959px) {
    .leda-promise-header h2 {
        font-size: 2.2rem;
        line-height: 2.8rem;
    }

    .leda-promise-box {
        padding: 2.5rem 2rem;
    }

    .leda-fullimages-item {
        height: 40vh;
        min-height: 300px;
    }

    .leda-feature-padding {
        padding-left: 0;
        margin-top: 1.5rem !important;
        margin-bottom: 3rem;
    }

    .leda-feature-img {
        text-align: center;
    }

    .leda-feature-img img {
        width: 100%;
        height: auto;
    }

    .quotesmall .uk-text-right\@m {
        text-align: left !important;
        margin-bottom: 2rem;
    }

    .quotesmall p.leda-quote {
        margin: -4px 1.9rem 1.7rem 1.9rem;
    }
    .quotesmall .leda-quote-author {
        margin-left: 1.9rem;
        margin-right: 1.9rem;
    }
}

@media (max-width: 920px) {
    header div.content div.box-text h1, .h1 {
        font-size: 2rem;
        line-height: 3rem;
    }
}

/* Mobile */
@media (max-width: 767px) {
    header div.content {
        max-width: unset;
        grid-template-rows: unset;
        grid-template-columns: repeat(8, 1fr);
    }

    header div.content div.box-text {
        grid-row: unset;
        padding: 0.8rem 1.6rem;
    }

    header div.content div.box-text h1, .h1 {
        font-size: 1.25rem;
        line-height: 1.75rem;
    }

    .leda-quote-overlay p {
        font-size: 1.25rem;
        font-weight: 400;
    }

    .leda-promise {
        background-size: cover;  /* Volle Hoehe ausfuellen */
        background-position: center center;
    }

    .leda-promise-header h2 {
        font-size: 1.8rem;
        line-height: 2.2rem;
    }

    .leda-promise-box {
        padding: 2rem 1.5rem;
        margin-bottom: 1rem;
    }

    .leda-promise-box h3 {
        font-size: 1.6rem;
        line-height: 2rem;
    }

    .leda-promise-buttons {
        flex-direction: column;
        align-items: center;
        gap: 1rem;
    }

    .uk-button-danger {
        width: 100%;
        max-width: 300px;
    }

    .image-cloud-images {
        display: none !important;
    }

    .accordion {
        margin-left: 16px;
        margin-right: 16px;
    }

    .quotesmall p.leda-quote {
        font-size: 1.75rem;
        line-height: 2.5rem;
        margin: 0.5rem 2rem 2rem 2rem !important;
    }

}

/* Small Mobile */
@media (max-width: 480px) {
    .leda-promise {
        padding: 2rem 0;
    }

    .leda-promise-box {
        padding: 1.5rem;
    }
}


/* ========================================================================
   Slider Squares – Quadratischer Produkt-Bild-Slider (Detailseite)
   ======================================================================== */

#slider-squares {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Slick-Reset für diesen Slider */
.slider.slider-squares .slick-list {
    overflow: hidden;
}

.slider.slider-squares .slick-track {
    display: flex;
    align-items: flex-start;
}

.slider.slider-squares .slick-slide {
    margin: 0;
    padding: 0;
    vertical-align: top;
    float: none;
}

/* Jeder Slide nimmt exakt 50% der Container-Breite */
.slider.slider-squares .slide-sq-item {
    width: 50%;
    flex-shrink: 0;
}

/* Das Bild-Wrapper-Div: quadratisch ueber aspect-ratio */
.slider.slider-squares .slide-sq-media {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

/* Das Bild selbst fuellt den quadratischen Wrapper vollstaendig */
.slider.slider-squares .slide-sq-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: center;
    display: block;
    max-width: none !important;
    max-height: none !important;
}

/* Controls – linksbündig unterhalb der Kacheln */
.slider.slider-squares .controls {
    display: flex;
    justify-content: flex-start;
    margin-top: 2rem;
}

/* Weisser Trennstrich zwischen den Slides */
.slider.slider-squares .slide-sq-item {
    border-right: 16px solid #ffffff;
    box-sizing: border-box;
}

/* Letzter sichtbarer Slide bekommt keinen rechten Strich */
.slider.slider-squares .slick-active:last-child {
    border-right: none;
}

/* ========================================================================
   Responsive: Mobile – 1 Kachel, volle Breite
   ======================================================================== */

@media (max-width: 767px) {
    .slider.slider-squares .slide-sq-item {
        width: 100%;
    }
}


/* Mobile (< 768px) – ERSETZE den bisherigen Block */
@media (max-width: 767px) {

    /* Slide nimmt volle Viewport-Breite – Slick liest diesen Wert */
    .slider.slider-start .slide-item {
        width: 100vw !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }

    /* Media-Container passt sich an */
    .slider.slider-start .slide-item-image .slide-media,
    .slider.slider-start .slide-item-text .slide-media {
        height: 20rem;
        width: 100%;
        overflow: hidden;
    }

    /* img: 100% bezieht sich jetzt auf 100vw – object-fit greift korrekt */
    .slider.slider-start .slide-item-image .slide-media img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        display: block;
    }

    .slider.slider-start .slide-item-text {
        width: 100vw !important;
        max-width: 100vw;
    }

    .slider.slider-start .slide-item-text .slide-media {
        padding: 1.5rem;
    }

    .slider.slider-start .slide-text-content p {
        font-size: 1.4rem;
        line-height: 2rem;
    }

    .slider.slider-start .slide-caption em {
        font-size: 1.5rem;
        line-height: 1.8rem;
    }

    .slider.slider-start .slide-caption span {
        font-size: 1.1rem;
        line-height: 1.6rem;
    }
}


@media (max-width: 767px) {

    /* -------------------------------------------------------
       Slick-interne Wrapper: volle Höhe der slick-list erben
       ------------------------------------------------------- */
    .slider-fade .slick-slide {
        height: 100% !important;
    }

    .slider-fade .slick-slide > div {
        height: 100%;
    }

    /* -------------------------------------------------------
       Slide-Item: als vertikale Flex-Box, volle Höhe
       ------------------------------------------------------- */
    .slider-fade .slide-fade-item {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    /* -------------------------------------------------------
       Bild-Bereiche: nicht schrumpfen lassen
       ------------------------------------------------------- */
    .slider-fade .slide-fade-grid,
    .slider-fade .slide-fade-image,
    .slider-fade .slide-fade-image-full {
        flex-shrink: 0;
    }

    /* -------------------------------------------------------
       Caption: füllt den verbleibenden Platz –
       damit die Hintergrundfarbe bis ganz unten reicht
       ------------------------------------------------------- */
    .slider-fade figcaption.slide-fade-caption {
        flex: 1;
    }

    .slide-fade-caption em {
        font-size: 2.25rem;
        line-height: 3.25rem;
    }

    .tx-address-manager .address-list-wrapper .address-list-item h3 {
        line-height: 2.8rem !important;
    }

    /* -------------------------------------------------------
   Downloads: Container-Breite sicherstellen
   ------------------------------------------------------- */
    .downloads {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow: hidden; /* verhindert Overflow durch native img-Breiten */
    }

    .downloads .download > div {
        overflow: hidden; /* Sicherheitsnetz für den anonymen Bild-Wrapper */
    }

    /* -------------------------------------------------------
       Bilder: HTML-width-Attribut per CSS übersteuern
       ------------------------------------------------------- */
    .downloads .download img {
        max-width: 100%;
        width: 100%;
        height: auto;
        display: block;
    }

    section div.downloads {
        display: unset;
    }
}