/* ============ GALLERIA 2026 ============
   Estende assets/site.css (stessi token). Struttura: intro a costellazione che si apre a tutto schermo,
   dodici capitoli (apertura pinnata + collage a colonne in parallasse, pellicola orizzontale per il
   Gran Premio), dock dei capitoli, Muro con tutte le 120 foto, visore.
   Gli stati animati valgono solo con html.gx-m (movimento attivo, messo da galleria-2026.js):
   senza JS o con "riduci movimento" la pagina resta statica e leggibile. */

:root{--navh:70px;--gx-r:3px}
@media (min-width:980px){:root{--navh:62px}}
.gx-ph{display:block;width:100%;padding:0;position:relative;overflow:hidden;border-radius:var(--gx-r);background:var(--ink-3);cursor:zoom-in}
.gx-ph img{width:100%;height:100%;object-fit:cover}

/* ---------- 1. intro ---------- */
.gx-intro{position:relative;background:var(--ink)}
.gx-intro__stage{position:relative;height:100svh;min-height:560px;overflow:hidden}
.gx-hero{position:absolute;inset:0;margin:0}
.gx-hero__b{height:100%;border-radius:0}
.gx-hero__b img{object-position:center 58%}
.gx-hero::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(18,15,10,.55),rgba(18,15,10,.15) 35%,rgba(18,15,10,.25) 60%,rgba(18,15,10,.85))}
.gx-hero__cap{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);bottom:clamp(84px,11vh,120px);display:none;gap:.6em;max-width:44rem;pointer-events:none}
.gx-hero__cap b{font-family:var(--font-display);font-weight:500;font-size:clamp(1.3rem,2.2vw,2rem);line-height:1.15}
.gx-hero__nums{display:flex;flex-wrap:wrap;gap:.4em 1.6em;font-size:var(--fs-small);letter-spacing:var(--ls-ui);text-transform:uppercase;color:var(--stone)}
.gx-hero__nums span::before{content:"";display:inline-block;width:5px;height:5px;margin-right:.7em;vertical-align:middle;border-radius:50%;background:var(--gold)}
.gx-hero__cap small{font-size:var(--fs-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted)}
.gx-sat{display:none}
.gx-intro__t{position:absolute;z-index:3;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;padding:var(--navh) var(--gutter) 0;pointer-events:none}
.gx-intro__t .eyebrow::after{content:"";width:2.2em;height:1px;background:var(--gold);flex:none}
.gx-intro__t h1{font-size:clamp(3.1rem,9.6vw,10.5rem);line-height:.92;letter-spacing:-.01em;margin:.25em 0 .3em;text-shadow:0 10px 60px rgba(0,0,0,.55)}
.gx-intro__t h1 em{font-style:normal;color:var(--gold-2)}
.gx-l{display:block;overflow:hidden;padding-bottom:.06em}
.gx-l>*{display:inline-block}
.gx-intro__lead{max-width:34rem;color:var(--stone);font-size:clamp(1rem,1.25vw,1.2rem);text-shadow:0 2px 20px rgba(0,0,0,.6);
  padding:.7em 2.2em;background:radial-gradient(closest-side,rgba(18,15,10,.82),rgba(18,15,10,.6) 70%,rgba(18,15,10,0))}
.gx-intro__cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:1.6em;pointer-events:auto}
.gx-scroll{position:absolute;z-index:3;left:50%;bottom:22px;translate:-50% 0;display:grid;justify-items:center;gap:8px;font-size:var(--fs-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--stone-3)}
.gx-scroll i{width:1px;height:42px;background:linear-gradient(var(--gold),transparent);transform-origin:top;animation:gx-drip 2.2s var(--ease) infinite}
@keyframes gx-drip{0%{transform:scaleY(0)}50%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}

/* intro animata: costellazione */
.gx-m .gx-intro{height:330vh}
.gx-m .gx-intro__stage{position:sticky;top:0}
.gx-m .gx-hero{clip-path:inset(29% 33.5% 29% 33.5% round 4px);will-change:clip-path}
.gx-m .gx-hero__b img{transform:scale(1.25)}
.gx-hero::after{opacity:var(--ov,1)}
.gx-m .gx-hero{--ov:.75}
.gx-m .gx-hero__cap{display:grid;opacity:0}
.gx-m .gx-sat{display:block;position:absolute;z-index:1;left:var(--x);top:var(--y);width:var(--w);will-change:transform}
.gx-sat img{width:100%;height:auto;border-radius:var(--gx-r);box-shadow:0 30px 60px -24px rgba(0,0,0,.8);filter:brightness(.82)}
.gx-m .gx-intro__t h1{text-shadow:0 6px 40px rgba(0,0,0,.7)}
@media (max-width:699px){
  .gx-m .gx-intro{height:260vh}
  .gx-m .gx-hero{clip-path:inset(25% 5% 27% 5% round 4px)}
  .gx-intro__lead,.gx-scroll{display:none}
  .gx-intro__t .eyebrow{letter-spacing:.14em;font-size:.66rem}
  .gx-intro__t .eyebrow::before,.gx-intro__t .eyebrow::after{display:none}
  .gx-intro__t h1{font-size:clamp(2.9rem,14vw,4.2rem)}
  .gx-intro__cta{flex-direction:column;align-items:center;margin-top:1em}
  .gx-m .gx-sat{display:none}
  .gx-m .gx-sat--m{display:block;left:var(--mx);top:var(--my);width:var(--mw)}
  .gx-intro__cta .btn{padding:.9em 1.4em}
}

/* ---------- 2. dock + indice ---------- */
.gx-dock{position:fixed;z-index:40;left:50%;bottom:max(14px,env(safe-area-inset-bottom,0px));translate:-50% 0;display:flex;align-items:center;gap:6px;padding:6px;border-radius:999px;
  background:rgba(18,15,10,.72);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:inset 0 0 0 1px var(--hair),0 20px 50px -20px rgba(0,0,0,.8);
  transition:opacity .5s var(--ease),translate .6s var(--ease)}
.gx-dock:not(.is-on){opacity:0;translate:-50% 140%;pointer-events:none}
.gx-dock button{display:flex;align-items:center;gap:.6em;height:44px;padding:0 1.1em;border-radius:999px;font-size:var(--fs-small);letter-spacing:.06em;white-space:nowrap}
.gx-dock__ch i{font-style:normal;font-family:var(--font-display);color:var(--gold-2);min-width:2.2em;text-align:center}
.gx-dock__ch span{max-width:11em;overflow:hidden;text-overflow:ellipsis}
.gx-dock__ch svg{width:14px;height:14px;opacity:.6}
.gx-dock__ch:hover{background:var(--ink-3)}
.gx-dock__bar{width:56px;height:2px;background:var(--hair-paper);border-radius:2px;overflow:hidden}
.gx-dock__bar b{display:block;height:100%;background:var(--gold);transform-origin:left;transform:scaleX(var(--p,0))}
.gx-dock__all{background:var(--gold);color:var(--ink);font-weight:500}
.gx-dock__all:hover{background:var(--gold-2)}
.gx-dock__all svg{width:15px;height:15px}
@media (max-width:520px){.gx-dock__bar{display:none}.gx-dock__all span{display:none}.gx-dock__all{padding:0 14px}}

.gx-idx{position:fixed;inset:auto auto 78px 50%;translate:-50% 0;margin:0;width:min(92vw,380px);max-height:min(70vh,560px);overflow:auto;padding:18px;border:0;border-radius:18px;
  background:rgba(27,22,16,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:var(--paper);box-shadow:inset 0 0 0 1px var(--hair),0 30px 80px -20px #000;
  opacity:0;transform:translateY(12px) scale(.98);transition:opacity .3s var(--ease),transform .4s var(--ease),display .4s allow-discrete,overlay .4s allow-discrete}
.gx-idx:popover-open{opacity:1;transform:none}
@starting-style{.gx-idx:popover-open{opacity:0;transform:translateY(12px) scale(.98)}}
.gx-idx ol{list-style:none;margin:.8em 0 0;padding:0}
.gx-idx a{display:grid;grid-template-columns:3em 1fr auto;align-items:baseline;padding:.6em .4em;border-top:1px solid var(--hair-paper);transition:color .25s,padding .4s var(--ease)}
.gx-idx a i{font-style:normal;font-family:var(--font-display);color:var(--gold)}
.gx-idx a small{color:var(--muted);font-size:var(--fs-label)}
.gx-idx a:hover,.gx-idx a[aria-current]{color:var(--gold-2);padding-left:.8em}

/* ---------- 3. capitoli ---------- */
.gx-ch{position:relative;--bg:var(--ink);--fg:var(--paper);--mut:var(--muted);background:var(--bg);color:var(--fg)}
.gx-ch--stone{--bg:var(--stone);--fg:var(--ink);--mut:var(--muted-dark)}
.gx-ch--night{--bg:#0A0806}
.gx-ch--stone .eyebrow{color:var(--gold-3)}
.gx-ch--stone .eyebrow::before{background:var(--gold-3)}

/* apertura: statica di base */
.gx-op__stage{position:relative;display:grid;gap:var(--sp-2);padding:calc(var(--navh) + var(--sp-3)) var(--gutter) var(--sp-2);overflow:hidden}
.gx-op__num{position:absolute;z-index:0;top:var(--sp-2);right:var(--gutter);font-family:var(--font-display);font-size:clamp(9rem,26vw,26rem);line-height:.8;color:transparent;
  -webkit-text-stroke:1px color-mix(in srgb,var(--gold) 45%,transparent);pointer-events:none;user-select:none}
.gx-op--r .gx-op__num{right:auto;left:var(--gutter)}
/* desktop: niente numero romano dietro al titolo, disturba la lettura (15/10) */
@media (min-width:900px){.gx-op__num{display:none}}
.gx-op__txt{position:relative;z-index:2;max-width:36rem}
.gx-op__txt h2{font-size:clamp(2.2rem,4.8vw,4.6rem);margin:.4em 0 .5em}
.gx-op__lead{font-size:clamp(1.02rem,1.25vw,1.2rem);line-height:1.6;opacity:.88}
.gx-op__meta{list-style:none;margin:1.4em 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5em 1.4em;font-size:var(--fs-small);color:var(--mut)}
.gx-op__meta li{display:flex;align-items:center;gap:.6em}
.gx-op__meta li+li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--gold)}
.gx-op__meta b{color:var(--fg);font-weight:500}
.gx-op__fig{position:relative;z-index:1;margin:0;aspect-ratio:16/10;border-radius:var(--gx-r);overflow:hidden}
.gx-op__fig .gx-ph{height:100%;border-radius:0}
.gx-op__veil{position:absolute;inset:0;pointer-events:none;opacity:0;background:linear-gradient(180deg,transparent 55%,rgba(10,8,6,.8))}
.gx-op__cap{position:absolute;z-index:2;left:clamp(14px,3vw,40px);bottom:clamp(12px,3vh,32px);right:clamp(14px,3vw,40px);color:var(--paper);font-size:var(--fs-small);display:flex;gap:1em;align-items:baseline;opacity:0;pointer-events:none}
.gx-op__cap b{color:var(--gold-2);font-weight:500;letter-spacing:.12em;white-space:nowrap}

@media (min-width:900px){
  .gx-op__stage{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;min-height:100svh}
  .gx-op--r .gx-op__txt{order:2}
}

/* apertura animata: palco sticky, la foto si apre a tutto schermo */
.gx-m .gx-op{height:175vh}
.gx-m .gx-op__stage{position:sticky;top:0;height:100svh;min-height:0;display:block;padding:0}
.gx-m .gx-op__fig{position:absolute;inset:0;aspect-ratio:auto;border-radius:0;clip-path:inset(20% 6% 20% 52% round 4px);will-change:clip-path}
.gx-m .gx-op--r .gx-op__fig{clip-path:inset(20% 52% 20% 6% round 4px)}
.gx-m .gx-op__fig img{transform:scale(1.3)}
.gx-m .gx-op__txt{position:absolute;top:50%;left:var(--gutter);translate:0 -50%;width:min(40vw,34rem);padding-top:var(--navh)}
.gx-m .gx-op--r .gx-op__txt{left:auto;right:var(--gutter)}
.gx-m .gx-op__num{top:50%;right:auto;left:30%;translate:-50% -50%}
.gx-m .gx-op--r .gx-op__num{left:70%}
@media (max-width:899px){
  .gx-m .gx-op{height:150vh}
  .gx-m .gx-op__fig,.gx-m .gx-op--r .gx-op__fig{clip-path:inset(58% 5% 7% 5% round 4px)}
  .gx-m .gx-op__txt,.gx-m .gx-op--r .gx-op__txt{top:calc(var(--navh) + 4vh);left:var(--gutter);right:var(--gutter);width:auto;translate:none;padding:0}
  .gx-m .gx-op__txt h2{font-size:clamp(2rem,8.5vw,2.8rem);margin:.3em 0 .4em}
  .gx-m .gx-op__lead{font-size:.98rem;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
  .gx-m .gx-op__meta{display:none}
  .gx-m .gx-op__num,.gx-m .gx-op--r .gx-op__num{left:auto;right:-.05em;top:auto;bottom:6%;translate:none;font-size:46vw;z-index:2;-webkit-text-stroke-color:rgba(233,204,99,.5)}
  .gx-m .gx-op__fig,.gx-m .gx-op--r .gx-op__fig{clip-path:inset(0 0 0 0)}
  .gx-m .gx-op__fig::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:var(--sh,1);
    background:linear-gradient(180deg,rgba(10,8,6,.9) 0%,rgba(10,8,6,.72) 45%,rgba(10,8,6,.35) 100%)}
  .gx-m .gx-op__txt,.gx-m .gx-op__txt h2{color:var(--paper)}
  .gx-m .gx-op__txt .eyebrow{color:var(--gold-2)}
  .gx-m .gx-op__txt .eyebrow::before{background:var(--gold-2)}
  .gx-m .gx-op__lead{opacity:.92;-webkit-line-clamp:7}
}

/* collage */
.gx-col{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,52px);align-items:start;padding-block:var(--sp-4) var(--sp-5)}
.gx-col--2{grid-template-columns:repeat(2,minmax(0,1fr));width:min(100% - 2*var(--gutter),1080px)}
.gx-col__c{position:relative;z-index:1;display:flex;flex-direction:column;gap:clamp(36px,6vw,100px)}
.gx-col--3 .gx-col__c[data-c="1"]{margin-top:clamp(60px,16vh,200px)}
.gx-col--3 .gx-col__c[data-c="2"]{margin-top:clamp(20px,6vh,80px)}
.gx-col--2 .gx-col__c[data-c="1"]{margin-top:clamp(60px,14vh,180px)}
.gx-fig{margin:0;width:var(--fw,100%);align-self:var(--fa,start)}
.gx-fig .gx-ph{aspect-ratio:var(--ar,auto)}
.gx-fig .gx-ph img{height:auto}
.gx-fig figcaption{display:flex;gap:.9em;align-items:baseline;margin-top:.9em;font-size:var(--fs-small);line-height:1.45;color:var(--mut);transition:color .3s}
.gx-fig figcaption b{flex:none;font-weight:500;font-size:var(--fs-label);letter-spacing:.14em;color:var(--gold)}
.gx-ch--stone .gx-fig figcaption b{color:var(--gold-3)}
@media (hover:hover){
  .gx-fig .gx-ph img{transition:scale 1.2s var(--ease),filter 1s var(--ease)}
  .gx-fig:hover figcaption{color:var(--fg)}
  .gx-fig .gx-ph:hover img{scale:1.045}
}
/* telefono: collage a due colonne, una orizzontale su tre a tutta larghezza */
@media (max-width:699px){
  .gx-col,.gx-col--2{display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:row dense;gap:26px 10px;align-items:start;width:calc(100% - 24px);padding-block:var(--sp-2) var(--sp-3)}
  .gx-col__c{display:contents}
  .gx-fig,.gx-fig:nth-child(n){order:var(--o);width:100%;align-self:start}
  .gx-fig--w{grid-column:1/-1}
  .gx-fig figcaption{gap:.4em;margin-top:.6em;font-size:var(--fs-small);line-height:1.45;flex-direction:column}
  .gx-fig figcaption b{font-size:var(--fs-label);letter-spacing:.1em}
  .gx-fig--w figcaption{flex-direction:row;font-size:var(--fs-small)}
  .gx-big{top:6%;font-size:34vw}
}
/* collage animato: tendina + parallasse interna */
.gx-m .gx-fig .gx-ph{clip-path:inset(100% 0 0 0);transition:clip-path 1.3s var(--ease)}
.gx-m .gx-fig .gx-ph img{height:116%;margin-top:-8%;scale:1.22;transition:scale 1.6s var(--ease),filter 1s var(--ease)}
.gx-m .gx-fig figcaption{opacity:0;translate:0 12px;transition:opacity .9s var(--ease) .25s,translate .9s var(--ease) .25s,color .3s}
.gx-m .gx-fig.is-in .gx-ph{clip-path:inset(0 0 0 0)}
.gx-m .gx-fig.is-in .gx-ph img{scale:1}
.gx-m .gx-fig.is-in figcaption{opacity:1;translate:none}
@media (hover:hover){.gx-m .gx-fig.is-in .gx-ph:hover img{scale:1.045}}
.gx-m .gx-col__c{will-change:transform}

/* il musical: foto spente che si accendono al centro */
.gx-big{position:absolute;z-index:0;left:50%;top:18%;translate:-50% 0;font-family:var(--font-display);font-size:clamp(7rem,24vw,24rem);line-height:.8;color:transparent;
  -webkit-text-stroke:1px rgba(233,204,99,.28);white-space:nowrap;pointer-events:none}
.gx-m .gx-ch--show .gx-fig .gx-ph img{filter:brightness(.66) saturate(.8)}
.gx-m .gx-ch--show .gx-fig.is-lit .gx-ph img{filter:none}
.gx-ch--show .gx-fig.is-lit figcaption{color:var(--paper)}

/* Gran Premio: pellicola orizzontale */
.gx-film{position:relative;background:var(--bg)}
.gx-film__pin{padding-block:var(--sp-3) var(--sp-4)}
.gx-film__track{display:flex;gap:clamp(14px,2.4vw,40px);padding-inline:var(--gutter);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.gx-film__track::-webkit-scrollbar{display:none}
.gx-film__fig{flex:none;scroll-snap-align:center;width:auto;margin:0}
.gx-film__fig .gx-ph{height:min(62svh,560px);width:auto;aspect-ratio:var(--ar)}
.gx-film__fig .gx-ph img{height:100%}
.gx-film__fig figcaption{max-width:36em}
@media (max-width:899px){
  .gx-film__fig .gx-ph{height:auto;width:min(86vw,calc(58svh * var(--arn)))}
  .gx-film__fig figcaption{max-width:min(86vw,calc(58svh * var(--arn)))}
}
.gx-film__hud{display:flex;align-items:center;gap:18px;margin:var(--sp-2) var(--gutter) 0;font-size:var(--fs-small);letter-spacing:.14em;color:var(--muted)}
.gx-film__hud b{color:var(--gold-2);font-weight:500}
.gx-film__hud i{flex:1;max-width:360px;height:1px;background:var(--hair-paper)}
.gx-film__hud i b{display:block;height:100%;background:var(--gold);transform-origin:left;transform:scaleX(var(--p,0))}
@media (min-width:900px){
  .gx-m .gx-film__pin{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;padding:var(--navh) 0 0;overflow:hidden}
  .gx-m .gx-film__track{overflow:visible;scroll-snap-type:none;will-change:transform}
  .gx-m .gx-film__fig .gx-ph{height:min(66svh,720px)}
  .gx-m .gx-film__fig .gx-ph img{height:100%;margin:0;width:112%;max-width:none;margin-left:-6%}
}

/* chiusura */
.gx-end{padding-block:0 var(--sp-5);text-align:center;display:grid;justify-items:center;gap:1.2em}
.gx-end .eyebrow::after{content:"";width:2.2em;height:1px;background:var(--gold-3);flex:none}
.gx-end__t{font-family:var(--font-display);font-size:clamp(2.8rem,9vw,8.5rem);line-height:.95}
.gx-end__t em{font-style:normal;display:block;color:var(--gold-3)}
.gx-end__cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:.6em}
.gx-ch--stone .btn--ghost{--fg:var(--ink);box-shadow:inset 0 0 0 1px var(--stone-3)}
.gx-ch--stone .btn--ghost::before{background:var(--ink)}
.gx-ch--stone .btn--ghost:hover{color:var(--paper)}

/* ---------- dialog comuni ---------- */
.gx-wall,.gx-lb{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;color:var(--paper);overflow:hidden;overscroll-behavior:contain}
.gx-wall::backdrop,.gx-lb::backdrop{background:transparent}
.gx-x{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:1.6rem;line-height:1;color:var(--paper);background:rgba(18,15,10,.55);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px var(--hair-paper);transition:background-color .3s,rotate .5s var(--ease)}
.gx-x:hover{background:var(--ink-3);rotate:90deg}

/* ---------- 5. il Muro ---------- */
.gx-wall{background:#0D0B08;opacity:0;transition:opacity .45s var(--ease),display .45s allow-discrete,overlay .45s allow-discrete}
.gx-wall[open]{opacity:1}
@starting-style{.gx-wall[open]{opacity:0}}
.gx-wall__vp{position:absolute;inset:0;overflow:hidden;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.gx-wall__vp.is-drag{cursor:grabbing}
.gx-wall__plane{position:absolute;inset:0;transform-origin:50% 50%}
.gx-w{position:absolute;left:0;top:0;padding:0;will-change:transform;cursor:inherit}
.gx-w span{display:block;width:100%;height:100%;overflow:hidden;border-radius:2px;background:var(--ink-3);box-shadow:0 24px 50px -24px rgba(0,0,0,.9);
  scale:0;opacity:0;transition:scale .9s var(--ease) var(--dl,0s),opacity .6s var(--ease) var(--dl,0s),filter .5s,translate .5s var(--ease)}
.gx-wall.is-in .gx-w span{scale:1;opacity:1}
.gx-w img{width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}
@media (hover:hover){.gx-w:hover span{translate:0 -4px;box-shadow:0 0 0 1px var(--gold),0 30px 60px -20px #000}}
.gx-w:focus-visible{outline:none}
.gx-w:focus-visible span{box-shadow:0 0 0 2px var(--gold-2)}
.gx-wall__plane.is-f .gx-w:not(.is-f) span{opacity:.1;filter:grayscale(1)}
.gx-wall__top{position:absolute;z-index:2;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:max(14px,env(safe-area-inset-top,0px)) var(--gutter) 30px;background:linear-gradient(180deg,rgba(13,11,8,.85),transparent);pointer-events:none}
.gx-wall__top>*{pointer-events:auto}
.gx-wall__top p{font-size:var(--fs-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--stone-3)}
.gx-wall__top b{font-family:var(--font-display);font-size:1.6rem;letter-spacing:0;color:var(--gold-2);margin-right:.2em;vertical-align:-.12em}
@media (max-width:520px){.gx-wall__top p span{display:none}}
.gx-wall__f{position:absolute;z-index:2;left:0;right:0;bottom:0;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;
  padding:40px var(--gutter) max(16px,env(safe-area-inset-bottom,0px));background:linear-gradient(0deg,rgba(13,11,8,.9),transparent)}
.gx-wall__f::-webkit-scrollbar{display:none}
.gx-wall__f button{flex:none;height:38px;padding:0 1.1em;border-radius:999px;font-size:var(--fs-small);color:var(--stone);background:rgba(27,22,16,.7);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:inset 0 0 0 1px var(--hair-paper);transition:background-color .3s,color .3s}
.gx-wall__f button:hover{color:var(--paper);background:var(--ink-3)}
.gx-wall__f button[aria-pressed="true"]{background:var(--gold);color:var(--ink);box-shadow:none}
@media (min-width:1100px){.gx-wall__f{justify-content:center}}
.gx-tip{position:absolute;z-index:3;left:0;top:0;max-width:260px;padding:.55em .9em;border-radius:8px;font-size:var(--fs-small);line-height:1.35;
  background:rgba(18,15,10,.88);box-shadow:inset 0 0 0 1px var(--hair);pointer-events:none;opacity:0;transition:opacity .25s}
.gx-tip.is-on{opacity:1}
.gx-tip small{display:block;color:var(--gold-2);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;margin-bottom:.2em}

/* ---------- 6. visore ---------- */
.gx-lb{background:transparent}
.gx-lb[open]{display:block}
.gx-lb__bg{position:absolute;inset:0;background:rgba(10,8,6,.96)}
.gx-lb__stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;touch-action:pan-y}
.gx-lb__stage img{display:block;max-width:none;border-radius:3px;box-shadow:0 60px 120px -40px #000;transform-origin:0 0;will-change:transform}
.gx-lb__top{position:absolute;z-index:2;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:max(12px,env(safe-area-inset-top,0px)) var(--gutter) 0}
.gx-lb__top p{display:flex;gap:1.4em;align-items:baseline;font-size:var(--fs-label);letter-spacing:.16em;text-transform:uppercase;color:var(--stone-3);min-width:0}
.gx-lb__top p span:first-child{color:var(--gold-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gx-lb__nav{position:absolute;z-index:2;top:50%;translate:0 -50%;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:rgba(18,15,10,.5);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px var(--hair-paper);transition:background-color .3s,scale .3s var(--ease)}
.gx-lb__nav:hover{background:var(--ink-3);scale:1.06}
.gx-lb__nav svg{width:24px;height:24px}
.gx-lb__prev{left:clamp(8px,2vw,28px)}
.gx-lb__next{right:clamp(8px,2vw,28px)}
@media (hover:none) and (max-width:699px){.gx-lb__nav{display:none}}
.gx-lb__cap{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);bottom:0;padding:0 0 max(16px,env(safe-area-inset-bottom,0px));display:grid;gap:.3em;justify-items:center;text-align:center;font-size:var(--fs-body-s)}
.gx-lb__cap small{font-size:var(--fs-label);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.gx-lb__ui{transition:opacity .4s var(--ease)}
.gx-lb:not(.is-ui) .gx-lb__ui{opacity:0}

/* ---------- 7. cursore ---------- */
.gx-cur{position:fixed;z-index:70;left:0;top:0;pointer-events:none;display:none}
.gx-cur span{position:absolute;left:-7px;top:-7px;width:14px;height:14px;border-radius:50%;display:grid;place-items:center;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  color:transparent;background:var(--gold);transition:width .45s var(--ease),height .45s var(--ease),left .45s var(--ease),top .45s var(--ease),color .3s,background-color .3s,opacity .3s;opacity:0}
.gx-c .gx-cur{display:block}
.gx-cur.is-on span{opacity:.9}
.gx-cur.is-big span{width:86px;height:86px;left:-43px;top:-43px;color:var(--ink);background:rgba(233,204,99,.92)}
.gx-cur.is-big span::after{content:attr(data-t)}

@media (prefers-reduced-motion:reduce){
  .gx-scroll i{animation:none}
  .gx-wall,.gx-idx,.gx-w span{transition-duration:.01s}
}