/* Общие правки для экранов <= 768px */
@media (max-width: 768px) {

  /* чтобы не было горизонтального скролла */
  body, html {
    overflow-x: hidden;
  }

  /* контейнеры у них местами узкие/жёсткие */
  .container,
  .row,
  .wrapper,
  .download-dist,
  .download-dist-specification {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* верхняя шапка – чтобы иконки не налезали */
  .header .search-row,
  .header .header-link {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  /* меню – иногда уезжает вправо */
  .navbar.navbar-default {
    width: 100% !important;
  }

  /* главный блок загрузок на /download – в колонку */
  .download-dist .download-dist-specification {
    display: block !important;
  }

  .download-dist .download-dist-specification .download-dist-specification-item {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 15px;
  }

  /* кнопки "Завантажити" – на всю ширину */
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn a,
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn button,
  .yellow-btn,
  .main-btn {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-top: 10px;
  }

  /* их слайдерные стрелки не нужны на мобиле */
  .download-dist-specification .slick-prev,
  .download-dist-specification .slick-next {
    display: none !important;
  }

  /* блок с картой/регионами, который у нас был пустой – не мешать */
  .main-map,
  .main-map-mob,
  .regions,
  .regions-mobi {
    max-width: 100% !important;
  }

  /* футер – в столбец */
  footer .row,
  .footer,
  .footer .col-md-3,
  .footer .col-md-4,
  .footer .col-md-6 {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* очень узкие (например, iPhone SE) */
@media (max-width: 480px) {
  .header .search-row {
    flex-direction: column;
  }
  .navbar.navbar-default .navbar-brand img {
    max-width: 160px;
    height: auto;
  }
  /* убьём возможные отрицательные маргины */
  [class*="col-"] {
    margin: 0 !important;
    padding: 0 10px !important;
  }
}

/* ДОБАВКА №2: именно для блока загрузок медок */
@media (max-width: 768px) {

  /* сама карточка – пусть станет блочной */
  .download-dist .download-dist-specification .download-dist-specification-item {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* внутри карточки блок с кнопкой – тоже на 100% */
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 10px !important;
  }

  /* САМА кнопка "Завантажити" – заставляем влезть */
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn a,
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn button,
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn .yellow-btn,
  .yellow-btn,
  .main-btn {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    text-align: center !important;
    white-space: normal !important;
  }

  /* иногда её уносят стрелки слайдера – вырубим их ещё раз */
  .download-dist-specification .slick-prev,
  .download-dist-specification .slick-next {
    display: none !important;
  }

  /* бывают лишние отступы справа у контейнера */
  .download-dist,
  .download-dist-specification {
    padding-right: 0 !important;
    margin-right: 0 !important;
  }
}

/* совсем узкие телефоны */
@media (max-width: 480px) {
  .download-dist .download-dist-specification .download-dist-specification-item {
    padding: 0 5px !important;
  }
}
@media (max-width: 768px) {
  .container,
  .container-fluid {
    width: 100% !important;
    max-width: 100% !important;
/* МЯГКАЯ правка только для страницы загрузок */
@media (max-width: 768px) {

  /* ограничиваемся только областью загрузок */
  .download-dist,
  .download-dist-specification {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* карточки обновлений – по одной в ряд */
  .download-dist .download-dist-specification .download-dist-specification-item {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 14px 0 !important;
  }

  /* внутри карточки – нормальный flow */
  .download-dist .download-dist-specification .download-dist-specification-item > * {
    width: 100% !important;
  }

  /* блок с кнопками */
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn {
    display: flex !important;
    justify-content: center !important;
    gap: 10px;
    width: 100% !important;
  }

  /* сама кнопка "Завантажити" – центр и фикс макс-ширина */
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn a,
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn button,
  .download-dist .download-dist-specification .download-dist-specification-item .download-dist-specification-item-box-btn .yellow-btn {
    display: block !important;
    width: 100% !important;
    max-width: 360px !important;   /* <- чтоб не вылазила вправо */
    text-align: center !important;
    box-sizing: border-box !important;
    white-space: normal !important;
  }

  /* стрелки/трек слайдера – убрать, они и делают "очень длинно" */
  .download-dist-specification .slick-track,
  .download-dist-specification .slick-list,
  .download-dist-specification .slick-prev,
  .download-dist-specification .slick-next {
    overflow: visible !important;
    height: auto !important;
    display: block !important;
@media (max-width: 768px) {
  .download-dist .download-dist-specification .download-dist-specification-item:nth-of-type(n+5) {
    display: none !important; /* показываем только первые 4 на телефоне */
  }
}
  
  }
}
