/*========================================================
                     NAVBAR @MEDIA
==========================================================*/
@media (max-width: 1366px) {
    .navbar-logo {
        margin-left: 0px;
    }

    .dropdown input {
        width: 350px;
    }

    .dropdown-menu li a:hover {
        width: 320px;
    }

    .nav-itens {
        gap: 1.5rem;
    }

    .nav-itens a {
        font-size: 0.9rem;
    }

    .nav-itens-button .saiba-mais {
        padding: 0.5rem 1.5rem;
    }
    .navbar {
        position: absolute;
        background: #fff;
        padding: 1rem;
    }
    
    .navbar-collapse {
        font-size: 0.8rem !important;
    }
}

/*========================================================
                     NAVBAR @HERO
==========================================================*/
@media (max-width: 1366px) {

    .hero {
        height: 110vh;
    }

    .mainpage-content {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        position: relative !important;
        left: 0 !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        min-height: 800px !important;
    }

    .mainpage-title {
        font-size: 3.5rem;
        position: relative !important;
        left: 5% !important;
    }   

    .mainpage-description {
        font-size: 0.9rem;
        position: relative !important;
        left: 10% !important;
    }

    .circle-left-1 {
        width: 200px !important;
        height: 200px !important;
        top: 25.5% !important;
        left: 15.5% !important;
        border-color: #20B486 !important;
        position: absolute;
        border-radius: 50%;
        border: 1px solid;
        opacity: 0.3;
    }

    .circle-left-2 {
        width: 300px !important;
        height: 300px !important;
        top: calc(25.5% - 50px) !important;
        left: calc(15.5% - 50px) !important;
        border-color: #20B486 !important;
        position: absolute;
        border-radius: 50%;
        border: 1px solid;
        opacity: 0.3;
    }

    .circle-left-3 {
        width: 400px !important;
        height: 400px !important;
        top: calc(25.5% - 100px) !important;
        left: calc(15.5% - 100px) !important;
        border-color: #20B486 !important;
        position: absolute;
        border-radius: 50%;
        border: 1px solid;
        opacity: 0.3;
    }

    .circle-left-4 {
        width: 500px !important;
        height: 500px !important;
        top: calc(25.5% - 150px) !important;
        left: calc(15.5% - 150px) !important;
        border-color: #20B486 !important;
        position: absolute;
        border-radius: 50%;
        border: 1px solid;
        opacity: 0.3;
    }

    .mini-circle {
        width: 20px !important;
        height: 20px !important;
        border-radius: 50%;
        background-color: #20B486;
        position: absolute;
        top: calc(25.5% - 90px) !important;
        left: calc(7.5% + 25px) !important;
    }

    .circle-right-1 {
        width: 200px !important;
        height: 200px !important;
        top: 53% !important;
        right: 5.5% !important;
        border-color: #20B486;
    }

    .circle-right-2 {
        width: 300px !important;
        height: 300px !important;
        top: calc(53% - 50px) !important;
        right: calc(5.5% - 50px) !important;
        border-color: #20B486;
    }

    .circle-right-3 {
        width: 400px !important;
        height: 400px !important;
        top: calc(53% - 100px);
        right: calc(5.5% - 100px) !important;
        border-color: #20B486;
    }

    .circle-right-4 {
        width: 500px !important;
        height: 500px !important;
        top: calc(53% - 150px);
        right: calc(5.5% - 150px);
        border-color: #20B486;
    }

    .mini-circle-right {
        height: 20px !important;
        border-radius: 50%;
        background-color: #20B486;
        position: absolute;
        top: calc(95% - 30px);
        right: calc(19.5% + 100px);
    }

    .icon-box {
        min-width: 100px;
    }

    .icon-box img {
        width: 20px;
        height: 20px;
    }

    .icon-box p {
        font-size: 0.9rem;
    }

    .mainpage-image {
        width: 600px;
        right: 5%;
        top: 32%;
    }

    .mainpage-icons.d-flex {
        justify-content: flex-start !important;
        position: relative !important;
        left: 8% !important;
    }

    .hero .btn-outline-success {
        position: relative !important;
        display: flex !important;
        left: 8% !important;
    }
}

/*========================================================
                FEATURES TEXT @MEDIA
==========================================================*/
@media (max-width: 1366px) {

    /* Estilo para o título principal */
    .featuresh1 {
        font-size: 2rem;
    }

    /* Estilo para o subtítulo */
    .featuresh5 {
        font-size: 1rem;
    }

    /* Diminui a quantidade de colunas de 3 para 2 (opcional) */
    .container .row {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Ajusta a largura/altura dos cards */
    .container .card {
        width: 350px;
        height: 250px;
    }

    .card-title {
        font-size: 1.2rem;
    }

    .card-text {
        font-size: 0.95rem;
    }

    #indicators-mainpage {
        top: 45% !important;
    }

    #indicators-mainpage .indicator {
        width: 7px;
        height: 7px;
    }

    #indicators-mainpage .indicator.active {
        width: 20px;
    }
}

/*========================================================
                 EDUCAÇÃO SECTION @MEDIA
==========================================================*/
@media (max-width: 1366px) {
    .educacao-container {
        margin-top: 50px;
    }

    .titulo-principal {
        font-size: 2rem;
    }

    .subtitulo {
        font-size: 1rem;
        margin-bottom: 200px;
    }

    .imagem-container img {
        max-width: 70%;
        /* Permite que a imagem seja maior que o contêiner */
        top: 37%
    }

    .fundo {
        max-width: 1200px;
        width: 100%;
        min-height: 500px;
    }

    .icones-container {
        gap: 100px;
        /* Reduzindo espaçamento para melhor organização */
        margin-top: 80px;
        /* Ajustando altura */
    }

    .icone-card {
        max-width: 1200px;
        /* Reduzindo um pouco o tamanho máximo do card */
    }

    .icone {
        width: 45px;
        /* Ajuste menor no tamanho do ícone */
        height: 45px;
    }

    .icone-titulo {
        font-size: 1.5rem;
        /* Ajuste no tamanho da fonte do título */
    }

    .icone-descricao {
        font-size: 1.1rem;
        /* Pequena redução para melhor leitura */
    }
}

/*========================================================
                 AVALIAÇÃO CONTAINER @MEDIA
==========================================================*/
.section-avaliacao {
    margin-top: 100px;
}

@media (max-width: 1366px) {
    .carouselavaliacao-container {
        height: 70vh;
        /* Reduzindo altura do carrossel para melhor proporção */
    }

    .carouselnumeros-container {
        height: 90vh;
        /* Reduzindo altura do carrossel para melhor proporção */
    }

    .carouselavaliacao-slide {
        width: 350px;
        /* Redução do tamanho dos cards */
        height: 280px;
    }

    .carouselavaliacao-slide img {
        width: 55px;
        /* Ajuste no tamanho da imagem */
        height: 55px;
    }

    .carouselavaliacao-slide h3 {
        font-size: 20px;
        /* Ajustando tamanho do título */
        margin-top: 90px;
        /* Pequena redução para alinhamento */
    }

    .carouselavaliacao-slide p {
        font-size: 16px;
        /* Redução para melhor adaptação */
        margin-bottom: 80px;
    }

    .carouselavaliacao-button {
        width: 45px;
        /* Ajuste no tamanho dos botões */
        height: 45px;
        font-size: 16px;
    }

    .carouselavaliacao-button.prev {
        left: 50px;
        /* Aproxima os botões para telas menores */
    }

    .carouselavaliacao-button.next {
        right: 50px;
    }

    .carouselnossosnumeros-button.prev {
        left: 30px !important;
        top: 340px !important;
    }

    .carouselnossosnumeros-button.next {
        right: 30px !important;
        top: 340px !important;
    }

    .section-avaliacao h2 {
        font-size: 3rem;
        /* Reduzindo levemente o tamanho do título */
        margin-top: 50px;
    }
}

/*========================================================
                 HAPPY STUDENT CONTAINER @MEDIA
==========================================================*/

@media (max-width: 1366px) {
    .happystudent {
        height: 120vh;
        top: 400px;
        position: relative;
    }

    .happystudent-container {
        width: 1200px;
        /* Redução da largura do contêiner */
        height: 500px;
        /* Pequena redução na altura */
        padding: 40px;
        /* Ajustando espaçamento interno */
        margin-top: 100px;
        /* Redução no espaçamento superior */
    }

    .happystudent-container img {
        width: 800px;
        /* Redução no tamanho da imagem */
        right: -150px;
        /* Ajuste na posição da imagem */
        top: calc(35% - 30px);
        /* Centraliza verticalmente com deslocamento */
    }

    .happystudent-container h2 {
        font-size: 2.5rem;
        /* Reduzindo tamanho do título */
    }

    .happystudent-features {
        gap: 15px;
        /* Redução do espaçamento entre os itens */
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .happystars {
        width: 18px;
        /* Redução no tamanho do ícone de estrela */
        height: 18px;
        font-size: 13px;
    }

    .featurehappy-item p {
        font-size: 15px;
        /* Ajuste no tamanho do texto */
    }

    .happybutton {
        padding: 15px;
        /* Redução no padding do botão */
        font-size: 14px;
        /* Ajuste no tamanho da fonte */
    }
}

/*========================================================
                HAPPY STUDENT SECTION Part II @MEDIA
==========================================================*/

@media (max-width: 1366px) {
    .home-aboutus {
        margin-top: 100px !important;
        /* Redução do espaçamento superior */
        width: 95%;
        /* Ajuste na largura para melhor aproveitamento */
    }

    .home-aboutus h6 {
        font-size: 1.4rem;
        /* Pequena redução no tamanho do subtítulo */
    }

    .home-aboutus h2 {
        font-size: 2.7rem;
        /* Ajuste no tamanho do título */
    }

    .home-aboutus p {
        font-size: 1.4rem;
        /* Melhor ajuste no texto descritivo */
    }

    .team-container {
        gap: 30px;
        /* Redução do espaçamento entre os cards */
        padding: 15px;
        /* Ajuste no espaçamento interno */
    }

    .team-card {
        max-width: 550px;
        /* Redução na largura máxima do card */
        min-width: 600px;
        /* Ajuste para melhor adaptação */
        height: 420px;
        /* Redução na altura do card */
        padding: 15px;
        /* Ajuste no espaçamento interno */
    }

    .team-image {
        width: 110px;
        /* Redução no tamanho da imagem */
        height: 110px;
    }

    .team-card h3 {
        font-size: 1.1rem;
        /* Ajuste no tamanho do nome */
    }

    .team-card .role {
        font-size: 1.1rem;
        /* Ajuste no tamanho do cargo */
    }

    .team-card .description {
        font-size: 0.95rem;
        /* Ajuste no tamanho da descrição */
    }

    .linkedin-link1 img,
    .linkedin-link2 img {
        width: 18px;
        /* Redução no tamanho do ícone do LinkedIn */
    }

    .linkedin-link2 img {
        margin-top: 30px !important;
        /* Ajuste no espaçamento */
    }
}

/*========================================================
                LITTLE GIRL SECTION @MEDIA
==========================================================*/

@media (max-width: 1366px) {
    .littlegirl {
        padding: 40px 15px;
        /* Redução do espaçamento interno */
        margin-top: 10px;
        margin-bottom: 70px;
        position: relative;
        top: 680px;
    }

    .littlegirl-container {
        max-width: 1100px;
        /* Redução da largura máxima */
        gap: 100px;
        /* Ajuste no espaçamento entre imagem e texto */
    }

    .littlegirl-features {
        right: calc(5% - 10px);
        /* Ajuste na posição do texto */
    }

    .littlegirl-features h2 {
        font-size: 2.5rem;
        /* Redução do tamanho do título */
        margin-bottom: 25px;
    }

    .littlegirl-item {
        margin-bottom: 15px;
    }

    .littlechek i {
        width: 25px;
        /* Redução no tamanho do ícone */
        height: 25px;
        font-size: 16px;
    }

    .littlegirl-item p {
        font-size: 1.2rem;
        /* Ajuste no tamanho do texto */
    }

    .littlegirlimg-container {
        width: 700px;
        /* Redução na largura do contêiner de imagem */
        height: 600px;
        /* Ajuste na altura */
        margin-right: 300px;
        /* Ajuste para centralização */
    }

    .littlegirlimg-container .background {
        width: 700px;
        /* Ajuste no tamanho do fundo roxo */
    }

    .littlegirlimg-container .littlegirlimg {
        width: 400px;
        /* Ajuste no tamanho da imagem principal */
    }

    .littlegirlimg-container .icon-livro {
        width: 350px;
        /* Ajuste nos ícones */
    }

    .littlegirlimg-container .icon-lampada {
        width: 250px;
    }

    .littlegirlimg-container .icon-pecas {
        width: 350px;
    }
}

/*========================================================
                     DUVIDAS SECTION @MEDIA
==========================================================*/
@media (max-width: 1366px) {
    .duvidas {
        padding: 40px 0;
        /* Redução no espaçamento */
        height: 45vh;
        /* Redução na altura */
        top: 550px;
    }

    .duvidas-container {
        width: 85%;
        /* Redução da largura do contêiner */
        max-width: 1000px;
        /* Ajuste na largura máxima */
        max-height: 1200px;
        /* Ajuste na altura máxima */
    }

    .duvidas-content {
        padding: 30px;
        /* Redução do padding */
        margin-left: 30px;
        /* Redução do deslocamento lateral */
    }

    .duvidas-content h2 {
        font-size: 1.8rem;
        /* Redução do tamanho do título */
        margin-bottom: 15px;
    }

    .duvidas-content p {
        font-size: 0.85rem;
        /* Ajuste no tamanho do texto */
        margin-bottom: 25px;
    }

    .email-input-container {
        max-width: 500px;
        /* Redução da largura máxima */
    }

    .email-input {
        padding: 12px 18px;
        /* Redução do padding */
        font-size: 0.95rem;
        /* Ajuste no tamanho do texto */
    }

    .email-input::placeholder {
        font-size: 0.95rem;
        /* Ajuste no tamanho do placeholder */
    }

    .email-button {
        padding: 12px 25px;
        /* Redução no padding */
        font-size: 0.95rem;
        /* Ajuste no tamanho da fonte */
    }
}


/*========================================================
                     FAQ SECTION @MEDIA
==========================================================*/

@media (max-width: 1366px) {
    .faq-section {
        padding: 30px;
        /* Reduzindo o espaçamento */
        height: auto;
        /* Ajuste para evitar cortes em telas menores */
        /* margin-top: 70px; */
        position: relative;
        top: 550px;
    }

    .faq-title {
        font-size: 2.2rem;
        /* Ajuste no tamanho do título */
    }

    .faq-description {
        font-size: 1.1rem;
        /* Pequeno ajuste no tamanho do texto */
        margin-bottom: 50px;
        /* Redução do espaçamento inferior */
    }

    .faq-container {
        gap: 80px;
        /* Redução no espaçamento entre as colunas */
        max-width: 1100px;
        /* Redução na largura máxima */
        flex-wrap: wrap;
        /* Mantém a adaptação responsiva */
    }

    .faq-item {
        margin-bottom: 15px;
        /* Ajuste para reduzir espaço entre os itens */
        padding: 8px 0;
    }

    .faq-question span {
        font-size: 0.95rem;
        /* Ajuste no tamanho do texto da pergunta */
    }

    .faq-toggle i {
        font-size: 1.1rem;
        /* Redução no tamanho do ícone */
    }

    .faq-answer {
        font-size: 0.85rem;
        /* Redução no tamanho da resposta */
    }
}

/* FOOTER @MEDIA */
@media (max-width: 1366px) {
    #footer-container {
        height: 40vh !important;
        position: relative !important;
        top: 550px !important;
    }

    .footer-content{
        position: relative !important;
        top: -50px !important;
    }
    .footer-bottom {
        margin-top: 10px !important;
        position: relative !important;
        top: -40px !important;
    }

    .footer-logo {
        top: 10px !important;
    }

    .footer-logo p{
        margin-bottom: 2px !important;
    }
}


/*========================================================
                    SOBRE @MEDIA
==========================================================*/
@media (max-width: 1366px) {
    .sobre-subtittle span {
        font-size: 2rem;
    }

    .sobre-subtittle {
        margin-bottom: 20px;
    }

    .sobre-description {
        font-size: 1rem;
    }

    .sobre-image {
        width: 600px !important;
        max-width: 90% !important;
        height: auto !important;
        display: block !important;
        margin: 0 !important;
        position: absolute !important;
        top: 60px !important;
        right: 50px !important;
        left: auto !important;
        transform: none !important;
        z-index: 1 !important;
    }

    .hero .btn-entrecontato {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        min-width: 200px !important;
        padding: 12px 24px !important;
        font-size: 1rem !important;
        border-radius: 8px !important;
        background: #20B486 !important;
        color: #fff !important;
        border: none !important;
        margin: 0 auto !important;
        position: absolute !important;
        top: 420px !important; /* Reduzido para ficar mais próximo da imagem */
        left: 20% !important;
        transform: translateX(-50%) !important;
        z-index: 2 !important;
    }

    .hero .btn-entrecontato i {
        margin-left: 4px;
        /* Ajuste no espaçamento do ícone */
    }

    .hero .btn-entrecontato:hover {
        transform: translateX(4px);
        /* Redução do efeito de movimento */
    }

    .hero .btn-entrecontato:hover i {
        transform: translateX(4px);
    }

    .mainpage-title {
        font-size: 2.2rem !important;
        text-align: left !important;
        margin-bottom: 12px !important;
        margin-left: 5% !important;
    }

    .sobre-subtittle {
        font-size: 1.3rem !important;
        line-height: 1.2 !important;
        text-align: left !important;
        margin-bottom: 16px !important;
    }

    .sobre-description {
        font-size: 1rem !important;
        line-height: 1.5 !important;
        text-align: left !important;
        margin-bottom: 24px !important;
        color: #666 !important;
    }

}

/*========================================================
            HERO SECTION ABOUT US TEAM @MEDIA
==========================================================*/
@media (max-width: 1366px) {
    .policy-container {
        gap: 2px;
        /* Redução do espaçamento entre os itens */
        max-width: 1000px;
        /* Ajuste na largura máxima */
    }

    .aboutusfeature-container {
        gap: 30px;
        /* Redução do espaçamento entre os itens */
        max-width: 1000px;
        /* Ajuste na largura máxima */
    }

    .aboutusfeature-item,
    .aboutusfeature-item-reverse {
        gap: 10px;
        /* Redução do espaçamento entre imagem e texto */
    }

    .aboutusfeature-text,
    .aboutusfeature-text-reverse {
        width: 65%;
        /* Pequeno aumento na largura do texto */
        font-size: 0.9rem;
        /* Redução no tamanho do texto */
        line-height: 1.5;
    }

    .aboutusfeature-btn-saiba-mais {
        padding: 5px 18px;
        /* Redução do padding do botão */
        font-size: 0.85rem;
        /* Ajuste no tamanho da fonte */
    }

    .aboutusfeature-btn-saiba-mais:hover {
        transform: translateX(3px);
        /* Redução do efeito de movimento */
    }

    .aboutusfeature-btn-saiba-mais:hover i {
        transform: translateX(4px);
    }

    .teamfeature-container {
        gap: 100px;
        /* Redução no espaçamento entre os itens */
        max-width: 1000px;
        /* Ajuste na largura máxima */
        margin-top: 100px !important;
        margin-bottom: 30px;
    }

    .teamfeature-item,
    .teamfeature-item-reverse {
        gap: 10px;
    }

    .teamfeature-text,
    .teamfeature-text-reverse {
        width: 65%;
        /* Ajuste para melhor distribuição */
        font-size: 0.9rem;
        line-height: 1.5;
    }

    .teamfeature-text h1,
    .teamfeature-text-reverse h1 {
        font-size: 1.8rem;
        /* Redução no tamanho do título */
    }

    .teamfeature-text h5,
    .teamfeature-text-reverse h5 {
        font-size: 0.9rem;
        /* Ajuste no subtítulo */
        margin-top: 10px;
        margin-bottom: 10px;
    }
}

@media (max-width: 1366px) {
    .team-aboutus {
        padding: 40px 20px;
        /* Ajuste no espaçamento */
    }

    .home-aboutus {
        width: 80%;
        /* Redução da largura para melhor organização */
        margin: 0 auto;
        /* Centraliza o conteúdo */
        text-align: center;
        /* Mantém centralizado */
    }

    .home-aboutus h4 {
        font-size: 1.3rem;
        /* Redução do tamanho do subtítulo */
        margin-bottom: 8px;
        /* Ajuste no espaçamento */
    }

    .home-aboutus h2 {
        font-size: 2.5rem;
        /* Redução no tamanho do título */
        margin-bottom: 15px;
        /* Ajuste no espaçamento */
    }

    .home-aboutus p {
        font-size: 1.2rem;
        /* Ajuste no tamanho do texto */
        line-height: 1.5;
        /* Melhor espaçamento entre linhas */
    }
}

/*========================================================
            HERO SECTION ABOUT US BENEFIT CARD @MEDIA
==========================================================*/
@media (max-width: 1366px) {
    .aboutus-benefits-section {
        padding: 30px;
        /* Redução do espaçamento geral */
    }

    .aboutus-benefits-header {
        margin-top: 100px;
        margin-bottom: 40px;
    }

    .aboutus-benefits-header h2 {
        font-size: 22px;
        /* Redução do subtítulo */
    }

    .aboutus-benefits-header h3 {
        font-size: 2.5rem;
        /* Redução do título */
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .aboutus-benefits-header p {
        font-size: 16px;
        /* Redução do tamanho do parágrafo */
        margin-bottom: 30px;
    }

    .aboutus-benefits-grid {
        grid-template-columns: repeat(3, 1fr);
        /* Mantém 3 colunas */
        gap: 15px;
        /* Redução do espaçamento entre os cards */
        max-width: 1000px;
        /* Redução da largura máxima */
    }

    .aboutus-benefit-card {
        padding: 15px;
        /* Redução do padding dos cartões */
        border-radius: 8px;
        /* Pequena redução no arredondamento */
    }

    .aboutus-benefit-card h4 {
        font-size: 28px;
        /* Redução do número principal */
    }

    .aboutus-benefit-card h5 {
        font-size: 20px;
        /* Redução do título do benefício */
    }

    .aboutus-benefit-card p {
        font-size: 13px;
        /* Redução do texto descritivo */
    }
}


/*========================================================
                     CONTATO @MEDIA
==========================================================*/
@media (max-width: 1366px) {
    .faleconosco-section {
        padding: 15px;
        /* Redução do espaçamento geral */
        min-height: 130vh;
        /* Ajuste na altura */
    }

    .faleconosco-left {
        top: 10%;
        /* Ajuste na posição */
        left: 4%;
    }

    .faleconosco-left h2 {
        font-size: 2.9rem; /* Redução do tamanho do título */
        margin-bottom: 15px;
        margin-top: 50px;
    }

    .faleconosco-left p {
        font-size: 1rem;/* Ajuste no tamanho do texto */
        margin-bottom: 15px;
    }

    .faleconosco-left img {
        width: 450px;/* Redução do tamanho da imagem */
        top: calc(100% - 42px); /* Ajuste na posição */
        margin-left: 250px;
    }

    .faleconosco-right {
        width: 500px;
        /* Redução da largura do formulário */
        right: 4%;
        top: 15%;
        padding: 25px;
        /* Ajuste no espaçamento interno */
    }

    .faleconosco-right h3 {
        font-size: 1.3rem;
        /* Redução no tamanho do título do formulário */
        margin-bottom: 25px;
    }

    .faleconosco-form-group {
        margin-bottom: 15px;
        /* Redução do espaçamento entre os grupos */
    }

    .faleconosco-fields {
        gap: 10px; /* Redução do espaçamento horizontal entre os inputs */
        margin-bottom: 15px; /* Redução do espaçamento inferior */
    }

    .faleconosco-form-group input,
    .faleconosco-field input,
    .faleconosco-form-group select,
    .faleconosco-form-group-text textarea {
        padding: 8px;
        /* Redução do padding para inputs menores */
        font-size: 14px;
        /* Ajuste no tamanho da fonte */
        margin-bottom: 5px;
        /* Redução do espaçamento inferior dos inputs */
    }

    .faleconosco-form-group-text textarea {
        height: 100px;
        /* Redução na altura do campo de texto */
    }

    .faleconosco-btn {
        padding: 10px;
        /* Ajuste no padding do botão */
        font-size: 16px;
        /* Redução no tamanho do botão */
    }

    .politica-texto {
        font-size: 12px;
        /* Ajuste no tamanho do texto da política */
    }
}

/*========================================================
                     SUPORTE @MEDIA
==========================================================*/

@media (max-width: 1366px) {
    .suporte-section {
        padding: 15px; /* Redução do espaçamento geral */
        min-height: 90vh; /* Ajuste na altura */
        margin-bottom: 20px; /* Redução do espaço inferior */
    }

    .suporte-container {
        max-width: 1000px; /* Ajuste na largura máxima */
    }

    .suporte-left {
        left: 4% !important;
        top: 12% !important;
        padding: 30px !important; /* Redução no espaçamento interno */
    }

    .suporte-left h2 {
        font-size: 3rem !important; /* Redução do tamanho do título */
        margin-bottom: 8px !important;
    }

    .suporte-left p {
        font-size: 18px !important; /* Ajuste no tamanho do texto */
        margin-bottom: 15px !important;
    }

    .suporte-left img {
        width: 600px !important; /* Redução do tamanho da imagem */
        top: calc(75% + 9px) !important;
        margin-left: 40px !important;
    }

    
    .suporte-right {
        right: -3% !important;
        top: 16% !important;
        width: 600px !important; /* Redução da largura do formulário */
        padding: 15px !important;
    }

    .suporte-form-group {
        margin-bottom: 10px; /* Redução do espaçamento entre os grupos */
    }

    .suporte-form-group label {
        font-size: 0.8rem !important;
    }

    .suporte-form-group input,
    .suporte-form-group textarea {
        width: 85% !important; /* Ajuste na largura dos campos */
        padding: 8px !important; /* Redução do padding */
        font-size: 14px !important; /* Ajuste no tamanho da fonte */
        margin-bottom: 20px !important; /* Redução do espaçamento inferior entre os inputs */
    }

    .suporte-form-group textarea {
        height: 100px !important; /* Redução na altura do campo de mensagem */
    }

    .suporte-btn-enviar {
        width: 85% !important;
        padding: 8px !important;
        font-size: 15px !important; /* Redução no tamanho do botão */
    }
}

/* MOBILE : Ajustes para telas até 768px */
@media (max-width: 768px) {

    /* Pagina inicial */
    body.mainpage {
        font-size: 15px !important;
        padding: 0 !important;
    }

    .navbar .container-fluid {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    .d-flex.align-items-center {
        flex-direction: column !important;
        align-items: flex-start !important;
        width: 100% !important;
    }
    .navbar-logo {
        margin-bottom: 8px !important;
        margin-left: 5px !important;
    }
    .dropdown.ms-3 {
        margin-left: 0 !important;
        width: 100% !important;
    }
    #municipioSearch {
        margin-left: 5px !important;
        margin-top: 0 !important;
        margin-bottom: 8px !important;
        width: calc(100vw - 43px) !important;
        max-width: 90vw !important;
        display: block !important;
    }
    .navbar-toggler {
        margin-left: 5px !important;
        margin-top: 0 !important;
        align-self: flex-start !important;
        order: 3 !important;
    }

    .nav-itens {
        gap: 10px !important;
        margin: 0 !important;
        padding: 0 5px !important;
    }
    .nav-itens a,
    .nav-itens .nav-link {
        font-size: 13px !important;
        padding: 4px 6px !important;
        margin: 0 2px !important;
    }

    .nav-itens-button {
        display: flex !important;
        justify-content: center;
        width: 100% !important;
        margin: 10px 0 0 0 !important;
        flex-basis: 100% !important;   /* força quebra de linha */
        order: 10 !important;          /* garante que fique depois dos menus */
    }
    .nav-itens {
        width: 100% !important;
        flex-wrap: wrap !important;
    }

    .mainpage-content,
    .mainpage-title,
    .mainpage-description {
        left: 0 !important;
        top: 60px !important;
        max-width: 100vw !important;
        width: 100vw !important;
        padding: 0 10px !important;
        text-align: center !important;
        position: static !important;
        box-sizing: border-box !important;
    }

    .mainpage-title {
        text-align: left !important;
        margin-left: 10px !important;
        margin-right: 0 !important;
        font-size: 2rem !important;
        padding: 0 !important;
    }

    .mainpage-description {
        font-size: 1rem !important;
        margin-bottom: 20px !important;
        padding: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center !important;
    }

    .mainpage-image {
        width: 90vw !important;
        max-width: 90vw !important;
        height: auto !important;
        display: block;
        margin: 0 auto 30px auto !important; /* Ajustei a margem inferior para 30px */
        position: relative !important; /* Mudei para relative para ter mais controle */
        right: 0 !important;
        top: 50px !important; /* Adicionei um deslocamento para baixo */
        transform: none !important;
    }

    .mainpage-icons {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        justify-content: center !important;
        gap: 0px !important;
    }

    #municipioSearch {
        display: block;
        margin-top: 10px;    /* Espaço abaixo da imagem */
        margin-left: 5px;    /* Espaço da borda esquerda */
        width: calc(100vw - 20px); /* Ajuste a largura se necessário */
        max-width: 95vw;
    }
}

/* Carrossel com Nossos Números */
@media (max-width: 768px) {    

    .section-nossosnumeros {
        left: 0 !important;
        top: 100px !important;
        max-width: 100vw !important;
        width: 100vw !important;
        padding: 0 10px !important;
        text-align: center !important;
        position: relative !important;
        box-sizing: border-box !important;
    }
    
    .section-nossosnumeros h2 {
        font-size: 2.3rem !important;
    }

    .carouselnumeros-container {
        width: 100vw !important;
        max-width: 100vw !important;
        margin: 0 auto !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        position: relative !important;
        overflow: hidden !important;
    }

    .carouselnossosnumeros-track {
        width: 100vw !important;
        overflow: visible !important;
        position: relative !important;
        min-height: 260px !important;
        display: block !important; /* Não use flex aqui! */
        top: 8px !important;
    }
    .carouselnossosnumeros-slide {
        width: 90vw !important;
        max-width: 90vw !important;
        min-width: 90vw !important;
        margin: 0 0 20px 2vw !important;
        box-sizing: border-box !important;
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        background: #fff !important;
        border-radius: 20px !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
        transition: transform 0.3s, opacity 0.3s !important;
    }

    /* Centraliza o card ativo */
    .carouselnossosnumeros-slide.activeevalution {
        z-index: 2 !important;
        opacity: 1 !important;
    }

    .carouselnossosnumeros-button {
        position: absolute !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 3 !important;
        width: 36px !important;
        height: 36px !important;
        background: #fff !important;
        border-radius: 50% !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08);
        border: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 1.2rem !important;
    }
    .carouselnossosnumeros-button.prev {
        left: 20px !important;
        right: auto !important;
    }
    .carouselnossosnumeros-button.next {
        right: 40px !important;
        left: auto !important;
    }


    /* Cards e botões */
    .mainpage-cards,
    .mainpage-buttons {
        flex-direction: column !important;
        align-items: center !important;
        gap: 15px !important;
        width: 100% !important;
        margin: 0 auto !important;
    }

    .mainpage-card,
    .mainpage-feature-card {
        width: 95vw !important;
        margin: 10px auto !important;
        min-width: unset !important;
        max-width: 100vw !important;
        box-sizing: border-box !important;
    }

    .mainpage-buttons button,
    .mainpage-buttons a {
        width: 90vw !important;
        margin: 0 auto 10px auto !important;
        font-size: 1rem !important;
    }

    /* Esconde círculos decorativos */
    .circle, .circle-left-1, .circle-left-2, .circle-left-3, .circle-left-4,
    .circle-right-1, .circle-right-2, .circle-right-3, .circle-right-4,
    .circle-right-5,
    .mini-circle, .mini-circle-right {
        display: none !important;
    }
}

@media (max-width: 768px) {
    /* Ajuste para os cards sobrepostos na imagem */
    .feature-card-on-image {
        position: static !important;
        margin: 10px auto !important;
        width: 90vw !important;
        left: 0 !important;
        top: 0 !important;
        transform: none !important;
        display: block !important;
    }

    .features {
        padding-top: 40px !important;
    }

    .features .container {
        width: 100vw !important;
        padding: 0 !important;
        overflow-x: hidden !important;
    }
    .features .row {
        display: flex !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory;
        gap: 15px !important;
        -webkit-overflow-scrolling: touch;
        padding: 20px 0 20px 20px !important; /* Aumentado o padding vertical */
        margin: 0 !important;
    }
    .features .card {
        min-width: 85vw !important;
        max-width: 85vw !important;
        flex: 0 0 85vw !important;
        scroll-snap-align: center;
        margin: 0 !important;
    }
    .features .card:first-child {
        margin-left: 10px !important; /* ou o valor que preferir */
    }

    #indicators-mainpage,
    .indicators {
        display: none !important;
    }

    .section-avaliacao {
        margin-top: 260px !important;
    }
}

/* EDUCAÇÃO SECTION @MEDIA */
@media (max-width: 768px) {
    .educacao-container {
        position: relative !important;
        top: 450px !important;
        padding-top: 0px !important;
    }

    .subtitulo {
        margin-bottom: 20px;
    }

    .fundo {
        min-height: 300px;
    }

    .imagem-principal{
        margin-top: 40px !important;
    }

    .icone-descricao {
        text-align: center !important;
    }
}

/* SECTION AVALIACAO */
@media (max-width: 768px) {    
    .section-avaliacao {
        top: 200px !important;
        position: relative !important;
    }
}

@media (max-width: 768px) {    
    .happystudent {
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        margin-top: 100px !important;
        /* height: auto !important; */
        min-height: 230vh !important;
    }

    .happystudent-container {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 95vw !important;
        max-width: 95vw !important;
        margin: 20px auto 0 auto !important;
        padding: 20px 10px 30px 10px !important;
        border-radius: 18px !important;
        box-sizing: border-box !important;
        background: #20B486 !important;
        position: static !important;
        min-height: 548px !important;
    }
    .happystudent-container img {
        width: 70vw !important;
        max-width: 220px !important;
        height: auto !important;
        display: block !important;
        margin: 0 auto 18px auto !important;
        position: static !important;
        order: 4 !important;
        margin-top: 90px !important;
    }
    .happystudent-container h2 {
        order: 1 !important;
        font-size: 1.3rem !important;
        color: #fff !important;
        text-align: center !important;
        margin-bottom: 18px !important;
        margin-top: 0 !important;
        line-height: 1.2 !important;
    }
    .happystudent-features {
        order: 2 !important;
        width: 100% !important;
        margin-bottom: 18px !important;
        margin-top: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }
    .featurehappy-item {
        display: flex !important;
        align-items: flex-start !important;
        gap: 8px !important;
    }

    .happystars {
        color: #fff !important;
        font-size: 1.1rem !important;
        margin-top: 2px !important;
    }
    .featurehappy-item p {
        color: #fff !important;
        font-size: 1rem !important;
        margin: 0 !important;
        text-align: left !important;
    }
    .happybutton {
        order: 3 !important;
        width: 90%;
        max-width: 260px;
        margin: 0 auto 18px auto !important;
        display: block !important;
        font-size: 1rem !important;
        padding: 12px 0 !important;
        border-radius: 8px !important;
        text-align: center !important;
    }
}

@media (max-width: 768px) {
    /* TEAM */
    .team-container {
        flex-direction: column !important;
        align-items: center !important;
        gap: 24px !important;
        width: 100vw !important;
        max-width: 100vw !important;
        padding: 0 0 30px 0 !important;
    }
    .team-card {
        width: 92vw !important;
        max-width: 98vw !important;
        min-width: unset !important;
        box-sizing: border-box !important;
        padding: 18px 10px 18px 10px !important;
        margin: 0 auto 18px auto !important;
        border-radius: 16px !important;
        background: #fff !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        height: auto !important;
    }
    .team-card h3 {
        font-size: 1.1rem !important;
        text-align: center !important;
        margin: 10px 0 6px 0 !important;
        word-break: break-word !important;
    }
    .team-card .role {
        font-size: 0.95rem !important;
        text-align: center !important;
        margin-bottom: 10px !important;
        word-break: break-word !important;
    }
    .team-card .description {
        font-size: 0.95rem !important;
        text-align: left !important;
        margin: 0 0 10px 0 !important;
        word-break: break-word !important;
        line-height: 1.4 !important;
        max-width: 100% !important;
    }
    .team-image {
        width: 80px !important;
        height: 80px !important;
        object-fit: cover !important;
        border-radius: 50% !important;
        margin-bottom: 8px !important;
    }
    .linkedin-link1 img,
    .linkedin-link2 img {
        width: 22px !important;
        height: 22px !important;
        margin-top: 6px !important;
    }
}

@media (max-width: 768px) {
    /* LITTLE GIRL */
    .littlegirl {
        position: relative !important;
        top: 10px !important;
    }
    .littlegirlimg-container {
        position: relative !important;
        width: 100vw !important;
        max-width: 340px !important;
        margin: 0 auto !important;
        padding-top: 20px !important;
        padding-bottom: 180px !important; /* espaço para a menina */
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        min-height: 420px !important;
    }
    .littlegirlimg-container h2 {
        margin: 0 0 10px 0 !important;
        width: 100% !important;
        font-size: 1.35rem !important;
        text-align: center !important;
        color: #5B5BCE !important;
        z-index: 2 !important;
        line-height: 1.3 !important;
        font-weight: bold !important;
        background: transparent !important;
        position: static !important;
    }
    .littlegirlimg-container .background {
        width: 90% !important;
        max-width: 260px !important;
        height: auto !important;
        z-index: 1 !important;
        left: 10px !important;
        display: block !important;
        margin: 0 auto !important;
        position: relative !important;
    }
    .littlegirlimg-container .littlegirlimg {
        width: 110px !important;
        max-width: 130px !important;
        position: absolute !important;
        left: 50% !important;
        top: 80px !important; /* ajuste para subir sobre o fundo roxo */
        transform: translateX(-50%) !important;
        z-index: 2 !important;
        margin: 0 !important;
        display: block !important;
    }
    .littlegirlimg-container .icon {
        position: absolute !important;
        width: 150px !important;
        height: 150px !important;
        z-index: 4 !important;
        margin: 0 !important;
    }
    .littlegirl-features {
        width: 100% !important;
        margin-top: 350px !important; /* espaço para não sobrepor a menina */
        padding-top: 20% !important;
        padding-bottom: 10% !important;
        padding-left: 22px !important; /* afasta os itens da margem esquerda */
    }

    .littlegirl-features h2{
        font-size: 1.5rem !important;
        text-align: center !important;
    }

    .littlegirlimg-container .icon-livro {
        left: 2px !important;
        top: 30px !important;
    }
    .littlegirlimg-container .icon-lampada {
        right: 00px !important;
        top: 15px !important;
    }
    .littlegirlimg-container .icon-pecas {
        left: 50px !important;
        bottom: 40px !important;
        top: 140px !important; 
        transform: translateX(-50%) !important;
    }
}
@media (max-width: 768px) {
    /* Dúvidas */

    .duvidas {
        /* padding: 0 !important; */
        padding-top: 0% !important;
        background: transparent !important;
        height: 60vh !important;
    }
    .duvidas-container {
        position: relative !important;
        width: 92vw !important;
        max-width: 370px !important;
        margin: 24px auto 0 auto !important;
        background: #5B5BCE !important;
        border-radius: 24px !important;
        box-shadow: 0 2px 12px rgba(0,0,0,0.08) !important;
        min-height: 500px !important;
        overflow: visible !important;
        padding: 0 !important;
        padding-bottom: 0 !important;
    }
    .duvidas-background {
        display: none !important; /* Esconde o fundo antigo */
    }
    .duvidas-content {
        position: relative !important;
        z-index: 2 !important;
        padding: 32px 18px 24px 18px !important;
        text-align: center !important;
    }
    .duvidas-content h2 {
        color: #fff !important;
        font-size: 1.5rem !important;
        font-weight: bold !important;
        margin-bottom: 12px !important;
        line-height: 1.2 !important;
    }
    .duvidas-content p {
        color: #fff !important;
        font-size: 1rem !important;
        margin-bottom: 22px !important;
        line-height: 1.4 !important;
    }
    .email-input-container {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        align-items: stretch !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
    .email-input {
        width: 100% !important;
        border-radius: 10px !important;
        border: none !important;
        padding: 14px 14px !important;
        font-size: 1rem !important;
        background: rgba(255,255,255,0.18) !important;
        color: #fff !important;
        margin-bottom: 0 !important;
        outline: none !important;
    }
    .email-input::placeholder {
        color: #e0e0e0 !important;
        opacity: 1 !important;
    }
    .email-button {
        width: 40% !important;
        border-radius: 8px !important;
        background: #20B486 !important;
        color: #fff !important;
        font-weight: bold !important;
        font-size: 0.8rem !important;
        padding: 14px 0 !important;
        border: none !important;
        margin-top: 0 !important;
        box-shadow: none !important;
        transition: background 0.2s;
    }
    .email-button:active,
    .email-button:focus {
        background: #17996b !important;
    }
    /* Imagem da criança no canto inferior direito */
    .duvidas-container::after {
        content: "";
        position: absolute;
        right: 20px;
        bottom: 1px;
        width: 320px; 
        height: 160px;
        background: url('/static/images/mainpage/duvidas/duvidas.png') no-repeat bottom right;
        background-size: cover;
        z-index: 3;
        pointer-events: none;
        border-radius: 10px;
        overflow: hidden;
    }
}

@media (max-width: 768px) {
    .faq-section {
        padding: 30px;
        /* Reduzindo o espaçamento */
        height: auto;
        /* Ajuste para evitar cortes em telas menores */
        margin-top: 70px;
        position: relative !important;
        top: 100px !important;
    }
}

@media (max-width: 768px) {
    /* FOOTER */
    .footer-links{
        gap: 10px !important;
    }

    .footer-logo img {
        max-width: 220px !important;
        margin-bottom: 30px !important;
        margin-top: 90px !important;
    }

    .footer-logo p {
        margin-bottom: 0px !important;
    }
}

@media (max-width: 768px) {
    /* LOGIN */
    .login-form-container {
        width: 80%;
        max-width: 80%;
        padding: 0 15px;
        box-sizing: border-box;
    }

    .form-group {
        width: 100%;
    }

    .form-group input {
        width: 100%;
        font-size: 14px;
        padding: 10px;
        box-sizing: border-box;
    }

    .form-group label {
        font-size: 13px;
    }

    .login-back-button {
        width: 70%;
        max-width: 70%;
        font-size: 14px;
        padding: 12px 0;
        margin-top: 10px;
        box-sizing: border-box;
    }

    .login-button {
        width: 70%;
        max-width: 70%;
        font-size: 14px;
        padding: 12px 0;
        margin-top: 10px;
        box-sizing: border-box;
    }

    .extra-links {
        text-align: center;
        font-size: 13px;
        margin-top: 10px;
    }

    .login-logo img {
        max-width: 130px;
        height: auto;
        display: block;
        margin: 0 auto 20px;
    }

    .login-tittle h2 {
        text-align: center;
        font-size: 22px;
    }
}

@media (max-width: 768px) {
    /* FALE CONOSCO */
    .faleconosco-section {
        background: #17996b !important; /* cor sólida igual ao Figma */
        padding: 0 !important;
        min-height: 100vh !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
    }
    .faleconosco-container {
        width: 100vw !important;
        max-width: 100vw !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }
    .faleconosco-left {
        width: 100% !important;
        padding: 32px 16px 0 16px !important; /* aumentei o padding-top */
        box-sizing: border-box !important;
        text-align: left !important;
        position: relative !important;
        z-index: 2 !important;
    }
    .faleconosco-left h2 {
        font-size: 2rem !important;
        font-weight: bold !important;
        margin-bottom: 12px !important;
        color: #fff !important;
        line-height: 1.2 !important;
    }
    .faleconosco-left p,
    .faleconosco-left .destaque {
        font-size: 1rem !important;
        color: #fff !important;
        margin-bottom: 10px !important;
        line-height: 1.4 !important;
    }
    .faleconosco-left img {
        display: none !important; /* Esconde a imagem no mobile, igual ao Figma */
    }
    .faleconosco-right {
        width: 100% !important;
        max-width: 400px !important;
        margin: 0 auto !important;
        background: transparent !important;
        padding: 0 12px 24px 12px !important;
        box-sizing: border-box !important;
        position: relative !important;
        z-index: 1 !important;
    }
    .faleconosco-right h3 {
        font-size: 1.2rem !important;
        color: #fff !important;
        text-align: center !important;
        margin-bottom: 18px !important;
        font-weight: 600 !important;
    }
    .faleconosco-fields,
    .faleconosco-field,
    .faleconosco-form-group-text {
        width: 100% !important;
        margin-bottom: 14px !important;
    }
    .faleconosco-field label,
    .faleconosco-form-group-text label {
        font-size: 1rem !important;
        color: #fff !important;
        margin-bottom: 4px !important;
        display: block !important;
        text-align: left !important;
    }
    .faleconosco-field input,
    .faleconosco-dropdown input,
    .faleconosco-form-group-text textarea {
        width: 100% !important;
        padding: 14px 12px !important;
        font-size: 1rem !important;
        border-radius: 8px !important;
        border: 1.5px solid #fff !important;
        background: transparent !important;
        color: #fff !important;
        margin-bottom: 0 !important;
        box-sizing: border-box !important;
    }
    .faleconosco-form-group-text textarea {
        min-height: 110px !important;
        resize: vertical !important;
    }
    .faleconosco-dropdown-menu {
        background: #fff !important;
        color: #222 !important;
        border-radius: 8px !important;
        font-size: 1rem !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
        z-index: 10 !important;
    }
    .faleconosco-btn {
        width: 100% !important;
        padding: 14px 0 !important;
        font-size: 1.1rem !important;
        background: #5B5BCE !important;
        color: #fff !important;
        border: none !important;
        border-radius: 8px !important;
        font-weight: bold !important;
        margin-top: 10px !important;
        margin-bottom: 0 !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
        transition: background 0.2s;
    }
    .faleconosco-btn:active,
    .faleconosco-btn:focus {
        background: #3d3db3 !important;
    }
    .politica-texto {
        font-size: 0.9rem !important;
        color: #fff !important;
        text-align: center !important;
        margin-top: 14px !important;
    }
    .politica-texto a {
        color: #fff !important;
        text-decoration: underline !important;
    }

    .faleconosco-fields {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        width: 100% !important;
    }
    .faleconosco-field {
        width: 100% !important;
    }
}

@media (max-width: 768px) {
    /* ABOUT US CONTATO */
    .aboutus-benefits-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 18px !important;
        width: 100% !important;
        max-width: 100vw !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }
    .aboutus-benefit-card {
        width: 100% !important;
        max-width: 100vw !important;
        margin: 0 auto !important;
    }

    /* SUPORTE */
    .suporte-section {
        background: #17996b !important;
        min-height: 100vh !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
    }
    .suporte-container {
        width: 100vw !important;
        max-width: 100vw !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }
    .suporte-left {
        width: 100% !important;
        padding: 32px 16px 0 16px !important;
        box-sizing: border-box !important;
        text-align: center !important;
        position: relative !important;
        z-index: 2 !important;
    }
    .suporte-left h2 {
        font-size: 2rem !important;
        font-weight: bold !important;
        margin-bottom: 12px !important;
        color: #fff !important;
        line-height: 1.2 !important;
    }
    .suporte-left p {
        font-size: 1rem !important;
        color: #fff !important;
        margin-bottom: 18px !important;
        line-height: 1.4 !important;
    }
    .suporte-left img {
        display: block !important;
        margin: 32px auto 0 auto !important;
        width: 70vw !important;
        max-width: 260px !important;
        height: auto !important;
        border-radius: 0 !important;
        position: static !important;
    }
    .suporte-right {
        width: 100% !important;
        max-width: 400px !important;
        margin: 0 auto !important;
        margin-left: -25px !important;
        background: transparent !important;
        padding: 12px 12px 24px 12px !important;
        box-sizing: border-box !important;
        position: relative !important;
        z-index: 1 !important;
    }
    .suporte-form-group {
        width: 100% !important;
        margin-bottom: 12px !important;
    }
    .suporte-form-group label {
        font-size: 1rem !important;
        color: #fff !important;
        margin-bottom: 4px !important;
        display: block !important;
        text-align: left !important;
    }
    .suporte-form-group input,
    .suporte-form-group textarea {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 14px 12px !important;
        font-size: 1rem !important;
        border-radius: 8px !important;
        border: 1.5px solid #fff !important;
        background: transparent !important;
        color: #fff !important;
        margin-bottom: 0 !important;
    }
    .suporte-form-group textarea {
        min-height: 110px !important;
        resize: vertical !important;
    }
    .suporte-btn-enviar {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 14px 0 !important;
        font-size: 1.1rem !important;
        background: #5B5BCE !important;
        color: #fff !important;
        border: none !important;
        border-radius: 8px !important;
        font-weight: bold !important;
        margin-top: 10px !important;
        margin-bottom: 0 !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
        transition: background 0.2s;
        display: block !important;
    }
    .suporte-btn-enviar:active,
    .suporte-btn-enviar:focus {
        background: #3d3db3 !important;
    }
}

@media (max-width: 768px) {
    /* ABOUT US - HERO */
    .hero {
        min-height: 100vh !important;
        padding: 20px 16px !important;
        position: relative !important;
        overflow: hidden !important;
        background: #fff !important;
    }

    .mainpage-content {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        position: relative !important;
        left: 0 !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        min-height: 700px !important;
    }

    .sobre-image {
        width: 280px !important;
        max-width: 90% !important;
        height: auto !important;
        display: block !important;
        margin: 0 !important;
        position: absolute !important;
        top: 52% !important;
        right: 40px !important;
        left: auto !important;
        transform: none !important;
        z-index: 1 !important;
    }

    .sobre-description {
        font-size: 1rem !important;
        line-height: 1.5 !important;
        text-align: center !important;
        margin-bottom: 24px !important;
        color: #666 !important;
    }

    .hero .btn-entrecontato {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        min-width: 200px !important;
        padding: 12px 24px !important;
        font-size: 0.8rem !important;
        border-radius: 8px !important;
        background: #20B486 !important;
        color: #fff !important;
        border: none !important;
        margin: 0 auto !important;
        position: absolute !important;
        top: 85% !important; /* Reduzido para ficar mais próximo da imagem */
        left: 50% !important;
        transform: translateX(-50%) !important;
        z-index: 2 !important;
    }

    .mainpage-title {
        font-size: 2.2rem !important;
        text-align: center !important;
        margin-bottom: 12px !important;
        margin-left: -10px !important;
    }

    .sobre-subtittle {
        font-size: 1.2rem !important;
        line-height: 1.3 !important;
        text-align: center !important;
        margin-bottom: 16px !important;
    }

    .sobre-subtittle span{
        font-size: 1.5rem !important;
        line-height: 1.3 !important;
        text-align: center !important;
        margin-bottom: 16px !important;
    }


    .sobre-subtittle br {
        display: none !important; /* Remove quebras de linha forçadas */
    }

    .sobre-description {
        font-size: 1rem !important;
        line-height: 1.5 !important;
        text-align: center !important;
        margin-bottom: 24px !important;
        color: #666 !important;
    }

    .sobre-description br {
        display: none !important; /* Remove quebras de linha forçadas */
    }

    /* Remove círculos decorativos no mobile */
    .circle,
    .circle-left-1,
    .circle-left-2,
    .circle-left-3,
    .circle-left-4,
    .circle-right-1,
    .circle-right-2,
    .circle-right-3,
    .circle-right-4,
    .circle-right-5,
    .mini-circle,
    .mini-circle-right {
        display: none !important;
    }
}

@media (max-width: 768px) {
    /* ABOUT US FEATURE SECTION - MOBILE */
    .aboutusfeature-section {
        padding: 20px 16px !important;
        margin-top: 20px !important; /* Espaço para a seção anterior */
        background: #fff !important;
    }

    .aboutusfeature-container {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 40px !important;
        padding: 0 !important;
    }

    .aboutusfeature-item,
    .aboutusfeature-item-reverse {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 24px !important;
        padding: 0 !important;
    }

    .aboutusfeature-image {
        width: 100% !important;
        max-width: 280px !important;
        height: auto !important;
        margin: 0 auto !important;
        display: block !important;
        order: 2 !important; /* Imagem sempre abaixo do texto */
    }

    .aboutusfeature-text,
    .aboutusfeature-text-reverse {
        width: 100% !important;
        padding: 0 10px !important;
        order: 1 !important; /* Texto sempre acima da imagem */
    }

    .aboutusfeature-text p,
    .aboutusfeature-text-reverse p {
        font-size: 1rem !important;
        line-height: 1.5 !important;
        color: #666 !important;
        margin-bottom: 16px !important;
        text-align: center !important;
    }

    .aboutusfeature-btn-saiba-mais {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        min-width: 140px !important;
        padding: 12px 24px !important;
        font-size: 0.9rem !important;
        border-radius: 8px !important;
        background: #20B486 !important;
        color: #fff !important;
        border: none !important;
        margin: 24px auto 0 auto !important;
        cursor: pointer !important;
    }

    .aboutusfeature-btn-saiba-mais i {
        margin-left: 8px !important;
        font-size: 1.1rem !important;
    }
}

@media (max-width: 768px) {
    /* TEAM ABOUT US SECTION - MOBILE */
    .team-aboutus {
        padding: 32px 12px 32px 12px !important;
        background: #fff !important;
        margin-top: 40px !important;
    }
    .home-aboutus {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto 32px auto !important;
        text-align: center !important;
        padding: 0 !important;
        padding-top: 40px !important;
    }
    .home-aboutus h6 {
        font-size: 1.1rem !important;
        color: #20B486 !important;
        margin-bottom: 8px !important;
        font-weight: 600 !important;
    }
    .home-aboutus h2 {
        font-size: 1.3rem !important;
        color: #5B5BCE !important;
        margin-bottom: 12px !important;
        font-weight: 700 !important;
    }
    .home-aboutus p {
        font-size: 1rem !important;
        color: #666 !important;
        margin-bottom: 0 !important;
        line-height: 1.5 !important;
    }
    .teamfeature-container {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 48px !important;
        padding: 0 !important;
        align-items: center !important;
        margin-top: 50px !important;
    }
    .teamfeature-item,
    .teamfeature-item-reverse {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 18px !important;
        padding: 0 !important;
    }
    .teamfeature-text,
    .teamfeature-text-reverse {
        width: 100% !important;
        padding: 0 10px !important;
        text-align: center !important;
        order: 1 !important;
    }
    .teamfeature-text h1,
    .teamfeature-text-reverse h1 {
        font-size: 1.1rem !important;
        color: #222 !important;
        font-weight: 700 !important;
        margin-bottom: 6px !important;
        margin-top: 0 !important;
    }
    .teamfeature-text h5,
    .teamfeature-text-reverse h5 {
        font-size: 0.95rem !important;
        color: #20B486 !important;
        font-weight: 600 !important;
        margin-bottom: 10px !important;
        margin-top: 0 !important;
    }
    .teamfeature-text p,
    .teamfeature-text-reverse p {
        font-size: 0.95rem !important;
        color: #666 !important;
        margin-bottom: 12px !important;
        line-height: 1.5 !important;
    }
    .teamfeature-image {
        width: 100% !important;
        max-width: 220px !important;
        height: auto !important;
        display: block !important;
        margin: 0 auto 0 auto !important;
        border-radius: 18px !important;
        order: 2 !important;
        box-shadow: 0 2px 12px rgba(0,0,0,0.07) !important;
        object-fit: cover !important;
    }

    .aboutus-benefits-header {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto 32px auto !important;
        text-align: center !important;
        padding: 0 !important;
    }
    .aboutus-benefits-header h2 {
        font-size: 1.1rem !important;
        color: #20B486 !important;
        margin-bottom: 8px !important;
        font-weight: 600 !important;
    }
    .aboutus-benefits-header h3 {
        font-size: 1.3rem !important;
        color: #5B5BCE !important;
        margin-bottom: 12px !important;
        font-weight: 700 !important;
    }
    .aboutus-benefits-header p {
        font-size: 1rem !important;
        color: #666 !important;
        margin-bottom: 0 !important;
        line-height: 1.5 !important;
    }
}