/* Editorial interlude: the decisive moment */
.decisive-moment {
  scroll-margin-top: 72px;
  position: relative;
  width: min(86vw, 1180px);
  min-height: 460px;
  margin: 64px auto;
  border-top: 1px solid #353535;
  border-bottom: 1px solid #353535;
  border-left: 1px solid #353535;
  border-right: 1px solid #353535;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  align-items: center;
  gap: clamp(30px, 4vw, 60px);
  padding: 34px 38px 34px 34px;
  overflow: hidden;
}
.decisive-moment::before { content: ""; position: absolute; left: -1px; top: 0; width: 1px; height: 100%; background: linear-gradient(transparent, #aaa 28%, #333 72%, transparent); }
.moment-image { position: relative; }
.moment-image::after { content: ""; position: absolute; inset: 14px -14px -14px 14px; border: 1px solid #272727; z-index: -1; }
.moment-image img { display: block; width: 100%; max-height: 340px; object-fit: cover; filter: grayscale(1); box-shadow: 0 20px 50px #000; }
.moment-copy h2 { font-family: var(--serif); font-size: clamp(3.4rem, 5.8vw, 7rem); font-weight: 300; line-height: .88; letter-spacing: -.035em; margin: 0 0 42px; }
.moment-copy p { font-family: var(--serif); font-size: clamp(1.25rem, 1.8vw, 1.65rem); line-height: 1.6; color: #aaa; margin: 0 0 60px; }
.moment-number { font-size: 8px; letter-spacing: .32em; text-transform: uppercase; color: #555; }
.filters button span { font-size: 8px; opacity: .55; margin-left: 7px; }
@media (max-width: 800px) {
  .decisive-moment { scroll-margin-top: 58px; width: calc(100vw - 36px); min-height: 0; margin: 44px auto; grid-template-columns: 1fr; padding: 22px 20px 36px; gap: 34px; }
  .moment-copy { padding-right: 15px; }
  .moment-copy h2 { font-size: 16vw; }
  .moment-image img { max-height: 36vh; }
}
@media (max-width: 480px) { .filters { flex-wrap: wrap; } }
