/* =========================================================
   Кнопка «Наверх»
   ========================================================= */
.to-top {
  position: fixed; right: calc(var(--pp) * 0.6 + 0.5rem); bottom: 1.5rem; z-index: 990;
  display: grid; place-items: center;
  width: 3.25rem; height: 3.25rem; padding: 0.85rem;
  color: var(--wheat); background: rgba(24, 24, 24, 0.85);
  border: 1px solid rgba(246, 232, 191, 0.35); border-radius: 50%;
  -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);
  cursor: pointer;
  opacity: 0; visibility: hidden; transform: translateY(1rem);
  transition: opacity 0.35s ease, transform 0.35s ease, visibility 0.35s, background-color 0.2s, color 0.2s, border-color 0.2s;
}
.to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.to-top:hover { background: var(--wheat); border-color: var(--wheat); color: var(--black); }
.to-top:hover svg { transform: translateY(-2px); }
.to-top svg { display: block; transition: transform 0.2s; }
.to-top:focus-visible { outline: 2px solid var(--wheat); outline-offset: 3px; }
html.cz-open .to-top, html.menu-open .to-top { opacity: 0; visibility: hidden; }
@media (max-width: 767px) {
  .to-top { width: 44px; height: 44px; right: 1rem; bottom: 1rem; padding: 0.7rem; }
}

/* =========================================================
   Адаптация под телефоны и планшеты
   ========================================================= */
@media (max-width: 991px) {
  /* Зоны нажатия не меньше 44px */
  .hamburger-wrap { min-height: 44px; }
  .hamburger { width: 44px; height: 44px; }
  .topbar__menu .btn { padding-top: 0.75rem; padding-bottom: 0.75rem; }
  .cform__chip, .cform__action, .calc__tab { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; }
  .footer__legal .link-u, .overlay__social .link-u, .footer__copy .link-u { padding: 0.55rem 0; }
  .prices__calc { padding: 0.45rem 0; }
  .scroll-down, .whero__down { padding: 0.75rem; margin: -0.75rem; }
  .slist__arrow { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

  /* Поля ввода: 16px, чтобы iOS не увеличивал страницу при фокусе */
  .cform__textarea, .calc__input { font-size: 16px; }

  /* Калькулятор: вкладки задач — одной прокручиваемой строкой */
  .calc__tabs {
    flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity;
    margin: 0 calc(var(--pp) * -1) calc(3rem * var(--sc)); padding: 0 var(--pp) 0.5rem;
    -ms-overflow-style: none; scrollbar-width: none;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--pp), #000 calc(100% - 2.5rem), transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 var(--pp), #000 calc(100% - 2.5rem), transparent 100%);
  }
  .calc__tabs::-webkit-scrollbar { display: none; }
  .calc__tab { flex: none; scroll-snap-align: start; white-space: nowrap; }

  /* Сетки отступов и карточки */
  .prices__cta, .calc__sheet-inner { padding: 1.5rem; }
  .team__right-wrap--dirs { gap: 2rem; }
  .create__grid, .calc__grid, .prices__grid { gap: 3rem; }

  /* Аккордеон «Экспертиза»: компактнее на планшете/телефоне */
  .acc { min-height: 0; gap: 0.5rem; }
  .acc__item { min-height: 14rem; }
  .acc__title { min-width: 0; white-space: normal; font-size: 2rem; }
}

@media (max-width: 767px) {
  /* Декоративная линейная графика — не за краем экрана */
  .asec__svg { right: 0; max-width: 9rem; opacity: 0.6; }

  /* Каталог: описание и фото на всю ширину */
  .works__list { gap: 2rem; }
  .works__desc { max-width: none; }
  .works__contain { padding-right: var(--pp); }

  /* Шапка страниц: заголовки не упираются в край */
  .page-title, .thero__title, .asec__title, .sec-head__title { overflow-wrap: anywhere; hyphens: auto; }

  /* Экспертиза: номера пунктов не шире экрана */
  .elist__num { font-size: 12rem; }

  /* Галерея проекта и отзывов */
  .gallery__list { gap: 1rem; }

  /* Футер: карточки контактов на всю ширину */
  .footer__content .fcard, .footer__address { width: 100%; }
  .labels { flex-wrap: wrap; }

  /* Меню: пункты и контакты с достаточными отступами */
  .overlay__left { padding-top: 2rem; padding-bottom: 2rem; gap: 0.6rem; }
  .overlay__right { gap: 0.5rem; }

  /* Блок «Создай своё» */
  .create__step { grid-template-columns: 2.5rem minmax(0, 1fr); }
  .cform__head { flex-wrap: wrap; }
}

@media (max-width: 479px) {
  .hero__baseline { font-size: 1.35rem; }
  .elist__num { font-size: 9rem; }
  .calc__title, .prices__cta-title { font-size: 2rem; }
  .czoom__ui button { min-width: 2.4rem; height: 2.4rem; padding: 0 0.6rem; }
  .czoom__title { font-size: 1.2rem; }
}

/* Устройства без наведения: эффекты hover не «залипают» */
@media (hover: none) {
  .team__img-wrap:hover { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); }
  .team__img-wrap:hover .team__img, .works__item:hover .works__img { filter: none; transform: none; }
  .works__item:hover .works__ci { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); }
  .lastp:hover .lastp__img { filter: none; }
}

/* Уменьшенное движение */
@media (prefers-reduced-motion: reduce) {
  .to-top, .wheel__spin, .scroll-down__line::after, .cform__loader-bar::after, .cform__result.is-loading { transition: none; animation: none; }
}

@media (max-width: 991px) {
  .btn-link .btn { padding-top: 0.85rem; padding-bottom: 0.85rem; }
  .footer__legal .link-u, .overlay__social .link-u, .footer__copy .link-u { padding: 0.7rem 0; }
  .prices__calc { padding: 0.65rem 0; }
}

/* =========================================================
   Шапка главной: заголовок сверху, подпись и «Листайте вниз» —
   отдельной нижней строкой с отступом от края видео.
   Размер заголовка ограничен высотой экрана, поэтому текст
   не упирается в низ на невысоких мониторах и ноутбуках.
   ========================================================= */
.hero--home { z-index: 1; }
.hero--home .hero__inner {
  height: 100vh;
  height: 100svh;
  min-height: 34rem;
  justify-content: flex-start;
  padding-top: calc(5rem + 3rem * var(--sc));
  padding-bottom: calc(3.5rem + 2rem * var(--sc) + env(safe-area-inset-bottom, 0px));
}
.hero--home .hero__text { flex: 1; min-height: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; height: auto; }
.hero--home .hero__title { font-size: min(13rem, 21vh); font-size: min(13rem, 21svh); line-height: 0.95; }
.hero--home .hero__bottom {
  display: grid; grid-template-columns: minmax(0, 60rem) auto; justify-content: space-between; align-items: end;
  gap: 1.5rem 3rem; width: 100%;
}
.hero--home .hero__baseline { margin: 0; max-width: 60rem; }
.hero--home .scroll-down {
  position: static; display: flex; flex-direction: column; align-items: center; gap: 0.75rem;
  margin: 0; padding: 0.5rem; justify-self: end;
}
.scroll-down__line { position: relative; display: block; width: 1px; height: 3rem; overflow: hidden; background: rgba(246, 232, 191, 0.25); }
.scroll-down__line::after {
  content: ""; position: absolute; left: 0; top: -40%; width: 100%; height: 40%;
  background: var(--wheat); animation: scrollLine 2.2s cubic-bezier(0.65, 0, 0.35, 1) infinite;
}
@keyframes scrollLine { to { top: 100%; } }
.hero--home .hero__inner::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 45%; z-index: -1; pointer-events: none;
  background: linear-gradient(to top, rgba(24, 24, 24, 0.75), rgba(24, 24, 24, 0));
}
.hero--home .hero__media { z-index: -2; }
.hero--home .hero__inner { z-index: 0; isolation: isolate; }

@media (min-width: 1440px) { .hero--home .hero__title { font-size: min(18.9rem, 21svh); } }
@media (max-width: 991px) {
  .hero--home .hero__title { font-size: min(8rem, 18svh); }
}
@media (max-width: 767px) {
  .hero--home .hero__inner { padding-top: calc(5rem + 2rem); padding-bottom: calc(2rem + env(safe-area-inset-bottom, 0px)); }
  .hero--home .hero__title { font-size: min(6rem, 15svh); }
  .hero--home .hero__bottom { grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; }
  .hero--home .hero__baseline { margin-bottom: 0; }
  .scroll-down__line { height: 2rem; }
  .hero--home .scroll-down p { font-size: 0.8rem; }
}
@media (max-width: 479px) {
  .hero--home .hero__title { font-size: min(5.2rem, 13svh); }
  .hero--home .hero__bottom { grid-template-columns: minmax(0, 1fr); }
  .hero--home .scroll-down { justify-self: start; flex-direction: row; padding: 0.6rem 0; }
  .hero--home .scroll-down p br { display: inline-block; width: 0.35em; } /* перенос превращается в пробел */
  .scroll-down__line { width: 2.5rem; height: 1px; }
  .scroll-down__line::after { top: 0; left: -40%; width: 40%; height: 100%; animation-name: scrollLineX; }
}
@keyframes scrollLineX { to { left: 100%; } }
@media (max-height: 560px) and (min-width: 768px) {
  .hero--home .hero__baseline { font-size: 1.2rem; }
}
@media (prefers-reduced-motion: reduce) { .scroll-down__line::after { animation: none; } }

/* 3D-фон всегда под содержимым секций с фоном */
.create { position: relative; z-index: 2; }