/* v3: Aspekta type, cleaner headings, the cinematic hero, the real Quanta artwork. */
@font-face{font-family:"Aspekta";src:url("../assets/fonts/AspektaVF.woff2") format("woff2");font-weight:50 1000;font-style:normal;font-display:swap}

:root{
  --f-display:"Aspekta",ui-sans-serif,system-ui,sans-serif;
  --f-sans:"Aspekta",ui-sans-serif,system-ui,sans-serif;
  --f-acc:"Aspekta",ui-sans-serif,system-ui,sans-serif;
}
body{font-feature-settings:"ss01","cv01";letter-spacing:.005em}
#grain{opacity:.05}

/* headings: one weight, tight, two tones instead of italic accents */
.display,.h2,.h1like{font-weight:500;font-variation-settings:normal;letter-spacing:-.038em}
.display{font-size:clamp(44px,5.8vw,92px);line-height:.98}
.h2{font-size:clamp(36px,4.4vw,68px);line-height:1}
.h1like{font-size:clamp(42px,5.4vw,86px);line-height:.98}
.acc{font-family:inherit;font-style:normal;font-weight:inherit;letter-spacing:inherit;color:var(--fg-soft);white-space:normal;padding:0;font-variation-settings:normal}
.display .acc{color:var(--fg-soft)}
.kicker,.eyebrow{font-size:11.5px;letter-spacing:.16em}
.lede,.sub{font-size:clamp(16px,1.2vw,18px);line-height:1.6}
.btn{font-weight:500;letter-spacing:.005em}
.nav-links{font-size:14px}
.cap .cap-t{font-family:var(--f-display);font-weight:500;letter-spacing:-.025em}
.clock{font-family:var(--f-display);font-weight:400;letter-spacing:-.05em}
.unread-n,.price b,.pl-price b,.xcard strong{font-family:var(--f-display);font-weight:500}
.pl h3{font-family:var(--f-display);font-weight:500}
.spec-name{font-family:var(--f-display);font-weight:500}
.foot-line{font-family:var(--f-display);font-weight:500}
.quote blockquote::before{font-family:var(--f-display);font-style:normal}

/* ---------- hero: pinned, drawn on one canvas */
[data-bg=hero]{--fg:var(--ink);--fg-soft:#7A7166;--fg-line:rgba(22,17,14,.12);color:var(--fg)}
html:not(.gl) [data-bg=hero]{background:#EEE8D9}
.hero{height:330vh;min-height:0;display:block;padding:0;overflow:visible}
.hero>.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
#qcv{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-copy{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center;gap:24px;padding-top:40px;pointer-events:none}
.hero-copy>*{max-width:560px;pointer-events:auto}
.hero .lede{max-width:44ch}
.hero .call{position:absolute;right:max(var(--gut),calc((100vw - 1320px)/2 + var(--gut)));left:auto;bottom:9vh;width:320px;z-index:3;background:rgba(18,14,12,.8)}
.hero .call-log{display:none}
.hero .trust{position:static;display:flex;flex-direction:column;align-items:flex-start;gap:12px;border-top:1px solid rgba(22,17,14,.1);padding:20px 0 0;margin-top:10px;max-width:520px}
.hero .trust-row{gap:22px;flex-wrap:nowrap}
.hero .trust-row img{height:18px}.hero .trust-row img[alt=doplac]{height:22px}.hero .trust-row img[alt=Queue]{height:15px}
.hero .trust p{color:#7A7166}
.hero .trust-row img{filter:brightness(0) saturate(0);opacity:.6;height:21px}
.hero .trust-row img[alt=doplac]{height:25px}.hero .trust-row img[alt=Queue]{height:18px}
.inside{position:absolute;left:0;right:0;top:clamp(96px,16vh,150px);color:var(--cream);display:flex;flex-direction:column;gap:14px;visibility:hidden;--fg-soft:rgba(243,239,230,.55)}
.inside .h2{max-width:12ch}
.inside .sub{color:rgba(243,239,230,.62);max-width:40ch}
.inside .kicker{color:rgba(243,239,230,.6)}
.inside-count{font-family:var(--f-mono);font-size:12.5px;letter-spacing:.06em;color:rgba(243,239,230,.55);margin-top:6px}
.inside-count b{color:#FF7A5C;font-weight:500;font-size:15px}
.stream{position:absolute;inset:0;pointer-events:none}
.ev{position:absolute;left:0;top:0;display:flex;flex-direction:column;gap:4px;padding:10px 13px 11px;min-width:200px;max-width:260px;border-radius:12px;background:rgba(10,12,22,.62);border:1px solid rgba(243,239,230,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--cream);opacity:0;will-change:transform}
.ev::after{content:"";position:absolute;left:13px;width:1px;background:linear-gradient(rgba(245,54,44,.0),rgba(245,54,44,.7))}
.ev.up::after{top:100%;height:46px}
.ev:not(.up)::after{bottom:100%;height:30px;background:linear-gradient(rgba(245,54,44,.7),rgba(245,54,44,0))}
.ev b{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#FF7A5C;font-weight:500}
.ev span{font-size:14px;line-height:1.35}
.ev time{font-family:var(--f-mono);font-size:11px;color:rgba(243,239,230,.45)}
@media (max-width:900px){
  .hero-copy{justify-content:flex-start;padding-top:96px;gap:16px}
  .hero .call{right:16px;left:16px;width:auto;bottom:4vh}
  .hero .trust{display:none}
  .ev{min-width:170px;max-width:200px;padding:8px 10px}.ev span{font-size:12.5px}
  .inside{top:92px}
}

/* ---------- the real Quanta artwork in light sections */
.qp-wrap{overflow:visible}
.qp{position:absolute;left:50%;bottom:0;height:100%;width:auto;max-width:none;transform-origin:50% 100%;translate:-50% 0;-webkit-mask-image:radial-gradient(ellipse 58% 64% at 50% 42%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 58% 64% at 50% 42%,#000 62%,transparent 100%);opacity:0}
.ops .qp{height:118%;bottom:-10%}
.close .qp{height:118%;bottom:-8%}
/* the closing portrait: the clean cut-out, fading softly into the page instead of ending in an edge */
.close .qp-cut{-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 52%,rgba(0,0,0,.55) 70%,transparent 90%);mask-image:linear-gradient(to bottom,#000 0,#000 52%,rgba(0,0,0,.55) 70%,transparent 90%)}
.close .close-stage::before{content:"";position:absolute;left:50%;top:6%;width:min(520px,90%);aspect-ratio:1;translate:-50% 0;border-radius:50%;background:radial-gradient(closest-side,rgba(245,120,70,.22),rgba(245,120,70,.08) 55%,transparent);pointer-events:none}
@media (max-width:1199px),(orientation:portrait) and (max-width:1300px){.ops .qp-wrap{display:none}}
.sig{white-space:nowrap}

/* ---------- everything you get */
.features{padding-block:clamp(110px,15vh,160px) clamp(90px,12vh,140px)}
.fx-wrap{max-width:1440px;margin-inline:auto;padding-inline:clamp(16px,3.4vw,48px)}
.fx-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px;align-items:end}
.fx-head>div{display:flex;flex-direction:column;gap:16px}
.fx-head .h2{max-width:16ch}
.fx-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-top:44px;padding-bottom:18px;border-bottom:1px solid rgba(243,239,230,.1)}
.fx-tabs button{all:unset;cursor:pointer;display:flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:999px;border:1px solid rgba(243,239,230,.12);color:rgba(243,239,230,.7);font-size:14px;font-weight:500;transition:all .3s}
.fx-tabs button i{font-style:normal;font-family:var(--f-mono);font-size:11px;color:rgba(243,239,230,.4)}
.fx-tabs button:hover{border-color:rgba(243,239,230,.3);color:var(--cream)}
.fx-tabs button.on{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.fx-tabs button.on i{color:rgba(22,17,14,.5)}
.fx-body{display:grid;grid-template-columns:300px minmax(0,1fr);gap:36px;margin-top:28px;align-items:start}
.fx-list{display:flex;flex-direction:column;gap:4px}
.fx-it{all:unset;cursor:pointer;position:relative;display:grid;grid-template-columns:30px 1fr;gap:12px;padding:12px 14px;border-radius:14px;color:rgba(243,239,230,.6);transition:background .3s,color .3s;overflow:hidden}
.fx-it:hover{background:rgba(243,239,230,.04);color:var(--cream)}
.fx-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:rgba(243,239,230,.06);color:rgba(243,239,230,.7)}
.fx-ic svg{width:16px;height:16px}
.fx-tx b{display:block;font-size:16px;font-weight:500;line-height:30px;color:inherit}
.fx-tx em{font-style:normal;font-size:14px;line-height:1.5;color:rgba(243,239,230,.55);display:none}
.fx-it.on{background:rgba(243,239,230,.06);color:var(--cream)}
.fx-it.on .fx-ic{background:var(--signal);color:#fff}
.fx-it.on .fx-tx em{display:block;margin-bottom:4px}
.fx-bar{position:absolute;left:14px;right:14px;bottom:0;height:2px;background:rgba(243,239,230,.08);display:none}
.fx-bar b{display:block;height:100%;background:var(--signal);transform-origin:0 50%;transform:scaleX(0)}
.fx-it.on .fx-bar{display:block}
.fx-win{position:relative;width:100%;border-radius:16px;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 60px 120px -50px rgba(0,0,0,.9)}
.fx-zoom{position:relative;width:900px;height:580px}
.fx-scr{position:absolute;inset:0;display:none}
.fx-scr.on{display:block}
@media (max-width:1000px){
  .fx-head{grid-template-columns:1fr}
  .fx-body{grid-template-columns:1fr;gap:16px}
  .fx-list{flex-direction:row;overflow-x:auto;gap:6px;scrollbar-width:none;margin-inline:-16px;padding-inline:16px}
  .fx-it{grid-template-columns:24px auto;padding:8px 12px;flex:none}
  .fx-ic{width:24px;height:24px}
  .fx-tx b{line-height:24px;font-size:14px}
  .fx-it.on .fx-tx em{display:none}
  .fx-tabs{flex-wrap:wrap;gap:6px;margin-top:28px;padding-bottom:14px}
  .fx-tabs button{flex:none;height:34px;padding:0 13px;font-size:13px}
  .fx-list{-webkit-mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 28px),transparent)}
  .fx-list{position:relative}
  .fx-list::-webkit-scrollbar{display:none}
  .fx-desc{display:block!important}
}

/* ---------- a day on the job: real app windows over a real sky */
.day{height:520vh}
.day .stage{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.win3{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;visibility:hidden;will-change:opacity}
.win3-in{position:relative;width:1000px;height:620px;flex:none;border-radius:14px;box-shadow:0 50px 100px -40px rgba(0,0,0,.55),0 20px 40px -24px rgba(0,0,0,.4)}
.brief3{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:"Poppins",sans-serif;color:#1A1A1E}
.brief3 .b2-card{opacity:1;width:560px;padding:26px 28px;border-radius:22px;font-size:15px}
.brief3 .b2-top b{font-size:19px}.brief3 .b2-list li{font-size:15px;padding:12px 0;opacity:0}
.day .clock{font-weight:300}
.day .cap .cap-t{font-size:clamp(22px,1.9vw,30px)}
.r-head b{background:var(--signal)}
@media (max-width:900px){.day{height:460vh}}
.win3.bare .win3-in{box-shadow:none}
.brief3 .b2-card{box-shadow:0 50px 100px -40px rgba(0,0,0,.55)}

/* app windows fitted with zoom (sharp text) */
.setup-win,.ask-win{display:flex;align-items:center;justify-content:center}
.setup-in{position:relative;left:auto;top:auto;transform:none;flex:none}
.ask-z{position:relative;width:960px;height:580px;flex:none;border-radius:14px;box-shadow:0 50px 100px -40px rgba(22,17,14,.55)}
.ask-z .k-main{padding:0}
.ag{font-family:"Poppins",sans-serif}
/* shorter scroll */
.ops{height:330vh}.ask-sec{height:300vh}.anywhere{height:240vh}.setup{height:300vh}.job{height:200vh}
@media (max-width:900px){
  .day .stage{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);padding:80px 16px 96px;gap:10px}
  .day .clock{font-size:56px}
  .day .caps{min-height:96px}
  .day .cap .cap-d{display:none}
  .day .cap .cap-t{font-size:19px}
  .win3-in{width:760px;height:600px}
  .ask-reqs li{white-space:normal;align-items:flex-start;font-size:13.5px}
  .ask-reqs li span{min-width:0}
  .you{white-space:normal;max-width:calc(100vw - 32px)}
  .you span{font-size:11.5px}
}
/* the full-size app windows must never widen the page on phones */
.fx-win{overflow:hidden}
.features,.stack,.pricing,.founders{overflow-x:clip}

/* ---------- hero v4: Quanta in front of a live Earth */
.hero3{position:relative;height:100vh;height:100svh;min-height:680px;overflow:hidden;color:var(--cream);--fg:var(--cream);--fg-soft:rgba(243,239,230,.62);--fg-line:rgba(243,239,230,.14)}
html:not(.gl) [data-bg=hero]{background:#0B0A0F}
.hero3 #storm,.hero3 #stormFront,.hero3 #arcs{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.hero3 #storm{z-index:1}
.hero3 #stormFront{z-index:3}
.hero3 #errs{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;z-index:4}
.hero3 #arcs{z-index:2;pointer-events:none}
.q-fig{position:absolute;z-index:3;left:63.5%;bottom:-2%;height:min(98%,1000px);aspect-ratio:896/1200;pointer-events:none;will-change:transform;-webkit-mask-image:linear-gradient(to bottom,#000 70%,transparent 99%);mask-image:linear-gradient(to bottom,#000 70%,transparent 99%)}
.q-fig img{display:block;width:100%;height:100%;filter:drop-shadow(0 40px 60px rgba(0,0,0,.5))}
.q-win{position:absolute;left:38.28%;top:16.75%;width:27.01%;height:auto;aspect-ratio:1;border-radius:50%}
.ev-cards{position:absolute;inset:0;z-index:4;pointer-events:none}
.evc{position:absolute;left:0;top:0;width:250px;padding:10px 12px 11px;border-radius:12px;background:rgba(14,12,16,.72);border:1px solid rgba(243,239,230,.1);backdrop-filter:blur(12px) saturate(1.3);-webkit-backdrop-filter:blur(12px) saturate(1.3);box-shadow:0 20px 40px -24px rgba(0,0,0,.9);opacity:0;will-change:transform,opacity}
.evc-h{display:flex;justify-content:space-between;gap:8px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(243,239,230,.5)}
.evc-h b{color:#FF7A5C;font-weight:500}
.evc-t{margin-top:4px;font-size:13.5px;line-height:1.35;color:var(--cream)}
.evc-r{display:flex;align-items:center;gap:7px;margin-top:6px;font-size:12.5px;color:rgba(243,239,230,.4);transition:color .4s}
.evc-r i{width:14px;height:14px;border-radius:50%;border:1.3px solid rgba(243,239,230,.3);position:relative;flex:none;transition:all .4s}
.evc.done .evc-r{color:rgba(243,239,230,.9)}
.evc.done .evc-r i{background:var(--signal);border-color:var(--signal)}
.evc.done .evc-r i::after{content:"";position:absolute;left:4px;top:1.5px;width:3.5px;height:7px;border:solid #fff;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.hero3 .hero-copy{position:absolute;inset:0;z-index:5;display:flex;align-items:center;pointer-events:none;padding-top:40px}
.hero-inner{display:flex;flex-direction:column;gap:22px;max-width:540px;pointer-events:auto}
.hero3 .eyebrow{color:rgba(243,239,230,.6)}
.hero3 .eyebrow b{color:var(--cream);font-weight:500}
.hero3 .display .acc{color:rgba(243,239,230,.5)}
.hero3 .lede{color:rgba(243,239,230,.66)}
.hero3 .btn-ghost{border-color:rgba(243,239,230,.18);color:var(--cream)}
.hero3 .trust{position:static;display:flex;flex-direction:column;gap:12px;border-top:1px solid rgba(243,239,230,.1);padding-top:20px;margin-top:6px}
.hero3 .trust p{color:rgba(243,239,230,.45)}
.hero3 .trust-row{gap:22px;flex-wrap:wrap}
.hero3 .trust-row img{filter:brightness(0) invert(1);opacity:.55;height:18px}
.hero3 .trust-row img[alt=doplac]{height:22px}.hero3 .trust-row img[alt=Queue]{height:15px}
.hero3 .call{position:absolute;z-index:6;right:max(var(--gut),calc((100vw - 1320px)/2 + var(--gut)));left:auto;bottom:7vh;width:310px;background:rgba(14,12,16,.78)}
@media (max-width:900px){
  .hero3{height:auto;min-height:0;padding:92px 0 0}
  .hero3 .hero-copy{position:relative;inset:auto;padding-top:0}
  .hero-inner{gap:16px}
  .hero3 .trust{display:none}
  .q-fig{position:relative;left:50%;bottom:auto;height:auto;width:min(92vw,440px);margin-top:24px}
  .hero3 .call{right:16px;left:16px;width:auto;bottom:16px}
}
.hero3 .hero-copy{flex-direction:row;justify-content:flex-start;align-items:center}

/* ---------- Ask it and Setup: headline on top, a big sharp window below */
.ask-sec .stage,.setup .stage{display:block}
.ask-grid,.setup-grid{display:flex;flex-direction:column;height:100%;padding-top:clamp(92px,11vh,112px);padding-bottom:24px;gap:18px}
.ask-copy,.setup-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 48px;align-items:end;flex:none}
.ask-copy .kicker,.setup-copy .kicker{grid-column:1/-1}
.ask-copy .h2,.setup-copy .h2{font-size:clamp(34px,3.6vw,56px)}
.ask-copy .sub,.setup-copy .sub{justify-self:end;max-width:52ch;font-size:15.5px}
.ask-reqs{grid-column:1/-1;flex-direction:row;gap:10px;border:0;margin:10px 0 0;flex-wrap:wrap}
.ask-reqs li{border:1px solid var(--line);border-radius:999px;padding:9px 16px 9px 12px;font-size:14px;background:var(--panel)}
.ask-reqs li.on{border-color:var(--ink)}
.setup-steps{grid-column:1/-1;display:flex;flex-direction:row;gap:10px;border:0;margin:10px 0 0;flex-wrap:wrap}
.setup-steps li{border:1px solid var(--fg-line);border-radius:999px;padding:7px 16px 7px 8px;font-size:14px}
.setup-copy .stopwatch{grid-column:1/-1}
.ask-win,.setup-win{flex:1;min-height:0;height:auto;position:relative;display:flex;align-items:center;justify-content:center}
.ask-z{box-shadow:0 40px 90px -40px rgba(22,17,14,.6)}
.setup-in{box-shadow:0 40px 90px -40px rgba(0,0,0,.8);border-radius:14px}
@media (max-width:900px){
  .ask-copy,.setup-copy{grid-template-columns:1fr}
  .ask-copy .sub,.setup-copy .sub{display:none}
  .ask-reqs li{font-size:12.5px;padding:6px 12px 6px 9px}
  .setup-steps li{font-size:12.5px}
}
.ask-grid,.setup-grid{align-items:stretch}
.day-art{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;pointer-events:none}
.day .day-left,.day .day-right,.day .ruler{position:relative;z-index:1}
.day .ruler{position:absolute}
/* sun and moon dial above the clock */
.sky-dial{position:relative;width:min(300px,100%);aspect-ratio:300/160;margin-top:auto;margin-bottom:-6px}
.sky-dial svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sd-arc{fill:none;stroke:var(--fg-soft);stroke-width:1.2;stroke-dasharray:3 6;opacity:.6}
.sd-hz{stroke:var(--fg);stroke-width:1.2;opacity:.35}
.sd-sun,.sd-moon{position:absolute;left:0;top:0;width:38px;height:38px;border-radius:50%;opacity:0}
.sd-sun{background:radial-gradient(circle at 40% 38%,#FFE3A6,#FFB45C 55%,#FF8A3D);box-shadow:0 0 0 6px rgba(255,170,80,.18),0 0 40px 12px rgba(255,150,60,.45)}
.sd-moon{width:30px;height:30px;background:radial-gradient(circle at 34% 34%,#FBF6EA,#E4DCCB 60%,#C9BFA9);box-shadow:inset -6px -4px 0 rgba(0,0,0,.08),0 0 30px 8px rgba(200,210,255,.25)}
.day .clock{margin-top:0}
@media (max-width:900px){.sky-dial{display:none}}

/* ---------- prompt card in the logo drop */
.drop-wrap{position:relative}
.drop-wrap .drop{margin-top:28px;width:100%;padding:0;border-bottom:0}   /* no floor line: the logos still land on the invisible floor */
.pc{position:absolute;z-index:3;left:var(--gut);bottom:0;width:min(470px,calc(100% - 2 * var(--gut)));padding:18px 20px 18px;border-radius:20px 20px 0 0;background:#111013;color:var(--cream);border:1px solid #2A2724;border-bottom:0;box-shadow:0 40px 80px -40px rgba(22,17,14,.7);font-size:14px}
.pc-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:12px;border-bottom:1px solid rgba(243,239,230,.1)}
.pc-tools{display:flex;align-items:center;gap:12px}
.pc-tools img{height:15px;width:auto;filter:invert(1) grayscale(1) brightness(1.7)}
.pc-tools img[alt=Lovable]{filter:none;height:18px;background:#fff;border-radius:5px;padding:2px 5px}
.pc-tools img[alt=Bolt]{filter:none;height:18px;border-radius:4px}
.pc-rp{font-size:12.5px;font-weight:600;color:#F26207}
.pc-copy{all:unset;cursor:pointer;height:30px;padding:0 12px;border-radius:8px;border:1px solid rgba(243,239,230,.18);font-size:12.5px;font-weight:500;display:inline-flex;align-items:center;transition:background .3s,border-color .3s}
.pc-copy:hover{border-color:rgba(243,239,230,.4)}
.pc-copy.done{background:var(--signal);border-color:var(--signal)}
.pc-label{margin-top:12px;font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(243,239,230,.45)}
.pc-prompt{margin-top:6px;min-height:6.6em;font-size:14.5px;line-height:1.55;color:#EDE8DF}
.pc-prompt.typing::after{content:"";display:inline-block;width:1.5px;height:1em;background:var(--signal);margin-left:2px;vertical-align:-.15em}
.pc-run{margin-top:12px;padding-top:12px;border-top:1px dashed rgba(243,239,230,.12);display:flex;flex-direction:column;gap:8px}
.pc-run p{display:flex;align-items:center;gap:9px;font-size:13.5px;color:rgba(243,239,230,.8);opacity:0}
.pc-run i{width:16px;height:16px;border-radius:50%;border:1.5px solid rgba(243,239,230,.3);position:relative;flex:none}
.pc-run p.ok i{background:var(--signal);border-color:var(--signal)}
.pc-run p.ok i::after{content:"";position:absolute;left:4.5px;top:1.5px;width:3.5px;height:7px;border:solid #fff;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
@media (max-width:900px){.pc{position:relative;left:auto;bottom:auto;width:100%;border-radius:20px;border-bottom:1px solid #2A2724;margin-top:24px}}
.spin-stage{cursor:default}
.spin-stage.grab{cursor:grab}
.spin-stage.grabbing{cursor:grabbing}
@media (max-width:900px){
  .hero3{display:flex;flex-direction:column;padding-bottom:150px}
  .hero3 .hero-copy{order:1}
  .hero3 .q-fig{order:2;margin-top:70px}
  .pc-copy{white-space:nowrap;height:28px;padding:0 10px;font-size:12px}
  .pc-tools{gap:9px}
  .pc-tools img[alt=Cursor]{display:none}
  .pc-prompt{min-height:0}
}

/* ---------- onboarding: the brand kit Rectify pulls from your site */
.ob2-read{gap:10px}
.ob2-read .rd2-site{height:108px;flex:none}
.bk{border:1px solid #EDEDF0;border-radius:12px;padding:12px 14px 12px;display:flex;flex-direction:column;gap:10px;background:#fff;opacity:0}
.bk-h{display:flex;justify-content:space-between;align-items:center;font-size:12.5px}.bk-h b{font-weight:500}
.bk-h code{font-family:var(--f-mono);font-size:11px;color:#9B9BA4}
.bk-row{display:flex;align-items:flex-start;gap:14px}
.bk-logo{height:40px;padding:0 12px;border-radius:9px;border:1px solid #EDEDF0;display:flex;align-items:center;background:#FBFAF7;flex:none;opacity:0}
.bk-logo svg{height:17px;width:auto;display:block}
.bk-sw{display:flex;gap:13px;padding-top:2px}
.bk-sw i{position:relative;display:block;width:26px;height:26px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);opacity:0}
.bk-sw em{position:absolute;top:30px;left:50%;transform:translateX(-50%);font-style:normal;font-family:var(--f-mono);font-size:8px;letter-spacing:-.01em;color:#9B9BA4}
.bk-desc{margin-top:4px;font-size:12.5px;line-height:1.5;color:#3F3F46;min-height:37px}
.bk-type{display:flex;gap:6px}
.bk-type span{height:22px;padding:0 9px;border-radius:999px;background:#F4F4F6;font-size:11px;color:#62626B;display:inline-flex;align-items:center;opacity:0}
.ob2-read .rd2-found{flex-direction:row;flex-wrap:wrap;gap:6px}
.ob2-read .rd2-found li{border:0;padding:0 10px;height:24px;border-radius:999px;background:#FEF1F0;color:#B42318;font-size:11.5px;display:inline-flex;align-items:center}

/* the intro canvas covers the page from the very first paint, before the script has drawn
   anything, so the hero never flashes up early (with a safety release if scripts fail) */
body.is-intro:not(.intro-live) #intro{background:#0E0A08;animation:introCover 0s 8s forwards}
@keyframes introCover{to{background:transparent}}
@media (max-width:760px){.ob2-cols{grid-template-columns:1fr}.ob2-built{display:none}}

/* footer: every feature as a colourful block in a pile the mouse pushes around (featpile.js) */
.hired-pile{position:relative;padding:clamp(24px,4vh,48px) 0 clamp(40px,6vh,72px)}
.hp-head{display:flex;flex-direction:column;gap:14px;max-width:760px}
.hp-head .h2{font-size:clamp(34px,4.2vw,64px)}
.feat-pile{position:relative;height:clamp(300px,28vw,400px);margin:10px 0 0;overflow:hidden;touch-action:pan-y}
.fp-chip{position:absolute;left:0;top:0;visibility:hidden;display:inline-flex;align-items:center;gap:9px;height:50px;padding:0 20px 0 16px;border-radius:999px;font-size:15.5px;font-weight:500;letter-spacing:-.01em;white-space:nowrap;user-select:none;will-change:transform;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 14px 24px -14px rgba(0,0,0,.7)}
.fp-chip svg{width:18px;height:18px;flex:none}
.feat-pile.static{display:flex;flex-wrap:wrap;gap:10px;align-content:flex-end;height:auto;padding:20px 0}
.feat-pile.static .fp-chip{position:static;visibility:visible}
@media (max-width:760px){.feat-pile{height:400px}.fp-chip{height:42px;font-size:14px;padding:0 15px 0 12px}.fp-chip svg{width:16px;height:16px}}

/* pricing motion: the featured plan's running border light, glow, button sheen; pointer spotlight */
.plans2{perspective:1400px}
.pl.hi{box-shadow:0 40px 70px -40px rgba(22,17,14,.7),0 34px 90px -34px rgba(245,54,44,var(--glow,.5))}
.pl>*:not(i){position:relative;z-index:1}
.pl-spot{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;z-index:0}
.pl-ring{position:absolute;inset:-1.5px;border-radius:23.5px;padding:1.5px;pointer-events:none;z-index:2;background:conic-gradient(from var(--ang,0deg),transparent 0 62%,rgba(255,106,61,.0) 66%,#FF6A3D 84%,#FFD2B8 90%,#F5362C 94%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.pl.hi .pl-cta{position:relative;overflow:hidden}
.pl-sheen{position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);pointer-events:none;transform:translateX(-120%)}
.pl-gets li i{transform-origin:center}

.fx-desc{display:none;font-size:14px;line-height:1.5;color:rgba(243,239,230,.6);margin:-6px 0 2px;min-height:3em}