/**
 * Hero plein viewport — clone visuel du héros Primtee, en slider.
 * [ywraq_home_hero]
 */

.ywraq-home-hero {
	--hh-navy: #000b38;
	--hh-ink: #303030;
	--hh-overlay: rgba(0, 0, 0, 0.38);
	--hh-snap: cubic-bezier(0.16, 1, 0.3, 1);
	--hh-serif: "Instrument", "Instrument Serif", Georgia, "Times New Roman", serif;
	--hh-sans: "Manrope", "Helvetica Neue", Helvetica, Arial, sans-serif;
	position: relative;
	isolation: isolate;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	min-height: 100vh;
	min-height: 100svh;
	min-height: 100dvh;
	overflow: hidden;
	color: #fff;
	background: #0a0f1c;
	font-family: var(--hh-sans);
	-webkit-font-smoothing: antialiased;
}

/* The7 / Elementor : h1-h2 et p ressortent noirs + autre police. */
.ywraq-home-hero h1,
.ywraq-home-hero h2,
.ywraq-home-hero h3,
.ywraq-home-hero p,
.ywraq-home-hero span,
.ywraq-home-hero em {
	color: #fff !important;
	text-shadow: none !important;
	text-transform: none !important;
	background: none !important;
}

.ywraq-home-hero h1,
.ywraq-home-hero h2,
.ywraq-home-hero h3,
.ywraq-home-hero p {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	box-shadow: none !important;
}

body.ywraq-has-site-header:has(.ywraq-home-hero),
body.ywraq-has-home-hero {
	padding-top: 0 !important;
}

.elementor-element:has(.ywraq-home-hero),
.elementor-widget-container:has(.ywraq-home-hero),
.elementor-shortcode:has(.ywraq-home-hero),
.e-con:has(.ywraq-home-hero) {
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: none !important;
	overflow: visible !important;
}

.ywraq-home-hero__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.85s var(--hh-snap), visibility 0.85s;
}

.ywraq-home-hero__slide.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	z-index: 1;
}

.ywraq-home-hero__bg {
	position: absolute;
	inset: 0;
	background-color: #0a0f1c;
	background-position: 50% 50%;
	background-size: cover;
	background-repeat: no-repeat;
}

.ywraq-home-hero__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(var(--hh-overlay), var(--hh-overlay));
}

/* Photo sapin : claire. On assombrit à gauche pour garder le texte lisible. */
.ywraq-home-hero__slide--bright .ywraq-home-hero__bg {
	background-position: 58% 22%;
}

.ywraq-home-hero__slide--bright .ywraq-home-hero__bg::after {
	background: linear-gradient(
		105deg,
		rgba(8, 10, 18, 0.7) 0%,
		rgba(8, 10, 18, 0.5) 36%,
		rgba(8, 10, 18, 0.28) 68%,
		rgba(8, 10, 18, 0.2) 100%
	);
}

/* Welcome pack : photo claire, box à droite. */
.ywraq-home-hero__slide--pack .ywraq-home-hero__bg {
	background-position: 78% 42%;
}

.ywraq-home-hero__slide--pack .ywraq-home-hero__bg::after {
	background: linear-gradient(
		105deg,
		rgba(8, 10, 18, 0.74) 0%,
		rgba(8, 10, 18, 0.52) 34%,
		rgba(8, 10, 18, 0.22) 62%,
		rgba(8, 10, 18, 0.08) 100%
	);
}

.ywraq-home-hero__inner {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: flex-start;
	min-height: 100vh;
	min-height: 100svh;
	min-height: 100dvh;
	padding: clamp(6.2rem, 24vh, 16.2rem) clamp(1.25rem, 6.25vw, 7.5rem) 4.5rem;
	box-sizing: border-box;
}

.ywraq-home-hero__copy {
	max-width: 52rem;
}

.ywraq-home-hero .ywraq-home-hero__brand {
	margin: 0 0 0.08em !important;
	font-family: var(--hh-serif) !important;
	font-weight: 400 !important;
	font-style: italic !important;
	font-size: clamp(2.75rem, 6.4vw, 5.125rem) !important;
	line-height: 0.78 !important;
	letter-spacing: 0.1px !important;
	color: #fff !important;
}

.ywraq-home-hero h1.ywraq-home-hero__title,
.ywraq-home-hero h2.ywraq-home-hero__title,
.ywraq-home-hero p.ywraq-home-hero__title,
.ywraq-home-hero .ywraq-home-hero__title {
	margin: 0 !important;
	font-family: var(--hh-sans) !important;
	font-weight: 400 !important;
	font-size: inherit !important;
	line-height: 1 !important;
	letter-spacing: 0.1px !important;
	color: #fff !important;
}

.ywraq-home-hero .ywraq-home-hero__line {
	display: block;
	font-family: var(--hh-sans) !important;
	font-weight: 600 !important;
	font-size: clamp(1.35rem, 2.7vw, 2.1875rem) !important;
	letter-spacing: 0.1px !important;
	line-height: 1.2 !important;
	color: #fff !important;
}

.ywraq-home-hero .ywraq-home-hero__serif {
	display: block;
	margin-top: -0.08em !important;
	font-family: var(--hh-serif) !important;
	font-weight: 400 !important;
	font-style: italic !important;
	font-size: clamp(1.45rem, 2.9vw, 2.3125rem) !important;
	letter-spacing: 0.1px !important;
	line-height: 1.15 !important;
	color: #fff !important;
}

.ywraq-home-hero .ywraq-home-hero__brand em,
.ywraq-home-hero .ywraq-home-hero__serif em {
	font-family: inherit !important;
	font-style: italic !important;
	font-weight: inherit !important;
	font-size: inherit !important;
	letter-spacing: inherit !important;
	line-height: inherit !important;
	color: inherit !important;
}

.ywraq-home-hero__seo {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.ywraq-home-hero .ywraq-home-hero__lead {
	margin: 1.35rem 0 0 !important;
	max-width: 36rem;
	font-family: var(--hh-sans) !important;
	font-size: clamp(1rem, 1.35vw, 1.1875rem) !important;
	font-weight: 400 !important;
	line-height: 1.45 !important;
	letter-spacing: 0.01em !important;
	color: rgba(255, 255, 255, 0.92) !important;
}

.ywraq-home-hero .ywraq-home-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem 1.5rem;
	align-items: center;
	margin: 1.35rem 0 0 !important;
	line-height: 1;
}

.ywraq-home-hero a.ywraq-home-hero__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 40px;
	padding: 0 20px !important;
	border-radius: 100px !important;
	border: 0 !important;
	font-family: var(--hh-sans) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	text-transform: none !important;
	box-shadow: none !important;
	transition: transform 0.3s var(--hh-snap), background 0.3s, color 0.3s, box-shadow 0.3s;
}

.ywraq-home-hero a.ywraq-home-hero__btn--devis {
	background: var(--hh-navy) !important;
	color: #fff !important;
}

.ywraq-home-hero a.ywraq-home-hero__btn--shop {
	background: #fff !important;
	color: var(--hh-ink) !important;
}

.ywraq-home-hero a.ywraq-home-hero__btn:hover,
.ywraq-home-hero a.ywraq-home-hero__btn:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28) !important;
}

.ywraq-home-hero a.ywraq-home-hero__btn--devis:hover,
.ywraq-home-hero a.ywraq-home-hero__btn--devis:focus-visible {
	background: #00105a !important;
	color: #fff !important;
}

.ywraq-home-hero a.ywraq-home-hero__btn--shop:hover,
.ywraq-home-hero a.ywraq-home-hero__btn--shop:focus-visible {
	background: #edf3fb !important;
	color: var(--hh-ink) !important;
}

.ywraq-home-hero__badge {
	margin: 1.75rem 0 0 -16px;
	max-width: 250px;
}

.ywraq-home-hero__badge img {
	display: block;
	width: 250px;
	max-width: 100%;
	height: auto;
}

.ywraq-home-hero__anim {
	opacity: 0;
	transform: translateY(22px);
}

.ywraq-home-hero__slide.is-active .ywraq-home-hero__copy.is-in .ywraq-home-hero__brand {
	animation: ywraq-hh-in 0.72s var(--hh-snap) 0.06s forwards;
}
.ywraq-home-hero__slide.is-active .ywraq-home-hero__copy.is-in .ywraq-home-hero__title {
	animation: ywraq-hh-in 0.72s var(--hh-snap) 0.16s forwards;
}
.ywraq-home-hero__slide.is-active .ywraq-home-hero__copy.is-in .ywraq-home-hero__lead {
	animation: ywraq-hh-in 0.72s var(--hh-snap) 0.28s forwards;
}
.ywraq-home-hero__slide.is-active .ywraq-home-hero__copy.is-in .ywraq-home-hero__actions {
	animation: ywraq-hh-in 0.72s var(--hh-snap) 0.42s forwards;
}
.ywraq-home-hero__slide.is-active .ywraq-home-hero__copy.is-in .ywraq-home-hero__badge {
	animation: ywraq-hh-in 0.72s var(--hh-snap) 0.56s forwards;
}

@keyframes ywraq-hh-in {
	from {
		opacity: 0;
		transform: translateY(22px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.ywraq-home-hero__dots {
	position: absolute;
	z-index: 3;
	left: clamp(1.25rem, 6.25vw, 7.5rem);
	bottom: 1.4rem;
	display: flex;
	gap: 0.45rem;
}

.ywraq-home-hero__dot {
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	cursor: pointer;
	position: relative;
	transition: background 0.3s, transform 0.3s;
}

.ywraq-home-hero__dot::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.35);
	transform: translate(-50%, -50%);
	transition: background 0.3s, transform 0.3s;
}

.ywraq-home-hero__dot.is-on::after {
	background: #fff;
	transform: translate(-50%, -50%) scale(1.2);
}

.ywraq-home-hero__dot:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
}

@media (max-width: 720px) {
	.ywraq-home-hero__slide--bright .ywraq-home-hero__bg {
		background-position: 54% 18%;
	}

	.ywraq-home-hero__slide--bright .ywraq-home-hero__bg::after {
		background: linear-gradient(
			180deg,
			rgba(8, 10, 18, 0.74) 0%,
			rgba(8, 10, 18, 0.52) 52%,
			rgba(8, 10, 18, 0.36) 100%
		);
	}

	.ywraq-home-hero__slide--pack .ywraq-home-hero__bg {
		background-position: 62% 38%;
	}

	.ywraq-home-hero__slide--pack .ywraq-home-hero__bg::after {
		background: linear-gradient(
			180deg,
			rgba(8, 10, 18, 0.7) 0%,
			rgba(8, 10, 18, 0.48) 48%,
			rgba(8, 10, 18, 0.32) 100%
		);
	}

	.ywraq-home-hero__inner {
		padding: 6.4rem 1.25rem 5.2rem;
		align-items: flex-end;
	}

	.ywraq-home-hero .ywraq-home-hero__brand {
		font-size: clamp(2.4rem, 12vw, 3.4rem) !important;
	}

	.ywraq-home-hero .ywraq-home-hero__line {
		font-size: clamp(1.2rem, 5.4vw, 1.55rem) !important;
	}

	.ywraq-home-hero .ywraq-home-hero__serif {
		font-size: clamp(1.25rem, 5.6vw, 1.65rem) !important;
	}

	.ywraq-home-hero .ywraq-home-hero__lead {
		margin-top: 1rem !important;
		font-size: 1rem !important;
	}

	.ywraq-home-hero__actions {
		margin-top: 1.1rem;
		gap: 0.7rem;
	}

	.ywraq-home-hero__badge {
		margin: 1.2rem 0 0 -8px;
		max-width: 188px;
	}

	.ywraq-home-hero__dots {
		left: 1.25rem;
		bottom: 1rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ywraq-home-hero__slide {
		transition: none;
	}

	.ywraq-home-hero__anim,
	.ywraq-home-hero__slide.is-active .ywraq-home-hero__copy.is-in .ywraq-home-hero__anim {
		opacity: 1;
		transform: none;
		animation: none;
	}

	.ywraq-home-hero__btn {
		transition: none;
	}
}

/* The7 #page a une spécificité plus haute que nos classes. */
#page .ywraq-home-hero h1,
#page .ywraq-home-hero h2,
#page .ywraq-home-hero h3,
#page .ywraq-home-hero p,
#page .ywraq-home-hero span,
#page .ywraq-home-hero em,
.wf-container .ywraq-home-hero h1,
.wf-container .ywraq-home-hero h2,
.wf-container .ywraq-home-hero p,
.elementor-widget-shortcode .ywraq-home-hero h1,
.elementor-widget-shortcode .ywraq-home-hero h2,
.elementor-widget-shortcode .ywraq-home-hero p {
	color: #fff !important;
	font-family: inherit !important;
}

#page .ywraq-home-hero .ywraq-home-hero__brand,
#page .ywraq-home-hero .ywraq-home-hero__serif,
.wf-container .ywraq-home-hero .ywraq-home-hero__brand,
.wf-container .ywraq-home-hero .ywraq-home-hero__serif,
.elementor-widget-shortcode .ywraq-home-hero .ywraq-home-hero__brand,
.elementor-widget-shortcode .ywraq-home-hero .ywraq-home-hero__serif {
	font-family: var(--hh-serif) !important;
	font-style: italic !important;
	font-weight: 400 !important;
	color: #fff !important;
}

#page .ywraq-home-hero .ywraq-home-hero__line,
#page .ywraq-home-hero .ywraq-home-hero__lead,
.wf-container .ywraq-home-hero .ywraq-home-hero__line,
.wf-container .ywraq-home-hero .ywraq-home-hero__lead {
	font-family: var(--hh-sans) !important;
	color: #fff !important;
}

#page .ywraq-home-hero a.ywraq-home-hero__btn--shop,
.wf-container .ywraq-home-hero a.ywraq-home-hero__btn--shop {
	color: #303030 !important;
	background: #fff !important;
}