/* Abertura: o selo da marca desenha o carregamento real e se abre como uma íris sobre o hero. */
@property --hole{syntax:'<length>';inherits:false;initial-value:0px}
.loader{display:none}
.js .loader{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:radial-gradient(circle at 50% 50%,#1a2039 0,#101525 62%);color:var(--paper);--hole:0px;-webkit-mask:radial-gradient(circle at 50% 50%,transparent var(--hole),#000 calc(var(--hole) + .5px));mask:radial-gradient(circle at 50% 50%,transparent var(--hole),#000 calc(var(--hole) + .5px))}
.loader-fail .loader{display:none}
html.is-loading{overflow:hidden}
.loader-seal{position:relative;width:clamp(150px,44vw,192px);aspect-ratio:1;display:grid;place-items:center}
.loader-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:rotate(-90deg) scale(var(--ring-scale,1));transform-origin:50% 50%}
.loader-ring circle{fill:none;vector-effect:non-scaling-stroke}
.loader-track{stroke:rgba(246,246,243,.1);stroke-width:1}
.loader-arc{stroke:var(--gold);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1}
.loader-mark{display:grid;justify-items:center;gap:11px;margin:0}
.loader-word{display:flex;font-family:var(--display);font-size:clamp(22px,6.3vw,28px);letter-spacing:-.045em;line-height:1;overflow:hidden;padding:.1em .06em .04em;opacity:0;transition:opacity .2s}
.loader-word span{display:block;translate:0 115%;transition:translate .95s cubic-bezier(.19,.8,.2,1);transition-delay:calc(var(--i) * 48ms)}
.loader-sub{font-size:8px;letter-spacing:.66em;margin-right:-.66em;color:var(--gold);opacity:0;translate:0 4px;transition:opacity .8s .42s,translate .8s .42s}
.loader.has-font .loader-word{opacity:1}
.loader.has-font .loader-word span{translate:0 0}
.loader.has-font .loader-sub{opacity:1;translate:0 0}
/* Saída: a marca sobe, o anel abre e puxa a íris até cobrir a tela. */
.loader.is-done{--hole:var(--hole-max,150vmax);transition:--hole 1.05s cubic-bezier(.7,0,.16,1) .22s;pointer-events:none}
.loader.is-done .loader-word span{translate:0 -115%;transition:translate .5s cubic-bezier(.6,0,.4,1);transition-delay:calc(var(--i) * 22ms)}
.loader.is-done .loader-sub{opacity:0;translate:0 -4px;transition:opacity .3s,translate .3s}
.loader.is-done .loader-ring{--ring-scale:var(--ring-max,8);opacity:0;transition:transform 1.05s cubic-bezier(.7,0,.16,1) .22s,opacity .45s ease .82s}
/* O hero assenta enquanto a íris abre; o texto entra em seguida, em uma única sequência. */
.js.is-loading .hero-photo img,.js.is-loading .hero-video{scale:1.07}
.js.is-loading .hero-copy>*,.js.is-loading .header,.js.is-loading .hero-bottom,.js.is-loading .hero-rail,.js.is-loading .motion-toggle{opacity:0}
.js.is-loading .hero-copy>*{translate:0 28px}
.loader-out .hero-photo img{transition:scale 1.9s cubic-bezier(.2,.7,.1,1) .15s}
.loader-out .hero-video{transition:opacity .5s ease,scale 1.9s cubic-bezier(.2,.7,.1,1) .15s}
.loader-out .hero-copy>*{transition:opacity .9s ease,translate 1.1s cubic-bezier(.19,.8,.2,1)}
.loader-out .hero-copy>:nth-child(1){transition-delay:.55s}
.loader-out .hero-copy>:nth-child(2){transition-delay:.63s}
.loader-out .hero-copy>:nth-child(3){transition-delay:.75s}
.loader-out .hero-copy>:nth-child(4){transition-delay:.85s}
.loader-out .header,.loader-out .hero-bottom,.loader-out .hero-rail,.loader-out .motion-toggle{transition:opacity 1s ease .9s}
@media(prefers-reduced-motion:reduce){.loader.is-done{opacity:0}.js.is-loading .hero-photo img,.js.is-loading .hero-video{scale:none}.js.is-loading .hero-copy>*{translate:none}}
