/* Bexxter: dark by default, light mode on request. Palette from the Bexxter scales: tinted orange, pizazz amber, blue bermuda greens, shark and chateau neutrals. Type: Schibsted Grotesk (regular) for headlines and text, Source Serif 4 (light) for statements. */
:root{--f:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;--serif:"Source Serif 4",Georgia,serif}
body{--paper:#121519;--panel:#1B1F25;--ink:#FFF7EC;--grey:#C8C8CA;--line:#2A3039;--band:#CC3F02;--soft:#FFEDD3;--hot:#FF730A;--acc:#FFA70A;--hole:#1B1F25;--map-base:#1F2A2C;color-scheme:dark}
body.light{--paper:#FFF7EC;--panel:#FFFFFF;--ink:#222831;--grey:#4E637B;--line:#FFEDD3;--band:#CC3F02;--soft:#FFEDD3;--hot:#E65100;--acc:#CC3F02;--hole:#FFEDD3;--map-base:#D9E9E2;color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f);font-weight:400;font-size:17px;line-height:1.55;transition:background .4s,color .4s}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--paper)}
a{color:inherit}
img{max-width:100%}
:focus-visible{outline:2px solid var(--hot);outline-offset:3px}
.wrap{max-width:1360px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
main{overflow-x:clip}

header{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--paper)}
.bar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:18px}
.logo{font-weight:500;font-size:20px;letter-spacing:.08em;text-decoration:none;display:flex;align-items:center;gap:10px}
.logo i{width:13px;height:15px;background:var(--hot);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);display:inline-block}
nav.main ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;font-size:15px;font-weight:400}
nav.main a{text-decoration:none}
nav.main a:hover,nav.main a[aria-current="page"]{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.right{display:flex;gap:14px;align-items:center}
.lang,.mode{font:400 14px var(--f)}
.lang{display:flex;gap:2px}
.lang button,.mode{border:0;background:none;cursor:pointer;padding:4px 6px;color:var(--grey);font:inherit}
.lang button[aria-pressed="true"]{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.mode:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 22px;font:400 15px/1 var(--f);text-decoration:none;cursor:pointer;border:1px solid currentColor;background:transparent;color:var(--ink);transition:background .2s,color .2s,border-color .2s}
.btn:hover{border-color:var(--hot);color:var(--hot)}
.btn.solid{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.solid:hover{background:var(--hot);border-color:var(--hot);color:#FFF7EC}

h1,h2,h3{font-weight:400;letter-spacing:-.03em;margin:0;text-wrap:balance}
.herozone{position:relative;isolation:isolate}
.herozone .band{position:absolute;inset:0 0 calc(-1 * var(--reach,620px)) 0;height:auto;margin:0;z-index:-1;-webkit-mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.15) 14%,rgba(0,0,0,.75) 38%,#000 55%,rgba(0,0,0,.55) 78%,rgba(0,0,0,.35) 100%);mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.15) 14%,rgba(0,0,0,.75) 38%,#000 55%,rgba(0,0,0,.55) 78%,rgba(0,0,0,.35) 100%)}
#mission{position:relative}
#ways{padding-top:clamp(200px,22vw,320px)}
#mission::before{content:"";position:absolute;inset:-6% -2%;background:radial-gradient(ellipse 75% 70% at 32% 50%,color-mix(in srgb,var(--paper) 92%,transparent) 0,color-mix(in srgb,var(--paper) 70%,transparent) 45%,transparent 80%);pointer-events:none}
#mission .mission>*{position:relative}
#mission .mission p{color:var(--ink)}
.hero{position:relative;text-align:center;padding-block:clamp(96px,14vw,180px) clamp(80px,10vw,140px)}
.hero::before{content:"";position:absolute;inset:8% 0 18%;z-index:-1;background:radial-gradient(ellipse 60% 55% at 50% 45%,var(--paper) 0,color-mix(in srgb,var(--paper) 70%,transparent) 45%,transparent 75%);pointer-events:none}
.hero h1{font-size:clamp(40px,8.4vw,136px);line-height:.95;letter-spacing:-.045em}
.hl{position:relative;display:inline-block;padding:0 .06em;margin:0 -.02em;z-index:0}
.hl::before{content:"";position:absolute;left:-.04em;right:-.06em;top:.2em;bottom:.04em;z-index:-1;background:#E65100;border-radius:.08em .22em .12em .3em;transform:rotate(-1.2deg) scaleX(0);transform-origin:left center;animation:hl .9s cubic-bezier(.6,.05,.25,1) .5s forwards}
@keyframes hl{to{transform:rotate(-1.2deg) scaleX(1)}}
.hero-foot{display:grid;grid-template-columns:1fr;justify-items:center;gap:28px;margin-top:40px}
.hero-foot p{margin:0 auto;font-size:20px;max-width:30em}
.hero-foot .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

.band{height:clamp(300px,36vw,520px);margin-block:40px -40px;position:relative}
.band canvas{position:absolute;inset:0;width:100%;height:100%;display:block}

section{padding-block:104px}
h2{font-size:clamp(34px,5vw,72px);line-height:1}
.head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:44px;flex-wrap:wrap}
.head p{margin:0;color:var(--grey);max-width:30em}
.lead{font-size:clamp(20px,2vw,24px);max-width:36em;margin:0}

/* mobile menu */
.menu-btn{display:none;position:relative;width:40px;height:40px;border:1px solid var(--line);background:none;cursor:pointer;padding:0}
.menu-btn span:not(.sr){position:absolute;left:11px;right:11px;height:1.5px;background:var(--ink);transition:transform .3s,top .3s}
.menu-btn span:nth-child(1){top:15px}.menu-btn span:nth-child(2){top:23px}
.menu-btn[aria-expanded="true"] span:nth-child(1){top:19px;transform:rotate(45deg)}
.menu-btn[aria-expanded="true"] span:nth-child(2){top:19px;transform:rotate(-45deg)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.mnav{position:fixed;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + 72px);bottom:0;z-index:20;background:var(--paper);padding:24px max(16px,env(safe-area-inset-right,0px)) 40px max(16px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:32px;overflow-y:auto}
.mnav[hidden]{display:none}
.mnav ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.mnav li a{display:block;padding:18px 0;border-bottom:1px solid var(--line);font-size:28px;text-decoration:none;letter-spacing:-.02em}
.mnav .btn{align-self:flex-start}
body.menu-open{overflow:hidden}

/* mission */
.mission{display:grid;grid-template-columns:1.3fr 1fr;gap:56px;align-items:end}
.mission h2{font-family:var(--serif);font-weight:300;letter-spacing:-.01em;font-size:clamp(32px,4.4vw,64px);line-height:1.08}
.mission p{margin:0;color:var(--grey);font-size:19px}

/* three ways as hex cells */
.ways{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.way{position:relative;padding:56px 36px 40px;min-width:0;background:var(--panel);clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px))}
.way .hx{width:46px;height:52px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);margin-bottom:28px}
.way:nth-child(1) .hx{background:#11907C}.way:nth-child(2) .hx{background:#FF730A}.way:nth-child(3) .hx{background:#FFA70A}
.way h3{font-size:30px;margin-bottom:12px}
.way p{margin:0;color:var(--grey)}
.partner{margin-top:36px;font-family:var(--serif);font-weight:300;font-size:clamp(22px,2.2vw,30px);line-height:1.3;max-width:34em}

/* disciplines */
.index{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.index li{display:grid;grid-template-columns:3ch 1.1fr 1.5fr;gap:24px;align-items:baseline;padding-block:24px;border-bottom:1px solid var(--line)}
.index .n{color:var(--hot);font-variant-numeric:tabular-nums}
.index h3{font-size:clamp(22px,2.6vw,34px);font-stretch:112%}
.index p{margin:0;color:var(--grey)}

/* five disciplines as hive cells: thin outline, faint gradient, light fill on hover */
.comb5{--w:clamp(260px,26vw,340px);--h:calc(var(--w)*1.1547);--g:10px;display:flex;flex-direction:column;align-items:center}
.crow{display:flex;gap:var(--g)}
.crow.off{margin-top:calc(var(--h)*-.25 + var(--g)*.866)}
.hcell{--hex:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);position:relative;width:var(--w);height:var(--h);clip-path:var(--hex);background:linear-gradient(160deg,var(--e1),var(--e2));outline:none}
.comb4{--w:clamp(200px,18.6vw,256px)}
.comb4 .crow{flex-wrap:wrap;justify-content:center}
.comb4 .hin{padding:0 15%;gap:8px}.comb4 .hin h3{font-size:clamp(18px,1.5vw,21px)}.comb4 .hin p{font-size:13.5px;line-height:1.4}
.hcell.muted{--e1:#2A3039!important;--e2:#2A3039!important;opacity:.75}
.hcell.muted h3{color:var(--grey)}
body.light .hcell.muted{--e1:#D4DBE3!important;--e2:#D4DBE3!important}
.people{margin:40px auto 0;max-width:40em;text-align:center;font-family:var(--serif);font-weight:300;font-size:clamp(19px,1.8vw,23px);color:var(--grey)}
.comb12{--w:clamp(200px,18.5vw,262px)}
.comb12 .crow{gap:var(--g)}
.comb12 .crow + .crow{margin-top:calc(var(--h)*-.25 + var(--g)*.866)}
.comb12 .crow{transform:translateX(calc((var(--w) + var(--g))/-4))}
.comb12 .crow.off{transform:translateX(calc((var(--w) + var(--g))/4))}
.comb12 .hin{padding:0 15%}
.comb12 .hin h3{font-size:clamp(18px,1.6vw,22px)}
.comb12 .hin p{font-size:14px}
.hcell:nth-child(1){--e1:#135C52;--e2:#2A3039}.hcell:nth-child(2){--e1:#2A3039;--e2:#127364}.hcell:nth-child(3){--e1:#127364;--e2:#6B4A2A}
.crow.off .hcell:nth-child(1){--e1:#5A3A22;--e2:#135C52}.crow.off .hcell:nth-child(2){--e1:#154C45;--e2:#7A4A1E}
body.light .hcell{--e1:#9CF3DC!important;--e2:#FFD8A5!important}
.hcell::before{content:"";position:absolute;inset:1.5px;clip-path:var(--hex);background:var(--paper);transition:background .35s ease}
.hcell:hover::before,.hcell:focus-visible::before{background:color-mix(in srgb,var(--paper) 92%,#FF730A)}
.hcell:hover,.hcell:focus-visible{background:linear-gradient(160deg,#FF730A,#FFA70A)}
.hin{position:relative;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0 16%;gap:10px}
.hin .n{color:var(--hot);font-size:14px;font-variant-numeric:tabular-nums}
.hin h3{font-size:clamp(20px,1.9vw,26px);line-height:1.1}
.hin p{margin:0;color:var(--grey);font-size:15px;line-height:1.45}
@media (max-width:900px){.comb4 .crow,.comb4 .crow.off,.comb12 .crow,.comb12 .crow.off{transform:none}.comb12 .crow+.crow{margin-top:calc(var(--h)*-.12)}.comb5{--w:min(280px,72vw)}.crow{flex-direction:column;gap:0}.crow.off{margin-top:0}.crow .hcell:nth-child(n){margin-top:calc(var(--h)*-.12)}.crow:first-child .hcell:first-child{margin-top:0}.crow .hcell:nth-child(odd){transform:translateX(-11%)}.crow .hcell:nth-child(even){transform:translateX(11%)}.crow.off .hcell:nth-child(1){transform:translateX(11%)}.crow.off .hcell:nth-child(2){transform:translateX(-11%)}}

/* offers */
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--ink)}
.offer{padding:28px 28px 32px 0;border-bottom:1px solid var(--line);min-width:0}
.offer:not(:nth-child(3n+1)){padding-left:28px;border-left:1px solid var(--line)}
.oi{--hex:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);position:relative;display:grid;place-items:center;width:52px;height:60px;margin-bottom:18px;clip-path:var(--hex);background:linear-gradient(160deg,#135C52,#6B4A2A);transition:background .3s}
.oi::before{content:"";position:absolute;inset:1.5px;clip-path:var(--hex);background:var(--paper);transition:background .3s}
body.light .oi{background:linear-gradient(160deg,#9CF3DC,#FFD8A5)}
.oi svg{position:relative;width:24px;height:24px;fill:none;stroke:var(--hot);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.offer:hover .oi{background:linear-gradient(160deg,#FF730A,#FFA70A)}
.offer:hover .oi::before{background:color-mix(in srgb,var(--paper) 92%,#FF730A)}
.offer h3{font-size:22px;margin-bottom:8px}
.offer p{margin:0;color:var(--grey);font-size:16px}
.note{margin-top:24px;color:var(--grey);font-size:15px}

/* process: pinned while you scroll, the three steps light up in turn */
.process{padding:0;height:260vh;position:relative}
.pstick{position:sticky;top:0;height:100vh;display:flex;align-items:center}
.pstick .wrap{width:100%;position:relative}
.psteps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;position:relative}
.ptrack{position:absolute;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));top:calc(48px);height:1px;background:var(--line)}
.pfill{position:absolute;inset:0 auto 0 0;width:calc(var(--p,0)*100%);background:linear-gradient(90deg,#11907C,#FF730A,#FFA70A)}
.pstep{opacity:.28;transform:translateY(18px);transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1)}
.pstep.on{opacity:1;transform:none}
.phx{--hex:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);position:relative;display:grid;place-items:center;width:84px;height:97px;clip-path:var(--hex);background:var(--line);font-family:var(--serif);font-weight:300;font-size:34px;color:var(--ink);margin-bottom:28px;transition:background .5s}
.phx::before{content:"";position:absolute;inset:1.5px;clip-path:var(--hex);background:var(--paper);z-index:-1}
.phx{isolation:isolate}
.pstep.on .phx{background:linear-gradient(160deg,#FF730A,#FFA70A)}
.pstep h3{font-size:clamp(34px,4.4vw,64px);line-height:1;margin-bottom:14px}
.pstep p{margin:0;font-family:var(--serif);font-weight:300;font-size:clamp(19px,1.8vw,24px);color:var(--grey);max-width:16em}
@media (max-width:900px){.process{height:auto}.pstick{position:static;height:auto;padding-block:80px}.psteps{grid-template-columns:1fr;gap:48px}.ptrack{display:none}.pstep{opacity:1;transform:none}.pstep .phx{background:linear-gradient(160deg,#FF730A,#FFA70A)}}
@media (prefers-reduced-motion:reduce){.process{height:auto}.pstick{position:static;height:auto;padding-block:104px}.pstep{opacity:1;transform:none}.pfill{width:100%}}

/* work */
.tiles{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.tile{position:relative;min-width:0;text-decoration:none}
.tile .img{position:relative;overflow:hidden;max-width:100%}
.tile:nth-child(1){grid-column:span 7}.tile:nth-child(1) .img{aspect-ratio:7/5}
.tile:nth-child(2){grid-column:span 5}.tile:nth-child(2) .img{aspect-ratio:1}
.tile:nth-child(3){grid-column:span 5}.tile:nth-child(3) .img{aspect-ratio:1}
.tile:nth-child(4){grid-column:span 7}.tile:nth-child(4) .img{aspect-ratio:7/5}
.tile svg{position:absolute;inset:0;width:100%;height:100%;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.tile:hover svg{transform:scale(1.04)}
.tile .meta{display:flex;justify-content:space-between;gap:16px;padding-top:12px;font-size:15px}
.tile .meta b{font-weight:400}
.tile .meta span{color:var(--grey)}
.ph{position:absolute;left:12px;top:12px;font-size:12px;background:var(--paper);padding:3px 8px;color:var(--grey);z-index:1}

/* work: equal tiles, image under a gradient in the page colour, revealed on hover */
.works{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.wk{position:relative;margin:0;aspect-ratio:4/5;overflow:hidden;background:var(--panel);outline:none;min-width:0}
.wk img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.6) brightness(.8);transform:scale(1.02);transition:filter .5s,transform .8s cubic-bezier(.2,.8,.2,1)}
.wk::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--paper) 8%,color-mix(in srgb,var(--paper) 78%,transparent) 50%,color-mix(in srgb,var(--paper) 45%,transparent));transition:opacity .5s}
.wk figcaption{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:70px 18px 18px;display:flex;flex-direction:column;gap:6px;background:linear-gradient(to top,color-mix(in srgb,var(--paper) 96%,transparent) 0,color-mix(in srgb,var(--paper) 85%,transparent) 45%,transparent)}
.wk b{font-weight:400;font-size:18px;line-height:1.2;color:var(--ink)}
.wk .wd{font-size:12px;color:var(--hot);letter-spacing:.02em}
.wk .wc{font-size:13px;color:var(--grey)}
.wk:hover::after,.wk:focus-visible::after{opacity:0}
.wk:hover img,.wk:focus-visible img{filter:none;transform:scale(1.06)}
.wk:focus-visible{box-shadow:inset 0 0 0 2px var(--hot)}
.live{margin-top:40px;display:grid;grid-template-columns:auto 1fr;gap:16px 32px;align-items:baseline;border-top:1px solid var(--line);padding-top:24px}
.live h3{font-size:16px;color:var(--grey)}
.live ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.live a{display:inline-flex;gap:10px;align-items:baseline;border:1px solid var(--line);padding:10px 16px;text-decoration:none;transition:border-color .2s,color .2s}
.live a:hover{border-color:var(--hot);color:var(--hot)}
.live a span{font-size:13px;color:var(--grey)}
@media (max-width:620px){.live{grid-template-columns:1fr}}
.wcta{display:flex;justify-content:center;margin-top:48px}
@media (max-width:1100px){.works{grid-template-columns:repeat(2,1fr)}.wk{aspect-ratio:4/3}}
@media (max-width:560px){.works{grid-template-columns:1fr}}

/* global teaser */
.global{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.global canvas{width:100%;aspect-ratio:2/1;display:block}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:28px 0 32px}
.facts b{display:block;font-family:var(--serif);font-weight:300;font-size:52px;line-height:1;color:var(--hot)}
.facts span{color:var(--grey);font-size:14px}

/* founder */
.founder{display:grid;grid-template-columns:5fr 7fr;gap:56px;align-items:center}
.founder img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%;display:block}
.founder h2{margin-bottom:24px}
.founder p{font-family:var(--serif);font-weight:300}
.founder p{font-size:19px;max-width:32em;margin:0 0 28px}

/* brief */
.brief{background:var(--band);color:#FFF7EC}
.brief .wrap{padding-block:96px;display:grid;grid-template-columns:1fr 1.2fr;gap:56px}
.brief h2{color:#FFF7EC;font-size:clamp(44px,7vw,112px)}
.brief p{color:#FFEDD3;margin:16px 0 0;font-size:19px;max-width:26em}
.brief .mail{font-size:15px;margin-top:20px}
.brief .mail strong{font-weight:400;user-select:all}
form.f{display:grid;grid-template-columns:1fr 1fr;gap:14px}
form.f label{display:grid;gap:6px;font-size:14px;color:#FFEDD3;min-width:0}
form.f .full{grid-column:1/-1}
form.f input,form.f select,form.f textarea{font:400 16px var(--f);color:#222831;background:#FFF7EC;border:1px solid transparent;padding:12px 14px;width:100%}
form.f textarea{min-height:110px;resize:vertical}
form.f input:focus,form.f select:focus,form.f textarea:focus{outline:2px solid #222831;outline-offset:0}
.chips{display:flex;flex-wrap:wrap;gap:8px;grid-column:1/-1}
.chips label{position:relative;display:inline-flex!important;cursor:pointer;border:1px solid #FFEDD3;padding:7px 13px;color:#FFF7EC!important;font-size:14px}
.chips input{position:absolute;opacity:0;width:1px;height:1px;left:0;top:0}
.chips label:has(input:checked){background:#FFF7EC;color:#A1310B!important}
.chips label:has(input:focus-visible){outline:2px solid #FFF7EC;outline-offset:2px}
fieldset{border:0;margin:0;padding:0;grid-column:1/-1;display:grid;gap:8px}
legend{font-size:14px;color:#FFEDD3;padding:0;margin-bottom:8px}
.sendbtn{background:#FFF7EC;color:#A1310B;border-color:#FFF7EC}
.sendbtn:hover{background:#222831;color:#FFF7EC;border-color:#222831}
.sent{grid-column:1/-1;background:#FFF7EC;color:#A1310B;padding:12px 16px;margin:0}
.ferr{grid-column:1/-1;background:#3A1A12;color:#FFD9C7;padding:12px 16px;margin:0}
form[data-form]{position:relative}
form[data-form] button:disabled{opacity:.6;cursor:wait}

footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-block:28px 40px;font-size:14px;color:var(--grey)}

/* puzzle: two pieces slide together as you scroll and click into place */
.puzzle{display:block;width:min(300px,80%);height:auto;margin:0;overflow:visible}
.two.pzrow{grid-template-rows:auto auto auto;row-gap:0;column-gap:56px}
.pzrow>div{display:grid;grid-template-rows:subgrid;grid-row:span 3;align-content:start}
.pzrow>div>p{margin-bottom:28px!important}
.puzzle path{stroke-width:1.5;stroke-linejoin:round;transition:fill .4s,stroke .4s}
.puzzle .pa path{fill:color-mix(in srgb,var(--paper) 80%,#127364);stroke:#11907C}
.puzzle .pb path{fill:color-mix(in srgb,var(--paper) 80%,#FF730A);stroke:#FF730A}
.puzzle.snap .pa path{fill:color-mix(in srgb,var(--paper) 55%,#127364)}
.puzzle.snap .pb path{fill:color-mix(in srgb,var(--paper) 55%,#FF730A)}
.puzzle.snap{animation:snap .35s cubic-bezier(.3,1.6,.5,1)}
@keyframes snap{40%{transform:scale(1.04)}100%{transform:none}}

/* clients page */
.privacy h1{font-size:clamp(36px,6vw,96px);line-height:.98;max-width:14em}
.privacy p{font-family:var(--serif);font-weight:300;margin:28px 0 0;max-width:36em;font-size:20px;color:var(--grey)}
.mapwrap{position:relative}
.mapwrap canvas{width:100%;display:block;aspect-ratio:2.3/1;touch-action:pan-y}
.tip{position:absolute;pointer-events:none;background:var(--panel);color:var(--ink);border:1px solid var(--line);padding:8px 12px;font-size:14px;white-space:nowrap;transform:translate(-50%,-120%)}
.legend{display:flex;gap:24px;flex-wrap:wrap;margin-top:18px;font-size:14px;color:var(--grey)}
.legend i{display:inline-block;width:12px;height:14px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);margin-right:8px;vertical-align:-2px}
.lists{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:40px}
.lists h3{font-size:20px;margin-bottom:10px}
.lists p{margin:0;color:var(--grey)}
.hivebox{display:grid;grid-template-columns:1.6fr 1fr;gap:28px;align-items:stretch}
.hivebox canvas{width:100%;height:520px;display:block;background:var(--panel);touch-action:none;cursor:grab}
.hivebox canvas:active{cursor:grabbing}
.blurb{background:var(--panel);padding:32px;min-width:0;display:flex;flex-direction:column;gap:14px}
.blurb h3{font-size:30px}
.blurb p{font-family:var(--serif);font-weight:300;font-size:19px}
.blurb p{margin:0;color:var(--grey)}
.blurb .hint{font-size:14px;margin-top:auto}
.icp-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.icp-list button{font:400 14px var(--f);background:none;color:var(--ink);border:1px solid var(--line);padding:6px 12px;cursor:pointer}
.icp-list button[aria-pressed="true"]{border-color:var(--hot);color:var(--hot)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:56px}
.two h2{font-size:clamp(30px,3.6vw,52px);margin-bottom:20px}
.two p{margin:0;color:var(--grey);font-size:18px}

@media (max-width:900px){
  nav.main{display:none}
  .hero-foot,.mission,.global,.founder,.brief .wrap,.hivebox,.two,.lists{grid-template-columns:1fr}
  .ways,.offers{grid-template-columns:1fr}
  .offer:not(:nth-child(3n+1)){padding-left:0;border-left:0}
  .tile:nth-child(n){grid-column:1/-1}.tile:nth-child(n) .img{aspect-ratio:4/3}
  .index li{grid-template-columns:3ch 1fr}.index li p{grid-column:2}
  .hivebox canvas{height:420px}
}
@media (max-width:900px){.menu-btn{display:block}.right{gap:6px}}
@media (min-width:901px){.mnav{display:none!important}}
@media (max-width:520px){.right>.btn{display:none}section{padding-block:68px}form.f{grid-template-columns:1fr}
 .facts{gap:12px}.facts b{font-size:32px}.facts span{font-size:13px;line-height:1.35;display:block}
 .way{padding:32px 24px 28px}.way .hx{width:34px;height:39px;margin-bottom:18px}.way h3{font-size:26px}
 .works{grid-template-columns:1fr 1fr;gap:8px}.wk{aspect-ratio:3/4}.wk figcaption{padding:48px 12px 12px;gap:4px}.wk b{font-size:15px}.wk .wd{font-size:11px}.wk .wc{font-size:12px}
 .comb5{--w:min(260px,70vw)}.hin p{font-size:13.5px}
 .puzzle{margin-bottom:48px}
 .hero{padding-block:72px 90px}.hero-foot p{font-size:17px}
 .mission p{font-size:17px}}
@media (prefers-reduced-motion:reduce){.hl::before{transform:rotate(-1.2deg)}*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}