:root {
	--coul-white: #FFFFFF;
	--coul-blue: #19255a;
	--coul-golden: #beaf8a;
	--coul-sand: #e3ddcc;
  	--coul-egg: #f6f4ee;
	--coul-brown: #3c2f21;
	
	--coul-bordeaux: #72253D;
	--coul-background: #fbf9f7;
	--coul-coral: #e4a696;
	--coul-coral-light: #f4deda;
	--coul-carbon: #242424;
	--coul-clay-light: #efdfdb;
	--coul-clay-transparent: #b46a5580;
	--coul-beige: #c6a992;
	--coul-sky: #ced9e5;
	--coul-grey-green: #b0bdb0;
	--coul-quartz: #bfa5b8;
	--coul-clay: #b46a55;
	--coul-green: #5d7975;

	--gap : 10px;
	--gap2: calc(var(--gap) * 2);
	--gap4: calc(var(--gap) * 4);
	--gap8: calc(var(--gap) * 8);
	--gap16: calc(var(--gap) * 16);
	
	--responsive-hamburger-height: 60px;
	
	/* Font size */
	--fsize1: 16px;
	--fsize2: 20px;
	--fsize3: 40px;
	--fsize4: 56px;
	--fsize5: 96px;
	--fsize6: 128px;
	--fsizemin : max(0.75em, 12px);
	
	--transitionA : 0.5s;
	--transitionB : 1s;
}

html {
	scroll-behavior: smooth;
}

* {
	box-sizing: border-box;
}

h1, h2, h3, h4 {
	margin: 0;
	font-weight: normal;
}

p {
	margin: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

pre {
	white-space: break-spaces;
}

input, textarea, select, button {
	font-family: inherit;
	font-size: inherit;
	outline: none;
	color: inherit;
	padding: var(--gap);
}

/* Loading */

#loading {
	height: 100vh;
	width: 100vw;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 300;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	grid-gap: var(--gap4);
	background-color: var(--coul-white);
	transition: var(--transitionB);
	opacity: 0;
	pointer-events: none;
	user-select: none;
	transition-delay: 0.2s;
}

.loader, .loader:before, .loader:after {
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  animation-fill-mode: both;
  animation: bblFadInOut 1.8s infinite ease-in-out;
}

.loader {
  font-size: 7px;
  position: relative;
  text-indent: -9999em;
  transform: translateZ(0);
  animation-delay: -0.16s;
}

.loader:before,
.loader:after {
  content: '';
  position: absolute;
  top: 0;
}

.loader:before {
  left: -3.5em;
  animation-delay: -0.32s;
}

.loader:after {
  left: 3.5em;
}

@keyframes bblFadInOut {
  0%, 80%, 100% { box-shadow: 0 2.5em 0 -1.3em }
  40% { box-shadow: 0 2.5em 0 0 }
}

#loading img {
	max-width: 80px;
}

#loading p {
	font-size: var(--fsize3);
}

#loading.loading-visible {
	transform: translateY(0);
	opacity: 1;
	pointer-events: all;
}

.newsletter {
	display: flex;
	flex-direction: column;
	align-items: center;
	grid-gap: var(--gap2);
}

.newsletter-title {
	font-size: var(--fsize3);
	font-family: var(--fontfam);
}

.newsletter > p {
	text-align: center;
}

.newsletter > div {
	display: flex;
	text-align: center;
	grid-gap: var(--gap);
}

.newsletter > label {
	display: flex;
	text-align: left;
	grid-gap: var(--gap);
	align-items: flex-start;
}

.newsletter a {
	text-decoration: underline;
}

.newsletter button {
	background-color: var(--coul-white);
	border: none;
	padding: var(--gap);
	cursor: pointer;
}
/* ============================================================
   Accessibilité (RGAA)
   ============================================================ */

/* Texte réservé aux technologies d'assistance */
.sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Lien d'évitement : visible uniquement au focus */
.skip-link {
	position: fixed;
	top: var(--gap);
	left: var(--gap);
	z-index: 10000;
	padding: var(--gap) var(--gap2);
	background-color: var(--coul-white);
	color: var(--coul-carbon);
	font-weight: bold;
	transform: translateY(-200%);
}

.skip-link:focus {
	transform: none;
}

/* Bouton sans style navigateur : l'apparence reste celle de la classe du composant */
.reset-button {
	appearance: none;
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	color: inherit;
	font: inherit;
	text-align: inherit;
	cursor: pointer;
}

.link-button {
	appearance: none;
	background: none;
	border: 0;
	padding: 0;
	color: inherit;
	font: inherit;
	text-align: inherit;
	cursor: pointer;
}

/* Focus clavier toujours visible */
html :focus-visible {
	outline: 2px solid currentColor !important;
	outline-offset: 3px;
}

/* Cases à cocher et boutons radio des accordéons / détails : masqués visuellement mais atteignables au clavier */
.visually-hidden-input {
	position: absolute !important;
	opacity: 0 !important;
	width: 1px !important;
	height: 1px !important;
	margin: 0 !important;
	pointer-events: none;
}

.visually-hidden-input:focus-visible + label,
.visually-hidden-input:focus-visible ~ .accordion-title,
.visually-hidden-input:focus-visible ~ .offer-summary label,
.visually-hidden-input:focus-visible ~ .service-summary label {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

/* Contrôle de lecture des vidéos d'ambiance */
.video-toggle {
	position: absolute;
	right: var(--gap2);
	bottom: var(--gap2);
	z-index: 5;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: solid 1px var(--coul-white);
	background-color: rgba(0, 0, 0, 0.6);
	color: var(--coul-white);
	cursor: pointer;
}

.has-video-toggle {
	position: relative;
}

/* Animations réduites à la demande de l'utilisateur */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Liens dans les textes : distingués autrement que par la couleur */
main p a:not(.button):not([class*="button-"]),
main li a:not(.button):not([class*="button-"]),
main td a {
	text-decoration: underline;
}

/* Panneaux repliés (accordéons, détails d'offre et de carte cadeau) : leurs liens ne doivent pas recevoir le focus */
.accordion-content,
.offer-details,
.service-details,
.gift-card-details {
	visibility: hidden;
}

.accordion input:checked ~ .accordion-content,
.check-offer:checked ~ .offer-details,
.check-service:checked ~ .service-details,
.gift-card input:checked ~ .gift-card-details {
	visibility: visible;
}