/* ============================================
   БАЗОВЫЕ СТИЛИ И СБРОС
   ============================================ */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  overflow-x: hidden;
  scroll-padding-top: calc(var(--top-bar-height, 90px) + 20px); /* Отступ для якорей: высота навигации + небольшой отступ */
}

body {
  font-family: "Roboto", Arial, sans-serif;
  color: #fff;
  width: 100%;
  margin: 0 auto;
  background: #fff;
  overflow-x: hidden;
}

a {
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
  /* Улучшение качества отображения изображений */
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  image-rendering: auto;
  -ms-interpolation-mode: bicubic;
  image-rendering: high-quality;
  /* Предотвращение размытия при масштабировании */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.block7 .note .note_icon {
  max-width: 34px !important;
  height: 32px !important;
}


/* Исключение для флагов в кнопке региона */
.region_btn img.flag {
  max-width: none;
  width: 10px !important;
  height: 10px !important;
}

/* Исключение для флагов в селекторе телефона */
.phone_flag_selector .phoneFlagImg,
.phone_country_option .flag {
  max-width: none !important;
}

/* Скрываем iti__country-container от intl-tel-input */
.iti__country-container {
  display: none !important;
}

/* ============================================
   ПЕРЕМЕННЫЕ И КОНСТАНТЫ
   ============================================ */
:root {
  --page-width: 1440px;
  --content-width: 1140px; /* 1440 - 300px (150px*2) */
  --side-padding: 150px;
  --color-red: #D2232A;
  --color-red-dark: #b71c1c;
  --color-red-light: #e30613;
  --color-black: #000000;
  --color-white: #fff;
  --color-gray: #71717a;
  --color-gray-light: #f4f4f5;
  --btn-height: 69px;
  --white-bg-height: calc(var(--btn-height) / 2);
}

/* Плавное уменьшение горизонтального padding от 1440px до 1024px */
@media (max-width: 1440px) and (min-width: 1024px) {
  :root {
    --side-padding: clamp(24px, calc(24px + (150px - 24px) * ((100vw - 1024px) / (1440px - 1024px))), 150px);
  }
}

@media (max-width: 1023px) {
  :root {
    --side-padding: 24px;
  }
  
  /* phone_wrapper в block7 на всю ширину при 1023px */
  .block7 .phone_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
  }
  
  /* phone_number в block7 тоже на всю ширину */
  .block7 .phone_number {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  
  .block7 .phone_number input {
    width: 100% !important;
  }
}

@media (max-width: 768px) {
  :root {
    --side-padding: 20px;
  }
  
  /* phone_wrapper в block7 на всю ширину */
  .block7 .phone_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
  }
  
  /* phone_number в block7 тоже на всю ширину */
  .block7 .phone_number {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  
  .block7 .phone_number input {
    width: 100% !important;
  }

  .block2 {
    padding-top: 0px !important;
  }
}


@media (max-width: 380px) {
  :root {
    --side-padding: 14px;
  }
  
  /* Заменяем все горизонтальные padding 24px на 14px для всех контейнеров */
  .block1,
  .block2,
  .block4,
  .block5,
  .block6,
  .block7,
  .block8,
  .block9,
  .block10,
  .block12,
  .block14,
  .block15,
  .block17,
  .block19,
  .block19_reviews,
  .block20_campuses,
  .block21,
  .block22,
  .block23,
  .block24,
  .block25,
  .top_bar,
  .nav-bar ul,
  .container {
    padding-inline: 14px !important;
  }
  
  /* Для элементов с padding-inline */
  .block1 .nav-buttons {
    padding-inline: 14px !important;
  }
  
  /* Для элементов с padding: Xpx 24px в медиа-запросах */
  .block14_campus_btn {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block12_campus_btn {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block20_campus_btn {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .form_campus_btn {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  /* Для элементов с прямым padding: Xpx 24px */
  /* Исключаем region_modal и его внутренние элементы */
  .phone_modal,
  .phone_modal2,
  .campus_modal,
  .block12_campus_modal {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  /* Для modal_header вне region_modal */
  .modal_header:not(.region_modal .modal_header) {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  /* Убираем padding у region_modal и его внутренних элементов на 400px */
  .region_modal {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  
  .region_modal .country_options {
    padding: 16px 20px !important;
  }
  
  /* Специфичные элементы с padding 24px */
  .btn {
    padding: 14px 14px !important;
  }
  
  .block12_price_item {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block19_news_card,
  .block19_review_card {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block21_item {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block22_item {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block23_item {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block24_item {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  /* Для элементов с padding: Xpx 24px или padding: 24px */
  .mobile-menu-btn {
    padding-left: 0 !important;
    padding-right: 14px !important;
  }
  
  /* Исключаем country_options внутри region_modal */
  .country_options:not(.region_modal .country_options) {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .phone_country_options {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .campus_option {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block12_campus_option {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block14_campus_option {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .block20_campus_option {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .form_campus_option {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  /* Для кнопок и других элементов */
  .block12_price_info_btn,
  .block7_download,
  .submit,
  .form_step2_submit {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  /* form_hover padding по горизонтали - все варианты */
  .form_hover,
  .block3 .form_hover,
  .block11 .form_hover,
  .block16 .form_hover,
  .block18 .form_hover,
  .block20 .form_hover {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  
  .form_hover_step2,
  .block3 .form_hover_step2,
  .block11 .form_hover_step2,
  .block16 .form_hover_step2,
  .block18 .form_hover_step2,
  .block20 .form_hover_step2 {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

@media (max-width: 373px) {
  :root {
    --side-padding: 6px;
  }
  
  /* Заменяем все горизонтальные padding 14px на 6px для всех контейнеров */
  .block1,
  .block2,
  .block4,
  .block5,
  .block6,
  .block7,
  .block8,
  .block9,
  .block10,
  .block12,
  .block14,
  .block15,
  .block17,
  .block19,
  .block19_reviews,
  .block20_campuses,
  .block21,
  .block22,
  .block23,
  .block24,
  .block25,
  .top_bar,
  .nav-bar ul,
  .container {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  /* Для элементов с padding-inline */
  .block1 .nav-buttons {
    padding-inline: 6px !important;
  }
  
  /* Для элементов с padding: Xpx 14px в медиа-запросах */
  .block14_campus_btn {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block12_campus_btn {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block20_campus_btn {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .form_campus_btn {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  /* Для элементов с прямым padding: Xpx 14px */
  .modal_header,
  .region_modal,
  .phone_modal,
  .phone_modal2,
  .campus_modal,
  .block12_campus_modal {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  /* Специфичные элементы с padding 14px */
  .btn {
    padding: 14px 6px !important;
  }
  
  .block12_price_item {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block19_news_card,
  .block19_review_card {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block21_item {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block22_item {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block23_item {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block24_item {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  /* Для элементов с padding: Xpx 14px или padding: 14px */
  .mobile-menu-btn {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .country_options {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .phone_country_options {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .campus_option {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block12_campus_option {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block14_campus_option {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .block20_campus_option {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .form_campus_option {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  /* Для кнопок и других элементов */
  .block12_price_info_btn,
  .block7_download,
  .submit,
  .form_step2_submit {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  /* form_hover padding по горизонтали - все варианты */
  .form_hover,
  .block3 .form_hover,
  .block11 .form_hover,
  .block16 .form_hover,
  .block18 .form_hover,
  .block20 .form_hover {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  
  .form_hover_step2,
  .block3 .form_hover_step2,
  .block11 .form_hover_step2,
  .block16 .form_hover_step2,
  .block18 .form_hover_step2,
  .block20 .form_hover_step2 {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
}

@media (max-width: 437px) {
  /* Отключаем перенос элементов в top_bar до 437px включительно */
  .top_bar {
    flex-wrap: nowrap !important;
  }
}

@media (min-width: 354px) and (max-width: 355px) {
  /* Ограничиваем ширину logo */
  .top_bar .logo {
    max-width: 175px !important;
  }
}

@media (max-width: 354px) {
  /* Ограничиваем ширину logo для всех ширин ниже 355px */
  .top_bar .logo {
    max-width: 165px !important;
  }
}

@media (max-width: 353px) {
  /* Уменьшаем gap, чтобы убрать лишнее расстояние справа у logo */
  .top_bar {
    gap: 8px !important;
  }
  
  /* Убираем растяжение logo, чтобы блок был точно по размеру внутренних элементов */
  .top_bar .logo {
    width: fit-content !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    max-width: 165px !important;
  }
  
  /* Скрываем whatsapp и telegram на 353px, телефон рядом с заявка */
  .top_bar .icons a.whatsapp,
  .top_bar .icons a.telegram {
    display: none !important;
  }
}

@media (max-width: 330px) {
  /* Скрываем icons-menu-btn на 330px и ниже - даже при прокрутке вниз */
  .icons-menu-btn.visible,
  .top_bar .icons-menu-btn.visible {
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateX(20px) !important;
    pointer-events: none !important;
    display: none !important;
  }
  
  /* Убираем отступ справа для контейнера icons */
  .icons.has-menu-btn {
    padding-right: 0 !important;
  }
}

@media (max-width: 440px) {
  /* region_modal.open по центру экрана, независимо от region_btn */
  .region_modal {
    position: fixed !important;
    top: 60px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: auto !important;
    max-width: 360px !important;
    z-index: 10000 !important;
  }
  
  .region_modal.open {
    top: 60px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}



/* ============================================
   ОБЩИЙ КОНТЕЙНЕР
   ============================================ */
.container {
  max-width: var(--content-width);
  margin: 0 auto;
  padding: 0 var(--side-padding);
}

/* ============================================
   ШАПКА (HEADER)
   ============================================ */
.top_bar {
  background: var(--color-white);
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 20px var(--side-padding);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 15px;
  box-sizing: border-box;
}

.logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 13px;
  line-height: 1;
  text-transform: uppercase;
  color: var(--color-black);
  letter-spacing: 0.5px;
  flex-shrink: 0;
  flex-grow: 0;
  min-width: 0;
}

.logo img {
  height: auto;
  width: auto;
  max-width: 44px;
  max-height: 50px;
  object-fit: contain;
}

.logo_text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1;
}

.logo_text_top {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.logo_text > span:not(.logo_school_row) {
  line-height: 1;
  display: block;
}

.logo_school_row {
  display: flex;
  align-items: center;
  gap: 4px;
  line-height: 0.1;
}

/* Кнопка выбора региона */
.region_wrapper {
  position: relative;
  display: inline-block;
}

.region_btn {
  background-color: #d9d9d9;
  border-radius: 15px;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 16px;
  font-weight: 500;
  color: #000000;
  padding: 2px 2px;
  justify-content: center;
}

@media (min-width: 769px) {
  .region_btn {
    box-sizing: border-box;
  }

  .info_school {
    font-size: 16px !important;
  }
}

.region_btn img.flag,
.region_btn .flag {
  width: 10px !important;
  height: 10px !important;
  min-width: 12px !important;
  min-height: 12px !important;
  border-radius: 2px;
  display: block !important;
  object-fit: cover;
  flex-shrink: 0;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0;
}

.rf {
  font-family: "Roboto";
  font-weight: 500;
  font-size: 10px;
  text-transform: uppercase;
  color: #000000;
  padding-left: 4px;
}

.region_btn .arrow {
  font-size: 12px;
  transition: transform 0.2s;
  padding-top: 2px;
  padding-right: 3px;
}

.region_btn.active .arrow {
  transform: rotate(180deg);
}

/* Модальное окно подтверждения геолокации */
.geo_confirm_modal {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all 0.25s ease;
  z-index: 1000;
  display: block;
}

/* Когда модальное окно подтверждения скрыто, оно не должно перекрывать другие элементы */
.geo_confirm_modal:not(.show) {
  z-index: -1;
}

.geo_confirm_modal.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.geo_confirm_content {
  background: #fff;
  overflow: hidden;
}

.geo_confirm_header {
  padding: 20px 43px 20px 20px;
  font-size: 15px;
  line-height: 1.5;
  color: #000000;
  border-bottom: 1px solid #eee;
  text-transform: none;
  font-size: 18px;
  font-weight: 400;
  text-align: center;
}

.geo_confirm_header h3 {
  font-family: "Roboto", Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: #000000;
  margin: 0 0 8px 0;
}

.geo_confirm_region {
  font-family: "Roboto", Arial, sans-serif;
  font-size: 18px;
  font-weight: 500;
  color: #D2232A;
  margin: 0;
}

.geo_confirm_buttons {
  display: flex;
  gap: 12px;
  justify-content: center;
  padding: 16px 20px;
  flex-wrap: nowrap;
}

.geo_confirm_btn {
  padding: 0;
  border-radius: 8px;
  border: none;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  width: 139px;
  height: 40px;
  min-width: 139px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.geo_confirm_yes {
  background: #D2232A;
  color: #FFFFFF;
  border: 1px solid #D2232A;
}

.geo_confirm_yes:hover {
  background: #B01E26;
}

.geo_confirm_no {
  background: #FFFFFF;
  color: #D2232A;
  border: 1px solid #D2232A;
}

.geo_confirm_no:hover {
  background: #FFF5F5;
}

@media (max-width: 768px) {
  .geo_confirm_modal {
    width: auto;
    max-width: 360px;
    left: 50% !important;
    right: auto;
    transform: translateX(-50%) !important;
    margin-left: 0;
    margin-right: 0;
  }

  .geo_confirm_modal.show {
    left: 50% !important;
    right: auto;
    transform: translateX(-50%) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .geo_confirm_header {
    padding: 16px 49px 16px 20px;
    font-size: 14px;
  }

  .geo_confirm_header h3 {
    font-size: 14px;
  }

  .geo_confirm_region {
    font-size: 16px;
  }

  .geo_confirm_buttons {
    padding: 12px 16px;
    gap: 10px;
  }

  .geo_confirm_btn {
    width: 139px;
    min-width: 139px;
    font-size: 14px;
  }
}

@media (max-width: 440px) {
  .geo_confirm_modal {
    position: fixed !important;
    top: 60px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: auto !important;
    max-width: 360px !important;
    z-index: 10000 !important;
  }

  .geo_confirm_modal.show {
    top: 60px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}

@media (max-width: 395px) {
  .geo_confirm_modal.show {
    width: 100% !important;
  }

  .geo_confirm_header {
    padding: 16px 20px;
  }

  .geo_confirm_buttons {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .geo_confirm_btn {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }
}

/* Выпадающее окно региона */
.region_modal {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all 0.25s ease;
  z-index: 1001;
}

.region_modal.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  max-width: none;
}

.modal_header {
  padding: 20px 43px 20px 20px;
  font-size: 15px;
  line-height: 1.5;
  color: #000000;
  border-bottom: 1px solid #eee;
  text-transform: none;
  font-size: 18px;
  font-weight: 400;
}

.modal_header strong {
  font-weight: 600;
}

.country_options {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  flex-wrap: nowrap;
}

@media (max-width: 768px) {
  .region_modal {
    width: auto;
    max-width: 360px;
    left: 50% !important;
    right: auto;
    transform: translateX(-50%) !important;
    margin-left: 0;
    margin-right: 0;
  }

  .region_modal.open {
    left: 50% !important;
    right: auto;
    transform: translateX(-50%) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .country_option span, .country_option.active span {
    font-size: 14px !important;
  }

  .modal_header {
    padding: 16px 49px 16px 20px;
    font-size: 14px;
  }

  .country_options {
    padding: 12px 16px;
    gap: 10px;
  }

  .mobile-menu-btn {
    padding: 15px !important;
    padding-left: 0px !important;
  }
}

@media (max-width: 420px) {
  /* Все элементы в country_options друг под другом */
 .region_modal.open {
  width: 100% !important;
 }

 .modal_header {
  padding: 16px 20px;
 }

  .region_modal.open .country_options {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  
  .region_modal.open .country_options .country_option,
  .region_modal.open .country_options .country_option.active,
  .region_modal.open .country_options .country_option[data-selected="true"] {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }
  
  .region_modal.open .country_options .close_btn {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
  }
  
  /* Плавно скрываем whatsapp и telegram при скролле вниз (когда icons.has-menu-btn) */
  /* Освобождаем место, чтобы call, apply и menu могли сдвигаться влево */
  .top_bar .icons.has-menu-btn a.whatsapp,
  .top_bar .icons.has-menu-btn a.telegram {
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    margin: 0 !important;
    margin-left: -4px !important; /* Компенсируем gap (4px при 768px и меньше) */
    padding: 0 !important;
    border: none !important;
    overflow: hidden !important;
    flex-shrink: 1 !important;
    flex-grow: 0 !important;
  }
  
  /* Телефон остается на своем месте, заявка сдвигается влево благодаря освобожденному месту */
  .top_bar .icons.has-menu-btn a.call {
    transform: translateX(0) !important;
  }
}

/* Убираем тень под флагом и выравниваем флаги слева в region_modal.open */
.region_modal.open .country_option,
.region_modal.open .country_option.active,
.region_modal.open .country_option[data-selected="true"] {
  justify-content: flex-start;
  padding-left: 8px;
}

.region_modal.open .country_option .flag {
  box-shadow: none;
}

.country_option {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0;
  cursor: pointer;
  border-radius: 8px;
  transition: all 0.2s;
  width: 139px;
  height: 40px;
  min-width: 139px;
  border: none;
  box-sizing: border-box;
  text-transform: none;
}

/* Базовые стили для кнопок - белый фон, красная рамка, красный текст */
.country_option {
  background: #FFFFFF;
  border: 1px solid #D2232A;
  color: #D2232A;
}

.country_option:hover {
  background: #FFF5F5;
}

.country_option span {
  color: #D2232A;
}

/* Выбранный регион - красный фон, белый текст */
.country_option.active,
.country_option[data-selected="true"] {
  background: #D2232A;
  border: 1px solid #D2232A;
  color: #FFFFFF;
}

.country_option.active span,
.country_option[data-selected="true"] span {
  color: #FFFFFF;
}

/* Ширина для России - 110px */
.country_option[data-country="Россия"],
.country_option[data-country="Россия"].active,
.country_option[data-country="Россия"][data-selected="true"] {
  width: 106px;
  min-width: 106px;
}

.country_option .flag {
  width: 22px;
  height: 22px;
  border-radius: 3px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  object-fit: contain;
  display: block;
  flex-shrink: 0;
}

/* Стили для эмодзи флага в модальном окне выбора региона */
.country_option .flag-emoji {
  font-size: 22px;
  line-height: 22px;
  display: inline-block;
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  text-align: center;
}

.country_option span {
  font-size: 16px;
  font-weight: 500;
  text-transform: none;
}

.close_btn {
  background: #FFFFFF;
  border: 2px solid #EFEFEF;
  cursor: pointer;
  width: 40px;
  height: 40px;
  min-width: 32px;
  flex-shrink: 0;
  border-radius: 4px;
  font-size: 24px;
  color: #D2232A;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  line-height: 1;
  padding: 0;
  margin-left: auto;
  font-weight: 300;
}

.close_btn:hover {
  background: #FFF5F5;
  color: #B81E24;
}

/* Поиск */
.search {
  flex: 1;
  max-width: 300px;
  min-width: 0;
  display: flex;
  align-items: center;
  background-color: #f4f4f5;
  border: 1px solid ;
  border-radius: 6px;
  padding: 8px 16px;
  flex-shrink: 1;
}

.search input {
  border: none;
  outline: none;
  width: 100%;
  font-size: 16px;
  color: #000000;
  background: transparent;
}

.search input::placeholder {
  color: #A1A1AA;
}

.search input:focus::placeholder {
  opacity: 0;
}

.search input:not(:placeholder-shown)::placeholder {
  color: #000000;
}

.search input:not(:placeholder-shown) {
  color: #000000;
}

.search button {
  background: #F4F4F5;
  border: none;
  cursor: pointer;
  color: #999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  border-radius: 2px;
}

.search button img {
  display: block;
  mix-blend-mode: multiply;
  opacity: 0.5;
}

.search input:not(:placeholder-shown) ~ button img,
.search input:focus ~ button img {
  opacity: 1;
}

.search-highlight {
  background-color: #ffeb3b;
  color: #000;
  padding: 2px 0;
  font-weight: 500;
}

/* Контакты */
.contacts {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 15px;
  font-weight: 500;
  color: #000000;
}

@media(max-width: 1195px) {
  /* Скрываем search, eye и lang в top_bar */
  .top_bar .search {
    display: none;
  }

  .top_bar .contacts .icons .eye,
  .top_bar .contacts .icons .lang {
    display: none;
  }

  /* Настраиваем nav-bar как flex-контейнер */
  .nav-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--side-padding);
  }

  /* Мобильное меню - скрываем обычное меню */
  .nav-bar ul {
    display: none !important;
  }

  /* Скрываем выпадающие меню на мобильных устройствах */
  .nav-bar > ul > li.dropdown > .dropdown-menu {
    display: none !important;
  }

  /* Показываем кнопку меню */
  .mobile-menu-btn {
    display: flex !important;
    align-items: center;
    gap: 10px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 24px;
    padding-left: 0;
    color: var(--color-white);
    font-family: "Roboto";
    font-weight: 500;
    font-size: 16px;
    position: relative;
    z-index: 10;
  }

  .mobile-menu-btn .menu-icon {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 25px;
    height: 18px;
    justify-content: space-between;
  }

  .mobile-menu-btn .menu-icon span {
    display: block;
    width: 100%;
    height: 3px;
    background-color: var(--color-white);
    transition: 0.3s;
    border-radius: 2px;
  }

  .mobile-menu-btn .menu-text {
    display: block;
    white-space: nowrap;
  }

  /* Всплывающий список при открытии меню */
  .nav-bar.mobile-menu-open ul {
    display: flex !important;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    right: 0;
    background: #fff !important;
    padding: 20px var(--side-padding);
    box-sizing: border-box;
    z-index: 1000;
    margin: 0;
    gap: 0;
  }

  .nav-bar.mobile-menu-open li {
    padding: 10px 24px;
    width: 100%;
    box-sizing: border-box;
    border-bottom: 1px solid #e5e5e5;
  }

  .nav-bar.mobile-menu-open li:last-child {
    border-bottom: none;
  }

  .nav-bar.mobile-menu-open li a {
    display: block;
    width: 100%;
    box-sizing: border-box;
    color: #000000 !important;
  }

  /* Убеждаемся, что dropdown пункты занимают всю ширину */
  .nav-bar.mobile-menu-open > ul > li.dropdown {
    width: 100% !important;
    box-sizing: border-box;
    position: relative;
  }

  /* Добавляем стрелку для dropdown пунктов на мобильных */
  .nav-bar.mobile-menu-open > ul > li.dropdown > a {
    position: relative;
    padding-right: 30px;
  }

  .nav-bar.mobile-menu-open > ul > li.dropdown > a::after {
    content: '▼';
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    transition: transform 0.3s ease;
    color: #000000 !important;
  }

  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > a::after {
    transform: translateY(-50%) rotate(180deg);
  }

  /* В мобильном меню выпадающие списки скрыты по умолчанию */
  .nav-bar.mobile-menu-open > ul > li.dropdown > .dropdown-menu {
    display: none !important;
    position: static !important;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none !important;
    box-shadow: none;
    border-radius: 0;
    margin-top: 0;
    margin-left: 0;
    padding: 0;
    background: transparent;
    min-width: auto;
    width: 100% !important;
    left: auto !important;
    right: auto !important;
  }

  /* Убираем псевдоэлемент стрелки на мобильных */
  .nav-bar.mobile-menu-open > ul > li.dropdown > .dropdown-menu::before {
    display: none !important;
  }

  /* Показываем выпадающее меню, когда dropdown имеет класс dropdown-open */
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu {
    display: block !important;
    position: static !important;
    width: 100% !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    max-width: 100% !important;
    background: #fff !important;
  }

  /* Стили для элементов внутри выпадающего меню на мобильных */
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li {
    padding: 8px 24px 8px 48px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    margin: 0 !important;
    list-style: none !important;
    border-bottom: 1px solid #e5e5e5 !important;
  }

  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li:last-child {
    border-bottom: none !important;
  }

  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li > a {
    color: #000000 !important;
    padding: 0 !important;
    font-size: 14px !important;
    display: block !important;
    width: 100% !important;
    white-space: normal !important;
    text-decoration: none !important;
  }

  /* Контейнер для элементов справа в nav-bar */
  .nav-bar-right {
    display: flex !important;
    align-items: center;
    gap: 12px;
  }

  /* Перемещаем search в nav-bar */
  .nav-bar .search {
    display: flex;
    max-width: 300px;
    flex: 1;
    background-color: #f4f4f5;
    border: 1px solid;
    border-radius: 6px;
    padding: 8px 16px;
  }

  .nav-bar .search input {
    display: block;
    border: none;
    outline: none;
    width: 100%;
    font-size: 16px;
    color: #000000;
    background: transparent;
  }

  .nav-bar .search input::placeholder {
    color: #A1A1AA;
  }

  .nav-bar .search input:focus::placeholder {
    opacity: 0;
  }

  .nav-bar .search input:not(:placeholder-shown)::placeholder {
    color: #000000;
  }

  .nav-bar .search input:not(:placeholder-shown) {
    color: #000000;
  }

  .nav-bar .search button {
    background: #F4F4F5;
    border: none;
    cursor: pointer;
    color: #999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 2px;
  }

  .nav-bar .search button img {
    display: block;
    mix-blend-mode: multiply;
    opacity: 0.5;
  }

  .nav-bar .search input:not(:placeholder-shown) ~ button img,
  .nav-bar .search input:focus ~ button img {
    opacity: 1;
  }

  /* Перемещаем eye и lang в nav-bar */
  .nav-bar .nav-icons {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .nav-bar .nav-icons a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: white;
    color: var(--color-white);
    font-size: 18px;
    transition: background 0.2s;
    padding: 0 !important;
    font-weight: normal;
  }

  .nav-bar .nav-icons a.eye {
    width: 40px;
    height: 40px;
    background-color: white;
    font-size: 0 !important;
    line-height: 0 !important;
    text-indent: -9999px;
    overflow: hidden;
    position: relative;
  }

  .nav-bar .nav-icons a.eye::before,
  .nav-bar .nav-icons a.eye::after {
    display: none !important;
  }

  .nav-bar .nav-icons a.eye img {
    display: block !important;
    width: 26px !important;
    height: 17px !important;
    object-fit: contain;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-indent: 0;
  }

  .lang_nav {
    color: rgba(113, 113, 122, 1);
  }

  .nav-bar .nav-icons a.lang {
    width: 50px;
    height: 40px;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.2) !important;
    background-color: white;
  }

  .nav-bar .nav-icons a:hover {
    background: rgba(255, 255, 255, 0.9);
  }
}

.contacts .phone {
  font-size: 20px;
  color: #000000;
  white-space: nowrap;
  padding-right: 40px;
}

.icons {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  transition: padding-right 0.3s ease;
}

.icons a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 6px;
  background: #eee;
  color: #000000;
  font-size: 18px;
  transition: transform 0.3s ease;
}

/* Когда кнопка видна, добавляем отступ справа для элементов */
.icons.has-menu-btn {
  padding-right: 0;
  transition: padding-right 0.3s ease;
}

.icons a.call {
  background-color: #D2232A;
  height: 40px;
  width: 40px;
  transform: translateX(0);
  transition: transform 0.3s ease;
}

.icons a.whatsapp {
  background-color: green;
  height: 40px;
  width: 40px;
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  overflow: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease, width 0.3s ease, margin 0.3s ease, padding 0.3s ease;
}

.icons a.telegram {
  background: #0088cc;
  color: #fff;
  height: 40px;
  width: 40px;
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  overflow: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease, width 0.3s ease, margin 0.3s ease, padding 0.3s ease;
}

.icons a.apply {
  width: 86px;
  height: 40px;
  background: #D2232A;
  color: #fff;
  font-size: 14px;
}

.icons a.eye {
  width: 40.2px;
  height: 40.2px;
  background-color: #f4f4f5;
  color: #71717a;
}

.icons a.lang {
  width: 50px;
  height: 40px;
  font-size: 14px;
  background-color: #f4f4f5;
  color: #71717a;
}

/* Кнопка меню в icons - скрыта по умолчанию */
.icons-menu-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #eee;
  border: none;
  cursor: pointer;
  border-radius: 6px;
  width: 30px;
  height: 30px;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 10;
  opacity: 0;
  visibility: hidden;
  transform: translateX(20px);
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
  padding: 0;
}

.icons-menu-btn.visible {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

/* Когда кнопка видна, добавляем отступ справа для контейнера */
/* padding-right для icons.has-menu-btn применяется на всех размерах */
/* На 420px и меньше - 34px, на 421px+ - тоже для сдвига элементов влево */
.icons.has-menu-btn {
  padding-right: 34px;
}

@media (max-width: 420px) and (min-width: 331px) {
  .icons.has-menu-btn {
    padding-right: 38px;
  }
}

.icons-menu-btn .menu-icon {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 16.3px;
  height: auto;
  justify-content: space-between;
  align-items: center;
}

.icons-menu-btn .menu-icon span {
  display: block;
  width: 16.3px;
  height: 0;
  border: 1.5px solid #828283;
  border-radius: 0;
  opacity: 1;
  background: transparent;
  transition: 0.3s;
}

/* ============================================
   НАВИГАЦИЯ (NAV)
   ============================================ */
.nav-bar {
  background: var(--color-red);
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  position: relative;
}

/* Скрыть кнопку меню по умолчанию (для больших экранов) */
.mobile-menu-btn {
  display: none;
}

/* Скрыть nav-bar-right на больших экранах */
.nav-bar-right {
  display: none;
}

.nav-bar ul {
  list-style: none;
  display: flex;
  justify-content: center;
  gap: 30px;
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--side-padding);
  box-sizing: border-box;
}

.nav-bar li {
  padding: 15px;
}

.nav-bar ul a {
  font-family: "Roboto";
  color: var(--color-white);
  font-weight: 500;
  padding: 3px 0px;
  display: block;
  transition: opacity 0.2s;
}

.nav-bar ul a:hover {
  opacity: 0.8;
}

/* Выпадающие меню в навигации */
.nav-bar > ul > li.dropdown {
  position: relative;
}

.nav-bar > ul > li.dropdown > .dropdown-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  min-width: 220px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  padding: 12px 0;
  list-style: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all 0.3s ease;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.nav-bar > ul > li.dropdown > .dropdown-menu::before {
  content: '';
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
}

/* Hover для dropdown работает только на 1196px+ */
@media (min-width: 1196px) {
  .nav-bar > ul > li.dropdown:hover > .dropdown-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%);
  }
}

.nav-bar > ul > li.dropdown > .dropdown-menu > li {
  padding: 0;
  margin: 0;
}

.nav-bar > ul > li.dropdown > .dropdown-menu > li > a {
  display: block;
  padding: 10px 20px;
  color: #000000;
  font-family: "Roboto";
  font-weight: 400;
  font-size: 14px;
  text-decoration: none;
  transition: background-color 0.2s, color 0.2s;
  white-space: nowrap;
}

.nav-bar > ul > li.dropdown > .dropdown-menu > li > a:hover {
  background-color: #f5f5f5;
  color: var(--color-red);
  opacity: 1;
}

@media (max-width: 1279px) {
  .nav-bar ul {
    gap: 10px;
  }
}

/* ============================================
   HERO СЕКЦИЯ (BLOCK1)
   ============================================ */
.block1 {
  position: relative;
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 100px var(--side-padding);
  padding-bottom: 0px;
  min-height: 600px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

.block1::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  margin-left: calc((100vw - 100%) / -2);
  background-image: url('/landing_2025/src/img/School.webp');
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  z-index: 0;
  transition: background-image 0.5s ease;
}

/* Динамический фон через реальный элемент */
.hero-background-dynamic {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  margin-left: calc((100vw - 100%) / -2);
  background-size: cover; /* По умолчанию cover для меньших экранов */
  background-position: center center !important; /* Центр картинки совпадает с центром блока */
  background-repeat: no-repeat;
  z-index: 0;
  pointer-events: none;
}

/* Скрываем ::before когда есть динамический элемент */
.block1:has(.hero-background-dynamic)::before {
  display: none;
}

@media (max-width: 768px) {
  .hero-background-dynamic {
    top: 0; /* Начинается с самого верха block1 */
    bottom: 140px; /* Заканчивается внизу hero-navigation (60px высота + 80px margin-top) */
    height: auto; /* Автоматическая высота от top до bottom */
    background-size: cover; /* Картинка покрывает всю область, не уменьшаясь */
    background-position: center center !important; /* Центр картинки совпадает с центром блока */
    width: 100vw; /* Полная ширина экрана */
  }
}

@media (max-width: 500px) {
  .hero-background-dynamic {
    background-size: 150%; /* Отдаляем картинку на 500px */
    background-position: center center !important; /* Центр блока совпадает с центром картинки */
  }
}

@media (max-width: 460px) {
  .hero-background-dynamic {
    background-position: center top !important; /* Поднимаем картинку выше на 460px */
  }
}

@media (max-width: 430px) {
  .hero-background-dynamic {
    background-size: cover !important; /* Прекращаем масштабирование, картинка просто сужается с экраном */
  }
}

/* Для промежуточных размеров (501px - 1439px) */
@media (min-width: 501px) and (max-width: 1439px) {
  .hero-background-dynamic {
    background-position: center center !important; /* Центр картинки совпадает с центром блока */
  }
}

@media (min-width: 1440px) {
  .hero-background-dynamic {
    left: 50%;
    margin-left: -50vw;
    width: 100vw;
    background-size: 100% auto !important; /* Картинка полностью видна по ширине на 1440px */
    background-position: center center !important; /* Центр картинки совпадает с центром блока */
  }
}

@media (min-width: 1440px) {
  .block1::before {
    left: 50%;
    margin-left: -50vw;
    width: 100vw;
  }
  
  .hero-background-dynamic {
    left: 50%;
    margin-left: -50vw;
    width: 100vw;
    background-size: 100% auto !important; /* Картинка полностью видна по ширине на 1440px */
    background-position: center center !important; /* Центр картинки совпадает с центром блока */
  }
}

.block1::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: var(--white-bg-height);
  margin-left: calc((100vw - 100%) / -2);
  background: var(--color-white);
  z-index: 1;
}

@media (min-width: 1440px) {
  .block1::after {
    left: 50%;
    margin-left: -50vw;
    width: 100vw;
  }
}


.hero-content {
  max-width: var(--content-width);
  width: 100%;
  position: relative;
  z-index: 2;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  position: relative;
  z-index: 2;
  flex: 1;
}

/* Hero Slider */
.hero-slider-wrapper {
  position: relative;
  width: 100%;
  max-width: var(--content-width);
  margin: 0 auto;
  margin-bottom: 40px;
  z-index: 2;
}

.hero-slides {
  position: relative;
  width: 100%;
  min-height: 292px;
}

.hero-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s ease, visibility 0.6s ease;
  z-index: 1;
}

.hero-slide.active {
  position: relative;
  opacity: 1;
  visibility: visible;
  z-index: 2;
}

.hero-slide-content {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-slide-content .hero-content {
  flex: none;
}

/* Hero Navigation Block */
.hero-navigation {
  position: relative;
  width: 100%;
  height: 60px;
  margin-top: 50px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.about_content {
  flex: 1;
  max-width: 600px;
}

.promo_text {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 50px;
  color: var(--color-black);
  margin-bottom: 40px;
}

/* На больших экранах: promo_text и promo_text2 вместе слева */
@media (min-width: 769px) {
  .hero-content {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
  }
  
  .about_content {
    flex: 1;
    max-width: 600px;
  }
  
  .promo_text_mobile {
    display: none;
  }
}

@media (min-width: 1131px) {
  .school_logo2 {
    flex-shrink: 0;
    margin-left: 40px;
    max-width: calc(50% - 20px); /* Не больше половины контейнера минус gap */
  }
  
  .school_logo2 img {
 /* Фиксированная высота для всех изображений */
    max-height: 286px;
  }
}

.promo_text2 {
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  color: var(--color-black);
}

.school_logo2 {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: calc(50% - 20px); /* Не больше половины контейнера, учитывая gap между элементами */
}

.school_logo2 img {
  max-width: 100%;
  height: 400px; /* Фиксированная высота для всех изображений */
  width: auto;
  object-fit: contain; /* Сохраняет пропорции */
}


/* Адаптивность для hero-content */
@media (max-width: 1130px) and (min-width: 769px) {
  .block1 {
    padding-top: 60px;
  }

  .hero-content {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .hero-navigation{
    margin-top: 45px;
  }
  
  .promo_text_desktop {
    margin-bottom: 20px;
    order: 2;
    max-width: 100%;
  }
  
  /* Скрываем br в promo_text_desktop на 1130px */
  .promo_text_desktop br {
    display: none;
  }
  
  .promo_text2 {
    order: 3;
    max-width: 100%;
  }
  
  /* Скрываем br в promo_text2 на 1130px */
  .promo_text2 br {
    display: none;
  }
  
  .school_logo2 {
    order: 1;
    margin-bottom: 20px;
  }
}

/* Скрываем мобильный текст по умолчанию */
.promo_text_mobile {
  display: none;
}

@media (max-width: 850px) {
  .block1 .nav-buttons {
    position: static;
    margin-top: 0;
    padding-top: 10px;
    padding-bottom: 40px;
    width: 100vw;
    margin-left: calc((100vw - 100%) / -2);
    margin-right: calc((100vw - 100%) / -2);
    z-index: 2;
    box-sizing: border-box;
    flex-wrap: wrap;
  }
}

@media (max-width: 768px) {
  .block1 .nav-buttons {
    width: 100vw !important;
    margin-left: calc((100vw - 100%) / -2) !important;
    margin-right: calc((100vw - 100%) / -2) !important;
    justify-content: center !important;
    align-items: stretch !important;
    background: var(--color-white);
    padding-top: 20px;
    padding-inline: 20px;
    padding-bottom: 0;
    position: relative;
    z-index: 3;
    box-sizing: border-box;
  }
  
  .nav-buttons {
    justify-content: center !important;
    align-items: stretch !important;
  }

  .top_bar {
    padding: 16px 20px !important;
  }

  .nav-bar {
    padding-inline: 20px;
  }
  
  .nav-buttons {
    padding-inline: 20px !important;
  }
  
  /* Изменяем все padding-inline и padding-left/right с 24px на 20px для всех контейнеров */
  .container,
  .block1,
  .block2,
  .block4,
  .block5,
  .block6,
  .block7,
  .block8,
  .block9,
  .block10,
  .block12,
  .block14,
  .block15,
  .block17,
  .block19,
  .block19_reviews,
  .block20_campuses,
  .block21,
  .block22,
  .block23,
  .block24,
  .block25 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  
  /* Для элементов с padding-inline */
  .block1 .nav-buttons {
    padding-inline: 20px !important;
  }
  
  /* Для элементов с padding: Xpx 24px */
  .block14_campus_btn,
  .block12_campus_btn,
  .block20_campus_btn,
  .form_campus_btn {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  
  /* Для элементов с прямым padding: Xpx 24px */
  .phone_modal,
  .phone_modal2,
  .campus_modal,
  .block12_campus_modal {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  
  /* Для modal_header вне region_modal */
  .modal_header:not(.region_modal .modal_header) {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  
  /* Для form_hover и form_hover_step2 */
  .form_hover,
  .block3 .form_hover,
  .block11 .form_hover,
  .block16 .form_hover,
  .block18 .form_hover,
  .block20 .form_hover {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  
  .form_hover_step2,
  .block3 .form_hover_step2,
  .block11 .form_hover_step2,
  .block16 .form_hover_step2,
  .block18 .form_hover_step2,
  .block20 .form_hover_step2 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  
  /* Иконки в info_school_2_carousel_container и advantages_grid - 105x105px */
  .info_school_2_carousel_container .info_school_2_icon {
    width: 105px !important;
    height: 105px !important;
  }
  
  .advantages_grid .icon {
    width: 105px !important;
    height: 105px !important;
  }
  
  /* Все инпуты и кнопки в form_hover_step2 - 14px */
  .form_hover_step2 input,
  .form_hover_step2 select,
  .form_hover_step2 button,
  .block3 .form_hover_step2 input,
  .block3 .form_hover_step2 select,
  .block3 .form_hover_step2 button,
  .block11 .form_hover_step2 input,
  .block11 .form_hover_step2 select,
  .block11 .form_hover_step2 button,
  .block16 .form_hover_step2 input,
  .block16 .form_hover_step2 select,
  .block16 .form_hover_step2 button,
  .block18 .form_hover_step2 input,
  .block18 .form_hover_step2 select,
  .block18 .form_hover_step2 button {
    font-size: 14px !important;
  }
  
  /* Все тексты в input_column_right - 14px */
  .input_column_right,
  .input_column_right *,
  .form_hover .input_column_right,
  .form_hover .input_column_right *,
  .block3 .input_column_right,
  .block3 .input_column_right *,
  .block11 .input_column_right,
  .block11 .input_column_right *,
  .block16 .input_column_right,
  .block16 .input_column_right *,
  .block18 .input_column_right,
  .block18 .input_column_right * {
    font-size: 14px !important;
  }
  
  /* capcha и его псевдоэлементы - 14px */
  .capcha,
  .capcha::before,
  .capcha::after,
  .form_hover .capcha,
  .form_hover .capcha::before,
  .form_hover .capcha::after,
  .block3 .capcha,
  .block3 .capcha::before,
  .block3 .capcha::after,
  .block11 .capcha,
  .block11 .capcha::before,
  .block11 .capcha::after,
  .block16 .capcha,
  .block16 .capcha::before,
  .block16 .capcha::after,
  .block18 .capcha,
  .block18 .capcha::before,
  .block18 .capcha::after,
  .block20 .capcha,
  .block20 .capcha::before,
  .block20 .capcha::after {
    font-size: 14px !important;
  }
}

@media (max-width: 768px) {
  /* Скрываем только ::before при 768px (убираем "Антибот:"), ::after оставляем (там вопрос через attr(data-question)) */
  .capcha::before,
  .form_hover .capcha::before,
  .block3 .capcha::before,
  .block11 .capcha::before,
  .block16 .capcha::before,
  .block18 .capcha::before,
  .block20 .capcha::before {
    content: none !important;
    display: none !important;
    height: 0 !important;
    line-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  
  /* Выравнивание колонок по верху при 768px */
  .input_column_left,
  .input_column_right {
    align-items: flex-start !important;
  }
  
  /* Убираем лишнее пространство в capcha при 768px и делаем высоту по тексту */
  .capcha,
  .form_hover .capcha,
  .block3 .capcha,
  .block11 .capcha,
  .block16 .capcha,
  .block18 .capcha,
  .block20 .capcha {
    line-height: 0 !important;
    margin: 0 !important;
    margin-bottom: 8px !important; /* Такой же отступ как у .number слева */
    padding: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: block !important;
  }
  
  .capcha::after,
  .form_hover .capcha::after,
  .block3 .capcha::after,
  .block11 .capcha::after,
  .block16 .capcha::after,
  .block18 .capcha::after,
  .block20 .capcha::after {
    margin: 0 !important;
    margin-bottom: 5px !important;
    padding: 0 !important;
    line-height: 1.286em !important;
    display: block !important;
  }
  
  /* Убираем все отступы у input_column_right при 768px */
  .input_column_right {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  
  /* Выравнивание элементов в input_column_right по верху */
  .input_column_right .capcha {
    align-self: flex-start !important;
  }
  
  /* Small (основной текст) - 14px, Roboto 400, line-height 1.286em */
  .region_btn,
  .search input,
  .modal_header,
  .phone_country_option span,
  .country_option span,
  .country_option.active span,
  .form_group label,
  .form_group input,
  .form_group select,
  .block7 .form_group input,
  .block7 .form_group select,
  .block7 .form_group input[type="tel"],
  .block18_form_row_top .form_step2_input_wrapper label,
  .block18_form_row_bottom .form_step2_input_wrapper label,
  .phone_flag_selector .phone-code,
  .phone_flag_selector .flag-arrow,
  .phone_number input,
  .capcha,
  .form_step2_input_wrapper label,
  .form_step2_select_arrow,
  .form_step2_input_wrapper .phone_number input,
  .form_step2_date input,
  .form_step2_alt_text,
  .campus_arrow,
  .campus_option span,
  .form_campus_arrow,
  .form_campus_option span,
  .phone_flag_selector input,
  .phone_modal input[type="tel"],
  .phone_modal2 input[type="tel"],
  .campus_modal input,
  .block12_campus_modal input,
  .block20 input {
    font-family: "Roboto", Arial, sans-serif !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 1.286em !important;
  }

  .phone_flag_selector {
    padding: 0 5px !important;
  }
  
  /* Main (большой текст) - 20px, Roboto 400, line-height 1.4em - НЕ меняем на 14px */
  .promo_text2,
  .info_jessica,
  .info_jessica_2,
  .subtitle {
    font-family: "Roboto", Arial, sans-serif !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 1.4em !important;
  }

  .info_jessica {
    font-weight: 700 !important;
  }
  
  /* info_main и info_main_mobile - 14px, Roboto 400, line-height 1.4em */
  .info_main,
  .info_main_mobile {
    font-family: "Roboto", Arial, sans-serif !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 1.4em !important;
    white-space: normal !important;
    word-wrap: normal !important;
    overflow-wrap: normal !important;
  }
  
  /* info_main_2 - 14px, Roboto 700, line-height 1.4em */
  .info_main_2 {
    font-family: "Roboto", Arial, sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    line-height: 1.4em !important;
  }
  
  /* b (жирный текст) - 20px, Roboto 700, line-height 1.172em */
  .info_school,
  .info_school_2,
  .advantage_card h3,
  .progamms {
    font-family: "Roboto", Arial, sans-serif !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    line-height: 1.172em !important;
  }
  
  /* Кнопки - 14px, Roboto 400, line-height 1.714em */
  .btn,
  .btn-text,
  .contacts .phone,
  .icons a,
  .alt_text,
  .campus_btn,
  .campus_btn #selectedCampus,
  .formSelectedCampus,
  .info_p,
  .step3_item,
  .block12_info,
  .block20 .alt_text,
  .number {
    font-family: "Roboto", Arial, sans-serif !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 1.714em !important;
  }
}

/* Для 768px: меняем порядок и текст */
@media (max-width: 768px) {
  .hero-slides .hero-content {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  
  .hero-slides .about_content {
    order: 0;
    display: contents;
  }
  
  .hero-slides .promo_text_desktop {
    display: none;
  }
  
  .hero-slides .promo_text_mobile {
    display: block;
    order: 1;
    margin-bottom: 0px;
    margin-top: 20px;
    font-size: 32px;
  }
  
  .hero-slides .school_logo2 {
    order: 2;
    margin: 20px 0;
  }

  .school_logo2 {
    max-width: 100%; /* На мобильных может занимать всю ширину */
  }
  
  .school_logo2 img {
    max-height: 136px;
    max-width: 100%;
  }
  
  .hero-slides .promo_text2 {
    order: 3;
    margin-top: 0;
  }
  
  /* Выравниваем тексты по левому краю при 768px */
  .promo_text,
  .promo_text_desktop,
  .promo_text_mobile,
  .promo_text2,
  .campuses,
  .subtitle,
  .hero-slides .promo_text,
  .hero-slides .promo_text_desktop,
  .hero-slides .promo_text_mobile,
  .hero-slides .promo_text2 {
    text-align: left !important;
  }
  
  .about_content {
    text-align: left !important;
  }
  
  .hero-content {
    text-align: left !important;
  }


  /* Делаем nav-buttons отдельным блоком под block1 */
  .block1 {
    padding-bottom: 0;
    position: relative;
  }
  
  .nav-buttons {
    justify-content: center !important;
    align-items: stretch !important;
  }

  /* Скрываем phone на 768px */
  .contacts .phone {
    display: none;
  }
  
  /* Сдвигаем region_wrapper вправо на 30px */
  .region_wrapper {
    margin-left: 30px;
  }
}

/* Для 1130px: аналогично 768px - картинка по середине, текст1 сверху, текст2 снизу */
@media (max-width: 1130px) and (min-width: 769px) {
  .hero-slide.active {
    display: flex;
    flex-direction: column;
    min-height: 100%;
  }
  
  .hero-slide.active .hero-slide-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 100%;
  }
  
  .hero-slides .hero-content {
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: space-between;
    flex: 1;
    min-height: 100%;
  }
  
  .hero-slides .about_content {
    order: 0;
    display: contents;
  }
  
  
  .hero-slides .school_logo2 {
    order: 2;
    margin: 20px 0;
  }
  
  .hero-slides .promo_text2 {
    order: 3;
    margin-top: 0;
  }
}

.nav-buttons {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: stretch;
  gap: 20px;
  flex-wrap: nowrap;
  position: relative;
  z-index: 2;
  max-width: var(--content-width);
  width: 100%;
  margin: 0 auto;
  margin-top: auto;
  padding-top: 40px;
}

/* При 768px и ниже: nav-buttons становится grid с 2 колонками (2 сверху, 2 снизу) */
@media (max-width: 768px) {
  .nav-buttons {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
  }
  
  .nav-buttons .btn {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: auto !important;
    height: auto !important;
    padding: 8px 12px !important;
  }
  
  .nav-buttons .btn-icon img {
    width: 20px !important;
    height: 20px !important;
  }
  
  .nav-buttons .btn-text {
    line-height: 1.2 !important;
  }
  
  /* Только первая буква кнопки с заглавной */
  .nav-buttons .btn-text::first-letter {
    text-transform: uppercase;
  }
  
  .nav-buttons .btn-text br {
    line-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}


.btn {
  background: var(--color-red);
  color: white;
  width: 270.52px;
  min-width: 0;
  flex-shrink: 1;
  min-height: var(--btn-height);
  height: 100%;
  padding: 14px 24px;
  border: none;
  border-radius: 6px;
  font-size: 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  transition: background 0.3s;
  box-sizing: border-box;
}

.btn:hover {
  background: var(--color-red-dark);
}

.btn-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: fit-content;
}

.btn-icon img {
  display: block;
  width: auto;
  height: auto;
  max-width: none;
  max-height: none;
  object-fit: contain;
  flex-shrink: 0;
}

.btn-text {
  font-family: "Roboto";
  font-weight: 400;
  font-size: 16px;
  text-align: left;
  line-height: 1.2;
  flex: 1;
}

/* Только первая буква кнопки с заглавной в nav-buttons */
.nav-buttons .btn-text::first-letter {
  text-transform: uppercase;
}

/* Убеждаемся, что br теги работают правильно на всех экранах (769px+) */
@media (min-width: 769px) {
  .btn-text {
    white-space: pre-line;
  }
  
  .btn-text br {
    display: block;
  }
  
  /* Для 769px+: показываем обычный текст capcha на одной строке */
  .form_hover .capcha,
  .block3 .form_content .capcha,
  .block11 .form_hover .capcha,
  .block16 .form_hover .capcha,
  .block18 .form_hover .capcha,
  .block20 .form_hover .capcha {
    font-size: 16px !important;
    white-space: normal !important;
  }
  
  .form_hover .capcha::before,
  .form_hover .capcha::after,
  .block3 .form_content .capcha::before,
  .block3 .form_content .capcha::after,
  .block11 .form_hover .capcha::before,
  .block11 .form_hover .capcha::after,
  .block16 .form_hover .capcha::before,
  .block16 .form_hover .capcha::after,
  .block18 .form_hover .capcha::before,
  .block18 .form_hover .capcha::after,
  .block20 .form_hover .capcha::before,
  .block20 .form_hover .capcha::after {
    content: none !important;
    display: none !important;
  }
  
  .form_hover .capcha .capcha_break,
  .block3 .form_content .capcha .capcha_break,
  .block11 .form_hover .capcha .capcha_break,
  .block16 .form_hover .capcha .capcha_break,
  .block18 .form_hover .capcha .capcha_break,
  .block20 .form_hover .capcha .capcha_break {
    display: none !important;
  }
}

/* Адаптивность для nav-buttons */

@media (max-width: 480px) {
  .btn {
    padding: 12px 20px;
    font-size: 18px;
    height: 100%;
  }
  
  .btn-text {
    font-size: 16px;
  }
  
  .btn-icon {
    flex-shrink: 0;
    min-width: fit-content;
  }
  
  .btn-icon img {
    flex-shrink: 0;
    display: block;
  }
}

/* Hero Slider Navigation */
.hero-arrow {
  position: relative;
  width: 38px;
  height: 38px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: all 0.3s ease;
  color: #5C5D5D;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}

.hero-arrow:hover {
  background: var(--color-white);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transform: scale(1.05);
}

.hero-arrow:active {
  transform: scale(0.95);
}

.hero-arrow svg {
  width: 24px;
  height: 24px;
}

/* Hero Pagination */
.hero-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  position: relative;
  z-index: 10;
}

.hero-pagination-bullet {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #CCCCCC;
  border: 2px solid #CCCCCC;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-block;
}

.hero-pagination-bullet:hover {
  background: rgba(255, 255, 255, 0.7);
  transform: scale(1.2);
}

.hero-pagination-bullet.active {
  background: var(--color-red);
  border-color: var(--color-red);
}

/* ============================================
   СЕКЦИЯ О ШКОЛЕ (BLOCK2)
   ============================================ */
.block2 {
  background-color: var(--color-white);
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding-inline: var(--side-padding);
  padding-top: 35px;
  box-sizing: border-box;
}

.info_content {
  max-width: var(--content-width);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  align-items: flex-start;
  gap: 15px;
}

.info_text_content {
  flex: 1;
  max-width: 700px;
}

.info_title {
  font-family: Lora;
  font-weight: 500;
  font-size: 32px;
  line-height: 50px;
  color: var(--color-black);
  margin-bottom: 15px;
}

.info_text {
  font-family: Lora, serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 36px;
  color: var(--color-black);
}

.info_text2 {
  font-family: Lora, serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.4;
  color: var(--color-black);
  margin-bottom: 30px;
}

/* Единый стиль для текста на всех устройствах */
.info_text2 {
  font-family: Lora, serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.4;
  color: var(--color-black);
  margin-bottom: 30px;
}

.info_columns {
  display: flex;
  flex-direction: row;
  width: 100%;
  align-items: stretch;
}

.info_column_left {
  flex: 1;
}

.info_column_right {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* Адаптивность для info_columns */
@media (max-width: 1023px) {
  .info_columns {
    flex-direction: row;
    align-items: stretch;
  }
  
  .info_column_left {
    flex: 1;
  }
  
  .info_column_right {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  
  .info_img {
    max-width: 300px;
    width: 100%;
  }
  
  .info_img_jessica {
    max-width: 100%;
    width: auto;
    height: auto;
  }
  
  .info_main_2 {
    margin-bottom: 30px;
  }
}

/* На 768px размещаем фото внизу блока */
@media (max-width: 768px) {
  /* Показываем info_column_right */
  .info_column_right {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }
  
  /* Убираем псевдоэлемент с фоном */
  .info_content::before {
    display: none !important;
  }
  
  /* Делаем info_columns колонкой, чтобы фото было внизу */
  .info_columns {
    flex-direction: column;
    align-items: stretch;
  }
  
  .info_column_left {
    width: 100%;
  }
  
  .info_column_right {
    width: 100%;
    order: 2; /* Размещаем справа внизу */
    justify-content: center;
    align-items: center;
    margin-top: 30px;
  }
  
  /* Фото по центру, размер 338x330 */
  .info_img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 338px;
    max-width: 338px;
    height: 330px;
    position: relative;
  }
  
  .info_img_jessica {
    width: 338px;
    max-width: 338px;
    height: 330px;
    object-fit: cover;
    object-position: center top;
    display: block;
  }
  
  /* Текст внизу фото при 768px */
  .info_img_text {
    position: absolute;
    bottom: 0px !important;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 30px) !important;
    max-width: 100%;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 6px !important;
    text-align: center;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
  }
  
  /* Прозрачный фон для изображения Рунара Салимуллина (узбекская версия) */
  .info_img_jessica[src*="Runar_Salimullin_transparent"],
  .info_img_jessica[alt="Runar Salimullin"] {
    background-color: transparent !important;
  }
  
  /* Весь текст в block2 - 14px */
  .block2,
  .block2 .info_text,
  .block2 .info_text2,
  .block2 .info_school,
  .block2 .info_school_2,
  .block2 .info_school_2 .link,
  .block2 .info_about,
  .block2 .info_main,
  .block2 .info_main_desktop,
  .block2 .info_main_mobile,
  .block2 .info_main_2,
  .block2 .info_jessica,
  .block2 .info_jessica_2 {
    font-size: 14px !important;
    white-space: normal !important;
    word-wrap: normal !important;
    overflow-wrap: normal !important;
  }

  .block2 .info_about {
    margin-top: 0;
  }

  .info_school_2_carousel {
    margin-bottom: 10px !important;
  }
  
  /* Убираем нижний отступ у block2 */
  .block2 {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 20px !important;
  }
}

.info_school {
  font-weight: 700;
  font-size: 20px !important;
  color: var(--color-black);
  margin-bottom: 20px;
}

/* Карусель info_school_2 - скрыта по умолчанию */
.info_school_2_carousel {
  display: none;
  width: 100%;
  margin-bottom: 30px;
  overflow: hidden;
}

.info_school_2_carousel_container {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  padding-bottom: 10px;
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  transition: scrollbar-color 0.3s ease;
}

.info_school_2_carousel_container:hover,
.info_school_2_carousel_container:active,
.info_school_2_carousel_container.scrolling {
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

.info_school_2_carousel_container::-webkit-scrollbar {
  height: 6px;
}

.info_school_2_carousel_container::-webkit-scrollbar-track {
  background: transparent;
}

.info_school_2_carousel_container::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 3px;
  transition: background 0.3s ease;
}

.info_school_2_carousel_container:hover::-webkit-scrollbar-thumb,
.info_school_2_carousel_container:active::-webkit-scrollbar-thumb,
.info_school_2_carousel_container.scrolling::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}

.info_school_2_carousel_container::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.3);
}

.info_school_2_carousel_container:active {
  cursor: grabbing;
}

.info_school_2_card {
  flex: 0 0 318px;
  width: 313px;
  background: #FFFFFF;
  border: 2px solid #E4E4E7;
  border-radius: 8px;
  padding: 24px 16px;
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: flex-start;
  box-sizing: border-box;
}

.info_school_2_icon {
  width: 80px;
  height: 80px;
  flex-shrink: 0;
}

.info_school_2_icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.info_school_2_text {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.4em;
  color: #000000;
  flex: 1;
  display: flex;
  align-items: flex-start;
}

/* На 760px и меньше: показываем карусель, скрываем список */
@media (max-width: 768px) {
  .info_school_2 {
    display: none !important;
  }
  
  .info_school_2_carousel {
    display: block !important;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    position: relative;
    overflow: visible;
  }
  
  .info_school_2_carousel_container {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
  
  .info_school_2_carousel_container .info_school_2_card:first-child {
    margin-left: var(--side-padding);
  }
  
  .info_school_2_carousel_container .info_school_2_card:last-child {
    margin-right: var(--side-padding);
  }
  
  /* Размер карточек на 768px: ширина 290px, высота по содержимому */
  .info_school_2_card {
    flex: 0 0 290px !important;
    width: 290px !important;
    height: auto !important; /* Высота по элементам */
    padding: 15px !important;
  }
}

/* Стили для info_school_2 (список) */
.info_school_2 {
  font-weight: 400;
  font-size: 16px;
  color: var(--color-red);
  margin-bottom: 30px;
  list-style: none;
  display: block;
  line-height: 1.6;
}

/* На 769px+: скрываем список info_school_2, показываем карточки info_school_2_carousel в ряд */
@media (min-width: 769px) {
  /* Скрываем список */
  .info_school_2 {
    display: none !important;
  }
  
  /* Показываем карусель */
  .info_school_2_carousel {
    display: block !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 30px;
    overflow: visible;
    position: static;
  }
  
  /* Убираем прокрутку, делаем карточки в ряд */
  .info_school_2_carousel_container {
    display: flex;
    flex-direction: row;
    gap: 20px;
    overflow: visible;
    padding-bottom: 0;
    cursor: default;
    scroll-behavior: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  
  /* Скрываем скроллбар */
  .info_school_2_carousel_container::-webkit-scrollbar {
    display: none;
  }
  
  /* Убираем стили карусели */
  .info_school_2_carousel_container:hover,
  .info_school_2_carousel_container:active,
  .info_school_2_carousel_container.scrolling {
    scrollbar-color: transparent transparent;
    cursor: default;
  }
  
  .info_school_2_carousel_container:active {
    cursor: default;
  }
  
  /* Карточки занимают равное пространство */
  .info_school_2_card {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
  }
  
  /* Убираем отступы для первой и последней карточки */
  .info_school_2_carousel_container .info_school_2_card:first-child {
    margin-left: 0;
  }
  
  .info_school_2_carousel_container .info_school_2_card:last-child {
    margin-right: 0;
  }
  
  /* Размер фото для нормального размещения карточек */
  .info_img {
    width: 260px !important;
    max-width: 260px !important;
    height: 311px !important;
  }
  
  .info_img_jessica {
    width: 260px !important;
    max-width: 260px !important;
    height: 311px !important;
    object-fit: cover;
    object-position: center top;
  }
  
  /* Стили для иконки info_school_2_icon */
  .info_school_2_icon {
    width: 70px !important;
    height: 70px !important;
  }
  
  /* Стили для текста info_school_2_text */
  .info_school_2_text {
    font-family: Roboto, Arial, sans-serif !important;
    font-weight: 700 !important;
    font-style: normal !important;
    font-size: 16px !important;
    line-height: normal !important;
    letter-spacing: 0% !important;
    color: #000000;
  }
  
  /* Размер шрифта для info_school, info_main, info_main_desktop, info_main_2 */
  .info_school {
    font-size: 16px !important;
  }
  
  .info_main,
  .info_main_desktop {
    font-size: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* Скрываем все br теги в info_main и info_main_desktop */
  .info_main br,
  .info_main_desktop br {
    display: none !important;
  }
  
  .info_main_2 {
    font-size: 16px !important;
  }
  
  /* Размер шрифта для элементов в info_img_text */
  .info_img_text .info_jessica,
  .info_img_text .info_jessica_2 {
    font-size: 16px !important;
  }
}

/* На 769px-1200px: объединяем info_about и info_img в один блок */
@media (min-width: 769px) and (max-width: 1200px) {
  /* Изменяем структуру info_columns - используем grid с одной колонкой */
  .info_columns {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    position: relative !important;
  }
  
  /* Делаем info_column_left grid-контейнером */
  .info_column_left {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  
  /* Размещаем все элементы до info_about на всю ширину */
  .info_column_left > .info_school,
  .info_column_left > .info_school_2,
  .info_column_left > .info_school_2_carousel {
    grid-column: 1 !important;
  }
  
  /* Убеждаемся, что info_school_2_carousel_container находится выше info_about */
  .info_school_2_carousel {
    margin-bottom: 30px !important;
  }
  
  /* Делаем info_about grid-контейнером с двумя колонками для объединения с info_img */
  .info_about {
    grid-column: 1 !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 20px !important;
    margin-top: 30px !important;
    margin-bottom: 0 !important;
    height: 311px !important; /* Высота как у фото */
    align-items: start !important;
    position: relative !important;
    padding-right: 280px !important; /* Место для изображения справа */
  }
  
  /* Текстовая часть в info_about слева */
  .info_about > p,
  .info_about > h2 {
    grid-column: 1 !important;
  }
  
  /* Убираем отступ снизу у info_main_2 */
  .info_about .info_main_2 {
    margin-bottom: 0 !important;
  }
  
  /* Размещаем info_column_right справа от info_about через абсолютное позиционирование, выравниваем по низу */
  .info_column_right {
    position: absolute !important;
    right: 0 !important;
    top: auto !important;
    bottom: 0 !important; /* Выравниваем по низу блока */
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    width: 260px !important;
    display: block !important;
  }
  
  /* Убираем отступы снизу у info_img */
  .info_column_right .info_img {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  
  /* При сужении экрана карточки переносятся на новую строку и растягиваются в высоту */
  .info_school_2_carousel_container {
    flex-wrap: wrap !important;
    align-items: stretch !important;
  }
  
  /* Карточки растягиваются в высоту при нехватке места */
  .info_school_2_card {
    flex: 1 1 calc(33.333% - 14px) !important; /* Примерно треть ширины минус gap */
    min-width: 200px !important; /* Минимальная ширина для переноса на новую строку */
    width: auto !important;
    max-width: none !important;
    height: auto !important; /* Высота автоматически подстраивается под содержимое */
    min-height: 100% !important; /* Минимальная высота - вся высота контейнера */
    align-self: stretch !important;
    align-items: flex-start !important; /* Внутренние элементы выравниваются по верху */
    box-sizing: border-box !important;
  }
  
  /* Текст внутри карточки растягивается и занимает доступное пространство */
  .info_school_2_card .info_school_2_text {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }
  
  /* Иконка остается фиксированной */
  .info_school_2_card .info_school_2_icon {
    flex-shrink: 0 !important;
  }
}

/* При 830px: уменьшаем padding у карточек */
@media (max-width: 830px) {
  .info_school_2_card {
    padding: 10px !important;
  }
}

.info_school_2 .item {
  margin-bottom: 10px;
}

.info_school_2 .item::before {
  content: "—";
  display: inline-block;
  margin-right: 8px;
  color: var(--color-red);
}

.info_school_2 .link {
  color: var(--color-black);
}

.info_about {
  margin-top: 30px;
}

.info_main {
  font-size: 20px;
  line-height: 28px;
  color: var(--color-black);
  margin-bottom: 20px;
  white-space: normal;
  word-wrap: normal;
  overflow-wrap: normal;
}

/* По умолчанию показываем desktop версию, скрываем mobile */
.info_main_desktop {
  display: block;
}

.info_main_mobile {
  display: none;
}

/* На 768px и меньше: показываем mobile версию, скрываем desktop */
@media (max-width: 768px) {
  .info_main_desktop {
    display: none;
  }
  
  .info_main_mobile {
    display: block;
  }
}

/* На 761px и больше: показываем desktop версию, скрываем mobile */
@media (min-width: 768px) {
  .info_main_desktop {
    display: block;
  }
  
  .info_main_mobile {
    display: none;
  }
}

.info_main_2 {
  font-weight: 700;
  font-size: 20px;
  color: var(--color-black);
  margin-bottom: 40px;
}

.info_img {
  flex-shrink: 0;
  text-align: center;
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.info_img_jessica {
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
  background-color: var(--color-white);
}

/* Прозрачный фон для изображения Рунара Салимуллина (узбекская версия) */
.info_img_jessica[src*="Runar_Salimullin_transparent"],
.info_img_jessica[alt="Runar Salimullin"] {
  background-color: transparent !important;
}

/* Стили для десктопа (1024px+) - одинаковые для всех версий */
@media (min-width: 1024px) {
  .info_column_right {
    flex-shrink: 0;
    max-width: 100%;
  }
  
  .info_img {
    width: 260px !important;
    max-width: 260px !important;
    height: 311px !important;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .info_img_jessica {
    width: 260px !important;
    max-width: 260px !important;
    height: 311px !important;
    object-fit: cover;
    object-position: center top;
    display: block;
  }
}

.info_img_text {
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  width: calc(100% - 30px);
  max-width: 100%;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 6px;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.info_jessica {
  font-weight: 700;
  font-size: 20px;
  color: #FFFFFF;
}

.info_jessica_2 {
  font-weight: 400;
  font-size: 20px;
  color: #FFFFFF;
}

/* ============================================
   ФОРМА ЗАПИСИ (BLOCK3)
   ============================================ */
.block3 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  text-align: center;
  box-sizing: border-box;
}

.form_bg {
  position: relative;
  width: 100vw;
  max-width: none;
  min-height: 300px;
  height: auto;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  overflow: visible;
}

.form_bg img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
  pointer-events: none;
}

@media (min-width: 1440px) {
  .form_bg img {
    object-fit: cover;
    object-position: center;
  }
}

/* Медиа-запросы для адаптивности */
@media (max-width: 1023px) {
  
  .form_bg {
    width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
  }
  
  .form_hover {
    padding: clamp(20px, 4vw, 30px) 24px !important;
  }
  
  /* Убираем .block20 .form_hover отсюда, так как для него есть отдельные правила в 402px и 373px */
  
  .form_hover_step2 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  
  .input_group {
    max-width: 100%;
    gap: clamp(10px, 2vw, 20px);
  }
}

/* Дополнительное правило для 768px */
@media (max-width: 768px) {
  .form_hover {
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box;
  }
  
  
  .form_hover_step2 {
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box;
  }
  
  /* Исправление для input_group - чтобы не выходил за рамки form_hover и form_content */
  .form_content .input_group,
  .form_hover .input_group,
  .block3 .form_content .input_group,
  .block20 .form_hover .input_group,
  .block11 .form_hover .input_group,
  .block16 .form_hover .input_group,
  .block18 .form_hover .input_group {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0;
    margin-left: 0;
    margin-right: 0;
    min-width: 0; /* Позволяет grid-элементам сжиматься */
    grid-template-columns: max-content 1fr; /* Две колонки - как в оригинале */
    align-items: start; /* Выравнивание элементов по верху */
  }
  
  /* Исправление для колонок внутри input_group */
  .form_content .input_group .input_column_left,
  .form_content .input_group .input_column_right,
  .form_hover .input_group .input_column_left,
  .form_hover .input_group .input_column_right,
  .block3 .form_content .input_group .input_column_left,
  .block3 .form_content .input_group .input_column_right,
  .block20 .form_hover .input_group .input_column_left,
  .block20 .form_hover .input_group .input_column_right,
  .block11 .form_hover .input_group .input_column_left,
  .block11 .form_hover .input_group .input_column_right,
  .block16 .form_hover .input_group .input_column_left,
  .block16 .form_hover .input_group .input_column_right,
  .block18 .form_hover .input_group .input_column_left,
  .block18 .form_hover .input_group .input_column_right {
    min-width: 0; /* Позволяет элементам сжиматься */
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden; /* Предотвращает выход содержимого за рамки */
  }
}


.form_hover {
  position: relative;
  z-index: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 100%;
  padding: clamp(20px, 4vw, 40px) clamp(15px, 3vw, 20px);
  box-sizing: border-box;
  overflow: visible;
}

.form_txt {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: clamp(28px, 5vw, 32px);
  line-height: 1.2;
  color: var(--color-black);
  margin-bottom: 24px;
  text-align: center;
  width: 100%;
}

.input_group {
  display: grid;
  justify-content: center;
  grid-template-columns: max-content 1fr;
  gap: clamp(15px, 3vw, 20px);
  margin-bottom: clamp(20px, 3vw, 30px);
  width: 100%;
  max-width: min(750px, 100%);
  box-sizing: border-box;
}

.input_column_left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: auto;
  min-width: max-content;
  max-width: 100%;
}

.input_column_right {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  width: 100%;
}

.input_submit_wrapper {
  display: flex;
  gap: 0;
  width: 100%;
}

.number {
  font-weight: 400;
  font-size: 16px;
  color: var(--color-black);
  display: block;
  margin-bottom: 8px;
}

.required {
  color: #dc3545 !important;
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Универсальное правило для всех звездочек */
span.required,
.required {
  color: #dc3545 !important;
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  font-size: inherit !important;
  line-height: inherit !important;
  background: transparent !important;
  text-shadow: none !important;
}

/* Специфичный стиль для звездочек в form_hover_step2 */
/* Специфичный стиль для звездочек в form_hover_step2 - максимальная специфичность */
.form_step2_input_wrapper label .required,
.form_step2_input_wrapper label span.required,
.form_hover_step2 label .required,
.form_hover_step2 label span.required,
.block3 .form_step2_input_wrapper label .required,
.block3 .form_step2_input_wrapper label span.required,
.block3 .form_hover_step2 label .required,
.block3 .form_hover_step2 label span.required,
.block11 .form_step2_input_wrapper label .required,
.block11 .form_step2_input_wrapper label span.required,
.block11 .form_hover_step2 label .required,
.block11 .form_hover_step2 label span.required,
.block16 .form_step2_input_wrapper label .required,
.block16 .form_step2_input_wrapper label span.required,
.block16 .form_hover_step2 label .required,
.block16 .form_hover_step2 label span.required,
.block18 .form_step2_input_wrapper label .required,
.block18 .form_step2_input_wrapper label span.required,
.block18 .form_hover_step2 label .required,
.block18 .form_hover_step2 label span.required,
label .required,
label span.required,
.number .required,
.number span.required,
label.number .required,
label.number span.required,
span.required {
  color: #dc3545 !important;
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  font-size: inherit !important;
  line-height: inherit !important;
  background: transparent !important;
  text-shadow: none !important;
}

.phone_wrapper {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  height: 48px;
  background: #fff;
  border: 1px solid #fff;
  border-radius: 8px;
  overflow: visible;
  position: relative;
}

/* phone_modal_wrapper всегда выравнивается по левому краю phone_wrapper */
.phone_wrapper .phone_flag_selector .phone_modal_wrapper {
  left: 0 !important;
  transform: none !important;
}

.phone_flag_selector_wrapper {
  position: relative;
  display: block;
  flex-shrink: 0;
  min-width: 75px; /* Фиксируем ширину под +998 */
  width: 75px; /* Фиксируем ширину под +998 */
}

.phone_flag_selector {
  padding: 0 8px;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  height: 48px;
  cursor: pointer;
  position: relative;
  box-sizing: border-box;
  flex-wrap: nowrap;
}

.huesos {
  display: flex;
}


.phone_flag_selector .phoneFlagImg {
  position: relative;
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  flex-shrink: 0;
  object-fit: contain;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  align-self: center;
}

.phone_flag_selector .phone-code {
  font-size: 16px;
  color: var(--color-black);
  font-weight: 400;
  line-height: 1.5;
  white-space: nowrap;
  display: inline-block;
  align-self: center;
}

.phone_flag_selector .flag-arrow {
  color: #D2232A;
  font-size: 17px;
  margin-left: auto;
  transition: transform 0.2s;
  line-height: 1;
  flex-shrink: 0;
  display: inline-block;
  align-self: center;
}

.phone_flag_selector.active .flag-arrow {
  transform: rotate(180deg);
}

/* Выпадающее окно для выбора кода страны */
.phone_flag_selector .phone_modal_wrapper {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  transform: none;
  z-index: 10000;
  pointer-events: none;
}

.phone_flag_selector.active .phone_modal_wrapper {
  pointer-events: auto;
}

@media (max-width: 768px) {
  .phone_wrapper {
    position: relative;
  }

  .phone_flag_selector .phone_modal_wrapper {
    position: absolute;
    left: 0;
    right: auto;
    transform: none;
    width: min(280px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    padding: 0;
    box-sizing: border-box;
  }

  .phone_flag_selector .phone_modal_wrapper .phone_modal {
    width: 100%;
    max-width: 100%;
    margin: 0;
  }
}

.phone_modal {
  width: min(280px, calc(100vw - 40px));
  max-width: 280px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all 0.25s ease;
}

.phone_modal.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.phone_modal_header {
  padding: 20px 24px;
  padding-right: 60px; /* Добавляем место для кнопки закрытия */
  font-size: 15px;
  line-height: 1.5;
  color: #000000;
  border-bottom: 1px solid #eee;
  text-transform: none;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.phone_country_options {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  flex-wrap: wrap;
  max-height: 300px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: #ccc #f5f5f5;
}

.phone_country_options::-webkit-scrollbar {
  width: 6px;
}

.phone_country_options::-webkit-scrollbar-track {
  background: #f5f5f5;
  border-radius: 3px;
}

.phone_country_options::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 3px;
}

.phone_country_options::-webkit-scrollbar-thumb:hover {
  background: #999;
}

.phone_country_option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 24px;
  cursor: pointer;
  transition: 0.2s;
  position: relative;
  flex: 0 0 calc(50% - 6px);
  min-width: 0;
  box-sizing: border-box;
  width: calc(50% - 6px);
}

.phone_country_option:hover {
  background: #f9f9f9;
}

.phone_country_option .flag {
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  border-radius: 3px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  object-fit: contain;
  display: block;
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  align-self: center;
  position: relative;
}

.phone_country_option span {
  font-size: 16px;
  font-weight: 500;
  color: #000000;
  line-height: 1.5;
  white-space: nowrap;
  margin: 0;
  padding: 0;
  display: inline-block;
  align-self: center;
}

.phone_close_btn {
  background: none;
  border: none;
  cursor: pointer;
  width: 32px;
  height: 32px;
  min-width: 32px;
  flex-shrink: 0;
  border-radius: 50%;
  font-size: 24px;
  color: #999;
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  display: flex !important;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  line-height: 1;
  padding: 0;
  margin: 0;
  z-index: 10;
}

.phone_close_btn:hover {
  background: #f0f0f0;
  color: #666;
}



.phone_number {
  display: inline-flex;
  width: auto;
  flex: 1;
  min-width: 0;
  background: transparent;
  border-radius: 0 8px 8px 0;
  overflow: hidden;
}

input[type="tel"] {
  width: 12ch;
  border: none;
  padding: 12.5px 10px 9px 30px;
  font-size: 16px;
  outline: none;
  box-sizing: content-box;
  background: transparent;
  border-radius: 0 8px 8px 0;
}

input[type="tel"]::placeholder {
  color: #adb5bd;
}

.capcha {
  font-weight: 400;
  font-size: 16px;
  color: var(--color-black);
  display: block;
  margin-bottom: 8px;
}

.comment {
  flex: 1;
  min-width: 0;
  height: 49px;
  font-size: 16px;
  border: 1px solid #fff;
  border-radius: 8px 0 0 8px;
  border-right: none;
  padding: 14px 16px;
  outline: none;
}

.submit {
  background: #dc3545;
  color: white;
  border: none;
  min-width: 99px;
  width: 99px;
  height: 49px;
  font-size: 17px;
  font-weight: 500;
  border-radius: 0 8px 8px 0;
  cursor: pointer;
  transition: background 0.2s;
  flex-shrink: 0;
  opacity: 1 !important;
}

/* Кнопка в block20 - увеличиваем ширину для текста "Подписаться" */
.block20 .submit {
  min-width: 140px;
  width: auto;
  padding: 0 16px;
  white-space: nowrap;
}

.submit:hover:not(:disabled) {
  background: #c82333;
}

.submit:disabled {
  opacity: 1 !important;
  cursor: not-allowed;
  background: #dc3545;
}

.alt_text {
  font-weight: 400;
  font-size: 16px;
  color: var(--color-black);
  margin-top: 30px;
  text-align: left;
}

.alt_text a {
  color: #dc3545;
  text-decoration: none;
  white-space: nowrap;
  display: inline-block;
}

.alt_text a:hover {
  text-decoration: underline;
}

/* ============================================
   ВТОРАЯ СТРАНИЦА ФОРМЫ (STEP 2)
   ============================================ */
.form_hover_step2 {
  position: relative;
  z-index: 1;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 100%;
  padding-top: 65px;
  padding-bottom: 90px;
  padding-left: clamp(15px, 3vw, 20px);
  padding-right: clamp(15px, 3vw, 20px);
  box-sizing: border-box;
  overflow: visible;
}

.form_step2_content {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 30px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
}

.form_step2_left {
  display: flex;
  flex-direction: row;
  gap: 30px;
  align-items: flex-start;
  flex-wrap: nowrap;
  flex: 1;
  min-width: 0;
}

.form_step2_content_wrapper {
  display: flex;
  flex-direction: column;
  gap: 35px;
  flex: 1;
  min-width: 0;
}

.form_step2_fields_wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
  flex: 1;
  min-width: 0;
}

/* По умолчанию показываем старые row на десктопе */
.form_step2_row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  align-items: stretch !important; /* Все ячейки растягиваются по высоте */
}

/* Скрываем новые колонки по умолчанию */
.form_step2_left_column,
.form_step2_right_column {
  display: none;
}

.form_step2_campus_image_wrapper {
  display: none;
}

/* На десктопе (769px+) - порядок полей: Телефон, Родитель, Email | Ребенок, Дата, Кампус */
@media (min-width: 769px) {
  .form_step2_row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    align-items: stretch !important; /* Все ячейки растягиваются по высоте */
  }
  
  .form_step2_field_parent {
    order: 2;
  }
  
  .form_step2_field_phone {
    order: 1;
  }
  
  .form_step2_field_email {
    order: 3;
  }
  
  .form_step2_field_child {
    order: 4;
  }
  
  .form_step2_field_birth {
    order: 5;
  }
  
  .form_step2_field_campus {
    order: 6;
  }
  
  .form_step2_left_column,
  .form_step2_right_column {
    display: none !important;
  }
  
  .form_step2_campus_image_wrapper {
    display: none !important;
  }
}

.form_step2_row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  align-items: stretch !important; /* Все ячейки растягиваются по высоте */
}

.form_step2_input_wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%; /* Занимаем всю высоту ячейки grid */
}

/* Выравниваем инпуты и селекторы по низу блока */
.form_step2_input_wrapper input,
.form_step2_input_wrapper select,
.form_step2_input_wrapper .phone_wrapper,
.form_step2_input_wrapper .form_step2_select_container {
  margin-top: auto !important; /* Прижимаем к низу */
}

.form_step2_input_wrapper label {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #000000;
  text-align: left;
}

/* Убеждаемся, что звездочки видны и красные - как в block7 */
.form_step2_input_wrapper label[for="phone_step2_1"] .required,
.form_step2_input_wrapper label[for="phone_step2_2"] .required,
.form_step2_input_wrapper label[for="phone_step2_3"] .required,
.form_step2_input_wrapper label[for="phone_step2_4"] .required,
.form_step2_input_wrapper label[for="parent_name_1"] .required,
.form_step2_input_wrapper label[for="parent_name_2"] .required,
.form_step2_input_wrapper label[for="parent_name_3"] .required,
.form_step2_input_wrapper label[for="parent_name_4"] .required,
.form_step2_input_wrapper label[for="email_1"] .required,
.form_step2_input_wrapper label[for="email_2"] .required,
.form_step2_input_wrapper label[for="email_3"] .required,
.form_step2_input_wrapper label[for="email_4"] .required,
.form_step2_input_wrapper label[for="campus_1"] .required,
.form_step2_input_wrapper label[for="campus_2"] .required,
.form_step2_input_wrapper label[for="campus_3"] .required,
.form_step2_input_wrapper label[for="campus_4"] .required,
.form_hover_step2 label .required,
.form_hover_step2 label span.required {
  color: #dc3545 !important;
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  font-size: inherit !important;
  line-height: inherit !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  text-indent: 0 !important;
  clip: auto !important;
  overflow: visible !important;
}

.form_step2_input_wrapper input,
.form_step2_input_wrapper select {
  width: 100%;
  height: 49px;
  font-size: 16px;
  border: 1px solid #fff;
  border-bottom: 2px solid #D2232A;
  border-radius: 8px;
  padding: 0px 10px 2px 45px;
  outline: none;
  background: #fff;
  box-sizing: border-box;
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  color: #000000;
  line-height: 21px;
  vertical-align: middle;
}


.form_step2_input_wrapper input:read-only {
  background: #f5f5f5;
  cursor: not-allowed;
}

.form_step2_select_wrapper {
  position: relative;
}

.form_step2_select_container {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 49px;
  border: 1px solid #fff;
  border-bottom: 2px solid #D2232A;
  border-radius: 8px;
  background: #fff;
  box-sizing: border-box;
}

.form_step2_select_container select {
  flex: 1;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  border: none;
  outline: none;
  padding: 0px 16px;
  padding-right: 10px;
  cursor: pointer;
  background: transparent;
  font-size: 16px;
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  color: #000000;
  line-height: 21px;
  height: 100%;
  box-sizing: border-box;
}

.form_step2_select_container select option {
  padding: 0 20px;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.171875em;
  color: #231F20;
  min-height: 36px;
  height: 36px;
  background: #fff;
}

.form_step2_select_container select option:checked {
  background: #EFEFEF;
  font-weight: 700;
}

.form_step2_select_container select option:hover {
  background: #f9f9f9;
}

.form_step2_select_arrow {
  color: #D2232A;
  font-size: 17px;
  line-height: 1;
  flex-shrink: 0;
  display: inline-block;
  align-self: center;
  padding-right: 16px;
  pointer-events: none;
}

#campus_1,
#campus_2 {
  width: 100%;
}

.form_step2_input_wrapper .phone_wrapper {
  width: 100%;
  height: 49px;
  border-bottom: 2px solid #D2232A;
}

.form_step2_input_wrapper .phone_number {
  padding-left: 30px;
}

.form_step2_input_wrapper .phone_number input {
  height: 49px;
  font-size: 16px;
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  color: #000000;
  border-bottom: none;
  padding-left: 10px !important;
  padding-right: 10px;
  padding-top: 12.5px;
  padding-bottom: 9px;
}


.form_step2_input_wrapper input:focus,
.form_step2_input_wrapper select:focus {
  border-color: #dc3545;
}

/* Скрываем placeholder при focus для всех инпутов в формах */
.form_step2_input_wrapper input:focus::placeholder,
.download_form input:focus::placeholder,
.form_group input:focus::placeholder {
  opacity: 0;
}

.form_step2_input_wrapper input.error,
.form_step2_input_wrapper select.error {
  border-color: #dc3545;
}

.form_step2_bottom {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
}

/* На десктопе (769px+) делаем grid layout: submit слева (1 колонка), text справа (2 колонки) */
@media (min-width: 769px) {
  .form_step2_bottom {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    align-items: center;
  }
  
  .form_step2_submit {
    grid-column: 1;
    width: 100% !important;
    min-width: 0;
  }
  
  .form_step2_alt_text {
    grid-column: 2 / 4;
    width: 100% !important;
    min-width: 0;
  }
}

.form_step2_submit {
  background: #dc3545;
  color: white;
  border: none;
  border-bottom: 2px solid #D2232A;
  width: calc((100% - 40px) / 3);
  height: 39px;
  font-size: 16px;
  font-weight: 400;
  font-family: Roboto, Arial, sans-serif;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s;
  padding: 0 30px;
  box-sizing: border-box;
  line-height: 21px;
  flex-shrink: 0;
  opacity: 1 !important;
}

.form_step2_submit:hover {
  background: #c82333;
}

.form_step2_alt_text {
  font-weight: 400;
  font-size: 16px;
  color: var(--color-black);
  margin: 0;
  text-align: left;
}

.form_step2_alt_text a {
  color: #dc3545;
  text-decoration: none;
  white-space: nowrap;
  display: inline-block;
}

.form_step2_alt_text a:hover {
  text-decoration: underline;
}

.form_step2_image {
  flex-shrink: 0;
  width: 233px;
  height: 261px;
  z-index: 2;
  display: block;
  position: relative;
  align-self: flex-start;
  margin-top: 0;
}

.form_step2_image img {
  width: 233px !important;
  height: 261px !important;
  border-radius: 12px;
  /* filter: brightness(1.4) contrast(1.25) !important; */
  display: block;
}

.form_step2_caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 12px 16px;
  border-radius: 0 0 12px 12px;
  font-family: Roboto, Arial, sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 16px;
  color: #FFFFFF;
  text-align: center;
  z-index: 3;
  /* Тёмная полупрозрачная подложка для читаемости текста */
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

@media (max-width: 1024px) {
  
  .form_step2_row {
    grid-template-columns: 1fr;
    gap: 15px;
    align-items: stretch !important; /* Все ячейки растягиваются по высоте */
  }
  
  .form_step2_bottom {
    flex-direction: column;
    align-items: flex-start;
  }
  
  .form_step2_submit {
    width: 100%;
  }
  
  .form_step2_image {
    width: 100%;
    max-width: 233px;
    height: 261px;
    margin: 20px auto 0;
  }
  
  .form_step2_image img {
    max-width: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media (max-width: 768px) {
  /* Скрываем фото во всех блоках с form_hover_step2 */
  .form_hover_step2 .form_step2_image,
  .block18 .form_hover_step2 .form_step2_image,
  .block3 .form_hover_step2 .form_step2_image,
  .block11 .form_hover_step2 .form_step2_image,
  .block16 .form_hover_step2 .form_step2_image {
    display: none !important;
  }
  
  /* Новая структура полей: 2 колонки (3 слева, 3 справа) */
  .form_step2_fields_wrapper {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  
  .form_step2_row {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px;
    align-items: stretch !important; /* Все ячейки растягиваются по высоте */
  }
  
  /* Padding для всех блоков в form_step2_row */
  
  /* Порядок полей на мобильных: Родитель, Телефон, Email | Ребенок, Дата, Кампус */
  .form_step2_field_parent {
    order: 1;
  }
  
  .form_step2_field_phone {
    order: 2;
    justify-content: space-between;
  }
  
  .form_step2_field_email {
    order: 3;
  }
  
  .form_step2_field_child {
    order: 4;
  }
  
  .form_step2_field_birth {
    order: 5;
  }
  
  .form_step2_field_campus {
    order: 6;
    justify-content: space-between;
  }
  
  /* Убираем padding-left у phone_number */
  .form_step2_input_wrapper .phone_number {
    padding-left: 0 !important;
  }
  
  /* Изменяем внутренний отступ у инпутов и кнопок в form_step2_row с 45px на 10px */
  .form_step2_row input[type="text"],
  .form_step2_row input[type="email"],
  .form_step2_row input[type="tel"],
  .form_step2_row select {
    padding-left: 10px !important;
  }
  
  .form_step2_row .form_step2_submit {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  
  /* Белый цвет текста для label в form_step2_row в block18 */
  .block18 .form_step2_row .form_step2_input_wrapper label {
    color: #FFFFFF !important;
  }
  
  /* Обновляем лейблы для мобильных */
  .form_step2_field_parent label {
    content: "Фамилия Имя Родителя";
  }
  
  .form_step2_left_column,
  .form_step2_right_column {
    display: none !important;
  }
  
  /* Показываем новое фото кампуса на мобильных - усиленная специфичность */
  .form_step2_bottom .form_step2_campus_image_wrapper,
  .form_hover_step2 .form_step2_campus_image_wrapper,
  .form_step2_content_wrapper .form_step2_campus_image_wrapper {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    position: relative !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    margin-top: 20px !important;
    height: auto !important;
    min-height: 269px !important;
  }
  
  .form_step2_campus_image {
    width: 100%;
    height: 269px;
    object-fit: cover;
    display: block;
  }
  
  .form_step2_campus_image_overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px 27px;
    /* Тёмная полупрозрачная подложка для читаемости текста */
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  
  .form_step2_campus_name {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: #FFFFFF;
    line-height: 1.2857142857142858em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  }
  
  .form_step2_campus_info_icon {
    width: 36px;
    height: 36px;
    border-radius: 6px;
    border: 1px solid #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: Roboto, Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: #FFFFFF;
    flex-shrink: 0;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease;
  }
  
  .form_step2_campus_info_icon:hover {
    opacity: 0.8;
    transform: scale(1.05);
  }
  
  .form_step2_campus_info_icon:active {
    transform: scale(0.95);
  }
  
  .form_step2_campus_info_icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    pointer-events: none;
  }
  
  /* Убеждаемся, что form_step2_alt_text внизу */
  .form_step2_bottom {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    width: 100% !important;
    align-items: stretch !important;
  }
  
  /* Убеждаемся, что фото кампуса видно */
  .form_step2_bottom .form_step2_campus_image_wrapper {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    position: relative !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    margin-top: 20px !important;
    height: auto !important;
    min-height: 269px !important;
  }
  
  .form_step2_alt_text {
    order: 3;
    margin-top: 0;
  }
}

/* ============================================
   BLOCK11: Получить консультацию
   ============================================ */
.block11 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  text-align: center;
  box-sizing: border-box;
}

@media (min-width: 1440px) {
  .block11 .form_bg img {
    object-fit: cover;
    object-position: center;
  }
}

/* Медиа-запросы для адаптивности */
@media (max-width: 1023px) {

  .block11 .form_bg {
    width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
  }
  
  .block11 .form_hover {
    padding: clamp(20px, 4vw, 30px) clamp(10px, 3vw, 15px);
  }
  
  .block11 .input_group {
    gap: clamp(10px, 2vw, 20px);
  }
}


.block16 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  text-align: center;
  box-sizing: border-box;
}

@media (min-width: 1440px) {
  .block16 .form_bg img {
    object-fit: cover;
    object-position: center;
  }
}

/* Медиа-запросы для адаптивности */
@media (max-width: 1023px) {
  
  .block16 .form_bg {
    width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
  }
  
  .block16 .form_hover {
    padding: clamp(20px, 4vw, 30px) clamp(10px, 3vw, 15px);
  }
  
  .block16 .input_group {
    gap: clamp(10px, 2vw, 20px);
  }
}


/* ============================================
   FAQ (BLOCK17)
   ============================================ */
.block17 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 50px var(--side-padding) 60px;
  box-sizing: border-box;
}

.block17_container {
  max-width: 1140px;
  margin: 0 auto;
}

.block17_title {
  text-align: center;
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  margin-bottom: 35px;
  color: #000000;
}

.block17_content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}

.block17_column {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.block17_accordion_item {
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  overflow: hidden;
}

.block17_accordion_header {
  padding: 13px 20px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background-color 0.3s;
  position: relative;
}

.block17_accordion_header > * {
  flex: 1;
  padding-right: 50px;
  min-width: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.block17_accordion_header:hover {
  background-color: #ebebeb;
}

.block17_accordion_header::before {
  content: "";
  position: absolute;
  width: 18px;
  height: 2px;
  background-color: #D9D9D9;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.3s;
}

.block17_accordion_header::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 18px;
  background-color: #D9D9D9;
  right: 28px;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.3s;
}

.block17_accordion_header.active::before {
  width: 18px;
  height: 2px;
  background-color: #D2232A;
  right: 20px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.block17_accordion_header.active::after {
  width: 18px;
  height: 2px;
  background-color: #D2232A;
  right: 20px;
  top: 50%;
  transform: translateY(-50%) rotate(-45deg);
}

.block17_accordion_info {
  font-family: Lora, serif;
  font-weight: 500;
  font-style: normal;
  font-size: 20px;
  line-height: 22px;
  color: #000000;
  margin: 0;
  padding-right: 40px;
}

.block17_accordion_content {
  padding: 0 20px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease, padding 0.4s ease;
  background-color: #fff;
}

.block17_accordion_content.open {
  padding: 20px;
  max-height: 1000px;
}

.block17_accordion_content p {
  font-family: Roboto, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  line-height: 28px;
  margin: 0;
  color: black;
}

.block17_accordion_content.open p {
  color: #000000;
}


@media (max-width: 1023px) {
  .block17_content {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  
  .block17_title {
    font-size: 36px;
    margin-bottom: 30px;
  }
}

@media (max-width: 768px) {
  .block17_accordion_content.open p {
    font-size: 14px;
    line-height: 1.4;
  }

  .block17_content {
    gap: 10px;
  }

  .block17_column {
    gap: 10px;
  }
}


@media (max-width: 768px) {
  .block15_accordion {
    gap: 10px !important;
  }

  .alumni_accordion_item {
    margin-bottom: 0 !important;
  }

  .block19_reviews_title {
    font-family: Roboto, Arial, sans-serif !important;
    font-weight: 700 !important;
  }

  .form_step2_input_wrapper .phone_number input {
    padding-bottom: 15px;
    padding-left: 0 !important;
  }
}


/* ============================================
   BLOCK18: Остались вопросы?
   ============================================ */
.block18 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  text-align: center;
  box-sizing: border-box;
}

.block18 .form_bg {
  position: relative;
  width: 100vw;
  max-width: none;
  min-height: 300px;
  height: auto;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  overflow: visible;
}

.block18 .form_bg img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
  pointer-events: none;
}

.block18 .form_bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.698);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1;
  pointer-events: none;
}

.block18 .form_hover {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 100%;
  padding: clamp(20px, 4vw, 40px) clamp(15px, 3vw, 20px);
  box-sizing: border-box;
  overflow: visible;
}

.block18 .form_txt {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: clamp(28px, 5vw, 32px);
  line-height: 1.2;
  color: #FFFFFF;
  margin-bottom: 24px;
  text-align: center;
  width: 100%;
}

.block18 .alt_text {
  color: #FFFFFF;
  font-size: 16px;
  margin-top: 20px;
  text-align: left;
}

.block18 .alt_text a {
  color: #D2232A;
}

.block18 .number,
.block18 .capcha {
  color: #FFFFFF;
}

.block18 .form_hover_step2 {
  z-index: 2;
}

.block18 .form_hover_step2 .form_txt {
  color: #FFFFFF;
}

.block18 .form_hover_step2 label {
  color: #FFFFFF !important;
}

.block18 .form_step2_alt_text {
  color: #FFFFFF;
  text-align: left;
}

.block18 .form_step2_alt_text a {
  color: #D2232A;
}

/* Phone flag selector для block18 */
.block18 .phone_flag_selector {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  position: relative !important;
}

.block18 .phone_flag_selector .phoneFlagImg {
  position: relative !important;
  display: block !important;
  flex-shrink: 0 !important;
}

/* Phone country options для block18 */
.block18 .phone_country_option {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.block18 .phone_country_option .flag {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  display: block !important;
  flex-shrink: 0 !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  position: relative !important;
}

/* Структура формы block18 */
.block18_form_fields {
  width: 100%;
}

.block18_form_row_top {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-bottom: 20px;
}

.block18_form_row_bottom {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.block18_form_row_bottom .form_step2_input_wrapper:nth-child(1) {
  grid-column: 1;
}

.block18_form_row_bottom .form_step2_input_wrapper:nth-child(2) {
  grid-column: 2;
}

.block18_form_row_bottom .form_step2_input_wrapper:nth-child(3) {
  grid-column: 3;
}

.block18_form_row_top .form_step2_input_wrapper,
.block18_form_row_bottom .form_step2_input_wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.block18_form_row_top .form_step2_input_wrapper input,
.block18_form_row_top .form_step2_input_wrapper .phone_wrapper,
.block18_form_row_bottom .form_step2_input_wrapper input,
.block18_form_row_bottom .form_step2_input_wrapper .form_step2_select_container,
.block18_submit_btn {
  width: 100%;
  height: 49px;
  box-sizing: border-box;
}

.block18_form_row_bottom .form_step2_input_wrapper:has(.block18_submit_btn) {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.block18_form_row_bottom .form_step2_input_wrapper:has(.block18_submit_btn) label {
  display: none;
}

.block18_form_row_top .form_step2_input_wrapper .phone_wrapper {
  display: flex;
  height: 49px;
  border-bottom: 2px solid #D2232A;
}

.block18_submit_btn {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  border: 1px solid #D2232A;
  border-bottom: 2px solid #D2232A;
  border-radius: 8px;
  padding: 0px 16px;
  outline: none;
  background: #D2232A;
  color: #FFFFFF;
  cursor: pointer;
  line-height: 21px;
  vertical-align: middle;
  margin-top: 0;
  opacity: 1 !important;
}

.block18_submit_btn:hover {
  background: #b01d23;
}

.block18_form_row_top .form_step2_input_wrapper label,
.block18_form_row_bottom .form_step2_input_wrapper label {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #FFFFFF;
  text-align: left;
}

/* Звездочки в block18 должны быть красными и видимыми */
.block18_form_row_top .form_step2_input_wrapper label .required,
.block18_form_row_top .form_step2_input_wrapper label span.required,
.block18_form_row_bottom .form_step2_input_wrapper label .required,
.block18_form_row_bottom .form_step2_input_wrapper label span.required {
  color: #dc3545 !important;
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  background: transparent !important;
  text-shadow: none !important;
}

.block18_form_row_top .form_step2_input_wrapper label[for="birth_date_4"] {
  white-space: nowrap;
}

.block18 .form_step2_content {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 30px;
}

.block18 .form_step2_left {
  display: flex;
  flex-direction: row;
  gap: 30px;
  align-items: flex-start;
  flex-wrap: nowrap;
  flex: 1;
  min-width: 0;
}

.block18 .form_step2_content_wrapper {
  display: flex;
  flex-direction: column;
  gap: 15px;
  flex: 1;
  min-width: 0;
}

.block18_form_bottom {
  margin-top: 20px;
}

@media (max-width: 1023px) {
  
  .block18 .form_bg {
    width: 100%;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
  }
  
  .block18 .form_hover {
    padding: clamp(20px, 4vw, 30px) clamp(10px, 3vw, 15px);
  }
  
  .block18_form_row_top {
    grid-template-columns: repeat(3, 1fr);
  }
  
  .block18_form_row_bottom {
    grid-template-columns: repeat(3, 1fr);
  }
  
  .block18_form_row_bottom .form_step2_input_wrapper:last-child {
    grid-column: auto;
  }
  
  .block18_submit_btn {
    margin-top: 0;
  }
}


/* ============================================
   BLOCK20: Email рассылка
   ============================================ */
.block20 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding-inline: clamp(20px, 10vw, var(--side-padding));
  text-align: center;
  box-sizing: border-box;
}

.block20 .form_bg {
  position: relative;
  width: 100vw;
  max-width: none;
  min-height: 350px;
  height: auto;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  overflow: visible;
}

.block20 .form_bg img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
  pointer-events: none;
}

.block20 .form_bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.698);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1;
  pointer-events: none;
}

.block20 .form_hover {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 100%;
  padding: clamp(20px, 4vw, 40px) clamp(15px, 3vw, 20px);
  box-sizing: border-box;
  overflow: visible;
}

.block20 .form_txt.block20_title,
.block20_title {
  font-family: Lora, serif !important;
  font-weight: 500 !important;
  font-style: normal !important;
  font-size: 32px !important;
  line-height: 1.2 !important;
  color: #FFFFFF !important;
  margin-bottom: 24px !important;
  text-align: center !important;
  width: 100%;
}

/* Явное переопределение для form_txt.block20_title */
.form_txt.block20_title {
  font-size: 32px !important;
}

.block20_description {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  line-height: 1.4;
  color: #FFFFFF;
  margin-bottom: 30px;
  text-align: center;
  width: 100%;
}

.block20 .alt_text {
  color: #FFFFFF;
  font-size: 16px;
  margin-top: 20px;
  font-family: Roboto, Arial, sans-serif;
  font-weight: 300;
  text-align: left;
}

/* Удаляем br в block20_consent на 769px+ */
@media (min-width: 769px) {
  .block20_consent br,
  .block20 .alt_text.block20_consent br {
    display: none;
  }
}

.block20 .number,
.block20 .capcha {
  color: #FFFFFF;
}

.block20 .input_column_left input[type="email"] {
  width: 100%;
  height: 49px;
  padding: 0 16px;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 8px;
  background: #FFFFFF;
  color: #000000;
  font-family: Roboto, Arial, sans-serif;
  font-size: 20px;
  outline: none;
  transition: border-color 0.3s ease;
}

.block20 .input_column_left input[type="email"]:focus {
  border-color: #D2232A;
}

.block20 .input_column_left input[type="email"]::placeholder {
  color: rgba(35, 31, 32, 0.5);
}

/* Адаптивность для block20 */
@media (max-width: 1023px) {
  .block20 .form_txt.block20_title,
  .block20_title {
    font-size: 32px !important;
  }
}


/* ============================================
   КАМПУСЫ (BLOCK4)
   ============================================ */
.block4 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 50px var(--side-padding);
  box-sizing: border-box;
}

.container_campuses {
  max-width: var(--content-width);
  margin: 0 auto;
  text-align: center;
}

.campuses {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 50px;
  color: var(--color-black);
  margin-bottom: 20px;
}

.subtitle {
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  color: var(--color-black);
  margin-bottom: 20px;
}

.campuses_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 20px;
}

@media (max-width: 1023px) {
  .campuses_grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.campus_card {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
}

.campus_card:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 20px rgba(0, 0, 0, 0.15);
}

.campus_card img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.campus_label {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-weight: 500;
  font-size: 28px;
  text-align: center;
  z-index: 1;
  pointer-events: none;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  white-space: nowrap;
}

.map_button {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
}

.map_button:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 20px rgba(0, 0, 0, 0.15);
}

.map_button_link {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  text-decoration: none;
}

.map_image {
  width: 100%;
  height: 200px;
  display: block;
  object-fit: cover;
}

.map_overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #c00;
  opacity: 0.9;
  mix-blend-mode: multiply;
  pointer-events: none;
}

.map_text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 28px;
  letter-spacing: 0%;
  color: white;
  text-align: center;
  z-index: 1;
  pointer-events: none;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

/* ============================================
   ФОТОГРАФИИ КАМПУСА (BLOCK5)
   ============================================ */
.block5 {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-inline: var(--side-padding);
  padding-top: 40px;
  padding-bottom: 0px;
  position: relative;
  box-sizing: border-box;
  background-image: url('/landing_2025/src/img/All/Skolkovo_2.webp');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  min-height: 400px;
}

.block5::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 200px;
  background: linear-gradient(to bottom, transparent, #ffffff);
  pointer-events: none;
  z-index: 0;
}

@media (min-width: 1441px) {
  .block5 {
    background-size: 110%;
  }
}

@media (min-width: 1600px) {
  .block5 {
    background-size: 120%;
  }
}

@media (min-width: 1920px) {
  .block5 {
    background-size: 130%;
  }
}

.campus_absolute {
  max-width: var(--content-width);
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 1;
}

.campus_photo {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  color: var(--color-black);
  margin-bottom: 30px;
}

.campus_tabs {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 10px;
  gap: 10px;
}

/* По умолчанию campus_buttons_group не влияет на layout (как было раньше) */
.campus_buttons_group {
  display: contents;
}

.campus_selector_wrapper {
  position: relative;
  display: inline-block;
}

.campus_btn {
  padding: 5px 10px;
  width: 206.75px;
  min-height: 48px;
  height: auto;
  background: #fff;
  color: #c00;
  border: 2px solid #c00;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 400;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-family: "Roboto";
  font-size: 16px;
}

.campus_btn.active {
  background: #c00;
  width: 246.56px;
  min-height: 48.02px;
  height: auto;
  color: #fff;
  font-weight: 700;
}

.campus_btn.active * {
  font-weight: 700;
}

#selectedCampus,
.campus_btn #selectedCampus {
  font-family: "Roboto";
  font-size: 16px;
  font-weight: 400;
  white-space: nowrap;
}

.campus_btn.active #selectedCampus {
  font-weight: 700;
}

/* Стили для кнопки выбора кампуса */
#campusSelectorBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  gap: 10px;
  white-space: nowrap;
  padding-right: 30px; /* Место для треугольника справа */
}

/* Текст по центру */
#campusSelectorBtn #selectedCampus {
  text-align: center;
}

.campus_arrow {
  font-size: 17px;
  transition: transform 0.3s ease;
  color: inherit;
  display: inline-block;
  position: absolute;
  right: 10px;
  flex-shrink: 0;
}

#campusSelectorBtn.menu-open .campus_arrow {
  transform: rotate(180deg);
}

.campus_modal {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  width: 100%;
  min-width: 206.75px;
  background: #fff;
  border-radius: 6px;
  box-shadow: inset 0px 4px 8px 0px rgba(217, 217, 217, 1);
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 400px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
  z-index: 1000;
  box-sizing: border-box;
}

.campus_modal.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.campus_option {
  padding: 0 20px;
  cursor: pointer;
  transition: background 0.2s;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.171875em;
  color: #231F20;
  border-bottom: 1px solid #EFEFEF;
  position: relative;
  z-index: 1001;
  pointer-events: auto !important;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  flex-shrink: 0;
  min-height: 36px;
  height: 36px;
  display: flex;
  align-items: center;
}

.campus_option:last-child {
  border-bottom: none;
}

.campus_option:hover {
  background: #f9f9f9;
}

.campus_option.selected,
.campus_option.active {
  background: #EFEFEF;
  font-weight: 700;
}

/* Адаптивность для campus_tabs при 1366px и меньше */
@media (max-width: 1373px) {
  .campus_tabs {
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }

  .campus_buttons_group {
    display: flex;
    flex-direction: row;
    width: 100%;
    gap: 10px;
  }

  .campus_buttons_group .campus_btn {
    flex: 1;
    width: 100%;
  }
}

/* При 1367px+ все как было изначально - campus_buttons_group не влияет на layout */
@media (min-width: 1374px) {
  .campus_buttons_group {
    display: contents;
  }
}

/* При 768px все блоки друг под другом */
@media (max-width: 768px) {
  .campus_absolute {
    display: flex;
    flex-direction: column;
  }
  
  .campus_tabs {
    display: contents;
  }

  .phone_close_btn {
    margin-left: 20px;
  }
  
  .campus_selector_wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    order: 1;
  }

  .campus-navigation .campus-arrow {
    display: none;
  }

  #campusSelectorBtn {
    width: 100%;
    justify-content: flex-start; /* Текст слева на 768px */
    position: relative;
    padding-left: 20px;
    padding-right: 30px; /* Место для треугольника справа */
    background: #c00 !important;
    color: #fff !important;
    border-color: #c00 !important;
  }
  
  #campusSelectorBtn #selectedCampus {
    flex: 1;
    text-align: left !important; /* Текст слева на 768px */
  }
  
  .campus_arrow {
    position: absolute;
    right: 10px; /* Треугольник справа */
    flex-shrink: 0;
  }

  .slider_container {
    order: 2;
  }
  
  .campus-navigation {
    order: 3;
    display: none !important;
  }

  .campus_buttons_group {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
    gap: 20px;
    order: 4;
    margin-top: 20px;
  }

  .campus_buttons_group .campus_btn {
    width: 100%;
    padding: 7px;
    min-height: 1px;
  }

  .campus_btn {
    min-height: 1px;
    padding: 4px 10px 4px 20px;
    font-size: 14px;
  }

  #selectedCampus,
  .campus_btn #selectedCampus {
    font-size: 14px;
  }

  .campus_option {
    font-size: 14px !important;
  }

  .block12_campus_btn {
    font-size: 14px !important;
  }

  .block12_campus_selector_btn {
    font-size: 14px !important;
  }

  .block12_campus_option {
    font-size: 14px !important;
  }

  .block14_campus_btn {
    font-size: 14px !important;
  }

  .block14_campus_selector_btn {
    font-size: 14px !important;
  }

  .block14_campus_option {
    font-size: 14px !important;
  }

  .block20_campuses .block20_campus_btn {
    font-size: 14px !important;
  }

  .block20_campus_selector_btn {
    font-size: 14px !important;
  }

  .block20_campus_option {
    font-size: 14px !important;
  }

  .form_campus_btn {
    font-size: 14px !important;
  }

  .form_campus_option {
    font-size: 14px !important;
  }

  .form_step2_select_container select {
    font-size: 14px;
  }

  .form_step2_select_container select option {
    font-size: 14px;
  }

  .block18_form_bottom {
    margin-top: 0;
  }
}


.slider_container {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow: hidden;
  padding: 25px 0;
  box-sizing: border-box;
  background: transparent;
  border: none;
  box-shadow: none;
}

.slides {
  display: flex;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  gap: 20px;
  cursor: grab;
  user-select: none;
  width: fit-content;
}

/* Адаптивный transition для больших экранов */
@media (min-width: 1024px) {
  .slides {
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  }
}

.slides.dragging {
  cursor: grabbing;
  transition: none;
}

.slide {
  flex-shrink: 0;
  width: 548px;
  height: 400px;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
}

.slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border: none;
  border-radius: 12px;
  box-shadow: none;
}

/* Блок навигации для слайдера кампуса (как hero-navigation) */
.campus-navigation {
  position: relative;
  width: 100%;
  height: 60px;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.campus-arrow {
  width: 38px;
  height: 38px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  color: #5C5D5D;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
  padding: 0;
  position: relative;
  z-index: 10;
  pointer-events: auto;
}

.campus-arrow:hover {
  background: var(--color-white);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transform: scale(1.05);
}

.campus-arrow:active {
  transform: scale(0.95);
}

.campus-arrow svg {
  width: 24px;
  height: 24px;
}

/* Campus Pagination */
.campus-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  position: relative;
  z-index: 10;
  flex-shrink: 0;
  min-width: 0;
}

.campus-pagination-bullet {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #CCCCCC;
  border: 2px solid #CCCCCC;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-block;
}

.campus-pagination-bullet:hover {
  background: rgba(255, 255, 255, 0.7);
  transform: scale(1.2);
}

.campus-pagination-bullet.active {
  background: var(--color-red);
  border-color: var(--color-red);
}

/* ============================================
   ПРЕИМУЩЕСТВА (BLOCK6)
   ============================================ */
.block6 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 40px var(--side-padding);
  box-sizing: border-box;
  overflow: visible;
}

.container_advange {
  max-width: var(--content-width);
  margin: 0 auto;
  overflow: visible;
  text-align: center;
}

.advage {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  color: var(--color-black);
  margin-bottom: 40px;
}

.advantages_grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
  padding-bottom: 10px;
}

/* Десктоп: верхний ряд 3 карточки, нижний ряд 4 карточки */
@media (min-width: 1024px) {
  .advantages_grid {
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: auto auto;
    gap: 20px;
  }
  
  /* Верхний ряд: 3 карточки, каждая занимает 4 колонки из 12 (равномерно) */
  .advantage_card_top {
    grid-row: 1;
  }
  
  .advantage_card_top:nth-child(1) {
    grid-column: 1 / 5; /* Занимает колонки 1-4 */
  }
  
  .advantage_card_top:nth-child(2) {
    grid-column: 5 / 9; /* Занимает колонки 5-8 */
  }
  
  .advantage_card_top:nth-child(3) {
    grid-column: 9 / 13; /* Занимает колонки 9-12 */
  }
  
  /* Нижний ряд: 4 карточки размером 263x369 */
  .advantage_card_bottom {
    grid-row: 2;
    width: 263px;
    height: 369px;
    justify-self: start;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
  }
  
  /* Отступы для нижних карточек из Figma */
  .advantage_card_bottom .icon {
    margin-top: 0;
    margin-bottom: 0;
    flex-shrink: 0;
  }
  
  /* Безопасность: отступы из Figma (top: 149px, right: 5.76px, bottom: 34px, left: 21.01px) */
  .advantage_card_bottom:nth-child(4) {
    padding: 17px 5.76px 34px 21.01px !important;
  }
  
  /* Кружки: отступы из Figma (top: 137px, right: 14.76px, bottom: 19px, left: 22.9px) */
  .advantage_card_bottom:nth-child(5) {
    padding: 17px 14.76px 19px 22.9px !important;
  }
  
  /* Наши выпускники: отступы из Figma (top: 142px, right: 10.76px, bottom: 53px, left: 24.8px) */
  .advantage_card_bottom:nth-child(6) {
    padding: 17px 10.76px 53px 24.8px !important;
  }
  
  /* Soft skills: отступы из Figma (top: 143px, right: 13.76px, bottom: 14.71px, left: 23.24px) */
  .advantage_card_bottom:nth-child(7) {
    padding: 17px 13.76px 14.71px 23.24px !important;
  }
  
  /* Маркеры списков для верхних карточек - тире как в мобильной версии */
  .advantages_grid .advantage_card_top ul li:before {
    content: "—" !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    border-radius: 0 !important;
    font-family: Roboto, Arial, sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: 0% !important;
    color: #D2232A !important;
    top: 10px !important;
  }
  
  /* Маркеры списков для нижних карточек - тире как в мобильной версии (более специфичный селектор) */
  .advantages_grid .advantage_card_bottom ul li:before {
    content: "—" !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    border-radius: 0 !important;
    font-family: Roboto, Arial, sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: 0% !important;
    color: #D2232A !important;
    top: 10px !important;
  }
  
  .advantage_card_bottom:nth-child(4) {
    grid-column: 1 / 4; /* Занимает колонки 1-3 */
  }
  
  .advantage_card_bottom:nth-child(5) {
    grid-column: 4 / 7; /* Занимает колонки 4-6 */
  }
  
  .advantage_card_bottom:nth-child(6) {
    grid-column: 7 / 10; /* Занимает колонки 7-9 */
  }
  
  .advantage_card_bottom:nth-child(7) {
    grid-column: 10 / 13; /* Занимает колонки 10-12 */
  }
}


/* Карусель для advantages_grid при 768px - как slider_container */
@media (max-width: 768px) {
  .container_advange {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;
    padding: 25px 0;
    box-sizing: border-box;
  }
  
  .advantages_grid {
    display: flex;
    gap: 20px;
    grid-template-columns: none;
    width: fit-content;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: grab;
    user-select: none;
    margin: 0;
    padding: 0;
  }
  
  .advantages_grid.dragging {
    cursor: grabbing;
    transition: none;
  }

  .advantages_grid .advantage_card {
    flex: 0 0 318px;
    width: 318px;
    height: auto;
    border: 2px solid #E4E4E7;
    border-radius: 8px;
    padding: 32px 16px;
    box-sizing: border-box;
  }

  /* Выравнивание всех элементов в advantage_card по левому краю при 768px */
  .advantage_card {
    text-align: left !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  
  .advantage_card .icon {
    align-self: flex-start !important;
    justify-content: center !important; /* Содержимое иконки по центру */
    margin-left: 0 !important;
  }
  
  .advantage_card h3,
  .advantage_card .progamms {
    text-align: left !important;
    align-self: flex-start !important;
  }
  
  .advantage_card p, .advantage_card ul li {
    font-size: 14px !important;
    text-align: left !important;
  }
  
  .advantage_card ul {
    text-align: left !important;
    align-self: flex-start !important;
    width: 100% !important;
  }
  
  /* Замена кружочков на полоски */
  .advantage_card ul li:before {
    content: "—" !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    border-radius: 0 !important;
    font-family: Roboto, Arial, sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: 0% !important;
    color: #D2232A !important;
    top: 10px !important;
  }

  /* Карусель для teachers_slides при 768px */
  .teachers_slider_wrapper {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;
    padding: 25px 0;
    box-sizing: border-box;
  }

  .teachers_slides {
    display: flex;
    gap: 30px;
    width: fit-content;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: grab;
    user-select: none;
    overflow-x: visible !important;
    overflow-y: visible !important;
    scroll-behavior: auto !important;
    padding: 0 !important;
  }

  .teachers_slides.dragging {
    cursor: grabbing;
    transition: none;
  }

  .teachers_slides .teacher_card {
    flex-shrink: 0;
    width: 200px;
  }

  /* Карусель для reviews_slider_wrapper при 768px */
  .reviews_slider_wrapper {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;
    padding: 25px 0;
    box-sizing: border-box;
  }

  .teachers_reviews {
    display: flex;
    gap: 13px;
    width: fit-content;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: grab;
    user-select: none;
    overflow-x: visible !important;
    overflow-y: visible !important;
    scroll-behavior: auto !important;
    padding: 0 !important;
  }

  .teachers_reviews.dragging {
    cursor: grabbing;
    transition: none;
  }

  .teachers_reviews .review_card {
    flex-shrink: 0;
    width: 280px;
    padding: 20px;
  }

  /* Убираем стили ссылки для карточек отзывов */
  .teachers_reviews a.review_card {
    text-decoration: none;
    color: inherit;
    display: block;
  }

  .teachers_reviews a.review_card:hover {
    text-decoration: none;
  }

  /* Карусель для block19_reviews_slider_wrapper при 768px */
  .block19_reviews_slider_wrapper {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;
    padding: 25px 0;
    box-sizing: border-box;
  }

  .block19_reviews_slides {
    display: flex;
    gap: 13px;
    width: fit-content;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: grab;
    user-select: none;
    overflow-x: visible !important;
    overflow-y: visible !important;
    scroll-behavior: auto !important;
    padding: 0 !important;
  }

  .block19_reviews_slides.dragging {
    cursor: grabbing;
    transition: none;
  }

  .block19_reviews_slides .block19_review_card {
    flex-shrink: 0;
    width: 280px;
    flex: 0 0 280px !important;
    min-width: 280px !important;
    max-width: 280px !important;
    padding: 22px;
  }

  /* Карусель для block19_slider_wrapper при 768px */
  .block19_slider_wrapper {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;
    padding: 25px 0;
    box-sizing: border-box;
  }

  .block19_news {
    display: flex;
    gap: 15px;
    width: fit-content;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: grab;
    user-select: none;
    overflow-x: visible !important;
    overflow-y: visible !important;
    scroll-behavior: auto !important;
    padding: 0 !important;
  }

  .block19_news.dragging {
    cursor: grabbing;
    transition: none;
  }

  .block19_news .news_card {
    flex-shrink: 0;
    width: 280px;
    flex: 0 0 280px !important;
    align-self: stretch;
  }
}

/* Базовые стили для advantage_card при 769px+ */
@media (min-width: 769px) {
  .advantage_card {
    padding: 30px !important;
    text-align: left !important;
    border-radius: 8px !important;
    position: relative !important;
    overflow: hidden !important;
    display: block !important;
    flex-direction: unset !important;
    align-items: unset !important;
  }
  
  .advantage_card ul {
    text-align: left !important;
    align-self: unset !important;
    width: auto !important;
  }
  
  .advantage_card ul li:before {
    content: "" !important;
    width: 8px !important;
    height: 8px !important;
    background: #e74c3c !important;
    border-radius: 50% !important;
    top: 20px !important;
  }
  
  /* Для верхних карточек на десктопе - тире вместо точек */
  .advantages_grid .advantage_card_top ul li:before {
    content: "—" !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    border-radius: 0 !important;
    font-family: Roboto, Arial, sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: 0% !important;
    color: #D2232A !important;
    top: 10px !important;
  }
  
  /* Для нижних карточек на десктопе - тире вместо точек */
  .advantages_grid .advantage_card_bottom ul li:before {
    content: "—" !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    border-radius: 0 !important;
    font-family: Roboto, Arial, sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: 0% !important;
    color: #D2232A !important;
    top: 10px !important;
  }
}

.advantage_card {
  padding: 30px;
  text-align: left;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}

/* Стили для advantage_card при 769px+ */
@media (min-width: 769px) {
  .advantage_card {
    opacity: 1;
    border-radius: 12px;
    border: 1px solid #D9D9D9;
  }
}

.icon {
  width: 100px;
  height: 100px;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.advantage_card h3 {
  font-weight: 700;
  font-size: 20px;
  color: var(--color-black);
  margin-bottom: 10px;
}

.progamms {
  font-weight: 700;
  font-size: 20px;
  color: var(--color-black);
}

.advantage_card p {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  padding-top: 10px;
  color: var(--color-black);
  margin-bottom: 10px;
}

.advantage_card ul {
  list-style: none;
  padding-left: 0;
}

.advantage_card ul li {
  position: relative;
  padding-left: 16px;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  /* line-height: 1.5; */
  color: var(--color-black);
  padding-top: 10px;
}

.advantage_card ul li::first-letter {
  text-transform: uppercase;
}

.advantage_card ul li:before {
  content: "";
  position: absolute;
  left: 0;
  width: 8px;
  height: 8px;
  background: #e74c3c;
  border-radius: 50%;
  top: 20px;
}

/* Стили для английской версии - увеличиваем высоту нижних карточек для лучшего размещения текста */
@media (min-width: 1024px) {
  html[lang="en"] .advantage_card_bottom {
    height: 420px;
  }
}

/* ============================================
   ФОРМА БРОШЮРЫ (BLOCK7)
   ============================================ */
.block7 {
  display: flex;
  align-items: center;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 40px var(--side-padding);
  padding-bottom: 50px;
  position: relative;
  z-index: 10; /* выпадающий список кода страны должен быть поверх block8 */
  box-sizing: border-box;
  background-image: url('/landing_2025/src/img/background_23.webp');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  overflow: visible;
}

.form_container {
  max-width: var(--content-width);
  margin: 0 auto;
  color: white;
  position: relative;
  z-index: 1;
  overflow: visible;
}

.form_container_head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.form_br {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  padding-top: 20px;
  margin-bottom: 24px;
}

.download_form {
  margin-bottom: 20px;
  overflow: visible;
}

.form_row {
  display: flex;
  align-items:last baseline;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

/* При 1024px+ все элементы в form_row должны быть одинаковой высоты */
@media (min-width: 1024px) {
  .block7 .form_row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 12px;
    align-items: stretch;
  }

  /* input_column_right занимает последнюю колонку (чуть шире) */
  .block7 .form_row > .input_column_right {
    grid-column: 5;
  }

  .block7 .form_row > .form_group {
    display: flex;
    flex-direction: column;
  }

  /* Все labels в одном ряду одинаковой высоты */
  .block7 .form_row > .form_group > label {
    min-height: 28px;
    display: flex;
    align-items: center;
  }

  /* Все инпуты, селекты и кнопки в одном ряду одинаковой высоты */
  .block7 .form_row > .form_group > input:not([type="tel"]),
  .block7 .form_row > .form_group > select,
  .block7 .form_row > .form_group > .form_campus_btn,
  .block7 .form_row > .form_group > .phone_wrapper {
    height: 48px;
    box-sizing: border-box;
  }

  .block7 .form_row > .download_btn {
    height: 48px;
    box-sizing: border-box;
    align-self: flex-end;
    margin-top: 28px;
  }

  /* margin-bottom для capcha в block7 при 1024px+ */
  .block7 .form_row .input_column_right .capcha {
    margin-bottom: 14.5px !important;
  }

  /* Скрываем иконку license.svg в note при 1024px+ */
  .block7 .note .note_icon {
    display: none !important;
  }
}

/* Адаптивность для form_row */
@media (max-width: 1023px) {
  .block7 {
    padding-bottom: 0;
  }

  .form_row {
    flex-direction: column;
    align-items: stretch;
  }

  .download_btn {
    margin-top: 0px;
  }
  
  .form_group {
    width: 100%;
    flex: none;
  }
}


.row_flex {
  display: flex;
  gap: 12px;
}

.form_group {
  flex: 1;
  overflow: visible;
}

.form_group label {
  display: block;
  margin-bottom: 6px;
  font-family: "Roboto";
  font-size: 400;
  font-size: 16px;
}

.form_group input,
.form_group select {
  width: 100%;
  height: 48px;
  padding: 12px 14px;
  border: none;
  border-bottom: 2px solid #000;
  border-radius: 6px;
  font-size: 15px;
  transition: all 0.2s;
  background: #fff;
  color: #000;
  box-sizing: border-box;
}

/* Размер шрифта для всех инпутов в block7 */
.block7 .form_group input,
.block7 .form_group select {
  font-size: 16px;
}

/* Специфичные стили для поля phone в block7 */
.block7 .form_group input[type="tel"] {
  background: #fff;
  border: none;
  border-bottom: 2px solid white;
  border-radius: 6px;
  padding: 12px 5px 9px 24px;
  width: 100%;
  height: 48px;
  font-size: 16px;
  box-sizing: border-box;
}

/* Кастомный select для кампуса в форме */
.form_campus_selector_wrapper {
  position: relative;
  display: block;
  width: 100%;
  overflow: visible;
  z-index: 1;
}

.form_campus_btn {
  width: 100%;
  height: 48px;
  padding: 12px 14px;
  background: #fff;
  color: #000;
  border: none;
  border-bottom: 2px solid #000;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 400;
  font-size: 15px;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  box-sizing: border-box;
  text-align: left;
}

.form_campus_btn:hover,
.form_campus_btn:focus {
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.4);
  outline: none;
}

.form_campus_arrow {
  font-size: 17px;
  transition: transform 0.3s ease;
  color: #c00;
  display: inline-block;
  flex-shrink: 0;
}

.form_campus_btn.menu-open .form_campus_arrow {
  transform: rotate(180deg);
}

.form_campus_modal {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  width: 100%;
  background: #fff;
  border-radius: 6px;
  box-shadow: inset 0px 4px 8px 0px rgba(217, 217, 217, 1);
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 400px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
  z-index: 10000;
  box-sizing: border-box;
}

.form_campus_modal.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.form_campus_option {
  padding: 0 20px;
  cursor: pointer;
  transition: background 0.2s;
  font-family: "Roboto", Arial, sans-serif;
  /* font-size: 20px; */
  font-weight: 400;
  line-height: 1.171875em;
  color: #231F20;
  border-bottom: 1px solid #EFEFEF;
  position: relative;
  z-index: 1001;
  pointer-events: auto !important;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  flex-shrink: 0;
  min-height: 36px;
  height: 36px;
  display: flex;
  align-items: center;
}

.form_campus_option:last-child {
  border-bottom: none;
}

.form_campus_option:hover {
  background: #f9f9f9;
}

/* Выбранный элемент (активный) */
.form_campus_option.selected {
  background: #EFEFEF;
  font-weight: 700;
}

.form_group input:focus,
.form_group select:focus {
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.4);
  outline: none;
}

.request {
  color: black;
}

/* Переопределяем цвет звездочек в block7 при 768px */
@media (max-width: 768px) {
  .block7 .request {
    color: #D2232A !important;
  }
  
  .block7 .form_group label .request,
  .block7 .form_group label span.request {
    color: #D2232A !important;
  }
  
  .block7 .form_group label[for="name"] .request,
  .block7 .form_group label[for="phone"] .request,
  .block7 .form_group label[for="email"] .request,
  .block7 .form_group label[for="campus"] .request,
  .block7 .form_group label[for="name"] span.request,
  .block7 .form_group label[for="phone"] span.request,
  .block7 .form_group label[for="email"] span.request,
  .block7 .form_group label[for="campus"] span.request {
    color: #D2232A !important;
  }
}

/* Убеждаемся, что звездочка видна в block7, особенно для phone */
.block7 .form_group label[for="name"] .request,
.block7 .form_group label[for="phone"] .request,
.block7 .form_group label[for="email"] .request,
.block7 .form_group label[for="campus"] .request {
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  font-size: inherit !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  text-indent: 0 !important;
  clip: auto !important;
  overflow: visible !important;
}

/* По умолчанию звездочки черные, кроме 768px - переопределено ниже для 769px+ */

/* Резервный вариант: добавляем звездочку через ::after, если оригинальная скрыта */
.block7 .form_group label[for="name"]::after,
.block7 .form_group label[for="phone"]::after {
  content: " *";
  display: inline;
  visibility: visible;
  opacity: 1;
}

/* Цвет звездочки через ::after при 768px - красный */
@media (max-width: 768px) {
  .block7 .form_group label[for="name"]::after,
  .block7 .form_group label[for="phone"]::after,
  .block7 .form_group label[for="email"]::after,
  .block7 .form_group label[for="campus"]::after {
    color: #D2232A !important;
  }
}

/* Цвет звездочки через ::after при 769px+ - переопределено ниже в медиа-запросе для 769px+ */

.formSelectedCampus {
  font-family: "Roboto";
  font-size: 16px;
  font-weight: 400;
}


.download_btn {
  height: 48px;
  font-family: "Roboto" !important;
  background: #000000 !important;
  color: white !important;
  border: none;
  padding: 12px 24px;
  font-size: 20px;
  font-weight: 400;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  transition: 0.3s;
  opacity: 1 !important;
}

.download_btn:hover {
  background: #000000 !important;
}

.download_btn:disabled {
  background: #000000 !important;
  opacity: 1 !important;
}

.download_btn svg {
  width: 18px;
  height: 18px;
}

.note {
  display: flex;
  justify-content: start;
  font-weight: 400;
  font-size: 16px;
  margin-top: 30px;
}

.block7 .note .note_icon {
  display: block;
  width: 34px;
  height: 32px;
  flex-shrink: 0;
  object-fit: contain;
}

/* Адаптивность для block7 при 1024px */
@media (max-width: 1024px) {
  
  .form_container_head {
    order: 1;
  }
  
  .note {
    order: 2;
    margin-top: 0;
    margin-bottom: 20px;
  }
  
  .download_form {
    order: 3;
  }
  
  /* Центрируем тексты в label для name, phone, email, campus */
  .form_group label[for="name"],
  .form_group label[for="phone"],
  .form_group label[for="email"],
  .form_group label[for="campus"] {
    text-align: center;
  }
  
  /* Специально для phone и name - убеждаемся, что звездочка видна */
  .form_group label[for="name"],
  .form_group label[for="phone"] {
    position: relative;
  }
  
  .form_group label[for="name"] .request,
  .form_group label[for="phone"] .request {
    position: static !important;
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: white !important;
    font-size: 16px !important;
    line-height: inherit !important;
  }
}

/* Стили для block7 при 769px+ - возвращаем исходное отображение */
@media (min-width: 769px) {
  /* Фон #F1F2F2 */
  .block7 {
    background: #F1F2F2 !important;
    background-image: none !important;
    color: #000000;
  }

  /* Белый текст -> черный */
  .block7 .form_container {
    color: #000000 !important;
  }

  .block7 .form_br {
    color: #000000 !important;
  }

  .block7 .form_group label {
    color: #000000 !important;
  }

  .block7 .note {
    color: #000000 !important;
  }

  /* Звездочки красные */
  .block7 .request {
    color: #D2232A !important;
  }
  
  .block7 .form_group label .request,
  .block7 .form_group label span.request {
    color: #D2232A !important;
  }
  
  .block7 .form_group label[for="name"] .request,
  .block7 .form_group label[for="phone"] .request,
  .block7 .form_group label[for="email"] .request,
  .block7 .form_group label[for="campus"] .request,
  .block7 .form_group label[for="name"] span.request,
  .block7 .form_group label[for="phone"] span.request,
  .block7 .form_group label[for="email"] span.request,
  .block7 .form_group label[for="campus"] span.request {
    color: #D2232A !important;
  }

  .block7 .form_group label[for="name"]::after,
  .block7 .form_group label[for="phone"]::after,
  .block7 .form_group label[for="email"]::after,
  .block7 .form_group label[for="campus"]::after {
    color: #D2232A !important;
  }

  /* Кнопка скачать красный фон */
  .block7 .download_btn {
    background: #D2232A !important;
    background-color: #D2232A !important;
    color: #FFFFFF !important;
  }

  .block7 .download_btn:hover {
    background: #D2232A !important;
    background-color: #D2232A !important;
  }

  .block7 .download_btn:disabled {
    background: #D2232A !important;
    background-color: #D2232A !important;
    opacity: 1 !important;
  }

  /* Иконка download.svg белая в кнопке download_btn */
  .block7 .download_btn .form_icon,
  .block7 .download_btn img[src*="download.svg"] {
    filter: brightness(0) invert(1);
  }

  /* Иконка license.svg красная #D2232A */
  .block7 .form_container_head .form_icon {
    filter: brightness(0) saturate(100%) invert(18%) sepia(94%) saturate(4000%) hue-rotate(346deg) brightness(75%) contrast(90%);
  }
  
  /* Цвет form_icon красный #D2232A */
  .form_icon {
    filter: brightness(0) saturate(100%) invert(18%) sepia(94%) saturate(4000%) hue-rotate(346deg) brightness(75%) contrast(90%);
  }

  /* Черные полосы внизу инпутов и кнопок -> красные */
  .block7 .form_group input:not([type="tel"]),
  .block7 .form_group select {
    border-bottom: 2px solid #D2232A !important;
  }

  .block7 .form_campus_btn {
    border-bottom: 2px solid #D2232A !important;
  }

  .block7 .phone_wrapper {
    border-bottom: 2px solid #D2232A !important;
  }

  .block7 .form_group input[type="tel"] {
    border-bottom: 2px solid #D2232A !important;
  }

  .block7 .phone_number input {
    border-bottom: 2px solid #D2232A !important;
  }

  /* input_column_right стили для block7 */
  .block7 .form_row .input_column_right {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .block7 .input_column_right .capcha {
    margin-bottom: 10px;
  }

  .block7 .input_submit_wrapper {
    display: flex;
    gap: 0;
    width: auto;
    max-width: 300px;
    align-items: flex-end;
  }

  .block7 .input_submit_wrapper .comment {
    flex: 1;
    min-width: 0;
    height: 48px;
    font-size: 20px;
    border: 1px solid #fff;
    border-radius: 8px 0 0 8px;
    border-right: none;
    border-bottom: 2px solid #D2232A;
    padding: 12px 16px;
    outline: none;
    background: #fff;
    color: #000;
  }

  .block7 .input_submit_wrapper .download_btn {
    min-width: 120px;
    width: auto;
    height: 48px;
    border-radius: 0 8px 8px 0;
    font-size: 16px;
    padding: 12px 24px;
  }
}

/* Стили для block7 при 769px-1023px */
@media (min-width: 769px) and (max-width: 1023px) {
  .block7 .input_column_right {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .block7 .input_column_right .capcha {
    margin-bottom: 6px;
    margin-right: 0;
    text-align: center;
    width: 100%;
  }

  .block7 .input_submit_wrapper {
    width: 100%;
    max-width: none;
    display: flex;
    flex-direction: row;
    gap: 0;
    align-items: stretch;
  }

  .block7 .input_submit_wrapper .comment {
    flex: 1;
    min-width: 0;
  }

  .block7 .input_submit_wrapper .download_btn {
    flex-shrink: 0;
  }

  /* Убеждаемся, что флаг виден при 769px+ */
  .block7 .phone_flag_selector .phoneFlagImg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    flex-shrink: 0;
  }

  /* Возвращаем исходный текст note_text при 769px+ */
  .block7 .note_text {
    font-size: inherit !important;
    line-height: inherit !important;
  }

  .block7 .note_text::before {
    content: none !important;
    display: none !important;
  }

  /* Скрываем иконку при 769px+ */
  .block7 .note .note_icon {
    display: none !important;
  }
}

/* Изменение размера шрифта с 20px на 16px при 769px+ для всех элементов, кроме исключений */
@media (min-width: 769px) {
  /* Исключения - оставляем 20px */
  .promo_text2,
  .info_text,
  .info_text2,
  .block19_review_name,
  .news_title,
  .block20_address_title,
  .block20_contact_label,
  .block20_hours_title,
  .block20_coordinates_title,
  .contacts .phone {
    font-size: 20px !important;
  }

  /* Все остальные элементы с font-size: 20px -> 16px */
  .info_school,
  .info_school_2,
  .info_main,
  .info_main_2,
  .info_jessica,
  .info_jessica_2,
  .number,
  .phone_flag_selector .phone-code,
  .capcha,
  .alt_text,
  .form_step2_input_wrapper label,
  .form_step2_alt_text,
  .subtitle,
  .campus_btn,
  .campus_btn #selectedCampus,
  .formSelectedCampus,
  .advantage_card h3,
  .advantage_card p,
  .advantage_card ul li,
  .progamms,
  .block7 .form_group input,
  .block7 .form_group select,
  .block7 .form_group input[type="tel"],
  .block7 .form_group label,
  .block7 .form_campus_btn,
  .block7 .input_submit_wrapper .comment,
  .download_btn,
  .note,
  .info_p,
  .block13_text,
  .block13_card_content,
  .step3_item,
  .block12_info,
  .block12_campus_tabs,
  .block12_price_subtitle,
  .block12_price_with_discount,
  .block12_price_item,
  .block12_price_info,
  .block14_subtitle,
  .block14_campus_buttons,
  .block14_btn,
  .review_name,
  .block15_description,
  .block17_accordion_content,
  .block17_accordion_content.open,
  .block17_accordion_content p,
  .block20_description,
  .block20_contact_item,
  .block20_address_value,
  .block20_hours_list,
  .block20 .input_column_left input[type="email"],
  .block21_copyright,
  .btn,
  .btn-text,
  input::placeholder,
  textarea::placeholder,
  input::-webkit-input-placeholder,
  textarea::-webkit-input-placeholder,
  input::-moz-placeholder,
  textarea::-moz-placeholder,
  input:-ms-input-placeholder,
  textarea:-ms-input-placeholder,
  .campus_tabs button,
  .program_title,
  .card_body_red .age_badge,
  .accordion_content,
  .accordion_content.open,
  .accordion_content p,
  .form_step2_submit,
  .form_step2_input_wrapper input,
  .form_step2_input_wrapper select,
  .form_step2_input_wrapper .phone_number input,
  .form_step2_select_container select option,
  input[type="tel"],
  .phone_number input,
  .campus_option,
  .form_campus_option,
  .block18 .alt_text,
  .block18_submit_btn,
  .block18_form_row_top .form_step2_input_wrapper label,
  .block18_form_row_bottom .form_step2_input_wrapper label,
  .block3 .form_content .capcha,
  .block11 .form_hover .capcha,
  .block16 .form_hover .capcha,
  .block18 .form_hover .capcha,
  .block20 .form_hover .capcha,
  .info_school_2_text {
    font-size: 16px !important;
  }

  /* Специально для block19_review_rating, block19_review_text, block19_review_expand, review_text - 14px */
  .block19_review_rating,
  .block19_review_text,
  .block19_review_expand,
  .review_text,
  .block19_students_reviews .block19_review_text,
  .block19_students_reviews .block19_review_expand {
    font-size: 16px !important;
  }

  /* Иконка block21_social_icon 18x18px при 769px+ */
  .block21_social_icon {
    width: 18px !important;
    height: 18px !important;
  }

  .block21_social_icon img {
    width: 18px !important;
    height: 18px !important;
  }

  .block21_social_icon:has(img[alt="YouTube"]),
  .block21_social_icon:has(img[src*="YouTube"]) {
    width: auto !important;
    min-width: 18px !important;
    height: 18px !important;
  }

  .block21_social_icon img[alt="YouTube"],
  .block21_social_icon img[src*="YouTube"] {
    width: auto !important;
    height: 18px !important;
  }
}

/* Стили для block7 при 768px */
@media (max-width: 768px) {
  .block7 {
    background: #F1F2F2 !important;
    background-image: none !important;
    color: #000000;
  }

  .block7 .form_container {
    color: #000000;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .form_container_head .form_icon {
    display: none;
  }

  .form_br {
    font-family: Lora, serif;
    font-weight: 500;
    font-size: 24px;
    color: #000000;
    padding-top: 20px;
    margin-bottom: 20px;
  }

  .block7 .form_row {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
    width: 100% !important;
  }

  /* Перестраиваем порядок элементов для 768px */
  /* Левая колонка: Имя (1), Телефон (2), Капча (5) */
  .block7 .form_row > .form_group:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .block7 .form_row > .form_group:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }

  .block7 .form_row > .form_group:nth-child(3) {
    grid-column: 1;
    grid-row: 2;
  }

  .block7 .form_row > .form_group:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
  }

  .block7 .form_row {
    position: relative;
  }

  .block7 .form_row > .input_column_right {
    grid-column: 1;
    grid-row: 3;
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .block7 .form_row > .input_column_right .capcha {
    font-family: "Roboto", Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2857142857142858em;
    color: #000000;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
    display: block;
    text-align: left !important;
  }

  .block7 .form_row > .input_column_right .input_submit_wrapper {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    position: relative;
  }

  .block7 .form_row > .input_column_right .input_submit_wrapper .comment {
    width: 100%;
    height: 36px;
    font-size: 14px;
    border: none;
    border-bottom: 2px solid #D2232A;
    border-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    padding: 10px 14px;
    outline: none;
    background: #FFFFFF;
    color: #000000;
    text-align: left !important;
    box-sizing: border-box;
    margin-top: 9px;
  }

  .block7 .form_row > .input_column_right .input_submit_wrapper .comment:focus {
    outline: none;
    box-shadow: none;
  }

  .block7 .form_row > .input_column_right .input_submit_wrapper .download_btn {
    position: absolute;
    left: calc(100% + 20px);
    top: 9px;
    width: calc(50% - 10px);
    height: 38px;
    font-size: 14px;
    border-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-bottom: 2px solid #D2232A;
    padding: 10px 16px;
    margin-top: 0 !important;
  }

  .block7 .form_group {
    width: 100%;
    margin-bottom: 0px;
  }

  .block7 .form_group:last-child {
    margin-bottom: 0;
  }

  .block7 .form_group label {
    font-family: "Roboto", Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2857142857142858em;
    color: #000000;
    margin-bottom: 0;
    display: block;
    text-align: left !important;
  }

  .block7 .form_group input,
  .block7 .form_group select,
  .block7 .form_campus_btn {
    font-family: "Roboto", Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2857142857142858em;
    color: #000000;
    background: #FFFFFF;
    border: none;
    border-bottom: 2px solid #D2232A;
    border-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    padding: 10px 14px;
    height: 36px;
    margin-top: 9px;
    width: 100% !important;
    box-sizing: border-box;
    text-align: left !important;
  }

  .block7 .form_group input[type="tel"] {
    margin-top: -8px !important;
    padding-left: 0px;
  }

  .block7 .form_group input:focus,
  .block7 .form_group select:focus,
  .block7 .form_campus_btn:focus {
    outline: none;
    box-shadow: none;
  }


  .block7 .phone_wrapper {
    margin-top: 9px;
    height: 36px;
    border: none;
    border-bottom: 2px solid #D2232A;
    border-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    background: #FFFFFF;
    width: 100% !important;
    box-sizing: border-box;
  }

  .block7 .phone_flag_selector {
    height: 32px;
    padding-left: 4px;
    gap: 2px;
  }

  .block7 .phone_flag_selector .phoneFlagImg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    flex-shrink: 0;
  }

  .block7 .phone_flag_selector .phone-code {
    font-size: 14px;
  }

  .block7 .phone_number input {
    height: 36px;
    font-size: 14px;
    padding: 10px 14px;
    border: none;
    border-bottom: 2px solid #D2232A;
    border-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    background: transparent;
    text-align: left !important;
  }

  .block7 .download_btn {
    height: 36px;
    font-family: "Roboto", Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    background: #D2232A !important;
    background-color: #D2232A !important;
    color: #FFFFFF !important;
    border: none;
    border-bottom: 2px solid #D2232A;
    border-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    margin-top: 27px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100% !important;
    box-sizing: border-box;
  }

  .block7 .download_btn:hover {
    background: #D2232A !important;
    background-color: #D2232A !important;
  }

  .block7 .download_btn:disabled {
    background: #D2232A !important;
    background-color: #D2232A !important;
    opacity: 1 !important;
  }

  .block7 .note .note_icon {
    display: block !important;
    width: 34px !important;
    height: 32px !important;
    min-width: 34px !important;
    min-height: 32px !important;
    max-width: 34px !important;
    max-height: 32px !important;
    flex-shrink: 0 !important;
    object-fit: contain !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 1 !important;
    filter: brightness(0) saturate(100%) invert(15%) sepia(95%) saturate(7158%) hue-rotate(350deg) brightness(90%) contrast(89%) !important;
  }
}

/* КРИТИЧЕСКИ ВАЖНО: Правило для 769px+ должно быть ПОСЛЕ правила для 768px */
@media (min-width: 769px) {
  .block7 .download_btn {
    background: #D2232A !important;
    background-color: #D2232A !important;
    color: white !important;
  }

  .block7 .download_btn:hover {
    background: #D2232A !important;
    background-color: #D2232A !important;
  }

  .block7 .download_btn:disabled {
    background: #D2232A !important;
    background-color: #D2232A !important;
    opacity: 1 !important;
  }
}

@media (max-width: 768px) {

  .block7 .download_btn .form_icon {
    width: 15.22px;
    height: 16.58px;
  }

  .block7 .form_campus_btn {
    height: 36px;
    padding: 10px 14px;
    font-size: 14px;
    margin-top: 9px;
  }

  .block7 .formSelectedCampus {
    font-size: 14px;
  }

  .block7 .note {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-family: "Roboto", Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2857142857142858em;
    color: #000000;
    margin-top: 0;
    margin-bottom: 20px;
    gap: 10px;
    width: 100% !important;
  }

  .block7 .note_text {
    max-width: none !important;
    flex: 1;
    flex-shrink: 1;
    position: relative;
    font-size: 0 !important;
    line-height: 0 !important;
  }

  .block7 .note_text::before {
    content: attr(data-mobile-text);
    display: block;
    font-size: 14px !important;
    line-height: 1.2857142857142858em !important;
  }

  .block7 .note .note_icon {
    display: inline-block !important;
    width: 34px !important;
    height: 32px !important;
    min-width: 34px !important;
    min-height: 32px !important;
    max-width: 34px !important;
    max-height: 32px !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    object-fit: contain !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    z-index: 1 !important;
    order: 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    vertical-align: middle !important;
    filter: brightness(0) saturate(100%) invert(15%) sepia(95%) saturate(7158%) hue-rotate(350deg) brightness(90%) contrast(89%) !important;
  }

  .block7 .request {
    color: #D2232A !important;
  }

  .block7 .form_group label .request {
    color: #D2232A !important;
  }

  .block7 .form_group label[for="name"] .request,
  .block7 .form_group label[for="phone"] .request,
  .block7 .form_group label[for="email"] .request,
  .block7 .form_group label[for="campus"] .request,
  .block7 .form_group label[for="name"] span.request,
  .block7 .form_group label[for="phone"] span.request,
  .block7 .form_group label[for="email"] span.request,
  .block7 .form_group label[for="campus"] span.request,
  .block7 .form_group label .request,
  .block7 .form_group label span.request,
  .block7 label .request,
  .block7 label span.request,
  .block7 .download_form .form_group label[for="name"] .request,
  .block7 .download_form .form_group label[for="phone"] .request,
  .block7 .download_form .form_group label[for="email"] .request,
  .block7 .download_form .form_group label[for="campus"] .request {
    color: #D2232A !important;
  }
}


@media (max-width: 768px) {
  .block7 .form_group label.capcha {
    font-family: "Roboto", Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2857142857142858em;
    color: #000000;
    margin-bottom: 0 !important;
    display: block;
  }

  .block7 .form_group input.antibot_input {
    font-family: "Roboto", Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2857142857142858em;
    color: #000000;
    background: #FFFFFF;
    border: none;
    border-bottom: 2px solid #D2232A;
    border-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    padding: 10px 14px;
    height: 36px;
    margin-top: 9px;
    width: 100%;
    box-sizing: border-box;
    text-align: left !important;
  }

  .block7 .form_group input.antibot_input:focus {
    outline: none;
    box-shadow: none;
  }

  .block7 .form_group input.antibot_input.error {
    border-color: #dc3545;
  }
}

/* ============================================
   ПРОГРАММА ОБУЧЕНИЯ (BLOCK8)
   ============================================ */
.block8 {
  position: relative;
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 0px var(--side-padding);
  box-sizing: border-box;
  --background-max-height: none;
}

.block8::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  max-height: var(--background-max-height);
  margin-left: calc((100vw - 100%) / -2);
  background-image: url('/landing_2025/src/img/info_cis.webp');
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  z-index: 0;
}

@media (min-width: 1440px) {
  .block8::before {
    left: 50%;
    margin-left: -50vw;
    width: 100vw;
    background-size: 110%;
  }
}

@media (min-width: 1600px) {
  .block8::before {
    background-size: 120%;
  }
}

@media (min-width: 1920px) {
  .block8::before {
    background-size: 130%;
  }
}

.img_cis {
  display: none;
}

.school_inform {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
  z-index: 1;
  padding: 50px 0 120px 0;
}

.inform {
  position: relative;
  max-width: var(--content-width);
  width: 100%;
}

@media (max-width: 768px) {
  .block8 {
    --white-bg-height: 0px;
  }

  .block8::before {
    height: 100%;
  }
  
  .block8::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100vw;
    height: var(--white-bg-height);
    margin-left: calc((100vw - 100%) / -2);
    background-color: #FFFFFF;
    z-index: 1;
    pointer-events: none;
  }
  
  @media (min-width: 1440px) {
    .block8::after {
      left: 50%;
      margin-left: -50vw;
      width: 100vw;
    }
  }
  
  .block8 .inform {
    text-align: left !important;
  }

  .block8 .inform .info_cis_title {
    text-align: left !important;
  }

  .block8 .inform .info_p {
    text-align: left !important;
  }
}

.info_cis_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 100%;
  text-align: center;
  color: white;
  margin-bottom: 30px;
}

.info_p {
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  text-align: center;
  color: white;
}

/* Замена текста для info_p при 769px+ */
@media (min-width: 769px) {
  .info_p {
    font-size: 0 !important;
    line-height: 0 !important;
  }
  
  .info_p::before {
    content: attr(data-desktop-text);
    font-size: 16px;
    line-height: 28px;
    font-weight: 400;
    color: white;
    display: block;
    text-align: center;
  }
}

/* ============================================
   КАРТОЧКИ ПРОГРАММ (BLOCK9)
   ============================================ */
.block9 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--side-padding);
  box-sizing: border-box;
}

.container_card {
  display: flex;
  gap: 20px;
  max-width: var(--content-width);
  margin: 0 auto;
  margin-top: var(--container-card-negative-margin, -90px);
  flex-wrap: wrap;
  justify-content: center;
  position: relative;
  z-index: 2;
}

/* Адаптивность для container_card при 1366px и меньше */
@media (max-width: 1373px) {
  .container_card {
    display: grid;
    grid-template-columns: repeat(2, 270px);
    grid-auto-rows: 1fr;
    gap: 20px;
    justify-content: center;
    align-items: stretch;
    justify-items: stretch;
  }
  
  .card_school {
    height: 100%;
    min-height: 100%;
  }
  
  .card_school .card_body_red {
    height: 100%;
  }
}

.card_school_link {
  text-decoration: none;
  color: inherit;
  display: block;
}

.card_school_red {
  background-color: #D2232A;
  border-radius: 16px 16px 0 0;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  width: 270px;
  height: 296px;
  position: relative;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card_school_red::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background-color: #D2232A;
  border-radius: 0 0 16px 16px;
}

.card_school_red:hover {
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
}

.card_school {
  background-color: #efefef;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  width: 270px;
  height: 296px;
  position: relative;
  transition: box-shadow 0.2s ease, background-color 0.15s ease;
}

.card_school::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background-color: #D2232A;
  border-radius: 0 0 16px 16px;
}

/* ============================================
   ЛИЦЕНЗИИ И АККРЕДИТАЦИИ (BLOCK13)
   ============================================ */
.block13 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 50px var(--side-padding);
  box-sizing: border-box;
  background-color: var(--color-white);
}

.block13_container {
  max-width: var(--content-width);
  margin: 0 auto;
}

.block13_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 50px;
  color: var(--color-black);
  text-align: center;
  margin-bottom: 170px;
}

.block13_cards {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}

.block13_card {
  background-color: #EFEFEF;
  border-radius: 16px;
  padding: 0;
  position: relative;
  flex: 1;
  min-width: 300px;
  max-width: 360px;
  display: flex;
  flex-direction: column;
  overflow: visible;
}

.block13_card_images {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin-top: -120px;
  margin-bottom: 30px;
  padding: 0 clamp(56px, 5.625vw, 90px);
  height: clamp(204px, 15vw, 240px);
}

.block13_card_image_left {
  width: clamp(144px, 10.625vw, 170px);
  height: clamp(204px, 15vw, 240px);
  object-fit: cover;
  object-position: center;
  position: relative;
  z-index: 2;
  margin-right: -20%;
}

.block13_card:nth-child(1) .block13_card_image_left,
.block13_card:nth-child(2) .block13_card_image_left {
  object-position: left center;
}

.block13_card_image_right {
  width: 176px;
  height: auto;
  object-fit: contain;
  position: relative;
  z-index: 1;
}

.block13_card:nth-child(3) .block13_card_image_right {
  width: 187px;
}

.block13_card_content {
  padding: 0 20px 30px 20px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  flex: 1;
}

.block13_card_content {
  justify-content: space-between;
}

.block13_card_btn {
  margin-top: auto;
}

/* Обертка для кнопок в третьей карточке */
.block13_card_buttons_wrapper {
  display: flex;
  flex-direction: row;
  gap: 10px;
  margin-top: auto;
}

.block13_card:nth-child(3) .block13_card_buttons_wrapper .block13_card_btn {
  margin-top: 0;
}

/* Кнопка "Детский сад" шире, так как текст больше */
.block13_card_btn_kindergarten {
  width: auto;
  min-width: fit-content;
}

.block13_card_subtitle {
  font-family: "Roboto";
  font-weight: 500;
  font-size: 24px;
  color: var(--color-black);
}

.block13_card_info {
  font-family: "Roboto";
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  color: var(--color-black);
}

.block13_card_btn {
  height: 48px;
  font-family: "Roboto", Arial, sans-serif;
  background: #D2232A;
  color: white;
  border: none;
  padding: 12px 24px;
  font-size: 18px;
  font-weight: 400;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  transition: background 0.3s ease;
  margin-top: auto;
}

.block13_card_btn:hover {
  background: #b01e25;
}

.block13_card_btn img {
  width: 18px;
  height: 18px;
  filter: brightness(0) invert(1);
}

.block13_card_btn span {
  color: white;
}

/* Обертка для кнопок в третьей карточке */
.block13_card_buttons_wrapper {
  display: flex;
  flex-direction: row;
  gap: 10px;
  margin-top: auto;
}

.block13_card:nth-child(3) .block13_card_buttons_wrapper .block13_card_btn {
  margin-top: 0;
}

/* Кнопка "Детский сад" шире, так как текст больше */
.block13_card_btn_kindergarten {
  width: auto;
  min-width: fit-content;
}

@media (max-width: 1023px) {
  .form_container {
    display: flex;
    flex-direction: column;
  }

  .block13_cards {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    overflow-y: visible;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
    padding-top: 120px;
    padding-bottom: 10px;
    cursor: grab;
    -webkit-overflow-scrolling: touch;
    transition: scrollbar-color 0.3s ease;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-left: 0;
    padding-right: 0;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }

  .block13_title {
    margin-bottom: 50px;
  }

  .block13_cards:hover,
  .block13_cards:active,
  .block13_cards.scrolling {
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
  }

  .block13_cards::-webkit-scrollbar {
    height: 6px;
  }

  .block13_cards::-webkit-scrollbar-track {
    background: transparent;
  }

  .block13_cards::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 3px;
    transition: background 0.3s ease;
  }

  .block13_cards:hover::-webkit-scrollbar-thumb,
  .block13_cards:active::-webkit-scrollbar-thumb,
  .block13_cards.scrolling::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
  }

  .block13_cards::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
  }

  .block13_cards:active {
    cursor: grabbing;
  }

  .block13_card {
    flex: 0 0 auto;
    min-width: 300px;
    max-width: 360px;
    width: 100%;
    overflow: visible;
  }

  .block13_cards .block13_card:first-child {
    margin-left: var(--side-padding);
  }

  .block13_cards .block13_card:last-child {
    margin-right: var(--side-padding);
  }
}

@media (max-width: 768px) {
  .block13 {
    padding-top: 32px !important;
    padding-bottom: 0px !important;
  }

  .block13_title {
    font-size: 24px !important;
    margin-bottom: 20px;
  }

  .block13_card {
    max-width: 313px !important;
  }

  .block13_card_subtitle {
    font-size: 16px !important;
    font-weight: 700 !important;
  }

  .block13_card_content {
    gap: 25px !important;
  }

  .block13_card_info {
    font-size: 14px !important;
  }

  .block13_card_btn {
    font-size: 14px !important;
    padding: 10px;
  }
  
  /* Обертка для кнопок в третьей карточке на 768px */
  .block13_card_buttons_wrapper {
    flex-direction: row;
    gap: 10px;
  }
  
  .block13_card:nth-child(3) .block13_card_buttons_wrapper .block13_card_btn {
    flex: 1;
  }
  
  /* Кнопка "Школа" немного уже на 768px */
  .block13_card:nth-child(3) .block13_card_buttons_wrapper .block13_card_btn_school {
    flex: 0.85;
  }
  
  /* Кнопка "Детский сад" занимает больше места */
  .block13_card:nth-child(3) .block13_card_buttons_wrapper .block13_card_btn_kindergarten {
    flex: 1.15;
  }

  .block13_card_image_left {
    width: 144px !important;
    height: 204px !important;
  }

  /* Кембриджские международные экзамены (карточка 1) */
  .block13_card:nth-child(1) .block13_card_image_right {
    width: 150px !important;
    height: 150px !important;
  }

  /* The Duke of Edinburgh's International Award (карточка 2) */
  .block13_card:nth-child(2) .block13_card_image_right {
    width: 150px !important;
    height: 125px !important;
  }

  /* Лицензия Министерства образования Республики Узбекистан (карточка 3) */
  .block13_card:nth-child(3) .block13_card_image_right {
    width: 159px !important;
    height: 162px !important;
  }
}

@media (min-width: 769px) {
  .block13_card_subtitle {
    font-size: 16px;
  }

  .block13_card_info {
    font-size: 16px;
  }

  .block13_card_btn {
    font-size: 16px;
  }

  .block13_card_btn span {
    font-size: 16px;
  }
}


.card_school .card_body_red {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s ease, visibility 0.15s ease;
}

.card_school:hover,
.card_school.active {
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
  background-color: #D2232A;
  border-radius: 16px;
}

.card_school:hover::after,
.card_school.active::after {
  display: none;
}

.card_school:hover .card_header,
.card_school:hover .card_body,
.card_school.active .card_header,
.card_school.active .card_body {
  opacity: 0;
  visibility: hidden;
}

.card_school:hover .card_body_red,
.card_school.active .card_body_red {
  opacity: 1;
  visibility: visible;
  justify-content: space-between;
}

.card_header {
  padding: 24px;
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 24px;
  line-height: 32px;
  text-align: center;
  color: #000000;
  transition: opacity 0.15s ease, visibility 0.15s ease;
  flex-shrink: 0;
}

.card_body_red {
  background-color: transparent;
  padding: 20px;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 16px;
}

.card_body {
  padding: 20px;
  text-align: center;
  transition: opacity 0.15s ease, visibility 0.15s ease;
}

.program_title {
  font-weight: 400;
  font-size: 20px;
  /* line-height: 100%; */
  text-align: center;
  margin-top: 20px;
  color: white;
}

.program_subtitle {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 24px;
  line-height: 32px;
  text-align: center;
  padding-top: 10px;
  color: white;
}

.age_badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Roboto, sans-serif;
  background-color: #e30613;
  font-size: 16px;
  font-weight: 400;
  padding: 6px 16px;
  width: 133px;
  height: 41px;
  border-radius: 6px;
  margin-top: 30px;
  color: white;
}

.card_body_red .age_badge {
  background-color: #a52b31;
}

@media (min-width: 769px) {
  .card_body_red .age_badge {
    white-space: nowrap;
  }
}

/* Адаптивность для container_card при 768px */
@media (max-width: 768px) {
  .container_card {
    grid-template-columns: repeat(2, 165px);
    grid-auto-rows: 1fr;
    gap: clamp(15px, 2vw, 20px);
    align-items: stretch;
    justify-items: stretch;
    justify-content: center;
  }
  
  /* Карточка всегда красная, без hover эффекта */
  .card_school {
    background-color: #D73237 !important;
    border-radius: 12px;
    width: 165px;
    height: 100%;
    min-height: 100%;
    transform: none !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    display: flex;
    flex-direction: column;
  }
  
  .card_school::after {
    display: none;
  }
  
  /* Скрываем обычные элементы карточки */
  .card_school .card_header,
  .card_school .card_body {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }
  
  /* Всегда показываем красную версию */
  .card_school .card_body_red {
    opacity: 1 !important;
    visibility: visible !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    background-color: transparent;
    padding: 24px 8px;
    gap: 10px;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    height: 100% !important;
    position: static !important;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }
  
  /* Убираем hover эффекты */
  .card_school:hover {
    transform: none !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    background-color: #D73237 !important;
  }
  
  .card_school:hover .card_header,
  .card_school:hover .card_body {
    display: none !important;
  }
  
  .card_school:hover .card_body_red {
    opacity: 1 !important;
    visibility: visible !important;
  }
  
  /* Стили для текста в card_body_red согласно Figma */
  .card_body_red .program_subtitle {
    font-family: Lora, serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 1em;
    text-align: center;
    color: #FFFFFF;
    padding-top: 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }
  
  .card_body_red .program_title {
    font-family: Roboto, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.5em;
    text-align: center;
    color: #FFFFFF;
    padding-top: 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }
  
  .card_body_red .age_badge {
    background-color: #B9181D;
    font-family: Roboto, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.171875em;
    padding: clamp(6px, 1.5vw, 8px) clamp(12px, 3vw, 16px);
    width: auto;
    height: auto;
    min-width: auto;
    border-radius: 4px;
    margin-top: 0;
    color: #FFFFFF;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: normal;
  }
  
  .card_body_red .students {
    display: none;
  }

  .program_title {
    margin-top: 0;
  }
}

/* При 380px и меньше карточки растягиваются по наибольшему элементу */
@media (max-width: 380px) {
  .container_card {
    grid-template-columns: repeat(2, 1fr) !important;
    grid-auto-rows: 1fr;
    align-items: stretch;
    justify-items: stretch;
  }
  
  .card_school {
    width: 100% !important;
    height: 100% !important;
    min-height: 100%;
  }
  
  .card_school .card_body_red {
    padding: 20px 8px;
    gap: 10px;
    height: 100% !important;
  }
}


.students {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 16px;
  flex-wrap: wrap;
}

.student {
  /* width: 205px;
  height: 203px; */
  object-fit: cover;
  margin-top: -27px;
}

.book {
  width: 250px;
  height: 203px;
  margin: 0 auto 12px;
  margin-top: -39px;
  display: block;
  object-fit: contain;
}

/* Детский сад — отдельные стили для первого изображения */
.book_kindergarten {
  width: 250px;
  height: 203px;
  margin: 0 auto 12px;
  margin-top: -39px;
  display: block;
  object-fit: contain;
}

/* Начальная школа — отдельные стили для второго изображения */
.book_primary {
  width: 250px;
  height: 203px;
  margin: 0 auto 12px;
  margin-top: -39px;
  display: block;
  object-fit: contain;
}

.laptop {
  /* width: 250px;
  height: 203px; */
  margin-top: -27px;
  display: block;
  object-fit: contain;
}

/* ============================================
   АККОРДЕОН (BLOCK10)
   ============================================ */
.block10 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding:  70px var(--side-padding) 45px;
  box-sizing: border-box;
}

.container_accordion {
  max-width: 1140px;
  background-color: #fff;
  font-family: "Roboto" !important;
}

.accordion_text {
  text-align: center;
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  margin-bottom: 30px;
  color: #000000;
}

.accordion_item {
  margin-bottom: 12px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  overflow: hidden;
}

.accordion_header {
  padding: 16px 20px;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: bold;
  font-size: 18px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background-color 0.3s;
  position: relative;
}

.accordion_header .accordion_info {
  flex: 1;
  padding-right: 50px;
  min-width: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.accordion_header:hover {
  background-color: #ebebeb;
}

.accordion_header::before {
  content: "";
  position: absolute;
  width: 18px;
  height: 2px;
  background-color: #D9D9D9;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.3s;
}

.accordion_header::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 18px;
  background-color: #D9D9D9;
  right: 29px;
  top: 50%;
  transform: translateX(50%) translateY(-50%);
  transition: all 0.3s;
}

.accordion_header.active::before {
  width: 18px;
  height: 2px;
  background-color: #D2232A;
  right: 20px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.accordion_header.active::after {
  width: 18px;
  height: 2px;
  background-color: #D2232A;
  right: 29px;
  top: 50%;
  transform: translateX(50%) translateY(-50%) rotate(-45deg);
}

.accordion_info {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 24px;
  line-height: 36px;
  color: #000000;
}


.accordion_content {
  padding: 0 20px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.8s cubic-bezier(0.4, 0, 0.2, 1), padding 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  background-color: #fff;
}

.accordion_content.open {
  padding: 20px;
  max-height: 5000px;
}

/* Двухколоночный layout для всех аккордеонов при 769px+ */
@media (min-width: 769px) {
  .accordion_content.open {
    display: flex;
    gap: 40px;
  }

  .accordion_content.open .accordion_column_left,
  .accordion_content.open .accordion_column_right {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    min-width: 0;
  }
}

/* Gap для accordion_content.open при 768px */
@media (max-width: 768px) {
  .accordion_content.open {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  
  /* Предотвращаем разрыв цены при переносе строки */
  .accordion_column_left p .accordion_price {
    white-space: nowrap;
    display: inline;
  }
}

.accordion_content.open * {
  font-size: 16px;
}

.accordion_content p {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  margin: 0 0 16px 0;
  color: black;
}

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

.accordion_dash {
  color: #D2232A;
}

/* Красные дефисы во всех открытых аккордеонах */
.accordion_content.open .accordion_dash,
.accordion_content.open span.accordion_dash {
  color: #D2232A;
}

.step3_info {
  margin: 16px 0;
}

.step3_item {
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  margin-bottom: 8px;
  color: black;
  position: relative;
  padding-left: 0;
}

.step3_item::before {
  content: "— ";
  color: var(--color-red);
  font-weight: 400;
}

.step3_item:first-child {
  margin-top: 0;
}

.step3_item:last-child {
  margin-bottom: 0;
}

.footer_note {
  margin-top: 30px;
  text-align: center;
  color: black;
  font-family: Roboto;
  font-weight: 400;
  font-style: Regular;
  font-size: 16px;

}

.close_x {
  color: #D2232A;
  font-weight: bold;
  font-size: 18px;
}

/* ============================================
   СТОИМОСТЬ ОБУЧЕНИЯ (BLOCK12)
   ============================================ */
.block12 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 50px var(--side-padding);
  box-sizing: border-box;
  background-color: var(--color-white);
}

.block12_container {
  max-width: var(--content-width);
  margin: 0 auto;
}

/* Блок с текстом */
.block12_text {
  text-align: center;
  margin-bottom: 40px;
}

.block12_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 50px;
  color: var(--color-black);
  margin-bottom: 35px;
}

.block12_info {
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  color: var(--color-black);
}

/* Новая структура для 769px+ */
@media (min-width: 769px) {
  .block12_text {
    display: grid;
    grid-template-columns: 1fr 454px;
    gap: 40px;
    align-items: start;
    text-align: left;
    margin-bottom: 40px;
  }
  
  .block12_info {
    display: none;
  }
  
  .block12_text_left {
    display: flex;
    flex-direction: column;
  }
  
  .block12_title {
    text-align: left;
    margin-bottom: 30px;
  }
  
  .block12_text_info_wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
  
  .block12_text_info_left,
  .block12_text_info_right {
    display: flex;
    flex-direction: column;
  }
  
  .block12_text_info_left p,
  .block12_text_info_right p {
    margin: 0;
    font-family: Roboto, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: var(--color-black);
  }
  
  .block12_text_info_left strong,
  .block12_text_info_right strong {
    font-weight: 700;
  }
  
  .block12_text_dash {
    color: #D2232A;
  }
  
  .block12_text_campus_image_wrapper {
    position: relative;
    width: 454px;
    height: 229px;
    border-radius: 12px;
    overflow: hidden;
  }
  
  .block12_text_campus_image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  
  .block12_text_campus_image_overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px 20px;
    background: linear-gradient(180deg, rgba(102, 102, 102, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  
  .block12_text_campus_name {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #FFFFFF;
    line-height: 1.5;
  }
  
  .block12_text_campus_info_icon {
    width: 36px;
    height: 36px;
    border-radius: 6px;
    border: 1px solid #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: Roboto, Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: #FFFFFF;
    flex-shrink: 0;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease;
  }
  
  .block12_text_campus_info_icon:hover {
    opacity: 0.8;
    transform: scale(1.05);
  }
  
  .block12_text_campus_info_icon:active {
    transform: scale(0.95);
  }
}

/* Скрываем новую структуру на 768px и меньше */
@media (max-width: 768px) {
  .block12_text_info_wrapper,
  .block12_text_campus_image_wrapper {
    display: none;
  }
  
  .block12_text_left {
    display: block;
  }
  
  .block12_title {
    display: block;
    text-align: center;
    margin-bottom: 20px;
  }
  
  .block12_info {
    display: block;
  }
  
  .block12_text {
    text-align: center;
  }
}

/* Блок с кнопками кампусов */
.block12_campus_tabs {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 50px;
  gap: 10px;
}

.block12_campus_selector_wrapper {
  display: none;
}

.block12_year_selector_wrapper {
  display: none;
}

/* На 769px+ показываем селекторы вместо кнопок */
@media (min-width: 769px) {
  .block12_campus_tabs {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
    margin-bottom: 50px;
  }
  
  .block12_campus_btn {
    display: none;
  }
  
  .block12_campus_selector_wrapper {
    position: relative;
    display: block;
    width: calc((100% - 60px) / 4);
    min-width: 250px;
  }
  
  .block12_year_selector_wrapper {
    position: relative;
    display: block;
    width: calc((100% - 60px) / 4);
    min-width: 250px;
  }
  
  .block12_campus_selector_btn {
    padding: 5px 20px;
    width: 100%;
    min-height: 48px;
    background: #D2232A;
    color: #fff;
    border: 2px solid #D2232A;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    gap: 10px;
  }
  
  .block12_campus_selector_btn .block12_campus_arrow {
    font-size: 17px;
    transition: transform 0.3s ease;
    color: inherit;
    display: inline-block;
  }
  
  .block12_campus_selector_btn.menu-open .block12_campus_arrow {
    transform: rotate(180deg);
  }
  
  .block12_campus_modal {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 6px;
    box-shadow: inset 0px 4px 8px 0px rgba(217, 217, 217, 1);
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 400px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 1000;
    box-sizing: border-box;
  }
  
  .block12_campus_modal.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  
  .block12_campus_option {
    padding: 0 20px;
    cursor: pointer;
    transition: background 0.2s;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.171875em;
    color: #231F20;
    border-bottom: 1px solid #EFEFEF;
    position: relative;
    z-index: 1001;
    pointer-events: auto !important;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    flex-shrink: 0;
    min-height: 36px;
    height: 36px;
    display: flex;
    align-items: center;
  }
  
  .block12_campus_option:last-child {
    border-bottom: none;
  }
  
  .block12_campus_option:hover {
    background: #f9f9f9;
  }
  
  .block12_campus_option.selected,
  .block12_campus_option.active {
    background: #EFEFEF;
    font-weight: 700;
  }
  
  .block12_year_selector_btn {
    padding: 5px 20px;
    width: 100%;
    min-height: 48px;
    background: #fff;
    color: #D2232A;
    border: 2px solid #D2232A;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    gap: 10px;
    text-align: left;
  }
  
  .block12_year_selector_btn span:first-child {
    text-align: left;
    flex: 1;
  }
  
  .block12_year_selector_btn .block12_year_arrow {
    font-size: 17px;
    transition: transform 0.3s ease;
    color: #D2232A;
    display: inline-block;
  }
  
  .block12_year_selector_btn.menu-open .block12_year_arrow {
    transform: rotate(180deg);
  }
  
  .block12_year_modal {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 6px;
    box-shadow: inset 0px 4px 8px 0px rgba(217, 217, 217, 1);
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 400px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 1000;
    box-sizing: border-box;
  }
  
  .block12_year_modal.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  
  .block12_year_option {
    padding: 0 20px;
    cursor: pointer;
    transition: background 0.2s;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.171875em;
    color: #231F20;
    border-bottom: 1px solid #EFEFEF;
    position: relative;
    z-index: 1001;
    pointer-events: auto !important;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    flex-shrink: 0;
    min-height: 36px;
    height: 36px;
    display: flex;
    align-items: center;
  }
  
  .block12_year_option:last-child {
    border-bottom: none;
  }
  
  .block12_year_option:hover {
    background: #f9f9f9;
  }
  
  .block12_year_option.selected,
  .block12_year_option.active {
    background: #EFEFEF;
    font-weight: 700;
  }
}

.block12_campus_btn {
  padding: 5px 20px;
  width: 206.75px;
  min-height: 48px;
  height: auto;
  background: #fff;
  color: #c00;
  border: 2px solid #c00;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 700;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-family: "Roboto";
  font-size: 16px;
  text-align: center;
  line-height: 1.2;
}

.block12_campus_btn.active {
  background: #c00;
  color: #fff;
  width: 246.56px;
  min-height: 48.02px;
}

/* Блок с ценами */
.block12_prices {
  margin-top: 50px;
}


/* Кнопки категорий - скрыты по умолчанию на больших экранах */

.block12_prices_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 1fr;
  align-items: stretch;
  gap: 20px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}

.block12_prices_slides {
  display: contents;
}

.block12_prices_grid {
  padding-bottom: 10px;
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  transition: scrollbar-color 0.3s ease;
}

.block12_prices_grid:hover,
.block12_prices_grid:active,
.block12_prices_grid.scrolling {
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

.block12_prices_grid::-webkit-scrollbar {
  height: 6px;
}

.block12_prices_grid::-webkit-scrollbar-track {
  background: transparent;
}

.block12_prices_grid::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 3px;
  transition: background 0.3s ease;
}

.block12_prices_grid:hover::-webkit-scrollbar-thumb,
.block12_prices_grid:active::-webkit-scrollbar-thumb,
.block12_prices_grid.scrolling::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}

.block12_prices_grid::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.3);
}

.block12_prices_grid:active {
  cursor: grabbing;
}

.block12_price_item[data-campus] {
  display: none;
}

/* По умолчанию Горки для России (JS переключит на Ташкент для Узбекистана) */
.block12_price_item[data-campus="gorki"] {
  display: flex;
}

.block12_price_item {
  background: #fff;
  border-width: 2px;
  border-style: solid;
  border-color: #D9D9D9;
  border-radius: 6px;
  padding: 25px 30px 30px 30px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  height: 100%;
  box-sizing: border-box;
}

/* Заголовок */
.block12_price_title {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 700;
  font-size: 28px;
  line-height: 1.2;
  color: var(--color-black);
  display: flex;
  align-items: center;
}

@media (min-width: 769px) {
  .block12_price_title {
    font-family: Lora, serif;
    font-weight: 500;
    align-items: start;
    min-height: auto;
  }
}

@media (max-width: 768px) {
  .block12_price_title {
    font-family: Lora, serif;
    font-weight: 500;
    font-size: 24px;
    letter-spacing: 0%;
  }
}

/* Подзаголовок (годы обучения) */
.block12_price_subtitle {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.2;
  color: var(--color-black);
  min-height: 22px;
  display: flex;
  align-items: center;
}

/* Заголовок и подзаголовок - объединенный блок */
.block12_price_header {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Цены - объединенный блок */
.block12_price_prices {
  display: flex;
  flex-direction: column;
}

/* Убираем интерактивность в block12_prices_grid - как в info_school_2_carousel */
.block12_prices_grid .block12_price_item {
  cursor: default;
}

.block12_prices_grid .block12_price_item:hover {
  transform: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* Убираем клики с кнопок внутри block12_price_info */
.block12_prices_grid .block12_price_info_btn {
  cursor: default;
  pointer-events: none;
}

.block12_prices_grid .block12_price_info_btn:hover {
  background: inherit;
  border-color: inherit;
}

/* Возраст - контейнер */
.block12_price_age {
  margin: 5px 0;
  min-height: 58px;
  display: flex;
  align-items:last baseline;
  gap: 10px;
}

/* Возраст - левый блок */
.block12_price_age_left {
  font-family: Lora, serif !important;
  font-weight: 500;
  font-size: 48px;
  line-height: 1.2;
  color: #D2232A;
  display: flex;
  align-items: center;
}

/* Возраст - правый блок */
.block12_price_age_right {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.2;
  color: #D2232A;
  display: flex;
  align-items: center;
  transform: translateY(-2px);
}

/* Цена со скидкой - объединяем в один блок */
.block12_price_with {
  display: inline-block;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.2;
  color: var(--color-black);
  width: 100%;
}

/* Скрываем block12_price_with, если block12_price_discount_date пустой */
.block12_price_with:has(.block12_price_discount_date:empty) {
  display: none;
}

/* Но всегда показываем первый блок, даже если у него пустая дата (чтобы была хотя бы одна строка) */
.block12_price_prices > .block12_price_with:first-child:has(.block12_price_discount_date:empty) {
  display: inline-block;
}

/* Если первый блок имеет пустую дату, скрываем второй блок */
.block12_price_prices > .block12_price_with:first-child:has(.block12_price_discount_date:empty) ~ .block12_price_with {
  display: none;
}

.block12_price_with_discount {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 700 !important;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: 0%;
  color: var(--color-black);
  display: inline;
}

.block12_price_discount_date {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #666;
  display: block;
  margin-top: 4px;
}

/* Если block12_price_with_discount напрямую в block12_price_prices */
.block12_price_prices > .block12_price_with_discount {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 700 !important;
  font-size: 18px;
  line-height: 1.2;
  color: var(--color-black);
  display: block;
}

/* Информационный блок */
.block12_price_info {
  background: #EFEFEF;
  padding: 17px 17px 20px 30px;
  border: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.block12_price_info_content {
  flex: 1;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.block12_price_info_text {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: #000000;
  text-align: left;
}

.block12_price_info_text p {
  margin: 0;
  font-size: 16px;
}

.block12_price_info_buttons {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.block12_price_info_btn {
  width: auto;
  padding: 10px 20px;
  border-radius: 6px;
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.2;
  cursor: default;
  transition: none;
  border: 2px solid transparent;
  box-sizing: border-box;
  pointer-events: none;
}

.block12_price_info_btn_red {
  background: #c00;
  color: #fff;
  border-color: #c00;
}

.block12_price_info_btn_red:hover {
  background: #c00;
  border-color: #c00;
}

/* Скрываем кнопку "2026-2027 год" в block12_price_info при 768px и меньше */
@media (max-width: 768px) {

  .block12_price_info {
    padding: 30px 17px 20px 30px;
  }
  
  .block12_price_info_text {
    font-size: 14px;
  }
  
  .block12_price_info_buttons {
    font-size: 14px;
  }
  
  .block12_price_info_buttons .block12_price_info_btn {
    font-size: 14px;
  }
  
  .block12_price_info_content {
    align-items: flex-start;
  }
}


/* Адаптивность для block12 */
@media (max-width: 1200px) {
  .block12_prices_grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .block12_prices_grid {
    display: flex;
    overflow: hidden;
    gap: 16px;
    padding-top: 18px;
    padding-left: 0;
    padding-right: var(--side-padding);
    grid-template-columns: none;
    width: 100vw;
    /* Компенсируем padding контейнера слева и выходим за его пределы */
    /* Используем left: 0 для позиционирования с края экрана */
    position: relative;
    left: calc(0px - var(--side-padding));
    margin-left: calc((100vw - 100%) / -2);
    margin-right: calc((100vw - 100%) / -2);
    box-sizing: border-box;
  }
  
  /* Swiper стили */
  .block12_prices_grid.swiper {
    overflow: hidden;
    gap: 0; /* Swiper использует spaceBetween вместо gap */
    position: relative;
  }
  
  .block12_prices_slides.swiper-wrapper {
    display: flex;
    gap: 0; /* Swiper использует spaceBetween вместо gap */
    cursor: grab;
    will-change: transform;
    transition-property: transform;
    box-sizing: content-box;
    width: auto !important; /* Позволяем wrapper расширяться */
    min-width: max-content; /* Обеспечиваем минимальную ширину для всех слайдов */
    /* Убираем padding-left при использовании centeredSlides - Swiper сам центрирует */
  }
  
  /* Базовые стили для не-Swiper режима */
  .block12_prices_slides:not(.swiper-wrapper) {
    display: flex;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    gap: 16px;
    cursor: grab;
    will-change: transform;
  }
  
  .block12_prices_slides.dragging {
    cursor: grabbing;
    transition: none;
  }
  
  .block12_prices_slides .price-item-clone {
    pointer-events: none;
  }
  
  .block12_prices_grid .block12_price_item.swiper-slide {
    width: 270px !important;
    flex: 0 0 270px !important;
    min-width: 270px !important;
    max-width: 270px !important;
    height: auto;
    margin-right: 0 !important;
    margin-left: 0 !important;
    box-sizing: border-box;
  }
  
  /* Отступ между слайдами Swiper (spaceBetween работает через margin-right) */
  .block12_prices_grid.swiper .swiper-slide:not(:last-child) {
    margin-right: 16px !important;
  }
  
  .block12_prices_grid .block12_price_item {
    width: 270px;
    flex: 0 0 270px;
    min-width: 270px;
    height: auto;
  }
  
  /* Убираем margin-left для первого слайда, если он не должен иметь отступ */
  /* Отступ для первого слайда теперь задается выше в правиле для .block12_prices_grid .block12_price_item:first-child */
  
  .block12_prices_grid .block12_price_item:last-child {
    margin-right: 0 !important;
  }
  
  .block12_prices_grid.block12_prices_grid_centered {
    box-sizing: border-box;
  }

  .block12_prices_grid.block12_prices_grid_centered .block12_price_item:first-child {
    margin-left: 0 !important;
  }
  
  .block12_prices_grid.block12_prices_grid_centered .block12_price_item:last-child {
    margin-right: 0 !important;
  }
  
  .block12_prices_grid .block12_price_item {
    flex: 0 0 270px;
    width: 270px;
    min-width: 270px;
    height: auto;
  }
  
  .block12_price_info_mobile {
    background: #EFEFEF;
    padding: 17px 17px 20px 30px;
    border: none;
    display: flex !important;
    flex-direction: column;
    justify-content: space-between;
  }
  
  .block12_price_info_mobile_content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
  }
  
  .block12_price_info_mobile_text {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 1.5;
    color: #000000;
    text-align: left;
    margin-bottom: 20px;
  }
  
  .block12_price_info_mobile_btn {
    width: auto;
    padding: 10px 20px;
    border-radius: 6px;
    font-family: Roboto, Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 1.2;
    background: #D2232A;
    color: #fff;
    border: none;
    cursor: pointer;
    align-self: flex-start;
  }
  
  .block12_price_info_mobile_btn:hover {
    background: #D2232A;
    opacity: 0.9;
  }
  
  .block12_campus_btn {
    width: calc(50% - 5px);
    min-width: 180px;
  }
  
  .block12_campus_btn:hover {
    width: calc(50% - 5px);
  }
}

@media (max-width: 600px) {
  .block12_prices_grid {
    grid-template-columns: 1fr;
  }
  
  .block12_campus_btn {
    width: 100%;
  }

  .block12_prices_grid.block12_prices_grid_centered {
    justify-content: start;
  }
  .block12_campus_btn:hover {
    width: 100%;
  }
  
  .block12_title {
    font-size: 36px;
    line-height: 40px;
  }
  
  .block7 .phone_flag_selector .phone_modal_wrapper {
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
}

@media (max-width: 420px) {
  .block7 .phone_flag_selector .phone_modal_wrapper {
    left: 30% !important;
    top: calc(100% + 10px) !important;
    transform: translateX(-50%) !important;
  }
}

/* Базовые стили для кнопок категорий */
.block12_category_buttons {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  width: 100%;
  margin-bottom: 16px;
}

.block12_category_btn {
  width: 100%;
  min-height: 48px;
  height: auto;
  padding: 5px 10px;
  background: #fff;
  color: #D2232A;
  border: 2px solid #D2232A;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-family: "Roboto";
  font-size: 20px;
  font-weight: 400;
}

.block12_category_btn_active,
.block12_category_btn.active {
  background: #D2232A;
  color: #fff;
}

.block12_category_btn:hover {
  background: #fff;
  color: #D2232A;
}

.block12_category_btn_active:hover,
.block12_category_btn.active:hover {
  background: #D2232A;
  color: #fff;
}

/* Скрываем кнопки категорий на больших экранах */
@media (min-width: 769px) {
  .block12_category_buttons {
    display: none;
  }
}

/* Адаптивность для block12_campus_tabs при 1023px и меньше */
@media (max-width: 1023px) {
  .block12_campus_tabs {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
  }

  .block12_campus_btn {
    display: none;
  }

  .block12_campus_selector_wrapper {
    position: relative;
    display: block;
  }

  .block12_campus_selector_btn {
    padding: 5px 20px;
    width: 100%;
    min-height: 48px;
    background: #D2232A;
    color: #fff;
    border: 2px solid #D2232A;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    font-family: "Roboto";
    font-size: 20px;
    font-weight: 400;
    gap: 10px;
  }

  .block12_campus_selector_btn .block12_campus_arrow {
    font-size: 17px;
    transition: transform 0.3s ease;
    color: inherit;
    display: inline-block;
  }

  .block12_campus_selector_btn.menu-open .block12_campus_arrow {
    transform: rotate(180deg);
  }

  .block12_campus_modal {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 6px;
    box-shadow: inset 0px 4px 8px 0px rgba(217, 217, 217, 1);
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 400px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 1000;
    box-sizing: border-box;
  }

  .block12_campus_modal.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .block12_campus_option {
    padding: 0 20px;
    cursor: pointer;
    transition: background 0.2s;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.171875em;
    color: #231F20;
    border-bottom: 1px solid #EFEFEF;
    position: relative;
    z-index: 1001;
    pointer-events: auto !important;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    flex-shrink: 0;
    min-height: 36px;
    height: 36px;
    display: flex;
    align-items: center;
  }

  .block12_campus_option:last-child {
    border-bottom: none;
  }

  .block12_campus_option:hover {
    background: #f9f9f9;
  }

  .block12_campus_option.selected,
  .block12_campus_option.active {
    background: #EFEFEF;
    font-weight: 700;
  }

}

/* ============================================
   НАША КОМАНДА (BLOCK14)
   ============================================ */
.block14 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 0px var(--side-padding);
  box-sizing: border-box;
  background-color: var(--color-white);
}

.block14_container {
  max-width: var(--content-width);
  margin: 0 auto;
}

/* Заголовок и навигация в одной строке */
.block14_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0px;
}

.block14_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 1.33;
  color: var(--color-black);
  margin: 0;
}

/* Нижний блок с описанием и кнопкой */
.block14_bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 30px;
  margin-bottom: 60px;
  gap: 30px;
}

.block14_subtitle {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.4;
  color: var(--color-black);
  flex: 1;
  max-width: 780px;
  margin: 0;
}

/* Селектор кампуса в block14_bottom */
.block14_bottom .block14_campus_selector_wrapper {
  flex-shrink: 0;
  display: none; /* По умолчанию скрыт, показывается только на 769px+ */
}

@media (min-width: 769px) {
  .block14_subtitle {
    font-size: 16px;
  }
  
  .block14_bottom .block14_campus_selector_wrapper {
    display: block;
  }
}

.block14_btn {
  background: #D2232A;
  color: white;
  border: none;
  font-size: 16px;
  font-weight: 400;
  font-family: Roboto, Arial, sans-serif;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.3s ease;
  white-space: nowrap;
  height: 38px;
  min-width: 318px;
  flex-shrink: 0;
}

.block14_btn:hover {
  background: #b01e25;
}

/* Кнопки выбора кампуса в блоке 14 */
.block14_campus_buttons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 50px;
  gap: 10px;
  width: 100%;
}

/* На 769px+ показываем селектор вместо кнопок */
@media (min-width: 769px) {
  .block14_campus_buttons {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
  }
  
  .block14_campus_btn {
    display: none;
  }
  
  .block14_campus_selector_wrapper {
    position: relative;
    display: block;
    min-width: 250px;
  }
  
  /* Скрываем селектор в block14_campus_buttons на 769px+ */
  .block14_campus_buttons .block14_campus_selector_wrapper {
    display: none;
  }
  
  /* Показываем селектор в block14_bottom на 769px+ */
  .block14_bottom .block14_campus_selector_wrapper {
    display: block;
  }
  
  /* Стили для селектора в block14_bottom: белый фон, красный текст и стрелка */
  .block14_bottom .block14_campus_selector_btn {
    background: #fff;
    color: #D2232A;
    border: 2px solid #D2232A;
  }
  
  .block14_bottom .block14_campus_selector_btn .block14_campus_arrow {
    color: #D2232A;
  }
  
  .block14_campus_selector_btn {
    padding: 5px 20px;
    width: 100%;
    min-height: 48px;
    background: #D2232A;
    color: #fff;
    border: 2px solid #D2232A;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    gap: 10px;
  }
  
  .block14_campus_selector_btn .block14_campus_arrow {
    font-size: 17px;
    transition: transform 0.3s ease;
    color: inherit;
    display: inline-block;
  }
  
  .block14_campus_selector_btn.menu-open .block14_campus_arrow {
    transform: rotate(180deg);
  }
  
  .block14_campus_modal {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 6px;
    box-shadow: inset 0px 4px 8px 0px rgba(217, 217, 217, 1);
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 400px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 1000;
    box-sizing: border-box;
  }
  
  .block14_campus_modal.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  
  .block14_campus_option {
    padding: 0 20px;
    cursor: pointer;
    transition: background 0.2s;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.171875em;
    color: #231F20;
    border-bottom: 1px solid #EFEFEF;
    position: relative;
    z-index: 1001;
    pointer-events: auto !important;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    flex-shrink: 0;
    min-height: 36px;
    height: 36px;
    display: flex;
    align-items: center;
  }
  
  .block14_campus_option:last-child {
    border-bottom: none;
  }
  
  .block14_campus_option:hover {
    background: #f9f9f9;
  }
  
  .block14_campus_option.selected,
  .block14_campus_option.active {
    background: #EFEFEF;
    font-weight: 700;
  }
}

/* Адаптивность для block14_campus_buttons при 1023px и меньше (только для 768px и меньше) */
@media (max-width: 768px) {
  .block14_campus_buttons {
    display: flex !important;
    justify-content: center;
    width: 100%;
    margin-bottom: 20px;
  }
  
  .block12_campus_tabs {
    position: relative;
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
  }

  .block14_campus_btn {
    display: none;
  }

  .block14_campus_buttons .block14_campus_selector_wrapper {
    position: relative;
    display: block;
    width: 100%;
  }
  
  .block14_bottom .block14_campus_selector_wrapper {
    display: none !important;
  }

  .block14_campus_buttons .block14_campus_selector_btn {
    padding: 5px 20px;
    width: 100%;
    min-height: 48px;
    background: #D2232A !important;
    color: #fff !important;
    border: 2px solid #D2232A !important;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    font-family: "Roboto";
    font-size: 16px;
    gap: 10px;
  }

  .block14_campus_buttons .block14_campus_selector_btn .block14_campus_arrow {
    font-size: 17px;
    transition: transform 0.3s ease;
    color: inherit;
    display: inline-block;
  }

  .block14_campus_buttons .block14_campus_selector_btn.menu-open .block14_campus_arrow {
    transform: rotate(180deg);
  }

  .block14_campus_buttons .block14_campus_modal {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 6px;
    box-shadow: inset 0px 4px 8px 0px rgba(217, 217, 217, 1);
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 400px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 1000;
    box-sizing: border-box;
  }

  .block14_campus_buttons .block14_campus_modal.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .block14_campus_buttons .block14_campus_option {
    padding: 12px 20px;
    cursor: pointer;
    transition: background 0.2s ease;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: var(--color-black);
    border-bottom: 1px solid #E4E4E7;
    position: relative;
    z-index: 1001;
    pointer-events: auto !important;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    display: flex;
    align-items: center;
  }

  .block14_campus_buttons .block14_campus_option:last-child {
    border-bottom: none;
  }

  .block14_campus_buttons .block14_campus_option:hover {
    background: #F5F5F5;
  }

  .block14_campus_option.selected,
  .block14_campus_option.active {
    background: #EFEFEF;
    font-weight: 700;
  }
}


.block14_campus_btn {
  padding: 5px 20px;
  width: 206.75px;
  min-height: 48px;
  height: auto;
  background: #fff;
  color: #c00;
  border: 2px solid #c00;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 700;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-family: "Roboto";
  font-size: 16px;
  text-align: center;
  line-height: 1.2;
}

.block14_campus_btn:hover {
  background: #F5F5F5;
}

.block14_campus_btn.active {
  background: #c00;
  color: #fff;
  width: 246.56px;
  min-height: 48.02px;
}

.block14_campus_btn.active:hover {
  background: #c00;
}

/* Навигация слайдера преподавателей */
.teachers_navigation {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Слайдер с преподавателями */
.teachers_slider_wrapper {
  position: relative;
  width: 100%;
  overflow: visible;
}

.teachers_arrow {
  width: 38px;
  height: 38px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  color: #5C5D5D;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}

.teachers_arrow:hover {
  background: var(--color-white);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transform: scale(1.05);
}

.teachers_arrow:active {
  transform: scale(0.95);
}

.teachers_arrow svg {
  width: 24px;
  height: 24px;
}

.teachers_slides {
  display: flex;
  gap: 30px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  padding-bottom: 10px;
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  transition: scrollbar-color 0.3s ease;
  padding: 10px 0;
}

.teachers_slides:hover,
.teachers_slides:active,
.teachers_slides.scrolling {
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

.teachers_slides::-webkit-scrollbar {
  height: 6px;
}

.teachers_slides::-webkit-scrollbar-track {
  background: transparent;
}

.teachers_slides::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 3px;
  transition: background 0.3s ease;
}

.teachers_slides:hover::-webkit-scrollbar-thumb,
.teachers_slides:active::-webkit-scrollbar-thumb,
.teachers_slides.scrolling::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}

.teachers_slides::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.3);
}

.teachers_slides:active {
  cursor: grabbing;
}

.teacher_card {
  flex-shrink: 0;
  width: 200px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.teacher_photo {
  width: 200px;
  height: 209.5px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.teacher_info {
  text-align: center;
}

.teacher_name {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 1.17;
  color: var(--color-black);
  margin-bottom: 4px;
}

.teacher_position {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.17;
  color: var(--color-black);
}

/* Отзывы учителей */
.block14_reviews_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.block14_reviews_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 1.19;
  color: var(--color-black);
  margin: 0;
}

/* Навигация отзывов */
.reviews_navigation {
  display: flex;
  align-items: center;
  gap: 12px;
}

.reviews_arrow {
  width: 38px;
  height: 38px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  color: #5C5D5D;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}

.reviews_arrow:hover {
  background: var(--color-white);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transform: scale(1.05);
}

.reviews_arrow:active {
  transform: scale(0.95);
}

.reviews_arrow svg {
  width: 24px;
  height: 24px;
}

/* Слайдер отзывов */
.reviews_slider_wrapper {
  position: relative;
  width: 100%;
  overflow: visible;
  margin: 0 -10px;
}

.block14_container {
  overflow: visible;
}

.block14 {
  overflow: visible;
}

.teachers_reviews {
  display: flex;
  gap: 13px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  padding-bottom: 10px;
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  transition: scrollbar-color 0.3s ease;
  padding: 20px 0;
}

.teachers_reviews:hover,
.teachers_reviews:active,
.teachers_reviews.scrolling {
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

.teachers_reviews::-webkit-scrollbar {
  height: 6px;
}

.teachers_reviews::-webkit-scrollbar-track {
  background: transparent;
}

.teachers_reviews::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 3px;
  transition: background 0.3s ease;
}

.teachers_reviews:hover::-webkit-scrollbar-thumb,
.teachers_reviews:active::-webkit-scrollbar-thumb,
.teachers_reviews.scrolling::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}

.teachers_reviews::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.3);
}

.teachers_reviews:active {
  cursor: grabbing;
}

.review_card {
  background: #FEFEFE;
  border: 1px solid #CCCCCC;
  border-radius: 12px;
  padding: 29px;
  display: flex;
  flex-direction: column;
  gap: 25px;
  flex-shrink: 0;
  width: 368px;
  min-height: auto;
  max-height: 305px;
  box-sizing: border-box;
  pointer-events: auto;
  cursor: pointer;
  user-select: none;
  position: relative;
  overflow: hidden;
  transition: max-height 0.3s ease;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

/* Верхняя часть: аватар + имя/должность */
.review_top {
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: flex-start;
}

.review_avatar {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.review_header {
  display: flex;
  flex-direction: column;
  gap: 0;
  flex: 1;
}

.review_name {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 10px;
  /* line-height: 1.17; */
  color: var(--color-black);
}

.review_position {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  /* line-height: 1.17; */
  color: var(--color-black);
}

.review_text {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.29;
  color: var(--color-black);
  margin: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
  line-clamp: 6;
  position: relative;
  transition: -webkit-line-clamp 0.3s ease;
}

/* Плавное скрытие текста с градиентом */
.review_card:not(.expanded) .review_text::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 40px;
  background: linear-gradient(to bottom, rgba(254, 254, 254, 0), rgba(254, 254, 254, 1));
  pointer-events: none;
}

.review_expand {
  background: transparent;
  border: none;
  color: var(--color-black);
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.71;
  cursor: pointer;
  text-align: left;
  padding: 0;
  margin-top: auto;
  transition: color 0.2s ease;
  align-self: flex-start;
}

.review_expand:hover {
  color: #D2232A;
}

.review_card.expanded .review_text {
  -webkit-line-clamp: unset;
  line-clamp: unset;
  display: block;
}

.review_card.expanded .review_text::after {
  display: none;
}

.review_card.expanded {
  max-height: none;
  overflow: visible;
}

/* Адаптивность для block14 */
@media (max-width: 1023px) {
  .block14_header {
    flex-wrap: wrap;
  }

  .block14_btn {
    width: 100%;
    min-width: 0;
  }

  .block14_reviews_header {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
  
  .review_card {
    width: 320px;
  }
}

/* На 769px-1023px делаем block14_subtitle справа от block14_campus_selector_btn, block14_btn под ними */
@media (min-width: 769px) and (max-width: 1023px) {
  .block14_bottom {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
  }
  
  .block14_bottom .block14_campus_selector_wrapper {
    flex-shrink: 0;
  }
  
  .block14_subtitle {
    flex: 1;
    margin: 0;
    min-width: 0;
  }
  
  .block14_btn {
    width: 100%;
    flex-basis: 100%;
  }
}

@media (max-width: 768px) {
  .block14_bottom {
    flex-direction: column;
    align-items: flex-start;
  }
}


/* ============================================
   BLOCK19_REVIEWS: Отзывы родителей
   ============================================ */
.block19_reviews {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 50px var(--side-padding);
  box-sizing: border-box;
  background-color: var(--color-white);
}

.block19_reviews_container {
  max-width: var(--content-width);
  margin: 0 auto;
  overflow: visible;
}

.block19_reviews_main_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 1.33;
  color: var(--color-black);
  text-align: center;
  margin: 0 0 20px 0;
}

.block19_reviews_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

.block19_reviews_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 24px;
  line-height: 1.19;
  color: var(--color-black);
  margin: 0;
}

.block19_reviews_navigation {
  display: flex;
  align-items: center;
  gap: 12px;
}

.block19_reviews_arrow {
  width: 38px;
  height: 38px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  color: #5C5D5D;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}

.block19_reviews_arrow:hover {
  background: var(--color-white);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transform: scale(1.05);
}

.block19_reviews_arrow:active {
  transform: scale(0.95);
}

.block19_reviews_arrow svg {
  width: 24px;
  height: 24px;
}

.block19_reviews_slider_wrapper {
  position: relative;
  width: 100%;
  overflow: visible;
  margin: 0;
  padding-right: 0;
}

.block19_reviews_slides {
  display: flex;
  gap: 13px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  padding-bottom: 10px;
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  transition: scrollbar-color 0.3s ease;
  padding: 10px 0;
  justify-content: flex-start;
  align-items: flex-start;
}

.block19_reviews_slides:hover,
.block19_reviews_slides:active,
.block19_reviews_slides.scrolling {
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

.block19_reviews_slides::-webkit-scrollbar {
  height: 6px;
}

.block19_reviews_slides::-webkit-scrollbar-track {
  background: transparent;
}

.block19_reviews_slides::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 3px;
  transition: background 0.3s ease;
}

.block19_reviews_slides:hover::-webkit-scrollbar-thumb,
.block19_reviews_slides:active::-webkit-scrollbar-thumb,
.block19_reviews_slides.scrolling::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}

.block19_reviews_slides::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.3);
}

.block19_reviews_slides:active {
  cursor: grabbing;
}

.block19_review_card {
  background: #F1F2F2;
  border: 1px solid #CCCCCC;
  border-radius: 12px;
  padding: 29px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  flex: 0 0 368px;
  width: 368px;
  min-width: 368px;
  max-width: 368px;
  min-height: 280px;
  height: auto;
  position: relative;
  box-sizing: border-box;
  cursor: pointer;
  pointer-events: auto;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Иконки платформ в правом нижнем углу карточек отзывов */
.block19_reviews_slider_wrapper .block19_review_icon {
  position: absolute;
  bottom: 15px;
  right: 15px;
  z-index: 10;
  pointer-events: auto; /* Разрешаем клики для ссылок */
}

.block19_reviews_slider_wrapper .block19_review_icon .review_platform_icon {
  width: 24px;
  height: 24px;
  display: block;
  object-fit: contain;
}

.block19_review_top {
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: flex-start;
}

.block19_review_avatar {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  font-family: Roboto, Arial, sans-serif;
}

.block19_review_header {
  flex: 1;
  display: flex;
  flex-direction: column;
  /* gap: 8px; */
}

.block19_review_name {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 600;
  font-size: 20px;
  /* line-height: 1.2; */
  color: var(--color-black);
  /* margin: 0 0 10px 0; */
}

.block19_review_rating {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
}

.block19_review_stars {
  display: flex;
  gap: 2px;
}

.block19_review_stars .star {
  color: #FFD700;
  font-size: 14px;
  line-height: 1;
}

.block19_review_rating_value {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #666;
}

.block19_review_date {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #999;
  margin: 0;
}

.block19_review_details {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #666;
  margin: 0;
}

.block19_review_year {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #666;
  margin: 0 0 4px 0;
}

.block19_review_campus {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #666;
  margin: 0;
  white-space: nowrap;
}

.block19_students_reviews .block19_review_text {
  font-size: 20px;
}

.block19_students_reviews .block19_review_year {
  font-size: 20px;
}

.block19_students_reviews .block19_review_campus {
  font-size: 20px;
}

/* Применяем те же шрифты, что и у родителей, на 769px+ */
@media (min-width: 769px) {
  .block19_students_reviews .block19_review_card {
    height: 279px !important;
  }
  
  .block19_students_reviews .block19_review_card.expanded {
    height: auto !important;
  }

  .block19_students_reviews .block19_review_name {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 600;
    font-size: 20px;
    color: var(--color-black);
  }

  .block19_students_reviews .block19_review_text {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    color: var(--color-black);
  }

  .block19_students_reviews .block19_review_year {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #666;
  }

  .block19_students_reviews .block19_review_campus {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #666;
  }

  .block19_students_reviews .block19_review_expand {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: var(--color-black);
  }
}

.block19_review_text {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--color-black);
  margin: 0;
  display: -webkit-box;
  line-clamp: 4;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.block19_review_expand {
  background: none;
  border: none;
  color: var(--color-black);
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  cursor: pointer;
  padding: 0;
  margin-top: auto;
  text-align: left;
  text-decoration: underline;
  transition: opacity 0.3s ease;
  pointer-events: auto;
  position: relative;
  z-index: 10;
}

.block19_review_expand:hover {
  opacity: 0.7;
}

/* Стили для кликабельной иконки источника отзыва */
a.block19_review_icon {
  display: inline-block;
  cursor: pointer;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

a.block19_review_icon:hover {
  transform: scale(1.1);
  opacity: 0.8;
}

.block19_review_card.expanded {
  height: auto;
  min-height: auto;
}

.block19_review_card.expanded .block19_review_text {
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
  display: block !important;
  overflow: visible !important;
  text-overflow: unset !important;
  -webkit-box-orient: unset !important;
}

/* Адаптивность для block19_reviews */
@media (max-width: 1023px) {
  .block19_reviews_header {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
  
  .block19_review_card {
    flex: 0 0 320px;
    width: 320px;
  }
}

/* Стрелки навигации отзывов — всегда видны */
.block19_reviews .block19_reviews_navigation,
.block19_students_reviews .block19_reviews_navigation {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}


/* Раздел отзывов учеников */
.block19_students_reviews {
  padding-top: 40px;
  /* border-top: 1px solid #E0E0E0; */
}

.block19_students_reviews .block19_review_card {
  background: #FFFFFF;
  height: 244px;
}

.block19_students_reviews .block19_review_card.expanded {
  height: auto !important;
  min-height: auto;
}

.block19_students_reviews .block19_review_card.expanded .block19_review_text {
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
  display: block !important;
  overflow: visible !important;
  text-overflow: unset !important;
  -webkit-box-orient: unset !important;
}

/* Форма для оставления отзыва */
.block19_reviews_form {
  margin-top: 60px;
  padding-top: 60px;
  border-top: 1px solid #E0E0E0;
}

.block19_reviews_form_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 1.19;
  color: var(--color-black);
  margin: 0 0 30px 0;
  text-align: center;
}

.block19_reviews_form_content {
  max-width: 800px;
  margin: 0 auto;
}

.block19_reviews_form_row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 20px;
}

.block19_reviews_form_group {
  margin-bottom: 20px;
}

.block19_reviews_form_group label {
  display: block;
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: var(--color-black);
  margin-bottom: 8px;
}

.block19_reviews_form_group input[type="text"],
.block19_reviews_form_group input[type="email"],
.block19_reviews_form_group textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid #CCCCCC;
  border-radius: 8px;
  font-family: Roboto, Arial, sans-serif;
  font-size: 16px;
  color: var(--color-black);
  box-sizing: border-box;
  transition: border-color 0.3s ease;
}

.block19_reviews_form_group input[type="text"]:focus,
.block19_reviews_form_group input[type="email"]:focus,
.block19_reviews_form_group textarea:focus {
  outline: none;
  border-color: #D2232A;
}

.block19_reviews_form_group textarea {
  resize: vertical;
  min-height: 120px;
}

.block19_reviews_form_rating {
  display: flex;
  gap: 8px;
  align-items: center;
}

.block19_reviews_form_rating input[type="radio"] {
  display: none;
}

.block19_reviews_form_rating .rating_label {
  font-size: 32px;
  color: #DDD;
  cursor: pointer;
  transition: color 0.3s ease;
  user-select: none;
}

.block19_reviews_form_rating input[type="radio"]:checked ~ .rating_label,
.block19_reviews_form_rating input[type="radio"]:checked + .rating_label {
  color: #FFD700;
}

.block19_reviews_form_rating .rating_label:hover {
  color: #FFD700;
}

.block19_reviews_form_rating input[type="radio"]:checked + .rating_label ~ .rating_label {
  color: #DDD;
}

.block19_reviews_form_submit {
  width: 100%;
  padding: 14px 20px;
  background: #D2232A;
  color: white;
  border: none;
  border-radius: 6px;
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  cursor: pointer;
  transition: background 0.3s ease;
  margin-top: 10px;
}

.block19_reviews_form_submit:hover {
  background: #b01e25;
}

.block19_reviews_form_submit:active {
  transform: scale(0.98);
}

/* Адаптивность для формы отзывов */

/* ============================================
   BLOCK19: Новости
   ============================================ */
.block19 {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 50px var(--side-padding);
  box-sizing: border-box;
  overflow: visible;
}

.block19::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  right: 50%;
  width: 100vw;
  height: 100%;
  background-color: #F1F2F2;
  margin-left: -50vw;
  margin-right: -50vw;
  z-index: -1;
}

.block19_container {
  max-width: var(--content-width);
  margin: 0 auto;
  overflow: visible;
}

.block19_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

/* Заголовок по центру на 769px+ */
@media (min-width: 769px) {
  .block19_header {
    justify-content: center;
    text-align: center;
  }
  
  .block19_navigation {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
  }
}

.block19_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 1.33;
  color: var(--color-black);
  margin: 0;
}

.block19_navigation {
  display: flex;
  align-items: center;
  gap: 12px;
}

.block19_arrow {
  width: 38px;
  height: 38px;
  background: white;
  border: 1px solid #D9D9D9;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  flex-shrink: 0;
  padding: 0;
  position: relative;
  z-index: 10;
  pointer-events: auto;
}

.block19_arrow:hover {
  background: var(--color-white);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transform: scale(1.05);
}

.block19_arrow:active {
  transform: scale(0.95);
}


.block19_arrow svg {
  width: 24px;
  height: 24px;
  pointer-events: none;
}

.block19_slider_wrapper {
  position: relative;
  width: 100%;
  overflow: visible;
  margin: 0 -10px;
}

.block19_slider_wrapper .block19_news {
  align-items: stretch;
  display: flex;
}

.block19_slider_wrapper .news_card {
  align-self: stretch;
}

.block19_news {
  display: flex;
  gap: 15px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  padding: 20px 10px;
  padding-bottom: 10px;
  align-items: stretch;
  align-content: stretch;
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  transition: scrollbar-color 0.3s ease;
}

.block19_news:hover,
.block19_news:active,
.block19_news.scrolling {
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

.block19_news::-webkit-scrollbar {
  height: 6px;
}

.block19_news::-webkit-scrollbar-track {
  background: transparent;
}

.block19_news::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 3px;
  transition: background 0.3s ease;
}

.block19_news:hover::-webkit-scrollbar-thumb,
.block19_news:active::-webkit-scrollbar-thumb,
.block19_news.scrolling::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}

.block19_news::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.3);
}

.block19_news:active {
  cursor: grabbing;
}

.block19_news.dragging {
  cursor: grabbing;
  transition: none;
}

.news_card {
  flex: 0 0 367px;
  width: 367px;
  display: flex;
  flex-direction: column;
  background: #FFFFFF;
  align-self: stretch;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  pointer-events: auto;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  transition: none;
}

.news_image {
  width: 100%;
  max-width: 367px;
  height: 367px;
  object-fit: cover;
  margin-bottom: 20px;
  flex-shrink: 0;
  image-rendering: auto;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Улучшение качества для конкретного изображения */
.news_image[src*="2-Каталог_без_названия2363"] {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  image-rendering: high-quality;
}

.news_content {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
  min-height: 80px;
  padding-inline: 22px;
  margin-bottom: 14px;
  box-sizing: border-box;
}

.news_title {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 20px;
  line-height: 1.4;
  color: var(--color-black);
  margin: 0;
  flex: 1;
}

.news_date {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 14px;
  line-height: 1.5;
  color: var(--color-black);
  margin: 0;
  flex-shrink: 0;
}

/* Адаптивность для block19 */
@media (max-width: 1023px) {
  .block19_header {
    flex-wrap: wrap;
    justify-content: center;
  }
  
  .news_card {
    width: 320px;
    flex: 0 0 320px;
  }
  
  .news_image {
    width: 100%;
    height: 320px;
  }
  
  .news_content {
    width: 100%;
  }
}


/* ============================================
   BLOCK21: Footer
   ============================================ */
.block21 {
  position: relative;
  width: 100%;
  padding: 50px var(--side-padding) 40px;
  box-sizing: border-box;
}

.block21::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  height: 100%;
  background-color: #404040;
  z-index: -1;
}

.block21_container {
  max-width: var(--content-width);
  margin: 0 auto;
}

/* Первая часть: 4 колонки */
.block21_top {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
  margin-bottom: 90px;
}

.block21_column {
  display: flex;
  flex-direction: column;
}

.block21_column_title {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  color: #828283;
  margin: 0 0 20px 0;
  text-decoration: none;
  display: block;
  cursor: pointer;
  transition: color 0.3s ease;
}

.block21_column_title:hover {
  color: #D2232A;
}

.block21_column_list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.block21_link {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  color: #FFFFFF;
  text-decoration: none;
  transition: color 0.3s ease;
}

.block21_link:hover {
  color: #D2232A;
}

/* Вторая часть: CIS логотип и 3 колонки */
.block21_middle {
  display: flex;
  justify-content: space-between;
  gap: 93px;
  margin-bottom: 40px;
}

.block21_logo {
  flex-shrink: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.block21_logo_image {
  max-width: 192px;
  max-height: 144px;
  width: 100%;
  height: auto;
  object-fit: contain;
  flex-shrink: 1;
  min-width: 0;
}

.block21_middle_columns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  flex: 1;
}

/* Третья часть: Белая линия и копирайт */
.block21_bottom {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.block21_divider {
  width: 100%;
  height: 1px;
  background-color: #FFFFFF;
}

.block21_footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.block21_copyright {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  color: #FFFFFF;
}

.block21_social {
  display: flex;
  align-items: center;
  gap: 20px;
}


.block21_social_icon {
  display: inline-block;
  width: 31px;
  height: 31px;
  flex-shrink: 0;
}

.block21_social_icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.block21_social_icon:has(img[alt="YouTube"]),
.block21_social_icon:has(img[src*="YouTube"]) {
  width: auto;
  min-width: 31px;
}

.block21_social_icon img[alt="YouTube"],
.block21_social_icon img[src*="YouTube"] {
  width: auto;
  height: 100%;
}

/* Zen icon — явно показываем */
.block21_social_icon:has(img[alt="Zen"]),
.block21_social_icon:has(img[src*="zen"]) {
  display: inline-block !important;
}

.block21_social_icon img[alt="Zen"],
.block21_social_icon img[src*="zen"] {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* Адаптивность для block21 */
@media (max-width: 1024px) {
  
  .block21_middle {
    flex-direction: column;
    gap: 40px;
  }
  
  .block21_middle_columns {
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
    order: 1;
  }
  
  .block21_logo {
    order: 2;
    align-self: center;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .block21_logo_image {
    max-width: 192px;
    max-height: 144px;
    width: 100%;
    height: auto;
    object-fit: contain;
  }
  
  .block21_footer {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
}

/* При 440px и меньше: колонки footer по одной в строку */
@media (max-width: 600px) {
  .block21_top {
    grid-template-columns: repeat(2, 1fr);
  }

  .block21_middle_columns {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* На 768px: переносим block21_logo в block21_middle_columns справа от Youngzine Media */
@media (max-width: 768px) {
  .block21_top {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .block21_middle {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    width: 100%;
  }
  
  .block21_middle_columns {
    display: contents;
  }
  
  /* Каждая колонка занимает свою ячейку в grid */
  .block21_middle_columns .block21_column:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }
  
  .block21_middle_columns .block21_column:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }
  
  .block21_middle_columns .block21_column:nth-child(3) {
    grid-column: 1;
    grid-row: 2;
  }
  
  /* Логотип размещаем как 4-й элемент (справа от Youngzine Media), выравнивание по левому краю */
  .block21_logo {
    grid-column: 2;
    grid-row: 2;
    justify-content: flex-start;
  }
}

/* На 600px: переносим block21_logo в block21_middle_columns справа от Youngzine Media */
@media (max-width: 600px) {
  .block21_middle {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    width: 100%;
  }
  
  .block21_middle_columns {
    display: contents;
  }
  
  /* Каждая колонка занимает свою ячейку в grid */
  .block21_middle_columns .block21_column:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }
  
  .block21_middle_columns .block21_column:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }
  
  .block21_middle_columns .block21_column:nth-child(3) {
    grid-column: 1;
    grid-row: 2;
  }
  
  /* Логотип размещаем как 4-й элемент (справа от Youngzine Media) */
  .block21_logo {
    grid-column: 2;
    grid-row: 2;
    align-self: flex-end;
  }
}

/* При 450px и меньше: уменьшаем логотип block21_logo */
@media (max-width: 450px) {
  .block21_logo_image {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
  }
}

/* При 450px: уменьшаем отступы у comment и submit в block20 */
@media (max-width: 450px) {
  .block20 .input_submit_wrapper .comment {
    padding: 10px 10px;
    font-size: 14px;
  }
  
  .block20 .submit {
    min-width: 100px;
    padding: 0 10px;
    font-size: 14px;
  }
  
  .block20 .alt_text.block20_consent,
  .block20_consent {
    margin-top: 16px;
    font-size: 14px;
    padding: 0;
  }
}

/* ============================================
   НАШИ ВЫПУСКНИКИ (BLOCK15)
   ============================================ */
.block15 {
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 50px var(--side-padding);
  box-sizing: border-box;
  background-color: var(--color-white);
}

.block15_container {
  max-width: var(--content-width);
  margin: 0 auto;
}

/* Верхняя часть: текст и изображение */
.block15_content {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 56px;
  margin-bottom: 25px;
}

.block15_text {
  flex: 1;
  max-width: 561px;
}

.block15_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  line-height: 1.04;
  color: var(--color-black);
  margin-bottom: 30px;
}

.block15_description {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.4;
  color: var(--color-black);
}

.block15_dash {
  color: #D2232A;
}

@media (max-width: 768px) {
  .block15_description {
    font-size: 14px !important;
  }
}

@media (min-width: 769px) {
  .block15_description {
    font-size: 16px;
  }
}

.block15_image {
  flex-shrink: 0;
  width: 523px;
  height: 265px;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
}

.block15_image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.block15_image::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(102, 102, 102, 0) 68%, rgba(0, 0, 0, 1) 100%);
  pointer-events: none;
}

/* Аккордеон для блока выпускников */
.block15_accordion {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.alumni_accordion_item {
  margin-bottom: 12px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  overflow: hidden;
}

@media (max-width: 768px) {
  .alumni_accordion_item {
    margin-bottom: 0;
  }
}

.alumni_accordion_item .accordion_header {
  padding: 16px 20px;
  font-weight: bold;
  font-size: 18px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background-color 0.3s;
  position: relative;
}

.alumni_accordion_item .accordion_header .accordion_info {
  flex: 1;
  padding-right: 50px;
  min-width: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.alumni_accordion_item .accordion_header:hover {
  background-color: #ebebeb;
}


/* Переопределение иконок для аккордеона выпускников */
.alumni_accordion_item .accordion_header::before {
  content: "";
  position: absolute;
  width: 18px;
  height: 2px;
  background-color: #D9D9D9;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.3s;
}

.alumni_accordion_item .accordion_header::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 18px;
  background-color: #D9D9D9;
  right: 29px;
  top: 50%;
  transform: translateX(50%) translateY(-50%);
  transition: all 0.3s;
}

.alumni_accordion_item .accordion_header.active::before {
  width: 18px;
  height: 2px;
  background-color: #D2232A;
  right: 20px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.alumni_accordion_item .accordion_header.active::after {
  width: 18px;
  height: 2px;
  background-color: #D2232A;
  right: 29px;
  top: 50%;
  transform: translateX(50%) translateY(-50%) rotate(-45deg);
}

/* Контент аккордеона */
.alumni_accordion_item .accordion_content {
  padding: 0 32px;
  background-color: #fff;
}

.alumni_accordion_item .accordion_content.open {
  padding: 10px 32px 20px 32px;
  max-height: 2000px;
}

/* Контент внутри раскрытого блока */

/* Обертка для контента с двумя колонками */
.alumni_content_wrapper {
  display: grid;
  grid-template-columns: 1fr minmax(0, 466px);
  gap: 64px;
  align-items: start;
}

@media (max-width: 1280px) {
  .alumni_content_wrapper {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  
  .alumni_diagram {
    width: 100%;
    max-width: 466px;
    height: auto;
    margin-bottom: 30px;
  }
  
  .alumni_diagram img {
    width: 100%;
    height: auto;
    object-fit: contain;
  }
  
  /* Увеличиваем max-height для accordion_content.open, чтобы все элементы поместились */
  .alumni_accordion_item .accordion_content.open {
    max-height: 5000px !important;
  }
}

/* Левая колонка: текст + списки */
.alumni_left_column {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
}

.alumni_left_column > .alumni_intro + .alumni_universities_left {
  margin-top: 0;
  padding-top: 0;
}

.alumni_universities_left > .alumni_universities_column:first-child .country_title:first-child {
  margin-top: 0;
  padding-top: 0;
}

.alumni_intro {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.4;
  color: var(--color-black);
  max-width: 500px;
  margin: 0 !important;
  margin-bottom: 0 !important;
  padding: 0;
}

/* Правая колонка: диаграмма + списки */
.alumni_right_column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}

/* Диаграмма справа */
.alumni_diagram {
  width: 466px;
  height: 485px;
  margin-bottom: 85px;
}

.alumni_diagram img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* Левая колонка списков университетов */
.alumni_universities_left {
  width: 100%;
  margin: 0;
  padding: 0;
}

/* Правая колонка списков университетов (под диаграммой) */
.alumni_universities_right {
  width: 466px;
  margin: 0;
  padding: 0;
}

.alumni_universities_column {
  display: flex;
  flex-direction: column;
  /* gap: 20px; */
}

.country_title {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.4;
  color: var(--color-black);
  margin: 0 0 10px 0;
  padding: 0;
}

.country_title:first-child {
  margin-top: 0;
}

.university_list {
  list-style: disc;
  padding-left: 20px;
  margin: 0 0 20px 0;
}

.university_list li {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.4;
  color: var(--color-black);
  margin-bottom: 8px;
}

.university_list li::marker {
  color: var(--color-black);
}

/* Стили для аккордеона "Ассоциация выпускников" */
.alumni_association_content {
  position: relative;
  width: 100%;
}

.alumni_association_lead {
  font-family: Lora, serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.5em;
  color: var(--color-black);
  margin: 0 0 0 0;
  padding: 0;
}

.alumni_association_main {
  margin-top: 0;
  padding-top: 0;
}

.alumni_association_main .alumni_association_text:first-child {
  margin-top: 0;
}

.alumni_association_text {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.4em;
  color: var(--color-black);
  margin: 0 0 16px 0;
  padding: 0;
}

.alumni_association_text:last-child {
  margin-bottom: 0;
}

/* Адаптивность для block15 */
@media (max-width: 1023px) {
  .block15_content {
    flex-direction: column;
  }

  .block15_text {
    display: contents;
  }

  .block15_title {
    order: 1;
  }

  .block15_description {
    order: 3;
  }

  .block15_image {
    width: 100%;
    max-width: 523px;
    order: 2;
  }

  .alumni_content_wrapper {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  
  .alumni_intro {
    max-width: 100%;
  }

  .alumni_diagram {
    width: 100%;
    max-width: 466px;
    height: auto;
  }

  .alumni_diagram img {
    width: 100%;
    height: auto;
  }

  .alumni_right_column {
    width: 100%;
  }
  
  .alumni_universities_right {
    width: 100%;
    max-width: 466px;
  }

}

.alumni_university_dash {
  color: #D2232A;
}

/* Красные дефисы в параграфах внутри блоков с университетами на мобильных */
@media (max-width: 768px) {
  .alumni_universities_mobile .alumni_university_dash,
  .alumni_universities_left .alumni_university_dash,
  .alumni_universities_right .alumni_university_dash,
  .alumni_universities_mobile p .alumni_university_dash,
  .alumni_universities_left p .alumni_university_dash,
  .alumni_universities_right p .alumni_university_dash,
  .alumni_left_column p .alumni_university_dash,
  .alumni_right_column p .alumni_university_dash,
  .alumni_intro .alumni_university_dash {
    color: #D2232A;
  }
  
  .alumni_universities_mobile .university_list,
  .alumni_universities_left .university_list,
  .alumni_universities_right .university_list {
    list-style: none;
    padding-left: 0;
  }
}


/* ============================================
   BLOCK20: Кампусы
   ============================================ */
.block20_campuses {
  background: #FFFFFF;
  max-width: var(--page-width);
  width: 100%;
  margin: 0 auto;
  padding: 70px var(--side-padding);
  padding-top: 0;
  box-sizing: border-box;
}

.block20_campuses .block20_container {
  max-width: var(--content-width);
  margin: 0 auto;
  box-sizing: border-box;
  padding-top: 20px;
}

.block20_campuses .block20_map_section {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  position: relative;
}

/* Верхняя часть: Карта и кнопки */

.block20_campuses .block20_map_wrapper {
  width: 100%;
  height: 500px;
  margin-bottom: 0;
  border-radius: 12px;
  overflow: visible;
  position: relative;
}

.block20_campuses .block20_map {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
}

.block20_campuses .block20_map img {
  display: none;
}

.block20_campuses .block20_campus_buttons {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  box-sizing: border-box;
  position: relative;
  margin-top: -40px;
  margin-bottom: 0;
  z-index: 10;
  background: transparent;
  width: 100%;
  max-width: 100%;
}

.block20_campuses .block20_campus_btn {
  width: 219px;
  height: 76px;
  padding: 12px 24px;
  border: 1px solid #D2232A;
  background: #FFFFFF;
  color: var(--color-black);
  font-family: Roboto, Arial, sans-serif;
  font-weight: 600;
  font-size: 16px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  line-height: 1.2;
  box-sizing: border-box;
}

.block20_campuses .block20_campus_btn:hover {
  background: #F5F5F5;
}

.block20_campuses .block20_campus_btn.active {
  background: #D2232A;
  color: #FFFFFF;
}

.block20_campuses .block20_campus_btn_label,
.block20_campuses .block20_campus_btn_city {
  display: block;
}

.block20_campus_selector_wrapper {
  display: none;
}

/* Стили для заголовка "Контакты" */
.block20_contacts_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  color: var(--color-black);
  margin-bottom: 0;
}

/* Выпадающий список в левом блоке на десктопе */
.block20_info_left .block20_campus_selector_wrapper {
  display: block;
  position: relative;
  width: 100%;
  margin-top: 13px;
}

.block20_info_left .block20_campus_selector_btn {
  padding: 12px 20px;
  width: 353px;
  min-height: 48px;
  background: #D2232A;
  color: #fff;
  border: 2px solid #D2232A;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 700;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 20px;
  gap: 10px;
}

.block20_info_left .block20_campus_selector_btn .block20_campus_arrow {
  font-size: 17px;
  transition: transform 0.3s ease;
  color: inherit;
  display: inline-block;
}

.block20_info_left .block20_campus_selector_btn.menu-open .block20_campus_arrow {
  transform: rotate(180deg);
}

.block20_info_left .block20_campus_modal {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  right: 0;
  background: #FFFFFF;
  border: 2px solid #D2232A;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  z-index: 1000;
  display: none;
  overflow: hidden;
}

.block20_info_left .block20_campus_modal.open {
  display: block;
}

.block20_info_left .block20_campus_option {
  padding: 12px 20px;
  cursor: pointer;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: var(--color-black);
  transition: background 0.2s ease;
  border-bottom: 1px solid #E4E4E7;
}

.block20_info_left .block20_campus_option:last-child {
  border-bottom: none;
}

.block20_info_left .block20_campus_option:hover {
  background: #F5F5F5;
}

/* Адаптивность для block20_campus_btn при 1366px и меньше */
@media (max-width: 1427px) {
  .block20_campuses .block20_campus_btn, .block14_campus_btn {
    width: 200px;
  }
  
  .block14_campus_btn.active, .block14_campus_btn, .block12_campus_btn, .block12_campus_btn.active{
    width: 200px;
    padding: 5px 5px;
  }
  
}

/* Адаптивность для block20_campus_buttons: кнопки на одной строке до 1024px */
@media (min-width: 1024px) and (max-width: 1427px) {
  .block20_campuses .block20_campus_buttons {
    flex-wrap: nowrap;
  }
  
  .block20_campuses .block20_campus_btn {
    width: 180px;
    padding: 12px 16px;
  }
}

@media (min-width: 1200px) and (max-width: 1427px) {
  .block20_campuses .block20_campus_btn {
    width: 190px;
    padding: 12px 20px;
  }
}

/* Нижняя часть: Детальная информация */
.block20_campuses .block20_info_section {
  margin-top: 60px;
}

.block20_campuses .block20_info_container {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* Левая колонка: Контакты */
.block20_campuses .block20_info_left {
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: flex-start;
}

.block20_campuses .block20_campus_title {
  font-family: Lora, serif;
  font-weight: 500;
  font-size: 32px;
  color: var(--color-black);
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  line-height: 1.2;
}

.block20_campuses .block20_campus_title_label,
.block20_campuses .block20_campus_title_name {
  display: block;
}

.block20_campuses .block20_contact_group {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  margin-top: 38px;
}

.block20_campuses .block20_contact_divider {
  width: 100px;
  height: 1px;
  background-color: #D2232A;
  margin: 0;
  flex-shrink: 0;
  margin-top: 48px;
  margin-bottom: 10px;
}

.block20_campuses .block20_contact_title {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 500;
  font-size: 24px;
  color: var(--color-black);
  margin: 0;
  margin-bottom: 30px;
}

.block20_campuses .block20_contact_item {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.block20_campuses .block20_contact_label {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: var(--color-black);
  margin: 0;
}

.block20_campuses .block20_contact_value {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  color: #666666;
  text-decoration: none;
  transition: color 0.3s ease;
}

.block20_campuses .block20_contact_value:hover {
  color: #D2232A;
}

.block20_campuses .block20_contact_phones {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Правая колонка: Карта, адрес, координаты, график работы */
.block20_campuses .block20_info_right {
  display: flex;
  flex-direction: column;
  gap: 30px;
  position: relative;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.block20_campuses .block20_details_wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: flex-start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.block20_campuses .block20_building_icon {
  position: absolute;
  top: 0;
  right: 0;
  width: 60px;
  height: 60px;
  opacity: 0.1;
  z-index: 1;
  color: var(--color-black);
  pointer-events: none;
}

.block20_campuses .block20_building_icon svg {
  width: 100%;
  height: 100%;
}

.block20_campuses .block20_local_map {
  width: 100%;
  max-width: 100%;
  height: 347px;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
  /* Разрешаем touch события для мобильных устройств */
  touch-action: pan-x pan-y pinch-zoom;
}

.block20_campuses .block20_local_map_container {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
  /* Разрешаем touch события для мобильных устройств */
  touch-action: pan-x pan-y pinch-zoom;
}

.block20_campuses .block20_details_left {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.block20_campuses .block20_details_right {
  display: flex;
  flex-direction: column;
}

.block20_campuses .block20_address_group,
.block20_campuses .block20_coordinates_group,
.block20_campuses .block20_hours_group {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.block20_campuses .block20_address_title,
.block20_campuses .block20_coordinates_title,
.block20_campuses .block20_hours_title {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: var(--color-black);
  margin: 0;
}

.block20_campuses .block20_address_value,
.block20_campuses .block20_coordinates_value {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  color: var(--color-black);
  margin: 0;
}

.block20_campuses .block20_hours_list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.block20_campuses .block20_hours_item {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.block20_campuses .block20_hours_day {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  color: var(--color-black);
}

.block20_campuses .block20_hours_day_closed {
  color: #D2232A;
}

.block20_campuses .block20_hours_time {
  font-family: Roboto, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  color: var(--color-black);
}

.block20_campuses .block20_hours_time_closed {
  color: #D2232A;
}

@media (max-width: 1023px) {
  .block20_campuses .block20_info_container {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .block20_campuses .block20_map_wrapper {
    height: 320px;
  }
  
  /* Скрываем заголовок "Контакты" в мобильной версии */
  .block20_campuses .block20_contacts_title {
    display: none;
  }

  .block20_campuses .block20_campus_buttons {
    gap: 15px;
    position: relative;
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    margin-top: 0px;
  }

  .block20_campuses .block20_campus_btn {
    display: none;
  }

  .block20_campus_selector_wrapper {
    display: block;
    position: relative;
  }

  .block20_campus_selector_btn {
    padding: 5px 20px;
    width: 100%;
    min-height: 48px;
    background: #D2232A;
    color: #fff;
    border: 2px solid #D2232A;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    font-family: "Roboto";
    font-size: 20px;
    gap: 10px;
  }

  .block20_campus_selector_btn .block20_campus_arrow {
    font-size: 17px;
    transition: transform 0.3s ease;
    color: inherit;
    display: inline-block;
  }

  .block20_campus_selector_btn.menu-open .block20_campus_arrow {
    transform: rotate(180deg);
  }

  .block20_campus_modal {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 6px;
    box-shadow: inset 0px 4px 8px 0px rgba(217, 217, 217, 1);
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 400px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 1000;
    box-sizing: border-box;
  }

  .block20_campus_modal.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .block20_campus_option {
    padding: 0 20px;
    cursor: pointer;
    transition: background 0.2s;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.171875em;
    color: #231F20;
    border-bottom: 1px solid #EFEFEF;
    position: relative;
    z-index: 1001;
    pointer-events: auto !important;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    flex-shrink: 0;
    min-height: 36px;
    height: 36px;
    display: flex;
    align-items: center;
  }

  .block20_campus_option:last-child {
    border-bottom: none;
  }

  .block20_campus_option:hover {
    background: #f9f9f9;
  }

  .block20_campus_option.selected,
  .block20_campus_option.active {
    background: #EFEFEF;
    font-weight: 700;
  }
}

/* Адаптивность для 1024px: уменьшение заголовков и изображений */
@media (max-width: 1023px) {
  /* Стили для block1 */
  .block1 {
    padding: 10px var(--side-padding);
  }

  .hero-slider-wrapper {
    margin-bottom: 0;
  }

  .hero-content {
    gap: 0;
  }
  
  .school_logo2 {
    margin-bottom: 0;
  }
  
  .promo_text, .block12_campus_tabs, .block12_text,
  .block12_title, .block14_reviews_header, .block19_reviews_header {
    margin-bottom: 20px;
  }

  .hero-navigation {
    margin-top: 25px;
  }

  .block2, .block5 {
    padding-top: 50px;
  }

  .info_main_2, .block21_top {
    margin-bottom: 50px;
  }

  .block4 {
    padding: 50px var(--side-padding);
  }

  .school_inform {
    padding: 50px 0 100px 0;
  }

  .block10 {
    padding: 50px var(--side-padding);
  }

  .block12, .block14, .block15, .block17, .block19_reviews, .block19, .block20_campuses {
    padding: 50px 24px;
  }

  .block12_prices {
    margin-top: 20px;
  }

  .block14_campus_buttons {
    justify-content: flex-start; /* Слева при 1023px */
  }

  .block14_bottom {
    order: 4;
  }

  .block14_reviews_header {
    order: 5;
  }

  .reviews_slider_wrapper {
    order: 6;
  }

  .block14_campus_btn {
    display: none;
  }

  .block14_campus_selector_wrapper {
    display: block;
    position: relative;
  }

  .block14_campus_selector_btn {
    padding: 5px 20px;
    width: 100%;
    min-height: 48px;
    background: #D2232A;
    color: #fff;
    border: 2px solid #D2232A;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    font-family: "Roboto";
    font-size: 16px;
    gap: 10px;
  }
  
  /* При 768px и меньше - на всю ширину */
  @media (max-width: 768px) {
    .block14_campus_selector_btn {
      width: 100% !important;
      max-width: 100% !important;
    }
  }

  .block14_campus_selector_btn .block14_campus_arrow {
    font-size: 17px;
    transition: transform 0.3s ease;
    color: inherit;
    display: inline-block;
  }

  .block14_campus_selector_btn.menu-open .block14_campus_arrow {
    transform: rotate(180deg);
  }

  .block14_campus_modal {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 6px;
    box-shadow: inset 0px 4px 8px 0px rgba(217, 217, 217, 1);
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 400px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 1000;
    box-sizing: border-box;
  }

  .block14_campus_modal.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .block14_campus_option {
    padding: 0 20px;
    cursor: pointer;
    transition: background 0.2s;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.171875em;
    color: #231F20;
    border-bottom: 1px solid #EFEFEF;
    position: relative;
    z-index: 1001;
    pointer-events: auto !important;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    flex-shrink: 0;
    min-height: 36px;
    height: 36px;
    display: flex;
    align-items: center;
  }

  .block14_campus_option:last-child {
    border-bottom: none;
  }

  .block14_campus_option:hover {
    background: #f9f9f9;
  }

  .block14_campus_option.selected,
  .block14_campus_option.active {
    background: #EFEFEF;
    font-weight: 700;
  }

  .block20_campuses .block20_info_section {
    margin-top: 30px;
  }

  .block14_bottom {
    margin-top: 30px;
    margin-bottom: 60px;
  }
  
  /* При 768px и меньше - переопределяем отступы и размеры шрифтов */
  @media (max-width: 768px) {
    .block14_bottom {
      margin-top: 0 !important;
      margin-bottom: 32px !important;
      gap: 14px !important;
      justify-content: flex-start !important;
    }
    
    #block14SelectedCampus {
      font-size: 14px !important;
    }

    .block14_campus_option {
      font-size: 14px !important;
    }

    .block12_campus_option {
      font-size: 14px !important;
    }

    .block20_campus_option {
      font-size: 14px !important;
    }
    
    .block14_btn {
      font-size: 14px !important;
      width: auto !important;
      min-width: auto !important;
      padding: 10px 16px !important;
    }
    
    .block14_campus_selector_btn {
      font-size: 14px !important;
    }
    
    .block14_campus_selector_btn #block14SelectedCampus {
      font-size: 14px !important;
    }
  }

  .teachers_reviews, .block19_reviews_slides {
    padding: 0;
  }

  .block15_content {
    gap: 25px;
    margin-bottom: 25px;
  }

  .alumni_accordion_item .accordion_content.open {
    padding: 10px 20px;
  }

  .alumni_diagram {
    margin-bottom: 30px;
  }


  .block19_students_reviews {
    margin-top: 30px;
    padding-top: 0;
  }

  .block20_campuses .block20_contact_group{
    gap: 0px;
    margin-top: 10px;
  }

  .block20_contact_title{
    margin-bottom: 10px !important
  }

  .block20_contact_divider{
    margin-top: 13px !important;
    margin-bottom: 0px !important;
  }

  .block20_contact_item{
    margin-bottom: 10px;
  }

  .block21 {
    padding: 40px 24px;
  }

  /* Уменьшение заголовков с 48px до 38px */
  .promo_text,
  .info_title,
  .campuses,
  .campus_photo,
  .advage,
  .form_br,
  .info_cis_title,
  .block12_title,
  .block14_title,
  .block19_reviews_main_title,
  .block19_title,
  .block15_title,
  .block17_title,
  .accordion_text {
    font-size: 32px;
  }

  /* Корректировка line-height для заголовков */
  .promo_text,
  .info_title,
  .campuses,
  .campus_photo {
    line-height: 40px;
  }

  /* Уменьшение изображений на 25% */
  .school_logo2 img {
    transform-origin: center;
  }

  .campuses_grid .campus_card {
    transform-origin: center;
    margin: 0 auto;
  }

  .slider_container {
    /* При 1024px первый слайд должен быть по центру, слева пусто */
    display: block;
  }

  .slide {
    width: 411px;
    height: 300px;
  }

  .map_button {
    transform-origin: center;
    margin: 0 auto;
  }

  .alumni_diagram {
    width: 349.5px;
    height: 363.75px;
  }
}

/* Объединенный медиа-запрос для 767px */
@media (max-width: 768px) {
  .slider_container .slide {
    width: 313px;
    height: 248px;
  }
  
  .block14_campus_modal {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    transform: none;
    width: 100%;
  }
  
  .block14_campus_modal.open {
    width: 100%;
  }
  
  .slider_container .slide img {
    width: 313px;
    height: 248px;
  }
  
  /* margin-top для block1 устанавливается динамически через JavaScript */
  
  /* Стили для top_bar при 768px */
  .top_bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
    width: 100%;
    gap: 1px;
    max-width: 100%;
    margin: 0;
  }
  
  /* Красная полоска 9px всегда видна под top_bar на 768px */
  .top_bar::after {
    content: '';
    position: fixed;
    top: var(--top-bar-height, 74px);
    left: 0;
    right: 0;
    height: 9px;
    background: var(--color-red);
    z-index: 998; /* Ниже nav-bar (1000), чтобы nav-bar был поверх красной полоски */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
  
  /* Стили для nav-bar при скрытии (остается 6px сверху) */
  .nav-bar {
    transition: top 0.4s ease-in-out !important;
    z-index: 1000 !important; /* nav-bar должен быть ниже top_bar, но выше красной полоски (999) */
    overflow: visible !important;
  }

  .top_bar .logo {
    font-size: 10px;
    gap: 2px;
  }
  
  .top_bar .logo > img {
    width: 37px !important;
    height: 42px !important;
    object-fit: contain;
  }
  
  .top_bar .region_btn img.arrow {
    width: auto !important;
    height: auto !important;
    max-width: 8px !important;
    max-height: 8px !important;
  }
  
  .top_bar .logo_text,
  .top_bar .logo_text > span {
    font-size: 10px;
  }
  
  .top_bar .logo_text_top {
    font-size: 11px;
  }
  
  .top_bar .logo_school_row,
  .top_bar .logo_text > .logo_school_row {
    font-size: 11px !important;
  }

  .logo_text {
    gap: 0;
  }
  
  .top_bar .region_btn {
    padding: 0 2px!important;
    font-size: 10px;
  }
  
  .top_bar .region_btn .arrow {
    font-size: 8px !important;
    padding-top: 0 !important;
    padding-right: 0 !important;
  }

  .top_bar .icons {
    gap: 4px;
  }
  
  .top_bar .icons a {
    width: 29px !important;
    height: 29px !important;
  }
  
  .top_bar .icons a.call img {
    width: 16px !important;
    height: 16px !important;
  }
  
  .top_bar .icons a.whatsapp img {
    width: 18px !important;
    height: 18px !important;
  }
  
  .top_bar .icons a.telegram img {
    width: auto !important;
    height: 15px !important;
  }
  
  .top_bar .icons a.apply {
    width: 63px !important;
    height: 29px !important;
  }
  
  /* Для английского языка при 768px - размер шрифта apply */
  html[lang="en"] .icons a.apply {
    font-size: 14px !important;
  }
  
  /* Размер шрифта для apply в английской версии на 768px */
  html[lang="en"] .top_bar .icons a.apply {
    font-size: 14px !important;
  }
  
  /* Стили для кнопки меню в icons при 768px */
  .icons-menu-btn {
    width: 30px !important;
    height: 30px !important;
    padding: 0 !important;
    /* По умолчанию скрыта при загрузке страницы (показывается только при скролле вниз) */
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateX(0) !important;
    pointer-events: none !important;
  }
  
  /* Показываем кнопку меню при скролле вниз (когда nav-bar скрыт) */
  .icons-menu-btn.visible {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  
  /* На 330px и меньше кнопка меню не показывается даже при прокрутке вниз */
  @media (max-width: 330px) {
    .icons-menu-btn.visible,
    .top_bar .icons-menu-btn.visible {
      opacity: 0 !important;
      visibility: hidden !important;
      pointer-events: none !important;
      display: none !important;
    }
  }
  
  /* Скрываем кнопку меню, когда меню открыто на мобильных или вверху страницы */
  .icons-menu-btn.hidden {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  
  .icons-menu-btn .menu-icon {
    width: 16.3px !important;
  }
  
  .icons-menu-btn .menu-icon span {
    width: 16.3px !important;
    border: 1.5px solid #828283 !important;
    height: 0 !important;
  }
  
  /* Отступ для контейнера icons, когда кнопка меню видна на мобильных */
  /* Применяется только на 420px и меньше (но не на 330px и меньше), чтобы не было переноса на 421px+ */
  @media (max-width: 420px) and (min-width: 331px) {
    .icons.has-menu-btn {
      padding-right: 34px !important;
    }
  }
  
  /* Стили для nav-bar при 768px (базовые стили уже определены выше) - поверх красной полоски */
  .nav-bar {
    width: 100%;
    margin: 0;
    position: fixed;
    top: var(--top-bar-height, 74px); /* Используем высоту top_bar из JS или значение по умолчанию */
    left: 0;
    right: 0;
    z-index: 1000; /* Выше красной полоски (999), но ниже top_bar (z-index: 1001) */
    transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out, transform 0.3s ease-in-out; /* Плавное появление и исчезновение */
    overflow: hidden; /* Скрываем содержимое при скрытии */
    max-height: 200px; /* Максимальная высота для плавного перехода */
    background: var(--color-red) !important; /* Убеждаемся, что фон красный */
  }
  
  /* Убеждаемся что nav-bar полностью раскрывается при скролле вверх */
  .nav-bar:not(.nav-bar-scrolled) {
    top: var(--top-bar-height, 74px) !important; /* Начинается с top_bar, перекрывая красную полоску */
    height: auto !important; /* Автоматическая высота для полного раскрытия */
    min-height: 55px !important; /* Минимальная высота */
    max-height: 200px !important; /* Максимальная высота для плавного перехода */
    overflow: visible !important; /* Показываем все содержимое */
    opacity: 1 !important; /* Полностью видимый */
    transform: translateY(0) !important; /* Без сдвига */
  }
  
  /* Плавное появление содержимого nav-bar при скролле вверх */
  .nav-bar:not(.nav-bar-scrolled) ul {
    opacity: 1 !important; /* Плавно показываем содержимое */
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    pointer-events: auto; /* Включаем взаимодействие */
    transform: translateY(0); /* Без сдвига */
  }
  
  /* Плавное скрытие nav-bar при скролле вниз - полностью скрывается, красная полоска остается */
  .nav-bar.nav-bar-scrolled {
    top: calc(var(--top-bar-height, 74px) + 9px) !important; /* Остается на месте красной полоски */
    height: auto !important; /* Оставляем auto для плавной анимации */
    min-height: 0 !important; /* Убираем min-height для плавного скрытия */
    max-height: 0 !important; /* Плавно уменьшаем максимальную высоту до 0 */
    opacity: 0 !important; /* Плавно скрываем nav-bar */
    transform: translateY(-10px) !important; /* Небольшой сдвиг вверх для плавности */
    overflow: hidden !important; /* Скрываем содержимое */
  }
  
  /* Плавное скрытие содержимого nav-bar при скролле вниз - синхронно с nav-bar */
  .nav-bar.nav-bar-scrolled ul {
    opacity: 0 !important; /* Плавно скрываем содержимое одновременно с nav-bar */
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    pointer-events: none; /* Отключаем взаимодействие со скрытым содержимым */
    transform: translateY(-20px); /* Больший сдвиг вверх для плавности */
  }
  
  .nav-bar-right > * {
    height: 32px !important;
  }
  
  /* Обновляем padding-top для block1 на 768px с учетом красной полоски */
  .block1 {
    margin-top: 123px;
    /* padding-top: 138px !important; Отступ сверху: top_bar (74px) + красная полоска (9px) + nav-bar (55px) = 138px */
  }
  
  /* Убеждаемся что nav-bar полностью раскрывается - все 55px высоты под top_bar */
  .nav-bar:not(.nav-bar-scrolled) {
    top: 74px !important; /* Полностью под top_bar */
  }
  
  .nav-bar .nav-search {
    height: 32px;
    padding: 8px;
  }
  
  .nav-bar .nav-search input {
    font-size: 14px;
  }
  
  .nav-bar .nav-icons a.eye {
    width: 32px !important;
    height: 32px !important;
  }

  .nav-bar .nav-icons a.eye img {
    width: 20px !important;
    height: 14px !important;
  }
  
  .nav-bar .nav-icons a.lang {
    width: 40px !important;
    height: 32px !important;
  }

  .block1::before {
    height: 70%;
  }

  .hero-navigation {
    margin: 0px;
    margin-bottom: 20px;
  }
  
  /* Все заголовки h1 при 768px */
  h1 {
    font-size: 32px !important;
  }

  .info_text, .info_text2 {
    font-size: 14px;
    margin-bottom: 10px;
  }

  .info_main_2 {
    margin-bottom: 30px;
  }
  
  .info_school_2_text {
    font-size: 14px;
  }

  .form_bg, .block18 .form_bg {
    height: auto;
    min-height: 1px;
  }
  
  .block3 .form_hover {
    padding: 20px 15px;
    align-items: flex-start !important;
  }
  
  .block3 .form_txt {
    font-size: 24px !important;
    margin-bottom: 24px;
    text-align: left !important;
  }
  
  .block3 .alt_text {
    text-align: left !important;
  }
  
  .block3 .input_group {
    grid-template-columns: 1fr;
    gap: 20px;
    max-width: 100%;
  }
  
  .block3 .input_column_left,
  .block3 .input_column_right {
    width: 100%;
  }
  
  .block3 .phone_wrapper {
    max-width: 100%;
  }
  
  .block3 .phone_number {
    width: 100%;
    flex: 1 1 100%;
  }
  
  .block3 .input_submit_wrapper {
    max-width: 100%;
  }
  
  .block3 .number,
  .block3 .capcha {
    text-align: left !important;
    width: 100%;
  }
  
  .block3 .form_hover .capcha::before,
  .block3 .form_hover .capcha::after {
    text-align: left !important;
  }

  .block4 .subtitle {
    font-size: 14px !important;
  }

  .school_inform {
    padding: 0 0 120px 0;
    align-items: start;
    min-height: 1px;
  }

  .info_p {
    font-size: 16px;
  }

  .accordion_header {
    padding: 5px 18px;
  }

  .block11 .form_hover {
    padding-top: 32px;
    padding-bottom: 32px;
    align-items: flex-start !important;
  }
  
  .block11 .form_txt {
    text-align: left !important;
    font-size: 24px !important;
  }
  
  .block11 .alt_text {
    text-align: left !important;
  }

  .block12_campus_tabs {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
    width: 100% !important;
  }

  .block12_campus_selector_wrapper,
  .block12_year_selector_wrapper {
    width: 100%;
  }

  .block12_campus_selector_btn {
    width: 100% !important;
    font-size: 14px !important;
    justify-content: space-between;
    padding: 5px 10px;
  }

  /* Селектор года при 768px */
  .block12_year_selector_wrapper {
    display: block !important;
  }

  .block12_year_selector_btn {
    padding: 5px 20px;
    width: 100% !important;
    min-height: 48px;
    background: #fff;
    color: #c00;
    border: 2px solid #c00;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    font-family: "Roboto";
    font-size: 14px;
    font-weight: 400;
    gap: 10px;
  }

  .block12_year_selector_btn .block12_year_arrow {
    font-size: 17px;
    transition: transform 0.3s ease;
    color: inherit;
    display: inline-block;
  }

  .block12_year_selector_btn.menu-open .block12_year_arrow {
    transform: rotate(180deg);
  }

  .block12_year_modal {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    transform: none;
    width: 100%;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: all 0.25s ease;
    z-index: 1000;
  }

  .block12_year_modal.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .block12_year_option {
    padding: 16px 20px;
    cursor: pointer;
    transition: background 0.2s;
    font-size: 16px;
    font-weight: 500;
    color: #000000;
    border-bottom: 1px solid #f0f0f0;
  }

  .block12_year_option:last-child {
    border-bottom: none;
  }

  .block12_year_option:hover {
    background: #f5f5f5;
  }

  .block12_category_btn {
    font-size: 14px !important;
    justify-content: start;
  }

  .block4, .block5, .block6, .block8, .block10, .block12, .block14, .block15, .block17,
  .block19_reviews, .block19, .block20_campuses, .block21{
    padding: 32px 24px;
  }

  .accordion_text, .footer_note, .block12_title, .block12_info {
    display: flex;
    justify-content: start;
    text-align: left;
  }

  .block12_info {
    flex-direction: column;
  }

  .advage, .campus_photo, .accordion_text, .block12_title, .info_cis_title, .block14_title, .block15_title, .campuses, .block17_title {
    margin-bottom: 24px;
    font-size: 24px !important;
  }


  .container_accordion {
    padding: 0;
  }

  .accordion_info {
    font-size: 24px;
  }

  .info_title {
    font-size: 24px;
    margin-bottom: 0 !important; 
  }

  .block2 .info_text {
    margin-bottom: 0 !important;
  }

  .info_content {
    gap: 10px !important;
  }

  .alt_text {
    margin-top: 20px;
  }
  
  /* Общие стили для всех форм при 768px */
  .form_hover .input_column_left {
    align-items: center;
  }
  
  .form_hover .input_column_right {
    align-items: center;
    width: 100%;
    max-width: 100%;
    flex: 1;
  }
  
  /* .form_hover .number,
  .form_hover .capcha {
    text-align: center;
    width: 100%;
  } */
  
  .form_hover .capcha {
    color: transparent;
    font-size: 0;
    line-height: 0;
  }
  
  .form_hover .capcha::before {
    content: "Антибот:";
    font-size: 16px;
    line-height: 28px;
    font-weight: 400;
    color: var(--color-black);
    display: block;
  }
  
  .form_hover .capcha::after {
    content: attr(data-question);
    font-size: 16px;
    line-height: 28px;
    font-weight: 400;
    color: var(--color-black);
    display: block;
  }

  .submit {
    /* min-width: 74px; */
    width: 74px;
  }

  .block14_campus_buttons {
    margin-bottom: 5px;
  }
  
  /* Для блоков с белым текстом */
  .block18 .form_hover .capcha::before,
  .block18 .form_hover .capcha::after,
  .block20 .form_hover .capcha::before,
  .block20 .form_hover .capcha::after {
    color: #FFFFFF;
  }

  /* comment во всю ширину при 768px */
  .form_hover .input_submit_wrapper {
    max-width: 100%;
    width: 100%;
  }

  .form_hover .input_submit_wrapper .comment {
    width: 100%;
  }

  .phone_flag_selector {
    gap: 2px;
    width: fit-content !important;
  }
  
  /* Убираем margin-left: auto у стрелочки при 768px */
  .phone_flag_selector .flag-arrow {
    margin-left: 0 !important;
  }
  
  /* Делаем ширину phone_flag_selector_wrapper адаптивной, чтобы она подстраивалась под содержимое */
  .phone_flag_selector_wrapper {
    width: auto !important;
    min-width: 1px !important;
    max-width: none;
  }
  
  /* Аналогично для block7 */
  .block7 .phone_flag_selector_wrapper {
    width: auto !important;
    min-width: 1px !important;
    max-width: none;
  }
  
  /* Аналогично для всех form_hover_step2 */
  .form_hover_step2 .phone_flag_selector_wrapper,
  .block3 .form_hover_step2 .phone_flag_selector_wrapper,
  .block11 .form_hover_step2 .phone_flag_selector_wrapper,
  .block16 .form_hover_step2 .phone_flag_selector_wrapper,
  .block18 .form_hover_step2 .phone_flag_selector_wrapper,
  .block20 .form_hover_step2 .phone_flag_selector_wrapper {
    width: auto !important;
    min-width: 1px !important;
    max-width: none;
  }
  
  /* Убираем margin-left: auto у стрелочки для block7 и form_hover_step2 */
  .block7 .phone_flag_selector .flag-arrow,
  .form_hover_step2 .phone_flag_selector .flag-arrow,
  .block3 .form_hover_step2 .phone_flag_selector .flag-arrow,
  .block11 .form_hover_step2 .phone_flag_selector .flag-arrow,
  .block16 .form_hover_step2 .phone_flag_selector .flag-arrow,
  .block18 .form_hover_step2 .phone_flag_selector .flag-arrow,
  .block20 .form_hover_step2 .phone_flag_selector .flag-arrow {
    margin-left: 0 !important;
  }
  
  /* Делаем ширину phone_flag_selector адаптивной для block7 и form_hover_step2 */
  .block7 .phone_flag_selector,
  .form_hover_step2 .phone_flag_selector,
  .block3 .form_hover_step2 .phone_flag_selector,
  .block11 .form_hover_step2 .phone_flag_selector,
  .block16 .form_hover_step2 .phone_flag_selector,
  .block18 .form_hover_step2 .phone_flag_selector,
  .block20 .form_hover_step2 .phone_flag_selector {
    width: fit-content !important;
  }

  input[type="tel"] {
    padding: 12.5px 10px 9px 3px;
  }
  
  /* При 620px: phone_modal_wrapper в form_hover_step2 центрируется по всему блоку */
  @media (max-width: 620px) {
    .form_hover_step2 .phone_flag_selector .phone_modal_wrapper,
    .block3 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper,
    .block11 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper,
    .block16 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper,
    .block18 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper,
    .block20 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper {
      position: absolute !important;
      top: calc(100% + 10px) !important;
      left: 50% !important;
      right: auto !important;
      transform: translateX(calc(-50% - 10px)) !important; /* Смещаем чуть левее для точного центрирования */
      z-index: 10000 !important;
      width: auto !important;
      max-width: calc(100vw - 48px) !important;
      min-width: auto !important;
      padding: 0 !important;
      box-sizing: border-box !important;
      pointer-events: none !important;
    }
    
    .form_hover_step2 .phone_flag_selector .phone_modal_wrapper .phone_modal,
    .block3 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper .phone_modal,
    .block11 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper .phone_modal,
    .block16 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper .phone_modal,
    .block18 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper .phone_modal,
    .block20 .form_hover_step2 .phone_flag_selector .phone_modal_wrapper .phone_modal {
      width: min(280px, calc(100vw - 48px)) !important;
      max-width: 280px !important;
      margin: 0 auto !important;
      box-sizing: border-box !important;
    }
    
    .form_hover_step2 .phone_flag_selector.active .phone_modal_wrapper,
    .block3 .form_hover_step2 .phone_flag_selector.active .phone_modal_wrapper,
    .block11 .form_hover_step2 .phone_flag_selector.active .phone_modal_wrapper,
    .block16 .form_hover_step2 .phone_flag_selector.active .phone_modal_wrapper,
    .block18 .form_hover_step2 .phone_flag_selector.active .phone_modal_wrapper,
    .block20 .form_hover_step2 .phone_flag_selector.active .phone_modal_wrapper {
      pointer-events: auto !important;
    }
  }


  /* Настраиваем grid так, чтобы input_column_left начинал сужаться только когда input_column_right достигнет 160px */
  .form_hover .input_group,
  .block3 .form_hover .input_group,
  .block11 .form_hover .input_group,
  .block16 .form_hover .input_group,
  .block18 .form_hover .input_group,
  .block20 .form_hover .input_group {
    grid-template-columns: minmax(0, max-content) minmax(160px, 1fr) !important;
  }
  
  /* Восстанавливаем phone_modal_wrapper для form_hover как на 769px+ */
  .form_hover .phone_flag_selector .phone_modal_wrapper,
  .block3 .form_hover .phone_flag_selector .phone_modal_wrapper,
  .block11 .form_hover .phone_flag_selector .phone_modal_wrapper,
  .block16 .form_hover .phone_flag_selector .phone_modal_wrapper,
  .block18 .form_hover .phone_flag_selector .phone_modal_wrapper,
  .block20 .form_hover .phone_flag_selector .phone_modal_wrapper {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    left: 0 !important;
    transform: none !important;
    z-index: 10000 !important;
    /* Убираем ограничения ширины, чтобы modal был нормальной ширины */
    width: auto !important;
    max-width: none !important;
    min-width: auto !important;
    right: auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    pointer-events: none !important;
  }
  
  /* Восстанавливаем стандартную ширину phone_modal внутри form_hover */
  .form_hover .phone_flag_selector .phone_modal_wrapper .phone_modal,
  .block3 .form_hover .phone_flag_selector .phone_modal_wrapper .phone_modal,
  .block11 .form_hover .phone_flag_selector .phone_modal_wrapper .phone_modal,
  .block16 .form_hover .phone_flag_selector .phone_modal_wrapper .phone_modal,
  .block18 .form_hover .phone_flag_selector .phone_modal_wrapper .phone_modal,
  .block20 .form_hover .phone_flag_selector .phone_modal_wrapper .phone_modal {
    width: min(280px, calc(100vw - 40px)) !important;
    max-width: 280px !important;
    margin: 0 !important;
  }
  
  .form_hover .phone_flag_selector.active .phone_modal_wrapper,
  .block3 .form_hover .phone_flag_selector.active .phone_modal_wrapper,
  .block11 .form_hover .phone_flag_selector.active .phone_modal_wrapper,
  .block16 .form_hover .phone_flag_selector.active .phone_modal_wrapper,
  .block18 .form_hover .phone_flag_selector.active .phone_modal_wrapper,
  .block20 .form_hover .phone_flag_selector.active .phone_modal_wrapper {
    pointer-events: auto !important;
  }
  
  /* Убираем overflow: hidden у input_column_left и phone_wrapper для form_hover, чтобы modal был виден */
  .form_hover .input_column_left,
  .block3 .form_hover .input_column_left,
  .block11 .form_hover .input_column_left,
  .block16 .form_hover .input_column_left,
  .block18 .form_hover .input_column_left,
  .block20 .form_hover .input_column_left {
    overflow: visible !important;
  }
  
  .form_hover .phone_wrapper,
  .block3 .form_hover .phone_wrapper,
  .block11 .form_hover .phone_wrapper,
  .block16 .form_hover .phone_wrapper,
  .block18 .form_hover .phone_wrapper,
  .block20 .form_hover .phone_wrapper {
    overflow: visible !important;
  }

  .block21_social {
    gap: 10px;
  }
  
  /* Меняем порядок элементов: иконки слева, текст справа */
  .block21_social_icon:nth-child(2) {
    order: 1;
  }
  
  .block21_social_icon:nth-child(3) {
    order: 2;
  }
}

/* При 385px: input_column_right переносится вниз, обе колонки на всю ширину */
@media (max-width: 385px) {
  .block21_footer {
    align-items: flex-start !important;
    justify-content: flex-start;
  }
  
  .block21_social {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 10px !important;
  }
  
  .form_hover .input_group,
  .block3 .form_hover .input_group,
  .block11 .form_hover .input_group,
  .block16 .form_hover .input_group,
  .block18 .form_hover .input_group,
  .block20 .form_hover .input_group {
    grid-template-columns: 1fr !important; /* Одна колонка - элементы друг под другом */
  }
  
  .form_hover .input_column_left,
  .block3 .form_hover .input_column_left,
  .block11 .form_hover .input_column_left,
  .block16 .form_hover .input_column_left,
  .block18 .form_hover .input_column_left,
  .block20 .form_hover .input_column_left {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  .form_hover .input_column_right,
  .block3 .form_hover .input_column_right,
  .block11 .form_hover .input_column_right,
  .block16 .form_hover .input_column_right,
  .block18 .form_hover .input_column_right,
  .block20 .form_hover .input_column_right {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  .form_hover .input_column_left .phone_wrapper {
    width: 100%;
    max-width: 100%;
  }
  
  .form_hover .input_column_left .phone_number {
    width: 100%;
    flex: 1 1 100%;
    min-width: 0;
  }
  
  .form_hover .input_column_left .phone_number input {
    width: 100%;
    box-sizing: border-box;
    padding-left: 23px;
  }
  
  /* Убираем overflow: hidden у input_column_left и phone_wrapper для form_hover, чтобы modal был виден */
  .form_hover .input_column_left,
  .block3 .form_hover .input_column_left,
  .block11 .form_hover .input_column_left,
  .block16 .form_hover .input_column_left,
  .block18 .form_hover .input_column_left,
  .block20 .form_hover .input_column_left {
    overflow: visible !important;
  }
  
  .form_hover .phone_wrapper,
  .block3 .form_hover .phone_wrapper,
  .block11 .form_hover .phone_wrapper,
  .block16 .form_hover .phone_wrapper,
  .block18 .form_hover .phone_wrapper,
  .block20 .form_hover .phone_wrapper {
    overflow: visible !important;
  }
  
  .block11 .form_bg {
    height: auto;
    min-height: 300px;
  }
  
  
  .block11 .form_txt {
    font-size: 24px !important;
    margin-bottom: 24px;
  }
  
  .block11 .input_group {
    grid-template-columns: 1fr;
    gap: 20px;
    max-width: 100%;
  }
  
  .block11 .input_column_left,
  .block11 .input_column_right {
    width: 100%;
  }
  
  .block11 .phone_wrapper {
    max-width: 100%;
  }
  
  .block11 .phone_number {
    width: 100%;
    flex: 1 1 100%;
  }
  
  .block11 .input_submit_wrapper {
    max-width: 100%;
  }
  
  .block11 .number,
  .block11 .capcha {
    text-align: left !important;
    width: 100%;
  }
  
  .block11 .form_hover .capcha::before,
  .block11 .form_hover .capcha::after {
    text-align: left !important;
  }
  
  .block16 .form_bg {
    height: auto;
    min-height: 300px;
  }
  
  .block16 .form_hover {
    padding: 20px 15px;
    align-items: flex-start !important;
  }
  
  .block16 .form_txt {
    font-size: 24px !important;
    text-align: left !important;
  }
  
  .block16 .alt_text {
    text-align: left !important;
  }
  
  .block16 .number {
    text-align: left !important;
  }
  
  .block16 .capcha {
    text-align: left !important;
  }
  
  .block16 .form_hover .capcha::before,
  .block16 .form_hover .capcha::after {
    text-align: left !important;
  }

  .block17 {
    padding: 50px var(--side-padding) 70px;
  }
  
  .block17_title {
    font-size: 28px;
    margin-bottom: 25px;
  }
  
  .block17_accordion_content p {

    line-height: 24px;
  }
  
  .block18 .form_bg {
    height: auto;
    min-height: 300px;
  }
  
  .block18 .form_hover {
    padding: 20px 15px;
    align-items: flex-start !important;
  }
  
  .block18 .form_txt {
    font-size: 24px !important;
    margin-bottom: 24px;
    text-align: left !important;
  }
  
  .block18 .alt_text {
    text-align: left !important;
  }
  
  .block18 .form_step2_alt_text {
    text-align: left !important;
  }
  
  .block18 .input_group {
    grid-template-columns: 1fr;
    gap: 20px;
    max-width: 100%;
  }
  
  .block18 .input_column_left,
  .block18 .input_column_right {
    width: 100%;
  }
  
  .block18 .phone_wrapper {
    max-width: 100%;
  }
  
  .block18 .phone_number {
    width: 100%;
    flex: 1 1 100%;
  }
  
  .block18 .input_submit_wrapper {
    max-width: 100%;
    width: 100%;
  }
  
  .block18 .input_submit_wrapper .comment {
    width: 100%;
  }
  
  .block18 .number,
  .block18 .capcha {
    text-align: left !important;
    width: 100%;
  }
  
  .block18 .form_hover .capcha::before,
  .block18 .form_hover .capcha::after {
    text-align: left !important;
  }
  
  .block18_form_row_top,
  .block18_form_row_bottom {
    grid-template-columns: 1fr;
    gap: 0px !important;
  }
  
  .block18_form_row_top {
    margin-bottom: 0 !important;
  }
  
  .block18_form_row_bottom .form_step2_input_wrapper:nth-child(1) {
    grid-column: 1;
  }
  
  .block18_form_row_bottom .form_step2_input_wrapper:nth-child(2) {
    grid-column: 1;
  }
  
  .block18_form_row_bottom .form_step2_input_wrapper:nth-child(3) {
    grid-column: 1;
  }
  
  .form_step2_fields_wrapper.block18_form_fields {
    gap: 0 !important;
  }
  
  .block18_submit_btn {
    margin-top: 25px;
  }

  .block20 {
    padding-inline: 0px;
  }
  
  .block20 .form_bg {
    min-height: 300px;
  }
  
  .block20 .form_hover {
    padding: 20px 15px;
    align-items: flex-start !important;
  }

  .block20 .form_txt.block20_title,
  .block20_title {
    font-size: 24px !important;
    text-align: left !important;
  }

  .block20_description {
    text-align: left !important;
  }

  .block20 .alt_text.block20_consent,
  .block20_consent {
    text-align: left !important;
    line-height: 1.5 !important;
  }

  .block20 .number {
    text-align: left !important;
  }

  .block20 .capcha {
    text-align: left !important;
  }

  .block20 .form_hover .capcha::before,
  .block20 .form_hover .capcha::after {
    text-align: left !important;
  }
  
  .block20 .input_group {
    display: grid !important;
    grid-template-columns: max-content 1fr !important;
    gap: clamp(15px, 3vw, 20px) !important;
    align-items: start !important;
  }
  
  .block20 .input_column_left,
  .block20 .input_column_right {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .block20_campuses .block20_details_wrapper {
    grid-template-columns: none;
    gap: 30px;
  }

  .form_row {
    gap: 15px;
  }

  .block14_title {
    font-size: 36px;
    line-height: 1.2;
  }


  .block14_reviews_title {
    font-size: 28px;
  }

  .teacher_card {
    width: 180px;
  }

  .teacher_photo {
    width: 180px;
    height: 190px;
  }

  .review_card, .block19_reviews_slides .block19_review_card:first-child {
    padding: 24px 16px;
  }

  .block19_reviews_main_title {
    font-size: 36px;
    line-height: 1.2;
  }

  .block19_reviews_header {
    justify-content: center !important;
    align-items: center !important;
  }

  .block19_reviews_title {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 24px;
    text-align: center;
    width: 100%;
  }

  .block19_reviews_navigation {
    display: flex;
  }

  .block19_review_card {
    flex: 0 0 280px !important;
    width: 280px !important;
    min-width: 280px !important;
    max-width: 280px !important;
  }

  /* Иконки платформ на мобильных устройствах */
  .block19_reviews_slider_wrapper .block19_review_icon {
    bottom: 12px;
    right: 12px;
  }

  .block19_reviews_slider_wrapper .block19_review_icon .review_platform_icon {
    width: 20px;
    height: 20px;
  }

  .block19_reviews_slider_wrapper .block19_review_rating_value,
  .block19_reviews_slider_wrapper .block19_review_date,
  .block19_reviews_slider_wrapper .block19_review_text,
  .block19_reviews_slider_wrapper .block19_review_expand,
  .block19_reviews_slider_wrapper .block19_review_year,
  .block19_reviews_slider_wrapper .block19_review_campus {
    font-family: Roboto, Arial, sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
  }

  .block19_reviews_form_row {
    grid-template-columns: 1fr;
    gap: 0;
  }
  
  .block19_reviews_form_title {
    font-size: 28px;
  }
  
  .block19_title {
    font-size: 36px;
    line-height: 1.2;
  }
  
  .block19_header {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 10px;
    text-align: center;
  }

  .block19_navigation {
    display: none;
  }
  
  .block19 .news_card {
    width: 280px;
    flex: 0 0 280px;
    align-self: stretch;
  }
  
  .block19 .news_image {
    width: 100%;
    height: 280px;
  }

  .block19_news {
    padding-bottom: 10px;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
  }

  .block19_news:hover,
  .block19_news:active,
  .block19_news.scrolling {
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
  }

  .block19_news::-webkit-scrollbar {
    height: 6px;
  }

  .block19_news::-webkit-scrollbar-track {
    background: transparent;
  }

  .block19_news::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 3px;
    transition: background 0.3s ease;
  }

  .block19_news:hover::-webkit-scrollbar-thumb,
  .block19_news:active::-webkit-scrollbar-thumb,
  .block19_news.scrolling::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
  }

  .block19_news::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
  }

  .block19_reviews_slides {
    padding-bottom: 10px;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
  }

  .block19_reviews_slides:hover,
  .block19_reviews_slides:active,
  .block19_reviews_slides.scrolling {
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
  }

  .block19_reviews_slides::-webkit-scrollbar {
    height: 6px;
    display: block;
  }

  .block19_reviews_slides::-webkit-scrollbar-track {
    background: transparent;
  }

  .block19_reviews_slides::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 3px;
    transition: background 0.3s ease;
  }

  .block19_reviews_slides:hover::-webkit-scrollbar-thumb,
  .block19_reviews_slides:active::-webkit-scrollbar-thumb,
  .block19_reviews_slides.scrolling::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
  }

  .block19_reviews_slides::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
  }

  .teachers_reviews {
    padding-bottom: 10px;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
  }

  .teachers_reviews:hover,
  .teachers_reviews:active,
  .teachers_reviews.scrolling {
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
  }

  .teachers_reviews::-webkit-scrollbar {
    height: 6px;
    display: block;
  }

  .teachers_reviews::-webkit-scrollbar-track {
    background: transparent;
  }

  .teachers_reviews::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 3px;
    transition: background 0.3s ease;
  }

  .teachers_reviews:hover::-webkit-scrollbar-thumb,
  .teachers_reviews:active::-webkit-scrollbar-thumb,
  .teachers_reviews.scrolling::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
  }

  .teachers_reviews::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
  }

  /* Возвращаем старые стили для слайдеров при 768px */
  .teachers_slider_wrapper {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    position: relative;
    overflow: visible;
    padding-bottom: 8px;
  }

  .reviews_slider_wrapper {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    position: relative;
    overflow: visible;
  }

  .block19_reviews_slider_wrapper {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    position: relative;
    overflow: visible;
  }

  .block19_slider_wrapper {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    position: relative;
    overflow: visible;
  }

  .block19_news {
    padding: 20px 0 !important;
  }

  .block19_news .news_card:first-child {
    margin-left: var(--side-padding) !important;
  }

  .block19_news .news_card:last-child {
    margin-right: var(--side-padding) !important;
  }

  .teachers_slides {
    padding: 10px 0 !important;
  }

  .teachers_slides .teacher_card:first-child {
    margin-left: var(--side-padding) !important;
  }

  .teachers_slides .teacher_card:last-child {
    margin-right: var(--side-padding) !important;
  }

  .teachers_reviews {
    padding: 20px 0 !important;
  }

  .teachers_reviews .review_card:first-child {
    margin-left: var(--side-padding) !important;
  }

  .teachers_reviews .review_card:last-child {
    margin-right: var(--side-padding) !important;
  }

  .block19_reviews_slides {
    padding: 10px 0 !important;
  }

  .block19_reviews_slides .block19_review_card:first-child {
    margin-left: var(--side-padding) !important;
  }

  .block19_reviews_slides .block19_review_card:last-child {
    margin-right: var(--side-padding) !important;
  }

  .teachers_slides {
    padding-bottom: 10px;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
  }

  .teachers_slides:hover,
  .teachers_slides:active,
  .teachers_slides.scrolling {
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
  }

  .teachers_slides::-webkit-scrollbar {
    height: 6px;
    display: block;
  }

  .teachers_slides::-webkit-scrollbar-track {
    background: transparent;
  }

  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li {
    padding: 8px 24px 8px 24px !important;
  }

  .teachers_slides::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 3px;
    transition: background 0.3s ease;
  }

  .teachers_slides:hover::-webkit-scrollbar-thumb,
  .teachers_slides:active::-webkit-scrollbar-thumb,
  .teachers_slides.scrolling::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
  }

  .teachers_slides::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
  }
  
  .block19 .news_content {
    width: 100%;
  }
  
  .block19 .news_title {
    font-size: 18px;
  }
  
  .block19 .news_date {
    font-size: 12px;
  }

  .block20_campuses .block20_local_map {
    height: 220px;
  }

  .block21 {
    padding: 50px var(--side-padding) 30px;
  }
  
  .block21_top {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
  
  .block21_middle_columns {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
  
  .block21_logo_image {
    max-width: 192px;
    max-height: 144px;
    width: 100%;
    height: auto;
    object-fit: contain;
  }
  
  .block21_copyright {
    font-size: 16px;
  }
  
  .block21_footer {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  .block21_social {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center !important;
    justify-content: center;
    gap: 10px;
  }

  .block21_social_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px !important;
    height: 24px !important;
  }

  .block21_social_icon img {
    width: 24px !important;
    height: 24px !important;
  }

  .block21_social_icon:has(img[alt="YouTube"]),
  .block21_social_icon:has(img[src*="YouTube"]) {
    width: auto !important;
    min-width: 24px !important;
    height: 24px !important;
  }

  .block21_social_icon img[alt="YouTube"],
  .block21_social_icon img[src*="YouTube"] {
    width: auto !important;
    height: 100% !important;
  }

  .block15_title {
    font-size: 36px;
    line-height: 1.2;
  }

  .block15_description {
    font-size: 20px;
  }

  .block15_accordion{
    gap: 8px;
  }

  .alumni_accordion_item {
    margin-bottom: 0;
  }

  .block15_title {
    margin-bottom: 0px;
  }

  .alumni_intro,
  .country_title,
  .university_list li {
    font-size: 18px;
  }

  .alumni_association_lead {
    font-size: 20px;
  }

  .alumni_association_text {
    font-size: 18px;
  }
  
  /* Уменьшаем высоту фото и блока campus_card при 768px */
  /* Постепенное уменьшение от размеров при 768px (200px высота, 100% ширина) до размеров при 325px (85px высота, 136px ширина) */
  /* Убираем фиксированную высоту 200px при 768px */
  .campus_card img {
    height: clamp(105px, calc(105px + 95px * ((100vw - 385px) / 383px)), 200px) !important;
  }
  
  .campuses_grid .campus_card img {
    width: 100%;
    object-fit: cover;
  }
  
  .campuses_grid {
    gap: clamp(10px, 2vw, 20px);
  }
  
  /* Убираем фиксированную высоту 200px map_image при 768px */
  .map_image {
    height: clamp(105px, calc(105px + 95px * ((100vw - 385px) / 383px)), 200px) !important;
    width: 100%;
  }
  
  /* Центрируем campus_label по центру блока (как map_text) и устанавливаем размер шрифта 16px */
  .campus_label {
    top: 50% !important;
    left: 50% !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    text-align: center;
    font-size: 16px !important;
    padding: 0 !important;
    padding: clamp(10px, 3vw, 50px) clamp(10px, 2vw, 20px);
  }
  
  /* Аналогично для map_text */
  .map_text {
    font-size: clamp(16px, 4vw, 28px);
  }
  
    
  .teachers_navigation {
    display: none !important; /* Скрываем teachers_navigation при 768px */
  }
  
  .block14_header .teachers_navigation {
    display: none !important; /* Скрываем teachers_navigation в block14_header при 768px */
  }
  
  .block14_container .teachers_navigation {
    display: none !important; /* Скрываем teachers_navigation в block14_container при 768px */
  }
  
  .block14_reviews_title {
    text-align: center;
    font-family: "Roboto", Arial, sans-serif;
    font-weight: 500;
    font-size: 24px !important;
  }
  
  .reviews_navigation {
    display: none; /* Скрываем reviews_navigation при 768px */
  }
  
  .block14_reviews_header .reviews_navigation {
    display: none !important; /* Скрываем reviews_navigation в block14_reviews_header при 768px */
  }
  
  .reviews_slider_wrapper {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  
  .block14_campus_buttons {
    display: flex !important;
    width: 100%;
    justify-content: center;
    margin-bottom: 20px;
  }
  
  .block14_campus_buttons .block14_campus_selector_wrapper {
    width: 100%;
    display: block;
  }
  
  .block14_campus_buttons .block14_campus_selector_btn {
    width: 100% !important;
    max-width: 100% !important;
    background: #D2232A !important;
    color: #fff !important;
    border: 2px solid #D2232A !important;
    box-sizing: border-box;
  }
  
  .block14_bottom .block14_campus_selector_wrapper {
    display: none !important;
  }
  
  .block14_bottom {
    margin-top: 0 !important;
    margin-bottom: 32px !important;
    gap: 14px !important;
    justify-content: flex-start !important;
  }
  
  #block14SelectedCampus {
    font-size: 14px !important;
  }
  
  .block14_btn {
    font-size: 14px !important;
    width: auto !important;
    min-width: auto !important;
  }
  
  .block14_campus_selector_btn {
    font-size: 14px !important;
  }
  
  .block14_campus_selector_btn #block14SelectedCampus {
    font-size: 14px !important;
  }
}

/* При 768px и меньше: настройки типографики блока отзывов (Block19) */
@media (max-width: 768px) {
  .block19_reviews_main_title {
    font-size: 24px !important;
    line-height: 1.2 !important;
  }

  /* Заголовок блока новостей */
  .block19_title {
    font-size: 24px !important;
    line-height: 1.2 !important;
  }

  /* Хедер блока новостей по центру */
  .block19_header {
    justify-content: center !important;
    align-items: center !important;
    flex-direction: column !important;
    text-align: center !important;
  }

  .block19_header > * {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .block19_reviews_header {
    justify-content: center !important;
    align-items: center !important;
    flex-direction: column !important;
    text-align: center !important;
  }

  .block19_reviews_header > * {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .block19_reviews_title {
    font-size: 20px !important;
  }

  .block19_reviews_navigation {
    display: flex !important;
  }

  /* Весь текст внутри карточек отзывов — 14px */
  .block19_review_card,
  .block19_review_card * {
    font-size: 14px !important;
  }

  /* Навигацию блока новостей скрываем */
  .block19_navigation {
    display: none !important;
  }

  /* Текст новостей в слайдере — 14px */
  .block19 .news_title,
  .block19 .news_date {
    font-size: 14px !important;
    line-height: 1.4 !important;
  }

  /* Block20: Кампусы */

  /* Кнопки кампусов на всю ширину, шрифт 14px */
  .block20_campuses .block20_campus_buttons {
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
  }

  .block20_campuses .block20_campus_btn {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
  }

  /* Обертка и селектор кампуса (мобильный дропдаун) на всю ширину */
  .block20_campus_selector_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }

  .block20_campus_selector_btn {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
  }

  /* Убираем заголовок кампуса */
  .block20_campuses .block20_campus_title {
    display: none !important;
  }

  /* Заголовки блоков контактов и информации — 20px */
  .block20_campuses .block20_contact_title,
  .block20_campuses .block20_address_title,
  .block20_campuses .block20_hours_title,
  .block20_campuses .block20_coordinates_title {
    font-size: 20px !important;
  }

  /* Остальной текст внутри блока кампусов — 14px */
  .block20_campuses .block20_contact_label,
  .block20_campuses .block20_contact_value,
  .block20_campuses .block20_address_value,
  .block20_campuses .block20_coordinates_value,
  .block20_campuses .block20_hours_day,
  .block20_campuses .block20_hours_time {
    font-size: 14px !important;
  }

  /* Стрелки выбора кампуса (везде) — 14px */
  .campus_arrow,
  .form_campus_arrow,
  .block12_campus_arrow,
  .block14_campus_arrow,
  .block20_campus_arrow {
    font-size: 14px !important;
  }

  /* BLOCK21: весь текст 14px, кроме логотипа */

  .block21_column_title,
  .block21_link {
    font-size: 14px !important;
  }

  .block21_middle_columns * {
    font-size: 14px !important;
  }

  .block21_footer,
  .block21_footer * {
    font-size: 14px !important;
  }

  /* Логотип (block21_logo_image) оставляем с его размерами */
}

/* Стили для block21_footer при 768px */
@media (max-width: 768px) {
  .block21_logo_image {
    max-width: 121px;
    max-height: 89px;
    width: auto;
    height: auto;
    object-fit: contain;
    flex-shrink: 1;
    min-width: 0;
  }
  
  .block21_footer {
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 1px;
  }
  
  /* block21_social справа от block21_copyright */
  .block21_social {
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px;
    order: 2;
  }
  
  .block21_copyright {
    order: 1;
  }
}

@media (max-width: 450px) {
  .block4 .container_campuses {
    text-align: left;
    padding-bottom: 0;
  }
  
  .block4 .campuses,
  .block4 .subtitle {
    text-align: left;
    padding-left: clamp(0px, 3vw, 20px);
  }

  .block20_campuses .block20_details_wrapper {
    gap: 20px;
  }
}

@media (max-width: 768px) {
  .accordion_content p {
    font-family: Roboto;
    font-weight: 400;
    font-style: Regular;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0%;
  }
  
  .footer_note {
    display: none;
  }
}


@media (max-width: 405px) {
  .block4 .campuses,
  .block4 .subtitle {
    padding-left: 0;
  }
  
  .accordion_text {
    text-align: left;
  }
}

@media (max-width: 480px) {
  .alumni_diagram {
    width: 100% !important;
    max-width: 280px !important;
    height: auto !important;
  }
  
  .alumni_diagram img {
    width: 100% !important;
    height: auto !important;
  }
}


@media (max-width: 400px) {
  /* Исправление горизонтальной прокрутки */
  .nav-bar,
  .block1::before,
  .block1::after,
  .form_bg,
  .block20_campuses .block20_map_section {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .block20 {
    padding-inline: 0;
  }
  
  .block1::before,
  .block1::after {
    left: 0 !important;
  }
  
  .form_bg {
    left: 0 !important;
    right: 0 !important;
  }
  
  .accordion_text {
    text-align: left !important;
  }
}

@media (max-width: 325px) {
  .map_image {
    min-width: 100px;
  }

  .campuses_grid .campus_card img {
    min-width: 100px;
  }

  .region_modal.open {
    width: calc(100vw - 28px) !important;
    max-width: none !important;
  }

  .campuses_grid .campus_card img {
    height: clamp(85px, 20vw, 200px);
  }
}

/* ============================================
   ПАРОЛЬНАЯ ЗАЩИТА
   ============================================ */
.password-protection {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.password-protection.hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.password-form-container {
  width: 100%;
  max-width: 400px;
  padding: 20px;
}

.password-form {
  background: #ffffff;
  border-radius: 12px;
  padding: 40px 30px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
  text-align: center;
}

.password-form h2 {
  color: #000000;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 30px;
  font-family: 'Roboto', Arial, sans-serif;
}

.password-form input[type="password"] {
  width: 100%;
  padding: 14px 16px;
  border: 2px solid #e0e0e0;
  border-radius: 8px;
  font-size: 16px;
  font-family: 'Roboto', Arial, sans-serif;
  margin-bottom: 20px;
  transition: border-color 0.3s ease;
  box-sizing: border-box;
}

.password-form input[type="password"]:focus {
  outline: none;
  border-color: #667eea;
}

.password-form button {
  width: 100%;
  padding: 14px;
  background: #D2232A;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 500;
  font-family: 'Roboto', Arial, sans-serif;
  cursor: pointer;
  transition: background 0.3s ease;
}

.password-form button:hover {
  background: #b01d24;
}

.password-form button:active {
  transform: scale(0.98);
}

.password-error {
  margin-top: 15px;
  color: #D2232A;
  font-size: 14px;
  font-family: 'Roboto', Arial, sans-serif;
  min-height: 20px;
  visibility: hidden;
}

.password-error.show {
  visibility: visible;
}

@media (max-width: 480px) {
  .password-form {
    padding: 30px 20px;
  }
  
  .password-form h2 {
    font-size: 20px;
    margin-bottom: 25px;
  }
  
  .password-form input[type="password"],
  .password-form button {
    padding: 12px;
    font-size: 15px;
  }
}

/* Исправление отступов для iPhone Safari при 768px */
@media (max-width: 768px) {
  /* Исправление для info_school_2_carousel_container - добавляем padding-right и исправляем левый отступ */
  .info_school_2_carousel_container {
    padding-right: var(--side-padding) !important;
    padding-left: 0 !important;
    box-sizing: border-box;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .info_school_2_carousel_container .info_school_2_card:first-child {
    margin-left: var(--side-padding) !important;
  }
  
  .info_school_2_carousel_container .info_school_2_card:last-child {
    margin-right: 0 !important;
  }
  
  /* Исправление для info_about - добавляем padding-right */
  .info_about {
    padding-right: var(--side-padding) !important;
    box-sizing: border-box;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  /* Исправление для advantages_grid - добавляем padding-right */
  .advantages_grid {
    padding-right: var(--side-padding) !important;
    box-sizing: border-box;
    margin-right: 0 !important;
  }
  
  .campus_card img, .map_image {
    height: 103px;
    width: 165px;
  }

  .campus_label, .map_text {
    font-size: 16px !important;
  }

  .advantages_grid .advantage_card:last-child {
    margin-right: 0 !important;
  }
  
  /* Исправление для teachers_slides - добавляем padding-right */
  .teachers_slides {
    padding-right: var(--side-padding) !important;
    box-sizing: border-box;
    margin-right: 0 !important;
  }
  
  /* Исправление для teachers_reviews - добавляем padding-right */
  .teachers_reviews {
    padding-right: var(--side-padding) !important;
    box-sizing: border-box;
    margin-right: 0 !important;
  }
  
  /* Исправление для block19_reviews_slides (оба варианта) - добавляем padding-right */
  .block19_reviews_slides,
  #parentReviewsSlides,
  #studentReviewsSlides {
    padding-right: var(--side-padding) !important;
    box-sizing: border-box;
    margin-right: 0 !important;
  }
  
  /* Исправление для block19_news - добавляем padding-right */
  .block19_news {
    padding-right: var(--side-padding) !important;
    box-sizing: border-box;
    margin-right: 0 !important;
  }
  
  /* Дополнительные исправления для родительских контейнеров на iPhone */
  .block19_reviews_slider_wrapper {
    padding-right: 0 !important;
  }
  
  .block19_reviews_container {
    padding-right: 0 !important;
  }
}

@media (max-width: 380px) {
  .top_bar, .nav-bar {
    padding-inline: 14px !important;
  }
}

/* ============================================
   КРИТИЧЕСКИ ВАЖНО: ФИНАЛЬНОЕ ПРАВИЛО ДЛЯ КНОПКИ BLOCK7 ПРИ 769px+
   Это правило должно быть в самом конце файла и переопределять все остальные
   ============================================ */
@media (min-width: 769px) {
  .block7 .form_container .download_form .form_row .download_btn,
  .block7 .form_container .download_form .download_btn,
  .block7 .download_form .form_row .download_btn,
  .block7 .download_form .download_btn,
  .block7 .form_row .download_btn,
  .block7 .download_btn {
    background: #D2232A !important;
    background-color: #D2232A !important;
    background-image: none !important;
    color: white !important;
  }

  .block7 .form_container .download_form .form_row .download_btn:hover,
  .block7 .form_container .download_form .download_btn:hover,
  .block7 .download_form .form_row .download_btn:hover,
  .block7 .download_form .download_btn:hover,
  .block7 .form_row .download_btn:hover,
  .block7 .download_btn:hover {
    background: #D2232A !important;
    background-color: #D2232A !important;
    background-image: none !important;
  }

  .block7 .form_container .download_form .form_row .download_btn:disabled,
  .block7 .form_container .download_form .download_btn:disabled,
  .block7 .download_form .form_row .download_btn:disabled,
  .block7 .download_form .download_btn:disabled,
  .block7 .form_row .download_btn:disabled,
  .block7 .download_btn:disabled {
    background: #D2232A !important;
    background-color: #D2232A !important;
    background-image: none !important;
    opacity: 0.5 !important;
  }
}

/* КРИТИЧЕСКИ ВАЖНО: Правила для красных звездочек в block7 при 768px должны быть в самом конце файла */
@media (max-width: 768px) {
  /* Переопределяем базовый класс .request для block7 */
  .block7 .request.request,
  .block7 .download_form .request.request,
  .block7 .form_container .request.request,
  /* Общие селекторы для всех звездочек в block7 */
  .block7 .request,
  .block7 .download_form .request,
  .block7 .form_container .request,
  .block7 .download_form .form_group label .request,
  .block7 .download_form .form_group label span.request,
  .block7 .form_container .form_group label .request,
  .block7 .form_container .form_group label span.request,
  .block7 .form_group label .request,
  .block7 .form_group label span.request,
  .block7 label .request,
  .block7 label span.request,
  /* Специфичные селекторы для конкретных полей */
  .block7 .download_form .form_group label[for="name"] .request,
  .block7 .download_form .form_group label[for="phone"] .request,
  .block7 .download_form .form_group label[for="email"] .request,
  .block7 .download_form .form_group label[for="campus"] .request,
  .block7 .form_group label[for="name"] .request,
  .block7 .form_group label[for="phone"] .request,
  .block7 .form_group label[for="email"] .request,
  .block7 .form_group label[for="campus"] .request,
  .block7 .form_group label[for="name"] span.request,
  .block7 .form_group label[for="phone"] span.request,
  .block7 .form_group label[for="email"] span.request,
  .block7 .form_group label[for="campus"] span.request {
    color: #D2232A !important;
  }
  
  /* Правила для размеров шрифтов block14 при 768px */
  #block14SelectedCampus {
    font-size: 14px !important;
  }
  
  .block14_btn {
    font-size: 14px !important;
    width: auto !important;
    min-width: auto !important;
  }
  
  .block14_bottom {
    justify-content: flex-start !important;
  }
  
  .block14_campus_selector_btn {
    font-size: 14px !important;
  }
  
  .block14_campus_selector_btn #block14SelectedCampus {
    font-size: 14px !important;
  }
  
  .block14_reviews_title {
    font-size: 24px !important;
  }
  
  .block14_reviews_header .reviews_navigation {
    display: none !important;
  }
  
  .reviews_slider_wrapper {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  
  .review_name {
    font-size: 14px !important;
  }
  
  .block14_reviews_title {
    font-size: 24px !important;
  }
  
  .block14_reviews_header .reviews_navigation {
    display: none !important;
  }
  
  .block15_description {
    font-size: 14px !important;
  }
  
  .block21_social_icon {
    width: 24px !important;
    height: 24px !important;
  }
  
  .block21_social_icon img {
    width: 24px !important;
    height: 24px !important;
  }
  
  .block21_social_icon:has(img[alt="YouTube"]),
  .block21_social_icon:has(img[src*="YouTube"]) {
    width: auto !important;
    min-width: 24px !important;
    height: 24px !important;
  }
  
  .block21_social_icon img[alt="YouTube"],
  .block21_social_icon img[src*="YouTube"] {
    width: auto !important;
    height: 100% !important;
  }
  
  .block18 .form_txt {
    font-size: 24px !important;
  }
  
  .form_txt.block20_title,
  .block20 .form_txt.block20_title {
    font-size: 24px !important;
    text-align: left !important;
  }

  .block20_description {
    font-size: 14px;
  }
  
  .block20 .form_hover {
    text-align: left !important;
    align-items: flex-start !important;
  }
  
  .block20 .form_hover *:not(.submit):not(.form_step2_submit) {
    text-align: left !important;
  }
  
  .block20 .form_hover .alt_text.block20_consent,
  .block20 .form_hover .block20_consent,
  .block20 .alt_text.block20_consent,
  .block20_consent,
  .block20 .form_hover p.alt_text.block20_consent {
    text-align: left !important;
    align-self: flex-start !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
  
  .block20 .form_hover .submit,
  .block20 .form_hover .form_step2_submit {
    text-align: center !important;
  }
  
  .block16 .form_txt {
    font-size: 24px !important;
  }
  
  .form_br {
    font-size: 24px !important;
  }
}

/* ============================================
   СТИЛИ ДЛЯ NAV-BAR И TOP_BAR ПРИ СКРОЛЛЕ НА 769px-1195px
   ============================================ */
@media (min-width: 769px) and (max-width: 1195px) {
  /* Делаем nav-bar фиксированным при 769px-1195px - поверх красной полоски */
  .nav-bar {
    position: fixed !important;
    top: var(--top-bar-height, 74px) !important; /* Используем высоту top_bar из JS (74px на 769px-1195px) или значение по умолчанию */
    left: 0;
    right: 0;
    z-index: 1000 !important; /* Выше красной полоски (999), но ниже top_bar (z-index: 1001) */
    transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out, transform 0.3s ease-in-out; /* Плавное появление и исчезновение */
    overflow: hidden; /* Скрываем содержимое при скрытии */
    width: 100%;
    margin: 0;
    opacity: 1; /* Полностью видимый по умолчанию */
    max-height: 200px; /* Максимальная высота для плавного перехода */
    background: var(--color-red) !important; /* Убеждаемся, что фон красный */
  }
  
  /* Убеждаемся что nav-bar полностью раскрывается при скролле вверх - высота 55px на 769px-1195px */
  .nav-bar:not(.nav-bar-scrolled) {
    top: var(--top-bar-height, 74px) !important; /* Начинается с top_bar, перекрывая красную полоску */
    height: auto !important; /* Автоматическая высота для полного раскрытия */
    min-height: 55px !important; /* Минимальная высота 55px на 769px-1195px */
    max-height: 200px !important; /* Максимальная высота для плавного перехода */
    overflow: visible !important; /* Показываем все содержимое */
    opacity: 1 !important; /* Полностью видимый */
    transform: translateY(0) !important; /* Без сдвига */
  }
  
  /* ul внутри nav-bar на 769px-1195px */
  .nav-bar:not(.nav-bar-scrolled) ul {
    opacity: 1 !important; /* Полностью видимый */
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    transform: translateY(0); /* Без сдвига */
  }
  
  /* Плавное скрытие nav-bar при скролле вниз - полностью скрывается, красная полоска остается */
  .nav-bar.nav-bar-scrolled {
    top: var(--top-bar-height, 74px) !important; /* Начинается с top_bar, перекрывая красную полоску */
    height: auto !important; /* Оставляем auto для плавной анимации */
    min-height: 0 !important; /* Убираем min-height для плавного скрытия */
    max-height: 0 !important; /* Плавно уменьшаем максимальную высоту до 0 */
    opacity: 0 !important; /* Плавно скрываем nav-bar */
    transform: translateY(-10px) !important; /* Небольшой сдвиг вверх для плавности */
    overflow: hidden !important; /* Скрываем содержимое */
  }
  
  /* Плавное скрытие содержимого nav-bar при скролле вниз - синхронно с фоном */
  .nav-bar.nav-bar-scrolled ul {
    opacity: 0 !important; /* Плавно скрываем содержимое одновременно с фоном */
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    pointer-events: none; /* Отключаем взаимодействие со скрытым содержимым */
    transform: translateY(-20px); /* Больший сдвиг вверх для плавности */
  }
  
  /* Делаем top_bar фиксированным при 769px-1195px */
  .top_bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001 !important; /* Выше nav-bar и всех элементов block1 */
    width: 100%;
    max-width: 100%;
    margin: 0;
  }
  
  /* Красная полоска 9px всегда видна под top_bar */
  .top_bar::after {
    content: '';
    position: fixed;
    top: var(--top-bar-height, 74px); /* Используем высоту top_bar из JS (74px на 769px-1195px) или значение по умолчанию */
    left: 0;
    right: 0;
    height: 9px;
    background: var(--color-red);
    z-index: 999; /* Ниже nav-bar (1000), но выше block1 */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
  
  /* Убеждаемся, что block1 и его содержимое не перекрывают top_bar и nav-bar */
  .block1 {
    z-index: 1 !important; /* Ниже top_bar (z-index: 1001), nav-bar (z-index: 1000) и красной полоски (z-index: 999) */
    position: relative !important; /* Убеждаемся, что z-index применяется */
    padding-top: 138px !important; /* Отступ сверху: top_bar (74px) + красная полоска (9px) + nav-bar (55px) = 138px для места под фиксированные элементы - переопределяет padding-top: 60px из @media (max-width: 1130px) and (min-width: 769px) */
  }
  
  /* Сбрасываем z-index для дочерних элементов block1, которые могут перекрывать header */
  .block1 .hero-content,
  .block1 .hero-slider-wrapper,
  .block1 .hero-slides {
    z-index: 2 !important; /* Внутри block1, но ниже top_bar и nav-bar */
    margin-top: 20px;
  }
  
  /* При появлении кнопки меню: search сужается справа налево, чтобы освободить место */
  .top_bar.has-menu-btn .search {
    max-width: calc(300px - 100px); /* Уменьшаем max-width больше, чтобы телефон не заходил на search */
    transition: max-width 0.3s ease;
  }
  
  /* При появлении кнопки меню: contacts сдвигаются левее */
  .top_bar .contacts.has-menu-btn {
    margin-left: -44px; /* Сдвигаем contacts влево на ширину кнопки меню (40px) + отступ (4px) */
    transition: margin-left 0.3s ease;
  }
  
  /* Отступ для контейнера icons, когда кнопка меню видна + расстояние 8px до меню */
  .top_bar .icons.has-menu-btn {
    padding-right: calc(40px + 8px); /* Отступ для кнопки меню 40px + 8px расстояние */
  }
  
  /* Расстояние 8px между lang и кнопкой меню */
  .top_bar .icons.has-menu-btn .lang {
    margin-right: 8px !important;
  }
  
  /* Кнопка меню видна при скролле - размер 40x40px при 769px-1195px */
  .top_bar .icons-menu-btn.visible {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    width: 40px !important;
    height: 40px !important;
  }
  
  /* Убеждаемся что logo img видна */
  .top_bar .logo > img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 44px !important;
    height: 50px !important;
    object-fit: contain;
  }
  
  /* Настраиваем nav-bar как flex-контейнер на 769px-1195px */
  .nav-bar {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--side-padding);
  }
  
  /* Показываем nav-bar-right на 769px-1195px */
  .nav-bar-right {
    display: flex !important;
    align-items: center;
    gap: 12px;
  }
  
  /* На 769px-1195px nav-bar ul скрыт по умолчанию (как на 768px) */
  .nav-bar ul {
    display: none !important;
  }
  
  /* При открытии mobile-menu-open раскрываем nav-bar-right ul (как на 768px) */
  .nav-bar.mobile-menu-open ul {
    display: flex !important;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    right: 0;
    background: #fff !important;
    padding: 20px var(--side-padding);
    box-sizing: border-box;
    z-index: 1000;
    margin: 0;
    gap: 0;
  }
  
  .nav-bar.mobile-menu-open li {
    padding: 10px 24px;
    width: 100%;
    box-sizing: border-box;
    border-bottom: 1px solid #e5e5e5;
  }
  
  .nav-bar.mobile-menu-open li:last-child {
    border-bottom: none;
  }
  
  .nav-bar.mobile-menu-open li a {
    display: block;
    width: 100%;
    box-sizing: border-box;
    color: #000000 !important;
  }
  
  /* Убеждаемся, что dropdown пункты занимают всю ширину */
  .nav-bar.mobile-menu-open > ul > li.dropdown {
    width: 100% !important;
    box-sizing: border-box;
    position: relative;
  }
  
  /* Добавляем стрелку для dropdown пунктов на 769px-1195px */
  .nav-bar.mobile-menu-open > ul > li.dropdown > a {
    position: relative;
    padding-right: 30px;
  }
  
  .nav-bar.mobile-menu-open > ul > li.dropdown > a::after {
    content: '▼';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    color: #000;
  }
  
  /* Раскрываем dropdown меню при клике на dropdown пункт */
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu {
    display: block !important;
    position: static !important;
    width: 100% !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    max-width: 100% !important;
    background: #fff !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    box-shadow: none !important;
  }
  
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li {
    padding: 8px 24px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    margin: 0 !important;
    list-style: none !important;
    border-bottom: 1px solid #e5e5e5 !important;
  }
  
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li:last-child {
    border-bottom: none !important;
  }
  
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li > a {
    color: #000000 !important;
    padding: 0 !important;
    font-size: 14px !important;
    display: block !important;
    width: 100% !important;
    white-space: normal !important;
    text-decoration: none !important;
  }
  
  /* Отключаем hover для dropdown на 769px-1195px - работает только через клик */
  .nav-bar > ul > li.dropdown:hover > .dropdown-menu {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  
  /* Убеждаемся, что dropdown-menu скрыт по умолчанию на 769px-1195px */
  .nav-bar > ul > li.dropdown > .dropdown-menu {
    display: none !important;
  }
  
  /* Показываем только когда есть класс dropdown-open и mobile-menu-open */
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu {
    display: block !important;
  }
}

/* ============================================
   СТИЛИ ДЛЯ NAV-BAR И TOP_BAR ПРИ СКРОЛЛЕ НА 1196px+
   ============================================ */
@media (min-width: 1196px) {
  /* Делаем nav-bar фиксированным при 1196px+ - поверх красной полоски */
  .nav-bar {
    position: fixed !important;
    top: var(--top-bar-height, 90px) !important; /* Используем высоту top_bar из JS (90px на 1196px+) или значение по умолчанию */
    left: 0;
    right: 0;
    z-index: 1000 !important; /* Выше красной полоски (999), но ниже top_bar (z-index: 1001) */
    transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out, transform 0.3s ease-in-out; /* Плавное появление и исчезновение */
    overflow: hidden; /* Скрываем содержимое при скрытии */
    width: 100%;
    margin: 0;
    opacity: 1; /* Полностью видимый по умолчанию */
    max-height: 200px; /* Максимальная высота для плавного перехода */
    background: var(--color-red) !important; /* Убеждаемся, что фон красный */
  }
  
  /* Убеждаемся что nav-bar полностью раскрывается при скролле вверх - высота 69px на 1196px+ */
  .nav-bar:not(.nav-bar-scrolled) {
    top: var(--top-bar-height, 90px) !important; /* Начинается с top_bar, перекрывая красную полоску */
    height: auto !important; /* Автоматическая высота для полного раскрытия */
    max-height: 200px !important; /* Максимальная высота для плавного перехода */
    overflow: visible !important; /* Показываем все содержимое */
    opacity: 1 !important; /* Полностью видимый */
    transform: translateY(0) !important; /* Без сдвига */
  }
  
  /* ul внутри nav-bar спускается ниже на 14px при 1196px+ */
  .nav-bar:not(.nav-bar-scrolled) ul {
    padding-top: 14px !important; /* Добавляем 14px отступа сверху для ul */
    opacity: 1 !important; /* Полностью видимый */
    transition: opacity 0.3s ease-in-out, padding-top 0.3s ease-in-out, transform 0.3s ease-in-out;
    transform: translateY(0); /* Без сдвига */
  }
  
  /* Плавное скрытие nav-bar при скролле вниз - полностью скрывается, красная полоска остается */
  .nav-bar.nav-bar-scrolled {
    top: var(--top-bar-height, 90px) !important; /* Начинается с top_bar, перекрывая красную полоску */
    height: auto !important; /* Оставляем auto для плавной анимации */
    min-height: 0 !important; /* Убираем min-height для плавного скрытия */
    max-height: 0 !important; /* Плавно уменьшаем максимальную высоту до 0 */
    opacity: 0 !important; /* Плавно скрываем nav-bar */
    transform: translateY(-10px) !important; /* Небольшой сдвиг вверх для плавности */
    overflow: hidden !important; /* Скрываем содержимое */
  }
  
  /* Плавное скрытие содержимого nav-bar при скролле вниз - синхронно с фоном */
  .nav-bar.nav-bar-scrolled ul {
    opacity: 0 !important; /* Плавно скрываем содержимое одновременно с фоном */
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    pointer-events: none; /* Отключаем взаимодействие со скрытым содержимым */
    transform: translateY(-20px); /* Больший сдвиг вверх для плавности */
  }
  
  /* Делаем top_bar фиксированным при 1196px+ */
  .top_bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001 !important; /* Выше nav-bar и всех элементов block1 */
    width: 100%;
    max-width: 100%;
    margin: 0;
  }
  
  /* Красная полоска 9px всегда видна под top_bar */
  .top_bar::after {
    content: '';
    position: fixed;
    top: var(--top-bar-height, 90px);
    left: 0;
    right: 0;
    height: 9px;
    background: var(--color-red);
    z-index: 999; /* Ниже nav-bar (1000), но выше block1 */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
  
  /* Убеждаемся, что block1 и его содержимое не перекрывают top_bar и nav-bar */
  .block1 {
    z-index: 1 !important; /* Ниже top_bar (z-index: 1001), nav-bar (z-index: 1000) и красной полоски (z-index: 999) */
    position: relative; /* Убеждаемся, что z-index применяется */
    padding-top: 168px !important; /* Отступ сверху: top_bar (90px) + красная полоска (9px) + nav-bar (69px) = 168px для места под фиксированные элементы */
  }
  
  /* Сбрасываем z-index для дочерних элементов block1, которые могут перекрывать header */
  .block1 .hero-content,
  .block1 .hero-slider-wrapper,
  .block1 .hero-slides {
    z-index: 2 !important; /* Внутри block1, но ниже top_bar и nav-bar */
    margin-top: 20px;
  }
  
  /* При появлении кнопки меню: search сужается справа налево, чтобы освободить место */
  .top_bar.has-menu-btn .search {
    max-width: calc(300px - 100px); /* Уменьшаем max-width больше, чтобы телефон не заходил на search */
    transition: max-width 0.3s ease;
  }
  
  /* При появлении кнопки меню: contacts сдвигаются левее */
  .top_bar .contacts.has-menu-btn {
    margin-left: -44px; /* Сдвигаем contacts влево на ширину кнопки меню (40px) + отступ (4px) */
    transition: margin-left 0.3s ease;
  }
  
  /* Отступ для контейнера icons, когда кнопка меню видна + расстояние 8px до меню */
  .top_bar .icons.has-menu-btn {
    padding-right: calc(40px + 0px); /* Отступ для кнопки меню 40px + 8px расстояние */
  }
  
  /* Расстояние 8px между lang и кнопкой меню */
  .top_bar .icons.has-menu-btn .lang {
    margin-right: 8px !important;
  }
  
  /* Убеждаемся что nav-bar полностью раскрывается - все 55px высоты под top_bar */
  .nav-bar:not(.nav-bar-scrolled) {
    top: 74px !important; /* Полностью под top_bar */
  }
  
  /* Кнопка меню видна при скролле - размер 40x40px при 1196px+ */
  .top_bar .icons-menu-btn.visible {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    width: 40px !important;
    height: 40px !important;
  }
  
  /* Убеждаемся что logo img видна */
  .top_bar .logo > img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 44px !important;
    height: 50px !important;
    object-fit: contain;
  }
  
  /* Исправляем nav-bar чтобы он полностью раскрывался - все 55px высоты под top_bar */
  .nav-bar {
    overflow: visible !important;
    max-height: none !important;
  }
  
  /* Убеждаемся что nav-bar полностью раскрывается при скролле вверх */
  .nav-bar:not(.nav-bar-scrolled) {
    top: 74px !important; /* Полностью под top_bar - все 55px высоты видны */
  }
  
  .nav-bar.mobile-menu-open {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
  }
  
  .nav-bar.mobile-menu-open ul {
    display: flex !important;
    flex-direction: column !important;
    max-height: none !important;
    overflow: visible !important;
  }
  
  /* Для 1196px+: раскрываем dropdown меню при клике на icons-menu-btn */
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu {
    display: block !important;
    position: static !important;
    width: 100% !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    max-width: 100% !important;
    background: #fff !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li {
    padding: 8px 24px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    margin: 0 !important;
    list-style: none !important;
    border-bottom: 1px solid #e5e5e5 !important;
  }
  
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li:last-child {
    border-bottom: none !important;
  }
  
  .nav-bar.mobile-menu-open > ul > li.dropdown.dropdown-open > .dropdown-menu > li > a {
    color: #000000 !important;
    padding: 0 !important;
    font-size: 14px !important;
    display: block !important;
    width: 100% !important;
    white-space: normal !important;
    text-decoration: none !important;
  }
}

/* Обертка для top_bar с белым фоном на всю ширину при 1441px+ */
@media (min-width: 1441px) {
  .top_bar_wrapper {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: var(--top-bar-height, 90px);
    background: var(--color-white);
    z-index: 1001 !important; /* Выше nav-bar (1000), но ниже top_bar (1002) */
  }
  
  /* nav-bar должен быть ниже обертки при 1441px+ */
  .nav-bar {
    z-index: 1000 !important; /* Ниже top_bar_wrapper (1001) и top_bar (1002) */
  }
  
  .top_bar {
    position: relative;
    max-width: var(--page-width);
    width: 100%;
    margin: 0 auto;
    z-index: 1002 !important; /* Выше обертки (1001) и nav-bar (1000) */
  }
}

/* ============================================
   РАЗМЕР ШРИФТА ДЛЯ ACCORDION_INFO ПРИ 768px
   ============================================ */
@media (max-width: 768px) {
  .accordion_info,
  .accordion_header .accordion_info,
  h2.accordion_info {
    font-size: 20px !important;
  }
  
  .block17_accordion_info,
  .block17_accordion_header .block17_accordion_info,
  h2.block17_accordion_info {
    font-size: 20px !important;
  }
  
  .alumni_accordion_item .accordion_info,
  .alumni_accordion_item .accordion_header .accordion_info,
  .alumni_accordion_item h2.accordion_info {
    font-size: 20px !important;
  }
}

/* ============================================
   ФИНАЛЬНОЕ ПРАВИЛО: РАЗМЕР ШРИФТА ДЛЯ ACCORDION_INFO ПРИ 769px+
   Должно быть в самом конце файла для переопределения всех предыдущих правил
   ============================================ */
@media (min-width: 769px) {
  .accordion_info,
  .accordion_header .accordion_info,
  h2.accordion_info {
    font-size: 24px !important;
  }
  
  .block17_accordion_info,
  .block17_accordion_header .block17_accordion_info,
  h2.block17_accordion_info {
    font-size: 20px !important;
  }
  
  .alumni_accordion_item .accordion_info,
  .alumni_accordion_item .accordion_header .accordion_info,
  .alumni_accordion_item h2.accordion_info {
    font-size: 24px !important;
  }
}

/* ============================================
   ФИНАЛЬНОЕ ПРАВИЛО: СКРЫТИЕ КНОПКИ МЕНЮ НА 330px И МЕНЬШЕ
   Должно быть в самом конце файла для переопределения всех предыдущих правил
   ============================================ */
@media (max-width: 330px) {
  /* Кнопка меню не показывается даже при прокрутке вниз на 330px и меньше */
  .icons-menu-btn.visible,
  .top_bar .icons-menu-btn.visible {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    display: none !important;
    transform: translateX(20px) !important;
  }
}

/* ============================================
   ФИНАЛЬНОЕ ПРАВИЛО: СКРЫТИЕ teachers_navigation НА 768px И МЕНЬШЕ
   Должно быть в самом конце файла для переопределения всех предыдущих правил
   ============================================ */
@media (max-width: 768px) {
  .teachers_navigation,
  .block14_header .teachers_navigation,
  .block14_container .teachers_navigation,
  .block14 .teachers_navigation {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
  }
}

/* Emoji флаги для стран. Twemoji Country Flags — polyfill для Windows (Chrome/Edge) */
.phone_country_option .flag-emoji,
.phone_flag_selector .flag-emoji {
  font-family: "Twemoji Country Flags", "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
  font-size: 20px;
  line-height: 1;
  margin-right: 8px;
  display: inline-block;
  vertical-align: middle;
}