h1.title {
	max-width: initial !important;
	width: fit-content;
	padding-left: 0 !important;
}
.promo {
	margin-bottom: 10px;
	gap: 10px;
	*[style] {
		* {
			display: contents;
			font-size: inherit;
			line-height: inherit;
			font-weight: inherit;
		}
		strong {
			font-weight: 700;
		}
	}
	.promo-box {
		position: relative;
		grid-column: 1/-1;
		border-radius: 30px;
		overflow: hidden;
		min-height: 500px;
		padding: 20px;
		display: flex;
		flex-direction: column;
		> img {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			object-fit: cover;
			z-index: -1;
		}
		.content {
			margin-top: auto;
			width: 100%;
			border-radius: 10px;
			background: rgba(255, 255, 255, 0.8);
			backdrop-filter: blur(10px);
			padding: 20px 24% 20px 20px;
			> *:first-child strong:first-of-type {
				color: var(--ff-2-f-00);
			}
		}
	}
	.content-box {
		> .content {
			border-radius: 30px;
			border: 10px solid var(--white);
			background: var(--white-grey);
			padding: 30px;
			display: flex;
			flex-direction: column;
			gap: 10px;
			> p {
				&:has(+ div):not(:first-child) {
					margin-top: 10px;
				}
				&:has(+ p:last-child) {
					margin-top: 20px;
				}
				&:last-child strong {
					font-weight: 700;
				}
			}
			> div {
				padding-left: 25px;
				&::before {
					content: '';
					display: inline-block;
					width: 10px;
					height: 10px;
					margin: 5px 9px 0 -20px;
					border-radius: 50%;
					background-color: var(--ff-2-f-00);
					pointer-events: none;
					flex-shrink: 0;
				}
			}
		}
	}
	> form {
		position: sticky;
		top: 20px;
		margin-top: 10px;
		z-index: 1;
	}
}
.articles {
	padding: 50px 0;
	margin-bottom: 100px;
	background: var(--grey-1);
	.top-box {
		margin-bottom: 20px;
		.title {
			max-width: 352px;
		}
		.controls {
			display: flex;
			gap: 20px;
			.arrow {
				cursor: pointer;
				width: 60px;
				aspect-ratio: 1;
				display: flex;
				justify-content: center;
				align-items: center;
				flex-shrink: 0;
				border-radius: 20px;
				background: var(--white);
				box-shadow: 0px 12px 7px 0px rgba(0, 0, 0, 0.03), 0px 5px 5px 0px rgba(0, 0, 0, 0.04), 0px 1px 3px 0px rgba(0, 0, 0, 0.05);
				&::before {
					content: '\e903';
					font: 100 24px/1 'icon';
				}
			}
			.arrow-l::before {
				transform: rotate(180deg);
			}
			.ws-arrow-disabled {
				background: var(--grey-2);
				box-shadow: none;
				&::before {
					color: var(--grey-4);
				}
			}
		}
	}
	.goods-slider {
		overflow-x: hidden;
		height: 100%;
		border-radius: 30px;
		.slides {
			display: flex;
			gap: 10px;
			align-items: start;
			.item {
				width: 472px;
				flex-shrink: 0;
				padding: 6px;
				background: var(--white);
				border-radius: 30px;
				overflow: hidden;
				img {
					width: 100%;
					aspect-ratio: 46/30;
					border-radius: 24px;
					object-fit: cover;
					margin-bottom: 20px;
				}
				.head {
					font-size: 20px;
					font-weight: 600;
					line-height: 125%;
					display: -webkit-box;
					overflow: hidden;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 2;
					line-clamp: 2;
					padding: 0 20% 0 10px;
					margin-bottom: 8px;
				}
				.box {
					display: flex;
					align-items: end;
					justify-content: space-between;
					padding-inline: 10px;
					margin-bottom: 10px;
					gap: 10px;
					span {
						font-size: 14px;
						font-weight: 600;
						line-height: 125%;
					}
					.btn {
						width: 40px;
						aspect-ratio: 1;
						flex-shrink: 0;
						border-radius: 50%;
						background-color: var(--ff-2-f-00);
						display: flex;
						align-items: center;
						justify-content: center;
						padding: 0;
						&::after {
							content: '\e900';
							font: 400 16px / 1 'icon';
							color: var(--white);
						}
					}
				}
			}
		}
	}
}
@media screen and (max-width: 1152px) {
	.promo {
		gap: 0 !important;
		margin-bottom: 50px !important;
		> form {
			position: static;
			margin-top: 40px;
		}
	}
	.articles {
		padding-bottom: 100px;
		margin-bottom: 0;
		.top-box {
			margin-bottom: 10px;
			.title {
				min-width: 190px;
				width: fit-content;
				gap: 23px;
			}
			.controls {
				gap: 10px;
				.arrow {
					width: 40px;
					border-radius: 12px;
					&::before {
						font-size: 16px;
					}
				}
			}
		}
		.goods-slider .slides .item {
			width: min(370px, 100%);
		}
	}
}
@media screen and (max-width: 768px) {
	h1.title {
		margin-bottom: 30px !important;
	}
	.promo {
		.promo-box {
			padding: 6px;
			.content {
				border-radius: 24px;
				padding: 10px 13px;
				* {
					font-size: 20px !important;
				}
			}
		}
		.content-box > .content {
			padding: 20px 10px;
		}
	}
}
@media (hover: hover) {
	.articles .goods-slider .slides .item .box .btn:hover {
		background-color: var(--white);
		&::after {
			color: var(--ff-2-f-00);
		}
	}
}