:root {
            --valk-pink: #FF0059;
            --valk-pink-dark: #A10038;
            --valk-black: #0a0a0a;
            --valk-light-gray: #D9D9D9;
            --valk-white: #FFFFFF;
        }

        body {
            font-family: 'Roboto', sans-serif;
            background-color: var(--valk-black);
            color: var(--valk-light-gray);
            scroll-behavior: smooth;
        }

        h1, h2, h3, .font-heading {
            font-family: 'Exo 2', sans-serif;
            font-weight: 800;
            text-transform: uppercase;
        }
        
        .btn {
            display: inline-block;
            padding: 0.75rem 2rem;
            font-family: 'Exo 2', sans-serif;
            font-weight: 700;
            text-transform: uppercase;
            border-radius: 0.5rem;
            transition: all 0.3s ease;
            text-align: center;
        }

        .btn-primary {
            background-color: var(--valk-pink);
            color: var(--valk-white);
            border: 2px solid var(--valk-pink);
        }

        .btn-primary:hover {
            background-color: var(--valk-pink-dark);
            border-color: var(--valk-pink-dark);
            transform: translateY(-3px);
            box-shadow: 0 4px 15px rgba(255, 0, 89, 0.3);
        }
        
        .btn-secondary {
            background-color: transparent;
            color: var(--valk-white);
            border: 2px solid var(--valk-pink);
        }

        .btn-secondary:hover {
            background-color: var(--valk-pink);
            color: var(--valk-white);
             transform: translateY(-3px);
        }
        
        /* Estilos para la nueva sección de Eventos */
        .event-featured-card {
            position: relative;
            border-radius: 1rem;
            overflow: hidden;
            border: 1px solid #333;
            background-color: #0d0d0d;
            transition: border-color 0.3s ease;
        }
        .event-featured-card:hover {
            border-color: var(--valk-pink);
        }

        .game-tag {
            background: rgba(0, 0, 0, 0.7);
            border: 1px solid var(--valk-pink);
            padding: 4px 12px;
            border-radius: 20px;
            font-size: 0.75rem;
            font-weight: 700;
            color: white;
            text-transform: uppercase;
        }

        .tier-card {
            transition: all 0.3s ease;
            border: 1px solid #333;
            background-color: #0d0d0d;
        }
        .tier-card:hover {
            transform: translateY(-5px);
            border-color: var(--valk-pink);
        }

        .tier-highlight {
            border: 2px solid var(--valk-pink);
            position: relative;
        }
        .tier-highlight::before {
            content: 'RECOMENDADO';
            position: absolute;
            top: -12px;
            left: 50%;
            transform: translateX(-50%);
            background: var(--valk-pink);
            color: white;
            padding: 2px 12px;
            font-size: 10px;
            font-weight: 800;
            border-radius: 4px;
        }