@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/inter/regular.woff2) format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/inter/semibold.woff2) format("woff2")}
:root{--ink:#0a0a0a;--muted:#4a4a4a;--line:#e4e0d8;--paper:#fbfaf7;--soft:#faf0fe;--violet:#9c00c9;--violet-deep:#5e0094;--blue:#1d4ed8;--rose:#be123c;--amber:#b45309;--emerald:#047857;--cyan:#0e7490;--lime:#bef264;--aurora:linear-gradient(120deg,#5e0094 0%,#9c00c9 100%);--aurora-hover:linear-gradient(120deg,#4a0075 0%,#7d00ae 100%);--create:var(--violet);--approve:var(--blue);--schedule:var(--rose);--results:var(--emerald);--display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI Variable Display","Segoe UI",system-ui,sans-serif;--sans:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--sans);overflow-x:hidden}
img{max-width:100%;height:auto}
a{color:var(--violet-deep);text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--violet);outline-offset:3px;border-radius:4px}
::selection{background:#f0cdfb;color:#4a0075}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:16px;top:-80px;background:var(--ink);color:#fff;padding:12px 18px;border-radius:999px;z-index:20}
.skip-link:focus{top:12px}
.site-header,.site-footer,main>section{width:100%;max-width:1280px;margin-inline:auto;padding-inline:16px}
.site-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding-block:18px}
.brand{display:inline-flex;align-items:center;grid-column:2}
.brand img{display:block;height:46px;width:auto}
@media (max-width:420px){.brand img{height:38px}}
main{display:block}
main>section{padding-block:56px;text-align:center}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:-.035em;margin:0;overflow-wrap:break-word;text-wrap:balance}
h1{font-size:clamp(2.5rem,10vw,5.4rem);line-height:1.03;letter-spacing:-.045em;max-width:16ch;margin-inline:auto}
h2{font-size:clamp(2rem,7vw,3.1rem);line-height:1.1}
h3{font-size:1.3rem;line-height:1.2;font-weight:600;letter-spacing:-.02em}
.eyebrow{display:inline-block;margin:0 0 18px;padding:4px 16px;border:1px solid #d9b6ea;border-radius:999px;background:rgba(255,255,255,.7);font:600 .95rem/1.6 var(--display);letter-spacing:.01em;color:var(--violet-deep)}
.grad{background:linear-gradient(100deg,#5e0094 10%,#9c00c9 55%,#d946ef 90%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.lead{font-size:1.15rem;line-height:1.55;color:var(--muted);max-width:40rem;margin:20px auto 0;text-wrap:pretty}
.bar{display:block;height:6px;border-radius:3px;background:#e6e1d8}
.w40{width:40%}.w45{width:45%}.w50{width:50%}.w60{width:60%}.w70{width:70%}.w75{width:75%}.w80{width:80%}.w90{width:90%}

/* Hero */
.hero{position:relative;padding-top:36px;isolation:isolate}
.hero>*{position:relative;z-index:1}
.aurora{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.aurora::before{content:"";position:absolute;inset:-25%;background:radial-gradient(90% 70% at 15% 10%,rgba(214,160,240,.38),rgba(214,160,240,0) 70%),radial-gradient(80% 75% at 90% 45%,rgba(165,190,255,.32),rgba(165,190,255,0) 72%),radial-gradient(85% 70% at 45% 95%,rgba(255,200,180,.30),rgba(255,200,180,0) 70%);animation:wash 40s ease-in-out infinite alternate}
@keyframes wash{from{transform:translate3d(0,0,0) rotate(0deg)}to{transform:translate3d(-4%,3%,0) rotate(6deg)}}
.blob{display:none}
.blob{position:absolute;width:max(560px,62vw);height:max(560px,62vw);border-radius:50%;background:radial-gradient(circle,var(--c) 0,transparent 68%);opacity:.6;animation:drift 24s ease-in-out infinite alternate}
.b1{--c:#d9a0f0;left:-18vw;top:-22vw}
.b2{--c:#a9c3ff;right:-22vw;top:18vh;animation-duration:30s;animation-delay:-8s}
.b3{--c:#ffcdb8;left:18vw;bottom:-34vw;animation-duration:27s;animation-delay:-14s}
.grain{position:absolute;inset:0;width:100%;height:100%;opacity:.08;mix-blend-mode:multiply}
@keyframes drift{from{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(1.08)}to{transform:translate(-30px,40px) scale(.96)}}
.signup{margin:30px auto 0;max-width:640px;outline:none}
.waitlist-form{display:grid;gap:14px;justify-items:center}
.pill{display:flex;align-items:center;gap:8px;width:100%;padding:7px;background:#fff;border:2px solid var(--ink);border-radius:999px;box-shadow:5px 5px 0 var(--ink)}
.pill:focus-within{outline:3px solid var(--violet);outline-offset:3px}
.field{flex:1;min-width:0}
input[type=email]{width:100%;min-height:52px;padding:0 20px;font:inherit;color:var(--ink);background:transparent;border:0;border-radius:999px;outline:none}
input[type=email]::placeholder{color:#6b6b6b}
.field-error{width:100%;max-width:30rem;margin:0;color:#b00020;font-size:.9rem;line-height:1.4;text-align:left}
.consent{display:flex;gap:12px;align-items:flex-start;max-width:30rem;text-align:left}
.consent input{flex:none;width:22px;height:22px;margin:2px 0 0;accent-color:var(--violet)}
.consent label{font-size:.95rem;line-height:1.5;color:var(--muted)}
.cf-turnstile{min-height:0;max-width:100%;overflow:hidden}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border:2px solid transparent;border-radius:999px;font:600 1rem/1 var(--sans);text-decoration:none;cursor:pointer;white-space:nowrap;transition:background-color .15s,transform .15s}
.button.primary{background:var(--aurora);color:#fff;box-shadow:0 8px 20px -10px rgba(156,0,201,.6)}
.button.primary:hover:not(:disabled){background:var(--aurora-hover);transform:translateY(-1px)}
.button:disabled{opacity:.6;cursor:progress}
.motion-toggle{min-height:44px;margin:12px auto 0;padding:8px 16px;border:1px solid var(--violet-deep);border-radius:999px;background:#fff;color:var(--violet-deep);font:600 .9rem/1.2 var(--sans);cursor:pointer}
.motion-toggle:hover{background:#f7eefb}
.motion-toggle:focus-visible,.cf-turnstile:focus-visible{outline:3px solid var(--violet);outline-offset:3px}
.form-status{margin:0;min-height:1.5em;font-weight:600;color:var(--ink)}
.form-status[data-state=error]{color:#b00020}
.form-status[data-state=success]{color:var(--emerald)}
.small-print{margin:6px 0 0;font-size:.9rem;color:var(--muted)}

/* Transmutation stage */
.stage-wrap{--k:1;position:relative;height:calc(570px*var(--k));margin:20px auto 0;overflow:clip}
.stage{position:absolute;left:50%;top:0;width:880px;height:570px;margin-left:-440px;transform:scale(var(--k));transform-origin:50% 0}
.stage-halo{position:absolute;left:50%;top:50%;width:780px;height:420px;margin:-210px 0 0 -390px;border:1.5px dashed rgba(94,0,148,.28);border-radius:50%}
.orb{position:absolute;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;z-index:3}
.orb::before{content:"";position:absolute;inset:6px;z-index:-1;border-radius:50%;background:conic-gradient(#5e0094,#9c00c9,#0e7490,#be123c,#b45309,#5e0094);animation:spin 9s linear infinite}
.orb-glow{position:absolute;inset:-46px;z-index:-2;border-radius:50%;background:radial-gradient(circle,rgba(156,0,201,.8) 0,rgba(94,0,148,.4) 40%,transparent 70%);filter:blur(6px);animation:glow 3.2s ease-in-out infinite}
.orb-core{position:absolute;inset:14px;display:grid;place-items:center;border-radius:50%;background:#fff;box-shadow:inset 0 0 22px rgba(156,0,201,.3)}
.orb-core img{width:64px;height:64px}
.orb-flash{position:absolute;inset:0;z-index:2;border-radius:50%;background:radial-gradient(circle,#fff 0,rgba(190,242,100,.9) 35%,rgba(156,0,201,0) 70%);opacity:0}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes glow{0%,100%{transform:scale(.9);opacity:.75}50%{transform:scale(1.1);opacity:1}}
@keyframes flash{0%{opacity:0;transform:scale(.4)}25%{opacity:1}100%{opacity:0;transform:scale(3.6)}}
@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.18)}100%{transform:scale(1)}}
.idea-note{--ny:112px;--nr:0deg;--ns:1;position:absolute;left:50%;top:50%;z-index:4;width:226px;margin:-28px 0 0 -113px;padding:8px 12px 9px;background:#fff;border:2px solid var(--ink);border-radius:14px;box-shadow:3px 3px 0 var(--ink);text-align:left;font:600 13px/1.35 var(--sans);transform:translateY(var(--ny)) rotate(var(--nr)) scale(var(--ns))}
.note-label{display:inline-block;margin-right:8px;padding:0 7px;border-radius:99px;background:var(--lime);color:#1f2d09;font-size:10px;text-transform:uppercase;letter-spacing:.06em}
.is-typing .note-text::after{content:"";display:inline-block;width:2px;height:1em;margin-left:2px;vertical-align:-2px;background:var(--violet);animation:blink .8s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.pcard{--px:var(--x);--py:var(--y);--pr:var(--r);--ps:var(--s,1);position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%) translate(var(--px),var(--py)) rotate(var(--pr)) scale(var(--ps))}
.pc-in{position:relative;display:grid;gap:6px;padding:8px 9px 12px;background:#fff;border:1px solid #e6e1d8;border-top:5px solid var(--acc);border-radius:12px;box-shadow:0 12px 26px -14px rgba(30,0,50,.5);font-size:11px;line-height:1.35;text-align:left;animation:bob 5s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-.7s)}
@keyframes bob{from{transform:translateY(0)}to{transform:translateY(-7px)}}
.pc-name{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--acc)}
.pc-text{display:block;font-weight:600}
.pc-img{position:relative;display:block;border-radius:6px;background:radial-gradient(ellipse at 38% 32%,#fde7b0 0,#e9a64d 45%,#a8662a 100%)}
.pc-img.sq{aspect-ratio:1}.pc-img.wide{aspect-ratio:16/9}.pc-img.tall{aspect-ratio:9/14}.pc-img.pin{aspect-ratio:3/4}
.play{position:absolute;left:50%;top:50%;width:0;height:0;margin:-7px 0 0 -4px;border:7px solid transparent;border-left:11px solid #fff}
.stamp{position:absolute;right:-9px;bottom:-10px;padding:2px 7px;border:1.5px solid var(--emerald);border-radius:6px;background:#ecfdf5;color:#065f46;font:700 10px/1.3 var(--sans);white-space:nowrap;transform:rotate(-6deg)}
.posted{position:absolute;right:-8px;top:-12px;display:flex;align-items:center;gap:5px;padding:2px 8px 2px 6px;border-radius:99px;background:var(--ink);color:#fff;font:600 10px/1.3 var(--sans);white-space:nowrap}
.posted i{width:7px;height:7px;border-radius:50%;background:var(--lime);animation:dot 1.6s ease-out infinite}
@keyframes dot{0%{transform:scale(1);opacity:1}70%{transform:scale(1.6);opacity:.5}100%{transform:scale(1);opacity:1}}
.c1{--x:0px;--y:-180px;--r:-2deg;--i:0;--acc:var(--rose);width:168px}
.c2{--x:240px;--y:-142px;--r:4deg;--i:1;--acc:var(--violet);width:124px}
.c3{--x:366px;--y:-26px;--r:-3deg;--i:2;--acc:var(--cyan);width:98px}
.c4{--x:324px;--y:104px;--r:3deg;--i:3;--acc:var(--amber);width:102px}
.c5{--x:132px;--y:196px;--r:-3deg;--i:4;--acc:var(--blue);width:152px}
.c6{--x:-132px;--y:196px;--r:3deg;--i:5;--acc:var(--cyan);width:142px}
.c7{--x:-324px;--y:104px;--r:-4deg;--i:6;--acc:var(--ink);width:142px}
.c8{--x:-366px;--y:-26px;--r:3deg;--i:7;--acc:var(--emerald);width:142px}
.c9{--x:-240px;--y:-142px;--r:-3deg;--i:8;--acc:var(--blue);width:164px}
/* With script the cycle is staged by classes; without it, or with reduced motion, the finished composition shows. */
.is-live .idea-note{--ny:-250px;--nr:-6deg;opacity:0;transition:transform .8s cubic-bezier(.3,1.4,.5,1),opacity .4s}
.is-live.is-idea .idea-note{--ny:-136px;--nr:-2deg;opacity:1}
.is-live.is-flash .idea-note{--ny:0px;--nr:0deg;--ns:.15;opacity:0;transition:transform .35s ease-in,opacity .35s}
.is-live.is-flash .orb-flash{animation:flash .8s ease-out}
.is-live.is-flash .orb-core{animation:pop .5s ease-out}
.is-live .pcard{--px:0px;--py:0px;--pr:0deg;--ps:.1;opacity:0;transition:transform .9s cubic-bezier(.2,1.25,.4,1),opacity .35s;transition-delay:calc(var(--i)*70ms)}
.is-live.is-burst .pcard{--px:var(--x);--py:var(--y);--pr:var(--r);--ps:var(--s,1);opacity:1}
.is-live .stamp{opacity:0;transform:rotate(-6deg) scale(1.9);transition:opacity .2s,transform .35s cubic-bezier(.3,1.7,.5,1);transition-delay:calc(var(--i)*.24s)}
.is-live.is-approved .stamp{opacity:1;transform:rotate(-6deg) scale(1)}
.is-live .posted{opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s;transition-delay:calc(var(--i)*.11s)}
.is-live.is-posted .posted{opacity:1;transform:none}
.is-live.is-fade .pcard{opacity:0;transition:opacity .7s;transition-delay:0s}
.is-snap,.is-snap *{transition:none!important}
.is-paused *,.is-paused *::before,.is-paused *::after,.is-paused::before,.is-paused::after{animation-play-state:paused!important}

/* Old way vignette and pain cards */
.problem h2{font-size:clamp(2.2rem,8vw,3.8rem)}
.oldway{position:relative;max-width:820px;aspect-ratio:12/5;margin:36px auto 0;overflow-x:clip;overflow-y:visible}
.win{--r:0deg;--jx:5px;--jy:4px;position:absolute;width:38%;background:#fff;border:1.5px solid var(--ink);border-radius:10px;box-shadow:3px 3px 0 var(--ink);text-align:left;transform:rotate(var(--r));animation:jitter var(--dur,7s) ease-in-out infinite alternate}
@keyframes jitter{0%{transform:translate(0,0) rotate(var(--r))}30%{transform:translate(var(--jx),calc(var(--jy)*-1)) rotate(calc(var(--r) + 1.2deg))}60%{transform:translate(calc(var(--jx)*-.7),var(--jy)) rotate(calc(var(--r) - 1deg))}100%{transform:translate(calc(var(--jx)*.4),calc(var(--jy)*.5)) rotate(var(--r))}}
.w1{left:3%;top:6%;--r:-3deg;--dur:6s;z-index:1}
.w2{left:27%;top:28%;--r:2deg;--dur:8s;--jx:-6px;z-index:2}
.w3{left:58%;top:6%;--r:3deg;--dur:7s;--jy:-5px;z-index:3}
.w4{left:12%;top:56%;--r:2deg;--dur:9s;z-index:4}
.w5{left:52%;top:48%;--r:-2deg;--dur:6.5s;--jx:7px;z-index:5}
.win-bar{display:flex;align-items:center;gap:4px;padding:5px 8px;background:#efe6ff;border-bottom:1.5px solid var(--ink);border-radius:8px 8px 0 0}
.win-bar i{width:7px;height:7px;border-radius:50%;background:var(--ink)}
.win-bar b{margin-left:6px;font-size:11px}
.win-body{display:grid;gap:5px;padding:9px 8px 10px}
.notif{position:absolute;right:12px;top:10px;z-index:8;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;border:1.5px solid var(--ink)}
.notif b{position:absolute;top:-7px;right:-8px;min-width:22px;height:22px;padding:0 5px;border-radius:11px;background:#b00020;color:#fff;font:700 12px/22px var(--sans);text-align:center;animation:bump 1.1s ease-in-out infinite}
@keyframes bump{50%{transform:scale(1.18)}}
.toast{position:absolute;right:5%;bottom:7%;z-index:9;display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:10px;background:#b00020;color:#fff;font:600 13px/1.2 var(--sans);box-shadow:0 10px 24px -10px rgba(176,0,32,.7);opacity:0;animation:toast 12s ease-in-out infinite}
.toast i{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#fff;color:#b00020;font:700 12px/1 var(--sans)}
@keyframes toast{0%,60%{opacity:0;transform:scale(.6)}64%{opacity:1;transform:scale(1.1)}67%,88%{opacity:1;transform:scale(1)}92%,100%{opacity:0;transform:scale(.9)}}
.cursor{position:absolute;inset:0;z-index:7;pointer-events:none;animation:roam 12s ease-in-out infinite}
.arrow{position:absolute;left:0;top:0}
@keyframes roam{0%,14%{transform:translate(9%,12%)}26%,38%{transform:translate(62%,16%)}50%{transform:translate(32%,42%)}62%{transform:translate(58%,64%)}74%,86%{transform:translate(18%,74%)}100%{transform:translate(9%,12%)}}
.chip{position:absolute;left:20px;top:22px;padding:2px 9px;border-radius:99px;font:700 11px/1.5 var(--sans);opacity:0}
.chip-copy{background:var(--lime);color:#1f2d09;animation:chipA 12s ease-in-out infinite}
.chip-paste{background:var(--ink);color:#fff;animation:chipB 12s ease-in-out infinite}
@keyframes chipA{0%,2%,13%,49%,59%,100%{opacity:0;transform:translateY(5px)}4%,11%,51%,57%{opacity:1;transform:none}}
@keyframes chipB{0%,27%,38%,62%,73%,100%{opacity:0;transform:translateY(5px)}29%,36%,64%,71%{opacity:1;transform:none}}
.pains{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:16px}
.pains li{padding:24px 22px;border-radius:20px;background:var(--ink);color:#fff;border-top:6px solid var(--pain,var(--violet))}
.pains li[data-pain="1"]{--pain:#e879f9;--d:0s}.pains li[data-pain="2"]{--pain:#60a5fa;--d:.12s}.pains li[data-pain="3"]{--pain:#fb7185;--d:.24s}.pains li[data-pain="4"]{--pain:#34d399;--d:.36s}
.pain-icon{display:inline-grid;place-items:center;width:56px;height:56px;margin-bottom:14px;border-radius:16px;background:rgba(255,255,255,.09);color:var(--pain)}
.pains h3{color:#fff}.pains p{margin:10px 0 0;color:#e8e8e8;font-size:.97rem;line-height:1.55}
.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .6s var(--d,0s),transform .7s var(--d,0s) cubic-bezier(.2,.8,.2,1),translate .25s,rotate .25s,box-shadow .25s}
.js .reveal.is-visible{opacity:1;transform:none}

/* One idea in */
.turn-card{max-width:960px;margin:0 auto;padding:48px 24px;}
.swap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;margin-top:36px}
.swap-before{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.mini{padding:4px 11px;border:1px solid #b9b3a6;border-radius:99px;background:#fbfaf7;color:var(--muted);font-size:12px;line-height:1.5}
.mini:nth-child(odd){rotate:-5deg}.mini:nth-child(even){rotate:4deg}.mini:nth-child(3n){translate:0 5px}
.swap-arrow{color:var(--violet-deep)}
.one{display:grid;gap:8px;max-width:210px;margin:0 auto;padding:16px;text-align:left;background:#fff;border:2px solid var(--ink);border-radius:16px;box-shadow:5px 5px 0 var(--violet)}
.one b{font:700 1.3rem/1 var(--display);letter-spacing:-.03em}
.ok{justify-self:start;padding:2px 10px;border-radius:99px;background:#ecfdf5;border:1.5px solid var(--emerald);color:#065f46;font:700 12px/1.5 var(--sans)}

/* How it works */
.steps{position:relative;list-style:none;margin:48px 0 0;padding:0;display:grid;gap:28px}
.steps::before,.steps::after{content:"";position:absolute;border-radius:2px}
.steps::before{background:var(--line)}
.steps::after{background:var(--aurora);transition:transform 1.6s ease .2s}
.steps li{position:relative;padding:0 6px}
.step-number{position:relative;z-index:1;display:inline-grid;place-items:center;width:36px;height:36px;margin-bottom:12px;border-radius:50%;background:var(--tone,var(--violet));color:#fff;font-weight:600;font-size:.95rem;box-shadow:0 0 0 6px var(--paper);transition:transform .5s cubic-bezier(.3,1.7,.5,1) calc(var(--n,0)*.35s + .2s)}
.steps li:nth-child(2){--n:1}.steps li:nth-child(3){--n:2}.steps li:nth-child(4){--n:3}
.steps li[data-tone=create]{--tone:var(--create)}.steps li[data-tone=approve]{--tone:var(--approve)}.steps li[data-tone=schedule]{--tone:var(--schedule)}.steps li[data-tone=results]{--tone:var(--results)}
.steps p{margin:10px 0 0;color:var(--muted)}
.js .steps:not(.is-visible) .step-number{transform:scale(0)}
.steps::before,.steps::after{left:17px;top:18px;bottom:18px;width:3px;transform-origin:top}
.js .steps:not(.is-visible)::after{transform:scaleY(0)}
.steps li{padding-left:58px;text-align:left}
.steps .step-number{position:absolute;left:0;top:0}

/* Platform list */
.marquee{margin-top:28px}
.track{display:flex;width:auto;justify-content:center}
.group{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:0;padding:6px 0;list-style:none}
.group+.group{display:none}
.group li{display:flex;align-items:center;gap:9px;padding:12px 22px;border:1.5px solid var(--ink);border-radius:999px;background:#fff;font-weight:600;font-size:.97rem;white-space:nowrap}
.group i{width:10px;height:10px;border-radius:50%;background:var(--dot,var(--violet))}
.group li[data-p="2"]{--dot:var(--blue)}.group li[data-p="3"]{--dot:var(--rose)}.group li[data-p="4"]{--dot:var(--amber)}.group li[data-p="5"]{--dot:var(--emerald)}.group li[data-p="6"]{--dot:var(--cyan)}

/* Peace of mind */
.cards{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:16px}
.cards li{padding:26px 22px;border:1px solid #ecd0f7;border-radius:20px;background:var(--soft)}
.cards li[data-card="2"]{background:#e8f0ff;border-color:#c9d9fb;--d:.1s}
.cards li[data-card="3"]{background:#ffe8ee;border-color:#f6c6d3;--d:.2s}
.cards li[data-card="4"]{background:#e3f6ee;border-color:#bfe6d4;--d:.3s}
.cards p{margin:10px 0 0;color:var(--muted)}
.cards li:hover{translate:0 -8px;rotate:-1.2deg;box-shadow:0 22px 34px -22px rgba(30,0,50,.55)}
.cards li:nth-child(even):hover{rotate:1.2deg}

/* FAQ */
.faq{max-width:780px}
.faq h2{margin-bottom:20px}
.faq details{border-top:1px solid var(--line);text-align:left}
.faq details:last-of-type{border-bottom:1px solid var(--line)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:8px 0;font-weight:600;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font:400 1.8rem/1 var(--sans);color:var(--violet-deep);transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 18px;color:var(--muted);max-width:42rem}
.faq details[open] p{animation:faq .35s ease-out}
@keyframes faq{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* Closing call to action */
.closing{position:relative;overflow:hidden;isolation:isolate;width:calc(100% - 32px);margin-block:24px 56px;padding:56px 20px;border-radius:28px;background:#12021c;color:#fff}
.closing>:not(.cl-blob){position:relative}
.closing h2{color:#fff}
.closing .lead{color:#eadcf3}
.cl-blob{position:absolute;z-index:-1;width:520px;height:520px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(156,0,201,.75),transparent 65%);animation:drift 18s ease-in-out infinite alternate}
.cl-blob.a{left:-140px;top:-220px}
.cl-blob.b{right:-160px;bottom:-260px;background:radial-gradient(circle,rgba(14,116,144,.6),transparent 65%);animation-delay:-9s}
.closing .button.primary{margin-top:28px;background:#fff;color:var(--violet-deep);box-shadow:none}
.closing .button.primary:hover{background:#f3e8ff}
.closing :focus-visible{outline-color:#fff}

.site-footer{padding-block:32px 48px;border-top:1px solid var(--line);color:var(--muted);font-size:.9rem;text-align:center}
.site-footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 8px}
.site-footer nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;color:var(--ink)}
.site-footer p{margin:12px 0 0}
.action-card{max-width:36rem;margin-block:40px;padding:28px 20px}
.action-card .actions{margin-top:28px}
.action-card .home-link{margin:20px 0 0}
.action-card .form-status{margin-top:20px}

/* Mobile stage: a tighter fan */
@media(max-width:959px){.stage-wrap{--k:.85}}
@media(max-width:799px){.stage-wrap{--k:.68}}
@media(max-width:639px){
.pill{flex-direction:column;align-items:stretch;border-radius:28px;padding:8px}
.pill input[type=email]{text-align:center}
.pill .button{width:100%}
/* Phones: the orb sits at the top and the nine posts land in a tidy three-column grid below it, so nothing overlaps. */
.stage-wrap{--k:1;height:calc(700px*var(--k))}
.stage{width:340px;height:700px;margin-left:-170px}
.stage-halo{display:none}
.orb,.pcard,.idea-note{top:130px}
.orb{width:92px;height:92px;margin:-46px 0 0 -46px}
.orb-core{inset:9px}.orb-core img{width:40px;height:40px}
.orb-glow{inset:-30px}
.idea-note{--ny:-86px;width:240px;margin:-24px 0 0 -120px;font-size:12px}
.is-live .idea-note{--ny:-190px}.is-live.is-idea .idea-note{--ny:-86px}.is-live.is-flash .idea-note{--ny:0px}
.pcard{width:104px}
.pc-img.tall{aspect-ratio:3/4}.pc-img.pin{aspect-ratio:4/5}
.c3{--x:-114px;--y:161px;--r:-2deg}.c5{--x:0px;--y:162px;--r:1.5deg}.c4{--x:114px;--y:158px;--r:2deg}
.c2{--x:-114px;--y:350px;--r:1.5deg}.c1{--x:0px;--y:331px;--r:-1.5deg}.c9{--x:114px;--y:343px;--r:-2deg}
.c7{--x:-114px;--y:505px;--r:-1.5deg}.c8{--x:0px;--y:505px;--r:2deg}.c6{--x:114px;--y:505px;--r:-1deg}
.swap{grid-template-columns:1fr}.swap-arrow{rotate:90deg;justify-self:center}
.oldway{aspect-ratio:1/1.05}
.win{width:50%}
.w1{left:2%;top:4%}.w2{left:30%;top:23%}.w3{left:46%;top:3%}.w4{left:5%;top:55%}.w5{left:44%;top:47%}
.toast{right:4%;bottom:4%}
}
@media(max-width:374px){.stage-wrap{--k:.9}}
@media(min-width:640px){
body{font-size:18px}
.site-header,.site-footer,main>section{padding-inline:32px}
.cards,.pains{grid-template-columns:repeat(2,1fr)}
.closing{width:calc(100% - 64px);padding:80px 32px}
.turn-card{padding:60px 40px}
}
@media(min-width:720px){
.steps{grid-template-columns:repeat(4,1fr);gap:24px}
.steps::before,.steps::after{left:12.5%;right:12.5%;top:17px;bottom:auto;width:auto;height:3px;transform-origin:left}
.js .steps:not(.is-visible)::after{transform:scaleX(0)}
.steps li{padding:0 6px;text-align:center}
.steps .step-number{position:relative}
}
@media(min-width:960px){
main>section{padding-block:80px}
.hero{padding-top:56px}
.cards,.pains{grid-template-columns:repeat(4,1fr)}
.closing{max-width:1216px}
}
.sent-dialog{width:min(420px,calc(100% - 32px));padding:32px 28px 28px;border:0;border-radius:24px;background:#fff;color:var(--ink);text-align:center;box-shadow:0 30px 70px -20px rgba(40,0,70,.45)}
.sent-dialog[open]{animation:sent-pop .35s cubic-bezier(.2,.9,.3,1.2)}
.sent-dialog::backdrop{background:rgba(18,2,28,.45);backdrop-filter:blur(4px)}
.sent-dialog h2{font-size:1.6rem;margin:14px 0 8px}
.sent-dialog p{margin:0 0 22px;color:var(--muted);line-height:1.55}
.sent-dialog .button{min-width:140px}
.sent-icon{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;color:#fff;background:linear-gradient(135deg,#5e0094,#9c00c9)}
@keyframes sent-pop{from{opacity:0;transform:translateY(12px) scale(.94)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{transition:none!important;animation:none!important}
.js .reveal,.js .steps:not(.is-visible) .step-number,.js .steps:not(.is-visible)::after{opacity:1;transform:none}
.toast,.chip-copy{opacity:1}
.cursor{transform:translate(60%,18%)}
}
