.hero-stage{--hero-cycle:8s;aspect-ratio:1;isolation:isolate;width:100%;max-width:34rem;margin-inline:auto;position:relative}.hero-mono{opacity:.14;z-index:-2;width:100%;height:auto;position:absolute;inset:8% 0 auto}.hero-mono__n,.hero-mono__back,.hero-mono__front{transform-box:fill-box;transform-origin:50% 0;animation:var(--hero-cycle) cubic-bezier(.16, 1, .3, 1) infinite both}.hero-mono__n{animation-name:hero-n}.hero-mono__back{animation-name:hero-back}.hero-mono__front{animation-name:hero-front}@keyframes hero-n{0%{opacity:0;transform:translateY(-4%)}8%,88%{opacity:1;transform:none}98%,to{opacity:0;transform:translateY(-4%)}}@keyframes hero-back{0%,4%{opacity:0;transform:scaleY(0)}14%,86%{opacity:1;transform:scaleY(1)}96%,to{opacity:0;transform:scaleY(0)}}@keyframes hero-front{0%,8%{opacity:0;transform:scaleY(0)}18%,84%{opacity:1;transform:scaleY(1)}94%,to{opacity:0;transform:scaleY(0)}}.hero-sweep{z-index:5;pointer-events:none;mix-blend-mode:screen;position:absolute;inset:-6%;overflow:hidden;-webkit-mask-image:radial-gradient(closest-side,#000 60%,#0000);mask-image:radial-gradient(closest-side,#000 60%,#0000)}.hero-sweep:before{content:"";animation:hero-sweep var(--hero-cycle) cubic-bezier(.65, 0, .35, 1) infinite both;background:linear-gradient(115deg,#0000 42%,#ffffff0d 46%,#e6e7ea8c 50%,#ffffff0d 54%,#0000 58%);position:absolute;inset:0 -40%}@keyframes hero-sweep{0%,10%{opacity:0;transform:translate(-55%)}14%{opacity:1}34%{opacity:1;transform:translate(55%)}38%,to{opacity:0;transform:translate(55%)}}.hero-card{perspective:1100px;position:absolute}.hero-card--1{width:56%;height:42%;top:6%;left:0;rotate:-4deg}.hero-card--2{width:48%;height:44%;top:30%;right:0;rotate:3deg}.hero-card--3{width:50%;height:34%;bottom:2%;left:10%;rotate:-1.5deg}.hero-flip{width:100%;height:100%;transform-style:preserve-3d;animation:hero-flip var(--hero-cycle) cubic-bezier(.65, 0, .35, 1) infinite both;position:relative}.hero-card--2 .hero-flip{animation-delay:.45s}.hero-card--3 .hero-flip{animation-delay:.9s}@keyframes hero-flip{0%,16%{transform:rotateY(0)}27%,80%{transform:rotateY(180deg)}91%,to{transform:rotateY(0)}}.hero-face{backface-visibility:hidden;border-radius:1.25rem;position:absolute;inset:0;overflow:hidden}.hero-face--analog{color:#2a2a2c;background:#e8e6e1;box-shadow:0 30px 60px -30px #000c}.hero-face--digital{color:var(--text);background:linear-gradient(160deg,#1c1c20 0%,#111113 60%);transform:rotateY(180deg);box-shadow:0 30px 60px -30px #000000e6}.hero-face--digital:before{content:"";border-radius:inherit;background:var(--silver-gradient);-webkit-mask-composite:xor;opacity:.6;padding:1px;position:absolute;inset:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor,source-over;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}.hero-face--digital:after{content:"";width:45%;animation:hero-glint var(--hero-cycle) ease-out infinite both;animation-delay:inherit;background:linear-gradient(100deg,#0000,#ffffff38,#0000);position:absolute;inset:-20% auto -20% 0}.hero-card--2 .hero-face--digital:after{animation-delay:.45s}.hero-card--3 .hero-face--digital:after{animation-delay:.9s}@keyframes hero-glint{0%,28%{opacity:0;transform:translate(-120%)skew(-14deg)}31%{opacity:1}42%,to{opacity:0;transform:translate(320%)skew(-14deg)}}.hero-stage[data-paused] *,.hero-stage[data-paused] :before,.hero-stage[data-paused] :after{animation-play-state:paused}@media (prefers-reduced-motion:reduce){.hero-stage *,.hero-stage :before,.hero-stage :after{animation:none!important}.hero-flip{transform:rotateY(180deg)}.hero-sweep,.hero-face--digital:after{display:none}}