/**
 * banners.css
 * WHAT: Hero / offer / shop / wishlist banner slides, including the separate mobile picture layout.
 * NOTE: .has-m = slide has a mobile picture (stacked layout on phones). .hn-slide--only = picture-only slide.
 * Loaded by inc/assets.php (order matters: later files may override earlier ones).
 */
.hn-hero{
	position:relative;
	background:linear-gradient(120deg,var(--green-l),var(--orange-soft));
}
.hn-slides{
	display:flex;
	overflow-x:auto;
	scroll-snap-type:x mandatory;
	scrollbar-width:none;
}
.hn-slides::-webkit-scrollbar{
	display:none;
}
.hn-slide{
	position:relative;
	flex:0 0 100%;
	scroll-snap-align:start;
	min-height:var(--hn-banner-desktop-h,420px);
	display:flex;
	align-items:center;
	overflow:hidden;
}
.hn-slide__bg{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:right center;
}
.hn-slide__body{
	position:relative;
	max-width:var(--wrap);
}
.hn-slide__body>*{
	max-width:520px;
}
.hn-eyebrow{
	font-size:13px;
	letter-spacing:.22em;
	text-transform:uppercase;
	color:var(--green);
	margin:0 0 14px;
}
.hn-slide h1,.hn-slide h2{
	font-size:clamp(32px,5vw,56px);
	margin-bottom:14px;
}
.hn-slide p{
	margin:0 0 24px;
	color:#3d4a3f;
}
.hn-banner{
	position:relative;
	overflow:hidden;
	background:linear-gradient(90deg,var(--orange-soft),var(--orange-soft2));
	margin-block:14px;
}
.hn-banner__bg{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
}
.hn-banner__body{
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:14px;
	text-align:center;
	padding-block:38px;
}
.hn-banner h2{
	font-size:clamp(26px,3.4vw,38px);
	color:var(--accent-d);
}
@media (max-width:720px){
	.hn-slide{
		min-height:var(--hn-banner-mobile-h,360px);
	}
	.hn-slide__bg{
		object-position:70% center;
	}
}
.hn-slide{
	flex:0 0 100%;
	scroll-snap-align:start;
	scroll-snap-stop:always;
}
.hn-slide--offer{
	min-height:240px;
	justify-content:center;
	text-align:center;
	background:linear-gradient(90deg,var(--orange-soft),var(--orange-soft2));
}
.hn-slide--offer .hn-slide__body{
	display:flex;
	flex-direction:column;
	align-items:center;
	padding-block:28px;
}
.hn-slide--offer .hn-slide__body>*{
	max-width:640px;
}
.hn-slide--offer h2{
	color:var(--accent-d);
	font-size:clamp(24px,3.4vw,38px);
}
.hn-offers{
	margin-block:14px;
}
.hn-slide picture{
	display:contents;
}
.hn-slide--hero.has-img{
	aspect-ratio:auto;
	height:var(--hn-banner-desktop-h,500px);
	min-height:0;
	max-height:none;
}
.hn-slide--offer.has-img,.hn-slide--shop.has-img{
	aspect-ratio:auto;
	height:var(--hn-banner-desktop-h,300px);
	min-height:0;
}
.hn-slide--shop{
	justify-content:flex-start;
	text-align:left;
	border-radius:var(--r);
	overflow:hidden;
}
.hn-slide--shop .hn-slide__body{
	padding-block:20px;
}
.hn-slide--only{
	display:block;
	min-height:0;
	aspect-ratio:auto!important;
	max-height:none!important;
}
.hn-slide--only .hn-slide__bg{
	position:static;
	display:block;
	width:100%;
	height:auto;
	object-fit:initial;
}
.hn-shoppromo{
	margin-bottom:18px;
	border-radius:var(--r);
	overflow:hidden;
}
.hn-shoppromo .hn-arrow{
	width:36px;
	height:36px;
}
@media (max-width:720px){
	.hn-slide.has-img{
		aspect-ratio:auto!important;
		height:var(--hn-banner-mobile-h,360px);
		min-height:0;
	}
	.hn-slide.has-m{
		height:auto;
	}
	.hn-slide.has-m{
		display:block;
		min-height:0!important;
	}
	.hn-slide.has-m .hn-slide__bg{
		position:static;
		display:block;
		width:100%;
		height:var(--hn-banner-mobile-h,420px);
		object-fit:cover;
	}
	.hn-slide.has-m .hn-slide__body{
		padding:16px 16px 34px;
		max-width:none;
	}
	.hn-slide.has-m .hn-slide__body>*{
		max-width:none;
	}
	.hn-slide--offer.has-m .hn-slide__body,.hn-slide--shop.has-m .hn-slide__body{
		text-align:center;
		align-items:center;
	}
	.hn-slide:not(.has-m):not(.hn-slide--only).has-img::before{
		content:"";
		position:absolute;
		inset:0;
		background:linear-gradient(90deg,#fbf6eae6,#fbf6ea80 70%,#fbf6ea00);
		z-index:0;
	}
	.hn-slide:not(.has-m) .hn-slide__body{
		position:relative;
		z-index:1;
	}
}