/* Decisione 80 (2026-09-22): le pagine istituzionali scrivono grandi come la pagina di
   vendita del vecchio dominio, che Emilio ha dato come riferimento; supera la 28 sulla parte
   dei caratteri. La base cresce con lo schermo: 104% sul telefono a 390 px (16,6 px), 117,5%
   sul computer a 1440 px (18,8 px), cosi' la narrazione passa da 17 a 20 px. Tutte le misure
   in rem la seguono. I titoli di sezione, piu' sotto, salgono inoltre del 16% fuori dalle
   regole del telefono, che erano gia' in linea col riferimento. Le pagine legali restano
   fuori, alla misura di prima: sono l'unica eccezione (Emilio, 2026-09-22). */
html:not(.legale){font-size:clamp(104%, 99% + 0.2057vw, 117.5%);}
/* uav.css — impianto visivo condiviso di uavassociati.com.

   Tipografia (decisione di Emilio, 2026-09-07, vince R-01 sulla style
   guide): narrazione del copywriter in Montserrat allineata a sinistra,
   citazioni in Cormorant Garamond corsivo, titoli in Cormorant Garamond
   400, micro etichette maiuscole in Montserrat 500/600. Dal 2026-09-15,
   per la leggibilita' del chiaro sul nero, la narrazione e' in peso 400
   (era 300) e il suo corpo e' --corpo, 17 px sul computer e 16,5 sul
   telefono (decisioni 75 e 77).

   Palette: solo i colori dei token qui sotto e le loro trasparenze.
   Ogni testo sta ad almeno 4,5 a 1 sul nero: il grigio dei testi
   secondari e' #8E8882 (6 a 1) e nessun testo scende sotto l'opacita'
   .7, i segnaposto del modulo sotto .6 (decisione 76).
   Nessun bianco puro, nessuna animazione che parta da sola. Fino al
   2026-09-10 valevano anche niente gradienti e l'oro in tre usi soli: le
   decisioni 26 e 28 (pagina di vendita, poi growtizeholding.com) hanno
   aperto sfumature, ombre e bagliori d'oro, e i test seguono loro.

   Punto di rottura unico a 768px.

   I blocchi fra /* @condiviso-inizio e la sua chiusura finiscono anche in
   testata.css, che le tre pagine migrate caricano al posto di questo foglio
   intero. testata.css e' generato, non scritto: si cambia qui, si rilancia
   strumenti/sincronizza_testata.py, e test_impianto.py verifica che i due
   file non abbiano smesso di coincidere. */

/* Blocco condiviso con testata.css, che le tre pagine migrate caricano al
   posto di questo foglio intero. Non si modifica testata.css a mano: si
   cambia qui, si rilancia strumenti/sincronizza_testata.py, e si committano
   tutti e due i file. test_impianto.py fallisce se hanno smesso di
   coincidere. */
/* @condiviso-inizio */

:root{
  --nero:#000000;
  --crema:#D5D0C8;
  --oro:#B8A04A;
  --oro-12:rgba(184,160,74,.12);
  --oro-18:rgba(184,160,74,.18);
  --bordo:#1A1917;
  --bordo-forte:#2E2C28;
  /* Testo secondario: 6 a 1 sul nero; il grigio di prima stava a 3,6 a 1.
     Decisione 76. */
  --grigio:#8E8882;
  --grigio-scuro:#3A3835;
  --superficie-1:#0A0A09;
  --superficie-2:#0F0F0E;
  --superficie-3:#141412;
  /* Il bronzo della sfumatura di testata: l'oro scurito, dove Growtize ha il
     blu (decisione 28). */
  --bronzo:#534821;
  --sans:'Montserrat',sans-serif;
  --serif:'Cormorant Garamond',serif;
  /* Corpo della narrazione: 17 px sul computer, 16,5 sul telefono, dentro
     i 16-18 di R-07 (decisione 75). */
  --corpo:1.0625rem;
}

*{box-sizing:border-box;}

/* Collegamento di salto: primo elemento del corpo, visibile al focus. */
.salto{
  position:absolute;left:-999px;top:0;z-index:100;
  background:var(--crema);color:var(--nero);
  padding:.75rem 1.25rem;
  font-family:var(--sans);font-weight:600;text-transform:uppercase;
  letter-spacing:.1em;font-size:.75rem;text-decoration:none;
}
.salto:focus{left:1rem;top:1rem;}

/* === testata, menu, tendina === */
/* Decisione 28 (2026-09-11): la testata replica quella di growtizeholding.com,
   come ha chiesto Emilio, portata sui colori dello studio. Li' il fondo va dal
   nero al blu e torna nero, con un filo luminoso di due pixel sotto; qui il
   blu diventa il bronzo che si ottiene scurendo l'oro, e il filo e' oro.
   Le voci passano dal maiuscolo spaziato al tondo, come le loro. */
.testata{
  position:relative;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:1.5rem 2.5rem;padding:1.15rem 3rem;min-height:92px;
  background:var(--nero);
  background:linear-gradient(to right,rgba(20,20,18,.94),rgba(83,72,33,.94),rgba(20,20,18,.94));
  /* Interlinea dichiarata, non ereditata: le tre pagine migrate portano il
     proprio CSS con un'interlinea diversa, e la testata risultava alta 105px
     invece di 108 (misurato nel Task 13). Il punto 20 vuole che le pagine
     sembrino lo stesso studio: la testata non puo' dipendere da cosa c'e'
     sotto. */
  line-height:1.8;
}
.testata::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:radial-gradient(var(--oro) 10%,rgba(0,0,0,0) 90%);
  pointer-events:none;
}
/* Il marchio come il logo dello studio: UAV in corsivo, il filo oro, e sotto
   & ASSOCIATI in maiuscoletto. */
.marchio{
  display:inline-flex;flex-direction:column;align-items:center;gap:.3rem;
  color:var(--crema);text-decoration:none;line-height:1;
}
.marchio-uav{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.9rem;letter-spacing:.04em;}
.marchio-filo{display:block;width:3.1rem;height:1px;background:var(--oro);}
.marchio-associati{font-family:var(--sans);font-weight:500;font-size:.56rem;letter-spacing:.24em;text-transform:uppercase;}
.menu{
  display:flex;flex-wrap:wrap;align-items:center;gap:2.1rem;
  list-style:none;margin:0;padding:0;
  /* Il corpo dichiarato anche qui, non solo su .voce: la riga di ciascun <li>
     e' alta quanto il proprio corpo per l'interlinea, e senza questa riga
     dipenderebbe da quello della pagina sotto (misurato nel Task 13). */
  font-size:.95rem;
}
.voce{
  font-family:var(--sans);font-weight:600;letter-spacing:.01em;font-size:.95rem;
  color:var(--crema);text-decoration:none;
}
.voce:hover{color:var(--oro);}
.voce[aria-current="page"]{
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.45em;
}
.voce-tendina{position:relative;list-style:none;}
/* La tendina resta staccata dalla voce, ma lo stacco non puo' essere un
   margine: il margine sta fuori dalla tendina e fuori dalla voce, quindi il
   puntatore che scende da "Presenza" verso Monaco perdeva l'hover proprio
   li' e la tendina spariva prima di essere raggiunta (riprodotto con un
   passaggio vero del mouse il 2026-09-10, segnalato da Emilio: le tre citta'
   non erano cliccabili). Il ponte ::before riempie lo stacco ed e' parte della
   tendina, quindi l'hover non si interrompe. z-index 200 e non 10: sulla
   pagina di vendita la fascia ISTAT e' sticky con z-index 100 e sta subito
   sotto la testata, e copriva la tendina aperta. */
.tendina{
  display:none;position:absolute;top:calc(100% + .75rem);left:-1rem;z-index:200;
  margin:0;padding:.5rem;min-width:12rem;
  list-style:none;
  background:var(--superficie-3);
  background:linear-gradient(180deg,rgba(20,20,18,.98),rgba(10,10,9,.98));
  border:1px solid rgba(184,160,74,.25);border-radius:12px;
  box-shadow:0 18px 40px rgba(0,0,0,.55);
}
.tendina::before{
  content:"";position:absolute;left:-1px;right:-1px;
  top:calc(-.75rem - 1px);height:calc(.75rem + 1px);
}
.voce-tendina:hover .tendina,
.voce-tendina:focus-within .tendina{display:block;}
.tendina a{
  display:block;padding:.6rem .9rem;border-radius:8px;
  font-family:var(--sans);font-weight:500;letter-spacing:.01em;font-size:.9rem;
  color:var(--crema);text-decoration:none;
}
.tendina a:hover{background:rgba(184,160,74,.12);color:var(--oro);}
/* Dicitura "Private Advisory" accanto al marchio, separata da un filo
   verticale (la spec la vuole nell'intestazione, non sopra l'H1). */
.marchio-blocco{display:flex;flex-direction:row;align-items:center;gap:1.1rem;}
.marchio-etichetta{
  font-family:var(--sans);font-weight:600;text-transform:uppercase;
  letter-spacing:.2em;font-size:.6rem;color:var(--crema);opacity:.7;margin:0;
  padding-left:1.1rem;border-left:1px solid rgba(213,208,200,.25);line-height:1.6;
}

/* Il pulsante del menu a tendina sul telefono (decisione 29). Sul computer
   non esiste; sul telefono compare solo se menu.js ha aggiunto .menu-pronto
   alla testata, cosi' senza script le voci restano visibili in fila. */
.menu-apri{display:none;}

@media (max-width:768px){
  .testata{padding:.9rem 1.25rem 1rem;min-height:0;gap:.75rem 1rem;}
  .marchio-uav{font-size:1.55rem;}
  /* Senza script: gap ridotto e voci piu' piccole, tutte e cinque stanno su
     un'unica riga a 375px, con margine, non al millimetro. */
  .menu{gap:.95rem;font-size:.8rem;}
  .voce{font-size:.8rem;letter-spacing:0;}

  .testata.menu-pronto{flex-wrap:nowrap;padding:.8rem 1.25rem;}
  .testata.menu-pronto .menu-apri{
    display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
    margin-left:auto;width:44px;height:44px;padding:0;border-radius:50%;cursor:pointer;
    color:var(--crema);border:1px solid rgba(184,160,74,.35);
    background:radial-gradient(circle at 30% 30%,rgba(184,160,74,.24),rgba(184,160,74,.04));
  }
  .menu-apri-linee,.menu-apri-linee::before,.menu-apri-linee::after{
    display:block;width:18px;height:1.5px;border-radius:1px;background:currentColor;
    transition:transform .25s ease,background-color .2s ease;
  }
  .menu-apri-linee{position:relative;}
  .menu-apri-linee::before,.menu-apri-linee::after{content:"";position:absolute;left:0;}
  .menu-apri-linee::before{top:-6px;}
  .menu-apri-linee::after{top:6px;}
  .testata.aperta .menu-apri-linee{background:rgba(0,0,0,0);}
  .testata.aperta .menu-apri-linee::before{transform:translateY(6px) rotate(45deg);}
  .testata.aperta .menu-apri-linee::after{transform:translateY(-6px) rotate(-45deg);}

  /* La tendina: sotto la testata, a tutta larghezza, le voci una sotto
     l'altra e le tre citta' gia' aperte sotto Presenza. */
  .testata.menu-pronto nav{
    display:none;position:absolute;left:0;right:0;top:100%;z-index:200;
    padding:.5rem 1.25rem 1.25rem;
    /* Coprente: con un fondo appena trasparente, sotto la testata sfocata la
       pagina si leggeva attraverso la tendina (visto nella prova a 375px). */
    background:var(--superficie-3);
    background:linear-gradient(180deg,var(--superficie-3),var(--superficie-1));
    border-bottom:1px solid rgba(184,160,74,.3);
    box-shadow:0 24px 40px rgba(0,0,0,.6);
  }
  .testata.menu-pronto.aperta nav{display:block;}
  .testata.menu-pronto .menu{flex-direction:column;align-items:stretch;gap:0;font-size:1rem;}
  .testata.menu-pronto .menu > li{border-bottom:1px solid rgba(213,208,200,.08);}
  .testata.menu-pronto .menu > li:last-child{border-bottom:0;}
  .testata.menu-pronto .voce{display:block;padding:.8rem .2rem;font-size:1rem;letter-spacing:.01em;}
  .testata.menu-pronto .tendina{
    display:block;position:static;min-width:0;margin:0 0 .7rem .2rem;padding:0 0 0 .9rem;
    background:none;border:0;border-left:1px solid rgba(184,160,74,.35);border-radius:0;box-shadow:none;
  }
  .testata.menu-pronto .tendina::before{display:none;}
  .testata.menu-pronto .tendina a{padding:.45rem .6rem;font-size:.92rem;}
}

/* @condiviso-fine */

body{
  margin:0;background:var(--nero);color:var(--crema);
  font-family:var(--sans);font-weight:400;font-size:16px;line-height:1.8;
  overflow-x:clip;
}
/* I filetti dei titoli di vetrina sono larghi 100vw, barra di scorrimento
   compresa: senza questa riga la pagina scorrerebbe di lato di quei pochi
   pixel. clip e non hidden, perche' hidden farebbe della pagina un
   contenitore di scorrimento e spegnerebbe gli elementi sticky. */
html{overflow-x:clip;}
.narrazione{font-family:var(--sans);font-weight:400;font-size:var(--corpo);text-align:left;}
/* Link dentro il contenuto (rilievo trovato in anteprima al Task 6: senza
   questa riga un <a> semplice prende il blu di default del browser, mai
   dichiarato nella palette). Resta sottolineato: e' l'unico modo che
   distingue il link dal testo intorno, identico per colore.
   La regola vale su tutto .contenuto e non piu' sulla sola .narrazione: al
   Task 14 il difetto e' tornato dentro .elenco, sulla 404, perche' la
   regola vecchia guardava una classe sola e ogni contenitore nuovo doveva
   ricordarsi di chiederla. .pulsante-audit dichiara lo stesso colore, quindi
   non cambia nulla per lui. */
.contenuto a{color:var(--crema);}
.citazione{font-family:var(--serif);font-style:italic;font-weight:300;font-size:1.35em;}
/* Margine dichiarato: senza, il blockquote prende il rientro simmetrico
   di default del browser (40px anche a destra), diverso da motore a
   motore e non voluto in una colonna allineata a sinistra. */
.citazione{margin:1.5em 0 1.5em 1.5em;}

/* Nomi tecnici dentro il testo, come le chiavi e i nomi dei cookie nella
   cookie policy: cambia il carattere, non il colore ne' il corpo. */
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;color:var(--crema);}
h1,h2,h3,.titolo{font-family:var(--serif);font-weight:400;}
/* Parola chiave dell'H1 in oro (regola d'oro della style guide, uso 1 di
   3: finora sulla home compariva solo il bordo del pulsante). Una sola
   parola dell'headline, mai altro nella pagina. */
.accento{color:var(--oro);}
/* .voce sta fuori da questa riga di proposito: la sua tipografia e' gia'
   dichiarata nel blocco condiviso della testata, piu' sopra. Rimetterla
   qui la farebbe vincere sulla media query della testata,
   che azzera la spaziatura fra le lettere sotto i 768px, e "Carriere"
   tornerebbe orfana su una seconda riga (regressione vista e misurata nel
   Task 13, testata alta 254px invece di 227). */
.occhiello,.didascalia{
  font-family:var(--sans);font-weight:600;text-transform:uppercase;letter-spacing:.15em;
}
.occhiello{color:var(--grigio);font-size:.8rem;margin:0 0 .75rem;}
.didascalia{color:var(--grigio);font-size:.7rem;letter-spacing:.1em;margin:.75rem 0 0;}

.contenuto{max-width:72rem;margin:0 auto;padding:4rem 2rem;}

/* Elenchi dentro il contenuto. Il piede ha i suoi, questi no: classe e non
   selettore di tag, cosi' nessun <ul> se la prende senza chiederlo. */
.elenco{font-family:var(--sans);font-weight:400;font-size:var(--corpo);margin:0 0 1rem;padding-left:1.25rem;}
.elenco li{margin:0 0 .5rem;}
.sezione{margin:0 0 5rem;}
.sezione:last-child{margin-bottom:0;}

.scheda{
  background:var(--superficie-1);
  border:1px solid var(--bordo);
  padding:2rem;
}
.scheda img{display:block;width:100%;height:auto;}

/* Riquadri affiancati per le immagini di lavoro (home): tre colonne pari,
   una sola sotto i 768px insieme al resto del contenuto. */
/* Stessa griglia a tre colonne quando le schede portano solo testo
   (gli associati in Lo Studio): il nome .griglia-immagini mentirebbe. */
.griglia-immagini,.griglia-tre{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;}

/* Piede sul modello di growtizeholding.com (decisione 28), con il testo
   deciso da Emilio il 2026-09-12 (decisione 41), uguale su ogni pagina: il
   marchio, tre righe di dati (Private Advisory e la societa', le tre citta',
   il BIN), le icone tonde e i collegamenti legali piccoli con le preferenze
   dei cookie. Il bagliore viene dal basso, il filo oro in alto e' lo stesso
   della testata. */
.piede{
  position:relative;
  display:flex;flex-direction:column;align-items:center;gap:1.15rem;text-align:center;
  /* Il padding-bottom extra riserva lo spazio del banner .consenso, fisso
     in fondo alla pagina: senza, l'ultima riga resterebbe coperta e mai
     raggiungibile scorrendo. */
  padding:4.5rem 2rem 9rem;
  background:var(--nero);
  background:radial-gradient(ellipse 55% 70% at 50% 100%,rgba(184,160,74,.10),rgba(0,0,0,0) 70%),var(--nero);
}
.piede::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:radial-gradient(rgba(184,160,74,.55) 10%,rgba(0,0,0,0) 80%);
}
.piede ul{list-style:none;margin:0;padding:0;}
.piede a{color:var(--crema);text-decoration:none;}
.piede a:hover{color:var(--oro);}
.piede-dati{display:flex;flex-direction:column;gap:.3rem;}
.piede-dati p{font-family:var(--sans);font-weight:400;font-size:.85rem;letter-spacing:.02em;line-height:1.5;margin:0;}
.piede-icone{display:flex;gap:.8rem;margin:.35rem 0;}
.piede-icona{
  display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;
  border-radius:50%;color:var(--oro) !important;
  background:radial-gradient(circle at 30% 30%,rgba(184,160,74,.24),rgba(184,160,74,.04));
  border:1px solid rgba(184,160,74,.3);
  transition:background .25s ease,border-color .25s ease;
}
.piede-icona:hover{border-color:var(--oro);background:rgba(184,160,74,.2);}
.piede-legali{display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem 1.5rem;margin-top:.4rem !important;}
.piede-legali a,.piede-legali .piede-azione{font-size:.75rem;opacity:.72;}
/* Blocco condiviso con testata.css, che le tre pagine migrate caricano al
   posto di questo foglio intero. Non si modifica testata.css a mano: si
   cambia qui, si rilancia strumenti/sincronizza_testata.py, e si committano
   tutti e due i file. test_impianto.py fallisce se hanno smesso di
   coincidere. */
/* @condiviso-inizio */

/* Collegamento discreto che riapre il banner di consenso (rilievo della
   revisione del Task 4: chi rifiuta non aveva modo di cambiare idea
   senza svuotare i dati del browser). E' un <button>, non un link, ma
   deve confondersi con le voci intorno: stessi font, peso, dimensione e
   colore di .piede a, nessun rilievo che lo faccia "urlare". Il
   comportamento vive in consenso.js. */
.piede-azione{
  background:none;border:none;margin:0;padding:0;
  font-family:var(--sans);font-weight:400;font-size:.9rem;
  color:var(--crema);text-decoration:none;cursor:pointer;
}

.consenso{
  /* Stessa ragione della testata: il banner e' identico su tutte e sedici le
     pagine e non deve ereditare l'interlinea di quella che lo ospita. */
  line-height:1.8;
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:1rem;padding:1.25rem 2rem;
  background:var(--superficie-3);
  border-top:1px solid var(--bordo-forte);
  color:var(--crema);
}
.consenso p{margin:0;font-family:var(--sans);font-weight:400;font-size:.85rem;}
.consenso a{color:var(--crema);}
.consenso-azioni{display:flex;flex-wrap:wrap;gap:.75rem;}
/* Un consenso dove rifiutare non e' facile quanto accettare non e' un
   consenso valido: le due scelte condividono famiglia, peso, dimensione
   e riquadro, cosi' nessuna delle due risulta nascosta o sbiadita
   rispetto all'altra. La sola differenza e' pieno/a contorno, non
   rilievo visivo. Nessuna logica qui: il comportamento vive in
   consenso.js, di un'altra attivita'. */
.consenso button{
  font-family:var(--sans);font-weight:600;text-transform:uppercase;
  letter-spacing:.1em;font-size:.75rem;cursor:pointer;
  border:1px solid var(--crema);
  padding:.65rem 1.5rem;
}
.consenso-accetta{background:var(--crema);color:var(--nero);}
.consenso-rifiuta{background:transparent;color:var(--crema);}

/* Il banner nascosto (rifiuto o accettazione gia' registrati) usa
   l'attributo hidden: senza questa riga resterebbe visibile lo stesso,
   perche' il display:flex della regola sopra e' stile d'autore e vince
   sempre sullo stile predefinito del browser per [hidden]. Il
   comportamento (quando nascondere) vive in consenso.js. */
.consenso[hidden]{display:none;}

/* Avviso in linea per i servizi necessari al funzionamento della pagina
   di vendita (Wistia per il video, Whop per il pagamento): non partono
   da soli al caricamento, restano al posto del riquadro vero finche' non
   si clicca. Stessa famiglia visiva del banner sopra: riquadro scuro,
   pulsante pieno, nessun rilievo aggiuntivo. Il comportamento vive in
   consenso.js. */
.consenso-servizio-avviso{
  background:var(--superficie-1);
  border:1px solid var(--bordo);
  padding:2rem;
  text-align:center;
}
.consenso-servizio-avviso p{
  margin:0 0 1.25rem;
  font-family:var(--sans);font-weight:400;font-size:.9rem;
  color:var(--crema);
}
.consenso-servizio-pulsante{
  font-family:var(--sans);font-weight:600;text-transform:uppercase;
  letter-spacing:.1em;font-size:.75rem;cursor:pointer;
  background:var(--crema);color:var(--nero);
  border:1px solid var(--crema);
  padding:.65rem 1.5rem;
}

/* Il contenitore di Wistia (rilievo della revisione del Task 4): eseguito
   il vero motore fast.wistia.com, il markup semplice sotto produceva un
   riquadro alto 27px e largo zero, quindi invisibile. Il rapporto 16:9
   nasce dal trucco del padding percentuale (valido a qualunque larghezza,
   non serve il supporto di aspect-ratio) applicato al contenitore stesso;
   l'avviso prima del clic e il video vero dopo riempiono lo stesso
   riquadro, cosi' non c'e' nessun salto di layout fra i due stati. */
.consenso-video-wistia{position:relative;width:100%;padding-top:56.25%;}
.consenso-video-wistia .consenso-servizio-avviso{
  position:absolute;inset:0;width:100%;height:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.consenso-video-wistia .wistia_embed{
  position:absolute;inset:0;width:100%;height:100%;
}

/* Accessibilita' minima: contorno oro a un pixel su ogni elemento
   attivabile. E' l'unico uso di --oro oltre ai tre della style guide. */
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{
  outline:1px solid var(--oro);outline-offset:2px;
}


/* @condiviso-fine */

/* Convenzione dichiarata per ogni tabella futura: mai la pagina scorre
   in orizzontale, solo il suo contenitore.
   <div class="tabella-contenitore"><table>...</table></div> */
.tabella-contenitore{overflow-x:auto;}
/* Il minimo perche' una tabella si legga su fondo nero: righe separate da
   un bordo della palette, intestazioni nel lessico delle micro etichette.
   Nessuna banda alternata, nessuno sfondo di riga. */
.tabella-contenitore table{border-collapse:collapse;width:100%;min-width:34rem;}
.tabella-contenitore th,.tabella-contenitore td{
  border:1px solid var(--bordo);padding:.85rem 1rem;text-align:left;vertical-align:top;
}
.tabella-contenitore th{
  font-family:var(--sans);font-weight:600;text-transform:uppercase;
  letter-spacing:.15em;font-size:.7rem;color:var(--grigio);
}
.tabella-contenitore td{font-family:var(--sans);font-weight:400;}

@media (max-width:768px){
  body{font-size:15px;}
  .contenuto{padding:2.5rem 1.25rem;}
  .sezione{margin-bottom:3.5rem;}
  .griglia-immagini,.griglia-tre{grid-template-columns:1fr;gap:1.5rem;}
  .piede{padding:3.5rem 1.25rem 14rem;gap:1rem;}
}

/* =====================================================================
   Vetrina: le pagine istituzionali sul modello di /audit-diagnostico/
   (decisione 26). Emilio, 2026-09-10: troppo muro di testo, prendere
   spunto dalla pagina di vendita, alternanza di immagini e testo, testo
   centrato. Le classi hanno di proposito gli stessi nomi del foglio
   incorporato in /audit-diagnostico/: quando arriva l'HTML di un'altra
   pagina da replicare, il markup si porta senza tradurlo.

   Rispetto a quel foglio cambia solo cio' che i test del sito fanno
   valere: i colori stanno sui token (i filetti chiari al 18% e al 10%
   diventano --bordo-forte e --bordo, il bianco puro diventa crema),
   nessun gradiente (i divisori sono un segmento pieno), nessuna ombra,
   nessuna transizione, un solo punto di rottura a 768px. Le pagine legali
   restano sulle classi di sopra: sono documenti da leggere, non vetrina.
   ===================================================================== */

:root{
  /* Gli indicatori della tabella di confronto, gli stessi della pagina di
     vendita. Si usano solo in .board-diag, table.cat e .cat-card. */
  --verde:#4ADB6E;
  --giallo:#FFB84A;
  --rosso:#FF5A5A;
}

.contenuto.vetrina{max-width:none;padding:0;}

/* Apertura */
.uav-hero{
  text-align:center;padding:88px 24px 64px;position:relative;
  background:
    radial-gradient(ellipse 55% 75% at 50% 0%,rgba(184,160,74,.17),rgba(0,0,0,0) 70%),
    radial-gradient(ellipse 35% 60% at 100% 60%,rgba(184,160,74,.07),rgba(0,0,0,0) 70%),
    radial-gradient(ellipse 35% 60% at 0% 60%,rgba(184,160,74,.05),rgba(0,0,0,0) 70%);
}
.uav-pre-headline,.pillola{
  display:inline-block;font-family:var(--sans);font-size:.66rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--crema);line-height:1;
  padding:.6rem 1.05rem;margin:0 auto 22px;border-radius:999px;
  border:1px solid rgba(213,208,200,.26);background:rgba(213,208,200,.045);
}
.pillola-riga{text-align:center;margin:0;}
/* Piu' piccolo della pagina di vendita, per chiesta di Emilio (decisione 28:
   il sito istituzionale scrive piu' piccolo della optin), ma sempre sopra i
   titoli di sezione. */
.uav-headline{
  font-family:var(--serif);font-size:clamp(2rem,4vw,3rem);font-weight:300;
  font-style:italic;line-height:1.22;max-width:920px;margin:0 auto 20px;
  color:var(--crema);text-wrap:balance;
}
.uav-headline .accento{font-weight:500;}
.uav-sub{
  font-family:var(--serif);font-size:clamp(1rem,1.7vw,1.18rem);font-style:italic;
  color:var(--crema);max-width:780px;margin:0 auto;line-height:1.6;text-wrap:balance;
}

/* Lead */
.uav-s2-inner{max-width:820px;margin:0 auto;padding:40px 24px 72px;text-align:center;}
.uav-title{
  font-family:var(--serif);font-size:clamp(1.682rem,3.132vw,2.378rem);font-weight:300;
  line-height:1.2;color:var(--crema);margin:0 auto 32px;max-width:720px;
}
.uav-title::before,.sec-title::before{
  content:"";display:block;width:100vw;height:1px;background:var(--bordo-forte);
  margin:0 calc(50% - 50vw) 48px;
}
.uav-title strong{font-weight:600;}
.uav-copy{
  font-family:var(--sans);font-size:var(--corpo);font-weight:400;
  color:var(--crema);line-height:1.75;max-width:620px;margin:0 auto 16px;
}
.uav-copy strong{font-weight:600;}
.uav-emph-line{
  display:block;font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:clamp(1.2rem,1.9vw,1.45rem);line-height:1.5;color:var(--crema);
  margin:12px auto;max-width:600px;
}
.uav-emph-line.plain-on-mobile{
  font-family:var(--sans);font-style:normal;font-weight:400;
  font-size:var(--corpo);line-height:1.75;max-width:620px;margin:0 auto 16px;
}
.uav-divider,.mini-divider{width:72px;height:1px;background:var(--bordo-forte);margin:36px auto;}
.mini-divider{margin:56px auto;}

/* Sezioni */
.sec-full{padding:72px 24px;position:relative;}
.sec{max-width:1100px;margin:0 auto;}
.sec-narrow{max-width:680px;margin:0 auto;padding:56px 24px 24px;text-align:center;}
.sec-narrow+.sec-full{padding-top:32px;}
.sec-title{
  font-family:var(--serif);font-size:clamp(1.972rem,3.48vw,2.726rem);font-weight:300;
  line-height:1.2;color:var(--crema);max-width:720px;margin:0 auto 28px;text-align:center;
}
.sec-title::before{margin-bottom:52px;}
.sec-title-tight{font-size:clamp(1.682rem,3.016vw,2.436rem);max-width:780px;}
/* Titolo senza filetto sopra: dopo una pillola, o dove la sezione ha gia'
   il suo bordo. */
.sec-title.senza-filo::before,.uav-title.senza-filo::before{display:none;}
.sec-title-onerow{max-width:1040px;}
.sec-title strong{font-weight:600;display:block;margin-top:6px;}
.sec-title strong.italic{font-style:italic;}
.sec-title .oro{color:var(--oro);}
.sec-subtitle{
  font-family:var(--serif);font-size:clamp(1.682rem,2.784vw,2.146rem);font-weight:300;
  line-height:1.25;color:var(--crema);max-width:760px;margin:0 auto 24px;text-align:center;
}
.sec-subtitle em{font-style:italic;color:var(--oro);}
.sec-copy{
  font-family:var(--sans);font-size:var(--corpo);font-weight:400;
  line-height:1.75;color:var(--crema);max-width:620px;margin:0 auto 18px;text-align:center;
}
.sec-copy strong,.sec-copy-forte{font-weight:600;}
.sec-copy em{font-style:italic;color:var(--oro);}
.copy-quote{
  font-family:var(--serif);font-style:italic;font-weight:300;
  font-size:clamp(1.1rem,1.6vw,1.3rem);line-height:1.55;color:var(--crema);
  max-width:620px;margin:18px auto 0;opacity:.92;text-align:center;
}
/* Decisione 85: chiusure e rimandi in Cormorant alti quanto il testo corrente, a ogni
   larghezza: 1.42rem come .mid-bridge (il Cormorant ha la x il 26% piu' bassa). */
.sec-closing{
  font-family:var(--serif);font-weight:300;font-size:1.42rem;
  line-height:1.55;color:var(--crema);max-width:620px;margin:14px auto 0;text-align:center;
}
.sec-bridge{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:1.42rem;color:var(--oro);opacity:.92;
  margin:24px auto 0;max-width:520px;text-align:center;
}
/* Una riga di testo che su computer deve stare intera (Lo Studio, settori). */
.sec-copy.riga-larga{max-width:760px;}
/* Gli stacchi che la pagina di vendita scrive in linea (style="margin-top"). */
.stacco-s{margin-top:14px;}
.stacco-m{margin-top:28px;}
.stacco-l{margin-top:56px;}
/* Lo stesso stacco sotto: in Advisory, fra il paragrafo che precede
   l'offerta e la scheda dell'offerta (2026-09-12). */
.stacco-sotto-l{margin-bottom:56px;}

/* Vecchio modo contro nuovo processo */
.board-diag{
  background:var(--superficie-2);
  background:linear-gradient(180deg,rgba(213,208,200,.05),rgba(213,208,200,.012));
  border:1px solid rgba(213,208,200,.1);border-radius:16px;
  box-shadow:0 24px 60px rgba(0,0,0,.45);
  padding:40px 34px;max-width:900px;margin:36px auto;color:var(--crema);
}
.diag-grid{
  display:grid;grid-template-columns:1fr 1fr;
  border-top:1px solid var(--bordo-forte);border-bottom:1px solid var(--bordo-forte);
}
.diag-col{display:flex;flex-direction:column;}
.diag-col-old{border-right:1px solid var(--bordo-forte);}
.diag-h-col{
  font-family:var(--sans);font-weight:600;text-align:center;
  font-size:clamp(.88rem,1.1vw,1rem);padding:16px 14px;
  border-bottom:1px solid var(--bordo-forte);letter-spacing:.22em;text-transform:uppercase;
}
.diag-h-col.old{color:var(--rosso);}
.diag-h-col.new{color:var(--oro);}
.diag-row{
  font-family:var(--sans);font-weight:400;font-size:var(--corpo);
  line-height:1.65;padding:17px 18px;border-bottom:1px solid var(--bordo);
  display:flex;align-items:flex-start;gap:12px;color:var(--crema);text-align:left;
}
.diag-col .diag-row:last-child{border-bottom:0;}
.diag-col-old .diag-row{opacity:.78;}
.diag-row b{font-weight:600;}
.diag-col-new .diag-row b{color:var(--oro);}
.diag-glyph{flex:0 0 auto;font-weight:600;font-size:1.05em;line-height:1.3;}
.diag-glyph.x{color:var(--rosso);}
.diag-glyph.v{color:var(--oro);}

/* I sei strumenti: tabella sopra i 768px, schede sotto */
.board-tbl{
  background:var(--superficie-2);
  background:linear-gradient(180deg,rgba(213,208,200,.05),rgba(213,208,200,.012));
  border:1px solid rgba(213,208,200,.1);border-radius:16px;
  box-shadow:0 24px 60px rgba(0,0,0,.45);
  padding:30px 24px;max-width:none;margin:36px auto;color:var(--crema);
  width:min(1320px,calc(100vw - 64px));position:relative;left:50%;transform:translateX(-50%);
}
table.cat{width:100%;border-collapse:collapse;font-family:var(--serif);color:var(--crema);table-layout:fixed;}
table.cat col.col-strumento{width:21%;}
table.cat col.col-data{width:13.16%;}
table.cat thead th{
  font-family:var(--serif);font-weight:600;font-size:clamp(.72rem,.85vw,.84rem);
  color:var(--crema);border-bottom:1px solid var(--bordo-forte);padding:14px 8px;
  text-align:center;letter-spacing:.14em;line-height:1.35;text-transform:uppercase;
  vertical-align:bottom;
}
table.cat thead th:first-child{text-align:left;padding-left:6px;}
table.cat tbody th{
  font-family:var(--serif);text-align:left;color:var(--crema);font-weight:500;font-style:italic;
  padding:18px 10px 18px 6px;border-bottom:1px solid var(--bordo);
  font-size:1.42rem;line-height:1.25;position:relative;
}
table.cat tbody td{
  font-family:var(--serif);border-bottom:1px solid var(--bordo);padding:18px 8px;
  text-align:center;vertical-align:middle;line-height:1.3;font-weight:400;font-style:italic;
  font-size:clamp(.88rem,calc(2.35vw - 5.5px),1.35rem);color:var(--crema);hyphens:manual;
}
/* Decisione 86: sul computer la tabella resta in Cormorant, alta quanto il testo corrente (1.35rem,
   entro l'8%), ed esce dalla colonna del testo fino a 1320 px (.board-tbl); sotto i 1280 px il corpo
   scende quanto serve perche' la parola piu' lunga stia intera nella colonna, niente trattini, ma non
   sotto il minimo di prima (.88rem) sui tablet in verticale. Sul
   telefono le schede qui sotto passano al Montserrat. */
table.cat tbody tr:last-child th,table.cat tbody tr:last-child td{border-bottom:0;}
table.cat td.v,table.cat tr.uav td{color:var(--verde);font-weight:500;}
table.cat td.y{color:var(--giallo);font-weight:500;}
table.cat td.r{color:var(--rosso);font-weight:500;}
table.cat tr.uav th{color:var(--verde);font-weight:600;}
table.cat tr.uav th::before{
  content:"";position:absolute;left:-2px;top:14px;bottom:14px;width:2px;background:var(--verde);
}
.cat-mobile{display:none;}
.cat-card{
  background:var(--nero);border:1px solid rgba(213,208,200,.1);border-radius:12px;
  padding:18px 18px 14px;margin-bottom:14px;position:relative;text-align:left;
}
.cat-card:last-child{margin-bottom:0;}
.cat-card.cat-card-uav{
  border-color:var(--verde);border-color:color-mix(in srgb,var(--verde) 40%,transparent);
  background:color-mix(in srgb,var(--verde) 4%,transparent);
}
.cat-card.cat-card-uav::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--verde);
}
.cat-card-title{
  font-family:var(--serif);font-style:italic;font-weight:500;font-size:1.5rem;
  color:var(--crema);line-height:1.3;margin-bottom:12px;padding-bottom:10px;
  border-bottom:1px solid var(--bordo);
}
.cat-card.cat-card-uav .cat-card-title{color:var(--verde);font-weight:600;}
.cat-card-row{
  display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
  padding:7px 0;font-family:var(--serif);
}
.cat-card-label{
  font-family:var(--sans);font-size:.72rem;color:var(--grigio);letter-spacing:.14em;text-transform:uppercase;
  font-weight:600;flex:0 0 42%;line-height:1.4;padding-top:4px;
}
.cat-card-value{font-family:var(--sans);font-size:var(--corpo);color:var(--crema);font-style:normal;text-align:right;flex:1;line-height:1.4;}
.cat-card-value.v{color:var(--verde);font-weight:500;}
.cat-card-value.y{color:var(--giallo);font-weight:500;}
.cat-card-value.r{color:var(--rosso);font-weight:500;}

/* Le distinzioni di categoria */
.distinct{max-width:660px;margin:0 auto 32px;text-align:left;}
.distinct p{
  font-size:var(--corpo);line-height:1.7;margin:0 0 16px;
  font-family:var(--sans);font-weight:400;color:var(--crema);
}
.distinct strong{font-weight:600;}

/* Anteprima dell'audit: la copertina vera, con due fogli dietro */
.audit-stack{position:relative;max-width:380px;aspect-ratio:1/1.414;margin:36px auto;transform:rotate(-1deg);}
.audit-stack-back,.audit-stack-mid{
  position:absolute;inset:0;background:var(--superficie-1);
  border:1px solid var(--bordo);border-radius:3px;pointer-events:none;
}
.audit-stack-back{transform:translate(10px,12px) rotate(2.2deg);opacity:.55;}
.audit-stack-mid{transform:translate(5px,6px) rotate(1deg);opacity:.78;border-color:var(--bordo-forte);}
.audit-preview{
  position:relative;width:100%;height:100%;background:var(--superficie-1);
  border:1px solid var(--bordo-forte);border-radius:3px;padding:18px 18px 14px;
  text-align:center;overflow:hidden;font-family:var(--sans);
  display:flex;flex-direction:column;justify-content:space-between;color:var(--crema);
}
.ap-classif{
  display:inline-flex;align-items:center;gap:6px;border:1px solid var(--bordo-forte);
  padding:3px 9px;margin:0 auto 14px;
}
.ap-classif-dot{width:4px;height:4px;background:var(--crema);border-radius:50%;}
.ap-classif-text{
  font-family:var(--serif);font-size:6.5px;letter-spacing:.3em;color:var(--crema);
  text-transform:uppercase;font-weight:500;
}
.ap-brand{font-family:var(--serif);font-size:1.6rem;font-weight:300;letter-spacing:.12em;line-height:1;margin-bottom:3px;}
.ap-studio{
  font-family:var(--sans);font-size:5.5px;letter-spacing:.32em;text-transform:uppercase;
  opacity:.45;font-weight:500;margin-bottom:14px;
}
.ap-divider-v{width:1px;height:20px;background:var(--crema);opacity:.5;margin:0 auto 12px;}
.ap-service-label{
  font-family:var(--serif);font-size:6.5px;letter-spacing:.42em;text-transform:uppercase;
  opacity:.6;margin-bottom:8px;
}
.ap-cover-title{font-family:var(--serif);font-size:1.972rem;font-weight:300;letter-spacing:1.5px;line-height:1;margin-bottom:6px;}
.ap-cover-sub{
  font-family:var(--serif);font-size:.55rem;font-style:italic;letter-spacing:.12em;
  line-height:1.4;margin:6px auto 14px;max-width:90%;
}
.ap-case{display:flex;gap:10px;align-items:center;justify-content:center;margin:0 auto;}
.ap-case-item{display:flex;flex-direction:column;align-items:center;gap:1px;}
.ap-case-label{font-family:var(--serif);font-size:5px;letter-spacing:.28em;text-transform:uppercase;opacity:.5;}
.ap-case-val{font-family:var(--serif);font-size:7px;letter-spacing:.08em;}
.ap-case-sep{width:1px;height:14px;background:var(--bordo-forte);}
.ap-cover-meta{
  margin-top:auto;padding-top:8px;border-top:1px solid var(--bordo);
  display:flex;justify-content:space-between;font-family:var(--serif);font-size:6px;
  letter-spacing:.04em;text-align:left;line-height:1.5;
}
.ap-cover-meta b{
  display:block;font-size:5px;letter-spacing:.24em;text-transform:uppercase;
  opacity:.5;font-weight:500;margin-bottom:2px;
}
.ap-destra{text-align:right;}
/* Sulla pagina di vendita la classe non e' dichiarata e la barra non si
   vede: qui c'e', perche' e' il nominativo oscurato che la didascalia
   promette. */
.ap-redacted{
  display:inline-block;width:58px;height:6px;margin-right:6px;
  background:var(--grigio-scuro);vertical-align:middle;
}
.audit-cap{
  font-family:var(--sans);font-size:.7rem;letter-spacing:.18em;color:var(--grigio);
  text-transform:uppercase;margin-top:14px;text-align:center;
}

/* Tre schede numerate */
.diag-grid-cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
  max-width:1040px;margin:32px auto 0;padding:0 8px;
}
.diag-card{
  position:relative;overflow:hidden;
  background:var(--superficie-1);
  background:linear-gradient(180deg,rgba(213,208,200,.055),rgba(213,208,200,.015));
  border:1px solid rgba(213,208,200,.1);border-radius:16px;
  box-shadow:0 18px 44px rgba(0,0,0,.4);
  padding:28px 24px;text-align:left;
}
/* Il filo luminoso in cima alla scheda, lo stesso della testata. */
.diag-card::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:radial-gradient(rgba(184,160,74,.7) 10%,rgba(0,0,0,0) 80%);
}
.diag-num{font-family:var(--serif);font-size:1.9rem;font-weight:300;color:var(--oro);margin:0 0 12px;line-height:1;}
.diag-label{
  font-family:var(--sans);font-size:.76rem;font-weight:600;letter-spacing:.18em;
  color:var(--crema);text-transform:uppercase;margin:0 0 12px;line-height:1.5;
}
.diag-grid-cards.due{grid-template-columns:repeat(2,1fr);max-width:900px;}
.diag-text{font-family:var(--sans);font-size:var(--corpo);font-weight:400;line-height:1.7;color:var(--crema);margin:0;}
.diag-text+.diag-text{margin-top:12px;}
.diag-text a{text-underline-offset:2px;}

/* Rimando sobrio a un'altra pagina */
.mid-bridge{
  max-width:560px;margin:48px auto 0;text-align:center;padding:20px 24px;
  border-top:1px solid var(--oro-18);border-bottom:1px solid var(--oro-18);
}
/* Decisione 85: il rimando e' alto quanto il testo corrente. Il Cormorant ha la x
   il 26% piu' bassa del Montserrat, quindi 1.42rem valgono i 17-20 px di --corpo. */
.mid-bridge a{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:1.42rem;color:var(--crema);text-decoration:none;line-height:1.5;
}
.mid-bridge a strong{color:var(--oro);font-weight:500;font-style:italic;}
.mid-bridge-segue{margin-top:0;border-top:0;}

/* Immagini di lavoro in riga, con la didascalia che dice il vero luogo */
.vetrina-immagini{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
  max-width:1040px;margin:36px auto 0;
}
.vetrina-immagini figure{margin:0;}
.vetrina-immagini .didascalia{text-align:center;}

/* Elenco di collegamenti centrato, senza punti */
.elenco-vetrina{list-style:none;padding:0;margin:0 auto;max-width:640px;text-align:center;font-size:clamp(1.05rem,1.7vw,1.25rem);}

/* Pulsante: lo stesso della pagina di vendita, bordo oro a un pixel */
.cta-wrap{text-align:center;margin:40px auto 0;}
/* Pulsante: bordo oro come sulla pagina di vendita, ma arrotondato e con il
   bagliore, come i pulsanti di growtizeholding.com (decisione 28). */
.pulsante{
  display:inline-block;font-family:var(--sans);font-size:.78rem;
  font-weight:600;letter-spacing:.2em;text-transform:uppercase;line-height:1.5;
  color:var(--crema);text-decoration:none;border:1px solid var(--oro);
  padding:14px 30px;border-radius:12px;
  background:linear-gradient(180deg,rgba(184,160,74,.24),rgba(184,160,74,.08));
  box-shadow:0 0 28px rgba(184,160,74,.18);
  transition:background .25s ease,box-shadow .25s ease;
}
.pulsante:hover{background:linear-gradient(180deg,rgba(184,160,74,.4),rgba(184,160,74,.16));box-shadow:0 0 36px rgba(184,160,74,.3);}

/* Fotografia accanto al testo; -inverso mette la fotografia a destra */
.bio-wrap{
  display:grid;grid-template-columns:340px 1fr;gap:48px;max-width:900px;
  margin:0 auto;align-items:center;text-align:left;
}
.bio-wrap.inverso{grid-template-columns:1fr 340px;}
.bio-wrap.inverso .bio-photo{order:2;}
.bio-photo{width:100%;border:1px solid rgba(184,160,74,.25);border-radius:16px;overflow:hidden;background:var(--superficie-1);margin:0;box-shadow:0 24px 60px rgba(0,0,0,.5);}
.bio-photo img{width:100%;height:auto;display:block;}
.bio-copy{font-family:var(--sans);font-size:var(--corpo);font-weight:400;line-height:1.75;color:var(--crema);}
.bio-copy p{margin:0 0 14px;}
.bio-copy p:last-child{margin-bottom:0;}
.bio-copy strong{font-weight:600;}
.bio-copy em{font-style:italic;color:var(--oro);}
.bio-titolo{font-family:var(--serif);font-weight:400;font-size:clamp(1.566rem,2.32vw,1.914rem);line-height:1.25;margin:0 0 16px;}

/* Citazione in riquadro */
.quote-card{
  background:var(--superficie-1);
  background:linear-gradient(135deg,rgba(184,160,74,.12),rgba(213,208,200,.02) 60%);
  border:1px solid rgba(184,160,74,.22);border-left:3px solid var(--oro);padding:28px 32px;
  border-radius:16px;max-width:600px;margin:48px auto;text-align:left;
  box-shadow:0 18px 44px rgba(0,0,0,.4);
}
.quote-text{
  font-family:var(--serif);font-style:italic;font-weight:300;
  font-size:clamp(1.15rem,1.8vw,1.35rem);line-height:1.55;color:var(--crema);margin:0;
}
.quote-attr{
  font-family:var(--sans);font-size:.9rem;font-weight:600;letter-spacing:.16em;
  color:var(--grigio);text-transform:uppercase;margin:18px 0 0;
}

/* Numero in evidenza */
.mini-stat{
  max-width:680px;margin:36px auto 0;display:flex;align-items:center;gap:24px;
  background:var(--superficie-1);
  background:linear-gradient(135deg,rgba(184,160,74,.10),rgba(213,208,200,.02) 60%);
  border:1px solid rgba(213,208,200,.1);border-left:3px solid var(--oro);
  border-radius:16px;padding:24px 28px;text-align:left;box-shadow:0 18px 44px rgba(0,0,0,.4);
}
.mini-stat-num{
  font-family:var(--serif);font-weight:600;font-size:clamp(2.1rem,3.2vw,2.7rem);
  color:var(--crema);line-height:1;flex:0 0 auto;letter-spacing:-.01em;
}
.mini-stat-body{font-family:var(--sans);font-size:var(--corpo);font-weight:400;line-height:1.55;color:var(--crema);}
.mini-stat-body b{font-weight:600;}

/* Riga dei settori */
.sectors-wrap{max-width:780px;margin:28px auto 0;text-align:center;}
.sectors-eyebrow{
  font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.22em;
  color:var(--oro);text-transform:uppercase;margin-bottom:14px;
}
.sectors-list{
  font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1rem,1.3vw,1.12rem);
  line-height:1.7;color:var(--crema);opacity:.88;letter-spacing:.02em;
}
.sectors-list span{display:inline-block;margin:0 4px;}
.sectors-sep{color:var(--oro);opacity:.5;margin:0 2px;font-style:normal;}

/* Schede dei casi */
.testi-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;
  max-width:1100px;margin:32px auto 0;padding:0 8px;
}
.testi-card{
  background:var(--superficie-1);
  background:linear-gradient(180deg,rgba(213,208,200,.055),rgba(213,208,200,.015));
  border:1px solid rgba(213,208,200,.1);border-radius:16px;box-shadow:0 18px 44px rgba(0,0,0,.4);
  padding:22px;text-align:left;display:flex;flex-direction:column;
}
/* La fotografia della scheda, come sulla pagina di vendita: quadrata, ritagliata
   al centro. Le fotografie sono in Casi dal 2026-09-11 (decisione 27). */
.testi-photo{width:100%;aspect-ratio:1/1;border-radius:12px;margin-bottom:16px;overflow:hidden;background:var(--nero);}
.testi-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.testi-id{
  font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.16em;
  color:var(--grigio);text-transform:uppercase;margin-bottom:4px;
}
.testi-profile{
  font-family:var(--sans);font-size:.82rem;font-weight:500;letter-spacing:.12em;
  color:var(--crema);text-transform:uppercase;margin:0 0 14px;line-height:1.5;
}
.testi-quote{font-family:var(--serif);font-style:italic;font-weight:300;font-size:1.04rem;line-height:1.55;color:var(--crema);margin:0;}
.testi-quote strong{font-weight:500;font-style:italic;}
/* Anteprima in home: tre schede su una riga anche dove auto-fit ne metterebbe due. */
.testi-grid.tre{grid-template-columns:repeat(3,1fr);}
/* R-01: il corsivo serif e' per le citazioni. La narrazione dentro la
   scheda resta in Montserrat, anche dove la pagina di vendita la mette in
   corsivo. */
.testi-testo{font-family:var(--sans);font-weight:400;font-size:.93rem;line-height:1.65;color:var(--crema);margin:0 0 10px;}
.testi-quote+.testi-testo{margin-top:14px;}
.testi-esito{
  font-family:var(--sans);font-size:.86rem;font-weight:400;line-height:1.6;color:var(--crema);
  margin:auto 0 0;padding-top:14px;border-top:1px solid rgba(213,208,200,.1);
}

@media (max-width:768px){
  :root{--corpo:1.03rem;}
  .uav-hero{padding:56px 16px 44px;}
  .uav-pre-headline,.pillola{font-size:.62rem;letter-spacing:.16em;margin-bottom:18px;}
  .uav-headline{font-size:2.1rem;line-height:1.18;margin-bottom:14px;}
  .uav-sub{font-size:1.08rem;line-height:1.5;}
  .uav-s2-inner{padding:28px 18px 48px;}
  .uav-title{font-size:1.4rem;margin-bottom:22px;}
  .uav-title::before{margin-bottom:32px;}
  .uav-emph-line{font-size:1.12rem;margin:10px auto;}
  .uav-emph-line.plain-on-mobile{max-width:100%;margin:0 0 16px;text-align:left;}
  /* Come sulla pagina di vendita: sul telefono la prosa lunga torna a
     sinistra, i titoli restano centrati. */
  .uav-copy,.sec-copy,.copy-quote{text-align:left;}
  .sec-full{padding:60px 20px;}
  .sec-title{font-size:1.55rem;margin-bottom:22px;}
  .sec-title::before{margin-bottom:36px;}
  .sec-title-tight{font-size:1.3rem;}
  .sec-subtitle{font-size:1.35rem;margin-bottom:18px;}
  .copy-quote{font-size:1.05rem;}
  .board-diag{padding:28px 18px;}
  .diag-grid{grid-template-columns:1fr;}
  .diag-col-old{border-right:0;border-bottom:1px solid var(--bordo-forte);margin-bottom:18px;padding-bottom:18px;}
  .diag-h-col{font-size:1.05rem;padding:14px 10px;letter-spacing:.18em;}
  .diag-row{padding:14px 10px;gap:10px;}
  table.cat{display:none;}
  .cat-mobile{display:block;}
  .board-tbl{padding:18px 0;background:transparent;border:0;width:auto;position:static;left:auto;transform:none;}
  .diag-grid-cards,.diag-grid-cards.due,.vetrina-immagini{grid-template-columns:1fr;}
  .audit-stack{max-width:min(380px,88vw);margin:24px auto;}
  .bio-wrap,.bio-wrap.inverso{grid-template-columns:1fr;gap:28px;text-align:center;}
  .bio-wrap.inverso .bio-photo{order:0;}
  .bio-photo{max-width:300px;margin:0 auto;}
  .quote-card{padding:22px;margin:36px auto;}
  .quote-text{font-size:1.15rem;}
  .mini-stat{flex-direction:column;text-align:center;gap:12px;padding:30px 20px 22px;}
  .mini-stat-num{font-size:2.4rem;}
  .sectors-list{font-size:.95rem;}
  .testi-card{padding:20px;}
  .pulsante{padding:13px 24px;font-size:.74rem;letter-spacing:.18em;}
}

/* =====================================================================
   Decisione 28 (2026-09-11): il sito si avvicina a growtizeholding.com,
   come ha chiesto Emilio. Caratteri piu' piccoli che sulla optin, piu'
   immagini e grafici, e le sfumature di quel sito portate sui colori dello
   studio: fondo nero, bagliori di bronzo e oro dove loro hanno il blu,
   schede come vetro scuro con il filo luminoso in cima. Le pagine migrate
   non caricano questo foglio: restano come sono.
   ===================================================================== */

/* La testata resta in cima scorrendo, come la loro, sulle pagine che
   caricano questo foglio. Sulle migrate no: la pagina di vendita ha gia' la
   sua fascia sticky in cima, e le due si coprirebbero. */
.testata{
  position:sticky;top:0;z-index:150;
  background:linear-gradient(to right,rgba(20,20,18,.97),rgba(83,72,33,.97),rgba(20,20,18,.97));
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}

/* Bagliori di sezione: la luce viene da un bordo e sfuma nel nero. */
.bagliore-alto{background:radial-gradient(ellipse 60% 55% at 50% 0%,rgba(184,160,74,.11),rgba(0,0,0,0) 70%);}
.bagliore-destra{background:radial-gradient(ellipse 45% 70% at 100% 50%,rgba(184,160,74,.10),rgba(0,0,0,0) 70%);}
.bagliore-sinistra{background:radial-gradient(ellipse 45% 70% at 0% 50%,rgba(184,160,74,.10),rgba(0,0,0,0) 70%);}
.fascia{
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(184,160,74,.06) 50%,rgba(0,0,0,0));
}
/* Ogni sezione comincia con la luce in alto, come l'apertura: il cambio di
   sfondo separa le sezioni al posto delle linee (Advisory, 2026-09-14). La
   luce ha la stessa misura in ogni sezione, lunga o corta. */
.sfumata{background:radial-gradient(ellipse 900px 420px at 50% 0%,rgba(184,160,74,.16),rgba(0,0,0,0) 70%);}
/* Le sezioni con poco testo stanno in un riquadro, alternato alle sfumature
   (Advisory, 2026-09-14, decisione 82): dentro il riquadro i titoli vanno a capo in righe
   equilibrate, senza una parola sola sulla seconda riga. */
.riquadro-luce .uav-title,.riquadro-luce .sec-title{text-wrap:balance;}

/* Icona tonda, la stessa del piede */
.icona{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:48px;height:48px;border-radius:50%;color:var(--oro);
  background:radial-gradient(circle at 30% 30%,rgba(184,160,74,.26),rgba(184,160,74,.05));
  border:1px solid rgba(184,160,74,.32);
}
.icona svg{width:21px;height:21px;}

/* Vetro: la scheda generica */
.vetro{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(213,208,200,.055),rgba(213,208,200,.015));
  border:1px solid rgba(213,208,200,.1);border-radius:16px;
  box-shadow:0 18px 44px rgba(0,0,0,.4);
}
.vetro::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:radial-gradient(rgba(184,160,74,.7) 10%,rgba(0,0,0,0) 80%);
}

/* Numeri in fila */
.numeri{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  max-width:1040px;margin:40px auto 0;
}
.numero{padding:28px 18px 24px;text-align:center;}
.numero-valore{
  display:block;font-family:var(--serif);font-weight:400;
  font-size:clamp(2.1rem,3.4vw,2.8rem);line-height:1;color:var(--crema);margin-bottom:12px;
  /* Cifre allineate: con quelle antiche del Cormorant 1:1 si leggeva I:I. */
  font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1;
}
.numero-valore em{font-style:normal;color:var(--oro);}
.numero-etichetta{
  display:block;font-family:var(--sans);font-weight:500;font-size:.72rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--crema);opacity:.75;line-height:1.5;
}

/* Passi di un processo, uniti da un filo */
.passi{
  position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
  max-width:1040px;margin:44px auto 0;counter-reset:passo;
}
.passi::before{
  content:"";position:absolute;left:16%;right:16%;top:50px;height:1px;
  background:linear-gradient(to right,rgba(184,160,74,0),rgba(184,160,74,.55),rgba(184,160,74,0));
}
.passo{padding:26px 22px 24px;text-align:center;}
.passo .icona{margin:0 auto 16px;position:relative;z-index:1;background-color:var(--superficie-2);}
.passo-numero{
  display:block;font-family:var(--sans);font-weight:600;font-size:.66rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--oro);margin-bottom:8px;
}
.passo-titolo{font-family:var(--serif);font-weight:400;font-size:1.508rem;line-height:1.25;margin:0 0 10px;color:var(--crema);}
.passo-testo{font-family:var(--sans);font-weight:400;font-size:var(--corpo);line-height:1.65;margin:0;color:var(--crema);}

/* Schede con icona */
.schede-icona{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
  max-width:1040px;margin:40px auto 0;
}
.schede-icona.due{grid-template-columns:repeat(2,1fr);max-width:860px;}
.scheda-icona{padding:26px 24px;text-align:left;}
.scheda-icona .icona{margin-bottom:16px;}
.scheda-icona h3{font-family:var(--serif);font-weight:400;font-size:1.508rem;line-height:1.25;margin:0 0 10px;}
/* Decisione 85: le frasi dei riquadri usano --corpo, come il testo corrente; restano piu'
   piccole solo le note a margine (fonti, avviso di riservatezza, cookie, suggerimenti). */
.scheda-icona p{font-family:var(--sans);font-weight:400;font-size:var(--corpo);line-height:1.65;margin:0;}
.scheda-icona p+p{margin-top:10px;}
.scheda-icona a{text-underline-offset:3px;}

/* Due colonne: testo da una parte, grafico dall'altra */
.due-colonne{
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
  max-width:1040px;margin:40px auto 0;text-align:left;
}
.due-colonne .sec-copy,.due-colonne .sec-closing{text-align:left;margin-left:0;margin-right:0;}
.due-colonne .sec-title{text-align:left;margin-left:0;}
.due-colonne .sec-title::before{display:none;}

/* Linea del tempo verticale */
.linea-tempo{list-style:none;margin:40px auto 0;padding:0;max-width:760px;position:relative;text-align:left;}
.linea-tempo::before{
  content:"";position:absolute;left:23px;top:8px;bottom:8px;width:1px;
  background:linear-gradient(180deg,rgba(184,160,74,.6),rgba(184,160,74,.08));
}
.tappa{position:relative;display:grid;grid-template-columns:48px 1fr;gap:22px;padding:0 0 30px;}
.tappa:last-child{padding-bottom:0;}
.tappa .icona{background-color:var(--superficie-2);}
.tappa-quando{
  display:block;font-family:var(--sans);font-weight:600;font-size:.68rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--oro);margin:4px 0 6px;
}
.tappa-titolo{font-family:var(--serif);font-weight:400;font-size:1.566rem;line-height:1.25;margin:0 0 8px;}
.tappa-testo{font-family:var(--sans);font-weight:400;font-size:var(--corpo);line-height:1.7;margin:0;}

/* Organigramma: il fondatore sopra, i tre ruoli sotto */
.organigramma{max-width:960px;margin:44px auto 0;text-align:center;}
.nodo{display:inline-block;padding:20px 26px;min-width:220px;}
.nodo-ruolo{
  display:block;font-family:var(--sans);font-weight:600;font-size:.72rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--crema);margin-bottom:6px;
}
/* Decisione 85: le frasi dei riquadri alla grandezza del testo corrente. */
.nodo-testo{display:block;font-family:var(--sans);font-weight:400;font-size:var(--corpo);line-height:1.55;opacity:.85;}
.nodo-cima{border-color:rgba(184,160,74,.4);}
.nodo-cima .nodo-ruolo{color:var(--oro);}
.organigramma-rami{
  position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:56px;
}
.organigramma-rami::before{
  content:"";position:absolute;left:16.6%;right:16.6%;top:-28px;height:1px;background:rgba(184,160,74,.45);
}
.organigramma-rami .nodo{display:block;min-width:0;position:relative;overflow:visible;}
.organigramma-rami .nodo::after{
  content:"";position:absolute;left:50%;top:-29px;width:1px;height:28px;background:rgba(184,160,74,.45);
}
.organigramma-tronco{display:block;width:1px;height:28px;margin:0 auto -28px;background:rgba(184,160,74,.45);}

/* La mappa delle tre citta', disegnata sulle coordinate vere (proiezione
   equirettangolare a 45 gradi): Monaco e' il Principato, confermato da Emilio
   il 2026-09-11. Nessun confine e nessuna costa, solo le posizioni e le
   distanze in linea d'aria, che sono i due dati che la pagina afferma. */
.mappa{max-width:1000px;margin:40px auto 0;padding:28px 32px;display:grid;grid-template-columns:minmax(0,380px) 1fr;gap:40px;align-items:center;}
.mappa-grafico{width:100%;height:auto;display:block;max-height:460px;}
.mappa-punto-griglia{fill:rgba(213,208,200,.16);}
.mappa-alone-linea{fill:none;stroke:rgba(184,160,74,.14);stroke-width:8;stroke-linecap:round;stroke-linejoin:round;}
.mappa-linea{fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.mappa-anello{fill:none;stroke:rgba(184,160,74,.55);stroke-width:1;}
.mappa-citta-punto{fill:var(--oro);}
.mappa-nome{font-family:var(--serif);font-size:21px;fill:var(--crema);}
.mappa-paese{font-family:var(--sans);font-size:8.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;fill:var(--crema);fill-opacity:.7;}
.mappa-distanza{font-family:var(--sans);font-size:10px;font-weight:500;letter-spacing:.06em;fill:var(--oro);}
.mappa-citta-paese{
  display:block;font-family:var(--sans);font-weight:600;font-size:.62rem;letter-spacing:.18em;
  text-transform:uppercase;opacity:.7;margin:0 0 8px;
}
.mappa-nota{font-family:var(--sans);font-size:.72rem;letter-spacing:.04em;text-align:center;opacity:.7;margin:14px auto 0;}
.mappa-citta{list-style:none;margin:0;padding:0;text-align:left;}
.mappa-citta li{padding:18px 0;border-bottom:1px solid rgba(213,208,200,.1);}
.mappa-citta li:last-child{border-bottom:0;}
.mappa-citta h3{font-family:var(--serif);font-weight:400;font-size:1.682rem;line-height:1.2;margin:0 0 4px;color:var(--oro);}
.mappa-citta p{font-family:var(--sans);font-weight:400;font-size:var(--corpo);line-height:1.65;margin:0;}

@media (max-width:768px){
  .testata{position:relative;}
  .testi-grid.tre{grid-template-columns:1fr;}
  .numeri{grid-template-columns:repeat(2,1fr);gap:12px;}
  .passi,.schede-icona,.schede-icona.due,.due-colonne,.organigramma-rami,.mappa{grid-template-columns:1fr;}
  .passi::before,.organigramma-rami::before,.organigramma-rami .nodo::after,.organigramma-tronco{display:none;}
  .organigramma-rami{margin-top:18px;gap:12px;}
  .due-colonne{gap:28px;}
  .mappa{padding:20px 18px;gap:10px;}
  .mappa-grafico{max-height:360px;margin:0 auto;}
  .numero{padding:22px 12px 18px;}
}

/* Complementi dei componenti sopra */
.scheda-icona h2,.scheda-titolo{font-family:var(--serif);font-weight:400;font-size:1.508rem;line-height:1.25;margin:0 0 10px;}
.scheda-icona .passo-numero{margin-bottom:6px;}
.scheda-link{display:block;color:var(--crema) !important;text-decoration:none;transition:border-color .25s ease,transform .25s ease;}
.scheda-link:hover{border-color:rgba(184,160,74,.45);transform:translateY(-2px);}
.due-colonne .pillola{margin-left:0;}
.bio-copy .pillola{margin-bottom:14px;}
/* Il riquadro col bordo che si accende, come "Lavora con Growtize". */
.riquadro-luce{
  max-width:820px;margin:0 auto;padding:44px 40px;border-radius:26px;text-align:center;
  border:1px solid rgba(184,160,74,.55);
  background:linear-gradient(180deg,rgba(184,160,74,.07),rgba(0,0,0,0) 60%);
  box-shadow:0 0 0 1px rgba(184,160,74,.08),0 0 44px rgba(184,160,74,.14);
}
@media (max-width:768px){
  .riquadro-luce{padding:30px 20px;border-radius:20px;}
}

/* =====================================================================
   Advisory completa (decisione 31): i blocchi della pagina di vendita che
   Advisory non aveva, cioe' la prova WhatsApp, i numeri a coppie,
   l'articolo citato, l'offerta con il modulo e le domande frequenti. Stessi
   nomi di classe del foglio di /audit-diagnostico/, colori sui token, misure
   della vetrina (decisione 28).
   ===================================================================== */
.stacco-press{margin-top:48px !important;}

/* La prova WhatsApp */
.whatsapp-proof{max-width:360px;margin:48px auto;text-align:center;}
.whatsapp-proof-eyebrow{
  display:inline-block;font-family:var(--sans);font-size:.66rem;font-weight:600;letter-spacing:.2em;
  color:var(--oro);text-transform:uppercase;margin-bottom:14px;
}
.whatsapp-proof-frame{
  display:block;border-radius:14px;overflow:hidden;border:1px solid rgba(184,160,74,.25);
  background:var(--superficie-1);box-shadow:0 18px 44px rgba(0,0,0,.5);
}
.whatsapp-proof-frame img{width:100%;height:auto;display:block;}
.whatsapp-proof-attr{
  font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.16em;color:var(--grigio);
  text-transform:uppercase;margin-top:14px;line-height:1.4;
}

/* L'offerta */
.sec-offerta{position:relative;padding:72px 24px;}
.dram p{
  font-family:var(--sans);font-size:var(--corpo);font-weight:400;line-height:1.75;
  color:var(--crema);max-width:620px;margin:0 auto 18px;text-align:center;
}
.press-intro{
  font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.42rem;
  line-height:1.4;color:var(--crema);text-align:center;max-width:620px;margin:40px auto 0;
}
.press-intro strong{font-weight:600;color:var(--oro);font-style:italic;}
/* L'articolo citato: carta chiara su fondo nero, come sulla pagina di vendita. */
.press-card{
  display:block;max-width:660px;margin:40px auto 0;padding:30px 34px;border-radius:14px;
  background:var(--crema);color:var(--nero);text-align:left;text-decoration:none;
  box-shadow:0 18px 44px rgba(0,0,0,.45);transition:transform .25s ease;
}
.press-card:hover{transform:translateY(-2px);}
.contenuto a.press-card{color:var(--nero);}
.press-card-eyebrow{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-family:var(--sans);font-size:.68rem;
  font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--nero);margin-bottom:14px;
}
.press-card-logo{
  font-family:var(--serif);font-weight:600;font-size:1.05rem;letter-spacing:0;text-transform:none;
  padding-right:12px;border-right:1px solid rgba(0,0,0,.25);
}
.press-card-headline{
  font-family:var(--serif);font-weight:600;font-size:clamp(1.508rem,2.436vw,1.972rem);line-height:1.2;
  color:var(--nero);margin:0 0 14px;
}
.press-card-meta{font-family:var(--sans);font-size:.76rem;font-weight:500;color:var(--nero);opacity:.7;line-height:1.5;}
.press-card-meta b{font-weight:600;opacity:1;}
.press-card-link{
  display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-family:var(--sans);font-size:.7rem;
  font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--nero);
  border-bottom:1px solid rgba(0,0,0,.4);padding-bottom:2px;
}
.press-card-link svg{width:11px;height:11px;}
.press-strip{
  display:flex;flex-wrap:wrap;align-items:center;gap:18px;max-width:660px;margin:14px auto 0;
  padding:18px 24px;border-radius:14px;text-align:left;text-decoration:none;color:var(--crema);
  border:1px solid rgba(213,208,200,.18);background:rgba(213,208,200,.02);
}
.contenuto a.press-strip{color:var(--crema);text-decoration:none;}
/* Decisione 85: il numero cresce con il testo accanto, nella proporzione di prima. */
.press-strip-num{font-family:var(--serif);font-weight:600;font-size:clamp(1.68rem,2.7vw,2.1rem);line-height:1;flex:0 0 auto;}
.press-strip-num span{font-size:.62em;font-weight:300;margin-right:2px;}
.press-strip-num .press-strip-mese{font-size:.42em;margin-left:4px;letter-spacing:.04em;}
.press-strip-body{flex:1 1 240px;font-family:var(--sans);font-size:var(--corpo);font-weight:400;line-height:1.55;opacity:.85;}
.press-strip-body b{font-weight:600;}
.press-strip-source{
  display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;font-family:var(--sans);font-size:.62rem;
  font-weight:600;letter-spacing:.14em;text-transform:uppercase;opacity:.7;
  border-left:1px solid rgba(213,208,200,.2);padding-left:18px;
}
.press-strip-source svg{width:9px;height:9px;}

/* Le due cifre a confronto */
.mini-stat-pair{max-width:660px;margin:36px auto 0;display:flex;flex-direction:column;gap:18px;}
.mini-stat-pair .mini-stat{margin:0;position:relative;overflow:visible;}
.mini-stat-body em{display:block;margin-top:6px;font-family:var(--serif);font-size:.95em;font-style:italic;color:var(--oro);letter-spacing:.02em;}
.mini-stat-tag{
  position:absolute;top:-10px;left:24px;font-family:var(--sans);font-size:.6rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;padding:4px 10px;line-height:1;
  background:var(--nero);border:1px solid var(--bordo-forte);border-radius:999px;
}
.mini-stat.worst{border-left-color:rgba(213,208,200,.28);background:rgba(213,208,200,.02);}
.mini-stat.worst .mini-stat-num,.mini-stat.worst .mini-stat-body{opacity:.72;}
.mini-stat.worst .mini-stat-body em{color:var(--crema);opacity:.7;}
.mini-stat.uav .mini-stat-tag{color:var(--oro);border-color:rgba(184,160,74,.4);}

/* La scheda dell'offerta */
.offer-card{
  position:relative;max-width:660px;margin:0 auto;padding:46px 36px;text-align:center;scroll-margin-top:110px;
  background:linear-gradient(180deg,rgba(184,160,74,.08),rgba(213,208,200,.015) 55%);
  border:1px solid rgba(184,160,74,.4);border-radius:22px;
  box-shadow:0 0 0 1px rgba(184,160,74,.06),0 0 48px rgba(184,160,74,.14),0 24px 60px rgba(0,0,0,.5);
}
.offer-eyebrow{font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;margin-bottom:16px;}
.offer-title{font-family:var(--serif);font-size:clamp(2.088rem,3.48vw,2.552rem);font-weight:500;margin-bottom:8px;}
.offer-desc{font-family:var(--serif);font-size:clamp(1.05rem,1.7vw,1.3rem);font-style:italic;font-weight:300;color:var(--oro);margin-bottom:30px;line-height:1.5;}
.offer-components{text-align:left;max-width:540px;margin:0 auto 32px;}
.offer-components p{font-family:var(--sans);font-size:.98rem;font-weight:400;line-height:1.75;margin:0 0 18px;}
.offer-components strong{font-weight:600;}
.offer-price{font-family:var(--serif);font-size:clamp(2.6rem,4.4vw,3.3rem);font-weight:600;line-height:1;margin-bottom:6px;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1;}
.offer-price span{font-size:.5em;font-weight:300;margin-right:4px;}
.offer-note{font-family:var(--sans);font-size:.92rem;font-weight:400;margin-bottom:28px;}
.nda-disclaimer{border-top:1px solid rgba(213,208,200,.12);padding:22px 0;margin:22px 0 18px;text-align:left;}
.nda-disclaimer-label{
  display:flex;align-items:center;gap:8px;font-family:var(--sans);font-size:.7rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;margin-bottom:10px;
}
.nda-disclaimer-label svg{width:12px;height:12px;fill:none;stroke:var(--crema);stroke-width:1.5;}
.nda-disclaimer-text{font-family:var(--sans);font-size:.88rem;font-weight:400;line-height:1.65;}
.audit-form-wrap{margin:28px 0;}
.audit-form{max-width:460px;margin:0 auto;}
.audit-form .f-group{margin-bottom:18px;text-align:left;}
.audit-form .f-label{display:block;font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;margin-bottom:6px;opacity:.9;}
.audit-form .f-input{
  width:100%;background:rgba(0,0,0,0);border:0;border-bottom:1px solid var(--bordo-forte);color:var(--crema);
  font-family:var(--sans);font-size:1rem;font-weight:400;padding:10px 0;outline:none;letter-spacing:.02em;
  transition:border-color .3s ease;
}
.audit-form .f-input::placeholder{color:var(--crema);opacity:.6;}
.audit-form .f-input:focus{border-bottom-color:var(--oro);}
.audit-form .f-submit{
  width:100%;margin-top:30px;padding:16px 22px;cursor:pointer;border-radius:12px;
  border:1px solid var(--oro);color:var(--crema);font-family:var(--sans);font-size:.84rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
  background:linear-gradient(180deg,rgba(184,160,74,.3),rgba(184,160,74,.1));
  box-shadow:0 0 30px rgba(184,160,74,.2);transition:background .25s ease,box-shadow .25s ease;
}
.audit-form .f-submit:hover{background:linear-gradient(180deg,rgba(184,160,74,.45),rgba(184,160,74,.18));box-shadow:0 0 40px rgba(184,160,74,.3);}
.audit-form .f-submit:disabled{opacity:.5;cursor:wait;}
.audit-form .f-hint{font-family:var(--sans);font-size:.86rem;text-align:center;margin-top:12px;opacity:.7;}
.audit-form .f-hint.error{opacity:1;color:var(--oro);}
.audit-form .f-loading{display:none;font-family:var(--sans);font-size:.9rem;font-weight:500;color:var(--oro);text-align:center;margin-top:18px;letter-spacing:.08em;text-transform:uppercase;}
.audit-form .f-loading.visible{display:block;}
.offer-nda{font-family:var(--sans);font-size:.86rem;margin-top:12px;letter-spacing:.04em;text-align:center;}
.guarantee{
  border-left:2px solid rgba(184,160,74,.45);padding:18px 22px;margin-top:28px;text-align:left;
  font-family:var(--sans);font-size:var(--corpo);font-weight:400;line-height:1.7;
}
.guarantee strong{font-weight:600;}

/* Domande frequenti */
.faq-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:10px;text-align:left;}
.faq-item{
  border-radius:14px;overflow:hidden;border:1px solid rgba(213,208,200,.1);
  background:linear-gradient(180deg,rgba(213,208,200,.045),rgba(213,208,200,.012));
}
.faq-item[open]{border-color:rgba(184,160,74,.4);}
.faq-item summary{
  list-style:none;cursor:pointer;position:relative;padding:18px 54px 18px 22px;
  font-family:var(--sans);font-size:.98rem;font-weight:500;color:var(--crema);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);
  font-family:var(--serif);font-size:1.5rem;font-weight:300;color:var(--oro);transition:transform .2s ease;
}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(45deg);}
.faq-body{padding:0 22px 18px;font-family:var(--sans);font-size:var(--corpo);font-weight:400;line-height:1.7;}
.faq-closing{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.42rem;text-align:center;margin:48px auto 0;max-width:560px;}
.faq-closing a{color:var(--oro);}

@media (max-width:768px){
  .sec-offerta{padding:56px 20px;}
  .press-card{padding:22px 20px;}
  .press-strip{padding:14px 16px;gap:10px;}
  .press-strip-source{border-left:0;padding-left:0;border-top:1px solid rgba(213,208,200,.18);padding-top:10px;width:100%;}
  .offer-card{padding:32px 20px;border-radius:18px;}
  .dram p{text-align:left;}
  .mini-stat-tag{left:50%;transform:translateX(-50%);white-space:nowrap;}
  .faq-item summary{padding:16px 46px 16px 18px;font-size:.95rem;}
  .faq-body{padding:0 18px 16px;}
}

/* Organigramma a due rami, con un nodo sotto l'altro nel secondo. */
.organigramma-rami.due{grid-template-columns:repeat(2,1fr);max-width:680px;margin-left:auto;margin-right:auto;}
.organigramma-rami.due::before{left:25%;right:25%;}
.ramo{display:flex;flex-direction:column;align-items:stretch;}
.organigramma-rami .ramo .nodo::after{display:none;}
.organigramma-rami .ramo > .nodo:first-child::after{display:block;}
.organigramma-sotto{display:block;width:1px;height:24px;margin:0 auto;background:rgba(184,160,74,.45);}
.nodo-figlio{border-style:dashed;border-color:rgba(213,208,200,.2);}
/* I tre partner (decisione 32): allo stesso livello del fondatore, sulla
   stessa riga, uniti da un filo sotto; dal filo scende il tronco verso i
   ruoli operativi. */
.nodo-partner{border-color:rgba(184,160,74,.3);}
.nodo-partner .nodo-ruolo{color:var(--oro);}
.organigramma-vertice{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:960px;margin:0 auto;}
.organigramma-vertice::after{
  content:"";position:absolute;left:12.5%;right:12.5%;bottom:-28px;height:1px;background:rgba(184,160,74,.45);
}
.organigramma-vertice .nodo{display:block;min-width:0;position:relative;overflow:visible;}
.organigramma-vertice .nodo::after{
  content:"";position:absolute;left:50%;bottom:-29px;width:1px;height:28px;background:rgba(184,160,74,.45);
}
.organigramma-tronco.discesa{margin:28px auto 0;height:28px;}
.organigramma-rami.stretto{margin-top:28px;}

/* Le citta' di Presenza: testo da una parte, scheda dei dati dall'altra. */
.citta-sezione{
  display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:center;
  max-width:1000px;margin:0 auto;padding:44px 0;text-align:left;scroll-margin-top:110px;
  border-bottom:1px solid rgba(213,208,200,.08);
}
.citta-sezione:last-child{border-bottom:0;}
.citta-sezione.inverso .citta-testo{order:2;}
.citta-testo .sec-copy{text-align:left;margin-left:0;margin-right:0;}
.citta-testo .pillola{margin-left:0;}
.citta-nome{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,3.6vw,2.8rem);line-height:1.1;margin:0 0 18px;color:var(--oro);}
.citta-dati{padding:26px 26px 20px;}
.citta-coordinate{
  display:block;font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--crema);
  margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid rgba(213,208,200,.1);
  font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1;
}
.citta-elenco{list-style:none;margin:0;padding:0;}
.citta-elenco li{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-bottom:1px solid rgba(213,208,200,.06);}
.citta-elenco li:last-child{border-bottom:0;}
.dato-etichetta{font-family:var(--sans);font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;opacity:.7;padding-top:3px;}
.dato-valore{font-family:var(--sans);font-size:var(--corpo);font-weight:400;text-align:right;}
/* Decisione 57 (2026-09-13): ogni citta' ha lo screenshot di una sessione
   interna di Emilio, a righe alterne con il testo come nella pagina di
   vendita. La didascalia dice la citta' e che cosa si vede, senza data: i
   file non la portano. */
.citta-sezione.con-foto{
  grid-template-columns:1.1fr .9fr;grid-template-areas:"foto testo" "foto dati";
  column-gap:48px;row-gap:22px;max-width:1100px;
}
.citta-sezione.con-foto.inverso{grid-template-columns:.9fr 1.1fr;grid-template-areas:"testo foto" "dati foto";}
.con-foto .citta-sessione{grid-area:foto;}
.con-foto .citta-testo{grid-area:testo;align-self:end;}
.con-foto .citta-dati{grid-area:dati;align-self:start;}
.citta-sessione{margin:0;}
.citta-sessione img{display:block;width:100%;height:auto;border-radius:10px;}
.citta-sessione figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 4px 0;}
.citta-sessione-luogo{font-family:var(--serif);font-weight:400;font-size:1.2rem;line-height:1.2;color:var(--oro);}
.citta-sessione-cosa{
  font-family:var(--sans);font-weight:600;font-size:.6rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--crema);opacity:.7;text-align:right;
}

@media (max-width:768px){
  .citta-sezione.con-foto,.citta-sezione.con-foto.inverso{grid-template-columns:1fr;grid-template-areas:"testo" "foto" "dati";}
  .organigramma-rami.due{grid-template-columns:1fr;}
  .organigramma-sotto,.organigramma-rami .ramo > .nodo:first-child::after{display:none;}
  .organigramma-vertice{grid-template-columns:repeat(2,1fr);gap:12px;}
  .organigramma-vertice::after,.organigramma-vertice .nodo::after{display:none;}
  .organigramma-rami.stretto{margin-top:12px;}
  .ramo{gap:12px;}
  .citta-sezione,.citta-sezione.inverso{grid-template-columns:1fr;gap:22px;padding:32px 0;}
  .citta-sezione.inverso .citta-testo{order:0;}
}

/* =====================================================================
   Decisione 34 (2026-09-12): la home dice subito perche' fidarsi dello
   studio. Quattro fatti, ognuno con la sua fonte dichiarata (R-14: il 347
   e' un dato interno e lo dice), accanto al fondatore. Il claim esce dal
   sito istituzionale: resta alla optin e ai materiali che lo usano.
   La fotografia e' quella scelta da Emilio ("Studio Vox"), dallo stesso
   set del video di presentazione.
   ===================================================================== */
.ritratto{margin:0;}
.ritratto img{
  width:100%;height:auto;display:block;border-radius:16px;
  border:1px solid rgba(184,160,74,.25);background:var(--superficie-1);
  box-shadow:0 24px 60px rgba(0,0,0,.5);
}
.ritratto figcaption{
  font-family:var(--sans);font-size:.66rem;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--crema);opacity:.7;margin-top:14px;text-align:center;
}
.fatti{
  display:grid;grid-template-columns:minmax(0,400px) 1fr;gap:56px;align-items:start;
  max-width:1040px;margin:44px auto 0;text-align:left;
}
/* Fotografia e fatti scorrono insieme, come il resto della pagina. Fino al
   2026-09-13 la fotografia restava ferma sotto la testata e i fatti le
   scorrevano accanto: Emilio, guardando Lo Studio, non vuole che si muovano. */
.fatti-elenco{list-style:none;margin:0;padding:0;}
.fatto{
  display:grid;grid-template-columns:48px 1fr;gap:20px;padding:26px 0;
  border-bottom:1px solid rgba(213,208,200,.1);
}
.fatto:first-child{padding-top:0;}
.fatto:last-child{padding-bottom:0;border-bottom:0;}
.fatto-titolo{font-family:var(--serif);font-weight:400;font-size:1.566rem;line-height:1.25;margin:4px 0 8px;color:var(--crema);}
.fatto-testo{font-family:var(--sans);font-weight:400;font-size:var(--corpo);line-height:1.7;margin:0;color:var(--crema);}
.fatto-fonte{font-family:var(--sans);font-weight:400;font-size:.8rem;line-height:1.6;margin:12px 0 0;color:var(--crema);opacity:.78;}
.fatto-fonte-etichetta{font-weight:600;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--oro);margin-right:10px;}
.fatto-fonte a{text-underline-offset:3px;}

@media (max-width:768px){
  .fatti{grid-template-columns:1fr;gap:32px;margin-top:32px;}
  .fatti .ritratto{width:100%;max-width:340px;margin:0 auto;}
  .fatto{grid-template-columns:40px 1fr;gap:14px;padding:22px 0;}
  .fatto .icona{width:40px;height:40px;}
  .fatto .icona svg{width:18px;height:18px;}
  .fatto-titolo{font-size:1.25rem;}
}

/* Decisione 35 (2026-09-12): La differenza dice chi fa il vecchio modo, sotto
   l'intestazione della colonna, e dove finisce il lavoro dello studio: niente
   questioni cliniche o mediche. */
.diag-h-sub{
  display:block;margin-top:8px;font-family:var(--sans);font-size:.72rem;font-weight:400;
  letter-spacing:.04em;text-transform:none;line-height:1.5;color:var(--crema);opacity:.72;
}
.confine{
  max-width:900px;margin:22px auto 0;font-family:var(--sans);font-size:.86rem;font-weight:400;
  line-height:1.65;color:var(--crema);opacity:.85;text-align:center;
}
.confine-etichetta{
  font-weight:600;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--oro);margin-right:10px;
}
@media (max-width:768px){
  .diag-h-sub{font-size:.7rem;letter-spacing:.02em;}
  .confine{text-align:left;}
}

/* Decisione 36 (2026-09-12): una fotografia per citta' sotto la mappa di
   Presenza, in home. Le foto mostrano le citta', non lo studio: la
   didascalia dice citta' e paese, mai una data. */
.citta-foto{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
  max-width:1000px;margin:28px auto 0;
}
.citta-foto-scheda{margin:0;padding:10px 10px 16px;}
.citta-foto-scheda img{
  display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:10px;
}
.citta-foto-scheda figcaption{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:14px 6px 0;text-align:left;
}
.citta-foto-nome{font-family:var(--serif);font-weight:400;font-size:1.35rem;line-height:1.2;color:var(--oro);}
.citta-foto-paese{
  font-family:var(--sans);font-weight:600;font-size:.6rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--crema);opacity:.7;text-align:right;
}
@media (max-width:768px){
  .citta-foto{grid-template-columns:1fr;gap:12px;margin-top:20px;}
  .citta-foto-scheda img{aspect-ratio:16/10;}
}
/* Decisione 59 (2026-09-13): in Presenza le stesse tre foto aprono la pagina,
   e ognuna porta alla sua sezione. */
.citta-foto-apertura{margin-top:36px;}
.citta-foto-vai{display:block;color:inherit;text-decoration:none;border-radius:16px;}
.citta-foto-vai .citta-foto-scheda{height:100%;transition:border-color .2s ease;}
.citta-foto-vai:hover .citta-foto-scheda{border-color:rgba(184,160,74,.45);}
.citta-foto-vai:focus-visible{outline:2px solid var(--oro);outline-offset:4px;}

/* Decisione 37 (2026-09-12): la home segue l'ordine di growtizeholding.com.
   In apertura il marchio, la frase e il perche', come il loro "Grow your
   business", con il segno sotto la frase; subito dopo l'apertura di prima,
   con i quattro numeri, come i loro record. */
.hero-marchio{
  text-align:center;padding:96px 24px 80px;position:relative;
  background:
    radial-gradient(ellipse 50% 70% at 50% 38%,rgba(184,160,74,.2),rgba(0,0,0,0) 70%),
    radial-gradient(ellipse 30% 55% at 0% 70%,rgba(184,160,74,.06),rgba(0,0,0,0) 70%),
    radial-gradient(ellipse 30% 55% at 100% 70%,rgba(184,160,74,.06),rgba(0,0,0,0) 70%);
}
.hero-marchio-nome{
  display:inline-flex;flex-direction:column;align-items:center;gap:.45rem;
  margin:0 auto 34px;color:var(--crema);line-height:1;
}
.hero-marchio-nome .marchio-uav{font-size:3rem;}
.hero-marchio-nome .marchio-filo{width:4.6rem;}
.hero-marchio-nome .marchio-associati{font-size:.78rem;letter-spacing:.3em;}
.hero-marchio-titolo{
  font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,4.6vw,3.5rem);line-height:1.14;
  color:var(--crema);max-width:900px;margin:0 auto;text-wrap:balance;
}
.hero-marchio-titolo .oro{display:block;color:var(--oro);font-style:italic;}
.hero-marchio-segno{display:block;width:min(360px,70%);height:auto;margin:22px auto 34px;}
.hero-marchio-sub{
  font-family:var(--sans);font-weight:400;font-size:clamp(1rem,1.35vw,1.14rem);line-height:1.7;
  color:var(--crema);max-width:760px;margin:0 auto;text-wrap:balance;
}
.hero-marchio-sub+.hero-marchio-sub{margin-top:10px;}
.hero-marchio-sub.forte{font-weight:600;}
/* L'apertura di prima diventa la seconda sezione: meno aria sopra. */
.hero-marchio+.uav-hero{padding-top:56px;}
@media (max-width:768px){
  .hero-marchio{padding:64px 18px 52px;}
  .hero-marchio-nome{margin-bottom:26px;}
  .hero-marchio-nome .marchio-uav{font-size:2.4rem;}
  .hero-marchio-titolo{font-size:2.05rem;}
  .hero-marchio-sub{font-size:1rem;}
  .hero-marchio+.uav-hero{padding-top:40px;}
}

/* Decisione 39 (2026-09-12): Lo Studio segue la pagina "L'azienda" di
   growtizeholding.com. In apertura i principi in un riquadro e, dove loro
   hanno un grafico, la copertina vera dell'Audit; poi i valori in schede con
   tre punti, i settori come le loro aree, e "Lavora con lo studio". */
.studio-apertura{margin-top:44px;gap:48px;}
.principi{padding:30px 32px 14px;text-align:left;}
.principi ul{list-style:none;margin:0;padding:0;}
.principi li{
  position:relative;padding-left:22px;margin:0 0 18px;
  font-family:var(--sans);font-weight:400;font-size:.98rem;line-height:1.7;color:var(--crema);
}
.principi li::before{
  content:"";position:absolute;left:0;top:.72em;width:7px;height:7px;border-radius:50%;
  background:var(--oro);opacity:.85;
}
.studio-apertura-audit .audit-stack{margin:8px auto 0;}

.valori{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:1040px;margin:40px auto 0;text-align:left;}
.valore{padding:28px 26px 24px;}
.valore-nome{font-family:var(--serif);font-weight:400;font-size:1.65rem;line-height:1.2;margin:0 0 8px;color:var(--oro);}
/* Decisione 85: frasi, punti e rimando dei valori alla grandezza del testo corrente,
   come «Come ci si candida» su Carriere; i punti uno sotto l'altro anche sul computer,
   perche' tre colonne da 145 px non reggono il corpo pieno. */
.valore-testo{font-family:var(--sans);font-weight:400;font-size:var(--corpo);line-height:1.65;margin:0 0 18px;color:var(--crema);}
.valore-punti{display:grid;grid-template-columns:1fr;gap:10px;list-style:none;margin:0;padding:0;}
.valore-punto{
  padding:14px 16px 16px;border-radius:12px;
  border:1px solid rgba(213,208,200,.1);background:rgba(213,208,200,.03);
}
.valore-punto-nome{
  display:block;font-family:var(--sans);font-weight:600;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--oro);margin-bottom:6px;line-height:1.4;
}
.valore-punto p{margin:0;font-family:var(--sans);font-weight:400;font-size:var(--corpo);line-height:1.55;color:var(--crema);}
.valore-link{margin:16px 0 0;font-family:var(--sans);font-size:var(--corpo);}
.valore-link a{text-underline-offset:3px;}

.settori{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;max-width:1040px;margin:32px auto 36px;}
.settore{display:flex;align-items:center;gap:14px;padding:16px 18px;text-align:left;}
.settore-nome{font-family:var(--serif);font-weight:400;font-size:1.15rem;line-height:1.25;color:var(--crema);}
/* La fonte di settori e fascia d'eta', come quella dei fatti (R-14): centrata
   come il testo sopra, a sinistra sul telefono come la prosa. */
.settori-fonte{max-width:620px;margin:0 auto;text-align:center;}

.posizioni-elenco{
  display:flex;flex-wrap:wrap;justify-content:center;gap:10px;list-style:none;margin:22px auto 0;padding:0;
}
.posizione{
  font-family:var(--sans);font-weight:600;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--crema);padding:.55rem 1rem;border-radius:999px;
  border:1px solid rgba(184,160,74,.35);background:rgba(184,160,74,.06);
}

@media (max-width:768px){
  .settori-fonte{text-align:left;}
  .studio-apertura{gap:28px;margin-top:32px;}
  .principi{padding:24px 20px 8px;}
  .principi li{font-size:.96rem;}
  .valori{grid-template-columns:1fr;}
  .valore{padding:24px 20px 20px;}
}