/* --- Секция: Перевозим с заботой (Cargo Care) --- */
section.cargo-care {
  background-color: #F7FBFF;
  /* Очень светлая ледяная основа */
  padding: 80px 0;
  position: relative;
  overflow: hidden;

  /* 4 разбросанные снежинки на правой стороне + мягкие градиенты базы */
  background-image:
    /* Снежинка 1: крупная */
    url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%239ac0e6' stroke-width='8' stroke-linecap='round' transform='translate(100,100)' opacity='0.7'%3E%3Cg id='s'%3E%3Cline x1='0' y1='0' x2='0' y2='-80'/%3E%3Cline x1='0' y1='-40' x2='20' y2='-60'/%3E%3Cline x1='0' y1='-40' x2='-20' y2='-60'/%3E%3C/g%3E%3Cuse href='%23s' transform='rotate(60)'/%3E%3Cuse href='%23s' transform='rotate(120)'/%3E%3Cuse href='%23s' transform='rotate(180)'/%3E%3Cuse href='%23s' transform='rotate(240)'/%3E%3Cuse href='%23s' transform='rotate(300)'/%3E%3C/g%3E%3C/svg%3E"),
    /* Снежинка 2: средняя, справа в центре */
    url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%2382b3e2' stroke-width='9' stroke-linecap='round' transform='translate(100,100)' opacity='0.85'%3E%3Cg id='s'%3E%3Cline x1='0' y1='0' x2='0' y2='-80'/%3E%3Cline x1='0' y1='-40' x2='20' y2='-60'/%3E%3Cline x1='0' y1='-40' x2='-20' y2='-60'/%3E%3C/g%3E%3Cuse href='%23s' transform='rotate(60)'/%3E%3Cuse href='%23s' transform='rotate(120)'/%3E%3Cuse href='%23s' transform='rotate(180)'/%3E%3Cuse href='%23s' transform='rotate(240)'/%3E%3Cuse href='%23s' transform='rotate(300)'/%3E%3C/g%3E%3C/svg%3E"),
    /* Снежинка 3: маленькая */
    url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%237aaee0' stroke-width='10' stroke-linecap='round' transform='translate(100,100)' opacity='0.9'%3E%3Cg id='s'%3E%3Cline x1='0' y1='0' x2='0' y2='-80'/%3E%3Cline x1='0' y1='-40' x2='20' y2='-60'/%3E%3Cline x1='0' y1='-40' x2='-20' y2='-60'/%3E%3C/g%3E%3Cuse href='%23s' transform='rotate(60)'/%3E%3Cuse href='%23s' transform='rotate(120)'/%3E%3Cuse href='%23s' transform='rotate(180)'/%3E%3Cuse href='%23s' transform='rotate(240)'/%3E%3Cuse href='%23s' transform='rotate(300)'/%3E%3C/g%3E%3C/svg%3E"),
    /* Снежинка 4: средняя внизу справа */
    url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%239ac0e6' stroke-width='8' stroke-linecap='round' transform='translate(100,100)' opacity='0.8'%3E%3Cg id='s'%3E%3Cline x1='0' y1='0' x2='0' y2='-80'/%3E%3Cline x1='0' y1='-40' x2='20' y2='-60'/%3E%3Cline x1='0' y1='-40' x2='-20' y2='-60'/%3E%3C/g%3E%3Cuse href='%23s' transform='rotate(60)'/%3E%3Cuse href='%23s' transform='rotate(120)'/%3E%3Cuse href='%23s' transform='rotate(180)'/%3E%3Cuse href='%23s' transform='rotate(240)'/%3E%3Cuse href='%23s' transform='rotate(300)'/%3E%3C/g%3E%3C/svg%3E"),
    /* Базовые градиенты (оставляем для глубины) */
    radial-gradient(circle at 0% 0%, #ffffff 0%, transparent 50%),
    radial-gradient(circle at 100% 100%, #EAF5FC 0%, transparent 60%);

  background-position:
    right 5% top -40px,
    /* Снежинка 1 */
    right -20px top 40%,
    /* Снежинка 2 */
    right 18% bottom 30%,
    /* Снежинка 3 */
    right 5% bottom -20px,
    /* Снежинка 4 */
    0 0,
    100% 100%;

  background-size:
    220px 220px,
    /* Снежинка 1 (крупная) */
    140px 140px,
    /* Снежинка 2 */
    70px 70px,
    /* Снежинка 3 (мелкая) */
    110px 110px,
    /* Снежинка 4 */
    auto,
    auto;

  background-repeat: no-repeat;
}

/* Premium Tech / Cold-Chain Background Effects */
section.cargo-care::before,
section.cargo-care::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  opacity: 0.6;
  /* Очень низкая прозрачность для тонкого эффекта */
}

/* Обширная зона свежести слева */
section.cargo-care::before {
  width: 800px;
  height: 800px;
  top: -200px;
  left: -300px;
  background: radial-gradient(circle, #EAF5FC 0%, transparent 70%);
  filter: blur(80px);
}

/* Более насыщенный "ледяной" glow вокруг слайдера справа */
section.cargo-care::after {
  width: 900px;
  height: 900px;
  top: 10%;
  right: -250px;
  background: radial-gradient(circle, #DDEFFC 0%, rgba(200, 230, 255, 0.4) 40%, transparent 70%);
  filter: blur(100px);
}

.cargo-care__container {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  position: relative;
  z-index: 1;
}

/* Левая часть (Информация) */
.cargo-care__info {
  width: 40%;
  flex-shrink: 0;
}

.cargo-care__title {
  font-size: 32px;
  font-weight: 700;
  color: #102a45;
  margin-top: 0;
  margin-bottom: 15px;
  line-height: 1.2;
  position: relative;
  padding-left: 15px;
}

.cargo-care__title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 5px;
  bottom: 5px;
  width: 4px;
  background-color: #e01a22;
  /* Красная линия слева */
  border-radius: 2px;
}

.cargo-care__desc {
  font-size: 15px;
  color: #4a5c72;
  line-height: 1.5;
  margin-bottom: 15px;
}

@media (width >=1385px) {
  .cargo-care__desc {
    margin-bottom: 30px;
  }
}

.cargo-care__features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 15px;
}

.cargo-care__features li {
  display: flex;
  flex-direction: column;
  /* Иконка сверху, текст снизу */
  align-items: center;
  /* Центрируем по горизонтали */
  text-align: center;
  gap: 8px;
  flex: 1;
  background: #ffffff;
  /* Белые карточки */
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 14px 10px;
  border-radius: 16px;
  box-shadow: 0 4px 15px rgba(23, 94, 168, 0.03);
  transition: all 0.3s ease;
  cursor: default;
}

.cargo-care__features li:hover {
  transform: translateY(-5px);
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 10px 25px rgba(23, 94, 168, 0.08);
}

.cargo-care__feature-icon {
  width: 46px;
  height: 46px;
  background: linear-gradient(135deg, #e3f0fb 0%, #c4def6 100%);
  /* Мягкий градиент для кружка */
  color: #175ea8;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(23, 94, 168, 0.1);
  transition: transform 0.3s ease;
}

.cargo-care__features li:hover .cargo-care__feature-icon {
  transform: scale(1.08);
}

.cargo-care__features span {
  font-size: 13px;
  color: #3b4d61;
  line-height: 1.3;
  margin: 0;
  font-weight: 500;
}

/* Правая часть (Слайдер) */
.cargo-care__slider-wrapper {
  width: 60%;
  position: relative;
  /* Разрешаем карточкам выходить за правый край контейнера */
  min-width: 0;
}

.cargo-care__slider {
  padding-bottom: 40px !important;
  /* Место под пагинацию */
  /* Отрезаем слева (чтобы не наезжало на текст при свайпе), но оставляем всё справа */
  clip-path: inset(-50px -100vw -50px -15px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
}

.cargo-care__slider.swiper-initialized {
  opacity: 1;
  visibility: visible;
  overflow: visible !important;
  /* Чтобы карточки за краем были видны */
}

.cargo-care__slider .swiper-slide {
  height: auto;
  /* Чтобы все слайды были одинаковой высоты */
}

/* Карточка слайдера */
.cargo-care__card {
  background-color: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 5px 20px rgba(16, 42, 69, 0.05);
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: all 0.3s ease;
  cursor: pointer;
}

.cargo-care__card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 30px rgba(16, 42, 69, 0.1);
}

.cargo-care__card-img {
  width: 100%;
  padding-bottom: 75%;
  /* Пропорция 4:3 */
  position: relative;
  height: 0;
  flex-shrink: 0;
  overflow: hidden;
  /* Чтобы при увеличении картинка не вылезала за края */
}

.cargo-care__card-img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.cargo-care__card:hover .cargo-care__card-img img {
  transform: scale(1.05);
}

.cargo-care__card-content {
  padding: 15px 15px;
  display: flex;
  align-items: center;
  gap: 15px;
  flex-grow: 1;
}

.cargo-care__card-icon {
  width: 45px;
  height: 45px;
  background-color: #f2f7fb;
  color: #175ea8;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}

.cargo-care__card-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.cargo-care__card-title {
  font-size: 16px;
  font-weight: 700;
  color: #102a45;
  margin: 0;
}

.cargo-care__card-temp {
  font-size: 13.5px;
  font-weight: 500;
  color: #6c757c;
  margin: 0;
}

/* Навигация (стрелки) */
.cargo-care__nav {
  position: absolute;
  /* top считается от .cargo-care__slider-wrapper
     Слайдер имеет padding-bottom 40px под пагинацию,
     поэтому центр карточек = (100% - 40px) / 2 */
  top: calc((100% - 40px) / 2);
  transform: translateY(-50%);

  /* Магическая формула: мы находимся внутри враппера, который упирается в край контейнера.
     Контейнер имеет отступ от края экрана = max(var(--container-padding), 50vw - 680px).
     Чтобы прижать стрелку к правому краю экрана (с отступом 20px), мы выталкиваем её 
     на ширину этого отступа минус 20px. */
  right: calc(-1 * max(var(--container-padding), 50vw - 680px) + 20px);

  z-index: 10;
  pointer-events: none;
}

.cargo-care__next {
  width: 56px;
  height: 56px;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #175ea8;
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(23, 94, 168, 0.15);
  pointer-events: auto;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  /* Плавная "дорогая" анимация */
}

.cargo-care__next:hover {
  background-color: #175ea8;
  color: #fff;
  box-shadow: 0 12px 28px rgba(23, 94, 168, 0.3);
  transform: scale(1.08) translateX(3px);
  /* Легкое увеличение и сдвиг в сторону свайпа */
}

/* Скрываем стрелку, если долистали до конца */
.cargo-care__next.swiper-button-disabled {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.8);
}

/* Пагинация (точки) */
.cargo-care__slider-wrapper .swiper-pagination {
  bottom: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  /* Центрируем под слайдером */
  padding-left: 0;
  width: 100%;
}

.cargo-care__slider-wrapper .swiper-pagination-bullet {
  background-color: #b0cbe8;
  opacity: 1;
  width: 8px;
  height: 8px;
  margin: 0 5px !important;
  transition: all 0.3s ease;
}

.cargo-care__slider-wrapper .swiper-pagination-bullet-active {
  background-color: #007bff;
  /* Яркий синий как в дизайне */
  width: 10px;
  height: 10px;
}

/* Адаптивность */
@media (max-width: 1200px) {
  .cargo-care__container {

    /* Увеличиваем отступ, чтобы слайдер отъехал вправо */
  }

  .cargo-care__slider-wrapper {
    width: 50%;
    /* Отдаем больше места левому блоку с текстом */
  }

  .cargo-care__features {
    flex-wrap: wrap;
  }

  .cargo-care__features li {
    width: 45%;
  }
}

@media (max-width: 1100px) {
  section.cargo-care {
    padding: 60px 0;
  }

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

  .cargo-care__info {
    width: 100%;
  }

  .cargo-care__slider-wrapper {
    width: 100%;
    margin-right: 0;
    margin-top: 20px;
  }

  .cargo-care__slider {
    overflow: hidden !important;
    /* На планшетах обрезаем */
  }

  .cargo-care__nav {
    display: flex;
    /* Возвращаем на планшетах */
  }
}

@media (max-width: 576px) {
  section.cargo-care {
    padding: 35px 0;
  }

  .cargo-care__title {
    font-size: 24px;
  }

  .cargo-care__features {
    flex-direction: column;
  }

  .cargo-care__features li {
    width: 100%;
    flex-direction: row;
    text-align: left;
  }

  .cargo-care__features span {
    font-size: 16px;
  }

  .cargo-care__features li:nth-child(3) {
    display: none;
  }

  .cargo-care__prev {
    display: none !important;
  }

  .cargo-care__next {
    display: flex !important;
    right: 5px !important;
    pointer-events: auto;
    animation: pulse-arrow 2.5s infinite ease-in-out !important;
  }

  .cargo-care__slider.has-swiped~.cargo-care__nav .cargo-care__next,
  .cargo-care__slider.has-swiped~.cargo-care__nav .cargo-care__prev {
    display: none !important;
  }
}