/* ==========================================================================
   CONTENUTI — elementi editoriali costruiti con moduli nativi
   I moduli Text usano la formattazione normale dell'editor (elenchi,
   grassetto, link): la classe trasforma l'aspetto.
   ========================================================================== */

/* ---------- ELENCO CHIAVE / VALORE · modulo Text "sy-specs" ----------
   Nell'editor: elenco puntato, ogni voce = "Chiave **Valore**" (valore in grassetto). */
.et_pb_module.sy-specs{margin-top:26px;}
.sy-specs ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--sy-linea);}
.sy-specs li{
  display:flex;justify-content:space-between;gap:20px;
  padding:13px 2px;border-bottom:1px solid var(--sy-linea);font-size:.97rem;
  color:var(--sy-grigio-chiaro);
}
.sy-specs li strong{font-weight:600;color:var(--sy-titolo);text-align:right;}
.sy-section-dark .sy-specs ul,
.sy-section-dark .sy-specs li{border-color:var(--sy-bordo-dark);}
.sy-section-dark .sy-specs li{color:var(--sy-muted-dark);}
.sy-section-dark .sy-specs li strong{color:#fff;}

/* ---------- ELENCO CON TRATTINO BLU · modulo Text "sy-punti" ---------- */
.sy-punti ul{list-style:none;margin:18px 0;padding:0;}
.sy-punti li{padding-left:26px;position:relative;margin-bottom:12px;color:var(--sy-grigio);}
.sy-punti li::before{content:"";position:absolute;left:0;top:.75em;width:12px;height:2px;background:var(--sy-blu);}
.sy-section-dark .sy-punti li,
.sy-section-darker .sy-punti li{color:#c6d2dd;}

/* ---------- AVVISO CON BORDO BLU · modulo Text "sy-avviso" ---------- */
.et_pb_module.sy-avviso{
  background:var(--sy-alt);border:1px solid var(--sy-bordo-light);border-left:3px solid var(--sy-blu);
  border-radius:0 var(--sy-r) var(--sy-r) 0;padding:18px 22px;margin-top:26px;--sy-mb:26px;
  font-size:.95rem;color:var(--sy-grigio);
}

/* ---------- LINK CORRELATI · modulo Text "sy-correlati" ----------
   Nell'editor: un titolo (H2/H3) e poi i link, uno per riga o sulla stessa riga. */
.et_pb_module.sy-correlati{margin-top:52px;padding-top:32px;border-top:1px solid var(--sy-linea);}
/* Variante da sola in una sezione: senza linea e spazio sopra */
.et_pb_module.sy-correlati.sy-correlati-solo{margin-top:0;padding-top:0;border-top:0;}
.sy-correlati h2,
.sy-correlati h3{font-size:1.15rem;margin-bottom:14px;}
.sy-correlati p{display:flex;flex-wrap:wrap;gap:10px 26px;}
.sy-correlati p + p{margin-top:10px;}
.sy-correlati a{color:var(--sy-blu-testo);font-weight:600;}
.sy-correlati a:hover{text-decoration:underline;}
.sy-correlati br{display:none;}

/* ---------- FAQ · Group "sy-faq" con moduli Toggle (o un modulo Accordion) ---------- */
.et_pb_module.sy-faq{border-top:1px solid var(--sy-linea);margin-top:40px;width:100%;}
.et_pb_module.sy-faq .et_pb_toggle{
  border:0;border-bottom:1px solid var(--sy-linea);border-radius:0;
  background:transparent !important;padding:0;margin:0 !important;
}
.sy-faq .et_pb_toggle .et_pb_toggle_title{
  position:relative;cursor:pointer;
  padding:20px 36px 20px 0;
  font-family:var(--sy-font);font-weight:600;font-size:1.02rem;line-height:1.4;color:var(--sy-titolo) !important;
}
.sy-faq .et_pb_toggle .et_pb_toggle_title::before{
  content:"+" !important;font-family:var(--sy-font) !important;
  right:8px;left:auto;top:50%;margin-top:0;transform:translateY(-50%);
  color:var(--sy-blu) !important;font-weight:400;font-size:1.4rem;
}
.sy-faq .et_pb_toggle.et_pb_toggle_open .et_pb_toggle_title::before{content:"–" !important;display:block;}
.sy-faq .et_pb_toggle .et_pb_toggle_content{padding:0 0 20px;max-width:760px;color:var(--sy-grigio-chiaro);font-size:1rem;}

/* ---------- TABELLA · modulo Text "sy-tabella" che contiene una tabella ---------- */
.sy-tabella table{border-collapse:separate;border-spacing:0;width:100%;margin:22px 0;font-size:.95rem;border:1px solid var(--sy-bordo-light);border-radius:var(--sy-r);overflow:hidden;}
.sy-tabella th{background:var(--sy-nero);color:#fff;font-weight:600;text-align:left;padding:13px 16px;letter-spacing:.03em;}
.sy-tabella td{border-top:1px solid var(--sy-linea);padding:12px 16px;vertical-align:top;color:var(--sy-grigio);}
.sy-tabella td:first-child{font-weight:600;color:var(--sy-titolo);white-space:nowrap;}
@media (max-width:640px){
  .sy-tabella table{font-size:.85rem;}
  .sy-tabella td,.sy-tabella th{padding:9px 10px;}
}

/* ---------- PALLINI LED (per la tabella LED) ---------- */
.sy-led{display:inline-block;width:11px;height:11px;border-radius:50%;vertical-align:middle;margin-right:9px;}
.sy-led-rosso{background:#ff4d4d;box-shadow:0 0 12px rgba(255,77,77,.9);}
.sy-led-verde{background:#37d67a;box-shadow:0 0 12px rgba(55,214,122,.8);}
.sy-led-giallo{background:#ffc933;box-shadow:0 0 12px rgba(255,201,51,.8);}
.sy-led-spento{background:#20262d;border:1px solid #4a5866;box-shadow:none;}

/* Pallino LED prima del titolo di un Blurb (card o statistica hero):
   aggiungere al Blurb la classe sy-dot-rosso / sy-dot-giallo / sy-dot-verde / sy-dot-spento */
.et_pb_blurb:is(.sy-dot-rosso,.sy-dot-giallo,.sy-dot-verde,.sy-dot-spento) .et_pb_module_header::before{
  content:"";display:inline-block;width:11px;height:11px;border-radius:50%;vertical-align:middle;margin:-3px 9px 0 0;
}
.et_pb_blurb.sy-dot-rosso .et_pb_module_header::before{background:#ff4d4d;box-shadow:0 0 12px rgba(255,77,77,.9);}
.et_pb_blurb.sy-dot-verde .et_pb_module_header::before{background:#37d67a;box-shadow:0 0 12px rgba(55,214,122,.8);}
.et_pb_blurb.sy-dot-giallo .et_pb_module_header::before{background:#ffc933;box-shadow:0 0 12px rgba(255,201,51,.8);}
.et_pb_blurb.sy-dot-spento .et_pb_module_header::before{background:#20262d;border:1px solid #4a5866;box-shadow:none;}

/* ---------- IMMAGINI · modulo Image ---------- */
/* Immagine in pannello scuro (ex .feature-img / .due-col .pannello) */
.et_pb_module.sy-pannello{
  background:var(--sy-nero);border-radius:var(--sy-r);padding:44px;
  display:flex;justify-content:center;border:1px solid var(--sy-bordo-light);width:100%;
}
.sy-pannello .et_pb_image_wrap{display:flex;justify-content:center;width:100%;}
.sy-pannello img{width:100%;max-width:380px;}
/* Illustrazione con alone blu (ex .plc-visual) */
.et_pb_module.sy-visual{display:flex;justify-content:center;width:100%;}
.sy-visual img{width:100%;max-width:380px;height:auto;filter:drop-shadow(0 20px 50px rgba(47,157,244,.18));}
/* Emblema (emblema.jpg, 970×580): nel file il disegno non è centrato (146px di nero a sinistra,
   59 a destra; 90 sopra, 13 sotto). Ritaglio reale sull'area x 87–970, y 77–580 (883×503):
   il contenitore mostra solo quella zona. Si aggancia al nome del file, così vale ovunque
   l'emblema sia usato (Home, Chi siamo) senza toccare le pagine. I margini in % sono
   relativi alla larghezza del contenitore. */
.et_pb_image .et_pb_image_wrap:has(> img[src*="/emblema"]){
  display:block;width:100%;max-width:380px;aspect-ratio:883/503;overflow:hidden;margin:0 auto;
}
.et_pb_image .et_pb_image_wrap > img[src*="/emblema"]{
  display:block;max-width:none;height:auto;
  width:calc(100% * 970 / 883);
  margin:calc(-100% * 77 / 883) 0 0 calc(-100% * 87 / 883);
}
/* Diagramma largo (ex .diag-visual) */
.sy-diagramma img{width:100%;max-width:520px;height:auto;}
/* Angoli arrotondati */
.sy-rounded img,
.et_pb_module.sy-rounded{border-radius:var(--sy-r);overflow:hidden;}

/* ---------- MAPPA · modulo Map o Code con iframe ---------- */
.et_pb_module.sy-mappa{border:1px solid var(--sy-bordo-light);border-radius:var(--sy-r);overflow:hidden;margin-top:22px;width:100%;}
.sy-mappa iframe{display:block;width:100%;height:420px;border:0;filter:grayscale(.2);}
.sy-mappa .et_pb_map{height:420px;}