/*
Theme Name: Kiasma
Description: Template Kiasma
Version: 1.0
Author: Sebastiano Cullemi
Author URI: https://www.sebastianocullemi.com/
*/

:root {
    --blue: #0578BE;
    --darkblue: #003353;
    --lightblue: rgba(5, 120, 190, 0.09);
}
@font-face {
  font-family: 'Aspekta';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('font/Aspekta-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Aspekta';
  font-style: normal;
  font-weight: 650;
  font-display: swap;
  src: url('font/Aspekta-650.woff2') format('woff2');
}
body{
    margin:0;
    padding: 0;
    font-family: 'Aspekta';
    font-weight: 500;
    font-size: 20px;
 }
b,strong{
    font-weight: 650;
}


/* HEADER */
.contHeader {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0px;
}
header#header {
    background: #fff;
}
/* END HEADER */

 


/* Wrapper esterno */
.wp-video {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
}

/* Container MediaElement */
.wp-video .mejs-container,
.mejs-container.wp-video-shortcode {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
  aspect-ratio: 16 / 9;
}

/* Tag video interno */
.wp-video video,
.mejs-container video.wp-video-shortcode {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
}

/* Layer interni (poster, overlay play, ecc.) */
.wp-video .mejs-inner,
.wp-video .mejs-mediaelement,
.wp-video mediaelementwrapper {
  width: 100% !important;
  height: 100% !important;
}

/* MENU */
ul#menu-mainmenu {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    padding: 0px;
    list-style: none;
    margin: 0px;
    gap: 24px;
    justify-content: flex-end;
}
ul#menu-mainmenu li {
    display: flex;
    align-items: center;
}
ul#menu-mainmenu a {
    text-decoration: none;
    color: var(--darkblue);
    font-weight: 650;
}
.btndark a {
    background: var(--blue);
    color: #fff !important;
    padding: 8px 24px !important;
    display: flex;
    border-radius: 4px;
}
/* END MENU */



/* ====== HAMBURGER ====== */
.nav-toggle{
  display:none;
  width:44px;height:44px;
  border:0;background:transparent;cursor:pointer;position:relative;
}
.nav-toggle .burger,
.nav-toggle .burger::before,
.nav-toggle .burger::after{
  content:""; position:absolute; left:8px; right:8px; height:2px; background: var(--darkblue);
  transition:.2s ease;
}
.nav-toggle .burger{ top:50%; transform:translateY(-50%); }
.nav-toggle .burger::before{ top:-8px; }
.nav-toggle .burger::after{ top:8px; }
.nav-toggle[aria-expanded="true"] .burger{ background:transparent; }
.nav-toggle[aria-expanded="true"] .burger::before{ transform:translateY(8px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .burger::after{ transform:translateY(-8px) rotate(-45deg); }

/* ====== MOBILE NAV ====== */
@media (max-width: 992px){
  .nav-toggle{ display:block; }

  /* wrapper del nav */
  .nav-wrapper{
    border-top:1px solid #eee;
  }

  /* la lista principale in versione mobile */
  #primary-nav.nav{
    display:none;                    /* chiuso di default */
    flex-direction:column;
    gap:0;
    margin:0; padding:0;
  }
  #primary-nav.nav.is-open{ display:flex; }

  #primary-nav.nav > li{
    position:relative;
    border-bottom:1px solid #eee;
  }
  #primary-nav.nav a{
    display:block;
    padding:14px 16px;
    font-weight:650;
  }

  /* toggle per i sottomenu (il pulsante con caret) */
  .submenu-toggle{
    position:absolute; right:8px; top:50%; transform:translateY(-50%);
    background:transparent; border:0; cursor:pointer;
    width:36px; height:36px; border-radius:6px;
  }
  .submenu-toggle:focus{ outline:2px solid var(--blue); outline-offset:2px; }

  .submenu-toggle .caret{
    display:inline-block; width:10px; height:10px;
    border-right:2px solid var(--darkblue); border-bottom:2px solid var(--darkblue);
    transform:rotate(45deg); transition:.2s ease;
    position:relative; top:-2px;
  }

  /* submenu chiuso/aperto */
  #primary-nav .sub-menu{
    display:none; padding:0 0 8px 0; margin:0;
    background:#fff;
  }
  #primary-nav li.submenu-open > .sub-menu{ display:block; }
  #primary-nav .sub-menu li a{ padding:10px 16px 10px 28px; font-size:14px; border-radius:6px; }

  /* caret ruotato quando aperto */
  #primary-nav li.submenu-open > .submenu-toggle .caret{ transform:rotate(-135deg); top:1px; }
}

/* Desktop: tieni il tuo dropdown a hover così com’è */



/* SUBMENU */
/* Layout base */
.nav,
.nav ul { list-style: none; margin: 0; padding: 0; }
.nav { display: flex; gap: 24px; }
.nav > li { position: relative; }

/* Link principali */
.nav a {
  display: inline-block;
  padding: 10px 8px;
  text-decoration: none;
}

/* Submenu: nascosto di default */
.nav .sub-menu {
  position: absolute;
  left: 0;
  top: 100%;
  width: 250px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
  padding: 8px;
  z-index: 50;

  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
}
li#menu-item-48 .sub-menu {
    width: 200px;
}

/* Voci del submenu */
.nav .sub-menu li a {
    display: block;
    padding: 10px 12px;
    border-radius: 6px;
    font-size: 13px;
}
.nav .sub-menu li a:hover { background: #f3f5f7; }

/* Mostra submenu su hover o focus-within del parent */
.nav li.menu-item-has-children:hover > .sub-menu,
.nav li.menu-item-has-children:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition-delay: 0s;
}

/* Indicatore freccia (opzionale) sul parent */
.nav li.menu-item-has-children > a::after {
  content: "▾";
  margin-left: 6px;
  font-size: .8em;
}
li#menu-item-37 .sub-menu {
    width: auto;
}

/* Evita che il submenu esca dallo schermo a destra (opzionale) */
.nav li.menu-item-has-children:last-child > .sub-menu {
  left: auto;
  right: 0;
}
/* END SUBMENU */






/* CONTENT */
/* Puoi inserirlo nel tuo stylesheet */
.hero-home-slider { position: relative; }
.hero-home-slider .slick-dots { bottom: 12px; }
.hero-home-slider .slick-dots li button:before { font-size: 10px; }
.hero-home-slider .slick-slide img { width: 100%; display: block; }
/* Dots bianchi */
.hero-home-slider .slick-dots li button:before {
  color: #fff;     /* colore del puntino */
  opacity: .5;     /* puntini inattivi */
}

.hero-home-slider .slick-dots li.slick-active button:before {
  color: #fff;     /* colore puntino attivo */
  opacity: 1;
}

/* (opzionale) spessore/dimensione */
.hero-home-slider .slick-dots li button:before {
  font-size: 10px; /* regola grandezza */
}
.hero-home-slide {
    height: 700px !important;
    position: relative;
    background-size: cover;
    background-position: center;
}
.overlaySlide{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 51, 83, 0.00) 0%, rgba(0, 51, 83, 0.50) 100%);
    z-index: 1;
}
.hero-home-slider{
    position: relative;
}
.sectionSlide {
    position: relative;
}
.contSlide {
    position: absolute;
    width: 80%;
    bottom: 80px;
    left: 10%;
    text-align: center;
    color: #fff;
}
.titleSlide{
    color: #FFF;
    text-align: center;
    font-size: 34px;
    font-style: normal;
    line-height: 100%; /* 34px */
}
.titleSlide b{
    font-weight: 650;
}
.contSlide a{
    display: flex;
    padding: 10px 32px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: var(--darkblue);
    background-color: #fff;
    border-radius: 8px;
    width: max-content;
    margin: 0 auto;
    font-weight: 600;
    text-decoration: none;
    font-size: 20px;
}
.slick-dotted.slick-slider {
    margin-bottom: 0px !important;
}


/* Grid contenitore */
figcaption.card-label {
    font-size: 21px;
}
.card-figure{
    height: 450px;
    position: relative;
    background-position: center;
    background-size: cover;
}
.overlayCard{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 51, 83, 0.00) 0%, rgba(0, 51, 83, 0.50) 100%);
    z-index: 1;
}
.cards-sezioni {
    display: flex;
    gap: 32px;
    margin: 72px 0px;
}
a.card-sezione {
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
}
.card-figure {
    position: relative;
}
figcaption.card-label {
    position: absolute;
    bottom: 16px;
    left: 16px;
    right: 16px;
    text-align: center;
    background: var(--blue);
    color: #fff;
    padding: 8px;
    z-index: 2;
}
.cardsProdotti {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}
.sezioneProdotti{
    background-color: var(--lightblue);
    padding: 120px 0px;
}
.titleSection{
    color: #0578BE;
    text-align: center;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%; /* 67.2px */
    margin-top: 0px;
}

.sezioneProdotti .card-figure {
    height: 300px;
    background-size: cover;
    background-position: center;
}
.ccontProduct {
    background: #fff;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.titoloProdotto{
    color: #0578BE;
    text-align: center;
    font-size: 28px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%; /* 28px */
    margin: 0px;
}
.sottotitoloProdotto {
    color: #003353;
    text-align: center;
    font-size: 19px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    margin: 0px;
    width: 70%;
    margin: 0 auto;
}
.testoProdotto{
    color: #003353;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 20.8px */
    margin: 0px;
}
.cardsProdotti a {
    text-decoration: none;
}
.contImgSX {
    display: flex;
    margin: 72px 0px;
}
.contImgSX .titolo{
    color: #0578BE;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 35.2px */
}
.contImgSX .testo p{
    color: #003353;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 23.4px */
}
a.btn {
    background: var(--blue);
    color: #fff;
    padding: 8px 32px;
    text-decoration: none;
    border-radius: 8px;
    display: inline-block;
    font-weight: 600;
}
.contBanner {
    display: flex;
    flex-direction: row;
}
.leftBanner, .rightBanner {
    width: 100%;
    height: 500px;
    background-size: cover;
    background-position: center;
    position: relative;
}
.contBanner {
    margin: 72px 0px;
    border-radius: 24px;
    overflow: hidden;
    background: linear-gradient(180deg, #0578BE 0%, #023858 100%), #0578BE;
    color: #fff;
}
.rightBanner img {
    height: 56px;
}
.rightBanner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 0px 24px;
    gap: 24px;
}
.titleBanner{
    color: #FFF;
    font-size: 40px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%; /* 40px */
    margin: 0px;
}
.textBanner{
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%; /* 21.6px */
    margin: 0px;
}
a.btnLight {
    padding: 8px 24px;
    background: #fff;
    color: var(--blue);
    text-decoration: none;
    font-weight: 600;
    border-radius: 8px;
    display: inline-block;
}
.imgSX {
    background: #FAFAFA;
}
.heropage{
    position: relative;
}
.heropage {
    background-size: cover;
    background-position: center;
}
.contHeropage{
    position: relative;
    z-index: 2;
    padding: 90px 0px;
}
p.titleHeropage {
    font-size: 32px;
    color: #fff;
    font-weight: 600;
    margin: 0px 0px 16px 0px;
    line-height: 100%;
}
p.subTitle, .heroContent p {
    margin: 0px;
    color: #fff;
    font-size: 20px;
    line-height: 110%;
}
.sezioneTop{
    background: linear-gradient(180deg, #0578BE 0%, #023858 100%);
    color: #fff;
    padding: 72px 0px;
}
.contenutoSezioneTop {
    display: flex;
    align-items: center;
    gap: 32px;
}
.contenutoSezioneTop img {
    border-radius: 16px;
}
.contenutoSezioneTop .titolo{
    color: #FFF;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 35.2px */
}
.contenutoSezioneTop .testo{
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 23.4px */
}
.contImgDX {
    display: flex;
    margin: 72px 0px;
    gap: 32px;
    align-items: center;
}
.contImgDX .titolo{
    color: #0578BE;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 35.2px */
    margin: 0px;
}
.gridCardVision {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}
.cardVision{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    border-radius: 16px;
    background: #FFF;
    box-shadow: 0 4px 60px 0 rgba(5, 120, 190, 0.20);
}
.visionmission{
    padding: 120px 0px;
    background-color: var(--lightblue);
}
.cardVision img {
    width: 100%;
}
.cardVision p {
    margin: 0px;
}
.contCardVision {
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.contCardVision .titolo{
    color: #0578BE;
    font-size: 28px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%; /* 28px */
    margin: 0px;
}
.contCardVision .testo{
    color: #003353;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 20.8px */
    margin: 0px;
}
.titoloSezione{
    color: #0578BE;
    font-size: 40px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%; /* 48px */
}
.ourStory{
    padding: 120px 0px;
}
.contenutoCard {
    background: var(--lightblue);
    display: flex;
    flex-direction: row;
    align-items: center;
    border-radius: 24px;
    overflow: hidden;
}
.cards{
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 72px 0px;
}
.leftCard {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.leftCard, .rightCard {
    width: 100%;
}
.rightCard{
    height: 350px;
    background-size: cover;
    background-position: center;
}
.leftCard .titolo{
    color: #0578BE;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 35.2px */
    margin: 0px;
}
.leftCard .testo p{
    color: #003353;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%; /* 21.6px */
}
/* base */
.cards .contenutoCard{
  display:flex;
  flex-direction: row;         /* default: normali */
  align-items: center;         /* opzionale */
  gap: 24px;                   /* opzionale */
}

/* alterna: le pari diventano invertite */
.cards .contenutoCard:nth-child(even){
  flex-direction: row-reverse;
}

/* responsive: su mobile impila in colonna */
@media (max-width: 768px){
  .cards .contenutoCard{
    flex-direction: column;    /* uguale per tutte su mobile */
  }
}

.sezioneimgsx{
    padding: 72px 0px;
    background-color: var(--lightblue);
}
.contenutosezioneimgsx {
    display: flex;
    flex-direction: row;
    gap: 24px;
    align-items: center;
}
.sezioneimgsx p.titolo {
    color: #0578BE;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
    margin-top: 0px;
}
.rightsection img {
    width: 100%;
    height: auto;
}
.contIconeWrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 32px;
    margin: 72px 0px;
}
.contIcone {
    background: var(--lightblue);
    padding: 24px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    height: 100%;
    gap: 16px;
}
.contIcone .testo{
    color: #003353;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 20.8px */
    margin: 0px;
}
.contIcone .titolo{
    color: #0578BE;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 22px */
    margin: 0px;
}
.consultation {
    background: var(--lightblue);
    padding: 120px 0px;
    text-align: center;
    color: var(--darkblue);
}
.titleConsultation {
    color: #0578BE;
    text-align: center;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 35.2px */
    margin-top: 0px;
}
.textConsultation{
    color: #003353;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 31.2px */
}
.contSteps {
    display: flex;
    gap: 24px;
}
.step {
    background: linear-gradient(180deg, #0578BE 0%, #023858 100%), #0578BE;
    color: #fff;
    padding: 24px;
    border-radius: 8px;
    line-height: 120%;
}
.numberStep {
    color: var(--darkblue);
    background: #fff;
    width: 50px;
    height: 50px;
    display: flex;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: 600;
    margin: 0 auto;
}
.contConsultation{
    background: #fff;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 4px 60px 0 rgba(5, 120, 190, 0.20);
}
.cardTecnology {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 32px;
    padding: 72px 0px;
}
figcaption.card-label {
    text-transform: uppercase;
}

.timeline{
    padding: 72px 0px;
    width: 80%;
    margin: 0 auto;
}

.labelTimeline {
    border-radius: 8px;
    background: var(--darkblue);
    color: #fff;
    font-size: 16px;
    font-style: normal;
    font-weight: 650;
    line-height: 100%;
    margin: 0px;
    padding: 8px 16px;
    width: max-content;
}
.titoloTimeline{
    color: var(--darkblue);
    font-size: 20px;
    font-style: normal;
    font-weight: 650;
    line-height: 120%; /* 28.8px */
    margin: 0px;
}
.testoTimeline{
    margin: 0px;
}
.testoTimeline p{
    color: var(--darkblue);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 24px */
    margin: 0px;
}
.sectionTimeline {
    padding: 16px;
    position: relative;
    display: flex;
    gap: 16px;
    align-items: flex-end;
    margin: 16px 0px;
    background: var(--lightblue);
    border-radius: 16px;
}
.contTimeline {
    padding: 72px 32px;
    position: relative;
}
.contTimeline::before{
    position: absolute;
    content: "";
    width: 3px;
    background: linear-gradient(180deg, rgba(5, 120, 190, 0.00) 0%, #0578BE 50%, rgba(5, 120, 190, 0.00) 100%);
    left: 0;
    top: 0;
    bottom: 0;
}
.sectionTimeline::before{
    content: "";
    position: absolute;
    left: -40px;
    top: 20px;
    height: 16px;
    width: 16px;
    background-color: var(--darkblue);
    border: 2px solid #fff;
    border-radius: 50%;
}
.imageTimeline {
    height: 150px;
    width: 150px;
    background-size: cover;
    background-position: center;
    border-radius: 8px;
    margin-top: 16px;
}
.dxTimeline {
    display: flex;
    flex-direction: column;
    background: var(--lightblue);
    padding: 24px;
    justify-content: center;
    align-items: flex-start;
    align-self: stretch;
    border-radius: 8px;
    gap: 8px;
}
.sezione1 {
    padding: 72px 0px;
    background: var(--lightblue);
    margin-bottom: 72px;
}
.leftSezione1 .titolo {
    color: #0578BE;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 35.2px */
    margin: 0px;
}
.leftSezione1 .testo {
    color: #003353;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 23.4px */
    margin: 0px;
}
.contenutoSezione1 {
    display: flex;
    flex-direction: row;
    gap: 32px;
    align-content: center;
    align-items: center;
}
.leftSezione1 {
    width: 65%;
}
.rightSezione1 {
    width: 35%;
    display: flex;
    flex-direction: row;
    gap: 16px;
}
.boxImmagineTesto img {
    width: 100%;
    border-radius: 16px;
}
.goalsSection {
    border-radius: 16px;
    background: linear-gradient(180deg, #0578BE 0%, #023858 100%), #0578BE;
    backdrop-filter: blur(6px);
    color: #fff;
    padding: 16px;
    text-align: center;
}
.goalsContainer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
}
.goalsSection {
    width: 25%;
}
p.titoloImg {
    color: var(--darkblue);
    font-weight: 600;
    margin: 4px 0px;
    line-height: 110%;
    font-size: 14px;
}
.subtitleGoals {
    color: #0578BE;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
    margin: 56px 0px 24px;
    text-align: center;
}
p.number {
    font-size: 24px;
    background: #fff;
    color: var(--blue);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}
.contenutoSezione2 {
    display: flex;
    gap: 24px;
    align-items: center;
}
.boxImmagineTesto {
    width: 100%;
}
.sezione22 {
    margin: 120px auto;
    width: 70%;
}
.titolo2{
    color: #0578BE;
    text-align: center;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 35.2px */
    margin-top: 0px;
}
.testo2{
    color: #003353;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 23.4px */
}
.supR {
  font-size: 0.6em;
  vertical-align: super;
}
.contenutoSezione1.no-image .leftSezione1 {
    width: 100%;
    margin: 40px 0px;
}
.contImmagini {
    display: flex;
    gap: 24px;
    margin-bottom: 40px;
}
.boxImmagine img {
    width: 100%;
}
.boxImmagine {
    width: 100%;
}
.wp-video-shortcode {
    margin: 40px 0px;
}
.testo img {
    width: 100%;
    border-radius: 16px;
}
h3 {
    color: var(--blue);
    font-size: 40px;
    text-transform: uppercase;
    line-height: 120%;
}
.titoloServizio {
    color: #0578BE;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 35.2px */
    margin-top: 0px;
}
.testoServizio{
    color: #003353;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 23.4px */
    margin-bottom: 72px;
}
a.btnDark {
    background: linear-gradient(180deg, #0578BE 0%, #023858 100%), #0578BE;
    color: #fff;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    width: max-content;
    padding: 16px 40px;
    font-size: 20px;
    text-decoration: none;
    border-radius: 8px;
}
.wrapContatti {
    display: flex;
    gap: 32px;
    margin: 72px 0px;
}
.leftContatti {
    padding: 24px;
    background: #0578BE;
    color: #fff;
    width: 100%;
    border-radius: 8px
}
.rightContatti {
    padding: 24px;
    background: var(--lightblue);
    color: var(--darkblue);
    width: 100%;
    border-radius: 8px
}
.leftContatti h3{
    color: #FFF;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 90%; /* 28.8px */
}
.titleForm{
    color: #0578BE;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%; /* 41.6px */
    margin-top: 0px;
    margin-bottom: 8px;
}
label {
    font-size: 16px;
}
form input, form textarea {
    width: calc(100% - 16px);
    padding: 8px;
    border: 1px solid var(--darkblue);
    border-radius: 4px;
    font-size: 16px;
    font-family: "Aspekta";
    margin-bottom: 16px;
}
form textarea {
    height: 100px;
}
input[type="checkbox"] {
    width: auto;
}
span.wpcf7-list-item span {
    font-size: 12px;
    line-height: 130%;
}
span.wpcf7-list-item {
    margin: 0px;
}
form p {
    margin: 0px;
}
input.wpcf7-form-control.wpcf7-submit.has-spinner {
    background: var(--blue);
    color: #fff;
    border-radius: 34px;
    margin-top: 16px;
}
span.wpcf7-list-item label {
    display: flex;
    flex-direction: row;
    gap: 8px;
}
span.wpcf7-spinner {
    display: none;
}
label.accettazione br {
    display: none;
}
.contIcone {
    width: 100%;
}
.contIcone {
    border-radius: 8px;
}
.text ul {
    text-align: left;
}
.acf-fancybox-gallery .acf-gallery-thumb{
  width:100%;
  height:100%;
  object-fit:cover;
  aspect-ratio: 1 / 1; /* oppure 4 / 3 */
  border-radius:12px; /* opzionale */
}
.gallery{
    margin-top: 72px;
}
.testoService{
    font-size: 20px;
    color: var(--darkblue);
    line-height: 130%;
    margin-top: 56px;
}
.leftSezione1 h4 {
    font-size: 22px;
    margin: 16px 0px;
}
.child-pages{
    margin: 72px 0px;
}
.child-pages {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 24px;
}
.imgThumb{
    height: 200px;
    background-position: center;
    background-size: cover;
    width: 100%;
    border-radius: 16px;
}
h3.h5.child-page-title.mb-2 {
    margin: 16px 0px;
    font-size: 24px;
}
.child-pages article {
    margin-bottom: 40px;
}
article.child-page-card.h-100 a {
    text-decoration: none;
    color: var(--darkblue);
}
.child-pages article {
    margin-bottom: 40px;
    background: var(--lightblue);
    padding: 16px;
    border-radius: 14px;
    text-align: center;
}
.child-pages article .btn {
    color: #fff !important;
}
/* END CONTENT */


/* FORM DOWNLOAD PDF */
.sezioneTop form input {
    width: 100% !important;
    padding: 8px 0px;
}
.sezioneTop form {
    background: rgba(255, 255, 255, 0.2);
    padding: 16px;
    border-radius: 16px;
}
p.titleBrochure {
    margin-bottom: 8px;
    font-size: 24px;
    font-weight: 600;
}
.sezioneTop form input.wpcf7-form-control.wpcf7-submit.has-spinner {
    margin: 0px;
}
.sezioneTop form {
    background: rgba(255, 255, 255, 0.2);
    padding: 16px;
    border-radius: 16px;
    width: 50%;
}
.sezioneTop form input{
    width: 100%;
}
.sezione1 form, .sezione2 form {
    background: #fff;
    padding: 16px;
    border-radius: 16px;
    width: 50%;
}
.sezione1 p.titleBrochure, .sezione2 p.titleBrochure {
    color: var(--darkblue);
}
.sezione1 .wpcf7-submit, .sezione2 .wpcf7-submit, .sezioneTop .wpcf7-submit {
    width: 100%;
    margin: 0px !important;
}
.sezione1 form .accettazione input, .sezione2 form .accettazione input, .sezioneTop form .accettazione input {
    width: auto !important;
    padding: 0px !important;
}
.sezione1 form .accettazione, .sezione2 form .accettazione, .sezioneTop form .accettazione{
    display: inline-block !important;
    margin-bottom: 14px;
}
 .sezioneTop form .accettazione a{
    color: #fff;
}
.sezione1 form .accettazione a, .sezione2 form .accettazione a{
    color: var(--blue);
}
/* END FORM DOWNLOAD PDF */




/* FOOTER */
footer {
    padding: 64px 0px;
    background: var(--lightblue);
    color: var(--darkblue);
    margin-top: 56px;
}
img.logofoo {
    height: 47px;
    display: block;
    margin-bottom: 24px;
}
footer p {
    font-size: 14px;
}
footer ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    text-align: right;
    gap: 4px;
    margin: 0px;
    padding: 0px;
}
footer ul a {
    color: var(--blue);
    font-weight: 650;
    text-decoration: none;
}
p.copyright {
    margin-bottom: 0px;
    padding-top: 16px;
    margin-top: 16px;
    border-top: 1px solid #0578be4a;
}
footer h2 {
    color: var(--blue);
    font-size: 16px;
    margin-top: 0px;
}
/* END FOOTER */






/* VARIE */
a#back-to-top {
    background: var(--blue);
    color: #fff;
    height: 48px;
    width: 48px;
    display: flex;
    border-radius: 9999px;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    font-size: 20px;
    position: fixed;
    left: 16px;
    bottom: 16px;
    z-index: 100;
}
/* END VARIE */
ul#primary-nav a {
    color: var(--darkblue);
}

button.submenu-toggle {
    display: none;
}



/* RESPONSIVE */

/* SMALL DESKTOP */
@media only screen and (min-width : 1025px) and (max-width : 1198px) {

}
/* IPAD */
@media (min-width: 768px) and (max-width: 1024px) {

}

/* IPAD LANDSCAPE */
@media (min-width: 768px) and (max-width: 1024px) and (orientation:landscape) {

}

/* IPAD PORTRAIT */
@media (min-width: 768px) and (max-width: 1024px) and (orientation:portrait){

}

/* SMARTPHONE */
@media only screen and (min-width: 320px) and (max-width: 767px) {
ul#primary-nav {
    position: absolute;
    right: 0;
    top: 120px;
    z-index: 10;
    width: 250px;
    right: 25px;
}
.acf-fancybox-gallery {
    grid-template-columns: 1fr 1fr !important;
}
.child-pages {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}
.sezione1 form, .sezione2 form, .sezioneTop form {
    width: 100%;
}
.nav li.menu-item-has-children > a::after{
    display: none;
}
ul#primary-nav li {
    background: #fff;
}
button.nav-toggle {
    background: var(--lightblue);
    border-radius: 50%;
    color: var(--blue) !important;
}
button.submenu-toggle {
    display: block;
}
.titleSlide {
    color: #FFF;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
}
.contSlide {
    position: absolute;
    width: 90%;
    bottom: 80px;
    left: 5%;
    text-align: center;
    color: #fff;
}
.hero-home-slide {
    height: 400px !important;
    position: relative;
    background-size: cover;
    background-position: center;
}
.card-figure {
    height: 250px;
    position: relative;
    background-position: center;
    background-size: cover;
}
.cards-sezioni {
    display: flex;
    gap: 32px;
    margin: 72px 0px;
    flex-direction: column;
}
p.titleSection {
    font-size: 30px;
}
.sezioneProdotti {
    background-color: var(--lightblue);
    padding: 40px 0px;
}
.cardsProdotti {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}
.sezioneProdotti .card-figure {
    height: 210px;
    background-size: cover;
    background-position: center;
}
p.titoloProdotto {
    font-size: 20px;
}
p.sottotitoloProdotto {
    font-size: 16px;
    width: 100%;
}
.contImgSX {
    display: flex;
    margin: 72px 0px;
    flex-direction: column;
    align-items: center;
}
.contImgSX img {
    width: 60%;
    margin: 0 auto;
    display: block;
}
.contImgSX .titolo {
    text-align: center;
    font-size: 24px;
}
.contImgSX .testo p {
    color: #003353;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    text-align: center;
}
a.btn {
    background: var(--blue);
    color: #fff;
    padding: 14px 32px;
    text-decoration: none;
    border-radius: 8px;
    display: inline-block;
    font-weight: 600;
    font-size: 20px;
    margin: 0 auto;
    display: block;
    text-align: center;
}
.contBanner {
    display: flex;
    flex-direction: column;
}
.leftBanner {
    height: 200px;
}
.rightBanner {
    height: auto;
    padding: 40px 30px;
    width: auto;
}
footer ul {
    list-style: none;
    display: flex
;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    text-align: left;
    gap: 4px;
    margin: 0px;
    padding: 0px;
}

.contenutoSezioneTop {
    display: flex
;
    align-items: center;
    gap: 32px;
    flex-direction: column;
}
.sezioneTop {
    background: linear-gradient(180deg, #0578BE 0%, #023858 100%);
    color: #fff;
    padding: 40px 0px;
}
.contImgDX {
    display: flex
;
    margin: 72px 0px;
    gap: 32px;
    align-items: center;
    flex-direction: column;
}
.right img {
    width: 100%;
}
.gridCardVision {
    display: grid
;
    grid-template-columns: 1fr;
    gap: 16px;
    width: 80%;
    margin: 0 auto;
}
.sectionTimeline {
    padding: 0px;
    position: relative;
    display: flex
;
    gap: 16px;
    align-items: flex-start;
    margin: 16px 0px 80px;
    background: transparent;
    border-radius: 16px;
    flex-direction: column;
}
.sectionTimeline::before {
    content: "";
    position: absolute;
    left: -40px;
    top: 8px;
    height: 16px;
    width: 16px;
    background-color: var(--darkblue);
    border: 2px solid #fff;
    border-radius: 50%;
}
.imageTimeline {
    height: 150px;
    width: 293px;
    background-size: cover;
    background-position: center;
    border-radius: 8px;
    margin-top: 16px;
}
.timeline {
    padding: 72px 0px;
    width: 90%;
    margin: 0 auto;
}

.leftCard .titolo {
    color: #0578BE;
    font-size: 28px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
    margin: 0px;
}
.leftCard {
    width: auto;
}
.cards .contenutoCard:nth-child(even) {
    flex-direction: column-reverse;
}
.cards .contenutoCard {
        flex-direction: column-reverse;
    }
.rightCard {
    height: 200px;
    background-size: cover;
    background-position: center;
}
.contenutoCard {
    border: 1px solid #ededed;
}
.contenutosezioneimgsx {
    display: flex
;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    text-align: center;
}
.leftsection img {
    width: 70%;
    margin: 0 auto;
    display: block;
}
.contIconeWrapper {
    display: flex
;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    margin: 72px 0px;
}
.contSteps {
    display: flex
;
    gap: 24px;
    flex-direction: column;
}
.cardTecnology {
    display: grid
;
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 72px 0px;
}
.contenutoSezione1 {
    display: flex
;
    flex-direction: column;
    gap: 32px;
    align-content: center;
    align-items: center;
}
.leftSezione1 {
    width: 100%;
}
.rightSezione1 {
    width: 100%;
    display: flex
;
    flex-direction: row;
    gap: 16px;
}
.goalsSection {
    width: 100%;
}
.text p {
    font-size: 15px;
    line-height: 100%;
}
.contenutoSezione2 {
    display: flex
;
    gap: 24px;
    align-items: center;
    flex-direction: column;
}
.sezione22 {
    margin: 120px auto;
    width: 100%;
}
.goalsSection ul {
    text-align: left;
}
a.btnLight {
    font-size: 20px;
    display: flex
;
    flex-direction: row;
    width: auto;
}
.wrapContatti {
    display: flex
;
    gap: 32px;
    margin: 72px 0px;
    flex-direction: column;
}
.rightContatti, .leftContatti {
    width: auto;
}
.leftContatti h3 {
    color: #FFF;
    font-size: 25px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
}
.contHeader a img {
    height: 40px;
}
ul#primary-nav {
        position: absolute;
        right: 0;
        top: 85px;
        z-index: 10;
        width: 250px;
        right: 13px;
    }
}