/* ==========================================================================
   UDON — слой стилей для страницы, собранной на виджетах Elementor.
   Здесь только то, чего нет в настройках самих виджетов: анимация бегущей
   строки, витринный шрифт, горизонтальные ленты и скин формы Contact Form 7.
   Всё остальное (отступы, цвета, типографика, сетки) задано в Elementor.
   ========================================================================== */

:root {
  --udon-blue: #0000bc;
  --udon-blue-mid: #3865a5;
  --udon-navy: #2b2c7c;
  --udon-dark: #202020;
  --udon-gray-1: #bbb8b5;
}

/* Декор (бегущая строка, водяные знаки) намеренно шире экрана.
   Именно clip, а не hidden: hidden сделал бы body скролл-контейнером
   и сломал position: sticky у шапки. */
body { overflow-x: clip; }

/* Тема добавляет абзацам и спискам поля по 24px — в макете их нет,
   все расстояния заданы отступами самих виджетов. */
.elementor p,
.elementor ul,
.elementor ol,
.elementor dl,
.elementor dd,
.elementor figure,
.elementor table { margin: 0; }

/* Акцентное слово в заголовках секций */
.elementor-heading-title em {
  font-style: normal;
  color: var(--udon-blue);
}

/* Слайды каруселей кадрируются под высоту из макета */
.udon-carousel .swiper-slide-image {
  height: 460px;
  object-fit: cover;
}

/* Клоны слайдов для бесконечной прокрутки не должны растягивать страницу */
.udon-carousel .swiper,
.udon-carousel .elementor-image-carousel-wrapper { overflow: hidden; }

/* Стрелки — синие кружки справа в строке заголовка, как в макете.
   Виджет держит их внутри себя, поэтому поднимаем на высоту заголовка. */
.elementor .udon-carousel .elementor-swiper-button {
  /* Свои стили Elementor подключает после наших, поэтому позицию задаём жёстко */
  top: var(--udon-arrow-top, -92px) !important;
  bottom: auto !important;
  transform: none !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 32px;
  background: var(--udon-blue);
  transition: background-color .2s ease, opacity .2s ease;
}

.elementor .udon-carousel .elementor-swiper-button-prev { right: 48px !important; left: auto !important; }
.elementor .udon-carousel .elementor-swiper-button-next { right: 0 !important; left: auto !important; }
.elementor .udon-carousel .elementor-swiper-button:hover { background: #0000e0; }

/* Заголовок галереи — в одну строку, стрелки садятся выше */
.udon-carousel--gallery { --udon-arrow-top: -80px; }

/* Карточки локаций: значения — синие и крупнее подписи */
.udon-loc-card td { padding: 0 0 6px; border: 0; vertical-align: middle; }
.udon-loc-card td:first-child { width: 170px; padding-right: 12px; }

.udon-loc-card td strong {
  font-size: 24px;
  font-weight: 500;
  color: var(--udon-blue);
  white-space: nowrap;
}

/* Плашки формата: обводка и иконка в одну строку */
.udon-badge {
  padding: 8px 11px;
  border: 1px solid #c7c7c7;
  border-radius: 8px;
  background: #fff;
  white-space: nowrap;
}

/* Всё содержимое плашки строчное: из-за flex «м» и степень становились
   отдельными элементами и разъезжались. */
.udon-badge p { margin: 0; }
.udon-badge img { width: 16px; height: 16px; margin-right: 10px; vertical-align: -3px; }
.udon-badge sup { font-size: 10.32px; line-height: 0; vertical-align: super; }

/* Показатели в карточке формата */
.udon-figure { width: 240px; }
.udon-figure strong { font-size: 21px; font-weight: 500; color: var(--udon-blue); }
.udon-format-for p { margin-bottom: 10px; }
.udon-format-for ul { padding-left: 24px; list-style: disc; }

/* --------------------------------------------------------------------------
   Шапка — липнет к верху страницы
   -------------------------------------------------------------------------- */
/* Селектор с .elementor — иначе position перебивается стилями контейнера */
.elementor .udon-header {
  position: sticky;
  top: 0;
  z-index: 100;
  transition: box-shadow .25s ease;
}

.udon-header.is-stuck { box-shadow: 0 4px 20px rgba(4, 40, 92, .1); }

/* Точка под пунктом меню появляется при наведении */
.udon-nav .elementor-icon-list-icon { opacity: 0; transition: opacity .2s ease; }
.udon-nav .elementor-icon-list-item:hover .elementor-icon-list-icon { opacity: 1; }

/* --------------------------------------------------------------------------
   Бегущая строка. Текст в виджете продублирован, поэтому сдвиг
   на -50% замыкается бесшовно.
   -------------------------------------------------------------------------- */
.udon-marquee { overflow: hidden; user-select: none; }

.udon-marquee .elementor-heading-title {
  display: inline-block;
  width: max-content;
  font-family: 'Badeen Display', var(--udon-font, sans-serif);
  white-space: nowrap;
  /* Скорость вынесена в переменную — на узких экранах строка идёт медленнее */
  animation: udon-marquee-scroll var(--udon-marquee-speed, 45s) linear infinite;
}

@keyframes udon-marquee-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .udon-marquee .elementor-heading-title { animation: none; }
}

/* Витринная надпись, свисающая из-за края секции «Форматы» */
.udon-formats-decor .elementor-heading-title {
  font-family: 'Badeen Display', sans-serif;
  white-space: nowrap;
}

/* Водяной знак в «Кому подходит франшиза» отцентрован по секции со сдвигом
   вправо на 35px, как в макете (Elementor умеет привязку только к краю). */
.elementor .udon-audience-mark {
  left: calc(50% + 35px) !important;
  transform: translateX(-50%);
}

/* Карточки в первом экране — по ширине содержимого, как в макете
   (контейнеры Elementor по умолчанию тянутся на всю строку). */
.elementor .udon-hero-card {
  --width: auto;
  width: auto;
  flex: 0 0 auto;
}

/* Мозаика бренда: доли колонок заданы через flex-grow, поэтому база должна
   быть нулевой — иначе в пропорции вмешивается своя ширина картинок.
   Elementor подключает стили после наших, отсюда !important. */
.elementor .udon-brand-cell {
  flex-basis: 0 !important;
  min-width: 0;
}

.elementor .udon-brand-cell img {
  width: 100%;
  height: 340px;
  object-fit: cover;
}

/* Колонки секции «Почему» — 560 к 500, как в макете (Elementor умеет только
   равные доли; ширины он прокидывает через свою переменную). */
.udon-why-grid > .e-con-inner { --e-con-grid-template-columns: 600fr 480fr; }

/* Правая часть блока рейтинга занимает остаток строки, а не всю ширину */
.elementor .udon-rating-side {
  --width: auto;
  width: auto;
  flex: 1 1 auto;
  min-width: 0;
}

/* Стрелки ленты прессы отсчитываются от содержимого, а не от края экрана */
.udon-press-section > .e-con-inner { position: relative; }

.elementor .udon-lane-arrow {
  width: 40px;
  height: 40px;
  border-radius: 32px;
  background: var(--udon-blue);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color .2s ease, opacity .2s ease;
}

.elementor .udon-lane-arrow img { width: 24px; height: 24px; }
.elementor .udon-lane-prev img { transform: scaleX(-1); }
.elementor .udon-lane-arrow:hover { background: #0000e0; }

/* Край ленты достигнут — стрелка гаснет */
.elementor .udon-lane-arrow.is-disabled {
  opacity: .35;
  cursor: default;
  background: var(--udon-blue);
}

/* Счётчики в «О нас» стоят в колонках фиксированной ширины 260px */
.elementor .udon-counts { --e-con-grid-template-columns: 260px 260px !important; }

/* Контейнер макета: max-width 1160 включает поля по 20px, поэтому до 1440px
   полезная ширина — 1120. Elementor же вычитает поля снаружи. */
@media (max-width: 1439px) {
  .elementor .e-con-boxed > .e-con-inner { max-width: 1120px; }
}

/* --------------------------------------------------------------------------
   Горизонтальные ленты (пресса, отзывы) — тянутся мышью и колесом
   -------------------------------------------------------------------------- */
.elementor .udon-lane {
  flex-wrap: nowrap !important;
  /* Elementor задаёт контейнерам overflow позже наших стилей */
  overflow-x: auto !important;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  cursor: grab;
}

.udon-lane::-webkit-scrollbar { display: none; }
.udon-lane > .e-con { scroll-snap-align: start; }
.udon-lane.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }

/* --------------------------------------------------------------------------
   Аккордеон «Что получают партнёры» — плюс превращается в крестик
   -------------------------------------------------------------------------- */
/* В макете пункты разделяют только горизонтальные линии. Elementor задаёт
   рамку сразу на все стороны и подключает стили после наших. */
.elementor .udon-faq .elementor-accordion-item {
  border-left: 0 !important;
  border-right: 0 !important;
}

/* Иначе на стыке рамки соседних пунктов дают двойную линию */
.elementor .udon-faq .elementor-accordion-item + .elementor-accordion-item {
  border-top: 0 !important;
}

/* Обёртка заголовка — h3, поэтому приносит кегль и жирность темы */
.udon-faq .elementor-tab-title {
  margin: 0;
  font-size: 23px;
  font-weight: 500;
  line-height: 30px;
}

.udon-faq .elementor-accordion-icon svg { transition: transform .25s ease; }
.udon-faq .elementor-active .elementor-accordion-icon svg { transform: rotate(45deg); }
.udon-faq .elementor-tab-content ul { padding-left: 26px; list-style: disc; }
.udon-faq .elementor-tab-content p { margin-top: 18px; font-weight: 500; }

/* --------------------------------------------------------------------------
   Форма Contact Form 7 — повторяет поля из макета
   -------------------------------------------------------------------------- */
.udon-form .udon-cf7 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

/* CF7 склеивает поля в один <p> и добавляет <br> — раскрываем их,
   чтобы сами поля стали ячейками сетки. */
.udon-form .udon-cf7 br { display: none; }
.udon-form .udon-cf7 > p { display: contents; }
.udon-form .udon-cf7 .wpcf7-form-control-wrap { display: block; }

.udon-form .udon-cf7 input[type="text"],
.udon-form .udon-cf7 input[type="tel"],
.udon-form .udon-cf7 input[type="email"],
.udon-form .udon-cf7 select {
  width: 100%;
  height: 53px;
  padding: 16px 19px;
  border: 1px solid var(--udon-gray-1);
  border-radius: 6px;
  background: #fefefe;
  font-family: inherit;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--udon-dark);
  appearance: none;
}

.udon-form .udon-cf7 select {
  background-image: url('../img/icons/caret.svg');
  background-repeat: no-repeat;
  background-position: right 13px center;
  background-size: 17px 14px;
}

.udon-form .udon-cf7 input::placeholder { color: rgba(32, 32, 32, .5); }

.udon-form .udon-cf7 input:focus,
.udon-form .udon-cf7 select:focus {
  border-color: var(--udon-blue);
  outline: none;
}

/* Кнопка занимает вторую колонку сетки, как в макете */
.udon-form .udon-cf7 .wpcf7-submit {
  grid-column: 2;
  width: 100%;
  min-height: 54px;
  padding: 16px 34px;
  border: 0;
  border-radius: 12px;
  background: var(--udon-blue);
  font-family: inherit;
  font-size: 18px;
  font-weight: 800;
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease;
}

.udon-form .udon-cf7 .wpcf7-submit:hover { background: #0000e0; }

.udon-form .udon-cf7__consent {
  width: 320px;
  margin: 12px 0 0 auto;
  font-size: 12px;
  line-height: 1.24;
  text-align: right;
  color: var(--udon-dark);
}

.udon-form .wpcf7-spinner { display: block; margin: 8px auto 0; }
.udon-form .wpcf7-not-valid-tip { font-size: 12px; }

.udon-form .wpcf7-response-output {
  grid-column: 1 / -1;
  margin: 12px 0 0;
  font-size: 14px;
}

/* --------------------------------------------------------------------------
   Адаптив
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .udon-form .udon-cf7 { grid-template-columns: minmax(0, 1fr); }
  .udon-form .udon-cf7 .wpcf7-submit { grid-column: 1; }
  .udon-form .udon-cf7__consent { width: 100%; text-align: left; }
}

@media (max-width: 767px) {
  .udon-marquee .elementor-heading-title { font-size: 40px; }
}

/* ==========================================================================
   Адаптив
   Мобильного макета в Figma нет — раскладки повторяют адаптив исходной
   вёрстки лендинга. Elementor задаёт свои значения на уровне элемента,
   поэтому переопределения помечены !important.
   ========================================================================== */

/* --- До 1200px: абсолютные блоки первого экрана ужимаются --------------- */
@media (max-width: 1200px) {
  .udon-hero-photo { left: auto !important; right: -80px !important; width: 620px !important; }
  .udon-hero-logo { width: 190px !important; }
  .udon-hero-mark { display: none !important; }
  .udon-about-content { padding: 90px 40px 40px 320px !important; }
}

/* --- До 1024px: планшет -------------------------------------------------- */
@media (max-width: 1024px) {
  /* Вертикальный ритм: десктопные 90–100px на узких экранах читаются дырами */
  #menu, #brand, #finance, #why, #reviews, #partners,
  #gallery, #audience, #form { padding-top: 60px !important; }
  #about { padding-top: 32px !important; }
  #cta-line { padding-top: 40px !important; }
  #audience { padding-bottom: 24px !important; }
  #form { padding-bottom: 60px !important; }
  #press { margin-top: 60px !important; padding-block: 60px !important; }

  /* Первый экран: фото встаёт над текстом */
  #hero > .e-con-inner > .e-con { min-height: 0 !important; }
  .udon-hero-photo {
    position: relative !important;
    right: auto !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .udon-hero-photo img { width: 100%; height: 320px; object-fit: cover; }
  .udon-hero-logo { top: 24px !important; left: 24px !important; }
  .udon-hero-box > .e-con { padding: 40px !important; }
  .udon-hero-box .elementor-heading-title { font-size: 32px; }

  /* Секционные заголовки */

  /* О нас: фото убираем, текст занимает всю ширину */
  .udon-about-photo { display: none !important; }
  .udon-about-content { padding: 60px 40px !important; }
  #about .e-con[style], #about .udon-about-content { min-height: 0; }
  .elementor .udon-counts { --e-con-grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 32px 24px !important; }

  /* Сетки карточек */
  .udon-finance-grid { --e-con-grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .udon-why-grid > .e-con-inner { --e-con-grid-template-columns: minmax(0, 1fr) !important; gap: 40px !important; }
  .udon-audience-lists { --e-con-grid-template-columns: minmax(0, 1fr) !important; gap: 12px !important; }

  /* Бегущая строка и декоративная надпись */
  .udon-marquee .elementor-heading-title { font-size: 44px !important; line-height: 64px !important; }
  .udon-formats-decor .elementor-heading-title { font-size: 44px !important; line-height: 64px !important; }
  .udon-formats-decor { margin-top: -24px !important; }

  .elementor .udon-brand-cell img { height: 200px !important; }
  .udon-audience-mark { width: 700px !important; }

  /* Блок рейтинга: в одну строку он не помещается — разрешаем перенос */
  #reviews > .e-con-inner > .e-con:first-child {
    flex-wrap: wrap !important;
    min-height: 0 !important;
    padding: 30px !important;
    row-gap: 20px;
  }

  .elementor .udon-rating-side { flex: 1 1 100% !important; }

  .udon-faq .elementor-tab-title { font-size: 19px; line-height: 26px; }

  /* Форма: руки и волна только мешают тексту */
  .udon-form-hands, .udon-form-wave, .udon-form-logo { display: none !important; }
  .udon-form-aside { position: static !important; width: auto !important; padding: 40px 40px 0 !important; }
  .udon-form-body { padding: 40px !important; }
  .udon-form .e-con[class*="e-con"] { min-height: 0; }
}

/* --- До 900px: форматы в одну колонку ----------------------------------- */
@media (max-width: 900px) {
  .udon-formats-grid { --e-con-grid-template-columns: minmax(0, 1fr) !important; }
}

/* --- До 767px: мобильный ------------------------------------------------- */
@media (max-width: 767px) {
  .udon-hero-box .elementor-heading-title { font-size: 26px !important; }
  .udon-hero-box > .e-con { padding: 28px !important; }
  .udon-hero-logo { width: 130px !important; }

  /* Кнопки и карточки первого экрана — в колонку на всю ширину */
  .udon-hero-box .e-con > .elementor-widget-button { width: 100%; }
  .udon-hero-box .elementor-button { width: 100%; justify-content: center; }
  .elementor .udon-hero-card { width: 100% !important; }

  .udon-marquee .elementor-heading-title { font-size: 32px !important; line-height: 48px !important; }

  /* Мозаика бренда: по две плитки в ряд */
  #brand .e-con > .e-con { flex-wrap: wrap !important; }
  .elementor .udon-brand-cell { flex: 1 1 calc(50% - 5px) !important; }
  .elementor .udon-brand-cell img { height: 170px !important; }

  /* Крупные кнопки-призывы тянутся по ширине */
  #finance .elementor-button, #press .elementor-button,
  #cta-line .elementor-button { width: 100%; justify-content: center; }
  #cta-line { flex-direction: column !important; align-items: stretch !important; }

  .udon-format-for, .udon-figure { width: auto !important; }
  .udon-form-body, .udon-form-aside { padding-inline: 24px !important; }
}

/* --- До 600px: одна колонка там, где две уже тесны ---------------------- */
@media (max-width: 600px) {
  .udon-finance-grid { --e-con-grid-template-columns: minmax(0, 1fr) !important; }
  .elementor .udon-counts { --e-con-grid-template-columns: minmax(0, 1fr) !important; gap: 24px !important; }
}

/* --- До 480px: телефон --------------------------------------------------- */
@media (max-width: 480px) {
  #menu, #brand, #finance, #why, #reviews, #partners,
  #gallery, #audience, #form { padding-top: 44px !important; }
  #about { padding-top: 24px !important; }
  #cta-line { padding-top: 32px !important; }
  #press { margin-top: 44px !important; padding-block: 44px !important; }

  .udon-hero-box .elementor-heading-title { font-size: 22px !important; }
  .udon-hero-photo img { height: 240px; }


  .udon-marquee .elementor-heading-title { font-size: 26px !important; line-height: 40px !important; }
  .udon-formats-decor .elementor-heading-title { font-size: 34px !important; line-height: 48px !important; }
  .udon-formats-decor { margin-top: -14px !important; }

  .elementor .udon-brand-cell img { height: 140px !important; }
  .udon-about-content { padding: 40px 24px !important; }
  .udon-counts .elementor-counter-number-wrapper { font-size: 30px !important; }
  .udon-faq .elementor-tab-title { font-size: 17px; line-height: 24px; }
}

/* --- Шапка на узких экранах: меню уходит в бургер ------------------------ */
.udon-burger { display: none; cursor: pointer; }

@media (max-width: 900px) {
  .udon-burger { display: block; }
  .udon-header > .e-con-inner { position: relative; }

  /* Панель меню раскрывается под шапкой */
  .elementor .udon-nav {
    position: absolute;
    top: 100%;
    left: -20px;
    right: -20px;
    z-index: 20;
    display: none;
    width: auto !important;
    padding: 12px 20px 20px;
    background: #fff;
    box-shadow: 0 12px 24px rgba(4, 40, 92, .12);
  }

  .elementor .udon-nav.is-open { display: block; }

  /* В панели пункты идут столбцом */
  .udon-nav .elementor-inline-items { display: block; }
  .udon-nav .elementor-inline-item { display: block; margin: 0; padding: 12px 0; }
  .udon-nav .elementor-icon-list-icon { opacity: 1; }
}

/* Высота снимка в первом экране задана виджетом, поэтому !important */
@media (max-width: 1024px) {
  .elementor .udon-hero-photo img { height: 320px !important; }
}

@media (max-width: 480px) {
  .elementor .udon-hero-photo img { height: 240px !important; }
}

/* Шапка должна оставаться в одну строку: она липкая и не должна съедать экран */
@media (max-width: 900px) {
  .udon-header .elementor-widget-image { width: auto; }
  .udon-header .elementor-widget-image img { width: 140px; }
  .udon-header .elementor-button { padding: 12px 20px; font-size: 15px; }
}

@media (max-width: 480px) {
  /* Кнопка уступает место логотипу и бургеру — призывов хватает по странице */
  .udon-header .elementor-widget-button { display: none; }
  .udon-header .elementor-widget-image img { width: 130px; }
}

/* --- Мобильные доводки ---------------------------------------------------- */
@media (max-width: 900px) {
  /* Панель меню должна занимать всю ширину экрана, а не колонку контента */
  .elementor .udon-nav { right: auto; width: calc(100% + 40px) !important; }
}

@media (max-width: 767px) {
  /* Карточки локаций: в узкой колонке подписи занимали половину строки */
  .udon-loc-card td:first-child { width: 48%; padding-right: 10px; }
  .udon-loc-card td strong { font-size: 20px; white-space: normal; }

  /* Стрелки остаются, но переезжают в собственную строку над слайдами:
     заголовок на мобильном многострочный, и на его линии им уже не хватает места. */
  .elementor .udon-carousel { margin-top: 72px !important; }
  .udon-carousel, .udon-carousel--gallery { --udon-arrow-top: -56px; }

  /* Стрелки ленты прессы встают в поток — она лежит прямо перед слайдами.
     Отступ сверху обязателен: иначе кнопки прижимаются к тексту вплотную. */
  .elementor .udon-lane-nav {
    position: static !important;
    align-self: flex-end;
    margin-top: 40px;
    margin-bottom: 0;
  }

  /* Иконка аккордеона не должна прижиматься к тексту вопроса */
  .udon-faq .elementor-accordion-icon { margin-left: 12px; }
}

/* --- Первый экран на узких экранах: снимок растворяется в фоне ----------- */
@media (max-width: 1024px) {
  .udon-hero-photo { position: relative !important; }

  /* Низ снимка уводим в цвет подложки, иначе граница фото читается резко */
  .udon-hero-photo::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 140px;
    background: linear-gradient(180deg, rgba(56, 101, 165, 0) 0%, var(--udon-blue-mid) 100%);
    pointer-events: none;
  }

  /* Подзаголовок должен оставаться мельче заголовка */
  .udon-hero-box .elementor-widget-text-editor,
  .udon-hero-box .elementor-widget-text-editor p { font-size: 20px; }
}

@media (max-width: 767px) {
  .udon-hero-box .elementor-widget-text-editor,
  .udon-hero-box .elementor-widget-text-editor p { font-size: 18px; }
}

/* --- Бегущая строка на узких экранах: крупнее и спокойнее ---------------- */
@media (max-width: 1024px) {
  .udon-marquee { --udon-marquee-speed: 60s; }
  .udon-marquee .elementor-heading-title { font-size: 52px !important; line-height: 76px !important; }
}

@media (max-width: 767px) {
  /* На узком экране за раз видно меньше текста, поэтому замедляем сильнее */
  .udon-marquee { --udon-marquee-speed: 75s; }
  .udon-marquee .elementor-heading-title { font-size: 44px !important; line-height: 64px !important; }
}

@media (max-width: 480px) {
  .udon-marquee { --udon-marquee-speed: 90s; }
  .udon-marquee .elementor-heading-title { font-size: 38px !important; line-height: 56px !important; }
}

/* --- Волна в «О нас»: на узких экранах фото убрано, и она повисала в пустоте.
   Уводим её в левый нижний угол блока, за край — как фоновый штрих. -------- */
@media (max-width: 1024px) {
  .elementor .udon-about-wave {
    top: auto !important;
    bottom: -150px !important;
    left: -180px !important;
    /* Шире блока: иначе виден обрыв линий внутри карточки */
    width: 760px !important;
    max-width: none !important;
  }
}

@media (max-width: 480px) {
  .elementor .udon-about-wave {
    bottom: -130px !important;
    left: -150px !important;
    width: 640px !important;
  }
}

/* --- Пропорции слайдов и подзаголовок бренда на узких экранах ------------- */
@media (max-width: 1024px) {
  /* Десктопные 460px при узком слайде дают сильно вытянутый кадр */
  .udon-carousel .swiper-slide-image { height: 380px; }

  /* Подзаголовок бренда крупный по макету — на мобильном он перебивал заголовок */
  .udon-brand-lead, .udon-brand-lead p { font-size: 24px !important; line-height: 1.15 !important; }
}

@media (max-width: 767px) {
  .udon-carousel .swiper-slide-image { height: 340px; }
  .udon-brand-lead, .udon-brand-lead p { font-size: 20px !important; }
}

@media (max-width: 480px) {
  .udon-carousel .swiper-slide-image { height: 300px; }
  .udon-brand-lead, .udon-brand-lead p { font-size: 18px !important; }
}

/* ==========================================================================
   Единый вертикальный ритм между секциями.
   Раньше значения жили в каждой секции по отдельности и складывались с
   отступом внутреннего контейнера — промежутки гуляли от 26 до 278px.
   Теперь расстояние задаётся одной переменной, внутренний контейнер обнулён.
   ========================================================================== */
:root { --udon-section-gap: 100px; }
@media (max-width: 1024px) { :root { --udon-section-gap: 72px; } }
@media (max-width: 767px)  { :root { --udon-section-gap: 56px; } }
@media (max-width: 480px)  { :root { --udon-section-gap: 44px; } }

/* Обычные секции: отступ сверху, снизу его даёт следующая секция */
#about, #menu, #brand, #finance, #why, #reviews,
#cta-line, #partners, #gallery, #audience, #form {
  padding-top: var(--udon-section-gap) !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
}

#about > .e-con-inner, #menu > .e-con-inner, #finance > .e-con-inner,
#why > .e-con-inner, #reviews > .e-con-inner, #cta-line > .e-con-inner,
#partners > .e-con-inner, #gallery > .e-con-inner, #audience > .e-con-inner,
#form > .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Форма — последний блок перед подвалом, поэтому отступ снизу нужен ей самой */
#form { padding-bottom: var(--udon-section-gap) !important; }

/* Секции с собственным фоном: снаружи отступ отделяет плашку от соседей,
   внутри — даёт воздух её содержимому. У «Форматов» сверху его нет:
   надпись по макету свисает с верхнего края. */
#formats {
  margin-top: var(--udon-section-gap) !important;
  padding-top: 0 !important;
  padding-bottom: var(--udon-section-gap) !important;
}

#press {
  margin-top: var(--udon-section-gap) !important;
  padding-top: var(--udon-section-gap) !important;
  padding-bottom: var(--udon-section-gap) !important;
}

#press > .e-con-inner { padding-top: 0 !important; padding-bottom: 0 !important; }

/* Фон «Прессы» совпадает с фоном страницы, поэтому её внутренние поля
   читаются не как воздух внутри плашки, а как лишняя пустота между блоками.
   Ведём секцию как обычную: один отступ сверху, снизу его даёт соседняя. */
#press {
  margin-top: 0 !important;
  padding-top: var(--udon-section-gap) !important;
  padding-bottom: 0 !important;
}

/* Стрелки ленты — на линии заголовка справа. Раньше отступ был задан числом
   под старые поля секции и после их правки увёл стрелки под слайды. */
.elementor .udon-lane-nav { top: 0 !important; }

@media (max-width: 767px) {
  .elementor .udon-lane-nav { top: auto !important; }
}

/* Руки выступают на 94px над плашкой формы и съедают отступ от предыдущей
   секции: до плашки 100px, а до самих рук оставалось 6px. Компенсируем
   вынос, чтобы видимый зазор совпал с общим шагом. На узких экранах руки
   скрыты, поэтому правило только для десктопа. */
@media (min-width: 1025px) {
  #form { padding-top: calc(var(--udon-section-gap) + 94px) !important; }
}

/* ==========================================================================
   Единый кегль заголовков на узких экранах.
   Прежнее правило перечисляло секции поимённо, и «Экономика», «Пресса»,
   «Партнёры», «Галерея» и «Кому подходит» остались с десктопными 36px —
   на их фоне главный заголовок выглядел мелким. Десктоп не трогаем.
   ========================================================================== */
@media (max-width: 1024px) { :root { --udon-h1: 32px; --udon-h2: 28px; } }
@media (max-width: 767px)  { :root { --udon-h1: 26px; --udon-h2: 24px; } }
@media (max-width: 480px)  { :root { --udon-h1: 24px; --udon-h2: 22px; } }

@media (max-width: 1024px) {
  .udon-section-title .elementor-heading-title {
    font-size: var(--udon-h2) !important;
    line-height: 1.18 !important;
  }

  /* Главный заголовок страницы — на ступень крупнее заголовков секций */
  #hero .elementor-heading-title {
    font-size: var(--udon-h1) !important;
    line-height: 1.1 !important;
  }
}

/* Знак под списком в «Почему» на мобильном повисает в пустой колонке —
   на десктопе он уравновешивает правый блок, здесь просто занимает место. */
@media (max-width: 767px) {
  .udon-why-logo { display: none !important; }
}

/* Промо-карточка в «Почему»: на узком экране её заголовки оставались
   десктопными и спорили с заголовками секций, а нижняя строка при
   межстрочном 1.1 наезжала на снимок. */
@media (max-width: 767px) {
  .udon-why-cta-title .elementor-heading-title { font-size: 24px !important; line-height: 30px !important; }
  .udon-why-cta-text .elementor-heading-title { font-size: 18px !important; line-height: 1.25 !important; }
  .udon-why-cta-title, .udon-why-cta-text { padding-inline: 8px; }
}

@media (max-width: 480px) {
  .udon-why-cta-title .elementor-heading-title { font-size: 22px !important; line-height: 28px !important; }
  .udon-why-cta-text .elementor-heading-title { font-size: 16px !important; }
}

/* Блок рейтинга на мобильном: на десктопе это одна строка из четырёх частей,
   при переносе каждая сохраняла своё выравнивание — звёзды по центру, число
   слева, «Все отзывы» справа, у счётчиков вертикальная линия сбоку.
   Собираем в одну колонку по левому краю. */
@media (max-width: 767px) {
  #reviews > .e-con-inner > .e-con:first-child {
    flex-direction: column !important;
    align-items: stretch !important;
    row-gap: 14px !important;
  }

  #reviews > .e-con-inner > .e-con:first-child .elementor-widget-image,
  #reviews > .e-con-inner > .e-con:first-child .elementor-widget-heading,
  #reviews > .e-con-inner > .e-con:first-child .elementor-widget-text-editor {
    text-align: left !important;
  }

  /* Линия-разделитель уместна только в горизонтальной раскладке */
  #reviews > .e-con-inner > .e-con:first-child > .e-con {
    border-left: 0 !important;
    padding-left: 0 !important;
    row-gap: 4px;
  }

  /* Логотип Яндекс Карт и ссылка встают к левому краю, как и всё остальное */
  .elementor .udon-rating-side > .e-con { justify-content: flex-start !important; }
  .elementor .udon-rating-side { align-items: flex-start !important; }
}

/* Звёзды в карточках отзывов — по левому краю, как текст и автор рядом.
   Виджет изображения по умолчанию центрует содержимое. */
#reviews .udon-lane .elementor-widget-image { text-align: left; }