/* === Design Motion – Главная площадь (page-id-171) === */

.page-id-171 .dm-stage .dm-logo-text,
.page-id-171 .dm-stage .dm-logo-wheel,
.page-id-171 .dm-stage .dm-char,
.page-id-171 .dm-stage .dm-cloud,
.page-id-171 .dm-stage .dm-btn {
  position: absolute;
  display: block;
  transform-origin: top left;
}

/* z-index: люди+облака сверху, под ними лого, ниже кнопки */

.page-id-171 .dm-stage .dm-btn {
  z-index: 2;
  cursor: pointer;
  will-change: transform;
  transition: transform .18s ease;
}

.page-id-171 .dm-stage .dm-logo-text,
.page-id-171 .dm-stage .dm-logo-wheel {
  z-index: 3;
}

.page-id-171 .dm-stage .dm-char {
  z-index: 4;
}

.page-id-171 .dm-stage .dm-cloud {
  z-index: 4;
  pointer-events: none;
}

/* Анимационные классы (аналогия id147) */

.page-id-171 .dm-stage .dm-appear.hidden {
  opacity: 0;
  transform: translateY(10px) scale(.985);
  will-change: transform, opacity;
}

.page-id-171 .dm-stage .dm-appear.visible.is-in {
  opacity: 1;
  transform: none;
  transition: opacity .45s ease, transform .45s ease;
}

/* Лого чуть длиннее по времени (1 сек) */

.page-id-171 .dm-stage .dm-logo-text.dm-appear.visible.is-in,
.page-id-171 .dm-stage .dm-logo-wheel.dm-appear.visible.is-in {
  transition-duration: 1s;
}

.page-id-171 .dm-stage .visible {
  opacity: 1;
  display: block;
}

.page-id-171 .dm-stage .hidden {
  opacity: 0;
  display: none;
}

/* ——— координаты ——— */

/* Лого */

.page-id-171 .dm-stage .dm-logo-text {
  left: 39.42708%;
  top: 14.81481%;
  width: 30.00000%;
  height: 24.81481%;
}

.page-id-171 .dm-stage .dm-logo-wheel {
  left: 36.35417%;
  top: 25.27778%;
  width: 34.68750%;
  height: 61.48148%;
}

/* Персонажи */

.page-id-171 .dm-stage .dm-boy {
  left: 35.78125%;
  top: 39.35185%;
  width: 35.83333%;
  height: 60.64815%;
}

.page-id-171 .dm-stage .dm-girl {
  left: 44.84375%;
  top: 51.38889%;
  width: 20.93750%;
  height: 48.61111%;
}

.page-id-171 .dm-stage .dm-man {
  left: 26.61458%;
  top: 33.88889%;
  width: 45.52083%;
  height: 66.11111%;
}

.page-id-171 .dm-stage .dm-woman {
  left: 35.10417%;
  top: 35.09259%;
  width: 33.22917%;
  height: 64.90741%;
}

/* Кнопки (троллейбус, башня, такси) */

.page-id-171 .dm-stage .dm-troll {
  left: 13.69792%;
  top: 27.22222%;
  width: 31.30208%;
  height: 51.66667%;
}

.page-id-171 .dm-stage .dm-taxi {
  left: 58.02083%;
  top: 49.81481%;
  width: 29.37500%;
  height: 33.05556%;
}

.page-id-171 .dm-stage .dm-tower {
  left: 53.38542%;
  top: 0%;
  width: 29.01042%;
  height: 38.05556%;
}

/* Облака */

.page-id-171 .dm-stage .dm-boy-cloud {
  left: 34.47917%;
  top: 3.79630%;
  width: 37.91667%;
  height: 47.68519%;
}

.page-id-171 .dm-stage .dm-girl-cloud {
  left: 34.47917%;
  top: 3.79630%;
  width: 37.91667%;
  height: 47.68519%;
}

.page-id-171 .dm-stage .dm-man-cloud {
  left: 34.47917%;
  top: 3.79630%;
  width: 37.91667%;
  height: 47.68519%;
}

.page-id-171 .dm-stage .dm-woman-cloud {
  left: 34.47917%;
  top: 3.79630%;
  width: 37.91667%;
  height: 47.68519%;
}



/* Пока картинки не загружены – сцену не показываем */
body.page-id-171:not(.dm-171-ready) .dm-stage {
  opacity: 0;
  visibility: hidden;
}

/* Когда всё загружено – включаем сцену */
body.page-id-171.dm-171-ready .dm-stage {
  opacity: 1;
  visibility: visible;
  transition: opacity .4s ease;
}