* {
    box-sizing: border-box;
}

:root {
    --verde: #042c22;
    --verde2: #07392c;
    --dourado: #d7af61;
    --dourado2: #efd398;
    --creme: #f7f3ea;
    --branco: #fff;
    --texto: #173a31;
    --cinza: #65756f;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family:
        Arial,
        Helvetica,
        sans-serif;
    background: #fbfaf7;
    color: var(--texto);
}

a {
    color: inherit;
}

.topo {
    min-height: 88px;

    padding: 15px 5%;

    display: flex;
    align-items: center;

    gap: 32px;

    position: sticky;
    top: 0;
    z-index: 100;

    background:
        rgba(3,40,31,.97);

    color: white;

    box-shadow:
        0 8px 35px
        rgba(0,0,0,.10);
}

.marca {
    display: flex;
    align-items: center;

    gap: 13px;

    color: white;
    text-decoration: none;

    flex-shrink: 0;
}

.marca strong {
    display: block;

    font-family:
        Georgia,
        serif;

    font-size: 1.65rem;

    letter-spacing: .2em;
}

.marca small {
    color: var(--dourado2);

    font-size: .56rem;

    letter-spacing: .22em;
}

.marca-icone {
    width: 48px;
    height: 48px;

    border:
        1px solid
        rgba(215,175,97,.55);

    border-radius: 50%;

    display: flex;
    align-items: flex-end;
    justify-content: center;

    gap: 4px;

    padding-bottom: 10px;
}

.marca-icone i {
    display: block;

    width: 5px;

    border-radius: 2px;

    background:
        linear-gradient(
            #f0d490,
            #b88d3d
        );
}

.marca-icone i:nth-child(1) {
    height: 18px;
}

.marca-icone i:nth-child(2) {
    height: 28px;
}

.marca-icone i:nth-child(3) {
    height: 22px;
}

.topo nav {
    margin-left: auto;

    display: flex;
    align-items: center;

    gap: 25px;
}

.topo nav a {
    text-decoration: none;

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

    font-size: .88rem;

    white-space: nowrap;
}

.topo nav a:hover {
    color: var(--dourado2);
}

.botao {
    display: inline-flex;

    justify-content: center;
    align-items: center;

    padding: 15px 25px;

    border-radius: 999px;

    background:
        linear-gradient(
            135deg,
            #ecd08b,
            #c99d4e
        );

    color: #062b21;

    text-decoration: none;

    font-weight: 800;

    border: 0;

    cursor: pointer;

    transition: .25s ease;
}

.botao:hover {
    transform: translateY(-2px);

    box-shadow:
        0 15px 35px
        rgba(0,0,0,.15);
}

.topo-cta {
    flex-shrink: 0;
}

.menu-mobile {
    display: none;

    margin-left: auto;

    color: white;
    background: transparent;

    border: 0;

    font-size: 1.6rem;
}


/* HOME */

.home-hero {
    min-height: 720px;

    display: grid;

    grid-template-columns:
        1.1fr .9fr;

    align-items: center;

    padding: 70px 7%;

    background:
        radial-gradient(
            circle at 80% 30%,
            rgba(215,175,97,.12),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #021f18,
            #064033
        );

    color: white;
}

.home-hero-conteudo {
    max-width: 770px;
}

.eyebrow {
    display: block;

    margin-bottom: 16px;

    color: var(--dourado);

    font-size: .73rem;

    letter-spacing: .21em;

    font-weight: 800;

    text-transform: uppercase;
}

.home-hero h1 {
    margin:
        0 0
        27px;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            3.2rem,
            6vw,
            6.5rem
        );

    line-height: .97;

    font-weight: 500;

    letter-spacing: -.045em;
}

.home-hero h1 em,
h1 em,
h2 em {
    color: var(--dourado2);

    font-weight: 500;
}

.home-hero p {
    max-width: 650px;

    font-size: 1.08rem;

    line-height: 1.8;

    color:
        rgba(255,255,255,.77);
}

.acoes {
    margin-top: 30px;

    display: flex;

    gap: 12px;

    flex-wrap: wrap;
}

.botao-claro {
    background:
        rgba(255,255,255,.07);

    border:
        1px solid
        rgba(255,255,255,.24);

    color: white;
}

.home-hero-arte {
    min-height: 500px;

    display: flex;

    justify-content: center;
    align-items: center;
}

.predio {
    width: 65%;

    height: 400px;

    position: relative;

    border:
        2px solid
        rgba(215,175,97,.35);

    clip-path:
        polygon(
            30% 0,
            65% 8%,
            100% 20%,
            100% 100%,
            0 100%,
            0 45%
        );

    background:
        linear-gradient(
            rgba(255,255,255,.04),
            rgba(255,255,255,.01)
        );
}

.predio::before {
    content: "";

    position: absolute;
    inset: 0;

    background-image:
        linear-gradient(
            rgba(215,175,97,.25) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(215,175,97,.25) 1px,
            transparent 1px
        );

    background-size:
        55px 55px;
}


/* BLOCOS HOME */

.resumo,
.pagina-conteudo {
    padding: 110px 7%;
}

.resumo {
    text-align: center;
}

.resumo h2,
.home-destaque h2,
.home-video h2,
.home-final h2,
.texto-grande h2,
.objetivos h2,
.contato-v5 h2 {
    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            2.4rem,
            4vw,
            4.3rem
        );

    font-weight: 500;

    line-height: 1.05;
}

.texto-central {
    max-width: 720px;

    margin:
        0 auto
        50px;

    line-height: 1.8;

    color: var(--cinza);
}

.cards-3 {
    display: grid;

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

    gap: 20px;
}

.cards-2 {
    display: grid;

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

    gap: 20px;
}

.card-link,
.card {
    padding: 34px;

    border-radius: 24px;

    background: white;

    box-shadow:
        0 15px 50px
        rgba(6,45,35,.07);

    border:
        1px solid
        rgba(6,45,35,.06);

    text-decoration: none;

    text-align: left;
}

.card-link {
    transition: .25s ease;
}

.card-link:hover {
    transform: translateY(-6px);

    box-shadow:
        0 25px 60px
        rgba(6,45,35,.12);
}

.card-link > span,
.card > span {
    color: var(--dourado);

    font-weight: 800;

    font-size: .8rem;
}

.card-link h3,
.card h3 {
    margin:
        25px 0
        10px;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 1.6rem;

    font-weight: 500;
}

.card-link p,
.card p {
    line-height: 1.7;

    color: var(--cinza);
}

.card-link strong {
    display: block;

    margin-top: 25px;

    color: #a57c32;
}

.home-destaque {
    padding: 80px 7%;

    background:
        linear-gradient(
            135deg,
            #f2e9d8,
            #fbf9f4
        );

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 50px;
}

.home-destaque > div {
    max-width: 720px;
}

.home-destaque p {
    line-height: 1.8;

    color: var(--cinza);
}

.home-video {
    padding: 110px 7%;

    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    align-items: center;

    gap: 70px;

    background: white;
}

.home-video p {
    line-height: 1.8;

    color: var(--cinza);
}

.mini-video {
    aspect-ratio: 16 / 9;

    border-radius: 25px;

    overflow: hidden;

    box-shadow:
        0 25px 70px
        rgba(6,45,35,.16);
}

.mini-video iframe {
    width: 100%;
    height: 100%;

    border: 0;
}

.home-final {
    padding: 100px 7%;

    text-align: center;

    background:
        #062d23;

    color: white;
}


/* PÁGINAS */

.pagina-capa {
    min-height: 430px;

    padding: 90px 7%;

    display: flex;

    justify-content: center;
    flex-direction: column;

    background:
        linear-gradient(
            135deg,
            #f5efe4,
            #ffffff
        );
}

.pagina-capa-verde {
    background:
        linear-gradient(
            135deg,
            #021f18,
            #063c2e
        );

    color: white;
}

.pagina-capa h1 {
    max-width: 950px;

    margin:
        0 0
        22px;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

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

    line-height: .98;

    font-weight: 500;
}

.pagina-capa p {
    max-width: 700px;

    font-size: 1.1rem;

    line-height: 1.8;

    color: var(--cinza);
}

.pagina-capa-verde p {
    color:
        rgba(255,255,255,.72);
}

.texto-grande {
    max-width: 800px;

    margin-bottom: 50px;
}

.texto-grande p {
    line-height: 1.8;

    color: var(--cinza);
}

.numeros {
    display: grid;

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

    gap: 18px;

    margin-bottom: 100px;
}

.numeros div {
    padding: 32px;

    border-radius: 22px;

    background:
        var(--verde);

    color: white;

    text-align: center;
}

.numeros strong {
    display: block;

    margin-bottom: 10px;

    font-family:
        Georgia,
        serif;

    font-size: 2.3rem;

    color: var(--dourado2);
}

.numeros span {
    color:
        rgba(255,255,255,.72);
}

.trajetoria-destaque {
    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    align-items: center;

    gap: 60px;
}

.trajetoria-destaque h2 {
    font-family:
        Georgia,
        serif;

    font-size:
        clamp(
            2.5rem,
            4vw,
            4.2rem
        );

    font-weight: 500;
}

.trajetoria-destaque p {
    line-height: 1.8;

    color: var(--cinza);
}

.imagem-apresentacao {
    display: block;

    overflow: hidden;

    border-radius: 24px;

    box-shadow:
        0 25px 70px
        rgba(6,45,35,.13);
}

.imagem-apresentacao img {
    width: 100%;

    display: block;
}

.objetivos {
    margin-top: 80px;

    padding: 60px;

    border-radius: 28px;

    background:
        var(--creme);
}

.objetivos ul {
    margin:
        35px 0 0;

    padding: 0;

    display: grid;

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

    gap: 12px;

    list-style: none;
}

.objetivos li {
    padding: 18px 20px;

    border-radius: 15px;

    background: white;
}


/* VIDEO */

.pagina-video {
    padding: 80px 7% 120px;

    text-align: center;
}

.video-player {
    width:
        min(
            1100px,
            100%
        );

    aspect-ratio:
        16 / 9;

    margin:
        0 auto
        35px;

    border-radius: 28px;

    overflow: hidden;

    background: black;

    box-shadow:
        0 25px 75px
        rgba(0,0,0,.18);
}

.video-player iframe {
    width: 100%;
    height: 100%;

    border: 0;
}


/* CONTATO */

.contato-v5 {
    padding: 100px 7%;

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 70px;
}

.contato-v5 > div:first-child {
    max-width: 600px;
}

.contato-item {
    display: block;

    margin-top: 18px;

    padding: 22px;

    border-radius: 17px;

    background: white;

    text-decoration: none;

    box-shadow:
        0 10px 35px
        rgba(6,45,35,.06);
}

.contato-item small {
    display: block;

    margin-bottom: 6px;

    color: var(--cinza);
}

.contato-caixa {
    padding: 50px;

    border-radius: 28px;

    background:
        var(--verde);

    color: white;
}

.centro {
    margin-top: 45px;

    text-align: center;
}


/* FOOTER */

footer {
    padding:
        70px 7%
        25px;

    background:
        #021f18;

    color: white;
}

.footer-grid {
    display: grid;

    grid-template-columns:
        2fr 1fr 1fr 1.4fr;

    gap: 50px;
}

.footer-grid > div {
    display: flex;

    flex-direction: column;

    gap: 11px;
}

.footer-grid a {
    color:
        rgba(255,255,255,.65);

    text-decoration: none;
}

.footer-grid p {
    color:
        rgba(255,255,255,.6);

    line-height: 1.7;
}

.footer-marca {
    font-family:
        Georgia,
        serif;

    letter-spacing: .18em;

    font-size: 2rem;
}

.footer-final {
    margin-top: 60px;

    padding-top: 22px;

    border-top:
        1px solid
        rgba(255,255,255,.08);

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

    font-size: .85rem;
}

.whatsapp-fixo {
    position: fixed;

    right: 25px;
    bottom: 25px;

    z-index: 99;

    padding: 15px 22px;

    border-radius: 999px;

    background: #18a45d;

    color: white;

    font-weight: 800;

    text-decoration: none;

    box-shadow:
        0 15px 40px
        rgba(0,0,0,.18);
}


/* RESPONSIVO */

@media (max-width: 1150px) {

    .topo nav {
        gap: 14px;
    }

    .topo nav a {
        font-size: .78rem;
    }

    .topo-cta {
        display: none;
    }
}


@media (max-width: 900px) {

    .menu-mobile {
        display: block;
    }

    .topo nav {
        display: none;

        position: absolute;

        left: 0;
        right: 0;
        top: 88px;

        padding: 25px;

        background:
            #032a20;

        flex-direction: column;

        align-items: stretch;
    }

    .menu-aberto .topo nav {
        display: flex;
    }

    .topo nav a {
        font-size: 1rem;

        padding: 8px;
    }

    .home-hero,
    .home-video,
    .trajetoria-destaque,
    .contato-v5 {
        grid-template-columns:
            1fr;
    }

    .home-hero-arte {
        display: none;
    }

    .cards-3 {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

    .numeros {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

    .footer-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }
}


@media (max-width: 600px) {

    .home-hero {
        min-height: auto;

        padding:
            90px 22px;
    }

    .home-hero h1 {
        font-size: 3rem;
    }

    .resumo,
    .pagina-conteudo,
    .home-video,
    .contato-v5 {
        padding:
            75px 20px;
    }

    .pagina-capa {
        min-height: 360px;

        padding:
            70px 22px;
    }

    .cards-3,
    .cards-2,
    .numeros,
    .objetivos ul,
    .footer-grid {
        grid-template-columns:
            1fr;
    }

    .home-destaque {
        padding:
            70px 22px;

        flex-direction: column;

        align-items: flex-start;
    }

    .objetivos,
    .contato-caixa {
        padding: 30px 22px;
    }

    .whatsapp-fixo {
        right: 15px;
        bottom: 15px;
    }
}