.main-container{

	background-image:url(../assets/bg-hotel-desktop2.jpg);

	background-position:calc(50% + 39px) center;

}





/* -------------------------------------------------- */

/* column left */



.column-left{

	position:absolute; left:0; 

	width:calc(100% - 530px - 64px);

	height:100%;

	

}





.content{

	display: flex;

	flex-direction: column;

	padding: 0 6% 0 6%;

	text-align:center;

	gap:4rem;

	align-items:center;

}



.group-top{

	position:absolute;

	top:111px;

	left:50%; translate:-50% 0;

	width:100%;

	display:flex; flex-direction: column; align-items:center;

	/* scale:0.7; */

}

.img-title-home{

	width: 451px;

}



.link-see-lots{

	margin-top:-36px;

}







input{

	font-size:16px;

}











/* -------------------------------------------------- */

/* form */



.content-form{

	display:flex; flex-direction: column;

}





.card-col-right {

	width: 530px; height:1005px;

	display: flex;

	flex-direction: column;

	justify-content: center;

	gap: 0;

	flex-shrink: 0;

	color: #007BC2;

	font-size: 16px;

	font-weight: 700;

	letter-spacing: 1.43px;

	text-align: left;

	background-color: #FFDEE4;

	padding: 44px 39px 47px 43px;

	position:absolute; right:64px; top:0;

	/* 

	--scale:1;

	transform: scale(var(--scale));

	transform-origin: top right;

	 */

}





.btn-download {

	margin-left: 3px; margin-top: 31px;

	width: 285px;

	display: flex;

	justify-content: center;

	gap: 19px;

	align-self: center;

	font-style: normal;

	letter-spacing: 1.43px;

	text-align: unset;

	color:white;

	background-color: #007bc2;

	padding: 0 10px;

	border-radius: 28px;

	letter-spacing: 2.5px;

	justify-self:center;

	cursor:pointer;
	
}



.btn-download-label {

	margin-left: 8px;

	min-height: 47px;

	display: flex;

	align-items: center;

	justify-content: center;

	text-align: center;

}



.btn-download-icon {

	margin-top: 8px;

	width: 33px;

	flex-shrink: 0;

}





.title-separator {

	margin: 0 2px;

	padding-bottom: 20px;

	/* border-bottom: 1px solid #fff; */

	font-size: 20px;

	letter-spacing: 1.78px;

	color:#EE265A;

}

.title-separator.coordinate{

	margin-top:24px;

}







.group-inputs{

	margin-top:28px;

	display:flex; flex-direction: column; gap:30px;

}





.input-text {

	display: flex;

	justify-content: center;

	gap:30px;

	background:transparent;

	border-bottom:1px solid #007BC2;

	padding-bottom:10px;

	letter-spacing: 2px;

}

.input-text:focus {

  outline: none;

}

.input-text::placeholder{

	color:#007BC2;

}



.group-gender{

	display:flex; gap:30px; margin:23px auto 0 auto;

	justify-self:center;

}

.input-cb {

	display: flex;

	align-items: center;

	gap: 11px;

}





/* radio */

.input-radio {

	width: 20px; height: 21px;

	flex-shrink: 0;

	background-color: #007BC2;

	border: 1px solid #007BC2;

	border-radius: 50%;

}



.input-radio-label {

	text-align: left;

}







.cb-accept {

	margin-top: 40px;

	display: flex;

	align-items: center;

	gap: 10px;

	align-self: start;

	font-size: 14px;

	letter-spacing: 1.25px;

}

.disclaimer{
	position: relative;
	display: inline-block;
	width: fit-content;
	font-size:14px;
}
.disclaimer-trigger{
	font-size: 14px;
	cursor:pointer;
	letter-spacing: 1.25px;
	text-align: left;
    font-weight: 500;
	text-decoration: underline;
	vertical-align: top;
	font-weight: 500;
}

.label-disclaimer{
	vertical-align: top;
	margin-left: 7px;
	font-weight: 500;
	
}

.disclaimer-box {
    position: absolute;
    bottom: 120%; /* au-dessus du lien */
    left: 120%;
    transform: translateX(-50%);
    
    width: 350px;
    padding: 10px;
    
    background: #007bc2;
    color: #fff;
    font-size: 14px;
	letter-spacing: 1.25px;
    border-radius: 6px;
	text-align:justify;
    
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    z-index: 1000;
	
	opacity: 0;
    visibility: hidden;
    pointer-events: none;
	
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

/* petite flèche */
.disclaimer-box::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 10%;
    transform: translateX(-50%);
    
    border-width: 6px;
    border-style: solid;
    border-color: #007bc2 transparent transparent transparent;
}

@media (hover: hover) {
	.disclaimer-trigger:hover ~ .disclaimer-box {
		opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(-50%) translateY(0);
	}
	
}

@media (hover: none) {
	#toggle-disclaimer:checked + .disclaimer-box {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}
	
	.disclaimer-box {
		left:0;
		transform: initial;
	}
}

.cb-accept-label {

	flex-grow: 1;

	text-align: left;

	font-weight:500;

}



.btn-submit {

	margin-left: 3px;

	width: 100%;

	max-width: 386px;

	min-height: 60px;

	flex-shrink: 0;

	align-self: center;

	text-align: center;

	padding-top: 1px;

	margin-top:45px;

	justify-self: center;

	color:white;

	font-size:22px;

	letter-spacing:9%;

}











/* radio */

.radio {

  display: inline-flex;

  align-items: center;

  cursor: pointer;

}



.radio input {

  position: absolute;

  opacity: 0;

  pointer-events: none;

}



.dot {

  width: 18px;

  height: 18px;

  border: 2px solid #007BC2;   /* empty circle with white outline */

  border-radius: 50%;

  box-sizing: border-box;

}



/* selected state = full circle */

.radio input:checked + .dot {

  background: #007BC2;

}





.logo-evian { width: 140px; right:14px; }

.howto-header-mobile{

	display:none;

	background:white;

	width:100%; height:76px;

	position:absolute; top:0px;

	z-index:1;

}







.text-bottom-side{

	font-size:17px;

}


.label-error{
	color:red;
}

.error{
	color:red;
}

input.error{
	border-bottom:1px solid red;
}

.error::placeholder{
	color:red;
}



/* form full size */

@media(max-width:1300px){

	.main-container{

		min-height:900px;

	}

	.content{

		transform:scale(1);

		width:100%; height:100%;

		left:0; top:0; margin-left:0; margin-top:0;

	}

	

	.card-col-right {

		right:0; left:0; width:100%;

		align-items:center;

		transform:unset;

		padding:0 24px;

	}

	.content-form{

		max-width: 420px;

		width:100%;

		scale:1.0;

	}

	

	

	.input-text{

		padding-bottom:3px;

	}

	.group-inputs{

		gap:17px;

	}

	.title-separator {

		padding-bottom:8px;

	}

}







/* when burger disapears */



@media(max-width:1120px){

		.howto-header-mobile{ display:block;}

	

	.desktop{ display:none;}

	.mobile{ display:block;}

	.btn-submit{

		min-height:35px;

	}

	.logo-evian { width: 94px; right:14px; }

}





/* hack */

@media (max-width:1300px) and (min-width:1123px){

	.card-col-right{

		top:-80px;

	}

}