/* Layout: registro contabile — colonna di testo stretta a sinistra, colonna numerica a destra; righe orizzontali come in un prospetto di raccordo */
:root{
  --paper:#f5f6f4; --ink:#16232b; --muted:#56656d; --rule:#cfd6d4; --panel:#e9edeb;
  --ledger:#0d5c4f; --ledger-soft:#d6e6e1; --gap-red:#9b3b2e;
  --serif:"IBM Plex Serif", Georgia, "Times New Roman", serif;
  --sans:"IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#11191e; --ink:#e6ebe9; --muted:#9aa9ae; --rule:#2c3a40; --panel:#18232a;
  --ledger:#5fbfa8; --ledger-soft:#1d3a35; --gap-red:#e08a7a; color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#11191e; --ink:#e6ebe9; --muted:#9aa9ae; --rule:#2c3a40; --panel:#18232a;
  --ledger:#5fbfa8; --ledger-soft:#1d3a35; --gap-red:#e08a7a; color-scheme:dark}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0}
body{background:var(--paper);color:var(--ink);font:400 16px/1.6 var(--sans);
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:1040px;margin:0 auto}
a{color:var(--ledger);text-underline-offset:3px}
a:focus-visible,button:focus-visible{outline:2px solid var(--ledger);outline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:600;text-wrap:balance;margin:0}
.label{font:500 12px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}

header.top{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:baseline;justify-content:space-between;padding-block:22px;border-bottom:1px solid var(--rule)}
.brand{font:600 18px/1.2 var(--serif)}
.brand span{display:block;font:400 13px/1.4 var(--sans);color:var(--muted);margin-top:2px}
nav{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px}
nav a{color:var(--ink);text-decoration:none;border-bottom:1px solid transparent}
nav a:hover{border-bottom-color:var(--ledger)}

.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:40px;padding-block:48px 40px;border-bottom:1px solid var(--rule)}
.hero h1{font-size:clamp(30px,4.2vw,46px);line-height:1.12;letter-spacing:-.01em}
.hero p.lead{font-size:18px;color:var(--muted);max-width:34em;margin:18px 0 22px}
.cta{display:flex;flex-wrap:wrap;gap:10px}
.btn{font:500 14px/1 var(--sans);padding:12px 16px;border-radius:2px;text-decoration:none;border:1px solid var(--ledger)}
.btn.primary{background:var(--ledger);color:var(--paper)}
.btn.ghost{color:var(--ledger);background:transparent}

/* prospetto di raccordo */
.ledger{min-width:0}
.ledger .label{margin-bottom:10px}
.row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 64px;gap:12px;align-items:center;padding-block:10px;border-top:1px solid var(--rule)}
.row:last-of-type{border-bottom:1px solid var(--rule)}
.row .what{font-size:14px;line-height:1.35}
.row .what small{display:block;color:var(--muted);font:400 11.5px/1.35 var(--mono)}
.bar{height:12px;background:var(--panel);position:relative}
.bar i{position:absolute;inset:0 auto 0 0;background:var(--ledger)}
.bar i.nato{background:var(--gap-red)}
.val{font:500 15px/1 var(--mono);font-variant-numeric:tabular-nums;text-align:right}
.scale{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 64px;gap:12px;font:400 11px/1 var(--mono);color:var(--muted);padding-top:6px}
.scale div:nth-child(2){display:flex;justify-content:space-between}
.note{font-size:13px;color:var(--muted);margin-top:12px;max-width:44em}
/* animazione del prospetto: le barre si scrivono riga per riga come in un registro */
.bar i{transform-origin:left center;animation:scrivi .9s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--n,0) * .35s + .2s)}
.row .val{animation:compare .4s ease-out both;animation-delay:calc(var(--n,0) * .35s + .7s)}
@keyframes scrivi{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes compare{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
.gap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 64px;gap:12px;align-items:center;padding-top:10px;font:500 12px/1.3 var(--mono);color:var(--gap-red);animation:compare .5s ease-out both;animation-delay:2.4s}
.gap .span{position:relative;height:10px;border-inline:1px solid var(--gap-red);margin-left:var(--da);width:calc(var(--a) - var(--da))}
.gap .span::after{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px dashed var(--gap-red)}
@media (prefers-reduced-motion:reduce){.bar i,.row .val,.gap{animation:none}}

section{padding-block:44px;border-bottom:1px solid var(--rule)}
.sec-head{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;margin-bottom:24px}
.sec-head h2{font-size:26px;line-height:1.2}
.sec-head p{margin:0;color:var(--muted);max-width:40em}

.tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--rule)}
.tool{padding:20px 20px 22px 0;border-bottom:1px solid var(--rule);display:flex;flex-direction:column;gap:8px}
.tool + .tool{padding-left:20px;border-left:1px solid var(--rule)}
.tool h3{font-size:19px;line-height:1.25}
.tool p{margin:0;font-size:15px;color:var(--muted)}
.tool .label{color:var(--ledger)}

.pubs{display:flex;flex-direction:column}
.pub{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:16px;padding-block:16px;border-top:1px solid var(--rule);align-items:baseline}
.pub:last-child{border-bottom:1px solid var(--rule)}
.pub .date{font:400 13px/1.4 var(--mono);color:var(--muted);font-variant-numeric:tabular-nums}
.pub h3{font-size:17px;line-height:1.35}
.pub .meta{font-size:13px;color:var(--muted);margin-top:4px}
.pub .doi{font:400 12px/1.4 var(--mono);white-space:nowrap}

.press{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
.press ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.press li{padding-block:11px;border-top:1px solid var(--rule);font-size:15px}
.press li:last-child{border-bottom:1px solid var(--rule)}
.contact{background:var(--panel);padding:22px;display:flex;flex-direction:column;gap:12px;align-self:start}
.contact .addr{font:500 15px/1.4 var(--mono);word-break:break-all;user-select:all}
.contact button{align-self:flex-start;font:500 13px/1 var(--sans);padding:10px 14px;border:1px solid var(--ledger);background:transparent;color:var(--ledger);border-radius:2px;cursor:pointer}
.contact p{margin:0;font-size:14px;color:var(--muted)}

.about{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px}
.about p{margin:0 0 12px;max-width:40em}
.links{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px;margin-top:8px}

footer{padding-block:28px 40px;font-size:13px;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}

@media (max-width:820px){
  .hero{grid-template-columns:minmax(0,1fr);gap:32px;padding-block:32px}
  .sec-head,.about,.press{grid-template-columns:minmax(0,1fr);gap:12px}
  .tools{grid-template-columns:minmax(0,1fr)}
  .tool,.tool + .tool{padding:18px 0;border-left:0}
  .pub{grid-template-columns:minmax(0,1fr)}
  .pub .doi{white-space:normal}
}
@media (prefers-reduced-motion:no-preference){.bar i{transition:width .6s ease}}

/* pagine interne, lingua, footer */
.lang{font:500 12px/1 var(--mono);letter-spacing:.06em;border:1px solid var(--rule);padding:6px 8px;border-radius:2px;text-decoration:none;color:var(--ink)}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:8px;background:var(--paper);padding:8px;z-index:9}
footer a{color:var(--muted)}
footer .legal{display:flex;flex-wrap:wrap;gap:6px 18px}
.doc{max-width:44em;padding-block:40px 56px}
.doc h1{font-size:clamp(28px,3.6vw,38px);line-height:1.15;margin-bottom:8px}
.doc h2{font-size:21px;margin:30px 0 8px}
.doc p,.doc li{max-width:42em}
.doc .meta{color:var(--muted);font-size:14px}
.doc .abstract{font-size:17px;border-left:3px solid var(--ledger);padding-left:16px;margin:24px 0}
.doc .cite{background:var(--panel);padding:16px;font:400 14px/1.55 var(--sans)}
.doc dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 18px;font-size:14px;margin:18px 0}
.doc dt{color:var(--muted);font:500 12px/1.6 var(--mono);text-transform:uppercase;letter-spacing:.06em}
.doc dd{margin:0;word-break:break-word}
.pub h3 a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule)}
.pub h3 a:hover{border-bottom-color:var(--ledger)}
@media print{.cta,nav,.contact button,.lang{display:none}body{background:#fff;color:#000}}

/* pagina contatti */
.contact-page .lead{font-size:17px;color:var(--muted);margin:10px 0 18px}
.intro-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;margin-bottom:26px}
.intro-pair p{margin:0;padding:14px 16px;background:var(--panel);font-size:14px}
.cform{display:flex;flex-direction:column;gap:18px;max-width:36em}
.field{display:flex;flex-direction:column;gap:6px}
.field[hidden]{display:none}
.field label{font-weight:500;font-size:15px}
.field .req,.field .opt{font:400 11px/1 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-left:6px}
.field small{color:var(--muted);font-size:13px}
.cform input,.cform select,.cform textarea{font:400 16px/1.4 var(--sans);color:var(--ink);background:var(--paper);border:1px solid var(--rule);border-radius:2px;padding:10px 12px;width:100%}
.cform input:focus-visible,.cform select:focus-visible,.cform textarea:focus-visible{outline:2px solid var(--ledger);outline-offset:1px;border-color:var(--ledger)}
.cform textarea{resize:vertical;min-height:9em}
.cform button{align-self:flex-start;cursor:pointer}
.privacy-note{font-size:13px;color:var(--muted);margin:0}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-error{border-left:3px solid var(--gap-red);padding:10px 14px;background:var(--panel);margin-bottom:20px}
.form-error p{margin:6px 0 0}
@media (max-width:820px){.intro-pair{grid-template-columns:minmax(0,1fr)}}
footer .status{flex-basis:100%}

/* pagine di approfondimento */
.hub .lead{font-size:18px;color:var(--muted);margin:12px 0 8px}
.hub-list{display:grid;grid-template-columns:minmax(0,14em) minmax(0,1fr);gap:10px 24px;margin:12px 0}
.hub-list dt{font-weight:600;font-family:var(--serif)}
.hub-list dd{margin:0;color:var(--ink)}
.hub-pubs{padding-left:18px}
.hub-pubs li{margin:6px 0}
.hub .cta{margin:26px 0 10px}
.hub .cross{color:var(--muted);font-size:15px}
.hub-links{display:flex;gap:18px;flex-wrap:wrap}
@media (max-width:820px){.hub-list{grid-template-columns:minmax(0,1fr)}.hub-list dd{margin-bottom:8px}}
