/* ==========================================
   HATI HATI FOGOS DE ARTIFÍCIO - STYLE.CSS
   ========================================== */

/* Configurações Globais e Suavização */
* {
    box-sizing: border-box;
    scroll-behavior: smooth;
}

body {
    background-color: #0b0b0f;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    overflow-x: hidden;
}

/* Estilização da Barra de Rolagem (Scrollbar Customizada) */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #0b0b0f;
}

::-webkit-scrollbar-thumb {
    background: #2a2a35;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #ff1744;
}

/* Efeitos de Brilho e Glow personalizados */
.glow-gold {
    text-shadow: 0 0 20px rgba(255, 215, 0, 0.4);
}

.glow-red {
    text-shadow: 0 0 20px rgba(255, 23, 68, 0.4);
}

/* Animações suaves para os Cards ao carregar */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

section {
    animation: fadeIn 0.8s ease-out forwards;
}

/* Efeito de Vidro (Glassmorphism Avançado) */
.glass-panel {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.glass-panel:hover {
    border-color: rgba(255, 215, 0, 0.3);
}

/* Ajustes de Vídeo Hero */
video {
    object-fit: cover;
    pointer-events: none;
}