body {

  margin: 0;

  font-family: 'Cormorant Garamond', serif;

  background-image: url("ChatGPT Image 10 mag 2026, 00_54_43.png");

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;

  background-attachment: fixed;

}



/* HEADER */



header {

  height: 110px;

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: #fff8f2;

  border-bottom: 1px solid #eee;

}



.logo-box {

  display: flex;

  align-items: center;

  gap: 0;

}



.logo-box img {

  width: 200px;

  height: 200px;

  object-fit: contain;

  display: block;

  margin-right: -35px;

}



.brand-text {

  font-family: 'Cormorant Garamond', serif;

  color: #5b3f2a;

  line-height: 0.9;

  text-transform: uppercase;

}



.brand-text .main {

  font-size: 42px;

  font-weight: 600;

  letter-spacing: 2px;

}



.brand-text .sub {

  font-size: 20px;

  letter-spacing: 2px;

  margin-top: 6px;

  color: #7a5638;

}



/* HERO */



.hero {

  height: calc(100vh - 110px);

  background-image: url("Trullo sulla Valle/1.jpg");

  background-size: cover;

  background-position: center;

}



/* TESTI RIUTILIZZABILI */



.content-block {

  max-width: 1200px;

  margin: 40px auto 90px auto;

  padding: 0 80px;

}



.section-label {

  font-family: 'Inter', sans-serif;

  font-size: 18px;

  letter-spacing: 6px;

  text-transform: uppercase;

  margin-bottom: 30px;

  color: #30231a;

}



.section-title {

  font-family: 'Montserrat', sans-serif;

  font-size: 42px;

  font-weight: 700;

  letter-spacing: 4px;

  color: #1f1a17;

  margin-bottom: 28px;

}



.section-text {

  font-family: 'Cormorant Garamond', serif;

  font-size: 24px;

  line-height: 1.8;

  color: #30231a;

  font-weight: 400;

}



/* GALLERY */



.gallery {

  display: flex;

  justify-content: center;

  gap: 30px;

  max-width: 1400px;

  margin: 80px auto;

  padding: 0 40px;

}



.image-card {

  position: relative;

  width: 48%;

  overflow: hidden;

  border-radius: 8px;

}



.image-card img {

  width: 100%;

  height: 500px;

  object-fit: cover;

  display: block;

  border-radius: 8px;

  transition: transform 0.4s ease;

  cursor: pointer;

}



.image-card img:hover {

  transform: scale(1.02);

}



/* ICONE */



.icon {

  position: absolute;

  top: 20px;

  left: 20px;



  width: 50px;

  height: 50px;



  background: rgba(255,255,255,0.85);

  color: #5b3f2a;



  border-radius: 50%;



  display: flex;

  align-items: center;

  justify-content: center;



  font-size: 24px;

  z-index: 2;



  backdrop-filter: blur(6px);

}



/* LIGHTBOX */



#lightbox {

  display: none;

  position: fixed;

  z-index: 9999;

  inset: 0;

  background: rgba(0,0,0,0.92);

  justify-content: center;

  align-items: center;

}



#lightbox img {

  max-width: 90%;

  max-height: 90%;

  border-radius: 10px;

}



/* DIVIDER */



.divider {

  display: flex;

  justify-content: center;

  align-items: center;

  width: 100%;

  margin: -40px 0 30px 0;

}



.divider img {

  width: 360px;

  max-width: 80%;

  display: block;

  filter: brightness(0.70);

}



/* LOCATION SECTION */



.location-section {

  display: flex;

  align-items: center;

  gap: 80px;

}



.location-text {

  flex: 1;

}



.location-map {

  flex: 1.3;

}



.location-map iframe {

  width: 100%;

  height: 500px;

  border: 0;

  border-radius: 12px;

}



/* STRUTTURA */



.structure-section {

  display: block;

}



.structure-top {

  display: flex;

  align-items: flex-start;

  gap: 50px;

}



.structure-text {

  flex: 1;

}



.structure-image {

  display: flex;

  justify-content: flex-end;



  margin-top: 40px;

}



.structure-image img {

  width: 62%;

  height: 420px;



  object-fit: cover;

  border-radius: 14px;



  display: block;

}



.stats-section {

  flex: 1;



  display: flex;

  justify-content: center;

  gap: 60px;



  padding-top: 20px;

}



.stat-box {

  text-align: center;

  min-width: 120px;

}



.stat-number {

  font-family: 'Montserrat', sans-serif;

  font-size: 72px;

  font-weight: 700;

  color: rgba(91, 63, 42, 0.28);

  margin-bottom: 12px;

}



.stat-label {

  font-family: 'Inter', sans-serif;

  font-size: 18px;

  letter-spacing: 2px;

  color: #4a4038;

}



.structure-image {

  margin-top: 40px;

}



.structure-image img {

  width: 100%;



  height: 420px;



  object-fit: cover;



  border-radius: 14px;



  display: block;

}



/* FEATURES */



.features-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 60px 80px;

  margin-top: 90px;

}



.feature-item h4 {

  font-family: 'Montserrat', sans-serif;

  font-size: 24px;

  color: #2d241d;

  margin-bottom: 14px;

}



.feature-item p {

  font-family: 'Inter', sans-serif;

  font-size: 18px;

  line-height: 1.7;

  color: #4a4038;

}



/* MOBILE */



@media (max-width: 800px) {

  header {

    height: 90px;

  }



  .logo-box img {

    width: 110px;

    height: 110px;

    margin-right: -20px;

  }



  .brand-text .main {

    font-size: 30px;

  }



  .brand-text .sub {

    font-size: 16px;

  }



  .hero {

    height: calc(100vh - 90px);

  }



  .content-block {

    margin: 60px auto;

    padding: 0 28px;

  }



  .section-title {

    font-size: 32px;

    letter-spacing: 2px;

  }



  .section-text {

    font-size: 21px;

  }



  .gallery {

    flex-direction: column;

    padding: 0 28px;

  }



  .image-card {

    width: 100%;

  }



  .image-card img {

    height: 360px;

  }



  .location-section,

  .structure-top {

    flex-direction: column;

    gap: 40px;

  }



  .location-map {

    width: 100%;

  }



  .location-map iframe {

    height: 380px;

  }



  .structure-text {

    flex: none;

    width: 100%;

  }



  .stats-section {

    width: 100%;

    flex-wrap: wrap;

    gap: 35px;

  }



  .structure-image img {

    height: 360px;

  }



  .features-grid {

    grid-template-columns: 1fr;

    gap: 35px;

  }

}



/* INTERIOR GALLERY */



.interior-gallery {

  display: grid;



  grid-template-columns: repeat(4, 1fr);



  gap: 28px;



  margin-top: 90px;

}



.interior-gallery img {

  width: 100%;



  height: 260px;



  object-fit: cover;



  cursor: pointer;



  transition: transform 0.35s ease;



  border-radius: 6px;



  display: block;

}



.interior-gallery img:hover {

  transform: scale(1.02);

}



.interior-gallery video {

  width: 100%;



  height: 260px;



  object-fit: cover;



  border-radius: 6px;



  display: block;

}



.lightbox-arrow {

  position: absolute;



  top: 50%;



  transform: translateY(-50%);



  font-size: 60px;



  color: white;



  cursor: pointer;



  user-select: none;



  padding: 20px;



  z-index: 10000;



  transition: opacity 0.3s;

}



.lightbox-arrow:hover {

  opacity: 0.7;

}



.lightbox-arrow.left {

  left: 30px;

}



.lightbox-arrow.right {

  right: 30px;

}



/* CONTATTI */



.contatti {

  text-align: center;

}



.contact-grid {

  display: flex;



  justify-content: center;



  flex-wrap: wrap;



  gap: 30px;



  margin-top: 60px;

}



.contact-item {

  display: flex;



  align-items: center;



  gap: 14px;



  padding: 18px 28px;



  background: rgba(255,255,255,0.45);



  border-radius: 14px;



  text-decoration: none;



  color: #30231a;



  font-family: 'Inter', sans-serif;



  font-size: 18px;



  transition: all 0.3s ease;



  backdrop-filter: blur(6px);

}



.contact-item:hover {

  transform: translateY(-4px);



  background: rgba(255,255,255,0.7);

}



.contact-icon {

  font-size: 24px;

}



.contact-item i {

  font-size: 22px;



  color: #8a6a4d;



  width: 24px;



  text-align: center;

}