/*
 * Stile del modulo per faccette, preso dal mockup della home V4 (home-dovevado.html, p19,
 * sorgenti/moduli-style.css). I colori e i font vengono dalle variabili del kit V4
 * (--dv-…) con il valore del logo come ripiego; la geometria è quella del mockup.
 * Classi con prefisso dv-fac__ (vedi includes/shortcode-faccette.php). Ogni regola è scritta
 * come `.dv-fac .dv-fac__…`: il kit di Elementor stila `h2`, `h3` e `a` con `.elementor-kit-ID h2`
 * (0,1,1), che batterebbe una classe sola (visto sul Travel Blog il 05-10-2026: titolo a 48px grigio).
 */
.dv-fac {
	--fac-ink: var(--dv-blu-notte, #002336);
	--fac-ink-2: var(--dv-blu-notte-2, #0b3247);
	--fac-ink-soft: var(--dv-testo-tenue, #44596a);
	--fac-testo: var(--dv-testo, #1f2f3a);
	--fac-rust: var(--dv-ruggine, #a04d1c);
	--fac-lime: var(--dv-lime, #b6bf0e);
	--fac-paper: var(--dv-bianco, #ffffff);
	--fac-cream: var(--dv-carta, #f6f5ee);
	--fac-line: var(--dv-filo, #e4e2d6);
	--fac-radius: var(--dv-raggio, 12px);
	--fac-tap: var(--dv-tocco, 44px);
	--fac-font: var(--dv-font-testo, "Figtree", system-ui, sans-serif);
	--fac-display: var(--dv-font-titoli, "Bricolage Grotesque", "Figtree", sans-serif);
	color: var(--fac-testo);
	font-family: var(--fac-font);
	font-size: 17px;
	line-height: 1.55;
	max-width: 1200px;
	margin: 0 auto;
}
.dv-fac *, .dv-fac *::before, .dv-fac *::after { box-sizing: border-box; }
.dv-fac :focus-visible { outline: 2px solid var(--fac-ink); outline-offset: 3px; border-radius: 4px; }
.dv-fac [hidden] { display: none !important; }
.dv-fac .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* dentro «V4 Archivio» il modulo sta sopra «Tutti gli articoli»: respiro e filetto sotto */
.dv-fac.dv-fac--a { padding-bottom: 40px; margin-bottom: 48px; border-bottom: 1px solid var(--fac-line); }

/* testa */
.dv-fac .dv-fac__testa { margin: 0 0 24px; }
.dv-fac .dv-fac__titolo { font: 700 32px/1.12 var(--fac-display); letter-spacing: -.01em; margin: 0; color: var(--fac-ink); font-style: normal; }
.dv-fac .dv-fac__testa p { margin: 6px 0 0; color: var(--fac-ink-soft); max-width: 62ch; font-size: 17px; }

/* griglia: colonna delle faccette a sinistra, risultati a destra */
.dv-fac .dv-fac__griglia { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 36px; align-items: start; }

/* le faccette: una fisarmonica per gruppo */
.dv-fac .dv-fac__gruppo { border-top: 1px solid var(--fac-line); padding: 4px 0 12px; }
.dv-fac .dv-fac__gruppo:last-child { border-bottom: 1px solid var(--fac-line); }
.dv-fac .dv-fac__gruppo summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: var(--fac-tap); font: 700 17px/1.2 var(--fac-display); color: var(--fac-ink); }
.dv-fac .dv-fac__gruppo summary::-webkit-details-marker { display: none; }
.dv-fac .dv-fac__gruppo summary::after { content: ""; width: 8px; height: 8px; border-right: 1.6px solid var(--fac-ink); border-bottom: 1.6px solid var(--fac-ink); transform: rotate(45deg); margin: 0 4px 0 auto; transition: transform .15s; flex: none; }
.dv-fac .dv-fac__gruppo[open] summary::after { transform: rotate(-135deg); }
.dv-fac .dv-fac__scelte { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--fac-ink); color: #fff; font: 700 12px/1 var(--fac-font); }
.dv-fac .dv-fac__voci { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 4px; }

/* le voci (pillole), i filtri applicati */
.dv-fac .dv-fac__voce, .dv-fac .dv-fac__applicati > * { position: relative; -webkit-appearance: none; appearance: none; display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 6px 12px; border-radius: 999px; border: 1.5px solid var(--fac-line); background: var(--fac-paper); font: 600 14px/1 var(--fac-font); color: var(--fac-ink); text-decoration: none; cursor: pointer; transition: border-color .12s, background .12s, color .12s; }
.dv-fac .dv-fac__voce:hover, .dv-fac .dv-fac__applicati > *:hover { border-color: var(--fac-ink); color: var(--fac-ink); }
.dv-fac .dv-fac__voce[aria-current], .dv-fac .dv-fac__voce[aria-pressed="true"], .dv-fac .dv-fac__voce:has(input:checked) { background: var(--fac-ink); color: #fff; border-color: var(--fac-ink); }
.dv-fac .dv-fac__voce[aria-current]:hover, .dv-fac .dv-fac__voce[aria-pressed="true"]:hover, .dv-fac .dv-fac__voce:has(input:checked):hover { background: var(--fac-ink-2); color: #fff; }
.dv-fac .dv-fac__n { font-size: 12px; color: var(--fac-ink-soft); font-weight: 600; }
.dv-fac .dv-fac__voce[aria-current] .dv-fac__n, .dv-fac .dv-fac__voce[aria-pressed="true"] .dv-fac__n, .dv-fac .dv-fac__voce:has(input:checked) .dv-fac__n { color: var(--fac-lime); }
.dv-fac .dv-fac__voce.is-vuota, .dv-fac .dv-fac__voce.is-tetto { opacity: .38; cursor: default; }
.dv-fac .dv-fac__voce.is-vuota:hover, .dv-fac .dv-fac__voce.is-tetto:hover { border-color: var(--fac-line); }
/* senza JavaScript la colonna e' un modulo GET: la casella sta sotto l'etichetta, invisibile ma raggiungibile */
.dv-fac .dv-fac__voce input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.dv-fac .dv-fac__voce:has(input:focus-visible) { outline: 2px solid var(--fac-ink); outline-offset: 3px; }
.dv-fac .dv-fac__applica { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: var(--fac-tap); margin: 14px 0 0; padding: 10px 18px; border-radius: 999px; border: 0; background: var(--fac-ink); color: #fff; font: 650 15px/1.2 var(--fac-font); cursor: pointer; }
.dv-fac .dv-fac__applica:hover { background: var(--fac-ink-2); color: #fff; }
.dv-fac.is-vivo .dv-fac__applica { display: none; }
.dv-fac .dv-fac__applicati { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.dv-fac .dv-fac__applicati:empty { display: none; }
.dv-fac .dv-fac__applicati > * { background: var(--fac-cream); border-color: var(--fac-cream); }
.dv-fac .dv-fac__applicati span { cursor: default; }

/* il conteggio e «Azzera» */
.dv-fac .dv-fac__conta { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin: 0 0 10px; font-size: 16px; color: var(--fac-ink-soft); }
.dv-fac .dv-fac__conta b { color: var(--fac-ink); font: 700 26px/1 var(--fac-display); }
.dv-fac .dv-fac__azzera { margin-left: auto; min-height: var(--fac-tap); display: inline-flex; align-items: center; padding: 0 6px; font: 600 14px var(--fac-font); color: var(--fac-rust); text-decoration: underline; text-underline-offset: 3px; }
.dv-fac .dv-fac__azzera:hover { color: var(--fac-ink); }

/* le schede dei risultati, come le schede V4 degli archivi */
.dv-fac .dv-fac__schede { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; margin: 0 0 24px; }
.dv-fac .dv-fac__scheda { display: flex; flex-direction: column; gap: 5px; text-decoration: none; color: var(--fac-ink); }
.dv-fac .dv-fac__scheda img, .dv-fac .dv-fac__foto-vuota { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--fac-radius); margin: 0 0 5px; background: var(--fac-cream); }
.dv-fac .dv-fac__k { font-size: 14px; font-weight: 650; color: var(--fac-rust); }
.dv-fac .dv-fac__t { font: 700 19px/1.25 var(--fac-display); margin: 0; color: var(--fac-ink); text-wrap: balance; font-style: normal; }
.dv-fac .dv-fac__scheda:hover .dv-fac__t { text-decoration: underline; text-decoration-color: var(--fac-rust); text-underline-offset: 3px; }

/* vuoto, «Mostra altri» */
.dv-fac .dv-fac__vuoto { margin: 0 0 16px; padding: 16px 18px; background: var(--fac-cream); border-radius: var(--fac-radius); font-size: 16px; line-height: 1.5; color: var(--fac-testo); }
.dv-fac .dv-fac__vuoto a { color: var(--fac-ink); text-decoration: underline; text-decoration-color: var(--fac-rust); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.dv-fac .dv-fac__altri { -webkit-appearance: none; appearance: none; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 22px; border-radius: 999px; border: 1.5px solid var(--fac-ink); color: var(--fac-ink); background: transparent; text-decoration: none; font: 650 16px/1.2 var(--fac-font); cursor: pointer; }
.dv-fac .dv-fac__altri:hover { background: var(--fac-ink); color: #fff; }

/* prova B: la frase (404 e ricerca). Nei template sta nella banda carta, sotto il campo di ricerca */
.dv-fac.dv-fac--b { margin-top: 44px; padding-top: 36px; border-top: 1px solid var(--dv-filo-scuro, #c9c6b4); }
.dv-fac.dv-fac--b .dv-fac__vuoto { background: var(--fac-paper); }
.dv-fac .dv-fac__frase { margin: 0; }
.dv-fac .dv-fac__frase-testo { font: 700 34px/1.4 var(--fac-display); letter-spacing: -.01em; color: var(--fac-ink); margin: 18px 0 22px; max-width: 30ch; text-wrap: balance; }
.dv-fac .dv-fac__parola { white-space: nowrap; }
.dv-fac .dv-fac__sel { display: inline-block; position: relative; max-width: 100%; vertical-align: baseline; }
.dv-fac .dv-fac__sel select { appearance: none; -webkit-appearance: none; border: 0; border-radius: 0; background: none; box-shadow: none; font: inherit; letter-spacing: inherit; color: var(--fac-rust); padding: 0 24px 2px 0; margin: 0; height: auto; line-height: inherit; border-bottom: 3px solid var(--fac-rust); cursor: pointer; max-width: 100%; }
.dv-fac .dv-fac__sel select:focus { outline: none; box-shadow: none; border-bottom-color: var(--fac-ink); }
.dv-fac .dv-fac__sel select:focus-visible { outline: 2px solid var(--fac-ink); outline-offset: 4px; border-radius: 4px; }
.dv-fac .dv-fac__sel::after { content: ""; position: absolute; right: 5px; top: 50%; width: 9px; height: 9px; border-right: 2.5px solid var(--fac-rust); border-bottom: 2.5px solid var(--fac-rust); transform: translateY(-75%) rotate(45deg); pointer-events: none; }
/* con JavaScript: la parola visibile è lo span, la tendina gli sta sopra trasparente */
.dv-fac .dv-fac__sel-testo { display: none; }
.dv-fac.is-vivo .dv-fac__sel-testo { display: inline-block; color: var(--fac-rust); padding: 0 24px 2px 0; border-bottom: 3px solid var(--fac-rust); white-space: nowrap; }
.dv-fac.is-vivo .dv-fac__sel select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; padding: 0; border: 0; }
.dv-fac.is-vivo .dv-fac__sel:focus-within { outline: 2px solid var(--fac-ink); outline-offset: 4px; border-radius: 4px; }
.dv-fac.is-vivo .dv-fac__sel:focus-within .dv-fac__sel-testo { border-bottom-color: var(--fac-ink); }
.dv-fac .dv-fac__cerca { display: inline-flex; align-items: center; min-height: var(--fac-tap); padding: 10px 20px; margin: 0 0 18px; border-radius: 999px; border: 0; background: var(--fac-ink); color: #fff; font: 650 15px/1.2 var(--fac-font); cursor: pointer; }
.dv-fac .dv-fac__cerca:hover { background: var(--fac-ink-2); color: #fff; }
.dv-fac .dv-fac__suggerimento { font-size: 16px; }
.dv-fac .dv-fac__schede--tre { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dv-fac .dv-fac__tutti { display: inline-flex; align-items: center; min-height: var(--fac-tap); font-weight: 650; font-size: 16px; color: var(--fac-ink); text-decoration: underline; text-decoration-color: var(--fac-rust); text-decoration-thickness: 2px; text-underline-offset: 5px; white-space: nowrap; }
.dv-fac .dv-fac__tutti::after { content: " →"; white-space: pre; text-decoration: none; }
.dv-fac .dv-fac__tutti:hover { color: var(--fac-rust); }
.dv-fac .dv-fac__idee { margin: 22px 0 0; font-size: 17px; color: var(--fac-ink-soft); }
.dv-fac .dv-fac__idee .dv-fac__tutti { margin-left: 4px; }

/* prova C: le porte (home) e le righe di pillole */
.dv-fac .dv-fac__porte { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin: 0 0 28px; }
.dv-fac .dv-fac__porta { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: var(--fac-radius); overflow: hidden; text-decoration: none; color: #fff; background: var(--fac-ink); }
.dv-fac .dv-fac__porta img { display: block; width: 100%; height: 100%; object-fit: cover; margin: 0; transition: transform .3s; }
.dv-fac .dv-fac__porta:hover img { transform: scale(1.04); }
.dv-fac .dv-fac__porta::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 35, 54, 0) 42%, rgba(0, 35, 54, .88)); }
.dv-fac .dv-fac__porta--vuota::after { background: linear-gradient(180deg, var(--fac-ink-2) 0%, var(--fac-ink) 100%); }
.dv-fac .dv-fac__porta-nome, .dv-fac .dv-fac__porta-n { position: absolute; left: 16px; right: 16px; z-index: 1; }
.dv-fac .dv-fac__porta-nome { bottom: 34px; font: 700 24px/1.1 var(--fac-display); color: #fff; }
.dv-fac .dv-fac__porta-n { bottom: 14px; font: 500 14px/1.2 var(--fac-font); color: var(--dv-su-scuro-tenue, #a9b6bd); }
.dv-fac .dv-fac__porta:hover .dv-fac__porta-nome { color: var(--fac-lime); }
.dv-fac .dv-fac__porta:focus-visible { outline-offset: 2px; }
.dv-fac .dv-fac__riga { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; align-items: start; padding: 14px 0; border-top: 1px solid var(--fac-line); }
.dv-fac .dv-fac__riga-titolo { font: 700 17px/1.3 var(--fac-display); margin: 7px 0 0; color: var(--fac-ink); font-style: normal; }
.dv-fac .dv-fac__pillole { display: flex; flex-wrap: wrap; gap: 8px; }
.dv-fac .dv-fac__pillole a { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 6px 12px; border-radius: 999px; border: 1.5px solid var(--fac-line); background: var(--fac-paper); font: 600 14px/1 var(--fac-font); color: var(--fac-ink); text-decoration: none; transition: border-color .12s; }
.dv-fac .dv-fac__pillole a:hover { border-color: var(--fac-ink); color: var(--fac-ink); }

@media (max-width: 1024px) {
	.dv-fac .dv-fac__griglia { grid-template-columns: 240px minmax(0, 1fr); gap: 28px; }
	.dv-fac .dv-fac__schede { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.dv-fac .dv-fac__porte { gap: 14px; }
	.dv-fac .dv-fac__porta-nome { font-size: 20px; bottom: 30px; }
}
@media (max-width: 767px) {
	.dv-fac { font-size: 16px; }
	.dv-fac .dv-fac__titolo { font-size: 26px; }
	.dv-fac .dv-fac__testa p { font-size: 16px; }
	.dv-fac .dv-fac__griglia { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.dv-fac .dv-fac__gruppo:not([open]) summary { min-height: 40px; }
	.dv-fac .dv-fac__schede { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.dv-fac .dv-fac__scheda { display: grid; grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 14px; row-gap: 2px; align-items: center; }
	.dv-fac .dv-fac__scheda img, .dv-fac .dv-fac__foto-vuota { grid-row: 1 / span 2; margin: 0; }
	.dv-fac .dv-fac__scheda .dv-fac__k { align-self: end; }
	.dv-fac .dv-fac__scheda .dv-fac__t { font-size: 17px; align-self: start; }
	.dv-fac .dv-fac__scheda:not(:has(.dv-fac__k)) .dv-fac__t { grid-row: 1 / span 2; align-self: center; }
	.dv-fac .dv-fac__altri { width: 100%; }
	.dv-fac .dv-fac__frase-testo { font-size: 24px; max-width: none; }
	.dv-fac .dv-fac__sel select, .dv-fac.is-vivo .dv-fac__sel-testo { padding-right: 20px; border-bottom-width: 2px; }
	.dv-fac .dv-fac__schede--tre { grid-template-columns: minmax(0, 1fr); }
	.dv-fac .dv-fac__porte { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 20px; }
	.dv-fac .dv-fac__porta-nome { font-size: 18px; bottom: 28px; left: 12px; right: 12px; }
	.dv-fac .dv-fac__porta-n { left: 12px; bottom: 10px; font-size: 13px; }
	.dv-fac .dv-fac__riga { grid-template-columns: minmax(0, 1fr); gap: 8px; }
	.dv-fac .dv-fac__riga-titolo { margin: 0; }
}