html {
    scroll-behavior: smooth;
}

.material-symbols-outlined {
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

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

.glass-card-hover:hover {
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(0, 219, 233, 0.3);
box-shadow: 0 0 20px rgba(0, 219, 233, 0.1);
}

.glow-cyan {
box-shadow: 0 0 30px rgba(0, 219, 233, 0.15);
}

.gradient-text {
background: linear-gradient(135deg, #00f0ff 0%, #cf5cff 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.gradient-button {
background: linear-gradient(135deg, #00f0ff 0%, #cf5cff 100%);
}

body {
background-color: #101415;
background-image:
radial-gradient(circle at 10% 20%, rgba(72, 0, 99, 0.15) 0%, transparent 40%),
radial-gradient(circle at 90% 80%, rgba(0, 105, 112, 0.15) 0%, transparent 40%);
}

.grid-dots {
background-image: radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 0);
background-size: 32px 32px;
}