/**
 * Home special offer — shared anatomy and responsive rules.
 * Visual skins live in assets/css/offer-cards/*.css and only the selected skin
 * is loaded. Keep structural rules here so new skins never duplicate markup.
 */
.ln-offer {
	--ln-offer-radius: 26px;
	--ln-offer-accent: #c9a35c;
	--ln-offer-secondary: #0c3b34;
	--ln-offer-surface: #fffdf8;
	--ln-offer-text: #15302b;
	--ln-offer-muted: #71807b;
	--ln-offer-copy: var(--ln-offer-text);
	--ln-offer-copy-muted: var(--ln-offer-muted);
	--ln-offer-panel: var(--ln-offer-surface);
	--ln-offer-media: #f2eee3;
	--ln-offer-countdown: color-mix(in srgb, var(--ln-offer-secondary) 6%, white);
	--ln-offer-countdown-border: color-mix(in srgb, var(--ln-offer-secondary) 14%, transparent);
	--ln-offer-shadow: 0 24px 70px color-mix(in srgb, var(--ln-offer-secondary) 14%, transparent);
}

.ln-offer__box {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.02fr) minmax(340px, .98fr);
	min-height: 430px;
	overflow: hidden;
	border: 1px solid color-mix(in srgb, var(--ln-offer-accent) 30%, transparent);
	border-radius: var(--ln-offer-radius);
	background: var(--ln-offer-panel);
	box-shadow: var(--ln-offer-shadow);
	isolation: isolate;
}

.ln-offer__copy {
	position: relative;
	z-index: 2;
	display: flex;
	min-width: 0;
	padding: clamp(38px, 4.6vw, 64px);
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 13px;
	color: var(--ln-offer-copy);
}

.ln-offer__kicker {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	color: var(--ln-offer-accent);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .01em;
}

.ln-offer__kicker::before {
	width: 30px;
	height: 1px;
	background: currentColor;
	content: "";
	opacity: .78;
}

.ln-offer__copy h2 {
	max-width: 15ch;
	margin: 0;
	color: inherit;
	font: 700 clamp(31px, 3.15vw, 44px)/1.4 var(--ln-font-display);
	letter-spacing: -.012em;
	text-wrap: balance;
}

.ln-offer__discount {
	display: inline-flex;
	min-height: 31px;
	padding: 4px 12px;
	align-items: center;
	border: 1px solid color-mix(in srgb, var(--ln-offer-accent) 50%, transparent);
	border-radius: 999px;
	background: color-mix(in srgb, var(--ln-offer-accent) 12%, transparent);
	color: var(--ln-offer-accent);
	font-size: 12px;
	font-weight: 850;
}

.ln-offer__text {
	max-width: 48ch;
	margin: 0;
	color: var(--ln-offer-copy-muted);
	font-size: 13.5px;
	line-height: 2.05;
}

.ln-offer__price {
	display: flex;
	min-height: 44px;
	align-items: center;
	gap: 11px;
	color: var(--ln-offer-copy);
}

.ln-offer__price > span {
	color: var(--ln-offer-copy-muted);
	font-size: 10.5px;
	font-weight: 650;
}

.ln-offer__price > strong {
	font-size: 16px;
	font-weight: 850;
}

.ln-offer__price del {
	margin-inline-end: 7px;
	color: var(--ln-offer-copy-muted);
	font-size: 11px;
	opacity: .72;
}

.ln-offer__price ins {
	color: inherit;
	text-decoration: none;
}

.ln-countdown {
	display: flex;
	max-width: 100%;
	gap: 8px;
	margin-top: 1px;
}

.ln-countdown > span {
	display: flex;
	width: 62px;
	min-height: 58px;
	padding: 7px 4px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--ln-offer-countdown-border);
	border-radius: 11px;
	background: var(--ln-offer-countdown);
	text-align: center;
}

.ln-countdown b {
	color: var(--ln-offer-copy);
	font-size: 18px;
	font-weight: 850;
	line-height: 1.25;
}

.ln-countdown i {
	color: var(--ln-offer-copy-muted);
	font-size: 9.5px;
	font-style: normal;
	line-height: 1.5;
}

.ln-offer__button {
	min-height: 47px;
	margin-top: 5px;
	padding-inline: 25px;
	border-radius: 12px;
	background: var(--ln-offer-accent);
	box-shadow: 0 12px 28px color-mix(in srgb, var(--ln-offer-accent) 24%, transparent);
	color: var(--ln-offer-secondary);
}

.ln-offer__button:hover {
	background: color-mix(in srgb, var(--ln-offer-accent) 84%, white);
	color: var(--ln-offer-secondary);
}

.ln-offer__button > span {
	font-size: 17px;
	transition: transform .2s ease;
}

.ln-offer__button:hover > span { transform: translateX(-3px); }

.ln-offer__media {
	position: relative;
	z-index: 1;
	display: grid;
	min-width: 0;
	min-height: 430px;
	place-items: center;
	overflow: hidden;
	background: var(--ln-offer-media);
}

.ln-offer__media img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: contain;
	object-position: center;
	transition: transform .55s cubic-bezier(.22, .7, .24, 1), filter .35s ease;
}

.ln-offer--fit-cover .ln-offer__media img { object-fit: cover; }
.ln-offer--fit-contain .ln-offer__media img { padding: clamp(18px, 3vw, 42px); }
.ln-offer__box:hover .ln-offer__media img { transform: scale(1.025); }
.ln-offer--fit-contain .ln-offer__box:hover .ln-offer__media img { transform: translateY(-4px) scale(1.018); }

.ln-offer__badge {
	position: absolute;
	z-index: 3;
	top: 20px;
	right: 20px;
	display: inline-flex;
	min-height: 37px;
	padding: 7px 13px;
	align-items: center;
	border: 1px solid color-mix(in srgb, var(--ln-offer-accent) 58%, white);
	border-radius: 999px;
	background: var(--ln-offer-secondary);
	box-shadow: 0 10px 25px rgba(0, 0, 0, .13);
	color: #fff;
	font-size: 11px;
	font-weight: 850;
}

.ln-offer--media-start .ln-offer__media { order: -1; }

@media (max-width: 900px) {
	.ln-offer__box { grid-template-columns: minmax(0, 1fr) minmax(300px, .86fr); min-height: 390px; }
	.ln-offer__copy { padding: 38px; }
	.ln-offer__media { min-height: 390px; }
}

@media (max-width: 700px) {
	.ln-offer__box { grid-template-columns: 1fr; min-height: 0; border-radius: min(var(--ln-offer-radius), 22px); }
	.ln-offer__copy { order: 2; padding: 31px 23px 34px; }
	.ln-offer__copy h2 { max-width: 17ch; font-size: clamp(29px, 9vw, 36px); }
	.ln-offer__media, .ln-offer--media-start .ln-offer__media { order: 1; min-height: 300px; aspect-ratio: 16 / 10; }
	.ln-offer--fit-contain .ln-offer__media img { padding: 18px 26px; }
	.ln-offer__badge { top: 14px; right: 14px; }
}

@media (max-width: 430px) {
	.ln-countdown { width: 100%; gap: 5px; }
	.ln-countdown > span { width: calc((100% - 15px) / 4); min-width: 0; }
	.ln-offer__button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.ln-offer__media img, .ln-offer__button > span { transition: none; }
	.ln-offer__box:hover .ln-offer__media img { transform: none; }
}
