/* Banner styles only; original V64 header stylesheet precedes this file. */
:root{--banner-paper:#f1eee6}html{scroll-behavior:auto}body{background:var(--banner-paper)}
.stage:before{content:none}
.journey{height:255vh;position:relative}.stage{height:100vh;position:sticky;top:0;overflow:hidden;isolation:isolate;background:var(--banner-paper);padding-top:var(--nav-h)}
.grain{position:absolute;inset:0;pointer-events:none;opacity:.14;background-image:radial-gradient(circle at 36% 18%,rgba(190,164,115,.18),transparent 40%),radial-gradient(circle at 72% 74%,rgba(190,164,115,.14),transparent 50%)}
.initial-heading{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);z-index:3;pointer-events:none;white-space:nowrap;text-align:center}
.initial-heading h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(70px,9vw,124px);letter-spacing:.045em;line-height:.9;font-weight:400;margin:0;color:#171410}
.tile{position:absolute;top:0;left:0;overflow:hidden;z-index:5;transform-origin:center center;will-change:transform,width,height;pointer-events:none;background:transparent;box-shadow:0 26px 58px rgba(22,14,8,.16);border:none;border-radius:0}
.tile img,.tile video,.tile .piece{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tile img,.tile video{filter:saturate(.92) contrast(1.03)}.tile video{background:#2b2420}.tile .piece{background-image:url("asset/copertina_finale.png");background-repeat:no-repeat;opacity:0;filter:none}
.poster{position:absolute;left:0;top:0;z-index:8;opacity:0;pointer-events:none;will-change:transform,width,height}.poster img{width:100%;height:100%;display:block;object-fit:cover;filter:none}
.play-button{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:12;width:86px;height:86px;border:1px solid rgba(255,255,255,.9);border-radius:50%;background:rgba(20,17,13,.48);color:white;display:grid;place-items:center;cursor:pointer;transition:background .2s,scale .2s}.play-button::before{content:"";display:block;width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:16px solid white;margin-left:6px}.play-button:hover{background:rgba(13,10,8,.88);scale:1.08}
.film-overlay{position:fixed;inset:0;background:rgba(3,3,4,.97);z-index:200;display:none;align-items:center;justify-content:center;flex-direction:column;padding:clamp(12px,3vw,56px)}.film-overlay.open{display:flex}.film-overlay video{max-width:100%;max-height:calc(100dvh - 100px);width:min(100%,1400px);aspect-ratio:16/9;object-fit:contain;background:black;box-shadow:0 0 100px #000}.close-film{position:absolute;right:26px;top:20px;z-index:105;background:transparent;border:1px solid #fff6;color:white;font-size:11px;letter-spacing:.16em;padding:10px 17px}
button:focus-visible,a:focus-visible{outline:2px solid #cb9c4e;outline-offset:4px}

@media  (max-width:760px) and (max-device-width:899px), (max-width:760px) and (max-width:599px), (max-device-width:684px) and (min-device-width:900px) and (hover:hover) and (pointer:fine) and (min-width:600px){html:not(.ex-optical-desktop) .initial-heading h1{font-size:clamp(38px,11.8vw,68px)}html:not(.ex-optical-desktop) .play-button{width:58px;height:58px}html:not(.ex-optical-desktop) .journey{height:260svh}}
@media (prefers-reduced-motion:reduce){.journey{height:100svh}.initial-heading{display:none}.tile{display:none}}

#film::-webkit-media-controls{display:none!important}

/* Film close control: same #C9A96B as the original logo SVG. */
.film-shell{width:min(100%,1400px,calc((100dvh - clamp(24px,6vw,112px) - 48px) * 16 / 9));display:flex;flex-direction:column;align-items:stretch;gap:4px}
.film-shell .close-film{position:static;align-self:flex-end;flex:0 0 44px;width:44px;height:44px;padding:8px;border:0;display:grid;place-items:center;color:#C9A96B;background:transparent;cursor:pointer;letter-spacing:normal}
.close-film svg{display:block;width:28px;height:28px}
.film-overlay .film-shell video{width:100%;max-height:none;aspect-ratio:16/9}

/* Exclude the source cover's three black top rows, with the same mapping as the seven pieces. */
.poster{overflow:hidden}
.poster img{height:calc(100% * 1145 / 1142);object-fit:fill;transform:translateY(calc(-100% * 3 / 1145))}