/* Estilo automático para a página: sobre */

#sobre{
    padding-bottom: 60px;
    
    .box-sobre {
        padding: 0 60px 60px !important;

        .titulo-numeros {
            margin: 40px 0 30px !important;
        }
    }
}

#mvv{
    padding: 60px 0;
    border: 1px solid rgba(245, 243, 240, 0.06);
    background: #161616;

    h2{
        color: var(--branco);
    }

    .card-mvv {
        border-radius: 16px;
        background: #1B1B1A;
        padding: 24px;

        .titulo {
            color: var(--branco);
            font-size: 18px;
            font-weight: 600;
            line-height: 120%;
            margin: 1rem 0;
        }
        .texto{
            color: #C6C0B8;
            font-size: 16px;
            font-weight: 400;
            line-height: 160%;
            min-height: 80px;
        }
    }

}

#equipe{
    background-color: var(--preto);
    padding: 60px 0;

    h2{
        color: var(--branco);
    }

    .img-equipe {
        position: relative;
        overflow: hidden;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        height: 350px;
        border-radius: 20px;
        cursor: pointer;

        &::before {
            content: '';
            position: absolute;
            inset: 0;
            background-image: inherit;
            background-repeat: inherit;
            background-size: inherit;
            background-position: inherit;
            filter: grayscale(100%);
            z-index: 0;
        }

        .curriculo-equipe {
            position: relative;
            z-index: 1;
            padding: 28px 16px;
            background-color: var(--amarelo);
            border-radius: 20px;
            height: 100%;
            opacity: 0;
            transition: 300ms all ease-in-out;
            
            .social-equipe {
                display: flex;
                margin: 0 0 16px 0;
                padding: 0;

                li{
                    margin-right: 8px;
                    list-style-type: none;
                }
            }

            .curriculo {
                color: #F5F3F0;
                font-size: 15px;
                font-weight: 500;
                line-height: 160%;
                max-height: 240px;
                overflow-x: hidden;
                overflow-y: auto;
                scrollbar-width: thin;
                scrollbar-color: var(--branco) transparent;

                &::-webkit-scrollbar {
                    width: 4px;
                }
                &::-webkit-scrollbar-track {
                    background: transparent;
                }
                &::-webkit-scrollbar-thumb {
                    background-color: var(--branco);
                    border-radius: 10px;
                }
            }
        }

        &:hover{
            .curriculo-equipe {
                opacity: 1;
            }

        }
    }

    .info-equipe{
        .nome {
            color: #F5F3F0;
            font-size: 16px;
            font-weight: 600;
            line-height: 20px;
            letter-spacing: 2px;
            text-transform: uppercase;
            text-align: center;
            border-radius: 20px;
            border: 1px solid #CB821F;
            padding: 8px;
            margin-top: 20px;
            min-height: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .cargo {
            color: #C6C0B8;
            font-size: 14px;
            font-weight: 400;
            line-height: 160%;
        }
    }

    .passadores-equipe {
        top: -120px;
        position: relative;
        display: flex;

        .swiper-button-next {
            width: 58px;;

            .esfera {
                border-radius: 80px;
                opacity: 0.75;
                border: solid 2px var(--amarelo);
                width: 58px;
                height: 58px;
                display: flex;
                align-content: center;
                justify-content: center;
                align-items: center;
            }
        }
        .swiper-button-prev {
            left: auto;
            right: 80px;
            width: 58px;

            .esfera {
                border-radius: 80px;
                opacity: 0.75;
                border: solid 2px var(--amarelo);
                width: 58px;
                height: 58px;
                display: flex;
                align-content: center;
                justify-content: center;
                align-items: center;
            }
        }
        :focus-visible {
            outline: none;
        }

        .swiper-button-next:after, .swiper-button-prev:after{
            display: none;
        }
    }

    /* APENAS DESKTOP */
    @media (max-width: 1024px) {
        .passadores-equipe {
            display: none;
        }
    }

    .passadores-dots{
        opacity: 0;

        .swiper-pagination-bullet {
            border-radius: 80px;
            background: var(--branco);
            width: 30px;
            opacity: 1;
            height: 5px;
        }
        .swiper-pagination-bullet-active {
            background: var(--amarelo);
        }
    }

    /* MOBILE E TABLET */
    @media (max-width: 1024px) {
        .passadores-dots {
            opacity: 1;
        }
    }
}

#parceiros{
    padding: 60px 0;
    background-color: var(--preto);
    text-align: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    
    .alinhar-centro{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    h2{
        color: var(--branco);
    }

    .box-parceiro {
        border-radius: 16px;
        border: 1px solid rgba(245, 243, 240, 0.12);
        background: #F5F3F0;
        height: 120px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 16px;

        .logo-parceiro {
            height: 70px;
            width: 160px;
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
        }
    }

    
    .swiper-wrapper {
        transition-timing-function: linear !important;
        will-change: transform;
        
    }

    .swiper-pagination-bullet {
        border-radius: 80px;
        background: var(--branco);
        width: 30px;
        opacity: 1;
        height: 5px;
    }
    .swiper-pagination-bullet-active {
        background: var(--amarelo);
    }
    
}

#modelo{
    padding: 116px 0 0;
    background: var(--preto);
    margin-bottom: -3px;

    .img-box-modelo {
        height: 102%;
        background-repeat: no-repeat;
        background-size: cover;
        border-radius: 24px;
    }

    h2{
        color: var(--branco);
    }

    .text-dest {
        color: var(--branco);
        font-size: 18px;
        font-weight: 500;
        line-height: 160%;
    }
    .text {
        color: var(--branco);
        font-size: 16px;
        font-weight: 400;
        line-height: 160%;
    }
    .titulo-numeros {
        color: var(--branco);
        text-align: center;
        font-size: 18px;
        font-weight: 500;
        line-height: 120%;
        letter-spacing: 1.8px;
        text-transform: uppercase;
        margin: 50px 0 30px;
    }
    .btn-padrao-amarelo{
        color: var(--amarelo);
        &:hover{
            color: var(--branco);
        }
    }    
}

#instagram{
    padding: 80px 0;
    background-color: var(--preto);

    h2{
        color: var(--branco);
    }

    .alinhar-link {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    .btn-padrao-amarelo{
        color: var(--amarelo);

        &:hover{
            color: var(--branco);
        }
        img {
            transform: rotate(0);
        }
    }

    .img-insta{
        width: 100%;
        height: 380px;
        object-fit: cover;
        border-radius: 24px;
    }
        
    
}


/* TABLET */
@media (min-width: 768px) and (max-width: 1024px) {
    #modelo {
        padding: 80px 0;
        
        .img-box-modelo {
            height: 300px;
            margin-bottom: 30px;
        }
    }
    #mvv {
        .card-mvv {
            margin-bottom: 20px;
        }
    }
}

/* MOBILE */
@media all and (max-width: 767px) { 
    #sobre{
        padding-bottom: 60px;
        
        .box-sobre {
            padding: 0 60px 60px !important;
        }

        .subtitulo {
            margin-top: 30px;
        }
    }

    #mvv {
        .card-mvv {
            margin-bottom: 20px;
        }
    }

    #equipe {
        .img-equipe {
            height: 480px;
        }
    }

    #modelo {
        padding: 80px 0;

        .img-box-modelo {
            height: 300px;
            margin-bottom: 30px;
        }
    }

}