/* ===== PARTICIPA 2026 · PATROCINADORES Y COLABORADORES =====
   Estilos de partials/patrocinadores.php (los cargan home.php e
   index.php). Las clases .pa-patro-grupo / -cabecera / -medalla / -cuerpo
   también las usan las cards de grabaciones y streaming de home.php. */

/* ── Títulos de sección ────────────────────────────────────────────────────── */
.pa-seccion-titulo {
    font-size: 1.1rem;
    font-weight: 700;
    color: #153D4C;
    margin-bottom: 1rem;
}
.pa-seccion-titulo i {
    color: #2E86A6;
}

/* ── Patrocinadores ────────────────────────────────────────────────────────── */
/* Patrocinador sin espacio propio: solo logo y nombre, sin efectos */
.pa-patrocinador {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    height: 100%;
    padding: 18px 14px;
    background: #fff;
    border: 1px solid #D3EAF3;
    border-radius: 12px;
    text-align: center;
    text-decoration: none;
}
.pa-patrocinador-img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 90px;
}
.pa-patrocinador-img img {
    max-width: 100%;
    max-height: 90px;
    object-fit: contain;
}
.pa-patrocinador-nombre {
    font-size: .85rem;
    font-weight: 700;
    color: #153D4C;
    line-height: 1.3;
}

/* La tarjeta con espacio propio es un botón de formulario (POST, sin ?idp= en la
   dirección): ocupa toda la columna y se ve igual que el resto */
.pa-patrocinador-form {
    height: 100%;
    margin: 0;
}
button.pa-patrocinador {
    width: 100%;
    font: inherit;
    cursor: pointer;
}

/* Con espacio propio en el Área privada (enlace a espacio_patrocinador.php).
   Se distingue sin necesidad de pasar el ratón (móvil): franja superior,
   fondo tintado y botón "Ver espacio" */
.pa-patrocinador-espacio {
    border: 2px solid #2E86A6;
    background: linear-gradient(180deg, #F7FBFD 0%, #fff 60%);
    box-shadow: 0 4px 14px rgba(46,134,166,.18);
    overflow: hidden;
    padding-top: 22px;
    transition: box-shadow .2s ease, transform .2s ease;
}
.pa-patrocinador-espacio::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 5px;
    background: linear-gradient(90deg, #2E86A6, #153D4C);
}
.pa-patrocinador-espacio:hover,
.pa-patrocinador-espacio:focus-visible {
    box-shadow: 0 8px 22px rgba(46,134,166,.28);
    transform: translateY(-3px);
}
.pa-patrocinador-ver {
    display: inline-flex;
    align-items: center;
    margin-top: auto;
    padding: 6px 14px;
    border-radius: 20px;
    background: #2E86A6;
    color: #fff;
    font-size: .78rem;
    font-weight: 700;
    white-space: nowrap;
}
.pa-patrocinador-espacio:hover .pa-patrocinador-ver,
.pa-patrocinador-espacio:focus-visible .pa-patrocinador-ver {
    background: #153D4C;
}

/* Card por categoría de patrocinio (Bootstrap .card; la cabecera usa el estilo
   global de .card-header de comun.css). La categoría se distingue por la
   medalla: oro, plata, bronce; las demás en el azul corporativo */
.pa-patro-grupo {
    --pa-metal-degradado: linear-gradient(135deg, #41ABC8, #216072);
    border: 1px solid #D3EAF3;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(21,61,76,.06);
}
.pa-patro-platino {
    --pa-metal-degradado: linear-gradient(135deg, #F4F6F8 0%, #C9D1D9 45%, #7F8B96 100%);
}
.pa-patro-diamante {
    --pa-metal-degradado: linear-gradient(135deg, #CFF4FF 0%, #6FD3F2 45%, #2A8FB8 100%);
}
.pa-patro-oro {
    --pa-metal-degradado: linear-gradient(135deg, #F6E27A 0%, #D4AF37 45%, #B8901F 100%);
}
.pa-patro-plata {
    --pa-metal-degradado: linear-gradient(135deg, #E9EDF0 0%, #B8C0C8 50%, #8E979F 100%);
}
.pa-patro-bronce {
    --pa-metal-degradado: linear-gradient(135deg, #E3A869 0%, #B87333 50%, #8C5523 100%);
}
.pa-patro-cabecera {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    font-size: .9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.pa-patro-medalla {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--pa-metal-degradado);
    color: #fff;
    font-size: .85rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.18);
    flex: 0 0 auto;
    /* sin el espaciado de letras de la cabecera, que desplazaba el icono */
    letter-spacing: 0;
    line-height: 1;
}
.pa-patro-medalla i {
    line-height: 1;
}
.pa-patro-cuerpo {
    padding: 16px;
}

/* Tamaño de los logos según el nivel de la categoría (1 = la más importante,
   p. ej. Diamante; 5 = la última, p. ej. Media Partners) */
.pa-patro-nivel-1 .pa-patrocinador-img { height: 100px; }
.pa-patro-nivel-1 .pa-patrocinador-img img { max-height: 100px; }

.pa-patro-nivel-2 .pa-patrocinador-img { height: 75px; }
.pa-patro-nivel-2 .pa-patrocinador-img img { max-height: 75px; }
.pa-patro-nivel-2 .pa-patrocinador-nombre { font-size: .78rem; }

.pa-patro-nivel-3 .pa-patrocinador,
.pa-patro-nivel-4 .pa-patrocinador,
.pa-patro-nivel-5 .pa-patrocinador { padding: 12px 8px; gap: 8px; }
.pa-patro-nivel-3 .pa-patrocinador-img { height: 60px; }
.pa-patro-nivel-3 .pa-patrocinador-img img { max-height: 60px; }
.pa-patro-nivel-3 .pa-patrocinador-nombre { font-size: .72rem; }

.pa-patro-nivel-4 .pa-patrocinador-img { height: 48px; }
.pa-patro-nivel-4 .pa-patrocinador-img img { max-height: 48px; }
.pa-patro-nivel-4 .pa-patrocinador-nombre { font-size: .68rem; }

.pa-patro-nivel-5 .pa-patrocinador-img { height: 38px; }
.pa-patro-nivel-5 .pa-patrocinador-img img { max-height: 38px; }
.pa-patro-nivel-5 .pa-patrocinador-nombre { font-size: .64rem; }

/* ── Carrusel de logos por categoría (js2026/patrocinadores.js) ────────────── */
/* Mismo método que el pie de Socios (socios/css2026/footer.css, .wca-marquee).
   Relleno vertical para que no se recorten la sombra ni el desplazamiento al
   pasar el ratón de las tarjetas con espacio propio */
.pa-marquee {
    overflow: hidden;
    padding: 4px 0 10px;
}
.pa-marquee-track {
    display: flex;
    align-items: stretch;
    width: max-content;
}
.pa-marquee-track.pa-animado {
    animation: pa-marquee 25s linear infinite;   /* la duración la fija el JS */
}
.pa-marquee:hover .pa-marquee-track,
.pa-marquee:focus-within .pa-marquee-track {
    animation-play-state: paused;
}
/* Caben todos: sin animación ni copia, centrados */
.pa-marquee-track.pa-fijo {
    width: auto;
    justify-content: center;
    flex-wrap: wrap;
    row-gap: 16px;
}
.pa-marquee-item {
    flex: 0 0 auto;
    padding: 0 8px;
}
/* Ancho de cada logo según el nivel (más grande cuanto más importante) */
.pa-patro-nivel-1 .pa-marquee-item { width: 230px; }
.pa-patro-nivel-2 .pa-marquee-item { width: 185px; }
.pa-patro-nivel-3 .pa-marquee-item { width: 150px; }
.pa-patro-nivel-4 .pa-marquee-item { width: 130px; }
.pa-patro-nivel-5 .pa-marquee-item { width: 115px; }
@keyframes pa-marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .pa-marquee-track.pa-animado { animation: none; }
}
