:root{
	--corporative-color: #cd943d;
	--mirai-finder-border-radius: 18px;
	--mirai-finder-field-border-radius: 12px;
	--mirai-finder-button-border-radius: 12px;

}

/* ============================================================= */
/* Cadre decoratif dore + moteur de reservation                  */
/* ------------------------------------------------------------- */
/* 1) On retablit le retrait du contenu identique au site        */
/*    d'origine (110px en haut sous le header, 20px sur les      */
/*    cotes et en bas). Necessaire pour que le flux des sections */
/*    et les pages interieures soient corrects, et pour que les  */
/*    sections blanches ne debordent pas dans les coins arrondis.*/
/* 2) Sur cette version (moteur Mirai + Lenis), la reference du  */
/*    "position: sticky" du hero est decalee de la hauteur du    */
/*    header : avec top:110px la photo descend a 220px et cree   */
/*    un vide. On remet donc le hero a top:0 pour qu'il se cale  */
/*    a 110px comme sur le site d'origine, sans decaler le flux. */
/* ============================================================= */
html body {
	padding: 110px 20px 20px 20px !important;
	box-sizing: border-box !important;
}
@media (max-width: 700px) {
	html body {
		padding: 50px 10px 10px 10px !important;
	}
}
body.herozoom .hero {
	top: 0 !important;
}

/* ============================================================= */
/* Barre de reservation : masquee pendant l'intro                */
/* Tant que l'intro est verrouillee (html.intro-locked), on      */
/* cache la barre pour qu'elle n'apparaisse pas en blanc         */
/* par-dessus le voile dore. Elle reapparait a la fin de l'intro */
/* (classe is-ready) une fois intro-locked retiree.              */
/* ============================================================= */
html.intro-locked .mirai-bar {
	opacity: 0 !important;
	visibility: hidden !important;
}

/* ============================================================= */
/* Barre de reservation sur mobile                               */
/* Par defaut le mobile la mettait en pleine largeur collee aux  */
/* bords, coins arrondis en haut seulement. On la remet en carte */
/* centree et entierement arrondie, comme sur desktop (le JS     */
/* gere le sticky : superposee au hero puis fixee en bas).       */
/* ============================================================= */
@media (max-width: 700px) {
	body .mirai-bar {
		width: min(820px, calc(100% - 24px)) !important;
		left: 50% !important;
		right: auto !important;
		transform: translateX(-50%) !important;
	}
	body .mirai-bar [data-mirai-component="finder"] {
		border-radius: 16px !important;
		box-shadow: 0 12px 40px rgba(40, 37, 37, .18) !important;
	}
}

/* ================================= */
/* CSS FOR NEW CLUB */
[data-mirai-component="signup"] {
    display: flex;
    justify-content: center;
}

[data-mirai-component="profile"],
[data-mirai-component="signup"] {
    padding: 100px 0;
}

/* ============================================================= */
/* Bloc txtimg (accueil / hotel / chambres) : photos non deformees */
/* object-fit: cover pour eviter l'ecrasement des photos portrait  */
/* dans les cadres carre (img2) et rond (img1). On NE reduit plus  */
/* la taille des images (retour Guillaume : garder taille d'origine). */
/* ============================================================= */
body .txtimg .imgmorph img {
	object-fit: cover !important;
}

/* ============================================================= */
/* Accueil : bulle verte du hero (« Vibrez. Bullez. Bougez ! »)    */
/* reduite d'environ 27% (retour Sidonie : trop grande, elle       */
/* masquait trop la photo). Cible uniquement le hero de l'accueil. */
/* ============================================================= */
body.home .hero .wrapper .split > div .bulle {
	width: clamp(170px, 13vw + 110px, 320px) !important;
	height: clamp(170px, 13vw + 110px, 320px) !important;
	padding: 22px !important;
}
body.home .hero .wrapper .split > div .bulle span {
	font-size: clamp(22px, 1.3vw + 16px, 37px) !important;
}


/* ============================================================= */
/* Accueil : titre du hero descendu un peu (retour Sidonie).      */
/* Le .split est centre verticalement ; on decale juste le titre  */
/* vers le bas (sans toucher a la bulle), sur desktop.            */
/* ============================================================= */
@media (min-width: 701px) {
	body.home .hero .wrapper .split > div:first-child h1 {
		position: relative;
		top: clamp(70px, 14vh, 175px);
	}
}


/* ============================================================= */
/* Fiche Classique : hero a 2 colonnes (photo a gauche, bloc vert */
/* "La Classique..." a droite). La cliente (Cyan) est au centre   */
/* de la photo et se retrouvait a la limite du bloc vert.         */
/* On glisse la photo vers la gauche en l'ancrant a droite et en  */
/* l'elargissant : Cyan passe dans la zone visible, et le         */
/* debordement (toujours couvert) evite tout vide. Desktop only.  */
/* ============================================================= */
@media (min-width: 1000px) {
	body .hero.small .slide img.slide[src*="classique-double-a-0004"] {
		left: auto !important;
		right: 0 !important;
		width: 130% !important;
		max-width: none !important;
		object-position: center 42% !important;
	}
}


/* ============================================================= */
/* Coin haut-droite "casse" : l'element <html> n'avait pas de    */
/* fond, donc la gouttiere de scroll et le coin arrondi du cadre */
/* laissaient voir le noir du navigateur. On met le meme dore    */
/* que le body pour que tout soit homogene.                      */
/* ============================================================= */
html, html.lenis {
	background: #B38B57 !important;
}
