/* ==========================================================================
   EHUIF-FVAS · Cabecera y navegacion
   Integra el header con el lenguaje visual de la portada (paleta submarina).
   Clases de GeneratePress: .site-header, .inside-header, .main-navigation,
   .site-logo, .menu-toggle, .sub-menu
   ========================================================================== */

:root{
  --fv-abyss:#061620;
  --fv-deep:#0b2c3a;
  --fv-mid:#11536b;
  --fv-surface:#1c8fa3;
  --fv-foam:#eef6f4;
  --fv-foam-dim:#c7dad8;
  --fv-buoy:#ff6a39;
  --fv-buoy-dim:#ff8a5e;
  --fv-ink:#04111a;
  --fv-line:rgba(238,246,244,0.14);
  /* Titulares. Archivo normal: la anchura la da el peso, no el eje wdth.
     Al servir la Archivo variable de verdad, la version expandida resulto
     demasiado ancha para texto largo (el h1 del hero se iba a cuatro lineas),
     asi que la expandida se reserva para rotulos cortos. */
  --fv-display:'Archivo',sans-serif;
  /* Version expandida (wdth 125), solo para textos breves: siglas, cifras,
     botones. Es donde el gesto ancho del mockup aporta y no estorba. */
  --fv-display-wide:'Archivo Expanded','Archivo',sans-serif;
  --fv-body:'Archivo',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --fv-mono:'JetBrains Mono',ui-monospace,monospace;
}

body{font-family:var(--fv-body);}
h1,h2,h3,h4,h5,.main-title{font-family:var(--fv-display);letter-spacing:-.015em;}
/* Titulares grandes: peso alto y espaciado mas cerrado, que es lo que da
   presencia sin ocupar tres lineas de mas. */
h1{letter-spacing:-.025em;}

/* Rotulos cortos que si van expandidos */
.main-title,
.fv-stat-num,
.fv-footer-logo-text,
.main-navigation .fv-nav-cta > a{font-family:var(--fv-display-wide);}

/* ---------- Cabecera ---------- */
/* Por defecto (paginas interiores) la cabecera es opaca: el contenido de esas
   paginas no es necesariamente oscuro y el texto claro debe seguir legible. */
.site-header{
  background:rgba(6,22,32,0.96);
  border-bottom:1px solid var(--fv-line);
  position:sticky;
  top:0;
  z-index:100;
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
}

/* En la portada la cabecera flota sobre el hero, con el degradado del mockup:
   opaca arriba y desvanecida hacia abajo. */
body.home .site-header{
  position:fixed;
  left:0;
  right:0;
  background:linear-gradient(to bottom, rgba(6,22,32,0.92) 0%, rgba(6,22,32,0.55) 55%, rgba(6,22,32,0) 100%);
  border-bottom:none;
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
  transition:background .3s ease;
}
/* Con sesion abierta, la barra de administracion de WordPress es fija y tapaba
   el logo y el titulo, porque la cabecera de la portada tambien es fija en top:0.
   WordPress imprime la clase admin-bar en el body, asi que se puede bajar. */
body.admin-bar.home .site-header{top:32px;}
@media screen and (max-width:782px){
  body.admin-bar.home .site-header{top:46px;}
}

/* Al desplegar un submenu conviene fondo firme para que se lea */
body.home .site-header:hover,
body.home .site-header:focus-within{
  background:linear-gradient(to bottom, rgba(6,22,32,0.97) 0%, rgba(6,22,32,0.9) 100%);
}
/* El contenedor del tema centra y deja mucho aire a los lados:
   la cabecera va a ancho completo con un margen fijo y discreto. */
.site-header .inside-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  max-width:100%;
  padding:10px 28px;
}
@media (min-width:1600px){
  .site-header .inside-header{padding-left:48px;padding-right:48px;}
}

/* Logo: es un SVG con fondo transparente, lo sirve fvas/marca.php. NO lleva
   pastilla blanca. La llevaba cuando era un JPEG con fondo blanco, y volvio a
   aparecer el 29 de julio al restaurar esta hoja a un commit anterior al del
   logo. Si reaparece, es por eso: no hay que reponerla, el escudo ya trae su
   propio blanco dentro. */
.site-header .site-logo{margin:0;display:flex;align-items:center;flex-shrink:0;}
.site-header .site-logo img{
  height:46px;
  width:auto;
  display:block;
}
.site-header .header-widget,
.site-header .site-branding-container{display:flex;align-items:center;gap:12px;}
.site-branding{display:flex;align-items:center;}
/* GeneratePress imprime el nombre del sitio como p.main-title */
.site-header .main-title,
.site-header .main-title a,
.site-header .site-title,
.site-header .site-title a{
  font-family:var(--fv-display-wide);
  font-weight:800;
  font-size:19px;
  line-height:1;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--fv-foam);
  text-decoration:none;
  white-space:nowrap;
}
/* El nombre completo se conserva como descripcion del sitio (SEO, RSS),
   pero en la cabecera basta con las siglas. */
.site-header .site-description{display:none;}

/* ---------- Navegacion ---------- */
.main-navigation{background:transparent;}
.main-navigation .inside-navigation{padding:0;}
.main-navigation .main-nav > ul{
  display:flex;
  align-items:center;
  gap:2px;
  flex-wrap:nowrap;
}
/* El li es flex para centrar el enlace, y ademas referencia de posicion
   del submenu. Sin el top:100% el submenu se ancla al borde SUPERIOR del li
   (comportamiento normal de un absoluto dentro de un contenedor flex)
   y se abre hacia arriba, cortado por la cabecera. */
.main-navigation .main-nav > ul > li{display:flex;align-items:center;position:relative;}
.main-navigation .main-nav > ul > li > ul.sub-menu{top:100%;}
.main-navigation .main-nav ul ul li{position:relative;}
.main-navigation .main-nav ul ul li > ul.sub-menu{top:0;left:100%;}
/* El enlace es flex y no parte linea: si no, la flecha del submenu
   cae a una segunda linea y descoloca ese elemento respecto al resto. */
.main-navigation .main-nav ul li a{
  display:flex;
  align-items:center;
  white-space:nowrap;
  font-family:var(--fv-body);
  font-size:13.5px;
  font-weight:600;
  line-height:1;
  letter-spacing:.01em;
  color:var(--fv-foam-dim);
  padding:13px 12px;
  position:relative;
  transition:color .2s;
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.sfHover > a{color:var(--fv-foam);background:transparent;}

/* Subrayado naranja al pasar por encima */
.main-navigation .main-nav > ul > li > a::after{
  content:'';
  position:absolute;
  left:12px;
  right:12px;
  bottom:8px;
  height:1px;
  background:var(--fv-buoy);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .2s ease;
}
.main-navigation .main-nav > ul > li > a:hover::after,
.main-navigation .main-nav > ul > li.sfHover > a::after{transform:scaleX(1);}

/* Pagina actual */
.main-navigation .main-nav ul li.current-menu-item > a,
.main-navigation .main-nav ul li.current-page-ancestor > a{color:var(--fv-foam);}
.main-navigation .main-nav > ul > li.current-menu-item > a::after{transform:scaleX(1);}

/* Flecha de los submenus: en linea con el texto y mas discreta */
.main-navigation .dropdown-menu-toggle{
  display:inline-flex;
  align-items:center;
  padding:0 0 0 5px;
  line-height:1;
  font-size:11px;
  opacity:.55;
}
.main-navigation .main-nav ul li a:hover .dropdown-menu-toggle{opacity:.9;}

/* ---------- Submenus ---------- */
.main-navigation ul ul{
  background:rgba(11,44,58,0.97);
  border:1px solid var(--fv-line);
  border-radius:8px;
  box-shadow:0 18px 40px rgba(4,17,26,0.5);
  padding:6px;
  min-width:230px;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
.main-navigation ul ul li a{
  font-size:13.5px;
  font-weight:500;
  padding:10px 12px;
  border-radius:4px;
  color:var(--fv-foam-dim);
}
.main-navigation ul ul li a:hover{background:var(--fv-mid);color:var(--fv-foam);}
.main-navigation ul ul > li > a::after{display:none;}

/* ---------- Icono de Instagram ---------- */
.main-navigation .main-nav ul li.fv-nav-instagram{
  align-self:center;
  margin-left:10px;
  display:flex;
  align-items:center;
}
.main-navigation .main-nav ul li.fv-nav-instagram > a{
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--fv-foam);
  opacity:.85;
  padding:6px;
  transition:opacity .2s, transform .2s;
}
.main-navigation .main-nav ul li.fv-nav-instagram > a:hover{
  opacity:1;
  transform:translateY(-1px);
  color:var(--fv-foam);
}
.main-navigation .main-nav ul li.fv-nav-instagram > a svg{
  display:block;
}

/* ---------- Boton de federarse ---------- */
/* El li no debe estirarse a toda la altura de la cabecera ni partir el texto. */
.main-navigation .main-nav ul li.fv-nav-cta{
  margin-left:14px;
  align-self:center;
}
.main-navigation .main-nav ul li.fv-nav-cta > a{
  background:var(--fv-buoy);
  color:var(--fv-ink);
  font-weight:700;
  font-size:13.5px;
  line-height:1;
  letter-spacing:.01em;
  border-radius:4px;
  padding:12px 20px;
  white-space:nowrap;
  transition:background .2s, transform .2s;
}
.main-navigation .main-nav ul li.fv-nav-cta > a:hover{
  background:var(--fv-buoy-dim);
  color:var(--fv-ink);
  transform:translateY(-1px);
}
.main-navigation .main-nav ul li.fv-nav-cta > a::after{display:none;}
.main-navigation .main-nav ul li.fv-nav-cta .dropdown-menu-toggle{color:var(--fv-ink);opacity:.7;}

/* Foco visible: necesario para navegacion por teclado */
.site-header a:focus-visible,
.main-navigation a:focus-visible{
  outline:2px solid var(--fv-buoy);
  outline-offset:2px;
}

/* ---------- Movil ---------- */
.main-navigation .menu-toggle{
  color:var(--fv-foam);
  font-family:var(--fv-body);
  font-size:14px;
  font-weight:600;
}
@media (max-width:1080px){
  .main-navigation .main-nav ul li a{font-size:12.5px;padding:13px 9px;}
  .main-navigation .main-nav ul li.fv-nav-cta > a{padding:11px 16px;font-size:12.5px;}
  .site-header .main-title a{font-size:17px;}
  .site-header .inside-header{padding-left:20px;padding-right:20px;}
}
@media (max-width:768px){
  .site-header .inside-header{flex-wrap:wrap;gap:10px;}
  .main-navigation .main-nav > ul{flex-wrap:wrap;gap:0;}
  .main-navigation .main-nav ul li a{padding:12px 20px;}
  .main-navigation .main-nav ul li.fv-nav-cta{margin:10px 20px;}
  .main-navigation .main-nav ul li.fv-nav-cta > a{display:inline-block;}
  .main-navigation .main-nav ul li.fv-nav-instagram{margin:10px 12px;}
  .site-header .site-logo img{height:42px;}

  /* Submenus en movil: fluyen hacia abajo, no a la derecha */
  .main-navigation ul ul{
    position:static;
    background:transparent;
    border:none;
    border-radius:0;
    box-shadow:none;
    padding:0;
    min-width:0;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
  .main-navigation ul ul li a{
    padding-left:36px;
    border-radius:0;
  }
  .main-navigation ul ul ul li a{
    padding-left:52px;
  }
}

/* Menu hamburguesa abierto (cualquier ancho): los submenus fluyen debajo,
   no a la derecha. GeneratePress añade .toggled al nav cuando se abre.
   El toggle de cada submenu lo controla GP con la clase .toggled-on en el ul:
   aqui solo se cambia el layout, no la visibilidad. */
.main-navigation.toggled .main-nav > ul > li{
  display:block;
}
.main-navigation.toggled .main-nav ul ul{
  position:static !important;
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
  padding:0;
  min-width:0;
  width:100%;
  float:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  left:auto;
  top:auto;
}
.main-navigation.toggled .main-nav ul ul li{
  display:block;
  width:100%;
}
.main-navigation.toggled .main-nav ul ul li a{
  padding:10px 20px 10px 36px;
  border-radius:0;
  text-align:left;
  display:block;
  white-space:normal;
}
.main-navigation.toggled .main-nav ul ul ul li a{
  padding-left:52px;
}

/* ---------- Pie del tema (wrapper de GeneratePress) ---------- */
.site-footer,
.site-info{
  background:var(--fv-ink);
  border-top:none;
  color:var(--fv-foam-dim);
  font-size:13px;
  padding:0;
}
.site-footer a{color:var(--fv-foam-dim);}
.site-footer a:hover{color:var(--fv-buoy-dim);}

/* ---------- Footer propio: fv-footer ---------- */
.fv-footer{
  background:var(--fv-ink);
  border-top:1px solid var(--fv-line);
  color:var(--fv-foam-dim);
  font-family:var(--fv-body);
  font-size:14px;
}

/* Grid de 4 columnas: brand + 3 columnas de nav */
.fv-footer-inner{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr;
  gap:48px;
  max-width:1180px;
  margin:0 auto;
  padding:64px 32px 52px;
}

/* Columna de identidad */
/* Escudo: el mismo logotipo del personalizador, a tamano de pie. Se limita por
   altura y no por anchura para que siga cuadrando si algun dia se sustituye por
   otra version con distinta proporcion. */
.fv-footer-logo{
  display:block;
  height:68px;
  width:auto;
  max-width:100%;
  margin:0 0 20px;
}
@media (max-width:560px){
  .fv-footer-logo{height:56px;}
}
.fv-footer-logo-text{
  font-family:var(--fv-display);
  font-weight:800;
  font-size:18px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--fv-foam);
  margin:0 0 16px;
}
.fv-footer-desc{
  color:var(--fv-foam-dim);
  font-size:13.5px;
  line-height:1.65;
  max-width:280px;
  margin:0;
}

/* Columnas de navegación */
.fv-footer-col-title{
  font-family:var(--fv-mono);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:var(--fv-surface);
  margin:0 0 18px;
}
.fv-footer-col ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.fv-footer-col ul li a{
  color:var(--fv-foam-dim);
  text-decoration:none;
  font-size:14px;
  transition:color .2s;
}
.fv-footer-col ul li a:hover{color:var(--fv-foam);}

/* Barra inferior de copyright */
.fv-footer-bar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  max-width:1180px;
  margin:0 auto;
  padding:18px 32px;
  border-top:1px solid var(--fv-line);
  font-size:12.5px;
  color:rgba(199,218,216,0.6);
}
.fv-footer-bar a{
  color:rgba(199,218,216,0.6);
  text-decoration:none;
  transition:color .2s;
}
.fv-footer-bar a:hover{color:var(--fv-buoy-dim);}
.fv-footer-territories{
  letter-spacing:.04em;
  color:rgba(199,218,216,0.5);
}

/* Responsive */
@media (max-width:900px){
  .fv-footer-inner{
    grid-template-columns:1fr 1fr;
    gap:36px;
    padding:48px 24px 40px;
  }
  .fv-footer-brand{grid-column:1 / -1;}
}
@media (max-width:560px){
  .fv-footer-inner{
    grid-template-columns:1fr;
    padding:40px 20px 32px;
  }
  .fv-footer-bar{
    flex-direction:column;
    align-items:flex-start;
    padding:18px 20px;
  }
}

/* ==========================================================================
   Formulario de contacto (shortcode [fvas_contacto])
   ========================================================================== */
.fv-form{max-width:720px;margin:0 0 8px;}
.fv-form-fila{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;}
@media (max-width:600px){.fv-form-fila{grid-template-columns:1fr;}}

.fv-form-campo{margin:0 0 20px;}
.fv-form-campo label,
.fv-form-consentimiento label{
  display:block;
  font-size:13px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--fv-foam-dim);
  margin-bottom:7px;
}
.fv-form-req{color:var(--fv-buoy);}

.fv-form input[type="text"],
.fv-form input[type="email"],
.fv-form textarea{
  width:100%;
  box-sizing:border-box;
  padding:13px 14px;
  border:1px solid var(--fv-line);
  border-radius:3px;
  background:rgba(238,246,244,0.04);
  color:var(--fv-foam);
  font-family:var(--fv-body);
  font-size:16px; /* 16px evita el zoom automatico en iOS */
  line-height:1.5;
  transition:border-color .2s, background .2s;
}
.fv-form textarea{resize:vertical;min-height:150px;}
.fv-form input:hover,
.fv-form textarea:hover{border-color:var(--fv-foam-dim);}
/* Foco visible y con contraste: hace falta para navegar con teclado. */
.fv-form input:focus,
.fv-form textarea:focus,
.fv-form button:focus-visible{
  outline:2px solid var(--fv-surface);
  outline-offset:2px;
  border-color:var(--fv-surface);
  background:rgba(238,246,244,0.07);
}
.fv-form [aria-invalid="true"]{border-color:var(--fv-buoy);}

.fv-form-consentimiento{
  display:grid;grid-template-columns:auto 1fr;gap:0 10px;
  align-items:start;margin:0 0 24px;
}
.fv-form-consentimiento input{margin-top:3px;width:17px;height:17px;accent-color:var(--fv-surface);}
.fv-form-consentimiento label{
  text-transform:none;letter-spacing:0;font-size:14.5px;
  line-height:1.5;margin:0;color:var(--fv-foam-dim);
}
.fv-form-consentimiento .fv-form-error-campo{grid-column:2;}

.fv-form-error-campo{
  display:block;margin-top:6px;
  font-size:13.5px;color:var(--fv-buoy-dim);
}

.fv-form-acciones{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:0;}
.fv-form-nota{font-size:13px;color:var(--fv-foam-dim);}
/* El boton comparte estilo con los de la portada, pero en paginas interiores
   .fv-btn no esta declarado, asi que se define aqui lo imprescindible. */
.fv-form button.fv-btn{
  border:0;cursor:pointer;
  padding:14px 26px;border-radius:3px;
  font-family:var(--fv-body);font-weight:700;font-size:15px;
  background:var(--fv-buoy);color:var(--fv-ink);
  transition:background .2s, transform .2s;
}
.fv-form button.fv-btn:hover{background:var(--fv-buoy-dim);transform:translateY(-1px);}

.fv-form-aviso{
  padding:14px 16px;border-radius:3px;margin:0 0 24px;
  border-left:3px solid;font-size:15px;line-height:1.5;
}
.fv-form-ok{
  border-color:var(--fv-surface);
  background:rgba(28,143,163,0.14);
  color:var(--fv-foam);
}
.fv-form-error{
  border-color:var(--fv-buoy);
  background:rgba(255,106,57,0.12);
  color:var(--fv-foam);
}

/* Campo señuelo: fuera de la vista pero sin display:none, que algunos robots
   detectan. No lo anuncian los lectores de pantalla por el aria-hidden. */
.fv-form-senuelo{
  position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;
}

/* ==========================================================================
   Calendario de actividades (shortcode [fvas_calendario])
   Cada actividad es una entrada del tipo fvas_evento, no HTML escrito a mano.
   Sin tablas: una rejilla de doce meses por treinta y un dias no cabe en un
   movil. Aqui es una linea de tiempo: mes, y debajo las actividades con su
   bloque de fecha a la izquierda.
   ========================================================================== */
:root{
  /* Un color por disciplina, para reconocerlas de un vistazo. Salen de la
     paleta submarina, con dos tonos anadidos para llegar a cinco distinguibles. */
  --fv-d-buceo:#1c8fa3;
  --fv-d-apnea:#7be8dc;
  --fv-d-pesca:#ff6a39;
  --fv-d-aletas:#ffc857;
  --fv-d-imagen:#b48ce8;
  --fv-d-tiro:#e86a8c;
}

.fv-cal-intro{color:var(--fv-foam-dim);max-width:660px;}
.fv-cal-vacio{
  color:var(--fv-foam-dim);
  border-left:3px solid var(--fv-line);
  padding:6px 0 6px 16px;
}

/* ---------- Selector de temporada ---------- */
/* Enlaces, no botones: cada año tiene su URL y funciona sin JavaScript. */
.fv-cal-anios{display:flex;flex-wrap:wrap;gap:4px;margin:26px 0 18px;}
.fv-cal-anio{
  font-family:var(--fv-display-wide);
  font-weight:700;font-size:15px;
  letter-spacing:.02em;
  color:var(--fv-foam-dim);
  text-decoration:none;
  padding:8px 16px;
  border:1px solid transparent;
  border-radius:3px;
  transition:color .2s, background .2s, border-color .2s;
}
.fv-cal-anio:hover{color:var(--fv-foam);background:rgba(238,246,244,0.06);}
.fv-cal-anio.is-activo{
  color:var(--fv-ink);
  background:var(--fv-foam);
  border-color:var(--fv-foam);
}
.fv-cal-anio:focus-visible{outline:2px solid var(--fv-buoy);outline-offset:2px;}

/* ---------- Filtros por disciplina ---------- */
.fv-cal-filtros{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px;}
.fv-cal-filtro{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--fv-line);
  border-radius:999px;
  background:transparent;
  color:var(--fv-foam-dim);
  font-family:var(--fv-body);
  font-size:13.5px;
  padding:8px 15px;
  cursor:pointer;
  transition:border-color .2s, color .2s, background .2s;
}
.fv-cal-filtro:hover{color:var(--fv-foam);border-color:var(--fv-foam-dim);}
.fv-cal-filtro.is-activo{
  background:rgba(28,143,163,0.16);
  border-color:var(--fv-surface);
  color:var(--fv-foam);
}
.fv-cal-filtro:focus-visible{outline:2px solid var(--fv-buoy);outline-offset:2px;}
/* Disciplina sin actividades ese año: se enseña, porque la federacion tiene
   cinco, pero no se ofrece un filtro que devolveria una lista vacia. */
.fv-cal-filtro[disabled]{opacity:.4;cursor:default;}
.fv-cal-filtro[disabled]:hover{color:var(--fv-foam-dim);border-color:var(--fv-line);}
.fv-cal-cuenta{
  font-family:var(--fv-mono);font-size:11px;
  color:rgba(199,218,216,0.6);
  border-left:1px solid var(--fv-line);
  padding-left:8px;margin-left:2px;
}
.fv-cal-punto{width:8px;height:8px;border-radius:50%;background:var(--fv-foam-dim);}
.fv-cal-recuento{
  font-family:var(--fv-mono);font-size:12px;
  letter-spacing:.04em;text-transform:uppercase;
  color:rgba(199,218,216,0.65);
  margin:0 0 28px;
}

/* ---------- Meses ---------- */
.fv-cal-mes{margin:0 0 34px;}
.fv-cal-mes-titulo{
  font-family:var(--fv-mono);
  font-size:12px;font-weight:500;
  text-transform:uppercase;letter-spacing:.14em;
  color:var(--fv-surface);
  margin:0 0 14px;padding-bottom:10px;
  border-bottom:1px solid var(--fv-line);
}
.fv-cal-lista{list-style:none;margin:0;padding:0;display:grid;gap:12px;}

/* ---------- Actividad ---------- */
.fv-ev{
  display:grid;
  /* Tres columnas: fecha, cuerpo y acciones. La tercera se encoge a lo que
     ocupen los botones, y si no hay ninguno no deja hueco. */
  grid-template-columns:100px minmax(0,1fr) auto;
  gap:28px;
  align-items:start;
  padding:18px 20px;
  border:1px solid var(--fv-line);
  border-left:3px solid var(--fv-foam-dim);
  border-radius:4px;
  background:rgba(238,246,244,0.03);
  transition:background .2s, border-color .2s, transform .2s;
}
.fv-ev:hover{background:rgba(238,246,244,0.06);transform:translateX(2px);}
.fv-ev[data-fv-disciplina="buceo"]{border-left-color:var(--fv-d-buceo);}
.fv-ev[data-fv-disciplina="apnea"]{border-left-color:var(--fv-d-apnea);}
.fv-ev[data-fv-disciplina="pesca"]{border-left-color:var(--fv-d-pesca);}
.fv-ev[data-fv-disciplina="aletas"]{border-left-color:var(--fv-d-aletas);}
.fv-ev[data-fv-disciplina="imagen"]{border-left-color:var(--fv-d-imagen);}
.fv-ev[data-fv-disciplina="tiro"]{border-left-color:var(--fv-d-tiro);}

.fv-ev-fecha{margin:0;text-align:center;line-height:1;}
.fv-ev-dia{
  display:block;
  font-family:var(--fv-display-wide);
  font-weight:800;
  font-size:30px;
  color:var(--fv-foam);
  letter-spacing:-.02em;
  white-space:nowrap;
}
.fv-ev-dia time{display:inline;}
.fv-ev-mes{
  display:block;margin-top:5px;
  font-family:var(--fv-mono);font-size:11.5px;
  letter-spacing:.12em;color:var(--fv-buoy-dim);
}

.fv-ev-titulo{
  font-family:var(--fv-display);
  font-size:19px;font-weight:700;
  line-height:1.25;margin:0 0 8px;
  color:var(--fv-foam);
}
.fv-ev-datos{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;
  margin:0;font-size:14.5px;color:var(--fv-foam-dim);
}
.fv-ev-lugar::before{content:'';}
.fv-ev-cuando{
  font-family:var(--fv-mono);font-size:12.5px;
  color:rgba(199,218,216,0.7);
}
.fv-ev-disciplina{
  display:inline-block;margin:12px 0 0;
  font-family:var(--fv-mono);font-size:11px;
  letter-spacing:.10em;text-transform:uppercase;
  border:1px solid var(--fv-line);border-radius:3px;
  padding:4px 9px;color:var(--fv-foam-dim);
}
.fv-ev[data-fv-disciplina="buceo"] .fv-ev-disciplina{color:var(--fv-d-buceo);border-color:rgba(28,143,163,0.4);}
.fv-ev[data-fv-disciplina="apnea"] .fv-ev-disciplina{color:var(--fv-d-apnea);border-color:rgba(123,232,220,0.4);}
.fv-ev[data-fv-disciplina="pesca"] .fv-ev-disciplina{color:var(--fv-d-pesca);border-color:rgba(255,106,57,0.4);}
.fv-ev[data-fv-disciplina="aletas"] .fv-ev-disciplina{color:var(--fv-d-aletas);border-color:rgba(255,200,87,0.4);}
.fv-ev[data-fv-disciplina="imagen"] .fv-ev-disciplina{color:var(--fv-d-imagen);border-color:rgba(180,140,232,0.4);}
.fv-ev[data-fv-disciplina="tiro"] .fv-ev-disciplina{color:var(--fv-d-tiro);border-color:rgba(232,106,140,0.4);}

.fv-cal-punto[data-fv-disciplina="buceo"]{background:var(--fv-d-buceo);}
.fv-cal-punto[data-fv-disciplina="apnea"]{background:var(--fv-d-apnea);}
.fv-cal-punto[data-fv-disciplina="pesca"]{background:var(--fv-d-pesca);}
.fv-cal-punto[data-fv-disciplina="aletas"]{background:var(--fv-d-aletas);}
.fv-cal-punto[data-fv-disciplina="imagen"]{background:var(--fv-d-imagen);}
.fv-cal-punto[data-fv-disciplina="tiro"]{background:var(--fv-d-tiro);}

/* ---------- Resultados y cronica ---------- */
/* Columna propia a la derecha de la ficha, centrada en vertical. Antes iban al
   final del cuerpo, donde quedaban lejos del titulo y, en las actividades ya
   celebradas, atenuadas: el enlace que mas se busca del calendario era el que
   peor se veia. */
.fv-ev-acciones{
  display:flex;
  flex-direction:column;
  gap:8px;
  align-self:center;
}
/* Ojo con el color del texto: el tema pinta `.inside-article a` con
   --cian-brillo, y eso son dos clases contra una, asi que gana al selector
   `.fv-ev-enlace`. Con el fondo cian del boton el rotulo quedaba cian sobre
   cian, es decir invisible. De ahi que el color vaya siempre con el selector
   descendiente `.fv-ev-acciones .fv-ev-enlace`, que si le gana. */
.fv-ev-enlace{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--fv-mono);font-size:12px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;
  white-space:nowrap;
  background:var(--fv-surface);
  text-decoration:none;
  border:1px solid var(--fv-surface);border-radius:3px;
  padding:9px 16px;
  transition:border-color .2s, background .2s, color .2s, transform .2s;
}
.fv-ev-acciones .fv-ev-enlace{color:var(--fv-ink);}
.fv-ev-acciones .fv-ev-enlace:hover,
.fv-ev-acciones .fv-ev-enlace:focus{
  background:var(--fv-buoy);
  border-color:var(--fv-buoy);
  color:var(--fv-ink);
  transform:translateY(-1px);
}
/* La cronica es secundaria: los resultados son el dato oficial, la noticia es
   el relato. Se distingue con contorno en vez de relleno. */
.fv-ev-enlace-sec{
  background:transparent;
  border-color:var(--fv-foam-dim);
}
.fv-ev-acciones .fv-ev-enlace-sec{color:var(--fv-foam);}
.fv-ev-acciones .fv-ev-enlace-sec:hover,
.fv-ev-acciones .fv-ev-enlace-sec:focus{
  background:rgba(255,106,57,0.14);
  border-color:var(--fv-buoy);
  color:var(--fv-foam);
}
.fv-ev-enlace:focus-visible{outline:2px solid var(--fv-buoy);outline-offset:2px;}

/* Lo ya celebrado no se esconde (sirve de historial) pero pesa menos. Se atenua
   el contenido, NO la columna de acciones: un boton medio transparente sobre
   fondo oscuro no se ve, y es justo lo que hay que poder pulsar. */
.fv-ev-pasado .fv-ev-fecha,
.fv-ev-pasado .fv-ev-cuerpo{opacity:.55;}
.fv-ev-celebrado{
  margin:10px 0 0;font-family:var(--fv-mono);
  font-size:11px;letter-spacing:.10em;text-transform:uppercase;
  color:rgba(199,218,216,0.6);
}

@media (max-width:760px){
  /* Sin ancho para tres columnas: los botones pasan debajo, a lo ancho de la
     ficha y en fila. Siguen sin atenuarse. */
  .fv-ev{grid-template-columns:100px minmax(0,1fr);}
  .fv-ev-acciones{
    /* Desde la segunda columna, no desde la primera: alineado con el titulo y
       el lugar. Debajo del numero del dia quedaba descolgado del texto al que
       pertenece. */
    grid-column:2 / -1;
    flex-direction:row;
    flex-wrap:wrap;
    margin-top:14px;
  }
}
@media (max-width:560px){
  .fv-ev{grid-template-columns:80px minmax(0,1fr);gap:18px;padding:15px 16px;}
  .fv-ev-dia{font-size:24px;}
  .fv-ev-titulo{font-size:17px;}
}

/* ---------- Vista lateral de la temporada ---------- */
/* Resumen que se queda a la vista mientras se recorre la lista: la proxima
   actividad y el indice de meses. Es navegacion, no contenido, asi que por
   debajo de 1024px no se pinta en lugar de apilarse. */
.fv-cal-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:44px;align-items:start;}
.fv-cal-principal{min-width:0;}
.fv-cal-aside{position:sticky;top:96px;}
.fv-cal-aside-bloque{
  border:1px solid var(--fv-line);
  border-radius:4px;
  background:rgba(238,246,244,0.03);
  padding:20px;
  margin:0 0 14px;
}
.fv-cal-aside-titulo{
  font-family:var(--fv-mono);
  font-size:11.5px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--fv-surface);
  margin:0 0 12px;
}
.fv-cal-aside-proxima-fecha{
  font-family:var(--fv-mono);font-size:12px;
  letter-spacing:.06em;color:var(--fv-buoy-dim);margin:0 0 5px;
}
.fv-cal-aside-proxima-nombre{
  font-family:var(--fv-display);font-size:17px;font-weight:700;
  line-height:1.25;color:var(--fv-foam);margin:0;
  border-left:3px solid var(--fv-foam-dim);padding-left:11px;
}
.fv-cal-aside-proxima-nombre[data-fv-disciplina="buceo"]{border-left-color:var(--fv-d-buceo);}
.fv-cal-aside-proxima-nombre[data-fv-disciplina="apnea"]{border-left-color:var(--fv-d-apnea);}
.fv-cal-aside-proxima-nombre[data-fv-disciplina="pesca"]{border-left-color:var(--fv-d-pesca);}
.fv-cal-aside-proxima-nombre[data-fv-disciplina="aletas"]{border-left-color:var(--fv-d-aletas);}
.fv-cal-aside-proxima-nombre[data-fv-disciplina="imagen"]{border-left-color:var(--fv-d-imagen);}
.fv-cal-aside-proxima-nombre[data-fv-disciplina="tiro"]{border-left-color:var(--fv-d-tiro);}
.fv-cal-aside-proxima-lugar{font-size:13.5px;color:var(--fv-foam-dim);margin:7px 0 0;padding-left:14px;}

.fv-cal-indice{list-style:none;margin:0;padding:0;}
.fv-cal-indice-item + .fv-cal-indice-item{border-top:1px solid var(--fv-line);}
.fv-cal-indice a{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:9px 0;
  color:var(--fv-foam-dim);
  text-decoration:none;
  transition:color .2s;
}
.fv-cal-indice a:hover{color:var(--fv-foam);}
.fv-cal-indice a:focus-visible{outline:2px solid var(--fv-buoy);outline-offset:2px;}
.fv-cal-indice-mes{font-size:14px;}
.fv-cal-indice-cuenta{
  font-family:var(--fv-mono);font-size:11.5px;
  color:rgba(199,218,216,0.6);
}
.fv-cal-aside-total{
  font-family:var(--fv-mono);font-size:11.5px;
  letter-spacing:.06em;text-transform:uppercase;
  color:rgba(199,218,216,0.6);
  margin:14px 0 0;padding-top:12px;
  border-top:1px solid var(--fv-line);
}
/* El ancla no debe quedar debajo de la cabecera fija al saltar de mes. */
.fv-cal-mes{scroll-margin-top:96px;}

@media (max-width:1024px){
  .fv-cal-layout{grid-template-columns:1fr;gap:0;}
  .fv-cal-aside{display:none;}
}

/* ==========================================================================
   Clubes: mapa de territorios + listado (shortcode [fvas_clubes])
   El mapa es SVG en linea generado por tools/build_mapa.py. Sin teselas ni
   librerias externas: ninguna visita envia su IP a un servidor ajeno, y el
   listado funciona igual sin JavaScript.
   ========================================================================== */
.fv-clubes{
  display:grid;
  grid-template-columns:minmax(320px,42%) 1fr;
  gap:40px;
  align-items:start;
}
/* El mapa se queda a la vista mientras se recorre el listado. */
.fv-clubes-mapa{position:sticky;top:96px;}

.fv-mapa{width:100%;height:auto;display:block;}
.fv-mapa-zona path{
  fill:rgba(28,143,163,0.18);
  stroke:var(--fv-surface);
  stroke-width:1.2;
  transition:fill .2s, opacity .2s;
  cursor:pointer;
}
.fv-mapa-zona:hover path{fill:rgba(255,106,57,0.28);stroke:var(--fv-buoy);}
.fv-mapa-zona.is-atenuada path{fill:rgba(28,143,163,0.06);stroke:rgba(28,143,163,0.35);}
.fv-mapa-zona.is-atenuada text{opacity:.35;}
.fv-mapa-nombre{
  font-family:var(--fv-display-wide);
  font-size:17px;font-weight:700;
  fill:var(--fv-foam);
  text-anchor:middle;
  pointer-events:none;
}
.fv-mapa-cuenta{
  font-family:var(--fv-mono);
  font-size:12px;
  fill:var(--fv-buoy-dim);
  text-anchor:middle;
  pointer-events:none;
}
.fv-mapa-pie{
  font-size:11.5px;
  color:rgba(199,218,216,0.55);
  margin:6px 0 18px;
}

/* Un punto por club del que se conoce la localidad. Los que comparten pueblo se
   separan un poco en circulo desde el PHP, para que no se tapen. */
.fv-mapa-punto circle{
  fill:var(--fv-buoy);
  stroke:var(--fv-abyss);
  stroke-width:1.5;
  cursor:pointer;
  transition:r .15s ease, fill .15s ease;
}
.fv-mapa-punto:hover circle,
.fv-mapa-punto:focus circle,
.fv-mapa-punto.is-resaltado circle{
  fill:var(--fv-foam);
  r:8;
}
.fv-mapa-punto:focus{outline:none;}
.fv-mapa-punto:focus circle{stroke:var(--fv-buoy);stroke-width:2.5;}
.fv-mapa-zona.is-atenuada ~ .fv-mapa-puntos{opacity:1;}

/* Ficha resaltada desde el mapa */
.fv-club.is-resaltado{
  background:rgba(255,106,57,0.10);
  border-left-color:var(--fv-buoy);
}

.fv-clubes-filtros{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px;}

.fv-clubes-grupo{margin:0 0 34px;}
.fv-clubes-ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.fv-club{
  border:1px solid var(--fv-line);
  border-left:3px solid var(--fv-surface);
  border-radius:4px;
  background:rgba(238,246,244,0.03);
  padding:16px 18px;
  transition:background .2s, transform .2s;
}
.fv-club:hover{background:rgba(238,246,244,0.06);transform:translateX(2px);}
.fv-club-nombre{
  font-family:var(--fv-display);
  font-size:17px;font-weight:700;
  margin:0 0 6px;color:var(--fv-foam);
}
.fv-club-donde{margin:0 0 8px;font-size:14.5px;color:var(--fv-foam-dim);}
.fv-club-disciplinas{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px;}
.fv-club-disciplinas .fv-ev-disciplina{margin:0;}
.fv-club-contacto{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;font-size:14px;}
.fv-club-contacto a{
  color:var(--fv-surface);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .2s, border-color .2s;
  word-break:break-word;
}
.fv-club-contacto a:hover{color:var(--fv-foam);border-bottom-color:var(--fv-buoy);}

@media (max-width:900px){
  .fv-clubes{grid-template-columns:1fr;gap:28px;}
  /* En movil el mapa no debe comerse la pantalla ni quedarse pegado arriba. */
  .fv-clubes-mapa{position:static;}
  .fv-mapa{max-width:420px;margin:0 auto;}
}

/* ==========================================================================
   Noticias (pagina de entradas / blog)
   WordPress imprime body.blog en el listado de posts. En interiores de post
   individual imprime body.single-post.
   ========================================================================== */

/* Quitar la barra lateral: ancho completo para el contenido */
body.blog .site-content .content-area,
body.blog .site-content .site-main{width:100%;float:none;}
body.blog #right-sidebar,
body.blog #left-sidebar,
body.blog .sidebar{display:none;}

/* Titulos de los posts.
   El fondo de esta zona es oscuro (el personalizador pone fondo-profundo en
   body y en .inside-article), y GeneratePress pinta .entry-title a con
   --contrast (#222): gris oscuro sobre azul casi negro, ilegible. Por eso van
   en espuma, no en un tono de la gama oscura. */
body.blog .entry-title,
body.blog .entry-title a,
body.single-post .entry-title,
body.single-post .entry-title a{
  color:var(--fv-foam);
  font-family:var(--fv-display);
  font-weight:700;
  text-decoration:none;
  transition:color .2s;
}
body.blog .entry-title a:hover,
body.single-post .entry-title a:hover{color:var(--fv-buoy-dim);}

/* Mismo motivo: el hover global del tema manda los enlaces a --contrast, que
   sobre fondo oscuro desaparece. */
.inside-article a:hover,
.inside-article a:focus,
.entry-content a:hover,
.entry-content a:focus{color:var(--fv-buoy-dim);}

/* Tambien en la pagina del post individual */
body.single-post .site-content .content-area,
body.single-post .site-content .site-main{width:100%;float:none;}
body.single-post #right-sidebar,
body.single-post #left-sidebar,
body.single-post .sidebar{display:none;}

/* ---------- Listado como tarjetas ---------- */
body.blog .site-main > article{
  border:1px solid var(--fv-line);
  border-radius:4px;
  margin-bottom:16px;
  transition:border-color .2s, background .2s;
}
body.blog .site-main > article:hover{border-color:rgba(238,246,244,0.3);}
body.blog .site-main > article .inside-article{background:rgba(238,246,244,0.03);}
body.blog .entry-title{font-size:clamp(20px,2.4vw,26px);line-height:1.2;margin:0 0 10px;}
body.blog .entry-meta{
  font-family:var(--fv-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:rgba(199,218,216,0.7);
}
/* El autor siempre es la federacion y los comentarios no se usan como canal:
   dos datos que solo anaden ruido en el listado. */
body.blog .entry-meta .byline,
body.blog .entry-meta .comments-link{display:none;}
body.blog .entry-summary{margin-top:14px;color:var(--fv-foam-dim);}
body.blog .entry-summary a.read-more{
  display:inline-block;
  font-family:var(--fv-mono);
  font-size:12.5px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--fv-buoy-dim);
  text-decoration:none;
}
/* La categoria del pie: se presenta como etiqueta, que es lo que es */
body.blog footer.entry-meta .cat-links a,
body.single-post footer.entry-meta .cat-links a{
  color:var(--fv-surface);
  text-decoration:none;
}
body.blog footer.entry-meta .gp-icon,
body.single-post footer.entry-meta .gp-icon{opacity:.6;}

/* ---------- Barra de busqueda y filtros ---------- */
.fv-nt-barra{margin:0 0 26px;}

.fv-nt-buscador{display:flex;gap:10px;margin:0 0 16px;max-width:560px;}
.fv-nt-buscador input[type="search"]{
  flex:1;
  padding:12px 14px;
  border:1px solid var(--fv-line);
  border-radius:3px;
  background:rgba(238,246,244,0.05);
  color:var(--fv-foam);
  font-family:var(--fv-body);
  font-size:16px; /* 16px evita el zoom automatico en iOS */
  line-height:1.4;
}
.fv-nt-buscador input[type="search"]::placeholder{color:rgba(199,218,216,0.65);}
.fv-nt-buscador input[type="search"]:focus{
  outline:2px solid var(--fv-surface);
  outline-offset:2px;
  border-color:var(--fv-surface);
}
.fv-nt-buscar-btn{
  border:0;cursor:pointer;
  padding:12px 22px;border-radius:3px;
  font-family:var(--fv-body);font-weight:700;font-size:14.5px;
  background:var(--fv-buoy);color:var(--fv-ink);
  transition:background .2s;
}
.fv-nt-buscar-btn:hover{background:var(--fv-buoy-dim);}
.fv-nt-buscar-btn:focus-visible{outline:2px solid var(--fv-foam);outline-offset:2px;}

.fv-nt-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 6px;}
.fv-nt-chip{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--fv-line);
  border-radius:999px;
  padding:7px 15px;
  font-size:13.5px;
  color:var(--fv-foam-dim);
  text-decoration:none;
  transition:border-color .2s, color .2s, background .2s;
}
.fv-nt-chip:hover{color:var(--fv-foam);border-color:var(--fv-foam-dim);}
.fv-nt-chip.is-activa{
  background:rgba(28,143,163,0.16);
  border-color:var(--fv-surface);
  color:var(--fv-foam);
}
.fv-nt-chip:focus-visible{outline:2px solid var(--fv-buoy);outline-offset:2px;}
/* Categoria sin noticias todavia: se enseña para contar las areas de la
   federacion, pero no se ofrece un filtro que devolveria una lista vacia. */
.fv-nt-chip-vacia{opacity:.4;}
.fv-nt-chip-vacia:hover{color:var(--fv-foam-dim);border-color:var(--fv-line);}

.fv-nt-resumen{
  font-family:var(--fv-mono);
  font-size:12.5px;
  color:rgba(199,218,216,0.75);
  margin:14px 0 0;
}
.fv-nt-limpiar{margin-left:10px;color:var(--fv-surface);}

@media (max-width:560px){
  .fv-nt-buscador{flex-direction:column;}
  .fv-nt-buscar-btn{width:100%;}
}

/* ---------- Bloque de ultimas noticias (paginas de disciplina) ---------- */
.fv-nt-bloque{margin:36px 0 0;clear:both;}
.fv-nt-bloque-titulo{
  font-family:var(--fv-mono);
  font-size:12px;font-weight:500;
  text-transform:uppercase;letter-spacing:.14em;
  color:var(--fv-surface);
  margin:0 0 14px;padding-bottom:10px;
  border-bottom:1px solid var(--fv-line);
}
.fv-nt-mini{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.fv-nt-mini-item{
  border:1px solid var(--fv-line);
  border-left:3px solid var(--fv-surface);
  border-radius:4px;
  background:rgba(238,246,244,0.03);
  padding:14px 16px;
}
.fv-nt-mini-fecha{
  font-family:var(--fv-mono);font-size:11.5px;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--fv-buoy-dim);margin:0 0 6px;
}
.fv-nt-mini-titulo{font-family:var(--fv-display);font-size:16.5px;font-weight:700;margin:0;line-height:1.3;}
.fv-nt-mini-titulo a{color:var(--fv-foam);text-decoration:none;}
.fv-nt-mini-titulo a:hover{color:var(--fv-buoy-dim);}
.fv-nt-bloque-pie{margin:14px 0 0;font-size:14px;}

/* ==========================================================================
   Paginas de disciplina: lateral de documentos y resultados
   El bloque flota a la derecha y el texto de la pagina fluye a su izquierda.
   Con float y no con rejilla porque asi el contenido de la pagina sigue siendo
   una sucesion normal de bloques de WordPress, sin HTML abierto a medias.
   ========================================================================== */
.fv-disc-lateral{
  float:right;
  width:320px;
  margin:0 0 28px 36px;
  border:1px solid var(--fv-line);
  border-radius:4px;
  background:rgba(238,246,244,0.03);
  padding:22px;
}
.fv-disc-bloque{margin:0 0 22px;}
.fv-disc-bloque:last-of-type{margin-bottom:0;}
.fv-disc-titulo{
  font-family:var(--fv-mono);
  font-size:11.5px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--fv-surface);
  margin:0 0 12px;
}
.fv-disc-docs,
.fv-disc-eventos{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.fv-disc-docs a{
  display:flex;align-items:baseline;gap:9px;
  color:var(--fv-foam);text-decoration:none;
  font-size:14px;line-height:1.4;
}
.fv-disc-docs a:hover .fv-disc-doc-titulo{color:var(--fv-buoy-dim);}
.fv-disc-doc-tipo{
  flex-shrink:0;
  font-family:var(--fv-mono);font-size:10px;font-weight:700;
  letter-spacing:.08em;
  color:var(--fv-foam-dim);
  border:1px solid var(--fv-line);border-radius:3px;
  padding:2px 6px;
}
.fv-disc-ev-fecha{
  font-family:var(--fv-mono);font-size:11.5px;
  letter-spacing:.06em;color:var(--fv-buoy-dim);margin:0 0 3px;
}
.fv-disc-ev-nombre{font-size:14.5px;color:var(--fv-foam);margin:0;line-height:1.35;}
.fv-disc-ev-lugar{font-size:13px;color:var(--fv-foam-dim);margin:3px 0 0;}
.fv-disc-ev-enlaces{display:flex;gap:14px;margin:6px 0 0;font-size:13px;}
.fv-disc-pie{margin:20px 0 0;padding-top:16px;border-top:1px solid var(--fv-line);font-size:13.5px;}

@media (max-width:900px){
  /* Sin espacio para dos columnas: el lateral pasa a ser un bloque mas, y va
     primero porque es la informacion practica (fechas y reglamentos). */
  .fv-disc-lateral{float:none;width:auto;margin:0 0 28px;}
}

/* ==========================================================================
   Paginas de disciplina: ficha rapida, para iniciarte y material
   Tres bloques que se repiten en las 6 paginas de disciplina.
   ========================================================================== */

/* Icono comun: SVG de Lucide, stroke con currentColor para que herede el
   color del texto que lo acompana. */
.fv-disc-icon{
  width:22px;height:22px;flex-shrink:0;
  stroke-width:1.8;
}

/* ---------- Ficha rapida: 3-4 datos clave con icono ---------- */
.fv-disc-facts{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:1px;
  background:var(--fv-line);
  border:1px solid var(--fv-line);
  border-radius:6px;
  margin:32px 0 40px;
  overflow:hidden;
}
.fv-disc-fact{
  background:var(--fv-deep);
  padding:22px 20px;
  display:flex;
  align-items:flex-start;
  gap:14px;
}
.fv-disc-fact .fv-disc-icon{color:var(--fv-surface);margin-top:2px;}
.fv-disc-fact-label{
  display:block;
  font-family:var(--fv-mono);font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--fv-foam-dim);margin:0 0 5px;
}
.fv-disc-fact-valor{
  display:block;
  font-family:var(--fv-display);font-size:16.5px;font-weight:700;
  color:var(--fv-foam);line-height:1.3;
}

/* ---------- Para iniciarte: que hace falta para empezar, sin escala ---------- */
/* Antes era una escala de "nivel de dificultad" de 1 a 4 puntos, pero no hay
   una unidad real que la sostenga (¿dificultad frente a que?): quedaba como
   relleno visual sin informacion. Un aviso directo de que hace falta para
   empezar es mas util y no finge precision que no existe. */
.fv-disc-inicio{
  display:flex;align-items:flex-start;gap:18px;
  border:1px solid var(--fv-line);border-radius:6px;
  padding:22px 24px;margin:0 0 40px;
  background:rgba(28,143,163,0.07);
  border-left:3px solid var(--fv-surface);
}
.fv-disc-inicio .fv-disc-icon{
  color:var(--fv-surface);flex-shrink:0;margin-top:2px;
}
.fv-disc-inicio-titulo{
  font-family:var(--fv-display);font-size:17px;font-weight:700;
  color:var(--fv-foam);margin:0 0 6px;
}
.fv-disc-inicio-desc{font-size:14.5px;line-height:1.6;color:var(--fv-foam-dim);margin:0;}

/* ---------- Material necesario ---------- */
/* Siempre 4 tarjetas por pagina: 2 columnas fijas y no auto-fill, para que no
   quede una tarjeta suelta en su propia fila cuando el ancho no divide
   exacto (pasaba con auto-fill en anchos intermedios). */
.fv-disc-material{margin:0 0 40px;}
.fv-disc-material-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  list-style:none;margin:0;padding:0;
}
.fv-disc-material-item{
  display:flex;align-items:flex-start;gap:14px;
  border:1px solid var(--fv-line);border-radius:6px;
  padding:18px 18px;background:rgba(238,246,244,0.03);
}
.fv-disc-material-item .fv-disc-icon{
  color:var(--fv-buoy-dim);margin-top:2px;
}
.fv-disc-material-item h4{
  font-family:var(--fv-display);font-size:15px;font-weight:700;
  color:var(--fv-foam);margin:0 0 5px;line-height:1.3;
}
.fv-disc-material-item p{
  font-size:13.5px;line-height:1.55;color:var(--fv-foam-dim);margin:0;
}
.fv-disc-material-nota{
  font-size:13.5px;color:var(--fv-foam-dim);
  margin:16px 0 0;padding-top:14px;
  border-top:1px dashed var(--fv-line);
}

@media (max-width:520px){
  .fv-disc-facts{grid-template-columns:1fr 1fr;}
  .fv-disc-material-grid{grid-template-columns:1fr;}
  .fv-disc-inicio{flex-direction:column;gap:10px;}
}

/* ---------- Titulaciones / niveles: tarjetas progresivas ---------- */
/* Cada titulacion es una tarjeta con cabecera de color y cuerpo con los datos.
   Grid de 3 columnas a la misma altura. */
.fv-disc-titulaciones{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
  margin:0 0 44px;
}
@media (max-width:900px){.fv-disc-titulaciones{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.fv-disc-titulaciones{grid-template-columns:1fr;}}
}
.fv-disc-titulo-card{
  border:1px solid var(--fv-line);border-radius:6px;
  overflow:hidden;
  background:var(--fv-deep);
  display:flex;flex-direction:column;
  transition:border-color .2s, transform .2s;
}
.fv-disc-titulo-card:hover{
  border-color:var(--fv-surface,#1c8fa3);
  transform:translateY(-4px);
}
.fv-disc-titulo-card-head{
  display:flex;align-items:center;gap:12px;
  padding:18px 22px;
  background:rgba(28,143,163,0.12);
  border-bottom:1px solid var(--fv-line);
}
.fv-disc-titulo-card-head .fv-disc-icon{color:var(--fv-surface);}
.fv-disc-titulo-card-img{
  width:100%;aspect-ratio:16/9;object-fit:cover;display:block;
}
.fv-disc-titulo-card-nombre{
  font-family:var(--fv-display);font-size:18px;font-weight:700;
  color:var(--fv-foam);margin:0;
}
.fv-disc-titulo-card-equiv{
  margin-left:auto;
  font-family:var(--fv-mono);font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--fv-surface);white-space:nowrap;
}
.fv-disc-titulo-card-body{padding:20px 22px;flex:1;}
.fv-disc-titulo-card-body p{
  font-size:14.5px;line-height:1.65;color:var(--fv-foam-dim);margin:0 0 12px;
}
.fv-disc-titulo-card-body p:last-child{margin-bottom:0;}
.fv-disc-titulo-card-datos{
  list-style:none;margin:12px 0 0;padding:12px 0 0;
  border-top:1px dashed var(--fv-line);
  display:grid;gap:8px;
}
.fv-disc-titulo-card-datos li{
  font-size:13px;color:var(--fv-foam-dim);
  display:flex;align-items:baseline;gap:6px;
}
.fv-disc-titulo-card-datos li strong{color:var(--fv-foam);font-weight:600;}

/* ---------- Carrusel de galería ---------- */
.fv-carousel{
  position:relative;overflow:hidden;border-radius:8px;
  border:1px solid var(--fv-line,rgba(238,246,244,0.14));
  margin:0 0 32px;
}
.fv-carousel-track{
  display:flex;transition:transform .4s ease;
}
.fv-carousel-slide{
  min-width:100%;
}
.fv-carousel-slide img{
  width:100%;height:auto;display:block;
  aspect-ratio:16/9;object-fit:cover;
}
.fv-carousel-btn{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(6,22,32,0.7);border:none;color:var(--fv-foam,#eef6f4);
  font-size:22px;padding:12px 14px;cursor:pointer;border-radius:4px;
  transition:background .2s;z-index:2;
}
.fv-carousel-btn:hover{background:rgba(6,22,32,0.92);}
.fv-carousel-prev{left:12px;}
.fv-carousel-next{right:12px;}
.fv-carousel-dots{
  position:absolute;bottom:14px;left:50%;transform:translateX(-50%);
  display:flex;gap:8px;z-index:2;
}
.fv-carousel-dot{
  width:10px;height:10px;border-radius:50%;border:none;
  background:rgba(238,246,244,0.4);cursor:pointer;
  transition:background .2s;padding:0;
}
.fv-carousel-dot.active{background:var(--fv-foam,#eef6f4);}

/* ---------- Modalidades indoor/outdoor (apnea) ---------- */
.fv-disc-modalidades{
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
  margin:0 0 44px;
}
.fv-disc-modalidad-grupo{
  border:1px solid var(--fv-line);border-radius:6px;
  padding:24px 22px;background:rgba(238,246,244,0.03);
}
.fv-disc-modalidad-grupo h4{
  font-family:var(--fv-display);font-size:17px;font-weight:700;
  color:var(--fv-foam);margin:0 0 6px;
}
.fv-disc-modalidad-grupo-sub{
  font-family:var(--fv-mono);font-size:10.5px;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--fv-surface);margin:0 0 14px;display:block;
}
.fv-disc-modalidad-lista{
  list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;
}
.fv-disc-modalidad-lista li{
  font-size:14px;line-height:1.5;color:var(--fv-foam-dim);
  padding-left:14px;
  border-left:2px solid var(--fv-line);
}
.fv-disc-modalidad-lista li strong{color:var(--fv-foam);font-weight:600;}

@media (max-width:640px){
  .fv-disc-modalidades{grid-template-columns:1fr;}
}