body { font-family: 'Source Sans 3', sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: 'Lexend', sans-serif; }
html { scroll-behavior: smooth; }

.nav-bar {
    background: rgba(12, 27, 42, 0.85);
    backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid rgba(255,255,255,0.05);
}
.nav-bar.scrolled {
    background: rgba(7, 17, 28, 0.95);
    box-shadow: 0 4px 30px rgba(0,0,0,0.3);
}

.hero-dots {
    background-image: radial-gradient(circle, rgba(255,255,255,0.15) 1px, transparent 1px);
    background-size: 24px 24px;
}

@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}
.fade-in-up { opacity: 0; animation: fadeInUp 0.8s ease-out forwards; }

.reveal {
    opacity: 0; transform: translateY(24px);
    transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.reveal.visible { opacity: 1; transform: translateY(0); }

@keyframes ctaPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(212, 116, 44, 0.4); }
    50% { box-shadow: 0 0 0 8px rgba(212, 116, 44, 0); }
}
.cta-pulse { animation: ctaPulse 2.5s ease-in-out infinite; }

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #07111C; }
::-webkit-scrollbar-thumb { background: #132D47; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #D4742C; }
::selection { background: rgba(212, 116, 44, 0.3); color: white; }
