/* FONT & BASE FINARTE */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=HK+Grotesk:wght@400;500;700&display=swap');



html, body {
  margin: 0;
  padding: 0;
  font-family: "HK Grotesk", Arial, sans-serif;
  color: #1f1f1f;
  background-color: #fff;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
  font-family: "Playfair Display", serif;
  font-weight: 700;
  margin-bottom: 20px;
  color: #111;
}

a {
  color: #b68c63; /* colore oro finarte */
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

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

/* Pulsante base */
.btn {
  display: inline-block;
  padding: 12px 24px;
  border-radius: 999px;
  background-color: #b68c63;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: 0.5px;
  transition: background-color 0.2s ease;
}
.btn:hover {
  background-color: #8d6b4b;
}


/* Header/logo */
.landing-header{padding:16px 24px; display:flex; justify-content:center}
.landing-logo{height:28px; width:auto}

/* NEW HERO ANDREA */
/* =========================
   HERO TEXT STYLE (come landing originale)
   ========================= */

.landing-hero {
  position: relative !important;
  min-height: 100vh !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  color: #fff !important;
  overflow: hidden !important;
}

.landing-hero__overlay {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(0, 0, 0, 0.45) !important; /* leggermente più scuro per miglior contrasto */
  z-index: 1 !important;
}

.landing-hero__inner {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1000px !important;
  padding: 120px 20px !important;
}

.landing-hero__title {
  font-family: "Playfair Display", serif !important;
  font-size: clamp(52px, 7vw, 92px) !important;
  font-weight:normal;
  color: #fff !important;
  margin-bottom: 20px !important;
  line-height: 1.1 !important;
  text-shadow: 0 2px 4px rgba(0,0,0,0.4) !important;
}

.landing-hero__subtitle {
  font-family: "HK Grotesk", sans-serif !important;
  font-size: clamp(20px, 2.4vw, 28px) !important;
  font-weight: 500 !important;
  color: #fff !important;
  letter-spacing: 0.5px !important;
  line-height: 1.4 !important;
  text-transform: uppercase !important;
  margin-bottom: 35px !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.4) !important;
}

/* CTA button */
.landing-hero .btn {
  background-color: #b68c63 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 50px !important;
  padding: 14px 36px !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  transition: all 0.3s ease !important;
}

.landing-hero .btn:hover {
  background-color: #8d6b4b !important;
  color: #fff !important;
}


/* BLOCCHI */
.landing-block{padding:72px 16px}
.landing-block__inner{max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:center}
.landing-block--reverse .landing-block__media{order:2}
.landing-block--reverse .landing-block__text{order:1}
.landing-block__media img{max-width:100%; height:auto; display:block;}
.landing-block__text p{font-size:clamp(16px,2.1vw,22px); margin:0 0 16px}

/* FORM */
.landing-form{padding:80px 16px; background:#f5f5f5}
.landing-form__inner{max-width:900px; margin:0 auto; text-align:center}
.landing-form h2{font-family:"Playfair Display",serif; margin:0 0 8px}

/* RECENSIONI */
.landing-reviews{padding:72px 16px}
.landing-reviews__inner{max-width:900px; margin:0 auto; text-align:center}
.landing-reviews blockquote{background:#fafafa; margin:12px 0; padding:16px 20px; border-radius:10px}

/* FOOTER */
.landing-footer{padding:36px 16px; text-align:center; font-size:14px; color:#666; background:#f7f7f7}

/* Responsive */
@media (max-width:900px){
  .landing-block__inner{grid-template-columns:1fr}
  .landing-block--reverse .landing-block__media,
  .landing-block--reverse .landing-block__text{order:initial}
}

/* NEW ANDREA
/* NAVBAR TRASPARENTE → NERA ALLO SCROLL */
.main-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 9999 !important;
  background: transparent !important;
  box-shadow: none !important;
  transition: background-color 0.4s ease, box-shadow 0.4s ease !important;
}

.main-nav .nav-logo-wrap img {
  display: block !important;
  margin: 0 auto !important;
  width: 140px !important;
  height: auto !important;
  padding: 15px !important;
  filter: brightness(1) !important;
}

/* Quando scrollo: forza il background nero sopra TUTTO */
body.scrolled .main-nav,
.main-nav.scrolled {
  background: rgba(0, 0, 0, 0.95) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
}

body.scrolled .main-nav.transparent,
body.scrolled .main-nav.js-transparent {
  background: rgba(0, 0, 0, 0.95) !important;
}

/* Forza lo stile dei titoli sezione come nell’originale Finarte */
.section-title {
  font-family: "HK_Grotesk", Arial, sans-serif !important;
  font-weight: 300 !important;
  font-size: 46px !important;
  line-height: 1.196 !important;
  letter-spacing: -0.04em !important;
  color: #111 !important;
  margin-bottom: 20px !important;
  overflow-wrap: break-word !important;
}

/* Ottimizzazione responsive */
@media (max-width: 768px) {
  .section-title {
    font-size: 32px !important;
    line-height: 1.25 !important;
  }
}

/* 2️⃣ Testo bianco per sezioni scure (nero, bordeaux, blu-notte ecc.) */
section[style*="#000000"],
section[style*="#5b1a1a"],
section[style*="#1e2a44"] {
  color: #fff !important;
}

section[style*="#000000"] .section-title,
section[style*="#5b1a1a"] .section-title,
section[style*="#1e2a44"] .section-title {
  color: #fff !important;
}

section[style*="#000000"] .btn,
section[style*="#5b1a1a"] .btn,
section[style*="#1e2a44"] .btn {
  background-color: transparent !important;
  border: 2px solid #fff !important;
  color: #fff !important;
}

section[style*="#000000"] .btn:hover,
section[style*="#5b1a1a"] .btn:hover,
section[style*="#1e2a44"] .btn:hover {
  background-color: #fff !important;
  color: #000 !important;
}

.wow { visibility: hidden; }
.animated { visibility: visible !important; }


/* === STILE FORM COME LANDING ORIGINALE FINARTE === */

.page-section {
  padding: 100px 20px;
  background: #fff;
}

.page-section .section-title {
  font-family: "Playfair Display", serif;
  font-weight: 400;
  font-size: 46px;
  color: #111;
  margin-bottom: 10px;
}

.page-section .section-title-descr {
  font-family: "HK Grotesk", sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: #757575;
  margin-bottom: 60px;
}

.form-group {
  margin-bottom: 25px;
}

.form-control {
  width: 100%;
  padding: 14px 18px;
  border: 1px solid #ccc;
  border-radius: 8px;
  font-size: 16px;
  color: #333;
  background-color: #fff;
  transition: border-color 0.2s ease;
}

.form-control:focus {
  border-color: #b68c63;
  outline: none;
  box-shadow: 0 0 0 3px rgba(182,140,99,0.15);
}

.form-check {
  display: flex;
  align-items: center;
  gap: 10px;
}

.form-check-label {
  font-size: 15px;
  color: #555;
}

.btn-mod {
  background-color: #b68c63;
  border: none;
  color: #fff;
  padding: 14px 36px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 50px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  transition: all 0.3s ease;
}

.btn-mod:hover {
  background-color: #8d6b4b;
  color: #fff;
}

.btn-round {
  border-radius: 50px;
}

.btn-large {
  padding: 16px 40px;
  font-size: 16px;
}

.text-center {
  text-align: center;
}

.text-end {
  text-align: right;
}

.form-tip {
  font-size: 14px;
  color: #777;
}

/* Responsivo */
@media (max-width: 768px) {
  .page-section {
    padding: 60px 16px;
  }
  .page-section .section-title {
    font-size: 34px;
  }
  .btn-mod {
    width: 100%;
    text-align: center;
  }
}


/* ===============  FINARTE FORM ISOLATO (lf-*)  =============== */
.lf-section{
  padding: 100px 20px;
  background:#f5f5f5;
}
.lf-container{
  max-width: 900px;
  margin: 0 auto;
}
.lf-head{
  text-align:center;
  margin-bottom: 28px;
}
.lf-title{
  font-family: "Playfair Display", serif;
  font-weight: 400;
  font-size: 46px;
  line-height: 1.2;
  color:#111;
  margin: 0 0 8px 0;
}
.lf-subtitle{
  font-family: "HK Grotesk", Arial, sans-serif;
  font-size: 18px;
  color:#757575;
  margin: 0;
}

.lf-form{ margin-top: 28px; }

.lf-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 24px;
}
.lf-field{ display:flex; flex-direction:column; }

.lf-label{
  font-size: 14px;
  color:#444;
  margin-bottom: 6px;
}

.lf-input{
  appearance: none;
  width: 100%;
  padding: 14px 16px;
  border: 1px solid #cfcfcf;
  border-radius: 10px;
  background: #fff;
  font-size: 16px;
  color:#111;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.lf-input::placeholder{ color:#8a8a8a; opacity:1; }
.lf-input:focus{
  outline: none;
  border-color:#b68c63;
  box-shadow: 0 0 0 3px rgba(182,140,99,.15);
}

/* Privacy + submit */
.lf-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  margin-top: 18px;
  flex-wrap: wrap;
}

/* checkbox custom */
.lf-check{
  display:flex;
  align-items:center;
  gap:10px;
  font-size: 15px;
  color:#333;
}
.lf-check input[type="checkbox"]{
  width: 18px;
  height: 18px;
  margin: 0;
  border: 1px solid #bbb;
  border-radius: 4px;
  accent-color: #b68c63; /* dorato */
}
.lf-check a{ color:#b68c63; text-decoration: underline; }

/* bottone */
.lf-btn{
  appearance: none;
  border: none;
  background:#b68c63;
  color:#fff;
  padding: 14px 36px;
  border-radius: 999px;
  font-weight: 700;
  letter-spacing:.5px;
  text-transform: uppercase;
  cursor:pointer;
  transition: background-color .2s ease, transform .06s ease;
}
.lf-btn:hover{ background:#8d6b4b; }
.lf-btn:active{ transform: translateY(1px); }

/* messaggi */
.lf-result{
  margin-top: 14px;
  font-size: 15px;
  color:#333;
}

/* responsive */
@media (max-width: 820px){
  .lf-grid{ grid-template-columns: 1fr; }
  .lf-actions{ flex-direction: column; align-items: flex-start; }
  .lf-btn{ width: 100%; text-align:center; }
  .lf-title{ font-size: 36px; }
}


.lf-error, .lf-success {
  margin-top: 10px;
  padding: 10px 14px;
  border-radius: 6px;
  font-size: 15px;
}
.lf-error { background: #ffe5e5; color: #b30000; }
.lf-success { background: #e5ffe9; color: #0d630d; }


/* === Evidenziazione errori form === */
.lf-error-field {
  border-color: #e41919 !important;
  box-shadow: 0 0 0 3px rgba(228, 25, 25, 0.15) !important;
}

.lf-error-field::placeholder {
  color: #e41919 !important;
  opacity: 0.8 !important;
}


.bg-dark {
  background-color: #111;
}

.text-white {
  color: #fff !important;
}


/* =============================================
   STILI PER LA NUOVA SEZIONE RECENSIONI (Swiper.js)
   TUTTE le classi sono uniche per evitare conflitti.
   ============================================= */

.review-section-nuova {
    background-color: #202020; /* Sfondo scuro (come da screen) */
    padding: 80px 20px;
    position: relative;
    overflow: hidden;
    font-family: "HK Grotesk", Arial, sans-serif;
}

.review-container-nuovo {
    max-width: 900px; /* Larghezza massima contenuto */
    margin: 0 auto;
    position: relative;
}

/* Titolo */
.review-title-nuovo {
    font-family: "Playfair Display", serif;
    font-size: clamp(34px, 5vw, 48px);
    font-weight: 700;
    color: #fff;
    text-align: center;
    margin: 0 0 40px 0;
}

/* Contenitore Slider */
.review-slider-nuovo {
    width: 100%;
    overflow: hidden; /* Nasconde slide non attive */
}

/* Stile della singola slide */
.review-slider-nuovo .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 250px; /* Dà altezza allo slider */
    box-sizing: border-box;
    padding: 0 10%; /* Spazio ai lati per non toccare le frecce */
}

.review-content-nuovo {
    text-align: center;
    color: #fff;
}

/* Stelle (usiamo caratteri, non icone, per evitare conflitti) */
.review-stars-nuovo {
    font-size: 24px;
    margin-bottom: 25px;
    letter-spacing: 3px;
}
.review-stars-nuovo .star-filled {
    color: #f9b400; /* Oro */
}
.review-stars-nuovo .star-empty {
    color: #444; /* Grigio per stelle vuote */
}

/* Testo recensione */
.review-text-nuovo {
    font-family: "Playfair Display", serif;
    font-size: clamp(20px, 3vw, 26px);
    line-height: 1.5;
    font-style: italic;
    color: #f0f0f0;
    margin: 0;
}

/* Autore */
.review-author-nuovo {
    font-family: "HK Grotesk", Arial, sans-serif;
    font-size: 16px;
    color: #aaa;
    margin-top: 25px;
    font-style: normal;
    text-transform: uppercase;
}

/* ==================================================
   FIX DEFINITIVO FRECCE E PALLINI (Swiper.js)
   ================================================== */

/* Contenitore della singola slide (lo lascio per sicurezza) */
.text-slider .owl-item .testimonial, /* <- Se hai ancora questo, cancellalo */
.review-slider-nuovo .swiper-slide .review-content-nuovo {
    text-align: center !important;
    color: #fff !important;
    opacity: 1 !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    width: 100%;
    padding: 0 10%; 
    box-sizing: border-box;
}

/* NAVIGAZIONE: FRECCE
   Questo blocco ora è corretto e usa le icone di default di Swiper
*/
.swiper-button-prev-nuovo,
.swiper-button-next-nuovo {
    position: absolute;
    top: 50%; /* Centra verticalmente */
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
    
    display: flex;
    align-items: center;
    justify-content: center;

    width: 44px; /* Dimensione standard Swiper */
    height: 44px; /* Dimensione standard Swiper */
    
    opacity: 0.7; /* Leggermente trasparenti */
    transition: opacity 0.2s ease;
}
.swiper-button-prev-nuovo:hover,
.swiper-button-next-nuovo:hover {
    opacity: 1; /* Opacità piena all'hover */
}

/* POSIZIONAMENTO FRECCE (più vicine al testo) */
.swiper-button-prev-nuovo {
    left: 300px; /* Aumentato per avvicinare al centro */
}
.swiper-button-next-nuovo {
    right: 300px; /* Aumentato per avvicinare al centro */
}

/* ICONE DELLE FRECCE (FIX CON FONT AWESOME)
   Questo codice usa Font Awesome (che sappiamo essere caricato)
*/
.swiper-button-prev-nuovo::after,
.swiper-button-next-nuovo::after {
    font-family: 'FontAwesome'; /* <-- USA FONT AWESOME */
    font-size: 40px; /* <-- Dimensione delle icone */
    font-weight: normal; /* <-- Normal è meglio per le icone */
    color: #fff;
    line-height: 1;
}
.swiper-button-prev-nuovo::after {
    content: '\f104'; /* <-- Codice Unicode per la freccia SINISTRA (fa-angle-left) */
}
.swiper-button-next-nuovo::after {
    content: '\f105'; /* <-- Codice Unicode per la freccia DESTRA (fa-angle-right) */
}

/* NAVIGAZIONE: PALLINI
   (Il tuo CSS per i pallini è già quasi corretto,
    assicurati solo che ci sia 'text-align: center')
*/
.swiper-pagination-nuovo {
    position: static; /* Mette i pallini sotto lo slider */
    margin-top: 30px;
    text-align: center; /* CENTRA I PALLINI */
}
.swiper-pagination-nuovo .swiper-pagination-bullet {
    background: #666;
    opacity: 1;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    border-radius: 50%;
    display: inline-block;
}
.swiper-pagination-nuovo .swiper-pagination-bullet-active {
    background: #fff; /* Pallino attivo bianco */
}

.landing-block__caption {
  font-size: 13px;
  color: #555;
  margin-top: 10px;
  text-align: left;
  font-family: "HK Grotesk", Arial, sans-serif;
  line-height: 1.4;
}

.landing-block--reverse .landing-block__caption {
  text-align: right;
}

.landing-block__caption {
  font-size: 13px;
  color: #555;
  margin-top: 10px;
  text-align: left;
  font-family: "HK Grotesk", Arial, sans-serif;
  line-height: 1.4;
}

.landing-block--reverse .landing-block__caption {
  text-align: right;
}

/* Colore bianco per didascalie su sfondi scuri */
.landing-block--dark .landing-block__caption {
  color: #f8f8f8;
  opacity: 0.9;
}

/* fine modifiche Andrea */