.landing-page{overflow:clip}.landing-hero{min-height:clamp(53rem,62vw,74rem);padding:clamp(3rem, 8vw, 9rem) var(--sonik-page-gutter) 3rem;isolation:isolate;position:relative}.landing-hero-artwork{z-index:0;width:100%;height:92%;fill:var(--sonik-ink);opacity:.15;position:absolute;top:clamp(-7rem,-1.57rem - 4.42vw,-4.4rem);left:0;overflow:visible}.landing-hero-content{z-index:1;text-align:center;justify-items:center;width:100%;min-width:0;display:grid;position:relative}.landing-hero-title{color:var(--sonik-blue);font-family:var(--sonik-font-display);font-size:var(--sonik-display-xl);letter-spacing:-.055em;margin:0;font-weight:900;line-height:.82}.landing-hero-subtitle{margin:clamp(1.5rem,4vw,3.5rem) 0 0;font-size:clamp(1.55rem,5.25vw,6.3rem);font-weight:700;line-height:.98}.landing-hero-cta{width:min(63.5rem,78vw);margin-top:clamp(3rem,10vw,12rem)}.landing-hero-cta .sonik-button{border-width:clamp(.25rem,.52vw,.625rem);border-radius:clamp(1.3rem,3.6vw,4.25rem);width:100%;min-height:clamp(7rem,14.2vw,17rem);overflow:hidden}.landing-hero-cta-label{letter-spacing:-.04em;justify-content:center;width:100%;font-size:clamp(2.5rem,8.75vw,10.5rem);line-height:.85;display:flex}.landing-hero-cta-label>span{transform-origin:50%;display:inline-block;transform:scaleX(.6184)}.benefit-flow{padding:0 var(--sonik-page-gutter) var(--sonik-section-gap)}.benefit-flow h2,.how-it-works h2{text-align:center;max-width:96rem;margin:0 auto clamp(2rem,5vw,5rem);font-size:clamp(2.25rem,5.5vw,6.6rem);line-height:1.02}.benefit-flow ol{--benefit-arrow-space:clamp(4rem, 6vw, 7rem);gap:var(--benefit-arrow-space);grid-template-columns:repeat(4,1fr);margin:0;padding:0;list-style:none;display:grid}.benefit-flow li{background:#00000026;border-radius:2rem;align-items:center;min-height:11rem;padding:1rem;font-size:clamp(1.125rem,2.3vw,2.75rem);display:flex;position:relative}.benefit-flow li b{top:50%;right:calc(-1 * var(--benefit-arrow-space));width:var(--benefit-arrow-space);color:#00000059;place-items:center;font-size:clamp(2rem,4vw,4.5rem);line-height:1;display:grid;position:absolute;transform:translateY(-50%)}.benefit-flow>p{margin-top:clamp(1rem,3vw,3rem);font-size:clamp(1rem,1.25vw,1.5rem)}.how-it-works{min-height:clamp(62rem,107vw,128rem);padding:0 var(--sonik-page-gutter) var(--sonik-section-gap)}.how-it-works-video{aspect-ratio:1.94;background:var(--sonik-panel-deep);cursor:pointer;border:0;place-items:center;width:min(78vw,93.6rem);margin-inline:auto;display:grid}.how-it-works-video span{aspect-ratio:1;width:clamp(5rem,15.8vw,19rem);color:var(--sonik-panel);background:#00000073;border-radius:50%;place-items:center;padding-left:.1em;font-size:clamp(2.25rem,7vw,8rem);display:grid}@media (width<=55rem){.landing-hero{min-height:47rem;padding-top:4rem}.landing-hero-cta{width:min(100%,33rem);min-width:0;max-width:100%;margin-top:8rem}.landing-hero-artwork{height:68vw;top:calc(.5rem - 8.9vw)}.benefit-flow ol{grid-template-columns:1fr 1fr}.benefit-flow li:nth-child(3){grid-area:2/2}.benefit-flow li:nth-child(4){grid-area:2/1}.benefit-flow li:nth-child(2) b{width:100%;height:var(--benefit-arrow-space);font-size:0;top:100%;right:0;transform:none}.benefit-flow li:nth-child(2) b:before{content:"↓";font-size:clamp(2rem,4vw,4.5rem)}.benefit-flow li:nth-child(3) b{right:auto;left:calc(-1 * var(--benefit-arrow-space));font-size:0}.benefit-flow li:nth-child(3) b:before{content:"←";font-size:clamp(2rem,4vw,4.5rem)}.how-it-works{min-height:53rem}.how-it-works-video{width:100%}}@media (width<=34rem){.landing-hero{padding-bottom:3rem;min-height:auto;padding-inline:1rem}.landing-hero-subtitle{width:min(100%,22rem)}.landing-hero-cta{margin-top:3rem}.landing-hero-cta .sonik-button{min-height:5rem}.landing-hero-cta-label{white-space:nowrap;font-size:clamp(2.5rem,13vw,4rem)}.benefit-flow ol{grid-template-columns:1fr}.benefit-flow li,.benefit-flow li:nth-child(3),.benefit-flow li:nth-child(4){grid-area:auto;min-height:7rem}.benefit-flow li b,.benefit-flow li:nth-child(2) b,.benefit-flow li:nth-child(3) b{width:100%;height:var(--benefit-arrow-space);font-size:0;top:100%;left:auto;right:0;transform:none}.benefit-flow li b:before,.benefit-flow li:nth-child(2) b:before,.benefit-flow li:nth-child(3) b:before{content:"↓";font-size:clamp(2rem,8vw,3rem)}.how-it-works{min-height:38rem}}
