/*
Theme Name: Uncode Child
Description: Child theme for Uncode theme
Author: Undsgn™
Author URI: http://www.undsgn.com
Template: uncode
Version: 1.0.0
Text Domain: uncode
*/
/* Declare custom font family */
/* Aeonik */
@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-Air.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-AirItalic.woff2") format("woff2");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-Thin.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-ThinItalic.woff2") format("woff2");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-LightItalic.woff2") format("woff2");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-RegularItalic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-MediumItalic.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-BoldItalic.woff2") format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Aeonik";
  src: url("font/Aeonik-BlackItalic.woff2") format("woff2");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

/* logo and menu padding */
body.menu-custom-padding .col-lg-0.logo-container, body.menu-custom-padding .col-lg-2.logo-container, body.menu-custom-padding .col-lg-12 .logo-container, body.menu-custom-padding .col-lg-4.logo-container {
	  padding-top: 42px!important; padding-bottom: 42px!important;
}

/**********/
/* ASSETS */
/**********/

@media(min-width:900px) {
	.wpml-ls-menu-item > .drop-menu.un-submenu {max-width:40px!important; padding:10px!important;}
}

/* bold title */
.heading-text strong, .bold-text {font-weight:900!important;}

/* pallino rosso dei titoletti di sezione */
.red-dot {color:#c92f2e!important; font-size:110%!important;}

/* icona della sezione preventivi nell'area utente (font uncodeicon, fa-file-text) */
.woocommerce-MyAccount-navigation-link--richieste-preventivo a:before {content:'\f15c';}

/* archivi categoria prodotto: la griglia si adatta al numero di prodotti.
   Uncode imposta grid-template-columns: repeat(3,1fr) legandolo all'id della
   griglia; qui si sovrascrive contando i figli diretti del contenitore. */
.tax-product_cat .cssgrid-container:has(> :nth-child(1):last-child) {grid-template-columns:1fr!important;}
@media (min-width:601px){
.tax-product_cat .cssgrid-container:has(> :nth-child(2):last-child) {grid-template-columns:repeat(2,1fr)!important;}
}

/* categorie con un solo prodotto: si mostra la variante con immagine a
   sinistra e testi a destra (Content Lateral), altrimenti la griglia.
   Si aggancia all el_id delle due griglie e non alla classe cssgrid-NNN:
   quella deriva da uncode_shortcode_id, che il tema rigenera quando il
   blocco viene risalvato (sul blocco IT e cambiato e la regola saltava). */
.tax-product_cat #index-lateral-784512 {display:none;}
.tax-product_cat #index-lateral-784512:has(.cssgrid-container > :nth-child(1):last-child) {display:block;}
.tax-product_cat #index-181612:has(.cssgrid-container > :nth-child(1):last-child) {display:none;}

/*border row */
.border-huge .row {border-radius:16px!important; overflow:hidden!important;}
.bold-text.bold-text.bold-text.bold-text.bold-text { font-weight: 900 !important; }
/* justify flex */
.align-right .uncode-flexbox-inner {justify-content:flex-start!important;}
.align-left .uncode-flexbox-inner {justify-content:flex-end!important;}
.align-left .flex-wrap-wrap, .align-right .flex-wrap-wrap {padding:25px; backdrop-filter: blur(30px); border:2px solid rgba(255,255,255,0.2); border-radius:14px!important;}
/* buttons */
.btn {
	padding:10px 10px!important;
}
.btn:not(.btn-padding-x) {padding-left:18px!important; padding-right:18px!important;}
.btn:not(.btn-padding-y) {padding-top:20px!important; padding-bottom:20px!important;}

.red-underline.btn-underline.btn-advanced > span.btn-underline:before {background-color:#c92f2e!important;}
/* post home */

.product_type_simple.product_button_loop{display:none!important;}
/* icons */
.icon-box-content p{margin-top:3px!important;}
.faqDomande .uncode_text_column a {text-decoration:underline!important;}
/* font-size */
@media(max-width:900px) {
	.fontsize-122602 {font-size:2.2rem!important;}
	.h1{font-size:2rem!important;}
	.h2{font-size:1.6rem!important;}
	.h3{font-size:1.4rem!important;}
	.tmb-content-overlay .h3.title-scale {font-size:1.4rem!important;}
	.h4{font-size:1.3rem!important;}
	.h5{font-size:1.2rem!important;}
	.h6{font-size:1.1rem!important;}
	.p, p{font-size:1rem!important;}
	.label{}
	
	.reducedRow .row {padding-left:15px!important; padding-right:15px!important;}
	
	.box-contatti .uncode-flex-int {flex-direction:column!important;gap:15px!important;}
	.box-contatti hr {display:none;}
	
	.faqDomande  .single-block-padding {padding-left:15px!important; padding-right:15px!important;}
	
	
	.pulsanti-hero .uncode-flex-int {flex-direction:column!important; align-items:center!important; justify-content:center!important;}
}
.fisarmonica {width:100%!important;}
.fisarmonica .panel {padding:20px!important;}

/**********/
/* FORM */
/**********/
.wpcf7-inline-wrapper br{display:none!important;}
/* remove input field in column */
@media(max-width:900px) {
	.wpcf7-inline-wrapper .wpcf7-inline-field {
		width:100%!important;
		display:block!important;
		padding:0px!important;
	}
	form .wpcf7-inline-wrapper:nth-child(2) p{
		margin-top:18px;
	}
}

/********************/
/* ROWS AND COLUMNS */
/********************/
/* hero section */
@media (max-width: 900px) {
    .heroSection .row {
		padding-top:clamp(15px, 3vw, 25px) !important;
		padding-bottom:clamp(15px, 3vw, 25px) !important;
        padding-left: clamp(15px, 5vw, 25px) !important;
        padding-right: clamp(15px, 5vw, 25px) !important;
    }
	.single-block-padding{padding-left:15px!important; padding-right:15px!important;}
	.product-faq .row.no-top-padding.no-bottom-padding.no-h-padding.full-width row-parent{padding-left:0px!important;padding-right:0px!important;}
	.product-faq  .double-block-padding{padding-left:10px!important; padding-right:10px!important;}
	.product-faq  .faqDomande .single-block-padding {padding-left:10px!important; padding-right:10px!important;}
}

/* limit column full width row */
@media(max-width:900px) {
	.reducedColumn {
		max-width:360px!important;
		margin:auto!important;
	}
}

/*******************/
/* PAGINA PRODOTTO */
/*******************/

.dati-tecnici-prodotto {background-color:#fff;padding:0 15px;border-radius:15px;}
.dati-tecnici-prodotto .panel-body {padding:10px 0;}
.dati-tecnici-prodotto .shop_attributes td {text-align:right!important;}
.single-product .view-cart.added_to_cart {display:none;}

.woocommerce-variation-add-to-cart{display:flex!important; flex-direction:row!important; align-items:center!important; justify-content:flex-start!important; gap:15px; margin-top:5px!important;}
.add-to-cart-box .quantity {margin-top:18px;}
.add-to-cart-box .quantity,
.add-to-cart-box .quantity .qty-inset {background-color:#fff!important; border-radius:5px;}
.hide-quantity .quantity {display:none!important;}

.uncode_text_column {line-height:1.75;}

/* switch prodotto */
.add-to-cart-box .swatch-type-color {border-radius:2px!important;width:40px!important;height:40px!important;}
.add-to-cart-box .swatch-type-label {height:40px!important;}

.add-to-cart-box .swatch-type-color.swatch--active {border:1px solid #072B3E!important;}
.add-to-cart-box .swatch-type-color.swatch--active:after {display:none!important;}

.swatch-type-label, .add-to-cart-box .swatch-type-color span{font-size:16px!important; line-height:2.4!important;}

/* nascondi svuota e nascondi guarda carrello dopo aggiunta al carrello ajax */
/*.added_to_cart.wc-forward cursor-init {display:none!important;}*/
.tcsp-modal .tcsp-check{ display:none!important;}
.tcsp-modal .tcsp-title {font-size:2rem!important;}
a.added_to_cart.wc-forward cursor-init {display:none!important;}
.reset_variations {display:none!important;}

.added_to_cart {display:none!important;}

@media(min-width:900px) {
	.add-to-cart-box tbody {display:grid!important; grid-template-columns:1fr 1fr!important; gap:15px!important;}
	.add-to-cart-box .variations tr:not(:first-child) td.label {padding-top:0px!important;}
}

/**********/
/* FOOTER */
/**********/
footer .footer-last {
	padding-top:25px!important;
	padding-bottom:25px!important;
}


/**********/
/* FORM */
/**********/

/* PAGINA CONTATTI */
.form-pagina-contatti .wpcf7-inline-wrapper {margin-top:4px!important;}
.form-pagina-contatti label {font-size:16px!important; font-weight:500!important;line-height:0.8!important;}
.form-pagina-contatti input[type="text"], 
.form-pagina-contatti input[type="email"], 
.form-pagina-contatti input[type="tel"], 
.form-pagina-contatti input[type="text"],
.form-pagina-contatti input[type="checkbox"],
.form-pagina-contatti textarea {border:1px solid #E3E3E3!important;border-radius:5px!important;background-color:#fff!important; font-size:16px!important;margin-top:0px!important;}
.form-pagina-contatti button {float:right;}
.form-pagina-contatti button br {display:none!important;}
.form-pagina-contatti .wpcf7-list-item:has(> label > input[type="checkbox"]) {line-height:0.8!important;font-style:italic;}

.comment-form textarea, .comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="checkbox"], .comment-form input[type="url"] {
	border:1px solid #E3E3E3!important;border-radius:5px!important;background-color:#fff!important; font-size:16px!important;margin-top:0px!important;
}
.comment-form input[type="submit"] {background-color:#C92F2E!important; color:#fff!important;border:#C92F2E!important; font-weight:600!important;}
.comment-form input[type="submit"]:hover {background-color:#072B3E!important;}


/* NEWSLETTER */
.wpcf7:has(> .input-background .newsletter){width:460px!important;}
@media(max-width:480px) {
	.wpcf7:has(> .input-background .newsletter){width:100%!important;}
}
.newsletter input.wpcf7-email {height:60px!important;border-radius:50px!important;}
.newsletter input.btn-default {border-radius:50px!important;background-color:#C92F2E!important; border:1px solid #C92F2E!important; font-family:Aeonik!important; font-weight:300!important;}
body:not(.input-underline):not(.rtl) form:not(.input-underline) .wpcf7-inline-wrapper.wpcf7-input-group > *:not(:first-child) input {border-radius:50px!important;}
@media(max-width:900px) {
	.wpcf7-inline-wrapper.wpcf7-input-group {display:block!important;}
}



/* BOX CONTATTI */
.box-contatti {background: #C92F2E; background: linear-gradient(90deg,rgba(201, 47, 46, 1) 0%, rgba(7, 43, 62, 1) 100%); border-radius:12px;padding:20px;}
.box-contatti p {line-height:1.2!important;}

/* Chi non è loggato vede "Accedi / Registrati" accanto all'icona.
   La voce era nascosta da quando la registrazione era chiusa: ora la
   pagina account offre sia l'accesso sia l'iscrizione, quindi serve. */
body:not(.logged-in) .uncode-account {
    display: inline-flex!important;
}
body:not(.logged-in) .uncode-account .account-icon-container .desktop-hidden {
    display: inline!important;
    margin-left: .45em;
    font-size: 14px;
    white-space: nowrap;
    vertical-align: middle;
}
/* Il menu principale arriva gia a ~1370px: l'etichetta ne chiede altri 184
   e sotto i 1600px uscirebbe dallo schermo. Li resta la sola icona, che
   comunque espone "Accedi / Registrati" come aria-label e come tooltip. */
@media (max-width: 1599px) {
    body:not(.logged-in) .uncode-account .account-icon-container .desktop-hidden {
        display: none!important;
    }
}
/* recensioni: ritratto verticale a sinistra, testo e nome a destra */
.techim-rec-ritratto {
	flex:0 0 clamp(96px, 34%, 156px); align-self:stretch;
	display:flex; align-items:stretch; justify-content:center;
	min-height:185px; border-radius:12px; overflow:hidden;
	background:rgba(7,43,62,.08);
}
/* Il tema impone height:auto a tutte le immagini: senza !important
   la foto resterebbe con le sue proporzioni e il box avrebbe bande vuote. */
.techim-rec-ritratto img {
	width:100%!important; height:100%!important;
	object-fit:cover!important; object-position:center!important;
	display:block!important; max-width:none!important;
	min-height:0!important; border-radius:0!important; margin:0!important;
}
/* senza foto le iniziali vanno centrate, non stirate */
.techim-rec-ritratto--vuoto { align-items:center; }
/* iniziali quando la recensione non ha una foto */
.techim-rec-iniziali {
	color:#072b3e; font-size:26px; font-weight:500;
	letter-spacing:.02em; line-height:1;
}
/* una o due recensioni: card ferme e centrate al posto della giostra,
   larghe quanto le slide della giostra */
.techim-rec-fisse {
	display:flex; flex-wrap:wrap; justify-content:center; gap:36px;
}
.techim-rec-fissa { flex:0 1 600px; min-width:0; }
@media (max-width:600px) {
	.techim-rec-ritratto { min-height:150px; }
	.techim-rec-iniziali { font-size:21px; }
}

/* HEADER: il menu orizzontale non entrava nella finestra.
   Il blocco a destra ha min-width:200px per specchiare la colonna del
   logo, ma contiene 70px di icone: 130px di spazio vuoto che spingevano
   carrello e account oltre il bordo dello schermo (a 1440 il carrello
   finiva a 1564, a 1600 a 1620, quindi invisibili). Liberata quella
   larghezza e stretta la spaziatura delle voci, il blocco resta
   allineato a destra e rientra. */
@media (min-width: 1025px) {
	.menu-horizontal-inner { width: 100%!important; }
	.navbar-nav-last { min-width: 0!important; }
	.navbar-nav-last ul.menu-icons { width: auto!important; float: right!important; }
	/* il selettore resta sul menu principale: le icone a destra e i
	   sottomenu hanno spaziature proprie che non vanno toccate */
	.navbar-main > ul.menu-smart > li > a {
		padding-left: 8px!important;
		padding-right: 8px!important;
	}
}

/* L'icona dell'account e' un <i> con line-height:0 e altezza 0: il glifo
   viene disegnato traboccando dal suo box. Regge per caso, e sparisce al
   primo cambio di zoom o di metriche. Qui le si da' un box vero. */
body:not(.logged-in) .uncode-account .account-icon-container i {
	display: inline-flex!important;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	line-height: 1!important;
}
/* Dove c'e' spazio per la dicitura per esteso l'icona non aggiunge nulla:
   resta il solo testo. Sotto i 1600px vale il contrario, l'icona e' l'unico
   segnale disponibile e deve restare. */
@media (min-width: 1600px) {
	body:not(.logged-in) .uncode-account .account-icon-container i {
		display: none!important;
	}
	body:not(.logged-in) .uncode-account .account-icon-container .desktop-hidden {
		margin-left: 0;
	}
}

/* ---------------------------------------------------------------------
   Pagina Accedi / Registrati
   I campi di WooCommerce avevano fondo #f7f7f7 senza bordo sopra una card
   altrettanto chiara: si leggevano appena. Qui prendono l'aspetto dei
   campi di "Diventa distributore" (Contact Form 7 con lo stile Uncode),
   da cui sono copiati fondo, bordo, raggio, spaziatura e corpo del testo.
   Lo scope e' il contenitore dei moduli account, cosi' valgono anche per
   recupero password, dati di fatturazione e dettagli dell'account.
   --------------------------------------------------------------------- */
.uncode-wc-account-forms input[type="text"],
.uncode-wc-account-forms input[type="email"],
.uncode-wc-account-forms input[type="tel"],
.uncode-wc-account-forms input[type="url"],
.uncode-wc-account-forms input[type="number"],
.uncode-wc-account-forms input[type="password"],
.uncode-wc-account-forms textarea,
.uncode-wc-account-forms select {
	background-color: #f7f7f7;
	border: 1px solid #e3e3e3;
	border-radius: 5px;
	padding: 10px 15px;
	height: auto;
	font-size: 16px;
	line-height: normal;
	color: #072b3e;
	box-shadow: none;
}
/* Il modulo distributore non segnala in alcun modo il campo attivo. Su un
   form di accesso serve: chi naviga da tastiera deve sapere dove si trova.
   Il bordo rosso in focus e' gia' del tema, qui si aggiunge solo l'alone
   intonato. A riposo l'aspetto resta identico. */
.uncode-wc-account-forms input[type="text"]:focus,
.uncode-wc-account-forms input[type="email"]:focus,
.uncode-wc-account-forms input[type="tel"]:focus,
.uncode-wc-account-forms input[type="url"]:focus,
.uncode-wc-account-forms input[type="number"]:focus,
.uncode-wc-account-forms input[type="password"]:focus,
.uncode-wc-account-forms textarea:focus,
.uncode-wc-account-forms select:focus {
	box-shadow: 0 0 0 3px rgba(201, 47, 46, .15);
}
/* Etichette: 20px/600 ereditati dalla tipografia del blocco, contro i
   16px/500 del modulo distributore. Escluse quelle delle caselle di
   spunta, che stanno in linea con la casella e non sopra al campo. */
.uncode-wc-account-forms .form-row > label:not(.woocommerce-form__label-for-checkbox),
.uncode-wc-account-forms .form-row > label.woocommerce-form__label:not(.woocommerce-form__label-for-checkbox) {
	display: block;
	margin-bottom: 9px;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.3;
	color: #072b3e;
}
/* Le righe di WooCommerce hanno margine zero: senza respiro i campi
   risultano appiccicati una volta ridotte le etichette. */
.uncode-wc-account-forms .form-row {
	margin-bottom: 18px;
}

/* ---------------------------------------------------------------------
   Checkout: riquadro della carta
   Stripe disegna i propri campi dentro un iframe e ne decide i colori
   copiandoli dalle etichette del modulo, che stanno su fondo chiaro.
   Nella colonna di destra, che ha un gradiente scuro, ne usciva testo
   scuro su fondo scuro. Dentro l'iframe non si entra: si schiarisce il
   pannello che lo ospita, cosi' quei colori tornano leggibili.
   --------------------------------------------------------------------- */
.woocommerce-checkout .payment_method_woocommerce_payments .payment_box {
	background: #fff;
	border-radius: 5px;
	padding: 18px 16px 6px;
	margin-top: 10px;
}
/* il triangolino che WooCommerce disegna sopra al riquadro deve seguire
   il nuovo colore, altrimenti resta appeso di un altro tono */
.woocommerce-checkout .payment_method_woocommerce_payments .payment_box::before {
	border-bottom-color: #fff!important;
}
/* Accanto al nome del metodo WooPayments elenca i marchi di carta accettati
   e, per quelli che non entrano in riga, aggiunge un "+3" senza spiegazione.
   I tre loghi visibili bastano: il contatore si toglie. */
.payment-methods--logos-count {
	display: none!important;
}

/* ==========================================================================
   MOBILE: correzioni dalla revisione del cliente (ottobre 2026)
   ========================================================================== */

/* Offerte (home e pagina Offerte): l immagine e lo sfondo della colonna,
   largo 600px e ancorato in alto a destra. Su schermi stretti ne usciva
   solo un pezzo. Qui diventa larga quanto la card, centrata, e il primo
   spazio vuoto prende la stessa proporzione 16:9 delle foto, cosi il
   titolo parte subito sotto l immagine. */
@media (max-width: 959px) {
	.uncell:has(> .uncont > .uncode-flexbox.align-right) .background-inner {
		background-size: 100% auto !important;
		background-position: center top !important;
	}
	/* gli spazi vuoti di Uncode prendono altezza dal padding-top */
	.uncell:has(> .uncont > .uncode-flexbox.align-right) > .uncont > .empty-space:first-child {
		height: auto !important; padding-top: 0 !important;
		aspect-ratio: 16 / 9;
	}
	.uncell:has(> .uncont > .uncode-flexbox.align-right) > .uncont > .empty-space.desktop-hidden {
		display: none !important;
	}
	/* pagina Offerte: le foto hanno circa il 15% di margine trasparente
	   per lato, si ingrandiscono un po perche il prodotto non resti piccolo */
	:is(.page-id-1828, .page-id-1845) .uncell:has(> .uncont > .uncode-flexbox.align-right) .background-inner {
		background-size: 130% auto !important;
	}
	:is(.page-id-1828, .page-id-1845) .uncell:has(> .uncont > .uncode-flexbox.align-right) > .uncont > .empty-space:first-child {
		aspect-ratio: 16 / 10;
	}
	/* le frecce copiate dalla home puntano a un carosello che qui non c e:
	   invisibili, ma occupavano 100px vuoti sopra il primo kit */
	:is(.page-id-1828, .page-id-1845) .wpb_column:has(> .uncol > .uncoltable > .uncell > .uncont > .uncode-owl-nav-wrap) { display: none !important; }
}

/* Newsletter: sui touch Uncode fa comparire da sole le foto prodotto,
   una ogni 1,75s. Erano larghe 150-200px e sopra al modulo, coprivano
   campo email e consensi: su telefono si rimpiccioliscono e passano
   dietro al contenuto, che resta leggibile e cliccabile. */
@media (max-width: 767px) {
	.vc_row:has(.wpcf7-inline-wrapper.newsletter) .uncode-bg-trail { z-index: 0 !important; }
	.vc_row:has(.wpcf7-inline-wrapper.newsletter) > .row { position: relative; z-index: 1; }
	.vc_row:has(.wpcf7-inline-wrapper.newsletter) .uncode-bg-trail .trail-img {
		min-width: 0 !important; max-width: 110px !important; width: 26vw !important;
	}
}

@media (max-width: 767px) {
	/* consensi privacy: casella a sinistra e testo allineato accanto,
	   invece del testo centrato con interlinea da 35px */
	/* lo stile CF7 di Uncode mette display:inline !important sull etichetta */
	.wpcf7-acceptance .wpcf7-list-item { display: block; margin: 0 0 10px; text-align: left; }
	.wpcf7-acceptance .wpcf7-list-item label {
		display: flex !important; align-items: flex-start; gap: 10px;
		text-align: left; line-height: 1.5;
	}
	.wpcf7-acceptance .wpcf7-list-item label input { margin-top: 3px; flex: 0 0 auto; }

	/* Dettagli tecnici: l etichetta non andava a capo e aveva 72px di
	   margine, il valore finiva fuori schermo. Su telefono si impilano. */
	.uncode-single-product-additional-info .shop_attributes tr { display: block; padding: 10px 0; }
	.uncode-single-product-additional-info .shop_attributes th,
	.uncode-single-product-additional-info .shop_attributes td {
		display: block; width: auto !important; padding: 0 !important;
		text-align: left !important; white-space: normal !important;
	}
	.uncode-single-product-additional-info .shop_attributes td p { margin: 2px 0 0; }

	/* quantita e pulsante non stavano sulla stessa riga: il pulsante
	   va sotto, a tutta larghezza */
	.woocommerce-variation-add-to-cart.variations_button { flex-wrap: wrap; gap: 12px; }
	.woocommerce-variation-add-to-cart.variations_button > .btn-container { flex: 1 1 100%; margin-left: 0 !important; }
	.woocommerce-variation-add-to-cart.variations_button .single_add_to_cart_button { width: 100%; justify-content: center; }

	/* Articoli: l intestazione ha 460px fissi, su telefono restava
	   un grande vuoto sotto il titolo */
	.reducedRow .row-inner { height: auto !important; }
	.reducedRow .row-parent { padding-top: 48px !important; padding-bottom: 48px !important; }
	/* data, categoria e tempo di lettura: si va a capo fra una voce e
	   l altra, mai dentro ("4 / Minuti") */
	.uncode-info-box {
		display: flex; flex-wrap: wrap; justify-content: center;
		white-space: nowrap; row-gap: 4px;
	}

	/* FAQ prodotto: 54px sopra e 10px ai lati, il riquadro era sbilanciato */
	.faqDomande > .row > .wpb_row > .wpb_column > .uncol > .uncoltable > .uncell {
		padding: 28px 24px !important;
	}

	/* Azienda: il sottotitolo piccolo dentro l H1 ereditava l interlinea
	   del titolo e le due righe restavano lontanissime */
	.heading-text h1 span[style*="font-size: 50%"] {
		display: inline-block; line-height: 1.4; margin-top: 24px; /* stessa distanza titolo-sottotitolo e sottotitolo-paragrafo */
	}
}

/* Diventa distributore: la linea rossa e pensata per i 4 passi in riga.
   Sotto i 960px i passi vanno su 2x2 e la linea attraversava solo la prima
   riga, uscendo dallo schermo. Qui c e un tratto fra 1-2 e uno fra 3-4. */
@media (max-width: 959px) {
	.steps-row::before { display: none; }
	.steps-row .row-inner > .wpb_column:nth-child(odd) .uncode-single-media { position: relative; overflow: visible; }
	.steps-row .row-inner > .wpb_column:nth-child(odd) .uncode-single-media::after {
		content: ""; position: absolute; top: 50%;
		left: calc(50% + 70px); width: calc(100% + 36px - 140px); height: 2px;
		background-color: #c0392b; transform-origin: left center;
		transform: scaleX(0); transition: transform 1.8s ease-out;
		pointer-events: none;
	}
	.steps-row.line-in-view .row-inner > .wpb_column:nth-child(odd) .uncode-single-media::after { transform: scaleX(1); }
}

/* Recensioni (home e schede prodotto): carosello semplice a scorrimento,
   con le frecce. Una card per volta su telefono e tablet, due da 1024px.
   Si scorre anche col dito o col trackpad in orizzontale. */
.techim-rec-track {
	display: flex; gap: 16px; overflow-x: auto;
	scroll-snap-type: x mandatory; scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.techim-rec-track::-webkit-scrollbar { display: none; }
.techim-rec-slide { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; display: flex; }
@media (min-width: 1024px) {
	.techim-rec-track { gap: 24px; }
	.techim-rec-slide { flex-basis: calc((100% - 24px) / 2); }
}
.techim-rec-slide > .vc_row,
.techim-rec-slide > .vc_row > .row,
.techim-rec-slide > .vc_row > .row > .row-inner,
.techim-rec-slide .row-inner > .wpb_column,
.techim-rec-slide .row-inner > .wpb_column > .uncol { width: 100%; height: 100%; }
.techim-rec-nav { display: flex; justify-content: center; gap: 12px; margin-top: 24px; }
.techim-rec-nav button, .techim-cat-nav button {
	width: 52px; height: 52px; border-radius: 50%;
	border: 1px solid #072b3e; background: transparent; color: #072b3e;
	display: inline-flex; align-items: center; justify-content: center;
	font-size: 18px; cursor: pointer; padding: 0;
	transition: opacity .2s, background-color .2s, color .2s;
}
@media (hover: hover) {
	.techim-rec-nav button:not(:disabled):hover { background: #072b3e; color: #fff; }
}
.techim-rec-nav button:disabled { opacity: .3; cursor: default; }
/* tutte le card alte quanto la piu alta */
.techim-rec-slide > .vc_row,
.techim-rec-slide > .vc_row > .row,
.techim-rec-slide .row-inner,
.techim-rec-slide .row-inner > .wpb_column,
.techim-rec-slide .row-inner > .wpb_column > .uncol,
.techim-rec-slide .uncoltable { display: flex !important; flex-direction: column; flex: 1 1 auto; }
.techim-rec-slide .uncoltable > .uncell { display: block !important; flex: 1 1 auto; }
.techim-rec-slide .uncell { padding: 28px !important; }
.techim-rec-fisse { gap: 24px; }

@media (max-width: 767px) {
	/* il riquadro grigio non tocca il bordo del telefono, in home come sulle
	   schede prodotto: stesso margine bianco ai lati */
	.vc_row.row-container > .row:has(.techim-rec-mobile),
	.vc_row.row-container > .row:has(.techim-rec-fisse) {
		padding-left: 20px !important; padding-right: 20px !important;
	}
	/* card piu stretta: in alto la foto con nome e citta accanto, sotto la
	   recensione. Il contenitore interno del testo si "scioglie" (contents)
	   cosi i tre paragrafi diventano figli della griglia. */
	.techim-rec-slide .uncell, .techim-rec-fissa .uncell { padding: 20px !important; }
	.techim-rec-slide .uncode-flexbox > .uncode-flex-int,
	.techim-rec-fissa .uncode-flexbox > .uncode-flex-int {
		display: grid !important;
		grid-template-columns: 84px 1fr;
		grid-template-areas: "foto nome" "foto citta" "testo testo";
		column-gap: 16px; row-gap: 0;
		align-items: center;
	}
	.techim-rec-slide .uncode-flexbox-inner,
	.techim-rec-slide .uncode-flexbox-inner > .uncode-flex-int,
	.techim-rec-fissa .uncode-flexbox-inner,
	.techim-rec-fissa .uncode-flexbox-inner > .uncode-flex-int { display: contents !important; }
	.techim-rec-slide .techim-rec-ritratto,
	.techim-rec-fissa .techim-rec-ritratto {
		grid-area: foto; align-self: center;
		width: 84px; height: 105px; min-height: 0; flex: none;
	}
	.techim-rec-iniziali { font-size: 19px; }
	.techim-rec-slide .vc_custom_heading_wrap:nth-child(1),
	.techim-rec-fissa .vc_custom_heading_wrap:nth-child(1) { grid-area: testo; margin-top: 16px; }
	.techim-rec-slide .vc_custom_heading_wrap:nth-child(2),
	.techim-rec-fissa .vc_custom_heading_wrap:nth-child(2) { grid-area: nome; align-self: end; padding-bottom: 3px; }
	.techim-rec-slide .vc_custom_heading_wrap:nth-child(3),
	.techim-rec-fissa .vc_custom_heading_wrap:nth-child(3) { grid-area: citta; align-self: start; padding-top: 3px; }
	.techim-rec-slide .vc_custom_heading_wrap p,
	.techim-rec-fissa .vc_custom_heading_wrap p { margin: 0; }
	.techim-rec-slide .vc_custom_heading_wrap:nth-child(2) p,
	.techim-rec-fissa .vc_custom_heading_wrap:nth-child(2) p,
	.techim-rec-slide .vc_custom_heading_wrap:nth-child(3) p,
	.techim-rec-fissa .vc_custom_heading_wrap:nth-child(3) p { font-size: 1rem !important; line-height: 1.35; }
	.techim-rec-slide .vc_custom_heading_wrap:nth-child(1) p,
	.techim-rec-fissa .vc_custom_heading_wrap:nth-child(1) p { font-size: .95rem !important; line-height: 1.55; }
}

/* Home, carosello categorie: frecce aggiunte via JS (functions.php) */
.techim-cat-nav { display: none; }
@media (max-width: 959px) {
	.techim-cat-nav { display: flex; justify-content: center; gap: 12px; margin-top: 4px; }
}
@media (min-width: 768px) and (max-width: 959px) {
	.techim-cat-nav button {
		width: 52px; height: 52px; border-radius: 50%;
		border: 1px solid #072b3e; background: transparent; color: #072b3e;
		display: inline-flex; align-items: center; justify-content: center;
		font-size: 18px; cursor: pointer; padding: 0;
	}
}
/* Home su telefono: spaziature uniformate (revisione del 16/10/2026) */
@media (max-width: 767px) {
	/* Perche sceglierci: sopra al titolo si sommavano padding della riga,
	   uno spazio vuoto e il margine della riga interna (108px contro i
	   72px delle altre sezioni); il paragrafo stava 36px sotto il titolo
	   invece di 18px come nelle altre sezioni */
	.techim-perche .uncont > .empty-space:first-child { display: none; }
	.techim-perche .uncont > .vc_row.row-internal + .vc_row.row-internal { margin-top: 18px !important; }

	/* Garanzia di qualita: stesso riquadro delle FAQ prodotto, quindi
	   stessi margini (prima 54px sopra e 10px ai lati) */
	.vc_custom_1789319313120 > .row > .wpb_row > .wpb_column > .uncol > .uncoltable > .uncell {
		padding: 28px 24px !important;
	}
	/* fra titolo e domande c erano 108px: spazio vuoto piu due gap del
	   flexbox, utili su desktop per allineare la colonna */
	.vc_custom_1789319313120 .uncode-flex-int > .empty-space { display: none; }
}

/* Il nostro standard (IT 398, EN 1387) su telefono: spaziature uniformate */
@media (max-width: 767px) {
	/* sezione grigia con i 4 riquadri: il paragrafo stava a 54px sopra
	   i riquadri e a 90px sotto, per spazi vuoti sommati in modo diverso.
	   Ora 36px da entrambe le parti, come fra titolo e immagine altrove. */
	:is(.page-id-398, .page-id-1387) .reducedRow.style-color-490546-bg .uncont > .empty-space { display: none; }
	:is(.page-id-398, .page-id-1387) .reducedRow.style-color-490546-bg .uncont > .empty-space + :not(.vc_row) { margin-top: 0 !important; }

	/* riquadro scuro "Non conta quanti": la sezione aveva 20px in piu
	   delle altre e dentro il riquadro 72px sopra il titolo ma 36px sotto
	   il testo. Ora 96px dalle sezioni vicine e 36px dentro, sopra e sotto. */
	:is(.page-id-398, .page-id-1387) .vc_custom_1785857002718.reducedRow > .row-parent { padding-top: 16px !important; padding-bottom: 16px !important; }
	.vc_custom_1785857002718 .uncell.has-bg > .uncont > .vc_row.row-internal { margin-top: 0 !important; }
	.vc_custom_1785857002718 .uncell.has-bg { padding: 28px 24px !important; }
	/* fra una sezione e l altra 72px (36+36) invece di 96 */
	:is(.page-id-398, .page-id-1387) .reducedRow > .row-parent { padding-top: 36px !important; padding-bottom: 36px !important; }
}

/* Newsletter su telefono, in ogni sua variante (blocchi IT/EN e quello
   delle pagine prodotto): le regole si agganciano al modulo stesso. Spazi prima sbilanciati: 92px sopra l etichetta, 8px fra
   etichetta, titolo e testo, 54px prima del campo email, una riga vuota
   (<br>) fra i due consensi. Ora 36px dal bordo sopra e sotto, 12px fra
   etichetta-titolo-testo, 24px prima del modulo, 12px prima dei consensi
   e 12px fra i due, come nelle altre sezioni. */
@media (max-width: 767px) {
	.vc_row:has(> .row .wpcf7-inline-wrapper.newsletter) .uncell > .uncont > .empty-space { display: none; }
	.vc_row:has(> .row .wpcf7-inline-wrapper.newsletter) .uncell > .uncont > .vc_row.row-internal { margin-top: 16px !important; margin-bottom: 16px !important; }
	.vc_row:has(> .row .wpcf7-inline-wrapper.newsletter) .uncode-flexbox-inner > .uncode-flex-int { gap: 12px !important; }
	.vc_row:has(> .row .wpcf7-inline-wrapper.newsletter) .uncode-flexbox.wpb_sortable:has(.wpcf7) { margin-top: 6px !important; }
	.vc_row:has(> .row .wpcf7-inline-wrapper.newsletter) .wpcf7-form p:has(.wpcf7-acceptance) { margin: 12px 0 0; }
	.vc_row:has(> .row .wpcf7-inline-wrapper.newsletter) .wpcf7-form p:has(.wpcf7-acceptance) > br { display: none; }
	.vc_row:has(> .row .wpcf7-inline-wrapper.newsletter) .wpcf7-acceptance .wpcf7-list-item,
	.vc_row:has(> .row .wpcf7-inline-wrapper.newsletter) .wpcf7-acceptance .wpcf7-list-item label { margin: 0 !important; }
	.vc_row:has(> .row .wpcf7-inline-wrapper.newsletter) .wpcf7-form-control-wrap ~ .wpcf7-form-control-wrap .wpcf7-list-item { margin-top: 12px !important; }
}

/* Home, sezione Offerte su telefono: finiva esattamente col pulsante
   "Ordina kit" (nessun padding in basso) e la newsletter ci si attaccava.
   36px sotto + 36px dentro la newsletter = 72px, come fra le altre
   sezioni. Lo spazio vuoto in fondo alla sola seconda slide la rendeva
   piu alta della prima: si toglie. */
@media (max-width: 767px) {
	.home #ordina-kit .owl-item .uncont > .empty-space.desktop-hidden:last-child { display: none; }
}

/* Sezione che precede la newsletter, su telefono: ogni pagina finiva in
   modo diverso (padding 20, 36 o 48px, spazi vuoti finali), quindi fra
   l ultimo contenuto e la newsletter c erano da 36 a 137px. Ora sempre
   36px, piu i 36px interni della newsletter = 72px ovunque. */
@media (max-width: 767px) {
	.vc_row.row-container:not(.row-internal):has(+ .vc_section .wpcf7-inline-wrapper.newsletter),
	.vc_section:has(+ .vc_section .wpcf7-inline-wrapper.newsletter) > .row > .vc_row:last-of-type {
		padding-bottom: 36px !important;
	}
	.vc_row.row-container:not(.row-internal):has(+ .vc_section .wpcf7-inline-wrapper.newsletter) > .row,
	.vc_section:has(+ .vc_section .wpcf7-inline-wrapper.newsletter) > .row > .vc_row:last-of-type > .row {
		padding-bottom: 0 !important;
	}
	.vc_row.row-container:not(.row-internal):has(+ .vc_section .wpcf7-inline-wrapper.newsletter) .uncont > .empty-space:last-child,
	.vc_section:has(+ .vc_section .wpcf7-inline-wrapper.newsletter) > .row > .vc_row:last-of-type .uncont > .empty-space:last-child {
		display: none;
	}
}
@media (max-width: 767px) {
	/* pagine prodotto: la sezione finisce coi pallini e la freccia del
	   carosello dei correlati, i cui pulsanti hanno 14px di area di tocco
	   invisibile sotto. Si compensa perche a vista restino 36px. */
	.vc_section:has(+ .vc_section .wpcf7-inline-wrapper.newsletter) > .row > .vc_row:last-of-type:has(.uncode-nav-index) {
		padding-bottom: 22px !important;
	}
}

/* Pagine categoria su telefono: la variante "laterale" (categorie con un
   solo prodotto) mette nome e descrizione SOTTO l immagine, perche le
   colonne si impilano; nelle categorie con piu prodotti stanno DENTRO
   l immagine. Su telefono si usa sempre la griglia con il testo dentro. */
@media (max-width: 767px) {
	.tax-product_cat #index-lateral-784512,
	.tax-product_cat #index-lateral-784512:has(.cssgrid-container > :nth-child(1):last-child) { display: none !important; }
	.tax-product_cat #index-181612,
	.tax-product_cat #index-181612:has(.cssgrid-container > :nth-child(1):last-child) { display: block !important; }
}

/* Pagine categoria: le card prendevano l altezza dalla foto (Luminis 4:5,
   Oreyon 3:4) e affiancate risultavano disallineate. Tutte 4:5, con la
   foto ritagliata al centro, su desktop e telefono. */
.tax-product_cat .cssgrid-system .t-entry-visual .dummy { padding-top: 125% !important; }
.tax-product_cat .cssgrid-system .t-entry-visual .dummy img {
	position: absolute; inset: 0;
	width: 100% !important; height: 100% !important; object-fit: cover;
}

/* Card delle offerte (home e pagina Offerte) su telefono: fra il riquadro
   dell offerta e "Disponibile per i laboratori..." c erano 72px (36 sotto
   il riquadro + 36 sopra la frase), sembravano due blocchi separati: ora
   24px. Il riquadro era allineato a sinistra e la frase sotto centrata:
   ora tutto centrato. */
@media (max-width: 767px) {
	.uncell:has(> .uncont > .uncode-flexbox.align-right) { padding-bottom: 0 !important; }
	.wpb_column:has(> .uncol > .uncoltable > .uncell > .uncont > .uncode-flexbox.align-right) + .wpb_column,
	.inverted-device-order .wpb_column:has(+ .wpb_column > .uncol > .uncoltable > .uncell > .uncont > .uncode-flexbox.align-right) {
		padding-top: 24px !important;
	}
	.uncode-flexbox.align-right .uncode-flexbox-inner > .uncode-flex-int { align-items: center !important; text-align: center; }
	.uncode-flexbox.align-right .heading-text,
	.uncode-flexbox.align-right .heading-text *,
	.uncode-flexbox.align-right .uncode_text_column { text-align: center !important; }
}

/* Diventa distributore, foto della sezione Requisiti su telefono: in 3:4
   occupava quasi tutto lo schermo e il titolo della sezione restava sotto
   il bordo. Quadrata, ritagliata un po sopra e sotto. */
@media (max-width: 767px) {
	.uncode-single-media-wrapper:has(img[src*="rete-distributori-italia-videoconferenza"]) > .dummy { padding-top: 100% !important; }
	.uncode-single-media-wrapper img[src*="rete-distributori-italia-videoconferenza"] {
		height: 100% !important; object-fit: cover; object-position: center 45%;
	}
}

/* Articoli, navigazione Precedente/Prossimo su telefono: sotto i 570px il
   tema nasconde la scritta e lascia la freccia, ma solo sul lato attivo
   (la scritta e in uno <span>). Sul lato senza articolo (primo/ultimo)
   la scritta e testo libero: restava visibile, andava a capo e abbassava
   la freccia. Stesso comportamento sui due lati. */
@media (max-width: 569px) {
	.post-navigation .navigation .btn-disable-hover { font-size: 0; }
	.post-navigation .navigation .btn-disable-hover i { font-size: 18px; line-height: normal; }
}

/* Footer su telefono: tutto centrato (prima allineato a sinistra). Nei
   contatti icona e testo restano affiancati, la coppia e centrata. */
@media (max-width: 767px) {
	.site-footer .wpb_column,
	.site-footer .heading-text,
	.site-footer .uncode_text_column,
	.site-footer .uncode-single-media { text-align: center !important; }
	.site-footer .uncode-single-media .single-wrapper { margin-left: auto; margin-right: auto; }
	.site-footer .icon-box.icon-box-left {
		display: flex !important; justify-content: center; align-items: center; gap: 12px;
	}
	.site-footer .icon-box.icon-box-left .icon-box-icon,
	.site-footer .icon-box.icon-box-left .icon-box-content { display: block !important; width: auto !important; float: none; }
	.site-footer .icon-box.icon-box-left .icon-box-content { padding-left: 0 !important; margin-left: 0 !important; text-align: left; }
	.site-footer .icon-box.icon-box-left .icon-box-icon { margin: 0 !important; }
	.site-footer .icon-box.icon-box-left .icon-box-content p { margin: 0 !important; }
}

/* Catalogo (IT 400, EN 1392) su telefono: categorie e prodotti erano
   card identiche una sotto l altra e al tocco le categorie diventavano
   chiare come i prodotti. Etichette "Categorie"/"Prodotti" nello stile del
   sito (generate dal CSS, nella lingua della pagina) e categorie sempre
   scure, col nome visibile anche al tocco. */
@media (max-width: 767px) {
	:is(.page-id-400, .page-id-1392) .uncont:has(> .owl-carousel-wrapper #index-181612)::before,
	:is(.page-id-400, .page-id-1392) .cssgrid-system#index-181612::before {
		content: "Categorie";
		display: table; margin: 0 auto 18px; padding-left: 20px;
		font-family: Overpass, sans-serif; font-size: 17.6px; font-weight: 300;
		text-transform: uppercase; color: #072b3e; line-height: 1.5;
		background: radial-gradient(circle at 4px 46%, #c92f2e 3.6px, transparent 4.2px) no-repeat;
	}
	:is(.page-id-400, .page-id-1392) .cssgrid-system#index-181612::before { content: "Prodotti"; }
	.page-id-1392 .uncont:has(> .owl-carousel-wrapper #index-181612)::before { content: "Categories"; }
	.page-id-1392 .cssgrid-system#index-181612::before { content: "Products"; }
}
@media (hover: none) {
	:is(.page-id-400, .page-id-1392) .owl-carousel#index-181612 .secondary-dummy-image { opacity: 0 !important; }
	:is(.page-id-400, .page-id-1392) .owl-carousel#index-181612 .t-overlay-text { opacity: 1 !important; }
}

/* ==========================================================================
   Revisione del cliente, 24/10/2026
   ========================================================================== */

/* Pulsanti dentro i moduli Contact Form 7 (Invia candidatura, Invia
   messaggio): il CSS di hover che Uncode genera esiste solo per i pulsanti
   scritti col builder, qui il markup e nel modulo e il blu non arrivava. */
.wpcf7 button.btn-advanced.btn:hover,
.wpcf7 button.btn-advanced.btn:focus-visible {
	background-color: #072b3e !important; border-color: #072b3e !important;
}
.wpcf7 button.btn-advanced.btn { transition: background-color .3s, border-color .3s; }

/* Azienda: la terza colonna del team ha un effetto di ingresso (da destra)
   che su alcuni schermi non parte e lascia foto e testo di Vittorio a
   opacita 0. Il gruppo del team compare subito. */
:is(.page-id-396, .page-id-1366) .cssgrid-container .t-inside.animate_when_almost_visible {
	opacity: 1 !important; transform: none !important; animation: none !important;
}

/* Header su telefono: la barra occupava 134px (42px sopra e sotto il
   logo). Piu compatta, a vantaggio del contenuto. */
@media (max-width: 959px) {
	body.menu-custom-padding .col-lg-0.logo-container,
	body.menu-custom-padding .col-lg-2.logo-container,
	body.menu-custom-padding .col-lg-12 .logo-container,
	body.menu-custom-padding .col-lg-4.logo-container,
	body.menu-custom-padding .menu-container .logo-container {
		padding-top: 18px !important; padding-bottom: 18px !important;
	}
}

/* Dettagli tecnici (desktop): etichetta e valore allineati in alto. Prima
   l'etichetta restava al centro della cella e, quando il valore andava a
   capo su due righe (es. "Applicazione"), risultava piu in basso della
   prima riga. Stessa altezza di riga per le due celle, cosi la prima riga
   coincide. Su telefono le righe si impilano (regola piu sopra). */
@media (min-width: 768px) {
	.uncode-single-product-additional-info .shop_attributes th,
	.uncode-single-product-additional-info .shop_attributes td {
		vertical-align: top;
		padding-top: 2.7px;
		padding-bottom: 2.7px;
	}
	.uncode-single-product-additional-info .shop_attributes th { line-height: 32.2px; }
}

/* Pagina "Laboratori e centri fresaggio": il testo accanto al modulo andava a
   capo troppo tardi e finiva a pochi pixel dai campi. Un po' di margine a
   destra nella colonna del testo lo fa andare a capo prima. */
@media (min-width: 960px) {
	.colonna-intro-form .uncont { padding-right: clamp(24px, 6vw, 96px); }
}