.promo-call-button {
  position: fixed;
  right: 24px;
  bottom: 92px;
  z-index: 900;
  width: 60px;
  height: 60px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #fff;
  background: #18b923;
  box-shadow: 0 10px 28px rgba(24, 185, 35, .36);
  cursor: pointer;
  transition: transform .2s ease, background .2s ease;
}

.promo-call-button:hover { background: #109b1a; transform: translateY(-2px); }
.promo-call-button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.promo-call-button svg { width: 27px; height: 27px; fill: currentColor; }

/* Кнопка «Наверх» располагается выше кнопки телефона и не перекрывает её. */
.scroll-top {
  right: 26px !important;
  bottom: 168px !important;
}

.promo-popup {
  position: fixed;
  inset: 0;
  z-index: 1500;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(15, 18, 16, .68);
  opacity: 0;
  visibility: hidden;
  transition: opacity .22s ease, visibility .22s ease;
}

.promo-popup.is-open { opacity: 1; visibility: visible; }

.promo-popup__dialog {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(310px, .7fr);
  width: min(1040px, 100%);
  max-height: calc(100vh - 48px);
  overflow: auto;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .28);
  transform: translateY(18px) scale(.985);
  transition: transform .22s ease;
}

.promo-popup.is-open .promo-popup__dialog { transform: none; }

.promo-popup__close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #222;
  background: rgba(255,255,255,.94);
  box-shadow: 0 4px 18px rgba(0,0,0,.14);
  font: 400 30px/1 Arial, sans-serif;
  cursor: pointer;
}

.promo-popup__image-wrap { min-height: 470px; background: #e9ede8; }
.promo-popup__image { width: 100%; height: 100%; display: block; object-fit: cover; }

.promo-popup__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 18px;
  padding: 72px 38px 40px;
  color: #292929;
}

.promo-popup__title { margin: 0; font: 800 clamp(26px, 2.2vw, 36px)/1.12 Manrope, Arial, sans-serif; }
.promo-popup__text { margin: 0; color: #666; font: 400 16px/1.5 Manrope, Arial, sans-serif; }
.promo-popup__form { display: grid; gap: 12px; }
.promo-popup__label { color: #555; font: 500 14px/1.3 Manrope, Arial, sans-serif; }
.promo-popup__input {
  width: 100%;
  height: 58px;
  padding: 0 18px;
  border: 1px solid #c9c9c9;
  border-radius: 14px;
  background: #fff;
  color: #222;
  font: 500 17px/1 Manrope, Arial, sans-serif;
}
.promo-popup__input:focus { outline: 2px solid rgba(24,185,35,.22); border-color: #18b923; }
.promo-popup__submit {
  min-height: 58px;
  padding: 14px 18px;
  border: 0;
  border-radius: 14px;
  color: #fff;
  background: #18b923;
  font: 700 17px/1.2 Manrope, Arial, sans-serif;
  cursor: pointer;
}
.promo-popup__submit:hover { background: #109b1a; }
.promo-popup__submit:disabled { opacity: .65; cursor: wait; }
.promo-popup__policy { display: flex; gap: 8px; align-items: flex-start; color: #888; font: 400 11px/1.35 Manrope, Arial, sans-serif; }
.promo-popup__policy input { flex: 0 0 auto; margin-top: 2px; accent-color: #18b923; }
.promo-popup__policy a { color: #109b1a; }
body.promo-popup-lock { overflow: hidden; }

@media (max-width: 720px) {
  .promo-call-button { right: 14px; bottom: 80px; width: 54px; height: 54px; }
  .scroll-top { right: 21px !important; bottom: 150px !important; }
  .promo-popup { align-items: start; padding: 12px; overflow-y: auto; }
  .promo-popup__dialog { grid-template-columns: 1fr; max-height: none; border-radius: 18px; }
  .promo-popup__image-wrap { min-height: 0; aspect-ratio: 16 / 9; }
  .promo-popup__content { gap: 13px; padding: 24px 18px 22px; }
  .promo-popup__title { padding-right: 0; font-size: 25px; }
  .promo-popup__text { font-size: 14px; }
  .promo-popup__input, .promo-popup__submit { height: 54px; min-height: 54px; }
  .promo-popup__close { top: 8px; right: 8px; width: 38px; height: 38px; font-size: 27px; }
}

@media (prefers-reduced-motion: reduce) {
  .promo-popup, .promo-popup__dialog, .promo-call-button { transition: none; }
}