/* Four archive portraits frame the masthead without covering its typography. */
.cinematic-hero .collage-portrait {
  display: block;
  width: clamp(145px, 16vw, 225px);
  height: clamp(180px, 20vw, 270px);
  z-index: 4;
  filter: grayscale(1) contrast(1.12);
  border: 4px solid #ede9df;
  background: #0e0e10;
}
.cinematic-hero .collage-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; }
.cinematic-hero .collage-portrait::after {
  content: attr(data-person);
  position: absolute; inset-inline: 0; bottom: 0;
  padding: 8px 10px; background: #0e0e10e8; color: #ede9df;
  font: 700 25px/1 Karantina, sans-serif; text-align: center;
}
.cinematic-hero .portrait-barak { inset: auto 2% 45px auto; transform: rotate(-7deg); }
.cinematic-hero .portrait-ronen { inset: 13px auto auto 2%; transform: rotate(-8deg); }
.cinematic-hero .portrait-eisenkot { inset: 9px 3% auto auto; transform: rotate(7deg); }
.cinematic-hero .portrait-mag { inset: auto auto 45px 3%; transform: rotate(6deg); }
.cinematic-hero .portrait-mag img { object-position: 58% 22%; }
.cinematic-hero .archive-stamp { left: 23%; top: auto; bottom: 38px; font-size: 13px; }
.cinematic-hero .archive-stamp.second { right: 23%; left: auto; top: 32px; bottom: auto; font-size: 12px; }
.cinematic-hero .cinematic-title { width: min(66%, 900px); }
.cinematic-hero .cinematic-title h1 { font-size: clamp(135px, 19vw, 270px); }

.uploaded-file-feature {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  align-items: center; gap: clamp(28px, 6vw, 86px);
  margin-block: 60px 80px; padding-block: 40px;
  border-block: 1px solid #c91b15;
}
.uploaded-file-feature h2 { font-size: clamp(50px, 5.5vw, 78px); line-height: 1; margin: 18px 0; }
.uploaded-file-feature h2 span { color: #c91b15; }
.uploaded-file-feature p:not(.eyebrow) { font-size: 17px; line-height: 1.85; color: var(--ink-muted, #aba99e); }
.uploaded-file-feature figure { margin: 0; }
.uploaded-file-feature figure a { display: block; background: #ede9df; padding: 12px; }
.uploaded-file-feature img { display: block; width: 100%; height: auto; }
.uploaded-file-feature figcaption { margin-top: 12px; font-size: 12px; color: var(--ink-muted, #aba99e); }
.uploaded-file-feature .editorial-collage a { padding: 0; background: #0e0e10; outline-offset: 6px; }
.uploaded-file-feature .editorial-collage img { aspect-ratio: 3 / 2; object-fit: cover; }
.uploaded-file-feature .editorial-collage figcaption a { display: inline; color: inherit; text-underline-offset: 3px; }
.uploaded-file-actions { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; margin-top: 28px; }
.uploaded-file-actions .solid-link { padding: 15px 22px; background: #c91b15; color: #ede9df; }
.uploaded-file-actions a { font-size: 15px; font-weight: 700; }
.uploaded-file-summary { border-inline-start: 3px solid #c91b15; padding: 18px 24px; margin-block: 30px; background: #8881; }
.uploaded-file-summary h2 { margin-top: 0; }
.uploaded-document-page .uploaded-file-feature { margin-block: 0 42px; }
.uploaded-document-page .uploaded-file-feature h2 { font-size: clamp(40px, 4vw, 62px); }
.media-register-page { display: inline-block; min-width: 100px; padding: 7px 0; font-weight: 700; text-underline-offset: 5px; }
.media-register-page:focus-visible { outline: 2px solid #c91b15; outline-offset: 4px; }
@media (max-width: 750px) {
  .cinematic-hero .collage-portrait { width: 130px; height: 164px; }
  .cinematic-hero .cinematic-title { width: 90%; padding-inline: 22px; }
  .cinematic-hero .cinematic-title h1 { font-size: clamp(115px, 24vw, 180px); }
  .cinematic-hero .portrait-barak, .cinematic-hero .portrait-mag { bottom: 48px; }
  .cinematic-hero .archive-stamp, .cinematic-hero .archive-stamp.second { display: none; }
  .uploaded-file-feature { grid-template-columns: 1fr; gap: 26px; margin-block: 38px; padding-block: 28px; }
  .uploaded-file-feature figure { max-width: 550px; width: 100%; }
}
@media (max-width: 500px) {
  .cinematic-hero .collage-portrait { width: 106px; height: 133px; border-width: 3px; }
  .cinematic-hero .collage-portrait::after { font-size: 18px; padding: 5px 7px; }
  .cinematic-hero .portrait-eisenkot { right: 5%; top: 10px; }
  .cinematic-hero .portrait-ronen { left: 5%; top: 13px; }
  .cinematic-hero .portrait-barak { right: 4%; bottom: 35px; }
  .cinematic-hero .portrait-mag { left: 4%; bottom: 35px; }
  .cinematic-hero .cinematic-title { width: 100%; padding-inline: 20px; }
  .cinematic-hero .cinematic-title h1 { font-size: clamp(105px, 29vw, 140px); }
  .cinematic-hero .cinematic-kicker { font-size: 29px; }
  .uploaded-file-feature h2 { font-size: 52px; }
  .uploaded-file-feature p:not(.eyebrow) { font-size: 16px; }
  .uploaded-file-actions { gap: 18px; }
}
