a{ color: inherit; }

@media (min-width: 1500px){
  .container{ max-width: 1280px; }
}

.imgSquare,
.imgContainer{
  position: relative;
  width: 100%;
  height: 0;
}

.imgSquare img,
.sportelloPreview img,
.imgContainer img{
  position: absolute;
  display: block;
  object-fit: cover;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.image-3x1{ padding-top: 33%; }
.image-2x1{ padding-top: 50%; }
.image-16x9{ padding-top: 56%; }
.sportelloPreview,
.image-3x2{ padding-top: 66%; }  
.image-4x3{ padding-top: 75%; }
.imgSquare,
.image-1x1{ padding-top: 100%; }  
.image-3x4{ padding-top: 133%; }  
.image-2x3{ padding-top: 150%; }
.image-1x2{ padding-top: 200%; }
.image-4x10{ padding-top: 250%; }
.image-fullHeight{ height: 100%; }

@media (min-width: 768px){
  .image-sm-3x1{ padding-top: 33%; }
  .image-sm-2x1{ padding-top: 50%; }
  .image-sm-16x9{ padding-top: 56%; }
  .image-sm-3x2{ padding-top: 66%; }
  .image-sm-4x3{ padding-top: 75%; }
  .image-sm-1x1{ padding-top: 100%; }
  .image-sm-3x4{ padding-top: 133%; }
  .image-sm-2x3{ padding-top: 150%; }
  .image-sm-1x2{ padding-top: 200%; }
  .image-sm-4x10{ padding-top: 250%; }
}

@media (min-width: 992px){
  .image-md-3x1{ padding-top: 33%; }
  .image-md-2x1{ padding-top: 50%; }
  .image-md-16x9{ padding-top: 56%; }
  .image-md-3x2{ padding-top: 66%; }
  .image-md-4x3{ padding-top: 75%; }
  .image-md-1x1{ padding-top: 100%; }
  .image-md-3x4{ padding-top: 133%; }
  .image-md-2x3{ padding-top: 150%; }
  .image-md-1x2{ padding-top: 200%; }
  .image-md-4x10{ padding-top: 250%; }
}

@media (min-width: 1200px){
  .image-lg-3x1{ padding-top: 33%; }
  .image-lg-2x1{ padding-top: 50%; }
  .image-lg-16x9{ padding-top: 56%; }
  .image-lg-3x2{ padding-top: 66%; }
  .image-lg-4x3{ padding-top: 75%; }
  .image-lg-1x1{ padding-top: 100%; }
  .image-lg-3x4{ padding-top: 133%; }
  .image-lg-2x3{ padding-top: 150%; }
  .image-lg-1x2{ padding-top: 200%; }
  .image-lg-4x10{ padding-top: 250%; }
}

.maxWidth, .maxWidth img{ width: 100% !important; display: block !important; }
.h100{ height: 100%; }
.w100, .w100 img{ width: 100%; }
.mw100, .mw100 img{ max-width: 100%; }
.w100 .elementor-button{
  width: 100%;
  justify-content: center;
}
.strong{ font-weight: 700 !important; }
.stronger{ font-weight: 900 !important; }
p:last-child{ margin-bottom: 0; }
a{ text-underline-offset: 6px; }
.cursor-pointer{ cursor: pointer; }
.mirror-x img{ transform: rotateY(180deg); }
.overflow-hidden{ overflow: hidden; }

.mymask img{
  /*mask-image: url('../images/mask-star.png');
  mask-size: 0%;
  mask-repeat: no-repeat;
  mask-position: center;*/
  /*transition: 0.3s all linear;*/
  animation: viewstar linear both;
  animation-duration: 1s;
  animation-timeline: view();
  animation-range: 10vh 90vh; /* parte a 10vh e termina a 90vh */
}

@keyframes viewstar{
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(2);
  }
  
  /*0% {
    mask-size: 0%;
  }

  50% {
    mask-size: 100%;
  }

  100% {
    mask-size: 0%;
  }*/
}

.borderFullRounded{ border-radius: 100px }
.borderRounded-1{ border-radius: 0.5rem !important; overflow: hidden; }
.borderRounded-2{ border-radius: 1.0rem !important; overflow: hidden; }
.borderRounded-3{ border-radius: 1.5rem !important; overflow: hidden; }
.borderRounded-4{ border-radius: 2.0rem !important; overflow: hidden; }

.standardLink .elementor-button{
  border-width: 0 !important;
  padding: 0 !important;
  display: inline;
}

.standardLink:not(.elementor-element){
  font-size: 1.12rem;
}

.standardLink .elementor-button-content-wrapper:hover .elementor-button-text,
.standardLink:not(.elementor-element):hover{
  text-decoration: underline;
}

.standardLink .elementor-button-content-wrapper .elementor-button-icon,
.standardLink:not(.elementor-element) img{
  transition: 0.3s all ease-in-out;
}

.standardLink .elementor-button-content-wrapper:hover .elementor-button-icon,
.standardLink:not(.elementor-element):hover img{
  transform: translateX(0.7rem);
}

.standardLink .elementor-button-icon svg,
.standardLink:not(.elementor-element) img{
  height: 1.5rem;
}

.text-gradient-blue-green,
.text-gradient-blue-green-counterNumber .elementor-counter-number-wrapper{
  background: var(--blue600);
  background: linear-gradient(to bottom right, var(--blue600), var(--green500));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.footerPolicyLinkContainer{
  display: flex;
  justify-content: flex-end;
}

.footerPolicyLinkContainer .footerPolicyLink{
  margin-right: 1rem;
}

.footerPolicyLinkContainer .footerPolicyLink:last-child{
  margin-right: 0;
}

/*.elementor-widget-n-accordion .e-n-accordion-item>.e-n-accordion-item-title{
  justify-content: space-between;
}

.elementor-widget-n-accordion .e-n-accordion-item{
  border-radius: 0.5rem;
  transition: 0.3s all ease-in-out;
  border-width: 0 !important;
}

.elementor-widget-n-accordion .e-n-accordion-item>.e-n-accordion-item-title .e-n-accordion-item-title-text{
  font-weight: 600;
}

.elementor-widget-n-accordion .e-n-accordion-item .e-n-accordion-item-title,
.elementor-widget-n-accordion .e-n-accordion-item .elementor-element{
  border-width: 0 !important;
  transition: 0.3s all ease-in-out;  
  padding-left: 0;
}

.elementor-widget-n-accordion .e-n-accordion-item {
  background-color: transparent;
  margin-bottom: 0 !important;
  border-bottom: 1px solid var(--tertiary200) !important;
  border-radius: 0;
  margin: 1rem 0;
}

.elementor-widget-n-accordion .e-n-accordion-item:last-child {
  margin-block-end: 0rem !important;
}

.elementor-widget-n-accordion:not(.arrowAccordion) .e-n-accordion-item>.e-n-accordion-item-title .e-n-accordion-item-title-icon{
  border-radius: 100px;
  border: 1px solid var(--blue600);
  width: 1rem;
  height: 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.elementor-widget-n-accordion:not(.arrowAccordion) .e-n-accordion-item>.e-n-accordion-item-title .e-n-accordion-item-title-icon span>svg {
  width: 1.5rem;
  height: 1.5rem;
}*/


.elementor-widget-n-accordion .e-n-accordion-item[open] summary{
  border-radius: 16px 16px 0 0;
}

.elementor-widget-n-accordion .e-n-accordion-item-title-icon span,
.elementor-widget-n-accordion .e-n-accordion-item-title-icon span>svg,
.elementor-widget-n-accordion .e-n-accordion-item .e-n-accordion-item-title-icon .e-closed{
  height: 24px !important;
  width: 24px !important;
}



.titleBay{
  display: flex;
  flex-direction: column;
}

.scrollspy-link{
  border-left: 3px solid var(--neutral200);
  display: inline-block;
  cursor: pointer;
  padding: 0.5rem 1rem;
  margin-bottom: 0;
}

.scrollspy-link.active{
  color: var(--primary500);
  border-left-color: var(--primary500);
}

.swiper-arrows span{
  display: inline-block;
  margin: 0 0.5rem;
  opacity: 0.6;
  cursor: pointer;
}

.swiper-arrows span:hover{
  opacity: 1;
}

.textColorGradient{
  background: linear-gradient(90deg, #005780 17.64%, #62B22F 106.2%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* TABS */
/*.elementor-widget-n-tabs .e-n-tabs-heading{
  align-self: center;
  border-radius: 100px;
  padding: 0.3rem;
  margin-bottom: 2.5rem;
}
.elementor-widget-n-tabs .e-n-tab-title{
  background-color: transparent !important;
  color: var(--tertiary600) !important;
  border-radius: 10rem;
  padding: 0.5rem 0.9rem !important;
  border: 2px solid var(--tertiary600) !important;
  margin: 0 0.25rem;
}

.elementor-widget-n-tabs .e-n-tab-title[aria-selected=true]{
  background-color: var(--tertiary600) !important;
  color: var(--neutral100) !important;
}

.blackAccordionNav.elementor-widget-n-tabs .e-n-tabs-heading{
  background: transparent;
}
.blackAccordionNav.elementor-widget-n-tabs .e-n-tab-title{
  color: var(--black) !important;
}

.blackAccordionNav.elementor-widget-n-tabs .e-n-tab-title[aria-selected=true]{
  background-color: var(--black) !important;
  color: var(--white) !important;
}*/
/* END TABS */

/* COMPARATOR TABLE */
.comparatorTable td:not(:first-child),
.comparatorTable th:not(:first-child){
  text-align: center;
}
.comparatorTable td,
.comparatorTable th{
  padding: 0.8rem;
  border-width: 0 !important;
}

.comparatorTable td:first-child{
  font-weight: 500;
}
.comparatorTable caption{
  display: none;
}

table.comparatorTable tbody>tr:nth-child(odd)>td,
table.comparatorTable tbody>tr:nth-child(odd)>th,
table.comparatorTable tbody>tr:nth-child(odd):hover>td,
table.comparatorTable tbody>tr:nth-child(odd):hover>th{
  background-color: var(--gray50);
}

table.comparatorTable tbody>tr:nth-child(even)>td,
table.comparatorTable tbody>tr:nth-child(even)>th,
table.comparatorTable tbody>tr:nth-child(even):hover>td,
table.comparatorTable tbody>tr:nth-child(even):hover>th{
  background-color: transparent;
}

.tablepress>:where(thead,tfoot)>*>th{
  background-color: transparent;
  border-block-start: 0 !important;
}
/* END COMPARATOR TABLE */

/* MENU */
#mainMenu, footer.footer{
  z-index: 10;
}

footer.footer{
  position: relative;
}

.subMenuBlockContainer{
  background-color: #00000090;
  position: fixed;
  top: var(--menu-height);
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 11;
  display: none;
  cursor: pointer;
}

.subMenuBlock{
  border-radius: 0 0 1.0rem 1.0rem;
  overflow: hidden;
  padding: 0.7rem;
  background-color: var(--white);
}

.subMenuBlockContainer .close{
  width: 2rem;
  height: 2rem;
  position: absolute;
  top: 1.8rem;
  right: 1.8rem;
  background-image: url("assets/images/icons/close.svg");
  display: block;
  background-color: var(--gray400);
  background-repeat: no-repeat;
  background-size: 40%;
  border-radius: 100rem;
  background-position: center;
  cursor: pointer;
  z-index: 3;
}

.subMenuBlockContainer a{
  text-decoration: none;
}

.elementor-counter .elementor-counter-number-wrapper{
  align-items: center;
}

.accordion.withLeftBorder .accordion-item {
  margin-bottom: 2rem;
  border-width: 0 0 0 0.2rem !important;
  border-color: var(--blue600);
  border-radius: 0 !important;
}

.accordion.withLeftBorder .accordion-item .accordion-header .accordion-button{
  box-shadow: none !important;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  background-color: transparent;
  color: var(--black);
  padding-top: 0;
  padding-bottom: 0;
  white-space: normal;
}

.accordion.withLeftBorder .accordion-item .accordion-header .accordion-button:not(.collapsed){
  background-color: transparent;
  color: var(--blue500);
}

.accordion.withLeftBorder .accordion-item .accordion-body{
  padding-bottom: 0;
}

#wpadminbar{
  bottom: 0;
  top: initial;
  position: fixed;
}

#mainMenu.navbar-expand-lg .navbar-collapse {
  justify-content: center;
}

#mainMenu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transition: 0.3s all ease-in-out;
  border-bottom: 0px;
  padding-top: 0;
  padding-bottom: 0;
  background-color: var(--purewhite);
}

button.navbar-toggler {
  padding: 0;
  height: auto;
  line-height: 0;
  border-width: 0 !important;
}

.navbar-brand svg{
  height: 2rem;
  width: auto;
}


body>.elementor>.elementor-element:first-child,
main>.page-content>.elementor>.elementor-element:first-child,
.blogHeaderSpacer{
  padding-top: var(--menu-height);
}

html{
  margin-top: 0 !important;
}

.socialShare {
  margin-right: 0.5rem;
  cursor: pointer;
}

.btnContattaci{
  background-color: var(--blue600);
  display: block;
  border-radius: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  text-align: center;
}

#mainMenu .navbar-nav .menu-item.btnContattaci>*{
  color: var(--white);
}

.navbar-toggler{
  border-width: 0;
  background-color: transparent !important;
}

.navbar-toggler-icon,
.navbar-toggler .navbar-toggler-icon{
  background-image: url("../images/menu.svg")
}

.menuAlwaysActive .navbar-toggler .navbar-toggler-icon,
.menuActive .navbar-toggler .navbar-toggler-icon{
  background-image: url("../images/menu.svg")
}

.navbar-toggler:focus{
  box-shadow: none !important;
}

.alertMessage{
  color: var(--red500);
  padding-left: 0.5rem;
  font-size: 0.9rem;
}

.errorInput, textarea.form-control.errorInput{
  border-color: var(--red500) !important;
}

.footerMenu{
  color: var(--neutral100);
  column-count: 3;
  padding-left: 0;
}

.footerMenu li{
  color: var(--neutral100);
  list-style: none;
  margin-bottom: 0.5rem;
}

.footerMenu li a{
  color: var(--neutral100);
}

.footerMenu li a:hover{
  color: var(--neutral100);
  text-decoration: underline;
}

.menuMainCta-md, .menuMainCta-lg{
  display: none;
}

@media (max-width: 991px){
  .subMenuBlockContainer{
    top: 0 !important;
    overflow: scroll;
  }

  .mobileBarContainer{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  #mainMenu .navbar-nav .menu-item>* {
    padding-top: 1.0rem;
    padding-bottom: 1.0rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  #primary-menu-list{
    text-align: center;
  }
}

@media (min-width: 768px) and (max-width: 991px){
  .menuMainCta-md{
    display: block;
  }

  .btnValutometro{
    display: none;
  }
}

@media (max-width: 1024px){
}

@media (max-width: 767px){
  .xs-w100, .xs-w100 img, .xs-w100 .elementor-button{ width: 100%; }
  .xs-mw100, .xs-mw100 img{ max-width: 100%; }
  .xs-w100 .elementor-button{
    justify-content: center;
  }
  .xs-w100 .elementor-button .elementor-button-content-wrapper{
    justify-content: center;
  }

  .comparatorTable td, .comparatorTable th {
    padding: 0.8rem 0.4rem;
    border-width: 0 !important;
  }

  .comparatorTable .row-1 img{
    max-width: 7rem;
  }

  #mainMenu.navbar-expand-lg .navbar-collapse{
    background-color: var(--white);
    padding: 1rem 0;
    border-radius: 0rem 0rem 1rem 1rem;
  }

  #mainMenu .navbar-nav .menu-item, #mainMenu .navbar-nav .menu-item>*{
    color: var(--black)
  }

  .footerMenu{
    text-align: center;
    column-count: 1;
  }

  .row-1 .column-1 img{
    max-width: 5rem;
  }

  .navbar-brand svg {
    height: 1.7rem;
  }
}

/* ===== Offcanvas mobile menu a due pannelli ===== */
#mobileMenu .offcanvas-body{ padding: 0; overflow: hidden; }
#mobileMenu .mobileMenuViewport{ height: 100%; overflow: hidden; }
#mobileMenu .mobileMenuSlider{
  display: flex;
  width: 200%;
  height: 100%;
  transition: transform .35s ease;
}
#mobileMenu .mobileMenuSlider.showServizi{ transform: translateX(-50%); }
#mobileMenu .mobileMenuPanel{
  flex: 0 0 50%;
  width: 50%;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 1rem 1.25rem 1.25rem;
  overflow-y: auto;
}
#mobileMenu .btn-close{
  position: static;
  z-index: 2;
  padding: 0 !important;
  opacity: 1;
  background-color: transparent;
  border-width: 0;
  margin: 0;
}

/* lista blocco 1 */
#mobileMenu .mobileMenuList{ list-style: none; margin: 0; padding: 0; }
#mobileMenu .mobileMenuLink{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 0;
  border-bottom: 1px solid var(--gray100);
  color: var(--gray900);
  text-decoration: none;
  font-size: 1.05rem;
}
#mobileMenu .mobileMenuList li:last-child .mobileMenuLink{ border-bottom: 0; }
#mobileMenu .mobileMenuArrow{ display: inline-flex; width: 1.25rem; height: 1.25rem; }
#mobileMenu .mobileMenuArrow svg{ width: 100%; height: 100%; }
#mobileMenu .mobileMenuArrow svg path{ stroke: var(--gray900); }

/* bottone Contattaci: spinto in fondo */
#mobileMenu .mobileMenuCta{
  margin-top: auto;
  display: flex;
  justify-content: center;
  text-align: center;
  width: 100%;
}

/* header blocco 2 */
#mobileMenu .panelServiziHeader{
  display: flex;
  align-items: center;
  gap: .75rem;
  background: none;
  border: 0;
  padding: 0 0 1.25rem;
  cursor: pointer;
  color: var(--gray900);
  font-size: 1.05rem;
}
#mobileMenu .mobileMenuArrowBack{ display: inline-flex; width: 1.25rem; height: 1.25rem; }
#mobileMenu .mobileMenuArrowBack svg{ width: 100%; height: 100%; }
#mobileMenu .mobileMenuArrowBack svg path{ stroke: var(--gray900); }

/* gruppi servizi */
#mobileMenu .serviziGroup{ margin-bottom: 1.5rem; }
#mobileMenu .serviziGroupTitle{
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .8rem;
  color: var(--gray400);
  margin: 0 0 .5rem;
}
#mobileMenu .serviziList{ list-style: none; margin: 0; padding: 0; }
#mobileMenu .serviziLink{
  display: flex;
  align-items: center;
  gap: .85rem;
  padding: .75rem 0;
  border-bottom: 1px solid var(--gray100);
  color: var(--gray900);
  text-decoration: none;
}
#mobileMenu .serviziList li:last-child .serviziLink{ border-bottom: 0; }
#mobileMenu .serviziIcon{
  flex: 0 0 2.25rem;
  width: 2.25rem;
  height: 2.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--orange200);
  border-radius: .6rem;
}
#mobileMenu .serviziIcon svg{ width: 1.25rem; height: 1.25rem; }
#mobileMenu .serviziIcon svg path{ stroke: var(--orange600); fill: none; }
#mobileMenu .serviziLabel{ font-size: 1rem; }


/* ===== Dropdown servizi desktop (#alwaysOnSubmenu) ===== */
/* chevron sulla voce menuServizi */
.menuServiziChevron{
  display: inline-flex;
  align-items: center;
  margin-left: .35rem;
  width: 1.1rem;
  height: 1.1rem;
  transition: transform .3s ease;
}
.menuServiziChevron svg{ width: 100%; height: 100%; }

/* overlay nero 50% dietro al dropdown servizi (click per chiudere) */
#servicesOverlay{
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .5);
  z-index: 1020;
}
#servicesOverlay.open{ display: block; }

/* sotto i 992px il dropdown desktop non esiste (c'è l'offcanvas mobile) */
@media (max-width: 991.98px){
  #mainMenu #alwaysOnSubmenu{ display: none; }
  #servicesOverlay{ display: none !important; }
}

@media (min-width: 992px){
  .lowerMenu .navbar-nav li.menuServizi > .nav-link{ cursor: pointer; display: flex; align-items: center; }
  li.menuServizi.isOpen .menuServiziChevron{ transform: rotate(180deg); }

  #mainMenu{ 
    /*position: relative;*/
    z-index: 1031;
  }
  
  #alwaysOnSubmenu{
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    max-width: 1040px;
    z-index: 1030;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height .3s ease, opacity .3s ease;
    border-radius: 16px;
    margin-top: 8px;
  }
  /* specificità più alta di metamer.css (#alwaysOnSubmenu) per togliere il bordo da chiuso */
  #mainMenu #alwaysOnSubmenu{ border: 0; }
  #mainMenu #alwaysOnSubmenu.open{ border-bottom: 1px solid var(--gray200); }
  #alwaysOnSubmenu.open{
    max-height: 600px;
    opacity: 1;
  }
  #alwaysOnSubmenu .inner.serviziDropdown{
    display: flex;
    gap: 2.5rem;
    justify-content: center;
    padding: 2rem 40px;
  }
  #alwaysOnSubmenu .serviziCol{ flex: 0 1 auto; }
  #alwaysOnSubmenu .serviziColTitle{
    display: block;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: .8rem;
    color: var(--gray400);
    margin: 0 0 .75rem;
    font-weight: 500;
  }
  #alwaysOnSubmenu .serviziColList{ list-style: none; margin: 0; padding: 0; }
  #alwaysOnSubmenu .serviziLink{
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: .6rem 0;
    color: var(--gray900);
    text-decoration: none;
  }
  #alwaysOnSubmenu .serviziIcon{
    flex: 0 0 2.25rem;
    width: 2.25rem;
    height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--orange200);
    border-radius: .6rem;
  }
  #alwaysOnSubmenu .serviziIcon svg{ width: 1.25rem; height: 1.25rem; }
  #alwaysOnSubmenu .serviziIcon svg path{ stroke: var(--orange600); fill: none; }
  #alwaysOnSubmenu .serviziColLabel{ font-size: 1rem; font-weight: 500; }
  /* sottoservizio della pagina corrente: label in grassetto */
  #alwaysOnSubmenu .serviziLink.is-current .serviziColLabel{ font-weight: 700; }
}


/* ===== Header trasparente su pagine menuTrasparent (primi 150px) =====
   Lo stato trasparente è il DEFAULT (nessuna classe richiesta oltre a menuTrasparent,
   già presente nell'HTML lato server) → niente flash bianco al load. Il JS aggiunge
   .menuScrolled oltre i 150px per tornare al default bianco. */
body.menuTrasparent:not(.menuScrolled) #mainMenu{ background-color: transparent; }

/* testi nav bianchi — escluso il pulsante contatti (btnOrange) */
body.menuTrasparent:not(.menuScrolled) #mainMenu .navbar-nav .menu-item:not(.btnOrange) .nav-link,
body.menuTrasparent:not(.menuScrolled) #mainMenu .navbar-nav .menu-item:not(.btnOrange) > *{
  color: var(--purewhite);
}
/* chevron "Servizi per le aziende" bianco */
body.menuTrasparent:not(.menuScrolled) #mainMenu .menuServiziChevron svg path{ stroke: var(--purewhite); }

/* logo bianco (il .svg incapsula un PNG → filter) */
body.menuTrasparent:not(.menuScrolled) #mainMenu .navbar-brand svg{ filter: brightness(0) invert(1); }

/* hamburger bianco su mobile (menu.svg è scuro, background-image → filter) */
body.menuTrasparent:not(.menuScrolled) #mainMenu .navbar-toggler-icon{ filter: brightness(0) invert(1); }


/* ===== Voce "Contatti" del menu desktop come bottone arancione (CTA) ===== */
.lowerMenu .navbar-nav .menu-item.btnOrange .nav-link{
  background-color: #FF6637;
  border: 1px solid #FF6637;
  border-radius: 12px;
  padding: 10px 18px;
  color: #18181B;
  display: inline-flex;
  align-items: center;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.lowerMenu .navbar-nav .menu-item.btnOrange .nav-link:hover{
  background-color: #FFFFFF;
  border-color: #BFBCBB;
  color: #18181B;
}

/* ── Blog CTA "Parla con un esperto" — shortcode [blog_cta_contatti] (Figma 683-14553) ── */
.blogCtaContatti{
  display: flex;
  align-items: center;
  gap: 48px;
  padding: 16px 16px 16px 24px;
  border-radius: 24px;
  overflow: hidden;
}
.blogCtaContattiBody{
  display: flex;
  flex-direction: column;
  gap: 24px;
  flex: 1 1 auto;
}
.blogCtaContattiTexts{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.blogCtaContattiTitle{
  font-family: "Mont", sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 1.2;
  letter-spacing: -0.32px;
  color: #fff;
  margin: 0;
}
.blogCtaContattiText{
  font-size: 16px;
  line-height: 1.4;
  margin: 0;
}
.blogCtaContattiBtn{
  align-self: flex-start;
  gap: 8px;
}
.blogCtaContattiBtn svg{ width: 20px; height: 20px; flex: 0 0 auto; }
.blogCtaContattiFigure{
  flex: 0 0 auto;
  width: 271px;
  max-width: 36%;
  aspect-ratio: 1 / 1;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
}
.blogCtaContattiFigure img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
@media (max-width: 767px){
  .blogCtaContatti{
    flex-direction: column-reverse;
    align-items: stretch;
    gap: 24px;
    padding: 16px;
  }
  .blogCtaContattiTitle{ font-size: 24px; letter-spacing: -0.24px; }
  .blogCtaContattiFigure{
    width: 100%;
    max-width: 100%;
    align-self: center;
    order: -1;
  }
}

/* ── Blog preview slider — shortcode [blog_preview]; dots stile Figma 491-7660 ── */
.blogPreviewSwiper{ overflow: hidden; }
.blogPreviewSwiper .swiper-wrapper{ align-items: stretch; }
.blogPreviewSwiper .swiper-slide{ height: auto; }
.blogPreviewSwiper .swiper-slide > .postPreview{ height: 100%; }

/* Pagination a barre (pill) invece dei dots tondi di default */
.blogPreviewDots.swiper-pagination{
  position: static;
  display: flex;
  justify-content: center;
  gap: 4px;
  margin-top: 24px;
}
.blogPreviewDots .swiper-pagination-bullet{
  width: 72px;
  max-width: 22vw;
  height: 6px;
  border-radius: 8px;
  background: #FAF6F5;
  opacity: 1;
  margin: 0 !important;
  transition: background-color .3s ease;
}
.blogPreviewDots .swiper-pagination-bullet-active{
  background: #FF6637;
}
/* Desktop: 3 card su 3 → slider disabilitato, dots nascosti (watchOverflow) */
.blogPreviewDots.swiper-pagination-lock{ display: none; }

/* ── Casi studio — shortcode [casi_studio_list]; card con featured image di sfondo (Figma 618-7157) ── */


.casistudio_preview.scuro svg path,
.casistudio_preview.scuro svg rect{
  stroke: #FFFFFF;
}

.casiStudioGrid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.csCard{
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 410px;
  padding: 24px;
  border-radius: 16px;
  background-color: #BFBCBB;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}
.csCard:hover{
  display: flex;
  /*transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(24,24,27,.18);*/
}
.csCardBox{
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  max-width: 420px;
  padding: 24px;
  background: #FAF6F5;
  border-radius: 12px;
}
.csCardCat{
  align-self: flex-start;
  padding: 4px 8px;
  border-radius: 8px;
  background: #fff;
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.3;
  color: #D43504;
}
.csCardText{
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.csCardHeading{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.csCardAzienda{
  margin: 0;
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.3;
  color: #807E7D;
}
.csCardTitle{
  margin: 0;
  font-family: "Mont", sans-serif;
  font-weight: 700;
  font-size: clamp(22px, 2.1vw, 32px);
  line-height: 1.2;
  letter-spacing: -0.32px;
  color: #18181B;
}
.csCardBtn{
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border: 1px solid #D9D6D5;
  border-radius: 12px;
  background: #fff;
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.3;
  color: #18181B;
  transition: background-color .2s ease, border-color .2s ease;
}
.csCard:hover .csCardBtn{
  background: #FF6637;
  border-color: #FF6637;
}
.csCardBtn svg{ width: 20px; height: 20px; flex: 0 0 auto; }
/* Tablet: card più strette → il box riempie la larghezza disponibile */
@media (max-width: 991px){
  .csCardBox{ max-width: none; }
}
/* Solo smartphone: una colonna */
@media (max-width: 575.98px){
  .casiStudioGrid{ grid-template-columns: 1fr; }
  .csCard{ min-height: 340px; padding: 16px; }
  .csCardBox{ padding: 20px; }
}

/* Casi studio preview slider: usa il markup/stile di [sided_slider_servizio]
   (.sidedSliderBlock .controllers). Le card hanno min-height fissa → pari altezza. */
.sidedSlider .swiper-slide{ height: auto; }

/* ── Team — shortcode [team_list]; card membri (Figma 101-4080) ── */
.teamGrid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.teamCard{
  background: rgba(255, 99, 51, 0.1); /* #FF6333 al 10% (Figma 101-4080) */
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
/* contenitore dei membri extra: collassabile e animato */
.teamExtra{
  max-height: 0;
  overflow: hidden;
  transition: max-height .45s ease;
}
.teamGridExtra{ margin-top: 16px; }
.teamCardImage{
  position: relative;
  aspect-ratio: 268 / 300;
  overflow: hidden;
  background: #D9D6D5; /* fondo per le foto con sfondo trasparente (come il fill Image del Figma) */
}
.teamCardImage img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  display: block;
}
.teamCardOverlay{
  position: absolute;
  left: 8px; right: 8px; bottom: 8px;
  background: #fff;
  border-radius: 8px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease;
  pointer-events: none;
}
.teamCard:hover .teamCardOverlay{ opacity: 1; transform: none; }
.teamCardBadge{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: "Figtree", sans-serif;
  font-weight: 600;
  font-size: 13px;
  line-height: 1;
  color: #D43504;
}
.teamCardBadge svg{ flex: 0 0 auto; }
.teamCardQuote{
  margin: 0;
  font-family: "Figtree", sans-serif;
  font-size: 14px;
  line-height: 1.3;
  color: #18181B;
}
.teamCardDetails{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px;
}
.teamCardInfo{ min-width: 0; }
.teamCardName{
  margin: 0;
  font-family: "Figtree", sans-serif;
  font-weight: 600;
  font-size: 18px;
  line-height: 1.2;
  color: #fff;
}
.teamCardRole{
  margin: 0;
  font-family: "Figtree", sans-serif;
  font-size: 14px;
  line-height: 1.3;
  color: #EAE6E5;
}
.teamCardLink{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
}
.teamCardLink svg{ width: 24px; height: 24px; }
.teamCardLink svg path{ fill: #fff; }
.teamListMore{
  display: flex;
  justify-content: center;
  margin-top: 32px;
}
/* Toggle "Mostra di più" / "Mostra di meno": outline — fill trasparente,
   bordo #FF6637 (--orange600), testo bianco, padding 12×16 (Figma 105:2179,
   Figtree 500/16, nessuna icona). Vale per entrambi gli stati.
   NB: selettore .teamList .teamToggle (0,2,0) per battere il Theme Style del kit
   Elementor `.elementor-kit-N button` (0,1,1) che altrimenti lo rende arancione pieno. */
.teamList .teamToggle{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  border-radius: 12px;
  background: transparent;
  border: 1px solid #FF6637;
  color: #fff;
  font-family: "Figtree", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.3;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease;
}
.teamList .teamToggle:hover{ background: #FF6637; border-color: #FF6637; color: #18181B; }
@media (hover: none){
  .teamCardOverlay{ opacity: 1; transform: none; pointer-events: auto; }
}
@media (max-width: 991px){
  .teamGrid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575.98px){
  .teamGrid{ grid-template-columns: 1fr; }
}

/* ── Team preview slider full-bleed — shortcode [team_preview] ──
   Container a tutta larghezza schermo (margine negativo simmetrico in CSS, più
   robusto del calcolo JS: nessun bug al resize). Card a larghezza fissa: Swiper
   con slidesPerView:auto + centeredSlides riempie i lati simmetricamente. */
.teamPreview{
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.teamPreviewSwiper{ overflow: hidden; }
.teamPreviewSwiper .swiper-wrapper{ align-items: stretch; }
.teamPreview .swiper-slide.teamPreviewSlide{
  width: 268px;      /* larghezza fissa (card Figma 101-4080) → 4 nel contenuto desktop */
  height: auto;
}
@media (max-width: 575.98px){
  .teamPreview .swiper-slide.teamPreviewSlide{ width: 280px; }
}

/* ── Recensioni — collapse con gradiente + toggle (template Elementor 871) ──
   La griglia masonry viene limitata in altezza e la metà inferiore sfuma a
   bianco (Figma: linear-gradient bianco α0 a 50% → α1 a 100%). Il pulsante
   "Mostra altre recensioni"/"Mostra meno" toglie/rimette la classe is-collapsed
   via JS (block-recensioni.php). Sfuma a bianco: sezione su sfondo bianco. */
.recensioniGrid{
  position: relative;
  overflow: hidden;
  --recensioni-collapsed-h: 590px; /* valore Figma (Swiper Container tablet/mobile) */
}
/* La transition è abilitata da JS (classe is-anim) solo dopo il collasso iniziale,
   così l'apertura/chiusura è animata ma al caricamento non c'è alcuna animazione. */
.recensioniGrid.is-anim{ transition: max-height .45s ease; }
.recensioniGrid.is-collapsed{
  max-height: var(--recensioni-collapsed-h);
}
@media (prefers-reduced-motion: reduce){
  .recensioniGrid.is-anim{ transition: none; }
}
.recensioniGrid.is-collapsed::after{
  content: '';
  position: absolute;
  inset: auto 0 0 0;
  height: 100%;
  background: linear-gradient(180deg, rgba(255,255,255,0) 50%, #fff 100%);
  pointer-events: none;
}
/* Nel template 871 il bottone è nascosto su tutti i breakpoint (elementor-hidden-*):
   la feature lo richiede visibile. Specificità (0,2,0) batte .elementor-hidden-* (0,1,0).
   Scopata a .recensioni-toggle-on: se la feature è disattivata (flag PHP
   BOOSTEN_RECENSIONI_TOGGLE=false) la classe non c'è e il bottone resta nascosto. */
.recensioniCollapse.recensioni-toggle-on .elementor-widget-button{ display: block !important; }
