/* =====================================================================
   STAR FIRE INVESTIGATION — foglio di stile
   Linguaggio: editoriale-tecnico scuro (evoluzione del prototipo)
   Disciplina cromatica:
     ember  = pericolo, urgenza, azione       (usato con parsimonia)
     cyan   = strumento, misura, dato rilevato
     oro    = norma, autorevolezza, firma STArchetipo
   ===================================================================== */

:root{
  --ink:#08090B;
  --ink-2:#0E1215;
  --ink-3:#151B1F;
  --paper:#ECEAE4;
  --paper-2:#DCDAD3;
  --paper-3:#C9C7C0;

  --ember:#F05B2B;
  --ember-d:#C4400F;
  --cyan:#62D7E5;
  --oro:#C9A84C;
  --giallo:#F3CB4D;   /* il giallo della stella nel logo */
  --verde:#61DC8A;

  --on-ink:#F5F3ED;
  --on-ink-mute:#9AA1A4;
  --on-paper:#101416;
  --on-paper-mute:#65696B;

  --line-d:rgba(255,255,255,.15);
  --line-d2:rgba(255,255,255,.28);
  --line-l:rgba(16,20,22,.17);
  --line-l2:rgba(16,20,22,.34);

  --f-disp:'Archivo','Helvetica Neue',Arial,sans-serif;
  --f-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-serif:'Instrument Serif',Georgia,'Times New Roman',serif;
  --f-mono:'IBM Plex Mono',ui-monospace,Consolas,monospace;

  --pad:7vw;
  /* La testata ha due stati: alta a inizio pagina, compatta appena si scorre.
     --headh è l'altezza COMPATTA e resta il riferimento per àncore e sticky. */
  --headh:88px;
  --head-tall:344px;
  --logo-big:300px;
  --logo-small:52px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--headh) + 8px);-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ink);color:var(--on-ink);
  font:400 17px/1.65 var(--f-body);
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
img,video,canvas,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
::selection{background:var(--ember);color:#fff}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}

h1,h2,h3,h4{font-family:var(--f-disp);font-weight:500;margin:0;line-height:1.02;letter-spacing:-.04em}
p{margin:0}
em,.serif{font-family:var(--f-serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
em{color:var(--ember)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------------- scala tipografica ---------------- */
.d1{font-size:clamp(3.3rem,8.4vw,7.2rem);line-height:.9;letter-spacing:-.045em}
.d2{font-size:clamp(2.4rem,5.2vw,4.5rem);line-height:1;letter-spacing:-.042em}
.d3{font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1.08;letter-spacing:-.03em}
.d4{font-size:clamp(1.12rem,1.6vw,1.34rem);line-height:1.2;letter-spacing:-.022em}

.eyebrow{font:500 .66rem/1 var(--f-mono);text-transform:uppercase;letter-spacing:.23em;
  color:var(--on-ink-mute);margin:0 0 26px;display:flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:30px;height:1px;background:var(--ember);flex:0 0 auto}
.eyebrow.cy::before{background:var(--cyan)}
.eyebrow.or::before{background:var(--oro)}
.label{font:500 .62rem/1 var(--f-mono);text-transform:uppercase;letter-spacing:.2em;color:var(--on-ink-mute)}
.lead{font-size:clamp(1.02rem,1.35vw,1.15rem);line-height:1.68;color:var(--on-ink-mute);max-width:62ch}

/* ---------------- superfici ---------------- */
.section{padding:clamp(72px,10vw,124px) var(--pad)}
.on-paper{background:var(--paper);color:var(--on-paper)}
.on-paper-2{background:var(--paper-2);color:var(--on-paper)}
.on-paper h1,.on-paper h2,.on-paper h3,.on-paper h4,
.on-paper-2 h1,.on-paper-2 h2,.on-paper-2 h3,.on-paper-2 h4{color:var(--on-paper)}
.on-paper .lead,.on-paper-2 .lead,
.on-paper .label,.on-paper-2 .label,
.on-paper .eyebrow,.on-paper-2 .eyebrow{color:var(--on-paper-mute)}
.on-ink-2{background:var(--ink-2)}

/* ---------------- bottoni ---------------- */
.btn{display:inline-flex;align-items:center;gap:.6em;justify-content:center;
  padding:17px 24px;border:1px solid var(--line-d2);background:transparent;color:inherit;
  font:500 .74rem/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease}
.btn:hover{background:rgba(255,255,255,.07);border-color:var(--on-ink);transform:translateY(-2px)}
.btn.primary{background:var(--ember);border-color:var(--ember);color:#fff}
.btn.primary:hover{background:var(--ember-d);border-color:var(--ember-d);
  box-shadow:0 10px 30px rgba(240,91,43,.32)}
.btn.gold{background:transparent;border-color:var(--oro);color:var(--oro)}
.btn.gold:hover{background:var(--oro);color:var(--ink)}
.on-paper .btn,.on-paper-2 .btn{border-color:var(--line-l2)}
.on-paper .btn:hover,.on-paper-2 .btn:hover{background:rgba(16,20,22,.06);border-color:var(--on-paper)}
.on-paper .btn.primary,.on-paper-2 .btn.primary{color:#fff;border-color:var(--ember)}
.btn.sm{padding:12px 17px;font-size:.68rem}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:40px}
@media(max-width:520px){.actions{flex-direction:column;align-items:stretch}}

/* ---------------- header ---------------- */
.progress{position:fixed;top:0;left:0;height:2px;width:0;background:var(--ember);z-index:120;
  transition:width .1s linear;box-shadow:0 0 12px rgba(240,91,43,.7)}
/* Fissa e sovrapposta: a inizio pagina è alta e trasparente sopra l'hero, così il
   logo grande non spinge il titolo fuori schermo. Allo scorrimento si compatta. */
.site-head{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--head-tall);
  display:flex;align-items:center;padding:0 var(--pad);
  background:transparent;border-bottom:1px solid transparent;
  transition:height .45s cubic-bezier(.2,.7,.3,1),background .35s ease,
             border-color .35s ease,backdrop-filter .35s ease}
.site-head.solid{height:var(--headh);background:rgba(8,9,11,.93);
  backdrop-filter:blur(14px);border-bottom-color:var(--line-d)}
.brand{display:flex;align-items:center;gap:24px;flex:0 0 auto;
  transition:gap .45s cubic-bezier(.2,.7,.3,1)}
.site-head.solid .brand{gap:13px}
.brand img{width:var(--logo-big);height:var(--logo-big);object-fit:contain;
  filter:drop-shadow(0 6px 22px rgba(0,0,0,.5));
  transition:width .45s cubic-bezier(.2,.7,.3,1),height .45s cubic-bezier(.2,.7,.3,1)}
.site-head.solid .brand img{width:var(--logo-small);height:var(--logo-small);
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.45))}
/* firma su tre righe: nome, disciplina, studio — scala insieme al logo */
.brand .bt b{display:block;font:700 1.16rem/1.15 var(--f-mono);letter-spacing:.11em;
  text-transform:uppercase;white-space:nowrap;
  transition:font-size .45s cubic-bezier(.2,.7,.3,1)}
/* «> span»: solo le righe sotto il marchio, non le parole colorate dentro <b> */
.brand .bt > span{display:block;font:400 .84rem/1.4 var(--f-body);color:#AEB5B8;
  letter-spacing:.07em;margin-top:4px;white-space:nowrap;
  transition:font-size .45s cubic-bezier(.2,.7,.3,1)}
.brand .bt > span:last-child{color:#868D90}
.site-head.solid .brand .bt b{font-size:.78rem;letter-spacing:.1em}
.site-head.solid .brand .bt > span{font-size:.62rem;margin-top:2px;color:var(--on-ink-mute)}
.site-head.solid .brand .bt > span:last-child{color:#727A7D}

/* Marchio tricolore, ripreso dal logo: stella gialla, fiamma arancione, mirino azzurro */
.marchio span{display:inline;font:inherit;letter-spacing:inherit;margin:0;white-space:nowrap}
.marchio .m-star{color:var(--giallo)}
.marchio .m-fire{color:var(--ember)}
.marchio .m-inv{color:var(--cyan)}

@media(max-width:1200px){:root{--logo-big:210px;--head-tall:254px}
  .brand .bt b{font-size:1rem}.brand .bt > span{font-size:.76rem}}
@media(max-width:940px){:root{--logo-big:148px;--head-tall:186px}
  .brand{gap:18px}.brand .bt b{font-size:.86rem}.brand .bt > span{font-size:.68rem}}
@media(max-width:620px){:root{--logo-big:100px;--head-tall:132px;--logo-small:42px}
  .brand{gap:14px}.brand .bt b{font-size:.72rem;letter-spacing:.07em}
  .brand .bt > span{font-size:.6rem}
  .site-head.solid .brand .bt b{font-size:.66rem}
  .site-head.solid .brand .bt > span{font-size:.56rem}}
nav.main{margin-left:auto;display:flex;gap:6px;align-items:center}
nav.main a{font:500 .72rem/1 var(--f-mono);letter-spacing:.11em;text-transform:uppercase;
  color:var(--on-ink-mute);padding:11px 13px;transition:color .18s}
nav.main a:hover{color:var(--on-ink)}
.head-cta{margin-left:22px;flex:0 0 auto;display:flex;align-items:center;gap:18px}
.tel-head{font:500 .95rem/1.1 var(--f-mono);letter-spacing:.02em;color:#fff;white-space:nowrap;
  transition:color .18s}
.tel-head span{display:block;font-size:.56rem;letter-spacing:.19em;text-transform:uppercase;
  color:var(--ember);margin-bottom:4px}
.tel-head:hover{color:var(--ember)}
@media(max-width:1160px){.tel-head{display:none}}
.navtoggle{display:none;margin-left:auto;width:44px;height:44px;background:none;
  border:1px solid var(--line-d2);cursor:pointer;align-items:center;justify-content:center}
.navtoggle span{display:block;width:18px;height:1px;background:var(--on-ink);position:relative}
.navtoggle span::before,.navtoggle span::after{content:"";position:absolute;left:0;width:18px;height:1px;background:var(--on-ink)}
.navtoggle span::before{top:-6px}.navtoggle span::after{top:6px}
@media(max-width:940px){
  nav.main{position:fixed;inset:var(--head-tall) 0 auto 0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--ink-2);border-bottom:1px solid var(--line-d);padding:10px var(--pad) 22px;display:none;
    transition:top .45s cubic-bezier(.2,.7,.3,1)}
  .site-head.solid nav.main{top:var(--headh)}
  nav.main.open{display:flex}
  nav.main a{padding:16px 0;border-bottom:1px solid var(--line-d);font-size:.8rem}
  .navtoggle{display:flex}
  .head-cta{display:none}
}

/* ---------------- HERO ---------------- */
.hero{position:relative;min-height:min(104vh,960px);display:flex;align-items:center;
  padding:calc(var(--head-tall) + 16px) var(--pad) 96px;overflow:hidden;isolation:isolate;
  background:var(--ink-2) center/cover no-repeat}
.hero-bg{position:absolute;inset:0;z-index:0;background-position:center;background-size:cover}
.hero-bg video{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.4s ease}
.hero-bg video.ready{opacity:1}
/* reticolo tecnico: leggibile solo a destra, dove non c'è testo */
.hero .grid{position:absolute;inset:0;z-index:1;opacity:.17;pointer-events:none;
  background-image:linear-gradient(rgba(98,215,229,.34) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(98,215,229,.34) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:linear-gradient(90deg,transparent 38%,#000 78%);
          mask-image:linear-gradient(90deg,transparent 38%,#000 78%)}
.hero .scan{position:absolute;z-index:2;top:0;bottom:0;width:1px;left:56%;pointer-events:none;
  background:linear-gradient(transparent,var(--cyan) 45%,transparent);
  box-shadow:0 0 40px 10px rgba(98,215,229,.22);animation:scan 9s cubic-bezier(.5,0,.5,1) infinite}
@keyframes scan{0%,100%{left:52%;opacity:.35}50%{left:92%;opacity:1}}
#embers{position:absolute;inset:0;z-index:2;pointer-events:none}
/* scrim: garantisce contrasto AA sul testo a sinistra */
.hero::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(7,9,11,.97) 0%,rgba(7,9,11,.85) 37%,transparent 78%),
    linear-gradient(0deg,rgba(9,12,14,.85) 0%,transparent 35%)}
.hero-content{position:relative;z-index:4;max-width:880px;width:100%}
.hero h1{max-width:14ch}
.hero .lead{margin-top:32px;max-width:52ch;color:#BFC5C7;font-size:clamp(1.05rem,1.5vw,1.22rem)}
.hero .status{position:absolute;left:0;right:0;bottom:0;z-index:4;
  border-top:1px solid var(--line-d);padding:20px var(--pad);
  font:500 .62rem/1.6 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:#A3A9AB;
  display:flex;gap:10px 30px;flex-wrap:wrap;align-items:center}
.hero .status b{color:var(--verde);font-size:.9em}
.hero .status .sep{color:var(--line-d2)}
@media(max-width:700px){
  .hero{min-height:auto;padding-bottom:120px}
  .hero::after{background:linear-gradient(180deg,rgba(7,9,11,.9),rgba(7,9,11,.82))}
  .hero .grid{-webkit-mask-image:none;mask-image:none;opacity:.09}
  .hero .scan{display:none}
}

/* ---------------- barra 72 ore ---------------- */
.allarme{background:var(--ember);color:#fff;padding:18px var(--pad);
  display:flex;gap:14px 26px;align-items:center;flex-wrap:wrap;
  font:500 .78rem/1.5 var(--f-mono);letter-spacing:.06em}
.allarme strong{font-weight:700;text-transform:uppercase;letter-spacing:.13em;font-size:.9em}
.allarme a{border-bottom:1px solid rgba(255,255,255,.55);padding-bottom:1px}
.allarme a:hover{border-bottom-color:#fff}
.allarme .clock{font-size:1.5em;font-weight:500;letter-spacing:-.02em}

/* ---------------- griglia editoriale ---------------- */
.split{display:grid;grid-template-columns:.42fr 1.5fr .68fr;gap:5vw;align-items:start}
.split-2{display:grid;grid-template-columns:1fr .58fr;gap:8vw;align-items:end}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:34px}.split-2{grid-template-columns:1fr;gap:34px;align-items:start}}
.avviso{border-top:2px solid var(--ember);padding-top:20px}
.avviso b{display:block;color:var(--ember);font:700 .74rem/1 var(--f-mono);
  letter-spacing:.13em;text-transform:uppercase;margin-bottom:12px}
.avviso p{font-size:.93rem;line-height:1.7;color:var(--on-paper-mute)}
.avviso ul{margin:12px 0 0;padding-left:16px;font-size:.9rem;color:var(--on-paper-mute)}
.avviso li{margin:6px 0}

/* ---------------- numeri ---------------- */
.numeri{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-d)}
@media(max-width:860px){.numeri{grid-template-columns:1fr 1fr}}
@media(max-width:460px){.numeri{grid-template-columns:1fr}}
.numero{padding:34px 26px 30px;border-right:1px solid var(--line-d);border-bottom:1px solid var(--line-d)}
.numero:last-child{border-right:0}
@media(max-width:860px){.numero:nth-child(2n){border-right:0}}
@media(max-width:460px){.numero{border-right:0}}
.numero .n{font:500 clamp(2.4rem,4.4vw,3.4rem)/1 var(--f-disp);letter-spacing:-.05em;color:var(--on-ink)}
.numero .n .u{font-size:.42em;color:var(--ember);letter-spacing:0;margin-left:.14em;vertical-align:super}
.numero .l{margin-top:14px;font-size:.88rem;line-height:1.55;color:var(--on-ink-mute);max-width:26ch}
.on-paper .numero,.on-paper-2 .numero{border-color:var(--line-l)}
.on-paper .numero .n{color:var(--on-paper)}
.on-paper .numero .l{color:var(--on-paper-mute)}

/* ---------------- servizi ---------------- */
.filtri{display:flex;gap:0;flex-wrap:wrap;margin:56px 0 0;border-top:1px solid var(--line-l)}
.filtri button{border:0;border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l);
  background:transparent;color:var(--on-paper-mute);cursor:pointer;padding:16px 22px;
  font:500 .68rem/1 var(--f-mono);letter-spacing:.13em;text-transform:uppercase;
  transition:background .18s,color .18s;flex:1 1 auto;min-width:max-content}
.filtri button:hover{background:rgba(16,20,22,.05);color:var(--on-paper)}
.filtri button.on{background:var(--on-paper);color:var(--paper)}
.filtri .conteggio{margin-left:auto;padding:16px 22px;border-bottom:1px solid var(--line-l);
  font:500 .68rem/1 var(--f-mono);letter-spacing:.13em;color:var(--on-paper-mute);
  display:flex;align-items:center;gap:8px}
.filtri .conteggio b{color:var(--ember)}
@media(max-width:700px){.filtri .conteggio{display:none}.filtri button{flex:1 1 45%}}

.schede{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--line-l)}
@media(max-width:1200px){.schede{grid-template-columns:repeat(3,1fr)}}
@media(max-width:940px){.schede{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.schede{grid-template-columns:1fr}}
.scheda{border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l);
  padding:26px 24px 28px;display:flex;flex-direction:column;min-height:360px;
  transition:background .25s ease;position:relative}
.scheda::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--ember);
  transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.8,.3,1)}
.scheda:hover{background:rgba(16,20,22,.045)}
.scheda:hover::before{transform:scaleX(1)}
.scheda .k{font:500 .62rem/1 var(--f-mono);letter-spacing:.16em;color:var(--ember)}
.scheda .fam{font:500 .58rem/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;
  color:var(--on-paper-mute);margin-top:6px}
.scheda .glifo{margin:34px 0 26px;width:44px;height:44px;color:var(--on-paper)}
.scheda .glifo svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.25;
  stroke-linecap:round;stroke-linejoin:round}
.scheda[data-fam="indagine"] .glifo{color:var(--ember-d)}
.scheda[data-fam="prova"] .glifo{color:#1E7C88}
.scheda[data-fam="tutela"] .glifo{color:#967A22}
.scheda[data-fam="oltre"] .glifo{color:#2F7A4E}
.scheda h3{font-size:1.32rem;letter-spacing:-.03em;line-height:1.12}
.scheda p{margin-top:13px;font-size:.9rem;line-height:1.68;color:var(--on-paper-mute)}
.scheda ul{margin:14px 0 0;padding-left:15px;font-size:.83rem;line-height:1.6;color:var(--on-paper-mute)}
.scheda ul li{margin:5px 0}
.scheda .quando{margin-top:auto;padding-top:20px;font:500 .68rem/1.5 var(--f-mono);
  letter-spacing:.05em;color:var(--on-paper);border-top:1px solid var(--line-l)}
.scheda .quando span{color:var(--on-paper-mute);display:block;text-transform:uppercase;
  font-size:.85em;letter-spacing:.14em;margin-bottom:5px}
.scheda.hide{display:none}

/* ---------------- pagina servizi: dettaglio ---------------- */
.hero-mini{position:relative;padding:calc(var(--head-tall) + 24px) var(--pad) 72px;overflow:hidden;
  background:linear-gradient(150deg,#0B1216 0%,var(--ink) 55%,#101A20 100%)}
.hero-mini::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(620px 320px at 88% 12%,rgba(240,91,43,.16),transparent 62%)}
.hero-mini > *{position:relative;z-index:1}
.hero-mini .briciole{font:500 .64rem/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;
  color:var(--on-ink-mute);margin-bottom:28px}
.hero-mini .briciole a:hover{color:var(--oro)}

.famiglia{border-top:1px solid var(--line-l);padding-top:34px;margin-top:8px}
.famiglia-testa{display:grid;grid-template-columns:.42fr 1.6fr;gap:5vw;align-items:start;margin-bottom:12px}
@media(max-width:900px){.famiglia-testa{grid-template-columns:1fr;gap:18px}}
.famiglia-testa .idx{font:500 .68rem/1 var(--f-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--ember)}
.famiglia-testa h2{font-size:clamp(1.9rem,3.6vw,3rem);letter-spacing:-.04em}
.famiglia-testa p{margin-top:16px;font-size:1rem;line-height:1.7;color:var(--on-paper-mute);max-width:62ch}

.dettaglio{display:grid;grid-template-columns:.42fr 1.6fr;gap:5vw;
  border-top:1px solid var(--line-l);padding:38px 0}
@media(max-width:900px){.dettaglio{grid-template-columns:1fr;gap:20px;padding:30px 0}}
.dettaglio .sx .k{font:500 .64rem/1 var(--f-mono);letter-spacing:.16em;color:var(--ember)}
.dettaglio .sx h3{margin-top:12px;font-size:clamp(1.34rem,2.1vw,1.74rem);letter-spacing:-.032em}
.dettaglio .sx .fonte{margin-top:14px;font:500 .58rem/1.6 var(--f-mono);letter-spacing:.13em;
  text-transform:uppercase;color:var(--on-paper-mute);border-left:2px solid var(--oro);padding-left:12px}
.dettaglio .dx > p{font-size:1.02rem;line-height:1.72;color:#3A3F41;max-width:64ch}
.blocchi{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:26px}
@media(max-width:700px){.blocchi{grid-template-columns:1fr;gap:20px}}
.blocco h4{font:500 .6rem/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;
  color:var(--on-paper-mute);margin:0 0 12px;font-family:var(--f-mono)}
.blocco ul{margin:0;padding-left:16px;font-size:.92rem;line-height:1.66;color:#3A3F41}
.blocco li{margin:7px 0}
.blocco.esito{grid-column:1/-1;border-top:1px solid var(--line-l);padding-top:18px}
.blocco.esito p{margin:0;font-size:.95rem;line-height:1.68;color:#3A3F41}

.chiusura{padding:clamp(70px,9vw,110px) var(--pad);text-align:left;
  background:radial-gradient(circle at 20% 50%,rgba(23,54,59,.85),transparent 45%),var(--ink)}
.chiusura h2{max-width:16ch}

/* ---------------- pagine documentali (privacy, cookie) ---------------- */
.documento{padding:clamp(56px,7vw,88px) var(--pad) clamp(70px,9vw,110px)}
.documento .corpo{max-width:74ch}
.documento h2{font-size:clamp(1.4rem,2.4vw,1.9rem);letter-spacing:-.032em;
  margin:52px 0 16px;padding-top:26px;border-top:1px solid var(--line-l)}
.documento h2:first-of-type{margin-top:8px}
.documento h3{font-size:1.06rem;letter-spacing:-.02em;margin:28px 0 10px}
.documento p{margin-bottom:1.05em;font-size:1rem;line-height:1.75;color:#3A3F41}
.documento ul,.documento ol{margin:0 0 1.2em;padding-left:20px;font-size:1rem;
  line-height:1.72;color:#3A3F41}
.documento li{margin:8px 0}
.documento strong{color:var(--on-paper)}
.documento .agg{font:500 .64rem/1 var(--f-mono);letter-spacing:.15em;text-transform:uppercase;
  color:var(--on-paper-mute);margin-bottom:34px}
.documento table{width:100%;border-collapse:collapse;margin:6px 0 1.4em;font-size:.94rem}
.documento th,.documento td{text-align:left;vertical-align:top;padding:12px 14px 12px 0;
  border-bottom:1px solid var(--line-l);color:#3A3F41}
.documento th{font:500 .62rem/1.4 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;
  color:var(--on-paper-mute);white-space:nowrap;padding-right:26px}
.documento .nota{border-left:2px solid var(--ember);padding:2px 0 2px 18px;margin:26px 0;
  font-size:.95rem;line-height:1.7;color:#3A3F41}
.documento .nota b{display:block;font:500 .62rem/1 var(--f-mono);letter-spacing:.15em;
  text-transform:uppercase;color:var(--ember);margin-bottom:9px}
.documento a{color:#1B5E8C;text-decoration:underline}
.documento a:hover{color:var(--ember-d)}

/* ---------------- metodo ---------------- */
.metodo{display:grid;grid-template-columns:1fr 1fr;min-height:820px;align-items:stretch}
@media(max-width:900px){.metodo{grid-template-columns:1fr}}
.metodo .visual{position:relative;overflow:hidden;min-height:420px;
  background:#07090A center/cover no-repeat}
.metodo .visual video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity 1.2s ease}
.metodo .visual video.ready{opacity:1}
/* velo scuro: tiene il testo del figcaption leggibile su qualsiasi fotogramma */
.metodo .visual::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(0deg,rgba(7,9,10,.85) 0%,transparent 42%),
             linear-gradient(90deg,rgba(7,9,10,.5),transparent 55%)}
.metodo .visual .reticolo{position:absolute;inset:8%;pointer-events:none;opacity:.5;
  transform:perspective(620px) rotateX(58deg) rotateZ(-15deg);
  background-image:linear-gradient(rgba(98,215,229,.3) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(98,215,229,.3) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(circle at 50% 50%,#000 20%,transparent 72%);
          mask-image:radial-gradient(circle at 50% 50%,#000 20%,transparent 72%)}
.metodo .visual .ping{position:absolute;left:50%;top:56%;width:14px;height:14px;margin:-7px 0 0 -7px;
  border-radius:50%;border:1px solid var(--ember);animation:ping 3.4s ease-out infinite}
.metodo .visual .ping:nth-child(2){animation-delay:1.13s}
.metodo .visual .ping:nth-child(3){animation-delay:2.26s}
@keyframes ping{0%{transform:scale(1);opacity:.9}100%{transform:scale(16);opacity:0}}
.metodo .visual .reticolo,.metodo .visual .ping{z-index:2}
.metodo .visual figcaption{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:22px 30px;
  border-top:1px solid var(--line-d);font:500 .62rem/1.6 var(--f-mono);
  letter-spacing:.15em;text-transform:uppercase;color:#B4BBBD}
.metodo .copy{padding:clamp(64px,8vw,104px) var(--pad)}
.passi{margin-top:52px}
.passo{display:grid;grid-template-columns:52px 1fr;gap:8px;border-top:1px solid var(--line-d);padding:24px 0}
.passo:last-child{border-bottom:1px solid var(--line-d)}
.passo .k{font:500 .62rem/1.9 var(--f-mono);letter-spacing:.14em;color:var(--ember)}
.passo h3{font-size:1.24rem;letter-spacing:-.028em}
.passo p{margin-top:9px;font-size:.9rem;line-height:1.7;color:var(--on-ink-mute)}
.passo .norma{display:inline-block;margin-top:11px;font:500 .6rem/1 var(--f-mono);
  letter-spacing:.13em;text-transform:uppercase;color:var(--oro);
  border:1px solid rgba(201,168,76,.4);padding:6px 10px}

/* ---------------- semiotica ---------------- */
.semio{display:grid;grid-template-columns:1.02fr .98fr;gap:6vw;align-items:center;margin-top:60px}
@media(max-width:900px){.semio{grid-template-columns:1fr;gap:38px}}
.semio-stage{border:1px solid var(--line-d);background:linear-gradient(160deg,#0B1216,#141C21);
  position:relative;overflow:hidden}
.semio-stage svg{width:100%;height:auto;display:block}
.semio-stage figcaption{border-top:1px solid var(--line-d);padding:16px 20px;
  font:500 .6rem/1.5 var(--f-mono);letter-spacing:.15em;text-transform:uppercase;color:#8E9598}
.semio-tabs{display:flex;flex-wrap:wrap;border-top:1px solid var(--line-d);margin-bottom:30px}
.semio-tabs button{flex:1 1 auto;border:0;border-right:1px solid var(--line-d);
  border-bottom:1px solid var(--line-d);background:transparent;color:var(--on-ink-mute);
  padding:14px 16px;cursor:pointer;font:500 .64rem/1 var(--f-mono);letter-spacing:.12em;
  text-transform:uppercase;transition:background .18s,color .18s;min-width:max-content}
.semio-tabs button:hover{color:var(--on-ink);background:rgba(255,255,255,.05)}
.semio-tabs button.on{background:var(--cyan);color:var(--ink);border-color:var(--cyan)}
.semio-info h3{font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:-.032em}
.semio-info .tratto{font:500 .62rem/1 var(--f-mono);letter-spacing:.17em;text-transform:uppercase;
  color:var(--cyan);margin-bottom:14px}
.semio-info p{margin-top:16px;font-size:.98rem;line-height:1.72;color:var(--on-ink-mute)}
.semio-info .indica{margin-top:22px;border-left:2px solid var(--oro);padding:4px 0 4px 18px}
.semio-info .indica b{display:block;font:500 .62rem/1 var(--f-mono);letter-spacing:.15em;
  text-transform:uppercase;color:var(--oro);margin-bottom:8px}
.semio-info .indica p{margin-top:0;font-size:.93rem;color:#B6BCBE}

/* ---------------- scenari ---------------- */
.scenario{display:grid;grid-template-columns:56px 1fr 1.25fr 34px;gap:26px;align-items:center;
  padding:30px 0;border-bottom:1px solid var(--line-l)}
.scenario:first-of-type{border-top:1px solid var(--line-l);margin-top:60px}
.scenario .k{font:500 .62rem/1 var(--f-mono);letter-spacing:.14em;color:var(--ember)}
.scenario h3{font-size:1.42rem;letter-spacing:-.03em}
.scenario p{font-size:.93rem;line-height:1.68;color:var(--on-paper-mute)}
.scenario .go{font:400 1.15rem/1 var(--f-mono);color:var(--ember);text-align:right;
  transition:transform .22s ease}
.scenario:hover .go{transform:translate(4px,-4px)}
@media(max-width:820px){
  .scenario{grid-template-columns:40px 1fr 28px;gap:16px}
  .scenario p{grid-column:2/4}
}

/* ---------------- casi ---------------- */
.casi{display:grid;grid-template-columns:repeat(3,1fr);border-left:1px solid var(--line-d);margin-top:60px}
@media(max-width:980px){.casi{grid-template-columns:1fr}}
.caso{border-right:1px solid var(--line-d);border-bottom:1px solid var(--line-d);
  border-top:1px solid var(--line-d);padding:30px 26px 32px}
.caso .k{font:500 .62rem/1 var(--f-mono);letter-spacing:.15em;color:var(--cyan);text-transform:uppercase}
.caso h3{margin-top:14px;font-size:1.24rem;letter-spacing:-.028em}
.caso dl{margin:22px 0 0}
.caso dt{font:500 .58rem/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;
  color:var(--on-ink-mute);margin-top:16px}
.caso dt:first-child{margin-top:0}
.caso dd{margin:7px 0 0;font-size:.9rem;line-height:1.62;color:#BFC5C7}
.caso .esito{margin-top:22px;border-top:1px solid var(--line-d);padding-top:16px;
  font-size:.9rem;line-height:1.6;color:var(--verde)}

/* ---------------- FAQ ---------------- */
.faq{border-bottom:1px solid var(--line-l)}
.faq:first-of-type{border-top:1px solid var(--line-l);margin-top:56px}
.faq summary{cursor:pointer;list-style:none;padding:26px 0;display:flex;align-items:flex-start;gap:22px;
  font-family:var(--f-disp);font-weight:500;font-size:clamp(1.08rem,1.7vw,1.36rem);
  letter-spacing:-.026em;line-height:1.3;transition:color .18s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--ember-d)}
.faq summary::after{content:"+";margin-left:auto;font:400 1.5rem/1 var(--f-mono);color:var(--ember);
  flex:0 0 auto;transition:transform .25s ease}
.faq[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 60px 30px 0;max-width:82ch;font-size:.97rem;line-height:1.75;color:var(--on-paper-mute)}
.faq .a p+p{margin-top:14px}

/* ---------------- contatti ---------------- */
.contatti{padding:clamp(72px,10vw,124px) var(--pad);
  background:radial-gradient(circle at 78% 46%,rgba(23,54,59,.9),transparent 42%),var(--ink)}
.contatti-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:7vw;align-items:start}
@media(max-width:940px){.contatti-grid{grid-template-columns:1fr;gap:46px}}
.form{border:1px solid var(--line-d);padding:32px;background:rgba(255,255,255,.025)}
.form label{display:block;font:500 .62rem/1 var(--f-mono);letter-spacing:.15em;text-transform:uppercase;
  color:var(--on-ink-mute);margin:22px 0 9px}
.form > label:first-of-type,.form .due label{margin-top:0}
.form .due label:first-child{margin-top:0}
.form input,.form select,.form textarea{width:100%;padding:14px 15px;border:1px solid var(--line-d2);
  background:rgba(0,0,0,.35);color:var(--on-ink);font:400 .95rem var(--f-body);
  transition:border-color .18s,box-shadow .18s}
.form input::placeholder,.form textarea::placeholder{color:#6C7376}
.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:var(--cyan);
  box-shadow:0 0 0 3px rgba(98,215,229,.16)}
.form select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--on-ink-mute) 50%),
  linear-gradient(135deg,var(--on-ink-mute) 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:44px}
.form textarea{min-height:126px;resize:vertical;font-family:var(--f-body)}
.form .due{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}
@media(max-width:520px){.form .due{grid-template-columns:1fr}}
/* il consenso è testo da leggere, non un'etichetta di campo: torna al corpo normale */
.form .consenso{display:flex;gap:12px;align-items:flex-start;margin-top:26px;
  font:400 .84rem/1.6 var(--f-body);letter-spacing:normal;text-transform:none;
  color:var(--on-ink-mute)}
.form .consenso input{width:auto;flex:0 0 auto;margin-top:3px;accent-color:var(--ember)}
.form .btn{width:100%;margin-top:26px}
.form .esito{margin-top:18px;border-left:2px solid var(--verde);padding-left:16px;
  font-size:.87rem;line-height:1.6;color:var(--verde)}
.recapito{display:grid;grid-template-columns:44px 1fr;gap:18px;padding:22px 0;
  border-bottom:1px solid var(--line-d)}
.recapito:last-of-type{border-bottom:0}
.recapito .ic{width:44px;height:44px;border:1px solid rgba(201,168,76,.4);display:grid;place-items:center}
.recapito .ic svg{width:19px;height:19px;stroke:var(--oro);fill:none;stroke-width:1.4;
  stroke-linecap:round;stroke-linejoin:round}
.recapito b{display:block;font:500 .62rem/1 var(--f-mono);letter-spacing:.15em;text-transform:uppercase;
  color:var(--on-ink-mute);margin-bottom:8px}
.recapito .v{font-size:1.02rem;line-height:1.45}
.recapito .v a:hover{color:var(--oro)}
.recapito .v.urgente{font:500 clamp(1.5rem,2.6vw,1.95rem)/1.1 var(--f-disp);letter-spacing:-.03em}
.recapito .v.urgente a{color:#fff;transition:color .18s}
.recapito .v.urgente a:hover{color:var(--ember)}
.recapito small{display:block;margin-top:5px;font-size:.82rem;color:var(--on-ink-mute)}
/* numeri di sede: secondari, allineati su una riga a filo */
.sedi{display:flex;flex-wrap:wrap;gap:1px;margin-top:16px;background:var(--line-d)}
.sedi a{flex:1 1 auto;min-width:max-content;background:rgba(255,255,255,.03);
  padding:11px 15px;font:500 .84rem/1.2 var(--f-mono);color:#C3C9CB;
  transition:background .18s,color .18s}
.sedi a span{display:block;font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--on-ink-mute);margin-bottom:5px}
.sedi a:hover{background:rgba(201,168,76,.14);color:#fff}
.sedi a:hover span{color:var(--oro)}

/* ---------------- footer ---------------- */
.site-foot{border-top:1px solid var(--line-d);background:var(--ink)}
.foot-cols{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:44px;
  padding:60px var(--pad) 40px}
@media(max-width:900px){.foot-cols{grid-template-columns:1fr 1fr;gap:34px}}
@media(max-width:560px){.foot-cols{grid-template-columns:1fr}}
.foot-cols h4{font:500 .62rem/1 var(--f-mono);letter-spacing:.18em;text-transform:uppercase;
  color:var(--on-ink-mute);margin-bottom:18px}
.foot-cols a{display:block;padding:6px 0;font-size:.9rem;color:#B0B6B8;transition:color .16s}
.foot-cols a:hover{color:var(--oro)}
.foot-brand{display:flex;gap:14px;align-items:center;margin-bottom:18px}
.foot-brand img{width:52px;height:52px;object-fit:contain;
  filter:drop-shadow(0 3px 12px rgba(0,0,0,.5))}
.foot-brand b{display:block;font:700 .8rem/1.2 var(--f-mono);letter-spacing:.1em;text-transform:uppercase}
.foot-brand > div > span{display:block;font-size:.72rem;line-height:1.4;color:var(--on-ink-mute);margin-top:3px}
.foot-brand > div > span:last-child{color:#727A7D}
.foot-cols .disclaimer{font-size:.82rem;line-height:1.7;color:#7E8587;max-width:46ch;
  border-left:1px solid rgba(201,168,76,.35);padding-left:16px;margin-top:20px}
.foot-legale{border-top:1px solid var(--line-d);padding:22px var(--pad) 30px;
  display:flex;gap:14px 28px;flex-wrap:wrap;justify-content:space-between;
  font:500 .62rem/1.7 var(--f-mono);letter-spacing:.11em;text-transform:uppercase;color:#71787A}
.foot-legale a{color:#71787A}
.foot-legale a:hover{color:var(--oro)}

/* ---------------- CTA mobile ---------------- */
.cta-mobile{position:fixed;left:0;right:0;bottom:0;z-index:110;display:none;gap:1px;
  background:var(--line-d);border-top:1px solid var(--line-d)}
.cta-mobile a{flex:1;padding:16px 8px;text-align:center;background:var(--ink-2);
  font:500 .66rem/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase}
.cta-mobile a.primary{background:var(--ember);color:#fff}
@media(max-width:760px){.cta-mobile{display:flex}body{padding-bottom:52px}}

/* ---------------- ingressi ---------------- */
.rv{opacity:0;transform:translateY(20px);
  transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1)}
.rv.in{opacity:1;transform:none}
.rv-1{transition-delay:.08s}.rv-2{transition-delay:.16s}.rv-3{transition-delay:.24s}.rv-4{transition-delay:.32s}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
  .hero .scan,.metodo .visual .ping{display:none}
  .hero-bg video{display:none}
}

@media print{
  .site-head,.cta-mobile,.progress,#embers,.hero .scan,.hero .grid,.allarme{display:none!important}
  body{background:#fff;color:#000;font-size:10.5pt}
  .section{padding:16px 0}
  .scheda,.caso,.faq{break-inside:avoid}
}