/* Atalaya · Landing en el espacio: fondo 3D, piezas flotantes y titulares con volumen */
#lpSpace { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; opacity: 0; transition: opacity 1.2s ease-out; }
body.space3d #lpSpace { opacity: 1; }
body.space3d #sky { opacity: 0; transition: opacity 1.2s; }

/* Piezas flotantes: el movimiento lo pone space.js fotograma a fotograma (sin transición que lo frene) */
.f3d { will-change: transform; transform-style: preserve-3d; backface-visibility: hidden; }
.f3d.tilt { transition: box-shadow 0.3s, border-color 0.3s; }
.lp-card.f3d, .plan.f3d, .lp-steps > li.f3d, .lp-mod.f3d, .faq > details.f3d, .lp-compare.f3d, .lp-stats.f3d, .lp-final.f3d { box-shadow: 0 34px 70px -34px rgba(0, 0, 0, 0.95), 0 0 0 1px rgba(255, 255, 255, 0.025) inset; }
.f3d.lifted { box-shadow: 0 60px 110px -40px rgba(0, 0, 0, 0.95), 0 0 0 1px var(--line-strong), 0 0 60px -20px rgba(201, 242, 77, 0.35); border-color: var(--line-strong); }
/* Brillo que sigue al cursor dentro de la pieza elevada */
.f3d:not(.tilt)::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity 0.3s; background: radial-gradient(380px circle at var(--mx, 50%) var(--my, 50%), rgba(245, 243, 238, 0.11), transparent 45%); }
.f3d.lifted:not(.tilt)::after { opacity: 1; }
.lp-mod.f3d, .faq > details.f3d, .lp-steps > li.f3d, .lp-stats.f3d { position: relative; }
/* Lo que va dentro de cada pieza sobresale un poco: también tiene profundidad */
.f3d h3, .f3d .lp-tag, .f3d .lp-num, .plan.f3d .price, .lp-stats.f3d b { transform: translateZ(26px); }
.f3d .lp-mini, .f3d .btn, .lp-mod.f3d .lp-kpi { transform: translateZ(40px); }
.lp-steps > li.f3d::before { transform: translateZ(34px); display: block; }

/* Titulares con volumen: cada palabra en su plano, con canto dorado y sombra proyectada */
.t3d { transform-style: preserve-3d; will-change: transform; }
.w3d { display: inline-block; transform-style: preserve-3d; text-shadow: 0 2px 0 rgba(100, 102, 106, 0.45), 0 3px 0 rgba(71, 73, 77, 0.4), 0 4px 0 rgba(46, 48, 52, 0.35), 0 5px 0 rgba(45, 35, 18, 0.3), 0 16px 28px rgba(0, 0, 0, 0.7); animation: wFloat 7s ease-in-out infinite; animation-delay: calc(var(--i, 0) * -0.85s); }
@keyframes wFloat { 0%, 100% { transform: translate3d(0, 0, 0); } 50% { transform: translate3d(0, -5px, 24px); } }
.lp-h2 em .w3d { text-shadow: none; }
/* La palabra con degradado de la portada lleva el canto como sombra del propio dibujo */
.lp-h1 em .w3d { color: transparent; -webkit-text-stroke: inherit; text-shadow: none; }
.lp-h1 em { animation: none; }
.lp-h1 em .w3d { color: transparent; -webkit-text-stroke: inherit; text-shadow: none; }

@media (prefers-reduced-motion: reduce) { .w3d { animation: none; } #lpSpace { display: none; } }
/* En el móvil el texto ocupa todo el ancho: el universo se atenúa para que se lea bien */
@media (max-width: 760px) { body.space3d #lpSpace { opacity: 0.55; } }
