/* RAS PRODUCTIONS 3.3.9 - Tablet responsive QA, without desktop/mobile redesign.
   Tablet portrait must not inherit the 2-column editorial desktop layout.
   All validated images, copy, video sources and mobile corrections are unchanged. */
@media (min-width: 651px) and (max-width: 1100px) {
  /* Project sheets, credits and film director biography: image followed by readable text. */
  .editorial-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 25px;
  }
  .editorial-grid > .figure,
  .editorial-grid > .editorial-long,
  .editorial-grid > article,
  .editorial-grid > section {
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }
  .editorial-grid > .figure { max-width: 620px; }
  .editorial-grid > .figure img { width: 100%; height: auto; object-fit: contain; }
  .editorial-grid .editorial-long,
  .editorial-grid .editorial-long p { overflow-wrap: break-word; }

  /* Portrait and biography: avoid a narrow column for paragraphs. */
  .ras-director-profile {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }
  .ras-director-portrait { max-width: 205px; }
  .ras-director-copy { min-width: 0; width: 100%; }
  .ras-director-copy p { max-width: 100%; }

  /* Company/intro blocks are read in document order, not cramped side by side. */
  .split, .split.image-right {
    grid-template-columns: minmax(0, 1fr);
    gap: 30px;
  }

  /* Four/two cramped disc cards => two useful cards per row. */
  .disc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .disc-card, .catalog-card, .catalog-card .catalog-text, .disc-card .disc-details {
    min-width: 0;
  }
  .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .catalog-card .ras-video,
  .disc-card .ras-video,
  .pilot-section .ras-video { min-width: 0; width: 100%; max-width: 100%; }
  .catalog-card .ras-video video,
  .disc-card .ras-video video,
  .pilot-section .ras-video video {
    width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain;
  }

  .film-row { grid-template-columns: minmax(145px, 29%) minmax(0, 1fr); gap: 19px; }
  .film-row > *, .film-row > div { min-width: 0; }
  .film-row > a img { width: 100%; max-width: 100%; }
  .contact-layout { grid-template-columns: minmax(0, 1fr); }
  .contact-layout > * { min-width: 0; }
  .page-top .wrap, .wrap { max-width: 100%; }
}

/* Portrait-tablet cards should not leave a third project orphaned. */
@media (min-width: 651px) and (max-width: 1100px) and (orientation: portrait) {
  .projects-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .projects-grid .project-card { min-width: 0; }
  .projects-grid .project-card .image-frame { aspect-ratio: 16 / 9; }
  .projects-grid .project-card p { min-height: 0; font-size: 14px; }
}

/* Narrower portrait tablets: full-width television/video cards and balanced footer. */
@media (min-width: 651px) and (max-width: 850px) {
  .catalog-grid { grid-template-columns: minmax(0, 1fr); }
  .catalog-grid .catalog-card { width: 100%; }
  .catalog-grid .catalog-card .catalog-art { aspect-ratio: 16 / 9; max-height: 390px; }
  .catalog-grid .catalog-card .catalog-art img { object-fit: contain; }
  .catalog-card .catalog-text { padding: 20px; }
  .catalog-card .catalog-text p { font-size: 14px; line-height: 1.7; }
  .footer-main { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-main > div:first-child { grid-column: 1 / -1; }
}

/* Also prevent min-content of a large embedded LMIVC image from stretching
   the existing desktop editorial grid beyond its container (desktop fix only). */
@media (min-width: 1101px) {
  .editorial-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .editorial-grid > * { min-width: 0; }
  .editorial-grid .mini-feature { min-width: 0; max-width: 100%; }
  .editorial-grid .mini-feature img { max-width: 100%; height: auto; }
}
