:root{
  --paper:#f6f5f1;--card:#fff;--ink:#0b0b0c;--mute:#6d6a78;--soft:#8c86a6;--line:#e3e1da;
  --night:#09090a;--lime:#cfe94a;--violet:#8a64f0;--blue:#2f7df6;--w:1180px;
  color-scheme:light;box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit;margin:0;padding:0}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px);-webkit-text-size-adjust:100%}
body{min-height:100%;background:var(--paper);color:var(--ink);font-family:"Figtree",system-ui,-apple-system,"Segoe UI","Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
:focus-visible{outline:2px solid var(--violet);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--w);margin-inline:auto;padding-inline:clamp(20px,5vw,56px)}

/* type */
h1,.h1{font-size:clamp(2.5rem,6.2vw,4.3rem);line-height:1.02;letter-spacing:-.04em;font-weight:500}
h2,.h2{font-size:clamp(1.9rem,4.1vw,2.9rem);line-height:1.07;letter-spacing:-.035em;font-weight:500}
h3{font-size:1.12rem;line-height:1.25;font-weight:600;letter-spacing:-.01em}
.sf{color:var(--soft)}
.lead{font-size:clamp(1rem,1.35vw,1.13rem);color:var(--mute);max-width:46ch;margin-top:20px}
.sm{font-size:.86rem;color:var(--mute)}
.eb{display:flex;align-items:center;gap:12px;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--mute);margin-bottom:22px}
.eb i{font-style:normal;color:var(--soft)}
.eb b{width:28px;height:1px;background:currentColor;opacity:.45}
.meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.78rem;color:var(--mute);margin-top:18px}
.meta span+span::before{content:"•";margin-right:18px;color:var(--ink)}
.caps{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:14px;padding:13px 22px;border-radius:999px;background:var(--ink);color:#fff;border:1px solid var(--ink);font-size:.88rem;font-weight:500;white-space:nowrap;transition:transform .2s}
.btn::after{content:"\2192"}
.btn:hover{transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--ink);border-color:#cbc8bf}
.acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.lnk{display:inline-flex;gap:14px;font-size:.9rem;font-weight:500;border-bottom:1px solid currentColor;padding-bottom:3px;margin-top:22px}
.lnk::after{content:"\2192"}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(246,245,241,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.top .wrap{display:flex;align-items:center;height:68px;position:relative}
.logo{font-weight:700;letter-spacing:.28em;font-size:1rem}
.main{display:flex;gap:26px;margin-left:clamp(24px,6vw,84px);font-size:.84rem}
.main a{color:var(--mute);padding:6px 0;border-bottom:1px solid transparent}
.main a.on{color:var(--ink);border-color:currentColor}
.main .mcta{display:none}
.top .btn{margin-left:auto;padding:10px 18px;font-size:.82rem}
.burger{display:none;margin-left:auto;font-size:.84rem;font-weight:600;padding:10px 0 10px 16px}
.top.dk{background:rgba(9,9,10,.9);color:#fff}
.top.dk .main a{color:#a9a7b3}.top.dk .main a.on{color:#fff}
.top.dk .btn{background:#fff;color:var(--ink);border-color:#fff}
@media(max-width:920px){
  .top .btn{display:none}.burger{display:block}
  .main{display:none;position:absolute;top:100%;left:0;right:0;margin:0;flex-direction:column;gap:0;padding:8px clamp(20px,5vw,56px) 22px;background:var(--paper);border-bottom:1px solid var(--line);font-size:1.05rem}
  .top.dk .main{background:var(--night);border-color:#26262a}
  .main a{padding:13px 0;border-bottom:1px solid var(--line)}
  .top.dk .main a{border-color:#26262a}
  .main .mcta{display:block;color:var(--ink);font-weight:600;border:0}
  .top.dk .main .mcta{color:#fff}
  body.menu .main{display:flex}
}

/* pages + sections */
.page{display:none}.page.on{display:block}
.hero{padding-block:clamp(36px,6vw,76px) clamp(48px,7vw,92px)}
.band{padding-block:clamp(56px,8vw,100px);border-top:1px solid var(--line);position:relative}
.night{background:var(--night);color:#fff;border-top:0;overflow:hidden;position:relative}
.night .sf{color:#b9a8ff}
.night .lead,.night .sm{color:#c5c3cf}
.night .eb{color:#d5d3de}
.night .btn{background:#fff;color:var(--ink);border-color:#fff}
.night .btn.ghost{background:transparent;color:#fff;border-color:#5a5861}
.night .wrap{position:relative;z-index:2}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,5vw,72px);align-items:center}
.split.even{grid-template-columns:repeat(2,minmax(0,1fr))}
.split.top-al{align-items:start}
.hd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 64px;align-items:end;margin-bottom:44px}
.hd .lead{margin-top:0}
@media(max-width:860px){.split,.split.even,.hd{grid-template-columns:minmax(0,1fr)}}
.cols{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:30px 0}
.cols>*{padding:2px 22px;border-left:1px solid var(--line)}
.cols h3{margin-bottom:6px}
.cols .ic{display:block;width:30px;height:30px;margin-bottom:16px}
.night .cols>*{border-color:#2a2a2f}
@media(max-width:900px){.cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.cols{grid-template-columns:minmax(0,1fr)}}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(218px,1fr));gap:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:24px;position:relative;overflow:hidden}
.card .no{font-size:.7rem;font-weight:600;letter-spacing:.14em;color:var(--mute)}
.card h3{margin:14px 0 6px}
.ck{margin-top:16px;font-size:.84rem;color:var(--mute);display:grid;gap:7px}
.ck li{padding-left:22px;position:relative}
.ck li::before{content:"\2713";position:absolute;left:0;color:var(--ink);font-size:.8rem}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:8px 16px;border-radius:999px;border:1px solid #d2cfc7;font-size:.8rem;color:var(--mute);background:transparent}
.chip[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}

/* orbs */
.orb{display:block;border-radius:50%;aspect-ratio:1;position:relative;flex:none}
.orb.lime{background:radial-gradient(circle at 32% 28%,#fdffe8 0,#e2f56c 28%,#a8c31d 64%,#3c4906 100%);box-shadow:0 0 56px rgba(207,233,74,.55)}
.orb.violet{background:radial-gradient(circle at 32% 28%,#f4efff 0,#b29bff 28%,#6841d8 64%,#1b0e48 100%);box-shadow:0 0 56px rgba(138,100,240,.55)}
.orb.blue{background:radial-gradient(circle at 32% 28%,#f1f8ff 0,#a8cdfb 30%,#3d6fc4 66%,#0a1b40 100%);box-shadow:0 0 56px rgba(120,170,255,.5)}
.orb.glass{background:radial-gradient(circle at 32% 28%,#fff 0,#eeecf5 38%,#bcb8cc 84%,#918da3 100%);box-shadow:0 22px 50px rgba(60,50,90,.2)}
.orb.dark{background:radial-gradient(circle at 64% 58%,#2c2c31 0,#0a0a0b 60%);box-shadow:-10px -4px 40px rgba(207,233,74,.8),inset 5px 3px 12px rgba(255,255,255,.28)}
.orb.dark.v{box-shadow:-10px -4px 40px rgba(138,100,240,.85),inset 5px 3px 12px rgba(255,255,255,.28)}
.orb .t{position:absolute;inset:0;display:grid;place-content:center;text-align:center;font-size:clamp(.5rem,1.05vw,.72rem);letter-spacing:.18em;text-transform:uppercase;font-weight:700;line-height:1.5}
.orb .t small{display:block;font-weight:500;letter-spacing:.02em;text-transform:none;font-size:.95em;margin-top:4px;opacity:.85}
.stage{position:relative;aspect-ratio:1/.84;width:100%;max-width:620px;margin-inline:auto}
.fig{position:absolute;fill:var(--ink);width:auto}
.tag{position:absolute;display:flex;align-items:center;gap:8px;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;white-space:nowrap}
.tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 2px var(--ink)}

/* home hero core */
.core{position:absolute;inset:10% 20% 12% 10%}
.core .orb{position:absolute;inset:8%}
.core .shade{position:absolute;inset:8%;transform:translate(-24%,-7%) scale(.86);border-radius:50%;background:radial-gradient(circle at 72% 38%,rgba(255,255,255,.95),rgba(150,150,160,.6) 46%,rgba(18,18,22,.82));filter:blur(.6px)}
.ring{position:absolute;inset:0;border:1px solid rgba(11,11,12,.3);border-radius:50%;transform:rotate(-24deg) scaleY(.8);animation:spin 70s linear infinite}
.ring.r2{inset:-4% 10%;transform:rotate(40deg) scaleX(.84);animation-duration:95s;animation-direction:reverse}
.ring::before,.ring::after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--ink);top:8%;left:20%}
.ring::after{top:auto;left:auto;bottom:10%;right:16%;background:var(--lime);box-shadow:0 0 0 2px var(--ink)}
@keyframes spin{to{rotate:360deg}}
.ticks{position:absolute;right:0;top:6%;display:grid;gap:14px;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:#bdbac6}
.ticks li:first-child{color:#7c9700}
.ticks i{font-style:normal;margin-right:12px}
@media(max-width:1080px){.ticks{display:none}.core{inset:8% 14%}}

/* scenes */
.scene{position:relative;border-radius:6px;overflow:hidden;min-height:clamp(260px,34vw,400px)}
.scene.mist{background:linear-gradient(180deg,#f0f0f2,#d6d6dc)}
.ridge{position:absolute;inset:auto 0 0;height:70%;background:linear-gradient(180deg,#8b8b93,#232327);clip-path:polygon(0 70%,18% 48%,30% 60%,46% 22%,52% 30%,64% 12%,74% 40%,86% 30%,100% 55%,100% 100%,0 100%)}
.ridge.back{height:86%;opacity:.35;background:#9a9aa4;clip-path:polygon(0 50%,22% 30%,40% 55%,60% 28%,80% 45%,100% 25%,100% 100%,0 100%)}
.scene.mist .fig{left:61.6%;bottom:60.6%;height:15%}
.scene.dawn{background:radial-gradient(90% 80% at 78% 26%,#e6e9ff 0,#c9cdf0 26%,rgba(201,205,240,0) 56%),linear-gradient(165deg,#f3ede2,#dccfbb 58%,#b3a48d)}
.scene.dawn .orb{position:absolute;width:78%;right:-30%;top:-22%;opacity:.95}
.scene.dawn::after{content:"";position:absolute;inset:auto 0 0;height:24%;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(190,176,152,.9))}
.scene.dawn .fig{right:22%;bottom:16%;height:26%;z-index:2}
.scene.door{background:var(--night)}
.slit{position:absolute;top:0;bottom:16%;width:5%;min-width:34px;right:22%;background:linear-gradient(90deg,var(--lime),#fff 45%,#bba9ff);box-shadow:0 0 110px 34px rgba(160,140,255,.38)}
.slit::after{content:"";position:absolute;top:100%;left:-320%;right:-320%;height:19%;background:radial-gradient(50% 100% at 50% 0,rgba(214,224,160,.42),transparent 72%)}
.scene.door .fig{right:24.5%;bottom:16%;height:22%;z-index:2}
.arc{position:absolute;width:118%;aspect-ratio:1;border-radius:50%;right:-62%;top:14%;background:radial-gradient(circle at 28% 18%,#27253b 0,#0b0b0d 46%);box-shadow:-2px -2px 0 rgba(255,255,255,.6),-8px -8px 60px 4px rgba(160,140,255,.55),-30px -30px 130px rgba(207,233,74,.22);z-index:1}
.arc.low{right:-24%;top:86%;width:90%}
@media(max-width:860px){.arc{opacity:.45}}

/* rising steps */
.rise{--n:5;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:20px;position:relative;margin-top:44px}
.rise li{padding-top:calc((var(--n) - 1 - var(--i)) * 24px);position:relative;z-index:2}
.rise .orb{width:calc(34px + var(--i) * 6px);margin-bottom:18px}
.rise .n{font-size:.68rem;font-weight:600;letter-spacing:.1em;color:#a9a7b3;display:block;margin-bottom:6px}
.rise h3{font-size:1rem;font-weight:500}
.rise p{font-size:.8rem;color:#b5b3bf;margin-top:6px;max-width:22ch}
.rise svg{position:absolute;left:14px;top:17px;width:calc(100% - 100% / var(--n));height:calc((var(--n) - 1) * 24px);z-index:1;overflow:visible}
@media(max-width:760px){
  .rise{grid-template-columns:minmax(0,1fr);gap:22px}
  .rise li{padding-top:0;display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:8px;align-items:start}
  .rise .orb{grid-row:1/4;margin:2px 0 0}.rise p{max-width:none}.rise svg{display:none}
}

/* device */
.device{position:absolute;left:36%;top:4%;width:30%;aspect-ratio:9/18.5;border-radius:11% / 5.4%;background:#0b0b0c;border:1px solid #2c2c30;box-shadow:0 40px 80px -24px rgba(20,16,40,.5),inset 0 0 0 4px #17171a;transform:rotate(7deg);overflow:hidden;z-index:3}
.device::before{content:"";position:absolute;inset:20% -22% 26%;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 13px,rgba(207,233,74,.26) 13px 14px)}
.device .pin{position:absolute;left:50%;top:44%;width:16px;height:16px;margin:-8px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--lime);box-shadow:0 0 22px var(--lime)}
.device .go{position:absolute;inset:auto 14% 9%;height:8%;border-radius:99px;background:#fff}
.tile{position:absolute;border-radius:8px;box-shadow:0 22px 44px -14px rgba(20,16,40,.4);z-index:2}
.tile.room{left:17%;top:22%;width:24%;aspect-ratio:3/4;background:linear-gradient(180deg,#34343a 0 52%,#dedbd3 52% 78%,#1c1c1f 78%);z-index:4}
.tile.room::before{content:"";position:absolute;inset:10% 14% 54% 44%;background:#c9cee0;box-shadow:inset 0 0 0 2px #24242a}
.tile.who{left:2%;top:40%;width:20%;aspect-ratio:3/4;background:linear-gradient(180deg,#eceaf0,#cfccd8);opacity:.9}
.tile.who::before{content:"";position:absolute;left:36%;top:26%;width:28%;aspect-ratio:1;border-radius:50%;background:#77748a;box-shadow:0 34px 0 14px #77748a}
.tile.pro{left:60%;top:28%;width:19%;aspect-ratio:3/4.6;background:#111113;z-index:4}
.tile.pro::before{content:"";position:absolute;left:32%;top:14%;width:36%;aspect-ratio:1;border-radius:50%;background:#d9d6e2}
.tile.pro::after{content:"";position:absolute;inset:60% 16% auto;height:3px;background:#4a4a52;box-shadow:0 9px 0 #34343a,0 18px 0 #34343a}

/* misc blocks */
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 0}
.trio>*{padding:0 26px;border-left:1px solid var(--line)}
.trio>*:first-child{padding-left:0;border:0}
.trio b{display:block;font-size:clamp(1.7rem,3.6vw,2.5rem);font-weight:600;letter-spacing:-.035em;line-height:1.1;margin-bottom:10px}
@media(max-width:700px){.trio{grid-template-columns:minmax(0,1fr)}.trio>*{padding:0;border:0}}
.venn{display:flex;justify-content:center;align-items:center;position:relative}
.venn .orb{width:min(46%,230px)}
.venn .orb+.orb{margin-left:-6%}
.venn .orb.a{background:radial-gradient(circle at 22% 50%,#e9f6a0 0,#fafaf7 34%,#dedce6 100%);color:var(--ink)}
.venn .orb.b{background:radial-gradient(circle at 80% 56%,#e2d4ff 0,#f7f6fb 38%,#dedce6 100%);color:var(--ink)}
.venn::after{content:"+";position:absolute;font-size:1.6rem;font-weight:300;color:var(--ink)}
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.duo>*{padding:clamp(28px,5vw,56px);min-height:280px;position:relative;overflow:hidden}
.duo .quote{background:linear-gradient(120deg,#d9d9de,#f2f1ee 60%)}
.duo blockquote{font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.3;letter-spacing:-.02em;max-width:17ch;margin:10px 0 22px}
.duo .who b{display:block;font-size:.95rem}.duo .who span{font-size:.78rem;color:var(--mute)}
@media(max-width:760px){.duo{grid-template-columns:minmax(0,1fr)}}
.strip{display:flex;flex-wrap:wrap;align-items:center;gap:20px 48px;justify-content:space-between}
.strip>.acts{margin-top:0}.strip .lead+.acts{margin-top:20px}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:700px){.two{grid-template-columns:minmax(0,1fr)}}
.fund{border-left:1px solid var(--line);padding-left:clamp(20px,4vw,48px)}
.fund .tag{position:static;margin-bottom:16px;color:var(--mute)}
@media(max-width:860px){.fund{border:0;padding:0}}
.pipe .card{min-height:250px;display:flex;flex-direction:column;justify-content:flex-end}
.pipe .card .caps{position:absolute!important;top:22px;left:24px;color:var(--mute)}
.pipe .card.live{background:linear-gradient(180deg,#27272c,#0b0b0c 70%);color:#fff;border-color:#0b0b0c}
.pipe .card.live .caps,.pipe .card.live .sm{color:#c5c3cf}
.pipe .card{min-height:290px}.pipe .card>*{position:relative;z-index:1}.pipe .card .orb{position:absolute;z-index:0;width:40%;right:-7%;top:16%;opacity:.9}
.pipe .card[hidden]{display:none}
.stack{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px}
.stack li{border:1px solid var(--line);background:var(--card);border-radius:4px;padding:16px 10px;text-align:center;font-size:.82rem;color:var(--mute)}
.panes{position:relative}
.pane{position:absolute;width:33%;aspect-ratio:3/4.1;border-radius:5px;background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(205,203,216,.42));border:1px solid #fff;box-shadow:0 30px 60px -22px rgba(30,25,60,.3);transform:skewY(-6deg);display:grid;place-items:center}
.pane .orb{width:58%;transform:skewY(6deg)}
.pane .tag{top:-34px;left:0;transform:skewY(6deg)}
.eco .orb{position:absolute}
.eco .halo{position:absolute;inset:26% 4% 16%;border:1px solid rgba(11,11,12,.16);border-radius:50%;transform:rotate(-8deg)}
.loop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr) minmax(0,1fr);gap:16px;align-items:center;margin-top:8px}
.loop ul{display:grid;gap:16px;font-size:.78rem;color:#c5c3cf}
.loop ul li::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--lime);margin-right:10px}
.loop ul.r li::before{background:var(--violet)}
.loop svg{width:100%;height:auto}
@media(max-width:860px){.loop{grid-template-columns:repeat(2,minmax(0,1fr))}.loop svg{grid-column:1/-1;grid-row:1}}
.pill{display:flex;align-items:center;gap:14px;width:max-content;max-width:100%;margin:22px auto 0;padding:10px 22px 10px 12px;border:1px solid #3a3a40;border-radius:999px;font-size:.78rem;color:#c5c3cf}
.pill .orb{width:28px}.pill b{display:block;color:#fff;letter-spacing:.16em;font-size:.66rem}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.stats>*{padding:0 22px;border-left:1px solid var(--line)}
.stats b{display:block;font-size:clamp(1.7rem,3.4vw,2.3rem);font-weight:500;letter-spacing:-.03em}
.stats span{font-size:.86rem;color:var(--mute)}
.dots{display:grid;gap:14px;font-size:.88rem}
.dots li::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#fff;margin-right:14px}

/* careers */
.ticker{border-top:1px solid #26262a;font-size:.76rem;color:#d5d3de}
.ticker .wrap{display:flex;gap:10px 26px;flex-wrap:wrap;align-items:center;padding-block:14px}
.ticker b{letter-spacing:.16em;font-size:.64rem;text-transform:uppercase;display:flex;gap:8px;align-items:center}
.ticker b::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--lime)}
.disc{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center;max-width:520px;margin-top:22px;box-shadow:0 26px 60px -30px rgba(40,30,80,.35)}
.disc .orb{width:16px}
.flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px 16px;counter-reset:f;position:relative}
.flow::before{content:"";position:absolute;left:14px;right:0;top:14px;height:1px;background:var(--line)}
.flow li{counter-increment:f;position:relative;font-size:.8rem;color:var(--mute)}
.flow li::before{content:counter(f);display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid #cbc8bf;background:var(--paper);color:var(--ink);font-size:.76rem;font-weight:600;margin-bottom:18px;position:relative}
.flow li:first-child::before{background:var(--lime);border-color:var(--lime)}
.flow h3{font-size:.95rem;font-weight:500;color:var(--ink);margin-bottom:6px}
.flow em{display:block;font-style:normal;margin-top:8px;color:var(--soft)}
@media(max-width:760px){.flow{grid-template-columns:minmax(0,1fr)}.flow::before{display:none}.flow li{padding-left:44px}.flow li::before{position:absolute;left:0;top:-3px;margin:0}}
.roles li{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1.3fr) minmax(0,1.6fr) minmax(0,1fr);gap:4px 16px;padding:13px 0;border-bottom:1px solid var(--line);font-size:.88rem;color:var(--soft)}
.roles li b{color:var(--ink);font-weight:500}
@media(max-width:640px){.roles li{grid-template-columns:repeat(2,minmax(0,1fr))}.roles li b{grid-column:1/-1}.roles li span:last-child{display:none}}
.note{font-size:.84rem;color:var(--mute);padding:18px 0}
.steps6{--n:6}
.steps6 b{display:block;font-size:1.5rem;font-weight:400;margin-bottom:12px}
.steps6 h3{font-weight:500;margin-bottom:8px}
.steps6 p{font-size:.8rem;color:#b5b3bf}
@media(min-width:901px){.steps6{grid-template-columns:repeat(6,minmax(0,1fr))}.steps6>*{padding:2px 16px}}

/* insights */
.tabs{border-bottom:1px solid var(--line)}
.tabs .wrap{display:flex;gap:6px 26px;overflow-x:auto;padding-block:16px}
.tab{font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--soft);padding:6px 0;border-bottom:1px solid transparent;white-space:nowrap}
.tab[aria-pressed="true"]{color:var(--ink);border-color:var(--ink)}
.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.post{background:var(--card);border:1px solid var(--line);border-radius:6px;overflow:hidden;display:flex;flex-direction:column}
.post .tx{padding:20px 20px 22px;flex:1}
.post .caps{color:var(--soft);font-size:.6rem;display:block;margin-bottom:10px}
.post h3{font-weight:500;font-size:1.08rem}
.post .soon{display:inline-block;margin-top:14px;font-size:.72rem;color:var(--mute);border:1px solid var(--line);border-radius:99px;padding:3px 10px}
.th{aspect-ratio:16/10;position:relative;overflow:hidden}
.th.a{background:var(--night)}
.th.a::after{content:"";position:absolute;width:170%;aspect-ratio:1;border-radius:50%;left:-10%;top:48%;background:radial-gradient(circle at 40% 0,#2b2b31,#0a0a0b 40%);box-shadow:0 -2px 0 rgba(255,255,255,.75),0 -12px 54px rgba(207,233,74,.65)}
.th.b{background:linear-gradient(160deg,#f3f1fa,#d9d5ec)}
.th.b::after{content:"";position:absolute;width:44%;aspect-ratio:1;border-radius:50%;right:14%;top:18%;background:radial-gradient(circle at 70% 60%,#e9f58f,#f7f6fb 50%,#bdb8d2);box-shadow:0 18px 40px rgba(60,50,90,.25)}
.th.c{background:linear-gradient(118deg,#ece4d6 0 36%,#b6a78f 36% 60%,#cdd7f3 60%)}
.th.d{background:linear-gradient(200deg,#c9d3f5,#efe9dd 62%)}
.th.d::after{content:"";position:absolute;width:150%;aspect-ratio:1;border-radius:50%;left:-70%;top:30%;border:26px solid #f6f1e6;box-shadow:0 0 0 1px rgba(0,0,0,.06),inset 0 0 40px rgba(120,100,70,.25)}
.feat{background:linear-gradient(118deg,#e9e1d3 0 30%,#a99a83 30% 58%,#cfd9f4 58%);display:flex;flex-direction:column;justify-content:flex-end;padding:28px;color:#fff;min-height:300px}
.feat::before{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(180deg,transparent,rgba(20,18,16,.72))}
.feat>*{position:relative}
.feat .fig{right:26%;bottom:18%;height:34%;position:absolute}
.themes li{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;padding:18px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.themes i{font-style:normal;font-size:.7rem;color:var(--soft);font-weight:600;letter-spacing:.1em}

/* forms */
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 26px}
.fields .full{grid-column:1/-1}
.fields label{display:block;font-size:.76rem;color:var(--soft);margin-bottom:4px}
.fields input,.fields textarea{width:100%;border:0;border-bottom:1px solid #cbc8bf;background:transparent;padding:8px 0;font-size:1rem;border-radius:0}
.fields textarea{min-height:84px;resize:vertical}
.fields input:focus,.fields textarea:focus{outline:0;border-color:var(--ink)}
.fields .bad{border-color:#c0392b}
.msg{font-size:.86rem;margin-top:14px;min-height:1.4em}
.msg.err{color:#c0392b}
@media(max-width:560px){.fields{grid-template-columns:minmax(0,1fr)}}
.sub{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.sub input{flex:1 1 220px;border:1px solid #cbc8bf;border-radius:999px;padding:12px 20px;background:transparent;font-size:.9rem}

/* footer */
.foot{border-top:1px solid var(--line);padding-block:30px;font-size:.78rem;color:var(--soft)}
.foot .wrap{display:flex;flex-wrap:wrap;gap:22px 44px;align-items:center;justify-content:space-between}
.foot .logo{color:var(--ink);display:block;margin-bottom:4px}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 22px}
.foot nav a.on{color:var(--ink);border-bottom:1px solid currentColor}
.foot .soc{display:flex;gap:18px;color:var(--ink);font-weight:700;font-size:1.05rem}

/* ===== v2: motion + interactive pieces ===== */
@property --r{syntax:'<length>';inherits:true;initial-value:96px}
#bar{position:fixed;left:0;right:0;top:env(safe-area-inset-top,0px);height:2px;z-index:60;background:linear-gradient(90deg,var(--lime),var(--violet));transform-origin:0 50%;transform:scaleX(var(--sp,0));pointer-events:none}
.page.on{animation:pin .55s cubic-bezier(.2,.7,.2,1)}
@keyframes pin{from{opacity:0;transform:translateY(14px)}}
.js [data-rv]{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--d,0)*70ms)}
.js [data-rv].in{opacity:1;transform:none}
.js .card.tilt{transition:transform .14s ease-out;transition-delay:0s;will-change:transform}
.w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.14em;margin-bottom:-.14em}
.w>span{display:inline-block}
.js .w>span{transform:translateY(115%);transition:transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i)*55ms + 90ms)}
.js .page.go .w>span{transform:none}
[data-dp]{translate:calc(var(--px,0)*var(--dp)*1px) calc(var(--py,0)*var(--dp)*1px);transition:translate .35s ease-out}
.night::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(460px circle at var(--mx,-999px) var(--my,-999px),rgba(207,233,74,.12),rgba(138,100,240,.06) 45%,transparent 70%)}

/* hero: morphing point cloud */
.morphwrap{position:relative}
.morph{aspect-ratio:1/.9;max-width:620px}
.morph::before{content:"";position:absolute;inset:20%;border-radius:50%;background:radial-gradient(circle,rgba(207,233,74,.6),rgba(207,233,74,0) 68%);filter:blur(14px)}
.morph canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y;cursor:grab}
.stg{position:absolute;right:0;top:3%;display:grid;gap:2px;z-index:2}
.stg button{display:flex;align-items:center;gap:12px;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:#b3b0bd;padding:7px 0;transition:color .3s}
.stg button i{font-style:normal}
.stg button::after{content:"";height:1px;width:0;background:currentColor;transition:width .45s cubic-bezier(.2,.7,.2,1)}
.stg button:hover{color:var(--mute)}
.stg button[aria-pressed="true"]{color:var(--ink)}
.stg button[aria-pressed="true"]::after{width:26px}
.mcap{position:absolute;right:0;bottom:3%;max-width:24ch;text-align:right;font-size:.82rem;color:var(--mute);min-height:2.6em}
@media(max-width:1080px){
  .stg{position:static;display:flex;flex-wrap:wrap;justify-content:center;gap:0 18px;margin-top:6px}
  .stg button::after{display:none}
  .mcap{position:static;max-width:none;text-align:center;margin-top:8px}
}

/* philosophy: lens */
.lens{position:relative;border-radius:6px;overflow:hidden;min-height:clamp(320px,38vw,460px);background:#0d0d0f;touch-action:pan-y;cursor:crosshair;--x:25%;--y:24.7%;--r:clamp(84px,8.6vw,106px);transition:--r .35s ease}
.lens.press{--r:clamp(120px,14vw,170px)}
.lw{position:absolute;inset:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));place-items:center;text-align:center;padding:12% 8px;font-size:clamp(.95rem,1.7vw,1.3rem);font-weight:500;letter-spacing:-.02em;color:#77757f}
.lw.b{background:var(--lime);color:var(--ink);clip-path:circle(var(--r) at var(--x) var(--y))}
.lens::after{content:"";position:absolute;left:var(--x);top:var(--y);width:calc(var(--r)*2);height:calc(var(--r)*2);margin:calc(var(--r)*-1) 0 0 calc(var(--r)*-1);border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.55),0 0 70px rgba(207,233,74,.55);pointer-events:none}

/* problem-to-scale: scroll-driven */
.js .rise li{opacity:.26;transition:opacity .6s}
.js .rise li.lit{opacity:1}
.js .rise li .orb{transform:scale(.5);transition:transform .7s cubic-bezier(.2,1.5,.4,1)}
.js .rise li.lit .orb{transform:scale(1)}
.rise li:hover .orb,.js .rise li.lit:hover .orb{transform:scale(1.2)}
.rise li.now .orb::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid rgba(255,255,255,.5);animation:ping 2.2s ease-out infinite}
@keyframes ping{from{transform:scale(.85);opacity:.9}to{transform:scale(2);opacity:0}}
.js .rise svg{clip-path:inset(-10px calc((1 - var(--p,0))*100%) -10px 0)}
@media(max-width:760px){
  .rise .orb{width:34px}
  .rise::before{content:"";position:absolute;left:16px;top:10px;bottom:30px;width:1.5px;background:linear-gradient(var(--lime),#a98bff);transform-origin:50% 0;transform:scaleY(var(--p,1))}
}

/* ===== v2.5: Home rework ===== */
/* philosophy: the problem is a box, the opportunity is inside it */
.xray{position:relative;min-height:clamp(320px,38vw,460px);border-radius:6px;overflow:hidden;--o:0;--ry:0deg;touch-action:pan-y;
  background:radial-gradient(58% 48% at 50% 54%,rgba(207,233,74,calc(var(--o)*.5)),rgba(207,233,74,0) 72%),linear-gradient(180deg,#fbfbf9,#e8e6e0)}
.xray::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(11,11,12,.05) 1px,transparent 1px) 0 0/100% 12.5%,linear-gradient(90deg,rgba(11,11,12,.05) 1px,transparent 1px) 0 0/8.333% 100%}
.xscene{position:absolute;inset:0;display:grid;place-items:center;perspective:1100px}
.xcube{--s:clamp(112px,14.5vw,180px);width:var(--s);height:var(--s);position:relative;transform-style:preserve-3d;transform:rotateX(-22deg) rotateY(calc(38deg + var(--ry)))}
.xf{position:absolute;inset:0;--d:calc(var(--s)/2 + var(--o)*var(--s)*.56);opacity:calc(1 - var(--o)*.5);border:1px solid rgba(255,255,255,.4);
  background:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px) 0 0/25% 25%,linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px) 0 0/25% 25%,linear-gradient(135deg,#26262b,#09090a)}
.xf.f1{transform:translateZ(var(--d))}.xf.f2{transform:rotateY(180deg) translateZ(var(--d))}
.xf.f3{transform:rotateY(90deg) translateZ(var(--d))}.xf.f4{transform:rotateY(-90deg) translateZ(var(--d))}
.xf.f5{transform:rotateX(90deg) translateZ(var(--d))}.xf.f6{transform:rotateX(-90deg) translateZ(var(--d))}
.xorb{position:absolute;inset:16%;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fdffe8,#e2f56c 30%,#a8c31d 66%,#3c4906);box-shadow:0 0 calc(20px + var(--o)*90px) rgba(207,233,74,.9);
  transform:rotateY(calc(-38deg - var(--ry))) rotateX(22deg) scale(calc(.6 + var(--o)*.78))}
.xtag{position:absolute;display:flex;align-items:center;gap:8px;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600}
.xtag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ink)}
.xtag.p{left:7%;top:10%;opacity:calc(1.2 - var(--o)*2.2)}
.xtag.o{right:7%;top:10%;opacity:calc(var(--o)*2.2 - 1)}
.xtag.o::before{background:var(--lime);box-shadow:0 0 0 2px var(--ink)}
.xpct{position:absolute;left:7%;bottom:8%;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--mute);font-variant-numeric:tabular-nums}
.xpct b{color:var(--ink);font-size:1.5rem;letter-spacing:-.02em;font-weight:500;margin-right:2px}

/* venture: the product as the hub between four things */
.dv{container-type:inline-size;aspect-ratio:1/.86;perspective:1200px}
.dvl{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none}
.dvl .ln{stroke:#c1bfca;stroke-width:.22}
.dvl .pl{stroke:#7c9800;stroke-width:.55;stroke-linecap:round;stroke-dasharray:.14 .86;animation:flow 3.2s linear infinite}
.dvl .nd{fill:var(--ink)}
@keyframes flow{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.cd{position:absolute;display:flex;flex-direction:column;gap:1.6cqw;align-items:flex-start}
.cd.r{align-items:flex-end}
.cd b{display:grid;place-items:center;width:15cqw;aspect-ratio:1;border-radius:2.4cqw;background:linear-gradient(145deg,#fff,#eceaf2);border:1px solid #fff;box-shadow:0 3.4cqw 6cqw -3cqw rgba(30,25,60,.42);animation:tilep 8s ease-in-out infinite}
.cd .ic{width:6cqw;height:6cqw}
.cd span{font-size:max(7.5px,1.7cqw);line-height:1.3;letter-spacing:.2em;text-transform:uppercase;font-weight:600;white-space:nowrap}
.c1{left:5%;top:6%}.c2{right:5%;top:4%}.c3{left:7%;bottom:6%}.c4{right:6%;bottom:10%}
.c2 b{animation-delay:-6s}.c3 b{animation-delay:-4s}.c4 b{animation-delay:-2s}
@keyframes tilep{0%,16%,100%{box-shadow:0 3.4cqw 6cqw -3cqw rgba(30,25,60,.42),0 0 0 0 rgba(207,233,74,0)}6%{box-shadow:0 3.4cqw 6cqw -3cqw rgba(30,25,60,.42),0 0 0 .7cqw rgba(207,233,74,.95)}}
.phone{position:absolute;left:36.5%;top:16.86%;width:27%;aspect-ratio:9/19;border-radius:4.4cqw;background:linear-gradient(145deg,#34343a,#050506 55%);padding:.9cqw;box-shadow:0 5cqw 9cqw -3cqw rgba(20,16,40,.6),inset 0 0 0 1px #45454d;z-index:2;
  transform:rotateY(calc(var(--px,0)*16deg)) rotateX(calc(var(--py,0)*-11deg));transition:transform .35s ease-out}
.scr{position:relative;width:100%;height:100%;border-radius:3.6cqw;background:#09090b;overflow:hidden}
.scr::before,.sweep{content:"";position:absolute;left:50%;top:46%;width:156%;aspect-ratio:1;translate:-50% -50%;border-radius:50%}
.scr::before{background:repeating-radial-gradient(circle,transparent 0 2.4cqw,rgba(207,233,74,.24) 2.4cqw calc(2.4cqw + 1px))}
.scr::after{content:"";position:absolute;left:50%;top:2.2%;width:26%;height:2.4%;translate:-50% 0;border-radius:99px;background:#000;box-shadow:0 0 0 1px #1c1c20}
.sweep{background:conic-gradient(from 0deg,rgba(207,233,74,0) 0 78%,rgba(207,233,74,.42));animation:spin 5s linear infinite}
.dp{position:absolute;width:1.5cqw;height:1.5cqw;border-radius:50%;background:#fff;animation:pinp 5s ease-in-out infinite}
.dp.p0{left:24%;top:31%;animation-delay:-3.9s}.dp.p1{left:68%;top:38%;animation-delay:-.6s}.dp.p2{left:30%;top:61%;animation-delay:-2.7s}.dp.p3{left:63%;top:59%;animation-delay:-1.6s}
.dp.me{left:50%;top:46%;width:2.4cqw;height:2.4cqw;margin:-1.2cqw;background:var(--lime);box-shadow:0 0 0 .8cqw rgba(207,233,74,.25),0 0 3cqw var(--lime);animation:none}
@keyframes pinp{0%,100%{scale:.4;opacity:.25}35%,65%{scale:1;opacity:1}}
.city{position:absolute;left:10%;top:7%;font-size:max(6px,1.4cqw);color:#fff;font-weight:600;letter-spacing:.03em}
.dgo{position:absolute;left:14%;right:14%;bottom:5.5%;height:8%;border-radius:99px;background:#fff;color:var(--ink);display:grid;place-items:center;font-size:max(6px,1.4cqw);font-weight:600}

/* products, platforms, ventures */
.tri3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-right:1px solid var(--line)}
.tc{display:block;position:relative;padding:28px 26px 32px;border-left:1px solid var(--line);overflow:hidden;transition:background .45s}
.tc::before{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--c);transform:scaleX(var(--f,0));transform-origin:0 50%}
.tc:hover,.tc:focus-visible{background:#fff}
.tg{width:54px;height:54px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round;color:var(--ink);transition:color .4s}
.tc:hover .tg{color:var(--c)}
.tg .lid{animation:lid 3.6s ease-in-out infinite}
.tg .la{animation:lay 3.6s ease-in-out infinite}.tg .lc{animation:lay 3.6s ease-in-out infinite reverse}
.tg .orbt{transform-origin:24px 24px;animation:orb 9s linear infinite}
@keyframes lid{0%,100%{transform:none}50%{transform:translateY(-4px)}}
@keyframes lay{0%,100%{transform:none}50%{transform:translateY(-3px)}}
@keyframes orb{from{transform:rotate(-25deg)}to{transform:rotate(335deg)}}
.tw{display:block;font-size:clamp(2rem,4.5vw,3.5rem);font-weight:600;letter-spacing:-.04em;line-height:1.08;margin:26px 0 10px;
  background:linear-gradient(90deg,var(--c) 50%,#cdcbd4 50%) 0 0/200% 100%;background-position:calc(100% - var(--f,0)*100%) 0;-webkit-background-clip:text;background-clip:text;color:transparent;
  translate:calc((1 - var(--f,0))*28px) 0}
.ta{display:inline-block;margin-top:18px;transition:translate .4s cubic-bezier(.2,.7,.2,1)}
.tc:hover .ta{translate:8px 0}
@media(max-width:700px){.tri3{grid-template-columns:minmax(0,1fr);border-right:0}.tc{border-left:0;border-top:1px solid var(--line);padding:24px 0 26px}}

/* the two companies come closer together */
.venn2{position:relative;width:100%;max-width:560px;aspect-ratio:1/.6;margin-inline:auto;--m:0;container-type:inline-size}
.vo{position:absolute;top:50%;width:47%;aspect-ratio:1;border-radius:50%;translate:0 -50%;mix-blend-mode:screen;display:flex;align-items:center;font-size:max(8px,2.05cqw);letter-spacing:.18em;text-transform:uppercase;font-weight:700;line-height:1.45;animation:vfl 7s ease-in-out infinite}
.vo>span{display:block;width:60%}
.vo small{display:block;font-weight:500;letter-spacing:.02em;text-transform:none;margin-top:.7em;font-size:.95em}
.vo.a{left:calc(var(--m)*11%);padding-left:4.4cqw;color:var(--ink);background:radial-gradient(circle at 28% 30%,#fbffd6,#cfe94a 46%,#6f8212)}
.vo.b{right:calc(var(--m)*11%);padding-right:4.4cqw;justify-content:flex-end;text-align:right;color:#fff;background:radial-gradient(circle at 72% 30%,#efe8ff,#8a64f0 48%,#2e1b7a);animation-delay:-3.5s}
@keyframes vfl{50%{margin-top:-1.6cqw}}
.vplus{position:absolute;left:50%;top:50%;translate:-50% -50%;font-size:5cqw;font-weight:300;color:#fff;opacity:calc(1 - var(--m)*3)}
.vring{position:absolute;left:50%;top:50%;width:74%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;border:1px dashed rgba(255,255,255,.3);opacity:var(--m);animation:spin 70s linear infinite}
.vcap{position:absolute;left:50%;bottom:-9%;translate:-50% 0;white-space:nowrap;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:#d5d3de;opacity:calc(var(--m)*2.4 - 1.2)}

.morph::before{inset:20% 25% 20% 15%}
@media(max-width:1080px){.morph::before{inset:20%}}

/* products, platforms, ventures: selector + one object that multiplies */
.pv{align-items:center}
.pvr{border-top:1px solid var(--line);position:relative}
.pvr:nth-child(3){border-bottom:1px solid var(--line)}
.pvr::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--c);transform:scaleX(0);transform-origin:0 50%;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.pvr.on::after{transform:scaleX(1)}
.pvh{display:flex;align-items:baseline;justify-content:space-between;width:100%;padding:18px 0 14px;font-size:clamp(2rem,4.3vw,3.4rem);font-weight:600;letter-spacing:-.04em;line-height:1.05;color:#cbc9d3;transition:color .45s,padding .45s}
.pvh span{transition:translate .5s cubic-bezier(.2,.7,.2,1)}
.pvh i{font-style:normal;font-size:.68rem;letter-spacing:.16em;font-weight:600;color:var(--soft)}
.pvh:hover{color:#a9a6b6}
.pvr.on .pvh{color:var(--c)}
.pvr.on .pvh span{translate:10px 0}
.pvb{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s cubic-bezier(.2,.7,.2,1)}
.pvr.on .pvb{grid-template-rows:1fr}
.pvb>div{overflow:hidden;padding-left:10px}
.pvb p{font-size:1rem}
.pvb .lnk{margin:12px 0 22px}
.pvp{position:relative;min-height:clamp(320px,38vw,460px);border-radius:6px;overflow:hidden;--ac:#cfe94a;touch-action:pan-y;
  background:radial-gradient(56% 46% at 50% 56%,color-mix(in srgb,var(--ac) 46%,transparent),transparent 72%),linear-gradient(180deg,#fbfbf9,#e8e6e0)}
.pvp::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(11,11,12,.05) 1px,transparent 1px) 0 0/100% 12.5%,linear-gradient(90deg,rgba(11,11,12,.05) 1px,transparent 1px) 0 0/8.333% 100%}
.pvp canvas{position:absolute;inset:0;width:100%;height:100%}
.pvp .xtag{left:7%;top:10%}

/* "One venture is only the beginning": three layouts, switchable for review */
.ov{position:relative}
.ovsw{display:flex;align-items:center;gap:8px;justify-content:flex-end;margin-bottom:8px}
.ovsw .caps{font-size:.6rem;margin-right:6px}
.ovsw .chip{padding:5px 13px}
.ov .ova,.ov .ovb,.ov .ovc{display:none}
.ov[data-v="a"] .ova,.ov[data-v="b"] .ovb{display:block}
.ov[data-v="c"] .ovc{display:grid}
/* A: the original row, alive */
.ovrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.15fr);align-items:stretch}
.ow{display:block;padding:4px 26px 6px;border-left:1px solid var(--line)}
.ow:first-child{padding-left:0;border-left:0}
.ow b{display:inline-block;font-size:clamp(1.7rem,2.9vw,2.4rem);font-weight:600;letter-spacing:-.04em;line-height:1.12;color:var(--c);margin-bottom:10px;background:linear-gradient(var(--c),var(--c)) 0 100%/0 3px no-repeat;transition:background-size .5s cubic-bezier(.2,.7,.2,1)}
.ow:hover b,.ow:focus-visible b{background-size:100% 3px}
.ow .sm{display:block}
.ow i{display:inline-block;font-style:normal;margin-top:22px;transition:translate .4s cubic-bezier(.2,.7,.2,1)}
.ow:hover i{translate:8px 0}
.js .ov .ow{opacity:0;translate:0 34px;transition:opacity .8s cubic-bezier(.2,.7,.2,1),translate .8s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i)*120ms)}
.js .ov.in .ow{opacity:1;translate:0 0}
.ovrib{position:relative;min-height:170px}
.ovrib canvas{position:absolute;inset:-34% 0 -34% 4%;width:96%;height:168%}
.ovrib span{position:absolute;right:0;top:50%;translate:0 -50%;font-size:.62rem;line-height:1.7}
@media(max-width:860px){.ovrow{grid-template-columns:minmax(0,1fr)}.ow{padding:22px 0;border-left:0;border-top:1px solid var(--line)}.ow:first-child{border-top:0;padding-top:0}.ovrib{min-height:150px;margin-top:10px}}
/* B: a moving band of the three words */
.band2{width:100vw;margin-left:calc(50% - 50vw);overflow:hidden;padding:4px 0 34px}
.bt{display:inline-flex;gap:.42em;white-space:nowrap;font-size:clamp(3.2rem,10vw,8rem);font-weight:600;letter-spacing:-.045em;line-height:1.06;will-change:transform;padding-left:.42em}
.bt span{color:var(--c)}
.bt .mt{color:transparent;-webkit-text-stroke:1.5px #b4b1c0}
.ovb .cols a .lnk{margin-top:14px;font-size:.84rem}
/* C: one starting point that branches */
.ovc{align-items:center}
.tree{position:relative;aspect-ratio:520/340;width:100%;max-width:640px;margin-inline:auto}
.tree svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none}
.br{stroke-width:2.2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--gi,0))}
.br.more{stroke:#b9b6c4;stroke-width:1.6;stroke-dasharray:3 6;stroke-dashoffset:0;opacity:var(--gi,0)}
.tree .pl{stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:.07 .93;opacity:0;animation:flow 3.3s linear infinite;transition:opacity .6s}
.ov.done .tree .pl{opacity:.95}
.bn{transform-box:fill-box;transform-origin:center;scale:0;transition:scale .5s cubic-bezier(.2,1.5,.4,1)}
.bn.on{scale:1}
.bn.hol{fill:var(--paper);stroke:#b9b6c4;stroke-width:1.6}
.s0{fill:var(--lime);stroke:var(--ink);stroke-width:1.6}
.s0p{fill:none;stroke:var(--ink);stroke-width:1;transform-box:fill-box;transform-origin:center;animation:ping 2.4s ease-out infinite}
.tl0{position:absolute;left:0;top:58%;font-size:.6rem;color:var(--mute)}
.bl{position:absolute;left:56%;right:0;display:block;opacity:0;translate:14px -.85rem;transition:opacity .5s,translate .6s cubic-bezier(.2,.7,.2,1)}
.bl.on{opacity:1;translate:0 -.85rem}
.bl b{display:block;font-size:clamp(1.15rem,2.5vw,1.8rem);font-weight:600;letter-spacing:-.03em;line-height:1.1;color:var(--c)}
.bl span{display:block;font-size:clamp(.72rem,1.1vw,.84rem);line-height:1.3;color:var(--mute);margin-top:3px}
a.bl b{background:linear-gradient(var(--c),var(--c)) 0 100%/0 2px no-repeat;display:inline-block;transition:background-size .45s cubic-bezier(.2,.7,.2,1)}
a.bl:hover b{background-size:100% 2px}
.bl.more{translate:14px -.5rem}.bl.more.on{translate:0 -.5rem}
.bl.more b{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}
@media(max-width:600px){.bl b{font-size:1.05rem}.bl span{font-size:.68rem;margin-top:2px}.bl{left:55%}}

/* ===== v2.6: Products page rework ===== */
/* venture 01: dossier + journey track */
.vchip{padding:3px 10px;font-size:.56rem;letter-spacing:.16em;color:#d5d3de;border-color:#4a4a52}
.fcard{position:relative;border:1px solid #2f2f35;border-radius:8px;padding:clamp(22px,3vw,34px);background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.015));overflow:hidden}
.fcard .caps{color:var(--lime);display:flex;align-items:center;gap:10px}
.fcard .caps::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime)}
.fh{font-size:clamp(1.5rem,2.8vw,2.15rem);font-weight:500;letter-spacing:-.03em;line-height:1.1;margin:14px 0 12px;max-width:13ch}
.fseal{position:absolute;right:-34px;top:-34px;width:150px;height:150px;border-radius:50%;border:1px dashed rgba(207,233,74,.5);animation:spin 40s linear infinite}
.fseal::before{content:"";position:absolute;inset:22px;border-radius:50%;border:1px solid rgba(255,255,255,.16)}
.jth{margin-top:clamp(44px,6vw,76px);color:#d5d3de;font-size:.62rem}
.jt{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:26px;position:relative;border-top:1px solid #34343a;--tp:0}
.jt::before{content:"";position:absolute;left:0;top:-1.5px;height:2px;width:calc(var(--tp)*62.5%);background:var(--lime);box-shadow:0 0 14px var(--lime)}
.jt li{padding:24px 18px 0 0;position:relative;opacity:.4;transition:opacity .5s}
.jt li.lit{opacity:1}
.jt li::before{content:"";position:absolute;left:0;top:-7px;width:13px;height:13px;border-radius:50%;background:var(--night);border:1.5px solid #6a6872;transition:background .4s,border-color .4s,box-shadow .4s}
.jt li.dn.lit::before{background:var(--lime);border-color:var(--lime)}
.jt li.now.lit::before{border-color:var(--lime);box-shadow:0 0 0 5px rgba(207,233,74,.22),0 0 18px var(--lime);animation:nowp 2s ease-in-out infinite}
@keyframes nowp{50%{box-shadow:0 0 0 9px rgba(207,233,74,.08),0 0 22px var(--lime)}}
.jt b{display:block;font-size:1.05rem;font-weight:500}
.jt span{display:block;font-size:.82rem;color:#b5b3bf;margin-top:5px}
.jt .caps{font-size:.56rem;color:var(--lime);margin-bottom:6px;display:block}
@media(max-width:760px){
  .jt{grid-template-columns:minmax(0,1fr);border-top:0;border-left:1px solid #34343a}
  .jt::before{left:-1.5px;top:0;width:2px;height:calc(var(--tp)*62.5%)}
  .jt li{padding:0 0 26px 24px}.jt li::before{left:-7px;top:3px}
}

/* approach: a pinned dial instead of the rising dots */
.proc{position:relative;height:340vh;height:340svh;border-top:1px solid var(--line)}
.procpin{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;padding-top:68px;padding-bottom:5vh;overflow:hidden}
.procpin>.wrap{width:100%}
.proc.nopin{height:auto}
.proc.nopin .procpin{position:static;height:auto;padding-block:clamp(56px,8vw,100px)}
.pst{margin-top:26px;display:grid}
.pst button{display:block;width:100%;text-align:left;padding:9px 0 9px 18px;border-left:2px solid var(--line);color:#b3b0bd;transition:color .35s,border-color .35s}
.pst b{display:block;font-size:1.08rem;font-weight:600;letter-spacing:-.01em}
.pst span{display:block;font-size:.88rem;max-height:0;overflow:hidden;opacity:0;transition:max-height .45s,opacity .35s}
.pst li.done button{color:var(--mute);border-color:var(--ink)}
.pst li.on button{color:var(--ink);border-color:#9dbd00}
.pst li.on span{max-height:3.2em;opacity:1;color:var(--mute);margin-top:3px}
.dial{position:relative;width:100%;max-width:460px;aspect-ratio:1;margin-inline:auto}
.dial svg{position:absolute;inset:0;width:100%;height:100%;fill:none}
.dtick{stroke:#c6c3ce;stroke-width:7;stroke-dasharray:.7 5.3}
.dbase{stroke:#dedbd4;stroke-width:3}
.darc{stroke:#b6d421;stroke-width:11}
.dgap{stroke:var(--paper);stroke-width:15;stroke-dasharray:3 69;stroke-dashoffset:1.5}
.dinner{stroke:var(--line);stroke-width:1}
.dneedle{transform-origin:200px 200px}
.dneedle line{stroke:var(--ink);stroke-width:1.5}
.dneedle circle{fill:var(--lime);stroke:var(--ink);stroke-width:1.5}
.dlab{font-size:12px;font-weight:600;letter-spacing:2px;fill:#b9b6c4;transition:fill .4s}
.dlab.on{fill:var(--ink)}
.dialc{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.dialc b{font-size:clamp(3rem,7vw,5.2rem);font-weight:500;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.dialc span{font-size:clamp(1rem,1.8vw,1.35rem);font-weight:500;letter-spacing:-.02em;color:var(--mute);margin-top:6px}
@media(max-width:860px){
  .proc:not(.nopin) .lead{display:none}
  .proc:not(.nopin) .pst li:not(.on){display:none}
  .proc:not(.nopin) .pst{min-height:5.2em;margin-top:14px}
  .procpin .split{gap:14px}
  .dial{max-width:min(84vw,46vh)}
  .proc:not(.nopin) .procpin{align-items:flex-start;padding-top:calc(68px + clamp(14px,3vh,30px))}
}

/* focus areas: expanding panels */
.fx{display:flex;gap:10px;height:clamp(300px,30vw,380px)}
.fp{flex:1 1 0;min-width:0;position:relative;overflow:hidden;border-radius:6px;border:1px solid var(--line);background:#fff;padding:20px 16px;text-align:left;display:flex;flex-direction:column;justify-content:space-between;transition:flex-grow .65s cubic-bezier(.2,.7,.2,1),background-color .45s,color .45s,border-color .45s}
.fp.on{flex-grow:4.4;background-color:var(--night);color:#fff;border-color:var(--night);background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:44px 44px}
.fp .ic{width:30px;height:30px;flex:none;transition:color .4s}
.fp.on .ic{color:var(--lime)}
.fpbg{position:absolute;right:-5%;bottom:-20%;height:120%;aspect-ratio:1;fill:none;stroke:var(--lime);stroke-width:.3;stroke-linecap:round;stroke-linejoin:round;opacity:0;translate:40px 0;transition:opacity .6s,translate .9s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.fp.on .fpbg{opacity:.3;translate:0 0}
.fpx{position:relative;display:block;min-width:0}
.fpt{display:block;font-weight:600;letter-spacing:-.02em;font-size:.94rem;overflow-wrap:anywhere;line-height:1.2;transition:font-size .45s cubic-bezier(.2,.7,.2,1)}
.fp.on .fpt{font-size:clamp(1.5rem,2.6vw,2.1rem)}
.fpd{display:block;width:max-content;max-width:300px;font-size:.92rem;color:#c5c3cf;max-height:0;opacity:0;overflow:hidden;transition:opacity .3s,max-height .5s}
.fp.on .fpd{max-height:4em;opacity:1;margin-top:8px;transition:opacity .5s .25s,max-height .5s}
@media(max-width:760px){
  .fx{flex-direction:column;height:auto}
  .fp{flex:none;min-height:66px;flex-direction:row;align-items:center;justify-content:flex-start;gap:14px;padding:16px 18px;transition:min-height .5s cubic-bezier(.2,.7,.2,1),background-color .45s,color .45s}
  .fp.on{min-height:200px;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:20px}
  .fpbg{height:150%;right:-18%}
}

.fp.on{padding:22px}
@media(max-width:760px){.fp.on{padding:20px}}

/* ===== v2.7: Products compare sets ===== */
.cmp>[data-o]{display:none}
.cmp[data-v="a"]>[data-o="a"],.cmp[data-v="b"]>[data-o="b"]{display:block}
.cmp[data-v="a"]>.bento{display:grid}
.cmp[data-v="b"]>.elist{display:grid}
.night .ovsw .caps{color:#d5d3de}
.night .ovsw .chip{color:#c5c3cf;border-color:#4a4a52}
.night .ovsw .chip[aria-pressed="true"]{background:#fff;color:var(--ink);border-color:#fff}
.cmp>.ovsw{margin-bottom:18px}

/* venture A: cities in motion */
.cmap{position:relative;min-height:clamp(340px,40vw,500px);background-image:radial-gradient(rgba(255,255,255,.1) 1px,transparent 1.4px);background-size:22px 22px;-webkit-mask-image:radial-gradient(75% 75% at 50% 50%,#000 60%,transparent);mask-image:radial-gradient(75% 75% at 50% 50%,#000 60%,transparent)}
.cmap canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}
.vspec{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,2.4fr);margin-top:clamp(36px,5vw,60px);border-top:1px solid #34343a}
.vspec>div{padding:22px 24px 0 0}
.vspec dt{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--lime);margin-bottom:10px}
.vspec dd{font-size:clamp(1.25rem,2.2vw,1.7rem);font-weight:500;letter-spacing:-.025em;line-height:1.15}
.vspec .sm{margin-top:8px;max-width:52ch}
@media(max-width:760px){.vspec{grid-template-columns:repeat(2,minmax(0,1fr))}.vspec .wide{grid-column:1/-1}}

/* venture B: stealth teaser */
.vb{text-align:center}
.vb h2{margin-inline:auto}
.vb .lead{margin-inline:auto;max-width:50ch}
.tease{position:relative;height:clamp(330px,42vw,470px);display:grid;place-items:center;margin:34px 0 18px;--rv:.12}
.tease::before{content:"";position:absolute;width:min(70%,460px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(207,233,74,calc(.1 + var(--rv)*.28)),rgba(207,233,74,0) 68%)}
.tease svg{position:absolute;top:0;bottom:0;left:50%;height:100%;width:auto;aspect-ratio:1/2;translate:-50% 0;fill:none;overflow:visible}
.ty{position:absolute;font-size:clamp(7rem,23vw,18rem);font-weight:600;letter-spacing:-.05em;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.17);white-space:nowrap}
.tb{stroke:rgba(255,255,255,.22);stroke-width:1.5;fill:#0c0c0e}
.tn{fill:#1d1d21}
.tin{stroke:rgba(207,233,74,.6);stroke-width:1;opacity:var(--rv)}
.tpin{fill:var(--lime);stroke:none}
.tgo{fill:rgba(255,255,255,.2);stroke:none}
.tr{stroke-width:2.6;stroke-linecap:round;animation:flow 5.5s linear infinite}
.tr.t1{stroke:var(--lime);stroke-dasharray:.16 .84;filter:drop-shadow(0 0 7px var(--lime))}
.tr.t2{stroke:#fff;stroke-dasharray:.05 .95;animation-delay:-2.75s;filter:drop-shadow(0 0 5px #fff)}
.tcap{color:#b9a8ff;font-size:.66rem;margin-bottom:22px}
.fnote{max-width:54ch;margin:30px auto 0;font-size:.92rem;color:#c5c3cf}
.fnote b{display:block;color:#fff;font-weight:500;font-size:1.25rem;letter-spacing:-.02em;margin-bottom:8px}

/* small live drawings shared by both focus layouts */
.mv{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;overflow:visible;--acc:#a9c81e}
.mv .dr{stroke-dasharray:1;animation:mvdraw 6s ease-in-out infinite}
.mv .wn{fill:var(--acc);animation:mvwin 6s ease-in-out infinite}
.mv .w2{animation-delay:.5s}.mv .w3{animation-delay:1s}
.mv .tk{stroke:var(--acc);stroke-width:2.6;stroke-dasharray:1;animation:mvtick 5s ease-in-out infinite}
.mv .k2{animation-delay:.8s}.mv .k3{animation-delay:1.6s}
.mv .pg{animation:mvpill 5s ease-in-out infinite}
.mv .kn{fill:currentColor;stroke:none;animation:mvknob 5s ease-in-out infinite}
.mv .g2{animation-delay:.7s}.mv .n2{animation-delay:.7s}.mv .g3{animation-delay:1.4s}.mv .n3{animation-delay:1.4s}
.mv .gb{transform-box:fill-box;transform-origin:50% 100%;animation:mvbar 5s cubic-bezier(.2,.7,.2,1) infinite}
.mv4 .g2{animation-delay:.15s}.mv4 .g3{animation-delay:.3s}.mv4 .g4{animation-delay:.45s}.mv4 .g5{animation-delay:.6s}
.mv .gb.ac{fill:var(--acc)}
.mv .gl{stroke:var(--acc);stroke-width:2.2;stroke-dasharray:1;animation:mvline 5s ease-in-out infinite}
.mv .md{transform-box:fill-box;transform-origin:center;animation:mvglobe 6s cubic-bezier(.37,0,.63,1) infinite}
.mv .m2{animation-delay:-2s}.mv .m3{animation-delay:-4s}
.mv .gd{fill:var(--acc);animation:mvwin 3s ease-in-out infinite}
@keyframes mvdraw{0%{stroke-dashoffset:1}32%,88%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}
@keyframes mvwin{0%,30%{opacity:0}42%,86%{opacity:1}100%{opacity:0}}
@keyframes mvtick{0%,12%{stroke-dashoffset:1}26%,84%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:1}}
@keyframes mvpill{0%,12%{fill:transparent}26%,84%{fill:var(--acc)}96%,100%{fill:transparent}}
@keyframes mvknob{0%,12%{transform:none}26%,84%{transform:translateX(18px)}96%,100%{transform:none}}
@keyframes mvbar{0%,6%{transform:scaleY(0)}30%,86%{transform:scaleY(1)}100%{transform:scaleY(0)}}
@keyframes mvline{0%,26%{stroke-dashoffset:1}52%,86%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}
@keyframes mvglobe{from{transform:scaleX(1)}to{transform:scaleX(-1)}}

/* focus A: bento */
.bento{grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(196px,auto);gap:12px}
.bz{position:relative;border:1px solid var(--line);border-radius:8px;background:#fff;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;transition:border-color .35s,translate .45s cubic-bezier(.2,.7,.2,1)}
.bz:hover{border-color:var(--ink);translate:0 -4px}
.bz .mv{position:absolute;right:20px;top:20px;width:min(40%,150px);height:auto}
.bz h3{font-size:1.22rem;margin-bottom:5px}
.bz p{font-size:.88rem;color:var(--mute);max-width:30ch}
.bz1{grid-column:span 3;grid-row:span 2;background:var(--night);color:#fff;border-color:var(--night);background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:44px 44px}
.bz1 .mv{--acc:var(--lime);width:min(64%,330px);right:auto;left:50%;top:42%;translate:-50% -50%}
.bz1 h3{font-size:1.6rem}
.bz1 p{color:#c5c3cf}
.bz1:hover{border-color:var(--lime)}
.bz2,.bz3{grid-column:span 3}
.bz4{grid-column:span 2}
.bz5{grid-column:span 4}
@media(max-width:760px){.bento{grid-template-columns:minmax(0,1fr)}.bz,.bz1{grid-column:auto;grid-row:auto}.bz1{min-height:300px}.bz{min-height:170px}}

/* focus B: editorial list with a viewer */
.elist{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,72px);align-items:center}
.el button{display:block;width:100%;text-align:left;padding:13px 0 13px 20px;border-left:2px solid var(--line);color:#c1bec9;transition:color .35s,border-color .35s}
.el b{display:block;font-size:clamp(1.4rem,2.7vw,2.1rem);font-weight:600;letter-spacing:-.03em;line-height:1.12}
.el span{display:block;font-size:.92rem;max-height:0;opacity:0;overflow:hidden;transition:max-height .45s,opacity .35s}
.el button:hover{color:#8e8a9c}
.el li.on button{color:var(--ink);border-color:#9dbd00}
.el li.on span{max-height:3em;opacity:1;color:var(--mute);margin-top:4px}
.elv{position:relative;min-height:clamp(260px,32vw,400px);border-radius:6px;overflow:hidden;background:linear-gradient(180deg,#fbfbf9,#e8e6e0)}
.elv::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(11,11,12,.05) 1px,transparent 1px) 0 0/100% 12.5%,linear-gradient(90deg,rgba(11,11,12,.05) 1px,transparent 1px) 0 0/8.333% 100%}
.elv .mv{position:absolute;left:19%;top:16%;width:62%;height:68%;opacity:0;scale:.9;transition:opacity .5s,scale .7s cubic-bezier(.2,.7,.2,1);stroke-width:1.3}
.elv .mv.on{opacity:1;scale:1}
@media(max-width:860px){.elist{grid-template-columns:minmax(0,1fr)}}

.bz4 .mv{width:min(34%,112px);top:16px;right:16px}

/* ===== v2.8: the pinned approach block hugs its content, so no empty space is left beneath it ===== */
.proc:not(.nopin){height:auto}
.proc:not(.nopin) .procpin{top:68px;height:auto;display:block;overflow:visible;padding-top:clamp(36px,5vw,64px);padding-bottom:clamp(36px,5vw,64px)}
@media(max-width:860px){.proc:not(.nopin) .procpin{padding-top:clamp(14px,3vh,30px);padding-bottom:26px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.ic{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
[id$="-anchor"]{scroll-margin-top:calc(76px + env(safe-area-inset-top,0px))}
.hero.night{overflow:hidden}
.hero.night .lead{max-width:38ch}
@media(max-width:860px){.hero.night>.slit{right:7%;opacity:.4}.hero.night .slit .fig{display:none}}
@media(max-width:600px){.eco .t small{display:none}.pane .tag{font-size:.5rem;letter-spacing:.12em}}

@media(min-width:861px){.split.s39{grid-template-columns:minmax(0,3fr) minmax(0,9fr)}.split.s48{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}}
.fig{aspect-ratio:24/64}

.cards.five{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(196px,1fr);overflow-x:auto;padding-bottom:10px;scroll-snap-type:x proximity}
.cards.five>*{scroll-snap-align:start}
@media(max-width:700px){.cards.five{grid-auto-columns:78%}}
.loopbox{max-width:920px;margin-inline:auto}
@media(max-width:700px){.tag.opp{top:70%!important}}

/* ===== v2.8: Products closing line, three designs ===== */
.cmp[data-v="c"]>[data-o="c"]{display:block}
.odo{display:flex}
.nextband{padding-block:clamp(40px,6vw,76px)}
.nextline{font-size:clamp(1.5rem,3.5vw,2.6rem);line-height:1.12;letter-spacing:-.035em;font-weight:500}
.nextline .sf{display:inline-block}
.nd{display:inline-block;width:.4em;height:.4em;border-radius:50%;background:#b6d421;margin-right:.5em;vertical-align:.14em;animation:ndp 2.6s ease-out infinite}
@keyframes ndp{0%{box-shadow:0 0 0 0 rgba(182,212,33,.55)}70%,100%{box-shadow:0 0 0 .5em rgba(182,212,33,0)}}
/* B: counter */
.odo{align-items:center;gap:clamp(14px,4vw,60px)}
.oc{min-width:0;flex:none}
.ocap{font-size:.62rem;color:var(--mute);margin-bottom:10px;white-space:nowrap}
.ocap .nd{width:.7em;height:.7em;vertical-align:-.02em}
.onum{font-size:clamp(4.4rem,15vw,11rem);font-weight:500;letter-spacing:-.06em;line-height:.92;font-variant-numeric:tabular-nums}
.oroll{height:.92em;overflow:hidden;-webkit-mask-image:linear-gradient(transparent,#000 16%,#000 84%,transparent);mask-image:linear-gradient(transparent,#000 16%,#000 84%,transparent)}
.oroll>div{animation:oroll 9s cubic-bezier(.7,0,.25,1) infinite}
.oroll span{display:block;height:.92em;color:transparent;-webkit-text-stroke:1.5px #a29fb0}
@keyframes oroll{0%,22%{transform:none}33%,55%{transform:translateY(-.92em)}66%,88%{transform:translateY(-1.84em)}100%{transform:translateY(-2.76em)}}
.otx{font-size:clamp(.95rem,1.5vw,1.2rem);font-weight:500;letter-spacing:-.015em;margin-top:12px}
.oline{flex:1;min-width:20px;height:3px;position:relative;overflow:hidden;background:repeating-linear-gradient(90deg,#c6c3ce 0 4px,transparent 4px 9px) 0 1px/100% 1px no-repeat}
.oline i{position:absolute;top:-1px;left:0;width:56px;height:3px;border-radius:2px;background:linear-gradient(90deg,transparent,#9dbd00);animation:oline 3s linear infinite}
@keyframes oline{from{transform:translateX(-60px)}to{transform:translateX(min(60vw,640px))}}
@media(max-width:560px){.otx{max-width:11ch}}
/* C: scan across the lattice */
.scanbox{position:relative;height:clamp(190px,24vw,270px);margin-top:clamp(18px,3vw,30px);-webkit-mask-image:linear-gradient(90deg,#000 72%,transparent);mask-image:linear-gradient(90deg,#000 72%,transparent)}
.scanbox canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}
@media(prefers-reduced-motion:reduce){.nd,.oroll>div,.oline i{animation:none}}

/* ===== v3.0: Capabilities ===== */
/* hero: three gates */
.gates{position:relative;aspect-ratio:1/.72;width:100%;max-width:640px;margin-inline:auto}
.gates canvas{position:absolute;inset:0;width:100%;height:100%}
.gl{position:absolute;left:0;top:0;padding-left:12px;font-size:.74rem;line-height:1.5;color:var(--mute);white-space:nowrap;will-change:transform}
.gl b{display:block;position:relative;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--ink);margin-bottom:3px}
.gl b i{position:absolute;left:-12px;top:.38em;width:6px;height:6px;border-radius:50%;background:#9dbd00}
.g-blue b i{background:var(--blue)}.g-violet b i{background:var(--violet)}
.gl span{display:block}
@media(max-width:760px){.gl span{display:none}.gates{aspect-ratio:1/.74}}

/* two ways: one team, two paths */
.fork{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,5vw,72px)}
.fbar{grid-column:1/-1;position:relative;height:1px;background:var(--line)}
.fbar .caps{position:absolute;left:50%;top:50%;translate:-50% -50%;background:var(--paper);border:1px solid var(--ink);border-radius:99px;padding:7px 14px;font-size:.6rem;white-space:nowrap}
.fbar i{position:absolute;top:-1px;height:3px;width:64px;border-radius:2px}
.fbar .f1{background:linear-gradient(270deg,transparent,#9dbd00);animation:fk1 3.4s ease-in infinite}
.fbar .f2{background:linear-gradient(90deg,transparent,#9dbd00);animation:fk2 3.4s ease-in infinite}
@keyframes fk1{0%{right:50%;opacity:0}12%{opacity:1}80%{opacity:1}100%{right:calc(100% - 64px);opacity:0}}
@keyframes fk2{0%{left:50%;opacity:0}12%{opacity:1}80%{opacity:1}100%{left:calc(100% - 64px);opacity:0}}
.fcol{position:relative;border-left:1px solid var(--line);padding:38px 0 6px clamp(16px,2.4vw,30px)}
.fl{display:block;font-size:clamp(3.6rem,7.5vw,6rem);font-weight:500;line-height:.92;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px #a29fb0;transition:color .45s,-webkit-text-stroke-color .45s;margin-bottom:18px}
.fcol:hover .fl{color:var(--ink);-webkit-text-stroke-color:var(--ink)}
.fcol h3{font-size:1.4rem;font-weight:500;letter-spacing:-.025em;margin-bottom:8px}
.fcol .sm{font-size:.95rem;max-width:40ch}
@media(max-width:640px){.fork{grid-template-columns:minmax(0,1fr)}.fcol{padding-top:30px}.fcol+.fcol{margin-top:8px}}

/* five capabilities: exploded stack */
.capx{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(20px,5vw,72px);align-items:center}
.cstack svg{display:block;width:100%;max-width:520px;height:auto;margin-inline:auto;overflow:visible;--g:62}
.pl{cursor:pointer;outline:none;transform:translate(0,calc(var(--i)*var(--g)*1px));transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.pl.on{transform:translate(30px,calc(var(--i)*var(--g)*1px - 6px))}
.pt{fill:#fff;stroke:var(--ink);stroke-width:1;vector-effect:non-scaling-stroke;transition:fill .4s}
.ps{stroke:var(--ink);stroke-width:1;stroke-linejoin:round;transition:fill .4s}
.s1{fill:#e6e3db}.s2{fill:#d2cfc6}
.pp{fill:none;stroke:var(--ink);stroke-width:1;opacity:.5;transition:opacity .4s}
.pp *{vector-effect:non-scaling-stroke}
.pp .pf{opacity:.4}
.pp .pa{fill:#b6d421}
.pp .pb{stroke-width:6;opacity:.3}
.pp .pl2{stroke-width:1.7}
.pl:hover .pt,.pl:focus-visible .pt{fill:#f2f7d3}
.pl:focus-visible .pt{stroke-width:2}
.pl.on .pt{fill:var(--lime)}.pl.on .s1{fill:#b6d421}.pl.on .s2{fill:#9dbd00}
.pl.on .pp{opacity:.95}.pl.on .pp .pa{fill:var(--ink)}
.pc{stroke:#b9b6c4;stroke-width:1;stroke-dasharray:2 3;fill:none;transition:stroke .3s}
.pn{font-size:12px;font-weight:600;letter-spacing:2px;fill:#b9b6c4;transition:fill .3s}
.pl.on .pc{stroke:var(--ink)}.pl.on .pn{fill:var(--ink)}
.clist{border-top:1px solid var(--line)}
.clist>li{border-bottom:1px solid var(--line)}
.clist button{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:baseline;gap:14px;width:100%;text-align:left;padding:17px 0;color:#a5a2b0;transition:color .35s}
.clist .n{font-size:.66rem;font-weight:600;letter-spacing:.14em}
.clist b{font-size:clamp(1.15rem,2vw,1.55rem);font-weight:500;letter-spacing:-.025em;line-height:1.15}
.clist button i{width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;rotate:45deg;transition:rotate .45s;align-self:center;margin:0 6px 4px 0}
.clist button:hover,.clist li.on button{color:var(--ink)}
.clist li.on button i{rotate:-135deg;margin-bottom:-4px}
.cbody{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s cubic-bezier(.2,.7,.2,1)}
.cbody>div{overflow:hidden;min-height:0;padding-left:36px}
.clist li.on .cbody{grid-template-rows:1fr}
.cbody .sm{font-size:.95rem;max-width:46ch}
.ck2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;margin:14px 0 22px;font-size:.86rem}
.ck2 li{position:relative;padding-left:20px;opacity:0;translate:0 6px;transition:opacity .4s,translate .4s}
.ck2 li::before{content:"";position:absolute;left:1px;top:.36em;width:9px;height:5px;border-left:1.6px solid #7d9800;border-bottom:1.6px solid #7d9800;rotate:-45deg}
.clist li.on .ck2 li{opacity:1;translate:none;transition-delay:calc(.18s + var(--k)*55ms)}
@media(max-width:860px){.capx{grid-template-columns:minmax(0,1fr)}.cstack svg{max-width:min(100%,400px)}}
@media(max-width:480px){.ck2{grid-template-columns:minmax(0,1fr)}.cbody>div{padding-left:0}}

/* approach: a trajectory that draws as you scroll */
.traj{margin-top:clamp(34px,5vw,60px);--p:0}
.tplot{position:relative;height:clamp(170px,22vw,260px)}
.tplot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none}
.tplot path{vector-effect:non-scaling-stroke}
.tgrid{stroke:rgba(255,255,255,.08);stroke-width:1}
.tdrop{stroke:rgba(255,255,255,.2);stroke-width:1;stroke-dasharray:2 4}
.tbase{stroke:rgba(255,255,255,.2);stroke-width:1.2}
.tlit{clip-path:inset(-30px calc(100% - var(--p)*100%) -30px 0)}
.tline{stroke-width:2.4;stroke-linecap:round}
.tarea{fill:rgba(207,233,74,.07);stroke:none}
.tax{position:absolute;font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:#8a8798}
.tax.a1{left:0;bottom:calc(10% + 16px)}
.tax.a2{right:0;top:-4px}
.tn{position:absolute;width:13px;height:13px;margin:0 0 -6.5px -6.5px;border-radius:50%;background:var(--night);border:1.5px solid #6a6876;transition:background .4s,border-color .4s,box-shadow .5s,scale .5s}
.tn.on{background:var(--lime);border-color:var(--lime);box-shadow:0 0 0 5px rgba(207,233,74,.16),0 0 22px rgba(207,233,74,.7);scale:1.15}
.thead{position:absolute;left:calc(var(--p)*100%);bottom:var(--hy,10%);width:7px;height:7px;margin:0 0 -3.5px -3.5px;border-radius:50%;background:#fff;box-shadow:0 0 14px 4px rgba(255,255,255,.65);opacity:var(--ho,0);transition:opacity .3s}
.tl{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin-top:20px}
.tl li{padding-right:16px;color:#77748a;transition:color .4s}
.tl .n{display:block;font-size:.62rem;font-weight:600;letter-spacing:.14em;margin-bottom:8px;transition:color .4s}
.tl h3{font-size:1.05rem;color:#8d8a9c;margin:0 0 6px;transition:color .4s}
.tl p{font-size:.82rem;line-height:1.45}
.tl li.on{color:#c5c3cf}.tl li.on h3{color:#fff}.tl li.on .n{color:var(--lime)}
@media(max-width:760px){.tl{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 18px;margin-top:26px}.tl li{padding-right:0}}

/* tech stack: a spec sheet */
.spec{border-top:1px solid var(--line)}
.spec>li{position:relative;display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:6px 20px;align-items:baseline;padding:17px 0;border-bottom:1px solid var(--line)}
.spec .caps{font-size:.6rem;color:var(--mute);transition:color .3s}
.spec p{display:flex;flex-wrap:wrap;row-gap:4px;font-size:clamp(1.05rem,1.7vw,1.3rem);font-weight:500;letter-spacing:-.02em}
.spec p span:not(:last-child)::after{content:"/";margin:0 .6em;color:#c9c6d1;font-weight:400}
.spec>li::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--ink);scale:0 1;transform-origin:0 50%;transition:scale .6s cubic-bezier(.2,.7,.2,1)}
.spec>li:hover::after{scale:1 1}
.spec>li:hover .caps{color:var(--ink)}
@media(max-width:560px){.spec>li{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.fbar i{animation:none;opacity:0}.pl,.cbody,.ck2 li{transition:none}}

/* ===== v3.1: Capabilities, version B (compare) ===== */
.hero .cmp>.ovsw{margin-bottom:4px}
/* hero B: noise to signal */
.wavebox{position:relative;aspect-ratio:1/.72;width:100%;max-width:640px;margin-inline:auto}
.wavebox canvas{position:absolute;inset:0;width:100%;height:100%}
@media(max-width:760px){.wavebox{aspect-ratio:1/.74}}
/* how we work A: two lanes through one team */
.cmp[data-v="c"]>[data-o="c"]{display:block}
.lanes{display:grid;grid-template-columns:minmax(0,1fr) clamp(36px,6vw,84px) minmax(200px,280px) clamp(36px,6vw,84px) minmax(0,1fr);grid-template-areas:"a1 la1 team la2 a2" "b1 lb1 team lb2 b2";row-gap:clamp(26px,3.6vw,48px);align-items:center}
.lanes .a1{grid-area:a1}.lanes .a2{grid-area:a2}.lanes .b1{grid-area:b1}.lanes .b2{grid-area:b2}
.lanes .la1{grid-area:la1}.lanes .la2{grid-area:la2}.lanes .lb1{grid-area:lb1}.lanes .lb2{grid-area:lb2}
.lc{min-width:0;transition:opacity .35s}
.lc .caps{display:flex;align-items:center;gap:8px;font-size:.6rem;color:var(--mute);margin-bottom:10px}
.lc .caps i,.oc2 .caps i{width:8px;height:8px;border-radius:50%;background:#9dbd00}
.lc[data-l="b"] .caps i,.oc2[data-l="b"] .caps i{background:var(--violet)}
.lc h3{font-size:1.45rem;font-weight:500;letter-spacing:-.025em;margin:0 0 6px}
.lc p:not(.caps){font-size:.95rem;color:var(--mute);max-width:32ch}
.lc .lo{font-size:1.05rem;font-weight:500;letter-spacing:-.015em;color:var(--ink)}
.lc .lnk{margin-top:14px}
.ln{--lc:#9dbd00;position:relative;display:block;height:3px;overflow:hidden;background:linear-gradient(#c9c6d1,#c9c6d1) 0 1px/100% 1px no-repeat;transition:opacity .35s}
.ln.lb1,.ln.lb2{--lc:var(--violet)}
.ln::after{content:"";position:absolute;left:0;top:0;width:34px;height:3px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--lc));animation:lnx 2.6s linear infinite}
.ln.la2::after{animation-delay:-1.3s}.ln.lb1::after{animation-delay:-.7s}.ln.lb2::after{animation-delay:-2s}
@keyframes lnx{from{transform:translateX(-40px)}to{transform:translateX(96px)}}
@keyframes lny{from{transform:translateY(-34px)}to{transform:translateY(52px)}}
.team{grid-area:team;align-self:stretch;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;min-height:240px;padding:26px 24px;border-radius:8px;background:var(--night);color:#fff}
.team .tg{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.14) 1px,transparent 1.4px);background-size:18px 18px;-webkit-mask-image:radial-gradient(90% 90% at 80% 20%,#000,transparent);mask-image:radial-gradient(90% 90% at 80% 20%,#000,transparent)}
.team .caps{position:relative;font-size:.6rem;color:var(--lime);margin-bottom:12px}
.team .tt{position:relative;font-size:clamp(1.2rem,1.9vw,1.5rem);font-weight:500;letter-spacing:-.025em;line-height:1.18}
.lanes.ha [data-l="b"],.lanes.ha .lb1,.lanes.ha .lb2,.lanes.hb [data-l="a"],.lanes.hb .la1,.lanes.hb .la2{opacity:.35}
@media(max-width:820px){
  .lanes{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"a1 b1" "la1 lb1" "team team" "la2 lb2" "a2 b2";gap:0 18px;align-items:start}
  .ln{width:3px;height:40px;margin:12px 0 12px 3px;background:linear-gradient(#c9c6d1,#c9c6d1) 1px 0/1px 100% no-repeat}
  .ln::after{width:3px;height:30px;background:linear-gradient(180deg,transparent,var(--lc));animation-name:lny}
  .team{min-height:0;padding:22px 20px}
  .lc h3{font-size:1.2rem}
  .lc .lo{font-size:.98rem}
  .lanes .lnk{font-size:.82rem;gap:8px;white-space:nowrap}
}
/* how we work B: one core, two orbits */
.orb2{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,400px) minmax(0,1fr);gap:clamp(16px,3vw,44px);align-items:center}
.oc2{transition:opacity .35s}
.oc2 .caps{display:flex;align-items:center;gap:8px;font-size:.6rem;color:var(--mute);margin-bottom:10px}
.oc2 h3{font-size:1.45rem;font-weight:500;letter-spacing:-.025em;margin:0 0 8px}
.oc2 .sm{font-size:.95rem;max-width:34ch}
.ov2 svg{display:block;width:100%;height:auto;overflow:visible;fill:none}
.ov2 path{stroke-width:1.2;transition:stroke-width .35s,opacity .35s}
.orA path{stroke:#9dbd00}.orB path{stroke:var(--violet)}
.ov2 .ob{opacity:.45;stroke-dasharray:3 4}
.ov2 .core{stroke:var(--lime);stroke-width:1.4}
.ov2 text{font-size:8.5px;font-weight:600;letter-spacing:2.2px;fill:#fff}
.sat.sa{fill:var(--lime);stroke:var(--ink);stroke-width:1.4}
.sat.sb{fill:var(--violet);stroke:var(--ink);stroke-width:1.4}
.orb2.ha .orA path,.orb2.hb .orB path{stroke-width:2.4;opacity:1}
.orb2.ha .orB,.orb2.hb .orA,.orb2.ha .oc2[data-l="b"],.orb2.hb .oc2[data-l="a"]{opacity:.3}
.orA,.orB{transition:opacity .35s}
@media(max-width:820px){.orb2{grid-template-columns:minmax(0,1fr);gap:26px}.ov2{order:-1;max-width:340px;margin-inline:auto;width:100%}}
/* approach B: steps */
.stairs{margin-top:clamp(34px,5vw,60px)}
.st{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:end}
.st>li{display:flex;flex-direction:column;justify-content:flex-end;color:#77748a;transition:color .4s}
.stx{padding:0 14px 14px 0}
.st .n{display:block;font-size:.62rem;font-weight:600;letter-spacing:.14em;margin-bottom:8px;transition:color .4s}
.st h3{font-size:1.05rem;color:#8d8a9c;margin:0 0 6px;transition:color .4s}
.st p{font-size:.82rem;line-height:1.45}
.sb{position:relative;display:block;height:calc(24px + var(--i)*38px);border-top:2px solid #3b3a44;border-left:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,0) 92%),repeating-linear-gradient(0deg,transparent 0 18px,rgba(255,255,255,.045) 18px 19px);transition:border-color .5s,box-shadow .6s}
.sb::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(207,233,74,.24),rgba(207,233,74,0) 92%);opacity:0;transition:opacity .6s}
.sb::after{content:"";position:absolute;left:10px;top:-6px;width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 14px 4px rgba(255,255,255,.7);opacity:0;scale:.4;transition:opacity .4s,scale .4s}
.st>li.on{color:#c5c3cf}.st>li.on h3{color:#fff}.st>li.on .n{color:var(--lime)}
.st>li.on .sb{border-top-color:var(--lime);box-shadow:0 -12px 30px -12px rgba(207,233,74,.6)}
.st>li.on .sb::before{opacity:1}
.st>li.cur .sb::after{opacity:1;scale:1}
@media(max-width:760px){
  .st{grid-template-columns:minmax(0,1fr);gap:20px}
  .stx{padding:0 0 10px}
  .sb{height:5px;width:calc(28% + var(--i)*14.4%);border:0;border-radius:3px;background:rgba(255,255,255,.1)}
  .sb::before{border-radius:3px;background:var(--lime)}
  .st>li.on .sb{box-shadow:0 0 18px -2px rgba(207,233,74,.6)}
  .sb::after{left:auto;right:-4px;top:-2px}
}
/* tech stack B: moving rows */
.mq{display:grid;gap:10px;overflow:hidden;padding-block:4px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.mqt{display:flex;gap:10px;width:max-content;animation:mqm 30s linear infinite}
.mqr:nth-child(2) .mqt{animation-direction:reverse;animation-duration:36s}
.mqr:nth-child(3) .mqt{animation-duration:26s}
.mq:hover .mqt{animation-play-state:paused}
.mqt span{flex:none;padding:13px 22px;border:1px solid var(--line);border-radius:99px;background:#fff;font-size:clamp(1rem,1.6vw,1.22rem);font-weight:500;letter-spacing:-.02em;transition:background .25s,color .25s,border-color .25s}
.mqt span:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
@keyframes mqm{to{transform:translateX(calc(-50% - 5px))}}
@media(prefers-reduced-motion:reduce){.mqt{animation:none;flex-wrap:wrap;width:auto}.mqt [aria-hidden]{display:none}.mq{-webkit-mask-image:none;mask-image:none}.seal svg{animation:none}}
/* approach C: a horizontal track that moves as you scroll */
.night.apx{overflow:clip}
.hz{position:relative;margin-top:clamp(26px,4vw,48px)}
.hzpin{position:sticky;top:68px;padding:12px 0 10px}
.hzbar{position:relative;height:1px;background:rgba(255,255,255,.18);margin-right:84px}
.hzbar i{position:absolute;left:0;top:-1px;width:100%;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--lime),#a98bff);transform-origin:0 50%;transform:scaleX(var(--p,0))}
.hzc{position:absolute;right:0;top:6px;font-size:.62rem;color:#8a8798}
.hzc b{color:#fff;font-weight:600}
.hzw{overflow:hidden;overflow:clip;margin-top:clamp(20px,3vw,36px);-webkit-mask-image:linear-gradient(90deg,#000 80%,transparent);mask-image:linear-gradient(90deg,#000 80%,transparent)}
.hzt{display:flex;width:max-content;padding-right:22vw;will-change:transform}
.hzt li{flex:none;width:clamp(260px,36vw,440px);padding-right:clamp(24px,4vw,60px)}
.hn{display:block;font-size:clamp(6rem,15vw,11.5rem);font-weight:500;letter-spacing:-.06em;line-height:.9;font-variant-numeric:tabular-nums;color:transparent;-webkit-text-stroke:1.5px #5d5b69;transition:color .5s,-webkit-text-stroke-color .5s}
.hzt li.done .hn{color:#232327;-webkit-text-stroke-color:#45444f}
.hzt li.on .hn{color:#fff;-webkit-text-stroke-color:#fff}
.hzt h3{font-size:clamp(1.3rem,2.2vw,1.8rem);font-weight:500;letter-spacing:-.025em;color:#8d8a9c;margin:18px 0 8px;transition:color .4s}
.hzt p{font-size:.95rem;color:#77748a;max-width:30ch;transition:color .4s}
.hzt li.on h3{color:#fff}.hzt li.on p{color:#c5c3cf}
@media(max-width:760px){.hzw{-webkit-mask-image:linear-gradient(90deg,#000 90%,transparent);mask-image:linear-gradient(90deg,#000 90%,transparent)}}
.hz.nopin .hzpin{position:static}
.hz.nopin .hzw{-webkit-mask-image:none;mask-image:none}
.hz.nopin .hzt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:auto;padding:0;gap:30px 0}
.hz.nopin .hzt li{width:auto}
.hz.nopin .hn{color:#fff;-webkit-text-stroke-color:#fff;font-size:clamp(4rem,8vw,6rem)}
.hz.nopin .hzbar,.hz.nopin .hzc{display:none}
/* approach D: the same moving track, filling the whole screen */
.cmp[data-v="d"]>[data-o="d"]{display:block}
.hx{position:relative;margin-top:clamp(18px,3vw,34px)}
.hxpin{position:sticky;top:68px;height:calc(100vh - 68px);height:calc(100svh - 68px);min-height:420px;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(14px,3vh,30px) 0 clamp(40px,7vh,64px);--fs:min(38vh,58vw,360px)}
.hxbg{position:absolute;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;pointer-events:none;
  background:radial-gradient(42vmax 34vmax at 22% 46%,rgba(207,233,74,.09),transparent 70%),radial-gradient(rgba(255,255,255,.13) 1px,transparent 1.5px) var(--bg,0px) 0/26px 26px;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(180deg,transparent,#000 14%,#000 86%,transparent)}
.hxc{position:relative;align-self:flex-end;font-size:.62rem;color:#8a8798}
.hxc b{color:#fff;font-weight:600}
.hxw{position:relative;flex:1;min-height:0;display:flex;align-items:center;overflow:hidden;overflow:clip;-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
.hxt{display:flex;width:max-content;will-change:transform}
.hxt li{flex:none;width:calc(var(--fs)*1.45);opacity:.5;transition:opacity .5s}
.hxt li.on{opacity:1}
.hn2{display:block;font-size:var(--fs);font-weight:500;letter-spacing:-.065em;line-height:.86;font-variant-numeric:tabular-nums;color:transparent;-webkit-text-stroke:1.5px #6a6876;transition:color .5s,-webkit-text-stroke-color .5s}
.hxt li.done .hn2{color:#232327;-webkit-text-stroke-color:#45444f}
.hxt li.on .hn2{color:#fff;-webkit-text-stroke-color:#fff}
.hxx{margin-top:clamp(12px,2.6vh,28px);transform:translateX(var(--par,0px))}
.hxx h3{font-size:clamp(1.45rem,2.6vw,2.2rem);font-weight:500;letter-spacing:-.03em;color:#fff;margin:0 0 8px}
.hxx p{font-size:clamp(.95rem,1.3vw,1.1rem);color:#c5c3cf;max-width:30ch}
.hxr{position:relative;display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.2)}
.hxr::before{content:"";position:absolute;left:0;top:-2px;width:100%;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--lime),#a98bff);transform-origin:0 50%;transform:scaleX(var(--p,0))}
.hxr li{position:relative;width:0}
.hxr button{position:absolute;left:0;top:-7px;translate:-50% 0;display:grid;justify-items:center;gap:9px;padding:0 4px;color:#77748a;font-size:.56rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;transition:color .35s}
.hxr li:first-child button{translate:-6px 0;justify-items:start}
.hxr li:last-child button{translate:calc(-100% + 6px) 0;justify-items:end}
.hxr i{width:11px;height:11px;border-radius:50%;background:var(--night);border:1.5px solid #6a6876;transition:background .35s,border-color .35s,box-shadow .4s}
.hxr em{display:none;font-style:normal}
.hxr li.done i{background:var(--lime);border-color:var(--lime)}
.hxr li.on i{background:var(--lime);border-color:var(--lime);box-shadow:0 0 0 5px rgba(207,233,74,.18),0 0 20px rgba(207,233,74,.75)}
.hxr li.done button,.hxr button:hover{color:#c5c3cf}
.hxr li.on button{color:#fff}
@media(max-width:760px){.hxr span{display:none}.hxr em{display:block}.hxw{-webkit-mask-image:linear-gradient(90deg,#000 92%,transparent);mask-image:linear-gradient(90deg,#000 92%,transparent)}}
.hx.nopin .hxpin{position:static;height:auto;min-height:0;display:block;padding:0;--fs:clamp(4rem,8vw,6rem)}
.hx.nopin .hxbg,.hx.nopin .hxc,.hx.nopin .hxr{display:none}
.hx.nopin .hxw{-webkit-mask-image:none;mask-image:none}
.hx.nopin .hxt{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));width:auto;gap:30px 20px}
.hx.nopin .hxt li{width:auto;opacity:1}
.hx.nopin .hn2{color:#fff;-webkit-text-stroke-color:#fff}
@media(prefers-reduced-motion:reduce){.ln::after{animation:none;opacity:0}}

/* ===== v3.4: Ecosystem ===== */
/* hero: a small solar system */
.orrery{position:relative;aspect-ratio:1/.86;width:100%;max-width:660px;margin-inline:auto}
.orrery canvas{position:absolute;inset:0;width:100%;height:100%}
.ol{position:absolute;left:0;top:0;text-align:center;white-space:nowrap;font-size:.72rem;line-height:1.4;color:var(--mute);will-change:transform,opacity;pointer-events:none}
.ol b{display:block;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--ink)}
@media(max-width:760px){.ol span{display:none}.ol b{font-size:.52rem}.orrery{aspect-ratio:1/.9}}

/* our companies: three tabs, one sphere */
.cotabs{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.cotabs button{display:flex;align-items:baseline;gap:12px;padding:18px 12px 18px 0;text-align:left;color:#a5a2b0;transition:color .35s}
.cotabs .n{font-size:.62rem;font-weight:600;letter-spacing:.14em}
.cotabs b{font-size:clamp(.66rem,1.15vw,.86rem);font-weight:700;letter-spacing:.2em;text-transform:uppercase;line-height:1.35}
.cotabs button:hover,.cotabs button.on{color:var(--ink)}
.coline{position:absolute;left:0;top:-2px;width:33.333%;height:3px;background:#b6d421;transition:transform .6s cubic-bezier(.2,.7,.2,1),background .5s}
.cos[data-k="1"] .coline{background:var(--violet)}
.cos[data-k="2"] .coline{background:#a9a6b6}
.copanel{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,5vw,80px);align-items:center;margin-top:clamp(20px,3vw,40px)}
.covis{position:relative;aspect-ratio:1;width:100%;max-width:400px;margin-inline:auto}
.covis .orb{position:absolute;inset:19%;opacity:0;scale:.82;transition:opacity .7s,scale .9s cubic-bezier(.2,.7,.2,1);animation:cofloat 7s ease-in-out infinite}
.covis .orb.on{opacity:1;scale:1}
@keyframes cofloat{0%,100%{translate:0 0}50%{translate:0 -9px}}
.coring{position:absolute;inset:5%;border-radius:50%;border:1px dashed rgba(11,11,12,.26);animation:spin 60s linear infinite}
.coring::after{content:"";position:absolute;left:50%;top:-5px;width:9px;height:9px;margin-left:-4.5px;border-radius:50%;background:var(--ink)}
.coring.r2{inset:12%;border:1px solid rgba(11,11,12,.1);animation-duration:38s;animation-direction:reverse}
.coring.r2::after{width:6px;height:6px;top:-3.5px;margin-left:-3px;background:#b6d421;transition:background .5s}
.cos[data-k="1"] .coring.r2::after{background:var(--violet)}
.cos[data-k="2"] .coring.r2::after{background:#a9a6b6}
.cotxt{display:grid}
.cotxt article{grid-area:1/1;opacity:0;visibility:hidden;translate:0 14px;transition:opacity .45s,translate .6s cubic-bezier(.2,.7,.2,1),visibility 0s .45s}
.cotxt article.on{opacity:1;visibility:visible;translate:none;transition-delay:.12s,.12s,0s}
.cotxt h3{font-size:clamp(1.7rem,3.2vw,2.5rem);font-weight:500;letter-spacing:-.035em;line-height:1.05;margin-bottom:10px}
.cot{font-weight:600;font-size:.95rem;margin-bottom:10px}
.cotxt .sm{font-size:.98rem;max-width:48ch}
.cotxt article.on .ck2 li{opacity:1;translate:none;transition-delay:calc(.25s + var(--k)*55ms)}
.cotxt .ck2{margin:18px 0 20px}
@media(max-width:860px){.copanel{grid-template-columns:minmax(0,1fr)}.covis{max-width:270px}.cotabs button{flex-direction:column;gap:6px;padding-right:8px}}

/* stronger together: a living loop */
.inf{position:relative;aspect-ratio:560/300;width:100%}
.inf canvas{position:absolute;inset:0;width:100%;height:100%}
.il{position:absolute;top:50%;translate:-50% -50%;text-align:center;color:#fff}
.il.l{left:24.6%}.il.r{left:75.4%}
.il b{display:block;font-size:clamp(.58rem,1.25vw,.82rem);letter-spacing:.2em;text-transform:uppercase;font-weight:700;line-height:1.45}
.il small{display:block;margin-top:6px;font-size:clamp(.5rem,.95vw,.68rem);color:#c5c3cf;white-space:nowrap}
.it,.ib{position:absolute;left:50%;translate:-50% 0;font-size:.7rem;color:#c5c3cf;white-space:nowrap}
.it{top:0}.ib{bottom:0}
.loop ul li{animation:lip 6.4s ease-in-out infinite}
.loop ul li:nth-child(2){animation-delay:1.6s}.loop ul li:nth-child(3){animation-delay:3.2s}.loop ul li:nth-child(4){animation-delay:4.8s}
@keyframes lip{0%,34%,100%{color:#a9a6b6}8%,22%{color:#fff}}
.loopbox .pill{position:relative}
.loopbox .pill::before{content:"";position:absolute;left:50%;bottom:100%;width:1px;height:22px;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.5))}
@media(max-width:760px){.inf{grid-column:1/-1;grid-row:1}.il small{display:none}.it,.ib{font-size:.6rem}}

/* why an ecosystem: the sum */
.sumrow{align-items:center;grid-template-columns:minmax(0,4fr) minmax(0,7fr)}
.sumx{display:flex;align-items:flex-start;justify-content:flex-end;gap:clamp(8px,1.6vw,22px);font-size:clamp(3.3rem,7.6vw,7.6rem);font-weight:500;letter-spacing:-.05em;line-height:.9}
.sumx>i,.sumx .sop{flex:none}
.sumx>span{display:grid;justify-items:center;gap:12px}
.sumx b{font-weight:500;color:transparent;-webkit-text-stroke:1.5px var(--sc,#9dbd00)}
.sumx .c-v{--sc:var(--violet)}.sumx .c-g{--sc:#a29fb0}
.sumx small{display:flex;justify-content:center;width:0;white-space:nowrap;font-size:.54rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;line-height:1.5;color:var(--mute);text-align:center}
.sumx>i{font-style:normal;font-weight:300;color:#b9b6c4;font-size:.6em;line-height:1.5}
.sop{position:relative;width:.7em;height:.9em;font-size:.8em;margin:.06em .26em 0 .04em}
.sop em{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;font-weight:400;transition:opacity .6s 1s,scale .7s 1s cubic-bezier(.2,.7,.2,1),rotate .7s 1s}
.sop .eq{color:#b9b6c4}
.sop .gt{color:#8fae00;opacity:0;scale:.4;rotate:-40deg}
.sumx.in .eq{opacity:0;scale:.4}
.sumx.in .gt{opacity:1;scale:1;rotate:0deg}
.s3 b{color:var(--ink);-webkit-text-stroke:0;position:relative;transition:scale .8s 1.1s cubic-bezier(.2,.7,.2,1);transform-origin:50% 80%}
.s3 b::after{content:"";position:absolute;left:4%;right:4%;bottom:-.06em;height:.07em;border-radius:99px;background:var(--lime);scale:0 1;transform-origin:0 50%;transition:scale .7s 1.5s cubic-bezier(.2,.7,.2,1)}
.sumx.in .s3 b{scale:1.1}
.sumx.in .s3 b::after{scale:1 1}
.sumcols{margin-top:clamp(34px,5vw,64px)}
@media(max-width:860px){.sumrow{grid-template-columns:minmax(0,1fr)}.sumx{justify-content:flex-start;margin-top:10px;padding-left:20px}}
@media(max-width:480px){.sumx small{font-size:.44rem;letter-spacing:.12em}.sumx{gap:12px}}
@media(prefers-reduced-motion:reduce){.covis .orb,.coring,.loop ul li{animation:none}.loop ul li{color:#c5c3cf}}

/* ===== v3.5: Ecosystem, option B for hero and companies ===== */
/* hero B: three clouds of points become one sphere */
.tribox{position:relative;aspect-ratio:1/.86;width:100%;max-width:660px;margin-inline:auto}
.tribox canvas{position:absolute;inset:0;width:100%;height:100%}
@media(max-width:760px){.tribox{aspect-ratio:1/.95}}
/* companies B: a pinned scene, one company per screen */
.cx{position:relative;margin-top:6px}
.cxpin{position:sticky;top:68px;height:calc(100vh - 68px);height:calc(100svh - 68px);min-height:520px;display:flex;flex-direction:column;padding:clamp(8px,2vh,22px) 0 clamp(44px,7vh,66px)}
.cxw{flex:1;min-height:0;overflow:hidden;overflow:clip;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.cxt{display:flex;height:100%;will-change:transform}
.cxt>li{position:relative;flex:none;width:100%;height:100%;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(20px,4vw,64px);align-items:center;padding-inline:clamp(14px,5%,64px)}
.cxbg{position:absolute;left:2%;top:4%;z-index:0;font-size:clamp(5.4rem,19vw,17rem);font-weight:600;letter-spacing:-.05em;line-height:.9;white-space:nowrap;color:transparent;-webkit-text-stroke:1.5px #dfdcd4;transform:translateX(var(--bgx,0px));pointer-events:none}
.cxl,.cxo{position:relative;z-index:1}
.cxn{font-size:.66rem;font-weight:600;letter-spacing:.16em;color:var(--mute);margin-bottom:14px}
.cxn b{color:var(--ink)}
.cxl h3{font-size:clamp(2rem,4.4vw,3.6rem);font-weight:500;letter-spacing:-.04em;line-height:1;margin-bottom:12px}
.cxl .sm{font-size:1rem;max-width:46ch}
.cxk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;margin:18px 0 20px;font-size:.88rem}
.cxk li{position:relative;padding-left:20px}
.cxk li::before{content:"";position:absolute;left:1px;top:.36em;width:9px;height:5px;border-left:1.6px solid #7d9800;border-bottom:1.6px solid #7d9800;rotate:-45deg}
.cxo{aspect-ratio:1;width:100%;max-width:min(420px,48vh);margin-inline:auto;transform:translateX(var(--ox,0px))}
.cxo .orb{position:absolute;inset:18%;animation:cofloat 7s ease-in-out infinite}
.coring.r2.k1::after{background:var(--violet)}
.coring.r2.k2::after{background:#a9a6b6}
.cxr{position:relative;display:flex;justify-content:space-between;margin-inline:clamp(14px,5%,64px);border-top:1px solid #cfccc4}
.cxr::before{content:"";position:absolute;left:0;top:-2px;width:100%;height:3px;border-radius:2px;background:linear-gradient(90deg,#b6d421,var(--violet),#a9a6b6);transform-origin:0 50%;transform:scaleX(var(--p,0))}
.cxr li{position:relative;width:0}
.cxr button{position:absolute;left:0;top:-7px;translate:-50% 0;display:grid;justify-items:center;gap:9px;padding:0 4px;color:#a5a2b0;font-size:.56rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;transition:color .35s}
.cxr li:first-child button{translate:-6px 0;justify-items:start}
.cxr li:last-child button{translate:calc(-100% + 6px) 0;justify-items:end}
.cxr i{width:11px;height:11px;border-radius:50%;background:var(--paper);border:1.5px solid #a5a2b0;transition:background .35s,border-color .35s,box-shadow .4s}
.cxr em{display:none;font-style:normal}
.cxr li.done i,.cxr li.on i{background:var(--ink);border-color:var(--ink)}
.cxr li.on i{box-shadow:0 0 0 5px rgba(11,11,12,.1)}
.cxr li.done button,.cxr li.on button,.cxr button:hover{color:var(--ink)}
@media(max-width:860px){
  .cxt>li{grid-template-columns:minmax(0,1fr);align-content:center;gap:10px;padding-inline:4px}
  .cxo{order:-1;max-width:min(190px,24vh);margin:0}
  .cxbg{top:2%;font-size:clamp(4.6rem,25vw,8rem)}
  .cxl .sm{font-size:.92rem}
  .cxk{grid-template-columns:minmax(0,1fr);gap:6px;margin:12px 0 14px;font-size:.84rem}
  .cxr{margin-inline:6px}
  .cxr span{display:none}.cxr em{display:block}
  .cxw{-webkit-mask-image:none;mask-image:none}
}
.cx.nopin .cxpin{position:static;height:auto;min-height:0;display:block;padding:0}
.cx.nopin .cxw{overflow:visible;-webkit-mask-image:none;mask-image:none}
.cx.nopin .cxt{display:block;height:auto}
.cx.nopin .cxt>li{height:auto;padding:26px 0;border-top:1px solid var(--line)}
.cx.nopin .cxbg,.cx.nopin .cxr{display:none}

/* ===== v3.6: Ecosystem, option C for hero and companies ===== */
/* hero C: one continuous line, three loops */
.knotbox{position:relative;aspect-ratio:1/.9;width:100%;max-width:640px;margin-inline:auto}
.knotbox canvas{position:absolute;inset:0;width:100%;height:100%}
.knotbox .ol{text-shadow:0 0 5px var(--paper),0 0 5px var(--paper),0 0 9px var(--paper)}
.knotbox .o-one b{letter-spacing:.34em}
.knotbox .o-one span{display:block;font-size:.52rem;letter-spacing:.24em;text-transform:uppercase}
@media(max-width:760px){.knotbox{aspect-ratio:1/.96}}
/* companies C: three cards that stack as you scroll */
.sk{display:grid;gap:26px}
.skc{position:sticky;top:calc(88px + var(--i)*18px);display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(20px,4vw,64px);align-items:center;min-height:min(64vh,540px);padding:clamp(22px,4vw,56px);border:1px solid #dedbd3;border-radius:16px;background:#fff;box-shadow:0 -14px 44px -26px rgba(20,16,40,.32);transform-origin:50% 0;transform:scale(var(--sc,1));will-change:transform;overflow:hidden}
.skc.k0{background:linear-gradient(120deg,#fff 46%,#f2f8cd)}
.skc.k1{background:linear-gradient(120deg,#fff 46%,#ece5ff)}
.skc.k2{background:linear-gradient(120deg,#fff 46%,#e9e7ee)}
.skc::after{content:"";position:absolute;inset:0;background:var(--ink);opacity:calc(var(--dim,0)*.1);pointer-events:none;border-radius:inherit}
.skl h3{font-size:clamp(1.9rem,4vw,3.2rem);font-weight:500;letter-spacing:-.04em;line-height:1;margin-bottom:12px}
.skl .sm{font-size:1rem;max-width:46ch}
.sko{position:relative;aspect-ratio:1;width:100%;max-width:340px;margin-inline:auto}
.sko .orb{position:absolute;inset:18%;animation:cofloat 7s ease-in-out infinite}
.sk.flat .skc{position:static;transform:none}
.sk.flat .skc::after{display:none}
@media(max-width:860px){
  .skc{grid-template-columns:minmax(0,1fr);gap:8px;min-height:0;top:calc(78px + var(--i)*12px);padding:20px 20px 24px}
  .sko{order:-1;max-width:150px;margin:0}
  .skl .sm{font-size:.92rem}
  .skc .cxk{grid-template-columns:minmax(0,1fr);gap:6px;margin:12px 0 14px;font-size:.84rem}
}

/* ===== v3.7: Ecosystem hero, option D: three lenses, one overlap ===== */
.vennbox{position:relative;aspect-ratio:1/.9;width:100%;max-width:640px;margin-inline:auto}
.vennbox canvas{position:absolute;inset:0;width:100%;height:100%}
.vennbox .ol{line-height:1.45}
.vennbox .ol b{font-size:clamp(.5rem,1vw,.68rem);line-height:1.5}
.vennbox .ol span{display:block;margin-top:5px;font-size:clamp(.56rem,.95vw,.7rem);color:rgba(11,11,12,.66);opacity:var(--so,1)}
.vennbox .o-violet b,.vennbox .o-violet span{color:#fff}
.vennbox .o-violet span{color:rgba(255,255,255,.82)}
.vennbox .o-one b{color:#fff;letter-spacing:.34em;font-size:clamp(.5rem,1vw,.7rem)}
.vennbox .o-one span{opacity:1;margin-top:3px;font-size:.5rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.8)}
@media(max-width:760px){.vennbox{aspect-ratio:1/.96}.vennbox .ol span{display:none}.vennbox .o-one span{display:block}}

/* ===== v4.0: About ===== */
/* hero: ideas hanging in a quiet space */
.atrium{position:relative;aspect-ratio:1/.8;width:100%;border-radius:8px;overflow:hidden;background:linear-gradient(180deg,#fdfdfc,#e9e7e1)}
.atrium canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}
@media(max-width:760px){.atrium{aspect-ratio:1/.86}}
/* our story: a year that rolls and a line that fills */
.story{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,6vw,96px);margin-top:clamp(36px,6vw,72px);--p:0}
.sty{position:sticky;top:calc(68px + 14vh);align-self:start}
.styr{height:1em;overflow:hidden;font-size:clamp(4.6rem,13vw,10.5rem);font-weight:500;letter-spacing:-.06em;line-height:1;font-variant-numeric:tabular-nums;color:#fff}
.stys{transform:translateY(calc(var(--k,0)*-1em));transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.stys span{display:block;height:1em}
.sty .caps{margin-top:16px;font-size:.62rem;color:#8a8798}
.sty .caps b{color:#fff;font-weight:600}
.stl{position:relative;padding-left:38px}
.stl::before,.stl::after{content:"";position:absolute;left:5px;top:8px;bottom:8px;width:1px;background:rgba(255,255,255,.18)}
.stl::after{left:4px;width:3px;border-radius:2px;background:linear-gradient(180deg,var(--lime),#a98bff);transform-origin:50% 0;transform:scaleY(var(--p))}
.stl li{position:relative;padding-bottom:clamp(56px,13vh,130px);color:#77748a;transition:color .45s}
.stl li:last-child{padding-bottom:0}
.stl li::before{content:"";position:absolute;left:-39px;top:4px;z-index:1;width:13px;height:13px;border-radius:50%;background:var(--night);border:1.5px solid #6a6876;transition:background .4s,border-color .4s,box-shadow .5s}
.stl .n{display:block;font-size:.66rem;font-weight:600;letter-spacing:.16em;margin-bottom:10px;transition:color .4s}
.stl h3{font-size:clamp(1.4rem,2.6vw,2.1rem);font-weight:500;letter-spacing:-.03em;line-height:1.1;color:#8d8a9c;margin:0 0 8px;transition:color .45s}
.stl p{font-size:1rem;max-width:36ch}
.stl li.on{color:#c5c3cf}
.stl li.on h3{color:#fff}
.stl li.on .n{color:var(--lime)}
.stl li.on::before{background:var(--lime);border-color:var(--lime);box-shadow:0 0 0 5px rgba(207,233,74,.16),0 0 22px rgba(207,233,74,.7)}
@media(max-width:760px){.story{grid-template-columns:minmax(0,1fr)}.sty{display:none}.stl li{padding-bottom:44px}}
/* our people */
.weare{font-size:clamp(1.9rem,4.2vw,3.2rem);font-weight:500;letter-spacing:-.035em;line-height:1.15;margin-bottom:clamp(26px,4vw,44px)}
.wroll{display:block;height:1.15em;overflow:hidden;color:var(--soft)}
.wstrip{display:block;animation:wroll 12.5s cubic-bezier(.7,0,.2,1) infinite}
.wstrip b{display:block;height:1.15em;font-weight:500;white-space:nowrap}
@keyframes wroll{0%,15%{transform:none}20%,35%{transform:translateY(-1.15em)}40%,55%{transform:translateY(-2.3em)}60%,75%{transform:translateY(-3.45em)}80%,95%{transform:translateY(-4.6em)}100%{transform:translateY(-5.75em)}}
/* looking ahead: points along a horizon */
.ahead{display:block;width:100%;max-width:520px;height:auto;justify-self:end;overflow:visible}
.ahead text{font-size:13.5px;font-weight:500;fill:#77748a;animation:ahtx 6s ease-in-out infinite}
.ahead .ad{fill:#0d0d10;stroke:#8a8798;stroke-width:1.5;animation:ahdot 6s ease-in-out infinite}
.ahead .ah{fill:rgba(207,233,74,.0);animation:ahhalo 6s ease-out infinite}
.ahead .a1 *{animation-delay:1.2s}.ahead .a2 *{animation-delay:2.4s}.ahead .a3 *{animation-delay:3.6s}
.ahead .arun{filter:drop-shadow(0 0 6px #fff);offset-rotate:0deg;animation:arun 6s linear infinite}
@keyframes arun{0%{offset-distance:0%;opacity:0}6%{opacity:1}92%{opacity:1}100%{offset-distance:100%;opacity:0}}
@keyframes ahtx{0%,12%{fill:#77748a}20%,70%{fill:#fff}100%{fill:#77748a}}
@keyframes ahdot{0%,12%{fill:#0d0d10;stroke:#8a8798}20%,70%{fill:#cfe94a;stroke:#cfe94a}100%{fill:#0d0d10;stroke:#8a8798}}
@keyframes ahhalo{0%,12%{fill:rgba(207,233,74,0)}20%{fill:rgba(207,233,74,.3)}60%,100%{fill:rgba(207,233,74,0)}}
@media(max-width:860px){.ahead{justify-self:start;margin-top:10px}}
@media(prefers-reduced-motion:reduce){.wstrip{animation:none}.ahead text{animation:none;fill:#fff}.ahead .ad{animation:none;fill:#cfe94a;stroke:#cfe94a}.ahead .ah{animation:none}.ahead .arun{display:none}}

/* ===== v4.1: About, version B of every section ===== */
/* hero B: rings receding towards a light */
.tunbox{position:relative;aspect-ratio:1/.9;width:100%;max-width:640px;margin-inline:auto}
.tunbox canvas{position:absolute;inset:0;width:100%;height:100%}
.tunbox .ol b{font-size:.56rem;letter-spacing:.26em}
/* beliefs B: four numbered beliefs, lit in turn */
.bel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.bel li{position:relative;padding:22px 20px 6px 0;border-top:1px solid var(--line);cursor:default}
.bel li::before{content:"";position:absolute;left:0;top:-2px;width:100%;height:3px;background:#b6d421;transform-origin:0 50%;transform:scaleX(0)}
.bel li.on::before{animation:belbar 3s linear forwards}
@keyframes belbar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.beln{display:block;font-size:clamp(3.4rem,6.4vw,5.6rem);font-weight:500;letter-spacing:-.06em;line-height:.9;font-variant-numeric:tabular-nums;color:transparent;-webkit-text-stroke:1.5px #a29fb0;transition:color .5s,-webkit-text-stroke-color .5s;margin-bottom:18px}
.bel li.on .beln{color:var(--ink);-webkit-text-stroke-color:var(--ink)}
.bel h3{font-size:1.25rem;font-weight:500;letter-spacing:-.02em;margin-bottom:6px;color:#8e8b9b;transition:color .4s}
.bel li.on h3{color:var(--ink)}
.bel .sm{max-width:24ch;opacity:.55;transition:opacity .4s}
.bel li.on .sm{opacity:1}
@media(max-width:760px){.bel{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 0}}
/* story B: pinned scene */
.sx{position:relative;margin-top:clamp(18px,3vw,34px)}
.sxpin{position:sticky;top:68px;height:calc(100vh - 68px);height:calc(100svh - 68px);min-height:480px;display:grid;grid-template-rows:minmax(0,1fr) auto auto;padding:clamp(10px,2vh,24px) 0 clamp(40px,7vh,64px)}
.sxy{position:absolute;left:0;top:clamp(6px,2vh,22px);height:1em;overflow:hidden;font-size:min(30vh,25vw,330px);font-weight:500;letter-spacing:-.065em;line-height:1;font-variant-numeric:tabular-nums;color:transparent;-webkit-text-stroke:1.5px #55535f}
.sxys{transform:translateY(calc(var(--k,0)*-1em));transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.sxys span{display:block;height:1em}
.sxs{position:relative;grid-row:1;align-self:end;display:block;width:100%;height:100%;max-height:100%;overflow:visible}
.sxbase{fill:none;stroke:rgba(255,255,255,.22);stroke-width:1.2;stroke-dasharray:3 6}
.sxlit{fill:none;stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.sxn{opacity:.4;transition:opacity .5s}
.sxn .sxo{transform-box:fill-box;transform-origin:center;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.sxn .sxh{fill:rgba(207,233,74,.0);transition:fill .6s}
.sxn.done{opacity:.8}
.sxn.on{opacity:1}
.sxn.on .sxo{transform:scale(1.28)}
.sxn.on .sxh{fill:rgba(207,233,74,.16)}
.sxhead{fill:#fff;filter:drop-shadow(0 0 8px #fff)}
.sxtx{position:relative;grid-row:2;display:grid;max-width:520px;margin-bottom:clamp(26px,5vh,48px)}
.sxtx article{grid-area:1/1;opacity:0;visibility:hidden;translate:0 14px;transition:opacity .4s,translate .55s cubic-bezier(.2,.7,.2,1),visibility 0s .4s}
.sxtx article.on{opacity:1;visibility:visible;translate:none;transition-delay:.12s,.12s,0s}
.sxtx .n{display:block;font-size:.66rem;font-weight:600;letter-spacing:.16em;color:var(--lime);margin-bottom:10px}
.sxtx h3{font-size:clamp(1.6rem,3.4vw,2.7rem);font-weight:500;letter-spacing:-.035em;line-height:1.05;color:#fff;margin:0 0 8px}
.sxtx p{font-size:1.02rem;color:#c5c3cf;max-width:38ch}
.sxr{grid-row:3}
@media(max-width:760px){.sxy{font-size:min(22vh,31vw)}.sxr span{display:none}.sxr em{display:block}.sxs{width:230%;max-width:none;height:auto;align-self:center;transform:translateX(var(--cam,0px));transition:transform .5s cubic-bezier(.2,.7,.2,1)}}
.night.apx:has(.cmp[data-v="b"]) .arc,.night.apx:has(.cmp[data-v="c"]) .arc{display:none}
.sx.nopin .sxpin{position:static;height:auto;min-height:0;display:block;padding:0}
.sx.nopin .sxy,.sx.nopin .sxs,.sx.nopin .sxr{display:none}
.sx.nopin .sxtx{display:grid;gap:24px;max-width:none}
.sx.nopin .sxtx article{grid-area:auto;opacity:1;visibility:visible;translate:none}
/* people B: three large figures and a moving row */
.pstats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--ink)}
.pstats>div{padding:20px 14px 0 0}
.pstats b{display:block;font-size:clamp(2.3rem,4.7vw,4.3rem);font-weight:500;letter-spacing:-.055em;line-height:.95;font-variant-numeric:tabular-nums}
.pstats span{display:block;margin-top:10px;font-size:.62rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
.pmq{margin-top:clamp(26px,4vw,44px)}
/* looking ahead B: a wide horizon */
.ah2{text-align:center}
.ah2 h2{margin-inline:auto;max-width:18ch}
.ah2 .lead{margin-inline:auto;max-width:48ch}
.ah2v{position:relative;left:50%;width:100vw;translate:-50% 0;height:clamp(200px,27vw,340px);margin:clamp(30px,5vw,60px) 0 calc(-1*clamp(56px,8vw,112px));--r:1}
.ah2v svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:translateY(calc((1 - var(--r))*70px))}
.ah2g{opacity:calc(.35 + var(--r)*.65)}
.ah2n{position:absolute;inset:0;transform:translateY(calc((1 - var(--r))*70px))}
.ah2n li{position:absolute;display:grid;justify-items:center;gap:10px;translate:-50% calc(-100% + 6px);font-size:clamp(.72rem,1.2vw,.95rem);font-weight:500;color:#77748a;animation:ah2t 7.2s ease-in-out infinite;animation-delay:calc(var(--i)*1.4s)}
.ah2n li span{max-width:9ch;line-height:1.25;text-align:center}
.ah2n li i{width:12px;height:12px;border-radius:50%;background:var(--night);border:1.5px solid #8a8798;animation:ah2d 7.2s ease-in-out infinite;animation-delay:calc(var(--i)*1.4s)}
@keyframes ah2t{0%,6%{color:#77748a}14%,60%{color:#fff}80%,100%{color:#77748a}}
@keyframes ah2d{0%,6%{background:#09090a;border-color:#8a8798;box-shadow:none}14%,60%{background:#cfe94a;border-color:#cfe94a;box-shadow:0 0 0 6px rgba(207,233,74,.16),0 0 24px rgba(207,233,74,.75)}80%,100%{background:#09090a;border-color:#8a8798;box-shadow:none}}
@media(min-width:761px){.ah2n li span{max-width:none;white-space:nowrap}}
@media(prefers-reduced-motion:reduce){.bel li.on::before{animation:none;transform:none}.ah2n li,.ah2n li i{animation:none}.ah2n li{color:#fff}.ah2n li i{background:#cfe94a;border-color:#cfe94a}}

.verbar{padding-top:14px}
.verbar .ovsw{margin:0}

/* ===== v4.2: About, version C (typography-led) ===== */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* hero C: one statement across the page */
#p-about .hero .split:has(>.cmp[data-v="c"]){grid-template-columns:minmax(0,1fr)}
#p-about .hero .split:has(>.cmp[data-v="c"])>div:first-child{display:none}
.mf{position:relative;--mx:0;--my:0;padding-top:6px}
.mfh{position:relative;z-index:1;font-size:clamp(3.2rem,11.4vw,10.2rem);line-height:.96;letter-spacing:-.052em;font-weight:500;margin:clamp(14px,2vw,26px) 0 clamp(26px,4vw,52px)}
.mfo{display:inline-block;width:.72em;vertical-align:-.07em;margin:0 .05em 0 .02em;animation:cofloat 6.5s ease-in-out infinite;transform:translate(calc(var(--mx)*16px),calc(var(--my)*12px));transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.mfo.o2{width:.5em;vertical-align:.32em;margin-left:.1em;animation-delay:-2.4s;transform:translate(calc(var(--mx)*-22px),calc(var(--my)*-14px))}
.mfb{position:absolute;z-index:0;pointer-events:none;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.mfb.b1{right:-3%;top:6%;width:clamp(150px,27vw,400px);opacity:.9;transform:translate(calc(var(--mx)*-34px),calc(var(--my)*-22px))}
.mfb.b2{right:31%;top:-1%;width:clamp(26px,4vw,58px);transform:translate(calc(var(--mx)*26px),calc(var(--my)*18px))}
.mfrow{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(20px,5vw,80px);align-items:end;padding-top:clamp(18px,2.4vw,30px);border-top:1px solid var(--ink)}
.mfrow .lead{margin:0;max-width:44ch}
.mfrow .acts{margin-top:16px}
#p-about .hero:has(.mf){overflow:hidden;overflow:clip}
@media(max-width:760px){.mfrow{grid-template-columns:minmax(0,1fr)}.mfb.b1{top:auto;bottom:30%;right:-14%;opacity:.5}.mfb.b2{display:none}}
@media(max-width:520px){.verbar .ovsw{gap:6px}.verbar .chip{white-space:nowrap;padding-inline:11px;font-size:.68rem}.verbar .caps{font-size:.5rem}}
/* beliefs C: a statement that fills in as you read */
.man{font-size:clamp(1.45rem,3.2vw,2.7rem);font-weight:500;letter-spacing:-.03em;line-height:1.24}
.mw{opacity:.16;transition:opacity .3s}
.mw.on{opacity:1}
.mk{display:inline-flex;align-items:center;gap:.6em;vertical-align:.32em;margin:0 .3em 0 .15em;padding:.55em 1em;border:1px solid var(--ink);border-radius:99px;font-size:.27em;font-weight:600;letter-spacing:.18em;text-transform:uppercase;line-height:1;white-space:nowrap}
.mk::before{content:"";width:.7em;height:.7em;border-radius:50%;background:#b6d421}
.mk:first-child{margin-left:0}
@media(max-width:560px){.mk{font-size:.4em}}
/* story C: travel through the years */
.fly{position:relative;margin-top:clamp(18px,3vw,34px)}
.flypin{position:sticky;top:68px;height:calc(100vh - 68px);height:calc(100svh - 68px);min-height:460px;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:clamp(40px,7vh,64px)}
#flyc{position:absolute;left:50%;top:0;width:100vw;height:100%;translate:-50% 0;pointer-events:none}
.flys{position:absolute;inset:0 0 clamp(70px,12vh,110px);perspective:900px}
.flys article{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;text-align:center;opacity:0;will-change:transform,opacity,filter;pointer-events:none}
.fy{display:block;font-size:min(34vh,27vw,360px);font-weight:500;letter-spacing:-.065em;line-height:.9;font-variant-numeric:tabular-nums;color:#fff}
.flys h3{font-size:clamp(1.5rem,3.2vw,2.6rem);font-weight:500;letter-spacing:-.035em;color:#fff;margin:clamp(12px,2.4vh,26px) 0 8px}
.flys p{font-size:clamp(.95rem,1.4vw,1.1rem);color:#c5c3cf;max-width:34ch}
.flyr{position:relative;z-index:2}
@media(max-width:760px){.flyr span{display:none}.flyr em{display:block}.fy{font-size:min(30vh,36vw)}}
.fly.nopin .flypin{position:static;height:auto;min-height:0;display:block;padding:0}
.fly.nopin #flyc,.fly.nopin .flyr{display:none}
.fly.nopin .flys{position:static;display:grid;gap:30px;perspective:none}
.fly.nopin .flys article{position:static;opacity:1;justify-items:start;text-align:left}
.fly.nopin .fy{font-size:clamp(3rem,8vw,5rem)}
/* people C: roles and a short ledger */
.abroles{display:flex;flex-wrap:wrap;gap:.1em .5em;font-size:clamp(1.5rem,3.1vw,2.5rem);font-weight:500;letter-spacing:-.035em;line-height:1.16}
.abroles span{color:transparent;-webkit-text-stroke:1.2px #a29fb0;animation:rolef 10s ease-in-out infinite;animation-delay:calc(var(--i)*2s)}
.abroles span:not(:last-child)::after{content:"/";margin-left:.5em;color:#cfccd6;-webkit-text-stroke:0}
@keyframes rolef{0%,3%{color:transparent;-webkit-text-stroke-color:#a29fb0}7%,20%{color:#0b0b0c;-webkit-text-stroke-color:#0b0b0c}26%,100%{color:transparent;-webkit-text-stroke-color:#a29fb0}}
.led{margin-top:14px;border-top:1px solid var(--ink)}
.led li{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--line)}
.led b{font-size:clamp(2.2rem,4.4vw,3.6rem);font-weight:500;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.led span{font-size:.62rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
/* looking ahead C: three lines that fill, and a drifting row */
.b3h{display:grid;max-width:none;font-size:clamp(2.5rem,8.6vw,8rem);line-height:1;letter-spacing:-.05em;margin:clamp(14px,2vw,24px) 0 clamp(26px,4vw,48px)}
.b3h span{display:block;color:transparent;-webkit-text-stroke:1.5px #6a6876;transition:color .7s,-webkit-text-stroke-color .7s}
.b3h span.on{color:#fff;-webkit-text-stroke-color:#fff}
.b3h .l3.on{background:linear-gradient(90deg,var(--lime),#b9a4ff 70%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:0}
.b3row{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(20px,5vw,80px);align-items:center;padding-top:clamp(18px,2.4vw,30px);border-top:1px solid rgba(255,255,255,.25)}
.b3row .lead{margin:0}
.b3row .acts{margin:0;justify-content:flex-end}
.b3mq{margin-top:clamp(34px,5vw,64px);position:relative;left:50%;width:100vw;translate:-50% 0}
.b3mq .mqt{gap:0;animation-duration:38s}
.b3mq .mqt span{display:inline-flex;align-items:center;padding:0;border:0;border-radius:0;background:none;font-size:clamp(1.7rem,4.4vw,3.6rem);font-weight:500;letter-spacing:-.035em;color:transparent;-webkit-text-stroke:1.2px #77748a}
.b3mq .mqt span::after{content:"";width:.26em;height:.26em;border-radius:50%;background:var(--lime);margin:0 .7em}
.b3mq .mqt span:hover{background:none;color:#fff;-webkit-text-stroke-color:#fff}
.b3mq .mqt{animation-name:mqb3}
@keyframes mqb3{to{transform:translateX(-50%)}}
@media(max-width:760px){.b3row{grid-template-columns:minmax(0,1fr)}.b3row .acts{justify-content:flex-start}}
@media(prefers-reduced-motion:reduce){.mfo,.abroles span{animation:none}.abroles span{color:#0b0b0c;-webkit-text-stroke-color:#0b0b0c}.mw{opacity:1}}

/* ===== v4.4: Insights ===== */
/* hero: a light you carry across the headline */
.ihero{position:relative;overflow:hidden;padding-bottom:0}
.ihero .wrap{position:relative}
.spot{position:relative;z-index:1;font-size:clamp(3.2rem,12vw,10.6rem);font-weight:500;letter-spacing:-.052em;line-height:.95;margin:clamp(14px,2vw,26px) 0 clamp(26px,4vw,52px);--lx:30%;--ly:40%;
  color:transparent;background:radial-gradient(circle clamp(240px,46vw,640px) at var(--lx) var(--ly),#fff 0,#f1edff 22%,#b3abd8 46%,#6f6c7e 74%);-webkit-background-clip:text;background-clip:text}
.spot em{font-style:normal}
.lorb{position:absolute;left:0;top:0;z-index:2;width:clamp(30px,3.6vw,48px);aspect-ratio:1;margin:calc(clamp(30px,3.6vw,48px)/-2) 0 0 calc(clamp(30px,3.6vw,48px)/-2);border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 34% 30%,#fdffe8,#e2f56c 30%,#a8c31d 68%,#566a08);box-shadow:0 0 40px 10px rgba(207,233,74,.5),0 0 120px 40px rgba(207,233,74,.22);will-change:transform}
.ihrow{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(20px,5vw,80px);align-items:center;padding-top:clamp(18px,2.4vw,30px);border-top:1px solid rgba(255,255,255,.25)}
.ihrow .lead{margin:0}
.ihrow .acts{margin:0;justify-content:flex-end}
.imq{margin-top:clamp(36px,5vw,68px);padding-bottom:clamp(26px,3.6vw,44px)}
@media(max-width:760px){.ihrow{grid-template-columns:minmax(0,1fr)}.ihrow .acts{justify-content:flex-start}}
/* featured: a cover that turns towards the cursor */
.fcov{position:relative;border-radius:10px;overflow:hidden;min-height:clamp(300px,36vw,440px);perspective:1000px;background:#0b0b0c;box-shadow:0 30px 70px -40px rgba(20,16,40,.55)}
.fcin{position:absolute;inset:-4%;transform:rotateX(calc(var(--ry,0)*-5deg)) rotateY(calc(var(--rx,0)*6deg)) translate(calc(var(--rx,0)*-12px),calc(var(--ry,0)*-8px));transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.fcin svg,.icv svg,.ipv svg{display:block;width:100%;height:100%}
.fctx{position:absolute;left:0;right:0;bottom:0;padding:clamp(20px,3vw,34px);color:#fff;background:linear-gradient(180deg,rgba(9,9,10,0),rgba(9,9,10,.82))}
.fctx .caps{font-size:.6rem;color:#d5d3de}
.fctx h3{font-size:clamp(1.4rem,2.6vw,2.1rem);font-weight:500;letter-spacing:-.03em;line-height:1.08;max-width:16ch;margin:10px 0 14px}
.fctx .soon{display:inline-block;font-size:.72rem;color:#d5d3de;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:3px 11px}
/* all insights: an index, with the cover following the cursor */
.posts{display:block;border-top:1px solid var(--ink)}
.irow{position:relative;display:grid;grid-template-columns:150px minmax(0,1fr) auto auto;gap:22px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line);transition:padding .45s cubic-bezier(.2,.7,.2,1),opacity .3s}
.irow .caps{font-size:.6rem;color:var(--mute)}
.irow h3{font-size:clamp(1.2rem,2.3vw,1.85rem);font-weight:500;letter-spacing:-.03em;line-height:1.12}
.irow .im{font-size:.8rem;color:var(--mute);white-space:nowrap}
.irow .soon{font-size:.72rem;color:var(--mute);border:1px solid var(--line);border-radius:99px;padding:3px 11px;white-space:nowrap}
.icv{display:none;width:76px;aspect-ratio:1;border-radius:6px;overflow:hidden}
@media(hover:hover) and (pointer:fine){.posts:hover .irow{opacity:.38}.posts .irow:hover{opacity:1;padding-left:16px}}
.ipv{position:fixed;left:0;top:0;z-index:60;width:clamp(220px,24vw,330px);aspect-ratio:4/3;border-radius:8px;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .3s;box-shadow:0 30px 60px -24px rgba(20,16,40,.5);will-change:transform}
.ipv.on{opacity:1}
@media(max-width:760px){.irow{grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;padding:18px 0}.irow .caps{grid-column:1}.irow h3{grid-column:1}.irow .im{grid-column:1}.irow .soon{display:none}.icv{display:block;grid-column:2;grid-row:1/4}}
/* our perspective: going deeper */
.deep{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;--p:0}
.dg{position:relative;background:repeating-linear-gradient(180deg,#b9b6c4 0 1px,transparent 1px 12px) 50% 0/9px 100% no-repeat,linear-gradient(#cfccd6,#cfccd6) 50% 0/1px 100% no-repeat}
.dg i{position:absolute;left:50%;top:calc(var(--p)*100%);width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border-radius:50%;background:#b6d421;border:1.5px solid var(--ink);box-shadow:0 0 0 6px rgba(182,212,33,.2);transition:top .2s linear}
.deep .themes li{grid-template-columns:44px minmax(0,1fr);padding:22px 0;font-size:clamp(1.05rem,1.8vw,1.4rem);font-weight:500;letter-spacing:-.02em;color:#a5a2b0;transition:color .4s}
.deep .themes li.on{color:var(--ink)}
.deep .themes li.on i{color:#7d9800}
/* stay in the loop */
.subx{overflow:hidden;overflow:clip}
.subx h2{font-size:clamp(2.2rem,4.8vw,4.2rem);letter-spacing:-.045em;line-height:1;max-width:none}
.subx .sorb{position:absolute;right:-4%;top:50%;width:clamp(200px,30vw,440px);translate:0 -50%;opacity:.85;pointer-events:none}
.subx .sorb::after{content:"";position:absolute;inset:-8%;border-radius:50%;background:radial-gradient(circle at 78% 78%,rgba(207,233,74,.55),rgba(207,233,74,0) 55%)}
.subx .wrap{position:relative;z-index:1}
.subx .sub input{font-size:1.05rem}
@media(max-width:860px){.subx .sorb{top:auto;bottom:-12%;translate:none;opacity:.5}}

/* ===== v4.5: Insights, version B of every section ===== */
.ihero .cmp>.wrap{position:relative;z-index:3}
.ihero .cmp>.wrap .ovsw{margin:0 0 6px}
/* hero B: the headline is drawn, then built */
.bph{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(24px,5vw,80px);align-items:end;padding-bottom:clamp(40px,6vw,84px)}
.bpgrid{position:absolute;inset:-60px calc(50% - 50vw);background:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px) 0 0/100% 44px,linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px) 0 0/44px 100%;-webkit-mask-image:radial-gradient(80% 90% at 40% 45%,#000,transparent);mask-image:radial-gradient(80% 90% at 40% 45%,#000,transparent);pointer-events:none}
.bpmain{position:relative}
.bpt{position:relative;display:inline-block;font-size:clamp(3rem,9.8vw,8.8rem);font-weight:500;letter-spacing:-.052em;line-height:.97;margin:clamp(18px,2.4vw,30px) 0 clamp(22px,3.4vw,44px);padding:.16em .12em .1em 0}
.bpt::before{content:"";position:absolute;left:0;right:.12em;top:0;height:9px;border-left:1px solid #8a8798;border-right:1px solid #8a8798;background:linear-gradient(#8a8798,#8a8798) 0 50%/100% 1px no-repeat}
.bpt::after{content:"";position:absolute;right:0;top:.16em;bottom:.1em;width:9px;border-top:1px solid #8a8798;border-bottom:1px solid #8a8798;background:linear-gradient(#8a8798,#8a8798) 50% 0/1px 100% no-repeat}
.bpo{display:block;color:transparent;-webkit-text-stroke:1.2px #77748a}
.bpf{position:absolute;left:0;top:.16em;display:block;white-space:nowrap;color:#fff;clip-path:inset(0 100% 0 0)}
.bpf em{font-style:normal;color:#b9a4ff}
.bpl{position:absolute;left:0;top:.06em;bottom:0;width:2px;background:var(--lime);box-shadow:0 0 18px 3px rgba(207,233,74,.7);opacity:0}
.bph.go .bpf{animation:bpfill 2.8s cubic-bezier(.65,0,.25,1) .5s forwards}
.bph.go .bpl{animation:bpline 2.8s cubic-bezier(.65,0,.25,1) .5s forwards}
@keyframes bpfill{to{clip-path:inset(0 0 0 0)}}
@keyframes bpline{0%{left:0;opacity:1}92%{opacity:1}100%{left:calc(100% - .12em);opacity:0}}
.bptop{position:relative;display:grid;min-width:clamp(150px,16vw,210px);border-top:1px solid rgba(255,255,255,.3)}
.bptop button{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.14);text-align:left;font-size:.62rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#c5c3cf;transition:color .3s,padding .4s cubic-bezier(.2,.7,.2,1)}
.bptop button::after{content:"\2192";opacity:0;translate:-6px 0;transition:opacity .3s,translate .4s;color:var(--lime);letter-spacing:0}
.bptop button:hover{color:#fff;padding-left:8px}
.bptop button:hover::after{opacity:1;translate:0 0}
.bpx{position:absolute;inset:-60px calc(50% - 50vw);pointer-events:none;opacity:0;transition:opacity .3s;overflow:hidden}
.bpx.on{opacity:1}
.bpx .bx{position:absolute;left:0;right:0;top:var(--cy,0px);height:1px;background:rgba(207,233,74,.4)}
.bpx .by{position:absolute;top:0;bottom:0;left:var(--cx,0px);width:1px;background:rgba(207,233,74,.4)}
.bpx b{position:absolute;left:calc(var(--cx,0px) + 10px);top:calc(var(--cy,0px) + 8px);font-size:.56rem;font-weight:600;letter-spacing:.14em;color:var(--lime);white-space:nowrap}
@media(max-width:860px){.bph{grid-template-columns:minmax(0,1fr);align-items:start}.bptop{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}}
/* featured B: one wide cover */
.fbh{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(20px,5vw,80px);align-items:end;margin-bottom:clamp(26px,4vw,44px)}
.fbh .lead{margin:0}
.fban{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:21/9;min-height:300px;background:#09090a}
.fbin{position:absolute;inset:-10% 0}
.fbin svg{display:block;width:100%;height:100%}
.fban .fctx h3{font-size:clamp(1.6rem,3.6vw,3rem);max-width:18ch}
@media(max-width:760px){.fbh{grid-template-columns:minmax(0,1fr)}.fban{aspect-ratio:4/5}}
/* all insights B: a shelf of covers */
.shelfw{position:relative}
.shelf{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(230px,26vw,320px);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;padding:10px 0 6px;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.shelf::-webkit-scrollbar{display:none}
.sc{scroll-snap-align:start;min-width:0}
.scv{aspect-ratio:4/5;border-radius:8px;overflow:hidden;background:#0b0b0c;transition:transform .55s cubic-bezier(.2,.7,.2,1),box-shadow .55s}
.scv svg{display:block;width:100%;height:100%;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.sc:hover .scv{transform:translateY(-8px);box-shadow:0 26px 50px -26px rgba(20,16,40,.55)}
.sc:hover .scv svg{transform:scale(1.07)}
.sc .caps{display:block;font-size:.6rem;color:var(--mute);margin:16px 0 8px}
.sc h3{font-size:1.18rem;font-weight:500;letter-spacing:-.02em;line-height:1.2}
.sc .soon{display:inline-block;margin-top:12px;font-size:.72rem;color:var(--mute);border:1px solid var(--line);border-radius:99px;padding:3px 11px}
.cnav2{display:flex;gap:8px;justify-content:flex-end;margin-top:18px}
.cnav2 button{width:44px;height:44px;border-radius:50%;border:1px solid #cbc8bf;font-size:1rem;transition:background .25s,color .25s,border-color .25s}
.cnav2 button:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
/* perspective B: themes beside a statement */
.pv3{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,3fr);gap:clamp(22px,4vw,60px);align-items:start}
.th2{border-top:1px solid var(--ink)}
.th2 li{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:8px;padding:20px 0;border-bottom:1px solid var(--line);font-size:clamp(1rem,1.5vw,1.2rem);font-weight:500;letter-spacing:-.015em;transition:padding .45s cubic-bezier(.2,.7,.2,1)}
.th2 li i{font-style:normal;font-size:.68rem;font-weight:600;letter-spacing:.12em;color:var(--soft)}
.th2 li b{font-weight:400;transition:translate .45s cubic-bezier(.2,.7,.2,1),color .3s}
.th2 li::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--ink);scale:0 1;transform-origin:0 50%;transition:scale .6s cubic-bezier(.2,.7,.2,1)}
.th2 li:hover{padding-left:10px}
.th2 li:hover::after{scale:1 1}
.th2 li:hover b{translate:6px 0;color:#7d9800}
.qc{margin:0}
.qcc{aspect-ratio:1;border-radius:8px;overflow:hidden}
.qcc svg{display:block;width:100%;height:100%}
.qc figcaption{margin-top:16px;font-size:clamp(1.2rem,1.9vw,1.55rem);font-weight:500;letter-spacing:-.03em;line-height:1.15}
@media(max-width:980px){.pv3{grid-template-columns:minmax(0,1fr)}.qcc{aspect-ratio:16/9}}
/* stay in the loop B: the form is the statement */
.subx.subd{background:var(--night);color:#fff;border-top-color:transparent}
.subx:has(.cmp[data-v="b"]) .sorb{display:none}
.subx:has(.cmp[data-v="b"]) .ovsw .caps{color:#d5d3de}
.subx:has(.cmp[data-v="b"]) .ovsw .chip{color:#c5c3cf;border-color:#4a4a52}
.subx:has(.cmp[data-v="b"]) .ovsw .chip[aria-pressed="true"]{background:#fff;color:var(--ink);border-color:#fff}
.sb2 .eb{color:#d5d3de}
.sb2 h2{font-size:clamp(1.3rem,2.2vw,1.8rem);letter-spacing:-.02em;font-weight:500;color:#c5c3cf;max-width:none;margin-bottom:clamp(18px,3vw,34px)}
.bigin{display:flex;align-items:center;gap:clamp(12px,2vw,26px);border-bottom:2px solid #fff;padding-bottom:clamp(10px,1.6vw,20px)}
.bigin input{flex:1;min-width:0;border:0;background:transparent;color:#fff;font:inherit;font-size:clamp(1.5rem,6.2vw,5.2rem);font-weight:500;letter-spacing:-.045em;line-height:1.1;padding:0;outline:none}
.bigin input::placeholder{color:#55535f}
.bigin input:focus-visible{outline:none}
.bigin:focus-within{border-bottom-color:var(--lime)}
.bigin button{flex:none;width:clamp(48px,6.4vw,86px);aspect-ratio:1;border-radius:50%;background:var(--lime);color:var(--ink);font-size:clamp(1.2rem,2.4vw,2rem);transition:scale .3s,background .3s}
.bigin button:hover{scale:1.08;background:#fff}
.sb2 .lead{color:#c5c3cf;margin-top:6px}
.sb2 .msg{color:#c5c3cf}
.sb2 .msg.err{color:#ff9d8a}

/* ===== v4.6: Insights hero C: the headline built up in layers ===== */
.xh{position:relative}
.xt{position:relative;display:inline-block;--dx:3.6;--dy:3.2;font-size:clamp(3.1rem,11.4vw,10rem);font-weight:500;letter-spacing:-.052em;line-height:.96;margin:clamp(14px,2vw,26px) 0 clamp(40px,6.4vw,96px)}
.xl{position:absolute;left:0;top:0;white-space:nowrap;color:transparent;-webkit-text-stroke-width:1px;opacity:0;transform:translate(calc(var(--dx)*var(--i)*.011em),calc(var(--dy)*var(--i)*.011em));will-change:transform}
.xtop{position:relative;display:block;white-space:nowrap;color:#fff;opacity:0}
.xtop em{font-style:normal;color:#b9a4ff}
.xt.go .xl{animation:xin .45s ease-out forwards;animation-delay:calc((14 - var(--i))*75ms + .25s)}
.xt.go .xtop{animation:xin .6s ease-out 1.35s forwards}
@keyframes xin{to{opacity:1}}
@media(max-width:760px){.xl{-webkit-text-stroke-width:.7px}.xl:nth-child(even){display:none}.xt{--k:1.5}.xl{transform:translate(calc(var(--dx)*var(--i)*.016em),calc(var(--dy)*var(--i)*.016em))}}
@media(prefers-reduced-motion:reduce){.xl,.xtop{opacity:1;animation:none!important}}

/* ===== v4.8: Careers ===== */
/* hero: from scale to zero */
.chero{position:relative;overflow:hidden}
.czbg{position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-end;overflow:hidden;pointer-events:none}
#cz{font-size:clamp(9rem,36vw,31rem);font-weight:500;letter-spacing:-.065em;line-height:.8;font-variant-numeric:tabular-nums;white-space:nowrap;margin-right:-1.5vw;color:transparent;-webkit-text-stroke:1.5px #3a3944;transition:-webkit-text-stroke-color .6s,text-shadow .8s,color .8s}
#cz.zero{-webkit-text-stroke-color:var(--lime);color:rgba(207,233,74,.07);text-shadow:0 0 60px rgba(207,233,74,.45),0 0 160px rgba(207,233,74,.25)}
.chero .wrap{position:relative;z-index:1}
.czh{font-size:clamp(2.7rem,8.2vw,7.4rem);line-height:.98;letter-spacing:-.05em;margin:clamp(14px,2vw,26px) 0 clamp(30px,5vw,64px)}
/* currently hiring: a moving row */
.tk2 .wrap{display:grid;grid-template-columns:auto minmax(0,1fr);gap:24px;align-items:center;flex-wrap:nowrap}
.tk2 b{white-space:nowrap}
.tk2 .mq{-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.tk2 .mqt{animation-duration:34s}
.tk2 .mqt span{padding:8px 16px;background:transparent;border-color:#3a3a42;color:#d5d3de;font-size:.82rem;letter-spacing:0}
.tk2 .mqt span:hover{background:#fff;color:var(--ink);border-color:#fff}
/* disciplines: a ring you choose from */
.dring{position:relative;aspect-ratio:16/6.4;margin:clamp(34px,5vw,60px) clamp(110px,13vw,170px) clamp(30px,4vw,50px)}
.dell{position:absolute;inset:0;border-radius:50%;border:1px solid #cfccd6}
.dell::before{content:"";position:absolute;inset:9%;border-radius:50%;border:1px dashed #dcd9e2}
.dmark{position:absolute;left:0;top:0;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:#b6d421;border:1.5px solid var(--ink);box-shadow:0 0 0 7px rgba(182,212,33,.2);will-change:left,top}
.dnl li{position:absolute;translate:-50% -50%}
.dnl button{position:relative;display:block;width:11px;height:11px;border-radius:50%;background:var(--paper);border:1.5px solid #8e8b9b;transition:background .3s,border-color .3s}
.dnl button span{position:absolute;top:50%;translate:0 -50%;font-size:.66rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;color:#8e8b9b;transition:color .3s;padding:8px 0}
.dnl li.rt button span{left:22px}
.dnl li.lt button span{right:22px}
.dnl button:hover span,.dnl li.on button span{color:var(--ink)}
.dnl li.on button{background:var(--ink);border-color:var(--ink)}
.dcard{position:absolute;left:50%;top:50%;translate:-50% -50%;width:min(52%,420px);display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:center;padding:22px 24px;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:0 30px 70px -36px rgba(40,30,80,.4)}
.dcard .orb{width:clamp(54px,6vw,84px);animation:cofloat 6s ease-in-out infinite}
.dcard h3{font-size:1.35rem;font-weight:500;letter-spacing:-.02em}
.dcard .dcn{font-size:.6rem;color:var(--soft);margin:6px 0 10px}
.dcard .sm{font-size:.9rem}
.dcard .lnk{margin-top:12px;font-size:.84rem}
.dcard.sw{animation:dcsw .5s cubic-bezier(.2,.7,.2,1)}
@keyframes dcsw{from{opacity:0;translate:-50% calc(-50% + 12px)}to{opacity:1;translate:-50% -50%}}
.dring~#discChips,.dring~#discCard{display:none}
@media(max-width:980px){.dring{display:none}.dring~#discChips{display:flex}.dring~#discCard{display:grid}}
/* what you'll do: six steps along one line */
.do6{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin-top:clamp(30px,5vw,56px);padding-top:34px;--p:0}
.do6::before,.do6::after{content:"";position:absolute;left:0;right:0;top:6px;height:1px;background:rgba(255,255,255,.2)}
.do6::after{top:5px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--lime),#a98bff);transform-origin:0 50%;transform:scaleX(var(--p))}
.do6 li{position:relative;padding:0 18px 0 0;color:#77748a;transition:color .45s}
.do6 li::before{content:"";position:absolute;left:0;top:-34px;z-index:1;width:13px;height:13px;border-radius:50%;background:var(--night);border:1.5px solid #6a6876;transition:background .4s,border-color .4s,box-shadow .5s}
.do6 b{display:block;font-size:clamp(2.4rem,4.6vw,4rem);font-weight:500;letter-spacing:-.05em;line-height:1;margin-bottom:16px;color:transparent;-webkit-text-stroke:1.2px #5d5b69;transition:color .5s,-webkit-text-stroke-color .5s}
.do6 h3{font-size:1.08rem;font-weight:500;color:#8d8a9c;margin-bottom:8px;transition:color .45s}
.do6 p{font-size:.84rem;line-height:1.45}
.do6 li.on{color:#c5c3cf}
.do6 li.on h3{color:#fff}
.do6 li.on b{color:#fff;-webkit-text-stroke-color:#fff}
.do6 li.on::before{background:var(--lime);border-color:var(--lime);box-shadow:0 0 0 5px rgba(207,233,74,.16),0 0 22px rgba(207,233,74,.7)}
@media(max-width:860px){
  .do6{grid-template-columns:minmax(0,1fr);padding:0 0 0 36px;gap:30px}
  .do6::before,.do6::after{left:6px;right:auto;top:6px;bottom:6px;width:1px;height:auto}
  .do6::after{left:5px;width:3px;transform-origin:50% 0;transform:scaleY(var(--p));background:linear-gradient(180deg,var(--lime),#a98bff)}
  .do6 li::before{left:-36px;top:6px}
  .do6 li{padding:0}
}
/* how hiring works */
.hf5{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.hf5 li{position:relative;padding:0 16px 0 0;color:var(--mute);font-size:.86rem;line-height:1.45}
.hf5 li::before{content:"";position:absolute;left:44px;right:0;top:19px;height:1px;background:var(--line)}
.hf5 li::after{content:"";position:absolute;left:44px;right:0;top:18px;height:3px;border-radius:2px;background:#b6d421;transform-origin:0 50%;transform:scaleX(0)}
.hf5 li.on::after{animation:belbar 2.8s linear forwards}
.hf5 li.done::after{transform:scaleX(1)}
.hf5 li:last-child::before,.hf5 li:last-child::after{display:none}
.hfn{position:relative;z-index:1;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid #cbc8bf;background:var(--paper);font-size:.9rem;font-weight:600;color:var(--mute);margin-bottom:18px;transition:background .35s,color .35s,border-color .35s,box-shadow .4s}
.hf5 li.on .hfn,.hf5 li.done .hfn{background:var(--lime);border-color:var(--ink);color:var(--ink)}
.hf5 li.on .hfn{box-shadow:0 0 0 7px rgba(207,233,74,.3)}
.hf5 h3{font-size:1.08rem;font-weight:500;color:#8e8b9b;margin-bottom:6px;transition:color .35s}
.hf5 li.on h3,.hf5 li.done h3{color:var(--ink)}
.hf5 em{display:inline-block;margin-top:12px;font-style:normal;font-size:.72rem;border:1px solid var(--line);border-radius:99px;padding:3px 11px}
@media(max-width:760px){.hf5{grid-template-columns:minmax(0,1fr);gap:22px}.hf5 li{padding-left:56px}.hf5 li::before,.hf5 li::after{display:none}.hfn{position:absolute;left:0;top:0;margin:0}}
/* open roles: an index */
#p-careers .roles{display:block;border-top:1px solid var(--ink)}
#p-careers .roles li{display:block;padding:0;border-bottom:1px solid var(--line);font-size:.88rem;color:var(--mute)}
.rr{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(0,1fr) minmax(0,1.4fr) auto auto;gap:6px 18px;align-items:center;padding:19px 0;transition:padding .45s cubic-bezier(.2,.7,.2,1)}
.rr b{font-size:clamp(1.1rem,1.9vw,1.5rem);font-weight:500;letter-spacing:-.025em;color:var(--ink)}
.rr i{font-style:normal;color:var(--ink);transition:translate .45s cubic-bezier(.2,.7,.2,1),color .3s}
@media(hover:hover) and (pointer:fine){#p-careers .roles:hover li{opacity:.4}#p-careers .roles li{transition:opacity .3s}#p-careers .roles li:hover{opacity:1}.rr:hover{padding-left:14px}.rr:hover i{translate:6px 0;color:#7d9800}}
@media(max-width:760px){.rr{grid-template-columns:minmax(0,1fr) auto;padding:16px 0}.rr b{grid-column:1}.rr span{grid-column:1}.rr span:nth-of-type(3){display:none}.rr i{grid-column:2;grid-row:1/4}}
/* why this is different: a list that ticks itself */
.tk5{display:grid;gap:clamp(12px,1.8vw,20px);justify-self:end}
.tk5 li{display:flex;align-items:center;gap:16px;font-size:clamp(1.1rem,2vw,1.6rem);font-weight:500;letter-spacing:-.025em;color:#77748a;transition:color .5s}
.tk5 i{position:relative;flex:none;width:26px;height:26px;border-radius:50%;border:1.5px solid #6a6876;transition:background .4s,border-color .4s,box-shadow .5s}
.tk5 i::after{content:"";position:absolute;left:7px;top:8px;width:10px;height:5px;border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);rotate:-45deg;scale:0;transition:scale .4s cubic-bezier(.2,1.4,.4,1) .15s}
.tk5 li.on{color:#fff}
.tk5 li.on i{background:var(--lime);border-color:var(--lime);box-shadow:0 0 20px rgba(207,233,74,.55)}
.tk5 li.on i::after{scale:1}
@media(max-width:860px){.tk5{justify-self:start;margin-top:10px}}

/* ===== v4.9: Careers, version B of every section ===== */
.chero .cmp>.wrap{position:relative;z-index:3}
.chero .cmp>.wrap .ovsw{margin:0 0 6px}
/* hero B: scale, zero, build, told in points */
#czc{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cb2 .czh span{transition:opacity .8s,color .8s}
.cb2 .l2{color:#b9a4ff}
.cb2[data-ph="scale"] .l2{opacity:.34}
.cb2[data-ph="zero"] .l1,.cb2[data-ph="build"] .l1{opacity:.34}
.cb2[data-ph="build"] .l2{color:var(--lime)}
.cph{display:flex;align-items:center;gap:10px;font-size:.6rem;color:#d5d3de;margin:calc(-1*clamp(14px,2.6vw,36px)) 0 clamp(18px,3vw,40px)}
.cph i{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime)}
/* disciplines B: each one opens to its roles */
.dacc{margin-top:clamp(24px,4vw,44px);border-top:1px solid var(--ink)}
.dacc>li{border-bottom:1px solid var(--line)}
.dacc>li>button{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;align-items:baseline;gap:14px;width:100%;padding:clamp(14px,2vw,22px) 0;text-align:left;color:#a5a2b0;transition:color .35s,padding .45s cubic-bezier(.2,.7,.2,1)}
.dacc .n{font-size:.66rem;font-weight:600;letter-spacing:.14em}
.dacc>li>button>b{font-size:clamp(1.7rem,4.6vw,3.8rem);font-weight:500;letter-spacing:-.045em;line-height:1}
.dacc .dc{font-size:.62rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;border:1px solid currentColor;border-radius:99px;padding:5px 11px}
.dacc .dc.has{color:var(--ink);background:var(--lime);border-color:var(--ink)}
.dacc>li>button>i{width:10px;height:10px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;rotate:45deg;transition:rotate .45s;align-self:center;margin:0 6px 5px 4px}
.dacc>li>button:hover,.dacc>li.on>button{color:var(--ink)}
.dacc>li>button:hover{padding-left:8px}
.dacc>li.on>button>i{rotate:-135deg;margin-bottom:-5px}
.dab{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s cubic-bezier(.2,.7,.2,1)}
.dab>div{overflow:hidden;min-height:0;padding-left:58px}
.dacc>li.on .dab{grid-template-rows:1fr}
.dab .sm{font-size:1rem;max-width:52ch}
.dab ul{margin:14px 0 24px;border-top:1px solid var(--line);max-width:640px}
.dab ul li{border-bottom:1px solid var(--line)}
.dab .rr{grid-template-columns:minmax(0,1fr) auto auto;padding:13px 0}
.dab .rr b{font-size:1.05rem}
.dab .none{display:inline-block;margin:12px 0 24px}
@media(max-width:560px){.dab>div{padding-left:0}.dacc>li>button{grid-template-columns:28px minmax(0,1fr) auto}.dacc .dc{grid-column:2;justify-self:start;grid-row:2}.dacc>li>button>i{grid-column:3;grid-row:1/3}}
/* what you'll do B: a pipeline that runs as you scroll */
.pipe{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:clamp(30px,5vw,56px)}
.pipe li{position:relative;display:flex;flex-direction:column;padding:18px 16px 16px;border:1px solid #2c2c33;border-radius:10px;background:#101013;color:#77748a;transition:border-color .5s,background .5s,color .5s;--f:0}
.pipe li::after{content:"";position:absolute;left:100%;top:31px;width:10px;height:1px;background:#3a3a42}
.pipe li:last-child::after{display:none}
.pst2{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1.5px solid #55535f;margin-bottom:22px;transition:background .4s,border-color .4s}
.pst2 i{width:10px;height:5px;border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);rotate:-45deg;translate:0 -1px;scale:0;transition:scale .4s cubic-bezier(.2,1.4,.4,1)}
.pipe b{font-size:.66rem;font-weight:600;letter-spacing:.14em;margin-bottom:8px}
.pipe h3{font-size:1.06rem;font-weight:500;color:#8d8a9c;margin-bottom:8px;transition:color .4s}
.pipe p{font-size:.82rem;line-height:1.45;margin-bottom:18px}
.pbar{display:block;height:3px;margin-top:auto;border-radius:2px;background:#26262b;overflow:hidden}
.pbar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--lime),#a98bff);transform-origin:0 50%;transform:scaleX(var(--f))}
.pipe li.run{border-color:var(--lime);background:#14160b;color:#c5c3cf}
.pipe li.run h3,.pipe li.done h3{color:#fff}
.pipe li.run .pst2{border-color:var(--lime);border-top-color:transparent;animation:spin .9s linear infinite}
.pipe li.done{border-color:#3d4a12;color:#c5c3cf}
.pipe li.done .pst2{background:var(--lime);border-color:var(--lime)}
.pipe li.done .pst2 i{scale:1}
.pipe li.done b,.pipe li.run b{color:var(--lime)}
@media(max-width:980px){.pipe{grid-template-columns:repeat(2,minmax(0,1fr))}.pipe li::after{display:none}}
@media(max-width:520px){.pipe{grid-template-columns:minmax(0,1fr)}}
/* how hiring works B: the timeline to scale */
.gantt ol{display:grid}
.gantt ol li{display:grid;grid-template-columns:minmax(0,230px) minmax(0,1fr) 84px;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.gt{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start}
.gt .hfn{margin:0;width:32px;height:32px;font-size:.8rem;background:var(--lime);border-color:var(--ink);color:var(--ink)}
.gt h3{font-size:1.02rem;font-weight:500}
.gt p{font-size:.82rem;color:var(--mute);line-height:1.4}
.gtrack{position:relative;height:14px;background:repeating-linear-gradient(90deg,#d9d6cf 0 1px,transparent 1px 5.263%)}
.gb{position:absolute;top:0;bottom:0;border-radius:99px;background:#e2e9b8;overflow:hidden;transform-origin:0 50%;transform:scaleX(0);transition:transform 1s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i)*.22s + .2s)}
.gb i{display:block;height:100%;border-radius:99px;background:#b6d421;border:1px solid var(--ink)}
.gdot{position:absolute;left:0;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#b6d421;border:1px solid var(--ink);scale:0;transition:scale .5s cubic-bezier(.2,1.4,.4,1) .2s}
.gantt.in .gb{transform:none}
.gantt.in .gdot{scale:1}
.gantt em{font-style:normal;font-size:.76rem;color:var(--mute);text-align:right;white-space:nowrap}
.gaxis{display:grid;grid-template-columns:minmax(0,230px) minmax(0,1fr) 84px;gap:18px;border-bottom:1px solid var(--ink);padding-bottom:10px}
.gaxis div{position:relative;height:14px}
.gaxis i{position:absolute;top:0;translate:-50% 0;font-style:normal;font-size:.6rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);white-space:nowrap}
.gaxis i:first-child{translate:0 0}.gaxis i:last-child{translate:-100% 0}
.gsum{margin-top:18px;font-size:clamp(1.1rem,1.9vw,1.5rem);font-weight:500;letter-spacing:-.02em;color:var(--mute)}
.gsum b{color:var(--ink);font-weight:500}
@media(max-width:760px){.gantt ol li{grid-template-columns:minmax(0,1fr) auto;gap:10px 14px}.gtrack{grid-column:1/-1;grid-row:2}.gaxis{grid-template-columns:minmax(0,1fr)}.gaxis span{display:none}}
/* open roles B: search */
.rsr{display:flex;align-items:center;gap:16px;border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:0}
.rsr input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:clamp(1.15rem,2.4vw,1.8rem);font-weight:500;letter-spacing:-.03em;padding:4px 0;outline:none;color:var(--ink)}
.rsr input::placeholder{color:#b3b0bd}
.rsr .caps{font-size:.6rem;color:var(--mute);white-space:nowrap}
#p-careers #roles2{border-top:0}
/* why this is different B: five lines, one in focus */
.why5{display:grid;gap:clamp(8px,1.4vw,16px);justify-self:end;width:100%}
.why5 li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(14px,2vw,26px);align-items:baseline;color:#55535f;transition:color .5s,translate .6s cubic-bezier(.2,.7,.2,1)}
.why5 b{font-size:.66rem;font-weight:600;letter-spacing:.14em;transition:color .5s}
.why5 span{font-size:clamp(1.5rem,3.3vw,2.8rem);font-weight:500;letter-spacing:-.04em;line-height:1.08}
.why5 li.on{color:#fff;translate:10px 0}
.why5 li.on b{color:var(--lime)}
.why5 li.near{color:#8d8a9c}

#p-careers .night:has(.cmp[data-v="b"] .why5) .arc{display:none}

/* ===== v5.0: Careers, version C ===== */
.night.chero{overflow:hidden;overflow:clip}
/* hero C: step through the zero */
.chero.zc{padding:0}
.chero:has(.cmp[data-v="c"]) .cmp>.wrap{position:absolute;left:0;right:0;top:14px;z-index:6}
.zh{position:relative;height:calc(100svh - 68px + 135vh)}
.zpin{position:sticky;top:68px;height:calc(100vh - 68px);height:calc(100svh - 68px);min-height:440px;overflow:hidden;--zr:120px;--zx:74%;--zy:52%;--zo:1;--zs:1.12;--zk:1}
.zin{position:absolute;inset:0;z-index:0;display:grid;align-items:center;background:var(--paper);color:var(--ink)}
.zin>.wrap,.zout>.wrap{width:100%}
.zin .eb{color:var(--mute)}
.zin .eb i{color:var(--soft)}
.zbig{font-size:clamp(1.7rem,4.3vw,3.7rem);font-weight:500;letter-spacing:-.035em;line-height:1.12;max-width:21ch;margin:clamp(12px,2vw,24px) 0 clamp(20px,3vw,36px);transform:scale(var(--zs));transform-origin:0 50%}
.zout{position:absolute;inset:0;z-index:1;display:grid;align-items:center;background:var(--night);-webkit-mask-image:radial-gradient(circle at var(--zx) var(--zy),transparent calc(var(--zr) - 1px),#000 var(--zr));mask-image:radial-gradient(circle at var(--zx) var(--zy),transparent calc(var(--zr) - 1px),#000 var(--zr))}
.zout .wrap{opacity:var(--zo);transform:translateX(calc((1 - var(--zo))*-50px))}
.zout .czh{max-width:10.5ch}
@media(max-width:760px){.zout{align-items:start;padding-top:clamp(56px,11vh,96px)}.zout .czh{max-width:none}}
.zhint{display:flex;align-items:center;gap:10px;font-size:.6rem;color:#d5d3de}
.zhint i{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime);animation:ndp 2.4s ease-out infinite}
.zring{position:absolute;z-index:2;left:var(--zx);top:var(--zy);width:400px;height:400px;margin:-200px 0 0 -200px;border-radius:50%;transform:scale(var(--zk));will-change:transform;pointer-events:none;filter:drop-shadow(0 0 26px rgba(207,233,74,.6))}
.zring i{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 24%,#fdffe8 0,#e9f888 14%,#cfe94a 34%,#a8c31d 62%,#55680a 100%);-webkit-mask-image:radial-gradient(circle closest-side,transparent calc(66% - 1px),#000 66%);mask-image:radial-gradient(circle closest-side,transparent calc(66% - 1px),#000 66%)}
.zh.nopin{height:auto}
.zh.nopin .zpin{position:static;height:auto;min-height:0;overflow:visible}
.zh.nopin .zout,.zh.nopin .zin{position:relative;padding:clamp(48px,8vw,90px) 0;-webkit-mask-image:none;mask-image:none}
.zh.nopin .zring,.zh.nopin .zhint{display:none}
.zh.nopin .zbig{transform:none}
/* disciplines C: spheres you can throw */
.dpl{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(20px,4vw,56px);align-items:center;margin-top:clamp(24px,4vw,44px)}
.dplay{position:relative;height:clamp(340px,42vw,500px);border:1px solid var(--line);border-radius:14px;overflow:hidden;background:radial-gradient(rgba(11,11,12,.11) 1px,transparent 1.4px) 0 0/22px 22px,linear-gradient(180deg,#fbfbf9,#eceae4);touch-action:pan-y}
.dplay canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab}
.dplay canvas.grab{cursor:grabbing}
.dph{position:absolute;left:16px;bottom:14px;font-size:.56rem;color:var(--mute);pointer-events:none}
.dpi h3{font-size:clamp(1.9rem,4vw,3.2rem);font-weight:500;letter-spacing:-.04em;line-height:1;margin:10px 0 12px}
.dpi .dc{display:inline-block;font-size:.62rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--mute);color:var(--mute);border-radius:99px;padding:5px 11px}
.dpi .dc.has{color:var(--ink);background:var(--lime);border-color:var(--ink)}
.dpi .sm{font-size:1rem;max-width:44ch}
.dpi ul{margin:16px 0 0;border-top:1px solid var(--line)}
.dpi ul li{border-bottom:1px solid var(--line)}
.dpi .rr{grid-template-columns:minmax(0,1fr) auto auto;padding:13px 0}
.dpi .rr b{font-size:1.05rem}
.dpi .none{display:inline-block;margin-top:16px}
.dpi.sw{animation:dpsw .5s cubic-bezier(.2,.7,.2,1)}
@keyframes dpsw{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:860px){.dpl{grid-template-columns:minmax(0,1fr)}.dplay{height:clamp(320px,90vw,400px)}}
/* what you'll do C: one step per screen */
.vx{position:relative;margin-top:clamp(18px,3vw,34px)}
.vxpin{position:sticky;top:68px;height:calc(100vh - 68px);height:calc(100svh - 68px);min-height:440px;display:flex;flex-direction:column;padding:clamp(8px,2vh,22px) 0 clamp(40px,7vh,64px)}
.vxw{flex:1;min-height:0;overflow:hidden;overflow:clip;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.vxt{display:flex;height:100%;will-change:transform}
.vxt>li{position:relative;flex:none;width:100%;height:100%;display:grid;align-content:center;padding-inline:clamp(14px,5%,64px)}
.vxbg{position:absolute;left:1%;top:50%;z-index:0;translate:0 -58%;font-size:clamp(6rem,27vw,24rem);font-weight:600;letter-spacing:-.06em;line-height:.9;white-space:nowrap;color:transparent;-webkit-text-stroke:1.5px #2c2c33;transform:translateX(var(--bgx,0px));pointer-events:none}
.vxc{position:relative;z-index:1}
.vxc .cxn{color:#8a8798}
.vxc .cxn b{color:var(--lime)}
.vxc h3{font-size:clamp(2.3rem,7.4vw,6.4rem);font-weight:500;letter-spacing:-.05em;line-height:.98;color:#fff;max-width:12ch;margin-bottom:clamp(14px,2.4vh,26px)}
.vxc p:last-child{font-size:clamp(1rem,1.6vw,1.3rem);color:#c5c3cf;max-width:36ch}
@media(max-width:760px){.vxr span{display:none}.vxr em{display:block}.vxw{-webkit-mask-image:none;mask-image:none}.vxc h3{font-size:clamp(2.9rem,15vw,4.6rem);max-width:8.5ch}.vxc p:last-child{font-size:1.12rem}.vxbg{font-size:50vw;translate:0 -80%}.vxt>li{padding-inline:6px}}
.vx.nopin .vxpin{position:static;height:auto;min-height:0;display:block;padding:0}
.vx.nopin .vxw{overflow:visible;-webkit-mask-image:none;mask-image:none}
.vx.nopin .vxt{display:grid;gap:34px;height:auto}
.vx.nopin .vxt>li{height:auto;padding:0}
.vx.nopin .vxbg,.vx.nopin .vxr{display:none}
.vx.nopin .vxc h3{font-size:clamp(1.6rem,4vw,2.4rem)}
/* how hiring works C: a conversation */
.chat{display:grid;gap:18px;max-width:640px}
.chat li{position:relative;display:grid;justify-items:start;gap:7px}
.chat li.me{justify-items:end}
.cw{font-size:.56rem;color:var(--mute)}
.cbub{max-width:min(440px,88%);padding:16px 20px;border:1px solid var(--line);border-radius:18px 18px 18px 5px;background:#fff;box-shadow:0 18px 40px -26px rgba(40,30,80,.35);opacity:0;transform:translateY(12px) scale(.95);transform-origin:0 100%}
.chat li.me .cbub{background:var(--ink);border-color:var(--ink);color:#fff;border-radius:18px 18px 5px 18px;transform-origin:100% 100%}
.cbub h3{font-size:1.08rem;font-weight:500;margin-bottom:4px}
.cbub p{font-size:.9rem;color:var(--mute);line-height:1.45}
.chat li.me .cbub p{color:#c5c3cf}
.cbub em{display:inline-block;margin-top:10px;font-style:normal;font-size:.7rem;border:1px solid currentColor;border-radius:99px;padding:2px 10px;opacity:.75}
.ctyp{position:absolute;top:22px;left:0;display:flex;gap:5px;padding:13px 15px;border-radius:16px;background:#e6e3dc;opacity:0}
.chat li.me .ctyp{left:auto;right:0}
.ctyp i{width:6px;height:6px;border-radius:50%;background:#8e8b9b;animation:cdot 1s ease-in-out infinite}
.ctyp i:nth-child(2){animation-delay:.15s}.ctyp i:nth-child(3){animation-delay:.3s}
@keyframes cdot{0%,60%,100%{translate:0 0}30%{translate:0 -4px}}
.chat li.in .ctyp{animation:ctyp .9s forwards}
.chat li.in .cbub{animation:cbin .55s cubic-bezier(.2,.9,.3,1.15) .85s forwards}
@keyframes ctyp{0%{opacity:0}15%,80%{opacity:1}100%{opacity:0}}
@keyframes cbin{to{opacity:1;transform:none}}
/* open roles C: rows that turn over */
.mrl{border-top:1px solid var(--ink)}
.mrl li{border-bottom:1px solid var(--line)}
.mr{position:relative;display:grid;grid-template-columns:minmax(0,2.4fr) minmax(0,1fr) minmax(0,1.4fr) auto;gap:18px;align-items:center;padding:22px 0;overflow:hidden;font-size:.88rem;color:var(--mute)}
.mr b{font-size:clamp(1.15rem,2.3vw,1.9rem);font-weight:500;letter-spacing:-.03em;color:var(--ink)}
.mr>i{font-style:normal;color:var(--ink)}
.mrm{position:absolute;inset:0;display:flex;align-items:center;background:var(--ink);color:#fff;translate:0 101%;transition:translate .5s cubic-bezier(.2,.7,.2,1)}
.mrm span{display:flex;flex:none;white-space:nowrap;font-size:clamp(1.15rem,2.3vw,1.9rem);font-weight:500;letter-spacing:-.03em;animation:mqb3 16s linear infinite;animation-play-state:paused}
.mrm span u{text-decoration:none;color:var(--lime);margin:0 .7em}
@media(hover:hover) and (pointer:fine){.mr:hover .mrm,.mr:focus-visible .mrm{translate:0 0}.mr:hover .mrm span,.mr:focus-visible .mrm span{animation-play-state:running}}
@media(max-width:760px){.mr{grid-template-columns:minmax(0,1fr) auto;gap:4px 14px;padding:16px 0}.mr b{grid-column:1}.mr>span:not(.mrm){grid-column:1}.mr>i{grid-column:2;grid-row:1/4}}
/* why this is different C: a moving band */
.wqs{position:relative;width:min(100%,360px);aspect-ratio:1/.8;justify-self:end}
.wqs .orb{position:absolute;animation:cofloat 7s ease-in-out infinite}
.wqs .orb.lime{width:52%;left:6%;top:14%}
.wqs .orb.violet{width:36%;right:6%;top:4%;animation-delay:-2.5s}
.wqs .orb.glass{width:26%;right:22%;bottom:4%;animation-delay:-4.5s}
.wqm{display:none;margin-top:clamp(36px,5vw,64px)}
#p-careers .night:has(.cmp[data-v="c"] .wqs) .wqm{display:grid}
.wqm .mqr:nth-child(2) .mqt{animation-direction:reverse;animation-duration:44s}
@media(max-width:860px){.wqs{justify-self:start;width:min(70%,260px)}}

/* ===== v5.2: Careers, choices applied on the liked version ===== */
.cmp[data-v="d"]>[data-o="d"]{display:block}
/* hero: clean white centre, zero placed to fill the space; inside panel filled by larger type */
.zpin{--zc:0}
.zinw{opacity:var(--zc)}
.zbig{font-size:clamp(2.2rem,5.5vw,5rem);line-height:1.07;max-width:21ch;margin:clamp(14px,2.2vw,28px) 0 clamp(24px,3.4vw,44px)}
.zrow{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px}
.zmeta{font-size:.62rem;color:var(--mute)}
.zout .czh{font-size:clamp(2.9rem,7.6vw,7.2rem);max-width:10ch;margin-bottom:clamp(22px,3.4vw,44px)}
@media(max-width:760px){
  .zout{padding-top:clamp(30px,5.5vh,56px)}
  .zout .czh{font-size:clamp(2.9rem,13.2vw,3.7rem);max-width:none;margin-bottom:22px}
  .zbig{font-size:clamp(2.2rem,10.2vw,2.9rem);max-width:none}
}
/* disciplines: one stage */
.dstage{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);margin-top:clamp(24px,4vw,44px);border-radius:18px;overflow:hidden;background:var(--night);color:#fff;box-shadow:0 44px 90px -56px rgba(20,16,40,.7)}
.dstage .dplay{height:auto;min-height:clamp(360px,40vw,500px);border:0;border-radius:0;background:radial-gradient(60% 70% at 28% 34%,rgba(207,233,74,.14),transparent 70%),radial-gradient(60% 70% at 76% 82%,rgba(138,100,240,.18),transparent 70%)}
.dstage .dph{left:22px;bottom:18px;color:#8a8798}
.dstage .dpi{display:flex;flex-direction:column;justify-content:center;padding:clamp(24px,3.4vw,46px);border-left:1px solid #26262b;min-width:0}
.dpc{display:flex;align-items:center;gap:9px;font-size:.6rem;color:#8a8798;margin-bottom:14px}
.dpc i{width:8px;height:8px;border-radius:50%;background:#55535f}
.dpc.has{color:#d5d3de}
.dpc.has i{background:var(--lime);box-shadow:0 0 12px rgba(207,233,74,.8)}
.dstage .dpi h3{font-size:clamp(2rem,4vw,3.3rem);font-weight:500;letter-spacing:-.04em;line-height:1;color:#fff;margin:0 0 14px}
.dpd{font-size:1rem;line-height:1.5;color:#c5c3cf;max-width:38ch}
.dpl3{margin-top:22px;border-top:1px solid #2c2c33}
.dpl3 li{border-bottom:1px solid #2c2c33}
.rr2{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:4px 14px;align-items:center;padding:13px 0;font-size:.86rem;color:#c5c3cf;transition:padding .4s cubic-bezier(.2,.7,.2,1)}
.rr2 b{font-size:1.02rem;font-weight:500;color:#fff}
.rr2 i{font-style:normal;color:#fff;transition:translate .4s cubic-bezier(.2,.7,.2,1),color .3s}
.rr2:hover{padding-left:8px}
.rr2:hover i{translate:5px 0;color:var(--lime)}
.dnone{align-self:flex-start;display:inline-flex;gap:10px;margin-top:22px;padding-bottom:4px;border-bottom:1px solid rgba(255,255,255,.5);font-size:.9rem;color:#fff}
@media(max-width:860px){.dstage{grid-template-columns:minmax(0,1fr)}.dstage .dplay{min-height:min(330px,86vw)}.dstage .dpi{border-left:0;border-top:1px solid #26262b}}
/* what you'll do: the same pieces, spread over the whole screen */
.vxt>li{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;align-content:stretch;padding:clamp(4px,1.2vh,14px) clamp(14px,5%,64px) clamp(34px,6.5vh,64px)}
.vxt>li>.cxn{position:relative;z-index:1;margin:0;color:#8a8798}
.vxt>li>.cxn b{color:var(--lime)}
.vxbg{position:relative;grid-row:2;align-self:center;justify-self:start;min-width:0;left:auto;top:auto;translate:none;font-size:min(30vw,54vh);-webkit-text-stroke-color:#3a3944}
.vxb{position:relative;z-index:1;grid-row:3;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(18px,5vw,80px);align-items:end}
.vxb h3{font-size:clamp(2.3rem,6.6vw,6rem);font-weight:500;letter-spacing:-.05em;line-height:.98;color:#fff;max-width:12ch}
.vxb p{font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.45;color:#c5c3cf;max-width:34ch;padding-bottom:.35em}
@media(max-width:760px){.vxbg{font-size:min(47vw,30vh);translate:none}.vxb{grid-template-columns:minmax(0,1fr);gap:12px}.vxb h3{font-size:clamp(2.6rem,12.6vw,3.8rem);max-width:10ch}.vxb p{font-size:1.08rem;padding:0}.vxt>li{padding-inline:6px}}
.vx.nopin .vxt>li{display:block;padding:0}
.vx.nopin .vxb{grid-template-columns:minmax(0,1fr);gap:8px;margin-top:8px}
.vx.nopin .vxb h3{font-size:clamp(1.6rem,4vw,2.4rem)}
/* why this is different, D */
.ahead.w5{max-width:600px}
.ahead.w5 .an *{animation-delay:var(--dl)}
.ahead.w5 text{font-size:15px}
#p-careers .night:has(.cmp[data-v="d"] .w5) .arc{display:none}

@media(max-width:560px){.rr2{grid-template-columns:minmax(0,1fr) auto}.rr2 b{grid-column:1}.rr2 span{grid-column:1;grid-row:2}.rr2 i{grid-column:2;grid-row:1/3}}

.vxt>li{overflow:hidden;overflow:clip}

/* ===== v5.3: agreed changes ===== */
/* hero: headline at the site's standard size */
.zout .czh{font-size:clamp(2.5rem,6.2vw,4.3rem);line-height:1.02;letter-spacing:-.04em;max-width:11ch;margin-bottom:clamp(20px,3vw,36px)}
@media(max-width:760px){.zout .czh{font-size:clamp(2.5rem,6.2vw,4.3rem);max-width:none;margin-bottom:20px}}
/* inside panel: three versions */
.zin .cmp>.ovsw{margin:0 0 clamp(8px,2vh,22px)}
.zst{font-size:clamp(1.9rem,4.1vw,2.9rem);font-weight:500;line-height:1.1;letter-spacing:-.035em;max-width:19ch;margin:clamp(12px,2vw,22px) 0 clamp(20px,3vw,34px)}
.zsplit{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(24px,6vw,100px);align-items:center}
.zsplit .acts{margin:0}
.zol{display:flex;align-items:center;gap:9px;font-size:.6rem;color:var(--ink);margin-bottom:12px}
.zol i{width:8px;height:8px;border-radius:50%;background:#b6d421;box-shadow:0 0 0 4px rgba(182,212,33,.22)}
.zopen{border-top:1px solid var(--ink);margin-bottom:18px}
.zopen li{border-bottom:1px solid var(--line)}
.zopen .rr{grid-template-columns:minmax(0,1fr) auto auto;padding:14px 0;font-size:.86rem;color:var(--mute)}
.zopen .rr b{font-size:1.08rem}
@media(max-width:860px){.zsplit{grid-template-columns:minmax(0,1fr);gap:22px}.zopen .rr{padding:11px 0}.zopen li:nth-child(n+4){display:none}}
/* disciplines: three white versions */
.dplay.free{height:clamp(340px,40vw,480px);border:0;border-radius:0;background:none;margin-top:6px}
.dplay.free .dph{left:0;top:0;bottom:auto}
.dq .dqc{display:flex;align-items:center;gap:9px;font-size:.6rem;color:var(--mute);margin-bottom:12px}
.dq .dqc i{width:8px;height:8px;border-radius:50%;background:#cbc8d2}
.dq .dqc.has{color:var(--ink)}
.dq .dqc.has i{background:#b6d421;box-shadow:0 0 0 4px rgba(182,212,33,.22)}
.dq h3{font-size:clamp(1.9rem,3.8vw,3rem);font-weight:500;letter-spacing:-.04em;line-height:1}
.dq .dqd{font-size:1rem;line-height:1.5;color:var(--mute);max-width:38ch}
.dq ul{border-top:1px solid var(--line)}
.dq ul li{border-bottom:1px solid var(--line)}
.dq .rr{grid-template-columns:minmax(0,1fr) auto auto;padding:13px 0;font-size:.86rem;color:var(--mute)}
.dq .rr b{font-size:1.04rem}
.dq.sw{animation:dpsw .5s cubic-bezier(.2,.7,.2,1)}
.dqrow{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,4fr) minmax(0,5fr);gap:clamp(18px,4vw,60px);align-items:start;margin-top:clamp(10px,2vw,22px);padding-top:clamp(18px,2.4vw,28px);border-top:1px solid var(--ink)}
.dqrow ul{border-top:0}
.dqrow ul li:first-child .rr{padding-top:2px}
.dsoft{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);margin-top:clamp(20px,3.4vw,40px);border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 34px 80px -46px rgba(40,30,80,.34),0 1px 0 rgba(11,11,12,.04)}
.dsoft .dplay{height:auto;min-height:clamp(360px,40vw,500px);border:0;border-radius:0;background:radial-gradient(60% 70% at 30% 36%,rgba(207,233,74,.16),transparent 70%),radial-gradient(60% 70% at 76% 82%,rgba(138,100,240,.1),transparent 70%)}
.dqcol{display:flex;flex-direction:column;justify-content:center;gap:0;padding:clamp(24px,3.4vw,46px);border-left:1px solid var(--line);min-width:0}
.dqcol h3{margin-bottom:14px}
.dqcol ul{margin-top:20px}
@media(max-width:860px){.dqrow{grid-template-columns:minmax(0,1fr);gap:14px}.dsoft{grid-template-columns:minmax(0,1fr)}.dsoft .dplay{min-height:min(330px,86vw)}.dqcol{border-left:0;border-top:1px solid var(--line)}.dplay.free{height:min(360px,90vw)}}
/* steps: statement at section-heading scale */
.vxb h3{font-size:clamp(2rem,4.4vw,3.6rem);line-height:1.02;letter-spacing:-.04em;max-width:13ch}
.vxb p{font-size:clamp(.98rem,1.3vw,1.12rem)}
@media(max-width:760px){.vxb h3{font-size:clamp(2rem,8.6vw,2.5rem);max-width:12ch}.vxb p{font-size:1rem}}

.zin .ovsw .caps{color:var(--ink)}
.zin .ovsw .chip{color:var(--mute);border-color:#cbc8bf;background:transparent}
.zin .ovsw .chip[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ===== v5.4: finalised ===== */
/* the zoom: the dark side is four plain panels and one square with a round hole, moved only with transforms */
.zout{z-index:3;background:none;-webkit-mask-image:none;mask-image:none;pointer-events:none}
.zsh{position:absolute;z-index:1;left:0;top:0;width:100%;height:100%;background:var(--night);will-change:transform;pointer-events:none}
.zs1{transform-origin:0 0;transform:scaleY(var(--s1,1))}
.zs2{transform-origin:0 100%;transform:scaleY(var(--s2,1))}
.zs3{transform-origin:0 0;transform:scaleX(var(--s3,1))}
.zs4{transform-origin:100% 0;transform:scaleX(var(--s4,1))}
.zsq{position:absolute;z-index:1;left:var(--zx);top:var(--zy);width:var(--zq,260px);height:var(--zq,260px);margin:calc(var(--zq,260px)/-2) 0 0 calc(var(--zq,260px)/-2);background:radial-gradient(circle closest-side,transparent calc(var(--zqh,96%) - .7px),var(--night) var(--zqh,96%));transform:scale(var(--zk2,1));will-change:transform;pointer-events:none}
.zring{z-index:4}
.zinw{pointer-events:none}
.zpin.open .zinw{pointer-events:auto}
.zh.nopin .zsh,.zh.nopin .zsq{display:none}
.zh.nopin .zout{background:var(--night);pointer-events:auto}
.zh.nopin .zinw{pointer-events:auto;opacity:1}
/* roles everywhere say what the click does */
.rr .ap,.rr2 .ap{font-style:normal;font-size:.74rem;font-weight:600;letter-spacing:.02em;white-space:nowrap;color:var(--ink)}
.rr:hover .ap{color:#7d9800}
@media(max-width:760px){.rr .ap{font-size:.72rem}}

#p-careers .roles .rr b{grid-column:1}

/* ===== v5.5: Contact, version B of each section ===== */
/* hero B: a sphere lit from wherever the cursor is */
.litbox{position:relative;aspect-ratio:1/.88;width:100%;max-width:560px;margin-inline:auto}
.litbox canvas{position:absolute;inset:0;width:100%;height:100%}
/* three ways in: three spheres */
.ways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--ink)}
.way{display:grid;align-content:start;gap:clamp(14px,2vw,24px);padding:clamp(22px,3vw,36px) clamp(14px,2vw,28px) clamp(20px,3vw,30px) 0;text-align:left;border-right:1px solid var(--line);transition:background .35s}
.way+.way{padding-left:clamp(14px,2vw,28px)}
.way:last-child{border-right:0}
.wo{display:block;width:clamp(84px,10vw,128px);aspect-ratio:1;position:relative}
.wo .orb{position:absolute;inset:0;animation:cofloat 7s ease-in-out infinite;transition:scale .5s cubic-bezier(.2,.7,.2,1)}
.way:nth-child(2) .orb{animation-delay:-2.4s}.way:nth-child(3) .orb{animation-delay:-4.6s}
.wt{display:grid;gap:10px}
.way .caps{display:flex;gap:12px;font-size:.62rem;color:var(--ink)}
.way .caps i{font-style:normal;color:var(--soft)}
.wd{font-size:clamp(1.02rem,1.5vw,1.22rem);font-weight:500;letter-spacing:-.015em;line-height:1.3;max-width:26ch}
.wa{font-size:.78rem;font-weight:600;color:var(--mute);transition:color .3s,translate .45s cubic-bezier(.2,.7,.2,1)}
.way:hover .orb,.way:focus-visible .orb{scale:1.08}
.way:hover .wa,.way:focus-visible .wa{color:#7d9800;translate:6px 0}
@media(max-width:760px){.ways{grid-template-columns:minmax(0,1fr)}.way{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:18px;padding:20px 0;border-right:0;border-bottom:1px solid var(--line)}.way+.way{padding-left:0}.wo{width:72px}}
/* the form as a sentence: same fields, same checks */
.fcmp>.ovsw{margin-bottom:14px}
.fcmp[data-v="a"] ::placeholder{color:transparent}
.fcmp[data-v="b"] .fields{display:block;font-size:clamp(1.3rem,2.4vw,1.85rem);font-weight:500;letter-spacing:-.02em;line-height:1.85}
.fcmp[data-v="b"] .fields>div{display:inline}
.fcmp[data-v="b"] .fields label{position:absolute;width:1px;height:1px;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.fcmp[data-v="b"] .fields>div::before{content:attr(data-b) " "}
.fcmp[data-v="b"] #form.career .fields>div::before{content:attr(data-c) " "}
.fcmp[data-v="b"] .fields>div::after{content:". "}
.fcmp[data-v="b"] .fields input{display:inline-block;width:11ch;min-width:6ch;max-width:100%;field-sizing:content;padding:0 .12em;border:0;border-bottom:2px solid #cbc8bf;border-radius:0;font-size:inherit;font-weight:500;letter-spacing:inherit;line-height:1.3;color:#5b6d00;vertical-align:baseline;transition:border-color .3s}
.fcmp[data-v="b"] .fields #f-mail{width:17ch}
.fcmp[data-v="b"] .fields #f-what{width:20ch}
.fcmp[data-v="b"] .fields textarea{display:block;width:100%;min-height:3.4em;margin-top:.2em;padding:.1em .12em;border:0;border-bottom:2px solid #cbc8bf;font-size:inherit;font-weight:500;letter-spacing:inherit;line-height:1.4;color:#5b6d00;transition:border-color .3s}
.fcmp[data-v="b"] .fields>div:last-child::after{content:""}
.fcmp[data-v="b"] .fields input:focus,.fcmp[data-v="b"] .fields textarea:focus{border-color:#9dbd00}
.fcmp[data-v="b"] .fields ::placeholder{color:#b9b6c4;font-weight:400}
.fcmp[data-v="b"] .fields .bad{border-color:#c0392b}
.fcmp[data-v="b"] #form>.sm{font-size:clamp(1.3rem,2.4vw,1.85rem);font-weight:500;letter-spacing:-.02em;color:var(--ink);margin:18px 0 12px!important}
/* closing B: the line fills as you read, a horizon rises under it */
.cl2{text-align:center}
.cl2h{margin:clamp(14px,2vw,22px) auto 0;max-width:20ch}
.cl2 .mw{opacity:.26}
.cl2 .mw.on{opacity:1}
.cl2v{height:clamp(170px,22vw,280px);margin-top:clamp(26px,4vw,50px)}

/* ===== v5.6: Contact, more options ===== */
/* hero C: a knot that works itself out into a ring */
.untbox{position:relative;aspect-ratio:1/.88;width:100%;max-width:560px;margin-inline:auto}
.untbox canvas{position:absolute;inset:0;width:100%;height:100%}
.untl{position:absolute;left:50%;bottom:2%;translate:-50% 0;display:flex;align-items:center;gap:9px;font-size:.6rem;color:var(--ink);white-space:nowrap}
.untl i{width:8px;height:8px;border-radius:50%;background:#b6d421;box-shadow:0 0 0 4px rgba(182,212,33,.22)}
/* three ways C: an index with a sphere that follows the cursor */
.wix{border-top:1px solid var(--ink)}
.wix li{border-bottom:1px solid var(--line)}
.wr{display:grid;grid-template-columns:44px minmax(0,4fr) minmax(0,5fr) auto;gap:8px 22px;align-items:center;width:100%;padding:clamp(20px,2.8vw,34px) 0;text-align:left;transition:padding .45s cubic-bezier(.2,.7,.2,1)}
.wr>i{font-style:normal;font-size:.66rem;font-weight:600;letter-spacing:.14em;color:var(--soft)}
.wr b{font-size:clamp(1.5rem,3.2vw,2.5rem);font-weight:500;letter-spacing:-.035em;line-height:1.05}
.wrd{font-size:1rem;color:var(--mute);max-width:44ch}
.wr em{font-style:normal;font-size:1.1rem;transition:translate .45s cubic-bezier(.2,.7,.2,1),color .3s}
.wrs{display:none;width:52px}
@media(hover:hover) and (pointer:fine){.wix:hover li{opacity:.4}.wix li{transition:opacity .3s}.wix li:hover{opacity:1}.wr:hover{padding-left:14px}.wr:hover em{translate:6px 0;color:#7d9800}}
.wfo{position:fixed;left:0;top:0;z-index:60;width:clamp(110px,12vw,170px);margin:calc(clamp(110px,12vw,170px)/-2) 0 0 0;pointer-events:none;opacity:0;scale:.6;transition:opacity .3s,scale .45s cubic-bezier(.2,.7,.2,1);will-change:transform}
.wfo.on{opacity:1;scale:1}
@media(max-width:760px){.wr{grid-template-columns:auto minmax(0,1fr) auto;gap:6px 16px;padding:18px 0}.wr>i{display:none}.wrs{display:block;grid-row:1/3}.wr b{grid-column:2}.wrd{grid-column:2;font-size:.94rem}.wr em{grid-column:3;grid-row:1/3}}
/* three ways D: the topics as spheres */
.tplay{position:relative;height:clamp(320px,36vw,430px);touch-action:pan-y}
.tplay canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab}
.tplay canvas.grab{cursor:grabbing}
.tplay .dph{position:absolute;left:0;top:0;bottom:auto;display:flex;align-items:center;gap:8px;font-size:.56rem;color:var(--mute);pointer-events:none}
.tplay .dph::before{content:"";width:7px;height:7px;border-radius:50%;background:#b6d421}
@media(max-width:760px){.tplay{height:min(340px,88vw)}}
/* the form C: one question at a time */
.fcmp[data-v="c"] #form{display:none}
.fcmp:not([data-v="c"]) .cvf{display:none}
.cvl{display:grid;gap:14px;margin-bottom:18px}
.cvl li{display:grid;justify-items:start;gap:6px;animation:cvin .5s cubic-bezier(.2,.9,.3,1.1) both}
.cvl li.me{justify-items:end}
.cvl .cw{font-size:.56rem;color:var(--mute);letter-spacing:.18em;text-transform:uppercase;font-weight:600}
.cvb{max-width:min(460px,90%);padding:13px 18px;border:1px solid var(--line);border-radius:18px 18px 18px 5px;background:#fff;font-size:1.02rem;line-height:1.4;box-shadow:0 16px 36px -26px rgba(40,30,80,.35)}
.cvl li.me .cvb{background:var(--ink);border-color:var(--ink);color:#fff;border-radius:18px 18px 5px 18px;cursor:pointer}
.cvl li.me .cvb:hover{background:#26262b}
@keyframes cvin{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
.cvi{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;padding-top:14px;border-top:1px solid var(--ink)}
.cvi input,.cvi textarea{flex:1 1 220px;min-width:0;border:0;border-bottom:1px solid #cbc8bf;border-radius:0;background:transparent;padding:10px 0;font-size:1.05rem}
.cvi textarea{min-height:76px;resize:vertical}
.cvi input:focus,.cvi textarea:focus{outline:0;border-color:var(--ink)}
.cvi .chips{flex:1 1 100%}
.cvi .btn{flex:none}
.cvi .cvr{font-size:.82rem;color:var(--mute);border-bottom:1px solid currentColor;padding-bottom:2px}
.cvf .msg.err{color:#c0392b}
/* closing C: three lines, one in focus */
.cl3{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(16px,2.4vw,26px)}
.cl3l{justify-self:start;max-width:860px}
.cl3l li:last-child.on span{color:#b9a4ff}

#p-contact .clsec:has(.cmp[data-v="b"]) .arc{display:none}

/* a page that is listed but not open yet */
.main a.off,.foot nav a.off{color:var(--soft);cursor:default;pointer-events:none}
.off .sn{font-style:normal;font-size:.5rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-left:6px;vertical-align:.55em;color:var(--soft)}

@media(max-width:760px){#p-careers .roles .rr span:nth-of-type(3){display:block}#p-careers .roles .rr .ap{grid-row:1/5}}

/* logos */
.logo.lgh{display:block;letter-spacing:0;line-height:0}
.logo.lgh svg{display:block;height:19px;width:auto}
.logo.lgf{display:block;letter-spacing:0;line-height:0;margin-bottom:12px}
.logo.lgf svg{display:block;height:44px;width:auto}
.cxl h3 .cxlg{display:block;width:clamp(190px,23vw,300px);height:auto}
.cxl h3:has(.cxlg){margin-bottom:clamp(14px,2vw,22px)}
@media(max-width:760px){.logo.lgh svg{height:17px}.cxl h3 .cxlg{width:min(230px,62vw)}}

/* ===== footer: three designs to compare, plus the current one ===== */
.logo svg,.cxlg.zd,.lgs{fill:#353434}
.night .lgs{fill:#fff}
.ftc>[data-o]{display:none}
.ftc[data-v="a"]>[data-o="a"],.ftc[data-v="b"]>[data-o="b"],.ftc[data-v="c"]>[data-o="c"],.ftc[data-v="d"]>[data-o="d"],.ftc[data-v="e"]>[data-o="e"]{display:block}
.ftsw{border-top:1px solid var(--line);padding:10px 0 2px}
.ftsw .ovsw{margin:0}
.ft{font-size:.84rem;color:var(--mute)}
.ft .caps{font-size:.58rem;color:var(--soft);margin-bottom:14px}
.ftg{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr) minmax(0,1.5fr) minmax(0,.7fr);gap:clamp(22px,4vw,56px)}
.ftt{font-size:clamp(1.05rem,1.7vw,1.3rem);font-weight:500;letter-spacing:-.02em;color:var(--ink);margin-bottom:18px;max-width:16ch;line-height:1.25}
.ftn.col{display:grid;gap:9px;justify-items:start}
.ftn a{color:var(--mute);transition:color .25s}
.ftn a:hover{color:var(--ink)}
.ftn a.on{color:var(--ink);border-bottom:1px solid currentColor}
.ftn a.off{color:var(--soft);cursor:default;pointer-events:none}
.ftdl{display:grid;gap:8px}
.ftdl div{display:grid;grid-template-columns:minmax(0,9.5em) minmax(0,1fr);gap:10px}
.ftdl dt{color:var(--soft)}
.ftdl dd{color:var(--ink)}
.ftdl dd.tba{color:var(--soft);font-style:italic}
.ftso{display:grid;gap:9px;color:var(--ink)}
.ftlg{display:flex;flex-wrap:wrap;gap:6px 26px;font-size:.74rem;color:var(--soft)}
/* A: the wordmark runs the full width */
.fta{padding:clamp(34px,5vw,60px) 0 22px}
.fta .ftt{margin:0}
.ftw{display:block;margin:clamp(34px,5vw,64px) 0 16px;line-height:0}
.ftw svg{display:block;width:100%;height:auto}
.fta .ftlg{padding-top:14px;border-top:1px solid var(--line)}
/* B: ends on an invitation */
.ftb{padding:clamp(40px,6vw,76px) 0 24px;color:#b8b6c4}
.ftbh{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(20px,5vw,70px);align-items:center;padding-bottom:clamp(28px,4vw,48px);margin-bottom:clamp(28px,4vw,44px);border-bottom:1px solid #26262b}
.ftbh .ftlogo svg{height:clamp(46px,5.6vw,66px)}
.ftbh .ftt{margin:0;max-width:none}
.ftg3{grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr) minmax(0,.7fr)}
.ftring{position:relative;display:block;width:clamp(84px,13vw,170px);aspect-ratio:1;border-radius:50%;filter:drop-shadow(0 0 26px rgba(207,233,74,.55));animation:cofloat 8s ease-in-out infinite}
.ftring i{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 24%,#fdffe8 0,#e9f888 14%,#cfe94a 34%,#a8c31d 62%,#55680a 100%);-webkit-mask-image:radial-gradient(circle closest-side,transparent calc(66% - 1px),#000 66%);mask-image:radial-gradient(circle closest-side,transparent calc(66% - 1px),#000 66%)}
.ftring::before{content:"";position:absolute;inset:17%;border-radius:50%;background:radial-gradient(circle at 42% 36%,#fff 0,#f4f3ee 70%,#e4e2d8 100%)}
.ftlogo{display:block;line-height:0;margin-bottom:16px}
.ftlogo svg{display:block;height:46px;width:auto}
.night.ft .caps{color:#8a8798}
.night.ft .ftt{color:#fff}
.night.ft .ftn a{color:#b8b6c4}
.night.ft .ftn a:hover,.night.ft .ftn a.on{color:#fff}
.night.ft .ftn a.off{color:#6f6d7a}
.night.ft .ftdl dt{color:#8a8798}
.night.ft .ftdl dd{color:#fff}
.night.ft .ftdl dd.tba{color:#6f6d7a}
.night.ft .ftso{color:#fff}
.night.ft .ftlg{color:#8a8798}
.ftb .ftlg{margin-top:clamp(30px,4vw,48px);padding-top:16px;border-top:1px solid #26262b}
/* C: everything centred above a glowing horizon */
.ftc3{padding:clamp(48px,7vw,90px) 0 0;color:#b8b6c4}
.ftcc{display:grid;justify-items:center;text-align:center;gap:clamp(16px,2.2vw,24px)}
.ftcc .ftlogo{margin:0}
.ftcc .ftlogo svg{height:clamp(46px,5.4vw,64px)}
.ftcc .ftt{max-width:none;margin:0;font-size:1rem;font-weight:400;color:#b8b6c4}
.ftn.row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;font-size:.9rem}
.ftcc .ftdl{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 28px;font-size:.78rem;max-width:880px}
.ftcc .ftdl div{display:flex;gap:8px}
.ftcc .ftso{display:flex;gap:26px}
.ftcv{height:clamp(120px,17vw,220px);margin:clamp(20px,3vw,36px) 0 0}
.ftcl{position:absolute;left:0;right:0;bottom:16px;max-width:none}
.ftcl .ftlg{justify-content:center}
@media(max-width:860px){
  .ftg{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 20px}
  .ftg>div:nth-child(1),.ftg>div:nth-child(3){grid-column:1/-1}
  .ftg>div:nth-child(3){order:4}
  .ftg>div:nth-child(4){order:3}
  .ftg3>div:nth-child(1),.ftg3>div:nth-child(3){grid-column:auto;order:0}
  .ftg3>div:nth-child(2){grid-column:1/-1;order:5}
  .ftdl div{grid-template-columns:minmax(0,8.5em) minmax(0,1fr)}
  .ftcc .ftdl{display:grid;justify-items:center;gap:6px}
  .ftcl{bottom:10px}
  .ftcl .ftlg{gap:2px 14px;font-size:.68rem}
}
@media(prefers-reduced-motion:reduce){.ftring{animation:none}}

/* D: white bands above a lime sphere rising from the bottom edge */
.fte{padding:clamp(34px,5vw,60px) 0 0}
.ftet{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(20px,4vw,60px);align-items:center}
.fte .ftlogo{margin-bottom:12px}
.fte .ftlogo svg{height:clamp(44px,5vw,58px)}
.fte .ftt{margin:0;max-width:none;font-size:1rem;font-weight:400;color:var(--mute)}
.fter{display:grid;justify-items:end;gap:12px}
.fte .ftn.row{justify-content:flex-end;font-size:.9rem}
.fte .ftso{display:flex;gap:22px}
.ftstrip{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(0,1.35fr) minmax(0,1fr) minmax(0,1.25fr);margin-top:clamp(26px,4vw,44px);border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.ftstrip div{padding:16px 16px 16px 0}
.ftstrip div+div{padding-left:16px;border-left:1px solid var(--line)}
.ftstrip dt{font-size:.56rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--soft);margin-bottom:8px}
.ftstrip dd{color:var(--ink);font-size:.86rem}
.ftstrip dd.tba{color:var(--soft);font-style:italic}
.ftcap{position:relative;height:clamp(150px,19vw,250px);margin-top:clamp(6px,1vw,14px);overflow:hidden;--hx:36%}
.ftcap::before{content:"";position:absolute;left:50%;top:clamp(46px,6vw,74px);width:max(150vw,1150px);aspect-ratio:1;translate:-50% 0;border-radius:50%;background:radial-gradient(circle at var(--hx) 5%,#fdffe8 0,#eefaa0 5%,#d6ee58 13%,#b5d226 30%,#8ea614 55%,#5f7308 100%);box-shadow:0 0 70px rgba(207,233,74,.6),0 0 0 1px rgba(125,152,0,.25)}
.ftcap .ftlg{position:absolute;left:0;right:0;bottom:16px;justify-content:center;color:#1f2700;font-weight:500}
@media(max-width:860px){
  .ftet{grid-template-columns:minmax(0,1fr)}
  .fter{justify-items:start}
  .fte .ftn.row{justify-content:flex-start}
  .ftstrip{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ftstrip div,.ftstrip div+div{padding:13px 10px 13px 0;border-left:0;border-top:1px solid var(--line)}
  .ftstrip div:nth-child(-n+2){border-top:0}
  .ftstrip div:first-child{grid-column:1/-1}
  .ftstrip div:nth-child(2){border-top:1px solid var(--line)}
  .ftcap .ftlg{bottom:10px;gap:2px 14px;font-size:.68rem;padding-inline:16px}
}

/* company details are real now */
.ft dd{line-height:1.45}
.ft dd a{color:inherit;border-bottom:1px solid transparent;transition:border-color .25s}
.ft dd a:hover{border-color:currentColor}
.ftcc .ftdl div:first-child{flex:1 1 100%;justify-content:center}
.foot .fcd{max-width:46ch;line-height:1.55}
.foot .fcd a{color:inherit}
.foot .fcd a:hover{color:var(--ink)}
@media(max-width:860px){.ftcc .ftdl div:first-child{display:block;text-align:center}.ftcc .ftdl div:first-child dt{margin-bottom:2px}}

.ft dd{overflow-wrap:anywhere}
@media(max-width:860px){.ftstrip div:nth-child(2){grid-column:1/-1}}

/* footer D is final */
footer.fte{border-top:1px solid var(--line)}
.fte .ftlogo{margin-bottom:0}

/* ===== desktop-only changes (laptop and desktop screens, 1024px and wider). Phones and tablets never match these rules. ===== */
.ovd{display:none}
@media(min-width:1024px){
  /* Home: one spacing rhythm for laptop and desktop. Light sections 80 above and below their content, dark sections 88, hero 56 below */
  #p-home .hero{padding-bottom:clamp(40px,3.9vw,56px)}
  #p-home .band{padding-block:clamp(64px,5.6vw,80px)}
  #p-home .band.night{padding-block:clamp(72px,6.2vw,88px)}
  /* 02: with the panel gone the cube needs less room around it */
  #p-home .dsec[data-d="b"] .xray{min-height:clamp(300px,26vw,372px)}
  /* Home 02, new: the cube floats on the page, no panel and no grid */
  .dsec[data-d="b"] .xray{background:radial-gradient(46% 42% at 50% 52%,rgba(207,233,74,calc(var(--o)*.42)),rgba(207,233,74,0) 72%);overflow:visible;border-radius:0}
  .dsec[data-d="b"] .xray::before{display:none}
  .dsec[data-d="b"] .xscene::after{content:"";position:absolute;left:50%;bottom:9%;width:46%;height:7%;translate:-50% 0;border-radius:50%;background:radial-gradient(closest-side,rgba(40,30,80,.2),rgba(40,30,80,0));pointer-events:none}
  /* Home 05, new: the branches run the full width */
  .dsec[data-d="b"] .ovc{display:none!important}
  .dsec[data-d="b"] .ovd{display:block}
  .tree2{position:relative;width:100%;aspect-ratio:1180/270;margin-top:clamp(4px,.8vw,12px)}
  .tree2 svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none}
  .tree2 .b2{stroke-width:2.4;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s cubic-bezier(.3,.6,.2,1)}
  .ov.in .tree2 .b2{stroke-dashoffset:0}
  .tree2 .b2.k2{transition-delay:.3s}
  .tree2 .b2.k3{transition-delay:.6s}
  .tree2 .b2m{stroke:#b9b6c4;stroke-width:1.6;stroke-dasharray:3 6;opacity:0;transition:opacity .7s 1.3s}
  .ov.in .tree2 .b2m{opacity:1}
  .tree2 .n2{transform-box:fill-box;transform-origin:center;scale:0;transition:scale .5s cubic-bezier(.2,1.5,.4,1) .9s}
  .tree2 .n2.k2{transition-delay:1.2s}
  .tree2 .n2.k3{transition-delay:1.5s}
  .tree2 .n2.k4{transition-delay:1.8s;fill:var(--paper);stroke:#b9b6c4;stroke-width:1.6}
  .ov.in .tree2 .n2{scale:1}
  .tree2 .o2{position:absolute;left:0;top:30%;font-size:.6rem;color:var(--mute)}
  .tree2 .m2{position:absolute;right:0;top:4%;font-size:.6rem;color:var(--soft);opacity:0;transition:opacity .6s 1.8s}
  .ov.in .tree2 .m2{opacity:1}
  .tree2 .l2{position:absolute;top:59%;width:23%;display:block;opacity:0;translate:0 12px;transition:opacity .5s .9s,translate .6s cubic-bezier(.2,.7,.2,1) .9s}
  .tree2 .l2.k2{transition-delay:1.2s}
  .tree2 .l2.k3{transition-delay:1.5s}
  .ov.in .tree2 .l2{opacity:1;translate:0}
  .tree2 .l2 b{display:inline-block;font-size:clamp(1.6rem,2.5vw,2.2rem);font-weight:600;letter-spacing:-.03em;line-height:1.05;color:var(--c);background:linear-gradient(var(--c),var(--c)) 0 100%/0 2px no-repeat;transition:background-size .45s cubic-bezier(.2,.7,.2,1)}
  .tree2 .l2:hover b{background-size:100% 2px}
  .tree2 .l2 span{display:block;margin-top:8px;font-size:.95rem;line-height:1.4;color:var(--mute)}
  /* Home 07: the circles line up with the headline and arrive with it */
  #p-home .d07 .split{align-items:start}
  #p-home .d07 .venn2{margin-top:10px}
  /* Home 08 and 09: one full-width section each, so black never touches black. The quote is centred and fills in as you scroll */
  .duo[data-d="c"]{grid-template-columns:minmax(0,1fr)}
  .duo[data-d="c"]>*{min-height:0;padding:clamp(66px,5.9vw,84px) max(56px,calc((100% - var(--w))/2 + 56px))}
  .duo[data-d="c"] .night>div{max-width:min(600px,62%)!important}
  .duo[data-d="c"] .night h2{font-size:clamp(1.9rem,4.1vw,2.9rem)!important;max-width:none}
  .duo[data-d="c"] .night .sm{max-width:46ch;font-size:1rem}
  .duo[data-d="c"] .quote{text-align:center;background:linear-gradient(180deg,#ecebe8,#f6f5f1 70%)}
  .duo[data-d="c"] .quote .eb{justify-content:center}
  .duo[data-d="c"] blockquote{max-width:19ch;margin:14px auto 0;font-size:clamp(2.1rem,3.7vw,3.1rem);line-height:1.1;letter-spacing:-.04em}
  .duo[data-d="c"] blockquote .qw{opacity:.2;transition:opacity .35s}
  .duo[data-d="c"] blockquote .qw.on{opacity:1}
  .duo[data-d="c"] .who{margin-top:clamp(26px,3vw,38px)}
  .duo[data-d="c"] .who::before{content:"";display:block;width:44px;height:3px;border-radius:2px;margin:0 auto 18px;background:linear-gradient(90deg,#b6d421,#8a64f0)}
  .duo[data-d="c"] .who b{font-size:1.05rem}
  .duo[data-d="c"] .quote .lnk{display:inline-flex;margin-top:18px}
}
@media(min-width:1024px) and (prefers-reduced-motion:reduce){.tree2 .b2,.tree2 .b2m,.tree2 .n2,.tree2 .l2,.tree2 .m2{transition:none}}

/* ===== desktop compare switches (hidden on phones and tablets) ===== */
.dsw{display:none}
.cmap2{display:none}
@media(min-width:1024px){
  .dsw{display:flex;position:absolute;z-index:3;top:20px;right:max(56px,calc((100% - var(--w))/2 + 56px));margin:0}
  /* Products 02: a shorter section on laptop and desktop, with less black above and below */
  #p-products .vsec{padding-block:clamp(44px,3.9vw,56px) clamp(40px,3.6vw,52px)}
  #p-products .vsec .vspec{margin-top:clamp(18px,2vw,28px)}
  /* Products 02, new: the map lifted into three dimensions, with many travellers */
  .vsec[data-d="b"] .cmap{display:none}
  .vsec[data-d="b"] .cmap2{display:block;position:relative;min-height:clamp(330px,29vw,410px);margin-right:clamp(-70px,-4vw,-20px)}
  .cmap2 canvas{position:absolute;inset:0;width:100%;height:100%}
  /* Products, "Venture 01 is the first", new: the four numerals in one row, the unbuilt ones outlined with a light passing through them */
  .nextband[data-d="b"] .odo{display:none}
  .nextband[data-d="b"] .odo3{display:block}
  .o3row,.o3tx{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;column-gap:clamp(10px,2vw,30px)}
  .o3row{align-items:end}
  .o3n{font-size:clamp(6rem,12.2vw,10.6rem);font-weight:500;letter-spacing:-.06em;line-height:.9;font-variant-numeric:tabular-nums;opacity:0;translate:0 28px;transition:opacity .7s var(--dl,0s),translate .9s cubic-bezier(.2,.7,.2,1) var(--dl,0s)}
  .odo3.on .o3n{opacity:var(--op,1);translate:0}
  .o3n.g{color:transparent;-webkit-text-stroke:1.5px #a29fb0;background:linear-gradient(100deg,transparent 42%,rgba(182,212,33,.95) 50%,transparent 58%) 130% 0/320% 100% no-repeat;-webkit-background-clip:text;background-clip:text;animation:o3sw 5.5s linear infinite}
  .o3n.n2{--op:.95;--dl:.15s}
  .o3n.n3{--op:.62;--dl:.3s;animation-delay:.45s}
  .o3n.n4{--op:.36;--dl:.45s;animation-delay:.9s;filter:blur(1px)}
  .o3line{position:relative;height:3px;margin:clamp(14px,1.6vw,22px) 0 clamp(14px,1.6vw,20px);background:repeating-linear-gradient(90deg,#c6c3ce 0 4px,transparent 4px 10px) 0 1px/100% 1px no-repeat;-webkit-mask-image:linear-gradient(90deg,#000 70%,transparent);mask-image:linear-gradient(90deg,#000 70%,transparent)}
  .o3line i{position:absolute;left:0;top:0;height:3px;width:0;border-radius:2px;background:#b6d421;transition:width 1.1s cubic-bezier(.3,.6,.2,1) .2s}
  .odo3.on .o3line i{width:24%}
  .o3line b{position:absolute;top:-1px;left:24%;width:60px;height:5px;border-radius:3px;background:linear-gradient(90deg,#b6d421,transparent);opacity:0;animation:o3run 3.6s linear infinite}
  .odo3.on .o3line b{opacity:1}
  .o3tx>div:last-child{grid-column:2/-1}
  .o3tx .otx{max-width:none;margin-top:6px;font-size:clamp(1.05rem,1.5vw,1.25rem)}
  /* Products 04, second new layout: three overlapping lenses, one for each way in */
  .pw4[data-d="c"] .strip{display:none}
  .pw4[data-d="c"] .pw4c{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(30px,6vw,96px);align-items:center}
  .pw4c .lead{margin-top:16px;max-width:42ch}
  .plens{position:relative;width:100%;max-width:520px;aspect-ratio:1/.9;justify-self:center;--g:0}
  .pl{position:absolute;width:54%;aspect-ratio:1;border-radius:50%;display:grid;place-content:center;justify-items:center;gap:8px;text-align:center;opacity:.86;box-shadow:0 30px 50px -34px rgba(40,30,80,.45),inset 0 0 0 1px rgba(255,255,255,.55);transition:scale .5s cubic-bezier(.2,.7,.2,1),opacity .3s;color:var(--ink)}
  .pl b{font-size:clamp(1.02rem,1.5vw,1.25rem);font-weight:600;letter-spacing:-.015em;line-height:1.15}
  .pl i{font-style:normal;font-size:.95rem;transition:translate .4s cubic-bezier(.2,.7,.2,1)}
  .pl.l1{left:3%;top:0;translate:calc((1 - var(--g))*-16%) calc((1 - var(--g))*-9%);background:radial-gradient(circle at 30% 26%,#fdffe8 0,#e6f77a 34%,#c4de33 78%,#a4bf1a 100%);padding:0 14% 12% 0}
  .pl.l2{right:3%;top:0;translate:calc((1 - var(--g))*16%) calc((1 - var(--g))*-9%);background:radial-gradient(circle at 70% 26%,#f4efff 0,#c2b0ff 36%,#9a79f4 80%,#7a56e0 100%);padding:0 0 12% 14%}
  .pl.l3{left:23%;bottom:0;translate:0 calc((1 - var(--g))*18%);background:radial-gradient(circle at 40% 30%,#fff 0,#f1eff7 40%,#d8d4e6 84%,#bcb7cf 100%);padding:16% 0 0}
  .pl:hover,.pl:focus-visible{scale:1.05;opacity:1;z-index:2}
  .pl:hover i{translate:5px 0}
  .plc{position:absolute;left:50%;top:47%;translate:-50% -50%;font-size:.56rem;color:var(--ink);opacity:calc(var(--g)*2.4 - 1.4);pointer-events:none}
  /* Products 04, third new layout: three cards that slide together into a fanned hand. No circles */
  .pw4[data-d="d"] .strip,.pw4[data-d="d"] .pw4c{display:none}
  .pw4[data-d="d"]{overflow-x:clip}
  .pw4[data-d="d"] .pw4d{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(30px,6vw,96px);align-items:center}
  .pw4d .lead{margin-top:16px;max-width:42ch}
  .pdeck{position:relative;width:100%;max-width:560px;height:clamp(400px,34vw,460px);justify-self:center;perspective:1200px;--dg:0;--dmx:0;--dmy:0}
  .pc{position:absolute;left:50%;top:50%;width:clamp(210px,18vw,250px);height:clamp(280px,24vw,330px);margin:calc(clamp(280px,24vw,330px)/-2) 0 0 calc(clamp(210px,18vw,250px)/-2);border-radius:24px;padding:22px 22px 20px;display:grid;grid-template-rows:auto 1fr auto auto;row-gap:10px;color:var(--ink);box-shadow:0 46px 60px -40px rgba(40,30,80,.6),inset 0 1px 0 rgba(255,255,255,.7),inset 0 0 0 1px rgba(255,255,255,.35);
    transform:translate(calc(var(--cdx)*var(--dg) + var(--csx)*(1 - var(--dg)) + var(--dmx)*var(--cpp)),calc(var(--cdy)*var(--dg) + var(--csy)*(1 - var(--dg)) + var(--dmy)*var(--cpp)*.6)) rotate(calc(var(--cdr)*var(--dg) + var(--csr)*(1 - var(--dg))));
    transition:transform .55s cubic-bezier(.2,.7,.2,1),box-shadow .4s,filter .3s;will-change:transform}
  .pc.c1{--cdx:-64%;--cdy:5%;--cdr:-10deg;--csx:-118%;--csy:26%;--csr:-27deg;--cpp:-10px;z-index:1;background:linear-gradient(150deg,#f6ffb0 0,#dcf255 42%,#b6d421 100%)}
  .pc.c2{--cdx:0%;--cdy:-5%;--cdr:2deg;--csx:0%;--csy:-24%;--csr:-6deg;--cpp:-18px;z-index:2;background:linear-gradient(150deg,#e3d9ff 0,#b29bff 44%,#7a56e0 100%)}
  .pc.c3{--cdx:64%;--cdy:6%;--cdr:12deg;--csx:118%;--csy:28%;--csr:29deg;--cpp:-26px;z-index:3;background:linear-gradient(150deg,#ffffff 0,#f1eff7 46%,#cfcbe0 100%)}
  .pc>i{font-style:normal;font-size:.66rem;font-weight:600;letter-spacing:.16em;opacity:.7}
  .pc b{align-self:end;font-size:clamp(1.5rem,2.2vw,1.9rem);font-weight:500;letter-spacing:-.035em;line-height:1.05}
  .pc span{font-size:.86rem;line-height:1.35;opacity:.78;min-height:2.7em}
  .pc em{justify-self:start;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:rgba(11,11,12,.9);color:#fff;font-style:normal;font-size:.95rem;transition:translate .45s cubic-bezier(.2,.7,.2,1)}
  .pc.c2{color:#fff}
  .pc.c2 em{background:#fff;color:var(--ink)}
  .pdeck:hover .pc{filter:saturate(.75) brightness(.97)}
  .pdeck .pc:hover,.pdeck .pc:focus-visible{z-index:5;filter:none;box-shadow:0 60px 70px -40px rgba(40,30,80,.7),inset 0 1px 0 rgba(255,255,255,.7),inset 0 0 0 1px rgba(255,255,255,.35);
    transform:translate(calc(var(--cdx)*var(--dg) + var(--csx)*(1 - var(--dg))),calc(var(--cdy)*var(--dg) + var(--csy)*(1 - var(--dg)) - 18px)) rotate(0deg) scale(1.04)}
  .pc:hover em{translate:5px 0}
}
@keyframes o3sw{0%{background-position:130% 0}60%,100%{background-position:-30% 0}}
@keyframes o3run{0%{left:24%;opacity:0}10%{opacity:1}100%{left:92%;opacity:0}}
.pw4c,.pw4d,.odo3{display:none}
@media(min-width:1024px) and (prefers-reduced-motion:reduce){.o3n,.o3line i{transition:none}.o3n.g,.o3line b{animation:none}}


/* ===== Capabilities, desktop options (quiet: ink lines on the page, colour only on what moves) ===== */
.hw3,.who3{display:none}
@media(min-width:1024px){
  /* 02 How we work, new: two rails that merge into the team and part again, with a pulse travelling each */
  .hws[data-d="b"] .lanes{display:none}
  .hws[data-d="b"] .hw3{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,43%) minmax(0,1fr);grid-template-areas:"a1 mid a2" "b1 mid b2";grid-template-rows:1fr 1fr;column-gap:clamp(14px,2vw,30px);height:clamp(330px,27vw,380px);margin-top:6px}
  .h3c{min-width:0;align-self:center;transition:opacity .35s}
  .h3c .caps{display:flex;align-items:center;gap:8px;font-size:.6rem;color:var(--mute);margin-bottom:10px}
  .h3c .caps i{width:8px;height:8px;border-radius:50%;background:#9dbd00}
  .h3c[data-l="b"] .caps i{background:var(--violet)}
  .h3c h3{font-size:clamp(1.5rem,2.1vw,1.8rem);font-weight:500;letter-spacing:-.03em;margin:0 0 6px}
  .h3c p:not(.caps){font-size:.95rem;color:var(--mute);max-width:30ch}
  .h3c .lo{font-size:1.05rem!important;font-weight:500;letter-spacing:-.015em;color:var(--ink)!important}
  .h3c .lnk{margin-top:14px}
  .h3m{position:relative;min-width:0}
  .h3m svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none}
  .h3r path{stroke:#c1bfca;stroke-width:1;vector-effect:non-scaling-stroke;transition:stroke .35s,opacity .35s}
  .h3k path{stroke:var(--ink);stroke-width:1;vector-effect:non-scaling-stroke;opacity:.55}
  .h3p{stroke-width:2.6;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:.045 .955;stroke-dashoffset:1;animation:h3run 5.2s linear infinite;transition:opacity .35s}
  .h3p.pa{stroke:#9dbd00}
  .h3p.pb{stroke:var(--violet);animation-delay:-2.6s}
  .h3t{position:absolute;left:30%;right:30%;top:50%;translate:0 -50%;padding:clamp(18px,1.9vw,26px) clamp(16px,1.6vw,22px);border-radius:14px;background:var(--night);color:#fff;box-shadow:0 30px 50px -34px rgba(20,16,40,.6)}
  .h3t .caps{font-size:.58rem;color:var(--lime);margin-bottom:8px}
  .h3t .tt{font-size:clamp(.98rem,1.2vw,1.12rem);font-weight:500;letter-spacing:-.015em;line-height:1.25}
  .hw3:has([data-l="a"].h3c:hover) [data-l="b"],.hw3:has([data-l="b"].h3c:hover) [data-l="a"]{opacity:.28}
  .hw3:has([data-l="a"].h3c:hover) .h3r [data-l="a"],.hw3:has([data-l="b"].h3c:hover) .h3r [data-l="b"]{stroke:var(--ink)}
  /* 04 Our approach, new: the numbers fade out softly at the screen's edge instead of being cut by a line. The dots stay, quieter */
  .apx[data-d="b"] .hxpin{--bl:max(clamp(20px,5vw,56px),calc((100vw - var(--w))/2 + clamp(20px,5vw,56px)))}
  .apx[data-d="b"] .hxbg{background-image:radial-gradient(42vmax 34vmax at 22% 46%,rgba(207,233,74,.09),transparent 70%),radial-gradient(rgba(255,255,255,.075) 1px,transparent 1.5px)}
  .apx[data-d="b"] .hxw{overflow:visible;margin-inline:calc(var(--bl)*-1);padding-inline:var(--bl);-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.5) calc(var(--bl)*.6),#000 calc(var(--bl) + 6px),#000 80%,transparent 99%);mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.5) calc(var(--bl)*.6),#000 calc(var(--bl) + 6px),#000 80%,transparent 99%)}
  /* 06 Who we work with, new: four names on one ruled line, with a single marker that travels to the one in focus */
  .whs[data-d="b"] .cols{display:none}
  .whs[data-d="b"] .who3{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:relative;--i:0;padding-top:6px}
  .w3h{grid-row:1;padding:0 20px 22px 0;cursor:default;outline:0}
  .w3h>i{display:block;font-style:normal;font-size:.66rem;font-weight:600;letter-spacing:.16em;color:var(--soft);margin-bottom:12px;transition:color .4s}
  .w3h b{display:block;font-size:clamp(1.7rem,2.7vw,2.4rem);font-weight:500;letter-spacing:-.04em;line-height:1.05;color:#bdbac8;transition:color .45s}
  .w3h.on b{color:var(--ink)}
  .w3h.on>i{color:var(--ink)}
  .w3l{grid-row:2;grid-column:1/-1;position:relative;height:13px;background:linear-gradient(var(--ink),var(--ink)) 0 6px/100% 1px no-repeat,repeating-linear-gradient(90deg,rgba(11,11,12,.34) 0 1px,transparent 1px calc(100%/40)) 0 3px/100% 7px no-repeat,repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 25%) 0 0/100% 13px no-repeat}
  .w3f{position:absolute;left:0;top:5px;height:3px;border-radius:2px;background:#9dbd00;width:0;transition:width .8s cubic-bezier(.3,.7,.2,1)}
  .who3.in .w3f{width:calc(var(--i)*25% + 46px)}
  .w3m{position:absolute;top:-6px;left:calc(var(--i)*25% + 42px);width:4px;height:25px;border-radius:2px;background:#9dbd00;box-shadow:0 0 14px rgba(157,189,0,.7);transition:left .8s cubic-bezier(.3,.7,.2,1),opacity .4s;opacity:0}
  .who3.in .w3m{opacity:1}
  .w3d{grid-row:3;padding:22px 26px 0 0;font-size:1rem;line-height:1.45;color:var(--mute);opacity:.45;transition:opacity .45s,color .45s;max-width:30ch}
  .w3d.on{opacity:1;color:var(--ink)}
}
@keyframes h3run{to{stroke-dashoffset:0}}
@media(min-width:1024px) and (prefers-reduced-motion:reduce){.h3p{animation:none;opacity:0}.w3f,.w3m,.w3h b,.w3d{transition:none}}

/* ===== Capabilities, two more desktop options: depth in the tech stack, weight in the closing section ===== */
@media(min-width:1024px){
  /* 05 Technology expertise, new: three rows at three distances. The far row is small, pale and slow; the near row is large, sharp and quicker */
  .tks[data-d="b"]{overflow-x:clip}
  .tks[data-d="b"] .split{grid-template-columns:minmax(0,1fr);row-gap:clamp(30px,3.6vw,50px)}
  .tks[data-d="b"] .split>div:first-child{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:clamp(28px,5vw,72px);align-items:end}
  .tks[data-d="b"] .split>div:first-child .eb{grid-column:1/-1}
  .tks[data-d="b"] .split>div:first-child .lead{margin:0;max-width:44ch}
  .tks[data-d="b"] .mq{--bl:max(clamp(20px,5vw,56px),calc((100vw - var(--w))/2 + clamp(20px,5vw,56px)));margin-inline:calc(var(--bl)*-1);gap:clamp(6px,1.1vw,16px);padding-block:6px 10px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
  .tks[data-d="b"] .mqt{gap:0;align-items:baseline}
  .tks[data-d="b"] .mqt span{padding:0 .62em;border:0;border-radius:0;background:none;font-weight:500;letter-spacing:-.04em;line-height:1.12;transition:color .3s}
  .tks[data-d="b"] .mqr{transition:filter .4s}
  .tks[data-d="b"] .mqr:nth-child(1){filter:blur(1.3px)}
  .tks[data-d="b"] .mqr:nth-child(1) .mqt{animation-duration:74s}
  .tks[data-d="b"] .mqr:nth-child(1) span{font-size:clamp(1.2rem,1.9vw,1.7rem);color:#c3c0cd}
  .tks[data-d="b"] .mqr:nth-child(2){filter:blur(.5px)}
  .tks[data-d="b"] .mqr:nth-child(2) .mqt{animation-duration:54s}
  .tks[data-d="b"] .mqr:nth-child(2) span{font-size:clamp(2rem,3.4vw,3rem);color:#9a97a8}
  .tks[data-d="b"] .mqr:nth-child(3) .mqt{animation-duration:38s}
  .tks[data-d="b"] .mqr:nth-child(3) span{font-size:clamp(3.2rem,5.8vw,5.2rem);color:var(--ink)}
  .tks[data-d="b"] .mqr:hover{filter:none}
  .tks[data-d="b"] .mqt span:hover{background:none;color:var(--ink);border-color:transparent}
  .tks[data-d="b"] .mqr:nth-child(3) span:hover{color:#7d9800}
  /* 07 Build with us, new: a dark closing section, so the page ends with weight */
  .cls7[data-d="b"]{background:var(--night);color:#fff;border-top:0;overflow:hidden;padding-block:clamp(84px,7.4vw,112px)}
  .cls7[data-d="b"]::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(46vmax 30vmax at 82% 108%,rgba(207,233,74,.16),transparent 70%),radial-gradient(40vmax 30vmax at 12% -10%,rgba(138,100,240,.16),transparent 70%),radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.5px) 0 0/26px 26px}
  .cls7[data-d="b"] .wrap{position:relative}
  .cls7[data-d="b"] .eb{color:#d5d3de}
  .cls7[data-d="b"] h2{font-size:clamp(2.3rem,4.6vw,3.4rem);max-width:13ch!important}
  .cls7[data-d="b"] .lead{color:#c5c3cf}
  .cls7[data-d="b"] .btn{background:#fff;color:var(--ink);border-color:#fff}
  .cls7[data-d="b"] .btn.ghost{background:transparent;color:#fff;border-color:#5a5861}
}


/* ===== Ecosystem, desktop ===== */
.sum2{display:none}
@media(min-width:1024px){
  /* one spacing rhythm, as on the landing page */
  #p-ecosystem .hero{padding-bottom:clamp(40px,3.9vw,56px)}
  #p-ecosystem .band{padding-block:clamp(64px,5.6vw,80px)}
  #p-ecosystem .band.night{padding-block:clamp(72px,6.2vw,88px)}
  /* 02 Our companies: the two logos set to the same letter height */
  #p-ecosystem .cxl h3 .cxlg.zd{width:clamp(220px,23vw,320px)}
  #p-ecosystem .cxl h3 .cxlg.zc{width:calc(clamp(220px,23vw,320px)*.6)}
  /* 02: a company fades as it leaves and as it arrives, right out to the screen's edge, so there is no line where it is cut */
  #p-ecosystem .cxsec{overflow-x:clip}
  #p-ecosystem .cx:not(.nopin) .cxpin{--bl:max(clamp(20px,5vw,56px),calc((100vw - var(--w))/2 + clamp(20px,5vw,56px)));margin-inline:calc(var(--bl)*-1);padding-inline:var(--bl);overflow:clip;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--bl),#000 calc(100% - var(--bl)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 var(--bl),#000 calc(100% - var(--bl)),transparent 100%)}
  #p-ecosystem .cx:not(.nopin) .cxw{overflow:visible;-webkit-mask-image:none;mask-image:none}
  #p-ecosystem .cx:not(.nopin) .cxt>li{opacity:clamp(0,calc(1.25 - max(var(--of,0),calc(var(--of,0)*-1))*1.6),1)}
  /* 03 Stronger together, option: a little depth. The loop tilts towards the cursor and the lists drift against the scroll */
  .st3[data-d="b"] .loopbox{--mx:0;--my:0;--sy:0;perspective:1100px}
  .st3[data-d="b"] .inf{transform:rotateY(calc(var(--mx)*7deg)) rotateX(calc(var(--my)*-5deg));transition:transform .6s cubic-bezier(.2,.7,.2,1);will-change:transform}
  .st3[data-d="b"] .loop>ul{translate:calc(var(--mx)*-12px) calc(var(--sy)*1px);transition:translate .5s cubic-bezier(.2,.7,.2,1)}
  .st3[data-d="b"] .loop>ul.r{translate:calc(var(--mx)*-12px) calc(var(--sy)*-1px)}
  .st3[data-d="b"] .loopbox .pill{translate:calc(var(--mx)*10px) calc(var(--sy)*-.5px);transition:translate .5s cubic-bezier(.2,.7,.2,1)}
  /* 04 Why an ecosystem, new: the sum set large across the page, the four reasons on a ruled row beneath */
  .sm4[data-d="b"] .sumrow,.sm4[data-d="b"] .sumcols{display:none}
  .sm4[data-d="b"] .sum2{display:block;--q:0}
  .sm4[data-d="b"]{overflow-x:clip}
  .sum2 h2{max-width:16ch}
  .s2eq{display:flex;align-items:flex-start;justify-content:space-between;margin-top:clamp(20px,2.6vw,36px);font-size:clamp(7rem,13.4vw,12.4rem);font-weight:500;letter-spacing:-.06em;line-height:.86}
  .s2eq>i,.s2eq>em{font-style:normal;font-weight:300;color:#b9b6c4;font-size:.5em;line-height:1.72;opacity:calc(.25 + var(--q)*.75)}
  .s2eq>em{color:#9dbd00;font-weight:400}
  .s2n{display:grid;justify-items:start;gap:14px}
  .s2n b{font-weight:500;color:transparent;-webkit-text-stroke:1.6px #8c8998}
  .s2n small{font-size:.62rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);line-height:1.3}
  .s2n.a{translate:calc((1 - var(--q))*-34px) 0}
  .s2n.c{translate:calc((1 - var(--q))*34px) 0}
  .s2n.t{position:relative;translate:calc((1 - var(--q))*34px) 0}
  .s2n.t b{color:var(--ink);-webkit-text-stroke:0;transform-origin:0 100%;scale:calc(.84 + var(--q)*.2)}
  .s2n.t::after{content:"";position:absolute;left:0;top:calc(.9em + 2px);height:5px;border-radius:3px;background:#b6d421;width:calc(var(--q)*.58em)}
  .s2b{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(34px,4vw,56px);border-top:1px solid var(--ink)}
  .s2b>div{padding:20px 26px 0 0;opacity:calc((var(--q) - var(--o,0))*3);translate:0 calc((1 - min(1,max(0,(var(--q) - var(--o,0))*3)))*14px)}
  .s2b>div>i{display:block;font-style:normal;font-size:.66rem;font-weight:600;letter-spacing:.16em;color:var(--soft);margin-bottom:14px}
  .s2b h3{font-size:1.16rem;font-weight:600;letter-spacing:-.015em;margin-bottom:8px}
  .s2b p{font-size:.95rem;line-height:1.45;color:var(--mute);max-width:26ch}
}

/* ===== Ecosystem, desktop: second round ===== */
.sum3{display:none}
@media(min-width:1024px){
  /* 02: each scroll step lands on a company; nothing rests half-way. The order is Zlanure Dynamics, Zlan Creations, Future Ventures */
  #p-ecosystem .cx:not(.nopin) .cxt{transition:transform .95s cubic-bezier(.3,.7,.15,1)}
  #p-ecosystem .cx:not(.nopin) .cxt>li{transition:opacity .6s}
  #p-ecosystem .cx:not(.nopin) .cxbg,#p-ecosystem .cx:not(.nopin) .cxo{transition:transform .95s cubic-bezier(.3,.7,.15,1)}
  /* 03: Zlanure Dynamics on the left, Zlan Creations on the right */
  #p-ecosystem .st3 .inf canvas{transform:scaleX(-1)}
  #p-ecosystem .st3 .il.l{left:75.4%}
  #p-ecosystem .st3 .il.r{left:24.6%}
  #p-ecosystem .st3 .loop>ul:first-child{order:3}
  #p-ecosystem .st3 .loop>.inf{order:2}
  #p-ecosystem .st3 .loop>ul.r{order:1}
  /* 04, second new option: three blocks of one that stack into a column taller than three */
  .sm4[data-d="c"] .sumrow,.sm4[data-d="c"] .sumcols,.sm4[data-d="c"] .sum2{display:none}
  .sm4[data-d="c"] .sum3{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:clamp(30px,6vw,96px);align-items:center;--q:0}
  .s3b{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 30px;margin-top:clamp(26px,3vw,40px);border-top:1px solid var(--ink);padding-top:22px}
  .s3b>div>i{display:block;font-style:normal;font-size:.66rem;font-weight:600;letter-spacing:.16em;color:var(--soft);margin-bottom:10px}
  .s3b h3{font-size:1.08rem;font-weight:600;letter-spacing:-.015em;margin-bottom:6px}
  .s3b p{font-size:.92rem;line-height:1.45;color:var(--mute)}
  .sm4[data-d="c"]{overflow-x:clip}
  .s3g{position:relative;width:calc(100% - clamp(84px,9vw,130px));max-width:520px;aspect-ratio:560/400;justify-self:start}
  .s3slot{position:absolute;top:60%;width:18%;height:20%;border:1px dashed #c1bfca;border-radius:10px}
  .s3cap{position:absolute;top:84%;width:18%;font-size:.56rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);line-height:1.35}
  .s3blk{position:absolute;width:18%;height:20%;border-radius:10px;display:grid;place-items:center;font-size:clamp(1.5rem,2.4vw,2rem);font-weight:500;letter-spacing:-.03em;
    --pk:clamp(0,calc((var(--q) - var(--st))/.26),1);
    left:calc(var(--x0) + var(--pk)*(74% - var(--x0)));top:calc(60% + var(--pk)*(var(--y1) - 60%));
    border:1.5px solid var(--ink);color:color-mix(in srgb,#fff calc(var(--pk)*100%),var(--ink));background:color-mix(in srgb,var(--ink) calc(var(--pk)*100%),transparent);box-shadow:0 calc(var(--pk)*22px) calc(var(--pk)*30px) calc(var(--pk)*-18px) rgba(20,16,40,.5)}
  .s3blk.b1{--x0:0%;--st:.08;--y1:60%}
  .s3blk.b2{--x0:22%;--st:.26;--y1:38.5%}
  .s3blk.b3{--x0:44%;--st:.44;--y1:17%}
  .s3x{position:absolute;left:74%;width:18%;border-radius:10px;background:linear-gradient(180deg,#e6f77a,#b6d421);--pe:clamp(0,calc((var(--q) - .72)/.26),1);height:calc(var(--pe)*13%);top:calc(15.5% - var(--pe)*13%);box-shadow:0 0 calc(var(--pe)*34px) rgba(207,233,74,.75)}
  .s3gt{position:absolute;left:95%;top:calc(15.5% - 13%);height:calc(64.5% + 13%);width:1px;background:var(--ink);opacity:clamp(0,calc((var(--q) - .78)*5),1)}
  .s3gt::before,.s3gt::after{content:"";position:absolute;left:-4px;width:9px;height:1px;background:var(--ink)}
  .s3gt::before{top:0}.s3gt::after{bottom:0}
  .s3n{position:absolute;left:97.5%;top:26%;font-size:clamp(2.6rem,4.6vw,4rem);font-weight:500;letter-spacing:-.05em;line-height:1;white-space:nowrap;opacity:clamp(0,calc((var(--q) - .78)*5),1)}
  .s3n small{display:block;margin-top:10px;font-size:.56rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);line-height:1.35}
  .s3n u{text-decoration:none;color:#9dbd00}
}

/* Ecosystem 02: the rail's colours follow the order Zlanure Dynamics, Zlan Creations, Future Ventures (all screens) */
#p-ecosystem .cxr::before{background:linear-gradient(90deg,var(--violet),#b6d421,#a9a6b6)}

/* ===== About, desktop ===== */
.bel3{display:none}
/* headlines that rise in word by word: the last letter of a word was being shaved at its right edge. This leaves the layout as it is and shows the whole letter */
.w{padding-right:.09em;margin-right:-.09em}
@media(min-width:1024px){
  /* 01: the large pale sphere no longer sits behind the words or under the rule */
  #p-about .mfb.b1{width:clamp(140px,13vw,200px);right:-4.5%;top:-12%;opacity:.96}
  #p-about .mfb.b2{right:16%;top:-6%}
  /* 02, new option: the four beliefs as one large sentence. One phrase is in focus; its line of text shows beneath */
  #p-about .ab2{position:relative}
  .ab2[data-d="b"] .bel{display:none}
  .ab2[data-d="b"] .split.s39{grid-template-columns:minmax(0,1fr);row-gap:clamp(18px,2.4vw,30px)}
  .ab2[data-d="b"] .bel3{display:block;--i:0}
  .b3s{font-size:clamp(2.6rem,5.3vw,4.6rem);font-weight:500;letter-spacing:-.045em;line-height:1.1;max-width:20ch}
  .b3s button{display:inline;padding:0;font:inherit;letter-spacing:inherit;color:#c6c3cf;text-align:left;cursor:default;background:linear-gradient(#9dbd00,#9dbd00) 0 100%/0 3px no-repeat;transition:color .5s,background-size .7s cubic-bezier(.3,.7,.2,1)}
  .b3s button.on{color:var(--ink);background-size:100% 3px}
  .b3d{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(160px,28%);align-items:center;column-gap:clamp(20px,3vw,44px);margin-top:clamp(28px,3.4vw,46px);padding-top:20px;border-top:1px solid var(--ink)}
  .b3n{font-size:.68rem;font-weight:600;letter-spacing:.16em;color:var(--soft)}
  .b3n b{color:var(--ink);font-weight:600}
  .b3d p{font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.4;color:var(--ink);min-height:1.4em}
  .b3d p.sw{animation:b3sw .5s cubic-bezier(.2,.7,.2,1)}
  .b3r{position:relative;height:9px;background:linear-gradient(var(--ink),var(--ink)) 0 4px/100% 1px no-repeat,repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 25%) 0 0/100% 9px no-repeat;border-right:1px solid var(--ink)}
  .b3r i{position:absolute;left:calc(var(--i)*25%);top:3px;width:25%;height:3px;background:#9dbd00;transition:left .6s cubic-bezier(.3,.7,.2,1)}
}
@keyframes b3sw{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(min-width:1024px) and (prefers-reduced-motion:reduce){.b3s button,.b3r i{transition:none}.b3d p.sw{animation:none}}

/* ===== Careers, desktop: once the circle has opened, the "Currently hiring" band sits at the bottom of that screen ===== */
.ztkb{display:none}
@media(min-width:1024px){
  #p-careers .zin .ztkb{display:block;position:absolute;left:0;right:0;bottom:0;opacity:var(--zc);transition:opacity .3s}
  #p-careers .zh.nopin .zin .ztkb{opacity:1}
  /* this band sits at the very bottom edge, below the line where pieces normally fade in, so it is shown outright */
  #p-careers .ztkb [data-rv],#p-careers .ztkb .mq{opacity:1!important;transform:none!important}
  #p-careers .zin{padding-bottom:clamp(54px,7vh,64px)}
  #p-careers .zh.nopin .zin{padding-bottom:clamp(100px,12vw,150px)}
  #p-careers .zh+.ticker.tk2,#p-careers section:has(#zh)+.ticker.tk2{display:none}
}

/* ===== WhatsApp chat button: every page, every screen ===== */
.wab{display:flex;align-items:center;position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:45;height:50px;min-width:50px;padding:0;border-radius:27px;background:var(--ink);color:#fff;box-shadow:0 18px 34px -16px rgba(20,16,40,.6),0 0 0 1px rgba(255,255,255,.14);overflow:hidden;transition:background .3s,box-shadow .3s,transform .3s cubic-bezier(.2,.7,.2,1),opacity .3s;animation:wabin .6s cubic-bezier(.2,.7,.2,1) 1.2s both}
.wab svg{flex:none;width:24px;height:24px;margin:0 13px}
.wab span{max-width:0;opacity:0;white-space:nowrap;font-size:.86rem;font-weight:500;transition:max-width .45s cubic-bezier(.2,.7,.2,1),opacity .3s,padding .45s cubic-bezier(.2,.7,.2,1)}
/* it steps aside when it would sit on top of a button or link, and while the menu is open */
.wab.hid{opacity:0!important;pointer-events:none}
body.menu .wab{opacity:0!important;pointer-events:none}
.wab:active{background:#1faa53}
@media(min-width:1024px){
  .wab{right:22px;bottom:22px;height:54px;min-width:54px}
  .wab svg{width:26px;height:26px;margin:0 14px}
}
@media(hover:hover) and (pointer:fine){
  .wab:hover,.wab:focus-visible{background:#1faa53;transform:translateY(-2px);box-shadow:0 22px 38px -16px rgba(18,120,60,.6)}
  .wab:hover span,.wab:focus-visible span{max-width:170px;opacity:1;padding-right:20px}
  .wab:hover svg,.wab:focus-visible svg{margin-right:8px}
}
@keyframes wabin{from{opacity:0;transform:translateY(14px) scale(.9)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.wab{animation:none;transition:none}.wab span{transition:none}}
@media print{.wab{display:none!important}}

/* ===== Products 03: each step carries its status, so "where we are" is clear at a glance (every screen) ===== */
.pst .pstg{display:inline-block;margin-left:10px;padding:3px 9px 3px;border-radius:99px;font-style:normal;font-size:.56rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;vertical-align:.18em;line-height:1.3;border:1px solid #c9c6d1;color:#8c8998;background:transparent}
.pst .pstg.d{border-color:transparent;background:#e6e4de;color:#5d5b66}
.pst .pstg.n{border-color:transparent;background:#cfe94a;color:var(--ink);box-shadow:0 0 0 4px rgba(207,233,74,.25)}

/* ===== The three sections that move sideways as you scroll (Capabilities 04, Careers 03, Ecosystem 02): every screen =====
   Each scroll step lands on a whole item. Nothing rests half-way between two. */
.hx:not(.nopin) .hxt,.vx:not(.nopin) .vxt,.cx:not(.nopin) .cxt{transition:transform .8s cubic-bezier(.3,.7,.15,1)}
.hx:not(.nopin) .hxx,.vx:not(.nopin) .vxbg,.cx:not(.nopin) .cxbg,.cx:not(.nopin) .cxo{transition:transform .8s cubic-bezier(.3,.7,.15,1)}
.hx:not(.nopin) .hxbg{transition:background-position .8s cubic-bezier(.3,.7,.15,1)}

/* ===== Contact form: a line that says which route the visitor came by (every screen) ===== */
.rt{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;width:max-content;max-width:100%;margin-top:22px;padding:11px 18px 11px 16px;border:1px solid var(--line);border-radius:14px;background:#fff}
.rt[hidden]{display:none}
.rt .caps{font-size:.6rem;color:var(--mute)}
.rt b{font-size:1.05rem;font-weight:600;letter-spacing:-.015em}
.rt b::before{content:"";display:inline-block;width:8px;height:8px;margin-right:9px;border-radius:50%;background:#9dbd00;vertical-align:.1em}
.rt.sw{animation:rtin .45s cubic-bezier(.2,.7,.2,1)}
@keyframes rtin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.rt.sw{animation:none}}