@font-face {
  font-family: "Mona Sans";
  src: url("/assets/fonts/mona-sans.woff2") format("woff2");
  font-weight: 200 900;
  font-stretch: 75% 125%;
  font-display: swap;
}

:root {
  --bg: #000;
  --bg-2: #0a0a0b;
  --fg: #fff;
  --mute: #a3a6ab;
  --dim: #6e7177;
  --line: rgba(255, 255, 255, .16);
  --line-2: rgba(255, 255, 255, .32);
  --ok: #8fd19e;
  --warn: #ff8a7a;
  --hold: #b9c2d0;
  --gut: clamp(16px, 4vw, 56px);
  --max: 1360px;
  --hdr: 76px;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--hdr) + 12px); }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font: 400 16px/1.6 "Mona Sans", system-ui, sans-serif;
  font-stretch: 100%;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3, p, ol, ul, dl, dd, figure { margin: 0; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: #fff; color: #000; padding: 10px 14px; font-weight: 600; }
.skip:focus { top: 12px; }
.wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--gut); }

/* ---------- type ---------- */
.h-hero, .h-pan, .h2, .hdr .nav, .btn, .cap, .ftr-nav, .count span, .stats span, .units button, .spec-t th, .t thead th, .st, .vhero-sub {
  text-transform: uppercase;
  font-stretch: 125%;
}
.h-hero { font-size: clamp(40px, 7.4vw, 104px); font-weight: 700; line-height: .95; letter-spacing: .005em; }
.h-pan { font-size: clamp(32px, 5.2vw, 68px); font-weight: 700; line-height: 1; letter-spacing: .005em; max-width: 14ch; }
.h2 { font-size: clamp(24px, 2.8vw, 36px); font-weight: 700; line-height: 1.05; letter-spacing: .01em; margin-bottom: 24px; }
h3 { font-size: 19px; font-weight: 650; line-height: 1.25; font-stretch: 112%; }
.cap { font-size: 12px; font-weight: 600; letter-spacing: .14em; color: var(--mute); }
.small { font-size: 13px; color: var(--mute); }
.num { font-variant-numeric: tabular-nums; }
.nowrap { white-space: nowrap; }
.r { text-align: right; }

/* ---------- header ---------- */
.hdr { position: fixed; inset: 0 0 auto; z-index: 50; transition: background-color .3s ease; }
.hdr::before { content: ""; position: absolute; inset: 0 0 -40px; background: linear-gradient(rgba(0,0,0,.55), transparent); pointer-events: none; transition: opacity .3s; }
.hdr.is-solid, .hdr.is-open { background: #000; }
.hdr.is-solid::before, .hdr.is-open::before { opacity: 0; }
.hdr-in { position: relative; display: flex; align-items: center; gap: 40px; height: var(--hdr); padding: 0 var(--gut); }
.logo { display: block; color: #fff; text-decoration: none; flex: none; }
.logo-svg { display: block; width: 168px; height: auto; }
.nav { display: flex; gap: 28px; }
.nav a, .hdr-alt { font-size: 12.5px; font-weight: 650; letter-spacing: .1em; text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent; transition: border-color .2s; }
.nav a:hover, .nav a[aria-current="page"], .hdr-alt:hover { border-color: #fff; }
.hdr-alt { margin-left: auto; text-transform: uppercase; font-stretch: 125%; }
.menu-btn { display: none; margin-left: auto; width: 44px; height: 44px; border: 0; background: none; cursor: pointer; position: relative; }
.menu-btn span:not(.vh) { position: absolute; left: 11px; right: 11px; height: 2px; background: #fff; transition: transform .25s; }
.menu-btn span:nth-child(1) { top: 17px; }
.menu-btn span:nth-child(2) { top: 25px; }
.menu-btn[aria-expanded="true"] span:nth-child(1) { transform: translateY(4px) rotate(45deg); }
.menu-btn[aria-expanded="true"] span:nth-child(2) { transform: translateY(-4px) rotate(-45deg); }
.drawer { position: relative; background: #000; border-top: 1px solid var(--line); padding: 8px var(--gut) 28px; max-height: calc(100svh - var(--hdr)); overflow-y: auto; }
.drawer a { display: block; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 15px; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; font-stretch: 125%; text-decoration: none; }

/* ---------- buttons ---------- */
.btn-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  min-height: 52px; padding: 0 30px; border: 2px solid #fff; color: #fff; text-decoration: none;
  font-size: 12.5px; font-weight: 700; letter-spacing: .14em; overflow: hidden; isolation: isolate;
}
.btn::before { content: ""; position: absolute; inset: 0; background: #fff; transform: translateY(101%); transition: transform .3s cubic-bezier(.2, .7, .2, 1); z-index: -1; }
.btn:hover::before, .btn:focus-visible::before { transform: none; }
.btn:hover, .btn:focus-visible { color: #000; }
.btn span { transition: color .3s; }
.btn--dark { margin-top: 28px; }

/* ---------- full-bleed panels ---------- */
.pan, .vhero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; align-items: flex-end; overflow: hidden; background: #000; }
.pan-bg { position: absolute; inset: 0; }
.pan-bg img, .pan-bg .noimg { width: 100%; height: 100%; object-fit: cover; }
.pan-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.35) 45%, rgba(0,0,0,0) 70%), linear-gradient(0deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,0) 45%); }
.pan-in { position: relative; padding-top: calc(var(--hdr) + 40px); padding-bottom: clamp(56px, 11vh, 120px); }
.pan-in .cap { margin-bottom: 16px; color: #d8dadd; }
.pan-p { margin-top: 20px; max-width: 46ch; font-size: 17px; color: #e3e5e8; }
.pan--hero .h-hero { max-width: 12ch; }
.noimg { background: radial-gradient(ellipse at 70% 40%, #1a1c20, #000 70%); }

.vhero-in { position: relative; padding-bottom: clamp(56px, 12vh, 132px); }
.vhero-sub { margin-top: 18px; font-size: 14px; font-weight: 600; letter-spacing: .14em; color: #e3e5e8; }

/* ---------- countdown ---------- */
.count { display: flex; gap: clamp(18px, 3vw, 40px); margin-top: 28px; }
.count div { display: flex; flex-direction: column; gap: 6px; min-width: 2.6ch; }
.count strong { font-size: clamp(30px, 4vw, 52px); font-weight: 500; font-stretch: 100%; line-height: 1; font-variant-numeric: tabular-nums; }
.count span { font-size: 11px; font-weight: 600; letter-spacing: .14em; color: var(--mute); }
.count.is-off { display: none; }
.pan-in > .small { margin-top: 24px; }

/* ---------- stats ---------- */
.stats { display: flex; flex-wrap: wrap; gap: 28px clamp(32px, 6vw, 88px); margin-top: 28px; }
.stats div { display: flex; flex-direction: column; gap: 8px; }
.stats strong { font-size: clamp(44px, 6vw, 84px); font-weight: 500; line-height: .9; font-variant-numeric: tabular-nums; }
.stats span { font-size: 12px; font-weight: 600; letter-spacing: .14em; color: var(--mute); }

/* ---------- bands ---------- */
.band { padding: clamp(72px, 10vw, 136px) 0; }
.band--line { border-top: 1px solid var(--line); }
.band--stats { padding-top: 0; }
.band--stats .stats { margin-top: 0; padding-top: 48px; border-top: 1px solid var(--line); }
.band--stats .h2 { margin-bottom: 0; padding-bottom: 32px; }
.ov { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px clamp(40px, 7vw, 120px); align-items: start; }
.ov-copy p + p { margin-top: 16px; }
.ov-copy p { color: #d6d8db; max-width: 58ch; }
.ov-copy .small { margin-top: 24px; color: var(--mute); }

/* spec table + unit toggle */
.specs { display: flex; flex-direction: column; gap: 18px; }
.units { display: flex; align-self: flex-end; border: 1px solid var(--line-2); }
.units button { border: 0; background: none; padding: 8px 16px; font-size: 11.5px; font-weight: 700; letter-spacing: .12em; color: var(--mute); cursor: pointer; }
.units button[aria-pressed="true"] { background: #fff; color: #000; }
.spec-t { width: 100%; border-collapse: collapse; }
.spec-t th, .spec-t td { padding: 18px 0; border-bottom: 1px solid var(--line); vertical-align: baseline; }
.spec-t tr:first-child th, .spec-t tr:first-child td { border-top: 1px solid var(--line); }
.spec-t th { text-align: left; font-size: 12.5px; font-weight: 600; letter-spacing: .1em; color: var(--mute); padding-right: 16px; }
.spec-t td { text-align: right; font-size: 18px; font-weight: 500; font-variant-numeric: tabular-nums; }

/* tables */
.t-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.t { width: 100%; border-collapse: collapse; font-size: 15px; }
.t th, .t td { padding: 16px 20px 16px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.t td:last-child { padding-right: 0; }
.t thead th { font-size: 11.5px; font-weight: 600; letter-spacing: .12em; color: var(--mute); border-bottom-color: var(--line-2); padding-top: 0; }
.t tbody th { font-weight: 600; white-space: nowrap; }
.t td { color: #d6d8db; }
.t .r { text-align: right; }
.t--small { font-size: 14px; margin-top: 24px; }
.t--small th, .t--small td { padding: 12px 16px 12px 0; }
.t tr.is-past td, .t tr.is-past th { color: var(--dim); }
.st { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .12em; white-space: nowrap; }
.st::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: currentColor; vertical-align: 1px; }
.st--ok { color: var(--ok); }
.st--warn { color: var(--warn); }
.st--hold, .st--off { color: var(--hold); }

/* split: image + copy */
.split { display: grid; grid-template-columns: minmax(0, 55fr) minmax(0, 45fr); align-items: stretch; border-top: 1px solid var(--line); }
.split--flip { grid-template-columns: minmax(0, 45fr) minmax(0, 55fr); }
.split--flip .split-img { order: 2; }
.split-img { position: relative; min-height: 420px; }
.split-img img, .split-img .noimg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.split-copy { padding: clamp(48px, 7vw, 112px) clamp(24px, 5vw, 80px); align-self: center; }
.split-copy p { color: #d6d8db; max-width: 52ch; }
.split-copy p + p { margin-top: 16px; }

/* feature list */
.feat { display: grid; gap: 0; }
.feat div { padding: 18px 0; border-top: 1px solid var(--line); }
.feat div:last-child { border-bottom: 1px solid var(--line); }
.feat dt { font-weight: 650; font-stretch: 112%; margin-bottom: 4px; }
.feat dd { color: #c9cbcf; font-size: 15px; }

/* crew + sites */
.crew, .sites { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.sites { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sites:has(article:nth-child(4)) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.crew article, .sites article { padding: 28px 28px 8px 0; }
.crew article + article, .sites article + article { padding-left: 28px; border-left: 1px solid var(--line); }
.crew .cap, .sites .cap { margin-bottom: 10px; }
.crew h3, .sites h3 { margin-bottom: 12px; }
.crew p:not(.cap), .sites p:not(.cap) { color: #c9cbcf; font-size: 15px; }

/* jobs */
.jobs { list-style: none; padding: 0; border-top: 1px solid var(--line); }
.jobs li { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr) auto; gap: 12px 40px; padding: 28px 0; border-bottom: 1px solid var(--line); align-items: start; }
.job-h h3 { margin-bottom: 6px; }
.jobs li > p { color: #c9cbcf; font-size: 15px; }
.job-a { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-stretch: 125%; text-decoration: none; padding: 4px 0; border-bottom: 2px solid #fff; white-space: nowrap; }
.job-a:hover .arr { transform: translateX(3px); }
.arr { transition: transform .2s; }
.jobs + .small { margin-top: 28px; max-width: 70ch; }

/* faq */
.faq-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 40px; }
.faq details { border-top: 1px solid var(--line); }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; list-style: none; padding: 20px 40px 20px 0; position: relative; font-weight: 600; font-size: 17px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; right: 6px; top: 50%; width: 10px; height: 10px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: translateY(-70%) rotate(45deg); transition: transform .2s; }
.faq details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.faq details > div { padding: 0 0 22px; color: #c9cbcf; max-width: 62ch; }

/* notes */
.fn { font-size: .7em; line-height: 0; margin-left: 2px; }
.fn a { color: var(--mute); text-decoration: none; padding: 0 2px; }
.fn a:hover { color: #fff; }
.notes { border-top: 1px solid var(--line); padding: 40px 0 48px; }
.notes ol { padding-left: 22px; display: grid; gap: 8px; font-size: 12.5px; color: var(--dim); max-width: 90ch; }
.notes li:target { color: #fff; }

/* ---------- footer ---------- */
.ftr { border-top: 1px solid var(--line); padding: 48px 0 40px; background: #000; }
.ftr-nav { display: flex; flex-wrap: wrap; gap: 12px 28px; }
.ftr-nav a { font-size: 12px; font-weight: 650; letter-spacing: .12em; text-decoration: none; color: #d6d8db; }
.ftr-nav a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.ftr-fine { margin-top: 32px; display: grid; gap: 8px; font-size: 12px; color: var(--dim); max-width: 100ch; }
.ftr-bot { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 8px 28px; font-size: 12px; color: var(--mute); }

/* ---------- responsive ---------- */
@media (max-width: 1180px) {
  .nav { gap: 20px; }
  .nav a { font-size: 11.5px; }
  .crew { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .crew article:nth-child(3) { padding-left: 0; border-left: 0; }
  .crew article:nth-child(n + 3) { border-top: 1px solid var(--line); }
}
@media (max-width: 1020px) {
  .nav, .hdr-alt { display: none; }
  .menu-btn { display: block; }
}
@media (max-width: 900px) {
  :root { --hdr: 64px; }
  .logo-svg { width: 140px; }
  .ov, .faq-wrap { grid-template-columns: minmax(0, 1fr); }
  .units { align-self: flex-start; }
  .split, .split--flip { grid-template-columns: minmax(0, 1fr); }
  .split--flip .split-img { order: 0; }
  .split-img { min-height: 0; aspect-ratio: 16 / 10; }
  .split-copy { padding: 40px var(--gut) 64px; }
  .sites, .sites:has(article:nth-child(4)) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .sites article:nth-child(odd) { padding-left: 0; border-left: 0; }
  .sites article:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .jobs li { grid-template-columns: minmax(0, 1fr); }
  .pan-bg::after { background: linear-gradient(0deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.45) 50%, rgba(0,0,0,.15) 100%); }
}
@media (max-width: 600px) {
  body { font-size: 15px; }
  .crew, .sites, .sites:has(article:nth-child(4)) { grid-template-columns: minmax(0, 1fr); }
  .crew article, .sites article, .crew article + article, .sites article + article { padding: 24px 0 8px; border-left: 0; }
  .crew article + article, .sites article + article { border-top: 1px solid var(--line); }
  .count { gap: 18px; }
  .btn { padding: 0 22px; min-height: 48px; }
  .spec-t td { font-size: 16px; }
  .t { font-size: 14px; }
  .t:not(.t--small) thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .t:not(.t--small), .t:not(.t--small) tbody, .t:not(.t--small) tr { display: block; }
  .t:not(.t--small) tr { display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 16px 0; border-bottom: 1px solid var(--line); }
  .t:not(.t--small) th, .t:not(.t--small) td { display: block; padding: 0; border: 0; text-align: left; }
  .t:not(.t--small) tbody th { order: -1; flex-basis: 100%; font-size: 16px; white-space: normal; }
  .t:not(.t--small) td:last-child { flex-basis: 100%; }
  .t:not(.t--small) td.r::before { content: attr(data-l) " "; color: var(--mute); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
}