/* Start:/local/templates/zerapy/components/bitrix/news.detail/lineyka_landing/style.css?177995092911485*/
/* Очищение — макеты Figma: 1920, планшет, 600, узкая мобилка */

.ochischenie-lineika-page {
  position: relative;
}

/* ——— Главный баннер ——— */
.ochischenie-lineika-main-banner {
  background: #829995;
  overflow: hidden;

  & .ochischenie-lineika-main-banner__container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
    justify-content: space-between;
  }

  & .ochischenie-lineika-main-banner__content {
    position: relative;

    display: flex;
    padding: 160px 0 105px;
    padding-right: 80px;
    flex-direction: column;
    gap: 20px;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 460px;
    max-width: 730px;
    box-sizing: border-box;
  }

  & .ochischenie-lineika-main-banner__image {
    position: relative;

    display: flex;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 300px;
    align-items: flex-end;
    justify-content: flex-end;
    min-height: 0;
    min-width: 0;

    & img {
      display: block;
      max-height: 438px;
      min-height: 0;
      width: auto;
      max-width: 100%;
      object-fit: contain;
      object-position: center bottom;
    }
  }

  & .ochischenie-lineika-main-banner__header {
    display: flex;
    flex-direction: column;
    gap: 40px;
  }

  & .ochischenie-lineika-main-banner__title {
    color: #ffffff;
  }

  & .ochischenie-lineika-main-banner__subtitle {
    color: #ffffff;
  }

  & .ochischenie-lineika-main-banner__body {
    display: flex;
    flex-direction: column;
    gap: 20px;

    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;

    color: #ffffff;

    & b {
      font-weight: 700;
    }
  }
}

/* ——— Баннер + картинка (липкий на десктопе) ——— */
.ochischenie-lineika-banner-image {
  position: sticky;
  top: 0;

  background: #f9fafa;
  overflow: hidden;

  & .ochischenie-lineika-banner-image__container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
  }

  & .ochischenie-lineika-banner-image__col {
    position: relative;

    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 460px;
    min-height: 0;

    & img {
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;

      display: block;
      height: 100%;
      width: 50dvw;
      max-width: unset;
      min-width: unset;
      object-fit: cover;
      object-position: center;
    }
  }

  & .ochischenie-lineika-banner-image__content {
    display: flex;
    padding: 105px 0;
    padding-right: 80px;
    flex-direction: column;
    gap: 20px;
    box-sizing: border-box;
  }

  & .ochischenie-lineika-banner-image__header {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  & .ochischenie-lineika-banner-image__title {
    color: #5a5b6c;
  }

  & .ochischenie-lineika-banner-image__body {
    display: flex;
    flex-direction: column;
    gap: 20px;

    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 22px;

    color: #5a5b6c;

    & b {
      font-weight: 700;
    }
  }

  &.ochischenie-lineika-banner-image--reverse {

    & .ochischenie-lineika-banner-image__container {
      flex-direction: row-reverse;
    }

    & .ochischenie-lineika-banner-image__col {
      & img {
        left: unset;
        right: 0;
      }
    }

    & .ochischenie-lineika-banner-image__content {
      padding-left: 80px;
      padding-right: 0;
    }
  }
}

/* ——— Средний серый блок ——— */
.ochischenie-lineika-banner {
  position: sticky;
  top: 0;

  background: #e6e7ed;
  overflow: hidden;

  & .ochischenie-lineika-banner__container {
    display: flex;
    padding: 105px 0;
    flex-direction: column;
    gap: 40px;
    box-sizing: border-box;
  }

  & .ochischenie-lineika-banner__header {
    max-width: 900px;

    color: #5a5b6c;
  }

  & .ochischenie-lineika-banner__body {
    max-width: 500px;
    margin-left: auto;
    box-sizing: border-box;

    color: #5a5b6c;

    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 22px;
  }
}

/* ——— Каталог ——— */
.ochischenie-lineika-section-list {
  margin: 105px 0;
  background: #ffffff;

  & .index-block-header {
    display: flex;
    justify-content: center;
    padding-bottom: 40px;
  }

  & .index-block-header__title {
    text-align: center;
  }

  & .catalog-section-list__group {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* ——— Навигация линий (Figma 7061:12629) ——— */
.lines-navigation {
  width: 100%;

  & .lines-navigation__container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  & .lines-navigation__prev,
  & .lines-navigation__next {
    position: relative;

    display: flex;
    flex: 1 1 0;
    min-width: 0;
  }

  & .lines-navigation__prev {
    background: #6b1734;
  }

  & .lines-navigation__next {
    background: #1c3c6f;
  }

  & .lines-navigation__item {
    display: flex;
    width: 100%;
    min-height: 100%;
    padding: 20px;
    align-items: center;
    gap: 12px;

    text-decoration: none;
    color: #ffffff;

    box-sizing: border-box;
  }

  & .lines-navigation__next .lines-navigation__item {
    justify-content: flex-end;
  }

  & .lines-navigation__label {
    flex: 1 1 0;
    min-width: 0;

    font-size: 20px;
    font-weight: 400;
    line-height: 27px;
  }

  & .lines-navigation__next .lines-navigation__label {
    text-align: right;
  }

  & .lines-navigation__item-icon {
    display: inline-flex;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;

    &>svg {
      display: block;
      height: 100%;
      width: 100%;
      object-fit: contain;
      object-position: center;
    }
  }

  & .lines-navigation__item-icon--prev {
    transform: rotate(-90deg);
  }

  & .lines-navigation__item-icon--next {
    transform: rotate(-90deg) scaleY(-1);
  }
}

.lines-navigation--single .lines-navigation__container {
  display: block;
}

.lines-navigation--single .lines-navigation__prev,
.lines-navigation--single .lines-navigation__next {
  width: 100%;
}

/* ——— Текст в блоках: как в макете des_3 (16px / 22) ——— */
.ochischenie-lineika-banner-image .text.text--3,
.ochischenie-lineika-banner .text.text--3 {
  font-size: 16px;
  line-height: 22px;
}

/* ——— Планшет ~1200 ——— */
@media (max-width: 1200px) {
  .ochischenie-lineika-main-banner {
    & .ochischenie-lineika-main-banner__content {
      padding: 160px 0 105px;
      padding-right: 40px;
      max-width: none;
    }

    & .ochischenie-lineika-main-banner__image {
      & img {
        max-height: 444px;
      }
    }
  }

  .ochischenie-lineika-banner-image {
    & .ochischenie-lineika-banner-image__content {
      padding-right: 40px;
    }

    &.ochischenie-lineika-banner-image--reverse .ochischenie-lineika-banner-image__content {
      padding-left: 40px;
      padding-right: 0;
    }
  }

  .ochischenie-lineika-banner {
    & .ochischenie-lineika-banner__container {
      padding-left: 0;
      padding-right: 0;
    }

    & .ochischenie-lineika-banner__body {
      padding-left: 0;
      max-width: 500px;
    }
  }

  .ochischenie-lineika-section-list {
    & .catalog-section-list__group {
      grid-template-columns: repeat(2, minmax(240px, 1fr));
    }
  }

}

/* ——— Узкий планшет (макет 7057:11502): описание барьера со сдвигом ——— */
@media (max-width: 900px) {
  .ochischenie-lineika-banner {
    & .ochischenie-lineika-banner__body {
      margin-left: 0;
      max-width: none;
      padding-left: min(460px, 20vw);
    }
  }
}

/* ——— Мобилка ≤768 ——— */
@media (max-width: 768px) {
  .ochischenie-lineika-main-banner {
    & .ochischenie-lineika-main-banner__container {
      flex-direction: column;
      justify-content: flex-start;
    }

    & .ochischenie-lineika-main-banner__content {
      order: 2;

      padding: 20px 0 40px;
      padding-left: 0;
      padding-right: 0;
      flex-basis: auto;
      max-width: none;
      gap: 0;
    }

    & .ochischenie-lineika-main-banner__header {
      gap: 40px;
    }

    & .ochischenie-lineika-main-banner__image {
      order: 1;

      flex: none;
      width: 100%;
      min-height: 517px;
      justify-content: center;
      align-items: flex-end;

      & img {
        position: relative;
        left: auto;
        bottom: auto;
        max-height: 444px;
        width: auto;
        max-width: 100%;
      }
    }

    & .ochischenie-lineika-main-banner__title.title--1 {
      font-size: 58px;
      line-height: 58px;
    }

    & .ochischenie-lineika-main-banner__subtitle.title--3 {
      font-size: 20px;
      line-height: 24px;
    }
  }

  .ochischenie-lineika-banner-image {
    position: static;
    top: auto;

    & .ochischenie-lineika-banner-image__container {
      flex-direction: column;
    }

    & .ochischenie-lineika-banner-image__col {
      flex-basis: auto;
      width: 100%;

      & img {
        position: relative;
        left: auto;
        right: auto;
        width: 100%;
        height: 400px;
        object-fit: cover;
      }
    }

    & .ochischenie-lineika-banner-image__content {
      padding: 60px 0;
      padding-right: 0;
      padding-left: 0;
      gap: 20px;
    }

    & .ochischenie-lineika-banner-image__title.title--2 {
      font-size: 36px;
      line-height: 44px;
    }

    &.ochischenie-lineika-banner-image--reverse {
      & .ochischenie-lineika-banner-image__container {
        flex-direction: column;
      }

      /* В макете: сначала фото, затем текст */
      & .ochischenie-lineika-banner-image__col:first-child {
        order: 2;
      }

      & .ochischenie-lineika-banner-image__col:last-child {
        order: 1;

        & img {
          right: auto;
        }
      }

      & .ochischenie-lineika-banner-image__content {
        padding-left: 0;
      }
    }
  }

  .ochischenie-lineika-banner {
    position: static;
    top: auto;

    & .ochischenie-lineika-banner__container {
      padding: 60px 0;
      gap: 20px;
    }

    & .ochischenie-lineika-banner__header .title--2 {
      font-size: 36px;
      line-height: 44px;
    }

    & .ochischenie-lineika-banner__body {
      margin-left: 0;
      max-width: none;
      padding-left: 0;
    }
  }

  /* Третий блок без reverse: в макете текст сверху, картинка снизу (как в DOM) */
  .ochischenie-lineika-banner-image:not(.ochischenie-lineika-banner-image--reverse) {
    & .ochischenie-lineika-banner-image__container {
      flex-direction: column;
    }

    & .ochischenie-lineika-banner-image__col:last-child img {
      height: 470px;
    }
  }

  .ochischenie-lineika-section-list {
    margin: 60px 0;

    & .index-block-header__title.title--2 {
      font-size: 36px;
      line-height: 44px;
    }
  }

}

/* ——— Каталог: одна колонка на узких экранах ——— */
@media (max-width: 599px) {
  .ochischenie-lineika-section-list {
    & .catalog-section-list__group {
      grid-template-columns: minmax(0, 1fr);
    }
  }
}
/* End */


/* Start:/local/templates/zerapy/components/bitrix/system.pagenavigation/catalog-ajax/style.css?1779950929619*/
.pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;

	& .pagination__btn {
		display: inline-flex;
		width: 35px;
		height: 35px;
		justify-content: center;
		align-items: center;
		border: 1px solid transparent;
		border-radius: 100px;

		text-decoration: none;
		color: #5A5B6C;

		opacity: 0.4;

		transition: border-color .2s ease-out, opacity .2s ease-out;

		@media (hover: hover) {
			&:hover {
				border-color: #868BAB;

				opacity: 1;
			}
		}

		&.pagination__btn--active {
			border-color: #868BAB;

			opacity: 1;
		}
	}

	& a.pagination__btn {
		cursor: pointer;
	}
}
/* End */


/* Start:/local/templates/zerapy/components/bitrix/catalog.section/main_page_catalog_section/style.css?17799509293425*/
.catalog-section-list {
	display: flex;
	flex-direction: column;
	gap: 40px;

	& .catalog-section-list__group {
		min-width: 0;
	}

	& .catalog-section-list__swiper {
		overflow: visible;
		width: 100%;
	}

	& .catalog-section-list__swiper .swiper-wrapper {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
		gap: 20px;
	}

	& .catalog-section-list__swiper .swiper-slide {
		/* width: 100% !important; */
		height: auto;
		/* margin: 0 !important; */
	}

	& .catalog-section-list__swiper-nav {
		display: none;
		align-items: center;
		justify-content: center;
		gap: 8px;
		padding-bottom: 40px;
	}

	& .catalog-section-list__swiper-nav-pages {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
	}

	& .catalog-section-list__swiper-nav-page {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		min-width: 35px;
		height: 35px;
		padding: 5px 15px 6px;
		border: none;
		border-radius: 100px;
		background: transparent;
		font-family: inherit;
		font-size: 16px;
		font-style: normal;
		font-weight: 400;
		line-height: 22px;
		color: #5a5b6c;
		opacity: 0.4;
		cursor: pointer;
		transition: opacity 0.2s ease-out;
	}

	& .catalog-section-list__swiper-nav-page.is-active {
		opacity: 1;
		border: 1px solid #868bab;
	}

	& .catalog-section-list__swiper-nav-next {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		min-width: 35px;
		height: 35px;
		padding: 5px 15px 6px;
		border: none;
		border-radius: 100px;
		background: transparent;
		color: #5a5b6c;
		opacity: 0.4;
		cursor: pointer;
		transition: opacity 0.2s ease-out;
	}

	& .catalog-section-list__swiper-nav-next:disabled {
		cursor: default;
		opacity: 0.2;
	}

	& .catalog-section-list__swiper-nav-next:not(:disabled):hover {
		opacity: 0.7;
	}

	& .catalog-section-list__link {
		display: flex;
		justify-content: center;
	}
}

@media (max-width: 960px) {
	/* Figma 6448:1625 — заголовок 36/44 на планшете и мобиле (глобально .title--2 остаётся 46 до 600px) */
	.index-block-header.index-block-header--catalog-top-products .index-block-header__title.title--2 {
		font-size: 36px;
		line-height: 44px;
	}

	.catalog-section-list .catalog-section-list__pagination {
		display: none;
	}

	.catalog-section-list .catalog-section-list__swiper-nav:not([hidden]) {
		display: flex;
	}

	.catalog-section-list .catalog-section-list__swiper.swiper-initialized {
		overflow: hidden;
	}

	.catalog-section-list .catalog-section-list__swiper.swiper-initialized .swiper-wrapper {
		display: flex;
		gap: 0;
	}

	/* Карточка 330px, зазор 20px — как в макете; узкие экраны — не шире контейнера */
	.catalog-section-list .catalog-section-list__swiper .swiper-slide {
		box-sizing: border-box;
		/* width: 330px; */
		max-width: 90%;
		flex-shrink: 0;
		height: auto;
		align-self: stretch;
	}

	.catalog-section-list .catalog-section-list__slide .product-card {
		height: 100%;
	}

	.catalog-section-list .product-card__favorite {
		width: 45px;
		height: 45px;
	}

	.catalog-section-list .catalog-section-list__link .btn {
		padding: 12px 84px;
		border: 1px solid #5a5b6c;
		background: transparent;
		color: #5a5b6c;
	}

	.catalog-section-list .catalog-section-list__link .btn:hover {
		opacity: 0.85;
	}
}

/* End */
/* /local/templates/zerapy/components/bitrix/news.detail/lineyka_landing/style.css?177995092911485 */
/* /local/templates/zerapy/components/bitrix/system.pagenavigation/catalog-ajax/style.css?1779950929619 */
/* /local/templates/zerapy/components/bitrix/catalog.section/main_page_catalog_section/style.css?17799509293425 */