@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;800;900&family=Share+Tech+Mono&family=Vazirmatn:wght@300;400;600;700;800&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    --cyan-glow: rgba(6, 182, 212, 0.4);
    --yellow-glow: rgba(234, 179, 8, 0.3);
}

body {
    font-family: 'Inter', 'Vazirmatn', sans-serif;
    background-color: #030712;
    color: #f3f4f6;
    overflow-x: hidden;
}

.font-mono {
    font-family: 'Share Tech Mono', monospace;
}

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

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: #030712;
}
::-webkit-scrollbar-thumb {
    background: #1f2937;
    border-radius: 4px;
    border: 1px solid #374151;
}
::-webkit-scrollbar-thumb:hover {
    background: #06b6d4;
}

/* Glowing Neon Borders */
.neon-border-cyan {
    box-shadow: 0 0 15px var(--cyan-glow), inset 0 0 15px rgba(6, 182, 212, 0.05);
}

.neon-border-yellow {
    box-shadow: 0 0 15px var(--yellow-glow);
}

/* Glassmorphism Panels */
.glass-panel {
    background: rgba(17, 24, 39, 0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(75, 85, 99, 0.3);
}

/* Grid background pattern */
.cyber-grid {
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
                      linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 40px 40px;
}

model-viewer {
    --progress-bar-color: #06b6d4;
    --progress-bar-height: 3px;
}