/*
|--------------------------------------------------------------------------
| PÁGINAS INSTITUCIONAIS
|--------------------------------------------------------------------------
| Escritório
| Equipe
| Contato
|--------------------------------------------------------------------------
*/


/*
|--------------------------------------------------------------------------
| HERO
|--------------------------------------------------------------------------
*/

.institutional-hero {

    padding:
        55px 0 100px;

    background:
        linear-gradient(
            120deg,
            #0a0c0a 0%,
            #151815 65%,
            #1c201c 100%
        );

    color:
        var(--white);

    border-bottom:
        1px solid var(--gold);

}


.breadcrumb {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 10px;

    margin-bottom: 70px;

    color: #999d99;

    font-size: 13px;

}


.breadcrumb a {

    color:
        var(--gold-light);

}


.institutional-hero-content {

    max-width:
        900px;

}


.institutional-hero h1 {

    max-width:
        880px;

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        clamp(50px, 6vw, 76px);

    font-weight:
        600;

    line-height:
        1;

}


.institutional-hero h1 span {

    color:
        var(--gold-light);

}


.institutional-hero-content > p {

    max-width:
        680px;

    margin-top:
        28px;

    color:
        #c8cbc8;

    font-size:
        18px;

}


/*
|--------------------------------------------------------------------------
| INTRODUÇÃO
|--------------------------------------------------------------------------
*/

.institutional-intro {

    display:
        grid;

    grid-template-columns:
        1fr 1fr;

    gap:
        90px;

}


.institutional-intro h2 {

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        clamp(38px, 4vw, 53px);

    font-weight:
        600;

    line-height:
        1.07;

}


.institutional-text p {

    margin-bottom:
        20px;

    color:
        var(--muted);

}


/*
|--------------------------------------------------------------------------
| DESTAQUE
|--------------------------------------------------------------------------
*/

.institutional-feature {

    display:
        grid;

    grid-template-columns:
        .85fr 1.15fr;

    gap:
        80px;

    align-items:
        center;

}


.institutional-feature-image {

    position:
        relative;

}


.institutional-feature-image::before {

    content: "";

    position:
        absolute;

    top:
        -15px;

    left:
        -15px;

    width:
        70%;

    height:
        70%;

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

}


.institutional-feature-image img {

    position:
        relative;

    display:
        block;

    width:
        100%;

    max-height:
        570px;

    object-fit:
        cover;

}


.institutional-feature-content h2 {

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        clamp(42px, 5vw, 58px);

    line-height:
        1;

}


.institutional-feature-content p {

    margin-top:
        20px;

    color:
        var(--muted);

}


.institutional-link {

    display:
        inline-block;

    margin-top:
        28px;

    color:
        var(--gold);

    font-weight:
        600;

}


/*
|--------------------------------------------------------------------------
| VALORES
|--------------------------------------------------------------------------
*/

.institutional-values {

    padding:
        100px 0;

    background:
        var(--dark);

    color:
        var(--white);

}


.values-grid {

    display:
        grid;

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

    margin-top:
        50px;

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

}


.values-grid article {

    padding:
        32px;

    border-right:
        1px solid rgba(255,255,255,.14);

}


.values-grid article:first-child {

    padding-left:
        0;

}


.values-grid article:last-child {

    border-right:
        0;

}


.values-grid span {

    color:
        var(--gold);

    font-size:
        12px;

}


.values-grid h3 {

    margin:
        20px 0 13px;

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        28px;

}


.values-grid p {

    color:
        #bfc2bf;

    font-size:
        14px;

}


/*
|--------------------------------------------------------------------------
| ÁREAS
|--------------------------------------------------------------------------
*/

.institutional-areas {

    padding:
        100px 0;

    background:
        var(--cream);

}


.institutional-areas > .container {

    display:
        grid;

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

    gap:
        90px;

}


.institutional-areas h2 {

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        clamp(38px, 4vw, 52px);

    line-height:
        1.05;

}


.institutional-area-links {

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

}


.institutional-area-links a {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

    padding:
        20px 5px;

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

    transition:
        padding .25s,
        color .25s;

}


.institutional-area-links a:hover {

    padding-left:
        14px;

    color:
        var(--gold);

}


.institutional-area-links span {

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        24px;

}


.institutional-area-links strong {

    color:
        var(--gold);

}


/*
|--------------------------------------------------------------------------
| CTA
|--------------------------------------------------------------------------
*/

.institutional-cta {

    padding:
        75px 0;

}


.institutional-cta-inner {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

    gap:
        60px;

}


.institutional-cta h2 {

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        clamp(37px, 4vw, 50px);

    line-height:
        1;

}


.institutional-cta p {

    margin-top:
        15px;

    color:
        var(--muted);

}


/*
|--------------------------------------------------------------------------
| TABLET
|--------------------------------------------------------------------------
*/

@media (max-width: 900px) {

    .institutional-intro,
    .institutional-feature,
    .institutional-areas > .container {

        grid-template-columns:
            1fr;

        gap:
            50px;

    }


    .values-grid {

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

    }


    .institutional-cta-inner {

        flex-direction:
            column;

        align-items:
            flex-start;

    }
.contact-grid,
.contact-location-grid {

    grid-template-columns: 1fr;

    gap: 50px;

}


.contact-main {

    position: static;

}
}


/*
|--------------------------------------------------------------------------
| CELULAR
|--------------------------------------------------------------------------
*/

@media (max-width: 600px) {

    .institutional-hero {

        padding:
            35px 0 70px;

    }


    .breadcrumb {

        margin-bottom:
            45px;

    }


    .institutional-hero h1 {

        font-size:
            46px;

    }


    .institutional-hero-content > p {

        font-size:
            16px;

    }


    .institutional-feature-image::before {

        top:
            -8px;

        left:
            -8px;

    }


    .values-grid {

        grid-template-columns:
            1fr;

    }


    .values-grid article,
    .values-grid article:first-child {

        padding:
            25px 0;

        border-right:
            0;

        border-bottom:
            1px solid
            rgba(255,255,255,.14);

    }


    .institutional-cta .btn {

        width:
            100%;

    }
.team-page-card {

    grid-template-columns: 1fr;

}


.team-page-image img {

    height: 420px;

}


.team-page-content {

    padding: 28px;

}
.contact-actions {

    flex-direction: column;

}


.contact-actions .btn {

    width: 100%;

}


.contact-info-card {

    grid-template-columns:
        32px 1fr;

}


.contact-address-box {

    padding: 30px;

}


.contact-address-box address {

    font-size: 27px;

}
}
/*
|--------------------------------------------------------------------------
| EQUIPE
|--------------------------------------------------------------------------
*/

.team-page-grid {

    display: grid;

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

    gap: 30px;

}


.team-page-card {

    display: grid;

    grid-template-columns:
        220px 1fr;

    min-height: 300px;

    background:
        var(--white);

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

}


.team-page-image {

    overflow: hidden;

}


.team-page-image img {

    display: block;

    width: 100%;

    height: 100%;

    min-height: 300px;

    object-fit: cover;

    object-position: center top;

}


.team-page-content {

    padding: 35px;

    display: flex;

    flex-direction: column;

    justify-content: center;

}


.team-page-content > span {

    color:
        var(--gold);

    font-size: 11px;

    font-weight: 600;

    letter-spacing: 2px;

}


.team-page-content h2 {

    margin-top: 12px;

    font-family:
        'Cormorant Garamond',
        serif;

    font-size: 31px;

    line-height: 1.05;

}


.team-page-content p {

    margin-top: 18px;

    color:
        var(--muted);

    font-size: 14px;

}
/*
|--------------------------------------------------------------------------
| CONTATO
|--------------------------------------------------------------------------
*/

.contact-grid {

    display: grid;

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

    gap: 90px;

    align-items: start;

}


.contact-main {

    position: sticky;

    top: 130px;

}


.contact-main h2 {

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        clamp(40px, 5vw, 58px);

    line-height: 1.05;

}


.contact-main > p {

    margin-top: 20px;

    color: var(--muted);

    max-width: 540px;

}


.contact-actions {

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: 32px;

}


.contact-secondary-btn {

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

    color:
        var(--text);

}


.contact-secondary-btn:hover {

    border-color:
        var(--gold);

    color:
        var(--gold);

}


.contact-info {

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

}


.contact-info-card {

    display: grid;

    grid-template-columns:
        45px 1fr;

    gap:
        10px 20px;

    padding:
        27px 0;

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

}


.contact-info-card > span {

    grid-row:
        1 / 3;

    color:
        var(--gold);

    font-size:
        12px;

    font-weight:
        600;

}


.contact-info-card h3 {

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        28px;

    line-height:
        1.1;

}


.contact-info-card p,
.contact-info-card a {

    color:
        var(--muted);

}


.contact-info-card a:hover {

    color:
        var(--gold);

}


/*
|--------------------------------------------------------------------------
| LOCALIZAÇÃO
|--------------------------------------------------------------------------
*/

.contact-location {

    padding:
        100px 0;

    background:
        var(--dark);

    color:
        var(--white);

}


.contact-location-grid {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap:
        90px;

    align-items: center;

}


.contact-location h2 {

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        clamp(40px, 5vw, 58px);

    line-height:
        1.05;

}


.contact-location p {

    margin-top:
        20px;

    color:
        #c3c6c3;

    max-width:
        530px;

}


.contact-location .institutional-link {

    margin-top:
        30px;

}


.contact-address-box {

    padding:
        45px;

    border:
        1px solid
        rgba(183, 154, 99, .55);

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

}


.contact-address-box > span {

    display:
        block;

    color:
        var(--gold);

    font-size:
        11px;

    font-weight:
        600;

    letter-spacing:
        2px;

    margin-bottom:
        25px;

}


.contact-address-box address {

    font-family:
        'Cormorant Garamond',
        serif;

    font-size:
        31px;

    line-height:
        1.3;

    font-style:
        normal;

    color:
        var(--white);

}