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

* {
	min-height: 0;
	min-width: 0;
}
 
html{
	margin: 0px;
	padding: 0px;
	color: #000;
	background: #f8f6f5;
	font-size: 16px;
	border: 0px solid transparent;
	font-family: 'MinervaModern',Arial,sans-serif;
	height: 100%;
}

body{
	margin: 0px;
	padding: 0px;
	width: 100%; 
	position:relative;
	direction: ltr;
	background-color: #f8f6f5;
}

a { 
	outline: none;
	text-decoration: none;
	cursor: pointer;
	color: inherit;
}

img { border: none; }

:focus {outline:none;}
::-moz-focus-inner {border:0;}

::-moz-selection { color: #FFF; background: #009fe3; }
::selection  { color: #FFF; background: #009fe3; }

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    font-size: 14px;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   	font-size: 14px;
   	/*opacity:  1;*/
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   	font-size: 14px;
   	/*opacity:  1;*/
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   	font-size: 14px;
}
:placeholder-shown {
  	font-size: 14px;
}
::placeholder {
	font-size: 14px;
}

.flol{ float: left; }
.flor { float: right; }
.alc{ text-align: center; }
.alr{ text-align: right; }
.prel { position: relative; }

.fin{
	clear:both;
	line-height:0;
	height:0;
	font-size:1px;
}

#strErreur, 
#strInfo,
#strValide,
#strLink{ display: none; }

.width50 {
	width: 50%;
}

/**********/

h1,h2,h3,h4{ margin: 0px; }
html {height: 100%;}
* {margin:0;padding:0;}

/*********
 * FONTS *
 ********/
@font-face {
    font-family: 'MinervaModern';
    src: url('../font/MinervaModern-Italic.eot');
    src: url('../font/MinervaModern-Italic.eot?#iefix') format('embedded-opentype'),
        url('../font/MinervaModern-Italic.woff2') format('woff2'),
        url('../font/MinervaModern-Italic.woff') format('woff'),
        url('../font/MinervaModern-Italic.ttf') format('truetype'),
        url('../font/MinervaModern-Italic.svg#MinervaModern-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bon Vivant Serif';
    src: url('../font/BonVivantSerif-Bold.eot');
    src: url('../font/BonVivantSerif-Bold.eot?#iefix') format('embedded-opentype'),
        url('../font/BonVivantSerif-Bold.woff2') format('woff2'),
        url('../font/BonVivantSerif-Bold.woff') format('woff'),
        url('../font/BonVivantSerif-Bold.ttf') format('truetype'),
        url('../font/BonVivantSerif-Bold.svg#BonVivantSerif-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'MinervaModern';
    src: url('../font/MinervaModern-Bold.eot');
    src: url('../font/MinervaModern-Bold.eot?#iefix') format('embedded-opentype'),
        url('../font/MinervaModern-Bold.woff2') format('woff2'),
        url('../font/MinervaModern-Bold.woff') format('woff'),
        url('../font/MinervaModern-Bold.ttf') format('truetype'),
        url('../font/MinervaModern-Bold.svg#MinervaModern-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bon Vivant Serif';
    src: url('../font/BonVivantSerif.eot');
    src: url('../font/BonVivantSerif.eot?#iefix') format('embedded-opentype'),
        url('../font/BonVivantSerif.woff2') format('woff2'),
        url('../font/BonVivantSerif.woff') format('woff'),
        url('../font/BonVivantSerif.ttf') format('truetype'),
        url('../font/BonVivantSerif.svg#BonVivantSerif') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bon Vivant';
    src: url('../font/BonVivant-Regular.eot');
    src: url('../font/BonVivant-Regular.eot?#iefix') format('embedded-opentype'),
        url('../font/BonVivant-Regular.woff2') format('woff2'),
        url('../font/BonVivant-Regular.woff') format('woff'),
        url('../font/BonVivant-Regular.ttf') format('truetype'),
        url('../font/BonVivant-Regular.svg#BonVivant-Regular') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'MinervaModern';
    src: url('../font/MinervaModern-Regular.eot');
    src: url('../font/MinervaModern-Regular.eot?#iefix') format('embedded-opentype'),
        url('../font/MinervaModern-Regular.woff2') format('woff2'),
        url('../font/MinervaModern-Regular.woff') format('woff'),
        url('../font/MinervaModern-Regular.ttf') format('truetype'),
        url('../font/MinervaModern-Regular.svg#MinervaModern-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Sackers Gothic Std';
    src: url('../font/SackersGothicStd-Light.eot');
    src: url('../font/SackersGothicStd-Light.eot?#iefix') format('embedded-opentype'),
        url('../font/SackersGothicStd-Light.woff2') format('woff2'),
        url('../font/SackersGothicStd-Light.woff') format('woff'),
        url('../font/SackersGothicStd-Light.ttf') format('truetype'),
        url('../font/SackersGothicStd-Light.svg#SackersGothicStd-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}


sup {
	font-size: 0.62em;
	line-height: 0;
	vertical-align: super;
}


/* Charte */

:root {
	--vert:          #232615;
	--vert-clair:    #3a3f26;
	--creme:         #f3f0eb;
	--creme-fonce:   #e7e2d8;
	--encre:         #1c1c18;
	--encre-douce:   #5b5a52;
	--blanc:         #ffffff;

	--serif:   'Bon Vivant Serif', Georgia, serif;
	--script:  'Bon Vivant', 'Bon Vivant Serif', serif;
	--texte:   'MinervaModern', Arial, sans-serif;
	--capitale:'Sackers Gothic Std', 'MinervaModern', Arial, sans-serif;

	--gouttiere: 40px;
	--large:     1320px;
}

.conteneur {
	width: 100%;
	max-width: var(--large);
	margin: 0 auto;
	padding: 0 var(--gouttiere);
}

/* Titre d'affichage */
.titre-serif {
	font-family: var(--serif);
	font-weight: normal;
	line-height: 1.1;
	letter-spacing: 0.01em;
}

/* Surtitre en capitales espacees */
.surtitre {
	font-family: var(--capitale);
	font-size: 12px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--encre-douce);
}

/* Boutons */
.btn {
	display: inline-block;
	padding: 14px 28px;
	font-family: var(--capitale);
	font-size: 12px;
	letter-spacing: 0.18em;
	/* Rattrape le blanc ajoute apres la derniere lettre. */
	text-indent: 0.18em;
	text-align: center;
	text-transform: uppercase;
	border: 1px solid var(--vert);
	background: var(--vert);
	color: var(--blanc);
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}
.btn:hover { background: transparent; color: var(--vert); }

.btn--clair {
	background: var(--blanc);
	border-color: var(--blanc);
	color: var(--encre);
}
.btn--clair:hover { background: transparent; color: var(--blanc); }

.btn--fantome {
	background: transparent;
	border-color: var(--blanc);
	color: var(--blanc);
}
.btn--fantome:hover { background: var(--blanc); color: var(--encre); }

.btn--sm { padding: 10px 20px; font-size: 11px; }


/* ---- En-tete ---- */

.entete {
	position: relative;
	z-index: 10;
	background: var(--creme);
	border-bottom: 1px solid var(--creme-fonce);
}
.entete__barre {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	min-height: 96px;
}
.entete__logo {
	font-family: var(--serif);
	font-weight: bold;
	font-size: clamp(18px, 1.9vw, 25px);
	line-height: 1;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--encre);
	white-space: nowrap;
}
.entete__nav {
	display: flex;
	align-items: center;
	gap: 26px;
	margin-left: auto;
}
.entete__lien {
	font-family: var(--capitale);
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--encre);
	padding-bottom: 3px;
	border-bottom: 1px solid transparent;
	white-space: nowrap;
}
.entete__lien:hover,
.entete__lien--actif { border-bottom-color: var(--vert); }

.entete__cote {
	display: flex;
	align-items: center;
	gap: 16px;
	padding-left: 10px;
}
.bascule-langue {
	display: inline-flex;
	border: 1px solid var(--creme-fonce);
	border-radius: 999px;
	overflow: hidden;
	background: var(--blanc);
}
.bascule-langue__item {
	padding: 6px 13px;
	font-family: var(--capitale);
	font-size: 10px;
	letter-spacing: 0.12em;
	color: var(--encre-douce);
	line-height: 1;
	transition: background 0.2s ease, color 0.2s ease;
}
.bascule-langue__item:hover { color: var(--vert); }
.bascule-langue__item.est-actif {
	background: var(--vert);
	color: var(--blanc);
}

.entete__bascule { display: none; }
.entete__burger { display: none; }


/* ---- Ouverture ---- */

.hero {
	position: relative;
	min-height: clamp(520px, 78vh, 720px);
	display: flex;
	align-items: flex-end;
	background-size: cover;
	background-position: center 60%;
}
.hero__voile {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(28,28,24,0.15) 0%, rgba(28,28,24,0.65) 100%);
}
.hero__contenu {
	position: relative;
	padding-bottom: 80px;
	padding-top: 120px;
	color: var(--blanc);
	text-align: center;
}
.hero__titre {
	font-size: clamp(42px, 6vw, 86px);
	margin: 0 0 14px 0;
	color: var(--blanc);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.hero__accroche {
	font-family: var(--capitale);
	font-size: 13px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	margin: 0 0 34px 0;
}
.hero__actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }


/* ---- Presentation ---- */

.presentation { background: var(--creme); padding: 90px 0; }
.presentation__grille {
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: 70px;
	align-items: start;
}
.chiffres { padding-top: 12px; }
.presentation__texte h2 {
	font-size: clamp(26px, 2.6vw, 38px);
	margin: 0 0 22px 0;
	color: var(--encre);
}
.presentation__texte p {
	font-family: var(--texte);
	font-size: 17px;
	line-height: 1.7;
	color: var(--encre-douce);
	margin: 0;
}

.chiffres {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 34px 24px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.chiffres__item {
	display: flex;
	align-items: center;
	gap: 16px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--creme-fonce);
}
.chiffres__item i {
	font-size: 22px;
	color: var(--vert);
	width: 30px;
	text-align: center;
	flex: 0 0 auto;
}
.chiffres__valeur {
	font-family: var(--serif);
	font-weight: normal;
	font-size: 26px;
	color: var(--encre);
	margin-right: 2px;
}
.chiffres__libelle {
	font-family: var(--capitale);
	font-size: 11px;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--encre-douce);
	line-height: 1.5;
}


/* ---- Cartes ---- */

.cartes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }

.carte {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 4 / 3;
}
.carte__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}
.carte:hover .carte__image { transform: scale(1.04); }
.carte::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(28,28,24,0) 45%, rgba(28,28,24,0.7) 100%);
}
.carte__legende {
	position: absolute;
	z-index: 2;
	left: 0;
	right: 0;
	bottom: 22px;
	color: var(--blanc);
	font-size: 24px;
	padding: 0 24px;
}


/* ---- Usages ---- */

.usages { background: var(--creme); padding: 90px 0; }
.usages__titre {
	text-align: center;
	font-size: clamp(28px, 3vw, 42px);
	margin: 0 0 44px 0;
	color: var(--encre);
}
.usages__grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }


/* ---- Histoire ---- */

.recit { display: grid; grid-template-columns: 1fr 1fr; }
.recit__texte {
	background: var(--vert);
	color: var(--creme);
	padding: 90px clamp(30px, 5vw, 80px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
}
.surtitre--clair { color: rgba(243,240,235,0.65); }
.recit__corps {
	font-family: var(--texte);
	font-size: 17px;
	line-height: 1.75;
	margin: 18px 0 30px 0;
}
.recit__image {
	background-size: cover;
	background-position: center;
	min-height: 420px;
}


/* ---- Banniere de page ---- */

.banniere {
	position: relative;
	min-height: clamp(280px, 42vh, 420px);
	display: flex;
	align-items: flex-end;
	background-size: cover;
	background-position: center;
}
.banniere__voile {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(28,28,24,0.1) 0%, rgba(28,28,24,0.6) 100%);
}
.banniere__contenu { position: relative; padding-bottom: 44px; padding-top: 80px; }
.banniere__titre {
	margin: 0;
	color: var(--blanc);
	font-size: clamp(32px, 4.4vw, 60px);
	text-transform: uppercase;
	letter-spacing: 0.03em;
}


/* ---- Equipements ---- */

.equipements { background: var(--creme); padding: 84px 0; }
.equipements--suite { padding-top: 40px; }

.page-texte__corps strong,
.recit-page__texte strong,
.presentation__texte strong{
	font-weight: bold;
	color: var(--vert);
}
.page-texte__corps em,
.recit-page__texte em { font-style: italic; }
.equipements__titre {
	font-size: clamp(26px, 2.8vw, 40px);
	margin: 0 0 46px 0;
	color: var(--encre);
}
.equipements__grille {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 44px 36px;
}
.groupe .surtitre { margin: 0 0 18px 0; padding-bottom: 12px; border-bottom: 1px solid var(--creme-fonce); }
.groupe__liste { list-style: none; margin: 0; padding: 0; }
.groupe__liste li {
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding: 7px 0;
	font-family: var(--capitale);
	font-size: 11px;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--encre-douce);
	line-height: 1.5;
}
.groupe__liste i { color: var(--vert); width: 18px; flex: 0 0 auto; font-size: 13px; }
.groupe__liste--lits i { opacity: 0.45; }


/* ---- Apercu photo ---- */

.apercu { background: var(--creme); padding-bottom: 84px; }
.apercu__grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
.apercu__image { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.apercu__actions {
	display: flex;
	gap: 14px;
	justify-content: center;
	flex-wrap: wrap;
	padding-top: 44px;
}
.btn--vide { background: transparent; color: var(--vert); }
.btn--vide:hover { background: var(--vert); color: var(--blanc); }


/* ---- Page de texte ---- */

.page-texte { background: var(--creme); padding: 84px 0; }
.page-texte__corps {
	max-width: 760px;
	text-align: center;
}
.page-texte__corps p {
	font-family: var(--texte);
	font-size: 18px;
	line-height: 1.8;
	color: var(--encre-douce);
	margin: 0 0 34px 0;
}

.banniere__accroche {
	margin: 14px 0 0 0;
	max-width: 620px;
	font-family: var(--serif);
	font-size: clamp(17px, 1.6vw, 23px);
	line-height: 1.45;
	color: rgba(255,255,255,0.92);
}

.page-texte--serre { padding-bottom: 20px; }
.usages--sobre { padding-top: 60px; }

/* ---- Salle de reception ---- */

.salle { background: var(--creme); padding: 30px 0 84px 0; }
.salle__grille {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 60px;
	align-items: center;
}
.salle__image img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.salle__texte h2 {
	margin: 0 0 26px 0;
	font-size: clamp(26px, 3vw, 42px);
	color: var(--encre);
}

/* ---- Entete de page sans photo ---- */

.entete-page {
	background: var(--creme);
	padding: 70px 0 10px 0;
	text-align: center;
}
.entete-page__titre {
	margin: 0;
	font-size: clamp(30px, 3.6vw, 50px);
	color: var(--encre);
}
.entete-page__accroche {
	margin: 12px 0 0 0;
	font-family: var(--serif);
	font-size: clamp(17px, 1.6vw, 22px);
	color: var(--encre-douce);
}


/* ---- Mentions legales ---- */

.legal { background: var(--creme); padding: 40px 0 84px 0; }
.legal__corps { max-width: 820px; }
.legal__titre {
	font-size: clamp(20px, 2vw, 27px);
	color: var(--vert);
	margin: 44px 0 16px 0;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--creme-fonce);
}
.legal__corps > .legal__titre:first-of-type { margin-top: 0; }
.legal__corps p {
	font-family: var(--texte);
	font-size: 16px;
	line-height: 1.75;
	color: var(--encre-douce);
	margin: 0 0 14px 0;
}

.identite {
	display: grid;
	grid-template-columns: minmax(150px, 230px) 1fr;
	gap: 10px 24px;
	margin: 0;
}
.identite dt {
	font-family: var(--capitale);
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--encre);
	padding-top: 3px;
}
.identite dd {
	margin: 0;
	font-family: var(--texte);
	font-size: 16px;
	line-height: 1.6;
	color: var(--encre-douce);
}
.identite dd a { text-decoration: underline; }
.identite dd a:hover { color: var(--vert); }

.courriel a { text-decoration: underline; }
.courriel a:hover { color: var(--vert); }


/* ---- Acces ---- */

.acces { background: var(--creme); padding: 50px 0 70px 0; }
.acces__grille {
	display: grid;
	grid-template-columns: 1fr 1.05fr;
	gap: 56px;
	align-items: start;
}

.plan {
	display: block;
	overflow: hidden;
	border: 1px solid var(--creme-fonce);
}
.plan img {
	display: block;
	width: 100%;
	transition: transform 0.6s ease;
}
.plan:hover img { transform: scale(1.03); }

.acces__colonne { display: grid; gap: 46px; }
.acces__details {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 34px 30px;
}

.detail { display: grid; grid-template-columns: 26px auto; gap: 16px; align-items: start; }
.detail i {
	display: grid;
	place-items: center;
	font-size: 17px;
	line-height: 1;
	padding-top: 3px;
	color: var(--vert);
}
.detail__titre {
	margin: 0 0 6px 0;
	font-family: var(--capitale);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--encre);
}
.detail__corps span,
.detail__corps a {
	display: block;
	font-family: var(--texte);
	font-size: 16px;
	line-height: 1.6;
	color: var(--encre-douce);
}
.detail__corps a { text-decoration: underline; }
.detail__corps a:hover { color: var(--vert); }


/* ---- Demande ---- */

.demande h2 {
	font-size: clamp(24px, 2.4vw, 34px);
	margin: 0 0 14px 0;
	color: var(--vert);
	padding-bottom: 12px;
	border-bottom: 1px solid var(--creme-fonce);
}

.formulaire fieldset { border: 0; margin: 0 0 14px 0; padding: 0; }
.formulaire__champs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.formulaire input[type="text"],
.formulaire input[type="tel"],
.formulaire input[type="mail"],
.formulaire textarea,
.formulaire select {
	width: 100%;
	padding: 13px 15px;
	border: 1px solid var(--creme-fonce);
	background: var(--blanc);
	font-family: var(--texte);
	font-size: 15px;
	color: var(--encre);
}
.formulaire textarea { min-height: 130px; resize: vertical; }
.formulaire input:focus,
.formulaire textarea:focus,
.formulaire select:focus { border-color: var(--vert); }

.formulaire__sejour { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.formulaire__sejour label { display: block; }
.formulaire__sejour label span {
	display: block;
	margin-bottom: 7px;
	font-family: var(--capitale);
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--encre-douce);
}

.formulaire .none { position: absolute; left: -9999px; width: 1px; height: 1px; }
.formulaire textarea { min-height: 110px; }
.formulaire .btn { display: block; margin: 6px 0 0 auto; }


/* ---- Duo image / texte ---- */


.recit-page {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 70px;
	align-items: center;
}
.recit-page__texte p {
	font-family: var(--texte);
	font-size: 18px;
	line-height: 1.8;
	color: var(--encre-douce);
	margin: 0 0 34px 0;
}

.cadre-photo {
	margin: 0;
	background: var(--blanc);
	padding: 16px 16px 0 16px;
	box-shadow: 0 14px 34px rgba(28,28,24,0.16);
	transform: rotate(2.5deg);
}
.cadre-photo img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}
.cadre-photo--paysage img { aspect-ratio: 4 / 3; }
.cadre-photo--paysage { transform: rotate(-2deg); }
.cadre-photo--sans-legende { padding-bottom: 16px; }
.cadre-photo__legende {
	font-family: var(--script);
	font-size: 22px;
	color: var(--encre-douce);
	text-align: center;
	padding: 16px 6px 20px 6px;
}


/* ---- Citation ---- */

.citation {
	position: relative;
	background-size: cover;
	background-position: center;
	display: flex;
	align-items: center;
	min-height: clamp(320px, 46vh, 460px);
}
.citation__voile { position: absolute; inset: 0; background: rgba(35,38,21,0.62); }
.citation__contenu { position: relative; text-align: center; padding: 60px var(--gouttiere); }
.citation__texte {
	margin: 0 auto;
	max-width: 900px;
	color: var(--blanc);
	font-size: clamp(24px, 3vw, 40px);
}
.citation__source { margin: 20px 0 30px 0; }


.coupure {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: 50px;
	align-items: center;
	max-width: 960px;
	margin: 0 auto;
	background: var(--blanc);
	padding: 44px;
}
.coupure__media img { width: 100%; max-width: 220px; display: block; margin: 0 auto; }
.coupure__corps h2 {
	font-size: 26px;
	margin: 0 0 16px 0;
	color: var(--encre);
}
.coupure__corps p {
	font-family: var(--texte);
	font-size: 16px;
	line-height: 1.7;
	color: var(--encre-douce);
	margin: 0 0 26px 0;
}


/* ---- Phrase de cloture ---- */

/* Sans guillemets : les citations attribuees ont leur propre bloc. */
.signature {
	background: var(--creme);
	padding: 66px 0 84px 0;
	text-align: center;
}
.signature__texte {
	margin: 0 auto;
	max-width: 780px;
	font-size: clamp(22px, 2.7vw, 34px);
	line-height: 1.35;
	color: var(--vert);
}


/* ---- Sejours ---- */

.carte__accroche {
	display: block;
	margin-top: 6px;
	font-family: var(--texte);
	font-size: 14px;
	letter-spacing: 0.02em;
	color: rgba(255,255,255,0.85);
}
.sejour__citation {
	margin: 0 0 26px 0;
	font-size: clamp(23px, 2.6vw, 34px);
	line-height: 1.3;
	color: var(--encre);
}


/* ---- Chambres ---- */

.chambres { background: var(--creme); padding: 10px 0 84px 0; }
.chambres__grille {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 46px 32px;
}
.chambre { display: flex; flex-direction: column; }
.chambre__image {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}
.chambre__corps { padding-top: 20px; }
.chambre__nom {
	margin: 0 0 10px 0;
	font-size: clamp(21px, 2vw, 27px);
	color: var(--encre);
}
.chambre__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	margin: 0 0 14px 0;
	font-family: var(--capitale);
	font-size: 10px;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--vert);
}
.chambre__meta span { position: relative; }
.chambre__meta span + span::before {
	content: '';
	position: absolute;
	left: -10px;
	top: 50%;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--creme-fonce);
}
.chambre__texte {
	margin: 0;
	font-family: var(--texte);
	font-size: 16px;
	line-height: 1.7;
	color: var(--encre-douce);
}
.chambres__actions,
.sejour__actions {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 14px;
	padding-top: 56px;
}

/* Filtres : un bouton se met au meme format que les onglets de la galerie. */
.onglets__item {
	font: inherit;
	font-family: var(--capitale);
	font-size: 11px;
	background: none;
	cursor: pointer;
}
.chambre[hidden] { display: none; }


/* ---- Galerie ---- */

.galerie { background: var(--creme); padding: 60px 0 84px 0; }

.onglets {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-bottom: 44px;
	flex-wrap: wrap;
}
.onglets__item {
	padding: 11px 24px;
	font-family: var(--capitale);
	font-size: 11px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--encre-douce);
	border: 1px solid var(--creme-fonce);
	border-radius: 999px;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.onglets__item:hover { border-color: var(--vert); color: var(--vert); }
.onglets__item.est-actif { background: var(--vert); border-color: var(--vert); color: var(--blanc); }

.galerie__vide {
	text-align: center;
	padding: 60px 0;
	font-family: var(--capitale);
	font-size: 13px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--encre-douce);
}

.mosaique {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	grid-auto-rows: 210px;
	grid-auto-flow: dense;
	gap: 8px;
}
.mosaique__case {
	display: block;
	overflow: hidden;
	border-radius: 4px;
}
.mosaique__case img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.6s ease;
}
.mosaique__case:hover img { transform: scale(1.04); }

.mosaique__case--large  { grid-column: span 2; }
.mosaique__case--haute  { grid-row: span 2; }
.mosaique__case--grande { grid-column: span 2; grid-row: span 2; }

.mosaique--carree { grid-auto-rows: auto; }
.mosaique--carree .mosaique__case img { aspect-ratio: 1 / 1; height: auto; }


/* ---- Pied de page ---- */

.pied {
	background: var(--creme);
	border-top: 1px solid var(--creme-fonce);
	padding: 44px 0;
}
.pied__grille {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 22px;
}
.pied__reseaux { display: flex; gap: 22px; }
.pied__icone {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border: 1px solid var(--creme-fonce);
	border-radius: 50%;
	color: var(--encre);
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.picto {
	display: block;
	width: 17px;
	height: 17px;
	fill: currentColor;
}
.pied__icone:hover { background: var(--vert); border-color: var(--vert); color: var(--blanc); }

.pied__mentions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 26px;
	font-family: var(--texte);
	font-size: 13px;
	color: var(--encre-douce);
	text-align: center;
}
.pied__mentions a { text-decoration: underline; }
.pied__mentions a:hover { color: var(--vert); }


/*************
**** BODY ****
**************/

.h100{ height: 100%; }

* {
	box-sizing: border-box;
}
.flex {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
.flex-wrap{
	flex-wrap: wrap;
}
.flex.sb {
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.flex.se {
	-webkit-box-pack: space-evenly;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly;
}
.flex.sa {
	-ms-flex-pack: distribute;
	justify-content: space-around;
}
.flex.ac {
	-webkit-box-align: center;
	   -ms-flex-align: center;
		  align-items: center;
}
.flex-start{
	-ms-flex-item-align: start;
    align-self: flex-start;	
}

.contact,.mentions{
	min-height: 100%;
	width: 100%;
}

.reg_contentGlobal{
	width: 100%;
	margin: 0 auto;
}
.reg_contentGlobal.admin-connexion,
.reg_contentGlobal.admin-date,
.reg_contentGlobal.admin-detail-date,
.reg_contentGlobal.admin-image-maison,
.reg_contentGlobal.admin-image-visiteurs,
.reg_contentGlobal.admin-detail-image-visiteurs {
	max-width: 1280px;
}

.addr{
	padding: 0 0 0 25px;
	font-size: 15px;
	text-transform: uppercase;
}

.reg_content {
	width: 95%;
	max-width: 1366px;
	display: block;
	margin: 0 auto;
	overflow: hidden;
}
.archive .item{
	display: block;
	flex-basis: 11.11111111111111%;
}

.follow i{
	font-size: 22px;
	color: #a3a2a1;
	margin: 0 7px 0 10px;
}

.square div{
	display: flex;
	flex-basis: 25%;
	min-width: 250px;
	margin: 25px;
}
.square a{
	display: inline-block;
	min-width: 250px;
	width: 100%;
}
.square img{
	width: 100%;
	max-height: 250px;
	display: block;	
}

.fa-instagram{
	font-size: 30px!important;
	margin-top: 7px;
}

.fa-whatsapp{
	font-size: 30px!important;
	margin-top: 7px;
	margin-left: 15px;
}

.infos p{
	font-size: 18px;
}
.infos strong{
	font-size: 22px;
	text-transform: uppercase;
}
.infos h2,
.article{
	padding-left: 30px;
}
.article a{
	margin-top: 20px;
}
.article strong{
	display: inline-block;
	font-size: 1.2em;
	padding-bottom: 10px;
}

/* Vidéos */
.img {width:52%;}
.img img {width:100%;}

/*****************
**** COOKIES *****
*****************/

#cookiesBloc {
    background:rgba(225,225,228,0.8);
    bottom:2%;
	right: 1%;
	max-width:400px;
    cursor: pointer;
	z-index:1100;
    position: fixed;
    padding: 20px;
	color: #000;
   -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;	
	display:none;
}
#cookiesBloc.cookiesBloc--visible {
	display: block;
}
#cookiesBloc .cookiesActions {
	display: flex;
	gap: 10px;
	justify-content: center;
	margin: 15px 0 0 0;
}
#cookiesBloc .okCookies {
	padding: 6px 14px;
	line-height: 100%;
	border: 1px solid #000;
	background: transparent;
	text-transform: uppercase;
	color: #000;
	font: inherit;
	cursor: pointer;
}
#cookiesBloc .okCookies:not(.okCookies--refus) {
	background: #000;
	color: #FFFFFF;
}
#cookiesBloc .okCookies:hover {
	background: rgba(0,0,0,0.6);
	color: #FFFFFF;
}
#cookiesBloc p {
	color:#000;
	font-size: 1em;
	text-align:center;
	margin:0;
}
#cookiesBloc p a {
	text-decoration:underline;
}

/********************
**** BACK TO TOP ****
********************/

#returnOnTop {
    width: 45px;
    height: 45px;
    background-color: #313131;
    border-radius: 50%;
    bottom: 1%;
    cursor: pointer;
    display: none;
    filter: alpha(opacity = 50); /* IE < 8 */
    opacity: 0.5;
    position: fixed;
    right: 1%;
    z-index: 1000;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}

#returnOnTop:hover {
    filter: alpha(opacity = 100); /* IE < 8 */
    opacity: 1;
}

#loading{
	width: 0%;
	height: 3px;	
	background: #22a1d6;
	position: fixed;	
}

/********
*  TOP  *
*********/

a.sel{ 
	color: #009fe3;
	border-bottom: solid 2px #ffdd00;
}

/*************
*** BOTTOM ***
**************/

.none {
	display: none;
}


/* Contournement d'une extension de navigateur qui enveloppe les champs. */
.fx-relay-email-input-wrapper {
	z-index: 10 !important;
}
.swal2-shown .fiche-production ~ .swal2-container .swal2-show {
	width: 500px !important;
	max-width: 98%;
	min-height: auto !important;
}
.swal2-shown .fiche-production ~ .swal2-container .swal2-show .swal2-content {
	text-align: center;
}
.fiche-production p.infos {
	padding: 15px 40px;
}
.fiche-production p.infos span{
	font-weight: bold;
	font-size: 1.2em;
}
input[type=checkbox]  {
	display: none;
}
label.check {
	position: relative;
	display: inline-block;
	margin: 5px 20px 10px 0;
	cursor: pointer;
}
label.check:before {
	content: "";
	position: absolute;
	top: 2px;
	left: 0;
	width: 16px;
	height: 16px;
	border-radius: 2px;
	border: 1px solid #009fe3;
}
input[type=checkbox]:checked + .check:before {
	background: #009fe3;
}
label.check:after {
	content: "";
	position: absolute;
	top: 6px;
	left: 4px;
	width: 8px;
	height: 4px;
	border: 3px solid #fff;
	border-top: none;
	border-right: none;
	transform: rotate(-45deg);
	opacity: 0;
}
input[type=checkbox]:checked + label:after {
	opacity: 1;	
}

/*****************
*** RESPONSIVE ***
******************/

/* Menu resserre, juste avant le passage en burger */
@media screen and (max-width: 1180px)
{
	.entete__nav { gap: 18px; }
	.entete__lien { font-size: 10px; letter-spacing: 0.12em; }
	.entete__cote { gap: 12px; padding-left: 4px; }

	.presentation__grille { gap: 46px; }
	.acces__grille { gap: 38px; }
	.equipements__grille { gap: 38px 30px; }
	.recit-page { grid-template-columns: 1fr 320px; gap: 48px; }
}


/* Navigation repliee avant les grilles : le nom ecrit prend plus de place. */
@media screen and (max-width: 1060px)
{
	/* Barre fixe : le contenu recupere sa hauteur par un decalage. */
	.entete {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
	}
	.reg_contentGlobal { padding-top: 79px; }

	.entete__barre { flex-wrap: wrap; gap: 0; min-height: 78px; }
	.entete__logo { font-size: 20px; }

	/* Case a cocher gardee accessible au clavier plutot que retiree. */
	.entete__bascule {
		display: block;
		position: absolute;
		width: 1px;
		height: 1px;
		margin: 0;
		opacity: 0;
		pointer-events: none;
	}

	.entete__burger {
		display: block;
		position: relative;
		width: 44px;
		height: 44px;
		margin-left: auto;
		cursor: pointer;
	}
	.entete__burger span {
		position: absolute;
		top: 21px;
		left: 10px;
		width: 24px;
		height: 2px;
		background: var(--encre);
	}
	.entete__burger span::before,
	.entete__burger span::after {
		content: '';
		position: absolute;
		left: 0;
		width: 100%;
		height: 100%;
		background: var(--encre);
		transition: transform 0.25s ease;
	}
	.entete__burger span::before { top: -7px; }
	.entete__burger span::after  { top: 7px; }

	.entete__bascule:focus-visible + .entete__burger {
		outline: 2px solid var(--vert);
		outline-offset: 2px;
	}
	.entete__bascule:checked + .entete__burger span { background: transparent; }
	.entete__bascule:checked + .entete__burger span::before { transform: translateY(7px) rotate(45deg); }
	.entete__bascule:checked + .entete__burger span::after  { transform: translateY(-7px) rotate(-45deg); }

	.entete__nav {
		display: none;
		flex-basis: 100%;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		margin: 0;
		padding-bottom: 14px;
		border-top: 1px solid var(--creme-fonce);
		/* Un menu plus haut que l'ecran doit pouvoir defiler. */
		max-height: calc(100vh - 79px);
		overflow-y: auto;
	}
	.entete__bascule:checked ~ .entete__nav { display: flex; }
	.entete__lien {
		font-size: 12px;
		padding: 16px 2px;
		border-bottom: 1px solid var(--creme-fonce);
	}
	.entete__lien:hover { color: var(--vert); }

	/* Le vert et l'encre se distinguent mal : le trait porte l'etat actif. */
	.entete__lien--actif {
		color: var(--vert);
		border-bottom-color: var(--vert);
	}
	.entete__cote {
		justify-content: space-between;
		padding: 18px 0 0 0;
	}
}


/* Tablette : colonnes ramenees a deux */
@media screen and (max-width: 980px)
{
	.hero { min-height: clamp(440px, 68vh, 600px); }
	.hero__contenu { padding-top: 90px; padding-bottom: 60px; }

	/* Quatre filtres tiennent encore sur une ligne a cette largeur. */
	.onglets { gap: 6px; }
	.onglets__item { padding: 10px 15px; letter-spacing: 0.1em; }

	.presentation__grille { grid-template-columns: 1fr; gap: 44px; }

	.cartes,
	.usages__grille,
	.apercu__grille,
	.chambres__grille { grid-template-columns: repeat(2, 1fr); }

	.recit,
	.salle__grille,
	.acces__grille,
	.recit-page{ grid-template-columns: 1fr; }

	.recit__texte{ padding: 60px var(--gouttiere); }
	.recit__image{ min-height: 300px; }

	.salle__grille { gap: 40px; }
	.acces__grille { gap: 44px; }

	/* Le plan est en portrait : pleine largeur, il ecraserait le reste. */
	.plan { max-width: 520px; margin: 0 auto; }

	.recit-page { gap: 40px; }
	.recit-page .cadre-photo { max-width: 340px; margin: 0 auto; }

	.coupure {
		grid-template-columns: 1fr;
		gap: 26px;
		padding: 34px;
		text-align: center;
	}

	.identite { grid-template-columns: 1fr; gap: 0; }
	.identite dt { padding-top: 16px; }
	.identite dt:first-of-type { padding-top: 0; }

	.entete-page { padding: 54px 0 10px 0; }
	.presentation,
	.usages,
	.page-texte,
	.legal { padding: 64px 0; }
	.equipements { padding-top: 64px; padding-bottom: 64px; }
	.equipements--suite { padding-top: 40px; }
	.page-texte--serre { padding-bottom: 20px; }
	.usages--sobre { padding-top: 48px; }
}


/* Telephone : une seule colonne, gouttieres resserrees */
@media screen and (max-width: 720px)
{
	:root { --gouttiere: 24px; }

	.hero__contenu { padding-top: 70px; padding-bottom: 46px; }

	.cartes,
	.usages__grille,
	.apercu__grille,
	.chambres__grille,
	.acces__details,
	.formulaire__champs { grid-template-columns: 1fr; }
	.formulaire__sejour { grid-template-columns: repeat(2, 1fr); }

	.carte { aspect-ratio: 16 / 10; }
	.carte__legende { font-size: 21px; bottom: 18px; padding: 0 18px; }

	.chiffres { gap: 24px 20px; }
	.acces__colonne { gap: 36px; }

	/* Une case etendue creerait une colonne implicite sur une seule piste. */
	.mosaique:not(.mosaique--carree) { grid-auto-rows: 190px; }
	.mosaique__case--large,
	.mosaique__case--haute,
	.mosaique__case--grande {
		grid-column: auto;
		grid-row: auto;
	}

	.formulaire .btn { width: 100%; margin-left: 0; }

	#cookiesBloc {
		left: 16px;
		right: 16px;
		bottom: 16px;
		max-width: none;
	}

	/* Aligne sur la boite de consentement, qui passe devant tant qu'elle est la. */
	#returnOnTop {
		right: 16px;
		bottom: 16px;
		width: 40px;
		height: 40px;
	}

	.presentation,
	.usages,
	.page-texte,
	.legal,
	.galerie { padding: 52px 0; }
	.equipements { padding-top: 52px; padding-bottom: 52px; }
	.equipements--suite { padding-top: 34px; }
	.page-texte--serre { padding-bottom: 20px; }
	.usages--sobre { padding-top: 40px; }
	.apercu { padding-bottom: 52px; }
	.salle { padding: 24px 0 52px 0; }
	.acces { padding: 34px 0 52px 0; }
	.citation__contenu { padding: 46px var(--gouttiere); }
	.coupure { padding: 26px 20px; }
}


/* Petits ecrans */
@media screen and (max-width: 560px)
{
	.entete__logo { font-size: 17px; letter-spacing: 0.1em; }

	.chiffres,
	.formulaire__sejour { grid-template-columns: 1fr; }

	.cadre-photo { transform: none; }
	.recit-page .cadre-photo { max-width: none; }

	.mosaique:not(.mosaique--carree) { grid-auto-rows: 210px; }

	.hero__actions .btn,
	.apercu__actions .btn,
	.chambres__actions .btn,
	.sejour__actions .btn { width: 100%; }

	.onglets__item { padding: 10px 18px; }
	.pied__mentions { gap: 8px 16px; }
}


/* Mouvement reduit : on respecte le reglage du systeme. */
@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;
	}
}