/* ==========================================================================
   Páginas internas
   Cada sección del menú tiene un color de banner:
   Nosotros = rojo · Deportes = azul · Noticias / Contacto = noche · Voluntariado = verde
   (blanco sobre cada fondo ≥ 5.9:1)
   ========================================================================== */

:root { --verde-fuerte: #00703c; }

/* --------------------------------------------------------------------------
   Banner de página
   -------------------------------------------------------------------------- */
.banner-pagina {
  --banner-fondo: var(--noche);
  --banner-agito: var(--azul);
  position: relative;
  overflow: hidden;
  background: var(--banner-fondo);
  color: var(--blanco);
  padding-block: clamp(2rem, 1.25rem + 3vw, 3.75rem);
}
.banner-pagina--rojo  { --banner-fondo: var(--rojo-fuerte); --banner-agito: #ff4d55; }
.banner-pagina--azul  { --banner-fondo: var(--azul-fuerte); --banner-agito: var(--verde); }
.banner-pagina--verde { --banner-fondo: var(--verde-fuerte); --banner-agito: #19b864; }

.banner-pagina .contenedor {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2rem;
}
.banner-agito {
  position: absolute;
  right: -4%;
  bottom: -55%;
  width: clamp(260px, 34vw, 520px);
  aspect-ratio: 64 / 61;
  color: var(--banner-agito);
  opacity: 0.45;
  transform: rotate(150deg);
  pointer-events: none;
}
.banner-titulo {
  font-size: clamp(2.2rem, 1.4rem + 3vw, 3.75rem);
  margin-top: 0.75rem;
}
.banner-intro {
  max-width: 58ch;
  margin-top: 0.9rem;
  font-size: var(--t-md);
  line-height: 1.5;
  color: #eef3fa;
}
.banner-ilustracion {
  width: clamp(150px, 16vw, 220px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--blanco);
  overflow: hidden;
  box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.18);
}
.banner-ilustracion img { width: 100%; height: 100%; object-fit: contain; padding: 0.5rem; }
.banner-pagina :focus-visible { outline-color: var(--blanco); }

/* Migas de pan */
.migas ol {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 0.25rem 0.5rem;
  margin: 0; padding: 0;
  list-style: none;
  font-size: var(--t-sm);
}
.migas li { display: flex; align-items: center; gap: 0.5rem; }
.migas li + li::before {
  content: "";
  width: 6px; height: 6px;
  border-top: 2px solid currentColor; border-right: 2px solid currentColor;
  transform: rotate(45deg);
  opacity: 0.8;
}
.migas a { color: var(--blanco); text-underline-offset: 3px; }
.migas [aria-current="page"] { font-weight: 600; }

@media (max-width: 640px) {
  .banner-pagina .contenedor { grid-template-columns: 1fr; }
  .banner-ilustracion { width: 120px; order: -1; }
}

/* --------------------------------------------------------------------------
   Estructura del contenido
   -------------------------------------------------------------------------- */
.pagina-seccion { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem); }
.pagina-seccion--niebla { background: var(--niebla); }

.pagina-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
  gap: clamp(2rem, 1rem + 4vw, 5rem);
  align-items: start;
}
.pagina-lateral { display: grid; gap: 1.5rem; position: sticky; top: 120px; }

@media (max-width: 900px) {
  .pagina-grid { grid-template-columns: 1fr; }
  .pagina-lateral { position: static; }
}

/* Texto largo */
.prosa { max-width: 68ch; }
.prosa > * + * { margin-top: 1.1rem; }
.prosa h2 {
  margin-top: 2.75rem;
  font-stretch: 112%;
  font-weight: 800;
  font-size: var(--t-lg);
  line-height: 1.2;
}
.prosa h2:first-child { margin-top: 0; }
.prosa h3 { margin-top: 2rem; font-size: var(--t-md); font-weight: 700; }
.prosa ul, .prosa ol { padding-left: 1.25rem; }
.prosa li + li { margin-top: 0.5rem; }
.prosa li::marker { color: var(--rojo-fuerte); }
.prosa a { color: var(--azul-fuerte); text-underline-offset: 3px; }
.prosa a:hover { color: var(--tinta); }
.prosa strong { font-weight: 700; }
.prosa .entradilla { font-size: var(--t-md); line-height: 1.55; color: var(--tinta); }

.prosa blockquote {
  margin: 2rem 0;
  padding: 0.25rem 0 0.25rem 1.5rem;
  border-left: 4px solid var(--rojo);
  font-stretch: 105%;
  font-size: var(--t-md);
  font-weight: 600;
  line-height: 1.45;
}
.prosa blockquote footer { margin-top: 0.6rem; font-size: var(--t-sm); font-weight: 400; color: var(--tinta-suave); }

/* Figuras */
.figura { margin-block: 2rem; }
.figura img { width: 100%; border-radius: var(--radio); }
.figura figcaption {
  margin-top: 0.65rem;
  font-size: var(--t-sm);
  color: var(--tinta-suave);
}
.figura--ancha img { aspect-ratio: 16 / 9; object-fit: cover; }

/* --------------------------------------------------------------------------
   Tarjetas laterales
   -------------------------------------------------------------------------- */
.caja {
  padding: 1.5rem;
  border-radius: var(--radio-lg);
  background: var(--niebla);
}
.caja--borde { background: var(--blanco); border: 1px solid var(--linea); }
.caja-titulo { font-size: var(--t-md); font-weight: 700; margin-bottom: 1rem; }

/* Datos clave */
.datos { display: grid; gap: 0; margin: 0; }
.datos div { padding-block: 0.75rem; border-top: 1px solid var(--linea); }
.datos div:first-child { border-top: 0; padding-top: 0; }
.datos dt { font-size: var(--t-sm); color: var(--tinta-suave); }
.datos dd { margin: 0.1rem 0 0; font-weight: 700; }

/* Documentos para descargar */
.documentos { display: grid; gap: 0.75rem; padding: 0; list-style: none; }
.documento {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.25rem 0.9rem;
  align-items: center;
  padding: 1rem 1.1rem;
  border: 1.5px solid var(--borde-control);
  border-radius: var(--radio);
  background: var(--blanco);
}
.documento:hover { border-color: var(--tinta); background: var(--niebla); }
.documento-icono {
  grid-row: span 2;
  display: grid; place-items: center;
  width: 44px; height: 52px;
  border-radius: 6px;
  background: var(--rojo-fuerte);
  color: var(--blanco);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.documento a { font-weight: 700; text-decoration: none; }
.documento a::after { content: ""; position: absolute; inset: 0; border-radius: var(--radio); }
.documento a:focus-visible { outline: none; }
.documento:has(a:focus-visible) { outline: 3px solid var(--azul); outline-offset: 3px; }
.documento-meta { font-size: var(--t-sm); color: var(--tinta-suave); }

/* --------------------------------------------------------------------------
   Llamado a la acción
   -------------------------------------------------------------------------- */
.cta {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1.5rem 3rem;
  padding: clamp(1.75rem, 1rem + 3vw, 3rem);
  border-radius: var(--radio-lg);
  background: var(--noche);
  color: var(--blanco);
}
.cta h2 { font-size: var(--t-lg); }
.cta p { margin-top: 0.5rem; color: #dbe4f3; max-width: 56ch; }
.cta :focus-visible { outline-color: var(--blanco); }
@media (max-width: 700px) { .cta { grid-template-columns: 1fr; } }

/* --------------------------------------------------------------------------
   Rejillas de noticias y enlaces a otros deportes
   -------------------------------------------------------------------------- */
.rejilla-noticias {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.5rem, 1rem + 1.5vw, 2.25rem) clamp(1.25rem, 1rem + 1vw, 2rem);
  padding: 0;
  list-style: none;
}
@media (max-width: 960px) { .rejilla-noticias { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .rejilla-noticias { grid-template-columns: 1fr; } }

.otros-deportes {
  display: flex; flex-wrap: wrap; gap: 0.6rem;
  padding: 0; list-style: none;
}
.otros-deportes a {
  display: inline-flex; align-items: center;
  min-height: 44px;
  padding: 0 1.1rem;
  border: 1.5px solid var(--borde-control);
  border-radius: 999px;
  font-weight: 600;
  text-decoration: none;
}
.otros-deportes a:hover { border-color: var(--tinta); background: var(--niebla); }

/* --------------------------------------------------------------------------
   Línea de tiempo y pasos (contenidos realmente secuenciales)
   -------------------------------------------------------------------------- */
.linea-tiempo { position: relative; padding: 0; list-style: none; max-width: 68ch; }
.linea-tiempo::before {
  content: "";
  position: absolute; left: 0.45rem; top: 0.5rem; bottom: 0.5rem;
  width: 2px;
  background: var(--linea);
}
.linea-tiempo li { position: relative; padding: 0 0 1.75rem 2.25rem; }
.linea-tiempo li::before {
  content: "";
  position: absolute; left: 0; top: 0.35rem;
  width: 1rem; height: 1rem;
  border-radius: 50%;
  background: var(--blanco);
  border: 3px solid var(--rojo-fuerte);
}
.linea-tiempo-anio {
  display: block;
  font-stretch: 120%;
  font-weight: 800;
  font-size: var(--t-md);
  color: var(--rojo-fuerte);
}

.pasos { counter-reset: paso; display: grid; gap: 1rem; padding: 0; list-style: none; }
.pasos li {
  counter-increment: paso;
  position: relative;
  padding: 1.25rem 1.25rem 1.25rem 4.25rem;
  border-radius: var(--radio);
  background: var(--niebla);
}
.pasos li::before {
  content: counter(paso);
  position: absolute; left: 1.25rem; top: 1.15rem;
  display: grid; place-items: center;
  width: 2.1rem; height: 2.1rem;
  border-radius: 50%;
  background: var(--verde-fuerte);
  color: var(--blanco);
  font-weight: 800;
}
.pasos strong { display: block; font-size: var(--t-base); }

/* --------------------------------------------------------------------------
   Noticia individual
   -------------------------------------------------------------------------- */
.articulo-cabecera { padding-top: clamp(1.75rem, 1rem + 2vw, 3rem); }
.articulo-cabecera .migas a { color: var(--tinta); }
.articulo-cabecera .migas ol { color: var(--tinta-suave); }
/* Cabecera: título a la izquierda, resumen a la derecha */
.articulo-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 400px);
  gap: 2rem clamp(2rem, 1rem + 4vw, 5rem);
  align-items: end;
  margin-top: 1.75rem;
}
.articulo-intro .resumen { margin-top: 0; }
.articulo-categoria {
  display: inline-block;
  font-weight: 700;
  color: var(--rojo-fuerte);
  text-underline-offset: 3px;
}
.articulo-titulo {
  margin-top: 0.6rem;
  max-width: 20ch;
  font-size: clamp(2rem, 1.2rem + 3vw, 3.75rem);
  line-height: 1.08;
}
.articulo-datos {
  display: flex; flex-wrap: wrap; gap: 0.35rem 1.5rem;
  margin-top: 1.25rem;
  font-size: var(--t-sm);
  color: var(--tinta-suave);
}
.articulo-datos strong { color: var(--tinta); font-weight: 600; }

.resumen {
  margin-top: 2rem;
  padding: 1.25rem 1.5rem;
  border-left: 4px solid var(--azul);
  border-radius: 0 var(--radio) var(--radio) 0;
  background: var(--niebla);
}
.resumen h2 { font-size: var(--t-base); font-weight: 700; }
.resumen ul { margin-top: 0.6rem; padding-left: 1.2rem; }
.resumen li + li { margin-top: 0.35rem; }

.articulo-foto { margin-top: 2.25rem; }
.articulo-foto img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; border-radius: var(--radio-lg); }
.articulo-foto figcaption { margin-top: 0.65rem; font-size: var(--t-sm); color: var(--tinta-suave); }

/* Cuerpo: compartir | texto (≈68 caracteres por línea) | lo más reciente */
.articulo-grid {
  display: grid;
  grid-template-columns: 180px minmax(0, 68ch) minmax(240px, 1fr);
  gap: clamp(1.5rem, 1rem + 3vw, 4rem);
  padding-block: clamp(2rem, 1.5rem + 2vw, 3rem) var(--seccion);
}
.compartir { position: sticky; top: 120px; align-self: start; }
.compartir h2 { font-size: var(--t-sm); font-weight: 700; margin-bottom: 0.75rem; }
.compartir ul { display: grid; gap: 0.5rem; padding: 0; list-style: none; }
.compartir a, .compartir button {
  display: flex; align-items: center; gap: 0.6rem;
  width: 100%;
  min-height: 44px;
  padding: 0 0.9rem;
  border: 1.5px solid var(--borde-control);
  border-radius: 999px;
  background: var(--blanco);
  font-size: var(--t-sm);
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.compartir a:hover, .compartir button:hover { border-color: var(--tinta); background: var(--niebla); }
.compartir-estado { min-height: 1.5rem; margin-top: 0.5rem; font-size: var(--t-sm); color: var(--verde-fuerte); font-weight: 600; }

.etiquetas { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 2.5rem; padding: 0; list-style: none; }
.etiquetas a {
  display: inline-flex; align-items: center;
  min-height: 36px; padding: 0 0.9rem;
  border-radius: 999px;
  background: var(--niebla);
  font-size: var(--t-sm);
  font-weight: 600;
  text-decoration: none;
}
.etiquetas a:hover { background: var(--linea); }

.recientes { position: sticky; top: 120px; align-self: start; }
.recientes h2 { font-size: var(--t-base); font-weight: 700; margin-bottom: 0.5rem; }
.recientes ul { padding: 0; margin-bottom: 1.25rem; list-style: none; }
.recientes li { display: grid; gap: 0.25rem; padding-block: 1rem; border-top: 1px solid var(--linea); }
.recientes li:first-child { border-top: 0; padding-top: 0.5rem; }
.recientes li a { font-weight: 700; line-height: 1.3; text-decoration: none; }
.recientes li a:hover { text-decoration: underline; text-underline-offset: 3px; }
.recientes time { font-size: var(--t-xs); color: var(--tinta-suave); }

@media (max-width: 1180px) {
  .articulo-grid { grid-template-columns: 180px minmax(0, 1fr); }
  .recientes { position: static; grid-column: 2; }
}
@media (max-width: 960px) {
  .articulo-intro { grid-template-columns: 1fr; }
  .articulo-foto img { aspect-ratio: 16 / 9; }
}
@media (max-width: 900px) {
  .articulo-grid { grid-template-columns: 1fr; }
  .recientes { grid-column: auto; order: 3; }
  .compartir { position: static; order: 2; }
  .compartir ul { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
}

/* --------------------------------------------------------------------------
   Formularios (filtros de noticias y contacto)
   -------------------------------------------------------------------------- */
.campo { display: grid; gap: 0.4rem; align-content: start; }
.campo label, .campo legend { font-weight: 600; font-size: var(--t-sm); }
.campo-ayuda { font-size: var(--t-sm); color: var(--tinta-suave); }
.obligatorio { font-weight: 400; color: var(--tinta-suave); }

.control {
  width: 100%;
  min-height: 50px;
  padding: 0.65rem 0.95rem;
  border: 1.5px solid var(--borde-control);
  border-radius: 12px;
  background: var(--blanco);
  color: var(--tinta);
  font: inherit;
}
textarea.control { min-height: 160px; resize: vertical; }
select.control {
  appearance: none;
  padding-right: 2.75rem;
  background: var(--blanco) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%2313233f' stroke-width='2'/%3E%3C/svg%3E") right 1rem center / 12px no-repeat;
}
.control:hover { border-color: var(--tinta); }
.control:focus-visible { border-color: var(--azul); }

.campo--error .control { border-color: var(--rojo-fuerte); border-width: 2px; }
.campo-error {
  display: flex; align-items: center; gap: 0.4rem;
  font-size: var(--t-sm);
  font-weight: 600;
  color: var(--rojo-fuerte);
}
.campo-error::before {
  content: "!";
  display: grid; place-items: center;
  width: 1.15rem; height: 1.15rem;
  border-radius: 50%;
  background: var(--rojo-fuerte);
  color: var(--blanco);
  font-size: 0.75rem;
  font-weight: 800;
}
.campo-error[hidden] { display: none; }

.opciones { border: 0; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.opcion { display: flex; align-items: center; gap: 0.65rem; min-height: 44px; font-weight: 500; }
.opcion input { width: 22px; height: 22px; accent-color: var(--azul-fuerte); }

.resumen-errores {
  margin-bottom: 1.5rem;
  padding: 1.25rem 1.5rem;
  border: 2px solid var(--rojo-fuerte);
  border-radius: var(--radio);
  background: #fff5f5;
}
.resumen-errores h2 { font-size: var(--t-base); font-weight: 700; color: var(--rojo-fuerte); }
.resumen-errores ul { margin-top: 0.5rem; padding-left: 1.2rem; }
.resumen-errores a { color: var(--rojo-fuerte); font-weight: 600; }

.mensaje-exito {
  padding: 1.5rem;
  border: 2px solid var(--verde-fuerte);
  border-radius: var(--radio);
  background: #effaf3;
}
.mensaje-exito h2 { font-size: var(--t-md); font-weight: 700; color: var(--verde-fuerte); }
.mensaje-exito p { margin-top: 0.4rem; }

/* Filtros del listado de noticias */
.filtros {
  display: grid;
  grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)) auto;
  gap: 1rem;
  align-items: end;
  padding: 1.5rem;
  border-radius: var(--radio-lg);
  background: var(--niebla);
}
.filtros-acciones { display: flex; gap: 0.5rem; }
@media (max-width: 900px) {
  .filtros { grid-template-columns: 1fr 1fr; }
  .filtros .campo:first-child, .filtros-acciones { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .filtros { grid-template-columns: 1fr; }
  .filtros-acciones .boton { flex: 1; }
}

.resultados-estado {
  margin-block: 1.75rem 1.25rem;
  font-weight: 600;
}
.sin-resultados {
  padding: 2rem;
  border: 2px dashed var(--borde-control);
  border-radius: var(--radio-lg);
  text-align: center;
}
.sin-resultados p + p { margin-top: 0.5rem; color: var(--tinta-suave); }

/* Paginación */
.paginacion ul {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem;
  margin-top: 3rem; padding: 0; list-style: none;
}
.paginacion a {
  display: grid; place-items: center;
  min-width: 48px; height: 48px;
  padding: 0 0.9rem;
  border: 1.5px solid var(--borde-control);
  border-radius: 999px;
  font-weight: 600;
  text-decoration: none;
}
.paginacion a:hover { border-color: var(--tinta); background: var(--niebla); }
.paginacion a[aria-current="page"] { background: var(--tinta); border-color: var(--tinta); color: var(--blanco); }

/* --------------------------------------------------------------------------
   Contacto
   -------------------------------------------------------------------------- */
.contacto-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: clamp(2rem, 1rem + 4vw, 5rem);
  align-items: start;
}
.formulario { display: grid; gap: 1.5rem; }
.formulario-fila { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
@media (max-width: 900px) { .contacto-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .formulario-fila { grid-template-columns: 1fr; } }

.datos-contacto { display: grid; gap: 1.25rem; font-style: normal; }
.datos-contacto strong { display: block; font-weight: 700; }
.datos-contacto a { color: var(--azul-fuerte); text-underline-offset: 3px; }

/* Sedes de prensa, etc. */
.nota {
  padding: 1rem 1.25rem;
  border-radius: var(--radio);
  background: #fff8e1;
  border: 1px solid #e5b021;
  font-size: var(--t-sm);
}
.prosa .etiquetas { padding-left: 0; }
.prosa .etiquetas li + li { margin-top: 0; }

/* --------------------------------------------------------------------------
   Comisión directiva
   -------------------------------------------------------------------------- */
.directiva {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  padding: 0;
  list-style: none;
}
.persona {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 1.1rem;
  padding: 1.5rem;
  border: 1px solid var(--linea);
  border-radius: var(--radio-lg);
  background: var(--blanco);
}
.persona--destacada {
  grid-column: 1 / -1;
  padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  background: var(--niebla);
  border-color: transparent;
}
.iniciales {
  display: grid; place-items: center;
  width: 64px; height: 64px;
  border-radius: 50%;
  background: var(--rojo-fuerte);
  color: var(--blanco);
  font-stretch: 120%;
  font-weight: 800;
  font-size: 1.25rem;
}
.directiva li:nth-child(3n + 2) .iniciales { background: var(--azul-fuerte); }
.directiva li:nth-child(3n + 3) .iniciales { background: var(--verde-fuerte); }
.persona--destacada .iniciales { width: 96px; height: 96px; font-size: 1.75rem; }
.persona-nombre { font-size: var(--t-md); font-weight: 700; line-height: 1.2; }
.persona--destacada .persona-nombre { font-stretch: 115%; font-weight: 800; font-size: var(--t-lg); }
.persona-cargo { margin-top: 0.2rem; color: var(--tinta-suave); }
@media (max-width: 960px) { .directiva { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .directiva { grid-template-columns: 1fr; } }

/* --------------------------------------------------------------------------
   Próximos eventos
   -------------------------------------------------------------------------- */
.eventos { display: grid; gap: 1.25rem; padding: 0; list-style: none; }
.evento {
  position: relative;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) auto;
  align-items: center;
  gap: 1.5rem 2rem;
  padding: 1.5rem;
  border: 1px solid var(--linea);
  border-radius: var(--radio-lg);
  background: var(--blanco);
}
.evento:hover { border-color: var(--borde-control); }
.evento-fecha {
  display: grid;
  place-items: center;
  align-content: center;
  min-height: 120px;
  padding: 0.75rem;
  border-radius: var(--radio);
  background: var(--noche);
  color: var(--blanco);
  text-align: center;
  line-height: 1.15;
}
.evento-fecha-dias { font-stretch: 120%; font-weight: 800; font-size: 1.6rem; }
.evento-fecha-mes { margin-top: 0.25rem; font-size: var(--t-sm); color: #dbe4f3; }
.evento-fecha--pendiente { background: var(--niebla); color: var(--tinta); border: 2px dashed var(--borde-control); }
.evento-fecha--pendiente .evento-fecha-dias { font-size: var(--t-base); font-stretch: 100%; }
.evento-fecha--pendiente .evento-fecha-mes { color: var(--tinta-suave); }
.evento-deporte { font-size: var(--t-sm); font-weight: 700; color: var(--rojo-fuerte); }
.evento-nombre { margin-top: 0.25rem; font-stretch: 112%; font-weight: 800; font-size: var(--t-lg); line-height: 1.15; }
.evento-datos { margin-top: 0.5rem; color: var(--tinta-suave); }
.evento-nombre a { text-decoration: none; }
.evento-nombre a::after { content: ""; position: absolute; inset: 0; border-radius: var(--radio-lg); }
.evento-nombre a:focus-visible { outline: none; }
.evento:has(.evento-nombre a:focus-visible) { outline: 3px solid var(--azul); outline-offset: 4px; }
.evento-mas { font-weight: 700; color: var(--rojo-fuerte); white-space: nowrap; }
@media (max-width: 760px) {
  .evento { grid-template-columns: 1fr; }
  .evento-fecha { min-height: 0; justify-items: start; text-align: left; grid-auto-flow: column; gap: 0.75rem; }
  .evento-fecha-mes { margin-top: 0; }
}

/* --------------------------------------------------------------------------
   Otros paradeportes: disciplinas
   -------------------------------------------------------------------------- */
.destacados-disciplina {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  padding: 0;
  list-style: none;
}
.disciplina-destacada {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 1.25rem;
  align-items: center;
  padding: 1.25rem;
  border-radius: var(--radio-lg);
  background: var(--niebla);
}
.disciplina-destacada img { width: 140px; height: 140px; object-fit: cover; border-radius: var(--radio); }
.disciplina-destacada h3 { font-size: var(--t-md); font-weight: 800; font-stretch: 112%; }
.disciplina-destacada p { margin-top: 0.35rem; color: var(--tinta-suave); }
.disciplinas {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.75rem;
  padding: 0;
  list-style: none;
}
.disciplinas li {
  padding: 1rem 1.15rem;
  border: 1px solid var(--linea);
  border-left: 4px solid var(--azul);
  border-radius: 10px;
  font-weight: 600;
}
.disciplinas li:nth-child(3n + 2) { border-left-color: var(--rojo); }
.disciplinas li:nth-child(3n + 3) { border-left-color: var(--verde); }
@media (max-width: 760px) {
  .destacados-disciplina { grid-template-columns: 1fr; }
  .disciplina-destacada { grid-template-columns: 96px 1fr; }
  .disciplina-destacada img { width: 96px; height: 96px; }
}

/* --------------------------------------------------------------------------
   Formularios largos (libro de reclamaciones)
   -------------------------------------------------------------------------- */
.grupo-formulario {
  margin: 0;
  padding: clamp(1.25rem, 1rem + 1.5vw, 2rem);
  border: 1px solid var(--linea);
  border-radius: var(--radio-lg);
  display: grid;
  gap: 1.25rem;
}
.grupo-formulario > legend {
  padding: 0 0.5rem;
  font-stretch: 112%;
  font-weight: 800;
  font-size: var(--t-md);
}
.formulario-fila--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 760px) { .formulario-fila--3 { grid-template-columns: 1fr; } }
.ficha-empresa {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 0.75rem 2rem;
  margin: 0 0 2rem;
  padding: 1.25rem 1.5rem;
  border-radius: var(--radio);
  background: var(--niebla);
}
.ficha-empresa dt { font-size: var(--t-sm); color: var(--tinta-suave); }
.ficha-empresa dd { margin: 0; font-weight: 700; }
.opcion-detalle { display: block; font-weight: 400; font-size: var(--t-sm); color: var(--tinta-suave); }
.opcion--bloque { align-items: flex-start; }
.opcion--bloque input { margin-top: 0.2rem; }