/* Immersive edition: the photograph is the stage, interaction reveals the room. */
.preview-stripe{min-height:40px;display:flex;justify-content:center;align-items:center;gap:24px;padding:0 20px;position:relative;z-index:20}.preview-stripe>span{padding:0}.preview-stripe button{border:0;border-left:1px solid #9c978d;padding:8px 0 8px 20px;min-height:40px;background:none;font-size:11px;color:inherit}.site-header{position:absolute;top:40px;left:0;right:0;max-width:none;z-index:10;padding:27px 5vw;background:linear-gradient(#0507098c,transparent)}.site-header .wordmark img{width:145px;height:51px}.site-header nav{color:#fff}.site-header .header-reserve{color:#fff;border-color:#ffffff80;background:#0b0f133d}.site-header .header-reserve:hover{background:#f4f0e5;color:#171a19}.site-header .wordmark{filter:drop-shadow(0 2px 5px #0008)}
html[data-venue] .hero{position:relative;max-width:none;margin:0;padding:180px 6vw 100px;min-height:calc(100svh - 40px);display:flex;flex-direction:row;align-items:flex-end;overflow:hidden;isolation:isolate;gap:0;background:#0b0d10}
html[data-venue] .hero-visual{position:absolute;inset:0;margin:0;max-width:none;z-index:-2;animation:none}
html[data-venue] .hero-image-wrap{width:100%;height:100%;border:0;padding:0;border-radius:0;overflow:visible;transform:translate3d(var(--look-x,0px),var(--look-y,0px),0);will-change:transform}
html[data-venue] .hero-photo{width:100%;height:100%;object-fit:cover;border-radius:0;animation:room-awakens 1.8s cubic-bezier(.16,.65,.3,1) both;transform:scale(1.08)}
.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#080b10b8 0%,#080b104d 55%,#080b1010),linear-gradient(0deg,#080b10d6,transparent 70%);z-index:-1;pointer-events:none}
html[data-venue] .hero-copy{padding:0;margin:0;display:block;max-width:780px;text-align:left;animation:headline-awakens 1.25s .1s cubic-bezier(.16,.65,.3,1) both;position:static}
html[data-venue] .hero h1{color:#fbf7eb;font-size:clamp(74px,8.2vw,132px);line-height:.94;letter-spacing:-.055em;max-width:740px;text-wrap:balance}
html[data-venue] .hero-description{font-size:17px;line-height:1.65;max-width:390px;margin:26px 0 0;color:#eeeae2}
html[data-venue] .hero-actions{margin-top:28px;justify-content:flex-start;gap:28px}.hero .text-link{color:#fff;border-color:#ffffff70}.hero .location-note{color:#f2e6cb;margin-bottom:23px}.hero .button{box-shadow:0 5px 30px #0002}html[data-venue] .hero-footnote,html[data-venue] .hero-visual figcaption,html[data-venue] .hero-accent{display:none}.hero-edge{position:absolute;bottom:27px;left:6vw;right:6vw;display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#e6e2d7;border-top:1px solid #ffffff40;padding-top:19px}.hero-edge span:first-child{font-family:var(--display);font-size:18px;font-style:italic}
/* Abigail: a velvet-dark photograph with a large, low-set editorial headline. */
html[data-venue=ab]{--bg:#141814;--panel:#1e261f;--accent:#cfb47d}html[data-venue=ab] .hero-copy{max-width:760px}html[data-venue=ab] .hero h1{max-width:650px}html[data-venue=ab] .hero-photo{object-position:58% 50%}
/* Saint Yves: the room appears through a tall architectural portal. */
html[data-venue=sy] .hero{background:#0e1826;align-items:center;padding-top:170px;padding-bottom:120px;min-height:900px;min-height:max(820px,calc(100svh - 40px))}
html[data-venue=sy] .hero-visual{inset:80px 4vw 45px 36vw;border:1px solid #d1bd9280;border-radius:48% 48% 0 0/45% 45% 0 0;overflow:hidden}
html[data-venue=sy] .hero:after{background:linear-gradient(90deg,#0e1826 10%,#0e1826dd 25%,#0e182642 55%,transparent 80%),linear-gradient(0deg,#0e182690,transparent 40%)}
html[data-venue=sy] .hero-copy{max-width:670px}html[data-venue=sy] .hero h1{font-size:clamp(70px,7.2vw,116px);line-height:1.06;max-width:660px}html[data-venue=sy] .hero-image-wrap{border-radius:0}html[data-venue=sy] .hero-photo{object-position:55% 50%}
/* Strand: a full-width, real club-night frame and graphic, compressed composition. */
html[data-venue=st]{--bg:#101319;--panel:#1c222c;--accent:#bed0f4}html[data-venue=st] .hero{padding-top:210px;min-height:max(760px,calc(100svh - 40px))}html[data-venue=st] .hero-copy{max-width:870px}html[data-venue=st] .hero h1{font-size:clamp(76px,8.2vw,130px);font-weight:500;max-width:850px;line-height:.98;letter-spacing:-.075em}html[data-venue=st] .hero-photo{object-position:65% 50%}html[data-venue=st] .hero:after{background:linear-gradient(90deg,#090c11c9 0%,#090c1170 48%,#090c1110),linear-gradient(0deg,#090c11eb,transparent 95%)}
/* A visual pause connects the entrance to the room plan. */
.scene-break{max-width:1600px;margin:auto;padding:110px 6vw;display:grid;grid-template-columns:1.5fr 1fr .65fr;align-items:center;gap:5vw}.scene-break>p:first-child{font-family:var(--display);font-size:clamp(32px,3.3vw,54px);line-height:1.2;letter-spacing:-.035em}.scene-break>p:first-child span{color:var(--muted)}.scene-note{font-size:12px;line-height:2.2;color:var(--muted)}.scene-trigger{display:block;position:relative;padding:0;border:0;background:transparent;color:var(--ink);text-align:left;overflow:hidden;aspect-ratio:1.18}.scene-trigger img{height:100%;width:100%;object-fit:cover;transition:transform .8s cubic-bezier(.22,.65,.25,1)}.scene-trigger:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#000c,transparent 75%);pointer-events:none}.scene-trigger>span{position:absolute;bottom:22px;left:20px;right:20px;font-size:13px;display:flex;justify-content:space-between;z-index:1}.scene-trigger:hover img{transform:scale(1.08)}.scene-break.in-view .scene-trigger{animation:scene-curtain .85s cubic-bezier(.22,.65,.25,1) both}.atmosphere.in-view .photo-grid img{animation:scene-curtain .8s ease-out both}.section-heading h2{text-wrap:balance}.photo-grid figure:only-child img{height:clamp(320px,40vw,580px)}html[data-venue=st] .photo-grid{grid-template-columns:1fr 1fr}html[data-venue=st] .photo-grid figure:nth-child(2){margin-top:85px}html[data-venue=st] .photo-grid img{height:auto;aspect-ratio:1;object-fit:cover}
.reservation-dock{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);width:min(600px,calc(100% - 32px));z-index:25;display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid var(--line);padding:12px 14px 12px 23px;background:#111722ed;backdrop-filter:blur(16px);box-shadow:0 8px 35px #0005;animation:dock-enter .3s ease-out}.reservation-dock>span{font-family:var(--display);font-size:22px;color:#fff}.reservation-dock small{font:10px/1.5 var(--body);display:block;color:#c9c8c3}.reservation-dock .button{min-height:48px}.reservation-dock[hidden]{display:none}
/* Full-screen room viewer. The photographs remain honest, independently selectable views. */
#room-viewer{width:100vw;height:100svh;max-width:none;max-height:none;margin:0;border:0;padding:0;background:#090d12;overflow:auto;color:#f7f2e7;z-index:50}#room-viewer::backdrop{background:#080c10}.viewer-shell{min-height:100%;padding:25px 4vw 15px;display:flex;flex-direction:column}.viewer-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:22px;gap:20px}.viewer-header>div{display:flex;gap:25px;align-items:baseline}.viewer-header p{font-size:13px;color:var(--accent)}.viewer-header h2{font-size:35px;letter-spacing:-.025em}.viewer-header .icon-button{border-color:#ffffff70;color:#fff}.viewer-stage{position:relative;overflow:hidden;height:60svh;min-height:300px;background:#121820;isolation:isolate}.viewer-stage>img{position:absolute;width:125%;max-width:none;height:100%;object-fit:cover;left:0;top:0;transform:translateX(calc(var(--pan,50)*-.2%));transition:transform .12s linear}.viewer-stage>video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#050708}.viewer-grain{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#060a10df,transparent 46%)}.view-description{position:absolute;bottom:25px;left:30px;max-width:560px;pointer-events:none}.view-description h3{font-size:42px}.view-description p{font-size:12px;color:#e3ded4;margin-top:10px;max-width:460px}.viewer-controls{display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding:20px 0 8px}#view-choices{display:flex;gap:10px;flex:1}.view-choice{display:flex;align-items:center;gap:10px;background:none;color:#fff;border:1px solid #ffffff35;min-height:64px;padding:5px 14px 5px 5px;text-align:left;font-size:12px}.view-choice img{width:56px;height:52px;object-fit:cover}.view-choice[aria-pressed=true]{border-color:var(--accent);background:#ffffff10}.pan-control{width:180px}.pan-control label{font-size:10px;color:#d8d9dc}.pan-control input{min-height:30px;margin:0;padding:0;accent-color:var(--accent);background:none;border:0}.viewer-note{font-size:10px;color:#9fa8b7}.viewer-controls .button{font-size:12px;min-height:48px;padding:12px 16px;gap:15px}.viewer-stage.switch-view{animation:scene-curtain .65s cubic-bezier(.22,.65,.25,1) both}html[data-venue=sy] .viewer-stage.switch-view{animation:arch-open .75s cubic-bezier(.22,.65,.25,1) both}html[data-venue=st] .viewer-stage.switch-view{animation:strand-open .7s cubic-bezier(.22,.65,.25,1) both}
#booking-dialog[open]{animation:booking-arrive .3s cubic-bezier(.22,.65,.25,1) both}.map-pin[aria-pressed=true] span{outline:1px solid var(--accent);outline-offset:5px}.map-viewport{border-radius:2px}
@keyframes room-awakens{from{transform:scale(1.2);filter:brightness(.5)}to{transform:scale(1.08);filter:brightness(1)}}
@keyframes headline-awakens{from{opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(30px)}to{opacity:1;clip-path:inset(0);transform:translateY(0)}}
@keyframes scene-curtain{from{clip-path:inset(0 48%)}to{clip-path:inset(0)}}
@keyframes arch-open{from{clip-path:ellipse(20% 45% at 50% 55%)}to{clip-path:ellipse(100% 100% at 50% 50%)}}
@keyframes strand-open{from{clip-path:polygon(45% 0,55% 0,35% 100%,25% 100%)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}
@keyframes dock-enter{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes booking-arrive{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}
@media(max-width:1000px){.hero-copy{width:78%}html[data-venue=sy] .hero h1{font-size:80px}.scene-break{grid-template-columns:1.4fr 1fr;gap:5vw}.scene-note{display:none}.viewer-controls{gap:16px}#view-choices{flex-basis:100%}.viewer-controls .button:last-child{margin-left:auto}.viewer-stage{height:56svh}.viewer-header h2{font-size:30px}}
@media(max-width:600px){.preview-stripe{font-size:10px;gap:12px;padding:0 12px;justify-content:space-between}.preview-stripe button{font-size:10px;padding-left:12px}.site-header{padding:18px 6vw}.site-header .wordmark img{width:105px;height:40px}.site-header .header-reserve{font-size:11px;padding:10px 13px;gap:12px}html[data-venue] .hero{padding:190px 6vw 100px;min-height:calc(100svh - 40px);align-items:flex-end}html[data-venue] .hero-copy{width:100%;max-width:none;position:static}html[data-venue] .hero h1{font-size:clamp(58px,13.6vw,82px);max-width:100%;line-height:1;letter-spacing:-.045em}html[data-venue] .hero-description{font-size:14px;max-width:280px;margin-top:20px}html[data-venue] .hero-actions{gap:20px;margin-top:24px}.hero .hero-actions .button{padding:14px 17px;font-size:12px;gap:22px}.hero .hero-actions .text-link{font-size:12px}html[data-venue] .hero-edge{bottom:23px;left:6vw;right:6vw;font-size:9px}.hero-edge span:first-child{font-size:15px}.hero .location-note{font-size:11px;margin-bottom:15px}html[data-venue=ab] .hero-photo{object-position:65% 50%}html[data-venue=sy] .hero{min-height:max(780px,calc(100svh - 40px));padding-top:190px}html[data-venue=sy] .hero-visual{inset:85px -12vw 25px 15vw;border-radius:48% 48% 0 0/35% 35% 0 0}html[data-venue=sy] .hero:after{background:linear-gradient(90deg,#0e1826b3,transparent),linear-gradient(0deg,#0e1826,#0e182645 85%)}html[data-venue=sy] .hero h1{font-size:clamp(53px,12.6vw,76px);line-height:1.06}html[data-venue=st] .hero{min-height:max(760px,calc(100svh - 40px))}html[data-venue=st] .hero h1{font-size:clamp(55px,12.8vw,77px);line-height:1.02;letter-spacing:-.065em}html[data-venue=st] .hero-photo{object-position:64% 50%}.scene-break{padding:65px 6vw;gap:28px;grid-template-columns:1fr}.scene-break>p:first-child{font-size:38px;max-width:330px}.scene-trigger{aspect-ratio:1.55}.room-section{padding-top:55px}.reservation-dock{bottom:10px;padding:9px 10px 9px 16px;gap:12px;width:calc(100% - 20px)}.reservation-dock>span{font-size:18px}.reservation-dock small{font-size:9px}.reservation-dock .button{font-size:11px;gap:15px;min-height:44px;padding:12px 15px}.viewer-shell{padding:18px 4vw}.viewer-header{padding-bottom:18px}.viewer-header>div{display:block}.viewer-header p{font-size:11px;margin-bottom:5px}.viewer-header h2{font-size:27px}.viewer-stage{height:48svh;min-height:300px}.view-description{bottom:20px;left:18px;right:18px}.view-description h3{font-size:32px}.view-description p{font-size:10px;line-height:1.5}.viewer-controls{gap:13px}#view-choices{gap:6px;flex-wrap:wrap}.view-choice{padding:4px 8px 4px 4px;gap:7px;min-height:49px;font-size:10px}.view-choice img{width:38px;height:38px}.pan-control{width:145px}.viewer-controls .button{font-size:10px;padding:12px;gap:10px}.viewer-note{font-size:9px;margin-top:7px}html[data-venue=st] .photo-grid{grid-template-columns:1fr}html[data-venue=st] .photo-grid figure:nth-child(2){margin-top:0}footer{padding-bottom:110px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.hero-image-wrap{will-change:auto!important}}
html[data-motion=off]{scroll-behavior:auto}html[data-motion=off] *,html[data-motion=off] *::before,html[data-motion=off] *::after{animation:none!important;transition:none!important}html[data-motion=off] .hero-image-wrap{will-change:auto!important}html[data-motion=off] .hero-photo{transform:scale(1.08)!important}

@media(max-width:600px){html[data-venue] .hero{flex-direction:column;align-items:flex-start;justify-content:flex-end}.hero .hero-copy{flex:none}}
/* Keep the fixed reservation shortcut clear of the last footer controls at every width. */
footer{padding-bottom:130px}

/* Hero parallax, driven by the scroll itself off the main thread (2026-10-21). The film
   drifts 75px over the first screen of scroll, as before. Abigail's logo is placed over
   the film, so it drifts with it and stays aligned without being measured again. */
@supports (animation-timeline: scroll()){
 @media(prefers-reduced-motion:no-preference){
  html[data-venue]:not([data-motion=off]) .hero-image-wrap,
  html[data-venue=ab]:not([data-motion=off]) .hero-masthead{animation:hero-travel linear both;animation-timeline:scroll(root);animation-range:0px 100vh}
 }
}
@keyframes hero-travel{from{translate:0 0}to{translate:0 75px}}