/* Importação dos estilos modularizados */
@import 'variables.css';
@import 'reset.css';
@import 'fonts.css';

/* Animações */
@import 'components/animations.css';

/* Componentes */
@import 'components/header.css';
@import 'components/bio.css';
@import 'components/beneficios.css';
@import 'components/testimonials.css';
@import 'components/video-carousel.css';
@import 'components/carousel.css';
@import 'components/features.css';
@import 'components/faq.css';
@import 'components/contato.css';
@import 'components/guarantee.css';
@import 'components/footer.css';
@import 'components/pain-points.css';
@import 'components/modules.css';

/* Utilitários */
.container {
    max-width: var(--max-width);
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
}

section {
    position: relative;
    width: 100%;
}

/* Container para seções escuras */
.dark-sections-container {
    background: var(--dark-gradient);
    position: relative;
    padding: 0;
    margin: 0;
    display: block;
}

.dark-sections-container>section {
    position: relative;
    z-index: 2;
    padding: 60px 0;
}

.dark-sections-container>section.features {
    padding-top: 80px;
}

.dark-sections-container>section.testimonials {
    padding: 80px 0;
}

/* Responsividade */
@media (max-width: 768px) {
    .container {
        padding: 0 15px;
    }

    .dark-sections-container>section {
        padding: 40px 0;
    }

    .dark-sections-container>section.features,
    .dark-sections-container>section.testimonials {
        padding: 60px 0;
    }
}

@media (max-width: 480px) {
    .container {
        padding: 0 10px;
    }

    .dark-sections-container>section {
        padding: 30px 0;
    }

    .dark-sections-container>section.features,
    .dark-sections-container>section.testimonials {
        padding: 50px 0;
    }
}