/* Hallmark · genre: editorial · macrostructure: Marquee Hero · theme: studied-DNA (source: image public/cartel/velada.jfif)
 * nav: N7 Brutal slab · footer: Ft8 Marquee scroll · secciones: T3 cita · S2 hanging · chips disciplinas · logo-cards · C4 sticky
 * motion (3 primitivas): reveal hero · CTA lift · marquee footer — Sport 0.7×
 * contrast: pass (40–41) · slop: pass (42–45) · honest: pass (46) · chrome: pass (47) · tokens: pass (48)
 * responsive: pass (49) · mobile: pass (34, 49, 50–57) · icons: pass (30)
 */

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

html { overflow-x: clip; scroll-behavior: smooth; }
body {
  overflow-x: clip;
  margin: 0;
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-weight: 300;
  font-size: var(--text-base);
  line-height: 1.6;
  padding-inline: max(0px, env(safe-area-inset-left)) max(0px, env(safe-area-inset-right));
}

img { max-width: 100%; height: auto; display: block; }

h1, h2, h3 {
  font-family: var(--font-display);
  font-style: normal;
  text-transform: uppercase;

  line-height: 1.04;
  margin: 0;
  overflow-wrap: anywhere;
  min-width: 0;
}

h2 { font-size: var(--text-display); font-weight: 800; }
h3 { font-size: var(--text-xl); font-weight: 700; }

p { margin: 0 0 var(--space-md); }

a {
  color: var(--color-ink);
  text-decoration-color: var(--color-rule);
  text-underline-offset: 0.2em;
  transition: text-decoration-color var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out);
}
a:hover { text-decoration-color: var(--color-accent); color: var(--color-accent); }

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

::selection { background: var(--color-accent); color: var(--color-ink-dark); }

.mono {
  font-family: var(--font-mono);
  font-size: var(--text-sm);

  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}

.pendiente { color: var(--color-neutral); }

.visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.rule-thick { border: 0; border-top: var(--rule-thick); margin: 0; }

/* ── CTA slab (voz Sport: bloque sólido) ───────────────────────────── */
.cta-slab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: var(--space-xs) var(--space-lg);
  background: var(--color-accent);
  color: var(--color-ink-dark);
  font-family: var(--font-display);
  font-weight: 800;
  font-size: var(--text-md);
  text-transform: uppercase;

  text-decoration: none;
  white-space: nowrap;
  transition: background-color var(--dur-short) var(--ease-out), transform 100ms var(--ease-out);
}
.cta-slab:hover { background: var(--color-focus); color: var(--color-ink-dark); transform: translateY(-1.5px); }
.cta-slab:active { transform: translateY(1px); }
.cta-slab.is-pendiente {
  background: var(--color-paper-2);
  color: var(--color-muted);
  border: var(--rule-hair);
  cursor: not-allowed;
}
.cta-slab--grande { font-size: var(--text-lg); padding: var(--space-sm) var(--space-2xl); }

/* Enlaces-chip con marco (sustituye al enlace subrayado simple) */
.link-tipo {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  min-height: 36px;
  padding: var(--space-2xs) var(--space-sm);
  border: 1px solid var(--color-rule);
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--text-sm);
  color: var(--color-accent);
  text-decoration: none;
  white-space: nowrap;
  transition: border-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), transform 100ms var(--ease-out);
}
.link-tipo:hover {
  border-color: var(--color-accent);
  color: var(--color-focus);
  transform: translateY(-1px);
}

/* Botón con marco (estilo "Abrir ubicación") */
.cta-borde {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: var(--space-xs) var(--space-lg);
  border: 1px solid var(--color-accent);
  color: var(--color-accent);
  font-family: var(--font-display);
  font-size: var(--text-md);
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), transform 100ms var(--ease-out);
}
.cta-borde:hover {
  background: var(--color-accent);
  color: var(--color-ink-dark);
  transform: translateY(-1.5px);
}
.cta-borde:active { transform: translateY(1px); }

/* ── NAV · N7 Brutal slab ──────────────────────────────────────────── */
.nav-slab {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-sm) var(--page-gutter);
  border-bottom: var(--rule-slab);
  background: var(--color-paper);
}
.slab-mark {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.slab-mark img {
  height: 2.4rem;
  width: auto;
  transition: transform var(--dur-micro) var(--ease-out);
}
.slab-mark:hover img { transform: translateY(-1px); }
.slab-nav { margin-inline-start: auto; }
.slab-nav ul { display: flex; gap: var(--space-lg); list-style: none; padding: 0; margin: 0; }
.slab-nav a {
  text-transform: uppercase;

  font-size: var(--text-sm);
  font-weight: 500;
  font-family: var(--font-body);
  text-decoration: none;
  white-space: nowrap;
}
.slab-nav a:hover { color: var(--color-accent); }

.menu-btn {
  display: none;
  min-height: 44px;
  min-width: 44px;
  margin-inline-start: auto;
  padding: var(--space-xs) var(--space-sm);
  background: none;
  border: var(--rule-hair);
  color: var(--color-ink);
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  text-transform: uppercase;

  cursor: pointer;
}
.menu-btn:hover { border-color: var(--color-accent); color: var(--color-accent); }
.menu-btn:active { transform: translateY(1px); }
.menu-btn[aria-expanded="true"] { background: var(--color-paper-3); }

.menu-movil {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  background: var(--color-paper);
  padding: calc(var(--space-3xl)) var(--page-gutter) var(--space-xl);
  overflow-y: auto;
}
.menu-movil ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-md); }
.menu-movil a {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: var(--text-2xl);
  text-transform: uppercase;
  text-decoration: none;
  display: block;
  padding-block: var(--space-2xs);
  border-bottom: var(--rule-hair);
}
.menu-movil a:hover { color: var(--color-accent); }

/* ── HERO · H1 Marquee · glow del cartel ───────────────────────────── */
.hero {
  position: relative;
  min-height: 82dvh;
  display: grid;
  align-content: end;
  padding: var(--space-xl) var(--page-gutter) var(--space-2xl);
  background-image:
    var(--glow),
    linear-gradient(180deg, var(--velo-suave), var(--velo-denso)),
    url("../public/fondos/ring.jpg");
  background-size: auto, auto, cover;
  background-position: center top, center, center 30%;
  background-repeat: no-repeat;
}
.hero__kicker {
  color: var(--color-muted);
  margin: 0 0 var(--space-md);
}
.hero__display {
  margin: 0;
  width: 100%;
  display: flex;
  justify-content: center;
}
.hero__logo {
  width: min(100%, 46rem);
  height: auto;
}
.hero__finco {
  width: 7.5rem;
  height: auto;
  margin-bottom: var(--space-md);
}
.hero__sub {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-lg);
  text-transform: uppercase;

  background: var(--color-plate);
  color: var(--color-ink-dark);
  width: fit-content;
  padding: var(--space-2xs) var(--space-sm);
  transform: rotate(-1.2deg);
  margin: var(--space-md) 0 var(--space-lg);
}
.hero__data {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs) var(--space-sm);
  color: var(--color-muted);
  margin: 0;
}
.hero__fecha { color: var(--color-accent); }

/* ── LEMA · T3 cita única ──────────────────────────────────────────── */
.lema {
  padding: var(--space-3xl) var(--page-gutter);
  background-image:
    linear-gradient(180deg, var(--velo-suave), var(--velo-suave)),
    url("../public/fondos/humo.jpg");
  background-size: auto, cover;
  background-position: center, center;
  background-repeat: no-repeat;
}
.lema__cita {
  margin: 0;
  max-width: 28ch;
  overflow-wrap: anywhere;
  min-width: 0;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.75rem, 4vw + 0.5rem, 3.4rem);
  line-height: 1.15;
  text-transform: none;
}
.lema__cita strong { color: var(--color-accent); font-weight: 800; }

/* ── LA CAUSA ──────────────────────────────────────────────────────── */
.causa {
  padding: var(--space-2xl) var(--page-gutter) var(--space-3xl);
  border-top: var(--rule-hair);
}
.head-hang { padding-block: 0 var(--space-xl); }
.causa__cuerpo { max-width: 58ch; }
.causa__cuerpo strong { font-weight: 600; color: var(--color-accent); }

.causa__orgs {
  list-style: none;
  padding: 0;
  margin: var(--space-xl) 0 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-lg);
  max-width: 52rem;
}
.org {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: var(--space-lg);
  row-gap: var(--space-2xs);
  align-items: center;
  padding: var(--space-md);
  border: var(--rule-hair);
}
.org__logo {
  grid-row: 1 / 3;
  background: var(--color-plate);
  display: grid;
  place-items: center;
  padding: var(--space-xs);
  aspect-ratio: 1;
}
.org__logo img { max-height: 100%; object-fit: contain; }
.org__nombre {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-lg);
  text-transform: uppercase;
  line-height: 1.06;
  align-self: end;
  overflow-wrap: anywhere;
  min-width: 0;
}
.org .link-tipo { align-self: start; justify-self: start; }
.causa__cierre {
  margin-top: var(--space-xl);
  max-width: 50ch;
  color: var(--color-muted);
}

/* ── DISCIPLINAS · chips del cartel ────────────────────────────────── */
.disciplinas {
  padding: var(--space-3xl) var(--page-gutter);
  border-top: var(--rule-hair);
  background: var(--color-paper-2);
}
.disciplinas__head { padding-block: 0 var(--space-xl); }
.disciplinas__nota { color: var(--color-neutral); margin: var(--space-xs) 0 0; }
.disc-lista {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
  gap: var(--space-sm);
}
.disc {
  border: var(--rule-slab);
  padding: var(--space-lg) var(--space-md) var(--space-md);
  display: grid;
  gap: var(--space-2xs);
}
.disc__nombre {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: var(--text-2xl);
  text-transform: uppercase;
  line-height: 1.02;
  overflow-wrap: anywhere;
  min-width: 0;
}
.disc__info { color: var(--color-neutral); }

/* ── LOS COMBATES · enfrentamientos con hover ──────────────────────── */
.combates {
  position: relative;
  overflow: clip;
  padding: var(--space-3xl) var(--page-gutter);
  border-top: var(--rule-hair);
}
.combates::before {
  content: "";
  position: absolute;
  inset: -1.5rem;
  background-image:
    linear-gradient(180deg, var(--velo-suave), var(--velo-denso)),
    url("../public/fondos/arena.jpg");
  background-size: auto, cover;
  background-position: center, center 25%;
  background-repeat: no-repeat;
  filter: blur(7px);
}
.combates > * { position: relative; z-index: var(--z-base); }
.combate { background-color: var(--velo-carta); }
.combates__nota { color: var(--color-neutral); margin: var(--space-xs) 0 0; }
.combate-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-lg);
}
.combate {
  border: var(--rule-hair);
  padding: var(--space-md) var(--space-md) var(--space-lg);
  transition: border-color var(--dur-short) var(--ease-out);
}
.combate:hover,
.combate:focus-within { border-color: var(--color-accent); }
.combate__meta {
  color: var(--color-neutral);
  margin: 0 0 var(--space-md);
}
.combate__match {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: var(--space-sm);
  align-items: center;
}
.combate__lado {
  display: grid;
  gap: var(--space-xs);
  justify-items: center;
  text-align: center;
}
.combate__foto {
  width: min(100%, 11rem);
  aspect-ratio: 3 / 4;
  background: linear-gradient(180deg, var(--color-paper-3), var(--color-paper-2));
  border: var(--rule-hair);
  display: grid;
  place-items: center;
  overflow: hidden;
}
.combate__foto > span {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: var(--text-3xl);
  color: var(--color-rule);
}
.combate__foto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--dur-short) var(--ease-out);
}
.combate:hover .combate__foto img { transform: scale(1.03); }
/* siluetas "por anunciar": contenidas y ancladas al suelo del hueco */
.combate__foto img.silueta {
  object-fit: contain;
  object-position: center bottom;
  padding: 12% 10% 0;
}
.combate__foto img.silueta--espejo { transform: scaleX(-1); }
.combate:hover .combate__foto img.silueta { transform: scale(1.02); }
.combate:hover .combate__foto img.silueta--espejo { transform: scaleX(-1) scale(1.02); }
.combate__nombre {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-lg);
  text-transform: uppercase;
  line-height: 1.06;
  overflow-wrap: anywhere;
  min-width: 0;
  position: relative;
  padding-bottom: var(--space-2xs);
  transition: color var(--dur-short) var(--ease-out);
}
.combate__nombre::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 3px;
  background: var(--color-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--dur-short) var(--ease-out);
}
.combate:hover .combate__nombre,
.combate:focus-within .combate__nombre { color: var(--color-accent); }
.combate:hover .combate__nombre::after,
.combate:focus-within .combate__nombre::after { transform: scaleX(1); }
.combate__nombre.is-tba { color: var(--color-neutral); }
.combate__vs {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: var(--text-2xl);
  color: var(--color-neutral);
  transition: color var(--dur-short) var(--ease-out);
}
.combate:hover .combate__vs { color: var(--color-accent); }

/* ── ASÍ SE VIVIÓ · vídeo vertical ─────────────────────────────────── */
.video {
  padding: var(--space-2xl) var(--page-gutter) var(--space-3xl);
  border-top: var(--rule-hair);
  background: var(--color-paper-2);
}
.video__cuerpo {
  display: grid;
  gap: var(--space-xl);
  align-items: center;
}
.video__fila {
  display: grid;
  gap: var(--space-lg);
  justify-items: center;
  width: 100%;
}
.video__marco { border: var(--rule-slab); }
.video__marco--vertical {
  width: min(100%, 18rem);
  aspect-ratio: 9 / 16;
}
.video__marco--ancho {
  width: min(100%, 38rem);
  aspect-ratio: 16 / 9;
}
.video__marco iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
.video__texto { max-width: 45ch; color: var(--color-muted); margin: 0; }

/* ── PATROCINADORES · sección clara: logos transparentes en contraste ─
 * El token --color-accent se re-mapea aquí al dorado bronce para que
 * esquinas, hovers y destacados mantengan contraste sobre claro (gate 41). */
.patros {
  --color-accent: var(--color-accent-oscuro);
  background: var(--color-plate);
  color: var(--color-ink-dark);
  padding: var(--space-2xl) var(--page-gutter) var(--space-3xl);
  border-top: var(--rule-thick);
}
.patros .pendiente { color: var(--color-neutral-luz); }
.patros .link-tipo {
  color: var(--color-accent-oscuro);
  border-color: oklch(80% 0.03 85);
}
.patros .link-tipo:hover { color: var(--color-ink-dark); border-color: var(--color-accent-oscuro); }
.patros__lista {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
  gap: var(--space-lg);
}
/* Marco estilo cartel de boxeo: esquinas doradas + doble marco */
.patro {
  --esq: 1.4rem;   /* largo del bisel de esquina */
  --gros: 3px;     /* grosor del bisel */
  position: relative;
  display: grid;
  grid-template-rows: 10rem minmax(0, 1fr) auto; /* logo · nombre · enlace: filas iguales en las 4 tarjetas */
  gap: var(--space-xs);
  border: 1px solid var(--color-plate); /* camuflado con la sección: solo se ven las esquinas */
  background-image:
    linear-gradient(var(--color-accent), var(--color-accent)),
    linear-gradient(var(--color-accent), var(--color-accent)),
    linear-gradient(var(--color-accent), var(--color-accent)),
    linear-gradient(var(--color-accent), var(--color-accent)),
    linear-gradient(var(--color-accent), var(--color-accent)),
    linear-gradient(var(--color-accent), var(--color-accent)),
    linear-gradient(var(--color-accent), var(--color-accent)),
    linear-gradient(var(--color-accent), var(--color-accent));
  background-repeat: no-repeat;
  background-position:
    top left, top left,
    top right, top right,
    bottom left, bottom left,
    bottom right, bottom right;
  background-size:
    var(--esq) var(--gros), var(--gros) var(--esq),
    var(--esq) var(--gros), var(--gros) var(--esq),
    var(--esq) var(--gros), var(--gros) var(--esq),
    var(--esq) var(--gros), var(--gros) var(--esq);
  padding: var(--space-md) var(--space-md) var(--space-lg);
  transition: border-color var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out);
}
.patro:hover,
.patro:focus-within {
  border-color: var(--color-accent);
  transform: translateY(-3px);
}
.patro__logo {
  position: relative;
  height: 10rem;
}
.patro__logo img {
  position: absolute;
  inset: var(--space-md);
  width: calc(100% - 2 * var(--space-md));
  height: calc(100% - 2 * var(--space-md));
  object-fit: contain; /* nunca recorta: encaja el logo entero en la caja */
}
.patro__logo--invert img { filter: invert(1); }
.patro__logo--compacto img {
  inset: 14%;
  width: 72%;
  height: 72%;
}
.patro__nombre {
  font-family: var(--font-display);
  font-size: var(--text-md);
  text-transform: uppercase;
  margin-top: var(--space-2xs);
  overflow-wrap: anywhere;
  min-width: 0;
  align-self: start;
}
.patro .link-tipo { align-self: end; }

.patros__invita {
  margin-top: var(--space-3xl);
  padding: var(--space-xl) var(--space-lg);
  border: 2px solid var(--color-ink-dark);
  max-width: 40rem;
}
.patros__invita h3 { margin-bottom: var(--space-sm); }
.patros__invita p { margin-bottom: var(--space-xs); }
.patros__invita strong { color: var(--color-accent); font-weight: 600; }
.patros__invita .pendiente { margin-top: var(--space-md); }

/* ── ENTRADAS ──────────────────────────────────────────────────────── */
.entradas {
  position: relative;
  overflow: clip;
  padding: var(--space-3xl) var(--page-gutter) var(--space-4xl);
  border-top: var(--rule-thick);
}
.entradas::before {
  content: "";
  position: absolute;
  inset: -1.5rem;
  background-image:
    linear-gradient(180deg, var(--velo-denso), var(--velo-suave)),
    url("../public/fondos/arena.jpg");
  background-size: auto, cover;
  background-position: center, center 70%;
  background-repeat: no-repeat;
  filter: blur(9px);
}
.entradas > * { position: relative; z-index: var(--z-base); }
.entradas__display { max-width: 12ch; }
.entradas__estado { margin: var(--space-md) 0 var(--space-xl); max-width: 45ch; }

/* ── INFORMACIÓN DE INTERÉS · ficha tabular ────────────────────────── */
.info {
  padding: var(--space-2xl) var(--page-gutter) var(--space-3xl);
  border-top: var(--rule-hair);
}
.info__tabla { margin: 0; max-width: 52rem; }
.info__fila {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2xs);
  padding-block: var(--space-sm);
  border-bottom: var(--rule-hair);
}
.info__fila:first-of-type { border-top: var(--rule-hair); }
.info__fila dt {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  text-transform: uppercase;

  color: var(--color-neutral);
  font-variant-numeric: tabular-nums;
}
.info__fila dd { margin: 0; }

/* ── Sede: tarjeta + mapa Leaflet oscuro ───────────────────────────── */
.sede {
  display: grid;
  gap: var(--space-lg);
  max-width: 72rem;
  margin: 0 auto var(--space-2xl);
  text-align: left;
}
.sede__carta {
  background: var(--color-paper-2);
  border: var(--rule-hair);
  padding: var(--space-lg);
  display: grid;
  gap: var(--space-sm);
  justify-items: start;
  align-content: start;
}
.sede__etiqueta { color: var(--color-accent); margin: 0; }
.sede__nombre { font-size: var(--text-xl); }
.sede__dir { margin: 0; color: var(--color-muted); }
.sede__datos { margin: 0; display: grid; gap: var(--space-xs); }
.sede__datos dt { color: var(--color-neutral); }
.sede__datos dd { margin: 0; }
.sede__carta .cta-borde { margin-top: var(--space-sm); }
.sede__mapa {
  min-height: 20rem;
  border: var(--rule-slab);
  background: var(--color-paper-2);
}
/* Leaflet adaptado al tema */
.leaflet-container { background: var(--color-paper-2); font-family: var(--font-body); }
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  background: var(--color-paper-2);
  color: var(--color-ink);
  border-radius: 0;
  box-shadow: 0 0 0 1px var(--color-rule);
}
.leaflet-popup-content { margin: var(--space-sm) var(--space-md); }
.leaflet-popup-content strong { color: var(--color-accent); font-weight: 600; }
.leaflet-container a.leaflet-popup-close-button { color: var(--color-muted); }
.leaflet-bar a {
  background: var(--color-paper-2);
  color: var(--color-ink);
  border-color: var(--color-rule);
}
.leaflet-bar a:hover { background: var(--color-paper-3); color: var(--color-accent); }
.pin-oro { filter: drop-shadow(0 2px 3px oklch(10% 0.01 80 / 0.6)); }

/* ── CTA STICKY · C4 ───────────────────────────────────────────────── */
.cta-sticky {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: var(--z-sticky);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-xs) var(--page-gutter);
  padding-bottom: max(var(--space-xs), env(safe-area-inset-bottom));
  background: var(--color-paper);
  border-top: var(--rule-slab);
  transform: translateY(100%);
  transition: transform var(--dur-long) var(--ease-out);
}
.cta-sticky.is-visible { transform: translateY(0); }
.cta-sticky__texto { color: var(--color-muted); }

/* ── FOOTER · Ft8 Marquee ──────────────────────────────────────────── */
.foot { border-top: var(--rule-slab); padding-bottom: var(--space-3xl); }
.foot__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md) var(--space-xl);
  align-items: center;
  padding: var(--space-lg) var(--page-gutter) 0;
  color: var(--color-neutral);
}
.foot__organiza { display: flex; align-items: center; gap: var(--space-sm); }
.foot__organiza img { width: 3rem; height: auto; }
.foot__organiza strong { color: var(--color-ink); font-weight: 500; }

/* ── Anton es de peso único: nada de negrita sintética ─────────────── */
h1, h2, h3,
.cta-slab,
.menu-movil a,
.hero__sub,
.lema__cita,
.lema__cita strong,
.disc__nombre,
.combate__nombre,
.combate__vs,
.combate__foto > span,
.org__nombre,
.patro__nombre,
.foot-marquee__track span { font-weight: 400; }

/* ── Composición centrada (petición del cliente: registro La Velada) ─
 * Nota Hallmark: centrado-global es una elección explícita del brief,
 * no un default — el canvas (ring + glow) es el diseño. */
.hero { justify-items: center; text-align: center; }
.hero__data { justify-content: center; }
.head-hang { text-align: center; }
.lema { text-align: center; }
.lema__cita { margin-inline: auto; }
.causa__cuerpo, .causa__cierre { margin-inline: auto; text-align: center; }
.causa__orgs { margin-inline: auto; }
.disciplinas__head { text-align: center; }
.disc { justify-items: center; text-align: center; }
.combate__meta { text-align: center; }
.video__cuerpo { justify-content: center; justify-items: center; text-align: center; }
.video__col { justify-items: center; text-align: center; }
.patro { text-align: center; }
.patro .link-tipo { justify-self: center; }
.patros__invita { margin-inline: auto; text-align: center; }
.entradas { text-align: center; }
.entradas__display, .entradas__estado { margin-inline: auto; }
.info__tabla { margin-inline: auto; }
.foot__meta { justify-content: center; }

/* ── Página de aviso legal ─────────────────────────────────────────── */
.legal {
  max-width: 65ch;
  margin: 0 auto;
  padding: var(--space-2xl) var(--page-gutter) var(--space-3xl);
}
.legal h1 { margin-bottom: var(--space-2xs); }
.legal h2 { font-size: var(--text-lg); margin: var(--space-xl) 0 var(--space-sm); }
.legal-dominio { color: var(--color-neutral); margin: 0 0 var(--space-lg); }
.legal-fecha { color: var(--color-neutral); margin-top: var(--space-2xl); }
.legal strong { font-weight: 600; color: var(--color-accent); }
.legal-volver { margin-inline-start: auto; }
.foot__legal { color: var(--color-neutral); font-size: var(--text-sm); }

/* ── Entrada orquestada del hero (una sola vez, ≤ 400 ms total) ────── */
.reveal {
  opacity: 0;
  transform: translateY(8px);
  animation: reveal var(--dur-long) var(--ease-out) forwards;
  animation-delay: calc(var(--i, 0) * 60ms);
}
@keyframes reveal { to { opacity: 1; transform: none; } }

/* ── Breakpoints ───────────────────────────────────────────────────── */
@media (max-width: 40rem) {
  /* tarjetas de causa en vertical: los handles largos de Instagram necesitan el ancho completo */
  .org {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    justify-items: center;
    text-align: center;
  }
  .org__logo { grid-row: auto; width: 7rem; }
  .org__nombre { align-self: auto; }
  .org .link-tipo { justify-self: center; max-width: 100%; }
  .slab-nav { display: none; }
  .cta-slab--nav { display: none; }
  .cta-slab--nav.legal-volver { display: inline-flex; } /* el "Volver" del aviso legal sí se muestra en móvil */
  .nav-slab .menu-btn { display: inline-flex; align-items: center; justify-content: center; }
  .cta-sticky .cta-slab--nav { display: inline-flex; }
}

@media (min-width: 40.0625rem) {
  .menu-btn, .menu-movil { display: none !important; }
  .cta-sticky { display: none; }
  .info__fila { grid-template-columns: 15rem minmax(0, 1fr); gap: var(--space-lg); }
}

@media (min-width: 60rem) {
  /* sesgo izquierdo editorial: el cuerpo respira a la derecha */
  .causa__cuerpo, .lema__cita, .entradas__estado { margin-inline-end: auto; }
  .causa__orgs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .disc-lista { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .combate-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sede { grid-template-columns: 21rem minmax(0, 1fr); }
  /* los tres embeds comparten altura exacta en escritorio */
  .video__fila { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; }
  .video__marco--vertical { width: auto; height: clamp(18rem, 26vw, 24rem); }
  .video__marco--ancho { width: auto; height: clamp(18rem, 26vw, 24rem); }
  .cartel .head-hang { padding-block: 0; }
  .patros__lista { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ── Movimiento reducido ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 150ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 150ms !important;
  }
  html { scroll-behavior: auto; }
  .reveal { animation: reveal-reduced 150ms linear forwards; }
  @keyframes reveal-reduced { to { opacity: 1; transform: none; } }
}