.kicker { font-family: var(--sans); font-weight: 600; font-variant-numeric: tabular-nums; font-size: 14px; letter-spacing: .1em; color: var(--red); margin-bottom: 22px; }

.opener {
  position: relative; height: 64vh; min-height: 520px; max-height: 760px;
  overflow: hidden; background: var(--black); display: flex; align-items: center;
}
.opener-media { position: absolute; inset: 0; }
.opener-media img { width: 100%; height: 100%; object-fit: cover; opacity: .78; }
.opener-scrim {
  position: absolute; inset: 0; z-index: 10;
  background: linear-gradient(to top, rgba(0,0,0,.74), rgba(0,0,0,.26) 55%, rgba(0,0,0,.3));
}
.opener-grid {
  position: absolute; inset: 0; z-index: 10; opacity: .5; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.09) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(255,255,255,.09) 1px, transparent 1px);
  background-size: 50px 50px;
}
.opener-content { position: relative; z-index: 20; padding-top: 40px; }
.crumb { display: flex; gap: 10px; align-items: center; margin-bottom: 20px; font-size: 13px; color: rgba(255,255,255,.55); }
.crumb a { transition: color .3s; }
.crumb a:hover { color: var(--red); }
.crumb span[aria-hidden] { color: rgba(255,255,255,.3); }
.opener-kicker {
  font-family: var(--sans); font-weight: 600; font-variant-numeric: tabular-nums; font-size: 15px; color: var(--red);
  letter-spacing: .5em; text-transform: uppercase; margin-bottom: 16px;
}
.opener-title {
  font-size: clamp(56px, 8vw, 120px); line-height: .8; font-weight: 900;
  letter-spacing: -.04em; text-transform: uppercase; color: var(--white);
}
.opener-lead { margin-top: 34px; max-width: 640px; }
.opener-line {
  font-size: clamp(20px, 2.1vw, 26px); font-weight: 700; letter-spacing: -.015em;
  color: var(--white);
}
.opener-sub { margin-top: 12px; font-size: 16px; line-height: 1.6; color: rgba(255,255,255,.7); }

.crumb, .opener-kicker, .opener-title, .opener-lead { animation: rise 1s cubic-bezier(.16,1,.3,1) both; }
.opener-title { animation-delay: .1s; }
.opener-lead { animation-delay: .25s; }
@keyframes rise { from { opacity: 0; transform: translateY(60px); } to { opacity: 1; transform: none; } }

.crew { padding-block: var(--sect); background: #ececef; }
.crew-top {
  display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: end;
  margin-bottom: 56px;
}
.crew-head h2 {
  font-size: clamp(44px, 4.8vw, 72px); font-weight: 900; text-transform: uppercase;
  line-height: .86; letter-spacing: -.03em; color: var(--slate-900);
}
.crew-head h2 .outline { color: transparent; -webkit-text-stroke: 1px var(--black); }
.crew-body p { font-size: 18px; line-height: 1.65; color: var(--slate-600); max-width: 34em; }

.crew-mosaic {
  display: grid; grid-template-columns: repeat(12, 1fr); gap: 1px;
  background: var(--slate-300); border: 1px solid var(--slate-300);
}
.cm { position: relative; overflow: hidden; background: var(--slate-200); }
.cm img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.16,1,.3,1); }
.cm:hover img { transform: scale(1.045); }
.cm-1 { grid-column: span 8; height: 460px; }
.cm-2 { grid-column: span 4; height: 460px; }
.cm-5 { grid-column: span 12; height: 300px; }

.sculpt {
  position: relative; overflow: hidden; padding-block: var(--sect);
  background: var(--zinc-950); color: var(--white);
}
.sculpt .zone-glow {
  background: radial-gradient(ellipse 78% 52% at 50% 46%,
    rgba(237, 29, 36, .2), rgba(237, 29, 36, .07) 56%, transparent 80%);
}
.sculpt .container { position: relative; z-index: 10; }
.sculpt-top { display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: end; margin-bottom: 56px; }
.sculpt-head h2 {
  font-size: clamp(44px, 4.8vw, 72px); font-weight: 900; text-transform: uppercase;
  line-height: .86; letter-spacing: -.03em;
}
.sculpt-head h2 .outline { color: transparent; -webkit-text-stroke: 1px var(--white); }
.sculpt-body p { font-size: 17px; line-height: 1.65; color: var(--zinc-400); max-width: 36em; }
.sculpt-note { margin-top: 18px; color: rgba(255,255,255,.82) !important; }

.sc-rail {
  position: relative; z-index: 10; overflow: hidden;
  border-top: 1px solid var(--zinc-800); border-bottom: 1px solid var(--zinc-800);
}
.sc-row { display: flex; align-items: flex-start; width: max-content; padding-block: 24px; }
.sc-row + .sc-row { border-top: 1px solid var(--zinc-800); }
.sc-row-a { animation: marquee 96s linear infinite; }
.sc-row-b { animation: marquee 96s linear infinite reverse; }

.sc-piece {
  flex: none; display: block; margin-right: 16px; padding: 0; text-align: left;
  background: none; border: none;
}
.sc-piece img {
  width: auto; border: 1px solid var(--zinc-800);
  transition: transform .7s cubic-bezier(.16,1,.3,1), border-color .3s;
}
.sc-row-a .sc-piece img { height: 330px; }
.sc-row-b .sc-piece img { height: 262px; }
@media (prefers-reduced-motion: reduce) {
  .sc-row { animation: none; flex-wrap: wrap; width: auto; }
}

.join { position: relative; overflow: hidden; padding-block: 96px; background: var(--zinc-50); }
.join-grid { position: relative; z-index: 10; display: grid; grid-template-columns: 7fr 5fr; gap: 64px; align-items: center; }
.join-fig { display: flex; flex-direction: column; width: fit-content; }
.join-num {
  font-size: clamp(80px, 14vw, 200px); font-weight: 900; line-height: .84;
  letter-spacing: -.04em; color: var(--zinc-950);
  font-variant-numeric: tabular-nums;
}
.join-num .plus { color: var(--red); }
.join-num-l { margin-top: 16px; align-self: center; font-size: 22px; font-weight: 800; color: var(--zinc-950); }
.join-side { max-width: 460px; }
.join-side h2 {
  font-size: clamp(44px, 4.8vw, 72px); font-weight: 900; text-transform: uppercase;
  line-height: .86; letter-spacing: -.03em; color: var(--slate-900);
}
.join-side h2 .outline { color: transparent; -webkit-text-stroke: 1px var(--black); }
.join-line { margin-top: 22px; font-size: 18px; line-height: 1.6; color: var(--slate-600); }
.join-mail {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 26px;
  padding-bottom: 8px; border-bottom: 1px solid var(--slate-300);
  font-size: clamp(22px, 2.4vw, 30px); font-weight: 700; letter-spacing: -.02em;
  color: var(--slate-900); transition: color .3s, border-color .3s;
}
.join-mail:hover { color: var(--red); border-color: var(--red); }
.join-mail svg { transition: transform .3s; }
.join-mail:hover svg { transform: translate(4px, -4px); }

@media (max-width: 1023px) {
  .crew-top, .sculpt-top, .join-grid { grid-template-columns: 1fr; gap: 32px; }
  .cm-1, .cm-2 { grid-column: span 12; height: 340px; }
  .cm-5 { grid-column: span 12; height: 240px; }
}
@media (max-width: 767px) {
  .opener { height: 78vh; min-height: 460px; }
  .opener-lead { margin-top: 26px; }
  .cm-1, .cm-2 { height: 260px; }
  .cm-5 { grid-column: span 12; height: 220px; }
  .sc-row-a .sc-piece img { height: 210px; }
  .sc-row-b .sc-piece img { height: 180px; }
}