/* Estilos de página del sitio EHMT — construidos sobre los tokens del sistema de diseño.
   Las clases ehmt-* vienen de css/tokens/components.css; aquí sólo hay composición de página. */

/* ---------- Estructura ---------- */
.contenedor{max-width:var(--ancho-contenido);margin:0 auto;padding:0 var(--canal-escritorio)}
.contenedor--estrecho{max-width:var(--ancho-estrecho)}
.seccion{padding:var(--seccion-y) 0}
.seccion--alterna{background:var(--fondo-alterno)}
.seccion--blanca{background:#fff}
.seccion--oscura{background:var(--verde-900);color:var(--texto-inverso-suave)}
.seccion--oscura h2,.seccion--oscura h3{color:#fff}
.seccion--sin-arriba{padding-top:0}
.seccion--compacta{padding-bottom:var(--e-6)}
.reticula{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--e-5)}
.dos-columnas{display:grid;grid-template-columns:1fr 1fr;gap:var(--e-8);align-items:center}
.dos-columnas--arriba{align-items:start}
.migas{display:flex;flex-wrap:wrap;gap:.5rem;font-size:var(--tam-xs);color:var(--texto-suave);margin-bottom:var(--e-4)}
.migas a{color:var(--texto-suave)}
@media (max-width:900px){
  .contenedor{padding:0 var(--canal-movil)}
  .dos-columnas{grid-template-columns:1fr;gap:var(--e-6)}
}

/* ---------- Cabecera de sección ---------- */
.ehmt-seccion-cab .ehmt-etiqueta{display:block;margin-bottom:var(--e-1)}
.cab-con-boton{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--e-5);flex-wrap:wrap}

/* ---------- Hero de portada ---------- */
.hero-marco{padding:var(--e-5) var(--canal-escritorio) 0}
.hero-marco .ehmt-foto{max-width:var(--ancho-contenido);margin:0 auto;min-height:min(74vh,560px);display:flex}
.hero-marco .ehmt-foto__contenido{width:100%}
.hero-titulo{font-size:var(--titular-hero);line-height:var(--linea-apretada);margin:.6rem 0 .4rem;max-width:14ch}
.hero-lema{font-size:var(--tam-3xl);margin:0;color:#fff}
.hero-acciones{display:flex;gap:var(--e-3);flex-wrap:wrap;margin-top:var(--e-4)}
@media (max-width:900px){.hero-marco{padding:var(--e-4) var(--canal-movil) 0}}

/* ---------- Bloque de cifras ---------- */
.cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--e-6)}
.cifras-fila{display:grid;grid-template-columns:minmax(240px,1fr) 2fr;gap:var(--e-8);align-items:center}
@media (max-width:900px){.cifras-fila{grid-template-columns:1fr;gap:var(--e-6)}}

/* ---------- Llamada a hacerse socio ---------- */
.llamada-socio{position:relative;overflow:hidden;text-align:center}
.llamada-socio__motivo{position:absolute;inset:auto 0 0 0;height:140px;background:url("../assets/motivo-perfil-blanco.png") repeat-x bottom center/auto 100%;opacity:.1;pointer-events:none}
.llamada-socio .contenedor{position:relative;display:flex;flex-direction:column;align-items:center;gap:var(--e-4)}
.llamada-socio h2{color:#fff;max-width:22ch;margin:0}
.llamada-socio p{max-width:50ch;margin:0}
.llamada-socio .ehmt-lema{font-size:var(--tam-3xl);color:#fff}

/* ---------- Listas con icono ---------- */
.lista-iconos{list-style:none;padding:0;margin:0 0 var(--e-5);display:grid;gap:var(--e-3)}
.lista-iconos li{display:flex;gap:var(--e-3);align-items:flex-start}

/* ---------- Calendario mensual ---------- */
.cal{background:#fff;border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-tarjeta);padding:var(--e-5);box-shadow:var(--sombra-1)}
.cal__cabecera{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--e-4)}
.cal__mes{font-family:var(--fuente-titulo);font-size:var(--tam-l);color:var(--verde-900)}
.cal__reticula{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal__dia-nombre{text-align:center;font-size:var(--tam-2xs);letter-spacing:var(--track-mayus);text-transform:uppercase;color:var(--texto-suave);padding-bottom:4px}
.cal__dia{aspect-ratio:1;border:var(--borde-1) solid var(--crema-300);border-radius:var(--radio-s);background:#fff;color:var(--texto-cuerpo);font-family:var(--fuente-texto);font-size:var(--tam-s);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0}
.cal__dia--vacio{border:none;background:transparent}
.cal__dia--evento{border:none;background:var(--verde-900);color:#fff;font-weight:var(--peso-semi);cursor:pointer}
.cal__dia--evento:focus-visible{outline:none;box-shadow:var(--foco)}
.cal__punto{width:5px;height:5px;border-radius:999px;background:var(--arcilla-300)}
.cal__leyenda{display:flex;gap:var(--e-4);margin-top:var(--e-4);font-size:var(--tam-2xs);color:var(--texto-suave)}
.cal__leyenda span{display:flex;align-items:center;gap:.4rem}
.cal__muestra{width:12px;height:12px;border-radius:3px}
.vista-mes{display:grid;grid-template-columns:1.3fr 1fr;gap:var(--e-6);align-items:start}
@media (max-width:900px){.vista-mes{grid-template-columns:1fr}}

/* Conmutador lista/mes */
.conmutador{display:flex;background:#fff;border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-pastilla);padding:4px}
.conmutador button{display:flex;align-items:center;gap:.4rem;border:0;cursor:pointer;border-radius:var(--radio-pastilla);padding:.5rem 1rem;font-family:var(--fuente-texto);font-size:var(--tam-xs);font-weight:var(--peso-semi);background:transparent;color:var(--verde-900)}
.conmutador button[aria-pressed=true]{background:var(--verde-900);color:#fff}
.filtros{display:flex;gap:var(--e-3);flex-wrap:wrap;align-items:center}

/* Filtros de categoría (noticias) */
.pildoras{display:flex;gap:var(--e-2);flex-wrap:wrap}
.pildora{border:var(--borde-1) solid var(--borde-medio);background:transparent;color:var(--verde-900);border-radius:var(--radio-pastilla);padding:.45rem 1rem;font-family:var(--fuente-texto);font-size:var(--tam-xs);font-weight:var(--peso-semi);cursor:pointer;text-decoration:none}
.pildora--activa{border-color:transparent;background:var(--verde-900);color:#fff}

/* ---------- Ficha de actividad ---------- */
.ficha{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--e-8);align-items:start}
.ficha__lateral{background:#fff;border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-tarjeta);padding:var(--e-5);box-shadow:var(--sombra-2);position:sticky;top:90px;display:grid;gap:var(--e-4)}
.ficha__datos{display:grid;gap:var(--e-2);font-size:var(--tam-s)}
.ficha__datos span{display:flex;gap:.6rem;align-items:center}
@media (max-width:900px){.ficha{grid-template-columns:1fr}.ficha__lateral{position:static}}

/* ---------- Noticia (artículo) ---------- */
.articulo-cabecera .ehmt-badge{margin-bottom:var(--e-3)}
.articulo-meta{font-size:var(--tam-xs);text-transform:uppercase;letter-spacing:var(--track-etiqueta);color:var(--texto-suave)}
.articulo-entradilla{font-size:var(--tam-l);font-family:var(--fuente-titulo);color:var(--texto-titulo)}
.articulo-compartir{background:var(--verde-50);border-radius:var(--radio-s);padding:var(--e-4) var(--e-5);margin-bottom:var(--e-5)}
.articulo-cita{margin:var(--e-6) 0;padding:0 0 0 var(--e-5);border-left:var(--borde-grueso) solid var(--arcilla-400);font-family:var(--fuente-titulo);font-size:var(--tam-xl);color:var(--verde-900);line-height:var(--linea-titulo)}
.articulo-cita footer{font-family:var(--fuente-texto);font-size:var(--tam-s);color:var(--texto-suave);margin-top:var(--e-2)}
.articulo-pie-compartir{border-top:var(--borde-1) solid var(--borde-suave);padding-top:var(--e-5);margin-top:var(--e-6)}

/* ---------- Cronología (hitos) ---------- */
.hitos{display:grid;gap:var(--e-4);align-content:start}
.hito{display:grid;grid-template-columns:72px 1fr;gap:var(--e-4);padding-bottom:var(--e-4);border-bottom:var(--borde-1) solid var(--borde-suave)}
.hito__ano{font-family:var(--fuente-titulo);font-size:var(--tam-xl);font-weight:var(--peso-fuerte);color:var(--arcilla-500)}
.hito strong{display:block;font-family:var(--fuente-titulo);font-size:var(--tam-l)}
.hito span{font-size:var(--tam-s);color:var(--texto-cuerpo)}

/* ---------- Valores ---------- */
.valor{background:var(--crema-100);border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-tarjeta);padding:var(--e-5)}
.valor h3{font-size:var(--tam-l);margin:var(--e-3) 0 var(--e-2)}
.valor p{margin:0;font-size:var(--tam-s)}
.seccion--blanca .valor{background:var(--crema-100)}

/* ---------- Colaboradores ---------- */
.colaboradores{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--e-4)}
.colaborador{background:#fff;border:1px dashed var(--borde-medio);border-radius:var(--radio-tarjeta);padding:var(--e-4);text-align:center;font-size:var(--tam-s);color:var(--texto-suave)}

/* ---------- Formularios / paneles ---------- */
.panel{background:#fff;border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-tarjeta);padding:var(--e-6);box-shadow:var(--sombra-2)}
.panel--suave{box-shadow:var(--sombra-1);padding:var(--e-5)}
.form-reticula{display:grid;grid-template-columns:1fr 1fr;gap:var(--e-4) var(--e-5)}
.form-reticula .ancho-completo{grid-column:1 / -1}
.form-pila{display:grid;gap:var(--e-4)}
.mensaje-exito{background:var(--exito-suave);border-radius:var(--radio-tarjeta);padding:var(--e-6);text-align:center;color:#215923}
.mensaje-exito h2,.mensaje-exito strong{color:#215923}
.mensaje-exito p{color:#215923;margin:0}
@media (max-width:700px){.form-reticula{grid-template-columns:1fr}}

/* ---------- Área de socios ---------- */
.acceso{min-height:72vh;display:grid;grid-template-columns:1fr 1fr}
.acceso__marca{background:var(--verde-900);position:relative;display:grid;place-items:center;padding:var(--e-9) var(--e-7)}
.acceso__motivo{position:absolute;inset:auto 0 0 0;height:160px;background:url("../assets/motivo-perfil-blanco.png") repeat-x bottom center/auto 100%;opacity:.1;pointer-events:none}
.acceso__texto{position:relative;max-width:34ch;color:#fff}
.acceso__texto h2{color:#fff}
.acceso__texto p{color:var(--texto-inverso-suave)}
.acceso__formulario{display:grid;place-items:center;padding:var(--e-9) var(--e-7)}
.acceso__formulario form,.acceso__formulario .form-pila{width:100%;max-width:380px}
@media (max-width:900px){.acceso{grid-template-columns:1fr}.acceso__marca{padding:var(--e-7) var(--canal-movil)}}
.aviso-interno{display:grid;gap:.3rem;padding:var(--e-3) var(--e-4);background:var(--crema-100);border-radius:var(--radio-s)}
.aviso-interno--nuevo{background:var(--verde-50)}
.aviso-interno strong{font-family:var(--fuente-titulo);font-size:var(--tam-m)}
.aviso-interno time{font-size:var(--tam-2xs);color:var(--texto-suave);text-transform:uppercase;letter-spacing:var(--track-etiqueta)}
.doc-fila{display:grid;grid-template-columns:auto 1fr auto;gap:var(--e-4);align-items:center;padding:var(--e-3) 0;border-top:var(--borde-1) solid var(--borde-suave)}
.doc-fila:first-of-type{border-top:none}
.doc-fila strong{font-size:var(--tam-s);display:block;color:var(--texto-titulo)}
.doc-fila small{font-size:var(--tam-2xs);color:var(--texto-suave)}

/* ---------- Página legal ---------- */
.texto-legal{max-width:var(--ancho-texto)}
.texto-legal h2{font-size:var(--tam-xl);margin-top:var(--e-6)}

/* ---------- Pie: columnas ---------- */
.ehmt-pie__legal{grid-column:1 / -1}

/* Pie con fotografía de fondo (sustituye al motivo repetido) */
.ehmt-pie__foto{position:absolute;inset:0;background-position:center;background-size:cover;opacity:.16;pointer-events:none}
.ehmt-pie__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--verde-900) 0%,rgba(3,32,21,.35) 55%,var(--verde-900) 100%)}

/* Colaboradores en el pie */
.ehmt-pie__colabo{grid-column:1 / -1;border-top:var(--borde-1) solid var(--borde-oscuro);padding-top:var(--e-5);display:flex;flex-direction:column;gap:var(--e-3)}
.ehmt-pie__colabo span{font-size:var(--tam-2xs);text-transform:uppercase;letter-spacing:var(--track-mayus);color:var(--texto-inverso-suave)}
.ehmt-pie__colabo-fila{display:flex;flex-wrap:wrap;gap:var(--e-5) var(--e-7);align-items:center}
.ehmt-pie__colabo-fila img{height:34px;width:auto;opacity:.8;transition:opacity var(--dur-media) var(--curva-salida)}
.ehmt-pie__colabo-fila a:hover img{opacity:1}

/* Colaboradores en color (página La asociación) */
.colabo-tarjeta{background:#fff;border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-tarjeta);padding:var(--e-4);display:grid;place-items:center;min-height:96px}
.colabo-tarjeta img{max-height:56px;max-width:100%;width:auto}

/* ---------- Testimonios ---------- */
.testimonios{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--e-5)}
.testimonio{background:#fff;border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-tarjeta);box-shadow:var(--sombra-1);padding:var(--e-5);display:grid;gap:var(--e-4);align-content:start}
.testimonio blockquote{margin:0;font-family:var(--fuente-titulo);font-size:var(--tam-l);line-height:var(--linea-titulo);color:var(--verde-900)}
.testimonio figcaption{display:flex;align-items:center;gap:var(--e-3)}
.testimonio figcaption img{width:52px;height:52px;border-radius:var(--radio-pastilla);object-fit:cover}
.testimonio figcaption strong{display:block;font-size:var(--tam-s)}
.testimonio figcaption small{font-size:var(--tam-2xs);color:var(--texto-suave);text-transform:uppercase;letter-spacing:var(--track-etiqueta)}

/* ---------- FAQ (acordeón) ---------- */
.faq{display:grid;gap:var(--e-3);max-width:var(--ancho-estrecho)}
.faq details{background:#fff;border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-tarjeta);box-shadow:var(--sombra-1);overflow:hidden}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:var(--e-4);padding:var(--e-4) var(--e-5);font-family:var(--fuente-titulo);font-size:var(--tam-l);font-weight:var(--peso-semi);color:var(--verde-900)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--fuente-texto);font-size:var(--tam-xl);color:var(--arcilla-500);flex:none;line-height:1;transition:transform var(--dur-media) var(--curva-salida)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details>div{padding:0 var(--e-5) var(--e-5);color:var(--texto-cuerpo)}
.faq details>div p:last-child{margin-bottom:0}

/* ---------- Archivo de actividades ---------- */
.archivo{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--e-5)}

/* ---------- Cuotas / tipos de socio ---------- */
.cuota-tarjeta{background:#fff;border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-tarjeta);box-shadow:var(--sombra-1);padding:var(--e-5);display:grid;gap:var(--e-3);align-content:start}
.cuota-tarjeta--destacada{border:var(--borde-2) solid var(--verde-200)}
.cuota-precio{display:flex;align-items:baseline;gap:.4rem;flex-wrap:wrap}
.cuota-precio strong{font-family:var(--fuente-titulo);font-size:var(--tam-2xl);font-weight:var(--peso-fuerte);color:var(--verde-900)}
.cuota-precio span{font-size:var(--tam-s);color:var(--texto-suave)}
.cuota-lista{list-style:none;margin:0;padding:0;display:grid;gap:var(--e-2);font-size:var(--tam-s)}
.cuota-lista li{display:flex;gap:.6rem;align-items:flex-start}

/* Aviso de lista de espera */
.aviso-lista-espera{background:var(--aviso-suave);border-radius:var(--radio-tarjeta);padding:var(--e-4) var(--e-5);display:flex;gap:var(--e-3);align-items:flex-start;color:#7A5A05}
.aviso-lista-espera strong{color:#7A5A05}

/* Mapa embebido */
.mapa-marco{border:var(--borde-1) solid var(--borde-suave);border-radius:var(--radio-foto);overflow:hidden;box-shadow:var(--sombra-1)}
.mapa-marco iframe{display:block;width:100%;height:340px;border:0}

/* Galería de fotos (área de socios) */
.galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--e-4)}
.galeria figure{margin:0}
.galeria img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radio-foto);display:block}
.galeria figcaption{font-size:var(--tam-2xs);color:var(--texto-suave);margin-top:var(--e-1)}

/* Texto normativo (reglamento / estatutos) */
.norma h2{font-size:var(--tam-xl);margin-top:var(--e-7);padding-top:var(--e-5);border-top:var(--borde-1) solid var(--borde-suave)}
.norma h3{font-size:var(--tam-l);margin-top:var(--e-5);color:var(--verde-900)}
.norma ul{padding-left:1.2rem;display:grid;gap:.35rem}
.norma .ehmt-badge{vertical-align:middle}
.ehmt-pie__marca img{width:200px;max-width:100%;height:auto;display:block;margin-bottom:var(--e-4)}
.ehmt-pie__marca p{font-size:var(--tam-s);max-width:34ch}
.ehmt-pie .ehmt-lema{color:#fff;font-size:var(--tam-l)}

/* ---------- Utilidades ---------- */
.oculto{display:none !important}
.centrado{text-align:center}
.solo-lectores{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}