/* A photograph fills the screen; horizontal movement uncovers the UNAI poster. */
body:not(.cabinet-body)>.announcement{display:none}
body:not(.cabinet-body)>header{position:absolute;inset:0 0 auto;z-index:8;max-width:none;width:100%;background:transparent;color:var(--paper);padding:22px var(--gutter);min-height:88px}
body:not(.cabinet-body)>header .logo,body:not(.cabinet-body)>header nav a,body:not(.cabinet-body)>header .text-button{color:var(--paper)}
body:not(.cabinet-body)>header .cart-button{background:var(--paper);color:var(--wine)}
body:not(.cabinet-body)>header :focus-visible,.hero-reveal :focus-visible{outline-color:var(--paper)}
.hero.hero-reveal{position:relative;display:block;height:100svh;min-height:0;max-width:none;width:100%;padding:0;overflow:hidden;isolation:isolate;background:#574637 url('assets/margherita.jpg') 50% 56%/cover no-repeat;touch-action:pan-y;--reveal:0%}
.hero-reveal .hero-poster,.hero-reveal .hero-photo-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hero-reveal .hero-poster{background:rgba(114,44,59,.55);color:var(--paper)}
.hero-reveal .poster-wordmark{position:absolute;left:4vw;top:12%;font:500 33vw/.72 var(--serif);letter-spacing:-.04em;white-space:nowrap}
.hero-reveal .poster-place{position:absolute;top:110px;left:5vw;font:16px/1.5 var(--sans);margin:0}
.hero-reveal .poster-photo{position:absolute;right:4vw;top:19%;width:32vw;height:58%;object-fit:cover;object-position:50% 60%}
.hero-reveal .hero-photo-layer{clip-path:inset(0 0 0 var(--reveal));background:#574637}
.hero-reveal .hero-photo-layer img{width:100%;height:100%;object-fit:cover;object-position:50% 56%;display:block}
.hero-reveal:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(180deg,rgba(20,12,9,.48),transparent 25%,transparent 42%,rgba(20,12,9,.72) 100%)}
.hero-reveal .hero-copy{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);bottom:clamp(64px,11svh,150px);display:block;padding:0;align-items:end;color:var(--paper);pointer-events:none}
.hero-reveal .hero-copy h1{color:inherit;font-size:clamp(48px,min(6.6vw,10svh),96px);line-height:.95;letter-spacing:-.03em;margin:0;max-width:18ch;text-wrap:balance}
.hero-reveal .hero-dish-link{font:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;display:inline;text-align:left;max-width:100%;margin:0;padding:0;background:none;border:0;border-radius:0;box-shadow:none;cursor:pointer;pointer-events:auto}
.hero-reveal .hero-dish-link:hover,.hero-reveal .hero-dish-link:focus-visible{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}
.hero-reveal .hero-copy p{color:inherit;font-size:16px;max-width:32ch;margin:0 0 23px;line-height:1.6}
.hero-reveal .hero-actions{pointer-events:auto}
.hero-reveal .hero-actions .primary{background:var(--paper);color:var(--wine);padding:17px 25px;min-height:52px;gap:28px}
.hero-reveal .hero-actions .primary:hover{background:#fff}
.hero-reveal .hero-switcher{position:absolute;left:var(--gutter);right:var(--gutter);bottom:64px;z-index:3;display:flex;align-items:center;justify-content:flex-end;gap:22px;color:var(--paper)}
.hero-switcher p{font:13px/1.5 var(--sans);margin:0;max-width:32ch}
.hero-switcher .hero-views{display:flex;align-items:center;gap:12px}
.hero-views button{font:14px var(--sans);padding:10px 12px;min-height:44px;border:0;background:transparent;color:var(--paper)}
.hero-views button[aria-pressed=true]{background:var(--paper);color:var(--wine)}
.hero-reveal input[type=range]{width:140px;min-height:44px;cursor:ew-resize;accent-color:var(--paper);padding:0;margin:0;touch-action:pan-x;background:transparent}
.hero-reveal .hero-divider{position:absolute;z-index:2;top:16%;bottom:28%;left:var(--reveal);width:2px;background:rgba(246,243,236,.7);pointer-events:none;opacity:0}
.hero-reveal.is-split .hero-divider{opacity:1}
.hero-reveal .hero-divider:after{content:"";position:absolute;top:50%;left:-5px;width:12px;height:12px;background:var(--paper);border-radius:50%}
@media(min-width:1600px){.hero-reveal .poster-wordmark{top:15%}}
@media(max-width:900px){body:not(.cabinet-body)>header nav{gap:18px}.hero-reveal .hero-copy{grid-template-columns:1fr 1fr;gap:25px}.hero-reveal .hero-copy h1{font-size:clamp(48px,6.4vw,64px)}.hero-reveal .poster-wordmark{font-size:34vw;top:12%;left:3vw}.hero-reveal .poster-photo{right:0;width:39vw}}
@media(max-width:650px){
 body:not(.cabinet-body)>header{padding:16px 20px;min-height:78px;gap:12px}
 body:not(.cabinet-body)>header .logo{font-size:43px}
 body:not(.cabinet-body)>header .header-actions{gap:12px}
 body:not(.cabinet-body)>header .text-button{font-size:12px}
 body:not(.cabinet-body)>header .cart-button{padding:11px 13px;min-height:44px;font-size:12px}
 .hero.hero-reveal{background-position:53% 50%}
 .hero-reveal:after{background:linear-gradient(180deg,rgba(20,12,9,.48),transparent 23%,transparent 35%,rgba(20,12,9,.60) 55%,rgba(20,12,9,.78) 100%)}
 .hero-reveal .hero-photo-layer img{object-position:53% 50%}
 .hero-reveal .hero-copy{left:20px;right:20px;bottom:clamp(76px,15svh,169px);display:block}
 .hero-reveal .hero-copy h1{font-size:clamp(48px,13.5vw,72px);max-width:12ch;margin-bottom:18px}
 .hero-reveal .hero-copy p{font-size:14px;max-width:29ch;margin-bottom:20px}
 .hero-reveal .hero-actions .primary{font-size:14px;padding:15px 20px;min-height:48px}
 .hero-reveal .hero-switcher{left:20px;right:20px;bottom:62px;align-items:flex-start;gap:6px;flex-direction:column}
 .hero-switcher p{font-size:12px;max-width:none}
 .hero-switcher .hero-views{width:100%;gap:6px;justify-content:space-between}
 .hero-views button{font-size:13px;padding:8px 10px}
 .hero-reveal input[type=range]{width:112px}
 .hero-reveal .poster-place{left:20px;top:15%;font-size:14px}
 .hero-reveal .poster-wordmark{left:15px;top:17%;font-size:47vw}
 .hero-reveal .poster-photo{right:0;top:31%;height:41%;width:66vw}
 .hero-reveal .hero-divider{top:12%;bottom:42%}
}
@media(min-width:651px) and (max-height:600px){
 body:not(.cabinet-body)>header{min-height:68px;padding-block:12px}
 .hero-reveal .hero-copy{bottom:80px}
 .hero-reveal .hero-copy h1{font-size:clamp(36px,min(6.6vw,10svh),60px)}
}
@media(prefers-reduced-motion:reduce){.hero-reveal *{scroll-behavior:auto;animation:none!important;transition:none!important}}

/* All three views crossfade together, preserving the translucent poster reveal. */
.hero-reveal .hero-background{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hero.hero-reveal{cursor:zoom-in}
.hero-reveal .hero-slide{position:absolute;inset:0;overflow:hidden;background:#574637;opacity:0;transition:opacity 1100ms cubic-bezier(.25,.1,.25,1)}
.hero-reveal .hero-slide.is-active{opacity:1}
.hero-reveal .hero-slide.is-outgoing{opacity:1}
.hero-reveal .hero-slide img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.hero-reveal .hero-slide.is-portrait:before{content:"";position:absolute;inset:-24px;background:var(--slide-photo) 50% 50%/cover;filter:blur(20px);opacity:.72}
.hero-reveal .hero-slide.is-portrait img{object-fit:contain;object-position:70% 50%}
.hero-reveal .poster-photo .hero-slide.is-portrait img{object-position:50% 50%}
.motion-paused .hero-reveal .hero-slide{transition:none}
@media(max-width:650px){.hero-reveal .hero-slide img{object-position:50% 53%}.hero-reveal .hero-slide.is-portrait img{object-position:50% 50%}}