/* Restrained motion for the homepage's opening panel. */
.hero{position:relative;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 420px 300px at var(--hero-x,75%) var(--hero-y,35%),rgba(239,56,44,.065),transparent 75%);opacity:0;transition:opacity .5s ease}
.hero.hero-pointer-active::before{opacity:1}
.hero h1 span{display:inline-block;position:relative;width:fit-content}
.hero h1 span::after{content:"";position:absolute;left:.035em;right:0;bottom:-.095em;height:3px;background:var(--red);transform-origin:left;opacity:.65}
@media(prefers-reduced-motion:no-preference){
 .hero>.eyebrow{animation:hero-arrive .65s cubic-bezier(.22,1,.36,1) both}
 .hero h1{animation:hero-arrive .85s cubic-bezier(.22,1,.36,1) .08s both}
 .hero h1 span{animation:hero-arrive .9s cubic-bezier(.22,1,.36,1) .16s both}
 .hero h1 span::after{animation:hero-rule .85s cubic-bezier(.22,1,.36,1) .45s both}
 .hero-bottom{animation:hero-arrive .8s cubic-bezier(.22,1,.36,1) .24s both}
 .hero .button{transition:background .2s ease,transform .2s ease,box-shadow .2s ease}
 .hero .button:hover{transform:translateY(-2px);box-shadow:0 5px 0 rgba(21,21,21,.12)}
}
@keyframes hero-arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes hero-rule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:760px){.hero h1 span{display:block}.hero h1 span::after{height:2px;bottom:-.12em}}
@media(prefers-reduced-motion:reduce){.hero::before{display:none}}