/* Punti di forza - blocchi di icone.
   Caratteri, colori del testo e allineamento li decide il tema; qui solo la disposizione,
   la misura e il colore delle icone (--pf-icona, --pf-colore). Nessuno spazio proprio sopra e sotto:
   la distanza dagli altri blocchi è quella di Design (--spazio-paragrafi). */

.pf{--pf-icona:40px;--pf-colore:currentColor;--pf-gap:calc(var(--pf-icona) * .55 + 10px)}
.pf *{box-sizing:border-box}

/* elenco senza punti, qualunque cosa faccia il tema con ul/li */
.jumbotron .pf ul.pf-voci,.pf ul.pf-voci{list-style:none!important;margin:0!important;padding:0!important}
.jumbotron .pf ul.pf-voci > li,.pf ul.pf-voci > li{list-style:none!important;margin:0!important;padding:0!important;background:none!important;border:0!important}
.pf ul.pf-voci > li:before,.pf ul.pf-voci > li:after{display:none!important;content:none!important}

/* la voce: con un collegamento resta del colore del testo, senza sottolineatura */
.pf .pf-dentro{display:flex;color:inherit!important;text-decoration:none!important;min-width:0}
.pf a.pf-dentro .pf-ico{transition:transform .2s ease}
@media(hover:hover){.pf a.pf-dentro:hover .pf-ico{transform:translateY(-2px)}.pf a.pf-dentro:hover .pf-tit{text-decoration:underline}}
.pf a.pf-dentro:focus-visible{outline:2px solid var(--colore-cliente,currentColor);outline-offset:4px}

/* icona: SVG Shin, Font Awesome o file, sempre nello stesso riquadro */
.pf .pf-ico{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:var(--pf-icona);height:var(--pf-icona);color:var(--pf-colore);line-height:0}
.pf .pf-ico svg,.pf .pf-ico img{width:100%!important;height:100%!important;max-width:none!important;margin:0!important;display:block;object-fit:contain;box-shadow:none!important;border:0!important;border-radius:0!important}
.pf .pf-ico .pf-fa{font-size:calc(var(--pf-icona) * .82)!important;line-height:1!important;color:inherit!important;margin:0!important}

/* testi: sobri, un po' sotto il testo del sito; la frase in grassetto, la spiegazione più leggera */
.pf .pf-testi{display:flex;flex-direction:column;gap:.3em;min-width:0}
.jumbotron .pf .pf-tit,.pf .pf-tit{font-weight:700;font-size:clamp(14px,.2vw + 13px,16px)!important;line-height:1.35!important;letter-spacing:.005em}
.jumbotron .pf .pf-txt,.pf .pf-txt{font-size:clamp(13.5px,.2vw + 12.5px,15.5px)!important;line-height:1.5!important;opacity:.85}

/* titolo del blocco: un normale h2 del sito, con l'icona facoltativa accanto */
.pf .pf-testa{margin:0 0 calc(clamp(18px,var(--spazio-paragrafi,60px) * .45,36px))!important;width:auto!important;max-width:none!important;float:none!important}
.pf .pf-testa h2{margin:0!important}
.pf .pf-testa .pf-ico-titolo{display:inline-flex;width:.9em;height:.9em;vertical-align:-.1em;margin-right:.35em}


/* ---------------------------------------------------------------------
   In fila: icona sopra, frase sotto, tutte centrate su una riga
   --------------------------------------------------------------------- */
.pf-fila ul.pf-voci{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(var(--pf-gap) * 1.2) var(--pf-gap)}
.pf-fila ul.pf-voci > li{flex:1 1 0;min-width:0;max-width:280px}
.pf-fila .pf-dentro{flex-direction:column;align-items:center;gap:calc(var(--pf-icona) * .22 + 6px);text-align:center!important}
.pf-fila .pf-testi{align-items:center;text-align:center!important}
.pf-fila .pf-testi *{text-align:center!important}
/* colonne fisse: le voci vanno a capo dopo quel numero */
.pf-fila:is(.pf-col-3,.pf-col-4,.pf-col-5,.pf-col-6) ul.pf-voci > li{flex:0 0 calc((100% - var(--pf-cols) * var(--pf-gap) + var(--pf-gap)) / var(--pf-cols));max-width:none}
.pf-fila.pf-col-3{--pf-cols:3}.pf-fila.pf-col-4{--pf-cols:4}.pf-fila.pf-col-5{--pf-cols:5}.pf-fila.pf-col-6{--pf-cols:6}
@media(max-width:991px){
	.pf-fila ul.pf-voci > li,.pf-fila:is(.pf-col-3,.pf-col-4,.pf-col-5,.pf-col-6) ul.pf-voci > li{flex:0 0 calc((100% - 2 * var(--pf-gap)) / 3);max-width:none}
	.pf-fila:is(.pf-n-2,.pf-n-4) ul.pf-voci > li{flex-basis:calc((100% - var(--pf-gap)) / 2)}
}
/* telefono: due per riga (l'ultima, se sola, al centro) */
@media(max-width:575px){
	.pf-fila ul.pf-voci > li,.pf-fila:is(.pf-col-3,.pf-col-4,.pf-col-5,.pf-col-6,.pf-n-2,.pf-n-4) ul.pf-voci > li{flex:0 0 calc((100% - var(--pf-gap)) / 2)}
	.pf-fila.pf-n-1 ul.pf-voci > li{flex-basis:100%}
	.pf-fila{--pf-icona:min(var(--pf-icona-m,var(--pf-icona)),44px)}
}


/* ---------------------------------------------------------------------
   Elenco: icona a sinistra, frase a destra, una sotto l'altra.
   Con il sito centrato l'elenco si centra come blocco, ma le righe restano allineate tra loro.
   --------------------------------------------------------------------- */
.pf-elenco ul.pf-voci,.pf-accanto ul.pf-voci{display:flex;flex-direction:column;gap:calc(var(--pf-icona) * .55 + 8px)}
.pf-elenco ul.pf-voci{width:fit-content;max-width:100%}
.Centrato .pf-elenco ul.pf-voci{margin-left:auto!important;margin-right:auto!important}
:is(.pf-elenco,.pf-accanto,.pf-griglia) .pf-dentro{flex-direction:row;align-items:center;gap:calc(var(--pf-icona) * .35 + 10px);text-align:left!important}
:is(.pf-elenco,.pf-accanto,.pf-griglia) .pf-testi,:is(.pf-elenco,.pf-accanto,.pf-griglia) .pf-testi *{text-align:left!important}
/* sul telefono gli «a capo» scritti a mano non servono: la frase va a capo da sola dove c'è posto */
@media(max-width:575px){:is(.pf-elenco,.pf-accanto,.pf-griglia) .pf-tit br{display:none}}
/* frase su più righe con la spiegazione: l'icona in alto, all'altezza della prima riga */
:is(.pf-elenco,.pf-accanto) .pf-voce:has(.pf-txt) .pf-dentro{align-items:flex-start}


/* ---------------------------------------------------------------------
   Elenco accanto a un testo (elenco a sinistra o a destra)
   --------------------------------------------------------------------- */
.pf-accanto .pf-due{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:start}
.pf-accanto.pf-lato-destra .pf-due{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.pf-accanto.pf-lato-destra .pf-col-voci{order:2}
.pf-accanto .pf-due:not(:has(.pf-col-testo)){grid-template-columns:1fr}
.pf-accanto .pf-col-testo{width:auto!important;float:none!important;margin:0!important;padding:0!important}
.pf-accanto .pf-col-testo,.pf-accanto .pf-col-testo *{text-align:left}
.Centrato .pf-accanto .pf-col-testo :is(p,h2,h3,h4,li){text-align:left!important}
/* gli «a capo» del testo restano anche se il tema azzera lo spazio tra i paragrafi */
.jumbotron .pf-accanto .pf-col-testo p,.pf-accanto .pf-col-testo p{margin:0 0 1em!important}
.pf-accanto .pf-col-testo > :first-child{margin-top:0!important}
.pf-accanto .pf-col-testo > :last-child{margin-bottom:0!important}
@media(max-width:767px){
	.pf-accanto .pf-due,.pf-accanto.pf-lato-destra .pf-due{grid-template-columns:1fr;gap:32px}
	.pf-accanto.pf-lato-destra .pf-col-voci{order:0}
}


/* ---------------------------------------------------------------------
   Griglia: icona a sinistra, frase e spiegazione a destra, su 2 o 3 colonne
   --------------------------------------------------------------------- */
.pf-griglia ul.pf-voci{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--pf-gap) * 1.3) calc(var(--pf-gap) * 1.6)}
.pf-griglia.pf-col-2 ul.pf-voci{grid-template-columns:repeat(2,minmax(0,1fr))}
.pf-griglia .pf-dentro{align-items:flex-start}
.pf-griglia .pf-testi{padding-top:calc(var(--pf-icona) * .08)}
@media(max-width:991px){.pf-griglia ul.pf-voci{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:575px){.pf-griglia ul.pf-voci,.pf-griglia.pf-col-2 ul.pf-voci{grid-template-columns:1fr}}


/* ---------------------------------------------------------------------
   Temi con la forma (Cerchio, Triangolo…): le icone restano pulite, nessun taglio
   --------------------------------------------------------------------- */
.pf .pf-ico svg,.pf .pf-ico img{clip-path:none!important;-webkit-clip-path:none!important}

/* titolo: segue l'allineamento del sito, come i titoli del tema */
.Centrato .pf .pf-testa,.Centrato .pf .pf-testa h2{text-align:center!important}
.Sinistra .pf .pf-testa,.Sinistra .pf .pf-testa h2{text-align:left!important}