/* ==========================================================
   LA CAPANNINA SUSHI — identità visiva
   Palette ricavata dalla sala (video, foto, logo):
   Nero Darsena      #070A12  i neri della sala con il riflesso blu dei LED
   Notte di Versilia #0D1322  superfici, pannelli
   Bordeaux Poltrona #5B1721  le poltrone in velluto
   Velluto Profondo  #2E0810  le pieghe del velluto
   Velluto Lume      #9A3245  la luce che scivola sul velluto
   LED Marco Polo    #A9C4F0  i fili di luce e le strisce LED
   Porcellana        #E6ECF5  testo, il bianco freddo dei LED
   Ambra Foglia      #D9A55B  il bosco dorato (solo dettagli)
   Font: Capannina Neon (disegnato su misura), Jost, Cormorant Garamond corsivo
   ========================================================== */
@font-face { font-family: 'Capannina Neon'; src: url('../assets/fonts/CapanninaNeon-Light.woff') format('woff'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Capannina Neon'; src: url('../assets/fonts/CapanninaNeon-Regular.woff') format('woff'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Capannina Neon'; src: url('../assets/fonts/CapanninaNeon-Bold.woff') format('woff'); font-weight: 600; font-display: swap; }

@font-face { font-family: 'Jost'; src: url('../assets/fonts/jost-latin-300-normal.woff2') format('woff2'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Jost'; src: url('../assets/fonts/jost-latin-400-normal.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Jost'; src: url('../assets/fonts/jost-latin-500-normal.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Cormorant Garamond'; src: url('../assets/fonts/cormorant-garamond-latin-300-italic.woff2') format('woff2'); font-weight: 300; font-style: italic; font-display: swap; }
@font-face { font-family: 'Cormorant Garamond'; src: url('../assets/fonts/cormorant-garamond-latin-400-italic.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; }

:root {
  --nero: #070a12;
  --notte: #0d1322;
  --notte-2: #121a2e;
  --bordeaux: #5b1721;
  --velluto: #2e0810;
  --lume: #9a3245;
  --led: #a9c4f0;
  --led-glow: rgba(124, 164, 255, .55);
  --porcellana: #e6ecf5;
  --nebbia: #8e9ab3;
  --nebbia-faint: rgba(169, 196, 240, .16);
  --ambra: #d9a55b;

  --f-neon: 'Capannina Neon', 'Jost', sans-serif;
  --f-body: 'Jost', system-ui, sans-serif;
  --f-serif: 'Cormorant Garamond', 'Times New Roman', serif;

  --gutter: clamp(16px, 4vw, 64px);
  --ease: cubic-bezier(.7, 0, .2, 1);
  --top-h: 98px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body { background: var(--nero); color: var(--porcellana); font-family: var(--f-body); font-weight: 300; font-size: 17px; line-height: 1.65; overflow-x: clip; -webkit-font-smoothing: antialiased; }
body.is-loading { overflow: hidden; }
body::after { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 90; opacity: .07; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; color: inherit; background: none; border: 0; }
button { cursor: pointer; }
:focus-visible { outline: 1px solid var(--led); outline-offset: 5px; }
::selection { background: var(--bordeaux); color: var(--porcellana); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* l'insegna: testo nel font su misura con alone LED */
.neon {
  font-family: var(--f-neon); font-weight: 300; text-transform: uppercase; letter-spacing: .06em; line-height: 1;
  color: var(--porcellana);
  text-shadow: 0 0 4px rgba(214, 228, 255, .7), 0 0 18px var(--led-glow), 0 0 48px rgba(90, 130, 255, .28);
}
.neon { overflow-wrap: normal; word-break: keep-all; hyphens: none; }
.neon .word { display: inline-block; white-space: nowrap; }
.neon .ch { display: inline-block; }
.hero__l1 .ch, .hero__l2, .hero__eyebrow, .hero__hint { filter: opacity(var(--o, 1)); }
.label { font-size: 12px; font-weight: 500; letter-spacing: .38em; text-transform: uppercase; color: var(--led); }

/* ---------- bottoni ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 28px; border-radius: 999px; font-family: var(--f-neon); font-weight: 400; font-size: 13px; letter-spacing: .22em; text-transform: uppercase; white-space: nowrap; position: relative; isolation: isolate; overflow: hidden; transition: color .5s var(--ease), box-shadow .5s var(--ease), border-color .5s; }
.btn::before { content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; transform: translateY(101%); transition: transform .6s var(--ease); }
.btn:hover::before { transform: none; }
.btn--led { background: var(--bordeaux); color: var(--porcellana); box-shadow: inset 0 0 0 1px rgba(169,196,240,.35), 0 0 24px rgba(154,50,69,.45); }
.btn--led::before { background: var(--led); }
.btn--led:hover { color: var(--nero); box-shadow: 0 0 30px var(--led-glow); }
.btn--line { box-shadow: inset 0 0 0 1px rgba(169,196,240,.4); }
.btn--line::before { background: var(--porcellana); }
.btn--line:hover { color: var(--nero); }
.btn--big { height: 62px; padding: 0 38px; font-size: 14px; }

/* ---------- loader ---------- */
.loader { position: fixed; inset: 0; z-index: 200; background: var(--nero); display: grid; place-content: center; justify-items: center; gap: 22px; }
.loader__sign { font-size: clamp(36px, 7vw, 110px); }
.loader__sign .ch { opacity: .06; text-shadow: none; }
.loader__sub { font-size: 12px; letter-spacing: .5em; text-transform: uppercase; color: var(--nebbia); opacity: 0; }

/* ---------- cursore ---------- */
.cursor { position: fixed; inset: 0; pointer-events: none; z-index: 150; }
.cursor__dot, .cursor__ring { position: absolute; top: 0; left: 0; border-radius: 50%; will-change: transform; }
.cursor__dot { width: 6px; height: 6px; margin: -3px; background: var(--led); box-shadow: 0 0 10px var(--led); }
.cursor__ring { width: 40px; height: 40px; margin: -20px; border: 1px solid rgba(169,196,240,.55); transition: width .4s var(--ease), height .4s var(--ease), margin .4s var(--ease), background .4s; }
.cursor.is-hover .cursor__ring { width: 78px; height: 78px; margin: -39px; background: rgba(169,196,240,.1); }
@media (hover: none), (pointer: coarse) { .cursor { display: none; } }
@media (hover: hover) and (pointer: fine) { html.js-cursor body, html.js-cursor a, html.js-cursor button { cursor: none; } html.js-cursor input { cursor: text; } }

/* ---------- top ---------- */
.top { position: fixed; top: 0; left: 0; right: 0; z-index: 100; transition: transform .6s var(--ease); }
.top.is-hidden { transform: translateY(-32px); }
.ticker { height: 32px; overflow: hidden; display: flex; align-items: center; background: var(--velluto); border-bottom: 1px solid rgba(169,196,240,.18); }
.ticker__track { display: flex; align-items: center; gap: 30px; white-space: nowrap; padding-left: 30px; animation: marquee 50s linear infinite; }
.ticker__track span { font-family: var(--f-neon); font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--porcellana); }
.ticker__track i { width: 4px; height: 4px; border-radius: 50%; background: var(--led); box-shadow: 0 0 8px var(--led); }
@keyframes marquee { to { transform: translateX(-50%); } }
.nav { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 66px; padding: 0 var(--gutter); background: linear-gradient(to bottom, rgba(7,10,18,.85), rgba(7,10,18,0)); }
.nav__menu { justify-self: start; display: inline-flex; align-items: center; gap: 12px; font-family: var(--f-neon); font-size: 13px; letter-spacing: .3em; text-transform: uppercase; }
.nav__burger { width: 42px; height: 42px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(169,196,240,.35); display: grid; place-content: center; gap: 5px; transition: box-shadow .4s; }
.nav__burger i { display: block; width: 15px; height: 1px; background: var(--porcellana); transition: transform .5s var(--ease); }
.nav__menu:hover .nav__burger { box-shadow: inset 0 0 0 1px var(--led), 0 0 16px var(--led-glow); }
.nav__menu[aria-expanded="true"] .nav__burger i:first-child { transform: translateY(3px) rotate(45deg); }
.nav__menu[aria-expanded="true"] .nav__burger i:last-child { transform: translateY(-3px) rotate(-45deg); }
.nav__brand img { height: 52px; width: auto; }
.nav__right { justify-self: end; display: flex; align-items: center; gap: 26px; }
.nav__link { font-family: var(--f-neon); font-size: 13px; letter-spacing: .26em; text-transform: uppercase; transition: text-shadow .4s; }
.nav__link:hover { text-shadow: 0 0 14px var(--led-glow); }
.nav__book { height: 42px; padding: 0 22px; font-size: 12px; }
@media (max-width: 700px) { .nav__label, .nav__link { display: none; } .nav__brand img { height: 42px; } .nav__book { padding: 0 16px; } }

/* ---------- overlay ---------- */
.overlay { position: fixed; inset: 0; z-index: 99; visibility: hidden; }
.overlay__bg { position: absolute; inset: 0; clip-path: inset(0 0 100% 0);
  background: repeating-linear-gradient(90deg, rgba(0,0,0,.35) 0, rgba(0,0,0,0) 2.2%, rgba(255,255,255,.05) 4.4%, rgba(0,0,0,0) 6.6%, rgba(0,0,0,.35) 8.8%), radial-gradient(80% 70% at 70% 30%, #6a1a29, var(--velluto) 75%); }
.overlay__inner { position: relative; height: 100%; padding: calc(var(--top-h) + 3vh) var(--gutter) 30px; display: grid; grid-template-columns: 1.3fr 1fr; grid-template-rows: 1fr auto; gap: 24px; }
.overlay__links { list-style: none; align-self: center; }
.overlay__links li { overflow: hidden; }
.overlay__links a { display: inline-block; font-family: var(--f-neon); font-weight: 300; text-transform: uppercase; letter-spacing: .04em; font-size: clamp(38px, 6.4vw, 96px); line-height: 1.14; transition: text-shadow .4s, color .4s; }
.overlay__links a:hover { color: #fff; text-shadow: 0 0 6px #fff, 0 0 26px var(--led-glow), 0 0 60px rgba(90,130,255,.4); }
.overlay__figure { align-self: center; justify-self: end; width: min(100%, 400px); aspect-ratio: 3/4; max-height: 64vh; overflow: hidden; border-radius: 999px 999px 0 0; opacity: 0; box-shadow: 0 0 0 1px rgba(169,196,240,.4), 0 0 40px rgba(124,164,255,.25); }
.overlay__figure img { width: 100%; height: 100%; object-fit: cover; }
.overlay__foot { grid-column: 1 / -1; display: flex; justify-content: space-between; font-family: var(--f-neon); font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--nebbia); opacity: 0; }
@media (max-width: 800px) { .overlay__inner { grid-template-columns: 1fr; } .overlay__figure { display: none; } }

/* ============ HERO ============ */
.hero { height: 600vh; position: relative; }
.hero__stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; isolation: isolate; background: var(--nero); }
.hero__light { position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(40% 45% at 50% -8%, rgba(124,164,255,.22), transparent 70%),
    radial-gradient(55% 50% at 50% 60%, rgba(124,164,255,.06), transparent 70%),
    radial-gradient(45% 45% at 0% 105%, rgba(91,23,33,.75), transparent 70%),
    radial-gradient(45% 45% at 100% 105%, rgba(91,23,33,.55), transparent 70%); }
.hero__threads { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }

.field { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.fly { position: absolute; left: var(--x); top: var(--y); width: var(--w); will-change: transform, opacity; }
.fly__m { will-change: transform; }
.fly__img { width: 100%; animation: bob var(--bob, 7s) ease-in-out infinite alternate; animation-delay: var(--delay, 0s); filter: brightness(.78) saturate(1.05); }
.fly--sharp .fly__img { filter: drop-shadow(0 30px 40px rgba(0,0,0,.65)) drop-shadow(0 0 30px rgba(124,164,255,.18)); }
@keyframes bob { from { transform: translate3d(0,-4%,0) rotate(calc(var(--r, 6deg) * -1)); } to { transform: translate3d(0,5%,0) rotate(var(--r, 6deg)); } }

.hero__title { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; font-weight: 300; pointer-events: none; padding-top: 40px; }
.hero__eyebrow { font-size: 12px; font-weight: 500; letter-spacing: .5em; text-transform: uppercase; color: var(--led); margin-bottom: 4vh; }
.hero__l1 { font-size: clamp(42px, 9.4vw, 176px); letter-spacing: .05em; }
.hero__l2 { margin-top: 2.6vh; font-size: clamp(26px, 4.2vw, 76px); letter-spacing: .62em; padding-left: .62em; color: var(--led); }

.star { position: absolute; z-index: 6; left: 50%; bottom: 3vh; height: 74vh; aspect-ratio: 607 / 906; translate: -50% 0; transform: translateY(150%); will-change: transform; pointer-events: none; }
.star img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 40px 60px rgba(0,0,0,.75)) drop-shadow(0 0 40px rgba(124,164,255,.15)); }
.star__drop { position: absolute; left: 59.5%; top: 96.5%; width: 2.6%; aspect-ratio: 3 / 4; margin-left: -1.3%; border-radius: 50% 50% 50% 50% / 62% 62% 40% 40%; background: radial-gradient(circle at 35% 30%, #ffd9a8 0 10%, #f07a22 38%, #9b3606 100%); opacity: 0; }
.claim { position: absolute; z-index: 7; top: 50%; translate: 0 -50%; display: block; max-width: 30vw; font-size: clamp(26px, 4vw, 70px); line-height: 1.12; opacity: 0; pointer-events: none; }
.claim--l { left: var(--gutter); }
.claim--r { right: var(--gutter); text-align: right; color: var(--led); }

.portal { position: absolute; inset: 0; z-index: 4; overflow: hidden; background: #000; clip-path: inset(50% 50% 50% 50% round 999px 999px 0 0); will-change: clip-path; }
.portal__video { width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); }
.portal__shade { position: absolute; inset: 0; background: radial-gradient(70% 70% at 50% 50%, rgba(7,10,18,.25), rgba(7,10,18,.8)), linear-gradient(to top, rgba(46,8,16,.6), transparent 45%); }
.portal__spot { position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen; opacity: 0; background: radial-gradient(260px 260px at var(--mx, 50%) var(--my, 50%), rgba(169,196,240,.28), transparent 70%); transition: opacity .6s; }
.portal.is-full .portal__spot { opacity: 1; }
.lusso { position: absolute; inset: 0; z-index: 8; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; font-weight: 300; pointer-events: none; perspective: 900px; }
.lusso__a { font-size: clamp(48px, 10vw, 190px); letter-spacing: .08em; }
.lusso__a .ch { opacity: 0; }
.lusso__b { display: block; margin-top: 1.5vh; font-family: var(--f-serif); font-style: italic; font-weight: 300; font-size: clamp(36px, 6.4vw, 120px); line-height: 1; color: var(--porcellana); clip-path: inset(0 100% 0 0); text-shadow: 0 2px 30px rgba(0,0,0,.6); }

.hero__hint { position: absolute; z-index: 9; left: 50%; bottom: 2.5vh; transform: translateX(-50%); display: grid; justify-items: center; gap: 10px; font-family: var(--f-neon); font-size: 11px; letter-spacing: .44em; text-transform: uppercase; color: var(--nebbia); }
.hero__hint i { width: 1px; height: 44px; background: linear-gradient(var(--led), transparent); box-shadow: 0 0 8px var(--led); animation: drip 2.2s var(--ease) infinite; transform-origin: top; }
@keyframes drip { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); transform-origin: top; } 51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }

@media (max-width: 760px) {
  .hero__l1 { font-size: 10.5vw; }
  .hero__l2 { font-size: 7vw; }
  .claim { top: auto; bottom: 7vh; translate: none; max-width: 46vw; font-size: 24px; }
  .star { height: 56vh; bottom: 15vh; }
  .lusso__a { font-size: 13vw; }
  .lusso__b { font-size: 11vw; }
}

/* ============ LA NOTTE ============ */
.night { position: relative; padding: 24vh var(--gutter) 20vh; background: linear-gradient(var(--nero), var(--notte) 45%, var(--nero)); overflow: hidden; }
.night__title { text-align: center; font-weight: 300; display: grid; justify-items: center; gap: 2vh; }
.night__title .neon { font-size: clamp(60px, 13vw, 250px); letter-spacing: .05em; }
.night__title em { font-family: var(--f-serif); font-weight: 300; font-size: clamp(30px, 4.4vw, 84px); line-height: 1; color: var(--led); }
.night__body { max-width: 1180px; margin: 14vh auto 0; display: grid; grid-template-columns: 1fr 1.2fr; gap: 6vw; align-items: start; }
.night__lead { font-family: var(--f-serif); font-style: italic; font-weight: 300; font-size: clamp(30px, 3.2vw, 54px); line-height: 1.12; color: var(--porcellana); }
.night__body p:not(.night__lead) { color: var(--nebbia); font-size: 18px; line-height: 1.8; }
.reveal-grid { max-width: 1360px; margin: 16vh auto 0; display: grid; grid-template-columns: repeat(12, 1fr); column-gap: clamp(14px, 2vw, 30px); row-gap: 0; }
.rv { position: relative; overflow: hidden; background: var(--notte-2); box-shadow: 0 0 0 1px rgba(169,196,240,.2); }
.rv > img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease); }
.rv:hover > img, .rv:hover .rv__slice img { transform: scale(1.04); }
.rv--a { grid-column: 1 / 8; aspect-ratio: 4 / 3; }
.rv--b { grid-column: 8 / 13; aspect-ratio: 3 / 4; margin-top: 14vh; }
.rv--c { grid-column: 2 / 6; aspect-ratio: 3 / 4; margin-top: -12vh; }
.rv--d { grid-column: 6 / 13; aspect-ratio: 4 / 3; margin-top: 8vh; }
/* rivelazione a fili di luce: ogni foto scende in strisce verticali */
.rv.is-sliced > img { visibility: hidden; }
.rv__slices { position: absolute; inset: 0; display: flex; }
.rv__slice { position: relative; flex: 1; height: 100%; overflow: hidden; }
.rv__slice img { position: absolute; top: 0; height: 100%; object-fit: cover; max-width: none; transition: transform 1.4s var(--ease); }
.rv__slice::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--led); box-shadow: 0 0 12px 2px var(--led-glow); opacity: var(--glow, 0); }
.rv::before { content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(105deg, transparent 35%, rgba(214,228,255,.22) 50%, transparent 65%); transform: translateX(-120%); }
.rv.is-lit::before { transition: transform 1.6s var(--ease); transform: translateX(120%); }
@media (max-width: 760px) {
  .night__body { grid-template-columns: 1fr; gap: 3vh; }
  .reveal-grid { row-gap: 14px; }
  .rv--a, .rv--d { grid-column: 1 / -1; margin-top: 0; }
  .rv--b { grid-column: 1 / 7; margin-top: 0; }
  .rv--c { grid-column: 7 / 13; margin-top: 8vh; }
}

/* ============ CTA MENÙ: velluto a canali come le poltrone ============ */
.cta-menu { position: relative; height: 82vh; min-height: 480px; display: grid; place-items: center; overflow: hidden; isolation: isolate; }
.cta-menu__velvet { position: absolute; inset: -10% 0; z-index: -1;
  background:
    radial-gradient(60% 70% at var(--vx, 50%) 45%, rgba(255,160,180,.16), transparent 60%),
    repeating-linear-gradient(90deg, #1c0409 0, #3d0b16 1.2%, #6d1b2c 3.2%, #872538 4%, #6d1b2c 4.8%, #3d0b16 6.8%, #1c0409 8%),
    var(--velluto); }
.cta-menu__velvet::after { content: ''; position: absolute; inset: 0; background: radial-gradient(75% 85% at 50% 50%, transparent 30%, rgba(7,10,18,.9)); }
.cta-menu__link { position: relative; display: grid; justify-items: center; gap: 30px; padding: 30px; }
.cta-menu__text { text-align: center; line-height: 1.1; font-size: clamp(40px, 8.4vw, 156px); letter-spacing: .07em; transition: text-shadow .5s, color .5s; }
.cta-menu__link:hover .cta-menu__text { color: #fff; text-shadow: 0 0 6px #fff, 0 0 30px var(--led-glow), 0 0 80px rgba(90,130,255,.5); }
.cta-menu__arrow { position: relative; width: 120px; height: 1px; background: var(--led); box-shadow: 0 0 10px var(--led); transition: width .6s var(--ease); }
.cta-menu__arrow::after { content: ''; position: absolute; right: 0; top: -6px; width: 12px; height: 12px; border-right: 1px solid var(--led); border-bottom: 1px solid var(--led); transform: rotate(-45deg); }
.cta-menu__link:hover .cta-menu__arrow { width: 220px; }

/* ============ SIGNATURE ============ */
.coll { position: relative; }
.coll__pin { position: relative; height: 100vh; height: 100svh; overflow: hidden; }
.coll__track { display: flex; height: 100%; width: max-content; }
.slide { position: relative; flex: none; width: 78vw; height: 100%; background: var(--bg, var(--nero)); overflow: hidden; display: grid; place-items: center; }
.slide + .slide { box-shadow: -1px 0 0 rgba(169,196,240,.18); }
.slide::before { content: ''; position: absolute; inset: 0; background: radial-gradient(42% 48% at 50% 48%, rgba(169,196,240,.14), transparent 70%); pointer-events: none; }
.slide--intro { width: 54vw; place-items: start; align-content: center; padding: 0 6vw; gap: 30px; background: var(--nero); }
.slide--intro::before { display: none; }
.slide__intro { font-size: clamp(54px, 7.4vw, 136px); }
.slide--intro p { max-width: 22em; font-family: var(--f-serif); font-style: italic; font-size: clamp(22px, 2vw, 32px); line-height: 1.3; color: var(--nebbia); }
.slide__arrow { width: 90px; height: 1px; background: var(--led); box-shadow: 0 0 10px var(--led); animation: nudge 1.8s var(--ease) infinite; }
@keyframes nudge { 50% { transform: translateX(16px); } }
.slide__word { position: absolute; left: -50%; right: -50%; top: 50%; margin-top: -.55em; text-align: center; font-family: var(--f-neon); font-weight: 300; text-transform: uppercase; font-size: 21vw; line-height: 1.1; letter-spacing: .02em; white-space: nowrap; color: transparent; -webkit-text-stroke: 1.2px rgba(169,196,240,.32); pointer-events: none; }
.slide__img { position: relative; height: 56vh; width: auto; max-width: 62vw; object-fit: contain; filter: drop-shadow(0 50px 50px rgba(0,0,0,.6)); will-change: transform; }
.slide__img--wide { height: 50vh; }
.slide__img--small { height: 46vh; }
.slide__img--tall { height: 70vh; }
.slide__info { position: absolute; left: 4vw; bottom: 8vh; max-width: 26em; }
.slide__code { font-family: var(--f-neon); font-size: 14px; letter-spacing: .3em; color: var(--led); text-shadow: 0 0 12px var(--led-glow); }
.slide__info h3 { margin-top: 12px; font-family: var(--f-neon); font-weight: 300; text-transform: uppercase; font-size: clamp(28px, 3vw, 54px); line-height: 1.05; letter-spacing: .05em; }
.slide__info p { margin-top: 10px; font-family: var(--f-serif); font-style: italic; font-size: 21px; color: rgba(230,236,245,.8); }
.coll__bar { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 3vh; height: 1px; background: rgba(169,196,240,.18); }
.coll__bar i { display: block; height: 100%; background: var(--led); box-shadow: 0 0 10px var(--led); transform-origin: left; transform: scaleX(0); }
@media (max-width: 760px) {
  .slide, .slide--intro { width: 100vw; }
  .slide__img { height: 44vh; max-width: 86vw; }
  .slide__img--tall { height: 54vh; }
  .slide__word { font-size: 34vw; }
}

/* ============ REEL ============ */
.reels { position: relative; padding: 10vh 0; background: var(--nero); overflow: hidden; }
.band { overflow: hidden; padding: 14px 0; }
.band__track { display: flex; align-items: center; gap: 34px; width: max-content; animation: marquee 34s linear infinite; }
.band--rev .band__track { animation-direction: reverse; }
.band__track span { font-size: clamp(30px, 3.6vw, 58px); letter-spacing: .08em; }
.band__track img { height: clamp(44px, 5vw, 76px); width: auto; }
.reels__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(12px, 2vw, 32px); padding: 7vh var(--gutter); }
.reel { position: relative; aspect-ratio: 9 / 16; max-height: 82vh; overflow: hidden; border-radius: 14px; background: var(--notte); box-shadow: 0 0 0 1px rgba(169,196,240,.25), 0 30px 60px rgba(0,0,0,.5); transition: box-shadow .6s var(--ease); justify-self: center; width: 100%; }
.reel video { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.reel:hover { box-shadow: 0 0 0 1px var(--led), 0 0 50px rgba(124,164,255,.35); }
.reel:hover video { transform: scale(1.04); }
@media (max-width: 760px) {
  .reels__grid { grid-template-columns: 78vw 78vw 78vw; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .reel { scroll-snap-align: center; }
}

/* ============ LA CARTA ============ */
.carta { position: relative; padding: 20vh var(--gutter) 14vh; background: linear-gradient(var(--nero), var(--notte) 18%, var(--notte) 82%, var(--nero)); }
.carta__head { text-align: center; display: grid; justify-items: center; gap: 22px; }
.carta__title { font-size: clamp(56px, 10vw, 190px); }
.carta__lead { font-family: var(--f-serif); font-style: italic; font-size: clamp(22px, 2.2vw, 34px); color: var(--nebbia); max-width: 26em; }
.carta__formula { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 0; margin-top: 3vh; }
.carta__formula li { display: grid; justify-items: center; padding: 6px clamp(18px, 3vw, 46px); }
.carta__formula li + li { box-shadow: -1px 0 0 rgba(169,196,240,.25); }
.carta__formula span { font-family: var(--f-neon); font-size: 14px; letter-spacing: .3em; text-transform: uppercase; }
.carta__formula small { font-family: var(--f-serif); font-style: italic; font-size: 17px; color: var(--nebbia); }
.carta__formula b { margin-top: 4px; font-family: var(--f-neon); font-weight: 400; font-size: 26px; letter-spacing: .06em; color: var(--led); text-shadow: 0 0 14px var(--led-glow); }

.carta__bar { position: sticky; top: 66px; z-index: 20; margin: 10vh calc(var(--gutter) * -1) 0; padding: 14px var(--gutter); display: flex; gap: 20px; align-items: center; background: rgba(13,19,34,.86); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 1px 0 rgba(169,196,240,.16), 0 -1px 0 rgba(169,196,240,.16); }
.top:not(.is-hidden) ~ main .carta__bar { top: 98px; }
.carta__bar { transition: top .6s var(--ease); }
.carta__tabs { flex: 1; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 92%, transparent); mask-image: linear-gradient(90deg, #000 92%, transparent); }
.carta__tabs::-webkit-scrollbar { display: none; }
.carta__tab { flex: none; height: 40px; padding: 0 18px; border-radius: 999px; font-family: var(--f-neon); font-size: 12.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--nebbia); transition: color .3s, background .4s, box-shadow .4s; }
.carta__tab:hover { color: var(--porcellana); }
.carta__tab[aria-selected="true"] { color: var(--porcellana); background: var(--bordeaux); box-shadow: inset 0 0 0 1px rgba(169,196,240,.35), 0 0 22px rgba(154,50,69,.5); }
.carta__search { flex: none; width: min(300px, 32vw); }
.carta__search input { width: 100%; height: 40px; padding: 0 18px; border-radius: 999px; box-shadow: inset 0 0 0 1px rgba(169,196,240,.3); font-size: 15px; color: var(--porcellana); }
.carta__search input::placeholder { color: var(--nebbia); }
.carta__search input:focus { outline: none; box-shadow: inset 0 0 0 1px var(--led), 0 0 18px var(--led-glow); }

.carta__panels { max-width: 1240px; margin: 8vh auto 0; min-height: 60vh; }
.carta__sec + .carta__sec { margin-top: 9vh; }
.carta__sec[hidden], .dish[hidden] { display: none; }
.carta__cat { display: flex; align-items: baseline; gap: 22px; flex-wrap: wrap; padding-bottom: 26px; box-shadow: 0 1px 0 rgba(169,196,240,.2); }
.carta__catname { font-family: var(--f-neon); font-weight: 300; text-transform: uppercase; font-size: clamp(34px, 4.4vw, 72px); letter-spacing: .06em; line-height: 1; text-shadow: 0 0 18px var(--led-glow); }
.carta__catnote { font-family: var(--f-serif); font-style: italic; font-size: 22px; color: var(--nebbia); }
.carta__list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; column-gap: 6vw; }
.dish { display: grid; grid-template-columns: 58px 1fr auto; gap: 4px 18px; align-items: baseline; padding: 22px 0; box-shadow: 0 1px 0 rgba(169,196,240,.09); transition: box-shadow .4s; }
.dish:hover { box-shadow: 0 1px 0 var(--led), 0 8px 20px -12px var(--led-glow); }
.dish__code { font-family: var(--f-neon); font-size: 14px; letter-spacing: .12em; color: var(--led); }
.dish__name { font-family: var(--f-neon); font-weight: 400; font-size: 17px; letter-spacing: .1em; text-transform: uppercase; line-height: 1.3; }
.dish__pz { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--nebbia); white-space: nowrap; }
.dish__desc { grid-column: 2 / -1; font-family: var(--f-serif); font-style: italic; font-size: 18px; line-height: 1.35; color: var(--nebbia); }
.dish__cat { grid-column: 2 / -1; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--lume); }
.carta__empty { padding: 8vh 0; text-align: center; font-family: var(--f-serif); font-style: italic; font-size: 24px; color: var(--nebbia); }
.carta__foot { max-width: 1240px; margin: 8vh auto 0; text-align: center; font-size: 13px; letter-spacing: .14em; color: var(--nebbia); }
@media (max-width: 800px) {
  .carta__bar { flex-direction: column; align-items: stretch; gap: 10px; }
  .carta__search { width: 100%; }
  .carta__list { grid-template-columns: 1fr; }
  .carta__formula li + li { box-shadow: none; }
}

/* ============ SOCIAL ============ */
.social { position: relative; padding: 18vh var(--gutter) 16vh; overflow: hidden; isolation: isolate; }
.social__velvet { position: absolute; inset: 0; z-index: -1; opacity: .5;
  background: repeating-linear-gradient(90deg, #12030a 0, #2a0710 1.2%, #4a1020 3.2%, #5e1729 4%, #4a1020 4.8%, #2a0710 6.8%, #12030a 8%); }
.social__velvet::after { content: ''; position: absolute; inset: 0; background: linear-gradient(var(--nero), rgba(7,10,18,.55) 30%, rgba(7,10,18,.55) 70%, var(--nero)); }
.social__head { display: grid; justify-items: center; gap: 4vh; text-align: center; }
.social__head .neon { font-size: clamp(54px, 10vw, 200px); letter-spacing: .05em; }
.social__grid { max-width: 1500px; margin: 9vh auto 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(10px, 1.4vw, 22px); }
.post { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--notte); box-shadow: 0 0 0 1px rgba(169,196,240,.16); }
.post img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease), filter .6s; }
.post::after { content: 'Instagram'; position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--f-neon); font-size: 14px; letter-spacing: .34em; text-transform: uppercase; color: var(--porcellana); text-shadow: 0 0 14px var(--led-glow); background: rgba(46,8,16,.45); opacity: 0; transition: opacity .5s; }
.post:hover img { transform: scale(1.06); filter: brightness(.8); }
.post:hover::after { opacity: 1; }
@media (max-width: 760px) { .social__grid { grid-template-columns: 1fr 1fr; } }

/* ============ PRENOTA ============ */
.book { position: relative; height: 260vh; }
.book__stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; display: grid; place-items: center;
  background: radial-gradient(40% 45% at 50% 64%, rgba(124,164,255,.14), transparent 70%), radial-gradient(60% 50% at 50% 120%, rgba(91,23,33,.75), transparent 70%), var(--nero); }
.book__title { position: absolute; top: calc(var(--top-h) + 2vh); left: 0; right: 0; text-align: center; font-weight: 300; pointer-events: none; display: grid; justify-items: center; gap: 1.5vh; }
.book__title .neon { font-size: clamp(64px, 13vw, 240px); letter-spacing: .06em; }
.book__title em { font-family: var(--f-serif); font-weight: 300; font-size: clamp(26px, 3.4vw, 60px); line-height: 1; color: var(--led); }
/* la scena ricompone la foto originale: coordinate in % del riquadro 462×522 */
.dip { position: absolute; left: 50%; bottom: 10vh; width: min(38vmin, 400px); aspect-ratio: 462 / 522; transform: translateX(-50%); }
.dip > img { position: absolute; display: block; }
.dip__back, .dip__front { left: 0; top: 65.71%; width: 84.85%; }
.dip__back { z-index: 1; }
.dip__roll { z-index: 2; left: 15.37%; top: 0; width: 84.63%; transform: translateY(-90vh); filter: drop-shadow(0 18px 24px rgba(0,0,0,.55)); }
.dip__splash { z-index: 3; left: .22%; top: 46.74%; width: 84.42%; transform-origin: 50% 100%; transform: scaleY(0); opacity: 0; }
.dip__front { z-index: 4; }
.dip__shadow { position: absolute; z-index: 0; left: 4%; width: 76%; bottom: -3%; height: 9%; border-radius: 50%; background: radial-gradient(closest-side, rgba(0,0,0,.85), transparent); }
.book__cta { position: absolute; left: 0; right: 0; bottom: 5vh; display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; padding: 0 var(--gutter); }
.book__phone { display: grid; gap: 10px; }
.book__phone small { font-size: 12px; font-weight: 500; letter-spacing: .38em; text-transform: uppercase; color: var(--led); }
.book__phone .neon { font-size: clamp(30px, 3.6vw, 60px); }
.book__btns { display: flex; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 760px) {
  .book__cta { flex-direction: column; align-items: center; text-align: center; }
  .book__phone { justify-items: center; }
  .book__btns { justify-content: center; }
  .dip { bottom: 30vh; width: 58vw; }
}

/* ============ FOOTER ============ */
.foot { position: relative; padding: 16vh var(--gutter) 26px; overflow: hidden; background: radial-gradient(60% 60% at 50% 0%, rgba(91,23,33,.45), transparent 70%), var(--nero); box-shadow: 0 -1px 0 rgba(169,196,240,.16); }
.foot__giant { text-align: center; white-space: nowrap; font-size: 11.4vw; letter-spacing: .04em; }
.foot__grid { margin-top: 12vh; display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 32px; }
.foot__brand img { width: 120px; }
.foot__col h4 { font-family: var(--f-neon); font-weight: 400; font-size: 13px; letter-spacing: .32em; text-transform: uppercase; color: var(--led); margin-bottom: 14px; }
.foot__col p { color: var(--nebbia); line-height: 1.9; }
.foot__col a { color: var(--porcellana); }
.foot__col > a { display: inline-block; margin-top: 10px; font-family: var(--f-neon); font-size: 12px; letter-spacing: .24em; text-transform: uppercase; box-shadow: 0 1px 0 var(--led); }
.foot__legal { margin-top: 8vh; font-size: 12px; color: rgba(142,154,179,.6); }
@media (max-width: 800px) { .foot__grid { grid-template-columns: 1fr 1fr; } }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .ticker__track, .hero__hint i, .fly__img, .slide__arrow { animation: none; }
  .hero, .book { height: auto; }
  .hero__stage, .book__stage { position: relative; }
  .loader__sign .ch, .lusso__a .ch { opacity: 1; }
  .lusso__b { clip-path: none; }
}

/* ---------- senza JavaScript o se le librerie non si caricano: tutto leggibile ---------- */
.no-js .loader, .no-motion .loader, .no-js .cursor, .no-motion .cursor { display: none; }
.no-js body.is-loading { overflow: auto; }
.no-js .hero, .no-motion .hero, .no-js .book, .no-motion .book { height: auto; }
.no-js .hero__stage, .no-motion .hero__stage { height: 100vh; }
.no-js .book__stage, .no-motion .book__stage { position: relative; }
.no-js .portal, .no-js .lusso, .no-js .star, .no-js .claim, .no-motion .portal, .no-motion .lusso, .no-motion .star, .no-motion .claim { display: none; }
.no-js .coll__pin, .no-motion .coll__pin { height: auto; overflow-x: auto; }
.no-js .dip__roll, .no-motion .dip__roll, .no-js .dip__splash, .no-motion .dip__splash { transform: none; opacity: 1; }
.no-js .overlay__links a { transform: none; }

/* ---------- pagine legali e 404 ---------- */
.legal-page { min-height: 100vh; display: flex; flex-direction: column; }
.legal__top { display: flex; justify-content: space-between; align-items: center; padding: 22px var(--gutter); box-shadow: 0 1px 0 rgba(169,196,240,.16); }
.legal__back { font-family: var(--f-neon); font-size: 13px; letter-spacing: .22em; text-transform: uppercase; }
.legal__back:hover { text-shadow: 0 0 14px var(--led-glow); }
.legal__logo { height: 48px; width: auto; }
.legal { flex: 1; width: min(760px, 100% - 2 * var(--gutter)); margin: 10vh auto; }
.legal h1 { font-size: clamp(40px, 7vw, 92px); }
.legal__updated { margin-top: 18px; color: var(--nebbia); font-size: 14px; }
.legal h2 { margin-top: 48px; font-family: var(--f-neon); font-weight: 400; font-size: 18px; letter-spacing: .2em; text-transform: uppercase; color: var(--led); }
.legal p { margin-top: 14px; color: rgba(230,236,245,.82); }
.legal__foot { padding: 30px var(--gutter); font-size: 12px; color: var(--nebbia); box-shadow: 0 -1px 0 rgba(169,196,240,.16); }
.notfound { flex: 1; display: grid; place-content: center; justify-items: center; gap: 26px; text-align: center; padding: var(--gutter); }
.notfound__code { font-size: clamp(90px, 20vw, 260px); }
.notfound h1 { font-family: var(--f-serif); font-style: italic; font-weight: 300; font-size: clamp(26px, 3vw, 42px); color: var(--nebbia); }
.foot__legal a { color: var(--nebbia); box-shadow: 0 1px 0 rgba(169,196,240,.35); }
.foot__legal a:hover { color: var(--porcellana); }

.foot__col address { font-style: normal; color: var(--nebbia); line-height: 1.9; }

/* ---------- telefoni: niente filtri pesanti su immagini animate (evita sfarfallii e sgranature su iOS) ---------- */
@media (max-width: 760px), (pointer: coarse) {
  .fly__img, .fly--sharp .fly__img, .slide__img, .dip__roll { filter: none; }
  .star img { filter: none; }
}

/* ---------- tablet in verticale: scritte in basso ai lati, come sul telefono ---------- */
@media (min-width: 761px) and (max-width: 1180px) and (orientation: portrait) {
  .claim { top: auto; bottom: 6vh; translate: none; max-width: 40vw; font-size: clamp(30px, 5vw, 44px); }
  .star { height: 58vh; bottom: 16vh; }
}

