/* Font ospitati sul sito (nessuna richiesta a server esterni) */
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/atkinson-hyperlegible-next-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/atkinson-hyperlegible-next-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/atkinson-hyperlegible-next-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible Next";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/atkinson-hyperlegible-next-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/atkinson-hyperlegible-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible Mono";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/atkinson-hyperlegible-mono-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/bricolage-grotesque-latin-wght-normal.woff2) format("woff2")}

/* Layout: colonna editoriale con un hero "report" a destra; motivo braille come segno del marchio; fasce piene per sezioni chiave */
:root{
  --paper:#F6F7F3;
  --surface:#FFFFFF;
  --ink:#0D1B2A;
  --ink-soft:#43505E;
  --line:#D6DAD3;
  --signal:#FFC72C;
  --signal-ink:#0D1B2A;
  --link:#1E4FD8;
  --pass:#0E7A3E;
  --fail:#B3261E;
  --warn:#8A5A00;
  --band:#0D1B2A;
  --band-ink:#F6F7F3;
  --band-soft:#B9C3CE;
  --font-display:"Bricolage Grotesque", "Arial Black", system-ui, sans-serif;
  --font-body:"Atkinson Hyperlegible Next", "Atkinson Hyperlegible", Verdana, system-ui, sans-serif;
  --font-mono:"Atkinson Hyperlegible Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --step--1:0.875rem;
  --step-0:1.0625rem;
  --step-1:1.3rem;
  --step-2:1.7rem;
  --step-3:clamp(2rem, 4.2vw, 2.9rem);
  --step-4:clamp(2.5rem, 6.4vw, 4.6rem);
  --radius:6px;
  --wrap:72rem;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0B1520; --surface:#122030; --ink:#EEF1EA; --ink-soft:#AEB9C4; --line:#2A3A4B;
    --signal:#FFD24D; --signal-ink:#0B1520; --link:#8EB1FF; --pass:#5FD08E; --fail:#FF8A80; --warn:#F2C14E;
    --band:#FFD24D; --band-ink:#0B1520; --band-soft:#3A3320;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --paper:#0B1520; --surface:#122030; --ink:#EEF1EA; --ink-soft:#AEB9C4; --line:#2A3A4B;
  --signal:#FFD24D; --signal-ink:#0B1520; --link:#8EB1FF; --pass:#5FD08E; --fail:#FF8A80; --warn:#F2C14E;
  --band:#FFD24D; --band-ink:#0B1520; --band-soft:#3A3320;
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--font-body); font-size:var(--step-0); line-height:1.6;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
img,svg{max-width:100%}
a{color:var(--link); text-underline-offset:0.18em; text-decoration-thickness:0.08em}
a:hover{text-decoration-thickness:0.16em}
:focus-visible{outline:3px solid var(--link); outline-offset:3px; border-radius:2px}
h1,h2,h3{font-family:var(--font-display); line-height:1.08; text-wrap:balance; margin:0; letter-spacing:-0.015em}
h1{font-size:var(--step-4); font-weight:800}
h2{font-size:var(--step-3); font-weight:800}
h3{font-size:var(--step-1); font-weight:600}
p{margin:0}
.wrap{
  max-width:var(--wrap); margin-inline:auto;
  padding-left:max(20px, env(safe-area-inset-left,0px));
  padding-right:max(20px, env(safe-area-inset-right,0px));
}
.eyebrow{
  font-family:var(--font-mono); font-size:var(--step--1); letter-spacing:0.08em;
  text-transform:uppercase; color:var(--ink-soft);
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Skip link */
.skip{
  position:absolute; left:16px; top:-100px; z-index:50;
  background:var(--signal); color:var(--signal-ink); padding:0.7rem 1rem; font-weight:700; border-radius:var(--radius);
}
.skip:focus{top:calc(12px + env(safe-area-inset-top,0px))}

/* Header */
.site-header{border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding-block:1rem}
.brand{display:flex; align-items:center; gap:0.6rem; color:var(--ink); text-decoration:none; font-family:var(--font-display); font-weight:800; font-size:1.25rem}
.brand-mark{
  display:grid; grid-template-columns:repeat(2,7px); gap:4px; padding:7px; background:var(--signal); border-radius:4px;
}
.brand-mark i{width:7px;height:7px;border-radius:50%;background:var(--signal-ink);display:block}
.brand-mark i.off{background:transparent; box-shadow:inset 0 0 0 1.5px var(--signal-ink); opacity:.35}
.site-nav ul{display:flex; gap:1.4rem; list-style:none; margin:0; padding:0; flex-wrap:wrap}
.site-nav a{color:var(--ink); text-decoration:none; font-weight:600}
.site-nav a:hover{text-decoration:underline}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:0.5rem;
  min-height:48px; padding:0.75rem 1.3rem; border-radius:var(--radius);
  font:700 var(--step-0)/1.2 var(--font-body); text-decoration:none; cursor:pointer; border:2px solid transparent;
}
.btn-primary{background:var(--signal); color:var(--signal-ink); border-color:var(--signal)}
.btn-primary:hover{box-shadow:0 0 0 3px var(--ink) inset}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--ink)}
.btn-ghost:hover{background:var(--ink); color:var(--paper)}

/* Hero */
.hero .wrap{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr); gap:3.5rem; align-items:center; padding-block:4.5rem 4rem}
.hero-copy{display:grid; gap:1.4rem; min-width:0}
.braille{
  font-family:var(--font-mono); font-size:1.6rem; letter-spacing:0.35em; color:var(--ink); line-height:1;
}
.hero h1 mark{background:linear-gradient(transparent 58%, var(--signal) 58% 92%, transparent 92%); color:inherit; padding:0 0.05em}
.lede{font-size:var(--step-1); line-height:1.5; color:var(--ink-soft); max-width:36rem}
.scan-form{display:grid; gap:0.5rem; max-width:36rem}
.scan-form label{font-weight:700}
.scan-row{display:flex; gap:0.6rem; flex-wrap:wrap}
.scan-row input{
  flex:1 1 15rem; min-width:0; min-height:52px; padding:0.7rem 0.9rem;
  font:400 var(--step-0) var(--font-body); color:var(--ink); background:var(--surface);
  border:2px solid var(--ink); border-radius:var(--radius);
}
.scan-row .btn{min-height:52px}
.hint{font-size:var(--step--1); color:var(--ink-soft)}

/* Report card */
.report{
  background:var(--surface); border:1px solid var(--line); border-radius:10px;
  box-shadow:0 1px 0 var(--line), 0 18px 40px -24px rgba(13,27,42,.35);
  padding:1.4rem; display:grid; gap:1.1rem; min-width:0;
}
.report-head{display:flex; align-items:center; gap:1rem}
.score{position:relative; width:88px; height:88px; flex:none}
.score svg{width:88px;height:88px;transform:rotate(-90deg)}
.score .track{fill:none; stroke:var(--line); stroke-width:9}
.score .val{fill:none; stroke:var(--warn); stroke-width:9; stroke-linecap:round}
.score b{position:absolute; inset:0; display:grid; place-items:center; font:800 1.6rem var(--font-display); color:var(--ink)}
.report-meta{display:grid; gap:0.15rem; min-width:0}
.report-meta .url{font-family:var(--font-mono); font-size:var(--step--1); color:var(--ink-soft); overflow-wrap:anywhere}
.report-meta strong{font-size:1.05rem}
.issues{list-style:none; margin:0; padding:0; display:grid; gap:0}
.issues li{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:0.8rem; align-items:baseline; padding:0.7rem 0; border-top:1px solid var(--line)}
.issues code{font-family:var(--font-mono); font-size:var(--step--1); color:var(--ink-soft); font-variant-numeric:tabular-nums}
.issues span{font-size:0.98rem}
.pill{font-family:var(--font-mono); font-size:0.78rem; font-weight:600; padding:0.15rem 0.5rem; border-radius:999px; border:1.5px solid currentColor; white-space:nowrap}
.pill.fail{color:var(--fail)} .pill.warn{color:var(--warn)} .pill.pass{color:var(--pass)}
.report-foot{font-size:var(--step--1); color:var(--ink-soft)}

/* Band: EAA */
.band{background:var(--band); color:var(--band-ink)}
.band .wrap{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); gap:3rem; padding-block:4rem; align-items:start}
.band .eyebrow{color:var(--band-ink); opacity:.8}
.band-copy{display:grid; gap:1rem; max-width:40rem}
.band-copy p{line-height:1.65}
.band-copy a{color:var(--band-ink)}
.date{font-family:var(--font-display); font-weight:800; font-size:clamp(3rem,8vw,5.5rem); line-height:0.95; letter-spacing:-0.03em}
.date small{display:block; font-family:var(--font-mono); font-size:var(--step--1); font-weight:400; letter-spacing:0.06em; text-transform:uppercase; margin-top:0.8rem}

/* Sections */
section{scroll-margin-top:1rem}
.section{padding-block:5rem}
.section-head{display:grid; gap:0.8rem; max-width:44rem; margin-bottom:2.8rem}
.section-head p{color:var(--ink-soft); font-size:var(--step-1); line-height:1.5}

/* Features */
.features{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-top:2px solid var(--ink)}
.feature{display:grid; gap:0.7rem; align-content:start; padding:1.8rem 1.6rem 2rem 0; border-bottom:1px solid var(--line); min-width:0}
.feature:not(:nth-child(3n+1)){padding-left:1.6rem; border-left:1px solid var(--line)}
.feature .crit{font-family:var(--font-mono); font-size:var(--step--1); color:var(--ink-soft)}
.feature p{color:var(--ink-soft)}

/* Steps */
.steps{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; counter-reset:s}
.steps li{display:grid; gap:0.7rem; align-content:start; counter-increment:s; min-width:0}
.steps li::before{
  content:counter(s); font-family:var(--font-display); font-weight:800; font-size:1.3rem;
  width:2.6rem; height:2.6rem; display:grid; place-items:center; border-radius:50%;
  background:var(--signal); color:var(--signal-ink);
}
.steps p{color:var(--ink-soft)}

/* Offer */
.offer{background:var(--surface); border-block:1px solid var(--line)}
.offer .wrap{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3rem; padding-block:4.5rem; align-items:center}
.offer-copy{display:grid; gap:1.1rem}
.offer-copy p{color:var(--ink-soft); font-size:var(--step-1); line-height:1.5}
.checklist{list-style:none; margin:0; padding:0; display:grid; gap:0.9rem}
.checklist li{display:grid; grid-template-columns:1.6rem minmax(0,1fr); gap:0.7rem; align-items:start}
.checklist svg{width:1.6rem; height:1.6rem; color:var(--pass); margin-top:0.1rem}
.cta-row{display:flex; gap:0.8rem; flex-wrap:wrap; margin-top:0.4rem}

/* FAQ */
.faq{display:grid; gap:0; border-top:2px solid var(--ink); max-width:52rem}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer; list-style:none; padding:1.2rem 2.5rem 1.2rem 0; position:relative;
  font-weight:700; font-size:var(--step-1); line-height:1.35;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+"; position:absolute; right:0.2rem; top:1.05rem; font-family:var(--font-mono); font-size:1.5rem; color:var(--ink-soft);
}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 0 1.4rem; color:var(--ink-soft); max-width:44rem}

/* Footer */
.site-footer{border-top:1px solid var(--line)}
.site-footer .wrap{display:flex; gap:1.5rem 3rem; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; padding-block:2.5rem}
.footer-col{display:grid; gap:0.4rem; font-size:0.98rem}
.footer-col .eyebrow{margin-bottom:0.2rem}
.copy-mail{display:flex; align-items:center; gap:0.6rem; flex-wrap:wrap}
.copy-btn{
  font:600 var(--step--1) var(--font-body); padding:0.3rem 0.7rem; min-height:36px;
  border:1.5px solid var(--ink); background:transparent; color:var(--ink); border-radius:var(--radius); cursor:pointer;
}
.legal{font-size:var(--step--1); color:var(--ink-soft)}

/* Responsive */
@media (max-width: 900px){
  .hero .wrap, .band .wrap, .offer .wrap{grid-template-columns:minmax(0,1fr); gap:2.5rem}
  .features{grid-template-columns:repeat(2,minmax(0,1fr))}
  .feature:not(:nth-child(3n+1)){padding-left:0; border-left:0}
  .feature:nth-child(2n){padding-left:1.6rem; border-left:1px solid var(--line)}
  .steps{grid-template-columns:minmax(0,1fr)}
}
@media (max-width: 600px){
  .hero .wrap{padding-block:3rem}
  .section{padding-block:3.5rem}
  .features{grid-template-columns:minmax(0,1fr)}
  .feature:nth-child(2n){padding-left:0; border-left:0}
  .feature{padding-right:0}
  .site-nav ul{gap:1rem}
}

/* Pagine legali */
.doc .wrap{padding-block:3.5rem 4.5rem}
.doc-body{max-width:46rem; display:grid; gap:1.1rem}
.doc-body h1{font-size:var(--step-3)}
.doc-body h2{font-size:var(--step-2); margin-top:1.4rem}
.doc-body p, .doc-body li{color:var(--ink)}
.doc-body ul{margin:0; padding-left:1.3rem; display:grid; gap:0.4rem}
.doc-meta{font-family:var(--font-mono); font-size:var(--step--1); color:var(--ink-soft)}
.todo{background:var(--signal); color:var(--signal-ink); padding:0 0.25em; border-radius:3px}
.note{border-left:4px solid var(--signal); padding:0.8rem 1rem; background:var(--surface)}
.status-tag{display:inline-block; font-family:var(--font-mono); font-weight:600; font-size:var(--step--1); padding:0.2rem 0.6rem; border:1.5px solid var(--warn); color:var(--warn); border-radius:999px}

/* Marchio */
.brand-mark{flex:none;display:block;width:32px;height:32px;padding:0;background:none;border-radius:22%}