/*
 * Altruistas — tema «Chapas».
 * Cada causa del blog es una chapa de campaña solidaria: foto en círculo con un anillo de color que lleva su lema.
 * Fondo de papel claro, tinta casi negra, amarillo girasol de portada y seis colores de campaña por turnos.
 * Tipografías: Parkinsans (la letra que encargó la ONG Parkinson's UK; rótulos e interfaz) y Faustina (lectura).
 */

:root {
  --fondo: #fbf8f2;
  --fondo-2: #f3ede2;
  --blanco: #fff;
  --tinta: #1f1b2e;
  --tinta-2: #565166;
  --borde: #e4dccd;
  --sol: #f6c445;
  --coral: #e4572e;
  --coral-osc: #b23a17;
  --verde: #23946c;
  --azul: #2d6fcb;
  --rosa: #d6508d;
  --lila: #7a58c4;
  --sombra: 0 1px 2px rgba(31, 27, 46, .06), 0 16px 36px -22px rgba(31, 27, 46, .4);

  --f-titulo: "Parkinsans", "Segoe UI", system-ui, sans-serif;
  --f-texto: "Faustina", Georgia, "Times New Roman", serif;

  /* escala tipográfica (1,25) */
  --t-xs: .8125rem;
  --t-s: .9375rem;
  --t-m: 1.0625rem;
  --t-l: 1.25rem;
  --t-xl: clamp(1.375rem, 1.15rem + 1vw, 1.75rem);
  --t-2xl: clamp(1.75rem, 1.35rem + 1.8vw, 2.5rem);
  --t-3xl: clamp(2.125rem, 1.45rem + 3vw, 3.75rem);
  --t-4xl: clamp(2.75rem, 1.5rem + 5.6vw, 6rem);

  /* espaciado (base 8) */
  --e-1: .25rem;
  --e-2: .5rem;
  --e-3: 1rem;
  --e-4: 1.5rem;
  --e-5: 2rem;
  --e-6: 3rem;
  --e-7: 4rem;
  --e-8: 6rem;
  --bloque: clamp(4rem, 3rem + 4vw, 7rem);

  --caja: 76rem;
  --lateral: clamp(1.25rem, 4vw, 2.5rem);

  /* variables del contenido común */
  --ancho-texto: 42rem;
  --ancho-amplio: 60rem;
  --radio: 14px;
  --color-texto: var(--tinta);
  --color-fondo: var(--fondo);
  --color-suave: var(--fondo-2);
  --color-borde: var(--borde);
  --color-acento: var(--coral-osc);
  --color-acento-texto: #fff;
  --color-tenue: var(--tinta-2);
  --fuente-texto: var(--f-texto);
  --fuente-titulos: var(--f-titulo);
  color-scheme: light;
  accent-color: var(--coral);
  scrollbar-color: var(--coral) var(--fondo-2);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 6rem; }
body {
  margin: 0;
  background: var(--fondo);
  color: var(--tinta);
  font: 400 var(--t-m)/1.6 var(--f-titulo);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: rgba(246, 196, 69, .55); color: var(--tinta); }
img { max-width: 100%; height: auto; }
a { color: var(--coral-osc); text-underline-offset: .2em; text-decoration-thickness: 1px; transition: color .18s ease; }
a:hover { color: var(--tinta); text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--azul); outline-offset: 3px; border-radius: 4px; }
main:focus { outline: none; }
h1, h2, h3, h4 { font-family: var(--f-titulo); font-weight: 800; line-height: 1.08; text-wrap: balance; margin: 0; letter-spacing: -.02em; overflow-wrap: break-word; }
main { overflow-x: clip; }
/* aviso de cookies del motor: con la letra de lectura (más estrecha) ocupa menos alto en móvil */
body .x-cookies p:first-child { font-family: var(--f-texto); font-size: 15px; line-height: 1.4; }
p { text-wrap: pretty; }
.icono { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.2em; }

.caja { width: min(100% - 2 * var(--lateral), var(--caja)); margin-inline: auto; }
.saltar { position: absolute; left: var(--e-3); top: -10rem; z-index: 100; background: var(--tinta); color: #fff; padding: var(--e-3) var(--e-4); font-weight: 700; text-decoration: none; border-radius: 999px; }
.saltar:focus { top: var(--e-3); color: #fff; }
.x-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* rótulos comunes */
.antetitulo {
  display: flex; align-items: center; gap: var(--e-2);
  margin: 0 0 var(--e-3);
  font: 700 var(--t-xs)/1.3 var(--f-titulo); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-2);
}
.antetitulo::before { content: ""; width: .75rem; height: .75rem; border-radius: 50%; background: var(--c, var(--coral)); box-shadow: 1rem 0 0 var(--sol), 2rem 0 0 var(--azul); margin-right: 2.3rem; flex: none; }
.seccion-cabecera { max-width: 46rem; margin-bottom: var(--e-6); }
.seccion-cabecera-ancha { max-width: 60rem; }
.seccion-titulo { font-size: var(--t-2xl); }
.seccion-titulo-grande { font-size: var(--t-3xl); line-height: 1.04; }
.seccion-titulo-peq { font-size: var(--t-xl); margin-bottom: var(--e-5); }
.seccion-entradilla { margin: var(--e-4) 0 0; font: 400 var(--t-l)/1.55 var(--f-texto); color: var(--tinta-2); max-width: 40rem; }

/* botones */
.botones-fila { display: flex; flex-wrap: wrap; gap: var(--e-3); margin: var(--e-5) 0 0; }
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--e-2);
  min-height: 3rem; padding: .75rem 1.5rem;
  background: var(--tinta); color: #fff; border: 2px solid var(--tinta); border-radius: 999px;
  font: 700 var(--t-m)/1.2 var(--f-titulo); text-decoration: none; cursor: pointer;
  transition: background-color .18s ease, color .18s ease, transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.boton:hover { background: var(--coral); border-color: var(--coral); color: var(--tinta); transform: translateY(-2px); box-shadow: 0 8px 18px -10px rgba(31, 27, 46, .6); }
.boton:active { transform: translateY(0); box-shadow: none; }
.boton-claro { background: transparent; color: var(--tinta); }
.boton-claro:hover { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.enlace-flecha { display: inline-flex; align-items: center; gap: var(--e-2); min-height: 2.75rem; font-weight: 700; text-decoration: none; color: var(--coral-osc); }
.enlace-flecha .icono { transition: transform .18s ease; }
.enlace-flecha:hover .icono { transform: translateX(4px); }
.etiqueta {
  display: inline-flex; align-items: center; gap: .4em; min-height: 2rem; padding: .25rem .8rem;
  border-radius: 999px; background: var(--fondo-2); color: var(--tinta);
  font: 700 var(--t-xs)/1.2 var(--f-titulo); letter-spacing: .02em; text-decoration: none;
  transition: background-color .18s ease, color .18s ease;
}
.etiqueta:hover { background: var(--tinta); color: #fff; }
.etiqueta-grande { min-height: 2.75rem; padding: .5rem 1.1rem; font-size: var(--t-s); background: #fff; border: 1px solid var(--borde); }
.etiqueta span { opacity: .7; }

/* cabecera */
.cabecera { position: sticky; top: 0; z-index: 30; background: rgba(251, 248, 242, .95); border-bottom: 1px solid var(--borde); backdrop-filter: saturate(1.2) blur(6px); }
.cabecera-fila { display: flex; align-items: center; gap: var(--e-5); min-height: 5rem; }
.marca { display: flex; align-items: center; gap: .75rem; color: var(--tinta); text-decoration: none; margin-right: auto; min-height: 44px; }
.marca:hover { color: var(--tinta); }
.marca-chapa { width: 2.75rem; height: 2.75rem; transition: transform .3s cubic-bezier(.2, .7, .3, 1.3); filter: drop-shadow(0 3px 4px rgba(31, 27, 46, .2)); }
.marca:hover .marca-chapa { transform: rotate(-14deg) scale(1.06); }
.marca-textos { display: flex; flex-direction: column; }
.marca-nombre { font: 800 1.6rem/1 var(--f-titulo); letter-spacing: -.03em; }
.marca-lema { margin-top: .25rem; font: italic 400 var(--t-s)/1.2 var(--f-texto); color: var(--tinta-2); }
.navegacion .menu { display: flex; gap: var(--e-1); list-style: none; margin: 0; padding: 0; }
.navegacion .menu a {
  display: flex; align-items: center; min-height: 2.75rem; padding: 0 .85rem;
  color: var(--tinta); font-weight: 600; text-decoration: none; border-radius: 999px;
  transition: background-color .18s ease, color .18s ease;
}
.navegacion .menu a:hover { background: var(--fondo-2); }
.navegacion .menu a[aria-current="page"] { background: var(--sol); }
.navegacion-buscar { display: none; }
.cabecera-buscar {
  display: inline-flex; align-items: center; gap: .5rem; min-height: 2.75rem; padding: 0 1.1rem;
  background: var(--tinta); border-radius: 999px; color: #fff; font-weight: 700; text-decoration: none;
  transition: background-color .18s ease, color .18s ease;
}
.cabecera-buscar:hover, .cabecera-buscar[aria-current="page"] { background: var(--coral); color: var(--tinta); }
.menu-boton { display: none; }

/* chapas */
.chapa {
  position: relative; display: inline-block; flex: none; vertical-align: middle;
  width: var(--d, 160px); max-width: 100%; aspect-ratio: 1; border-radius: 50%;
  background: var(--c, var(--coral));
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .06), 0 2px 3px rgba(31, 27, 46, .18), 0 14px 22px -12px rgba(31, 27, 46, .5);
}
.chapa-foto { position: absolute; left: 10%; top: 10%; width: 80%; height: 80%; border-radius: 50%; object-fit: cover; }
.chapa-anillo { position: absolute; inset: 0; width: 100%; height: 100%; font-family: var(--f-titulo); letter-spacing: .02em; }
.chapa::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle at 30% 22%, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0) 36%), radial-gradient(circle at 72% 88%, rgba(31, 27, 46, .14), rgba(31, 27, 46, 0) 40%);
}
.chapa-sin-foto::before { content: ""; position: absolute; left: 10%; top: 10%; width: 80%; height: 80%; border-radius: 50%; background: var(--blanco); }
.chapa-centro { position: absolute; left: 10%; top: 10%; width: 80%; height: 80%; display: grid; place-items: center; z-index: 1; text-align: center; }
.chapa-letra { font: 800 3.5rem/1 var(--f-titulo); color: var(--tinta); }
.chapa-numero { font: 800 clamp(4rem, 3rem + 4vw, 6.5rem)/1 var(--f-titulo); letter-spacing: -.05em; color: var(--tinta); }
.chapa-peq .chapa-letra { font-size: 2.2rem; }

/* ------------------------------------------------------------ portada */
.portada {
  position: relative; overflow: hidden;
  padding-block: clamp(3rem, 2rem + 4vw, 6rem);
  background: var(--sol);
}
.portada::before, .portada::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.portada::before { width: 46rem; height: 46rem; right: -10rem; top: -12rem; background: rgba(255, 255, 255, .22); }
.portada::after { width: 18rem; height: 18rem; left: -6rem; bottom: -8rem; border: 2.5rem solid rgba(228, 87, 46, .16); }
.portada-rejilla { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.pastilla {
  display: inline-flex; align-items: center; gap: .5rem; margin: 0 0 var(--e-4); padding: .45rem 1rem .45rem .75rem;
  background: var(--tinta); color: #fff; border-radius: 999px;
  font: 700 var(--t-s)/1.2 var(--f-titulo); letter-spacing: .04em;
}
.pastilla .icono { color: var(--coral); fill: var(--coral); }
.portada-titular { font-size: var(--t-4xl); line-height: .96; letter-spacing: -.045em; color: var(--tinta); }
.resalte { background: linear-gradient(var(--coral), var(--coral)) 0 90% / 100% .16em no-repeat; padding-bottom: .04em; }
.portada-manifiesto { margin-top: var(--e-5); max-width: 33rem; padding-left: var(--e-4); border-left: 4px solid var(--tinta); }
.portada-manifiesto p { margin: 0; font: italic 500 var(--t-xl)/1.35 var(--f-texto); color: var(--tinta); }
.portada-manifiesto .portada-manifiesto-dato { margin-top: var(--e-2); font: 700 var(--t-xs)/1.4 var(--f-titulo); font-style: normal; letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-2); }
.portada .boton-claro { border-color: var(--tinta); }
.portada .boton:hover { background: #fff; border-color: #fff; color: var(--tinta); }
.portada .boton-claro:hover { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.portada-chapas { position: relative; height: 29rem; }
.portada-chapa { position: absolute; display: block; border-radius: 50%; color: inherit; transition: transform .35s cubic-bezier(.2, .7, .3, 1.3); }
.portada-chapa:hover, .portada-chapa:focus-visible { z-index: 5; }
.portada-chapa-1 { left: 24%; top: 17%; z-index: 3; transform: rotate(-7deg); }
.portada-chapa-2 { right: 1%; top: 1%; z-index: 2; transform: rotate(9deg); }
.portada-chapa-3 { right: 9%; bottom: 3%; z-index: 4; transform: rotate(-12deg); }
.portada-chapa-4 { left: 6%; bottom: 1%; z-index: 4; transform: rotate(10deg); }
.portada-chapa-5 { left: 2%; top: 4%; transform: rotate(-4deg); }
.portada-chapa-1:hover { transform: rotate(0) scale(1.03); }
.portada-chapa-2:hover, .portada-chapa-3:hover, .portada-chapa-4:hover, .portada-chapa-5:hover { transform: rotate(0) scale(1.06); }

/* colección */
.coleccion {
  padding-block: var(--bloque);
  background-color: var(--fondo-2);
  background-image: repeating-linear-gradient(45deg, rgba(31, 27, 46, .025) 0 2px, transparent 2px 7px), repeating-linear-gradient(-45deg, rgba(31, 27, 46, .025) 0 2px, transparent 2px 7px);
  border-bottom: 1px solid var(--borde);
}
.coleccion-rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr)); gap: var(--e-7) var(--e-5); }
.coleccion-tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.coleccion-cuatro { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ficha { display: flex; flex-direction: column; align-items: center; text-align: center; }
.ficha-enlace { display: flex; flex-direction: column; align-items: center; width: 100%; color: var(--tinta); text-decoration: none; }
.ficha-chapa { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 11.25rem; margin-bottom: var(--e-4); }
.ficha-chapa .chapa { transition: transform .35s cubic-bezier(.2, .7, .3, 1.3); }
.ficha:nth-child(4n+1) .ficha-chapa .chapa { transform: rotate(-5deg); }
.ficha:nth-child(4n+2) .ficha-chapa .chapa { transform: rotate(4deg); }
.ficha:nth-child(4n+3) .ficha-chapa .chapa { transform: rotate(-2deg); }
.ficha:nth-child(4n+4) .ficha-chapa .chapa { transform: rotate(7deg); }
.ficha-enlace:hover .ficha-chapa .chapa, .ficha-enlace:focus-visible .ficha-chapa .chapa { transform: rotate(-12deg) scale(1.06); }
.ficha-enlace:hover { color: var(--tinta); }
.ficha-num { font: 700 var(--t-xs)/1 var(--f-titulo); letter-spacing: .14em; color: var(--tinta-2); margin-bottom: var(--e-2); }
.ficha-titulo { font-size: 1.15rem; font-weight: 700; line-height: 1.2; letter-spacing: -.01em; max-width: 15rem; }
.ficha-titulo span { display: block; font-weight: 400; color: var(--tinta-2); }
.ficha-enlace:hover .ficha-titulo { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .2em; }
.ficha-fecha { margin: var(--e-2) 0 0; font: italic 400 var(--t-s)/1.3 var(--f-texto); color: var(--tinta-2); }

/* cita */
.banda-cita { background: var(--coral); color: var(--tinta); padding-block: var(--bloque); position: relative; overflow: hidden; }
.banda-cita::before, .banda-cita::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.banda-cita::before { width: 22rem; height: 22rem; left: -7rem; top: -9rem; border: 3rem solid rgba(255, 255, 255, .14); }
.banda-cita::after { width: 12rem; height: 12rem; right: 6%; bottom: -5rem; background: rgba(31, 27, 46, .1); }
.cita-grande { margin: 0 auto; max-width: 58rem; text-align: center; position: relative; z-index: 1; }
.cita-grande blockquote { margin: 0; padding: 0; border: 0; }
.cita-grande blockquote p { margin: 0; font: italic 500 var(--t-3xl)/1.12 var(--f-texto); letter-spacing: -.01em; text-wrap: balance; }
.cita-grande blockquote p::before { content: "«"; }
.cita-grande blockquote p::after { content: "»"; }
.cita-grande figcaption { margin-top: var(--e-5); display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--e-2) var(--e-4); font: 600 var(--t-s)/1.4 var(--f-titulo); }
.cita-firma { display: inline-flex; align-items: center; min-height: 2rem; padding: .2rem .9rem; border-radius: 999px; background: var(--tinta); color: #fff; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-size: var(--t-xs); }
.cita-grande figcaption a { color: var(--tinta); }

/* la donación paso a paso */
.pasos { padding-block: var(--bloque); }
.pasos-rejilla { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 5fr) minmax(0, 3.4fr); gap: clamp(2rem, 4vw, 4rem); align-items: start; }
.pasos-lista { list-style: none; margin: 0; padding: 0; position: relative; }
.pasos-lista::before { content: ""; position: absolute; left: 1.625rem; top: 2rem; bottom: 2rem; border-left: 3px dotted var(--borde); }
.pasos-lista li { position: relative; display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: var(--e-4); align-items: start; padding-block: var(--e-3); }
.pasos-num {
  display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 50%;
  background: var(--c); color: #fff; font: 800 1.35rem/1 var(--f-titulo); position: relative;
  box-shadow: 0 6px 12px -6px rgba(31, 27, 46, .5);
}
.pasos-lista li:nth-child(4) .pasos-num { color: var(--tinta); }
.pasos-lista p { margin: .6rem 0 0; font-size: var(--t-l); line-height: 1.45; }
.pasos-lado { display: flex; flex-direction: column; align-items: center; gap: var(--e-4); text-align: center; }
.pasos-chapa .chapa { transform: rotate(6deg); }
.pasos-cifra { display: flex; flex-direction: column; align-items: center; margin: 0; }
.pasos-cifra strong { font: 800 clamp(4rem, 3rem + 4vw, 6rem)/.9 var(--f-titulo); letter-spacing: -.05em; color: var(--tinta); }
.pasos-cifra span { margin-top: var(--e-2); font: italic 400 var(--t-m)/1.35 var(--f-texto); color: var(--tinta-2); max-width: 14rem; }

/* cifras */
.cifras { padding-block: var(--bloque); background: var(--blanco); border-block: 1px solid var(--borde); }
.cifras-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-5); }
.cifra-ficha { position: relative; padding: var(--e-5) var(--e-4) var(--e-4); border-radius: var(--radio); background: var(--fondo); display: flex; flex-direction: column; overflow: hidden; }
.cifra-ficha::before { content: ""; position: absolute; right: -2.5rem; top: -2.5rem; width: 6.5rem; height: 6.5rem; border-radius: 50%; background: var(--c); opacity: .9; }
.cifra-valor { position: relative; margin: 0; font: 800 clamp(2.5rem, 2rem + 2vw, 3.4rem)/1 var(--f-titulo); color: var(--tinta); letter-spacing: -.04em; }
.cifra-texto { margin: var(--e-3) 0 var(--e-4); font: 400 var(--t-m)/1.5 var(--f-texto); }
.cifra-fuente { margin: auto 0 0; padding-top: var(--e-3); border-top: 1px solid var(--borde); font: 600 var(--t-s)/1.4 var(--f-titulo); color: var(--tinta-2); }
.cifra-fuente a { color: var(--tinta); }
.cifra-fuente a:hover { color: var(--coral-osc); }

/* voces */
.voces { padding-block: var(--bloque); }
.voces-fila { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-5); align-items: start; }
.voz { margin: 0; display: flex; flex-direction: column; gap: var(--e-4); }
.voz-2 { margin-top: var(--e-6); }
.voz-globo {
  position: relative; padding: var(--e-5); min-height: 13rem; display: flex; flex-direction: column; justify-content: center;
  background: color-mix(in srgb, var(--c) 20%, #fff); border-radius: 28px;
}
.voz-globo::after { content: ""; position: absolute; left: 2.25rem; bottom: -.75rem; width: 1.5rem; height: 1.5rem; background: inherit; transform: rotate(45deg); border-radius: 0 0 4px 0; }
.voz blockquote { margin: 0; padding: 0; border: 0; }
.voz blockquote p { margin: 0; font: italic 500 var(--t-2xl)/1.15 var(--f-texto); color: var(--tinta); letter-spacing: -.01em; }
.voz-imagen .voz-globo { background: #fff; border: 1px solid var(--borde); align-items: center; }
.voz-imagen .voz-globo::after { background: #fff; border-right: 1px solid var(--borde); border-bottom: 1px solid var(--borde); }
.voz-imagen .voz-globo img { width: 100%; max-width: 13.75rem; height: auto; border-radius: 8px; }
.voz figcaption { display: flex; align-items: center; gap: var(--e-3); padding-left: var(--e-2); }
.voz-chapa .chapa { --d: 60px; }
.voz-datos { display: flex; flex-direction: column; font-size: var(--t-s); line-height: 1.35; }
.voz-firma { font-weight: 800; color: var(--tinta); }
.voz-detalle { color: var(--tinta-2); }
.voz-datos a { color: var(--coral-osc); font-weight: 600; }

/* temas */
.temas { padding-block: var(--bloque); background: var(--fondo-2); border-block: 1px solid var(--borde); }
.temas-fila { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-5); }
.tema-panel { position: relative; padding: var(--e-5); border-radius: 22px; background: #fff; box-shadow: var(--sombra); overflow: hidden; }
.tema-panel::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 8px; background: var(--c); }
.tema-panel h3 { font-size: var(--t-2xl); }
.tema-panel h3 a { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.75rem; color: var(--tinta); text-decoration: none; }
.tema-panel h3 a .icono { width: .8em; height: .8em; transition: transform .18s ease; }
.tema-panel h3 a:hover .icono { transform: translateX(4px); }
.tema-cuenta { margin: 0 0 var(--e-4); font: italic 400 var(--t-m)/1.3 var(--f-texto); color: var(--tinta-2); }
.tema-panel ul { list-style: none; margin: 0; padding: 0; }
.tema-panel li { border-top: 1px solid var(--borde); }
.tema-panel li a { display: flex; align-items: center; gap: .6rem; min-height: 2.75rem; padding: .55rem 0; color: var(--tinta); text-decoration: none; line-height: 1.35; font-weight: 500; }
.tema-panel li a::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: var(--c); flex: none; }
.tema-panel li a:hover { color: var(--coral-osc); }

/* registro */
.registro { padding-block: var(--bloque); }
.registro-rejilla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.3fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.registro .seccion-cabecera { position: sticky; top: 7rem; margin-bottom: 0; }
.registro-libro { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-6); }
.registro-anio h3 { font-size: var(--t-3xl); margin-bottom: var(--e-3); letter-spacing: -.05em; }
.registro-anio h3 a { color: var(--tinta); text-decoration: none; }
.registro-anio h3 a:hover { color: var(--coral-osc); }
.registro-anio ol { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--tinta); }
.registro-anio li { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) auto; gap: var(--e-3); align-items: baseline; padding: .6rem 0; border-bottom: 1px solid var(--borde); }
.registro-num { display: inline-grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--c); color: #fff; font: 800 .75rem/1 var(--f-titulo); align-self: center; }
.registro-anio li:nth-child(6n+4) .registro-num { color: var(--tinta); }
.registro-anio li a { color: var(--tinta); text-decoration: none; line-height: 1.35; font-weight: 500; }
.registro-anio li a:hover { color: var(--coral-osc); text-decoration: underline; }
.registro-anio time { font: italic 400 var(--t-s)/1 var(--f-texto); color: var(--tinta-2); white-space: nowrap; }

/* acerca y despedida */
.acerca { padding-block: 0 var(--bloque); }
.acerca-rejilla { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; padding-top: var(--bloque); border-top: 1px solid var(--borde); }
.acerca-parrafo { margin: var(--e-4) 0 var(--e-3); font: 400 var(--t-l)/1.6 var(--f-texto); }
.despedida { margin: 0; display: flex; flex-direction: column; align-items: center; gap: var(--e-4); }
.despedida-chapa { position: relative; width: min(100%, 24rem); aspect-ratio: 1; }
.despedida-chapa .chapa { position: absolute; inset: 0; width: 100%; transform: rotate(-6deg); }
.despedida blockquote { position: absolute; inset: 20%; margin: 0; padding: 0; border: 0; display: grid; place-items: center; text-align: center; z-index: 1; }
.despedida blockquote p { margin: 0; font: 800 clamp(1.4rem, 1rem + 1.6vw, 2.1rem)/1.08 var(--f-titulo); letter-spacing: -.03em; color: var(--tinta); text-wrap: balance; }
.despedida figcaption { font: italic 400 var(--t-m)/1.4 var(--f-texto); }
.despedida figcaption a { color: var(--tinta-2); }

/* ------------------------------------------------------------ artículo */
.articulo-cabecera { background: color-mix(in srgb, var(--c) 17%, var(--fondo)); padding-block: var(--e-5) var(--e-6); border-bottom: 1px solid var(--borde); }
.articulo-cabecera-rejilla { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.articulo-cabecera-rejilla.sin-foto { grid-template-columns: minmax(0, 1fr); }
.migas { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2); margin-bottom: var(--e-5); font: 600 var(--t-s)/1.4 var(--f-titulo); color: var(--tinta-2); }
.migas a { color: var(--tinta-2); display: inline-flex; align-items: center; min-height: 2.75rem; }
.migas a:hover { color: var(--tinta); }
.articulo-num { display: inline-flex; align-items: center; gap: .55rem; margin: 0 0 var(--e-3); font: 700 var(--t-xs)/1.2 var(--f-titulo); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-2); }
.articulo-num::before { content: ""; width: .8rem; height: .8rem; border-radius: 50%; background: var(--c); }
.articulo-titulo { font-size: var(--t-3xl); line-height: 1.02; letter-spacing: -.035em; max-width: 46rem; }
.articulo-chapa { margin: 0; display: flex; flex-direction: column; align-items: center; gap: var(--e-3); max-width: 17rem; }
.articulo-chapa .chapa { transform: rotate(-6deg); }
.articulo-chapa figcaption { text-align: center; font: italic 400 var(--t-s)/1.4 var(--f-texto); color: var(--tinta-2); }
.articulo-cuerpo { display: grid; grid-template-columns: 12.5rem minmax(0, var(--ancho-texto)); gap: clamp(2rem, 5vw, 5rem); padding-block: var(--e-7) var(--e-6); }
.ficha-lateral dl { margin: 0; position: sticky; top: 7rem; }
.ficha-lateral div { padding: var(--e-3) 0; border-bottom: 1px solid var(--borde); }
.ficha-lateral div:first-child { padding-top: 0; }
.ficha-lateral dt { font: 700 .75rem/1.2 var(--f-titulo); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-2); }
.ficha-lateral dd { margin: .35rem 0 0; font: 600 var(--t-s)/1.45 var(--f-titulo); color: var(--tinta); }
.ficha-temas { display: flex; flex-wrap: wrap; gap: var(--e-2); }
.texto-largo { font: 400 clamp(1.125rem, 1.05rem + .3vw, 1.25rem)/1.7 var(--f-texto); }
.texto-largo > * { margin-left: 0; margin-right: 0; }
.texto-largo > p:first-child { font-size: 1.12em; line-height: 1.6; }
.articulo .texto-largo > p:first-child::first-letter {
  float: left; margin: .06em .14em 0 0; padding: .14em .2em .1em; border-radius: 50%;
  font: 800 2.4em/.9 var(--f-titulo); color: var(--tinta); background: color-mix(in srgb, var(--c) 35%, #fff);
}
.texto-largo ul, .texto-largo ol { padding-left: 1.25em; }
.texto-largo li { margin-bottom: .4em; }
.texto-largo li::marker { color: var(--c, var(--coral)); }
.texto-largo .derecha { text-align: left; margin-top: var(--e-5); padding-left: var(--e-4); border-left: 5px solid var(--c, var(--coral)); }
.texto-largo .derecha strong { display: block; font: 800 var(--t-xl)/1.2 var(--f-titulo); letter-spacing: -.02em; color: var(--tinta); }
.texto-largo figure.imagen { margin-block: var(--e-5); }
.texto-largo figure.imagen img { border-radius: 12px; box-shadow: var(--sombra); }
.texto-largo figcaption { font: italic 400 var(--t-s)/1.4 var(--f-texto); color: var(--tinta-2); }
.texto-largo h2 { font-size: var(--t-xl); }
.articulo-firma { display: inline-flex; align-items: center; gap: .5rem; margin: var(--e-5) 0 0; font: 800 var(--t-l)/1 var(--f-titulo); }
.articulo-firma .icono { color: var(--coral); fill: var(--coral); }

/* comentarios */
.comentarios { margin-top: var(--e-7); padding-top: var(--e-6); border-top: 2px solid var(--tinta); }
.comentarios-titulo { font-size: var(--t-2xl); display: flex; align-items: center; gap: var(--e-3); }
.comentarios-titulo span { display: inline-grid; place-items: center; min-width: 2.4rem; height: 2.4rem; padding: 0 .5rem; border-radius: 999px; background: var(--c, var(--coral)); color: var(--tinta); font-size: var(--t-m); }
.comentarios-nota { margin: var(--e-2) 0 var(--e-5); color: var(--tinta-2); font: italic 400 var(--t-m)/1.5 var(--f-texto); }
.comentarios-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-5); }
.comentarios-hijos { margin-top: var(--e-4); padding-left: var(--e-6); }
.comentario-globo {
  position: relative; padding: var(--e-4) var(--e-5); border-radius: 22px; background: #fff; border: 1px solid var(--borde);
  font: 400 var(--t-m)/1.65 var(--f-texto); overflow-wrap: anywhere;
}
.comentario-globo::after { content: ""; position: absolute; left: 1.75rem; bottom: -.7rem; width: 1.3rem; height: 1.3rem; background: #fff; border-left: 1px solid var(--borde); border-bottom: 1px solid var(--borde); transform: skewY(-35deg); }
.comentario-globo p { margin: 0 0 .8em; }
.comentario-globo p:last-child { margin-bottom: 0; }
.comentario-pie { display: flex; align-items: center; gap: var(--e-3); margin-top: var(--e-4); padding-left: var(--e-3); font-size: var(--t-s); color: var(--tinta-2); }
.comentario-inicial { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--tinta); color: #fff; font-weight: 800; flex: none; }
.comentario-autor { font-weight: 800; color: var(--tinta); }

/* vecinas */
.vecinas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-4); padding-bottom: var(--e-6); }
.vecina {
  display: flex; flex-direction: column; gap: var(--e-2); padding: var(--e-4) var(--e-5);
  border-radius: 18px; background: #fff; border: 1px solid var(--borde); border-left: 8px solid var(--c); color: var(--tinta); text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease;
}
.vecina:hover { color: var(--tinta); transform: translateY(-2px); box-shadow: var(--sombra); }
.vecina-siguiente { text-align: right; align-items: flex-end; grid-column: 2; border-left-width: 1px; border-right: 8px solid var(--c); }
.vecina-rotulo { display: inline-flex; align-items: center; gap: var(--e-2); font: 700 var(--t-xs)/1.2 var(--f-titulo); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-2); }
.vecina-titulo { font: 700 var(--t-l)/1.25 var(--f-titulo); letter-spacing: -.01em; }

.relacionadas { padding-block: var(--e-7) var(--bloque); background: var(--fondo-2); border-top: 1px solid var(--borde); }
.relacionadas .seccion-titulo { text-align: center; margin-bottom: var(--e-6); }
.relacionadas-error { background: none; border: 0; padding-block: var(--e-6) 0; }

/* ------------------------------------------------------------ páginas */
.pagina-cabecera { background: var(--fondo-2); padding-block: var(--e-7) var(--e-6); border-bottom: 1px solid var(--borde); }
.pagina-titulo { font-size: var(--t-3xl); line-height: 1.02; letter-spacing: -.035em; max-width: 48rem; }
.pagina-entradilla { margin: var(--e-4) 0 0; font: 400 var(--t-l)/1.55 var(--f-texto); color: var(--tinta-2); max-width: 38rem; }
.pagina-cuerpo { display: grid; grid-template-columns: minmax(0, var(--ancho-texto)) minmax(0, 17rem); justify-content: space-between; gap: var(--e-6); padding-block: var(--e-7) var(--bloque); }
.pagina-hoja { max-width: var(--ancho-texto); }
.pagina-hoja .texto-largo > p:first-child { font-size: 1em; }
.pagina-hoja .texto-destacado > p:first-child { font-size: var(--t-xl); line-height: 1.45; }
.lateral-titulo { margin-bottom: var(--e-3); font: 700 .8125rem/1.2 var(--f-titulo); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-2); }
.pagina-lateral, .acerca-datos { align-self: start; position: sticky; top: 7rem; }
.lateral-lista { list-style: none; margin: 0 0 var(--e-5); padding: 0; border-top: 2px solid var(--tinta); }
.lateral-lista li { border-bottom: 1px solid var(--borde); }
.lateral-lista a { display: flex; align-items: center; min-height: 2.75rem; padding: .4rem 0; color: var(--tinta); font-weight: 600; text-decoration: none; }
.lateral-lista a:hover { color: var(--coral-osc); }
.lateral-lista a[aria-current="page"] { color: var(--coral-osc); }
.lateral-lista a[aria-current="page"]::before { content: ""; width: .55rem; height: .55rem; margin-right: .6rem; border-radius: 50%; background: var(--coral); }
.lateral-tarjeta { display: flex; flex-direction: column; gap: var(--e-3); padding: var(--e-4); border-radius: 22px; background: var(--sol); color: var(--tinta); text-decoration: none; transition: transform .2s ease; }
.lateral-tarjeta:hover { color: var(--tinta); transform: translateY(-3px); }
.lateral-pila { display: flex; padding-left: 1rem; }
.lateral-pila .chapa { margin-left: -1rem; }
.lateral-pila .chapa:nth-child(2) { transform: rotate(8deg) translateY(4px); }
.lateral-pila .chapa-anillo text { display: none; }
.lateral-tarjeta-texto { display: inline-flex; align-items: center; gap: .5rem; font-weight: 800; font-size: var(--t-l); letter-spacing: -.01em; }

/* acerca de */
.acerca-cabecera { background: var(--sol); padding-block: var(--e-6); overflow: hidden; }
.acerca-cabecera-rejilla { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--e-5); align-items: center; }
.acerca-lema { margin: var(--e-3) 0 0; font: italic 500 var(--t-xl)/1.3 var(--f-texto); }
.acerca-cabecera-chapa .chapa { transform: rotate(-8deg); }
.acerca-cifras { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-3); }
.acerca-cifras div { display: flex; flex-direction: column-reverse; padding: var(--e-3); border-radius: 16px; background: #fff; border: 1px solid var(--borde); border-top: 6px solid var(--c); }
.acerca-cifras dt { font-size: var(--t-s); line-height: 1.3; color: var(--tinta-2); }
.acerca-cifras dd { margin: 0; font: 800 var(--t-2xl)/1 var(--f-titulo); letter-spacing: -.04em; white-space: nowrap; }
.acerca-cifras div:nth-child(4) { grid-column: 1 / -1; }
.acerca-cabecera .antetitulo::before { box-shadow: 1rem 0 0 var(--tinta), 2rem 0 0 var(--azul); }
.acerca-firmas { margin: var(--e-4) 0 0; font: italic 400 var(--t-m)/1.5 var(--f-texto); color: var(--tinta-2); }
.acerca-firmas strong { font-style: normal; font-family: var(--f-titulo); color: var(--tinta); }
.acerca-coleccion { padding-block: var(--e-7) var(--bloque); background: var(--fondo-2); border-top: 1px solid var(--borde); }
.acerca-coleccion .seccion-titulo { text-align: center; }
.mosaico-chapas { list-style: none; margin: 0 auto; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--e-4); max-width: 60rem; }
.mosaico-chapas a { display: block; border-radius: 50%; transition: transform .3s cubic-bezier(.2, .7, .3, 1.3); }
.mosaico-chapas li:nth-child(odd) a { transform: rotate(-6deg); }
.mosaico-chapas li:nth-child(even) a { transform: rotate(5deg); }
.mosaico-chapas a:hover, .mosaico-chapas a:focus-visible { transform: rotate(0) scale(1.08); }
.centrado-bloque { margin: var(--e-6) 0 0; text-align: center; }

/* 404 */
.pagina-404 { padding-block: var(--e-7) var(--bloque); }
.error-rejilla { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: var(--e-6); align-items: center; }
.error-texto .x-buscador { margin-top: var(--e-5); }
.error-chapa { display: grid; place-items: center; }
.error-chapa .chapa { transform: rotate(-10deg); }

/* ------------------------------------------------------------ listados */
.listado-cabecera { background: color-mix(in srgb, var(--c) 17%, var(--fondo)); padding-block: var(--e-6); border-bottom: 1px solid var(--borde); overflow: hidden; }
.listado-cabecera-rejilla { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--e-5); align-items: center; min-height: 12rem; }
.listado-cabecera .antetitulo::before { background: var(--c); }
.listado-cuenta { margin: var(--e-3) 0 0; font: italic 400 var(--t-l)/1.4 var(--f-texto); color: var(--tinta-2); }
.listado-buscar .x-buscador { margin-top: var(--e-5); }
.listado-pila { display: flex; align-items: center; padding-right: var(--e-3); }
.listado-pila .chapa { margin-left: -1.75rem; }
.listado-pila .chapa:nth-child(odd) { transform: rotate(-8deg) translateY(-.6rem); }
.listado-pila .chapa:nth-child(even) { transform: rotate(7deg) translateY(.6rem); }
.listado-cuerpo { padding-block: var(--e-6) var(--bloque); }
.filas { display: grid; gap: var(--e-4); max-width: 60rem; }
.fila {
  position: relative; display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: var(--e-5); align-items: center;
  padding: var(--e-4) var(--e-5); border-radius: 22px; background: #fff; border: 1px solid var(--borde);
  transition: transform .2s ease, box-shadow .2s ease;
}
.fila:hover { transform: translateY(-2px); box-shadow: var(--sombra); }
.fila-chapa { display: grid; place-items: center; }
.fila-chapa .chapa { transition: transform .35s cubic-bezier(.2, .7, .3, 1.3); }
.fila:hover .fila-chapa .chapa { transform: rotate(-10deg); }
.fila-temas { margin: 0 0 var(--e-1); font: 700 var(--t-s)/1.3 var(--f-titulo); letter-spacing: .02em; color: var(--tinta-2); }
.fila-titulo { font-size: var(--t-xl); line-height: 1.15; letter-spacing: -.02em; }
.fila-titulo a { color: var(--tinta); text-decoration: none; }
.fila-titulo a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.fila-titulo a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.fila-extracto { margin: var(--e-2) 0 0; font: 400 var(--t-m)/1.55 var(--f-texto); color: var(--tinta-2); }
.fila-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-1) var(--e-4); margin: var(--e-3) 0 0; font: 600 var(--t-s)/1.4 var(--f-titulo); color: var(--tinta-2); }
.fila-meta span { display: inline-flex; align-items: center; gap: .35rem; }
.vacio { padding: var(--e-5) 0; font: italic 400 var(--t-l)/1.5 var(--f-texto); color: var(--tinta-2); }
.buscar-temas { margin-top: var(--e-5); }
.etiquetas-fila { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--e-3); }

/* buscador y paginación del motor */
.x-buscador { display: flex; gap: var(--e-2); max-width: 34rem; }
.x-buscador label { flex: 1; }
.x-buscador input {
  width: 100%; min-height: 3rem; padding: .7rem 1.1rem; font: 400 1rem/1.3 var(--f-titulo); color: var(--tinta);
  background: #fff; border: 2px solid var(--tinta); border-radius: 999px;
}
.x-buscador input:focus { outline: 3px solid var(--azul); outline-offset: 2px; }
.x-buscador button {
  min-height: 3rem; padding: .7rem 1.5rem; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--tinta); color: #fff; font: 700 1rem/1 var(--f-titulo); transition: background-color .18s ease, color .18s ease;
}
.x-buscador button:hover { background: var(--coral); color: var(--tinta); transform: none; box-shadow: none; }
.paginacion { margin-block: var(--e-6) 0; }
.paginacion a, .paginacion span[aria-current] { min-width: 2.75rem; min-height: 2.75rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; border-color: var(--borde); background: #fff; font-weight: 700; }
.paginacion a { color: var(--tinta); }
.paginacion a:hover { border-color: var(--tinta); }
.paginacion span[aria-current] { background: var(--tinta); border-color: var(--tinta); color: #fff; }

/* contenido común afinado */
.contenido a { color: var(--coral-osc); }
.contenido .boton { background: var(--tinta); border-color: var(--tinta); color: #fff; border-radius: 999px; font-family: var(--f-titulo); }
.contenido blockquote { border-left-color: var(--coral); }

/* ------------------------------------------------------------ pie */
.pie { background: var(--tinta); color: #e8e4ef; }
.pie-confeti { display: flex; height: 10px; }
.pie-confeti span { flex: 1; }
.pie-confeti span:nth-child(1) { background: var(--coral); }
.pie-confeti span:nth-child(2) { background: var(--sol); }
.pie-confeti span:nth-child(3) { background: var(--verde); }
.pie-confeti span:nth-child(4) { background: var(--azul); }
.pie-confeti span:nth-child(5) { background: var(--rosa); }
.pie-confeti span:nth-child(6) { background: var(--lila); }
.pie-rejilla { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: var(--e-6) var(--e-5); padding-block: var(--e-7) var(--e-6); }
.pie-nombre { margin: 0; font: 800 2.5rem/1 var(--f-titulo); letter-spacing: -.04em; color: #fff; }
.pie-lema { margin: var(--e-2) 0 0; font: italic 500 var(--t-l)/1.35 var(--f-texto); color: var(--sol); }
.pie-texto { margin: var(--e-4) 0 0; max-width: 24rem; color: #cfcadb; font: 400 var(--t-m)/1.55 var(--f-texto); }
.pie-grupo h2 { margin-bottom: var(--e-3); font: 700 .8125rem/1.2 var(--f-titulo); letter-spacing: .14em; text-transform: uppercase; color: var(--sol); }
.pie-grupo ul { list-style: none; margin: 0; padding: 0; }
.pie-grupo a { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.75rem; color: #fff; text-decoration: none; }
.pie-grupo a:hover { color: var(--sol); text-decoration: underline; }
.pie-grupo a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; }
.pie-cuenta { display: inline-grid; place-items: center; min-width: 1.6rem; height: 1.6rem; padding: 0 .35rem; border-radius: 999px; background: rgba(255, 255, 255, .12); font-size: .8125rem; color: #e8e4ef; }
.pie-final { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--e-3); padding-block: var(--e-4); border-top: 1px solid rgba(255, 255, 255, .14); font-size: .875rem; color: #cfcadb; }
.pie-final p { margin: 0; }
.pie-arriba { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.75rem; color: #fff; text-decoration: none; }
.pie-arriba:hover { color: var(--sol); }

/* ------------------------------------------------------------ adaptación */
@media (max-width: 75rem) {
  .navegacion .menu a { padding: 0 .6rem; }
  .cabecera-fila { gap: var(--e-3); }
}

@media (max-width: 64rem) {
  .portada-rejilla { grid-template-columns: 1fr; }
  .portada-chapas { max-width: 34rem; width: 100%; margin-inline: auto; height: 28rem; }
  .pasos-rejilla { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .pasos-cabecera { grid-column: 1 / -1; }
  .cifras-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .voces-fila { grid-template-columns: minmax(0, 1fr); max-width: 36rem; gap: var(--e-6); }
  .voz-2 { margin-top: 0; }
  .temas-fila { grid-template-columns: minmax(0, 1fr); max-width: 36rem; }
  .registro-rejilla { grid-template-columns: 1fr; }
  .registro .seccion-cabecera { position: static; }
  .acerca-rejilla { grid-template-columns: 1fr; }
  .pie-rejilla { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pie-marca { grid-column: 1 / -1; }
  .articulo-cuerpo { grid-template-columns: minmax(0, 1fr); gap: var(--e-5); }
  .ficha-lateral dl { position: static; display: flex; flex-wrap: wrap; gap: var(--e-3) var(--e-5); }
  .ficha-lateral div, .ficha-lateral div:first-child { padding: 0; border: 0; }
  .coleccion-cuatro { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .error-rejilla { grid-template-columns: minmax(0, 1fr); }
  .error-chapa { order: -1; justify-items: start; }
  .error-chapa .chapa { --d: 220px !important; }
  .pagina-cuerpo { grid-template-columns: minmax(0, 1fr); }
  .pagina-lateral, .acerca-datos { position: static; max-width: 30rem; }
}

/* menú móvil */
@media (max-width: 56rem) {
  .cabecera-fila { min-height: 4rem; gap: var(--e-2); }
  .marca-chapa { width: 2.25rem; height: 2.25rem; }
  .marca-nombre { font-size: 1.4rem; }
  .cabecera-buscar { display: none; }
  .menu-boton {
    display: inline-flex; align-items: center; gap: .6rem; min-height: 2.75rem; min-width: 2.75rem; padding: 0 1rem;
    background: var(--tinta); color: #fff; border: 0; border-radius: 999px; font: 700 1rem/1 var(--f-titulo); cursor: pointer;
  }
  .menu-boton-rayas, .menu-boton-rayas::before, .menu-boton-rayas::after { display: block; width: 1.1rem; height: 2px; background: currentColor; border-radius: 2px; transition: transform .2s ease, background-color .2s ease; }
  .menu-boton-rayas { position: relative; }
  .menu-boton-rayas::before, .menu-boton-rayas::after { content: ""; position: absolute; left: 0; }
  .menu-boton-rayas::before { top: -6px; }
  .menu-boton-rayas::after { top: 6px; }
  .menu-boton[aria-expanded="true"] .menu-boton-rayas { background: transparent; }
  .menu-boton[aria-expanded="true"] .menu-boton-rayas::before { transform: translateY(6px) rotate(45deg); }
  .menu-boton[aria-expanded="true"] .menu-boton-rayas::after { transform: translateY(-6px) rotate(-45deg); }
  .navegacion {
    position: fixed; left: 0; right: 0; top: 4rem; bottom: 0; z-index: 25;
    padding: var(--e-5) var(--lateral) calc(var(--e-6) + env(safe-area-inset-bottom));
    background: var(--fondo); overflow-y: auto; overscroll-behavior: contain;
    opacity: 0; visibility: hidden; transform: translateY(-.5rem);
    transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
  }
  .navegacion.abierto { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease, transform .2s ease; }
  .navegacion .menu { flex-direction: column; gap: 0; }
  .navegacion .menu li { border-bottom: 1px solid var(--borde); }
  .navegacion .menu a { min-height: 3.75rem; padding: 0; border-radius: 0; font: 800 1.75rem/1.1 var(--f-titulo); letter-spacing: -.03em; }
  .navegacion .menu a:hover, .navegacion .menu a[aria-current="page"] { background: none; color: var(--coral-osc); }
  .navegacion-buscar { display: block; margin-top: var(--e-5); }
  html.menu-abierto { overflow: hidden; }
}

@media (max-width: 40rem) {
  :root { --lateral: 1.25rem; }
  .marca-lema { display: none; }
  .portada { padding-block: var(--e-5) var(--e-6); }
  .portada::before { width: 26rem; height: 26rem; right: -12rem; top: auto; bottom: -6rem; }
  .portada-manifiesto { padding-left: var(--e-3); }
  .portada-chapas { height: 20rem; }
  .portada-chapa-1 .chapa { --d: 172px !important; }
  .portada-chapa-1 { left: 22%; top: 18%; }
  .portada-chapa-2 .chapa { --d: 112px !important; }
  .portada-chapa-3 .chapa, .portada-chapa-4 .chapa, .portada-chapa-5 .chapa { --d: 96px !important; }
  .portada-chapa-3 { right: 0; bottom: 0; }
  .portada-chapa-5 { left: 0; top: 2%; }
  .botones-fila .boton { flex: 1 1 100%; }
  .coleccion-rejilla, .coleccion-tres { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-6) var(--e-3); }
  .ficha-chapa { min-height: 8.5rem; margin-bottom: var(--e-3); }
  .ficha-chapa .chapa { --d: 130px !important; }
  .ficha-titulo { font-size: 1.0625rem; }
  .pasos-rejilla { grid-template-columns: minmax(0, 1fr); }
  .pasos-lado { flex-direction: row; justify-content: center; text-align: left; }
  .pasos-chapa .chapa { --d: 150px !important; }
  .pasos-cifra { align-items: flex-start; }
  .cifras-lista { grid-template-columns: minmax(0, 1fr); }
  .voz blockquote p { font-size: var(--t-xl); }
  .voz-globo { min-height: 0; padding: var(--e-4); }
  .registro-libro { grid-template-columns: minmax(0, 1fr); }
  .registro-anio li { grid-template-columns: 2.25rem minmax(0, 1fr); }
  .registro-anio li time { grid-column: 2; }
  .articulo-cabecera { padding-bottom: var(--e-5); }
  .articulo-cabecera-rejilla { grid-template-columns: minmax(0, 1fr); gap: var(--e-4); }
  .articulo-chapa { flex-direction: row; max-width: none; gap: var(--e-4); }
  .articulo-chapa .chapa { --d: 140px !important; }
  .articulo-chapa figcaption { text-align: left; }
  .articulo-cuerpo { padding-top: var(--e-5); }
  .comentarios-hijos { padding-left: var(--e-4); }
  .comentario-globo { padding: var(--e-3) var(--e-4); }
  .vecinas { grid-template-columns: minmax(0, 1fr); }
  .vecina-siguiente { grid-column: auto; }
  .acerca-cabecera-rejilla { grid-template-columns: minmax(0, 1fr); }
  .acerca-cabecera-chapa .chapa { --d: 140px !important; }
  .mosaico-chapas { gap: var(--e-3); }
  .mosaico-chapas .chapa { --d: 92px !important; }
  .listado-cabecera-rejilla { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: var(--e-4); }
  .listado-pila { padding-left: 1rem; }
  .listado-pila .chapa { --d: 68px !important; margin-left: -1rem; }
  .listado-pila .chapa-anillo text { display: none; }
  .fila { grid-template-columns: 4.75rem minmax(0, 1fr); gap: var(--e-3); padding: var(--e-3) var(--e-4); align-items: start; }
  .fila-chapa .chapa { --d: 72px !important; }
  .fila-chapa .chapa-anillo text { display: none; }
  .error-rejilla { grid-template-columns: minmax(0, 1fr); }
  .error-chapa { order: -1; justify-items: start; }
  .error-chapa .chapa { --d: 200px !important; }
  .x-buscador { flex-direction: column; }
  .x-buscador button { width: 100%; }
  .pie-rejilla { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .pie-grupo:last-child { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

@media print {
  .cabecera, .pie, .vecinas, .relacionadas, .migas, .saltar, .x-buscador, .botones-fila, .portada-chapas { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  .articulo-cabecera, .listado-cabecera, .pagina-cabecera, .portada, .banda-cita { background: none; }
  .articulo-cuerpo { display: block; }
  .ficha-lateral { margin-bottom: 1rem; }
  a { color: #000; }
}