:root{--motion-ease:cubic-bezier(.16,1,.3,1)}
html{scrollbar-gutter:stable}
/* Reveal the page during the dissolve, never show it and then hide it again. */
.intro-running:not(.intro-handoff) .hero-title-wrap,.intro-running:not(.intro-handoff) .vertical-copy,.intro-running:not(.intro-handoff) .hero-bottom{visibility:hidden}
.intro-running .site-header{opacity:0}
.intro-running .hero-shade{opacity:0}
.intro-handoff .site-header{opacity:1;transition:opacity 1s ease .2s}
.intro-handoff .hero-shade{opacity:1;transition:opacity 1.1s ease}
.intro-handoff #opening.finishing{transition:opacity 1.1s cubic-bezier(.4,0,.2,1)}
.intro-handoff #skip-opening{opacity:0;transition:opacity .2s}
.site-header{transition:background .6s ease,box-shadow .6s ease}
.site-header.motion-scrolled{background:#171410f5;box-shadow:0 8px 32px #0002}
#site-nav>a:not(.nav-contact){position:relative}
#site-nav>a:not(.nav-contact)::after{content:'';position:absolute;bottom:4px;left:0;width:100%;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--motion-ease)}
#site-nav>a:hover::after,#site-nav>a:focus-visible::after{transform:scaleX(1);transform-origin:left}
.card-image{isolation:isolate}
.card-image::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 25%,#ffedc429 49%,transparent 72%);transform:translateX(-130%);transition:transform 1s var(--motion-ease)}
.feed-card a:hover .card-image::after,.feed-card a:focus-visible .card-image::after{transform:translateX(130%)}
.feed-card a .card-image img{transition:transform 1.2s var(--motion-ease)}
.feed-card a:hover .card-image img{transform:scale(1.055)}
.text-link,.nav-contact,.contact-title,.watch-link{position:relative;isolation:isolate}
.contact-title span,.text-link span,.nav-contact span{display:inline-block;transition:transform .5s var(--motion-ease)}
.contact-title:hover span,.text-link:hover span,.nav-contact:hover span{transform:translate(4px,-4px)}
.contact-title:hover{letter-spacing:.04em}
.nav-contact{overflow:hidden}
.nav-contact::before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent,#fff5,transparent);transform:translateX(-120%);transition:transform .8s var(--motion-ease);pointer-events:none}
.nav-contact:hover::before{transform:translateX(120%)}
.nav-socials a svg,.footer-socials a svg{transition:transform .5s var(--motion-ease)}
.nav-socials a:hover svg,.footer-socials a:hover svg{transform:translateY(-2px) rotate(-6deg)}
.menu-toggle span{display:inline-block;transition:transform .5s var(--motion-ease)}
.menu-toggle[aria-expanded=true] span{transform:rotate(45deg)}
@media(max-width:1100px){#site-nav.open{animation:menu-arrive .5s var(--motion-ease) both}#site-nav.open>a,#site-nav.open>.nav-socials{animation:menu-item .55s var(--motion-ease) both}#site-nav.open>:nth-child(2){animation-delay:30ms}#site-nav.open>:nth-child(3){animation-delay:60ms}#site-nav.open>:nth-child(4){animation-delay:90ms}#site-nav.open>:nth-child(5){animation-delay:120ms}#site-nav.open>:nth-child(n+6){animation-delay:150ms}}
@keyframes menu-arrive{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@keyframes menu-item{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.profile-art img{transform:none!important}}
