:root {
	--container: calc(1300px);
	--new-font-family: "MieleElements", sans-serif;
	--new-second-family: "Helvetica Neue", sans-serif;
}

/* FONTS START */
@font-face {
	font-family: "Helvetica Neue";
	font-display: swap;
	src: url("../fonts/HelveticaNeue-Bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
}
@font-face {
	font-family: "Helvetica Neue";
	font-display: swap;
	src: url("../fonts/HelveticaNeue-Light.woff2") format("woff2");
	font-weight: 300;
	font-style: normal;
}
/* FONTS END */

/* COMMON START */

.ibg {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ibg_contain {
	object-fit: contain;
}

.new-button {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 8px;

	font-family: var(--new-second-family);
	font-weight: 700;
	font-size: 13px;
	line-height: 154%;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: #1e1e1e;

	border-radius: 9999px;
	padding: 4px 20px;
	min-height: 44px;
	background-color: #f59b00;

	transition: opacity 0.2s ease;
}

.new-button_texted {
	padding: 4px 0;
	background-color: transparent;
}

.new-button_angle-right {
}
.new-button_angle-right::after {
	content: "";
	background-image: url("../images/icons/icon-angle-next.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px;
	width: 16px;
	height: 16px;
}

.new-title {
	font-family: var(--new-font-family);
	font-weight: 700;
	font-size: 44px;
	line-height: 120%;
	color: #1e1e1e;
}
a:has(.hero-slider__title.new-title):hover {
	text-decoration: none;
	opacity: 0.85;
}

.new-second-title {
	font-family: var(--new-font-family);
	font-weight: 700;
	font-size: 34px;
	line-height: 166%;
	color: #1e1e1e;
}

.control-slider {
	display: flex;
	align-items: center;
	gap: 16px;
}

.control-slider__scrollbar {
	flex: 1;
}

.control-slider__navigation {
}

.navigation {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
}

.navigation__button {
	cursor: pointer;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1px solid #89867e;
	background: none;
	transition: transform 0.3s ease, opacity 0.1s ease;
}

.navigation__button::before {
	content: "";
	background-image: url("../images/icons/icon-angle-next.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px;
	width: 16px;
	height: 16px;
}

@media (any-hover: hover) {
	.navigation__button:not([disabled]):hover {
		transform: scale(1.1);
	}
}

.navigation__button_prev::before {
	transform: scaleX(-1);
}

.navigation__button[disabled] {
	opacity: 0.4;
	cursor: no-drop;
}

.slider-scrollbar {
	cursor: pointer;
	background-color: rgba(30, 30, 30, 0.25);
	height: 1px;
	position: relative;
}

@media (any-hover: hover) {
	.slider-scrollbar:hover .slider-scrollbar__drag::before {
		transform: scaleY(8);
	}
}

.slider-scrollbar:active .slider-scrollbar__drag::before {
	transform: scaleY(8);
}

.slider-scrollbar::before {
	content: "";
	position: absolute;
	inset: -0.5rem 0; /* -8px */
}

.slider-scrollbar__drag {
	cursor: grab;
	position: relative;
	height: 100%;
}

.slider-scrollbar__drag::before,
.slider-scrollbar__drag::after {
	content: "";
	position: absolute;
	inset: 0;
}

.slider-scrollbar__drag::before {
	background-color: #1e1e1e;
	transition: transform 0.3s ease;
}

.slider-scrollbar__drag::after {
	transform: scaleY(8);
}

.slider-scrollbar__drag:focus {
	cursor: grabbing;
}

.pagination-slider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}
.pagination-slider .swiper-pagination-bullet {
	width: 28px;
	height: 4px;
	background: var(--c-light-2);
	border-radius: 0;
	opacity: 1;
}
.pagination-slider .swiper-pagination-bullet-active {
	background: var(--c-red);
}

/* .products-slider {
}

.products-slider__wrapper {
}

.products-slider__product-card {
} */

.products-slider__pagination {
	margin-top: 40px;
}

/* COMMON END */

/* new-hero START */

.new-hero {
}

.new-hero__container {
	max-width: 1500px;
}

.new-hero__slider {
	overflow: hidden;
}

.hero-slider {
}

.hero-slider__slide {
	display: flex;
	gap: 36px;
}

.new-hero__image {
	flex: 0 0 56%; /* 807/1440 */
	aspect-ratio: 807 / 440;
}

.new-hero__image img {
	vertical-align: top;
}

.hero-slider__content {
	max-width: 465px;
	width: 100%;
	padding: 25px 0;

	font-family: var(--new-font-family);
}

.hero-slider__content > * {
	margin-bottom: 24px;
}

.hero-slider__content > :last-child {
	margin-bottom: 0;
}

.hero-slider__text {
	font-weight: 300;
	font-size: 18px;
	line-height: 140%;
	color: #1e1e1e;
}

.hero-slider__link {
	padding-inline: 34px;
}

.hero-slider__control {
	max-width: 1240px;
	margin: 0 auto;
	padding: 22px 0;
}

/* new-hero END */

/* learn-products START */

.learn-products {
	overflow-x: hidden;
	background-color: #f6f5f4;
}

.learn-products__container {
	padding-top: 95px;
}

.learn-products__title {
	text-wrap: balance;
}

.learn-products__title:not(:last-child) {
	margin-bottom: 48px;
}

.learn-products__slider {
}

.learn-products__wrapper:not(:last-child) {
	margin-bottom: 45px;
}

.learn-products__item {
}

.item-learn-products {
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-width: 200px;
	margin-right: 32px;
}

.item-learn-products__image {
	aspect-ratio: 1;
	display: block;
	max-height: max-content;
	transition: opacity 0.2s ease;
}

.item-learn-products,
.item-learn-products__image img {
	max-width: 200px;
	max-height: 200px;
}
@media (min-width: 1268px) {
	.item-learn-products,
	.item-learn-products__image img {
		max-width: 180px;
		max-height: 180px;
	}
}

.item-learn-products__title {
	font-family: var(--new-second-family);
	font-weight: 700;
	font-size: 19px;
	line-height: 147%;
	color: #1e1e1e;

	transition: opacity 0.2s ease;
}

.item-learn-products__title h3 {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	font-weight: inherit;
}

.learn-products__control {
	padding: 22px 0;
}

.learn-products .learn-products__slider {
	/*opacity: 0;*/
}
.learn-products .learn-products__slider.swiper-initialized {
  /*opacity: 1;*/
}

/* learn-products END */

/* .prosucts-section START */

.prosucts-section {
	overflow-x: hidden;
}

.prosucts-section_top-gradient {
	background: linear-gradient(180deg, #d5d2cc 30%, #fff 30%);
}

.prosucts-section__container {
	padding-top: 48px;
	padding-bottom: 96px;
}

.prosucts-section__banner {
}

.prosucts-section__slider {
}

/* .prosucts-section END */

/* .banner-section START */

.banner-section {
	background-color: #d5d2cc;
}

.banner-section__container {
	padding-top: 96px;
	padding-bottom: 48px;
}

/* .banner-section END */

.page-banner {
	display: flex;
}

.page-banner__image {
	flex: 0 0 50.3%; /* 624/1240 */
}

.page-banner__body {
	padding: 64px;
}

.page-banner__body > * {
	margin-bottom: 15px;
}

.page-banner__subtitle {
	font-family: var(--new-second-family);
	font-weight: 700;
	font-size: 15px;
	line-height: 127%;
	color: #1e1e1e;
}

.page-banner__title:not(:last-child) {
	margin-bottom: 15px;
}

.page-banner__title span {
	font-weight: 300;
}

.page-banner__text {
	font-family: var(--new-second-family);
	font-weight: 300;
	font-size: 17px;
	line-height: 141%;
	color: #1e1e1e;

	margin-bottom: 32px;
}

.page-banner__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.page-banner__body > :last-child {
	margin-bottom: 0;
}

.page-banner__button {
}

@media (any-hover: hover) {
	.new-button:hover {
		opacity: 0.8;
		text-decoration: none;
	}

	.item-learn-products__image:hover,
	.item-learn-products__title:hover {
		opacity: 0.8;
		text-decoration: none;
	}
}

/* MEDIA START */

@media (max-width: 1300px) {
	.page-banner__body {
		padding: 32px;
	}
}

.products-slider__wrapper {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 40px 28px;
}

@media (min-width: 768px) {
	.products-slider__wrapper {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 992px) {
	.products-slider__wrapper {
		/*display: grid;*/
		grid-template-columns: repeat(4, 1fr);
		/*gap: 40px 28px;*/
	}
	.products-slider__pagination {
		display: none;
	}
}

@media (max-width: 992px) {
	.new-title {
		font-size: 34px;
	}
	.new-second-title {
		font-size: 30px;
	}

	.new-hero__container {
		padding: 0;
	}
	.hero-slider__slide {
		flex-direction: column;
		gap: 24px;
	}
	.hero-slider__image {
	}
	.hero-slider__content {
		padding: 0 var(--gap);
	}
	.hero-slider__control {
		padding: 16px var(--gap);
	}

	.learn-products__wrapper:not(:last-child) {
		margin-bottom: 24px;
	}
	.learn-products__control {
		padding: 16px 0;
	}

	.page-banner {
		flex-direction: column;
	}
	.page-banner__body {
		padding: 24px 0 0;
	}
}

@media (max-width: 767px) {
	.hero-slider__content {
		max-width: none;
	}
	.hero-slider__link {
		width: 100%;
	}

	.learn-products__title:not(:last-child) {
		margin-bottom: 24px;
	}
	.item-learn-products__title {
		font-size: 16px;
	}

	.prosucts-section__container,
	.banner-section__container {
		padding-top: 32px;
		padding-bottom: 32px;
	}
}

/* MEDIA END */

/* product-card START */

.products .row > div {
	padding: 0 14px;
}

.cl .product-card {
	background: #f5f5f5 !important;
}

/* .product-card  */
.product-card {
	/*border: 1px solid #d9d9d9;*/
	border: 0.5px solid #d9d9d9;
	background-color: #f5f5f5;
	border-radius: 2px;
	padding: 0 16px 24px !important;
	overflow: hidden;
}

.product-card .product-card_image {
	aspect-ratio: 288 / 270;
	width: auto;
	height: auto;
	/*background-color: #f5f5f5;*/
	background-color: #ffffff;
	margin: 0 -16px 20px;
}
.product-card a.product-card_image picture {
	transition: transform 0.4s ease;
	transform: scale(1); 
}
.product-card a.product-card_image picture:hover {
	transform: scale(0.9); 
}

.product-card .product-card_actions {
	position: static;
	padding: 0;
	width: auto;
	height: auto;
	border-radius: 0;
	background-color: transparent;
	flex-direction: row;
	gap: 10px;
	justify-content: flex-start;
	margin-bottom: 16px;
}

.product-card .product-card_actions button {
	width: 24px;
	height: 24px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #71717a;
}

.product-card .product-card_actions button:not(:last-child) {
	margin-bottom: 0;
}

.product-card .product-card_info {
	display: flex;
	flex-direction: column;
}

.product-card .product-card_info h6 {
	flex: 1;
	font-family: var(--new-font-family);
	font-weight: 400;
	font-size: 16px;
	line-height: 130%;
	color: #333;

	max-height: calc(1.3em * 2);
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	white-space: normal;
}

.product-card .product-card_info h6 a {
	color: #333;
}
.product-card .product-card_info h6 a:hover {
	color: #52504c;
	text-decoration: none;
}

.product-card .product-card_info h6:not(:last-child) {
	margin-bottom: 12px;
}

.product-card .product-card_info p {
	font-family: var(--new-font-family);
	font-weight: 300;
	font-size: 12px;
	line-height: 150%;
	color: #333;

	max-height: calc(1.5em * 3);
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	white-space: normal;
}

.product-card .available {
	margin-bottom: 16px;
}

.product-card .available .text {
	line-height: 130%;
	padding-top: 2px;
}

.product-card .product-card-price {
	font-family: var(--new-font-family);
	line-height: 130%;
	margin-bottom: 26px;
}

.product-card .tags {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.product-card .tag {
	/*position: absolute;
	top: 0;
	left: 0;*/

	background-color: #515151;
	border-radius: 0;

	font-family: var(--new-font-family);
	font-weight: 400;
	line-height: 130%;
	padding: 3px 15px;
	
	margin-right: 0 !important;
	margin-bottom: 0;
}

.product-card .btn {
	/*background-color: transparent;*/
	/*background-color: #eae8e5;*/
	background-color: #d5d2cc;
	/*border: 1px solid #000 !important;*/
	height: auto;
	min-height: 42px;
	
	font-family: var(--second-family);
	font-weight: 700;
	font-size: 13px;
	line-height: 154%;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: #1e1e1e;
}

.product-card .expected-delivery {
	font-family: var(--new-font-family);
	font-weight: 400;
	font-size: 14px;
	line-height: 130%;
	text-align: center;
	color: #000;
	
	background: rgba(38, 201, 103, 0.05);
	padding: 10px 16px;
	margin: 14px -16px -24px;
}

@media (any-hover: hover) {
	.product-card .product-card_actions button:hover {
		color: #8c0014;
	}
}

/* product-card END */