/* ---------------------------------------------


Table of contents


------------------------------------------------


01. font & reset css


02. reset


03. global styles


04. header


05. banner


06. features


07. testimonials


08. contact


09. footer


10. preloader


11. search


12. portfolio





--------------------------------------------- */


/*


---------------------------------------------


font & reset css


---------------------------------------------


*/


@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');


/*


---------------------------------------------


reset


---------------------------------------------


*/


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div


pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q,


s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,


figure, header, nav, section, article, aside, footer, figcaption {


  margin: 0;


  padding: 0;


  border: 0;


  outline: 0;


  font-family: 'Montserrat', sans-serif;





.clearfix:after {


  content: ".";


  display: block;


  clear: both;


  visibility: hidden;


  line-height: 0;


  height: 0;


}





.clearfix {


  display: inline-block;


}





html[xmlns] .clearfix {


  display: block;


}





* html .clearfix {


  height: 1%;


}





ul, li {


  padding: 0;


  margin: 0;


  list-style: none;


}





header, nav, section, article, aside, footer, hgroup {


  display: block;


}





* {


  box-sizing: border-box;


}





html, body {


  font-family: 'Montserrat', sans-serif;


  font-weight: 400;


  background-color: #fff;


  font-size: 16px;


  -ms-text-size-adjust: 100%;


  -webkit-font-smoothing: antialiased;


  -moz-osx-font-smoothing: grayscale;


}





a {


  text-decoration: none !important;


}





h1, h2, h3, h4, h5, h6 {


  margin-top: 0px;


  margin-bottom: 0px;


}





ul {


  margin-bottom: 0px;


}





p {


  font-size: 14px;


  line-height: 25px;


  color: #132d58;


}





/*


---------------------------------------------


global styles


---------------------------------------------


*/


html,


body {


  background: #fff;


  font-family: 'Montserrat', sans-serif;


}





::selection {


  background: #2ba1ce;


  color: #132d58;


}





::-moz-selection {


  background: #fb5849;


  color: #fff;


}





@media (max-width: 991px) {


  html, body {


    overflow-x: hidden;


  }


  .mobile-top-fix {


    margin-top: 30px;


    margin-bottom: 0px;


  }


  .mobile-bottom-fix {


    margin-bottom: 30px;


  }


  .mobile-bottom-fix-big {


    margin-bottom: 60px;


  }


}





.main-white-button a {


  font-size: 13px;


  color: #1f9b76;


  background-color: #fff;


  padding: 12px 25px;


  display: inline-block;


  border-radius: 3px;


  font-weight: 600;


  transition: all .3s;


}





.main-white-button a:hover {


  opacity: 0.9;


}





.main-text-button a {


  font-size: 13px;


  color: #fff;


  font-weight: 600;


  transition: all .3s;


}





.main-text-button a:hover {


  opacity: 0.9;


}





.section-heading h6 {


  position: relative;


  font-size: 15px;


  font-weight: 500;


  letter-spacing: 2px;


  text-transform: uppercase;


}











.section-heading h2 {


  line-height: 40px;


  margin-top: 20px;


  margin-bottom: 25px;


  font-size: 30px;


  font-weight: 900;


  color: #132D58;


}








/*


---------------------------------------------


header


---------------------------------------------


*/







.background-header {


  background-color: #fff;


  height: 80px!important;


  position: fixed!important;


  top: 0px;


  left: 0px;


  right: 0px;


  box-shadow: 0px 0px 10px rgba(0,0,0,0.15)!important;


}





.background-header .logo,


.background-header .main-nav .nav li a {


  color: #606972!important;


}





.background-header .main-nav .nav li:hover a {


  color: #2BA1CE!important;


}





.background-header .nav li a.active {


  color: #2BA1CE!important;


}





.header-area {


  background-color: #fff;


  position: absolute;


  top: 0px;


  left: 0px;


  right: 0px;


  z-index: 100;


  height: 100px;


  -webkit-transition: all .5s ease 0s;


  -moz-transition: all .5s ease 0s;


  -o-transition: all .5s ease 0s;


  transition: all .5s ease 0s;


}





.header-area .main-nav {


  min-height: 80px;


  background: transparent;


}





.header-area .main-nav .logo {


  line-height: 100px;


  color: #fff;


  font-size: 23px;


  font-weight: 700;


  text-transform: uppercase;


  letter-spacing: 2px;


  float: left;


  -webkit-transition: all 0.3s ease 0s;


  -moz-transition: all 0.3s ease 0s;


  -o-transition: all 0.3s ease 0s;


  transition: all 0.3s ease 0s;


}





.background-header .main-nav .logo {


  line-height: 75px;


}





.background-header .nav {


  margin-top: 20px !important;


}





.header-area .main-nav .nav {


  float: right;


  margin-top: 30px;


  margin-right: 0px;


  background-color: transparent;


  -webkit-transition: all 0.3s ease 0s;


  -moz-transition: all 0.3s ease 0s;


  -o-transition: all 0.3s ease 0s;


  transition: all 0.3s ease 0s;


  position: relative;


  z-index: 999;


}





.header-area .main-nav .nav li {


  padding-left: 15px;


  padding-right: 15px;


}





.header-area .main-nav .nav li:last-child {


  padding-right: 0px;


}





.header-area .main-nav .nav li a {


  display: block;


  font-weight: 600;


  font-size: 15px;


  color: #132d58;


  text-transform: capitalize;


  -webkit-transition: all 0.3s ease 0s;


  -moz-transition: all 0.3s ease 0s;


  -o-transition: all 0.3s ease 0s;


  transition: all 0.3s ease 0s;


  height: 40px;


  line-height: 40px;


  border: transparent;


  letter-spacing: 1px;


}





.header-area .main-nav .nav li a {


  color: #606972;


}





.header-area .main-nav .nav li:hover a,


.header-area .main-nav .nav li a.active {


  color: #132d58!important;


}





.background-header .main-nav .nav li:hover a,


.background-header .main-nav .nav li a.active {


  color: #132d58!important;


  opacity: 1;


}





.header-area .main-nav .nav li.submenu {


  position: relative;


  padding-right: 30px;


}





.header-area .main-nav .nav li.submenu:after {


  font-family: FontAwesome;


  content: "\f107";


  font-size: 12px;


  color: #606972;


  position: absolute;


  right: 18px;


  top: 12px;


}





.background-header .main-nav .nav li.submenu:after {


  color: #606972;


}





.header-area .main-nav .nav li.submenu ul {


  position: absolute;


  width: 200px;


  box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);


  overflow: hidden;


  top: 50px;


  opacity: 0;


  transform: translateY(+2em);


  visibility: hidden;


  z-index: -1;


  transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;


}





.header-area .main-nav .nav li.submenu ul li {


  margin-left: 0px;


  padding-left: 0px;


  padding-right: 0px;


}





.header-area .main-nav .nav li.submenu ul li a {


  opacity: 1;


  display: block;


  background: #f7f7f7;


  color: #606972!important;


  padding-left: 20px;


  height: 40px;


  line-height: 40px;


  -webkit-transition: all 0.3s ease 0s;


  -moz-transition: all 0.3s ease 0s;


  -o-transition: all 0.3s ease 0s;


  transition: all 0.3s ease 0s;


  position: relative;


  font-size: 13px;


  font-weight: 400;


  border-bottom: 1px solid #eee;


}





.header-area .main-nav .nav li.submenu ul li a:hover {


  background: #fff;


  color: #2BA1CE!important;


  padding-left: 25px;


}





.header-area .main-nav .nav li.submenu ul li a:hover:before {


  width: 3px;


}





.header-area .main-nav .nav li.submenu:hover ul {


  visibility: visible;


  opacity: 1;


  z-index: 1;


  transform: translateY(0%);


  transition-delay: 0s, 0s, 0.3s;


}





.header-area .main-nav .menu-trigger {


  cursor: pointer;


  display: block;


  position: absolute;


  top: 33px;


  width: 32px;


  height: 40px;


  text-indent: -9999em;


  z-index: 99;


  right: 40px;


  display: none;


}





.background-header .main-nav .menu-trigger {


  top: 23px;


}





.header-area .main-nav .menu-trigger span,


.header-area .main-nav .menu-trigger span:before,


.header-area .main-nav .menu-trigger span:after {


  -moz-transition: all 0.4s;


  -o-transition: all 0.4s;


  -webkit-transition: all 0.4s;


  transition: all 0.4s;


  background-color: #1e1e1e;


  display: block;


  position: absolute;


  width: 30px;


  height: 2px;


  left: 0;


}





.background-header .main-nav .menu-trigger span,


.background-header .main-nav .menu-trigger span:before,


.background-header .main-nav .menu-trigger span:after {


  background-color: #1e1e1e;


}





.header-area .main-nav .menu-trigger span:before,


.header-area .main-nav .menu-trigger span:after {


  -moz-transition: all 0.4s;


  -o-transition: all 0.4s;


  -webkit-transition: all 0.4s;


  transition: all 0.4s;


  background-color: #1e1e1e;


  display: block;


  position: absolute;


  width: 30px;


  height: 2px;


  left: 0;


  width: 75%;


}





.background-header .main-nav .menu-trigger span:before,


.background-header .main-nav .menu-trigger span:after {


  background-color: #1e1e1e;


}





.header-area .main-nav .menu-trigger span:before,


.header-area .main-nav .menu-trigger span:after {


  content: "";


}





.header-area .main-nav .menu-trigger span {


  top: 16px;


}





.header-area .main-nav .menu-trigger span:before {


  -moz-transform-origin: 33% 100%;


  -ms-transform-origin: 33% 100%;


  -webkit-transform-origin: 33% 100%;


  transform-origin: 33% 100%;


  top: -10px;


  z-index: 10;


}





.header-area .main-nav .menu-trigger span:after {


  -moz-transform-origin: 33% 0;


  -ms-transform-origin: 33% 0;


  -webkit-transform-origin: 33% 0;


  transform-origin: 33% 0;


  top: 10px;


}





.header-area .main-nav .menu-trigger.active span,


.header-area .main-nav .menu-trigger.active span:before,


.header-area .main-nav .menu-trigger.active span:after {


  background-color: transparent;


  width: 100%;


}





.header-area .main-nav .menu-trigger.active span:before {


  -moz-transform: translateY(6px) translateX(1px) rotate(45deg);


  -ms-transform: translateY(6px) translateX(1px) rotate(45deg);


  -webkit-transform: translateY(6px) translateX(1px) rotate(45deg);


  transform: translateY(6px) translateX(1px) rotate(45deg);


  background-color: #1e1e1e;


}





.background-header .main-nav .menu-trigger.active span:before {


  background-color: #1e1e1e;


}





.header-area .main-nav .menu-trigger.active span:after {


  -moz-transform: translateY(-6px) translateX(1px) rotate(-45deg);


  -ms-transform: translateY(-6px) translateX(1px) rotate(-45deg);


  -webkit-transform: translateY(-6px) translateX(1px) rotate(-45deg);


  transform: translateY(-6px) translateX(1px) rotate(-45deg);


  background-color: #1e1e1e;


}





.background-header .main-nav .menu-trigger.active span:after {


  background-color: #1e1e1e;


}





.header-area.header-sticky {


  min-height: 80px;


}





.header-area .nav {


  margin-top: 30px;


}





.header-area.header-sticky .nav li a.active {


  color: #fb5849;


}





@media (max-width: 1200px) {


  .header-area .main-nav .nav li {


    padding-left: 12px;


    padding-right: 12px;


  }


  .header-area .main-nav:before {


    display: none;


  }


  .Modern-Slider .item .img-fill {


    height: 500px; /* Riduciamo leggermente l'altezza per schermi medi */


  }


}





@media (max-width: 767px) {


  .header-area .main-nav .logo {


    color: #1e1e1e;


  }


  .header-area.header-sticky .nav li a:hover,


  .header-area.header-sticky .nav li a.active {


    color: #2ba1ce!important;


    opacity: 1;


  }


  .header-area.header-sticky .nav li.search-icon a {


    width: 100%;


  }


  .header-area {


    background-color: #f7f7f7;


    padding: 0px 15px;


    height: 100px;


    box-shadow: none;


    text-align: center;


  }


  .header-area .container {


    padding: 0px;


  }


  .header-area .logo {


    margin-left: 30px;


  }


  .header-area .menu-trigger {


    display: block !important;


  }


  .header-area .main-nav {


    overflow: hidden;


  }


  .header-area .main-nav .nav {


    float: none;


    width: 100%;


    display: none;


    -webkit-transition: all 0s ease 0s;


    -moz-transition: all 0s ease 0s;


    -o-transition: all 0s ease 0s;


    transition: all 0s ease 0s;


    margin-left: 0px;


  }


  .header-area .main-nav .nav li:first-child {


    border-top: 1px solid #eee;


  }


  .header-area.header-sticky .nav {


    margin-top: 100px !important;


  }


  .header-area .main-nav .nav li {


    width: 100%;


    background: #fff;


    border-bottom: 1px solid #eee;


    padding-left: 0px !important;


    padding-right: 0px !important;


  }


  .header-area .main-nav .nav li a {


    height: 50px !important;


    line-height: 50px !important;


    padding: 0px !important;


    border: none !important;


    background: #f7f7f7 !important;


    color: #191a20 !important;


  }


  .header-area .main-nav .nav li a:hover {


    background: #eee !important;


    color: #2ba1ce!important;


  }


  .header-area .main-nav .nav li.submenu ul {


    position: relative;


    visibility: inherit;


    opacity: 1;


    z-index: 1;


    transform: translateY(0%);


    transition-delay: 0s, 0s, 0.3s;


    top: 0px;


    width: 100%;


    box-shadow: none;


    height: 0px;


  }


  .header-area .main-nav .nav li.submenu ul li a {


    font-size: 12px;


    font-weight: 400;


  }


  .header-area .main-nav .nav li.submenu ul li a:hover:before {


    width: 0px;


  }


  .header-area .main-nav .nav li.submenu ul.active {


    height: auto !important;


  }


  .header-area .main-nav .nav li.submenu:after {


    color: #3B566E;


    right: 25px;


    font-size: 14px;


    top: 15px;


  }


  .header-area .main-nav .nav li.submenu:hover ul, .header-area .main-nav .nav li.submenu:focus ul {


    height: 0px;


  }


  .Modern-Slider .item .img-fill {


    height: 400px; /* Altezza dedicata per il mobile */


  }





  /* Opzionale: se vuoi che lo slider occupi metà dello schermo del telefono */


  /* height: 50vh; */





  .Modern-Slider .NextArrow,


  .Modern-Slider .PrevArrow {


    width: 40px;


    height: 40px;


    line-height: 35px;


    font-size: 25px;


  }


}





@media (min-width: 767px) {


  .header-area .main-nav .nav {


    display: flex !important;


  }


}


.main-nav .logo img {

    width: 180px;      /* Cambia questo valore per decidere la grandezza (es. 150px o 200px) */

    height: auto;      /* Mantiene le proporzioni corrette */

    transition: all 0.3s ease; /* Rende fluido il ridimensionamento */

}



@media (max-width: 767px) {

    .main-nav .logo img {

        width: 140px; /* Più piccolo per schermi mobile */

    }

}







/*


---------------------------------------------


banner


---------------------------------------------


/* --- POSIZIONAMENTO TESTO SU SLIDE (OTTIMIZZATO) --- */





.Modern-Slider .item {


    position: relative;


}





.Modern-Slider .info-overlay {


    position: absolute;


    top: 0;


    left: 0;


    width: 100%;


    height: 100%;


    display: flex;


    align-items: flex-start; /* Attacca al top */


    justify-content: flex-end; /* Attacca a destra */


    z-index: 10;


}





.Modern-Slider .info-overlay .inner-content {


    margin-top: 100px;


    margin-right: 40px;


    text-align: right;


    max-width: 700px;


    animation: fadeInUp 1s ease;


}





.Modern-Slider .info-overlay h4 {


    color: #132D58;


    font-size: 54px;


    font-weight: 900;


    text-transform: uppercase;


    background: #ffffff;


    display: inline-block;


    padding: 10px 25px;


    border-radius: 5px;


    margin-bottom: 10px;


    letter-spacing: 1px;


    box-shadow: -5px 5px 15px rgba(0,0,0,0.2);


    /* Correzione per non uscire dallo schermo */


    white-space: normal;


    word-wrap: break-word;


}





.Modern-Slider .info-overlay p {


    color: #ffffff;


    font-size: 24px;


    font-weight: 700;


    text-shadow: 2px 2px 10px rgba(0,0,0,0.8);


    background: rgba(19, 45, 88, 0.8);


    display: inline-block;


    padding: 6px 15px;


    line-height: 1.2;


}





/* --- RESPONSIVE SMARTPHONE --- */


@media (max-width: 768px) {


    .Modern-Slider .info-overlay .inner-content {


        margin-top: 70px; /* Evita il menu mobile */


        margin-right: 15px;


        max-width: 85%;


    }





    .Modern-Slider .info-overlay h4 {


        font-size: 24px; /* Dimensione bilanciata per smartphone */


        padding: 8px 12px;


        line-height: 1.1;


    }





    .Modern-Slider .info-overlay p {


        font-size: 14px;


        padding: 5px 10px;


        display: inline; /* Fa sì che lo sfondo segua bene le righe */


        line-height: 1.8;


    }





    .Modern-Slider .item .img-fill {


        height: 450px !important; /* Forza l'altezza su mobile */


    }


}





@keyframes fadeInUp {


    from { opacity: 0; transform: translateY(30px); }


    to { opacity: 1; transform: translateY(0); }


}


/* --- PULIZIA BOTTONI SLIDER --- */


.Modern-Slider .NextArrow, .Modern-Slider .PrevArrow {


    background-color: #132D58; /* Coordinate con il blu brand */


    opacity: 0.6;


}





.Modern-Slider .NextArrow:hover, .Modern-Slider .PrevArrow:hover {


    background-color: #132D58;


    opacity: 1;


}





#top {


  padding-top: 100px;


}





#top .col-lg-4,


#top .col-lg-8 {


  padding: 0px;


}





#top .left-content {


  background-image: url(../images/top-left-bg.jpg);


  background-position: center center;


  background-repeat: no-repeat;


  background-size: cover;


  position: relative;


  width: 100%;


  height: 100%;


}





#top .left-content .inner-content {


  position: absolute;


  top: 50%;


  transform: translate(-50%, -50%);


  left: 50%;


}





#top .left-content h4 {





  color: #fff;


  font-size: 54px;


  font-weight: 700;


}





#top .left-content h6 {


  font-size: 15px;


  text-transform: uppercase;


  font-weight: 600;


  color: #fff;


  letter-spacing: 3px;


  margin-top: 5px;


}





#top .left-content .main-white-button  {


  margin-top: 25px;


  margin-bottom: 10px;


}





#top .left-content .main-white-button a {


  display: inline-block;


}





/* ==== Main CSS === */


.img-fill{


  width: 100%;


  display: block;


  overflow: hidden;


  position: relative;


  text-align: center


}





.img-fill img {


  min-height: 100%;


  min-width: 100%;


  position: relative;


  display: inline-block;


  max-width: none;


}





*,


*:before,


*:after {


  -webkit-box-sizing: border-box;


  box-sizing: border-box;


  -webkit-font-smoothing: antialiased;


  -moz-osx-font-smoothing: grayscale;


}





.Grid1k {


  padding: 0 15px;


  max-width: 1200px;


  margin: auto;


}





.blocks-box,


.slick-slider {


  margin: 0;


  padding: 0!important;


}





.slick-slide {


  float: left /* If RTL Make This Right */ ;


  padding: 0;


}





/* ==== Slider Style === */


.Modern-Slider .item .img-fill {


  height: 700px; /* Altezza fissa per desktop */


  background: #000;


  display: block;


}





.Modern-Slider .item .img-fill img {


  width: 100% !important;


  height: 100% !important;


  object-fit: cover; /* Taglia l'immagine per riempire il contenitore senza deformarla */


  object-position: center; /* Mantiene il focus al centro dell'immagine */


}





.Modern-Slider .NextArrow {


  position:absolute;


  top:50%;


  transform: translateY(-25px);


  right:30px;


  width: 50px;


  height: 50px;


  background-color: #7bc6e6;


  border:0 none;


  line-height: 44px;


  border-radius: 50%;


  text-align:center;


  font-size: 36px;


  font-family: 'FontAwesome';


  color:#FFF;


  z-index:5;


  outline: none;


  opacity: 0.3;


  transition: all .3s;


}





.Modern-Slider .NextArrow:hover {


  opacity: 1;


}





.Modern-Slider .NextArrow:before{


  content:'\f105';


}





.Modern-Slider .PrevArrow {


  position:absolute;


  top:50%;


  transform: translateY(-25px);


  left:30px;


  width: 50px;


  height: 50px;


  background-color: #2BA1CE;


  border:0 none;


  line-height: 44px;


  border-radius: 50%;


  text-align:center;


  font-size: 36px;


  font-family: 'FontAwesome';


  color:#FFF;


  z-index:5;


  outline: none;


  opacity: 0.3;


  transition: all .3s;


}





.Modern-Slider .PrevArrow:hover {


  opacity: 1;


}





.Modern-Slider .PrevArrow:before{


  content:'\f104';


}





ul.slick-dots {


  display: none!important;


}





.Modern-Slider .item.slick-active{


  animation:Slick-FastSwipeIn 1s both;


}





.Modern-Slider .buttons {


  position: relative;


}





.Modern-Slider {background:#000;}








/* ==== Slick Slider Css Ruls === */


.slick-slider{position:relative;display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}


.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}


.slick-list:focus{outline:none}.slick-list.dragging{cursor:hand}


.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}


.slick-track{position:relative;top:0;left:0;display:block}


.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}


.slick-loading .slick-track{visibility:hidden}


.slick-slide{display:none;float:left /* If RTL Make This Right */ ;height:100%;min-height:1px}


.slick-slide.dragging img{pointer-events:none}


.slick-initialized .slick-slide{display:block}


.slick-loading .slick-slide{visibility:hidden}


.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}








/* --- SEZIONE ABOUT --- */





#about {


  margin-top: 20px;


  padding: 80px 0px;


  position: relative;


  z-index: 9;


}





/* Heading */


#about .section-heading h6 {


  color: #132D58;


  font-size: 15px;


  font-weight: 700;


  text-transform: uppercase;


  letter-spacing: 1px;


  margin-bottom: 10px;


  text-align: left; /* Forza allineamento a sinistra */


}





#about .section-heading h2 {


  color: #132D58;


  font-size: 36px;


  font-weight: 800;


  line-height: 42px;


  margin-bottom: 25px;


  padding-right: 120px; /* Spazio estetico per Desktop */


  text-align: left; /* Forza allineamento a sinistra */


}





/* Testo */


#about .left-text-content p {


  margin-bottom: 30px;


  font-size: 16px;


  line-height: 1.8;


  color: #555;


  text-align: left; /* Testo a bandiera (allineato a sinistra) */


}





#about img {


  width: 100%;


  overflow: hidden;


}





/* Contenuto di destra (Immagine Donna) */


#about .right-content {


  margin-left: 30px;


}





#about .right-content .thumb {


  position: relative;


  border-radius: 15px;


  overflow: hidden;


  box-shadow: 0px 10px 30px rgba(0,0,0,0.1);


}





/* --- RESPONSIVE ABOUT (Testo sempre a sinistra) --- */





@media (max-width: 991px) {


  #about {


    padding: 50px 15px;


  }





  #about .section-heading h2 {


    padding-right: 0px; /* Libera il testo dal vincolo desktop */


    font-size: 28px;


    line-height: 34px;


    text-align: left; /* Mantiene a bandiera su mobile */


  }





  #about .left-text-content {


    padding-right: 0px !important;


    text-align: left; /* Assicura l'allineamento a sinistra */


  }





  #about .section-heading {


    text-align: left; /* Assicura l'allineamento a sinistra */


  }





  #about .right-content {


    margin-left: 0px;


    margin-top: 30px; /* Crea distacco quando l'immagine scende sotto il testo */


  }





  .main-about-img {


    padding-left: 0px !important; /* Rimuove lo stile inline dell'HTML */


    height: 380px !important;


  }


}





@media (max-width: 480px) {


  #about .section-heading h2 {


    font-size: 24px;


    line-height: 30px;


  }





  #about .left-text-content p {


    font-size: 15px;


  }





  /* Sistema le 3 miniature sotto il testo per non farle toccare */


  #about .left-text-content .row {


    margin-right: -5px;


    margin-left: -5px;


  }


  #about .left-text-content .col-4 {


    padding-right: 5px;


    padding-left: 5px;


  }


}





/* ==========================================================================


   SEZIONE MENU - CATALOGHI (VERSIONE DEFINITIVA ANTI-TAGLIO)


   ========================================================================== */





#menu {


    margin-top: 120px;


    background-color: #F1F3F5;


    padding: 100px 0px;


}





#menu .section-heading {


    margin-bottom: 60px;


}





/* --- CONTENITORE ITEM --- */


.owl-menu-item .item {


    padding: 10px;


    height: 100%;


    display: flex;


}





/* --- CARD BASE --- */


.owl-menu-item .card {


    width: 100%;


    height: 480px; /* Altezza ottimizzata per le proporzioni dello screenshot */


    border: none;


    border-radius: 25px;


    overflow: hidden;


    position: relative;


    background-size: cover;


    background-position: center;


    display: flex;


    align-items: center;      /* Centra verticalmente */


    justify-content: center;   /* Centra orizzontalmente */


    text-align: center;


    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);


}





/* --- OVERLAY DI LEGGIBILITÀ (Sempre presente) --- */


.owl-menu-item .card::before {


    content: '';


    position: absolute;


    top: 0; left: 0; width: 100%; height: 100%;


    /* Overlay più scuro per contrastare le immagini chiare (patate/pane) */


    background: rgba(0, 0, 0, 0.35);


    z-index: 1;


    transition: all 0.4s ease;


}





/* Hover: la card si scurisce per far leggere descrizione e bottone */


.owl-menu-item .card:hover::before {


    background: rgba(0, 0, 0, 0.85);


}





/* --- INFO & TESTI --- */


.owl-menu-item .info {


    position: relative;


    z-index: 2;


    width: 85%; /* Lascia un margine di sicurezza interno per non tagliare le lettere */


    padding: 0;


    transition: all 0.4s ease;


}





/* Titolo: Gestione intelligente dello spazio */


.owl-menu-item .info .title {


    color: #ffffff !important;


    font-weight: 900;


    text-transform: uppercase;


    margin-bottom: 0;


    letter-spacing: 1px;


    text-shadow: 2px 2px 15px rgba(0, 0, 0, 0.7);





    /* FIX: Permette al testo di andare a capo se non ci sta (es. GLUTEN FREE) */


    white-space: normal;


    display: block;


    width: 100%;


    line-height: 1.2; /* Spazio armonioso tra le righe se il testo si spezza */





    /* Dimensione fluida: non scende sotto i 16px e non supera i 26px */


    font-size: clamp(16px, 2.5vw, 26px);





    transition: all 0.4s ease;


}





/* --- CONTENUTO HOVER (Descrizione + Bottone) --- */


.owl-menu-item .overlay-content {


    max-height: 0;


    opacity: 0;


    overflow: hidden;


    transition: all 0.4s ease-in-out;


    transform: translateY(15px);


}





.owl-menu-item .card:hover .overlay-content {


    max-height: 300px;


    opacity: 1;


    transform: translateY(0);


    margin-top: 20px;


}





/* Sposta leggermente il titolo in alto all'hover */


.owl-menu-item .card:hover .title {


    transform: translateY(-5px);


}





.owl-menu-item .info .description {


    color: #ffffff;


    font-size: 14px;


    line-height: 1.4;


    margin-bottom: 20px;


    text-shadow: 1px 1px 5px rgba(0,0,0,0.5);


}





/* --- BOTTONE PDF --- */


.main-white-button a {


    display: inline-block;


    width: 100%;


    background-color: #ffffff;


    color: #132d58 !important;


    padding: 12px;


    border-radius: 10px;


    font-weight: 700;


    text-transform: uppercase;


    font-size: 12px;


    text-decoration: none;


    transition: all 0.3s ease;


    margin-bottom: 20px;


}





.main-white-button a:hover {


    background-color: #2ba1ce;


    color: #ffffff !important;


    transform: translateY(-2px);


}





/* --- IMMAGINI DI SFONDO --- */


/* Proprietà comuni a tutte le card */


.card1, .card2, .card3, .card4, .card5, .card6, .card7, .card8, .card9, .card10 {


    background-size: cover;


    background-position: center;


    background-repeat: no-repeat;


}





/* Assegnazione delle singole immagini WebP */


.card1 { background-image: url(../images/ittico.webp); }


.card2 { background-image: url(../images/forno.webp); }


.card3 { background-image: url(../images/patate.webp); }


.card4 { background-image: url(../images/pollo.webp); }


.card5 { background-image: url(../images/cornetti.webp); }


.card6 { background-image: url(../images/gelati.webp); }


.card7 { background-image: url(../images/fresco.webp); }


.card8 { background-image: url(../images/scaffale.webp); }


.card9 { background-image: url(../images/verdure.webp); }


.card10 { background-image: url(../images/glutine.webp); }





/* --- RESPONSIVE FIX PER SCHERMI STRETTI --- */





@media (max-width: 1200px) {


    .owl-menu-item .info .title {


        font-size: 19px; /* Dimensione sicura per desktop con card strette */


    }


}





@media (max-width: 767px) {


    .owl-menu-item .card { height: 420px; }


    .owl-menu-item .info .title { font-size: 20px; }


}





@media (max-width: 480px) {


    .owl-menu-item .info .title {


        font-size: 6vw; /* Adattamento dinamico per smartphone */


    }


    .owl-menu-item .info { width: 90%; }


}


/* --- RIPRISTINO FRECCE NAVIGAZIONE (OWL NAV) --- */





#menu .owl-nav {


    text-align: center;


    position: relative;       /* Cambiato in relative per farlo fluire dopo il contenuto */


    width: 100%;


    margin: 0 !important;     /* Rimuove margini che creano lo stacco bianco */


    padding: 30px 0 !important; /* Spazio interno per dare "respiro" alle frecce */


    background-color: #f1f3f5 !important; /* Stesso colore del div sopra */


    display: block !important;


    border: none !important;


}





#menu .owl-nav button.owl-prev,


#menu .owl-nav button.owl-next {


    width: 50px;


    height: 50px;


    margin: 0 10px;


    background-color: transparent !important; /* Trasparente per mostrare l'f1f3f5 sotto */


    border: none !important;


    outline: none !important;


    transition: all 0.3s ease;


}





/* Effetto Hover sulle icone */


#menu .owl-nav button.owl-prev:hover:before,


#menu .owl-nav button.owl-next:hover:before {


    color: #132d58 !important; /* Colore scuro al passaggio */


}





/* Icone delle frecce (FontAwesome) */


#menu .owl-nav .owl-prev:before {


    content: '\f104';


    font-family: 'FontAwesome';


    color: #606972;


    font-size: 25px;


    font-weight: 700;


}





#menu .owl-nav .owl-next:before {


    content: '\f105';


    font-family: 'FontAwesome';


    color: #606972;


    font-size: 25px;


    font-weight: 700;


}





/* Nascondiamo il testo "next" e "prev" originale */


#menu .owl-nav span {


    display: none;


}


/*


---------------------------------------------


chefs


---------------------------------------------


*/





#chefs {


  padding-top: 120px;


}





#chefs .section-heading {


  margin-bottom: 70px;


}





#chefs .section-heading h6 {


  padding-left: 0px;


}





#chefs .section-heading h6:before {


  display: none;


}





#chefs .chef-item {


  text-align: center;


  padding: 5px;


}





#chefs .chef-item:hover {


  border-color: #fb5849;


}





#chefs .chef-item:hover .down-content h4 {


  color: #2BA1CE;


}





#chefs .chef-item .thumb {


  position: relative;


}





#chefs .chef-item .thumb img {


  width: 100%;


  overflow: hidden;


  position: relative;


}





#chefs .chef-item .thumb .overlay {


  position: absolute;


  background-color: #132d58;


  border-radius: 3px;


  top: 0;


  bottom: 0;


  left: 0;


  right: 0;


  z-index: 1;


  opacity: 0;


  visibility: hidden;


  transition: all .3s;


}





#chefs .chef-item .thumb ul.social-icons {


  position: absolute;


  z-index: 11;


  top: 50%;


  left: 50%;


  transform: translate(-50%, -50%);


  width: 100%;


  transition: all .5s;


  opacity: 0;


  visibility: hidden;


}





#chefs .chef-item .thumb ul.social-icons li {


  display: inline-block;


  margin: 0px 5px;


}





#chefs .chef-item .thumb ul.social-icons li a {


  width: 40px;


  height: 40px;


  background-color: #fff;


  color: #132d58;


  border-radius: 50%;


  text-align: center;


  line-height: 40px;


  display: inline-block;


  transition: all .5s;


}





#chefs .chef-item .thumb ul.social-icons li a:hover {


  background-color: #fb5849;


}





#chefs .chef-item:hover .overlay {


  opacity: .9;


  visibility: visible;


}





#chefs .chef-item:hover ul.social-icons {


  opacity: 1;


  visibility: visible;


}





#chefs .chef-item .down-content {


  padding: 20px 0px;


}





#chefs .chef-item .down-content h4 {


  transition: all .3s;


  font-size: 20px;


  font-weight: 700;


  color: #132d58;


}





#chefs .chef-item .down-content span {


  font-size: 14px;


  color: #132d58;


}








/*


---------------------------------------------


reservation


---------------------------------------------


*/





#reservation .section-heading {


  margin-bottom: 30px;


}





#reservation .section-heading h6 {


  color: #fff;


}





#reservation .section-heading h2 {


  color: #fff;


  font-weight: 700;


}





#reservation .section-heading h6:before {


  background-color: #fff;


}





#reservation p {


  color: #fff;


  margin-bottom: 65px;


}





#reservation {


  margin-top: 120px;


  padding: 120px 0px;


  background-color: #132d58;


  background-position: center center;


  background-repeat: no-repeat;


  background-size: cover;


}





#reservation .phone,


#reservation .message {


  background-color: #fff;


  border-radius: 5px;


  text-align: center;


  padding: 0px 0px 20px 0px;


}





#reservation .phone i,


#reservation .message i {


  width: 70px;


  height: 70px;


  display: inline-block;


  text-align: center;


  line-height: 70px;


  color: #132D58;


  background-color: #f1f3f5;


  border-radius: 50%;


  font-size: 24px;


  margin-top: -35px;


  text-align: center;


  margin-left: auto;


  margin-right: auto;


}





#reservation .phone h4,


#reservation .message h4 {


  font-size: 20px;


  font-weight: 700;


  margin-top: 15px;


  margin-bottom: 10px;


}





#reservation .phone span a,


#reservation .message span a {


  font-size: 14px;


  color: #606972;


  transition: all .3s;


}





#reservation .phone span a:hover,


#reservation .message span a:hover {


  color: #2BA1CE;


}





#contact {


  margin-left: 30px;


  padding: 45px 30px;


  background-color: #fff;


  border-radius: 5px;


}





#contact h4 {


  text-align: center;


  font-weight: 700;


  font-size: 30px;


  color: #132d58;


  margin-bottom: 30px;


}





.datepicker-days {


  padding: 30px;


  cursor: pointer;


}





.contact-form input,


.contact-form textarea,


.contact-form select {


  color: #132d58;


  font-size: 14px;


  border: 1px solid #ddd;


  background-color: #fff;


  width: 100%;


  height: 46px;


  border-radius: 5px;


  outline: none;


  padding-top: 3px;


  padding-left: 20px;


  padding-right: 20px;


  -webkit-appearance: none;


  -moz-appearance: none;


  appearance: none;


  margin-bottom: 15px;


}





.contact-form input:focus,


.contact-form textarea:focus,


.contact-form select:focus {


  border-color: #2BA1CE;


}





.contact-form button {


  margin-top: -10px;


  font-size: 13px;


  color: #132d58;


  background-color: #f1f3f5;


  padding: 12px 25px;


  width: 100%;


  box-shadow: none;


  border: none;


  display: inline-block;


  border-radius: 3px;


  font-weight: 600;


  transition: all .3s;


}





.contact-form button:hover {


  opacity: .9;


}





.contact-form textarea {


  height: 150px;


  resize: none;


  padding: 20px;


}





.contact-form ::-webkit-input-placeholder { /* Edge */


  color: #132d58;


}





.contact-form :-ms-input-placeholder { /* Internet Explorer 10-11 */


  color: #132d58;


}





.contact-form ::placeholder {


  color: #132d58;


}











/*


---------------------------------------------


footer


---------------------------------------------


*/





footer {





  padding: 50px 0px;


  background-color: #132d58;


}





footer .left-text-content p {


  margin-top: 5px;


  color: #fff;


  font-size: 14px;


  text-align: right;


}





footer .right-text-content p {


  color: #fff;


  font-size: 14px;


  margin-right: 15px;


  text-transform: uppercase;


}








footer .right-text-content {


  text-align: left;


  margin-top: 10px;


}





footer .logo {


  text-align: center;


}





footer .right-text-content ul li {


  display: inline-block;


  margin-left: 15px;


}


footer .right-text-content ul li:first-child {


  margin-left: 0px;


}








footer .right-text-content ul li a {


  width: 44px;


  height: 44px;


  display: inline-block;


  text-align: center;


  line-height: 44px;


  font-size: 20px;


  background-color: #fff;


  border-radius: 50%;


  color: #fb5849;


  -webkit-transition: all 0.5s ease 0s;


  -moz-transition: all 0.5s ease 0s;


  -o-transition: all 0.5s ease 0s;


  transition: all 0.5s ease 0s;


}





footer .right-text-content ul li a:hover {


  color: #132d58;


}





/*


---------------------------------------------


responsive


---------------------------------------------


*/





@media (max-width: 992px) {


  #top {


    padding-top: 100px;


    height: auto;


  }


  .header-area .main-nav .nav li.submenu:after {


    right: 3px;


  }


  .header-area .main-nav .nav li.submenu {


    padding-right: 15px;


  }


  .header-area .main-nav .nav li {


    padding-right: 5px;


    padding-left: 5px;


  }


  .header-area .main-nav .nav li a {


    font-size: 14px;


    letter-spacing: 0px;


  }


  #top .left-content {


    text-align: center;


    padding: 25% 0px;


  }


  #about .right-content {


    margin-left: 0px;


    margin-top: 30px;


  }


  #chefs .chef-item {


    margin-bottom: 30px;


  }


  #reservation .phone {


    margin-bottom: 60px;


  }


  #contact {


    margin-left: 0px;


    margin-top: 30px;


  }


  #offers .tabs-content .left-list {


    margin-right: 0px;


  }





  #offers .tabs-content .right-list {


    margin-left: 0px;


  }


  footer .right-text-content {


    text-align: center;


    margin-bottom: 30px;


  }


  footer .left-text-content p {


    text-align: center;


    margin-top: 30px;


  }


}





/* Stili specifici per il box Login Area Riservata*/


.login-section {


    padding: 150px 0;


    background-color: rgba(255, 255, 255, 0.95);


    background-size: cover;


    min-height: 80vh;


    display: flex;


    align-items: center;


}





.login-box {


    background: rgba(255, 255, 255, 0.95);


    margin-top: 50px;


    padding: 40px;


    border-radius: 15px;


    box-shadow: 0px 0px 20px rgba(0,0,0,0.2);


    text-align: center;


}





.login-box h2 {


    font-family: 'Montserrat', sans-serif;


    font-weight: 700;


    margin-bottom: 30px;


    color: #2ba1ce;


    text-transform: uppercase;


}





.login-box input {


    width: 100%;


    height: 45px;


    border-radius: 25px;


    border: 1px solid #ddd;


    padding: 0 20px;


    margin-bottom: 20px;


    outline: none;


}





.login-box .main-button-icon {


    width: 100%;


    background-color: #2ba1c3;


    color: #fff;


    border: none;


    padding: 12px;


    border-radius: 25px;


    font-weight: 600;


    transition: all .3s;


}





.login-box .main-button-icon:hover {


    background-color: #132d58;


}


/* --- Nuovo stile Preloader Responsive --- */


#preloader {


    overflow: hidden;


    background: #fff; /* Colore di sfondo del caricamento */


    left: 0;


    right: 0;


    top: 0;


    bottom: 0;


    position: fixed;


    z-index: 99999;


    display: flex;


    align-items: center;


    justify-content: center;


    flex-direction: column;


}





.preloader-logo {


    max-width: 250px; /* Dimensione massima su desktop */


    width: 60%;       /* Larghezza relativa su mobile */


    height: auto;     /* Mantiene le proporzioni */


    animation: pulse 2s infinite ease-in-out; /* Effetto opzionale di pulsazione */


}





@keyframes pulse {


    0% { transform: scale(0.95); opacity: 0.8; }


    50% { transform: scale(1); opacity: 1; }


    100% { transform: scale(0.95); opacity: 0.8; }


}





/* Nasconde lo scroll della pagina mentre il preloader è attivo */


body.loading {


    overflow: hidden;


}