/* stack-sans-headline-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Stack Sans Headline';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/stack-sans-headline-v1-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* stack-sans-headline-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Stack Sans Headline';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/stack-sans-headline-v1-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* stack-sans-headline-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Stack Sans Headline';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/stack-sans-headline-v1-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* stack-sans-headline-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Stack Sans Headline';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/stack-sans-headline-v1-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* stack-sans-headline-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Stack Sans Headline';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/stack-sans-headline-v1-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* stack-sans-headline-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Stack Sans Headline';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/stack-sans-headline-v1-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

html { scroll-behavior: smooth; }

html, body {
  margin: 0;
  padding: 0;
  height: 100vh;
  background-color: #fff;
}

body{font-family:'Stack Sans Headline'; font-size:1em; font-weight:300 }
strong {font-weight: 500}
.navbar-container{width: 100%;
    top: 0;
    left: 0;
    z-index:5;
}
.skip-link {
  position: absolute;
  top: -42px;
  left: 0;
  background: #000;
  color: #fff;
  border: 0;
  padding: 8px 16px;
  z-index: 100;
  text-decoration: none;
  transition: top 0.2s;
}

/* visibile solo al focus (es. Tab) */
.skip-link:focus {
  top: 0;
}

.navbar{background:none !important;}

nav.navbar {
    z-index: 10;
}
.nav-link:hover svg{fill:#ccc}
.subline{ 
	position: relative;
  text-decoration: none;
  outline-offset: 4px;
  color:#fff;
}
.nav-link:link, .nav-link:visited, .nav-link:hover {font-size:1.2em; letter-spacing: 0.1em; color: #fff}

.subline::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: .25rem;
  height: 2px;
  width: 0;
  background: currentColor;
  transform: translateX(-50%);
  transition: width 220ms ease;
}

/* hover (solo dove ha senso) */
@media (hover:hover) and (pointer:fine) {
  .nav-link:hover::after,
  .subline:hover::after {
    width: 100%;
  }
}

.nav-link svg{width: 24px; height: 24px; fill: #fff}

.btn-go{border-radius: 30px; border:#333 1px solid; background:none; color:#333; padding: 0.5rem 1.25rem; font-size: 1.1em; text-transform: uppercase; transition: opacity 1s; 
  -webkit-transition: all 0.6s ease-in-out;-moz-transition: all 0.6s ease-in-out;-o-transition: all 0.6s ease-in-out;-ms-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;
    }
  .btn-go:hover {background-color:#333; color:#fff;
  -webkit-transition: all 0.6s ease-in-out;-moz-transition: all 0.6s ease-in-out;-o-transition: all 0.6s ease-in-out;-ms-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;
    }
.btn-go svg {margin-left:0.5rem; width: 12px; height: 12px; fill:#fff; rotate: -90deg; opacity: 0;
-webkit-transition: all 0.6s ease-in-out;-moz-transition: all 0.6s ease-in-out;-o-transition: all 0.6s ease-in-out;-ms-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;
}
.btn-go:hover svg {opacity:1; -webkit-transition: all 0.6s ease-in-out;-moz-transition: all 0.6s ease-in-out;-o-transition: all 0.6s ease-in-out;-ms-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;}

.blocco-info{margin-top: 1rem}
.blocco-info p{font-size: 0.8em; font-weight: 500;}

#servicesCarousel {
  position: relative;
}
.carousel-indicators [data-bs-target] {
  width: 14px;
  height: 14px;
  border-radius: 50%; /* cerchio */
  background-color: #666;
  border:#fff 2px solid;
}

.carousel-indicators .active {
  
  background-color: #000;
}

.img-angled { border-top-left-radius: 30px; border-bottom-right-radius: 30px;

  /*  taglio angolo in alto a sinistra e in basso a destra
  clip-path: polygon(
    30px 0,        
    100% 0,
    100% calc(100% - 30px), 
    calc(100% - 30px) 100%,
    0 100%,
    0 30px
  );
*/
}
.carousel-indicators {
  bottom: -50px;   /* abbassali di quanto ti serve */
}
.btn-menu{ display:none;}

.bottom-text-container{display:flex; align-items:center; justify-content: flex-start; margin-top:3rem; min-height: 600px; background:url('../imgs/colori.svg') no-repeat; background-position: center center; background-size: cover; overflow: hidden;}
.bottom-text{margin-left:10%; max-width: 50%; background-color: rgba(255,255,255, 0.8); padding: 2rem; border-radius: 40px; font-size: 1.2em; color:#333}

.privacy ol li, .privacy-txt ul li {margin-bottom: 2rem}
.privacy a {text-decoration: underline !important; color:var(--colorblack);}
.privacy .pp-tit{font-weight: 500}

@media(max-width: 1200px)
{
  .nav-link:link, .nav-link:visited, .nav-link:hover {font-size:1em; letter-spacing: auto;}

}

@media (max-width: 991.98px) {

 .btn-menu{ display:inline-block; width:46px; height:46px; border:#fff 1px solid; border-radius: 4px; background: none; text-align: center; font-size: 0.5em !important; letter-spacing: 1px; color: #fff; text-transform: uppercase; padding: 0; z-index: 6;
 -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
.btn-menu:hover {background-color: #000; border:#fff 1px solid;  color: #fff;
 -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }

    .offcanvas {visibility: visible; opacity: 1;  pointer-events: auto; background: rgba(0,0,0,.7); /* se dark */
      backdrop-filter: blur(2px); /* opzionale */ top: 0; bottom: 0; }

    /* il corpo deve scrollare */
    .offcanvas-body {
      overflow-y: auto;
      -webkit-overflow-scrolling: touch; /* iOS momentum */
      overscroll-behavior: contain;      /* evita rimbalzi strani */
    }

    /* header appiccicoso (non obbligatorio, utile su liste lunghe) */
    .offcanvas-header {
      position: sticky;
      top: 0;
      z-index: 1;
      
    }
    .menumobile {list-style-type: none; padding-left: 1rem}
    .menumobile li{margin-bottom: 1em}
    .menumobile a {font-size:1.3em; text-decoration: none; color: #fff}

     .bottom-text{margin-left:10%; max-width: 70%;}

}


footer{width: 100%; min-height: 14px; background: #313543;
background: linear-gradient(180deg,rgba(49, 53, 67, 1) 0%, rgba(74, 80, 101, 1) 100%);}
footer a{color: #fff; text-decoration: undeline}
.bg-footer{background:url('../imgs/bg-footer.svg') no-repeat; background-position: center -2px; background-size: 600px auto; margin-top: -2px}
.bg-footer img{max-width: 140px; height: auto}
.intestazione{color: #fff; font-weight: 300; font-size: 1em}
.recapiti{color: #fff; font-weight: 300; font-size: 0.9em}
.contatti-footer{display: flex; align-items: center; justify-content: flex-end;}
.contatti-footer a {display:block; text-decoration:none; color: #fff; margin-bottom: 1em; font-size: 1em}
.contatti-footer a svg{width: 16px; height: 16px; fill: #fff; margin-right: 0.25rem}
.centro-footer{display: flex; align-items: center; justify-content: center}
.centro-footer img {max-width: 60px; height: auto}
.subfooter{width: 100%; background-color: #333; color: #fff; font-weight: 200; font-size: 0.75em; padding-top: 0.5rem; padding-bottom: 0.25rem; text-align: center; border-top:#666 1px solid}

@media (max-width: 767px) {
  .contatti-footer{order:1; justify-content: flex-start; padding-top: 2rem}
  .recapiti{order:2}
  .centro-footer{order:3; display:inline-block; margin-top: 1em; margin-bottom: 1em}

  .bottom-text{margin-left:5%; max-width: 80%; font-size: 1em;}

}

@media (max-width: 575.98px) {
  .navbar-brand img{width: 122px; height: 60px}
  .bottom-text{margin-left:5%; max-width: 90%; font-size: 0.9em; padding: 1rem;}
}
