/* ── Page Transition Overlay ── */
.pt-overlay{position:fixed;inset:0;z-index:10000;background:#000;display:flex;align-items:center;justify-content:center;visibility:hidden;pointer-events:none}
.pt-overlay.show{visibility:visible}

/* Two logo halves — stacked at same position, each clipped to a triangle */
.pt-logo-wrap{position:relative;width:3.6rem;height:3.6rem}
.pt-half{position:absolute;top:0;left:0;width:100%;height:100%}
.pt-half img{display:block;width:3.6rem;height:3.6rem;position:absolute;top:0;left:0;-webkit-user-drag:none;user-select:none}

/* Top-left half: clip to triangle from top-left to top-right to bottom-left */
.pt-top-left{clip-path:polygon(0 0,100% 0,0 100%)}

/* Bottom-right half: clip to triangle from top-right to bottom-right to bottom-left */
.pt-bottom-right{clip-path:polygon(100% 0,100% 100%,0 100%)}

/* ── Animation states ── */
.pt-overlay.anim .pt-top-left{
    animation:ptSlideTL .55s cubic-bezier(.65,0,.25,1) forwards;
}
.pt-overlay.anim .pt-bottom-right{
    animation:ptSlideBR .55s cubic-bezier(.65,0,.25,1) forwards;
}
.pt-overlay.fadeout{
    animation:ptFadeBg .3s .55s forwards;
}

@keyframes ptSlideTL{
    0%{transform:translate(0,0);opacity:1}
    100%{transform:translate(-30%,-30%);opacity:0}
}
@keyframes ptSlideBR{
    0%{transform:translate(0,0);opacity:1}
    100%{transform:translate(30%,30%);opacity:0}
}
@keyframes ptFadeBg{
    to{opacity:0}
}