@import url('/pyro-motion.css');
header .pyro-header-symbol{position:absolute;left:40px;top:28px;display:block;width:34px;height:56px;pointer-events:auto}
header:has(.pyro-header-symbol){min-height:84px;align-items:flex-start}
header .pyro-header-symbol img{display:block;width:100%;height:100%;object-fit:contain}
header img.pyro-symbol-image{width:100%;height:100%;object-fit:contain!important}
header .pyro-header-symbol img,header img.pyro-symbol-image{content:url('/images/pyro-symbol-on-dark.svg')}
html[data-symbol-theme="purple"] header .pyro-header-symbol img,html[data-symbol-theme="purple"] header img.pyro-symbol-image{content:url('/images/pyro-symbol-on-purple.svg')}
html[data-symbol-theme="light"] header .pyro-header-symbol img,html[data-symbol-theme="light"] header img.pyro-symbol-image{content:url('/images/pyro-symbol.svg')}
@media(max-width:1024px){header .pyro-header-symbol{left:24px;top:18px;width:24px;height:40px}}
@media(max-width:1024px){header:has(.pyro-header-symbol){min-height:58px}}
@media(hover:hover){
 header .pyro-header-symbol,header .logo:has(img.pyro-symbol-image){width:142px}
 header .pyro-header-symbol img{width:34px;height:56px}
 header .pyro-header-symbol img,header img.pyro-symbol-image{transform-origin:top left;transition:transform .42s cubic-bezier(.22,.61,.36,1)}
 header .pyro-header-symbol::after,header .logo:has(img.pyro-symbol-image)::after{content:'';position:absolute;left:0;top:50%;width:142px;height:56px;background:url('/images/pyro-header-hover-logo.svg') left center/contain no-repeat;mask-image:linear-gradient(to right,#000 0 32%,transparent 32% 56%,#000 56% 100%);opacity:0;transform:translate(-7px,-50%);transition:opacity .25s ease .12s,transform .42s cubic-bezier(.22,.61,.36,1);pointer-events:none}
 html:not([data-symbol-theme="light"]) header .pyro-header-symbol::after,html:not([data-symbol-theme="light"]) header .logo:has(img.pyro-symbol-image)::after{filter:brightness(0) invert(1)}
 header .pyro-header-symbol:hover img{transform:translate(46px,1.5px) scale(.95)}
 header .logo:has(img.pyro-symbol-image):hover img.pyro-symbol-image{transform:translate(36px,34px) scale(.45)}
 header .pyro-header-symbol:hover::after,header .logo:has(img.pyro-symbol-image):hover::after{opacity:1;transform:translate(0,-50%)}
}
@media(hover:hover) and (max-width:1024px){header .pyro-header-symbol{width:110px}header .pyro-header-symbol img{width:24px;height:40px}header .pyro-header-symbol::after{width:110px;height:40px}header .pyro-header-symbol:hover img{transform:translate(36px,1px) scale(.93)}}
@media(prefers-reduced-motion:reduce){header .pyro-header-symbol img,header img.pyro-symbol-image,header .pyro-header-symbol::after,header .logo:has(img.pyro-symbol-image)::after{transition:none!important}}
header .logo:has(img.pyro-symbol-image){display:block!important;width:34px!important;height:56px!important}
header .logo:has(img.pyro-symbol-image) .sub-logo{display:block!important;width:34px!important;height:56px!important;background:url('/images/pyro-symbol-on-dark.svg') center/contain no-repeat!important}
header .logo:has(img.pyro-symbol-image) img.pyro-symbol-image{display:none!important}
header .logo:has(img.pyro-symbol-image)::after{content:none!important;display:none!important}
html[data-symbol-theme="purple"] header .logo:has(img.pyro-symbol-image) .sub-logo{background-image:url('/images/pyro-symbol-on-purple.svg')!important}
html[data-symbol-theme="light"] header .logo:has(img.pyro-symbol-image) .sub-logo{background-image:url('/images/pyro-symbol.svg')!important}
@media(max-width:1024px){header .logo:has(img.pyro-symbol-image),header .logo:has(img.pyro-symbol-image) .sub-logo{width:24px!important;height:40px!important}}
@font-face{font-family:'SUIT Variable';font-style:normal;font-weight:100 900;font-display:swap;src:url('/assets/SUIT-Variable.woff2') format('woff2')}
html,body,body *,body *::before,body *::after{font-family:'SUIT Variable',sans-serif!important}
:where(a:link,a:visited){color:#7B029D}
.over-text{color:#7B029D!important}
:root { --brand-primary:#7B029D; --brand-accent:#9DFFCE; --brand-accent-strong:#19F587; }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible {outline:2px solid var(--brand-accent)!important;outline-offset:5px}
/* Remove the blue matte baked into the white logo movie before lighten blending. */
#top h1 video { filter: grayscale(1) contrast(2); }


.sc-visual .pyro-about-orbit{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}.sc-visual .pyro-about-orbit canvas{display:block;width:100%;height:100%}
/* About hero scroll cue matches the landing #top .btn-scroll-box (pyro-motion.css). */
.sc-visual:has(.pyro-about-orbit) .btn-box{position:absolute!important;top:auto!important;bottom:34px!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:auto!important;height:78px!important;margin:0!important;z-index:2!important}
.sc-visual:has(.pyro-about-orbit) .btn-box>button{all:unset!important;display:flex!important;flex-direction:column!important;align-items:center!important;height:78px!important;cursor:pointer!important}
.sc-visual:has(.pyro-about-orbit) .btn-box>button>*,.sc-visual:has(.pyro-about-orbit) .btn-box>button::before{display:none!important}
.sc-visual:has(.pyro-about-orbit) .btn-box>button::after{content:''!important;position:static!important;display:block!important;width:1px!important;height:52px!important;background:linear-gradient(to bottom,transparent,#f4f4f8)!important;border:0!important;border-radius:0!important;animation:pyro-scroll-drop 2s ease-in-out infinite!important}
.sc-visual:has(.pyro-about-orbit) .btn-box>button:focus-visible{outline:2px solid #9DFFCE!important;outline-offset:8px!important}
@media(prefers-reduced-motion:reduce){.sc-visual:has(.pyro-about-orbit) .btn-box>button::after{animation:none!important;transform:scaleY(1)}}
