/* ==========================================================================
   Главная, вариант 2 (index-v2.html): компактнее основной.

   Подключается только на index-v2.html, после style.css, и действует только
   внутри <main class="home-v2"> — шапка, подвал и остальные страницы его не
   видят. Разметка блоков та же, что у index.html.

   Что меняется относительно основной главной:
   - баннер ниже примерно на пятую часть: меньше поля и кегль, заголовок
     встаёт в одну строку; минимальная высота текста оставляет фону с гербом
     место, чтобы корону не срезало сверху;
   - заголовки блоков после баннера мельче (40 → 30 на ПК);
   - поля карточек, отступы между блоками, иконки плиток и стрелки — плотнее
     (у плиток разделов при этом отступы как в основной главной);
   - карта Совета КСО не выше 760px (в основной — почти на всё окно);
   - отступ над баннером равен отступу под ним (до первых карточек) — на всех
     ширинах, включая телефон: 60 / 48 / 40 / 20.

   Не меняется:
   - телефон (до 600): там главная и так собрана компактно — кроме отступа
     над баннером, см. выше;
   - версия для слабовидящих (html.a11y-mode): крупный кегль там нужен
     намеренно, поэтому все правила начинаются с html:not(.a11y-mode).

   Вес селекторов. Кегль в style.css задан блоком «кегль на 2 меньше» с весом
   html:not(.a11y-mode) main#main-content:not(.news-page) .x. Здесь вес такой
   же (.home-v2 вместо :not(.news-page)), а файл подключён позже — поэтому
   эти значения побеждают. Каждая полоса ширины вынесена в свой медиазапрос,
   чтобы не протекать в соседнюю, в том числе в телефонную раскладку.
   ========================================================================== */

/* ---------- ПК: шире 1100 ---------- */

@media (min-width: 1101px) {
  /* Баннер. Отступ сверху — как снизу, у .news-grid (60). */
  html:not(.a11y-mode) main#main-content.home-v2 .hero { padding-top: 60px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__card { min-height: 0; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__text { min-height: 440px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__text { padding: 44px 60px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__eyebrow { font-size: 15px; letter-spacing: 3px; margin-bottom: 8px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__title { font-size: 40px; margin-bottom: 10px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__lead { font-size: 18px; max-width: 560px; margin-bottom: 22px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__stats { gap: 16px; }
  html:not(.a11y-mode) main#main-content.home-v2 .stat { width: 220px; padding: 14px 16px; gap: 8px; }
  html:not(.a11y-mode) main#main-content.home-v2 .stat strong { font-size: 30px; }
  html:not(.a11y-mode) main#main-content.home-v2 .stat span { font-size: 14px; }

  /* Новости и мероприятия */
  html:not(.a11y-mode) main#main-content.home-v2 .news-grid { padding: 60px 0 50px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card { padding: 32px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card h3 { font-size: 28px; margin-bottom: 14px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card time { font-size: 17px; margin-bottom: 12px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card p { font-size: 18px; line-height: 1.55; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card__footer { padding-top: 32px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card__footer > a { font-size: 18px; }
  html:not(.a11y-mode) main#main-content.home-v2 .carousel-controls { gap: 10px; }
  html:not(.a11y-mode) main#main-content.home-v2 .carousel-controls button { width: 48px; height: 48px; }

  /* Заголовки разделов: «Совет КСО», «Тематические ссылки» */
  html:not(.a11y-mode) main#main-content.home-v2 .section-title { font-size: 30px; }

  /* Карта Совета КСО */
  html:not(.a11y-mode) main#main-content.home-v2 .map-card { padding: 32px; }
  html:not(.a11y-mode) main#main-content.home-v2 .map-card__title { margin-bottom: 28px; }
  html:not(.a11y-mode) main#main-content.home-v2 .map-hint,
  html:not(.a11y-mode) main#main-content.home-v2 .map-details { padding: 28px; }
  html:not(.a11y-mode) main#main-content.home-v2 .map-hint { font-size: 17px; }
  html:not(.a11y-mode) main#main-content.home-v2 .map-image svg { max-height: max(320px, min(760px, calc(100vh - 200px))); }

  /* Плитки разделов. Отступы — как в основной главной: между плитками 40,
     поля 40, от иконки до подписи 60 (задаёт style.css, здесь не
     переопределяются ни на одной ширине). Компактнее только иконка,
     стрелка и кегль подписи. */
  html:not(.a11y-mode) main#main-content.home-v2 .tiles { padding: 60px 0 20px; }
  html:not(.a11y-mode) main#main-content.home-v2 .tile__icon { width: 64px; height: 64px; }
  html:not(.a11y-mode) main#main-content.home-v2 .tile p { font-size: 18px; }
  html:not(.a11y-mode) main#main-content.home-v2 .tile__arrow { width: 48px; height: 48px; }

  /* Тематические ссылки */
  html:not(.a11y-mode) main#main-content.home-v2 .links-section { padding: 50px 0 60px; }
  html:not(.a11y-mode) main#main-content.home-v2 .links-section__head { margin-bottom: 28px; }
  html:not(.a11y-mode) main#main-content.home-v2 .eyebrow { font-size: 15px; letter-spacing: 3px; margin-bottom: 14px; }
  html:not(.a11y-mode) main#main-content.home-v2 .links-section__head .rule { margin-bottom: 14px; }
  html:not(.a11y-mode) main#main-content.home-v2 .links-grid { gap: 24px; }
  html:not(.a11y-mode) main#main-content.home-v2 .link-card { padding: 28px; gap: 14px; }
  html:not(.a11y-mode) main#main-content.home-v2 .link-card__url,
  html:not(.a11y-mode) main#main-content.home-v2 .link-card p { font-size: 18px; }
  html:not(.a11y-mode) main#main-content.home-v2 .link-card p { line-height: 1.5; }
}

/* ---------- Планшет: 801–1100 ---------- */

@media (min-width: 801px) and (max-width: 1100px) {
  html:not(.a11y-mode) main#main-content.home-v2 .hero { padding-top: 48px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__card { min-height: 0; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__text { min-height: 400px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__text { padding: 36px 40px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__eyebrow { font-size: 14px; margin-bottom: 8px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__title { font-size: 32px; margin-bottom: 10px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__lead { font-size: 16px; margin-bottom: 18px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__stats { gap: 14px; }
  html:not(.a11y-mode) main#main-content.home-v2 .stat { width: 200px; padding: 12px 14px; gap: 6px; }
  html:not(.a11y-mode) main#main-content.home-v2 .stat strong { font-size: 26px; }
  html:not(.a11y-mode) main#main-content.home-v2 .stat span { font-size: 13px; }

  html:not(.a11y-mode) main#main-content.home-v2 .news-grid { padding: 48px 0 40px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card { padding: 28px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card h3 { font-size: 24px; margin-bottom: 12px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card time { margin-bottom: 12px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card__footer { padding-top: 28px; }
  html:not(.a11y-mode) main#main-content.home-v2 .carousel-controls { gap: 10px; }
  html:not(.a11y-mode) main#main-content.home-v2 .carousel-controls button { width: 44px; height: 44px; }

  html:not(.a11y-mode) main#main-content.home-v2 .section-title { font-size: 26px; }

  html:not(.a11y-mode) main#main-content.home-v2 .map-card { padding: 28px; }
  html:not(.a11y-mode) main#main-content.home-v2 .map-card__title { margin-bottom: 24px; }
  html:not(.a11y-mode) main#main-content.home-v2 .map-hint,
  html:not(.a11y-mode) main#main-content.home-v2 .map-details { padding: 24px; }
  html:not(.a11y-mode) main#main-content.home-v2 .map-image svg { max-height: max(320px, min(640px, calc(100vh - 200px))); }

  html:not(.a11y-mode) main#main-content.home-v2 .tiles { padding: 48px 0 16px; }
  html:not(.a11y-mode) main#main-content.home-v2 .tile__icon { width: 56px; height: 56px; }
  html:not(.a11y-mode) main#main-content.home-v2 .tile__arrow { width: 44px; height: 44px; }

  html:not(.a11y-mode) main#main-content.home-v2 .links-section { padding: 40px 0 48px; }
  html:not(.a11y-mode) main#main-content.home-v2 .links-section__head { margin-bottom: 24px; }
  html:not(.a11y-mode) main#main-content.home-v2 .eyebrow { font-size: 14px; letter-spacing: 3px; margin-bottom: 12px; }
  html:not(.a11y-mode) main#main-content.home-v2 .links-section__head .rule { margin-bottom: 12px; }
  html:not(.a11y-mode) main#main-content.home-v2 .links-grid { gap: 20px; }
  html:not(.a11y-mode) main#main-content.home-v2 .link-card { padding: 24px; gap: 12px; }
}

/* ---------- Узкий планшет: 601–800 ---------- */

@media (min-width: 601px) and (max-width: 800px) {
  /* В основной главной цифры здесь встают столбиком, по одной на всю ширину,
     и баннер вырастает до ~700px. Здесь они остаются в один ряд из трёх. */
  html:not(.a11y-mode) main#main-content.home-v2 .hero { padding-top: 40px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__card { min-height: 0; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__text { min-height: 360px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__text { padding: 28px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__eyebrow { font-size: 13px; letter-spacing: 2.6px; margin-bottom: 8px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__title { font-size: 28px; margin-bottom: 10px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__lead { font-size: 15px; margin-bottom: 18px; }
  html:not(.a11y-mode) main#main-content.home-v2 .hero__stats { flex-wrap: nowrap; gap: 12px; }
  html:not(.a11y-mode) main#main-content.home-v2 .stat { width: auto; flex: 1 1 0; min-width: 0; padding: 12px; gap: 6px; }
  html:not(.a11y-mode) main#main-content.home-v2 .stat strong { font-size: 24px; }
  html:not(.a11y-mode) main#main-content.home-v2 .stat span { font-size: 13px; }

  html:not(.a11y-mode) main#main-content.home-v2 .news-grid { padding: 40px 0 32px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card { padding: 24px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card h3 { font-size: 20px; margin-bottom: 12px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card time { margin-bottom: 10px; }
  html:not(.a11y-mode) main#main-content.home-v2 .news-card__footer { padding-top: 24px; }
  html:not(.a11y-mode) main#main-content.home-v2 .carousel-controls { gap: 10px; }
  html:not(.a11y-mode) main#main-content.home-v2 .carousel-controls button { width: 44px; height: 44px; }

  html:not(.a11y-mode) main#main-content.home-v2 .section-title { font-size: 22px; }

  html:not(.a11y-mode) main#main-content.home-v2 .map-card { padding: 24px; }
  html:not(.a11y-mode) main#main-content.home-v2 .map-card__title { margin-bottom: 20px; }
  html:not(.a11y-mode) main#main-content.home-v2 .map-hint,
  html:not(.a11y-mode) main#main-content.home-v2 .map-details { padding: 20px; }

  html:not(.a11y-mode) main#main-content.home-v2 .tiles { padding: 40px 0 16px; }
  html:not(.a11y-mode) main#main-content.home-v2 .tile__icon { width: 52px; height: 52px; }
  html:not(.a11y-mode) main#main-content.home-v2 .tile__arrow { width: 40px; height: 40px; }

  html:not(.a11y-mode) main#main-content.home-v2 .links-section { padding: 32px 0 40px; }
  html:not(.a11y-mode) main#main-content.home-v2 .links-section__head { margin-bottom: 20px; }
  html:not(.a11y-mode) main#main-content.home-v2 .eyebrow { font-size: 13px; letter-spacing: 2.6px; margin-bottom: 10px; }
  html:not(.a11y-mode) main#main-content.home-v2 .links-section__head .rule { margin-bottom: 10px; }
  html:not(.a11y-mode) main#main-content.home-v2 .links-grid { gap: 16px; }
  html:not(.a11y-mode) main#main-content.home-v2 .link-card { padding: 20px; gap: 10px; }
}

/* ---------- Телефон: до 600 ---------- */

/* Раскладку телефона вариант не трогает, кроме одного: отступ над баннером
   выровнен по отступу под ним (у .news-grid на телефоне 20, у баннера было 10). */
@media (max-width: 600px) {
  html:not(.a11y-mode) main#main-content.home-v2 .hero { padding-top: 20px; }
}