/* Adicionando estilos para animações e melhorias de responsividade no tema escuro */
.animate {
    animation: fadeInUp 0.6s ease forwards;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Ajustes para imagens reais */
.hero {
    background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url('../assets/gallery/1000064596.jpg');
    background-size: cover;
    background-position: center;
}

.final-cta {
    background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url('../assets/gallery/1000064591.jpg');
    background-size: cover;
    background-position: center;
}

.problem-solution .image-content img {
    border-radius: 5px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}

/* Melhorias para mobile */
@media (max-width: 576px) {
    .hero {
        padding: 4rem 0;
    }
    
    .logo-image {
        max-width: 200px;
    }
    
    .headline {
        font-size: 1.5rem;
    }
    
    .plans-container .plan {
        margin-bottom: 2rem;
    }
    
    .plan h3 {
        height: auto;
        min-height: 80px;
    }
    
    .benefits-container .benefit {
        margin-bottom: 1.5rem;
    }
    
    .steps .step {
        margin-bottom: 1.5rem;
    }
    
    .faq-question h3 {
        font-size: 1rem;
    }
    
    .carousel-control {
        width: 30px;
        height: 30px;
        font-size: 1rem;
    }
}

/* Ajustes para tablets */
@media (min-width: 577px) and (max-width: 768px) {
    .plan h3 {
        height: auto;
        min-height: 100px;
    }
    
    .benefits-container {
        justify-content: space-around;
    }
    
    .benefit {
        flex: 0 0 45%;
        margin-bottom: 2rem;
    }
    
    .carousel-item img, 
    .carousel-item video {
        height: 300px;
        object-fit: cover;
    }
}

/* Ajustes para toque em dispositivos móveis */
@media (hover: none) {
    .cta-button, .plan-cta, .scheduling-button, .modal-button {
        padding: 15px 25px;
    }
    
    .faq-question {
        padding: 1.2rem;
    }
}

/* Melhorias de acessibilidade */
.cta-button:focus, .plan-cta:focus, 
.faq-question:focus, .social-icons a:focus,
.scheduling-button:focus, .modal-button:focus,
.carousel-control:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

/* Otimização para carregamento de página */
.lazy-load {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.lazy-load.loaded {
    opacity: 1;
}

/* Estilos específicos para o carrossel de vídeos */
.video-carousel .carousel-item {
    height: 400px;
}

.video-carousel video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Estilos específicos para o carrossel de imagens */
.gallery-carousel .carousel-item img {
    height: 400px;
    object-fit: cover;
}

/* Estilos para o botão de agendamento principal */
.schedule-now-button {
    background-color: var(--accent-color);
    color: #000;
    padding: 15px 30px;
    border-radius: var(--border-radius);
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: var(--transition);
    border: 2px solid var(--accent-color);
    display: inline-block;
    margin: 2rem auto;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

.schedule-now-button:hover {
    background-color: transparent;
    color: var(--accent-color);
    transform: translateY(-3px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.4);
}

/* Estilos para os badges dos planos */
.plan-badge {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--accent-color);
    color: #000;
    padding: 5px 15px;
    font-size: 0.8rem;
    font-weight: 700;
    border-radius: var(--border-radius);
    white-space: nowrap;
}
