/* ==========================================================================
   acf/bonuses-block и acf/promocode — карточки офферов
   Цвета блока приходят инлайном (--bonus-bg, --promocode-background и т.д.).
   Сетку темы (grid-row:span 4 + subgrid) не трогаем, меняем только оформление.
   ========================================================================== */

main .bonuses-block {
	max-width: 760px;
	margin: 1.8rem 0 .5rem;
}

main .bonuses__list {
	gap: 16px;
	grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
}

main .bonus {
	position: relative;
	gap: 18px;
	background: linear-gradient(160deg, var(--bh-surface) 0%, var(--bh-deep-2) 100%);
	border: 1px solid var(--bh-line);
	border-radius: var(--bh-r);
	box-shadow: 0 14px 30px rgba(0, 0, 0, .3);
}

main .bonus::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 4px;
	background: linear-gradient(180deg, var(--bh-orange) 0%, var(--bh-orange-700) 100%);
}

main .bonus:hover {
	border-color: rgba(247, 132, 62, .45);
	box-shadow: 0 20px 40px rgba(0, 0, 0, .42);
}

/* --- Промокод ----------------------------------------------------------- */

main .bonus__promo-code {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 14px 16px 0;
	padding: 9px 16px;
	font-family: var(--bh-display);
	font-size: 1.05rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--bh-orange-300);
	background: rgba(247, 132, 62, .1);
	border: 1px dashed rgba(247, 132, 62, .6);
	border-radius: var(--bh-r-sm);
	transition: background-color .18s var(--bh-ease), color .18s var(--bh-ease);
}

main .bonus__promo-code:hover {
	background: rgba(247, 132, 62, .2);
	color: #fff;
}

main .bonus__promo-code__value {
	font-family: var(--bh-body);
	font-size: 1.02rem;
	font-weight: 700;
	letter-spacing: .12em;
	color: #fff;
}

main .bonus__promo-copied {
	margin: 14px 16px 0;
	padding: 9px 16px;
	color: var(--bh-deep);
	background: var(--bh-yes);
	border-radius: var(--bh-r-sm);
	font-family: var(--bh-display);
	letter-spacing: .05em;
	text-transform: uppercase;
}

/* --- Оффер -------------------------------------------------------------- */

/* Без картинки оффера сетка темы (auto 1fr) ставит подпись и сумму в одну строку. */
main .bonus__type:not(:has(.bonus__type-img)) {
	grid-template-columns: minmax(0, 1fr);
}

main .bonus__type-title {
	font-family: var(--bh-display);
	font-size: 1.05rem;
	font-weight: 600;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: #9fb8cf;
}

main .bonus__type-value {
	font-family: var(--bh-display);
	font-size: clamp(1.7rem, 1.4rem + 1vw, 2.15rem);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: .01em;
	text-transform: uppercase;
	color: var(--bh-text);
}

main .bonus__info {
	color: var(--bh-dim);
}

main .bonus__info-valid {
	display: inline-block;
	align-self: flex-start;
	padding: 4px 10px;
	font-size: .82rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #cfe0ef;
	background: rgba(255, 255, 255, .07);
	border: 1px solid var(--bh-line);
	border-radius: 4px;
}

main .bonus__info-description p {
	font-size: .98rem;
	line-height: 1.6;
	color: var(--bh-dim);
}

/* --- Кнопка оффера ------------------------------------------------------ */

main .bonus__links {
	grid-template-columns: 1fr;
}

main .bonus__link.site-button {
	width: 100%;
	padding: .85rem 1.4rem;
	letter-spacing: .05em;
}

/* --- Отдельный блок промокода ------------------------------------------- */

main .promocode {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 12px 18px;
	font-family: var(--bh-display);
	font-size: 1.15rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--bh-orange-300);
	background: rgba(247, 132, 62, .1);
	border: 1px dashed rgba(247, 132, 62, .6);
	border-radius: var(--bh-r-sm);
}

@media (max-width: 700px) {
	/* На главной блок настроен на две колонки — на телефоне это 171px на карточку,
	   содержимое режется по overflow:hidden. */
	main .bonuses__list {
		grid-template-columns: minmax(0, 1fr);
	}

	main .bonus__type-value {
		font-size: 1.55rem;
	}

	main .bonus__promo-code {
		flex-wrap: wrap;
		font-size: .95rem;
		letter-spacing: .03em;
	}
}
