/* Publication performance and responsive fixes. */

html {
  scroll-behavior: smooth;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

img,
video {
  max-width: 100%;
}

.archive-showcase,
.photo-evidence,
.video-evidence,
.future-section,
.chronology {
  content-visibility: auto;
  contain-intrinsic-size: auto 900px;
}

.media-card {
  contain: layout paint style;
}

.archive-thumb > img,
.video-preview-media {
  transform: translateZ(0);
  backface-visibility: hidden;
}

.viewer.viewer-video {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
  gap: clamp(22px, 3vw, 48px);
  align-items: center;
  padding: clamp(24px, 3vw, 48px);
}

.viewer.viewer-video .viewer-nav {
  display: none;
}

.viewer.viewer-video .viewer-content.video-view {
  width: 100%;
  height: auto;
  min-height: 0;
}

.viewer.viewer-video .video-player-shell,
.viewer.viewer-video video {
  width: 100%;
  min-width: 0;
}

.viewer.viewer-video video {
  max-height: calc(100dvh - 96px);
  aspect-ratio: 4 / 3;
  object-fit: contain;
}

.viewer.viewer-video .viewer-caption {
  width: 100%;
  min-width: 0;
  max-height: calc(100dvh - 96px);
  margin: 0;
  padding: 4px 14px 4px 0;
  overflow: auto;
  text-align: left;
  scrollbar-gutter: stable;
}

.viewer.viewer-video .viewer-caption h3,
.viewer.viewer-video .viewer-caption p {
  max-width: 100%;
  text-align: left;
  text-align-last: auto;
  overflow-wrap: anywhere;
}

.viewer.viewer-video .viewer-caption h3 {
  font-size: clamp(16px, 1.15vw, 21px);
  line-height: 1.42;
}

.viewer.viewer-video .viewer-caption p {
  font-size: clamp(13px, 0.9vw, 15px);
  line-height: 1.55;
}

.video-loading,
.video-error {
  width: max-content;
  max-width: min(560px, calc(100% - 32px));
}

@media (max-width: 1100px), (max-aspect-ratio: 5 / 4) {
  .viewer.viewer-video {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: start;
    gap: 18px;
    padding: 58px clamp(14px, 4vw, 34px) 24px;
    overflow-y: auto;
  }

  .viewer.viewer-video .viewer-content.video-view {
    min-height: 0;
  }

  .viewer.viewer-video video {
    max-height: min(64dvh, 720px);
  }

  .viewer.viewer-video .viewer-caption {
    max-width: 900px;
    max-height: none;
    margin: 0 auto;
    padding: 0 4px 24px;
    overflow: visible;
  }
}

@media (max-width: 700px) {
  .viewer.viewer-video {
    padding: 54px 10px 18px;
    gap: 14px;
  }

  .viewer.viewer-video video {
    max-height: 52dvh;
  }

  .viewer.viewer-video .viewer-caption {
    padding: 0 10px 20px;
  }

  .viewer.viewer-video .viewer-caption h3 {
    font-size: 17px;
    line-height: 1.4;
  }

  .viewer.viewer-video .viewer-caption p {
    font-size: 13px;
    line-height: 1.5;
  }
}

@media (max-width: 1024px), (hover: none), (pointer: coarse) {
  body,
  .inner-page,
  .section-intro,
  .archive-page main {
    background-attachment: scroll !important;
  }

  .media-card:hover,
  .archive-card:hover,
  .evidence-card:hover,
  .video-card:hover {
    transform: none;
    filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media (min-width: 2200px) {
  .archive-grid,
  .evidence-grid,
  .video-grid {
    max-width: 1680px;
  }

  .section-menu,
  .section-intro-inner,
  .media-section-heading {
    max-width: 1680px;
  }
}