/* Enact Intelligence: brand extension concept. Tokens are Enact's own (enact-intelligence.com, Oct 2026). */
@font-face{font-family:'Heros Web';font-weight:400;font-style:normal;font-display:swap;src:url(/assets/heros-400.4c4a87ee20.woff2) format('woff2')}
:root{
  --enact-red:#fc4238;--enact-violet:#9957cf;--enact-black:#1a232d;--enact-grey:#f2f2f2;--enact-beige:#c4b5a9;
  --enact-gradient:linear-gradient(90deg,#fc4238 0%,#f23d6b 10%,#eb459e 20%,#e34acc 30%,#c44fd9 40%,#9957cf 50%,#6940ba 60%,#453894 70%,#303670 80%,#26304d 90%,#1a232d 100%);
  --grad-text:linear-gradient(90deg,#fc4238 0%,#f23d6b 13%,#eb459e 26%,#e34acc 40%,#c44fd9 54%,#9957cf 68%,#c44fd9 80%,#eb459e 91%,#fc4238 100%);
  --hot:linear-gradient(90deg,#fc4238 0%,#f23d6b 18%,#eb459e 36%,#e34acc 54%,#c44fd9 74%,#9957cf 100%);
  --enact-font:"Piz Grotesk","Neue Haas Grotesk Display","Helvetica Neue","Heros Web",Helvetica,Arial,system-ui,sans-serif;
  --fs-9:.5625rem;--fs-12:.75rem;--fs-16:1rem;--fs-22:1.375rem;--fs-28:1.75rem;--fs-38:2.375rem;--fs-50:3.125rem;--fs-68:4.25rem;
  --bg:#1a232d;--bg-2:#1d2731;--bg-3:#222d39;--fg:#f2f2f2;--fg-2:rgba(242,242,242,.66);--fg-3:rgba(242,242,242,.54);
  --line:rgba(242,242,242,.1);--line-2:rgba(242,242,242,.18);
  --ease:cubic-bezier(.16,1,.3,1);
  --wrap:78rem;--gut:max(1.5rem,4vw);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;scroll-padding-top:5rem}
body{margin:0;font-family:var(--enact-font);font-size:var(--fs-16);line-height:1.55;color:var(--fg);background:var(--bg);overflow-x:hidden}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit}
::selection{background:#9957cf;color:#fff}
:focus-visible{outline:2px solid var(--enact-red);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:1rem;top:-4rem;z-index:100;background:var(--fg);color:var(--bg);padding:.6rem 1rem;border-radius:2rem;text-decoration:none}
.skip:focus{top:1rem}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@keyframes fade{0%{opacity:0}}

/* ---------- layout ---------- */
.wrap{width:min(100%,var(--wrap));margin-inline:auto;padding-inline:var(--gut)}
.view{display:none}.view.active{display:block}
section{position:relative}
.sec{padding-block:clamp(5rem,11vw,10rem)}
.sec.tight{padding-block:clamp(3.5rem,7vw,6rem)}
.eyebrow{display:flex;align-items:center;gap:.9rem;margin:0 0 1.6rem;font-size:var(--fs-12);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3)}
.eyebrow .n{color:var(--fg)}
.eyebrow .dash{width:2.4rem;height:2px;background:var(--hot);border-radius:2px}
.tag{display:inline-block;font-size:var(--fs-9);letter-spacing:.16em;text-transform:uppercase;padding:.25rem .55rem;border:1px dashed var(--line-2);border-radius:99px;color:var(--fg-3)}
h1,h2,h3,h4{font-weight:400;margin:0}
.h-xl{font-size:clamp(3rem,7.4vw,7.6rem);line-height:.96;letter-spacing:-.035em}
.h-l{font-size:clamp(2.3rem,5vw,var(--fs-68));line-height:1.02;letter-spacing:-.03em}
.h-m{font-size:clamp(1.75rem,3vw,var(--fs-38));line-height:1.12;letter-spacing:-.02em}
.h-s{font-size:var(--fs-22);line-height:1.25;letter-spacing:-.01em}
.lede{font-size:clamp(1.125rem,1.6vw,1.375rem);line-height:1.5;color:var(--fg-2);max-width:40rem;letter-spacing:-.005em}
.muted{color:var(--fg-2)}.dim{color:var(--fg-3)}
p{margin:0}

/* Enact's origin-drift gradient text, as on /join */
.grad{background-image:var(--grad-text);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:origin-drift 16s ease-in-out infinite}
.grad.hotonly{background-image:var(--hot);background-size:200% 100%}
@keyframes origin-drift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto;z-index:30;transition:background .4s var(--ease),border-color .4s var(--ease);border-bottom:1px solid transparent}
.hdr.solid{background:rgba(26,35,45,.78);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-color:var(--line)}
.hdr .wrap{display:flex;align-items:center;gap:2.25rem;height:4.75rem}
.mark{display:flex;align-items:center;gap:.75rem;text-decoration:none;flex:none}
.mark img{height:1.15rem;width:auto}
.nav{display:flex;gap:1.9rem;list-style:none;margin:0 0 0 2.75rem;padding:0}
.nav a{font-size:1.1875rem;letter-spacing:-.005em;text-decoration:none;opacity:.55;padding-bottom:3px}
.nav a:hover{opacity:.85}
.nav a[aria-current=page]{opacity:1}
.hdr .end{margin-left:auto;display:flex;align-items:center;gap:1rem}
.menu-btn{display:none}
@media (max-width:1000px){
  .nav{display:none}
  .menu-btn{display:inline-flex;align-items:center;gap:.6rem;background:none;border:1px solid var(--line-2);border-radius:99px;height:2.6rem;padding:0 1rem;cursor:pointer}
  .menu-btn i{display:block;width:1rem;height:1px;background:currentColor;box-shadow:0 4px 0 currentColor}
  .hdr .roles{display:none}
}
.sheet{position:fixed;inset:0;z-index:60;background:radial-gradient(90% 50% at 100% 0%,rgba(153,87,207,.16),transparent 60%),var(--bg);display:flex;flex-direction:column;padding:0 max(var(--gut),env(safe-area-inset-right)) max(1.6rem,env(safe-area-inset-bottom)) max(var(--gut),env(safe-area-inset-left));clip-path:inset(0 0 100% 0);transition:clip-path .7s cubic-bezier(.7,0,.2,1);overscroll-behavior:contain}
.sheet.open{clip-path:inset(0 0 0 0)}
.sheet-top{display:flex;align-items:center;justify-content:space-between;height:4.75rem;flex:none}
.sheet-top img{height:1.15rem;width:auto}
.sheet .close{display:inline-flex;align-items:center;gap:.6rem;background:none;border:1px solid var(--line-2);border-radius:99px;height:2.6rem;padding:0 1rem;cursor:pointer}
.sheet .close i{position:relative;width:.8rem;height:.8rem}
.sheet .close i::before,.sheet .close i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:currentColor;transform:rotate(45deg)}
.sheet .close i::after{transform:rotate(-45deg)}
.sheet-nav{display:flex;flex-direction:column;margin-top:clamp(1.5rem,7svh,4rem)}
.sheet-nav a{display:flex;align-items:baseline;gap:1rem;font-size:clamp(2.6rem,12vw,4.4rem);letter-spacing:-.035em;line-height:1.08;text-decoration:none;color:var(--fg-2);padding:.18rem 0;border-bottom:1px solid var(--line);opacity:0;transform:translateY(1.4rem);transition:opacity .5s var(--ease),transform .8s var(--ease),color .3s}
.sheet-nav a span{font-size:var(--fs-12);letter-spacing:.16em;color:var(--fg-3);transform:translateY(-1.4em);min-width:1.6rem}
.sheet-nav a[aria-current=page]{color:var(--fg)}
.sheet-nav a[aria-current=page] span{color:transparent;background:var(--hot);-webkit-background-clip:text;background-clip:text}
.sheet-end{margin-top:auto;display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem;opacity:0;transform:translateY(1rem);transition:opacity .5s var(--ease),transform .8s var(--ease)}
.sheet-end .addr{color:var(--fg-3);font-size:var(--fs-12);letter-spacing:.12em;text-transform:uppercase}
.sheet.open .sheet-nav a,.sheet.open .sheet-end{opacity:1;transform:none;transition-delay:calc(.22s + var(--k) * 60ms)}
@media (prefers-reduced-motion:reduce){.sheet{transition:none}.sheet-nav a,.sheet-end{transition:none;opacity:1;transform:none}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.85rem;height:3.1rem;padding:0 .4rem 0 1.35rem;border-radius:99px;border:1px solid var(--line-2);text-decoration:none;font-size:var(--fs-16);letter-spacing:-.005em;white-space:nowrap;transition:border-color .2s ease,background .2s ease,transform .5s var(--ease)}
.btn:hover{border-color:rgba(242,242,242,.4)}
.btn .arr{display:grid;place-items:center;width:2.3rem;height:2.3rem;border-radius:50%;background:var(--hot);color:#fff;transition:transform .5s var(--ease)}
.btn:hover .arr{transform:translateX(3px)}
.btn .arr svg{width:.9rem;height:.9rem}
.btn.solid{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.btn.ghost{padding-right:1.35rem}
.btn.sm{height:2.6rem;padding-left:1.1rem;font-size:.9375rem}.btn.sm .arr{width:1.9rem;height:1.9rem}
.link{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;border-bottom:1px solid var(--line-2);padding-bottom:2px;transition:border-color .2s}
.link:hover{border-color:var(--enact-red)}
.count{display:inline-grid;place-items:center;min-width:1.6rem;height:1.6rem;padding:0 .45rem;border-radius:99px;background:rgba(242,242,242,.1);font-size:.8125rem}

/* ---------- hero ---------- */
.hero{position:relative;height:100svh;min-height:40rem;overflow:hidden;background:var(--bg)}
.hero .stage3d{position:absolute;inset:0}
.stage3d canvas{opacity:0;transition:opacity 1.2s var(--ease)}.stage3d.ready canvas{opacity:1}
.hero .stage3d::before{content:"";position:absolute;left:-40%;right:-40%;top:38%;bottom:-30%;background:repeating-linear-gradient(90deg,rgba(242,242,242,.07) 0 1px,transparent 1px 2.6rem),repeating-linear-gradient(0deg,rgba(242,242,242,.07) 0 1px,transparent 1px 2.6rem);transform:perspective(42rem) rotateX(62deg);transform-origin:50% 0;-webkit-mask-image:radial-gradient(50% 60% at 50% 30%,#000,transparent);mask-image:radial-gradient(50% 60% at 50% 30%,#000,transparent)}
.hero .stage3d::after{content:"";position:absolute;left:30%;right:30%;top:58%;height:22%;background:radial-gradient(closest-side,rgba(227,74,204,.32),rgba(153,87,207,.12) 55%,transparent);filter:blur(1.5rem)}
.stage3d.ready::before,.stage3d.ready::after{opacity:0;transition:opacity 1.2s}
.hero .veil{position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 46% at 50% 40%,rgba(26,35,45,.86),rgba(26,35,45,.35) 62%,rgba(26,35,45,0) 100%),linear-gradient(180deg,rgba(26,35,45,.65),rgba(26,35,45,0) 30%,rgba(26,35,45,0) 70%,rgba(26,35,45,.85))}
.hero .center{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.hero .content{display:flex;flex-direction:column;align-items:center;gap:clamp(1.25rem,3vw,2rem);text-align:center;margin-top:-6vh;animation:rise .9s var(--ease) .2s both}
.hero .logo{width:min(70vw,34rem);height:auto}
.hero .tagline{font-size:clamp(var(--fs-16),2vw,var(--fs-22));letter-spacing:.01em;opacity:.7}
.hero .ctas{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center;margin-top:.5rem;pointer-events:auto}
.hud{position:absolute;left:0;right:0;bottom:0;pointer-events:none}
.hud .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:1rem;padding-bottom:1.75rem;font-size:var(--fs-12);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3)}
.hud .live{white-space:nowrap}.hud .live b{font-weight:400;color:var(--fg);font-variant-numeric:tabular-nums}
.hud .cue{display:flex;flex-direction:column;align-items:center;gap:.6rem}
.hud .cue i{display:block;width:1px;height:2.4rem;background:linear-gradient(var(--fg-3),transparent);animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.legend{justify-self:end;display:flex;align-items:center;gap:.7rem}
.legend .bar{width:7rem;height:4px;border-radius:4px;background:linear-gradient(90deg,#26304d,#453894,#6940ba,#9957cf,#c44fd9,#e34acc,#eb459e,#f23d6b,#fc4238)}
.hint{position:absolute;left:50%;top:69%;transform:translateX(-50%);font-size:var(--fs-12);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);display:flex;gap:.6rem;align-items:center;transition:opacity .6s;pointer-events:none}
.hint i{width:.55rem;height:.55rem;border-radius:50%;background:var(--hot);box-shadow:0 0 0 6px rgba(235,69,158,.15);animation:ping 2s ease-out infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(235,69,158,.45)}100%{box-shadow:0 0 0 14px rgba(235,69,158,0)}}
@media (max-width:700px){.hud .wrap{grid-template-columns:1fr;padding-bottom:max(1.5rem,calc(env(safe-area-inset-bottom) + .9rem))}.hud .live,.hud .cue{display:none}.legend{justify-self:center}.hint{top:auto;bottom:calc(max(1.5rem,calc(env(safe-area-inset-bottom) + .9rem)) + 2rem);font-size:.625rem;white-space:nowrap}}
@keyframes rise{0%{opacity:0;transform:translateY(10px)}}

/* ---------- statement + stats ---------- */
.statement .h-l{max-width:62rem}
.statement .lede{margin-top:2rem}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(3.5rem,7vw,6rem);border-top:1px solid var(--line)}
.stats>div{padding:1.75rem 1.5rem 0 0;border-right:1px solid var(--line);padding-left:1.5rem}
.stats>div:first-child{padding-left:0}.stats>div:last-child{border-right:0}
.stats b{display:block;font-weight:400;font-size:clamp(1.9rem,3vw,2.75rem);letter-spacing:-.03em;line-height:1;margin-bottom:1rem;white-space:nowrap}
.stats span{display:block;color:var(--fg-2);font-size:.9375rem;line-height:1.5;max-width:17rem}
@media (max-width:900px){.stats{grid-template-columns:1fr 1fr}.stats>div{border-right:0;padding-left:0;padding-bottom:1.75rem;border-bottom:1px solid var(--line)}}

/* ---------- thesis ---------- */
.thesis .big{font-size:clamp(2rem,4.6vw,4rem);line-height:1.08;letter-spacing:-.03em;max-width:60rem}
.triad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin-top:clamp(3rem,6vw,5rem)}
.triad>div{padding:1.6rem 1.6rem 1.8rem;border:1px solid var(--line);border-radius:1.1rem;background:linear-gradient(180deg,rgba(242,242,242,.035),rgba(242,242,242,0))}
.triad .k{display:flex;justify-content:space-between;align-items:center;margin-bottom:3.2rem;font-size:var(--fs-12);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3)}
.triad h3{font-size:var(--fs-28);letter-spacing:-.02em;margin-bottom:.7rem}
.triad p{color:var(--fg-2)}
.triad svg{width:2.6rem;height:2.6rem}
@media (max-width:900px){.triad{grid-template-columns:1fr}}

/* ---------- sticky 3D chapters (hand, stack) ---------- */
.chapters{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(2rem,5vw,5rem)}
.chapters .stick{position:sticky;top:0;height:100svh;display:flex;align-items:center}
.chapters .frame{position:relative;width:100%;height:min(78svh,46rem);border-radius:1.4rem;overflow:hidden;background:radial-gradient(70% 70% at 50% 55%,#212c38,#1a232d 70%);border:1px solid var(--line)}
.chapters .frame .stage3d{position:absolute;inset:0}
.chapters .steps-text{padding-block:30svh 40svh}
.chap{min-height:64svh;display:flex;flex-direction:column;justify-content:center;opacity:0;transform:translateY(1.2rem);transition:opacity .7s var(--ease),transform .9s var(--ease)}
.chap.on{opacity:1;transform:none}
.chap .num{display:flex;align-items:center;gap:.8rem;font-size:var(--fs-12);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3);margin-bottom:1.25rem}
.chap .num i{display:block;width:1.6rem;height:2px;background:var(--line-2);transition:width .6s var(--ease),background .6s}
.chap.on .num i{width:3rem;background:var(--hot)}
.chap h3{font-size:clamp(1.9rem,3.2vw,3rem);letter-spacing:-.03em;line-height:1.05;margin-bottom:1.1rem}
.chap p{color:var(--fg-2);max-width:29rem;font-size:1.0625rem}
.chap .roles{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.4rem}
.chip{display:inline-flex;align-items:center;gap:.45rem;font-size:.8125rem;padding:.36rem .7rem;border-radius:99px;border:1px solid var(--line-2);text-decoration:none;color:var(--fg-2);transition:border-color .2s,color .2s}
.chip:hover{border-color:var(--enact-red);color:var(--fg)}
.chip i{width:.42rem;height:.42rem;border-radius:50%;background:var(--c,#9957cf)}
.frame .label{position:absolute;left:1.2rem;top:1.1rem;font-size:var(--fs-12);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);display:flex;gap:.6rem;align-items:center;z-index:2}
.frame .label b{font-weight:400;color:var(--fg)}
.frame .note{position:absolute;left:1.2rem;bottom:1rem;font-size:.75rem;color:var(--fg-3);z-index:2;max-width:22rem}
.graph{position:absolute;right:1.1rem;bottom:1rem;width:min(44%,17rem);z-index:2;padding:.8rem .9rem .6rem;border-radius:.8rem;background:rgba(26,35,45,.66);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.graph .t{display:flex;justify-content:space-between;font-size:.625rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);margin-bottom:.35rem}
.graph svg{width:100%;height:4.6rem;overflow:visible}
@media (max-width:900px){
  .chapters{grid-template-columns:minmax(0,1fr);gap:0;--fh:min(46svh,34rem)}
  .chapters .steps-text,.chap{min-width:0}
  .chapters .stick{order:-1;height:auto;top:4.75rem;z-index:2;padding:.25rem 0 1.4rem;background:linear-gradient(var(--bg) 82%,rgba(26,35,45,0))}
  .chapters .frame{height:var(--fh)}
  .chapters .steps-text{padding-block:2svh 26svh}
  .chap{min-height:calc(100svh - var(--fh) - 6.5rem);justify-content:flex-start;padding-top:1.2rem}
  .chap h3{font-size:clamp(1.6rem,7vw,2.2rem)}
  .chap p{font-size:1rem}
  .graph{width:44%}
}
@media (max-width:900px){#stackChapters{--fh:min(52svh,32rem)}}
@media (max-width:900px) and (max-height:720px){.chapters{--fh:40svh}#stackChapters{--fh:48svh}.chap .roles{margin-top:1rem}.chap h3{margin-bottom:.6rem}}

/* ---------- light section: tasks ---------- */
.light{background:var(--enact-grey);color:var(--enact-black)}
.light .eyebrow{color:rgba(26,35,45,.5)}.light .eyebrow .n{color:var(--enact-black)}
.light .lede,.light .muted{color:rgba(26,35,45,.68)}
.light .tag{border-color:rgba(26,35,45,.25);color:rgba(26,35,45,.55)}
.tasks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(26,35,45,.12);border:1px solid rgba(26,35,45,.12);border-radius:1.2rem;overflow:hidden;margin-top:clamp(3rem,6vw,4.5rem)}
.task{background:var(--enact-grey);padding:1.8rem 1.8rem 2rem;min-height:17rem;display:flex;flex-direction:column;transition:background .4s var(--ease)}
.task:hover{background:#fff}
.task>svg{width:4.2rem;height:4.2rem;margin-bottom:auto;overflow:visible}
.task .i{font-size:var(--fs-12);letter-spacing:.18em;text-transform:uppercase;color:rgba(26,35,45,.45);margin:2.2rem 0 .7rem}
.task h3{font-size:var(--fs-22);letter-spacing:-.015em;margin-bottom:.45rem}
.task p{font-size:.9375rem;color:rgba(26,35,45,.66)}
.task .g{stroke:url(#tg)}
.task .draw{stroke-dasharray:var(--len,120);stroke-dashoffset:var(--len,120);transition:stroke-dashoffset 1.6s var(--ease)}
.task.seen .draw{stroke-dashoffset:0}
@media (max-width:900px){.tasks{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.tasks{grid-template-columns:1fr}.task{min-height:0}}

/* ---------- team ---------- */
.origin{font-size:clamp(var(--fs-22),3.4vw,3rem);line-height:1.2;letter-spacing:-.02em;max-width:52rem;margin:0}
.names{list-style:none;margin:clamp(2.5rem,5vw,4rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.names li{display:flex;align-items:baseline;gap:1.1rem;padding:1.15rem 0;border-bottom:1px solid var(--line);font-size:clamp(var(--fs-16),1.9vw,var(--fs-22));letter-spacing:-.01em}
.names li span{font-size:var(--fs-12);letter-spacing:.12em;color:var(--fg-3);font-variant-numeric:tabular-nums;width:1.6rem}
@media (max-width:760px){.names{grid-template-columns:1fr 1fr}}
@media (max-width:460px){.names{grid-template-columns:1fr}}
.orgs{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem}
.orgs span{font-size:.875rem;padding:.4rem .85rem;border-radius:99px;border:1px solid var(--line-2);color:var(--fg-2)}

/* ---------- join ---------- */
.values{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem;margin-top:clamp(2.5rem,5vw,4rem)}
.values>div{border-top:1px solid var(--line-2);padding-top:1.3rem}
.values .k{font-size:var(--fs-12);letter-spacing:.18em;color:var(--fg-3);margin-bottom:2rem}
.values h3{font-size:var(--fs-22);letter-spacing:-.015em;margin-bottom:.5rem}
.values p{color:var(--fg-2);font-size:.9375rem}
@media (max-width:900px){.values{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.values{grid-template-columns:1fr}}
.perks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:2.5rem}
.perks>div{padding:1.3rem 1.4rem;border-radius:1rem;background:var(--bg-3);border:1px solid var(--line)}
.perks b{display:block;font-weight:400;font-size:1.0625rem;margin-bottom:.3rem}
.perks span{color:var(--fg-2);font-size:.9375rem}
@media (max-width:760px){.perks{grid-template-columns:1fr}}
.board{margin-top:clamp(3rem,6vw,5rem);display:flex;flex-direction:column;gap:2.75rem}
.board-title{font-size:clamp(var(--fs-22),2.5vw,var(--fs-38));letter-spacing:-.01em;margin:0 0 .5rem}
.group-name{margin:0 0 .75rem;font-size:var(--fs-12);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3)}
.job-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.job{border-bottom:1px solid var(--line)}
.job a{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:1.25rem;padding:1.2rem 0;text-decoration:none;transition:padding .5s var(--ease)}
.job a:hover{padding-left:.6rem}
.job .title{font-size:clamp(var(--fs-16),2vw,var(--fs-22));letter-spacing:-.01em}
.job .meta{font-size:var(--fs-12);letter-spacing:.06em;color:var(--fg-3);white-space:nowrap}
.job .go{opacity:.4;transition:transform .2s,opacity .2s}
.job a:hover .go{transform:translateX(3px);opacity:.8}
@media (max-width:560px){.job a{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;row-gap:.2rem}.job .meta{grid-area:2/1}.job .go{grid-row:1;grid-column:2}}

/* ---------- page heads for team / join / brand ---------- */
.pagehead{padding-top:clamp(9rem,16vw,13rem);padding-bottom:clamp(3rem,6vw,5rem)}
.pagehead .lede{margin-top:1.75rem}

/* ---------- brand view ---------- */
.bgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem}
.card{border:1px solid var(--line);border-radius:1.2rem;padding:1.6rem;background:var(--bg-2)}
.card h3{font-size:var(--fs-22);margin-bottom:.4rem;letter-spacing:-.015em}
.card p{color:var(--fg-2);font-size:.9375rem}
.span-12{grid-column:span 12}.span-8{grid-column:span 8}.span-6{grid-column:span 6}.span-4{grid-column:span 4}
@media (max-width:900px){.span-8,.span-6,.span-4{grid-column:span 12}}
.logo-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;margin-top:1.2rem}
@media (max-width:560px){.logo-stage>div{padding:1rem}}
.logo-stage>div{border-radius:.9rem;display:grid;place-items:center;aspect-ratio:2.2/1;padding:2rem}
.logo-stage .d{background:var(--enact-black);border:1px solid var(--line)}.logo-stage .l{background:var(--enact-grey)}
.logo-stage img{width:72%}
.sw{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.75rem;margin-top:1.2rem}
.sw div{border-radius:.8rem;overflow:hidden;border:1px solid var(--line)}
.sw i{display:block;aspect-ratio:1.2/1}
.sw span{display:block;padding:.6rem .7rem;font-size:.8125rem;color:var(--fg-2)}
.sw span b{display:block;font-weight:400;color:var(--fg)}
.ramp{height:3.2rem;border-radius:.8rem;margin-top:1.2rem;background:var(--enact-gradient)}
.ramp-steps{display:flex;height:2.2rem;border-radius:.6rem;overflow:hidden;margin-top:.5rem}
.ramp-steps i{flex:1}
.scale{margin-top:1rem;container-type:inline-size}
.scale div{display:flex;align-items:baseline;gap:1.2rem;border-bottom:1px solid var(--line);padding:.55rem 0;overflow:hidden;white-space:nowrap}
.scale span{width:4.5rem;flex:none;font-size:.75rem;color:var(--fg-3);letter-spacing:.06em}
.kv{display:grid;grid-template-columns:auto 1fr;gap:.5rem 1.2rem;margin-top:1rem;font-size:.875rem}
.kv dt{color:var(--fg-3)}.kv dd{margin:0}
.dash-demo{display:flex;align-items:center;gap:1.4rem;margin-top:1.3rem}
.dash-demo svg{width:9rem;height:auto}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--line);padding-block:clamp(4rem,8vw,6rem) 1.5rem}
.foot .top{display:grid;grid-template-columns:1.4fr repeat(3,minmax(0,1fr));gap:2rem}
/* height follows the logo's own ratio (the 231x47 attributes letterboxed it by 4px). The negative margin takes up the 4 units of padding
   in its viewBox plus the dash's first 7 units, which fade into the background, so where the dash becomes visible lines up with the tagline */
.foot .logo{width:min(100%,15rem);height:auto;margin-left:calc(min(100%,15rem) * -11 / 461.75)}
.foot .fh{font-size:var(--fs-12);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3);margin-bottom:1rem}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.foot ul a{text-decoration:none;opacity:.8}.foot ul a:hover{opacity:1}
.foot .bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-top:clamp(3rem,7vw,5rem);padding-top:1rem;border-top:1px solid var(--line);font-size:var(--fs-12);color:var(--fg-3)}
.foot .bottom a{text-decoration:none}
@media (max-width:800px){.foot .top{grid-template-columns:1fr 1fr}.foot .top>div:first-child{grid-column:1/-1}}

/* ---------- concept badge ---------- */
.badge{display:inline-flex;align-items:center;gap:.5rem;height:2.4rem;padding:0 .85rem 0 .7rem;border-radius:99px;border:1px dashed var(--line-2);font-size:.75rem;letter-spacing:.02em;text-decoration:none;color:var(--fg-2);transition:color .2s,border-color .2s;white-space:nowrap}
.badge:hover{color:var(--fg);border-color:rgba(242,242,242,.4)}
.badge i{width:1.1rem;height:2px;background:var(--hot);border-radius:2px}
@media (max-width:1100px){.badge span.long{display:none}}
@media (max-width:700px){.triad .k{margin-bottom:1.6rem}}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(14px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
.nojs .rv{opacity:1;transform:none}
.fallback-3d{position:absolute;inset:0;display:grid;place-items:center;color:var(--fg-3);font-size:.875rem}
@media (prefers-reduced-motion:reduce){
  .grad,.hud .cue i,.hint i,.hero .logo .dash,.hero .logo .lt{animation:none}
  .rv{opacity:1;transform:none;transition:none}
  .btn,.btn .arr,.job a{transition:none}
}

/* ---------- v2: smooth scroll, wipe, word reveals, hero logo, callout, labels ---------- */
html.lenis,html.lenis body{height:auto}.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-smooth iframe{pointer-events:none}
.wipe{position:fixed;inset:0;z-index:90;pointer-events:none;background:var(--enact-gradient);transform:scaleX(0);transform-origin:100% 50%}
.wipe.in{transform:scaleX(1);transform-origin:0 50%;transition:transform .52s cubic-bezier(.7,0,.3,1)}
.wipe.out{transform:scaleX(0);transform-origin:100% 50%;transition:transform .7s cubic-bezier(.7,0,.3,1) .05s}
[data-split].rv{opacity:1;transform:none}
[data-split] .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
[data-split] .w>i{display:inline-block;font-style:normal;transform:translateY(108%) rotate(4deg);transform-origin:0 100%;transition:transform 1.2s var(--ease) calc(var(--i) * 45ms)}
[data-split].in .w>i,.view [data-split]:not(.rv) .w>i{transform:none}
.hero .logo{overflow:visible}
.hero .logo .dash{transform-box:fill-box;transform-origin:100% 50%;animation:dash-in 1.5s var(--ease) .35s both}
.hero .logo .lt{animation:rise 1s var(--ease) both;animation-delay:calc(.15s + var(--i) * 55ms)}
@keyframes dash-in{0%{transform:translateX(42%) scaleX(.05);opacity:0}35%{opacity:1}100%{transform:none}}
.callout{position:absolute;left:0;top:0;pointer-events:none;opacity:0;transition:opacity .35s;z-index:3;will-change:transform}
.callout .ln{position:absolute;left:0;top:0;width:4.2rem;height:1px;background:linear-gradient(90deg,rgba(242,242,242,.0),rgba(242,242,242,.55));transform:rotate(-32deg);transform-origin:0 0}
.callout .tx{position:absolute;left:3.6rem;top:-3.1rem;white-space:nowrap;font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg);padding:.4rem .6rem;border:1px solid var(--line-2);border-radius:99px;background:rgba(26,35,45,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-variant-numeric:tabular-nums}
.callout .tx::before{content:"";display:inline-block;width:.42rem;height:.42rem;border-radius:50%;background:var(--hot);margin-right:.5rem;vertical-align:.05rem}
.hud .live .mode{color:var(--fg)}
.parts{position:absolute;inset:0;pointer-events:none;z-index:2;opacity:0;transition:opacity .6s var(--ease)}
.part{position:absolute;left:0;top:0;white-space:nowrap;font-size:.625rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-2);padding-left:2.9rem;margin-top:-.45rem;will-change:transform}
.part::before{content:"";position:absolute;left:0;top:.45rem;width:2.4rem;height:1px;background:rgba(242,242,242,.4)}
.part::after{content:"";position:absolute;left:-.17rem;top:.28rem;width:.34rem;height:.34rem;border-radius:50%;background:var(--enact-beige)}
.fbars{display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem;margin-top:.55rem;padding-top:.5rem;border-top:1px solid var(--line)}
.fbars span{display:flex;flex-direction:column;align-items:center;gap:.25rem;font-size:.5625rem;letter-spacing:.12em;color:var(--fg-3)}
.fbars i{display:block;width:100%;height:1.4rem;border-radius:2px;background:#9957cf;transform:scaleY(.04);transform-origin:50% 100%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.fbars b{display:block;width:100%;height:1.4rem;position:relative;background:rgba(242,242,242,.05);border-radius:2px;overflow:hidden;font-weight:400}
.fbars b i{position:absolute;inset:0}
@media (max-width:900px){.parts{display:none}}
@media (max-width:560px){.hdr .wrap{gap:1rem}.hdr .end{gap:.5rem}.badge{height:2.3rem;padding:0 .7rem;font-size:.6875rem}.badge i{display:none}.menu-btn{padding:0 .85rem}.fbars{display:none}.graph{width:44%;padding:.6rem .7rem .4rem}.graph svg{height:3.2rem}}

/* ---------- the stack as one signal path ---------- */
.fine{font-size:.8125rem;margin-top:1rem;max-width:40rem}
.chap .io{display:block;margin:-.2rem 0 1rem;line-height:1.6;font-size:var(--fs-12);letter-spacing:.14em;text-transform:uppercase;color:var(--fg)}
.chap .io span[aria-hidden]{color:transparent;background:var(--hot);-webkit-background-clip:text;background-clip:text;font-size:1rem;letter-spacing:0;margin:0 .5rem}
#stackChapters .frame .label{right:1.2rem;justify-content:space-between;white-space:nowrap;overflow:hidden}
.frame .label .ph{overflow:hidden;text-overflow:ellipsis;color:var(--fg-3)}
.stage3d.flow canvas{-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.flowmap{position:absolute;left:1.2rem;right:1.2rem;bottom:1.1rem;display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;z-index:2;padding-top:.8rem}
.flowmap button{all:unset;cursor:pointer;font-size:.625rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-3);transition:color .4s var(--ease);white-space:nowrap;padding:.25rem 0;border-radius:4px}
.flowmap button:hover{color:var(--fg-2)}
.flowmap button:focus-visible{outline:2px solid var(--enact-red);outline-offset:3px}
.flowmap button b{font-weight:400;margin-right:.45rem;color:inherit;opacity:.7}
.flowmap button.on{color:var(--fg)}
.flowmap .track{position:absolute;left:0;right:0;top:0;height:2px;border-radius:2px;background:var(--line);pointer-events:none}
.flowmap .fill{position:absolute;inset:0;border-radius:2px;background:var(--hot);transform:scaleX(.25);transform-origin:0 50%}
.readout{position:absolute;left:1.2rem;right:1.2rem;top:2.6rem;z-index:2;font-size:.625rem;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.chip.hl{border-color:var(--c);color:var(--fg);background:rgba(242,242,242,.06)}
.chap .chip{opacity:0;transform:translateY(.4rem);transition:opacity .6s var(--ease),transform .7s var(--ease),border-color .2s,color .2s,background .2s}
.chap.on .chip{opacity:1;transform:none;transition-delay:calc(.25s + var(--k,0) * 70ms),calc(.25s + var(--k,0) * 70ms),0s,0s,0s}
.chap .io span[aria-hidden]{display:inline-block;transition:transform .8s var(--ease) .2s}
.chap:not(.on) .io span[aria-hidden]{transform:translateX(-.4rem)}
@media (max-width:560px){.flowmap button{font-size:.5625rem;letter-spacing:.1em}.flowmap button b{margin-right:.3rem}#stackChapters .frame .label .ph{display:none}.readout{display:none}}

/* ---------- micro details ---------- */
.hdr{transition:background .4s var(--ease),border-color .4s var(--ease),transform .6s var(--ease)}
.hdr.hide{transform:translateY(-100%)}
.hdr .prog{position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--hot);transform:scaleX(0);transform-origin:0 50%;opacity:0;transition:opacity .4s}
.hdr.solid .prog{opacity:.9}
.btn .arr{overflow:hidden}
.btn:hover .arr{transform:none}
.btn:hover .arr svg{animation:arr-swap .65s var(--ease)}
@keyframes arr-swap{0%{transform:none}40%{transform:translateX(170%)}41%{transform:translateX(-170%)}100%{transform:none}}
.job a{position:relative}
.chip{transition:border-color .2s,color .2s,background .2s}
.chip:hover i{transform:scale(1.4)}.chip i{transition:transform .3s var(--ease)}
@media (prefers-reduced-motion:reduce){.hdr.hide{transform:none}.btn:hover .arr svg{animation:none}}
@media (max-width:900px){.chapters .stick{transition:top .6s var(--ease)}body.hdr-off .chapters .stick{top:.6rem}}
@media (max-aspect-ratio:4/5){.hero .content{margin-top:-24svh}.hero .veil{background:radial-gradient(80% 34% at 50% 30%,rgba(26,35,45,.88),rgba(26,35,45,.3) 70%,rgba(26,35,45,0) 100%),linear-gradient(180deg,rgba(26,35,45,.6),rgba(26,35,45,0) 26%,rgba(26,35,45,0) 76%,rgba(26,35,45,.85))}}

/* ---------- responsive and detail pass ---------- */
h1,h2,h3,.big,.origin,.lede{text-wrap:balance}
p{text-wrap:pretty}
html{-webkit-tap-highlight-color:transparent}
.eyebrow{flex-wrap:wrap;row-gap:.55rem}
@media (max-width:560px){
  .stats{grid-template-columns:1fr}
  .stats>div{padding:1.25rem 0 1.35rem}
  .stats b{margin:0 0 .45rem;font-size:clamp(1.75rem,8vw,2.2rem)}
  .stats span{font-size:.9375rem;max-width:22rem}
  .eyebrow{gap:.7rem;letter-spacing:.14em}.eyebrow .dash{width:1.6rem}
  .chap .roles{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gut) * -1);padding:0 var(--gut) .2rem;-webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--gut),#000 calc(100% - var(--gut)),transparent);mask-image:linear-gradient(90deg,transparent,#000 var(--gut),#000 calc(100% - var(--gut)),transparent)}
  .chap .roles::-webkit-scrollbar{display:none}
  .chap .roles .chip{flex:none}
  .tasks{gap:1px}
  .task{display:grid;grid-template-columns:3rem minmax(0,1fr);column-gap:1.1rem;align-items:start;padding:1.35rem 1.2rem 1.45rem;min-height:0}
  .task>svg{grid-row:1/4;width:3rem;height:3rem;margin:0}
  .task .i{margin:.1rem 0 .35rem}
  .names li{padding:.95rem 0}
  .values{gap:0}.values>div{padding:1.15rem 0 1.4rem}.values .k{margin-bottom:1rem}
  .triad>div{padding:1.3rem 1.3rem 1.5rem}.triad .k{margin-bottom:1.5rem}
  .foot .top{grid-template-columns:1fr 1fr;row-gap:2.2rem}
  .foot .top>div:nth-child(3){grid-column:1/-1;order:3}
  .foot .top>div:nth-child(4){order:2}
  .foot .bottom{flex-direction:column;gap:.6rem}
  .graph svg{height:2.6rem}.graph{padding:.55rem .65rem .35rem}
}
/* touch: generous targets and a press state */
@media (pointer:coarse){
  .chip{min-height:2.6rem;padding:.5rem .9rem}
  .foot ul{gap:0}.foot ul a{display:inline-block;padding:.55rem 0}
  .foot .bottom a{display:inline-block;padding:.6rem 0}
  .link{padding:.6rem 0 .35rem}
  .mark{padding:.8rem 0}
  .flowmap button{padding:.75rem 0 .5rem}
  .btn:active,.chip:active,.badge:active,.menu-btn:active,.job a:active{transform:scale(.97);transition:transform .15s}
  .job a:hover{padding-left:0}
}
/* safe areas for landscape phones and notches */
.wrap{padding-left:max(var(--gut),env(safe-area-inset-left));padding-right:max(var(--gut),env(safe-area-inset-right))}
.hud .wrap{padding-bottom:max(1.75rem,calc(env(safe-area-inset-bottom) + 1rem))}
/* header switches to light over the light section */
.hdr.on-light{color:var(--enact-black)}
.hdr.on-light.solid{background:rgba(242,242,242,.82);border-color:rgba(26,35,45,.1)}
.mark{position:relative}.mark .on-lt{position:absolute;left:0;top:50%;transform:translateY(-50%);opacity:0}.mark img{transition:opacity .4s}
.hdr.on-light .mark .on-lt{opacity:1}.hdr.on-light .mark .on-dark{opacity:0}
.hdr.on-light .btn{border-color:rgba(26,35,45,.2)}.hdr.on-light .count{background:rgba(26,35,45,.08)}
.hdr.on-light .badge{border-color:rgba(26,35,45,.25);color:rgba(26,35,45,.7)}
.hdr.on-light .menu-btn{border-color:rgba(26,35,45,.25)}
.hdr .mark img,.hdr .btn,.hdr .badge,.hdr .menu-btn{transition:filter .4s,border-color .4s,color .4s,background .4s}
@media (prefers-reduced-motion:reduce){[data-split] .w>i{transform:none!important;transition:none!important}}
@media (max-aspect-ratio:4/5) and (min-width:701px){.hint{top:auto;bottom:7.6rem}} /* tablets upright: the hint sits above the scroll cue, not on it */
@media (max-width:700px) and (max-height:720px){.hint{display:none}}

/* grip graph: label outside the stretched svg so it never distorts */
.graph .plot{position:relative}
.graph .lim{position:absolute;right:0;top:calc(20% - 1.15em);font-size:.5625rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(242,242,242,.45)}
/* sticky frame covers the full width, so scrolled role rows never show in the gutters */
@media (max-width:900px){.chapters .stick{margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut)}}

/* ---------- micro interactions ---------- */
html{scrollbar-color:rgba(242,242,242,.22) transparent;scrollbar-width:thin}
.link{border-bottom:0;background:linear-gradient(var(--line-2),var(--line-2)) 0 100%/100% 1px no-repeat,linear-gradient(90deg,#fc4238,#e34acc,#9957cf) 0 100%/0 1px no-repeat;transition:background-size .6s var(--ease)}
.link:hover{background-size:100% 1px,100% 1px}
.link svg{transition:transform .4s var(--ease)}.link:hover svg{transform:translateX(3px)}
/* stats and values: hairlines draw in from the left as they reveal */
.stats{border-top:0;position:relative}
.stats::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.4s var(--ease) .1s}
.stats.in::before{transform:none}
.values>div{border-top:0;position:relative}
.values>div::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,var(--line-2),var(--line-2)) 0 0/100% 1px no-repeat;transform:scaleX(0);transform-origin:0 50%;transition:transform 1.2s var(--ease) .15s}
.values>div.in::before{transform:none}
/* cards: pointer light */
.triad>div,.perks>div{position:relative;overflow:hidden;isolation:isolate}
.triad>div::after,.perks>div::after{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .5s;background:radial-gradient(22rem circle at var(--mx,50%) var(--my,50%),rgba(153,87,207,.14),transparent 60%)}
.triad>div:hover::after,.perks>div:hover::after{opacity:1}
.triad>div{transition:border-color .4s}.triad>div:hover{border-color:var(--line-2)}
.triad svg{transition:transform .6s var(--ease)}.triad>div:hover svg{transform:scale(1.08) rotate(-4deg)}
.task{position:relative;isolation:isolate}
.task::after{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .5s;background:radial-gradient(18rem circle at var(--mx,50%) var(--my,50%),rgba(235,69,158,.07),transparent 60%)}
.task:hover::after{opacity:1}
/* task rigs: the icon performs its task while the card is hovered; the readout traces its force and names the phase */
.task .ic .bp{opacity:0;transition:opacity .9s var(--ease)}
.task.live .ic .bp{opacity:1}
.task .tele{position:absolute;top:2.35rem;right:1.8rem;width:7.5rem;opacity:0;transform:translateY(.3rem);transition:opacity .5s var(--ease),transform .8s var(--ease);pointer-events:none}
.task.live .tele{opacity:1;transform:none;transition-duration:.7s,.9s}
.tele svg{display:block;width:7.5rem;height:2.25rem;overflow:visible;-webkit-mask-image:linear-gradient(90deg,transparent,#000 38%);mask-image:linear-gradient(90deg,transparent,#000 38%)}
.tele .base{stroke:rgba(26,35,45,.16);stroke-width:1;fill:none}
.tele .lim{stroke:rgba(26,35,45,.34);stroke-width:1;stroke-dasharray:1.5 2.5;fill:none;opacity:0}
.tele.has-lim .lim{opacity:1}
.tele .tr{fill:none;stroke:url(#tgh);stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.tele .hd{fill:#fc4238}
.task .tele p{display:flex;justify-content:space-between;gap:.75rem;margin-top:.55rem;font-size:.5625rem;line-height:1;letter-spacing:.16em;text-transform:uppercase;color:rgba(26,35,45,.42);white-space:nowrap}
.tele .ph{color:var(--enact-black);font-variant-numeric:tabular-nums}
.tele .ph.ok{background:var(--hot);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:560px){.task .tele{display:none}}
@media (prefers-reduced-motion:reduce){.task .tele{display:none}.task .ic .bp{opacity:0!important}}
.task h3{transition:transform 1s var(--ease)}.task:hover h3{transform:translateX(2px)}
/* team names */
/* team: each name has its own dot-matrix robot; on hover the row fills and the robot powers up */
.names li{position:relative;isolation:isolate}
.names li b{font-weight:400;transition:transform .8s var(--ease)}
.names li::before{content:"";position:absolute;z-index:-1;top:.38rem;bottom:.38rem;left:-.9rem;right:.9rem;border-radius:1rem;border:1px solid transparent;
  background:radial-gradient(14rem 5rem at 100% 50%,rgba(235,69,158,.09),transparent 70%) padding-box,linear-gradient(#1e2832,#1e2832) padding-box,linear-gradient(90deg,rgba(252,66,56,.38),rgba(227,74,204,.22) 40%,rgba(242,242,242,.08)) border-box;
  opacity:0;transform:scale(.985);transition:opacity .55s var(--ease),transform .8s var(--ease)}
.names li span{transition:color .4s}
.names li.on::before{opacity:1;transform:none}
.names li.on span{color:var(--fg)}
.names li.on b{transform:translateX(3px)}
.bot{flex:none;align-self:center;margin-block:-.6rem;margin-left:auto;margin-right:1.8rem;width:2.7rem;height:2.7rem;overflow:visible;transition:filter .6s var(--ease)}
.bot .grid{opacity:.05;transition:opacity .6s var(--ease)}
.bot .px{opacity:0;transition:opacity .28s ease calc((14 - var(--d)) * 14ms)}
.bot .fB{visibility:hidden}
.bot .ey,.bot .lt{fill-opacity:1}.bot .sc{fill-opacity:0}
.names li.on .bot{filter:drop-shadow(0 0 5px rgba(235,69,158,.5))}
.names li.on .bot .grid{opacity:.12}
.names li.on .bot .px{opacity:1;transition:opacity .22s ease calc(var(--d) * 34ms)}
/* idle: every robot has its own small routine once it is on */
.names li.on .bot .ey{animation:bot-blink 3.6s steps(1) .9s infinite}
.names li.on .bot .lt{animation:bot-pulse 1.6s ease-in-out .6s infinite}
.names li.on .bot .sc{animation:bot-scan 1.8s linear calc(.5s + var(--o) * 110ms) infinite}
.names li.on .bot .fA{animation:bot-a 1.1s steps(1) .7s infinite}
.names li.on .bot .fB{animation:bot-b 1.1s steps(1) .7s infinite}
.names li.on .b-cyclops .fA,.names li.on .b-cyclops .fB{animation-duration:2.4s}
.names li.on .b-ears .fA,.names li.on .b-ears .fB{animation-duration:1.8s}
.names li.on .b-hand .fA,.names li.on .b-hand .fB{animation-duration:.7s}
.names li.on .b-drone .fA{animation-duration:.24s}
.names li.on .b-drone .rig{animation:bot-bob 1.4s steps(1) .7s infinite}
.names li.on .b-radar .sc{animation-duration:1.3s}
.b-tread .sc{fill:#c4b5a9}
@keyframes bot-blink{0%,88%,100%{fill-opacity:1}90%,93%{fill-opacity:0}}
@keyframes bot-pulse{0%,100%{fill-opacity:.15}50%{fill-opacity:1}}
@keyframes bot-scan{0%{fill-opacity:1}22%,100%{fill-opacity:0}}
@keyframes bot-a{0%{visibility:visible}50%{visibility:hidden}}
@keyframes bot-b{0%{visibility:hidden}50%{visibility:visible}}
@keyframes bot-bob{0%{transform:none}50%{transform:translateY(1px)}}
@media (max-width:560px){.bot{margin-right:1.2rem;width:2.3rem;height:2.3rem}.names li::before{left:-.6rem;right:.4rem}}
@media (prefers-reduced-motion:reduce){.names li.on .bot *{animation:none!important}.bot .px,.names li.on .bot .px{transition:none}}
/* footer */
.foot .wrap{position:relative}
.totop{position:absolute;right:max(var(--gut),env(safe-area-inset-right));top:calc(clamp(4rem,8vw,6rem) * -1 - 1.5rem);display:grid;place-items:center;width:3rem;height:3rem;border-radius:50%;border:1px solid var(--line-2);background:var(--bg);color:var(--fg);transition:border-color .3s,transform .5s var(--ease)}
.totop svg{width:1rem;height:1rem;transition:transform .5s var(--ease)}
.totop:hover{border-color:rgba(242,242,242,.45)}.totop:hover svg{transform:translateY(-3px)}
.foot ul a{background:linear-gradient(var(--fg),var(--fg)) 0 100%/0 1px no-repeat;transition:opacity .2s,background-size .5s var(--ease)}
.foot ul a:hover{background-size:100% 1px}
.foot .logo{transition:filter .6s}.foot .rv.in .logo{animation:rise 1s var(--ease) both}
/* focus states that look designed */
.btn:focus-visible,.chip:focus-visible,.badge:focus-visible,.menu-btn:focus-visible,.totop:focus-visible,.sheet .close:focus-visible{outline:2px solid var(--enact-red);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.stats::before,.values>div::before{transform:none;transition:none}}

.hero .center{transform:translate3d(0,calc(var(--hx,0) * -9vh),0);opacity:calc(1 - var(--hx,0) * 1.5);will-change:transform,opacity}
.hero .hud,.hero .hint{opacity:calc(1 - var(--hx,0) * 2.2)}

/* ---------- professional details ---------- */
/* job rows: the posting's own first line opens under the title on hover */
.job .new{display:inline-block;margin-left:.7rem;vertical-align:.25em;font-size:.5625rem;letter-spacing:.16em;text-transform:uppercase;padding:.2rem .45rem;border-radius:99px;color:#fff;background:var(--hot)}
.job .new[hidden]{display:none}
/* the sixth task card is a way in */
a.task{text-decoration:none;color:inherit}
.task.more .u{display:inline-block;margin-top:.6rem;color:var(--enact-black);background:linear-gradient(90deg,#fc4238,#e34acc,#9957cf) 0 100%/100% 1px no-repeat;padding-bottom:2px}
.task.more:hover .u{background-size:100% 1.5px}
/* toast */
.toast{position:fixed;left:50%;bottom:max(1.4rem,calc(env(safe-area-inset-bottom) + .8rem));z-index:95;display:flex;align-items:center;gap:.8rem;padding:.7rem .9rem .7rem .8rem;border-radius:99px;background:rgba(242,242,242,.96);color:var(--enact-black);font-size:.875rem;box-shadow:0 12px 40px rgba(0,0,0,.35);transform:translate(-50%,140%);opacity:0;transition:transform .7s var(--ease),opacity .4s;pointer-events:none;white-space:nowrap}
.toast.on{transform:translate(-50%,0);opacity:1;pointer-events:auto}
.toast i{width:.5rem;height:.5rem;border-radius:50%;background:var(--hot)}
.toast a{color:inherit;text-decoration:none;padding-left:.8rem;border-left:1px solid rgba(26,35,45,.18);opacity:.7}.toast a:hover{opacity:1}
/* footer: Zürich time and the motion switch */
.foot .bottom{align-items:center}
.ft-meta{display:inline-flex;align-items:center;gap:1.4rem}
.clk b{font-weight:400;color:var(--fg-2);font-variant-numeric:tabular-nums;margin-left:.2rem}
.clk b i{font-style:normal;animation:colon 2s steps(1) infinite}
@keyframes colon{50%{opacity:.25}}
.motion{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:.45rem;color:var(--fg-3);font-size:var(--fs-12);padding:.35rem 0}
.motion b{font-weight:400;color:var(--fg-2)}
.motion i{position:relative;width:1.7rem;height:1rem;border-radius:99px;border:1px solid var(--line-2);transition:border-color .3s}
.motion i::after{content:"";position:absolute;top:2px;left:2px;width:calc(1rem - 6px);height:calc(1rem - 6px);border-radius:50%;background:var(--hot);transition:transform .5s var(--ease),background .3s}
.motion[aria-pressed=false] i::after{transform:none;background:rgba(242,242,242,.4)}
.motion[aria-pressed=true] i::after{transform:translateX(.7rem)}
.motion:hover{color:var(--fg-2)}.motion:focus-visible{outline:2px solid var(--enact-red);outline-offset:3px;border-radius:4px}
/* cursor tag over the field */
.ctag{position:absolute;left:0;top:0;z-index:3;display:flex;align-items:center;gap:.55rem;padding:.42rem .7rem .42rem .5rem;border-radius:99px;background:rgba(26,35,45,.6);border:1px solid var(--line-2);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--fg);pointer-events:none;opacity:0;transition:opacity .35s;will-change:transform;white-space:nowrap}
.ctag.on{opacity:1}
.ctag i{position:relative;width:.85rem;height:.85rem;border-radius:50%;background:conic-gradient(#fc4238 calc(var(--p,0) * 1turn),rgba(242,242,242,.18) 0)}
.ctag i::after{content:"";position:absolute;inset:2px;border-radius:50%;background:#1f2833}
.hint.fine{transition:opacity .6s}
.gl-live .hint.fine{opacity:0!important}
/* the logo's dash charges while the 3D prepares, then settles */
.gl-wait .hero .logo .dash{animation:dash-in 1.5s var(--ease) .35s both,dash-charge 1.6s ease-in-out 1.9s infinite}
.gl-live .hero .logo .dash{animation:dash-in 1.5s var(--ease) .35s both,dash-settle 1.1s var(--ease) both}
@keyframes dash-charge{0%,100%{opacity:1;transform:scaleX(1)}50%{opacity:.55;transform:scaleX(.82)}}
@keyframes dash-settle{0%{opacity:.7;transform:scaleX(.9)}40%{opacity:1;filter:brightness(1.6)}100%{opacity:1;transform:none;filter:none}}
@media (max-width:560px){.ft-meta{gap:1rem}.toast{font-size:.8125rem}}
/* print: the content, not the effects */
@media print{
  .stage3d,.hud,.hint,.callout,.ctag,.wipe,.toast,.totop,.sheet,.hdr,.badge,.flowmap,.readout,.graph,.parts{display:none!important}
  body{background:#fff;color:#111}.view:not(.active){display:none}.hero{height:auto;min-height:0;padding:2rem 0}.hero .center{position:static;transform:none;opacity:1}
  .grad{color:#111!important;background:none!important;-webkit-text-fill-color:#111}.chapters{display:block}.chapters .stick{display:none}.chap{opacity:1!important;transform:none!important;min-height:0;padding:1rem 0}
  .rv,[data-split] .w>i{opacity:1!important;transform:none!important}.job a::after{content:" " attr(href);font-size:.7rem;color:#555;grid-column:1/-1}
  .light{background:#fff}.sec{padding-block:2rem}
}
html.calm .hero .logo .dash{animation:none!important}
@media (max-width:560px){.foot .bottom{align-items:flex-start}}

/* ---------- open roles, read on the site ---------- */
.rp{position:fixed;inset:0;z-index:92}
.rp[hidden]{display:none}
html.rp-lock{overflow:hidden}
.rp-scrim{position:absolute;inset:0;background:rgba(12,17,23,.58);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .6s var(--ease)}
.rp.open .rp-scrim{opacity:1}
.rp-sheet{position:absolute;top:0;right:0;bottom:0;width:min(46rem,100%);display:flex;flex-direction:column;background:var(--bg);border-left:1px solid var(--line);box-shadow:-40px 0 120px rgba(0,0,0,.4);transform:translateX(104%);transition:transform .85s var(--ease);outline:none}
.rp-sheet::before{content:"";position:absolute;left:-1px;top:0;bottom:0;width:1px;background:linear-gradient(180deg,#fc4238,#e34acc 30%,#9957cf 60%,rgba(153,87,207,0));opacity:.8}
.rp.open .rp-sheet{transform:none}
.rp-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem clamp(1.25rem,4vw,2.5rem);border-bottom:1px solid var(--line)}
.rp-count{font-size:var(--fs-12);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-3);font-variant-numeric:tabular-nums}
.rp-count b{font-weight:400;color:var(--fg)}
.rp-nav{display:flex;gap:.45rem}
.rp-nav button{all:unset;box-sizing:border-box;cursor:pointer;display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;border:1px solid var(--line-2);color:var(--fg);transition:border-color .25s,background .25s}
.rp-nav button:hover{border-color:rgba(242,242,242,.45);background:rgba(242,242,242,.04)}
.rp-nav button:focus-visible{outline:2px solid #e34acc;outline-offset:2px}
.rp-nav svg{width:.95rem;height:.95rem}
.rp-prev svg{transform:scaleX(-1)}
.rp-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:clamp(1.8rem,4vw,3rem) clamp(1.25rem,4vw,2.5rem) 2.5rem;transition:opacity .26s var(--ease),transform .26s var(--ease)}
.rp-sheet.swap .rp-body{opacity:0;transform:translateY(.4rem)}
.rp.open .rp-body>*{animation:rp-in .9s var(--ease) both;animation-delay:calc(.2s + var(--k,0) * 55ms)}
@keyframes rp-in{from{opacity:0;transform:translateY(.8rem)}}
.rp-kick{display:flex;align-items:center;gap:.75rem;font-size:var(--fs-12);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-3)}
.rp-kick i{display:block;width:1.6rem;height:2px;background:var(--hot);flex:none}
.rp-title{font-size:clamp(2rem,4.2vw,3.1rem);line-height:1.04;letter-spacing:-.03em;margin:1rem 0 1.6rem;text-wrap:balance}
.rp-title .new{display:inline-block;margin-left:.6rem;vertical-align:.55em;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;padding:.25rem .5rem;border-radius:99px;color:#fff;background:var(--hot)}
.rp-facts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:.9rem;overflow:hidden}
.rp-facts li{background:var(--bg);padding:.85rem 1rem;display:flex;flex-direction:column;gap:.35rem;min-width:0}
.rp-facts span{font-size:.625rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-3)}
.rp-facts b{font-weight:400;font-size:.9375rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-lede{font-size:clamp(1.125rem,1.6vw,1.25rem);line-height:1.5;margin-top:1.8rem;max-width:36rem}
.rp-layer{margin-top:1.8rem;padding:1.1rem 1.2rem 1.2rem;border:1px solid var(--line);border-radius:.9rem;display:flex;flex-direction:column;gap:1rem}
.rp-segs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem}
.rp-segs i{display:block;height:3px;border-radius:2px;background:var(--line-2);transition:background .6s}
.rp-segs .on i{background:var(--c)}
.rp-segs em{display:block;margin-top:.55rem;font-style:normal;font-size:.625rem;line-height:1.35;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3)}
.rp-segs .on em{color:var(--fg)}
.rp-segs em b{font-weight:400}
@media (max-width:640px){.rp-segs span:not(.on) em span{display:none}}
button.btn{background:none;color:inherit;font:inherit;cursor:pointer}
button.btn:focus-visible{outline:2px solid #e34acc;outline-offset:2px}
.rp-layer .link{align-self:flex-start;font-size:.875rem}
.rp-sec{margin-top:2.7rem}
.rp-sec h3,.rp-about summary{display:flex;align-items:center;gap:.75rem;margin:0 0 1.1rem;font-weight:400;font-size:var(--fs-12);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3)}
.rp-sec h3 i{display:block;width:1.6rem;height:1px;background:rgba(242,242,242,.35);flex:none}
.rp-copy{color:var(--fg-2);font-size:1rem;line-height:1.65;max-width:38rem}
.rp-copy p{margin:0 0 .9rem}.rp-copy p:last-child{margin-bottom:0}
.rp-copy ul,.rp-copy ol{list-style:none;margin:0 0 .9rem;padding:0;display:flex;flex-direction:column;gap:.7rem}
.rp-copy li{position:relative;padding-left:1.5rem}
.rp-copy li::before{content:"";position:absolute;left:0;top:.8em;width:.7rem;height:1px;background:var(--hot)}
.rp-copy li p{margin:0}
.rp-copy strong{font-weight:400;color:var(--fg)}
.rp-copy br:last-child{display:none}
.rp-copy a{color:var(--fg)}
.rp-about{margin-top:2.7rem;border-top:1px solid var(--line);padding-top:1.3rem}
.rp-about summary{cursor:pointer;list-style:none;justify-content:space-between;margin:0}
.rp-about summary::-webkit-details-marker{display:none}
.rp-about summary i{position:relative;width:.75rem;height:.75rem;flex:none}
.rp-about summary i::before,.rp-about summary i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--fg-2);transition:transform .5s var(--ease)}
.rp-about summary i::after{transform:rotate(90deg)}
.rp-about[open] summary i::after{transform:rotate(0)}
.rp-about[open] .rp-copy{margin-top:1.1rem;animation:rp-in .7s var(--ease) both}
.rp-about summary:hover{color:var(--fg)}
.rp-alt{margin-top:2.6rem;color:var(--fg-3);font-size:.9375rem}
.rp-foot{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;padding:1rem clamp(1.25rem,4vw,2.5rem) calc(1rem + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:rgba(26,35,45,.94)}
.rp-note{margin-left:auto;font-size:var(--fs-12);color:var(--fg-3);max-width:13rem;text-align:right}
@media (max-width:640px){
  .rp-sheet{top:max(.6rem,env(safe-area-inset-top));width:100%;border-left:0;border-top:1px solid var(--line);border-radius:1.2rem 1.2rem 0 0;transform:translateY(104%)}
  .rp-sheet::before{left:0;right:0;top:-1px;bottom:auto;width:auto;height:1px;background:linear-gradient(90deg,#fc4238,#e34acc 40%,#9957cf 70%,rgba(153,87,207,0))}
  .rp-facts{grid-template-columns:1fr 1fr}
  .rp-note{margin-left:0;text-align:left;max-width:none;flex-basis:100%}
  .rp-foot .btn{flex:1;justify-content:space-between}.rp-foot .rp-copylink{flex:none;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.rp-sheet,.rp-scrim,.rp-body{transition:none}.rp.open .rp-body>*,.rp-about[open] .rp-copy{animation:none}}
@media print{.rp{display:none!important}}

/* ---------- the office, as a dotted map ---------- */
.foot{position:relative}
.fmap{overflow:hidden}
.foot>.wrap{position:relative;z-index:1}
.fmap{position:absolute;inset:0;z-index:0;pointer-events:none}
.fmap canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.fm-zone{height:clamp(15rem,24vw,21rem)}
.foot .fm-zone+.bottom{margin-top:0}
.fm-pin,.fm-stn{position:absolute;left:0;top:0;opacity:0;transition:opacity 1.2s var(--ease) 1s}
.fmap.on .fm-pin,.fmap.on .fm-stn{opacity:1}
.fm-core{position:absolute;left:-4px;top:-4px;width:8px;height:8px;border-radius:50%;background:var(--hot);box-shadow:0 0 0 3px rgba(26,35,45,.92),0 0 22px rgba(235,69,158,.7)}
.fm-ring{position:absolute;left:-16px;top:-16px;width:32px;height:32px;border-radius:50%;border:1px solid rgba(235,69,158,.6);opacity:0}
.fm-pin.ping .fm-ring{animation:fm-ping 2.6s cubic-bezier(.2,.7,.2,1) both}
.fm-pin.ping .fm-ring.b{animation-delay:.4s}
@keyframes fm-ping{0%{transform:scale(.25);opacity:.95}100%{transform:scale(2.8);opacity:0}}
.fm-pin::before{content:"";position:absolute;right:0;bottom:0;width:22px;height:1px;background:rgba(242,242,242,.4);transform:rotate(40deg);transform-origin:100% 50%}
.fm-tag{position:absolute;right:20px;bottom:15px;display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;white-space:nowrap;text-align:right}
.fm-tag b{font-weight:400;font-size:.875rem;color:var(--fg)}
.fm-tag em{font-style:normal;font-size:.625rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);font-variant-numeric:tabular-nums}
.fm-stn i{position:absolute;left:-3.5px;top:-3.5px;width:7px;height:7px;border-radius:50%;border:1px solid #c4b5a9;background:var(--bg)}
.fm-stn span{position:absolute;left:11px;top:-.4rem;font-size:.625rem;line-height:1;letter-spacing:.14em;text-transform:uppercase;color:rgba(196,181,169,.85);white-space:nowrap}
.foot .dir{opacity:.8}
@media (prefers-reduced-motion:reduce){.fm-pin.ping .fm-ring{animation:none}}
@media print{.fmap,.fm-zone{display:none!important}}

/* ---------- the header as a signal readout ---------- */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.nav a{position:relative;transition:opacity .25s ease}
/* nav: a gradient underline that draws in from the left and leaves to the right */
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:1.5px;border-radius:2px;background:linear-gradient(90deg,#fc4238,#eb459e 45%,#9957cf);transform:scaleX(0);transform-origin:100% 50%;transition:transform .65s var(--ease)}
.nav a:hover::after{transform:scaleX(1);transform-origin:0 50%}
.nav a[aria-current=page]::after{transform:scaleX(1);transform-origin:0 50%}
/* the open-roles count, in dot-matrix digits */
.count.dm{display:inline-grid;place-items:center;min-width:1.9rem;height:1.6rem;padding:0 .45rem;border-radius:99px}
.count.dm svg{display:block;height:.62rem;width:auto;overflow:visible}
.count.dm .l{fill:#f2f2f2;animation:dm-in .35s var(--ease) calc(var(--d) * 28ms) both}
.count.dm .u{fill:rgba(242,242,242,.14)}
.btn.roles:hover .count.dm .l{fill:#fff;filter:drop-shadow(0 0 2px rgba(235,69,158,.9))}
.hdr.on-light .count.dm .l{fill:var(--enact-black)}.hdr.on-light .count.dm .u{fill:rgba(26,35,45,.14)}
@keyframes dm-in{from{opacity:0}}
@media (prefers-reduced-motion:reduce){.nav a::after{transition:none}.count.dm .l{animation:none}}
@media print{.toc{display:none!important}}
@media (max-width:1000px){.hdr .end{flex:1;min-width:0}.where{margin-right:auto;min-width:0}}
.fmap canvas.fm-fx{position:absolute;inset:0;width:100%;height:100%;display:block}
.fmap canvas.fm-base{clip-path:circle(0 at var(--px,70%) var(--py,60%));transition:clip-path 2.2s cubic-bezier(.3,.55,.25,1)}
.fmap.revealed canvas.fm-base{clip-path:circle(var(--rr,140%) at var(--px,70%) var(--py,60%))}
@media (prefers-reduced-motion:reduce){.fmap canvas.fm-base{transition:none}}

/* ---------- chapter index on the right edge: quiet dashes while reading, the chapter names when pointed at ---------- */
.toc{position:fixed;right:max(1.1rem,env(safe-area-inset-right));top:50%;z-index:29;--ti:0;--cp:0;transform:translate(.6rem,-50%);opacity:0;pointer-events:none;transition:opacity .6s var(--ease),transform .8s var(--ease)}
.toc.on{opacity:1;transform:translate(0,-50%);pointer-events:auto}
.toc ol{position:relative;list-style:none;margin:0;padding:.9rem .7rem;display:flex;flex-direction:column;gap:.2rem}
/* open: no box, a soft shade that dissolves into the page, so the names read over anything without drawing a frame */
/* the halo is gone: the names sit straight on the page; the pad below only keeps the gaps between them hoverable */
/* while open, an invisible pad behind the rows keeps the whole panel hoverable (gaps between names included); it never blocks the rows */
.toc ol::after{content:"";position:absolute;z-index:-1;top:-1.2rem;bottom:-1.2rem;right:-.6rem;left:-16rem;pointer-events:none}
.toc.open ol::after{pointer-events:auto}
.toc li button{all:unset;box-sizing:border-box;position:relative;display:flex;align-items:center;justify-content:flex-end;height:1.35rem;width:1.6rem;cursor:pointer}
.toc li span{position:absolute;right:2.55rem;top:50%;margin-top:-.5em;line-height:1;pointer-events:none;display:flex;gap:.6rem;font-size:.75rem;letter-spacing:.07em;text-transform:uppercase;color:var(--fg-2);white-space:nowrap;
  opacity:0;transform:translateX(.6rem);filter:blur(5px);transition:opacity .4s var(--ease),transform .75s var(--ease),filter .55s var(--ease),color .35s}
.toc li span b{font-weight:400;color:var(--fg-3);font-variant-numeric:tabular-nums;transition:color .35s}
.toc li i{display:block;flex:none;width:.85rem;height:2px;border-radius:2px;background:rgba(242,242,242,.26);transition:width .5s var(--ease),background .4s}
.toc li.past i{background:rgba(235,69,158,.45)}
/* pointing at it: the names resolve from soft to sharp, rippling out from the chapter you are in */
.toc.open li span,.toc:has(:focus-visible) li span{opacity:1;transform:none;filter:none;pointer-events:auto;transition-delay:calc(var(--dd,0) * 45ms),calc(var(--dd,0) * 45ms),calc(var(--dd,0) * 45ms),0s}
.toc li.now span{color:var(--fg)}.toc li.now span b{color:#eb459e}
.toc li button:hover span{color:var(--fg);transform:translateX(-.3rem);transition-delay:0s}.toc li button:hover span b{color:#eb459e}
.toc li button:hover i{width:1.1rem;background:rgba(242,242,242,.55)}
/* the pill: one gradient bar marks your chapter and fills as you read it; it springs to whichever row you point at */
.toc .tp{position:absolute;right:.7rem;top:calc(.9rem + .675rem - 1.5px);width:1.5rem;height:3px;border-radius:3px;overflow:hidden;pointer-events:none;background:rgba(242,242,242,.16);box-shadow:0 0 12px rgba(235,69,158,.4);
  transform:translateY(calc(var(--ti) * 1.55rem));transition:transform .65s cubic-bezier(.34,1.5,.5,1),width .5s var(--ease),opacity .4s}
.toc .tp b{position:absolute;inset:0;background:linear-gradient(90deg,#fc4238,#e34acc 60%,#9957cf);transform-origin:0 50%;transform:scaleX(max(.12,var(--cp)));transition:transform .3s var(--ease)}
.toc.preview .tp b{transform:scaleX(1)}
/* reading: it recedes */
.toc.on.scrolling:not(.open){opacity:.45}
.toc.scrolling:not(.open) li i{width:.55rem}.toc.scrolling:not(.open) .tp{width:1.05rem}
.toc li button:focus-visible{outline:none}.toc li button:focus-visible span{color:var(--fg);text-decoration:underline;text-underline-offset:4px}
/* over the light section */
/* over a light section each name and dash inverts on its own, so the colour flips exactly at the section edge */
.toc li i.lt{background:rgba(26,35,45,.28)}.toc li.past i.lt{background:rgba(227,74,204,.45)}
.toc li span.lt{color:rgba(26,35,45,.62)}.toc li span.lt b{color:rgba(26,35,45,.38)}
.toc li.now span.lt,.toc li button:hover span.lt{color:var(--enact-black)}.toc li.now span.lt b{color:#e34acc}
.toc.tplt .tp{background:rgba(26,35,45,.12);box-shadow:none}
@media (max-width:1199px),(hover:none){.toc{display:none}}
@media (prefers-reduced-motion:reduce){.toc,.toc *{transition:none!important}}
/* ------------------------------------------------------------------ buttons: the pixel-row fill (Conduct's model, Enact's colours)
   Three bars, each 12/35 of the button tall, race in from the left on a critically damped spring, each to its own overshoot
   (145%, 175% and 210% of the width), so the front arrives stepped, like pixels. Every bar leads with a long, high-contrast
   tail, violet into electric blue with a hard azure tip, and behind it reveals the Enact gradient pinned to the button,
   indigo through violet and pink to red, which is what stays once the tails have passed. Slower than Conduct's,
   so the eye can follow it; leaving, the bars snap back on a stiffer spring. Each bar carries a white copy of the label. */
:root{--sp-in:cubic-bezier(.33,.5,.2,1);--sp-out:cubic-bezier(.45,0,.2,1);
  --fxg:linear-gradient(90deg,#3f3aa6 0%,#6744bd 15%,#9957cf 31%,#c44fd9 45%,#e34acc 57%,#eb459e 71%,#f23d6b 85%,#fc4238 100%)}
@supports (transition-timing-function:linear(0,1)){:root{
  --sp-in:linear(0, 0.0317, 0.1061, 0.2010, 0.3022, 0.4011, 0.4930, 0.5756, 0.6480, 0.7103, 0.7633, 0.8077, 0.8447, 0.8753, 0.9003, 0.9208, 0.9374, 0.9508, 0.9616, 0.9703, 0.9773, 0.9828, 0.9873, 0.9908, 0.9936, 0.9958, 0.9975, 0.9989, 1);
  --sp-out:linear(0, 0.0899, 0.2765, 0.4780, 0.6542, 0.7907, 0.8871, 0.9496, 0.9865, 1.0057, 1.0136, 1.0151, 1.0134, 1.0105, 1.0075, 1.0049, 1.0029, 1.0015, 1.0007, 1.0001, 1)}}
.btn,.hdr .btn{position:relative;isolation:isolate;overflow:hidden;border:0;--bd:var(--line-2);box-shadow:inset 0 0 0 1px var(--bd);transition:color .4s,box-shadow .3s ease,padding .28s var(--ease),margin .28s var(--ease),transform .5s var(--ease)}
.btn.solid{--bd:var(--fg)}
.btn:hover{border-color:transparent}
.hdr.on-light .btn{--bd:rgba(26,35,45,.2)}
.btn .fx{position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit}
.btn .fx i{position:absolute;left:0;width:calc(var(--k) * 100%);height:calc(100% * 12 / 35);overflow:hidden;font-style:normal;transform:translate3d(calc(-100% - 2px),0,0);transition:transform .5s var(--sp-out)}
.btn .fx i:nth-child(1){top:0;--k:1.45;--tl:.4;--y:0%}
.btn .fx i:nth-child(2){top:calc(100% * 12 / 35);--k:1.75;--tl:.6;--y:-100%}
.btn .fx i:nth-child(3){top:calc(100% * 23 / 35);--k:2.1;--tl:.85;--y:calc(-100% * 23 / 12)}
/* the gradient and the white label are pinned to the button: each bar slides a window over them */
.btn .fx b,.btn .fx .c{position:absolute;left:0;top:var(--y);height:calc(100% * 35 / 12);width:calc(100% / var(--k));transform:translate3d(calc(var(--k) * 100% + 2px),0,0);transition:inherit}
/* the gradient ends inside the opaque part of the tail, so no sliver of it can show past the tip */
.btn .fx .w{position:absolute;left:0;top:0;bottom:0;width:calc(100% - var(--tl) / var(--k) * 60%);overflow:hidden;transition:inherit}
.btn .fx b{background:var(--fxg);width:calc(100% / (var(--k) - var(--tl) * .6))}
.btn .fx .t{position:absolute;top:0;bottom:0;right:-2px;width:calc(var(--tl) / var(--k) * 100% + 2px);background:linear-gradient(90deg,rgba(153,87,207,0) 0%,#9957cf 34%,#5b4ff0 62%,#2f6bff 86%,#6fc3ff 100%)}
.btn .fx .c{display:flex;align-items:center;color:#fff;white-space:nowrap}
/* filled, the arrow chip turns white and its arrow takes the Enact gradient */
.btn .fx .c .arr{background:#fff}.btn .fx .c .arr svg{stroke:url(#fxag)}
.btn .fx .c .count{background:rgba(255,255,255,.2)}
.btn .fx .c .count.dm .l{fill:#fff;filter:none}.btn .fx .c .count.dm .u{fill:rgba(255,255,255,.3)}
.btn .gx{position:absolute;right:1.05rem;top:50%;width:.9rem;height:.9rem;margin-top:-.45rem;transform:translate3d(2.6rem,0,0);transition:transform .26s var(--ease)}
.btn .gx svg{display:block;width:100%;height:100%}
@media (hover:hover){
  .btn:hover .fx i,.btn:hover .fx b,.btn:hover .fx .c{transform:translate3d(0,0,0);transition:transform 1.4s var(--sp-in)}
  /* the pill grows to the right for the arrow; the negative margin keeps the row it sits in from moving */
  .btn.has-gx:hover{padding-right:2.75rem;margin-right:-1.4rem;transition:color .4s,box-shadow .3s ease,padding .45s var(--ease),margin .45s var(--ease),transform .5s var(--ease)}
  .btn.has-gx:hover .gx{transform:none;transition:transform .45s var(--ease)}
}
.btn:focus-visible .fx i,.btn:focus-visible .fx b,.btn:focus-visible .fx .c{transform:translate3d(0,0,0);transition:transform 1.4s var(--sp-in)}
.btn.has-gx:focus-visible{padding-right:2.75rem;margin-right:-1.4rem}.btn.has-gx:focus-visible .gx{transform:none}
@media (prefers-reduced-motion:reduce){.btn,.hdr .btn,.btn .fx i,.btn .fx b,.btn .fx .c,.btn .gx{transition:none!important}}
/* ------------------------------------------------------------------ header, hero state
   At the very top of the main page the big hero logo is the brand, so the small logo steps aside and the page names sit in its place.
   On the first scroll the names slide to their own place and the small logo wipes in behind them, as if they drew it out;
   back at the top they slide over it again. The logo's visible edge always trails the names, so the two never overlap. */
@media (min-width:1001px){
  .hdr .mark{clip-path:inset(-4px -4px -4px -4px);transition:clip-path .95s var(--ease),visibility 0s}
  .hdr .nav{transition:transform .95s var(--ease)}
  .hdr.top .mark{clip-path:inset(-4px calc(100% + 4px) -4px -4px);visibility:hidden;transition:clip-path .95s var(--ease),visibility 0s .95s}
  .hdr.top .nav{transform:translate3d(calc(-1 * (1.15rem * 461.75 / 93.75 + 2.25rem + 2.75rem)),0,0)}
  .hdr.boot .mark,.hdr.boot .nav{transition:none!important}
}
@media (prefers-reduced-motion:reduce){.hdr .mark,.hdr .nav{transition:none!important}}
/* ------------------------------------------------------------------ the header's Open roles: the count hands its place to the arrow
   At rest a plain pill, "Open roles" and the dot-matrix count. On hover, as the fill sweeps, the arrow slides in from the right edge
   (as on the other link buttons) and pushes the number out to the left; the count's own pill dissolves so the arrow stands alone. */
.btn.sm.swap{padding-right:.5rem}
.btn.swap .gx{right:1rem}
.btn.swap .count{transition:background .3s ease}
.btn.swap .count svg{transition:transform .34s var(--ease),opacity .22s ease}
@media (hover:hover){
  .btn.swap:hover .count,.btn.swap:hover .fx .c .count{background:transparent}
  .btn.swap:hover .count svg{transform:translate3d(-1.1rem,0,0);opacity:0;transition:transform .45s var(--ease),opacity .25s ease}
  .btn.swap:hover .gx{transform:none;transition:transform .45s var(--ease) .04s}
}
.btn.swap:focus-visible .count,.btn.swap:focus-visible .fx .c .count{background:transparent}
.btn.swap:focus-visible .count svg{transform:translate3d(-1.1rem,0,0);opacity:0}.btn.swap:focus-visible .gx{transform:none}
@media (prefers-reduced-motion:reduce){.btn.swap .count,.btn.swap .count svg{transition:none!important}}
/* ------------------------------------------------------------------ header mark: the reveal
   The small logo is drawn inline. As the names slide over, the dash shoots in from the E, and the letters come up out of the
   header's baseline one after another in three hard ticks each, like a stepper motor: swift, mechanical, white as always. */
.mark svg.mk{display:block;height:1.15rem;width:calc(1.15rem * 461.75 / 93.75);overflow:visible;transition:color .4s}
.mk .lt{fill:currentColor;transform-box:fill-box}
.mk .dash{transform-box:fill-box;transform-origin:100% 50%}
@keyframes mk-lt{0%{transform:translateY(105%)}100%{transform:none}}
@keyframes mk-dash{0%{transform:scaleX(0)}100%{transform:none}}
@media (min-width:1001px){
  .hdr:not(.top):not(.boot) .mk .lt{animation:mk-lt .15s steps(3,end) backwards;animation-delay:calc(.07s + var(--i) * 48ms)}
  .hdr:not(.top):not(.boot) .mk .dash{animation:mk-dash .34s cubic-bezier(.2,.9,.1,1) backwards}
}
@media (prefers-reduced-motion:reduce){.mk .lt,.mk .dash{animation:none!important}}
/* ------------------------------------------------------------------ hand chapters: the grip card settles in
   The card lives beside the frame rather than inside it, so it can hang off the frame's bottom-right corner, slightly off the grid.
   As the hand begins its reach it slides, with the scroll, into its place inside the corner, arriving as the fingers touch the egg. */
.chapters .fwrap{position:relative;width:100%}
@media (min-width:901px){
  /* further off: up to 4.2rem right (never closer than about .6rem to the window edge) and 3.4rem down */
  .chapters .fwrap .graph{--gk:1;transform:translate3d(calc((1 - var(--gk)) * min(4.2rem, var(--gut) + .5rem)),calc((1 - var(--gk)) * 3.4rem),0);will-change:transform}
}
/* ------------------------------------------------------------------ legal pages
   Imprint as a spec sheet; the privacy policy as a long read with a sticky, numbered index whose gradient dash marks the section in view.
   The wording is Enact's own, as published; only the setting is new. */
.legal .pagehead{padding-bottom:clamp(2.5rem,5vw,4rem)}
.lmeta{margin:1.6rem 0 0}
.imp{border-top:1px solid var(--line);max-width:58rem}
.imp-row{display:grid;grid-template-columns:minmax(0,14rem) minmax(0,1fr);gap:1rem 2rem;align-items:baseline;padding:1.5rem 0;border-bottom:1px solid var(--line)}
.imp-row .k{margin:0;font-size:var(--fs-12);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3)}
.imp-row .v{margin:0;font-size:clamp(1.25rem,2.2vw,1.75rem);line-height:1.35;letter-spacing:-.015em;color:var(--fg)}
.imp-row .v.num{font-variant-numeric:tabular-nums}
.imp-more{margin:2.2rem 0 0}
.lgrid{display:grid;grid-template-columns:minmax(0,17rem) minmax(0,1fr);gap:clamp(2rem,6vw,6.5rem);align-items:start}
.lidx{position:sticky;top:6.25rem;max-height:calc(100svh - 8rem);overflow:auto;scrollbar-width:none}
.lidx::-webkit-scrollbar{display:none}
.lidx .eyebrow{margin-bottom:1rem}
.lidx ol{list-style:none;margin:0;padding:0}
.lidx a{position:relative;display:grid;grid-template-columns:2.6rem minmax(0,1fr);align-items:baseline;padding:.42rem 0 .42rem 1.15rem;text-decoration:none;color:var(--fg-3);font-size:.875rem;line-height:1.35;transition:color .3s ease}
.lidx a b{font-weight:400;font-size:.6875rem;letter-spacing:.14em;transition:color .3s ease}
.lidx a::before{content:"";position:absolute;left:0;top:calc(.42rem + .62em);width:.7rem;height:2px;border-radius:2px;background:var(--hot);transform:scaleX(0);transform-origin:0 50%;transition:transform .5s var(--ease)}
.lidx a:hover{color:var(--fg-2)}
.lidx a.on{color:var(--fg)}.lidx a.on b{color:#e34acc}.lidx a.on::before{transform:scaleX(1)}
.ltext{max-width:46rem}
.lsec{padding-top:2.6rem;margin-top:2.6rem;border-top:1px solid var(--line);scroll-margin-top:6.5rem}
.lsec:first-child{margin-top:0;padding-top:0;border-top:0}
.lsec h2{display:grid;grid-template-columns:2.8rem minmax(0,1fr);align-items:baseline;margin:0 0 1.2rem;font-size:clamp(1.375rem,2.1vw,1.75rem);line-height:1.2;letter-spacing:-.015em}
.lsec h2 .n{font-size:.75rem;letter-spacing:.16em;color:transparent;background:var(--hot);-webkit-background-clip:text;background-clip:text;justify-self:start}
.lsec p,.lsec li{color:var(--fg-2);font-size:1rem;line-height:1.7}
.lsec p,.lsec ul{margin:0 0 1.1rem 2.8rem}
.lsec ul{list-style:none;padding:0;display:grid;gap:.5rem}
.lsec li{position:relative;padding-left:1.4rem}
.lsec li::before{content:"";position:absolute;left:0;top:.82em;width:.6rem;height:2px;border-radius:2px;background:var(--hot)}
.lsec strong{color:var(--fg);font-weight:500}
.lsec .link{color:var(--fg);word-break:break-word}
@media (max-width:900px){
  .lgrid{grid-template-columns:minmax(0,1fr)}
  .lidx{position:static;max-height:none;padding-bottom:1.6rem;border-bottom:1px solid var(--line)}
  .lsec h2{grid-template-columns:2.2rem minmax(0,1fr)}
  .lsec p,.lsec ul{margin-left:0}
  .imp-row{grid-template-columns:minmax(0,1fr);gap:.5rem;padding:1.2rem 0}
}
/* footer credit: the name opens Marko's LinkedIn; on hover the system's gradient underline draws in */
.foot .credit a{position:relative;color:var(--fg-2);text-decoration:none;transition:color .25s ease}
.foot .credit a::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:1.5px;border-radius:2px;background:linear-gradient(90deg,#fc4238,#eb459e 45%,#9957cf);transform:scaleX(0);transform-origin:100% 50%;transition:transform .6s var(--ease)}
.foot .credit a:hover,.foot .credit a:focus-visible{color:var(--fg)}
.foot .credit a:hover::after,.foot .credit a:focus-visible::after{transform:scaleX(1);transform-origin:0 50%}
@media (prefers-reduced-motion:reduce){.lidx a::before,.foot .credit a::after{transition:none}}
/* the narrowest phones (320–360px, iPhone SE, older Galaxy S): the role panel's bar and footer keep everything on one line */
@media (max-width:360px){
  .rp-count{white-space:nowrap;letter-spacing:.1em}
  .rp-bar{gap:.6rem}.rp-nav{gap:.35rem}
  /* Apply takes the whole row; Copy link and the note share the next */
  .rp-foot .btn.rp-apply{flex:1 1 100%}
}
/* phones held sideways: the hero fits the short screen instead of keeping its 40rem minimum, with a smaller logo */
@media (orientation:landscape) and (max-height:520px){
  .hero{min-height:0}
  .hero .logo{width:min(46vw,24rem)}
  .hero .tagline{margin-top:.6rem}
  .hud .cue{visibility:hidden} /* no room for the scroll cue under the hint */
}

/* motion switched off in the footer */
html.calm .sheet{transition:none}
html.calm .sheet-nav a,html.calm .sheet-end{transition:none;opacity:1;transform:none}
html.calm .grad,html.calm .hud .cue i,html.calm .hint i,html.calm .hero .logo .dash,html.calm .hero .logo .lt{animation:none}
html.calm .rv{opacity:1;transform:none;transition:none}
html.calm .btn,html.calm .btn .arr,html.calm .job a{transition:none}
html.calm .hdr.hide{transform:none}
html.calm .btn:hover .arr svg{animation:none}
html.calm [data-split] .w>i{transform:none!important;transition:none!important}
html.calm .task .tele{display:none}
html.calm .task .ic .bp{opacity:0!important}
html.calm .names li.on .bot *{animation:none!important}
html.calm .bot .px,html.calm .names li.on .bot .px{transition:none}
html.calm .stats::before,html.calm .values>div::before{transform:none;transition:none}
html.calm .rp-sheet,html.calm .rp-scrim,html.calm .rp-body{transition:none}
html.calm .rp.open .rp-body>*,html.calm .rp-about[open] .rp-copy{animation:none}
html.calm .fm-pin.ping .fm-ring{animation:none}
html.calm .nav a::after{transition:none}
html.calm .count.dm .l{animation:none}
html.calm .fmap canvas.fm-base{transition:none}
html.calm .toc,html.calm .toc *{transition:none!important}
html.calm .btn,html.calm .hdr .btn,html.calm .btn .fx i,html.calm .btn .fx b,html.calm .btn .fx .c,html.calm .btn .gx{transition:none!important}
html.calm .hdr .mark,html.calm .hdr .nav{transition:none!important}
html.calm .btn.swap .count,html.calm .btn.swap .count svg{transition:none!important}
html.calm .mk .lt,html.calm .mk .dash{animation:none!important}
html.calm .lidx a::before,html.calm .foot .credit a::after{transition:none}/* hamburger: three lines, no label, no outline */
.menu-btn .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.menu-btn,.hdr.on-light .menu-btn{border:0!important;border-radius:0;padding:0!important;width:2.75rem;height:2.75rem;justify-content:center;color:inherit;-webkit-tap-highlight-color:transparent}
.menu-btn i{width:1.375rem;height:1.5px;border-radius:1px;box-shadow:0 -6px 0 currentColor,0 6px 0 currentColor}
/* pin the button to the top-right corner: .hdr .end stretches (flex:1) below 1000px, so its contents must be pushed right */
@media (max-width:1000px){.hdr .end{justify-content:flex-end}}
/* mobile: small logo hidden while the hero logo is in view, then assembles in the header like desktop */
@media (max-width:1000px){
  .hdr .mark{clip-path:inset(-4px -4px -4px -4px);transition:clip-path .95s var(--ease),visibility 0s}
  .hdr.top .mark{clip-path:inset(-4px calc(100% + 4px) -4px -4px);visibility:hidden;transition:clip-path .95s var(--ease),visibility 0s .95s}
  .hdr.boot .mark{transition:none!important}
  .hdr:not(.top):not(.boot) .mk .lt{animation:mk-lt .15s steps(3,end) backwards;animation-delay:calc(.07s + var(--i) * 48ms)}
  .hdr:not(.top):not(.boot) .mk .dash{animation:mk-dash .34s cubic-bezier(.2,.9,.1,1) backwards}
}
@media (max-width:1000px) and (prefers-reduced-motion:reduce){.hdr .mark{transition:none!important}}