html.pt-in::after { content: ""; position: fixed; inset: 0; z-index: 200; background: linear-gradient(rgba(4,8,10,.38), rgba(4,8,10,.38)), #0B0E0F var(--pt-img, none) var(--pt-pos, center) / cover no-repeat; } 
html.pt-in::before { content: var(--pt-name, ""); position: fixed; z-index: 202; }
html.pt-in:not(.pt-font)::before { visibility: hidden; } 
html.pt-run body { background: #0B0E0F; } 
.pt { position: fixed; inset: 0; z-index: 201; overflow: hidden; background: #0B0E0F; pointer-events: none; clip-path: inset(100% 0 0 0); }
.pt.is-on { pointer-events: auto; }
.pt__ph { position: absolute; inset: 0; overflow: hidden; background: #0B0E0F; clip-path: inset(100% 0 0 0); }
.pt__ph img { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; object-fit: cover; }


.pt__ph::after { content: ""; position: absolute; inset: 0; background: rgba(4,8,10,.38); }
.pt__t { position: absolute; z-index: 1; margin: 0; overflow: hidden; }
.pt__t span { display: block; }
.pt__t, html.pt-in::before { inset: 50% auto auto 50%; translate: -50% -50%; padding-block: .06em .12em; font: 400 clamp(34px, max(6.4vw, min(10.5vw, 44px)), 118px) / 1 var(--fd, sans-serif); letter-spacing: -.04em; color: #fff; white-space: nowrap; }


@view-transition { navigation: auto; }

::view-transition-group(root) { animation-duration: 1.25s; }
::view-transition-new(root) { animation: none; }
::view-transition-old(root) { z-index: 1; animation: pt-lift 1s cubic-bezier(.76, 0, .24, 1) .22s both; }
@keyframes pt-lift { from { clip-path: inset(0 0 0 0); } to { clip-path: inset(0 0 100% 0); } }
@media (max-width: 860px) { ::view-transition-group(root) { animation-duration: .75s; } ::view-transition-old(root) { animation-duration: .62s; animation-delay: .06s; } }
@media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }