/* carrossel */

.banner-carrossel {
    height: 747px;
    background-image: url(../../src/assets/img/main-carrossel-img-1.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-image 0.5s ease-in-out;
    position: relative;
    z-index: 1; 
}

    .banner-carrossel .container {
        display: flex;
        align-items: center;
        margin-bottom: 7rem;
        gap: 3.4375rem;
    }

    .banner-carrossel .banner-preto-container {
        width: 100%;
    }

    .banner-carrossel .banner-preto {
        background-color: var(--preto-950);
        border-radius: 0 var(--main-border-radius) 0 var(--main-border-radius);
        width: 48%;
    }

    .banner-carrossel .main-seta-esquerda img, 
    .banner-carrossel .main-seta-direita img {
        width: 53px;
        height: 53px;    
    }

    .banner-carrossel .main-seta-esquerda img:hover {
        content: url(../../src/assets/icones/seta-main-carrossel-hover-esquerda.svg);
        cursor: pointer;
    }

    .banner-carrossel .main-seta-direita img:hover {
        content: url(../../src/assets/icones/seta-main-carrossel-hover-direita.svg);
        cursor: pointer;
    }

    .banner-carrossel .banner-preto h1 {
        color: var(--off-white-100);
        text-align: center;
        padding: 3.4375rem 2.8125rem;
    }

    /* Esconde os elementos de dados */
    .slide-data {
        display: none;
    }

/* banner azul */

.banner-azul-area {
    display: flex;
    justify-content: center;
    margin-top: -7rem;
    z-index: 2;
}  

    .banner-azul {
        width: 100%;
        border-radius: 0 var(--main-border-radius) 0 var(--main-border-radius);
        background-color: var(--azul-800);
        margin: 0 6.75rem;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 3; 
    }

        .banner-content-container {
            display: flex;
            flex-direction: column;
            gap: var(--spacing-32);
            margin: 4.375rem;
            color: var(--off-white-100);
        }

/* mobile main */

.mobile-main {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .mobile-main .container {
        flex-direction: column;
        gap: var(--spacing-32);
        align-items: center;
    }

        .mobile-main .titulo-texto {
            display: flex;
            flex-direction: column;
            gap: var(--spacing-14);
            align-items: center;
            text-align: center;
        }

            .mobile-main .titulo-texto h3 {
                width: 300px;
            }

/* mobile main carrossel */

.mobile-main-carrossel {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--base-grid-spacing);
}

    .mobile-main-carrossel .img-container {
        width: 100%;
        height: 332px;
        background-image: url(../../src/assets/img/main-carrossel-img-1.jpg);
    }

        .pagination-dots {
            display: flex;
            gap: 0.25rem;
        }

            .pagination-dots .dot {
                height: 8.8px;
                width: 8.8px;
                background-color: #bdbdbd;
                border-radius: 50%;
            }

            .pagination-dots .dot:hover {
                width: 21.5px;
                background-color: var(--azul-800);
                border-radius: 3.5rem;
            }


/* institucional galeria */

.institucional-galeria {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .institucional-galeria .container {
        flex-direction: column;
        gap: var(--spacing-40);
    }

        .institucional-galeria .galeria-container {
            display: flex;
            gap: var(--base-grid-spacing);
            width: 100%;
            height: 410px;
        }

            .institucional-galeria .galeria-container .img-container {
                width: 100%;
                height: 100%;
                border-radius: var(--small-border-radius);
            }

            .institucional-galeria .galeria-container #galeria-img-1 {
                background-image: url(../../src/assets/img/galeria-img-1.jpg);
            }

             .institucional-galeria .galeria-container #galeria-img-2 {
                background-image: url(../../src/assets/img/galeria-img-2.jpg);
            }

             .institucional-galeria .galeria-container #galeria-img-3 {
                background-image: url(../../src/assets/img/galeria-img-3.jpg);
            }

        .institucional-galeria .galeria-controle {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: var(--spacing-12);
        }

            .institucional-galeria .galeria-controle img {
                width: 53px;
                height: 53px;
            }

            .institucional-galeria .galeria-controle img {
                cursor: pointer;
            }

            .institucional-galeria .galeria-controle .seta-azul-hover-esquerda:hover {
                content: url(../../src/assets/icones/seta-azul-hover-esquerda.svg);
            }

            .institucional-galeria .galeria-controle .seta-azul-hover-direita:hover {
                content: url(../../src/assets/icones/seta-azul-hover-direita.svg);
            }

/* institucional-2 */

.institucional-2 {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .institucional-2 .container {
        display: flex;
        align-items: center;
        margin: 0 0 var(--section-margin-top-bottom) 0;
        gap: var(--base-grid-spacing);
    }

        .institucional-2 .texto-container {
            display: flex;
            flex-direction: column;
            gap: var(--spacing-40);
            width: 50%;
        }

            .institucional-2 .titulo-texto {
                display: flex;
                flex-direction: column;
                gap: var(--spacing-18);
            }

        .institucional-2 .img-container {
            background-image: url(../assets/img/institucional-img.jpg);
            border-radius: 0 var(--main-border-radius) 0 var(--main-border-radius);
            width: 50%;
            height: 613px;
        }