/*
Theme Name: ZIVIERI2026_ELISA
Author: Derbau
Author URI: 
*/

body {
    --color-neutral-100: #000000;
    --color-rgb-neutral-100: 0, 0, 0;
    --color-neutral-80: #333333;
    --color-rgb-neutral-80: 7, 22, 34;
    --color-neutral-60: #909090;
    --color-rgb-neutral-60: 144, 144, 144;
    --color-neutral-40: #D3D3D3;
    --color-rgb-neutral-40: 211, 211, 211;
    --color-neutral-20: #E8E8E8;
    --color-rgb-neutral-20: 232, 232, 232;
    --color-neutral-10: #f8f8f8;
    --color-rgb-neutral-10: 245, 245, 245;    
    --color-neutral-0: #FFFFFF;
    --color-rgb-neutral-0: 255, 255, 255;
		--color-esmach:#FEC601;
    --global-font-size: 100%;
    --global-small-font-size: 80%;
    --global-min-width: 320px;
    --global-max-width: 1920px;
    --global-weight-light: 300;
    --global-weight-normal: 400;
    --global-weight-medium: 600;
    --global-weight-bold: 700;
    --title-font-family: "Playfair Display", sans-serif !important;    
    --body-font-family: "Roboto", sans-serif !important;
    --body-font-weight: var(--global-weight-normal);
    --body-background: var(--color-neutral-0);
    --body-color: var(--color-neutral-100);
    --link-color-hover: var(--color-secondary);
    --menu-font-family: "Playfair Display", sans-serif;
    --main-menu-font-family: "Playfair Display", sans-serif;
    --heading-font-family: "Playfair Display", sans-serif;
    --heading-font-weight: var(--global-weight-bold);
    --heading-color: var(--color-neutral-100);
    --heading-line-height: 1;
    --heading-margin-bottom: 25px;
    --paragraph-margin-bottom: 15px;
    --image-caption-font-family: "Playfair Display", sans-serif;
    --image-caption-font-weight: var(--global-weight-normal);
    --legal-font-family: "Playfair Display", sans-serif;
    --legal-font-weight: var(--global-weight-normal);
    --menu-heading-font-family: "Playfair Display", sans-serif;
    --menu-heading-font-weight: var(--global-weight-medium);
    --menu-body-font-family: "Playfair Display", sans-serif;
    --menu-body-font-weight: var(--global-weight-normal);
    --font-family-monospace: "Playfair Display", Courier, monospace;
    --font-family-serif: "serif";
    --button-font-family: "Playfair Display", sans-serif;
    --button-font-size: 16px;
    --button-line-height: 18px;
    --button-regular-color: var(--color-neutral-100);
    --button-regular-background: transparent;
    --button-regular-color-hover: var(--color-secondary);
    --button-regular-background-hover: transparent;
}
body{font-family: "Roboto", sans-serif !important;color:var(--color-neutral-100);line-height:1.8;font-size:16px}
h1,h2,h3,h4,h5,h6{font-family: var(--title-font-family);font-weight:var(--global-weight-light);line-height:1.5 !important}

body.no-scroll {
  overflow: hidden;
  height: 100vh;
}

label{width:100%;font-weight:400;font-size:16px}
a:hover,a:focus{text-decoration:none;color: #8f0202}
a {color: #8f0202;text-decoration: none !important;background-color: transparent;-webkit-text-decoration-skip: objects;cursor:pointer}
.container-fluid{padding:0!important;margin:0!important}

/* Solo desktop */
@media (min-width: 992px) {
    .container-fluid.fullscreen-bottom {
        min-height: 100vh;          /* riempie lo schermo */
        display: flex;              /* attiva flexbox */
        align-items: flex-end;      /* allinea i contenuti in basso */
        padding-bottom: 40px;       /* spazio di respiro opzionale */
    }
}



.testoLancio p:only-child {
    margin-bottom: 0;
}

.giant-icon {font-size: 36px;}
/*----------------------------------------------------------
# Background
--------------------------------------------------------------*/
.lightGrey{background-color:var(--color-neutral-10);}
.darkGrey{background:var(--color-neutral-20);}
.bgCategorie{background-color:var(--color-neutral-20);}
.bgDarkGrey{background-color:#333}
.bgBlack{background-color:var(--color-neutral-100) !important;}
.bgLemon{ background: var(--color-neutral-0) !important;}
.bgWhite{background-color:var(--color-neutral-0)}
.bgStoria{background-color:#fcfcfc}
.bgZivieri{background-color:#8f0202}
.colZivieri{color:#8f0202}
.bgOrange{background-color:#FFC500}
.bgWhite{background-color:#ffffff}
.bgTitoloPagina{background: linear-gradient(to right, #FFC500 50%, var(--color-neutral-10) 50%)}
.bgTopBanner{background-color:#d8e0ce}
.bgWhiteZiv{  /* Sfondo diviso in bianco e rosso */background: linear-gradient(to bottom, white 37%, #8f0202 37%);  }
.bgGreyZiv{  /* Sfondo diviso in bianco e rosso */background: linear-gradient(to bottom, rgb(237, 235, 235) 37%, #8f0202 37%);  }
.bgGradientBlackWhite{background: linear-gradient(to bottom, #E8E8E8 37%, white 60%);  }
.bgGradientSubMenu{background: linear-gradient(to bottom, #333 17%, #000 83%)  }

.whiteText{color:#ffffff !important}
.overlay {position: absolute;left: 10px;width:20%;height: auto;opacity:0.1; /* 20% di opacità */z-index: 0; /* Mantiene il contenuto sopra l'overlay */}

.titoloSection{font-family:"Playfair Display";font-size:3em ;font-style: italic;font-weight: 500;line-height:0.95em}
.oswald{font-family: "Playfair Display";}

.bgColline {background-image: var(--bg-image);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-attachment: scroll; /* o fixed se vuoi l'effetto parallax */
    min-height: 400px; /* Assicurati che il div abbia un'altezza! */
}

.productCatBanner{margin-top:184px !important}
/*----------------------------------------------------------
# Borders e margini
--------------------------------------------------------------*/
.borderZivHero{border-left: 25px solid #8f0202;}
/* Default: nessun margine negativo su mobile/tablet */
.section-overlap {
  position: relative;
  margin-top: 0;
}

.col-border-short {
    position: relative;
}

.col-border-short::after {
    content: "";
    position: absolute;
    right: 0;
    top: 20%;      /* Distanza dall'alto (es. 20%) */
    height: 60%;   /* Altezza del bordo (es. 60% della colonna) */
    width: 1px;    /* Spessore (corrisponde a border-2) */
    background-color: #dc3545; /* Colore border-danger */
}

/* Opzionale: nascondi il bordo su mobile se le colonne vanno a capo */
@media (max-width: 767px) {
    .col-border-short::after {
        display: none;
    }
}


/* Desktop ≥ 992px */
@media (min-width: 992px) {
  .section-overlap {
    margin-top: -80px; /* regola il valore in base al tuo layout */
  }
}

/*----------------------------------------------------------
# Livello sensibile al passaggio del mouse o meno
--------------------------------------------------------------*/

.hidden {
  opacity: 0;
  pointer-events: none;
}

.visible {
  opacity: 1;
  pointer-events: auto;
}

/*----------------------------------------------------------
# CSS Grid
--------------------------------------------------------------*/

.containerGrid {
  display: grid;
  grid-template-columns: 200px auto; /* Colonna per il logo e spazio restante per la navigazione */
  grid-template-rows: auto auto; /* Due righe per la navigazione */
}
.logo {
  grid-row: span 2; /* Il logo occupa entrambe le righe */ 
}
body.woocommerce .menu-logo img,
body.woocommerce-page .menu-logo img {
    height: 90px !important;   /* o la misura che usi nel resto del sito */
    width: auto !important;
    max-width: none !important;
}
.shop.row {
    align-items: stretch;
}

.shop .col {
    display: flex;
    flex-direction: column;
}

.shop .col .card {
    flex: 1;
    width: 100%;
}

.shop .col .card > a.btn {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

.shop .col .card > a .card-body {
    flex: 1;
}
/*----------------------------------------------------------
# Barra di ricerca -- toggle nel js  
--------------------------------------------------------------*/

.search--bar {position:relative;background: #FFC500; z-index: 2;left: 0;right: 0;max-height: 150px;-webkit-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;transition: all .4s ease-in-out;overflow: hidden;}
.search--bar.closed{height:0}
.search--bar #search--form .form-control {border: 0 none;background-color: #fff;color: #333;}
.search--bar #search--form #search--submit {position: absolute;background: transparent;border: 0 none;color: #999;font-size: 21px;right: 6%;top: 36px;}
.form-control {display: block;width: 90% !important;height: 42px;padding: 6px 12px;font-size: 18px;margin: 30px auto;  line-height: 1.6;color: #555;background-image: none;border: 1px solid #ccc;border-radius: 0;-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;}
.search--bar .close:after {content: '+';display: inline-block;-ms-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg);font-size: 50px;margin-top:-50px;padding-left: 50px;color: #fff;}
.close{margin-top:-70px}
.search-form {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.search-box {
  position: relative;
  width: 70%; /* Modifica la larghezza a piacere */
}

.search-input {
  width: 100%;
  padding: 12px 40px 12px 12px; /* Spazio a destra per la lente */
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 25px;
  outline: none;
  transition: border-color 0.3s ease-in-out;
}

.search-input:focus {
  border-color: #ff9900;
  box-shadow: 0 0 5px rgba(255, 153, 0, 0.5);
}

/*----------------------------------------------------------
# Testo
--------------------------------------------------------------*/
.whiteText {color: var(--color-neutral-0);}
.txtEsmach{color:#FFC500 !important;}	
.txtEsmachDarkGreen{color:#666408;}
.txtEva{color: #91172E !important;}
.topnoImage{height:200px}
.style-svg {height:60px}
	
/*----------------------------------------------------------
# Selettore di lingua
--------------------------------------------------------------*/
.wpml-ls-item{filter: grayscale(100%);-webkit-filter: grayscale(100%);}
.wpml-ls-current-language, .wpml-ls-item:hover{filter: grayscale(0%);-webkit-filter: grayscale(0%);}

/*----------------------------------------------------------
# Form di contatto
--------------------------------------------------------------*/
form h3{color:#333;margin-bottom:20px;font-style:italic;padding-bottom:15px}
.form-group{margin-bottom:10px}
.margin10{margin:0; margin:10px 0 }
.wpcf7-response-output{clear:left}
.wpcf7-validation-errors{text-transform:uppercase;font-size:12px;font-weight:700;color:#0c509e;background:#e6f1ff;border:none;padding:20px;text-align:center}
.wpcf7-mail-sent-ok{display:none!important}
.wpcf7-not-valid-tip{text-transform:uppercase;font-weight:700;font-size:12px;padding-top:3px}
.has-error .form-control{background:#ffecec}



/*----------------------------------------------------------
# Pre header Icons e navigation
--------------------------------------------------------------*/

.supertopBar{position:fixed;z-index:4;top:0px}

.c-site-pre-header{width:100%;background:var(--color-neutral-20);color:var(--color-neutral-100);height:40px;font-size: 13px;}
/* Da md in giu  */
@media (max-width: 768px) {
.c-site-pre-header{height:auto;}
.c-site-pre-header .icon, .xoo-wsc-sc-cont, .xoo-wsc-sc-bki{color: var(--color-neutral-0) !important;}
}

.c-site-pre-header .menu-item a{color:var(--color-neutral-100);}

.pre-nav ul li a{display: inline-block;color:var(--color-neutral-100) !important}
.pre-nav ul li a:hover{color:#8f0201 !important}
.pre-nav ul li.chefalmax a {font-style: italic;font-weight:500;color:#8f0201 !important}

.c-site-pre-header a{color:var(--color-neutral-100)}
.c-site-pre-header .icon{color: var(--color-neutral-100);font-size: 16px;display: inline-block;vertical-align: middle;margin-right: 12px;}
.c-site-pre-header .icon:first-child{margin-left:0}
.c-site-pre-header .linkedin, .c-site-pre-header .site-header__search, .c-site-pre-header .site-header__lang {display: inline-block;height: 50px;}
.c-site-pre-header .site-header__search input {width: 250px;height: 50px;line-height: 50px;border: none;padding-left: 20px;background-color: var(--color-neutral-80);font-size: 14px;font-style: italic;color:var(--color-neutral-0);}
.c-site-pre-header .site-header__search .action[disabled] {cursor: not-allowed;pointer-events: none;opacity: .5;}
.c-site-pre-header .site-header__search .action {position: absolute;margin-left: 220px;top: 15px;width: 20px;height: 20px;display: inline-block;background: none;background-image: none;border: 0;box-shadow: none;line-height: inherit;background-image: url(img/icon-search.png);background-repeat: no-repeat;background-position: center;background-size: 20px;}
.c-pre-social__item{display:inline-block;}
.c-pre-social__item a{display:block;font-size:14px}




/*----------------------------------------------------------
# Carrello icona
--------------------------------------------------------------*/
.xoo-wsc-sc-bki{font-size:18px !important;margin-top:4px !important}
.xoo-wsc-sc-cont {position: relative !important;top: 5px !important;}
span.xoo-wsc-sc-count {height: 15px !important;line-height: 15px !important;width: 15px !important;font-size: 11px !important;right: -12px !important;position: absolute;top: 0px !important;}

/*----------------------------------------------------------
# Logo e Header e testo HP
--------------------------------------------------------------*/
.site-header *, .site-nav-item * {-webkit-transition: all .1s ease-in-out;-moz-transition: all .1s ease-in-out;-o-transition: all .1s ease-in-out;transition: all .1s ease-in-out;}
.site-header{/*background-color:#ffffff;*/font-size: 14px;font-weight:600}
.site-header__logo{position:relative;height:50px !important;}
.site-header__logo img{max-width: 100%; max-height: 100%;}
.logoTop {height: 60px!important;left:0px}




.testoHP{z-index:3 !important;height:40vh}
.page-content:has(> :nth-child(2):last-child) {
    grid-template-columns: repeat(2, 1fr);
    justify-content: center;
}
.page-content:has(> :nth-child(4):last-child) {
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
}
.page-content:has(> :nth-child(6):last-child) {
    grid-template-columns: repeat(6, 1fr);
    justify-content: center;
}
/* Contenitore del testo principale */
#testoHP {
	/*height:300px;*/
  opacity: 1;
  transform: translateY(0);
  transition: opacity .4s ease, transform .4s ease;
  display: flex; flex-direction: column; justify-content: center;
}
/* --- 1. LOGICA ALTEZZA (Dall'alto verso il basso) --- */

/* Schermi mediamente bassi (es. Laptop 13" o Tablet landscape) */
@media (max-height: 800px) {
  .testoHP p { font-size: 0.9rem !important; }
  .claimHP   { top: 100px !important; }
}

/* Schermi bassi (sotto i 600px) */
@media (max-height: 600px) {
  #testoHP > .copyHP { visibility: hidden; }
  #testoHP, .hero-center { margin-bottom: 0px; }
}

/* Schermi bassissimi (sotto i 380px - es. smartphone in orizzontale) */
@media (max-height: 380px) {
  .site-header { font-size: 11px; }
}

/* --- 2. LOGICA LARGHEZZA (Mobile Portrait) --- */

/* Smartphone e schermi stretti */
@media (max-width: 600px) {
  #testoHP { height: auto; }
  .testoHP p { font-size: 0.9rem !important; }
  /* Nota: Questo top: -150px vincerà su quello a 100px quando lo schermo è stretto */
  .claimHP { top: -150px !important; } 
}

/* Fade-out + slide-down */
#testoHP.fade-out {
  opacity: 0;
  transform: translateY(20px);
}

/* Fade-in + slide-up */
#testoHP.fade-in {
  opacity: 1;
  transform: translateY(0);
}

/*----------------------------------------------------------
# Hero home
--------------------------------------------------------------*/
.heroHome {
    position: relative;
    min-height: 100vh; 
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* centro + bottom */
    background: url('immagine.jpg') no-repeat center center / cover;
    padding: 40px;
}


/* Contenuto centrale */
.hero-center {
    position: relative;
    z-index: 2;
    text-align: center;
    color: white;
    margin-top: auto;
    margin-bottom: auto; /* questo centra verticalmente */
}

/* Box in fondo */
.hero-bottom {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
    padding-bottom: 20px;
}


/*----------------------------------------------------------
# Mobile
--------------------------------------------------------------*/
.bar1,.bar2,.bar3{width:30px;height:4px;background-color:#ffffff;margin:6px 0;-webkit-transition:.4s;transition:.4s}
.change .bar1{-webkit-transform:rotate(-45deg) translate(-9px,6px);transform:rotate(-45deg) translate(-7px,7px)}
.change .bar2{opacity:0}
.change .bar3{-webkit-transform:rotate(45deg) translate(-8px,-8px);transform:rotate(45deg) translate(-7px,-7px)}

.nav-mobile{cursor:pointer;right:30px;}
/*.mobile-menu{position:absolute;width:100% !important;left:0;right:0;height:calc(100vh - 100px);background:#FFC500;display:none;color:var(--color-neutral-80) !important;padding:0;padding-bottom:100px;border:none;border-radius:0;overflow:scroll;z-index:8}*/
.mobile-menu{position:absolute;width:100% !important;top:87px;left:0;right:0;height:calc(100vh);background:#8f0202;display:none;color:#fff !important;padding:0;padding-bottom:100px;border:none;border-radius:0;overflow:scroll}
.mobile-menu .sub-menu{display:none}

/*----------------------------------------------------------
# Effetto polaroid
--------------------------------------------------------------*/
.polaroid { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.05);-webkit-transition:all .2s ease;transition:all .2s ease;}
.polaroid:hover {box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.1);-webkit-transition:all .2s ease;transition:all .2s ease;}
	/* fine effetto polaroid  */


/*----------------------------------------------------------
# Slider categorie HP
--------------------------------------------------------------*/
.sliderHP{overflow: hidden;width: 100%;/*min-height: 420px;*/background-size: cover;position: relative;background-repeat: no-repeat;background-position: center;border-bottom:10px solid #FFC500}	
.imgSlider{z-index:1000;margin-top:-20px}
.sliderTitolo{text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5), 2px 2px 6px rgba(0,0,0,0);}

/*----------------------------------------------------------
# Indicatori selezione slider
--------------------------------------------------------------*/
.carousel-indicators li .active img{opacity:1;  filter: grayscale(0%);}
.carousel-indicators {position:relative !important;margin:0 5% !important;}
.carousel-indicators [data-bs-target] {position: relative;width: auto !important; height:200px;  margin:3px !important;text-indent: 0px !important;cursor: pointer;background-color:var(--color-neutral-10) !important;opacity:1 !important; color:var(--color-neutral-100) !important border-radius:50%;}
.carousel-indicators .active img{opacity:1;  filter: grayscale(0%);}
.carousel-indicators li.active {background-color: #FEC601 !important; color:var(--color-neutral-0) !important}
.carousel-indicators li:hover{background-color: #FEC601 !important;cursor:pointer }
.carousel-indicators .active .c-catProd__icon {color: #FEC601 !important; }
.carousel-item .row.sliderHP{min-height:350px !important;margin:0 !important}
.carousel-inner {
    overflow: inherit !important;
}

.itemCarousel * {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.itemCarousel img{opacity:1;o-object-fit:cover;object-fit:cover;height:100%;width:100%;font-family:'object-fit: cover;';filter: grayscale(0%);}
.itemCarousel:hover img{opacity:.6;  filter: grayscale(0%);}

.itemCarousel .titleCat{line-height:1.1em;font-size:13px !important;font-weight:400;}
.itemCarousel:hover .titleCat{opacity:1;color:var(--color-neutral-0)}
.itemCarousel a {color:#333 !important}


/*----------------------------------------------------------
# ACCORDION HOME PAGE
--------------------------------------------------------------*/

.accordion,
.accordion ul,
.accordion ul li > div {width: 100%;}

.accordion ul a,
.accordion li .accordion_item_inf {transition: all .8s;}

.accordion {overflow: hidden;}

.accordion ul {display: table;}

.accordion a {display: table-cell;}

.accordion li {
  display: block;
  height: 500px;
  background-position: center center;
  background-size: cover;
}

.accordion li > div {
  position: relative;
  width: 100%;
  height: 100%;
}

.accordion li .accordion_item_inf {
  position: absolute;
  right: 0; bottom: 0; left: 0;
  padding: 50px 20px 100px;
  background: linear-gradient(0deg, rgba(0,0,0,1) 5%, rgba(0,0,0,0));
  color: #fff;
  opacity: 0;
}

.accordion a:hover .accordion_item_inf {opacity: 1;}

.accordion .accordion_item_inf_title {
  font-size: 30px;
  font-weight: bold;
}

.accordion .accordion_item_inf_text {font-size: 15px;}
/*----------------------------------------------------------
# CARDS HOME PAGE
--------------------------------------------------------------*/


.page-content {
  display: grid;
  gap: 1rem;
  padding: 2rem;
  max-width: 1620px;
  margin: 0 10%;
  grid-template-columns: 1fr; /* default: 1 colonna */
}


/* Da md in su → 3 colonne */
@media (min-width: 768px) {
  .page-content {
    grid-template-columns: repeat(3, 1fr);
		justify-content: center;
  }
	.page-content:has(> :nth-child(2):last-child) {
	    grid-template-columns: repeat(2, 1fr);
	    justify-content: center;
	}  
	.page-content:has(> :nth-child(4):last-child) {
	    grid-template-columns: repeat(4, 1fr);
	    justify-content: center;
	}  	
	.page-content:has(> :nth-child(5):last-child) {
	    grid-template-columns: repeat(5, 1fr);
	    justify-content: center;
	}  	
}


.hpCards {height: 210px;position: relative;border:solid 4px #ddd; align-items: flex-end;  overflow: hidden;  padding: 0rem; text-align: center; color: whitesmoke; background-color: whitesmoke; box-shadow: 0 1px 1px rgba(0,0,0,0.1), 0 2px 2px rgba(0,0,0,0.1), 0 4px 4px rgba(0,0,0,0.1), 0 8px 8px rgba(0,0,0,0.1), 0 16px 16px rgba(0,0,0,0.1);transition: transform 700ms ease;transform: scale(1,1) translate(0%, 0%)}

.gradient-border {
    border: 4px solid; 
    border-image: linear-gradient(90deg, #333, #666) 1;
}


.hpCards { filter: grayscale(0%); transition: filter .4s ease, transform .3s ease; } 
.hpCards:hover { filter: grayscale(50%); transform: translateY(-10px)};
.hpCards:not(:hover) { filter: grayscale(100%);transition: filter .4s ease, transform .3s ease; } 

@media (min-width: 600px) {
  .hpCards {max-height: 400px;}
}

/* Regole extra per schermi "molto piccoli" (sotto i 800px di altezza) */
@media (max-height: 800px) {
  .hpCards > .content > img{display:none}
  .hpCards {height: 100px;}
  .hpCards .title{font-size:0.8em;padding:10px 0}
  .hpCards .btnCards{font-size:0.8em;padding: 3px 5px;}  
}

.hpCards::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 110%; background-size: cover; background-position: 0 0; transition: transform 1050ms cubic-bezier(0.19, 1, 0.22, 1); pointer-events: none;}
.hpCards::after {content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; background-image: linear-gradient(to top, hsla(0,0%,0%,0) 70%, hsla(0,0%,0%,0.15) 100%); transform: translateY(-50%); transition: transform 1400ms cubic-bezier(0.19, 1, 0.22, 1);}


.hpCards-footer{/* position:absolute; bottom:0; */width:100%;z-index:4;border:0 !important}

.content {position: relative; display: flex; flex-direction: column; align-items: center; width: 100%;height:70%; padding: 0 0.5rem; transition: transform 700ms cubic-bezier(0.19, 1, 0.22, 1); z-index: 5;}
.content > * + * {margin-top: 0rem;}

.titleBlack {color:#000;margin-top:-80px;font-size: 1.3rem; font-weight: bold; line-height: 1.2;}
.title {font-family: var(--title-font-family);font-size: 1.3rem;  line-height: 1.2;color: #ffc730;}
.testoHP p{ font-size: 1.2em;font-family: var(--title-font-family); line-height: 1.35;padding-top:20px;text-shadow: 0 3px 6px rgba(0,0,0,0.8);}
.testoHP h1{ text-shadow: 0 2px 4px rgba(0,0,0,0.6);}
.testoHP a{color:#e5be38 !important}
.testoHP strong {
    display: inline !important;
}

@media (max-width: 1200px) {
  .title {font-size: 1rem;}
	.page-content:has(> :nth-child(6):last-child) {
	    grid-template-columns: repeat(3, 1fr);
	    justify-content: center;
	}    
}


/* Overlay sfumato */
.bg-card {
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.85),
    rgba(0,0,0,0.0)
  );
  opacity: 1;
  transition: opacity .4s ease;

}

@media (hover: hover) and (min-width: 600px) {
  .hpCards::after {transform: translateY(0);}
  .content {transform: translateY(calc(1rem));}
  .content > *:not(.title, img) {display:none; transform: translateY(3rem); transition: transform 700ms cubic-bezier(0.19, 1, 0.22, 1), opacity 700ms cubic-bezier(0.19, 1, 0.22, 1);}
  .hpCards:hover, .hpCards:focus-within {align-items: center;}
  .hpCards:hover::before, .hpCards:focus-within::before {transform: translateY(4%);}
  .hpCards:hover::after, .hpCards:focus-within::after {transform: translateY(10%) scale(1.1,1.1);}
  .hpCards:hover .content, .hpCards:focus-within .content {transform: translateY(0.8rem);}
  .hpCards:hover .content > *:not(.title, .testoCard), .hpCards:focus-within .content > *:not(.title, .testoCard) {display:block;  transform: translateY(0); transition-delay: 87.5ms;}
  .hpCards:focus-within::before, .hpCards:focus-within::after, .hpCards:focus-within .content, .hpCards:focus-within .content > *:not(.title) {transition-duration: 0s;}
}



.hpCards {
  position: relative;
  z-index: 2;
}


.attivitaHP> .row:nth-child(2n+1) {flex-direction: row-reverse;text-align: left;}
.contenitore {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.img-cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/*----------------------------------------------------------
# Slider Timeline Storia
--------------------------------------------------------------*/

.storia .carousel-indicators [data-bs-target]{display:inline-block;text-indent:0px !important; background:none;width:auto;border-radius:0%;height:auto;margin:0px;-webkit-transition:all .6s ease;transition:all .6s ease}
.storia > .carousel-indicators li.active, .storia .carousel-indicators li:hover {background:none !important}
li:hover .badge, li.active .badge {background-color: #8f0202; /* Nuovo colore di sfondo */transition: background-color 0.3s ease-in-out; /* Animazione fluida */}
/*----------------------------------------------------------
# Qaudrati aree di attivita HomePage
--------------------------------------------------------------*/

.quad{position:relative;background-color:#fff;font-size:0.9em;height:200px;overflow:hidden;}
.quad * {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.quad-dati {position:absolute;z-index:1;top:20px;margin: 0px !important;color:#fff !important}
.quad-item__title{font-family:"Playfair Display";font-style:italic;font-size:2em;line-height:1em;margin:0;padding-top:10px;font-weight:500;color:#fff !important;}
.quad-item__text{padding:10px 0;font-size:15px;padding:25px 10px 0 10px;color:#ffff;opacity:0 ;}
.quad.polaroid:hover { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.1);}
.quad .btnFisso,.quad .btnServizi {background:#000;opacity:0.05;position:absolute;bottom:20px;font-size:13px}
.quad .btnServizi {background:#000;opacity:1;position:absolute;bottom:20px;font-size:13px}
.quad a:hover .btnFisso, .quad a:hover .btnServizi {z-index:3;background:rgba(255,255,225,1);transform:scale(1.1)  translate(0%, -10%);opacity:0.8;color:#000}
.quad img{opacity:.6;o-object-fit:cover;object-fit:cover;height:100%;width:100%;font-family:'object-fit: cover;';/*filter: grayscale(100%);*/}
.quad img{max-width: none;position: absolute;left: 50%;top: 50%;height: 100% !important;transform: translate(-50%,-50%);}
.quad a:hover img{opacity:.5;transform:scale(1.2)  translate(-45%, -45%);    filter: grayscale(0%);}

.quad a:hover .quad-item__text{opacity:1 ;}
.quad a:hover .quad-item__title{transform:scale(1.05)  translate(0%, 5%);-webkit-transform:scale(1.05) translate(0%, 5%);}
.quad a:hover .quad__icon{transform:scale(1.2)  translate(0%, 20%);-webkit-transform:scale(1.2) translate(0%, 20%);}

.border15 {border: 4px solid #ddd;}

@media (max-width: 1200px) {
	.quad-item__title{font-size:1.2em;}	
}

/*----------------------------------------------------------
# Submenu delle sezioni
--------------------------------------------------------------*/
.sotto-header-sticky {
    position: sticky;
    top: 160px;          /* altezza dell’header */
    z-index: 2;         /* sopra al contenuto, sotto all’header se serve */
    /*background: #ffffff !important;    /* o il colore della pagina, per evitare “buchi” */
    margin-top: -70px;
}

.menuSecondario{position:relative;/*background-color:#8F0201;*/font-size:0.8em;height:70px;overflow:hidden;}
.menuSecondario:hover{background-color:#333;}
.menuSecondario * {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.menuSecondario-dati {position:absolute;z-index:1;margin: 0px !important;color:#fff !important}
.menuSecondario-item__title{font-family:"Playfair Display";font-style:italic;font-size:1.3em;line-height:1em;margin:0;padding-top:10px;font-weight:500;color:#fff !important;}
.menuSecondario.polaroid:hover { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.1);}
.menuSecondario .btnFisso,.menuSecondario .btnServizi {background:#000;opacity:0.05;position:absolute;bottom:20px;font-size:13px}
.menuSecondario a:hover .btnFisso, .menuSecondario a:hover .btnServizi {z-index:3;background:rgba(255,255,225,1);transform:scale(1.1)  translate(0%, -10%);border:none;opacity:0.8;color:#000}
.menuSecondario img{opacity:.2;o-object-fit:cover;object-fit:cover;height:100%;width:100%;font-family:'object-fit: cover;';/*filter: grayscale(100%);*/}
.menuSecondario img{max-width: none;position: absolute;left: 50%;top: 50%;height: 100% !important;transform: translate(-50%,-50%);}
.menuSecondario a:hover img{opacity:.7;transform:scale(1.2)  translate(-45%, -45%);    filter: grayscale(0%);}

.menuSecondario a:hover .quad-item__text{opacity:1 ;}
.menuSecondario a:hover .quad-item__title{transform:scale(1.05)  translate(0%, 5%);-webkit-transform:scale(1.05) translate(0%, 5%);}
.menuSecondario a:hover .quad__icon{transform:scale(1.2)  translate(0%, 20%);-webkit-transform:scale(1.2) translate(0%, 20%);}

/* Stile per l'elemento attivo */
.menuSecondario.is-active {
    background-color: #ffcc00; /* Un fondo leggermente diverso */
    transition: all 0.3s ease;
}

.menuSecondario.is-active .menuSecondario-item__title {
    color: #e5be38 !important; /* Titolo di un altro colore */
}

@media (max-width: 768px) {
  .sotto-header-sticky {margin-top: 0px !important;top:90px !important}
	.menuSecondario-item__title {  font-size:1.2em;padding-top:5px;}
	.menuSecondario{height:45px;overflow:hidden;}	
}

/*----------------------------------------------------------
# Selettori di categoria top 
--------------------------------------------------------------*/

.catItem * {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.catItem img{opacity:1;o-object-fit:cover;object-fit:cover;height:100%;width:100%;font-family:'object-fit: cover;';filter: grayscale(0%);}
.catItem:hover img{opacity:.85;  filter: grayscale(90%);}
.catItem.active {background-color: #FEC601 !important; color:var(--color-neutral-0) !important}
.catItem:hover{background-color: #FEC601 !important;cursor:pointer }
.catItem .titleCat{line-height:1.1em;font-size:13px !important;font-weight:400;}
.catItem:hover .titleCat{opacity:1;color:var(--color-neutral-0)}
.catItem a .titleCat{opacity:1;color:var(--color-neutral-100)}

.smallCatImg{height:50px !important;width:auto !important}
h1.textSection {font-size:24px; line-height:1em;}

.imgProdottoHP{position: absolute;right: 10%; top: 50px;height:400px}


/*----------------------------------------------------------
# Testo hero vantaggi categorie e sottocategorie
--------------------------------------------------------------*/
.heroCat h2{line-height:1em;font-size:24px !important;font-weight:400;}


/*----------------------------------------------------------
# Sottocategorie
--------------------------------------------------------------*/
.subcat {font-size:13px !important;line-height:1.2em !important;text-transform:uppercase;border-bottom:none}
a .subcat   {color:#000 !important;border-right:3px solid transparent}
a .subcat:hover  {color:#eb9b2a !important;border-right:3px solid #FFC500}
.subcat >.attivo {color:#666408;font-weight:600; }
/*a .subcat::after {content: '';float:right;margin-top: -30px;height: 0px;width: 3px;background: transparent;transition: height .5s ease, background-color .5s ease;}
a .subcat:hover::after {height: 30px; background: #eb9b2a;}*/

.testoCategoria{font-size:1.2em;font-weight: 400;line-height: 1.5em;}

/*----------------------------------------------------------
# Sticky header
--------------------------------------------------------------*/
.affix {position: fixed;top: 0;	  right: 0;  left: 0;  z-index: 1030;max-height:150px;}

/*--------------------------------------------------------------
# BLOG articoli
--------------------------------------------------------------*/
.blog .card-body{margin-top:-30px}
.card-img-top {min-height: 0px}
.card-img, .card-img-top {
    border-top-left-radius: calc(2rem) !important;
    border-top-right-radius: calc(2rem) !important;    
}

/*----------------------------------------------------------
# Img e testo dettaglio sezioni
--------------------------------------------------------------*/

.sectionTitle:before{content: "\F6B0";position: absolute;/*top: 50%;*/left:0px;color: #ddd;font-family: "bootstrap-icons";font-style: normal;line-height: 1.5em;text-align: center;text-indent: -2px;width: 1em;margin-top: -0.75em;font-size:100px !important;z-index: -1;transition: .2s all ease-in-out, .4s transform ease-in-out;}


.dettaglioSezione> .row:nth-child(2n+1) {flex-direction: row-reverse;text-align: left;}
.dettaglioSezione>.row:nth-child(even) {background-color: #FFC500;}
.dettaglioSezione>.row:nth-child(even) .prod-bar {background-color: #FFFFFF;}
.dettaglioSezione>.row:nth-child(odd){background:#FFFFFF }
.imgSezione {min-height: 450px; -o-object-fit:cover;object-fit:cover; background-size:  cover;background-position: center center;background-repeat: none;}
.colBoxTitleSezione{height:150px;  display: flex;align-items: center;justify-content: flex-end;}

.testoSezione{font-size:1em;line-height:1.5em}
.testoSezione .feature-title {font-size:0.8em;}

.boxTitolo{font-family: "Playfair Display";font-size: 2.2em;font-style: italic;font-weight: 500;line-height: 1.1em !important;}
.boxTesto{}




/*----------------------------------------------------------
# Prodotti
--------------------------------------------------------------*/
/*.card {background: linear-gradient(var(--color-neutral-10) 0 0) calc(100% - var(--p,0%)) / var(--p,0%) no-repeat;transition: .4s, background-position 0s;}
.card:hover { --p: 100%;}*/

.card * {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.card{border:none !important;overflow:hidden;margin: 0px !important;border-radius: 0%;}
/*.card:hover{background:#ddd;-webkit-transition:all .2s ease;transition:all .2s ease;}*/
.card:hover .btnCatProd {background:transparent !important;color:#8f0202 !important;border:3px solid #8f0202 !important;}
.card a{color:#000000 !important}
.prod:hover{background:#d8e0ce !important}
.prod:hover .btnProd {background:#8f0202 !important;color:#fff !important;}

.productCardTitle{font-size:16px;line-height:1em;text-transform:uppercase;font-weight:400}
.subTitle, .subTitle p{line-height:1em;font-weight:300;text-transform:uppercase;color:#333;}
.productTitle{font-size:48px;line-height:1em;text-transform:uppercase;font-weight:400}
/* === HEADING STYLE productTitle === */
.catTitle  {font-size: 28px;font-weight: 500;text-transform:uppercase;padding-bottom: 15px;position: relative;}
.catTitle:before {content: "";position: absolute;left: 0;bottom: 0;height: 5px;width: 55px;background-color: #FFC500;}
.catTitle:after {content: "";position: absolute;left: 0;bottom: 2px;height: 1px;width: 95%;max-width: 255px;background-color: #FFC500}
.subText{color:#333;}

.prod-bar {width: 50px;height: 2px;background-color: #FFC500;margin:25px 0;font-weight:700}
.card .video {position: absolute;top: 0;left: 0;width: 100%;height: 100%;aspect-ratio: 16/9; /* Adatta l'aspect ratio in base alle dimensioni del video */}
.card .video:hover {opacity:0 ;}
.iframe-container {position: relative;height: 100%;min-height: 50vh;iframe{height: 100%;width: 100%;left: 0;top: 0;position: absolute;body,html {height: 100%;overflow: hidden;background: transparent;}}}
.feature-card {border: none;background-color: transparent;text-align: left;}
.feature-title {font-weight: 500;font-size:0.8em}



.dettaglioProdotti> .row:nth-child(2n+1) {flex-direction: row-reverse;text-align: left;}
.dettaglioProdotti>.row:nth-child(even) {background: linear-gradient(to right,  var(--color-neutral-10) 50%, #FFC500 50%)}
.dettaglioProdotti>.row:nth-child(odd){background:#FFFFFF }
.dettaglioProdotti>.row:nth-child(even) .prod-bar {background-color: #FFFFFF;}
.imgDettaglio {min-height: 450px; -o-object-fit:cover;object-fit:cover; background-size:  cover;background-position: center center;background-repeat: none;}

.colBoxTitleProd{height:150px;  display: flex;align-items: center;justify-content: flex-end;}

.testoProdotto{font-size:1.2em;line-height:1.5em}
.testoProdotto .feature-title {font-size:0.8em;}

/*----------------------------------------------------------
# Prodotti Correlati
--------------------------------------------------------------*/
.relatedTitle {font-size:2em; color:#fff;font-weight:500;}


/*----------------------------------------------------------
# Personalizzazione punti elenco
--------------------------------------------------------------*/
.testoProdotto ul > li, .testoCategoria ul > li{ padding: 5px 0px 0px 10px}
.testoProdotto ul > li::marker,.testoCategoria ul > li::marker  {content: "\F26C"; font-family: bootstrap-icons !important; position: absolute;left: 0;top: 0;color: #7c8120; vertical-align: -.250em;margin-left: 5px; }


/*----------------------------------------------------------
# Foto nel sito
--------------------------------------------------------------*/
.foto *{-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
/*.foto img{position: absolute;left: 50%;top: 50%;width: 100% !important;transform: translate(-50%,-50%);}*/
.foto:hover img{opacity:.7;transform:scale(1.05);    filter: grayscale(90%);z-index:2}
/*.foto:hover::after {content: '\F62C';font-family: bootstrap-icons !important;position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);font-size: 30px;z-index: 99;color:#FFC500}*/
.foto{position:relative;text-align:center;font-size:0.9em;overflow:hidden;  }

.foto-full {
    position: relative;
}

.foto-full a,
.foto-full img {
    display: block;
    width: 100%;
    height: 100%;
}

.foto-full img {
    /*position: absolute;*/
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}


/*--------------------------------------------------------------
# NEWSLETTER
--------------------------------------------------------------*/
.sticky-newsletter {
    position: fixed;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background: #e5be38;
    color: #fff;
    padding: 5px 12px;
    border-radius: 8px 0 0 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    z-index: 9999;
    transition: all .3s ease-in-out;
    white-space: nowrap;
}

/* Solo l’icona visibile inizialmente */
.sticky-newsletter .label {
    opacity: 0;
    max-width: 0;
    overflow: hidden;
    transition: all .3s ease-in-out;
}

/* Hover: si sposta verso sinistra e rivela la scritta */
.sticky-newsletter:hover {
    right: 0;
    transform: translateY(-50%) translateX(-10px);
}

.sticky-newsletter:hover .label {
    opacity: 1;
    max-width: 200px;
}
@media (max-width: 1200px) {
		.sticky-newsletter {display:none;}
}

#closePopupBtn {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 10;
    background: #a02020;
    border: none;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

#closePopupBtn span {
    color: #fff;
    font-size: 24px;
    line-height: 1;
}
/*----------------------------------------------------------
# Milestones
--------------------------------------------------------------*/

#milestones{
  padding-top: 50px;
  padding-bottom: 50px;
  background-image: url('img/ingredienti-a.jpg'), url('img/ingredienti-b.jpg');
  background-repeat:no-repeat, no-repeat;
  background-size: contain,contain;
  background-position: left top, left bottom;
}

#milestones .title{
  text-align: center;
  position: relative;
}

#milestones .title p{
  font-size: 18px;
  white-space: nowrap;
}

#milestones .title h1{
  margin-top: 0;
  margin-bottom: 28px;

}

#milestones .rows-wrapper{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  padding-top: 50px;
}

#milestones .row.voffset{
  margin-top: -100px;
}

#milestones .row h3{
  margin: 0;
  font-size: 27px;
  font-weight: 800;
  color: #8f0201;
}


#milestones .row h4{
  margin-top: 3px;
  margin-bottom: 28px;
  font-size: 18px;
  font-weight: 800;
  text-transform: uppercase;
}

#milestones .row p{
  font-size: 16px;
}

#milestones .row hr{
  margin: 13.5px 0;
}

#milestones .row.odd{
  text-align: right;
}

#milestones .row.even .vertical-line{
  padding-left: 0;
}

#milestones .row.odd .vertical-line{
  padding-right: 0;
}

#milestones .container{
  position: relative;
}

#milestones .vline{
  border-left: 1px solid #000;
  width: 1px;
  height: 100%;
  position: absolute;
  left: 50%;
  top:0;
}
@media (max-width: 768px) {
		#milestones .row.voffset {margin-top: -0px !important;}
}
/*----------------------------------------------------------
# Fine Milestones
--------------------------------------------------------------*/

/*----------------------------------------------------------
# Sezioni Istituzionali
--------------------------------------------------------------*/

.c-hero{position:relative}
.c-hero__figure{overflow:hidden;width:100%;/*height:750px;min-height:750px;*/background-size:cover;position:relative;background-repeat:no-repeat;background-position:center}
.c-hero__figure_small{width:100vw;height:400px;background-size:cover;position:relative;background-repeat:no-repeat;background-position: center}
.c-hero__figure img{-o-object-fit:cover;object-fit:cover;width:100%;min-height:570px;font-family:'object-fit: cover;'}

.about{border: 3px solid #FFC500;padding: 3% 12% 3% 3%;}

.sectionSubTitle, .sectionSubTitle p{line-height:1em;font-weight:300;text-transform:uppercase;margin:0}
.subTitleSection {font-weight:300;line-height:1em;}

.titleBlock{line-height:1.2;font-size:24px;font-weight:600;}
.contentBlock .row:nth-child(2n+1) {flex-direction: row-reverse;text-align: left;}
.contentBlock .row:nth-child(even) .about {padding: 3% 3% 3% 12%;z-index: -1;}
.img-decentered { margin:-80px 0 0 0; /* Decentramento verticale */}
.contentBlock .row:nth-child(even) .img-decentered {margin:0 -80px 0 0;}

@media (max-width: 768px) {
  .img-decentered {
    position: relative;
    top: 0;
    left: 0;
    transform: none;
    max-width: 100%; /* Mantiene le immagini responsive sui dispositivi più piccoli */
    margin-top: 0;
  }
}

/*----------------------------------------------------------
# Fine Sezioni Istituzionali
--------------------------------------------------------------*/
/*----------------------------------------------------------
# click to Action
--------------------------------------------------------------*/
.cta-img{width:100vw;min-height:300px;background-size:cover;position:relative;background-repeat:no-repeat;background-position: center;opacity:0.8}
.content-overlay {z-index: 1; /* Porta il testo e il pulsante davanti all'immagine */}
.testo-cta{font-size:0.8rem}
.opacity-60 {opacity: 0.6;}

/*----------------------------------------------------------
# Fine click to Action
--------------------------------------------------------------*/
/*----------------------------------------------------------
# Buttons
--------------------------------------------------------------*/
.btnHero, .btnSlider, .btnCards, .btnServizi{font-family:"Inter";display:inline-block;position:relative;padding:5px 15px;text-transform:uppercase;background:transparent !important;border:3px solid #8f0202;background:#8f0202 !important; font-weight:400;border-radius:10px}
.btnHero:hover {background:#8f0202 !important;color:#fff !important;border:3px solid #8f0202;	}
a.btnHero:hover {color:#fff !important	}
.btnSlider a{color:#fff !important;}
.btnSlider:hover a{color:#8f0202 !important;}
.btnSlider:hover {background:transparent !important;color:#8f0202 !important;border:3px solid #8f0202;	}
a .btnCatProd, a.btnCatProd{color:#fff !important;background:#eb9b2a !important;border:3px solid #eb9b2a !important;}
.btnCatProd:hover a{color:#8f0202 !important;}
.btnCatProd:hover {background:transparent !important;color:#8f0202 !important;border:3px solid #8f0202 !important;}
a.btnBrochure:hover {color:var(--color-neutral-80) !important	}
.btnServizi{color:#fff !important;text-transform:uppercase;background:transparent !important;border:3px solid #ffffff;}
.btnServizi:hover {background:#eb9b2a !important;color:#fff !important;border:3px solid #eb9b2a;	}
.btnCart{display:inline-block;position:relative;padding:15px 20px;text-transform:uppercase;background:transparent !important;background:#FFC500 !important; font-weight:400;border-radius:10px}

.btnCards{background:#fff !important;border:3px solid #fff;font-size:13px;margin-top: auto; /* spinge il bottone in fondo */}
.btnCards:hover a{color:#fff !important;}
.btnCards:hover {background:transparent !important;color:#fff !important;border:3px solid #fff;	}
/*----------------------------------------------------------
# Fine Buttons
--------------------------------------------------------------*/
/*----------------------------------------------------------
# Blockquote
--------------------------------------------------------------*/
blockquote{border-left: 3px solid #8f0202;color: #1a1a1a;font-family: "Playfair Display", serif;font-size: 1.25em;font-style: italic;line-height: 1.8em;margin: 1.1em 3em; padding: 1em 2em;position: relative; transition: .2s border ease-in-out;z-index: 0;}
blockquote:before{content: "";position: absolute;top: 50%;left: -4px;height: 4em;background-color: #fff;width: 5px;margin-top: -2em;}
blockquote:after{content: "\F255";position: absolute;top: 50%;left: -0.5em;color: #8f0202;font-family: "bootstrap-icons";font-style: normal;line-height: 1.5em;text-align: center;text-indent: -2px;width: 1em;margin-top: -0.75em;font-size:3em !important;transition: .2s all ease-in-out, .4s transform ease-in-out;}
.testoSezione blockquote:before{background-color: #FFC500;}
/*----------------------------------------------------------
# Fine Blockquote
--------------------------------------------------------------*/
/*----------------------------------------------------------
# Pagination
--------------------------------------------------------------*/
.page-numbers.current{width: 40px;height: 40px;line-height: 40px;text-align: center;font-size:13px;color: #fff;border-radius: 50%;display: inline-block !important;background-color: #7c8120;margin: 5px;border:none;}
.page-numbers {width: 40px;height: 40px;line-height: 40px;text-align: center;font-size: 13px;color: #333;border-radius: 50%;display: inline-block !important;background-color: #ddd;border:none;margin: 5px;}
.page-numbers .nextpostslink, .wp-pagenavi .previouspostslink {background-color: #ccc}
.nav-links a.next,.nav-links a.prev {width:auto;border-radius:0px;background:transparent}
.nav-links a.next:hover,
.nav-links a.prev:hover {
	color: #FFC500;
}
/*----------------------------------------------------------
# Fine Pagination
--------------------------------------------------------------*/
/*----------------------------------------------------------
# News
--------------------------------------------------------------*/
.btnNews{font-size:15px !important;background-color: #333;position: absolute;padding: 15px 40px !important;border-radius:15px !important;/*bottom: 0px;position: absolute;*/}

/*----------------------------------------------------------
# Fine News
--------------------------------------------------------------*/
/*----------------------------------------------------------
# Servizi Home Page
--------------------------------------------------------------*/
.servizi .card:hover img{opacity:.9;  filter: grayscale(100%);}
.servizi .card:hover {background:#eb9b2a !important;transform:scale(1.1);-webkit-transform:scale(1.1)}

/*----------------------------------------------------------
# Fine Servizi Home Page
--------------------------------------------------------------*/
/*----------------------------------------------------------
# Referenze Home Page
--------------------------------------------------------------*/
.titleRef{font-weight:600;padding-left:30px}
.titleRef:before{content: "\F25A";font-family: "bootstrap-icons";font-style: normal;position:absolute;margin-left:-30px}
.testoRef{font-size:1.3em;font-family: Georgia, Times, "Times New Roman", serif;font-style:italic}


/*----------------------------------------------------------
# Fine Referenze Home Page
--------------------------------------------------------------*/
/*----------------------------------------------------------
# OWL Carousel
--------------------------------------------------------------*/
.owl-dots{display:flex;justify-content: center;margin:0px auto;padding:3em 0}
.owl-dot{display:inline-block;background:#FFC500;width:15px;border-radius:15px;height:15px;margin:10px 5px;-webkit-transition:all .6s ease;transition:all .6s ease}
.owl-dot.active{background:#8f0202;width:30px}

.owl-item {text-align: center;}

.owl-nav div {background: transparent;color: #fff;font-size: 40px;margin: auto;padding: 0 20px;position: absolute;bottom: 10px;border:1px solid #fff}
.owl-nav div:hover {background: #ffffff;color: #A02020 !important;}
.owl-nav .owl-prev {left: 10px;}
.owl-nav .owl-next {right: 10px}

.owl-carousel .item { display: flex; height: 100%; } .owl-carousel .card { flex: 1; display: flex; flex-direction: column; }

@media screen and (min-width:0) and (max-width:720px) {
.owl-nav div {font-size: 20px;bottom: 45%;}
}

/*----------------------------------------------------------
# Fine OWL Carousel
--------------------------------------------------------------*/

/*----------------------------------------------------------
# Partners
--------------------------------------------------------------*/
.partners{padding-bottom:3px}
.partners__item{background-color:#fff;display:block;height:150px;text-align:center;line-height:150px}
.partners__item img{height:150px;width:auto!important;display:inline-block !important;filter: grayscale(100%)}
.partners__item:hover img{filter: grayscale(0%)}


/*----------------------------------------------------------
# Fine Partners
--------------------------------------------------------------*/
/*----------------------------------------------------------
#  Blog e articoli
--------------------------------------------------------------*/
.imgTopBlog{min-height:250px !important}
.imgTopBlog h1{font-size:72px}
.blog-menu ul {
		font-size:14px;
		color:#333;
		list-style: none;
    padding-left: 0px;
    margin-bottom: 0;
    text-transform:initial;
    line-height:1.5em
}
.blog-menu li, .blog-menu a li {
    padding: 11px 0;
    margin-bottom: 0;
    border-bottom: 1px solid #FFC500;
		color:#666 !important;
}
.blog-menu li:hover{
		color:#000 !important;
}
.blog-item { border:1px solid #ddd;font-size: small;}
.blog-home *{-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.blog-item a{color:#000 !important;}
.blog-item h2{color:#666 !important;}
.testoBlog{font-size:13px;line-height:1.4em}
.blog-home { margin:0 15px}
.blog-home a{color:#000 !important;}
.blog-img{filter: grayscale(50%);}
.blog-img:hover{filter: grayscale(0%);}

.linkArticolo{font-family:"Playfair Display";padding:5px;color:#fff !important;}
.linkArticolo {background: linear-gradient(#8f0202 0 0) calc(100% - var(--p,0%)) / var(--p,0%) no-repeat;transition: .4s, background-position 0s;}
.linkArticolo:hover { --p: 100%;}
/*----------------------------------------------------------
# Fine Blog
--------------------------------------------------------------*/
/*----------------------------------------------------------
# Contact Form 
--------------------------------------------------------------*/
.form-group input, .form-group select, .form-group textarea {margin:10px 0px}
.readonly {
  pointer-events: none;
  opacity: 0.7; /* Opzionale: per un effetto di disabilitazione */
}
/*--------------------------------------------------------------
# FORM CONTATTI
--------------------------------------------------------------*/
.contatti{margin:30px 0;}

.contatti textarea{height: 100%;}
.contatti .btn{font-weight: 700;text-transform: uppercase;color: #fff;padding: 0;width: 250px !important;border-radius: 25px;box-shadow: none;border: none;cursor: pointer}

.wpcf7-form input[type="text"], 
.wpcf7-form select, 
.wpcf7-form input[type="email"], 
.wpcf7-form input[type="date"], 
.wpcf7-form input[type="url"], 
.wpcf7-form input[type="password"], 
.wpcf7-form input[type="search"], 
.wpcf7-form input[type="number"], 
.wpcf7-form input[type="tel"], 
.wpcf7-form textarea {
    color: #1f252b;
		font-size: 15px;    
    width: 100%;
    padding: 12px 16px;
    border-radius: 10px;
    border: 1px solid #ddd;
}

/*span.wpcf7-list-item {display: block;}*/
.wpcf7-form p {
    margin: 0 0 28px;
}
.wpcf7-text:focus, 
.wpcf7-textarea:focus {
    outline: 1px solid rgba(1, 158, 224, 0.9);
    outline-offset: 0;
}

span.wpcf7-not-valid-tip {display:none}
.wpcf7-spinner{position: absolute !important;left:48%}
.wpcf7-display-none {
  display: none;
}

div.wpcf7-mail-sent-ok {
    border: 0;
    background: #5471de;
    color: #fff;
    padding: 18px;
}
div.wpcf7-acceptance-missing,
div.wpcf7-validation-errors {
    border: 0;
    background: #f9443b;
    color: #fff;
    padding: 18px;
}
span.wpcf7-not-valid-tip {
    color: #f9443b;
}
/* 
** Button Styles 
*/
.btnNewsletter {
  background-color: #FFC500;
  border: 0;
  color: #fff;
  border-radius: 1px;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 15px;
  width: auto;
  padding: 10px 42px;
  letter-spacing: 2px;
  font-size: 14px;
}
.wpcf7-form .btn, .btnInvia {
    background-color: #FFC500;
    border: 0;
    color: #fff;
    border-radius: 1px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 15px;
    width: auto;
    padding: 20px 42px;
    letter-spacing: 2px;
    font-size: 14px;
}
.wpcf7-form .btn:hover {
    cursor: pointer;
    box-shadow: 0px 7px 16px -7px rgba(0, 0, 0, 0.4);
    border: 0;
}
input.wpcf7-not-valid {
  border: 1px solid #cc0000 !important;
}
span.wpcf7-not-valid {
     color: #cc0000;
}
label.form-check.form-check-checkbox.not-valid {
  color: var(--bs-danger);
}
label.form-check.form-check-checkbox.not-valid.checked {
  color: currentColor;
}
button.btn.wpcf7-submit:disabled {
  cursor: not-allowed;
}
.wpcf7-form.submitting .wpcf7-response-output {
  display: none;
}
.wpcf7-form .ajax-loader {
    width: 0; 
    height: 1rem;
    margin: 0 0 0 -.3rem;
    opacity: 0; 
    transition: margin .3s,width .3s,opacity .1s;
}
.form-check-input {
    width: 1em;
    height: 1em;
    margin-top: 0.25em;
    vertical-align: top;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 1px solid rgba(0, 0, 0, 0.25);
    transition: all 0.2s ease-in-out;
}
.wpcf7-form-control-wrap {
  font-family: Roboto, bootstrap-icons !important;
}

/*--------------------------------------------------------------
# FINE FORM CONTATTI
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# GALLERIA IMMAGINI
--------------------------------------------------------------*/
.gallImg  {max-width: none;position: relative;height:  150px;o-object-fit: cover;object-fit: cover;width: 100%;font-family: 'object-fit: cover;'; }
.borderRound{border-radius: calc(2rem) !important;}
.roundTop{
    border-top-left-radius: calc(2rem) !important;
    border-top-right-radius: calc(2rem) !important;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  --index: calc(1vw + 1vh);
  --transition-smooth: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --transition-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
}


.wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

.items {
  display: flex;
  gap: 0.4rem;
  perspective: calc(var(--index) * 35);
}

.itemimg {
  position: relative;
  background-color: #222;
  width: calc(var(--index) * 8);
  height: calc(var(--index) * 12);
  background-size: cover;
  background-position: center;
  cursor: pointer;
  transition: transform 0.8s var(--transition-smooth),
    filter 0.6s var(--transition-smooth), width 0.8s var(--transition-smooth),
    box-shadow 0.6s var(--transition-smooth);
  will-change: transform;
  filter: grayscale(0) brightness(0.8);
  transform-origin: center;
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
}

.itemimg::before,
.itemimg::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 100%;
  right: calc(var(--index) * -1);
}

.itemimg::after {
  left: calc(var(--index) * -1);
}

.items .itemimg:hover {
  transform: translateZ(calc(var(--index) * 10)) scale(1.02);
  filter: grayscale(0) brightness(1);
  box-shadow: 0 calc(var(--index) * 2) calc(var(--index) * 4) rgba(0, 0, 0, 0.5);
}

/* Right side cascade */
.items .itemimg:hover + * {
  transform: translateZ(calc(var(--index) * 8.5)) rotateY(35deg);
  filter: grayscale(0) brightness(0.9);
  z-index: -1;
}

.items .itemimg:hover + * + * {
  transform: translateZ(calc(var(--index) * 5.6)) rotateY(40deg);
  filter: grayscale(0.3) brightness(0.8);
  z-index: -2;
}

.items .itemimg:hover + * + * + * {
  transform: translateZ(calc(var(--index) * 2.4)) rotateY(30deg);
  filter: grayscale(0.5) brightness(0.7);
  z-index: -3;
}

.items .itemimg:hover + * + * + * + * {
  transform: translateZ(calc(var(--index) * 0.6)) rotateY(14deg);
  filter: grayscale(0.7) brightness(0.6);
  z-index: -4;
}

/* Left side cascade */
.itemimg:has(+ :hover) {
  transform: translateZ(calc(var(--index) * 8.5)) rotateY(-35deg);
  filter: grayscale(0) brightness(0.9);
}

.itemimg:has(+ * + :hover) {
  transform: translateZ(calc(var(--index) * 5.6)) rotateY(-40deg);
  filter: grayscale(0.3) brightness(0.8);
}

.itemimg:has(+ * + * + :hover) {
  transform: translateZ(calc(var(--index) * 2.4)) rotateY(-30deg);
  filter: grayscale(0.5) brightness(0.7);
}

.itemimg:has(+ * + * + * + :hover) {
  transform: translateZ(calc(var(--index) * 0.6)) rotateY(-14deg);
  filter: grayscale(0.3) brightness(0.8);
}

.items .itemimg:active,
.items .itemimg:focus {
  width: 28vw;
  transform: translateZ(calc(var(--index) * 10)) scale(1);
  filter: grayscale(0) brightness(1);
  z-index: 100;
  margin: 0 0.45vw;
  outline: none;
  box-shadow: 0 calc(var(--index) * 3) calc(var(--index) * 6) rgba(0, 0, 0, 0.7);
}



/*--------------------------------------------------------------
# FINE GALLERIA IMMAGINI
--------------------------------------------------------------*/


/*--------------------------------------------------------------
# MOUSE SCROLL ANIMAZIONE
--------------------------------------------------------------*/

.mouseIcon {
	postion:absolute;
  margin: 0 auto;
  border: 2px solid white;
  height: 62px;
  width: 36px;
  border-radius: 18px;
  position: relative;
  background-color: rgba(255,255,255,.05);
  cursor: pointer;
  margin-bottom:100px;
	transition: all .3s ease-in-out;
}

.mouseIcon:before {
  content: '';
  background: white;
  height: 6px;
  width: 2px;
  position: absolute;
  top: 14px;
  border-radius: 1px;
  left: calc(50% - 1px);
  animation: scroll 1.15s infinite;
}

@keyframes scroll {
  15% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateY(24px);
  }
}

/*--------------------------------------------------------------
# FINE MOUSE SCROLL 
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# MENU DI NAVIGAZIONE
--------------------------------------------------------------*/
.openMenu{position:absolute;top:100px;left:0;width:100%;height:0px;z-index:1000;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.tinyHeader{line-height:40px}
.scrolled{border-top: 30px solid transparent !important; }
.main-nav .menu-item a.scrolled::before { top: -8px; }

/* .site-nav > ul > li.menu-item {background: linear-gradient(#7c8120 0 0) calc(100% - var(--p,0%)) / var(--p,0%) no-repeat;transition: .4s, background-position 0s;}
.site-nav> ul > li.menu-item:hover { --p: 100%;} */




.main-nav {
    display: grid;
    grid-template-columns: 1fr auto 1fr; /* 3 colonne: laterali uguali, centro automatico */
    align-items: center;
    width: 100%;
}

.menu-left {
    justify-self: end;
    margin-right: 40px;
}

.menu-right {
    justify-self: start;
    margin-left: 40px;
}
.menu-left ul,
.menu-right ul {
    display: flex;
    gap: 20px;
    font-family:'Playfair Display';
    font-size:1.4em;
    font-weight:normal;
}

.menu-logo {
   /* justify-self: center;*/
}
.menu-logo img {
    height: 90px; /* regola a piacere */
}
@media (max-width: 1200px) {
    .main-nav { gap: 10px; }
    .menu-left ul, .menu-right ul { font-size: 1em; }
}
@media screen and (max-width:768px) {
		.menu-logo img {
		    height: 60px; /* regola a piacere */
		}
  }


.main-nav .menu-item a::before {content: '';position:relative;top:-20px;display: block;margin: auto;height: 5px;width: 0px;background: transparent;transition: width .5s ease, background-color .5s ease;}

.main-nav .menu-item a:hover::before {width: 100%;background: #FFC500;}
.main-nav .sub-menu .menu-item a::before {display: none}


.site-nav{line-height:50px;position:relative;font-size:15px;font-weight:500;}
.site-nav ul{margin:0px !important;}

.menu-item {list-style-type:none;display:inline-block;}
.menu-item a {color:#ffffff !important}
.menu-item ul{margin:0px;}


/* rollover voce di menu di primo livello */
.main-nav li.main-menu-item a:hover {color:#FFC500 !important}
.main-nav-item a:hover,.site-nav-item a:focus{text-decoration:none!important;}
/*.site-header .site-nav-item.current-menu-item a,.site-header .site-nav-item.current_page_parent a,.site-header .site-nav-item.current_page_ancestor a{color:#d8e0ce !important;}*/

.main-nav .current-menu-item a, .main-nav .current_page_parent a, .main-nav .current-page-ancestor a {color:#cba619 !important;}


/* qui cominciano i sottomenu */
/*.sub-menu{display:none;position:fixed;padding-top: 20px !important;list-style:none;padding:0!important;line-height:1em;z-index:1030;text-align:left;}
.sub-menu ul{display:block;position:relative;margin:0;}
.sub-menu li {list-style-type:none;display:block;position:relative;font-weight:400;font-size:14px;width:100%;padding-top:12px;line-height:1.2em;padding-right:20px}*/

.main-nav .sub-menu li:first{padding-top: 50px;}
.main-nav .sub-menu a{color:#000000 !important;}
.sub-menu a:hover{color:#8f0202 !important;background:none !important;}
.main-nav .menu-item .sub-menu > li:first-child > a{padding-top: 30px !important;}
.main-nav .menu-item .sub-menu > li:last-child > a{padding-bottom: 30px !important;}
.main-nav .menu-item .sub-menu li[class^="icon-"]{margin-left:20px}
.main-nav .menu-item .sub-menu ul{display:block;position:relative;margin:0; padding-top:20px}
.main-nav .menu-item .sub-menu li {display:block;position:relative;padding:0 35px !important;font-size: .8em !important; text-align: right;}
.main-nav .menu-item .sub-menu li a{color:#000000 !important;background:transparent;display:inline-block;line-height: 0.7em;}



@media screen and (min-width:1024px) {
  .nav-mobile{display:none}
  .c-site-header__nav__item.menu-item-has-children:hover::after{content:'';display:block;background:#fff;width:20px;height:20px;position:absolute;bottom:-10px;-webkit-transform:translateX(25px) rotate(45deg);transform:translateX(25px) rotate(45deg)}
  }
/*--------------------------------------------------------------
# FINE MENU DI NAVIGAZIONE
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# MEGAMENU
--------------------------------------------------------------*/
.mega-menu-description{display:none !important}


/* Impedisce lo scroll del corpo della pagina */
body.no-scroll {
    overflow: hidden;
    height: 100vh;
}

/* 1. POSIZIONAMENTO BASE */
.main-nav-fullscreen {
    position: relative;
}

.main-nav-fullscreen .menu-item-has-children {
    position: static; /* Permette al sottomenu di espandersi su tutta la larghezza */
}

/* 2. L'OVERLAY (IL SOTTOMENU) */
.main-nav-fullscreen .sub-menu {
		text-align:right;
    position: fixed;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #ddd;
    z-index: 9999;
    
    /* CREIAMO LE DUE COLONNE REALI */
    display: block; /* Torniamo a block per gestire i figli manualmente */
    padding: 0;
    margin: 0;
    list-style: none;
    
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease;
    
		display: flex;
    flex-direction: column; /* Incolonna i link dall'alto in basso */
    justify-content: center; /* CENTRATURA VERTICALE */
    align-items: flex-start; /* Allinea i link a sinistra */
     

    /* IL PONTE INVISIBILE (Tecnica del bordo trasparente) */
    border-top: 60px solid transparent; 
    background-clip: padding-box;
    margin-top: 0px; 
}

/* MOSTRA AL PASSAGGIO DEL MOUSE */
.menu-item-has-children:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
}

.main-nav-fullscreen .sub-menu.is-hidden {
    opacity: 0;
    visibility: hidden;
}


/* 3. COLONNA SINISTRA: LE VOCI DI MENU (UNA SOPRA L'ALTRA) */
.main-nav-fullscreen .sub-menu li {
    width: 40%; /* La colonna sinistra occupa il 40% */
}

.main-nav-fullscreen .sub-menu li a:hover {
    color: #a32a29 !important; /* Rosso brand */
    transform: translateX(-10px);
    transition: 0.3s;
}

/* 4. COLONNA DESTRA: IMMAGINE E TESTO (FISSA A DESTRA) */
/* Usiamo lo pseudo-elemento ::after attaccato al sottomenu */
.main-nav-fullscreen .sub-menu::after {
    /* Variabili gestite da JS */
    /*content: var(--menu-text, "Seleziona una voce per scoprire i dettagli.");*/
		content: ""; /* Svuotiamo il testo da qui */
    background-color:#000000;
    background-image: linear-gradient(to top, rgba(0,0,0,0.7), transparent), 
		var(--menu-image, url(''));
    
    /* Layout Colonna Destra (60%) */
    position: absolute;
    top: 0;
    right: 0;
    width: 60%;
    height: 100%;
    
    /* Stile Testo */
    display: flex;
    align-items:center;
    text-align:left;
    padding: 10%;
    box-sizing: border-box;
    color: white;
    font-size: 1.4rem;
    line-height: 1.6;
    
    background-size: cover;
    background-position: center;
    transition: all 0.4s ease-in-out;
    white-space: pre-wrap;
    z-index: 1;
    
/* Transizione per il fade dell'immagine */
    transition: background-image 1s ease-in-out, opacity 1s ease-in-out;
    background-size: cover;
    background-position: center;
    z-index: 1;
}


/* Nuovo stile per il testo HTML reale */
.info-display {
		position: absolute;
    top: 0;
    left: 40%; /* Inizia subito dopo la colonna dei link (40%) */
    width: 60%; /* Occupa il resto dello spazio */
    height: 100%;
    z-index: 2; /* Sopra l'immagine di sfondo */
    
    display: flex;
    flex-direction: column;
    justify-content: center; /* Centrato verticalmente nella pagina */
    align-items: flex-start; /* Allineato a sinistra del suo contenitore */
    text-align: left;
    
    padding: 0 4%; /* Padding laterale per non appiccicarlo ai link o al bordo */
    box-sizing: border-box;
    color: white;
    font-size: 1.2rem;
    line-height: 1.6;
    pointer-events: none; /* Evita che il testo disturbi il mouse */
    transition: opacity 0.4s ease, transform 0.4s ease;
}



/* Stato iniziale dei link (nascosti e leggermente in basso) */
.main-nav-fullscreen .sub-menu li {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.5s ease;
}

/* Quando l'overlay è attivo, i link salgono e appaiono */
.menu-item-has-children:hover .sub-menu li {
    opacity: 1;
    transform: translateY(0);
}

/* Effetto a cascata: ogni link appare con un leggero ritardo rispetto al precedente */
.main-nav-fullscreen .sub-menu li:nth-child(1) { transition-delay: 0.1s; }
.main-nav-fullscreen .sub-menu li:nth-child(2) { transition-delay: 0.15s; }
.main-nav-fullscreen .sub-menu li:nth-child(3) { transition-delay: 0.2s; }
.main-nav-fullscreen .sub-menu li:nth-child(4) { transition-delay: 0.25s; }
.main-nav-fullscreen .sub-menu li:nth-child(5) { transition-delay: 0.3s; }


.menu-item-has-children:hover .sub-menu::after {
    opacity: 1;
}

/*--------------------------------------------------------------
# FINE MEGAMENU
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# CART
--------------------------------------------------------------*/
.woocommerce .quantity .qty {border-radius: 10px;padding: 14px 20px;width: 5em !important;border-color: #ccc;}


/*--------------------------------------------------------------
# FINE CART
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# BREADCRUMBS E SEARCH
--------------------------------------------------------------*/

.breadcrumbs{position:fixed;top:150px;color:#CBA619;font-size:11px;padding:20px 10px;width:100%;text-transform:uppercase;font-weight:400;z-index:3}
.breadcrumbs a{color:var(--color-neutral-0);}
.breadcrumbs span{padding:0 5px}

.searchResult{padding:20px 0;border-top:1px solid #ccc}
.searchResult {color:var(--color-neutral-80);}
.searchResult:hover{color:#FFC500}

/*--------------------------------------------------------------
# FINE BREADCRUMBS E SEARCH
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# FOOTER
--------------------------------------------------------------*/
.footer{font-size:14px;padding-top:60px;padding-bottom:60px;line-height:1.5;color:#000;font-weight:400}
.footer ul{margin:0;padding:0}
.footer li{list-style-type:none;margin-bottom:10px}
.footer a{color:#CBA619 !important}
.footer a:hover{color:#ffffff !important}
.footer-tel,.footer-tel a{color:#CBA619;font-weight:400;font-size:12px}
.footer-title a, .footer-SubCat a{color:#ffffff}
.footer-title{font-size:18px;margin:0;margin:5px 0px;font-weight: 500;}
.footer-servizi{margin:50px 0;background-color: #f5f5f5;padding-bottom:30px}
.footer-servizi a:hover{color:#CBA619}
.footer-social-item{display:inline-block;margin-right:8px}
.footer-social-item a{background:#f5f5f5;color:var(--color-neutral-80);display:block;border-radius:50%;width:50px;height:50px;line-height:50px;text-align:center;font-size:20px}

.footer-menu li a{color:#842f36;font-weight:400}

/*--------------------------------------------------------------
# FINE FOOTER
--------------------------------------------------------------*/

ol,ul{padding-left:0px}

.c-pre-contatti{display:inline-block;width:150px;height:30px;font-size:15px}


.imageTop { min-height: 500px;}

#map {height: 500px}
.mappa {height: 350px}
.acf-map {
    width: 100%;
    height: 350px; /* Importante: senza altezza la mappa è invisibile */
    border: #ccc solid 1px;
}

@media screen and (max-width:720px) {
/*--------------------------------------------------------------
# object responsive
--------------------------------------------------------------*/
.btnHero, .btnSlider, .btnServizi {font-size: 13px !important;}
.btnHero {
  display: inline-block; /* O block se necessario */
  padding: 10px 20px;
  width: 80%; 
  white-space: normal; /* Permette al testo di andare a capo */
  word-wrap: break-word; /* Gestisce le parole troppo lunghe */
  overflow: hidden; /* Evita che il contenuto esca */
  box-sizing: border-box; /* Include il padding nel calcolo delle dimensioni */
}
/*--------------------------------------------------------------
# HP responsive
--------------------------------------------------------------*/

html {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* Rimuove il flash grigio/blu del browser */
}
.row.sliderHP {min-height:150px !important}  

.testoLancio{font-size: 1.3em;}
.imageTop{ min-height: 250px !important;}
.catHP * {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.catHP{border:1px solid #ffffff !important;background-color: #FFC500 !important;}


.catHP .titleCat{line-height:1.1em;font-size:13px !important;font-weight:400;}
.catHP:hover .titleCat{opacity:1;color:var(--color-neutral-0)}

.catHP a{color:#000 !important;}
.catHP:active, .catHP:hover{background-color:var(--color-neutral-10) !important;}

.btnHero, .btnSlider, .btnServizi {font-size: 13px;}
.titleBorder{border-right: 0px !important;}

/*--------------------------------------------------------------
# fine hp
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# PRODOTTI responsive
--------------------------------------------------------------*/

.card .productCardTitle{font-size:1em}
.subTitle{font-size:0.8em}
.dettaglioProdotti{font-size:.9em}
.catTitle{font-size:1.2em}
.dettaglioProdotti>.row:nth-child(even) {background:#FFC500 }
/*--------------------------------------------------------------
# fine prodotti
--------------------------------------------------------------*/

.megamenu .sub-menu {display:none;opacity:1}
/*.c-site-header .menu-item a::before {font-family:'icomoon';content: '\ea43';display: block;margin: auto;height: 5px;width: 0px;background: transparent;transition: width .5s ease, background-color .5s ease;}*/
h1.titleSection{font-size:18px !important}
.contatti input{width:90% !important;}
.contatti .btn{border-radius:25px;margin-top:15px;right:0}


}
@media screen and (max-width:480px) {  
.video  iframe, .video embed {width: 100%;height: 300px;}
.site-nav-item {display:block;padding:15px;text-transform: uppercase;border-bottom:1px solid #b02324}
.site-nav-item a:hover {color:#FFC500 !important;}
.megamenu .sub-menu > .menu-item-has-children > a , .megamenu .sub-menu > .menu-item-object-apparecchiature > a  {color:#aa8408 !important;font-size:14px;border:none;padding:0px}
.sub-menu .site-nav-item{border:none}
.copyHP h5{font-size:1rem}
.card-img-top {width: 100%;height:auto;margin:0 auto}
.card-body {padding: 0px}
a.btnCatProd {border:none}
}

@media screen and (min-width:480px) and (max-width:720px) {
.quad-item__title{font-size:1.2em;}
.quad-menu-title{font-size:1.2em;}
.quad{border:1px solidvar(--color-neutral-0)}
}

@media screen and (min-width:0) and (max-width:998px) {
.titleCat{font-size:10px !important;}
h1.titoloSpot {font-size: 30px !important;font-style: italic;font-weight: 300 !important;text-shadow: 4px 0 7px black;}

}

@media (min-width: 1200px) {
  .container{max-width: 1440px;}
}

/* Contenitore immagine di sfondo HP*/
.bg-image {
	min-height: 100vh;   	
  background-image: url('./img/bgHomeDefault3.jpg');
  background-size: cover;
  background-position: center;
  transition: opacity .8s ease, transform .6s ease;
  opacity: 1;
  transform: scale(1);
  /*z-index: -1;*/
}
/* Contenitore immagine di sfondo Sezioni*/
.bgimg {
	min-height: 100vh;   	
  background-size: cover;
  background-position: center;
  transition: opacity .8s ease, transform .6s ease;
  opacity: 1;
  transform: scale(1);
  z-index: -1;
}
/* Fade-out */
.bg-image.fade {
  opacity: 0;
}

/* Overlay sfumato */
.bg-overlay {
		min-height: 50vh;   		
  	background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.9),
    rgba(0,0,0,0.0)
  );
  opacity: 1;
  transition: opacity .8s ease;
}

/* Overlay più visibile quando cambia immagine */
.bg-overlay.active {
  opacity: 1;
}

/* Cards */
.hpCards {
  position: relative;
  z-index: 3;
}

/* Mobile: niente hover */
@media (max-width: 768px) {
  .bg-image, .bgimg {
    transform: scale(1);
  }
}
.parallax-slider {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}
.parallax-slider {
  transition: opacity .4s ease-in-out;
  opacity: 1;
}

.parallax-slider.fade-out {
  opacity: 0;
}