/* Giorgio Simoncini — foglio di stile unico. Palette: carta da lucido, grafite, blu cianografia. Font di sistema. */
:root{
  --paper:#ECEEED;--paper-2:#E0E4E3;--chalk:#F6F8F7;--rule:#C3CAC9;
  --ink:#1B2226;--ink-2:#46515A;
  --night:#1F2428;--night-2:#2A3035;--night-rule:#434B51;
  --snow:#F5F7F6;--snow-2:#BAC3C8;
  --blue:#1B4F94;--blue-hi:#A5C8F3;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Charter,"Bitstream Charter","Sitka Text",Cambria,Georgia,serif;
  --sans:"Avenir Next","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --pad:clamp(1.25rem,4.5vw,3.25rem);--hh:3.75rem;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--hh) + 1rem)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:clamp(1.125rem,1.06rem + .3vw,1.3125rem);line-height:1.62;-webkit-font-smoothing:antialiased}
body.dark{background:var(--night);color:var(--snow)}
img{max-width:100%;height:auto}
a{color:var(--blue);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
.dark a,.on-dark a{color:var(--blue-hi)}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:2px}
.dark :focus-visible,.site-header :focus-visible,.site-footer :focus-visible,.hero :focus-visible,.cc :focus-visible,.lb :focus-visible,.menu-panel :focus-visible{outline-color:var(--blue-hi)}
.skip{position:absolute;left:-999px;top:0;background:var(--snow);color:var(--ink);padding:.7rem 1rem;z-index:200;font-family:var(--sans)}
.skip:focus{left:.5rem;top:.5rem}
[id]{scroll-margin-top:calc(var(--hh) + 1rem)}

/* Intestazione */
.site-header{position:sticky;top:0;z-index:60;background:var(--night);color:var(--snow);display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:var(--hh);padding:.5rem var(--pad)}
.brand{display:flex;align-items:center;gap:.75rem;color:var(--snow)!important;text-decoration:none}
.brand:hover{text-decoration:none}
.brand svg{width:38px;height:38px;flex:none}
.brand span{font-size:clamp(1.2rem,1rem + 1vw,1.55rem);letter-spacing:.01em;line-height:1}
.menu-btn{display:inline-flex;align-items:center;gap:.7rem;min-height:46px;padding:.5rem 1rem;font:600 1rem/1 var(--sans);color:var(--snow)!important;background:transparent;border:1.5px solid var(--snow-2);border-radius:3px;cursor:pointer;text-decoration:none}
.menu-btn:hover{background:var(--night-2);text-decoration:none}
.menu-btn i{display:block;width:20px;height:2px;background:currentColor;position:relative}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0;width:20px;height:2px;background:currentColor}
.menu-btn i::before{top:-6px}.menu-btn i::after{top:6px}
.menu-panel{position:fixed;left:0;right:0;top:var(--hh);bottom:0;z-index:55;background:var(--night);color:var(--snow);overflow:auto;padding:1.5rem var(--pad) 4rem;border-top:1px solid var(--night-rule)}
.menu-panel[hidden]{display:none}
.menu-inner{max-width:76rem;margin:0 auto;columns:1;column-gap:3rem}
@media (min-width:760px){.menu-inner{columns:2}}
@media (min-width:1120px){.menu-inner{columns:3}}
.mgroup{break-inside:avoid;margin:0 0 1.75rem}
.mgroup h2{font:700 1.05rem/1.3 var(--sans);margin:0 0 .5rem;color:var(--snow);padding-top:.7rem;border-top:2px solid var(--blue-hi)}
.mgroup ul{list-style:none;margin:0;padding:0}
.mgroup li{margin:.1rem 0;font-size:1.05rem;line-height:1.4}
.mgroup a{display:block;padding:.35rem 0;color:var(--snow-2)}
.mgroup a:hover{color:var(--snow)}
.mgroup .soon{display:block;padding:.35rem 0;color:#8D979D}

/* Testata interna */
.page-head{padding:clamp(1.5rem,4vw,2.75rem) var(--pad) clamp(1.25rem,3vw,2rem);border-bottom:1px solid var(--rule)}
.dark .page-head{border-color:var(--night-rule)}
.page-head .inner{max-width:76rem;margin:0 auto}
.crumb{font:.95rem/1.4 var(--sans);color:var(--ink-2);margin:0 0 .9rem}
.dark .crumb{color:var(--snow-2)}
.crumb a{color:inherit}
h1{font-weight:500;font-size:clamp(2rem,1.3rem + 3.2vw,3.6rem);line-height:1.08;letter-spacing:-.012em;margin:0;text-wrap:balance}
.sub{font-size:clamp(1.15rem,1.05rem + .5vw,1.5rem);line-height:1.45;color:var(--ink-2);margin:.8rem 0 0;max-width:46rem}
.dark .sub{color:var(--snow-2)}

/* Testo */
.prose{max-width:46rem;margin:0 auto;padding:clamp(1.5rem,4vw,3rem) var(--pad) 5rem}
.prose p{margin:0 0 1.15em}
@media (max-width:600px){.prose p{hyphens:auto;-webkit-hyphens:auto}}
.prose h2{font-weight:600;font-size:clamp(1.35rem,1.15rem + .9vw,1.85rem);line-height:1.2;margin:2.4em 0 .7em;padding-top:.7em;border-top:2px solid var(--ink);text-wrap:balance}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:1.2rem;margin:1.8em 0 .5em}
.prose figure{margin:1.8rem 0}
.prose figcaption{font:.95rem/1.45 var(--sans);color:var(--ink-2);margin-top:.5rem}
.prose .ln{display:block;margin:.5em 0}
.prose p.inv{margin-bottom:1.6em}
.prose ul{padding-left:1.3rem}
.prose li{margin:.4em 0}
.toc{font-family:var(--sans);font-size:1rem;line-height:1.5;list-style:none;margin:0 0 2rem;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.prose .toc{padding:0}
.toc a{display:inline-block;padding:.45rem .8rem;border:1px solid var(--rule);border-radius:3px;text-decoration:none;background:var(--chalk)}
.toc a:hover{border-color:var(--blue)}
.pub{display:grid;grid-template-columns:4.4rem 1fr;column-gap:1rem;margin:0 0 1.15em}
.pub .yr{font-variant-numeric:tabular-nums;font-weight:600;color:var(--blue)}
.pub>div{min-width:0}
@media (max-width:480px){.pub{grid-template-columns:3.7rem 1fr;column-gap:.7rem}}
.doc{display:grid;grid-template-columns:minmax(0,15rem) 1fr;gap:1.5rem 2rem;align-items:start;margin:0 0 2.5rem;padding-top:1.5rem;border-top:1px solid var(--rule)}
.doc img{display:block;width:100%;border:1px solid var(--rule)}
.doc p{margin:0}
@media (max-width:640px){.doc{grid-template-columns:1fr}.doc img{max-width:15rem}}
.note-box{background:var(--paper-2);border-left:4px solid var(--blue);padding:1.2rem 1.4rem;margin-top:2.5rem}
.note-box p:last-child{margin-bottom:0}
.fullimg{display:block;margin:0 auto;max-width:100%;border:1px solid var(--rule)}

/* Biografia: linea del tempo */
.timeline{list-style:none;margin:0 auto;padding:0;max-width:62rem}
.timeline>li{display:grid;grid-template-columns:10rem 1fr;gap:0 2rem;padding:0 0 2.4rem}
.when{font-size:clamp(1.3rem,1.1rem + .8vw,1.65rem);line-height:1.25;color:var(--blue);font-weight:600;font-variant-numeric:tabular-nums}
.what{position:relative;border-left:2px solid var(--blue);padding-left:2rem}
.what::before{content:"";position:absolute;left:-8px;top:.5rem;width:14px;height:14px;border-radius:50%;background:var(--paper);border:3px solid var(--blue)}
.what p{margin:0 0 .9em;max-width:42rem}
.timeline>li:last-child .what{border-left-color:transparent}
@media (max-width:720px){.timeline>li{grid-template-columns:1fr;gap:.5rem 0}.when{padding-left:1.4rem}.what{margin-left:.45rem;padding-left:1.25rem}}

/* Pulsanti e PDF */
.actions{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.6rem 0}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:.6rem 1.25rem;font:600 1.05rem/1.2 var(--sans);text-decoration:none;border:2px solid var(--ink);color:var(--ink);background:transparent;border-radius:3px}
.btn:hover{background:var(--ink);color:var(--paper);text-decoration:none}
.btn.primary{background:var(--ink);color:var(--paper)}
.btn.primary:hover{background:var(--blue);border-color:var(--blue)}
.on-dark .btn,.dark .btn{border-color:var(--snow);color:var(--snow)}
.on-dark .btn:hover,.dark .btn:hover{background:var(--snow);color:var(--night)}
.on-dark .btn.primary{background:var(--snow);color:var(--night)}
.on-dark .btn.primary:hover{background:var(--blue-hi);border-color:var(--blue-hi);color:var(--night)}
.pdf-frame{display:none;width:100%;height:min(82vh,60rem);border:1px solid var(--rule);background:#fff}
@media (min-width:900px) and (hover:hover){.pdf-frame{display:block}}
.help{font:.95rem/1.5 var(--sans);color:var(--ink-2)}

/* Mosaico */
.gallery{max-width:84rem;margin:0 auto;padding:clamp(1.25rem,3vw,2.25rem) var(--pad) 5rem}
.gallery section{margin:0 0 2.6rem}
.gallery h2{font:600 clamp(1.25rem,1.1rem + .8vw,1.7rem)/1.25 var(--serif);margin:0 0 .35rem;color:var(--snow)}
.gallery .cap-row{font:1rem/1.45 var(--sans);color:var(--snow-2);margin:0 0 .8rem}
.mosaic{--row:150px;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
@media (min-width:600px){.mosaic{--row:190px}}
@media (min-width:1000px){.mosaic{--row:250px}}
.mosaic li{position:relative;flex-grow:calc(var(--ar) * 100);width:calc(var(--ar) * var(--row));min-width:0}
.mosaic::after{content:"";flex-grow:100000}
.mosaic a{display:block;position:relative;overflow:hidden;background:var(--night-2)}
.mosaic a::before{content:"";display:block;padding-bottom:calc(100% / var(--ar))}
.mosaic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.mosaic a:hover img{transform:scale(1.03)}
.mosaic a:focus-visible{outline-offset:-3px}
@media (prefers-reduced-motion:reduce){.mosaic img{transition:none}.mosaic a:hover img{transform:none}}
.mosaic .cap{display:block;font:1rem/1.35 var(--sans);padding:.55rem .1rem 0;color:var(--ink)}
.mosaic .cap a{background:none;color:var(--ink)}
.mosaic.captioned{row-gap:1.4rem}
.mosaic.captioned::after{content:none}

/* Lightbox */
.lb{position:fixed;inset:0;z-index:170;background:rgba(12,14,16,.95);display:flex;align-items:center;justify-content:center;touch-action:pan-y}
.lb[hidden]{display:none}
.lb figure{margin:0;display:flex;flex-direction:column;align-items:center;max-width:100vw}
.lb img{display:block;max-width:min(96vw,1700px);max-height:calc(100vh - 7.5rem);max-height:calc(100dvh - 7.5rem);object-fit:contain;background:#111}
.lb figcaption{font:1rem/1.4 var(--sans);color:var(--snow-2);padding:.8rem 1rem 0;text-align:center}
.lb button{position:absolute;display:grid;place-items:center;width:52px;height:52px;border:0;border-radius:50%;background:rgba(245,247,246,.14);color:var(--snow);font:400 1.9rem/1 var(--sans);cursor:pointer}
.lb button:hover{background:rgba(245,247,246,.3)}
.lb .x{top:.75rem;right:.75rem}
.lb .prev{left:.5rem;top:50%;transform:translateY(-50%)}
.lb .next{right:.5rem;top:50%;transform:translateY(-50%)}
@media (max-width:640px){.lb .prev,.lb .next{top:auto;bottom:.6rem;transform:none}.lb .prev{left:1rem}.lb .next{right:1rem}.lb figcaption{padding-bottom:4rem}.lb img{max-height:calc(100dvh - 11rem)}}
body.lb-open{overflow:hidden}

/* Home */
.hero{background:var(--night);color:var(--snow);position:relative;overflow:hidden}
.hero-inner{max-width:76rem;margin:0 auto;padding:clamp(2rem,5vw,4.5rem) var(--pad) clamp(2.5rem,6vw,5rem);display:grid;grid-template-columns:1fr;gap:2rem 3.5rem;align-items:start}
@media (min-width:820px){.hero-inner{grid-template-columns:auto 1fr}}
.portrait{margin:0 0 0 9px;width:min(236px,60vw)}
.portrait img{display:block;width:100%;height:auto;outline:1px solid var(--blue-hi);outline-offset:9px}
.hero h1{font-size:clamp(2.6rem,1.4rem + 5.5vw,5.2rem);font-weight:400;line-height:1.02;letter-spacing:-.02em;margin:0 0 .6rem}
.hero .role{font:600 clamp(1.05rem,1rem + .4vw,1.25rem)/1.4 var(--sans);color:var(--blue-hi);margin:0 0 1.6rem}
.hero .lead{font-size:clamp(1.15rem,1.05rem + .55vw,1.45rem);line-height:1.58;max-width:38rem;margin:0 0 1.2rem}
.hero .actions{margin-top:2rem}
.pelican{position:absolute;right:var(--pad);bottom:0;width:120px;height:auto;opacity:.85;pointer-events:none}
@media (max-width:1100px){.pelican{display:none}}
.band{padding:clamp(2.25rem,5vw,4rem) var(--pad)}
.band .inner{max-width:76rem;margin:0 auto}
.band h2{font-weight:500;font-size:clamp(1.6rem,1.2rem + 1.8vw,2.5rem);line-height:1.15;margin:0 0 .5rem;text-wrap:balance}
.band .intro{font-size:1.1rem;color:var(--ink-2);margin:0 0 1.6rem;max-width:42rem}
.band.alt{background:var(--paper-2)}
.index{columns:1;column-gap:3.5rem}
@media (min-width:820px){.index{columns:2}}
.group{break-inside:avoid;margin:0 0 2.2rem;padding-top:.8rem;border-top:2px solid var(--ink)}
.group h3{font-weight:600;font-size:clamp(1.25rem,1.1rem + .7vw,1.55rem);line-height:1.25;margin:0 0 .6rem}
.group .meta{font:.98rem/1.45 var(--sans);color:var(--ink-2);margin:0 0 .6rem}
.group ul{list-style:none;margin:0;padding:0}
.group li{padding:.5rem 0;border-bottom:1px solid var(--rule);line-height:1.45}
.group li:last-child{border-bottom:0}
.group a{font-size:1.08rem}
.group .soon{color:var(--ink-2)}
.tag{font:600 .85rem/1 var(--sans);color:var(--ink-2);border:1px solid var(--rule);border-radius:999px;padding:.2rem .6rem;margin-left:.4rem;white-space:nowrap;background:var(--paper)}

/* Piè di pagina */
.site-footer{background:var(--night);color:var(--snow-2);padding:2.75rem var(--pad) 3rem;font:.95rem/1.65 var(--sans)}
.site-footer .inner{max-width:76rem;margin:0 auto;display:grid;gap:1.4rem}
.site-footer p{margin:0 0 .6rem;max-width:58rem}
.site-footer a{color:var(--snow)}
.site-footer .flinks{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;font-weight:600}
.site-footer button.linklike{font:inherit;font-weight:600;color:var(--snow);background:none;border:0;padding:0;text-decoration:underline;cursor:pointer;text-underline-offset:.2em}

/* Banner cookie */
.cc{position:fixed;left:0;right:0;bottom:0;z-index:150;background:var(--night);color:var(--snow);border-top:3px solid var(--blue-hi);padding:1.25rem var(--pad) 1.4rem;box-shadow:0 -10px 40px rgba(0,0,0,.35);font:1rem/1.55 var(--sans);max-height:92vh;overflow:auto}
.cc[hidden]{display:none}
.cc-in{max-width:76rem;margin:0 auto;display:grid;gap:1rem 2rem;grid-template-columns:1fr}
@media (min-width:980px){.cc{padding-right:calc(var(--pad) + 3rem)}.cc-in{grid-template-columns:1fr auto;align-items:center}.cc-actions{flex-wrap:nowrap}.cc-btn{flex:0 0 auto;min-width:9.5rem}}
.cc h2{font:700 1.15rem/1.3 var(--sans);margin:0 2.5rem .4rem 0}
.cc p{margin:0 0 .4rem;max-width:56rem}
.cc a{color:var(--blue-hi)}
.cc-actions{display:flex;flex-wrap:wrap;gap:.7rem}
.cc-btn{flex:1 1 9.5rem;min-height:48px;padding:.6rem 1.1rem;font:700 1rem/1.2 var(--sans);color:var(--snow);background:transparent;border:2px solid var(--snow);border-radius:3px;cursor:pointer}
.cc-btn:hover{background:var(--snow);color:var(--night)}
.cc-x{position:absolute;top:.5rem;right:.6rem;width:44px;height:44px;border:0;background:transparent;color:var(--snow);font:400 2rem/1 var(--sans);cursor:pointer;border-radius:50%}
.cc-x:hover{background:var(--night-2)}
.cc-modal{position:fixed;inset:0;z-index:160;background:rgba(10,12,14,.72);display:grid;place-items:center;padding:1rem}
.cc-modal[hidden]{display:none}
.cc-card{background:var(--paper);color:var(--ink);width:min(40rem,100%);max-height:92vh;overflow:auto;padding:1.6rem 1.6rem 1.4rem;border-radius:4px;font:1rem/1.55 var(--sans)}
.cc-card h2{font:700 1.4rem/1.25 var(--serif);margin:0 0 .6rem}
.cc-card a{color:var(--blue)}
.cc-opt{display:grid;grid-template-columns:1fr auto;gap:.3rem 1rem;padding:1rem 0;border-top:1px solid var(--rule);align-items:start}
.cc-opt h3{font:700 1.05rem/1.3 var(--sans);margin:0}
.cc-opt p{grid-column:1;margin:0;color:var(--ink-2);font-size:.97rem}
.cc-opt label{grid-column:2;grid-row:1;display:inline-flex;align-items:center;gap:.6rem;font-weight:600;min-height:44px}
.cc-opt input{width:24px;height:24px;accent-color:var(--blue)}
.cc-card .cc-actions{margin-top:1rem}
.cc-card .cc-btn{color:var(--ink);border-color:var(--ink)}
.cc-card .cc-btn:hover{background:var(--ink);color:var(--paper)}
.cc-card :focus-visible{outline-color:var(--blue)}

/* Tabelle cookie policy */
.tablewrap{overflow-x:auto;margin:1rem 0 1.6rem;border:1px solid var(--rule)}
table.cookies{border-collapse:collapse;width:100%;min-width:34rem;font:.97rem/1.5 var(--sans)}
table.cookies th,table.cookies td{text-align:left;vertical-align:top;padding:.7rem .9rem;border-bottom:1px solid var(--rule)}
table.cookies th{background:var(--paper-2);font-weight:700}
table.cookies tr:last-child td{border-bottom:0}

@media print{.site-header,.menu-panel,.cc,.cc-modal,.lb,.site-footer .flinks,.actions,.pdf-frame{display:none!important}body,body.dark{background:#fff;color:#000}.page-head{border:0}}

.toc li{margin:0}
