/* ==========================================================================
   MINDQUAD 2050 | AI-DRIVEN ENTERPRISE STYLESHEET
   ========================================================================== */

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

body {
    background-color: #030712; 
    color: #f8fafc;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .font-display {
    font-family: 'Space Grotesk', sans-serif;
    letter-spacing: -0.02em;
}

.body-font { font-family: 'Outfit', sans-serif; }
.tech-mono { font-family: 'JetBrains Mono', monospace; }

.micro-heading {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #00e5ff; /* Neon Cyan */
}

/* 2050 Holographic Background Grid */
.bg-grid-cyber {
    position: fixed;
    inset: 0;
    z-index: -5;
    background-size: 40px 40px;
    background-image: 
        linear-gradient(to right, rgba(0, 229, 255, 0.03) 1px, transparent 1px), 
        linear-gradient(to bottom, rgba(0, 229, 255, 0.03) 1px, transparent 1px);
    mask-image: radial-gradient(circle at 50% 0%, black 10%, transparent 80%);
    -webkit-mask-image: radial-gradient(circle at 50% 0%, black 10%, transparent 80%);
}

/* Glassmorphism Architecture */
.glass-panel {
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 20px 40px -10px rgba(0,0,0,0.5);
}

/* Glowing Cyber CTA Buttons */
.btn-cyber {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.btn-cyber::before {
    content: '';
    position: absolute;
    inset: -2px;
    background: linear-gradient(90deg, #00A4EF, #00e5ff, #00A4EF);
    background-size: 200% 200%;
    animation: borderGlow 3s linear infinite;
    z-index: -1;
    filter: blur(6px);
    opacity: 0.6;
    transition: opacity 0.3s ease;
}
.btn-cyber:hover::before { opacity: 1; filter: blur(10px); }

@keyframes borderGlow {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

/* 2050 Scrollbar */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: #030712; }
::-webkit-scrollbar-thumb { background: rgba(0, 229, 255, 0.3); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #00e5ff; box-shadow: 0 0 10px #00e5ff; }

/* Animated nav underline */
.nav-item::after {
    content: ''; position: absolute; bottom: -6px; left: 0; width: 0; height: 2px;
    background: #00e5ff; transition: width 0.3s ease;
    box-shadow: 0 0 8px #00e5ff;
}
.nav-item:hover::after { width: 100%; }