.scene{--pad:1rem;--col:calc(var(--pad) + min(36rem, 100vw - 2 * var(--pad)));--enter-seed:var(--enter-seed-l);--enter-clip:var(--enter-clip-l);--edge-clip:var(--edge-clip-l);--enter-open:var(--enter-open-l);--enter-origin:var(--enter-origin-l);--door-origin:var(--door-origin-l);--enter-frame:var(--enter-frame-l);position:relative}.scene__room{background:var(--room-bg,var(--ink));min-height:100svh;display:flex;position:relative;overflow:clip}.scene__photo,.scene__shot,.scene__veil{position:absolute;inset:0}.scene__img,.scene__video{object-fit:cover;object-position:var(--focal-l)}.scene__video{opacity:0;width:100%;height:100%;transition:opacity .6s var(--motion-out);position:absolute;inset:0}.scene__video[data-playing]{opacity:1}.scene__shot>.scene__img{-webkit-mask-image:linear-gradient(to right, transparent, #000 var(--photo-fade,0%));mask-image:linear-gradient(to right, transparent, #000 var(--photo-fade,0%))}.scene__veil{background:linear-gradient(to right, color-mix(in srgb, var(--ink) 88%, transparent), color-mix(in srgb, var(--ink) 68%, transparent) var(--col), transparent calc(var(--col) + 24rem))}.scene[data-scene=forza-italia] .scene__veil:after{content:"";background:color-mix(in srgb, var(--ink) 25%, transparent);position:absolute;inset:0}.scene__snap,.scene__edge{display:none}@media (orientation:landscape){.scene:first-child{--col:calc(var(--pad) + min(36rem, 44vw))}.scene:first-child .scene__text>div{max-width:min(36rem,44vw)}}.scene__text{--text-top:6rem;--text-bottom:3.5rem;width:100%;padding:var(--text-top) var(--pad) var(--text-bottom);flex-direction:column;justify-content:flex-start;display:flex;position:relative}.scene[data-align-l=end] .scene__text{justify-content:flex-end}.scene__count{background:color-mix(in srgb, var(--ink) 72%, transparent);border-radius:999px;padding:.25rem .625rem;position:absolute;bottom:1rem;right:1rem}@media (min-width:640px){.scene{--pad:1.5rem}}@media (min-width:1024px){.scene{--pad:3rem}}@media (orientation:portrait){.scene{--enter-seed:var(--enter-seed-p);--enter-clip:var(--enter-clip-p);--edge-clip:var(--edge-clip-p);--enter-open:var(--enter-open-p);--enter-origin:var(--enter-origin-p);--door-origin:var(--door-origin-p);--enter-frame:var(--enter-frame-p)}.scene__video{object-position:var(--focal-p)}.scene__img{object-position:var(--focal-p);--photo-left:0%;--photo-fade:0%}.scene__text{justify-content:flex-start}.scene[data-align-p=end] .scene__text{justify-content:flex-end}.scene__veil{background:linear-gradient(to bottom, color-mix(in srgb, var(--ink) 90%, transparent), color-mix(in srgb, var(--ink) 55%, transparent) 45%, transparent 75%)}.scene[data-align-p=end] .scene__veil{background:linear-gradient(to top, color-mix(in srgb, var(--ink) 92%, transparent), color-mix(in srgb, var(--ink) 72%, transparent) 50%, transparent 90%)}.scene[data-align-p=end] .scene__text{isolation:isolate}.scene[data-align-p=end] .scene__text>div{position:relative}.scene[data-align-p=end] .scene__text>div:before{content:"";z-index:-1;pointer-events:none;background:linear-gradient(to bottom, transparent, color-mix(in srgb, var(--ink) 70%, transparent) 5rem);position:absolute;inset:-5rem -100vw -100vh}}@media (orientation:portrait) and (max-height:42em){.scene__text{--text-top:5rem;--text-bottom:3rem}.scene[data-align-p=end] .scene__veil{background:linear-gradient(to top, color-mix(in srgb, var(--ink) 92%, transparent), color-mix(in srgb, var(--ink) 80%, transparent) 50%, color-mix(in srgb, var(--ink) 60%, transparent))}}@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference) and (min-height:35em){:root:not(.scenes-static):has(.scenes){scroll-snap-type:y mandatory}:root:not(.scenes-static):has(.scenes) footer{scroll-snap-align:end}:root:not(.scenes-static) .scenes{--stage-h:100lvh;--pass:90svh;--pause:60svh;--zoom:1.6}:root:not(.scenes-static):has(.scenes) .header-reveal{animation-name:header-reveal;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:scroll(root);animation-range:60svh 87svh}:root:not(.scenes-static) .scene{--d-in:var(--pass);--d-out:var(--pass);height:calc(var(--stage-h) + var(--d-in) + var(--pause) + var(--d-out));view-timeline:--scene block;view-timeline-inset:0px;pointer-events:none}:root:not(.scenes-static) .scene:first-child{--d-in:0px}:root:not(.scenes-static) .scene:last-child{--d-out:0px;--pause:0px}:root:not(.scenes-static) .scene+.scene{margin-top:calc(-1 * (var(--stage-h) + var(--pass)))}:root:not(.scenes-static) .scene__snap{top:calc(var(--d-in) + 5rem);scroll-snap-align:start;scroll-snap-stop:always;width:1px;height:1px;display:block;position:absolute}:root:not(.scenes-static) .scene__stage{height:var(--stage-h);animation-name:scene-wait;animation-timing-function:linear;animation-fill-mode:backwards;animation-timeline:--scene;animation-range:cover contain 0%;position:sticky;top:0;overflow:clip;container-type:size}:root:not(.scenes-static) .scene__room{pointer-events:auto;min-height:0;animation-name:room-open;animation-timing-function:var(--motion-in-out);animation-fill-mode:both;animation-timeline:--scene;animation-range:contain 0% contain var(--d-in);position:absolute;inset:0}:root:not(.scenes-static) .scene__shot{transform-origin:var(--enter-origin);animation-name:photo-in;animation-timing-function:var(--motion-in-out);animation-fill-mode:both;animation-timeline:--scene;animation-range:contain 0% contain var(--d-in)}:root:not(.scenes-static) .scene__photo{transform-origin:var(--door-origin);animation-name:photo-out;animation-timing-function:var(--motion-in-out);animation-fill-mode:both;animation-timeline:--scene;animation-range:contain calc(var(--d-in) + var(--pause)) contain calc(var(--d-in) + var(--pause) + var(--d-out))}:root:not(.scenes-static) .scene__text,:root:not(.scenes-static) .scene__count{animation-name:text-in,text-out;animation-timing-function:var(--motion-out), var(--motion-in-out);animation-fill-mode:both,forwards;animation-timeline:--scene,--scene;animation-range:contain calc(var(--d-in) * .55) contain var(--d-in), contain calc(var(--d-in) + var(--pause)) contain calc(var(--d-in) + var(--pause) + var(--d-out) * .3)}:root:not(.scenes-static) .scene__veil{animation-name:veil-in;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--scene;animation-range:contain calc(var(--d-in) * .55) contain var(--d-in)}:root:not(.scenes-static) .scene:first-child :is(.scene__stage,.scene__room,.scene__shot,.scene__veil){animation-name:none}:root:not(.scenes-static) .scene:first-child :is(.scene__text,.scene__count){animation-name:none,text-out}:root:not(.scenes-static) .scene:last-child .scene__photo{animation-name:none}:root:not(.scenes-static) .scene:last-child :is(.scene__text,.scene__count){animation-name:text-in,none}:root:not(.scenes-static) .scene__text{padding-bottom:calc(100lvh - 100svh + var(--text-bottom))}:root:not(.scenes-static) .scene__count{bottom:calc(100lvh - 100svh + 1rem)}:root:not(.scenes-static) .scene__edge{background:var(--gold-soft);animation-name:edge-grow;animation-timing-function:var(--motion-in-out);animation-fill-mode:both;animation-timeline:--scene;animation-range:contain 0% contain var(--d-in);display:block;position:absolute;inset:0}:root:not(.scenes-static) .scene[data-enter=grow] .scene__room{animation-name:room-grow}:root:not(.scenes-static) .scene[data-enter=grow] .scene__shot{animation-name:photo-grow}:root:not(.scenes-static) .scene[data-enter=slide] .scene__room{animation-name:room-slide}:root:not(.scenes-static) .scene[data-enter=slide] .scene__edge{animation-name:edge-slide}:root:not(.scenes-static) .scene[data-exit=slide] .scene__photo{animation-name:photo-push}@media (min-width:80rem){:root:not(.scenes-static) .scene__tappe{animation-name:tappe-out;animation-timing-function:var(--motion-in-out);animation-fill-mode:both;animation-timeline:--scene;animation-range:contain calc(var(--d-in) + var(--pause) * .75) contain calc(var(--d-in) + var(--pause))}}@media (orientation:portrait){:root:not(.scenes-static) .scenes{--pass:75svh;--pause:50svh;--zoom:1.25}:root:not(.scenes-static):has(.scenes) .header-reveal{animation-range:50svh 72svh}}}@media (prefers-reduced-motion:reduce){.scene__text{animation-name:text-fade;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry entry 50%}.scene:has(:focus-visible) .scene__text{animation-name:none}}}@keyframes scene-wait{0%,to{clip-path:inset(0 0 100%)}}@keyframes room-open{0%{clip-path:var(--enter-clip)}to{clip-path:var(--enter-open)}}@keyframes photo-in{0%{transform:var(--enter-frame)}}@keyframes room-grow{0%{clip-path:var(--enter-seed)}35%{clip-path:var(--enter-clip)}to{clip-path:var(--enter-open)}}@keyframes edge-grow{0%{clip-path:var(--enter-seed)}35%{clip-path:var(--edge-clip)}to{clip-path:var(--enter-open)}}@keyframes photo-grow{0%,35%{transform:var(--enter-frame)}}@keyframes room-slide{0%{clip-path:inset(0 0 0 70%);translate:30%}to{clip-path:inset(0)}}@keyframes edge-slide{0%{clip-path:inset(0 0 0 calc(70% - 2px));translate:30%}to{clip-path:inset(0)}}@keyframes photo-push{to{translate:-33%}}@keyframes photo-out{to{scale:var(--zoom)}}@keyframes text-in{0%{opacity:0;translate:0 16px}}@keyframes tappe-out{to{opacity:0;filter:blur(4px)}}@keyframes text-out{to{opacity:0;filter:blur(4px);translate:0 -12px}}@keyframes veil-in{0%{opacity:0}}@keyframes text-fade{0%{opacity:0}}@keyframes header-reveal{0%{opacity:0;visibility:hidden}}@media (prefers-reduced-motion:no-preference){.scene:first-child .scene__shot{animation:hero-settle 1.8s var(--motion-out) both}.scene:first-child .scene__text>div>:not(.scroll-cue){animation:hero-rise .7s var(--motion-out) both}.scene:first-child .scene__text>div>:nth-child(2){animation-delay:.1s}.scene:first-child .scene__text>div>:nth-child(3){animation-delay:.2s}.scene:first-child .scene__text>div>:nth-child(n+4){animation-delay:.3s}}@keyframes hero-settle{0%{scale:1.08}}@keyframes hero-rise{0%{opacity:0;translate:0 20px}}.scroll-cue{left:var(--pad);align-items:center;min-height:2.75rem;display:inline-flex;position:absolute;bottom:.25rem}.scroll-cue__in{opacity:.85;transition:opacity .2s var(--motion-out);align-items:center;gap:.75rem;display:inline-flex}.scroll-cue:hover .scroll-cue__in{opacity:1}.scroll-cue__line{background:color-mix(in srgb, var(--paper) 30%, transparent);width:1px;height:1.75rem;position:relative;overflow:clip}.scroll-cue__line:after{content:"";background:var(--gold-soft);height:40%;position:absolute;inset:0 0 auto}@media (orientation:portrait){.scene:first-child .scene__text{--text-bottom:4rem}.scene .scroll-cue{top:calc(100% + .5rem);bottom:auto;left:0}}@media (prefers-reduced-motion:no-preference){.scroll-cue__in{animation:cue-in .7s var(--motion-out) 1.1s both}.scroll-cue__line:after{animation:cue-drop 2.2s var(--motion-in-out) 1.8s infinite both}}@supports (animation-timeline:scroll()){@media (prefers-reduced-motion:no-preference) and (min-height:35em){:root:not(.scenes-static) .scroll-cue{animation-name:cue-out;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:scroll(root);animation-range:0 12svh;bottom:calc(100lvh - 100svh + .25rem)}}}@keyframes cue-in{0%{opacity:0;translate:0 8px}}@keyframes cue-drop{0%{translate:0 -100%}to{translate:0 260%}}@keyframes cue-out{to{opacity:0;visibility:hidden}}
