/* OPS-339 — пропорции секций «фото слева + текстовая панель» на широких экранах.
   Файл подключается ПОСЛЕ dist/style.css; сам dist не редактируется.
   Затрагивает только две секции главной, которые должны оставаться близнецами:
   .production-section (зелёная) и .portal-banner-section (баннер портала).
   До 1600px и на мобильной раскладке ничего не меняется. */

@media (min-width: 1600px) {

  /* Строка секции. height, а не min-height: без определённой высоты картинка
     с h-full откатывается к своим натуральным пропорциям и сама задаёт высоту
     секции — а у двух секций снимки разного формата, и близнецы расходятся.
     22.22vw = треть ширины (колонка фото) x 2/3 (формат снимка 3:2);
     560px — пол, чтобы текст зелёной секции (528px вместе с отступами) не подрезался. */
  .production-section > div,
  .portal-banner-section > div {
    height: max(560px, 22.22vw);
  }

  /* Колонка с фото — треть ширины секции вместо фиксированных 500px. */
  .production-section > div > div:first-child,
  .portal-banner-section > div > div:first-child {
    flex: 0 0 33.3333%;
    max-width: 33.3333%;
    align-self: stretch;
    overflow: hidden;
  }

  /* Снимок заполняет колонку целиком, пропорции сохраняются (object-cover). */
  .production-section > div > div:first-child img,
  .portal-banner-section > div > div:first-child img {
    height: 100%;
    width: 100%;
    max-height: none;
    object-fit: cover;
  }

  /* Панель — оставшиеся две трети; отступ слева растёт вместе с экраном,
     чтобы текст не липнул к фото на очень широких мониторах. */
  .production-section > div > div:last-child,
  .portal-banner-section > div > div:last-child {
    padding-left: max(64px, 4vw);
  }
}