/* ═══════════════════════════════════════════════════════════
   Franca Maria Lorusso — Avvocato ecclesiastico
   Concept: «IL NODO CHE NON C'ERA»
   Direzione grafica ripresa dall'esempio approvato dalla cliente:
   notte + ottone + crema, monogramma FML, titoli serif in maiuscolo.
   ═══════════════════════════════════════════════════════════ */

@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400 500;font-display:swap;
  src:url(../font/ebgaramond-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400 500;font-display:swap;
  src:url(../font/ebgaramond-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400;font-display:swap;
  src:url(../font/ebgaramond-italic-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400;font-display:swap;
  src:url(../font/ebgaramond-italic-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400 600;font-display:swap;
  src:url(../font/publicsans-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400 600;font-display:swap;
  src:url(../font/publicsans-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

/* ─── I colori ─── */
:root{
  --notte:#12283F;
  --notte-cupa:#0D1E31;
  --ottone:#B08A50;
  --ottone-chiaro:#C8A468;
  --crema:#FAF7F2;
  --sabbia:#F1EADF;
  --inchiostro:#1E2B38;
  --tenue:#5B6976;
  --linea:#E4DACB;

  --guscio:74rem;
  --testo:42rem;
  --serif:'EB Garamond',Palatino,'Palatino Linotype','Book Antiqua',Georgia,serif;
  --sans:'Public Sans',-apple-system,'Segoe UI',system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:5rem}
body{
  background:var(--crema);color:var(--inchiostro);
  font-family:var(--sans);
  font-size:clamp(1rem,.62rem + .8vw,1.1rem);
  line-height:1.72;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
svg{display:block}

.salta{position:absolute;left:-9999px;top:0;background:var(--notte);color:var(--crema);padding:.7rem 1.2rem;z-index:99}
.salta:focus{left:.5rem;top:.5rem}
.vs{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
:where(a,button,input,textarea,summary):focus-visible{outline:2px solid var(--ottone);outline-offset:3px;border-radius:2px}

.guscio{max-width:var(--guscio);margin:0 auto;padding-inline:clamp(1.2rem,5vw,2.5rem)}

/* ═══ TESTATA ═══ */
.testata{
  position:sticky;top:0;z-index:40;
  background:color-mix(in srgb,var(--crema) 92%,transparent);
  backdrop-filter:blur(12px);
  border-bottom:1px solid transparent;transition:border-color .3s,background .3s;
}
.testata.staccata{border-bottom-color:var(--linea)}
.testata__interno{display:flex;align-items:center;gap:1.5rem;padding-block:.8rem}

.marchio{display:flex;align-items:center;gap:.85rem;text-decoration:none;margin-right:auto}
.marchio__sigla{
  font-family:var(--serif);font-size:1.6rem;line-height:1;letter-spacing:.02em;
  color:var(--ottone);padding-right:.85rem;border-right:1px solid var(--linea);
}
.marchio__testo{display:flex;flex-direction:column;line-height:1.2}
.marchio__nome{
  font-size:.86rem;letter-spacing:.13em;text-transform:uppercase;color:var(--notte);font-weight:500;
}
.marchio__ruolo{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tenue);margin-top:.2rem}

@media (max-width:560px){
  .marchio{gap:.6rem}
  .marchio__sigla{font-size:1.3rem;padding-right:.6rem}
  .marchio__nome{font-size:.72rem;letter-spacing:.1em;white-space:nowrap}
  .marchio__ruolo{font-size:.55rem;letter-spacing:.11em;white-space:nowrap}
}

.menu{display:none;gap:1.35rem;align-items:center}
.menu a{
  text-decoration:none;font-size:.74rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--notte);padding-bottom:.3rem;white-space:nowrap;border-bottom:1.5px solid transparent;transition:border-color .2s,color .2s;
}
.menu a:hover{border-bottom-color:var(--ottone)}
.menu__forte{border-bottom-color:var(--ottone)!important;color:var(--ottone)}
@media (min-width:1080px){.menu{display:flex}}

.apri-menu{
  width:2.6rem;height:2.6rem;border:1px solid var(--linea);background:transparent;
  border-radius:2px;cursor:pointer;display:grid;place-items:center;
}
.apri-menu span{display:block;width:1.1rem;height:1px;background:var(--notte);position:relative}
.apri-menu span::before,.apri-menu span::after{
  content:'';position:absolute;left:0;width:100%;height:1px;background:var(--notte);transition:transform .25s;
}
.apri-menu span::before{top:-.35rem}
.apri-menu span::after{top:.35rem}
@media (min-width:1080px){.apri-menu{display:none}}
@media (max-width:1079px){
  .menu{
    position:fixed;inset:4.4rem 0 auto;background:var(--crema);
    border-bottom:1px solid var(--linea);
    flex-direction:column;align-items:flex-start;gap:0;padding:.5rem clamp(1.2rem,5vw,2.5rem) 1.5rem;
    display:none;
  }
  .menu.aperto{display:flex}
  .menu a{width:100%;padding:.85rem 0;white-space:normal;border-bottom:1px solid var(--linea)}
  .menu__forte{color:var(--ottone)}
}

/* ═══ BOTTONI ═══ */
.bottone{
  display:inline-flex;align-items:center;gap:.7rem;
  font-family:var(--sans);font-size:.78rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;text-decoration:none;
  border:1.5px solid transparent;cursor:pointer;border-radius:1px;
  padding:1.05em 1.9em;transition:background .25s,color .25s,border-color .25s,transform .25s;
}
.bottone span{transition:transform .25s}
.bottone:hover span{transform:translateX(.28rem)}
.bottone--oro{background:var(--ottone);color:#fff;border-color:var(--ottone)}
.bottone--oro:hover{background:#9C7842;border-color:#9C7842}
.bottone--notte{background:var(--notte);color:var(--crema);border-color:var(--notte)}
.bottone--notte:hover{background:var(--ottone);border-color:var(--ottone);color:#fff}
.bottone--contorno{background:transparent;color:var(--ottone);border-color:var(--ottone)}
.bottone--contorno:hover{background:var(--ottone);color:#fff}
.collegamento{
  background:none;border:0;padding:0;cursor:pointer;font-family:var(--sans);
  font-size:.88rem;color:var(--tenue);text-decoration:none;border-bottom:1px solid var(--linea);
}
.collegamento:hover{color:var(--notte);border-bottom-color:var(--ottone)}

/* ═══ TITOLI ═══ */
h1{
  font-family:var(--serif);font-weight:400;color:var(--notte);
  font-size:clamp(2.3rem,1rem + 5vw,4.4rem);line-height:1.05;
  text-transform:uppercase;letter-spacing:.005em;
}
h2{
  font-family:var(--serif);font-weight:400;color:var(--notte);
  font-size:clamp(1.65rem,1rem + 2.1vw,2.5rem);line-height:1.18;
  text-transform:uppercase;letter-spacing:.02em;margin-bottom:1.4rem;text-wrap:balance;
}
h2 em,h1 em{font-style:normal;color:var(--ottone)}
h2.grande{font-size:clamp(1.9rem,1.1rem + 2.8vw,3rem)}
h2.centrato,p.centrato{text-align:center}
h2.centrato{margin-inline:auto}
h3{font-family:var(--serif);font-weight:500;font-size:1.2rem;line-height:1.3;color:var(--notte);margin-bottom:.35rem;letter-spacing:.01em}
p+p{margin-top:1.1rem}
.fascia p{max-width:var(--testo)}
p.centrato{margin-inline:auto}
p.largo{max-width:46rem}

.etichetta{
  font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ottone);
  margin-bottom:1rem;display:flex;align-items:center;gap:.8rem;
}
.etichetta::after{content:'';flex:1;height:1px;background:var(--linea);max-width:4.5rem}
.avvertenza{
  margin-top:2rem;padding-left:1.1rem;border-left:2px solid var(--ottone);
  color:var(--tenue);font-size:.95rem;
}

/* ═══ IMPIANTO ═══ */
.fascia{padding-block:clamp(3.6rem,9vw,6.5rem)}
.fascia--sabbia{background:var(--sabbia)}
.fascia--stretta{text-align:center}
.fascia--stretta p{margin-inline:auto;max-width:34rem}

/* ═══ APERTURA ═══ */
.apertura{padding-block:clamp(2.5rem,7vw,4.5rem) clamp(3rem,8vw,5.5rem)}
.apertura__griglia{display:grid;gap:clamp(2rem,5vw,4rem);align-items:center}
@media (min-width:900px){.apertura__griglia{grid-template-columns:1.05fr .95fr}}
.apertura__testo h1{margin-bottom:1.5rem}
.apertura__testo h1::after{
  content:'';display:block;width:3.5rem;height:2px;background:var(--ottone);margin-top:1.5rem;
}
.sottotitolo{
  font-family:var(--serif);font-size:clamp(1.35rem,1rem + 1.1vw,1.75rem);
  color:var(--ottone);margin-top:1.4rem;margin-bottom:.9rem;line-height:1.3;
}
.guida{color:var(--tenue);max-width:30rem;margin-bottom:2rem}
.guida strong{color:var(--notte);font-weight:600}
.riservato{
  display:flex;align-items:center;gap:.6rem;margin-top:1.4rem;
  font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tenue);
}
.riservato svg{width:1.1rem;height:1.1rem;flex-shrink:0;fill:none;stroke:var(--notte);stroke-width:1.5}

/* LA FIRMA */
.apertura__nodo{display:flex;flex-direction:column;align-items:center;gap:1.2rem}
.nodo__cornice{
  width:100%;max-width:24rem;aspect-ratio:4/5;
  background:linear-gradient(160deg,#fff 0%,var(--sabbia) 100%);
  border:1px solid var(--linea);position:relative;color:var(--ottone);
}
.nodo__cornice::after{
  content:'';position:absolute;inset:.55rem;border:1px solid color-mix(in srgb,var(--ottone) 28%,transparent);pointer-events:none;
}
.nodo__cornice svg{width:100%;height:100%}
.apertura__didascalia{
  font-family:var(--serif);font-style:italic;font-size:1rem;line-height:1.45;
  color:var(--tenue);text-align:center;max-width:22rem;
}

/* ═══ DUETTO (immagine + testo) ═══ */
.duetto{display:grid;gap:clamp(1.8rem,4vw,3.5rem);align-items:center}
@media (min-width:860px){
  .duetto{grid-template-columns:1fr 1.05fr}
  .duetto--rovescio .duetto__testo{order:1}
  .duetto--rovescio .figura{order:2}
}
.duetto__testo .bottone{margin-top:1.8rem}

/* ═══ LE FIGURE — riquadri in attesa delle foto vere ═══ */
.figura{
  position:relative;border:1px solid var(--linea);
  background:
    repeating-linear-gradient(115deg,transparent 0 22px,color-mix(in srgb,var(--ottone) 5%,transparent) 22px 23px),
    radial-gradient(120% 90% at 30% 20%,#fff 0%,var(--sabbia) 55%,#E7DDCD 100%);
}
.figura::after{
  content:'';position:absolute;inset:.6rem;border:1px solid color-mix(in srgb,var(--ottone) 25%,transparent);
}
/* Finché non arrivano le fotografie del cliente il riquadro porta il monogramma
   inciso: si legge come una scelta, non come un'immagine che manca. */
.figura::before{
  content:'FML';position:absolute;inset:0;display:grid;place-items:center;
  font-family:var(--serif);font-size:clamp(2.2rem,5.5vw,3.6rem);letter-spacing:.24em;
  text-indent:.24em;color:color-mix(in srgb,var(--ottone) 17%,transparent);
}
.fascia--sabbia .figura{
  background:
    repeating-linear-gradient(115deg,transparent 0 22px,color-mix(in srgb,var(--ottone) 5%,transparent) 22px 23px),
    radial-gradient(120% 90% at 30% 20%,#fff 0%,#FBF7F1 55%,var(--sabbia) 100%);
}
.figura--sigillo{aspect-ratio:5/4}
.figura--schermo{aspect-ratio:4/3}
.figura--orizzonte{aspect-ratio:16/9;min-height:14rem}

/* ═══ CONFRONTO ═══ */
.confronto{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea);margin-top:2rem}
@media (min-width:520px){.confronto{grid-template-columns:1fr 1fr}}
.confronto__voce{background:var(--crema);padding:1.4rem 1.3rem}
.fascia--sabbia .confronto__voce{background:var(--sabbia)}
.confronto__voce p{font-size:.93rem;color:var(--tenue);max-width:none}
.confronto__voce--forte{background:var(--notte)!important}
.confronto__voce--forte h3{color:var(--crema)}
.confronto__voce--forte p{color:color-mix(in srgb,var(--crema) 76%,transparent)}

/* ═══ ELENCO ═══ */
.elenco{list-style:none;margin-top:2.2rem;max-width:46rem}
.elenco li{padding:1.3rem 0;border-top:1px solid var(--linea)}
.elenco li:last-child{border-bottom:1px solid var(--linea)}
.elenco strong{display:block;font-family:var(--serif);font-size:1.18rem;font-weight:500;color:var(--notte);margin-bottom:.25rem}
.elenco span{color:var(--tenue);font-size:.94rem}

/* ═══ LE CARTE ═══ */
.carte{display:grid;gap:1rem;margin-top:2.2rem}
@media (min-width:780px){.carte{grid-template-columns:repeat(3,1fr)}}
.carta{background:var(--crema);border:1px solid var(--linea);padding:1.5rem 1.35rem;transition:transform .3s,box-shadow .3s}
.carta:hover{transform:translateY(-3px);box-shadow:0 14px 32px -22px rgba(18,40,63,.5)}
.carta__falso{
  font-family:var(--serif);font-style:italic;font-size:1.06rem;color:var(--tenue);line-height:1.35;
  margin-bottom:.85rem;padding-bottom:.85rem;border-bottom:1px solid var(--linea);max-width:none;
}
.carta__vero{font-size:.93rem;line-height:1.6;max-width:none}

/* ═══ LE STORIE (fila di icone) ═══ */
.storie{
  list-style:none;display:grid;gap:0;margin-top:2.6rem;
  grid-template-columns:repeat(2,1fr);
  border-top:1px solid var(--linea);border-left:1px solid var(--linea);
}
@media (min-width:640px){.storie{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1020px){.storie{grid-template-columns:repeat(6,1fr)}}
.storie li{
  padding:1.8rem 1rem;text-align:center;
  border-right:1px solid var(--linea);border-bottom:1px solid var(--linea);
}
.storie svg{
  width:2.6rem;height:2.6rem;margin:0 auto 1rem;
  fill:none;stroke:var(--ottone);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
}
.storie p{font-size:.9rem;line-height:1.5;color:var(--inchiostro);max-width:none}

/* ═══ L'INVITO ═══ */
.invito{
  margin-top:2.2rem;border:1px solid var(--linea);background:var(--crema);
  padding:clamp(1.4rem,3.5vw,2.2rem);display:grid;gap:1.6rem;align-items:center;
}
.fascia--sabbia .invito{background:color-mix(in srgb,#fff 55%,var(--sabbia))}
@media (min-width:860px){.invito{grid-template-columns:1fr auto;gap:2.5rem}}
.invito__titolo{font-family:var(--serif);font-size:1.35rem;color:var(--ottone);margin-bottom:.5rem}
.invito p{max-width:none;font-size:.96rem;color:var(--tenue)}
.invito p+p{margin-top:.15rem}
.invito__nota{margin-top:.9rem!important;font-size:.85rem!important}

/* ═══ LA CITAZIONE ═══ */
.citazione{background:var(--crema);border-block:1px solid var(--linea)}
.citazione__griglia{display:grid;gap:0;align-items:stretch}
@media (min-width:860px){.citazione__griglia{grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,3.5rem)}}
.citazione blockquote{position:relative;padding:clamp(2.5rem,6vw,4rem) 0;align-self:center}
.citazione__virgolette{
  font-family:var(--serif);font-size:5rem;line-height:.6;color:var(--ottone);
  display:block;margin-bottom:.6rem;opacity:.55;
}
.citazione blockquote p{
  font-family:var(--serif);font-size:clamp(1.5rem,1rem + 1.9vw,2.3rem);
  line-height:1.3;color:var(--notte);max-width:none;
}
.citazione__corsivo{font-style:italic;color:var(--ottone)!important;margin-top:.3rem!important}
/* 🔴 niente aspect-ratio qui: con align-self:stretch l'altezza la decide la riga
   e l'aspect-ratio ricalcola la larghezza, facendo sbordare il riquadro dalla colonna. */
.citazione .figura{align-self:stretch;width:100%;aspect-ratio:auto;min-height:18rem}

/* ═══ I PASSI ═══ */
.passi{list-style:none;counter-reset:p;margin-top:2.4rem;position:relative;max-width:46rem}
.passi::before{content:'';position:absolute;left:.7rem;top:.6rem;bottom:.6rem;width:1px;background:var(--linea)}
.passi li{counter-increment:p;position:relative;padding:0 0 2rem 2.8rem}
.passi li:last-child{padding-bottom:0}
.passi li::before{
  content:counter(p,decimal-leading-zero);position:absolute;left:0;top:.05rem;
  width:1.45rem;height:1.45rem;border-radius:50%;
  background:var(--crema);border:1px solid var(--ottone);color:var(--ottone);
  font-size:.6rem;font-weight:600;display:grid;place-items:center;
}
.fascia--sabbia .passi li::before{background:var(--sabbia)}
.passi p{color:var(--tenue);font-size:.95rem}

/* ═══ I NUMERI ═══ */
.numeri{display:grid;gap:1.6rem;margin-top:3rem;padding-top:2rem;border-top:1px solid var(--linea)}
@media (min-width:640px){.numeri{grid-template-columns:repeat(3,1fr);gap:2rem}}
.numeri strong{display:block;font-family:var(--serif);font-size:2.6rem;font-weight:400;line-height:1;color:var(--ottone)}
.numeri span{display:block;margin-top:.5rem;font-size:.86rem;color:var(--tenue);line-height:1.45}

/* ═══ CHI SONO ═══ */
.chi{display:grid;gap:clamp(1.8rem,4vw,3rem);align-items:start}
@media (min-width:900px){.chi{grid-template-columns:auto 1fr;grid-template-areas:'ritratto testo' 'garanzie garanzie'}
  .chi__ritratto{grid-area:ritratto}.chi__testo{grid-area:testo}.garanzie{grid-area:garanzie}}
@media (min-width:1180px){.chi{grid-template-columns:auto 1.15fr .85fr;grid-template-areas:'ritratto testo garanzie'}}
.chi__ritratto{
  width:clamp(9rem,22vw,13rem);aspect-ratio:1;border-radius:50%;
  background:linear-gradient(150deg,var(--notte),#1D3B58);
  display:grid;place-items:center;border:1px solid var(--ottone);flex-shrink:0;
}
.chi__ritratto span{
  font-family:var(--serif);font-size:2.2rem;letter-spacing:.12em;color:var(--ottone);
}
.chi__sono{font-family:var(--serif);font-size:1.15rem;color:var(--ottone);margin-bottom:.1rem}
.chi h2{margin-bottom:.5rem}
.chi__titoli{font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;color:var(--tenue);margin-bottom:1.2rem}
.chi__forte{font-weight:600;color:var(--notte)}
.chi__oro{color:var(--ottone);font-weight:600;margin-top:.3rem!important}

.garanzie{list-style:none;display:grid;gap:1.5rem;align-content:start}
@media (min-width:640px) and (max-width:1179px){.garanzie{grid-template-columns:repeat(3,1fr)}}
.garanzie li{display:flex;gap:1rem;align-items:flex-start}
.garanzie svg{width:2.1rem;height:2.1rem;flex-shrink:0;fill:none;stroke:var(--ottone);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.garanzie p{font-size:.92rem;line-height:1.55;color:var(--tenue);max-width:none}

/* ═══ LE DOMANDE ═══ */
.domande{margin-top:2.2rem;max-width:48rem;border-top:1px solid var(--linea)}
.domande details{border-bottom:1px solid var(--linea)}
.domande summary{
  cursor:pointer;list-style:none;padding:1.15rem 2.5rem 1.15rem 0;position:relative;
  font-family:var(--serif);font-size:clamp(1.08rem,.95rem + .4vw,1.28rem);color:var(--notte);line-height:1.35;
}
.domande summary::-webkit-details-marker{display:none}
.domande summary::after{
  content:'';position:absolute;right:.4rem;top:1.55rem;width:.62rem;height:.62rem;
  border-right:1.5px solid var(--ottone);border-bottom:1.5px solid var(--ottone);
  transform:rotate(45deg);transition:transform .25s;
}
.domande details[open] summary::after{transform:rotate(-135deg);top:1.75rem}
.domande details>div{padding:0 0 1.3rem}
.domande p{font-size:.96rem;color:var(--tenue);max-width:44rem}

/* ═══ LA VALUTAZIONE ═══ */
.verifica{
  margin-top:2.4rem;background:var(--crema);border:1px solid var(--linea);
  padding:clamp(1.4rem,4vw,2.4rem);max-width:52rem;
}
.fascia--sabbia .verifica{background:color-mix(in srgb,#fff 55%,var(--sabbia))}
.verifica__barra{height:2px;background:var(--linea);margin-bottom:1.9rem;overflow:hidden}
.verifica__barra span{display:block;height:100%;width:0;background:var(--ottone);transition:width .45s cubic-bezier(.4,0,.2,1)}
.verifica__passo{border:0}
.verifica__passo legend{
  font-family:var(--serif);font-size:clamp(1.3rem,1.05rem + .8vw,1.65rem);
  color:var(--notte);line-height:1.3;margin-bottom:1.3rem;
}
.scelte{display:flex;flex-wrap:wrap;gap:.6rem}
.scelta{
  font-family:var(--sans);font-size:.92rem;cursor:pointer;background:transparent;color:var(--inchiostro);
  border:1px solid var(--linea);border-radius:1px;padding:.72em 1.15em;transition:border-color .2s,background .2s,color .2s;
}
.scelta:hover{border-color:var(--ottone);background:color-mix(in srgb,var(--ottone) 8%,transparent)}
.scelta.presa{background:var(--notte);border-color:var(--notte);color:var(--crema)}
.verifica__riassunto{
  font-family:var(--serif);font-size:clamp(1.35rem,1.05rem + 1vw,1.8rem);
  line-height:1.32;color:var(--notte);margin-bottom:1rem;max-width:none;
}
.verifica__lettura{color:var(--tenue);font-size:.97rem;max-width:none}
.azioni{display:flex;flex-wrap:wrap;align-items:center;gap:1.3rem;margin-top:1.9rem}

/* ═══ CONTATTI ═══ */
.contatti{background:var(--notte);color:var(--crema);padding-block:clamp(3rem,7vw,5rem)}
.contatti__griglia{display:grid;gap:clamp(2rem,5vw,4rem);align-items:start}
@media (min-width:900px){.contatti__griglia{grid-template-columns:1fr 1.1fr}}
.contatti__icona{width:2.8rem;height:2.8rem;fill:none;stroke:var(--ottone);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:1.2rem}
.contatti h2{color:var(--crema);margin-bottom:.9rem}
.contatti p{color:color-mix(in srgb,var(--crema) 74%,transparent);max-width:26rem}
.contatti__voci{list-style:none;margin-top:2rem;display:grid;gap:1rem;border-top:1px solid rgba(250,247,242,.16);padding-top:1.6rem}
.contatti__voci li{display:flex;gap:.9rem;align-items:flex-start;font-size:.92rem;color:color-mix(in srgb,var(--crema) 80%,transparent)}
.contatti__voci svg{width:1.25rem;height:1.25rem;flex-shrink:0;margin-top:.28rem;fill:none;stroke:var(--ottone);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.contatti__voci a{color:var(--crema);text-decoration:none;border-bottom:1px solid rgba(200,164,104,.5)}
.contatti__voci a:hover{border-bottom-color:var(--ottone)}

.modulo{display:grid;gap:1.2rem}
@media (min-width:600px){.modulo{grid-template-columns:1fr 1fr}}
.campo--largo{grid-column:1/-1}
.campo label{display:block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--crema) 58%,transparent);margin-bottom:.5rem}
.campo input,.campo textarea{
  width:100%;font-family:var(--sans);font-size:1rem;color:var(--crema);background:transparent;
  border:0;border-bottom:1px solid rgba(250,247,242,.28);padding:.6rem 0;transition:border-color .25s;resize:vertical;
}
.campo input:focus,.campo textarea:focus{outline:none;border-bottom-color:var(--ottone)}
.campo input:user-invalid,.campo textarea:user-invalid{border-bottom-color:#D08A72}
.consenso label{display:flex;gap:.7rem;align-items:flex-start;text-transform:none;letter-spacing:0;font-size:.85rem;line-height:1.5;color:color-mix(in srgb,var(--crema) 72%,transparent)}
.consenso input{width:auto;flex-shrink:0;margin-top:.28rem;accent-color:var(--ottone)}
.consenso a{color:var(--crema)}
.modulo__sotto{margin-top:.9rem;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb,var(--crema) 55%,transparent)}
.modulo__stato{margin-top:.7rem;font-size:.9rem;min-height:1.2em}
.modulo__stato.buono{color:#A8CDA4}
.modulo__stato.male{color:#E2A08D}

/* ═══ PIÈ DI PAGINA ═══ */
.pieDiPagina{background:var(--notte-cupa);color:color-mix(in srgb,var(--crema) 62%,transparent);padding-block:2rem;font-size:.82rem}
.pieDiPagina__interno{display:grid;gap:.4rem;text-align:center}
.pieDiPagina a{color:color-mix(in srgb,var(--crema) 82%,transparent);text-decoration:none;border-bottom:1px solid rgba(200,164,104,.4)}
.pieDiPagina a:hover{border-bottom-color:var(--ottone)}

/* ═══ MOVIMENTO ═══ */
.pagina-viva [data-rivela]{
  opacity:0;transform:translateY(1rem);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);
}
.pagina-viva [data-rivela].dentro{opacity:1;transform:none}

.titolo-riempito .parola{color:color-mix(in srgb,var(--notte) 22%,transparent);transition:color .45s ease}
.titolo-riempito .parola.accesa{color:var(--notte)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  .pagina-viva [data-rivela]{opacity:1!important;transform:none!important}
  .titolo-riempito .parola{color:var(--notte)!important}
}

@media print{
  .testata,.verifica,.modulo,.apertura__nodo,.figura{display:none}
  body{background:#fff;color:#000;font-size:11pt}
}