/* V3 cleanup: cinematic pacing without visible implementation mechanics. */
.hero { height: 175svh; overflow: visible; }
.hero__stage { position: sticky; top: 0; height: 100svh; min-height: 680px; overflow: hidden; isolation: isolate; }
.hero__content, .hero h1 { overflow: visible; }
.hero__content { bottom: max(9vh, 4.75rem); }
.hero h1 { max-width: 100%; }

.earth-reveal { height: 390vh; background: #050504; }
.earth-reveal__stage { background: #050504; }
.earth-cross-section { transform: scale(1.04); filter: brightness(.58) saturate(.78); }
.earth-cross-section__shade { z-index: 1; }
.earth-surface, .earth-descent { position: absolute; inset: 0; }
.earth-surface { z-index: 3; object-fit: cover; transform: scale(1); will-change: transform, opacity, filter; }
.earth-descent { z-index: 4; background: #050504; opacity: 0; pointer-events: none; }
.earth-reveal__caption { z-index: 5; }
.earth-reveal__exit { z-index: 6; transform: translateY(26px); will-change: opacity, transform; }

.chapter-heading, .chapter-heading h2, .material h3, .scale h2, .transform h2,
.finished-material h3, .people h2, .closing h2, .cta h2 { overflow: visible; }

.resource { background: #080706; }
.material { height: 112svh; min-height: 760px; clip-path: none; margin: 0; }
.material + .material { border-top: 1px solid rgba(238,234,225,.16); }
.material__copy { z-index: 2; }

.scale { height: 175svh; min-height: 1100px; background: #090806; overflow: visible; }
.scale__stage { position: sticky; top: 0; height: 100svh; min-height: 720px; overflow: hidden; }
.scale__stage > img, .scale__stage > .scale__shade { position: absolute; inset: 0; }
.scale__stage > img { transform: scale(1.025); }
.scale__copy { position: relative; z-index: 2; }

.transform { height: 430vh; }
.transform__detail { clip-path: inset(14% 14% 14% 14%); opacity: 0; transform: none; box-shadow: none; }
.transform__detail::after { display: none; }
.transform__detail img { transform: scale(1.1); }
.transform__shade {
  background:
    linear-gradient(0deg, rgba(5,5,4,.9) 0%, rgba(5,5,4,.56) 30%, transparent 64%),
    linear-gradient(90deg, rgba(5,5,4,.58), transparent 62%);
}
.transform h2 { text-shadow: 0 2px 28px rgba(0,0,0,.52); }

.finished { padding-bottom: 8rem; background: #11100e; }
.finished .chapter-heading { min-height: 78svh; align-content: center; }
.finished-material, .finished-material--copper {
  display: block; width: min(1480px, 94vw); height: auto; min-height: 118svh;
  padding: 11vh 0; text-align: left;
}
.finished-material__stage { position: relative; min-height: 96svh; overflow: hidden; background: transparent; }
.finished-material figure, .finished-material--copper figure {
  position: absolute; inset: 7vh auto auto -2vw; width: min(74vw, 1120px); height: 76vh; margin: 0; aspect-ratio: auto;
}
.finished-material--copper figure { inset: 7vh -2vw auto auto; }
.finished-material figure::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent 62%, #11100e 100%), linear-gradient(180deg, transparent 68%, rgba(5,5,4,.36));
}
.finished-material--copper figure::after { background: linear-gradient(270deg, transparent 62%, #11100e 100%), linear-gradient(180deg, transparent 68%, rgba(5,5,4,.36)); }
.finished-material__copy, .finished-material--copper .finished-material__copy {
  position: absolute; z-index: 2; right: 1vw; left: auto; bottom: 7vh; width: min(36rem, 36vw); opacity: 0;
}
.finished-material--copper .finished-material__copy { right: auto; left: 1vw; }
.finished-material h3 { font-size: clamp(3.2rem, 6vw, 7rem); }

.closing { height: 125svh; }
.cta { min-height: 88svh; display: flex; align-items: center; }

@media (max-width: 900px) {
  .hero { height: 150svh; min-height: 900px; }
  .hero__stage { min-height: 640px; }
  .hero__content { bottom: max(12vh, 5.5rem); }
  .hero h1 { font-size: clamp(2.65rem, 9.2vw, 5rem); line-height: .94; }
  .earth-reveal { height: 245vh; }
  .material { height: 98svh; min-height: 650px; }
  .scale { height: 128svh; min-height: 860px; }
  .scale__stage { min-height: 650px; }
  .transform { height: 280vh; }
  .finished .chapter-heading { min-height: 68svh; }
  .finished-material, .finished-material--copper { width: 100%; min-height: 106svh; padding: 5vh 0; }
  .finished-material__stage { min-height: 96svh; }
  .finished-material figure, .finished-material--copper figure {
    inset: 6vh 0 auto; width: 100%; height: 58vh;
  }
  .finished-material figure::after, .finished-material--copper figure::after { background: linear-gradient(180deg, transparent 62%, #11100e 100%); }
  .finished-material__copy, .finished-material--copper .finished-material__copy {
    left: 1.25rem; right: 1.25rem; bottom: 5vh; width: auto;
  }
  .finished-material h3 { font-size: clamp(3rem, 11vw, 5.5rem); }
  .closing { height: 108svh; }
  .cta { min-height: 80svh; }
}

@media (max-width: 540px) {
  .hero { height: 150svh; min-height: 900px; }
  .hero__content { bottom: max(13vh, 5.75rem); }
  .hero h1 { font-size: clamp(2.55rem, 11.2vw, 3.25rem); line-height: .95; letter-spacing: -.045em; }
  .earth-reveal { height: 220vh; }
  .material { height: 92svh; }
  .scale { height: 118svh; min-height: 800px; }
  .transform { height: 245vh; }
  .finished-material figure, .finished-material--copper figure { height: 54vh; }
}

@media (prefers-reduced-motion: reduce) {
  .hero, .earth-reveal, .scale, .transform, .closing { height: auto; min-height: 100svh; }
  .hero__stage { position: relative; }
  .earth-surface, .earth-descent { display: none; }
  .scale__stage { position: relative; }
  .transform__detail { clip-path: none; opacity: .65; }
  .finished-material__copy { opacity: 1; transform: none; }
  .transform h2 span, .closing h2 span,
  .transform h2 span:last-child, .closing h2 span:last-child { position: static; opacity: 1; transform: none; }
  .transform h2 span + span, .closing h2 span + span { margin-top: .22em; }
}
