/* Manifesto and Careers. Loaded after /blog/blog.css, which carries the tokens, nav, footer and type. */
.btn{display:inline-block;font-family:var(--sans);font-size:13.5px;font-weight:500;text-decoration:none;padding:10px 18px;border-radius:999px;color:#fff;background:var(--signal);transition:background .2s,transform .2s}
.btn:hover,.btn:focus-visible{background:#E4553C;outline:none}
.btn:active{transform:scale(.98)}
.btn.ghost{background:none;color:var(--ink);border:1px solid var(--hair)}
.btn.ghost:hover{background:rgba(27,27,27,.05)}
h2{font-weight:300;font-size:clamp(28px,2.8vw,42px);line-height:1.12;letter-spacing:-.022em;margin:0 0 18px;text-wrap:balance}

/* ---------------- careers ---------------- */
.cp section{padding-left:var(--gutter);padding-right:var(--gutter)}
.cp h2{max-width:20ch}

/* hero: a wall of lab photos that gathers into a turning sphere as you scroll through it */
.cp-hero{position:relative;height:250vh;padding:0!important}
/* the stage sits below the nav (never under it), so the moving photos are not re-blurred by the frosted bar */
.cp-stage{position:sticky;top:var(--nav-h,58px);height:calc(100vh - var(--nav-h,58px));height:calc(100svh - var(--nav-h,58px));overflow:hidden}
body:has(.cp-hero)>header{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
#sphere{position:absolute;inset:0;cursor:grab;touch-action:pan-y}
#sphere.grabbing{cursor:grabbing}
#sphere canvas{display:block;width:100%;height:100%}
.cp-veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.93) 30%,rgba(255,255,255,.55) 46%,rgba(255,255,255,0) 62%)}
.cp-hero-copy{position:absolute;left:var(--gutter);top:50%;transform:translateY(-50%);max-width:30rem;z-index:2}
.cp-hero h1{margin-bottom:26px}
.cp-hero .lede{margin:0 0 14px}
.cp-hero .btn{margin-top:18px}
/* one line, given room */
.cp-statement{padding-top:clamp(100px,16vh,200px);padding-bottom:clamp(100px,16vh,200px);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,4.5vw,72px);align-items:center}
.cp-intro{max-width:36rem}
.cp-intro p{margin:0 0 16px;font-weight:300;font-size:clamp(15.5px,1.1vw,17px);line-height:1.6;letter-spacing:-.005em;color:var(--ink)}
.cp-intro p:last-child{margin-bottom:0}

/* our people */
.cp-group{margin:0}
.cp-group2{margin:0 0 clamp(110px,16vh,200px)}
.cp-group2 img{width:100%;height:auto;display:block;background:var(--soft);border-radius:8px}
.cp-group img{width:100%;height:auto;display:block;background:var(--soft);border-radius:8px}
.cp-people{padding-bottom:clamp(160px,24vh,300px)}
.cp-people + .cp-why{padding-top:0}   /* V2: the values section between them is gone, so the team runs straight into "Build frontier AI…" */
.cp-people-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);margin-bottom:clamp(36px,6vh,64px)}
.cp-people-copy .lede{margin:0 0 14px;max-width:36rem}
/* the definition on the left, the tiles it describes on the right */
.people-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:start}
.mosaic{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 8px}   /* V8: eleven tiles, as rows of 4, 4 and 3 */
.tile{aspect-ratio:1;overflow:hidden;background:var(--soft)}
.tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.22,.61,.36,1)}
.tile:hover img{transform:scale(1.04)}
/* the tiles are laid like a mosaic: each starts a little out of place and settles in, in a loose wave */
.mosaic.laying .tile{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(.82);
  transition:opacity .45s ease var(--d),transform 1s cubic-bezier(.16,1,.3,1) var(--d)}
.mosaic.laying.landed .tile{opacity:1;transform:none}
/* the team as the tiles: portraits that turn to the heart photo on hover */
.mosaic .tile{aspect-ratio:auto;overflow:visible;background:none}
.mosaic .tile p{margin:0}
.tp{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--soft);border-radius:8px}
.tp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tp-heart{opacity:0;transition:opacity .35s ease}
.tile:hover .tp-heart{opacity:1}
.tile:hover img{transform:none}
.rs-n{font-size:14px;font-weight:500;color:var(--ink);letter-spacing:-.005em;margin-top:10px!important;line-height:1.3}
.rs-r{font-size:13px;color:var(--ink-3);margin-top:1px!important}
.def{max-width:30rem}
.def p{margin:0}
.def-word{font-weight:300;font-size:clamp(48px,4.6vw,72px);line-height:1;letter-spacing:-.035em;color:var(--ink)}
.def-word span{color:var(--signal)}
.def-pos{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:12px 0 0!important}
.def-senses{list-style:none;margin:28px 0 0;padding:0}
.def-senses li{display:grid;grid-template-columns:22px 1fr;gap:6px;margin:0 0 18px}
.def-senses li:last-child{margin-bottom:0}
.def-senses li>span{font-size:12px;color:var(--signal);padding-top:4px}
.def-senses .def-main{font-weight:300;font-size:clamp(17px,1.35vw,20px);line-height:1.3;letter-spacing:-.01em;color:var(--ink);margin:0 0 8px}
.def-senses p:not(.def-main){font-size:14px;line-height:1.55;color:var(--ink-2);margin:0 0 8px}

/* how we work: a dark band, three statements */
.cp-values{background:var(--dark,#2A2A2A);color:#F1EFEC;padding-top:clamp(110px,16vh,200px);padding-bottom:clamp(110px,16vh,200px)}
.cp-values .eyebrow{color:#8A8885}
.cp-values h2{color:#F1EFEC;margin-bottom:clamp(48px,8vh,88px)}
.values{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,48px)}
.values li{font-weight:300;font-size:clamp(26px,2.6vw,40px);line-height:1.1;letter-spacing:-.022em;padding-top:22px;border-top:1px solid rgba(241,239,236,.18)}
.values span{display:block;font-size:12px;letter-spacing:.1em;color:var(--signal);margin-bottom:28px}

/* why: headline left, the argument right */
.cp-why{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);padding-top:clamp(120px,18vh,220px);padding-bottom:clamp(120px,18vh,220px)}
.cp-why-copy{padding-top:30px}
.cp-why-copy .lede{font-size:clamp(17px,1.3vw,20px);line-height:1.6;margin:0 0 18px;max-width:36rem}

/* open roles */
.cp-jobs{padding-bottom:clamp(120px,18vh,220px)}
.cp-jobs-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:24px}
.cp-jobs-head h2{margin:0}
.ashby{min-height:120px}
.ashby-empty{background:var(--soft);border-radius:12px;padding:clamp(28px,4vw,48px)}
.ashby-t{margin:0 0 8px;font-weight:300;font-size:clamp(20px,1.7vw,26px);letter-spacing:-.012em;color:var(--ink)}
.ashby-s{margin:0;font-size:15px;line-height:1.6;color:var(--ink-2)}
.ashby-s a{color:var(--signal);text-decoration:none}
.ashby-t a{color:var(--signal);text-decoration:none}
.roles-note{display:none;margin:22px 0 0;font-size:15px;line-height:1.6;color:var(--ink-2)}
.roles-note a{color:var(--signal);text-decoration:none}
.ashby.loaded + .roles-note{display:block}
.roles{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair)}
.roles li{border-bottom:1px solid var(--hair)}
.roles a{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:baseline;gap:8px 40px;padding:clamp(20px,2.4vw,28px) 0;text-decoration:none;color:var(--ink)}
.role-t{font-weight:300;font-size:clamp(20px,1.8vw,26px);letter-spacing:-.012em;line-height:1.2}
.role-m{font-size:14px;color:var(--ink-3);white-space:nowrap}
.role-m span{white-space:nowrap}
.role-go{font-size:13.5px;font-weight:500;white-space:nowrap;transition:color .2s}
.role-go i{font-style:normal;display:inline-block;transition:transform .25s}
.roles a:hover .role-go{color:var(--signal)}
.roles a:hover .role-go i{transform:translateX(4px)}
@media (max-width:760px){.roles a{grid-template-columns:minmax(0,1fr) auto}.role-m{grid-column:1;grid-row:2;white-space:normal}.role-go{grid-column:2;grid-row:1 / 3;align-self:center}}

/* ---------------- manifesto ---------------- */
.mf{padding:clamp(60px,9vh,120px) var(--gutter) clamp(80px,12vh,140px)}
.mf-head{max-width:42rem;margin:0 auto clamp(36px,6vh,64px)}   /* same column as the article, so the title lines up with the text */
.mf-body{max-width:42rem;margin:0 auto}
.mf-body p{font-size:clamp(16px,1.2vw,18px);line-height:1.72;color:var(--ink-2);margin:0 0 22px}
.mf-body em{font-style:italic}
.mf-body h2{margin:clamp(56px,8vh,88px) 0 20px;color:var(--ink);display:flex;gap:16px;align-items:baseline}
.mf-body h2 span{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--signal);flex:0 0 auto}
.mf-body blockquote{margin:36px 0;padding:0 0 0 22px;border-left:2px solid var(--signal)}
.mf-body blockquote p{font-weight:300;font-size:clamp(24px,2.2vw,32px);line-height:1.25;letter-spacing:-.015em;color:var(--ink);margin:0}
.mf-pull{font-weight:300!important;font-size:clamp(21px,1.8vw,26px)!important;line-height:1.35!important;letter-spacing:-.012em;color:var(--ink)!important;margin:32px 0!important}
.mf-pull.last{margin-top:40px!important}
.mf-list{margin:0 0 26px;padding:0;list-style:none}
.mf-list li{position:relative;padding:14px 0 14px 28px;border-top:1px solid var(--hair);font-size:clamp(16px,1.2vw,18px);line-height:1.6;color:var(--ink-2)}
.mf-list li:last-child{border-bottom:1px solid var(--hair)}
.mf-list li::before{content:"";position:absolute;left:4px;top:24px;width:8px;height:8px;border-radius:50%;background:var(--signal)}
.mf-list b{font-weight:500;color:var(--ink)}
.mf-eras{list-style:none;margin:0 0 28px;padding:0;counter-reset:era}
.mf-eras li{padding:22px 0;border-top:1px solid var(--hair)}
.mf-eras li:last-child{border-bottom:1px solid var(--hair)}
.mf-eras h3{font-weight:400;font-size:clamp(18px,1.5vw,21px);margin:0 0 10px;color:var(--ink);display:flex;gap:12px;align-items:baseline}
.mf-eras h3 span{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--ink-3)}
.mf-eras li:nth-child(2) h3 span{color:var(--signal)}
.mf-eras p{margin:0!important}
.mf-cta{max-width:42rem;margin:clamp(48px,7vh,80px) auto 0;padding-top:28px;border-top:1px solid var(--hair);display:flex;gap:10px}

.m-fig{max-width:58rem;margin:clamp(40px,6vh,64px) auto;background:var(--soft);border-radius:16px;padding:clamp(20px,3.5vw,48px)}
.m-fig svg{width:100%;height:auto;display:block}
.m-fig figcaption{font-size:13px;line-height:1.5;color:var(--ink-3);margin-top:16px;max-width:42rem}
.m-fig .lab{font-family:var(--sans);font-size:14px;fill:var(--ink-2)}
.m-fig .lab.o{fill:var(--signal)}
.m-fig .lab.end{text-anchor:end}
.m-fig .lab.mid{text-anchor:middle}
.m-fig .lab.it{font-style:italic}
.m-fig .arh{fill:var(--ink-2)}
.m-fig .arh.o{fill:var(--signal)}
/* bell curves */
.bell .ax{stroke:rgba(27,27,27,.25)}
.bell .today{fill:none;stroke:var(--ink-3);stroke-width:1.5;stroke-dasharray:5 5}
.bell .today-fill{fill:rgba(27,27,27,.05)}
.bell .next{fill:none;stroke:var(--signal);stroke-width:2}
.bell .next-fill{fill:rgba(242,99,74,.12)}
/* umwelt */
.umwelt .dash{fill:none;stroke:var(--ink-2);stroke-width:1.4;stroke-dasharray:6 6}
.umwelt .dash.o{stroke:var(--signal)}
.umwelt .solid{fill:none;stroke:var(--ink);stroke-width:1.5}
.umwelt .flow{fill:none;stroke:var(--ink-2);stroke-width:1.5}
.umwelt .flow.o{stroke:var(--signal)}
.umwelt .organ{fill:var(--paper);stroke:var(--ink);stroke-width:1.5}
.umwelt .organ.act{fill:url(#hatch)}
.umwelt .hl{stroke:var(--ink-2);stroke-width:1.4}
.umwelt .brace{fill:none;stroke:var(--ink);stroke-width:1.3}
/* eras */
.eras .track{stroke:rgba(27,27,27,.3);stroke-width:1.2}
.eras .dot{fill:var(--paper);stroke:var(--ink-2);stroke-width:2}
.eras .dot.o{stroke:var(--signal);fill:var(--signal)}
.eras text{font-family:var(--sans);text-anchor:middle}
.eras .num{font-family:var(--mono);font-size:12px;letter-spacing:.08em;fill:var(--ink-3)}
.eras .num.o{fill:var(--signal)}
.eras .w{font-size:20px;fill:var(--ink)}
.eras .w.o{fill:var(--signal)}
.eras .f{font-size:12.5px;fill:var(--ink-3)}
/* the figures move a little once they are in view (manifesto) */
.bell .lab.o{transition:opacity .8s ease .2s}
.bell.morphing .lab.o{opacity:0}
@keyframes cycle{to{stroke-dashoffset:-12}}
.m-fig.in .umwelt .dash{animation:cycle 1.8s linear infinite}
.eras .track{stroke-dasharray:650;stroke-dashoffset:650;transition:stroke-dashoffset 1.6s cubic-bezier(.65,0,.35,1) .2s}
.eras .arh{opacity:0;transition:opacity .4s ease 1.6s}
.eras .era,.eras .where{opacity:0;transform:translateY(6px);transition:opacity .7s ease,transform .9s cubic-bezier(.22,1,.36,1);transition-delay:calc(.45s + var(--i,3) * .35s)}
.m-fig.in .eras .track{stroke-dashoffset:0}
.m-fig.in .eras .arh{opacity:1}
.m-fig.in .eras .era,.m-fig.in .eras .where{opacity:1;transform:none}
.eras .halo{fill:none;stroke:var(--signal);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center}
@keyframes ripple{0%{transform:scale(1);opacity:.55}100%{transform:scale(2.8);opacity:0}}
.m-fig.in .eras .halo{animation:ripple 2.8s cubic-bezier(.22,1,.36,1) 1.6s infinite}
@media (prefers-reduced-motion:reduce){
  .m-fig .umwelt .dash,.m-fig .eras .halo{animation:none!important}
  .eras .track{stroke-dashoffset:0;transition:none}
  .eras .arh,.eras .era,.eras .where{opacity:1;transform:none;transition:none}
}

@media (max-width:860px){
  .cp-people-head,.cp-why,.cp-statement{grid-template-columns:1fr}
  .cp-hero{height:220vh}
  .cp-hero-copy{top:auto;bottom:40px;transform:none;right:var(--gutter);max-width:none}
  .cp-veil{background:linear-gradient(to bottom,rgba(255,255,255,0) 20%,rgba(255,255,255,.85) 52%,#fff 70%)}
  .people-grid{grid-template-columns:1fr}
  .def{position:static}
  .mosaic{grid-template-columns:repeat(3,minmax(0,1fr))}
  .values{grid-template-columns:1fr}
  .cp-why-copy{padding-top:0}
  .cp-jobs-head{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){.tile:hover{transform:none}.mosaic.laying .tile{transform:none;transition:opacity .4s ease}}

/* ---------------- manifesto as a paper ----------------
   A sheet on a soft grey desk. The surface is generated in WebGL (manifesto/paper.js): fibres, grain and
   tooth, with a lamp that rakes across it as you read. The text is set like a research paper. */
/* V8: a museum case. The room is dark, a warm light falls on the sheet from above, and the stack lies in an
   archival box, so the eye goes to the paper */
body:has(.paper){background:#100E0C radial-gradient(70% 60% at 50% 38%,#3A3129 0%,#211C17 45%,#100E0C 100%) fixed}
body:has(.paper)>header{background:rgba(16,14,12,.72)}
body:has(.paper)>header .brand svg{color:#E9E3D9}
body:has(.paper)>header nav a{color:#8F887E}
body:has(.paper)>header nav a:hover,body:has(.paper)>header nav a:focus-visible,body:has(.paper)>header nav a[aria-current="page"]{color:#EDE7DE;border-bottom-color:#EDE7DE}
body:has(.paper)>header .nav-toggle i::before,body:has(.paper)>header .nav-toggle i::after{background:#E9E3D9}
body:has(.paper) footer{background:#fff}   /* the closing wave still runs out into the light site footer */
.mf{padding:clamp(28px,5vh,64px) var(--gutter) clamp(64px,10vh,120px)}
/* a real sheet: warm uncoated stock, lit tooth, a slight curl of light across it, edges that take a little
   more of the room's shadow, and two more sheets in the stack beneath */
.paper{position:relative;max-width:920px;margin:0 auto;padding:clamp(32px,6vw,96px) clamp(24px,12vw,176px) clamp(48px,7vw,96px);   /* V8: the wide side margins of a LaTeX article */
  background-color:#EDE7DC;color:#1F1A14;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  box-shadow:0 0 0 .5px rgba(60,50,30,.08),0 1px 1px rgba(20,24,30,.08),0 6px 14px -6px rgba(20,24,30,.14),0 34px 70px -24px rgba(20,24,30,.30)}
.paper::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    linear-gradient(100deg,rgba(255,240,215,.16) 0%,rgba(255,240,215,0) 22%,rgba(0,0,0,0) 78%,rgba(70,40,10,.05) 100%),
    radial-gradient(140% 100% at 50% 50%,rgba(0,0,0,0) 62%,rgba(80,66,50,.1) 100%)}   /* V8: old stock browns toward its edges */
.mf::before,.mf::after{content:"";display:block;max-width:920px;margin:0 auto;height:0}
.paper-stack{position:relative;max-width:920px;margin:0 auto;
  box-shadow:0 0 0 clamp(14px,2.6vw,34px) #1C1814,0 0 0 calc(clamp(14px,2.6vw,34px) + 1px) rgba(255,235,205,.07),0 40px 120px -20px rgba(0,0,0,.7)}   /* V8: the archival box around the stack */
.paper-stack::before,.paper-stack::after{content:"";position:absolute;inset:0;background:#DDD6CA;box-shadow:0 1px 2px rgba(20,24,30,.08),0 10px 24px -14px rgba(20,24,30,.25)}
.paper-stack::before{transform:rotate(-.5deg) translate(-4px,6px)}
.paper-stack::after{transform:rotate(.3deg) translate(3px,3px);background:#E4DED3}
.paper-stack .paper{z-index:1}
.paper.textured{opacity:1;background-image:radial-gradient(120% 40% at 30% var(--lamp,30%),rgba(255,250,240,.24),rgba(255,250,240,0) 60%),linear-gradient(115deg,rgba(255,240,215,.1),rgba(255,240,215,0) 35%,rgba(255,240,215,.05) 60%,rgba(255,240,215,0) 80%),var(--paper-tex);background-size:100% 100%,512px 512px}
.paper.textured::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background-image:var(--tooth-tex);background-size:512px 512px;mix-blend-mode:overlay;opacity:.18}
.paper > *{position:relative}
.paper p,.paper li,.paper dd{font-size:clamp(15.5px,1.12vw,17px);line-height:1.68;color:#2A2A28;text-align:justify;hyphens:auto;-webkit-hyphens:auto;margin:0 0 14px}
.paper i{font-style:italic}

.paper-run{display:flex;justify-content:space-between;font-size:12px!important;letter-spacing:.06em;text-transform:uppercase;color:#7A7D82!important;text-align:left!important;margin:0 0 clamp(40px,6vw,64px)!important;padding-bottom:10px;border-bottom:.5px solid rgba(30,30,30,.25)}
.paper-title{text-align:center;margin-bottom:clamp(28px,4vw,40px)}
.paper-title h1{font-weight:400;font-size:clamp(30px,3.4vw,46px);line-height:1.1;letter-spacing:-.02em;margin:0 0 18px;color:#151515}
.paper-title p{text-align:center!important;margin:0!important}
/* the title corrects itself on load: "Attention" (after Vaswani et al.) is struck through and gives way to "Perception".
   The slot is always Perception's width, with Attention set flush right inside it, so the rest of the line never moves */
.pt-swap{position:relative;display:inline-block;white-space:nowrap;vertical-align:bottom}
.pt-old{position:absolute;right:0;top:0;opacity:0;transform:translateY(-.28em);pointer-events:none;color:#8a8a86}
.pt-old::after{content:"";position:absolute;left:-.04em;right:-.04em;top:56%;height:max(1.5px,.055em);background:var(--signal);transform:scaleX(0);transform-origin:left center}
.pt-new{display:inline-block}
.pt.anim .pt-old,.pt.anim .pt-new{transition:opacity .4s ease,transform .6s cubic-bezier(.22,1,.36,1)}
.pt.anim .pt-old::after{transition:transform .42s cubic-bezier(.65,0,.35,1)}
.pt.att .pt-old{opacity:1;transform:none;color:#151515}
.pt.att .pt-new{opacity:0;transform:translateY(.28em)}
.pt.anim:not(.att) .pt-new{transition-delay:.15s}
.pt.struck .pt-old{color:#8a8a86}
.pt.struck .pt-old::after{transform:scaleX(1)}
.pt-cite{font-size:.36em;vertical-align:super;margin-left:.2em;color:#7A7D82;text-decoration:none;letter-spacing:0}
.pt-cite:hover{color:var(--signal)}
.paper-by{font-size:16px!important;font-weight:500;color:#1E1E1E!important}
.paper-aff{font-size:14px!important;color:#6B6E73!important;margin-top:4px!important}

.paper-abstract{margin:0 clamp(0px,4vw,48px) clamp(28px,4vw,40px);padding:18px 0;border-top:.5px solid rgba(30,30,30,.25);border-bottom:.5px solid rgba(30,30,30,.25)}
.paper-abstract p{font-size:clamp(14.5px,1.02vw,15.5px)!important;line-height:1.6!important}
.paper-abstract b{font-weight:600}
.paper-kw{margin:8px 0 0!important}

.paper h2{text-wrap:pretty;display:flex;gap:14px;align-items:baseline;font-weight:600;font-size:clamp(17px,1.35vw,19px);letter-spacing:-.005em;color:#151515;margin:clamp(32px,4vw,44px) 0 12px}
.paper h2 span{font-weight:600;color:var(--signal);min-width:2.1em;flex:none}
.paper-q{hyphens:none!important;-webkit-hyphens:none!important;text-align:center!important;font-size:clamp(19px,1.6vw,23px)!important;line-height:1.4!important;font-style:italic;color:#151515!important;margin:22px clamp(0px,5vw,56px)!important}
.paper-claim{hyphens:none!important;-webkit-hyphens:none!important;padding-left:16px;border-left:2px solid var(--signal);text-align:left!important;color:#151515!important;font-weight:500}
.paper-list{margin:0 0 14px;padding-left:24px}
.paper-list li{margin:0 0 6px;padding-left:4px}
.paper-list li::marker{color:var(--signal);font-weight:600}
.paper-defs{margin:6px 0 18px}
.paper-defs dt{font-weight:600;font-size:clamp(15.5px,1.12vw,17px);color:#151515;margin:16px 0 4px;display:flex;gap:12px;text-wrap:pretty}
.paper-defs dt span{color:#7A7D82;font-weight:500;min-width:1.9em;flex:none}
.paper-defs dd{margin:0 0 0 0}

/* figures sit in the paper itself: no panel, a fine rule above and below, caption under */
.paper .m-fig svg{mix-blend-mode:multiply}
.paper .m-fig{background:none;border-radius:0;padding:18px 0 0;margin:26px 0 24px;border-top:.5px solid rgba(30,30,30,.2)}
.paper .m-fig figcaption{text-align:left;font-size:13.5px;line-height:1.5;color:#55585C;margin-top:12px;max-width:none;padding-bottom:16px;border-bottom:.5px solid rgba(30,30,30,.2)}
.paper .m-fig figcaption b{font-weight:600;color:#1E1E1E}

.paper-refs-h{margin-top:clamp(40px,5vw,56px)!important}
.paper-refs{margin:0;padding-left:28px}
.paper-refs li{scroll-margin-top:120px;font-size:13.5px!important;line-height:1.55!important;text-align:left!important;margin:0 0 8px!important;padding-left:4px}
.paper-refs li::marker{content:"[" counter(list-item) "]  ";color:#7A7D82}
.paper-folio{text-align:center!important;font-size:12px!important;color:#9A9DA2!important;margin:clamp(36px,5vw,56px) 0 0!important}
.paper ~ .mf-cta{max-width:920px;border-top:0;padding-top:0}

@media (max-width:640px){
  .paper p,.paper li,.paper dd{text-align:left;hyphens:manual}
  .paper-run span:last-child{display:none}
}
@media (max-width:560px){ .mosaic{grid-template-columns:repeat(2,minmax(0,1fr))} }


/* ================= carried over from the homepage (2026-10-29) ================= */
/* how we work: the homepage's vessel film, turned to the dark (inverted, then blended so its black
   becomes the charcoal), holding while the three values light in turn */
.cp-values{background:var(--dark,#2A2A2A);color:#F1EFEC;height:240vh;position:relative;padding:0!important}
.cpv-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#2A2A2A;isolation:isolate;display:flex;align-items:center;padding:0 var(--gutter)}
.cpv-film{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:60% 50%;
  filter:invert(1) hue-rotate(180deg) saturate(1.25) brightness(1.1);mix-blend-mode:lighten;pointer-events:none}
.cpv-stage::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(60% 70% at 16% 52%,rgba(42,42,42,.9),rgba(42,42,42,.5) 55%,rgba(42,42,42,0) 100%)}
.cpv-copy{position:relative;z-index:2;max-width:34rem}
.cp-values h2{color:#F1EFEC;margin:0 0 clamp(28px,5vh,48px)}
.values{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.values li{font-weight:300;font-size:clamp(20px,1.8vw,28px);line-height:1.2;letter-spacing:-.018em;color:#F1EFEC;padding:clamp(14px,2.2vh,22px) 0;border-top:1px solid rgba(241,239,236,.14);transition:opacity .6s ease,color .6s ease}
.values li:last-child{border-bottom:1px solid rgba(241,239,236,.14)}
.cp-values.threading .values li{opacity:.28}
.cp-values.threading .values li.past{opacity:.5}
.cp-values.threading .values li.here{opacity:1}
@media (max-width:860px){
  .cp-values{height:200vh}
  .cpv-stage{align-items:flex-end;padding-bottom:56px}
  .cpv-stage::before{background:linear-gradient(to bottom,rgba(42,42,42,0) 25%,rgba(42,42,42,.85) 60%,rgba(42,42,42,.95))}
}
/* ---------------- the homepage's gradient bands, shared (wave.js) ---------------- */
.band{position:relative;height:clamp(380px,44vw,680px);--ext:38vh;overflow-x:clip}
.band canvas{position:absolute;left:-12%;width:124%;top:calc(-1 * var(--ext));height:calc(100% + var(--ext));display:block;pointer-events:none}
.band::after{content:"";position:absolute;left:0;right:0;bottom:0;height:18%;pointer-events:none}
.band[data-wave="to-dark"]{background:#fff;z-index:1}
.band[data-wave="to-dark"]::after{background:linear-gradient(to bottom,rgba(42,42,42,0),#2A2A2A 70%)}
.band[data-wave="to-light"]{background:#2A2A2A;z-index:1}
.band[data-wave="to-light"]::after{background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 70%)}
/* the last stretch of a band into white is already solid white: what follows rides up into it, as on the homepage */
.band[data-wave="to-light"] + .cp-why{position:relative;z-index:2;margin-top:-44vh;padding-top:clamp(24px,4vh,48px)}
.band[data-wave="to-light"] + footer{position:relative;z-index:2;margin-top:-50vh}
/* the manifesto's close: the homepage's vessel film in the dark, between two waves */
.mf-close{position:relative;background:#2A2A2A;min-height:72vh;display:flex;align-items:center;padding:clamp(60px,10vh,120px) var(--gutter);overflow:hidden;isolation:isolate}
.mf-close::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(60% 70% at 16% 52%,rgba(42,42,42,.92),rgba(42,42,42,.5) 55%,rgba(42,42,42,0) 100%)}
.mf-close-copy{position:relative;z-index:2;max-width:34rem}
.mf-close .close-lead{margin:0 0 28px;max-width:24ch;font-weight:300;font-size:clamp(24px,2.3vw,34px);line-height:1.22;letter-spacing:-.018em;color:#F1EFEC}
.mf-close .actions{display:flex;flex-wrap:wrap;gap:12px}
.mf-close .btn.ghost{color:#F1EFEC;border-color:rgba(241,239,236,.28)}
.mf-close .btn.ghost:hover{background:rgba(241,239,236,.08)}
@media (max-width:860px){.mf-close{align-items:flex-end;min-height:80vh}.mf-close::before{background:linear-gradient(to bottom,rgba(42,42,42,0) 20%,rgba(42,42,42,.9) 60%)}}
.mf + .band[data-wave="to-dark"]{background:#100E0C}   /* starts from the manifesto room (V8: the dark museum case), not white */
.band::after{bottom:-2px}   /* overlap the band's own edge, which otherwise can show as a grey hairline */

/* V2: "Build frontier AI…" on charcoal: the homepage's wave washes the team into the dark and brings the page back to light for the roles */
.cp-people{padding-bottom:clamp(70px,10vh,110px)}   /* the wave itself is the gap */
.cp-why.room{position:relative;z-index:0;background:#2A2A2A;color:#F1EFEC;align-items:center;padding-top:clamp(40px,7vh,90px);padding-bottom:clamp(40px,7vh,90px)}
.cp-why.room h2{color:#F1EFEC}
.cp-why.room .lede{color:rgba(241,239,236,.88)}
.band[data-wave="to-light"] + .cp-jobs{position:relative;z-index:2;margin-top:-30vh}
@media (max-width:860px){.cp-why.room{padding-bottom:clamp(170px,26vh,230px)}.cp-people{padding-bottom:clamp(150px,22vh,190px)}}   /* the phone wave rises further: keep it off the last lines */
/* V2: a shorter wave into the charcoal section, so the dark arrives with the words rather than ahead of them */
.cp-people + .band{height:clamp(150px,13vw,230px)}
.cp-why.room{padding-top:0}

/* ---------- V10: careers is three things: the team outdoors, full-bleed; how to apply; the tiles ---------- */
.cp-photo{margin:0;padding:0 var(--gutter);line-height:0}
.cp-photo img{display:block;width:100%;height:auto}   /* the original photo, whole, on the content width; no torn edge or salmon block */
.cp-simple .cp-jobs{padding-top:clamp(70px,11vh,130px);padding-bottom:clamp(70px,11vh,130px)}
.cp-simple .cp-jobs-head h1{margin:0;font-weight:300;font-size:clamp(34px,4vw,60px);line-height:1.05;letter-spacing:-.03em}
.cp-simple .cp-jobs{padding-bottom:clamp(90px,13vh,150px)}   /* room for the wave's glow, clear of the last line */
.cp-simple .band{height:clamp(200px,17vw,260px)}   /* a shorter wave: the tiles come sooner */
.cp-simple .cp-people{position:relative;z-index:2;background:#2A2A2A;padding-top:clamp(30px,5vh,60px);padding-bottom:clamp(110px,16vh,180px);
  --ink:#F1EFEC;--ink-2:rgba(241,239,236,.82);--ink-3:rgba(241,239,236,.5);--soft:#353432;color:var(--ink)}   /* the tiles in the dark room: no rule, the wave carries the page into it */
.cp-simple .cp-people h2,.cp-simple .cp-people .lede{color:var(--ink)}
.cp-simple .cp-people .lede{color:var(--ink-2)}
