/* ==========================================================
   CONFIGURACIÓN DE MARCA Y VARIABLES
   ========================================================== */
:root {
    --azul-elite: #000638;
    --verde-elite: #00ff34;
    --azul-claro: #0099ff;
    --rojo-elite: #e30316;
    --negro-profundo: #050505;
}

/* --- ESTILOS GENERALES Y ADMIN --- */
.logo_admin img { width: 100%; padding-top: 5px; margin: auto; }
.app-sidebar__user-avatar { padding: 5px; background: #fff; }
.app-header { background-color: var(--azul-elite) !important; }
.headerRegister, .header-primary { background: #009688; color: #fff; }
.headerUpdate { background: #007bff; color: #fff; }

/* --- HEADER Y NAVEGACIÓN --- */
.top-bar, .wrap-menu-desktop, .wrap-header-mobile {
    background-color: var(--azul-elite) !important;
}
.wrap-menu-desktop { border-bottom: 3px solid var(--verde-elite) !important; }

.main-menu > li > a {
    color: #ffffff !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    font-size: 13px;
    transition: all 0.3s;
}
.main-menu > li:hover > a { color: var(--verde-elite) !important; }

.sub-menu, .menu-mobile, .main-menu-m {
    background-color: #000a4d !important;
    border-top: 2px solid var(--verde-elite);
}
.sub-menu li a, .main-menu-m li a { color: #ffffff !important; }

/* --- CARDS DE ASOCIACIÓN (LAS PEQUEÑAS CON MOVIMIENTO) --- */
.card {
    background-color: var(--azul-elite) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 15px !important;
    overflow: hidden;
    transition: all 0.4s ease-in-out !important;
}

.card:hover {
    transform: translateY(-10px);
    border-color: var(--verde-elite) !important;
    box-shadow: 0px 10px 30px rgba(0, 255, 52, 0.2) !important;
}

.card-text { 
    color: #ffffff !important; 
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* --- BOTÓN "CUATRO" --- */
.boton.cuatro {
    background-color: transparent !important;
    border: 2px solid var(--verde-elite) !important;
    border-radius: 30px !important;
    min-width: 180px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.4s ease !important;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    margin: 0 auto;
}

.boton.cuatro a {
    color: var(--verde-elite) !important;
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none !important;
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    z-index: 5;
}

.boton.cuatro:hover {
    background-color: var(--verde-elite) !important;
    box-shadow: 0px 0px 15px rgba(0, 255, 52, 0.5);
}

html body .boton.cuatro:hover a { color: #ffffff !important; }

/* --- SECCIÓN COMPETICIONES ACTUALES (ESTILO ELITE) --- */
.bg-elite-dark-section {
    background-color: var(--negro-profundo);
    padding: 80px 0;
}

.card-competiciones {
    background-color: var(--azul-elite);
    padding: 40px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
}

.color-blanco { color: #ffffff !important; }
.texto-verde-bold { color: var(--verde-elite); font-weight: 800; text-transform: uppercase; }

.categoria-item {
    display: flex; align-items: center;
    padding: 18px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease;
}

.categoria-item:last-child { border-bottom: none; }
.categoria-item:hover { padding-left: 10px; }
.categoria-item:hover .categoria-link strong { color: var(--verde-elite) !important; }

/* Badges de Categoría */
.badge-elite {
    width: 50px; height: 50px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 900; font-family: 'Oswald', sans-serif; color: #000;
}
.bg-verde-elite { background-color: var(--verde-elite); box-shadow: 0 0 15px rgba(0, 255, 52, 0.3); }
.bg-amarillo-elite { background-color: #ffc107; }
.bg-cian-elite { background-color: #17a2b8; }
.bg-azul-elite-light { background-color: #007bff; }

/* --- IMAGEN LATERAL Y EFECTOS --- */
.wrap-pic-elite {
    position: relative; border-radius: 20px; overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6);
    transition: all 0.5s ease;
}

.wrap-pic-elite::after {
    content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    border: 2px solid var(--verde-elite); border-radius: 20px;
    opacity: 0; transition: all 0.5s ease; pointer-events: none;
    box-shadow: inset 0 0 20px rgba(0, 255, 52, 0.2); z-index: 3;
}

.wrap-pic-elite:hover::after { opacity: 1; }

.wrap-pic-elite img {
    width: 100%; transition: transform 0.8s cubic-bezier(0.15, 0.83, 0.66, 1);
    filter: brightness(0.8) contrast(1.1);
}

.wrap-pic-elite:hover img { transform: scale(1.08); filter: brightness(1); }

/* --- SLIDER Y TEXTOS ÉLITE --- */
.texto-elite {
    color: var(--verde-elite) !important;
    font-family: 'Oswald', sans-serif !important;
    text-transform: uppercase;
    font-weight: 900 !important;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8) !important;
}

.ltext-202.txt-center { display: block !important; width: 100% !important; text-align: center !important; }

/* --- DOT-LIVE (PUNTO ROJO) --- */
.dot-live {
    height: 10px; width: 10px; background-color: var(--rojo-elite);
    border-radius: 50%; display: inline-block; margin-right: 8px;
    position: relative; vertical-align: middle;
}
.dot-live::after {
    content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background-color: var(--rojo-elite); border-radius: 50%;
    animation: pulse-live 1.5s infinite ease-in-out;
}

@keyframes pulse-live {
    0% { transform: scale(1); opacity: 1; }
    100% { transform: scale(3); opacity: 0; }
}

/* --- RESPONSIVE GENERAL --- */
@media (max-width: 991px) {
    .wrap-header-mobile, .topbar-mobile {
        background-color: var(--azul-elite) !important;
        border-bottom: 2px solid var(--verde-elite) !important;
    }
    .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { background-color: #ffffff !important; }
    .texto-elite { font-size: 35px !important; }
    .card { margin-bottom: 25px; }
    .card-competiciones { padding: 25px; }
}

/* --- SECCIÓN CLUBS ASOCIADOS (VERSIÓN AMPLIA) --- */

.color-azul-elite { color: var(--azul-elite) !important; }
.color-gris-oscuro { color: #555 !important; line-height: 1.8; }
.op-08 { opacity: 0.8; }

/* La imagen de amplitud con un toque de calidad */
.img-club-wide {
    width: 100%;
    max-height: 450px; /* Evita que sea excesivamente alta en pantallas gigantes */
    object-fit: cover;
    border-radius: 15px;
}

.block1-elite {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    background-color: #000; /* Fondo base para que el texto resalte */
}

/* Efecto de oscurecimiento suave sobre la imagen para que el texto se lea */
.block1-elite::before {
    content: "";
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to right, rgba(0, 6, 56, 0.8), transparent);
    z-index: 1;
}

.block1-txt { z-index: 2; }

/* Botón "Ver Club" dentro de la imagen */
.btn-link-elite {
    color: #fff;
    font-weight: 700;
    border-bottom: 2px solid var(--verde-elite);
    padding-bottom: 5px;
    transition: 0.3s;
}

.block1-elite:hover .btn-link-elite {
    color: var(--verde-elite);
}

/* Botón de Dribbli: Moderno y Limpio */
.btn-dribbli-club {
    display: inline-flex;
    align-items: center;
    background-color: #f8f9fa;
    border: 1px solid #ddd;
    color: var(--azul-elite) !important;
    padding: 12px 25px;
    border-radius: 50px;
    text-decoration: none !important;
    font-size: 15px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}

.btn-dribbli-club:hover {
    background-color: #fff;
    border-color: var(--verde-elite);
    transform: translateY(-3px);
    box-shadow: 0 8px 15px rgba(0,0,0,0.1);
}

@media (max-width: 991px) {
    .img-club-wide { max-height: 300px; }
    .btn-dribbli-club { font-size: 13px; width: 100%; justify-content: center; }
}

/* --- AJUSTE RESPONSIVE: NOMBRES DE CLUB --- */

/* Tamaño estándar para PC */
.block1-name.ltext-102 {
    font-size: 40px; /* O el tamaño que tengas por defecto en la plantilla */
    line-height: 1.2;
    font-weight: 800;
}

/* Ajuste específico para tablets y móviles */
@media (max-width: 991px) {
    .block1-name.ltext-102 {
        font-size: 28px !important; /* Un tamaño más manejable para pantallas pequeñas */
        line-height: 1.1;
    }
}

/* Ajuste extremo para teléfonos pequeños (iPhone SE, etc) */
@media (max-width: 575px) {
    .block1-name.ltext-102 {
        font-size: 22px !important;
        padding-bottom: 4px !important;
    }
    
    .block1-txt-child2.stext-102 {
        font-size: 13px !important; /* Reducimos también un poco la descripción */
    }
}

/* --- NUEVA COMBINACIÓN ELITE: AZUL + ACENTO VERDE --- */
@media (max-width: 991px) {
    
    /* Fondo principal: Tu azul oscuro institucional */
    .menu-mobile, 
    .main-menu-m,
    .container-menu-mobile {
        background-color: var(--azul-elite) !important;
    }

    /* Cada item de la lista */
    .main-menu-m li {
        background-color: transparent !important;
        /* Una línea divisoria muy sutil para no ensuciar */
        border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
        transition: all 0.3s ease;
        border-left: 0px solid var(--verde-elite); /* Preparado para el hover */
    }

    /* Estilo del texto */
    .main-menu-m li a {
        color: #ffffff !important;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        padding: 15px 25px !important;
        transition: all 0.3s ease;
    }

    /* --- EFECTO HOVER MÓVIL (Interactivo) --- */
    .main-menu-m li:hover,
    .main-menu-m li:active {
        /* Degradado que nace del azul claro hacia tu azul oscuro */
        background: linear-gradient(90deg, rgba(0, 153, 255, 0.15) 0%, transparent 100%) !important;
        /* El borde de acento en verde fosforescente */
        border-left: 5px solid var(--verde-elite) !important;
    }

    .main-menu-m li:hover a {
        color: var(--verde-elite) !important;
        padding-left: 35px !important; /* Desplazamiento elegante */
    }

    /* Flechas de expansión */
    .arrow-main-menu-m {
        color: #ffffff !important;
        transition: all 0.3s ease;
    }
    
    .main-menu-m li:hover .arrow-main-menu-m {
        color: var(--verde-elite) !important;
        transform: rotate(90deg); /* Si la flecha es hacia abajo, le da dinamismo */
    }

    /* Submenús internos (si existen) */
    .sub-menu-m {
        background-color: rgba(0, 0, 0, 0.2) !important; /* Un tono más oscuro para dar profundidad */
    }
}

/* --- SECCIÓN ESTADÍSTICAS --- */
.section-estadisticas {
    background-color: #0b0d17; /* Un gris casi negro muy elegante */
    color: #fff;
}

.texto-elite-title {
    font-family: 'Oswald', sans-serif;
    font-size: 45px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 2px;
}

.dot-verde {
    height: 12px; width: 12px;
    background-color: var(--verde-elite);
    display: inline-block;
    border-radius: 50%;
    margin-left: 5px;
}

.color-gris-claro { color: #adb5bd; }
.color-verde { color: var(--verde-elite); }

/* --- GRID DE ESTADÍSTICAS --- */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 30px;
    margin-top: 20px;
}

.stat-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    text-decoration: none !important;
}

.stat-card:hover {
    transform: translateY(-12px);
    border-color: var(--verde-elite);
    background: rgba(255, 255, 255, 0.07);
    box-shadow: 0 20px 40px rgba(0,0,0,0.4);
}

/* Contenedor de Imagen */
.stat-img-wrap {
    position: relative;
    height: 200px;
    background: linear-gradient(to bottom, transparent, var(--azul-elite));
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-img-wrap img {
    height: 80%;
    transition: all 0.5s ease;
}

.stat-card:hover .stat-img-wrap img {
    transform: scale(1.1) rotate(3deg);
}

/* Icono Flotante */
.stat-icon {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 45px;
    height: 45px;
    background: var(--verde-elite);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-size: 20px;
    opacity: 0;
    transform: translateX(20px);
    transition: all 0.4s ease;
}

.stat-card:hover .stat-icon {
    opacity: 1;
    transform: translateX(0);
}

/* Info de la Tarjeta */
.stat-info {
    padding: 20px;
    text-align: center;
}

.stat-info h4 {
    font-family: 'Oswald', sans-serif;
    color: #fff;
    font-size: 22px;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.stat-link {
    color: var(--verde-elite);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    opacity: 0.7;
    transition: 0.3s;
}

.stat-card:hover .stat-link {
    opacity: 1;
    letter-spacing: 1px;
}
/* --- TRATAMIENTO PARA EL SVG EN FONDO OSCURO --- */
.svg-container-elite img {
    width: 100%;
    max-width: 350px;
    /* FILTRO MÁGICO: 
       invert(1) convierte negros en blancos.
       sepia(1) + saturate + hue-rotate lo tiñe de tu verde marca */
    filter: invert(1) brightness(1.2) drop-shadow(0px 0px 15px rgba(0, 255, 52, 0.4));
    transition: all 0.5s ease;
}

.svg-container-elite:hover img {
    transform: scale(1.05) rotate(-2deg);
    filter: invert(1) brightness(1.5) drop-shadow(0px 0px 25px rgba(0, 255, 52, 0.6));
}

/* --- REFUERZO DEL FONDO OSCURO (Si no lo habías puesto) --- */
.section-estadisticas {
    background-color: var(--azul-elite) !important; /* O el #0b0d17 que usamos antes */
    position: relative;
    overflow: hidden;
}


/* --- CONFIGURACIÓN DE COLORES Y FUENTES --- */
:root {
    --verde-elite: #00ff34;
    --azul-oscuro: #000638;
    --azul-claro: #0099ff;
    --rojo-elite: #e30316;
}

.section-aliados-premium {
    background: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%);
    position: relative;
    overflow: hidden;
}

/* Títulos con Gradiente */
.sub-elite {
    color: var(--azul-claro);
    font-weight: 900;
    letter-spacing: 5px;
    font-size: 14px;
}

.titulo-moderno {
    font-size: 50px;
    font-weight: 800;
    color: var(--azul-oscuro);
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
}

.text-gradient {
    background: linear-gradient(to right, var(--azul-oscuro), var(--azul-claro));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* El Grid Moderno */
.grid-aliados-modern {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 25px;
}

/* Efecto Glassmorphism */
.glass-effect {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 24px;
    height: 220px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 10px 30px rgba(0,0,0,0.03);
}



.glass-effect:hover {
    transform: translateY(-15px) scale(1.02);
    background: #fff;
    box-shadow: 0 30px 60px rgba(0, 6, 56, 0.15);
    border-color: var(--azul-oscuro);
}

.aliado-inner img {
    max-width: 160px;
    max-height: 100px;
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.6;
    transition: 0.5s;
}

.glass-effect:hover img {
    filter: grayscale(0%);
    opacity: 1;
}

/* Overlay de Información al Hover */
.aliado-overlay {
    position: absolute;
    bottom: -100%;
    left: 0;
    width: 100%;
    padding: 20px;
    background: linear-gradient(to top, var(--azul-oscuro), transparent);
    transition: 0.4s;
    text-align: center;
}

.glass-effect:hover .aliado-overlay {
    bottom: 0;
}

.aliado-overlay span {
    color: #fff;
    display: block;
    font-weight: 700;
    margin-bottom: 5px;
}

.aliado-overlay a {
    color: var(--verde-elite);
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

/* Botón con Resplandor */
.btn-elite-glow {
    padding: 15px 35px;
    background: var(--azul-oscuro);
    color: #fff !important;
    border-radius: 50px;
    font-weight: 800;
    display: inline-block;
    box-shadow: 0 10px 20px rgba(0, 6, 56, 0.2);
    border: 2px solid transparent;
    transition: 0.4s;
}

.btn-elite-glow:hover {
    background: var(--verde-elite);
    color: #000 !important;
    box-shadow: 0 0 25px rgba(0, 255, 52, 0.5);
}

/* Glow especial para el patrocinador tecnológico (Dribbli) */
.active-glow {
    border-bottom: 5px solid var(--rojo-elite);
}



.glass-effect {
    height: 260px; /* Subimos de 220px a 250px para dar más espacio vertical */
    /* ... resto de tus estilos ... */
}

/* --- ESTILO ZONA MVP --- */
.bg-oscuro-profundo {
    background-color: #05070a; /* Un azul casi negro para que el oro resalte */
}

.titulo-mvp {
    font-size: 55px;
    font-weight: 900;
    color: #fff;
    letter-spacing: 3px;
    font-family: 'Oswald', sans-serif;
}

.gold-text {
    background: linear-gradient(to bottom, #cf9d42 0%, #ffeb99 50%, #cf9d42 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5));
}

.mvp-badge-top {
    color: #cf9d42;
    font-weight: 800;
    letter-spacing: 4px;
    font-size: 12px;
}

/* Tarjetas MVP */
.mvp-card {
    background: #0f1218;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    transition: 0.5s;
    border: 1px solid rgba(207, 157, 66, 0.2);
}

.mvp-img-container {
    height: 350px;
    position: relative;
    overflow: hidden;
}

.mvp-img-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.8s;
}

/* El Brillo Dorado al pasar el mouse */
.mvp-card:hover {
    transform: translateY(-15px);
    box-shadow: 0 20px 40px rgba(207, 157, 66, 0.15);
}

.mvp-card.gold-glow:hover {
    box-shadow: 0 0 30px rgba(207, 157, 66, 0.4);
}

.mvp-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 6, 56, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: 0.4s;
}

.mvp-card:hover .mvp-overlay {
    opacity: 1;
}

/* Botón de Acción */
.btn-mvp-action {
    background: #cf9d42;
    color: #000 !important;
    padding: 12px 20px;
    border-radius: 50px;
    font-weight: 800;
    font-size: 12px;
    text-decoration: none;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}

.mvp-info {
    padding: 25px;
    text-align: center;
}

.mvp-info h3 {
    font-size: 20px;
    font-weight: 800;
    color: #fff;
    margin-bottom: 5px;
}

.mvp-info span {
    color: #888;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Cinta de "TOP" en la esquina */
.corner-ribbon {
    position: absolute;
    top: 15px;
    right: -30px;
    background: #cf9d42;
    color: #000;
    transform: rotate(45deg);
    width: 120px;
    text-align: center;
    font-weight: 900;
    font-size: 11px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}

/* --- SECCIÓN DIRECTIVA --- */
.sub-titulo-verde {
    color: #00ff34; /* Tu Verde */
    font-weight: 800;
    letter-spacing: 3px;
    font-size: 13px;
    display: block;
    margin-bottom: 10px;
}

.border-left-elite {
    border-left: 5px solid #000638; /* Tu Azul Oscuro */
    padding-left: 20px;
}

.svg-directiva {
    max-width: 300px;
    margin-bottom: 30px;
}

/* Tarjetas CEO */
.ceo-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0,0,0,0.05);
    transition: 0.4s;
    border-bottom: 4px solid transparent;
}

.ceo-card:hover {
    transform: translateY(-10px);
    border-color: #00ff34; /* Resalte verde al hover */
    box-shadow: 0 25px 50px rgba(0,6,56,0.1);
}

.ceo-img-box {
    position: relative;
    height: 400px;
    overflow: hidden;
}

.ceo-img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ceo-social {
    position: absolute;
    top: 20px;
    right: -60px; /* Escondido por defecto */
    transition: 0.4s;
}

.ceo-card:hover .ceo-social {
    right: 20px;
}

.ceo-social a {
    width: 45px;
    height: 45px;
    background: #e30316; /* Tu Rojo */
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 20px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.ceo-info {
    padding: 25px;
    text-align: center;
    background: #fff;
}

.ceo-info h5 {
    color: #000638;
    font-weight: 800;
    font-size: 18px;
    margin-bottom: 5px;
}

.ceo-info p {
    color: #0099ff; /* Tu Azul Claro */
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
}

/* Botón Organigrama */
.organigrama-box {
    background: #f8f9fa;
    padding: 30px;
    border-radius: 15px;
}

.btn-organigrama {
    display: inline-block;
    background: #000638;
    color: #fff !important;
    padding: 15px 35px;
    border-radius: 8px;
    font-weight: 800;
    letter-spacing: 1px;
    transition: 0.3s;
    text-decoration: none;
}

.btn-organigrama:hover {
    background: #00ff34;
    color: #000638 !important;
    transform: scale(1.05);
}

.sub-titulo-rojo {
    color: #e30316; /* Tu Rojo de marca */
    font-weight: 800;
    letter-spacing: 3px;
    font-size: 13px;
    display: block;
    margin-bottom: 10px;
    text-transform: uppercase;
}

/* --- SECCIÓN CUMPLEAÑOS --- */
.bg-light-soft {
    background-color: #fcfdfe;
}

.svg-cumple {
    max-width: 220px;
    filter: drop-shadow(0 10px 15px rgba(0,0,0,0.05));
}

.titulo-festejo {
    font-size: 40px;
    font-weight: 900;
    color: #000638; /* Tu Azul Oscuro */
    text-transform: uppercase;
}

.txt-rojo {
    color: #e30316; /* Tu Rojo */
}

/* Card de Cumpleaños */
.cumple-card {
    background: #fff;
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0,6,56,0.08);
    transition: 0.4s;
    border: 1px solid #f0f0f0;
    position: relative;
}

.cumple-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 50px rgba(0,6,56,0.15);
}

.cumple-header {
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.badge-hoy {
    background: #00ff34; /* Verde Fosforecente */
    color: #000;
    font-weight: 800;
    font-size: 10px;
    padding: 3px 10px;
    border-radius: 50px;
    animation: pulse-verde 2s infinite;
}

@keyframes pulse-verde {
    0% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.1); opacity: 0.7; }
    100% { transform: scale(1); opacity: 1; }
}

.btn-ws {
    width: 35px;
    height: 35px;
    background: #25d366;
    color: #fff !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 18px;
    transition: 0.3s;
}

.btn-ws:hover {
    transform: scale(1.2) rotate(15deg);
    background: #128c7e;
}

.cumple-img-box {
    width: 140px;
    height: 140px;
    margin: 0 auto;
    border-radius: 50%;
    padding: 5px;
    border: 3px dashed #0099ff; /* Azul Claro */
}

.cumple-img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.cumple-info {
    padding: 20px;
}

.txt-festejo {
    font-size: 11px;
    font-weight: 800;
    color: #e30316;
    letter-spacing: 2px;
}

.nombre-cumple {
    color: #000638;
    font-weight: 800;
    margin-top: 5px;
}

.cumple-footer {
    background: #f8f9fa;
    padding: 15px;
    text-align: center;
}

.btn-saludar {
    font-size: 12px;
    font-weight: 800;
    color: #000638;
    text-transform: uppercase;
    text-decoration: none;
    transition: 0.3s;
}

.btn-saludar:hover {
    color: #0099ff;
}

/* --- CORRECCIÓN DISEÑO FOOTER --- */
.footer-elite-v3 {
    background-color: #000638;
    border-top: 5px solid #00ff34;
}

/* El separador de puntos y línea */
.diseno-separador {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 15px;
}

.linea-azul {
    width: 40px;
    height: 2px;
    background-color: #0099ff; /* Tu Azul Claro */
    display: inline-block;
}

.punto {
    width: 4px;
    height: 4px;
    background-color: #00ff34; /* Tu Verde */
    border-radius: 50%;
    display: inline-block;
}

/* Estilos de Redes */
.footer-social-box {
    display: flex;
    justify-content: center;
    gap: 15px;
}

.social-circle {
    width: 45px;
    height: 45px;
    background: rgba(255,255,255,0.05);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    font-size: 20px;
    transition: 0.3s;
}

.social-circle:hover {
    transform: translateY(-5px);
    background-color: #e30316; /* Rojo Élite */
}

/* Enlaces */
.footer-links-list {
    list-style: none;
    padding: 0;
}

.footer-links-list a {
    color: #b9b9b9;
    font-size: 14px;
    text-decoration: none;
    transition: 0.3s;
    line-height: 2.5;
    display: block;
}

.footer-links-list a:hover {
    color: #00ff34;
}

.badge-tech {
    background: rgba(0, 153, 255, 0.1);
    color: #0099ff;
    padding: 4px 12px;
    border-radius: 50px;
    border: 1px solid #0099ff;
    font-size: 11px;
    font-weight: 800;
}

.linea-division-footer {
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1); /* Blanco con 10% de opacidad */
    margin: 0;
    width: 100%;
}

.color-blanco {
    color: #ffffff !important;
}

.txt-verde-elite {
    color: #00ff34;
    font-weight: 700;
}

/* Ajustes para el slider */
.slider-aliados .item-aliado {
    margin: 0 15px; /* Espacio entre logos */
    outline: none;
}

/* Para que el slider no corte los efectos de sombra/brillo */
.slider-aliados .slick-list {
    padding-top: 20px;
    padding-bottom: 20px;
}

/* Aseguramos que las imágenes mantengan su proporción dentro del slider */
.item-aliado img {
    max-height: 80px;
    width: auto;
    margin: auto;
}

/* Ajuste de tamaño para los logos dentro del slider */
.slider-aliados .item-aliado img {
    max-height: 120px; /* Aumentamos de 80px a 120px */
    width: auto;
    max-width: 90%;   /* Que ocupe casi todo el ancho de la caja */
    margin: 0 auto;
    display: block;
    object-fit: contain; /* Mantiene la proporción sin deformar */
    filter: drop-shadow(0 5px 15px rgba(0,0,0,0.2)); /* Sombra para que resalten */
}

/* Espaciado interno de la caja de cristal */
.slider-aliados .aliado-inner {
    padding: 40px 20px; /* Más aire arriba y abajo para que el logo luzca */
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px; /* Asegura que todas las cajas tengan el mismo alto */
}

/* Reducimos un poco el espacio entre las cajas para que el logo tenga más área */
.slider-aliados .item-aliado {
    margin: 0 10px; 
    outline: none;
}

/* --- TOPBAR MOBILE ÉLITE --- */
.topbar-mobile {
    background-color: #000638 !important; /* Tu Azul Oscuro */
    border-bottom: 1px solid rgba(0, 153, 255, 0.3) !important; /* Línea Azul Claro sutil */
}

/* Color del texto de bienvenida */
.topbar-mobile .left-top-bar {
    color: #ffffff !important;
    font-size: 12px;
    font-weight: 600;
}

/* Estilo para los enlaces (Ir a mi cuenta / Salir) */
.topbar-mobile .right-top-bar a {
    color: #0099ff !important; /* Azul Claro */
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

/* Efecto hover para que resalte en Verde */
.topbar-mobile .right-top-bar a:hover {
    color: #00ff34 !important; /* Verde Fosforecente */
    text-decoration: none;
}

/* Ajuste del contenedor interno por si tiene fondos heredados */
.topbar-mobile li {
    background-color: transparent !important;
}

/* --- SECCIÓN MANIFIESTO --- */
.section-manifiesto {
    background: #ffffff;
}

.titulo-moderno-v2 {
    font-family: 'Poppins', sans-serif;
    font-weight: 800;
    font-size: 38px;
    color: #000638;
    line-height: 1.2;
}

.text-gradient {
    background: linear-gradient(90deg, #0099ff, #00ff34);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.p-manifiesto {
    font-size: 18px;
    line-height: 1.8;
    color: #555;
    text-align: justify;
}

/* Letra capitular */
.first-letter::first-letter {
    font-size: 50px;
    font-weight: 800;
    color: #000638;
    float: left;
    margin-right: 10px;
    line-height: 1;
}

/* Tarjetas de Pilares */
.card-pilar {
    padding: 30px;
    background: #f8f9fa;
    border-left: 5px solid #0099ff;
    border-radius: 8px;
    height: 100%;
    transition: 0.3s;
}

.card-pilar:hover {
    background: #000638;
    transform: translateY(-5px);
}

.card-pilar h4 {
    color: #000638;
    font-weight: 700;
    margin-bottom: 10px;
    transition: 0.3s;
}

.card-pilar p {
    font-size: 14px;
    color: #666;
    transition: 0.3s;
}

.card-pilar:hover h4, .card-pilar:hover p { color: #fff; }

.icon-pilar {
    font-size: 30px;
    color: #00ff34;
    margin-bottom: 15px;
}

/* Caja de Temporadas (Call to Action) */
.box-temporadas {
    background: #000638;
    padding: 30px;
    border-radius: 15px;
    border-bottom: 4px solid #00ff34;
}

.btn-temporadas {
    display: inline-block;
    padding: 12px 25px;
    background: #e30316; /* Rojo Élite */
    color: #fff !important;
    font-weight: 700;
    border-radius: 50px;
    text-decoration: none;
    transition: 0.3s;
    border: 2px solid transparent;
}

.btn-temporadas:hover {
    background: transparent;
    border-color: #00ff34;
    color: #00ff34 !important;
}

.quote-final {
    font-family: 'Georgia', serif;
    font-style: italic;
    font-size: 22px;
    color: #ffffff;
}
.quote-final {
    font-family: 'Georgia', serif;
    font-style: italic;
    font-size: 24px; /* Lo subí un pelín para que tenga más peso */
    color: #ffffff;  /* Tu Azul Oscuro */
    font-weight: 700;
    display: block;
}

/* Colores y Tipografía */
.color-azul-elite {
    color: #000638 !important;
}

.txt-azul-claro {
    color: #0099ff;
}

.color-gris-oscuro {
    color: #555;
    line-height: 1.8;
}

.max-w-800 {
    max-width: 850px;
}

/* Badge superior */
.sub-elite-mini {
    color: #0099ff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    display: block;
    margin-bottom: 10px;
}

/* Separador con tu Verde Fosforescente */
.linea-verde-elite {
    width: 50px;
    height: 2px;
    background-color: #00ff34; /* Verde Fosforecente */
    display: inline-block;
}

.txt-verde-glow {
    color: #00ff34;
    font-weight: 700;
    text-shadow: 0 0 5px rgba(0, 255, 52, 0.2);
}

.text-ecosistema {
    font-size: 19px !important;
    font-family: 'Poppins', sans-serif;
}

/* Reutilizando los puntos que ya tienes */
.punto-mini {
    width: 4px;
    height: 4px;
    background-color: #0099ff; /* Azul Claro */
    border-radius: 50%;
    display: inline-block;
}

/* Ajustes para Vista Celular */
@media (max-width: 767px) {
    /* Reducimos los paddings excesivos de la sección */
    .section-manifiesto {
        padding-top: 60px !important;
        padding-bottom: 40px !important;
    }

    /* Ajustamos el tamaño del título principal */
    .titulo-moderno-v2 {
        font-size: 28px !important;
        line-height: 1.2;
    }

    /* El texto del manifiesto un poco más legible en pantallas pequeñas */
    .p-manifiesto {
        font-size: 16px !important;
        text-align: left !important; /* Mejor legibilidad */
        padding: 0 10px;
    }
    
    .p-manifiesto.text-center {
        text-align: center !important; /* Mantenemos el centro solo para la frase final */
    }

    /* Ajuste de las tarjetas de Pilares */
    .card-pilar {
        margin-bottom: 15px;
        padding: 25px 20px !important;
    }

    /* El cuadro de temporadas: pasamos de fila a columna */
    .box-temporadas {
        margin-top: 30px !important;
        padding: 25px !important;
        text-align: center;
    }

    .box-temporadas .stext-114 {
        margin-bottom: 20px;
        font-size: 15px;
    }

    .btn-temporadas {
        display: block; /* Que ocupe el ancho disponible */
        width: 100%;
        padding: 12px 0;
    }
}

/*  ---------------------------------------------DESTACADOS------------------------------------*/

/* Fondo y Tipografía */
.bg-oscuro-profundo {
    background-color: #0b0d17; /* Un azul casi negro muy elegante */
}

.gold-text {
    color: #d4af37 !important; /* Dorado metálico */
}

/* Tarjetas de los destacados */
.mvp-card {
    background: #161b29;
    border-radius: 15px;
    overflow: hidden;
    transition: all 0.3s ease;
    border: 1px solid rgba(212, 175, 55, 0.1);
}

.gold-border {
    border-bottom: 3px solid #d4af37;
}

.dt-card {
    border: 2px solid #d4af37;
    box-shadow: 0 0 15px rgba(212, 175, 55, 0.3);
}

/* Badge de posición flotante sobre la foto */
.posicion-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #d4af37;
    color: #000;
    padding: 2px 8px;
    font-weight: bold;
    border-radius: 5px;
    font-size: 0.7rem;
}

.mvp-info h4 {
    font-size: 0.9rem;
    color: #fff;
    margin-top: 10px;
    text-transform: uppercase;
}

.club-name-mini {
    font-size: 0.7rem;
    color: #aaa;
    display: block;
}

.stars-rating {
    color: #d4af37;
    font-size: 0.8rem;
    margin-top: 5px;
}

/* --- ESTILOS GESTIÓN LIMPIA: EQUIPOS --- */

.section-banner-elite {
    background-size: cover;
    background-position: center;
    position: relative;
}

.card-equipo-elite {
    background: #002147; /* Azul Marino Corporativo */
    border-radius: 15px;
    overflow: hidden;
    transition: all 0.4s ease;
    border-bottom: 5px solid #00ff34; /* Verde Neón Corporativo */
    height: 100%;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.card-equipo-elite:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0,255,52,0.15);
}

.equipo-header-media {
    position: relative;
    height: 300px;
    overflow: hidden;
}

.img-equipo-fluid {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1s ease;
}

.card-equipo-elite:hover .img-equipo-fluid {
    transform: scale(1.1);
}

.badge-elite-tag {
    position: absolute;
    top: 15px;
    left: 15px;
    background: #00ff34;
    color: #002147;
    padding: 5px 15px;
    font-weight: 800;
    font-size: 0.7rem;
    border-radius: 5px;
    z-index: 2;
    text-transform: uppercase;
}

.equipo-overlay-info {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 33, 71, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.4s ease;
    padding: 20px;
    text-align: center;
}

.card-equipo-elite:hover .equipo-overlay-info {
    opacity: 1;
}

.equipo-title-hover {
    color: #fff;
    font-weight: 800;
    margin-bottom: 10px;
}

.equipo-desc-hover {
    color: #ccc;
    font-size: 0.9rem;
    margin-bottom: 20px;
}

.btn-elite-action {
    background: #00ff34;
    color: #002147 !important;
    padding: 10px 20px;
    border-radius: 4px;
    font-weight: 900;
    text-decoration: none;
    display: inline-block;
    font-size: 0.8rem;
    transition: 0.3s;
}

.btn-elite-action:hover {
    background: #fff;
    transform: scale(1.05);
}

.equipo-footer-links {
    padding: 15px;
    background: rgba(255,255,255,0.02);
}

.link-external-dribbli {
    color: #00ff34;
    font-weight: 600;
    font-size: 0.85rem;
    text-decoration: none;
}

.link-external-dribbli:hover {
    color: #fff;
    text-decoration: underline;
}

.no-results-box i {
    font-size: 4rem;
    color: #002147;
    display: block;
}

/* --- ESTILOS GALERÍA DE JUGADORES ÉLITE --- */

.card-jugador-elite {
    background: #002147; /* Azul Marino */
    border-radius: 12px;
    overflow: hidden;
    border-bottom: 4px solid #00ff34; /* Verde Neón */
    transition: all 0.4s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.card-jugador-elite:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 25px rgba(0,255,52,0.2);
}

.jugador-media {
    position: relative;
    height: 320px;
    background: #0b172b;
}

.img-jugador {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.8s;
}

.card-jugador-elite:hover .img-jugador {
    filter: grayscale(30%) brightness(0.7);
}

/* Dorsal Estilo TV */
/* Dorsal Estilo TV con Colores de Autoridad */
.dorsal-badge {
    position: absolute;
    top: 15px;
    right: 15px;
    background: #002147; /* Fondo Azul Marino */
    color: #00ff34;      /* Número Verde Neón */
    font-weight: 900;
    font-size: 1.4rem;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    z-index: 2;
    /* Un borde sutil verde para que no se pierda en fondos oscuros */
    border: 2px solid #000000; 
    box-shadow: 0 4px 12px rgba(0,0,0,0.5);
    font-family: 'Arial Black', sans-serif;
    transition: all 0.3s ease;
}

/* Efecto opcional: Que el círculo brille cuando pases el mouse por la tarjeta */
.card-jugador-elite:hover .dorsal-badge {
    background: #00ff34;
    color: #002147;
    transform: scale(1.1);
}

.jugador-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 33, 71, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
}

.card-jugador-elite:hover .jugador-overlay {
    opacity: 1;
}

.btn-perfil-elite {
    background: #00ff34;
    color: #002147;
    font-weight: 800;
    padding: 10px 15px;
    border-radius: 4px;
    font-size: 0.75rem;
    text-decoration: none;
}

.nombre-jugador-link {
    color: #ffffff;
    font-weight: 700;
    font-size: 1.1rem;
    text-transform: uppercase;
    transition: 0.3s;
}

.nombre-jugador-link:hover {
    color: #00ff34;
    text-decoration: none;
}

.badge-year {
    color: #00ff34;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 1px;
}

/* Filtros */
.bg-filter-elite {
    background-color: #002147 !important;
    border-radius: 8px;
}

.tag-categoria-elite {
    display: inline-block;
    padding: 6px 12px;
    background: rgba(255,255,255,0.1);
    color: #fff;
    border-radius: 4px;
    font-size: 0.8rem;
}

.tag-categoria-elite:hover {
    background: #00ff34;
    color: #002147;
    text-decoration: none;
}

.atleta-nombre-header { 
    color: #ffffff; 
    font-weight: 900; 
    font-size: 4rem; /* Aumentamos el tamaño */
    text-transform: uppercase; 
    text-shadow: 3px 3px 10px rgba(0,0,0,0.8); /* Sombra negra profunda */
    z-index: 5; 
    position: relative; 
    margin: 0;
}


/* Controlar el tamaño y proporción de las fotos en el slider */
.block2-pic {
    width: 100%;
    height: 300px; /* Ajusta esta altura según prefieras */
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa; /* Color de fondo por si la imagen falla */
}

.block2-pic img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Esto hace que la imagen llene el espacio sin deformarse */
    object-position: top center; /* Prioriza mostrar la cara/parte superior */
    transition: transform 0.5s ease;
}

/* Efecto zoom al pasar el mouse */
.block2-pic:hover img {
    transform: scale(1.1);
}