/* ------------------------------------------------------------- */
/* ROOT */
/* ------------------------------------------------------------- */

:root {
--plus_gap: 50px;
--plus_items: 3;
--quality_gap: 50px;
--quality_items: 4;
--numbers_items: 4;
}

/* ------------------------------------------------------------- */
/* TOP BG */
/* ------------------------------------------------------------- */

.change_order #top_bg { order: -1; }

/* ------------------------------------------------------------- */
/* PRIMARY */
/* ------------------------------------------------------------- */

/* TEXT */
#primary .text p:first-child { font-size: 1.8rem; font-weight: 600; }

/* ------------------------------------------------------------- */
/* PLUS */
/* ------------------------------------------------------------- */

#plus {}
#plus .list {
text-align: left;
gap: var(--plus_gap);
}
#plus .list .item {
position: relative;
width: calc((100% / var(--plus_items)) - (((var(--plus_items) - 1) / var(--plus_items)) * var(--plus_gap)));
padding: 2.5rem 0 0 100px;
}
#plus .list .item span.icon {
position: absolute;
top: 0;
left: 0;
display: block;
width: 70px;
padding: 12px 17px;
background-color: var(--color_azure);
-webkit-clip-path: polygon(9% 0, 82% 0, 100% 56%, 48% 100%, 0 47%);
        clip-path: polygon(9% 0, 82% 0, 100% 56%, 48% 100%, 0 47%);
}
#plus .list .item:nth-child(2n+1) span.icon { background-color: var(--color_blue); }
#plus .list .item span.icon svg {
display: block;
width: 100%;
margin: 0 auto 15px;
padding: 0;
}
#plus .list .item span.icon svg > .colore { fill: var(--color_white); }
#plus .list .item h3 {
display: block;
font-size: 2.2rem;
font-weight: 700;
margin: 0 0 0.81em;
padding: 0;
line-height: 1;
letter-spacing: normal;
color: var(--color_dark_grey);
}
#plus .list .item p {
display: block;
font-size: 1.6rem;
font-weight: 400;
margin: 0;
padding: 0;
line-height: 1.5;
letter-spacing: normal;
color: var(--color_medium_grey);
}

/* TREATMENTS */
#plus .treatments_all {
width: 100%;
max-width: 500px;
margin: 0 auto;
text-align: center;
}
#plus .treatments_all p {
position: relative;
display: block;
font-size: 1.8rem;
font-weight: 600;
margin: 0;
padding: 1.5em 0 0;
line-height: 1.5;
letter-spacing: normal;
color: var(--color_dark_grey);
}
#plus .treatments_all p:after {
content: "";
position: absolute;
top: 0;
left: 50%;
display: block;
width: 40px;
height: 5px;
background-color: var(--color_azure);
-webkit-transform: translateX(-50%);
   -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
     -o-transform: translateX(-50%);
        transform: translateX(-50%);
}

/* ------------------------------------------------------------- */
/* QUALITY */
/* ------------------------------------------------------------- */

#quality { margin-top: var(--space_yy); text-align: left; }

/* PHOTO */
#quality .photo {
text-align: left;
margin-top: var(--space_yy_negative);
gap: var(--quality_gap);
}
#quality .photo .item {
width: calc((100% / var(--quality_items)) - (((var(--quality_items) - 1) / var(--quality_items)) * var(--quality_gap)));
}
#quality .photo .item figure {
display: block;
width: 100%;
height: auto;
text-align: left;
}
#quality .photo .item img {
display: block;
width: 100%;
height: auto;
}

/* HEADING */
#quality .heading h2 {
display: block;
font-size: 4rem;
font-weight: 700;
margin: 0;
padding: 0;
line-height: 1;
letter-spacing: normal;
color: var(--color_white);
}

/* TEXT */
#quality .text {
padding-left: calc(var(--quality_gap) / 2);
}
#quality .text p {
display: block;
font-size: 1.6rem;
font-weight: 600;
margin: 0;
padding: 0;
line-height: 1.5;
letter-spacing: normal;
color: var(--color_white);
}

/* BTN */
#quality .btn { margin-left: var(--space_x); }

/* ------------------------------------------------------------- */
/* NUMBERS */
/* ------------------------------------------------------------- */

#numbers dl { gap: var(--numbers-gap); }
#numbers dl > div {
width: calc(100% / var(--numbers_items));
margin-top: 25px;
}
#numbers dl dt {
display: block;
font-size: 8rem;
font-weight: 700;
padding: 0 25px;
line-height: 1;
letter-spacing: normal;
color: var(--color_blue);
}
#numbers dl dd {
position: relative;
display: block;
font-size: 1.4rem;
font-weight: 700;
margin-top: 20px;
padding: 30px 25px 0;
line-height: 1;
letter-spacing: normal;
text-transform: uppercase;
color: var(--color_medium_grey);
}
#numbers dl dd:before {
content: "";
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 1px;
background-color: #e1e1e1;
}
#numbers dl dd:after {
content: "";
position: absolute;
top: -2px;
left: 50%;
display: block;
width: 40px;
height: 5px;
background-color: var(--color_azure);
-webkit-transform: translateX(-50%);
   -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
     -o-transform: translateX(-50%);
        transform: translateX(-50%);
}

/* ------------------------------------------------------------- */
/* PIXEL RATIO */
/* ------------------------------------------------------------- */

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { 


			
}

/* ------------------------------------------------------------- */
/* RESPONSIVE */
/* ------------------------------------------------------------- */

@media only screen and (max-width: 1699px) {
	
	
}

@media only screen and (max-width: 1599px) {
	
	
}

@media only screen and (max-width: 1439px) {
	
	/* ROOT */
	:root {
	--plus_items: 2;
	}
	
	/* PLUS */
	#plus .list .item:nth-child(2n+1) span.icon { background-color: var(--color_azure); }
	#plus .list .item:nth-child(4n+1) span.icon, #plus .list .item:nth-child(4n+4) span.icon { background-color: var(--color_blue); }
	
	/* QUALITY */
	#quality .heading h2 { font-size: 3.9rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 7.8rem; }
	
}

@media only screen and (max-width: 1365px) {
	
	/* QUALITY */
	#quality .heading h2 { font-size: 3.8rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 7.6rem; }
	
}

@media only screen and (max-width: 1279px) {
	
	/* QUALITY */
	#quality .heading h2 { font-size: 3.7rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 7.4rem; }
	
}

@media only screen and (max-width: 1199px) {
	
	/* QUALITY */
	#quality .heading h2 { font-size: 3.6rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 7.2rem; }
	
}

@media only screen and (max-width: 1111px) {
	
	/* ROOT */
	:root {
	--plus_gap: 40px;
	--quality_gap: 40px;
	}
	
	/* QUALITY */
	#quality .heading h2 { font-size: 3.5rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 7rem; padding: 0 20px; }
	#numbers dl dd { padding: 30px 20px 0; }
	
}


@media only screen and (max-width: 1023px) {
	
	/* ROOT */
	:root {
	--plus_items: 1;
	--quality_items: 2;
	--numbers_items: 2;
	}
	
	/* PLUS */
	#plus .list .item:nth-child(4n+1) span.icon, #plus .list .item:nth-child(4n+4) span.icon { background-color: var(--color_azure); }
	#plus .list .item:nth-child(odd) span.icon { background-color: var(--color_blue); }
	
	/* QUALITY */
	#quality .text { margin-top: 2.4em; padding-left: var(--space_x); }
	
}

@media only screen and (max-width: 833px) {
	
	/* NUMBERS */
	#numbers dl dt { font-size: 6.5rem; }
	
}

@media only screen and (max-width: 767px) {
	
	/* TREATMENTS */
	#plus .treatments_all p { font-size: 1.7rem; }
	
	/* QUALITY */
	#quality .heading h2 { font-size: 3.4rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 6rem; }
	
}

@media only screen and (max-width: 735px) {
	
	/* QUALITY */
	#quality .heading h2 { font-size: 3.2rem; }
	
}

@media only screen and (max-width: 666px) {
	
	/* QUALITY */
	#quality .heading h2 { font-size: 3rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 5.5rem; }
	
}
	

@media only screen and (max-width: 599px) {
	
	/* PLUS */
	#plus .list .item { padding: 2rem 0 0 90px; }
	#plus .list .item span.icon { width: 60px; padding: 12px 16px; }
	#plus .list .item span.icon svg { margin: 0 auto 12px; }
	#plus .list .item h3 { font-size: 2.1rem; }
	
	/* QUALITY */
	#quality .heading h2 { font-size: 2.8rem; }
	#quality .text { margin-top: 2em; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 5rem; }
	#numbers dl dd { font-size: 1.3rem; }
	
}

@media only screen and (max-width: 567px) {
	
	/* ROOT */
	:root {
	--quality_gap: 35px;
	}
	
	/* QUALITY */
	#quality .heading h2 { font-size: 2.6rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 4.5rem; }
	
}

@media only screen and (max-width: 479px) {
	
	/* ROOT */
	:root {
	--quality_gap: 30px;
	}
	
	/* PRIMARY */
	#primary .text p:first-child { font-size: 1.7rem; }
	
	/* PLUS */
	#plus .list .item { padding: 1.5rem 0 0 70px; }
	#plus .list .item span.icon { width: 50px; padding: 10px 13px; }
	#plus .list .item span.icon svg { margin: 0 auto 10px; }
	#plus .list .item h3 { font-size: 2rem; }
	
	/* TREATMENTS */
	#plus .treatments_all p { font-size: 1.6rem; }
	
	/* QUALITY */
	#quality .heading h2 { font-size: 2.4rem; }
	#quality .text { margin-top: 1.6em; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 4rem; padding: 0 15px; }
	#numbers dl dd { font-size: 1.2rem; margin-top: 15px; padding: 20px 15px 0; }
	
}

@media only screen and (max-width: 413px) {
	
	/* ROOT */
	:root {
	--quality_gap: 25px;
	}
	
	/* PLUS */
	#plus .list .item h3 { font-size: 1.9rem; margin: 0 0 0.5em; }
	
	/* QUALITY */
	#quality .heading h2 { font-size: 2.3rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 3.5rem; }
	
}

@media only screen and (max-width: 374px) {
	
	/* ROOT */
	:root {
	--quality_gap: 20px;
	}
	
	/* PLUS */
	#plus .list .item h3 { font-size: 1.8rem; }
	
	/* QUALITY */
	#quality .heading h2 { font-size: 2.2rem; }
	
	/* NUMBERS */
	#numbers dl dt { font-size: 3rem; }
	#numbers dl dd { margin-top: 10px; padding: 15px 15px 0; }
	
}


@media only screen and (max-width: 359px) {
	
	/* ROOT */
	:root {
	--quality_gap: 15px;
	}
	
}