/* ============================================================
   День 1 — ссылки в заголовках категорий, «Смотреть все (N)»,
   блок H1 внизу главной.

   Подключается только на главной (body.home), поэтому остальные
   страницы не затрагивает. Тема Bono не правится.
   ============================================================ */

/* 1. Линия под заголовком категории ------------------------- */

body.home .section-block__header {
  align-items: baseline;
  border-bottom: 1px solid rgba(17, 17, 17, .1);
  padding-bottom: 14px;
}

body.home .section-block__title {
  font-size: 1.7rem;
  line-height: 1.2;
  margin: 0 50px 0 0;
}

body.home .section-block__title-link {
  color: inherit;
  text-decoration: none;
  transition: color .15s ease;
}

body.home .section-block__title-link:hover {
  color: #0d700d;
}

body.home .section-block__title-link:focus-visible {
  outline: 2px solid #0d700d;
  outline-offset: 4px;
}

/* 2. «Смотреть все (N)» в правом нижнем углу блока ---------- */

body.home .section-block__footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 22px;
}

body.home .section-block__all {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: .95rem;
  font-weight: 500;
  color: #111;
  text-decoration: none;
  transition: color .15s ease;
}

body.home .section-block__all .section-block__all-count {
  font-weight: 400;
  color: #595959;
  transition: color .15s ease;
}

body.home .section-block__all svg {
  transition: transform .15s ease;
}

body.home .section-block__all:hover {
  color: #0d700d;
}

body.home .section-block__all:hover .section-block__all-count {
  color: inherit;
}

body.home .section-block__all:hover svg {
  transform: translateX(3px);
}

body.home .section-block__all:focus-visible {
  outline: 2px solid #0d700d;
  outline-offset: 3px;
}

/* 3. Блок H1 внизу главной -------------------------------- */

/* Блок приветствия — без линии под заголовком */
body.home .section-block.section-6 .section-block__header {
  display: block;
  border-bottom: 0;
  padding-bottom: 0;
}

.section-html__body > .home-text {
  padding: 0;
}

.home-text {
  max-width: 900px;
}

.home-text__parent {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: .8rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #9a9a9a;
  text-decoration: none;
  transition: color .15s ease;
}

.home-text__parent-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1.5px solid currentColor;
  flex: none;
}

.home-text__parent:hover {
  color: #0d700d;
}

.home-text__parent:focus-visible {
  outline: 2px solid #0d700d;
  outline-offset: 3px;
}

.home-text__title {
  font-size: clamp(1.5rem, 2.6vw, 2.05rem);
  font-weight: 500;
  line-height: 1.3;
  color: #111;
  margin: 12px 0 18px;
  max-width: 760px;
}

.home-text p {
  font-weight: 300;
  color: #333;
  margin-bottom: 1em;
}

.home-text p:last-of-type {
  margin-bottom: 0;
}

.home-text__footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 22px;
}

/* 4. Цвета блоков как в дизайне ----------------------------- */

/*
 * Классы las-alt-odd / las-alt-even ставит PHP по порядку
 * товарных блоков в DOM. Перестановка блоков в конструкторе
 * меняет порядок — цвета пересчитываются автоматически.
 */
body.home .section-block.las-alt-odd {
  background-color: #ffffff !important;
  box-shadow: 0 0 0 100vmax #ffffff;
  clip-path: inset(0 -100vmax);
}

body.home .section-block.las-alt-even {
  background-color: #f5f5f4 !important;
  box-shadow: 0 0 0 100vmax #f5f5f4;
  clip-path: inset(0 -100vmax);
}

body.home .section-block.section-6 {
  background-color: #ffffff !important;
}

/* 5. Карточки: верх картинки всегда на одной линии ---------- */

body.home .shop-item__image {
  height: auto !important;
  flex: 0 0 auto !important;
  aspect-ratio: 500 / 370;
  justify-content: flex-start !important;
  align-items: center !important;
}

body.home .shop-item__image img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain;
  object-position: center top;
}

body.home .shop-item__title {
  min-height: 2.6em;
}

/* 6. Мобильные -------------------------------------------- */

@media (max-width: 767px) {
  body.home .section-block__title {
    font-size: 1.25rem;
  }

  body.home .section-block__header {
    padding-bottom: 10px;
  }

  body.home .section-block__footer {
    margin-top: 14px;
  }

  body.home .section-block__all {
    font-size: .9rem;
  }

  .home-text__title {
    font-size: 1.45rem;
  }
}
