/* ==================================================================
   ZX Abogados · web pública · "tinta y sello"
   Parte de assets/css/tokens.css (se enlaza antes en el <head>).
   Portada a pantalla completa en tinta con luces en movimiento, rejilla
   y luz que sigue al cursor; titulares en ZX Cn; tarjetas con luz e
   inclinación; rejillas asimétricas; rojo sello solo para la acción
   principal y los estados activos. Sin estilos en línea (CSP estricta).
   El contenido se ve completo sin JavaScript: lo que entra con
   animación solo se oculta si hay scripts y no se pide movimiento
   reducido, y aparece solo a los 3 s si web.js no llega a ejecutarse.
   ================================================================== */

:root {
  --cab: 4rem;                       /* alto de la cabecera */
  --lateral: 1rem;                   /* margen lateral (16 px en el móvil) */
  --max: 80rem;
  --lectura: 44rem;
  --ease: var(--zx-ease);
  --ease-salida: cubic-bezier(0.16, 1, 0.3, 1);
  --sombra-tarjeta: 0 1px 2px rgba(27, 32, 39, 0.05), 0 22px 48px -28px rgba(27, 32, 39, 0.35);
}

/* ------------------------------------------------------------- base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--cab) + 1rem); }
body {
  margin: 0;
  background: var(--zx-papel);
  color: var(--zx-texto);
  font-family: var(--zx-ui);
  font-size: 1.0625rem;
  line-height: 1.6;
  font-feature-settings: "kern";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img, svg, video { max-width: 100%; height: auto; }
img { display: block; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
a:hover { color: var(--zx-sello); }
h1, h2, h3, h4 { margin: 0; font-family: var(--zx-display); font-weight: 700; line-height: 1.04; letter-spacing: -0.012em; text-wrap: balance; }
p { margin: 0 0 1rem; text-wrap: pretty; }
ul, ol { margin: 0 0 1rem; padding-left: 1.25rem; }
[role="list"] { list-style: none; padding-left: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
table { border-collapse: collapse; width: 100%; }
::selection { background: var(--zx-sello); color: #fff; }
[hidden] { display: none !important; }
.icono { display: inline-block; flex: none; width: 1.25em; height: 1.25em; vertical-align: middle; }

/* Chino: sans del sistema y sin espaciado negativo. */
[lang="zh-Hans"], [lang="zh-CN"] { font-family: var(--zx-cjk); letter-spacing: 0; }
html[lang^="zh"] body { font-family: var(--zx-cjk); }
html[lang^="zh"] h1, html[lang^="zh"] h2, html[lang^="zh"] h3, html[lang^="zh"] h4 { font-family: var(--zx-cjk); letter-spacing: 0; line-height: 1.22; font-weight: 700; }
html[lang^="zh"] [lang="es"] { font-family: var(--zx-ui); }
html[lang^="zh"] h1[lang="es"], html[lang^="zh"] h2[lang="es"], html[lang^="zh"] h3[lang="es"] { font-family: var(--zx-display); }

/* ---------------------------------------------------- accesibilidad */
.saltar { position: fixed; left: 1rem; top: -6rem; z-index: 1000; padding: 0.75rem 1rem; border-radius: var(--zx-radio-s); background: var(--zx-sello); color: #fff; text-decoration: none; font-weight: 700; transition: top 0.2s; }
.saltar:focus { top: 1rem; color: #fff; }
.oculto-visualmente { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
:focus-visible { outline: 3px solid var(--zx-sello); outline-offset: 3px; border-radius: 2px; }
.cabecera :focus-visible, .hero :focus-visible, .cabeza :focus-visible, .seccion--tinta :focus-visible, .pie :focus-visible,
.banda-cta :focus-visible, .menu :focus-visible, .area--tinta :focus-visible, .tarjeta-lateral--cta :focus-visible { outline-color: #fff; }
main:focus { outline: none; }

/* ---------------------------------------------------------- utilidades */
.contenedor { width: min(var(--max), 100% - var(--lateral) * 2); margin-inline: auto; }
.contenido { display: block; }
.seccion { position: relative; padding: 4rem 0; }
.seccion--marfil { background: var(--zx-marfil); }
.seccion--pegada { padding-top: 2.5rem; }
.seccion--tinta { background: var(--zx-fondo-tinta); background-color: var(--zx-tinta); color: var(--zx-sobre-tinta); overflow: hidden; isolation: isolate; }
.seccion__rejilla { position: absolute; inset: 0; z-index: -1; background-image: var(--zx-rejilla); background-size: 64px 64px; -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent); mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent); pointer-events: none; }
.seccion__cabecera { max-width: 50rem; margin-bottom: 2.25rem; }
.antetitulo { display: inline-flex; align-items: center; gap: 0.65rem; margin: 0 0 0.9rem; font-family: var(--zx-display); font-weight: 700; font-size: 0.9375rem; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.2; color: var(--zx-sello); }
.antetitulo::before { content: ""; width: 1.75rem; height: 3px; border-radius: 2px; background: currentColor; transform-origin: 0 50%; transition: transform 0.9s var(--ease-salida) 0.15s; }
html[lang^="zh"] .antetitulo { letter-spacing: 0.12em; font-family: var(--zx-cjk); }
.antetitulo--claro { color: var(--zx-sobre-tinta-gris); }
.antetitulo--claro::before { background: var(--zx-sello-brillo); }
.seccion__titulo { font-size: clamp(2.375rem, 1.4rem + 3.6vw, 4.5rem); line-height: 0.96; letter-spacing: -0.02em; margin-bottom: 1rem; }
html[lang^="zh"] .seccion__titulo { font-size: clamp(1.875rem, 1.2rem + 2.6vw, 3.25rem); line-height: 1.2; }
.seccion__entrada { font-size: 1.125rem; line-height: 1.6; color: var(--zx-gris); max-width: 42rem; margin: 0; }
.seccion--tinta .seccion__entrada { color: var(--zx-sobre-tinta-gris); }
.seccion__mas { margin: 2rem 0 0; }
.subtitulo { font-size: 1.625rem; margin: 3rem 0 1.25rem; }
.nota { font-size: 0.9375rem; color: var(--zx-gris); margin: 1.5rem 0 0; }
.chip { display: inline-flex; align-items: center; min-height: 1.6rem; padding: 0 0.6rem; border-radius: 999px; background: var(--zx-marfil); color: var(--zx-tinta-3); font-size: 0.8125rem; font-weight: 700; line-height: 1; }
.chip--idioma { background: var(--zx-tinta); color: #fff; }
.chip--claro { background: rgba(255, 255, 255, 0.1); color: var(--zx-sobre-tinta); border: 1px solid var(--zx-sobre-tinta-filete); }
.sello { display: inline-grid; place-items: center; flex: none; width: 2.75rem; height: 2.75rem; border-radius: 8px; background: var(--zx-sello); color: #fff; font-family: var(--zx-cjk); font-weight: 700; font-size: 0.9375rem; line-height: 1; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.28), 0 8px 22px -8px rgba(192, 12, 12, 0.6); transform: rotate(-4deg); }
.sello--mini { width: 2.25rem; height: 2.25rem; font-family: var(--zx-display); font-size: 0.9375rem; }
.aviso { padding: 0.9rem 1rem; border-radius: var(--zx-radio); border: 1px solid var(--zx-filete); background: var(--zx-papel); font-size: 0.9375rem; line-height: 1.5; }
.aviso--info { background: var(--zx-azul-claro); border-color: rgba(47, 93, 138, 0.3); color: var(--zx-azul); }
.aviso--error { border-color: rgba(192, 12, 12, 0.45); background: var(--zx-sello-claro); color: var(--zx-burdeos); }
.aviso--ok { border-color: rgba(30, 122, 87, 0.45); background: var(--zx-jade-claro); color: var(--zx-jade); }
.vacio { padding: 2rem 0; color: var(--zx-gris); }

/* ------------------------------------------------------------ botones */
.boton {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0.55rem;
  min-height: 2.875rem; padding: 0 1.3rem; border-radius: var(--zx-radio); border: 1px solid transparent;
  background: var(--zx-tinta); color: #fff; font-family: var(--zx-display); font-weight: 700; font-size: 1.0625rem; line-height: 1;
  letter-spacing: 0.01em; text-decoration: none; white-space: nowrap; cursor: pointer; isolation: isolate; overflow: hidden;
  transition: background-color var(--zx-transicion), border-color var(--zx-transicion), color var(--zx-transicion), box-shadow 0.25s, transform 0.2s var(--ease);
}
html[lang^="zh"] .boton { font-family: var(--zx-cjk); letter-spacing: 0.04em; }
.boton:hover { background: var(--zx-tinta-3); color: #fff; }
.boton:active { transform: translateY(1px) scale(0.99); }
.boton--p { background: var(--zx-sello); box-shadow: var(--zx-sombra-sello); }
.boton--p::after { content: ""; position: absolute; inset: 0 auto 0 -60%; z-index: -1; width: 45%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.3), transparent); transform: skewX(-20deg); transition: left 0.7s var(--ease); }
.boton--p:hover { background: var(--zx-sello-hover); transform: translateY(-1px); box-shadow: 0 16px 36px -10px rgba(192, 12, 12, 0.55); }
.boton--p:hover::after { left: 125%; }
.boton--s { background: transparent; color: var(--zx-texto); border-color: var(--zx-filete); }
.boton--s:hover { background: var(--zx-niebla); border-color: var(--zx-gris-claro); color: var(--zx-texto); }
.hero .boton--s, .cabeza .boton--s, .seccion--tinta .boton--s, .banda-cta .boton--s, .pie .boton--s { color: var(--zx-sobre-tinta); border-color: rgba(255, 255, 255, 0.22); background: rgba(255, 255, 255, 0.03); }
.hero .boton--s:hover, .cabeza .boton--s:hover, .seccion--tinta .boton--s:hover, .banda-cta .boton--s:hover, .pie .boton--s:hover { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.45); color: #fff; }
.boton--tinta { background: var(--zx-tinta); }
.boton--compacto { min-height: 2.375rem; padding: 0 0.95rem; font-size: 0.9375rem; }
.boton--grande { min-height: 3.375rem; padding: 0 1.7rem; font-size: 1.125rem; }
.boton:disabled, .boton[aria-disabled="true"] { opacity: 0.6; cursor: default; transform: none; }
.boton__flecha { width: 1.05em; height: 1.05em; transition: transform 0.3s var(--ease); }
.boton:hover .boton__flecha { transform: translateX(3px); }
.volver { display: inline-flex; align-items: center; gap: 0.45rem; text-decoration: none; font-weight: 700; color: var(--zx-tinta); }
.volver .icono { width: 1.1em; height: 1.1em; transition: transform 0.25s var(--ease); }
.volver:hover { color: var(--zx-sello); }
.volver:hover .icono { transform: translateX(-3px); }

/* ------------------------------------------------------- movimiento */
.revelar { transition: opacity 0.8s var(--ease-salida), transform 0.8s var(--ease-salida), box-shadow 0.3s, border-color 0.3s, background-color 0.3s; transition-delay: calc(var(--i, 0) * 70ms); }
@keyframes zx-seguro { to { opacity: 1; transform: none; } }
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
  .revelar:not(.visible) { opacity: 0; transform: translateY(28px); }
  .seccion__cabecera.revelar:not(.visible) .antetitulo::before { transform: scaleX(0); }
  /* Red de seguridad: si web.js no llega a ejecutarse, todo aparece a los 3 s. */
  html:not(.zx-js) .revelar:not(.visible) { animation: zx-seguro 0.01s 3s forwards; }
}
[data-luz] { --mx: 50%; --my: 50%; --rx: 0deg; --ry: 0deg; position: relative; isolation: isolate; transform: perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry)); }
[data-luz]::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; pointer-events: none; opacity: 0; background: radial-gradient(380px circle at var(--mx) var(--my), rgba(192, 12, 12, 0.12), transparent 60%); transition: opacity 0.35s; }
[data-luz].con-luz { transition-duration: 0.8s, 0.12s, 0.3s, 0.3s, 0.3s; transition-delay: 0s; }
[data-luz].con-luz::after { opacity: 1; }
.seccion--tinta [data-luz]::after, .area--tinta[data-luz]::after { background: radial-gradient(380px circle at var(--mx) var(--my), rgba(255, 255, 255, 0.12), transparent 60%); }
.progreso { position: fixed; left: 0; top: 0; z-index: 80; width: 100%; height: 3px; background: linear-gradient(90deg, var(--zx-sello), var(--zx-sello-brillo)); transform-origin: 0 50%; transform: scaleX(0); pointer-events: none; }
.subir { position: fixed; right: 1rem; bottom: 4.75rem; z-index: 56; display: grid; place-items: center; width: 2.875rem; height: 2.875rem; border-radius: 50%; background: var(--zx-tinta); color: #fff; box-shadow: 0 12px 30px -10px rgba(27, 32, 39, 0.6); opacity: 0; transform: translateY(14px) scale(0.9); pointer-events: none; transition: opacity 0.3s, transform 0.3s var(--ease), background-color 0.2s; }
.subir__icono { transform: rotate(-90deg); width: 1.15rem; height: 1.15rem; }
.subir.visible { opacity: 1; transform: none; pointer-events: auto; }
.subir:hover { background: var(--zx-sello); color: #fff; }

/* ------------------------------------------------------------ cabecera */
.cabecera { position: fixed; top: 0; left: 0; right: 0; z-index: 60; color: var(--zx-sobre-tinta); transition: transform 0.35s var(--ease); }
.cabecera::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(22, 26, 32, 0.78); -webkit-backdrop-filter: blur(16px) saturate(150%); backdrop-filter: blur(16px) saturate(150%); border-bottom: 1px solid var(--zx-sobre-tinta-filete); box-shadow: 0 14px 40px -24px rgba(5, 8, 12, 0.7); opacity: 0; transition: opacity 0.35s; }
.cabecera::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 130%; z-index: -2; background: linear-gradient(180deg, rgba(13, 16, 21, 0.55), transparent); pointer-events: none; transition: opacity 0.35s; }
.cabecera.scrolled::before, .sin-js .cabecera::before { opacity: 1; }
.cabecera.scrolled::after { opacity: 0; }
.cabecera__interior { display: flex; align-items: center; gap: 0.75rem; min-height: var(--cab); }
.marca { display: inline-flex; align-items: center; gap: 0.7rem; margin-right: auto; color: inherit; text-decoration: none; }
.marca:hover { color: #fff; }
.marca__logo { width: 38px; height: 38px; border-radius: 8px; box-shadow: 0 6px 18px rgba(192, 12, 12, 0.35); transition: transform 0.4s var(--ease); }
.marca:hover .marca__logo { transform: rotate(-6deg) scale(1.05); }
.marca__textos { display: grid; line-height: 1.12; }
.marca__nombre { font-family: var(--zx-display); font-weight: 700; font-size: 1.125rem; letter-spacing: 0.01em; }
.marca__cn { font-size: 0.75rem; color: var(--zx-sobre-tinta-gris); }
.hamburguesa { display: inline-flex; align-items: center; gap: 0.55rem; min-height: 2.5rem; padding: 0 0.85rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.22); background: rgba(255, 255, 255, 0.04); color: var(--zx-sobre-tinta); font-size: 0.9375rem; position: relative; z-index: 2; }
.hamburguesa__barras { position: relative; width: 18px; height: 2px; border-radius: 2px; background: currentColor; transition: background-color 0.2s; }
.hamburguesa__barras::before, .hamburguesa__barras::after { content: ""; position: absolute; left: 0; width: 18px; height: 2px; border-radius: 2px; background: currentColor; transition: transform 0.3s var(--ease); }
.hamburguesa__barras::before { top: -6px; }
.hamburguesa__barras::after { top: 6px; }
.hamburguesa[aria-expanded="true"] .hamburguesa__barras { background: transparent; }
.hamburguesa[aria-expanded="true"] .hamburguesa__barras::before { transform: translateY(6px) rotate(45deg); }
.hamburguesa[aria-expanded="true"] .hamburguesa__barras::after { transform: translateY(-6px) rotate(-45deg); }
.sin-js .hamburguesa { display: none; }

/* Menú: panel a pantalla completa en el móvil (con JS); fila desplazable sin JS. */
.menu__lista { list-style: none; margin: 0; padding: 0; }
.menu__enlace { position: relative; display: flex; align-items: baseline; gap: 0.75rem; color: var(--zx-sobre-tinta-gris); text-decoration: none; transition: color var(--zx-transicion); }
.menu__enlace:hover, .menu__enlace[aria-current="page"], .menu__enlace.es-actual { color: #fff; }
.menu__n { font-family: var(--zx-display); font-size: 0.875rem; color: var(--zx-sello-brillo); }
.menu__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; }
.sin-js .menu { order: 3; flex-basis: 100%; padding-bottom: 0.75rem; }
.sin-js .cabecera__interior { flex-wrap: wrap; }
.sin-js .menu__lista { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; padding: 0.25rem 0 0.75rem; }
.sin-js .menu__n { display: none; }
.zx-js .menu {
  position: fixed; inset: 0; z-index: -1; display: flex; flex-direction: column; justify-content: space-between; gap: 2rem;
  padding: calc(var(--cab) + 1.5rem) var(--lateral) max(2rem, env(safe-area-inset-bottom)); overflow-y: auto;
  background: var(--zx-fondo-tinta); background-color: var(--zx-noche);
  visibility: hidden; opacity: 0; transform: translateY(-12px); transition: opacity 0.3s var(--ease), transform 0.4s var(--ease), visibility 0s linear 0.4s;
}
.zx-js .menu::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--zx-rejilla); background-size: 56px 56px; -webkit-mask-image: radial-gradient(ellipse at 30% 30%, #000, transparent 75%); mask-image: radial-gradient(ellipse at 30% 30%, #000, transparent 75%); }
.zx-js .menu.abierto { visibility: visible; opacity: 1; transform: none; transition: opacity 0.3s var(--ease), transform 0.4s var(--ease), visibility 0s; }
.zx-js .menu .menu__lista { display: grid; gap: 0.25rem; }
.zx-js .menu .menu__enlace { padding: 0.5rem 0; font-family: var(--zx-display); font-weight: 700; font-size: clamp(2rem, 1.2rem + 5vw, 3rem); line-height: 1.05; color: var(--zx-sobre-tinta); border-bottom: 1px solid var(--zx-sobre-tinta-filete); }
html[lang^="zh"] .zx-js .menu .menu__enlace { font-family: var(--zx-cjk); font-size: clamp(1.625rem, 1rem + 4vw, 2.25rem); }
.zx-js .menu.abierto .menu__lista li { animation: zx-entrar-menu 0.5s var(--ease-salida) both; }
.zx-js .menu.abierto .menu__lista li:nth-child(2) { animation-delay: 0.04s; }
.zx-js .menu.abierto .menu__lista li:nth-child(3) { animation-delay: 0.08s; }
.zx-js .menu.abierto .menu__lista li:nth-child(4) { animation-delay: 0.12s; }
.zx-js .menu.abierto .menu__lista li:nth-child(5) { animation-delay: 0.16s; }
@keyframes zx-entrar-menu { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.zx-js .menu .menu__acciones { padding-top: 1.25rem; border-top: 1px solid var(--zx-sobre-tinta-filete); }
.menu-abierto { overflow: hidden; }
.panel-abierto { overflow: hidden; }
.idiomas { display: inline-flex; padding: 3px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.04); }
.idiomas__op { display: inline-grid; place-items: center; min-width: 2.5rem; min-height: 2rem; padding: 0 0.7rem; border-radius: 999px; color: var(--zx-sobre-tinta-gris); text-decoration: none; font-family: var(--zx-display); font-weight: 700; font-size: 0.875rem; letter-spacing: 0.04em; transition: background-color var(--zx-transicion), color var(--zx-transicion); }
.idiomas__op[lang="zh-Hans"] { font-family: var(--zx-cjk); letter-spacing: 0; }
.idiomas__op:hover { color: #fff; }
.idiomas__op.es-activo { background: #fff; color: var(--zx-tinta); }
.boton-intranet { display: inline-flex; align-items: center; gap: 0.45rem; min-height: 2.375rem; padding: 0 0.9rem; border-radius: var(--zx-radio); border: 1px solid rgba(255, 255, 255, 0.22); color: var(--zx-sobre-tinta); text-decoration: none; font-family: var(--zx-display); font-weight: 700; font-size: 0.9375rem; transition: background-color var(--zx-transicion), border-color var(--zx-transicion); }
html[lang^="zh"] .boton-intranet { font-family: var(--zx-cjk); }
.boton-intranet .icono { width: 1.05rem; height: 1.05rem; transition: transform 0.3s var(--ease); }
.boton-intranet:hover { color: #fff; background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.45); }
.boton-intranet:hover .icono { transform: translateY(-1px) rotate(-8deg); }
.enlace-instalar { display: inline-flex; align-items: center; gap: 0.45rem; min-height: 2.25rem; padding: 0 0.2rem; border: 0; background: none; color: var(--zx-sobre-tinta-gris); font-size: 0.875rem; text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer; }
.enlace-instalar .icono { width: 1.05rem; height: 1.05rem; }
.enlace-instalar:hover { color: #fff; }
.enlace-instalar--menu { flex-basis: 100%; }

/* ---------------------------------------------------------------- hero */
.hero { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; justify-content: center; min-height: 100vh; min-height: 100svh; background: var(--zx-noche); color: var(--zx-sobre-tinta); --mx: 72%; --my: 32%; }
.hero__fondo { position: absolute; inset: 0; z-index: -1; pointer-events: none; background: var(--zx-fondo-tinta); }
.hero__luz { position: absolute; border-radius: 50%; will-change: transform; animation: zx-flotar 16s ease-in-out infinite alternate; }
.hero__luz--sello { width: 60vmax; height: 60vmax; right: -18vmax; top: -24vmax; background: radial-gradient(circle, rgba(192, 12, 12, 0.5), rgba(192, 12, 12, 0) 62%); }
.hero__luz--azul { width: 52vmax; height: 52vmax; left: -20vmax; bottom: -26vmax; background: radial-gradient(circle, rgba(47, 93, 138, 0.55), rgba(47, 93, 138, 0) 62%); animation-duration: 21s; animation-delay: -7s; }
.hero__luz--brasa { width: 30vmax; height: 30vmax; left: 36%; top: 28%; background: radial-gradient(circle, rgba(255, 90, 79, 0.16), rgba(255, 90, 79, 0) 68%); animation: zx-orbita 28s linear infinite; }
.hero__rejilla { position: absolute; inset: 0; background-image: var(--zx-rejilla); background-size: 64px 64px; -webkit-mask-image: radial-gradient(ellipse 85% 75% at 50% 42%, #000 22%, transparent 78%); mask-image: radial-gradient(ellipse 85% 75% at 50% 42%, #000 22%, transparent 78%); }
.hero__rejilla::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 90, 79, 0.28) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 90, 79, 0.28) 1px, transparent 1px); background-size: 64px 64px; opacity: 0; transition: opacity 0.5s; -webkit-mask-image: radial-gradient(240px circle at var(--mx) var(--my), #000, transparent 70%); mask-image: radial-gradient(240px circle at var(--mx) var(--my), #000, transparent 70%); }
.hero__cursor { position: absolute; inset: 0; background: radial-gradient(560px circle at var(--mx) var(--my), rgba(255, 255, 255, 0.075), transparent 60%); opacity: 0; transition: opacity 0.5s; }
.hero.con-cursor .hero__cursor, .hero.con-cursor .hero__rejilla::after { opacity: 1; }
@keyframes zx-flotar { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(3vw, 5vh, 0) scale(1.1); } }
@keyframes zx-orbita { from { transform: rotate(0deg) translateX(9vmax) rotate(0deg); } to { transform: rotate(360deg) translateX(9vmax) rotate(-360deg); } }
.hero__interior { display: grid; gap: 2.5rem; align-items: end; padding: calc(var(--cab) + 2.5rem) 0 0; }
.hero__texto { padding-bottom: 1rem; }
.hero__antetitulo { display: inline-flex; align-items: center; gap: 0.7rem; margin: 0 0 1.4rem; padding: 0.4rem 0.85rem 0.4rem 0.6rem; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 999px; background: rgba(255, 255, 255, 0.04); font-size: 0.875rem; color: var(--zx-sobre-tinta-gris); letter-spacing: 0.03em; }
.hero__punto { width: 9px; height: 9px; border-radius: 50%; background: var(--zx-sello-brillo); box-shadow: 0 0 0 4px rgba(192, 12, 12, 0.3); animation: zx-latir 2.4s ease-in-out infinite; }
@keyframes zx-latir { 0%, 100% { box-shadow: 0 0 0 3px rgba(255, 90, 79, 0.35); } 50% { box-shadow: 0 0 0 9px rgba(255, 90, 79, 0); } }
.hero__titulo { max-width: 13ch; margin: 0 0 1.5rem; font-size: clamp(3rem, 1.5rem + 6.6vw, 7.75rem); line-height: 0.9; letter-spacing: -0.025em; }
html[lang^="zh"] .hero__titulo { max-width: 11em; font-size: clamp(2.5rem, 1.2rem + 4.6vw, 5.5rem); line-height: 1.12; letter-spacing: 0.01em; }
.hero__palabra { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.hero__palabra > span { display: inline-block; transition: transform 1s var(--ease-salida), opacity 0.7s; transition-delay: calc(0.12s + var(--i, 0) * 55ms); }
/* La última palabra lleva un trazo de sello rojo. */
.hero__palabra:last-child > span { background-image: linear-gradient(var(--zx-sello), var(--zx-sello)); background-repeat: no-repeat; background-size: 100% 0.1em; background-position: 0 96%; }
html[lang^="zh"] .hero__palabra:last-child > span { background-image: none; }
.hero__entrada { max-width: 40rem; margin: 0 0 2rem; font-size: 1.125rem; line-height: 1.65; color: var(--zx-sobre-tinta-gris); }
.hero__botones { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1.5rem; }
.hero__micro { display: inline-flex; align-items: center; gap: 0.55rem; margin: 0; font-size: 0.9375rem; color: var(--zx-sobre-tinta-gris); }
.hero__micro .icono { color: var(--zx-sello-brillo); }
.hero__entrada, .hero__botones, .hero__micro, .hero__figura { transition: opacity 0.9s ease, transform 0.9s var(--ease-salida); }
.hero__entrada { transition-delay: 0.5s; }
.hero__botones { transition-delay: 0.62s; }
.hero__micro { transition-delay: 0.74s; }
.hero__figura { position: relative; justify-self: center; align-self: end; width: min(21rem, 76vw); transition-delay: 0.25s; }
.hero__sello { position: absolute; left: 4%; right: 4%; bottom: 0; height: 56%; border-radius: var(--zx-radio-xl) var(--zx-radio-xl) 0 0; background: linear-gradient(160deg, #d81818, var(--zx-sello) 55%, var(--zx-burdeos)); box-shadow: 0 40px 90px -20px rgba(192, 12, 12, 0.55); }
.hero__sello::after { content: ""; position: absolute; inset: 10px 10px 0; border: 1px solid rgba(255, 255, 255, 0.28); border-bottom: 0; border-radius: 14px 14px 0 0; }
.hero__anillo { position: absolute; z-index: 0; right: -9%; top: 16%; width: 46%; height: auto; overflow: visible; animation: zx-girar 40s linear infinite; }
.hero__anillo text { fill: rgba(255, 255, 255, 0.55); font-family: var(--zx-display); font-weight: 700; font-size: 13.4px; letter-spacing: 0.18em; }
@keyframes zx-girar { to { transform: rotate(360deg); } }
.hero__imagen { position: relative; z-index: 1; width: 100%; height: auto; filter: drop-shadow(0 30px 40px rgba(0, 0, 0, 0.45)); }
.hero__tarjeta { position: absolute; z-index: 2; display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.85rem; border-radius: 14px; background: rgba(255, 255, 255, 0.92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: var(--zx-texto); box-shadow: 0 24px 50px -16px rgba(10, 13, 18, 0.55); font-size: 0.8125rem; line-height: 1.2; white-space: nowrap; animation: zx-oscilar 6s ease-in-out infinite; }
.hero__tarjeta strong { display: block; font-family: var(--zx-display); font-size: 0.9375rem; }
html[lang^="zh"] .hero__tarjeta strong { font-family: var(--zx-cjk); }
.hero__tarjeta small { display: block; color: var(--zx-gris); font-size: 0.75rem; }
.hero__tarjeta .icono { width: 30px; height: 30px; padding: 6px; border-radius: 9px; background: var(--zx-jade-claro); color: var(--zx-jade); }
.hero__tarjeta--a { left: -1.25rem; top: 36%; }
.hero__tarjeta--b { right: -1rem; bottom: 13%; animation-delay: -3s; }
.hero__idiomas { display: inline-flex; align-items: center; gap: 0.3rem; height: 30px; padding: 0 0.55rem; border-radius: 9px; background: var(--zx-tinta); color: #fff; font-family: var(--zx-display); font-weight: 700; font-size: 0.8125rem; }
.hero__idiomas i { width: 1px; height: 12px; background: rgba(255, 255, 255, 0.35); }
@keyframes zx-oscilar { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.hero__scroll { position: absolute; left: 50%; bottom: 1.25rem; z-index: 3; display: none; width: 26px; height: 42px; margin-left: -13px; border: 2px solid rgba(255, 255, 255, 0.35); border-radius: 14px; }
.hero__rueda { position: absolute; left: 50%; top: 7px; width: 4px; height: 8px; margin-left: -2px; border-radius: 2px; background: #fff; animation: zx-rueda 1.8s ease-in-out infinite; }
@keyframes zx-rueda { 0% { transform: translateY(0); opacity: 1; } 70% { transform: translateY(14px); opacity: 0; } 100% { transform: translateY(0); opacity: 0; } }
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
  html:not(.hero-listo) .hero__palabra > span { transform: translateY(108%); opacity: 0; }
  html:not(.hero-listo) .hero__entrada, html:not(.hero-listo) .hero__botones, html:not(.hero-listo) .hero__micro { opacity: 0; transform: translateY(18px); }
  html:not(.hero-listo) .hero__figura { opacity: 0; transform: translateY(36px); }
  html:not(.zx-js) .hero__palabra > span, html:not(.zx-js) .hero__entrada, html:not(.zx-js) .hero__botones, html:not(.zx-js) .hero__micro, html:not(.zx-js) .hero__figura { animation: zx-seguro 0.01s 2.5s forwards; }
}
.hero-listo .hero__figura { transition: opacity 0.9s ease 0.25s, transform 0.12s linear; }

/* ---------------------------------------------------------- marquesina */
.marquesina { position: relative; overflow: hidden; background: var(--zx-sello); color: #fff; border-block: 1px solid rgba(0, 0, 0, 0.12); }
.marquesina__pista { display: flex; width: max-content; animation: zx-desfilar var(--dur, 48s) linear infinite; }
.marquesina:hover .marquesina__pista { animation-play-state: paused; }
.marquesina__item { display: inline-flex; align-items: baseline; gap: 0.6rem; padding: 0.85rem 1.6rem; font-family: var(--zx-display); font-weight: 700; font-size: 1.125rem; letter-spacing: 0.01em; white-space: nowrap; }
.marquesina__item::after { content: ""; align-self: center; width: 7px; height: 7px; margin-left: 1rem; border-radius: 2px; background: rgba(255, 255, 255, 0.55); transform: rotate(45deg); }
html[lang^="zh"] .marquesina__item { font-family: var(--zx-cjk); }
.marquesina__item em { font-style: normal; font-weight: 400; font-size: 0.9375rem; opacity: 0.8; }
.marquesina__item em[lang="es"] { font-family: var(--zx-ui); }
@keyframes zx-desfilar { to { transform: translateX(-50%); } }

/* --------------------------------------------------------------- cifras */
.cifras { background: var(--zx-papel); border-bottom: 1px solid var(--zx-filete); }
.cifras__rejilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cifra { position: relative; display: grid; gap: 0.35rem; align-content: start; padding: 2rem 1rem 2rem 0; border-top: 1px solid var(--zx-filete); }
.cifra::before { content: ""; position: absolute; left: 0; top: -1px; width: 3rem; height: 3px; background: var(--zx-sello); transform: scaleX(1); transform-origin: 0 50%; transition: transform 1s var(--ease-salida) 0.3s; }
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) { .cifra:not(.visible)::before { transform: scaleX(0); } }
.cifra__n { font-family: var(--zx-display); font-weight: 700; font-size: clamp(3rem, 2rem + 3.2vw, 5rem); line-height: 0.9; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.cifra__t { font-size: 0.9375rem; color: var(--zx-gris); line-height: 1.4; }

/* ------------------------------------------------------------- despacho */
.despacho { display: grid; gap: 2.5rem; }
.despacho__texto .prosa { max-width: 40rem; color: var(--zx-tinta-3); font-size: 1.0625rem; }
.despacho__sello { display: flex; align-items: center; gap: 0.9rem; margin: 1.75rem 0 0; font-family: var(--zx-display); font-weight: 700; font-size: 1.125rem; }
html[lang^="zh"] .despacho__sello { font-family: var(--zx-cjk); }
.valores { margin: 0; padding: 0; display: grid; gap: 1rem; }
.valor { overflow: hidden; padding: 1.6rem 1.5rem 1.5rem; border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-l); background: var(--zx-papel); box-shadow: var(--sombra-tarjeta); }
.valor:hover { border-color: rgba(192, 12, 12, 0.35); }
.valor__glifo { position: absolute; right: -0.12em; top: -0.18em; z-index: -1; font-family: var(--zx-cjk); font-weight: 700; font-size: 7.5rem; line-height: 1; color: rgba(27, 32, 39, 0.05); transition: color 0.4s, transform 0.6s var(--ease); pointer-events: none; }
.valor:hover .valor__glifo { color: rgba(192, 12, 12, 0.1); transform: rotate(-6deg) scale(1.05); }
.valor__titulo { font-size: 1.625rem; margin-bottom: 0.25rem; }
.valor__cn { margin: 0 0 0.75rem; font-size: 1rem; color: var(--zx-sello); }
.valor__texto { margin: 0; font-size: 0.9375rem; line-height: 1.6; color: var(--zx-gris); }

/* --------------------------------------------------------------- método */
.metodo { display: grid; gap: 1rem; }
.metodo .seccion__cabecera { margin-bottom: 1rem; }
.compromisos { position: relative; list-style: none; margin: 0; padding: 0; display: grid; --p: 1; }
.compromisos::before, .compromisos::after { content: ""; position: absolute; left: calc(1.625rem - 1px); top: 1.75rem; bottom: 1.75rem; width: 2px; border-radius: 2px; }
.compromisos::before { background: var(--zx-sobre-tinta-filete); }
.compromisos::after { background: linear-gradient(180deg, var(--zx-sello), var(--zx-sello-brillo)); transform-origin: 50% 0; transform: scaleY(var(--p)); }
.compromiso { position: relative; display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: 1.25rem; padding: 1.4rem 0; }
.compromiso__n { position: relative; z-index: 1; display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 50%; border: 2px solid rgba(255, 255, 255, 0.18); background: var(--zx-tinta); font-family: var(--zx-display); font-weight: 700; font-size: 1.125rem; color: var(--zx-sobre-tinta-gris); transition: border-color 0.4s, color 0.4s, box-shadow 0.4s, background-color 0.4s; }
.compromiso.activo .compromiso__n { border-color: var(--zx-sello); background: var(--zx-sello); color: #fff; box-shadow: 0 0 0 8px rgba(192, 12, 12, 0.18); }
.compromiso__cuerpo { padding: 1.1rem 1.25rem; border: 1px solid var(--zx-sobre-tinta-filete); border-radius: var(--zx-radio-l); background: rgba(255, 255, 255, 0.03); transition: border-color 0.4s, background-color 0.4s; }
.compromiso.activo .compromiso__cuerpo { border-color: rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.055); }
.compromiso__titulo { font-size: 1.5rem; margin-bottom: 0.3rem; }
.compromiso__cn { margin: 0 0 0.5rem; font-size: 0.9375rem; color: #ff9a92; }
.compromiso__texto { margin: 0; font-size: 0.9375rem; line-height: 1.6; color: var(--zx-sobre-tinta-gris); }

/* ---------------------------------------------------------------- áreas */
.areas { display: grid; gap: 1rem; }
.area { display: flex; flex-direction: column; gap: 0.4rem; overflow: hidden; padding: 1.6rem 1.5rem 1.4rem; background: var(--zx-papel); border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-l); box-shadow: var(--sombra-tarjeta); }
.area:hover { border-color: rgba(192, 12, 12, 0.4); box-shadow: 0 30px 60px -30px rgba(27, 32, 39, 0.45); }
.area__cabecera { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.8rem; }
.area__n { font-family: var(--zx-display); font-weight: 700; font-size: 1.25rem; color: var(--zx-gris-claro); transition: color 0.3s; }
.area:hover .area__n { color: var(--zx-sello); }
.area__icono { display: inline-grid; place-items: center; width: 3rem; height: 3rem; border-radius: 12px; background: var(--zx-niebla); border: 1px solid var(--zx-filete-suave); color: var(--zx-tinta); transition: background-color 0.3s, color 0.3s, transform 0.4s var(--ease), border-color 0.3s; }
.area__icono .icono { width: 1.5rem; height: 1.5rem; }
.area:hover .area__icono { background: var(--zx-sello); border-color: var(--zx-sello); color: #fff; transform: rotate(-6deg) scale(1.06); }
.area__titulo { font-size: 1.75rem; }
.area__titulo a { text-decoration: none; }
.area__titulo a::after { content: ""; position: absolute; inset: 0; z-index: 3; border-radius: inherit; }
.area__titulo a:focus-visible { outline-offset: 4px; }
.area__cn { margin: 0; font-size: 1rem; color: var(--zx-gris); }
.area__texto { flex: 1; margin: 0.6rem 0 1rem; font-size: 0.9375rem; line-height: 1.6; color: var(--zx-gris); }
.area__mas { display: inline-flex; align-items: center; gap: 0.45rem; margin: 0; font-size: 0.9375rem; font-weight: 700; color: var(--zx-sello); }
.area__mas .icono { width: 1.1rem; height: 1.1rem; transition: transform 0.3s var(--ease); }
.area:hover .area__mas .icono { transform: translateX(5px); }
.area--tinta { background: var(--zx-tinta); border-color: var(--zx-tinta); color: var(--zx-sobre-tinta); }
.area--tinta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(500px 300px at 100% 0%, rgba(192, 12, 12, 0.35), transparent 65%), var(--zx-rejilla); background-size: auto, 48px 48px; }
.area--tinta .area__icono { background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.14); color: #fff; }
.area--tinta .area__texto, .area--tinta .area__cn { color: var(--zx-sobre-tinta-gris); }
.area--tinta .area__mas { color: #ff9a92; }
.area--tinta .area__titulo a:hover { color: #fff; }

/* -------------------------------------------------------- departamentos */
.departamentos { display: grid; gap: 1rem; }
.departamento { overflow: hidden; padding: 1.6rem 1.5rem; background: var(--zx-papel); border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-l); }
.departamento::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 3px; background: var(--zx-tinta); transform-origin: 0 50%; transition: background-color 0.3s; }
.departamento:hover::before { background: var(--zx-sello); }
.departamento:hover { box-shadow: var(--sombra-tarjeta); }
.departamento__icono { display: inline-grid; place-items: center; width: 2.875rem; height: 2.875rem; margin-bottom: 1rem; border-radius: 10px; background: var(--zx-tinta); color: #fff; transition: background-color 0.3s, transform 0.3s var(--ease); }
.departamento__icono .icono { width: 1.4rem; height: 1.4rem; }
.departamento:hover .departamento__icono { background: var(--zx-sello); transform: translateY(-2px) rotate(-4deg); }
.departamento__titulo { font-size: 1.375rem; }
.departamento__cn { margin: 0.15rem 0 0.55rem; font-size: 0.9375rem; color: var(--zx-gris); }
.departamento__texto { margin: 0.4rem 0 0; font-size: 0.9375rem; line-height: 1.6; color: var(--zx-gris); }

/* ------------------------------------------------------------- recursos */
.entradas { display: grid; gap: 1rem; }
.entrada-tarjeta { display: flex; flex-direction: column; gap: 0.6rem; overflow: hidden; padding: 1.5rem 1.4rem; background: var(--zx-papel); border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-l); }
.entrada-tarjeta:hover { border-color: var(--zx-gris-claro); box-shadow: var(--sombra-tarjeta); }
.entrada-tarjeta__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin: 0; font-size: 0.875rem; color: var(--zx-gris); }
.entrada-tarjeta__titulo { font-size: 1.5rem; line-height: 1.08; }
.entrada-tarjeta__titulo a { text-decoration: none; background-image: linear-gradient(var(--zx-sello), var(--zx-sello)); background-repeat: no-repeat; background-size: 0 2px; background-position: 0 100%; transition: background-size 0.5s var(--ease); }
.entrada-tarjeta__titulo a::after { content: ""; position: absolute; inset: 0; z-index: 3; }
.entrada-tarjeta__titulo a:focus-visible { outline-offset: 4px; }
.entrada-tarjeta:hover .entrada-tarjeta__titulo a { background-size: 100% 2px; }
.entrada-tarjeta__texto { flex: 1; margin: 0; font-size: 0.9375rem; line-height: 1.6; color: var(--zx-gris); }
.entrada-tarjeta__mas { display: inline-flex; align-items: center; gap: 0.45rem; margin: 0.25rem 0 0; font-size: 0.9375rem; font-weight: 700; color: var(--zx-sello); }
.entrada-tarjeta__mas .icono { width: 1.1rem; height: 1.1rem; transition: transform 0.3s var(--ease); }
.entrada-tarjeta:hover .entrada-tarjeta__mas .icono { transform: translateX(5px); }
.guias { margin: 0; padding: 0; display: grid; gap: 0.7rem; }
.guia { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: 0.9rem; padding: 1rem 1.1rem; border: 1px dashed var(--zx-gris-claro); border-radius: var(--zx-radio); background: rgba(255, 255, 255, 0.55); transition: border-color 0.3s, background-color 0.3s; }
.guia:hover { border-color: var(--zx-tinta-4); background: var(--zx-papel); }
.guia__icono { display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: var(--zx-radio-s); background: var(--zx-marfil); color: var(--zx-tinta-3); }
.guia__icono .icono { width: 1.2rem; height: 1.2rem; }
.guia__titulo { font-size: 1.125rem; margin-bottom: 0.2rem; }
.guia__texto { margin: 0; font-size: 0.9rem; line-height: 1.5; color: var(--zx-gris); }
.filtros ul { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 1.75rem; }
.filtro { display: inline-flex; align-items: center; min-height: 2.375rem; padding: 0 1rem; border-radius: 999px; border: 1px solid var(--zx-filete); color: var(--zx-tinta-3); font-weight: 700; font-size: 0.9375rem; text-decoration: none; transition: background-color var(--zx-transicion), color var(--zx-transicion), border-color var(--zx-transicion); }
.filtro:hover { border-color: var(--zx-tinta-3); color: var(--zx-tinta); }
.filtro.es-activo { background: var(--zx-tinta); border-color: var(--zx-tinta); color: #fff; }
.paginacion ul { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 2rem 0 0; }
.paginacion__n { display: inline-grid; place-items: center; min-width: 2.75rem; height: 2.75rem; border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-s); text-decoration: none; font-family: var(--zx-display); font-weight: 700; }
.paginacion__n.es-activo { background: var(--zx-sello); border-color: var(--zx-sello); color: #fff; }

/* -------------------------------------------------------------- modelos */
.modelos { display: grid; gap: 1rem; }
.modelo { overflow: hidden; padding: 1.8rem 1.5rem 1.6rem; background: var(--zx-papel); border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-l); }
.modelo::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 5px; background: var(--zx-tinta); }
.modelo--2::before { background: var(--zx-azul); }
.modelo--3::before { background: var(--zx-jade); }
.modelo:hover { box-shadow: var(--sombra-tarjeta); border-color: var(--zx-gris-claro); }
.modelo__n { display: block; margin-bottom: 0.75rem; font-family: var(--zx-display); font-weight: 700; font-size: 3rem; line-height: 0.9; color: var(--zx-marfil-2); }
.modelo__titulo { font-size: 1.625rem; }
.modelo__cn { margin: 0.15rem 0 0.6rem; font-size: 1rem; color: var(--zx-gris); }
.modelo__texto { margin: 0.5rem 0 0; font-size: 0.9375rem; line-height: 1.6; color: var(--zx-gris); }
.tabla-envoltorio { margin: 0; overflow-x: auto; border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-l); background: var(--zx-papel); }
.tabla { font-size: 0.9375rem; }
.tabla caption { caption-side: top; text-align: left; padding: 1rem 1.1rem 0.75rem; color: var(--zx-gris); font-size: 0.875rem; }
.tabla th, .tabla td { padding: 0.8rem 1.1rem; text-align: left; vertical-align: top; border-top: 1px solid var(--zx-filete); }
.tabla thead th { background: var(--zx-tinta); color: var(--zx-sobre-tinta); font-family: var(--zx-display); font-weight: 700; font-size: 0.9375rem; border-top: 0; }
html[lang^="zh"] .tabla thead th { font-family: var(--zx-cjk); }
.tabla tbody th { font-family: var(--zx-display); font-weight: 700; white-space: nowrap; }
.tabla tbody tr { transition: background-color 0.2s; }
.tabla tbody tr:hover { background: var(--zx-niebla); }

/* -------------------------------------------------------------- razones */
.razones { margin: 0; padding: 0; display: grid; gap: 0.75rem; counter-reset: razon; }
.razon { position: relative; padding: 1.3rem 1.25rem 1.25rem 1.25rem; border: 1px solid var(--zx-filete); border-radius: var(--zx-radio); background: var(--zx-papel); }
.razon:hover { border-color: rgba(30, 122, 87, 0.55); transform: translateY(-2px); box-shadow: var(--sombra-tarjeta); }
.razon__n { display: block; margin-bottom: 0.6rem; font-family: var(--zx-display); font-weight: 700; font-size: 0.875rem; color: var(--zx-gris-claro); letter-spacing: 0.08em; }
.razon__check { position: absolute; right: 1.1rem; top: 1.1rem; display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--zx-jade-claro); color: var(--zx-jade); }
.razon__check .icono { width: 1rem; height: 1rem; stroke-width: 2.4; transition: transform 0.5s var(--ease-salida) calc(var(--i, 0) * 70ms + 0.3s); }
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) { .razon:not(.visible) .razon__check .icono { transform: scale(0); } }
.razon__titulo { font-size: 1.3125rem; margin: 0 2.5rem 0.35rem 0; }
.razon__texto { margin: 0; font-size: 0.9375rem; line-height: 1.6; color: var(--zx-gris); }

/* -------------------------------------------------------------- oficina */
.oficina { display: grid; gap: 2.5rem; align-items: start; }
.oficina__lista { margin: 0; display: grid; border-top: 1px solid var(--zx-sobre-tinta-filete); }
.oficina__lista > div { padding: 0.95rem 0; border-bottom: 1px solid var(--zx-sobre-tinta-filete); }
.oficina__lista dt { margin-bottom: 0.2rem; font-size: 0.8125rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--zx-sobre-tinta-gris); }
.oficina__lista dd { margin: 0; font-size: 1.0625rem; line-height: 1.55; }
.oficina__lista a { color: #fff; }
.oficina__lista a:hover { color: #ffb3ab; }
.oficina__nota { font-size: 0.875rem; color: var(--zx-sobre-tinta-gris); }
.oficina__aviso { display: flex; align-items: flex-start; gap: 0.6rem; margin: 1.5rem 0 0; font-size: 0.9375rem; color: var(--zx-sobre-tinta-gris); }
.oficina__aviso .icono { margin-top: 0.15rem; color: #7fd1ad; }
.oficina__wechat { display: grid; justify-items: start; gap: 0.6rem; }
.oficina__qr-marco { position: relative; padding: 14px; border-radius: var(--zx-radio-xl); background: #fff; box-shadow: 0 30px 70px -30px rgba(0, 0, 0, 0.7); }
.oficina__qr-marco::before { content: ""; position: absolute; inset: -8px; border-radius: 26px; border: 1px solid rgba(255, 255, 255, 0.25); animation: zx-pulso 3s ease-out infinite; }
@keyframes zx-pulso { 0% { opacity: 0.9; transform: scale(0.98); } 100% { opacity: 0; transform: scale(1.12); } }
.oficina__qr { width: 220px; height: 220px; }
.oficina__qr-enlace { display: block; }
.oficina__qr-titulo { margin: 0.75rem 0 0; font-family: var(--zx-display); font-weight: 700; font-size: 1.25rem; }
.oficina__qr-texto { margin: 0; font-size: 0.9375rem; color: var(--zx-sobre-tinta-gris); max-width: 24rem; }

/* ------------------------------------------------------------- contacto */
.seccion--contacto { background: linear-gradient(180deg, var(--zx-marfil), var(--zx-niebla)); }
.contacto { display: grid; gap: 2.5rem; align-items: start; }
.contacto__vias { margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.contacto__vias li { display: flex; align-items: center; gap: 0.75rem; padding: 0.9rem 1rem; border: 1px solid var(--zx-filete); border-radius: var(--zx-radio); background: var(--zx-papel); font-size: 1rem; transition: border-color 0.3s, transform 0.3s var(--ease); }
.contacto__vias li:hover { border-color: var(--zx-tinta-4); transform: translateX(4px); }
.contacto__vias .icono { color: var(--zx-sello); }
.contacto__vias a { font-weight: 700; text-decoration: none; }
.contacto__micro { display: flex; align-items: center; gap: 0.8rem; margin: 1.5rem 0 0; font-weight: 700; }
.contacto__formulario { position: relative; padding: 1.4rem; background: var(--zx-papel); border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-xl); box-shadow: 0 40px 90px -50px rgba(27, 32, 39, 0.45); }
.contacto__formulario::before { content: ""; position: absolute; left: 1.5rem; right: 1.5rem; top: -1px; height: 3px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, var(--zx-sello), var(--zx-sello-brillo)); }

/* ----------------------------------------------------------- formulario */
.formulario { display: grid; gap: 1.05rem; }
.formulario__fila { display: grid; gap: 1.05rem; }
.campo { position: relative; display: grid; gap: 0.35rem; margin: 0; }
.campo > label { font-size: 0.875rem; font-weight: 700; color: var(--zx-tinta-3); transition: color 0.2s; }
.campo__req { color: var(--zx-sello); }
.campo input:not([type="checkbox"]), .campo select, .campo textarea {
  width: 100%; min-height: 3rem; padding: 0.65rem 0.85rem; border: 1px solid var(--zx-filete); border-radius: var(--zx-radio); background: var(--zx-niebla);
  font-size: 1rem; transition: border-color var(--zx-transicion), box-shadow var(--zx-transicion), background-color var(--zx-transicion);
}
.campo select { appearance: none; -webkit-appearance: none; padding-right: 2.4rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235c6672' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.85rem center; }
.campo textarea { min-height: 8.5rem; resize: vertical; line-height: 1.55; }
.campo input:hover, .campo select:hover, .campo textarea:hover { border-color: var(--zx-gris-claro); }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--zx-tinta); background-color: var(--zx-papel); box-shadow: 0 0 0 4px rgba(27, 32, 39, 0.1); }
.campo:focus-within > label { color: var(--zx-tinta); }
.campo [aria-invalid="true"] { border-color: var(--zx-sello) !important; box-shadow: 0 0 0 4px rgba(192, 12, 12, 0.12) !important; }
.campo__error { font-size: 0.8125rem; font-weight: 700; color: var(--zx-burdeos); }
.campo__ayuda { font-size: 0.8125rem; color: var(--zx-gris); }
.campo__contador { float: right; font-variant-numeric: tabular-nums; }
.campo--consentimiento { grid-template-columns: 1.25rem minmax(0, 1fr); column-gap: 0.65rem; align-items: start; }
.campo--consentimiento input { width: 1.2rem; height: 1.2rem; margin: 0.15rem 0 0; accent-color: var(--zx-sello); }
.campo--consentimiento label { font-size: 0.875rem; font-weight: 400; line-height: 1.5; color: var(--zx-tinta-3); }
.campo--consentimiento .campo__error { grid-column: 2; }
.formulario__enviar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin: 0.25rem 0 0; }
.formulario__enviando { font-size: 0.875rem; color: var(--zx-gris); }
.boton__giro { display: none; width: 16px; height: 16px; border: 2px solid rgba(255, 255, 255, 0.4); border-top-color: #fff; border-radius: 50%; animation: zx-girar 0.8s linear infinite; }
.formulario.enviando .boton__giro { display: inline-block; }
.formulario.enviando .boton__flecha { display: none; }
.formulario.enviando [data-enviar] { pointer-events: none; opacity: 0.8; }
.formulario.enviado [data-enviar] { background: var(--zx-jade); box-shadow: none; }
.formulario__estado { scroll-margin-top: calc(var(--cab) + 2rem); }
.formulario__estado:focus { outline: 3px solid currentColor; outline-offset: 2px; }
.formulario__aviso { margin: 0; font-size: 0.8125rem; line-height: 1.5; color: var(--zx-gris); }
.clausula { margin: 0.5rem 0 0; padding-top: 1rem; border-top: 1px solid var(--zx-filete); font-size: 0.8125rem; line-height: 1.5; color: var(--zx-gris); }
.clausula__titulo { margin-bottom: 0.6rem; font-size: 1rem; color: var(--zx-texto); }
.clausula dl { margin: 0; display: grid; gap: 0.2rem 1rem; }
.clausula dt { font-weight: 700; color: var(--zx-texto); }
.clausula dd { margin: 0 0 0.45rem; }
.clausula a { color: var(--zx-texto); }
.trampa { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* --------------------------------------------- cabeza de las páginas */
.cabeza { position: relative; isolation: isolate; overflow: hidden; padding: calc(var(--cab) + 1.5rem) 0 3rem; background: var(--zx-noche); color: var(--zx-sobre-tinta); }
.cabeza__fondo { position: absolute; inset: 0; z-index: -2; background: var(--zx-fondo-tinta); }
.cabeza__luz { position: absolute; right: -10vmax; top: -20vmax; width: 50vmax; height: 50vmax; border-radius: 50%; background: radial-gradient(circle, rgba(192, 12, 12, 0.38), transparent 62%); animation: zx-flotar 18s ease-in-out infinite alternate; }
.cabeza__rejilla { position: absolute; inset: 0; background-image: var(--zx-rejilla); background-size: 56px 56px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 40%, #000); mask-image: linear-gradient(90deg, transparent, #000 40%, #000); }
.cabeza__marca { position: absolute; right: -0.04em; bottom: -0.2em; z-index: -1; font-family: var(--zx-display); font-weight: 700; font-size: clamp(9rem, 22vw, 20rem); line-height: 0.8; color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, 0.14); pointer-events: none; }
.cabeza__interior { position: relative; }
.cabeza__titulo { max-width: 18ch; font-size: clamp(2.5rem, 1.4rem + 4.4vw, 5rem); line-height: 0.95; letter-spacing: -0.02em; animation: zx-subir 0.9s var(--ease-salida) both; }
html[lang^="zh"] .cabeza__titulo { max-width: 16em; font-size: clamp(2rem, 1.2rem + 3vw, 3.5rem); line-height: 1.2; }
html[lang^="zh"] .cabeza__titulo[lang="es"] { line-height: 1; }
.cabeza__cn { margin: 0.75rem 0 0; font-size: 1.375rem; color: var(--zx-sobre-tinta-gris); }
.cabeza__entrada { max-width: 46rem; margin: 1.1rem 0 0; font-size: 1.125rem; line-height: 1.6; color: var(--zx-sobre-tinta-gris); animation: zx-subir 0.9s var(--ease-salida) 0.08s both; }
.cabeza__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; margin: 1.25rem 0 0; font-size: 0.9375rem; color: var(--zx-sobre-tinta-gris); }
.cabeza__acciones { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.75rem; }
@keyframes zx-subir { from { opacity: 0; transform: translateY(18px); } }
.migas { margin-bottom: 1.5rem; font-size: 0.8125rem; color: var(--zx-sobre-tinta-gris); }
.migas ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.3rem 0.5rem; }
.migas li + li::before { content: "/"; margin-right: 0.5rem; color: rgba(255, 255, 255, 0.3); }
.migas a { color: var(--zx-sobre-tinta); text-decoration: none; }
.migas a:hover { text-decoration: underline; color: #fff; }
.migas [aria-current="page"] { overflow: hidden; max-width: 40ch; text-overflow: ellipsis; white-space: nowrap; }

/* -------------------------------------------------------- ficha de área */
.area-ficha { padding: 3rem 0 1rem; }
.area-ficha__cuerpo { display: grid; gap: 2.5rem; align-items: start; }
.area-ficha__principal { min-width: 0; }
.bloque { margin-bottom: 2.75rem; }
.bloque__titulo { font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.25rem); margin-bottom: 1rem; }
.bloque__lead { max-width: var(--lectura); margin: 0; font-size: 1.125rem; line-height: 1.7; color: var(--zx-tinta-3); }
.lista-marcada { margin: 0; padding: 0; }
.lista-marcada li { position: relative; padding: 0.7rem 0 0.7rem 1.6rem; border-top: 1px solid var(--zx-filete); line-height: 1.55; }
.lista-marcada li:last-child { border-bottom: 1px solid var(--zx-filete); }
.lista-marcada li::before { content: ""; position: absolute; left: 0; top: 1.15rem; width: 9px; height: 9px; border-radius: 2px; background: var(--zx-tinta); transform: rotate(45deg); }
.lista-marcada--compacta li { padding: 0.55rem 0 0.55rem 1.35rem; font-size: 0.9375rem; }
.lista-marcada--compacta li::before { top: 1rem; width: 7px; height: 7px; }
.area-ficha__lateral { display: grid; gap: 1rem; }
.tarjeta-lateral { padding: 1.5rem 1.4rem; background: var(--zx-marfil); border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-l); }
.tarjeta-lateral__titulo { font-size: 1.3125rem; margin-bottom: 0.9rem; }
.tarjeta-lateral--cta { position: relative; overflow: hidden; isolation: isolate; background: var(--zx-tinta); border-color: var(--zx-tinta); color: var(--zx-sobre-tinta); }
.tarjeta-lateral--cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(300px 220px at 100% 0%, rgba(192, 12, 12, 0.45), transparent 65%); }
.tarjeta-lateral--cta p { color: var(--zx-sobre-tinta-gris); font-size: 0.9375rem; }
.tarjeta-lateral__tel { margin: 1rem 0 0; }
.tarjeta-lateral__tel a { font-family: var(--zx-display); font-weight: 700; font-size: 1.75rem; color: #fff; text-decoration: none; }
.tarjeta-lateral__tel a:hover { color: #ffb3ab; }
.relacionadas { padding: 1rem 0 2rem; }
.relacionadas .subtitulo { margin-top: 1rem; }
.area-ficha__nota { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding: 1.25rem 0 2.5rem; border-top: 1px solid var(--zx-filete); }
.faq { border-top: 1px solid var(--zx-filete); }
.faq__item { border-bottom: 1px solid var(--zx-filete); }
.faq__p { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 0; list-style: none; cursor: pointer; font-family: var(--zx-display); font-weight: 700; font-size: 1.1875rem; line-height: 1.25; transition: color 0.2s; }
html[lang^="zh"] .faq__p { font-family: var(--zx-cjk); }
.faq__p::-webkit-details-marker { display: none; }
.faq__p::marker { content: ""; }
.faq__p:hover { color: var(--zx-sello); }
.faq__signo { position: relative; flex: none; width: 2rem; height: 2rem; border-radius: 50%; border: 1px solid var(--zx-filete); transition: background-color 0.3s, border-color 0.3s, transform 0.4s var(--ease); }
.faq__signo::before, .faq__signo::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px; border-radius: 2px; background: currentColor; transition: transform 0.35s var(--ease); }
.faq__signo::after { transform: rotate(90deg); }
.faq__item[open] .faq__signo { background: var(--zx-tinta); border-color: var(--zx-tinta); color: #fff; transform: rotate(180deg); }
.faq__item[open] .faq__signo::after { transform: rotate(0deg); }
.faq__r { overflow: hidden; max-width: 44rem; padding: 0 0 1.25rem; color: var(--zx-gris); line-height: 1.65; }
.faq__r p { margin: 0; }
.faq__r.animando { transition: height 0.35s var(--ease); }

/* ------------------------------------------------------------- artículo */
.articulo { padding: 3rem 0 1rem; }
.articulo__aviso { max-width: var(--lectura); margin-bottom: 1.5rem; }
.prosa { max-width: var(--lectura); font-size: 1.0625rem; line-height: 1.75; }
.prosa > * + * { margin-top: 1.1rem; }
.prosa > :first-child { margin-top: 0; }
.prosa p { margin-bottom: 0; }
.prosa h2 { margin-top: 2.6rem; font-size: clamp(1.625rem, 1.3rem + 1vw, 2.125rem); line-height: 1.08; }
.prosa h3 { margin-top: 2rem; font-size: 1.375rem; }
.prosa h4 { margin-top: 1.6rem; font-size: 1.125rem; }
.prosa ul, .prosa ol { padding-left: 1.3rem; }
.prosa li + li { margin-top: 0.45rem; }
.prosa li::marker { color: var(--zx-sello); }
.prosa a { color: var(--zx-sello); }
.prosa a:hover { color: var(--zx-burdeos); }
.prosa strong, .prosa b { color: var(--zx-tinta); }
.prosa blockquote { margin: 1.75rem 0; padding: 0.25rem 0 0.25rem 1.25rem; border-left: 3px solid var(--zx-sello); color: var(--zx-tinta-3); font-size: 1.1875rem; }
.prosa figure { margin: 1.75rem 0; }
.prosa figcaption { margin-top: 0.5rem; font-size: 0.875rem; color: var(--zx-gris); }
.prosa table { font-size: 0.9375rem; }
.prosa th, .prosa td { padding: 0.65rem 0.9rem; border-top: 1px solid var(--zx-filete); text-align: left; vertical-align: top; }
.prosa thead th { background: var(--zx-marfil); }
.articulo__cuerpo > p:first-child { font-size: 1.1875rem; color: var(--zx-tinta-3); }
.articulo__pie { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; max-width: var(--lectura); margin-top: 2.75rem; padding-top: 1.5rem; border-top: 1px solid var(--zx-filete); }
.articulo__pie .nota { flex-basis: 100%; margin: 0; }
.cabeza--articulo .cabeza__titulo { max-width: 24ch; font-size: clamp(2.125rem, 1.3rem + 3.2vw, 4rem); }
.cabeza__lectura:empty { display: none; }

/* --------------------------------------------------------------- legal */
.legal { display: grid; gap: 2rem; padding: 3rem 0 4rem; }
.legal__lateral { display: grid; gap: 1.25rem; align-content: start; }
.indice { padding: 1.25rem 1.25rem 1rem; border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-l); background: var(--zx-niebla); }
.indice__titulo { margin: 0 0 0.6rem; font-family: var(--zx-display); font-weight: 700; font-size: 1.0625rem; }
.indice ol { margin: 0; padding: 0; display: grid; gap: 0.15rem; }
.indice a { display: block; padding: 0.3rem 0 0.3rem 0.75rem; border-left: 2px solid transparent; font-size: 0.875rem; line-height: 1.35; color: var(--zx-gris); text-decoration: none; transition: color 0.2s, border-color 0.2s; }
.indice a:hover, .indice a.es-actual { color: var(--zx-tinta); border-left-color: var(--zx-sello); }
.legal__otros { margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.legal__otros a { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; padding: 0.75rem 1rem; border: 1px solid var(--zx-filete); border-radius: var(--zx-radio); font-weight: 700; font-size: 0.9375rem; text-decoration: none; }
.legal__otros a:hover { border-color: var(--zx-tinta-4); }
.prosa--legal { max-width: 50rem; font-size: 1rem; line-height: 1.7; }
.prosa--legal h2 { font-size: 1.5rem; scroll-margin-top: calc(var(--cab) + 1.5rem); }
.prosa--legal .tabla-envoltorio table { min-width: 36rem; }
.prosa--legal .tabla-envoltorio th, .prosa--legal .tabla-envoltorio td { font-size: 0.875rem; line-height: 1.5; }
.prosa--legal .tabla-envoltorio thead th { background: var(--zx-tinta); color: #fff; }

/* ----------------------------------------------------------- banda CTA */
.banda-cta { position: relative; isolation: isolate; overflow: hidden; padding: 3.5rem 0; background: var(--zx-fondo-tinta); background-color: var(--zx-tinta); color: var(--zx-sobre-tinta); }
.banda-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--zx-rejilla); background-size: 56px 56px; -webkit-mask-image: radial-gradient(ellipse at 80% 50%, #000, transparent 70%); mask-image: radial-gradient(ellipse at 80% 50%, #000, transparent 70%); }
.banda-cta__interior { display: grid; gap: 1.5rem; align-items: center; }
.banda-cta__titulo { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.25rem); line-height: 1; }
html[lang^="zh"] .banda-cta__titulo { line-height: 1.25; }
.banda-cta__texto { margin: 0.8rem 0 0; color: var(--zx-sobre-tinta-gris); }
.banda-cta__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; }
.banda-cta__tel { display: inline-flex; align-items: center; gap: 0.5rem; color: #fff; text-decoration: none; font-family: var(--zx-display); font-weight: 700; font-size: 1.5rem; }
.banda-cta__tel:hover { color: #ffb3ab; }

/* ----------------------------------------------------------------- 404 */
.lista-enlaces { margin: 0 0 1.5rem; padding: 0; display: grid; gap: 0.5rem; }
.lista-enlaces a { display: flex; align-items: center; gap: 0.9rem; padding: 0.9rem 1rem; border: 1px solid var(--zx-filete); border-radius: var(--zx-radio); text-decoration: none; font-weight: 700; transition: border-color 0.2s, transform 0.3s var(--ease); }
.lista-enlaces a .icono { margin-left: auto; color: var(--zx-sello); }
.lista-enlaces a:hover { border-color: var(--zx-tinta-4); transform: translateX(4px); }
.lista-enlaces__n { font-family: var(--zx-display); color: var(--zx-gris-claro); }
.error404 { padding-bottom: 3rem; }
.error404 .subtitulo { margin-top: 0; }
.error-servidor { padding: 4rem 0; }

/* ----------------------------------------------------------------- pie */
.pie { position: relative; isolation: isolate; overflow: hidden; padding: 3.5rem 0 1.5rem; background: var(--zx-noche); color: var(--zx-sobre-tinta); }
.pie::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(700px 400px at 0% 0%, rgba(47, 93, 138, 0.28), transparent 60%), radial-gradient(600px 400px at 100% 100%, rgba(192, 12, 12, 0.2), transparent 60%); }
.pie a { color: var(--zx-sobre-tinta); text-decoration: none; }
.pie a:hover { color: #fff; text-decoration: underline; }
.pie a.boton:hover { text-decoration: none; }
.pie__lema { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem; padding-bottom: 2.5rem; margin-bottom: 2.5rem; border-bottom: 1px solid var(--zx-sobre-tinta-filete); }
.pie__frase { margin: 0; max-width: 18ch; font-family: var(--zx-display); font-weight: 700; font-size: clamp(2rem, 1.3rem + 2.8vw, 3.5rem); line-height: 0.98; letter-spacing: -0.015em; }
html[lang^="zh"] .pie__frase { max-width: none; font-family: var(--zx-cjk); line-height: 1.25; font-size: clamp(1.625rem, 1.1rem + 2vw, 2.5rem); }
.pie__columnas { display: grid; gap: 2rem; padding-bottom: 2.5rem; border-bottom: 1px solid var(--zx-sobre-tinta-filete); }
.pie__marca { max-width: 24rem; }
.pie__logo { width: 44px; height: 44px; margin-bottom: 1rem; border-radius: 9px; }
.pie__nombre { margin-bottom: 0.75rem; font-size: 1rem; line-height: 1.35; }
.pie__nombre strong { font-family: var(--zx-display); font-size: 1.375rem; }
.pie__nombre span { color: var(--zx-sobre-tinta-gris); }
.pie__texto { margin: 0; font-size: 0.9375rem; line-height: 1.6; color: var(--zx-sobre-tinta-gris); }
.pie__titulo { margin-bottom: 0.9rem; font-size: 0.8125rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--zx-sobre-tinta-gris); }
html[lang^="zh"] .pie__titulo { letter-spacing: 0.12em; }
.pie__titulo--sep { margin-top: 1.75rem; }
.pie__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; font-size: 0.9375rem; }
.pie__lista--datos { color: var(--zx-sobre-tinta-gris); }
.pie__cookies { padding: 0; border: 0; background: none; color: var(--zx-sobre-tinta); font-size: 0.9375rem; text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer; }
.pie__cookies:hover { color: #fff; }
.sin-js .pie__cookies { display: none; }
.pie__inferior { display: grid; gap: 0.75rem; padding-top: 1.5rem; font-size: 0.8125rem; color: var(--zx-sobre-tinta-gris); }
.pie__inferior p { margin: 0; }
.pie__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem; }
.volver-arriba { display: inline-flex; align-items: center; min-height: 2.25rem; padding: 0 0.9rem; border: 1px solid var(--zx-sobre-tinta-filete); border-radius: 999px; font-size: 0.8125rem; }
.pie .volver-arriba:hover { background: rgba(255, 255, 255, 0.08); text-decoration: none; }
.pie__gigante { position: absolute; right: -0.06em; bottom: -0.3em; z-index: -1; margin: 0; font-family: var(--zx-display); font-weight: 700; font-size: clamp(11rem, 32vw, 30rem); line-height: 1; color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, 0.07); pointer-events: none; user-select: none; }

/* ---------------------------------------------------- barra de llamada */
.barra-llamada { position: fixed; left: 0; right: 0; bottom: 0; z-index: 55; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; padding-bottom: env(safe-area-inset-bottom); background: var(--zx-filete); border-top: 1px solid var(--zx-filete); }
.barra-llamada a { display: flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 3.25rem; background: var(--zx-papel); color: var(--zx-texto); text-decoration: none; font-family: var(--zx-display); font-weight: 700; font-size: 1.0625rem; }
html[lang^="zh"] .barra-llamada a { font-family: var(--zx-cjk); }
.barra-llamada a.barra-llamada__p { background: var(--zx-sello); color: #fff; }
body { padding-bottom: calc(3.25rem + env(safe-area-inset-bottom)); }

/* -------------------------------------------------------------- cookies */
.cookies { position: fixed; left: 0.75rem; right: 0.75rem; bottom: calc(4rem + env(safe-area-inset-bottom)); z-index: 90; animation: zx-subir 0.5s var(--ease-salida) both; }
.cookies__cuerpo { display: grid; gap: 0.85rem; max-width: 60rem; margin: 0 auto; padding: 1rem 1.05rem; background: var(--zx-papel); border: 1px solid var(--zx-filete); border-radius: var(--zx-radio-l); box-shadow: var(--zx-sombra-alta); }
.cookies__titulo { display: flex; align-items: center; gap: 0.55rem; margin-bottom: 0.3rem; font-size: 1.125rem; }
.cookies__titulo .icono { color: var(--zx-sello); }
.cookies__texto { margin: 0; font-size: 0.875rem; line-height: 1.45; color: var(--zx-gris); }
.cookies__texto a { color: var(--zx-texto); }
.cookies__acciones { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.cookies__acciones .boton { width: 100%; min-height: 2.625rem; padding: 0 0.75rem; font-size: 1rem; }
.cookies__acciones [data-cookies="configurar"] { grid-column: 1 / -1; }
.modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 1rem; }
.modal__fondo { position: absolute; inset: 0; background: rgba(13, 16, 21, 0.6); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.modal__caja { position: relative; width: min(40rem, 100%); max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); overflow: auto; overscroll-behavior: contain; padding: 1.75rem 1.5rem 1.5rem; background: var(--zx-papel); border-radius: var(--zx-radio-xl); box-shadow: var(--zx-sombra-alta); animation: zx-subir 0.35s var(--ease-salida) both; }
.modal__caja h2 { font-size: 1.75rem; margin: 0 2.5rem 0.5rem 0; }
.modal__intro { font-size: 0.9375rem; color: var(--zx-gris); }
.modal__lista { list-style: none; margin: 1rem 0; padding: 0; border-top: 1px solid var(--zx-filete); }
.modal__cat { padding: 1rem 0; border-bottom: 1px solid var(--zx-filete); }
.modal__cat-texto { margin: 0.4rem 0 0 3.6rem; font-size: 0.875rem; line-height: 1.5; color: var(--zx-gris); }
.modal__siempre { margin-left: 0.4rem; font-weight: 400; font-size: 0.8125rem; color: var(--zx-jade); }
.modal__acciones { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.25rem; }
.modal__pie { margin: 1rem 0 0; font-size: 0.8125rem; color: var(--zx-gris); }
.modal__cerrar { position: absolute; right: 0.9rem; top: 0.9rem; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; padding: 0; border-radius: 50%; border: 1px solid var(--zx-filete); background: var(--zx-papel); color: var(--zx-tinta); }
.modal__cerrar .icono { width: 1.2rem; height: 1.2rem; }
.modal__cerrar:hover { background: var(--zx-marfil); }
.interruptor { display: flex; align-items: center; gap: 0.8rem; }
.interruptor label { font-weight: 700; cursor: pointer; }
.interruptor input { appearance: none; -webkit-appearance: none; position: relative; flex: none; width: 2.75rem; height: 1.6rem; margin: 0; border-radius: 999px; background: var(--zx-marfil-2); border: 1px solid var(--zx-filete); cursor: pointer; transition: background-color 0.25s, border-color 0.25s; }
.interruptor input::before { content: ""; position: absolute; left: 2px; top: 2px; width: calc(1.6rem - 6px); height: calc(1.6rem - 6px); border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(27, 32, 39, 0.35); transition: transform 0.25s var(--ease); }
.interruptor input:checked { background: var(--zx-sello); border-color: var(--zx-sello); }
.interruptor input:checked::before { transform: translateX(1.15rem); }
.interruptor input:disabled { background: var(--zx-jade); border-color: var(--zx-jade); cursor: not-allowed; opacity: 0.85; }
.interruptor input:focus-visible { outline: 3px solid var(--zx-tinta); outline-offset: 2px; }

/* ------------------------------------------------------------------ PWA */
.pwa-dialogo { box-sizing: border-box; width: min(28rem, calc(100vw - 2rem)); max-width: none; max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); margin: auto; padding: 0; overflow: auto; border: 1px solid var(--zx-sobre-tinta-filete); border-radius: var(--zx-radio-xl); background: var(--zx-fondo-tinta); background-color: var(--zx-tinta); color: var(--zx-sobre-tinta); box-shadow: 0 34px 90px -24px rgba(0, 0, 0, 0.85); }
.pwa-dialogo:not([open]) { display: none; }
.pwa-dialogo[open] { animation: zx-subir 0.3s var(--ease-salida); }
.pwa-dialogo::backdrop { background: rgba(13, 16, 21, 0.6); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.pwa-dialogo.pwa-sin-modal[open] { display: block; position: fixed; z-index: 1000; top: 50%; left: 50%; transform: translate(-50%, -50%); box-shadow: 0 0 0 100vmax rgba(13, 16, 21, 0.6); animation: none; }
.pwa-caja { position: relative; padding: 1.4rem 1.4rem 1.25rem; }
.pwa-caja::before { content: ""; position: absolute; left: 1.4rem; right: 1.4rem; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, var(--zx-sello), var(--zx-sello-brillo)); }
.pwa-cab { display: flex; align-items: center; gap: 0.9rem; }
.pwa-logo { flex: none; width: 52px; height: 52px; border-radius: 14px; box-shadow: 0 8px 24px -6px rgba(192, 12, 12, 0.5); }
.pwa-cab-txt { flex: 1; min-width: 0; }
.pwa-titulo { margin: 0; font-size: 1.375rem; line-height: 1.15; color: #fff; }
.pwa-sub { margin: 0.15rem 0 0; font-size: 0.8125rem; color: var(--zx-sobre-tinta-gris); }
.pwa-cerrar { flex: none; align-self: flex-start; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; margin: -0.35rem -0.5rem 0 0; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--zx-sobre-tinta-gris); }
.pwa-cerrar:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.pwa-dialogo svg { display: block; width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pwa-dialogo .pwa-relleno { fill: currentColor; stroke: none; }
.pwa-intro { margin: 1rem 0 0; font-size: 0.9375rem; color: var(--zx-sobre-tinta-gris); }
.pwa-pasos { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: 0.6rem; counter-reset: pwa; }
.pwa-pasos li { counter-increment: pwa; display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.75rem 0.85rem; border-radius: var(--zx-radio); border: 1px solid var(--zx-sobre-tinta-filete); background: rgba(255, 255, 255, 0.04); font-size: 0.9375rem; line-height: 1.55; }
.pwa-pasos li::before { content: counter(pwa); flex: none; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 6px; background: var(--zx-sello); color: #fff; font-family: var(--zx-display); font-weight: 700; font-size: 0.875rem; transform: rotate(-4deg); }
.pwa-pasos b { color: #fff; }
.pwa-chip { display: inline-grid; place-items: center; vertical-align: middle; width: 1.8rem; height: 1.55rem; margin: -0.2rem 0.15rem 0; border-radius: 6px; border: 1px solid rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.1); color: #fff; }
.pwa-chip svg { width: 1rem; height: 1rem; }
.pwa-nota { margin: 0.9rem 0 0; font-size: 0.8125rem; color: var(--zx-sobre-tinta-gris); }
.pwa-enlace { margin: 0.75rem 0 0; padding: 0.6rem 0.75rem; border-radius: var(--zx-radio-s); border: 1px dashed rgba(255, 255, 255, 0.25); background: rgba(0, 0, 0, 0.25); font-family: var(--zx-mono); font-size: 0.8125rem; word-break: break-all; user-select: all; }
.pwa-hecho { display: flex; align-items: flex-start; gap: 0.75rem; margin: 1.1rem 0 0; }
.pwa-hecho-ico { flex: none; display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: rgba(30, 122, 87, 0.3); color: #9ff0c4; }
.pwa-estado { margin: 0.75rem 0 0; font-size: 0.8125rem; color: #9ff0c4; }
.pwa-estado.pwa-mal { color: #ffb3ab; }
.pwa-estado:empty { margin: 0; }
.pwa-acciones { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.6rem; margin-top: 1.1rem; }
.pwa-boton { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 2.75rem; padding: 0 1.1rem; border-radius: var(--zx-radio); border: 1px solid rgba(255, 255, 255, 0.22); background: rgba(255, 255, 255, 0.06); color: #fff; font-weight: 700; font-size: 0.9375rem; }
.pwa-boton:hover { background: rgba(255, 255, 255, 0.12); }
.pwa-boton.pwa-principal { background: var(--zx-sello); border-color: var(--zx-sello); }
.pwa-boton.pwa-principal:hover { background: var(--zx-sello-hover); }
.pwa-dialogo :focus-visible { outline-color: #fff; }
.pwa-oculto { position: fixed; left: -9999px; top: 0; width: 1px; height: 1px; opacity: 0; }
.pwa-aviso { position: fixed; z-index: 1000; left: 50%; top: max(1rem, env(safe-area-inset-top)); display: flex; align-items: center; gap: 0.6rem; width: max-content; max-width: calc(100vw - 2rem); padding: 0.6rem 1rem 0.6rem 0.6rem; border-radius: var(--zx-radio-l); background: var(--zx-tinta); border: 1px solid var(--zx-sobre-tinta-filete); color: #fff; font-weight: 700; font-size: 0.9rem; box-shadow: var(--zx-sombra-alta); transform: translateX(-50%); transition: opacity 0.35s, transform 0.35s; }
.pwa-aviso.pwa-saliendo { opacity: 0; transform: translate(-50%, -12px); }
.pwa-aviso svg { width: 1.1rem; height: 1.1rem; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 37.5em) {
  .pwa-dialogo { width: 100%; max-width: 100%; margin: auto 0 0; border-width: 1px 0 0; border-radius: var(--zx-radio-xl) var(--zx-radio-xl) 0 0; }
  .pwa-dialogo.pwa-sin-modal[open] { top: auto; bottom: 0; left: 0; right: 0; transform: none; }
  .pwa-caja { padding-bottom: max(1.25rem, env(safe-area-inset-bottom)); }
  .pwa-acciones { flex-direction: column-reverse; align-items: stretch; }
}

/* ---------------------------------------------------- 40em (móvil grande) */
@media (min-width: 40em) {
  .cookies__cuerpo { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1.5rem; }
  .cookies__acciones { grid-template-columns: auto auto auto; }
  .cookies__acciones [data-cookies="configurar"] { grid-column: auto; }
  .valores { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .razones { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .clausula dl { grid-template-columns: 9rem minmax(0, 1fr); }
  .clausula dd { margin: 0 0 0.3rem; }
}

/* ------------------------------------------------------ 48em (tableta) */
@media (min-width: 48em) {
  :root { --lateral: 1.5rem; --cab: 4.25rem; }
  .seccion { padding: 5rem 0; }
  .hero__interior { grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); padding-top: calc(var(--cab) + 3rem); }
  .hero__texto { padding-bottom: 4rem; }
  .hero__figura { width: min(24rem, 100%); justify-self: end; }
  .hero__tarjeta--a { left: -2.5rem; }
  .hero__tarjeta--b { right: -1.5rem; }
  .cifras__rejilla { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cifra { border-top: 0; border-left: 1px solid var(--zx-filete); padding: 2.5rem 1.25rem; }
  .cifra::before { left: 1.25rem; top: 0; }
  .cifra:first-child { border-left: 0; padding-left: 0; }
  .cifra:first-child::before { left: 0; }
  .areas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
  .departamentos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .modelos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .entradas { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
  .entradas--listado { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .guias { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .oficina { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: 3rem; }
  .oficina__wechat { justify-items: end; text-align: right; }
  .contacto__formulario { padding: 2.25rem; }
  .formulario__fila { grid-template-columns: 1fr 1fr; }
  .area-ficha__cuerpo { grid-template-columns: minmax(0, 1fr) 19rem; gap: 3rem; }
  .area-ficha__lateral { position: sticky; top: calc(var(--cab) + 1.5rem); }
  .areas--mini { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .areas--mini .area__titulo { font-size: 1.375rem; }
  .areas--mini .area__texto { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .banda-cta__interior { grid-template-columns: minmax(0, 1fr) auto; gap: 3rem; }
  .pie__columnas { grid-template-columns: 1.3fr 1fr 1fr 1.1fr; gap: 2.5rem; }
  .pie__inferior { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1.5rem; }
  .barra-llamada { display: none; }
  body { padding-bottom: 0; }
  .subir { bottom: 1.25rem; right: 1.25rem; }
  .cookies { left: 1rem; right: 1rem; bottom: 1rem; }
  .cabeza { padding: calc(var(--cab) + 2.5rem) 0 4rem; }
  .legal { grid-template-columns: 17rem minmax(0, 1fr); gap: 3.5rem; }
  .legal__lateral { position: sticky; top: calc(var(--cab) + 1.5rem); max-height: calc(100vh - var(--cab) - 3rem); overflow: auto; }
  .modal__caja { padding: 2rem 2rem 1.75rem; }
}

/* ---------------------------------------------------- 68em (escritorio) */
@media (min-width: 68em) {
  :root { --lateral: 2rem; }
  .seccion { padding: 6.5rem 0; }
  .hamburguesa { display: none; }
  .sin-js .menu, .zx-js .menu, .menu {
    position: static; z-index: auto; display: flex; flex: 1; flex-direction: row; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 0; overflow: visible; background: none; visibility: visible; opacity: 1; transform: none; transition: none; order: 0; flex-basis: auto;
  }
  .zx-js .menu::before { display: none; }
  .sin-js .cabecera__interior { flex-wrap: nowrap; }
  .marca { margin-right: 0.5rem; }
  .menu__nav { margin: 0 auto; }
  .menu__lista, .sin-js .menu__lista, .zx-js .menu .menu__lista { display: flex; gap: 0.1rem; padding: 0; }
  .menu__n { display: none; }
  .menu__enlace, .zx-js .menu .menu__enlace { padding: 0.5rem 0.75rem; border: 0; font-family: var(--zx-ui); font-weight: 400; font-size: 0.9375rem; color: var(--zx-sobre-tinta-gris); }
  html[lang^="zh"] .zx-js .menu .menu__enlace { font-family: var(--zx-cjk); font-size: 0.9375rem; }
  .menu__enlace::after { content: ""; position: absolute; left: 0.75rem; right: 0.75rem; bottom: 0.2rem; height: 2px; border-radius: 2px; background: var(--zx-sello-brillo); transform: scaleX(0); transform-origin: 0 50%; transition: transform 0.35s var(--ease); }
  .menu__enlace:hover::after, .menu__enlace[aria-current="page"]::after, .menu__enlace.es-actual::after { transform: scaleX(1); }
  .zx-js .menu.abierto .menu__lista li { animation: none; }
  .menu__acciones, .zx-js .menu .menu__acciones { flex-wrap: nowrap; gap: 0.5rem; padding: 0; border: 0; }
  .enlace-instalar--menu { display: none !important; }
  .menu-abierto { overflow: auto; }
  .hero__interior { gap: 3rem; }
  /* A pantalla completa también en pantallas bajas: el titular y la figura se ajustan a la altura. */
  .hero__interior { padding-top: calc(var(--cab) + 2rem); }
  .hero__titulo { max-width: 15ch; font-size: min(clamp(3rem, 1.5rem + 6vw, 7.5rem), 12.5vh); }
  html[lang^="zh"] .hero__titulo { font-size: min(clamp(2.5rem, 1.2rem + 4.6vw, 5.5rem), 9vh); }
  .hero__entrada { max-width: 36rem; }
  .hero__texto { padding-bottom: 4.5rem; }
  .hero__figura { width: min(28rem, 100%, calc((100vh - var(--cab) - 3rem) * 0.62)); }
  .hero__scroll { display: block; }
  .despacho { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 4rem; align-items: start; }
  .despacho__texto { position: sticky; top: calc(var(--cab) + 2rem); }
  .valores .valor:nth-child(even) { transform: translateY(2.5rem); }
  .valores .valor:nth-child(even)[data-luz] { transform: translateY(2.5rem) perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry)); }
  .valores { padding-bottom: 2.5rem; }
  .metodo { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 4rem; align-items: start; }
  .metodo__cabecera { position: sticky; top: calc(var(--cab) + 2rem); }
  .areas--bento { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .areas--bento > :nth-child(1), .areas--bento > :nth-child(6) { grid-column: span 2; }
  .areas--bento > :nth-child(1) .area__texto, .areas--bento > :nth-child(6) .area__texto { max-width: 34rem; font-size: 1rem; }
  .areas--bento > :nth-child(1) .area__titulo, .areas--bento > :nth-child(6) .area__titulo { font-size: 2.25rem; }
  .departamentos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
  .razones { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
  .contacto { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 4rem; }
  .contacto__texto { position: sticky; top: calc(var(--cab) + 2rem); }
  .entradas--listado { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .area-ficha__cuerpo { grid-template-columns: minmax(0, 1fr) 22rem; gap: 4rem; }
}

/* ------------------------------------------- 80em (pantallas grandes) */
@media (min-width: 80em) {
  :root { --lateral: 2.5rem; }
  .hero__figura { width: min(31rem, 100%, calc((100vh - var(--cab) - 3rem) * 0.62)); }
  .hero__tarjeta--a { left: -3.5rem; }
}

/* Valores en la columna lateral y escalonado solo con movimiento. */
@media (min-width: 68em) and (prefers-reduced-motion: reduce) {
  .valores .valor:nth-child(even), .valores .valor:nth-child(even)[data-luz] { transform: none; }
  .valores { padding-bottom: 0; }
}

/* ------------------------------------------------- movimiento reducido */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; transition-delay: 0s !important; }
  .marquesina { overflow-x: auto; }
  .marquesina__pista { animation: none !important; }
  .hero__luz, .cabeza__luz, .hero__anillo, .hero__tarjeta, .hero__punto, .hero__rueda, .oficina__qr-marco::before { animation: none !important; }
  [data-luz] { transform: none !important; }
  .hero__rejilla::after, .hero__cursor { display: none; }
}

/* ------------------------------------------------------------ impresión */
@media print {
  .cabecera, .barra-llamada, .cookies, .modal, .subir, .progreso, .saltar, .marquesina, .hero__fondo, .hero__scroll, .pie__acciones, .contacto__formulario, .pwa-dialogo { display: none !important; }
  body { padding: 0; background: #fff; color: #000; }
  .hero, .cabeza, .seccion--tinta, .banda-cta, .pie, .tarjeta-lateral--cta, .area--tinta { background: #fff !important; color: #000 !important; }
  .hero *, .cabeza *, .seccion--tinta *, .pie * { color: #000 !important; -webkit-text-stroke: 0 !important; }
  .revelar { opacity: 1 !important; transform: none !important; }
  a { color: #000; }
  .prosa a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.8em; }
}
