/*-----------------------------------*\
  #CATERING PAGE STYLES
\*-----------------------------------*/

.catering {
  padding-block: 0 100px;
  /* Убираем padding-top, так как margin-top уже добавлен в style.css */
}

.catering .container {
  margin-bottom: 50px;
}

.catering-content {
  text-align: center;
}

.catering .section-title {
  margin-block-end: 30px;
}

.catering .section-text,
.catering-content .section-text {
  margin-block-end: 30px;
  line-height: 1.8;
  color: var(--white, #fff);
}

.catering .contact-label {
  margin-block-end: 0;
  color: var(--white, #fff);
  font-size: var(--fontSize-label-1);
}

.catering .contact-number {
  color: var(--gold-crayola, #ffcd75);
  font-size: var(--fontSize-body-1);
  text-decoration: none;
  transition: var(--transition-1);
}

.catering .contact-number:hover {
  color: var(--gold-crayola, #ffcd75);
  opacity: 0.8;
}

/*-----------------------------------*\
  #CATERING SLIDER TITLES
\*-----------------------------------*/

.catering .container+h2.headline-3.text-center,
.catering .itc-slider+h2.headline-3.text-center {
  margin-bottom: 30px;
}

/*-----------------------------------*\
  #CATERING SLIDER
\*-----------------------------------*/

.catering .itc-slider {
  width: 100vw;
  max-width: 100vw;
  margin: 0;
  margin-bottom: 60px;
  padding: 0;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

.catering .itc-slider-wrapper {
  width: 100%;
  max-width: 100%;
  margin: 0;
}

/* На телефоне для кейтеринга - 2 слайда */
.catering .itc-slider-item {
  flex: 0 0 calc(50% - var(--gap) / 2);
  height: 854px;
}

/* На компьютере для кейтеринга - 3 слайда */
@media (min-width: 1200px) {
  .catering .itc-slider-item {
    flex: 0 0 calc(33.3333333333% - var(--gap) * 2 / 3);
  }
}

.catering .itc-slider-item img {
  width: 100%;
  height: 100%;
  max-width: 558.600px;
  max-height: 854px;
  object-fit: cover;
  border-radius: var(--radius-10, 10px);
  box-shadow: var(--shadow-2, 0 4px 8px rgba(0, 0, 0, 0.1));
}

.catering video {
  width: 100vw;
  max-width: 100%;
  margin: 50px 0 0;
  display: block;
  border-radius: 0;
  box-shadow: none;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

/*-----------------------------------*\
  #RESPONSIVE
\*-----------------------------------*/

@media (max-width: 767px) {
  .catering .itc-slider {
    margin: 0 auto 40px;
  }

  .catering h2.headline-3.text-center {
    margin-bottom: 20px;
  }

  .catering .itc-slider-item {
    height: auto;
    aspect-ratio: 558.600 / 854;
  }
}