/* LOLcorp: editorial light system, after Steep's DESIGN.md. Serif display (Signifier-style, weight 400) + Inter text. Ink #003333, one sage accent. */
:root{
  --ink:#003333;--ink2:#0d4040;
  --paper:#ffffff;--fog:#fafbfa;--mist:#f2f4f3;--white:#fff;
  --slate:#566a68;--ash:#6f807d;
  --sage:#d6efe3;--sage2:#b9e3d1;--leaf:#0a7a66;
  --line:rgba(0,51,51,.10);--line2:rgba(0,51,51,.2);
  --float:0 0 0 1px rgba(0,51,51,.06),0 20px 25px -5px rgba(0,51,51,.13),0 8px 10px -6px rgba(0,51,51,.1);
  --ease:cubic-bezier(.16,1,.3,1);
  --fd:'Signifier','Source Serif 4','Tiempos Headline',Georgia,serif;--fb:'Sohne','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;--fm:'JetBrains Mono',ui-monospace,monospace;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:430 1.0625rem/1.55 var(--fb);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2{font-family:var(--fd);font-weight:400;font-optical-sizing:auto;line-height:1.08;letter-spacing:-.025em;margin:0}
h3{font:480 1.25rem/1.3 var(--fb);letter-spacing:-.012em;margin:0}
h1{font-size:clamp(2.6rem,5.8vw,5.625rem);letter-spacing:-.028em}
h2{font-size:clamp(2.1rem,4.4vw,4rem);letter-spacing:-.015em}
em{font-style:italic;color:var(--leaf);font-weight:400}
p{margin:0 0 1rem}
.muted{color:var(--slate)}
.wrap{width:min(1200px,100% - 2.5rem);margin-inline:auto}
.narrow{width:min(820px,100% - 2.5rem);margin-inline:auto}
.center{text-align:center}
.section{padding:clamp(4.5rem,9vw,7.5rem) 0;position:relative}
.alt{background:var(--fog)}
.skip{position:fixed;left:1rem;top:-4rem;background:var(--ink);color:#fff;padding:.6rem 1rem;border-radius:99px;z-index:200}
.skip:focus{top:1rem}
:focus-visible{outline:2px solid var(--leaf);outline-offset:3px;border-radius:8px}
::selection{background:var(--sage2);color:var(--ink)}
.eyebrow{font:450 .875rem/1.4 var(--fb);letter-spacing:0;text-transform:none;color:var(--ash);margin-bottom:1rem;display:block}
.eyebrow::before{display:none}
.sec-head{max-width:780px;margin-bottom:clamp(2.5rem,5vw,4rem)}
.sec-head p.muted{margin-top:1.2rem;font-size:1.15rem}

/* progress + nav: whisper quiet */
.progress{position:fixed;inset:0 0 auto 0;height:2px;z-index:120}
.progress i{display:block;height:100%;background:var(--ink);transform:scaleX(var(--p,0));transform-origin:0 50%}
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:.9rem clamp(1rem,3vw,2.5rem);transition:background .4s,backdrop-filter .4s,transform .5s var(--ease),box-shadow .4s}
.nav.scrolled{background:rgba(255,255,255,.85);backdrop-filter:saturate(1.5) blur(16px);-webkit-backdrop-filter:saturate(1.5) blur(16px);box-shadow:0 1px 0 var(--line)}
.nav.hide{transform:translateY(-100%)}
.brand{display:inline-flex;align-items:center}.brand img{height:38px;width:auto}
.nav-links{display:flex;align-items:center;gap:2rem;font-size:.97rem;color:var(--ink)}
.nav-links>a:not(.btn),.dd-t{position:relative;padding:2px 0}
.nav-links>a:not(.btn)::after,.dd-t::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%;transition:transform .45s var(--ease)}
.nav-links>a:not(.btn):hover::after,.dd:hover .dd-t::after{transform:scaleX(1)}
.dd{position:relative}
.dd-m{position:absolute;top:100%;left:-1rem;width:320px;padding:.5rem;margin-top:.9rem;background:#fff;border-radius:20px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.35s var(--ease);box-shadow:var(--float)}
.dd::after{content:"";position:absolute;left:0;right:0;top:100%;height:1rem}
.dd:hover .dd-m,.dd:focus-within .dd-m{opacity:1;visibility:visible;transform:none}
.dd-m a{display:flex;align-items:center;gap:.8rem;padding:.65rem .9rem;border-radius:14px}
.dd-m a:hover{background:var(--mist)}
.dd-m .ico{width:20px;height:20px}
.burger{display:none;width:44px;height:44px;border:0;background:none;position:relative;cursor:pointer}
.burger i{position:absolute;left:11px;right:11px;height:1.5px;background:var(--ink);transition:.4s var(--ease)}
.burger i:first-child{top:18px}.burger i:last-child{top:25px}
.burger[aria-expanded=true] i:first-child{top:21px;transform:rotate(45deg)}
.burger[aria-expanded=true] i:last-child{top:21px;transform:rotate(-45deg)}

/* pill buttons */
.btn{--bx:0px;--by:0px;position:relative;display:inline-flex;align-items:center;gap:.7rem;padding:.8rem 1.4rem;border-radius:999px;font:450 .98rem var(--fb);color:#fff;background:var(--ink);border:1px solid var(--ink);cursor:pointer;overflow:hidden;isolation:isolate;transform:translate(var(--bx),var(--by));transition:transform .35s var(--ease),color .4s,border-color .4s}
.btn::before{content:"";position:absolute;inset:-1px;background:var(--sage);transform:translateX(-101%);transition:transform .6s var(--ease);z-index:-1;border-radius:inherit}
.btn:hover::before{transform:none}
.btn:hover{color:var(--ink)}
.btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn-sm{padding:.5rem 1.05rem;font-size:.92rem}.btn-lg{padding:1.05rem 1.8rem;font-size:1.05rem}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost::before{background:var(--ink)}.btn.ghost:hover{color:#fff}
.btn:disabled{opacity:.3;cursor:not-allowed;pointer-events:none}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;padding:7rem 0 4rem;overflow:hidden;isolation:isolate}
.hero-sm{min-height:0;padding:10rem 0 5.5rem}
.glow{position:absolute;left:var(--gx,50%);top:var(--gy,40%);width:60vw;height:60vw;max-width:900px;max-height:900px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(185,227,209,.7),rgba(214,239,227,.25) 40%,transparent 68%);z-index:-1;pointer-events:none;transition:left 1.2s var(--ease),top 1.2s var(--ease)}
.hero-in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}
.hero h1{max-width:14ch;margin:1.6rem 0 1.6rem}
.hero-sm h1{max-width:20ch;font-size:clamp(2.4rem,5.4vw,4.4rem)}
.lead{font-size:clamp(1.08rem,1.5vw,1.28rem);color:var(--slate);max-width:52ch;margin-bottom:2.2rem}
.pill{display:inline-flex;align-items:center;gap:.6rem;padding:.4rem 1rem;border:1px solid var(--line2);border-radius:999px;font-size:.85rem;color:var(--slate);background:rgba(255,255,255,.7)}
.dot,.live{width:8px;height:8px;border-radius:50%;background:var(--leaf);box-shadow:0 0 0 0 rgba(10,122,102,.5);animation:ping 2s infinite;display:inline-block}
@keyframes ping{70%{box-shadow:0 0 0 9px transparent}}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center}
.proof{list-style:none;padding:0;margin:2.8rem 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem 3rem}
.proof li{display:flex;flex-direction:column;align-items:center}
.proof b{font:400 1.9rem var(--fd);letter-spacing:-.02em}
.proof span{font-size:.85rem;color:var(--ash)}
.crumbs{display:flex;gap:.6rem;font-size:.85rem;color:var(--ash);margin-bottom:1.2rem;justify-content:center}.crumbs a:hover{color:var(--ink)}

/* floating product artifacts */
.arts{position:absolute;inset:0;z-index:1;pointer-events:none}
.fl{position:absolute;--mx:0;--my:0;transform:translate3d(calc(var(--mx)*var(--k)*14px),calc(var(--my)*var(--k)*10px + var(--hs,0)*var(--k)*-90px),0);transition:transform .6s var(--ease)}
.fl-in{width:100%;padding:16px 18px 14px;background:#fff;border-radius:20px;box-shadow:var(--float);animation:drift 9s ease-in-out infinite}
.f1{left:max(1.5rem,calc(50% - 650px));top:24%;width:250px}
.f2{right:max(1.5rem,calc(50% - 660px));top:17%;width:320px}.f2 .fl-in{animation-delay:-3s}
.f3{left:max(2rem,calc(50% - 620px));top:66%;width:240px}.f3 .fl-in{animation-delay:-5s}
.f4{right:max(2rem,calc(50% - 600px));top:70%;width:280px}.f4 .fl-in{animation-delay:-2s}
@keyframes drift{50%{transform:translateY(-10px) rotate(.4deg)}}
.fl-h{display:flex;align-items:center;gap:.5rem;font:500 .74rem var(--fm);color:var(--ash);margin:0 0 .8rem;text-align:left}
.steps{list-style:none;margin:0 0 .8rem;padding:0;display:grid;gap:.45rem;font-size:.85rem;text-align:left;color:var(--ash)}
.steps li{display:flex;align-items:center;gap:.55rem}
.steps svg{width:15px;height:15px;fill:none;stroke:var(--leaf);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;padding:2px;background:var(--sage);border-radius:50%}
.steps .ok{color:var(--ink)}.steps .run{color:var(--ink);font-weight:500}.steps .run b{width:15px;height:15px;border-radius:50%;border:2px solid var(--sage2);border-top-color:var(--leaf);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.meter{height:5px;border-radius:5px;background:var(--mist);overflow:hidden}
.meter i{display:block;height:100%;width:0;background:var(--ink);border-radius:5px;animation:meter 6s var(--ease) infinite}
@keyframes meter{0%{width:8%}60%,90%{width:68%}100%{width:8%}}
.composer{display:flex;align-items:center;gap:.6rem;padding:.55rem .55rem .55rem .9rem;border:1px solid var(--line2);border-radius:16px;font-size:.82rem;text-align:left}
.typed{display:inline-block;overflow:hidden;white-space:nowrap;width:0;animation:typing 7s steps(36) infinite;border-right:1.5px solid var(--ink);color:var(--ink)}
@keyframes typing{0%{width:0}35%,88%{width:100%}100%{width:0}}
.composer b{flex:none;margin-left:auto;width:32px;height:32px;border-radius:50%;background:var(--ink);display:grid;place-items:center}
.composer svg{width:14px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.est{display:flex;align-items:baseline;gap:.6rem;margin-top:.9rem;font-size:.78rem;color:var(--ash);opacity:0;animation:estin 7s infinite}
.est strong{font:400 1.35rem var(--fd);color:var(--ink)}.est em{font-size:.78rem;margin-left:auto}
@keyframes estin{0%,38%{opacity:0;transform:translateY(6px)}46%,88%{opacity:1;transform:none}100%{opacity:0}}
.stat{font:400 2.4rem/1 var(--fd);margin:0 0 .4rem;text-align:left}.stat small{font:400 .76rem var(--fb);color:var(--leaf);margin-left:.3rem}
.spark{width:100%;height:auto;overflow:visible}
.spark path{fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-dasharray:300;stroke-dashoffset:300;animation:dash 4s var(--ease) infinite alternate}
.spark circle{fill:var(--leaf)}
.feed{display:flex;align-items:center;gap:.65rem;padding:.35rem 0;text-align:left;font-size:.82rem}
.feed p{margin:0}.feed code{font:500 .78rem var(--fm);color:var(--leaf)}.feed em{font-style:normal;color:var(--leaf)}
.av{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font:500 .72rem var(--fb);background:var(--sage)}
.av.b{background:#e7e3f4}
.cur{position:absolute;right:18px;bottom:-24px;display:flex;align-items:flex-start;animation:curmove 8s ease-in-out infinite}
.cur svg{width:20px;fill:var(--ink)}.cur i{margin:14px 0 0 -2px;font:500 .7rem var(--fb);font-style:normal;background:var(--ink);color:#fff;padding:.15rem .55rem;border-radius:99px}
@keyframes curmove{50%{transform:translate(-70px,-40px)}}
@media(max-width:1240px){
  .arts{position:relative;inset:auto;display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;padding:3rem 1.25rem 0;order:3;pointer-events:auto}
  .hero{flex-direction:column;justify-content:center}
  .fl{position:relative;inset:auto!important;transform:none;width:min(300px,100%)!important}.f4,.f3{display:none}
  .cur{display:none}
}
@media(max-width:620px){.f1{display:none}.arts{padding-top:2rem}}

/* split text + reveal */
[data-split] .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:0 .04em .14em;margin-bottom:-.14em}
[data-split] .w>span{display:inline-block;transform:translateY(112%) rotate(3deg);transition:transform 1.2s var(--ease);transition-delay:calc(var(--i)*60ms + 120ms)}
[data-split].in .w>span{transform:none}
.js .reveal{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0)*90ms)}
.js .reveal.in{opacity:1;transform:none}

/* marquee */
.marquee{overflow:hidden;padding:1.5rem 0;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.track{display:flex;gap:3rem;width:max-content;animation:slide 55s linear infinite}
.track span{font:400 1.5rem var(--fd);font-style:italic;color:var(--ash);white-space:nowrap;display:flex;align-items:center;gap:3rem}
.track span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--sage2)}
@keyframes slide{to{transform:translateX(-50%)}}

/* ===== story: sticky artifact stage ===== */
.story{position:relative;padding:4rem 0;background:var(--fog)}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem}
.story-steps .step{min-height:80vh;display:flex;flex-direction:column;justify-content:center;opacity:.28;transition:opacity .6s var(--ease)}
.story-steps .step.on{opacity:1}
.step .num{font:500 .75rem var(--fm);letter-spacing:.12em;color:var(--leaf);text-transform:uppercase;margin-bottom:1.2rem}
.step .num i{font-style:normal;color:var(--ash);margin-left:.6rem}
.step h2{font-size:clamp(2rem,3.6vw,3.1rem);margin-bottom:1.2rem}
.step p{color:var(--slate);max-width:44ch;font-size:1.12rem}
.story-stage{position:relative}
.stage{--sp:0;position:sticky;top:calc(50vh - 230px);height:460px;border-radius:24px;background:#fff;box-shadow:var(--float);overflow:hidden;color:var(--ink)}
.stage::before{content:"";position:absolute;inset:-40% 0;background-image:radial-gradient(rgba(0,51,51,.13) 1.2px,transparent 1.4px);background-size:26px 26px;background-position:calc(var(--sp)*-130px) calc(var(--sp)*-260px);mask-image:radial-gradient(70% 70% at 50% 50%,#000,transparent);-webkit-mask-image:radial-gradient(70% 70% at 50% 50%,#000,transparent)}
.stage::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at calc(30% + var(--sp)*50%) 0,rgba(185,227,209,.5),transparent 70%);pointer-events:none}
.rail{position:absolute;left:14px;top:24px;bottom:24px;width:2px;border-radius:2px;background:var(--line);z-index:3}
.rail i{position:absolute;inset:0;border-radius:2px;background:var(--ink);transform:scaleY(var(--sp));transform-origin:0 0}
.rail b{display:none}
.scene{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:scale(.95) translateY(18px);transition:opacity .7s var(--ease),transform .9s var(--ease);padding:2.2rem;z-index:1}
.scene.on{opacity:1;transform:none}
.sv{width:100%;max-width:440px;overflow:visible}
.sheet{width:100%;max-width:340px;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;background:var(--fog);padding:.8rem;border-radius:12px;box-shadow:0 0 0 1px var(--line)}
.sheet b{grid-column:1/-1;font:500 .75rem var(--fm);color:var(--ash);margin-bottom:.4rem}
.sheet span{height:22px;background:rgba(0,51,51,.08);border-radius:4px;animation:blink 2.4s infinite;animation-delay:calc(var(--d)*-.2s)}
.sheet span:nth-child(7n){background:rgba(214,70,60,.28)}
@keyframes blink{50%{opacity:.35}}
.note{position:absolute;font:500 .78rem var(--fm);padding:.4rem .75rem;border-radius:99px;background:#fff;box-shadow:var(--float);animation:bob 4s ease-in-out infinite}
.n1{left:8%;top:14%}.n2{right:10%;top:30%;color:#c0392b;animation-delay:-1s}.n3{left:14%;bottom:14%;animation-delay:-2s}
@keyframes bob{50%{transform:translateY(-8px) rotate(-1.5deg)}}
.code{width:100%;max-width:410px;background:var(--ink);border-radius:16px;overflow:hidden;box-shadow:var(--float)}
.code .dots{display:flex;gap:6px;padding:.7rem .9rem;border-bottom:1px solid rgba(255,255,255,.1)}
.code .dots i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.2)}
.code pre{margin:0;padding:1rem 1.1rem;font:400 .8rem/1.7 var(--fm);color:#d6efe3;white-space:pre-wrap}
.k{color:#f3c6a5}.f{color:#9ff0d2}.c{color:#7fb3a4}
.scene.on .code code{display:block;overflow:hidden;white-space:pre;animation:type 3s steps(60) .3s both}
@keyframes type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.ship{position:absolute;left:9%;right:9%;bottom:1.8rem;display:flex;align-items:center;gap:1rem;font:500 .74rem var(--fm);color:var(--ash)}
.ship i{flex:1;height:5px;border-radius:5px;background:var(--mist);overflow:hidden}
.ship b{display:block;height:100%;width:0;background:var(--ink)}
.scene.on .ship b{animation:fill 3s .4s var(--ease) forwards}
@keyframes fill{to{width:100%}}
/* scene primitives */
.a-pop,.a-fade,.a-climb{opacity:0;transform-box:fill-box;transform-origin:center}
.a-rise{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0)}
.a-draw{stroke-dasharray:var(--l,500);stroke-dashoffset:var(--l,500)}
.a-ring{stroke-dasharray:var(--c);stroke-dashoffset:var(--c)}
.a-type{clip-path:inset(0 100% 0 0)}
.scene.on .a-pop{animation:pop .8s var(--ease) both;animation-delay:calc(var(--d,0)*110ms + 150ms)}
.scene.on .a-fade{animation:fade 1.2s .3s both}
.scene.on .a-climb{animation:climb 1.6s .5s var(--ease) both}
.scene.on .a-rise{animation:rise 1s var(--ease) both;animation-delay:calc(var(--d,0)*80ms + 150ms)}
.scene.on .a-draw{animation:dash 2s calc(var(--d,0)*200ms + .2s) var(--ease) both}
.scene.on .a-ring{animation:ringfill 2s .2s var(--ease) both}
.scene.on .a-type{animation:type 2.4s .3s steps(28) both}
.scene.on .a-loop{animation:dashloop 3.2s linear infinite}
.a-flow{stroke-dasharray:6 8;animation:flow 1s linear infinite}
@keyframes dash{to{stroke-dashoffset:0}}
@keyframes pop{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:none}}
@keyframes rise{to{transform:scaleY(1)}}
@keyframes climb{from{opacity:0;transform:translateY(120px)}to{opacity:1;transform:none}}
@keyframes flow{to{stroke-dashoffset:-14}}
@keyframes dashloop{0%{stroke-dashoffset:700}60%,100%{stroke-dashoffset:0}}
@keyframes fade{to{opacity:1}}
@keyframes ringfill{from{stroke-dashoffset:var(--c)}to{stroke-dashoffset:calc(var(--c)*.04)}}

/* cards: flat, quiet */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem}
.cards.c3{grid-template-columns:repeat(3,1fr)}.cards.c4{grid-template-columns:repeat(4,1fr)}
.card,.why-list li{position:relative;display:flex;flex-direction:column;gap:.7rem;padding:1.7rem 1.5rem;border-radius:24px;background:var(--mist);overflow:hidden;transition:transform .55s var(--ease),background .4s,box-shadow .4s}
.spot::before{content:"";position:absolute;inset:0;background:radial-gradient(380px circle at var(--mx,50%) var(--my,0),rgba(185,227,209,.65),transparent 45%);opacity:0;transition:opacity .4s;pointer-events:none}
.spot:hover::before{opacity:1}
a.card:hover{transform:translateY(-6px);background:#fff;box-shadow:var(--float)}
.card>*,.why-list li>*{position:relative}
.card p{color:var(--slate);font-size:.97rem;margin:0}
.card h3{font-size:1.3rem}
.ico{width:32px;height:32px;color:var(--ink);stroke-width:1.4}
.more{margin-top:auto;padding-top:1rem;display:inline-flex;align-items:center;gap:.5rem;font-weight:450;font-size:.95rem}
.more svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .4s var(--ease)}
a.card:hover .more svg{transform:translateX(5px)}
.why-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:4rem;align-items:start}
.why-grid>div:first-child{position:sticky;top:7rem}
.why-list{list-style:none;padding:0;margin:0;display:grid;gap:1rem}
.why-list h3{font-size:1.25rem}.why-list p{margin:0;color:var(--slate)}

/* timeline */
.timeline{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:1.5rem;position:relative}
.timeline::before{content:"";position:absolute;left:0;right:0;top:22px;height:1px;background:var(--ink);transform:scaleX(var(--tl,0));transform-origin:0 50%}
.timeline::after{content:"";position:absolute;left:0;right:0;top:22px;height:1px;background:var(--line2);z-index:-1}
.timeline li{position:relative}
.timeline .n{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--paper);border:1px solid var(--ink);font:400 1.2rem var(--fd);margin-bottom:1.3rem}
.timeline h3{font-size:1.1rem;margin-bottom:.5rem}.timeline p{color:var(--slate);font-size:.94rem;margin:0}

/* quote: the single sage accent card */
.quote{background:var(--paper)}
.qcard{position:relative;max-width:940px;margin:0 auto;padding:clamp(1.4rem,4vw,3rem);border-radius:28px;background:var(--sage);color:var(--ink);overflow:hidden;--line2:rgba(0,51,51,.22)}
.qbar{position:absolute;inset:0 0 auto 0;height:3px;background:rgba(0,51,51,.1)}
.qbar i{display:block;height:100%;width:25%;background:var(--ink);transition:width .7s var(--ease)}
.qstep{display:none}.qstep.is-on{display:block;animation:stepin .7s var(--ease)}
@keyframes stepin{from{opacity:0;transform:translateX(24px)}}
.qstep h3{font:400 1.9rem/1.15 var(--fd);letter-spacing:-.02em;margin-bottom:1.4rem}.qstep h3.mt{margin-top:2.2rem}
.qstep .muted{color:var(--ink2);opacity:.75}
.opts{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.opts-sm{grid-template-columns:repeat(4,1fr)}
.opt{position:relative;cursor:pointer}
.opt input{position:absolute;opacity:0;inset:0;cursor:pointer}
.opt span{display:flex;flex-direction:column;gap:.25rem;height:100%;padding:1.05rem 1.15rem;border-radius:16px;background:rgba(255,255,255,.6);box-shadow:inset 0 0 0 1px rgba(0,51,51,.12);transition:.35s var(--ease)}
.opt b{font:500 .98rem var(--fb)}.opt small{color:var(--slate);font-size:.82rem;line-height:1.4}
.opt:hover span{background:#fff;transform:translateY(-2px)}
.opt input:checked+span{background:#fff;box-shadow:inset 0 0 0 2px var(--ink),0 16px 30px -18px rgba(0,51,51,.5)}
.opt input:focus-visible+span{outline:2px solid var(--leaf);outline-offset:2px}
.qnav{display:flex;justify-content:space-between;margin-top:2rem}
#qnext{margin-left:auto}
.qcard .btn::before{background:#fff}.qcard .btn:hover{color:var(--ink)}
.qcard .btn.ghost::before{background:var(--ink)}.qcard .btn.ghost:hover{color:#fff}
.result{text-align:center;padding:.5rem 0 2rem;border-bottom:1px solid rgba(0,51,51,.15);margin-bottom:2rem}
.result .eyebrow{justify-content:center}
.price{display:flex;justify-content:center;align-items:baseline;gap:1rem;font:400 clamp(2.4rem,7vw,4.8rem)/1.1 var(--fd);letter-spacing:-.035em}
.price i{font:500 .9rem var(--fm);font-style:normal;color:var(--slate)}
.chips{list-style:none;display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;padding:0;margin:1rem 0 0}
.chips li{font-size:.8rem;padding:.3rem .8rem;border-radius:99px;background:rgba(255,255,255,.65)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.fields label{display:flex;flex-direction:column;gap:.4rem;font-size:.85rem;color:var(--slate)}
.fields .full{grid-column:1/-1}
.fields input,.fields textarea{font:inherit;color:var(--ink);background:#fff;border:1px solid transparent;border-radius:16px;padding:.85rem 1rem;transition:border-color .3s;width:100%}
.fields input:focus,.fields textarea:focus{outline:none;border-color:var(--ink)}
.hp{position:absolute;left:-9999px}
.err{color:#b3261e;font-size:.9rem;margin-top:1rem}
.fine{text-align:center;font-size:.8rem;color:var(--ash);margin-top:1.4rem}
.qdone{text-align:center;padding:3rem 1rem}
.qdone h3{font:400 2rem var(--fd)}
.tick svg{width:84px;margin:0 auto 1.4rem;fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.tick circle{stroke-dasharray:160;stroke-dashoffset:160;animation:dash 1s forwards}
.tick path{stroke-dasharray:50;stroke-dashoffset:50;animation:dash .6s .7s forwards}

/* faq */
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.5rem 0;font:400 1.45rem/1.2 var(--fd);letter-spacing:-.015em}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:30px;height:30px;border:1px solid var(--line2);border-radius:50%;position:relative;transition:.45s var(--ease)}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.5px;background:var(--ink);transform:translate(-50%,-50%);transition:.45s var(--ease)}
.faq summary i::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq details[open] summary i{background:var(--ink);border-color:var(--ink)}
.faq details[open] summary i::before,.faq details[open] summary i::after{background:#fff}
.faq details[open] summary i::after{transform:translate(-50%,-50%) rotate(0)}
.faq details p{color:var(--slate);padding:0 3rem 1.6rem 0;margin:0;animation:stepin .5s var(--ease)}
.seo-copy p{color:var(--slate)}.seo-copy a{color:var(--ink);border-bottom:1px solid var(--sage2);transition:border-color .3s}.seo-copy a:hover{border-color:var(--ink)}
.seo-copy h2{font-size:clamp(1.8rem,3.2vw,2.6rem);margin-bottom:1.2rem}

.cta-sec{padding:0 0 clamp(2.5rem,5vw,4rem)}
.cta{text-align:center;background:var(--mist);border-radius:32px;padding:clamp(3.5rem,8vw,6.5rem) 1.5rem;position:relative;overflow:hidden;isolation:isolate}
.cta::before{content:"";position:absolute;width:520px;height:520px;left:50%;top:-60%;transform:translateX(-50%);background:radial-gradient(circle,rgba(185,227,209,.9),transparent 65%);z-index:-1;animation:breathe 8s ease-in-out infinite}
@keyframes breathe{50%{transform:translateX(-50%) scale(1.25)}}
.cta h2{max-width:16ch;margin:0 auto 1.2rem;font-size:clamp(2.2rem,5vw,4.2rem)}
.cta p{max-width:44ch;margin:0 auto 2rem}

.two{display:grid;grid-template-columns:1fr 1fr;gap:4rem}
.two h2{font-size:clamp(1.9rem,3vw,2.7rem);margin-bottom:1.6rem}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:.9rem}
.ticks li{position:relative;padding-left:2rem;color:var(--slate)}
.ticks li::before{content:"";position:absolute;left:0;top:.5em;width:13px;height:7px;border-left:1.5px solid var(--leaf);border-bottom:1.5px solid var(--leaf);transform:rotate(-45deg)}
.mini{list-style:none;padding:0;margin:0;display:grid;gap:1.4rem}
.mini li{display:flex;gap:1rem}.mini li>span{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--ink);font:400 1.05rem var(--fd)}
.mini h3{font-size:1.1rem;margin-bottom:.2rem}.mini p{margin:0;color:var(--slate);font-size:.95rem}

.footer{border-top:1px solid var(--line);padding:4.5rem 0 2rem;background:var(--fog)}
.foot-grid{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:2.5rem;padding-bottom:2.5rem}
.foot-brand{display:grid;grid-template-columns:1.4fr 1fr auto;gap:2.5rem;align-items:start;padding-top:2.5rem;padding-bottom:2.5rem;border-top:1px solid var(--line)}
.foot-brand .addr{margin:0}.foot-brand p.muted{margin:1rem 0 0;max-width:42ch}.foot-brand .socials{margin:0}
.foot-grid h3{font:500 .75rem var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--ash);margin-bottom:1rem}
.foot-grid ul{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.foot-grid li a{color:var(--slate);transition:color .2s}.foot-grid li a:hover{color:var(--ink)}
.foot-grid p.muted{margin:1rem 0 .6rem;max-width:34ch}
.mail{border-bottom:1px solid var(--sage2)}
.foot-base{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);font-size:.85rem;color:var(--ash)}

/* ===== portfolio: depth tunnel of floating artifacts ===== */
.pf{position:relative;height:calc(var(--n)*90vh + 100vh);background:var(--paper)}
.pf-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center}
.pf-in{display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem;align-items:center}
.pf-copy h2{font-size:clamp(2.1rem,3.6vw,3.3rem);margin-bottom:2rem}
.pf-index{list-style:none;padding:0;margin:0 0 2rem;display:grid}
.pf-index li{display:flex;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--line);color:var(--ash);transition:color .4s,padding .5s var(--ease)}
.pf-index li span{font:500 .75rem var(--fm);color:var(--ash);padding-top:.28rem}
.pf-index li.on{color:var(--ink);padding-left:.8rem}.pf-index li.on span{color:var(--leaf)}
.pf-count{font:500 1rem var(--fm);color:var(--ash)}.pf-count b{font:400 3.6rem var(--fd);color:var(--ink);letter-spacing:-.04em}
.pf-tunnel{position:relative;height:min(560px,70vh);perspective:1400px;perspective-origin:50% 40%}
.pfc{position:absolute;left:50%;top:50%;width:min(520px,100%);margin:calc(min(560px,70vh)/-2 + 20px) 0 0 -260px;transform:translate3d(var(--x,0),var(--y,0),var(--z,0));opacity:var(--o,0);filter:blur(var(--bl,0));will-change:transform,opacity;border-radius:24px;background:#fff;box-shadow:var(--float);overflow:hidden;pointer-events:none}
.pfc.front{pointer-events:auto}
.pf-sample{position:absolute;z-index:3;left:12px;top:12px;font:500 .65rem var(--fm);letter-spacing:.05em;background:#ffe9c7;color:#6a4200;padding:.25rem .6rem;border-radius:99px}
.art{height:230px;background:var(--sage);position:relative;display:grid;gap:10px;padding:18px;overflow:hidden}
.art i{display:block;border-radius:8px;background:rgba(255,255,255,.7)}
.art .b{align-self:end;height:var(--h);background:var(--ink);opacity:.85;animation:barp 3.2s ease-in-out infinite;animation-delay:calc(var(--d)*-.25s);transform-origin:bottom;border-radius:5px 5px 2px 2px}
@keyframes barp{50%{transform:scaleY(.6)}}
.art .r{height:9px;width:var(--w);animation:rowp 2.6s ease-in-out infinite;animation-delay:calc(var(--d)*-.3s)}
@keyframes rowp{50%{opacity:.4}}
.art .kp{display:flex;gap:8px}.art .kp i{flex:1;height:42px}
.art .bars{display:flex;gap:6px;align-items:end;height:90px}.art .bars .b{flex:1}
.art.dash{grid-template-rows:auto 1fr auto}.art.dash .tbl{display:grid;gap:7px}
.art.saas{grid-template-columns:90px 1fr}.art.saas .side{display:grid;gap:10px;align-content:start}.art.saas .main{display:grid;grid-template-rows:auto 1fr;gap:12px}
.art.app{display:flex;justify-content:center;gap:24px;padding-bottom:0}
.art .ph{width:120px;height:100%;background:#fff;box-shadow:0 0 0 2px var(--ink);border-radius:22px 22px 0 0;padding:14px 10px;display:grid;gap:9px;align-content:start;animation:phone 6s ease-in-out infinite}
.art .ph.p2{margin-top:30px;animation-delay:-3s}.art .ph u{display:block;width:34px;height:5px;background:var(--ink);opacity:.3;border-radius:5px;margin:0 auto 4px}
.art .ph i{background:var(--mist)}
.art .ph em{display:block;height:34px;border-radius:9px;background:var(--ink)}
@keyframes phone{50%{transform:translateY(-12px)}}
.art.site{grid-template-rows:90px 1fr}.art .hero-b{border-radius:12px;background:linear-gradient(110deg,var(--ink) 0 30%,#0a5a50 50%,var(--ink) 70%);background-size:220% 100%;animation:sheen 5s linear infinite}
@keyframes sheen{to{background-position:-220% 0}}
.art .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.art .cursor{position:absolute;left:30%;top:55%;width:16px;height:16px;border:2px solid var(--ink);border-radius:50%;animation:cur 5s ease-in-out infinite}
@keyframes cur{50%{transform:translate(140px,-30px)}}
.pfc-body{padding:1.3rem 1.5rem 1.5rem}
.pfc-sector{font:500 .72rem var(--fm);text-transform:uppercase;letter-spacing:.1em;color:var(--leaf);margin-bottom:.4rem}
.pfc-body h3{font:400 1.7rem/1.15 var(--fd);letter-spacing:-.02em;margin-bottom:.4rem}.pfc-body p:not(.pfc-sector){color:var(--slate);font-size:.95rem;margin-bottom:1rem}
.pfc-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem}
.pfc-foot ul{list-style:none;display:flex;gap:.4rem;flex-wrap:wrap;margin:0;padding:0}
.pfc-foot li{font-size:.74rem;padding:.25rem .65rem;border-radius:99px;background:var(--mist);color:var(--slate)}
.pfc-kpi{text-align:right}.pfc-kpi b{display:block;font:400 2.1rem var(--fd);letter-spacing:-.03em;line-height:1}.pfc-kpi span{font-size:.72rem;color:var(--ash)}

/* responsive */
@media(max-width:1000px){
  .cards,.cards.c4{grid-template-columns:repeat(2,1fr)}.cards.c3{grid-template-columns:1fr 1fr}
  .timeline{grid-template-columns:1fr;gap:2rem}.timeline::before,.timeline::after{display:none}
  .why-grid,.two{grid-template-columns:1fr;gap:2.5rem}.why-grid>div:first-child{position:static}
  .opts,.opts-sm{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .pf-in{grid-template-columns:1fr;gap:1rem;align-content:center}
  .pf-index,.pf-count{display:none}
  .pf-copy h2{font-size:1.8rem;margin-bottom:.5rem}
  .pfc{width:min(340px,86vw);margin-left:calc(min(340px,86vw)/-2)}.art{height:150px}
  .pf-tunnel{height:min(470px,56vh)}
}
@media(max-width:860px){
  .burger{display:block}
  .nav-links{position:fixed;inset:0;flex-direction:column;justify-content:center;gap:1.6rem;font:400 2rem var(--fd);background:rgba(255,255,255,.98);backdrop-filter:blur(20px);opacity:0;visibility:hidden;transition:.5s var(--ease)}
  .nav-links .btn{font:450 1rem var(--fb)}
  .nav-links.open{opacity:1;visibility:visible}
  .dd-m{display:none}
  .story-grid{grid-template-columns:1fr;gap:0}
  .story-stage{order:-1;position:sticky;top:4.5rem;z-index:5;padding:.5rem 0 1rem;background:linear-gradient(var(--fog) 80%,transparent)}
  .stage{position:relative;top:0;height:260px;border-radius:20px}
  .scene{padding:1rem}.scene>*{transform:scale(.72)}.scene .note,.scene .ship{display:none}
  .story-steps .step{min-height:60vh}
  .fields{grid-template-columns:1fr}
}
@media(max-width:560px){.cards,.cards.c3,.cards.c4{grid-template-columns:1fr}.foot-grid,.foot-brand{grid-template-columns:1fr}.opts,.opts-sm{grid-template-columns:1fr}}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;transform:none}[data-split] .w>span{transform:none}
  .a-pop,.a-fade,.a-climb{opacity:1}.a-rise{transform:none}.a-draw,.a-ring{stroke-dashoffset:0}.a-type{clip-path:none}
  .typed{width:100%}.est{opacity:1}
  .pf{height:auto;padding:5rem 0}.pf-sticky{position:static;height:auto}.pf-in{grid-template-columns:1fr}
  .pf-tunnel{height:auto;display:grid;gap:1.5rem;perspective:none}.pfc{position:relative;left:auto;top:auto;margin:0;width:100%;transform:none;opacity:1;filter:none}
}

/* ===== reviews ===== */
.tp{max-width:860px;margin:0 auto 3rem;padding:2rem 2.2rem;border-radius:24px;background:#fff;box-shadow:var(--float)}
.tp-src{display:flex;align-items:center;gap:.5rem;font:500 .75rem var(--fm);letter-spacing:.08em;text-transform:uppercase;color:var(--ash);margin-bottom:1rem}
.tp-src svg{width:16px;fill:var(--leaf)}
.tp blockquote{margin:0 0 1.2rem;font:400 clamp(1.3rem,2.4vw,1.75rem)/1.35 var(--fd);letter-spacing:-.015em}
.tp figcaption{font-size:.92rem;color:var(--slate)}.tp figcaption b{color:var(--ink)}.tp a{color:var(--ink);border-bottom:1px solid var(--sage2)}.tp a:hover{border-color:var(--ink)}
.rv-rows{display:grid;gap:1rem;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);padding:.5rem 0}
.rv-row{overflow:hidden}
.rv-track{display:flex;gap:1rem;width:max-content;animation:slide 90s linear infinite}
.rv-row.rev .rv-track{animation-direction:reverse;animation-duration:100s}
.rv-rows:hover .rv-track{animation-play-state:paused}
.rv{flex:none;width:380px;margin:0;padding:1.5rem;border-radius:24px;background:var(--mist);display:flex;flex-direction:column;justify-content:space-between;gap:1.2rem;white-space:normal}
.rv blockquote{margin:0;font-size:.97rem;line-height:1.55;color:var(--ink)}
.rv figcaption{display:flex;align-items:center;gap:.7rem}
.rv-av{flex:none;width:36px;height:36px;border-radius:50%;background:var(--sage);display:grid;place-items:center;font:400 1.1rem var(--fd)}
.rv figcaption b{display:block;font-weight:500;font-size:.92rem}.rv figcaption small{display:block;font:500 .7rem var(--fm);color:var(--leaf);letter-spacing:.02em}
.verify{list-style:none;margin:3rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.verify .card{height:100%}.verify .eyebrow{margin-bottom:.4rem}.verify h3{font:400 1.45rem/1.2 var(--fd);letter-spacing:-.015em}
.socials{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:1.4rem 0 0}
.socials a{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .85rem;border-radius:99px;box-shadow:inset 0 0 0 1px var(--line2);font-size:.88rem;color:var(--ink);transition:background .35s,color .35s}
.socials a:hover{background:var(--ink);color:#fff}
.socials svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cta .hero-cta{justify-content:center}
@media(max-width:1000px){.verify{grid-template-columns:1fr}}
@media(max-width:560px){.rv{width:290px}.tp{padding:1.5rem}}
@media(prefers-reduced-motion:reduce){.rv-track{animation:none;flex-wrap:wrap;width:auto;padding:0 1.25rem}.rv[aria-hidden="true"]{display:none}.rv{width:min(380px,100%)}}

/* extra portfolio mock UIs */
.art.inbox{grid-auto-rows:min-content;align-content:start}
.art .mail{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;gap:5px 10px;align-items:center;background:rgba(255,255,255,.75);border-radius:12px;padding:9px 12px;animation:mailin 5s var(--ease) infinite;animation-delay:calc(var(--d)*.5s)}
.art .mail u{grid-row:1/3;width:24px;height:24px;border-radius:50%;background:var(--ink);opacity:.8}
.art .mail i{height:7px}.art .mail em{grid-row:1/3;width:30px;height:16px;border-radius:99px;background:var(--sage2)}
@keyframes mailin{0%{opacity:0;transform:translateY(14px)}12%,85%{opacity:1;transform:none}100%{opacity:0}}
.art .route{position:absolute;right:16px;bottom:12px;font:500 .68rem var(--fm);background:var(--ink);color:#fff;padding:.3rem .7rem;border-radius:99px}
.art.doc{grid-template-columns:1.1fr .9fr;align-items:center}
.art .page{background:#fff;border-radius:10px;padding:14px;display:grid;gap:8px;box-shadow:0 10px 24px -12px rgba(0,51,51,.4);animation:phone 6s ease-in-out infinite}
.art .page .r{background:var(--mist)}.art .sum{display:flex;justify-content:space-between;align-items:center;margin-top:6px}.art .sum i{width:50%;height:10px;background:var(--ink);opacity:.8}.art .sum b{font:400 1rem var(--fd)}
.art .chat{display:grid;gap:8px;align-content:center}.art .chat em{font:500 .66rem var(--fm);font-style:normal;color:var(--ink);background:#fff;padding:.3rem .6rem;border-radius:99px;justify-self:start}

.addr{font-style:normal;color:var(--slate);font-size:.95rem;line-height:1.7}.addr p{margin:0 0 .8rem}

/* ===== about ===== */
.about-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:4rem;align-items:start}
.about h2{font-size:clamp(2.2rem,4.4vw,3.8rem);margin-bottom:1.6rem}
.about .muted{margin-bottom:1.1rem}
.stats{list-style:none;margin:0 0 1.2rem;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.fl-card{padding:1.6rem 1.4rem;border-radius:20px;background:#fff;box-shadow:var(--float);display:flex;flex-direction:column;gap:.3rem;transition:transform .5s var(--ease)}
.fl-card:hover{transform:translateY(-5px)}
.fl-card b{font:400 clamp(2.4rem,4vw,3.4rem)/1 var(--fd);letter-spacing:-.03em}
.fl-card span{font-size:.88rem;color:var(--slate)}
.lol{padding:1.6rem;border-radius:24px;background:var(--sage)}
.lol .eyebrow{color:var(--ink2)}
.lol ul{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.lol li{display:grid;grid-template-columns:3rem 1fr;grid-template-rows:auto auto;column-gap:1rem;align-items:center}
.lol b{grid-row:1/3;font:400 3rem/1 var(--fd);font-style:italic;color:var(--ink)}
.lol span{font:500 1.05rem var(--fb)}.lol small{font-size:.88rem;color:var(--ink2);opacity:.8}

/* ===== portfolio showcase: auto-scrolling browser window ===== */
.wk{position:relative;padding:3rem 0}
.wk-in{display:grid;grid-template-columns:.78fr 1.22fr;gap:3.5rem;align-items:center}
.wk-count{font:500 1rem var(--fm);color:var(--ash);margin-bottom:1rem}.wk-count b{font:400 4rem/1 var(--fd);color:var(--ink);letter-spacing:-.04em}
.wk-card{margin-bottom:3rem}
.wk-type{font:500 .75rem var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--leaf);margin-bottom:.8rem}
.wk-card h2{font-size:clamp(2rem,3.4vw,3.1rem);margin-bottom:.6rem}
.wk-tag{font:500 1.02rem var(--fb);color:var(--ink);margin-bottom:.9rem}
.wk-desc{color:var(--slate);font-size:.98rem}
.wk-own{display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;padding:.3rem .8rem;border-radius:99px;background:var(--mist);color:var(--slate);margin:.2rem 0 .6rem}
.wk-own i{width:7px;height:7px;border-radius:50%;background:var(--ash)}.wk-own.own{background:var(--sage);color:var(--ink)}.wk-own.own i{background:var(--leaf)}
.wk-index{list-style:none;margin:0;padding:0;display:none}
.bw{background:#fff;border-radius:18px;box-shadow:var(--float);overflow:hidden}
.bw-bar{display:flex;align-items:center;gap:7px;padding:.7rem .9rem;background:var(--mist);box-shadow:0 1px 0 var(--line)}
.bw-bar>i{width:10px;height:10px;border-radius:50%;background:rgba(0,51,51,.18)}
.bw-url{display:flex;align-items:center;gap:.5rem;margin:0 auto;min-width:min(340px,60%);padding:.25rem .9rem;border-radius:99px;background:#fff;font:400 .78rem var(--fb);color:var(--slate)}
.bw-url svg{width:12px;fill:none;stroke:var(--ash);stroke-width:1.4}.bw-url em{font-style:normal}
.bw-view{position:relative;height:min(62vh,540px);overflow:hidden;background:#fff}
.bw-page{position:absolute;inset:0;overflow:hidden}
.bw-img{width:100%;display:block;will-change:transform}
.poster{--vh:min(62vh,540px);width:100%;background:var(--pb);color:var(--pf);will-change:transform;font-family:var(--fb)}
.po-hero{height:var(--vh);display:grid;place-content:center;justify-items:center;gap:1rem;text-align:center;padding:2rem;position:relative;background:radial-gradient(60% 60% at 50% 40%,color-mix(in srgb,var(--pa) 28%,transparent),transparent 70%)}
.po-nav{position:absolute;top:1.1rem;left:1.4rem;right:1.4rem;display:flex;gap:.6rem;justify-content:center}.po-nav i{width:48px;height:6px;border-radius:6px;background:color-mix(in srgb,var(--pf) 35%,transparent)}
.po-hero h4{font:400 clamp(2rem,4.4vw,3.6rem)/1.05 var(--fd);letter-spacing:-.025em;margin:0}
.po-hero p{margin:0;max-width:34ch;opacity:.8}
.po-btn{padding:.55rem 1.2rem;border-radius:99px;background:var(--pa);color:var(--pb);font-size:.85rem;font-weight:500}
.po-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:2.5rem 2rem}.po-grid i{height:200px;border-radius:14px;background:color-mix(in srgb,var(--pf) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--pf) 12%,transparent)}
.po-text{padding:1rem 2rem 3rem;display:grid;gap:.7rem;max-width:62%}.po-text b{height:22px;width:55%;border-radius:6px;background:var(--pa)}.po-text i{height:9px;border-radius:5px;background:color-mix(in srgb,var(--pf) 22%,transparent)}.po-text i:nth-child(3){width:80%}.po-text i:nth-child(4){width:60%}
.po-split{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;padding:0 2rem 3rem}.po-split>div:first-child{height:240px;border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--pa) 55%,var(--pb)),var(--pb))}.po-split>div:last-child{display:grid;gap:.7rem;align-content:center}.po-split i{height:9px;border-radius:5px;background:color-mix(in srgb,var(--pf) 22%,transparent)}
.po-foot{height:130px;background:color-mix(in srgb,var(--pf) 8%,var(--pb));display:flex;gap:1.5rem;padding:2.2rem}.po-foot i{flex:1;height:8px;border-radius:5px;background:color-mix(in srgb,var(--pf) 25%,transparent)}
.wk-stage{position:relative}
.ph-frame{display:none}
@media(prefers-reduced-motion:no-preference){
  .js .wk{height:calc(var(--n)*170vh + 40vh);padding:0}
  .js .wk-sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden}
  .js .wk-cards{position:relative;min-height:380px}
  .js .wk-card{position:absolute;inset:0 0 auto 0;margin:0;opacity:0;transform:translateY(26px);filter:blur(4px);pointer-events:none;transition:opacity .7s var(--ease),transform .8s var(--ease),filter .7s}
  .js .wk-card.is-active{opacity:1;transform:none;filter:none;pointer-events:auto}
  .js .wk-index{display:grid;gap:.15rem;margin-top:1rem}
  .js .wk-index button{width:100%;display:flex;align-items:center;gap:.9rem;padding:.4rem 0;border:0;background:none;font:400 .9rem var(--fb);color:var(--ash);cursor:pointer;text-align:left;position:relative}
  .js .wk-index span{font:500 .72rem var(--fm)}.js .wk-index u{position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line)}
  .js .wk-index u::after{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(var(--p,0));transform-origin:0 50%}
  .js .wk-index li:hover button,.js .wk-index li[style*="--p:1"] button{color:var(--ink)}
  .js .bw-page{opacity:0;transform:scale(.965) translateY(26px);filter:blur(7px);transition:opacity .7s var(--ease),transform .9s var(--ease),filter .7s}
  .js .bw-page.is-active{opacity:1;transform:none;filter:none}
  .js .bw-page.is-prev{transform:scale(.965) translateY(-26px)}
  .js .ph-frame{display:block;position:absolute;right:-1.2rem;bottom:-2.4rem;width:150px;height:300px;border-radius:26px;background:#fff;box-shadow:0 0 0 5px var(--ink),var(--float);overflow:hidden;opacity:0;transform:translateY(30px);transition:.7s var(--ease);z-index:2}
  .js .ph-frame.is-active{opacity:1;transform:none}
  .ph-frame img{width:100%;will-change:transform}
}
@media(max-width:900px){
  .wk-in{grid-template-columns:1fr;gap:1.2rem}.wk-stage{order:-1}
  .bw-view{height:38vh}.poster{--vh:38vh}
  .js .wk-cards{min-height:300px}.wk-desc{font-size:.9rem;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
  .js .wk-index{display:none}.wk-count b{font-size:2.6rem}
  .js .ph-frame{width:92px;height:184px;right:-.4rem;bottom:-1.2rem}
  .about-grid{grid-template-columns:1fr;gap:2.5rem}
}

/* ===== plans ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ptoolbar{display:flex;flex-wrap:wrap;gap:1.2rem 2rem;justify-content:space-between;align-items:center;margin-bottom:2rem}
.seg{display:inline-flex;padding:4px;border-radius:99px;background:var(--mist)}
.seg button{border:0;background:none;padding:.6rem 1.3rem;border-radius:99px;font:450 .95rem var(--fb);color:var(--slate);cursor:pointer;transition:background .35s var(--ease),color .35s}
.seg button em{font-size:.78rem;font-style:normal;color:var(--leaf);margin-left:.4rem}
.seg button[aria-selected=true]{background:var(--ink);color:#fff}.seg button[aria-selected=true] em{color:var(--sage2)}
.ctabs{display:flex;flex-wrap:wrap;gap:.3rem 1.6rem}
.ctabs button{border:0;background:none;padding:.4rem 0;font:450 .95rem var(--fb);color:var(--ash);cursor:pointer;position:relative}
.ctabs button::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1.5px;background:var(--ink);transform:scaleX(0);transition:transform .45s var(--ease)}
.ctabs button[aria-selected=true]{color:var(--ink)}.ctabs button[aria-selected=true]::after{transform:scaleX(1)}
.pgrid[hidden]{display:none}
.pgrid+.pgrid{margin-top:4rem}
.pnote{color:var(--slate);margin-bottom:1.4rem}
.plan-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;gap:.15rem;padding:1.6rem 1.4rem 1.4rem;border-radius:24px;background:var(--mist);font-size:.9rem}
.plan.pop{background:#fff;box-shadow:0 0 0 1.5px var(--ink),var(--float)}
.plan-flag{position:absolute;top:0;right:1.2rem;transform:translateY(-50%);padding:.25rem .8rem;border-radius:99px;background:var(--ink);color:#fff;font:500 .68rem var(--fm);letter-spacing:.08em;text-transform:uppercase}
.plan-tier{font:500 .7rem var(--fm);letter-spacing:.1em;text-transform:uppercase;color:var(--ash);margin:0}
.plan-name{font:400 1.8rem/1.1 var(--fd);letter-spacing:-.02em;margin:.2rem 0 .3rem}
.plan-desc{color:var(--slate);min-height:3.1em;margin-bottom:.6rem}
.plan-price{display:flex;align-items:baseline;gap:.4rem;flex-wrap:wrap;margin:0}
.plan-price b{font:400 2.5rem/1 var(--fd);letter-spacing:-.03em}.plan-price span{color:var(--slate);font-size:.85rem}.plan-price i{font-style:normal;font-size:.72rem;color:var(--ash);padding:.1rem .5rem;border-radius:99px;box-shadow:inset 0 0 0 1px var(--line2)}
.plan-was{font-size:.8rem;color:var(--ash);margin:.2rem 0 0}.plan-was s{margin-right:.2rem}
.plan-meta{list-style:none;margin:.9rem 0;padding:.8rem 0;border-block:1px solid var(--line);display:grid;gap:.3rem;color:var(--slate)}.plan-meta b{color:var(--ink);font-weight:500}
.plan-rev{margin:0 0 .8rem;padding:.7rem .85rem;border-radius:14px;background:var(--sage);display:grid;gap:.15rem}.plan-rev b{font-weight:500}.plan-rev span{font-size:.8rem;color:var(--ink2);opacity:.85}
.plan-sess{font-weight:500;margin:.2rem 0 .1rem}
.plan-lab{font:500 .68rem var(--fm);letter-spacing:.1em;text-transform:uppercase;color:var(--ash);margin:.9rem 0 .5rem}
.plan-list{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.plan-list li{display:flex;gap:.5rem;color:var(--slate);line-height:1.4}
.plan-list svg{flex:none;width:14px;height:14px;margin-top:.15rem;fill:none;stroke:var(--leaf);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.plan .btn{margin-top:auto;justify-content:center;width:100%}
.plan-list+.plan-lab+.plan-list{margin-bottom:1.4rem}
.plan-list:last-of-type{margin-bottom:1.4rem}
@media(max-width:1180px){.plan-row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.plan-row{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}}

.fields select{font:inherit;color:var(--ink);background:#fff;border:1px solid transparent;border-radius:16px;padding:.85rem 1rem;width:100%;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 1.35rem,calc(100% - 15px) 1.35rem;background-size:5px 5px;background-repeat:no-repeat}
.fields select:focus{outline:none;border-color:var(--ink)}
.fields textarea{resize:vertical}
.qcard .opts-sm{grid-template-columns:repeat(3,1fr)}
.assure{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.6rem;margin:1.4rem 0 0;padding:0;font-size:.88rem;color:var(--slate)}
.assure li::before{content:"";display:inline-block;width:9px;height:5px;border-left:1.5px solid var(--leaf);border-bottom:1.5px solid var(--leaf);transform:rotate(-45deg) translateY(-2px);margin-right:.55rem}
@media(max-width:700px){.qcard .opts-sm{grid-template-columns:1fr 1fr}}

/* ===== AEO answer blocks, prose, stories, guides ===== */
.answer-sec{padding:clamp(1.5rem,3vw,2.5rem) 0 clamp(2rem,4vw,3rem)}
.answer{padding:1.6rem 1.8rem;border-radius:24px;background:var(--mist);border-left:3px solid var(--leaf)}
.answer .eyebrow{margin-bottom:.6rem}.answer p:last-child{margin:0;font-size:1.12rem;line-height:1.55;color:var(--ink)}
.prose{max-width:720px}.prose h2{font-size:clamp(1.7rem,3vw,2.3rem);margin:2.6rem 0 1rem}.prose p{color:var(--slate);font-size:1.07rem}.prose .answer{margin-bottom:1rem}.prose .answer p:last-child{color:var(--ink)}
.prose .ticks{margin:1rem 0 1.5rem}.ilink{color:var(--ink);border-bottom:1px solid var(--sage2);transition:border-color .3s}.ilink:hover{border-color:var(--ink)}
.narrow-wide{width:min(1000px,100% - 2.5rem);margin-inline:auto}
.meta{color:var(--ash);font-size:.9rem}
.article-grid{display:grid;grid-template-columns:230px minmax(0,720px);gap:4rem;justify-content:center}
.toc{position:sticky;top:6rem;align-self:start;font-size:.9rem}.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}.toc a{color:var(--slate);transition:color .2s}.toc a:hover{color:var(--ink)}
.cmp-wrap{overflow-x:auto;margin:1.5rem 0}.cmp{width:100%;border-collapse:separate;border-spacing:0;font-size:.95rem;background:#fff;border-radius:20px;box-shadow:var(--float);overflow:hidden}
.cmp th,.cmp td{padding:.9rem 1.1rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}.cmp thead th{font:500 .72rem var(--fm);letter-spacing:.08em;text-transform:uppercase;color:var(--ash);background:var(--fog)}
.cmp tbody th{font-weight:500;color:var(--ink)}.cmp td{color:var(--slate)}.cmp td:last-child{color:var(--ink);background:rgba(214,239,227,.35)}.cmp tr:last-child th,.cmp tr:last-child td{border-bottom:0}
.inline-cta{margin-top:3rem;padding:1.6rem 1.8rem;border-radius:24px;background:var(--sage);display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between}.inline-cta p{margin:0;color:var(--ink);max-width:36ch}
.story-hero{padding:1rem 0 2.5rem}.sp-art .art{height:min(420px,50vh);border-radius:28px;box-shadow:var(--float);padding:34px}
.bw-static .bw-view{height:min(440px,52vh)}.bw-img.auto,.poster.auto{animation:autoscroll 18s ease-in-out infinite alternate}
@keyframes autoscroll{from{transform:translateY(0)}to{transform:translateY(calc(-100% + min(440px,52vh)))}}
.sp-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:4rem;align-items:start;justify-content:center}
.story-body{max-width:none}.story-body h2:first-child{margin-top:0}
.pull{margin:2.4rem 0 0;padding:2rem;border-radius:24px;background:var(--sage)}.pull blockquote{margin:0 0 1rem;font:400 clamp(1.25rem,2.2vw,1.6rem)/1.4 var(--fd);letter-spacing:-.01em;color:var(--ink)}.pull figcaption{font-size:.9rem;color:var(--ink2)}
.facts{position:sticky;top:6rem}.facts-in{padding:1.6rem;border-radius:24px;background:#fff;box-shadow:var(--float)}
.facts-metric{margin:0 0 1.2rem;padding-bottom:1.2rem;border-bottom:1px solid var(--line);display:grid;gap:.2rem}.facts-metric b{font:400 2.6rem/1 var(--fd);letter-spacing:-.03em}.facts-metric span{font-size:.88rem;color:var(--slate)}
.facts dl{margin:0 0 1.2rem;display:grid;gap:.8rem}.facts dt{font:500 .68rem var(--fm);letter-spacing:.1em;text-transform:uppercase;color:var(--ash)}.facts dd{margin:.1rem 0 0;font-size:.95rem}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1.4rem;padding:0}.tags li{font-size:.75rem;padding:.25rem .65rem;border-radius:99px;background:var(--mist);color:var(--slate)}
.facts .btn{width:100%;justify-content:center}
.story-card{padding:0 0 1.5rem}.story-card>*:not(.sc-art){margin-inline:1.4rem}.story-card .eyebrow{margin-top:1.2rem;margin-bottom:.2rem}
.sc-art{margin:0;border-radius:24px 24px 0 0;overflow:hidden}.sc-art .art{height:170px;padding:14px;border-radius:0}
.sc-metric{font-size:.85rem;color:var(--slate);margin-top:.4rem;margin-bottom:0}.sc-metric b{font:400 1.3rem var(--fd);color:var(--ink);margin-right:.3rem}
@media(max-width:1000px){.article-grid,.sp-grid{grid-template-columns:1fr;gap:2rem}.toc,.facts{position:static}.toc ol{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){.bw-img.auto,.poster.auto{animation:none}}

/* social icons */
.footer .socials{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.2rem 0 0;padding:0;list-style:none}
.footer .socials li{display:block}
.footer .socials a{display:grid;place-items:center;width:42px;height:42px;padding:0;border-radius:50%;color:var(--ink);background:#fff;box-shadow:inset 0 0 0 1px var(--line2);transition:background .35s var(--ease),color .35s,transform .45s var(--ease),box-shadow .35s}
.footer .socials a:hover{background:var(--ink);color:#fff;transform:translateY(-3px);box-shadow:0 12px 20px -10px rgba(0,51,51,.5)}
.footer .socials svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* quote result */
.analyzing{display:grid;place-items:center;gap:1rem;min-height:240px;text-align:center}.analyzing p{margin:0;color:var(--ink2)}
.spin{width:38px;height:38px;border-radius:50%;border:3px solid rgba(0,51,51,.15);border-top-color:var(--ink);animation:spin 0.9s linear infinite}
.qsummary{font-size:1.1rem;margin:.2rem 0 1.2rem}
.qmeta{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:0 0 1.4rem}.qmeta dt{font:500 .7rem var(--fm);letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}.qmeta dd{margin:.2rem 0 0;font-weight:500}
.qcard .result{text-align:center;padding:1.2rem 0 1.4rem;border-block:1px solid rgba(0,51,51,.15);margin-bottom:1.6rem}
.incl h4,.terms h4{font:500 .75rem var(--fm);letter-spacing:.1em;text-transform:uppercase;margin:0 0 .8rem;color:var(--ink2)}
.incl ul{list-style:none;margin:0 0 1.2rem;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.45rem 1.4rem;font-size:.92rem}
.incl li{position:relative;padding-left:1.4rem}.incl li::before{content:"";position:absolute;left:0;top:.45em;width:9px;height:5px;border-left:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:rotate(-45deg)}
.fine-l{font-size:.82rem;color:var(--ink2);opacity:.8}
.qsent{font-size:.9rem;margin:.4rem 0 1.2rem}
.qlinks{display:flex;flex-wrap:wrap;gap:.8rem;margin-bottom:1.6rem}
.terms{padding-top:1.2rem;border-top:1px solid rgba(0,51,51,.15)}.terms ul{margin:0;padding-left:1.1rem;font-size:.88rem;color:var(--ink2);display:grid;gap:.3rem}
.qcard input[type=number]{font:inherit;color:var(--ink);background:#fff;border:1px solid transparent;border-radius:16px;padding:.85rem 1rem;width:100%}.qcard input[type=number]:focus{outline:none;border-color:var(--ink)}
@media(max-width:700px){.qmeta,.incl ul{grid-template-columns:1fr}}

/* ===== illustrated cards (line-art, Steep-inspired, original drawings) ===== */
.ic{--cb:var(--mist);display:grid;grid-template-rows:auto 1fr auto;gap:.6rem;padding:1.7rem 1.6rem 1.6rem;min-height:420px;position:relative;border-radius:24px;background:var(--mist);overflow:hidden;color:var(--ink);transition:background .5s var(--ease),transform .55s var(--ease),box-shadow .4s}
.ic:hover,a.ic:focus-visible{--cb:var(--sage);background:var(--sage)}
.ic .eyebrow{margin:0 0 .5rem}
.ic h3{font:450 1.5rem/1.15 var(--fb);letter-spacing:-.02em;color:var(--ink);margin:0}
.ic-art{display:grid;place-items:center;padding:.4rem 0}
.art-svg{width:100%;max-width:250px;height:auto;overflow:visible;transition:transform .8s var(--ease)}
.ic:hover .art-svg{transform:translateY(-6px) rotate(-1.2deg)}
.art-svg *{fill:var(--cb);stroke:var(--ink);stroke-width:1.25;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.art-svg .nf,.art-svg .sp{fill:none}
.art-svg .ac,.art-svg .lens,.art-svg .tagbody{fill:var(--sage2)}
.ic:hover .art-svg .ac,.ic:hover .art-svg .lens,.ic:hover .art-svg .tagbody{fill:#fff}
.art-svg .solid{fill:var(--ink)}
.art-svg .dash{stroke-dasharray:3 4}
.art-svg .thick{stroke-width:1.8}
.art-svg .back{fill:var(--cb);opacity:.9}
.art-svg .flame{fill:var(--sage2)}
.art-svg .panel,.art-svg .shield{fill:var(--cb)}
.art-svg .cursor{fill:var(--ink)}
.ic p:not(.eyebrow){color:var(--slate);font-size:.95rem;margin:0}
.ic:hover p:not(.eyebrow){color:var(--ink2)}
.ic .more{margin-top:.2rem;padding-top:0}
/* the lines draw themselves in as the card reveals */
.js .ic .art-svg *{stroke-dasharray:1;stroke-dashoffset:1}
.js .ic .art-svg .dash{stroke-dasharray:3 4;stroke-dashoffset:0}
.js .ic.in .art-svg *:not(.dash){animation:artdraw 1.5s var(--ease) forwards;animation-delay:calc(var(--k,0)*45ms + 250ms)}
.js .ic .art-svg .sp,.js .ic .art-svg .solid{opacity:0}
.js .ic.in .art-svg .sp,.js .ic.in .art-svg .solid{animation:artdraw 1.5s var(--ease) forwards,artpop .8s 1.2s var(--ease) forwards}
@keyframes artdraw{to{stroke-dashoffset:0}}
@keyframes artpop{to{opacity:1}}
.ic.in .art-svg .sp{animation:artdraw 1.2s var(--ease) forwards,twinkle 3s 1.6s ease-in-out infinite!important}
@keyframes twinkle{50%{opacity:.25}}
.cards.c3 .ic,.cards.c4 .ic{min-height:380px}
@media(prefers-reduced-motion:reduce){.js .ic .art-svg *{stroke-dashoffset:0!important;animation:none!important;opacity:1!important}}
@media(max-width:560px){.ic{min-height:340px}}

.why-list{grid-template-columns:1fr 1fr}.why-list li{display:block;padding:0;background:none;border-radius:0}.why-list li .ic{height:100%}
.why-list li .ic{min-height:360px}
.verify{margin-top:3rem}
.ic .sc-metric{font-size:.85rem;color:var(--slate)}.ic .sc-metric b{font:400 1.3rem var(--fd);color:var(--ink);margin-right:.3rem}
.ic-body{display:grid;gap:.5rem}
.ic-body p{margin:0}
@media(max-width:1000px){.why-list{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.why-list{grid-template-columns:1fr}}

/* rhythm: a heading is never glued to the text below it */
h1+p,h2+p,h1+.lead,h2+.muted{margin-top:1.15rem}
.ic .eyebrow{line-height:1.4;letter-spacing:0;font-size:.875rem}

.mini h3{margin-bottom:.4rem}.timeline h3{margin-bottom:.6rem}.plan-name{margin-bottom:.55rem}.plan-name+.plan-desc{margin-top:0}
.btn{font-weight:430}

.hero h1{max-width:20ch;font-size:clamp(2.5rem,4.6vw,4.4rem)}
.hero-sm h1{max-width:22ch;font-size:clamp(2.4rem,4.6vw,4.2rem)}

/* ===== process: scroll-driven sequence ===== */
.tl{position:relative;--tl:0}
.timeline{gap:1.5rem}
.timeline::before{transition:transform .25s linear}
.timeline li{padding-top:0}
.timeline .n{position:relative;transition:background .5s var(--ease),color .4s,border-color .4s,transform .6s var(--ease),box-shadow .5s}
.tl-art{margin:.4rem 0 .8rem;min-height:104px}
.tl-art .art-svg{max-width:132px;--cb:var(--paper)}
.tl-dot{position:absolute;top:22px;left:calc(var(--tl)*100%);width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--leaf);box-shadow:0 0 0 6px rgba(10,122,102,.14),0 0 24px 4px rgba(10,122,102,.35);transition:left .25s linear,opacity .3s;opacity:calc(var(--tl)*40);pointer-events:none}
.js .timeline li h3,.js .timeline li p{opacity:.35;transform:translateY(8px);transition:opacity .7s var(--ease),transform .8s var(--ease)}
.js .timeline li.done h3,.js .timeline li.done p{opacity:1;transform:none}
.js .timeline li.done p{transition-delay:.12s}
.js .timeline li .n{transform:scale(.9)}
.timeline li.done .n{background:var(--ink);color:#fff;border-color:var(--ink);transform:none;animation:nodepop .7s var(--ease)}
.timeline li.cur .n::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1.5px solid var(--leaf);animation:nodering 2s ease-out infinite}
@keyframes nodepop{0%{transform:scale(.6)}60%{transform:scale(1.18)}100%{transform:scale(1)}}
@keyframes nodering{from{opacity:.9;transform:scale(.85)}to{opacity:0;transform:scale(1.5)}}
.js .tl-art .art-svg *{stroke-dasharray:1;stroke-dashoffset:1}
.js .tl-art .art-svg .dash{stroke-dasharray:3 4;stroke-dashoffset:0}
.js .timeline li.done .tl-art .art-svg *:not(.dash){animation:artdraw 1.4s var(--ease) forwards;animation-delay:calc(var(--k,0)*40ms + 150ms)}
.js .tl-art .art-svg .sp,.js .tl-art .art-svg .solid{opacity:0}
.js .timeline li.done .tl-art .art-svg .sp,.js .timeline li.done .tl-art .art-svg .solid{animation:artdraw 1.4s var(--ease) forwards,artpop .8s 1s var(--ease) forwards}
@media(max-width:1000px){
  .timeline{grid-template-columns:1fr;gap:1.8rem;padding-left:4.2rem}
  .timeline::before,.timeline::after{display:block;left:21px;right:auto;top:0;bottom:0;width:2px;height:auto}
  .timeline::before{transform:scaleY(var(--tl));transform-origin:50% 0}
  .timeline .n{position:absolute;left:-4.2rem;top:0;margin:0}
  .tl-art{min-height:0;margin:.2rem 0 .6rem}.tl-art .art-svg{max-width:110px}
  .tl-dot{top:calc(var(--tl)*100%);left:22px;margin:-7px 0 0 -6px}
}
@media(prefers-reduced-motion:reduce){.js .timeline li h3,.js .timeline li p{opacity:1;transform:none}.js .tl-art .art-svg *{stroke-dashoffset:0!important;opacity:1!important;animation:none!important}.tl-dot{display:none}.timeline li .n{background:var(--ink);color:#fff}}

/* ===== why: pinned, cards arrive one by one ===== */
.why-seq{position:relative}
.why-pin{padding:clamp(4rem,8vw,7rem) 0}
.why-grid{grid-template-columns:.8fr 1.2fr;align-items:center}
.why-grid>.why-copy{position:static}
.why-prog{margin-top:2rem;font:450 .95rem var(--fb);color:var(--ash)}.why-prog b{font:400 3rem/1 var(--fd);color:var(--ink);letter-spacing:-.04em;margin-right:.2rem}
.js .seq{opacity:0;transform:translateY(54px) scale(.94);filter:blur(5px);transition:opacity .8s var(--ease),transform .9s var(--ease),filter .8s,background .5s}
.js .seq.in{opacity:1;transform:none;filter:none}
@media(min-width:901px) and (prefers-reduced-motion:no-preference){
  .js .why-seq{height:calc(100vh + 150vh)}
  .js .why-pin{position:sticky;top:0;height:100vh;display:flex;align-items:center;padding:0}
  .js .why-pin .why-grid{width:min(1200px,100% - 2.5rem)}
  .why-list li .ic{min-height:clamp(250px,36vh,360px)}
  .why-list .ic-art{padding:0}.why-list .art-svg{max-width:190px}
}
@media(max-width:900px){.why-grid{grid-template-columns:1fr}.why-prog{display:none}}
@media(prefers-reduced-motion:reduce){.js .seq{opacity:1;transform:none;filter:none}}

/* ===== case-study tunnel cards: same illustrated-card language ===== */
.pfc{--cb:#fff;display:grid;grid-template-rows:auto auto 1fr auto;gap:.5rem;padding:1.5rem 1.6rem 1.5rem;width:min(500px,100%);margin:calc(min(560px,70vh)/-2 + 10px) 0 0 -250px}
.pfc .eyebrow{margin:0}
.pfc h3{font:450 1.5rem/1.15 var(--fb);letter-spacing:-.02em}
.pfc .ic-art{padding:0}.pfc .art-svg{max-width:180px;max-height:21vh}
.pfc-body{padding:0;display:grid;gap:.9rem}.pfc-body p{margin:0;color:var(--slate);font-size:.95rem}
.pfc-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;padding-top:.9rem;border-top:1px solid var(--line)}
.pfc-foot .more{margin:0;padding:0;white-space:nowrap}
.pfc-kpi{text-align:left}.pfc-kpi b{display:block;font:400 1.8rem/1 var(--fd);letter-spacing:-.03em}.pfc-kpi span{font-size:.75rem;color:var(--ash);display:block;margin-top:.25rem;max-width:20ch}
.js .pfc .art-svg *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.5s var(--ease)}
.js .pfc .art-svg .dash{stroke-dasharray:3 4;stroke-dashoffset:0}
.js .pfc.front .art-svg *:not(.dash){stroke-dashoffset:0}
.js .pfc .art-svg .sp,.js .pfc .art-svg .solid{opacity:0;transition:opacity .8s .9s}.js .pfc.front .art-svg .sp,.js .pfc.front .art-svg .solid{opacity:1}
.pfc.front .art-svg{animation:artbob 6s ease-in-out infinite}
@keyframes artbob{50%{transform:translateY(-6px)}}
@media(max-width:900px){.pfc{width:min(340px,86vw);margin-left:calc(min(340px,86vw)/-2);padding:1.2rem}.pfc .art-svg{max-height:15vh}.pfc h3{font-size:1.25rem}.pfc-body p{display:none}}
@media(prefers-reduced-motion:reduce){.js .pfc .art-svg *{stroke-dashoffset:0!important;opacity:1!important}}

.foot-base a{border-bottom:1px solid var(--sage2)}.foot-base a:hover{color:var(--ink);border-color:var(--ink)}

.tl-dot{opacity:clamp(0,min(calc(var(--tl)*40),calc((1 - var(--tl))*14)),1)}

/* ===== instant quote v2: stepper, live estimate, rich inputs ===== */
.qcard{max-width:1120px;padding:clamp(1.2rem,3vw,2.2rem) clamp(1.2rem,3vw,2.4rem) clamp(1.4rem,3vw,2.4rem)}
.qbar{display:none}
.qsteps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin:0 0 2rem;padding:0;position:relative}
.qsteps li{display:flex;align-items:center;gap:.6rem;font-size:.9rem;color:var(--ink2);opacity:.55;position:relative;transition:opacity .4s}
.qsteps li::after{content:"";flex:1;height:2px;margin-left:.5rem;border-radius:2px;background:rgba(0,51,51,.15)}
.qsteps li:last-child::after{display:none}
.qsteps li span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink);font:400 1rem var(--fd);flex:none;transition:background .4s,color .4s}
.qsteps li.is-cur,.qsteps li.done{opacity:1}
.qsteps li.is-cur span{background:var(--ink);color:#fff}
.qsteps li.done span{background:var(--ink);color:#fff;font-size:0}
.qsteps li.done span::before{content:"";width:9px;height:5px;border-left:1.8px solid #fff;border-bottom:1.8px solid #fff;transform:rotate(-45deg) translateY(-1px)}
.qsteps li.done::after{background:var(--ink)}
.qsteps b{font-weight:480;white-space:nowrap}
.qgrid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:2rem;align-items:start}
.qcard[data-step="4"] .qgrid{grid-template-columns:1fr}.qcard[data-step="4"] .qlive{display:none}
.qstep h3{font:400 1.9rem/1.15 var(--fd);letter-spacing:-.015em;margin-bottom:1.4rem}
.qstep>.muted{margin:-.8rem 0 1.4rem}
.fld{display:grid;gap:.5rem;margin-bottom:1.3rem;border:0;padding:0;min-width:0}
.flab{font-size:.88rem;font-weight:480;color:var(--ink)}
.fi{position:relative;display:block}
.fi .ico-in{position:absolute;left:14px;top:15px;width:20px;height:20px;fill:none;stroke:var(--ash);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.fi input,.fi textarea{width:100%;font:inherit;color:var(--ink);background:#fff;border:1.5px solid transparent;border-radius:16px;padding:.85rem 1rem .85rem 2.9rem;transition:border-color .3s,box-shadow .3s}
.fi textarea{resize:vertical;min-height:92px}
.fi input:focus,.fi textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 4px rgba(0,51,51,.1)}
.fi:focus-within .ico-in{stroke:var(--ink)}
.chipset{display:flex;flex-wrap:wrap;gap:.45rem}
.qchip{border:0;cursor:pointer;font:450 .85rem var(--fb);padding:.4rem .9rem;border-radius:99px;background:rgba(255,255,255,.7);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(0,51,51,.14);transition:background .3s,color .3s,transform .3s var(--ease)}
.qchip:hover{background:#fff;transform:translateY(-1px)}.qchip.on{background:var(--ink);color:#fff}
.tlopts{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.tlopt{position:relative;cursor:pointer}.tlopt input{position:absolute;opacity:0;inset:0;cursor:pointer}
.tlopt span{display:grid;gap:.1rem;padding:.9rem 1.1rem;border-radius:16px;background:rgba(255,255,255,.65);box-shadow:inset 0 0 0 1px rgba(0,51,51,.12);transition:.35s var(--ease)}
.tlopt b{font:480 1rem var(--fb)}.tlopt small{font-size:.8rem;color:var(--slate)}
.tlopt:hover span{background:#fff;transform:translateY(-2px)}
.tlopt input:checked+span{background:#fff;box-shadow:inset 0 0 0 2px var(--ink),0 14px 28px -18px rgba(0,51,51,.55)}
.tlopt input:focus-visible+span,.ftile input:focus-visible~.ft-t{outline:2px solid var(--leaf);outline-offset:2px}
.fgroup{border:0;padding:0;margin:0 0 1.4rem;min-width:0}
.fgroup legend{font:450 .85rem var(--fb);color:var(--ink2);padding:0;margin-bottom:.6rem}
.ftiles{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.ftile{position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.2rem .8rem;padding:.8rem .9rem;border-radius:16px;background:rgba(255,255,255,.65);box-shadow:inset 0 0 0 1px rgba(0,51,51,.1);cursor:pointer;transition:background .3s,box-shadow .35s var(--ease),transform .35s var(--ease)}
.ftile input{position:absolute;opacity:0;inset:0;cursor:pointer}
.ftile:hover{background:#fff;transform:translateY(-2px)}
.ft-i{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(0,51,51,.07);transition:background .35s,transform .45s var(--ease)}
.ft-i svg{width:22px;height:22px;fill:none;stroke:var(--ink);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ft-t{display:grid;gap:.1rem;min-width:0;padding-right:1.6rem}.ft-t b{font:480 .93rem/1.25 var(--fb)}.ft-t small{font-size:.76rem;line-height:1.35;color:var(--slate)}
.pips{position:absolute;right:.9rem;bottom:.75rem;display:flex;gap:3px}.pips i{width:5px;height:5px;border-radius:50%;background:rgba(0,51,51,.18)}.pips i.on{background:var(--ink)}
.ft-c{position:absolute;right:.8rem;top:.8rem;width:20px;height:20px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(0,51,51,.25);display:grid;place-items:center;transition:background .3s,box-shadow .3s,transform .4s var(--ease)}
.ft-c svg{width:12px;height:12px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .4s .05s var(--ease)}
.ftile input:checked~.ft-c{background:var(--ink);box-shadow:none;transform:scale(1.08)}.ftile input:checked~.ft-c svg{stroke-dashoffset:0}
.ftile:has(input:checked){background:#fff;box-shadow:inset 0 0 0 2px var(--ink),0 14px 28px -20px rgba(0,51,51,.55)}
.ftile:has(input:checked) .ft-i{background:var(--sage2);transform:rotate(-6deg) scale(1.05)}
.ftile .ft-i svg path,.ftile .ft-i svg rect,.ftile .ft-i svg circle{transition:stroke .3s}
.qcard .fields{grid-template-columns:1fr 1fr;gap:0 1rem}
.qcard .fields .fld.full{grid-column:1/-1}
.qlive{position:sticky;top:6.5rem;padding:1.4rem;border-radius:22px;background:#fff;box-shadow:var(--float)}
.ql-h{font:450 .85rem var(--fb);color:var(--ash);margin:0 0 .6rem}
.ql-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:.2rem .6rem;font:400 2.1rem/1.1 var(--fd);letter-spacing:-.03em}.ql-price i{font:450 .8rem var(--fb);font-style:normal;color:var(--ash)}
.ql-sub{margin:.4rem 0 1.1rem;font-size:.82rem;color:var(--slate)}
.ql-list{margin:0;display:grid;gap:.6rem;padding:1rem 0;border-block:1px solid var(--line)}
.ql-list div{display:grid;grid-template-columns:70px 1fr;gap:.6rem;font-size:.85rem}.ql-list dt{color:var(--ash)}.ql-list dd{margin:0;font-weight:450;overflow-wrap:anywhere}
.ql-tags{list-style:none;display:flex;flex-wrap:wrap;gap:.35rem;margin:1rem 0 0;padding:0}
.ql-tags li{font-size:.72rem;padding:.22rem .6rem;border-radius:99px;background:var(--sage);animation:tagin .5s var(--ease)}
@keyframes tagin{from{opacity:0;transform:scale(.8)}}
.ql-note{font-size:.76rem;color:var(--ash);margin:1rem 0 0}
@media(max-width:960px){.qgrid{grid-template-columns:1fr}.qlive{position:static;order:2}.qsteps b{display:none}.qsteps li.is-cur b{display:inline}}
@media(max-width:640px){.ftiles,.tlopts,.qcard .fields{grid-template-columns:1fr}.qsteps{gap:.2rem}}

.qcard .fi input[type=number]{padding:.85rem 1rem .85rem 2.9rem;border:1.5px solid transparent}
.qcard .fi input[type=number]:focus{border-color:var(--ink)}
.qsteps li.done span{font-size:0;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") center/14px no-repeat}
.qsteps li.done span::before{display:none}

/* ===== custom cursor (fine pointers only; see assets/js/cursor.js) ===== */
.cur-dot,.cur-ring{position:fixed;left:0;top:0;z-index:9999;pointer-events:none;opacity:0;will-change:transform}
.cur-dot.on,.cur-ring.on{opacity:1}
.cur-dot{width:7px;height:7px;border-radius:50%;background:var(--ink);transition:opacity .25s,background .25s,width .3s var(--ease),height .3s var(--ease)}
.cur-dot.dark{background:#fff}.cur-dot.press{width:5px;height:5px}
.cur-ring{width:34px;height:34px;border-radius:50%;border:1.5px solid rgba(0,51,51,.45);transition:opacity .25s,width .45s var(--ease),height .45s var(--ease),border-radius .45s var(--ease),background .3s,border-color .3s}
.cur-in{position:absolute;inset:0;display:grid;place-items:center;border-radius:inherit;transition:transform .3s var(--ease)}
.cur-ring.press .cur-in{transform:scale(.88)}
.cur-label{font:480 .78rem var(--fb);letter-spacing:0;color:#fff;opacity:0;transform:translateY(4px);transition:opacity .25s,transform .35s var(--ease)}
.cur-ring.has-label .cur-label{opacity:1;transform:none}
.cur-ring[data-mode=link]{background:rgba(185,227,209,.5);border-color:transparent}
.cur-ring[data-mode=snap]{border-color:var(--ink);background:rgba(185,227,209,.18)}
.cur-ring[data-mode=snap].dark{border-color:#fff;background:rgba(255,255,255,.12)}
.cur-ring[data-mode=card]{background:var(--ink);border-color:var(--ink)}
.cur-ring[data-mode=scroll]{background:var(--sage);border-color:var(--ink)}.cur-ring[data-mode=scroll] .cur-label{color:var(--ink)}
.cur-ring[data-mode=text]{opacity:0}
.cur-ring[data-mode=card]~*,.cur-dot{mix-blend-mode:normal}
html.has-cursor,html.has-cursor a,html.has-cursor button,html.has-cursor label,html.has-cursor summary,html.has-cursor [role=tab]{cursor:none}
html.has-cursor.cur-text,html.has-cursor.cur-text input,html.has-cursor.cur-text textarea,html.has-cursor.cur-text select{cursor:text}
html.cur-text .cur-dot{opacity:0}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.cur-dot,.cur-ring{display:none}}

/* starting-at prices */
.ic-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:.8rem;margin-top:.2rem;padding-top:.9rem;border-top:1px solid rgba(0,51,51,.1)}
.ic-foot .more{margin:0;padding:0;white-space:nowrap}
.ic-from{display:grid;gap:.1rem}.ic-from small{font-size:.74rem;color:var(--ash)}
.ic-from b{font:400 1.45rem/1 var(--fd);letter-spacing:-.02em;color:var(--ink)}.ic-from b i{font:450 .78rem var(--fb);font-style:normal;color:var(--slate);margin-left:.25rem}
.ic-from.q b{font:450 .98rem var(--fb);letter-spacing:0}
.fine-note{margin:1.6rem 0 0;font-size:.85rem;color:var(--ash);max-width:70ch}
.hero-from{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:.3rem .6rem;margin:-.6rem 0 1.8rem;font-size:1rem}
.hero-from span{color:var(--ash)}.hero-from b{font:400 1.9rem/1 var(--fd);letter-spacing:-.02em}.hero-from small{flex-basis:100%;text-align:center;color:var(--ash);font-size:.82rem}

/* ===== guides: pillar card, guide map, series box, sources ===== */
.pillar-card{display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:2.4rem;align-items:center;padding:2rem;border-radius:28px;background:var(--mist);transition:background .5s var(--ease),box-shadow .4s}
.pillar-card:hover{background:var(--sage)}
.pillar-card .pc-art{--cb:var(--mist);display:grid;place-items:center}.pillar-card:hover .pc-art{--cb:var(--sage)}
.pillar-card .art-svg{max-width:260px}
.pillar-card .eyebrow{margin-bottom:.6rem}
.pillar-card h3{font:400 clamp(1.6rem,2.6vw,2.3rem)/1.15 var(--fd);letter-spacing:-.02em;margin:0 0 .9rem}
.pillar-card p:not(.eyebrow){color:var(--slate);margin:0 0 1rem;max-width:60ch}
.gmap{margin:1.6rem 0;padding:1.5rem 1.6rem;border-radius:22px;background:var(--mist)}
.gmap h3{font:480 1.15rem/1.3 var(--fb);margin:0 0 .4rem}.gmap p.muted{margin:0 0 .9rem;font-size:.92rem}
.gmap ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.gmap li{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;padding:.45rem 0;border-bottom:1px solid var(--line)}.gmap li:last-child{border:0}
.gmap li span{font-size:.78rem;color:var(--ash);white-space:nowrap}
.series{margin:0 0 1.6rem;padding:1rem 1.3rem;border-radius:18px;background:var(--sage)}
.series .eyebrow{margin:0 0 .3rem}.series p:last-child{margin:0;color:var(--ink);font-size:.95rem}
.sources{margin:0 0 1.5rem;padding-left:1.2rem;display:grid;gap:.4rem;color:var(--slate)}
.guides-teaser{background:var(--paper)}
@media(max-width:800px){.pillar-card{grid-template-columns:1fr;gap:1rem;padding:1.4rem}}

/* ===== cookie consent ===== */
.linklike{border:0;background:none;padding:0;font:inherit;color:inherit;text-decoration:underline;text-decoration-color:var(--sage2);text-underline-offset:3px;cursor:pointer}.linklike:hover{color:var(--ink)}
.cc{position:fixed;left:1.2rem;bottom:1.2rem;z-index:300;width:min(440px,calc(100% - 2.4rem));padding:1.4rem 1.5rem;border-radius:22px;background:#fff;box-shadow:var(--float),0 0 0 1px rgba(0,51,51,.06);opacity:0;transform:translateY(24px) scale(.98);pointer-events:none;visibility:hidden;transition:opacity .5s var(--ease),transform .6s var(--ease),visibility 0s .6s;outline:none}
.cc.show{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition:opacity .5s var(--ease),transform .6s var(--ease)}
.cc h2{font:400 1.5rem/1.15 var(--fd);letter-spacing:-.015em;margin:0 0 .5rem}
.cc p{font-size:.88rem;line-height:1.5;color:var(--slate);margin:0 0 1rem}.cc p a{color:var(--ink);border-bottom:1px solid var(--sage2)}
.cc-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.cc .btn{flex:1 1 auto;justify-content:center}
.cc-link{border:0;background:none;font:450 .88rem var(--fb);color:var(--ink);cursor:pointer;padding:.4rem .5rem;text-decoration:underline;text-decoration-color:var(--sage2);text-underline-offset:3px}
.cc-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--line);cursor:pointer}
.cc-row b{display:block;font-weight:480;font-size:.92rem}.cc-row small{display:block;font-size:.78rem;color:var(--slate);margin-top:.1rem}
.cc-row input{appearance:none;flex:none;width:42px;height:24px;border-radius:99px;background:rgba(0,51,51,.2);position:relative;cursor:pointer;transition:background .3s}
.cc-row input::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .35s var(--ease)}
.cc-row input:checked{background:var(--ink)}.cc-row input:checked::after{transform:translateX(18px)}.cc-row input:disabled{opacity:.55;cursor:not-allowed}
.cc-panel .cc-actions{margin-top:1rem}
.cc [hidden]{display:none!important}
@media(max-width:560px){.cc{left:.6rem;right:.6rem;bottom:.6rem;width:auto}.cc-actions .btn{flex:1 1 100%}}
@media(prefers-reduced-motion:reduce){.cc,.cc.show{transition:none}}

/* viewport-sized screenshots fill the window */
.bw-img{width:100%;height:100%;object-fit:cover;object-position:top}

.solutions{margin-top:2.2rem;display:grid;gap:.8rem;justify-items:center;text-align:center}
.solutions ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}
.solutions a{display:inline-block;padding:.5rem 1rem;border-radius:99px;background:var(--mist);color:var(--ink);font-size:.9rem;text-decoration:none;transition:background .2s,transform .2s}
.solutions a:hover{background:var(--sage);transform:translateY(-2px)}
.dd-m .dd-all{grid-column:1/-1;border-top:1px solid var(--line);margin-top:.3rem;padding-top:.7rem;font-weight:500}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-template-columns:1fr 1fr}.foot-brand .fb-id{grid-column:1/-1}}

/* Trustpilot review grid */
.tp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem;margin:0 auto 3rem;max-width:1100px;align-items:start}
.tp-grid .tp{margin:0;max-width:none;padding:1.8rem 2rem}
.tp-stars{color:#00b67a;letter-spacing:.12em;font-size:.95rem}
.tp-h{margin:.2rem 0 .8rem;font:500 1.15rem/1.3 var(--fb);letter-spacing:-.01em;color:var(--ink)}
.tp-grid .tp blockquote{font:400 1.05rem/1.6 var(--fb);letter-spacing:0;color:var(--ink2)}
.tp-d{display:inline-block;margin-top:.4rem;font-size:.85rem;color:var(--ash)}
@media(max-width:800px){.tp-grid{grid-template-columns:1fr}}

/* reviews + fact sheet pages */
.rvp{margin:0 0 1.6rem;padding:1.8rem 2rem;border-radius:24px;background:#fff;box-shadow:var(--float)}
.rvp h3{margin:.2rem 0 1rem;font:400 clamp(1.3rem,2.4vw,1.7rem)/1.3 var(--fd);letter-spacing:-.01em}
.rvp p{margin:0 0 1rem;color:var(--ink2);line-height:1.65}.rvp .tp-d{margin:1.2rem 0 0;color:var(--ash);font-size:.9rem}.rvp .tp-d b{color:var(--ink)}
.tm-list{display:grid;gap:1.2rem}.tm-list figure{margin:0;padding:1.4rem 1.6rem;border-radius:20px;background:#fff;box-shadow:var(--float)}
.tm-list blockquote{margin:0 0 .9rem;font-size:1.02rem;line-height:1.6;color:var(--ink2)}.tm-list figcaption{font-size:.9rem;color:var(--slate)}.tm-list figcaption b{color:var(--ink)}
.fs{margin:0;display:grid;gap:0;border-radius:24px;background:#fff;box-shadow:var(--float);overflow:hidden}
.fs>div{display:grid;grid-template-columns:minmax(150px,230px) 1fr;gap:1.4rem;padding:1.1rem 1.6rem;border-bottom:1px solid var(--line)}.fs>div:last-child{border-bottom:0}
.fs dt{font:500 .72rem var(--fm);letter-spacing:.1em;text-transform:uppercase;color:var(--ash);padding-top:.2rem}.fs dd{margin:0;color:var(--ink);line-height:1.55;overflow-wrap:anywhere}
@media(max-width:640px){.fs>div{grid-template-columns:1fr;gap:.3rem}}

/* currency picker */
.cur-pick{display:inline-flex;align-items:center;gap:.35rem;font-size:inherit;color:inherit}
.cur-pick select{appearance:none;-webkit-appearance:none;border:1px solid var(--line2);border-radius:99px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23003333' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat right .6rem center/9px;padding:.25rem 1.6rem .25rem .7rem;font:500 .8rem var(--fb);color:var(--ink);cursor:pointer}
.cur-pick select:focus-visible{outline:2px solid var(--leaf);outline-offset:2px}
.ql-h{display:flex;align-items:center;justify-content:space-between;gap:.6rem}.cur-pick.cur-in{position:static;width:auto;height:auto;inset:auto;float:none;margin:0;text-transform:none;letter-spacing:0}
.foot-base .cur-pick{margin-right:.2rem}

/* custom currency picker */
select[data-currency][data-enhanced]{display:none}
.cur-l{font-size:.85rem;color:var(--ash)}
.cx{position:relative;display:inline-block;vertical-align:middle;text-transform:none;letter-spacing:0;font-family:var(--fb)}
.cx-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.28rem .7rem .28rem .3rem;border-radius:99px;border:1px solid var(--line2);background:#fff;color:var(--ink);font:500 .82rem var(--fb);cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s}
.cx-btn:hover{border-color:var(--leaf);box-shadow:0 6px 16px -10px rgba(0,51,51,.45)}
.cx-btn:focus-visible,.cx-menu li:focus-visible{outline:2px solid var(--leaf);outline-offset:2px}
.cx-btn svg{width:9px;height:6px;opacity:.7;transition:transform .2s}.cx.open .cx-btn svg{transform:rotate(180deg)}
.cx-code{font-weight:600;letter-spacing:.02em}
.cx-sym{display:grid;place-items:center;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--sage);color:var(--ink);font:500 .9rem/1 var(--fd)}
.cx-menu{position:absolute;z-index:60;top:calc(100% + .45rem);left:0;min-width:230px;margin:0;padding:.4rem;list-style:none;border-radius:18px;background:#fff;box-shadow:0 24px 50px -16px rgba(0,51,51,.35),0 0 0 1px var(--line);transform-origin:top left;animation:cxIn .18s var(--ease)}
.cx-menu[hidden]{display:none}
.cx.right .cx-menu{left:auto;right:0;transform-origin:top right}
.cx.up .cx-menu{top:auto;bottom:calc(100% + .45rem);transform-origin:bottom left}.cx.up.right .cx-menu{transform-origin:bottom right}
.cx-menu li[role=option]{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.75rem;padding:.55rem .65rem;border-radius:12px;color:var(--ink);cursor:pointer;transition:background .15s}
.cx-menu li[role=option]:hover,.cx-menu li[role=option]:focus{background:var(--mist);outline:none}
.cx-menu li[aria-selected=true]{background:var(--sage)}
.cx-menu .cx-sym{width:2rem;height:2rem;font-size:1.05rem;background:var(--mist)}.cx-menu li[aria-selected=true] .cx-sym{background:#fff}
.cx-name{display:grid;line-height:1.25}.cx-name b{font:500 .92rem var(--fb)}.cx-name small{font:500 .7rem var(--fm);letter-spacing:.08em;color:var(--ash)}
.cx-tick{width:16px;height:16px;color:var(--ink);opacity:0;transform:scale(.6);transition:opacity .15s,transform .2s}.cx-tick svg{width:100%;height:100%}.cx-menu li[aria-selected=true] .cx-tick{opacity:1;transform:none}
.cx-note{margin:.3rem .3rem .1rem;padding-top:.5rem;border-top:1px solid var(--line);font-size:.72rem;color:var(--ash);cursor:default}
@keyframes cxIn{from{opacity:0;transform:translateY(-4px) scale(.97)}to{opacity:1;transform:none}}
.cx.up .cx-menu{animation-name:cxInUp}@keyframes cxInUp{from{opacity:0;transform:translateY(4px) scale(.97)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.cx-menu,.cx.up .cx-menu{animation:none}.cx-btn svg,.cx-tick{transition:none}}
.foot-base .cx-btn{font-size:.8rem}
.cur-pick.cur-in{display:inline-flex}
/* inside the estimate panel the menu stays within the panel (the quote card clips overflow) */
.qcard .cx-menu{left:auto;right:0;min-width:0;width:min(215px,calc(100vw - 3rem));transform-origin:top right}
.qcard .cx.up .cx-menu{transform-origin:bottom right}

/* quote v3: project types, pages picker */
.tgroup{border:0;padding:0;margin:0 0 1.2rem;min-width:0}.tgroup legend{padding:0}
.tg-l{margin:.9rem 0 .5rem;font:500 .7rem var(--fm);letter-spacing:.1em;text-transform:uppercase;color:var(--ash)}
.ptiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.ptile{position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.7rem;padding:.75rem .85rem;border-radius:16px;background:rgba(255,255,255,.65);box-shadow:inset 0 0 0 1px rgba(0,51,51,.1);cursor:pointer;transition:background .3s,box-shadow .35s var(--ease),transform .35s var(--ease)}
.ptile input{position:absolute;opacity:0;inset:0;cursor:pointer}
.ptile:hover{background:#fff;transform:translateY(-2px)}
.pt-i{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:rgba(0,51,51,.07);transition:background .35s,transform .45s var(--ease)}
.pt-i svg{width:21px;height:21px;fill:none;stroke:var(--ink);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.pt-t{display:grid;gap:.1rem;min-width:0}.pt-t b{font:500 .9rem/1.25 var(--fb);color:var(--ink)}.pt-t small{font-size:.74rem;line-height:1.35;color:var(--slate)}
.ptile .ft-c{top:.55rem;right:.55rem;width:18px;height:18px}
.ptile input:checked~.ft-c{background:var(--ink);box-shadow:none;transform:scale(1.08)}.ptile input:checked~.ft-c svg{stroke-dashoffset:0}
.ptile:has(input:checked){background:#fff;box-shadow:inset 0 0 0 2px var(--ink),0 14px 28px -20px rgba(0,51,51,.55)}
.ptile:has(input:checked) .pt-i{background:var(--sage2);transform:rotate(-6deg) scale(1.05)}
.ptile:has(input:focus-visible){outline:2px solid var(--leaf);outline-offset:2px}
.qpick-hint{margin:.2rem 0 1rem;font-size:.9rem;color:var(--slate)}
.pg-tools{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin:1rem 0 .8rem}.pg-search{flex:1 1 240px;min-width:0}
.pg-count{font:500 .8rem var(--fm);letter-spacing:.04em;color:var(--ink);background:rgba(255,255,255,.7);padding:.35rem .8rem;border-radius:99px}
.pg-groups{display:grid;gap:.6rem}
.pg-group{border-radius:16px;background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 1px rgba(0,51,51,.1);overflow:hidden}
.pg-group[hidden]{display:none}
.pg-group summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1rem;cursor:pointer;font:500 .92rem var(--fb);color:var(--ink);list-style:none}
.pg-group summary::-webkit-details-marker{display:none}
.pg-group summary::after{content:"";width:9px;height:9px;border-right:1.6px solid var(--ink);border-bottom:1.6px solid var(--ink);transform:rotate(45deg);transition:transform .25s var(--ease);margin-left:auto;margin-right:.2rem;margin-top:-4px}
.pg-group[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.pg-n{font-style:normal;font:500 .72rem var(--fm);color:var(--leaf);letter-spacing:.04em}.pg-n:empty{display:none}
.pg-chips{display:flex;flex-wrap:wrap;gap:.45rem;padding:0 1rem 1rem}
.pchip{position:relative;display:inline-flex}.pchip[hidden]{display:none}
.pchip input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.pchip span{display:inline-block;padding:.4rem .85rem;border-radius:99px;background:#fff;box-shadow:inset 0 0 0 1px rgba(0,51,51,.16);font:450 .84rem var(--fb);color:var(--ink);transition:background .25s,color .25s,box-shadow .25s,transform .25s var(--ease)}
.pchip:hover span{transform:translateY(-1px);box-shadow:inset 0 0 0 1px rgba(0,51,51,.4)}
.pchip input:checked+span{background:var(--ink);color:#fff;box-shadow:none}
.pchip input:focus-visible+span{outline:2px solid var(--leaf);outline-offset:2px}
.pg-none{margin:.8rem 0 0;font-size:.9rem;color:var(--slate)}
.pg-custom{margin:1.2rem 0 1.6rem}.pg-add{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}.pg-add .fi{flex:1 1 260px;min-width:0}
.pg-custom-list{list-style:none;margin:.7rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.pg-custom-list li{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .4rem .3rem .85rem;border-radius:99px;background:var(--ink);color:#fff;font:450 .84rem var(--fb)}
.pg-custom-list button{border:0;background:rgba(255,255,255,.2);color:#fff;width:22px;height:22px;border-radius:50%;cursor:pointer;font-size:1rem;line-height:1;display:grid;place-items:center}
.pg-custom-list button:hover{background:rgba(255,255,255,.4)}
.h-features{margin-top:2rem}
.res-h{display:flex;align-items:center;justify-content:space-between;gap:.8rem}
@media(max-width:900px){.ptiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.ptiles{grid-template-columns:1fr}}

.pt-t{padding-right:1.1rem}