/*
 * Оформление страниц сайтов школы.
 *
 * Страницы пришли из конструктора AXL и размечены его классами (`ez-*`). Сам
 * конструктор с его закрытым файлом стиля остался в AXL — здесь собственная
 * реализация тех же раскладочных примитивов: полосы, сетка из 12 долей, группы,
 * кнопки, меню, всплывающие окна.
 *
 * Правило, которое нельзя нарушать: селекторы этого файла держатся на одном классе
 * (или на паре «класс + класс»), потому что собственный стиль страницы адресуется по
 * `id` элементов и обязан перебивать общий. Никаких `!important` без крайней нужды и
 * никаких `#id` здесь быть не должно.
 *
 * Точки останова взяты из постраничных стилей самих страниц: планшет — 1024 px,
 * телефон — 768 px.
 */

/* --- Основа ------------------------------------------------------------- */

.ez-wrapper {
  margin: 0;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.22;
  -webkit-user-select: text;
  user-select: text;
}

.ez-wrapper * {
  box-sizing: border-box;
}

.ez-wrapper .ez {
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  max-width: 100%;
  font-size: 100%;
  font-weight: 400;
  line-height: 1.4;
  vertical-align: top;
  background: transparent;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%;
}

.ez-wrapper .ez a {
  color: #4a90e3;
  line-height: unset;
  text-decoration: unset;
  word-break: break-word;
}

.ez-wrapper .ez p {
  margin-top: 0;
  margin-bottom: 14px;
}

.ez-wrapper .ez p:last-child {
  margin-bottom: 0;
}

/* Элемент с действием или ссылкой кликабелен — курсор об этом говорит. */
.ez-wrapper .ez[ezactions],
.ez-wrapper .ez[href] {
  cursor: pointer;
}

/* --- Полоса страницы и её контейнер -------------------------------------- */

.ez-wrapper .ez.ez-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  background-size: cover;
}

.ez-wrapper .ez-section-container,
.ez-wrapper .ez-container {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  width: 100%;
  max-width: 1200px;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
}

@media screen and (max-width: 1200px) {
  .ez-wrapper .ez-section-container,
  .ez-wrapper .ez-container {
    max-width: 960px;
  }
}

@media screen and (max-width: 992px) {
  .ez-wrapper .ez-section-container,
  .ez-wrapper .ez-container {
    max-width: 100%;
  }
}

.ez-wrapper .ez-section-container.full,
.ez-wrapper .ez-container.full,
.ez-wrapper .ez-section.full .ez-section-container,
.ez-wrapper .ez-section.full .ez-container {
  max-width: 100%;
}

.ez-wrapper .ez-section.full .ez-section-container {
  flex: 1;
}

/*
 * Высота полосы. Модификаторы конструктора действуют на всех ширинах, а не только
 * на своей, — на это опирается вёрстка страниц: полоса `full` держит высоту экрана
 * и на телефоне тоже. Повтор `*-h-auto` в медиазапросах ничего не меняет и оставлен
 * для полноты картины.
 */
.ez-wrapper .ez.ez-section.full,
.ez-wrapper .ez.ez-section.tablet-full,
.ez-wrapper .ez.ez-section.mobile-full {
  min-height: 100vh;
}

.ez-wrapper .ez.ez-section.full-height {
  min-height: 100vw;
}

.ez-wrapper .ez.ez-section.h-auto,
.ez-wrapper .ez.ez-section.tablet-h-auto,
.ez-wrapper .ez.ez-section.mobile-h-auto {
  height: auto !important;
}

@media screen and (max-width: 1023px) and (min-width: 768px) {
  .ez-wrapper .ez.ez-section.tablet-h-auto {
    height: auto !important;
  }
}

@media screen and (max-width: 767px) {
  .ez-wrapper .ez.ez-section.mobile-h-auto {
    height: auto !important;
  }
}

/* Вертикальное выравнивание содержимого полосы. */
.ez-wrapper .ez-section.v-center .ez-section-container {
  justify-content: center;
}

.ez-wrapper .ez-section.v-flex-start .ez-section-container {
  justify-content: flex-start;
}

.ez-wrapper .ez-section.v-flex-end .ez-section-container {
  justify-content: flex-end;
}

.ez-wrapper .ez-section.v-space-between .ez-section-container {
  justify-content: space-between;
}

.ez-wrapper .ez-section.v-space-around .ez-section-container {
  justify-content: space-around;
}

/* --- Группа: свободный флекс-блок ---------------------------------------- */

.ez-wrapper .ez.ez-group {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
}

.ez-wrapper .ez.ez-group .ez-text {
  width: auto;
  flex: 1;
}

/* --- Сетка из двенадцати долей ------------------------------------------- */

.ez-wrapper .ez-columns {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.ez-wrapper .ez-columns .ez-row {
  height: 100%;
}

.ez-wrapper .ez-row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  clear: both;
  width: 100%;
}

.ez-wrapper .ez-row .ez-col {
  display: flex;
  flex-direction: column;
  flex-grow: 0;
  flex-shrink: 0;
  align-items: flex-start;
  justify-content: flex-start;
  min-height: 30px;
  max-width: 100%;
}

.ez-wrapper .ez-row .ez-col.justify-start { justify-content: flex-start; }
.ez-wrapper .ez-row .ez-col.justify-center { justify-content: center; }
.ez-wrapper .ez-row .ez-col.justify-end { justify-content: flex-end; }
.ez-wrapper .ez-row .ez-col.align-start { align-content: flex-start; }
.ez-wrapper .ez-row .ez-col.align-center { align-content: center; }
.ez-wrapper .ez-row .ez-col.align-end { align-content: flex-end; }

.ez-wrapper .ez-row .ez-col-1 { flex-basis: 8.33333333%; max-width: 8.33333333%; }
.ez-wrapper .ez-row .ez-col-2 { flex-basis: 16.66666667%; max-width: 16.66666667%; }
.ez-wrapper .ez-row .ez-col-3 { flex-basis: 25%; max-width: 25%; }
.ez-wrapper .ez-row .ez-col-4 { flex-basis: 33.33333333%; max-width: 33.33333333%; }
.ez-wrapper .ez-row .ez-col-5 { flex-basis: 41.66666667%; max-width: 41.66666667%; }
.ez-wrapper .ez-row .ez-col-6 { flex-basis: 50%; max-width: 50%; }
.ez-wrapper .ez-row .ez-col-7 { flex-basis: 58.33333333%; max-width: 58.33333333%; }
.ez-wrapper .ez-row .ez-col-8 { flex-basis: 66.66666667%; max-width: 66.66666667%; }
.ez-wrapper .ez-row .ez-col-9 { flex-basis: 75%; max-width: 75%; }
.ez-wrapper .ez-row .ez-col-10 { flex-basis: 83.33333333%; max-width: 83.33333333%; }
.ez-wrapper .ez-row .ez-col-11 { flex-basis: 91.66666667%; max-width: 91.66666667%; }
.ez-wrapper .ez-row .ez-col-12 { flex-basis: 100%; max-width: 100%; }

.ez-wrapper .ez-row .ez-col-offset-1 { margin-left: 8.33333333%; }
.ez-wrapper .ez-row .ez-col-offset-2 { margin-left: 16.66666667%; }
.ez-wrapper .ez-row .ez-col-offset-3 { margin-left: 25%; }
.ez-wrapper .ez-row .ez-col-offset-4 { margin-left: 33.33333333%; }
.ez-wrapper .ez-row .ez-col-offset-5 { margin-left: 41.66666667%; }
.ez-wrapper .ez-row .ez-col-offset-6 { margin-left: 50%; }
.ez-wrapper .ez-row .ez-col-offset-7 { margin-left: 58.33333333%; }
.ez-wrapper .ez-row .ez-col-offset-8 { margin-left: 66.66666667%; }
.ez-wrapper .ez-row .ez-col-offset-9 { margin-left: 75%; }
.ez-wrapper .ez-row .ez-col-offset-10 { margin-left: 83.33333333%; }
.ez-wrapper .ez-row .ez-col-offset-11 { margin-left: 91.66666667%; }
.ez-wrapper .ez-row .ez-col-offset-12 { margin-left: 100%; }

/*
 * На телефоне сетка складывается в колонку: доли перестают действовать, отступы
 * между долями снимаются, а соседние доли получают вертикальный интервал.
 */
@media screen and (max-width: 768px) {
  .ez-wrapper .ez-row .ez-col {
    margin: 0;
    margin-left: 0 !important;
    margin-right: 0 !important;
    flex-basis: 100% !important;
    max-width: 100% !important;
  }

  .ez-wrapper.live .ez .ez-col {
    margin-top: 10px;
    margin-left: 0 !important;
    margin-right: 0 !important;
    flex-basis: 100% !important;
    max-width: 100% !important;
  }

  .ez-wrapper.live .ez .ez-col:first-child {
    margin-top: 0;
  }
}

/* --- Текст --------------------------------------------------------------- */

.ez-wrapper .ez.ez-text {
  display: block;
  padding: 0;
  overflow: initial;
}

.ez-wrapper .ez.ez-text h1,
.ez-wrapper .ez.ez-text h2,
.ez-wrapper .ez.ez-text h3,
.ez-wrapper .ez.ez-text h4,
.ez-wrapper .ez.ez-text h5 {
  margin-top: 0;
  margin-bottom: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}

.ez-wrapper .ez.ez-text p {
  margin-top: 10px;
  margin-bottom: 0;
}

.ez-wrapper .ez.ez-text p:first-child {
  margin-top: 0;
}

.ez-wrapper .ez.ez-text div a,
.ez-wrapper .ez.ez-text span a {
  color: #1890ff;
  background-color: inherit;
  text-decoration: inherit;
}

/* --- Картинка ------------------------------------------------------------ */

.ez-wrapper .ez.ez-image {
  display: block;
  width: 100%;
  min-width: 20px;
  min-height: 20px;
  object-fit: contain;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%;
}

.ez-wrapper .ez.ez-image.circle {
  border-radius: 50% !important;
}

/* --- Кнопка -------------------------------------------------------------- */

.ez-wrapper .ez.ez-button {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: auto;
  padding-left: 20px;
  padding-right: 20px;
  border-radius: 3px;
  background-color: green;
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  appearance: none;
}

.ez-wrapper .ez.ez-button .ezb-wrapper {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  height: 100%;
}

.ez-wrapper .ez.ez-button .ezb-wrapper .ezb-first {
  flex-basis: 100%;
  font-size: 20px;
  line-height: 2;
  text-align: center;
}

.ez-wrapper .ez.ez-button .ezb-wrapper .ezb-second {
  flex-basis: 100%;
  font-size: 12px;
  line-height: 1.65;
  text-align: center;
}

.ez-wrapper .ez.ez-button .ezb-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.ez-wrapper .ez.ez-button .ezb-icon svg {
  width: 100%;
  height: 100%;
}

.ez-wrapper .ez.ez-button .ezb-icon.left { margin-right: -20px; }
.ez-wrapper .ez.ez-button .ezb-icon.right { margin-left: -20px; }

/* --- Меню ---------------------------------------------------------------- */

.ez-wrapper .ez.ez-menu {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.ez-wrapper .ez.ez-menu .ez-menu-items {
  display: inherit;
  flex: 1;
  flex-direction: inherit;
  flex-wrap: inherit;
  align-items: inherit;
  justify-content: inherit;
  gap: inherit;
}

.ez-wrapper .ez.ez-menu .ez-menu-button {
  padding: 5px 15px 5px 10px;
  border-radius: 0;
  background-color: transparent;
  color: #000;
  font-size: 20px;
  text-align: center;
}

.ez-wrapper .ez.ez-menu .ez-menu-collapse-btn {
  display: none;
  margin-left: auto;
  color: #000;
  font-size: 25px;
  cursor: pointer;
}

.ez-wrapper .ez.ez-menu .ez-menu-collapse-btn .collapse-btn-open,
.ez-wrapper .ez.ez-menu .ez-menu-collapse-btn .collapse-btn-close {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Свёрнутое меню: видна кнопка, пункты спрятаны — по своей ширине для каждого вида. */
@media screen and (min-width: 1025px) {
  .ez-wrapper .ez.ez-menu.collapse-desktop .ez-menu-collapse-btn { display: block; }
  .ez-wrapper .ez.ez-menu.collapse-desktop .ez-menu-collapse-btn .collapse-btn-open { display: flex; }
  .ez-wrapper .ez.ez-menu.collapse-desktop .ez-menu-collapse-btn .collapse-btn-close,
  .ez-wrapper .ez.ez-menu.collapse-desktop .ez-menu-items { display: none; }
}

@media screen and (max-width: 1024px) {
  .ez-wrapper .ez.ez-menu.collapse-tablet .ez-menu-collapse-btn { display: block; }
  .ez-wrapper .ez.ez-menu.collapse-tablet .ez-menu-collapse-btn .collapse-btn-open { display: flex; }
  .ez-wrapper .ez.ez-menu.collapse-tablet .ez-menu-collapse-btn .collapse-btn-close,
  .ez-wrapper .ez.ez-menu.collapse-tablet .ez-menu-items { display: none; }
}

@media screen and (max-width: 768px) {
  .ez-wrapper .ez.ez-menu.collapse-mobile .ez-menu-collapse-btn { display: block; }
  .ez-wrapper .ez.ez-menu.collapse-mobile .ez-menu-collapse-btn .collapse-btn-open { display: flex; }
  .ez-wrapper .ez.ez-menu.collapse-mobile .ez-menu-collapse-btn .collapse-btn-close,
  .ez-wrapper .ez.ez-menu.collapse-mobile .ez-menu-items { display: none; }
}

/* Развёрнутое меню: пункты выпадают под шапкой. */
.ez-wrapper .ez.ez-menu.shown {
  animation: rmtMenuEnter 0.2s ease-in-out;
}

.ez-wrapper .ez.ez-menu.shown .ez-menu-collapse-btn { display: block !important; }
.ez-wrapper .ez.ez-menu.shown .ez-menu-collapse-btn .collapse-btn-open { display: none !important; }
.ez-wrapper .ez.ez-menu.shown .ez-menu-collapse-btn .collapse-btn-close { display: flex !important; }

.ez-wrapper .ez.ez-menu.shown .ez-menu-items {
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 20;
  display: flex !important;
  flex-direction: column;
  width: 400px;
  max-width: 100%;
  gap: 0;
  background: #fff;
  box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.2);
}

.ez-wrapper .ez.ez-menu.shown .ez-menu-items .ez-menu-button {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .ez-wrapper .ez.ez-menu.shown .ez-menu-items { width: 100%; }
}

.ez-wrapper .ez.ez-section.menu-shown {
  z-index: 11;
}

/* --- Текст с картинкой --------------------------------------------------- */

.ez-wrapper .ez.ez-txt-img {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.ez-wrapper .ez.ez-txt-img.left,
.ez-wrapper .ez.ez-txt-img.right { flex-direction: row; }

.ez-wrapper .ez.ez-txt-img.top,
.ez-wrapper .ez.ez-txt-img.bottom { flex-direction: column; }

.ez-wrapper .ez.ez-txt-img .ez-txt-img-image {
  order: 1;
  width: 100px;
  height: 100px;
  object-fit: cover;
  object-position: center center;
}

.ez-wrapper .ez.ez-txt-img .ez-txt-img-image svg {
  width: 100%;
  height: 100%;
}

.ez-wrapper .ez.ez-txt-img .ez-txt-img-text {
  order: 2;
  flex: 1;
  margin: 5px;
}

.ez-wrapper .ez.ez-txt-img.right .ez-txt-img-image,
.ez-wrapper .ez.ez-txt-img.bottom .ez-txt-img-image { order: 2; }

.ez-wrapper .ez.ez-txt-img.right .ez-txt-img-text,
.ez-wrapper .ez.ez-txt-img.bottom .ez-txt-img-text { order: 1; }

.ez-wrapper .ez.ez-txt-img.circle .ez-txt-img-image,
.ez-wrapper .ez.ez-txt-img.square .ez-txt-img-image { border-radius: 50%; }

@media screen and (max-width: 1024px) {
  .ez-wrapper .ez.ez-txt-img.tablet-left,
  .ez-wrapper .ez.ez-txt-img.tablet-right { flex-direction: row; }
  .ez-wrapper .ez.ez-txt-img.tablet-top,
  .ez-wrapper .ez.ez-txt-img.tablet-bottom { flex-direction: column; }
  .ez-wrapper .ez.ez-txt-img.tablet-right .ez-txt-img-image,
  .ez-wrapper .ez.ez-txt-img.tablet-bottom .ez-txt-img-image { order: 2; }
  .ez-wrapper .ez.ez-txt-img.tablet-right .ez-txt-img-text,
  .ez-wrapper .ez.ez-txt-img.tablet-bottom .ez-txt-img-text { order: 1; }
  .ez-wrapper .ez.ez-txt-img.tablet-circle .ez-txt-img-image { border-radius: 50%; }
}

@media screen and (max-width: 768px) {
  .ez-wrapper .ez.ez-txt-img.mobile-left,
  .ez-wrapper .ez.ez-txt-img.mobile-right { flex-direction: row; }
  .ez-wrapper .ez.ez-txt-img.mobile-top,
  .ez-wrapper .ez.ez-txt-img.mobile-bottom { flex-direction: column; }
  .ez-wrapper .ez.ez-txt-img.mobile-right .ez-txt-img-image,
  .ez-wrapper .ez.ez-txt-img.mobile-bottom .ez-txt-img-image { order: 2; }
  .ez-wrapper .ez.ez-txt-img.mobile-right .ez-txt-img-text,
  .ez-wrapper .ez.ez-txt-img.mobile-bottom .ez-txt-img-text { order: 1; }
  .ez-wrapper .ez.ez-txt-img.mobile-square .ez-txt-img-image { border-radius: 50%; }
}

/* --- Собственная разметка школы и видео ---------------------------------- */

.ez-wrapper .ez.ez-html iframe {
  display: block;
}

.ez-wrapper .ez .ez-video-v2 {
  width: 100%;
  overflow: hidden;
}

.ez-wrapper .ez .ez-video-v2 .videoSpacer {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  visibility: hidden;
}

.ez-wrapper .ez .ez-video-v2 video.videoSpacer {
  aspect-ratio: 16 / 9;
}

/*
 * Проигрыватель растягивается по распорке, а не по своим width/height: в разметке
 * у iframe стоят 1920×1080, и без этого правила страница получает гигантский пустой
 * блок вместо видео.
 */
.ez-wrapper .ez .ez-video-v2 iframe,
.ez-wrapper .ez .ez-video-v2 .ez-video-preview {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.ez-wrapper .ez .ez-video-v2 .ez-video-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #1890ff;
  color: #fff;
  font-size: 100px;
}

.ez-wrapper .ez.ez-icon svg {
  width: 100%;
  height: 100%;
}

.ez-wrapper .ez.ez-icon.circle {
  border-radius: 50% !important;
}

/* --- Всплывающее окно ---------------------------------------------------- */

.ez-popup-holder {
  display: none;
}

.ez-popup-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.25);
}

.ez-wrapper .ez.ez-popup {
  left: 0;
  right: 0;
  z-index: 10;
  display: none;
  width: calc(100% - 40px);
  max-width: 100%;
  margin: 20px auto;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.35);
}

.ez-popup-close {
  position: absolute;
  top: -15px;
  right: -15px;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
  color: rgba(0, 0, 0, 0.5);
  font-size: 28px;
  cursor: pointer;
}

body.ez-popup-shown {
  overflow: hidden;
}

body.ez-popup-shown .ez-popup-holder.shown {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 101;
  display: block;
  width: 100%;
  height: 100%;
  overflow: auto;
}

body.ez-popup-shown .ez-popup-backdrop.shown {
  display: block;
  animation: rmtPopupFadeIn 0.3s ease-in-out;
}

body.ez-popup-shown .ez.ez-popup.shown {
  z-index: 10;
  display: block;
  opacity: 1;
  animation: rmtPopupFadeIn 0.3s ease-in-out;
}

@keyframes rmtPopupFadeIn {
  from { opacity: 0; transform: translateY(-20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes rmtMenuEnter {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* --- Скрытие блока по ширине экрана -------------------------------------- */

@media screen and (min-width: 1025px) {
  .ez-wrapper.live .ez.ez-desktop-h { display: none; }
}

@media screen and (max-width: 1024px) and (min-width: 769px) {
  .ez-wrapper.live .ez.ez-tablet-h { display: none; }
}

@media screen and (max-width: 768px) {
  .ez-wrapper.live .ez.ez-mobile-h { display: none; }
}

/* --- Наше: состав заказа и встроенная форма платформы -------------------- */

.rmt-checkout-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 12px 0;
  font-size: 18px;
}

.rmt-checkout-price {
  font-weight: 600;
  white-space: nowrap;
}

.rmt-checkout-compare {
  margin-left: 10px;
  opacity: 0.6;
  font-weight: 400;
  text-decoration: line-through;
}

.rmt-form-frame {
  display: block;
  width: 100%;
  min-height: 420px;
  border: 0;
}