/* Hoja propia de la encuesta.
   Casi vacía a propósito: la vista, los paneles, los pasos, las preguntas, la validación y los estados los
   resuelven Trinity, Steps y QuestorForm (ver README.md). Aquí solo va lo que el sistema no define en una
   página SIN cascarón: el margen de página, el logotipo y la trampa para bots. Colores y medidas, de tokens. */

/* La encuesta es pública y no lleva cascarón (no hay navegación ni sesión): el margen que en el tablero da
   `.container__Main` aquí lo da esta envoltura, con el mismo token. Declarado en el README (PREC-A). */
.sui-pagina {
    box-sizing: border-box;
    min-height: 100dvh;
    padding: var(--upaep-trinity-gutter, 1.5rem);
}
@media (width <= 640px) {
    .sui-pagina { padding: var(--upaep-trinity-gutter-sm, 1rem); }
}

/* la cabecera de la vista es columna con `align-items: stretch`: el logo pide su propio ancho */
.sui-logo { display: block; align-self: flex-start; height: 2.5rem; width: auto; }

/* El formulario apila barra de pasos, paso y navegación con el mismo aire que los paneles de la vista */
.sui-form { display: flex; flex-direction: column; gap: var(--upaep-trinity-view-gap, 1rem); min-width: 0; }
.sui-form[hidden] { display: none; }
.sui-preguntas { min-width: 0; }
.sui-arranque { margin-top: var(--upaep-trinity-sp-4, 1rem); }

/* Trampa para bots: fuera de la pantalla y fuera del lector (aria-hidden en el marcado) */
.sui-trampa { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }