/* waitlist_captcha.css — encaje del widget Turnstile en la landing (B34).
 *
 * Problema (visto en iPhone real a 390px, después medido con Playwright
 * sobre la caja real): el widget `normal` de Turnstile mide 300px FIJOS.
 * La caja del formulario tiene 26px de padding a cada lado, así que el
 * interior útil se queda corto en móvil y el widget se salía por la
 * derecha, cortando el logo.
 *
 *   viewport   interior útil   widget normal (300px)
 *     430px        299px        cabía justo
 *     390px        261px        desbordaba 27px   ← el iPhone del reporte
 *     360px        232px        desbordaba 56px
 *     320px        194px        desbordaba 94px + scroll horizontal
 *
 * LA SOLUCIÓN ES NATIVA (`data-size="compact"` en el HTML), no CSS.
 * Aquí solo se coloca el contenedor. Dos decisiones que conviene no
 * deshacer sin volver a medir:
 *
 *  · NO se usa `transform: scale()`. Degrada la nitidez del texto y
 *    desalinea el área pulsable respecto a lo que se ve, con lo que el
 *    usuario acaba pulsando al lado de la casilla.
 *
 *  · NO se usa `data-size="flexible"`. Suena a la respuesta obvia —se
 *    adapta al contenedor— pero tiene un MÍNIMO de 300px, así que en
 *    móvil desborda exactamente igual que `normal`. Se midió: mismos
 *    27px a 390px.
 *
 * En hoja aparte y no inline porque el gate de diseño mide `style_inline`
 * con un baseline que solo puede BAJAR (trinquete de b29).
 */

/* El formulario es un flex con wrap. `flex-basis: 100%` le da al widget su
 * propia fila, en lugar de dejarlo competir por el hueco que quede al lado
 * del campo de email (que a 390px es prácticamente ninguno).
 */
.waitlist-captcha {
    flex-basis: 100%;
    /* Cinturón y tirantes: si Cloudflare cambiara el tamaño de `compact`,
     * el contenedor sigue sin poder empujar el layout hacia fuera. */
    max-width: 100%;
    /* Respiro coherente con el `gap: 8px` del formulario: el widget es un
     * bloque alto (140px en compact) y pegado al botón queda apelmazado. */
    margin: 4px 0;
}

/* Alineación con el resto de la caja: el formulario hereda `text-align:
 * left` de .waitlist-box, y el widget debe arrancar en el mismo eje
 * vertical que el campo de email y el texto de los consentimientos.
 * Turnstile inyecta su iframe como hijo directo del contenedor.
 */
.waitlist-captcha > * {
    margin-left: 0;
    margin-right: auto;
}