/* ==========================================================================
   HEADER E FOOTER — da costruire nel Theme Builder di Divi
   Header: Section "sy-header" > Row "sy-nav" > Text "sy-brand" + Menu "sy-menu" + Button "sy-tel-header"
   Footer: Section "sy-footer" > Row "sy-foot" > Text "sy-brand" + Text + Text
   ========================================================================== */

/* ---------- HEADER ---------- */
.et_pb_section.sy-header{
  position:sticky;top:0;z-index:50;
  background:var(--sy-nero-scuro);border-bottom:1px solid var(--sy-bordo-dark);
  padding:0;
}
.admin-bar .et_pb_section.sy-header{top:32px;}
.et_pb_row.sy-nav{
  --flex-direction:row;
  align-items:center;justify-content:space-between;flex-wrap:nowrap;
  height:70px;gap:24px;
}
.sy-nav > .et_pb_column{width:auto !important;flex:0 0 auto;}

/* Marchio testuale · modulo Text: "**SYNAPSE** AUTOMATION" (prima parola in grassetto) */
.et_pb_module.sy-brand{
  font-weight:400;font-size:.6rem;letter-spacing:.35em;color:#aebdcc;line-height:1.2;white-space:nowrap;
}
.sy-brand strong,
.sy-brand b{
  font-weight:800;font-size:1.2rem;letter-spacing:.06em;margin-right:8px;
  background:linear-gradient(180deg,#8fd0ff 0%,#2f9df4 55%,#0b62b8 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
}
.sy-brand a{color:inherit;}

/* Menu · modulo Menu */
.sy-menu .et-menu,
.sy-menu .et_pb_menu__menu > nav > ul{display:flex;gap:30px;}
.sy-menu .et-menu > li{padding:0 !important;}
.sy-menu .et-menu > li > a{font-family:var(--sy-font);font-size:.94rem;font-weight:400;color:#cdd8e3 !important;padding:0 !important;}
.sy-menu .et-menu > li > a:hover,
.sy-menu .et-menu > li.current-menu-item > a{color:var(--sy-blu) !important;opacity:1;}
.et_pb_module.sy-menu{background:transparent !important;}
.sy-menu .mobile_menu_bar::before{color:#cdd8e3 !important;}

/* Telefono · modulo Button */
body .et_pb_button.et_pb_module.sy-tel-header,
body .et_pb_button.et_pb_module.sy-tel-header:hover{
  display:inline-flex;flex-direction:row;align-items:center;gap:8px;white-space:nowrap;
  border:1px solid var(--sy-blu);color:var(--sy-blu);background:transparent;
  padding:8px 16px;border-radius:var(--sy-r-btn);
  font-family:var(--sy-font);font-weight:600;font-size:.88rem;line-height:1.6 !important;
}
body .et_pb_button.et_pb_module.sy-tel-header:hover{background:var(--sy-blu);color:var(--sy-nero);}
body .et_pb_button.et_pb_module.sy-tel-header::after{display:none !important;}
/* Prefisso "Tel." (nascosto sui telefoni per far stare il numero) */
body .et_pb_button.et_pb_module.sy-tel-header::before{content:"Tel." !important;display:inline !important;position:static;opacity:1;transform:none;font-size:inherit;line-height:inherit;font-family:var(--sy-font) !important;font-weight:inherit;}

@media (max-width:820px){
  .sy-nav .sy-menu .et_pb_menu__menu{display:none;}
}
@media (max-width:480px){
  .et_pb_row.sy-nav{height:60px;gap:12px;}
  /* resta solo "SYNAPSE" */
  .sy-header .sy-brand p,
  .sy-header .sy-brand a{font-size:0;letter-spacing:0;}
  body .et_pb_button.et_pb_module.sy-tel-header::before{display:none !important;}
  body .et_pb_button.et_pb_module.sy-tel-header{font-size:.78rem;padding:6px 10px;}
}
@media (max-width:380px){
  body .et_pb_button.et_pb_module.sy-tel-header{font-size:.72rem;padding:6px 8px;}
}

/* ---------- FOOTER ---------- */
.et_pb_section.sy-footer{
  background:var(--sy-nero-scuro);color:#8798a9;
  padding:44px 0;font-size:.88rem;border-top:1px solid var(--sy-bordo-dark);
}
.et_pb_row.sy-foot{--flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;}
.sy-foot > .et_pb_column{width:auto !important;}
.sy-footer .sy-brand strong{font-size:1.05rem;}

/* Riga dei marchi in fondo · Section "sy-marchi" */
.et_pb_section.sy-marchi{background:var(--sy-nero-scuro);color:#6c7a88;font-size:.78rem;text-align:center;padding:14px 24px;border-top:1px solid var(--sy-bordo-dark);}

/* ---------- BOTTONE WHATSAPP FLOTTANTE · modulo Button "sy-wa-float" (nel footer) ---------- */
body .et_pb_button.et_pb_module.sy-wa-float,
body .et_pb_button.et_pb_module.sy-wa-float:hover{
  position:fixed;right:20px;bottom:20px;z-index:60;
  display:inline-flex;flex-direction:row;align-items:center;gap:10px;
  background:var(--sy-whatsapp);color:#fff;border:0;
  font-family:var(--sy-font);font-weight:700;font-size:.95rem;letter-spacing:.02em;line-height:1.4 !important;
  padding:13px 20px;border-radius:999px;
  box-shadow:0 10px 30px rgba(0,0,0,.28),0 4px 14px rgba(37,211,102,.35);
  transition:transform .15s,filter .15s !important;
}
body .et_pb_button.et_pb_module.sy-wa-float:hover{filter:brightness(1.08);transform:translateY(-2px);}
body .et_pb_button.et_pb_module.sy-wa-float:focus-visible{outline:3px solid #fff;outline-offset:3px;}
body .et_pb_button.et_pb_module.sy-wa-float::after{display:none !important;}
/* Icona WhatsApp disegnata dal CSS (nessun HTML nel modulo) */
body .et_pb_button.et_pb_module.sy-wa-float::before{
  content:"" !important;display:inline-block !important;position:static;opacity:1;transform:none;
  width:22px;height:22px;flex:none;margin:0;
  background:url(../icons/ui-whatsapp.svg) center / contain no-repeat;
}
@media (max-width:480px){
  body .et_pb_button.et_pb_module.sy-wa-float{right:14px;bottom:14px;padding:12px 16px;font-size:.9rem;}
}
@media print{ body .et_pb_button.et_pb_module.sy-wa-float{display:none;} }
@media (prefers-reduced-motion: reduce){
  body .et_pb_button.et_pb_module.sy-wa-float{transition:none !important;}
  body .et_pb_button.et_pb_module.sy-wa-float:hover{transform:none;}
}