.siti-banner__button img {
  vertical-align: middle;
  margin-left: 10px;
}

.zavod__title {
    font-family: Onest;
font-weight: 500;
font-style: Medium;
font-size: 42px;
leading-trim: NONE;
line-height: 105%;
letter-spacing: -3%;

}

.main_page_buttons_container a:first-child {
    display: none;
}

.siti-banner__logo {
  margin-top: 0;
}

.siti-banner__content {
  max-width: 560px;
}

.siti-banner {
  background-color: rgba(241, 243, 245, 1);
}

.siti-banner__title {
  font-family: Onest;
  font-weight: 500;
  font-style: Medium;
  font-size: 36px;
  leading-trim: NONE;
  line-height: 110.00000000000001%;
  letter-spacing: 0%;
  color: rgba(0, 16, 46, 1);
}
.main_page_buttons_container {
  margin-top: 48px;
}

.siti-zavod-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.siti-zavod-title {
  font-family: Onest;
  font-weight: 500;
  font-style: Medium;
  font-size: 42px;
  leading-trim: NONE;
  line-height: 105%;
  letter-spacing: -3%;
  color: rgba(0, 16, 46, 1);
  padding-bottom: 32px;
  padding-top: 40px;
  margin-top: 0;
}

/* =========================================== */
/* === СТИЛИ ДЛЯ БЛОКА "ФОТО ЗАВОДА" === */
/* =========================================== */

.siti-slider-section {
  background-color: #f7f9fb; /* Светлый фон секции */
  padding: 30px 0 50px 0;
}

.siti-slider-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.siti-slider-title {
  font-size: 30px;
  font-weight: bold;
  color: #333;
  margin-bottom: 20px;
}

/* --- ОСНОВНОЙ КОНТЕЙНЕР СЛАЙДЕРА --- */
.siti-image-slider {
  position: relative;
  /* Уменьшаем ширину, чтобы оставить место для стрелок */
  /* Теперь это наш основной блок для позиционирования стрелок относительно окна */
  max-width: 1200px; /* Сохраняем ширину контента */
  margin: 0 auto; /* Центрируем контент */
}

.siti-slider-track-viewport {
  overflow: hidden; /* Скрывает слайды, которые не помещаются в видимую область */
}

.siti-slider-track {
  display: flex;
  /* Важно: здесь JS будет управлять transform: translateX(...) для прокрутки */
  transition: transform 0.5s ease;
}

.siti-slider-slide {
  flex-shrink: 0; /* Слайды не должны сжиматься */
  padding: 0 10px; /* Отступ между слайдами */
  box-sizing: border-box;
}

.siti-factory-image {
  width: 100%;
  height: 469px;
  display: block;
  border-radius: 8px; /* Скругление углов изображения */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Легкая тень */
}

/* --- СТРЕЛКИ НАВИГАЦИИ --- */
.siti-slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  background-color: white;
  border: 1px solid rgba(0, 16, 46, 0.1);
  cursor: pointer;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: background-color 0.3s, border-color 0.3s;
}

.siti-slider-arrow:hover {
  background-color: #f0f0f0;
  border-color: #333;
}

.siti-arrow-prev {
  /* ПОЗИЦИОНИРОВАНИЕ ЛЕВОЙ СТРЕЛКИ ЗА КОНТЕЙНЕРОМ 1200PX */
  left: -60px; /* Сдвигаем влево на 60px (40px кнопка + 20px отступ) */

  /* УДАЛЕНО: transform: translateY(-50%); - это уже в .siti-slider-arrow */
}

.siti-arrow-next {
  /* ПОЗИЦИОНИРОВАНИЕ ПРАВОЙ СТРЕЛКИ ЗА КОНТЕЙНЕРОМ 1200PX */
  right: -60px; /* Сдвигаем вправо на 60px */

  /* УДАЛЕНО: margin-right: 20px; - заменено на right: -60px */
}

/* Стилизация иконки (CSS-стрелки) */
.siti-arrow-icon {
  width: 8px;
  height: 8px;
  border: solid #333;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
  /* Поворот для стрелок */
  transform: rotate(45deg);
}

.siti-arrow-left {
  transform: rotate(135deg);
  margin-left: 3px;
}

.siti-arrow-right {
  transform: rotate(-45deg);
  margin-right: 3px;
}

/* --- ТОЧКИ НАВИГАЦИИ --- */
.siti-slider-dots {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.siti-dot {
  width: 6px;
  height: 6px;
  background: rgba(0, 16, 46, 0.1);
  border-radius: 50%;
  margin: 0 7px;
  transition: background-color 0.3s;
}

.siti-dot.active {
  background: rgba(32, 87, 168, 1);
  width: 8px;
  height: 8px;
}

/* =========================================== */
/* === СТИЛИ ДЛЯ БЛОКА "ОПИСАНИЕ ПРОИЗВОДСТВА" === */
/* =========================================== */

/* --- ОСНОВНАЯ СЕКЦИЯ --- */
.siti-info-section {
  background-color: #f7f9fb; /* Светлый фон, как на скриншоте */
  padding: 50px 0;
}

.siti-info-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* --- ОБЩИЕ СТИЛИ ДЛЯ БЛОКОВ (КОЛОНОК) --- */
.siti-info-item {
  display: flex;
  justify-content: space-between;
  gap: 40px; /* Расстояние между колонками */
  margin-bottom: 74px; /* Отступ между первой и второй строкой */
}

/* --- КОЛОНКА С ИЗОБРАЖЕНИЕМ --- */
.siti-info-visual {
  flex: 0 0 50%; /* Фиксированная ширина 50% */
  max-width: 50%;
  overflow: hidden;
}

.siti-info-image {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: 8px; /* Скругленные углы у фото */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* --- КОЛОНКА С ТЕКСТОМ --- */
.siti-info-content {
  flex: 1 1 50%; /* Оставшаяся половина для текста */
  padding-top: 5px; /* Небольшой сдвиг, чтобы визуально выровнять с верхней частью фото */
  color: #333;
}

.siti-content-heading {
  font-family: Onest;
  font-weight: 500;
  font-style: Medium;
  font-size: 32px;
  leading-trim: NONE;
  line-height: 105%;
  letter-spacing: -3%;

  margin-bottom: 16px;
  margin-top: 16px;
  color: #333;
}

.siti-content-text {
  font-family: Onest;
  font-weight: 400;
  font-style: Regular;
  font-size: 18px;
  leading-trim: NONE;
  line-height: 140%;
  letter-spacing: 0%;

  margin-bottom: 15px;
}

/* --- СПЕЦИФИЧНЫЕ СТИЛИ ДЛЯ РЯДОВ --- */

/* 1. ПЕРВЫЙ РЯД (Фото слева, Текст справа) - Дефолтное поведение */

/* 2. ВТОРОЙ РЯД (Текст слева, Фото справа) - Инвертируем порядок */
.siti-layout-right {
  margin-top: 46px; /* Дополнительный отступ, чтобы не сливаться с первым блоком */
}

/* Стили для выравнивания текста во втором ряду */
.siti-layout-right .siti-info-content {
  padding-top: 0; /* Сбрасываем сдвиг */
}

/* --- ЗАГЛУШКА ВИДЕО (Нижняя часть скриншота) --- */
.siti-video-placeholder {
  margin-top: 50px;
  font-size: 24px;
  font-weight: bold;
  color: #333;
  padding: 10px 0;
  border-top: 1px solid #ddd;
}

/* =========================================== */
/* === СТИЛИ ДЛЯ БЛОКА "ВИДЕО С ПРОИЗВОДСТВА" === */
/* =========================================== */

.siti-video-section {
  background-color: #f7f9fb; /* Светлый фон, как и в других секциях */
  padding: 30px 0 120px 0;
}

.siti-video-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.siti-video-title {
  font-family: Onest;
  font-weight: 500;
  font-style: Medium;
  font-size: 36px;
  leading-trim: NONE;
  line-height: 105%;
  letter-spacing: -3%;

  color: rgba(0, 16, 46, 1);
  margin-bottom: 20px;
  text-align: left; /* Заголовок слева, как на скриншоте */
}

/* --- КОНТЕЙНЕР ВИДЕО --- */

.siti-video-wrapper {
  /* Центрируем блок */
  margin: 0 auto;

  /* Ограничиваем максимальную ширину видеоплеера, чтобы он не был слишком большим */
  max-width: 1200px; /* Установлена максимальная ширина 1200px */

  /* АДАПТИВНОСТЬ 1200x540 (45%) */
  position: relative;
  padding-bottom: 45%; /* (540 / 1200) * 100% = 45% */
  height: 0;

  /* Внешний вид, как на скриншоте */
  border-radius: 8px;
  overflow: hidden; /* Обрезает iframe по скругленным углам */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

/* --- IFRAME (ПЛЕЕР) --- */
.siti-video-iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* Стили для заглушки (если используется вместо iframe) */
.siti-video-placeholder-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* --- АДАПТИВНОСТЬ --- */
@media (max-width: 992px) {
  .siti-info-item {
    flex-direction: column; /* В одну колонку на планшетах */
    gap: 20px;
    margin-bottom: 40px;
  }

  .siti-info-visual {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .siti-info-content {
    flex: 1 1 100%;
    padding-top: 0;
  }

  /* Сбрасываем инверсию для второго ряда */
  .siti-layout-right {
    flex-direction: column;
    margin-top: 20px;
  }
}

/* --- АДАПТИВНОСТЬ --- */
@media (max-width: 768px) {
  .siti-slider-slide {
    width: 100%; /* На планшетах и мобильных показываем по 1 слайду */
  }

  .siti-image-slider {
    /* Убираем отрицательный margin */
    margin: 0;
  }

  .siti-arrow-prev {
    left: 5px;
    display: none;
  }

  .siti-arrow-next {
    right: 5px;
    display: none;
  }
}

@media (max-width: 575px) {
  .siti-zavod-title {
    padding-top: 24px;
    font-family: Onest;
    font-weight: 500;
    font-style: Medium;
    font-size: 28px;
    leading-trim: NONE;
    line-height: 105%;
    letter-spacing: -3%;
    margin-bottom: 0;
    padding-bottom: 24px;
  }
  .siti-banner__image-container {
    width: 100%;
    height: 100%;
  }

  .siti-banner__title {
    font-family: Onest;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: NONE;
    line-height: 110.00000000000001%;
    letter-spacing: 0%;
  }
  .main_page_buttons_container {
    margin-top: 16px;
  }
  .siti-factory-image {
    max-height: 280px;
  }
  .siti-slider-section {
    padding-top: 48px;
  }
  .siti-info-section {
    padding-top: 0;
    padding-bottom: 0;
  }
  .siti-info-item {
    gap: 0;
  }
  .siti-content-heading {
    font-family: Onest;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: NONE;
    line-height: 110.00000000000001%;
    letter-spacing: 0%;
  }
  .siti-content-text {
    font-family: Onest;
    font-weight: 400;
    font-style: Regular;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 140%;
    letter-spacing: 0%;
  }
  .siti-layout-right {
    margin-top: 0;
    margin-bottom: 0;
  }
  .siti-info-content {
    order: 1;
  }
  .siti-info-visual {
    max-height: 246px;
  }
  .siti-video-section {
    padding-top: 0;
    padding-bottom: 64px;
  }
  .siti-video-title {
    padding-top: 48px;
    margin-top: 0;
  }
  .siti-video-wrapper {
    padding-bottom: 75%;
    max-height: 300px;
    height: 100%;
  }
}
