:root{
  --colore01: #504B43;
  --colore01chiaro: #9e9486;
  --colore01scuro: #3b352e;
  
  --bianco: #fefefe;
  --nero: #1F1D1B;

  --grigio01: #8a8780;
  --grigio02: #bbbab8;
  --grigio03: #dbd8d3;
  --grigio04: #ece9e5;
  --grigio05: #F8F7F5;
}


header.bigslide ul#slidepreview li .intro .testo .eyebrow{
      font-family: 'Reem Kufi', sans-serif;
      font-weight: 400;
      font-size: clamp(1rem, 1.5vw, 1.1rem);
      line-height: 1.3em;
      color: var(--bianco);
      margin-bottom: 6px;
    }

.gen.detail-section{
  article{
    padding: 70px 0 32px;
  }


  .galleryAppartamento{



				@media only screen and (max-width: 780px){
					width: 100%;
					border-radius: 0;
				}


				.cardSlide{

					list-style: none;
					margin: 0 !important;
					padding: 0 !important;
					
					

					li{
						list-style: none;
						margin: 0 5px 0 0 !important;
						padding: 0 !important;
						
            /*stessa altezza delle celle flickity, width variabile*/

            height: 50vh;
            width: auto;
            width: fit-content;

            @media only screen and (max-width: 850px){
              height: 40vh;
            }
            


						img{
							height: 100%;
              width: auto;
              display: block;
              max-width: none;
						}

						&.cover{
							
							
							display: flex;
							align-items: center;
							justify-content: center;
							margin: 10px;

							overflow: visible !important;

							z-index: 9999;
							
							h4{
                font-family: 'Reem Kufi', sans-serif;
                font-weight: 500;
                font-size: 2rem;
                line-height: 1.4em;
								text-transform: uppercase;
								display: block;
								text-align: center;
								margin: 42px 84px;
							}

							span{
                position: absolute;

								width: 60px;
								height: 60px;

								left: 100%;
								top: 50%;

								transform: translate(-27px, -30px) rotate(45deg);

								border-top: 5px solid var(--bianco);
								border-right: 5px solid var(--bianco);
							}
						}

						

					}

					&.nascosto{
						display: none;
					}

					
				}

				.icone{

          display: flex;
					flex-direction: row;
					justify-content: center;
					list-style: none;
					padding: 0 !important;
					margin: 42px 0 0 0;

					li{
						margin: 0 12px;
						font-size: 2rem;
						font-family: 'reem kufi', sans-serif;

						span{
							vertical-align: sub;
							font-size: 2rem !important;
						}
					}
				}


			}
}


.blocchi-details{

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  column-gap: 0;
  row-gap: 16px;
  padding: 16px 0;
  margin: 0 -2px;
  overflow: clip;

  

  .blocco{
    border-right: 1px solid var(--colore01chiaro);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 1rem;
    gap: .8rem;


    >*{
      display: block;
      margin: 0;
    }

    .material-symbols-outlined{
      font-size: 38px;
      color: var(--colore01chiaro);
    }

    .sottotitolo, h3, h4{
      font-size: clamp(1.1rem, 1.5vw, 1.3rem);

      span{
        display: block;
        font-size: clamp(.8rem, 1vw, 1rem);
        font-weight: 400;
        font-family: 'Reem Kufi', sans-serif;
        line-height: 1.3;
      }
    }

  }

  @media only screen and (max-width: 600px){
    display: flex;
    width: max-content;
    

    .blocco{
      width: 160px;
      .material-symbols-outlined{
        font-size: 32px;
        padding: 0 .5rem;
      }

      &:last-child{
        border-right: none;
      }
    }
    
  }


}


@media only screen and (max-width: 600px){
  .blocchi-cont{
    overflow-x: scroll;

    /*scrollbar custom*/
    &::-webkit-scrollbar {
      height: 6px;
    }
    &::-webkit-scrollbar-thumb {
      background-color: var(--colore01chiaro);
    }
    &::-webkit-scrollbar-track {
      background-color: var(--grigio04);
    }
  }
}



.dati-intro{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 3rem;
  margin: 1rem 0 0;
  padding: 1rem 0;
  border-top: 1px solid var(--colore01chiaro);
  border-bottom: 1px solid var(--colore01chiaro);

  >*{
    margin: 0 !important;
  }

  h3{
    font-size: clamp(1.6rem, 1.5vw, 2rem);
    font-weight: 400;
    line-height: 1.3;
    color: var(--colore01);

    .material-symbols-outlined{
      font-size: clamp(1.5rem, 1.5vw, 1.8rem);
      line-height: 1.3;
      vertical-align: top;
      color: var(--colore01chiaro);
    }
  }
}



.plan-detail{

  padding-top: 0 !important;

  article{
    padding: 1.5rem;
    background-color: var(--grigio04);

    display: grid;
    grid-template-columns: 2fr 5fr;
    column-gap: 4rem;
    row-gap: 2rem;

    @media only screen and (max-width: 1260px){
        grid-template-columns: 1fr;
      }

    .testo{
      .sottotitolo{
        font-family: 'Philosopher', sans-serif;
        margin: 0 0 1rem;
      }

      .bottone{
        margin: 1rem 0 0;
      }
    }

    .grid{
      display: grid;
      grid-template-columns: 1fr 1fr;
      column-gap: 1rem;
      row-gap: 1rem;

      @media only screen and (max-width: 580px){
        grid-template-columns: 1fr;
      }

      .plan{
        display: flex;
        flex-direction: column;
        padding: 1rem;
        gap: .8rem;
        border: 1px solid var(--colore01chiaro);
        background-color: var(--bianco);

        >*{
          display: block;
          margin: 0;
        }

        .label{

          display: flex;
          flex-direction: row;
          align-items: center;
          gap: .8rem;
          justify-content: space-between;

          .material-symbols-outlined{
            font-size: 28px;
            color: var(--colore01chiaro);
            text-decoration: none;
          }

          .tit{
            font-size: clamp(1.1rem, 1.5vw, 1.3rem);
            color: var(--nero);
            font-family: 'Philosopher', sans-serif;
            margin: 0;

            span{
              display: block;
              font-size: clamp(.8rem, 1vw, 1rem);
              font-weight: 400;
              font-family: 'Reem Kufi', sans-serif;
              line-height: 1.3;
            }
          }
        }

      }
    }
  }

}



.textwall{

  article{
    padding: 32px 0 70px;

    @media only screen and (max-width: 850px){
      padding: 32px 0 32px;
    }
  }

}




.detail-form{

  padding-top: 0 !important;
  background-color: var(--grigio04);
  box-shadow: -50vw 0 0 var(--grigio04), 50vw 0 0 var(--grigio04);

  article{ 
    
    padding: 70px 0;

    display: grid;
    grid-template-columns: 1fr 2fr;
    column-gap: 0;
    row-gap: 3rem;

    @media only screen and (max-width: 1260px){
        grid-template-columns: 1fr;
      }

    .testo{
      .sottotitolo{
        font-family: 'Philosopher', sans-serif;
        margin: 0 0 1rem;
        text-align: left;
      }

      .bottone{
        margin: 1rem 0 0;
      }
    }


    .col-sx{
      @media only screen and (min-width: 1261px){
        padding-right: 4rem;
        border-right: 1px solid var(--colore01chiaro);
      }
    }

    .col-dx{
      @media only screen and (min-width: 1261px){
        padding-left: 4rem;
      }
    }


    .contatti{
      display: flex;
      flex-direction: column;
      gap: 1em;
      text-align: left;
      
      

      >a{
        display:flex;
        align-items: center;
        gap: .6em;
        width: 100%;
        text-decoration: none;
        font-family: 'Reem Kufi', sans-serif;

        span{
          display: block;
          
        }
      }
    }

  }

  

}