/* ═══════════════════════════════════════════════════════
   YES WE TECH — diseño "Cítrico"
   Crema + morado + amarillo lima + rosa + azul eléctrico
   Display: Bricolage Grotesque · Cuerpo: Public Sans
   ═══════════════════════════════════════════════════════ */

/* ── fuentes (autoalojadas) ───────────────────────────── */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 200 800;
  font-stretch: 100%;
  font-display: swap;
  src: url('../fonts/bricolage-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 200 800;
  font-stretch: 100%;
  font-display: swap;
  src: url('../fonts/bricolage-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/publicsans-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/publicsans-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ── variables ────────────────────────────────────────── */
:root {
  --bg:      #FBFAF4;
  --surface: #FFFFFF;
  --fg:      #0032FF;
  --muted:   #4D2C6C;
  --brand:   #4D2C6C;
  --brand2:  #6A3E93;
  --yellow:  #E3FC4A;
  --accent:  #FF2565;
  --green:   #49DD8C;
  --line:    rgba(77, 44, 108, .14);
  --line2:   rgba(77, 44, 108, .24);
  --hero-bg: #4D2C6C;
  --on-brand: #FFFFFF;
  --rad:     20px;
  --display: 'Bricolage Grotesque', Helvetica, sans-serif;
  --body:    'Public Sans', system-ui, sans-serif;
  --ancho:   1280px;
  /* compatibilidad con nombres antiguos */
  --purple:       #4D2C6C;
  --purple-light: #F0E9F7;
  --purple-mid:   #6A3E93;
  --dark:         #1F1030;
  --border:       rgba(77, 44, 108, .14);
}

/* ── reset y base ─────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: var(--body);
  color: var(--fg);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
::selection { background: var(--yellow); color: #0032FF; }

h1, h2, h3, .display {
  font-family: var(--display);
  font-weight: 800;
  letter-spacing: -0.035em;
}

@keyframes ywtMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ── cabecera (pegajosa, con desenfoque) ──────────────── */
.cabecera-web {
  position: sticky; top: 0; z-index: 100;
  background: rgba(251, 250, 244, .88);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.cabecera-inner {
  max-width: var(--ancho); margin: 0 auto;
  padding: 14px 28px;
  display: flex; align-items: center; gap: 28px;
}
.logo-link { display: flex; align-items: center; flex: none; }
.logo-link img { height: 41px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 4px; margin-left: auto; flex-wrap: wrap; }
.nav-links a {
  font-size: 14px; font-weight: 600; letter-spacing: .02em;
  padding: 9px 13px; border-radius: 999px;
  transition: background .18s ease, color .18s ease;
}
.nav-links a:hover { background: var(--yellow); color: #0032FF; }
.nav-cta {
  flex: none;
  font-size: 13px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  padding: 11px 18px; border-radius: 999px;
  background: var(--yellow); color: #0032FF;
  transition: background .18s ease, color .18s ease;
}
.nav-cta:hover { background: var(--accent); color: #fff; }
.nav-toggle {
  display: none; background: none; border: none;
  font-size: 26px; color: var(--brand); cursor: pointer;
  padding: 8px 10px; margin-left: auto; line-height: 1;
  min-width: 44px; min-height: 44px;   /* objetivo táctil cómodo */
}

/* ── enlace de accesibilidad ──────────────────────────── */
.skip-link {
  position: absolute; left: -9999px; top: 0;
  background: var(--brand); color: #fff;
  padding: 10px 18px; z-index: 200; border-radius: 0 0 8px 0;
}
.skip-link:focus { left: 0; }

/* ── hero portada ─────────────────────────────────────── */
.hero-citrico { background: var(--hero-bg); color: var(--on-brand); position: relative; overflow: hidden; }
.hero-citrico-inner {
  position: relative; max-width: var(--ancho); margin: 0 auto;
  padding: clamp(40px, 4.5vw, 66px) 28px clamp(30px, 3vw, 44px);
  display: grid; gap: 22px;
}
.hero-citrico h1 {
  line-height: .96; font-size: clamp(34px, 5vw, 74px); text-wrap: balance;
}
.hero-citrico h1 span { color: var(--yellow); }
.hero-citrico-abajo {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 32px; align-items: end;
}
.hero-citrico-abajo p {
  font-size: clamp(16px, 1.15vw, 18px); line-height: 1.6; max-width: 52ch; opacity: .92; text-wrap: pretty;
}
.hero-botones { display: flex; flex-wrap: wrap; gap: 12px; }
.btn-amarillo {
  font-size: 15px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  padding: 14px 22px; border-radius: 999px;
  background: var(--yellow); color: #0032FF;
  transition: background .18s ease, color .18s ease;
  display: inline-block;
}
.btn-amarillo:hover { background: var(--accent); color: #fff; }
.btn-borde-claro {
  font-size: 15px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  padding: 14px 22px; border-radius: 999px;
  border: 1.5px solid rgba(255, 255, 255, .5); color: inherit;
  display: inline-block; transition: border-color .18s ease, color .18s ease;
}
.btn-borde-claro:hover { border-color: var(--yellow); color: var(--yellow); }
.btn-morado {
  font-size: 14px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
  padding: 15px 24px; border-radius: 999px;
  background: var(--brand); color: #fff;
  display: inline-block; transition: background .18s ease;
}
.btn-morado:hover { background: var(--accent); color: #fff; }
.btn-borde-morado {
  font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  padding: 15px 24px; border-radius: 999px;
  border: 1.5px solid var(--brand); color: var(--brand);
  display: inline-block; transition: background .18s ease, color .18s ease;
}
.btn-borde-morado:hover { background: var(--brand); color: #fff; }

/* ── barra de próximo evento ──────────────────────────── */
.proximo-evento-barra { border-top: 1px solid rgba(0, 50, 255, .12); background: var(--green); color: var(--fg); }
.proximo-evento-barra .etiqueta-rosa { background: var(--fg); color: #fff; }
.proximo-evento-barra .fecha { opacity: 1; color: rgba(0, 50, 255, .78); }
.proximo-evento-barra .enlace-subrayado { color: var(--fg); border-bottom-color: var(--fg); }
.proximo-evento-inner {
  max-width: var(--ancho); margin: 0 auto; padding: 20px 28px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px;
}
.etiqueta-rosa {
  font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
  padding: 7px 12px; border-radius: 6px;
  background: var(--accent); color: #fff;
}
.etiqueta-morada {
  font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
  padding: 7px 12px; border-radius: 6px;
  background: var(--brand); color: #fff;
  justify-self: start;
}
.proximo-evento-inner strong { font-size: clamp(16px, 1.4vw, 19px); font-weight: 700; }
.proximo-evento-inner .fecha { opacity: .8; font-size: 15px; }
.enlace-subrayado {
  font-size: 14px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  border-bottom: 2px solid var(--yellow); padding-bottom: 2px;
}
.proximo-evento-inner .enlace-subrayado { margin-left: auto; }

/* ── banda de stats ───────────────────────────────────── */
.stats-banda { background: var(--yellow); color: #0032FF; }
.stats-inner {
  max-width: var(--ancho); margin: 0 auto;
  padding: clamp(34px, 4vw, 56px) 28px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 28px;
}
.stat { display: grid; gap: 6px; }
.stat-num {
  font-family: var(--display); font-weight: 800;
  font-size: clamp(32px, 3.4vw, 50px); line-height: .95; letter-spacing: -0.02em;
}
.stat-label { font-size: 14px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

/* ── tarjeta destacada (libro / evento destacado) ─────── */
.destacado-seccion { max-width: var(--ancho); margin: 0 auto; padding: clamp(44px, 5vw, 76px) 28px; }
.destacado-tarjeta {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 0; align-items: center;
  border: 1px solid var(--line); border-radius: var(--rad); overflow: hidden;
  background: var(--surface);
}
.destacado-texto { padding: clamp(28px, 4vw, 56px); display: grid; gap: 20px; }
.destacado-texto h2 { font-size: clamp(24px, 2.8vw, 38px); line-height: 1.05; }
.destacado-texto p { font-size: 17px; line-height: 1.6; color: var(--muted); max-width: 46ch; text-wrap: pretty; }
.destacado-texto .fecha-grande { font-size: 18px; font-weight: 700; }
.destacado-texto .btn-morado, .destacado-texto .btn-amarillo { justify-self: start; }
.destacado-texto .etiqueta-rosa, .destacado-texto .etiqueta-morada { justify-self: start; }
.destacado-tarjeta > img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; background: var(--brand2); }

/* ── secciones con título ─────────────────────────────── */
.seccion { max-width: var(--ancho); margin: 0 auto; padding: clamp(44px, 5vw, 76px) 28px; }
.seccion-cabecera {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 20px; flex-wrap: wrap; margin-bottom: 34px;
}
.seccion-cabecera h2, .seccion > h2 { font-size: clamp(26px, 3.2vw, 44px); line-height: 1.04; }
.seccion-cabecera p { font-size: 16px; color: var(--muted); max-width: 44ch; }

/* ── pilares (4 tarjetas con foto) ────────────────────── */
.pilares-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.pilar-tarjeta {
  display: grid; align-content: start; gap: 14px; padding: 0 0 24px;
  border-radius: var(--rad); overflow: hidden;
  background: var(--surface); border: 1px solid var(--line);
  transition: transform .2s ease, border-color .2s ease;
}
.pilar-tarjeta:hover { transform: translateY(-5px); border-color: var(--brand); }
.pilar-tarjeta img { width: 100%; aspect-ratio: 16/10; object-fit: cover; background: var(--brand2); }
.pilar-tarjeta h3 { padding: 0 24px; font-size: 26px; line-height: 1.05; }
.pilar-tarjeta p { padding: 0 24px; font-size: 15px; line-height: 1.6; color: var(--muted); text-wrap: pretty; }
.pilar-tarjeta .pilar-cta {
  padding: 0 24px; font-size: 13px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--brand);
}

/* ── marquesina ───────────────────────────────────────── */
.marquesina {
  background: var(--brand); color: #fff; overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 60px, #000 calc(100% - 60px), transparent 100%);
  mask-image: linear-gradient(to right, transparent 0, #000 60px, #000 calc(100% - 60px), transparent 100%);
}
.marquesina-pista { display: flex; width: max-content; animation: ywtMarquee 26s linear infinite; padding: 22px 0; }
.marquesina-pista span {
  font-family: var(--display); font-weight: 800;
  font-size: clamp(20px, 2.2vw, 32px); text-transform: uppercase;
  letter-spacing: .06em; word-spacing: .12em; white-space: nowrap;
}


/* ── manifiesto sobre foto ────────────────────────────── */
.manifiesto { position: relative; overflow: hidden; }
.manifiesto > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.manifiesto-velo {
  position: relative;
  background: linear-gradient(105deg, rgba(77, 44, 108, .95) 0%, rgba(77, 44, 108, .9) 55%, rgba(77, 44, 108, .82) 100%);
  color: #fff;
}
.manifiesto-inner { max-width: var(--ancho); margin: 0 auto; padding: clamp(48px, 6vw, 92px) 28px; display: grid; gap: 26px; justify-items: center; text-align: center; }
.manifiesto-inner h2 { font-size: clamp(26px, 3vw, 42px); line-height: 1.04; max-width: 18ch; }
.manifiesto-inner p { font-size: clamp(17px, 1.5vw, 20px); line-height: 1.6; max-width: 72ch; opacity: .96; text-wrap: pretty; }
.manifiesto-formatos {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 36px;
  list-style: none; margin-top: 6px;
}
@media (max-width: 480px) { .manifiesto-formatos { grid-template-columns: 1fr; } }
.manifiesto-formatos li { display: flex; align-items: baseline; gap: 10px; }
.manifiesto-formatos li::before { content: ""; width: 8px; height: 8px; flex: none; background: var(--yellow); border-radius: 2px; }
.manifiesto-formatos span { font-family: var(--display); font-weight: 800; font-size: 16px; }
.manifiesto-formatos small { font-size: 13px; opacity: .75; }

/* ── rejilla de posts / últimos eventos ───────────────── */
.posts-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; }
.post-mini { display: grid; gap: 14px; align-content: start; }
.post-mini img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: var(--rad); background: var(--brand2);
  transition: transform .2s ease;
}
.post-mini:hover img { transform: scale(1.02); }
.post-mini .post-mini-tipo {
  font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted);
}
.post-mini h3 { font-family: var(--body); font-size: 20px; font-weight: 700; line-height: 1.25; letter-spacing: normal; }

/* ── equipo (Motherboard) ─────────────────────────────── */
.equipo-banda { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); }
.equipo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 20px; }
.equipo-tarjeta { display: grid; gap: 12px; align-content: start; }
.equipo-tarjeta img {
  width: 100%; aspect-ratio: 1; object-fit: cover; object-position: center top;
  border-radius: var(--rad); background: var(--brand2);
}
.equipo-nombre { font-size: 19px; font-weight: 700; }
.equipo-rol { font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--brand); }

/* ── sponsors ─────────────────────────────────────────── */
.sponsors-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.sponsor-tarjeta {
  border: 1px solid var(--line); border-radius: var(--rad); padding: 28px;
  background: var(--surface); display: grid; gap: 18px; align-content: start;
}
.sponsor-tarjeta .sponsor-tipo { font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.sponsor-tarjeta > img { width: 100%; max-height: 90px; object-fit: contain; }
.sponsor-tarjeta > img.sponsor-oro { max-height: 150px; align-self: center; }
/* enlaces de patrocinador: el logo entero es clicable */
.sponsor-enlace { display: block; }
.sponsor-enlace:hover img { transform: scale(1.04); }
.sponsor-enlace img { transition: transform .15s ease; }
.sponsor-tarjeta > .sponsor-enlace.sponsor-oro-enlace { align-self: center; }
.sponsor-tarjeta > .sponsor-enlace.sponsor-oro-enlace img { width: 100%; max-height: 150px; object-fit: contain; }
/* colaboradores: 2 arriba y el tercero centrado abajo */
.sponsor-logos { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 20px; align-items: center; height: 100%; }
.sponsor-logos .sponsor-enlace img { width: 100%; max-height: 56px; object-fit: contain; }
.sponsor-logos > .sponsor-enlace:nth-child(3):last-child { grid-column: 1 / -1; justify-self: center; max-width: 62%; }
.sponsor-cta {
  border-radius: var(--rad); padding: 28px;
  background: var(--brand); color: #fff;
  display: grid; gap: 14px; align-content: center;
}
.sponsor-cta h3 { font-family: var(--body); font-size: 22px; font-weight: 700; line-height: 1.3; letter-spacing: normal; }
.sponsor-cta .btn-amarillo { justify-self: start; font-size: 13px; padding: 14px 22px; }

/* ── héroes interiores (eventos, blog, únete, …) ──────── */
.hero-interior { background: var(--hero-bg); color: var(--on-brand); }
.hero-interior-inner {
  max-width: var(--ancho); margin: 0 auto;
  padding: clamp(36px, 4vw, 60px) 28px; display: grid; gap: 18px;
}
.hero-interior .kicker { font-size: 13px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; opacity: .82; }
.hero-interior h1 { font-size: clamp(32px, 4.6vw, 66px); line-height: .98; }
.hero-interior p { font-size: clamp(17px, 1.5vw, 20px); line-height: 1.6; max-width: 58ch; opacity: .92; }
.hero-interior-amarillo { background: var(--yellow); color: #0032FF; }
.hero-interior-amarillo .kicker { opacity: 1; }
.hero-interior-crema { background: transparent; color: var(--fg); }
.hero-interior-crema p { color: var(--muted); opacity: 1; }

/* ── tarjetas de evento ───────────────────────────────── */
.eventos-listado { max-width: var(--ancho); margin: 0 auto; padding: clamp(40px, 4vw, 56px) 28px; }
.eventos-listado + .eventos-listado { padding-top: 0; }
.eventos-listado h2 { font-size: clamp(24px, 2.8vw, 38px); line-height: 1.05; margin: 8px 0 24px; }
.eventos-grid, .events-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.event-card {
  background: var(--surface); border-radius: var(--rad); overflow: hidden;
  border: 1px solid var(--line);
  transition: transform .2s ease, border-color .2s ease;
  display: flex; flex-direction: column;
}
.event-card:hover { transform: translateY(-5px); border-color: var(--brand); }
.event-img-wrap { width: 100%; aspect-ratio: 16/10; overflow: hidden; position: relative; background: var(--brand2); }
.event-img-wrap img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.event-type {
  position: absolute; top: 12px; left: 12px;
  background: var(--yellow); color: #0032FF;
  font-size: 11px; font-weight: 800; padding: 5px 10px;
  border-radius: 6px; text-transform: uppercase; letter-spacing: .08em;
}
.event-body { padding: 18px 20px 22px; display: grid; gap: 7px; align-content: start; }
.event-date { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.event-body h3 { font-family: var(--body); font-size: 17px; font-weight: 700; line-height: 1.3; letter-spacing: normal; }
.event-meta-linea { font-size: 13px; color: var(--muted); }
.event-body p { font-size: 14px; color: var(--muted); line-height: 1.55; }
/* el contenedor no altera la maquetación: los enlaces se apilan como antes */
.event-enlaces { display: contents; }
.event-link {
  font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  color: var(--brand); margin-top: 6px; display: inline-block; justify-self: start;
  padding: 7px 0;   /* separación táctil entre "Ver ficha" y "Ver crónica" */
}
.event-link-cronica { color: var(--accent); margin-top: 2px; }
.btn-inscripcion {
  display: inline-block; margin-top: 10px; justify-self: start;
  background: var(--brand); color: #fff;
  padding: 10px 20px; border-radius: 999px;
  font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
}
.btn-inscripcion:hover { background: var(--accent); }
.eventos-vacio {
  background: var(--surface); border: 1.5px dashed var(--line2);
  border-radius: var(--rad); padding: 48px 32px; text-align: center;
}
.eventos-vacio p { font-size: 15px; color: var(--muted); margin-bottom: 6px; }
.eventos-vacio a { color: var(--brand); font-weight: 700; border-bottom: 2px solid var(--yellow); }

/* ── detalle de evento ────────────────────────────────── */
.evento-detalles {
  max-width: var(--ancho); margin: 0 auto;
  display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
  gap: 16px; padding: 40px 28px;
}
.evento-detalle-item.inscripcion {
  background: var(--accent); border-color: var(--accent);
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px;
}
.evento-detalle-item.inscripcion h3 { color: #fff; opacity: .9; }
.evento-detalle-item.inscripcion .btn-inscripcion-ficha {
  display: inline-block; background: #fff; color: var(--accent);
  font-weight: 800; font-size: 14px; padding: 10px 18px; border-radius: 999px;
}
.evento-detalle-item.inscripcion .btn-inscripcion-ficha:hover { background: var(--yellow); color: #0032FF; }
.evento-detalle-item {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--rad); padding: 20px 22px;
}
.evento-detalle-item h3 {
  font-family: var(--body); font-size: 12px; font-weight: 800; color: var(--brand);
  text-transform: uppercase; letter-spacing: .12em; margin-bottom: 10px;
}
.evento-detalle-item p { font-family: var(--display); font-size: 19px; font-weight: 800; line-height: 1.25; }
.evento-detalle-item p small { display: block; font-family: var(--body); font-weight: 400; color: var(--muted); font-size: 14px; margin-top: 5px; }
.evento-inscripcion-cta {
  padding: 48px 28px; display: flex; flex-direction: column;
  align-items: center; gap: 12px; text-align: center;
}
.evento-inscripcion-cta p { font-size: 15px; color: var(--muted); }
.evento-cuerpo { max-width: 820px; margin: 0 auto; padding: 48px 28px; font-size: 16px; line-height: 1.75; }
.evento-cuerpo p { margin-bottom: 16px; color: var(--muted); }
.evento-cuerpo h2 {
  color: var(--brand);
  font-size: clamp(28px, 3vw, 34px);
  font-weight: 500;
  line-height: 1.15;
  text-align: center;
  margin: 38px 0 20px;
}
.evento-cuerpo a { color: var(--brand); font-weight: 700; border-bottom: 2px solid var(--yellow); }
.evento-cuerpo p.evento-cita, .evento-seccion-inner p.evento-cita {
  display: block; background: var(--green); color: var(--fg);
  font-family: "Bricolage Grotesque", sans-serif; font-weight: 700;
  font-size: 18px; line-height: 1.5; text-align: center; font-style: normal;
  padding: 28px 36px; border-radius: var(--rad); margin-bottom: 24px;
}

/* ── intro de las crónicas: banda verde con texto grande ── */
.evento-cuerpo.cronica-intro {
  max-width: none; margin: 0;
  background: var(--green);
  padding: clamp(36px, 5vw, 60px) 28px;
}
.evento-cuerpo.cronica-intro p {
  max-width: 860px; margin: 0 auto 14px;
  color: var(--fg); font-family: var(--display); font-weight: 500;
  font-size: clamp(18px, 2vw, 22px); line-height: 1.55;
}
.evento-cuerpo.cronica-intro p:last-child { margin-bottom: 0; }
.evento-cuerpo.cronica-intro a { color: var(--brand); border-bottom-color: var(--brand); }

/* ── secciones con fondo alterno dentro de la ficha ────── */
.evento-seccion { padding: clamp(40px, 5vw, 64px) 28px; }
.evento-seccion-inner { max-width: 820px; margin: 0 auto; font-size: 16px; line-height: 1.75; }
.evento-seccion-inner h2 {
  color: var(--brand);
  font-size: clamp(28px, 3vw, 34px);
  font-weight: 500;
  line-height: 1.15;
  text-align: center;
  margin-bottom: 22px;
}
.evento-seccion-inner > p { color: var(--muted); margin-bottom: 16px; }
.evento-seccion-inner ul { color: var(--muted); padding-left: 20px; margin-bottom: 4px; }
.evento-seccion-inner li { margin-bottom: 8px; }
.evento-seccion-inner a { color: var(--brand); font-weight: 700; border-bottom: 2px solid var(--yellow); }
.evento-seccion.fondo-gris { background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.evento-seccion.fondo-morado { background: var(--hero-bg); color: #fff; }
.evento-seccion.fondo-morado h2 { color: #fff; }
.evento-seccion.fondo-morado .evento-seccion-inner > p,
.evento-seccion.fondo-morado ul { color: rgba(255, 255, 255, .85); }
.evento-seccion.fondo-morado a { color: var(--yellow); }
.evento-seccion.fondo-amarillo { background: var(--yellow); }
.evento-seccion.fondo-amarillo h2 { color: var(--brand); }
.evento-seccion.fondo-amarillo .evento-seccion-inner > p { color: #0032FF; }
.evento-seccion.fondo-amarillo ul { color: rgba(0, 50, 255, .82); }
.evento-seccion.fondo-amarillo-suave { background: #FAF6DE; }

/* ── fotos dentro del texto de una ficha (las genera el panel) ── */
.evento-seccion-inner.con-foto { max-width: 1080px; }
.evento-foto-texto { width: 100%; border-radius: var(--rad); display: block; }
.evento-seccion-inner > .evento-foto-texto { max-width: 820px; margin: 10px auto 0; }
.evento-dos-col {
  display: grid; grid-template-columns: 1.05fr 1fr;
  gap: clamp(24px, 4vw, 48px); align-items: center;
}
.evento-dos-col-texto > p { color: var(--muted); margin-bottom: 16px; }
.evento-dos-col-texto > ul { color: var(--muted); padding-left: 20px; margin-bottom: 4px; }
.evento-dos-col-texto > p:last-child { margin-bottom: 0; }
/* alternancia: las pares llevan la foto a la izquierda */
.evento-dos-col.foto-izquierda .evento-foto-texto { grid-row: 1; grid-column: 1; }
.evento-dos-col.foto-izquierda .evento-dos-col-texto { grid-row: 1; grid-column: 2; }
.evento-duo-fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: stretch; }
.evento-duo-fotos .evento-foto-texto { height: 100%; object-fit: cover; }
@media (max-width: 820px) {
  .evento-dos-col, .evento-duo-fotos { grid-template-columns: 1fr; }
  .evento-dos-col.foto-izquierda .evento-foto-texto,
  .evento-dos-col.foto-izquierda .evento-dos-col-texto { grid-column: auto; grid-row: auto; }
}
.evento-imagen-amplia {
  display: block; width: 100%; max-height: 520px; object-fit: cover;
  border-radius: var(--rad); margin-top: 28px;
}

/* ── talleres / programa como tarjetas ─────────────────── */
.talleres-grid { display: grid; gap: 16px; margin-top: 20px; }
.taller-card {
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--rad);
  padding: 20px 24px; display: flex; gap: 16px; align-items: flex-start;
}
.evento-seccion.fondo-gris .taller-card,
.evento-seccion.fondo-morado .taller-card { background: var(--bg); }
.evento-seccion.fondo-morado .taller-card { color: var(--fg); }
.evento-seccion.fondo-morado .taller-card p { color: var(--muted); }
.taller-num {
  flex: none; width: 34px; height: 34px; border-radius: 50%;
  background: var(--brand); color: #fff; font-family: var(--display); font-weight: 800;
  display: flex; align-items: center; justify-content: center; font-size: 15px;
}
.taller-card-texto h3 { font-size: 17px; margin-bottom: 6px; }
.taller-card-texto p { font-size: 14.5px; color: var(--muted); line-height: 1.65; margin: 0; }
.taller-card-media {
  flex: 0 0 190px; width: 190px; height: 130px; object-fit: cover;
  border-radius: calc(var(--rad) - 4px); align-self: center;
}

/* ── ponentes: filas con foto junto a la bio ───────────── */
.ponentes-grid { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 20px; }
.ponente-card {
  display: grid; grid-template-columns: minmax(150px, 1fr) minmax(0, 3fr); align-items: center;
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--rad); overflow: hidden;
}
.ponente-foto { width: 100%; height: 210px; min-height: 0; overflow: hidden; background: var(--brand2); }
.ponente-foto img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.ponente-foto.logo img { object-fit: contain; object-position: center; padding: 24px; background: #fff; }
.ponente-avatar {
  width: 48px; height: 48px; border-radius: 50%; background: var(--brand); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--display); font-weight: 800; font-size: 17px; margin-bottom: 14px;
}
.ponente-card-info { padding: 18px 28px; align-self: center; }
.ponente-card-info h3 { color: var(--brand); font-size: 18px; margin-bottom: 8px; }
.ponente-card-info p { font-size: 14.5px; color: var(--muted); line-height: 1.65; margin: 0; }
/* variante sin foto */
.ponente-card.sin-foto { grid-template-columns: 1fr; padding: 22px 26px; }
.ponente-card.sin-foto h3 { color: var(--brand); font-size: 18px; margin-bottom: 8px; }
.ponente-card.sin-foto p { font-size: 14.5px; color: var(--muted); line-height: 1.65; margin: 0; }

.colabora-grid {
  display: grid; grid-template-columns: 1fr; gap: 6px;
  max-width: 920px; margin: 20px auto 0;
}
.colabora-card {
  display: grid; grid-template-columns: minmax(150px, 1fr) minmax(0, 3fr);
  grid-template-rows: auto auto; column-gap: clamp(24px, 4vw, 42px); row-gap: 7px;
  align-items: center; background: transparent; border: 0; border-radius: 0;
  border-bottom: 1px solid var(--line); padding: 22px 0;
}
.colabora-card:last-child { border-bottom: 0; }
.colabora-card img {
  grid-column: 1; grid-row: 1 / -1;
  width: 100%; max-width: 190px; max-height: 100px;
  justify-self: center; align-self: center; object-fit: contain;
}
.colabora-card h3 {
  grid-column: 2; grid-row: 1;
  color: var(--brand); font-size: 17px; align-self: end;
}
.colabora-card p {
  grid-column: 2; grid-row: 2;
  font-size: 14px; color: var(--muted); line-height: 1.6; margin: 0; align-self: start;
}

/* ── mapa de ubicación dentro de la ficha ──────────────── */
.evento-mapa-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 48px); align-items: end; margin-top: 20px; }
.evento-mapa-grid iframe { border-radius: var(--rad); display: block; width: 100%; height: 320px; border: 0; }
.evento-mapa-texto img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--rad); margin-top: 14px; }

/* ── hero de post/evento con foto ─────────────────────── */
.post-hero {
  min-height: 460px;
  background-size: cover;
  background-position: center top;
  position: relative;
  display: flex; align-items: flex-end;
}
.post-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(31, 16, 48, .92) 40%, rgba(31, 16, 48, .15) 100%);
  display: flex; align-items: flex-end;
}
.post-hero-content { padding: 48px 28px; max-width: var(--ancho); margin: 0 auto; width: 100%; color: #fff; }
.post-hero-meta { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; flex-wrap: wrap; }
.post-hero-meta .section-tag {
  background: var(--yellow); color: #0032FF;
  font-size: 12px; font-weight: 800; padding: 6px 12px;
  border-radius: 6px; text-transform: uppercase; letter-spacing: .1em;
  margin-bottom: 0;
}
.post-hero-fecha { font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .8); }
.post-hero-content h1 { font-size: clamp(30px, 4vw, 56px); line-height: 1; margin-bottom: 12px; }
.post-hero-desc { font-size: 16px; color: rgba(255, 255, 255, .85); line-height: 1.6; max-width: 62ch; }

/* ── etiquetas genéricas ──────────────────────────────── */
.section-tag {
  display: inline-block; background: var(--brand); color: #fff;
  font-size: 12px; font-weight: 800; padding: 6px 12px; border-radius: 6px;
  margin-bottom: 10px; text-transform: uppercase; letter-spacing: .12em;
}

/* ── bloques de post (foto + texto alternados) ────────── */
.post-body { background: var(--bg); }
.post-titulo-principal {
  font-size: clamp(26px, 3vw, 40px); line-height: 1.05; color: var(--brand);
  text-align: center; padding: 56px 28px 0; max-width: 900px; margin: 0 auto;
}
.post-bloque { padding: clamp(44px, 5vw, 72px) 28px; }
.post-bloque-fondo-gris { background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.post-bloque-fondo-morado { background: #F0E9F7; }
.post-bloque-fondo-amarillo { background: var(--yellow); }
.post-bloque-fondo-amarillo .post-bloque-contenido, .post-bloque-fondo-amarillo h2 { color: #0032FF; }
.post-bloque-inner {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(28px, 4vw, 64px); align-items: center;
  max-width: 1100px; margin: 0 auto;
}
.post-bloque-invertido .post-bloque-inner { direction: rtl; }
.post-bloque-invertido .post-bloque-inner > * { direction: ltr; }
.post-bloque-img { border-radius: var(--rad); overflow: hidden; }
.post-bloque-img img { width: 100%; aspect-ratio: 4/3; object-fit: cover; object-position: center; }
.post-bloque-texto { display: flex; flex-direction: column; gap: 16px; }
.post-bloque-texto h2 {
  color: var(--brand); font-size: clamp(26px, 2.7vw, 36px);
  font-weight: 500; line-height: 1.12; text-align: center;
}
.post-bloque-texto .section-tag { align-self: flex-start; margin-bottom: 0; }
.post-bloque-contenido { font-size: 15px; color: var(--muted); line-height: 1.75; }
.post-bloque-contenido p { margin-bottom: 14px; }
.post-bloque-contenido strong { color: var(--fg); font-weight: 700; }
.post-bloque-contenido a { color: var(--brand); font-weight: 700; border-bottom: 2px solid var(--yellow); }
.post-bloque-contenido ul { display: flex; flex-direction: column; gap: 8px; }
.post-bloque-contenido li {
  font-size: 14px; color: var(--muted); line-height: 1.7;
  padding-left: 20px; position: relative;
}
.post-bloque-contenido li::before {
  content: ""; position: absolute; left: 0; top: 8px;
  width: 10px; height: 10px; border-radius: 2px; background: var(--accent);
}
.post-bloque-contenido ol { padding-left: 20px; list-style: decimal; display: flex; flex-direction: column; gap: 8px; }
.post-bloque-contenido ol li { padding-left: 0; }
.post-bloque-contenido ol li::before { content: none; }

/* ── galería de fotos ─────────────────────────────────── */
.post-galeria { padding: clamp(44px, 5vw, 72px) 28px; background: var(--surface); border-top: 1px solid var(--line); }
.post-galeria-header { max-width: var(--ancho); margin: 0 auto 32px; text-align: center; }
.post-galeria-header h2 {
  color: var(--brand); font-size: clamp(28px, 3vw, 40px);
  font-weight: 500; margin: 10px 0 0;
}
.foto-grid {
  max-width: var(--ancho); margin: 0 auto;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
}
.foto-oculta { display: none; }
.foto-grid-boton-mas {
  grid-column: 1 / -1;
  display: block; width: 100%; text-align: center;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--rad);
  padding: 16px; font-weight: 800; font-size: 14px; color: var(--brand);
  cursor: pointer;
}
.foto-grid-boton-mas:hover { background: var(--bg); }

/* ── agrupación por año (plegable) ─────────────────────── */
.anio-grupo { margin-bottom: 14px; }
.anio-grupo summary {
  list-style: none; cursor: pointer; user-select: none;
  display: flex; align-items: center; gap: 14px;
  padding: 18px 28px; max-width: var(--ancho); margin: 0 auto;
  font-family: var(--display); font-weight: 800; font-size: clamp(26px, 3vw, 38px);
  line-height: 1; color: var(--brand);
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--rad);
  transition: background .15s ease, color .15s ease;
}
.anio-grupo summary:hover { background: var(--yellow); color: #0032FF; }
.anio-grupo summary::-webkit-details-marker { display: none; }
.anio-grupo summary::before {
  content: "+"; flex: none;
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--brand); color: #fff;
  font-size: 22px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
/* año desplegado: banda morada bien visible, no se pierde entre las tarjetas */
.anio-grupo[open] > summary {
  background: var(--brand); color: #fff; border-color: var(--brand);
  border-bottom-left-radius: 0; border-bottom-right-radius: 0;
}
.anio-grupo[open] > summary:hover { background: var(--brand2); color: #fff; }
.anio-grupo[open] > summary::before { content: "−"; background: var(--yellow); color: var(--brand); }
.anio-grupo[open] > summary::after {
  content: attr(data-cuenta); margin-left: auto;
  font-family: var(--body); font-size: 13px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; opacity: .85;
}
.anio-grupo > div {
  padding: 24px 0 8px;
  border: 1px solid var(--line); border-top: 0;
  border-bottom-left-radius: var(--rad); border-bottom-right-radius: var(--rad);
}
.foto-grid img {
  width: 100%; aspect-ratio: 4/3;
  object-fit: cover; border-radius: 12px; cursor: zoom-in;
  transition: transform .15s ease;
}
.foto-grid img:hover { transform: scale(1.015); }
.foto-grid.tres-col { grid-template-columns: repeat(3, 1fr); }
.foto-grid.tres-col img { aspect-ratio: 3/4; object-fit: contain; background: var(--surface); }
.foto-grid.cuatro-dos { grid-template-columns: repeat(2, 1fr); padding: 48px 28px; gap: 20px; }
.franja-fotos {
  background: var(--yellow); padding: 48px 28px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.franja-fotos img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 12px; cursor: zoom-in; }

/* ── volver ───────────────────────────────────────────── */
.post-volver-wrap { max-width: var(--ancho); margin: 0 auto; padding: 32px 28px 48px; }
.post-volver-link {
  font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  color: var(--brand); border-bottom: 2px solid var(--yellow); padding-bottom: 2px;
}

/* ── listado del blog ─────────────────────────────────── */
.blog-listado { max-width: var(--ancho); margin: 0 auto; padding: clamp(36px, 4vw, 56px) 28px; }
.blog-listado-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.blog-card-listado {
  border-radius: var(--rad); overflow: hidden;
  border: 1px solid var(--line); background: var(--surface);
  transition: transform .2s ease, border-color .2s ease;
  display: flex; flex-direction: column;
}
.blog-card-listado:hover { transform: translateY(-5px); border-color: var(--brand); }
.blog-card-img-link { display: block; }
.blog-card-listado-img { width: 100%; aspect-ratio: 16/10; overflow: hidden; position: relative; background: var(--brand2); }
.blog-card-listado-img img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.blog-card-tipo {
  position: absolute; top: 12px; left: 12px;
  background: var(--yellow); color: #0032FF;
  font-size: 11px; font-weight: 800; padding: 5px 10px;
  border-radius: 6px; text-transform: uppercase; letter-spacing: .08em;
}
.blog-card-listado-body { padding: 18px 20px 22px; display: grid; gap: 8px; align-content: start; }
.blog-card-listado-meta { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.blog-card-listado-body h2 { font-family: var(--body); font-size: 18px; font-weight: 700; line-height: 1.3; letter-spacing: normal; }
.blog-card-listado-body h2 a:hover { color: var(--brand); }
.blog-card-listado-resumen { font-size: 14px; color: var(--muted); line-height: 1.6; }
.blog-link {
  font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  color: var(--brand); margin-top: 6px; display: inline-block;
}

/* ── nosotras ─────────────────────────────────────────── */
.hitos-banda { max-width: var(--ancho); margin: 0 auto; padding: clamp(44px, 5vw, 76px) 28px; }
.hitos-header { margin-bottom: clamp(24px, 3vw, 38px); }
.hitos-header h2 { font-size: clamp(24px, 2.8vw, 38px); margin-top: 10px; }

/* línea de tiempo: barra de color segmentada, año y texto a un lado
   e icono al otro, alternando en cada hito */
.linea-tiempo {
  position: relative; list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(5, 1fr); align-items: stretch;
}
.linea-tiempo::before {                     /* la pista, asoma por los extremos */
  content: ""; position: absolute; top: 50%; left: -18px; right: -18px;
  height: 20px; margin-top: -10px; border-radius: 4px;
  background: rgba(77, 44, 108, .10);
}
.hito { position: relative; display: grid; grid-template-rows: 1fr auto 1fr; justify-items: center; }
.hito::before {                             /* el tramo de color */
  content: ""; grid-row: 2; width: 100%; height: 20px; background: var(--c); z-index: 1;
}
.hito:first-child::before { border-radius: 4px 0 0 4px; }
.hito:last-child::before { border-radius: 0 4px 4px 0; }
.hito::after {                              /* el punto sobre el tramo */
  content: ""; position: absolute; top: 50%; left: 50%; z-index: 2;
  width: 11px; height: 11px; margin: -5.5px 0 0 -5.5px;
  border-radius: 50%; background: var(--c-punto);
}
.hito:nth-child(1) { --c: var(--accent); --c-punto: #fff; }
.hito:nth-child(2) { --c: var(--green);  --c-punto: var(--fg); }
.hito:nth-child(3) { --c: var(--yellow); --c-punto: var(--fg); }
.hito:nth-child(4) { --c: var(--brand);  --c-punto: #fff; }
.hito:nth-child(5) { --c: var(--fg);     --c-punto: #fff; }
/* círculo del icono, colgado de la barra por un tallo */
.hito-icono {
  position: relative; width: 58px; height: 58px; border-radius: 50%;
  background: var(--c); display: grid; place-items: center;
  font-size: 25px; line-height: 1;
}
.hito-icono::before {
  content: ""; position: absolute; left: 50%; margin-left: -1px;
  width: 2px; height: 42px; background: var(--c);
}
/* bloque de texto: el año siempre pegado a la barra */
.hito-caja {
  display: flex; gap: 9px; text-align: center;
  padding: 0 12px; max-width: 250px;
}
.hito-anio {
  font-family: var(--display); font-weight: 800;
  font-size: clamp(26px, 2.8vw, 38px); line-height: 1;
  letter-spacing: -0.02em; color: var(--fg);
}
.hito p { font-size: 13.5px; line-height: 1.55; color: var(--muted); }
/* impares: texto arriba, icono abajo */
.hito:nth-child(odd) .hito-caja { grid-row: 1; align-self: end; flex-direction: column-reverse; margin-bottom: 16px; }
.hito:nth-child(odd) .hito-icono { grid-row: 3; align-self: start; margin-top: 42px; }
.hito:nth-child(odd) .hito-icono::before { bottom: 100%; }
/* pares: icono arriba, texto abajo */
.hito:nth-child(even) .hito-icono { grid-row: 1; align-self: end; margin-bottom: 42px; }
.hito:nth-child(even) .hito-icono::before { top: 100%; }
.hito:nth-child(even) .hito-caja { grid-row: 3; align-self: start; flex-direction: column; margin-top: 16px; }

@media (max-width: 900px) {                 /* en móvil, la barra pasa a vertical */
  .linea-tiempo { grid-template-columns: 1fr; }
  .linea-tiempo::before { display: none; }
  .hito {
    grid-template-columns: 54px 1fr; grid-template-rows: auto;
    gap: 0 16px; padding-bottom: 24px; justify-items: start;
  }
  .hito::before {
    position: absolute; grid-row: 1; grid-column: 1;
    left: 25px; top: 12px; bottom: 0; width: 4px; height: auto; border-radius: 4px;
  }
  .hito:last-child::before { display: none; }
  .hito::after { display: none; }
  .hito:nth-child(odd) .hito-icono,
  .hito:nth-child(even) .hito-icono {
    grid-row: 1; grid-column: 1; align-self: start; margin: 0;
    width: 54px; height: 54px; font-size: 23px; z-index: 1;
  }
  .hito-icono::before { display: none; }
  .hito:nth-child(odd) .hito-caja,
  .hito:nth-child(even) .hito-caja {
    grid-row: 1; grid-column: 2; align-self: start; margin: 6px 0 0;
    padding: 0; max-width: none; flex-direction: column; text-align: left;
  }
}

.nosotras-fines { background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: clamp(44px, 5vw, 76px) 28px; }
.nosotras-fines > * { max-width: var(--ancho); margin-left: auto; margin-right: auto; }
.fines-header { margin-bottom: 40px; }
.fines-header h2 { font-size: clamp(26px, 3vw, 42px); margin: 10px 0 8px; }
.fines-header p { font-size: 16px; color: var(--muted); max-width: 600px; }
.fines-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.fin-card { background: var(--bg); border-radius: var(--rad); padding: 24px 20px; border: 1px solid var(--line); }
.fin-num {
  font-family: var(--display); font-size: 30px; font-weight: 800; color: var(--brand);
  margin-bottom: 12px; line-height: 1; padding-bottom: 12px; border-bottom: 3px solid var(--yellow);
}
.fin-card p { font-size: 14px; color: var(--muted); line-height: 1.65; }
.fines-cierre {
  max-width: var(--ancho); margin: 32px auto 0;
  background: #fff; color: var(--brand);
  border: 2px solid var(--brand);
  border-radius: var(--rad); padding: clamp(30px, 4vw, 48px) clamp(26px, 4vw, 56px);
  text-align: center;
}
.fines-cierre p { font-size: 17px; line-height: 1.75; color: var(--brand); }
.fines-cierre p + p { margin-top: 18px; }
.fines-cierre strong { color: var(--accent); }
.fines-cierre p.fines-cierre-fuerte { font-weight: 800; font-size: 19px; color: var(--accent); }

/* datos bancarios de la página de donación */
.donacion-datos { background: var(--bg); border: 1px solid var(--line); border-radius: var(--rad); padding: clamp(22px, 3vw, 34px); max-width: 620px; margin: 6px 0 24px; }
.donacion-datos dl { display: grid; gap: 18px; margin: 0; }
.donacion-datos dt { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; color: var(--brand); margin-bottom: 4px; }
.donacion-datos dd { margin: 0; font-size: 18px; }
.donacion-iban { font-family: ui-monospace, 'Cascadia Code', Consolas, monospace; font-weight: 700; letter-spacing: .03em; font-size: 17px; word-spacing: .1em; }

.nosotras-team { padding: clamp(44px, 5vw, 76px) 28px; }
.nosotras-team > * { max-width: var(--ancho); margin-left: auto; margin-right: auto; }
.nosotras-team.alt { background: var(--surface); border-top: 1px solid var(--line); }
.team-section-header { margin-bottom: 36px; }
.team-section-header h2 { font-size: clamp(26px, 3vw, 42px); margin: 10px 0 8px; }
.team-section-header p { font-size: 16px; color: var(--muted); }
.team-grid-elaborado { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; }
.team-card-elaborado { border-radius: var(--rad); overflow: hidden; border: 1px solid var(--line); background: var(--surface); }
.team-card-img { width: 100%; aspect-ratio: 3/4; overflow: hidden; background: var(--brand2); }
.team-card-img img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.team-card-info { padding: 14px 16px 18px; }
.team-card-info h3 { font-family: var(--body); font-size: 15px; font-weight: 700; margin-bottom: 4px; letter-spacing: normal; }
.team-card-info h3 a { color: inherit; text-decoration: none; }
.team-card-info h3 a:hover,
.team-card-info h3 a:focus-visible { color: var(--brand); text-decoration: underline; }
.team-role {
  display: inline-block; background: var(--yellow); color: #0032FF;
  font-size: 11px; font-weight: 800; padding: 3px 8px; border-radius: 6px;
  margin-bottom: 6px; text-transform: uppercase; letter-spacing: .06em;
}
.team-card-info p { font-size: 12px; color: var(--muted); line-height: 1.5; }

/* ── únete ────────────────────────────────────────────── */
.unete-bloque-section { padding: clamp(44px, 5vw, 80px) 28px; }
.unete-bloque-section.alt { background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.unete-bloque {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(28px, 4vw, 64px); align-items: center;
  max-width: 1100px; margin: 0 auto;
}
.unete-bloque.invertido { direction: rtl; }
.unete-bloque.invertido > * { direction: ltr; }
.unete-bloque-img { border-radius: var(--rad); overflow: hidden; }
.unete-bloque-img img { width: 100%; aspect-ratio: 4/3; object-fit: cover; object-position: center; }
.unete-bloque-texto { display: flex; flex-direction: column; gap: 16px; }
.unete-bloque-texto h2 { font-size: clamp(24px, 2.8vw, 36px); line-height: 1.08; }
.unete-bloque-texto .section-tag { align-self: flex-start; margin-bottom: 0; }
.unete-bloque-texto p { font-size: 15px; color: var(--muted); line-height: 1.7; }
.unete-bloque-texto .btn-amarillo, .unete-bloque-texto .btn-morado, .unete-bloque-texto .btn-yellow { align-self: flex-start; }
.unete-lista { display: flex; flex-direction: column; gap: 12px; }
.unete-lista li {
  font-size: 14px; color: var(--muted); line-height: 1.7;
  padding-left: 22px; position: relative;
}
.unete-lista li::before {
  content: ""; position: absolute; left: 0; top: 7px;
  width: 10px; height: 10px; border-radius: 2px; background: var(--accent);
}
.unete-lista li strong { color: var(--fg); }

.beca-banda { background: var(--brand); color: #fff; }
.beca-banda-inner {
  max-width: var(--ancho); margin: 0 auto;
  padding: clamp(48px, 6vw, 90px) 28px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 34px; align-items: center;
}
.beca-banda h2 { font-size: clamp(26px, 3vw, 42px); line-height: 1.04; }
.beca-banda p { font-size: 17px; line-height: 1.65; opacity: .92; }
.beca-banda .btn-amarillo { justify-self: start; }
.beca-banda-texto { display: grid; gap: 18px; }

.unete-empresas { background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: clamp(44px, 5vw, 80px) 28px; }
.unete-empresas > * { max-width: var(--ancho); margin-left: auto; margin-right: auto; }
.unete-empresas-header { margin-bottom: 40px; }
.unete-empresas-header h2 { font-size: clamp(26px, 3vw, 42px); margin: 10px 0 8px; }
.unete-empresas-header p { font-size: 16px; color: var(--muted); max-width: 600px; }
.empresa-grid-elaborado { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.empresa-card-elaborado {
  background: var(--bg); border-radius: var(--rad); overflow: hidden;
  border: 1px solid var(--line); display: flex; flex-direction: column;
}
.empresa-card-elaborado.destacada { border: 2px solid var(--brand); background: var(--yellow); }
.empresa-card-elaborado.destacada .empresa-badge { background: var(--brand); color: #fff; }
.empresa-card-elaborado.destacada .empresa-card-body-elaborado p { color: var(--brand); }
.empresa-card-img { width: 100%; aspect-ratio: 16/9; overflow: hidden; background: var(--brand2); }
.empresa-card-img img { width: 100%; height: 100%; object-fit: cover; }
.empresa-card-body-elaborado { padding: 22px; display: grid; gap: 10px; align-content: start; }
.empresa-badge {
  display: inline-block; justify-self: start;
  background: var(--yellow); color: #0032FF;
  font-size: 11px; font-weight: 800; padding: 4px 10px;
  border-radius: 6px; text-transform: uppercase; letter-spacing: .06em;
}
.empresa-card-body-elaborado h3 { font-family: var(--body); font-size: 17px; font-weight: 800; letter-spacing: normal; }
.empresa-card-body-elaborado p { font-size: 14px; color: var(--muted); line-height: 1.65; }
.empresa-card-body-elaborado a {
  font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--brand);
}

.unete-otras { padding: clamp(44px, 5vw, 80px) 28px; }
.unete-otras > * { max-width: var(--ancho); margin-left: auto; margin-right: auto; }
.unete-otras-header { margin-bottom: 40px; }
.unete-otras-header h2 { font-size: clamp(26px, 3vw, 42px); margin: 10px 0 8px; }
.otras-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.otra-card { padding: 28px 24px; border-radius: var(--rad); border: 1px solid var(--line); background: var(--surface); }
.otra-icon { font-size: 28px; margin-bottom: 14px; }
.otra-card h3 { font-family: var(--body); font-size: 16px; font-weight: 700; margin-bottom: 8px; letter-spacing: normal; }
.otra-card p { font-size: 14px; color: var(--muted); line-height: 1.65; }

.unete-cta {
  background: var(--brand); color: #fff;
  padding: clamp(48px, 6vw, 72px) 28px;
  text-align: center; display: flex; flex-direction: column;
  align-items: center; gap: 16px;
}
.unete-cta h2 { font-size: clamp(28px, 3vw, 40px); }
.unete-cta p { font-size: 16px; opacity: .8; }
.btn-green {
  background: var(--yellow); color: #0032FF;
  padding: 14px 28px; border-radius: 999px;
  font-size: 14px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
  display: inline-block;
}
.btn-green:hover { background: var(--accent); color: #fff; }
.btn-yellow {
  background: var(--yellow); color: #0032FF;
  padding: 13px 26px; border-radius: 999px;
  font-size: 14px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
  display: inline-block;
}
.btn-yellow:hover { background: var(--accent); color: #fff; }

/* ── contacto ─────────────────────────────────────────── */
.contacto-grid {
  max-width: var(--ancho); margin: 0 auto;
  padding: clamp(48px, 6vw, 96px) 28px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: clamp(32px, 5vw, 72px);
}
.contacto-info { display: grid; gap: 22px; align-content: start; }
.contacto-info h1 { font-size: clamp(32px, 4.4vw, 62px); line-height: 1; }
.contacto-info > p { font-size: 17px; line-height: 1.65; color: var(--muted); max-width: 44ch; }
.contacto-email-grande {
  font-size: clamp(20px, 2.4vw, 30px); font-weight: 700;
  border-bottom: 3px solid var(--yellow); justify-self: start;
}
.contacto-sociales { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.contacto-sociales a {
  font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  padding: 13px 18px; border-radius: 999px; border: 1px solid var(--line2);
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.contacto-sociales a:hover { background: var(--yellow); color: #0032FF; border-color: var(--yellow); }
.contacto-panel {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--rad); padding: clamp(24px, 3vw, 40px);
  display: grid; gap: 16px; align-content: start;
}
.contacto-panel h2 { font-size: 24px; }
.contacto-panel > p { font-size: 15px; color: var(--muted); }
.contacto-panel iframe { border-radius: 12px; display: block; width: 100%; border: 0; }

/* ── formulario propio (escribe en el Google Form de YWT) ── */
.form-ywt { display: grid; gap: 18px; margin-top: 4px; }
.form-ywt .campo { display: grid; gap: 8px; border: 0; padding: 0; margin: 0; }
.form-ywt label,
.form-ywt legend {
  font-family: var(--body); font-size: 12px; font-weight: 800; color: var(--brand);
  text-transform: uppercase; letter-spacing: .12em; padding: 0;
}
.form-ywt .req { color: var(--accent); }
.form-ywt input[type="text"],
.form-ywt input[type="email"],
.form-ywt textarea {
  width: 100%; font-family: var(--body); font-size: 16px; color: var(--fg);
  background: var(--bg); border: 1px solid var(--line2); border-radius: 12px;
  padding: 13px 15px; transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.form-ywt textarea { resize: vertical; min-height: 120px; line-height: 1.6; }
.form-ywt input::placeholder,
.form-ywt textarea::placeholder { color: var(--muted); opacity: .65; }
.form-ywt input:focus,
.form-ywt textarea:focus {
  outline: 0; background: var(--surface);
  border-color: var(--brand2); box-shadow: 0 0 0 4px rgba(106, 62, 147, .14);
}
/* motivo: pastillas seleccionables */
.pastillas-radio { display: flex; flex-wrap: wrap; gap: 8px; }
.pastillas-radio label { margin: 0; cursor: pointer; }
.pastillas-radio input { position: absolute; opacity: 0; width: 0; height: 0; }
.pastillas-radio span {
  display: inline-block; font-family: var(--body); font-size: 13px; font-weight: 700;
  text-transform: none; letter-spacing: 0; color: var(--fg);
  padding: 11px 16px; border-radius: 999px; border: 1px solid var(--line2);
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.pastillas-radio label:hover span { border-color: var(--brand2); }
.pastillas-radio input:checked + span { background: var(--brand); border-color: var(--brand); color: #fff; }
.pastillas-radio input:focus-visible + span { box-shadow: 0 0 0 4px rgba(106, 62, 147, .18); }
/* newsletter */
.form-ywt .campo-check {
  display: grid; grid-template-columns: auto 1fr; gap: 11px; align-items: start;
  font-size: 13.5px; font-weight: 400; text-transform: none; letter-spacing: 0;
  color: var(--muted); line-height: 1.55; cursor: pointer;
}
.form-ywt .campo-check input { width: 19px; height: 19px; margin-top: 2px; accent-color: var(--brand); }
/* botón */
.form-ywt .btn-enviar {
  justify-self: start; font-family: var(--body); font-size: 15px; font-weight: 800;
  background: var(--accent); color: #fff; border: 0; border-radius: 999px;
  padding: 14px 28px; cursor: pointer;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.form-ywt .btn-enviar:hover { background: var(--yellow); color: #0032FF; transform: translateY(-1px); }
.form-ywt .btn-enviar[disabled] { opacity: .6; cursor: default; transform: none; }
.form-ywt .form-nota {
  font-size: 12.5px; color: var(--muted); line-height: 1.6; text-transform: none;
  letter-spacing: 0; font-weight: 400;
}
.form-ywt .form-nota a { color: var(--brand); font-weight: 700; border-bottom: 1px solid var(--yellow); }
.form-ywt .form-aviso {
  font-size: 15px; font-weight: 700; line-height: 1.5;
  background: var(--green); color: var(--fg);
  border-radius: 12px; padding: 14px 16px;
}
.form-ywt .form-aviso.error { background: var(--accent); color: #fff; }
.form-sink { display: none; }

/* --- alta de socia (formulario en Únete) --- */
.socia-alta { background: var(--surface); border-top: 1px solid var(--line); padding: clamp(48px, 6vw, 80px) 28px; scroll-margin-top: 84px; }
.socia-alta-inner { max-width: 780px; margin: 0 auto; }
.socia-alta-cabecera { text-align: center; margin-bottom: 34px; }
.socia-alta-cabecera h2 { font-size: clamp(26px, 3vw, 40px); margin: 10px 0 12px; }
.socia-cuota { font-size: 17px; color: var(--muted); line-height: 1.6; }
.socia-cuota strong { color: var(--brand); }
.socia-pasos { display: grid; gap: 12px; margin-bottom: 34px; }
.socia-paso { display: flex; gap: 16px; align-items: flex-start; background: var(--bg); border: 1px solid var(--line); border-radius: var(--rad); padding: 16px 20px; }
.socia-paso-num { flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--brand); color: #fff; display: grid; place-items: center; font-weight: 800; font-family: var(--display); }
.socia-paso h3 { font-size: 16px; margin-bottom: 3px; }
.socia-paso p { font-size: 14px; color: var(--muted); line-height: 1.6; }
.socia-form { background: var(--bg); border: 1px solid var(--line); border-radius: var(--rad); padding: clamp(24px, 3vw, 36px); }
.socia-cierre { text-align: center; font-size: 16px; color: var(--muted); line-height: 1.7; margin-top: 28px; }
.socia-cierre strong { color: var(--fg); }
.socia-beneficios { max-width: 640px; margin: 0 auto 34px; display: grid; gap: 10px; list-style: none; padding: 0; }
.socia-beneficios li { position: relative; padding-left: 28px; font-size: 15px; color: var(--muted); line-height: 1.6; }
.socia-beneficios li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--brand); font-weight: 800; }

/* becas: convocatoria cerrada */
.beca-badge-cerrada {
  align-self: flex-start; margin-top: 8px; display: inline-block;
  padding: 11px 20px; border-radius: 999px;
  background: #fff; border: 1.5px solid var(--brand); color: var(--brand);
  font-weight: 800; font-size: 14px; letter-spacing: .02em;
}
.beca-aviso-cerrada { max-width: var(--ancho); margin: 0 auto; padding: 24px 28px 0; }
.beca-aviso-cerrada p {
  max-width: 900px; margin: 0 auto; background: #FAF6DE; border: 1px solid #E7DFA6;
  border-radius: var(--rad); padding: 18px 24px; text-align: center;
  font-size: 16px; line-height: 1.65; color: var(--brand);
}
.beca-aviso-cerrada a { color: var(--brand); font-weight: 700; border-bottom: 1px solid var(--brand); }
.form-ywt .fila { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 560px) { .form-ywt .fila { grid-template-columns: 1fr; } }

/* ── footer ───────────────────────────────────────────── */
.footer { background: #4D2C6C; color: #F4EEFB; }
.footer-inner {
  max-width: var(--ancho); margin: 0 auto;
  padding: clamp(48px, 6vw, 84px) 28px 30px;
  display: grid; gap: 40px;
}
.footer-top {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 34px; align-items: start;
}
.footer-brand { display: grid; gap: 16px; }
.footer-brand img { height: 40px; width: auto; filter: brightness(0) invert(1); }
.footer-brand p { font-size: 15px; line-height: 1.6; opacity: .78; max-width: 34ch; }
.footer-col { display: grid; gap: 2px; align-content: start; }
.footer-col h4 {
  font-family: var(--body); font-size: 12px; font-weight: 800;
  letter-spacing: .16em; text-transform: uppercase; opacity: .6;
}
.footer-col a { font-size: 16px; opacity: .9; padding: 8px 0; transition: color .15s ease; }
.footer-col a:hover { color: var(--yellow); }
.footer-col p { font-size: 16px; line-height: 1.5; opacity: .9; }
.footer-col .btn-amarillo { justify-self: start; font-size: 13px; padding: 14px 22px; }
.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, .14); padding-top: 20px;
  display: flex; flex-wrap: wrap; gap: 12px 28px; align-items: center; justify-content: space-between;
  font-size: 13px; opacity: .6;
}
.footer-bottom a { color: inherit; border-bottom: 1px solid rgba(255, 255, 255, .3); }
.footer-bottom a:hover { opacity: 1; }

/* ── lightbox ─────────────────────────────────────────── */
.actividades-grid img, .damos-gracias-logo img { cursor: zoom-in; }
.lightbox {
  position: fixed; inset: 0; z-index: 500;
  background: rgba(31, 16, 48, .95);
  display: none; align-items: center; justify-content: center;
}
.lightbox.abierto { display: flex; }
.lightbox img {
  max-width: 92vw; max-height: 88vh;
  width: auto; height: auto; border-radius: 8px;
  aspect-ratio: auto; object-fit: contain;
}
.lightbox-cerrar, .lightbox-prev, .lightbox-next {
  position: absolute; background: rgba(255, 255, 255, .12);
  color: #fff; border: none; cursor: pointer;
  border-radius: 999px; font-size: 22px;
  width: 44px; height: 44px; display: flex;
  align-items: center; justify-content: center;
}
.lightbox-cerrar { top: 18px; right: 18px; }
.lightbox-prev { left: 18px; top: 50%; transform: translateY(-50%); }
.lightbox-next { right: 18px; top: 50%; transform: translateY(-50%); }
.lightbox-cerrar:hover, .lightbox-prev:hover, .lightbox-next:hover { background: var(--accent); }

/* ── carrusel ─────────────────────────────────────────── */
.carrusel { position: relative; width: 100%; border-radius: var(--rad); overflow: hidden; }
.carrusel-track { position: relative; }
.carrusel-slide { display: none; }
.carrusel-slide.activa { display: block; }
.carrusel-slide img { width: 100%; aspect-ratio: 3/4; object-fit: contain; background: #fff; border-radius: var(--rad); }
.carrusel-btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(77, 44, 108, .85); color: #fff;
  border: none; padding: 10px 16px; cursor: pointer;
  font-size: 18px; border-radius: 8px; z-index: 2;
}
.carrusel-btn:hover { background: var(--accent); }
.carrusel-prev { left: 10px; }
.carrusel-next { right: 10px; }
.carrusel-puntos { display: flex; justify-content: center; gap: 8px; padding: 10px 0 4px; }
.carrusel-punto { width: 9px; height: 9px; border-radius: 50%; background: var(--line2); cursor: pointer; }
.carrusel-punto.activo { background: var(--brand); }

/* ── secciones especiales del post "Damos con la tecla" ── */
.damos-actividades {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 40px; align-items: start;
  padding: clamp(44px, 5vw, 64px) 28px 24px;
  background: var(--surface); border-top: 1px solid var(--line);
}
.damos-actividades > * { max-width: 620px; }
.damos-actividades-texto { display: flex; flex-direction: column; gap: 14px; justify-self: end; }
.damos-actividades-texto h2 { font-size: clamp(22px, 2.4vw, 30px); }
.damos-actividades-texto ol { padding-left: 20px; list-style: decimal; }
.damos-actividades-texto ol li, .damos-actividades-texto ul li { font-size: 15px; color: var(--muted); line-height: 1.7; }
.damos-actividades-texto ul { padding-left: 20px; list-style: disc; }
.damos-actividades-texto p { font-size: 15px; color: var(--muted); line-height: 1.75; }
.damos-actividades-texto a:not(.boton-donacion) { color: var(--brand); font-weight: 700; border-bottom: 2px solid var(--yellow); }
.damos-actividades-carrusel { max-width: 300px; justify-self: start; }
.damos-descarga-btn { padding: 24px 28px 48px; background: var(--surface); border-bottom: 1px solid var(--line); }
.btn-descarga-ancho {
  display: block; max-width: 820px; margin: 0 auto;
  background: var(--brand); color: #fff;
  padding: 16px 0; border-radius: 999px;
  font-size: 14px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
  text-align: center;
}
.btn-descarga-ancho:hover { background: var(--accent); }
.damos-referentes { max-width: var(--ancho); margin: 0 auto; padding: clamp(44px, 5vw, 64px) 28px; }
.damos-referentes h2 { font-size: clamp(22px, 2.4vw, 30px); margin: 10px 0 16px; }
.damos-referentes p { font-size: 15px; color: var(--muted); line-height: 1.75; margin-bottom: 40px; }
.damos-como-tenerlo { padding: clamp(44px, 5vw, 64px) 28px; background: var(--yellow); }
.damos-como-inner {
  max-width: var(--ancho); margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(28px, 4vw, 56px); align-items: center;
}
.damos-como-video { display: flex; justify-content: center; }
.damos-como-texto { display: flex; flex-direction: column; gap: 14px; }
.damos-como-texto h2 { font-size: clamp(22px, 2.4vw, 30px); color: #0032FF; }
.damos-como-texto p { font-size: 15px; color: #0032FF; line-height: 1.75; }
.damos-como-texto a:not(.boton-donacion) { font-weight: 700; border-bottom: 2px solid #0032FF; }
.damos-como-texto .section-tag { background: #0032FF; color: var(--yellow); align-self: flex-start; }
.damos-gracias {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(28px, 4vw, 56px); align-items: center;
  padding: clamp(44px, 5vw, 64px) 28px; max-width: var(--ancho); margin: 0 auto;
}
.damos-gracias-texto h2 { font-size: clamp(22px, 2.4vw, 30px); color: var(--brand); margin: 10px 0 16px; }
.damos-gracias-texto p { font-size: 15px; color: var(--muted); line-height: 1.75; margin-bottom: 12px; }
.damos-gracias-logo { display: flex; justify-content: center; align-items: center; }
.damos-gracias-logo img { max-width: 260px; height: auto; }
.boton-donacion-wrap { margin-top: 12px; display: flex; }
.boton-donacion {
  background: var(--accent); color: #fff;
  padding: 12px 28px; border-radius: 999px;
  font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
  display: inline-block;
}
.boton-donacion:hover { background: var(--brand); color: #fff; }
/* la píldora de donación nunca hereda el color/subrayado de los enlaces del contenedor */
a.boton-donacion, a.boton-donacion:hover { color: #fff; border-bottom: 0; }
.texto-con-fotos {
  display: grid; grid-template-columns: 1fr 2fr 1fr;
  gap: 32px; align-items: center;
  padding: clamp(44px, 5vw, 64px) 28px; max-width: var(--ancho); margin: 0 auto;
}
.texto-con-fotos-img img { width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: var(--rad); }
.texto-con-fotos-contenido { font-size: 15px; color: var(--muted); line-height: 1.75; }
.texto-con-fotos-contenido h2 { font-size: clamp(20px, 2.2vw, 28px); margin-bottom: 16px; color: var(--fg); }
.texto-con-fotos-contenido p { margin-bottom: 14px; }
.texto-con-fotos-contenido strong { color: var(--fg); font-weight: 700; }
.texto-con-fotos-contenido ul { padding-left: 20px; list-style: disc; }
.texto-con-fotos-contenido li { margin-bottom: 8px; }
.texto-con-fotos-contenido a { color: var(--brand); font-weight: 700; border-bottom: 2px solid var(--yellow); }
.video-wrap { width: 100%; max-width: 300px; margin: 0; border-radius: var(--rad); overflow: hidden; aspect-ratio: 9/16; background: var(--dark); }
.video-wrap iframe { width: 100%; height: 100%; display: block; border: 0; }
.actividades-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.actividades-grid img { width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: 8px; }
.boton-galeria-wrap { padding: 48px 28px 56px; display: flex; justify-content: center; }
.boton-galeria {
  background: var(--brand); color: #fff;
  padding: 13px 28px; border-radius: 999px;
  font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
  display: inline-block;
}
.boton-galeria:hover { background: var(--accent); }
.agradecimientos-logo { display: flex; justify-content: center; padding: 40px 28px; }
.agradecimientos-logo img { max-width: 200px; height: auto; }

/* ── responsive ───────────────────────────────────────── */
@media (max-width: 980px) {
  .eventos-grid, .events-grid, .blog-listado-grid, .foto-grid,
  .foto-grid.tres-col, .franja-fotos, .otras-grid,
  .empresa-grid-elaborado { grid-template-columns: repeat(2, 1fr); }
  .fines-grid { grid-template-columns: repeat(2, 1fr); }
  .team-grid-elaborado { grid-template-columns: repeat(3, 1fr); }
  .actividades-grid { grid-template-columns: repeat(2, 1fr); }
  .evento-detalles { grid-template-columns: 1fr; }
  .evento-mapa-grid { grid-template-columns: 1fr; }
  .damos-actividades, .damos-como-inner, .damos-gracias { grid-template-columns: 1fr; }
  .damos-actividades-texto { justify-self: stretch; }
  .damos-actividades-carrusel { justify-self: center; }
  .nosotras-hero { grid-template-columns: 1fr; grid-template-rows: auto; }
  .nosotras-hero-imagen { height: 260px; }
}

@media (max-width: 760px) {
  .cabecera-inner { padding: 12px 18px; gap: 14px; }
  .nav-toggle { display: block; }
  .nav-links {
    display: none; position: absolute; top: 100%; left: 0; right: 0;
    background: var(--bg); flex-direction: column; gap: 0;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 12px 24px rgba(31, 16, 48, .1);
    align-items: stretch; margin-left: 0;
  }
  .nav-links.abierto { display: flex; }
  .nav-links a { display: block; padding: 14px 24px; font-size: 15px; border-radius: 0; }
  .nav-cta { display: none; }

  .post-bloque-inner, .unete-bloque, .texto-con-fotos { grid-template-columns: 1fr; }
  .ponente-card { grid-template-columns: 1fr; }
  .ponente-foto { min-height: 0; height: auto; aspect-ratio: 4/3; }
  .ponente-card-info { padding: 20px 22px 24px; }
  .colabora-card {
    grid-template-columns: 1fr; grid-template-rows: auto;
    gap: 12px; padding: 22px 0;
  }
  .colabora-card img {
    grid-column: 1; grid-row: auto;
    width: min(220px, 72%); max-width: none; max-height: 90px;
    justify-self: start;
  }
  .colabora-card h3, .colabora-card p { grid-column: 1; grid-row: auto; }
  .taller-card { flex-wrap: wrap; }
  .taller-card-media { flex-basis: calc(100% - 50px); width: calc(100% - 50px); height: 170px; }
  .taller-card-texto { flex-basis: 100%; }
  .eventos-grid, .events-grid, .blog-listado-grid, .foto-grid,
  .foto-grid.tres-col, .foto-grid.cuatro-dos, .franja-fotos, .otras-grid,
  .empresa-grid-elaborado, .fines-grid, .actividades-grid { grid-template-columns: 1fr; }
  .team-grid-elaborado { grid-template-columns: repeat(2, 1fr); }
  .proximo-evento-inner .enlace-subrayado { margin-left: 0; }
  .post-hero-content { padding: 36px 18px; }
}

@media (max-width: 440px) {
  .team-grid-elaborado { grid-template-columns: 1fr; }
}

/* ── próximos eventos: listado horizontal (los pasados van en cuadritos) ── */
#grid-proximos { grid-template-columns: 1fr; gap: 18px; }
#grid-proximos .event-card {
  display: grid; grid-template-columns: 300px 1fr; align-items: stretch;
  transition: border-color .2s ease, box-shadow .2s ease;
}
#grid-proximos .event-card:hover { transform: none; box-shadow: 0 6px 20px rgba(77, 44, 108, .1); }
#grid-proximos .event-img-wrap { height: 100%; min-height: 215px; aspect-ratio: auto; }
#grid-proximos .event-body { padding: 24px 28px; align-content: center; gap: 8px; }
#grid-proximos .event-body h3 { font-family: var(--display); font-size: 23px; font-weight: 800; line-height: 1.2; }
#grid-proximos .event-body p { font-size: 15px; line-height: 1.6; max-width: 70ch; }
#grid-proximos .event-enlaces { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 8px; }
#grid-proximos .event-link { margin-top: 0; }

/* ── página de Recursos ────────────────────────────────── */
.recursos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; margin-top: 22px; }
.recurso-card {
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--rad);
  padding: 24px; display: grid; gap: 10px; align-content: start;
  transition: transform .15s ease, border-color .15s ease;
}
.recurso-card:hover { transform: translateY(-3px); border-color: var(--brand); }
.recurso-icono { font-size: 30px; line-height: 1; }
.recurso-card h3 { font-size: 18px; line-height: 1.25; }
.recurso-cta { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--brand); }
.evento-seccion.fondo-gris .recurso-card { background: var(--surface); }

@media (max-width: 980px) {
  #grid-proximos .event-card { grid-template-columns: 220px 1fr; }
}
@media (max-width: 760px) {
  #grid-proximos .event-card { grid-template-columns: 1fr; }
  #grid-proximos .event-img-wrap { min-height: 0; aspect-ratio: 16/10; }
  #grid-proximos .event-body { padding: 20px 22px 24px; }
  .evento-detalles { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: 1fr; }
}

/* ── Recursos: The Easy Drive embebido ─────────────────── */
.recursos-barra { background: var(--green); border-bottom: 1px solid rgba(0, 50, 255, .12); }
.recursos-barra-inner {
  max-width: var(--ancho); margin: 0 auto; padding: 14px 28px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px;
}
.recursos-barra-texto { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.recursos-barra-texto strong { font-family: var(--display); font-weight: 800; font-size: 20px; color: var(--fg); }
.recursos-barra-nota { font-size: 14px; color: rgba(0, 50, 255, .75); }
.recursos-barra .enlace-subrayado { margin-left: auto; color: var(--fg); border-bottom-color: var(--fg); }
.recursos-marco { background: var(--surface); }
.recursos-marco iframe { display: block; width: 100%; height: 1150px; border: 0; }
/* en móvil el marco queda apretado: se oculta y se muestran las tarjetas */
.solo-movil { display: none; }
@media (max-width: 900px) {
  .recursos-barra, .recursos-marco { display: none; }
  .solo-movil { display: block; }
}

/* ══════════════════════════════════════════════════════════
   PROPUESTA: cabecera de ficha de evento rediseñada
   - banda verde del claim de lado a lado, pegada al hero
   - tira de datos flotante: una sola pieza con separadores
   ══════════════════════════════════════════════════════════ */

/* banda del claim, a todo el ancho */
.evento-claim {
  background: var(--green); color: var(--fg);
  padding: clamp(34px, 4.5vw, 58px) 28px clamp(52px, 6vw, 78px);
  text-align: center;
}
.evento-claim p {
  max-width: 26ch; margin: 0 auto;
  font-family: var(--display); font-weight: 800;
  font-size: clamp(24px, 3.4vw, 42px); line-height: 1.12;
  text-wrap: balance;
}

/* tira de datos: una pieza, flotando sobre el borde de la banda */
.evento-datos {
  width: min(var(--ancho), calc(100% - 56px));
  margin: clamp(30px, 3.5vw, 44px) auto 0; position: relative; z-index: 2;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--rad);
  box-shadow: 0 14px 40px rgba(77, 44, 108, .13);
  display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
  overflow: hidden;
}
/* si viene después de la banda verde, la solapa */
.evento-claim + .evento-datos { margin-top: -34px; }
.evento-dato { padding: 22px 26px; border-left: 1px solid var(--line); }
.evento-dato:first-child { border-left: 0; }
.evento-dato h3 {
  font-family: var(--body); font-size: 11px; font-weight: 800;
  text-transform: uppercase; letter-spacing: .14em; color: var(--muted);
  display: flex; align-items: center; gap: 7px; margin-bottom: 9px;
}
.evento-dato h3 .ico { font-size: 15px; }
.evento-dato p { font-family: var(--display); font-size: 20px; font-weight: 800; line-height: 1.2; color: var(--fg); }
.evento-dato p small {
  display: block; font-family: var(--body); font-size: 13.5px;
  font-weight: 400; color: var(--muted); margin-top: 5px;
}
/* celda de inscripción: destaca en rosa, ocupa su columna */
.evento-dato.dato-inscripcion {
  background: var(--accent); border-left-color: var(--accent);
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 11px;
}
.evento-dato.dato-inscripcion h3 { margin-bottom: 0; }
.evento-dato.dato-inscripcion h3 { color: rgba(255, 255, 255, .85); }
.evento-dato.dato-inscripcion .btn-dato {
  display: inline-block; background: #fff; color: var(--accent);
  font-weight: 800; font-size: 14px; padding: 10px 18px; border-radius: 999px;
}
.evento-dato.dato-inscripcion .btn-dato:hover { background: var(--yellow); color: #0032FF; }
/* margen inferior antes del cuerpo */
.evento-datos + .evento-seccion { padding-top: clamp(38px, 4.5vw, 60px); }

@media (max-width: 900px) {
  .evento-datos {
    grid-auto-flow: row; grid-auto-columns: auto;
    width: calc(100% - 36px); margin: clamp(22px, 3vw, 32px) auto 0;
  }
  .evento-claim + .evento-datos { margin-top: -26px; }
  .evento-dato { border-left: 0; border-top: 1px solid var(--line); }
  .evento-dato:first-child { border-top: 0; }
  .evento-dato.dato-inscripcion { border-top-color: var(--accent); }
}

/* ── página legal (privacidad / aviso legal / cookies) ── */
.legal { max-width: 820px; margin: 0 auto; padding: clamp(40px, 5vw, 72px) 28px; }
.legal > h2 { font-family: var(--display); font-size: clamp(20px, 2.4vw, 26px); color: var(--brand); margin: 40px 0 12px; }
.legal > h2:first-child { margin-top: 0; }
.legal h3 { font-size: 16px; color: var(--fg); margin: 22px 0 8px; }
.legal p, .legal li { font-size: 15.5px; line-height: 1.75; color: var(--muted); }
.legal p { margin-bottom: 14px; }
.legal ul { padding-left: 22px; margin: 8px 0 16px; }
.legal li { margin-bottom: 6px; }
.legal a { color: var(--brand); font-weight: 600; border-bottom: 1px solid var(--yellow); }
.legal strong { color: var(--fg); }
.legal-datos { background: var(--surface); border: 1px solid var(--line); border-radius: var(--rad); padding: 20px 24px; margin: 4px 0 20px; }
.legal-datos p { margin-bottom: 4px; }
.legal-tabla { width: 100%; border-collapse: collapse; margin: 8px 0 20px; font-size: 14.5px; }
.legal-tabla th, .legal-tabla td { text-align: left; padding: 11px 13px; border: 1px solid var(--line); vertical-align: top; line-height: 1.6; }
.legal-tabla th { background: var(--surface); color: var(--fg); font-weight: 700; }
.legal-tabla td { color: var(--muted); }
.legal-actualizado { font-size: 13px; color: var(--muted); opacity: .8; margin-top: 44px; padding-top: 20px; border-top: 1px solid var(--line); }
@media (max-width: 620px) {
  .legal-tabla, .legal-tabla tbody, .legal-tabla tr, .legal-tabla td, .legal-tabla th { display: block; width: 100%; }
  .legal-tabla th { border-bottom: 0; }
  .legal-tabla td { border-top: 0; }
}

/* ═══════════ navegación móvil (mejoras de usabilidad táctil) ═══════════ */

/* los anclajes (#contenido, "saltar al contenido") no quedan tapados por la cabecera fija */
html { scroll-padding-top: 80px; }

/* botón flotante "volver arriba" (lo crea js/main.js en páginas largas) */
.btn-arriba {
  position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  width: 48px; height: 48px; border-radius: 50%;
  border: none; cursor: pointer; z-index: 90;
  background: var(--brand); color: #fff; font-size: 22px; line-height: 1;
  box-shadow: 0 6px 20px rgba(77, 44, 108, .35);
  display: none; align-items: center; justify-content: center;
  opacity: 0; transform: translateY(8px); transition: opacity .2s ease, transform .2s ease;
}
.btn-arriba.visible { display: flex; opacity: 1; transform: translateY(0); }
.btn-arriba:hover { background: var(--brand2); }

/* en pantallas táctiles el :hover se queda "pegado" tras tocar: se neutralizan
   los efectos de elevación para que las tarjetas no se queden levantadas */
@media (hover: none) {
  .pilar-tarjeta:hover, .event-card:hover, .blog-card-listado:hover,
  #grid-proximos .event-card:hover, .recurso-card:hover { transform: none; }
  .post-mini:hover img, .sponsor-enlace:hover img, .foto-grid img:hover { transform: none; }
}

/* realimentación al tocar: un ligero hundido en los elementos interactivos */
@media (hover: none) {
  .btn-amarillo:active, .btn-morado:active, .btn-borde-claro:active,
  .nav-cta:active, .event-link:active, .pilar-cta:active { opacity: .7; }
  .event-card:active, .pilar-tarjeta:active, .blog-card-listado:active { transform: scale(.99); }
}

/* ══════════ aviso de idioma (solo a visitantes no hispanohablantes) ══════════ */
.aviso-idioma {
  position: fixed; left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  max-width: 460px; margin: 0 auto; z-index: 95;
  background: var(--brand); color: #fff; border-radius: var(--rad);
  box-shadow: 0 10px 34px rgba(77, 44, 108, .4);
  padding: 14px 16px; display: flex; align-items: flex-start; gap: 12px;
  font-family: var(--body); font-size: 13.5px; line-height: 1.5;
}
.aviso-idioma button {
  flex: none; background: rgba(255, 255, 255, .18); color: #fff; border: 0;
  width: 30px; height: 30px; border-radius: 50%; cursor: pointer; font-size: 14px; line-height: 1;
}
.aviso-idioma button:hover { background: rgba(255, 255, 255, .32); }