/* Entrada breve, independiente de la descarga del modelo. */
[hidden]{display:none!important}
#brand-intro{position:fixed;inset:0;z-index:50;pointer-events:none}
.intro-panel{position:absolute;top:0;bottom:0;width:50.1%;background:#e9e5db;transition:transform .65s cubic-bezier(.76,0,.24,1)}
.panel-left{left:0}.panel-right{right:0}
.intro-brand{position:absolute;left:calc(50% - 210px);top:calc(50% - 50px);width:420px;height:100px;display:flex;gap:15px;transform-origin:top left;align-items:center;will-change:transform}
.intro-symbol{width:100px;height:100px;transform:translateY(35px) rotate(-14deg);opacity:0;transition:transform .75s cubic-bezier(.16,1,.3,1),opacity .45s}
.intro-word{width:305px;height:100px;clip-path:inset(0 100% 0 0);transform:translateX(-12px);transition:clip-path .65s cubic-bezier(.76,0,.24,1) .2s,transform .65s .2s}
.is-playing .intro-symbol{transform:none;opacity:1}.is-playing .intro-word{clip-path:inset(0);transform:none}
.intro-signature{position:absolute;top:calc(50% + 75px);width:100%;text-align:center;font-size:10px;letter-spacing:.14em;opacity:0;transition:opacity .4s .3s}
.is-playing .intro-signature{opacity:.7}.is-leaving .intro-signature{opacity:0;transition-delay:0s}.is-leaving .panel-left{transform:translateX(-100%)}.is-leaving .panel-right{transform:translateX(100%)}
#skip-intro{position:fixed;right:4vw;bottom:28px;z-index:51;border:1px solid #14213060;background:#e9e5db;padding:12px 16px;font-size:12px}
.reveal-armed{transition:opacity .8s cubic-bezier(.16,1,.3,1) var(--delay,0ms),translate .95s cubic-bezier(.16,1,.3,1) var(--delay,0ms);opacity:0;translate:0 38px}
.reveal-armed.is-visible{opacity:1;translate:0 0}
.experience.reveal-armed{translate:54px 0;transform:translate3d(0,var(--layer-y,0px),0)}.experience.reveal-armed.is-visible{translate:0 0}
.entrance-playing:not(.entrance-done) .statement>*,.entrance-playing:not(.entrance-done) .experience{opacity:0;translate:0 40px}
header>span,header>.contact{transition:opacity .65s .15s,translate .8s .15s}.entrance-playing:not(.entrance-done) header>span,.entrance-playing:not(.entrance-done) header>.contact{opacity:0;translate:0 -16px}
.invitation-art{grid-column:1/-1;position:relative;height:430px;margin-top:20px;isolation:isolate}
.invitation-art a{position:absolute;display:block;overflow:hidden;border:1px solid #14213020;box-shadow:0 20px 45px #14213012}
.invitation-art img{width:100%;height:100%;object-fit:cover;display:block;transition:scale .65s cubic-bezier(.16,1,.3,1)}.invitation-art a:hover img{scale:1.045}
.art-one{width:48%;height:85%;top:8%;left:2%;transform:translate3d(0,var(--layer-y,0px),0) rotate(-4deg);clip-path:polygon(0 4%,98% 0,100% 100%,2% 95%)}
.art-two{width:32%;height:98%;top:0;left:39%;transform:translate3d(0,var(--layer-y,0px),0) rotate(5deg);z-index:1;clip-path:polygon(4% 0,100% 3%,96% 100%,0 96%)}
.invitation-art>span{position:absolute;right:0;top:38%;font-family:Archivo,Arial Black,sans-serif;font-size:clamp(24px,3vw,46px);letter-spacing:-.05em;line-height:1.05;z-index:2;pointer-events:none;max-width:32%}
main{overflow:clip}
@media(max-width:800px){.intro-brand{width:280px;height:67px;left:calc(50% - 140px);top:calc(50% - 34px);gap:10px}.intro-symbol{width:67px;height:67px}.intro-word{width:203px;height:67px}.intro-signature{top:calc(50% + 60px);font-size:8px}.experience.reveal-armed{translate:0 28px}.invitation-art{height:320px;margin:35px 0 8px}.art-one{width:65%;height:70%;left:0;top:5%}.art-two{width:49%;height:86%;left:45%;top:5%}.invitation-art>span{font-size:26px;left:0;top:auto;bottom:0;max-width:90%;line-height:.98}}
@media(prefers-reduced-motion:reduce){#brand-intro,#skip-intro{display:none!important}.reveal-armed,.experience.reveal-armed,header>span,header>.contact{opacity:1!important;translate:none!important;transition:none!important}.experience,.art-one,.art-two{transform:none!important}.invitation-art img{transition:none}}
.invitation>.invitation-art{width:100%;max-width:none;justify-self:stretch;align-self:stretch}

/* Encuentro frontal: dos masas rectas, sin giro ni entrada por letras. */
#brand-intro{overflow:hidden}
.intro-brand{width:min(86vw,680px);height:auto;aspect-ratio:4.2;left:50%;top:50%;translate:-50% -50%;gap:3.57%;perspective:none}
.intro-symbol{width:23.81%;height:auto;aspect-ratio:1;flex-shrink:0;opacity:1;transform:none;transition:none;animation:none!important}
.intro-word{position:relative;width:72.62%;height:100%;aspect-ratio:3.05;flex-shrink:0;clip-path:none;transform:none;transition:none;animation:none!important}
.intro-letter{position:absolute;inset:0;width:100%;height:100%;opacity:1;transform:none!important;animation:none!important}
.intro-signature{display:none!important}
.intro-panel{transition-duration:.61s;transition-timing-function:cubic-bezier(.65,0,.8,.9)}
#sound-intro{position:fixed;left:4vw;bottom:28px;z-index:52;border:1px solid #14213060;background:#e9e5db;padding:12px 16px;font-size:12px;text-align:left}
.entrance-done #sound-intro{position:static;align-self:flex-start;margin-top:20px;font-size:11px;padding:10px 13px}
@media(max-width:800px){#sound-intro{left:5vw;font-size:10px;padding:11px}#skip-intro{right:5vw;font-size:10px;padding:11px}}


.intro-reset .intro-panel{transition:none!important}
