.page-transition{display:none;position:fixed;inset:0;z-index:1000;isolation:isolate;overflow:hidden;background:var(--ink,#111110);color:var(--paper,#f1eee7);place-content:center;text-align:center;pointer-events:auto}
.page-entering .page-transition{display:grid;animation:digify-page-reveal 1.4s cubic-bezier(.65,0,.2,1) both}
.page-transition-lockup{position:relative;z-index:1;padding:24px}
.page-transition-brand{display:flex;align-items:baseline;justify-content:center;font-size:clamp(72px,12vw,150px);font-weight:800;line-height:1;letter-spacing:-.065em}
.page-transition-brand span{display:inline-block}.page-transition-brand i{font-style:normal;color:var(--orange,#ff6418);display:inline-block}
.page-transition-lockup p{font-size:clamp(12px,1.2vw,16px);line-height:1.5;margin-top:22px;letter-spacing:.02em;color:#c8c5bf}
.page-entering .page-transition-brand span{animation:digify-connect-type .42s cubic-bezier(.16,1,.3,1) both}.page-entering .page-transition-brand span:nth-child(2){animation-delay:.07s}.page-entering .page-transition-brand span:nth-child(3){animation-delay:.14s}.page-entering .page-transition-brand i{animation:digify-connect-dot .4s .2s cubic-bezier(.16,1,.3,1) both}
.page-transition-connection{position:absolute;left:50%;top:calc(50% + 62px);width:min(1100px,120vw);height:auto;transform:translateX(-50%);stroke-width:1.3}.connection-base{stroke:#454540}.connection-trace{stroke:var(--orange,#ff6418);stroke-width:2;stroke-dasharray:.25 1;stroke-dashoffset:.25}.page-transition-connection circle{fill:var(--orange,#ff6418);stroke:none}
.page-entering .connection-trace{animation:digify-connect-trace 1s cubic-bezier(.3,0,.15,1) both}
.page-transition-signal{display:none;position:fixed;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));z-index:1001;align-items:center;gap:12px;max-width:calc(100vw - 48px);padding:15px 20px;border-radius:99px;background:var(--ink,#111110);color:var(--paper,#f1eee7);box-shadow:0 8px 28px #0003;pointer-events:none}
.page-leaving .page-transition-signal{display:flex;animation:digify-signal-in .3s ease-out .45s both}
@keyframes digify-signal-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.page-transition-signal p{font-size:12px;line-height:1.5;margin:0}.page-transition-signal>span{width:26px;height:2px;flex-shrink:0;background:var(--orange,#ff6418);transform-origin:left;animation:digify-connect-wait .8s ease-in-out 5 alternate}
/* Saída e chegada no mesmo movimento (View Transitions entre documentos): a página anterior recua e escurece
   enquanto a cortina sobe de baixo como um painel, com a borda laranja à frente, já compondo a marca.
   Tudo segue para cima: entra por baixo, sai pelo topo. Sem suporte, a cortina aparece como antes. */
.page-entering .page-transition{view-transition-name:digify-curtain}
html:active-view-transition-type(digify-curtain)::view-transition{background:var(--ink,#111110)}
html:active-view-transition-type(digify-curtain)::view-transition-old(root){animation:digify-leave .62s cubic-bezier(.7,0,.3,1) both}
html:active-view-transition-type(digify-curtain)::view-transition-new(root){animation:digify-hold .62s step-end both}
::view-transition-new(digify-curtain){animation:digify-rise .62s cubic-bezier(.7,0,.3,1) both}
.page-transition::before{content:'';position:absolute;left:0;right:0;top:0;height:4px;background:var(--orange,#ff6418);opacity:0}
html:active-view-transition-type(digify-curtain) .page-transition::before{opacity:1}
@keyframes digify-leave{to{transform:translateY(-14vh) scale(.95);filter:brightness(.4)}}
@keyframes digify-hold{from{opacity:0}to{opacity:1}}
@keyframes digify-rise{from{transform:translateY(100%)}to{transform:none}}
/* Revelação: a cortina sobe com uma borda laranja e a página chega subindo, no mesmo tempo. */
.page-transition::after{content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--orange,#ff6418);opacity:0}
.page-entering .page-transition::after{animation:digify-edge 1.4s linear both}
.page-entering .page-transition-lockup,.page-entering .page-transition-connection{animation:digify-lockup 1.4s cubic-bezier(.65,0,.2,1) both}
.page-entering main{animation:digify-arrive 1.4s cubic-bezier(.65,0,.2,1) both}
@keyframes digify-page-reveal{0%,64%{transform:none;visibility:visible}99%{visibility:visible}100%{transform:translateY(-100%);visibility:hidden;pointer-events:none}}
@keyframes digify-edge{0%,60%{opacity:0}64%,100%{opacity:1}}
@keyframes digify-lockup{0%,64%{translate:0 0;opacity:1}100%{translate:0 10vh;opacity:.35}}
@keyframes digify-arrive{0%,64%{transform:translateY(7vh)}100%{transform:none}}
@keyframes digify-connect-type{from{opacity:0;transform:translateX(-18px);clip-path:inset(0 100% 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes digify-connect-dot{from{opacity:0;transform:translateX(42px) scale(.35)}to{opacity:1;transform:none}}
@keyframes digify-connect-trace{from{stroke-dashoffset:.25}to{stroke-dashoffset:-1}}
@keyframes digify-connect-wait{from{transform:scaleX(.25);opacity:.5}to{transform:scaleX(1);opacity:1}}
@media(max-width:540px){.page-transition-signal{right:16px;bottom:calc(max(16px,env(safe-area-inset-bottom)) + 72px);max-width:calc(100vw - 32px);padding:12px 16px}.page-transition-connection{top:calc(50% + 44px);width:150vw}.page-transition-lockup p{margin-top:18px}}
@media(prefers-reduced-motion:reduce){.page-entering .page-transition,.page-leaving .page-transition-signal{display:none!important}.page-entering main{animation:none!important}}
.motion-paused .page-transition,.motion-paused .page-transition-signal{display:none!important}
.motion-paused main{animation:none!important}
@media print{.page-transition,.page-transition-signal{display:none!important}}
