[hidden]{display:none!important}
/* Bodyscore — prototipo "the score is the body"
   Layout: un solo mondo scuro, come il drappo nero dello studio; la foto è l'unico oggetto luminoso.
   I pentagrammi (cinque linee sottili) sono il solo ornamento e segnano le divisioni. */
:root{
  --drape:#050505;      /* fondo: drappo nero, uguale al nero delle fotografie */
  --drape-2:#0f0e0d;    /* superfici appena sollevate */
  --skin:#ebe5dc;       /* testo principale: tono pelle/carta */
  --graphite:#8c857b;   /* testo secondario: grafite */
  --staff:#2c2926;      /* linee del pentagramma */
  --ink:#ffffff;        /* stato attivo */
  --f-display:"Cormorant Garamond","Cormorant",Garamond,"Times New Roman",serif;
  --f-body:"Manrope","Helvetica Neue",Arial,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --gut:max(16px,env(safe-area-inset-left,0px));
  --gut-r:max(16px,env(safe-area-inset-right,0px));
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{background:var(--drape);color:var(--skin)}
body{margin:0;font:400 15px/1.6 var(--f-body);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
:focus-visible{outline:1px solid var(--skin);outline-offset:4px}
img{max-width:100%}

/* testata */
.top{transition:background-color .4s,border-color .4s;border-bottom:1px solid transparent;padding-bottom:22px}
.top.solid{background:var(--drape);border-bottom-color:var(--staff)}
.top{position:fixed;inset:0 0 auto;z-index:20;display:flex;justify-content:space-between;align-items:flex-start;gap:24px;
  padding-top:calc(26px + env(safe-area-inset-top,0px));padding-left:max(28px,var(--gut));padding-right:max(28px,var(--gut-r));pointer-events:none}
.top>*{pointer-events:auto}
.mark{display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.mark a{display:inline-block;transform-origin:left center;transition:transform .45s cubic-bezier(.2,.7,.2,1),color .3s}
.mark a:hover,.mark a:focus-visible{transform:scale(1.16);color:var(--ink)}
.mark .b{font:500 13px/1 var(--f-body);letter-spacing:.42em}
.mark .n{font:400 12px/1 var(--f-body);letter-spacing:.32em;color:var(--skin)}
.nav{display:flex;gap:30px;font:500 11px/1 var(--f-body);letter-spacing:.24em;padding-top:2px}
.nav a{color:var(--graphite);padding-bottom:6px;border-bottom:1px solid transparent;transition:color .25s,border-color .25s}
.nav a:hover{color:var(--skin)}
.nav a[aria-current=page]{color:var(--skin);border-bottom-color:var(--skin)}
.menu-btn{display:none;font:500 11px/1 var(--f-body);letter-spacing:.24em;color:var(--skin)}
@media (max-width:720px){
  .nav{display:none}
  .menu-btn{display:block}
  .top.open .nav{display:flex;flex-direction:column;align-items:flex-start;gap:22px;position:fixed;inset:0;background:var(--drape);
    padding:calc(110px + env(safe-area-inset-top,0px)) max(28px,var(--gut-r)) 0 max(28px,var(--gut));font-size:15px;z-index:-1}
}

/* pentagramma: cinque linee */
.staff{height:17px;background:repeating-linear-gradient(to bottom,var(--staff) 0 1px,transparent 1px 4px);background-size:100% 17px;background-repeat:no-repeat}

/* pagine con testo */
.page{padding-top:calc(150px + env(safe-area-inset-top,0px));padding-bottom:110px;padding-left:max(28px,var(--gut));padding-right:max(28px,var(--gut-r))}
.eyebrow{font:500 11px/1.4 var(--f-body);letter-spacing:.24em;text-transform:uppercase;color:var(--graphite)}
.display{font:italic 300 clamp(44px,8vw,112px)/.95 var(--f-display);letter-spacing:-.01em;margin:14px 0 0;text-wrap:balance}
.num{font-family:var(--f-mono);font-variant-numeric:tabular-nums;letter-spacing:.04em}

/* HOME */
.home,.home body{height:100%;overflow:hidden}
#stage{position:fixed;inset:0;width:100%;height:100%;display:block;cursor:zoom-in}
.cap{position:fixed;left:max(28px,var(--gut));bottom:calc(30px + env(safe-area-inset-bottom,0px));right:220px;z-index:10;pointer-events:none;transition:opacity .9s}
.cap .t{font:italic 300 clamp(34px,5vw,64px)/1 var(--f-display);margin:0}
.cap .t a{pointer-events:auto}
.cap .t a:hover{color:var(--ink)}
.cap .m{margin-top:12px;font:400 11px/1.5 var(--f-mono);letter-spacing:.08em;color:var(--graphite)}
.ctl{position:fixed;right:max(28px,var(--gut-r));bottom:calc(30px + env(safe-area-inset-bottom,0px));z-index:10;display:flex;align-items:center;gap:18px;font:400 11px/1 var(--f-mono);color:var(--graphite)}
.ctl button{width:38px;height:38px;border:1px solid var(--staff);border-radius:50%;display:grid;place-items:center;color:var(--skin);transition:border-color .25s}
.ctl button:hover{border-color:var(--skin)}
@media (max-width:720px){.cap{right:var(--gut-r);bottom:calc(84px + env(safe-area-inset-bottom,0px))}.ctl{left:var(--gut);right:auto}}

/* WORKS */
.works{list-style:none;margin:56px 0 0;padding:0;border-top:1px solid var(--staff)}
.works li{border-bottom:1px solid var(--staff)}
.works a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:24px;padding:22px 0}
.works .wt{font:italic 300 clamp(40px,6.4vw,92px)/1 var(--f-display);transition:transform .5s cubic-bezier(.2,.7,.2,1),color .3s;transform-origin:left center}
.works a:hover .wt,.works a:focus-visible .wt{transform:translateX(18px);color:var(--ink)}
.works .wm{font:400 12px/1.5 var(--f-mono);color:var(--graphite);text-align:right;white-space:nowrap}
.peek{position:fixed;z-index:30;width:240px;pointer-events:none;opacity:0;transition:opacity .25s;transform:translate(24px,-50%)}
.peek.on{opacity:1}
.note{max-width:62ch;color:var(--graphite);margin-top:40px;font-size:14px}

/* WORK */
.meta{display:flex;flex-wrap:wrap;gap:10px 34px;margin-top:30px;font:400 12px/1.5 var(--f-mono);color:var(--graphite)}
.meta b{display:block;font:500 10px/1.4 var(--f-body);letter-spacing:.24em;color:var(--graphite);text-transform:uppercase;margin-bottom:4px}
.meta span{color:var(--skin)}
.lede{max-width:58ch;margin-top:30px;font:italic 300 24px/1.4 var(--f-display);color:var(--skin)}
.bodies{columns:3 300px;column-gap:28px;margin-top:64px}
.body-card{break-inside:avoid;margin:0 0 34px;display:block;width:100%;text-align:left;cursor:zoom-in}
.body-card img{display:block;width:100%;height:auto;transition:opacity .3s}
.body-card:hover img{opacity:.82}
.body-card span{display:block;margin-top:10px;font:400 11px/1.4 var(--f-mono);color:var(--graphite)}
.pager{display:flex;justify-content:space-between;gap:20px;margin-top:70px;padding-top:26px;border-top:1px solid var(--staff)}
.pager a{font:italic 300 30px/1 var(--f-display)}
.pager a small{display:block;font:500 10px/1 var(--f-body);font-style:normal;letter-spacing:.24em;color:var(--graphite);margin-bottom:10px}
.pager a:last-child{text-align:right}

/* EXHIBITIONS — quattro porte affiancate a tutto schermo */
.doors-page,.doors-page body{height:100%;overflow:hidden}
.doors{position:fixed;inset:0;display:flex;gap:2px;background:var(--drape)}
.door{position:relative;flex:1 1 0;min-width:0;overflow:hidden;transition:flex-grow .8s cubic-bezier(.2,.7,.2,1)}
.door::after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(5,5,5,.88));pointer-events:none}
.door-l{z-index:1}
.door img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.42);transform:scale(1.04);transition:filter .8s,transform 1.6s cubic-bezier(.2,.7,.2,1)}
.doors:hover .door{flex-grow:.7}
.doors .door:hover,.door:focus-visible{flex-grow:3.4}
.door:hover img,.door:focus-visible img{filter:grayscale(1) brightness(.92);transform:scale(1)}
.door-l{position:absolute;left:28px;right:20px;bottom:calc(36px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:10px}
.door{container-type:inline-size}
.door-l b{font:italic 300 min(84px,4.6vw,15cqi)/.95 var(--f-display);text-wrap:balance}
.door-l i{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.door-l i{font:italic 300 22px/1.1 var(--f-display);color:var(--skin)}
.door-l .num{font:400 11px/1 var(--f-mono);color:var(--graphite)}
.door-l .eyebrow{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:760px){.door-l b{font-size:48px}.doors-page,.doors-page body{overflow:auto;height:auto}.doors{position:static;flex-direction:column;padding-top:calc(96px + env(safe-area-inset-top,0px))}.door{flex:none;height:42vh}.door img{filter:grayscale(1) brightness(.6)}.doors:hover .door,.doors .door:hover{flex-grow:0}}


/* EXHIBITION — apertura a tutto schermo e catalogo impaginato */
.xopen{position:relative;height:100dvh;overflow:hidden}
.xopen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.55)}
.open-l{position:absolute;left:max(28px,var(--gut));right:max(28px,var(--gut-r));bottom:calc(70px + env(safe-area-inset-bottom,0px))}
.open-l h1{font:italic 300 clamp(56px,10vw,160px)/.9 var(--f-display);margin:16px 0 18px;text-wrap:balance}
.open-l p{margin:0 0 6px;font-size:17px}
.open-l .small{color:var(--skin);opacity:.7;font-size:14px;max-width:46ch}
.down{position:absolute;right:max(28px,var(--gut-r));bottom:calc(30px + env(safe-area-inset-bottom,0px));font:400 11px var(--f-mono);color:var(--skin);opacity:.7}
.book{padding:120px max(28px,var(--gut-r)) 40px max(28px,var(--gut));display:flex;flex-direction:column;gap:clamp(90px,14vh,170px)}
.row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:28px;align-items:end}
.pl{margin:0;min-width:0}
.pl button{display:block;width:100%;cursor:zoom-in}
.pl img{display:block;width:100%;height:auto;max-height:80vh;object-fit:contain;object-position:left bottom}
.row.wide .pl{grid-column:2 / 12}
.row.wide .pl img{object-position:center}
.row.right .pl{grid-column:6 / 13}
.row.left .pl{grid-column:1 / 8}
.row.pair .a{grid-column:1 / 7}
.row.pair .b{grid-column:8 / 13;align-self:start;margin-top:18vh}
.pl figcaption{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-top:16px;font:400 11px/1.4 var(--f-mono);color:var(--graphite)}
.pl figcaption i,.pl figcaption a,.pl figcaption em{font:italic 300 22px/1 var(--f-display);color:var(--skin)}
.pl figcaption a:hover{color:var(--ink)}
.after{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;padding:80px max(28px,var(--gut-r)) 90px max(28px,var(--gut));border-top:1px solid var(--staff);margin-top:60px}
.back-doors{font:500 11px/1 var(--f-body);letter-spacing:.24em;color:var(--graphite)}
.back-doors:hover{color:var(--skin)}
.next-x{display:flex;flex-direction:column;gap:12px;text-align:right;font:italic 300 clamp(40px,6vw,88px)/.95 var(--f-display)}
.next-x small{font:500 10px/1 var(--f-body);font-style:normal;letter-spacing:.24em;color:var(--graphite)}
.next-x span{font:400 12px/1.4 var(--f-mono);font-style:normal;color:var(--graphite)}
.next-x:hover{color:var(--ink)}
@media (max-width:760px){.row{display:block}.row.pair .b{margin-top:70px}.pl img{max-height:none}.book{gap:70px}}

/* ARCHIVE */
.filters{position:sticky;top:env(safe-area-inset-top,0px);z-index:15;background:var(--drape);display:flex;flex-wrap:wrap;gap:10px;padding:16px 0;margin-top:40px;border-bottom:1px solid var(--staff)}
.filters select,.filters input{background:var(--drape-2);color:var(--skin);border:1px solid var(--staff);border-radius:0;padding:10px 12px;font:400 12px var(--f-body);letter-spacing:.04em}
.filters input{flex:1;min-width:180px}
.filters input::placeholder{color:var(--graphite)}
.count{font:400 11px var(--f-mono);color:var(--graphite);margin-top:18px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:30px 18px;margin-top:22px}
.grid button{display:block;text-align:left;cursor:zoom-in;min-width:0}
.grid .ph{display:flex;align-items:center;justify-content:center;height:200px}
.grid img{max-height:100%;display:block;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.grid button:hover img{transform:scale(1.04)}
.grid span{display:block;margin-top:10px;font:400 11px/1.4 var(--f-mono);color:var(--graphite);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.grid span i{font:italic 300 15px var(--f-display);color:var(--skin)}
@media (max-width:600px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}.grid .ph{height:150px}}

/* ABOUT */
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:40px 60px;padding:54px 0;border-top:1px solid var(--staff)}
.cols:first-of-type{margin-top:56px}
.cols h2{font:italic 300 clamp(34px,4vw,56px)/1 var(--f-display);margin:12px 0 0}
.prose{max-width:64ch;font-size:16px;line-height:1.75;color:var(--skin)}
.prose p{margin:0 0 1.15em}
.prose .lead,.prose .credit{font:400 12px/1.6 var(--f-mono);color:var(--graphite)}
.prose h3{font:500 11px/1.8 var(--f-body);letter-spacing:.24em;margin:0 0 24px;color:var(--graphite)}
.prose h3 span{font-size:10px}
@media (max-width:820px){.cols{grid-template-columns:minmax(0,1fr)}}

/* VISORE */
.viewer{position:fixed;inset:0;z-index:50;background:var(--drape);display:grid;grid-template-columns:minmax(0,1fr) 320px}
.viewer[hidden]{display:none}
.vimg{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:calc(30px + env(safe-area-inset-top,0px)) 30px calc(30px + env(safe-area-inset-bottom,0px)) max(30px,var(--gut));cursor:zoom-in}
.vimg img{max-width:100%;max-height:100%;object-fit:contain;display:block;user-select:none}
.vimg.zoom{display:block;overflow:auto;padding:0;cursor:zoom-out}
.vimg.zoom img{max-width:none;max-height:none}
.vinfo{border-left:1px solid var(--staff);padding:calc(34px + env(safe-area-inset-top,0px)) max(28px,var(--gut-r)) 34px 28px;overflow:auto;display:flex;flex-direction:column;gap:28px}
.vinfo .vt{font:italic 300 46px/1 var(--f-display);margin:8px 0 0}
.vinfo .vt a:hover{color:var(--ink)}
.vinfo dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 18px;margin:0}
.vinfo dt{font:500 10px/1.6 var(--f-body);letter-spacing:.22em;text-transform:uppercase;color:var(--graphite)}
.vinfo dd{margin:0;font-size:14px}
.vbar{display:flex;gap:12px;margin-top:auto}
.vbar button{width:42px;height:42px;border:1px solid var(--staff);border-radius:50%;display:grid;place-items:center;transition:border-color .25s}
.vbar button:hover{border-color:var(--skin)}
.vload{position:absolute;left:30px;bottom:24px;font:400 10px var(--f-mono);letter-spacing:.1em;color:var(--graphite)}
@media (max-width:760px){.viewer{grid-template-columns:minmax(0,1fr);grid-template-rows:62vh auto;overflow:auto}.vinfo{border-left:0;border-top:1px solid var(--staff)}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

[id]{scroll-margin-top:120px}
.mark a[aria-current=page]{color:var(--ink);text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:1px}

/* sottomenu di ARCHIVE */
.has-sub{position:relative;display:inline-flex}
.has-sub .sub{position:absolute;top:100%;right:0;padding-top:14px;display:flex;flex-direction:column;align-items:flex-end;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .25s,transform .25s,visibility 0s .25s}
.has-sub:hover .sub,.has-sub:focus-within .sub,.has-sub.on .sub{opacity:1;visibility:visible;transform:none;transition:opacity .25s,transform .25s}
.has-sub .sub a{font-size:10px;white-space:nowrap}
@media (max-width:720px){.top.open .has-sub{flex-direction:column;align-items:flex-start;gap:16px}
  .top.open .has-sub .sub{position:static;opacity:1;visibility:visible;transform:none;padding:0 0 0 22px;align-items:flex-start}
  .top.open .has-sub .sub a{font-size:13px}}
.has-sub.on>a{color:var(--skin)}

/* contatti */
.ct{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px 34px;margin:6px 0 0;align-items:baseline}
.ct dt{font:500 11px/1.4 var(--f-body);letter-spacing:.24em;text-transform:uppercase;color:var(--graphite)}
.ct dd{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 20px}
.ct .cv{font:italic 300 clamp(26px,3.2vw,40px)/1.15 var(--f-display);color:var(--skin);overflow-wrap:anywhere;user-select:all}
.ct .cv:hover{color:var(--ink)}
.cp{font:500 10px/1 var(--f-body);letter-spacing:.24em;text-transform:uppercase;color:var(--graphite);border-bottom:1px solid var(--staff);padding-bottom:4px}
.cp:hover{color:var(--skin)}
@media (max-width:600px){.ct{grid-template-columns:minmax(0,1fr);gap:8px}.ct dd{margin-bottom:22px}}
@media (max-width:600px){.ct .cv{font-size:clamp(19px,6.4vw,26px)}}
/* contatti: nome e indirizzi in carattere sobrio */
.contact h2{font:400 clamp(20px,2vw,26px)/1.3 var(--f-body);letter-spacing:.01em;margin-top:14px}
.ct .cv{font:400 clamp(17px,1.6vw,21px)/1.4 var(--f-body);letter-spacing:.01em;font-style:normal}
@media (max-width:600px){.ct .cv{font-size:17px}}
.ct{align-items:center}

/* contatti: souvenir in basso al centro */
.contact-page{min-height:100dvh;display:flex;flex-direction:column;padding-bottom:calc(36px + env(safe-area-inset-bottom,0px))}
.souv{position:relative;flex:1 1 auto;min-height:min(46vh,420px);margin:40px 0 0;width:100%}
.souv img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;opacity:0;transition:opacity 1.4s ease}
.souv img.on{opacity:1}
@media (max-width:600px){.souv{min-height:260px}}

.cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 60px;margin-top:56px;border-top:1px solid var(--staff)}
.cgrid .cols{display:block;border-top:0;padding:40px 0 0;margin:0}
.cgrid .prose{margin-top:22px}
.contact-page .display{margin-bottom:0}
@media (max-width:760px){.cgrid{grid-template-columns:minmax(0,1fr)}.cgrid .cols+.cols{border-top:1px solid var(--staff);margin-top:40px}}
.souv{min-height:min(40vh,380px)}
.souv{min-height:min(35vh,380px);margin-top:36px}
