@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

:root { --primary: #00d4ff; --accent: #facc15; }

* { transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

html, body { overflow-x: hidden; }
body { font-family: 'Inter', system_ui, sans-serif; }

.heading-font { font-family: 'Space Grotesk', sans-serif; }

.hero-bg {
    background: linear-gradient(135deg, #0a1729 0%, #1e3a5f 60%, #00d4ff 100%);
    position: relative;
}
.hero-bg::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 40% 30%, rgba(250, 204, 21, 0.15), transparent 60%);
    pointer-events: none;
}

.glass {
    background: rgba(255,255,255,0.15);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.3);
}

.service-card {
    background: white;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.05);
}
.service-card:hover {
    transform: translateY(-12px) scale(1.04);
    box-shadow: 0 30px 40px -15px rgb(0 212 255 / 0.3);
}

.live-ticker { animation: ticker 40s linear infinite; }
@keyframes ticker { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

.neon { text-shadow: 0 0 25px #00d4ff, 0 0 40px #facc15; }
.glow { box-shadow: 0 0 35px rgba(0, 212, 255, 0.5); }