@view-transition{navigation:auto}
::view-transition-group(*){animation-duration:.72s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
::view-transition-old(root),::view-transition-new(root){animation-duration:.25s}
.w-negative{mix-blend-mode:normal;z-index:4}
.w-negative-plane{background:transparent;overflow:hidden}
.window-image{position:absolute;inset:0;background-size:155%;background-repeat:no-repeat;opacity:0;transition:opacity .55s ease;will-change:opacity}
.window-image.active{opacity:1}
.contact-invite{display:flex;align-items:center;justify-content:flex-end;gap:28px;padding:26px 0 48px}
.contact-w{width:80px;height:80px;display:grid;place-items:center;transition:transform .65s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.contact-w img{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1)}
.contact-invite:has(.contact-cta:hover) .contact-w,.contact-invite:focus-within .contact-w,.contact-invite.is-touched .contact-w{transform:translateX(20px) rotate(-12deg) scale(.88)}
.contact-cta{display:inline-flex;align-items:center;gap:35px;padding:20px 28px;border:1px solid currentColor;border-radius:99px;font-size:clamp(15px,1.4vw,20px);transition:background .25s,color .25s}
.contact-cta:hover,.contact-cta:focus-visible{background:white;color:#0051ff}.theme-dark .contact-w img{filter:none}.theme-dark .contact-cta:hover{background:#0051ff;color:white}
.case-opening{position:relative;min-height:340px;height:min(72svh,760px);margin:18px 0 24px;border-radius:10px;overflow:hidden;background:#123479}
.case-cover{width:100%;height:100%;object-fit:cover;display:block}
.case-caption{position:absolute;inset:auto 0 0;padding:40px 24px 22px;background:linear-gradient(transparent,#001b4bce);display:flex;justify-content:space-between;gap:16px;color:white;font-size:14px}.case-caption>span:last-child{font-size:11px;letter-spacing:.08em}
.case-play{margin:24px 0 64px;border:1px solid #ffffff50;border-radius:12px;overflow:hidden;background:#ffffff0a}
.case-play:empty{display:none}.play-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 24px;border-bottom:1px solid #ffffff30}.play-head h2{margin:0;font-size:clamp(22px,3vw,32px);font-weight:500}.play-head p{font-size:12px;max-width:35ch;margin:0;opacity:.8;line-height:1.6}
.play-stage{position:relative;min-height:320px;display:grid;place-items:center;overflow:hidden;padding:40px;background:radial-gradient(ellipse at 50% 80%,#ffffff17,transparent 65%)}
.play-controls{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px;padding:18px 24px;border-top:1px solid #ffffff30;font-size:14px}.play-controls button,.play-controls select{font:inherit;border:1px solid #ffffff65;color:inherit;background:transparent;padding:10px 18px;border-radius:99px;cursor:pointer}.play-controls button[aria-pressed=true]{background:white;color:#0051ff}.play-controls button:hover{background:#ffffff24}.play-controls button:focus-visible,.play-controls input:focus-visible{outline:3px solid #fff;outline-offset:5px}.play-controls input{accent-color:white;width:min(240px,45vw)}
.play-note{font-size:12px;text-align:center;margin:0;padding:0 24px 20px;opacity:.8}
.case-play .play-stage img{max-width:100%;display:block}.play-output{position:absolute;bottom:18px;left:24px;right:24px;font-size:14px;text-align:center}
/* Identity applications. */
.identity-object{width:280px;height:170px;display:grid;place-items:center;background:white;border-radius:12px;box-shadow:0 25px 40px #001e6845;transition:width .6s,height .6s,transform .6s,border-radius .6s;transform:rotate(-6deg)}.identity-object img{width:64%;height:70%;object-fit:contain}.identity-object[data-mode=logo]{background:transparent;box-shadow:none;transform:none}.identity-object[data-mode=screen]{width:180px;height:255px;border:9px solid #152440;border-radius:28px;transform:rotate(7deg)}
/* Classroom plan becomes a small spatial model. */
.classroom{width:min(420px,78vw);height:225px;border:1px solid white;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:35px;background:#ffffff0d;transform:perspective(650px) rotateX(48deg) rotateZ(-25deg);transition:transform .9s cubic-bezier(.22,1,.36,1)}.classroom.front{transform:perspective(650px) rotateX(0) rotateZ(0)}.classroom i{background:#fff;border-radius:3px;box-shadow:0 8px 0 #96bbff,0 14px 10px #00133a55;position:relative}.classroom i:after{content:'';position:absolute;width:60%;height:4px;background:#0051ff;top:4px;left:20%}
.lighting-stage{padding:0;height:360px;background:#061022}.lighting-stage img{width:100%;height:100%;object-fit:cover;filter:brightness(var(--light,.85)) saturate(1.15);transition:filter .12s}.lighting-stage:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 100px #00163899;pointer-events:none}
.phone-demo{width:220px;min-height:290px;border:7px solid #101c34;border-radius:27px;background:white;color:#0051ff;padding:24px 18px;box-shadow:0 20px 35px #001a5545;transition:transform .35s}.phone-demo small{letter-spacing:.12em;font-size:10px}.phone-demo h3{font-size:28px;margin:18px 0}.phone-demo .ui-tile{background:#edf2ff;border-radius:12px;padding:14px;margin-top:10px;font-size:13px}.phone-demo .ui-tile span{display:block;font-size:10px;opacity:.6;margin-top:5px}
.nfc-demo{position:relative;width:170px;height:170px;border-radius:50%;background:white;color:#0051ff;display:grid;place-items:center;box-shadow:0 15px 40px #00144745;font-size:26px;font-weight:500}.nfc-demo:after,.nfc-demo:before{content:'';position:absolute;inset:-20px;border:1px solid #ffffff60;border-radius:50%;opacity:0}.nfc-demo.connected:after{animation:nfc-wave 1.5s ease-out 2}.nfc-demo.connected:before{animation:nfc-wave 1.5s .3s ease-out 2}@keyframes nfc-wave{0%{transform:scale(.8);opacity:.8}100%{transform:scale(1.45);opacity:0}}
.nfc-result{display:flex;gap:12px;margin-top:24px;justify-content:center;min-height:40px}.nfc-result span{padding:10px 18px;border:1px solid #ffffff60;border-radius:99px;font-size:14px}
.research-step{max-width:540px;text-align:center}.research-step .research-num{display:block;font:500 70px 'Mozilla Headline',sans-serif;opacity:.3}.research-step h3{font-size:28px;margin:8px 0 16px}.research-step p{font-size:16px;line-height:1.6;margin:0}.research-step.is-changing{animation:case-in .45s ease both}@keyframes case-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
/* Línea O runs alongside the image sequence. */
body[data-project=linea-o] main{position:relative;padding-left:24px}.line-route{position:absolute;left:0;top:0;bottom:0;width:3px;background:#ffffff18;pointer-events:none;overflow:hidden}.line-route:before{content:'';display:block;width:100%;height:100%;background:#ff78c1;transform:scaleY(var(--route-progress,0));transform-origin:top}.line-station{position:relative;padding:18px 0 18px 12px;margin:0;font-size:13px;letter-spacing:.14em}.line-station:before{content:'';position:absolute;left:-29px;top:calc(50% - 6px);width:12px;height:12px;border-radius:50%;background:#ff78c1;box-shadow:0 0 0 5px #0051ff}.linea-pulse{width:120px;height:120px;border:2px solid #ff78c1;display:grid;place-items:center;transform:rotate(-8deg);font:500 60px 'Mozilla Headline';color:#ff78c1}
.holder-stage{padding:0;height:360px;touch-action:pan-y}.holder-stage canvas{width:100%;height:100%;display:block}.holder-fallback{width:100%;height:100%;object-fit:contain}.holder-stage.ready .holder-fallback{display:none}
.theme-dark .case-play{border-color:#0051ff40;background:#0051ff08;color:#0051ff}.theme-dark .play-head,.theme-dark .play-controls{border-color:#0051ff30}.theme-dark .play-controls button{border-color:#0051ff60}.theme-dark .play-controls button[aria-pressed=true]{background:#0051ff;color:white}.theme-dark .play-controls input{accent-color:#0051ff}.theme-dark .classroom{border-color:#0051ff}.theme-dark .classroom i{background:#0051ff}.theme-dark .classroom i:after{background:white}
@media(max-width:650px){.case-opening{height:56svh;min-height:300px}.play-head{align-items:flex-start;flex-direction:column;gap:8px;padding:20px}.play-stage{min-height:280px;padding:25px}.holder-stage,.lighting-stage{padding:0;height:300px}.contact-invite{gap:16px;justify-content:flex-start}.contact-w{width:55px;height:55px}.contact-cta{padding:17px 20px;gap:20px}.classroom{gap:15px;padding:22px;height:180px}.case-play{margin-bottom:40px}}
body.reduced .window-image{transition:none}body.reduced .contact-w{transition:none;transform:none!important}
@media(prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}.window-image,.identity-object,.classroom,.phone-demo,.contact-w{transition:none!important}.nfc-demo:after,.nfc-demo:before,.research-step{animation:none!important}.contact-w{transform:none!important}}
[hidden]{display:none!important}
.identity-object[data-mode=logo] img{filter:brightness(0) invert(1)}.theme-dark .identity-object[data-mode=logo] img{filter:none}
.holder-stage{perspective:800px}.css-holder{position:relative;width:250px;height:245px;transform-style:preserve-3d}.css-holder i{position:absolute;inset:0;background:#123cad;mask:url('/assets/wais-w.svg') center/contain no-repeat;-webkit-mask:url('/assets/wais-w.svg') center/contain no-repeat}.css-holder i:last-child{background:linear-gradient(145deg,#99c7ff,#075aff 50%,#0028ad)}.css-holder i:first-child{background:#1a65ff}
