/* =====================================================================
   General Contractor
   Font: Inter. Larghezza contenuto max 1500px, gutter 30px.
   ===================================================================== */

/* ---------- Token / palette (scoped alle sezioni .gcn) ---------- */
.gcn {
  --gcn-orange:        #f48221;
  --gcn-on-orange:     #5a2a00;
  --gcn-primary:       #964900;
  --gcn-slate:         #4b626c;
  --gcn-azure:         #cbe3f0;
  --gcn-ink:           #1c1c1a;
  --gcn-muted:         #564336;
  --gcn-cream:         #fcf9f5;
  --gcn-cream-container:#f0edea;
  --gcn-border:        #ddc1b0;
  --gcn-white:         #ffffff;

  --gcn-max:    1500px;
  --gcn-gutter: 30px;
  --gcn-pad-y:  clamp(56px, 8vw, 100px);

  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--gcn-ink);
  -webkit-font-smoothing: antialiased;
}

/* ---------- Sezione (container fullwidth) : padding verticale + larghezza ---------- */
.gcn.fusion-fullwidth {
  padding-top: var(--gcn-pad-y) !important;
  padding-bottom: var(--gcn-pad-y) !important;
}
.gcn .fusion-builder-row.fusion-row {
  max-width: var(--gcn-max) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--gcn-gutter) !important;
  padding-right: var(--gcn-gutter) !important;
  box-sizing: border-box;
}

/* azzera ombre/decorazioni di colonna ereditate */
.gcn .fusion-column-wrapper { box-shadow: none !important; }

/* ---------- Tipografia di base ---------- */
.gcn .fusion-title-heading { font-family: 'Inter', sans-serif; color: var(--gcn-ink); }
.gcn .fusion-text { font-family: 'Inter', sans-serif; color: var(--gcn-muted); }
.gcn .fusion-text p { margin: 0 0 1em; line-height: 1.65; font-size: 17px; }
.gcn .fusion-text p:last-child { margin-bottom: 0; }
.gcn .fusion-text strong { color: var(--gcn-ink); }

.gcn-h-lg .fusion-title-heading {
  font-size: clamp(28px, 4vw, 44px) !important;
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -0.01em;
  color: var(--gcn-ink);
}
.gcn-body-lg p { font-size: 18px !important; line-height: 1.7; }
.gcn-center .fusion-title-heading,
.gcn-center.fusion-text,
.gcn-center.fusion-text p { text-align: center; }

/* badge / tag titoletto — vero riquadro azzurro con padding (come .let-gc-tag) */
.gcn-tag .fusion-title-heading {
  display: inline-block !important;
  background: var(--gcn-azure) !important;
  background-color: var(--gcn-azure) !important;
  color: var(--gcn-slate) !important;
  font-size: clamp(18px, 2.4vw, 26px) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  padding: 14px 18px !important;
  border-radius: 0 !important;
  letter-spacing: -0.01em;
}

/* =====================================================================
   SEZIONE 1 — Soluzioni Chiavi in Mano
   ===================================================================== */
/* intro: blocco CENTRATO max-width 768px (come .let-gc-value__intro) */
.gcn-value-intro { margin-bottom: clamp(40px, 6vw, 64px) !important; }
.gcn-value-intro > .fusion-column-wrapper {
  max-width: 768px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}
.gcn-value-title { margin-bottom: 28px !important; }
.gcn-value-title .fusion-title-heading { text-align: center !important; }
/* lead: CENTRATA, BLU-GRIGIO, bold */
.gcn-lead.fusion-text,
.gcn-lead.fusion-text p {
  text-align: center !important;
  color: var(--gcn-slate) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}
.gcn-lead.fusion-text p {
  font-size: clamp(19px, 2.4vw, 24px) !important;
  margin: 0 0 22px !important;
}
/* paragrafo body centrato, colore muted, "Saccomandi S.R.L." in bold */
.gcn-value-intro .gcn-body-lg.fusion-text,
.gcn-value-intro .gcn-body-lg.fusion-text p {
  text-align: center !important;
  color: var(--gcn-muted) !important;
}

/* Bento: testo a sinistra (gcn-bento-text 7fr) + immagine a destra (gcn-bento-img 5fr) */
.gcn-value .fusion-builder-row > .gcn-value-intro { width: 100% !important; flex: 0 0 100% !important; }
/* allinea le 2 colonne bento e dà altezza uguale (immagine = testo) */
.gcn-value .fusion-builder-row.fusion-row { align-items: stretch !important; }
.gcn-bento-text  { flex: 0 0 58.333% !important; max-width: 58.333% !important; width: 58.333% !important; }
.gcn-bento-img   { flex: 0 0 41.667% !important; max-width: 41.667% !important; width: 41.667% !important; }
.gcn-bento-text .fusion-column-wrapper {
  padding-right: clamp(0px, 2vw, 32px);
  display: flex !important;
  flex-direction: column !important;
  height: 100%;
}
.gcn-bento-badge { margin-bottom: 28px !important; }
/* badge azzurro, testo BLU-GRIGIO */
.gcn-bento-badge .fusion-title-heading,
.gcn-exc-badge .fusion-title-heading,
.gcn-services-badge .fusion-title-heading { color: var(--gcn-slate) !important; }
.gcn-bento-lead { margin-bottom: clamp(40px, 5vh, 72px) !important; }

/* griglia 4 feature (colonne inner 1_2 = 2x2) spinte in basso (allinea foto) */
.gcn-bento-text .fusion-builder-row-inner { margin-top: auto !important; row-gap: 44px !important; }
.gcn-feature .fusion-column-wrapper { padding: 0 !important; }
.gcn-feature { margin-bottom: 0 !important; }
.gcn-feature-title .fusion-title-heading {
  position: relative;
  padding-left: 50px !important;
  min-height: 36px;
  display: flex;
  align-items: center;
  font-size: clamp(18px, 1.4vw, 22px) !important;
  font-weight: 700;
  color: var(--gcn-ink);
  margin-bottom: 8px !important;
}
/* icona arancio grande accanto al titolo (come Material Symbols originale) */
.gcn-feature-title .fusion-title-heading::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 34px 34px;
}
.gcn-feature-text { padding-left: 50px; }
.gcn-feature-text p { font-size: 15px !important; line-height: 1.55; color: var(--gcn-muted); }

/* icone feature (Material-like, arancio #f48221) */
.gcn-ic-architecture .fusion-title-heading::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f48221'%3E%3Cpath d='M12 2 4 7v2l8-4.6L20 9V7l-8-5zm-1 6.27-7 4.04V21h6v-5h4v5h6v-8.69l-7-4.04V6h-2v2.27z'/%3E%3C/svg%3E");
}
.gcn-ic-schedule .fusion-title-heading::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f48221'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67V7z'/%3E%3C/svg%3E");
}
.gcn-ic-payments .fusion-title-heading::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f48221'%3E%3Cpath d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 14H4v-6h16v6zm0-10H4V6h16v2zM7 15h5v2H7z'/%3E%3C/svg%3E");
}
.gcn-ic-verified .fusion-title-heading::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f48221'%3E%3Cpath d='m23 12-2.44-2.79.34-3.69-3.61-.82-1.89-3.2L12 2.96 8.6 1.5 6.71 4.69 3.1 5.5l.34 3.7L1 12l2.44 2.79-.34 3.7 3.61.82 1.89 3.2L12 21.04l3.4 1.46 1.89-3.19 3.61-.82-.34-3.69L23 12zm-12.91 4.72-3.8-3.81 1.48-1.48 2.32 2.33 5.85-5.87 1.48 1.48-7.33 7.35z'/%3E%3C/svg%3E");
}

/* immagine edificio: stessa altezza colonna testo, crop dal basso, SACCOMANDI in alto */
.gcn-bento-img .fusion-column-wrapper { height: 100%; }
.gcn-bento-img .fusion-imageframe,
.gcn-bento-img .imageframe-align-none,
.gcn-img-edificio { display: block !important; height: 100% !important; }
.gcn-img-edificio {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  max-height: clamp(420px, 34vw, 520px);
  height: 100% !important;
}
.gcn-img-edificio a,
.gcn-img-edificio span { display: block; height: 100%; }
.gcn-img-edificio img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  border-radius: 8px;
  display: block;
}

/* =====================================================================
   SEZIONE 2 — I Nostri Servizi  (sfondo leggera tinta)
   ===================================================================== */
.gcn-services.fusion-fullwidth { background: rgba(66, 72, 76, 0.05); }
.gcn-services .fusion-builder-row.fusion-row { align-items: center !important; }
/* riduci il padding verticale di sezione: tutto entra nel viewport desktop (~100vh) */
.gcn-services.fusion-fullwidth {
  padding-top: clamp(40px, 5vw, 64px) !important;
  padding-bottom: clamp(40px, 5vw, 64px) !important;
}

.gcn-services-img .fusion-column-wrapper { padding-right: clamp(0px, 3vw, 40px); }
.gcn-img-services { display: block; border-radius: 8px; overflow: hidden; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); }
.gcn-img-services img {
  width: 100%;
  height: clamp(340px, 36vw, 520px);
  object-fit: cover;
  border-radius: 8px;
  display: block;
}

.gcn-services-badge .fusion-title-heading { text-transform: uppercase; letter-spacing: 0.05em; }
.gcn-services-badge { margin-bottom: clamp(20px, 2.4vw, 30px) !important; }

.gcn-service-title .fusion-title-heading {
  font-size: clamp(18px, 1.4vw, 22px) !important;
  font-weight: 700;
  color: var(--gcn-ink);
  margin-bottom: 6px !important;
  transition: color .2s ease;
}
.gcn-service-title { margin-top: clamp(16px, 1.8vw, 24px) !important; }
.gcn-service-title:first-of-type { margin-top: 0 !important; }
.gcn-service-text {
  border-left: 2px solid var(--gcn-orange);
  padding-left: 24px;
  margin-left: 4px;
  margin-bottom: 0 !important;
}
.gcn-service-text p { font-size: 15px !important; line-height: 1.5; color: var(--gcn-muted); }

/* (2a) HOVER sul punto numerato → il titoletto del servizio diventa arancio
   (transizione fluida). L'hover sul titolo colora il titolo; l'hover sul testo
   sottostante colora il titolo che lo precede (via :has sul wrapper colonna). */
.gcn-service-title:hover .fusion-title-heading,
.gcn-service-title:has(+ .gcn-service-text:hover) .fusion-title-heading {
  color: var(--gcn-orange) !important;
}

/* missione: corsivo con linea separatrice sopra (NESSUN riquadro azzurro) */
.gcn-services-mission {
  margin-top: clamp(20px, 2.4vw, 30px) !important;
  padding: 20px 0 0 !important;
  border-top: 1px solid var(--gcn-border);
  background: transparent !important;
  border-radius: 0 !important;
}
.gcn-services-mission p {
  font-style: italic;
  font-weight: 700;
  color: var(--gcn-ink) !important;
  font-size: 16px !important;
  line-height: 1.5;
}

/* =====================================================================
   SEZIONE 3 — Eccellenza Edile
   ===================================================================== */
.gcn-exc .fusion-builder-row.fusion-row { align-items: center !important; }
.gcn-exc-text .fusion-column-wrapper { padding-right: clamp(0px, 3vw, 40px); }
.gcn-exc-badge { margin-bottom: 28px !important; }
.gcn-exc-text .gcn-body-lg { margin-bottom: 22px !important; }

/* 3 riquadri statistiche (colonne inner 1_3) in box CREMA arrotondati.
   (3a) Le card partono allineate a SINISTRA come il paragrafo sopra, sono
   equidistanti e di larghezza uguale (griglia a 3 colonne uguali, gap uguale). */
.gcn-exc .fusion-builder-row.fusion-builder-row-inner.fusion-row {
  margin-top: 6px !important;
  flex-wrap: nowrap !important;
  gap: 16px;
  /* azzera il gutter ereditato dalla .fusion-row (più specifico) così il bordo
     sinistro della prima card coincide col bordo sinistro del paragrafo */
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
/* annulla lo spacing Avada delle colonne inner, forza 3 colonne uguali su una riga */
.gcn-exc .fusion-builder-row-inner > .gcn-stat {
  flex: 1 1 0 !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.gcn-stat > .fusion-column-wrapper {
  padding: 18px 8px !important;
  margin: 0 !important;
  background: var(--gcn-cream-container) !important;
  background-color: var(--gcn-cream-container) !important;
  border-radius: 12px !important;
  text-align: center;
}
.gcn-stat-num .fusion-title-heading {
  justify-content: center;
  text-align: center !important;
  font-size: clamp(24px, 2.4vw, 32px) !important;
  font-weight: 800;
  color: var(--gcn-orange) !important;
  line-height: 1.05;
  margin-bottom: 4px !important;
}
.gcn-stat-label { text-align: center; }
.gcn-stat-label p {
  font-size: 12px !important;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--gcn-slate);
  letter-spacing: 0.02em;
  line-height: 1.3;
}

/* (3b) Foto tutta a DESTRA + quadrato decorativo arancio (semitrasparente)
   DIETRO l'angolo basso-destra della foto: ne spunta solo un piccolo angolo. */
.gcn-exc-img .fusion-column-wrapper { position: relative; }
/* il frame riempie la colonna così il bordo destro della foto = bordo contenuto */
.gcn-exc-img .fusion-imageframe,
.gcn-exc-img .imageframe-align-none,
.gcn-img-exc {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}
.gcn-img-exc { border-radius: 8px; overflow: hidden; position: relative; z-index: 1; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12); }
.gcn-img-exc img {
  width: 100% !important;
  height: clamp(360px, 38vw, 500px);
  object-fit: cover;
  border-radius: 8px;
  display: block;
}
/* quadrato arancio dietro la foto: piccolo offset così sporge solo un angolo */
.gcn-exc-img .fusion-column-wrapper::after {
  content: "";
  position: absolute;
  right: -20px;
  bottom: -20px;
  width: clamp(110px, 14vw, 180px);
  height: clamp(110px, 14vw, 180px);
  background: rgba(244, 130, 33, 0.2);
  z-index: 0;
}

/* =====================================================================
   SEZIONE 4 — CTA finale
   ===================================================================== */
.gcn-cta-card > .fusion-column-wrapper {
  position: relative;
  overflow: hidden;
  display: block !important;
  background: var(--gcn-slate) !important;
  border-radius: 20px !important;
  padding: clamp(40px, 6vw, 80px) clamp(28px, 6vw, 80px) !important;
  text-align: center !important;
}
/* i due bottoni stanno ognuno in un <div> senza classe: rendili inline e affiancati */
.gcn-cta-card > .fusion-column-wrapper > div:not([class]) {
  display: inline-block;
  vertical-align: middle;
  margin: 6px 8px 0 !important;
  position: relative;
  z-index: 1;
}
/* forme decorative quadrate bianche semitrasparenti agli angoli */
.gcn-cta-card .fusion-column-wrapper::before,
.gcn-cta-card .fusion-column-wrapper::after {
  content: "";
  position: absolute;
  width: 160px;
  height: 160px;
  background: rgba(255, 255, 255, 0.07);
  border-radius: 18px;
  transform: rotate(18deg);
  pointer-events: none;
}
.gcn-cta-card .fusion-column-wrapper::before { top: -60px; left: -50px; }
.gcn-cta-card .fusion-column-wrapper::after  { bottom: -60px; right: -50px; }

/* testi BIANCHI dentro la card */
/* (4) titolo limitato in larghezza così va a capo su >= 2 righe, centrato */
.gcn-cta-title { text-align: center !important; }
.gcn-cta-title .fusion-title-heading {
  color: var(--gcn-white) !important;
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}
.gcn-cta-text p { color: rgba(255, 255, 255, 0.9) !important; position: relative; z-index: 1; }
.gcn-cta-text { max-width: 720px; margin: 18px auto 30px !important; position: relative; z-index: 1; }

/* bottoni */
.gcn-cta-card .fusion-button {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  padding: 16px 32px !important;
  border-radius: 50px; /* pillola come la homepage; niente !important → modificabile da Avada */
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  text-decoration: none !important;
  border: 2px solid transparent !important;
  line-height: 1 !important;
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.gcn-cta-card .fusion-button .fusion-button-text { color: inherit !important; }
.gcn-cta-card .fusion-button:hover { transform: translateY(-2px); }

.gcn-btn-primary {
  background: #f78b1f !important;   /* arancio della homepage */
  color: #3b3c3f !important;        /* testo grigio scuro come homepage */
}
.gcn-btn-primary:hover { box-shadow: 0 10px 24px rgba(244, 130, 33, 0.35); }

.gcn-btn-white {
  background: var(--gcn-white) !important;
  color: #3b3c3f !important;        /* testo grigio scuro come homepage */
}
.gcn-btn-white:hover { box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18); }

/* icone nei bottoni (call / mail) tinta = colore testo del bottone */
.gcn-btn::before {
  content: "";
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.gcn-ic-call::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.62 10.79a15.05 15.05 0 0 0 6.59 6.59l2.2-2.2a1 1 0 0 1 1.02-.24 11.36 11.36 0 0 0 3.57.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.62 10.79a15.05 15.05 0 0 0 6.59 6.59l2.2-2.2a1 1 0 0 1 1.02-.24 11.36 11.36 0 0 0 3.57.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E");
}
.gcn-ic-mail::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
}

/* =====================================================================
   Responsive
   ===================================================================== */
@media (max-width: 800px) {
  .gcn-bento-text .fusion-column-wrapper,
  .gcn-services-img .fusion-column-wrapper,
  .gcn-exc-text .fusion-column-wrapper { padding-right: 0; }

  .gcn-img-edificio img { min-height: 280px; }

  .gcn-exc-img .fusion-column-wrapper::after {
    width: 80px; height: 80px; right: -8px; bottom: -8px;
  }
}

/* =====================================================================
   (3) "I Nostri Servizi" — hanging indent sul titolo numerato
   Il numero ("4.") resta a sinistra; le righe successive del titolo
   ("Burocratica") si allineano alla prima parola dopo il numero
   ("Consulenza"), non sotto il numero. Vale a tutte le larghezze.
   ===================================================================== */
.gcn-service-title .fusion-title-heading {
  display: block;              /* da flex a block: serve a text-indent/hanging */
  align-items: initial;
  padding-left: 1.6em !important;  /* spazio riservato al numero "N." (batte il padding:0 di Avada) */
  text-indent: -1.6em;         /* la 1ª riga rientra a sinistra di 1.6em → numero a filo */
}

/* =====================================================================
   MOBILE (≤ 768px) — la pagina diventa responsive
   ===================================================================== */
@media (max-width: 768px) {

  /* ---- (1) HERO "Copertina" (.category-title-bg) come la hero di Contatti:
     altezza adeguata, contenuto centrato verticalmente, immagine cover.
     Il container ha già --awb-background-size:cover e un overlay scuro
     (box-shadow inset). Qui aggiungiamo altezza + centratura. ---- */
  .category-title-bg {
    min-height: 80vh !important;
    display: flex !important;
    background-size: cover !important;
    background-position: center center !important;
    /* allineamento verticale: dal BUILDER (anche su mobile) */
  }
  .category-title-bg > .fusion-builder-row {
    width: 100% !important;
    align-self: center !important;
  }
  /* la colonna interna non deve più spingere il contenuto in alto con i
     margin-top fissi (80px) né con i separator: centriamo nel viewport */
  .category-title-bg .let-main-slider {
    margin-top: 0 !important;
  }
  /* allineamento contenuto colonna: dal BUILDER (niente centratura forzata su mobile) */
  /* azzera i separator (spaziatori) che gonfiavano/sballavano la hero */
  .category-title-bg .fusion-separator {
    margin-top: 0 !important;
    display: none !important;
  }
  /* titolo hero: cap del font su mobile così "GENERAL CONTRACTOR" non sborda */
  .category-title-bg .fusion-title-heading {
    font-size: clamp(30px, 8.5vw, 50px) !important;
    line-height: 1.06 !important;
    word-break: normal;
  }
  /* sottotitolo hero: dimensione leggibile su mobile */
  .category-title-bg .fusion-text, .category-title-bg .fusion-text p {
    font-size: clamp(15px, 4vw, 18px) !important;
    line-height: 1.5 !important;
  }
  /* bottone hero: font ragionevole su mobile (era 30px, dimensione desktop) */
  .category-title-bg .fusion-button {
    font-size: 16px !important;
    line-height: 1.2 !important;
    padding: 14px 30px !important;
  }

  /* ---- (2) BENTO "Perché scegliere Saccomandi…": 1 colonna.
     Prima la FOTO (in cima), poi tutto il testo + le 4 feature in
     un'unica colonna a piena larghezza. ---- */
  .gcn-value > .fusion-builder-row.fusion-row {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;   /* evita che le colonne "wrappino" di lato */
    align-items: stretch !important; /* cross-axis = larghezza → colonne full width */
  }
  /* in colonna NON deve esserci equal-height: ogni colonna alta quanto il suo
     contenuto (altrimenti l'immagine viene "stirata" e lascia un buco enorme) */
  .gcn-value > .fusion-builder-row.fusion-row > .fusion-layout-column {
    align-self: stretch !important;
    height: auto !important;
    min-height: 0 !important;
  }
  .gcn-bento-img,
  .gcn-bento-img > .fusion-column-wrapper {
    height: auto !important;
    min-height: 0 !important;
    align-self: stretch !important;
  }
  /* annulla le larghezze fisse desktop: entrambe le colonne full width.
     NB: il container è flex-direction:column → flex-basis agisce sull'ALTEZZA,
     quindi usiamo flex:0 0 auto (no basis 100%!) e width:100% a parte. */
  .gcn-value > .fusion-builder-row.fusion-row > .gcn-value-intro,
  .gcn-value > .fusion-builder-row.fusion-row > .gcn-bento-text,
  .gcn-value > .fusion-builder-row.fusion-row > .gcn-bento-img {
    flex: 0 0 auto !important;      /* basis auto: NIENTE stiramento in altezza */
    max-width: 100% !important;
    width: 100% !important;
    float: none !important;
  }
  /* ordine: intro → IMMAGINE → TESTO */
  .gcn-value-intro { order: 0 !important; }
  .gcn-bento-img   { order: 1 !important; margin-bottom: 28px !important; }
  .gcn-bento-text  { order: 2 !important; }
  /* immagine non più "alta come il testo": altezza propria ragionevole */
  .gcn-bento-img .fusion-column-wrapper,
  .gcn-img-edificio { height: auto !important; }
  .gcn-img-edificio { max-height: none !important; }
  .gcn-img-edificio img { height: auto !important; min-height: 220px; max-height: 320px; }

  /* le 4 feature: UNA sola colonna a piena larghezza, una sotto l'altra */
  .gcn-bento-text .fusion-builder-row-inner {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;   /* le 4 feature in colonna, niente wrap laterale */
    margin-top: 32px !important;
    row-gap: 28px !important;
  }
  .gcn-bento-text .fusion-builder-row-inner > .gcn-feature {
    flex: 0 0 auto !important;       /* basis:auto: niente stiramento verticale */
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* ---- (4) CTA finale: "Inviaci una email" su UNA sola riga.
     Riduci font + nowrap; bottoni affiancati e centrati. ---- */
  .gcn-cta-card .fusion-button {
    font-size: 15px !important;
    padding: 14px 22px !important;
    white-space: nowrap !important;
  }
  .gcn-cta-card .fusion-button .fusion-button-text { white-space: nowrap !important; }

  /* ---- (5) Allinea i testi a SINISTRA su mobile (centrato si legge male).
     Esclude badge, statistiche, hero e CTA che restano come sono. ---- */
  .gcn-value-intro > .fusion-column-wrapper,
  .gcn-value-title .fusion-title-heading,
  .gcn-lead.fusion-text,
  .gcn-lead.fusion-text p,
  .gcn-value-intro .gcn-body-lg.fusion-text,
  .gcn-value-intro .gcn-body-lg.fusion-text p,
  .gcn-center .fusion-title-heading,
  .gcn-center.fusion-text,
  .gcn-center.fusion-text p {
    text-align: left !important;
  }
}