/* Grafica del sito salvatoriofficial.com (decisione CEO 7/9/2026), come la Sales App:
   Atlas Grotesk, bianco/nero/alabastro/grigi, nessun accento colorato, rosso solo per gli errori.
   La gerarchia la fanno peso, spazio e contrasto; mai grassetti oltre il Medium. */
@font-face { font-family:"Atlas Grotesk"; src:url("fonts/AtlasGrotesk-Light.woff2") format("woff2");
             font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:"Atlas Grotesk"; src:url("fonts/AtlasGrotesk-Regular.woff2") format("woff2");
             font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Atlas Grotesk"; src:url("fonts/AtlasGrotesk-Medium.woff2") format("woff2");
             font-weight:500; font-style:normal; font-display:swap; }

:root {
  --fondo:#FFFFFF; --testo:#000000; --secondario:#666666; --etichetta:#999999;
  --linea:#EBEBEB; --alabastro:#F6F5E8; --neutro:#F7F7F7; --errore:#DC3645;
  --font:"Atlas Grotesk", "Public Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--fondo); color:var(--testo);
       font:400 16px/1.6 var(--font); letter-spacing:.005em; -webkit-font-smoothing:antialiased; }
main { max-width:40rem; margin:0 auto; padding:1.5rem 1.25rem 5rem; }

h1 { font-weight:300; font-size:2.2rem; line-height:1.15; letter-spacing:.02em; margin:0 0 .75rem; }
h2 { font-weight:300; font-size:1.4rem; letter-spacing:.02em; margin:3.5rem 0 1rem; }
h3 { font-weight:500; font-size:.75rem; text-transform:uppercase; letter-spacing:.22em; margin:2.5rem 0 .75rem; }
strong { font-weight:500; }
a { color:var(--testo); text-underline-offset:.2em; }
header p { color:var(--secondario); margin:0 0 2.5rem; }

/* Barra in alto: logo a sinistra, lingua e uscita a destra */
.barra { display:flex; align-items:center; gap:1rem; padding:.5rem 0 1.25rem; margin-bottom:2rem; border-bottom:1px solid var(--linea); }
.logo { height:14px; width:auto; margin-right:auto; display:block; }
.lingue { display:flex; gap:.1rem; }
.lingue button { border:0; padding:.3rem .45rem; font-size:.75rem; letter-spacing:.18em; color:var(--etichetta); background:none; }
.lingue button[aria-pressed="true"] { color:var(--testo); font-weight:500; }

/* Campi */
label { display:block; margin:1.75rem 0; }
label > span { display:block; margin-bottom:.5rem; }
textarea, input[type=text], input:not([type]) {
  width:100%; font:inherit; color:var(--testo); padding:.8rem .9rem;
  border:1px solid var(--linea); border-radius:0; background:var(--fondo); }
textarea:focus, input:focus { outline:none; border-color:var(--testo); }
fieldset { border:0; border-top:1px solid var(--linea); padding:1.5rem 0 0; margin:2.5rem 0; }
legend { font-weight:500; font-size:.75rem; text-transform:uppercase; letter-spacing:.22em; padding:0 .75rem 0 0; }
.scelte { margin:1rem 0 1.25rem; }
.scelte p { margin:0 0 .4rem; }
.scelte label { display:inline-flex; align-items:center; gap:.4rem; margin:0 1.25rem .4rem 0; padding:.3rem 0; }
.scelte input { accent-color:var(--testo); margin:0; }

/* Pulsanti: come sul sito, bordo sottile o nero pieno, niente angoli arrotondati */
button { font:inherit; font-size:.8rem; text-transform:uppercase; letter-spacing:.18em;
         padding:.85rem 1.4rem; border:1px solid var(--testo); border-radius:0;
         background:var(--fondo); color:var(--testo); cursor:pointer; }
button:hover { background:var(--neutro); }
button.primario { background:var(--testo); color:#FFFFFF; margin-top:.5rem; }
button.primario:hover { background:#1A1919; }
button:disabled { opacity:.5; cursor:wait; }
#esci { padding:.45rem .9rem; font-size:.7rem; }
#vocale { width:100%; text-transform:none; letter-spacing:.005em; font-size:.95rem; margin-top:.5rem; }

/* Testi di servizio e riquadri */
.nota { color:var(--secondario); font-size:.875rem; }
.errore { color:var(--errore); }
#anonimo-box, #esito-testo { background:var(--alabastro); padding:1.5rem; }
#esito-testo { white-space:pre-wrap; margin-bottom:2rem; }
.codice { font:400 1.6rem/1.2 ui-monospace, Menlo, monospace; letter-spacing:.12em; }
#segui { margin-top:4rem; padding-top:.5rem; border-top:1px solid var(--linea); }
#modulo-stato { display:flex; gap:.5rem; flex-wrap:wrap; }
#modulo-stato input { flex:1 1 12rem; }
#stato-esito { white-space:pre-wrap; margin-top:1rem; }

.nascosto { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
#racconto { font-size:1.05rem; min-height:8rem; }
.spunti { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; margin:.75rem 0 1.5rem; }
.spunti .nota { flex-basis:100%; margin:0 0 .1rem; }
.spunto { text-transform:none; letter-spacing:.005em; font-size:.85rem; padding:.45rem .8rem;
          border-color:var(--linea); background:var(--alabastro); }
.spunto:hover { border-color:var(--testo); background:var(--alabastro); }
#dettagli { border-top:1px solid var(--linea); margin-top:1.5rem; padding-top:.5rem; }
#dettagli fieldset { border:0; padding:0; margin:1.5rem 0 .5rem; }
.pillola { position:relative; display:inline-flex !important; align-items:center; margin:0 .35rem .5rem 0 !important; padding:0 !important; }
.pillola input { position:absolute; opacity:0; width:1px; height:1px; }
.pillola span { display:inline-block; padding:.5rem .95rem; border:1px solid var(--linea); cursor:pointer;
                font-size:.9rem; line-height:1.2; user-select:none; margin:0 !important; }
.pillola input:checked + span { background:var(--testo); border-color:var(--testo); color:#FFFFFF; }
.pillola input:focus-visible + span { outline:2px solid var(--testo); outline-offset:2px; }
em { font-style:normal; color:var(--etichetta); font-size:.85em; margin-left:.3rem; }

/* Pagina del brief (solo Gabriele) */
.voce { border-top:1px solid var(--linea); padding:1rem 0; }
.voce p { margin:0 0 .35rem; }
.meta { color:var(--secondario); font-size:.8rem; letter-spacing:.02em; }
.avviso { background:var(--alabastro); padding:1rem 1.25rem; margin:1rem 0; }
.vuoto { color:var(--etichetta); }