header,footer{background:#000;}
header .lightsafe-logo{display:block;width:clamp(290px,33vw,500px);max-width:100%;line-height:0;white-space:normal;}
.lightsafe-logo img{display:block;width:100%;height:auto;object-fit:contain;}
footer .lightsafe-logo{display:block;width:290px;max-width:100%;line-height:0;}
@media(max-width:800px){header .lightsafe-logo{width:min(460px,100%);}header{gap:14px;padding-top:15px;}}
/* Reveal the original beam artwork while the lettering stays visible. */
header .lightsafe-logo{position:relative;isolation:isolate;}
.beam-swoosh{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;visibility:hidden;}
html.logo-motion-enabled header .beam-pending > img,header .beam-ready > img{opacity:0;}
html.logo-motion-enabled header .beam-pending .beam-swoosh,header .beam-ready .beam-swoosh{visibility:visible;}
.beam-reveal{fill:none;stroke:white;stroke-width:150;stroke-linecap:butt;stroke-dasharray:1000;stroke-dashoffset:1000;}
.beam-ignition,.beam-finish{opacity:0;}
.phrase-reveal{width:0;}
.is-swooshing .phrase-description{animation:phrase-draw 1250ms 900ms cubic-bezier(.25,.6,.35,1) both;}
.is-swooshing .phrase-tagline{animation:phrase-draw 1250ms 1100ms cubic-bezier(.25,.6,.35,1) both;}
@keyframes phrase-draw{from{width:0}to{width:1140px}}
.is-swooshing .beam-upper{animation:beam-draw 2000ms 550ms cubic-bezier(.25,.6,.35,1) both;}
.is-swooshing .beam-lower{animation:beam-draw 1000ms 550ms ease-out both;}
.is-swooshing .beam-ignition{animation:beam-ignite 650ms 350ms ease-out both;}
.is-swooshing .beam-finish{animation:beam-ignite 400ms 2350ms ease-out both;}
@keyframes beam-draw{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
@keyframes beam-ignite{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){
 html.logo-motion-enabled header .beam-pending > img,header .beam-ready > img{opacity:1;}
 html.logo-motion-enabled header .beam-pending .beam-swoosh,header .beam-ready .beam-swoosh{visibility:hidden;}
 .beam-swoosh *{animation:none!important;}
}