/* modif steven - HomeSpecialSlider */
.hss-slider {
	position: relative;
	overflow: hidden;
	width: 100%;
}
.hss-slide {
	display: none;
	position: relative;
	width: 100%;
}
.hss-slide.hss-active {
	display: block;
	animation: hssFade .6s ease;
}
@keyframes hssFade {
	from { opacity: 0; }
	to { opacity: 1; }
}
.hss-link {
	display: block;
	color: inherit;
	text-decoration: none;
}
.hss-img,
.hss-video {
	display: block;
	width: 100%;
	height: auto;
}
.hss-yt {
	position: relative;
	width: 100%;
	padding-bottom: 56.25%;
}
.hss-yt iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* ---- Bloc title + description ---- */
.hss-caption {
	position: absolute;
	z-index: 2;
	max-width: 80%;
	padding: 15px 20px;
}
.hss-caption .hss-title h1,
.hss-caption .hss-title h2,
.hss-caption .hss-title h3,
.hss-caption .hss-title p {
	margin: 0 0 10px;
}

/* ---- 9 positions DESKTOP (>= 768px) ---- */
@media (min-width: 768px) {
	.hss-desk-top-left      { top: 8%;  left: 5%;  text-align: left; }
	.hss-desk-top-center    { top: 8%;  left: 50%; transform: translateX(-50%); text-align: center; }
	.hss-desk-top-right     { top: 8%;  right: 5%; text-align: right; }
	.hss-desk-middle-left   { top: 50%; left: 5%;  transform: translateY(-50%); text-align: left; }
	.hss-desk-middle-center { top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
	.hss-desk-middle-right  { top: 50%; right: 5%; transform: translateY(-50%); text-align: right; }
	.hss-desk-bottom-left   { bottom: 8%; left: 5%;  text-align: left; }
	.hss-desk-bottom-center { bottom: 8%; left: 50%; transform: translateX(-50%); text-align: center; }
	.hss-desk-bottom-right  { bottom: 8%; right: 5%; text-align: right; }
}

/* ---- 9 positions MOBILE (< 768px) ---- */
@media (max-width: 767px) {
	.hss-caption { max-width: 90%; padding: 10px 12px; }
	.hss-mob-top-left      { top: 5%;  left: 4%;  text-align: left; }
	.hss-mob-top-center    { top: 5%;  left: 50%; transform: translateX(-50%); text-align: center; }
	.hss-mob-top-right     { top: 5%;  right: 4%; text-align: right; }
	.hss-mob-middle-left   { top: 50%; left: 4%;  transform: translateY(-50%); text-align: left; }
	.hss-mob-middle-center { top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
	.hss-mob-middle-right  { top: 50%; right: 4%; transform: translateY(-50%); text-align: right; }
	.hss-mob-bottom-left   { bottom: 5%; left: 4%;  text-align: left; }
	.hss-mob-bottom-center { bottom: 5%; left: 50%; transform: translateX(-50%); text-align: center; }
	.hss-mob-bottom-right  { bottom: 5%; right: 4%; text-align: right; }
}

/* ---- Fleches ---- */
.hss-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	border: 0;
	background: rgba(0, 0, 0, .35);
	color: #fff;
	font-size: 22px;
	line-height: 1;
	padding: 12px 14px;
	cursor: pointer;
	transition: background .2s;
}
.hss-arrow:hover { background: rgba(0, 0, 0, .6); }
.hss-prev { left: 0; }
.hss-next { right: 0; }

/* ---- Dots ---- */
.hss-dots {
	position: absolute;
	bottom: 12px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
	display: flex;
	gap: 8px;
}
.hss-dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 1px solid #fff;
	background: transparent;
	padding: 0;
	cursor: pointer;
}
.hss-dot.hss-active { background: #fff; }

@media (max-width: 767px) {
	.hss-arrow { font-size: 16px; padding: 8px 10px; }
}