h1.title {
	max-width: initial !important;
	width: fit-content;
	&.credit {
		width: min(352px, 100%);
	}
}
.promo .left > div:not(.partners) {
	> * * {
		display: contents !important;
		padding: 0;
		margin: 0;
	}
	> :where(h2, h3, h4) {
		font-size: 20px;
		font-weight: 700;
		&:not(:last-child) {
			margin: 20px 0;
		}
		&:first-child {
			margin-top: 0;
		}
	}
	h4 {
		font-size: 16px;
	}
	> p:has(+ div) {
		margin-bottom: 10px;
	}
	> div {
		display: flex;
		gap: 8px;
		&::before {
			content: '';
			width: 10px;
			height: 10px;
			border-radius: 50%;
			margin-left: 5px;
			margin-top: 5px;
			background-color: var(--ff-2-f-00);
			pointer-events: none;
			flex-shrink: 0;
		}
		a {
			display: inline-block !important;
			cursor: pointer !important;
			transition: color .2s linear !important;
		}
	}
}
.promo .left .partners {
	border: none;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	grid-auto-rows: 1fr;
	gap: 10px;
	.item {
		position: relative;
		border-radius: 20px;
		background: var(--white);
		border: 6px solid var(--white);
		display: flex;
		flex-direction: column;
		align-items: center;
		transition: box-shadow .2s linear;
		gap: 10px;
		img {
			height: 110px;
			width: auto;
			aspect-ratio: 200/110;
			object-fit: contain;
		}
		a {
			&:empty {
				position: absolute;
				inset: 0;
			}
			&:not(:empty) {
				position: relative;
				z-index: 1;
				display: flex;
				align-items: center;
				justify-content: center;
				gap: 4px;
				height: 58px;
				width: 100%;
				font-size: 20px;
				border-radius: 14px;
				background: var(--white-grey);
				&::after {
					content: '\e903';
					font: 100 1cap / 1 'icon';
					color: inherit;
				}
			}
		}
	}
}
.guarantee p {
	margin-bottom: 20px;
}
@media screen and (max-width: 1152px) {
	h1.title {
		margin-bottom: -10px !important;
		&.credit {
			width: fit-content;
		}
	}
	.promo .left .partners.item {
		border-width: 4px;
	}
}
@media screen and (max-width: 768px) {
	.promo .left .partners {
		grid-template-columns: repeat(2, 1fr);
		.item {
			border-radius: 10px;
			gap: 5px;
			img {
				height: 50px;
				margin: -2px 0 -3px;
			}
			a:not(:empty) {
				height: 22px;
				font-size: 12px;
				border-radius: 6px;
			}
		}
	}
}
@media screen and (max-width: 540px) {
	.promo .left .partners {
		grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	}
}
@media screen and (hover: hover) {
	.promo > div a:hover,
	.promo .left .partners .item:hover a {
		color: var(--ff-2-f-00);
	}
}