/* ============================================================
   Хиро карусел на началната страница - месечна база + продуктови промоции.
   Токените идват от ../style.css (:root --mw-*)
   ============================================================ */

.mw-hero-slider {
	position: relative;
	overflow: hidden;
	background: var(--mw-surface);
}
.mw-hero-slider__track {
	display: flex;
	transition: transform .5s cubic-bezier(.4, 0, .2, 1);
	will-change: transform;
}

.mw-hero-slide {
	flex: 0 0 100%;
	min-width: 0;
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	min-height: 430px;
}
.mw-hero-slide--base { background: var(--mw-secondary); }
.mw-hero-slide--product { background: var(--mw-surface); }

.mw-hero-slide__text {
	align-self: center;
	max-width: 640px;
	margin-left: auto;
	width: 100%;
	padding: 56px 44px 52px;
}
.mw-hero-slide--base .mw-hero-slide__text { max-width: 560px; margin-left: 0; }

.mw-hero-slide__text h1 {
	font: 800 54px/1.04 var(--mw-font-head);
	letter-spacing: -.028em;
	margin: 20px 0 14px;
	color: var(--mw-text);
}
.mw-hero-slide--base .mw-hero-slide__text h1 { color: #fff; }

.mw-hero-slide__text p {
	font-size: 16.5px; line-height: 1.55; margin: 0 0 26px; max-width: 440px;
	color: var(--mw-body);
}
.mw-hero-slide--base .mw-hero-slide__text p { color: rgba(255, 255, 255, .72); }

.mw-hero-slide__cta { display: flex; gap: 12px; flex-wrap: wrap; }
.mw-hero-slide__cta a { text-decoration: none; }
/* специфичността трябва да бие shop.css-ото „a.mw-btn.mw-btn--ghost“ (0,2,1) правило */
.mw-hero-slide--base .mw-hero-slide__cta a.mw-btn--ghost { border-color: #fff; color: #fff !important; }
.mw-hero-slide--base .mw-hero-slide__cta a.mw-btn--ghost:hover { background: #fff; color: var(--mw-secondary) !important; }

.mw-hero-slide__media { position: relative; background: var(--mw-surface); }
.mw-hero-slide--base .mw-hero-slide__media { background: #1a2531; }
.mw-hero-slide__media img {
	width: 100%; height: 100%; object-fit: contain; object-position: center;
	display: block;
}

.mw-hero-slide__stats {
	height: 100%; display: grid; grid-template-columns: 1fr 1fr;
	gap: 22px; align-content: center; padding: 40px;
}
.mw-hero-slide__stats > div { text-align: center; }
.mw-hero-slide__stats .mw-stat { color: #fff; }
.mw-hero-slide__stats > div span:last-child { font-size: 13px; color: rgba(255, 255, 255, .68); }

/* dots - светла хапче-форма, за да са видими и на светъл, и на тъмен слайд */
.mw-hero-slider__dots {
	position: absolute; left: 44px; bottom: 22px; z-index: 5;
	display: flex; gap: 8px; align-items: center;
	background: rgba(255, 255, 255, .55);
	backdrop-filter: blur(6px);
	padding: 7px 9px; border-radius: 999px;
}
.mw-dot {
	width: 8px; height: 8px; border-radius: 999px; border: 0; padding: 0; cursor: pointer;
	background: rgba(20, 30, 43, .3);
	transition: width .2s ease, background .2s ease;
}
.mw-dot.is-active { width: 22px; background: var(--mw-primary); }

.mw-hero-slider__arrow {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
	width: 36px; height: 36px; border-radius: 50%;
	border: 1px solid var(--mw-border); background: #fff; color: var(--mw-text);
	font-size: 18px; line-height: 1; cursor: pointer; opacity: .85;
	display: flex; align-items: center; justify-content: center;
}
.mw-hero-slider__arrow:hover { opacity: 1; }
.mw-hero-slider__arrow--prev { left: 16px; }
.mw-hero-slider__arrow--next { right: 16px; }

@media (max-width: 1024px) {
	.mw-hero-slide { grid-template-columns: 1fr; }
	.mw-hero-slide__text { margin: 0; max-width: none; }
	.mw-hero-slide__media { min-height: 280px; order: -1; }
}
@media (max-width: 767px) {
	.mw-hero-slide__text { padding: 24px 18px 22px; }
	.mw-hero-slide__text h1 { font-size: 26px; }
	.mw-hero-slide__media { min-height: 220px; }
	.mw-hero-slider__dots { left: 50%; transform: translateX(-50%); }
	.mw-hero-slider__arrow { display: none; }
}
