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

body {
    font-family: 'Outfit', sans-serif;
    /* Running track background */
    background-color: #ba4034; /* Terracotta red base */
    background-image: repeating-linear-gradient(
        90deg,
        transparent,
        transparent calc(25% - 4px),
        rgba(255, 255, 255, 0.6) calc(25% - 4px),
        rgba(255, 255, 255, 0.6) 25%
    );
    background-attachment: fixed;
    color: #0f172a;
    overflow-x: hidden;
}

/* Floating scoreboard/card */
.light-card {
    background: #ffffff;
    border: 3px solid #0f172a;
    border-radius: 16px;
    box-shadow: 10px 10px 0px rgba(0, 0, 0, 0.2); /* Brutalist/Playful shadow */
}

/* Animations */
.fade-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-up.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Gradient text */
.text-gradient {
    background: linear-gradient(135deg, #f97316, #ef4444); /* orange-500 to red-500 */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

/* Sublte hover lifts with dynamic skewing */
.hover-lift {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.hover-lift:hover {
    transform: translateY(-8px) skewX(-2deg);
    box-shadow: 15px 15px 0px rgba(0, 0, 0, 0.25);
}

/* Custom horizontal scroll bar hide */
.hide-scrollbar::-webkit-scrollbar {
    display: none;
}
.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
