/* ============================================================
   HORIZONTALEN SEITENVERSATZ VERHINDERN
   ============================================================ */

html.ah-home-benefits-page,
html.ah-home-benefits-page body {
    overflow-x: hidden !important;
}

@supports (overflow: clip) {

    html.ah-home-benefits-page,
    html.ah-home-benefits-page body {
        overflow-x: clip !important;
    }

}


/* ============================================================
   BASIS
   ============================================================ */

body.page-id-243 .ah-home-benefits,
body.page-id-243 .ah-home-benefits *,
body.page-id-243 .ah-home-benefits *::before,
body.page-id-243 .ah-home-benefits *::after {
    box-sizing: border-box;
}


/*
 * Nur der direkte Elementor-Shortcode-Wrapper wird bereinigt.
 */

body.page-id-243 .ah-home-benefits-widget,
body.page-id-243
.ah-home-benefits-widget
> .elementor-widget-container {
    width: 100% !important;
    max-width: none !important;

    min-width: 0 !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
}


/*
 * Auch der direkte Elementor-Container wird vollständig
 * neutralisiert. Alle sichtbaren Abstände kommen dadurch nur
 * noch aus den beiden Shortcodes selbst.
 */

body.page-id-243 .ah-home-benefits-host {
    width: 100% !important;
    max-width: none !important;

    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    gap: 0 !important;
    row-gap: 0 !important;
    column-gap: 0 !important;

    overflow: visible !important;
}


/* ============================================================
   SECTION
   ============================================================ */

body.page-id-243 .ah-home-benefits {
    --ah-benefits-viewport-width: 100vw;
    --ah-benefits-left-offset: 0px;
    --ah-benefits-top-overlap: 0px;
    --ah-benefits-editor-gap-overlap: 0px;

    position: relative;

    display: block;

    width:
        var(
            --ah-benefits-viewport-width
        );

    max-width: none;

    min-width: 0;
    min-height: 0;

    /*
     * Der gemessene Abstand zum Apartment-Bereich wird entfernt.
     * Dadurch beginnt die beige Fläche ohne weiße Lücke.
     */

    margin:
        calc(
            var(--ah-benefits-top-overlap)
            *
            -1
        )
        0
        0
        var(--ah-benefits-left-offset);

    /*
     * Grundabstände.
     *
     * Kontrollierter Innenabstand nach dem neuen
     * Abschnittsübergang.
     */

    padding:
        72px
        0
        96px;

    overflow: hidden;
    isolation: isolate;

    background: var(--avh-base-warm-white);
    color: var(--avh-base-gray);

    font-family:
        Verdana,
        Geneva,
        sans-serif !important;
}


/*
 * Vollflächiger Premium-Divider:
 *
 * Der Divider ist ein eigenes Element und keine bloße Border.
 * Dadurch bedeckt er zuverlässig die gesamte Breite des
 * Benefits-Bereichs, sowohl auf der Website als auch im
 * Elementor-Responsive-Editor.
 */

body.page-id-243 .ah-home-benefits__divider {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 4;

    display: block;

    width: 100%;
    min-width: 100%;
    height: 3px;

    margin: 0;
    padding: 0;

    background:
        linear-gradient(
            90deg,
            var(--avh-base-gray) 0%,
            var(--avh-base-gray) 24%,
            var(--avh-base-gray) 76%,
            var(--avh-base-gray) 100%
        );

    box-shadow:
        0 1px 0
        rgba(var(--avh-rgb-base-warm-white), 0.40);

    pointer-events: none;
}


/*
 * Kurzer weicher Innenschatten direkt unter dem Divider.
 */

body.page-id-243 .ah-home-benefits::before {
    content: "";

    position: absolute;
    top: 3px;
    left: 0;
    right: 0;
    z-index: 1;

    width: auto;
    height: 20px;

    border: 0;

    background:
        linear-gradient(
            180deg,
            rgba(var(--avh-rgb-base-gray), 0.105) 0%,
            rgba(var(--avh-rgb-base-gray), 0.048) 34%,
            rgba(var(--avh-rgb-base-gray), 0.015) 66%,
            rgba(var(--avh-rgb-base-gray), 0) 100%
        );

    box-shadow: none;

    pointer-events: none;
}


/*
 * Sehr dezente Lichttiefe innerhalb der beigen Fläche.
 */

body.page-id-243 .ah-home-benefits::after {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 0;

    background:
        radial-gradient(
            ellipse 76% 44% at 50% 0%,
            rgba(var(--avh-rgb-base-warm-white), 0.36) 0%,
            rgba(var(--avh-rgb-base-warm-white), 0.14) 40%,
            rgba(var(--avh-rgb-base-warm-white), 0) 74%
        );

    pointer-events: none;
}


/* ============================================================
   INNERER BEREICH
   ============================================================ */

body.page-id-243 .ah-home-benefits__inner {
    position: relative;
    z-index: 2;

    width:
        min(
            1180px,
            calc(100% - 72px)
        );

    margin:
        0
        auto;
}


/* ============================================================
   KOPFBEREICH
   ============================================================ */

body.page-id-243 .ah-home-benefits__header {
    position: relative;
    z-index: 5;
    isolation: isolate;

    width:
        min(
            820px,
            100%
        );

    margin:
        0
        auto
        48px;

    text-align: center;
}


body.page-id-243 .ah-home-benefits__eyebrow {
    position: relative;
    z-index: 6;

    display: block;

    margin:
        0
        0
        14px;

    color: var(--avh-base-gray);

    font-family:
        Verdana,
        Geneva,
        sans-serif !important;

    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.18em !important;

    text-align: center;
    text-transform: uppercase !important;
}


body.page-id-243 .ah-home-benefits__title {
    position: relative;
    z-index: 6;

    margin:
        0
        0
        16px;

    color: var(--avh-base-gray);

    font-family:
        Verdana,
        Geneva,
        sans-serif !important;

    font-size: 36px !important;
    font-weight: 700 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.026em !important;

    text-align: center;
    text-transform: none !important;

    text-wrap: balance;
}


body.page-id-243 .ah-home-benefits__intro {
    position: relative;
    z-index: 6;

    width:
        min(
            730px,
            100%
        );

    margin:
        0
        auto;

    color:
        rgba(var(--avh-rgb-base-gray), 0.70);

    font-family:
        Verdana,
        Geneva,
        sans-serif !important;

    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.72 !important;
    letter-spacing: 0 !important;

    text-align: center;
    text-transform: none !important;

    text-wrap: balance;
}


/* ============================================================
   LISTE
   ============================================================ */

body.page-id-243 .ah-home-benefits__list {
    width:
        min(
            1040px,
            100%
        );

    margin:
        0
        auto;

    border-top:
        1px solid
        rgba(var(--avh-rgb-base-gray), 0.24);
}


/* ============================================================
   EINZELNE ZEILE
   ============================================================ */

body.page-id-243 .ah-home-benefits__item {
    position: relative;

    display: grid;

    grid-template-columns:
        42px
        minmax(250px, 310px)
        minmax(0, 1fr);

    column-gap:
        clamp(
            26px,
            3vw,
            48px
        );

    align-items: center;

    width: 100%;
    min-width: 0;

    margin: 0;

    padding:
        30px
        18px
        31px;

    border-bottom:
        1px solid
        rgba(var(--avh-rgb-base-gray), 0.24);

    background:
        rgba(var(--avh-rgb-base-warm-white), 0);

    transition:
        background-color
        240ms
        ease,

        border-color
        240ms
        ease;
}


/*
 * Dezente Akzentlinie beim Hover.
 */

body.page-id-243 .ah-home-benefits__item::before {
    content: "";

    position: absolute;
    top: 23px;
    bottom: 23px;
    left: 0;

    width: 2px;

    background: var(--avh-base-gray);

    opacity: 0;

    transform:
        scaleY(0.45);

    transform-origin: center;

    transition:
        opacity
        240ms
        ease,

        transform
        320ms
        cubic-bezier(
            0.22,
            1,
            0.36,
            1
        );

    pointer-events: none;
}


/* ============================================================
   NUMMER
   ============================================================ */

body.page-id-243 .ah-home-benefits__number {
    align-self: start;

    margin: 0;
    padding-top: 6px;

    color: var(--avh-base-gray);

    font-family:
        Verdana,
        Geneva,
        sans-serif !important;

    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.14em !important;

    text-align: left;
    text-transform: none !important;
}


/* ============================================================
   TITELSPALTE
   ============================================================ */

body.page-id-243 .ah-home-benefits__item-title {
    min-width: 0;

    margin: 0;
    padding: 0;

    color: var(--avh-base-gray);

    font-family:
        Verdana,
        Geneva,
        sans-serif !important;

    font-size: 19px !important;
    font-weight: 700 !important;
    line-height: 1.38 !important;
    letter-spacing: -0.012em !important;

    text-align: left;
    text-transform: none !important;

    overflow-wrap: normal;
    word-break: normal;

    text-wrap: balance;
}


/* ============================================================
   BESCHREIBUNGSSPALTE
   ============================================================ */

body.page-id-243 .ah-home-benefits__description {
    min-width: 0;
    max-width: 610px;

    margin: 0;
    padding: 0;

    color:
        rgba(var(--avh-rgb-base-gray), 0.68);

    font-family:
        Verdana,
        Geneva,
        sans-serif !important;

    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.70 !important;
    letter-spacing: 0 !important;

    text-align: left;
    text-transform: none !important;

    overflow-wrap: normal;
    word-break: normal;
}


/* ============================================================
   HOVER
   ============================================================ */

@media (hover: hover) and (pointer: fine) {

    body.page-id-243
    .ah-home-benefits__item:hover {
        background:
            rgba(var(--avh-rgb-base-warm-white), 0.38);

        border-bottom-color:
            rgba(var(--avh-rgb-base-gray), 0.38);
    }


    body.page-id-243
    .ah-home-benefits__item:hover::before {
        opacity: 1;

        transform:
            scaleY(1);
    }

}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 1024px) {

    body.page-id-243 .ah-home-benefits {
        padding:
            60px
            0
            82px;
    }


    body.page-id-243 .ah-home-benefits__inner {
        width:
            min(
                100%,
                calc(100% - 46px)
            );
    }


    body.page-id-243 .ah-home-benefits__header {
        margin-bottom: 40px;
    }


    body.page-id-243 .ah-home-benefits__title {
        font-size: 31px !important;
        line-height: 1.20 !important;
    }


    body.page-id-243 .ah-home-benefits__intro {
        max-width: 660px;

        font-size: 13px !important;
        line-height: 1.68 !important;
    }


    body.page-id-243 .ah-home-benefits__item {
        grid-template-columns:
            36px
            minmax(205px, 255px)
            minmax(0, 1fr);

        column-gap: 24px;

        padding:
            26px
            12px
            27px;
    }


    body.page-id-243 .ah-home-benefits__item-title {
        font-size: 17px !important;
        line-height: 1.40 !important;
    }


    body.page-id-243 .ah-home-benefits__description {
        font-size: 13px !important;
        line-height: 1.68 !important;
    }

}


/* ============================================================
   SMARTPHONE
   ============================================================ */

@media (max-width: 767px) {

    body.page-id-243 .ah-home-benefits {
        padding:
            38px
            0
            66px;
    }


    body.page-id-243 .ah-home-benefits__divider {
        height: 3px;
    }


    body.page-id-243 .ah-home-benefits::before {
        top: 3px;
        height: 14px;
    }


    body.page-id-243 .ah-home-benefits__inner {
        width:
            calc(100% - 28px);
    }


    body.page-id-243 .ah-home-benefits__header {
        margin-bottom: 32px;
    }


    body.page-id-243 .ah-home-benefits__eyebrow {
        margin-bottom: 11px;

        font-size: 9px !important;
        line-height: 1.4 !important;
        letter-spacing: 0.16em !important;
    }


    body.page-id-243 .ah-home-benefits__title {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;

        margin-bottom: 13px;

        font-size: 26px !important;
        line-height: 1.22 !important;
        letter-spacing: -0.018em !important;
    }


    body.page-id-243 .ah-home-benefits__intro {
        font-size: 13px !important;
        line-height: 1.65 !important;
    }


    body.page-id-243 .ah-home-benefits__item {
        grid-template-columns:
            32px
            minmax(0, 1fr);

        column-gap: 12px;
        row-gap: 9px;

        align-items: start;

        padding:
            21px
            7px
            22px;
    }


    body.page-id-243 .ah-home-benefits__number {
        grid-column: 1;
        grid-row: 1;

        padding-top: 4px;

        font-size: 9px !important;
    }


    body.page-id-243 .ah-home-benefits__item-title {
        grid-column: 2;
        grid-row: 1;

        font-size: 17px !important;
        line-height: 1.36 !important;
    }


    body.page-id-243 .ah-home-benefits__description {
        grid-column: 2;
        grid-row: 2;

        max-width: none;

        font-size: 13px !important;
        line-height: 1.65 !important;
    }


    body.page-id-243 .ah-home-benefits__item::before {
        top: 17px;
        bottom: 17px;
    }

}


/* ============================================================
   KLEINE SMARTPHONES
   ============================================================ */

@media (max-width: 390px) {

    body.page-id-243 .ah-home-benefits {
        padding-top: 34px;
    }


    body.page-id-243 .ah-home-benefits__inner {
        width:
            calc(100% - 22px);
    }


    body.page-id-243 .ah-home-benefits__title {
        font-size: 24px !important;
    }


    body.page-id-243 .ah-home-benefits__item {
        grid-template-columns:
            29px
            minmax(0, 1fr);

        column-gap: 9px;
    }

}


/* ============================================================
   REDUZIERTE BEWEGUNG
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    body.page-id-243 .ah-home-benefits__item,
    body.page-id-243 .ah-home-benefits__item::before {
        transition: none !important;
    }

}


/* ============================================================
   ELEMENTOR-EDITOR-VORSCHAU
   ============================================================
 *
 * Im Editor bleibt der Bereich innerhalb des Vorschau-Iframes.
 * Die Live-Berechnung für Browserkante und Überlappung wird
 * dort deaktiviert.
 */

body.ah243-elementor-preview .ah-home-benefits,
.ah-home-benefits.ah-home-benefits--editor {
    --ah-benefits-viewport-width: 100% !important;
    --ah-benefits-left-offset: 0px !important;
    --ah-benefits-top-overlap: 0px !important;

    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
}

body.ah243-elementor-preview
.elementor-widget-shortcode:has(.ah-home-benefits)
> .elementor-widget-container {
    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
}

/*
 * Direkten Elementor-Container auch ohne JavaScript neutralisieren.
 * So bleiben Titel und oberer Bereich im Mobile-Editor sichtbar.
 */

body.ah243-elementor-preview
.e-con:has(.ah-home-benefits),
body.ah243-elementor-preview
.elementor-element:has(> .elementor-widget-shortcode .ah-home-benefits) {
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    gap: 0 !important;
    row-gap: 0 !important;
    column-gap: 0 !important;

    overflow: visible !important;
}