/* zt-base.css — base invisible de las cinco landings (portafolio §6.1).
   No fija color, fuente, radio ni forma: solo lee tokens que define cada marca.css.
   Tokens del contrato: --fondo --fondo-alt --tinta --apoyo --filete --acento-grafico
   --acento-texto --foco --radio --dur-corta --dur-media --curva
   --fuente-titular --fuente-cuerpo --fuente-datos */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--fondo);
  color: var(--tinta);
  font-family: var(--fuente-cuerpo);
  font-size: 1.0625rem;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { font-family: var(--fuente-titular); margin: 0; text-wrap: balance; }
p, ul, ol, figure, table { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--acento-texto); text-underline-offset: .18em; }
button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; }
table { border-collapse: collapse; }
[hidden] { display: none !important; }

/* Cifras: siempre tabulares y con la letra de datos de la marca */
.zt-dato, .zt-cifra, td.zt-num, th.zt-num {
  font-family: var(--fuente-datos);
  font-variant-numeric: tabular-nums;
}

/* Foco visible (WCAG 2.4.11) */
:focus-visible {
  outline: 2px solid var(--foco);
  outline-offset: 2px;
}
:focus:not(:focus-visible) { outline: none; }

/* Salto al contenido y texto solo para lectores */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.zt-saltar {
  position: absolute; left: 8px; top: -48px; z-index: 100;
  padding: 10px 16px; background: var(--tinta); color: var(--fondo);
  border-radius: var(--radio); transition: top var(--dur-corta) var(--curva);
}
.zt-saltar:focus { top: 8px; }

/* Objetivo de toque mínimo (2.5.8) y CTA cómodo en móvil */
button, [role="tab"], .zt-cta, a.zt-cta { min-height: 24px; min-width: 24px; }
@media (max-width: 720px) { .zt-cta, a.zt-cta { min-height: 44px; } }

/* Aviso de consentimiento: franja inferior, nunca modal, nunca tapa el CTA */
/* Toma los colores de la PÁGINA, no los de las hojas: en una marca oscura el
   texto es claro, y con fondo claro quedaría invisible. */
.zt-consent {
  position: fixed; inset: auto 0 0 0; z-index: 90;
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  max-height: 80px; padding: 12px 16px;
  background: var(--fondo); color: var(--tinta);
  border-top: 1px solid var(--filete);
  font-size: .875rem; line-height: 1.4;
}
.zt-consent p, .zt-consent__txt { flex: 1 1 260px; font-size: .9375rem; }
.zt-consent__txt a { color: var(--acento-texto); }
.zt-consent__acts { display: flex; gap: var(--e2, 8px); margin-left: auto; }
.zt-consent__no, .zt-consent__ok {
  min-height: 36px; padding-inline: 16px; border-radius: var(--radio);
  font-size: .9375rem; cursor: pointer;
}
.zt-consent__no { background: transparent; color: var(--tinta); border: 1px solid var(--borde-control, var(--apoyo)); }
.zt-consent__ok { background: var(--tinta); color: var(--fondo); border: 1px solid var(--tinta); font-weight: 600; }
/* La franja entra desde abajo; si el tracker aún no la marca, igual se ve */
.zt-consent { transform: translateY(100%); transition: transform var(--dur-corta) var(--curva); }
.zt-consent.is-in, .zt-consent:not([style*="translate"]) { transform: none; }
@media (max-width: 720px) {
  /* Nunca tapa el CTA: franja baja, dos líneas de texto como máximo */
  .zt-consent { max-height: 128px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); gap: 8px; }
  .zt-consent__txt { flex: 1 1 100%; font-size: .8125rem; max-height: 3.2em; overflow: hidden; }
  .zt-consent__acts { margin-left: 0; width: 100%; }
  .zt-consent__no, .zt-consent__ok { flex: 1; min-height: 40px; }
}

/* Formulario: mensajes de error en texto, nunca solo color */
.zt-campo { display: grid; gap: 6px; }
.zt-error { color: var(--acento-texto); font-size: .9375rem; }
.zt-campo [aria-invalid="true"] { outline: 2px solid var(--acento-texto); outline-offset: 1px; }

/* Preguntas: <details> con la piel de cada marca */
.zt-faq details { border-bottom: 1px solid var(--filete); }
.zt-faq summary { cursor: pointer; padding: 18px 0; list-style: none; font-weight: 600; }
.zt-faq summary::-webkit-details-marker { display: none; }
.zt-faq details > :not(summary) { padding-bottom: 18px; }

/* Maquetas: decorativas para el lector de pantalla, con equivalente en texto */
[data-maqueta] { user-select: none; }

/* Movimiento reducido: nada en curso y cada firma en su estado final (§6.6) */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
  [data-firma] { --zt-progreso: 1; }
  [data-firma] [data-paso] { opacity: 1 !important; transform: none !important; }
}