/* arrestato.com — foglio di stile unico.
   Principi: leggibilità su telefono scadente, di notte, sotto shock.
   Corpo grande, contrasto alto, aree tappabili ampie, nessun tracciamento. */

:root{
  --bg:#EBEEF3;
  --surface:#FFFFFF;
  --surface-2:#F4F6F9;
  --ink:#151922;
  --ink-2:#414A5C;
  --muted:#6B7688;
  --rule:#D3D9E2;
  --rule-2:#B7C0CE;
  --accent:#2C3A85;
  --accent-soft:#E3E7F7;
  --alert:#8F2028;
  --alert-soft:#FAE7E8;
  --safe:#14624A;
  --safe-soft:#DEF0E8;

  --serif:Charter,"Bitstream Charter","Iowan Old Style",Georgia,"Noto Serif","Liberation Serif",serif;
  --sans:'Inter',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono","Cascadia Mono",Menlo,Consolas,"DejaVu Sans Mono",monospace;

  --measure:36rem;
  --pad:clamp(1.1rem,5vw,2rem);
}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0F131C;
    --surface:#171C27;
    --surface-2:#1F2531;
    --ink:#E7EBF2;
    --ink-2:#B2BBCA;
    --muted:#7F8B9E;
    --rule:#2A313E;
    --rule-2:#3B4453;
    --accent:#97A5F2;
    --accent-soft:#1D2444;
    --alert:#F0999F;
    --alert-soft:#37191E;
    --safe:#6ECCA4;
    --safe-soft:#12291F;
  }
}

:root[data-theme="dark"]{
  --bg:#0F131C;
  --surface:#171C27;
  --surface-2:#1F2531;
  --ink:#E7EBF2;
  --ink-2:#B2BBCA;
  --muted:#7F8B9E;
  --rule:#2A313E;
  --rule-2:#3B4453;
  --accent:#97A5F2;
  --accent-soft:#1D2444;
  --alert:#F0999F;
  --alert-soft:#37191E;
  --safe:#6ECCA4;
  --safe-soft:#12291F;
}

*{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:18px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

@media (min-width:600px){ body{font-size:19px;} }

.skip{
  position:absolute;left:-9999px;
  background:var(--accent);color:#fff;padding:.7rem 1rem;z-index:99;
}
.skip:focus{left:.5rem;top:.5rem;}

/* ---------------- intestazione ---------------- */

.site-header{
  border-bottom:1px solid var(--rule);
  background:var(--surface);
}
.site-header .inner{
  max-width:44rem;margin:0 auto;padding:.85rem var(--pad);
  display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;
}
.wordmark{
  font-family:var(--serif);
  font-size:1.32rem;
  letter-spacing:-.01em;
  color:var(--ink);
  text-decoration:none;
  font-weight:400;
}
.wordmark .tld{color:var(--muted);}
.site-header nav{
  display:flex;gap:1.1rem;font-size:.86rem;flex-wrap:wrap;
}
.site-header nav a{color:var(--ink-2);text-decoration:none;}
.site-header nav a:hover{color:var(--accent);text-decoration:underline;}

/* ---------------- impaginazione ---------------- */

main{max-width:44rem;margin:0 auto;padding:0 var(--pad) 4rem;}
.col{max-width:var(--measure);}

h1{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(2rem,7vw,3rem);
  line-height:1.13;
  letter-spacing:-.02em;
  margin:0 0 1rem;
  text-wrap:balance;
}
h2{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(1.42rem,4.4vw,1.85rem);
  line-height:1.22;
  letter-spacing:-.012em;
  margin:3rem 0 .9rem;
  text-wrap:balance;
}
h3{
  font-size:1.06rem;
  font-weight:600;
  line-height:1.35;
  margin:2rem 0 .5rem;
}
p{margin:0 0 1.05rem;}
main a{color:var(--accent);text-underline-offset:2px;}
a:focus-visible,button:focus-visible,summary:focus-visible{
  outline:3px solid var(--accent);outline-offset:2px;border-radius:2px;
}
strong{font-weight:600;}

.lead{
  font-size:1.15rem;
  color:var(--ink-2);
  line-height:1.55;
}

.page-head{padding:2.4rem 0 0;}

.fase{
  display:inline-block;
  font-family:var(--mono);
  font-size:.7rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--accent);
  border-left:3px solid var(--accent);
  padding:.1rem 0 .1rem .55rem;
  margin-bottom:1.1rem;
}

/* ---------------- liste ---------------- */

ul.plain{list-style:none;padding:0;margin:0 0 1.05rem;}
ul.plain li{padding-left:1.15rem;position:relative;margin-bottom:.6rem;}
ul.plain li::before{
  content:"";position:absolute;left:0;top:.72em;
  width:6px;height:6px;background:var(--rule-2);
}

/* ---------------- passi numerati ---------------- */

ol.steps{list-style:none;counter-reset:s;padding:0;margin:1.6rem 0 0;}
ol.steps > li{
  counter-increment:s;
  position:relative;
  padding:1.15rem 0 1.15rem 3.1rem;
  border-top:1px solid var(--rule);
}
ol.steps > li:last-child{border-bottom:1px solid var(--rule);}
ol.steps > li::before{
  content:counter(s);
  position:absolute;left:0;top:1.15rem;
  width:2.1rem;height:2.1rem;
  display:flex;align-items:center;justify-content:center;
  background:var(--accent);color:var(--surface);
  font-family:var(--mono);font-size:.9rem;font-weight:500;
  font-variant-numeric:tabular-nums;
}
:root[data-theme="dark"] ol.steps > li::before{color:#0F131C;}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) ol.steps > li::before{color:#0F131C;}
}
.step-t{font-weight:600;display:block;margin-bottom:.3rem;}
ol.steps p{margin:0 0 .6rem;color:var(--ink-2);font-size:.97rem;}
ol.steps p:last-child{margin-bottom:0;}

/* ---------------- riquadri ---------------- */

.box{
  padding:1.05rem 1.15rem;
  margin:1.6rem 0;
  background:var(--surface);
  border:1px solid var(--rule);
  border-left:4px solid var(--rule-2);
}
.box > :last-child{margin-bottom:0;}
.box .label{
  display:block;
  font-family:var(--mono);
  font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  margin-bottom:.5rem;color:var(--muted);
}
.box.info{background:var(--accent-soft);border-color:var(--accent);border-left-width:4px;}
.box.info .label{color:var(--accent);}
.box.warn{background:var(--alert-soft);border-color:var(--alert);border-left-width:4px;}
.box.warn .label{color:var(--alert);}
.box.safe{background:var(--safe-soft);border-color:var(--safe);border-left-width:4px;}
.box.safe .label{color:var(--safe);}

/* ---------------- fai / non fare ---------------- */

/* il confronto fai/non fare deve stare affiancato: esce dalla misura di lettura */
.dodont{display:grid;gap:1rem;margin:1.8rem 0;}
.dodont.col{max-width:none;}
@media (min-width:620px){ .dodont{grid-template-columns:1fr 1fr;} }
.dodont section{
  padding:1rem 1.1rem 1.1rem;
  border:1px solid var(--rule);
  background:var(--surface);
}
.dodont h3{margin:0 0 .7rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;}
.dodont .do h3{color:var(--safe);}
.dodont .dont h3{color:var(--alert);}
.dodont ul{list-style:none;padding:0;margin:0;}
.dodont li{position:relative;padding-left:1.5rem;margin-bottom:.65rem;font-size:.97rem;line-height:1.5;}
.dodont li:last-child{margin-bottom:0;}
.dodont .do li::before{content:"✓";position:absolute;left:0;color:var(--safe);font-weight:600;}
.dodont .dont li::before{content:"✕";position:absolute;left:0;color:var(--alert);font-weight:600;}

/* ---------------- contatto d'emergenza ---------------- */

.emergency{
  background:var(--surface);
  border:2px solid var(--accent);
  padding:1.15rem 1.2rem 1.25rem;
  margin:2rem 0;
}
.emergency .label{
  display:block;font-family:var(--mono);font-size:.68rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:.6rem;
}
.emergency .who{font-weight:600;margin-bottom:.15rem;}
.emergency .tel{
  display:inline-block;
  font-family:var(--mono);
  font-size:1.5rem;
  letter-spacing:-.01em;
  color:var(--accent);
  text-decoration:none;
  padding:.35rem 0;
  font-variant-numeric:tabular-nums;
}
.emergency .tel:hover{text-decoration:underline;}
.emergency .note{font-size:.9rem;color:var(--ink-2);margin:.2rem 0 0;}

/* ---------------- triage (home) ---------------- */

.triage{
  display:grid;gap:1px;background:var(--rule);
  border:1px solid var(--rule);margin:1.8rem 0 0;
}
@media (min-width:640px){ .triage{grid-template-columns:1fr 1fr;} }
.triage a{
  background:var(--surface);
  padding:1.2rem 1.1rem 1.35rem;
  text-decoration:none;color:var(--ink);
  display:flex;flex-direction:column;gap:.5rem;
}
.triage a:hover{background:var(--accent-soft);}
.triage .tag{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--accent);
}
.triage .q{font-family:var(--serif);font-size:1.2rem;line-height:1.25;}
.triage .n{font-size:.92rem;color:var(--ink-2);line-height:1.45;}
.triage .soon{color:var(--muted);font-size:.82rem;font-family:var(--mono);}

/* ---------------- indice pilastri ---------------- */

.index{margin:1.6rem 0 0;border-top:1px solid var(--rule);}
.index a{
  display:block;padding:1.05rem 0;border-bottom:1px solid var(--rule);
  text-decoration:none;color:var(--ink);
}
.index a:hover .it{text-decoration:underline;color:var(--accent);}
.index .it{font-weight:600;display:block;margin-bottom:.15rem;}
.index .id{font-size:.95rem;color:var(--ink-2);line-height:1.45;display:block;}

/* ---------------- paesi ---------------- */

.paesi{
  display:grid;gap:1px;background:var(--rule);
  border:1px solid var(--rule);margin:1.4rem 0 0;
  grid-template-columns:repeat(2,1fr);
}
@media (min-width:640px){ .paesi{grid-template-columns:repeat(3,1fr);} }
@media (min-width:900px){ .paesi{grid-template-columns:repeat(5,1fr);} }
.paesi span{
  background:var(--surface);padding:.85rem .9rem;
  font-size:.94rem;color:var(--muted);
  display:flex;flex-direction:column;gap:.15rem;
}
.paesi .p{color:var(--ink-2);font-weight:500;}
.paesi .s{font-family:var(--mono);font-size:.64rem;letter-spacing:.09em;text-transform:uppercase;}

/* ---------------- fonti e verifica ---------------- */

.sources{
  margin-top:3rem;padding-top:1.2rem;border-top:1px solid var(--rule);
  font-size:.92rem;color:var(--ink-2);
}
.sources h2{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);margin:0 0 .7rem;font-weight:500;
}
.sources ul{list-style:none;padding:0;margin:0;}
.sources li{margin-bottom:.45rem;line-height:1.5;}

.verify{
  margin-top:1.4rem;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.07em;
  text-transform:uppercase;color:var(--muted);
}

/* ---------------- collegamenti correlati ---------------- */

.next{margin-top:2.6rem;padding-top:1.3rem;border-top:2px solid var(--ink);}
.next h2{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);margin:0 0 .8rem;font-weight:500;
}
.next ul{list-style:none;padding:0;margin:0;}
.next li{margin-bottom:.55rem;}
.next a{font-weight:500;}

/* ---------------- rimando ai canali ufficiali ---------------- */

.signpost{
  margin-top:2.4rem;
  background:var(--accent-soft);
  border:1px solid var(--accent);
  padding:1.15rem 1.2rem 1.3rem;
}
.signpost .sp-label{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent);margin:0 0 .55rem;
}
.signpost .sp-text{margin:0 0 .9rem;color:var(--ink-2);font-size:.95rem;line-height:1.5;}
.signpost .sp-link{font-weight:600;}

/* recapito in chiaro: se il collegamento muore, il numero resta leggibile */
.plainref{
  font-family:var(--mono);font-size:.82rem;color:var(--muted);
  word-break:break-all;display:block;margin-top:.2rem;
}

/* ---------------- piè di pagina ---------------- */

.site-footer{
  border-top:1px solid var(--rule);
  background:var(--surface);
  margin-top:3rem;
}
.site-footer .inner{
  max-width:44rem;margin:0 auto;padding:1.8rem var(--pad) 2.6rem;
  font-size:.87rem;color:var(--ink-2);
}
.site-footer .disclaimer{
  max-width:var(--measure);margin:0 0 1.2rem;line-height:1.55;
}
.site-footer .meta{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);
  display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;
}

/* ---------------- stampa ---------------- */

@media print{
  :root{
    --bg:#fff;--surface:#fff;--surface-2:#fff;--ink:#000;--ink-2:#222;
    --muted:#555;--rule:#bbb;--rule-2:#999;--accent:#000;--accent-soft:#fff;
    --alert:#000;--alert-soft:#fff;--safe:#000;--safe-soft:#fff;
  }
  body{font-size:11pt;background:#fff;}
  .site-header nav,.next,.triage,.paesi,.index{display:none;}
  .site-header,.site-footer{border-color:#000;}
  main{max-width:none;padding:0;}
  .col{max-width:none;}
  .box,.emergency,.dodont section{break-inside:avoid;border-color:#000;}
  ol.steps > li{break-inside:avoid;}
  ol.steps > li::before{background:#000;color:#fff;}
  a{color:#000;text-decoration:underline;}
  .emergency .tel{font-size:1.2rem;}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;}
}
