/* Шаблон camp (летний лагерь, поездка в ЮАР) - только отличия этих двух
   страниц от программ. Сами блоки (pg-hero, pg-kak, pg-rezultat,
   pg-raspisanie, pg-faq, pg-drugie) - общие чанки и общие файлы стилей,
   здесь их не трогаем.

   Отличия, замеренные дампом макета (лето-десктоп.json/юар-десктоп.json,
   фреймы "Первый экран" и "Результат" обеих страниц - совпадают у лагеря
   и у ЮАР):

   - фото первого экрана и фото блока "результат" у лагерей/поездок 620,
     а не 660. Текст рядом считает свою ширину сам (flex: 1 1 auto внутри
     строки шириной var(--page-w) в pg-hero.css/pg-rezultat.css), поэтому
     отдельно его переопределять не нужно - 1440 - 620 = 820 против
     1440 - 660 = 780 у программ получается без дополнительного правила;

   - высота секции "Первый экран" у лагерей/поездок 700, а не 720;
     высота секции "Результат" - 680, а не 700. У программ обе секции
     выше ровно на разницу высоты фото (720 и 700 там), у лагерей/поездок
     фото 620 того же соотношения сторон, что и 660 у программ, поэтому
     высота меньше на ту же пропорцию - это геометрия макета, а не повод
     переопределять пропорции самому.

   Исключение - только для компьютера: pg-hero.css и pg-rezultat.css на
   телефоне (≤860) уже кладут фото на всю ширину (width: 100%), и там
   число 660/620 ни на что не влияет. Без @media (min-width: 861px) это
   правило перебило бы мобильную раскладку, как и у page-doshkolniki в
   pg-hero.css (см. docs/stranicy.md, раздел "Грабли этапа"). */

@media (min-width: 861px) {
  body.st-camp .pg-hero__photo {
    flex: 0 0 620px;
    width: 620px;
    height: 700px;   /* мерки: "Первый экран" лето/юар 700, а не 720 у программ */
  }

  body.st-camp .pg-hero__row {
    height: 700px;
  }

  body.st-camp .pg-rezultat__photo {
    width: 620px;
  }

  body.st-camp .pg-rezultat__row {
    height: 680px;   /* мерки: "Результат" лето/юар 680, а не 700 у программ */
  }
}

/* Заголовок первого экрана летнего лагеря - отдельное исключение одной
   страницы, не всего шаблона camp: в макете у "Летний языковой лагерь в
   Омске" (строка короче) кегль крупнее стандартного, у "Зимняя поездка в
   языковой лагерь в ЮАР" (строка длиннее) - обычный 42/27, как у
   программ. Замерено дампом (лето-десктоп lbNZy/DIS42: fontSize 44,
   лето-мобильная wL6JU/cEQO8: fontSize 28; высота строки - та же метрика
   1.14, что и у стандартного pg-hero__h1 в pg-hero.css) и подтверждено
   сверкой: без этого правила первая строка заголовка была 517px вместо
   544px в эталоне (517/544 = 0,95 ≈ 42/44). */
@media (min-width: 861px) {
  body.page-letniy-lager .pg-hero__h1 {
    font-size: 44px;
    line-height: 50px;   /* 44 x 1.14 */
  }
}

@media (max-width: 860px) {
  body.page-letniy-lager .pg-hero__h1 {
    font-size: 28px;
    line-height: 32px;   /* 28 x 1.14 */
  }
}

/* "Расписание" в общем pg-raspisanie.css белое - так в макете у страницы
   носителей языка, единственной страницы программ с этим блоком. На
   летнем лагере и поездке в ЮАР тот же блок стоит на бумажном фоне
   (дампы фреймов m5gTB и oG9pE, fill #F7F4EE): там выше него белая
   секция результата, и чередование идёт наоборот. */
body.page-letniy-lager .pg-raspisanie,
body.page-yuar .pg-raspisanie {
  background: var(--paper);
}