:root{--bg:#18191b;--surface:#26282b;--deep:#0f1011;--ink:#eff0f1;--muted:#a6a8ad;--accent:#d93436;--on-accent:#fff;--light:#eff0f1;--on-light:#18191b;--step-small:clamp(.875rem, .84rem + .1 * var(--vw), .9375rem);--step-body:clamp(1.0625rem, 1rem + .25 * var(--vw), 1.1875rem);--step-lead:clamp(1.25rem, 1.1rem + .7 * var(--vw), 1.625rem);--step-head:clamp(2rem, 1.3rem + 3.2 * var(--vw), 4rem);--step-display:clamp(3.5rem, 1rem + 6.4 * var(--vw), 6.5rem);--margin:clamp(16px, 2.5 * var(--vw), 32px);--gap:8px;--radius:24px;--tile-radius:28%;--section-gap:clamp(80px, 9 * var(--vw), 150px);--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--rise:24px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box}html{--vw:calc(1vw / var(--zoom,1));--vh:calc(1vh / var(--zoom,1));--svh:calc(1svh / var(--zoom,1));zoom:var(--zoom,1);scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--ink);font-family:Jost,system-ui,sans-serif;font-size:var(--step-body);-webkit-font-smoothing:antialiased;margin:0;line-height:1.5;overflow-x:clip;container-type:inline-size}img,svg{max-width:100%;display:block}h1,h2,h3,p,ul,ol,figure{margin:0;padding:0}ul,ol{list-style:none}a{color:inherit}:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:6px}::selection{background:var(--accent);color:var(--on-accent)}.sprite{position:absolute}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.wrap{padding-inline:var(--margin)}.display,.head{text-transform:uppercase;letter-spacing:-.03em;font-weight:700;line-height:.92}.display{font-size:var(--step-display)}.head{font-size:var(--step-head)}.lead{font-size:var(--step-lead);font-weight:500;line-height:1.2}.tone-accent{background:var(--accent);color:var(--on-accent)}.tone-light{background:var(--light);color:var(--on-light)}.tone-surface{background:var(--surface);color:var(--ink)}.tone-raised{color:var(--ink);background:#34373b}.tile{aspect-ratio:1;border-radius:var(--tile-radius);background:var(--accent);color:var(--on-accent);place-items:center;display:grid}.tile svg{fill:currentColor;width:56%;height:56%}.button{background:var(--accent);min-height:56px;color:var(--on-accent);transition:transform .16s var(--ease-out), background-color .16s var(--ease-out);border-radius:16px;align-items:center;gap:.5em;padding:0 28px;font-size:1.1875rem;font-weight:700;text-decoration:none;display:inline-flex}.button:hover{background:#e5383b;transform:translateY(-2px)}.button:active{transform:translateY(0)scale(.97)}.button--small{min-height:44px;font-size:var(--step-small);border-radius:12px;padding:0 18px}.button--ink{background:var(--bg);color:var(--ink)}.button--ink:hover{background:var(--deep)}.bar{z-index:2;align-items:center;gap:32px;min-height:88px;display:flex;position:relative}.mark{background:linear-gradient(135deg,#ff4d50e6,#d6282cd9);border:1px solid #ffffff59;border-radius:999px;align-items:center;height:48px;padding-inline:20px;display:inline-flex;box-shadow:inset 0 1px #ffffff73,0 8px 24px -8px #e5383b99}.mark img{width:auto;height:22px}.bar nav{font-size:var(--step-small);gap:28px;margin-left:auto;font-weight:500;display:flex}.bar nav a{transition:color .16s var(--ease-out);text-decoration:none}.bar nav a:hover{color:var(--muted)}.hero{min-height:calc(100 * var(--svh) - 88px);grid-template-columns:repeat(12,1fr);align-items:center;display:grid;position:relative;overflow:clip}.hero__wall{z-index:0;top:0;right:calc(-1 * var(--margin));grid-template-columns:repeat(3,1fr);gap:12px;display:grid;position:absolute;bottom:0;left:50%;overflow:hidden;-webkit-mask-image:linear-gradient(#0000,#000 14% 86%,#0000);mask-image:linear-gradient(#0000,#000 14% 86%,#0000)}.wall__track img{outline:1px solid color-mix(in srgb, var(--ink) 10%, transparent);outline-offset:-1px;border-radius:14px;width:100%;height:auto;margin-bottom:12px}html.js .wall__track{animation:wall-rise var(--wall-time,90s) linear infinite}.wall__col:nth-child(2){--wall-time:110s}.wall__col:nth-child(2) .wall__track{animation-direction:reverse}.wall__col:nth-child(3){--wall-time:100s}.hero__wall:hover .wall__track{animation-play-state:paused}@keyframes wall-rise{to{translate:0 -50%}}.hero__copy{z-index:1;grid-column:1/7;justify-items:start;gap:0;display:grid;position:relative}.hero__lead{max-width:34ch;font-size:var(--step-lead);margin-top:40px;line-height:1.35}.hero__lead [data-live]{font-variant-numeric:tabular-nums;font-weight:700}.hero .button{margin-top:40px}.tour{column-gap:var(--gap);margin-top:var(--section-gap);grid-template-rows:auto 1fr;grid-template-columns:repeat(12,1fr);display:grid}.tour__intro{padding-top:calc(12 * var(--svh));grid-area:1/1/auto/5}.tour__lead{max-width:28ch;font-size:var(--step-lead);margin-top:24px;line-height:1.35}.tour__list{padding-bottom:calc(10 * var(--svh));grid-area:2/1/auto/5}.tour__chapter{min-height:calc(80 * var(--svh));flex-direction:column;justify-content:center;gap:16px;display:flex}.tour__chapter h3{color:var(--muted);transition:color .3s}.tour__chapter p{max-width:30ch}.tour__chapter.is-active h3{color:var(--ink)}.tour__stage{height:calc(100 * var(--svh));grid-area:1/5/3/13;align-self:start;place-items:center;display:grid;position:sticky;top:0}.tour__tile{width:min(74 * var(--svh), 76%);translate:14% 8%;rotate:var(--turn,0deg);transition:background-color .4s ease, rotate .9s var(--ease-out);grid-area:1/1}.tour__tile[data-tone=light]{background:var(--light)}.tour__tile[data-tone=surface]{background:var(--surface)}.tour__tile[data-tone=raised]{background:#34373b}.tour__shots{aspect-ratio:1280/800;grid-area:1/1;width:100%;position:relative}.tour__shots img{opacity:0;border-radius:18px;width:100%;height:100%;position:absolute;inset:0}.tour__shots img.is-on{z-index:2;opacity:1}.tour__shots img.was-on{z-index:1;opacity:1}.tour__count{color:var(--muted);font-size:var(--step-small);font-weight:600;position:absolute;bottom:calc(100% + 16px);left:0}.tour__track{right:0;bottom:calc(4 * var(--svh));justify-self:stretch;gap:6px;display:flex;position:absolute;left:0}.tour__track a{flex:1;padding-block:14px}.tour__track span{background:var(--surface);border-radius:3px;height:6px;transition:background-color .18s;display:block;overflow:hidden}.tour__track span:after{content:"";background:var(--accent);transform-origin:0;height:100%;scale:clamp(0, calc(var(--p,0) - var(--i)), 1) 1;display:block}.tour__track a:hover span{background:#34373b}html:not(.js) .tour__shots img:not(.is-on){display:none}.steps{margin-top:var(--section-gap)}.steps h2{margin-bottom:64px}.steps__bar{gap:6px;display:flex}.showcase{gap:var(--gap);grid-template-columns:repeat(12,1fr);align-items:end;display:grid}.brand{margin-top:var(--section-gap)}.showcase img{border-radius:var(--radius);outline:1px solid color-mix(in srgb, var(--ink) 10%, transparent);outline-offset:-1px;grid-area:1/1/auto/9;width:100%;height:auto}.showcase figcaption{font-size:var(--step-body);grid-area:1/9/auto/13;gap:8px;padding-bottom:8px;display:grid}.steps__bar li{flex:var(--grow) 1 0;grid-template-rows:calc(22 * var(--vh)) auto;gap:16px;min-width:12%;display:grid}.steps__bar strong{font-size:var(--step-lead);transform-origin:0;border-radius:14px;padding:20px;font-weight:700;line-height:1.1;display:block}.steps__bar span{max-width:22ch}.steps__bar [data-tone=light] strong{background:var(--light);color:var(--on-light)}.steps__bar [data-tone=surface] strong{background:var(--surface)}.steps__bar [data-tone=ink] strong{background:var(--deep)}.steps__bar [data-tone=accent] strong{background:var(--accent);color:var(--on-accent)}.board{grid-template-columns:repeat(12,1fr);grid-auto-rows:104px;grid-auto-flow:dense;gap:var(--gap);margin-top:var(--section-gap);display:grid}.cell{border-radius:var(--radius);flex-direction:column;justify-content:flex-end;gap:4px;padding:20px;display:flex;position:relative;overflow:hidden}.cell h3{font-size:1.25rem;font-weight:700;line-height:1.2;position:relative}.cell p{max-width:34ch;font-size:1rem;line-height:1.4;position:relative}.cell--heading{grid-area:span 2/span 6;justify-content:flex-start;padding:0}.cell--6x4{grid-area:span 4/span 6}.cell--6x2{grid-area:span 2/span 6}.cell--3x4{grid-area:span 4/span 3}.cell--3x2{grid-area:span 2/span 3}.cell .tile{position:absolute;top:-28px;right:-28px}.tile--big{width:136px}.tile--huge{width:280px;top:-40px!important;right:-80px!important}.tone-accent .tile,.tile--ink{background:var(--bg);color:var(--ink)}@property --swing{syntax:"<number>";inherits:false;initial-value:0}@property --pan{syntax:"<number>";inherits:false;initial-value:0}@property --tempo-normal{syntax:"<number>";inherits:true;initial-value:1}@property --tempo-fast{syntax:"<number>";inherits:true;initial-value:0}@property --tempo-slow{syntax:"<number>";inherits:true;initial-value:0}@property --level{syntax:"<number>";inherits:false;initial-value:.5}@property --beat-normal{syntax:"<number>";inherits:false;initial-value:0}@property --beat-fast{syntax:"<number>";inherits:false;initial-value:0}@property --beat-slow{syntax:"<number>";inherits:false;initial-value:0}.eq{min-height:0;translate:calc(6% * var(--pan) * var(--swing)) 0;transition:--swing .9s var(--ease-in-out), --tempo-normal .6s var(--ease-in-out), --tempo-fast .6s var(--ease-in-out), --tempo-slow .6s var(--ease-in-out);flex:1;align-items:flex-end;gap:6px;margin-bottom:16px;display:flex}.eq span{flex:1;height:100%}.eq i{--beat:calc(var(--beat-normal) * var(--tempo-normal) + var(--beat-fast) * var(--tempo-fast) + var(--beat-slow) * var(--tempo-slow));background:var(--bg);height:100%;clip-path:inset(calc(100% - 100% * var(--level) * (1 - .38 * var(--beat))) 0 0 round 10px);transition:--level .8s var(--ease-in-out);display:block}.eq span:nth-child(5n+3) i{background:var(--light)}:is(.cell--eq:has([value=off]:checked) i,.cell--eq:has([value="8d"]:checked) i){--level:var(--off)}.cell--eq:has([value=bass]:checked) i{--level:var(--bass)}.cell--eq:has([value=nightcore]:checked) i{--level:var(--nightcore)}.cell--eq:has([value=vaporwave]:checked) i{--level:var(--vaporwave)}.cell--eq:has([value=slowed]:checked) i{--level:var(--slowed)}.cell--eq:has([value=karaoke]:checked) i{--level:var(--karaoke)}.cell--eq:has([value=chipmunk]:checked) i{--level:var(--chipmunk)}.cell--eq:has([value=pop]:checked) i{--level:var(--pop)}.cell--eq:has([value="8d"]:checked) .eq{--swing:1}.cell--eq:has([value=nightcore]:checked) .eq{--tempo-normal:0;--tempo-fast:1}:is(.cell--eq:has([value=vaporwave]:checked) .eq,.cell--eq:has([value=slowed]:checked) .eq){--tempo-normal:0;--tempo-slow:1}.chips{flex-wrap:wrap;gap:6px;margin-bottom:20px;display:flex;position:relative}.chips label{background:color-mix(in srgb, var(--bg) 24%, var(--accent));color:var(--on-accent);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .18s ease, color .18s ease, scale .14s var(--ease-out);border-radius:10px;padding:8px 14px;font-size:.9375rem;font-weight:600}.chips input{opacity:0;pointer-events:none;position:absolute}.chips label:hover{background:color-mix(in srgb, var(--bg) 42%, var(--accent))}.chips label:active{scale:.96}.chips label:has(:focus-visible){outline:3px solid var(--ink);outline-offset:2px}.chips label:has(:checked){background:var(--light);color:var(--on-light)}@media (prefers-reduced-motion:no-preference){.eq i{animation:.76s ease-in-out infinite alternate eq-beat-normal,.69s ease-in-out infinite alternate eq-beat-fast,.92s ease-in-out infinite alternate eq-beat-slow;animation-delay:calc(var(--k) * -173ms)}.eq{animation:2.4s ease-in-out infinite alternate eq-pan}}@keyframes eq-beat-normal{to{--beat-normal:1}}@keyframes eq-beat-fast{to{--beat-fast:1}}@keyframes eq-beat-slow{to{--beat-slow:1}}@keyframes eq-pan{0%{--pan:-1}to{--pan:1}}.stats{grid-template-columns:repeat(12,1fr);grid-template-rows:calc(14 * var(--vh)) calc(12 * var(--vh)) auto;column-gap:var(--gap);margin-top:var(--section-gap);display:grid}.stat{border-radius:var(--radius);border-top-right-radius:22%;flex-direction:column;justify-content:space-between;padding:28px;display:flex}.stat__figure{font-size:var(--step-display);letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-weight:700;line-height:.92}.stat__caption{max-width:24ch}.stat--tall{min-height:calc(70 * var(--vh));grid-area:1/1/4/7}.stats__title{grid-area:1/7/auto/13;align-self:center;padding-left:8px}.stat--mid{min-height:calc(44 * var(--vh));grid-area:2/7/4/10;align-self:start}.stat--low{min-height:calc(34 * var(--vh));grid-area:3/10/auto/13;align-self:start}.stat--mid .stat__figure,.stat--low .stat__figure{font-size:var(--step-head)}.plans{margin-top:var(--section-gap);grid-template-columns:5fr 7fr;display:grid}.plan{min-height:calc(90 * var(--svh));padding:40px max(var(--margin), 40px);flex-direction:column;gap:24px;display:flex}.plan__for{max-width:26ch;font-size:var(--step-lead);font-weight:500;line-height:1.25}.plan__body{max-width:52ch}.plan__foot{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:auto;display:flex}.plan__price{font-size:var(--step-body);align-items:baseline;gap:12px;font-weight:500;display:flex}.plan__price .display{text-transform:none}.faq{column-gap:var(--gap);margin-top:var(--section-gap);grid-template-columns:repeat(12,1fr);display:grid}.faq__title{grid-column:1/5;align-self:start;position:sticky;top:96px}.faq__list{gap:var(--gap);grid-column:5/13;display:grid}.faq details{background:var(--surface);transition:background-color .22s var(--ease-out);border-radius:20px}.faq summary{cursor:pointer;align-items:center;min-height:72px;padding:16px 72px 16px 24px;font-size:1.25rem;font-weight:500;list-style:none;display:flex;position:relative}.faq summary::-webkit-details-marker{display:none}.faq summary:before,.faq summary:after{content:"";width:16px;height:3px;transition:transform .22s var(--ease-out);background:currentColor;border-radius:2px;margin-top:-1.5px;position:absolute;top:50%;right:28px}.faq summary:after{transform:rotate(90deg)}.faq details[open]{background:var(--accent);color:var(--on-accent)}.faq details[open] summary:after{transform:rotate(0)}.faq details p{max-width:52ch;padding:0 24px 24px}.faq details:not([open]):hover{background:#2e3034}.close{height:360px;margin-top:var(--section-gap);grid-template-columns:2fr 8fr 2fr;gap:12px;display:grid}.close__main{border-radius:var(--radius);align-content:center;justify-items:start;gap:20px;padding:40px;display:grid}.close__main p{max-width:40ch}.close__side{border-radius:var(--radius);overflow:hidden}.close__side:first-child{border-top-left-radius:0;border-bottom-left-radius:0}.close__side:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.close__side img{object-fit:cover;object-position:70% 50%;width:100%;height:100%}.foot{margin-top:var(--section-gap);padding-bottom:32px}.foot__mark{height:calc(34 * var(--svh));align-items:flex-end;gap:4px;display:flex}.foot__mark .tile{aspect-ratio:auto;height:var(--h);color:var(--bg);font-size:min(16 * var(--vw), 30 * var(--svh));border-radius:22px;flex:1;align-items:end;padding-bottom:.02em;font-weight:700;line-height:1;overflow:hidden}.foot__mark .tile:nth-child(2n){background:var(--light)}.foot__mark .tile:nth-child(3n){background:var(--surface);color:var(--ink)}.foot__links{font-size:var(--step-small);grid-template-columns:repeat(4,1fr);gap:24px;margin-top:56px;display:grid}.foot__links ul{gap:10px;display:grid}.foot__links a{text-decoration:none}.foot__links a:hover{text-decoration:underline}.foot__last{font-size:var(--step-small);justify-content:space-between;align-items:center;gap:16px;margin-top:56px;display:flex}html.js [data-rise]{opacity:0;translate:0 var(--rise);transition:opacity .7s var(--ease-out) calc(var(--i,0) * 80ms), translate .7s var(--ease-out) calc(var(--i,0) * 80ms)}html.js .in [data-rise],html.js [data-rise].in{opacity:1;translate:0}html.js .tour__shots img.is-on{animation:wipe-down .9s var(--ease-in-out) both}html.js .tour[data-dir=up] .tour__shots img.is-on{animation-name:wipe-up}@keyframes wipe-down{0%{clip-path:inset(0 0 0 100% round 18px);scale:1.06}to{clip-path:inset(0 round 18px);scale:1}}@keyframes wipe-up{0%{clip-path:inset(0 100% 0 0 round 18px);scale:1.06}to{clip-path:inset(0 round 18px);scale:1}}@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.hero{view-timeline-name:--hero}.hero__wall{animation:linear both hero-sink;animation-timeline:--hero;animation-range:exit}.hero__copy{animation:linear both hero-lift;animation-timeline:--hero;animation-range:exit exit 70%}}}@keyframes hero-sink{to{transform:translateY(8%)scale(.94)}}@keyframes hero-lift{to{opacity:0;transform:translateY(-6%)}}html.js .hero__wall{opacity:0;transition:opacity .9s var(--ease-out) .25s}html.js .hero.in .hero__wall{opacity:1}html.js .steps__bar strong{transition:scale .9s var(--ease-out) calc(var(--i,0) * .14s);scale:0 1}html.js .steps.in .steps__bar strong{scale:1}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}html.js [data-rise],html.js .steps__bar strong{translate:none;rotate:none;scale:none}html.js .tour__shots img.is-on,html.js .wall__track{animation:none}*,:before,:after{transition-duration:1ms!important;transition-delay:0s!important}}@container (width<=1100px){.hero{align-content:start;align-items:start}.hero__copy{padding-top:calc(10 * var(--svh));grid-area:1/1/auto/13}.hero__wall{height:min(80 * var(--vw), 720px);grid-area:2/1/auto/13;margin-top:56px;position:relative;inset:auto}.tour{display:block}.tour__intro{padding-top:0}.tour__stage{place-items:normal;height:auto;margin-top:40px;display:block;position:relative}.tour__tile,.tour__count{display:none}.tour__track{position:static}.tour__list{gap:var(--gap);scroll-snap-type:x mandatory;scrollbar-width:none;padding-top:8px;display:flex;overflow-x:auto}.tour__list::-webkit-scrollbar{display:none}.tour__chapter{border-radius:var(--radius);background:var(--surface);scroll-snap-align:start;flex:0 0 min(80%,440px);justify-content:flex-start;gap:12px;min-height:0;padding:24px}.board{grid-template-columns:repeat(6,1fr)}.steps__bar{flex-direction:column}.showcase img,.showcase figcaption{grid-area:auto/1/auto/-1}.steps__bar li{grid-template-rows:auto;min-width:0}.steps__bar strong{min-height:max(72px, calc(var(--grow) * .7 * var(--svh)));transform-origin:top}html.js .steps__bar strong{scale:1 0}.stats{grid-template-rows:auto;grid-template-columns:1fr 1fr;gap:28px 6px}.stats__title{grid-area:1/1/auto/3;padding:0 0 16px}.stat--tall{min-height:calc(56 * var(--vw));grid-area:2/1/auto/3}.stat--tall .stat__figure{font-size:calc(15 * var(--vw))}.stat--mid,.stat--low{min-height:calc(52 * var(--vw));grid-row:3;padding:18px}.stat--mid{grid-column:1}.stat--low{grid-column:2;margin-top:32px}.stat--mid .stat__figure,.stat--low .stat__figure{font-size:min(7 * var(--vw), 4rem)}.stat__caption{font-size:.9375rem}.cell--heading,.cell--6x4,.cell--6x2{grid-column:span 6}}@container (width<=720px){.bar{gap:16px;min-height:72px}.bar nav{display:none}.bar .button--small{margin-left:auto}.mark{height:40px;padding-inline:16px}.mark img{height:18px}.hero{min-height:0;padding-bottom:calc(12 * var(--vw));align-items:start}.hero__wall{height:calc(120 * var(--vw));grid-template-columns:repeat(2,1fr);margin-top:40px}.wall__col:nth-child(3){display:none}.wall__track img{border-radius:10px}.hero__copy{padding-top:calc(8 * var(--svh))}.hero__copy h1{font-size:calc(15 * var(--vw))}.hero__lead{font-size:var(--step-body);margin-top:24px}.hero .button{margin-top:24px}.steps h2{font-size:calc(11 * var(--vw));margin-bottom:32px}.board{grid-template-columns:repeat(2,1fr);grid-auto-rows:calc(28 * var(--vw));gap:6px}.cell--heading{grid-area:span 2/span 2}.cell--heading h2{font-size:calc(11 * var(--vw))}.cell--6x4,.cell--6x2,.cell--3x4{grid-area:span 3/span 2}.cell--3x2{grid-area:span 2/span 1}.cell--eq{grid-row:span 5}.eq{gap:4px}.cell{padding:14px}.cell h3{font-size:1rem}.cell p{font-size:.875rem}.tile--big{width:96px}.cell--3x2 .tile{display:none}.cell--3x2{justify-content:space-between}.cell--3x2 h3{font-size:1.25rem}.plans{grid-template-columns:1fr}.plan--premium{order:-1}.plan{min-height:calc(70 * var(--svh));padding:24px 20px}.plan__name{font-size:calc(12 * var(--vw))}.plan__foot .button{justify-content:center;width:100%}.faq__title{font-size:calc(11 * var(--vw));grid-column:1/13;margin-bottom:24px;position:static}.faq__list{grid-column:1/13;gap:6px}.faq summary{min-height:64px;font-size:1.125rem}.close{height:auto;padding-inline:var(--margin);grid-template-rows:300px 120px;grid-template-columns:1fr 1fr;gap:8px}.close__main{grid-area:1/1/auto/3;padding:24px}.close__side{grid-row:2;border-radius:var(--radius)!important}.foot__mark{height:calc(22 * var(--svh))}.foot__mark .tile{font-size:calc(17 * var(--vw));border-radius:12px}.foot__links{grid-template-columns:1fr 1fr}}
