/* Проба навыка visual-craft: слой поверх style.css. Оригинальные стили не изменены.
   Режим: обновление. Фирменные тёмный и жёлтый, тексты, адреса и формы сохранены.
   Направление: тяжёлая техника для подрядчиков ГНБ — тёмная сцена, машина крупно
   и до края экрана, один жёлтый акцент, цифры из паспорта, движения почти нет.
   Регуляторы: композиция 5, движение 2, плотность 5. */

/* Шрифт заголовков лежит на своём сервере (лицензия SIL OFL, самохостинг разрешён). */
@font-face {
  font-family: "Geologica";
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url("../fonts/geologica-cyrillic-ext.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Geologica";
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url("../fonts/geologica-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Geologica";
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url("../fonts/geologica-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Geologica";
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url("../fonts/geologica-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --display: "Geologica", "Manrope", Arial, sans-serif;
}

/* :not(.parts *) — модуль запчастей (main.parts) остаётся в прежнем оформлении целиком */
h1:not(.parts *), h2:not(.parts *), h3:not(.parts *), .news-feature__title, .hero__facts b, .about-home__facts b { font-family: var(--display); }
h2:not(.parts *) { font-weight: 600; letter-spacing: -.02em; line-height: 1.1; text-wrap: balance; }
h3:not(.parts *) { font-weight: 600; letter-spacing: -.01em; }
.eyebrow:not(.parts *) { font-weight: 700; letter-spacing: .08em; }
::selection { background: var(--accent); color: var(--ink); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.btn:active { transform: translateY(1px); }

/* ---------- первый экран: машина до края, текст поверх тёмной части ---------- */
.hero { position: relative; }
.hero__grid {
  position: relative; display: block; min-height: 0;
  padding-top: 84px; padding-bottom: 84px;
}
.hero__content { position: relative; z-index: 2; max-width: 660px; }
.hero h1 {
  font-weight: 600; font-size: clamp(32px, 3.15vw, 46px); line-height: 1.1;
  letter-spacing: -.02em; max-width: none; text-wrap: balance;
}
.hero__lead { font-size: 18px; line-height: 1.55; max-width: 52ch; margin-top: 22px; color: #c9d2d8; }
.hero__visual {
  position: absolute; z-index: 1; top: 0; bottom: 0; right: calc((100vw - 100%) / -2);
  width: min(62vw, 980px); border: 0; border-radius: 0; box-shadow: none;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 52%);
          mask-image: linear-gradient(to right, transparent 0, #000 52%);
}
.hero__visual img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 60% 50%; }

/* Факты — отдельной полосой под первым экраном, а не шестым элементом в нём */
.hero__bar { position: relative; z-index: 2; border-top: 1px solid rgba(255, 255, 255, .14); }
.hero__bar .hero__facts {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 0; font-size: 14px; color: #b7c2c9;
}
.hero__bar .hero__facts span { max-width: none; padding: 20px 24px 22px 0; }
.hero__bar .hero__facts span + span { padding-left: 24px; border-left: 1px solid rgba(255, 255, 255, .14); }
.hero__bar .hero__facts b { font-weight: 600; font-size: 20px; letter-spacing: -.01em; margin-bottom: 2px; }

/* ---------- каталог на главной: 7 разделов — 7 ячеек, без пустого места.
   Правила ограничены главной: та же сетка есть на странице каталога и в модуле запчастей. ---------- */
.home-catalog .category-card:hover { transform: translateY(-2px); }
.home-catalog .category-card h3 { font-size: 19px; }
.home-catalog .category-card span { white-space: nowrap; font-size: 14px; }
@media (min-width: 1051px) {
  .home-catalog .category-grid { grid-template-columns: repeat(4, 1fr); gap: 18px; }
  /* главный товар — крупно; фото показываем целиком, без обрезки */
  .home-catalog .category-card--rigs { grid-column: span 2; grid-row: span 2; }
  .home-catalog .category-card--rigs img { flex: none; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
  .home-catalog .category-card--rigs > div { flex: 1; justify-content: center; padding: 28px 32px; }
  .home-catalog .category-card--rigs h3 { font-size: 28px; }
  .home-catalog .category-card--rigs p { font-size: 16px; min-height: 0; max-width: 46ch; }
  .home-catalog .category-card--rigs span { margin-top: 0; }
  /* расходные материалы — две широкие плитки в нижнем ряду */
  .home-catalog .category-card--tools, .home-catalog .category-card--fluids { grid-column: span 2; flex-direction: row; }
  .home-catalog .category-card--tools img, .home-catalog .category-card--fluids img { flex: none; width: 290px; height: auto; aspect-ratio: 16 / 10; }
  .home-catalog .category-card--tools > div, .home-catalog .category-card--fluids > div { justify-content: center; }
  .home-catalog .category-card--tools h3, .home-catalog .category-card--fluids h3 { font-size: 22px; }
}

@media (max-width: 1050px) {
  .hero__grid { padding-top: 48px; padding-bottom: 0; }
  .hero__content { max-width: none; }
  .hero__visual {
    position: relative; right: auto; width: auto; margin: 32px -20px 0;
    -webkit-mask-image: none; mask-image: none;
  }
  .hero__visual img { height: auto; aspect-ratio: 1.5 / 1; }
  .hero h1 { font-size: clamp(30px, 7.6vw, 42px); }
}
@media (max-width: 680px) {
  .hero__bar .hero__facts { grid-template-columns: 1fr; }
  .hero__bar .hero__facts span { padding: 14px 0; }
  .hero__bar .hero__facts span + span { padding-left: 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .14); }
}

/* ================= секции главной ниже каталога ================= */

/* ---------- письма: под каждым — название организации ---------- */
.review:hover { transform: translateY(-2px); }
.review__name {
  display: block; padding: 12px 14px 14px; border-top: 1px solid var(--line);
  font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--ink);
}
@media (min-width: 901px) {
  .home-letters .reviews-grid { gap: 20px; }
}

/* ---------- о производителе: цифры крупной строкой, текст в две колонки ---------- */
.home-about .about-home { display: grid; grid-template-columns: 1fr; gap: 44px; }
.home-about .about-home__facts {
  order: -1; grid-template-columns: repeat(4, 1fr); gap: 0;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.home-about .about-home__facts > div {
  background: none; border: 0; border-radius: 0; padding: 26px 24px 28px;
  border-left: 1px solid var(--line);
}
.home-about .about-home__facts > div:first-child { border-left: 0; padding-left: 0; }
.home-about .about-home__facts b {
  font-weight: 600; font-size: clamp(38px, 4.6vw, 62px); letter-spacing: -.03em; line-height: 1;
  margin-bottom: 10px; font-variant-numeric: tabular-nums;
}
.home-about .about-home__facts span { font-size: 15px; }
.home-about .about-home__text { columns: 2; column-gap: 56px; }
.home-about .about-home__text p { break-inside: avoid; }
.home-about .about-home__text .btn { margin-top: 6px; }
@media (max-width: 900px) {
  .home-about .about-home { gap: 28px; }
  .home-about .about-home__facts { grid-template-columns: 1fr 1fr; }
  .home-about .about-home__facts > div { padding: 18px 16px 20px; }
  .home-about .about-home__facts > div:nth-child(odd) { border-left: 0; padding-left: 0; }
  .home-about .about-home__facts > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .home-about .about-home__text { columns: 1; }
}

/* ---------- сервис: шаги на тёмной панели ---------- */
main:not(.parts) .feature-panel { background: var(--ink); color: #fff; padding: 40px; }
main:not(.parts) .feature-panel > span {
  display: block; width: auto; height: auto; place-items: initial; background: none; border-radius: 0;
  color: var(--accent); font-family: var(--display); font-weight: 600; font-size: 15px; letter-spacing: .08em;
  margin-top: 26px; padding-top: 26px; border-top: 1px solid rgba(255, 255, 255, .14);
}
main:not(.parts) .feature-panel > span:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
main:not(.parts) .feature-panel h3 { color: #fff; font-size: 22px; margin: 8px 0 6px; }
/* селектор усилен: общее правило .split > div > p иначе красит текст в тёмно-серый */
main:not(.parts) .section .feature-panel p { color: #b7c2c9; margin: 0; }
/* галочка нарисована, а не взята значком из шрифта */
main:not(.parts) .check-list li:before {
  content: ""; left: 5px; top: .42em; width: 6px; height: 11px;
  border: solid #9a7300; border-width: 0 2px 2px 0; transform: rotate(45deg);
}

/* ---------- вопросы: заголовок слева, ответы справа, без карточек ---------- */
main:not(.parts) .faq { gap: 0; }
.home-faq .faq { max-width: none; }
main:not(.parts) .faq__item {
  background: none; border: 0; border-top: 1px solid var(--line); border-radius: 0;
}
main:not(.parts) .faq__item:last-child { border-bottom: 1px solid var(--line); }
main:not(.parts) .faq__item[open] { border-color: var(--line); }
main:not(.parts) .faq__item summary {
  padding: 24px 48px 24px 0; font-family: var(--display); font-weight: 600; font-size: 19px; letter-spacing: -.01em;
}
main:not(.parts) .faq__item summary::after { right: 8px; }
main:not(.parts) .faq__item summary:hover { background: none; color: #8a6400; }
main:not(.parts) .faq__answer { padding: 0 0 26px; max-width: 64ch; }
@media (min-width: 1051px) {
  .home-faq > .container { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 56px; align-items: start; }
  .home-faq .section__head { margin-bottom: 0; position: sticky; top: 110px; }
}

/* ---------- призыв ---------- */
.cta h2 { font-weight: 600; letter-spacing: -.02em; }

/* ================= внутренние страницы: тот же голос заголовков ================= */
h1:not(.parts *) { font-weight: 600; letter-spacing: -.02em; text-wrap: balance; }
/* у карточки товара длинное название модели: чуть меньше кегль, чтобы не ломалось на три строки */
.product-hero h1 { font-size: clamp(30px, 3.1vw, 40px); line-height: 1.12; }


/* ================= внутренние страницы: общие блоки =================
   Всё ограничено main:not(.parts): модуль запчастей (main.parts) не затрагивается. */

/* ---------- шапка страницы: тёмная, как первый экран главной ---------- */
main:not(.parts) .page-hero { background: var(--ink); color: #fff; padding: 52px 0 60px; }
main:not(.parts) .page-hero h1 { font-size: clamp(28px, 4.2vw, 48px); line-height: 1.1; max-width: 22ch; }
main:not(.parts) .page-hero p:not(.breadcrumbs):not(.eyebrow) { color: #c9d2d8; font-size: 18px; line-height: 1.55; max-width: 62ch; }
main:not(.parts) .page-hero p a:not(.btn) { color: var(--accent); }
main:not(.parts) .page-hero .breadcrumbs { color: #8fa0aa; margin-bottom: 26px; }
main:not(.parts) .page-hero .breadcrumbs a { color: #c9d2d8; }
main:not(.parts) .page-hero .eyebrow { color: var(--accent); }
main:not(.parts) .page-hero .btn--dark { background: #fff; color: var(--ink); }
@media (max-width: 680px) {
  main:not(.parts) .page-hero { padding: 36px 0 42px; }
  main:not(.parts) .page-hero p:not(.breadcrumbs):not(.eyebrow) { font-size: 16px; }
}

/* ---------- карточка товара: характеристики строкой, без серых плашек ---------- */
main:not(.parts) .product-card { transition: border-color .16s, box-shadow .16s; }
main:not(.parts) .product-card:hover { border-color: #b9c6cd; box-shadow: 0 10px 30px rgba(27, 42, 51, .08); }
main:not(.parts) .mini-specs { gap: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
main:not(.parts) .mini-specs span { background: none; border-radius: 0; padding: 12px 10px 12px 12px; border-left: 1px solid var(--line); }
main:not(.parts) .mini-specs span:first-child { border-left: 0; padding-left: 0; }
main:not(.parts) .mini-specs small { font-size: 11px; line-height: 1.3; }
main:not(.parts) .mini-specs b { font-family: var(--display); font-weight: 600; font-size: 15px; font-variant-numeric: tabular-nums; }

/* ---------- таблица характеристик: полосы вместо линии под каждой строкой ---------- */
main:not(.parts) .spec-table { border-top: 0; }
main:not(.parts) .spec-table tr { border-bottom: 0; }
main:not(.parts) .spec-table tr:nth-child(odd) { background: #f3f6f8; }
main:not(.parts) .spec-table th, main:not(.parts) .spec-table td { padding: 13px 16px; }
main:not(.parts) .spec-table th { border-radius: 8px 0 0 8px; }
main:not(.parts) .spec-table td { border-radius: 0 8px 8px 0; font-weight: 700; font-variant-numeric: tabular-nums; }
@media (max-width: 680px) {
  main:not(.parts) .spec-table tr { padding: 12px 14px; border-radius: 8px; }
  main:not(.parts) .spec-table th, main:not(.parts) .spec-table td { padding: 0; border-radius: 0; }
}
main:not(.parts) .compare td { font-variant-numeric: tabular-nums; }

/* ---------- преимущества и направления сервиса: колонки с линиями, без рамок ---------- */
main:not(.parts) .benefits article, main:not(.parts) .service-grid article {
  background: none; border: 0; border-radius: 0; padding: 4px 0 0;
}
main:not(.parts) .benefits b {
  font-family: var(--display); font-weight: 600; font-size: 15px; letter-spacing: .08em;
}
/* у направлений сервиса порядок ничего не значит — номера не показываем */
main:not(.parts) .service-grid article > span { display: none; }
main:not(.parts) .benefits h3, main:not(.parts) .service-grid h3 { font-size: 20px; }
main:not(.parts) .service-grid h3 { margin-top: 0; }
main:not(.parts) .benefits p, main:not(.parts) .service-grid p { font-size: 15px; line-height: 1.55; }
@media (min-width: 1051px) {
  main:not(.parts) .benefits, main:not(.parts) .service-grid { column-gap: 0; row-gap: 36px; }
  main:not(.parts) .benefits article, main:not(.parts) .service-grid article { padding: 4px 28px; border-left: 1px solid var(--line); }
  main:not(.parts) .benefits article:nth-child(3n + 1), main:not(.parts) .service-grid article:nth-child(3n + 1) { border-left: 0; padding-left: 0; }
}
@media (max-width: 1050px) {
  main:not(.parts) .benefits article, main:not(.parts) .service-grid article { padding-top: 20px; border-top: 1px solid var(--line); }
}

/* ---------- цифры о производителе: крупно, без карточек с цветной полоской.
   Главная исключена: у неё своя раскладка этого блока выше. ---------- */
main:not(.parts) .section:not(.home-about) .about-home__facts { gap: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
main:not(.parts) .section:not(.home-about) .about-home__facts > div {
  background: none; border: 0; border-radius: 0; padding: 22px 24px 24px; border-left: 1px solid var(--line);
}
main:not(.parts) .section:not(.home-about) .about-home__facts b {
  font-weight: 600; font-size: clamp(32px, 3.6vw, 48px); letter-spacing: -.03em; line-height: 1; margin-bottom: 10px;
  font-variant-numeric: tabular-nums;
}
main:not(.parts) .section:not(.home-about) .about-home__facts span { font-size: 15px; }
@media (min-width: 901px) {
  main:not(.parts) .section:not(.home-about) .about-home__facts--wide > div:nth-child(3n + 1) { border-left: 0; padding-left: 0; }
  main:not(.parts) .section:not(.home-about) .about-home__facts--wide > div:nth-child(n + 4) { border-top: 1px solid var(--line); }
}
@media (max-width: 900px) {
  main:not(.parts) .section:not(.home-about) .about-home__facts > div { padding: 18px 16px 20px; }
  main:not(.parts) .section:not(.home-about) .about-home__facts > div:nth-child(odd) { border-left: 0; padding-left: 0; }
  main:not(.parts) .section:not(.home-about) .about-home__facts > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
}
/* на странице сервиса в панели нет номеров — разделяем пункты линией */
main:not(.parts) .feature-panel p + h3 { margin-top: 24px; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .14); }

/* ---------- контраст: три места ниже нормы 4,5:1 ---------- */
/* хлебные крошки на светлом фоне (было 4,1:1 и до правок) */
main:not(.parts) .breadcrumbs { color: #56656f; }
/* шапка страницы тёмная — там крошки светлые */
main:not(.parts) .page-hero .breadcrumbs { color: #8fa0aa; }
/* жёлтые ссылки в светлой таблице статьи (было 1,8:1 и до правок) */
main:not(.parts) .compare--light a { color: #8a6400; }
/* номера шагов: без белой карточки под ними нужен цвет темнее */
main:not(.parts) .benefits b { color: #7a5800; }