/* Дополняет assets/css/styles.css. Только то, чего нет в purged-бандле.
   Брейкпоинты повторяют бандл: sm 40rem, md 48rem, lg 64rem. */

.market-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
}

/* Пятая ячейка не должна оставлять дыру в незаполненном ряду. */
.market-grid > :last-child {
  grid-column: 1 / -1;
}

/* Первая ячейка обнуляет левый внутренний padding, чтобы её текст лёг ровно
   на левый край контейнера (там же, где H1 «The used Land Rovers…» ниже).
   Без этого содержимое было сдвинуто на 20px внутрь от края и весь strip
   визуально плыл вправо относительно hero. Правый край не трогаем — какая
   ячейка там окажется зависит от брейкпоинта (2/3/5 колонок). */
.market-grid > :first-child {
  padding-left: 0;
}

@media (width >= 40rem) {
  .market-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .market-grid > :last-child {
    grid-column: span 2;
  }
}

@media (width >= 64rem) {
  .market-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .market-grid > :last-child {
    grid-column: auto;
  }
}

/* Обёртка узла — grid-элемент, её растягивает сам грид. Карточка внутри тянется
   за ней, иначе пояснения разной длины дают пять карточек разной высоты. */
@media (width >= 48rem) {
  .chain-node > :first-child {
    height: 100%;
  }
}

/* Вторичная кнопка hero «Need a specific Land Rover?» светлеет до фона при наведении.
   В purged-бандле этого hover-варианта нет — без правила hover молчит. */
@media (hover: hover) {
  .hover\:bg-background:hover {
    background-color: var(--background);
  }
}

/* Утилиты, которые разметка использует, а purged-бандл не содержит.
   Тела правил повторяют то, что сгенерировал бы Tailwind v4. */
.leading-\[1\.05\] {
  --tw-leading: 1.05;
  line-height: 1.05;
}

/* Списки плюсов и минусов в карточке находки. */
:where(.space-y-1 > :not(:last-child)) {
  --tw-space-y-reverse: 0;
  margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
  margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
}

/* Подложки виджета находок на тёмной панели bg-ink. */
.bg-ink-border\/10 {
  background-color: color-mix(in oklab, var(--ink-border) 10%, transparent);
}

.bg-ink-border\/20 {
  background-color: color-mix(in oklab, var(--ink-border) 20%, transparent);
}

.bg-ink-border\/40 {
  background-color: color-mix(in oklab, var(--ink-border) 40%, transparent);
}

@media (hover: hover) {
  .hover\:bg-surface:hover {
    background-color: var(--surface);
  }
}

/* Сетка карточек находок: 1 → 2 → 3 колонки. */
@media (width >= 48rem) {
  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Блок персонального подбора: текст слева, форма чуть шире справа. */
@media (width >= 64rem) {
  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lg\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1\.1fr\)\] {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  }
}

/* На узком экране кнопка заявки в шапке уступает место бренду и
   переключателю четырёх языков; та же кнопка стоит в hero сразу ниже. */
@media (width < 40rem) {
  .header-cta {
    display: none;
  }
}

.wordmark-o {
  display: inline-block;
  width: .78em;
  height: .78em;
  vertical-align: -.08em;
}