.learn-engineering-scrim{background:radial-gradient(ellipse closest-side at 50% 50%, color-mix(in oklab, var(--background) 98%, transparent) 0%, color-mix(in oklab, var(--background) 98%, transparent) 84%, color-mix(in oklab, var(--background) 62%, transparent) 93%, transparent 100%)}.learn-hero-mesh{background:radial-gradient(ellipse 42% 46% at 12% 16%, color-mix(in oklab, var(--ss-logo-gold) 24%, transparent), transparent 62%), radial-gradient(ellipse 34% 36% at 30% 42%, color-mix(in oklab, var(--ss-gold-text) 14%, transparent), transparent 64%), radial-gradient(ellipse 30% 26% at 22% 88%, color-mix(in oklab, var(--ss-gold-text) 6%, transparent), transparent 64%)}.dark .learn-hero-mesh{background:radial-gradient(ellipse 42% 46% at 12% 16%, color-mix(in oklab, var(--ss-logo-gold) 10%, transparent), transparent 62%), radial-gradient(ellipse 34% 36% at 30% 42%, color-mix(in oklab, var(--ss-gold-text) 7%, transparent), transparent 64%)}.learn-hero-halo{background:color-mix(in oklab, var(--ss-logo-gold) 26%, transparent)}.dark .learn-hero-halo{background:color-mix(in oklab, var(--ss-logo-gold) 14%, transparent)}@keyframes learn-hero-cue-rise{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes learn-hero-cue-rise-deep{0%{opacity:0;transform:translateY(60px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:no-preference){.learn-hero-cue-1{animation:.3s cubic-bezier(.22,1,.36,1) .2s both learn-hero-cue-rise}.learn-hero-cue-2{animation:.3s cubic-bezier(.22,1,.36,1) .3s both learn-hero-cue-rise}.learn-hero-cue-3{animation:.3s cubic-bezier(.22,1,.36,1) .4s both learn-hero-cue-rise}.learn-hero-cue-4{animation:.6s cubic-bezier(.22,1,.36,1) .6s both learn-hero-cue-rise-deep}}.learn-hero-scene{aspect-ratio:602/315;width:130%;margin-inline-start:calc(-16px - 6.5%)}.learn-hero-tablet{aspect-ratio:1480/925;z-index:2;width:74%;top:0;left:5%}.learn-hero-phone{aspect-ratio:860/1864;z-index:3;width:22.6%;bottom:0;left:60%}.learn-hero-tablet>*,.learn-hero-phone>*{border-color:color-mix(in srgb, var(--border) 85%, transparent);box-shadow:0 1px 0 color-mix(in srgb, var(--background) 30%, transparent) inset, 0 2px 4px color-mix(in oklab, var(--foreground) 8%, transparent), 0 22px 44px -18px color-mix(in oklab, var(--foreground) 30%, transparent)}.dark .learn-hero-tablet>*,.dark .learn-hero-phone>*{border-color:color-mix(in srgb, var(--border) 60%, transparent);box-shadow:0 1px 0 color-mix(in srgb, var(--card) 50%, transparent) inset, 0 2px 4px color-mix(in oklab, var(--background) 55%, transparent), 0 22px 44px -18px color-mix(in oklab, var(--background) 80%, transparent)}@keyframes learn-hero-swap-a{0%,44.118%{opacity:1}50%,94.118%{opacity:0}to{opacity:1}}@keyframes learn-hero-swap-b{0%,44.118%{opacity:0}50%,94.118%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:no-preference){.learn-hero-swap-a{animation:10.2s ease-in-out 1.4s infinite both learn-hero-swap-a}.learn-hero-swap-b{animation:10.2s ease-in-out 1.4s infinite both learn-hero-swap-b}}@media (prefers-reduced-motion:reduce){.learn-hero-swap-b{display:none}}@media (width>=1024px){.learn-hero-scene{--learn-hero-fold-chrome:32.125rem;aspect-ratio:1100/637.5;width:100%;max-width:max(22.5rem, calc((100svh - var(--learn-hero-fold-chrome)) * 1100 / 637.5));margin-inline:auto}.learn-hero-tablet{width:90.9091%;top:0;left:0}.learn-hero-phone{width:18.1818%;bottom:0;left:81.8182%}}@layer components{.learn-waitlist-arrival{outline-offset:3px;outline-width:3px;outline-style:solid;animation:.34s cubic-bezier(.4,0,1,1) .52s both learn-waitlist-arrival-fade}@keyframes learn-waitlist-arrival-fade{0%{outline-color:color-mix(in oklab, var(--ss-logo-gold) 70%, transparent)}to{outline-color:#0000}}@keyframes learn-waitlist-arrival-hold{0%,to{outline-color:color-mix(in oklab, var(--ss-logo-gold) 70%, transparent)}}@media (prefers-reduced-motion:reduce){.learn-waitlist-arrival{animation:.86s step-end both learn-waitlist-arrival-hold}}}
