/* Lista de espera de la beta: la única llamada a la acción de districtverse.io (el hotel no se enlaza desde aquí).
   Solo colores que ya usan site.css y brand-tokens.css. La banda ocupa el sitio y el fondo del antiguo
   selector de avatar (.chooser). */
.lista{background:#eaeef5;padding:74px max(6%,calc((100vw - 1248px)/2));display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;scroll-margin-top:20px}
.lista-copy .eyebrow{color:var(--dv-text-secondary);margin-bottom:18px}
.lista-copy h2{font-size:clamp(34px,3.6vw,52px)}
.lista-copy>p{font-size:17px;color:var(--dv-text-secondary);margin-top:20px;max-width:520px}
.lista-premios{list-style:none;padding:0;margin:26px 0 18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lista-premios li{border-radius:18px;padding:18px 20px}
.lista-premios strong{display:block;font-size:17px;letter-spacing:-.03em;line-height:1.25}
.lista-premios span{display:block;font-size:13px;line-height:1.5;color:#384351;margin-top:8px}
.lista-copy .fine{max-width:520px}
.lista-form{position:relative;background:var(--dv-white);border:1px solid var(--dv-border);border-radius:26px;padding:32px 32px 18px;display:flex;flex-direction:column;gap:16px}
.lista-label{font-size:13px;font-weight:650}
/* 16 px de letra: con menos, Safari de iOS amplía la página al enfocar el campo.
   Borde #747b87 (ya está en site.css): 4,26:1 sobre la tarjeta blanca y 3,98:1 sobre el papel del campo. El #bbc4d0
   de la v3 daba 1,76:1, por debajo del 3:1 que WCAG 1.4.11 pide al contorno de un control. En error, borde de tinta
   (el rosado #e4b3a3 daba 1,68:1); el error ya lo dicen el fondo, el mensaje y aria-invalid. */
.lista-form input[type=email]{min-width:0;min-height:52px;border:1px solid #747b87;border-radius:var(--dv-radius-control);padding:14px;background:var(--dv-paper);color:var(--dv-ink);font-size:16px;margin-top:-6px}
.lista-form input[aria-invalid=true]{border-color:var(--dv-ink);background:#fff0eb}
.lista-consent{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;font-size:12px;line-height:1.55;color:var(--dv-text-secondary);cursor:pointer}
.lista-consent input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--dv-ink)}
.lista-consent strong{color:var(--dv-ink);font-weight:650}
.lista-consent a{color:var(--dv-link);text-decoration:underline;text-underline-offset:3px}
.lista-form .primary{width:100%;margin-top:4px}
.lista-form .primary:disabled{background:#263653}
/* Siempre ocupa su línea: así el formulario no salta al aparecer «Enviando…» o el error. Por eso el formulario
   lleva menos relleno abajo: esa línea vacía ya hace de margen. */
.lista-estado{min-height:22px;font-size:14px;line-height:1.5;margin:0}
.lista-estado[data-tipo=enviando]{color:var(--dv-text-secondary)}
.lista-estado[data-tipo=error]{background:#fff0eb;border:1px solid #e4b3a3;border-radius:14px;padding:12px 16px}
.lista-estado[data-tipo=ok]{background:#c7efdc;color:#185537;border-radius:14px;padding:14px 18px;font-size:17px;font-weight:650}
.lista-hecha input[type=email],.lista-hecha .lista-consent{opacity:.55}
/* Trampa para bots: fuera de la pantalla (no display:none, que algunos bots detectan) y sin foco. */
.lista-trampa{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
/* La línea de condiciones es más larga que «Primero exploras…», a la que sustituye: mismo ancho que la entradilla. */
.hero-fine{max-width:470px}
/* Las tarjetas de premios en el hero, encima del botón: la oferta se ve sin bajar. Mismas tarjetas que en #lista,
   con la letra de la entradilla; el texto va en tinta porque el hero pone todo en blanco. */
.hero-premios{margin:26px 0 0;max-width:470px}
.hero-premios li{color:var(--dv-ink);padding:14px 16px}
.hero-premios+.hero-actions{margin-top:20px}
/* El pie de la portada cae sobre el suelo claro de la ilustración (medido en el móvil: ~1,3:1). Con fondo de tinta
   queda ≥9:1 a cualquier ancho. */
.hero-art figcaption{background:rgba(17,24,39,.85);color:#e1e6ef;padding:4px 8px;border-radius:8px}
.closing-band .primary{margin-top:28px}
.app-footer nav a[lang]{text-decoration:underline;text-underline-offset:3px}
/* Enlaces del aviso de privacidad (.scope-grid): el mismo estilo que site.css da a los de las FAQ y las notas. */
.scope-grid p a{color:var(--dv-link);text-decoration:underline;text-underline-offset:3px}
@media(max-width:1050px){.lista{grid-template-columns:1fr;gap:32px}}
@media(max-width:700px){.lista{padding:52px 6%}.lista-copy h2{font-size:36px}.lista-copy>p{font-size:15px}.lista-premios{grid-template-columns:1fr}.lista-form{padding:24px 20px 12px;border-radius:22px}.closing-band .primary{width:100%}.hero-premios{margin-top:22px}.hero-premios strong{font-size:16px}.hero-art figcaption{font-size:11px}}
/* En el móvil «Apúntate a la beta» no cabe junto a la marca y el idioma: queda «Apúntate ↓». */
@media(max-width:430px){.cta-largo{display:none}}