:root {
  --carbone: #0e0b0a;
  --carbone-2: #16100e;
  --carta: #efe8e2;
  --cenere: #9a8f89;
  --fuoco: #b0261e;
  --fuoco-vivo: #e0442c;
  --f: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --gut: max(20px, env(safe-area-inset-left, 0px));
  --strip: 76px;
  --head: 92px;   /* la pila delle serate parte sotto l'header fisso */
  color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--carbone); color: var(--carta); font-family: var(--f); -webkit-font-smoothing: antialiased; }
em, i { font-style: normal; }
a { color: inherit; text-decoration: none; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ── header fisso: logo + chi/cosa/dove/quando (Sónar), menu a destra ── */
.top { position: fixed; z-index: 10; inset: 0 0 auto; display: flex; align-items: flex-start; justify-content: space-between;
  padding: max(20px, env(safe-area-inset-top, 0px)) var(--gut) 0; opacity: 0; transition: opacity .8s var(--ease) .4s; pointer-events: none; }
.top > * { pointer-events: auto; }
.ready .top { opacity: 1; }
.brand { display: flex; align-items: center; gap: 18px; }
.brand img { height: 46px; width: auto; display: block; flex: none; }
.menu-b { font: 700 15px/1 var(--f); color: var(--carta); background: none; border: 0; padding: 10px 0 10px 18px; cursor: pointer; display: flex; align-items: center; gap: 10px; }
.menu-b i { display: grid; gap: 5px; width: 22px; }
.menu-b i::before, .menu-b i::after { content: ""; height: 2px; background: currentColor; }
.menu-b i::after { width: 70%; justify-self: end; }

/* ── hero + Rivivi: un solo palco fisso, 420svh di scroll ── */
.hero { position: relative; height: 420svh; }
.stage { position: sticky; top: 0; height: 100svh; overflow: hidden; perspective: 1200px; }
.film { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.film-fallback { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.5) brightness(.85); }
video.src { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.scrim { position: absolute; z-index: 3; pointer-events: none; }
.scrim.tr { top: 0; right: 0; width: 70%; height: 62%; background: radial-gradient(ellipse at 100% 0%, rgb(14 11 10 / .62), rgb(14 11 10 / 0) 70%); }
.scrim.br { bottom: 0; right: 0; width: 60%; height: 50%; background: radial-gradient(ellipse at 100% 100%, rgb(14 11 10 / .7), rgb(14 11 10 / 0) 70%); }
.scrim.tl { top: 0; left: 0; width: 50%; height: 24%; background: radial-gradient(ellipse at 0% 0%, rgb(14 11 10 / .5), rgb(14 11 10 / 0) 70%); }

/* il logo principale, grande al centro del film */
.hero-logo { position: absolute; z-index: 4; left: 50%; top: 55%; width: min(44vw, 680px); translate: -50% -50%; pointer-events: none; }
.hero-logo img { display: block; width: 100%; height: auto; filter: drop-shadow(0 0 40px rgb(14 11 10 / .55)); }
.hero-logo img.in { transition-duration: 1.4s; }
/* la frase, in alto a destra */
.line { position: absolute; z-index: 4; right: var(--gut); top: clamp(96px, 15svh, 150px); margin: 0; text-align: right;
  font-weight: 900; font-size: clamp(30px, 3.8vw, 64px); line-height: .92; letter-spacing: -.025em; text-transform: uppercase; text-wrap: balance; max-width: 11ch; }
.line span { display: block; }

/* righe d'azione (Creamfields + sfregio di Alter Ego) */
.acts { margin: 0; padding: 0; list-style: none; }
.acts a { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 15px 0 13px; font-weight: 700; font-size: clamp(18px, 1.6vw, 23px); letter-spacing: -.01em; }
.acts a::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: rgb(239 232 226 / .32); }
.acts a::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--fuoco-vivo); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.acts a:hover::after, .acts a:focus-visible::after { transform: scaleX(1); }
.acts a:focus-visible { outline: none; }
.acts .w { position: relative; }
.acts .w > svg { position: absolute; left: -6%; top: 50%; width: 112%; height: 30px; translate: 0 -50%; overflow: visible; pointer-events: none; }
.acts .w > svg path { fill: none; stroke: var(--fuoco-vivo); stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .2s cubic-bezier(.2, .8, .2, 1); }
.acts .w > svg path:nth-child(2) { transition-delay: .04s; }
.acts a:hover .w > svg path, .acts a:focus-visible .w > svg path { stroke-dashoffset: 0; }
.acts .ar { font-weight: 500; transition: translate .35s var(--ease); }
.acts a:hover .ar { translate: 4px 0; }
.hero-acts { position: absolute; z-index: 4; right: var(--gut); bottom: max(28px, env(safe-area-inset-bottom, 0px)); width: min(420px, calc(100vw - 40px)); }

/* ingresso dei testi dal blur, legato ai tagli (Cyberpunk Reveal) */
.in { opacity: 0; translate: 0 26px; filter: blur(8px); transition: opacity .95s var(--ease), translate .95s var(--ease), filter .95s var(--ease); transition-delay: var(--d, 0s); }
.in.on { opacity: 1; translate: 0 0; filter: blur(0); }
/* uscita in profondità (AI Film Studio), guidata da --x */
.out { transform: translate3d(0, 0, calc(var(--x, 0) * 680px)); opacity: calc(1 - var(--x, 0) * var(--x, 0) * 1.4); }

/* la finestra di Rivivi: il film bruciato a colori si stringe qui dentro */
.film { transition: none; }
.frame { display: none; }

/* Rivivi: testi attorno alla finestra */
.rv { position: absolute; z-index: 7; inset: 0; pointer-events: none; opacity: var(--rv, 0); }
.rv > * { pointer-events: auto; }
.rv h2 { position: absolute; left: var(--gut); top: 50%; translate: 0 -50%; margin: 0; font-weight: 900; font-size: clamp(44px, 6.4vw, 118px); line-height: .9; letter-spacing: -.035em; text-transform: uppercase; }
.rv-side { position: absolute; right: var(--gut); top: 50%; translate: 0 -50%; width: calc((100vw - var(--card-w, 46vw)) / 2 - var(--gut) - 32px); display: grid; gap: 28px; }
.fill { margin: 0; font-weight: 700; font-size: clamp(18px, 1.55vw, 26px); line-height: 1.3; letter-spacing: -.01em; }
.fill span { opacity: .22; transition: color .3s; }
.fill span.lit { opacity: 1; }
.fill span.hot { color: var(--fuoco-vivo); }

/* ── 25.000 persone: un solo video nel filtro Flames che si apre fino a riempire lo schermo, il numero conta ── */
.tot { position: relative; height: 260svh; }
.tot-st { position: sticky; top: 0; height: 100svh; overflow: hidden; }
.tot-win { position: absolute; inset: 0; clip-path: inset(var(--iy, 22%) var(--ix, 26%)); }
.tot-fx { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.tot-win::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 50%, rgb(14 11 10 / .55), rgb(14 11 10 / .1) 70%); }
.tot-txt { position: absolute; inset: 0; z-index: 2; display: grid; place-content: center; text-align: center; pointer-events: none; transform: scale(var(--ts, 1.12)); }
.tot-n { margin: 0; font-weight: 900; font-size: clamp(96px, 21vw, 380px); line-height: .8; letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.tot-s { margin: 22px 0 0; font-weight: 800; text-transform: uppercase; font-size: clamp(20px, 2.4vw, 40px); line-height: 1; letter-spacing: -.01em; }
.tot-d { margin: 18px 0 0; font-size: clamp(14px, 1.1vw, 17px); font-weight: 600; opacity: .85; }

/* caricamento: prima visita, segue il buffer vero, finisce in un fotogramma rosso */
.load { position: fixed; inset: 0; z-index: 20; background: var(--carbone); display: grid; place-items: center; }
.load b { font: 900 clamp(40px, 7vw, 96px)/1 var(--f); font-variant-numeric: tabular-nums; letter-spacing: -.03em; }
.load i { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--fuoco); transform: scaleX(0); transform-origin: left; }
.load.red { background: var(--fuoco); } .load.red b, .load.red i { display: none; }

/* menu a schermo intero (Obsidian + finestra di Atlas Nav) */
.menu { position: fixed; inset: 0; z-index: 30; background: #120d0c; clip-path: inset(0 0 100% 0); transition: clip-path .7s cubic-bezier(.76, 0, .24, 1); display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 4vw;
  padding: max(20px, env(safe-area-inset-top, 0px)) var(--gut) max(24px, env(safe-area-inset-bottom, 0px)); visibility: hidden; }
.menu.open { clip-path: inset(0); visibility: visible; }
.menu-head { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; height: 56px; }
.menu-head img { height: 40px; width: auto; display: block; }
.menu ul { list-style: none; margin: 0; padding: 0; align-self: center; }
.menu li { overflow: hidden; }
.menu li a { display: block; font-weight: 900; font-size: clamp(40px, 6.6vw, 104px); line-height: .98; letter-spacing: -.03em; text-transform: uppercase; translate: 0 110%; transition: translate .7s var(--ease), color .25s; }
.menu.open li a { translate: 0 0; transition-delay: calc(.25s + var(--i) * .08s), 0s; }
.menu li a:hover, .menu li a:focus-visible { color: var(--fuoco-vivo); outline: none; }
.win { align-self: center; justify-self: end; width: 100%; max-width: 520px; aspect-ratio: 16 / 10; overflow: hidden; border: 1px solid rgb(176 38 30 / .45); transition: aspect-ratio .5s var(--ease); }
.win img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.25); transition: opacity .36s .06s, scale .9s var(--ease); }
.menu-foot { grid-column: 1 / -1; display: flex; gap: 28px; flex-wrap: wrap; font-size: 15px; color: var(--cenere); opacity: 0; transition: opacity .4s; }
.menu.open .menu-foot { opacity: 1; transition-delay: .45s; }
.menu-foot a { color: var(--carta); }

/* ── sezioni dopo le serate ── */
body { transition: background-color .7s var(--ease); }
html.red body { background: var(--fuoco); }
.big { margin: 0; font-weight: 900; font-size: clamp(48px, 8.4vw, 150px); line-height: .9; letter-spacing: -.035em; text-transform: uppercase; text-wrap: balance; }
.rise { clip-path: inset(0 0 100% 0); translate: 0 .3em; transition: clip-path 1.1s var(--ease), translate 1.1s var(--ease); }
.rise.vis { clip-path: inset(0 0 -10% 0); translate: 0 0; }
.reveal { clip-path: inset(100% 0 0 0); transition: clip-path 1.2s var(--ease) var(--d, 0s); }
.reveal.vis { clip-path: inset(0); }
.words .wd { opacity: .18; transition: opacity .25s; }
.words .wd.lit { opacity: 1; }

/* titoli lettera per lettera: ogni riga è una maschera, le lettere salgono una dopo l'altra */
.big.split { clip-path: none; translate: none; }
.big .ln { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.big .wd2 { display: inline-block; white-space: nowrap; }
.big .ch { display: inline-block; transform: translateY(108%) rotate(4deg); transform-origin: 0 100%; transition: transform .95s var(--ease); transition-delay: calc(var(--c) * 24ms); }
.big.vis .ch { transform: none; }
/* anni a rullo */
.y.roll { clip-path: none !important; display: inline-flex; }
.y .dg { display: inline-block; height: .86em; overflow: hidden; line-height: .86; }
.y .dg i { display: block; font-style: normal; transform: translateY(0); transition: transform 1.5s cubic-bezier(.65, 0, .2, 1); transition-delay: calc(var(--k) * 90ms); }
.y .dg b { display: block; height: .86em; font-weight: inherit; }
.yr.vis .y .dg i { transform: translateY(calc(var(--d) * -.86em)); }
/* la linea rossa in cima alle sezioni si disegna */
.osp, .storia, .partner { border-top: 0 !important; }
.osp::before, .storia::before, .partner::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--fuoco); transform: scaleX(0); transform-origin: left; transition: transform 1.4s var(--ease); }
.osp.lined::before, .storia.lined::before, .partner.lined::before { transform: scaleX(1); }
.storia, .partner { position: relative; }
.cup-ph img { transform: translateY(var(--py, 0)) scale(1.16); }

/* Ospiti: lista di nomi interi + foto fissa rosso e nero che cambia */
.osp { position: relative; padding: 22svh var(--gut) 6svh; border-top: 2px solid var(--fuoco); }
.osp-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 5vw; margin-top: 8svh; }
.osp-stage { position: sticky; top: 14svh; height: 72svh; align-self: start; }
.osp-frame { position: relative; height: 100%; overflow: hidden; background: var(--fuoco); }
.osp-frame figure { position: absolute; inset: 0; margin: 0; background: var(--fuoco); clip-path: inset(100% 0 0 0); transition: clip-path .6s cubic-bezier(.76, 0, .24, 1); z-index: 0; }
.osp-frame figure.was { clip-path: inset(0); z-index: 1; transition: none; }
.osp-frame figure.on { clip-path: inset(0); z-index: 2; }
.osp-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; filter: grayscale(1) contrast(1.4) brightness(1.06); mix-blend-mode: multiply; transform: scale(1.14); transition: transform 1.6s var(--ease); }
.osp-frame figure.on img { transform: scale(1); }
.osp-frame::after { content: ""; position: absolute; inset: 0; z-index: 3; background: var(--fuoco-vivo); opacity: 0; pointer-events: none; }
.osp-frame.flash::after { opacity: .9; }
.osp-frame::before { content: ""; position: absolute; inset: 0; z-index: 4; pointer-events: none; background: repeating-linear-gradient(0deg, rgb(14 11 10 / .14) 0 1px, transparent 1px 3px); }
.osp-list { list-style: none; margin: 0; padding: 14svh 0 26svh; }
.osp-list li { min-height: 44svh; display: flex; flex-direction: column; justify-content: center; gap: 16px; border-top: 1px solid rgb(239 232 226 / .14); opacity: .2; transition: opacity .5s var(--ease); }
.osp-list li.on { opacity: 1; }
.nm2 { font-weight: 900; font-size: clamp(44px, 6vw, 108px); line-height: .9; letter-spacing: -.04em; text-transform: uppercase; text-wrap: balance; transition: translate .7s var(--ease); }
.osp-list li.on .nm2 { translate: 1.2vw 0; }
.when { font-weight: 700; font-size: clamp(15px, 1.2vw, 19px); color: var(--cenere); transition: color .5s; }
.osp-list li.on .when { color: var(--fuoco-vivo); }

/* Flames Cup */
.cup { position: relative; padding: 24svh var(--gut) 20svh; }
.cup-in { display: grid; gap: 9svh; }
.lede { margin: 0; max-width: 34ch; font-weight: 700; font-size: clamp(22px, 2.3vw, 38px); line-height: 1.22; letter-spacing: -.015em; }
.nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; border-top: 1px solid rgb(239 232 226 / .35); padding-top: 22px; }
.nums b { display: block; font-weight: 900; font-size: clamp(48px, 6vw, 110px); line-height: .9; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.nums span { display: block; margin-top: 10px; font-size: clamp(15px, 1.15vw, 18px); font-weight: 500; }
.cup-ph { display: grid; grid-template-columns: 1.1fr .8fr 1fr 1.3fr; gap: 14px; align-items: end; }
.cup-ph figure { margin: 0; overflow: hidden; background: var(--carbone); }
.cup-ph img { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.3); mix-blend-mode: luminosity; transition: filter .6s; }
.cup-ph figure:hover img { filter: none; }
.cup-ph .c1 { aspect-ratio: 4 / 3; } .cup-ph .c2 { aspect-ratio: 9 / 16; --d: .1s; } .cup-ph .c3 { aspect-ratio: 3 / 4; --d: .2s; } .cup-ph .c4 { aspect-ratio: 16 / 9; --d: .3s; }
.cup-ph figcaption { padding: 10px 0 0; font-size: 14px; font-weight: 700; background: var(--fuoco); }
html.red .cup-ph figure { background: transparent; }
.cup-acts { max-width: 760px; }
html.red .acts a::after, html.red .acts .w > svg path { background: var(--carta); stroke: var(--carta); }
.acts .ar { text-align: right; }

/* Storia */
.storia { padding: 22svh var(--gut) 16svh; border-top: 2px solid var(--fuoco); }
.years { list-style: none; margin: 12svh 0 0; padding: 0; }
.yr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 4vw; padding: 34px 0 40px; border-top: 1px solid rgb(239 232 226 / .2); align-items: start; }
.y { font-weight: 900; font-size: clamp(64px, 11vw, 200px); line-height: .82; letter-spacing: -.05em; font-variant-numeric: tabular-nums; clip-path: inset(0 0 100% 0); transition: clip-path 1s var(--ease); }
.yr.vis .y { clip-path: inset(0 0 -10% 0); }
.yr p { margin: 0 0 18px; max-width: 46ch; font-size: clamp(17px, 1.4vw, 22px); line-height: 1.45; }
.yr .poster { font-weight: 800; text-transform: uppercase; font-size: clamp(18px, 1.9vw, 30px); line-height: 1.15; letter-spacing: -.01em; max-width: 30ch; text-wrap: balance; }
.next-yr .y { color: transparent; -webkit-text-stroke: 2px var(--fuoco-vivo); }
.next-yr p { color: var(--fuoco-vivo); font-weight: 700; }

/* Partner */
.partner { padding: 18svh var(--gut) 20svh; border-top: 2px solid var(--fuoco); display: grid; gap: 8svh; }
.names { margin: 0; font-weight: 800; text-transform: uppercase; font-size: clamp(22px, 2.9vw, 50px); line-height: 1.12; letter-spacing: -.015em; text-wrap: balance; }
.partner-acts { max-width: 520px; }

/* Footer con torcia */
.foot { position: relative; overflow: hidden; background: var(--carbone); min-height: 88svh; display: flex; }
.torch { position: absolute; inset: 0; }
.torch .ffx { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.foot-in { position: relative; z-index: 2; width: 100%; display: grid; align-content: space-between; gap: 10svh; padding: 22svh var(--gut) max(28px, env(safe-area-inset-bottom, 0px)); background: linear-gradient(90deg, rgb(14 11 10 / .8), rgb(14 11 10 / .2) 70%), linear-gradient(0deg, rgb(14 11 10 / .85), transparent 45%); pointer-events: none; }
.foot-in > * { pointer-events: auto; min-width: 0; }
.foot-acts { max-width: 560px; }
.foot-base { display: grid; grid-template-columns: auto 1fr; gap: 14px 40px; align-items: center; border-top: 1px solid rgb(239 232 226 / .3); padding-top: 22px; }
.foot-base img { height: 40px; width: auto; }
.foot-base nav { display: flex; flex-wrap: wrap; gap: 8px 28px; justify-content: flex-end; font-weight: 700; font-size: 16px; }
.foot-base nav a:hover { color: var(--fuoco-vivo); }
.foot-base p { grid-column: 1 / -1; margin: 0; font-size: 14px; color: var(--cenere); }

@media (max-width: 760px) {
  :root { --strip: 58px; --head: 76px; }
  .brand img { height: 38px; }
  .line { top: 92px; font-size: clamp(30px, 9.6vw, 44px); }
  .hero-logo { width: 78vw; top: 54%; left: 50%; translate: -50% -50%; }
  .hero-acts { left: var(--gut); width: auto; }
  .rv h2 { top: 13svh; translate: 0 0; font-size: clamp(40px, 12vw, 60px); }
  .rv-side { left: var(--gut); right: var(--gut); top: auto; bottom: max(22px, env(safe-area-inset-bottom, 0px)); translate: 0 0; width: auto; gap: 14px; }
  .fill { font-size: 16px; }
  .menu { grid-template-columns: 1fr; }
  .win { display: none; }
  .osp-grid { grid-template-columns: 1fr; gap: 0; margin-top: 6svh; }
  .osp-stage { top: 72px; height: 40svh; z-index: 2; }
  .osp-list { padding-top: 6svh; }
  .osp-list li { min-height: 34svh; }
  .nm2 { font-size: 11.5vw; }
  .nums { grid-template-columns: 1fr 1fr; gap: 26px 18px; }
  .cup-ph { grid-template-columns: 1fr 1fr; }
  .yr { grid-template-columns: 1fr; gap: 14px; }
  .foot-base { grid-template-columns: 1fr; }
  .foot-base nav { justify-content: flex-start; }
  .acts a { flex-wrap: wrap; gap: 4px 16px; }
  .acts .ar { font-size: 14px; white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) { .in, .menu, .menu li a { transition: none !important; } .pan.flash::after { opacity: 0; } }

/* ── pagine interne: apertura con un video vero nel filtro Flames ── */
.pg-hero { position: relative; min-height: 94svh; display: grid; align-content: end; gap: 26px; padding: 20svh var(--gut) 11svh; overflow: hidden; }
.pg-win { position: absolute; inset: 0; z-index: 0; }
.pg-fx { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.pg-win::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(14 11 10 / .15) 30%, var(--carbone)); }
.pg-hero > .big, .pg-hero > .pg-lede { position: relative; z-index: 1; }
.pg-hero .big { font-size: clamp(64px, 13vw, 240px); }
.pg-lede { margin: 0; max-width: 40ch; font-weight: 700; font-size: clamp(19px, 1.8vw, 28px); line-height: 1.3; }
.inner .top { opacity: 1; }
.inner .cup, .inner .storia, .inner .partner { padding-top: 14svh; }

/* ── home: grandi rimandi alle altre pagine ── */
.go { position: relative; padding: 20svh var(--gut) 18svh; }
.go-list { list-style: none; margin: 10svh 0 0; padding: 0; }
.go-list a { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) auto; align-items: center; gap: 4vw; padding: 3.2svh 0; border-top: 1px solid rgb(239 232 226 / .2); overflow: hidden; }
.go-list li:last-child a { border-bottom: 1px solid rgb(239 232 226 / .2); }
.go-list a::before { content: ""; position: absolute; inset: 0; background: var(--fuoco); transform: scaleY(0); transform-origin: bottom; transition: transform .55s var(--ease); z-index: -1; }
.go-list a:hover::before, .go-list a:focus-visible::before { transform: scaleY(1); }
.go-list a:focus-visible { outline: none; }
.go-list b { font-weight: 900; font-size: clamp(40px, 6.4vw, 118px); line-height: .9; letter-spacing: -.04em; text-transform: uppercase; transition: translate .55s var(--ease); }
.go-list a:hover b { translate: 2vw 0; }
.go-list span { font-size: clamp(15px, 1.25vw, 19px); color: var(--cenere); transition: color .4s; }
.go-list a:hover span { color: var(--carta); }
.go-list i { font-style: normal; font-size: clamp(28px, 3vw, 48px); font-weight: 500; transition: transform .55s var(--ease); }
.go-list a:hover i { transform: rotate(45deg); }
.go-list li { position: relative; z-index: 0; }
@media (max-width: 760px) {
  .go-list a { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 16px; }
  .go-list span { grid-column: 1 / -1; grid-row: 2; }
  .pg-hero { min-height: 82svh; }
}

/* ── home: le porte (AccordionGallery + torcia). Un solo canvas disegna tutte le strisce nel filtro Flames ── */
.porte { position: relative; padding: 20svh 0 16svh; }
.porte > .big { padding: 0 var(--gut); }
.porte-st { position: relative; margin-top: 9svh; height: 84svh; }
.porte-fx { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }
.porte-list { list-style: none; margin: 0; padding: 0 var(--gut); position: relative; display: flex; gap: 10px; height: 100%; }
.porte-list li { flex: var(--fl, 1) 1 0; min-width: 0; transition: flex-grow .9s var(--ease); }
.porte-list a { position: relative; display: block; height: 100%; overflow: hidden; outline: none; }
.porte-list a::after { content: ""; position: absolute; inset: 0; border: 1px solid rgb(239 232 226 / .14); transition: border-color .5s; pointer-events: none; }
.porte-list li.on a::after { border-color: rgb(224 68 44 / .9); }
.porte-list b { position: absolute; left: 18px; bottom: 22px; writing-mode: vertical-rl; rotate: 180deg; font-weight: 900; font-size: clamp(28px, 3vw, 54px); line-height: .9; letter-spacing: -.03em; text-transform: uppercase; white-space: nowrap; text-shadow: 0 0 30px rgb(14 11 10 / .6); transition: font-size .9s var(--ease); }
.porte-list li.on b { font-size: clamp(40px, 4.6vw, 84px); }
.porte-list span { position: absolute; left: calc(18px + 1.25em); right: 64px; bottom: 26px; font-weight: 700; font-size: clamp(15px, 1.15vw, 19px); line-height: 1.3; opacity: 0; translate: 0 12px; transition: opacity .4s, translate .6s var(--ease); max-width: 26ch; }
.porte-list li.on span { opacity: 1; translate: 0 0; transition-delay: .25s; left: clamp(78px, 6vw, 112px); }
.porte-list i { position: absolute; right: 18px; top: 16px; font-style: normal; font-size: clamp(26px, 2.4vw, 40px); font-weight: 500; transition: transform .6s var(--ease), color .4s; }
.porte-list li.on i { transform: rotate(45deg); color: var(--fuoco-vivo); }
.porte-list a:focus-visible::after { border-color: var(--carta); border-width: 2px; }
@media (max-width: 760px) {
  .porte-st { height: auto; }
  .porte-list { flex-direction: column; gap: 8px; height: auto; }
  .porte-list li { flex: none; height: calc(13svh + var(--op, 0) * 26svh); transition: height .7s var(--ease); }
  .porte-list b { writing-mode: horizontal-tb; rotate: 0deg; left: 16px; bottom: 14px; font-size: 32px; }
  .porte-list li.on b { font-size: 40px; bottom: auto; top: 16px; }
  .porte-list li.on span { left: 16px; right: 60px; bottom: 16px; }
  .porte-list i { top: 12px; right: 14px; }
}

/* footer più corto dove la pagina ha già la sua chiusura */
.foot--short { min-height: 64svh; }
.foot--short .foot-in { padding-top: 14svh; gap: 7svh; }
.foot--short .big { font-size: clamp(40px, 6vw, 110px); }
/* l'header resta leggibile sopra i contenuti che scorrono */
.top::before { content: ""; position: absolute; inset: 0 0 -54px; z-index: -1; pointer-events: none; background: linear-gradient(180deg, rgb(14 11 10 / .96), rgb(14 11 10 / .9) 58%, transparent); opacity: 0; transition: opacity .4s; }
.scrolled .top::before { opacity: 1; }
.inner .top::before { opacity: .55; }   /* in cima alle pagine interne: "Menu" leggibile anche sulle foto chiare */
.inner.scrolled .top::before, .scrolled .inner .top::before { opacity: 1; }
html.red .top::before { background: linear-gradient(180deg, rgb(176 38 30 / .95), transparent); }
@media (max-width: 760px) { .menu { grid-template-columns: minmax(0, 1fr); overflow: hidden; } .menu li a { font-size: clamp(34px, 10vw, 54px); } }
@media (max-width: 760px) { .menu-foot { row-gap: 8px; column-gap: 22px; align-self: end; } }
/* frecce disegnate in SVG: i caratteri ↗ ↘ → su iPhone diventavano emoji blu */
.arr { display: inline-block; width: .82em; height: .82em; vertical-align: -.06em; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }

/* scroll morbido (Lenis) */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
/* grana da pellicola su tutto il sito, leggerissima */
body::after { content: ""; position: fixed; inset: -60%; z-index: 9; pointer-events: none; opacity: .055; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); animation: grana .9s steps(5) infinite; }
@keyframes grana { 0% { transform: translate(0, 0); } 20% { transform: translate(-7%, 4%); } 40% { transform: translate(5%, -6%); } 60% { transform: translate(-4%, -3%); } 80% { transform: translate(6%, 5%); } 100% { transform: translate(0, 0); } }
@media (prefers-reduced-motion: reduce) { body::after { animation: none; } }
/* braci della chiusura */
.torch .braci { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; z-index: 1; mix-blend-mode: screen; }
#menuB, .top .brand { transition: translate .35s cubic-bezier(.22, 1, .36, 1); }

/* ── home: il palco in 3D ── */
.palco { position: relative; height: 460svh; }
.palco-st { position: sticky; top: 0; height: 100svh; overflow: hidden; background: var(--carbone); }
.palco-fx { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.palco-k { position: absolute; z-index: 2; left: var(--gut); bottom: 12svh; margin: 0; font-weight: 900; font-size: clamp(30px, 3.6vw, 64px); line-height: .92; letter-spacing: -.03em; text-transform: uppercase;
  opacity: var(--k1, 0); translate: 0 calc((1 - var(--k1, 0)) * 22px); filter: blur(calc((1 - var(--k1, 0)) * 8px)); transition: opacity .6s var(--ease), translate .7s var(--ease), filter .6s var(--ease); }
.palco-st::after { content: ""; position: absolute; inset: 55% 0 0; pointer-events: none; background: linear-gradient(0deg, rgb(14 11 10 / .85), transparent); opacity: var(--k3, 0); transition: opacity .7s; }
.palco-txt { position: absolute; z-index: 2; left: 0; right: 0; bottom: 10svh; text-align: center; opacity: var(--k3, 0); translate: 0 calc((1 - var(--k3, 0)) * 20px); transition: opacity .7s var(--ease), translate .8s var(--ease); text-shadow: 0 0 40px rgb(14 11 10 / .8); }
.palco.nogl .palco-txt::before { content: "25.000"; display: block; font-weight: 900; font-size: clamp(96px, 21vw, 380px); line-height: .8; letter-spacing: -.06em; }
.palco.nogl .palco-txt { opacity: 1; bottom: 30svh; }
@media (max-width: 760px) { .palco { height: 400svh; } .palco-k { font-size: 8vw; bottom: 16svh; } .palco-txt { bottom: 12svh; } }
/* apertura della home: strisce rosse che si strappano (js/strappo.js) */
.strappo { position: fixed; inset: 0; z-index: 60; width: 100%; height: 100%; pointer-events: none; }

/* ── sponsor in home: fascia carta, loghi nei loro colori, tutti con la stessa area, scorrono in loop ── */
.spons { background: var(--carta); color: var(--carbone); padding: 13svh 0 12svh; overflow: hidden; }
.spons-h { display: flex; justify-content: space-between; align-items: end; gap: 24px; padding: 0 var(--gut); margin-bottom: 8svh; }
.spons-h .big { margin: 0; }
.spons-h a { font-weight: 700; font-size: 17px; display: inline-flex; gap: 10px; align-items: center; border-bottom: 1px solid currentColor; padding-bottom: 4px; white-space: nowrap; }
.spons-h a:hover { color: var(--fuoco); }
.spons-run { display: flex; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.spons-track { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: clamp(48px, 6vw, 96px); padding-right: clamp(48px, 6vw, 96px); flex: none; animation: spons 90s linear infinite; }
.spons-run:hover .spons-track { animation-play-state: paused; }
.spons-track li { flex: none; width: calc(var(--w) * 1px); display: grid; place-items: center; }
.spons-track img { width: 100%; height: auto; mix-blend-mode: multiply; }
@keyframes spons { to { transform: translateX(-100%); } }
@media (max-width: 760px) {
  .spons { padding: 12svh 0 10svh; }
  .spons-h { flex-direction: column; align-items: start; margin-bottom: 6svh; }
  .spons-track li { width: calc(var(--w) * .6px); }
  .spons-track { animation-duration: 70s; }
}
@media (prefers-reduced-motion: reduce) {
  .spons-track { animation: none; flex-wrap: wrap; justify-content: center; row-gap: 40px; padding: 0 var(--gut); width: 100%; }
  .spons-track[aria-hidden] { display: none; }
}

/* note legali e firma in fondo al footer */
.foot-legal { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 12px 32px; flex-wrap: wrap; font-size: 14px; }
.foot-base .foot-legal nav { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 6px 24px; font-weight: 600; font-size: 14px; }
.foot-base .foot-legal nav a { color: var(--cenere); }
.foot-base .foot-legal nav a:hover { color: var(--carta); }
.firma { display: inline-flex; align-items: center; gap: 8px; color: var(--cenere); padding: 8px 0; border-bottom: 1px solid rgb(239 232 226 / .25); transition: color .3s, border-color .3s; }
.firma b { color: var(--carta); font-weight: 700; }
.firma .arr { width: 12px; height: 12px; }
.firma:hover { color: var(--carta); border-color: var(--fuoco-vivo); }
.firma:hover b { color: var(--fuoco-vivo); }

/* banner cookie iubenda nei colori del sito (stessi pesi per Accetta e Rifiuta, come chiede il Garante) */
html body #iubenda-cs-banner .iubenda-cs-container, html body #iubenda-cs-banner .iubenda-cs-content { background-color: #16110f !important; color: var(--carta) !important; font-family: var(--f) !important; border-radius: 0 !important; }
html body #iubenda-cs-banner .iubenda-cs-container { box-shadow: 0 0 0 1px rgb(239 232 226 / .14), 0 30px 80px rgb(0 0 0 / .6) !important; }
html body #iubenda-cs-banner .iubenda-cs-opt-group button.iubenda-cs-accept-btn, html body #iubenda-cs-banner .iubenda-cs-opt-group button.iubenda-cs-reject-btn { background-color: var(--fuoco) !important; color: var(--carta) !important; border-radius: 0 !important; font-family: var(--f) !important; font-weight: 800 !important; }
html body #iubenda-cs-banner .iubenda-cs-opt-group button.iubenda-cs-accept-btn:hover, html body #iubenda-cs-banner .iubenda-cs-opt-group button.iubenda-cs-reject-btn:hover { background-color: var(--fuoco-vivo) !important; }
html body #iubenda-cs-banner .iubenda-cs-opt-group button.iubenda-cs-customize-btn { background-color: #2e2623 !important; color: var(--carta) !important; border-radius: 0 !important; font-family: var(--f) !important; }
/* le preferenze si riaprono dal link "Preferenze cookie" nel footer: il bottone fluttuante coprirebbe la firma */
html body button.iubenda-tp-btn.iubenda-cs-preferences-link[data-tp-float][data-tp-icon] { display: none !important; }

/* ── home: "In breve", i fatti in tre frasi ── */
.breve { display: grid; grid-template-columns: minmax(0, .5fr) minmax(0, 1fr); gap: 5vw; padding: 16svh var(--gut); border-top: 1px solid rgb(239 232 226 / .14); }
.breve-t { margin: 0; font-weight: 900; font-size: clamp(34px, 4vw, 72px); line-height: .9; letter-spacing: -.035em; text-transform: uppercase; }
.breve-txt { max-width: 62ch; }
.breve-txt p { margin: 0 0 1.1em; font-weight: 600; font-size: clamp(18px, 1.5vw, 23px); line-height: 1.45; color: var(--cenere); }
.breve-txt p:first-child { color: var(--carta); }
.breve-txt p:last-child { margin: 0; color: var(--fuoco-vivo); font-weight: 800; }
@media (max-width: 760px) { .breve { grid-template-columns: 1fr; gap: 4svh; padding: 11svh var(--gut); } }