.story[data-astro-cid-ghlxpn2h] {
  display: grid;
  grid-template-columns: 46% 54%;
  timeline-scope: --g0, --g1, --g2, --g3, --g4, --g5, --h1, --h2, --h3, --h4, --h5;
}

.panel[data-astro-cid-ghlxpn2h] {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  background: var(--wool);
  color: #fff;
}

.shot[data-astro-cid-ghlxpn2h] {
  position: absolute;
  inset: 0;
  background: var(--wool);
  opacity: 0;
  will-change: opacity;
  animation: linear both fade-in;
  animation-range: cover 40vh cover 60vh;
}

.shot[data-astro-cid-ghlxpn2h]:first-child {
  opacity: 1;
  animation: none;
}

@keyframes fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.shot__frame[data-astro-cid-ghlxpn2h] {
  position: absolute;
  top: calc(var(--nav-h) + 5vh);
  bottom: calc(34px + clamp(40px, 6.2vw, 92px) + 4vh);
  left: var(--gutter);
  right: var(--gutter);
  max-width: 760px;
  margin: 0 auto;
}

.shot__frame[data-astro-cid-ghlxpn2h] picture[data-astro-cid-ghlxpn2h], .shot__frame[data-astro-cid-ghlxpn2h] img[data-astro-cid-ghlxpn2h], .slide__frame[data-astro-cid-ghlxpn2h] img[data-astro-cid-ghlxpn2h] {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.shot__word[data-astro-cid-ghlxpn2h] {
  position: absolute;
  left: var(--gutter);
  bottom: 34px;
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(40px, 6.2vw, 92px);
  line-height: .92;
  letter-spacing: -.03em;
  color: #fff;
  white-space: nowrap;
}

.c0[data-astro-cid-ghlxpn2h] {
  view-timeline-name: --g0;
}

.c1[data-astro-cid-ghlxpn2h] {
  view-timeline-name: --g1;
}

.c2[data-astro-cid-ghlxpn2h] {
  view-timeline-name: --g2;
}

.c3[data-astro-cid-ghlxpn2h] {
  view-timeline-name: --g3;
}

.c4[data-astro-cid-ghlxpn2h] {
  view-timeline-name: --g4;
}

.c5[data-astro-cid-ghlxpn2h] {
  view-timeline-name: --g5;
}

.chapters[data-astro-cid-ghlxpn2h] {
  min-width: 0;
  position: relative;
  z-index: 0;
}

.chapter[data-astro-cid-ghlxpn2h] {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: calc(14vh + var(--nav-h)) 8vw 14vh 7vw;
}

.copy[data-astro-cid-ghlxpn2h] {
  display: flex;
  flex-direction: column;
}

.slide[data-astro-cid-ghlxpn2h] {
  display: none;
}

@keyframes hold {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(100vh);
    transform: translateY(100dvh);
  }
}

.app[data-astro-cid-ghlxpn2h] {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 30px;
}

.app[data-astro-cid-ghlxpn2h] img[data-astro-cid-ghlxpn2h] {
  width: 88px;
  height: 88px;
  flex: none;
}

.app[data-astro-cid-ghlxpn2h] h1[data-astro-cid-ghlxpn2h] {
  margin: 0;
  font-size: clamp(38px, 4.4vw, 64px);
}

.copy[data-astro-cid-ghlxpn2h] h1[data-astro-cid-ghlxpn2h], .copy[data-astro-cid-ghlxpn2h] h2[data-astro-cid-ghlxpn2h] {
  text-wrap: balance;
}

.c0[data-astro-cid-ghlxpn2h] .big[data-astro-cid-ghlxpn2h] {
  font-size: 21.5px;
  line-height: 1.5;
}

.copy[data-astro-cid-ghlxpn2h] ul[data-astro-cid-ghlxpn2h] {
  max-width: var(--measure);
  margin: 0 0 1.2em;
  padding-left: 1.2em;
}

.copy[data-astro-cid-ghlxpn2h] li[data-astro-cid-ghlxpn2h] {
  margin: 0 0 .7em;
}

.copy[data-astro-cid-ghlxpn2h] a[data-astro-cid-ghlxpn2h] {
  text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
  text-underline-offset: 4px;
}

.copy[data-astro-cid-ghlxpn2h] a[data-astro-cid-ghlxpn2h]:hover {
  text-decoration-color: currentColor;
}

.note[data-astro-cid-ghlxpn2h], .fine[data-astro-cid-ghlxpn2h] {
  color: var(--graphite);
  font-size: 15px;
  font-style: italic;
}

.fine[data-astro-cid-ghlxpn2h] {
  margin-top: 24px;
}

.chapters[data-astro-cid-ghlxpn2h] .footer {
  margin-top: 0;
}

.chapters[data-astro-cid-ghlxpn2h] .footer__in {
  padding-left: 7vw;
  padding-right: 8vw;
}

@media (width <= 820px) {
  .story[data-astro-cid-ghlxpn2h] {
    grid-template-columns: 1fr;
  }

  .panel[data-astro-cid-ghlxpn2h] {
    display: none;
  }

  .chapter[data-astro-cid-ghlxpn2h] {
    min-height: 0;
    padding: 0;
    display: block;
    isolation: isolate;
  }

  .slide[data-astro-cid-ghlxpn2h] {
    display: block;
    position: sticky;
    top: 0;
    height: 100vh;
    height: 100dvh;
    margin: 0;
    overflow: hidden;
    background: var(--wool);
    z-index: 0;
  }

  .slide__frame[data-astro-cid-ghlxpn2h] {
    position: absolute;
    top: calc(var(--nav-h) + 20px);
    bottom: calc(62px + clamp(34px, 10vw, 48px));
    left: 14px;
    right: 14px;
  }

  .slide__word[data-astro-cid-ghlxpn2h] {
    position: absolute;
    left: var(--gutter);
    bottom: 26px;
    z-index: 1;
    color: #fff;
    font-family: var(--display);
    font-weight: 700;
    font-size: clamp(34px, 10vw, 48px);
    line-height: .95;
    letter-spacing: -.03em;
  }

  .copy[data-astro-cid-ghlxpn2h] {
    position: relative;
    z-index: 1;
    padding: calc(38vh + 112px) var(--gutter) 112px;
    min-height: 138vh;
    justify-content: center;
    background: linear-gradient(to bottom, transparent 38vh, var(--paper) 38vh);
  }

  .c1[data-astro-cid-ghlxpn2h] .slide[data-astro-cid-ghlxpn2h] {
    view-timeline-name: --h1;
  }

  .c2[data-astro-cid-ghlxpn2h] .slide[data-astro-cid-ghlxpn2h] {
    view-timeline-name: --h2;
  }

  .c3[data-astro-cid-ghlxpn2h] .slide[data-astro-cid-ghlxpn2h] {
    view-timeline-name: --h3;
  }

  .c4[data-astro-cid-ghlxpn2h] .slide[data-astro-cid-ghlxpn2h] {
    view-timeline-name: --h4;
  }

  .c5[data-astro-cid-ghlxpn2h] .slide[data-astro-cid-ghlxpn2h] {
    view-timeline-name: --h5;
  }

  .c0[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h], .c1[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h], .c2[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h], .c3[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h], .c4[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h] {
    animation: linear both hold;
    animation-range: entry;
  }

  .c0[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h] {
    animation-timeline: --h1;
  }

  .c1[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h] {
    animation-timeline: --h2;
  }

  .c2[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h] {
    animation-timeline: --h3;
  }

  .c3[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h] {
    animation-timeline: --h4;
  }

  .c4[data-astro-cid-ghlxpn2h] .copy[data-astro-cid-ghlxpn2h] {
    animation-timeline: --h5;
  }

  .story[data-astro-cid-ghlxpn2h]:before {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    top: -100vh;
    height: 100vh;
    background: var(--wool);
    z-index: -1;
    pointer-events: none;
  }

  .app[data-astro-cid-ghlxpn2h] {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 24px;
  }

  .app[data-astro-cid-ghlxpn2h] img[data-astro-cid-ghlxpn2h] {
    width: 72px;
    height: 72px;
  }

  .c0[data-astro-cid-ghlxpn2h] .big[data-astro-cid-ghlxpn2h] {
    font-size: 20px;
  }

  .chapters[data-astro-cid-ghlxpn2h] .footer__in {
    padding-left: var(--gutter);
    padding-right: var(--gutter);
  }
}

@media (prefers-reduced-motion: reduce) {
  .shot[data-astro-cid-ghlxpn2h] {
    animation: none !important;
  }
}
