/* base do site */
@import url(./base.css);
@import url(./menu.css);

/* partes da home */
@import url(./hero.css);
@import url(./section-home.css);
@import url(./card-home.css);
@import url(./footer.css);

/* paginas internas */
@import url(./integrantes.css);
@import url(./sobre.css);
@import url(./faq.css);
@import url(./contato.css);
@import url(./modal.css);
@import url(./funcionalidades.css);

/* responsivo fica por ultimo pra mandar por cima quando precisar */
@import url(./responsividade.css);

/* acabamento visual geral */
.section:not(.section-cards),
.fluxo-section,
.funcionalidades-slider{
    padding: 6.4rem 0;
}

.page-title{
    padding: 7.2rem 0 6.4rem;
}

.page-heading{
    margin-top: 0.4rem;
    line-height: 1.05;
}

.page-text{
    max-width: 72rem;
    margin-top: 1rem;
    font-size: 1.8rem;
}

.section-title, .fluxo-title, .grid h2, .link-contato-div h2, .card-informacoes h2{
    line-height: 1.1;
}

.slider-card, .team-card, .card-sobre, .faq-item, .contact-form, .card-informacoes, .div-card-sobre, .section-fogo, .funcionalidade-card, .link-contato-div{
    border-radius: 1.2rem;
}

.slider-card, .team-card, .card-sobre, .faq-item, .contact-form, .card-informacoes, .div-card-sobre, .section-fogo, .link-contato-div{
    box-shadow: var(--shadow-card);
}

.team-card, .card-sobre, .faq-item, .contact-form, .card-informacoes, .slider-card{
    padding: 2.4rem;
}

.button, .section-um-button, .button-hero, .link-contato-div a{
    border-radius: 999px;
    cursor: pointer;
}

.button, .section-um-button, .link-contato-div a, .slider-button, .slider-dot{
    transition: 0.3s ease;
}

.button:hover, .section-um-button:hover, .link-contato-div a:hover{
    transform: translateY(-0.2rem);
}

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
    outline: 0.3rem solid var(--color-amarelo);
    outline-offset: 0.3rem;
}

@media (max-width: 767px){
    .section:not(.section-cards),
    .fluxo-section,
    .funcionalidades-slider,
    .section-squares{
        padding: 5rem 0;
    }

    .page-title{
        padding: 5.2rem 0;
    }

    .page-text{
        font-size: 1.6rem;
    }

    .footer-acessibilidade{
        padding: 0 2rem;
        white-space: normal;
    }

}

@media (max-width: 480px){
    .page-heading{
        font-size: 3.2rem;
    }

    .section-title,
    .fluxo-title{
        font-size: 2.8rem;
    }

}