/* ==========================================================
   Sitio del proyecto Empadronamiento digital y aprendizajes · IPA
   Paleta oficial IPA: verde #49ac57, verde oscuro #155240,
   carbón #414042, gris claro #f1f2f2, gris #c9c9c8
   Tipografía: Georgia (títulos) y Arial (texto)
   ========================================================== */

:root {
  --verde: #49ac57;
  --verde-oscuro: #155240;
  --verde-profundo: #0e3a2d;
  --verde-suave: #e8f4ea;
  --carbon: #414042;
  --texto: #2b2a2c;
  --texto-suave: #5c5b5e;
  --gris-claro: #f1f2f2;
  --gris: #c9c9c8;
  --blanco: #ffffff;
  --alerta: #b5441a;          /* rojo-naranja IPA oscurecido para que se lea sobre blanco */
  --alerta-suave: #fdeee7;

  --titulos: Georgia, 'Times New Roman', serif;
  --texto-base: Arial, 'Helvetica Neue', Helvetica, sans-serif;

  --ancho: 1160px;
  --radio: 10px;
  --sombra: 0 1px 2px rgba(20, 30, 25, .06), 0 8px 24px rgba(20, 30, 25, .07);
  --alto-cabecera: 76px;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }

body {
  margin: 0;
  font-family: var(--texto-base);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--texto);
  background: var(--blanco);
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--verde-oscuro); text-underline-offset: 3px; }
a:hover { color: var(--verde-profundo); }

h1, h2, h3 { font-family: var(--titulos); font-weight: 400; color: var(--verde-oscuro); line-height: 1.2; margin: 0 0 .6em; }
h1 { font-size: clamp(2rem, 1.3rem + 3vw, 3.25rem); }
h2 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.25rem); }
h3 { font-family: var(--texto-base); font-weight: 700; font-size: 1.15rem; color: var(--carbon); }
p { margin: 0 0 1em; }

.contenedor { width: 100%; max-width: var(--ancho); margin: 0 auto; padding: 0 20px; }
@media (min-width: 768px) { .contenedor { padding: 0 32px; } }

.etiqueta {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--verde-oscuro);
  margin-bottom: .9rem;
}

.saltar { position: absolute; left: -9999px; top: 0; background: var(--verde-oscuro); color: #fff; padding: 10px 16px; z-index: 100; }
.saltar:focus { left: 10px; top: 10px; }

:focus-visible { outline: 3px solid var(--verde); outline-offset: 2px; }

/* ---------- Cabecera ---------- */
.cabecera {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, .97);
  border-bottom: 1px solid #e3e5e4;
  backdrop-filter: saturate(160%) blur(6px);
}
.cabecera .contenedor { display: flex; align-items: center; justify-content: space-between; height: var(--alto-cabecera); gap: 16px; }

.marca { display: flex; align-items: center; gap: 14px; text-decoration: none; color: var(--carbon); }
.marca img { height: 44px; width: auto; }
.marca span { font-size: .8rem; line-height: 1.3; border-left: 1px solid var(--gris); padding-left: 14px; color: var(--texto-suave); }
.marca strong { display: block; color: var(--verde-oscuro); font-size: .92rem; }
@media (max-width: 420px) { .marca span { display: none; } }

.menu ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; align-items: center; }
.menu a { white-space: nowrap;
  display: block; padding: 10px 14px; border-radius: 8px;
  text-decoration: none; color: var(--carbon); font-size: .95rem; font-weight: 700;
}
.menu a:hover { background: var(--gris-claro); color: var(--verde-oscuro); }
.menu a[aria-current='page'] { color: var(--verde-oscuro); box-shadow: inset 0 -3px 0 var(--verde); border-radius: 8px 8px 0 0; }
.menu .boton { margin-left: 8px; }
.menu .boton[aria-current='page'] { box-shadow: none; border-radius: 8px; }

.boton-menu {
  display: none;
  background: none; border: 1px solid var(--gris); border-radius: 8px;
  width: 46px; height: 46px; cursor: pointer; padding: 0;
}
.boton-menu span, .boton-menu span::before, .boton-menu span::after {
  display: block; width: 20px; height: 2px; background: var(--carbon); margin: 0 auto; position: relative; transition: transform .2s;
}
.boton-menu span::before, .boton-menu span::after { content: ''; position: absolute; left: 0; }
.boton-menu span::before { top: -6px; }
.boton-menu span::after { top: 6px; }
.boton-menu[aria-expanded='true'] span { background: transparent; }
.boton-menu[aria-expanded='true'] span::before { transform: translateY(6px) rotate(45deg); }
.boton-menu[aria-expanded='true'] span::after { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 1080px) {
  .boton-menu { display: block; }
  .menu {
    position: fixed; inset: var(--alto-cabecera) 0 auto 0;
    background: #fff; border-bottom: 1px solid #e3e5e4; box-shadow: var(--sombra);
    display: none;
  }
  .menu.abierto { display: block; }
  .menu ul { flex-direction: column; align-items: stretch; padding: 12px 20px 20px; gap: 2px; }
  .menu a { padding: 14px 12px; font-size: 1.05rem; }
  .menu a[aria-current='page'] { box-shadow: inset 4px 0 0 var(--verde); border-radius: 0 8px 8px 0; background: var(--verde-suave); }
  .menu .boton { margin: 10px 0 0; text-align: center; }
}

/* ---------- Botones ---------- */
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  padding: 13px 24px; border-radius: 8px; border: 2px solid var(--verde-oscuro);
  background: var(--verde-oscuro); color: #fff !important; font-weight: 700; font-size: 1rem;
  text-decoration: none; cursor: pointer; font-family: inherit; line-height: 1.2;
  transition: background .15s, border-color .15s, transform .15s;
}
.boton:hover { background: var(--verde-profundo); border-color: var(--verde-profundo); }
.boton:active { transform: translateY(1px); }
.boton[disabled] { opacity: .6; cursor: progress; }
.boton.secundario { background: transparent; color: var(--verde-oscuro) !important; }
.boton.secundario:hover { background: var(--verde-suave); }
.boton.claro { background: #fff; border-color: #fff; color: var(--verde-oscuro) !important; }
.boton.claro:hover { background: var(--verde-suave); border-color: var(--verde-suave); }
.boton.contorno-claro { background: transparent; border-color: rgba(255,255,255,.7); }
.boton.contorno-claro:hover { background: rgba(255,255,255,.1); border-color: #fff; }

/* ---------- Portada (hero) ---------- */
.portada {
  position: relative; overflow: hidden;
  background: var(--verde-oscuro);
  color: #fff;
  padding: clamp(56px, 9vw, 112px) 0 clamp(64px, 10vw, 120px);
}
.portada .contenedor { position: relative; z-index: 1; }
.portada .etiqueta { color: #cfe9d4; }
.portada h1 { color: #fff; max-width: 17ch; }
.portada .bajada { font-size: clamp(1.05rem, 1rem + .4vw, 1.25rem); max-width: 60ch; color: #e4efe8; }
.portada .acciones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

.portada.interior { padding: clamp(44px, 6vw, 72px) 0; }
.portada.interior h1 { max-width: 22ch; }
.migas { font-size: .9rem; margin-bottom: 14px; color: #cfe9d4; }
.migas a { color: #fff; }

/* ---------- Secciones ---------- */
.seccion { padding: clamp(56px, 8vw, 96px) 0; }
.seccion.gris { background: var(--gris-claro); }
.seccion .intro { max-width: 66ch; margin-bottom: 40px; color: var(--texto-suave); font-size: 1.1rem; }

.cifras {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0;
  background: #fff; border-radius: var(--radio); box-shadow: var(--sombra);
  margin-top: -48px; position: relative; z-index: 2;
}
.cifra { padding: 26px 28px; border-left: 1px solid #ebedec; }
.cifra:first-child { border-left: 0; }
.cifra b { display: block; font-family: var(--titulos); font-weight: 400; font-size: 2.2rem; color: var(--verde-oscuro); line-height: 1.1; }
.cifra span { font-size: .95rem; color: var(--texto-suave); }
@media (max-width: 620px) {
  .cifra { border-left: 0; border-top: 1px solid #ebedec; }
  .cifra:first-child { border-top: 0; }
}

.dos-columnas { display: grid; gap: 48px; align-items: start; }
@media (min-width: 900px) { .dos-columnas { grid-template-columns: 1fr 1fr; gap: 64px; } }

.lista-objetivos { list-style: none; margin: 0; padding: 0; counter-reset: obj; display: grid; gap: 16px; }
.lista-objetivos li {
  counter-increment: obj; position: relative;
  background: #fff; border: 1px solid #e3e5e4; border-radius: var(--radio);
  padding: 18px 20px 18px 70px;
}
.lista-objetivos li::before {
  content: counter(obj); position: absolute; left: 18px; top: 16px;
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--verde-suave); color: var(--verde-oscuro);
  font-family: var(--titulos); font-size: 1.15rem; display: grid; place-items: center;
}

/* Objetivo: una sola columna, centrada y con ancho de lectura cómodo */
.objetivo { max-width: 820px; text-align: center; }
.objetivo .objetivo-general { border-left: 0; padding: 0; margin: 4px auto 24px; font-size: clamp(1.5rem, 1.15rem + 1.4vw, 2.3rem); line-height: 1.35; color: var(--verde-oscuro); }
.objetivo p:last-child { color: var(--texto-suave); max-width: 62ch; margin: 0 auto; }

.objetivo-general {
  border-left: 4px solid var(--verde); padding: 4px 0 4px 22px;
  font-family: var(--titulos); font-size: clamp(1.2rem, 1.05rem + .6vw, 1.5rem); color: var(--carbon); line-height: 1.45;
}

.tarjetas { display: grid; gap: 22px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.tarjeta {
  background: #fff; border: 1px solid #e3e5e4; border-radius: var(--radio);
  padding: 28px; box-shadow: 0 1px 2px rgba(0,0,0,.03);
  display: flex; flex-direction: column;
}
.tarjeta .icono {
  width: 48px; height: 48px; border-radius: 12px; background: var(--verde-suave);
  display: grid; place-items: center; margin-bottom: 18px; color: var(--verde-oscuro);
}
.tarjeta .icono svg { width: 26px; height: 26px; }
.tarjeta p:last-child { margin-bottom: 0; }
.tarjeta p { color: var(--texto-suave); }

.distritos { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); margin-top: 8px; }
.distrito { background: #fff; border-radius: var(--radio); padding: 22px 24px; border-top: 4px solid var(--verde); box-shadow: var(--sombra); }
.distrito b { font-family: var(--titulos); font-weight: 400; font-size: 1.35rem; color: var(--verde-oscuro); display: block; }
.distrito span { color: var(--texto-suave); font-size: .95rem; }

.foto-reservada {
  aspect-ratio: 4 / 3; border-radius: var(--radio);
  background:
    linear-gradient(135deg, #dfeee2, #f1f2f2);
  display: grid; place-items: center; text-align: center; color: var(--texto-suave); font-size: .9rem; padding: 20px;
  border: 1px dashed var(--gris);
}

/* Franja de verificación */
.franja {
  background: var(--verde-oscuro); color: #fff; border-radius: 14px;
  padding: clamp(28px, 4vw, 48px); display: grid; gap: 24px; align-items: center;
  position: relative; overflow: hidden;
}
.franja h2 { color: #fff; margin-bottom: .3em; }
.franja p { color: #e4efe8; margin: 0; max-width: 58ch; }
@media (min-width: 860px) { .franja { grid-template-columns: 1fr auto; } }

/* ---------- Participantes ---------- */
.socio { display: grid; gap: 24px; padding: 32px 0; border-top: 1px solid #e3e5e4; }
.socio:first-of-type { border-top: 0; }
.socio { max-width: 820px; }
.socio .logo-socio {
  height: 120px; border-radius: var(--radio); background: #fff; border: 1px solid #e3e5e4;
  display: grid; place-items: center; padding: 18px;
}
.socio .logo-socio img { max-height: 80px; width: auto; }
.socio .logo-socio.pendiente { color: var(--texto-suave); font-size: .85rem; text-align: center; border-style: dashed; }
.socio .rol { font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--verde-oscuro); }
.socio h2 { font-size: 1.6rem; margin: .2em 0 .5em; }

/* ---------- Formularios ---------- */
.panel { background: #fff; border-radius: 14px; box-shadow: var(--sombra); padding: clamp(22px, 4vw, 40px); border: 1px solid #e8eae9; }

.campo { margin-bottom: 20px; }
.campo label, .campo legend { display: block; font-weight: 700; margin-bottom: 6px; color: var(--carbon); font-size: .97rem; }
.campo .ayuda { font-size: .88rem; color: var(--texto-suave); margin-top: 4px; }
.campo input[type='text'], .campo input[type='email'], .campo input[type='tel'], .campo select, .campo textarea {
  width: 100%; font: inherit; color: var(--texto);
  padding: 12px 14px; border: 1.5px solid var(--gris); border-radius: 8px; background: #fff;
  transition: border-color .15s, box-shadow .15s;
}
.campo textarea { min-height: 150px; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--verde-oscuro); box-shadow: 0 0 0 3px rgba(73,172,87,.25); }
.campo.con-error input, .campo.con-error textarea, .campo.con-error select { border-color: var(--alerta); }
.campo .error { color: var(--alerta); font-size: .88rem; margin-top: 5px; display: none; }
.campo.con-error .error { display: block; }
.fila { display: grid; gap: 0 20px; }
@media (min-width: 640px) { .fila { grid-template-columns: 1fr 1fr; } }

.casilla { display: flex; gap: 10px; align-items: flex-start; font-weight: 400 !important; font-size: .93rem !important; color: var(--texto-suave) !important; }
.casilla input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--verde-oscuro); flex: none; }

.trampa { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

.selector { display: inline-flex; background: var(--gris-claro); border-radius: 10px; padding: 4px; margin-bottom: 20px; flex-wrap: wrap; }
.selector button {
  border: 0; background: transparent; font: inherit; font-weight: 700; font-size: .95rem;
  padding: 10px 18px; border-radius: 8px; cursor: pointer; color: var(--texto-suave);
}
.selector button[aria-pressed='true'] { background: #fff; color: var(--verde-oscuro); box-shadow: 0 1px 3px rgba(0,0,0,.1); }

.buscador { display: flex; gap: 10px; flex-wrap: wrap; }
.buscador input { flex: 1 1 220px; font-size: 1.15rem !important; letter-spacing: .04em; }
.buscador .boton { flex: 0 0 auto; }
@media (max-width: 480px) { .buscador .boton { flex: 1 1 100%; } }

.aviso { border-radius: 10px; padding: 16px 18px; font-size: .97rem; }
.aviso.ok { background: var(--verde-suave); color: var(--verde-profundo); border: 1px solid #bfe0c5; }
.aviso.mal { background: var(--alerta-suave); color: #7a2c0e; border: 1px solid #f3c6b3; }
.aviso.info { background: var(--gris-claro); color: var(--carbon); border: 1px solid #e0e2e1; }

/* Resultado de verificación */
.resultado { margin-top: 26px; }
.credencial {
  display: grid; grid-template-columns: auto 1fr; gap: 22px; align-items: center;
  border-radius: 14px; padding: 22px; border: 2px solid;
}
.credencial.valida { border-color: var(--verde); background: linear-gradient(180deg, #f3faf4, #fff); }
.credencial.vencida { border-color: #e9a07f; background: linear-gradient(180deg, #fff6f1, #fff); }
.credencial .foto {
  width: 104px; height: 128px; border-radius: 10px; object-fit: cover; background: var(--gris-claro);
  display: grid; place-items: center; font-family: var(--titulos); font-size: 2.2rem; color: var(--verde-oscuro);
}
.credencial .estado {
  display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: .85rem;
  letter-spacing: .06em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; margin-bottom: 8px;
}
.credencial.valida .estado { background: var(--verde-oscuro); color: #fff; }
.credencial.vencida .estado { background: var(--alerta); color: #fff; }
.credencial .nombre { font-family: var(--titulos); font-size: 1.55rem; color: var(--carbon); line-height: 1.2; margin: 2px 0 8px; }
.credencial dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 3px 14px; font-size: .95rem; }
.credencial dt { color: var(--texto-suave); }
.credencial dd { margin: 0; font-weight: 700; color: var(--carbon); }
@media (max-width: 520px) {
  .credencial { grid-template-columns: 1fr; text-align: left; }
  .credencial .foto { width: 96px; height: 116px; }
}

.pasos { list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; }
.pasos li { display: grid; grid-template-columns: 40px 1fr; gap: 14px; }
.pasos .n { width: 40px; height: 40px; border-radius: 50%; background: var(--verde-oscuro); color: #fff; display: grid; place-items: center; font-family: var(--titulos); font-size: 1.1rem; }
.pasos b { display: block; color: var(--carbon); }
.pasos p { margin: 0; color: var(--texto-suave); font-size: .97rem; }

.datos-contacto { list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; }
.datos-contacto li { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: start; }
.datos-contacto .icono { width: 44px; height: 44px; border-radius: 10px; background: var(--verde-suave); color: var(--verde-oscuro); display: grid; place-items: center; }
.datos-contacto .icono svg { width: 22px; height: 22px; }
.datos-contacto b { display: block; color: var(--carbon); }
.datos-contacto span { color: var(--texto-suave); font-size: .97rem; }

/* ---------- Pie de página ---------- */
.pie { background: var(--verde-profundo); color: #cfdcd5; padding: 56px 0 28px; font-size: .95rem; }
.pie a { color: #fff; text-decoration: none; }
.pie a:hover { text-decoration: underline; }
.pie .columnas { display: grid; gap: 36px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.pie h3 { color: #fff; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 14px; }
.pie ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pie .logo-pie { height: 56px; width: auto; margin-bottom: 14px; }
.pie .legal { border-top: 1px solid rgba(255,255,255,.14); margin-top: 40px; padding-top: 22px; display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; font-size: .85rem; color: #a9bdb3; }

/* ---------- Utilidades ---------- */
.centro { text-align: center; }
.mt-0 { margin-top: 0; }
.oculto { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cargando::after {
  content: ''; width: 16px; height: 16px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.5); border-top-color: #fff; animation: giro .7s linear infinite;
}
@keyframes giro { to { transform: rotate(360deg); } }

/* ---------- ULE en Contáctenos ---------- */
.ules { display: grid; gap: 14px; margin-top: 28px; }
.ule { background: var(--gris-claro); border-left: 4px solid var(--verde); border-radius: 0 var(--radio) var(--radio) 0; padding: 16px 20px; }
.ule h3 { margin: 0 0 6px; font-size: 1.02rem; color: var(--verde-oscuro); }
.ule p { margin: 0; font-size: .95rem; color: var(--texto-suave); }
.ule p + p { margin-top: 2px; }
.nota-ule { margin: 4px 0 0; font-size: .85rem; color: var(--texto-suave); }

/* ---------- Aliados en Nosotros ---------- */
.aliados { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); margin-top: 8px; }
.aliado { background: var(--gris-claro); border-radius: var(--radio); padding: 20px 22px; }
.aliado h3 { margin: 0 0 8px; font-size: 1.05rem; color: var(--verde-oscuro); }
.aliado p { margin: 0; color: var(--texto-suave); font-size: .97rem; }

/* ---------- Galería del personal ---------- */
.pasos-fila { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; margin-bottom: 40px; }
.filtros { display: grid; gap: 14px; margin-bottom: 10px; }
.filtros input[type='search'] {
  width: 100%; max-width: 520px; font: inherit; font-size: 1.05rem; padding: 13px 16px;
  border: 1.5px solid var(--gris); border-radius: 10px; background: #fff;
}
.filtros input[type='search']:focus { outline: none; border-color: var(--verde-oscuro); box-shadow: 0 0 0 3px rgba(73,172,87,.25); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips button {
  font: inherit; font-size: .92rem; font-weight: 700; cursor: pointer;
  padding: 8px 16px; border-radius: 999px; border: 1.5px solid var(--gris); background: #fff; color: var(--carbon);
}
.chips button:hover { border-color: var(--verde-oscuro); }
.chips button[aria-pressed='true'] { background: var(--verde-oscuro); border-color: var(--verde-oscuro); color: #fff; }
.conteo { color: var(--texto-suave); font-size: .92rem; margin: 6px 0 16px; }
.galeria { display: grid; gap: 20px; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
@media (max-width: 420px) { .galeria { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
.persona { background: #fff; border: 1px solid #e3e5e4; border-radius: var(--radio); overflow: hidden; box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.persona-foto { aspect-ratio: 4 / 5; background: var(--verde-suave); display: grid; place-items: center; }
.persona-foto img { width: 100%; height: 100%; object-fit: cover; }
.iniciales { font-family: var(--titulos); font-size: 2.6rem; color: var(--verde-oscuro); }
.persona-info { padding: 14px 16px 16px; }
.persona-info h3 { margin: 0 0 4px; font-size: 1.02rem; color: var(--carbon); line-height: 1.3; }
.persona-info p { margin: 0; font-size: .9rem; color: var(--texto-suave); line-height: 1.45; }
.persona-cargo { font-weight: 700; color: var(--verde-oscuro) !important; }
.persona-codigo { margin-top: 6px !important; font-size: .82rem !important; letter-spacing: .02em; }
#sin-resultados { margin-top: 8px; }
.recuerde { margin-top: 36px; }

/* ---------- Correo en Contáctenos ---------- */
.correo-panel h2 { margin-top: 0; font-size: clamp(1.4rem, 1.15rem + 1vw, 1.9rem); }
.correo-grande {
  display: flex; align-items: center; gap: 12px; margin: 22px 0 18px;
  padding: 16px 20px; border-radius: 12px; background: var(--verde-suave);
  color: var(--verde-oscuro); font-weight: 700; font-size: clamp(1rem, .95rem + .4vw, 1.2rem);
  text-decoration: none; word-break: break-all; border: 1.5px solid #bfe0c5;
}
.correo-grande:hover { background: #dcefe0; }
.correo-grande svg { width: 26px; height: 26px; flex: none; }

/* ---------- Foto en Inicio ---------- */
.foto-portada { margin: 0; border-radius: var(--radio); overflow: hidden; box-shadow: var(--sombra); }
.foto-portada img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }

/* ---------- Fotos en Nosotros ---------- */
.socio.con-foto { max-width: none; align-items: center; }
@media (min-width: 900px) { .socio.con-foto { grid-template-columns: 1.1fr 1fr; gap: 56px; } }
.fotos-fila { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.fotos-fila figure { margin: 0; background: #fff; border-radius: var(--radio); overflow: hidden; box-shadow: var(--sombra); }
.fotos-fila img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.fotos-fila figcaption { padding: 12px 16px; font-size: .92rem; color: var(--texto-suave); }

/* Contáctenos sin correo: las tres ULE en fila */
@media (min-width: 900px) { .contenedor:not(.dos-columnas) > div > .ules { grid-template-columns: repeat(3, 1fr); } }

/* ---------- Portada de Inicio: mismo alto que las otras pestañas ---------- */
.portada:not(.interior) { padding: clamp(44px, 6vw, 72px) 0; }
.portada h1 { max-width: 30ch; }
.cifras { margin-top: 32px; }

/* ---------- Foto en la portada de Inicio (mismo margen verde que las otras pestañas) ---------- */
.portada-grid { display: grid; gap: 40px; align-items: center; }
.portada-foto { display: none; margin: 0; border-radius: 14px; overflow: hidden; box-shadow: 0 12px 32px rgba(0,0,0,.25); }
.portada-foto img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
@media (min-width: 900px) {
  .portada-grid { grid-template-columns: 1.15fr 1fr; gap: 56px; }
  .portada-grid h1 { max-width: none; font-size: clamp(2rem, 1.1rem + 2vw, 2.7rem); }
  .portada-foto { display: block; }
}