/***** Fonts *****/

/* Inter */

@font-face {
	font-family: "Inter";
	src: url("../fonts/Inter-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Inter";
	src: url("../fonts/Inter-Bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Inter";
	src: url("../fonts/Inter-talic.woff2") format("woff2");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "Inter";
	src: url("../fonts/Inter-BoldItalic.woff2") format("woff2");
	font-weight: 700;
	font-style: italic;
	font-display: swap;
}


/* Playfair display */

@font-face {
	font-family: "Playfair Display";
	src: url("../fonts/PlayfairDisplay-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Playfair Display";
	src: url("../fonts/PlayfairDisplay-Italic.woff2") format("woff2");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

/***** Global *****/

:root {
	--black: #0A1E27;
	--white: #FFFCF7;
	--darkblue: #0F2E3D;
	--mediumblue: #2C6E8F;
	--lightblue: #E2F5FF;
	--yellow: #D9A441;
}

.white-color {
	color: var(--white);
}

.bg-white {
	background-color: var(--white);
}

.black-color {
	color: var(--black);
}

.bg-black {
	background-color: var(--black);
}

.darkblue-color {
	color: var(--darkblue);
}

.bg-darkblue {
	background-color: var(--darkblue);
}

.header.bg-darkblue-header {
	background: var(--darkblue);
}

.mediumblue-color {
	color: var(--mediumblue)
}

.bg-mediumblue {
	background-color: var(--mediumblue);
}

.lightblue-color {
	color: var(--lightblue)
}

.bg-lightblue {
	background-color: var(--lightblue);
}

.yellow-color {
	color: var(--yellow);
}

.bg-yellow {
	background-color: var(--yellow);
}

body {
	font-family: 'Inter', sans-serif;
	font-weight: 400;
	font-size: clamp(1.4rem, 1.343rem + 0.143vi, 1.6rem);
	line-height: calc(15/10);
	color: var(--black)
}

h1,
h2,
h3,
h4,
.h3-like {
	font-family: 'Playfair Display', serif;
	font-weight: normal;
	line-height: calc(13/10);
}

h1 {
	font-size: clamp(3.8rem, 3.286rem + 1.286vi, 5.6rem);
	margin-bottom: clamp(2.4rem, 1.943rem + 1.143vi, 4rem);
}

h2 {
	font-size: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
	margin-bottom: clamp(1.6rem, 1.371rem + 0.571vi, 2.4rem);
	color: var(--darkblue);
}

h3,
.h3-like {
	font-size: clamp(2.4rem, 2.286rem + 0.286vi, 2.8rem);
	margin-bottom: clamp(1.6rem, 1.371rem + 0.571vi, 2.4rem);
	color: var(--darkblue);
}

h4 {
	font-size: clamp(2rem, 1.657rem + 0.857vi, 3.2rem);
	margin-bottom: clamp(1.2rem, 1.029rem + 0.429vi, 1.8rem);
	color: var(--darkblue);
}

a {
	text-decoration: none;
	color: var(--mediumblue);
}

.subtitle {
	color: var(--mediumblue);
	text-transform: uppercase;
	margin-bottom: clamp(1.2rem, 1.029rem + 0.429vi, 1.8rem);
	;
}

.radius {
	border-radius: 1.5rem;
}

.p-wrapper p {
	margin-bottom: 2rem;
}

.p-wrapper p:last-child {
	margin-bottom: 0rem;
}

img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}


/***** Helpers *****/

.no-scroll {
	overflow: hidden;
}


/***** Layout *****/

main {
	position: relative;
	overflow: hidden;
	display: grid;
}

main .container,
footer .container,
#les-livres .container {
	padding-block: clamp(4.8rem, 3.935rem + 2.703vi, 8.8rem);
}

.container {
	position: relative;
	display: grid;
	margin-inline: auto;
	padding-inline: 1.6rem;
}

main .container {
	padding-block: clamp(5.6rem, 4.547rem + 2.632vi, 9.6rem);
}

/* 📱 Mobile (par défaut) */
.container {
	width: 100%;
}

@media (min-width: 36em) {

	/* équivalent 576px */
	.container {
		max-width: 54rem;
	}
}

@media (min-width: 48em) {

	/* équivalent 768px */
	.container {
		max-width: 72rem;
	}
}

@media (min-width: 62em) {

	/* équivalent 992px */
	.container {
		max-width: 96rem;
	}
}

@media (min-width: 75em) {

	/* équivalent 1200px */
	.container {
		max-width: 114rem;
	}

}

@media (min-width: 90em) {

	/* équivalent 1440px */
	.container {
		max-width: 128rem;
	}

}

/***** Components *****/

/** Button component (primary and secondary) **/


.btn,
.woocommerce button.single_add_to_cart_button,
.wc-block-components-checkout-place-order-button,
.woocommerce-form-coupon-toggle .woocommerce-info,
.wc-block-components-button,
.frm_style_style-formidable.with_frm_style .frm_submit button {
	position: relative;
	display: inline-flex;
	align-items: center;
	font-size: 1.4rem;
	font-weight: 700;
	text-transform: uppercase;
	border: none;
	cursor: pointer;
	border-radius: 1rem;
	padding-inline: clamp(1.4rem, 1.343rem + 0.143vi, 1.6rem);
	padding-block: clamp(1rem, 0.943rem + 0.143vi, 1.2rem);
	box-shadow: 0px 5px 10px rgba(3, 8, 15, 0.1);
	margin-top: clamp(3.2rem, 2.779rem + 1.053vi, 4.8rem);
	transition: all .5s ease-in-out;
}

.btn:hover,
.btn:focus,
.btn:active,
.woocommerce button.single_add_to_cart_button:hover,
.wc-block-components-checkout-place-order-button:hover,
.woocommerce-form-coupon-toggle .woocommerce-info:hover,
.wc-block-components-button:hover,
.frm_style_style-formidable.with_frm_style .frm_submit button:hover {
	transform: translateY(-2px);
}

.primary-btn,
.woocommerce button.single_add_to_cart_button,
.wc-block-components-checkout-place-order-button,
.wc-block-components-button,
.frm_style_style-formidable.with_frm_style .frm_submit button {
	gap: 1.2rem;
	padding-right: 4rem;
}

.woocommerce button.single_add_to_cart_button,
.wc-block-components-checkout-place-order-button,
.woocommerce-form-coupon-toggle .woocommerce-info,
.wc-block-components-button,
.frm_style_style-formidable.with_frm_style .frm_submit button {
	color: var(--white);
	background-color: var(--mediumblue);
}

.woocommerce button.single_add_to_cart_button:hover,
.wc-block-components-checkout-place-order-button:hover,
.woocommerce-form-coupon-toggle .woocommerce-info:hover,
.wc-block-components-button:hover,
.frm_style_style-formidable.with_frm_style .frm_submit button:hover {
	background-color: var(--yellow);
	color: var(--white);
}

.primary-btn::after,
.woocommerce button.single_add_to_cart_button::after,
.wc-block-components-checkout-place-order-button::after,
.frm_style_style-formidable.with_frm_style .frm_submit button::after {
	content: "";
	width: 2rem;
	height: 2rem;
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
	background-size: contain;
	background-repeat: no-repeat;
	transition: transform .6s ease;
}

.primary-btn::after,
.frm_style_style-formidable.with_frm_style .frm_submit button::after {
	background-image: url("../img/rose-vents-btn.svg");
}

.primary-btn.bg-mediumblue::after,
.woocommerce button.single_add_to_cart_button::after,
.wc-block-components-checkout-place-order-button::after,
.frm_style_style-formidable.with_frm_style .frm_submit button::after {
	background-image: url("../img/rose-vents-btn.svg");
}

.primary-btn.bg-yellow::after {
	background-image: url("../img/rose-des-vents-btn-yellow.svg");
}

.primary-btn:hover::after,
.woocommerce button.single_add_to_cart_button:hover::after,
.wc-block-components-checkout-place-order-button:hover::after,
.frm_style_style-formidable.with_frm_style .frm_submit button:hover::after {
	transform: translateY(-50%) rotate(360deg);
}

.primary-btn.bg-mediumblue:hover::after,
.woocommerce button.single_add_to_cart_button:hover::after,
.wc-block-components-checkout-place-order-button:hover::after {
	background-image: url("../img/rose-vents-hover-btn.svg");
}

.primary-btn.bg-yellow.white-color:hover {
	color: var(--darkblue);
}

.primary-btn.bg-yellow.white-color:hover::after {
	background-image: url("../img/rose-des-vents-hover-darkblue.svg");
}

.btn.btn-header {
	margin-top: unset;
}

.hover-yellow:hover,
.hover-yellow:focus,
.hover-yellow:active {
	background-color: var(--yellow);
}

.hover-lightblue:hover,
.hover-lightblue:focus,
.hover-lightblue:active {
	background-color: var(--lightblue);
}

.hover-mediumblue:hover,
.hover-mediumblue:focus,
.hover-mediumblue:active {
	background-color: var(--mediumblue);
}


/** back-to-top **/

#back-top {
	display: none;
	width: clamp(5.6rem, 5.254rem + 1.081vi, 7.2rem);
	height: clamp(5.6rem, 5.254rem + 1.081vi, 7.2rem);
	position: fixed;
	bottom: 2rem;
	right: 2rem;
	z-index: 1000;
	border: none;
	outline: none;
	background-color: transparent;
	cursor: pointer;
	padding: 1rem;
	transition: .3s;
}

#back-top::before {
	content: url('../img/back-top.svg');
	position: absolute;
	inset: 0;
}

#back-top:hover::before,
#back-top:focus::before,
#back-top:active::before {
	content: url('../img/back-top-hover.svg');
	position: absolute;
	inset: 0;
}

/** Citation **/

.wrapper-quote {
	position: relative;
	padding-left: 2.4rem;
	margin: 0;
}

.wrapper-quote::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.4rem;
	bottom: 0.4rem;
	width: 4px;
	background: var(--yellow);
	border-radius: 0.2rem;
}

.quote {
	font-family: 'Playfair Display', serif;
	font-size: clamp(1.6rem, 1.486rem + 0.286vi, 2rem);
	margin-bottom: 1.2rem;
}

/** Header **/

.nav-links {
	font-size: 1.4rem;
	font-family: 'Inter', sans-serif;
	font-style: normal;
	text-transform: uppercase;
	font-weight: 700;
}

.header {
	background: transparent;
	position: absolute;
	z-index: 1000;
	top: 0;
	left: 0;
	right: 0;
}

.header .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-block: 3.2rem;
	background-color: rgba(255, 255, 255, 0);
	transition: background-color 0.5s, padding 1s;
}

.logo {
	display: grid;
	align-items: center;
}

.logo img {
	width: clamp(25rem, 22.143rem + 7.143vi, 35rem);
}

.header.sticky .logo img {
	width: clamp(20rem, 18.857rem + 2.857vi, 24rem);
}

.menu-item a {
	position: relative;
	color: var(--white);
	z-index: 1;
	display: block;
	text-decoration: none;
	transition: .5s;
}

.sub-menu {
	background-color: var(--darkblue);
}

.current-menu-item a[aria-current="page"],
.menu-item a:hover,
.menu-item a:focus,
.menu-item a:active {
	color: var(--yellow);
}

.header.sticky {
	z-index: 2000;
	position: fixed;
	top: 0;
	left: 0;
	background-color: var(--darkblue);
	box-shadow: 0px 5px 10px rgba(3, 8, 15, 0.1);
}

.header.sticky .container {
	padding-block: 1.6rem;
}

.nav-actions {
	display: flex;
	align-items: center;
	column-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
}

@media (max-width: 61.999em) {


	.toggle-menu {
		padding: 0;
		border: 0;
		background-color: transparent;
		margin-top: 0.8rem;
	}

	.toggle-menu rect {
		transition: .3s;
		fill: var(--white);
	}

	.toggle-menu rect:first-child {
		transform-origin: top left;
	}

	.toggle-menu rect:last-child {
		transform-origin: bottom left;
	}

	.toggle-menu[aria-expanded="true"] rect:nth-child(2) {
		opacity: 0;
	}

	.toggle-menu[aria-expanded="true"] rect:nth-child(1) {
		transform: translateX(.5rem) rotate(45deg);
	}

	.toggle-menu[aria-expanded="true"] rect:nth-child(3) {
		transform: translateX(.5rem) rotate(-45deg);
	}

	.main-nav .menu {
		visibility: hidden;
		position: fixed;
		inset: 0;
		z-index: -1;
		display: flex;
		flex-direction: column;
		align-content: center;
		row-gap: 4.0rem;
		padding-inline: 2.4rem;
		padding-top: 12rem;
		background-color: var(--darkblue);
		opacity: 0;
		transform: translateX(100vw);
		transition: ease-out .5s;
	}

	.main-nav .menu:not([hidden]) {
		opacity: 1;
		transform: translateX(0);
		visibility: visible;
	}

	.main-nav .primary-menu {
		display: grid;
		row-gap: 1.6rem;
	}

	.main-nav .menu-item {
		transform: translateX(100vw);
		transition: .3s;
	}

	.main-nav .menu-item:nth-child(1) {
		transition-delay: .3s;
	}

	.main-nav .menu-item:nth-child(2) {
		transition-delay: .4s;
	}

	.main-nav .menu-item:nth-child(3) {
		transition-delay: .5s;
	}

	.main-nav .menu-item:nth-child(4) {
		transition-delay: .6s;
	}

	.main-nav .menu-item:nth-child(5) {
		transition-delay: .7s;
	}

	.main-nav .menu-item:nth-child(6) {
		transition-delay: .8s;
	}

	.main-nav .menu-item:nth-child(7) {
		transition-delay: .9s;
	}



	.main-nav .menu:not([hidden]) .menu-item,
	.main-nav .menu:not([hidden]) .primary-btn {
		transform: translateX(0);
	}

	.main-nav .sub-menu {
		padding-top: 0.8rem;
	}

	.main-nav .sub-menu .nav-links a {
		margin-left: 2rem;
		padding: 0.4rem 0rem !important;
	}

}

@media (min-width: 62em) {


	.toggle-menu {
		display: none;
	}


	.main-nav .menu {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		column-gap: clamp(2.4rem, -2.511rem + 4.95vi, 6.4rem);
	}

	.header.sticky .main-nav .menu {
		margin-top: 0rem;
	}

	.primary-menu {
		display: flex;
		align-items: center;
		column-gap: clamp(4rem, 1.053rem + 2.97vi, 6.4rem);
	}

	.menu-item {
		position: relative;
		padding-left: 1.2rem;
	}

	.menu-item-has-children {
		position: relative;
	}

	#menu-item-39::before,
	#menu-item-50::before,
	#menu-item-48::before {
		content: "";
		width: 4px;
		height: 4px;
		background-color: var(--yellow);
		border-radius: 50%;
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
	}

	.menu-item-has-children::after {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 110%;
		width: 1.3rem;
		height: 100%;
		content: '';
		background-size: auto;
		background-repeat: no-repeat;
		background-position: center;
		background-image: url('../img/arrow_menu_drop_down.svg');
		transition: .3s ease-out;
	}

	.menu-item-has-children:hover::after {
		transform: rotate(180deg);
		background-image: url('../img/arrow_menu_drop_down_hover.svg');
	}

	.sub-menu {
		position: absolute;
		left: 8rem;
		min-width: 16rem;
		padding-inline: 1.6rem !important;
		padding-block: 1.2rem !important;
		background-color: var(--lightblue);
		border-radius: 0.5rem;
		box-shadow: 0 4px 4px rgba(28, 26, 23, .1);
		transform: rotateX(-90deg) translateX(-50%);
		transform-origin: top center;
		transition: .3s ease-out;
		z-index: 1000;
	}

	.sub-menu .nav-links {
		padding: 0.4rem 0rem !important;
	}

	.sub-menu a {
		color: var(--darkblue);
	}

	.menu-item-has-children:hover .sub-menu {
		opacity: 1;
		transform: rotateX(0) translateX(-50%);
		visibility: visible;
	}

	.header.sticky #menu-item-39>a:first-of-type,
	.header.sticky #menu-item-50>a:first-of-type,
	.header.sticky #menu-item-48>a:first-of-type {
		color: var(--white);
	}

}

/** Hero secondary **/


.hero-secondary.hero-bg-auteur,
.hero-secondary.hero-bg-reviews,
.hero-secondary.hero-bg-presentation {
	background:
		linear-gradient(120deg,
			rgba(15, 46, 61, 1) 0%,
			rgba(15, 46, 61, 1) 40%,
			rgba(15, 46, 61, 0.9) 60%,
			rgba(15, 46, 61, 0.6) 80%,
			rgba(15, 46, 61, 0.3) 100%),
		url("../img/hero-img-auteur-mobile.webp");
}

.hero-secondary.hero-bg-itineraire {
	background:
		linear-gradient(120deg,
			rgba(15, 46, 61, 1) 0%,
			rgba(15, 46, 61, 1) 40%,
			rgba(15, 46, 61, 0.9) 60%,
			rgba(15, 46, 61, 0.6) 80%,
			rgba(15, 46, 61, 0.3) 100%),
		url("../img/hero-bg-itineraire.webp");
}

.hero-secondary.hero-bg-crew {
	background:
		linear-gradient(120deg,
			rgba(15, 46, 61, 1) 0%,
			rgba(15, 46, 61, 1) 40%,
			rgba(15, 46, 61, 0.9) 60%,
			rgba(15, 46, 61, 0.6) 80%,
			rgba(15, 46, 61, 0.3) 100%),
		url("../img/hero-secondary-crew-mobil.webp");
}

.hero-secondary.hero-bg-itineraire,
.hero-secondary.hero-bg-auteur,
.hero-secondary.hero-bg-crew,
.hero-secondary.hero-bg-reviews,
.hero-secondary.hero-bg-presentation {
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

}

.hero-secondary .container {
	padding-block: clamp(12rem, 11.429rem + 1.429vi, 14rem);
	row-gap: clamp(7.2rem, 6.743rem + 1.143vi, 8.8rem);
}

.hero-wrapper {
	position: relative;
	display: grid;
	row-gap: clamp(5.6rem, 4.914rem + 1.714vi, 8rem)
}

ul.hero-intro {
	display: flex;
	display: grid;
	row-gap: clamp(1.2rem, 1.086rem + 0.286vi, 1.6rem);
}

li.hero-intro-item {
	position: relative;
	font-size: clamp(1.6rem, 1.486rem + 0.286vi, 2rem);
	padding-left: 2.8rem;
}

p.hero-intro.white-color {
	font-size: clamp(1.6rem, 1.486rem + 0.286vi, 2rem);
}


li.hero-intro-item::before {
	content: "";
	width: 2rem;
	height: 2rem;
	position: absolute;
	left: 0;
	top: 1.4rem;
	transform: translateY(-50%);
	background-image: url("../img/rose-vents-hero.svg");
	background-size: contain;
	background-repeat: no-repeat;
}

.hero-wrapper-img-quote {
	display: grid;
	row-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
	width: 80%;
	margin: auto;
}

.hero-wrapper-img img {
	border-radius: 50%;
}

.hero-bg-presentation .hero-wrapper-img img {
	border-radius: 0%;
}

.hero-intro-box {
	position: absolute;
	bottom: -20rem;
	left: 0;
	right: 0;
	padding-inline: clamp(2.4rem, 1.943rem + 1.143vi, 4rem);
	padding-block: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
	box-shadow: 0px 5px 10px 0px rgba(226, 245, 255, 0.15);
}

@media (min-width: 62em) {

	.hero-secondary.hero-bg-auteur,
	.hero-secondary.hero-bg-reviews,
	.hero-secondary.hero-bg-presentation {
		background:
			linear-gradient(120deg,
				rgba(15, 46, 61, 1) 0%,
				rgba(15, 46, 61, 1) 40%,
				rgba(15, 46, 61, 0.9) 60%,
				rgba(15, 46, 61, 0.6) 80%,
				rgba(15, 46, 61, 0.3) 100%),
			url("../img/hero-auteur-img-desktop.webp");
	}

	.hero-secondary.hero-bg-itineraire {
		background:
			linear-gradient(120deg,
				rgba(15, 46, 61, 1) 0%,
				rgba(15, 46, 61, 1) 40%,
				rgba(15, 46, 61, 0.9) 60%,
				rgba(15, 46, 61, 0.6) 80%,
				rgba(15, 46, 61, 0.3) 100%),
			url("../img/hero-bg-itinerkaire-desktop.webp");
	}

	.hero-secondary.hero-bg-crew {
		background:
			linear-gradient(120deg,
				rgba(15, 46, 61, 1) 0%,
				rgba(15, 46, 61, 1) 40%,
				rgba(15, 46, 61, 0.9) 60%,
				rgba(15, 46, 61, 0.6) 80%,
				rgba(15, 46, 61, 0.3) 100%),
			url("../img/hero-secondary-crew.webp");
	}

	.hero-secondary.hero-bg-itineraire,
	.hero-secondary.hero-bg-auteur,
	.hero-secondary.hero-bg-crew,
	.hero-secondary.hero-bg-reviews,
	.hero-secondary.hero-bg-presentation {
		position: relative;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;

	}

	.hero-secondary .container {
		padding-bottom: 8rem;
	}

	.hero-wrapper {
		display: grid;
		grid-template-columns: 3fr 2fr;
		column-gap: clamp(4.8rem, 0.88rem + 3.956vi, 8rem);
	}

	.hero-bg-presentation .hero-wrapper {
		grid-template-columns: 6fr 5fr;
	}


	.hero-wrapper-content {
		padding-top: 4.8rem;
	}

	.hero-intro-box {
		bottom: -16rem;
		max-width: 40rem;
	}

}

@media (min-width: 90em) {

	.hero-wrapper {
		margin-inline: 6%;
	}

	.hero-bg-presentation .hero-wrapper {
		margin-inline: 0%;
	}

}


/** footer **/

.main-footer {
	position: relative;
}


.main-footer .container {
	row-gap: clamp(4rem, 3.238rem + 2.381vi, 5.6rem);
}

.main-footer .logo-wrapper {
	display: grid;
	row-gap: 4rem;
	max-width: 40rem;
}

.main-footer .logo-wrapper p {
	font-size: clamp(1.6rem, 1.543rem + 0.143vi, 1.8rem);
}

.footer-title {
	text-transform: uppercase;
	font-weight: 700;
}

.nav-footer {
	display: grid;
	row-gap: 1.6rem;
}

.nav-footer .link-menu {
	z-index: 1;
	display: grid;
	row-gap: 0.8rem;
}

.nav-footer .nav-footer-link {
	position: relative;
	padding-left: clamp(3rem, 2.429rem + 1.429vi, 5rem);
}

.nav-footer .nav-footer-link::before {
	content: "";
	width: 2rem;
	height: 2rem;
	position: absolute;
	left: 0rem;
	top: 50%;
	transform: translateY(-50%);
	background-image: url("../img/rose-vents-btn.svg");
	;
	background-size: contain;
	background-repeat: no-repeat;
	transition: transform .6s ease;
}

@media (min-width: 62em) {

	.main-footer::before,
	.main-footer::after,
	.hero-home::after,
	.hero-home::before {
		content: "";
		width: 35.2rem;
		height: 5.9rem;
		bottom: 0;
		position: absolute;
		background-size: contain;
		background-repeat: no-repeat;
		transition: transform .6s ease;
	}

	.main-footer::before,
	.hero-home::before {
		left: 10rem;
		background-image: url("../img/coordonnees-gps-1.svg");
	}

	.main-footer::after,
	.hero-home::after {
		right: 10rem;
		background-image: url("../img/coordonnees-gps-2.svg");
	}



	.main-footer .container {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}

	.main-footer .logo-wrapper {
		max-width: 30rem;
	}
}


@media (min-width: 75em) {

	.main-footer .logo-wrapper {
		max-width: 40rem;
	}

}




/** texte et image 50/50 **/



#auteur.text-img-50-50 .container {
	padding-top: clamp(12rem, 10.857rem + 2.857vi, 16rem);
}

.text-img-50-50 .container {
	row-gap: clamp(4rem, 3.238rem + 2.381vi, 5.6rem);
}

@media (min-width: 62em) {

	.text-img-50-50 .container {
		column-gap: clamp(8rem, 5.06rem + 2.967vi, 10.4rem);
	}

	.text-img-50-50.text-right .container {
		grid-template-columns: 3fr 4fr;
	}

	.text-img-50-50.text-left .container {
		grid-template-columns: 5fr 4fr;
	}

	.text-img-50-50 .content-wrapper {
		padding-block: clamp(3.2rem, -0.72rem + 3.956vi, 6.4rem);
	}
}

/** boxes 50/50 **/

.boxes-wrapper {
	display: grid;
	row-gap: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
	margin-top: clamp(4rem, 3.238rem + 2.381vi, 5.6rem);
}

.box-item {
	padding-inline: clamp(4rem, 3.314rem + 1.714vi, 6.4rem);
	padding-block: clamp(4.8rem, 4.114rem + 1.714vi, 7.2rem);
}

.box-photo .img-wrapper {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

@media (min-width: 62em) {

	.box-50-50 .container {
		width: 80%;
		margin: auto;
	}

	.box-50-50 .section-intro {
		width: 80%;
		margin: auto;
		text-align: center;
	}

	.boxes-wrapper {
		grid-template-columns: 1fr 1fr;
		column-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
	}

	#parcours {
		position: relative;
	}

	#parcours::before {
		content: "";
		position: absolute;
		left: -4rem;
		top: -8rem;
		width: 28rem;
		height: 28rem;
		background-image: url("../img/rose-des-vents-light-blue.svg");
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
		transform: rotate(-25deg);
	}

}

/** CTA middle page **/

.cta-middle-page.bg-mediumblue {
	position: relative;
	z-index: 10;
	overflow: hidden;
	width: 80%;
	margin: auto;
	margin-top: -18rem;
	text-align: center;
	box-shadow: 0px 5px 30px rgba(3, 8, 15, 0.1);
}

.cta-middle-page.bg-mediumblue::before,
.cta-middle-page.bg-mediumblue::after {
	content: "";
	position: absolute;
	z-index: -1;
	width: 18rem;
	height: 8.4rem;
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
}

.cta-middle-page.bg-mediumblue::before {
	left: 0rem;
	bottom: 3.2rem;
	background-image: url("../img/wave-cta-left.svg");
}

.cta-middle-page.bg-mediumblue::after {
	right: -3rem;
	bottom: 3.2rem;
	background-image: url("../img/wave-cta-right.svg");
}

.cta-middle-page.bg-mediumblue .container {
	padding-inline: clamp(3.2rem, 2.514rem + 1.714vi, 5.6rem);
	padding-block: clamp(4rem, 3.543rem + 1.143vi, 5.6rem);
}


section:has(+ .cta-middle-page.bg-mediumblue) .container {
	padding-bottom: clamp(24rem, 21.714rem + 5.714vi, 32rem);
}

@media (min-width: 62em) {

	.cta-middle-page.bg-mediumblue {
		width: 50%;
	}

	.cta-middle-page.bg-mediumblue::before,
	.cta-middle-page.bg-mediumblue::after {
		bottom: 2.4rem;
		width: 24rem;
		height: 11.2rem;
	}

}

/** img 50/50 **/

.img-50-50 {
	position: relative;
}

.img-50-50 .container {
	row-gap: clamp(4rem, 3.238rem + 2.381vi, 5.6rem);
	;
}

.img-50-50 .img-wrapper-box {
	display: grid;
	row-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
}

@media (min-width: 62em) {

	#tome-1 {
		position: relative;
	}

	.img-50-50::before,
	#tome-1::before {
		content: "";
		position: absolute;
		right: -4rem;
		width: 25.1rem;
		height: 29.4rem;
		background-image: url("../img/ancre-lightblue.svg");
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
		transform: rotate(35deg);
	}

	.img-50-50::before {
		top: 6.4rem;
	}

	#tome-1::before {
		top: 50.4rem;
	}

	.img-50-50 .container {
		width: 80%;
		margin: auto;
	}

	.img-50-50 .img-wrapper-box {
		grid-template-columns: 1fr 1fr;
		column-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
		;
	}

}

@media (min-width: 90em) {


	.img-50-50 .container {
		width: 66%;
	}

}

/** slider **/

.caroussel-photos {
	overflow: hidden;
	position: relative;
	background-color: var(--lightblue);
	width: 100%;
	padding-top: clamp(4.8rem, 3.935rem + 2.703vi, 8.8rem);
	padding-bottom: clamp(12.8rem, 10.743rem + 5.143vi, 20rem);
}

.splide__slide {
	overflow: hidden !important;
}

.splide__slide img {
	width: 100%;
	height: auto;
	display: block;
	aspect-ratio: 1.5 / 1;
}

/* structure du slider */
.caroussel-photos .splide {
	display: flex !important;
	flex-direction: column !important;
	position: relative !important;
	/* nécessaire pour les flèches en absolute */
}

/* ordre des éléments */
.caroussel-photos .splide__track {
	order: 1 !important;
}

/* conteneur des flèches */
.caroussel-photos .splide__arrows {
	order: 2 !important;
	position: absolute !important;
	top: calc(100% + 3.2rem) !important;
	/* place sous le slider */
	right: 6rem !important;
	display: flex !important;
	gap: 1rem !important;
}

/* boutons */
.caroussel-photos .splide__arrow {
	position: static !important;
	/* important pour que flex gère l'alignement */
	transform: none !important;
	background: transparent !important;
	border: 2px solid var(--yellow) !important;
	width: 4em !important;
	height: 4em !important;
}

/* icône */
.caroussel-photos .splide__arrow svg {
	fill: var(--yellow) !important;
	width: 1.6em;
	height: 1.6em;
}

.splide__pagination.splide__pagination--ltr {
	display: none !important;
}

@media (min-width: 62em) {

	.caroussel-photos::before {
		content: "";
		position: absolute;
		left: -2rem;
		bottom: -5.6rem;
		width: 29.2rem;
		height: 22.7rem;
		background-image: url("../img/photos-lightblue.svg");
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
	}
}

@media (min-width: 90em) {

	.caroussel-photos .splide__arrows {
		right: clamp(6rem, -8.7rem + 14.833vi, 18rem) !important;

	}

}

/**** Page Home ****/

.hero-home {
	position: relative;
}

.hero-home .container {
	row-gap: clamp(4.8rem, 3.2rem + 3.2vi, 6.4rem);
}

.hero-content-part {
	display: grid;
	text-align: center;
	row-gap: clamp(4.8rem, 3.2rem + 3.2vi, 6.4rem);
}

.hero-home h1 {
	display: grid;
	grid-template-rows: 1fr 1fr;
	justify-content: center;
	align-items: center;
	margin-bottom: 0rem;
}

.hero-home h1 span {
	font-family: 'Inter', sans-serif;
	font-weight: bold;
	font-size: clamp(1.6rem, 1.2rem + 0.8vi, 2rem);
	align-self: end;
}

.hero-top-part {
	display: grid;
	justify-content: center;
	row-gap: 1.6rem;
}

.hero-slogan {
	display: flex;
	text-align: center;
	margin: auto;
	align-items: center;
	column-gap: clamp(1.6rem, 1.2rem + 0.8vi, 2rem);
}

.hero-slogan .h3-like {
	font-size: clamp(2rem, 1.657rem + 0.857vi, 3.2rem);
	color: var(--white);
	margin-bottom: 0rem;
}

.hero-slogan .h3-like span {
	font-style: italic;
}

.hero-home .wrapper-img img,
.hero-home .wrapper-img {
	width: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
	height: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
}

.intro-text {
	position: relative;
}

.intro-text p {
	font-size: clamp(1.6rem, 1.2rem + 0.8vi, 2rem);
}

.intro-text::before {
	content: "";
	position: absolute;
	left: calc(50% - 8.8rem);
	top: -3.2rem;
	width: 17.6rem;
	height: 0.7rem;
	background-image: url("../img/wave-hero-home.svg");
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
}

.hero-img-book {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
	z-index: 1;
	width: 80%;
	margin-inline: auto;
}

.hero-img-left {
	transform: rotate(-9.5deg)
}

.hero-img-right {
	transform: rotate(9.5deg)
}

#le-livre .wrapper-quote,
#les-livres .wrapper-quote {
	margin-top: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
}

#les-livres img {
	object-fit: contain;
	align-self: start;
}

.home-key-numbers h2,
.home-key-numbers p.subtitle {
	text-align: center;
}

.link-pages-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	justify-content: center;
	gap: clamp(1.6rem, 1.143rem + 1.143vi, 3.2rem);
	margin-block: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem) !important;
}

.link-pages-item {
	position: relative;
	text-align: center;
	padding: 3.2rem;
	box-shadow: 0px 0px 10px rgba(44, 110, 143, 0.15);
}

.link-pages-number {
	font-size: clamp(3.2rem, 2.286rem + 2.286vi, 6.4rem);
	font-weight: normal;
	line-height: calc(13/10);
	margin-bottom: clamp(1.6rem, 1.371rem + 0.571vi, 2.4rem);
}

.link-pages-number-wrapper {
	font-family: 'Playfair Display', serif;
	display: flex;
	gap: clamp(0.6rem, 0.371rem + 0.571vi, 1.4rem);
	align-items: center;
	justify-content: center;
}

.link-pages-unite {
	z-index: 10;
}

.home-key-numbers .key-numbers-home-text {
	margin-bottom: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
}

#home-caroussel.caroussel-photos {
	background-color: var(--darkblue);
}

#home-caroussel.caroussel-photos::before {
	background-image: url("../img/photos-darkblue.svg");
}

#cta-home {
	position: relative;
}

.hero-content-part {
	z-index: 2;
}

@media (min-width: 62em) {

	.hero-content-part {
		grid-area: 1 / 1 /2 / 2;
	}

	.hero-home .wrapper-img {
		align-self: end;
	}

	.hero-slogan .h3-like span {
		font-size: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
	}

	.hero-img-book {
		width: 100%;
		grid-template-columns: 1fr 1fr;
		grid-area: 1 / 1 /2 / 2;
	}

	.hero-img-left,
	.hero-img-right {
		max-width: 21rem;
	}

	.hero-img-left {
		align-self: end;
		justify-self: start;
	}

	.hero-img-right {
		align-self: end;
		justify-self: end;
	}

	.home-key-numbers .container {
		width: 80%;
		margin: auto;
	}

	.link-pages-wrapper {
		grid-template-columns: repeat(4, 1fr);
	}

	.link-pages-item.bg-mediumblue::before {
		content: "";
		width: 12.4rem;
		height: 12.4rem;
		position: absolute;
		right: -1rem;
		top: 5.6rem;
		transform: translateY(-50%);
		background-image: url("../img/rose-vents-darkblue.svg");
		background-size: contain;
		background-repeat: no-repeat;
	}

	#les-livres {
		position: relative;
	}

	#les-livres::before {
		content: "";
		position: absolute;
		right: -8rem;
		bottom: -8rem;
		width: 28rem;
		height: 26rem;
		background-image: url("../img/globe-lightblue.svg");
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
		transform: rotate(-20deg);
	}

}

@media (min-width: 90em) {

	.home-key-numbers {
		position: relative;
	}

	.home-key-numbers::before {
		content: "";
		position: absolute;
		right: -4rem;
		top: 0.8rem;
		width: 33rem;
		height: 31.2rem;
		background-image: url("../img/wave-lghtblue.svg");
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
	}

	.home-key-numbers .container {
		width: 66%;
	}
}

/**** Page auteur ****/

#croisiere-famille {
	position: relative;
}

@media (min-width: 90em) {


	#croisiere-famille::after,
	#reviews-readers::after {
		content: "";
		position: absolute;
		right: -8rem;
		bottom: 8rem;
		width: 28rem;
		height: 25.9rem;
		background-image: url("../img/globe-darkblue-svg.svg");
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
		transform: rotate(-25deg);
	}

}

/**** Page équipage ****/

.crew {
	position: relative;
}

.crew-grid {
	display: grid;
	row-gap: clamp(1.6rem, 1.143rem + 1.143vi, 3.2rem);
}

.crew-card {
	display: grid;
	row-gap: clamp(2.4rem, 1.943rem + 1.143vi, 4rem);
	padding-inline: clamp(3.2rem, 2.286rem + 2.286vi, 6.4rem);
	padding-block: clamp(5.6rem, 5.143rem + 1.143vi, 7.2rem);
	border-radius: 2rem;
	box-shadow: 0px 0px 10px rgba(44, 110, 143, 0.15);
}

.crew-card-intro {
	display: grid;
	grid-template-columns: 2fr 3fr;
	column-gap: clamp(1.6rem, 1.143rem + 1.143vi, 3.2rem);
	align-items: center;
}

.crew-card-intro .img-wrapper {
	position: relative;
	padding-right: clamp(2.4rem, 1.943rem + 1.143vi, 4rem);
}

.crew-card-intro .img-wrapper::before {
	content: "";
	position: absolute;
	right: 0;
	top: 0.4rem;
	bottom: 0.4rem;
	width: 4px;
	background: var(--yellow);
	border-radius: 0.2rem;
}

.crew-card-intro img {
	border-radius: 50%;
}

.crew-card h2 {
	z-index: 10;
	margin-bottom: 0rem;
}

.crew-card.boat-card {
	border-radius: unset;
	box-shadow: none;
}

.crew:has(+ .cta-middle-page.bg-mediumblue) .container {
	padding-bottom: clamp(4.8rem, 3.935rem + 2.703vi, 8.8rem);
}

.cta-middle-page.crew-page {
	margin-top: 0rem;
}

.caroussel-photos.crew-page {
	padding-top: 30rem;
	margin-top: -20rem;
}



@media (min-width: 62em) {

	.crew::before {
		content: "";
		position: absolute;
		right: -2rem;
		top: 8rem;
		width: 33rem;
		height: 31.2rem;
		background-image: url("../img/wave-lghtblue.svg");
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
	}

	.crew-grid {
		grid-template-columns: 1fr 1fr;
		column-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
	}

	.crew-card:nth-child(1) {
		position: relative;
		grid-row: 1 / 4;
	}

	.crew-card:nth-child(2) {
		grid-row: 2 / 5;
	}

	.crew-card:nth-child(3) {
		grid-row: 4 / 7;
	}

	.crew-card:nth-child(4) {
		grid-row: 5 / 8;
	}

	.crew-card:nth-child(5) {
		grid-row: 7 / 10;
	}
}

/**** Page voilier ****/

.cards-boat .container {
	row-gap: clamp(4rem, 3.238rem + 2.381vi, 5.6rem);
}

.cards-boat .section-intro {
	text-align: center;
}

.cards-grid-stairs {
	display: grid;
	row-gap: 2.4rem;
}

.cards-grid-stairs-item {
	padding: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
	box-shadow: 0px 0px 10px rgba(226, 225, 245, 0.15);
}


@media (min-width: 62em) {

	.cards-boat .section-intro {
		width: 85%;
		margin: auto;
	}

	.cards-grid-stairs {
		grid-template-columns: repeat(3, 1fr);
		column-gap: 2.4rem;
		align-items: start;
	}

	.cards-grid-stairs-item:nth-child(5) {
		margin-top: -16rem;
	}

	.cards-grid-stairs-item:nth-child(6) {
		margin-top: -24rem;
	}

		.cards-grid-stairs-item:nth-child(8) {
		margin-top: -10rem;
	}

	.cards-grid-stairs .img-2 {
		margin-top: -18rem;
	}

}


@media (min-width: 75em) {

	.cards-grid-stairs-item:nth-child(6) {
		margin-top: -22rem;
	}

	.cards-grid-stairs-item:nth-child(8) {
		margin-top: -14rem;
	}

	.cards-grid-stairs .img-2 {
		margin-top: -24rem;
	}

}

@media (min-width: 90em) {

		.cards-grid-stairs-item:nth-child(5) {
		margin-top: -12rem;
	}

	.cards-grid-stairs-item:nth-child(6) {
		margin-top: -18rem;
	}

	.cards-grid-stairs .img-2 {
		margin-top: -26rem;
	}

		.cards-grid-stairs-item:nth-child(8) {
		margin-top: -18rem;
	}

}

@media (min-width: 100em) {

		.cards-grid-stairs-item:nth-child(5) {
		margin-top: -12rem;
	}

		.cards-grid-stairs-item:nth-child(8) {
		margin-top: -14rem;
	}

}

/** Accordéon **/

.accordion-section {
	position: relative;
}

.accordion {
	display: grid;
	gap: 1.6rem;
	margin-top: clamp(4rem, 3.238rem + 2.381vi, 5.6rem);
	;
}

.accordion-item {
	overflow: hidden;
}

/* bouton */

.accordion-trigger {
	width: 100%;
	text-align: left;
	border: none;
	cursor: pointer;
	padding: 2rem 6rem 2rem 3rem;
	background: var(--white);
	position: relative;
	transition: 0.3s;
	box-shadow: 0px 5px 10px 0px rgba(226, 245, 255, 0.15);
}

.accordion-trigger:hover,
.accordion-item.active .accordion-trigger {
	background: var(--mediumblue);
	color: var(--white);
}

/* icone */

.accordion-trigger::after {
	content: "+";
	position: absolute;
	right: 2rem;
	font-weight: bold;
	top: 50%;
	transform: translateY(-50%);
	font-size: 2rem;
	transition: 0.3s;
	color: var(--yellow);
	border: solid 2px var(--yellow);
	padding-inline: 0.8rem;
	border-radius: 0.5rem;
}

.accordion-item.active .accordion-trigger::after {
	content: "-";
}

/* contenu */

.accordion-panel {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.35s ease;
	background: white;
}

.accordion-inner {
	padding: clamp(2.4rem, 1.714rem + 1.714vi, 4.8rem);
}

.accordion-image {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	align-items: flex-start;
}

.accordion-text-wrapper {
	display: grid;
	gap: 2rem;
}

/* layout interne */

.accordion-inner {
	display: grid;
	gap: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
}

@media (min-width: 62em) {

	.accordion-section .container {
		width: 80%;
		margin: auto;
	}

	.accordion-inner {
		grid-template-columns: 3fr 2fr;
	}

}

@media (min-width: 90em) {

	.accordion-section .container {
		width: 60%;
	}

	#tome-2 {
		position: relative;
	}

	.accordion-section::after,
	#tome-2::after {
		content: "";
		position: absolute;
		right: -8rem;
		width: 28rem;
		height: 25.9rem;
		background-image: url("../img/globe-darkblue-svg.svg");
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
		transform: rotate(-25deg);
	}

	.accordion-section::after {
		bottom: 16rem;
	}

	#tome-2::after {
		top: 50rem;
	}

}

/** Page Itineraire **/

/* barre d’ancres */

.hero-anchors {
	display: flex;
	gap: clamp(1.6rem, 1.371rem + 0.571vi, 2.4rem);
	flex-wrap: wrap;
	justify-content: center;
}

.hero-anchors a {
	position: relative;
	gap: 1.2rem;
	padding-right: 4rem;
	margin-top: 0rem;
}

.hero-anchor::after {
	content: "";
	width: 2rem;
	height: 2rem;
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
	background-image: url("../img/anchor-button.svg");
	background-size: contain;
	background-repeat: no-repeat;
	transition: transform .6s ease;
}

/* bouton */

.hero-anchor {
	display: inline-flex;
	align-items: center;
}

/* Section map full width */

.carte-wrapper {
	position: relative;
	margin: auto;
	overflow: hidden;
	box-shadow: 0px 5px 10px 0px rgba(226, 245, 255, 0.15);
	border: 2px solid var(--lightblue);
}

.carte-wrapper img {
	display: block;
	width: 100%;
	height: auto;
	transform: scale(1.01);
}

.btn-wrapper-map {
	position: absolute;
	z-index: 10;
	bottom: clamp(1.6rem, 0.686rem + 2.286vi, 4.8rem);
	left: clamp(1.6rem, 0.686rem + 2.286vi, 4.8rem);
}

.upload-btn {
	gap: 1.2rem;
	padding-right: 4rem;
	margin-top: 0rem;
}

.upload-btn::before {
	content: "";
	width: 2rem;
	height: 2rem;
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
	background-image: url("../img/upload-icon.svg");
	background-size: contain;
	background-repeat: no-repeat;
	transition: transform .6s ease;
}

/* Section itinéraire */

.itineraire-grid {
	display: grid;
	grid-auto-rows: minmax(120px, auto);
	gap: 2.4rem;
	margin-top: clamp(4rem, 3.238rem + 2.381vi, 5.6rem);
}

.carte {
	overflow: hidden;
	box-shadow: 0px 0px 10px rgba(226, 225, 245, 0.15);
}

.carte img {
	transform: scale(1.05);

}

.btn-card {
	text-align: center;
}


.card {
	padding: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
	box-shadow: 0px 0px 10px rgba(226, 225, 245, 0.15);
}

.card .country-list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	row-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
}

.img-lightbox {
	cursor: zoom-in;
}

/* overlay */

.lightbox {
	z-index: 9999;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.9);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
}

.lightbox img {
	height: auto;
	max-width: 70%;
	max-height: 70%;
}

/* actif */

.lightbox.active {
	opacity: 1;
	visibility: visible;
	cursor: zoom-out;
}

@media (min-width: 62em) {

	.itineraire-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.etape-panama,
	.etape-traversee,
	.card.btn-card,
	.etape-afrique,
	.etape-caraibes,
	.etape-pacifique-sud,
	.etape-indonesie,
	.etape-europe-retour,
	.etape-afrique-retour {
		grid-row: span 2;
	}

	.etape-europe,
	.etape-bresil,
	.carte {
		grid-row: span 3;
	}

	.itineraire-pacifique .carte {
		grid-row: span 1;
	}

	.itineraire-pacifique .btn-card,
	.itineraire-atlantique-retour .btn-card {
		grid-column: 3 / 4;
	}

	.itineraire-atlantique-retour .carte {
		grid-row: span 1;
	}

	.itineraire-atlantique,
	.itineraire-pacifique,
	.itineraire-indien,
	.itineraire-atlantique-retour {
		position: relative;
	}

	.itineraire-atlantique::before,
	.itineraire-pacifique::before,
	.itineraire-indien::before {
		content: "";
		position: absolute;
		width: 21.1rem;
		height: 25.4rem;
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
		transform: rotate(-25deg);
	}

	.itineraire-atlantique::before {
		bottom: 2rem;
		left: -4rem;
		background-image: url("../img/ancre-lightblue.svg");
	}

	.itineraire-pacifique::before {
		bottom: 4rem;
		left: 10rem;
		background-image: url("../img/rose-des-vents-white.svg");
	}

	.itineraire-indien::before {
		bottom: 4rem;
		left: 10rem;
		transform: rotate(0deg);
		background-image: url("../img/boat-illustration-blue.svg");
	}

}

/** Page Présentation **/

.hero-bg-presentation .container {
	padding-bottom: (5.6rem, 4.547rem + 2.632vi, 9.6rem);
}

.preface-wrapper {
	position: relative;
	padding-inline: clamp(5.6rem, 4.686rem + 2.286vi, 8.8rem);
	padding-block: clamp(7.2rem, 6.286rem + 2.286vi, 10.4rem);
}

.book-numbers-wrapper {
	display: grid;
	row-gap: clamp(4rem, 3.238rem + 2.381vi, 5.6rem);
	margin-block: clamp(4rem, 3.238rem + 2.381vi, 5.6rem);
}

.book-numbers-wrapper .img-wrapper {
	width: 80%;
	margin-inline: auto;
}

.key-numbers-list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
}

.key-numbers-list .key-numbers-item {
	font-size: clamp(2rem, 1.657rem + 0.857vi, 3.2rem);
	font-family: 'Playfair Display', serif;
	font-weight: normal;
	line-height: calc(13/10);
	text-align: center;
	padding: clamp(1.6rem, 1.371rem + 0.571vi, 2.4rem);
	padding-top: clamp(0.6rem, 0.371rem + 0.571vi, 1.4rem);
}

.key-numbers-item span {
	font-size: clamp(3.2rem, 2.286rem + 2.286vi, 6.4rem);
}

.numbers-button-wrapper .btn-wrapper {
	display: grid;
	margin-top: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
}

.zoom-btn {
	justify-self: flex-start;
	gap: 1.2rem;
	padding-right: 4rem;
	margin-top: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
}

.zoom-btn::before {
	content: "";
	width: 2rem;
	height: 2rem;
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
	background-image: url("../img/loupe-icon.svg");
	background-size: contain;
	background-repeat: no-repeat;
	transition: transform .6s ease;
}

.quote-stand-alone .container {
	display: grid;
	grid-template-columns: 2fr 5fr;
	column-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
}

.quote-stand-alone .wrapper-img img {
	max-height: 21rem;
	height: auto;
	width: auto;
	border-radius: 50%;
}


@media (min-width: 62em) {

	.preface-wrapper {
		width: 66%;
		margin-inline: auto;
	}

	.preface-wrapper h2,
	.preface-wrapper .p-wrapper {
		position: relative;
		z-index: 1;
	}

	.preface-wrapper::before,
	.preface-wrapper::after {
		content: "";
		position: absolute;
		z-index: 0;
		width: 12.9rem;
		height: 10.5rem;
		background-repeat: no-repeat;
		background-size: contain;
		pointer-events: none;
	}

	.preface-wrapper::before {
		top: 4rem;
		left: 2.4rem;
		background-image: url("../img/quote-white-open.svg");
	}

	.preface-wrapper::after {
		bottom: 2.4rem;
		right: 2.4rem;
		background-image: url("../img/quote-white-close.svg");
	}

	.book-key-numbers .container {
		width: 80%;
		margin-inline: auto;
	}

	.numbers-button-wrapper {
		padding-top: 10%;
	}

	.book-numbers-wrapper .img-wrapper {
		width: 100%;
	}

	.book-numbers-wrapper {
		grid-template-columns: 3fr 5fr;
		column-gap: clamp(4.8rem, 0.88rem + 3.956vi, 8rem);
	}

	.book-detail .p-wrapper:first-of-type {
		margin-bottom: clamp(3.2rem, 2.971rem + 0.571vi, 4rem);
	}

	.quote-stand-alone {
		width: 50%;
		margin-inline: auto;
	}

	.quote-stand-alone .container {
		align-items: center;
	}

	.quote-stand-alone .wrapper-quote {
		padding-block: clamp(2.4rem, 1.418rem + 0.99vi, 3.2rem);
	}

}

/** Page avis **/

.reviews h2 {
	text-align: center;
}

.reviews-wrapper {
	margin-top: clamp(3.2rem, -0.72rem + 3.956vi, 6.4rem);
}

.reviews-wrapper,
.reviews-list {
	display: grid;
	row-gap: clamp(1.6rem, 1.143rem + 1.143vi, 3.2rem);
}

.reviews-item {
	z-index: 10;
	display: grid;
	align-items: center;
	padding-inline: clamp(3.2rem, 2.286rem + 2.286vi, 6.4rem);
	padding-block: clamp(5.6rem, 5.143rem + 1.143vi, 7.2rem);
	border-radius: 2rem;
	box-shadow: 0px 0px 10px rgba(44, 110, 143, 0.15);
}

.reviews-item.bg-lightblue {
	position: relative;
}

.reviews-item.bg-lightblue::before {
	content: "";
	position: absolute;
	bottom: -4rem;
	right: -2rem;
	width: 16rem;
	height: 20rem;
	background-image: url("../img/rose-des-vents-white.svg");
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
	transform: rotate(-25deg);
}

.reviews-item.reviews-cta {
	display: block;
	box-shadow: none;
	border-radius: 0;
}

.reviews-item .h3-like {
	margin-bottom: 0rem;
}

@media (min-width: 62em) {

	#reviews-readers {
		position: relative;
	}

	.reviews-wrapper {
		grid-template-columns: 1fr 1fr;
		column-gap: clamp(2.4rem, 2.171rem + 0.571vi, 3.2rem);
	}

	.reviews-list.list-2 {
		padding-top: clamp(6.4rem, 3.453rem + 2.97vi, 8.8rem);
	}

}

/** Page remerciements **/

.thank-you-list {
	display: grid;
	gap: 2rem;
	list-style: disc !important;
	padding-left: 2rem !important;
}

@media (min-width: 62em) {

	.thanks .container {
		width: 80%;
		margin-inline: auto;
	}

}

@media (min-width: 90em) {

	.thanks .container {
		width: 66%;
	}

}

/** Woo Commerce **/

/* ===== PAGE PRODUIT ===== */

.product-page {
	background-color: var(--lightblue);
}

.product-page .container,
.checkout-page .container,
.cart-page .container {
	padding-top: clamp(9.6rem, 6.857rem + 6.857vi, 19.2rem);
}

.single-product main {
	display: block;
	/* évite conflits avec ton grid global */
}

.single-product .product {
	display: grid;
	column-gap: clamp(4.8rem, 3.935rem + 2.703vi, 8.8rem);
	row-gap: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
}

.single-product .splide__arrow {
	background: var(--white);
	border: 2px solid var(--yellow) !important;
	width: 4em !important;
	height: 4em !important;
}

@media (min-width: 62em) {
	.woocommerce div.product {
		display: grid;
		grid-template-columns: 5fr 4fr;
		align-items: start;
	}
}

.woocommerce div.product .summary {
	display: grid;
	gap: 2rem;
}

/* Titre */
.woocommerce div.product .product_title {
	font-family: 'Playfair Display', serif;
	font-size: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
	color: var(--darkblue);
}

/* Prix */
.woocommerce div.product .price{
	font-family: 'Playfair Display', serif;
	color: var(--yellow);
}

.woocommerce div.product .price span{
	font-size: clamp(3.2rem, 2.743rem + 1.143vi, 4.8rem);
}

.woocommerce .quantity input {
	padding: 1rem;
	border: 1px solid var(--lightblue);
	border-radius: 0.5rem;
	width: 60px;
	box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.06);
}

.tabs.wc-tabs{
	display: none;
}

.woocommerce-Tabs-panel h2{
	display: none;
}

.woocommerce-Tabs-panel h3{
	margin-top: 3.2rem;
}

/* Meta produit */
.product_meta {
	display: none;
}

/* Breadcrumb */
.woocommerce-breadcrumb {
	display: none;
}

.product-gallery {
	display: grid;
	gap: 1.6rem;
}

.main-slider img {
	border-radius: 1rem;
	height: auto;
	object-fit: contain;
}

/* ===== THUMBNAILS ===== */

.thumbnails {
	margin-top: 1.6rem;
}

.thumbnails .splide__list {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.thumbnails .splide__slide {
	width: 80px !important;
	height: 80px !important;
	opacity: 0.4;
	cursor: pointer;
	transition: all 0.3s ease;
	border-radius: 0.5rem;
	overflow: hidden;
}

.thumbnails .splide__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.splide__track--nav>.splide__list>.splide__slide.is-active {
	opacity: 1 !important;
	border: 1px solid var(--yellow) !important;
}

.main-slider {
	background: var(--white);
	padding: 2rem;
	border-radius: 1rem;
	box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.05);
}

.main-slider img:hover {
	transform: scale(1.02);
	transition: transform 0.4s ease;
}

/* ===== CHECKOUT ===== */



/* Layout */
.woocommerce-checkout form.checkout {
	display: grid;
	gap: 4rem;
}

@media (min-width: 62em) {
	.woocommerce-checkout form.checkout {
		grid-template-columns: 2fr 1fr;
	}
}

/* Champs formulaire */
.woocommerce-checkout input,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
	width: 100%;
	padding: 1.2rem;
	border: 1px solid var(--lightblue);
	border-radius: 0.5rem;
	font-family: 'Inter', sans-serif;
}

/* Labels */
.woocommerce-checkout label {
	font-weight: 600;
	margin-bottom: 0.5rem;
}

/* Sections */
.woocommerce-billing-fields,
.woocommerce-additional-fields {
	display: grid;
	gap: 1.6rem;
}

/* Résumé commande */
.woocommerce-checkout-review-order {
	background: var(--lightblue);
	padding: 2rem;
	border-radius: 1rem;
	position: sticky;
	top: 100px;
}

/* Bouton paiement */
#place_order {
	width: 100%;
	background: var(--mediumblue);
	color: var(--white);
	padding: 1.6rem;
	border-radius: 1rem;
	border: none;
	font-weight: 700;
	text-transform: uppercase;
	margin-top: 2rem;
	transition: .3s;
}

#place_order:hover {
	background: var(--yellow);
	color: var(--darkblue);
}

/* Supprimer titres inutiles */
.woocommerce-checkout h3 {
	display: none;
}

/* Supprimer coupon */
.woocommerce-form-coupon-toggle {
	display: none;
}

.wc-block-components-button:not(.is-link) {
	transition: all .5s ease-in-out;
	margin-top: 0rem;
}

/** Pages légales **/

.legal h3 {
	margin-top: 4rem;
}

/** Pages Contact **/

@media (min-width: 90em) {

	.contact-form .container {
		width: 80%;
		margin-inline: auto;
	}

}

/** Pages Checkout**/

#wc-stripe-express-checkout-element{
	display: none !important;
}

.custom-order-summary{
	display: none;
}

.wsp-container ul {
    list-style: disc;
    padding-left: 20px;
}

.wsp-container li {
    margin-bottom: 5px;
}

.wsp-container h2,
.woocommerce-order-details__title,
.woocommerce-column__title {
    margin-top: 3.2rem;
}

/* TABLEAU GLOBAL */
.woocommerce-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    font-size: 16px;
}

/* HEADER */
.woocommerce-table th {
    text-align: left;
    padding: 12px;
    border-bottom: 2px solid #1f2f36;
    font-weight: 600;
}

/* CELLULES */
.woocommerce-table td {
    padding: 12px;
	border-bottom: 2px solid #1f2f36;
}

.checkout-header p {
    display: none;
}

body.woocommerce-order-received .checkout-header h1 {
    font-size: 0;
}

body.woocommerce-order-received .checkout-header h1::after {
    content: "Commande finalisée";
    font-size: 48px;
    display: block;
}
