/* Google Font — Plus Jakarta Sans */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700;800&display=swap');

/* ==========================
   Città a Colori — Corporate Blue Style
   (index / servizi / contatti)
   ========================== */

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: 'Plus Jakarta Sans', Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  color:#1a2340;
  background:#f3f6fb;
  line-height:1.6;
}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}

:root{
  --blue-900:#031b46;
  --blue-800:#072b6d;
  --blue-700:#0a4ecf;
  --blue-600:#1670ff;
  --line:rgba(255,255,255,.14);
  --line-dark:rgba(10,18,34,.08);
  --text-soft:rgba(255,255,255,.78);
  --muted:#5d687a;
  --card:#ffffff;
  --shadow:0 20px 50px rgba(8,25,56,.14);
  --radius:18px;
}

.site-shell{
  width:min(1240px, calc(100% - 36px));
  margin:0 auto;
}

/* ==========================
   Hero / Header
   ========================== */
.heroTop{
  position:relative;
  min-height:520px;
  color:#fff;
  background:
    linear-gradient(120deg, rgba(2, 75, 231, 0.151), rgba(3,26,79,.80)),
    url("assets/img/hero.jpg") center/cover no-repeat;
  overflow:hidden;
}
.heroTop-small{
  min-height:340px;
}

.heroTop-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 400px at 10% 10%, rgba(22,112,255,.20), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.14), rgba(0,0,0,.34));
  pointer-events:none;
}

.topline,
.mainNav,
.heroCenter{
  position:relative;
  z-index:2;
}

.topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px 0 10px;
}

.brandline{
  display:flex;
  align-items:center;
  gap:10px;
}
.brandLogo{
  width:42px;
  height:42px;
  border-radius:999px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06);
  flex:0 0 auto;
}
.brandLogo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transform:scale(1.2);
}

.brandText{
  display:flex;
  flex-direction:column;
  line-height:1.05;
}
.brandText strong{
  font-size:.95rem;
  letter-spacing:-.02em;
}
.brandText span{
  color:var(--text-soft);
  font-size:.78rem;
}

.topline-right{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.topline-right a{
  color:rgba(255,255,255,.92);
  font-size:.84rem;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
}
.topline-right a:hover{
  background:rgba(255,255,255,.08);
}

.mainNav{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 0 0;
  border-top:1px solid rgba(255,255,255,.10);
  flex-wrap: wrap;
}
.mainNav a{
  padding:10px 14px;
  border-radius:4px;
  color:rgba(255,255,255,.80);
  font-weight:600;
  font-size:.86rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  white-space: nowrap;
}
.mainNav a:hover{
  color:#fff;
  background:rgba(255,255,255,.06);
}
.mainNav a.active{
  color:#fff;
  border-bottom:2px solid #fff;
}

.heroCenter{
  text-align:center;
  padding:72px 0 92px;
}
.heroCenter-small{
  padding:48px 0 54px;
}
.eyebrow{
  margin:0 0 10px;
  font-size:.78rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.78);
}
.heroCenter h1{
  margin:0;
  font-size:clamp(2rem,4.5vw,3.4rem);
  line-height:1.05;
  letter-spacing:-.03em;
  font-weight:850;
}
.heroSub{
  margin:12px auto 0;
  max-width:70ch;
  color:rgba(255,255,255,.84);
  line-height:1.5;
  font-size:.98rem;
}
.heroBtns{
  margin-top:18px;
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}

.btnWhite,
.btnGhost,
.btnBlue{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top: 10px;
  border-radius:999px;
  padding:11px 16px;
  font-weight:800;
  font-size:.92rem;
  transition:.18s ease;
  border:1px solid transparent;
  cursor:pointer;
}
.btnWhite{
  background:#fff;
  color:#09214f;
}
.btnWhite:hover{ transform:translateY(-1px); }

.btnGhost{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.16);
  color:#fff;
}
.btnGhost:hover{
  background:rgba(255,255,255,.10);
  transform:translateY(-1px);
}

.btnBlue{
  background:var(--blue-600);
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
}
.btnBlue:hover{
  background:#0f63ea;
  transform:translateY(-1px);
}

/* ==========================
   Floating service tabs
   ========================== */
.floatingServicesWrap{
  margin-top:-42px;
  position:relative;
  z-index:5;
}
.floatingServices{
  background:#fff;
  border-radius:12px;
  box-shadow:var(--shadow);
  display:grid;
  grid-template-columns:repeat(4,1fr);
  overflow:hidden;
  border:1px solid var(--line-dark);
}
.fsItem{
  padding:16px 14px;
  display:flex;
  flex-direction:column;
  gap:4px;
  align-items:center;
  justify-content:center;
  text-align:center;
  border-right:1px solid rgba(10,18,34,.06);
  min-height:92px;
}
.fsItem:last-child{border-right:none}
.fsItem .fsIcon{
  font-size:1.15rem;
}
.fsItem strong{
  font-size:.86rem;
  color:#0f1b36;
}
.fsItem small{
  color:var(--muted);
  font-size:.76rem;
}
.fsItem:hover{
  background:#f8fbff;
}
.fsItem.active{
  background:var(--blue-600);
}
.fsItem.active strong,
.fsItem.active small,
.fsItem.active .fsIcon{
  color:#fff;
}

/* ==========================
   Sections
   ========================== */
.section{
  padding:62px 0;
}
.section-light{ background:#fff; }
.section-soft{ background:#eef2f8; }
.section-dark{
  background:
    radial-gradient(700px 320px at 85% 50%, rgba(255,255,255,.05), transparent 70%),
    linear-gradient(180deg, #03235f, #031c4e);
  color:#fff;
}

.sectionHead h2{
  margin:0;
  font-size:clamp(1.5rem,2.4vw,2.1rem);
  line-height:1.1;
  letter-spacing:-.03em;
}
.sectionHead.center{
  text-align:center;
}
.sectionEyebrow{
  margin:0 0 8px;
  color:#1e5fd1;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

/* ==========================
   Why Choose Us
   ========================== */
.whyGrid{
  display:grid;
  grid-template-columns: .95fr 1.05fr;
  gap:26px;
  align-items:center;
  margin-top:22px;
}
.whyImageCard{
  background:#fff;
  border-radius:10px;
  padding:10px;
  box-shadow:var(--shadow);
  border:1px solid var(--line-dark);
}
.whyImageCard img{
  border-radius:6px;
  width:100%;
  height:320px;
  object-fit:cover;
}
.whyText p{
  margin:0 0 12px;
  color:#4d5a70;
  line-height:1.55;
}
.whyPoints{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  margin-top:8px;
}
.whyPoint{
  border:1px solid var(--line-dark);
  background:#fbfcff;
  border-radius:10px;
  padding:10px 12px;
}
.whyPoint strong{
  display:block;
  color:#10203b;
}
.whyPoint span{
  color:#5c677a;
  font-size:.9rem;
}

/* ==========================
   Feature Row
   ========================== */
.featureRow{
  display:grid;
  grid-template-columns:1.1fr .95fr .95fr;
  gap:14px;
  align-items:stretch;
}
.featureLead{
  background:#fff;
  border-radius:12px;
  border:1px solid var(--line-dark);
  box-shadow:var(--shadow);
  padding:18px;
}
.featureLead h3{
  margin:0 0 10px;
  font-size:1.35rem;
  letter-spacing:-.03em;
}
.featureLead p{
  margin:0 0 12px;
  color:#58667d;
  line-height:1.5;
}

.miniFeature{
  background:#fff;
  border-radius:12px;
  border:1px solid var(--line-dark);
  box-shadow:var(--shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.miniFeature img{
  height:170px;
  width:100%;
  object-fit:cover;
}
.miniFeature div{
  padding:12px;
}
.miniFeature strong{
  display:block;
  color:#10203b;
}
.miniFeature span{
  color:#607089;
  font-size:.9rem;
}
.miniFeature:hover img{
  transform:scale(1.03);
  transition:transform .22s ease;
}

/* ==========================
   Dark Services
   ========================== */
.darkHead{
  text-align:center;
  margin-bottom:20px;
}
.darkHead h2{
  margin:0;
  font-size:clamp(1.5rem,2.6vw,2.2rem);
  letter-spacing:-.03em;
}
.darkHead p{
  margin:8px auto 0;
  color:rgba(255,255,255,.75);
  max-width:64ch;
}

.darkServiceGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.darkServiceCard{
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.03);
  border-radius:10px;
  padding:14px;
  min-height:150px;
}
.darkServiceCard.active{
  background:rgba(22,112,255,.18);
  border-color:rgba(68,151,255,.45);
}
.dIcon{
  display:inline-flex;
  width:34px;
  height:34px;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  background:rgba(255,255,255,.07);
  margin-bottom:8px;
}
.darkServiceCard h4{
  margin:0 0 6px;
  font-size:1rem;
  letter-spacing:-.02em;
}
.darkServiceCard p{
  margin:0;
  color:rgba(255,255,255,.74);
  line-height:1.45;
  font-size:.92rem;
}

/* ==========================
   Footer Corporate
   ========================== */
.footerCorporate{
  margin-top:0;
  background:#02153a;
  color:#fff;
}
.footerCorporate-grid{
  display:grid;
  grid-template-columns:1.3fr .9fr .9fr .9fr;
  gap:20px;
  padding:44px 0 30px;
}
.fcol h4{
  margin:0 0 12px;
  font-size:.95rem;
}
.fcol a{
  display:block;
  color:rgba(255,255,255,.78);
  padding:6px 0;
  font-size:.92rem;
}
.fcol a:hover{ color:#fff; text-decoration:underline; }
.fcol p{
  margin:10px 0 0;
  color:rgba(255,255,255,.74);
  line-height:1.5;
}
.fmuted{
  display:block;
  color:rgba(255,255,255,.62);
  margin-top:8px;
  font-size:.9rem;
}
.footerBrand .brandLogo{
  width:72px;height:72px;
}
.footerBtn{
  margin-top:4px;
  width:max-content;
}

.footerBottom{
  border-top:1px solid rgba(255,255,255,.10);
}
.footerBottom-inner{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:rgba(255,255,255,.68);
  font-size:.9rem;
}
.footerBottom-links{
  display:flex;
  gap:14px;
}
.footerBottom-links a{
  color:rgba(255,255,255,.74);
}
.footerBottom-links a:hover{ color:#fff; }

/* ==========================
   Servizi page visual cards
   ========================== */
.servicePageTop{
  margin-top:26px;
  margin-bottom:34px;
}
.serviceCardsGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.serviceCardVisual{
  background:#fff;
  border:1px solid var(--line-dark);
  border-radius:14px;
  overflow:hidden;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
}
.serviceCardVisual-wide{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns: .95fr 1.05fr;
}

.serviceCardVisual-img{
  position:relative;
  min-height:220px;
}
.serviceCardVisual-img img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.badge{
  position:absolute;
  top:12px;
  left:12px;
  background:rgba(3,27,70,.78);
  color:#fff;
  border:1px solid rgba(255,255,255,.15);
  padding:7px 10px;
  border-radius:999px;
  font-size:.8rem;
  font-weight:700;
}
.serviceCardVisual-body{
  padding:16px;
}
.serviceCardVisual-body h2{
  margin:0 0 8px;
  font-size:1.2rem;
  letter-spacing:-.02em;
}
.serviceCardVisual-body p{
  margin:0 0 10px;
  color:#5a687f;
  line-height:1.5;
}
.serviceCardVisual-body ul{
  margin:0;
  padding-left:18px;
  color:#56647b;
}
.serviceCardVisual-body li{ margin:5px 0; }

.priceBox{
  margin:10px 0 12px;
  padding:10px 12px;
  border-radius:10px;
  background:#eef4ff;
  border:1px solid rgba(22,112,255,.15);
  color:#17376f;
}

/* ==========================
   Contatti page
   ========================== */
.contactLayout{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:16px;
  margin:26px 0 34px;
}
.contactCard{
  background:#fff;
  border:1px solid var(--line-dark);
  border-radius:14px;
  box-shadow:var(--shadow);
  padding:18px;
}
.contactHead h2{
  margin:0 0 6px;
  font-size:1.2rem;
  letter-spacing:-.02em;
}
.contactHead p{
  margin:0 0 14px;
  color:#5a687f;
  line-height:1.45;
}

.waForm{
  display:grid;
  gap:12px;
  
}
.waForm label{
  display:grid;
  gap:7px;
}
.waForm label span{
  font-weight:700;
  color:#23344f;
  font-size:.92rem;
}
.waRow{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.waForm input,
.waForm select,
.waForm textarea{
  width:100%;
  border:1px solid rgba(12,25,52,.10);
  border-radius:10px;
  background:#fff;
  padding:12px 12px;
  outline:none;
  font:inherit;
  color:#10203b;
}
.waForm input:focus,
.waForm select:focus,
.waForm textarea:focus{
  border-color:rgba(22,112,255,.30);
  box-shadow:0 0 0 4px rgba(22,112,255,.10);
}
.waActions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.waActions small{
  color:#607089;
}

.contactSide{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.sideBox{
  background:#fff;
  border:1px solid var(--line-dark);
  border-radius:14px;
  box-shadow:var(--shadow);
  padding:14px;
}
.sideBox1{
  
  border-radius:14px;
  box-shadow:var(--shadow);
  
}
.sideBox h3{
  margin:0 0 10px;
  font-size:1rem;
  letter-spacing:-.02em;
}
.sideBox p{
  margin:6px 0 0;
  color:#5d6c83;
}
.sideLine{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:9px 0;
  border-top:1px solid rgba(12,25,52,.06);
}
.sideLine:first-of-type{ border-top:none; padding-top:0; }
.sideLine span{ color:#607089; }
.sideLine strong{ color:#10203b; }

.sideBox.dark{
  background:linear-gradient(180deg, #08265f, #041a43);
  color:#fff;
  border-color:rgba(255,255,255,.10);
}
.sideBox.dark p{ color:rgba(255,255,255,.74); }
.bigPrice{
  font-size:1.55rem;
  font-weight:900;
  letter-spacing:-.03em;
  margin:4px 0 2px;
}

/* ==========================
   Responsive
   ========================== */
@media (max-width: 1100px){
  .featureRow{
    grid-template-columns:1fr;
  }
  .darkServiceGrid{
    grid-template-columns:1fr 1fr;
  }
  .contactLayout{
    grid-template-columns:1fr;
  }
}

@media (max-width: 900px){
  .floatingServices{
    grid-template-columns:1fr 1fr;
  }
  .whyGrid{
    grid-template-columns:1fr;
  }
  .serviceCardsGrid{
    grid-template-columns:1fr;
  }
  .serviceCardVisual-wide{
    grid-column:auto;
    grid-template-columns:1fr;
  }
  .footerCorporate-grid{
    grid-template-columns:1fr 1fr;
  }
  .waRow{
    grid-template-columns:1fr;
  }
}

@media (max-width: 640px){
  .site-shell{
    width:min(1240px, calc(100% - 22px));
  }
  .topline{
    flex-direction:column;
    align-items:flex-start;
  }
  .mainNav{
    flex-wrap:wrap;
    gap:4px;
  }
  .heroCenter{
    padding:50px 0 76px;
  }
  .heroTop-small .heroCenter{
    padding:34px 0 42px;
  }
  .floatingServices{
    grid-template-columns:1fr;
  }
  .darkServiceGrid{
    grid-template-columns:1fr;
  }
  .footerCorporate-grid{
    grid-template-columns:1fr;
  }
  .footerBottom-inner{
    flex-direction:column;
    align-items:flex-start;
    padding:10px 0;
  }
}

/* ==========================
   Preventivo card con bg image + glass effect
   ========================== */
.serviceQuoteSection{
  margin: 14px 0 36px;
}

.quoteHeroCard{
  position: relative;
  min-height: 360px;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 24px 60px rgba(8,25,56,.16);
  background: #0a1f4a;
}

.quoteHeroBg{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.quoteHeroOverlay{
  position: absolute;
  inset: 0;
  background:
    linear-gradient(115deg, rgba(3,27,70,.78) 0%, rgba(3,27,70,.52) 45%, rgba(3,27,70,.28) 100%),
    radial-gradient(700px 260px at 15% 20%, rgba(22,112,255,.24), transparent 70%);
}

/* Glass panel sopra l'immagine */
.quoteHeroGlass{
  position: relative;
  z-index: 2;
  width: min(620px, calc(100% - 28px));
  margin: 18px;
  margin-top: 50px;
  padding: 18px;
  border-radius: 16px;

  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 16px 40px rgba(0,0,0,.22);

  color: #fff;
}

.quoteHeroKicker{
  margin: 0 0 8px;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.86);
}

.quoteHeroGlass h2{
  margin: 0 0 10px;
  font-size: clamp(1.35rem, 2.4vw, 2rem);
  line-height: 1.08;
  letter-spacing: -.03em;
  color: #fff;
}

.quoteHeroGlass p{
  margin: 0;
  color: rgba(255,255,255,.84);
  line-height: 1.5;
}
.quoteHeroGlass p strong{
  color:#fff;
}

/* Meta pill */
.quoteHeroMeta{
  margin: 14px 0 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.quoteHeroMeta span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  color: rgba(255,255,255,.92);
  font-size: .84rem;
  font-weight: 700;
}

/* Buttons */
.quoteHeroActions{
  display:flex;
  gap:10px;
  flex-wrap: wrap;
}

/* bottone vetro chiaro */
.btnGlassLight{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:11px 16px;
  font-weight:800;
  font-size:.92rem;
  border:1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.10);
  color:#fff;
  transition:.18s ease;
}
.btnGlassLight:hover{
  background: rgba(255,255,255,.16);
  transform: translateY(-1px);
}

/* Layout mobile */
@media (max-width: 700px){
  .quoteHeroCard{
    min-height: 420px;
  }

  .quoteHeroGlass{
    width: calc(100% - 20px);
    margin: 10px;
    padding: 14px;
  }

  .quoteHeroGlass h2{
    font-size: 1.35rem;
  }
}

/* ==========================
   Bottone email (predefinito)
   ========================== */
.btnEmail{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.28);
  background: rgba(255,255,255,.18);
  color:#fff;
  font-weight:800;
  font-size:.92rem;
  line-height:1;
  text-decoration:none;
  white-space:nowrap;
  transition: background .18s ease, transform .18s ease;
}
.btnEmail:hover{
  background: rgba(255,255,255,.24);
  transform: translateY(-1px);
}

/* Versione bottone email su sfondo chiaro (pagina contatti semplice) */
.contactOnlyButtons .btnEmail{
  border:1px solid rgba(10,18,34,.12);
  background:#eef3fb;
  color:#0f1b36;
}
.contactOnlyButtons .btnEmail:hover{
  background:#e6edf9;
}

/* Se vuoi anche il bottone vetro chiaro leggibile su sfondo chiaro */
.contactOnlyButtons .btnGlassLight{
  border:1px solid rgba(10,18,34,.12);
  background:#f4f7fc;
  color:#0f1b36;
}
.contactOnlyButtons .btnGlassLight:hover{
  background:#eaf0fb;
}

/* ==========================
   Contatti: solo bottoni
   ========================== */
.contactOnlyButtons{
  margin: 26px 0 34px;
}

.contactOnlyCard{
  background:#fff;
  border:1px solid rgba(10,18,34,.08);
  border-radius:16px;
  box-shadow:0 20px 50px rgba(8,25,56,.10);
  padding:22px;
}

.contactOnlyCard h2{
  margin:0 0 10px;
  font-size: clamp(1.4rem, 2.2vw, 2rem);
  line-height:1.08;
  letter-spacing:-.03em;
  color:#0f1b36;
}

.contactOnlyCard p{
  margin:0;
  color:#5a687f;
  line-height:1.55;
  max-width: 70ch;
}

.contactOnlyButtonsRow{
  margin-top:16px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.contactQuickInfo{
  margin-top:16px;
  display:grid;
  gap:8px;
  padding-top:14px;
  border-top:1px solid rgba(10,18,34,.08);
  color:#5a687f;
}
.contactQuickInfo a{
  color:#0f1b36;
  font-weight:600;
}
.contactQuickInfo a:hover{
  text-decoration:underline;
}

/* Mobile */
@media (max-width: 700px){
  .contactOnlyCard{
    padding:16px;
  }

  .contactOnlyButtonsRow{
    flex-direction:column;
    align-items:stretch;
  }

  .contactOnlyButtonsRow a{
    width:100%;
    justify-content:center;
  }
}

/* Bottoni sotto il form (WhatsApp + Email) */
.btnPreventivoTop{
  /* stile solo di questo bottone */
  background: #0953cc;
  margin-top: 0;
  margin-bottom: 15px;
  color: #fff;
  border-radius: 999px;
  padding: 12px 18px;
}

.btnPreventivoTop:hover{
  background: #1862d8;
}

.map {
  height: 400px;
  border-radius: 14px;
}

/* ==========================
   Campo prenotazione (Ora + Data) moderno
   ========================== */
.bookingField{
  display:grid;
  gap:7px;
}

.bookingSplit{
  display:grid;
  grid-template-columns: 0.9fr 1.1fr; /* sinistra ora, destra data */
  gap:10px;
  padding:10px;
  border-radius:14px;
  border:1px solid rgba(12,25,52,.10);
  background:#fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}

.bookingPart{
  border:1px solid rgba(12,25,52,.08);
  background:#f8fbff;
  border-radius:12px;
  padding:10px;
  display:grid;
  gap:6px;
}

.bookingMiniLabel{
  font-size:.78rem;
  font-weight:700;
  color:#61708a;
  line-height:1;
}

.bookingPart input{
  width:100%;
  border:none !important;
  background:transparent !important;
  padding:4px 2px !important;
  outline:none;
  box-shadow:none !important;
  color:#10203b;
  font:inherit;
  font-weight:600;
}

/* Focus moderno sul blocco unico */
.bookingSplit:focus-within{
  border-color: rgba(22,112,255,.30);
  box-shadow: 0 0 0 4px rgba(22,112,255,.10);
}

.bookingPart input::-webkit-calendar-picker-indicator{
  cursor:pointer;
  opacity:.9;
}

/* ==========================
   Luogo (compare se "In presenza")
   ========================== */
#placeFieldWrap{
  transition: all .2s ease;
}

/* puoi dare uno stile un po' più "evidente" */
#placeFieldWrap label{
  width:100%;
}

#placeFieldWrap input{
  border:1px solid rgba(12,25,52,.10);
  background:#fff;
}

/* ==========================
   Bottoni sotto il form (WhatsApp + Email)
   ========================== */
/* Versione pulsanti rapidi sopra il form (se ti serve ribadire stile chiaro in contactCard) */
.contactCard .btnGlassLight{
  border:1px solid rgba(10,18,34,.12);
  background:#f4f7fc;
  color:#0f1b36;
}
.contactCard .btnGlassLight:hover{
  background:#eaf0fb;
}

.contactCard .btnEmail{
  border:1px solid rgba(10,18,34,.12);
  background:#eef3fb;
  color:#0f1b36;
}
.contactCard .btnEmail:hover{
  background:#e6edf9;
}

/* Mobile */
@media (max-width:700px){
  .bookingSplit{
    grid-template-columns:1fr;
  }

  .waActionButtons .btnBlue{
    width:100%;
    justify-content:center;
  }
}

#bookingFieldWrap[hidden],
#placeFieldWrap[hidden]{
  display:none !important;
}

/* ==========================
   Mappa nella colonna contatti
   ========================== */
.mapBox{
  overflow: hidden;
}

.mapIntro{
  margin: -2px 0 10px;
  color:#61708a;
  font-size:.95rem;
}

.mapEmbed{
  border-radius: 14px;
  overflow: hidden;
  border:1px solid rgba(12,25,52,.08);
  background:#eef3fb;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}

.mapEmbed iframe{
  display:block;
  width:100%;
  height:260px;
  border:0;
}

.mapLink{
  margin-top:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(10,18,34,.12);
  background:#f4f7fc;
  color:#0f1b36;
  font-weight:700;
  text-decoration:none;
  transition: background .18s ease, transform .18s ease;
}

.mapLink:hover{
  background:#eaf0fb;
  transform: translateY(-1px);
}

/* opzionale: la mappa occupa meglio lo spazio vuoto */
/* ==========================================
   NAVBAR con più voci (utile per tutte le pagine)
   ========================================== */
/* ==========================================
   Lavora con noi (pagina con form)
   ========================================== */
.joinLayout{
  padding: 26px 0 34px;
  display:grid;
  grid-template-columns: 1.35fr .85fr;
  gap:16px;
  align-items:start;
}

.joinCard{
  background:#fff;
  border:1px solid rgba(10,18,34,.08);
  border-radius:18px;
  box-shadow:0 18px 40px rgba(8,25,56,.08);
  padding:18px;
}

.joinNoteBox{
  margin-top:12px;
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(10,18,34,.08);
  background:#f8fbff;
}
.joinNoteBox strong{
  display:block;
  margin-bottom:4px;
  color:#0f1b36;
}
.joinNoteBox p{
  margin:0;
  color:#61708a;
  line-height:1.5;
}

.contactSide .sideBox.dark{
  background:linear-gradient(135deg, #0f1b36 0%, #132e66 100%);
  color:#fff;
  border:none;
}
.contactSide .sideBox.dark h3{
  color:#fff;
}
.contactSide .sideBox.dark p{
  color:rgba(255,255,255,.86);
}

/* ==========================================
   Documenti (pagina semplice con 1 articolo)
   ========================================== */
.docsSimpleSection{
  padding: 26px 0 34px;
  display:grid;
  gap:16px;
}

.docsSimpleHead{
  background:#fff;
  border:1px solid rgba(10,18,34,.08);
  border-radius:18px;
  box-shadow:0 14px 30px rgba(8,25,56,.06);
  padding:18px;
}
.docsSimpleHead h2{
  margin:0 0 8px;
  color:#0f1b36;
  font-size:clamp(1.4rem, 2.2vw, 2rem);
  line-height:1.08;
  letter-spacing:-.03em;
}
.docsSimpleHead p{
  margin:0;
  color:#60708b;
  line-height:1.55;
  max-width:72ch;
}

.articleDocCard{
  background:#fff;
  border:1px solid rgba(10,18,34,.08);
  border-radius:18px;
  box-shadow:0 18px 40px rgba(8,25,56,.08);
  padding:18px;
}

.articleDocTop{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:10px;
}

.docTypeBadge,
.docDateBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:800;
  line-height:1;
}

.docTypeBadge{
  background:#0f63ea;
  color:#fff;
}

.docDateBadge{
  background:#eef3fb;
  color:#0f1b36;
  border:1px solid rgba(10,18,34,.10);
}

.articleDocCard h3{
  margin:0 0 10px;
  color:#0f1b36;
  font-size:clamp(1.1rem, 1.5vw, 1.35rem);
}

.articleDocCard > p{
  margin:0 0 12px;
  color:#5f6f89;
  line-height:1.55;
}

.articleDocContent{
  border:1px solid rgba(10,18,34,.08);
  background:#f8fbff;
  border-radius:14px;
  padding:14px;
  display:grid;
  gap:10px;
}
.articleDocContent p{
  margin:0;
  color:#00183f;
  line-height:1.6;
}

.articleDocActions{
  margin-top:14px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.docTextLink{
  color:#eef4fd;
  background-color: #065ae0;
  border-radius: 18px;
  padding: 8px;
  font-weight:700;
  text-decoration:none;
}
.docTextLink:hover{
  text-decoration:underline;
}

/* ==========================================
   Bottoni riuso (se non già presenti / rinforzo)
   ========================================== */
/* ==========================================
   Responsive
   ========================================== */
@media (max-width: 980px){
  .joinLayout{
    grid-template-columns:1fr;
  }
}

/* ==========================
   Action buttons (riuso)
   ========================== */
.waActionButtons{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.btnEmailForm{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 16px;
  border-radius:999px;
  border:1px solid rgba(10,18,34,.12);
  background:#eef3fb;
  color:#0f1b36;
  font-weight:800;
  font-size:.92rem;
  line-height:1;
  cursor:pointer;
  text-decoration:none;
  transition: background .18s ease, transform .18s ease;
}

.btnEmailForm:hover{
  background:#e6edf9;
  transform: translateY(-1px);
}

/* ==========================
   Navbar mobile: una riga + scroll + fade
   (serve per l'hint JS)
   ========================== */
@media (max-width: 700px){
  .mainNav{
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 6px;
    padding-bottom: 6px;
    scrollbar-width: none;
    scroll-behavior: smooth;
    position: relative;

    /* fade per suggerire scroll */
    mask-image: linear-gradient(to right, transparent 0, black 16px, black calc(100% - 16px), transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0, black 16px, black calc(100% - 16px), transparent 100%);
  }

  .mainNav::-webkit-scrollbar{ display:none; }

  .mainNav a{
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 10px 12px;
    font-size: .82rem;
  }

  .waActionButtons{
    width:100%;
    flex-direction:column;
    align-items:stretch;
  }

  .waActionButtons .btnBlue,
  .waActionButtons .btnEmailForm{
    width:100%;
    justify-content:center;
  }
}

/* ==========================
   SCROLL PROGRESS BAR
   ========================== */
#scrollProgress{
  position:fixed;
  top:0;left:0;
  width:0%;
  height:3px;
  background:linear-gradient(90deg,#1670ff,#00c2ff,#1670ff);
  background-size:200% 100%;
  animation:progressShimmer 2s linear infinite;
  z-index:9999;
  transition:width .12s linear;
  pointer-events:none;
}
@keyframes progressShimmer{
  0%{background-position:200% 0}
  100%{background-position:0% 0}
}

/* ==========================
   SCROLL REVEAL
   ========================== */
.reveal{
  opacity:0;
  transform:translateY(32px);
  transition:opacity .65s cubic-bezier(.22,.61,.36,1), transform .65s cubic-bezier(.22,.61,.36,1);
}
.reveal.visible{
  opacity:1;
  transform:none;
}
.reveal-d1{ transition-delay:.08s }
.reveal-d2{ transition-delay:.18s }
.reveal-d3{ transition-delay:.28s }
.reveal-d4{ transition-delay:.38s }
.reveal-d5{ transition-delay:.48s }
.reveal-d6{ transition-delay:.58s }

/* ==========================
   WHATSAPP FLOAT BUTTON
   ========================== */
.waFloat{
  position:fixed;
  bottom:24px;right:24px;
  z-index:900;
}
.waFloat-ring{
  position:absolute;
  inset:-6px;
  border-radius:999px;
  background:rgba(37,211,102,.28);
  animation:waPulse 2.4s ease-out infinite;
  pointer-events:none;
}
@keyframes waPulse{
  0%{transform:scale(1);opacity:.8}
  100%{transform:scale(1.65);opacity:0}
}
.waFloat-btn{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  gap:9px;
  background:#25d366;
  color:#fff !important;
  padding:13px 18px 13px 15px;
  border-radius:999px;
  font-weight:800;
  font-size:.9rem;
  box-shadow:0 6px 28px rgba(37,211,102,.40);
  transition:transform .2s ease, box-shadow .2s ease;
  text-decoration:none !important;
  border:none;
  cursor:pointer;
  white-space:nowrap;
}
.waFloat-btn:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 36px rgba(37,211,102,.52);
}
.waFloat-btn svg{
  width:20px;height:20px;
  fill:#fff;
  flex-shrink:0;
}
@media(max-width:500px){
  .waFloat{
    bottom:16px;right:14px;
  }
  .waFloat-btn span{
    display:none;
  }
  .waFloat-btn{
    padding:14px;
  }
}

/* ==========================
   STATS SECTION
   ========================== */
.statsSection{
  background:linear-gradient(135deg,#031c4e 0%,#0a4ecf 100%);
  padding:54px 0;
  color:#fff;
  overflow:hidden;
  position:relative;
}
.statsSection::before{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(700px 300px at 80% 50%,rgba(255,255,255,.07),transparent 70%);
  pointer-events:none;
}
.statsGrid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  position:relative;
  z-index:1;
}
.statItem{
  text-align:center;
  padding:28px 16px;
  border-right:1px solid rgba(255,255,255,.14);
}
.statItem:last-child{border-right:none}
.statNum{
  display:block;
  font-size:clamp(2.4rem,4.5vw,3.2rem);
  font-weight:900;
  line-height:1;
  letter-spacing:-.05em;
}
.statLabel{
  display:block;
  margin-top:8px;
  font-size:.85rem;
  color:rgba(255,255,255,.72);
  letter-spacing:.03em;
}
@media(max-width:720px){
  .statsGrid{
    grid-template-columns:1fr 1fr;
  }
  .statItem:nth-child(2){border-right:none}
  .statItem:nth-child(1),
  .statItem:nth-child(2){
    border-bottom:1px solid rgba(255,255,255,.14);
  }
}
@media(max-width:420px){
  .statsGrid{
    grid-template-columns:1fr;
  }
  .statItem{
    border-right:none !important;
    border-bottom:1px solid rgba(255,255,255,.12);
  }
  .statItem:last-child{border-bottom:none}
}

/* ==========================
   LINGUE SECTION
   ========================== */
.langSection{
  background:#fff;
  padding:62px 0;
}
.langHead{
  text-align:center;
  margin-bottom:32px;
}
.langHead h2{
  margin:0 0 8px;
  font-size:clamp(1.5rem,2.4vw,2.1rem);
  letter-spacing:-.03em;
}
.langHead p{
  margin:0 auto;
  max-width:64ch;
  color:#5d687a;
  line-height:1.5;
}
.langGrid{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
}
.langPill{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 16px;
  border-radius:999px;
  font-size:.88rem;
  font-weight:700;
  border:1.5px solid transparent;
  transition:transform .18s ease, box-shadow .18s ease;
  cursor:default;
  user-select:none;
}
.langPill:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 20px rgba(0,0,0,.10);
}
.lp-blue  {background:#eef4ff;border-color:#c0d6ff;color:#1046a0}
.lp-green {background:#edfaf4;border-color:#b2e8d0;color:#1a7a50}
.lp-orange{background:#fff4eb;border-color:#ffd3a8;color:#9a4a0a}
.lp-purple{background:#f4efff;border-color:#d4c0ff;color:#5a2ea0}
.lp-red   {background:#fff0f0;border-color:#ffc0c0;color:#9a1a1a}
.lp-teal  {background:#edfcfc;border-color:#b0e8e8;color:#1a7272}
.lp-yellow{background:#fffbeb;border-color:#ffe8a0;color:#7a5a00}
.langNote{
  text-align:center;
  margin-top:22px;
  color:#8898b0;
  font-size:.84rem;
}

/* ==========================
   COME FUNZIONA
   ========================== */
.howSection{
  background:#eef2f8;
  padding:62px 0;
}
.howHead{
  text-align:center;
  margin-bottom:36px;
}
.howHead h2{
  margin:0 0 8px;
  font-size:clamp(1.5rem,2.4vw,2.1rem);
  letter-spacing:-.03em;
}
.howHead p{
  margin:0 auto;
  max-width:60ch;
  color:#5d687a;
  line-height:1.5;
}
.howSteps{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  position:relative;
}
.howConnector{
  display:none;
}
@media(min-width:700px){
  .howConnector{
    display:block;
    position:absolute;
    top:40px;
    left:calc(33.33% + 14px);
    right:calc(33.33% + 14px);
    height:2px;
    background:linear-gradient(90deg,#1670ff,#00c2ff,#1670ff);
    background-size:200% 100%;
    animation:progressShimmer 3s linear infinite;
    z-index:0;
  }
}
.howStep{
  background:#fff;
  border-radius:18px;
  padding:28px 22px 24px;
  border:1px solid rgba(10,18,34,.08);
  box-shadow:0 16px 40px rgba(8,25,56,.09);
  text-align:center;
  position:relative;
  z-index:1;
  transition:transform .22s ease, box-shadow .22s ease;
}
.howStep:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 56px rgba(8,25,56,.14);
}
.howNum{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:56px;height:56px;
  border-radius:50%;
  background:var(--blue-600);
  color:#fff;
  font-size:1.25rem;
  font-weight:900;
  margin-bottom:16px;
  box-shadow:0 8px 24px rgba(22,112,255,.38);
}
.howStep h4{
  margin:0 0 8px;
  font-size:1.05rem;
  letter-spacing:-.02em;
  color:#0f1b36;
}
.howStep p{
  margin:0;
  color:#5d6c83;
  font-size:.9rem;
  line-height:1.55;
}
@media(max-width:700px){
  .howSteps{
    grid-template-columns:1fr;
  }
}

/* ==========================
   Responsive nuove sezioni
   ========================== */
@media(max-width:640px){
  .langSection,
  .howSection{
    padding:44px 0;
  }
  .statsSection{
    padding:38px 0;
  }
}

/* ==========================
   FORMSPREE — stati form
   ========================== */
.fsMsgSuccess,
.fsMsgError{
  border-radius:12px;
  padding:14px 18px;
  font-size:.92rem;
  font-weight:600;
  line-height:1.5;
  margin-bottom:16px;
}
.fsMsgSuccess{
  background:#edfaf4;
  border:1.5px solid #b2e8d0;
  color:#1a6b44;
}
.fsMsgError{
  background:#fff3f3;
  border:1.5px solid #ffc0c0;
  color:#921a1a;
}
.fsFieldErr{
  display:block;
  color:#c0392b;
  font-size:.80rem;
  margin-top:4px;
  min-height:1.1em;
}
.waForm input[aria-invalid="true"],
.waForm select[aria-invalid="true"],
.waForm textarea[aria-invalid="true"]{
  border-color:rgba(192,57,43,.40) !important;
  box-shadow:0 0 0 3px rgba(192,57,43,.08) !important;
}
[data-fs-submit-btn]:disabled{
  opacity:.58;
  cursor:not-allowed;
  transform:none !important;
  pointer-events:none;
}

/* ==========================
   SITE FOOTER — redesign
   ========================== */
.siteFooter{
  background:linear-gradient(180deg,#020e28 0%,#031438 100%);
  color:#fff;
}

.footerTop{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1.15fr;
  gap:48px;
  padding:60px 0 48px;
}

/* Brand col */
.ftLogo{
  display:inline-flex;
  align-items:center;
  gap:11px;
  margin-bottom:18px;
  text-decoration:none;
}
.ftLogo img{
  width:46px;height:46px;
  border-radius:50%;
  object-fit:cover;
  object-position:center;
  transform:scale(1.12);
  border:2px solid rgba(255,255,255,.16);
  flex-shrink:0;
}
.ftLogo-text strong{
  display:block;
  color:#fff;
  font-size:.96rem;
  letter-spacing:-.02em;
  line-height:1.1;
}
.ftLogo-text span{
  display:block;
  color:rgba(255,255,255,.52);
  font-size:.78rem;
}

.ftDesc{
  margin:0 0 18px;
  color:rgba(255,255,255,.60);
  font-size:.88rem;
  line-height:1.68;
  max-width:32ch;
}

.ftEmailLink{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:rgba(255,255,255,.78);
  font-size:.88rem;
  font-weight:600;
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.20);
  padding-bottom:2px;
  transition:color .18s,border-color .18s;
}
.ftEmailLink:hover{
  color:#fff;
  border-color:rgba(255,255,255,.50);
}

/* Column titles */
.ftTitle{
  margin:0 0 16px;
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.40);
}

/* Nav links */
.ftNav{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.ftNav a{
  color:rgba(255,255,255,.72);
  font-size:.9rem;
  padding:5px 0;
  text-decoration:none;
  transition:color .18s,padding-left .2s;
  display:block;
}
.ftNav a:hover{
  color:#fff;
  padding-left:5px;
}

/* Address */
.ftAddress{
  font-style:normal;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.ftAddressLine{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:.9rem;
  color:rgba(255,255,255,.64);
}
.ftAddressLine-icon{
  font-size:.95rem;
  flex-shrink:0;
  line-height:1.5;
}
.ftAddressLine a{
  display:block;
  color:rgba(255,255,255,.80);
  text-decoration:none;
  line-height:1.8;
  transition:color .18s;
}
.ftAddressLine a:hover{
  color:#fff;
}
.ftAddressLine span{
  line-height:1.6;
}

/* Divider */
.footerDivider{
  height:1px;
  background:rgba(255,255,255,.09);
}

/* Bottom bar */
.footerBottom2{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:20px 0;
  flex-wrap:wrap;
  color:rgba(255,255,255,.42);
  font-size:.84rem;
}
.ftBottomLinks{
  display:flex;
  gap:20px;
  flex-wrap:wrap;
}
.ftBottomLinks a{
  color:rgba(255,255,255,.52);
  text-decoration:none;
  font-size:.84rem;
  transition:color .18s;
}
.ftBottomLinks a:hover{
  color:#fff;
}

/* ---- Responsive ---- */
@media(max-width:1024px){
  .footerTop{
    grid-template-columns:1fr 1fr;
    gap:32px 40px;
  }
  .ftCol-brand{
    grid-column:1 / -1;
  }
  .ftDesc{
    max-width:55ch;
  }
}

@media(max-width:580px){
  .footerTop{
    grid-template-columns:1fr;
    padding:40px 0 32px;
    gap:28px;
  }
  .ftCol-brand{
    grid-column:auto;
  }
  .ftDesc{
    max-width:100%;
  }
  .footerBottom2{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
    padding:16px 0;
  }
  .ftBottomLinks{
    gap:14px;
  }
}

/* ============================================
   PREMIUM REDESIGN — Global Overrides
   ============================================ */

/* --- Root refinements --- */
:root{
  --shadow-sm: 0 1px 3px rgba(0,0,0,.04), 0 6px 16px rgba(8,25,56,.07);
  --shadow-md: 0 2px 8px rgba(0,0,0,.04), 0 16px 40px rgba(8,25,56,.09);
  --shadow-lg: 0 4px 16px rgba(0,0,0,.05), 0 28px 64px rgba(8,25,56,.12);
  --radius:22px;
}

/* --- Sections --- */
.section{ padding:92px 0; }

/* --- Hero --- */
.heroTop{ min-height:580px; }
.heroTop-small{ min-height:370px; }
.heroCenter{ padding:84px 0 108px; }
.heroCenter h1{
  font-size:clamp(2.3rem,5.2vw,3.9rem);
  font-weight:800;
  letter-spacing:-.045em;
  line-height:1.04;
}
.heroSub{
  font-size:1.06rem;
  max-width:54ch;
  margin-top:14px;
  color:rgba(255,255,255,.86);
  line-height:1.65;
}
.heroBtns{ margin-top:26px; }

/* --- Floating service tabs --- */
.floatingServicesWrap{ margin-top:-54px; }
.floatingServices{ border-radius:18px; }
.fsItem{ padding:22px 18px; min-height:104px; }
.fsItem strong{ font-size:.9rem; font-weight:700; }
.fsItem small{ font-size:.78rem; }

/* --- Section headings --- */
.sectionHead h2{
  font-size:clamp(1.9rem,3.2vw,2.55rem);
  font-weight:800;
  letter-spacing:-.035em;
  line-height:1.1;
}
.sectionEyebrow{ font-size:.78rem; letter-spacing:.14em; }
.darkHead h2{
  font-size:clamp(1.9rem,3.2vw,2.55rem);
  font-weight:800;
  letter-spacing:-.035em;
}

/* --- Why section --- */
.whyGrid{ margin-top:44px; gap:38px; }
.whyImageCard{ border-radius:20px; padding:14px; box-shadow:var(--shadow-md); }
.whyImageCard img{ border-radius:12px; height:370px; }
.whyText p{ font-size:1rem; line-height:1.7; color:#4a5870; }
.whyPoints{ gap:12px; margin-top:12px; }
.whyPoint{
  border-radius:14px;
  padding:14px 16px;
  border:1.5px solid rgba(22,112,255,.12);
  background:linear-gradient(135deg,#f8fbff,#fff);
  box-shadow:var(--shadow-sm);
}
.whyPoint strong{ font-size:.95rem; color:#0f1b36; font-weight:700; }
.whyPoint span{ font-size:.88rem; color:#5a6a80; }

/* --- Feature row --- */
.featureRow{ gap:16px; }
.featureLead{
  border-radius:20px;
  padding:28px 26px;
  box-shadow:var(--shadow-md);
}
.featureLead h3{
  font-size:1.48rem;
  font-weight:800;
  letter-spacing:-.025em;
}
.featureLead p{ color:#5a6a80; font-size:.95rem; line-height:1.65; }
.miniFeature{ border-radius:20px; box-shadow:var(--shadow-md); }
.miniFeature img{ height:190px; }
.miniFeature div{ padding:16px 18px; }
.miniFeature strong{ font-size:.95rem; font-weight:700; color:#0f1b36; }
.miniFeature span{ font-size:.88rem; color:#5a6a80; }

/* --- Dark service cards --- */
.darkServiceGrid{ gap:16px; }
.darkServiceCard{
  padding:24px 22px;
  min-height:178px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  transition:background .22s ease, border-color .22s ease, transform .22s ease;
}
.darkServiceCard:hover{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.22);
  transform:translateY(-2px);
}
.darkServiceCard h4{ font-size:1.02rem; font-weight:700; margin:0 0 8px; }
.darkServiceCard p{ font-size:.89rem; line-height:1.6; color:rgba(255,255,255,.68); }
.dIcon{ width:38px; height:38px; border-radius:10px; margin-bottom:12px; font-size:1rem; }

/* --- Stats --- */
.statsSection{ padding:76px 0; }
.statNum{
  font-size:clamp(3rem,5.5vw,3.9rem);
  font-weight:900;
  letter-spacing:-.06em;
}
.statLabel{ font-size:.88rem; letter-spacing:.03em; margin-top:10px; }
.statItem{ padding:32px 20px; }

/* --- Language pills --- */
.langSection{ padding:92px 0; }
.langHead h2{
  font-size:clamp(1.8rem,3vw,2.5rem);
  font-weight:800;
  letter-spacing:-.03em;
}
.langPill{ padding:10px 18px; font-size:.9rem; font-weight:700; }

/* --- How section --- */
.howSection{ padding:92px 0; }
.howHead h2{
  font-size:clamp(1.8rem,3vw,2.5rem);
  font-weight:800;
  letter-spacing:-.03em;
}
.howStep{
  padding:38px 30px;
  border-radius:22px;
  box-shadow:var(--shadow-md);
}
.howNum{
  width:60px; height:60px;
  font-size:1.3rem;
  margin-bottom:20px;
  box-shadow:0 6px 20px rgba(22,112,255,.35);
}
.howStep h4{ font-size:1.1rem; font-weight:800; margin-bottom:10px; letter-spacing:-.02em; }
.howStep p{ font-size:.92rem; line-height:1.65; color:#5d6c83; }

/* --- Buttons --- */
.btnBlue,.btnWhite,.btnGhost{
  padding:13px 24px;
  font-size:.95rem;
  font-weight:700;
  letter-spacing:.01em;
}
.btnBlue{
  box-shadow:0 2px 8px rgba(22,112,255,.22), 0 6px 22px rgba(22,112,255,.14);
}
.btnBlue:hover{
  background:#0f63ea;
  box-shadow:0 4px 14px rgba(22,112,255,.32), 0 10px 32px rgba(22,112,255,.18);
  transform:translateY(-2px);
}
.btnEmailForm{
  padding:13px 24px;
  font-size:.95rem;
  font-weight:700;
  border-radius:999px;
}

/* --- Form inputs --- */
.waForm{ gap:18px; }
.waForm label{ gap:8px; }
.waForm label span{
  font-size:.84rem;
  font-weight:700;
  color:#2d3852;
  letter-spacing:.015em;
}
.waForm input,
.waForm select,
.waForm textarea{
  border-radius:12px;
  padding:13px 15px;
  border:1.5px solid rgba(12,25,52,.10);
  font-size:.94rem;
  background:#fafbff;
  transition:border-color .22s,box-shadow .22s,background .22s;
  font-family:inherit;
}
.waForm input:hover,
.waForm select:hover,
.waForm textarea:hover{
  border-color:rgba(22,112,255,.22);
  background:#fff;
}
.waForm input:focus,
.waForm select:focus,
.waForm textarea:focus{
  border-color:rgba(22,112,255,.40);
  box-shadow:0 0 0 4px rgba(22,112,255,.09);
  background:#fff;
}
.waRow{ gap:14px; }

/* waActions layout */
.waActions{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:12px;
  margin-top:6px;
}
.waActionButtons{ gap:12px; flex-wrap:wrap; }
.waActions small{
  color:#8898b2;
  font-size:.82rem;
  line-height:1.55;
}

/* --- Cards (contact, join, service) --- */
.contactCard{
  border-radius:24px;
  padding:30px 32px;
  box-shadow:var(--shadow-md);
}
.contactHead h2{
  font-size:1.45rem;
  font-weight:800;
  letter-spacing:-.025em;
  margin-bottom:6px;
}
.contactHead p{ color:#5a6a80; line-height:1.6; font-size:.94rem; }

.sideBox{
  border-radius:18px;
  padding:20px 22px;
  box-shadow:var(--shadow-sm);
}
.sideBox h3{
  font-size:1rem;
  font-weight:700;
  letter-spacing:-.01em;
  margin-bottom:12px;
}

.joinCard{
  border-radius:24px;
  padding:30px 32px;
  box-shadow:var(--shadow-md);
}

/* --- Service page cards --- */
.serviceCardVisual{ border-radius:22px; box-shadow:var(--shadow-md); }
.serviceCardVisual-img{ min-height:240px; }
.serviceCardVisual-body{ padding:26px; }
.serviceCardVisual-body h2{
  font-size:1.32rem;
  font-weight:800;
  letter-spacing:-.025em;
  margin-bottom:10px;
}
.serviceCardVisual-body p{ font-size:.93rem; line-height:1.65; }
.serviceCardVisual-body li{ font-size:.9rem; margin:6px 0; }
.badge{
  border-radius:999px;
  font-size:.78rem;
  font-weight:700;
  padding:7px 13px;
  letter-spacing:.02em;
}

/* Quote hero card */
.quoteHeroCard{ border-radius:24px; }
.quoteHeroGlass{ border-radius:20px; padding:26px; margin-top:56px; }
.quoteHeroGlass h2{
  font-size:clamp(1.4rem,2.6vw,2.1rem);
  font-weight:800;
  letter-spacing:-.03em;
}

/* --- Leaflet map --- */
#leaflet-map{
  height:260px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(12,25,52,.08);
  box-shadow:var(--shadow-sm);
}
.leaflet-popup-content-wrapper{
  border-radius:12px !important;
  font-family:'Plus Jakarta Sans',sans-serif !important;
  font-size:.88rem !important;
  box-shadow:var(--shadow-md) !important;
}
.leaflet-popup-tip{ display:none; }

/* --- Job submit button (lavora-con-noi solo email) --- */
.btnJobSubmit{
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:var(--blue-600);
  color:#fff;
  border:none;
  border-radius:999px;
  padding:15px 32px;
  font-family:inherit;
  font-size:1rem;
  font-weight:800;
  cursor:pointer;
  letter-spacing:.01em;
  box-shadow:0 4px 16px rgba(22,112,255,.28),0 10px 32px rgba(22,112,255,.16);
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease;
}
.btnJobSubmit:hover{
  background:#0f63ea;
  transform:translateY(-2px);
  box-shadow:0 6px 22px rgba(22,112,255,.36),0 14px 42px rgba(22,112,255,.22);
}
.btnJobSubmit:disabled{
  opacity:.58;
  cursor:not-allowed;
  transform:none !important;
  pointer-events:none;
}
.btnJobSubmit svg{
  width:18px; height:18px;
  fill:#fff;
  flex-shrink:0;
}

/* --- Job sidebar improvements --- */
.joinSideInfo{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.joinRolePill{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 14px;
  border-radius:999px;
  font-size:.84rem;
  font-weight:600;
  background:#eef4ff;
  border:1.5px solid #c4d8ff;
  color:#1046a0;
}
.joinValuesGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:6px;
}
.joinValueItem{
  background:#f8fbff;
  border:1px solid rgba(22,112,255,.10);
  border-radius:12px;
  padding:10px 12px;
  font-size:.84rem;
  font-weight:600;
  color:#1a2f5e;
  text-align:center;
}

/* --- Prevent layout shift on reveal --- */
.reveal{ will-change:opacity,transform; }

/* --- Responsive premium fixes --- */
@media(max-width:1024px){
  .contactCard,.joinCard{ padding:24px; }
}
@media(max-width:700px){
  .section{ padding:64px 0; }
  .howSection,.langSection,.statsSection{ padding:56px 0; }
  .howStep{ padding:28px 22px; }
  .contactCard,.joinCard{ padding:20px 18px; }
  .featureLead{ padding:20px; }
  .waForm input,
  .waForm select,
  .waForm textarea{ font-size:.93rem; }
  .btnJobSubmit{ width:100%; justify-content:center; }
  .joinValuesGrid{ grid-template-columns:1fr; }
}

/* ============================================
   FORM CONFIRMATION OVERLAY
   ============================================ */
.confirmOverlay{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(3,15,45,.52);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  opacity:0;
  pointer-events:none;
  transition:opacity .38s ease;
}
.confirmOverlay.active{
  opacity:1;
  pointer-events:all;
}
.confirmBox{
  background:#fff;
  border-radius:26px;
  padding:44px 52px;
  text-align:center;
  max-width:440px;
  width:calc(100% - 48px);
  box-shadow:0 30px 90px rgba(5,18,50,.25), 0 8px 24px rgba(0,0,0,.10);
  border:1px solid rgba(10,25,60,.06);
  transform:translateY(28px) scale(.95);
  transition:transform .38s cubic-bezier(.22,.61,.36,1);
}
.confirmOverlay.active .confirmBox{
  transform:translateY(0) scale(1);
}
.confirmBox-img{
  width:80px;
  height:80px;
  margin:0 auto 20px;
  display:block;
}
.confirmBox h3{
  margin:0 0 10px;
  font-size:1.42rem;
  font-weight:800;
  letter-spacing:-.03em;
  color:#0f1b36;
  line-height:1.15;
}
.confirmBox p{
  margin:0;
  color:#5a6a80;
  line-height:1.65;
  font-size:.95rem;
}
.confirmBox-close{
  margin-top:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 28px;
  border-radius:999px;
  background:var(--blue-600);
  color:#fff;
  font-weight:700;
  font-size:.9rem;
  cursor:pointer;
  border:none;
  font-family:inherit;
  transition:background .18s, transform .18s;
}
.confirmBox-close:hover{
  background:#0f63ea;
  transform:translateY(-1px);
}
@media(max-width:500px){
  .confirmBox{ padding:32px 24px; }
}

/* ============================================
   WHY HOVER CARDS — Perché scegliere noi
   ============================================ */
.whyCardsGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:48px;
}
.whyHoverCard{
  position:relative;
  border-radius:22px;
  overflow:hidden;
  min-height:400px;
  cursor:default;
  box-shadow:0 12px 40px rgba(8,25,56,.14), 0 2px 8px rgba(0,0,0,.06);
  transition:box-shadow .4s ease, transform .4s ease;
}
.whyHoverCard:hover{
  box-shadow:0 24px 64px rgba(8,25,56,.22), 0 4px 16px rgba(0,0,0,.10);
  transform:translateY(-6px);
}
.whyHoverCard-bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  transform:scale(1.05);
  transition:transform .7s cubic-bezier(.22,.61,.36,1);
}
.whyHoverCard:hover .whyHoverCard-bg{
  transform:scale(1.13);
}
.whyHoverCard-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(0deg, rgba(2,18,58,.96) 0%, rgba(2,18,58,.62) 45%, rgba(2,18,58,.22) 100%);
  transition:background .4s ease;
}
.whyHoverCard:hover .whyHoverCard-overlay{
  background:linear-gradient(0deg, rgba(2,18,58,.97) 0%, rgba(2,18,58,.82) 58%, rgba(2,18,58,.44) 100%);
}
.whyHoverCard-content{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:30px 26px;
  color:#fff;
}
.whyHoverCard-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:rgba(22,112,255,.72);
  border:1.5px solid rgba(22,112,255,.55);
  font-size:.84rem;
  font-weight:900;
  color:#fff;
  margin-bottom:12px;
  opacity:0;
  transform:translateY(-10px);
  transition:opacity .38s ease .05s, transform .38s ease .05s;
}
.whyHoverCard:hover .whyHoverCard-num{
  opacity:1;
  transform:translateY(0);
}
.whyHoverCard-title{
  font-size:1.22rem;
  font-weight:800;
  letter-spacing:-.025em;
  margin:0 0 6px;
  line-height:1.18;
  transition:transform .38s ease;
}
.whyHoverCard:hover .whyHoverCard-title{
  transform:translateY(-4px);
}
.whyHoverCard-tagline{
  font-size:.86rem;
  font-weight:600;
  color:rgba(255,255,255,.62);
  margin:0;
  letter-spacing:.01em;
  transition:opacity .28s ease, transform .28s ease;
}
.whyHoverCard:hover .whyHoverCard-tagline{
  opacity:0;
  transform:translateY(8px);
}
.whyHoverCard-desc{
  font-size:.9rem;
  color:rgba(255,255,255,.88);
  line-height:1.65;
  margin:0;
  max-height:0;
  overflow:hidden;
  opacity:0;
  transform:translateY(14px);
  transition:opacity .34s ease .1s, transform .34s ease .1s, max-height .4s ease .05s;
}
.whyHoverCard:hover .whyHoverCard-desc{
  opacity:1;
  max-height:160px;
  transform:translateY(0);
}
.whyHoverCard-cta{
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin-top:14px;
  font-size:.82rem;
  font-weight:700;
  color:rgba(255,255,255,.62);
  opacity:0;
  transform:translateY(10px);
  transition:opacity .3s ease .18s, transform .3s ease .18s;
  text-decoration:none;
}
.whyHoverCard:hover .whyHoverCard-cta{
  opacity:1;
  transform:translateY(0);
}
.whyHoverCard-cta img{
  width:12px;
  height:12px;
  filter:invert(1);
  opacity:.65;
  transition:transform .2s ease;
}
.whyHoverCard:hover .whyHoverCard-cta img{
  transform:translateX(2px);
}
/* Touch devices: always show content */
@media(hover:none){
  .whyHoverCard-num,
  .whyHoverCard-cta{ opacity:1; transform:translateY(0); }
  .whyHoverCard-desc{ opacity:1; max-height:200px; transform:translateY(0); }
  .whyHoverCard-tagline{ opacity:0; }
}
@media(max-width:900px){
  .whyCardsGrid{ grid-template-columns:1fr 1fr; }
  .whyHoverCard{ min-height:340px; }
}
@media(max-width:580px){
  .whyCardsGrid{
    grid-template-columns:1fr;
    max-width:440px;
    margin-left:auto;
    margin-right:auto;
  }
  .whyHoverCard{ min-height:290px; }
}

/* ============================================
   MAP CARD — Full card redesign
   ============================================ */
.mapCardFull{
  position:relative;
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 16px 50px rgba(8,25,56,.16);
}
.mapCardFull #leaflet-map{
  height:400px;
  border-radius:0;
  border:none;
  box-shadow:none;
  position:relative;
  z-index:1;
  display:block;
}
/* Always-visible label top-left */
.mapCardLabel{
  position:absolute;
  top:14px;
  left:14px;
  z-index:3;
  background:#fff;
  border-radius:14px;
  padding:10px 14px;
  box-shadow:0 4px 18px rgba(8,25,56,.18);
  display:flex;
  align-items:center;
  gap:9px;
  max-width:220px;
  pointer-events:none;
}
.mapCardLabel .loc-icon{
  width:18px;
  height:18px;
  flex-shrink:0;
  opacity:.85;
}
.mapCardLabel-text strong{
  display:block;
  font-size:.86rem;
  font-weight:800;
  color:#0f1b36;
  line-height:1.2;
}
.mapCardLabel-text span{
  display:block;
  font-size:.78rem;
  color:#5a6a80;
  line-height:1.35;
  margin-top:1px;
}
/* Google Maps button — bottom-right, always visible */
.mapCardBtn{
  position:absolute;
  bottom:14px;
  right:14px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:9px 15px;
  border-radius:999px;
  background:#fff;
  color:#0f1b36;
  font-weight:700;
  font-size:.82rem;
  text-decoration:none;
  box-shadow:0 4px 18px rgba(8,25,56,.16);
  transition:transform .22s ease, box-shadow .22s ease, color .18s;
  white-space:nowrap;
}
.mapCardBtn:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 28px rgba(8,25,56,.22);
  color:#1670ff;
}
.mapCardBtn .arrow-icon{
  width:13px;
  height:13px;
  opacity:.55;
  transition:transform .2s ease, opacity .2s ease;
}
.mapCardBtn:hover .arrow-icon{
  transform:translateX(2px);
  opacity:.9;
}
/* Hover info strip at bottom */
.mapCardInfoStrip{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  z-index:2;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-top:1px solid rgba(12,25,52,.06);
  padding:13px 18px;
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  transform:translateY(100%);
  transition:transform .32s cubic-bezier(.22,.61,.36,1);
}
.mapCardFull:hover .mapCardInfoStrip{
  transform:translateY(0);
}
.mapInfoItem{
  display:flex;
  align-items:center;
  gap:7px;
  font-size:.84rem;
  color:#3a4a62;
  flex-shrink:0;
}
.mapInfoItem img{
  width:16px;
  height:16px;
  opacity:.72;
  flex-shrink:0;
}
.mapInfoItem a{
  color:#1670ff;
  font-weight:600;
  text-decoration:none;
}
.mapInfoItem a:hover{ text-decoration:underline; }
.mapInfoDivider{
  width:1px;
  height:18px;
  background:rgba(12,25,52,.10);
  flex-shrink:0;
}
@media(max-width:640px){
  .mapCardFull #leaflet-map{ height:300px; }
  .mapCardInfoStrip{ flex-wrap:wrap; gap:10px; padding:11px 13px; }
  .mapInfoDivider{ display:none; }
}

/* ============================================
   SIDEBAR CONTACT ICONS
   ============================================ */
.sideLine-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:10px;
  background:#eef4ff;
  border:1px solid rgba(22,112,255,.12);
  flex-shrink:0;
}
.sideLine-icon img{
  width:18px;
  height:18px;
  display:block;
}
.sideLine{ align-items:center; }
.sideLine-val{
  color:#0f1b36;
  font-weight:700;
  text-decoration:none;
  font-size:.94rem;
}
.sideLine-val-blue{
  color:#1670ff;
  font-weight:600;
  text-decoration:none;
  font-size:.9rem;
}
.sideLine-val:hover{ color:#1670ff; }
.sideLine-val-blue:hover{ text-decoration:underline; }

/* ============================================
   FLOATING PAGE NAVIGATION
   ============================================ */
.floatNav{
  position:fixed;
  bottom:28px;
  left:50%;
  transform:translateX(-50%) translateY(90px);
  z-index:800;
  opacity:0;
  transition:transform .42s cubic-bezier(.22,.61,.36,1), opacity .42s ease;
  pointer-events:none;
  white-space:nowrap;
}
.floatNav.visible{
  transform:translateX(-50%) translateY(0);
  opacity:1;
  pointer-events:all;
}
.floatNavPill{
  display:inline-flex;
  align-items:stretch;
  background:rgba(3,16,48,.90);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 8px 40px rgba(0,0,0,.30), 0 2px 8px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
  height:52px;
}
.floatNavBrand{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:0 16px 0 14px;
  border-right:1px solid rgba(255,255,255,.10);
  text-decoration:none;
}
.floatNavBrand img{
  width:28px;
  height:28px;
  border-radius:50%;
  object-fit:cover;
  object-position:center;
  flex-shrink:0;
  border:1px solid rgba(255,255,255,.18);
}
.floatNavBrand-label{
  font-size:.82rem;
  font-weight:700;
  color:rgba(255,255,255,.88);
}
.floatNavItem{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 15px;
  height:100%;
  color:rgba(255,255,255,.70);
  font-size:.80rem;
  font-weight:600;
  text-decoration:none;
  border-right:1px solid rgba(255,255,255,.08);
  transition:color .18s, background .18s;
}
.floatNavItem:last-child{ border-right:none; }
.floatNavItem:hover{
  color:#fff;
  background:rgba(255,255,255,.07);
}
.floatNavItem.fn-active{
  color:#fff;
  background:rgba(22,112,255,.24);
}
.floatNavItem svg{
  width:14px;
  height:14px;
  fill:currentColor;
  flex-shrink:0;
}
.floatNavItem-label{ white-space:nowrap; }
@media(max-width:700px){
  .floatNav{
    bottom:18px;
    left:14px;
    right:72px; /* leave room for WhatsApp float button */
    transform:translateY(90px);
    width:auto;
  }
  .floatNav.visible{ transform:translateY(0); }
  .floatNavPill{
    width:100%;
    height:48px;
    justify-content:space-around;
  }
  .floatNavBrand{ padding:0 10px; }
  .floatNavBrand-label{ display:none; }
  .floatNavItem{ padding:0 10px; flex:1; font-size:.72rem; }
  .floatNavItem-label{ display:none; }
}
@media(max-width:380px){
  .floatNavBrand{ display:none; }
}

/* ============================================
   Premium custom inputs: modalita + date/time
   ============================================ */
#form-preventivo{
  --form-font:'Sora', 'Plus Jakarta Sans', Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

#form-preventivo,
#form-preventivo input,
#form-preventivo textarea,
#form-preventivo button,
#form-preventivo .modeCard,
#form-preventivo .dtTrigger,
#form-preventivo .dtPanel{
  font-family:var(--form-font);
}

#form-preventivo .waRow{
  align-items:start;
}

#form-preventivo .waRow > *{
  min-width:0;
}

#form-preventivo label,
#form-preventivo .modeField{
  align-content:start;
}

#form-preventivo input,
#form-preventivo .dtTrigger{
  min-height:62px;
}

#form-preventivo textarea{
  min-height:144px;
}

.contactCard .contactHead h2{
  letter-spacing:-.03em;
}

.contactCard .contactHead p{
  max-width:58ch;
}

.modeField{
  display:grid;
  gap:7px;
}

.modePicker{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.modeRadio{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  border:0;
  overflow:hidden;
  clip-path:inset(50%);
  clip:rect(0 0 0 0);
  white-space:nowrap;
}

.waForm .modeRadio{
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

.modeCard{
  position:relative;
  display:grid;
  gap:4px;
  padding:14px 14px 13px;
  min-height:120px;
  align-content:start;
  border-radius:14px;
  border:1.5px solid rgba(9,32,74,.12);
  background:
    linear-gradient(140deg, rgba(255,255,255,.92), rgba(240,247,255,.92));
  box-shadow:0 8px 24px rgba(9,32,74,.08);
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.modeCard strong{
  font-size:.92rem;
  letter-spacing:-.01em;
  color:#0f264f;
}

.modeCard small{
  color:#5e6f89;
  font-size:.79rem;
  line-height:1.45;
}

.modeCard:hover{
  transform:translateY(-1px);
  border-color:rgba(22,112,255,.35);
  box-shadow:0 10px 26px rgba(10,44,106,.14);
}

.modeRadio:focus-visible + .modeCard{
  box-shadow:0 0 0 4px rgba(22,112,255,.12), 0 10px 26px rgba(10,44,106,.14);
  border-color:rgba(22,112,255,.45);
}

.modeRadio:checked + .modeCard{
  border-color:rgba(22,112,255,.72);
  background:
    radial-gradient(circle at 95% 15%, rgba(22,112,255,.25), transparent 42%),
    linear-gradient(135deg, rgba(13,79,212,.15), rgba(232,242,255,.95));
  box-shadow:0 12px 28px rgba(22,112,255,.25), inset 0 0 0 1px rgba(255,255,255,.55);
}

.modeRadio:checked + .modeCard strong{
  color:#08367f;
}

.modePicker.is-invalid .modeCard{
  border-color:rgba(192,57,43,.38);
}

.dateTimeField{
  width:100%;
}

#bookingFieldWrap{
  grid-template-columns:1fr;
}

#bookingFieldWrap .fieldHint{
  margin:3px 0 0;
  color:#647792;
  font-size:.79rem;
  line-height:1.45;
}

.dateTimePickerHost{
  width:100%;
}

.nativeDateFallback-hidden{
  display:none !important;
}

.dateTimePicker{
  position:relative;
}

.dtTrigger{
  width:100%;
  display:grid;
  gap:6px;
  text-align:left;
  position:relative;
  overflow:hidden;
  border:1.5px solid rgba(9,32,74,.12);
  border-radius:14px;
  background:
    radial-gradient(circle at 94% 8%, rgba(22,112,255,.24), transparent 38%),
    linear-gradient(145deg, rgba(255,255,255,.84), rgba(238,246,255,.74));
  padding:13px 14px;
  color:#0f264f;
  cursor:pointer;
  backdrop-filter:blur(16px) saturate(135%);
  -webkit-backdrop-filter:blur(16px) saturate(135%);
  box-shadow:0 12px 26px rgba(8,34,82,.10), inset 0 1px 0 rgba(255,255,255,.62);
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.dtTrigger::after{
  content:"";
  position:absolute;
  top:-60%;
  left:-10%;
  width:70%;
  height:180%;
  background:linear-gradient(120deg, rgba(255,255,255,.45), rgba(255,255,255,0));
  transform:rotate(14deg);
  pointer-events:none;
}

.dtTrigger:hover{
  border-color:rgba(22,112,255,.33);
  transform:translateY(-1px);
}

.dtTrigger:focus-visible{
  outline:none;
  border-color:rgba(22,112,255,.45);
  box-shadow:0 0 0 4px rgba(22,112,255,.11);
}

.dtTriggerLabel{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  padding:4px 12px;
  border-radius:999px;
  background:linear-gradient(145deg, rgba(255,255,255,.74), rgba(238,247,255,.58));
  border:1px solid rgba(255,255,255,.62);
  color:#153b73;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
  line-height:1;
  backdrop-filter:blur(10px) saturate(135%);
  -webkit-backdrop-filter:blur(10px) saturate(135%);
  box-shadow:0 6px 14px rgba(15,45,96,.16), inset 0 1px 0 rgba(255,255,255,.7);
}

.dtTriggerValue{
  display:grid;
  grid-template-columns:minmax(220px, 1.35fr) repeat(2, minmax(120px, .82fr));
  align-items:stretch;
  gap:8px;
  letter-spacing:-.01em;
  color:#0b2858;
}

.dtTriggerItem{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  gap:0;
  min-height:46px;
  padding:0 4px;
}

.dtTriggerItem + .dtTriggerItem{
  border-left:1px solid rgba(22,112,255,.20);
  padding-left:14px;
}

.dtTriggerHead{
  display:inline-flex;
  align-items:center;
  gap:6px;
  width:100%;
  color:#0b2e66;
  font-size:.95rem;
  font-weight:800;
  line-height:1;
}

.dtTriggerHeadText{
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.dtTriggerHead img{
  width:15px;
  height:15px;
  object-fit:contain;
  transform-origin:50% 50%;
  animation:dtIconCall 2.8s ease-in-out infinite;
  will-change:transform, filter;
}

.dtTriggerItem:nth-child(1) .dtTriggerHead img{ animation-delay:0s; }
.dtTriggerItem:nth-child(2) .dtTriggerHead img{ animation-delay:.28s; }
.dtTriggerItem:nth-child(3) .dtTriggerHead img{ animation-delay:.56s; }

.dtSlotHead img{
  width:15px;
  height:15px;
  object-fit:contain;
  transform-origin:50% 50%;
  animation:dtIconCall 2.8s ease-in-out infinite;
  will-change:transform, filter;
}

.dtStartSlot .dtSlotHead img{ animation-delay:.22s; }
.dtEndSlot .dtSlotHead img{ animation-delay:.48s; }

.dateTimePicker.is-open .dtTriggerHead img,
.dateTimePicker.is-open .dtSlotHead img{
  animation-duration:2.35s;
}

@keyframes dtIconCall{
  0%, 100%{
    transform:translateY(0) scale(1) rotate(0deg);
    filter:drop-shadow(0 0 0 rgba(22,112,255,0));
  }
  10%{
    transform:translateY(-1px) scale(1.12) rotate(-6deg);
    filter:drop-shadow(0 1px 4px rgba(22,112,255,.24));
  }
  20%{
    transform:translateY(0) scale(1.03) rotate(6deg);
  }
  30%{
    transform:translateY(-1px) scale(1.10) rotate(-4deg);
  }
  40%{
    transform:translateY(0) scale(1.02) rotate(4deg);
  }
  55%{
    transform:translateY(0) scale(1) rotate(0deg);
  }
}

@media (prefers-reduced-motion: reduce){
  .dtTriggerHead img,
  .dtSlotHead img{
    animation:none !important;
  }
}

.dtTriggerDate,
.dtTriggerStart,
.dtTriggerEnd{
  display:none;
}

.dtPanel{
  position:absolute;
  top:calc(100% + 9px);
  left:0;
  z-index:30;
  width:min(100%, 680px);
  display:grid;
  grid-template-columns:minmax(300px, 1fr) minmax(280px, .94fr);
  gap:10px;
  border-radius:18px;
  border:1px solid rgba(7,36,88,.18);
  background:linear-gradient(160deg, rgba(255,255,255,.72), rgba(233,244,255,.68));
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 18px 40px rgba(10,34,80,.20), inset 0 1px 0 rgba(255,255,255,.58);
  padding:13px;
  opacity:0;
  transform:translateY(8px) scale(.985);
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
}

.dateTimePicker.is-open .dtPanel{
  opacity:1;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}

.dtCalendarCard,
.dtTimeWrap{
  border:1px solid rgba(12,37,85,.14);
  border-radius:14px;
  background:linear-gradient(175deg, rgba(255,255,255,.74), rgba(241,248,255,.72));
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  padding:10px;
}

.dtPanelHead{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
}

.dtMonthLabel{
  text-align:center;
  font-size:.9rem;
  color:#0f264f;
  letter-spacing:.01em;
}

.dtNav{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:11px;
  border:1px solid rgba(12,37,85,.14);
  background:#fff;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}

.dtNav:hover{
  background:#eef5ff;
  border-color:rgba(22,112,255,.35);
  transform:translateY(-1px);
}

.dtNav img{
  width:14px;
  height:14px;
  object-fit:contain;
}

.dtPrev img{
  transform:rotate(180deg);
}

.dtWeekDays{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  margin-bottom:6px;
}

.dtWeekDays span{
  text-align:center;
  font-size:.71rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#6f809b;
  font-weight:700;
}

.dtDays{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:5px;
}

.dtDay{
  height:35px;
  border-radius:10px;
  border:1px solid transparent;
  background:#fff;
  color:#0f264f;
  font:inherit;
  font-size:.83rem;
  font-weight:700;
  cursor:pointer;
  transition:background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}

.dtDay:hover{
  background:#edf4ff;
  border-color:rgba(22,112,255,.2);
}

.dtDay.is-other-month{
  color:#8ea0bb;
  background:#f7f9fc;
}

.dtDay.is-today{
  border-color:rgba(22,112,255,.45);
}

.dtDay.is-selected{
  background:linear-gradient(135deg, #1670ff, #0f56c5);
  color:#fff;
  border-color:transparent;
  box-shadow:0 8px 18px rgba(22,112,255,.34);
}

.dtDay.is-disabled,
.dtDay:disabled{
  opacity:.5;
  cursor:not-allowed;
  transform:none;
}

.dtTimeWrap{
  margin-top:0;
  padding-top:10px;
  border-top:none;
  display:grid;
  gap:8px;
  align-content:start;
}

.dtTimeTitle{
  margin:0;
  font-size:.77rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:800;
  color:#5f7498;
}

.dtRangeFields{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:7px;
}

.dtSlotCard{
  border:1px solid rgba(11,38,82,.15);
  border-radius:11px;
  background:linear-gradient(165deg, rgba(255,255,255,.78), rgba(239,247,255,.72));
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.58);
  padding:7px 9px;
  display:grid;
  gap:2px;
  text-align:left;
  cursor:pointer;
  transition:all .16s ease;
}

.dtSlotHead{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.dtSlotCard:hover{
  border-color:rgba(22,112,255,.35);
  background:#f7fbff;
}

.dtSlotCard.is-active{
  border-color:rgba(22,112,255,.60);
  box-shadow:0 0 0 3px rgba(22,112,255,.11);
}

.dtSlotCard.is-disabled,
.dtSlotCard:disabled{
  opacity:.58;
  cursor:not-allowed;
}

.dtSlotMeta{
  font-size:.69rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#6b7f9f;
  font-weight:700;
}

.dtSlotValue{
  font-size:.88rem;
  color:#0f2f62;
  letter-spacing:-.01em;
}

.dtUnknownBtn{
  width:100%;
  border:1px dashed rgba(11,38,82,.22);
  border-radius:10px;
  padding:8px 10px;
  background:#f9fbff;
  color:#1a3f78;
  font:inherit;
  font-size:.78rem;
  font-weight:600;
  text-align:center;
  cursor:pointer;
  transition:all .16s ease;
}

.dtUnknownBtn:hover{
  border-color:rgba(22,112,255,.45);
  background:#f0f6ff;
}

.dtUnknownBtn.is-active{
  border-style:solid;
  border-color:rgba(22,112,255,.56);
  background:linear-gradient(135deg, rgba(22,112,255,.18), rgba(22,112,255,.07));
  color:#0d3c85;
}

.dtUnknownBtn:disabled{
  opacity:.52;
  cursor:not-allowed;
}

.dtRangeHint{
  margin:0;
  min-height:1.2em;
  color:#627893;
  font-size:.76rem;
  line-height:1.35;
}

.dtTimes{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:6px;
  max-height:188px;
  overflow:auto;
  padding-right:2px;
}

.dtTimeChip{
  border:1px solid rgba(11,38,82,.14);
  border-radius:10px;
  padding:8px 6px;
  background:#fff;
  color:#103062;
  font:inherit;
  font-size:.79rem;
  font-weight:700;
  cursor:pointer;
  transition:all .16s ease;
}

.dtTimeChip:hover{
  background:#edf4ff;
  border-color:rgba(22,112,255,.36);
}

.dtTimeChip.is-selected{
  background:linear-gradient(135deg, rgba(22,112,255,.20), rgba(22,112,255,.08));
  border-color:rgba(22,112,255,.56);
  color:#0c3c85;
  box-shadow:0 8px 16px rgba(22,112,255,.14);
}

.dtTimeChip.is-disabled,
.dtTimeChip:disabled{
  opacity:.52;
  cursor:not-allowed;
  background:#f7f9fc;
  color:#7f8ea6;
}

@media (max-width: 700px){
  .modePicker{
    grid-template-columns:1fr;
  }

  .dtTriggerValue{
    grid-template-columns:1fr;
    gap:6px;
  }

  .dtTriggerItem{
    min-height:auto;
    padding:0;
    cursor:pointer;
    transition:background .16s ease, border-color .16s ease;
  }

  .dtTriggerItem.is-mobile-active{
    border:1px solid rgba(22,112,255,.30);
    background:rgba(22,112,255,.10);
    border-radius:10px;
    padding:5px 8px;
  }

  .dtTriggerItem + .dtTriggerItem{
    border-left:none;
    padding-left:0;
  }

  .dtPanel{
    position:static;
    grid-template-columns:1fr;
    width:100%;
    margin-top:9px;
    box-shadow:0 14px 30px rgba(10,34,80,.14);
    max-height:0;
    overflow:hidden;
    padding:0 13px;
    border-width:0;
  }

  .dateTimePicker.is-open .dtPanel{
    max-height:640px;
    padding:12px 13px 13px;
    border-width:1px;
  }

  .dateTimePicker[data-mobile-step="date"] .dtTimeWrap{
    display:none;
  }

  .dateTimePicker[data-mobile-step="time"] .dtCalendarCard{
    display:none;
  }

  .dtTimes{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    max-height:220px;
    overflow:auto;
  }
}