/* Background Image */
.hero-bg {
    background: url('../../images/track/track.jpg') center/cover no-repeat;
    transform: scale(1.1);
    filter: brightness(0.8);
}

/* Dark gradient overlay */
.hero-overlay {
    background: radial-gradient(circle at 50% 40%, rgba(39, 39, 39, 0.87), rgba(0, 0, 0, 0.9));
}

/* Animated grid (tech feel) */
.hero-grid {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 80px 80px;
    animation: gridMove 20s linear infinite;
}

@keyframes gridMove {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(80px);
    }
}

/* Gradient text */
.gradient-text {
    /* background: linear-gradient(90deg, #00f5ff, #00aaff, #4f46e5); */
    background: linear-gradient(90deg, #2563eb, #60a5fa);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Buttons */
.cta-primary {
    padding: 14px 32px;
    border-radius: 999px;
    background: linear-gradient(90deg, #00d4ff, #4f46e5);
    font-weight: 600;
    position: relative;
    overflow: hidden;
    transition: 0.4s;
}

.cta-primary:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 10px 30px rgba(0, 200, 255, 0.4);
}

.cta-outline {
    padding: 14px 32px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(10px);
    transition: 0.4s;
}

.cta-outline:hover {
    background: rgba(255, 255, 255, 0.1);
    transform: translateY(-3px);
}