/* =========================================================
   Главная страница
   Макет: Figma → Final → «Главная» (1920 / 1200 / 640 / 320) и «Прелоудер».
   На десктопе размеры — в единицах макета 1920: N · --u (--u = 100vw / 1920, объявлен в style.css),
   колонки — по сетке ._container (12 × 30 × 30). Линия у первой колонки —
   по правому краю 3-й колонки (472.5 на 1920), как ячейка логотипа в шапке.
   Подпись и заголовок секции, партнёры, консультация и подвал — общие, в style.css.
   ========================================================= */

:root {
  --line: var(--c-line);
  --dark-line: var(--c-menu-line);
}

.page-home { background: #fff; }

/* Позиция линии по краю 3-й колонки (для полноширинных блоков) */
.about,
.fleet,
.hero,
.reviews__body,
.site-footer__top {
  --unit: calc((100% - 2 * var(--margin) + var(--gutter)) / var(--cols));
  --col3: calc(var(--margin) + 3 * var(--unit) - var(--gutter));
}

/* =========================================================
   Прелоудер (1 раз за сессию — см. скрипт в <head> и js/home.js)
   ========================================================= */

.preloader { display: none; }

.intro .preloader {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f4f4f4;
  transition: transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
  animation: preloader-safety 0.9s cubic-bezier(0.76, 0, 0.24, 1) 9s forwards; /* если скрипт не сработал */
}
.intro.is-revealed .preloader { transform: translateY(-100%); }

@keyframes preloader-safety {
  to { transform: translateY(-100%); visibility: hidden; }
}

.preloader__lines {
  width: 68vw;
  max-width: 1300px;
  height: auto;
  --p: 0;
  filter: blur(calc((1 - var(--p)) * 14px));
  opacity: calc(0.2 + 0.8 * var(--p));
  transition: filter 0.3s linear, opacity 0.3s linear;
}

.preloader__count {
  position: absolute;
  right: 8.3vw;
  bottom: 9.4vh;
  font-family: var(--font-ui);
  font-size: max(28px, calc(48 * var(--u)));
  line-height: 0.9;
  letter-spacing: -0.02em;
  color: #0d162c;
  font-variant-numeric: tabular-nums;
}

.intro:not(.is-revealed) body { overflow: hidden; }

/* =========================================================
   Первый экран
   ========================================================= */

/* Во всю высоту окна под шапкой, но не ниже минимума — чтобы название и блок снизу не сходились */
.hero {
  position: relative;
  height: max(var(--hero-min), var(--screen));
  overflow: hidden;
  background: var(--c-dark);
  color: #fff;
  isolation: isolate;
  container-type: inline-size; /* 100cqw — ширина экрана без полосы прокрутки: по ней считается размер надписи */
}

/* Вертикальных линий сетки на первом экране нет (во фрейме были по краю 3-й и 9-й колонок) — решение пользователя 13.10 */

.hero__media { position: absolute; inset: 0; }

/* Видео и его последний кадр — 2200 × 1200 со сдвигом −140 / −138, как на сайте.
   Если экран выше, кадр вытягивается вниз до конца блока (cover) */
.hero__video,
.hero__end {
  position: absolute;
  left: calc(-140 * var(--u));
  top: calc(-138 * var(--u));
  width: calc(2200 * var(--u));
  height: max(calc(1200 * var(--u)), calc(100% + 138 * var(--u)));
  object-fit: cover;
  max-width: none;
}
.hero__video { display: none; }
.hero__end { display: block; }
.intro .hero__video { display: block; }
.intro .hero__end { display: none; }
.hero.is-video-failed .hero__video { display: none; }
.hero.is-video-failed .hero__end { display: block; }

/* Статичный кран — для планшета и мобильного */
.hero__side,
.hero__crane { display: none; }

/* Надпись — ровно по сетке: края букв на левом и правом поле страницы на любой ширине.
   Замер Inter 900 с межбуквенным −0.05em: буквы «БИСЕНГАЛИ КРАН» шириной 8.665 кегля,
   у «Б» пустое место слева 0.045 кегля — на него надпись сдвинута влево */
.hero__title {
  position: absolute;
  z-index: 2;
  left: calc(var(--margin) - 0.045em);
  top: clamp(-13.5px, calc(-13.5px + 29.5 * var(--k)), 16px); /* 1200 → 1920 */
  margin: 0;
  font-family: var(--font-text);
  font-weight: 900;
  font-size: calc((100cqw - 2 * var(--margin)) / 8.665);
  line-height: 1;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Переносы в подзаголовке и тексте заданы в разметке (<br> и неразрывные пробелы) — ширину не ограничиваем.
   На десктопе «производителей» — отдельной строкой: в строку с «от мировых» слово заходит на стрелу крана */
.hero__subtitle {
  position: absolute;
  z-index: 2;
  left: var(--margin);
  top: clamp(133px, calc(133px + 66 * var(--k)), 199px);
}

.hero__bottom {
  position: absolute;
  z-index: 2;
  left: var(--margin);
  bottom: calc(66 * var(--u));
}

.hero__text {
  font-family: var(--font-os);
  font-size: var(--fs-lead);
  line-height: 1.33;
}

.hero__btn { margin-top: calc(38 * var(--u)); }

/* Шаги вступления: шапка и тексты появляются после прелоудера */
.hero__title,
.hero__subtitle,
.hero__bottom {
  transition: opacity 0.9s var(--ease), transform 0.9s var(--ease);
}
.intro:not(.is-titled) .header { transform: translateY(-100%); }
.intro:not(.is-titled) .hero__title {
  opacity: 0;
  transform: translateY(calc(40 * var(--u)));
}
.intro:not(.is-final) .hero__subtitle,
.intro:not(.is-final) .hero__bottom {
  opacity: 0;
  transform: translateY(20px);
}
.intro:not(.is-final) .hero__btn { pointer-events: none; }

/* =========================================================
   О компании
   ========================================================= */

.about {
  position: relative;
  padding-top: var(--gap-section);
}
.about::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--col3);
  width: 1px;
  background: var(--line);
}
.about::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: var(--gap-section);
  height: 1px;
  background: var(--line);
}

.about__label {
  grid-column: 1 / span 3;
  margin-top: var(--gap-title);
}

.about__body {
  grid-column: 4 / -1;
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  column-gap: var(--gutter);
  padding: var(--gap-title) 0 calc(var(--gap-section) / 2);
}

/* Ширины текстов на десктопе — в em, как на живом сайте: блок растёт вместе с шрифтом, переносы одни на 1200 и 1920 */
.about__title {
  grid-column: 1 / -1;
  max-width: 21em; /* 1350 при 64 */
}

.about__texts { display: contents; }
.about__texts p {
  grid-column: span 3;
  max-width: 22.5em; /* 406 при 18, 319 при 14 */
  margin-top: var(--gap-title);
}

.about__stats {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  column-gap: var(--gutter);
  margin: calc(60 * var(--u)) 0 0;
}
.stat { grid-column: span 3; }
.stat__value {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: var(--fs-num);
  line-height: 1;
  letter-spacing: -0.04em; /* как на живом сайте: −7px при 160 */
}
.stat__caption {
  max-width: 17em;
  margin: calc(15 * var(--u)) 0 0;
  font-family: var(--font-os);
  font-size: var(--fs-sm);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--c-text);
}

.about__btn {
  grid-column: 1 / -1;
  justify-self: start;
  margin-top: calc(30 * var(--u));
}

/* =========================================================
   Парк техники (слайдер по 3 машины)
   ========================================================= */

.fleet {
  position: relative;
  border-top: 1px solid var(--line);
  padding-bottom: calc(26 * var(--u));
  overflow: hidden;
}
.fleet::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--col3);
  width: 1px;
  background: var(--line);
}

.fleet__diagonal {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.fleet__diagonal line { stroke: var(--line); stroke-width: 1; }

.fleet__label {
  grid-column: 1 / span 3;
  margin-top: var(--gap-section);
}

.fleet__head {
  grid-column: 4 / span 7;
  margin-top: var(--gap-section);
}

.fleet__title { max-width: 25em; } /* 1002 при 40 */

.fleet__text {
  max-width: 27.5em; /* 498 при 18 */
  margin-top: var(--gap-label);
}

.fleet__nav {
  grid-column: 11 / -1;
  justify-self: end;
  align-self: end;
  position: relative;
  z-index: 1;
}

.fleet__viewport {
  grid-column: 1 / -1;
  display: flex;
  margin-top: calc(35 * var(--u));
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  position: relative;
  z-index: 1;
}
.fleet__viewport::-webkit-scrollbar { display: none; }

.fleet__slide {
  flex: 0 0 100%;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--gutter);
  align-items: start;
  scroll-snap-align: start;
}

.fleet-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 16px;
  align-items: start;
}
.fleet-card--side:first-child { grid-column: 1 / span 3; padding-right: var(--gutter); }
.fleet-card--main { grid-column: 4 / span 6; }
.fleet-card--side:last-child { grid-column: 10 / span 3; }

.fleet-card__img {
  grid-column: 1 / -1;
  display: block;
  height: calc(442 * var(--u));
  overflow: hidden;
  background: #eef0f2;
}
.fleet-card--main .fleet-card__img { height: calc(706 * var(--u)); }
.fleet-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s var(--ease);
}
.fleet-card:hover .fleet-card__img img { transform: scale(1.04); }

.fleet-card__info { margin-top: calc(15 * var(--u)); }
.fleet-card__go { margin-top: calc(15 * var(--u)); }

.fleet-card__name a:hover { color: var(--c-text); }

.fleet-card__cap {
  margin-top: calc(10 * var(--u));
  font-size: var(--fs-body);
  line-height: 1;
  color: var(--c-text);
}

.fleet__btn {
  grid-column: 4 / -1;
  justify-self: start;
  margin-top: calc(45 * var(--u));
  position: relative;
  z-index: 1;
}

/* =========================================================
   Услуги — вступление
   ========================================================= */

.services-intro {
  position: relative;
  padding: var(--gap-section) var(--margin) var(--gap-title);
  border-top: 1px solid var(--line);
  text-align: center;
}
.services-intro::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: var(--line);
  z-index: -1;
}

.services-intro__title {
  max-width: calc(1523 * var(--u));
  margin: var(--gap-label) auto 0;
  background: #fff;
}

/* =========================================================
   Услуги — кран по скроллу (десктоп)
   ========================================================= */

.services {
  position: relative;
  height: calc(6602 * var(--u));
  background: var(--c-dark);
  color: #fff;
}

.services__stage {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}

.services__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.6s;
}
.services__video.is-ready { opacity: 1; }

.services__viewport {
  position: absolute;
  inset: 0;
}

.service { position: absolute; }
.service__img { display: none; }

.service--1 { top: calc(1608 * var(--u)); left: calc(188 * var(--u)); }
.service--2 { top: calc(2334 * var(--u)); left: calc(188 * var(--u)); }
.service--3 { top: calc(3100 * var(--u)); left: calc(188 * var(--u)); }
.service--4 { top: calc(5244 * var(--u)); left: calc(1133 * var(--u)); }
.service--5 { top: calc(5933 * var(--u)); left: calc(1133 * var(--u)); }

.service__title { max-width: calc(760 * var(--u)); }
.service--5 .service__title { max-width: calc(848 * var(--u)); }

.service__text {
  display: grid;
  gap: calc(12 * var(--u));
  max-width: calc(424 * var(--u));
  margin-top: var(--gap-title);
  color: var(--c-menu-text);
}

.service__btn { margin-top: calc(30 * var(--u)); }

.slider-controls { display: none; }

/* =========================================================
   Реализованные проекты
   ========================================================= */

.projects {
  position: relative;
  padding-top: var(--gap-section);
  row-gap: 0;
}

.projects__label { grid-column: 1 / span 3; }

.projects__title {
  grid-column: 4 / span 6;
  max-width: 19.7em; /* 788 при 40 */
}

.projects__btn {
  grid-column: 10 / -1;
  justify-self: end;
  align-self: start;
  margin-right: calc(12 * var(--u));
}

.projects__grid {
  grid-column: 1 / -1;
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: var(--gap-title) calc(-1 * var(--margin)) 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.projects__grid::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: var(--line);
}

.project { padding: calc(30 * var(--u)) var(--margin); }
.project:first-child { padding-right: calc(var(--margin) - 0px); }

.project__img {
  display: block;
  height: calc(558 * var(--u));
  overflow: hidden;
  background: #eef0f2;
}
.project__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s var(--ease);
}
.project:hover .project__img img { transform: scale(1.04); }

.project__head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 24px;
  margin-top: calc(15 * var(--u));
}

.project__title {
  max-width: calc(760 * var(--u));
  margin: calc(15 * var(--u)) 0 0;
}
.project__title a:hover { color: var(--c-text); }

.project__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px calc(15 * var(--u));
  margin: calc(30 * var(--u)) 0 0;
  padding: 0;
  list-style: none;
  font-size: var(--fs-body);
  line-height: 1;
  color: var(--c-text);
}

/* =========================================================
   Отзывы
   ========================================================= */

.reviews { padding-top: var(--gap-section); }

.reviews__title {
  padding-inline: calc(var(--margin) + 5 * var(--u));
  padding-bottom: var(--gap-title);
}

.reviews__body {
  position: relative;
  display: grid;
  grid-template-columns: var(--col3) minmax(0, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.reviews__aside {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: calc(30 * var(--u)) var(--margin);
  padding-left: calc(var(--margin) + 5 * var(--u));
  border-right: 1px solid var(--line);
}

.reviews__viewport {
  display: flex;
  min-width: 0;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.reviews__viewport::-webkit-scrollbar { display: none; }

.review {
  flex: 0 0 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: calc(430 * var(--u));
  margin: 0;
  padding: calc(30 * var(--u)) var(--margin) calc(30 * var(--u)) var(--gutter);
  scroll-snap-align: start;
}

.review__quote {
  max-width: calc(1025 * var(--u));
  margin: 0;
}

.review__footer {
  display: grid;
  grid-template-columns: calc(770 * var(--u)) auto;
  align-items: end;
  margin-top: 30px;
  font-size: var(--fs-body);
  color: var(--c-text);
}

.review__pdf {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-self: start;
  gap: calc(5 * var(--u));
  line-height: 1.2;
  letter-spacing: -0.02em;
  transition: color 0.2s;
}
.review__pdf svg { width: calc(30 * var(--u)); min-width: 22px; height: auto; }
.review__pdf:hover { color: var(--c-dark); }

.review__author {
  display: inline-flex;
  align-items: center;
  gap: calc(8 * var(--u));
  line-height: 0.95;
}
.review__author img {
  width: auto;
  height: calc(36 * var(--u));
  min-height: 24px;
}

.reviews__dots { display: none; }

/* =========================================================
   Последние новости
   ========================================================= */

.news { padding-top: var(--gap-section); }

.news__title { display: block; padding-bottom: var(--gap-title); }

.news__grid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid var(--line);
}
.news__grid::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: var(--line);
}

.news-item {
  display: flex;
  flex-direction: column;
  min-height: calc(317 * var(--u));
  padding: calc(60 * var(--u)) var(--margin) calc(30 * var(--u));
  border-bottom: 1px solid var(--line);
}

.news-item__title { max-width: calc(760 * var(--u)); }
.news-item__title a:hover { color: var(--c-text); }

.news-item__text {
  max-width: calc(619 * var(--u));
  margin-top: calc(9 * var(--u));
}

.news-item__foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-top: calc(30 * var(--u));
}

.news-item__date {
  font-family: var(--font-os);
  font-size: var(--fs-body);
  line-height: 1;
  color: var(--c-text);
}

/* =========================================================
   Планшет 640–1024 (фрейм 640)
   ========================================================= */
@media (max-width: 1024px) {

  .stat__caption { max-width: 260px; }
  .about__title,
  .fleet__title,
  .projects__title { max-width: none; }

  /* Первый экран: статичный кран справа */
  .hero {
    height: auto;
    min-height: max(var(--hero-min), var(--screen));
    padding: 4px var(--margin) 30px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto 1fr; /* блок с текстом и кнопкой — внизу экрана */
  }
  .hero__video,
  .hero__end { display: none !important; }
  .hero__media {
    position: absolute;
    inset: 0;
  }
  .hero__crane,
  .hero__side {
    display: block;
    position: absolute;
    right: -2%;
    top: max(20%, calc(50% - 28.6vw)); /* на высоком экране — по центру первого экрана (высота крана 57.2vw) */
    width: 78%;
    height: auto;
    max-width: none;
  }
  .hero__side { top: max(34%, calc(50% - 10.4vw)); width: 70%; right: 6%; }
  .intro:not(.is-final) .hero__crane { opacity: 0; }
  .intro.is-final .hero__side { opacity: 0; }
  .hero__crane,
  .hero__side { transition: opacity 1s var(--ease); }
  .no-intro .hero__side { display: none; }

  .hero__title,
  .hero__subtitle,
  .hero__bottom {
    position: relative;
    left: auto;
    top: auto;
    bottom: auto;
    grid-column: 1 / -1;
  }
  .hero__title {
    margin-left: -0.045em; /* края букв — по полю, как на десктопе */
    font-size: calc(100cqw / 8.665); /* у экрана здесь отступы по полям, 100cqw — уже ширина между полями */
    letter-spacing: -0.05em;
  }
  .hero__subtitle {
    max-width: 288px;
    margin-top: 0;
  }
  .hero__br { display: none; } /* на планшете и телефоне кран ниже — «от мировых производителей» в одну строку */
  .hero__bottom {
    align-self: end;
    margin-top: calc(123 * var(--u));
    max-width: 50%;
  }
  .hero__text { max-width: 272px; }
  .hero__btn { margin-top: 20px; }

  /* О компании */
  .about::before { left: calc(var(--margin) + 2 * var(--unit) - var(--gutter) / 2); }
  .about__label { grid-column: 1 / span 2; }
  .about__body {
    grid-column: 3 / -1;
    grid-template-columns: 1fr;
  }
  .about__texts p { grid-column: 1; max-width: 300px; }
  .about__stats { grid-template-columns: 1fr; row-gap: 30px; margin-top: 40px; }
  .stat { grid-column: 1; }

  /* Парк техники */
  .fleet::before { left: calc(var(--margin) + 2 * var(--unit) - var(--gutter) / 2); }
  .fleet__label { grid-column: 1 / span 2; }
  .fleet__head { grid-column: 3 / -1; }
  .fleet__text { max-width: 300px; }
  .fleet__nav { grid-column: 3 / -1; justify-self: start; margin-top: 20px; order: 5; }
  .fleet__viewport { margin-top: 24px; }
  .fleet__slide { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .fleet-card--side:first-child { grid-column: 1 / span 2; padding-right: 0; }
  .fleet-card--main { grid-column: 3 / span 4; }
  .fleet-card--side:last-child { grid-column: 7 / span 2; }
  .fleet-card { grid-template-columns: 1fr; }
  .fleet-card__go { display: none; }
  .fleet-card__img { height: calc(134 * var(--u)); }
  .fleet-card--main .fleet-card__img { height: calc(307 * var(--u)); }
  .fleet__btn { grid-column: 3 / -1; margin-top: 24px; margin-bottom: 20px; }

  /* Услуги: слайдер карточек */
  .services-intro__title { max-width: 420px; }

  .services {
    height: auto;
    background: none;
    color: #fff;
    padding: 0 var(--margin) 40px;
  }
  .services__stage { display: none; }
  .services__viewport {
    position: static;
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .services__viewport::-webkit-scrollbar { display: none; }
  .service {
    position: static;
    flex: 0 0 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 16px;
    min-height: 334px;
    padding: 30px 15px;
    background: var(--c-dark);
    scroll-snap-align: start;
  }
  .service__img {
    display: block;
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    height: auto;
  }
  .service__body { grid-column: 1; grid-row: 1; }
  .service__title { max-width: none; }
  .service__text { max-width: none; }
  .service__btn { margin-top: 24px; }

  .slider-controls {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-top: 20px;
  }
  .slider-dots { display: flex; gap: 8px; }
  .slider-dots button {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--c-line);
    transition: background-color 0.2s;
  }
  .slider-dots button[aria-current="true"] { background: var(--c-dark); }

  /* Проекты */
  .projects__label { grid-column: 1 / span 2; }
  .projects__title { grid-column: 3 / -1; }
  .projects__btn { display: none; }
  .project { padding: 15px var(--margin); }
  .project__img { height: calc(300 * var(--u)); }
  .project__meta { margin-top: 12px; }

  /* Отзывы */
  .reviews__title { padding-left: var(--margin); }
  .reviews__body { grid-template-columns: calc(var(--margin) + 2 * var(--unit) - var(--gutter) / 2) minmax(0, 1fr); }
  .reviews__aside { padding: 20px var(--margin); }
  .review { min-height: 260px; padding: 20px var(--margin) 20px 15px; }
  .review__footer { grid-template-columns: auto 1fr; gap: 40px; }

  /* Новости */
  .news-item { min-height: 0; padding: 25px var(--margin) 20px; }
  .news-item__foot { padding-top: 20px; }

}

/* =========================================================
   Мобильный ≤639 (фрейм 320)
   ========================================================= */
@media (max-width: 639px) {

  .preloader__count { right: 33px; bottom: 42px; font-size: 48px; }
  .preloader__lines { width: 97vw; }

  .hero {
    --hero-min: 586px; /* фрейм 320: название, кран и блок с кнопкой не наезжают друг на друга */
    display: block;
    padding: 15px var(--margin) 0;
  }
  .hero__title {
    font-size: calc(100cqw / 5.847); /* «БИСЕНГАЛИ» — от поля до поля (ширина букв 5.847 кегля) */
    line-height: 1;
    white-space: normal;
  }
  .hero__title span { display: block; }
  .hero__subtitle { margin-top: 0; max-width: 288px; }
  .hero__crane { top: min(57.8vw, 240px); right: auto; left: 29.7vw; width: min(103vw, 470px); }
  .hero__side { top: 75vw; left: 5%; right: auto; width: 90%; }
  .hero__bottom {
    position: absolute;
    left: var(--margin);
    right: var(--margin);
    bottom: 40px;
    max-width: none;
    margin-top: 0;
  }
  .hero__text { max-width: 290px; }

  .about::before { display: none; }
  .about__label { grid-column: 1 / -1; padding-bottom: 20px; border-bottom: 1px solid var(--line); margin-inline: calc(-1 * var(--margin)); padding-inline: var(--margin); }
  .about__body { grid-column: 1 / -1; }

  .fleet::before { display: none; }
  .fleet__diagonal { display: none; }
  .fleet__label { grid-column: 1 / -1; }
  .fleet__head { grid-column: 1 / -1; margin-top: var(--gap-label); }
  .fleet__nav { grid-column: 1 / -1; order: 6; margin-top: 15px; }
  .fleet__btn { display: none; }
  /* По одной машине на слайд */
  .fleet__slide { display: contents; }
  .fleet-card,
  .fleet-card--side:first-child,
  .fleet-card--main,
  .fleet-card--side:last-child {
    flex: 0 0 100%;
    padding-right: 0;
    scroll-snap-align: start;
  }
  .fleet-card__img,
  .fleet-card--main .fleet-card__img { height: calc(307 * var(--u)); }

  .services-intro { text-align: left; }
  .services-intro::before { display: none; }
  .services-intro__title { margin-inline: 0; }
  .service {
    grid-template-columns: 1fr;
    align-content: start;
    padding: 20px 15px 30px;
  }
  .service__img { grid-column: 1; grid-row: 1; }
  .service__body { grid-row: 2; }

  .projects__label,
  .projects__title { grid-column: 1 / -1; }
  .projects__title { margin-top: var(--gap-label); }
  .projects__grid { grid-template-columns: 1fr; }
  .projects__grid::before { display: none; }
  .project + .project { border-top: 1px solid var(--line); }
  .project__img { height: calc(300 * var(--u)); }

  .reviews__body { grid-template-columns: minmax(0, 1fr); }
  .reviews__aside {
    grid-row: 3;
    align-items: center;
    padding: 0 0 20px;
    border-right: 0;
  }
  .reviews__count { display: none; }
  .review { padding: 20px var(--margin); }
  .review__footer { gap: 20px; }
  .reviews__dots { display: flex; justify-content: center; padding: 20px 0; border-top: 1px solid var(--line); }

  .news__grid { grid-template-columns: 1fr; }
  .news__grid::before { display: none; }

}

/* Без анимаций по запросу системы */
@media (prefers-reduced-motion: reduce) {
  .preloader { display: none !important; }
}

/* Плашка консультации — по полям страницы, как на всех страницах (во фрейме главной она на 5px уже — не повторяем, решение 12.10) */