/* ==========================================================================
   02 · Entrada — «El Umbral» (1.11.8; 1.11.12: más visible sobre la fachada clara). Indicio de descubrimiento: una traza de luz,
   un punto que baja y un chevron. Reutiliza el elemento .scene__cue de la escena (antes «Desliza», fijo y solo en escritorio);
   nada de lo que dibuja o desplaza Entrada se toca. Oculto por defecto: entrada-cue.js lo muestra tras 3 s de inactividad (máx. 3
   veces) y lo retira al primer desplazamiento. Sin JavaScript no se ve. Posición absoluta y sin eventos: no mueve nada.
   1.11.12 · solo visibilidad y contraste (mismo comportamiento): texto marfil al 90 %, más grande; traza de 2 px y punto de 5 px más
   luminosos; un humo oscuro y difuso detrás (degradado radial sin borde, sin tarjeta). Medido sobre los cuadros reales de Entrada:
   mediana de contraste del texto ≈ 7:1 sobre el cuadro más claro (antes ≈ 3:1) y ≥ 4,5:1 en el 90 % de los píxeles.
   ========================================================================== */

.scene__cue.scene__cue--umbral {
	--umb-h: 40px;           /* alto de la traza */
	display: flex;
	z-index: 4;
	gap: 8px;
	bottom: calc(14px + var(--safe-bottom));
	color: #fffaf2;          /* marfil; la opacidad visible (90 %) la da .is-on */
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 160ms linear, visibility 0s linear 160ms;   /* retirada inmediata (desplazamiento o actividad) */
}
.scene__cue--umbral.is-soft { transition: opacity 700ms var(--ease-standard), visibility 0s linear 700ms; }   /* fin de un aviso */
.scene__cue--umbral.is-on { opacity: 0.9; visibility: visible; transition: opacity 700ms var(--ease-standard), visibility 0s; }
html:not(.js) .scene__cue--umbral { display: none; }
/* Humo de cristal ahumado: un degradado radial oscuro y difuso (sin borde, sin forma de tarjeta, sin desenfoque en vivo) detrás del texto y la
   traza, para que el marfil se lea sobre la piedra clara del umbral. Meseta ≈ 0,5 y se desvanece por completo hacia el borde. */
.scene__cue--umbral::before {
	content: "";
	position: absolute;
	z-index: -1;
	left: 50%;
	top: 50%;
	width: min(520px, 100vw);
	height: 270px;
	translate: -50% -50%;
	background: radial-gradient(closest-side, rgba(8, 7, 7, 0.56) 0, rgba(8, 7, 7, 0.5) 50%, rgba(8, 7, 7, 0.24) 78%, rgba(8, 7, 7, 0) 100%);
	pointer-events: none;
}

.umbral__txt {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	padding-left: 0.26em;   /* compensa el espaciado final de las letras: el texto queda centrado sobre la traza */
	font-size: 0.78125rem;
	font-weight: 500;
	letter-spacing: 0.26em;
	text-transform: uppercase;
	white-space: nowrap;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75), 0 0 10px rgba(0, 0, 0, 0.7), 0 0 22px rgba(0, 0, 0, 0.5);
}
/* «Desliza» es la instrucción (la palabra que se lee primero); «Continúa la experiencia» la acompaña. */
.umbral__do { font-size: 0.9375rem; font-weight: 600; letter-spacing: 0.36em; padding-left: 0.36em; }
.umbral__sub { font-size: 0.78125rem; font-weight: 500; }
.umbral__trace {
	position: relative;
	display: block;
	width: 2px;
	height: var(--umb-h);
	border-radius: 1px;
	background: linear-gradient(to bottom, rgba(255, 250, 242, 0), rgba(255, 250, 242, 0.95) 34%, rgba(255, 250, 242, 0.7));
	box-shadow: 0 0 6px rgba(255, 250, 242, 0.35);
	filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.65));
}
.umbral__spark {
	position: absolute;
	left: 50%;
	top: 0;
	width: 5px;
	height: 5px;
	margin-left: -2.5px;
	border-radius: 50%;
	background: #fffdf8;
	box-shadow: 0 0 6px 2px rgba(255, 250, 242, 0.95), 0 0 16px 5px rgba(255, 244, 232, 0.4), 0 0 24px 8px rgba(215, 14, 22, 0.26);   /* marfil con un matiz rojo apenas perceptible */
	opacity: 0;
}
.umbral__chev {
	display: block;
	width: 18px;
	height: 9px;
	margin-top: -3px;
	fill: none;
	stroke: rgba(255, 250, 242, 0.95);
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
	filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.7));
}

/* El punto baja por la traza y se apaga al llegar al chevron, que se enciende un instante. Sin rebote. */
.scene__cue--umbral.is-run .umbral__spark { animation: umbral-travel 2000ms cubic-bezier(0.45, 0, 0.25, 1) 300ms both; }
.scene__cue--umbral.is-run .umbral__chev { animation: umbral-chev 2000ms linear 300ms both; }
@keyframes umbral-travel {
	0% { transform: translateY(0); opacity: 0; }
	16% { opacity: 1; }
	84% { opacity: 1; }
	100% { transform: translateY(calc(var(--umb-h) - 5px)); opacity: 0; }
}
@keyframes umbral-chev {
	0%, 70% { opacity: 0.7; filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.7)); }
	92% { opacity: 1; filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.7)) drop-shadow(0 0 6px rgba(255, 250, 242, 0.7)) drop-shadow(0 0 9px rgba(215, 14, 22, 0.3)); }
	100% { opacity: 0.9; filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.7)); }
}

/* Móvil: sobre la cápsula inferior (12 px + zona segura + ≈ 66 px de cápsula), con holgura. Antes el indicio no existía aquí. */
@media (max-width: 860px) {
	.scene__cue.scene__cue--umbral { --umb-h: 38px; display: flex; bottom: calc(96px + var(--safe-bottom)); gap: 7px; }
	.scene__cue--umbral::before { width: min(440px, 100vw); height: 230px; }
	.umbral__txt { font-size: 0.75rem; gap: 6px; }
	.umbral__do { font-size: 0.875rem; }
	.umbral__sub { font-size: 0.75rem; }
	html:not(.js) .scene__cue--umbral { display: none; }
}
@media (max-width: 860px) and (max-height: 520px) {
	.scene__cue.scene__cue--umbral { --umb-h: 34px; bottom: calc(84px + var(--safe-bottom)); }
}

/* Movimiento reducido: indicación estática (el punto reposa al final de la traza), sin fundidos ni repeticiones. */
@media (prefers-reduced-motion: reduce) {
	.scene__cue--umbral, .scene__cue--umbral.is-soft, .scene__cue--umbral.is-on { transition: none; }
	.scene__cue--umbral .umbral__spark, .scene__cue--umbral.is-run .umbral__spark { animation: none; opacity: 0.95; transform: translateY(calc(var(--umb-h) - 5px)); }
	.scene__cue--umbral.is-run .umbral__chev { animation: none; }
}
.glo-rm .scene__cue--umbral, .glo-rm .scene__cue--umbral.is-soft, .glo-rm .scene__cue--umbral.is-on { transition: none; }
.glo-rm .scene__cue--umbral .umbral__spark, .glo-rm .scene__cue--umbral.is-run .umbral__spark { animation: none; opacity: 0.95; transform: translateY(calc(var(--umb-h) - 5px)); }
.glo-rm .scene__cue--umbral.is-run .umbral__chev { animation: none; }