/* A look back: one large featured card, text on the left and the combined video on the right. */
.lookback { z-index: 4; background: var(--paper); color: var(--ink); }
.lookback__card {
  display: grid; overflow: hidden; border-radius: var(--radius-xl);
  background: var(--white); box-shadow: var(--shadow-card);
  grid-template-columns: minmax(0, 1fr);
}
.lookback__copy { display: grid; align-content: center; gap: 1.5rem; padding: clamp(1.75rem, 5vw, 4.5rem); }
.lookback__title { font-size: clamp(2.5rem, 1.5rem + 3.6vw, 4.5rem); }
.lookback__copy .lede { max-width: 26rem; color: var(--ink-soft); }
.lookback__names {
  justify-self: start; padding: .6rem 1.1rem; border-radius: 999px;
  background: var(--paper); font-weight: 800; font-size: 1rem; line-height: 1.4;
}
.lookback__media {
  position: relative; display: block; overflow: hidden; isolation: isolate; min-height: 16rem;
  aspect-ratio: 16 / 9; background: var(--navy-900);
}
.lookback__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease-out); }
.lookback__media::after {
  content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgb(16 16 45 / .72), transparent 60%);
}
.lookback__label { font-weight: 800; font-size: clamp(1.0625rem, 1rem + .5vw, 1.375rem); line-height: 1.2; color: var(--white); }
@media (hover: hover) {
  .lookback__media:hover img { transform: scale(1.05); }
  .lookback__media:hover .play { transform: scale(1.1); }
}
@media (min-width: 860px) {
  .lookback__card { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
  .lookback__media { aspect-ratio: auto; min-height: 30rem; }
}
