.site-footer {
  padding: 0 0 30px;
  background: var(--color-solutions-bg);
}

.site-footer__card {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  column-gap: 40px;
  row-gap: 28px;
  /* width через calc (не margin) — margin-inline:auto способен центрировать
     только определённую (не auto) ширину; так карточка на 1440px остаётся
     буквально той же (calc(100% - 60px) = margin:0 30px), а после
     --wide-content-width перестаёт расти и центрируется на широких экранах. */
  width: calc(100% - 2 * var(--footer-card-margin));
  max-width: var(--wide-content-width);
  margin-inline: auto;
  padding: var(--footer-card-pad-top) var(--footer-card-pad-x) var(--footer-card-pad-bottom);
  border-radius: var(--radius-card);
  background: linear-gradient(
    159deg,
    var(--color-footer-bg-1) 0%,
    var(--color-footer-bg-2) 34.5%,
    var(--color-footer-bg-1) 100%
  );
}

.footer-col {
  flex: 0 0 auto;
  min-width: 0;
}

.footer-col--brand {
  width: 235px;
}

.footer-col--contact {
  width: 276px;
}

.footer-col--aside {
  width: 217px;
}

.footer-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 210px;
  height: 55px;
  border-radius: 10px;
  background: var(--color-surface);
  transition: opacity 0.2s ease;
}

.footer-logo:hover {
  opacity: 0.75;
}

.footer-logo__image {
  display: block;
  width: 180px;
  height: 34.56px;
}

.footer-col__copyright {
  margin: 16px 0 0;
  font-size: var(--fs-footer-body);
  font-weight: var(--fw-regular);
  line-height: 22px;
  color: var(--color-footer-ink-muted);
}

.footer-contact__row {
  display: grid;
  grid-template-columns: 66px 1fr; /* колонка лейбла фиксированная, не по контенту */
  column-gap: 0;
  align-items: start;
  margin: 0;
  font-size: var(--fs-footer-body);
  font-weight: var(--fw-regular);
  line-height: 22px;
  color: var(--color-footer-ink);
}

.footer-contact__row + .footer-contact__row {
  margin-top: 16px;
}

.footer-contact__label {
  flex-shrink: 0;
  color: var(--color-footer-ink-muted);
}

.footer-contact__row a {
  color: var(--color-footer-ink);
}

.footer-contact__row a:hover {
  color: var(--color-accent);
}

.footer-col__title {
  margin: 0 0 9px;
  font-size: var(--fs-footer-heading);
  font-weight: var(--fw-medium);
  line-height: 26px;
  color: var(--color-footer-ink);
}

.footer-col__title:hover {
  color: var(--color-accent);
}

.footer-col__links {
  list-style: none;
  margin: 9px 0 0;
  padding: 0;
}

.footer-col--pages .footer-col__links {
  margin-top: 0;
}

.footer-col--equipment .footer-col__links {
  margin-top: -1px; /* было 9px — подстраницы («Таблетки»/«Капсулы») подняты на 10px */
}

.footer-col__links li {
  line-height: 26px;
}

.footer-col--pages .footer-col__links li:nth-child(2) {
  margin-top: 5px; /* «Контакты» опущены на 5px относительно «Сервис» */
}

.footer-col__link {
  font-size: var(--fs-footer-body);
  font-weight: var(--fw-regular);
  color: var(--color-footer-ink-muted);
}

.footer-col__link:hover {
  color: var(--color-footer-ink);
}

.footer-col__link--heading {
  font-size: var(--fs-footer-heading);
  font-weight: var(--fw-medium);
  color: var(--color-footer-ink);
}

.footer-col__link--heading:hover {
  color: var(--color-accent);
}

.footer-col__title,
.footer-col__link--heading {
  gap: 5px; /* было 3px (.link-chevron) — на 2px больше между текстом и стрелкой у "заголовочных" ссылок футера */
}

.footer-col__tagline {
  margin: 0 0 16px;
  font-size: var(--fs-footer-body);
  font-weight: var(--fw-regular);
  line-height: 22px;
  color: var(--color-footer-ink-tagline);
}

.footer-social {
  display: flex;
  gap: 5px;
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
}

.footer-social__link {
  display: flex;
  align-items: center;
  justify-content: center;
}

.footer-social__bg {
  transition: opacity 0.2s ease;
}

.footer-social__glyph {
  transition: fill 0.2s ease;
}

.footer-social__link:hover .footer-social__bg {
  opacity: 0.2;
}

.footer-social__link:hover .footer-social__glyph {
  fill: #bcd5ed;
}

.footer-col__policy {
  font-size: var(--fs-footer-body);
  font-weight: var(--fw-regular);
  color: var(--color-footer-ink-muted);
}

.footer-col__policy:hover {
  color: var(--color-footer-ink);
}

/*
  Мобильная адаптация (600px, база
  390px). Структурно проще десктопной — колонки «Оборудование»/«Сервис»+
  «Контакты» скрыты (эта навигация переехала в бургер-меню, см.
  header.njk/mobile-nav.njk), это осознанное решение макета, не пропуск.
  Оставшиеся 3 колонки (brand/contact/aside) идут в том же порядке, что и
  в DOM — просто вертикальным стеком по центру вместо flex-wrap-строки,
  явный CSS `order` не нужен. Телефон/email внутри .footer-col--contact —
  CSS Grid с named areas вместо реордера DOM (разметка footer.njk не
  менялась): в DOM порядок строк «Телефон/Адрес/E-mail» (footer-contact__row
  1/2/3), в мобильном макете нужна пара «Телефон|E-mail» в ряд и «Адрес»
  отдельной строкой под ними — grid-area переставляет визуально без
  переписывания partial'а.
*/
@media (max-width: 599.98px) {
  .site-footer {
    padding: 0 0 min(10px, calc(10 / 390 * 100vw));
  }

  .site-footer__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(100% - 2 * min(10px, calc(10 / 390 * 100vw)));
    max-width: min(370px, calc(370 / 390 * 100vw));
    row-gap: 0;
    padding: min(45px, calc(45 / 390 * 100vw)) min(20px, calc(20 / 390 * 100vw)) min(30px, calc(30 / 390 * 100vw));
    text-align: center;
    background: linear-gradient(
      106.97deg,
      var(--color-footer-bg-1) 0%,
      var(--color-footer-bg-2) 34.5%,
      var(--color-footer-bg-1) 100%
    );
  }

  .footer-col--brand,
  .footer-col--contact,
  .footer-col--aside {
    width: 100%;
  }

  .footer-col--equipment,
  .footer-col--pages {
    display: none;
  }

  .footer-logo {
    justify-content: center;
  }

  .footer-logo__image {
    width: min(180px, calc(180 / 390 * 100vw));
    height: auto;
  }

  .footer-col--brand {
    padding-bottom: min(15px, calc(15 / 390 * 100vw));
  }

  .footer-col__copyright {
    font-size: min(11px, calc(11 / 390 * 100vw));
  }

  .footer-col--contact {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "phone email" "address address";
    row-gap: min(20px, calc(20 / 390 * 100vw));
    padding: min(15px, calc(15 / 390 * 100vw)) 0;
  }

  .footer-contact__row:nth-child(1) {
    grid-area: phone;
  }

  .footer-contact__row:nth-child(2) {
    grid-area: address;
  }

  .footer-contact__row:nth-child(3) {
    grid-area: email;
  }

  .footer-contact__row {
    grid-template-columns: none;
    margin: 0;
  }

  .footer-contact__row + .footer-contact__row {
    margin-top: 0;
  }

  .footer-contact__label {
    display: block;
    font-size: min(11px, calc(11 / 390 * 100vw));
  }

  .footer-col--aside {
    padding-top: min(41px, calc(41 / 390 * 100vw));
  }

  .footer-col__tagline {
    margin-bottom: min(16px, calc(16 / 390 * 100vw));
    font-size: min(11px, calc(11 / 390 * 100vw));
    opacity: 0.4;
  }

  .footer-social {
    justify-content: center;
    gap: min(10px, calc(10 / 390 * 100vw));
    margin-bottom: min(16px, calc(16 / 390 * 100vw));
  }
}