:root {
    /* palette cliente */
    --colore-nero: #111111;
    --colore-bianco: #ffffff;
    --colore-grigio: #cccccc;
    --colore-grigioscuro: #5c5c5c;
    
    --colore-sfondo: #2e3668;
    --colore-sfondo2: #25577d; 
    --colore-link: #f9dc0a;
    --colore-linkhover: #ffc400;

    --colore-testo: #111111;

    --colore-bordo: #25577d;
    --colore-bordo2: #d6d6d6;

    --gmd-radius: 3px;
    --gmd-focus: 0 0 0 3px rgba(250, 224, 22, 0.28);
    
  --content-offset: 50vh;
  --fondino-gap: 300px;
}

.jl-icon-button {
    border-radius: 0;
}

@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;500;700&display=swap');

#g-navigation,
#g-navigation .g-main-nav,
#g-navigation .g-main-nav a {
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 500;
  letter-spacing: 0.5px;
}

#g-toolbar,
#g-toolbar .g-main-nav,
#g-toolbar .g-main-nav a {
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 300;
  letter-spacing: 0.1px;
}

#g-toolbar .jl-navbar {
box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
    padding: 0 5px;
    }


/* MENU PRINCIPALE */
#g-navigation .el-horiz-nav li.item-type-component, #g-navigation .el-horiz-nav li.item-type-heading {
    width: 120px;
    height: 120px;
    padding: 5px;
    text-align: center;
    background: rgba(46, 54, 104, 0.75);
    box-shadow: 0 5px 12px rgba(0, 0, 0, .15);
    margin: 10px 0 0;
    line-height: 1.3;
     transition: all 0.35s ease;
  transform-origin: top center;
      transform: rotateX(0deg);
box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}


#g-navigation .el-horiz-nav li.item-type-component:hover, #g-navigation .el-horiz-nav li.item-type-heading:hover {
 transform: perspective(600px) rotateX(22deg) skewX(0deg);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
}


#g-navigation .jl-navbar-dropdown-nav .jl-nav-sub a {
    color: var(--colore-bianco);
     font-size: 10pt; 
}

#g-navigation .jl-navbar-dropdown-nav .jl-nav-sub a:hover {
    color: var(--colore-linkhover);
}




#g-navigation .jl-navbar-dropdown {
    width: fit-content;
     }

#g-navigation .jl-logo {
padding: 30px 0 0 0;
    }

#g-navigation .jl-logo img {
filter: drop-shadow(0 15px 30px rgba(255,255,255,0.8));
    }


/* -------------------------------
 dedicato alla HOMEPAGE
----------------------------------- */

/* hero fissa dietro */
.homepage #g-header {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100vh;
  z-index: 1;
  overflow: hidden;
}

/* intro sopra la hero */
.homepage #g-intro {
  position: relative;
  z-index: 3;
  margin-top: calc(100vh - 130px);
  background: transparent; 
}

/* resto pagina sopra header */
.homepage #g-container-main,
.homepage #g-footer {
  position: relative;
  z-index: 3;
}

/* wrapper normale */
.homepage #g-intro .intro-shell {
  position: relative;
  background: transparent;   
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

/* menu normale */
.homepage #g-intro .intro-menu {
  display: flex;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
background: transparent; 
  z-index: 20;
}

/* menu fisso */
.homepage #g-intro .intro-menu.is-fixed {
  position: fixed;
  top: 220px;
  left: 50%;
  transform: translateX(-50%);
  width: min(1200px, calc(100% - 40px));
  z-index: 1000;
    background: var(--colore-sfondo);
}

/* placeholder */
.homepage #g-intro .intro-menu-placeholder {
  display: none;
  height: 0;
}

.homepage #g-intro .intro-menu-placeholder.is-active {
  display: block;
}

/* link */
.homepage #g-intro .intro-menu a {
  text-decoration: none;
  cursor: pointer;
  position: relative;
text-transform: uppercase;
    font-size: 20px;
    font-family: "Roboto Condensed", sans-serif;
  color: var(--colore-bianco);
padding: 10px 20px;
  transition: color 0.2s ease;
}

.homepage #g-intro .intro-menu a:hover {
  color: var(--colore-link);
  transition: color 0.2s ease;
}


/* scrollspy */
.homepage #g-intro .intro-menu a.is-active {
  color: var(--colore-link, #f9dc0a);
    background: var(--colore-bianco);
}



/* contenuto normale di pagina */
.homepage #g-intro .intro-content {
  position: relative;
  z-index: 1;
  background: transparent;  
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  padding: 0;
margin: -10px;
}

.homepage #g-intro .intro-content section {
  padding: 40px 0 0;
}

.homepage #g-intro .intro-content section + section {
  margin-top: 20px;
}

.homepage #g-intro .intro-content-clip {
    background: var(--colore-bianco);
    margin-top: 30px;
    padding: 60px 40px;
  will-change: clip-path;
}

.intro-content .titolo-sezione {
  padding: 20px 0;
    margin-bottom: 20px;
    text-align: center;
    text-transform: uppercase;
    color: var(--colore-sfondo);
}

.intro-content .titolo-sezione::after {
  content: "";
  display: block;
  width: 300px;
  height: 2px;
  background: var(--colore-link);
  margin: 30px auto 0;
}


.intro-content .sottotitolo-sezione {
    padding: 0;
    text-align: center;
    text-transform: uppercase;
    font-weight: 300;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    font-size: 24px;
    color: var(--colore-sfondo);
}

/* contenitore dei bottoni */
.container-bottone {
    padding: 40px 0;
  display: flex;
  justify-content: center;   
  gap: 20px;                
  flex-wrap: wrap;   
}


/* singolo bottone */
.container-bottone .bottone a {
  width: 140px;
  height: 140px;
  border: 1px solid var(--colore-grigio);
  display: flex;
    flex-direction: column; 
  justify-content: center;   
  align-items: center;      
  text-align: center;
     text-decoration: none;
  color: var(--colore-nero);
    text-transform: uppercase;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 15px;
    line-height: 1.4;
  transition: all 0.35s ease;
transform-origin: left center;
box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}

.container-bottone .bottone {
word-break: break-word;
}

/* hover */
.container-bottone .bottone a:hover {
  color: var(--colore-linkhover);
      border: 1px solid var(--colore-nero);
   transform: perspective(600px) rotateY(-18deg) skewY(-2deg);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
}


.intro-content .droppicspictures {
    display: flex;
    justify-content: space-around;
}

.homepage #g-mainbar {
    background: var(--colore-bianco);
}

.homepage .immagine-principale {
    display: block;
    padding: 30px 10px 20px;
    margin-bottom: 50px;
    border-bottom: solid 1px var(--colore-link);
    margin-left: auto;
    margin-right: auto;
    height: 30vh;
    transition: height 0.35s ease;
 filter: drop-shadow(0 15px 30px rgba(255,255,255,0.8)); 
    
}

.homepage .tm-content {
/*  filter: drop-shadow(0 1px 10px rgba(255,255,255,0.8));  */
}

/*  --------------- */

.homepage #g-header .jl-panel {
 z-index: 2;}


.homepage #g-header .jl-position-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.15) 60%, rgba(0, 0, 0, 0.45) 100%);
    pointer-events: none;
}

.homepage #g-header .tm-title {
        font-size: 2.5rem;
        line-height: 1.2;
    text-shadow: 0px 4px 4px rgb(0 0 0 / 60%),
        0px 14px 10px rgba(0, 0, 0, 0.15),
        0px 24px 2px rgba(0, 0, 0, 0.1),
        0px 34px 30px rgba(0, 0, 0, 0.1);
}

.homepage #g-header .tm-meta {
        font-size: 3.5rem;
        line-height: 1.2;
text-shadow: 0px 4px 4px rgb(0 0 0 / 60%),
             0px 14px 10px rgba(0,0,0,0.15),
             0px 24px 2px rgba(0,0,0,0.1),
             0px 34px 30px rgba(0,0,0,0.1);
}
   
.homepage #g-header .tm-content {
        font-size: 1.5rem;
    line-height: 1.2;
text-shadow: 0px 4px 4px rgb(0 0 0 / 60%),
             0px 14px 10px rgba(0,0,0,0.15),
             0px 24px 2px rgba(0,0,0,0.1),
             0px 34px 30px rgba(0,0,0,0.1);
}

/*  ----------- */



.homepage #g-header h2 {
    font-weight: 600;
    line-height: 1.5;
}

.homepage #g-header .jl-button {
    border-radius: 100%;
    height: 60px;
    width: 60px;
    border: solid 1px var(--colore-link);
    color: var(--colore-grigio);
    font-size: 30px;
    font-weight: 300;
    padding: 15px 10px;
    line-height: 1;
}

.homepage #g-header .jl-button-default:hover {
    background-color: rgba(255, 255, 255, 0.60);
    color: var(--colore-link);
}


.homepage #g-header .jl-button .fa-solid {
  animation: bounce 1.8s infinite;
}

@keyframes bounce {
  0%,20%,50%,80%,100% { transform: translateY(0); }
  40% { transform: translateY(8px); }
  60% { transform: translateY(4px); }
}


/* -------------------------------
 dedicato al resto PAGINE INTERNE
----------------------------------- */

/* HERO BACKGROUND */
.hero-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  display: block;
  transition: opacity 0.3s ease-out;
  will-change: opacity;
}


/* FONDINO */
.hero-fondino {
  position: fixed;
  top: calc(var(--content-offset) + var(--fondino-gap));
  left: 0;
  width: 100%;
  height: calc(100vh - var(--content-offset) - var(--fondino-gap));
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}

.hero-fondino img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  display: block;
}

/* OVERLAY SOPRA L’IMMAGINE */
.hero-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 35%,
    rgba(0, 0, 0, 0.25) 60%,
    rgba(0, 0, 0, 0.75) 100%
  );
  pointer-events: none;
}


/* FOOTER FONDINO */
.footer-fondino {
  position: absolute;
  top: 0; /* quanto deve stare sopra il footer */
  left: 0;
  width: 100%;

  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}

.footer-fondino img {
  width: 100%;
  height: auto;
  display: block;
}


/* -------------------------------
 per tutti i blocchi di contenuto 
----------------------------------- */

.com-content-article__body, #g-footer, #g-subfooter {
  position: relative;
  z-index: 2;
}



/* CONTENUTO */
#g-mainbar {
    background: none;
}


.page-header {
  position: relative;
  z-index: 2;
}

.com-content-article {
    position: relative;
}

.com-content-article.com-content-article-hero {
    margin-top: var(--content-offset);
}

.intestazione-pagina h1 {
color: var(--colore-bianco);
    text-transform: uppercase;
    font-size: 3rem;
}

.intestazione-pagina .sottotitolo {
    display: inline-block;
    padding: 10px 0 20px;
    font-size: 2rem;
border-top: solid 2px var(--colore-link);
    color: var(--colore-bianco);
}

.corpo-pagina {
  background: rgba(255,255,255,0);
  transition: background 0.3s ease-out;
    margin: 20px auto;
    padding: 4rem 2rem;
}

.icona img {
    padding: 0 20px;
}


.descrizione {
    padding: 0 20px;
    font-size: 22px;
    line-height: 1.6;
    font-weight: 300;
}

.immagini-principali .droppicsgallerydefault {
    width: 100%;
}

.immagini-principali .droppicsgallerydefault .droppicspictures {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}


/* NO hero */
.com-content-article-nohero {
    padding-top: 120px; /* da calibrare */
}

.com-content-article-nohero .intestazione-pagina h1 {
    color: var(--colore-sfondo);
    font-size: 2.4rem;
}

.com-content-article-nohero .sottotitolo {
        color: var(--colore-testo);
        font-size: 1.8rem;
}



/* -------------------------------
 CASE HISTORY
----------------------------------- */

.view-category .casehistory .cliente{
    font-size: 1rem;
    font-weight: 400;
    margin-bottom: 0;
}

.casehistory {
  margin-top: 10px;
}

.casehistory .cliente{
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: .2rem;
}

.casehistory .cliente::before{
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f007"; /* user */
    color: var(--colore-link);
    margin-right: .5rem;
}

.casehistory .luogo{
    font-size: .95rem;
    color: #777;
    margin-bottom: 2rem;
}

.casehistory .luogo::before{
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f3c5"; /* location-dot */
    color: var(--colore-grigio);
    margin-right: .5rem;
}

.casehistory .testo{
    margin-top: 0;
}

/* =========================================================
   PAGINE PRODOTTO GMD
   ========================================================= */

.gmd-section {
  position: relative;
  width: 100%;
  padding: 80px 20px;
}

.gmd-section + .gmd-section {
  margin-top: 10px;
}

.gmd-section h2,
.gmd-section h3,
.gmd-section p {
  margin-top: 0;
}

.gmd-section h2,
.gmd-section h3,
.gmd-eyebrow,
.gmd-section-number {
  font-family: "Roboto Condensed", sans-serif;
}

.gmd-section h2 {
  color: var(--colore-sfondo);
  font-size: clamp(1.7rem, 2.2vw, 2.5rem);
  line-height: 1.08;
  font-weight: 700;
  text-transform: uppercase;
}

.gmd-section h3 {
  color: var(--colore-sfondo);
  font-size: 1.35rem;
  line-height: 1.2;
  font-weight: 700;
}

.gmd-section p {
  line-height: 1.65;
}

.gmd-section-grid {
  display: grid;
  grid-template-columns: minmax(220px, 30%) minmax(0, 70%);
  gap: 70px;
  align-items: start;
}

.gmd-section-heading {
  position: relative;
  padding-left: 28px;
  border-left: 3px solid var(--colore-link);
}

.gmd-section-heading h2 {
  margin-bottom: 25px;
     font-size: clamp(1.4rem, 2vw, 1.8rem);
}

.gmd-section-heading p {
  max-width: 320px;
  color: var(--colore-grigioscuro);
  font-size: 1rem;
}

.gmd-section-number {
  display: block;
  margin-bottom: 18px;
  color: var(--colore-linkhover);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.gmd-section-content {
  min-width: 0;
}

.gmd-editor-content {
  color: var(--colore-testo);
  font-size: 1.08rem;
  line-height: 1.75;
}

.gmd-cta .gmd-editor-content {
  color: var(--colore-bianco);
  font-size: 1.1rem;
  line-height: 1.75;
}

.gmd-editor-content > :first-child {
  margin-top: 0;
}

.gmd-editor-content > :last-child {
  margin-bottom: 0;
}


/* Titoli centrali */

.gmd-title-block {
  max-width: 850px;
  margin: 0 auto 55px;
  text-align: center;
}

.gmd-title-block h2 {
  margin-bottom: 20px;
}

.gmd-title-block p {
  max-width: 700px;
  margin-right: auto;
  margin-bottom: 0;
  margin-left: auto;
  color: var(--colore-grigioscuro);
  font-size: 1.08rem;
}

.gmd-eyebrow {
  display: block;
  margin-bottom: 14px;
  color: var(--colore-linkhover);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}


/* Griglie card */

.gmd-card-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 25px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.gmd-card-grid-3 > .gmd-card {
  flex: 0 0 calc((100% - 50px) / 3);
  max-width: calc((100% - 50px) / 3);
}

.gmd-card {
  position: relative;
  overflow: hidden;
  padding: 35px;
  border: 1px solid var(--colore-bordo2);
  background: var(--colore-bianco);
  transition:
    transform 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease;
}

.gmd-card:hover {
  transform: translateY(-7px);
  border-color: var(--colore-link);
  box-shadow:
    rgba(0, 0, 0, 0.08) 0 18px 30px,
    rgba(0, 0, 0, 0.04) 0 5px 10px;
}

.gmd-card h3 {
  margin-bottom: 14px;
}

.gmd-card p {
  margin-bottom: 0;
  color: var(--colore-grigioscuro);
}

.gmd-card-icon {
  display: flex;
  width: 58px;
  height: 58px;
  margin-bottom: 25px;
  align-items: center;
  justify-content: center;
  background: var(--colore-sfondo);
  color: var(--colore-link);
  font-size: 1.4rem;
}

.gmd-card-topline {
  position: absolute;
  top: 0;
  left: 0;
  width: 65px;
  height: 4px;
  background: var(--colore-link);
  transition: width 0.35s ease;
}

.gmd-card:hover .gmd-card-topline {
  width: 100%;
}


/* Vantaggi */

.gmd-benefits {
  background: rgba(255, 255, 255, 0.96);
}

.gmd-benefit-card {
  min-height: 245px;
}


/* Caratteristiche tecniche */

.gmd-technical-section {
  background: rgba(238, 241, 245, 0.96);
}

.gmd-feature-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--colore-bordo2);
}

.gmd-feature-list li {
  display: flex;
  min-height: 85px;
  padding: 22px 25px;
  align-items: center;
  gap: 18px;
  border-right: 1px solid var(--colore-bordo2);
  border-bottom: 1px solid var(--colore-bordo2);
  background: rgba(255, 255, 255, 0.55);
}

.gmd-feature-list li:nth-child(even) {
  border-right: 0;
}

.gmd-feature-icon {
  display: flex;
  width: 30px;
  min-width: 30px;
  height: 30px;
  align-items: center;
  justify-content: center;
  background: var(--colore-link);
  color: var(--colore-sfondo);
  font-size: 0.75rem;
}


/* Soluzioni */

.gmd-solutions {
  background: rgba(255, 255, 255, 0.96);
}

.gmd-solution-card {
  min-height: 360px;
}

.gmd-mini-list {
  margin: 22px 0 0;
  padding: 18px 0 0;
  border-top: 1px solid var(--colore-bordo2);
  list-style: none;
}

.gmd-mini-list li {
  position: relative;
  padding: 5px 0 5px 20px;
  color: var(--colore-grigioscuro);
}

.gmd-mini-list li::before {
  content: "";
  position: absolute;
  top: 13px;
  left: 0;
  width: 7px;
  height: 7px;
  background: var(--colore-link);
}


/* Settori */

.gmd-sectors {
  background: var(--colore-sfondo);
}

.gmd-sectors .gmd-title-block h2 {
  color: var(--colore-bianco);
}

.gmd-sectors .gmd-title-block p {
  color: rgba(255, 255, 255, 0.72);
}

.gmd-sector-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  border-left: 1px solid rgba(255, 255, 255, 0.15);
}

.gmd-sector-item {
  display: flex;
  min-height: 155px;
  padding: 25px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 18px;
  border-right: 1px solid rgba(255, 255, 255, 0.15);
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  color: var(--colore-bianco);
  text-align: center;
  transition:
    background 0.3s ease,
    color 0.3s ease;
}

.gmd-sector-item i {
  color: var(--colore-link);
  font-size: 2rem;
  transition: transform 0.3s ease;
}

.gmd-sector-item span {
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.05rem;
  font-weight: 500;
  text-transform: uppercase;
}

.gmd-sector-item:hover {
  background: rgba(255, 255, 255, 0.08);
}

.gmd-sector-item:hover i {
  transform: translateY(-5px);
}


/* Accordion */

.gmd-applications {
  background: rgba(255, 255, 255, 0.96);
}

.gmd-accordion {
  border-top: 1px solid var(--colore-bordo2);
}

.gmd-accordion-item {
  border-bottom: 1px solid var(--colore-bordo2);
}

.gmd-accordion-item summary {
  display: flex;
  min-height: 90px;
  padding: 20px 5px;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  cursor: pointer;
  list-style: none;
}

.gmd-accordion-item summary::-webkit-details-marker {
  display: none;
}

.gmd-accordion-title {
  display: flex;
  align-items: center;
  gap: 20px;
  color: var(--colore-sfondo);
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.4rem;
  font-weight: 700;
  text-transform: uppercase;
}

.gmd-accordion-icon {
  display: flex;
  width: 48px;
  min-width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  background: rgba(46, 54, 104, 0.08);
  color: var(--colore-sfondo);
}

.gmd-accordion-toggle {
  position: relative;
  width: 25px;
  min-width: 25px;
  height: 25px;
}

.gmd-accordion-toggle::before,
.gmd-accordion-toggle::after {
  content: "";
  position: absolute;
  top: 12px;
  left: 3px;
  width: 19px;
  height: 2px;
  background: var(--colore-sfondo);
  transition: transform 0.25s ease;
}

.gmd-accordion-toggle::after {
  transform: rotate(90deg);
}

.gmd-accordion-item[open] .gmd-accordion-toggle::after {
  transform: rotate(0);
}

.gmd-accordion-item[open] .gmd-accordion-icon {
  background: var(--colore-link);
}

.gmd-accordion-content {
  padding: 0 65px 30px 73px;
}

.gmd-accordion-content p {
  margin-bottom: 0;
  color: var(--colore-grigioscuro);
}


/* Consulenza */

.gmd-consulting {
  background: rgba(238, 241, 245, 0.96);
}

.gmd-consulting-box {
  display: grid;
  grid-template-columns: 110px minmax(250px, 1.2fr) minmax(350px, 1fr);
  gap: 45px;
  padding: 55px;
  align-items: center;
  background: var(--colore-bianco);
  box-shadow: rgba(0, 0, 0, 0.07) 0 15px 35px;
}

.gmd-consulting-icon {
  display: flex;
  width: 90px;
  height: 90px;
  align-items: center;
  justify-content: center;
  background: var(--colore-sfondo);
  color: var(--colore-link);
  font-size: 2rem;
}

.gmd-consulting-content h2 {
  margin-bottom: 20px;
  font-size: clamp(1.8rem, 2.5vw, 2.7rem);
}

.gmd-consulting-content p {
  margin-bottom: 0;
  color: var(--colore-grigioscuro);
}

.gmd-consulting-factors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.gmd-factor {
  padding: 20px;
  border-left: 2px solid var(--colore-link);
  background: rgba(46, 54, 104, 0.05);
}

.gmd-factor span {
  color: var(--colore-linkhover);
  font-family: "Roboto Condensed", sans-serif;
  font-size: 0.82rem;
  font-weight: 700;
}

.gmd-factor p {
  margin: 7px 0 0;
  color: var(--colore-sfondo);
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
}


/* CTA */

.gmd-cta {
  overflow: hidden;
  padding: 75px 55px;
  background:
    linear-gradient(
      120deg,
      rgba(46, 54, 104, 1) 0%,
      rgba(37, 87, 125, 1) 100%
    );
}

.gmd-cta::before {
  content: "";
  position: absolute;
  top: -120px;
  right: -80px;
  width: 330px;
  height: 330px;
  border: 70px solid rgba(255, 255, 255, 0.035);
  border-radius: 50%;
}

.gmd-cta-content {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 50px;
}

.gmd-cta-text {
  max-width: 760px;
}

.gmd-cta h2 {
  margin-bottom: 20px;
  color: var(--colore-bianco);
}

.gmd-cta p {
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 1.08rem;
}

.gmd-button {
  display: inline-flex;
  min-height: 58px;
  padding: 15px 24px;
  align-items: center;
  justify-content: center;
  gap: 20px;
  border: 2px solid var(--colore-link);
  background: var(--colore-link);
  color: var(--colore-sfondo);
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    background 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease;
}

.gmd-button:hover,
.gmd-button:focus {
  transform: translateY(-3px);
  background: transparent;
  color: var(--colore-bianco);
  text-decoration: none;
}

.gmd-button:focus-visible,
.gmd-accordion-item summary:focus-visible {
  outline: none;
  box-shadow: var(--gmd-focus);
}


.clienti .com-content-article  {
    line-height: 1.3;
  }

/* =========================================================
   contatti
   ========================================================= */

.gmd-contatti {
  padding-left: 50px;
}

.gmd-contatti .contatto {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 18px;
  padding: 16px 18px;
  border-left: 3px solid var(--colore-link);
  background: rgba(0, 0, 0, 0.025);
}

.gmd-contatti .contatto i {
  width: 30px;
  flex: 0 0 24px;
  margin-top: 3px;
  color: var(--colore-link);
  font-size: 1.3rem; 
  text-align: center;
}

.gmd-contatti .contatto strong,
.gmd-contatti .contatto a,
.gmd-contatti .contatto span,
.gmd-contatti .contatto small {
  display: block;
}

.gmd-contatti .contatto strong {
  margin-bottom: 3px;
}

.gmd-contatti .contatto a {
  color: inherit;
  text-decoration: none;
}

.gmd-contatti .contatto a:hover {
  color: var(--colore-link);
}

.gmd-contatti .contatto small {
  margin-top: 2px;
  opacity: 0.7;
}

.contatto::before{
    font-family:"Font Awesome 6 Free";
    font-weight:600;
    color:var(--colore-sfondo);
    width: 1.3rem;
        font-size: 1.3rem;
    text-align:center;
}

.telefono::before{
    content:"\f095";
}

.whatsapp::before{
    font-family:"Font Awesome 6 Brands";
    font-weight:400;
            font-size: 1.6rem;
        color:#25D366;
    content:"\f232";
}

.assistenza::before,
.amministrazione::before{
    content:"\f0e0";
}

.sede::before{
    content:"\f3c5";
}



/* =========================================================
   404
   ========================================================= */

.gmd-error-page {
    max-width: 820px;
    margin: 0 auto;
    padding: 90px 30px 110px;
    text-align: center;
}

.gmd-error-code {
    margin-bottom: -28px;
    font-size: clamp(7rem, 18vw, 13rem);
    font-weight: 800;
    line-height: 0.8;
    color: rgba(0, 0, 0, 0.04);
}

.gmd-error-icon {
    position: relative;
    margin-top: -70px;
    margin-bottom: 20px;
    font-size: 4rem;
    color: var(--colore-link, #f2c400);
}

.gmd-error-page h1 {
    margin: 0 0 25px;
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1.08;
}

.gmd-error-page p {
    max-width: 680px;
    margin: 0 auto 16px;
    font-size: 1.08rem;
    line-height: 1.7;
}

.gmd-error-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 36px;
}


.gmd-error-page .bottone i {
    padding: 0 0 10px 0;
    font-size: 1.8rem;
    --fa-style: 400;
}
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media only all and (max-width: 1100px) {

  .gmd-card-grid-3 > .gmd-card {
    flex-basis: calc((100% - 25px) / 2);
    max-width: calc((100% - 25px) / 2);
  }

  .gmd-sector-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gmd-consulting-box {
    grid-template-columns: 90px minmax(0, 1fr);
  }

  .gmd-consulting-factors {
    grid-column: 1 / -1;
  }

  #g-footer .g-container {
        align-items: center;
        text-align: center;
    } 
    
  #g-footer .g-container li a {
      display: block;
        align-items: center;
        text-align: center !important;
    } 
    
    
}


@media only all and (max-width: 800px) {

  .gmd-section {
    padding: 60px 15px;
  }

  .gmd-section-grid {
    grid-template-columns: 1fr;
    gap: 35px;
  }

  .gmd-section-heading {
    padding-left: 20px;
  }

  .gmd-section-heading h2 br {
    display: none;
  }

  .gmd-section-heading p {
    max-width: none;
  }

  .gmd-feature-list {
    grid-template-columns: 1fr;
  }

  .gmd-feature-list li {
    border-right: 0;
  }

  .gmd-cta {
    padding: 60px 30px;
  }

  .gmd-cta-content {
    align-items: flex-start;
    flex-direction: column;
  }
    
      .gmd-contatti {
    padding-left: 0;
    margin-top: 35px;
  }

}


@media only all and (max-width: 600px) {

  .gmd-section {
    padding: 50px 10px;
  }

  .gmd-card-grid-3 > .gmd-card {
    flex-basis: 100%;
    max-width: 100%;
  }

  .gmd-sector-grid,
  .gmd-consulting-factors {
    grid-template-columns: 1fr;
  }

  .gmd-card {
    padding: 28px;
  }

  .gmd-benefit-card,
  .gmd-solution-card {
    min-height: 0;
  }

  .gmd-sector-item {
    min-height: 115px;
  }

  .gmd-consulting-box {
    grid-template-columns: 1fr;
    gap: 30px;
    padding: 30px;
  }

  .gmd-consulting-icon {
    width: 70px;
    height: 70px;
  }

  .gmd-accordion-title {
    gap: 14px;
    font-size: 1.12rem;
  }

  .gmd-accordion-icon {
    width: 42px;
    min-width: 42px;
    height: 42px;
  }

  .gmd-accordion-content {
    padding: 0 10px 25px 56px;
  }

  .gmd-cta {
    padding: 50px 25px;
  }

  .gmd-button {
    width: 100%;
  }
    
        .gmd-error-page {
        padding: 60px 20px 80px;
    }

    .gmd-error-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .gmd-error-button {
        width: 100%;
    }

}


/* =========================================================
   INTRO + SOMMARIO PAGINA PRODOTTO
   ========================================================= */

html {
    scroll-behavior: smooth;
}

.gmd-section[id] {
    scroll-margin-top: 150px;
}


/* =========================================================
   Layout
  ========================================================= */

.gmd-icona-sezione {
    text-align: center;
    padding: 20px;
}

.gmd-page-intro {

    display: grid;
    grid-template-columns: minmax(260px,30%) minmax(0,70%);
    gap: 45px;

    align-items: start;

    margin: 70px 20px 80px;

}


/* =========================================================
   Testo introduttivo
   ========================================================= */

.gmd-page-intro-title {

    margin: 0;
    padding-right: 20px;

    text-align: left;

}

.gmd-page-intro-title h2 {

    margin: 10px 0 18px;

    color: var(--colore-sfondo);

    font-family: "Roboto Condensed", sans-serif;

    font-size: clamp(1.4rem,2vw,1.8rem);

    line-height: 1.1;

    font-weight: 700;

    text-transform: uppercase;

}

.gmd-page-intro-title p {

    color: var(--colore-grigioscuro);

    font-size: 1.05rem;

    line-height: 1.6;

}


/* =========================================================
   Sommario
   ========================================================= */

.gmd-page-index{

    width:100%;

}

.gmd-page-index-links{

    display:grid;

    grid-template-columns:repeat(3,minmax(0,1fr));

    gap:18px;

}


/* =========================================================
   Card
   ========================================================= */

.gmd-page-index-links a,
.gmd-page-index-last a{

    position:relative;

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    aspect-ratio:1/1;

    padding:24px;

    overflow:hidden;

    border:1px solid var(--colore-bordo2);

    background:var(--colore-bianco);

    color:var(--colore-sfondo);

    text-decoration:none;

    box-shadow:
        rgba(0,0,0,.05) 0 8px 16px,
        rgba(0,0,0,.02) 0 2px 6px;

    transition:
        .35s ease;

}

.gmd-page-index-links a::before,
.gmd-page-index-last a::before{

    content:"";

    position:absolute;

    top:0;
    right:0;

    width:65px;
    height:65px;

    border-top:1px solid rgba(46,54,104,.08);
    border-right:1px solid rgba(46,54,104,.08);

    transform:translate(18px,-18px) rotate(45deg);

}

.gmd-page-index-links a:hover,
.gmd-page-index-last a:hover{

    transform:translateY(-6px);

    border-color:var(--colore-link);

    color:var(--colore-sfondo);

    text-decoration:none;

    box-shadow:
        rgba(0,0,0,.10) 0 18px 28px,
        rgba(0,0,0,.04) 0 8px 12px;

}


/* =========================================================
   Numero
   ========================================================= */

.gmd-index-number{

    color:var(--colore-linkhover);

    font-family:"Roboto Condensed",sans-serif;

    font-size:.82rem;

    font-weight:700;

    letter-spacing:.18em;

    line-height:1;

}


/* =========================================================
   Titolo
   ========================================================= */

.gmd-index-label{

    margin-top:auto;

    padding-top:30px;

    color:var(--colore-sfondo);

    font-family:"Roboto Condensed",sans-serif;

    font-size:1.15rem;

    line-height:1.08;

    font-weight:700;

    text-transform:uppercase;

}


/* =========================================================
   Riga gialla
   ========================================================= */

.gmd-index-line{
    display:block;
    width:48px;
    height:3px;
    margin-top:20px;
    background:var(--colore-link);
    transition:width .35s ease;

}

.gmd-page-index-links a:hover .gmd-index-line,
.gmd-page-index-last a:hover .gmd-index-line{

    width:100%;

}


/* =========================================================
   Ultima card
   ========================================================= */

.gmd-page-index-last{
    display:flex;
    justify-content:center;
    margin-top:18px;
}

.gmd-page-index-last a {
    width:calc((100% - 36px)/3);

}


/* =========================================================
   Focus
   ========================================================= */

.gmd-page-index-links a:focus-visible,
.gmd-page-index-last a:focus-visible{
    outline:none;
    border-color:var(--colore-link);
}


/* =========================================================
   Tablet
   ========================================================= */

@media only all and (max-width:1000px){
    
    .gmd-page-intro{
        grid-template-columns:1fr;
        gap:40px;
    }

    .gmd-page-intro-title{
        padding-right:0;
        max-width:700px;
    }
    
        .g-content {
    margin: 5px;
    padding: 5px;
}

    .corpo-pagina {
    padding: 2rem 10px;
}
}


@media only all and (max-width:760px){
    .gmd-page-index-links{
        grid-template-columns:repeat(2,1fr);
    }

    .gmd-page-index-last a{
        width:calc((100% - 18px)/2);
    }
}

@media only all and (min-width: 30.01rem) and (max-width: 47.99rem) {
    .g-container {
        width: 90vw;
    }
}

/* =========================================================
   Smartphone
   ========================================================= */

@media only all and (max-width:560px) {
    
.homepage #g-header .tm-meta  {
    font-size: 2rem;
}
    
 .homepage #g-header .tm-title {
    font-size: 1.5rem;
}
     .homepage #g-header .tm-content {
    font-size: 1.2rem;
}
    
    .homepage .immagine-principale {
    height: 25vh;
}
    
    .homepage #g-intro .intro-menu a {
        font-weight: bold;
    font-size: 14px;
    padding: 10px 10px;
}
    
    .homepage #g-intro .intro-menu {
    gap: 10px;
    }
}

@media only all and (max-width:480px) {
    
    .homepage .immagine-principale {
    height: 20vh;
}
    
    .gmd-page-intro{
        margin:50px 10px 60px;
    }

    .gmd-page-index-links{
        grid-template-columns:1fr;
    }

    .gmd-page-index-last a{
        width:100%;
    }

    .gmd-page-index-links a,
    .gmd-page-index-last a{
        aspect-ratio:auto;
        min-height:150px;
    }
    
        .homepage #g-intro .intro-menu a {
        font-weight: bold;
    font-size: 12px;
    padding: 10px 5px;
}
 
}

