/* 
Theme Name: welfarepellegrini
Description: Custom theme for welfarepellegrini
Author: WALLABI
Author URI: https://www.wallabi.it/
Template: hello-elementor
Version: 1.0.1
Text Domain: welfarepellegrini-child-theme
*/



/*-------------------------------------- VARIABILI GLOBALI --------------------------------------*/

html, body {
	font-family:'titillium web' !important;
}
[class*=" eicon-"], [class^=eicon] {	font-family: eicons !important;}:root {}

div.nuovo_menu {z-index: 100;}
.site-header, .page-header {
	display:none;
}


/*-------------------------------------- STILI TESTI PAGINE --------------------------------------*/

h2 {
  font-size: clamp(1.5rem, 1.2rem + 1.5vw, 3rem) !important;
	line-height:clamp(1.5rem, 0.8rem + 1.5vw, 3rem) !important;
}

.text-content {
  font-size: clamp(1vw, 1.2vw, 1.4vw) !important;
}

.triangoli {
	background-size: 100% 100% !important;
}


@media only screen and (max-width: 767px) {
	.titolo_h2 h2{
		font-size: 32px !important;
		font-weight:600;
		line-height: 33px !important;
	}
}


.page-id-8962 #site-footer {
	display:none;
}
#site-header {
	display:none;
}

#breadcrumbs a {
	text-decoration: underline;		
	font-size:17px;
}

.diagonale {  background: #fafafa;  clip-path: polygon(0 0, 100% 0, 100% 60%, 0 75%);}

.img_atf {	margin-top:-70px !important;}

.link-bianco a{	color:#fff !important;	font-size: 19px !important;	font-weight: 300 !important;}.link-bianco a:hover {	color:#fcde00;}.link-bianco a.attivo {	color:#fff !important;	text-decoration: underline !important;	font-weight: 400 !important;}

@media only screen and (max-width: 767px) {
	.diagonale {
  background: #fafafa;
  clip-path: polygon(0 0, 100% 0, 100% 70%, 0 90%);
}
	.img_atf {
		margin-top:-30px !important;
	}
}



/* SETTAGGI PER LA PAGINA Semplifica la gestione del tuo business */
.page-id-6107 #button-fixed{
	display:none !important;
}
.page-id-6107 .diagonale {
    display: none !important;
}

.page-id-6107 .menu_bar, .page-id-6107 .elementor-location-footer {
    display: none !important;
}

.page-id-6107 .btn.btn-outline:not(#\#):not(#\#) .pseudo-bg:after {
    background-color: #fcbe00 !important;
    color: var(--color-blue);
}

.page-id-6107 .btn.btn-secondary:not(#\#):not(#\#) .pseudo-bg {
	color:var(--color-blue);
}

.page-id-6107 .btn.btn-secondary:not(#\#):not(#\#) .pseudo-bg:after {
	background-color: #fcbe00 !important;
  color: #fff !important;
	border:1px solid var(--color-blue) !important;
	border-radius:10px !important;
}

.page-id-6107 .btn.btn-secondary:not(#\#):not(#\#) .pseudo-bg:before {
	background-color:var(--color-blue) !important;
	color:#fff !important;
}



button.wpcf7-form-control.wpcf7-submit:focus {
		outline: 2px solid #000 !important;
		outline-offset: 6px !important;
		border-radius: 6px !important;
} 

li::marker {
	color:#3d3c3c;
	}
	
#footer li::marker, #footer1 li::marker {
	color:#fff !important;
	}	

a.underline {
	text-decoration:underline !important;
}

a.link-footer{
	color:#fff !important;
	/*text-decoration:underline !important;*/
	font-size:18px !important;
}
a.link-footer:hover{
	color:#7ed2dd !important;
}

.elementor-location-footer li.link-nero a {
    color: #fcbe00 !important;
}

li {
	position:relative;
	left:-10px !important;
}

li.link-nero a {
  color: #000 !important;
}

.rientro {
	padding-left:3% !important;
	padding-right:3% !important;
}

.anchor-link{
  color: red;
  transition: color 0.6s ease;
}

.anchor-link.active {
  color: #00597B !important;
  font-weight: bold;
}

/*------------------------------- CONTACT FORM 7 ------------------------*/

#responsive-form{
max-width:1200px;
width:100%;
}

.ruota-15 {
	rotate: -15deg;
}

.form-row{
width: 100%;
}

.column-half, .column-full{
float: left;
position: relative;
padding-left: 0.45rem;
width:100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color:#1a1a1a;
}
.column-full-message {
	padding: 0.45rem;
	width:100%;
}
.column-full-privacy {
	height:120px;
}

textarea.wpcf7-form-control.wpcf7-textarea {
    height: 100px !important;
}
label {
    font-weight: 600;
		padding-bottom:5px;
		width: 100%;
		line-height: 2 !important;
		color:#1a1a1a !important;
}

a.privacy {
	font-size:14px !important;
	text-decoration:underline !important;
	color:#147385;
}
a.privacy:hover {
	color:#706f6f;
}

.clearfix:after {
content: "";
display: table;
clear: both;
}

.wpcf7-submit{
float: right;
}

.text-form {
	font-size:10px;
}

.wpcf7-submit:hover {
    padding-left: 30px !important;
    padding-right: 30px !important;
    background-image: url(/wp-content/uploads/2025/10/icona-form-informazioni.svg) !important;
    background-repeat: no-repeat !important;
    background-position: calc(50% + 100px) center !important;
    background-size: 20px 20px !important;
    text-align: center !important;
    text-indent: -20px !important;
}


button.wpcf7-form-control.wpcf7-submit {
    width: 100% !important;
    background-color: #fcbe00 !important;
    font-family: 'Titillium Web', sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    color: #3d3c3c !important;
    border: none;
    padding: 12px 20px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    border-radius: 2px !important;
    margin-top: 10px !important;
		background-image: url(/wp-content/uploads/2025/10/icona-form-informazioni.svg) !important;
    background-repeat: no-repeat !important;
    background-position: calc(50% + 100px) center !important;
    background-size: 20px 20px !important;
    text-align: center !important;
    text-indent: -20px !important;
}


button.wpcf7-form-control.wpcf7-submit:hover {
    /*float: none !important;*/
    border-color: #00597b !important;
		background: #11616f !important;
    color: #fff !important;
		font-size: 18px !important;
    /*height: 50px !important;*/
		background-image: url(/wp-content/uploads/2025/10/icona-form-informazioni-bianca.svg)!important;
    background-repeat: no-repeat !important;
    background-position: calc(50% + 100px) center !important;
    background-size: 20px 20px !important;
    text-align: center !important;
    text-indent: -20px !important;
}

span.wpcf7-list-item-label {
    color: #1a1a1a;
		font-size: 14px;
}

/**—————- Media query —————-**/
@media only screen and (min-width: 48em) {
	.column-half{
		width: 50%;
	}
}

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


/*------------------------------- Sticky Navbar ------------------------*/
.menu_bar  {
    position: fixed !important; /* Fissato in cima alla pagina */
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    padding: 10px 20px !important;
    background-color: traparent !important; /* Sfondo trasparente di default */
    transition: background-color 0.3s ease !important; /* Transizione fluida per il cambiamento di colore */
    z-index: 1000 !important; /* Assicurati che il menù sia sopra al contenuto */
		color: green !important;
}

/* Stile per il menù quando si è scrollato */
.menu_bar.scrolled {
    background-color: white !important; /* Sfondo bianco quando la pagina è scrollata */
}

.menu_bar.scrolled a {
    color: #00597B !important; /* Sfondo bianco quando la pagina è scrollata */
}
.menu_bar.scrolled a:after {
    background-color: #00597B !important; /* Sfondo bianco quando la pagina è scrollata */
}


/*------------------------------- BOTTONE FISSO RICHIEDI INFORMAZIONI ------------------------*/
#bottone-info span.elementor-button-text {
    z-index: 100;
		position:relative;
		top:-9px !important;
		font-weight: 700 !important;
		font-size: 20px;
		width:200px;
		left: -10px;
    top: -6px;
}
#bottone-info {
    padding: 10px 20px;
    font-size: 22px;
    border: 0px;
		width:260px;
		height:50px;
    background-color: #fcbe00; /* Colore di sfondo iniziale */
    color: #00597B;
    cursor: pointer;
    position: fixed;
		bottom:20px;
		rigth:20px;
    overflow: hidden; /* Necessario per limitare l'effetto al bordo del bottone */
		border-radius:10px;
}

#bottone-info::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background-color: #00597b; /* Colore della barra */
    z-index: 0; /* Impostiamo un z-index basso per la barra */
		transition: left 2s ease; /* Transizione fluida */
}

/*------------------------------- BOTTONE GENERICO ------------------------*/

.bottone span.elementor-button-text{
    z-index: 100 !important;
		font-weight: 700 !important;
		font-size:20px;
		line-height: 35px;
}

@media only screen and (max-width: 767px) {
	.bottone span.elementor-button-text{
		line-height: 15px;
	}
}
@media only screen and (min-width: 768px) and (max-width: 1025px) {  
	.bottone span.elementor-button-text{
		line-height: 15px;
	}
}

.bottone {
    padding: 10px 20px;
    font-size: 10px !important;
    border: 0px;
		width:240px;
		height:56px;
		text-align:center;
    background-color: #FFF; 
		color:#00597B;
		border:1px solid #00597B;
    cursor: pointer;
    overflow: hidden; 
		border-radius:10px;
}
.bottone span.elementor-button-text {
		color:#00597B !important;
}
.largo {
	width:400px !important;
}

.bottone .barra-sfondo {
		position: absolute;
    top: 0;
    left: -100%; /* Partiamo fuori dalla vista a sinistra */
    width: 100%;
    height: 100%;
    background-color: #00597B; /* Colore della barra */
    transition: left 0.6s ease; /* Transizione fluida */
    z-index: 0;
}

.bottone.hover .barra-sfondo {
    left: 0; /* La barra si sposterà verso destra (0%) quando il mouse è sopra */
}
.bottone.hover span.elementor-button-text {
    color: #fff !important;
    z-index: 1000;
}

/*------------------------------- BOTTONE HOT ------------------------*/

.bottone_hot {
    z-index: 10 !important;
		position:relative;
		top:5px;
}
.bottone_hot {
    padding: 12px 20px;
    font-size: 16px;
    border: 0px;
		width:220px;
		height:50px;
		text-align:center;
    background-color: #FFF; 
		color:#444;
		border:1px solid #444;
    cursor: pointer;
    overflow: hidden; 
		border-radius:10px;
}
.bottone_hot .barra-sfondo_hot {
		position: absolute;
    top: 0;
    left: -100%; /* Partiamo fuori dalla vista a sinistra */
    width: 100%;
    height: 100%;
    background-color: #fcbe00; /* Colore della barra */
    transition: left 0.3s ease; /* Transizione fluida */
    z-index: -10;
}
.bottone_hot.hover_hot .barra-sfondo_hot {
    left: 0; /* La barra si sposterà verso destra (0%) quando il mouse è sopra */
}
.bottone_hot.hover_hot {
    color: #fff !important;
    z-index: 20 !important;
}




.bottone_drop {
    padding: 15px 10px;
    font-size: 10px !important;
    border: 0px;
		width:240px;
		height:56px;
		text-align:center;
    background-color: #fcbe00; 
		color:black;
		border:0px solid #00597B;
    cursor: pointer;
    overflow: hidden; 
		border-radius:10px;
		
}
.bottone_drop span.elementor-button-text {
		color:#00795b !important;
		font-weight:500 !important;
}
.bottone_drop .barra-sfondo_drop {
		position: absolute;
    top: 0;
    left: -100%; /* Partiamo fuori dalla vista a sinistra */
    width: 100%;
    height: 100%;
    background-color:#00597b; /* Colore della barra */
    transition: left 0.6s ease; /* Transizione fluida */
    z-index: 0;
}

.bottone_drop.hover .barra-sfondo_drop {
    left: 0; /* La barra si sposterà verso destra (0%) quando il mouse è sopra */
}
.bottone_drop.hover span.elementor-button-text {
    color: #fff !important;
    z-index: 1000;
}


/*------------------------------- BOTTONE PRODOTTI ------------------------*/

.bottone_prodotti {
    padding: 10px 10px;
    font-size: 10px !important;
    border: 0px;
		width:240px;
		height:56px;
		text-align:center;
    background-color: #FFF; 
		color:#00597B;
		border:0px solid #00597B;
    cursor: pointer;
    overflow: hidden; 
		border-radius:10px;
		
}
.bottone_prodotti span.elementor-button-text {
		color:#707070 !important;
		font-weight:500 !important;
}
.medio {
	width:280px !important;
}
.lungo {
	width:480px !important;
}

.bottone_prodotti .barra-sfondo_prodotti {
		position: absolute;
    top: 0;
    left: -100%; /* Partiamo fuori dalla vista a sinistra */
    width: 100%;
    height: 100%;
    background-color: #707070; /* Colore della barra */
    transition: left 0.6s ease; /* Transizione fluida */
    z-index: 0;
}

.bottone_prodotti.hover .barra-sfondo_prodotti {
    left: 0; /* La barra si sposterà verso destra (0%) quando il mouse è sopra */
}
.bottone_prodotti.hover span.elementor-button-text {
    color: #fff !important;
    z-index: 1000;
}

@media only screen and (max-width: 767px) {
	.bottone_prodotti span.elementor-button-text{
		line-height: 15px;
		font-size: 20px !important;
		font-weight:500 !important;
	}
	.medio {
		width:260px !important;
	}	
}
@media only screen and (min-width: 768px) and (max-width: 1025px) {  
	.bottone_prodotti span.elementor-button-text{
		line-height: 15px;
		font-size: 20px !important;
		font-weight:500 !important;
	}
}







/* ------------------ ZOOM EFFECT HOVER IMAGE --------------------- */
.img-wrapper {
    display: inline-block;
    overflow: hidden;
    border-radius:15px;
}
.img-wrapper img {
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
    vertical-align: middle;
}
.img-wrapper img:hover {
    -webkit-transform:scale(1.05); /* Safari and Chrome */
    -moz-transform:scale(1.05); /* Firefox */
    -ms-transform:scale(1.05); /* IE 9 */
    -o-transform:scale(1.05); /* Opera */
    transform:scale(1.05);
		border-radius:10px;
}


.imgswap {
  display: block;
  width: 62px;
  height: 62px;
  margin: 20px auto;
  border: 0px;
  overflow: hidden;
  position: relative;
  background: url('/wp-content/uploads/2025/01/freccia_dx.png') no-repeat 0 0;
  background-size:cover;
}
.imgswap:after{
  content:"";
  position:absolute;
  left:0;
  top:0;
  right:0;
  bottom:0;
  transform:translateX(-100%);
  transition:all .4s ease;
  background:url('/wp-content/uploads/2025/01/freccia_dx-hover.png') no-repeat 0 0;
  background-size:cover;
}

.imgswap:hover:after{
  transform:translateX(0%);
  opacity:0.8;/* remove this if you don't want partial opacity*/
  opacity:1;
}

.imgswap-bianco {
  display: block;
  width: 62px;
  height: 62px;
  margin: 20px auto;
  border: 0px;
  overflow: hidden;
  position: relative;
  background: url('/wp-content/uploads/2025/06/freccia_dx-bianco.png') no-repeat 0 0;
  background-size:cover;
}
.imgswap-bianco:after{
  content:"";
  position:absolute;
  left:0;
  top:0;
  right:0;
  bottom:0;
  transform:translateX(-100%);
  transition:all .4s ease;
  background:url('/wp-content/uploads/2025/06/freccia_dx-bianco-hover.png') no-repeat 0 0;
  background-size:cover;
	pointer-events: none; /* 👈 questa riga risolve il problema */
}

.imgswap-bianco:hover:after{
  transform:translateX(0%);
  opacity:0.8;/* remove this if you don't want partial opacity*/
  opacity:1;
}


.imgswap-bianco {
    z-index: 1 !important;
}


/* Rende gli articoli della stessa altezza */
.elementor-grid-item {
    display: flex;
    height: 100%;
}

.elementor-grid-item > div {
    display: flex;
    flex-direction: column;
    width: 100%;
}

/* Fa crescere il contenuto per riempire lo spazio */
.elementor-element-acc67f4 {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.store {
    flex: 1 !important;
    display: flex !important;
		justify-content: space-between;
}

.stessa_altezza {
    flex: 1 !important;
    display: flex !important;
		justify-content: space-between !important;
}

.elementor-grid-item > div{flex-direction:row !important;height:100%;}

/*-----------------------------------------------------------------------------------------------*/
/*------------------------------------------ DESKTOP --------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 1024px) {
.titolo p {
	font-size:80px;
	line-height:65px;
	}

.occhiello p {
	font-size:24px;
	}
	

.titolo_h2 h2{
  font-size: clamp(1rem, 0.7rem + 1.5vw, 2.50rem) !important;
	font-weight:600 !important;
	line-height: 2vw !important;
}	

.titolo_h1 h1{
  font-size: clamp(2rem, 1rem + 3.5vw, 6rem) !important;
	line-height: 4vw !important;
}	

.testo_evidenza {
	font-size:clamp(1rem, 0.3rem + 1vw, 1.3rem) !important;
	line-height: clamp(0.7rem, 0.7rem + 1.1vw, 1.6rem) !important;
}

.evidenzia {
	color:#1991a6;
	font-weight:700;
}

.titolino {
  font-size: clamp(1rem, 0.7rem + 1.3vw, 2.25rem) !important;
}

.testo {
  font-size: clamp(0.7rem,  0.9vw, 1.1rem) !important;
	font-family: inter;
}

.titolo_h3 h3{
  font-size: clamp(1rem, 0.7rem + 1.3vw, 2.25rem) !important;
	font-weight:600;
}
.titolo_news p{ 
	font-size:20px !important;
	line-height:20px !important;
}	
.titolo_prodotto {
	font-size:41px !important;
	font-weight:700 !important;
	font-family:'titillium web',sans-serif !important;
}
.paragrafo {
	font-size:17px !important;
	line-height:26px !important;
	font-family:'inter',sans-serif !important;
}
.paragrafo_piccolo {
	font-size:16px !important;
	line-height:22px !important;
	font-family:'inter',sans-serif !important;
}
.bottone_scopri {
	color:#11616f !important;
	background:#fff !important;
	border:2px solid #11616f !important;
	border-radius:2px !important;
	padding: 7px 12px !important;
	width:170px !important;
 }
 .bottone_scopri:hover {
	background:#f5feff !important;
 }
.bottone_scopri .elementor-button-text{
	font-size:17px !important;
	font-weight:600 !important;
	}
.bottone_scopri .elementor-button-text:hover{
	background:#f5feff !important;
}
.atf_chisiamo	{
	font-size: clamp(1.5rem, 0.5rem + 2.0vw, 3rem) !important;
	font-family:'titillium web',sans-serif !important;
	line-height: clamp(2.5rem, 1.6rem + 2vw, 4rem) !important;
	width:59% !important;
}

.elementor-widget-n-accordion .e-n-accordion-item:not(:last-child) {
	margin-block-end:15px !important;
}
.elementor-widget-n-accordion .e-n-accordion-item {
	border:1px solid #ccc;
	box-shadow: 10px 10px 5px #fafafa;
}

.tab-contatti .e-n-tabs-heading {
    justify-content: space-between !important;
		border-bottom: 1px solid #3d3c3c;
}

}	


/*-----------------------------------------------------------------------------------------------*/
/*-------------------------------------- TABLET VERTICALE ---------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/

@media only screen and (min-width: 768px) and (max-width: 1023px) {  
.diagonale { background: #fafafa;  clip-path: polygon(0 0, 100% 0, 100% 60%, 0 75%);}
.img_atf {
	margin-top:-100px !important;
}
}

/*-----------------------------------------------------------------------------------------------*/
/*-------------------------------------- MOBILE VERTICALE ---------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/

@media only screen and (max-width: 767px) {
	.bottone_drop {
		padding: 10px 10px;
	}
	
	.ruota-15 {
	rotate: 0deg;
	border-radius:4px;
}
.form-ruotato {
	rotate: -15deg;
	border-radius:4px;
}

.titolo_prodotto {
	font-size: 28px !important;
	font-weight:700 !important;
	padding-top:8px !important;
}
.paragrafo {
	font-size:16px !important;
	line-height:20px !important;
	font-family:'inter',sans-serif !important;
}

}