
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300 500;
  font-display: swap;
  src: url(/sphere-v8/font-34b9c504cab7a73e.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300 500;
  font-display: swap;
  src: url(/sphere-v8/font-3100e775e8616cd2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/sphere-v8/font-b02fdf18a2d7b09f.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/sphere-v8/font-eabce94d4a69e439.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(/sphere-v8/font-42898ad49a6b23f3.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(/sphere-v8/font-e0c764a8e9e1cce9.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  --bg:#000;
  --ink:#f4f2ef;
  --dim:#8c8783;
  --line:rgba(244,242,239,.28);
  --pad:clamp(14px, 2.6vw, 34px);
  --ease:cubic-bezier(.22,.61,.36,1);
  --hw:min(56vw, 640px);
  --persp:1150px;
  --safe-top:env(safe-area-inset-top, 0px);
  --safe-right:env(safe-area-inset-right, 0px);
  --safe-bottom:env(safe-area-inset-bottom, 0px);
  --safe-left:env(safe-area-inset-left, 0px);
  --tap:44px;
  --serif:"Playfair Display", "Times New Roman", serif;
  --sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}
* { box-sizing:border-box; }
html { background:#000; scrollbar-gutter:stable; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-weight:300; -webkit-font-smoothing:antialiased; overflow-x:hidden; min-height:100vh; min-height:100dvh; overscroll-behavior-y:none; }
body.locked { overflow:hidden; height:100vh; height:100dvh; }
button { font:inherit; color:inherit; background:none; border:0; cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
a { color:inherit; -webkit-tap-highlight-color:transparent; }
img { display:block; max-width:100%; }
figure, h1, h2, p { margin:0; }
button:focus-visible, a:focus-visible, [tabindex]:focus-visible { outline:2px solid var(--ink); outline-offset:6px; }
[hidden] { display:none !important; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.link { text-underline-offset:5px; text-decoration-color:rgba(244,242,239,.5); transition:text-decoration-color .25s; }
.link:hover { text-decoration-color:var(--ink); }
#scrolltrack { height:116vh; pointer-events:none; }
#stage { position:fixed; inset:0; z-index:10; perspective:var(--persp); perspective-origin:50% 50%; overflow:hidden; touch-action:none; transition:opacity .6s, filter .6s; }
#world{
  position:absolute; top:50%; left:50%;
  width:0; height:0;
  transform-style:preserve-3d;
  will-change:transform;
}
#orb{
  position:absolute; top:0; left:0;
  width:0; height:0;
  transform-style:preserve-3d;
  opacity:1;
  transform:none;
}
#headline{
  position:absolute; top:0; left:0;
  width:var(--hw);
  margin-left:calc(var(--hw) / -2);
  text-align:center;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(25px, 3.7vw, 55px);
  line-height:1.06;
  letter-spacing:-.005em;
  color:#fff;
  text-shadow:0 2px 34px rgba(0,0,0,.55);
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
}
#headline .inner{
  position:absolute; top:0; left:0;
  width:100%;
  transform:translateY(-50%);
}
#headline .inner > span { display:inline-block; opacity:0; transform:translateY(.42em); filter:blur(7px); }
body.revealed #headline .inner > span { opacity:1; transform:none; filter:blur(0); transition:opacity 1.05s, transform 1.15s, filter 1.05s; transition-delay:calc(.9s + var(--i) * .085s); }
.card { position:absolute; top:0; left:0; width:var(--cw); height:calc(var(--cw) / 1.5); margin-left:calc(var(--cw) / -2); margin-top:calc(var(--cw) / -3); cursor:pointer; user-select:none; -webkit-user-select:none; }
.card.tall { height:calc(var(--cw) * 1.25); margin-top:calc(var(--cw) * -.625); }
.card figure { position:relative; width:100%; height:100%; overflow:hidden; border-radius:3px; background:#0a0a0a; transition:transform .5s ease; }
.card:hover figure, .card:focus-visible figure { transform:scale(1.045); }
.card img { width:100%; height:100%; object-fit:cover; opacity:0; pointer-events:none; }
.card img.in { opacity:1; }
body.revealed .card img { transition:opacity .8s ease-out; }
.card figure::after { content:""; position:absolute; inset:0; background:rgba(0,0,0,var(--d,0)); box-shadow:inset 0 0 0 1px rgba(255,255,255,.07); border-radius:3px; pointer-events:none; }
.vig { position:fixed; inset:0; z-index:12; pointer-events:none; background:radial-gradient(ellipse 88% 92% at 50% 50%, transparent 48%, rgba(0,0,0,.26) 80%, rgba(0,0,0,.72) 100%); transition:opacity .6s; }
.chrome { opacity:0; pointer-events:none; transition:opacity 1.2s .15s, transform .6s var(--ease); }
body.revealed .chrome { opacity:1; pointer-events:auto; }
header.chrome { position:fixed; top:0; left:0; right:0; z-index:60; display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:calc(var(--pad) * .8 + var(--safe-top)) calc(var(--pad) + var(--safe-right)) calc(var(--pad) * .35) calc(var(--pad) + var(--safe-left)); mix-blend-mode:difference; }
.brand { display:flex; gap:10px; align-items:center; }
.brand .logo-icon { width:32px; height:32px; object-fit:contain; }
.wordmark { font-family:var(--serif); font-size:clamp(19px, 2.1vw, 27px); font-weight:400; letter-spacing:.005em; line-height:1; color:#fff; text-decoration:none; white-space:nowrap; }
.wordmark em { display:block; margin-top:4px; font-size:.54em; line-height:1.1; font-style:normal; letter-spacing:.02em; }
.header-actions { display:flex; align-items:center; gap:clamp(16px, 3vw, 42px); }
#contactBtn { min-height:44px; padding:10px 0; font-size:12px; color:#fff; border-bottom:1px solid rgba(255,255,255,.5); transition:border-color .3s; }
#contactBtn:hover { border-color:#fff; }
.menu-btn { display:flex; flex-direction:column; align-items:flex-end; gap:5px; min-width:44px; min-height:44px; padding:8px 0 4px; }
.menu-label { font-size:clamp(12px, 1.25vw, 15px); letter-spacing:.01em; color:#fff; transition:opacity .35s; }
.bars { position:relative; display:block; width:clamp(42px, 4.4vw, 62px); height:clamp(16px, 2vw, 22px); }
.bars i { position:absolute; left:0; right:0; top:50%; height:1px; background:#fff; transition:transform .45s var(--ease), width .45s var(--ease); }
.bars i:first-child { transform:translateY(-5px); }
.bars i:last-child { width:clamp(34px, 3.6vw, 50px); transform:translateY(5px); }
.menu-btn:hover .bars i:last-child { transform:translate(-8px, 5px); }
body.menu-open header { z-index:90; mix-blend-mode:normal; }
body.menu-open .wordmark, body.menu-open .menu-label { color:var(--ink); }
body.menu-open .menu-label { opacity:0; }
body.menu-open .bars i { width:100%; background:var(--ink); }
body.menu-open .bars i:first-child { transform:translateY(0) rotate(45deg); }
body.menu-open .bars i:last-child { transform:translateY(0) rotate(-45deg); }
.bio { position:fixed; left:calc(var(--pad) + var(--safe-left)); bottom:calc(var(--pad) + var(--safe-bottom)); z-index:55; max-width:min(320px, 46vw); }
.who { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
#avatar { flex:none; width:52px; height:52px; border-radius:3px; object-fit:cover; filter:grayscale(.15); }
.who b { font-family:var(--serif); font-size:19px; font-weight:400; letter-spacing:.01em; }
.bio p { font-size:12.5px; line-height:1.62; color:rgba(244,242,239,.72); }
.colophon { position:fixed; right:calc(var(--pad) + var(--safe-right)); bottom:calc(var(--pad) + var(--safe-bottom)); z-index:55; font-size:12.5px; line-height:1.65; color:rgba(244,242,239,.72); text-align:right; }
body.deep .bio, body.gridview .bio, body.lit .bio, body.contact-open .bio { opacity:0; transform:translateY(10px); pointer-events:none; transition-delay:0s; }
body.gridview .colophon, body.lit .colophon { opacity:0; pointer-events:none; transition-delay:0s; }
.gridbtn { position:fixed; left:calc(var(--pad) + var(--safe-left)); bottom:calc(var(--pad) + var(--safe-bottom)); z-index:56; width:44px; height:44px; padding:5px; display:grid; grid-template-columns:repeat(2, 1fr); gap:4px; opacity:0; transform:translateY(8px); pointer-events:none; transition:opacity .5s, transform .5s; }
.gridbtn b { display:block; background:var(--ink); border-radius:2px; transition:transform .35s, background .35s; }
body.revealed.deep .gridbtn, body.revealed.gridview .gridbtn { opacity:1; transform:none; pointer-events:auto; }
.gridbtn:hover b { background:#fff; transform:scale(.86); }
body.gridview .gridbtn b:first-child { transform:translate(3px, 3px); }
body.gridview .gridbtn b:last-child { transform:translate(-3px, -3px); }
body.lit .gridbtn, body.menu-open .gridbtn, body.contact-open .gridbtn { opacity:0; pointer-events:none; }
.cue { position:fixed; left:50%; bottom:calc(var(--pad) + var(--safe-bottom) + 4px); transform:translateX(-50%); z-index:54; display:flex; align-items:center; gap:10px; font-size:10px; text-transform:uppercase; letter-spacing:.24em; color:rgba(244,242,239,.42); white-space:nowrap; }
.cue s { position:relative; display:block; width:44px; height:1px; background:rgba(244,242,239,.28); overflow:hidden; }
.cue s::after { content:""; position:absolute; inset:0; background:var(--ink); animation:sweep 2.6s ease infinite; }
@keyframes sweep { 0% { transform:translateX(-100%); } 55% { transform:translateX(0); } 100% { transform:translateX(100%); } }
body.deep .cue, body.gridview .cue, body.lit .cue { opacity:0; pointer-events:none; transition-delay:0s; }
#grid { position:fixed; inset:0; z-index:20; padding:calc(var(--pad) * 3.4) var(--pad) calc(var(--pad) * 4); background:#000; overflow-y:auto; overscroll-behavior:contain; opacity:0; pointer-events:none; transition:opacity .6s; }
.rows { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:clamp(10px, 1.4vw, 20px); max-width:1680px; margin:0 auto; }
.rows figure { position:relative; aspect-ratio:3/2; border-radius:3px; background:#0b0b0b; overflow:hidden; cursor:pointer; }
.rows img { width:100%; height:100%; object-fit:cover; opacity:.82; transition:transform .8s, opacity .8s; }
.rows figure:hover img, .rows figure:focus-visible img { transform:scale(1.05); opacity:1; }
.rows figcaption { position:absolute; left:0; right:0; bottom:0; padding:26px 14px 12px; background:linear-gradient(transparent, rgba(0,0,0,.82)); font-family:var(--serif); font-weight:400; font-size:15px; opacity:0; transform:translateY(6px); transition:opacity .4s, transform .4s; }
.rows figure:hover figcaption, .rows figure:focus-visible figcaption { opacity:1; transform:none; }
.grid-heading { max-width:1680px; margin:8px auto 28px; }
.grid-heading h2 { font:400 30px/1.2 var(--serif); }
.grid-description { max-width:56ch; margin-top:10px; font-size:12.5px; line-height:1.65; color:rgba(244,242,239,.62); }
body.gridview #grid { opacity:1; pointer-events:auto; }
body.gridview #stage { opacity:0; filter:blur(14px); pointer-events:none; }
body.gridview .vig, body.lit .vig { opacity:0; }
body.lit.gridview #grid { opacity:.18; pointer-events:none; }
#lit { position:fixed; inset:0; z-index:90; display:grid; place-items:center; padding:clamp(56px, 8vh, 84px) var(--pad); opacity:0; pointer-events:none; transition:opacity .42s; }
body.lit #lit { opacity:1; pointer-events:auto; }
.scrim { position:absolute; inset:0; background:none; }
.plate { position:relative; width:min(72vw, 860px, (100vh - 230px) * 1.5); transition:transform .62s ease, opacity .42s ease; }
.shot { position:relative; width:100%; aspect-ratio:3/2; border-radius:2px; background:#0b0b0b; box-shadow:0 30px 90px rgba(0,0,0,.75); }
.shot > img { width:100%; height:100%; object-fit:cover; border-radius:2px; }
.shot [data-close] { position:absolute; top:12px; right:14px; min-width:44px; min-height:44px; padding:10px 14px; border:1px solid rgba(244,242,239,.78); border-radius:6px; background:rgba(0,0,0,.35); color:var(--ink); font-size:12.5px; transition:background .3s, border-color .3s; }
.shot [data-close]:hover { border-color:#fff; background:rgba(0,0,0,.55); }
.meta { display:grid; grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr); gap:clamp(22px, 3.2vw, 48px); padding-top:16px; }
#litTitle { font-family:var(--serif); font-size:clamp(22px, 2.15vw, 32px); font-weight:400; line-height:1.08; letter-spacing:-.01em; margin-bottom:6px; }
.where { font-size:13px; line-height:1.5; color:rgba(244,242,239,.62); }
.note { font-size:13.5px; line-height:1.55; color:rgba(244,242,239,.92); }
.cta { display:inline-flex; align-items:center; min-height:44px; margin-top:10px; font-size:12px; color:var(--ink); text-decoration:underline; text-decoration-color:rgba(244,242,239,.55); text-underline-offset:5px; transition:text-decoration-color .25s; }
.cta:hover { text-decoration-color:#fff; }
#menu { position:fixed; inset:0; z-index:80; display:grid; place-items:center; background:#050505; clip-path:inset(0 0 100% 0); transition:clip-path .85s ease; pointer-events:none; overflow-y:auto; overscroll-behavior:contain; }
body.menu-open #menu, #menu.open { clip-path:inset(0); pointer-events:auto; }
#menu nav { display:flex; flex-direction:column; align-items:center; gap:clamp(4px, 1vw, 10px); padding:100px var(--pad) 140px; text-align:center; }
#menu nav > a, #menu nav > button { font-family:var(--serif); font-size:clamp(34px, 7.6vw, 78px); font-weight:400; line-height:1.08; color:var(--ink); text-decoration:none; opacity:.55; transition:opacity .3s, letter-spacing .3s; }
#menu nav > a:hover, #menu nav > button:hover, #menu nav > a:focus-visible, #menu nav > button:focus-visible { opacity:1; letter-spacing:.012em; }
.addr { position:absolute; left:calc(var(--pad) + var(--safe-left)); right:calc(var(--pad) + var(--safe-right)); bottom:calc(var(--pad) + var(--safe-bottom)); color:var(--dim); font-size:12.5px; line-height:1.7; }
.addr a { text-decoration:none; }
.addr a:hover { color:var(--ink); }
.menu-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:20px; margin-top:24px; }
.menu-actions a, .menu-actions button { min-height:44px; display:inline-flex; align-items:center; font-family:var(--sans); font-size:12px; color:rgba(244,242,239,.65); }
#contact { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:100px calc(var(--pad) + var(--safe-right)) calc(50px + var(--safe-bottom)) calc(var(--pad) + var(--safe-left)); background:#050505; overflow:auto; overscroll-behavior:contain; opacity:0; pointer-events:none; transition:opacity .4s; }
body.contact-open #contact, #contact.open { opacity:1; pointer-events:auto; }
.contact-content { width:min(100%, 720px); }
.contact-content h2 { margin-bottom:24px; font:400 clamp(36px, 5.6vw, 72px)/1.06 var(--serif); letter-spacing:-.02em; }
.contact-content > p { max-width:52ch; font-size:14px; line-height:1.7; color:rgba(244,242,239,.7); }
.contact-links { display:flex; flex-wrap:wrap; gap:14px 30px; margin:28px 0; }
.contact-links a { display:inline-flex; align-items:center; min-height:44px; padding:12px 0; font-size:14px; text-decoration:underline; text-underline-offset:6px; text-decoration-color:rgba(244,242,239,.4); }
.contact-links a:hover { text-decoration-color:var(--ink); }
.contact-content .disclaimer { margin-top:28px; font-size:11px; line-height:1.65; color:var(--dim); }
#contactClose { position:absolute; top:calc(var(--pad) + var(--safe-top)); right:calc(var(--pad) + var(--safe-right)); min-height:44px; min-width:44px; padding:10px 14px; border:1px solid var(--line); border-radius:6px; font-size:12.5px; }
#contactClose:hover { border-color:var(--ink); }
#intro { position:fixed; inset:0; z-index:200; background:#000; display:grid; place-items:center; overflow:hidden; }
#film { width:100%; height:100%; object-fit:cover; }
#intro .veil { position:absolute; inset:0; background:#000; opacity:0; transition:opacity 1.15s ease; pointer-events:none; }
#intro.closing .veil { opacity:1; }
#intro.gone { opacity:0; pointer-events:none; transition:opacity .5s linear; }
.skip { position:absolute; right:calc(var(--pad) + var(--safe-right)); bottom:calc(var(--pad) + var(--safe-bottom)); min-height:44px; padding:10px 18px; border:1px solid rgba(244,242,239,.25); border-radius:999px; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); color:rgba(244,242,239,.6); font-size:11px; letter-spacing:.18em; text-transform:uppercase; transition:opacity .3s, color .3s, border-color .3s; }
.skip:hover { color:#fff; border-color:rgba(255,255,255,.7); }
#intro.closing .skip, #intro.closing .intro-brand { opacity:0; pointer-events:none; }
.fallback { position:absolute; inset:0; background:radial-gradient(circle at 50% 46%, #302615 0%, #0c0906 42%, #000 72%); opacity:0; }
#intro.novideo .fallback { opacity:1; }
.intro-brand { position:absolute; left:calc(var(--pad) + var(--safe-left)); bottom:calc(var(--pad) + var(--safe-bottom)); max-width:calc(100% - 150px); font:400 clamp(25px, 4.4vw, 52px)/1.08 var(--serif); color:var(--ink); text-shadow:0 2px 32px #000; transition:opacity .3s; }
.intro-brand small { display:block; margin-top:10px; font:300 12px/1.5 var(--sans); }
#splash { position:fixed; inset:0; z-index:250; background:#000; display:grid; place-items:center; align-content:center; gap:26px; transition:opacity .6s ease; }
#splash.out { opacity:0; pointer-events:none; }
.mark { font-family:var(--serif); font-size:clamp(28px, 4.4vw, 52px); font-weight:400; letter-spacing:.005em; color:var(--ink); opacity:0; animation:riseIn 1.25s ease .15s forwards; }
.mark em { display:block; font-size:.5em; font-style:normal; text-align:center; margin-top:7px; }
.bar { width:clamp(120px, 17vw, 210px); height:1px; background:rgba(244,242,239,.16); }
.bar s { display:block; width:100%; height:100%; background:var(--ink); transform:scaleX(0); transform-origin:left; transition:transform .55s ease; }
.tag { font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:rgba(244,242,239,.38); opacity:0; animation:riseIn .9s ease .7s forwards; }
@keyframes riseIn { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:none; } }
#dot { position:fixed; top:0; left:0; z-index:300; width:19px; height:19px; margin:-9.5px; border-radius:50%; background:rgba(214,212,209,.9); mix-blend-mode:difference; border:1px solid transparent; pointer-events:none; transition:width .35s ease, height .35s ease, margin .35s ease, background .35s ease, border-color .35s ease; }
#dot.wide { width:52px; height:52px; margin:-26px; background:rgba(244,242,239,.14); border-color:rgba(244,242,239,.75); }
@media (pointer:coarse) { #stage { touch-action:pan-y; } }
@media (hover:none), (pointer:coarse) { #dot { display:none; } }
@media (max-width:900px) {
  .bio { max-width:min(420px, calc(100vw - var(--pad) * 2 - var(--safe-left) - var(--safe-right))); }
  .bio p { font-size:12px; }
  .colophon { font-size:11px; }
  .meta { grid-template-columns:1fr; gap:10px; padding-top:14px; }
  .plate { width:min(92vw, (100dvh - 220px) * 1.5); }
  .rows { grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); }
  #grid { padding-top:calc(var(--pad) * 2.8 + var(--safe-top)); }
  .grid-heading { margin-top:28px; }
}
@media (max-width:768px) {
  .colophon { display:none; }
  .bio { max-width:calc(100vw - var(--pad) * 2 - var(--safe-left) - var(--safe-right)); }
  #headline { font-size:clamp(22px, 6.4vw, 34px); }
  #menu nav > a, #menu nav > button { font-size:clamp(28px, 9vw, 54px); }
  .addr { font-size:11.5px; }
}
@media (max-width:640px) {
  :root { --hw:min(84vw, 360px); --pad:clamp(12px, 4vw, 18px); }
  #avatar { width:42px; height:42px; }
  .who b { font-size:17px; }
  .bio p { font-size:11.5px; line-height:1.55; max-width:48ch; }
  .cue { display:none; }
  #lit { display:block; overflow-y:auto; overscroll-behavior:contain; padding:calc(52px + var(--safe-top)) calc(var(--pad) + var(--safe-right)) calc(var(--pad) + var(--safe-bottom)) calc(var(--pad) + var(--safe-left)); }
  .plate { width:100%; max-width:560px; margin:0 auto; }
  #litTitle { font-size:clamp(20px, 5.6vw, 26px); }
  .note { font-size:12.5px; line-height:1.58; }
  .shot [data-close] { top:8px; right:8px; }
  .rows { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; }
  .rows figcaption { opacity:1; transform:none; font-size:13px; padding-left:10px; padding-right:10px; }
  #grid { padding:calc(var(--pad) * 2.8 + var(--safe-top)) calc(var(--pad) + var(--safe-right)) calc(var(--pad) * 4 + var(--safe-bottom)) calc(var(--pad) + var(--safe-left)); }
  .grid-heading h2 { font-size:27px; }
  .grid-description { font-size:12px; }
  .header-actions { gap:18px; }
  .brand .logo-icon { width:28px; height:28px; }
  .brand { gap:8px; }
  #contactBtn { font-size:11px; }
  #contact { padding-top:86px; }
  .contact-links { flex-direction:column; gap:6px; align-items:flex-start; }
  .contact-content h2 { max-width:12ch; }
}
@media (max-width:380px) {
  :root { --hw:min(88vw, 320px); }
  .bio .who { gap:10px; margin-bottom:10px; }
  .bio p { display:none; }
  .rows { grid-template-columns:1fr; }
  #menu nav { gap:2px; }
  #menu nav > a, #menu nav > button { font-size:clamp(24px, 10vw, 40px); }
  .brand .logo-icon { display:none; }
  .header-actions { gap:14px; }
}
@media (max-height:520px) and (orientation:landscape) {
  .bio, .colophon, .cue { display:none; }
  #headline { font-size:clamp(18px, 4.8vh, 28px); }
  #lit { padding-top:calc(36px + var(--safe-top)); overflow-y:auto; }
  .meta { padding-top:10px; }
  .plate { width:min(58vw, (100dvh - 80px) * 1.5); }
  header.chrome { padding-top:calc(8px + var(--safe-top)); }
  #menu nav { padding:70px var(--pad) 100px; }
  #menu nav > a, #menu nav > button { font-size:clamp(24px, 6vh, 36px); }
  .addr { position:static; width:100%; padding:0 var(--pad) var(--pad); }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-delay:0ms !important; animation-iteration-count:1 !important; transition-duration:.14s !important; transition-delay:0s !important; scroll-behavior:auto !important; }
}

/* Identità Barone nella composizione del riferimento, senza alterare la sfera. */
.wordmark em, .mark em { display:inline; margin:0; font-size:inherit; font-style:normal; line-height:inherit; letter-spacing:.005em; }
#avatar { object-fit:cover; }
.contact-content .contact-kicker { margin-bottom:18px; font-size:12px; }
.contact-content .contact-note { font-size:12px; }
.contact-content h2 { max-width:none; }
.contact-content .menu-actions { justify-content:flex-start; }
#dot { opacity:0; }
#lit { overflow-y:auto; align-items:safe center; }
.no-script { position:fixed; inset:0; z-index:400; padding:10vh 8vw; overflow-y:auto; background:#000; font:18px/1.6 sans-serif; }
body.dragging { user-select:none; }
.rows figure:focus-visible { outline-offset:2px; }

/* La scena di Roma resta dietro la sfera: nessuno spostamento del suo centro. */
:root {
  --scene-ink:#f3ece1;
  --scene-gold:#ddc294;
  --scene-muted:#c1b5a4;
  --scene-glass:rgba(15,11,7,.84);
}
body { color:var(--scene-ink); }
#cinema { position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; background:#17110b; isolation:isolate; }
#cinema .city-plate { --city-focus:50%; position:absolute; inset:-2.5%; transform:scale(1.04); transform-origin:50% 54%; will-change:transform; }
#cityImage { display:block; width:100%; height:100%; object-fit:cover; object-position:var(--city-focus, 50%) 50%; filter:brightness(.86) saturate(.78); }
#cityLights { position:absolute; inset:0; z-index:1; width:100%; height:100%; pointer-events:none; mix-blend-mode:screen; opacity:.82; }
#cinema .city-shade { position:absolute; inset:0; z-index:2; background:linear-gradient(180deg, rgba(3,3,3,.32) 0%, rgba(7,5,3,.06) 27%, rgba(7,5,3,.12) 63%, rgba(3,3,3,.48) 100%), radial-gradient(ellipse at 50% 48%, transparent 25%, rgba(5,3,1,.13) 65%, rgba(0,0,0,.34) 100%); }
.film-grain { position:absolute; inset:-20%; z-index:3; pointer-events:none; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.7' filter='url(%23grain)'/%3E%3C/svg%3E"); background-size:180px 180px; mix-blend-mode:soft-light; }
.cinema-matte { position:absolute; inset:0; z-index:4; pointer-events:none; }
.cinema-matte::before, .cinema-matte::after { content:""; position:absolute; left:0; right:0; height:12px; background:linear-gradient(#080604, rgba(8,6,4,.72)); }
.cinema-matte::before { top:0; }
.cinema-matte::after { bottom:0; transform:rotate(180deg); }
body.motion-paused #cinema *, body.motion-paused .cue s::after { animation-play-state:paused !important; }

#stage { background:transparent; }
.vig { background:radial-gradient(ellipse 88% 92% at 50% 50%, transparent 54%, rgba(0,0,0,.12) 82%, rgba(0,0,0,.4) 100%); }
header.chrome { mix-blend-mode:normal; text-shadow:0 2px 12px rgba(0,0,0,.85); }
.wordmark, .menu-label { color:var(--scene-ink); }
.bars i { background:var(--scene-ink); box-shadow:0 1px 5px rgba(0,0,0,.7); }
#headline { font-size:clamp(25px, 3.2vw, 47px); color:var(--scene-ink); text-shadow:0 2px 18px rgba(0,0,0,.8), 0 8px 42px rgba(0,0,0,.55); }

/* Due facce leggibili: le scritte posteriori non risultano specchiate. */
.card { transform-style:preserve-3d; transition:transform .65s var(--ease); }
body.dragging .card { transition:none; }
.card > figure.card-face { position:absolute; inset:0; margin:0; overflow:hidden; border-radius:4px; transform:translateZ(.5px); backface-visibility:hidden; -webkit-backface-visibility:hidden; background:#100d09; box-shadow:0 8px 24px rgba(0,0,0,.24); transition:transform .45s var(--ease), box-shadow .45s var(--ease); }
.card > figure.card-back { transform:rotateY(180deg) translateZ(.5px); }
.card:hover > figure.card-face, .card:focus-visible > figure.card-face { transform:translateZ(.5px) scale(1.035); box-shadow:0 10px 30px rgba(0,0,0,.48), 0 0 0 1px rgba(221,194,148,.56); }
.card:hover > figure.card-back, .card:focus-visible > figure.card-back { transform:rotateY(180deg) translateZ(.5px) scale(1.035); }
.card figure::after { z-index:1; border-radius:4px; box-shadow:inset 0 0 0 1px rgba(243,236,225,.15); }
.card .card-face img, body.revealed .card .card-face img { transform-origin:50% 50%; animation:cardFilm var(--shot-duration, 22s) ease-in-out var(--shot-delay, -4s) infinite alternate both; animation-play-state:paused; transition:filter .5s ease, opacity .8s ease-out; will-change:transform; }
body.revealed:not(.motion-paused):not(.scene-dialog):not(.gridview):not(.scene-hidden) .card .card-face img { animation-play-state:running; }
body.motion-paused .card-face img { animation-play-state:paused; }
.card:hover .card-face img, .card:focus-visible .card-face img { filter:brightness(1.12) contrast(1.03); }
@keyframes cardFilm {
  from { transform:translate3d(calc(var(--pan-x, 3%) * -.4), calc(var(--pan-y, 2%) * -.4), 0) scale(1.14) rotate(calc(var(--img-rot, .3deg) * -.5)); }
  to { transform:translate3d(var(--pan-x, 3%), var(--pan-y, 2%), 0) scale(1.26) rotate(var(--img-rot, .3deg)); }
}
.card .card-label { position:absolute; z-index:2; left:0; right:0; bottom:0; display:grid; grid-template-columns:minmax(0,1fr) 12px; align-items:end; column-gap:5px; row-gap:3px; padding:20px 8px 8px; background:linear-gradient(180deg, transparent 0%, rgba(10,8,5,.56) 25%, rgba(10,8,5,.95) 100%); color:var(--scene-ink); pointer-events:none; text-align:left; text-shadow:0 1px 4px rgba(0,0,0,.95); }
.card-section { grid-column:1; display:block; font-family:var(--sans); font-size:12px; font-weight:500; line-height:1.2; letter-spacing:.005em; color:#f8edd9; }
.card-title { grid-column:1; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font-family:var(--serif); font-size:12px; font-weight:400; line-height:1.16; color:rgba(243,236,225,.88); }
.card .card-title { display:none; }
.card.is-hovered .card-title { display:-webkit-box; }
.card.is-hovered .card-label { background:linear-gradient(180deg, transparent, rgba(10,8,5,.96) 65%); }
.card-arrow { grid-column:2; grid-row:1 / span 2; align-self:end; display:block; padding-bottom:1px; color:var(--scene-gold); font-family:var(--sans); font-size:14px; line-height:1; transition:transform .3s ease, color .3s ease; }
.card:hover .card-arrow, .card:focus-visible .card-arrow { transform:translate(1px,-1px); color:#fff3da; }
.card:focus-visible { outline-color:var(--scene-gold); outline-offset:5px; }

.bio { padding:14px 16px 12px; margin:0 -16px -12px; background:radial-gradient(ellipse at 13% 82%, rgba(10,8,5,.71), rgba(10,8,5,.38) 58%, transparent 78%); text-shadow:0 1px 7px rgba(0,0,0,.75); }
.bio .who { margin-bottom:10px; }
.bio p { color:rgba(243,236,225,.8); }
#avatar { border-radius:3px; box-shadow:0 2px 12px rgba(0,0,0,.4); }
.colophon { bottom:calc(var(--pad) + var(--safe-bottom) + 54px); color:rgba(243,236,225,.64); text-shadow:0 1px 8px #000; }
.scene-controls { position:fixed; right:calc(var(--pad) + var(--safe-right)); bottom:calc(var(--pad) + var(--safe-bottom)); z-index:56; display:flex; align-items:center; gap:14px; opacity:0; pointer-events:none; transition:opacity .8s .15s, transform .5s var(--ease); }
body.revealed .scene-controls { opacity:1; pointer-events:auto; }
#motionBtn { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-width:44px; min-height:44px; padding:9px 13px; border:1px solid rgba(243,236,225,.24); border-radius:999px; background:rgba(15,11,7,.62); color:var(--scene-ink); font-size:11px; line-height:1.3; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); transition:border-color .3s, background .3s; }
#motionBtn:hover { border-color:rgba(221,194,148,.75); background:rgba(26,19,11,.82); }
#motionBtn[aria-pressed="true"] { border-color:rgba(221,194,148,.5); }
#motionBtn svg { width:12px; height:12px; flex:none; fill:currentColor; }
#motionBtn .motion-label { white-space:nowrap; }
.motion-status { font-size:10.5px; line-height:1.45; color:var(--scene-muted); text-shadow:0 1px 8px #000; }
body.lit .scene-controls, body.menu-open .scene-controls, body.contact-open .scene-controls { opacity:0; pointer-events:none; transform:translateY(8px); transition-delay:0s; }
.cue { color:rgba(243,236,225,.72); text-shadow:0 1px 7px rgba(0,0,0,.9); }
#sceneHint { font-size:10px; letter-spacing:.08em; text-transform:none; }
.cue s { background:rgba(243,236,225,.3); }
.cue s::after { background:var(--scene-gold); }
.gridbtn b { background:var(--scene-ink); box-shadow:0 1px 8px rgba(0,0,0,.3); }

#grid { background:rgba(10,7,4,.86); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); }
.rows figure { background:rgba(15,11,7,.8); box-shadow:0 7px 28px rgba(0,0,0,.2); }
.rows img { opacity:.94; }
.rows figcaption { opacity:1; transform:none; padding:44px 14px 12px; background:linear-gradient(transparent, rgba(8,6,4,.88)); color:var(--scene-ink); text-shadow:0 1px 5px #000; }
.rows figure:hover figcaption, .rows figure:focus-visible figcaption { opacity:1; }
.rows .card-label { display:grid; grid-template-columns:minmax(0,1fr) 16px; gap:5px 10px; }
.rows .card-section { font-size:12px; }
.rows .card-title { display:block; font-size:15px; }
.rows .card-arrow { font-size:17px; }
#menu, #contact { background:rgba(10,7,4,.9); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
#menu nav > a, #menu nav > button { color:var(--scene-ink); opacity:.75; text-shadow:0 2px 20px rgba(0,0,0,.5); }
#menu nav > a:hover, #menu nav > button:hover, #menu nav > a:focus-visible, #menu nav > button:focus-visible { color:#fff1d5; opacity:1; }
.addr { color:var(--scene-muted); }
.contact-content > p { color:rgba(243,236,225,.76); }
.contact-links a { text-decoration-color:rgba(221,194,148,.55); }
#contactClose { background:rgba(15,11,7,.44); }

#lit { background:transparent; }
.shot { box-shadow:0 22px 80px rgba(0,0,0,.6); }
.shot [data-close] { background:rgba(12,9,5,.62); border-color:rgba(243,236,225,.64); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.meta { padding:18px 20px 20px; background:rgba(12,9,6,.9); border-radius:0 0 3px 3px; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); box-shadow:0 18px 40px rgba(0,0,0,.2); }
.where { color:var(--scene-gold); }
.note { color:rgba(243,236,225,.92); }
.meta .cta { text-decoration-color:rgba(221,194,148,.55); color:var(--scene-ink); }
.lightbox-nav { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:54px; padding:4px 8px; background:rgba(12,9,6,.9); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
#litPrev, #litNext { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-width:44px; min-height:44px; padding:8px 12px; border-radius:3px; color:var(--scene-ink); font-size:12px; line-height:1.3; transition:background .25s, color .25s; }
#litPrev:hover, #litNext:hover { background:rgba(221,194,148,.1); color:#fff0d2; }
#litPrev:disabled, #litNext:disabled { opacity:.3; cursor:default; }
#litCount { color:var(--scene-muted); font-size:11px; font-variant-numeric:tabular-nums; letter-spacing:.06em; }

@media (max-width:1100px) {
  .motion-status { display:none; }
  .colophon { bottom:calc(var(--pad) + var(--safe-bottom) + 54px); }
  #sceneHint { font-size:9px; letter-spacing:.03em; }
}
@media (max-width:900px) {
  .card-section { font-size:11px; }
  .card-title { font-size:11px; }
  .card .card-label { padding:18px 7px 6px; gap:3px; }
  .meta { padding:16px; }
  .bio { max-width:min(360px, calc(100vw - var(--pad) * 2 - var(--safe-left) - var(--safe-right))); }
  .bio p { font-size:11.5px; }
}
@media (max-width:768px) {
  #headline { font-size:clamp(22px, 6vw, 31px); }
  .cue { bottom:calc(var(--pad) + var(--safe-bottom) + 52px); }
  .scene-controls { gap:8px; }
  #motionBtn { padding:8px 10px; font-size:10px; }
}
@media (max-width:640px) {
  #cinema .city-plate { --city-focus:90%; }
  #cinema .city-shade { background:linear-gradient(180deg, rgba(3,3,3,.3), rgba(7,5,3,.04) 30%, rgba(7,5,3,.12) 63%, rgba(3,3,3,.52)); }
  .cinema-matte::before, .cinema-matte::after { height:4px; }
  .card .card-label { padding:15px 5px 5px; grid-template-columns:minmax(0,1fr) 9px; column-gap:2px; }
  .card-section { font-size:10.5px; line-height:1.16; overflow-wrap:normal; }
  .card-title { display:none; font-size:10px; }
  .card:hover .card-title, .card:focus-visible .card-title { display:-webkit-box; }
  .card-arrow { font-size:11px; grid-row:1; }
  .bio { max-width:calc(100vw - var(--pad) * 2 - var(--safe-left) - var(--safe-right)); padding:12px 12px 10px; margin:0 -12px -10px; bottom:calc(var(--pad) + var(--safe-bottom) + 52px); }
  .bio p { font-size:11px; line-height:1.5; max-width:43ch; }
  .bio .who { margin-bottom:8px; }
  .who b { font-size:16px; }
  .scene-controls { bottom:calc(var(--pad) + var(--safe-bottom)); }
  #motionBtn { min-height:44px; }
  .rows figcaption { padding:28px 10px 10px; font-size:13px; }
  .rows .card-section { font-size:11px; }
  .rows .card-title { font-size:13px; }
  .meta { padding:14px; }
  .lightbox-nav { padding:4px; min-height:52px; }
  #litPrev, #litNext { font-size:11px; padding:8px; }
  #litCount { font-size:10px; }
}
@media (max-width:380px) {
  .card-section { font-size:9.5px; }
  .card .card-label { padding:13px 4px 5px; }
  .bio { bottom:calc(var(--pad) + var(--safe-bottom) + 48px); }
  .bio .who { margin-bottom:0; }
  #motionBtn .motion-label { max-width:110px; white-space:normal; text-align:left; }
}
@media (max-height:520px) and (orientation:landscape) {
  #headline { font-size:clamp(18px, 4.3vh, 25px); }
  .card-title { display:none; }
  .card .card-label { padding-top:14px; }
  .card-section { font-size:8px; }
  .scene-controls { bottom:calc(8px + var(--safe-bottom)); }
  #motionBtn { min-height:36px; padding:6px 10px; }
  .meta { padding:12px; }
}
@media (prefers-reduced-motion:reduce) {
  #cinema .city-plate { animation:none; transform:none; will-change:auto; }
  .film-grain { display:none; }
  .card .card-face img, body.revealed .card .card-face img { animation:none; transform:none; will-change:auto; }
  .card > figure.card-face { transition-duration:.14s; }
}

/* Un ingresso, una sfera e un'immagine continua dal dettaglio al panorama. */
#cityImage { filter:none; }
#cinema .city-shade { background:linear-gradient(180deg,rgba(34,17,10,.12),transparent 35%,rgba(35,17,9,.06) 65%,rgba(23,12,7,.45)); }
.film-grain { opacity:.018; }
#cinema .city-plate { --city-focus:50%; }
#headline { left:50%; top:50%; z-index:25; transform:none !important; font-size:clamp(27px,3.4vw,47px); width:max-content; max-width:90vw; margin:0; translate:-50% 0; white-space:nowrap; }
#headline .inner { position:relative; display:block; width:auto; }
body.revealed #headline .inner > span { transition-delay:0s; transition-duration:.6s; }
.card { transition:none; }
body:not(.revealed) #orb { opacity:0; }
body.assembling #orb { opacity:1; }
body.assembling .card { pointer-events:none; }
.section-nav { position:fixed; z-index:62; right:var(--pad); top:50%; transform:translateY(-50%); width:174px; text-align:right; }
#sectionLinks { display:flex; flex-direction:column; gap:3px; }
#sectionLinks button { display:flex; align-items:center; justify-content:flex-end; gap:12px; min-height:35px; padding:7px 0 7px 12px; font-size:12px; font-weight:400; color:#fff3df; text-shadow:0 1px 10px #21140e,0 1px 4px #21140e; transition:color .3s,transform .4s; }
#sectionLinks button::after { content:""; width:5px; height:5px; border-radius:50%; background:currentColor; opacity:.45; transition:transform .3s,opacity .3s; flex-shrink:0; }
#sectionLinks button:hover,#sectionLinks button:focus-visible { color:#fff; transform:translateX(-6px); }
#sectionLinks button:hover::after,#sectionLinks button:focus-visible::after { transform:scale(1.5); opacity:1; }
#sectionsToggle { display:none; }
body.scene-dialog .section-nav,body.gridview .section-nav { opacity:0; pointer-events:none; transition-delay:0s; }
#stage { transition:opacity .9s,filter 1.1s,scale 1.1s cubic-bezier(.2,.7,.1,1); }
body.lit #stage { opacity:.12; filter:blur(3px); scale:1.1; }
#lit { padding:0; display:block; overflow-y:auto; transition:opacity .75s; background:rgba(24,14,8,.3); }
.plate { width:100%; height:100%; min-height:600px; max-width:none; margin:0; transform:none !important; opacity:1; transition:none; }
.shot { position:absolute; inset:0; width:100%; height:100%; aspect-ratio:auto; border-radius:0; box-shadow:none; overflow:hidden; }
.shot > img { object-fit:cover; border-radius:0; opacity:1; transition:opacity .15s; }
.shot::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(0,0,0,.18),transparent 40%,rgba(14,9,5,.36) 65%,rgba(14,9,5,.9)); }
.shot [data-close] { position:fixed; top:calc(var(--pad) + var(--safe-top)); right:var(--pad); z-index:5; border-radius:999px; padding:10px 18px; background:rgba(20,14,9,.35); }
.meta { position:relative; z-index:3; top:100%; translate:0 -100%; width:min(820px,calc(100% - 230px)); padding:80px 0 55px; margin-left:clamp(24px,6vw,92px); display:block; background:none; border-radius:0; backdrop-filter:none; box-shadow:none; }
#litTitle { font-size:clamp(32px,4.6vw,68px); max-width:17ch; line-height:1.03; margin-bottom:14px; text-shadow:0 3px 24px #1c1009; }
.where { font-size:12px; margin-bottom:18px; }
.note { max-width:60ch; font-size:14px; line-height:1.65; text-shadow:0 1px 6px #1c1009; }
.meta .cta { display:inline-block; margin-top:20px; font-size:13px; }
.lightbox-nav { position:absolute; z-index:4; bottom:48px; right:var(--pad); padding:0; background:transparent; backdrop-filter:none; }
.lightbox-nav button { border:1px solid #ffffff50; border-radius:50% !important; }
.meta,.lightbox-nav,.shot [data-close] { transition:opacity .45s .25s,transform .65s .2s; }
body.shot-opening .meta,body.shot-opening .lightbox-nav,body.shot-opening .shot [data-close],body.shot-closing .meta,body.shot-closing .lightbox-nav { opacity:0; transform:translateY(16px); transition-delay:0s; }
body.shot-opening .shot > img,body.shot-closing .shot > img { opacity:0; }
.flight-image { position:fixed; z-index:110; object-fit:cover; pointer-events:none; max-width:none; box-shadow:0 15px 70px #140c0840; will-change:transform; }
@media(max-width:999px),(max-height:650px) {
  .section-nav { top:calc(70px + var(--safe-top)); right:var(--pad); transform:none; width:185px; }
  #sectionsToggle { display:flex; gap:18px; align-items:center; justify-content:flex-end; min-height:44px; margin-left:auto; font-size:12px; text-shadow:0 2px 8px #140b06; }
  #sectionLinks { background:rgba(24,16,11,.91); backdrop-filter:blur(16px); border-radius:5px; padding:8px 16px; max-height:calc(100dvh - 180px); overflow:auto; display:none; }
  .section-nav.expanded #sectionLinks { display:flex; }
  #sectionLinks button { min-height:40px; }
  .meta { width:calc(100% - 48px); margin-left:24px; padding-bottom:115px; }
  .lightbox-nav { bottom:25px; }
}
@media(max-width:640px) {
  #cinema .city-plate { --city-focus:72%; }
  #headline { font-size:clamp(24px,6.3vw,30px); }
  .plate { min-height:100dvh; }
  #lit { padding:0; }
  #litTitle { font-size:clamp(31px,9vw,44px); }
  .note { font-size:13px; line-height:1.55; }
  .meta { padding-top:50vh; top:auto; translate:none; }
  .shot { min-height:100%; }
  .lightbox-nav { position:fixed; }
  .meta .cta { max-width:100%; }
}
@media(prefers-reduced-motion:reduce) { .flight-image { display:none; } body.lit #stage { scale:1; filter:none; } }
#portal:focus { outline:none; }

/* Portale Barone: lo stesso monogramma del sito originale, senza video o librerie. */
#portal {
  --portal-gold:#ddc493;
  --portal-cream:#f7edd7;
  --portal-zoom:9;
  position:fixed;
  inset:0;
  z-index:220;
  overflow:hidden;
  isolation:isolate;
  color:var(--portal-cream);
  opacity:1;
  pointer-events:auto;
  transition:opacity .32s ease;
}
.portal-curtain {
  position:absolute;
  inset:0;
  z-index:0;
  background:radial-gradient(ellipse at 50% 39%, rgba(43,27,15,.88), rgba(18,11,7,.96) 55%, rgba(9,6,4,.98));
  transition:opacity 1.15s cubic-bezier(.22,.61,.36,1) .3s;
}
.portal-light {
  position:absolute;
  z-index:1;
  top:39%;
  left:50%;
  width:min(68vh, 92vw);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle, rgba(218,176,98,.14), rgba(178,122,52,.04) 39%, transparent 69%);
  transform:translate(-50%,-50%);
  pointer-events:none;
  transition:transform 1.8s cubic-bezier(.17,.65,.25,1), opacity 1.1s ease .45s;
}
#portalDust {
  position:absolute;
  inset:0;
  z-index:3;
  width:100%;
  height:100%;
  pointer-events:none;
  opacity:0;
  transition:opacity .16s linear;
}
.portal-trigger {
  position:absolute;
  z-index:2;
  top:39%;
  left:50%;
  width:min(52vh, 82vw, 460px);
  aspect-ratio:80/88;
  padding:0;
  border:0;
  background:none;
  color:var(--portal-gold);
  cursor:pointer;
  transform:translate(-50%,-50%);
  transform-origin:56% 29%;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  transition:transform 1.8s cubic-bezier(.25,.05,.15,1), opacity .55s ease .65s, filter 1.35s ease .25s;
  will-change:transform, opacity;
}
.portal-symbol {
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
  filter:drop-shadow(0 0 15px rgba(214,167,80,.22));
  transition:filter .5s ease;
}
.portal-body { opacity:.24; }
.portal-points { opacity:.95; }
.portal-edge { opacity:.48; }
.portal-trigger:hover .portal-symbol, .portal-trigger:focus-visible .portal-symbol {
  filter:drop-shadow(0 0 21px rgba(235,189,105,.42)) drop-shadow(0 0 4px rgba(255,227,174,.18));
}
.portal-trigger:focus-visible { outline:2px solid var(--portal-gold); outline-offset:14px; border-radius:3px; }
.portal-enter-label {
  position:absolute;
  left:0;
  right:0;
  bottom:-30px;
  display:block;
  min-height:44px;
  padding:14px 0;
  font-family:var(--sans, "Inter", sans-serif);
  font-size:10px;
  font-weight:500;
  line-height:1.4;
  letter-spacing:.24em;
  text-transform:uppercase;
  text-align:center;
  color:var(--portal-cream);
  opacity:.9;
  transition:opacity .25s ease;
}
.portal-copy {
  position:absolute;
  z-index:4;
  left:24px;
  right:24px;
  bottom:calc(11vh + env(safe-area-inset-bottom, 0px));
  display:grid;
  justify-items:center;
  gap:11px;
  text-align:center;
  pointer-events:none;
  transition:opacity .35s ease, transform .5s ease;
}
.portal-name { margin:0; color:var(--portal-gold); font:500 9px/1.4 var(--sans, "Inter", sans-serif); letter-spacing:.34em; text-transform:uppercase; }
.portal-sign { margin:0; color:var(--portal-cream); font:400 clamp(22px, 2.3vw, 30px)/1.2 var(--serif, "Playfair Display", serif); }
.portal-skip {
  position:absolute;
  z-index:5;
  right:calc(var(--pad, 24px) + env(safe-area-inset-right, 0px));
  bottom:calc(var(--pad, 24px) + env(safe-area-inset-bottom, 0px));
  min-height:44px;
  padding:10px 4px;
  color:rgba(247,237,215,.65);
  font:300 11px/1.4 var(--sans, "Inter", sans-serif);
  text-decoration:underline;
  text-underline-offset:5px;
  text-decoration-color:rgba(221,196,147,.35);
  background:none;
  border:0;
  transition:color .2s ease, opacity .25s ease;
}
.portal-skip:hover { color:var(--portal-cream); }

/* Root imposta .is-entering una sola volta: titolo e menu attendono il passaggio. */
#portal.is-entering { pointer-events:none; }
#portal.is-entering .portal-curtain { opacity:0; }
#portal.is-entering .portal-trigger { transform:translate(-50%,-50%) scale(var(--portal-zoom)); opacity:0; filter:blur(7px); }
#portal.is-entering .portal-light { transform:translate(-50%,-50%) scale(2.4); opacity:0; }
#portal.is-entering .portal-copy { opacity:0; transform:translateY(-8px); }
#portal.is-entering .portal-enter-label, #portal.is-entering .portal-skip { opacity:0; }
#portal.is-entering #portalDust { opacity:1; }
#portal.is-complete { opacity:0; pointer-events:none; }
#portal.is-complete #portalDust { opacity:0; }

@media (max-width:640px) {
  .portal-trigger { width:min(52vh, 86vw); }
  .portal-copy { bottom:calc(11vh + env(safe-area-inset-bottom, 0px)); }
  .portal-name { font-size:8px; letter-spacing:.27em; }
  .portal-enter-label { bottom:-22px; font-size:9px; }
}
@media (max-height:560px) and (orientation:landscape) {
  .portal-trigger { top:35%; width:min(46vh, 42vw); }
  .portal-light { top:35%; }
  .portal-copy { bottom:calc(8vh + env(safe-area-inset-bottom, 0px)); gap:6px; }
  .portal-sign { font-size:20px; }
  .portal-enter-label { bottom:-20px; padding:10px 0; }
}
@media (prefers-reduced-motion:reduce) {
  #portal, .portal-curtain, .portal-trigger, .portal-copy, .portal-light { transition:opacity .14s linear; }
  #portal.is-entering .portal-trigger { transform:translate(-50%,-50%); filter:none; }
  #portal.is-entering .portal-light { transform:translate(-50%,-50%); }
  #portalDust { display:none; }
}

/* Logo originale Barone: proporzioni native e spazio per i controlli su mobile. */
.brand-block { flex:0 1 330px; width:330px; max-width:330px; min-width:0; text-align:left; }
.brand-block .wordmark { display:inline-flex; position:relative; width:144px; max-width:100%; padding:0; line-height:0; vertical-align:top; border-radius:3px; }
.brand-block .wordmark:focus-visible { outline:2px solid #f9dca9; outline-offset:5px; }
.brand-logo { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:contain; filter:drop-shadow(0 2px 8px #20130c85); }
.brand-copy { margin:10px 0 0; max-width:330px; color:#fff4e5; font-family:var(--sans,"Inter",sans-serif); font-size:13px; font-weight:400; line-height:1.55; letter-spacing:0; text-shadow:0 1px 3px #1a100a,0 2px 12px #1a100a,0 0 24px #1a100a99; }
.brand-copy strong { font-weight:500; color:#fff; }
.brand-statement,.brand-belief { display:block; }
.brand-statement { font-weight:500; color:#fff; }
.brand-belief { margin-top:4px; }
.brand-requirements { margin:8px 0 0; max-width:320px; color:#ecdeca; font-family:var(--sans,"Inter",sans-serif); font-size:11px; font-weight:400; line-height:1.6; letter-spacing:0; text-shadow:0 1px 3px #1a100a,0 2px 12px #1a100a; }
.brand-requirements span { white-space:nowrap; color:#fff5e6; font-weight:500; }

/* Le righe cliccabili restano ferme; si muove solo il contenuto visuale. */
.section-nav { width:260px; overflow:visible; }
.section-nav #sectionLinks { gap:2px; overflow:visible; }
.section-nav #sectionLinks button { width:100%; min-height:44px; padding:5px 0 5px 12px; font-size:14px; font-weight:500; line-height:1.35; overflow:visible; transform:none; transform-origin:100% 50%; color:#fff1dc; transition:color .22s ease; }
.section-nav #sectionLinks button:hover,.section-nav #sectionLinks button:focus-visible { transform:none; color:#ffd16c; }
.section-nav #sectionLinks.dock-ready button { gap:0; color:rgb(255 calc(241 - 32 * var(--dock-weight,0)) calc(220 - 112 * var(--dock-weight,0))); }
.section-nav #sectionLinks.dock-ready button::after { display:none; }
.section-dock-visual { display:inline-flex; align-items:center; justify-content:flex-end; gap:13px; max-width:none; white-space:nowrap; pointer-events:none; transform-origin:100% 50%; transform:translate3d(var(--dock-x,0px),0,0) scale(var(--dock-scale,1)); transition:transform .24s cubic-bezier(.2,.75,.25,1),color .2s; text-shadow:0 1px 3px #21140e,0 2px 14px #21140e,0 0 24px #21140e80; }
.section-dock-dot { width:4px; height:4px; border-radius:50%; flex:0 0 4px; background:currentColor; opacity:calc(.4 + var(--dock-weight,0) * .6); }
.section-nav #sectionLinks button.dock-nearest { color:#ffd16c; }
.section-nav #sectionLinks.dock-ready button:hover,.section-nav #sectionLinks.dock-ready button:focus-visible { color:#ffd16c; }
.section-nav #sectionLinks button.dock-nearest .section-dock-visual { text-shadow:0 1px 3px #21140e,0 2px 14px #21140e,0 0 13px #ffc65a59; }
.section-nav #sectionLinks.dock-ready button:focus-visible { outline:none; }
.section-nav #sectionLinks.dock-ready button:focus-visible .section-dock-visual { outline:2px solid #f9dca9; outline-offset:7px; border-radius:1px; }
@media (hover:hover) and (pointer:fine) and (min-width:1000px) and (min-height:651px) {
  .section-nav #sectionLinks:not(.dock-ready) button:hover { transform:translateX(-28px) scale(1.5); }
}
@media (max-width:999px),(max-height:650px) {
  .section-nav { width:205px; }
  .section-nav #sectionLinks { padding:8px 18px; gap:4px; overflow:auto; }
  .section-nav #sectionLinks button { min-height:44px; padding-left:0; font-size:13px; }
  .section-dock-visual { transform:none; gap:12px; }
  .section-nav #sectionLinks.dock-ready button:focus-visible .section-dock-visual { outline-offset:4px; }
}
@media (max-width:640px) {
  .brand-block { flex-basis:248px; width:248px; max-width:calc(100vw - 96px - var(--safe-left,0px) - var(--safe-right,0px)); }
  .brand-block .wordmark { width:108px; }
  .brand-copy { margin-top:8px; font-size:11.5px; line-height:1.45; max-width:248px; }
  .brand-belief { margin-top:3px; }
  .brand-requirements { margin-top:7px; font-size:10px; line-height:1.45; max-width:248px; }
}
@media (max-height:420px) and (orientation:landscape) {
  .brand-block .wordmark { width:96px; }
  .brand-copy { margin-top:7px; font-size:11px; line-height:1.4; }
  .brand-requirements { margin-top:4px; font-size:9px; line-height:1.4; }
}
@media (prefers-reduced-motion:reduce) {
  .section-dock-visual { transform:none; transition:none; }
  .section-nav #sectionLinks:not(.dock-ready) button:hover { transform:none; }
}

/* La fotografia avanza sul proprio piano: nessuna giravolta al passaggio. */
#cityLights { mix-blend-mode:normal; opacity:1; }
.card:hover > figure.card-face,.card:focus-visible > figure.card-face { transform:translateZ(.5px); }
.card:hover > figure.card-back,.card:focus-visible > figure.card-back { transform:rotateY(180deg) translateZ(.5px); }
.card.is-hovered .card-title { display:none; }
#hoverNote { position:fixed; z-index:64; left:0; top:0; width:max-content; max-width:min(255px,70vw); padding:10px 14px; border-radius:4px; background:rgba(31,20,12,.9); color:#fff4dc; border:1px solid #dec29445; box-shadow:0 12px 35px #160c0640; opacity:0; translate:0 7px; pointer-events:none; transition:opacity .3s,translate .4s; backdrop-filter:blur(12px); }
#hoverNote.visible { opacity:1; translate:0 0; }
#hoverNote b { display:block; font:500 13px/1.4 var(--sans); }
#hoverNote span { display:block; margin-top:3px; font:400 16px/1.3 var(--serif); }
#dot { mix-blend-mode:normal; background:rgba(255,225,170,.6); border-color:rgba(255,235,190,.18); }
#dot.wide { background:rgba(255,225,170,.07); border-color:rgba(255,235,190,.6); }
@media(hover:none),(pointer:coarse) { #hoverNote { display:none; } }
@media(prefers-reduced-motion:reduce) { #hoverNote { transition:none; } }

/* Le sezioni scorrono davanti alla stessa immagine cinematografica. */
#lit {
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:0;
  scroll-padding:96px 0 140px;
}
#lit .plate { width:100%; max-width:none; height:auto; min-height:100vh; min-height:100dvh; margin:0; }
#lit .shot { position:static; width:100%; height:0; min-height:0; aspect-ratio:auto; overflow:visible; background:none; box-shadow:none; }
#lit .shot > img { position:fixed; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; }
#lit .shot::after { position:fixed; inset:0; z-index:1; background:linear-gradient(90deg,rgba(19,12,7,.35),rgba(19,12,7,.07)),linear-gradient(180deg,rgba(14,9,5,.08),rgba(14,9,5,.2) 28%,rgba(14,9,5,.7) 70%,rgba(14,9,5,.84)); }
#lit .shot [data-close] { position:fixed; top:calc(var(--pad) + var(--safe-top)); right:calc(var(--pad) + var(--safe-right)); z-index:5; }
#lit .meta {
  position:relative;
  top:auto;
  translate:none;
  width:min(760px,calc(100% - 230px));
  margin:0 0 0 clamp(24px,6vw,92px);
  padding:40vh 0 150px;
  display:block;
  border-radius:0;
  background:none;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  color:#f3ece1;
  text-shadow:0 1px 12px rgba(14,9,5,.5);
}
#lit .meta::before {
  content:"";
  position:absolute;
  z-index:-1;
  top:calc(40vh - 56px);
  right:-28px;
  bottom:78px;
  left:-28px;
  pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(20,13,8,.73) 58px,rgba(20,13,8,.79) calc(100% - 58px),transparent);
  filter:blur(15px);
}
#lit .note { max-width:64ch; font-size:15px; line-height:1.72; color:#f3ece1; }
#lit #litAction { margin-top:34px; }
#lit #litAction[hidden] { display:none; }
#lit .lightbox-nav {
  position:fixed;
  right:calc(var(--pad) + var(--safe-right));
  bottom:calc(24px + var(--safe-bottom));
  z-index:4;
  width:auto;
  padding:8px;
  border-radius:999px;
  background:rgba(20,13,8,.82);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 4px 28px #0e090540;
}
#lit .barone-section-detail { margin-top:32px; max-width:100%; color:#f3ece1; font-size:15px; line-height:1.72; overflow-wrap:anywhere; }
#lit .barone-section-detail:empty { display:none; }
#lit .barone-section-detail p { margin:0; }
#lit .section-title { margin:0 0 12px; font-family:var(--serif); font-size:clamp(26px,2.5vw,35px); font-weight:400; line-height:1.14; letter-spacing:-.015em; color:#fff6e6; }
#lit .section-subtitle { margin:0 0 7px; font-family:var(--sans); font-size:14px; line-height:1.5; font-weight:500; color:#eed7b1; }
#lit .section-body { max-width:65ch; line-height:1.72; }
#lit .section-body + .section-body { margin-top:14px; }
#lit .section-small { margin-top:14px; font-size:12px; line-height:1.65; color:#d0c4b4; }
#lit .section-kicker { margin-bottom:15px; font-size:10px; font-weight:500; letter-spacing:.14em; line-height:1.5; text-transform:uppercase; color:#dec499; }
#lit .section-supports { display:flex; flex-wrap:wrap; gap:9px 22px; padding:0; margin:0 0 24px; list-style:none; color:#f0d7af; font-size:12px; }
#lit .section-supports li::before { content:"·"; margin-right:9px; color:#d1ad73; }
#lit .section-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 25px; margin-top:21px; }
#lit .section-link { display:inline-flex; align-items:center; justify-content:space-between; gap:20px; max-width:100%; min-height:44px; padding:8px 0; border:0; border-bottom:1px solid #dfc19180; background:none; border-radius:0; font:inherit; font-size:13px; line-height:1.5; color:#f9e6c6; text-align:left; text-decoration:none; cursor:pointer; transition:color .2s,border-color .2s; }
#lit .section-link:hover { color:#fff; border-bottom-color:#fff1d9; }
#lit .section-link-arrow { flex-shrink:0; font-size:18px; line-height:1; transition:transform .25s; }
#lit .section-link:hover .section-link-arrow { transform:translate(2px,-2px); }
#lit .section-points { margin:24px 0; padding-left:20px; }
#lit .section-points li { padding-left:4px; margin:7px 0; }
#lit .section-points li::marker { color:#ddbc84; }
#lit .section-film { border-top:1px solid #dabe8c45; border-bottom:1px solid #dabe8c45; padding:0 0 2px; }
#lit .section-film summary { padding:20px 0; color:#f6dfba; cursor:pointer; font-size:15px; }
#lit .section-film summary::marker { color:#d8b77f; }
#lit .section-film-frame { background:#110d09; }
#lit .section-agency-film { display:block; width:100%; height:auto; aspect-ratio:7/4; max-height:70vh; object-fit:contain; background:#110d09; }
#lit .section-film .section-small { margin:14px 0 22px; }
#lit .section-method { list-style:none; padding:0; margin:0; }
#lit .section-method-step { display:grid; grid-template-columns:36px minmax(0,1fr); gap:20px; padding:25px 0; border-top:1px solid #dabe8c38; }
#lit .section-method-step:first-child { padding-top:8px; border-top:0; }
#lit .section-step-number { padding-top:5px; font-size:11px; letter-spacing:.1em; color:#e6c28c; }
#lit .section-method .section-title { font-size:clamp(25px,2.25vw,32px); }
#lit .section-tabs { display:flex; flex-wrap:wrap; gap:4px; padding-bottom:15px; border-bottom:1px solid #dabe8c45; margin:0 0 25px; }
#lit .section-tab { min-width:100px; min-height:44px; padding:10px 18px; border:1px solid transparent; border-radius:2px; font:inherit; font-size:13px; color:#c9bdac; background:transparent; cursor:pointer; transition:background .25s,color .25s,border-color .25s; }
#lit .section-tab:hover { color:#fff5e4; background:#dec0930d; }
#lit .section-tab[aria-selected="true"] { border-color:#ddbc8459; color:#ffe9c8; background:#d4ac6b21; }
#lit .section-tabpanel { padding:0; outline-offset:10px; }
#lit .section-tabpanel[hidden] { display:none; }
#lit .section-aside { margin-top:22px; color:#e5cda7; font-size:13px; line-height:1.7; }
#lit .section-agent-step { margin-top:25px; }
#lit .section-shared { margin-top:40px; padding-top:34px; border-top:1px solid #dabe8c45; }
#lit .section-shared .section-title { font-size:28px; }
#lit .section-benefits { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 28px; padding:0; list-style:none; margin:23px 0; }
#lit .section-benefits li { display:flex; gap:12px; font-size:13px; line-height:1.6; }
#lit .section-benefits li::before { content:"✦"; flex-shrink:0; color:#caa16c; font-size:11px; margin-top:2px; }
#lit .section-book { padding:3px 0 6px; }
#lit .section-book-rows { list-style:none; padding:0; margin:22px 0; counter-reset:book-steps; }
#lit .section-book-rows li { display:flex; align-items:baseline; gap:15px; padding:12px 0; border-bottom:1px solid #dabe8c28; counter-increment:book-steps; }
#lit .section-book-guide li::before { content:counter(book-steps,decimal-leading-zero); color:#d8b67e; font-size:11px; min-width:20px; }
#lit .section-book-checklist li::before { content:"✓"; color:#d8b67e; min-width:20px; }
#lit .section-timeline-time { flex:0 0 84px; font-size:11px; color:#dec499; font-variant-numeric:tabular-nums; }
#lit .section-book-line { font-size:14px; }
#lit .section-kit-price { display:flex; align-items:baseline; flex-wrap:wrap; gap:15px; margin-top:28px; }
#lit .section-kit-price strong { font-family:var(--serif); font-weight:400; font-size:35px; color:#fff0d7; }
#lit .section-kit-price > span { font-size:12px; color:#dbc5a3; }
#lit .section-member-note { margin-top:35px; padding-top:25px; border-top:1px solid #dabe8c45; font-size:14px; }
#lit .section-member-note > .section-body:not(:first-child) { margin-top:25px; }
#lit .section-faq { border-top:1px solid #dabe8c45; }
#lit .section-faq:last-child { border-bottom:1px solid #dabe8c45; }
#lit .section-faq summary { padding:22px 30px 22px 0; color:#fff0d9; line-height:1.5; font-size:16px; cursor:pointer; }
#lit .section-faq summary::marker { color:#cbaa76; }
#lit .section-faq-answer { padding:0 0 24px; color:#e3dacd; font-size:14px; line-height:1.8; }
#lit .section-contacts { display:grid; gap:0; }
#lit .section-contact-link { display:flex; justify-content:space-between; align-items:center; gap:22px; padding:20px 0; min-height:54px; border-bottom:1px solid #dabe8c45; color:#f5e4c9; font-size:16px; line-height:1.5; text-decoration:none; transition:color .2s; }
#lit .section-contact-link:hover { color:#fff; }
#lit .section-related { margin-top:42px; padding-top:4px; }
#lit .section-related .section-title { font-size:31px; }
#lit .section-footer { margin-top:42px; padding-top:28px; border-top:1px solid #dabe8c30; }
#lit .section-footer-motto { font-family:var(--serif); font-size:24px; color:#e9d5b6; }
#lit .section-footer .section-small { margin-top:8px; font-size:10px; }
#lit .barone-section-detail :is(a,button,summary,video,[tabindex="0"]):focus-visible { outline:2px solid #edcd96; outline-offset:5px; }
@media (max-width:999px) {
  #lit .meta { width:min(760px,calc(100% - 64px)); margin-left:32px; padding-bottom:150px; }
  #lit .lightbox-nav { bottom:calc(20px + var(--safe-bottom)); }
}
@media (max-width:640px) {
  #lit { scroll-padding-top:80px; scroll-padding-bottom:125px; }
  #lit .meta { width:calc(100% - 40px); margin-left:20px; padding-top:38vh; padding-bottom:calc(145px + var(--safe-bottom)); }
  #lit .meta::before { top:calc(38vh - 48px); right:-14px; left:-14px; bottom:70px; filter:blur(9px); }
  #lit .shot::after { background:linear-gradient(180deg,rgba(14,9,5,.1),rgba(14,9,5,.27) 24%,rgba(14,9,5,.75) 60%,rgba(14,9,5,.89)); }
  #lit .shot [data-close] { top:calc(16px + var(--safe-top)); right:calc(16px + var(--safe-right)); }
  #lit .note,#lit .barone-section-detail { font-size:14px; line-height:1.75; }
  #lit .barone-section-detail { margin-top:27px; }
  #lit .section-supports { gap:8px 16px; font-size:11px; }
  #lit .section-method-step { grid-template-columns:25px minmax(0,1fr); gap:12px; padding:22px 0; }
  #lit .section-tab { flex:1; min-width:0; padding:10px 12px; }
  #lit .section-benefits { grid-template-columns:1fr; gap:14px; }
  #lit .section-contact-link { font-size:14px; gap:14px; }
  #lit .section-faq summary { font-size:15px; padding:19px 0; }
  #lit .section-book-line { font-size:13px; }
  #lit .section-book-rows li { gap:12px; }
  #lit .section-timeline-time { flex-basis:76px; font-size:10px; }
  #lit .section-actions { gap:12px; }
  #lit .section-link { font-size:12px; }
  #lit .lightbox-nav { right:calc(16px + var(--safe-right)); bottom:calc(16px + var(--safe-bottom)); padding:7px; }
}
@media (max-height:650px) and (min-width:641px) {
  #lit .meta { padding-top:30vh; }
  #lit .meta::before { top:calc(30vh - 48px); }
}
@media (prefers-reduced-motion:reduce) {
  #lit .section-link,#lit .section-link-arrow,#lit .section-tab,#lit .section-contact-link { transition:none; }
}

/* Preserve the photographic crop while giving the selected image a 2x raster
   surface. Native source pixels are used; this does not invent new detail. */
.card .card-face img, body.revealed .card .card-face img {
  --film-start-scale:1.14;
  --film-end-scale:1.26;
  --film-start-pan:-.4;
  --film-end-pan:1;
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  max-width:none;
  animation-name:cardFilmV6;
  will-change:auto;
  filter:none;
  transition:opacity .8s ease-out;
}
.card.photo-sharp .card-face img, body.revealed .card.photo-sharp .card-face img {
  --film-start-scale:.57;
  --film-end-scale:.63;
  --film-start-pan:-.2;
  --film-end-pan:.5;
  left:-50%;
  top:-50%;
  width:200%;
  height:200%;
}
.card:hover .card-face img, .card:focus-visible .card-face img { filter:none; }
@keyframes cardFilmV6 {
  from { transform:translate3d(calc(var(--pan-x,3%) * var(--film-start-pan)),calc(var(--pan-y,2%) * var(--film-start-pan)),0) scale(var(--film-start-scale)) rotate(calc(var(--img-rot,.3deg) * -.5)); }
  to { transform:translate3d(calc(var(--pan-x,3%) * var(--film-end-pan)),calc(var(--pan-y,2%) * var(--film-end-pan)),0) scale(var(--film-end-scale)) rotate(var(--img-rot,.3deg)); }
}
/* Only the visible side of each 3D card needs a running image animation. */
body.revealed .card.photo-front > .card-back img,
body.revealed .card.photo-back > .card-face:not(.card-back) img,
body.revealed .card.photo-offscreen .card-face img {
  animation-play-state:paused !important;
}
body.scene-hidden .city-plate,
body.scene-dialog .city-plate,
body.gridview .city-plate { will-change:auto; }
@media (prefers-reduced-motion:reduce) {
  .card .card-face img, body.revealed .card .card-face img { animation:none; transform:none; }
  .card.photo-sharp .card-face img, body.revealed .card.photo-sharp .card-face img { transform:scale(.5); }
}

/* Lingua, audio e menu condividono un solo gruppo senza comprimere la firma. */
header.chrome .header-tools { display:flex; align-items:center; justify-content:flex-end; flex:0 0 auto; gap:14px; margin-left:auto; align-self:flex-start; }
.site-language { display:inline-flex; align-items:center; flex:0 0 auto; position:relative; color:#fff6e7; }
.site-language::after { content:'⌄'; position:absolute; right:7px; top:50%; transform:translateY(-55%); font-size:12px; pointer-events:none; }
.site-language select { appearance:none; -webkit-appearance:none; min-width:55px; min-height:44px; padding:8px 20px 8px 8px; border:0; border-radius:3px; color:inherit; background:transparent; font-family:var(--sans,"Inter",sans-serif); font-size:11px; font-weight:500; letter-spacing:.06em; line-height:1.2; cursor:pointer; text-shadow:0 1px 4px #20130c; }
.site-language select:hover { color:#ffe0a3; }
.site-language select:focus-visible { outline:2px solid #f9dca9; outline-offset:3px; }
.site-language option { color:#fff5e7; background:#23170f; text-shadow:none; }
@media(max-width:640px) {
  header.chrome { align-items:flex-start; }
  header.chrome .header-tools { flex-direction:column; align-items:center; justify-content:flex-start; width:48px; min-width:48px; gap:3px; }
  .header-tools #menuBtn { order:0; min-width:44px; min-height:44px; margin:0; padding:8px; justify-content:center; }
  .header-tools #menuBtn .menu-label { display:none; }
  .header-tools .site-language { order:1; width:48px; }
  .header-tools .site-language select { width:48px; min-width:48px; padding-left:7px; padding-right:16px; }
  .header-tools .site-language::after { right:5px; }
  .header-tools #soundBtn { order:2; margin:0; }
  .header-tools #soundBtn .sound-label { display:none; }
  .section-nav { top:calc(var(--pad) * .8 + 146px + var(--safe-top)); }
  .section-nav #sectionLinks { max-height:calc(100dvh - 230px - var(--safe-top)); }
  html[lang="en"] #headline { font-size:clamp(21px,5.5vw,28px); }
}
@media(max-height:420px) and (orientation:landscape) {
  header.chrome .header-tools { flex-direction:row; width:auto; gap:8px; }
  .section-nav { top:calc(62px + var(--safe-top)); }
  .section-nav #sectionLinks { max-height:calc(100dvh - 135px - var(--safe-top)); }
}

.header-tools{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-left:auto}
#soundBtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding:6px;color:inherit;font-size:11px;line-height:1.2;border-radius:3px;opacity:.78}
#soundBtn:hover,#soundBtn:focus-visible,#soundBtn[aria-pressed=true]{opacity:1;color:#f7ddb0}
#soundBtn.is-paused{opacity:.6}
#soundBtn:disabled{opacity:.35;cursor:default}
.sound-icon{display:block;width:19px;height:19px;flex:none}
.sound-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sound-slash,#soundBtn[aria-pressed=false] .sound-wave{display:none}
#soundBtn[aria-pressed=false] .sound-slash{display:block}
@media(max-width:640px){#soundBtn .sound-label{display:none}}

/* Una falce d'oro sul margine destro: la scena resta visibile attraverso la patina. */
.section-nav { --dock-height:306px; isolation:isolate; right:0; width:300px; height:var(--dock-height); pointer-events:none; }
.section-nav::before { content:""; position:absolute; z-index:-1; pointer-events:none; top:-65px; left:-65px; width:calc(100% + 65px); height:calc(var(--dock-height) + 130px); border-radius:50% 0 0 50%; background:radial-gradient(ellipse at 100% 50%,rgba(5,4,3,.8),rgba(7,5,3,.56) 38%,rgba(8,6,3,.18) 64%,transparent 79%); opacity:calc(.55 + var(--dock-open,0) * .41); transform-origin:100% 50%; transform:scale(calc(.42 + .58 * var(--dock-open,0)),calc(.4 + .6 * var(--dock-open,0))); }
.section-nav.dock-open { pointer-events:auto; }
.section-dock-trigger { display:block; position:absolute; top:50%; right:6px; translate:0 -50%; z-index:3; width:144px; height:140px; padding:0; border:0; border-radius:30px; background:transparent; pointer-events:auto; }
.section-dock-trigger:focus-visible { outline:2px solid #e8c57d; outline-offset:3px; }
.section-nav.dock-open .section-dock-trigger { opacity:0; pointer-events:none; }
.section-nav #sectionLinks { position:relative; width:100%; height:var(--dock-height); max-height:none; display:block; padding:0; gap:0; background:none; border:0; border-radius:0; backdrop-filter:none; overflow:visible; pointer-events:none; }
.section-nav #sectionLinks button { position:absolute; z-index:1; display:flex; align-items:center; justify-content:flex-end; min-height:44px; margin:0; padding:0; overflow:visible; pointer-events:none; font:500 13.5px/1.35 var(--sans); letter-spacing:.01em; transform:none; transition:none; }
.section-nav.dock-interactive #sectionLinks button { pointer-events:auto; }
.section-nav #sectionLinks.dock-ready button,
.section-nav #sectionLinks.dock-ready button:hover,
.section-nav #sectionLinks.dock-ready button:focus-visible { color:rgb(calc(237 + 15 * var(--dock-weight,0)) calc(196 + 26 * var(--dock-weight,0)) calc(123 + 32 * var(--dock-weight,0))); transform:none; }
.section-dock-visual { position:relative; gap:calc(5px + 8px * var(--dock-open,0)); transform-origin:calc(100% - 3px) 50%; transition:none; text-shadow:0 1px 3px #000,0 2px 12px #0009; }
.section-dock-label { font-size:calc(10px + 3.5px * var(--dock-open,0)); line-height:1.35; opacity:calc(.96 + .04 * var(--dock-weight,0)); }
.section-dock-dot { width:6px; height:6px; flex:0 0 6px; opacity:calc(.8 + .2 * var(--dock-weight,0)); box-shadow:0 0 10px #f3c46d30; transform:scale(calc(.68 + .32 * var(--dock-open,0))); }
.section-nav #sectionLinks button.dock-nearest .section-dock-visual { text-shadow:0 1px 3px #000,0 2px 14px #000a,0 0 17px #edbd6430; }
.section-dock-orbit { position:absolute; inset:0; width:100%; overflow:hidden; pointer-events:none; }
.section-dock-line,.section-dock-halo { fill:none; vector-effect:non-scaling-stroke; stroke-linecap:round; }
.section-dock-line { stroke:url(#sectionDockGold); stroke-width:1; }
.section-dock-halo { stroke:#f0c37a; stroke-width:5; opacity:.065; }
@media(max-width:999px),(max-height:650px) {
  .section-dock-trigger { display:none; }
  .section-nav { width:min(300px,100vw); height:auto; }
  .section-nav::before { top:-30px; opacity:0; }
  .section-nav.expanded::before { opacity:.96; }
  .section-nav #sectionsToggle { pointer-events:auto; min-height:44px; margin-right:var(--pad); padding:8px 12px; gap:14px; color:#e4bd73; background:rgba(7,5,3,.3); border:1px solid #d8b67530; border-radius:24px; }
  .section-nav #sectionLinks { display:none; height:var(--dock-height); max-height:var(--dock-visible-height,calc(100dvh - 240px)); margin-top:16px; overflow-y:auto; overflow-x:clip; overscroll-behavior:contain; scrollbar-width:thin; scroll-padding-block:12px; }
  .section-nav.expanded #sectionLinks { display:block; }
  .section-nav #sectionLinks button { font-size:13px; }
  .section-dock-label { font-size:inherit; }
  .section-dock-visual { gap:11px; }
  .section-nav #sectionLinks.dock-ready button:focus-visible .section-dock-visual { outline-offset:3px; }
}
@media(prefers-reduced-motion:reduce) {
  .section-nav::before,.section-dock-visual { transition:none; }
}

  
/* Adatta l'assistente pubblico alla nuova scena, senza modificare il widget. */
body:not(.revealed) #barone-chat-launcher,
body:not(.revealed) #barone-chat-frame { visibility:hidden; pointer-events:none; }
body #barone-chat-launcher { bottom:calc(var(--pad) + var(--safe-bottom) + 57px); right:var(--pad); font-family:var(--sans); }
body #barone-chat-frame { bottom:calc(var(--pad) + var(--safe-bottom) + 113px); height:min(650px,calc(100dvh - 165px)); }
body.assistant-open .bio { pointer-events:none; }
/* Il menu a tendina deve ricevere tutti i tocchi anche sugli schermi bassi. */
@media(max-height:500px) and (orientation:landscape) {
  body:not(.original-scene-open):not(.gridview):not(.menu-open):not(.assistant-open) #sectionNav.expanded ~ #barone-chat-launcher,
  body:not(.original-scene-open):not(.gridview):not(.menu-open):not(.assistant-open) #sectionNav.expanded ~ .scene-controls { visibility:hidden; pointer-events:none; }
}
@media(max-width:640px) {
  body #barone-chat-launcher { left:var(--pad); right:auto; bottom:calc(var(--pad) + var(--safe-bottom)); padding:10px 12px; min-height:44px; font-size:11px; }
  body #barone-chat-frame { inset:8px 8px calc(var(--pad) + var(--safe-bottom) + 54px); width:auto; height:auto; }
  body.deep #barone-chat-launcher,body.gridview #barone-chat-launcher { bottom:calc(var(--pad) + var(--safe-bottom) + 54px); }
}

#originalScenes{position:fixed;inset:0;z-index:130;background:#080706;opacity:0}
#originalScenes[hidden],#sceneDissolve[hidden]{display:none!important}
#originalSceneFrame{display:block;border:0;width:100%;height:100%;background:#080706}
#sceneDissolve{position:fixed;inset:0;z-index:220;pointer-events:auto;display:grid;place-content:center;gap:16px;text-align:center;color:#ffebbf}
#sceneDissolve canvas{position:absolute;inset:0;pointer-events:none}
.scene-wait,.scene-cancel{position:relative;z-index:1;font:13px/1.6 var(--sans);text-shadow:0 2px 8px #000}
.scene-wait{padding:15px 20px;background:#16110de8;border-radius:3px;max-width:320px}
.scene-cancel{padding:10px 16px;min-height:44px;background:#16110de8;border:1px solid #b18d50;border-radius:3px;justify-self:center}
.original-scene-open #stage,.original-scene-open #cinema,.original-scene-open .vig{opacity:calc(1 - var(--scene-dissolve,0));pointer-events:none}
.original-scene-open #grid{visibility:hidden!important;pointer-events:none}
.original-scene-open #stage{scale:calc(1 + var(--scene-dissolve,0)*.15);filter:blur(calc(var(--scene-dissolve,0)*5px))}
.original-scene-open>.chrome,.original-scene-open>.cue,.original-scene-open>#menu,.original-scene-open>#dot,.original-scene-open>.scene-controls,.original-scene-open>#gridBtn{opacity:0!important;pointer-events:none!important;visibility:hidden}
.original-scene-open .card-face,.original-scene-open .card-back,.original-scene-open #cinema *{animation-play-state:paused!important}
.original-scene-open #barone-chat-launcher{z-index:170;bottom:20px}
.original-scene-open #barone-chat-frame{z-index:180;bottom:76px;height:min(650px,calc(100dvh - 110px))}
.scene-travelling #barone-chat-launcher{visibility:hidden;pointer-events:none}
.scene-cancel:focus-visible{outline:2px solid #ffe1a3;outline-offset:3px}
@media(max-width:760px){.original-scene-open #barone-chat-launcher{left:auto;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));font-size:10px}.original-scene-open #barone-chat-frame{bottom:calc(68px + env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.original-scene-open #stage{scale:1;filter:none}}

#splash,#portal>.portal-trigger,#portal>.portal-copy,#portal>.portal-skip,#portal>.portal-light,#portal>.portal-curtain,#portalDust{display:none!important}
#portal{background:#000}
html{scrollbar-width:none}
html::-webkit-scrollbar{display:none}
#portal.is-entering{background:transparent;transition:background .8s ease .3s}
#publishedIntroFrame{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000;z-index:5;opacity:1}
#publishedIntroFrame[hidden]{display:none}
#portal.is-entering #publishedIntroFrame{opacity:0;pointer-events:none;transition:opacity .7s ease .25s}
.returning-scene #stage,.returning-scene #cinema,.returning-scene>.chrome{visibility:hidden!important}
.published-intro-fallback{position:absolute;inset:0;z-index:6;background:#080706;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:22px;color:#f5ead0;font-family:var(--sans)}
.published-intro-fallback img{width:180px;height:auto}
.published-intro-fallback button{min-height:44px;padding:12px 22px;border:1px solid #dcc49680;color:#dcc496;font:inherit;font-size:12px}
@media(prefers-reduced-motion:reduce){#portal.is-entering #publishedIntroFrame{transition:opacity .14s ease}}

/* La superficie fotografica curva sostituisce temporaneamente tutte le facce DOM.
   Gli stessi piani già aperti riappaiono soltanto al termine del morph WebGL. */
body.particle-forming #portal > canvas.photo-globe{display:block!important;position:absolute;inset:0;z-index:7;pointer-events:none;width:100%;height:100%}
body.particle-forming #portal > canvas.sphere-formation{display:block!important;position:absolute;inset:0;z-index:8;pointer-events:none;width:100%;height:100%}
body.particle-forming #orb .card > .card-face,body.particle-forming #orb .card > .card-back{opacity:var(--formation-dom,0)!important;transition:none!important}
body.particle-forming #orb .card > .card-face img{animation-play-state:paused!important}
body.particle-forming #cinema{opacity:var(--formation-scene,0);transition:none!important}
body.particle-forming #headline{opacity:var(--formation-title,0);transition:none!important}
body.particle-forming > .chrome,body.particle-forming > .cue,body.particle-forming > .scene-controls{opacity:var(--formation-chrome,0)!important;pointer-events:none!important;transition:none!important}
body.particle-forming #stage{pointer-events:none!important}
body.particle-forming #barone-chat-launcher,body.particle-forming #barone-chat-frame{visibility:hidden!important;pointer-events:none!important}
@media(prefers-reduced-motion:reduce){body.particle-forming #portal > canvas.sphere-formation,body.particle-forming #portal > canvas.photo-globe{display:none!important}}
