/* ==========================================================================
   Palma Marino Aimone — il sito
   16/10/2026, tornata «3 Step»: il design è il MODELLO della cliente (Resources/3 Step/…/00000037-specifiche3.pdf,
   p.1 la home e p.5 La mia storia; C1·040-041 «Aggiorniamo la grafica come nel pdf?» → «Se riesci a migliorarla,
   soprattutto nelle proporzioni dei vari blocchi»), fatto coi caratteri, le icone e i file del kit (Design/kit).
   Un colore solo, il blu (voce 1); niente pulsante «Colori» (voce 2); il testo della misura normale dei siti (voce 3);
   tutto più compatto (voce 4). La versione di prima (sull'arancio del kit) è in _Archivio/ della cartella cliente.
   ========================================================================== */

/* Font locali del kit (licenze OFL in assets/fonts/) */
@font-face{font-family:"Manrope";src:url("../fonts/Manrope-Variable.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"DM Serif Display";src:url("../fonts/DMSerifDisplay-Italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Allura";src:url("../fonts/Allura-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}

:root{
  /* il blu (voce 1): contrasti misurati sul bianco e sui fondi chiari */
  --inchiostro:#0F1E3D;      /* titoli: 16,5:1 sul bianco */
  --testo:#3E4B64;           /* testo: 8,8:1 sul bianco, 7,9:1 sull'azzurro chiaro */
  --grigio:#5A6780;          /* testo secondario: 5,7:1 sul bianco */
  --blu:#1B3A6B;             /* pulsanti, link, titoli dei riquadri: 11,3:1 sul bianco */
  --blu-scuro:#132B52;       /* pulsante sotto il dito o il mouse */
  --blu-vivo:#2A5CAA;        /* icone, segni, simbolo del logo, contorno del fuoco: 6,5:1 sul bianco */
  --azzurro-0:#DDE9F9;       /* l'inizio della sfumatura della diagonale (una variabile per il colore personalizzato del pannello) */
  --azzurro:#CFE0F6;         /* la diagonale della presentazione (i capelli staccano: voce 14) */
  --azzurro-2:#B7D0F0;       /* la fine della sfumatura della diagonale, le virgolette */
  --azzurro-chiaro:#EAF1FB;  /* fondi dei riquadri «citazione» e delle icone */
  --fondo:#F5F8FD;           /* fondo delle pagine, fra un riquadro e l'altro */
  --bianco:#FFFFFF;
  --linea:#DCE6F4;           /* separatori */
  --bordo:#D3E0F2;           /* bordo dei riquadri */
  --ombra:0 14px 34px -24px rgb(15 30 61 / .28);
  --logo-simbolo:var(--blu-vivo);

  /* tipografia (kit): un bastoni solo, Manrope; DM Serif Display corsivo solo nelle citazioni */
  --font-testo:"Manrope",Arial,sans-serif;
  --font-citazione:"DM Serif Display",Georgia,serif;
  --font-nota:"Allura",cursive;
  --corpo:clamp(1.0625rem,1.03rem + .12vw,1.125rem);   /* con la base al 106,25%: 18 px da telefono, 19 px da computer (voce 3; Domenico 16/10: «dimensione standard») */

  /* misure */
  --larghezza:73rem;
  --margine:clamp(1rem,4.5vw,4rem);
  --spazio:clamp(1.25rem,2.6vw,2rem);             /* fra un riquadro e l'altro */
  --raggio:1.25rem;
  --raggio-foto:.875rem;
  --raggio-bottone:.5rem;
  --altezza-testata:4.75rem;
  --ease-out:cubic-bezier(.2,.7,.2,1);
}

/* --- Alto contrasto (pulsante dell'accessibilità): nero su bianco, accenti blu notte, bordi pieni --- */
html[data-contrasto]{
  --inchiostro:#0B1430; --azzurro-0:#FFFFFF; /* anche col colore personalizzato del pannello vince il contrasto (audit 16/10, P3) */
  --testo:#0B1430; --grigio:#0B1430; --blu:#0B2350; --blu-scuro:#000000; --blu-vivo:#0B2350;
  --azzurro:#FFFFFF; --azzurro-2:#FFFFFF; --azzurro-chiaro:#FFFFFF; --fondo:#FFFFFF; --linea:#0B1430; --bordo:#0B1430; --ombra:none;
}
html[data-contrasto] .riquadro,html[data-contrasto] .scheda,html[data-contrasto] .citazione-box{border:2px solid var(--inchiostro)}
html[data-contrasto] .bottone{border-width:2px}
/* --- Evidenzia i link --- */
html[data-link] a:not(.marchio):not(.salta){text-decoration:underline!important;text-decoration-thickness:3px!important;text-underline-offset:.2em;background:#FFF3A8;color:#0B1430!important;box-shadow:0 0 0 2px #0B1430}
/* --- Carattere più leggibile --- */
html[data-leggibile]{--font-citazione:"Manrope",Arial,sans-serif}
html[data-leggibile] body{letter-spacing:.02em;word-spacing:.08em;line-height:1.75}
html[data-leggibile] .citazione-breve p,html[data-leggibile] .citazione-box p{font-style:normal;font-weight:600}
/* --- Ferma le animazioni --- */
html[data-fermo]{scroll-behavior:auto}
html[data-fermo] *,html[data-fermo] *::before,html[data-fermo] *::after{animation:none!important;transition:none!important}

/* --- Base --- */
*,*::before,*::after{box-sizing:border-box}
html{font-size:106.25%;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--altezza-testata) + 1rem);scroll-padding-bottom:calc(var(--spazio-cookie,0px) + 4rem)}
body{margin:0;background:var(--fondo);color:var(--testo);font-family:var(--font-testo);font-size:var(--corpo);line-height:1.6;font-weight:450;overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;padding-bottom:var(--spazio-cookie,0px)}
img,svg{display:block;max-width:100%}
img{height:auto}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0}
h1,h2,h3{color:var(--inchiostro);font-weight:800;letter-spacing:-.02em;line-height:1.15;text-wrap:balance;overflow-wrap:break-word}
p,li,dd,figcaption,blockquote{text-wrap:pretty}
ul,ol{padding:0;list-style:none}
a{color:var(--blu);text-underline-offset:.2em;text-decoration-thickness:1.5px}
a[href^="mailto:"]{overflow-wrap:anywhere}
strong{font-weight:750;color:var(--inchiostro)}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--blu-vivo);outline-offset:3px;border-radius:3px}
main:focus,section[tabindex="-1"]:focus{outline:none}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.solo-lettori{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.contenitore{width:min(100% - 2*var(--margine),var(--larghezza));margin-inline:auto}
.salta{position:absolute;z-index:200;left:1rem;top:-5rem;padding:.8rem 1.1rem;background:var(--bianco);color:var(--inchiostro);font-weight:700;border:2px solid var(--blu);border-radius:var(--raggio-bottone);text-decoration:none}
.salta:focus{top:1rem}

/* icone del kit (sprite in linea: il tratto lo decide il CSS) */
.ico{width:1.375rem;height:1.375rem;flex:none;stroke-width:1.7;fill:none;color:currentColor}
.ico--esterno{width:1.05rem;height:1.05rem;stroke-width:2}

/* --- Pulsanti e collegamenti --- */
.bottone{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;max-width:100%;min-width:0;text-align:center;min-height:2.875rem;padding:.55rem 1.3rem;border:1.5px solid var(--blu);border-radius:var(--raggio-bottone);background:var(--bianco);color:var(--blu);font-size:1rem;font-weight:700;line-height:1.2;text-decoration:none;transition:background-color .2s var(--ease-out),color .2s var(--ease-out),transform .12s var(--ease-out)}
.bottone .ico{width:1.125rem;height:1.125rem;stroke-width:2;transition:transform .2s var(--ease-out)}
.bottone--pieno{background:var(--blu);color:var(--bianco)}
.bottone:active{transform:scale(.97)}
@media (hover:hover){
  .bottone:hover{background:var(--azzurro-chiaro)}
  .bottone--pieno:hover{background:var(--blu-scuro);color:var(--bianco)}
  .bottone:hover .ico{transform:translateX(3px)}
  .bottone:hover .ico--esterno{transform:translate(2px,-2px)}
  .bottone:hover .ico--linkedin{transform:none}
}
.link{display:inline-flex;align-items:center;gap:.55rem;min-height:2.75rem;color:var(--blu);font-weight:700;text-decoration:underline}
.link .ico{transition:transform .2s var(--ease-out)}
@media (hover:hover){.link:hover{text-decoration-thickness:2.5px}.link:hover .ico{transform:translateX(3px)}}
.azioni{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.4rem}

/* --- Testi ricorrenti --- */
.occhiello{font-size:.8125rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--blu-vivo)}
.titolo-sezione{font-size:clamp(1.5rem,1.15rem + 1.2vw,2.125rem)}
/* il titolo col trattino sopra (modello di La mia storia) */
.titolo-lineetta::before{content:"";display:block;width:3rem;height:3px;margin-bottom:.9rem;border-radius:2px;background:var(--blu-vivo)}
.testo-blocco>p+p{margin-top:.9rem}
.punti li{position:relative;padding:.2rem 0 .2rem 1.25rem}
.punti li::before{content:"";position:absolute;left:0;top:.82em;width:.45rem;height:.45rem;border-radius:50%;background:var(--blu-vivo)}

/* --- Il riquadro chiaro arrotondato (il pezzo del modello) --- */
.riquadro{position:relative;background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio);box-shadow:var(--ombra)}
.sezione{padding-block:calc(var(--spazio) / 2)}
.sezione__testa{margin-bottom:1rem}
.sezione__testa p{margin-top:.4rem;max-width:44rem}

/* ==========================================================================
   TESTATA: pulsante dell'accessibilità, logo, menu a 6 voci (voce 7)
   ========================================================================== */
.testata{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--altezza-testata);transition:background-color .25s var(--ease-out),box-shadow .25s var(--ease-out)}
.testata.scorsa,.pagina-interna .testata{background:rgb(255 255 255 / .97);box-shadow:0 1px 0 var(--linea)}
.testata__riga{height:100%;display:flex;align-items:center;gap:1rem}
/* il logo del kit (assets/img/logo.svg#logo): si mostra solo il disegno, senza i margini vuoti del file */
.marchio{--logo:clamp(16rem,24vw,23rem);display:flex;align-items:center;flex:none;overflow:hidden;width:calc(var(--logo) * .83);height:max(calc(var(--logo) * .138),2.75rem);border-radius:4px}
.marchio__logo{flex:none;width:var(--logo);max-width:none;height:auto;aspect-ratio:650/135;margin-left:calc(var(--logo) * -.03);color:var(--logo-simbolo)}
.menu{margin-left:auto}
.menu__voci{display:flex;gap:clamp(.9rem,1.6vw,1.75rem)}
.menu__voci a{position:relative;display:inline-flex;align-items:center;min-height:2.75rem;color:var(--inchiostro);font-weight:600;font-size:.9375rem;text-decoration:none;white-space:nowrap}
.menu__voci a::after{content:"";position:absolute;left:0;right:0;bottom:.4rem;height:2px;border-radius:2px;background:var(--blu-vivo);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease-out)}
.menu__voci a[aria-current]{color:var(--blu-vivo)}
.menu__voci a[aria-current]::after{transform:scaleX(1)}
@media (hover:hover){.menu__voci a:hover::after{transform:scaleX(1)}}
.menu__bottone{display:none}

/* pulsante dell'accessibilità (in alto a sinistra, richiesto dalla cliente) */
.a11y{position:relative;flex:none}
.a11y__bottone{display:inline-grid;place-items:center;width:2.875rem;height:2.875rem;padding:0;border:1.5px solid var(--blu);border-radius:50%;background:var(--bianco);color:var(--blu);transition:background-color .2s var(--ease-out),transform .12s var(--ease-out)}
.a11y__bottone .ico{width:1.5rem;height:1.5rem;stroke-width:1.7}
.a11y__bottone:active{transform:scale(.96)}
@media (hover:hover){.a11y__bottone:hover{background:var(--azzurro-chiaro)}}
.a11y__bottone[aria-expanded="true"]{background:var(--azzurro-chiaro)}
.a11y__etichetta{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.a11y__pannello{position:absolute;left:0;top:calc(100% + .6rem);width:min(19rem,calc(100vw - 2rem));max-height:calc(100dvh - var(--altezza-testata) - var(--spazio-cookie,0px) - .5rem);overflow-y:auto;overscroll-behavior:contain;padding:.9rem;background:var(--bianco);border:1px solid var(--bordo);border-radius:1rem;box-shadow:0 18px 40px -18px rgb(15 30 61 / .35)}
.a11y__titolo{font-weight:800;font-size:1rem;margin:0 0 .5rem .25rem;color:var(--inchiostro)}
.a11y__voci{display:grid;gap:.2rem}
.a11y__voci button{display:flex;align-items:center;gap:.7rem;width:100%;min-height:2.875rem;padding:.45rem .7rem;border:1px solid transparent;border-radius:.6rem;background:none;text-align:left;font-size:.9375rem;font-weight:600;color:var(--inchiostro)}
.a11y__voci button .ico{color:var(--blu-vivo)}
@media (hover:hover){.a11y__voci button:hover{background:var(--azzurro-chiaro)}}
.a11y__voci button[aria-pressed="true"]{background:var(--azzurro-chiaro);border-color:var(--blu-vivo)}
.a11y__voci button[aria-pressed="true"]::after{content:"✓";margin-left:auto;color:var(--blu-vivo);font-weight:800}
.a11y__voci button:disabled{opacity:.45;cursor:not-allowed}
.a11y__ripristina{border-top:1px solid var(--linea)!important;border-radius:0 0 .6rem .6rem!important;margin-top:.2rem}

/* ==========================================================================
   HOME · PRESENTAZIONE (voci 11-14): nome su una riga, due paragrafi, due pulsanti, la foto sull'azzurro
   ========================================================================== */
.hero{position:relative;overflow:hidden;background:var(--bianco);padding-top:var(--altezza-testata)}
/* la diagonale azzurra (dove sta la foto) e, a sinistra in basso, una velatura più chiara: come nel modello */
.hero::before,.hero::after{content:"";position:absolute;inset:0;pointer-events:none}
.hero::before{background:linear-gradient(165deg,var(--azzurro-0,#DDE9F9) 0%,var(--azzurro) 45%,var(--azzurro-2) 100%);clip-path:polygon(47% 0,100% 0,100% 100%,66% 100%)}
.hero::after{background:var(--fondo);clip-path:polygon(0 58%,40% 100%,0 100%)}
.hero__griglia{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end;min-height:clamp(30rem,40vw,36rem)}
.hero__testo{align-self:center;padding-block:clamp(2rem,4vw,3.5rem);max-width:36rem}
.hero__titolo{font-size:clamp(1.5rem,.55rem + 4.6vw,3.25rem);line-height:1.05;letter-spacing:-.03em}
.hero__titolo>span{display:block}
@media (min-width:600px){.hero__riga{display:block}}
.hero__ruolo{margin-top:.6rem;font-size:clamp(1.0625rem,.85rem + .9vw,1.5rem);font-weight:600;line-height:1.3;letter-spacing:-.01em;color:var(--inchiostro)}
.hero__testo>p{margin-top:1rem;max-width:33rem;color:var(--testo)}
.hero__testo>p+p{margin-top:.7rem}
.hero__ritratto{justify-self:end;align-self:end;width:min(100%,29rem);margin-right:calc(-.5 * var(--margine))}
.hero__ritratto img{width:100%;aspect-ratio:692/713;object-fit:cover;object-position:50% 20%}
/* le due estremità del tavolo sfumano nell'azzurro invece di finire con due tagli dritti (3 Step, secondo giro, 16/10).
   Cinque livelli di maschera, sommati: in alto tutto pieno (la persona e la sedia non si toccano); il tavolo pieno al
   centro; a sinistra il tavolo (dall'89,6%) sfuma verso il bordo; a destra la sedia resta piena fino al tavolo, che lì
   comincia più in basso (91,3%: il piano è un po' inclinato), e solo il tavolo sfuma. I livelli si sovrappongono dove
   sono già pieni (niente righe chiare né scalini fra un livello e l'altro) */
.hero__ritratto img{
  -webkit-mask-image:linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(to right,transparent,rgb(0 0 0 / .55) 39%,#000 92%),linear-gradient(#000,#000),linear-gradient(to left,transparent,rgb(0 0 0 / .55) 39%,#000 92%);
  -webkit-mask-size:100% 89.6%,76.4% 10.6%,13% 10.6%,12% 91.4%,13% 8.9%;
  -webkit-mask-position:top,bottom,left bottom,right top,right bottom;-webkit-mask-repeat:no-repeat;
  mask-image:linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(to right,transparent,rgb(0 0 0 / .55) 39%,#000 92%),linear-gradient(#000,#000),linear-gradient(to left,transparent,rgb(0 0 0 / .55) 39%,#000 92%);
  mask-size:100% 89.6%,76.4% 10.6%,13% 10.6%,12% 91.4%,13% 8.9%;
  mask-position:top,bottom,left bottom,right top,right bottom;mask-repeat:no-repeat}

/* ==========================================================================
   HOME · IL MIO LAVORO IN RAI (voci 16-17): riquadro, foto a sinistra, «Guarda il video» col tasto play
   ========================================================================== */
.home-blocchi{padding-block:var(--spazio) calc(var(--spazio) * 1.5)}
.home-blocchi>*+*{margin-top:var(--spazio)}
.rai{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(1.25rem,3vw,2.5rem);align-items:center;padding:clamp(.75rem,1.4vw,1rem)}
.rai__foto{overflow:hidden;border-radius:var(--raggio-foto);background:var(--azzurro-chiaro)}
.rai__foto img{width:100%;aspect-ratio:4/3;object-fit:cover}
.rai__testo{padding:clamp(.5rem,1.5vw,1.25rem) clamp(.5rem,2vw,1.5rem) clamp(.5rem,1.5vw,1.25rem) 0}
.rai__testo p{margin-top:.8rem}
.video{display:inline-flex;align-items:center;gap:.75rem;min-height:3rem;margin-top:1.1rem;color:var(--blu);font-weight:700;font-size:1.0625rem;text-decoration:underline}
.video .ico{width:2.5rem;height:2.5rem;stroke-width:1.5;color:var(--blu-vivo);transition:transform .25s var(--ease-out)}
@media (hover:hover){.video:hover .ico{transform:scale(1.08)}}
.video:active .ico{transform:scale(.94)}

/* ==========================================================================
   HOME · IN EVIDENZA (voce 18): il riquadro col bordo blu e le virgolette grandi
   ========================================================================== */
.evidenza{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1rem,3vw,2rem);align-items:start;padding:clamp(1.25rem,2.6vw,2rem) clamp(1.25rem,3vw,2.5rem);border:1.5px solid var(--blu-vivo)}
.evidenza__segno{width:clamp(3rem,2.2rem + 2.5vw,4.5rem);height:auto;aspect-ratio:1;stroke-width:2.2;color:var(--blu-vivo)}
.evidenza h2{margin-top:.35rem;font-size:clamp(1.25rem,1rem + .8vw,1.625rem)}
.evidenza p:not(.occhiello){margin-top:.5rem;max-width:44rem}

/* ==========================================================================
   HOME · IL MIO IMPEGNO NELLE ASSOCIAZIONI (voce 19): due colonne coi loghi trasparenti di oggi
   ========================================================================== */
.associazioni{padding:clamp(1.25rem,2.6vw,2rem) clamp(1.25rem,3vw,2.5rem)}
.associazioni__elenco{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:1.25rem}
.associazioni__voce{display:flex;flex-direction:column;align-items:flex-start;padding-right:clamp(1rem,3vw,2.5rem)}
.associazioni__voce+.associazioni__voce{padding:0 0 0 clamp(1rem,3vw,2.5rem);border-left:1px solid var(--linea)}
.associazioni__logo{width:auto;height:clamp(4rem,3.3rem + 1.6vw,5.25rem);max-width:100%;margin-bottom:1rem;align-self:center}
.associazioni__voce .link{margin-top:.4rem}

/* ==========================================================================
   HOME · DOCENZE E INTERVENTI PUBBLICI · ARTICOLI E PUBBLICAZIONI (voci 20-21): due riquadri con l'icona
   ========================================================================== */
.coppia h2{margin-bottom:.9rem}
.coppia__elenco{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--spazio)}
.scheda-icona{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.1rem;align-items:start;padding:clamp(1.1rem,2.2vw,1.6rem)}
.scheda-icona__icona{flex:none;display:grid;place-items:center;width:3.5rem;height:3.5rem;border-radius:1rem;background:var(--azzurro-chiaro);color:var(--blu-vivo)}
.scheda-icona__icona .ico{width:2rem;height:2rem;stroke-width:1.5}
.scheda-icona h3,.scheda-icona__titolo{font-size:1.1875rem;letter-spacing:-.01em}
.scheda-icona p+p{margin-top:.5rem}
.scheda-icona p{margin-top:.35rem}
.scheda-icona .bottone{margin-top:1rem}

/* ==========================================================================
   LA CITAZIONE (voci 23 e 28): le virgolette grandi del kit, il corsivo solo qui
   ========================================================================== */
.citazione-breve{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(.75rem,2.5vw,2rem);max-width:62rem;margin-inline:auto;padding-block:.5rem}
.citazione-breve p,.citazione-box p{font:italic 400 clamp(1.1875rem,1rem + .55vw,1.5625rem)/1.35 var(--font-citazione);color:var(--blu);text-align:center}
.virgolette{width:clamp(2.5rem,2rem + 1.5vw,3.5rem);height:auto;aspect-ratio:1;stroke-width:2.6;color:var(--azzurro-2)}
.virgolette--chiusa{transform:rotate(180deg)}
.citazione-box{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(.75rem,2.5vw,2rem);padding:clamp(1.25rem,2.6vw,1.75rem) clamp(1.25rem,3vw,2.25rem);background:var(--azzurro-chiaro);border-radius:var(--raggio)}
.citazione-box .virgolette{color:var(--blu-vivo);opacity:.55}

/* ==========================================================================
   RESTIAMO IN CONTATTO (voci 24 e 30): in fondo a ogni pagina
   ========================================================================== */
.contatto{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;padding:clamp(1.25rem,2.6vw,1.75rem) clamp(1.25rem,3vw,2.5rem)}
.contatto h2{font-size:clamp(1.375rem,1.1rem + .9vw,1.875rem)}
.contatto p{margin-top:.25rem}
.contatto .azioni{margin-top:0}

/* ==========================================================================
   PIÈ DI PAGINA (quello di oggi, nello stile del modello)
   ========================================================================== */
.piede{background:var(--bianco);border-top:1px solid var(--linea)}
.piede__riga{display:flex;align-items:center;gap:1rem 2rem;padding-block:1.1rem .6rem}
.piede .marchio{--logo:clamp(15rem,20vw,19rem);justify-content:flex-start;min-width:0}
.piede__menu{margin-left:auto}
.piede__menu ul,.piede__legale{display:flex;flex-wrap:wrap;gap:0 1.25rem}
.piede a{display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;min-width:2.75rem;color:var(--testo);font-size:.9375rem;text-decoration:none}
@media (hover:hover){.piede a:hover{color:var(--blu);text-decoration:underline}}
.piede a[aria-current]{color:var(--blu-vivo);font-weight:700}
.piede__contatti{display:flex;flex-wrap:wrap;align-items:center;gap:0 2rem;padding-block:.25rem;border-top:1px solid var(--linea)}
.piede__contatti>a{gap:.5rem;min-width:0;max-width:100%;overflow-wrap:anywhere}
.piede__contatti .ico{width:1.125rem;height:1.125rem;color:var(--blu-vivo)}
.piede__legale{margin-left:auto;gap:0 .8rem}
.piede__legale li+li::before{content:"·";margin-right:.8rem;color:var(--grigio)}
.piede__fondo{display:flex;flex-wrap:wrap;justify-content:space-between;gap:0 2rem;padding-bottom:1rem;font-size:.875rem;color:var(--grigio)}
.piede__fondo p{padding-block:.7rem;overflow-wrap:anywhere}
.piede__fondo a{display:inline;min-height:0;min-width:0;padding-block:.75rem;font-size:inherit;color:var(--blu);text-decoration:underline}

/* ==========================================================================
   PAGINE INTERNE: apertura col titolo grande e la diagonale chiara in alto a destra (modello di La mia storia)
   ========================================================================== */
.pagina main{padding-bottom:calc(var(--spazio) * 1.5)}
.apertura{position:relative;overflow:hidden;background:var(--bianco);padding:calc(var(--altezza-testata) + clamp(1.75rem,4vw,3.25rem)) 0 clamp(1.75rem,3.5vw,2.75rem);margin-bottom:var(--spazio)}
.apertura::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(200deg,var(--azzurro) 0%,rgb(207 224 246 / 0) 70%);clip-path:polygon(72% 0,100% 0,100% 48%)}
.apertura .contenitore{position:relative}
.apertura__titolo{font-size:clamp(2rem,1.35rem + 2.6vw,3.25rem);letter-spacing:-.03em;line-height:1.05}
.apertura__testo{margin-top:1rem;max-width:52rem;font-size:clamp(1.125rem,1.06rem + .3vw,1.25rem)}
.apertura__testo p+p{margin-top:.8rem}
.apertura__testo .punti{margin-top:.6rem}
.pagina__corpo>.sezione+.sezione{margin-top:calc(var(--spazio) / 2)}
/* l'icona del kit accanto al titolo (Copy: Docenze e formazione, Convegni, Libri) e la foto accanto al testo (Convegni) */
.apertura__titolo--icona{display:flex;align-items:center;gap:clamp(.7rem,1.5vw,1rem)}
.apertura__icona{flex:none;width:clamp(2.75rem,2.2rem + 1.6vw,3.5rem);height:clamp(2.75rem,2.2rem + 1.6vw,3.5rem)}
.apertura__icona .ico{width:58%;height:58%}
.apertura__griglia{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.apertura__foto{overflow:hidden;width:min(100%,622px);justify-self:end;border-radius:var(--raggio);box-shadow:var(--ombra);background:var(--azzurro-chiaro)}
.apertura__foto img{width:100%}
/* Docenze e formazione: la frase della cliente subito prima dei due riquadri */
.esperienze__intro{margin:0 0 .9rem;font-size:clamp(1.125rem,1.06rem + .3vw,1.25rem);font-weight:650;color:var(--inchiostro)}
.coppia__elenco--alto{align-items:start}
.riquadro__foto{margin-top:1rem}
.riga-con-foto--alta{flex-direction:column;align-items:stretch;gap:.4rem}
.riga-con-foto--alta .riga__foto{flex:none;width:100%;max-width:588px}
.riga-con-foto--alta .riga__foto img{aspect-ratio:16/9}
.recapiti__nota{margin-top:.8rem}

/* LA MIA STORIA (voci 25-30): foto e testo affiancati, titoli con la lineetta */
.blocco{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center;padding-block:clamp(1.25rem,3vw,2.25rem)}
.blocco__foto{overflow:hidden;border-radius:var(--raggio);box-shadow:var(--ombra);background:var(--azzurro-chiaro)}
.blocco__foto img{width:100%}
.blocco--rovescio .blocco__foto{order:2}
.blocco__testo h2{font-size:clamp(1.5rem,1.15rem + 1.2vw,2.125rem);margin-bottom:.9rem}
.famiglia{margin-top:1.1rem;padding-inline:clamp(1.25rem,3vw,2.25rem);max-width:60rem;font-size:clamp(1.125rem,1.06rem + .3vw,1.25rem)}

/* riquadri delle pagine interne: titolo, testo, elenchi con le icone */
.riquadro--sezione{padding:clamp(1.25rem,2.6vw,2rem) clamp(1.25rem,3vw,2.5rem)}
.riquadro--sezione>h2{font-size:clamp(1.375rem,1.1rem + .9vw,1.875rem)}
.riquadro--sezione>h2+*,.titolo-icona+.testo-blocco,.titolo-icona+p{margin-top:.8rem}
.titolo-icona{display:flex;align-items:center;gap:.9rem}
.titolo-icona>span:last-child,.apertura__titolo--icona>span:last-child{min-width:0}
.titolo-icona .scheda-icona__icona{width:3rem;height:3rem;border-radius:.85rem}
.titolo-icona .scheda-icona__icona .ico{width:1.7rem;height:1.7rem}
.due-colonne{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(1.25rem,3vw,2.5rem);align-items:start}
.foto-piccola{overflow:hidden;border-radius:var(--raggio-foto);box-shadow:var(--ombra);background:var(--azzurro-chiaro)}
.foto-piccola img{width:100%}
.foto-piccola--ritratto{max-width:194px}
.foto-piccola--media{max-width:259px}
.colonna-foto{display:grid;gap:1rem;justify-items:start}

/* righe con icona (università, formazione, articoli, interviste, recapiti) */
.righe{margin-top:.6rem}
.righe>li+li{border-top:1px solid var(--linea)}
.riga-statica,.riga-link{display:flex;align-items:center;gap:1rem;min-height:3.5rem;padding:.6rem .5rem;color:var(--inchiostro);font-weight:600}
.riga-link{text-decoration:none;border-radius:.6rem;background:linear-gradient(var(--azzurro-chiaro),var(--azzurro-chiaro)) left/0% 100% no-repeat;transition:background-size .35s var(--ease-out)}
.riga-link:focus-visible{background-size:100% 100%}
@media (hover:hover){.riga-link:hover{background-size:100% 100%}.riga-link:hover .riga__titolo{text-decoration:underline}.riga-link:hover .ico--esterno{transform:translate(2px,-2px)}}
.riga-link:active{background-size:100% 100%}
.ico--riga{width:1.875rem;height:1.875rem;stroke-width:1.4;color:var(--blu-vivo)}
.riga-link .ico--esterno{color:var(--blu-vivo);transition:transform .2s var(--ease-out)}
.riga__testo{flex:1;min-width:0}
/* col testo ingrandito su schermi stretti, una parola più lunga della riga va a capo invece di uscire */
.riga__testo,.scheda-icona>div,.scheda__corpo,.evidenza>div,.contatto>div{min-width:0;overflow-wrap:anywhere}
.riga__titolo{font-weight:650}
.riga__titolo--normale{font-weight:inherit}
.riga__fonte{display:block;margin-top:.1rem;font-size:.9375rem;font-weight:550;color:var(--grigio)}
.riga__descr{display:block;margin-top:.25rem;font-weight:450;font-size:1rem;color:var(--testo)}
.righe--recapiti .riga__testo a{font-weight:700;padding-block:.75rem}
/* la voce di Trento con la foto della formazione TSM accanto */
.riga-con-foto{display:flex;align-items:center;gap:1rem;padding-block:.75rem}
.riga-con-foto .riga__foto{flex:0 0 clamp(8rem,6rem + 5vw,11rem);overflow:hidden;border-radius:.6rem}
.riga-con-foto .riga__foto img{width:100%;aspect-ratio:4/3;object-fit:cover}
.riga-con-foto .riga-link{flex:1;min-width:0}

/* schede (convegni, contributi in volume): riquadri in griglia, la foto in alto */
.schede{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr));gap:var(--spazio);margin-top:1rem}
.schede--due{grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr))}
.schede--eventi{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
/* ogni convegno: a sinistra la sua miniatura o l'icona del microfono, a destra titolo e dati (Copy/convegni.md: foto
   piccole, mai a tutta larghezza) */
.scheda--evento{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;align-items:start;padding:1.15rem 1.25rem 1.3rem}
.scheda--evento>.scheda__foto{width:clamp(6.5rem,4.5rem + 5vw,9.5rem);border-radius:.6rem;overflow:hidden;margin-top:.15rem}
.scheda--evento>.scheda__foto img{aspect-ratio:4/3}
.scheda--evento>.scheda__icona{width:2.75rem;height:2.75rem;margin:0}
.scheda--evento .scheda__corpo{padding:0}
.scheda{position:relative;display:flex;flex-direction:column;background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio);box-shadow:var(--ombra);overflow:hidden}
.scheda__foto{margin:0;background:var(--azzurro-chiaro)}
.scheda__foto img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .6s var(--ease-out)}
.scheda__foto:has(.scheda__foto-intera){background:#141414}
.scheda__foto .scheda__foto-intera{object-fit:contain}
@media (hover:hover){.scheda--evento:hover .scheda__foto img:not(.scheda__foto-intera){transform:scale(1.03)}}
.scheda__corpo{display:flex;flex-direction:column;gap:.4rem;padding:1.1rem 1.25rem 1.3rem;flex:1}
.scheda__icona{width:2.5rem;height:2.5rem;stroke-width:1.4;color:var(--blu-vivo);margin-bottom:.25rem}
.scheda__titolo{font-size:1.125rem;line-height:1.3;letter-spacing:-.01em}
.scheda__link{display:inline-block;padding-block:.7rem;margin-block:-.7rem;color:inherit;text-decoration:none}
@media (hover:hover){.scheda__link:hover{color:var(--blu);text-decoration:underline}}
.scheda__link .ico--esterno{display:inline-block;vertical-align:-.1em;margin-left:.35rem;color:var(--blu-vivo)}
.scheda__meta{font-size:.9375rem;font-weight:700;color:var(--blu-vivo)}
.scheda__nota{font-size:1rem}
.scheda__capitolo{font-weight:700;color:var(--inchiostro)}
.scheda .azioni{margin-top:auto;padding-top:.6rem}
.evento__dati{margin-top:.35rem;display:grid;gap:.45rem}
.evento__dati>div{display:grid;gap:.05rem}
.evento__dati dt{font-size:.75rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--blu-vivo)}
.evento__dati dd{font-size:1rem;line-height:1.45}
.evento__dati a{display:inline-block;padding-block:.75rem;margin-block:-.75rem;font-weight:700}
/* una scheda sola nell'ultima riga prende tutta la riga (main.js) */
.schede>.scheda.scheda--sola{grid-column:1/-1}

/* libri: la copertina del Manifesto e la scheda dei dati */
.libro{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(1.25rem,4vw,3rem);align-items:center}
.libro__copertina-kit{width:min(100%,17rem);justify-self:center;filter:drop-shadow(0 18px 24px rgb(15 30 61 / .18))}
.libro__elenco{margin-top:.4rem}
.scheda-dati{display:grid;margin-top:.5rem;border-top:1px solid var(--linea)}
.scheda-dati>div{display:grid;grid-template-columns:minmax(6.5rem,.35fr) 1fr;gap:1rem;padding:.8rem .5rem;border-bottom:1px solid var(--linea)}
.scheda-dati dt{font-weight:800;color:var(--blu)}
.scheda-dati:empty{display:none}

/* note scritte a mano del kit: solo nelle pagine interne, piccole (voce «Le scritte a mano», Dubbi) */
.nota{display:block;background:var(--blu-vivo);-webkit-mask:var(--nota) center/contain no-repeat;mask:var(--nota) center/contain no-repeat;pointer-events:none;max-width:100%}
.nota--un-lavoro{--nota:url("../img/note/un-lavoro-piu-inclusivo.svg");aspect-ratio:715/250;width:clamp(10rem,8rem + 5vw,13rem)}
.nota--prima{--nota:url("../img/note/le-persone-prima-di-tutto.svg");aspect-ratio:486/250;width:clamp(8rem,6rem + 5vw,11rem)}

/* contatti: il modulo */
.modulo{display:grid;gap:1rem;padding:clamp(1.1rem,2.6vw,1.75rem);background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio)}
.campo{display:grid;gap:.35rem}
.campo label{font-weight:700;font-size:.9375rem;color:var(--inchiostro)}
.campo input,.campo textarea{width:100%;min-height:2.875rem;padding:.6rem .8rem;border:1.5px solid var(--grigio);border-radius:.5rem;background:var(--bianco);color:var(--inchiostro);font:inherit;line-height:1.4}
.campo textarea{min-height:7.5rem;resize:vertical}
.campo input::placeholder,.campo textarea::placeholder{color:var(--grigio);opacity:1}
.campo input:focus-visible,.campo textarea:focus-visible{outline:3px solid var(--blu-vivo);outline-offset:2px;border-color:var(--blu-vivo)}
.campo [aria-invalid="true"]{border-color:#B3261E;border-width:2px}
.campo__errore[hidden]{display:none}
.campo__errore{display:flex;align-items:flex-start;gap:.4rem;color:#B3261E;font-weight:700;font-size:.9375rem}
.campo__errore::before{content:"!";flex:none;display:inline-grid;place-items:center;width:1.15rem;height:1.15rem;margin-top:.15rem;border-radius:50%;background:#B3261E;color:var(--bianco);font-size:.75rem;font-weight:800}
.modulo__invia{justify-self:start}
/* la riga del modello sotto il pulsante (30 § 6, 16/10/2026): informa, non chiede niente; via la casella della privacy */
.thk-avviso-modulo{margin:0;font-size:.9375rem;line-height:1.5;color:var(--testo)}
.thk-avviso-modulo a{color:var(--blu);font-weight:700;text-decoration:underline;text-underline-offset:.15em;display:inline-block;padding-block:.6rem;margin-block:-.6rem}
.modulo__esito{font-weight:700}
.contatti-modulo{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.25rem,3vw,2.5rem);align-items:start}

/* pagine di servizio (privacy, cookie, note legali, 404) */
.documento{padding-top:calc(var(--altezza-testata) + clamp(2rem,4vw,3.5rem));padding-bottom:clamp(2.5rem,5vw,4rem)}
.documento__corpo{max-width:46rem}
.documento h1{margin-bottom:.75rem;font-size:clamp(1.75rem,1.3rem + 1.6vw,2.5rem)}
.documento h2{font-size:clamp(1.25rem,1.1rem + .6vw,1.5rem);margin:2rem 0 .5rem}
.documento p+p{margin-top:.75rem}
.documento__data{color:var(--grigio);font-size:1rem}
.documento__elenco{margin:.75rem 0;padding-left:1.25rem;list-style:disc}
.documento__elenco li+li{margin-top:.4rem}
.documento__torna{margin-top:2rem!important}
.documento--404{min-height:70vh;display:flex;align-items:center}
.documento__testo{font-size:clamp(1.125rem,1.06rem + .3vw,1.3125rem);margin-top:.5rem}
/* i testi legali dai modelli THK (Legale/, step 9-bis): paragrafi, elenchi puntati, collegamenti e la tabella dei cookie */
.legale ul{margin:.75rem 0;padding-left:1.25rem;list-style:disc}
.legale li+li{margin-top:.4rem}
.legale p+ul,.legale ul+p{margin-top:.75rem}
.legale a{color:var(--blu);text-decoration:underline;text-underline-offset:.15em;overflow-wrap:anywhere}
.legale__tabella{width:100%;margin:1rem 0;border-collapse:collapse;font-size:.9375rem;line-height:1.45}
.legale__tabella th,.legale__tabella td{padding:.6rem .7rem;border:1px solid var(--bordo);text-align:left;vertical-align:top}
.legale__tabella th{background:var(--azzurro-chiaro);color:var(--inchiostro);font-weight:700}
.legale__tabella td:first-child{font-weight:600;color:var(--inchiostro);overflow-wrap:anywhere}

/* PEZZI DEL PANNELLO (si vedono solo quando la cliente li riempie): Blog, «In programma», libri con la foto */
.schede--novita{grid-template-columns:minmax(0,1fr);max-width:56rem}
.scheda--novita .scheda__titolo{font-size:clamp(1.125rem,1rem + .5vw,1.375rem)}
.scheda__testo>*+*{margin-top:.7rem}
.scheda__testo ul{padding-left:1.25rem;list-style:disc}
.scheda__testo a{font-weight:700}
.programma__sotto{margin-top:.4rem;max-width:44rem}
.libro__copertina{width:min(100%,17rem);height:auto;border-radius:.35rem;box-shadow:0 1.25rem 2.5rem rgb(15 30 61 / .2)}

/* ==========================================================================
   MOVIMENTO: pochi effetti, una volta sola, mai in loop; senza JS tutto è visibile; reduced-motion rispettato
   ========================================================================== */
@media (prefers-reduced-motion:no-preference){
  @keyframes pma-sale{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
  @keyframes pma-appare{from{opacity:0}to{opacity:1}}
  @keyframes pma-scivola{from{opacity:0;transform:translateX(5%)}to{opacity:1;transform:none}}
  .hero__titolo>span,.apertura__titolo{animation:pma-sale .7s var(--ease-out) both}
  .hero__titolo>span:nth-child(2){animation-delay:.08s}
  .hero__testo>p,.apertura__testo{animation:pma-sale .7s .18s var(--ease-out) both}
  .hero .azioni{animation:pma-sale .7s .28s var(--ease-out) both}
  .hero__ritratto{animation:pma-sale .9s .12s var(--ease-out) both}
  .hero::before,.apertura::before{animation:pma-scivola 1s var(--ease-out) both}
  .reveal{opacity:0;transform:translateY(18px)}
  .reveal.in{opacity:1;transform:none;transition:opacity .7s var(--ease-out) var(--ritardo,0ms),transform .8s var(--ease-out) var(--ritardo,0ms)}
  [data-entra="gruppo"].reveal{opacity:1;transform:none}
  [data-entra="gruppo"].reveal>*{opacity:0;transform:translateY(16px)}
  [data-entra="gruppo"].reveal.in>*{opacity:1;transform:none;transition:opacity .6s var(--ease-out) var(--ritardo,0ms),transform .7s var(--ease-out) var(--ritardo,0ms)}
  html{scroll-behavior:smooth}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ==========================================================================
   SCHERMI PIÙ STRETTI
   ========================================================================== */
/* il menu a 6 voci sta accanto al logo dai 1180 px; sotto si apre col pulsante */
@media (max-width:1179px){
  .menu__bottone{display:inline-grid;place-items:center;width:2.875rem;height:2.875rem;padding:0;border:0;background:none;color:var(--blu);border-radius:.5rem}
  .menu__bottone .ico{width:1.9rem;height:1.9rem;stroke-width:1.6;grid-area:1/1}
  .menu__bottone .ico--chiudi,.menu__bottone[aria-expanded="true"] .ico--menu{display:none}
  .menu__bottone[aria-expanded="true"] .ico--chiudi{display:block}
  .menu__voci{display:none;position:fixed;left:0;right:0;top:var(--altezza-testata);flex-direction:column;gap:0;padding:.4rem var(--margine) 1.25rem;background:var(--bianco);border-bottom:1px solid var(--linea);box-shadow:0 20px 30px -20px rgb(15 30 61 / .3)}
  .menu.aperto .menu__voci{display:flex}
  .menu__voci li+li{border-top:1px solid var(--linea)}
  .menu__voci a{display:flex;min-height:3.25rem;font-size:1.0625rem}
  .menu__voci a::after{bottom:.55rem;right:auto;width:1.5rem}
  .testata.menu-aperto{background:var(--bianco)}
}
@media (max-width:999px){
  .coppia__elenco,.schede--eventi,.apertura__griglia{grid-template-columns:minmax(0,1fr)}
  .apertura__foto{justify-self:start;width:min(100%,26rem)}
  .due-colonne,.contatti-modulo,.libro{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:899px){
  :root{--altezza-testata:4.25rem}
  /* i due pulsanti tondi della testata restano di 44-52 px anche col testo grande: il logo prende lo spazio che resta */
  .a11y__bottone,.menu__bottone{width:clamp(44px,2.875rem,52px)!important;height:clamp(44px,2.875rem,52px)!important}
  .testata__riga{gap:clamp(6px,.6rem,10px)}
  .testata .marchio{--logo:min(17.5rem,(100vw - 2*var(--margine) - 2*clamp(44px,2.875rem,52px) - 2*clamp(6px,.6rem,10px) - 4px) / .83)}
  /* presentazione: prima la foto sull'azzurro, poi il testo (Domenico 16/10: «da mobile l'immagine sopra e poi il testo
     sotto»). L'azzurro finisce dove finisce il tavolo della foto, a destra, e sale in diagonale a sinistra */
  .hero{--fine-foto:calc(var(--altezza-testata) + .5rem + min(.82 * (100vw - 2 * var(--margine)), 24rem) * 713 / 692)}
  .hero::before{clip-path:polygon(0 0,100% 0,100% var(--fine-foto),0 calc(var(--fine-foto) - 4.5rem))}
  .hero::after{display:none}
  .hero__griglia{grid-template-columns:minmax(0,1fr);min-height:0}
  .hero__testo{padding-block:1.5rem 2.25rem;max-width:none}
  .hero__ritratto{order:-1;justify-self:end;width:min(82%,24rem);margin:.5rem calc(-1 * var(--margine)) 0 0}
  .rai,.blocco{grid-template-columns:minmax(0,1fr)}
  .rai__testo{padding:.25rem .5rem .75rem}
  .blocco--rovescio .blocco__foto{order:0}
  .associazioni__elenco{grid-template-columns:minmax(0,1fr);margin-top:.5rem}
  .associazioni__voce,.associazioni__voce+.associazioni__voce{padding:1.25rem 0}
  .associazioni__voce+.associazioni__voce{border-left:0;border-top:1px solid var(--linea)}
  .piede__riga{flex-wrap:wrap}
  .piede .marchio{--logo:min(17rem,(100vw - 2*var(--margine) - 4px) / .83)}
  .piede__menu{margin-left:0;width:100%}
  .piede__legale{margin-left:0}
}
@media (max-width:599px){
  .evidenza{grid-template-columns:minmax(0,1fr)}
  .evidenza__segno{width:2.75rem}
  .scheda-icona{grid-template-columns:minmax(0,1fr);gap:.7rem}
  .scheda-icona__icona{width:2.75rem;height:2.75rem;border-radius:.8rem}
  .scheda-icona__icona .ico{width:1.6rem;height:1.6rem}
  .citazione-breve,.citazione-box{grid-template-columns:minmax(0,1fr)}
  .virgolette{width:2.25rem;justify-self:center}
  .virgolette--chiusa{display:none}
  .contatto{flex-direction:column;align-items:flex-start}
  .riga-con-foto{flex-direction:column;align-items:stretch;gap:.4rem}
  .riga-con-foto .riga__foto{flex:none;width:100%}
  .riga-con-foto .riga__foto img{aspect-ratio:16/9}
  .riga-statica,.riga-link{padding-inline:0;gap:.75rem}
  /* sul telefono le righe senza la loro icona (l'icona resta accanto al titolo del riquadro): più spazio al testo */
  .righe .ico--riga{display:none}
  .scheda-dati>div{grid-template-columns:minmax(0,1fr);gap:.1rem}
  /* la tabella dei cookie da telefono: ogni riga diventa un riquadro, ogni cella col nome della sua colonna */
  .legale__tabella thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .legale__tabella,.legale__tabella tbody,.legale__tabella tr,.legale__tabella td{display:block;width:100%}
  .legale__tabella tr{margin-bottom:.75rem;border:1px solid var(--bordo);border-radius:.6rem;overflow:hidden}
  .legale__tabella td{border:0;border-top:1px solid var(--linea);padding:.5rem .75rem}
  .legale__tabella td:first-child{border-top:0;background:var(--azzurro-chiaro)}
  .legale__tabella td:not(:first-child)::before{content:attr(data-etichetta);display:block;font-size:.8125rem;font-weight:700;color:var(--grigio)}
}
/* testata non fissa quando lo schermo è basso (zoom forte, telefono in orizzontale) */
@media (max-height:500px){.testata{position:absolute}}
@media print{.a11y,.menu__bottone{display:none}}