/* ====================================================================
   etechWP Fase 13 (2026-10-07): CSS base dei blocchi plugin.
   Le variabili sono i valori predefiniti del tema: si cambiano in
   builder/temi.aspx (salvate in tblTemi.variabili) o in tema.css,
   e per un singolo blocco dallo "Stile" del composer.
   Fase 14: larghezze come il vecchio sito (contenuto 1366px, fascia larga
   1680px, piena) e font del sito dichiarati qui in modo ordinato.
   ==================================================================== */

/* --- font presenti in /fonts (percorsi relativi a questo file: ../fonts) ---
   union.css dichiara "AchatesLight" (che in realta' carica Maven Pro) e
   "Swiss": restano validi per le classi storiche (teston100...). Qui gli
   stessi file con nomi chiari, pesi e font-display, usati dai blocchi. */
@font-face { font-family: "Maven Pro"; src: url(../fonts/MavenPro-Regular.ttf) format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Swiss 721"; src: url(../fonts/Swis721LtBTLight.ttf) format("truetype"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Swiss 721"; src: url(../fonts/Swis721WGLBTRoman.ttf) format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Swiss 721"; src: url("../fonts/Swis721 WGL4 BT Italic.ttf") format("truetype"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Swiss 721"; src: url("../fonts/Swis721 WGL4 BT Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Swiss 721"; src: url("../fonts/Swis721 WGL4 BT Bold Italic.ttf") format("truetype"); font-weight: 700; font-style: italic; font-display: swap; }
@font-face { font-family: "Futura Md"; src: url(../fonts/FuturaMdBTMedium.ttf) format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Futura Md"; src: url("../fonts/Futura Md BT Medium Italic.ttf") format("truetype"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Futura Md"; src: url("../fonts/Futura Md BT Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Futura Md"; src: url("../fonts/Futura Md BT Bold Italic.ttf") format("truetype"); font-weight: 700; font-style: italic; font-display: swap; }
@font-face { font-family: "Achates"; src: url(../fonts/AchatesLight.otf) format("opentype"); font-weight: 400; font-display: swap; }

:root {
	--etwp-accento: #e07b00;
	--etwp-titoli: #000000;  /* Fase 32 (2026-10-13): nero predefinito (prima blu scuro #17324d) */
	--etwp-testo: #222222;   /* Fase 32: quasi nero (prima grigio-blu #5b6b79) */
	--etwp-corpo: #333333;
	--etwp-sfondo-card: #ffffff;
	--etwp-bordo: #eeeeee;
	--etwp-raggio: 6px;
	--etwp-font: "Maven Pro", Arial, Helvetica, sans-serif;
	--etwp-font-titoli: "Maven Pro", Arial, Helvetica, sans-serif;
	--etwp-larghezza: 1366px;
	--etwp-larghezza-larga: 1680px;
}

/* contenitore di ogni blocco (colore base: lo stile del menu, ex menu3.css, mette body bianco) */
.etwp-blocco { display: block; clear: both; width: 100%; box-sizing: border-box; font-family: var(--etwp-font); color: var(--etwp-corpo); }
.etwp-blocco > .etwp-interno { max-width: var(--etwp-larghezza); margin: 0 auto; padding: 0 10px; box-sizing: border-box; }
.etwp-blocco > .etwp-interno:after { content: ""; display: table; clear: both; }
.etwp-larg-larga > .etwp-interno { max-width: var(--etwp-larghezza-larga); }
.etwp-larg-piena > .etwp-interno { max-width: none; padding: 0; }
.etwp-larg-stretta > .etwp-interno { max-width: 860px; }
/* ombra nello Stile del blocco: sulle card del plugin */
.etwp-ombra .etwp-col, .etwp-ombra .etwp-card { box-shadow: 0 4px 14px rgba(0, 0, 0, .13); }
.etwp-blocco h1, .etwp-blocco h2, .etwp-blocco h3 { font-family: var(--etwp-font-titoli); }
/* link nei testi (html libero, sezioni, testi, articoli): menu3.css li mette grigio chiaro su tutto il sito */
.etwp-html a:not([class]), .etwp-sezione a:not([class]), .etwp-testo a:not([class]), .etwp-articolo-testo a:not([class]) { color: var(--etwp-accento); text-decoration: underline; }
.etwp-blocco button, .etwp-blocco input, .etwp-blocco select, .etwp-blocco textarea { font-family: var(--etwp-font); }  /* union.css li mette in Open Sans, font non caricato */

/* testata e piede alla stessa larghezza dei blocchi (union.css: container_menu 1268px) */
.etwp-intestazione .container_menu, .etwp-piede .testob100 { max-width: var(--etwp-larghezza); }

/* visibilita' per dispositivo */
@media screen and (max-width: 767px) { .etwp-solo-desktop { display: none !important; } }
@media screen and (min-width: 768px) { .etwp-solo-mobile { display: none !important; } }

/* card in griglia dei plugin: su tablet due per riga, su smartphone una */
@media screen and (min-width: 640px) and (max-width: 1024px) {
	.etwp-blocco .etwp-col { width: 48% !important; }
}
@media screen and (max-width: 639px) {
	.etwp-blocco .etwp-col { width: 98% !important; float: none !important; margin: 1% !important; }
}

/* --- Fase 14: griglia comune delle card (EtechPlugin.ApriGriglia) ---
   N colonne uguali (--etwp-colonne), tutte le card alte uguali (righe 1fr),
   spaziatura ampia; tablet 2 colonne, smartphone 1. Le larghezze scritte
   nei plugin non contano. */
.etwp-griglia { display: grid; grid-template-columns: repeat(var(--etwp-colonne, 3), minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 32px; text-align: left; clear: both; margin: 10px 0; }
.etwp-griglia > .etwp-col { width: auto !important; margin: 0 !important; float: none !important; box-sizing: border-box; display: flex !important; flex-direction: column; height: 100%; }
.etwp-p-voci-home .etwp-griglia > .etwp-col, .etwp-p-schede-servizi .etwp-griglia > .etwp-col { text-align: center; justify-content: center; }
@media screen and (min-width: 640px) and (max-width: 1024px) {
	.etwp-griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
}
@media screen and (max-width: 639px) {
	.etwp-griglia { grid-template-columns: minmax(0, 1fr); grid-auto-rows: auto; gap: 20px; }
}

/* --- Fase 16: pagina a sezioni (EtechCore.RenderSezioni) ---
   sezione = fascia a tutta larghezza (sfondo, immagine, spazi); dentro, il contenuto
   largo come la pagina (o 1366/1680/1920/piena) diviso in 1, 2 o 3 colonne;
   nelle colonne i blocchi uno sotto l'altro. Su smartphone colonne impilate. */
.etwp-sez { width: 100%; clear: both; box-sizing: border-box; }
.etwp-sez-interno { max-width: var(--etwp-larghezza); margin: 0 auto; padding: 0 10px; box-sizing: border-box; display: flex; gap: 32px; align-items: flex-start; }
.etwp-sez-col { min-width: 0; }
.etwp-sez-col > .etwp-blocco > .etwp-interno { max-width: none; padding: 0; }
.etwp-sez-col > .etwp-blocco.etwp-larg-stretta > .etwp-interno { max-width: 860px; margin: 0 auto; }
@media screen and (max-width: 767px) {
	.etwp-sez-interno { flex-direction: column; gap: 20px; }
	.etwp-sez-col { flex: 0 0 auto !important; width: 100%; max-width: none !important; }
}

/* --- Fase 17 (2026-10-08): plugin Contatti completi (plugins/pagina-contatti) ---
   scheda dati con icone (telefono cliccabile) + modulo con etichette sopra i campi.
   .etwp-ct-centro = voci centrate nel contenitore (icona sopra il testo). */
.etwp-ct { display: flex; flex-wrap: wrap; gap: 24px; align-items: stretch; font-family: var(--etwp-font); }
.etwp-ct-sotto { flex-direction: column; }
/* Fase 36: bordo esterno da --ct-card-px e --ct-card-bordo (parametri del plugin; lo Stile del blocco, se impostato, vince) */
.etwp-ct-card { background: var(--etwp-sfondo-card, #fff); border: var(--ct-card-px, 1px) solid var(--ct-card-bordo, var(--etwp-bordo, #e3e7ec)); border-radius: var(--etwp-raggio, 10px); padding: 24px; box-sizing: border-box; }
.etwp-ct-dati { flex: 1 1 240px; color: var(--etwp-testo); font-size: 15px; line-height: 1.5; }
.etwp-ct-form { flex: 2 1 340px; }
.etwp-ct-nome { font-family: var(--etwp-font-titoli, var(--etwp-font)); color: var(--etwp-titoli); font-size: 19px; font-weight: bold; margin: 0 0 12px; }
.etwp-ct-voce { display: flex; gap: 12px; align-items: flex-start; padding: 11px 0; border-top: 1px solid var(--etwp-bordo, #eef1f4); }
.etwp-ct-voce:first-of-type { border-top: 0; }
.etwp-ct-ico { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 50%; background: rgba(224, 123, 0, .12); color: var(--etwp-accento); display: flex; align-items: center; justify-content: center; font-size: 17px; }
.etwp-ct-voce p { margin: 0; }
.etwp-ct-voce hr { display: none; }
.etwp-ct-tel { font-size: 20px; color: var(--etwp-accento) !important; text-decoration: none !important; font-weight: bold; }
.etwp-ct-voce a { color: var(--etwp-titoli); }
.etwp-ct-centro .etwp-ct-voce { flex-direction: column; align-items: center; text-align: center; gap: 6px; }
.etwp-ct-centro .etwp-ct-nome { text-align: center; }
.etwp-ct-form label { display: block; font-size: 13px; color: var(--etwp-titoli); margin: 0 0 4px; }
/* Fase 36: bordo dei campi da --ct-campi-px e --ct-campi-bordo (parametri del plugin) */
.etwp-ct-form input[type=text], .etwp-ct-form textarea { width: 100%; box-sizing: border-box; padding: 10px 12px; margin: 0 0 14px; border: var(--ct-campi-px, 1px) solid var(--ct-campi-bordo, #d5dbe2); border-radius: 6px; font: 15px var(--etwp-font); color: var(--etwp-testo); background: #fff; }
.etwp-ct-form input[type=text]:focus, .etwp-ct-form textarea:focus { outline: none; border-color: var(--etwp-accento); box-shadow: 0 0 0 3px rgba(224, 123, 0, .2); }
.etwp-ct-riga { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.etwp-ct-codice { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 14px; font-size: 13px; }
.etwp-ct-codice img { width: 26px; vertical-align: middle; }
.etwp-ct-codice input[type=text] { width: 90px; margin: 0; }
.etwp-ct-privacy { font-size: 13px; color: var(--etwp-testo); margin: 0 0 16px; }
.etwp-ct-privacy label { display: inline; font-size: 13px; color: var(--etwp-testo); }
.etwp-ct-invia { background: var(--etwp-accento); color: #fff; border: 0; padding: 12px 30px; border-radius: 6px; cursor: pointer; font: bold 15px var(--etwp-font); }
.etwp-ct-invia:hover { filter: brightness(.92); }
.etwp-ct-errore { color: #c0392b; font-size: 13px; margin-top: 8px; }
.etwp-ct-ok { flex: 2 1 340px; background: #eaf6ea; border: 1px solid #a8d5a8; border-radius: var(--etwp-raggio, 10px); padding: 20px; color: #2a7a2a; font-family: var(--etwp-font); }
@media screen and (max-width: 639px) { .etwp-ct-riga { grid-template-columns: 1fr; } }

/* --- Fase 17: posizione del plugin nel contenitore (stile del blocco "posizione" + "largMax") ---
   senza larghezza massima il plugin prende la sua larghezza naturale (fit-content) */
.etwp-pos-sinistra > .etwp-interno, .etwp-pos-centro > .etwp-interno, .etwp-pos-destra > .etwp-interno { width: fit-content; max-width: 100%; box-sizing: border-box; }
.etwp-pos-sinistra > .etwp-interno { margin-left: 0 !important; margin-right: auto !important; }
.etwp-pos-centro > .etwp-interno { margin-left: auto !important; margin-right: auto !important; }
.etwp-pos-destra > .etwp-interno { margin-left: auto !important; margin-right: 0 !important; }

/* --- Fase 17: card e pulsanti personalizzabili dallo Stile del blocco ---
   ombra: leggera / media (.etwp-ombra, gia' esistente) / forte; bordo card con colore e spessore;
   pulsanti: variabili --etwp-pul, --etwp-pul-testo, --etwp-pul-raggio usate dai plugin (fallback = aspetto di prima) */
.etwp-ombra .etwp-ct-card { box-shadow: 0 4px 14px rgba(0, 0, 0, .13); }
.etwp-ombra-l .etwp-col, .etwp-ombra-l .etwp-card, .etwp-ombra-l .etwp-ct-card { box-shadow: 0 2px 6px rgba(0, 0, 0, .08); }
.etwp-ombra-f .etwp-col, .etwp-ombra-f .etwp-card, .etwp-ombra-f .etwp-ct-card { box-shadow: 0 10px 30px rgba(0, 0, 0, .22); }
.etwp-card-bordata .etwp-col, .etwp-card-bordata .etwp-card, .etwp-card-bordata .etwp-ct-card { border: var(--etwp-card-bordo-px, 1px) solid var(--etwp-card-bordo, var(--etwp-bordo, #ddd)) !important; }
.etwp-ct-invia { background: var(--etwp-pul, var(--etwp-accento)); color: var(--etwp-pul-testo, #fff); border-radius: var(--etwp-pul-raggio, 6px); }

/* --- Fase 18: zoom al passaggio del mouse (Stile del blocco "zoom") ---
   card: la card si ingrandisce un poco; immagine: la foto si ingrandisce restando nel suo riquadro
   (clip-path 3.7% = la parte che con scale 1.08 uscirebbe dal bordo) */
.etwp-zoom-card .etwp-col, .etwp-zoom-card .etwp-card, .etwp-zoom-card .etwp-ct-card { transition: transform .3s ease, box-shadow .3s ease; }
.etwp-zoom-card .etwp-col:hover, .etwp-zoom-card .etwp-card:hover, .etwp-zoom-card .etwp-ct-card:hover { transform: scale(1.03); position: relative; z-index: 2; }
.etwp-zoom-immagine .etwp-col img, .etwp-zoom-immagine .etwp-card img { transition: transform .4s ease, clip-path .4s ease; clip-path: inset(0); }
.etwp-zoom-immagine .etwp-col:hover img, .etwp-zoom-immagine .etwp-card:hover img { transform: scale(1.08); clip-path: inset(3.7%); }
@media (prefers-reduced-motion: reduce) {
	.etwp-zoom-card .etwp-col:hover, .etwp-zoom-card .etwp-card:hover, .etwp-zoom-card .etwp-ct-card:hover, .etwp-zoom-immagine .etwp-col:hover img, .etwp-zoom-immagine .etwp-card:hover img { transform: none; clip-path: none; }
}

/* --- Fase 18: voci home in riga flessibile (plugin voci-home) ---
   card piccole di misura fissa: per riga quante ne stanno (non la griglia 2/1 colonne
   delle card grandi); max-width nel plugin = numero massimo per riga */
.etwp-voci { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin: 10px auto; }
.etwp-blocco .etwp-voci > .etwp-col { flex: 0 0 136px; width: 136px !important; margin: 0 !important; float: none !important; box-sizing: border-box; display: flex !important; flex-direction: column; justify-content: center; text-align: center; }
@media screen and (max-width: 639px) {
	.etwp-voci { gap: 10px; }
	.etwp-blocco .etwp-voci > .etwp-col { flex-basis: 106px; width: 106px !important; padding: 8px !important; }
	.etwp-voci > .etwp-col img { max-width: 64px !important; }
}

/* --- Fase 19: condivisione social (plugin condividi-social) ---
   fascia larga come il sito: testo a sinistra, pulsanti tondi a destra; su smartphone centrati.
   Sfondo = Stile del blocco. .etwp-share-tema = tutti i pulsanti col colore accento del tema */
.etwp-share { padding: 26px 0; font-family: var(--etwp-font); }
.etwp-share-in { max-width: var(--etwp-larghezza); margin: 0 auto; padding: 0 10px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 18px 32px; flex-wrap: wrap; }
.etwp-share-titolo { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 20px; font-weight: bold; color: var(--etwp-titoli); }
.etwp-share-sotto { font-size: 14px; color: var(--etwp-testo); margin-top: 2px; }
.etwp-share-pulsanti { display: flex; gap: 12px; flex-wrap: wrap; }
.etwp-share-pulsanti a { width: 46px; height: 46px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff !important; font-size: 20px; text-decoration: none !important; box-shadow: 0 3px 8px rgba(0, 0, 0, .12); transition: transform .2s ease, box-shadow .2s ease; }
.etwp-share-pulsanti a:hover, .etwp-share-pulsanti a:focus-visible { transform: translateY(-3px); box-shadow: 0 8px 16px rgba(0, 0, 0, .18); }
.etwp-share-fb { background: #1877f2; }
.etwp-share-x { background: #000; }
.etwp-share-li { background: #0a66c2; }
.etwp-share-wa { background: #25d366; }
.etwp-share-mail { background: #6b7785; }
.etwp-share-tema .etwp-share-pulsanti a { background: var(--etwp-accento); }
@media screen and (max-width: 639px) {
	.etwp-share-in { flex-direction: column; text-align: center; }
	.etwp-share-pulsanti { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { .etwp-share-pulsanti a:hover { transform: none; } }

/* --- Fase 20: negozio - scheda prodotto (.etwp-ps-*) (l elenco .etwp-pr-* e piu sotto, Fase 23) ---
   card della griglia comune (ombra, bordo, zoom dallo Stile del blocco); prezzi col colore
   accento; filtro categorie con le variabili dei pulsanti (--etwp-pul*) */
.etwp-ps { font-family: var(--etwp-font); color: var(--etwp-testo); padding: 14px 0; }
.etwp-ps-percorso { font-size: 13px; margin-bottom: 14px; }
.etwp-ps-percorso a { color: var(--etwp-testo); }
.etwp-ps-alto { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px; align-items: start; }
.etwp-ps-grande { position: relative; border: 1px solid var(--etwp-bordo, #e3e7ec); border-radius: var(--etwp-raggio, 10px); background: #fff; aspect-ratio: 4 / 3; overflow: hidden; }
.etwp-ps-grande img { width: 100%; height: 100%; object-fit: contain; display: block; }
.etwp-ps-miniature { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.etwp-ps-miniature button { width: 72px; height: 54px; padding: 0; border: 2px solid transparent; border-radius: 6px; background: #fff; cursor: pointer; overflow: hidden; }
.etwp-ps-miniature button.on { border-color: var(--etwp-accento); }
.etwp-ps-miniature img { width: 100%; height: 100%; object-fit: cover; display: block; }
.etwp-ps-dati h1 { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 28px; color: var(--etwp-titoli); margin: 0 0 6px; line-height: 1.2; }
.etwp-ps-codice { font-size: 13px; color: #7a8592; margin-bottom: 14px; }
.etwp-ps-prezzi { margin: 10px 0 14px; }
.etwp-ps-prezzo { color: var(--etwp-accento); font-size: 30px; font-weight: bold; }
.etwp-ps-scade { font-size: 13px; color: #2f7d32; margin-top: 4px; }
.etwp-ps-iva { font-size: 12px; color: #7a8592; margin-top: 2px; }
.etwp-ps-disp { color: #2f7d32; font-size: 14px; margin-bottom: 14px; }
.etwp-ps-no { color: #b42318 !important; }
.etwp-ps-ok { color: #2f7d32; }
.etwp-ps-acquista { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.etwp-ps-qta { display: inline-flex; border: 1px solid var(--etwp-bordo, #c9d1da); border-radius: 6px; overflow: hidden; }
.etwp-ps-qta button { width: 38px; border: 0; background: #f2f4f7; font-size: 18px; cursor: pointer; color: var(--etwp-titoli); }
.etwp-ps-qta input { width: 54px; border: 0; text-align: center; font-size: 16px; -moz-appearance: textfield; }
.etwp-ps-qta input::-webkit-inner-spin-button { -webkit-appearance: none; }
.etwp-ps-carrello { background: var(--etwp-pul, var(--etwp-accento)); color: var(--etwp-pul-testo, #fff); border: 0; border-radius: var(--etwp-pul-raggio, 6px); padding: 13px 26px; font: bold 16px var(--etwp-font); cursor: pointer; }
.etwp-ps-carrello:hover { filter: brightness(.92); }
.etwp-ps-esito { margin-top: 10px; font-size: 14px; min-height: 20px; }
.etwp-ps-sezione { margin-top: 32px; }
.etwp-ps-sezione h2 { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 20px; color: var(--etwp-titoli); border-bottom: 2px solid var(--etwp-accento); display: inline-block; padding-bottom: 4px; margin: 0 0 12px; }
.etwp-ps-testo { font-size: 16px; line-height: 1.7; }
@media screen and (max-width: 767px) {
	.etwp-ps-alto { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.etwp-ps-dati h1 { font-size: 23px; }
}

/* --- Fase 20: carrello (.etwp-cr-*) e pulsante carrello fisso (.etwp-carrello-btn) ---
   il modulo dati riusa lo stile del plugin contatti (.etwp-ct-form, .etwp-ct-riga, .etwp-ct-invia) */
.etwp-carrello-btn { position: fixed; right: 18px; top: 96px; z-index: 900; width: 54px; height: 54px; border-radius: 50%; background: var(--etwp-titoli, #17324d); color: #fff !important; display: flex; align-items: center; justify-content: center; font-size: 22px; box-shadow: 0 4px 12px rgba(0, 0, 0, .25); text-decoration: none !important; }
.etwp-carrello-btn:hover { filter: brightness(1.15); }
.etwp-carrello-n { position: absolute; top: -4px; right: -4px; min-width: 22px; height: 22px; border-radius: 11px; background: var(--etwp-accento); color: #fff; font: bold 12px/22px var(--etwp-font); text-align: center; padding: 0 5px; box-sizing: border-box; }
.etwp-cr { font-family: var(--etwp-font); color: var(--etwp-testo); padding: 14px 0; }
.etwp-cr-titolo { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 26px; font-weight: bold; color: var(--etwp-titoli); margin-bottom: 18px; }
.etwp-cr-vuoto, .etwp-cr-fatto { text-align: center; padding: 30px 10px; }
.etwp-cr-vuoto i, .etwp-cr-fatto > i { font-size: 46px; color: #c5ccd4; }
.etwp-cr-fatto > i { color: #2f7d32; }
.etwp-cr-fatto h2 { color: var(--etwp-titoli); margin: 10px 0; }
.etwp-cr-fatto table { margin: 14px auto !important; text-align: left; }
.etwp-cr-testo { max-width: 640px; margin: 14px auto; padding: 14px 18px; background: #f2f4f7; border-radius: 8px; text-align: left; }
.etwp-cr-griglia { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.etwp-cr-riga { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto 100px 36px; gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--etwp-bordo, #e6e9ee); }
.etwp-cr-foto { width: 76px; height: 60px; border: 1px solid var(--etwp-bordo, #e6e9ee); border-radius: 6px; background: #fff; display: flex; align-items: center; justify-content: center; color: #c5ccd4; overflow: hidden; }
.etwp-cr-foto img { width: 100%; height: 100%; object-fit: contain; }
.etwp-cr-nome a { color: var(--etwp-titoli); font-weight: bold; text-decoration: none; }
.etwp-cr-nome div { font-size: 13px; color: #7a8592; margin-top: 2px; }
.etwp-cr-tot { text-align: right; font-weight: bold; color: var(--etwp-titoli); }
.etwp-cr-togli { border: 0; background: none; color: #9aa5b1; font-size: 18px; cursor: pointer; }
.etwp-cr-togli:hover { color: #b42318; }
.etwp-cr-continua { display: inline-block; margin-top: 14px; color: var(--etwp-accento); }
.etwp-cr-riepilogo { background: var(--etwp-sfondo-card, #fff); border: 1px solid var(--etwp-bordo, #e3e7ec); border-radius: var(--etwp-raggio, 10px); padding: 18px 20px; }
.etwp-cr-voce { display: flex; justify-content: space-between; padding: 7px 0; }
.etwp-cr-totale { border-top: 1px solid var(--etwp-bordo, #e6e9ee); margin-top: 6px; padding-top: 12px; font-size: 20px; font-weight: bold; color: var(--etwp-titoli); }
.etwp-cr-totale span:last-child { color: var(--etwp-accento); }
.etwp-cr-nota { font-size: 12px; color: #7a8592; }
.etwp-cr-dati { margin-top: 30px; max-width: 760px; }
.etwp-cr-dati h2 { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 20px; color: var(--etwp-titoli); margin: 0 0 12px; }
.etwp-cr-accedi { background: #f2f4f7; border-radius: 8px; padding: 10px 14px; margin-bottom: 14px; font-size: 14px; }
.etwp-cr-avviso { background: #fdf1e3; color: #b26200; border-radius: 8px; padding: 12px 16px; }
.etwp-cr-luogo { display: grid; grid-template-columns: 120px minmax(0, 1fr) 90px; gap: 0 14px; }
.etwp-cr-dati textarea { width: 100%; box-sizing: border-box; }
.etwp-cr-btn2 { display: inline-block; border: 1px solid var(--etwp-accento); color: var(--etwp-accento) !important; border-radius: 6px; padding: 9px 20px; text-decoration: none !important; margin-top: 10px; }
@media screen and (max-width: 767px) {
	.etwp-cr-griglia { grid-template-columns: minmax(0, 1fr); }
	.etwp-cr-riga { grid-template-columns: 60px minmax(0, 1fr) 36px; }
	.etwp-cr-riga .etwp-ps-qta { grid-column: 2; }
	.etwp-cr-riga .etwp-cr-tot { grid-column: 2; text-align: left; }
	.etwp-cr-luogo { grid-template-columns: 100px minmax(0, 1fr); }
	.etwp-carrello-btn { top: auto; bottom: 80px; right: 14px; }
}

/* --- Fase 20: area clienti (.etwp-ac-*) --- */
.etwp-ac { font-family: var(--etwp-font); color: var(--etwp-testo); padding: 14px 0; }
.etwp-ac-due { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.etwp-ac h2 { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 20px; color: var(--etwp-titoli); margin: 0 0 14px; }
.etwp-ct-form input[type=password] { width: 100%; box-sizing: border-box; padding: 10px 12px; margin: 0 0 14px; border: 1px solid #d5dbe2; border-radius: 6px; font: 15px var(--etwp-font); }
.etwp-ct-form input[type=password]:focus { outline: none; border-color: var(--etwp-accento); box-shadow: 0 0 0 3px rgba(224, 123, 0, .2); }
.etwp-ac-link { display: inline-block; margin-left: 14px; font-size: 14px; color: var(--etwp-accento); }
.etwp-ac-ciao { margin-bottom: 18px; font-size: 16px; }
.etwp-ac-ciao a { color: var(--etwp-accento); }
.etwp-ac-ordine { border-bottom: 1px solid var(--etwp-bordo, #e6e9ee); padding: 10px 0; }
.etwp-ac-ordine summary { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 8px; cursor: pointer; align-items: center; }
.etwp-ac-ordine table { width: 100%; margin-top: 8px; font-size: 14px; border-collapse: collapse; }
.etwp-ac-ordine td { padding: 4px 0; }
.etwp-ac-ordine td:last-child { text-align: right; }
.etwp-ac-stato { display: inline-block; background: #fdf1e3; color: #b26200; border-radius: 10px; padding: 1px 10px; font-size: 13px; text-align: center; }
@media screen and (max-width: 767px) { .etwp-ac-due { grid-template-columns: minmax(0, 1fr); } }

/* --- Fase 21: barra delle pagine (plugin pagina-news, ?pag=N) ---
   colori e angoli come i pulsanti dello Stile del blocco (--etwp-pul*) */
.etwp-pag { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin: 26px 0 6px; font-family: var(--etwp-font); }
.etwp-pag a, .etwp-pag span { min-width: 40px; height: 40px; padding: 0 12px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--etwp-pul-raggio, 8px); font-size: 15px; text-decoration: none; }
.etwp-pag a { border: 1px solid var(--etwp-pul, var(--etwp-bordo, #d5dbe2)); background: var(--etwp-sfondo-card, #fff); color: var(--etwp-titoli); }
.etwp-pag a:hover { border-color: var(--etwp-pul, var(--etwp-accento)); color: var(--etwp-pul, var(--etwp-accento)); }
.etwp-pag span.on { background: var(--etwp-pul, var(--etwp-accento)); color: var(--etwp-pul-testo, #fff); font-weight: bold; }
.etwp-pag-puntini { color: #9aa5b1; min-width: 20px !important; padding: 0 !important; }


/* --- Fase 23: negozio, ispirato a Shopify ---
   Tutti i colori dal tema e dallo Stile del blocco: --etwp-titoli (nomi, titoli), --etwp-testo
   (testi; i secondari con opacita), --etwp-accento (prezzi in offerta), --etwp-pul* (pulsanti,
   voci scelte). Elenco prodotti (.etwp-pr-*): vista griglia (card) e righe (stile Amazon). */
.etwp-pr { font-family: var(--etwp-font); color: var(--etwp-testo); padding: 6px 0; }
.etwp-pr-titolo { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 26px; font-weight: bold; color: var(--etwp-titoli); margin-bottom: 14px; }
.etwp-pr-barra { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 22px; }
.etwp-pr-filtri { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; }
.etwp-pr-attivo { display: inline-flex; align-items: center; gap: 6px; background: rgba(0, 0, 0, .05); color: var(--etwp-titoli) !important; border-radius: 20px; padding: 5px 12px; font-size: 13px; text-decoration: none !important; }
.etwp-pr-attivo i { opacity: .55; }
.etwp-pr-attivo:hover i { opacity: 1; }
.etwp-pr-comandi { display: flex; align-items: center; gap: 6px; }
.etwp-pr-comandi select { padding: 8px 30px 8px 12px; border: 1px solid rgba(0, 0, 0, .15); border-radius: 8px; background: transparent; font: 14px var(--etwp-font); color: var(--etwp-testo); }
.etwp-pr-vista { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; color: var(--etwp-testo) !important; opacity: .45; font-size: 17px; text-decoration: none !important; }
.etwp-pr-vista.on, .etwp-pr-vista:hover { opacity: 1; background: rgba(0, 0, 0, .05); }
.etwp-pr-card, .etwp-pr-riga { background: var(--etwp-sfondo-card, #fff); border-radius: var(--etwp-raggio, 12px); overflow: hidden; text-align: left; }
.etwp-pr-foto { position: relative; display: block; background: rgba(0, 0, 0, .035); border-radius: var(--etwp-raggio, 12px); overflow: hidden; aspect-ratio: 1 / 1; }
.etwp-pr-foto img { width: 100%; height: 100%; object-fit: contain; padding: 8%; box-sizing: border-box; display: block; mix-blend-mode: multiply; transition: transform .45s ease; }
.etwp-pr-card:hover .etwp-pr-foto img, .etwp-pr-riga:hover .etwp-pr-foto img { transform: scale(1.05); }
.etwp-pr-nofoto { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: 140px; color: var(--etwp-testo); opacity: .25; font-size: 42px; }
.etwp-pr-badge { position: absolute; top: 10px; left: 10px; background: var(--etwp-accento); color: #fff; font-size: 12px; font-weight: bold; padding: 4px 10px; border-radius: 20px; letter-spacing: .3px; }
.etwp-pr-esaurito { left: auto; right: 10px; background: var(--etwp-titoli); font-weight: normal; }
.etwp-pr-corpo { padding: 14px 4px 6px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.etwp-pr-marca { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--etwp-testo); opacity: .6; }
.etwp-pr-nome { color: var(--etwp-titoli) !important; font-size: 15px; line-height: 1.35; text-decoration: none !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.etwp-pr-nome:hover { text-decoration: underline !important; text-underline-offset: 3px; }
.etwp-pr-prezzi { margin-top: 4px; }
.etwp-pr-prezzo { color: var(--etwp-titoli); font-size: 17px; font-weight: bold; }
.etwp-pr-saldo { color: var(--etwp-accento); }
.etwp-pr-vecchio { color: var(--etwp-testo); opacity: .55; text-decoration: line-through; font-size: 14px; margin-left: 6px; }
.etwp-pr-quota { font-size: 14px; color: var(--etwp-accento); }
.etwp-pr-aggiungi { margin-top: 10px; align-self: flex-start; border: 1px solid var(--etwp-pul, var(--etwp-titoli)); background: transparent; color: var(--etwp-pul, var(--etwp-titoli)); border-radius: var(--etwp-pul-raggio, 30px); padding: 8px 16px; font: 13px var(--etwp-font); cursor: pointer; transition: background .2s, color .2s; }
.etwp-pr-aggiungi:hover, .etwp-pr-aggiungi.ok { background: var(--etwp-pul, var(--etwp-titoli)); color: var(--etwp-pul-testo, #fff); }
.etwp-pr-aggiungi.no { border-color: #b42318; color: #b42318; }
.etwp-pr-vuoto { text-align: center; padding: 40px 10px; }
.etwp-pr-vuoto i { font-size: 34px; opacity: .3; }
.etwp-pr-vuoto a { color: var(--etwp-accento); }
/* vista righe (stile Amazon): foto | nome, marca, descrizione, disponibilita | prezzo e acquisto */
.etwp-pr-righe { display: flex; flex-direction: column; gap: 16px; }
.etwp-pr-riga { display: grid; grid-template-columns: 200px minmax(0, 1fr) 210px; gap: 24px; padding: 16px; align-items: start; border: 1px solid rgba(0, 0, 0, .07); }
.etwp-pr-dati { display: flex; flex-direction: column; gap: 6px; }
.etwp-pr-riga .etwp-pr-nome { font-size: 18px; -webkit-line-clamp: 3; }
.etwp-pr-testo { margin: 4px 0 0; font-size: 14px; line-height: 1.55; opacity: .8; }
.etwp-pr-disp { font-size: 13px; color: #2f7d32; }
.etwp-pr-disp.etwp-pr-no { color: #b42318; }
.etwp-pr-acquisto { display: flex; flex-direction: column; gap: 6px; border-left: 1px solid rgba(0, 0, 0, .07); padding-left: 20px; }
.etwp-pr-acquisto .etwp-pr-prezzo { font-size: 24px; }
.etwp-pr-acquisto .etwp-pr-vecchio { display: block; margin: 2px 0 0; }
.etwp-pr-risparmio { font-size: 13px; color: var(--etwp-accento); }
.etwp-pr-acquisto .etwp-pr-aggiungi { align-self: stretch; text-align: center; background: var(--etwp-pul, var(--etwp-accento)); border-color: var(--etwp-pul, var(--etwp-accento)); color: var(--etwp-pul-testo, #fff); padding: 11px 14px; font-size: 14px; }
.etwp-pr-acquisto .etwp-pr-aggiungi:hover { filter: brightness(.92); }
.etwp-pr-dettagli { font-size: 13px; color: var(--etwp-titoli); text-align: center; }
/* Categorie prodotti (.etwp-cp-*): elenco laterale o pillole */
.etwp-cp { font-family: var(--etwp-font); margin-bottom: 24px; }
.etwp-cp-titolo { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 13px; font-weight: bold; text-transform: uppercase; letter-spacing: 1.2px; color: var(--etwp-titoli); margin-bottom: 10px; }
.etwp-cp-voci { display: flex; flex-direction: column; gap: 2px; }
.etwp-cp-voci a { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 8px; color: var(--etwp-testo) !important; text-decoration: none !important; font-size: 15px; border-left: 3px solid transparent; }
.etwp-cp-voci a small { font-size: 12px; opacity: .55; }
.etwp-cp-voci a:hover { background: rgba(0, 0, 0, .04); }
.etwp-cp-voci a.on { border-left-color: var(--etwp-pul, var(--etwp-accento)); background: rgba(0, 0, 0, .04); color: var(--etwp-titoli) !important; font-weight: bold; }
.etwp-cp-pillole .etwp-cp-voci { flex-direction: row; flex-wrap: wrap; gap: 8px; }
.etwp-cp-pillole .etwp-cp-voci a { border-left: 0; border-radius: var(--etwp-pul-raggio, 30px); background: rgba(0, 0, 0, .05); padding: 8px 16px; font-size: 14px; }
.etwp-cp-pillole .etwp-cp-voci a small { margin-left: 4px; }
.etwp-cp-pillole .etwp-cp-voci a.on, .etwp-cp-pillole .etwp-cp-voci a:hover { background: var(--etwp-pul, var(--etwp-titoli)); color: var(--etwp-pul-testo, #fff) !important; font-weight: normal; }
/* Ricerca prodotti (.etwp-rp-*) */
.etwp-rp { font-family: var(--etwp-font); margin-bottom: 24px; }
.etwp-rp-titolo { display: block; font-size: 13px; font-weight: bold; text-transform: uppercase; letter-spacing: 1.2px; color: var(--etwp-titoli); margin-bottom: 10px; }
.etwp-rp-campo { display: flex; align-items: center; gap: 4px; background: var(--etwp-sfondo-card, #fff); border: 1px solid rgba(0, 0, 0, .15); border-radius: var(--etwp-pul-raggio, 30px); padding: 4px 4px 4px 16px; transition: border-color .2s, box-shadow .2s; }
.etwp-rp-campo:focus-within { border-color: var(--etwp-accento); box-shadow: 0 0 0 3px rgba(0, 0, 0, .06); }
.etwp-rp-campo i { opacity: .45; color: var(--etwp-testo); }
.etwp-rp-campo input { flex: 1; min-width: 0; border: 0; background: transparent; padding: 9px 6px; font: 15px var(--etwp-font); color: var(--etwp-testo); outline: none; }
.etwp-rp-campo button { border: 0; background: var(--etwp-pul, var(--etwp-titoli)); color: var(--etwp-pul-testo, #fff); border-radius: var(--etwp-pul-raggio, 30px); padding: 9px 18px; font: 14px var(--etwp-font); cursor: pointer; }
@media screen and (max-width: 767px) {
	.etwp-pr-riga { grid-template-columns: 110px minmax(0, 1fr); gap: 14px; padding: 12px; }
	.etwp-pr-riga .etwp-pr-testo { display: none; }
	.etwp-pr-acquisto { grid-column: 1 / -1; border-left: 0; padding-left: 0; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px; }
	.etwp-pr-acquisto .etwp-pr-aggiungi { align-self: auto; flex: 1; }
	.etwp-pr-riga .etwp-pr-nome { font-size: 16px; }
}
@media screen and (max-width: 639px) {
	.etwp-pr .etwp-griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
	.etwp-pr .etwp-pr-nome { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) { .etwp-pr-foto img { transition: none; } .etwp-pr-card:hover .etwp-pr-foto img { transform: none; } }
/* Fase 23: i pulsanti del sito hanno larghezza propria (union.css): qui la misura la decide il contenuto */
.etwp-rp-campo button, .etwp-pr-aggiungi { width: auto !important; flex: 0 0 auto; }
.etwp-rp-campo input { width: auto !important; flex: 1 1 auto; }
.etwp-pr-acquisto .etwp-pr-aggiungi { width: 100% !important; }
/* Fase 24: categorie e marche su smartphone compatte: una riga di linguette che scorre di lato
   (sia aspetto elenco sia pillole), voce scelta piena; su computer restano come sono */
@media screen and (max-width: 767px) {
	.etwp-cp { margin-bottom: 14px; }
	.etwp-cp-titolo { font-size: 11px; margin-bottom: 6px; }
	.etwp-cp .etwp-cp-voci { flex-direction: row; flex-wrap: nowrap; overflow-x: auto; gap: 8px; padding-bottom: 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.etwp-cp .etwp-cp-voci::-webkit-scrollbar { display: none; }
	.etwp-cp .etwp-cp-voci a { flex: 0 0 auto; white-space: nowrap; border-left: 0; border-radius: var(--etwp-pul-raggio, 30px); background: rgba(0, 0, 0, .05); padding: 7px 14px; font-size: 14px; font-weight: normal; }
	.etwp-cp .etwp-cp-voci a small { margin-left: 4px; }
	.etwp-cp .etwp-cp-voci a.on { background: var(--etwp-pul, var(--etwp-titoli)); color: var(--etwp-pul-testo, #fff) !important; }
}

/* --- Fase 26: comparsa dei blocchi quando arrivano sullo schermo (Stile "Comparsa", core/etwp.js) ---
   nascosti solo con gli script attivi (html.etwp-js); .etwp-visto avvia l'animazione una volta.
   .etwp-rivela-card: si animano le card (.etwp-col) una dopo l'altra, non il blocco intero */
.etwp-js .etwp-rivela:not(.etwp-rivela-card), .etwp-js .etwp-rivela-card .etwp-col { opacity: 0; transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .3, 1); }
.etwp-js .etwp-rivela-basso:not(.etwp-rivela-card), .etwp-js .etwp-rivela-basso.etwp-rivela-card .etwp-col { transform: translateY(40px); }
.etwp-js .etwp-rivela-sinistra:not(.etwp-rivela-card), .etwp-js .etwp-rivela-sinistra.etwp-rivela-card .etwp-col { transform: translateX(-50px); }
.etwp-js .etwp-rivela-destra:not(.etwp-rivela-card), .etwp-js .etwp-rivela-destra.etwp-rivela-card .etwp-col { transform: translateX(50px); }
.etwp-js .etwp-rivela-zoom:not(.etwp-rivela-card), .etwp-js .etwp-rivela-zoom.etwp-rivela-card .etwp-col { transform: scale(.92); }
.etwp-js .etwp-rivela.etwp-visto:not(.etwp-rivela-card), .etwp-js .etwp-rivela-card.etwp-visto .etwp-col { opacity: 1; transform: none; }
/* l'entrata di lato non deve far scorrere la pagina in orizzontale */
.etwp-sez:has(.etwp-rivela-sinistra, .etwp-rivela-destra) { overflow-x: clip; }
@media (prefers-reduced-motion: reduce) {
	.etwp-js .etwp-rivela, .etwp-js .etwp-rivela .etwp-col { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* --- Fase 28: riga orizzontale (plugin separatore, tipo "riga") ---
   --riga-spessore e --riga-colore dal plugin; colore vuoto = bordi del tema.
   Lunghezza (etwp-riga-l100/75/50/25/corta) e posizione (centro/sinistra/destra) sul contenitore. */
.etwp-riga { display: flex; align-items: center; gap: 14px; clear: both; box-sizing: content-box; font-family: var(--etwp-font); }
.etwp-riga-linea { display: block; flex: 1 1 auto; height: 0; border-top: var(--riga-spessore, 1px) solid var(--riga-colore, var(--etwp-bordo, #d5dbe2)); }
.etwp-riga-l100 { width: 100%; }
.etwp-riga-l75 { width: 75%; }
.etwp-riga-l50 { width: 50%; }
.etwp-riga-l25 { width: 25%; }
.etwp-riga-lcorta { width: 60px; }
.etwp-riga-centro { margin-left: auto; margin-right: auto; }
.etwp-riga-sinistra { margin-right: auto; }
.etwp-riga-destra { margin-left: auto; }
.etwp-riga-tratteggiata .etwp-riga-linea { border-top-style: dashed; }
.etwp-riga-puntinata .etwp-riga-linea { border-top-style: dotted; }
.etwp-riga-doppia .etwp-riga-linea { border-top-style: double; border-top-width: max(3px, var(--riga-spessore, 1px)); }
.etwp-riga-sfumata .etwp-riga-linea { border-top: 0; height: var(--riga-spessore, 1px); background: linear-gradient(90deg, transparent, var(--riga-colore, var(--etwp-bordo, #d5dbe2)), transparent); }
.etwp-riga-sfumata.etwp-riga-testo .etwp-riga-linea:first-child { background: linear-gradient(90deg, transparent, var(--riga-colore, var(--etwp-bordo, #d5dbe2))); }
.etwp-riga-sfumata.etwp-riga-testo .etwp-riga-linea:last-child { background: linear-gradient(90deg, var(--riga-colore, var(--etwp-bordo, #d5dbe2)), transparent); }
.etwp-riga-scritta { flex: 0 0 auto; font-size: 13px; text-transform: uppercase; letter-spacing: 1.5px; color: var(--etwp-testo); opacity: .7; white-space: nowrap; }

/* --- Fase 29: strumenti di lettura (pagina-testo, articolo-news, indice-lettura; core/etwp.js) ---
   Tempo di lettura, indice dei titoli interni, "Continua a leggere" (sfumatura con mask:
   va bene su qualunque sfondo), barra di avanzamento in alto. Colori dal tema. */
.etwp-lettura-tempo { font-size: 13px; color: var(--etwp-testo); opacity: .75; margin: 0 0 14px; }
.etwp-indice { background: var(--etwp-sfondo-card, #fff); border: 1px solid var(--etwp-bordo, #d5dbe2); border-left: 4px solid var(--etwp-accento); border-radius: var(--etwp-raggio, 8px); padding: 14px 18px; margin: 0 0 20px; font-family: var(--etwp-font); }
.etwp-indice[hidden] { display: none; }
.etwp-indice-titolo { font-size: 12px; text-transform: uppercase; letter-spacing: 1.2px; font-weight: bold; color: var(--etwp-titoli); margin-bottom: 8px; }
.etwp-indice ol { list-style: none; margin: 0; padding: 0; }
.etwp-indice li { margin: 0; padding: 0; }
.etwp-indice a { display: block; padding: 5px 0; font-size: 15px; line-height: 1.35; color: var(--etwp-testo); text-decoration: none !important; }
.etwp-indice a:hover { color: var(--etwp-accento); }
.etwp-indice li.etwp-indice-l1 a { padding-left: 14px; }
.etwp-indice li.etwp-indice-l2 a { padding-left: 28px; font-size: 14px; }
.etwp-indice-lato { margin: 0; }
.etwp-corpo h2, .etwp-corpo h3, .etwp-corpo h4 { scroll-margin-top: 20px; }
.etwp-taglia.etwp-chiuso { overflow: hidden; -webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent); }
.etwp-continua { display: block; width: auto !important; margin: 6px auto 10px; background: var(--etwp-pul, var(--etwp-accento)); color: var(--etwp-pul-testo, #fff); border: 0; border-radius: var(--etwp-pul-raggio, 30px); padding: 12px 28px; font: bold 15px var(--etwp-font); cursor: pointer; box-shadow: 0 4px 12px rgba(0, 0, 0, .15); transition: transform .2s; }
.etwp-continua:hover { transform: translateY(-2px); }
.etwp-barra-lettura { position: fixed; left: 0; top: 0; width: 100%; height: 4px; z-index: 1000; pointer-events: none; }
.etwp-barra-lettura span { display: block; height: 100%; width: 0; background: var(--etwp-accento); }

/* --- Fase 30: form contatti breve (plugin form-contatti) ---
   Titolo grande, frase d'invito, campi con etichetta e bordo ben visibili, pulsante pieno
   a tutta larghezza (variabili --etwp-pul*), rassicurazione e "oppure chiamaci". */
.etwp-fc { max-width: 520px; margin: 14px auto; background: var(--etwp-sfondo-card, #fff); border: 1px solid var(--etwp-bordo, #e3e7ec); border-top: 4px solid var(--etwp-accento); border-radius: var(--etwp-raggio, 10px); padding: 22px 20px; box-sizing: border-box; font-family: var(--etwp-font); color: var(--etwp-testo); box-shadow: 0 6px 20px rgba(0, 0, 0, .08); }
.etwp-fc-titolo { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 26px; line-height: 1.2; font-weight: bold; color: var(--etwp-titoli); margin: 0 0 6px; }
.etwp-fc-invito { font-size: 15px; line-height: 1.45; margin: 0 0 16px; opacity: .85; }
.etwp-fc label { display: block; font-size: 13px; font-weight: bold; color: var(--etwp-titoli); margin: 0 0 4px; }
.etwp-fc input[type=text], .etwp-fc textarea { display: block; width: 100%; box-sizing: border-box; padding: 11px 12px; margin: 0 0 12px; border: 1.5px solid #b9c2cc; border-radius: 8px; background: #fff; font: 15px var(--etwp-font); color: #222; transition: border-color .2s, box-shadow .2s; }
.etwp-fc textarea { resize: vertical; min-height: 96px; }
.etwp-fc input::placeholder, .etwp-fc textarea::placeholder { color: #a3abb5; opacity: 1; }
.etwp-fc input[type=text]:focus, .etwp-fc textarea:focus { outline: none; border-color: var(--etwp-accento); box-shadow: 0 0 0 3px rgba(224, 123, 0, .2); }
.etwp-fc input.etwp-fc-invia { display: block; width: 100% !important; margin: 4px 0 0; padding: 14px 18px; border: 0; border-radius: var(--etwp-pul-raggio, 8px); background: var(--etwp-pul, var(--etwp-accento)); color: var(--etwp-pul-testo, #fff); font: bold 17px var(--etwp-font); cursor: pointer; box-shadow: 0 4px 12px rgba(0, 0, 0, .18); transition: transform .2s, filter .2s; }
.etwp-fc input.etwp-fc-invia:hover { transform: translateY(-2px); filter: brightness(1.05); }
.etwp-fc-errore { color: #c0392b; font-size: 13px; margin-top: 6px; }
.etwp-fc-nota { font-size: 12px; text-align: center; margin-top: 10px; opacity: .75; }
.etwp-fc-chiama { text-align: center; font-size: 14px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--etwp-bordo, #d5dbe2); }
.etwp-fc-chiama a { display: inline-block; margin-left: 4px; font-size: 17px; font-weight: bold; color: var(--etwp-accento) !important; text-decoration: none !important; }
.etwp-fc-ok { border-top-color: #2e9d4f; font-size: 15px; }
.etwp-fc-ok .etwp-fc-titolo { color: #2e9d4f; font-size: 22px; }

/* --- Fase 32: articoli del blog meno spaziati ---
   Le righe vuote del vecchio editor sono state tolte dal database (strumenti/articoli-compatta.ps1);
   qui uno spazio piccolo e uguale tra i paragrafi (div o p) del testo dell'articolo. */
.etwp-articolo-testo > div, .etwp-articolo-testo > p { margin: 0 0 .7em; }
.etwp-articolo-testo h2, .etwp-articolo-testo h3 { margin: 1.1em 0 .4em; line-height: 1.25; }

/* --- Fase 34: sezioni 33/66 e 66/33 una sotto l'altra gia' sotto 1024 px (tablet, finestre medie) ---
   La colonna da 1/3 a quelle larghezze resta sotto i 300 px e schiaccia il contenuto (es. dati
   della pagina Contatti). 50/50, 25/75 (negozio) e 3 colonne restano affiancate fino a 768 px. */
@media screen and (max-width: 1024px) {
	.etwp-cols-33-66, .etwp-cols-66-33 { flex-direction: column; gap: 20px; }
	.etwp-cols-33-66 > .etwp-sez-col, .etwp-cols-66-33 > .etwp-sez-col { flex: 0 0 auto !important; width: 100%; max-width: none !important; }
}

/* --- Fase 37: zoom delle card anche con "Comparsa: card una dopo l'altra" ---
   La regola che a fine comparsa mette le card ferme (transform: none) era piu' forte dello zoom
   e lo annullava. Qui lo zoom vince quando la comparsa e' finita (.etwp-visto). */
.etwp-js .etwp-zoom-card.etwp-rivela-card.etwp-visto .etwp-col:hover { transform: scale(1.03); position: relative; z-index: 2; transition: transform .3s ease, box-shadow .3s ease; }
@media (prefers-reduced-motion: reduce) { .etwp-js .etwp-zoom-card.etwp-rivela-card.etwp-visto .etwp-col:hover { transform: none; } }

/* --- Fase 38: archivio news (blocco-news-anni, blocco-news-mesi) e filtro attivo (blocco-news-griglia) ---
   Pillole come i widget archivio dei temi WordPress curati: voce scelta piena (colori dei
   pulsanti dello Stile, --etwp-pul*), numero di articoli in piccolo; filtro attivo con x. */
.etwp-arch { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 8px 0; font-family: var(--etwp-font); }
.etwp-arch-titolo { font-size: 12px; font-weight: bold; text-transform: uppercase; letter-spacing: 1.2px; color: var(--etwp-titoli); margin-right: 4px; }
.etwp-arch a.etwp-arch-voce { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border: 1px solid var(--etwp-bordo, #e3e7ec); border-radius: var(--etwp-pul-raggio, 30px); background: var(--etwp-sfondo-card, #fff); color: var(--etwp-testo); font-size: 14px; line-height: 1.2; text-decoration: none; transition: border-color .2s, color .2s, background .2s; }
.etwp-arch a.etwp-arch-voce span { font-size: 11px; min-width: 18px; padding: 2px 6px; border-radius: 10px; background: rgba(0, 0, 0, .06); text-align: center; }
.etwp-arch a.etwp-arch-voce:hover { border-color: var(--etwp-pul, var(--etwp-accento)); color: var(--etwp-pul, var(--etwp-accento)); }
.etwp-arch a.etwp-arch-voce.on { background: var(--etwp-pul, var(--etwp-titoli)); border-color: var(--etwp-pul, var(--etwp-titoli)); color: var(--etwp-pul-testo, #fff); }
.etwp-arch a.etwp-arch-voce.on span { background: rgba(255, 255, 255, .25); }
.etwp-arch-mesi a.etwp-arch-voce { padding: 5px 12px; font-size: 13px; }
.etwp-arch-filtro { display: flex; justify-content: center; margin: 4px 0 18px; font-family: var(--etwp-font); }
.etwp-arch-filtro > span { display: inline-flex; align-items: center; padding: 8px 8px 8px 16px; border-radius: 30px 0 0 30px; background: rgba(224, 123, 0, .1); color: var(--etwp-titoli); font-size: 15px; font-weight: bold; }
.etwp-arch-filtro em { font-style: normal; font-weight: normal; opacity: .7; margin-left: 4px; }
.etwp-arch-filtro > a { display: inline-flex; align-items: center; padding: 0 14px; border-radius: 0 30px 30px 0; background: rgba(224, 123, 0, .1); color: var(--etwp-titoli) !important; font: 26px/1 Arial, sans-serif; text-decoration: none !important; }
.etwp-arch-filtro > a:hover { background: var(--etwp-accento); color: #fff !important; }
@media screen and (max-width: 639px) {
	.etwp-arch { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; padding-bottom: 4px; -webkit-overflow-scrolling: touch; }
	.etwp-arch a.etwp-arch-voce, .etwp-arch-titolo { flex: 0 0 auto; }
}

/* --- Fase 39: Elenco testi in modalita' lista (plugin pagina-servizi) ---
   Foto a sinistra; a destra titolo in alto, porzione di testo e "Leggi" in fondo. Nella griglia
   comune (card per riga 1-4); su smartphone compatta (Fase 50). */
.etwp-griglia > .etwp-col.etwp-lista-card { flex-direction: row; align-items: stretch; }
.etwp-lista-foto { flex: 0 0 40%; max-width: 280px; display: block; }
.etwp-lista-foto img { width: 100%; height: 100%; min-height: 170px; object-fit: cover; display: block; }
.etwp-lista-testo { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; padding: 18px 20px; font-family: var(--etwp-font); }
.etwp-lista-titolo { color: var(--etwp-titoli) !important; font-family: var(--etwp-font-titoli); font-size: var(--el-t, 19px); font-weight: bold; line-height: 1.25; text-decoration: none !important; }
.etwp-lista-titolo:hover { color: var(--etwp-accento) !important; }
.etwp-lista-descr { font-size: var(--el-d, 14px); line-height: 1.55; color: var(--etwp-testo); margin: 8px 0 12px; }
.etwp-lista-leggi { margin-top: auto; align-self: flex-start; color: var(--etwp-accento) !important; font-weight: bold; font-size: var(--el-d, 14px); text-decoration: none !important; }
/* Fase 39: una griglia impostata a 1 per riga resta a 1 anche su tablet (prima diventava 2) */
@media screen and (min-width: 640px) and (max-width: 1024px) {
	.etwp-griglia[style*="--etwp-colonne:1;"] { grid-template-columns: minmax(0, 1fr); }
}
/* Fase 39: lista uguale in tutte le pagine e con 1-4 per riga: titolo al massimo 3 righe e
   testo al massimo 4 (poi "..."), cosi' le card restano basse e la foto non si allunga */
.etwp-lista-titolo, .etwp-lista-descr { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.etwp-lista-titolo { -webkit-line-clamp: 3; line-clamp: 3; }
.etwp-lista-descr { -webkit-line-clamp: 4; line-clamp: 4; }

/* --- Fase 40: slider prodotti (plugin prodotti-slider) ---
   Fila di card del negozio (.etwp-pr-*) ripetuta due volte che scorre da destra a sinistra
   (sposta di meta' e ricomincia senza salti); bordi sfumati, pausa col mouse sopra; con
   "meno animazioni" niente movimento: si scorre a mano e la copia e' nascosta. */
.etwp-psl-titolo { text-align: center; font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 22px; font-weight: bold; color: var(--etwp-titoli); margin: 6px 0 16px; }
.etwp-psl { overflow: hidden; padding: 6px 0 14px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.etwp-psl-fila { display: flex; width: max-content; animation: etwp-psl-scorri var(--ps-durata, 90s) linear infinite; }
.etwp-psl:hover .etwp-psl-fila { animation-play-state: paused; }
@keyframes etwp-psl-scorri { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.etwp-psl .etwp-psl-card { flex: 0 0 var(--ps-card, 220px); width: var(--ps-card, 220px); margin-right: 20px; padding: 10px 10px 12px; box-sizing: border-box; border: 1px solid var(--etwp-bordo, #eee); box-shadow: 0 2px 10px rgba(0, 0, 0, .06); display: flex; flex-direction: column; transition: transform .25s ease, box-shadow .25s ease; }
.etwp-psl .etwp-psl-card:hover { transform: translateY(-4px); box-shadow: 0 10px 22px rgba(0, 0, 0, .12); }
.etwp-psl .etwp-pr-corpo { padding: 12px 2px 0; }
@media (prefers-reduced-motion: reduce) {
	.etwp-psl { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
	.etwp-psl-fila { animation: none; }
	.etwp-psl .etwp-psl-card[aria-hidden="true"] { display: none; }
}
@media screen and (max-width: 639px) { .etwp-psl .etwp-psl-card { flex-basis: 170px; width: 170px; margin-right: 14px; } }

/* --- Fase 42: Blocco HTML da file (plugin blocco-html) ---
   Link "Modifica testo" e avvisi visibili solo a chi e' collegato al builder o ai contenuti. "Modifica testo" in alto
   a sinistra (a destra c'e' la barra del builder visuale); blocco vuoto: pulsante "Scrivi il testo". */
.etwp-bh { position: relative; }
.etwp-bh-modifica { position: absolute; top: 0; left: 0; z-index: 5; background: var(--etwp-accento); color: #fff !important; font: bold 12px var(--etwp-font); padding: 5px 10px; border-radius: 0 0 8px 0; text-decoration: none !important; opacity: .85; }
.etwp-bh-modifica:hover { opacity: 1; }
.etwp-bh-vuoto { padding: 16px; border: 2px dashed var(--etwp-bordo, #ddd); border-radius: 8px; color: var(--etwp-testo); font: 14px var(--etwp-font); text-align: center; }
.etwp-bh-scrivi { display: inline-block; margin-top: 10px; background: var(--etwp-accento); color: #fff !important; font: bold 14px var(--etwp-font); padding: 9px 18px; border-radius: 6px; text-decoration: none !important; }
.etwp-bh-scrivi:hover { filter: brightness(1.08); }

/* --- Fase 50: Elenco testi compatto su smartphone (plugin pagina-servizi) ---
   Lista sempre, card con l'impostazione "compatto": foto quadrata 110 px a sinistra, a destra
   titolo (max 3 righe) e testo (max 3 righe), caratteri ridotti in proporzione (--el-t, --el-d),
   niente "Leggi": tutta la riga e' cliccabile (il titolo si allarga su tutta la card). */
@media screen and (max-width: 639px) {
	.etwp-griglia > .etwp-col.etwp-lista-card, .etwp-griglia > .etwp-col.etwp-el-compatto { flex-direction: row !important; align-items: stretch; position: relative; }
	.etwp-lista-card .etwp-lista-foto, .etwp-el-compatto .etwp-el-foto { flex: 0 0 110px; width: 110px; max-width: 110px; }
	.etwp-lista-card .etwp-lista-foto img, .etwp-el-compatto .etwp-el-foto img { width: 110px !important; height: 100% !important; min-height: 110px; object-fit: cover; }
	.etwp-lista-card .etwp-lista-testo, .etwp-el-compatto .etwp-el-corpo { padding: 10px 12px !important; min-width: 0; }
	.etwp-lista-card .etwp-lista-titolo, .etwp-el-compatto .etwp-el-titolo { font-size: calc(var(--el-t, 19px) * .82) !important; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
	.etwp-lista-card .etwp-lista-titolo::after, .etwp-el-compatto .etwp-el-titolo::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
	.etwp-lista-card .etwp-lista-descr, .etwp-el-compatto .etwp-el-descr { flex: none !important; font-size: calc(var(--el-d, 14px) * .93) !important; line-height: 1.45 !important; margin: 4px 0 0 !important; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
	.etwp-lista-card .etwp-lista-leggi, .etwp-el-compatto .etwp-el-leggi { display: none !important; }
	.etwp-griglia:has(> .etwp-lista-card), .etwp-griglia:has(> .etwp-el-compatto) { gap: 12px; }
}

/* --- Fase 52: immagini dei testi scritti con l'eTech Editor, responsive senza media query ---
   Solo le immagini dimensionate nell'editor (width in % o px) dentro testi, articoli, Blocchi HTML,
   HTML libero, sezioni e scheda prodotto. Spazio piu' stretto di 600 px (telefono, colonna stretta):
   (600px - 100%) * 999 e' enorme e clamp lo ferma al 100% -> immagine a tutta larghezza. Spazio
   piu' largo: il conto e' negativo, clamp da' 0 e resta la larghezza data nell'editor.
   max-width: 100% = mai fuori dal suo spazio; height: auto = proporzioni giuste.
   Immagini affiancate al testo (float): il margine verso il testo (16 px) va a 0 nello spazio stretto. */
/* tutte le immagini dei testi (anche senza dimensione): mai fuori dal loro spazio, senza ingrandirle */
:is(.etwp-corpo, .etwp-articolo-testo, .etwp-html, .etwp-sezione, .etwp-testo, .etwp-ps-testo) img { max-width: 100%; height: auto; }
:is(.etwp-corpo, .etwp-articolo-testo, .etwp-html, .etwp-sezione, .etwp-testo, .etwp-ps-testo) img:is([width], [style*="width"]) {
	max-width: 100%;
	height: auto !important;
	min-width: clamp(0px, (600px - 100%) * 999, 100%);
	box-sizing: border-box;
}
:is(.etwp-corpo, .etwp-articolo-testo, .etwp-html, .etwp-sezione, .etwp-testo, .etwp-ps-testo) img[style*="float: left"] { margin-right: clamp(0px, (100% - 600px) * 999, 16px) !important; }
:is(.etwp-corpo, .etwp-articolo-testo, .etwp-html, .etwp-sezione, .etwp-testo, .etwp-ps-testo) img[style*="float: right"] { margin-left: clamp(0px, (100% - 600px) * 999, 16px) !important; }

/* --- Fase 53: icone social quadrate in alto a destra (plugin intestazione) ---
   Quadrati con angoli arrotondati (lato --soc-lato), icona bianca su fondo pieno, ombra leggera,
   al passaggio si alzano. Colori: marchi (Facebook, Instagram, LinkedIn, Telegram), tema (colore
   dei titoli; al passaggio l'accento) o scuro. La busta porta ai Contatti. */
.etwp-social { display: flex; justify-content: flex-end; align-items: center; gap: 8px; flex-wrap: nowrap; }
.etwp-social a { display: inline-flex; align-items: center; justify-content: center; width: var(--soc-lato, 34px); height: var(--soc-lato, 34px); border-radius: calc(var(--soc-lato, 34px) * .22); color: #fff !important; font-size: calc(var(--soc-lato, 34px) * .52); text-decoration: none !important; box-shadow: 0 2px 6px rgba(0, 0, 0, .15); transition: transform .2s ease, box-shadow .2s ease, filter .2s ease; }
.etwp-social a:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0, 0, 0, .22); filter: brightness(1.08); }
.etwp-social a i { line-height: 1; }
.etwp-social-marchi .s-facebook { background: #1877f2; }
.etwp-social-marchi .s-instagram { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.etwp-social-marchi .s-linkedin { background: #0a66c2; }
.etwp-social-marchi .s-telegram { background: #229ed9; }
.etwp-social-marchi .s-email { background: var(--etwp-accento, #e07b00); }
.etwp-social-tema a { background: var(--etwp-titoli, #000); }
.etwp-social-tema a:hover { background: var(--etwp-accento, #e07b00); }
.etwp-social-scuro a { background: #222; }
@media (prefers-reduced-motion: reduce) { .etwp-social a:hover { transform: none; } }
/* con il pulsante accessibilita' (fisso in alto a destra, 50 px a 20 px dal bordo) le icone gli stanno a sinistra;
   su smartphone il pulsante e' in basso (Fase 27) e il margine non serve */
@media screen and (min-width: 600px) { body:has(#a11y-button) .etwp-social { padding-right: 72px; box-sizing: border-box; } }
@media screen and (max-width: 599px) { .etwp-social { padding-right: 8px; box-sizing: border-box; } }

/* --- Fase 54: componenti per i testi (eTech Editor): In breve, elenco con spunte, passi, CTA, FAQ ---
   Si usano scrivendo le classi nell'HTML del testo; colori dal tema (--etwp-accento, --etwp-titoli).
   .etwp-inbreve     riassunto in apertura (lo leggono per primi motori di ricerca e AI)
   .etwp-lista-check elenco con spunte
   .etwp-passi       elenco numerato a passi
   .etwp-cta         riquadro con invito e pulsante (.etwp-cta-titolo, .etwp-cta-btn); .etwp-cta-forte = pieno
   .etwp-faq         domande (h3) e risposte (p): a fisarmonica con core/etwp.js, dati FAQPage nel plugin */
.etwp-inbreve { background: rgba(224, 123, 0, .08); border-left: 4px solid var(--etwp-accento); border-radius: 0 var(--etwp-raggio, 8px) var(--etwp-raggio, 8px) 0; padding: 14px 18px; margin: 0 0 1.2em; font-size: 1.05em; line-height: 1.55; }
.etwp-lista-check { list-style: none; padding: 0; margin: .6em 0 1.2em; }
.etwp-lista-check li { position: relative; padding: 6px 0 6px 32px; }
.etwp-lista-check li:before { content: "\2713"; position: absolute; left: 0; top: 6px; width: 22px; height: 22px; border-radius: 50%; background: var(--etwp-accento); color: #fff; font-size: 13px; font-weight: bold; line-height: 22px; text-align: center; }
.etwp-passi { list-style: none; counter-reset: passo; padding: 0; margin: .6em 0 1.2em; }
.etwp-passi li { counter-increment: passo; position: relative; padding: 4px 0 14px 48px; }
.etwp-passi li:before { content: counter(passo); position: absolute; left: 0; top: 0; width: 34px; height: 34px; border-radius: 50%; border: 2px solid var(--etwp-accento); color: var(--etwp-accento); font-weight: bold; line-height: 30px; text-align: center; box-sizing: border-box; }
.etwp-cta { background: var(--etwp-sfondo-card, #fff); border: 1px solid var(--etwp-bordo, #e3e7ec); border-left: 5px solid var(--etwp-accento); border-radius: var(--etwp-raggio, 8px); box-shadow: 0 4px 14px rgba(0, 0, 0, .06); padding: 18px 22px; margin: 1.4em 0; }
.etwp-cta p { margin: 0 0 .5em; }
.etwp-cta .etwp-cta-titolo { font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 1.25em; font-weight: bold; color: var(--etwp-titoli); }
.etwp-cta a.etwp-cta-btn { display: inline-block; margin-top: 4px; background: var(--etwp-pul, var(--etwp-accento)); color: var(--etwp-pul-testo, #fff) !important; text-decoration: none !important; font-weight: bold; padding: 11px 22px; border-radius: var(--etwp-pul-raggio, 6px); box-shadow: 0 3px 10px rgba(0, 0, 0, .15); transition: transform .2s; }
.etwp-cta a.etwp-cta-btn:hover { transform: translateY(-2px); }
.etwp-cta-forte { background: var(--etwp-titoli, #17324d); border: 0; color: #fff; text-align: center; }
.etwp-cta-forte .etwp-cta-titolo, .etwp-cta-forte a:not(.etwp-cta-btn) { color: #fff !important; }
.etwp-faq { margin: .6em 0 1.4em; border-top: 1px solid var(--etwp-bordo, #e3e7ec); }
.etwp-faq h3 { margin: 0; padding: 14px 40px 14px 0; font-size: 1.05em; line-height: 1.35; color: var(--etwp-titoli); border-bottom: 1px solid var(--etwp-bordo, #e3e7ec); position: relative; }
.etwp-faq .etwp-faq-r { padding: 4px 0 10px; }
.etwp-faq.etwp-faq-attiva h3 { cursor: pointer; }
.etwp-faq.etwp-faq-attiva h3:after { content: "+"; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; border-radius: 50%; background: rgba(224, 123, 0, .12); color: var(--etwp-accento); font-weight: bold; line-height: 26px; text-align: center; }
.etwp-faq.etwp-faq-attiva h3.aperta:after { content: "\2212"; }
.etwp-faq.etwp-faq-attiva .etwp-faq-r { display: none; border-bottom: 1px solid var(--etwp-bordo, #e3e7ec); }
.etwp-faq.etwp-faq-attiva h3.aperta + .etwp-faq-r { display: block; }
/* Fase 54: spazi regolari nei testi del gestionale (pagina-testo), come negli articoli (Fase 32) */
.etwp-testo .etwp-corpo p { margin: 0 0 .8em; }
.etwp-testo .etwp-corpo h2 { margin: 1.5em 0 .5em; line-height: 1.25; font-size: 1.45em; color: var(--etwp-titoli); }
.etwp-testo .etwp-corpo h3 { margin: 1.2em 0 .4em; line-height: 1.3; }
.etwp-testo .etwp-corpo .etwp-faq h3 { margin: 0; }
.etwp-testo .etwp-corpo > :first-child { margin-top: 0; }

/* --- Fase 56: Elenco articoli compatto su smartphone (card degli articoli, EtechPlugin.CardNews) ---
   Con "Card su smartphone" = compatto: foto quadrata 110 px a sinistra, a destra titolo (max 3
   righe), data e riassunto (max 2 righe), caratteri ridotti in proporzione (--cn-t, --cn-d),
   tutta la riga cliccabile (il titolo si allarga sulla card). */
@media screen and (max-width: 639px) {
	.etwp-griglia > .etwp-col.etwp-cn-compatto { flex-direction: row !important; align-items: stretch; position: relative; }
	.etwp-cn-compatto .etwp-cn-foto { flex: 0 0 110px; width: 110px; min-height: 110px; height: auto !important; }
	.etwp-cn-compatto .etwp-cn-foto img { width: 110px !important; height: 100% !important; min-height: 110px; object-fit: cover; }
	.etwp-cn-compatto .etwp-cn-corpo { flex: 1 1 auto; min-width: 0; padding: 10px 12px !important; }
	.etwp-cn-compatto .etwp-cn-titolo { font-size: calc(var(--cn-t, 15px) * .9) !important; line-height: 1.3; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
	.etwp-cn-compatto .etwp-cn-titolo::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
	.etwp-cn-compatto .etwp-cn-descr { font-size: calc(var(--cn-d, 12px) * .95) !important; line-height: 1.45; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
	.etwp-griglia:has(> .etwp-cn-compatto) { gap: 12px; }
}

/* --- Fase 58: plugin Offerte (offerte-prodotti) ---
   Griglia: foto su fondo chiaro, fascia con badge "N% di sconto" (accento) e "Scade: ...",
   prezzo "Anziche'" e nome. Top sconti: riquadro con intestazione piena (accento), righe con foto
   a sinistra, nome, sconto grande, prezzi e descrizione. */
.etwp-of-titolo { text-align: center; font-family: var(--etwp-font-titoli, var(--etwp-font)); font-size: 26px; color: var(--etwp-accento); margin: 6px 0 16px; }
.etwp-of-card { background: var(--etwp-sfondo-card, #fff); border: 1px solid var(--etwp-bordo, #e3e7ec); border-radius: var(--etwp-raggio, 8px); overflow: hidden; text-align: center; }
.etwp-of-foto { display: block; aspect-ratio: 1 / 1; background: #fff; overflow: hidden; }
.etwp-of-foto img { width: 100%; height: 100%; object-fit: contain; padding: 6%; box-sizing: border-box; display: block; transition: transform .4s ease; }
.etwp-of-card:hover .etwp-of-foto img { transform: scale(1.05); }
.etwp-of-fascia { display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; padding: 8px 8px; background: rgba(0, 0, 0, .035); font-family: var(--etwp-font); }
.etwp-of-badge { background: var(--etwp-accento); color: #fff; font-size: 13px; padding: 3px 8px; border-radius: 3px; }
.etwp-of-scade { font-size: 14px; font-style: italic; color: var(--etwp-titoli); }
.etwp-of-corpo { padding: 10px 12px 16px; font-family: var(--etwp-font); display: flex; flex-direction: column; gap: 4px; flex: 1; }
.etwp-of-prezzi { font-size: 16px; color: var(--etwp-titoli); }
.etwp-of-prezzi strong, .etwp-of-riga-prezzi strong { color: var(--etwp-accento); }
.etwp-of-prezzi s, .etwp-of-riga-prezzi s { opacity: .65; }
.etwp-of-nome { color: var(--etwp-testo) !important; font-size: 14px; line-height: 1.35; text-decoration: none !important; }
.etwp-of-nome:hover { color: var(--etwp-accento) !important; }
.etwp-of-top { font-family: var(--etwp-font); }
.etwp-of-top-testa { border: 2px solid var(--etwp-accento); border-radius: var(--etwp-raggio, 8px) var(--etwp-raggio, 8px) 0 0; overflow: hidden; text-align: center; margin-bottom: 12px; }
.etwp-of-top-titolo { background: var(--etwp-accento); color: #fff; font-size: 34px; font-weight: bold; letter-spacing: 1px; padding: 8px 10px; line-height: 1.1; }
.etwp-of-top-sotto { background: #fff; color: var(--etwp-titoli); font-size: 20px; padding: 8px 10px; }
.etwp-of-riga { display: flex; gap: 12px; align-items: stretch; background: var(--etwp-sfondo-card, #fff); border: 1px solid var(--etwp-bordo, #e3e7ec); border-radius: var(--etwp-raggio, 8px); box-shadow: 0 3px 10px rgba(0, 0, 0, .07); overflow: hidden; margin-bottom: 12px; position: relative; }
.etwp-of-riga-foto { flex: 0 0 110px; width: 110px; background: #fff; }
.etwp-of-riga-foto img { width: 110px; height: 100%; min-height: 110px; object-fit: contain; padding: 6px; box-sizing: border-box; display: block; }
.etwp-of-riga-dati { flex: 1; min-width: 0; padding: 10px 10px 10px 0; display: flex; flex-direction: column; gap: 5px; }
.etwp-of-riga .etwp-of-nome { font-weight: bold; color: var(--etwp-titoli) !important; }
.etwp-of-riga .etwp-of-nome::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.etwp-of-grande { background: var(--etwp-accento); color: #fff; font-size: 20px; font-weight: bold; text-align: center; padding: 4px 6px; border-radius: 3px; }
.etwp-of-riga-prezzi { font-size: 13px; color: var(--etwp-testo); }
.etwp-of-riga-testo { font-size: 12px; line-height: 1.4; color: var(--etwp-testo); opacity: .85; }
.etwp-of-vuoto { padding: 16px; border: 2px dashed var(--etwp-bordo, #ddd); border-radius: 8px; color: var(--etwp-testo); font: 14px var(--etwp-font); text-align: center; }
/* Fase 58: offerte su smartphone a 2 colonne, come l'elenco dei prodotti */
@media screen and (max-width: 639px) {
	.etwp-griglia:has(> .etwp-of-card) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.etwp-of-fascia { padding: 6px 4px; }
	.etwp-of-badge { font-size: 11px; padding: 2px 6px; }
	.etwp-of-scade { font-size: 11px; }
	.etwp-of-prezzi { font-size: 13px; }
	.etwp-of-nome { font-size: 12px; }
	.etwp-of-corpo { padding: 8px 8px 12px; }
	.etwp-of-top-titolo { font-size: 28px; }
}

/* Fase 59 (2026-10-17): plugin Menu, stili classico / pillole / mega / laterale.
   Base = voci in colonna (pannello laterale sempre, gli altri sotto i 768px con il pulsante Menu);
   da 768px in su classico, pillole e mega diventano orizzontali con le tendine. */
.etwp-mn { position:relative; display:flex; flex-direction:column; font-family:var(--etwp-font); }
.etwp-mn ul { list-style:none; margin:0; padding:0; }
.etwp-mn a { color:var(--mn-colore); text-decoration:none; transition:color .2s, background .2s, border-color .2s, padding .2s; }
.etwp-mn-apri { align-self:var(--mn-allinea); display:inline-flex; width:auto; height:auto; margin:0; align-items:center; gap:8px; border:0; cursor:pointer; background:var(--etwp-accento); color:#fff; font:600 15px var(--etwp-font); padding:10px 18px; border-radius:var(--etwp-pul-raggio, 6px); }
.etwp-mn-apri .fa { font-size:17px; }
.etwp-mn-voci { display:none; flex-direction:column; margin-top:8px !important; background:#fff; border:1px solid #eee; border-radius:8px; overflow:hidden; }
.etwp-mn-aperto > .etwp-mn-voci, .etwp-mn-laterale .etwp-mn-voci { display:flex; }
.etwp-mn-voci > li { display:flex; flex-wrap:wrap; border-bottom:1px solid #eee; }
.etwp-mn-voci > li:last-child { border-bottom:0; }
.etwp-mn-voci > li > a { flex:1; padding:13px 20px; font-weight:600; font-size:15px; border-left:4px solid transparent; }
.etwp-mn-voci > li.etwp-mn-attiva > a { color:var(--etwp-accento); border-left-color:var(--etwp-accento); }
.etwp-mn-fr { width:48px; height:auto; margin:0; padding:0; border:0; border-left:1px solid #eee; background:none; cursor:pointer; color:var(--mn-colore); font-size:18px; }
.etwp-mn-fr .fa { transition:transform .2s; }
.etwp-mn-su > .etwp-mn-fr .fa { transform:rotate(180deg); }
.etwp-mn-sotto { display:none; width:100%; background:#fafafa; padding:4px 0 8px !important; }
.etwp-mn-su > .etwp-mn-sotto { display:block; }
.etwp-mn-sotto a { display:block; padding:9px 20px 9px 36px; font-size:14px; }
.etwp-mn-sotto a:hover, .etwp-mn-voci > li > a:hover { color:var(--etwp-accento); }
.etwp-mn-mega-titolo { display:none; }
/* laterale: pannello che entra da destra, anche su computer */
.etwp-mn-velo { position:fixed; inset:0; background:rgba(0,0,0,.45); opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s; z-index:9998; }
.etwp-mn-pannello { position:fixed; top:0; right:0; bottom:0; width:min(340px, 86vw); background:#fff; box-shadow:-10px 0 30px rgba(0,0,0,.2); transform:translateX(105%); visibility:hidden; transition:transform .3s ease, visibility .3s; z-index:9999; overflow-y:auto; padding:64px 0 30px; box-sizing:border-box; }
.etwp-mn-laterale.etwp-mn-aperto .etwp-mn-velo { opacity:1; visibility:visible; }
.etwp-mn-laterale.etwp-mn-aperto .etwp-mn-pannello { transform:none; visibility:visible; }
.etwp-mn-laterale .etwp-mn-voci { margin:0 !important; border:0; border-top:1px solid #eee; border-radius:0; }
.etwp-mn-chiudi { position:absolute; top:14px; right:14px; width:38px; height:38px; border:0; border-radius:50%; background:#f2f2f2; color:#333; font-size:18px; cursor:pointer; }
.etwp-mn-chiudi:hover { background:var(--etwp-accento); color:#fff; }
@media (min-width:768px) {
	.etwp-mn-classico .etwp-mn-apri, .etwp-mn-pillole .etwp-mn-apri, .etwp-mn-mega .etwp-mn-apri, .etwp-mn-classico .etwp-mn-fr, .etwp-mn-pillole .etwp-mn-fr, .etwp-mn-mega .etwp-mn-fr { display:none; }
	.etwp-mn-classico .etwp-mn-voci, .etwp-mn-pillole .etwp-mn-voci, .etwp-mn-mega .etwp-mn-voci { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:var(--mn-allinea); align-items:center; margin:0 !important; background:none; border:0; border-radius:0; overflow:visible; }
	.etwp-mn-classico .etwp-mn-voci > li, .etwp-mn-pillole .etwp-mn-voci > li { position:relative; border:0; }
	.etwp-mn-mega .etwp-mn-voci > li { position:static; border:0; }
	/* tendina (classico e pillole) e pannello (mega) */
	.etwp-mn-classico .etwp-mn-sotto, .etwp-mn-pillole .etwp-mn-sotto, .etwp-mn-mega .etwp-mn-sotto { display:block; position:absolute; top:100%; left:0; width:auto; min-width:230px; background:#fff; padding:8px 0 !important; box-shadow:0 12px 30px rgba(0,0,0,.13); border-top:3px solid var(--etwp-accento); opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .2s, transform .2s, visibility .2s; z-index:200; }
	.etwp-mn-voci > li:hover > .etwp-mn-sotto, .etwp-mn-voci > li:focus-within > .etwp-mn-sotto { opacity:1; visibility:visible; transform:none; }
	.etwp-mn-classico .etwp-mn-sotto a, .etwp-mn-pillole .etwp-mn-sotto a { padding:9px 20px; white-space:nowrap; }
	.etwp-mn-classico .etwp-mn-sotto a:hover, .etwp-mn-pillole .etwp-mn-sotto a:hover { background:#f6f6f6; padding-left:25px; }
	.etwp-mn-classico .etwp-mn-figli > a::after, .etwp-mn-pillole .etwp-mn-figli > a::after, .etwp-mn-mega .etwp-mn-figli > a::after { content:""; display:inline-block; width:6px; height:6px; margin:0 0 3px 8px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); }
	/* classico */
	.etwp-mn-classico .etwp-mn-voci > li > a, .etwp-mn-mega .etwp-mn-voci > li > a { padding:14px 16px; font-size:15px; text-transform:uppercase; letter-spacing:.03em; border:0; border-bottom:3px solid transparent; }
	.etwp-mn-classico .etwp-mn-voci > li:hover > a, .etwp-mn-classico .etwp-mn-voci > li.etwp-mn-attiva > a,
	.etwp-mn-mega .etwp-mn-voci > li:hover > a, .etwp-mn-mega .etwp-mn-voci > li.etwp-mn-attiva > a { color:var(--etwp-accento); border-bottom-color:var(--etwp-accento); }
	/* pillole */
	.etwp-mn-pillole .etwp-mn-voci { gap:8px; padding:8px 0 !important; }
	.etwp-mn-pillole .etwp-mn-voci > li > a { padding:9px 20px; font-size:14px; border:1px solid #e3e3e3; border-radius:999px; background:#f5f5f5; }
	.etwp-mn-pillole .etwp-mn-voci > li:hover > a { border-color:var(--etwp-accento); color:var(--etwp-accento); background:#fff; }
	.etwp-mn-pillole .etwp-mn-voci > li.etwp-mn-attiva > a { background:var(--etwp-accento); border-color:var(--etwp-accento); color:#fff; }
	.etwp-mn-pillole .etwp-mn-sotto { border-radius:12px; border-top:0; margin-top:6px; }
	.etwp-mn-pillole .etwp-mn-sotto::before { content:""; position:absolute; left:0; right:0; top:-8px; height:8px; }
	/* mega: pannello largo quanto il menu, sottovoci in colonne */
	.etwp-mn-mega .etwp-mn-sotto { right:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(210px, 1fr)); gap:2px 24px; padding:22px 28px 24px !important; }
	.etwp-mn-mega .etwp-mn-mega-titolo { display:block; grid-column:1 / -1; font:700 19px var(--etwp-font-titoli); color:var(--etwp-titoli); padding-bottom:10px; margin-bottom:8px; border-bottom:1px solid #eee; }
	.etwp-mn-mega .etwp-mn-sotto a { padding:8px 10px 8px 22px; border-radius:6px; position:relative; }
	.etwp-mn-mega .etwp-mn-sotto a::before { content:"\203A"; position:absolute; left:9px; color:var(--etwp-accento); font-weight:bold; }
	.etwp-mn-mega .etwp-mn-sotto a:hover { background:#f6f6f6; }
}

/* Fase 60 (2026-10-17): Intestazione con "Stile del menu": il menu accanto al logo (laterale: a destra, vicino ai social), su smartphone sotto il logo sulla riga dei social */
.etwp-int-mn { float:left; padding:20px 0 0 10px; }
.etwp-int-mn-laterale { float:right; padding:26px 8px 0 14px; }
@media (max-width:767px) { .etwp-int-mn, .etwp-int-mn-laterale { padding:8px 12px; } }

/* Fase 61 (2026-10-18): plugin Fotogallery. --fg-col = foto per riga (su smartphone al massimo 2) */
.etwp-fg-titolo { font-family:var(--etwp-font-titoli); color:var(--etwp-titoli); margin:0 0 6px; }
.etwp-fg-testo { color:var(--etwp-testo); margin:0 0 16px; }
.etwp-fg-indietro { margin:0 0 10px; }
.etwp-fg-indietro a { color:var(--etwp-accento); text-decoration:none; }
.etwp-fg-vuota { padding:14px; border:1px dashed #bbb; color:#777; font-size:14px; }
.etwp-fg figure { margin:0; }
.etwp-fg a { display:block; overflow:hidden; border-radius:var(--etwp-raggio, 6px); cursor:zoom-in; }
.etwp-fg img { display:block; width:100%; transition:transform .3s; }
.etwp-fg a:hover img { transform:scale(1.05); }
.etwp-fg figcaption { font-size:13px; color:var(--etwp-testo); padding:6px 2px 0; }
/* griglia: foto quadrate */
.etwp-fg-griglia { display:grid; grid-template-columns:repeat(var(--fg-col), 1fr); gap:10px; }
.etwp-fg-griglia img { aspect-ratio:1 / 1; object-fit:cover; }
/* mosaico: foto intere, in colonne */
.etwp-fg-mosaico { column-count:var(--fg-col); column-gap:10px; }
.etwp-fg-mosaico .etwp-fg-voce { break-inside:avoid; margin-bottom:10px; }
/* carosello: striscia che scorre di lato, con le frecce */
.etwp-fg-carosello { position:relative; }
.etwp-fg-striscia { display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; }
.etwp-fg-striscia::-webkit-scrollbar { display:none; }
.etwp-fg-carosello .etwp-fg-voce { flex:0 0 calc((100% - (var(--fg-col) - 1) * 10px) / var(--fg-col)); scroll-snap-align:start; }
.etwp-fg-carosello img { aspect-ratio:4 / 3; object-fit:cover; }
.etwp-fg-freccia { position:absolute; top:40%; z-index:2; width:40px; height:40px; margin:0; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.9); box-shadow:0 2px 8px rgba(0,0,0,.25); color:#222; font-size:26px; line-height:38px; cursor:pointer; }
.etwp-fg-prec { left:6px; }
.etwp-fg-succ { right:6px; }
@media (max-width:600px) {
	.etwp-fg-griglia { grid-template-columns:repeat(min(var(--fg-col), 2), 1fr); }
	.etwp-fg-mosaico { column-count:2; }
	.etwp-fg-carosello .etwp-fg-voce { flex-basis:80%; }
}
/* elenco delle gallerie (card) */
.etwp-fg-card { display:block; text-decoration:none; background:var(--etwp-sfondo-card, #fff); border:1px solid #eee; border-radius:var(--etwp-raggio, 6px); overflow:hidden; }
.etwp-fg-card img { display:block; width:100%; aspect-ratio:4 / 3; object-fit:cover; }
.etwp-fg-card-nome { display:block; padding:10px 12px 2px; font:700 16px var(--etwp-font-titoli); color:var(--etwp-titoli); }
.etwp-fg-card-n { display:block; padding:0 12px 12px; font-size:13px; color:#777; }
/* foto a tutto schermo (creata da etwp.js) */
.etwp-fg-schermo { position:fixed; inset:0; z-index:10000; background:rgba(0,0,0,.92); display:flex; align-items:center; justify-content:center; flex-direction:column; }
.etwp-fg-schermo img { max-width:92vw; max-height:82vh; object-fit:contain; }
.etwp-fg-schermo p { color:#eee; font-size:15px; margin:12px 16px 0; text-align:center; }
.etwp-fg-schermo button { position:absolute; width:auto; height:auto; margin:0; border:0; background:none; color:#fff; font-size:46px; cursor:pointer; padding:10px 16px; }
.etwp-fg-schermo .fg-chiudi { top:6px; right:8px; font-size:36px; }
.etwp-fg-schermo .fg-prec { left:4px; top:45%; }
.etwp-fg-schermo .fg-succ { right:4px; top:45%; }
.etwp-fg-schermo .fg-conta { position:absolute; top:18px; left:20px; color:#bbb; font-size:14px; }

/* Fase 65 (2026-10-20): plugin breadcrumb (percorso). Freccia indietro tonda, livelli
   cliccabili, ultimo livello in grassetto; su smartphone i titoli lunghi si accorciano con ... */
.etwp-bc { display:flex; align-items:center; gap:10px; padding:10px 0; font-family:var(--etwp-font); font-size:14px; color:var(--etwp-testo); }
.etwp-bc-centro { justify-content:center; }
.etwp-bc-indietro { flex:none; display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border:1px solid var(--etwp-bordo, #ddd); border-radius:50%; color:var(--etwp-titoli); text-decoration:none; font-size:16px; transition:background .2s, color .2s, border-color .2s; }
.etwp-bc-indietro:hover { background:var(--etwp-accento); border-color:var(--etwp-accento); color:#fff; }
.etwp-bc ol { display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; list-style:none; margin:0; padding:0; min-width:0; }
.etwp-bc li { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:28ch; }
.etwp-bc li a { color:var(--etwp-accento); text-decoration:none; }
.etwp-bc li a:hover { text-decoration:underline; }
.etwp-bc li[aria-current] { font-weight:600; color:var(--etwp-titoli); }
.etwp-bc-sep { color:#999; }
@media (max-width:600px) { .etwp-bc { font-size:13px; } .etwp-bc li { max-width:18ch; } }
/* con il breadcrumb nella pagina le righe "Home -> ..." della scheda prodotto e dell'articolo non servono */
body:has(.etwp-bc) .etwp-ps-percorso, body:has(.etwp-bc) .etwp-an-percorso { display:none; }

/* Fase 67 (2026-10-20): sottocategorie della categoria aperta (plugin categorie-prodotti) */
.etwp-cp-voci a.etwp-cp-sotto { margin-left: 16px; padding: 6px 12px; font-size: 14px; }
.etwp-cp-voci a.etwp-cp-sotto span:before { content: "\21B3  "; opacity: .5; }
.etwp-cp-pillole .etwp-cp-voci a.etwp-cp-sotto { margin-left: 0; background: transparent; border: 1px solid rgba(0, 0, 0, .15); }
.etwp-cp-pillole .etwp-cp-voci a.etwp-cp-sotto span:before { content: none; }
@media (max-width: 767px) { .etwp-cp .etwp-cp-voci a.etwp-cp-sotto span:before { content: none; } .etwp-cp .etwp-cp-voci a.etwp-cp-sotto { margin-left: 0; background: transparent; border: 1px solid rgba(0, 0, 0, .15); } .etwp-cp .etwp-cp-voci a.etwp-cp-sotto.on { background: var(--etwp-pul, var(--etwp-titoli)); } }

/* Fase 69-70 (2026-10-24): plugin Vetrina offerte (offerte-vetrina): pillole delle categorie, card compatte, pagine */
.etwp-of-cat { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:0 0 18px; }
.etwp-of-cat a { padding:6px 12px; border:1px solid #bbb; border-radius:6px; background:#fff; color:var(--etwp-titoli); text-decoration:none; font-size:13px; font-weight:600; text-transform:uppercase; }
.etwp-of-cat a small { opacity:.6; font-weight:normal; }
.etwp-of-cat a:hover, .etwp-of-cat a.on { border-color:var(--etwp-accento); background:var(--etwp-accento); color:#fff; }
.etwp-of-vetrina { --of-prezzo:#d4f7a9; gap:14px; }
.etwp-of-vt { position:relative; display:flex; flex-direction:column; background:var(--etwp-sfondo-card, #fff); border:1px solid #d5d5d5; border-radius:6px; overflow:hidden; transition:box-shadow .2s; }
.etwp-of-vt:hover { box-shadow:0 6px 18px rgba(0,0,0,.12); }
.etwp-of-vt-foto { display:block; aspect-ratio:4 / 3; background:#fff; }
.etwp-of-vt-foto img { width:100%; height:100%; object-fit:contain; padding:8%; box-sizing:border-box; display:block; }
.etwp-of-vt-sconto { position:absolute; top:8px; left:8px; background:var(--etwp-accento); color:#fff; font-size:12px; font-weight:bold; padding:2px 7px; border-radius:20px; }
.etwp-of-vt-nome { flex:1; padding:6px 10px; font-size:12px; font-weight:600; line-height:1.35; text-transform:uppercase; color:var(--etwp-titoli) !important; text-decoration:none !important; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.etwp-of-vt-fino { padding:0 10px 4px; font-size:11px; font-style:italic; color:#777; }
.etwp-of-vt-prezzo { margin:0 8px 8px; padding:4px 6px; border-radius:4px; background:var(--of-prezzo); text-align:center; color:#111; }
.etwp-of-vt-prezzo s { font-size:12px; color:#666; margin-right:4px; }
.etwp-of-vt-prezzo strong { font-size:16px; }
@media (max-width:600px) { .etwp-griglia.etwp-of-vetrina { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; } .etwp-of-vt-nome { font-size:11px; padding:6px 8px; } .etwp-of-vt-prezzo strong { font-size:14px; } }