.landing video,.fourth video { filter:grayscale(1); }
html.landing-open,html.contact-open { scrollbar-gutter:auto; }
.brand-button { transition:transform .22s cubic-bezier(.2,.8,.2,1); transform-origin:center; }
.brand-button:is(:hover,:focus-visible) { transform:scale(1.045); }
.brand-button:is(:hover,:focus-visible) .brand-outline path { opacity:1; animation:brand-outline-draw .65s linear both; }
.brand-button.brand-tracing .brand-outline path { opacity:1; animation:none; }
.brand-button:focus-visible { outline:1px solid #ffffff70; outline-offset:16px; border-radius:8px; }
.fourth { clip-path:inset(0); transition:clip-path .72s cubic-bezier(.76,0,.24,1); }
.fourth.contact-leaving { z-index:17; clip-path:inset(0 0 100% 0); pointer-events:none; }
.video-paint { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; }
.landing.landing-leaving video { filter:grayscale(1) blur(4px); }
.landing.landing-leaving .video-paint { opacity:0; transition:opacity .2s; }
@property --frame-turn { syntax:'<angle>'; inherits:false; initial-value:0deg; }
.intro-content::before { --frame-turn:0deg; -webkit-mask-image:conic-gradient(from 0deg,#000 0deg var(--frame-turn),transparent var(--frame-turn) 360deg); mask-image:conic-gradient(from 0deg,#000 0deg var(--frame-turn),transparent var(--frame-turn) 360deg); }
.intro-content.intro-playing::before { animation:trace-intro-frame 2.2s linear both; }
.intro-content h1 { animation:none; }
.intro-content.intro-playing h1 { animation:soft-rise .7s ease both; }
@keyframes trace-intro-frame { to { --frame-turn:360deg; } }
@media(prefers-reduced-motion:reduce) {
  .brand-button,.fourth { transition:none; }
  .brand-button.brand-tracing .brand-outline path { animation:none; stroke-dashoffset:0; }
  .intro-content::before { --frame-turn:360deg; }
  .intro-content.intro-playing::before,.intro-content.intro-playing h1 { animation:none; }
}
