/* ============================================================
   09-ВНУТРЕННИЕ СТРАНИЦЫ

   Две страницы: «спасибо за заявку» (thank-you.html) и
   политика конфиденциальности (privacy.html).

   Обе используют ту же шапку, тот же прелоадер и те же
   заголовки, что и главная. Здесь только то, что есть
   исключительно на них.
   ============================================================ */


/* ------------------------------------------------------------
   СТРАНИЦА «СПАСИБО»

   Показывается после успешной отправки формы. По её просмотру
   Google Ads засчитывает конверсию - адрес страницы менять нельзя.

   Контент центрирован по вертикали на весь экран. Используем
   и 100vh, и 100dvh: первое понимают все браузеры, второе
   учитывает адресную строку на мобильных, которая то появляется,
   то прячется. Кто понимает dvh - возьмёт его.
   ------------------------------------------------------------ */

.thank-you {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  height: 100dvh;
}

.thank-you__container {
  width: 100%;
}

@media (max-width: 767px) {
  .thank-you__container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding-top: calc(96 / var(--device-size) * 100vw);
    padding-bottom: calc(36 / var(--device-size) * 100vw);
  }
}

.thank-you__button {
  margin-top: calc(60 / var(--device-size) * 100vw);
}


/* --- крупная кнопка «на сайт компании» --- */

.button-arrow_theme_black {
  background-color: rgba(255, 255, 255, 0.1);
  color: #000;
}

/* Увеличенный вариант кнопки: и текст крупнее, и стрелка длиннее.
   Только на десктопе - на мобильном остаётся обычный размер. */
@media (min-width: 768px) {
  .button-arrow_size_l {
    font-size: calc(30 / var(--device-size) * 100vw);
    line-height: calc(48 / var(--device-size) * 100vw);
  }

  .button-arrow_size_l .button-arrow__icon-wrapper {
    width: calc(76 / var(--device-size) * 100vw);
  }

  .button-arrow_size_l .button-arrow__icon {
    width: calc(50 / var(--device-size) * 100vw);
    height: calc(18 / var(--device-size) * 100vw);
  }

  .button-arrow_size_l .icon {
    width: calc(76 / var(--device-size) * 100vw);
    height: calc(18 / var(--device-size) * 100vw);
  }
}

@media (min-width: 768px) and (hover: hover) {
  .button-arrow_size_l:hover .button-arrow__icon {
    width: calc(76 / var(--device-size) * 100vw);
  }
}


/* ------------------------------------------------------------
   СТРАНИЦА ПОЛИТИКИ КОНФИДЕНЦИАЛЬНОСТИ
   ------------------------------------------------------------ */

.privacy {
  padding: calc(105 / var(--device-size) * 100vw) 0
           calc(135 / var(--device-size) * 100vw);
}

@media (max-width: 767px) {
  .privacy {
    padding: calc(63 / var(--device-size) * 100vw) 0
             calc(36 / var(--device-size) * 100vw);
  }
}

.privacy-header {
  margin-bottom: calc(130 / var(--device-size) * 100vw);
}

@media (max-width: 767px) {
  .privacy-header {
    margin-bottom: calc(50 / var(--device-size) * 100vw);
  }
}

.privacy-header__date {
  margin-top: calc(20 / var(--device-size) * 100vw);
  color: #878787;
  font-size: calc(20 / var(--device-size) * 100vw);
}

@media (max-width: 767px) {
  .privacy-header__date {
    font-size: calc(12 / var(--device-size) * 100vw);
  }
}

.privacy-header__date b {
  color: #000;
  font-weight: 600;
}

.privacy-content {
  color: #878787;
  font-size: calc(20 / var(--device-size) * 100vw);
  font-weight: 400;
  letter-spacing: -0.015em;
  line-height: calc(24 / var(--device-size) * 100vw);
}

@media (max-width: 767px) {
  .privacy-content {
    font-size: calc(14 / var(--device-size) * 100vw);
    line-height: calc(17 / var(--device-size) * 100vw);
  }
}

/* Отступ между абзацами - только между соседними,
   первый абзац к заголовку не отодвигается */
.privacy-content p + p {
  margin-top: calc(10 / var(--device-size) * 100vw);
}

/* Кнопка «назад» сдвинута влево на ширину стрелки,
   чтобы текст встал по одной линии с текстом выше */
.privacy-button {
  margin-top: calc(60 / var(--device-size) * 100vw);
  margin-left: calc(-22 / var(--device-size) * 100vw);
}

@media (max-width: 767px) {
  .privacy-button {
    margin-top: calc(40 / var(--device-size) * 100vw);
  }
}