/* Project Station · light graphic system */
:root{
  --bg:#FBFAF5;--bg2:#F2F0E8;--white:#fff;--ink:#0F1626;--ink2:#2C3448;--muted:#6C7488;--line:rgba(15,22,38,.1);--line2:rgba(15,22,38,.16);
  --blue:#2D5BFF;--coral:#FF5A36;--lime:#C6F135;--violet:#7A4BFF;--sun:#FFC13B;--mint:#2ED3A0;--pink:#FF6FB5;
  --t-blue:#E4EBFF;--t-coral:#FFE6DF;--t-lime:#EEF9C9;--t-violet:#ECE5FF;--t-sun:#FFF1CC;--t-mint:#D9F7EC;--t-pink:#FFE1F0;
  --f:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;
  --r:28px;--r-sm:18px;--r-lg:40px;
  --sh:0 1px 2px rgba(15,22,38,.04),0 12px 40px -14px rgba(15,22,38,.18);
  --sh-hover:0 2px 4px rgba(15,22,38,.05),0 30px 60px -20px rgba(15,22,38,.28);
  --ease:cubic-bezier(.2,.8,.2,1);--wrap:1320px;
}
*{box-sizing:border-box}
/* Native smooth scrolling is the right default and is what mobile and
   reduced-motion users get. But when Lenis is running it is a second easing
   engine layered on the first: the browser eases toward a target that Lenis is
   already easing toward, and the two compound into exactly the lag this was
   meant to avoid. Lenis stamps .lenis on the root, so hand scrolling entirely
   to it there. */
html{scroll-behavior:smooth}
html.lenis,html.lenis body{scroll-behavior:auto}
/* overflow-x:clip, not hidden. `hidden` on one axis forces the other to `auto`,
   which turns body into a scroll container — that broke IntersectionObserver's
   default root, so [data-reveal] elements below the fold never received .is-in
   and stayed at opacity:0 permanently. `clip` suppresses the same horizontal
   overflow without creating a scroller. */
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9998;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
a{color:inherit;text-decoration:none}img,svg{display:block;max-width:100%}
h1{margin:0;font-family:var(--f);font-variation-settings:"wdth" 88;letter-spacing:-.035em;line-height:.98;font-weight:700}
h2{margin:0;font-family:var(--f);font-variation-settings:"wdth" 88;letter-spacing:-.035em;line-height:.98;font-weight:700}
h3{margin:0;font-family:var(--f);font-variation-settings:"wdth" 88;letter-spacing:-.035em;line-height:.98;font-weight:700}
h4{margin:0;font-family:var(--f);font-variation-settings:"wdth" 88;letter-spacing:-.035em;line-height:.98;font-weight:700}
h1{font-size:clamp(2.6rem,6vw,5.6rem)}h2{font-size:clamp(2rem,4vw,3.4rem)}h3{font-size:clamp(1.4rem,2.2vw,1.9rem);letter-spacing:-.02em}h4{font-size:1.1rem;letter-spacing:-.01em}
p{margin:0}
.lede{font-size:clamp(1.1rem,1.6vw,1.35rem);color:var(--ink2);max-width:36ch;line-height:1.4}
.muted{color:var(--muted)}.small{font-size:.9rem}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(18px,4vw,48px)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;top:-999px;inset-inline-start:8px;background:var(--ink);color:#fff;padding:.6rem 1rem;border-radius:999px;z-index:10000}.skip:focus{top:8px}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:8px}
.grad{background:linear-gradient(95deg,var(--blue) 0%,var(--violet) 40%,var(--coral) 75%,var(--sun) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-style:normal;background-size:200% 100%;animation:gradShift 8s ease-in-out infinite alternate}
@keyframes gradShift{to{background-position:100% 0}}
.hi{background:linear-gradient(transparent 58%,var(--lime) 58%);padding:0 .1em}

/* icons */
.ic{width:1.3em;height:1.3em;flex:none}
.ico{display:inline-grid;place-items:center;border-radius:50%;flex:none;transition:transform .5s var(--ease)}
.ico--sm{width:40px;height:40px}.ico--sm .ic{width:20px;height:20px}
.ico--md{width:60px;height:60px}.ico--md .ic{width:28px;height:28px}
.ico--lg{width:84px;height:84px}.ico--lg .ic{width:40px;height:40px}
.ico--xl{width:120px;height:120px}.ico--xl .ic{width:56px;height:56px}
.hue-blue{--h:var(--blue);--t:var(--t-blue)}.hue-coral{--h:var(--coral);--t:var(--t-coral)}.hue-lime{--h:#7FA800;--t:var(--t-lime)}.hue-violet{--h:var(--violet);--t:var(--t-violet)}.hue-sun{--h:#D99700;--t:var(--t-sun)}.hue-mint{--h:#0FA57A;--t:var(--t-mint)}.hue-pink{--h:#E03E8E;--t:var(--t-pink)}
.ico.tint{background:var(--t);color:var(--h)}.ico.solid{background:var(--h);color:#fff}
.hue-lime .ico.solid{background:var(--lime);color:var(--ink)}.hue-sun .ico.solid{background:var(--sun);color:var(--ink)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.7rem;padding:.55rem .55rem .55rem 1.4rem;border-radius:999px;font-weight:600;font-size:1rem;border:2px solid transparent;background:var(--ink);color:#fff;cursor:pointer;font-family:var(--f);transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .3s;white-space:nowrap;line-height:1}
.btn .ico{width:38px;height:38px;background:rgba(255,255,255,.14)}.btn .ico .ic{width:18px;height:18px}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(15,22,38,.5)}
.btn--blue{background:var(--blue)}
.btn--lime{background:var(--lime);color:var(--ink)}.btn--lime .ico{background:rgba(15,22,38,.1)}
.btn--white{background:#fff;color:var(--ink);border-color:var(--line2)}.btn--white .ico{background:var(--bg2)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line2)}.btn--ghost .ico{background:var(--bg2)}
.btn--lg{font-size:1.1rem;padding:.7rem .7rem .7rem 1.7rem}.btn--lg .ico{width:46px;height:46px}
.btn--sm{font-size:.9rem;padding:.35rem .35rem .35rem 1rem}.btn--sm .ico{width:30px;height:30px}.btn--sm .ico .ic{width:15px;height:15px}
.btn--plain{padding:.7rem 1.4rem}
.link{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;color:var(--blue)}.link .ic{width:1.1em;height:1.1em;transition:transform .3s}.link:hover .ic{transform:translateX(4px)}

/* header */
.hdr{position:sticky;top:0;z-index:900;padding:14px 0 0;transition:padding .3s}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:rgba(251,250,245,.72);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border:1px solid var(--line);border-radius:999px;padding:8px 8px 8px 18px;box-shadow:var(--sh)}
.brand{display:flex;align-items:center;gap:.55rem;font-weight:700;font-size:1.15rem;letter-spacing:-.02em}
.brand__mark{width:34px;height:34px;border-radius:12px;background:var(--ink);display:grid;place-items:center;transition:transform .6s var(--ease)}
.brand:hover .brand__mark{transform:rotate(-12deg) scale(1.08)}
.brand__mark svg{width:20px;height:20px}
.nav__list{display:flex;gap:.2rem;list-style:none;margin:0;padding:0}
.nav__item>a{display:inline-block;padding:.6rem .95rem;border-radius:999px;font-weight:600;font-size:.98rem;transition:background .25s}
.nav__item>a:hover,.nav__item>a.is-on{background:var(--bg2)}
.nav__item.has-mega{position:relative}
.mega{position:absolute;top:calc(100% + 14px);left:50%;transform:translate(-50%,10px);width:min(920px,calc(100vw - 40px));background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-hover);padding:1.2rem;opacity:0;pointer-events:none;transition:opacity .25s,transform .35s var(--ease)}
.has-mega:hover .mega,.has-mega:focus-within .mega,.has-mega.is-open .mega{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
.mega__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}
/* Navigation group labels, not document headings: three <h4> elements ahead of
   the page <h1> broke the heading outline on every page that has a mega menu. */
.mega__col h4{margin:0;padding:.6rem .8rem .3rem;font-size:.8rem;color:var(--muted);font-weight:600;font-family:var(--f)}
.mega__col-h{margin:0;padding:.6rem .8rem .3rem;font-size:.8rem;color:var(--muted);font-weight:600;font-family:var(--f)}
.mega__link{display:flex;align-items:center;gap:.7rem;padding:.55rem .8rem;border-radius:14px;font-weight:600;font-size:.95rem;transition:background .2s}
.mega__link:hover{background:var(--t)}
.mega__foot{margin-top:.8rem;padding:.9rem 1rem;border-radius:18px;background:var(--bg2);display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:.9rem}
.hdr__cta{display:flex;align-items:center;gap:.5rem}
.burger{display:none;width:44px;height:44px;border-radius:50%;border:0;background:var(--ink);color:#fff;place-items:center;cursor:pointer}.burger .ic{width:22px;height:22px}
.mnav{position:fixed;inset:0;z-index:890;background:var(--bg);padding:132px 24px 40px;overflow:auto;transform:translateY(-100%);transition:transform .5s var(--ease);opacity:0}
.mnav.is-open{transform:none;opacity:1}
.mnav__link{display:flex;align-items:center;gap:1rem;font-size:2rem;font-weight:700;letter-spacing:-.03em;padding:.5rem 0}
.mnav__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-top:1.5rem}
.mnav__grid a{display:flex;align-items:center;gap:.5rem;padding:.7rem .75rem;border-radius:16px;background:#fff;border:1px solid var(--line);font-weight:600;font-size:.88rem;line-height:1.3;min-width:0;overflow-wrap:break-word;hyphens:auto}
@media (max-width:1100px){.nav{display:none}.burger{display:grid}.hdr__cta .btn{display:none}}

/* sections */
.sec{padding:clamp(4rem,9vw,8.5rem) 0}.sec--tight{padding:clamp(2.5rem,5vw,4.5rem) 0}
.sec__head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:clamp(2rem,4vw,3.5rem);flex-wrap:wrap}
.sec__head .lede{max-width:44ch}
.kicker{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .9rem .4rem .5rem;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:600;font-size:.85rem;margin-bottom:1.2rem}
.kicker .ico{width:24px;height:24px}.kicker .ico .ic{width:14px;height:14px}
.sec--blue{background:var(--blue);color:#fff}.sec--tint{background:var(--bg2)}
.sec--blue .lede{color:rgba(255,255,255,.8)}
.sec--blue .kicker{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff}
.grid{display:grid;gap:1.2rem}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media (max-width:980px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.6rem;box-shadow:var(--sh);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.card:hover{box-shadow:var(--sh-hover)}
.card--tint{background:var(--t);border-color:transparent}
.card--ink{background:var(--ink);color:#fff;border-color:transparent}
.tilt{transform-style:preserve-3d;will-change:transform}

/* hero */
.hero{position:relative;min-height:calc(100vh - 90px);display:grid;align-items:center;padding:clamp(3rem,6vw,5rem) 0 clamp(4rem,8vw,7rem);overflow:hidden}
.hero__in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:2rem;align-items:center}
.hero h1{max-width:13ch;font-size:clamp(2.8rem,5.6vw,5.4rem)}
.hero .lede{margin:1.6rem 0 2rem;max-width:34ch}
.hero__acts{display:flex;gap:.7rem;flex-wrap:wrap}
.hero__badges{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:2.2rem}
.badge{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .9rem .45rem .5rem;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:.88rem;font-weight:600;box-shadow:var(--sh)}
.badge .ico{width:26px;height:26px}.badge .ico .ic{width:14px;height:14px}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;pointer-events:none;will-change:transform}
.blob--1{width:52vw;height:52vw;max-width:720px;max-height:720px;background:radial-gradient(circle at 30% 30%,var(--t-blue),var(--blue) 60%,transparent 72%);top:-12%;right:-8%;opacity:.38}
.blob--2{width:36vw;height:36vw;max-width:520px;max-height:520px;background:radial-gradient(circle,var(--coral),transparent 70%);bottom:-10%;left:-6%;opacity:.35}
.blob--3{width:26vw;height:26vw;max-width:380px;max-height:380px;background:radial-gradient(circle,var(--lime),transparent 70%);top:40%;left:35%;opacity:.5}
/* orbit */
.orbit{position:relative;aspect-ratio:1;width:min(100%,560px);margin-left:auto;z-index:2}
.orbit__ring{position:absolute;inset:0;border-radius:50%;border:1.5px dashed var(--line2);animation:spin 60s linear infinite}
.orbit__ring--2{inset:16%;animation-duration:42s;animation-direction:reverse;border-style:solid;border-color:var(--line)}
.orbit__ring--3{inset:33%;animation-duration:28s;border-style:dotted}
.orbit__node{position:absolute;transform:translate(-50%,-50%)}
.orbit__node .ico{box-shadow:var(--sh);animation:counter 60s linear infinite}
.orbit__ring--2 .orbit__node .ico{animation-duration:42s;animation-direction:reverse}
.orbit__center{position:absolute;inset:38%;border-radius:50%;background:#fff;box-shadow:var(--sh-hover);display:grid;place-items:center;text-align:center;padding:1rem}
.orbit__center b{display:block;font-size:clamp(2rem,4vw,3.2rem);letter-spacing:-.04em;line-height:1;font-variation-settings:"wdth" 85}
.orbit__center span{font-size:.8rem;color:var(--muted);font-weight:600;display:block;margin-top:.2rem}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes counter{to{transform:rotate(-360deg)}}
.chip{position:absolute;display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .9rem .45rem .5rem;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-hover);font-weight:700;font-size:.9rem;z-index:3;will-change:transform}
.chip .ico{width:30px;height:30px}.chip .ico .ic{width:16px;height:16px}

@media (max-width:900px){.hero{min-height:0}.hero__in{grid-template-columns:1fr}.hero h1{max-width:none}.orbit{width:min(78vw,340px);margin:2rem auto 0}.orbit__center b{font-size:1.6rem}.orbit__center span{font-size:.65rem}.chip{display:none}.blob--1{opacity:.25}}
/* marquee */
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff;padding:1rem 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee__track{display:flex;gap:2.5rem;width:max-content;animation:marq 40s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__item{display:inline-flex;align-items:center;gap:.6rem;font-weight:700;font-size:1.05rem;white-space:nowrap}
.marquee__item .ico{width:34px;height:34px}.marquee__item .ico .ic{width:18px;height:18px}
@keyframes marq{to{transform:translateX(-50%)}}

/* jobs tiles */
.jobs{display:flex;gap:1rem;min-height:520px}
.job{flex:1;position:relative;border-radius:var(--r-lg);padding:2rem;background:var(--t);color:var(--ink);overflow:hidden;cursor:pointer;transition:flex .7s var(--ease);display:flex;flex-direction:column;justify-content:space-between;isolation:isolate}
.job.is-open{flex:2.3}
.job__big{position:absolute;right:-12%;bottom:-18%;width:58%;aspect-ratio:1;border-radius:50%;background:var(--h);opacity:.85;z-index:-1;transition:transform .8s var(--ease)}
.job:hover .job__big,.job.is-open .job__big{transform:scale(1.12) rotate(8deg)}
.job__title{font-size:clamp(2.4rem,5vw,4.8rem);line-height:.9;font-variation-settings:"wdth" 80;letter-spacing:-.045em}
.job__line{max-width:28ch;margin-top:.8rem;font-size:1.05rem;color:var(--ink2)}
.job__chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.2rem;max-height:0;opacity:0;overflow:hidden;transition:max-height .7s var(--ease),opacity .5s .1s}
.job.is-open .job__chips{max-height:300px;opacity:1}
.job__chips a{display:inline-flex;align-items:center;gap:.45rem;background:#fff;border-radius:999px;padding:.4rem .8rem .4rem .45rem;font-weight:600;font-size:.88rem;box-shadow:var(--sh)}
.job__chips .ico{width:24px;height:24px}.job__chips .ico .ic{width:13px;height:13px}
.job .ico--lg{animation:float 6s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-8px) rotate(-4deg)}}
@media (max-width:860px){.jobs{flex-direction:column;min-height:0}.job{min-height:260px}.job.is-open{flex:1}.job__chips{max-height:none;opacity:1}}

/* service wall */
.svc{position:relative;display:flex;flex-direction:column;gap:1rem;padding:1.5rem;border-radius:var(--r);background:#fff;border:1px solid var(--line);min-height:230px;transition:transform .5s var(--ease),box-shadow .5s var(--ease),background .4s;overflow:hidden}
.svc::after{content:"";position:absolute;inset:auto -30% -40% auto;width:70%;aspect-ratio:1;border-radius:50%;background:var(--t);transition:transform .6s var(--ease);z-index:0}
.svc>*{position:relative;z-index:1}
.svc:hover{transform:translateY(-6px);box-shadow:var(--sh-hover)}
.svc:hover::after{transform:scale(1.5)}
.svc:hover .ico{transform:rotate(-10deg) scale(1.1)}
.svc h3{font-size:1.25rem;letter-spacing:-.02em}
.svc p{color:var(--muted);font-size:.95rem}

/* proof */
.proof{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:2rem;align-items:center}
.proof__stats{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.stat{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.2);
  border-radius:var(--r-sm);
  padding:1rem 1.2rem;
  backdrop-filter:blur(8px)}
.stat b{
  display:block;
  font-size:clamp(1.7rem,2.6vw,2.2rem);
  letter-spacing:-.03em;
  line-height:1.05;
  font-variation-settings:"wdth" 88}
.stat span{display:block;font-size:.9rem;opacity:.85;margin-top:.4rem}
.stat--hi{background:var(--lime);color:var(--ink);border-color:transparent}
.chart{background:#fff;color:var(--ink);border-radius:var(--r-lg);padding:1.6rem;box-shadow:var(--sh-hover)}
.chart__head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.6rem;font-weight:600;font-size:.9rem}
.chart svg{width:100%;height:auto}
.chart .line{fill:none;stroke:var(--blue);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.chart .area{fill:url(#ag);opacity:.9}
.chart .dot{fill:var(--coral);stroke:#fff;stroke-width:3}
.chart__foot{display:flex;justify-content:space-between;font-size:.8rem;color:var(--muted);margin-top:.4rem}
@media (max-width:900px){.proof{grid-template-columns:1fr}}

/* horizontal cases */
/* Without the pinned desktop scroll (phones, reduced motion, no script) the row swipes natively and snaps to each card. */
.hscroll{position:relative;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:clamp(18px,4vw,48px);scrollbar-width:none;overscroll-behavior-x:contain}
.hscroll::-webkit-scrollbar{display:none}
.hscroll .case{scroll-snap-align:start}
.hscroll.is-pinned{overflow:hidden;scroll-snap-type:none}
.hscroll__track{display:flex;gap:1.5rem;padding:0 clamp(18px,4vw,48px);will-change:transform}
.case{flex:0 0 min(78vw,820px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);min-height:440px}
.case__vis{position:relative;padding:2rem;display:flex;flex-direction:column;justify-content:space-between;color:#fff;background:linear-gradient(150deg,var(--h),var(--ink2) 140%);overflow:hidden}
.case__vis::before{content:"";position:absolute;width:110%;aspect-ratio:1;border-radius:50%;right:-55%;top:-10%;background:rgba(255,255,255,.14)}
.case--lime .case__vis{color:var(--ink);background:linear-gradient(150deg,var(--lime),#7FA800 140%)}
.case--sun .case__vis{color:var(--ink);background:linear-gradient(150deg,var(--lime),#7FA800 140%);background:linear-gradient(150deg,var(--sun),#D99700 140%)}
.case__num{font-size:clamp(3.5rem,7vw,6.5rem);letter-spacing:-.05em;line-height:.9;font-variation-settings:"wdth" 80;position:relative}
.case__num span{display:block;font-size:.95rem;letter-spacing:0;font-variation-settings:"wdth" 100;opacity:.85;margin-top:.5rem;font-weight:600}
.case__client{font-weight:700;display:flex;align-items:center;gap:.6rem;position:relative}
.case__body{padding:2rem;display:flex;flex-direction:column;gap:1rem}
.case__body h3{font-size:1.6rem}
.tag{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .7rem;border-radius:999px;background:var(--bg2);font-size:.8rem;font-weight:600}
.case--sm{flex:none;grid-template-columns:1fr;min-height:0}.case--sm .case__vis{min-height:220px}
@media (max-width:760px){.case{grid-template-columns:1fr;flex-basis:86vw}.case__vis{min-height:220px}}

/* process timeline */
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.steps::before{content:"";position:absolute;left:0;right:0;top:42px;height:2px;background:var(--line)}
.steps__bar{position:absolute;left:0;top:42px;height:2px;background:var(--blue);transform-origin:left;transform:scaleX(0);width:100%}
.step{position:relative;padding-top:0}
.step .ico{position:relative;background:#fff;border:2px solid var(--line2);color:var(--ink)}
.step.is-on .ico{border-color:var(--blue);background:var(--blue);color:#fff;transform:scale(1.08)}
.step__n{position:absolute;top:-8px;right:-8px;background:var(--lime);width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:.75rem;font-weight:700}
.step h3{margin:1rem 0 .4rem;font-size:1.3rem}
.step p{color:var(--muted);font-size:.95rem}
.step__time{display:inline-block;margin-top:.6rem;font-size:.8rem;font-weight:700;color:var(--blue)}
@media (max-width:820px){.steps{grid-template-columns:1fr 1fr}.steps::before,.steps__bar{display:none}}

/* pricing */
.budget{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.8rem 2rem;box-shadow:var(--sh);margin-bottom:2rem}
input[type=range].slider{-webkit-appearance:none;appearance:none;width:100%;height:14px;border-radius:999px;background:linear-gradient(90deg,var(--t-lime),var(--t-blue),var(--t-violet));outline:0}
.slider::-webkit-slider-thumb{-webkit-appearance:none;width:34px;height:34px;border-radius:50%;background:var(--ink);border:4px solid #fff;box-shadow:var(--sh-hover);cursor:grab}
.slider::-moz-range-thumb{width:34px;height:34px;border-radius:50%;background:var(--ink);border:4px solid #fff;box-shadow:var(--sh-hover);cursor:grab}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;align-items:start}
.tier{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh);transition:transform .5s var(--ease),box-shadow .5s var(--ease),outline-color .3s;outline:3px solid transparent;outline-offset:2px}
.tier .btn{width:100%;justify-content:space-between}
@media (max-width:980px){.tiers{grid-template-columns:1fr}}
.pkg-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.pkg-pick label{cursor:pointer}.pkg-pick input{position:absolute;opacity:0}
.pkg-pick .pk{border:2px solid var(--line);border-radius:var(--r-sm);padding:1rem;transition:.25s;display:flex;flex-direction:column;gap:.3rem;height:100%}
.pkg-pick input:checked+.pk{border-color:var(--ink);background:var(--t);transform:translateY(-3px);box-shadow:var(--sh)}
.pkg-pick .pk b{font-size:1.1rem}.pkg-pick .pk span{font-size:.85rem;color:var(--muted)}
@media (max-width:640px){.pkg-pick{grid-template-columns:1fr}}

/* gcc bubbles */
.gcc{position:relative;aspect-ratio:16/9;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh);overflow:hidden;background-image:radial-gradient(var(--line2) 1px,transparent 1px);background-size:28px 28px}
.gcc svg.lines{position:absolute;inset:0;width:100%;height:100%}
.gcc .lines path{fill:none;stroke:var(--line2);stroke-width:1.5;stroke-dasharray:4 6;vector-effect:non-scaling-stroke}
@keyframes pulse{50%{box-shadow:inset 0 0 0 3px var(--h),0 0 0 18px rgba(45,91,255,.12)}}
@media (max-width:640px){.gcc{aspect-ratio:1}}

/* team */
.founder{position:relative;border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);display:grid;grid-template-columns:200px minmax(0,1fr);min-height:300px}
.avatar{position:relative;background:linear-gradient(160deg,var(--h),var(--ink2) 150%);color:#fff;display:grid;place-items:center;font-size:3.5rem;font-weight:700;letter-spacing:-.05em;overflow:hidden}
.avatar::after{content:"";position:absolute;width:140%;aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.15);left:-20%;bottom:-70%}
.founder__body{padding:1.8rem;display:flex;flex-direction:column;gap:.5rem}
.founder__role{color:var(--h);font-weight:700;font-size:.9rem}
.founder:hover .avatar{background:linear-gradient(160deg,var(--ink2),var(--h) 150%)}
@media (max-width:640px){.founder{grid-template-columns:1fr}.avatar{min-height:160px}}
.principle{display:flex;gap:1rem;align-items:flex-start;padding:1.4rem;border-radius:var(--r);background:#fff;border:1px solid var(--line)}
.principle p{color:var(--muted);font-size:.95rem;margin-top:.3rem}

/* posts */
.post-card{display:flex;flex-direction:column;border-radius:var(--r);background:#fff;border:1px solid var(--line);overflow:hidden;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.post-card:hover{transform:translateY(-6px);box-shadow:var(--sh-hover)}
.post-card__cover{aspect-ratio:16/9;background:var(--t);display:grid;place-items:center;position:relative;overflow:hidden}
.post-card__cover::after{content:"";position:absolute;width:60%;aspect-ratio:1;border-radius:50%;background:var(--h);opacity:.2;right:-20%;bottom:-40%}
.post-card__body{padding:1.3rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.post-card h3{font-size:1.2rem;letter-spacing:-.015em;line-height:1.2}
.post-card__meta{display:flex;gap:.6rem;align-items:center;font-size:.8rem;color:var(--muted);font-weight:600;margin-top:auto}
.cat{display:inline-flex;padding:.3rem .7rem;border-radius:999px;background:var(--t);color:var(--h);font-size:.78rem;font-weight:700}

/* cta band */
/* ---- Shared spacing and small variants (replace the old inline styles) ---- */
.sec-h{margin:.6rem 0 1.2rem}
.card-h{margin:.6rem 0 .4rem}
.h3ish.card-h,.card .card-h{font-size:clamp(1.25rem,1.7vw,1.45rem);line-height:1.2}
.card-h--sm{font-size:1.2rem;margin-top:0}
.form-h{margin:0 0 1rem}
.card-h2{font-size:2rem;margin:.6rem 0 1.2rem}
.col-h2{font-size:2rem;margin:0 0 1rem}
.grid--top{align-items:start}
.grid--tight{gap:.6rem}
.grid--list{gap:1rem}
.chips--tight{gap:.4rem}
.chips--meta{margin-top:1.4rem;gap:.5rem}
.kicker--dark{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff}
.on-dark{color:rgba(255,255,255,.85);max-width:52ch}
.ico--glass{background:rgba(255,255,255,.25)}
.ico--lead{margin-bottom:1rem}
.ico--hero{margin:0 auto 1.5rem;animation:float 4s ease-in-out infinite}
.push-sm{margin-top:.8rem}
.push{margin-top:1.2rem}
.push-lg{margin-top:2rem}
.row-between{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.2rem}
.sub{margin:.3rem 0 .8rem}
.card--empty{text-align:center;padding:3rem}
.card--form{padding:clamp(1.4rem,3vw,2rem)}
.h1--long{font-size:clamp(2.2rem,5vw,4.2rem)}
.lede--wide{max-width:62ch}
.lede--under{margin:-.6rem 0 1.6rem}
.lede--after{margin:1.2rem 0 1.6rem}
.lede--center{margin:1rem auto 2rem}
.acts--center{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap}
.btn--split{justify-content:space-between}
.cat--lead{margin-bottom:1rem}
.post-meta--hero{margin-top:1.2rem;font-size:.95rem}
.note-line{border-inline-start:3px solid var(--line);padding-inline-start:.8rem}
.strong{font-weight:600}
.strong-ink{color:var(--ink)}
.post-card__cover--wide{aspect-ratio:21/9}
.tag--xs{padding:.05rem .4rem}
.testi__q{margin:0;font-size:1.15rem;font-weight:600;line-height:1.35}
.testi__by{margin-top:auto}
.blob--soft{opacity:.28}
.blob--right{opacity:.35;left:60%}
.chips .c.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}
/* ---- About: facts line, mission band, promises, team groups ---- */
.afacts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.afacts li{display:inline-flex;align-items:center;gap:.55rem;padding:.45rem 1rem .45rem .45rem;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:600;font-size:.92rem;color:var(--ink2)}
.afacts .ico--sm{width:30px;height:30px}.afacts .ico--sm .ic{width:15px;height:15px}
.mvb{display:grid;gap:clamp(1.6rem,3vw,2.4rem)}
.mvb__head h2{margin:.6rem 0 0;max-width:18ch}
.mvb__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.mvb__item{padding:clamp(1.4rem,3vw,2rem);border-radius:var(--r);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16)}
.mvb__k{display:inline-block;margin-bottom:.7rem;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--lime)}
.mvb__item p{margin:0;color:#fff;font-size:clamp(1.15rem,1.7vw,1.4rem);line-height:1.45;font-weight:500;text-wrap:pretty}
.mvb__dream{display:flex;align-items:flex-start;gap:.7rem;margin:0;max-width:70ch;color:rgba(255,255,255,.85);font-size:1.02rem;line-height:1.55}
.mvb__dream .ic{width:22px;height:22px;flex:none;color:var(--lime);margin-top:.1rem}
.mvb__dream b{color:#fff}
.promises{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.promise{position:relative;display:flex;flex-direction:column;gap:.55rem;padding:1.5rem;border-radius:var(--r);background:#fff;border:1px solid var(--line);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.promise:hover{transform:translateY(-3px);box-shadow:var(--sh-hover)}
.promise__n{position:absolute;top:1.3rem;right:1.4rem;font-weight:800;font-size:.85rem;letter-spacing:.04em;color:var(--h);opacity:.6}
.promise .ico--md{width:48px;height:48px}.promise .ico--md .ic{width:24px;height:24px}
.promise h3{margin:.4rem 0 0;font-size:1.25rem}
.promise p{margin:0;color:var(--ink2);font-size:.95rem;line-height:1.5}
.team-group{margin:0 0 1rem;font-size:.82rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.people+.team-group{margin-top:clamp(2rem,4vw,2.8rem)}
@media (max-width:980px){.promises{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.mvb__grid,.promises{grid-template-columns:1fr}}
.team-more{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-top:1.4rem}
.team-more__k{width:100%;font-size:.82rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.2rem}
.team-more__p{display:inline-flex;align-items:center;gap:.7rem;padding:.5rem 1rem .5rem .5rem;border-radius:999px;background:#fff;border:1px solid var(--line);transition:border-color .2s,transform .2s}
.team-more__p:hover{border-color:var(--line2);transform:translateY(-2px)}
.team-more__i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(160deg,var(--h),var(--ink2) 150%);color:#fff;font-weight:700;font-size:.8rem;flex:none}
.team-more__p b{display:block;font-size:.92rem;line-height:1.2}
.team-more__p em{display:block;font-style:normal;font-size:.8rem;color:var(--muted)}
.form--steps{gap:1.2rem}
.card .card-h+.cat{align-self:flex-start;margin:.15rem 0 .3rem}
.article.article--job{grid-template-columns:minmax(0,1fr) minmax(320px,380px)}
@media (max-width:960px){.article.article--job{grid-template-columns:1fr}}
@media (max-width:640px){.wmap__label b{font-size:12px}}
/* German runs long compound words: let text hyphenate and wrap instead of pushing past the edge. */
:lang(de) :is(h1,h2,h3,p,li,b,small,span){hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}
.band>div,.ctap__copy{min-width:0}
@media (max-width:420px){.btn{white-space:normal;max-width:100%;line-height:1.2;text-align:left}.mbar__offer{white-space:normal;line-height:1.15}}
/* ---- Call to action: one dark panel and one light band, used on every page ---- */
.ctap{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(1.6rem,4vw,3.5rem);align-items:center;padding:clamp(2rem,5vw,4rem);border-radius:var(--r-lg);background:var(--ink);color:#fff}
.ctap::before,.ctap::after{content:"";position:absolute;z-index:-1;aspect-ratio:1;border-radius:50%;pointer-events:none}
.ctap::before{width:min(60%,640px);right:-18%;top:-55%;background:radial-gradient(circle,rgba(45,91,255,.85),transparent 68%)}
.ctap::after{width:min(42%,460px);left:-12%;bottom:-55%;background:radial-gradient(circle,rgba(255,90,54,.7),transparent 68%)}
:where(.sec,.sec--tight) .wrap>*+.ctap{margin-top:clamp(1.6rem,3vw,2.4rem)}
.ctap__k{display:inline-flex;align-items:center;gap:.45rem;padding:.38rem .8rem .38rem .45rem;border-radius:999px;background:rgba(198,241,53,.14);color:var(--lime);font-size:.78rem;font-weight:700;letter-spacing:.02em}
.ctap__k .ic{width:22px;height:22px;padding:4px;border-radius:50%;background:var(--lime);color:var(--ink)}
.ctap h2{margin:1rem 0 .9rem;color:#fff;font-size:clamp(2rem,3.8vw,3.2rem);line-height:1;max-width:16ch}
.ctap p{margin:0;max-width:46ch;color:rgba(255,255,255,.8);font-size:1.05rem;line-height:1.55}
.ctap__list{list-style:none;margin:1.2rem 0 0;padding:0;display:grid;gap:.5rem;color:rgba(255,255,255,.88)}
.ctap__list li{display:flex;gap:.55rem;align-items:flex-start}
.ctap__list svg{width:18px;height:18px;flex:none;margin-top:.15rem;color:var(--lime)}
.ctap__acts{display:grid;gap:.9rem;min-width:0}
.ctap .form{gap:.65rem}
.ctap .form input,.ctap .form select,.ctap .form textarea{min-height:52px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff}
.ctap .form textarea{min-height:110px}
.ctap .form select option{color:var(--ink)}
.ctap .form input::placeholder,.ctap .form textarea::placeholder{color:rgba(255,255,255,.58)}
.ctap .form input:focus,.ctap .form select:focus,.ctap .form textarea:focus{border-color:var(--lime);box-shadow:0 0 0 3px rgba(198,241,53,.25)}
.ctap .form .btn{justify-self:stretch;justify-content:space-between}
.ctap__alt{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;margin:0!important;font-size:.95rem}
.ctap__fine{margin:0!important;font-size:.85rem;color:rgba(255,255,255,.66)}
.ctap__fine a{color:var(--lime)}
.band{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.2rem 2.5rem;align-items:center;padding:clamp(1.6rem,3vw,2.4rem);border-radius:var(--r-lg);background:var(--t,var(--t-blue))}
.band h2{margin:.5rem 0 .45rem;font-size:clamp(1.6rem,3vw,2.3rem)}
.band p{margin:0;color:var(--ink2);max-width:60ch}
.band__acts{display:flex;flex-wrap:wrap;gap:.6rem}
@media (max-width:900px){.ctap,.band{grid-template-columns:1fr}.ctap h2{max-width:none}}
@keyframes wobble{50%{transform:rotate(4deg) translateY(-6px)}}
.form{display:grid;gap:.7rem}
.form input{width:100%;font:inherit;padding:.9rem 1.1rem;border-radius:16px;border:1.5px solid var(--line2);background:#fff;color:var(--ink);font-size:1rem}
.form select{width:100%;font:inherit;padding:.9rem 1.1rem;border-radius:16px;border:1.5px solid var(--line2);background:#fff;color:var(--ink);font-size:1rem}
.form textarea{width:100%;font:inherit;padding:.9rem 1.1rem;border-radius:16px;border:1.5px solid var(--line2);background:#fff;color:var(--ink);font-size:1rem;resize:vertical}
.form input:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 4px var(--t-blue)}
.form select:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 4px var(--t-blue)}
.form textarea:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 4px var(--t-blue)}
.form label{display:grid;gap:.35rem;font-weight:600;font-size:.88rem}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.form .chk{display:flex;align-items:center;gap:.5rem;font-weight:500;font-size:.9rem}.form .chk input{width:auto}
.form__ok{display:none;padding:1rem;border-radius:16px;background:var(--t-mint);color:#0FA57A;font-weight:600}
.hp{position:absolute!important;clip:rect(0 0 0 0);clip-path:inset(50%);width:1px!important;height:1px!important;overflow:hidden;opacity:0;top:0}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chips label{cursor:pointer}.chips input{position:absolute;opacity:0;clip:rect(0 0 0 0);clip-path:inset(50%)}
.chips .c{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .9rem;border-radius:999px;border:1.5px solid var(--line2);background:#fff;font-weight:600;font-size:.9rem;transition:.2s}
.chips input:checked+.c{background:var(--ink);color:#fff;border-color:var(--ink)}
@media (max-width:860px){.form .row{grid-template-columns:1fr}}

/* footer */
.ftr{padding:4rem 0 2rem;background:#fff;border-top:1px solid var(--line);margin-top:clamp(3rem,6vw,5rem)}
.ftr__top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:2rem}
.ftr__brand p{color:var(--muted);margin-top:.8rem;max-width:32ch;font-size:.95rem}
.ftr__h{font-weight:700;font-size:.85rem;color:var(--muted);margin-bottom:.8rem}
.ftr__col ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.ftr__col a{font-size:.95rem;font-weight:500}.ftr__col a:hover{color:var(--blue)}
.ftr__news-h{margin-top:1.4rem;font-weight:700;font-size:.9rem}
.ftr__news{display:flex;gap:.4rem;margin-top:.55rem;max-width:380px}
.ftr__news label{flex:1;min-width:0;display:flex}
.ftr__news input{flex:1;min-width:0;width:100%;font:inherit;padding:.7rem 1rem;border-radius:999px;border:1.5px solid var(--line2)}
.ftr__bottom{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}
.ftr__social{display:flex;gap:.5rem}
.ftr__social a{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);font-weight:700;font-size:.8rem}
.ftr__social a:hover{background:var(--ink);color:#fff}
@media (max-width:900px){.ftr__top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ftr__top{grid-template-columns:1fr}}
.wa-float{position:fixed;right:20px;bottom:20px;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:grid;place-items:center;box-shadow:var(--sh-hover);z-index:800;transition:transform .3s var(--ease)}
.wa-float:hover{transform:scale(1.08)}.wa-float .ic{width:28px;height:28px}

/* inner page hero */
.phero{position:relative;padding:clamp(2.5rem,6vw,5rem) 0 clamp(2.5rem,5vw,4rem);overflow:hidden}
.phero__in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:2rem;align-items:center}
.phero h1{font-size:clamp(2.4rem,5.2vw,4.6rem);max-width:14ch}
.phero .lede{margin-top:1.4rem}
.phero__acts{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:2rem}
.phero__vis{position:relative;display:grid;place-items:center;min-height:300px}
.phero__vis .ico--xl{box-shadow:var(--sh-hover);position:relative;z-index:2}
.phero__vis .ring{position:absolute;border-radius:50%;border:1.5px dashed var(--line2)}
.phero__vis .ring--1{width:70%;aspect-ratio:1;animation:spin 40s linear infinite}
.phero__vis .ring--2{width:100%;aspect-ratio:1;animation:spin 70s linear infinite reverse;border-style:solid;border-color:var(--line)}
.phero__vis .sat{position:absolute;transform:translate(-50%,-50%);z-index:2}
.phero__vis .sat .ico{box-shadow:var(--sh)}
.phero__vis .blob{opacity:.5}
.crumbs{display:flex;gap:.4rem;font-size:.85rem;color:var(--muted);margin-bottom:1.2rem;flex-wrap:wrap;font-weight:600}
.crumbs a:hover{color:var(--ink)}
@media (max-width:860px){.phero__in{grid-template-columns:1fr}.phero__vis{min-height:220px;order:-1;max-width:320px;margin:0 auto}}

/* misc */
.feature{display:flex;gap:1rem;align-items:flex-start;padding:1.4rem;border-radius:var(--r);background:#fff;border:1px solid var(--line);transition:transform .4s var(--ease),box-shadow .4s}
.feature:hover{transform:translateY(-4px);box-shadow:var(--sh-hover)}
.feature b{display:block;font-size:1.05rem;margin-bottom:.25rem}
.feature p{color:var(--muted);font-size:.93rem}
.checklist{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.checklist li{display:flex;gap:.6rem;align-items:flex-start}
.checklist .ico{width:26px;height:26px;margin-top:.1rem}.checklist .ico .ic{width:14px;height:14px}
details.faq{background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:0 1.3rem;transition:box-shadow .3s}
details.faq+details.faq{margin-top:.6rem}
details.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.1rem 0;font-weight:700;font-size:1.05rem}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary .ico{transition:transform .35s var(--ease);background:var(--bg2)}
details.faq[open] summary .ico{transform:rotate(45deg);background:var(--ink);color:#fff}
details.faq[open]{box-shadow:var(--sh)}
details.faq p{padding:0 0 1.2rem;color:var(--ink2);max-width:70ch}
.fact{padding:1.4rem;border-radius:var(--r);background:var(--t);display:flex;flex-direction:column;gap:.4rem}
.fact b{font-size:clamp(1.8rem,3vw,2.6rem);letter-spacing:-.04em;line-height:1;color:var(--h)}
.fact span{font-size:.9rem;color:var(--ink2)}
.big-num{font-size:clamp(3rem,7vw,6rem);letter-spacing:-.05em;line-height:.9;font-variation-settings:"wdth" 80}
.prose{max-width:72ch;font-size:1.1rem;line-height:1.65}
.prose h2{font-size:1.9rem;margin:2.4rem 0 .8rem}.prose h3{margin:1.8rem 0 .5rem}
.prose p{margin:0 0 1.1rem}.prose ul,.prose ol{padding-left:1.4rem;margin:0 0 1.2rem}.prose li{margin-bottom:.4rem}
.prose a:not(.btn){color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.prose table{width:100%;border-collapse:collapse;font-size:.95rem;margin:1.2rem 0}.prose th{text-align:left;padding:.7rem .8rem;border-bottom:1px solid var(--line);background:var(--bg2)}.prose td{text-align:left;padding:.7rem .8rem;border-bottom:1px solid var(--line)}
.prose blockquote{margin:1.5rem 0;padding:1.2rem 1.5rem;border-radius:var(--r-sm);background:var(--t-blue);font-weight:600}
.article{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:3rem;align-items:start}
.toc{position:sticky;top:110px;padding:1.2rem;border-radius:var(--r);background:#fff;border:1px solid var(--line)}
.toc b{font-size:.8rem;color:var(--muted);display:block;margin-bottom:.6rem}
.toc a{display:block;padding:.35rem 0;font-size:.9rem;color:var(--muted);border-left:2px solid var(--line);padding-left:.8rem}
.toc a.is-on{color:var(--ink);border-color:var(--blue);font-weight:600}
@media (max-width:900px){.article{grid-template-columns:1fr}.toc{position:static}}
.progress{position:fixed;top:0;left:0;height:4px;background:var(--blue);width:100%;transform:scaleX(0);transform-origin:left;z-index:1000}
.compare{width:100%;border-collapse:separate;border-spacing:0;font-size:.92rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.compare th{padding:.9rem 1rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;background:var(--bg2);font-weight:700}
.compare td{padding:.9rem 1rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}.compare tr:last-child td{border-bottom:0}
.compare td:first-child{font-weight:700;white-space:nowrap}
.thanks{display:grid;place-items:center;text-align:center;padding-top:clamp(2rem,6vw,4rem)}
.notfound{display:grid;place-items:center;text-align:center;padding:clamp(2rem,6vw,4rem) 0}
.notfound h1{font-size:clamp(1.8rem,3.4vw,2.6rem);margin-top:.4rem}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
.cursor{position:fixed;top:0;left:0;width:26px;height:26px;border-radius:50%;background:var(--blue);pointer-events:none;z-index:9999;mix-blend-mode:multiply;opacity:.55;transform:translate(-50%,-50%);transition:width .3s,height .3s,opacity .3s}
@media (hover:none),(prefers-reduced-motion:reduce){.cursor{display:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}.steps__bar{transform:none}}

/* v3 additions */
.annc{background:var(--ink);color:#fff;font-size:.9rem;font-weight:600;padding:.55rem 0}.annc .wrap{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}.annc .ic{color:var(--lime)}.annc a{color:var(--lime);display:inline-flex;align-items:center;gap:.3rem;margin-left:auto}
.avatar img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.phero__vis .cover{width:100%;border-radius:var(--r-lg);box-shadow:var(--sh-hover);object-fit:cover;aspect-ratio:4/3}
.share{margin-top:1.4rem;display:grid;gap:.6rem}.share__k{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.share__row{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}.share a,.share button{display:flex;align-items:center;gap:.55rem;padding:.6rem .8rem;border-radius:12px;border:1px solid var(--line2);background:#fff;font:600 .86rem var(--f);color:var(--ink);cursor:pointer;transition:background .2s,color .2s,border-color .2s}.share a:hover,.share button:hover,.share a:focus-visible,.share button:focus-visible{background:var(--ink);border-color:var(--ink);color:#fff}.share .ic{width:18px;height:18px;flex:none}
.post-cta{margin-top:1rem;padding:1.3rem;border-radius:var(--r-sm);background:var(--ink);color:#fff;display:grid;gap:.5rem;justify-items:start}.post-cta__k{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}.post-cta b{font-size:1.15rem;letter-spacing:-.01em}.post-cta p{margin:0 0 .4rem;color:rgba(255,255,255,.75);font-size:.9rem}
.search{display:flex;gap:.3rem;background:#fff;border:1.5px solid var(--line2);border-radius:999px;padding:.3rem .3rem .3rem 1rem;align-items:center}.search input{border:0;font:inherit;outline:0;min-width:180px;background:transparent}
/* outline:0 above is unconditional and outranks the global :focus-visible
   ring, which left the search field with no visible keyboard focus at all. */
.search input:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.search button{width:36px;height:36px;border-radius:50%;border:0;background:var(--ink);color:#fff;display:grid;place-items:center;cursor:pointer}.search .ic{width:16px;height:16px}
.pager{display:flex;gap:.4rem;justify-content:center;margin-top:2rem}.pager a{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);font-weight:700}.pager a.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}
.cookie{position:fixed;left:20px;bottom:20px;z-index:850;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-hover);padding:1rem 1.2rem;display:flex;gap:1rem;align-items:center;flex-wrap:wrap;max-width:min(560px,calc(100vw - 40px));font-size:.9rem}.cookie .ic{width:18px;height:18px;vertical-align:-3px;color:var(--blue)}.cookie a{text-decoration:underline}.cookie>div{display:flex;gap:.4rem;margin-left:auto}
.totop{position:fixed;right:20px;bottom:90px;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:var(--sh);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;z-index:800;transform:translateY(10px)}.totop.is-on{opacity:1;pointer-events:auto;transform:none}.totop .ic{width:20px;height:20px}
.form input[type=file]{padding:.6rem;background:var(--bg2)}

/* ---------- Phase 4: language & currency switcher, logo image ---------- */
.brand__img{display:block;width:auto;max-width:200px;object-fit:contain}
.switch{display:flex;align-items:center;gap:.25rem}
.switch__dd{position:relative}
.switch__dd summary{list-style:none;display:inline-flex;align-items:center;gap:.35rem;padding:.5rem .7rem;border-radius:999px;border:1px solid var(--line);background:#fff;font-weight:700;font-size:.78rem;letter-spacing:.04em;cursor:pointer;line-height:1;transition:.2s}
.switch__dd summary::-webkit-details-marker{display:none}
.switch__dd summary .ic{width:15px;height:15px}
.switch__dd summary:hover,.switch__dd[open] summary{background:var(--ink);color:#fff;border-color:var(--ink)}
.switch__menu{position:absolute;top:calc(100% + 8px);inset-inline-end:0;min-width:190px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--sh-hover);padding:.5rem;z-index:60;display:grid;gap:2px}
.switch__menu b{display:block;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:.4rem .7rem .3rem}
.switch__menu a{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.55rem .75rem;border-radius:12px;font-weight:600;font-size:.9rem}
.switch__menu a small{color:var(--muted);font-weight:500;font-size:.75rem}
.switch__menu a:hover{background:var(--bg2)}
.switch__menu a.is-on{background:var(--ink);color:#fff}.switch__menu a.is-on small{color:rgba(255,255,255,.7)}
.mnav__switch{margin-top:1.5rem;display:grid;gap:1rem;padding-top:1.2rem;border-top:1px solid var(--line)}
.mnav__switch b{display:block;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:.5rem}
.mnav__switch .c.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}
@media (max-width:1060px){.switch{display:none}}

/* ---------- RTL (Arabic) ---------- */
[dir=rtl]{font-family:"IBM Plex Sans Arabic","Bricolage Grotesque",system-ui,sans-serif}
[dir=rtl] h1{letter-spacing:0;line-height:1.2}
[dir=rtl] h2{letter-spacing:0}
[dir=rtl] h3{letter-spacing:0}
[dir=rtl] .big-num{letter-spacing:0}
[dir=rtl] .orbit__center b{letter-spacing:0}
[dir=rtl] .stat b{letter-spacing:0}
[dir=rtl] .hdr__in{padding:8px 18px 8px 8px}
[dir=rtl] .annc a{margin-left:0;margin-right:auto}
[dir=rtl] .orbit{margin-left:0;margin-right:auto}
[dir=rtl] .chip{left:auto}
[dir=rtl] .hero .chip.hue-blue{right:52%;left:auto}[dir=rtl] .hero .chip.hue-lime{right:44%;left:auto}[dir=rtl] .hero .chip.hue-coral{left:6%;right:auto}
[dir=rtl] .prose ul,[dir=rtl] .prose ol{padding-left:0;padding-right:1.4rem}
[dir=rtl] .prose th,[dir=rtl] .prose td,[dir=rtl] .compare th,[dir=rtl] .compare td{text-align:right}
[dir=rtl] .toc a{border-left:0;border-right:2px solid var(--line);padding-left:0;padding-right:.8rem}
[dir=rtl] .steps__bar,[dir=rtl] .progress{transform-origin:right}
[dir=rtl] .step__n{right:auto;left:-8px}
[dir=rtl] .job__big{right:auto;left:-12%}
[dir=rtl] .cookie{left:auto;right:20px}
[dir=rtl] .wa-float{right:auto;left:20px}
[dir=rtl] .totop{right:auto;left:20px;left:20px;bottom:88px}
[dir=rtl] .marquee__track{animation-direction:reverse}
[dir=rtl] .hscroll__track{direction:rtl}

[dir=rtl] .ftr__social a,[dir=rtl] .share a{font-family:"Bricolage Grotesque",sans-serif}
[dir=rtl] .slider{direction:ltr}
[dir=rtl] .switch__menu{inset-inline-end:auto;inset-inline-start:0}
[dir=rtl] .btn .ico svg{transform:scaleX(-1)}
[dir=rtl] .kicker,[dir=rtl] .badge,[dir=rtl] .tag,[dir=rtl] .c{letter-spacing:0}
[dir=rtl] .search button{right:auto;left:6px}
[dir=rtl] .case__client,[dir=rtl] .founder__body,[dir=rtl] .post-card__body{text-align:right}
[dir=rtl] input,[dir=rtl] textarea,[dir=rtl] select{text-align:right}
[dir=rtl] input[type=email],[dir=rtl] input[name=website],[dir=rtl] input[name=phone],[dir=rtl] input[name=linkedin]{direction:ltr;text-align:left}
.hdr__in{position:relative}.nav__item.has-mega{position:static}
.chips input{width:1px!important;height:1px!important;overflow:hidden;margin:0}
.pkg-pick input{width:1px!important;height:1px!important;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;margin:0}

/* ---- Generated cover art -------------------------------------------------
   Posts and case studies without an uploaded image get a deterministic
   editorial graphic from src/cover.js instead of a bare tinted block with one
   icon, which read as an unfinished placeholder. The decorative ::after wash
   is suppressed behind artwork so the composition stays clean, and the
   category icon drops to a small corner badge so the cue survives. */
.post-card__cover--art::after{display:none}
.post-card__art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.post-card__badge{position:absolute;inset-inline-start:14px;inset-block-end:14px;z-index:1;display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:#fff;box-shadow:var(--sh)}
.post-card__badge svg{width:19px;height:19px;display:block}
/* Case-study panel artwork. The panel is stretched to its sibling's height, so
   space-between left a large dead gap between the client chip and the result
   number. The overlay variant draws in white at low opacity, keeping the
   gradient and the white text on top of it fully legible. */
.case__art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
/* Provenance label for proof that predates the agency. Deliberately plain and
   legible rather than a decorative badge — it is a disclosure, and reading it
   as marketing ornament would defeat the point. */
.case__context{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:600;color:var(--muted);background:var(--bg2);border:1px solid var(--line);border-radius:999px;padding:.3rem .7rem;margin-bottom:.7rem;align-self:flex-start;line-height:1}
.case__context svg{width:14px;height:14px;flex:none}
.case__context--hero{margin:0 0 1rem;background:rgba(255,255,255,.6)}

/* ---- proof chart -------------------------------------------------------
   Axis and callout were inline SVG attributes with a hardcoded x position, so
   the peak label sat at a fixed point regardless of how long the string was —
   and it runs in five languages. Both are classed now, the callout is
   end-anchored to the curve's end point, and a halo keeps it legible where it
   crosses the plotted line. */
.chart__axis text{font-family:var(--f);font-size:12px;fill:var(--muted);font-variation-settings:"wdth" 100}
.chart__leader{stroke:var(--ink);stroke-width:1.5;opacity:.35}
.chart__peak{
  font-family:var(--f);font-size:14px;font-weight:700;fill:var(--ink);
  paint-order:stroke;stroke:var(--bg);stroke-width:5px;stroke-linejoin:round;
}

/* A heading that is a section in the outline but sits at card scale visually.
   Used where promoting h3 -> h2 was semantically right but must not change the
   rendered size. */
.h3ish{font-size:clamp(1.4rem,2.2vw,1.9rem);letter-spacing:-.02em}

/* The hidden attribute must win.
   Any author rule that sets display on an element — .cookie sets display:flex —
   outranks the user-agent's [hidden]{display:none}, so el.hidden = true had no
   visible effect and the cookie banner stayed on screen after Allow was
   clicked. This restores the attribute's meaning for every element. */
[hidden]{display:none !important}

/* ---- GCC map ------------------------------------------------------------
   Replaces the dotted-grid bubble field. The frame holds a projected
   coastline; the markers are absolutely positioned on it at real coordinates,
   so they keep the existing .bub styling and hover behaviour. */
/* Square frame on purpose: the SVG viewBox is 0 0 100 100 with
   preserveAspectRatio meet, so any other frame ratio letterboxes the drawing
   and the markers — positioned as CSS percentages of the frame — stop lining
   up with the coastline. Square makes SVG units and frame percentages the
   same thing. */


/* Orbit hub: the brand mark at the centre of the service network. The disc
   matches the white chips around it; the station stop pulses like a live
   node, and stops pulsing for anyone who asked for less motion. */
/* Hub: the logo tile alone, no wording, over a wide halo that fills the
   centre of the orbit so it never reads as empty. */
.orbit__halo{position:absolute;inset:14%;border-radius:50%;z-index:1;pointer-events:none;background:radial-gradient(circle at 50% 50%,rgba(198,241,53,.38) 0,rgba(45,91,255,.16) 38%,rgba(122,75,255,.08) 58%,transparent 72%);filter:blur(2px)}
.orbit__hub{inset:29%;padding:0;z-index:3;background:rgba(255,255,255,.72);backdrop-filter:blur(6px);box-shadow:0 24px 60px -22px rgba(15,22,38,.35),0 0 0 14px rgba(255,255,255,.4),0 0 0 30px rgba(255,255,255,.18)}
.orbit__tile{display:grid;place-items:center;width:62%;aspect-ratio:1;border-radius:24%;background:var(--ink);box-shadow:0 16px 36px -14px rgba(15,22,38,.6),inset 0 0 0 1px rgba(255,255,255,.06)}
.orbit__mark{width:72%;height:auto;display:block;overflow:visible}
.orbit__mark .ps-stop{transform-box:fill-box;transform-origin:center;animation:ps-pulse 2.8s ease-in-out infinite}
@keyframes ps-pulse{0%,100%{stroke-width:4.2}50%{stroke-width:6.4}}
@media (prefers-reduced-motion:reduce){.orbit__mark .ps-stop{animation:none}}
@media (max-width:760px){.orbit__hub{inset:28%}}

/* The visual column: positioning context for the orbit and its chips. */
.hero__vis{position:relative;width:100%}
.hero__vis .orbit{margin-left:auto}
@media (max-width:900px){.hero__vis .orbit{margin:2rem auto 0}}

/* ---- Case study page ----
   Brief, method, obstacles, outcome, then the ask. Built to be scanned: the
   numbers and the disclosure are visible without scrolling, steps are
   numbered, and the CTA arrives where intent peaks rather than only at the
   very bottom. */
.eyebrow{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:.9rem}
.phero__cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.6rem}
.cs-h1{font-size:clamp(2.4rem,5.4vw,4.6rem)}
.cs-h2{font-size:clamp(1.7rem,3.2vw,2.6rem);max-width:28ch}
.cs-figs{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.cs-figs__lead{grid-column:1/-1}
.cs-figs__lead b{font-size:clamp(2.6rem,5vw,4rem)}
.cs-figs__time{grid-column:1/-1;display:flex;align-items:center;gap:.6rem;padding:.8rem 1.1rem;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:.95rem;color:var(--ink2)}
.cs-figs__time .ic,.cs-figs__time svg{width:18px;height:18px;flex:none}
.cs-brief{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.cs-brief__goal{font-size:clamp(1.3rem,2.2vw,1.75rem);line-height:1.4;letter-spacing:-.01em;margin:0;max-width:40ch}
.cs-glance__h{font-size:1.1rem;letter-spacing:-.01em;margin-bottom:.8rem}
.cs-glance dl{margin:0;display:grid;gap:.8rem}
.cs-glance dl>div{display:grid;gap:.15rem;padding-bottom:.8rem;border-bottom:1px solid var(--line)}
.cs-glance dl>div:last-child{border-bottom:0;padding-bottom:0}
.cs-glance dt{font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cs-glance dd{margin:0;font-weight:600}
.cs-glance__tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.3rem!important}
.cs-glance__tags .tag svg{width:14px;height:14px}
.cs-head{margin-bottom:1.6rem}
.cs-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;counter-reset:s}
.cs-step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.4rem 1.4rem 1.5rem;box-shadow:var(--sh);display:flex;flex-direction:column;gap:.55rem}
.cs-step__n{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--t);color:var(--h);font-weight:800;font-size:.95rem;letter-spacing:.02em;margin-bottom:.3rem}
.cs-step h3{font-size:1.25rem;letter-spacing:-.02em;line-height:1.15}
.cs-step p{margin:0;color:var(--ink2);font-size:.98rem}
.cs-pair .card{display:flex;flex-direction:column;gap:.8rem}
.cs-pair .card p{margin:0;font-size:1.05rem;line-height:1.6}
.cs-prose{margin:0 auto}
.cs-note{margin:0;padding:clamp(1.8rem,4vw,3rem);border-radius:var(--r-lg);background:var(--t);position:relative}
.cs-note__label{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--h);margin-bottom:1rem}
.cs-note blockquote{margin:0;font-size:clamp(1.5rem,3vw,2.3rem);line-height:1.2;font-weight:700;letter-spacing:-.025em;max-width:30ch}
.cs-note__by{margin:1.1rem 0 0;color:var(--ink2);font-size:.95rem}
.link--light{color:var(--lime)}
.cs-more__head{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap;margin-bottom:1.2rem}
a.case__vis{display:block;color:inherit}
@media (max-width:860px){.cs-brief{grid-template-columns:1fr}.cs-figs{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.cs-figs{grid-template-columns:1fr}}

/* ---- World map ----
   Every country in a quiet tone (we work anywhere), focus regions in their
   colour, stations and routes in ink and lime. A region lights up on hover or
   focus wherever it appears: shape, label, city stops, route or list. */

/* ---- Pricing: section nav, comparison table, service prices, add-ons ---- */
.ptable{overflow-x:auto;border-radius:var(--r);border:1px solid var(--line);background:#fff;box-shadow:var(--sh)}
.ptable table{width:100%;border-collapse:collapse;min-width:760px}
.ptable th{padding:.85rem 1rem;text-align:start;border-bottom:1px solid var(--line);font-size:.92rem;vertical-align:top}
.ptable td{padding:.85rem 1rem;text-align:start;border-bottom:1px solid var(--line);font-size:.92rem;vertical-align:top}
.ptable thead th{position:sticky;top:0;background:#fff;font-size:1.05rem}
.ptable thead th span{display:block;font-weight:800;color:var(--h,var(--ink))}
.ptable thead th small{display:block;font-weight:600;color:var(--muted);font-size:.8rem;margin-top:.2rem}
.ptable tbody th{font-weight:700;color:var(--ink);width:22%}
.ptable__no{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;margin-inline-end:.45rem;vertical-align:-4px;background:var(--bg2);color:var(--muted)}
.ptable__no svg{width:12px;height:12px}
.ptable tfoot td{border-bottom:0;padding:1rem}
.addons{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:.8rem}

.incta{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin:2rem 0;padding:1.2rem 1.4rem;border-radius:var(--r-sm);background:var(--t-blue);border-inline-start:5px solid var(--blue)}
.incta b{display:block;font-size:1.1rem}.incta p{margin:.2rem 0 0!important;font-size:.95rem;color:var(--ink2)}
.nf-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;margin-top:2.2rem}
.nf-links a{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .9rem;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:600}
.nf-links a .ico{width:28px;height:28px}
@media (max-width:760px){.cookie{bottom:84px}}
/* ---- Lead pop-in and mobile action bar ---- */
.popin{position:fixed;right:20px;bottom:20px;z-index:120;width:min(380px,calc(100vw - 32px));background:#fff;border-radius:var(--r);box-shadow:0 30px 80px -20px rgba(15,22,38,.45);padding:1.4rem 1.4rem 1rem;border-top:6px solid var(--h);transform:translateY(24px);opacity:0;transition:transform .4s var(--ease),opacity .4s var(--ease)}
.popin.is-on{transform:none;opacity:1}
.popin__x{position:absolute;top:.7rem;right:.7rem;width:34px;height:34px;border-radius:50%;border:0;background:var(--bg2);cursor:pointer;display:grid;place-items:center}
.popin__x svg{width:16px;height:16px}
.popin__badge{display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:.3rem .65rem;border-radius:999px;background:var(--ink);color:#fff}
.popin__disc{font-size:2.6rem;font-weight:800;letter-spacing:-.05em;line-height:1;margin:.6rem 0 .2rem;color:var(--h)}
.popin.hue-lime .popin__disc{color:#5C7F00}
.popin h2{font-size:1.35rem;letter-spacing:-.02em;margin:.5rem 0 .4rem;padding-inline-end:2rem}
.popin p{margin:0 0 .9rem;color:var(--ink2);font-size:.92rem}
.popin .form{gap:.5rem}.popin .form input{padding:.7rem .9rem}.popin .btn{width:100%;justify-content:space-between}
.popin__later{display:block;margin:.6rem auto 0;border:0;background:none;color:var(--muted);font-size:.82rem;cursor:pointer;text-decoration:underline}
.mbar{display:none}
@media (max-width:760px){
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:110;gap:.5rem;padding:.55rem .7rem calc(.55rem + env(safe-area-inset-bottom));background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
  .mbar a{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border-radius:999px;font-weight:700;font-size:.92rem;padding:.75rem 1rem}
  .mbar__main{flex:1;background:var(--blue);color:#fff}.mbar__main svg{width:18px;height:18px}
  .mbar__offer{background:var(--lime);color:var(--ink)}
  body{padding-bottom:72px}
  .wa-float{bottom:84px!important}.totop{bottom:84px!important}
  .popin{left:16px;right:16px;bottom:84px;width:auto}
}
/* ---- Offers ---- */
.offer{position:relative;display:flex;flex-direction:column;gap:.8rem;padding:clamp(1.5rem,3vw,2.2rem);border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--sh);overflow:hidden}
.offer::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:var(--t);opacity:.8;z-index:0}
.offer>*{position:relative;z-index:1}
.offer__badge{align-self:flex-start;font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:.35rem .75rem;border-radius:999px;background:var(--ink);color:#fff}
.offer__disc{
  font-size:clamp(1.4rem,2.2vw,1.8rem);
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.1;
  color:var(--h)}
.offer.hue-lime .offer__disc{color:#5C7F00}
.offer__sum{margin:0;color:var(--ink2);font-size:1.05rem;max-width:56ch}
.offer__applies{display:flex;gap:.5rem;align-items:center;margin:0;font-weight:700;font-size:.92rem}
.offer__applies svg{width:18px;height:18px;color:var(--h)}
.offer__acts{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.2rem;margin-top:.4rem}
.offer__ends{display:inline-flex;gap:.4rem;align-items:center;font-weight:600;color:var(--ink2);font-size:.9rem}.offer__ends svg{width:16px;height:16px}
.offer ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.offer li{display:flex;gap:.6rem;align-items:flex-start;font-size:.95rem}
.offer li .ico{width:24px;height:24px;flex:none}.offer li .ico svg{width:14px;height:14px}
.offer__terms summary{cursor:pointer;font-weight:700;font-size:.88rem;color:var(--ink2)}
.offer__terms p{margin:.5rem 0 0;font-size:.85rem;color:var(--muted);line-height:1.55}
.offer .btn{align-self:flex-start;margin-top:auto}
.offer--lead{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr);gap:2rem;background:linear-gradient(135deg,#fff 0%,var(--t) 100%)}
.offer--lead h2{font-size:clamp(1.8rem,3.4vw,2.8rem)}
.offer__main{display:flex;flex-direction:column;gap:.9rem}
.offer__side{background:rgba(255,255,255,.75);backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:var(--r);padding:1.4rem;display:flex;flex-direction:column;gap:1rem;align-self:start}
.offer__side h3{font-size:1.1rem}
.annc--offer{background:var(--lime);color:var(--ink)}
.annc--offer a{color:var(--ink);font-weight:700}
.annc__badge{display:inline-block;background:var(--ink);color:var(--lime);font-weight:800;padding:.1rem .55rem;border-radius:999px;font-size:.8rem;margin-inline-end:.3rem}
@media (max-width:860px){.offer--lead{grid-template-columns:1fr}}
/* The hub tile is a span inside .orbit__center, whose generic `span` rule
   (display:block, margin-top) broke the centring: the mark sat ~15px high.
   Restate the tile as a centred grid with no margin. */
.orbit__hub .orbit__tile{display:grid;place-items:center;margin:0;font-size:inherit;color:inherit}
.orbit__hub .orbit__mark{margin:0}

/* ---- Legal pages: sticky contents beside the text ---- */
.legal{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.legal__toc{position:sticky;top:100px;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:1.1rem 1.2rem;font-size:.9rem;box-shadow:var(--sh)}
.legal__toc ol{margin:.6rem 0 0;padding-inline-start:1.1rem;display:grid;gap:.35rem;color:var(--ink2)}
.legal__toc a:hover{color:var(--blue)}
.legal__body h2{scroll-margin-top:110px;font-size:1.6rem}
.legal__body table{width:100%;border-collapse:collapse;font-size:.92rem;margin:1rem 0}
.legal__body th{border:1px solid var(--line);padding:.6rem .7rem;text-align:start;vertical-align:top;background:var(--bg2)}
.legal__body td{border:1px solid var(--line);padding:.6rem .7rem;text-align:start;vertical-align:top}
@media (max-width:860px){.legal{grid-template-columns:1fr}.legal__toc{position:static}.legal__body table{display:block;overflow-x:auto}}
@media (max-width:640px){.phero__vis{display:none}.phero{padding-top:1.6rem}}
@media (max-width:640px){.annc--offer .wrap{flex-wrap:nowrap;font-size:.82rem;gap:.45rem}.annc--offer .wrap>span:not(.annc__badge){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}.annc--offer a{white-space:nowrap}}
/* Header fit: German, French and Russian labels run longer than English, so
   the brand and nav labels never wrap and the link padding tightens as the
   viewport narrows, until the burger takes over. */
.brand{white-space:nowrap}
.nav__item>a{white-space:nowrap}
.hdr__cta .btn{white-space:nowrap}
@media (max-width:1440px){.nav__item>a{padding:.6rem .7rem}}
@media (max-width:1380px){.nav__list{gap:0}.nav__item>a{padding:.55rem .6rem;font-size:.95rem}}
/* Price builder: tabs of services on the left, a sticky running estimate on
   the right. Options are whole-row labels so the full row is the hit area. */
/* Founders: three cards in one row. Name, role, LinkedIn, nothing more. */
.people{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
.person{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh);padding:1.8rem;display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.person:hover{transform:translateY(-4px);box-shadow:var(--sh-hover)}
.person__photo{width:88px;height:88px;border-radius:50%;overflow:hidden;background:linear-gradient(160deg,var(--h),var(--ink2) 150%);color:#fff;display:grid;place-items:center;font-size:1.9rem;font-weight:700;letter-spacing:-.04em;margin-bottom:1rem;box-shadow:0 0 0 4px #fff,0 0 0 5px var(--line);aspect-ratio:5/4}
.person__photo img{width:100%;height:100%;object-fit:cover}
.person__name{font-size:1.35rem;letter-spacing:-.02em}
.person__role{font-weight:600;color:var(--ink2);margin:0}
.person__tag{margin:0 0 .6rem}
@media (max-width:720px){.people{grid-template-columns:1fr}}
/* About: mission and vision side by side, then the plan as three steps. */
.plan{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;counter-reset:plan}
.plan__step{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.6rem;box-shadow:var(--sh)}
.plan__when{display:inline-block;background:var(--h);color:#fff;font-weight:700;font-size:.8rem;padding:.3rem .8rem;border-radius:999px;margin-bottom:.9rem}
.plan__step h3{font-size:1.25rem;margin-bottom:.4rem}
.plan__step p{color:var(--ink2);margin:0}
@media (max-width:820px){.plan{grid-template-columns:1fr}}
/* Even line lengths on headings: no single-word orphans. */
h1{text-wrap:balance}
h2{text-wrap:balance}
h3{text-wrap:balance}
.lede{text-wrap:pretty}
.person__role{text-wrap:pretty}
.grid.g4>.principle{flex-direction:column;gap:.8rem;padding:1.6rem}
.grid.g4>.principle b{font-size:1.1rem}
.pick{display:flex;flex-direction:column;gap:.2rem;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.pick:hover{transform:translateY(-3px);box-shadow:var(--sh-hover)}
.pick .link{margin-top:.6rem;color:var(--h)}
/* Service page intro: the explanation on the left, the fit checklist on the right. */
.svc-intro{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2rem;align-items:start}
.svc-intro__text h2{margin-bottom:1rem}
.svc-intro__text .lede{max-width:60ch;margin-bottom:1rem}
.svc-intro__fit h3{font-size:1.25rem;margin-bottom:1rem}
.svc-intro__fit .checklist{gap:.7rem}
.svc-related__title{font-size:1.25rem;margin:0 0 1rem}
@media (max-width:860px){.svc-intro{grid-template-columns:1fr}}
.start-assure{padding-bottom:0}
.start-assure h2{font-size:clamp(1.6rem,2.6vw,2.2rem)}
.start-assure .card{padding:1.2rem 1.4rem}
.start-assure .card h3{font-size:1.2rem}
.thanks__h{font-size:clamp(1.6rem,3vw,2.4rem);margin-bottom:1.2rem}
.thanks__steps .plan__when{min-width:1.8rem;text-align:center}
.job-more{margin-top:2.4rem}
.job-more h2{font-size:clamp(1.6rem,2.6vw,2.2rem);margin-bottom:1rem}
.job-steps{list-style:none;margin:0 0 1.4rem;padding:0;display:grid;gap:.9rem}
.job-steps li{display:flex;gap:.9rem;align-items:flex-start}
.job-steps__n{flex:none;width:2rem;height:2rem;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.9rem}
.job-steps p{margin:.2rem 0 0}
.job-about h3{font-size:1.2rem;margin-bottom:.4rem}
.job-about .link{margin-top:.6rem;display:inline-flex}
.facts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}
.facts .fact b{font-size:clamp(2rem,3.4vw,2.8rem);letter-spacing:-.04em;line-height:1;color:var(--h)}
.facts .fact span{color:var(--ink2);font-size:.92rem;font-weight:600}
@media (max-width:980px){.facts{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* ---- Mega menu ----
   Panels hang from the header bar, not from their menu item, so a panel
   opened from the right-hand items never runs off screen. A transparent
   bridge covers the gap so moving the pointer down does not close it. */
.nav__item.has-mega{position:static}
.nav__item>a{display:inline-flex;align-items:center;gap:.3rem}
.nav__caret{display:inline-grid;transition:transform .2s var(--ease);opacity:.55}
.nav__caret .ic{width:12px;height:12px}
.has-mega:hover .nav__caret,.has-mega:focus-within .nav__caret{transform:rotate(45deg);opacity:1}
.mega{left:50%;width:min(760px,calc(100vw - 40px));padding:1.2rem;transition:opacity .18s var(--ease),transform .18s var(--ease)}
.mega::before{content:"";position:absolute;left:0;right:0;top:-28px;height:28px}
.has-mega.is-open .nav__caret{transform:rotate(45deg);opacity:1}
.mega--wide{width:min(1120px,calc(100vw - 40px))}
.mega__body{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:1rem}
.mega__col-h{display:flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:700;color:var(--ink2);text-transform:none;padding:.4rem .6rem .5rem}
.mega__link--rich{align-items:flex-start;padding:.55rem .6rem}
.mega__link--rich b{display:block;font-size:.93rem;line-height:1.25}
.mega__link--rich small{display:block;color:var(--muted);font-weight:500;font-size:.8rem;line-height:1.35;margin-top:.1rem}
.mega__link--rich .ico{flex:none;margin-top:.1rem}
.mega__side{border-radius:var(--r);padding:1.3rem;display:flex;flex-direction:column;gap:.6rem;align-items:flex-start}
.mega__side--ink{background:var(--ink);color:#fff}
.mega__side p{margin:0;color:rgba(255,255,255,.75);font-size:.9rem}
.mega__eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--lime)}
.mega__big{font-size:2.6rem;letter-spacing:-.04em;line-height:1}
.mega__side .btn{margin-top:auto}
.link--light{color:#fff}
.mega__foot{margin-top:1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.mega__list{display:grid;gap:.35rem}
.mega__list--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mega__count{font-style:normal;font-size:.72rem;background:var(--lime);color:var(--ink);border-radius:999px;padding:.05rem .45rem;margin-left:.25rem}
/* Mobile menu: one collapsible section per area. */
.mnav__nav{display:grid;grid-template-columns:minmax(0,1fr);gap:.4rem}
.mnav__sec{border-bottom:1px solid var(--line);padding:.3rem 0 .8rem}
.mnav__sec>summary{list-style:none;display:flex;align-items:center;gap:1rem;font-size:1.6rem;font-weight:700;letter-spacing:-.03em;padding:.5rem 0;cursor:pointer}
.mnav__sec>summary::-webkit-details-marker{display:none}
.mnav__sec>summary::after{content:"+";margin-left:auto;font-weight:500;color:var(--muted);transition:transform .2s}
.mnav__sec[open]>summary::after{transform:rotate(45deg)}
.mnav__h{margin:.8rem 0 .4rem;font-size:.8rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.mnav__grid--1{grid-template-columns:minmax(0,1fr)}
.mnav__num{color:var(--blue);margin-right:.5rem}
.mnav__link{font-size:1.6rem}
.mnav__cta{margin-top:1rem;justify-content:space-between}
@media (max-width:1180px){.mega--wide .mega__body{grid-template-columns:1fr}.mega--wide .mega__side{display:none}}
/* ---- World map ----
   A dot-matrix map on a soft panel. Grey dots are everywhere we can work;
   coloured dots are the five focus regions, and they grow on hover. Routes
   run from the two team bases. The detail card and region list sit under it. */
.wmap{display:grid;gap:1.2rem}
.wmap__stage{position:relative;border-radius:var(--r-lg);background:radial-gradient(120% 90% at 70% 30%,#EEF2FF 0%,#F7F6F0 60%,#F3F1E9 100%);border:1px solid var(--line);overflow:hidden;box-shadow:var(--sh);padding:clamp(.6rem,2vw,1.4rem) clamp(.4rem,1.5vw,1rem) 3rem}
.wmap__svg{display:block;width:100%;height:auto;overflow:visible}
.wmap__dots{fill:none;stroke-linecap:round;stroke-width:3.6;stroke:#D9D6CB;transition:stroke-width .25s var(--ease),stroke .25s var(--ease)}
.wmap__dots--rest{stroke:#DCD9CF}
.wmap__region{cursor:pointer;outline:none}
.wmap__region .wmap__dots{stroke:color-mix(in srgb,var(--h) 70%,#fff)}
.wmap__region .wmap__dots.hue-lime{stroke:#A9D42A;--h:#86B511}
.wmap__region:hover .wmap__dots,.wmap__region:focus-visible .wmap__dots,.wmap__region.is-active .wmap__dots{stroke:var(--h);stroke-width:5.4}
.wmap__route{fill:none;stroke:var(--ink);stroke-width:1.3;stroke-dasharray:3 6;opacity:.28;animation:wmap-flow 1.6s linear infinite;transition:opacity .25s,stroke .25s,stroke-width .25s}
.wmap__route.is-active{opacity:.95;stroke:var(--blue);stroke-width:2}
@keyframes wmap-flow{to{stroke-dashoffset:-18}}
.wmap__city{fill:#fff;stroke:var(--ink);stroke-width:1.2;opacity:.55;transition:opacity .25s}
.wmap__city.is-active{opacity:1;fill:var(--lime)}
.wmap__station{fill:#fff;stroke:var(--ink);stroke-width:3}
.wmap__station--hq{fill:var(--ink);stroke:var(--lime);stroke-width:3.5}
.wmap__pulse{fill:none;stroke:var(--lime);stroke-width:2;transform-box:fill-box;transform-origin:center;animation:wmap-pulse 2.6s ease-out infinite}
@keyframes wmap-pulse{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(3.2)}}
.wmap__pin{position:absolute;white-space:nowrap;border-radius:999px;font-size:.74rem;font-weight:700;line-height:1;box-shadow:0 6px 16px -8px rgba(15,22,38,.35);padding:.4rem .65rem;background:var(--ink);color:#fff}
.wmap__label{position:absolute;white-space:nowrap;border-radius:999px;font-size:.74rem;font-weight:700;line-height:1;box-shadow:0 6px 16px -8px rgba(15,22,38,.35);display:inline-flex;align-items:center;gap:.45rem;transition:background .2s,color .2s,transform .2s var(--ease)}
.wmap__pin--hq{transform:translate(-50%,70%)}
.wmap__pin--base{background:#fff;color:var(--ink);border:1px solid var(--line2);transform:translate(12%,-170%)}
.wmap__label{padding:.3rem .35rem .3rem .7rem;background:#fff;color:var(--ink);border:1px solid var(--line);transform:translate(-50%,-50%)}
.wmap__label span{font-variant-numeric:tabular-nums;background:var(--bg2);border-radius:999px;padding:.22rem .45rem;font-weight:600;color:var(--ink2)}
.wmap__label:hover,.wmap__label.is-active{background:var(--h);color:#fff;border-color:transparent;transform:translate(-50%,-50%) scale(1.06)}
.wmap__label:hover span,.wmap__label.is-active span{background:rgba(255,255,255,.22);color:#fff}
.wmap__label[data-region="united-kingdom"]{transform:translate(-118%,-60%)}
.wmap__label[data-region="united-kingdom"]:hover,.wmap__label[data-region="united-kingdom"].is-active{transform:translate(-118%,-60%) scale(1.06)}
.wmap__label[data-region="europe"]{transform:translate(-10%,40%)}
.wmap__label[data-region="europe"]:hover,.wmap__label[data-region="europe"].is-active{transform:translate(-10%,40%) scale(1.06)}
.wmap__legend{position:absolute;left:1rem;right:1rem;bottom:.9rem;display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;font-size:.74rem;color:var(--ink2)}
.wmap__legend span{display:inline-flex;align-items:center;gap:.4rem}
.wmap__k{width:10px;height:10px;border-radius:50%;display:inline-block}
.wmap__k--hq{background:var(--ink);box-shadow:0 0 0 2px var(--lime)}
.wmap__k--focus{background:linear-gradient(135deg,var(--blue),var(--violet))}
.wmap__k--world{background:#DCD9CF}
.wmap__panel{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:1rem;align-items:start}
.wmap__card{grid-column:1;grid-row:1;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;box-shadow:var(--sh);display:flex;flex-direction:column;gap:.9rem;animation:wmap-in .3s var(--ease)}
.wmap__card[hidden]{display:none}
@keyframes wmap-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wmap__card .wmap__name{margin:0;font-family:var(--f);font-variation-settings:"wdth" 88;font-weight:700;line-height:.98;letter-spacing:-.02em;font-size:1.6rem;text-wrap:balance}
.wmap__card p{margin:0;color:var(--ink2);font-size:.95rem}
.wmap__card .eyebrow{margin:0;color:var(--h,var(--muted))}
.wmap__meta{display:grid;grid-template-columns:1fr 1.4fr;gap:.6rem;margin:0}
.wmap__meta dt{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.wmap__meta dd{margin:.15rem 0 0;font-size:.88rem;font-weight:600}
.wmap__acts{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem}
.wmap__hint{display:flex;align-items:center;gap:.4rem;font-size:.82rem!important;color:var(--muted)!important}
.wmap__hint svg{width:16px;height:16px}
.wmap__list{grid-column:2;grid-row:1;list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.wmap__list a{display:flex;align-items:center;gap:.6rem;padding:.7rem .9rem;border-radius:14px;background:#fff;border:1px solid var(--line);font-weight:600;font-size:.95rem;transition:background .2s,transform .2s var(--ease)}
.wmap__list a i{width:10px;height:10px;border-radius:50%;background:var(--h);flex:none}
.wmap__list a span{margin-left:auto;font-size:.82rem;color:var(--muted);font-weight:700;font-variant-numeric:tabular-nums}
.wmap__list a:hover{background:var(--t);border-color:transparent;transform:translateX(3px)}
.wmap__list a:focus-visible{background:var(--t);border-color:transparent;transform:translateX(3px)}
.wmap__list a.is-active{background:var(--t);border-color:transparent;transform:translateX(3px)}
@media (max-width:860px){.wmap__panel{grid-template-columns:1fr}.wmap__list{grid-column:1;grid-row:2}}
@media (max-width:640px){.wmap__pin--hq{transform:translate(-92%,80%)}.wmap__label span,.wmap__pin--base{display:none}.wmap__label{font-size:.62rem;padding:.25rem .45rem}.wmap__pin{font-size:.62rem}.wmap__legend{position:static;padding:.6rem .4rem 0}.wmap__stage{padding-bottom:.6rem}}
@media (prefers-reduced-motion:reduce){.wmap__route,.wmap__pulse{animation:none}}
/* About: goals as a numbered two-by-two list. */
.goals{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.goal{display:flex;gap:1.1rem;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.5rem;box-shadow:var(--sh)}
.goal h3{font-size:1.2rem;margin-bottom:.35rem}
.goal p{margin:0;color:var(--ink2)}
@media (max-width:760px){.goals{grid-template-columns:1fr}}

/* Grid and form children may shrink below their content width, so a long word or a form field never widens the page on small phones */
.grid>*,.ftr__top>*,.legal>*,.form>*{min-width:0}
.job-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1.4rem;align-items:center}
@media (max-width:560px){.job-card{gap:1rem}.job-card__body{grid-column:1/-1;grid-row:2}.job-card>.ico--md{grid-column:3;grid-row:1}}

/* Phones: service cards become compact rows (icon, name and one line, arrow), so twelve services fit in about a screen and a half instead of three thousand pixels. */
@media (max-width:560px){
  .svc{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;column-gap:.9rem;row-gap:.15rem;min-height:0;padding:.95rem 1rem}
  .svc::after{display:none}
  .svc>.ico{grid-row:1/3;width:44px;height:44px}
  .svc>.ico .ic{width:20px;height:20px}
  .svc h3{font-size:1.05rem;align-self:end}
  .svc p{font-size:.86rem;line-height:1.35;grid-column:2;align-self:start}
  .grid.g4:has(>.svc),.grid.g3:has(>.svc){gap:.6rem}
  .hero .orbit{width:min(64vw,250px);margin-top:1.2rem}
}

/* Phones: founder cards run horizontally (photo left, name and role right); footer link columns pair up two by two. */
@media (max-width:560px){
  .person{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:1rem;row-gap:.1rem;align-items:center;padding:1.1rem 1.2rem}
  .person__photo{grid-row:1/5;width:64px;height:64px;font-size:1.35rem;align-self:start}
  .person__name{font-size:1.15rem}
  .person__tag{margin:0}
  .people{gap:.7rem}
  .ftr__top{grid-template-columns:1fr 1fr;column-gap:1.2rem}
  .ftr__brand{grid-column:1/-1}
}


/* Phones, start page: the three promises and the plan picker become compact rows (icon left), so the form starts sooner. */
@media (max-width:560px){
  .start-assure .grid{gap:.6rem}
  .start-assure .card{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:.9rem;row-gap:.2rem;align-items:start;padding:1rem 1.1rem}
  .start-assure .card>.ico{grid-row:1/3;margin:0}
  .start-assure .card h3{font-size:1.05rem;margin:0 0 .15rem!important}
  .pkg-pick{gap:.5rem}
  .pkg-pick .pk{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:.85rem;row-gap:.1rem;align-items:center;padding:.75rem .9rem}
  .pkg-pick .pk>.ico{grid-row:1/4}
  .pkg-pick input:checked+.pk{transform:none}
}

/* Contact hero: text and form side by side on wide screens only; it used to be an inline style, which stopped the layout collapsing on phones. */
@media (min-width:861px){.phero__in--contact{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:start}}
.founder--author{grid-template-columns:140px minmax(0,1fr);min-height:0}
.founder--author .avatar{font-size:2.4rem}
@media (max-width:560px){.founder--author{grid-template-columns:72px minmax(0,1fr);gap:1rem}.founder--author .avatar{font-size:1.4rem}}

/* Phones: any card that opens with an icon (promises, next steps, values) runs icon-left, text-right, which roughly halves its height. */
@media (max-width:560px){
  .grid>.card:not(.job-card):has(>.ico:first-child){display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:.9rem;row-gap:.2rem;align-items:start;padding:1rem 1.1rem}
  .grid>.card:not(.job-card):has(>.ico:first-child)>.ico:first-child{grid-row:1/span 3;margin:0}
  .grid>.card:not(.job-card):has(>.ico:first-child)>:not(.ico:first-child){grid-column:2}
  .grid>.card:not(.job-card):has(>.ico:first-child)>h3{font-size:1.05rem;margin:0 0 .15rem!important}
  .grid:has(>.card:not(.job-card)>.ico:first-child){gap:.6rem}
}
@media (max-width:560px){
  .principle{display:grid!important;grid-template-columns:auto minmax(0,1fr);column-gap:.9rem;align-items:start;padding:1rem 1.1rem}
  .principle>.ico{margin:0}
  .grid:has(>.principle){gap:.6rem}
}

/* Phones: market quick facts pair up two by two. */
@media (max-width:560px){.mfacts{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.6rem}.mfacts>*{padding:1rem!important}}

/* ---- Pricing: prices at a glance (eight services, two prices each), pinned estimate bar, offer cards ---- */
.pnote{margin-top:1rem}
/* The estimate pins to the bottom of the screen while the price list is in view. */
.pest{position:sticky;bottom:20px;z-index:20;margin-top:1.2rem;display:flex;align-items:center;flex-wrap:wrap;gap:.8rem 1.4rem;padding:.85rem .85rem .85rem 1.5rem;border-radius:var(--r-lg);background:var(--ink);color:#fff;box-shadow:var(--sh-hover)}
.pest__sum{flex:1 1 260px;min-width:0;display:grid;gap:.15rem}
.pest__label{font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.pest__sum b{font-size:1.2rem;letter-spacing:-.01em}
.pest__tip{font-size:.86rem;color:var(--lime)}
.pbuild:not(.has-picks) .pest__sum b{color:rgba(255,255,255,.75);font-weight:600}
@media (max-width:760px){
  /* Phones: the estimate bar replaces the bottom action bar on this page, so only one bar is pinned. */
  body:has([data-builder]) .mbar,body:has([data-builder]) .totop{display:none!important}
  .pest{bottom:12px;padding:.8rem .8rem .8rem 1.1rem;gap:.6rem 1rem}
  .pest .btn{padding:.7rem 1rem;font-size:.92rem}
}
.pest__short{display:none}
@media (max-width:560px){
  /* Phones: the estimate bar stays one line high. */
  .pest{flex-wrap:nowrap;gap:.7rem;padding:.65rem .65rem .65rem 1rem;border-radius:999px}
  .pest__sum{flex:1 1 auto}
  .pest__label{font-size:.66rem}
  .pest__sum b{font-size:.92rem;line-height:1.25}
  .pest__tip{display:none}
  .pest__long{display:none}
  .pest__short{display:inline}
  .pest .btn{flex:none;padding:.6rem .7rem .6rem 1rem}
}
.svc-reading{margin-top:1.6rem}

/* Markets: region cards under the map */
.mkt-card{display:flex;flex-direction:column;gap:.35rem}
.mkt-card__top{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:.6rem}
.mkt-card h3{margin:0 0 .4rem}
.mkt-card__k{margin:.6rem 0 0;font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--h)}
.mkt-card__p{margin:0;font-size:.93rem;line-height:1.5;color:var(--ink2)}
.mkt-card__chips{margin-top:.8rem}
.mkt-card__meta{display:flex;align-items:center;gap:.4rem;margin:.9rem 0 .2rem;padding-top:.8rem;border-top:1px solid var(--line);font-size:.86rem;color:var(--muted)}
.mkt-card__meta .ic{width:15px;height:15px}
.mkt-card .link{margin-top:auto;padding-top:.6rem}
/* Three-jobs tiles: closed tiles are narrow, so their titles are set smaller and wrap by word. */
.job__title{font-size:clamp(2.2rem,4vw,4.2rem);overflow-wrap:break-word}
.job:not(.is-open) .job__title{font-size:clamp(1.8rem,2.6vw,2.7rem)}
@media (max-width:860px){.job:not(.is-open) .job__title,.job__title{font-size:clamp(2rem,8vw,2.8rem)}}

/* A service group with a single service: one wide card with its main deliverables. */
.mega__col-h--sub{margin-top:.8rem}
@media (max-width:640px){.prose table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:normal}.prose th,.prose td{min-width:140px}}

/* ---- Rate card: one service's tiers (views/partials/family.ejs), used on /pricing and service pages ---- */
.fam{display:grid;gap:clamp(1.6rem,3vw,2.4rem)}
.fam__top{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:.8rem 1.6rem}
.fam__from{
  margin:0;
  display:inline-flex;
  align-items:baseline;
  gap:.35rem;
  padding:.5rem 1rem;
  border-radius:999px;
  background:var(--t);
  font-size:.92rem;
  font-weight:600;
  color:var(--ink2);
  white-space:nowrap}
.fam__from b{
  font-size:1rem;
  color:var(--ink);
  letter-spacing:-.01em}
.fam__line{color:var(--ink2);font-size:1.05rem;max-width:44ch;text-wrap:pretty}
.fam__block{display:grid;gap:.9rem;min-width:0}
.fam__h{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem;font-size:clamp(1.25rem,2vw,1.55rem);letter-spacing:-.02em;line-height:1.15}
.fam__tag{display:inline-flex;align-items:center;padding:.28rem .7rem;border-radius:999px;background:var(--ink);color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.fam__tag--m{background:var(--lime);color:var(--ink)}
.fam__sub{font-weight:700;font-size:.95rem;color:var(--ink2);margin-top:.4rem}
.fam__small{font-size:.88rem;color:var(--muted);max-width:80ch;text-wrap:pretty}
.fam__offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}
.fam__offer{display:flex;flex-direction:column;gap:.35rem;padding:1.2rem 1.3rem;border-radius:var(--r-sm);background:#fff;border:1px solid var(--line)}
.fam__offer-name{font-size:1.05rem;letter-spacing:-.01em}
.fam__offer-time{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;font-weight:700;color:var(--ink2);text-transform:uppercase;letter-spacing:.05em}
.fam__offer-time .ic{width:14px;height:14px}
.fam__offer p{font-size:.92rem;color:var(--muted);line-height:1.45;text-wrap:pretty}
.fam__inc{padding:1.3rem 1.4rem;border-radius:var(--r-sm);background:var(--t)}
.fam__inc .fam__sub{margin:0 0 .8rem}
.fam__list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1.6rem;font-size:.95rem}
.fam__list .ico{background:#fff}
.fam__note{display:flex;align-items:center;gap:.7rem;font-size:.92rem;color:var(--ink2);max-width:80ch}
.fam__note .ico--sm{width:32px;height:32px}.fam__note .ico--sm .ic{width:16px;height:16px}
.ptable{overflow-x:auto;border-radius:var(--r-sm);border:1px solid var(--line);background:#fff;-webkit-overflow-scrolling:touch}
.ptable:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.ptable table{width:100%;border-collapse:separate;border-spacing:0;font-size:.92rem;min-width:620px}
.ptable th{padding:.75rem .9rem;text-align:start;vertical-align:top;border-bottom:1px solid var(--line);line-height:1.35}
.ptable td{padding:.75rem .9rem;text-align:start;vertical-align:top;border-bottom:1px solid var(--line);line-height:1.35}
.ptable tbody tr:last-child th,.ptable tbody tr:last-child td{border-bottom:0}
.ptable thead th{font-size:.95rem;font-weight:700;background:var(--bg);vertical-align:bottom}
.ptable tbody th{font-weight:600;color:var(--ink2);width:22%;min-width:150px}
.ptable thead th:first-child{position:sticky;left:0;background:#fff;z-index:1}
.ptable tbody th{position:sticky;left:0;background:#fff;z-index:1}
.ptable thead th:first-child{background:var(--bg)}
.ptable__no{display:inline-block;width:14px;height:2px;border-radius:2px;background:var(--line2);vertical-align:middle}
@media (max-width:900px){.fam__line{grid-column:1/-1}.fam__offers{grid-template-columns:1fr}.fam__list{grid-template-columns:1fr}}
@media (max-width:560px){.ptable table{font-size:.86rem;min-width:520px}.ptable th,.ptable td{padding:.6rem .65rem}.ptable tbody th{min-width:112px;width:112px}}

/* How buying works */

/* Every tier: one tab per service */

/* Bundles: three across, then two */

/* Add-ons and specialist service prices */
.paddon__list{list-style:none;margin:0;padding:0;display:grid}
.paddon__list li{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--line);font-size:.93rem}
.paddon__list li:last-child{border-bottom:0}
.paddon__name{min-width:0;font-weight:600;line-height:1.3}
.paddon__name small{display:block;font-weight:500;color:var(--muted);font-size:.8rem;margin-top:.1rem}
.sprices{max-width:760px}
.sprices__list li{font-size:1rem}
.sprices > .muted{margin-top:.8rem}
.sprices__go{display:flex;align-items:center;flex-wrap:wrap;gap:.8rem 1.6rem;margin-top:clamp(1.6rem,3vw,2.2rem)}
.sprices__ink-go{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.4rem}

/* Mega menu prices */
.mega__price{display:block;font-style:normal;font-weight:700;font-size:.76rem;color:var(--ink2);margin-top:.2rem;letter-spacing:0}
.mega__prices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.2rem}
.mega__bundles{
  list-style:none;
  margin:.2rem 0 0;
  padding:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.15rem;
  width:100%}
.mega__bundles a{
  display:block;
  padding:.45rem .55rem;
  border-radius:12px;
  transition:background .2s}
.mega__bundles a:hover{background:rgba(255,255,255,.08)}
.mega__bundles b{font-size:.92rem}
.mega__foot-links{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}

/* Home: prices at a glance */
.hprices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.hprice{display:flex;flex-direction:column;gap:.5rem;padding:1.3rem;border-radius:var(--r);background:var(--t);border:1px solid rgba(17,24,39,.05);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.hprice:hover{transform:translateY(-4px);box-shadow:var(--sh-hover)}
.hprice .ico--md{width:46px;height:46px;background:#fff}.hprice .ico--md .ic{width:22px;height:22px}
.hprice__name{font-size:1.2rem;letter-spacing:-.02em;margin:.2rem 0 .2rem}
.hprice__row{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;padding-top:.45rem;border-top:1px solid rgba(17,24,39,.08);font-size:.85rem;color:var(--ink2)}
.hprice__row b{font-size:1.05rem;color:var(--ink);letter-spacing:-.01em}
.hprices__go{display:flex;align-items:center;flex-wrap:wrap;gap:.8rem 1.6rem;margin-top:1.6rem}
@media (max-width:1100px){.hprices{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.hprices{grid-template-columns:1fr}}

/* ---- Home hero: price guide language (ink, paper, one lime accent) ---- */

/* ==== Design language v2 (2026-10-25): the price guide's system, site-wide ====
   Ink, paper and one lime accent. Uppercase eyebrow labels instead of pills,
   solid buttons, crisp white cards on paper, neutral icon tiles, no blurred
   colour blobs and no rainbow gradient text. This layer overrides the older
   rules above it, so every page changes together. */
:root{--paper2:#F1EFE7;--line:rgba(15,22,38,.1);--line2:rgba(15,22,38,.18);--lime-ink:#4E6B00;--lime-t:#EEF7D2;--sh:0 1px 2px rgba(15,22,38,.05),0 8px 24px -12px rgba(15,22,38,.14);--sh-hover:0 2px 4px rgba(15,22,38,.06),0 22px 44px -18px rgba(15,22,38,.24)}
/* (2026-10-25, owner: keep the original look. The ink-and-lime overrides for colours,
   gradient words, labels, buttons, links and the header were removed; what follows
   keeps only usability fixes: field sizes, phone layout, article panel.) */
/* Sections and cards. */
.sec--tint{background:var(--paper2)}
.card{border-color:var(--line);box-shadow:var(--sh)}
.feature{border-color:var(--line)}
.feature:hover{border-color:var(--line2)}
.sec__head{align-items:flex-end}
.sec__head h2{max-width:20ch}
h2{text-wrap:balance}h1{text-wrap:balance}
.lede{text-wrap:pretty}

/* Forms: one field height, calm sizes, no oversized boxes. */
.form{gap:.75rem}
.form input{min-height:50px;padding:.7rem 1rem;border-radius:12px;font-size:1rem;border:1.5px solid var(--line2)}
.form select{min-height:50px;padding:.7rem 1rem;border-radius:12px;font-size:1rem;border:1.5px solid var(--line2)}
.form textarea{padding:.85rem 1rem;border-radius:12px;font-size:1rem;min-height:120px;max-height:260px;line-height:1.5;border:1.5px solid var(--line2)}
.form input:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(45,91,255,.15)}
.form select:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(45,91,255,.15)}
.form textarea:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(45,91,255,.15)}
.form label{font-size:.86rem;color:var(--ink2)}
.form .btn{justify-self:start}
.form__ok{background:var(--lime-t);color:var(--lime-ink)}
.chips .c{border-color:var(--line2)}


/* Article side panel: table of contents and the help card. */
.toc{background:#fff;border:1px solid var(--line2);border-radius:var(--r-sm);padding:1.3rem 1.3rem 1.1rem;box-shadow:none}
.toc b{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink2);margin-bottom:.7rem}
.toc a{color:var(--ink2);font-size:.92rem;font-weight:500;padding:.45rem 0 .45rem .9rem;border-left:2px solid var(--line);line-height:1.35}
.toc a:hover{color:var(--ink)}
.toc a.is-on{color:var(--ink);font-weight:700;border-color:var(--blue)}
.toc .btn{margin-top:1rem;width:100%;justify-content:space-between}

/* FAQ. */
details.faq{border-color:var(--line)}
details.faq summary{font-size:1.02rem}
details.faq[open] summary .ico{background:var(--lime);color:var(--ink)}

/* Page heroes: on phones the words come first and the decorative orbit goes. */
@media (max-width:860px){.phero__vis{display:none}.phero{padding-top:1.6rem}}
.phero h1{max-width:16ch}

/* Mobile: comfortable reading and tap targets everywhere. */
@media (max-width:640px){
  body{font-size:16px}
  .wrap{padding:0 18px}
  h1{font-size:clamp(2.2rem,9.5vw,3rem);line-height:1.02}
  h2{font-size:clamp(1.75rem,7.5vw,2.3rem);line-height:1.05}
  .lede{font-size:1.05rem;max-width:none}
  .sec{padding:3.4rem 0}.sec--tight{padding:2.4rem 0}
  .sec__head{flex-direction:column;align-items:flex-start;gap:1rem;margin-bottom:1.6rem}
  .sec__head .btn{align-self:flex-start}
  .card{padding:1.25rem}
  .btn{max-width:100%}
  .phero__acts .btn,.hero__acts .btn{flex:1 1 100%;justify-content:space-between}
  .form .row{grid-template-columns:1fr}
  .form .btn{justify-self:stretch;justify-content:space-between}
  details.faq{padding:0 1rem}
  details.faq summary{font-size:.98rem;padding:1rem 0}
}

/* ---- Home: live offers band ---- */
.hoff{padding:clamp(2.4rem,5vw,3.6rem) 0;background:var(--paper2);border-bottom:1px solid var(--line)}
.hoff__head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem 2rem;flex-wrap:wrap;margin-bottom:1.4rem}
.hoff__head .kicker{width:100%;margin:0}
.hoff__head h2{font-size:clamp(1.8rem,3.4vw,2.6rem);margin:0}
.hoff__grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:1rem}
.hoff__card{display:flex;flex-direction:column;gap:.45rem;padding:1.5rem;border-radius:var(--r);background:#fff;border:1px solid var(--line);color:var(--ink);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.hoff__card:hover{transform:translateY(-3px);box-shadow:var(--sh-hover)}
.hoff__card--lead{background:var(--ink);color:#fff;border-color:var(--ink)}
.hoff__badge{align-self:flex-start;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:.3rem .65rem;border-radius:999px;background:var(--paper2);color:var(--ink2)}
.hoff__card--lead .hoff__badge{background:var(--lime);color:var(--ink)}
.hoff__big{
  font-size:clamp(1.25rem,1.8vw,1.5rem);
  font-weight:700;
  letter-spacing:-.02em;
  line-height:1.15;
  margin-top:.3rem}
.hoff__card--lead .hoff__big{color:var(--lime)}
.hoff__title{font-weight:600;line-height:1.35;text-wrap:pretty}
.hoff__card--lead .hoff__title{color:rgba(255,255,255,.85)}
.hoff__go{margin-top:auto;padding-top:.8rem;display:inline-flex;align-items:center;gap:.4rem;font-weight:700;font-size:.92rem}
.hoff__go .ic{width:16px;height:16px;transition:transform .2s}.hoff__card:hover .hoff__go .ic{transform:translateX(3px)}
.hoff__card--lead .hoff__go{color:var(--lime)}
@media (max-width:900px){.hoff__grid{grid-template-columns:1fr}}

/* ---- Pop-in, price guide style: ink header, white body ---- */
.popin{padding:0;overflow:hidden;border-top:0;width:min(400px,calc(100vw - 32px));border-radius:var(--r);box-shadow:0 30px 80px -20px rgba(15,22,38,.5)}
.popin__x{background:rgba(255,255,255,.12);color:#fff;z-index:2}
.popin__x:hover{background:rgba(255,255,255,.22)}
.popin__top{background:var(--ink);color:#fff;padding:1.5rem 1.5rem 1.3rem}
.popin__badge{background:var(--lime);color:var(--ink)}
.popin__disc{color:var(--lime);font-size:2.7rem;margin:.7rem 0 .25rem}
.popin.hue-lime .popin__disc{color:var(--lime);font-size:2.7rem;margin:.7rem 0 .25rem}
.popin h2{color:#fff;font-size:1.2rem;line-height:1.25;margin:.2rem 0 0}
.popin__body{padding:1.2rem 1.5rem 1rem}
.popin__list{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.45rem}
.popin__list li{display:flex;gap:.55rem;align-items:flex-start;font-size:.88rem;line-height:1.4;color:var(--ink2)}
.popin__list .ic{width:16px;height:16px;flex:none;margin-top:.15rem;color:var(--lime-ink)}
.popin__row{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.popin .form input{min-height:46px}
.popin__fine{margin:.6rem 0 0;font-size:.78rem;color:var(--muted);text-align:center}
@media (max-width:420px){.popin__row{grid-template-columns:1fr}}

/* ---- Where we work: useful panel (no clocks) ---- */
.wmap__card[data-card="world"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.wmap__card[data-card="world"] .eyebrow{color:var(--lime)}
.wmap__text{margin:0;color:rgba(255,255,255,.78);line-height:1.5;max-width:56ch}
.wmap__facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem}
.wmap__facts>div{padding:.9rem;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);display:grid;gap:.3rem;align-content:start}
.wmap__facts b{font-size:1.9rem;letter-spacing:-.04em;line-height:1;color:var(--lime)}
.wmap__facts span{font-size:.8rem;line-height:1.35;color:rgba(255,255,255,.72)}
.wmap__langs{margin:0;font-weight:600;font-size:.92rem;color:#fff}
.wmap__card[data-card="world"] .wmap__hint{color:rgba(255,255,255,.55)}
.wmap__wins{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.wmap__wins li{display:flex;gap:.6rem;align-items:flex-start;font-size:.95rem;line-height:1.45;color:var(--ink2)}
.wmap__wins .ic{width:18px;height:18px;flex:none;margin-top:.15rem;color:var(--lime-ink)}
.wmap__meta{grid-template-columns:1fr;gap:.75rem;padding-top:.9rem;border-top:1px solid var(--line)}
.wmap__meta>div{display:grid;grid-template-columns:120px 1fr;gap:.8rem;align-items:baseline}
.wmap__meta dd{margin:0;line-height:1.4}
.wmap__list a span{color:var(--ink2)}.wmap__list a span .ic{width:16px;height:16px}
.wmap__list a i{background:var(--lime)}
.wmap__list a:hover{background:var(--ink);color:#fff}
.wmap__list a:focus-visible{background:var(--ink);color:#fff}
.wmap__list a.is-active{background:var(--ink);color:#fff}
.wmap__list a:hover span,.wmap__list a.is-active span{color:var(--lime)}
.wmap__pin{font-weight:700}
@media (max-width:860px){.wmap__facts{grid-template-columns:repeat(2,minmax(0,1fr))}.wmap__meta>div{grid-template-columns:1fr;gap:.2rem}}

/* ---- Team cards (about, team) ---- */
.people{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}
.person{padding:0;gap:0;align-items:stretch;border-radius:var(--r);box-shadow:none;border:1px solid var(--line2);overflow:hidden}
.person:hover{transform:translateY(-3px);box-shadow:var(--sh-hover)}
.person__photo{width:100%;height:auto;border-radius:0;background:var(--ink);color:var(--lime);font-size:clamp(2.6rem,5vw,3.6rem);letter-spacing:-.04em}
.person__photo span{font-weight:700}
.person__body{display:flex;flex-direction:column;gap:.3rem;padding:1.3rem 1.3rem 1.2rem;flex:1}
.person__tag{margin:0 0 .3rem;align-self:flex-start;font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:.25rem .6rem;border-radius:999px;background:var(--lime);color:var(--ink)}
.person__name{font-size:1.35rem;margin:0}
.person__role{font-size:.95rem}
.person__focus{margin:.3rem 0 0;color:var(--muted);font-size:.9rem;line-height:1.45}
.person__links{display:flex;gap:.45rem;margin-top:auto;padding-top:1rem}
.person__btn{display:inline-flex;align-items:center;gap:.5rem;min-height:42px;padding:.45rem .85rem;border-radius:12px;border:1px solid var(--line2);font-weight:600;font-size:.84rem;color:var(--ink);min-width:0;flex:1;transition:background .2s,color .2s,border-color .2s}
.person__btn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.person__btn .ic{width:18px;height:18px;flex:none}
.person__btn--icon{flex:none;width:42px;justify-content:center;padding:0}
.person__btn:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.person__btn:focus-visible{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ---- About ---- */
.story{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(1.6rem,4vw,4rem);align-items:start;margin-bottom:clamp(2rem,4vw,3rem)}
.story__head h2{margin:0}
.story__text p{margin:0 0 1rem;font-size:1.06rem;line-height:1.65;color:var(--ink2);max-width:62ch}
.story__text .story__lead{font-size:clamp(1.2rem,1.8vw,1.4rem);line-height:1.5;color:var(--ink);font-weight:600}
.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.pillar{display:flex;flex-direction:column;gap:.7rem;padding:1.7rem;border-radius:var(--r);background:#fff;border:1px solid var(--line2)}
.pillar__key{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink2)}
.pillar h3{font-size:clamp(1.4rem,2.2vw,1.75rem);line-height:1.1}
.pillar__body{margin:0;line-height:1.55;color:var(--ink2)}
.pillar__t{margin:.6rem 0 0;padding-top:.9rem;border-top:1px solid rgba(15,22,38,.14);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.pillar__list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.pillar__list li{display:flex;gap:.55rem;align-items:flex-start;font-size:.94rem;line-height:1.4;font-weight:600}
.pillar__list .ic{width:18px;height:18px;flex:none;margin-top:.1rem}
.dojobs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.dojob{display:flex;flex-direction:column;gap:.6rem;padding:1.5rem;border-radius:var(--r);background:#fff;border:1px solid var(--line2)}
.dojob .ico--md{width:48px;height:48px}.dojob .ico--md .ic{width:24px;height:24px}
.dojob h3{font-size:1.35rem}
.dojob p{margin:0;color:var(--muted);font-size:.92rem}
.dojob ul{list-style:none;margin:.4rem 0 0;padding:0;display:grid;border-top:1px solid var(--line)}
.dojob li a{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.6rem 0;border-bottom:1px solid var(--line);font-weight:600;font-size:.93rem}
.dojob li a .ic{width:16px;height:16px;transition:transform .2s}.dojob li a:hover .ic{transform:translateX(3px)}
.adds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.add{padding:1.5rem;border-radius:var(--r);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:.5rem}
.add .ico{background:var(--lime);color:var(--ink)}
.add h3{color:#fff;font-size:1.2rem;margin-top:.4rem}
.add p{margin:0;color:rgba(255,255,255,.72);font-size:.94rem;line-height:1.5}
@media (max-width:1000px){.pillars,.adds{grid-template-columns:1fr}.dojobs{grid-template-columns:repeat(2,minmax(0,1fr))}.story{grid-template-columns:1fr}}
@media (max-width:600px){.dojobs{grid-template-columns:1fr}}

/* ---- Team: who to talk to ---- */
.routes{display:grid;gap:.7rem}
.route{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.1fr);gap:1.2rem;align-items:center;padding:1.2rem 1.4rem;border-radius:var(--r-sm);background:#fff;border:1px solid var(--line2)}
.route .ico--sm{width:44px;height:44px}
.route__txt h3{font-size:1.15rem}
.route__txt p{margin:.25rem 0 0;color:var(--muted);font-size:.92rem}
.route__who{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}
.route__who a{display:grid;padding:.55rem .9rem;border-radius:12px;background:var(--paper2);min-width:0;transition:background .2s,color .2s}
.route__who a b{font-size:.92rem}.route__who a span{font-size:.8rem;color:var(--muted)}
.route__who a:hover{background:var(--ink);color:#fff}.route__who a:hover span{color:var(--lime)}
.route--all{background:var(--ink);color:#fff;border-color:var(--ink)}
.route--all h3{color:#fff}
.route--all .ico{background:var(--lime);color:var(--ink)}
.route--all .route__txt p{color:rgba(255,255,255,.7)}
.route--all .route__who a{background:rgba(255,255,255,.08)}.route--all .route__who a span{color:var(--lime)}
@media (max-width:820px){.route{grid-template-columns:auto minmax(0,1fr)}.route__who{grid-column:1/-1;justify-content:flex-start}}

/* ---- Contact ---- */
.cphero{background:var(--paper2)}
.cways{display:grid;gap:.6rem;margin-top:1.8rem;max-width:460px}
.cway{display:flex;align-items:center;gap:.9rem;padding:.85rem 1rem;border-radius:var(--r-sm);background:#fff;border:1px solid var(--line2);transition:border-color .2s,box-shadow .2s}
.cway:hover{border-color:var(--ink);box-shadow:var(--sh)}
.cway .ico{background:var(--ink);color:var(--lime)}
.cway--wa .ico{background:#25D366;color:#fff}
.cway b{display:block;font-size:1rem}
.cway em{display:block;font-style:normal;font-size:.84rem;color:var(--muted)}
.cteam{margin-top:1.6rem;max-width:460px}
.cteam__k{margin:0 0 .6rem;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2)}
.cteam ul{list-style:none;margin:0 0 .9rem;padding:0;display:grid;gap:.35rem}
.cteam li a{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"i who" "i mail";column-gap:.75rem;align-items:center;padding:.55rem .7rem;border-radius:12px;transition:background .2s}
.cteam li a:hover{background:#fff}
.cteam__i{grid-area:i;width:36px;height:36px;border-radius:10px;background:var(--ink);color:var(--lime);display:grid;place-items:center;font-weight:700;font-size:.8rem}
.cteam li a>span:nth-child(2){grid-area:who;display:flex;gap:.5rem;align-items:baseline;flex-wrap:wrap}
.cteam b{font-size:.92rem}.cteam em{font-style:normal;font-size:.8rem;color:var(--muted)}
.cteam__mail{grid-area:mail;font-size:.84rem;font-weight:600;color:var(--ink2)}
.cform{padding:clamp(1.4rem,3vw,2rem)}
.cform .kicker{margin-bottom:.4rem}
.cform__h{font-size:1.5rem;margin:0 0 .4rem}
.cform .btn{justify-content:space-between}

/* ---- Home: how we do it (craft) ---- */
.craft__head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(1.6rem,4vw,4rem);align-items:center;margin-bottom:clamp(2rem,4vw,3rem)}
.craft__head h2{margin:0 0 1rem}
.craft__sketch{width:100%;max-width:420px;justify-self:end;height:auto;padding:1rem;background:#fff;border-radius:var(--r);border:1px solid var(--line2);transform:rotate(-1.5deg);box-shadow:var(--sh)}
.craft__steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.craft__step{position:relative;padding:1.5rem;border-radius:var(--r);background:#fff;border:1px solid var(--line2);display:flex;flex-direction:column;gap:.55rem}
.craft__n{position:absolute;top:1.2rem;right:1.4rem;font-size:.8rem;font-weight:700;letter-spacing:.1em;color:var(--muted)}
.craft__step h3{font-size:1.2rem;margin-top:.4rem}
.craft__step p{margin:0;color:var(--ink2);font-size:.95rem;line-height:1.5}
@media (max-width:980px){.craft__head{grid-template-columns:1fr}.craft__sketch{justify-self:start}.craft__steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.craft__steps{grid-template-columns:1fr}.craft__sketch{max-width:100%}}

/* ---- Home: what this does to your business, then a yes ---- */
.impact__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.impact__card{padding:1.5rem;border-radius:var(--r);border:1px solid var(--line2);background:#fff;display:flex;flex-direction:column;gap:.5rem}
.impact__card h3{font-size:1.2rem;margin-top:.3rem}
.impact__card p{margin:0;color:var(--ink2);font-size:.95rem;line-height:1.5}
@media (max-width:980px){.impact__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.impact__grid{grid-template-columns:1fr}}

/* ---- Case tiles (home, case studies, our work, case pages) ---- */
.ctiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.ctile{display:flex;flex-direction:column;border-radius:var(--r);background:#fff;border:1px solid var(--line2);overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.ctile:hover{transform:translateY(-3px);box-shadow:var(--sh-hover)}
.ctile--big{grid-column:span 2}
.ctile__top{display:flex;flex-direction:column;gap:.35rem;padding:1.5rem 1.5rem 1.3rem;background:var(--ink);color:#fff;min-height:170px;justify-content:flex-end}
.ctile__num{
  font-size:clamp(1.9rem,3vw,2.4rem);
  font-weight:700;
  letter-spacing:-.035em;
  line-height:1;
  color:var(--lime)}
.ctile--big .ctile__num{
  font-size:clamp(2.2rem,3.6vw,2.8rem)}
.ctile__lbl{font-size:.95rem;font-weight:600;color:rgba(255,255,255,.85);line-height:1.35;max-width:36ch}
.ctile__more{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin-top:.6rem;padding-top:.8rem;border-top:1px solid rgba(255,255,255,.14);font-size:.82rem;color:rgba(255,255,255,.7)}
.ctile__more b{color:#fff}
.ctile__body{display:flex;flex-direction:column;gap:.6rem;padding:1.3rem 1.5rem 1.4rem;flex:1}
.ctile__who{margin:0;display:flex;flex-wrap:wrap;gap:.2rem .6rem;align-items:baseline;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.ctile__who span{font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted)}
.ctile__title{font-size:1.2rem;line-height:1.25;letter-spacing:-.015em;margin:0}
.ctile--big .ctile__title{font-size:1.45rem}
.ctile__title a:hover{text-decoration:underline;text-decoration-color:var(--lime);text-decoration-thickness:3px;text-underline-offset:4px}
.ctile__chips{display:flex;flex-wrap:wrap;gap:.35rem}
.ctile__chips span{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .6rem;border-radius:999px;background:var(--paper2);font-size:.78rem;font-weight:600;color:var(--ink2)}
.ctile__chips .ic{width:14px;height:14px}
.ctile__ctx{margin:0;font-size:.78rem;color:var(--muted);font-style:italic}
.ctile__go{margin-top:auto;padding-top:.4rem;display:inline-flex;align-items:center;gap:.4rem;font-weight:700;font-size:.92rem}
.ctile__go .ic{width:16px;height:16px;transition:transform .2s}.ctile:hover .ctile__go .ic{transform:translateX(3px)}
.ctile--cta{padding:1.5rem;background:var(--lime);border-color:var(--lime);gap:.5rem;color:var(--ink)}
.ctile--cta .ctile__num{color:var(--ink)}
.ctile--cta .ctile__lbl{color:var(--ink2)}
.ctile--cta .ctile__title{margin-top:auto;font-size:1.35rem}
.ctile--cta p{margin:0;color:var(--ink2);font-size:.95rem}
@media (max-width:1000px){.ctiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.ctiles{grid-template-columns:1fr}.ctile--big{grid-column:auto}.ctile__top{min-height:0}}
.cfilter{display:flex;gap:.45rem;flex-wrap:wrap;margin-bottom:1.4rem}
.cfilter a{display:inline-flex;align-items:center;gap:.4rem;min-height:40px;padding:.4rem .9rem;border-radius:999px;border:1.5px solid var(--line2);background:#fff;font-weight:600;font-size:.9rem}
.cfilter a .ic{width:16px;height:16px}
.cfilter a:hover{border-color:var(--ink)}
.cfilter a.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.cfilter small{color:var(--lime);font-weight:700}

/* ---- Our work ---- */
.wstrip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line2);border:1px solid var(--line2);border-radius:var(--r);overflow:hidden}
.wstrip__i{display:flex;flex-direction:column;gap:.35rem;padding:1.4rem;background:#fff;transition:background .2s}
.wstrip__i:hover{background:var(--paper2)}
.wstrip__i b{font-size:clamp(2rem,3.6vw,2.9rem);letter-spacing:-.045em;line-height:1}
.wstrip__i span{font-size:.9rem;color:var(--ink2);line-height:1.35}
.wstrip__i em{margin-top:auto;padding-top:.4rem;font-style:normal;font-size:.76rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.wstrip__note{margin-top:.8rem}
@media (max-width:900px){.wstrip{grid-template-columns:repeat(2,minmax(0,1fr))}}
.wmake{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.wmake__i{display:flex;flex-direction:column;gap:.55rem;padding:1.4rem;border-radius:var(--r);background:#fff;border:1px solid var(--line2);transition:border-color .2s,box-shadow .2s}
.wmake__i:hover{border-color:var(--ink);box-shadow:var(--sh)}
.wmake__i h3{font-size:1.2rem;margin-top:.3rem}
.wmake__i>p{margin:0;color:var(--ink2);font-size:.92rem;line-height:1.45}
.wmake__i ul{list-style:none;margin:.2rem 0 0;padding:0;display:grid;gap:.4rem}
.wmake__i li{display:flex;gap:.45rem;align-items:flex-start;font-size:.85rem;line-height:1.4;color:var(--ink2)}
.wmake__i li .ic{width:15px;height:15px;flex:none;margin-top:.15rem;color:var(--lime-ink)}
.wmake__price{margin-top:auto;padding-top:.8rem;border-top:1px solid var(--line);font-size:.82rem;color:var(--muted)}
.wmake__price b{color:var(--ink)}
@media (max-width:1100px){.wmake{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.wmake{grid-template-columns:1fr}}

/* ---- Case page: figures and cards in the new language ---- */
.cs-figs .fact{background:#fff;border:1px solid var(--line2)}
.cs-figs .cs-figs__lead{background:var(--ink);color:#fff;border-color:var(--ink)}
.cs-figs .cs-figs__lead b{color:var(--lime)}
.cs-figs .cs-figs__lead span{color:rgba(255,255,255,.8)}
.case__context{background:var(--paper2);color:var(--ink2)}
.cs-step{background:#fff;border:1px solid var(--line2)}
.cs-step__n{color:var(--lime-ink)}
.ctiles--2{grid-template-columns:repeat(2,minmax(0,1fr))}@media (max-width:640px){.ctiles--2{grid-template-columns:1fr}}

/* ---- Mega menu v2 ---- */
.mega{border-color:var(--line2);box-shadow:0 30px 70px -30px rgba(15,22,38,.4)}
.mega__col-h{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2)}
.mega__col-h .ico{display:none}
.mega__link:hover{background:var(--paper2)}
.mega__link--rich b{font-weight:700}
.mega__side--ink{background:var(--ink)}
.mega__side .mega__eyebrow{color:var(--lime)}
.mega__foot{background:var(--paper2)}
.mega__cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.mega__case2{display:flex;flex-direction:column;gap:.35rem;padding:1rem 1.1rem;border-radius:14px;border:1px solid var(--line2);transition:border-color .2s,background .2s}
.mega__case2:hover{border-color:var(--ink);background:var(--paper2)}
.mega__case2 b{font-size:1.9rem;letter-spacing:-.045em;line-height:1}
.mega__case2 span{font-size:.86rem;font-weight:600;line-height:1.35;color:var(--ink2)}
.mega__case2 small{display:block;margin-top:.3rem;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.mega__sidelinks{display:grid;gap:.1rem;width:100%}
.mega__sidelinks a{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:1px solid rgba(255,255,255,.12);color:#fff;font-weight:600;font-size:.92rem}
.mega__sidelinks a .ic{width:15px;height:15px;color:var(--lime);transition:transform .2s}.mega__sidelinks a:hover .ic{transform:translateX(3px)}
.mega__person{display:flex;align-items:center;gap:.75rem}
.mega__ini{width:46px;height:46px;border-radius:14px;background:var(--lime);color:var(--ink);display:grid;place-items:center;font-weight:700;font-size:1.1rem}
.mega__person b{display:block;color:#fff;font-size:1.05rem}
.mega__person small{display:block;color:rgba(255,255,255,.7);font-size:.84rem}
.mega__sales .btn{max-width:100%;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phero--compact{padding:clamp(1.8rem,4vw,3rem) 0 clamp(1rem,2vw,1.6rem)}
.phero--compact .phero__in{grid-template-columns:minmax(0,1fr)}
.phero--compact h1{max-width:18ch}
.phero--compact .lede{max-width:60ch}

/* ---- Services hub cards ---- */
.scards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.scard{display:flex;flex-direction:column;gap:.6rem;padding:1.5rem;border-radius:var(--r);background:#fff;border:1px solid var(--line2);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .2s}
.scard:hover{transform:translateY(-3px);box-shadow:var(--sh-hover);border-color:var(--ink)}
.scard h3{font-size:1.3rem;margin-top:.3rem}
.scard__short{margin:0;color:var(--ink2);font-size:.95rem;line-height:1.45}
.scard ul{list-style:none;margin:.2rem 0 0;padding:0;display:grid;gap:.4rem}
.scard li{display:flex;gap:.5rem;align-items:flex-start;font-size:.88rem;line-height:1.4;color:var(--ink2)}
.scard li .ic{width:15px;height:15px;flex:none;margin-top:.15rem;color:var(--lime-ink)}
.scard__price{margin-top:auto;padding-top:.9rem;border-top:1px solid var(--line);display:grid;gap:.15rem;font-size:.86rem;font-weight:700}
.scard__go{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;font-size:.9rem}
.scard__go .ic{width:16px;height:16px;transition:transform .2s}.scard:hover .scard__go .ic{transform:translateX(3px)}
.pick{border:1px solid var(--line2)}

/* ==== Phone pass (2026-10-25): bigger tap areas without moving the layout,
   labels no smaller than 12px, full-height fields ==== */
@media (max-width:860px){
  .crumbs a,a.link,.tag,.hoff__head a,.cteam a,.founder__body a,.sprices__go a,.job-more a{position:relative}
  .crumbs a::before,a.link::before,.tag::before,.hoff__head a::before,.cteam a::before,.founder__body a::before,.sprices__go a::before,.job-more a::before{content:"";position:absolute;inset:-10px -6px}
  .crumbs{gap:.35rem .6rem}
  .hoff__badge,.kicker,.person__tag,.pest__label,.toc b,.share__k,.post-cta__k,.pillar__key,.pillar__t,.fam__tag,.cteam__k{font-size:12px}
  .wmap__label b,.wmap__pin{font-size:11px}
  .search input{min-height:40px;min-width:0;flex:1}.search button{width:40px;height:40px;flex:none}
}

/* ==== Pricing, clearer (2026-10-25) ==== */
/* The estimate bar only floats once something is picked, so it never covers the cards before that. */
/* The estimate bar stays fixed at the bottom of the screen for the whole
   pricing page (owner, 2026-10-25). The page gets room below so it never
   covers the footer, and the WhatsApp and back-to-top buttons sit above it. */
.pbuild .pest{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);width:min(1224px,calc(100% - 32px));margin:0;z-index:700}
body:has(.pbuild){padding-bottom:110px}
body:has(.pbuild) .wa-float{bottom:112px}
body:has(.pbuild) .totop{bottom:182px!important}
@media (max-width:640px){.pbuild .pest{bottom:10px;width:calc(100% - 20px)}body:has(.pbuild){padding-bottom:90px}body:has(.pbuild) .wa-float{bottom:86px}}
/* Tier tables in one family share column widths, so the price row and the "more of" rows line up. */
/* Add-ons: six items, then one tap for the rest. */
/* Phones: each service is one compact card, its two prices side by side. */

/* ==== Original look for the newer sections (owner, 2026-10-25) ====
   The site keeps its original design: colour tints per service, gradient
   words, pill labels, blue primary buttons. These rules dress the sections
   added on 2026-10-25 (offers, case tiles, craft, impact, team cards, the
   world panel, the pop-in) in that same language. */
.sec__head h2{max-width:none}
.kicker{width:auto}
/* Offers band */
.hoff{background:var(--bg2)}
.hoff__head .kicker{width:auto;margin:0 0 .2rem}
.hoff__head>div{flex:1 1 auto}
.hoff__head h2{flex:1 1 auto}
.hoff__card{background:var(--t);border:1px solid transparent;color:var(--ink)}
.hoff__card--lead{background:var(--t);border:1px solid transparent;color:var(--ink)}
.hoff__badge{background:#fff;color:var(--h)}
.hoff__card--lead .hoff__badge{background:#fff;color:var(--h)}
.hoff__card--lead .hoff__big{color:var(--ink)}
.hoff__card--lead .hoff__title{color:var(--ink2)}
.hoff__go{color:var(--h)}
.hoff__card--lead .hoff__go{color:var(--h)}
/* Case tiles: the case's own colour on top, like the original case cards */
.ctile__top{background:var(--h);background-image:radial-gradient(circle at 85% 20%,rgba(255,255,255,.22),transparent 55%)}
.ctile__num{
  font-size:clamp(1.9rem,3vw,2.4rem);
  font-weight:700;
  letter-spacing:-.035em;
  line-height:1;
  color:var(--lime)}
.ctile__lbl{color:rgba(255,255,255,.9)}
.ctile__more{border-top-color:rgba(255,255,255,.28);color:rgba(255,255,255,.85)}
.hue-sun .ctile__num,.hue-lime .ctile__num,.hue-sun .ctile__more b,.hue-lime .ctile__more b{color:var(--ink)}
.hue-sun .ctile__lbl{color:rgba(15,22,38,.78)}
.hue-lime .ctile__lbl{color:rgba(15,22,38,.78)}
.hue-sun .ctile__more{color:rgba(15,22,38,.78);border-top-color:rgba(15,22,38,.18)}
.hue-lime .ctile__more{color:rgba(15,22,38,.78)}
.hue-lime .ctile__more{border-top-color:rgba(15,22,38,.18)}
.ctile__chips span{background:var(--bg2)}
.ctile__title a:hover{text-decoration-color:var(--blue)}
.ctile__go{color:var(--blue)}
.ctile--cta{background:var(--lime);border-color:var(--lime)}
.ctile--cta .ctile__go{color:var(--ink)}
/* How we do it, and what it does for the business: coloured icon tiles */
.craft__step{border-color:var(--line);box-shadow:var(--sh);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.impact__card{border-color:var(--line);box-shadow:var(--sh);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.craft__step:hover,.impact__card:hover{transform:translateY(-3px);box-shadow:var(--sh-hover)}
.craft__step .ico,.impact__card .ico{width:48px;height:48px}
.craft__n{color:var(--h)}
.craft__sketch{border-color:var(--line)}
/* The yes form keeps the dark call-to-action, with the original colour glow */
/* Team cards: the original round avatar, with the email button kept */
.people{gap:1.2rem}
.person{padding:1.8rem;gap:.3rem;align-items:flex-start;border-radius:var(--r-lg);box-shadow:var(--sh);border:1px solid var(--line);overflow:visible}
.person__photo{width:88px;height:88px;aspect-ratio:auto;border-radius:50%;background:linear-gradient(160deg,var(--h),var(--ink2) 150%);color:#fff;font-size:1.9rem;margin-bottom:1rem;box-shadow:0 0 0 4px #fff,0 0 0 5px var(--line)}
.person__body{padding:0;width:100%}
.person__tag{background:none;padding:0;border-radius:0;color:var(--h);font-size:.78rem;letter-spacing:.08em}
.person__btn:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.person__btn:focus-visible{background:var(--blue);border-color:var(--blue);color:#fff}
.person__btn--icon{background:#0A66C2;border-color:#0A66C2;color:#fff}
.person__btn--icon:hover{background:#004182;border-color:#004182}
@media (max-width:640px){.person{display:flex;padding:1.3rem}.person__photo{width:64px;height:64px;font-size:1.35rem}}
/* Where we work: a white card, readable */
.wmap__card[data-card="world"]{background:#fff;color:var(--ink);border-color:var(--line)}
.wmap__card[data-card="world"] .eyebrow{color:var(--muted)}
.wmap__card[data-card="world"] .wmap__name{color:var(--ink)}
.wmap__text{color:var(--ink2)}
.wmap__facts>div{background:var(--bg2);border-color:transparent}
.wmap__facts b{color:var(--ink)}
.wmap__facts span{color:var(--muted)}
.wmap__langs{color:var(--ink)}
.wmap__card[data-card="world"] .wmap__hint{color:var(--muted)}
.wmap__wins .ic{color:var(--mint)}
/* Pop-in: the offer's colour on top */
.popin__top{background:var(--t,var(--t-lime));color:var(--ink)}
.popin__x{background:rgba(15,22,38,.08);color:var(--ink)}
.popin__x:hover{background:rgba(15,22,38,.16)}
.popin__badge{background:#fff;color:var(--h,var(--ink))}
.popin__disc{color:var(--ink)}
.popin.hue-lime .popin__disc{color:var(--ink)}
.popin h2{color:var(--ink)}
.popin__list .ic{color:var(--mint)}
/* Any icon without a colour class falls back to blue, so nothing renders blank. */
:root{--h:var(--blue);--t:var(--t-blue)}
/* Services hub cards: the service's own colour on the icon, the hover edge and the ticks. */
.scard{border-color:var(--line);box-shadow:var(--sh)}
.scard:hover{border-color:var(--h)}
.scard li .ic{color:var(--h)}
.scard__go{color:var(--h)}
.scard .ico{width:48px;height:48px}

/* ==== Home hero, refined (2026-10-25) ====
   Same orbit design, cleaner layers: the rings that carry icons hold still and
   the icons float gently, so the three chips sit in fixed gaps and never cover
   an icon. The dotted inner ring keeps turning. */
.hero h1{text-wrap:wrap;max-width:13ch}
.hero .lede{margin:1.4rem 0 1.8rem}
.orbit__ring:not(.orbit__ring--3){animation:none}
.orbit__node .ico{animation:orbitFloat 6s ease-in-out infinite}
.orbit__node:nth-child(2n) .ico{animation-delay:-2s}
.orbit__node:nth-child(3n) .ico{animation-delay:-4s}
@keyframes orbitFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.hero__vis .chip{left:auto;right:auto;top:auto;bottom:auto;transform:none;z-index:4;white-space:nowrap}
.hero__vis .chip--a{top:1%;right:2%}
.hero__vis .chip--b{bottom:-3%;left:50%;transform:translateX(-50%)}
.hero__vis .chip--c{top:30%;left:-4%}
/* Trust row under the buttons: one tidy line, no floating pills */
.hero__badges{gap:.5rem 1.4rem;margin-top:1.8rem}
.hero__badges .badge{padding:0;background:none;border:0;box-shadow:none;font-size:.9rem;color:var(--ink2)}
.hero__badges .badge .ico{width:26px;height:26px}
/* Secondary button: the same chip language as the primary */
.btn--white .ico{background:var(--t-blue);color:var(--blue)}
/* Softer, layered light, and a fade into the next band */
.hero .blob--1{opacity:.32}
.hero .blob--2{opacity:.22;bottom:0;left:-10%}
.hero .blob--3{opacity:.32;top:46%;left:30%}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:140px;background:linear-gradient(to bottom,rgba(242,240,232,0),var(--bg2));z-index:1;pointer-events:none}
@media (prefers-reduced-motion:reduce){.orbit__node .ico{animation:none}}
/* Team cards: the full email address on its own line, never cut off. */
.person__mail{display:block;margin-top:.7rem;font-size:.88rem;font-weight:600;color:var(--blue);overflow-wrap:anywhere}
.person__mail:hover{text-decoration:underline}
.person__links{padding-top:.8rem}
.person__btn{flex:0 1 auto}

/* ==== Pricing, easy to read (2026-10-25) ==== */
/* Tier cards */
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:.9rem;margin-top:.4rem}
.tier-card{display:flex;flex-direction:column;gap:.55rem;padding:1.3rem 1.3rem 1.2rem;border-radius:var(--r-sm);background:#fff;border:1px solid var(--line);box-shadow:var(--sh);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.tier-card:hover{transform:translateY(-3px);box-shadow:var(--sh-hover)}
.tier-card__name{font-weight:700;font-size:1.05rem;color:var(--h,var(--ink))}
.tier-card__for{margin:0;font-size:.9rem;color:var(--ink2);line-height:1.4;min-height:2.5em}
.tier-card__facts{list-style:none;margin:.3rem 0 0;padding:.7rem 0 0;border-top:1px solid var(--line);display:grid;gap:.45rem}
.tier-card__facts li{display:flex;justify-content:space-between;gap:.8rem;font-size:.86rem;line-height:1.35}
.tier-card__facts li span{color:var(--muted)}
.tier-card__facts li b{text-align:right;font-weight:700}
.tier-card__facts li.is-no b{color:var(--muted);font-weight:500}
.tier-card__terms{margin:auto 0 0;padding-top:.7rem;border-top:1px dashed var(--line2);display:grid;gap:.15rem;font-size:.8rem;color:var(--muted)}
.fam__compare{margin-top:1rem;border-radius:var(--r-sm);background:#fff;border:1px solid var(--line)}
.fam__compare summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:52px;padding:.5rem .6rem .5rem 1.2rem;font-weight:700;cursor:pointer}
.fam__compare summary::-webkit-details-marker{display:none}
.fam__compare summary .ico{background:var(--bg2);transition:transform .2s ease-out}
.fam__compare[open] summary .ico{transform:rotate(45deg)}
.fam__compare[open]{padding-bottom:1rem}
.fam__compare .ptable,.fam__compare .fam__sub{margin-left:1rem;margin-right:1rem}
@media (max-width:640px){.tiers{grid-template-columns:1fr}.tier-card__for{min-height:0}}
/* Hero chips measured against the orbit itself: the visual is exactly the orbit's size. */
.hero__vis{width:min(100%,560px);margin-left:auto}
.hero__vis .orbit{width:100%;margin:0}
.hero__vis .chip--a{top:5%;right:3%;left:auto;bottom:auto;transform:none}
.hero__vis .chip--b{top:97%;left:50%;right:auto;bottom:auto;transform:translateX(-50%)}
.hero__vis .chip--c{top:40%;left:-12%;right:auto;bottom:auto;transform:none}
/* Offers band head: label above, heading and link on one line */
.hoff__head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end}
.hoff__head .kicker{grid-column:1/-1;justify-self:start}
/* Hero visual v3: the orbit sits inside a square with room at the corners; the
   icon ring is turned half a step so the corners are free for the chips. */
.hero__vis{width:min(100%,580px);padding:10%;box-sizing:border-box}
.hero__vis .chip--a{top:0;right:0;left:auto;bottom:auto;transform:none}
.hero__vis .chip--b{bottom:0;left:0;top:auto;right:auto;transform:none}
.hero__vis .chip--c{bottom:0;right:0;top:auto;left:auto;transform:none}

/* ==== Articles (2026-10-25): key takeaways and a balanced cover ==== */
.takeaways{margin:0 0 2rem;padding:1.3rem 1.5rem;border-radius:var(--r-sm);background:var(--t-blue);border:1px solid rgba(45,91,255,.18)}
.takeaways__k{display:flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue);margin-bottom:.6rem}
.takeaways__k::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--blue)}
.prose .takeaways ul{margin:0;padding-left:1.1rem;display:grid;gap:.4rem}
.prose .takeaways li{margin:0;color:var(--ink);font-weight:500}
.phero__vis img.cover{width:100%;height:auto;max-height:440px;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--sh-hover)}
.prose h3{margin-top:1.6rem}
/* Page FAQ block */
.pfaq__in{align-items:start;gap:clamp(1.6rem,4vw,3.5rem)}
.pfaq__intro h2{margin:.2rem 0 .8rem}
.pfaq__intro .lede{margin-bottom:1.4rem}
@media (min-width:861px){.pfaq__intro{position:sticky;top:120px}}

/* ==== About, in the original colours (2026-10-25) ==== */
.facts--tint .fact{background:var(--t);border:1px solid transparent;border-radius:var(--r-sm);box-shadow:none}
.facts--tint .fact b{color:var(--h);font-size:clamp(2rem,3.4vw,2.8rem);letter-spacing:-.04em;line-height:1}
.facts--tint .fact span{color:var(--ink2);font-size:.88rem}
.pillar{background:var(--t);border-color:transparent;box-shadow:none;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.pillar:hover{transform:translateY(-4px);box-shadow:var(--sh-hover)}
.pillar__key{color:var(--h)}
.pillar__t{border-top-color:rgba(15,22,38,.12);color:var(--ink2)}
.pillar__list .ic{color:var(--h)}
.sec--blue .add{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);box-shadow:none}
.sec--blue .add .ico{background:#fff;color:var(--blue)}
.sec--blue .add h3{color:#fff}
.sec--blue .add p{color:rgba(255,255,255,.82)}
.sec--blue .kicker .ico{background:rgba(255,255,255,.2);color:#fff}
/* Hero sized to its content (no tall empty band above the headline on big screens). */
.hero{min-height:0;padding:clamp(3rem,6vw,5.5rem) 0 clamp(3.5rem,6vw,5.5rem)}
.hero__vis .chip--a{top:-3%}
.hero__vis .chip--b{bottom:-3%}
.hero__vis .chip--c{bottom:-3%}

/* ==== Where we work, refined (2026-10-25) ==== */
/* Both bases look the same: an ink pill with a lime dot, set beside the station. */
.wmap__pin{display:inline-flex;align-items:center;gap:.4rem;padding:.42rem .7rem .42rem .5rem;background:var(--ink);color:#fff;border:0;z-index:3}
.wmap__pin::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(198,241,53,.25)}
.wmap__pin--base{background:var(--ink);color:#fff;transform:translate(14%,-175%)}
.wmap__pin--hq{transform:translate(-50%,75%)}
/* Region labels: white pills with a dot in the region's colour */
.wmap__label{display:inline-flex;align-items:center;gap:.35rem;padding:.38rem .62rem .38rem .45rem;background:#fff;border:1px solid var(--line);z-index:2}
.wmap__label::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--h)}
/* Calmer routes, brighter on the active region */
.wmap__route{opacity:.18}
/* Legend that matches the map: bases, the five region colours, the rest of the world */
.wmap__k--focus{width:34px;border-radius:999px;background:linear-gradient(90deg,#7FA800 0 20%,var(--blue) 20% 40%,var(--violet) 40% 60%,var(--coral) 60% 80%,var(--mint) 80%)}
.wmap__legend{bottom:1rem;left:1.2rem}
.wmap__legend span{background:rgba(255,255,255,.85);padding:.3rem .6rem;border-radius:999px;border:1px solid var(--line)}
@media (max-width:640px){.wmap__legend span{background:none;border:0;padding:0}}
.hero h1{max-width:12ch}
/* Hiring band: readable label, the original dark panel with a colour glow. */
/* Mega menu side panels: buttons fit the panel and wrap instead of spilling out. */
.mega__side{min-width:0;overflow:hidden}
.mega__side .btn{width:100%;max-width:100%;min-height:44px;justify-content:space-between;white-space:normal;text-align:left;line-height:1.25;font-size:.84rem;overflow:visible;text-overflow:clip}
.mega__sales .btn{width:100%;max-width:100%;min-height:44px;justify-content:space-between;white-space:normal;text-align:left;line-height:1.25;font-size:.84rem;overflow:visible;text-overflow:clip}
.mega__sales .btn{overflow-wrap:anywhere}
.mega__side .btn .ico{flex:none}
/* About story: lighter lead, the founders beside the heading. Cursor dot off. */
.story__text .story__lead{font-weight:500;color:var(--ink)}
.story__people{display:flex;align-items:center;gap:.9rem;margin-top:1.6rem;font-size:.92rem;color:var(--muted);line-height:1.4}
.story__people b{color:var(--ink)}
.story__faces{display:flex}
.story__face{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;margin-left:-10px;background:linear-gradient(160deg,var(--h),var(--ink2) 150%);color:#fff;font-weight:700;font-size:.9rem;box-shadow:0 0 0 3px var(--bg)}
.story__face:first-child{margin-left:0}
.cursor{display:none!important}

/* ==== Case tiles aligned (2026-10-25) ====
   Equal-height rows, the top band a fixed height, chips on one line, the
   footer of every card on the same baseline. On home the audit card spans two
   columns so the grid has no gap. */
.ctiles{grid-auto-rows:1fr;align-items:stretch}
.ctile__top{min-height:200px}
.ctile__body{gap:.7rem}
.ctile__chips{flex-wrap:nowrap;overflow:hidden;gap:.3rem}
.ctile__chips span{white-space:nowrap;flex:none}
.ctile__more-svc{display:inline-flex;align-items:center;padding:.3rem .55rem;border-radius:999px;background:var(--t-blue);color:var(--blue);font-size:.78rem;font-weight:700;flex:none!important;width:auto}
.ctile__end{margin-top:auto}
.ctile__go{margin-top:.6rem;padding-top:.9rem;border-top:1px solid var(--line)}

.ctiles .ctile--cta{grid-column:span 2}.ctiles .ctile--cta:nth-child(3){grid-column:1/-1}
.ctile--cta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto 1fr auto;column-gap:2rem;padding:clamp(1.5rem,3vw,2.2rem)}
.ctile--cta .ctile__num{grid-column:1;font-size:clamp(2rem,3.2vw,2.6rem)}
.ctile--cta .ctile__lbl{grid-column:1}
.ctile--cta .ctile__title{grid-column:1;margin-top:1.2rem}
.ctile--cta p{grid-column:1}
.ctile--cta .ctile__ticks{grid-column:2;grid-row:1/5;align-self:center;list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.ctile--cta .ctile__ticks li{display:flex;gap:.6rem;align-items:flex-start;padding:.8rem 1rem;border-radius:14px;background:rgba(255,255,255,.55);font-weight:600;line-height:1.35}
.ctile--cta .ctile__ticks .ic{width:18px;height:18px;flex:none;margin-top:.1rem}
.ctile--cta .ctile__go{grid-column:1;border-top-color:rgba(15,22,38,.15)}
@media (max-width:900px){.ctiles{grid-auto-rows:auto}.ctiles .ctile--cta{grid-column:auto}.ctile--cta{grid-template-columns:1fr}.ctile--cta .ctile__ticks{grid-column:1;grid-row:auto;margin:1rem 0}}
.ctile__go{display:flex;width:100%}
.ctile__chips{flex-wrap:wrap;overflow:visible}
.ctile--cta{grid-template-rows:auto auto auto 1fr auto}
.ctile--cta p{align-self:start;margin-top:.5rem}
.ctile--cta .ctile__ticks{grid-row:1/6}


/* ==== Pricing hero (2026-10-26): entry prices up front ==== */
.prhero{position:relative;overflow:hidden;padding:clamp(1.6rem,4vw,3rem) 0 clamp(3rem,6vw,5rem)}
.prhero__in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.prhero h1{font-size:clamp(2.6rem,5.4vw,5rem);max-width:12ch;margin:.6rem 0 1.1rem}
.prhero .lede{max-width:42ch;margin-bottom:1.8rem}
@media (max-width:960px){.prhero__in{grid-template-columns:1fr}}
/* The in-page menu stays in reach while reading the long page. */
/* Six bundles: two even rows of three. */


/* ==== Case pages, richer (2026-10-26) ==== */
.cs-figs .cs-figs__lead{background:linear-gradient(150deg,var(--h),var(--ink2) 160%);color:#fff;border-color:transparent}
.cs-figs .cs-figs__lead b{color:#fff}
.cs-figs .cs-figs__lead span{color:rgba(255,255,255,.85)}
.cs-svcs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin-top:1.4rem}
.cs-svc{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.4rem 1rem;align-items:start;padding:1.3rem 1.4rem;border-radius:var(--r);background:var(--t);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.cs-svc:hover{transform:translateY(-3px);box-shadow:var(--sh-hover)}
.cs-svc .ico{width:48px;height:48px;grid-row:1/3}
.cs-svc__b b{display:block;font-size:1.1rem;letter-spacing:-.01em}
.cs-svc__b span{display:block;margin-top:.25rem;font-size:.92rem;color:var(--ink2);line-height:1.45}
.cs-svc__go{grid-column:2;display:inline-flex;align-items:center;gap:.35rem;margin-top:.4rem;font-weight:700;font-size:.88rem;color:var(--h)}
.cs-svc__go .ic{width:16px;height:16px}
.cs-fit{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr) auto;gap:1.5rem 2.5rem;align-items:center;padding:clamp(1.6rem,3vw,2.4rem);border-radius:var(--r-lg);background:var(--t)}
.cs-fit .cs-h2{margin:.4rem 0 0}
.cs-fit__list{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.cs-fit__list li{display:flex;gap:.6rem;align-items:flex-start;font-weight:600;line-height:1.4}
.cs-fit__list .ic{width:20px;height:20px;flex:none;margin-top:.1rem;color:var(--h)}
@media (max-width:1000px){.cs-fit{grid-template-columns:1fr}}
/* Start page: the bundle icons were greyed by the card's muted text colour. */
.pkg-pick .pk .ico.solid{color:#fff;font-size:inherit}
.pkg-pick .hue-lime .pk .ico.solid,.pkg-pick .hue-sun .pk .ico.solid{color:var(--ink)}
/* Our work strip: each headline number in its case colour */
.wstrip b{color:var(--h,var(--ink))}


/* ==== Pricing hero v2 (2026-10-28): the price list plus a quote form ==== */
.prhero h1{max-width:14ch}
.prhero .lede{max-width:40ch;margin-bottom:1.4rem}
.prquote{display:grid;gap:.6rem;padding:1.2rem;border-radius:var(--r);background:#fff;border:1px solid var(--line);box-shadow:var(--sh);max-width:560px}
.prquote__k{margin:0;font-weight:700;font-size:.95rem}
.prquote__row{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.prquote input,.prquote select{width:100%;min-height:50px;padding:.7rem 1rem;border-radius:12px;border:1.5px solid var(--line2);background:#fff;font:inherit;font-size:1rem;color:var(--ink);box-sizing:border-box}
.prquote input:focus,.prquote select:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 4px rgba(45,91,255,.15)}
.prquote .btn{justify-content:space-between;min-height:50px}
.prquote__fine{display:flex;align-items:center;gap:.4rem;margin:0;font-size:.82rem;color:var(--muted)}
.prquote__fine .ic{width:15px;height:15px;color:var(--mint);flex:none}
@media (max-width:640px){.prquote__row{grid-template-columns:1fr}}
/* Language switch: a single pill to the other language */
.langsw{display:inline-flex;align-items:center;gap:.35rem;min-height:36px;padding:.3rem .7rem;border-radius:999px;border:1px solid var(--line2);background:#fff;font-weight:700;font-size:.8rem;color:var(--ink)}
.langsw:hover{border-color:var(--ink)}
.langsw .ic{width:16px;height:16px}

/* Pricing, simplified (2026-10-28): how pricing works, one starting price per
   service, three ways to buy. */
.pzhow{position:relative;z-index:2;padding:1.5rem 1.5rem 1.1rem;border-radius:var(--r-lg);background:rgba(255,255,255,.9);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line);box-shadow:var(--sh)}
.pzhow h2{font-size:1.3rem;letter-spacing:-.02em;margin:0 0 1.1rem}
.pzhow ol{list-style:none;margin:0;padding:0;display:grid;gap:.3rem;position:relative}
.pzhow ol::before{content:"";position:absolute;left:23px;top:32px;bottom:32px;border-left:2px dashed var(--line2)}
.pzhow li{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1rem;padding:.7rem 0}
.pzhow li .ico--md{position:relative;width:48px;height:48px;background:#fff;box-shadow:inset 0 0 0 100px var(--t)}
.pzhow li b{display:block;font-size:1.05rem;letter-spacing:-.01em}
.pzhow li small{display:block;color:var(--muted);font-size:.9rem;line-height:1.4;margin-top:.1rem}
.pzhow li em{font-style:normal;font-weight:800;font-size:2rem;line-height:1;color:var(--h);opacity:.18;letter-spacing:-.04em}
.pzhow__foot{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:.8rem;padding:.85rem 1rem;border-radius:14px;background:var(--t-lime);font-weight:600;font-size:.95rem;transition:background .2s}
.pzhow__foot:hover{background:var(--lime)}
.pzhow__foot .ic{width:16px;height:16px;transition:transform .2s}
.pzhow__foot:hover .ic{transform:translateY(2px) rotate(90deg)}
.pzgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;border:0;margin:0;padding:0;min-width:0}
.pzcard{position:relative;display:flex;flex-direction:column;border-radius:var(--r);background:#fff;border:1.5px solid var(--line);transition:border-color .2s,box-shadow .2s,transform .2s}
.pzcard:hover{box-shadow:var(--sh);transform:translateY(-2px)}
.pzcard__pick{flex:1;display:flex;flex-direction:column;gap:.7rem;padding:1.3rem 1.3rem 1.1rem;cursor:pointer}
.pzcard__pick input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.pzcard__head{display:flex;align-items:center;gap:.8rem}
.pzcard__head .ico--md{width:46px;height:46px;flex:none}.pzcard__head .ico--md .ic{width:22px;height:22px}
.pzcard__head b{font-size:1.15rem;letter-spacing:-.02em;line-height:1.15}
.pzcard__tick{margin-left:auto;flex:none;width:28px;height:28px;border-radius:50%;border:2px solid var(--line2);display:grid;place-items:center;color:transparent;transition:background .2s,border-color .2s,color .2s}
.pzcard__tick .ic{width:14px;height:14px}
.pzcard__note{color:var(--muted);font-size:.9rem;line-height:1.45;text-wrap:pretty}
.pzcard__price{margin-top:auto;padding-top:.4rem;display:grid;gap:.1rem}
.pzcard__price small{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pzcard__price b{
  font-size:1.1rem;
  letter-spacing:-.01em;
  line-height:1.2;
  font-variant-numeric:tabular-nums}
.pzcard__more{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.8rem 1.3rem;border-top:1px solid var(--line);font-weight:600;font-size:.88rem;color:var(--h)}
.pzcard__more .ic{width:14px;height:14px;transition:transform .2s}
.pzcard__more:hover .ic{transform:translateX(3px)}
.pzcard:has(input:checked){border-color:var(--ink);box-shadow:var(--sh)}
.pzcard:has(input:checked) .pzcard__pick{background:var(--t);border-radius:calc(var(--r) - 2px) calc(var(--r) - 2px) 0 0}
.pzcard:has(input:checked) .pzcard__tick{background:var(--ink);border-color:var(--ink);color:#fff}
.pzcard:has(input:focus-visible){outline:3px solid var(--blue);outline-offset:3px}
.pzways{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.3fr);gap:1rem;align-items:stretch}
.pzway{display:flex;flex-direction:column;gap:.7rem;padding:1.6rem;border-radius:var(--r);background:#fff;border:1px solid var(--line)}
.pzway__tag{display:inline-flex;align-items:center;gap:.5rem;align-self:flex-start;font-weight:700;font-size:.85rem;color:var(--ink2)}
.pzway__tag .ico--sm{width:32px;height:32px}.pzway__tag .ico--sm .ic{width:16px;height:16px}
.pzway h3{font-size:clamp(1.3rem,2vw,1.6rem);letter-spacing:-.02em;margin:0}
.pzway p{margin:0;color:var(--ink2);line-height:1.5}
.pzway__pay{display:flex;gap:.6rem;align-items:flex-start;margin-top:auto!important;padding-top:.9rem;border-top:1px solid var(--line);font-weight:600;font-size:.92rem}
.pzway__pay .ic{width:20px;height:20px;flex:none;color:var(--h);margin-top:.1rem}
.pzway--bundle{background:var(--t);border-color:transparent}
.pzway__bundles{list-style:none;margin:.3rem 0 0;padding:0;display:grid;gap:.4rem}
.pzway__bundles a{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem .9rem;border-radius:12px;background:#fff;border:1px solid transparent;transition:border-color .2s,transform .2s}
.pzway__bundles a:hover{border-color:var(--line2);transform:translateX(2px)}
.pzway__bundles span{min-width:0;display:grid}
.pzway__bundles b{font-size:.95rem}
.pzway__bundles small{font-size:.78rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:1100px){.pzgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.pzways{grid-template-columns:1fr 1fr}.pzway--bundle{grid-column:1/-1}}
@media (max-width:640px){
  .pzhow{padding:1.2rem 1rem .9rem}
  .pzhow li em{display:none}
  .pzgrid{grid-template-columns:1fr;gap:.6rem}
  .pzcard__pick{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"ico name tick" "ico price tick";column-gap:.85rem;row-gap:.1rem;padding:.9rem 1rem;align-items:center}
  .pzcard__head{display:contents}
  .pzcard__head .ico--md{grid-area:ico;width:42px;height:42px}
  .pzcard__head b{grid-area:name;font-size:1.02rem}
  .pzcard__tick{grid-area:tick;margin:0}
  .pzcard__note{display:none}
  .pzcard__price{grid-area:price;margin:0;padding:0;display:flex;align-items:baseline;gap:.35rem}
  .pzcard__price small{font-size:12px}
  .pzcard__price b{font-size:1rem}
  .pzcard__more{padding:.6rem 1rem;font-size:.84rem}
  .pzways{grid-template-columns:1fr}
  .pzway{padding:1.25rem}
  .pzway__bundles small{display:none}
}
.pzways{grid-template-columns:repeat(2,minmax(0,1fr))}
.pzway--bundle{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.6fr);gap:1.2rem 2.5rem;align-items:start;padding:1.8rem}
.pzway__intro{display:flex;flex-direction:column;gap:.7rem}
.pzway__intro .link{margin-top:.3rem;font-weight:600}
.pzway--bundle .pzway__bundles{margin:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.pzway--bundle .pzway__bundles a{height:100%;padding:.8rem 1rem}
@media (max-width:900px){.pzway--bundle{grid-template-columns:1fr}}
@media (max-width:640px){.pzways{grid-template-columns:1fr}.pzway--bundle{padding:1.25rem}.pzway--bundle .pzway__bundles{grid-template-columns:1fr}}
