.pg-hero-track {
  --pg-header-height: 73px;
  --pg-stage-height: 100svh;
  --pg-scroll-distance: 120svh;
  position: relative;
  grid-column: fullbleed;
  height: calc(var(--pg-stage-height) + var(--pg-scroll-distance));
  margin-top: calc(-1 * var(--pg-header-height));
  background: #F0E8DC;
  isolation: isolate;
  z-index: 1;
}
.pg-hero {
  position: sticky !important;
  top: 0;
  height: var(--pg-stage-height);
  background: transparent !important;
  overflow: visible !important;
}
.pg-hero-media {
  --pg-scene-width: max(100vw, calc(var(--pg-stage-height) * 1.77777778));
  --pg-scene-height: calc(var(--pg-scene-width) * .5625);
  --pg-opening: 1;
  --pg-opening-lift: 7svh;
  --pg-opening-shrink: 0;
  position: relative;
  width: 100%;
  height: var(--pg-stage-height);
  pointer-events: none;
  /* Keep both the animated tomato and its continuation above the marquee. */
  z-index: 1;
}
.pg-sequence-film { position: absolute; inset: 0; overflow: hidden; }
.pg-sequence-canvas, .pg-sequence-poster {
  position: absolute;
  left: 50%; top: 50%;
  width: var(--pg-scene-width);
  height: var(--pg-scene-height);
  max-width: none;
  transform: translate(-50%, -50%) translateY(calc(var(--pg-opening) * var(--pg-opening-lift) * -1)) scale(calc(1 - var(--pg-opening) * var(--pg-opening-shrink)));
}
.pg-sequence-canvas { opacity: 0; }
.pg-hero-media[data-ready="true"] .pg-sequence-canvas { opacity: 1; }
.pg-hero-media[data-ready="true"] .pg-sequence-poster { visibility: hidden; }
.pg-sequence-still {
  position: absolute;
  width: calc(var(--pg-scene-width) * 1.9444);
  left: calc(50% + var(--pg-scene-width) * .2183);
  top: calc(50% - var(--pg-scene-height) * .5 - var(--pg-scene-width) * 1.4275);
  visibility: hidden;
}
.pg-sequence-art { position: relative; width: 100%; aspect-ratio: 4000 / 4966; transform: rotate(38.96deg); transform-origin: 0 0; }
.pg-sequence-art img { position: absolute; left: 8.95%; top: 16.331050%; width: 82.075%; height: auto; max-width: none; }
.pg-hero-media[data-released="true"] .pg-sequence-still { visibility: visible; }
.pg-hero-media[data-released="true"] .pg-sequence-film { visibility: hidden; }
.pg-hero-track[data-failed="true"] { height: var(--pg-stage-height); }
#pg-content-stage:has(.pg-hero-track) > div:not(:has(.pg-hero-track)),
.pg-hero-track + div { position: relative; z-index: 1; }
/* Let the continuation overlap the first project image. Keep the section
   heading, project captions and remaining cards above the tomato. */
#pg-content-stage:has(.pg-hero-track) > div:has(.pg-hero-track) + div { z-index: auto; }
#pg-content-stage > div:has(.pg-hero-track) + div > div > :not(:has(> a[href^="work/"])),
#pg-content-stage > div:has(.pg-hero-track) + div > div > div:has(> a[href^="work/"]) > a:not(:first-child),
#pg-content-stage > div:has(.pg-hero-track) + div > div > div:has(> a[href^="work/"]) > a:first-child > :not(:first-child) {
  position: relative;
  z-index: 2;
}
@media (max-width: 600px) and (orientation: portrait) {
  .pg-hero-media { --pg-opening-lift: 14svh; --pg-opening-shrink: .20; }
}
@media (prefers-reduced-motion: reduce) {
  .pg-hero-track { height: var(--pg-stage-height); }
  .pg-hero { position: relative !important; top: 0; }
}