@charset "UTF-8";
/*
 * Estrel Tower — Sustainability & Innovation
 * Pixel-perfect Figma implementation (1920 design frame).
 *
 * Layout (within 1815 container):
 *   Section        1397 × 1059  centered
 *   Image          797 × 797   top 0, left 0 (moss rock, parallax)
 *   Title          875 × 216   top 456, left 505
 *     "Sustainability"  Söhne 400  124/105  #14172D
 *     "& Innovation"    Alpina 250i 124/105  #14172D
 *   Body text      871 × 288   top 708, left 526, Söhne 400 24/32 #FEF5EC
 *   Link           178 × 26    top 1033, left 526, Alpina 250i 26/26 #FED3CD
 *
 * Scaling: --u = 100cqi / 1815 (container-based).
 */

.estrel-sustainability {
    container-type: inline-size;
    margin-top: calc(38 * 100vw / 1920) !important;   /* Figma gap: Stats → Sustainability = 38px */
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    background: transparent;
    overflow: visible;
}

.estrel-sustainability__inner {
    --u: calc(100cqi / 1920);
    position: relative;
    width: calc(1397 * var(--u));
    height: calc(1059 * var(--u));
    margin: 0 auto;
}


/* ============================
   IMAGE — moss rock, parallax
   ============================ */

.estrel-sustainability__image {
    position: absolute;
    top: 0;
    left: 0;
    width: calc(797 * var(--u));
    height: calc(797 * var(--u));
    object-fit: cover;
    display: block;
    z-index: 2;
}


/* ============================
   TITLE — overlaps image bottom-right
   ============================ */

.estrel-sustainability__heading {
    position: absolute;
    top: calc(456 * var(--u));
    left: calc(505 * var(--u));
    width: calc(875 * var(--u));
    margin: 0;
    z-index: 1;
    color: #FEF5EC;
    font-size: calc(124 * var(--u));
    line-height: calc(105 * var(--u));
    letter-spacing: 0;
}

.estrel-sustainability__heading-line1 {
    display: block;
    font-family: var(--font-soehne);
    font-weight: 400;
    font-style: normal;
}

.estrel-sustainability__heading-line2 {
    display: block;
    font-family: var(--font-alpina);
    font-weight: 250;
    font-style: italic;
}

/* Legacy class support for backend-driven title */
.estrel-sustainability__title .estrel-section-title__main {
    display: block;
    font-family: var(--font-soehne);
    font-weight: 400;
    font-size: calc(124 * var(--u));
    line-height: calc(105 * var(--u));
    color: #FEF5EC;
    margin: 0 0 0 calc(155 * var(--u));
}

.estrel-sustainability__title .estrel-section-title__sub {
    display: block;
    font-family: var(--font-alpina);
    font-weight: 250;
    font-style: italic;
    font-size: calc(124 * var(--u));
    line-height: calc(105 * var(--u));
    color: #FEF5EC;
}

.estrel-sustainability__title {
    position: absolute;
    top: calc(456 * var(--u));
    left: calc(505 * var(--u));
    width: calc(875 * var(--u));
    z-index: 1;
    margin: 0;
}


/* ============================
   BODY — text + link
   ============================ */

.estrel-sustainability__body {
    position: absolute;
    top: calc(708 * var(--u));
    left: calc(526 * var(--u));
    width: calc(871 * var(--u));
}

.estrel-sustainability__text {
    font-family: var(--font-soehne);
    font-weight: 400;
    font-size: calc(24 * var(--u));
    line-height: calc(32 * var(--u));
    letter-spacing: 0;
    color: #FEF5EC;
}

.estrel-sustainability__text p {
    margin: 0;
}

.estrel-sustainability__text p + p {
    margin-top: calc(32 * var(--u));
}

.estrel-sustainability__link {
    display: inline-flex;
    align-items: center;
    gap: calc(14 * var(--u));
    margin-top: calc(37 * var(--u));
    color: #FED3CD;
    font-family: var(--font-alpina);
    font-weight: 250;
    font-style: italic;
    font-size: calc(26 * var(--u));
    line-height: 1;
    text-decoration: none;
    transition: opacity 0.3s;
}

.estrel-sustainability__link:hover {
    opacity: 0.85;
    text-decoration: none;
}

.estrel-sustainability__link-arrow {
    display: inline-flex;
    width: calc(25 * var(--u));
    height: calc(8 * var(--u));
}

.estrel-sustainability__link-arrow svg {
    width: 100%;
    height: 100%;
    display: block;
}


/* ============================
   SUNRISE THEME
   ============================ */

body.sunrise .estrel-sustainability__heading,
body.sunrise .estrel-sustainability__title .estrel-section-title__main,
body.sunrise .estrel-sustainability__title .estrel-section-title__sub {
    color: #14172D;
}

body.sunrise .estrel-sustainability__text {
    color: #14172D;
}

body.sunrise .estrel-sustainability__link {
    color: #14172D;
}


/* ============================
   MOBILE (<768)
   ============================ */

@media (max-width: 1024px) {
    .estrel-sustainability__inner {
        width: 100%;
        height: auto;
        padding: 40px var(--container-padding);
    }

    .estrel-sustainability__image {
        position: relative;
        width: 55%;
        height: auto;
    }

    .estrel-sustainability__title,
    .estrel-sustainability__heading {
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        margin-top: -1.5rem;
    }

    .estrel-sustainability__title .estrel-section-title__main,
    .estrel-sustainability__title .estrel-section-title__sub,
    .estrel-sustainability__heading {
        font-size: clamp(3rem, 8vw, 5rem);
        line-height: 0.85;
    }

    .estrel-sustainability__body {
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        margin-top: 2rem;
    }

    .estrel-sustainability__text {
        font-size: 1.125rem;
        line-height: 1.6;
    }

    .estrel-sustainability__link {
        font-size: 1.125rem;
        margin-top: 1.5rem;
    }

    .estrel-sustainability__link-arrow {
        width: 25px;
        height: 8px;
    }
}

@media (max-width: 767px) {
    .estrel-sustainability__inner {
        width: 100%;
        height: auto;
        padding: 40px 20px;
    }

    .estrel-sustainability__image {
        position: relative;
        width: 70%;
        height: auto;
    }

    .estrel-sustainability__title,
    .estrel-sustainability__heading {
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        margin-top: -2rem;
    }

    .estrel-sustainability__title .estrel-section-title__main,
    .estrel-sustainability__title .estrel-section-title__sub,
    .estrel-sustainability__heading {
        font-size: clamp(2.5rem, 11vw, 4rem);
        line-height: 0.85;
    }

    .estrel-sustainability__body {
        position: relative;
        top: auto;
        left: auto;
        width: auto;
        margin-top: 1.5rem;
    }

    .estrel-sustainability__text {
        font-size: 1rem;
        line-height: 1.5;
    }

    .estrel-sustainability__link {
        font-size: 1rem;
        margin-top: 1rem;
    }

    .estrel-sustainability__link-arrow {
        width: 25px;
        height: 8px;
    }
}
