/* ==========================================================
CEV WEBSITE

complexo.css

Página:
/complexo

CSS EXCLUSIVO DA PÁGINA

Componentes CMS:

- page-hero
- stats
- feature-grid
- split
- location
- sustainability
- gallery
- cta

IMPORTANTE:

Este arquivo depende de:

style.css

O style.css é responsável por:

- reset
- variáveis globais
- tipografia global
- container global
- Header
- Menu
- Footer
- botões globais
- componentes compartilhados

Este arquivo é responsável SOMENTE pela identidade
e pelos componentes específicos de /complexo.

NÃO redefine:

- body global
- imagens globais
- h1/h2/h3 globais
- p globais
- Header
- Menu
- Footer
- container global
- botões globais

Escopo:

body.page-complexo

========================================================== */


/* ==========================================================
VARIÁVEIS EXCLUSIVAS
========================================================== */

body.page-complexo {

    --complexo-green:
        #0D5C57;

    --complexo-green-dark:
        #083F3C;

    --complexo-green-deep:
        #062F2C;

    --complexo-red:
        #C63C35;

    --complexo-red-dark:
        #A72F2A;

    --complexo-title:
        #17322F;

    --complexo-text:
        #454545;

    --complexo-muted:
        #66737A;

    --complexo-light:
        #F6F7F8;

    --complexo-light-green:
        #EAF5F4;

    --complexo-border:
        #E5EAEA;

    --complexo-white:
        #FFFFFF;

    --complexo-radius:
        22px;

    --complexo-radius-lg:
        28px;

    --complexo-shadow:
        0 20px 60px rgba(0, 0, 0, .10);

    --complexo-shadow-soft:
        0 12px 35px rgba(0, 0, 0, .07);

    --complexo-transition:
        .30s ease;

}


/* ==========================================================
HERO
========================================================== */

body.page-complexo .page-hero {

    position:
        relative;

    min-height:
        720px;

    display:
        flex;

    align-items:
        center;

    overflow:
        hidden;

    isolation:
        isolate;

    padding-top:
        84px;

    color:
        #fff;

}


/* ==========================================================
HERO BACKGROUND
========================================================== */

body.page-complexo .page-hero-background {

    position:
        absolute;

    inset:
        0;

    z-index:
        0;

    width:
        100%;

    height:
        100%;

    overflow:
        hidden;

}


body.page-complexo .page-hero-background img {

    display:
        block;

    width:
        100%;

    height:
        100%;

    max-width:
        none;

    object-fit:
        cover;

    object-position:
        center;

}


/* ==========================================================
HERO OVERLAY
========================================================== */

body.page-complexo .page-hero-overlay {

    position:
        absolute;

    inset:
        0;

    z-index:
        1;

    background:
        linear-gradient(
            90deg,
            rgba(6, 35, 32, .92) 0%,
            rgba(6, 35, 32, .68) 45%,
            rgba(6, 35, 32, .28) 100%
        );

    pointer-events:
        none;

}


/* ==========================================================
HERO CONTAINER

Utiliza o sistema horizontal global definido em style.css.

Não redefine .container global.
========================================================== */

body.page-complexo .page-hero-container {

    position:
        relative;

    z-index:
        2;

    width:
        min(
            92%,
            var(--container)
        );

    margin-inline:
        auto;

}


/* ==========================================================
HERO CONTENT
========================================================== */

body.page-complexo .page-hero-content {

    width:
        100%;

    max-width:
        620px;

    padding:
        80px 0;

}


/* ==========================================================
HERO TAG
========================================================== */

body.page-complexo .page-hero-tag {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        30px;

    padding:
        8px 20px;

    margin-bottom:
        26px;

    border-radius:
        999px;

    background:
        var(--complexo-red);

    color:
        #fff;

    font-size:
        .72rem;

    line-height:
        1;

    font-weight:
        800;

    letter-spacing:
        .15em;

    text-transform:
        uppercase;

}


/* ==========================================================
HERO TITLE
========================================================== */

body.page-complexo .page-hero h1 {

    max-width:
        620px;

    margin:
        0 0 28px;

    color:
        #fff;

    font-size:
        clamp(
            3rem,
            5vw,
            4.8rem
        );

    line-height:
        .97;

    font-weight:
        900;

    letter-spacing:
        -2px;

}


/* ==========================================================
HERO TEXT
========================================================== */

body.page-complexo .page-hero p {

    max-width:
        540px;

    margin:
        0 0 40px;

    color:
        rgba(255, 255, 255, .92);

    font-size:
        1.05rem;

    line-height:
        1.75;

}


/* ==========================================================
HERO ACTIONS
========================================================== */

body.page-complexo .page-hero-actions {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        18px;

}


/* ==========================================================
HERO BUTTON

Utiliza .btn global.
Somente define dimensão específica do Hero.
========================================================== */

body.page-complexo .page-hero-actions .btn {

    min-height:
        54px;

}


/* ==========================================================
STATS
========================================================== */

body.page-complexo .page-stats {

    padding:
        95px 0;

    background:
        #fff;

}


/* ==========================================================
STATS HEADER
========================================================== */

body.page-complexo .page-section-header {

    width:
        100%;

    max-width:
        760px;

    margin:
        0 auto 55px;

    text-align:
        center;

}


body.page-complexo .page-section-header h2 {

    margin:
        0 0 18px;

    color:
        var(--complexo-title);

    font-size:
        clamp(
            2rem,
            4vw,
            3.2rem
        );

    line-height:
        1.12;

    font-weight:
        800;

}


body.page-complexo .page-section-header p {

    max-width:
        680px;

    margin:
        0 auto;

    color:
        var(--complexo-muted);

    font-size:
        1rem;

    line-height:
        1.75;

}


/* ==========================================================
STATS GRID
========================================================== */

body.page-complexo .page-stats-grid {

    display:
        grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap:
        24px;

}


/* ==========================================================
STAT
========================================================== */

body.page-complexo .page-stat {

    position:
        relative;

    min-width:
        0;

    min-height:
        165px;

    overflow:
        hidden;

    padding:
        32px;

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    text-align:
        center;

    border-radius:
        var(--complexo-radius);

    color:
        #fff;

    background:
        linear-gradient(
            135deg,
            var(--complexo-green),
            #08736B
        );

    box-shadow:
        var(--complexo-shadow);

    transition:
        transform var(--complexo-transition),
        box-shadow var(--complexo-transition);

}


body.page-complexo .page-stat:nth-child(even) {

    background:
        linear-gradient(
            135deg,
            var(--complexo-red),
            #D9534B
        );

}


body.page-complexo .page-stat::before {

    content:
        "";

    position:
        absolute;

    top:
        -55px;

    right:
        -55px;

    width:
        130px;

    height:
        130px;

    border-radius:
        50%;

    background:
        rgba(255, 255, 255, .08);

    pointer-events:
        none;

}


body.page-complexo .page-stat:hover {

    transform:
        translateY(-8px);

    box-shadow:
        0 30px 60px rgba(0, 0, 0, .16);

}


body.page-complexo .page-stat strong {

    position:
        relative;

    z-index:
        1;

    display:
        block;

    color:
        #fff;

    font-size:
        clamp(
            2.4rem,
            3vw,
            3.1rem
        );

    line-height:
        1;

    font-weight:
        900;

    letter-spacing:
        -1.5px;

}


body.page-complexo .page-stat span {

    position:
        relative;

    z-index:
        1;

    display:
        block;

    max-width:
        180px;

    margin-top:
        12px;

    color:
        rgba(255, 255, 255, .92);

    font-size:
        .9rem;

    line-height:
        1.45;

    font-weight:
        700;

}


/* ==========================================================
FEATURE GRID SECTION
========================================================== */

body.page-complexo .feature-grid-section {

    padding:
        110px 0;

    background:
        var(--complexo-light);

}


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

body.page-complexo .section-header {

    width:
        100%;

    max-width:
        760px;

    margin:
        0 auto 65px;

    text-align:
        center;

}


body.page-complexo .section-header h2 {

    margin:
        0 0 20px;

    color:
        var(--complexo-title);

    font-size:
        clamp(
            2rem,
            4vw,
            3.2rem
        );

    line-height:
        1.15;

    font-weight:
        800;

}


body.page-complexo .section-header p {

    max-width:
        680px;

    margin:
        0 auto;

    color:
        var(--complexo-muted);

    font-size:
        1.05rem;

    line-height:
        1.8;

}


/* ==========================================================
FEATURE GRID
========================================================== */

body.page-complexo .feature-grid {

    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap:
        30px;

}


/* ==========================================================
FEATURE CARD
========================================================== */

body.page-complexo .feature-card {

    position:
        relative;

    display:
        flex;

    flex-direction:
        column;

    min-width:
        0;

    height:
        100%;

    min-height:
        250px;

    padding:
        38px;

    overflow:
        hidden;

    border:
        1px solid var(--complexo-border);

    border-radius:
        var(--complexo-radius);

    background:
        #fff;

    box-shadow:
        var(--complexo-shadow-soft);

    transition:
        transform var(--complexo-transition),
        box-shadow var(--complexo-transition),
        border-color var(--complexo-transition);

}


body.page-complexo .feature-card::before {

    content:
        "";

    position:
        absolute;

    left:
        0;

    top:
        0;

    width:
        5px;

    height:
        0;

    background:
        var(--complexo-green);

    transition:
        height var(--complexo-transition);

}


body.page-complexo .feature-card:hover {

    transform:
        translateY(-8px);

    border-color:
        var(--complexo-green);

    box-shadow:
        0 24px 55px rgba(13, 92, 87, .14);

}


body.page-complexo .feature-card:hover::before {

    height:
        100%;

}


/* ==========================================================
FEATURE ICON
========================================================== */

body.page-complexo .feature-icon {

    width:
        68px;

    height:
        68px;

    flex:
        0 0 68px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    margin-bottom:
        25px;

    border-radius:
        50%;

    background:
        var(--complexo-green);

    color:
        #fff;

    box-shadow:
        0 10px 25px rgba(13, 92, 87, .16);

    transition:
        transform var(--complexo-transition),
        background-color var(--complexo-transition);

}


body.page-complexo .feature-card:hover .feature-icon {

    transform:
        rotate(-6deg);

}


body.page-complexo .feature-icon img {

    display:
        block;

    width:
        34px;

    height:
        34px;

    max-width:
        none;

    object-fit:
        contain;

    object-position:
        center;

    filter:
        brightness(0) invert(1);

}


body.page-complexo .feature-icon-placeholder span {

    color:
        #fff;

    font-size:
        1.7rem;

    line-height:
        1;

    font-weight:
        900;

}


body.page-complexo .feature-card h3 {

    margin:
        0 0 14px;

    color:
        var(--complexo-title);

    font-size:
        1.25rem;

    line-height:
        1.3;

    font-weight:
        800;

}


body.page-complexo .feature-card p {

    margin:
        auto 0 0;

    color:
        var(--complexo-text);

    font-size:
        .95rem;

    line-height:
        1.75;

}


/* ==========================================================
SPLIT
========================================================== */

body.page-complexo .split-section {

    padding:
        110px 0;

    background:
        #fff;

}


body.page-complexo .page-split {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap:
        70px;

    align-items:
        center;

}


body.page-complexo .page-split.reverse {

    direction:
        rtl;

}


body.page-complexo .page-split.reverse > * {

    direction:
        ltr;

}


body.page-complexo .page-split-content {

    min-width:
        0;

}


body.page-complexo .page-split-content h2 {

    margin:
        0 0 24px;

    color:
        var(--complexo-title);

    font-size:
        clamp(
            2rem,
            4vw,
            3.2rem
        );

    line-height:
        1.15;

    font-weight:
        800;

}


body.page-complexo .page-split-content p {

    margin:
        0 0 24px;

    color:
        var(--complexo-text);

    line-height:
        1.8;

}


body.page-complexo .page-list {

    display:
        flex;

    flex-direction:
        column;

    gap:
        16px;

    margin:
        30px 0;

    padding:
        0;

    list-style:
        none;

}


body.page-complexo .page-list li {

    position:
        relative;

    padding-left:
        30px;

    color:
        var(--complexo-title);

    font-weight:
        600;

    line-height:
        1.6;

}


body.page-complexo .page-list li::before {

    content:
        "✓";

    position:
        absolute;

    left:
        0;

    top:
        0;

    color:
        var(--complexo-green);

    font-weight:
        900;

}


body.page-complexo .page-split-action {

    margin-top:
        30px;

}


body.page-complexo .page-split-image {

    position:
        relative;

    width:
        100%;

    min-width:
        0;

    aspect-ratio:
        4 / 3;

    overflow:
        hidden;

    display:
        flex;

    align-items:
        stretch;

    justify-content:
        stretch;

    border-radius:
        var(--complexo-radius-lg);

    background:
        #ECECEC;

    box-shadow:
        var(--complexo-shadow);

}


body.page-complexo .page-split-image img {

    display:
        block;

    width:
        100%;

    height:
        100%;

    max-width:
        none;

    object-fit:
        cover;

    object-position:
        center;

}


body.page-complexo .split-placeholder {

    width:
        100%;

    height:
        100%;

    min-height:
        320px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    background:
        #ECECEC;

    color:
        #777;

    font-size:
        .9rem;

    font-weight:
        700;

}


/* ==========================================================
LOCATION
========================================================== */

body.page-complexo .page-location {

    padding:
        100px 0;

    background:
        var(--complexo-light);

}


body.page-complexo .page-location-grid {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap:
        70px;

    align-items:
        center;

}


body.page-complexo .page-location-content {

    min-width:
        0;

}


body.page-complexo .page-location-content h2 {

    margin:
        0 0 22px;

    color:
        var(--complexo-title);

    font-size:
        clamp(
            2rem,
            4vw,
            3.2rem
        );

    line-height:
        1.15;

    font-weight:
        800;

}


body.page-complexo .page-location-content > p {

    margin:
        0;

    color:
        var(--complexo-text);

    line-height:
        1.8;

}


body.page-complexo .location-list {

    display:
        flex;

    flex-direction:
        column;

    gap:
        16px;

    margin:
        30px 0;

    padding:
        0;

    list-style:
        none;

}


body.page-complexo .location-list li {

    position:
        relative;

    padding-left:
        30px;

    color:
        var(--complexo-title);

    font-weight:
        600;

    line-height:
        1.6;

}


body.page-complexo .location-list li::before {

    content:
        "✓";

    position:
        absolute;

    left:
        0;

    top:
        0;

    color:
        var(--complexo-green);

    font-weight:
        900;

}


body.page-complexo .page-location-address {

    margin-top:
        30px;

    padding:
        25px;

    border:
        1px solid var(--complexo-border);

    border-radius:
        var(--complexo-radius);

    background:
        #fff;

    box-shadow:
        var(--complexo-shadow-soft);

}


body.page-complexo .page-location-address strong {

    display:
        block;

    margin-bottom:
        10px;

    color:
        var(--complexo-title);

}


body.page-complexo .location-actions {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        15px;

    margin-top:
        30px;

}


body.page-complexo .location-map {

    width:
        100%;

    min-width:
        0;

    height:
        480px;

    overflow:
        hidden;

    border:
        1px solid var(--complexo-border);

    border-radius:
        var(--complexo-radius-lg);

    background:
        #fff;

    box-shadow:
        var(--complexo-shadow);

}


body.page-complexo .location-map iframe {

    display:
        block;

    width:
        100%;

    height:
        100%;

    border:
        0;

}


body.page-complexo .image-placeholder {

    width:
        100%;

    height:
        100%;

    min-height:
        320px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    background:
        #ECECEC;

    color:
        #777;

    font-size:
        .9rem;

    font-weight:
        700;

}


/* ==========================================================
SUSTAINABILITY
========================================================== */

body.page-complexo .sustainability-section {

    padding:
        100px 0;

    background:
        #fff;

}


body.page-complexo .sustainability-grid {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap:
        70px;

    align-items:
        center;

}


body.page-complexo .sustainability-image {

    min-width:
        0;

    overflow:
        hidden;

    border-radius:
        var(--complexo-radius-lg);

    background:
        #ECECEC;

    box-shadow:
        var(--complexo-shadow);

}


body.page-complexo .sustainability-carousel {

    position:
        relative;

    width:
        100%;

    min-height:
        520px;

    overflow:
        hidden;

}


body.page-complexo .sustainability-slide {

    position:
        absolute;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    opacity:
        0;

    transition:
        opacity .6s ease;

}


body.page-complexo .sustainability-slide.active {

    opacity:
        1;

}


body.page-complexo .sustainability-slide img {

    display:
        block;

    width:
        100%;

    height:
        520px;

    max-width:
        none;

    object-fit:
        cover;

    object-position:
        center;

}


body.page-complexo .sustainability-content {

    min-width:
        0;

}


body.page-complexo .sustainability-content h2 {

    margin:
        0 0 24px;

    color:
        var(--complexo-title);

    font-size:
        clamp(
            2rem,
            4vw,
            3.2rem
        );

    line-height:
        1.15;

    font-weight:
        800;

}


body.page-complexo .sustainability-content > p {

    margin:
        0;

    color:
        var(--complexo-text);

    line-height:
        1.8;

}


body.page-complexo .sustainability-items {

    display:
        flex;

    flex-direction:
        column;

    gap:
        18px;

    margin-top:
        32px;

}


body.page-complexo .sustainability-item {

    display:
        flex;

    align-items:
        flex-start;

    gap:
        15px;

    min-width:
        0;

}


body.page-complexo .sustainability-icon {

    width:
        38px;

    height:
        38px;

    flex:
        0 0 38px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        50%;

    background:
        var(--complexo-green);

    color:
        #fff;

    font-size:
        .95rem;

    line-height:
        1;

    font-weight:
        900;

}


body.page-complexo .sustainability-item p {

    margin:
        0;

    color:
        var(--complexo-text);

    line-height:
        1.65;

}


/* ==========================================================
GALLERY
========================================================== */

body.page-complexo .gallery-section {

    padding:
        100px 0;

    background:
        var(--complexo-light);

}


body.page-complexo .page-gallery {

    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap:
        24px;

}


body.page-complexo .page-gallery-item {

    position:
        relative;

    min-width:
        0;

    height:
        320px;

    overflow:
        hidden;

    margin:
        0;

    border-radius:
        var(--complexo-radius);

    background:
        #E9EEEE;

}


body.page-complexo .page-gallery-item img {

    display:
        block;

    width:
        100%;

    height:
        100%;

    max-width:
        none;

    object-fit:
        cover;

    object-position:
        center;

    transition:
        transform .45s ease;

}


body.page-complexo .page-gallery-item:hover img {

    transform:
        scale(1.08);

}


body.page-complexo .page-gallery-overlay {

    position:
        absolute;

    left:
        0;

    right:
        0;

    bottom:
        0;

    padding:
        42px 22px 20px;

    background:
        linear-gradient(
            transparent,
            rgba(0, 0, 0, .78)
        );

    pointer-events:
        none;

}


body.page-complexo .page-gallery-overlay span {

    color:
        #fff;

    font-size:
        .95rem;

    line-height:
        1.4;

    font-weight:
        700;

}


/* ==========================================================
CTA
========================================================== */

body.page-complexo .page-cta {

    padding:
        100px 0;

    background:
        linear-gradient(
            135deg,
            var(--complexo-red),
            var(--complexo-red-dark)
        );

    color:
        #fff;

}


/* ==========================================================
CTA CONTAINER

Utiliza exatamente o mesmo sistema horizontal
do container global definido em style.css.
========================================================== */

body.page-complexo .page-cta-container {

    width:
        min(
            92%,
            var(--container)
        );

    margin-inline:
        auto;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        40px;

}


body.page-complexo .page-cta-content {

    max-width:
        700px;

}


body.page-complexo .page-cta-content h2 {

    margin:
        0 0 22px;

    color:
        #fff;

    font-size:
        clamp(
            2rem,
            4vw,
            3rem
        );

    line-height:
        1.1;

    font-weight:
        800;

}


body.page-complexo .page-cta-content p {

    max-width:
        650px;

    margin:
        0;

    color:
        rgba(255, 255, 255, .92);

    line-height:
        1.8;

}


body.page-complexo .page-cta-actions {

    flex:
        0 0 auto;

}


body.page-complexo .page-cta-actions .btn {

    min-height:
        58px;

    padding:
        0 40px;

    background:
        #fff;

    color:
        var(--complexo-green);

    box-shadow:
        0 10px 25px rgba(0, 0, 0, .10);

}


body.page-complexo .page-cta-actions .btn:hover {

    background:
        var(--complexo-green-dark);

    color:
        #fff;

    transform:
        translateY(-2px);

}


/* ==========================================================
RESPONSIVO
========================================================== */


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

@media (max-width: 1100px) {

    body.page-complexo .page-stats-grid {

        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

    }


    body.page-complexo .feature-grid {

        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

    }


    body.page-complexo .page-split {

        gap:
            45px;

    }


    body.page-complexo .page-location-grid {

        grid-template-columns:
            1fr;

        gap:
            45px;

    }


    body.page-complexo .sustainability-grid {

        grid-template-columns:
            1fr;

        gap:
            45px;

    }


    body.page-complexo .page-gallery {

        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

    }

}


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

@media (max-width: 900px) {

    body.page-complexo .page-hero {

        min-height:
            620px;

    }


    body.page-complexo .page-hero-content {

        max-width:
            100%;

        text-align:
            center;

        margin-inline:
            auto;

    }


    body.page-complexo .page-hero h1 {

        margin-inline:
            auto;

    }


    body.page-complexo .page-hero p {

        margin-left:
            auto;

        margin-right:
            auto;

    }


    body.page-complexo .page-hero-actions {

        justify-content:
            center;

    }


    body.page-complexo .page-split {

        grid-template-columns:
            1fr;

        gap:
            45px;

    }


    body.page-complexo .page-split.reverse {

        direction:
            ltr;

    }


    body.page-complexo .page-split-image {

        min-height:
            420px;

    }


    body.page-complexo .location-map {

        height:
            400px;

    }


    body.page-complexo .page-cta-container {

        flex-direction:
            column;

        text-align:
            center;

    }


    body.page-complexo .page-cta-content {

        max-width:
            760px;

    }


    body.page-complexo .page-cta-actions {

        width:
            100%;

        display:
            flex;

        justify-content:
            center;

    }

}


/* ==========================================================
MOBILE
========================================================== */

@media (max-width: 700px) {

    /* HERO */

    body.page-complexo .page-hero {

        min-height:
            560px;

        padding-top:
            70px;

    }


    body.page-complexo .page-hero-overlay {

        background:
            linear-gradient(
                90deg,
                rgba(6, 35, 32, .94) 0%,
                rgba(6, 35, 32, .80) 65%,
                rgba(6, 35, 32, .55) 100%
            );

    }


    body.page-complexo .page-hero-content {

        padding:
            55px 0;

    }


    body.page-complexo .page-hero h1 {

        font-size:
            2.8rem;

        letter-spacing:
            -1.3px;

    }


    body.page-complexo .page-hero p {

        font-size:
            .98rem;

        line-height:
            1.65;

    }


    body.page-complexo .page-hero-actions {

        flex-direction:
            column;

        align-items:
            stretch;

        width:
            100%;

    }


    body.page-complexo .page-hero-actions .btn {

        width:
            100%;

    }


    /* STATS */

    body.page-complexo .page-stats {

        padding:
            70px 0;

    }


    body.page-complexo .page-stats-grid {

        grid-template-columns:
            1fr;

        gap:
            14px;

    }


    body.page-complexo .page-stat {

        min-height:
            125px;

        padding:
            26px 20px;

    }


    /* FEATURES */

    body.page-complexo .feature-grid-section {

        padding:
            75px 0;

    }


    body.page-complexo .section-header {

        margin-bottom:
            40px;

    }


    body.page-complexo .section-header h2 {

        font-size:
            2rem;

    }


    body.page-complexo .section-header p {

        font-size:
            .95rem;

    }


    body.page-complexo .feature-grid {

        grid-template-columns:
            1fr;

        gap:
            16px;

    }


    body.page-complexo .feature-card {

        min-height:
            0;

        padding:
            30px;

    }


    /* SPLIT */

    body.page-complexo .split-section {

        padding:
            75px 0;

    }


    body.page-complexo .page-split {

        gap:
            35px;

    }


    body.page-complexo .page-split-content h2 {

        font-size:
            2rem;

    }


    body.page-complexo .page-split-image {

        min-height:
            300px;

        aspect-ratio:
            4 / 3;

    }


    /* LOCATION */

    body.page-complexo .page-location {

        padding:
            75px 0;

    }


    body.page-complexo .page-location-content h2 {

        font-size:
            2rem;

    }


    body.page-complexo .location-actions {

        flex-direction:
            column;

    }


    body.page-complexo .location-actions .btn {

        width:
            100%;

    }


    body.page-complexo .location-map {

        height:
            320px;

    }


    /* SUSTAINABILITY */

    body.page-complexo .sustainability-section {

        padding:
            75px 0;

    }


    body.page-complexo .sustainability-carousel {

        min-height:
            300px;

    }


    body.page-complexo .sustainability-slide img {

        height:
            300px;

    }


    body.page-complexo .sustainability-content h2 {

        font-size:
            2rem;

    }


    /* GALLERY */

    body.page-complexo .gallery-section {

        padding:
            75px 0;

    }


    body.page-complexo .page-gallery {

        grid-template-columns:
            1fr;

        gap:
            16px;

    }


    body.page-complexo .page-gallery-item {

        height:
            250px;

    }


    /* CTA */

    body.page-complexo .page-cta {

        padding:
            70px 0;

    }


    body.page-complexo .page-cta-content h2 {

        font-size:
            2rem;

    }


    body.page-complexo .page-cta-actions {

        width:
            100%;

    }


    body.page-complexo .page-cta-actions .btn {

        width:
            100%;

    }

}


/* ==========================================================
CELULAR PEQUENO
========================================================== */

@media (max-width: 480px) {

    body.page-complexo .page-hero {

        min-height:
            540px;

    }


    body.page-complexo .page-hero h1 {

        font-size:
            2.35rem;

        letter-spacing:
            -1px;

    }


    body.page-complexo .page-hero-tag {

        font-size:
            .65rem;

        padding:
            8px 15px;

    }


    body.page-complexo .page-stat strong {

        font-size:
            2.1rem;

    }


    body.page-complexo .feature-card {

        padding:
            25px;

    }


    body.page-complexo .page-split-content h2,
    body.page-complexo .page-location-content h2,
    body.page-complexo .sustainability-content h2 {

        font-size:
            1.9rem;

    }


    body.page-complexo .page-split-image {

        min-height:
            260px;

    }


    body.page-complexo .location-map {

        height:
            260px;

    }


    body.page-complexo .sustainability-carousel {

        min-height:
            260px;

    }


    body.page-complexo .sustainability-slide img {

        height:
            260px;

    }


    body.page-complexo .page-gallery-item {

        height:
            230px;

    }

}


/* ==========================================================
ACESSIBILIDADE

Somente elementos específicos da página.
Não altera Header/Footer global.
========================================================== */

body.page-complexo .page-hero a:focus-visible,
body.page-complexo .page-hero button:focus-visible,
body.page-complexo .page-cta a:focus-visible,
body.page-complexo .page-cta button:focus-visible,
body.page-complexo .location-actions a:focus-visible,
body.page-complexo .location-actions button:focus-visible {

    outline:
        3px solid var(--complexo-red);

    outline-offset:
        3px;

}


/* ==========================================================
MOVIMENTO REDUZIDO

IMPORTANTE:

Não utilizar:

body.page-complexo *

pois isso também atingiria Header/Footer e componentes
globais.

Apenas componentes exclusivos do /complexo.
========================================================== */

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

    body.page-complexo .page-stat,
    body.page-complexo .feature-card,
    body.page-complexo .feature-icon,
    body.page-complexo .page-split-image img,
    body.page-complexo .page-gallery-item img,
    body.page-complexo .sustainability-slide,
    body.page-complexo .page-cta-actions .btn {

        transition:
            none !important;

        animation:
            none !important;

    }

}


/* ==========================================================
FIM
========================================================== */