/*
 * Лендинг на сезонна кампания (catalog/view/theme/fastor/template/campaign/landing.tpl).
 * Един файл за всички кампании - цветовете идват като CSS променливи от настройките
 * (Marketing -> Кампания). При промяна смени CSS_VERSION в catalog/controller/campaign/landing.php.
 */
.cl-page {
	--cl-accent: #5b2bd9;
	--cl-accent-dark: #2a1068;
	--cl-hero-bg: #0b0618;
	--cl-top-bg: #f4f5f8;
	--cl-alt-bg: #f5f1ff;
	--cl-text: #1d1d2b;
	--cl-muted: #606575;
	--cl-line: #e3dff0;
	--cl-gap: 16px;
	font-family: 'Inter', 'Open Sans', Arial, sans-serif;
	color: var(--cl-text);
	overflow-x: clip;
}

.cl-wrap {
	max-width: 1360px;
	margin: 0 auto;
	padding: 0 16px;
}

.cl-preview {
	background: #fff4d6;
	color: #6b4b00;
	text-align: center;
	font-size: 13px;
	padding: 8px 16px;
}

/* ---------- Hero ---------- */
.cl-hero {
	position: relative;
	background: var(--cl-hero-bg);
	text-align: center;
}
.cl-hero picture,
.cl-hero-img {
	display: block;
	width: 100%;
	max-width: 1920px;
	height: auto; /* пропорцията идва от width/height на img/source */
	margin: 0 auto;
}
/* Широк банер (3840x610): естествената пропорция (15.885vw), без рязане горе/долу - надписът и козелът са на цялата
   височина (банер от 04.11.2026). Под ~1070px се държи поне 170px и се режат само страните (съдържанието е в средните 40%). */
@media (min-width: 768px) {
	.cl-hero-wide picture { max-width: none; }
	.cl-hero-wide .cl-hero-img {
		max-width: none;
		height: max(170px, 15.885vw);
		object-fit: cover;
		object-position: 50% 50%;
	}
}
.cl-hero-title {
	margin: 0;
	padding: 72px 16px;
	color: #fff;
	font-size: 44px;
	font-weight: 800;
}
.cl-back {
	position: absolute;
	top: 14px;
	left: 16px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 13px;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 8px;
	background: rgba(10, 6, 24, .45);
	color: #fff !important;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: none !important;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	transition: background .15s;
}
.cl-back:hover { background: rgba(10, 6, 24, .7); }
.cl-back:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.cl-usps { display: none; }
.cl-ico { flex: 0 0 auto; display: inline-block; vertical-align: -2px; }

/* ---------- Навигация ---------- */
.cl-nav-slot { position: relative; z-index: 60; }
.cl-nav {
	position: relative;
	left: 0;
	right: 0;
	background: rgba(255, 255, 255, .97);
	border-bottom: 1px solid var(--cl-line);
	box-shadow: 0 1px 0 rgba(0, 0, 0, .02);
}
.cl-nav.is-stuck {
	position: fixed;
	box-shadow: 0 4px 14px rgba(29, 16, 70, .08);
}
.cl-nav-inner {
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 1360px;
	margin: 0 auto;
	padding: 0 16px;
}
.cl-nav-arrow {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0 0 3px;
	border: 1px solid var(--cl-line);
	border-radius: 8px;
	background: #fff;
	color: var(--cl-text);
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	transition: background .15s, border-color .15s, opacity .15s;
}
.cl-nav-arrow:disabled { opacity: .35; cursor: default; }
.cl-nav-arrow:focus-visible { outline: 2px solid var(--cl-accent); outline-offset: 2px; }
.cl-nav-track {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	gap: 8px;
	padding: 10px 2px;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.cl-nav-track::-webkit-scrollbar { display: none; }
.cl-nav-link {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	height: 36px;
	padding: 0 14px;
	border: 1px solid var(--cl-line);
	border-radius: 8px;
	background: #fff;
	color: var(--cl-text) !important;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
	text-decoration: none !important;
	transition: background .15s, color .15s, border-color .15s;
}
.cl-nav-link:hover { border-color: var(--cl-accent); color: var(--cl-accent) !important; }
.cl-nav-link.is-active {
	background: var(--cl-accent);
	border-color: var(--cl-accent);
	color: #fff !important;
}
.cl-nav-link:focus-visible,
.cl-more-top:focus-visible,
.cl-more-btn:focus-visible,
.cl-card:focus-visible { outline: 2px solid var(--cl-accent); outline-offset: 2px; }

/* ---------- Секции ---------- */
.cl-section {
	padding: 34px 0 38px;
	scroll-margin-top: var(--cl-offset, 72px);
}
.cl-bg-white { background: #fff; }
.cl-bg-alt { background: var(--cl-alt-bg); }
.cl-bg-top { background: var(--cl-top-bg); }

.cl-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 23px;
}
.cl-head h2 {
	margin: 0;
	color: var(--cl-text);
	font-family: inherit;
	font-size: 28px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -.01em;
	text-transform: none;
}
.cl-head p {
	margin: 7px 0 0;
	color: var(--cl-muted);
	font-size: 15px;
	line-height: 1.45;
}
.cl-more-top {
	flex: 0 0 auto;
	color: var(--cl-accent) !important;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none !important;
}
.cl-more-top:hover { color: var(--cl-accent-dark) !important; }

/* ---------- Продуктова мрежа ---------- */
.cl-grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: var(--cl-gap);
}
.cl-page .product-grid > .cl-item {
	position: relative;
	min-width: 0;
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.cl-item > .product,
.cl-item .product-desktop {
	height: 100%;
	margin: 0 !important;
	background: #fff;
	border-radius: 12px;
}
/* Картата на сайта има отделен мобилен вариант-списък; тук мрежата е по дизайн 2 колони. */
.cl-page .cl-item .product-mobile { display: none !important; }
.cl-page .cl-item .product-desktop { display: block !important; }
.cl-page .cl-item .black-friday-saled { border-radius: 12px; }
/* Брояча до края на промоцията темата го слага сама (датата на кампанията) - тук е излишен. */
.cl-page .cl-item [id^="countdown"] { display: none !important; }

.cl-rank {
	position: absolute;
	top: -8px;
	left: -8px;
	z-index: 20;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border: 2px solid #fff;
	border-radius: 50%;
	background: #e3262f;
	color: #fff;
	font-size: 13px;
	font-weight: 800;
	line-height: 1;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
}

.cl-more {
	margin-top: 22px;
	text-align: center;
}
.cl-more-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 260px;
	height: 42px;
	padding: 0 22px;
	border: 1px solid #cfc6ea;
	border-radius: 8px;
	background: #fff;
	color: var(--cl-accent-dark) !important;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none !important;
	transition: border-color .15s, color .15s;
}
.cl-more-btn:hover { border-color: var(--cl-accent); color: var(--cl-accent) !important; }

/* ---------- Финална навигация ---------- */
.cl-final {
	padding: 38px 0 44px;
	background: #fff;
	border-top: 1px solid var(--cl-line);
}
.cl-final h2 {
	margin: 0 0 20px;
	color: var(--cl-text);
	font-family: inherit;
	font-size: 26px;
	font-weight: 800;
	text-transform: none;
}
.cl-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}
.cl-card {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 104px;
	padding: 16px 52px 16px 20px;
	overflow: hidden;
	border: 1px solid var(--cl-line);
	border-radius: 12px;
	background: #fff;
	color: var(--cl-text) !important;
	text-decoration: none !important;
	transition: border-color .15s, box-shadow .15s;
}
.cl-card:hover { border-color: var(--cl-accent); box-shadow: 0 6px 18px rgba(42, 16, 104, .08); }
.cl-card-text { flex: 1 1 auto; min-width: 0; }
.cl-card-text strong {
	display: block;
	color: var(--cl-accent);
	font-size: 17px;
	font-weight: 800;
	line-height: 1.2;
}
.cl-card-text span {
	display: block;
	margin-top: 4px;
	color: var(--cl-muted);
	font-size: 13px;
	line-height: 1.35;
}
.cl-card img {
	flex: 0 0 auto;
	width: 110px;
	height: 82px;
	object-fit: contain;
}
.cl-card-go {
	position: absolute;
	right: 14px;
	bottom: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 7px;
	background: var(--cl-accent);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
}

/* ---------- Адаптивност ---------- */
@media (max-width: 1199px) {
	.cl-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
	.cl-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.cl-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
	.cl-page { --cl-gap: 10px; }
	.cl-wrap { padding: 0 12px; }
	/* На мобилно бутонът е ред над изображението - иначе застъпва надписа. */
	.cl-back {
		position: static;
		display: flex;
		width: 100%;
		min-height: 44px;
		padding: 0 12px;
		border: 0;
		border-radius: 0;
		background: transparent;
		font-size: 13px;
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
	}
	/* Картата на сайта е за ~260px; в две колони я сгъстяваме: 3 реда характеристики, цена над бутона. */
	.cl-page .cl-item .nl-product-footer { height: auto; padding: 6px 0 0; }
	.cl-page .cl-item .nl-attributes-link { width: 100%; padding: 0 10px; }
	.cl-page .cl-item .param-row ~ .param-row ~ .param-row ~ .param-row { display: none; }
	.cl-page .cl-item .param-row svg { display: none; }
	.cl-page .cl-item .param-row .label {
		overflow: hidden;
		font-size: 11px;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	.cl-page .cl-item .nl-price-btn-wrapper { position: relative; width: 100%; min-height: 64px; }
	.cl-page .cl-item .nl-product-footer .price { bottom: 10px; margin: 0 0 0 10px !important; }
	.cl-page .cl-item .nl-product-footer .price-label { display: none; }
	.cl-page .cl-item .nl-product-footer .price .price-new,
	.cl-page .cl-item .nl-price { font-size: 17px; line-height: 22px; }
	.cl-page .cl-item .nl-product-footer .price .price-old { font-size: 12px; line-height: 16px; }
	.cl-page .cl-item .nl-buy-div { width: 46px; height: 46px; border-radius: 14px 0 12px 0 !important; }
	.cl-usps {
		display: flex;
		justify-content: center;
		margin: 0;
		padding: 10px 8px 12px;
		list-style: none;
		border-top: 1px solid rgba(255, 255, 255, .08);
	}
	.cl-usps li {
		flex: 1 1 0;
		min-width: 0;
		padding: 0 6px;
		color: rgba(255, 255, 255, .72);
		font-size: 11px;
		line-height: 1.3;
	}
	.cl-usps li + li { border-left: 1px solid rgba(255, 255, 255, .18); }
	.cl-usps strong {
		display: block;
		color: #fff;
		font-size: 12px;
		font-weight: 700;
	}
	.cl-nav-inner { gap: 6px; padding: 0 8px; }
	.cl-nav-arrow { width: 36px; height: 36px; }
	.cl-nav-track { gap: 6px; padding: 8px 2px; }
	.cl-nav-link { height: 34px; padding: 0 12px; font-size: 12.5px; }
	.cl-section { padding: 24px 0 26px; }
	.cl-head { margin-bottom: 17px; }
	.cl-head h2 { font-size: 22px; }
	.cl-head p { margin-top: 6px; font-size: 13.5px; }
	.cl-more-top { display: none; }
	.cl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cl-more { margin-top: 18px; }
	.cl-more-btn {
		display: flex;
		width: 100%;
		min-width: 0;
		height: 48px;
		white-space: normal;
		text-align: center;
	}
	.cl-rank { top: -6px; left: -6px; width: 26px; height: 26px; font-size: 12px; }
	.cl-final { padding: 28px 0 32px; }
	.cl-final h2 { font-size: 21px; margin-bottom: 14px; }
	.cl-cards { gap: 10px; }
	.cl-card {
		flex-direction: column;
		align-items: flex-start;
		min-height: 0;
		padding: 12px 12px 44px;
	}
	.cl-card-text strong { font-size: 15px; }
	.cl-card-text span { font-size: 12px; }
	.cl-card img { width: 96px; height: 72px; align-self: center; }
	.cl-card-go { right: 10px; bottom: 10px; }
}
@media (max-width: 359px) {
	.cl-grid { gap: 8px; }
	.cl-head h2 { font-size: 21px; }
}
/* ---------- Кратко описание в картата (spec_lines от контролера) ---------- */
.cl-page .cl-item .nl-specs {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	max-height: calc(3 * 1.35em);
	color: #7b8790;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.35;
	text-align: left;
	overflow-wrap: anywhere;
}
/* Картата по одобрения макет: етикети 40px, снимка с отстъп и еднаква пропорция (5:4), заглавие вляво
 * в 2 реда, параметри точно 3 реда, цена без надпис „Цена:“ и количка в долния десен ъгъл.
 * Всяка част е с фиксирана височина - всички карти са еднакви, без празно място. */
.cl-page .cl-item .image {
	height: auto !important;
	padding: 4px 12px 0;
}
.cl-page .cl-item .image a { display: block; }
.cl-page .cl-item .image img {
	display: block;
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 5 / 4;
	object-fit: contain;
}
.cl-page .cl-item .name {
	height: 44px; /* 2 реда x 21px + място за долните елементи на буквите */
	min-height: 0;
	margin: 16px 14px 0 !important;
	font-size: 16px;
	line-height: 21px;
	text-align: left;
}
.cl-page .cl-item .name a {
	color: inherit;
	font-size: inherit;
	line-height: inherit;
}
.cl-page .cl-item .nl-product-footer {
	flex: 1 0 auto;
	height: auto;
	padding: 8px 0 0;
	align-items: stretch;
}
.cl-page .cl-item .nl-attributes-link {
	flex: 0 0 auto;
	width: 100%;
	padding: 0 14px;
}
.cl-page .cl-item .nl-specs { height: calc(3 * 1.35em); }
.cl-page .cl-item .nl-price-btn-wrapper {
	position: relative;
	width: 100%;
	min-height: 72px;
	margin-top: 10px;
}
.cl-page .cl-item .nl-product-footer .price-label { display: none; }
.cl-page .cl-item .nl-product-footer .price {
	left: 0;
	bottom: 16px;
	margin: 0 0 0 14px !important;
}
.cl-page .cl-item .nl-product-footer .price .price-old { font-size: 13px; line-height: 18px; }
.cl-page .cl-item .nl-product-footer .price .price-new,
.cl-page .cl-item .nl-price { font-size: 20px; line-height: 24px; }
/* Етикет за клас: иконата не се свива и не се скрива (темата я маха под 1200px, а при „A-“ я свива до 0). */
.cl-page .cl-item .nl-class-box {
	gap: 7px !important;
	padding: 0 8px;
}
.cl-page .cl-item .nl-class-box svg {
	display: block !important;
	flex: 0 0 auto;
	width: 18px;
	height: 17px;
	right: 0;
}
/* Hover панелът на темата (любими/сравни/количка) с полупрозрачен фон застъпва описанието - тук не се ползва. */
.cl-page .cl-item .only-hover { display: none !important; }
/* Цялата долна част на картата води към продукта (скриптът в landing.tpl); количката остава отделен бутон. */
.cl-page .cl-item .right { cursor: pointer; }
.cl-page .cl-item .nl-buy-div,
.cl-page .cl-item .nl-buy-div a { cursor: pointer; } /* <a onclick> без href иначе е стрелка */
.cl-page .cl-item .right:hover .name { color: var(--cl-accent); }
.cl-page .cl-item .nl-buy-div {
	width: 76px;
	height: 64px;
	border-radius: 24px 0 12px 0 !important;
}
@media (max-width: 767px) {
	.cl-page .cl-item .nl-specs { font-size: 11px; }
	.cl-page .cl-item .image { padding: 4px 8px 0; }
	.cl-page .cl-item .nl-class-box { gap: 5px !important; padding: 0 6px; }
	.cl-page .cl-item .nl-class-box svg { width: 16px; height: 15px; }
	.cl-page .cl-item .name { height: 36px; margin: 10px 10px 0 !important; font-size: 14px; line-height: 18px; }
	.cl-page .cl-item .nl-attributes-link { padding: 0 10px; }
	.cl-page .cl-item .nl-price-btn-wrapper { min-height: 60px; margin-top: 6px; }
	.cl-page .cl-item .nl-product-footer .price { bottom: 10px; margin: 0 0 0 10px !important; }
	.cl-page .cl-item .nl-product-footer .price .price-new,
	.cl-page .cl-item .nl-price { font-size: 17px; line-height: 22px; }
	.cl-page .cl-item .nl-product-footer .price .price-old { font-size: 12px; line-height: 16px; }
	.cl-page .cl-item .nl-buy-div { width: 46px; height: 46px; border-radius: 14px 0 12px 0 !important; }
}

/* ============================================================
 * Black Friday: тъмна навигация, тъмен ТОП 10, редуващи се
 * светли фонове. Само за preset black_friday - другите кампании
 * (Коледа) остават с цветовете от настройките.
 * ============================================================ */
.cl-preset-black_friday .cl-nav {
	background: #171126;
	border-bottom: 1px solid rgba(133, 64, 232, .35);
	box-shadow: none;
}
.cl-preset-black_friday .cl-nav.is-stuck { box-shadow: 0 4px 16px rgba(10, 4, 24, .35); }
.cl-preset-black_friday .cl-nav-link {
	border: 1px solid #8540e8;
	background: #292238;
	color: #fff !important;
	box-shadow: 0 0 6px rgba(133, 64, 232, .35);
	transition: background .15s, border-color .15s, box-shadow .15s;
}
.cl-preset-black_friday .cl-nav-link:hover {
	border-color: #b16aff;
	background: #41246c;
	color: #fff !important;
	box-shadow: 0 0 9px rgba(177, 106, 255, .5);
}
.cl-preset-black_friday .cl-nav-link.is-active {
	border-color: #b16aff;
	background: #6928e8;
	color: #fff !important;
	box-shadow: 0 0 10px rgba(177, 106, 255, .55);
}
.cl-preset-black_friday .cl-nav-link:focus-visible { outline: 2px solid #b16aff; outline-offset: 2px; }

/* Секции след ТОП 10: А/Б (контролерът ги редува white/alt) */
.cl-preset-black_friday .cl-bg-white { background: #f0f1f5; }
.cl-preset-black_friday .cl-bg-alt { background: #ede7f7; }
.cl-preset-black_friday .cl-head h2 { color: #24202d; }
.cl-preset-black_friday .cl-head h2::after {
	content: '';
	display: block;
	width: 120px;
	height: 3px;
	margin-top: 10px;
	border-radius: 3px;
	background: #923bff;
}

/* ТОП 10 - единствената тъмна продуктова секция */
.cl-preset-black_friday .cl-bg-top {
	background: linear-gradient(180deg, #30134f 0%, #39205b 35%, #ede7f7 100%);
}
.cl-preset-black_friday .cl-bg-top .cl-head h2 { color: #fff; }
.cl-preset-black_friday .cl-bg-top .cl-head p { color: #d2cbdd; }
.cl-preset-black_friday .cl-bg-top .cl-item > .product,
.cl-preset-black_friday .cl-bg-top .cl-item .product-desktop { box-shadow: 0 6px 20px rgba(0, 0, 0, .28); }

@media (max-width: 767px) {
	.cl-preset-black_friday .cl-head h2::after { width: 100px; margin-top: 8px; }
	.cl-preset-black_friday .cl-nav-link { box-shadow: 0 0 5px rgba(133, 64, 232, .35); }
}

/* Стандартният хедър на сайта е скрит само на Black Friday страницата (body.campaign-landing е само на лендинга). */
body.campaign-landing:has(.cl-preset-black_friday) #mobile-contact,
body.campaign-landing:has(.cl-preset-black_friday) #main > header { display: none !important; }
.cl-preset-black_friday .cl-usps { display: none !important; }

.cl-preset-black_friday .cl-nav-arrow {
	border-color: #8540e8;
	background: #292238;
	color: #fff;
	box-shadow: 0 0 6px rgba(133, 64, 232, .35);
}
.cl-preset-black_friday .cl-nav-arrow:not(:disabled):hover { border-color: #b16aff; background: #41246c; }
.cl-preset-black_friday .cl-nav-arrow:disabled { opacity: .4; box-shadow: none; }
.cl-preset-black_friday .cl-nav-arrow:focus-visible { outline-color: #b16aff; }

/* „Избери според бюджета“: тъмен градиент, тъмни карти, изображение вдясно ~40% */
.cl-preset-black_friday .cl-final {
	border-top: 0;
	background: linear-gradient(120deg, #30154d 0%, #211238 55%, #171126 100%);
}
.cl-preset-black_friday .cl-final h2 { color: #fff; }
.cl-preset-black_friday .cl-card {
	min-height: 128px;
	padding: 14px 14px 14px 20px;
	border: 1px solid #69439a;
	border-radius: 12px;
	background: #2c2040;
	color: #fff !important;
	box-shadow: none;
	transition: border-color .15s;
}
.cl-preset-black_friday .cl-card:hover { border-color: #b16aff; box-shadow: none; }
.cl-preset-black_friday .cl-card-text { padding-bottom: 38px; }
.cl-preset-black_friday .cl-card-text strong { color: #fff; }
.cl-preset-black_friday .cl-card-text span { color: #d2cbdd; }
.cl-preset-black_friday .cl-card img {
	width: 40%;
	max-width: 190px;
	height: 100px;
	object-fit: contain;
	object-position: right center;
}
.cl-preset-black_friday .cl-card-go {
	left: 20px;
	right: auto;
	bottom: 14px;
	width: 32px;
	height: 28px;
	border-radius: 8px;
	background: #6928e8;
}
.cl-preset-black_friday .cl-card:hover .cl-card-go { background: #8540e8; }
.cl-preset-black_friday .cl-card:focus-visible { outline-color: #b16aff; }
@media (max-width: 767px) {
	.cl-preset-black_friday .cl-card { min-height: 0; padding: 12px 12px 48px; }
	.cl-preset-black_friday .cl-card-text { padding-bottom: 0; }
	.cl-preset-black_friday .cl-card img { width: 100%; max-width: none; height: 72px; object-position: center; }
	.cl-preset-black_friday .cl-card-go { left: auto; right: 10px; bottom: 10px; }
}

/* ---------- Бутон „Към началото“ (долу вдясно, показва се след първия екран) ---------- */
.cl-totop {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 70;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--cl-accent);
	border-radius: 10px;
	background: var(--cl-accent);
	color: #fff;
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .2s, transform .2s, visibility .2s, background .15s, border-color .15s, box-shadow .15s;
}
.cl-totop.is-visible { opacity: 1; visibility: visible; transform: none; }
.cl-totop:focus-visible { outline: 2px solid var(--cl-accent); outline-offset: 3px; }
.cl-preset-black_friday .cl-totop {
	border-color: #8540e8;
	background: #292238;
	box-shadow: 0 0 8px rgba(133, 64, 232, .45), 0 6px 16px rgba(10, 4, 24, .3);
}
.cl-preset-black_friday .cl-totop:hover {
	border-color: #b16aff;
	background: #6928e8;
	box-shadow: 0 0 12px rgba(177, 106, 255, .6), 0 6px 16px rgba(10, 4, 24, .3);
}
.cl-preset-black_friday .cl-totop:focus-visible { outline-color: #b16aff; }
@media (max-width: 767px) {
	.cl-totop { right: 14px; bottom: 16px; }
}

@media (prefers-reduced-motion: reduce) {
	.cl-page * { transition: none !important; }
}

/* Етикети върху снимката (Black Friday оферта, Windows 11 +25 € ...): темата ги реди през bottom: 14% + i*10%
   (inline стил). Снимката в картите на лендинга е ~183px, 10% = 18px при етикет 25px -> застъпване.
   Тук стъпката е фиксирана в пиксели. Етикетите са DIV след IMG, затова nth-of-type брои само тях. */
.cl-page .nl-product-bottom { font-size: 13px !important; line-height: 16px !important; padding: 3px 7px !important; white-space: nowrap; }
.cl-page .nl-product-bottom:nth-of-type(1) { bottom: 6px !important; }
.cl-page .nl-product-bottom:nth-of-type(2) { bottom: 32px !important; }
.cl-page .nl-product-bottom:nth-of-type(3) { bottom: 58px !important; }
