.formula{view-timeline-name:--formula;view-timeline-axis:block;height:260vh}.formula-frame{display:grid}.formula-shot{grid-area:1/1}.formula-new,.formula-edge,.formula-copy-left,.formula-copy-right{animation-duration:auto;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--formula;animation-range:entry 100% exit 0%}.formula-new{z-index:1;clip-path:inset(0 0 0 100%);animation-name:formula-reveal}.formula-edge{z-index:2;animation-name:formula-edge;transform:translate(100%)}.formula-copy-left{animation-name:formula-copy-left}.formula-copy-right{animation-name:formula-copy-right}@keyframes formula-reveal{to{clip-path:inset(0)}}@keyframes formula-edge{0%{opacity:0;transform:translate(100%)}8%{opacity:1}92%{opacity:1}to{opacity:0;transform:translate(0,0)}}@keyframes formula-copy-left{0%{transform:translateY(2.75rem)}to{transform:translateY(-2.75rem)}}@keyframes formula-copy-right{0%{transform:translateY(-2.75rem)}to{transform:translateY(2.75rem)}}@media (prefers-reduced-motion:reduce){.formula{height:auto}.formula-frame{flex-direction:column;gap:2rem;display:flex}.formula-shot{grid-area:auto;height:auto}.formula-new,.formula-edge,.formula-copy-left,.formula-copy-right{animation:none}.formula-new{clip-path:none}.formula-edge{display:none}}@media (max-width:1279px){.formula-copy-left,.formula-copy-right{animation:none;transform:none}}
@property --wipe{syntax:"<percentage>";inherits:false;initial-value:0%}@keyframes hero-paint{0%{--wipe:0%}to{--wipe:145%}}@keyframes cue-drop{0%{opacity:1;transform:translateY(0)}80%{opacity:0;transform:translateY(.4rem)}to{opacity:0;transform:translateY(0)}}.cue-drop{animation-name:cue-drop;animation-duration:1.6s;animation-timing-function:cubic-bezier(.77,0,.175,1);animation-iteration-count:infinite}@media (prefers-reduced-motion:reduce){.cue-drop{opacity:1;animation:none}}
.mark{view-timeline-name:--mark;view-timeline-axis:block;height:240vh}.mark-frame{display:grid}.mark-shot{grid-area:1/1}.mark-new,.mark-edge,.mark-copy-left,.mark-copy-right{animation-duration:auto;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--mark;animation-range:entry 100% exit 0%}.mark-new{z-index:1;clip-path:inset(0 0 0 100%);animation-name:mark-reveal}.mark-edge{z-index:2;animation-name:mark-edge;transform:translate(100%)}.mark-copy-left{animation-name:mark-copy-left}.mark-copy-right{animation-name:mark-copy-right}@keyframes mark-reveal{to{clip-path:inset(0)}}@keyframes mark-edge{0%{opacity:0;transform:translate(100%)}8%{opacity:1}92%{opacity:1}to{opacity:0;transform:translate(0,0)}}@keyframes mark-copy-left{0%{transform:translateY(2.75rem)}to{transform:translateY(-2.75rem)}}@keyframes mark-copy-right{0%{transform:translateY(-2.75rem)}to{transform:translateY(2.75rem)}}@media (prefers-reduced-motion:reduce){.mark{height:auto}.mark-frame{flex-direction:column;gap:2rem;display:flex}.mark-shot{grid-area:auto;height:auto}.mark-new,.mark-edge,.mark-copy-left,.mark-copy-right{animation:none}.mark-new{clip-path:none}.mark-edge{display:none}}@media (max-width:1279px){.mark-copy-left,.mark-copy-right{animation:none;transform:none}}
.work{view-timeline-name:--work;view-timeline-axis:block;height:320vh}.reel{opacity:0;animation-name:reel;animation-duration:auto;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--work;animation-range:entry 100% exit 0%}@keyframes reel{to{transform:translate(-66.6667%)}}.marquee{animation-name:marquee;animation-duration:32s;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes marquee{to{transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){.work{height:100svh}.reel,.marquee{animation:none}.reel{opacity:1}}
.sites{view-timeline-name:--sites;view-timeline-axis:block;height:320vh}.sites-fade{opacity:0;animation-name:sites-fade;animation-duration:auto;background:linear-gradient(90deg,#fff,#0000 clamp(1.5rem,5vw,4rem) calc(100% - clamp(1.5rem,5vw,4rem)),#fff);animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--sites;animation-range:entry 100% exit 0%}.sites-track{width:300%;animation-name:sites-pass;animation-duration:auto;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--sites;animation-range:entry 100% exit 0%;display:flex}.sites-slide{width:33.3333%}@keyframes sites-pass{to{transform:translate(-66.6667%)}}@keyframes sites-fade{0%,50%,to{opacity:0}6%,44%,56%,94%{opacity:1}}@media (prefers-reduced-motion:reduce){.sites{height:auto}.sites-fade{display:none}.sites-track{flex-direction:column;gap:4.5rem;width:100%;animation:none}.sites-slide{width:100%}}
