/* =========================================================================
   fixes.css — переопределения-заплатки. Подключается последним.
   Использовать точечно, для устранения конфликтов между base/components/style-guide.
   ========================================================================= */

/* Резерв под фазу 7: при обнаружении конфликтов правки вносятся здесь,
   не трогая style-guide.css (контракт дизайн-системы). */

/* =========================================================================
   Утилитарные классы — замена inline-стилей (устранение нарушения A.4 ТЗ)
   ========================================================================= */

.mt-sm { margin-top: var(--gap-sm); }
.mt-md { margin-top: var(--gap-md); }
.mt-lg { margin-top: var(--gap-lg); }

.gap-sm { gap: var(--gap-sm); }
.gap-md { gap: var(--gap-md); }

.maxw-720 { max-width: 720px; }
.maxw-860 { max-width: 860px; }
.mx-auto { margin-inline: auto; }

.text-inverse-muted { color: var(--color-text-inverse-muted); }
.text-center { text-align: center; }
.fw-700 { font-weight: 700; }

.flex-center { display: flex; justify-content: center; }

.pt-sm { padding-block: var(--gap-sm) 0; }

.media-card {
  min-height: 360px;
  background: var(--color-dark-2);
  border-radius: var(--radius-md);
  padding: var(--gap-lg);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.visually-hidden-offscreen { position: absolute; left: -9999px; }

/* Блокировка прокрутки под оверлеями (drawer/popup/lightbox).
   Класс и --scrollbar-gap проставляет main.js (SEM.lockScroll/unlockScroll). */
body.is-locked {
  overflow: hidden;
}

/* Компенсация ширины скроллбара у sticky-шапки — чтобы контент не «прыгал» */
body.is-locked .site-header {
  padding-right: var(--scrollbar-gap, 0);
}

/* =========================================================================
   Блок «Реквизиты» (dokumenty / kontakty) — вид по образцу site 2
   ========================================================================= */

/* Межстрочный интервал во вводном тексте блока */
.section--requisites .requisites-intro {
  line-height: 1.9;
}

/* Таблица реквизитов: слева серым, справа белым, без чёрных линий */
.section--requisites .requisites-table {
  border-collapse: collapse;
}

.section--requisites .requisites-table tbody tr:nth-child(even) {
  background: transparent; /* убрать полосатую заливку */
}

.section--requisites .requisites-table th,
.section--requisites .requisites-table td {
  padding: 0.85rem 1rem;
  vertical-align: top;
  border-bottom: 1px solid var(--color-border);
}

.section--requisites .requisites-table th {
  color: var(--color-text-muted);      /* слева серым */
  font-weight: 600;
  text-align: left;
  white-space: normal;
  background: var(--color-light-2);     /* слева серым */
}

.section--requisites .requisites-table td {
  color: var(--color-text);             /* справа белым (белый фон, тёмный текст) */
  background: var(--color-light);
}

/* Выделение телефона и почты цветом, без подчёркиваний */
.section--requisites .requisites-table a[href^="tel:"],
.section--requisites .requisites-table a[href^="mailto:"] {
  color: var(--color-accent-dark);
  text-decoration: none;
}

.section--requisites .requisites-table a[href^="tel:"]:hover,
.section--requisites .requisites-table a[href^="mailto:"]:hover {
  color: var(--color-accent-hover);
}

/* =========================================================================
   /obekty-iz-metallokonstrukcij/ — компактный мобильный вид хаба
   (по образцу site 3: меньше отступов и мелкая типографика на мобильных)
   ========================================================================= */

/* ≤575px: карточки объектов без миниатюры (svg скрыт) — только текст */
@media (max-width: 575px) {
  .hub-cards .grid--4 {
    gap: 0.75rem;
  }

  .hub-cards .card--object {
    display: grid;
    grid-template-columns: 1fr;
  }

  .hub-cards .card--object .card__media {
    display: none;
  }

  .hub-cards .card--object .card__body {
    padding: 0.75rem;
    gap: 0.375rem;
  }

  .hub-cards .card--object .card__title {
    font-size: var(--fs-body);
  }

  .hub-cards .card--object .card__text {
    font-size: var(--fs-micro);
  }

  /* Заголовок секции — плотнее */
  .hub-cards .section-title__subtitle,
  .hub-steps .section-title__subtitle {
    font-size: var(--fs-small);
  }

}

/* =========================================================================
    /uslugi/ — блок «Наши услуги»: на мобильных скрываем миниатюры (svg)
    ========================================================================= */

.requisites-table th { width: 40%; }
@media (max-width: 575px) {
  .services-cards .card--service .card__media {
    display: none;
  }
}

/* Шаги процесса — как в site 3: на десктопе одна колонка,
   номер слева, текст справа — горизонтальные карточки во всю ширину.
   (Раскладка перенесена с мобильных на все брейкпоинты.) */
.hub-steps .steps--process {
  grid-template-columns: 1fr;
  gap: 0.75rem;
}

.hub-steps .steps--process .step {
  position: relative;
  padding: 1rem 1rem 1rem 3.25rem;
}

.hub-steps .steps--process .step::before {
  position: absolute;
  left: 1rem;
  top: 1rem;
  margin-bottom: 0;
  font-size: var(--fs-h3);
  line-height: 1.28;
}

.hub-steps .steps--process .step__title {
  margin: 0;
}

/* ≤575px: уменьшенная типографика шагов */
@media (max-width: 575px) {
  .hub-steps .steps--process .step__title {
    font-size: var(--fs-body);
  }

  .hub-steps .steps--process .step__text {
    font-size: var(--fs-small);
  }
}

/* =========================================================================
   Главная — hero: на ПК изображение крупнее
   Было: .hero__grid { grid-template-columns: 1.1fr 0.9fr } (components.css)
   Стало: контейнер hero шире общего (1400 вместо 1200), картинка справа
   занимает больше места, текстовая колонка сохраняет читаемую ширину.
   Откат: удалить этот блок.
   ========================================================================= */
@media (min-width: 992px) {
  .hero--home .container {
    max-width: 1400px;
  }

  .hero--home .hero__grid {
    grid-template-columns: 1fr 1.15fr;
  }
}

/* Hero — уменьшенный межстрочный интервал вводного текста на мобильных.
   Перебивает .text-lg { line-height: 1.6 } из style-guide.css.
   Откат: удалить этот блок (вернётся 1.6). */
@media (max-width: 767px) {
  .hero .text-lg {
    line-height: 1.1;
  }
}

/* Hero на мобильных: длинные подписи кнопок переносятся, колонки не распираются */
@media (max-width: 575px) {
  .hero__actions .btn {
    white-space: normal; /* перебивает nowrap у .btn — текст кнопки переносится */
  }
  .hero__grid > * {
    min-width: 0; /* grid-колонка может сжиматься ниже min-content */
  }
}