:root {
  --red: #ed1c24;
  --ink: #0b0b0c;
  --coal: #151517;
  --paper: #f5f3ed;
  --white: #fff;
  --muted: #686866;
  --line: rgba(11, 11, 12, .18);
  --shell: min(1480px, calc(100vw - 48px));
  --font: "Albert Sans", "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; overflow-x: hidden; background: var(--paper); color: var(--ink); font-family: var(--font); font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--red); outline-offset: 4px; }
.skip-link { position: fixed; z-index: 1000; left: 18px; top: 12px; padding: 12px 16px; transform: translateY(-150%); background: var(--white); color: var(--ink); font-weight: 800; }
.skip-link:focus { transform: none; }

.lab-header { position: sticky; z-index: 80; top: 0; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 30px; min-height: 72px; padding: 0 max(24px, calc((100vw - 1480px) / 2)); background: var(--paper); border-bottom: 1px solid var(--line); }
.lab-brand { display: inline-flex; align-items: center; gap: 11px; color: inherit; text-decoration: none; white-space: nowrap; }
.lab-brand img { width: 36px; height: 36px; object-fit: contain; }
.lab-brand span { display: grid; font-size: .74rem; line-height: 1.05; letter-spacing: .04em; }
.lab-brand b { font-size: 1rem; letter-spacing: -.04em; }
.lab-header nav { display: flex; align-items: stretch; justify-content: flex-end; min-height: 72px; }
.lab-header nav a { display: grid; place-items: center; padding: 0 15px; color: #454548; font-size: .65rem; font-weight: 850; letter-spacing: .04em; text-decoration: none; border-left: 1px solid transparent; border-right: 1px solid transparent; }
.lab-header nav a:hover, .lab-header nav a[aria-current="true"] { background: var(--white); color: var(--ink); border-color: var(--line); }
.lab-header nav a:nth-last-child(2) { color: var(--red); }
.lab-menu { display: none; }

.lab-index { margin: 0 0 16px; color: var(--red); font-size: .66rem; font-weight: 900; letter-spacing: .1em; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1, h2, h3 { margin-top: 0; letter-spacing: -.055em; line-height: .95; }
h1 { margin-bottom: 28px; font-size: clamp(3.4rem, 7vw, 7.7rem); }
h2 { margin-bottom: 24px; font-size: clamp(2.5rem, 5.4vw, 5.9rem); }
h3 { margin-bottom: 14px; font-size: clamp(1.45rem, 2.4vw, 2.5rem); }

.lab-hero { width: var(--shell); min-height: calc(100vh - 72px); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(380px, .7fr); gap: clamp(50px, 8vw, 130px); align-items: center; padding: clamp(72px, 10vw, 150px) 0; }
.lab-hero__copy { max-width: 920px; }
.lab-lead { max-width: 790px; margin: 0; color: #3f3f42; font-size: clamp(1.05rem, 1.7vw, 1.35rem); line-height: 1.65; }
.lab-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.lab-button { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; padding: 0 22px; border: 1px solid currentColor; color: inherit; font-size: .7rem; font-weight: 900; letter-spacing: .06em; text-decoration: none; }
.lab-button:hover { background: var(--ink); color: var(--white); }
.lab-button--primary { background: var(--red); border-color: var(--red); color: var(--white); }
.lab-button--primary:hover { background: var(--ink); border-color: var(--ink); }

.signal-ledger { align-self: stretch; display: grid; align-content: center; position: relative; padding: 40px 0 40px 44px; border-left: 2px solid var(--ink); }
.signal-ledger::before { content: ""; position: absolute; left: -6px; top: 20%; width: 10px; height: 10px; background: var(--red); border-radius: 50%; box-shadow: 0 80px 0 var(--red), 0 160px 0 var(--red), 0 240px 0 var(--red), 0 320px 0 var(--red); }
.signal-ledger > p { margin: 0 0 28px; color: var(--muted); font-size: .62rem; font-weight: 900; letter-spacing: .1em; }
.signal-ledger ol { margin: 0; padding: 0; list-style: none; }
.signal-ledger li { display: grid; grid-template-columns: 32px minmax(0, 1fr); padding: 16px 0; border-top: 1px solid var(--line); }
.signal-ledger li:last-child { border-bottom: 1px solid var(--line); }
.signal-ledger li span { grid-row: 1 / span 2; color: var(--red); font-size: .66rem; font-weight: 900; }
.signal-ledger li b { font-size: 1rem; }
.signal-ledger li small { color: var(--muted); font-size: .76rem; }

.shift { width: var(--shell); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, .75fr); gap: clamp(50px, 9vw, 150px); padding: clamp(90px, 12vw, 180px) 0; border-top: 1px solid var(--line); }
.shift__statement h2 { max-width: 950px; }
.shift__copy { padding-top: 42px; color: #3f3f42; font-size: 1.05rem; }
.shift__copy p { margin: 0 0 24px; }
.source-row { display: grid; gap: 8px; margin-top: 34px; }
.source-row a, .lab-text-link { width: fit-content; color: var(--ink); font-size: .72rem; font-weight: 900; text-decoration-color: var(--red); text-decoration-thickness: 2px; text-underline-offset: 5px; }

.cluster-map { background: var(--ink); color: var(--white); padding: clamp(88px, 10vw, 150px) max(24px, calc((100vw - 1480px) / 2)); }
.cluster-map header { max-width: 1100px; }
.cluster-map__rail { margin-top: 70px; border-top: 1px solid rgba(255,255,255,.22); }
.cluster-map__rail a { display: grid; grid-template-columns: 64px minmax(180px, .45fr) 1fr; gap: 24px; align-items: baseline; padding: 22px 0; color: inherit; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.22); }
.cluster-map__rail a:hover b { color: var(--red); transform: translateX(8px); }
.cluster-map__rail span { color: var(--red); font-size: .68rem; font-weight: 900; }
.cluster-map__rail b { font-size: clamp(1.3rem, 2.2vw, 2.2rem); letter-spacing: -.04em; transition: color .2s, transform .2s; }
.cluster-map__rail small { color: #b8b8ba; font-size: .88rem; }

.cluster { padding: clamp(96px, 12vw, 190px) max(24px, calc((100vw - 1480px) / 2)); }
.cluster--dark { background: #171719; color: var(--white); }
.cluster--paper { background: var(--paper); }
.cluster--red { background: var(--red); color: var(--white); }
.cluster--light { background: var(--white); }
.cluster__intro { max-width: 990px; margin-bottom: clamp(56px, 8vw, 110px); }
.cluster__intro--offset { margin-left: clamp(0px, 15vw, 240px); }
.cluster__intro > p:not(.lab-index) { max-width: 740px; color: currentColor; opacity: .72; font-size: 1.08rem; line-height: 1.7; }
.cluster--red .lab-index { color: var(--ink); }
.cluster--red .lab-text-link { color: var(--white); text-decoration-color: var(--ink); }

.cluster__media { margin: 0; }
.cluster__media img { display: block; width: 100%; height: auto; max-height: min(560px, 68vh); object-fit: contain; object-position: center top; border: 1px solid rgba(255,255,255,.16); background: #0d0d0f; }
figure figcaption { display: grid; grid-template-columns: minmax(150px,.35fr) 1fr auto; gap: 22px; align-items: baseline; padding: 18px 0; border-bottom: 1px solid currentColor; }
figure figcaption b { font-size: 1rem; }
figure figcaption span { opacity: .68; font-size: .82rem; }
figure figcaption a, .system-lines a, .situation-band a, .participation-stage a, .operations-story a, .social-frame a, .access-story a, .papers a { width: fit-content; font-size: .7rem; font-weight: 900; text-decoration-color: var(--red); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.lab-status { width: fit-content; margin: 0; color: var(--red); font-size: .66rem; font-weight: 900; letter-spacing: .1em; }
.project-links { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 22px; }
.cluster--red figure figcaption a, .cluster--red .participation-stage a, .cluster--red .social-frame a { text-decoration-color: var(--ink); }
img[hidden] { display: none !important; }
.media-unavailable { grid-template-columns: 1fr !important; }

.system-lines { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 70px; border-left: 1px solid rgba(255,255,255,.2); }
.system-lines article { min-height: 320px; padding: 28px; border-right: 1px solid rgba(255,255,255,.2); border-top: 1px solid rgba(255,255,255,.2); border-bottom: 1px solid rgba(255,255,255,.2); }
.system-lines article > span { color: var(--red); font-size: .66rem; font-weight: 900; }
.system-lines h3 { margin-top: 55px; }
.system-lines p { color: #b8b8ba; font-size: .88rem; }

.duet { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(28px,5vw,80px); align-items: start; }
.duet figure { margin: 0; }
.duet figure:nth-child(2) { margin-top: 120px; }
.duet img { width: 100%; height: auto; max-height: 520px; object-fit: contain; object-position: center top; background: var(--coal); }
.situation-band { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(340px,.75fr); gap: clamp(36px,7vw,110px); align-items: center; margin-top: clamp(100px,14vw,210px); }
.situation-band img { display: block; width: 100%; height: auto; max-height: 540px; object-fit: contain; border: 1px solid var(--line); background: var(--ink); }
.situation-band p:not(.lab-index) { color: var(--muted); }

.participation-stage { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(340px,.65fr); gap: clamp(36px,7vw,110px); align-items: start; }
.participation-stage figure { margin: 0; }
.participation-stage__lead img { width: 100%; height: auto; max-height: 520px; object-fit: contain; object-position: center top; border: 1px solid rgba(255,255,255,.45); }
.participation-stage__notes { border-top: 1px solid rgba(255,255,255,.55); }
.participation-stage__notes article { padding: 25px 0 30px; border-bottom: 1px solid rgba(255,255,255,.55); }
.participation-stage__notes article > span { color: var(--ink); font-size: .63rem; font-weight: 900; letter-spacing: .08em; }
.participation-stage__notes h3 { margin-top: 22px; font-size: clamp(1.5rem,2.4vw,2.4rem); }
.participation-stage__notes p { color: rgba(255,255,255,.78); font-size: .88rem; }
.social-frame { display: grid; grid-template-columns: minmax(330px,.65fr) minmax(0,1.35fr); gap: clamp(36px,7vw,110px); align-items: center; margin-top: clamp(100px,14vw,200px); }
.social-frame .lab-index { color: var(--ink); }
.social-frame img { display: block; width: 100%; height: auto; max-height: 560px; object-fit: contain; border: 1px solid rgba(255,255,255,.45); background: var(--ink); }
.operations-story { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(330px,.75fr); gap: clamp(36px,7vw,110px); align-items: center; margin-top: clamp(90px,12vw,170px); padding: clamp(24px,4vw,58px); background: var(--paper); color: var(--ink); }
.operations-story img { display: block; width: 100%; height: auto; max-height: 520px; object-fit: contain; object-position: left top; border: 1px solid var(--line); background: #f1eee7; }
.operations-story p:not(.lab-index) { color: var(--muted); }
.operations-story a { display: inline-flex; min-height: 44px; align-items: center; }

.surface-composition { display: grid; grid-template-columns: .55fr 1.2fr .8fr; gap: clamp(24px,4vw,64px); align-items: start; }
.surface-composition figure { margin: 0; }
.surface-composition figure img { display: block; width: 100%; height: auto; max-height: 560px; object-fit: contain; object-position: center top; border: 1px solid var(--line); background: #f1eee7; }
.surface-composition__phone img { max-height: 680px; object-position: top; }
.surface-composition__car { margin-top: 110px !important; }
.surface-composition figcaption { display: block; padding: 12px 0; color: var(--muted); font-size: .7rem; font-weight: 900; }
.surface-composition ul { margin: 220px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.surface-composition li { display: grid; gap: 3px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.surface-composition li b { font-size: .84rem; }
.surface-composition li span { color: var(--muted); font-size: .75rem; }
.cluster--light > .lab-text-link { display: inline-block; margin-top: 44px; }

.field-lab { display: grid; grid-template-columns: minmax(0,.75fr) minmax(500px,1.25fr); gap: clamp(60px,9vw,150px); padding: clamp(100px,13vw,190px) max(24px, calc((100vw - 1480px) / 2)); background: var(--ink); color: var(--white); }
.field-lab ol { margin: 0; padding: 0; list-style: none; counter-reset: lab-step; border-top: 1px solid rgba(255,255,255,.24); }
.field-lab li { display: grid; grid-template-columns: 170px 1fr; gap: 28px; padding: 24px 0; border-bottom: 1px solid rgba(255,255,255,.24); counter-increment: lab-step; }
.field-lab li span { color: var(--red); font-size: .68rem; font-weight: 900; letter-spacing: .08em; }
.field-lab li span::before { content: "0" counter(lab-step) " / "; color: #77777d; }
.field-lab li p { margin: 0; color: #d0d0d2; }

.research { padding: clamp(100px,13vw,190px) max(24px, calc((100vw - 1480px) / 2)); }
.research__heading { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(330px,.55fr); column-gap: clamp(50px,9vw,150px); align-items: end; }
.research__heading .lab-index, .research__heading h2 { grid-column: 1; }
.research__heading > p:last-child { grid-column: 2; grid-row: 1 / span 2; color: var(--muted); align-self: end; }
.papers { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 80px; border-left: 1px solid var(--line); border-top: 1px solid var(--line); }
.papers article { display: flex; min-height: 590px; flex-direction: column; padding: clamp(30px,4vw,64px); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.papers article > span { color: var(--red); font-size: .66rem; font-weight: 900; letter-spacing: .08em; }
.papers h3 { margin-top: 48px; max-width: 620px; }
.papers article > p { color: var(--muted); }
.papers dl { margin: auto 0 28px; }
.papers dl div { display: grid; grid-template-columns: 90px 1fr; padding: 8px 0; border-top: 1px solid var(--line); font-size: .76rem; }
.papers dl div:last-child { border-bottom: 1px solid var(--line); }
.papers dt { color: var(--muted); }
.papers dd { margin: 0; font-weight: 800; }
.access-story { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(330px,.7fr); gap: clamp(40px,8vw,130px); align-items: center; margin-top: clamp(100px,14vw,210px); }
.access-story > img { display: block; width: 100%; height: auto; max-height: 540px; object-fit: contain; border: 1px solid var(--line); background: #f1eee7; }
.access-story div > p:not(.lab-index) { color: var(--muted); }
.sdg-logos { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 26px 0 30px; padding: 0; list-style: none; }
.sdg-logos:empty { display: none; }
.sdg-logos li { display: grid; align-content: start; border: 1px solid var(--line); background: var(--white); }
.sdg-logos img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; }
.sdg-logos span { padding: 10px; color: var(--ink); font-size: .65rem; font-weight: 850; line-height: 1.35; }

.lab-close { padding: clamp(110px,15vw,230px) max(24px, calc((100vw - 1480px) / 2)); background: var(--red); color: var(--white); }
.lab-close .lab-index { color: var(--ink); }
.lab-close h2 { max-width: 1200px; }
.lab-close > p:not(.lab-index) { max-width: 780px; font-size: 1.1rem; }
.lab-close .lab-button--primary { background: var(--ink); border-color: var(--ink); }
.lab-close .lab-button:hover { background: var(--white); border-color: var(--white); color: var(--ink); }

.lab-footer { display: grid; grid-template-columns: 1fr auto; gap: 30px 80px; padding: 64px max(24px, calc((100vw - 1480px) / 2)) 120px; background: var(--ink); color: var(--white); }
.lab-footer b { display: block; margin-bottom: 8px; font-size: .8rem; }
.lab-footer address { color: #aaa; font-size: .76rem; font-style: normal; }
.lab-footer > div:nth-child(2) { display: flex; flex-wrap: wrap; gap: 18px; justify-content: flex-end; }
.lab-footer a { font-size: .72rem; font-weight: 800; }
.lab-footer > p { grid-column: 1/-1; margin: 30px 0 0; padding-top: 20px; color: #777; font-size: .68rem; border-top: 1px solid rgba(255,255,255,.18); }

.js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .65s ease, transform .65s cubic-bezier(.2,.75,.25,1); }
.js [data-reveal].is-visible { opacity: 1; transform: none; }

@media (max-width: 1120px) {
  :root { --shell: min(100% - 36px, 1480px); }
  .lab-header { grid-template-columns: 1fr auto; padding-inline: 18px; }
  .lab-menu { display: inline-flex; width: 72px; height: 40px; align-items: center; justify-content: center; gap: 8px; border: 0; background: var(--ink); color: var(--white); font: inherit; font-size: .64rem; font-weight: 900; }
  .lab-menu i, .lab-menu i::after { display: block; width: 14px; height: 2px; background: currentColor; content: ""; }
  .lab-menu i::after { transform: translateY(5px); }
  .lab-header nav { position: absolute; inset: 72px 0 auto; display: none; min-height: 0; padding: 12px 18px 20px; grid-template-columns: repeat(2,minmax(0,1fr)); background: var(--paper); border-bottom: 1px solid var(--line); }
  .lab-header nav.is-open { display: grid; }
  .lab-header nav a { min-height: 46px; justify-items: start; padding: 0 12px; border-bottom: 1px solid var(--line); }
  .lab-hero { grid-template-columns: 1fr; min-height: auto; }
  .signal-ledger { max-width: 680px; }
  .shift, .field-lab { grid-template-columns: 1fr; }
  .research__heading { grid-template-columns: 1fr; }
  .research__heading > p:last-child { grid-column: 1; grid-row: auto; max-width: 720px; }
  .surface-composition { grid-template-columns: .7fr 1.3fr; }
  .surface-composition ul { grid-column: 1/-1; margin-top: 20px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-left: 1px solid var(--line); }
  .surface-composition li { padding: 18px; border-right: 1px solid var(--line); }
}

@media (max-width: 820px) {
  :root { --shell: min(100% - 28px, 1480px); }
  html { scroll-padding-top: 72px; }
  h1 { font-size: clamp(2.55rem,12vw,3.4rem); }
  h2 { font-size: clamp(2rem,9.5vw,2.8rem); }
  h3 { line-height: 1; }
  button { min-height: 44px; }
  .lab-brand { min-height: 44px; }
  .lab-brand span { font-size: .62rem; }
  .lab-brand b { font-size: .86rem; }
  .lab-menu { height: 44px; }
  .lab-header nav { grid-template-columns: 1fr; max-height: calc(100vh - 72px); overflow-y: auto; }
  .lab-hero { gap: 42px; padding: 52px 0 68px; }
  .signal-ledger { padding-left: 30px; }
  .signal-ledger::before { box-shadow: none; }
  .shift { grid-template-columns: 1fr; padding-block: 72px; }
  .shift__copy { padding-top: 0; }
  .cluster-map { padding-block: 72px; }
  .cluster-map__rail { margin-top: 46px; }
  .cluster-map__rail a { grid-template-columns: 38px 1fr; gap: 10px; }
  .cluster-map__rail small { grid-column: 2; }
  .cluster { padding-block: 76px; }
  .cluster__intro { margin-bottom: 44px; }
  .cluster__intro--offset { margin-left: 0; }
  figure figcaption { grid-template-columns: 1fr; gap: 7px; }
  .system-lines, .papers { grid-template-columns: 1fr; }
  .system-lines article { min-height: 0; }
  .system-lines h3 { margin-top: 34px; }
  .duet, .situation-band, .participation-stage, .operations-story, .social-frame, .access-story { grid-template-columns: 1fr; }
  .cluster__media, .duet figure, .surface-composition figure { width: min(100%, 560px); margin-inline: auto; }
  .participation-stage__lead { width: min(100%, 460px); margin-inline: auto; }
  .situation-band > img, .operations-story > img, .social-frame > img, .access-story > img { width: min(100%, 560px); margin-inline: auto; }
  .duet figure:nth-child(2), .surface-composition__car { margin: 32px auto 0 !important; }
  .social-frame img { grid-row: 1; }
  .cluster__media img, .duet img, .situation-band img, .participation-stage__lead img, .operations-story > img, .social-frame img, .surface-composition figure img, .access-story > img { max-height: 360px; }
  .situation-band, .operations-story, .social-frame, .access-story { margin-top: 72px; }
  .surface-composition { grid-template-columns: 1fr; }
  .surface-composition__phone img { max-height: 320px; }
  .surface-composition ul { grid-template-columns: 1fr; }
  .field-lab, .research { padding-block: 76px; }
  .field-lab li { grid-template-columns: 1fr; gap: 8px; }
  .papers { margin-top: 40px; }
  .papers article { min-height: 0; padding: 28px 20px; }
  .papers h3 { margin-top: 32px; }
  .papers dl { margin-top: 40px; }
  .lab-close { padding-block: 78px; }
  .source-row a, .lab-text-link, figure figcaption a, .system-lines a, .situation-band a, .participation-stage a, .operations-story a, .social-frame a, .access-story a, .papers a, .lab-footer a { display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; }
  .lab-footer { grid-template-columns: 1fr; padding: 52px 24px 96px; }
  .lab-footer > div:nth-child(2) { justify-content: flex-start; }
  .js [data-reveal] { opacity: 1; transform: none; transition: none; }
}

@media (max-width: 560px) {
  .cluster__media img, .duet img, .situation-band img, .operations-story > img, .social-frame img, .surface-composition figure img, .access-story > img { width: 100%; height: clamp(195px,58vw,225px); max-height: none; object-fit: cover; object-position: left top; }
  .participation-stage__lead img { width: 100%; height: min(78vw,300px); max-height: none; object-fit: cover; object-position: center top; }
  .surface-composition__phone img { object-position: 68% center; }
  .surface-composition__car img, .social-frame img { object-position: center; }
  .operations-story { padding: 18px; }
  .sdg-logos { grid-template-columns: 1fr; }
  .sdg-logos li { grid-template-columns: 86px 1fr; align-items: center; }
  .sdg-logos img { width: 86px; height: 86px; }
  .sdg-logos span { padding: 12px 14px; font-size: .72rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js [data-reveal] { opacity: 1; transform: none; }
}
