.mogrt-steps{--ms-ink: #f5f5f7;--ms-muted: #a1a1a6;--ms-blue: #2997ff;--ms-pink: #e86aa6;--ms-ease: cubic-bezier(.22, 1, .36, 1);padding:clamp(88px,10vw,144px) 0;background:#161618;color:var(--ms-ink)}.mogrt-steps--black{background:#000}.mogrt-steps__head{max-width:820px;margin:0 auto clamp(40px,5vw,64px);text-align:center}.mogrt-steps__eyebrow{margin:0 0 14px;color:var(--ms-blue);font-size:15px;font-weight:600}.mogrt-steps__heading{margin:0;color:inherit;font-size:clamp(38px,5.2vw,64px);font-weight:700;line-height:1.04;letter-spacing:-.045em;text-wrap:balance}.mogrt-steps__heading span{color:#86868b}.mogrt-steps__list{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;max-width:1180px;margin:0 auto;padding:0;list-style:none;counter-reset:none}@media screen and (min-width:900px){.mogrt-steps__list{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}}.mogrt-steps__step{display:grid;align-content:start;padding:10px 10px 28px;border-radius:28px;background:#1d1d1f;box-shadow:inset 0 0 0 1px #ffffff14}.mogrt-steps--black .mogrt-steps__step{background:#1d1d1f}.mogrt-steps__number{display:grid;width:28px;height:28px;margin:22px 14px 12px;border-radius:8px;background:#2997ff29;color:var(--ms-blue);font-family:ui-monospace,SF Mono,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px;font-weight:700;place-items:center}.mogrt-steps__step h3{margin:0 14px;color:var(--ms-ink);font-size:22px;font-weight:650;letter-spacing:-.025em}.mogrt-steps__step p{margin:8px 14px 0;color:var(--ms-muted);font-size:16px;line-height:1.5;text-wrap:pretty}.mogrt-steps__screen{position:relative;display:block;overflow:clip;aspect-ratio:16 / 11;border-radius:19px;background:radial-gradient(60% 70% at 50% 45%,rgb(41 151 255 / .14),transparent 72%),#0e0e10;container-type:inline-size}.mogrt-steps__screen span,.mogrt-steps__screen i,.mogrt-steps__screen b,.mogrt-steps__screen small,.mogrt-steps__screen em{display:block;font-style:normal}.ms-panel{position:absolute;inset:9% 9% auto;padding:4cqw;border-radius:4cqw;background:#232326;box-shadow:inset 0 0 0 1px #ffffff14,0 4cqw 8cqw -3cqw #000000b3}.ms-panel__tab{width:max-content;margin-bottom:4cqw;padding-bottom:1.6cqw;border-bottom:max(1.5px,.5cqw) solid var(--ms-blue);color:var(--ms-ink);font-size:max(10px,4cqw);font-weight:600}.ms-panel__grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:2.4cqw}.ms-panel__grid i{aspect-ratio:1;border-radius:2cqw;background:#2f2f33}.ms-panel__grid .ms-panel__slot{background:linear-gradient(160deg,#f08cbc,#c94f8a);box-shadow:0 0 0 max(1.5px,.5cqw) var(--ms-blue)}.ms-file{position:absolute;bottom:9%;left:50%;display:grid!important;width:34cqw;padding:3cqw 3.4cqw;border-radius:3cqw;background:linear-gradient(160deg,#f08cbc,#c94f8a);box-shadow:0 3cqw 6cqw -2cqw #000000b3;color:#3a0b22;transform:translate(-50%)}.ms-file b{font-size:max(12px,5cqw);font-weight:800;letter-spacing:-.02em}.ms-file small{overflow:hidden;font-size:max(9px,3cqw);font-weight:600;white-space:nowrap;text-overflow:ellipsis}.ms-cursor{position:absolute;bottom:6%;left:62%;width:6cqw;height:6cqw;background:#fff;clip-path:polygon(0 0,0 82%,24% 62%,40% 100%,54% 94%,38% 58%,70% 58%);filter:drop-shadow(0 1px 2px rgb(0 0 0 / .6))}[data-inview] .ms-file{animation:ms-drag 3.6s var(--ms-ease) infinite}[data-inview] .ms-cursor{animation:ms-cursor 3.6s var(--ms-ease) infinite}[data-inview] .ms-panel__slot{animation:ms-slot 3.6s var(--ms-ease) infinite}@keyframes ms-drag{0%,12%{opacity:1;transform:translate(-50%) scale(1)}48%{opacity:1;transform:translate(10cqw,-35cqw) scale(.4)}56%,to{opacity:0;transform:translate(10cqw,-35cqw) scale(.3)}}@keyframes ms-cursor{0%,12%{transform:translate(0)}48%{transform:translate(14cqw,-36cqw)}70%{transform:translate(14cqw,-36cqw)}to{transform:translate(0)}}@keyframes ms-slot{0%,50%{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.08)}70%,to{opacity:1;transform:scale(1)}}.ms-timeline{display:flex!important;flex-direction:column;justify-content:center;gap:1cqw;padding:0 7%}.ms-track{position:relative;display:grid!important;grid-template-columns:9cqw minmax(0,1fr);flex:none;align-items:center;height:11cqw}.ms-track em{color:var(--ms-muted);font-family:ui-monospace,SF Mono,SFMono-Regular,Menlo,Consolas,monospace;font-size:max(9px,3.2cqw)}.ms-clip{height:100%;overflow:hidden;padding:0 3cqw;border-radius:2cqw;font-size:max(9px,3.4cqw);font-weight:650;line-height:11cqw;white-space:nowrap;text-overflow:ellipsis}.ms-clip--mogrt{width:64%;margin-left:8%;background:linear-gradient(180deg,#f08cbc,#e06aa2);color:#3a0b22}.ms-clip--video{background:repeating-linear-gradient(90deg,rgb(255 255 255 / .12) 0 1px,transparent 1px 14cqw),linear-gradient(180deg,#5b8cff,#3a6be0)}.ms-track--audio{height:9cqw}.ms-clip--audio{background:repeating-linear-gradient(90deg,rgb(10 60 20 / .55) 0 .6cqw,transparent .6cqw 1.4cqw) 0 50% / 100% 50% no-repeat,linear-gradient(180deg,#3ccf6e,#26a653)}.ms-playhead{position:absolute;top:14%;bottom:14%;left:40%;width:max(1.5px,.5cqw);background:var(--ms-blue);box-shadow:0 0 2cqw var(--ms-blue)}[data-inview] .ms-clip--mogrt{animation:ms-drop 3.6s var(--ms-ease) infinite}[data-inview] .ms-playhead{animation:ms-play 3.6s linear infinite}@keyframes ms-drop{0%,8%{opacity:0;transform:translate(10cqw,-18cqw) scale(1.04)}34%,to{opacity:1;transform:none}}@keyframes ms-play{0%,30%{left:18%}to{left:92%}}.ms-panel--controls{inset:8% 12% auto;display:grid!important;gap:3.2cqw}.ms-panel--controls .ms-panel__tab{margin-bottom:.8cqw}.ms-row{display:grid!important;gap:1.6cqw}.ms-row small{color:var(--ms-muted);font-size:max(9px,3.2cqw);font-weight:500}.ms-row--toggle{grid-template-columns:minmax(0,1fr) auto;align-items:center}.ms-slider{position:relative;height:max(2px,.8cqw);border-radius:9px;background:linear-gradient(90deg,var(--ms-blue) var(--ms-at),rgb(255 255 255 / .16) var(--ms-at));--ms-at: 62%}.ms-slider i{position:absolute;top:50%;left:var(--ms-at);width:4cqw;height:4cqw;margin:-2cqw 0 0 -2cqw;border-radius:50%;background:#f5f5f7}.ms-slider--two{--ms-at: 34%}.ms-swatches{display:flex!important;gap:2cqw}.ms-swatches i{width:5cqw;height:5cqw;border-radius:1.4cqw;background:#f5f5f7}.ms-swatches i:nth-child(2){background:var(--ms-blue);box-shadow:0 0 0 max(1px,.5cqw) #f5f5f7}.ms-swatches i:nth-child(3){background:#30d158}.ms-toggle{position:relative;width:10cqw;height:5.6cqw;border-radius:9px;background:#30d158}.ms-toggle i{position:absolute;top:.6cqw;right:.6cqw;width:4.4cqw;height:4.4cqw;border-radius:50%;background:#fff}[data-inview] .ms-slider{animation:ms-slide 3.6s var(--ms-ease) infinite}[data-inview] .ms-slider--two{animation:ms-slide-two 3.6s var(--ms-ease) infinite}[data-inview] .ms-toggle{animation:ms-toggle-bg 3.6s var(--ms-ease) infinite}[data-inview] .ms-toggle i{animation:ms-toggle 3.6s var(--ms-ease) infinite}@property --ms-at{syntax: "<percentage>"; inherits: true; initial-value: 50%;}@keyframes ms-slide{0%,10%{--ms-at: 18%}40%,to{--ms-at: 62%}}@keyframes ms-slide-two{0%,30%{--ms-at: 80%}62%,to{--ms-at: 34%}}@keyframes ms-toggle-bg{0%,60%{background:#ffffff2e}72%,to{background:#30d158}}@keyframes ms-toggle{0%,60%{transform:translate(-4.4cqw)}72%,to{transform:none}}.ms-demo{background:radial-gradient(70% 80% at 30% 50%,rgb(41 151 255 / .1),transparent 72%),#0e0e10}.ms-demo .ms-demo__monitor{position:absolute;top:50%;left:4cqw;width:50cqw;transform:translateY(-50%)}.ms-demo .ms-demo__tab,.ms-demo .ms-demo__panel .eg-panel__tab{color:#d6d6d6;font-size:max(7.5px,2.75cqw);font-weight:600;white-space:nowrap}.ms-demo .ms-demo__tab{margin:0 0 1.6cqw}.ms-demo .ms-demo__view{position:relative;overflow:hidden;aspect-ratio:16 / 9;border-radius:1.4cqw;background:#000;box-shadow:inset 0 0 0 1px #ffffff14,0 3cqw 6cqw -3cqw #000c;container-type:size}.ms-demo .ms-demo__panel{position:absolute;top:6cqw;right:4cqw;bottom:6cqw;width:38cqw;overflow:hidden;border-radius:2cqw;box-shadow:inset 0 0 0 1px #ffffff14,0 3cqw 6cqw -3cqw #000c;-webkit-mask-image:linear-gradient(180deg,#000 82%,transparent);mask-image:linear-gradient(180deg,#000 82%,transparent)}.ms-demo .ms-demo__panel .eg-panel{--eg-font: max(7.5px, 2.75cqw);display:grid;height:100%;box-sizing:border-box}.mogrt-steps__facts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;margin:clamp(32px,4vw,48px) auto 0;padding:0;color:var(--ms-muted);font-size:15px;font-weight:500;list-style:none}.mogrt-steps__facts li{display:flex;align-items:center;gap:8px}.mogrt-steps__facts svg{width:18px;height:18px;color:#30d158}@media(prefers-reduced-motion:reduce){.mogrt-steps *{animation:none!important}}
/*# sourceMappingURL=/cdn/shop/t/224/assets/mogrt-steps.css.map */
