/* html/site/css/style.css */
html { scroll-behavior: smooth; }

.hero-pattern {
    background-color: #ffffff;
    background-image: radial-gradient(#1a2a6c0a 2px, transparent 2px);
    background-size: 40px 40px;
}

.glass-nav {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.carousel-item-image {
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
    z-index: 0;
    pointer-events: none;
 }
 
.carousel-item-image.active {
    opacity: 1;
    z-index: 1;
    pointer-events: auto;
}

/* Efeito Ken Burns (Zoom suave na imagem) */
.carousel-item-image img {
   transform: scale(1.1);
   transition: transform 8s ease-out;
   will-change: transform;
}

.carousel-item-image.active img {
   transform: scale(1);
 }

 .carousel-content {
    display: none;
    opacity: 0;
    transition: opacity 0.8s ease-in-out;
}

.carousel-content.active {
    display: flex;
    opacity: 1;
    animation: fadeInCarouselContent 0.8s ease-out forwards;
}

@keyframes fadeInCarouselContent {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Animations e Scrollbars */
@keyframes slideInLeft {
    from { opacity: 0; transform: translateX(-10px); }
    to { opacity: 1; transform: translateX(0); }
}

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

.chat-bubble-in { animation: slideInLeft 0.3s ease-out forwards; }

/* Efeitos escalonados para elementos do carrossel */
.carousel-content.active span {
    animation: fadeInUp 0.6s ease-out forwards;
    animation-delay: 0.1s;
}

.carousel-content.active h1,
.carousel-content.active h2 {
    animation: fadeInUp 0.8s ease-out forwards;
    animation-delay: 0.3s;
}

.carousel-content.active p {
    animation: fadeInUp 0.8s ease-out forwards;
    animation-delay: 0.5s;
}

#chat-box::-webkit-scrollbar { width: 4px; }
#chat-box::-webkit-scrollbar-thumb { background: #e2e8f0; border-radius: 10px; }

 /* Estilos do Menu Mobile Corrigidos */
#mobile-menu-overlay {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: all 0.3s ease;
    position: fixed;
    inset: 0;
    z-index: 60;
}

#mobile-menu-overlay.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

#mobile-menu-drawer {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: 280px;
    background: white;
    z-index: 70;
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out;
    box-shadow: -4px 0 6px rgba(0, 0, 0, 0.1);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

#mobile-menu-drawer.active {
    transform: translateX(0);
}

/* Garantir que o menu mobile não apareça em telas grandes */
@media (min-width: 1024px) {
    #mobile-menu-overlay {
        display: none !important;
    }
    #mobile-menu-drawer {
        display: none !important;
    }
}

        /* Estilos do Modal de Ministérios */
        #ministry-modal-overlay.active {
            opacity: 1;
            pointer-events: auto;
        }
        #ministry-modal {
            transition: all 0.25s ease;
        }
        #ministry-modal.active {
            opacity: 1;
            transform: translate(-50%, -50%) scale(1);
            pointer-events: auto;
        }