/* Three cinematic entrances. Text and booking never depend on the film loading. */
html[data-venue] .hero{min-height:max(700px,calc(100svh - 40px));padding:0 5vw 110px;align-items:flex-end;flex-direction:row;justify-content:space-between}
html[data-venue] .hero-copy{width:auto;max-width:600px;animation:none;z-index:2;position:relative}
html[data-venue] .hero-visual{inset:0;border:0;border-radius:0}
html[data-venue] .hero-image-wrap{height:100%;border-radius:0}
html[data-venue] .hero-photo{object-position:center;animation:none;transform:scale(1.08)}
#hero-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.08);transition:opacity 1.2s ease;pointer-events:none}
.hero.film-ready #hero-film{opacity:1}
html[data-venue] .hero:after{background:linear-gradient(0deg,#080a0eed,transparent 72%),linear-gradient(180deg,#080a0e66,transparent 45%);z-index:0}
.hero-masthead{position:absolute;top:125px;left:5vw;right:5vw;z-index:1;text-align:center;pointer-events:none}
.hero-masthead .location-note{display:flex;justify-content:space-between;font:10px var(--body);letter-spacing:.22em;text-transform:uppercase;color:#fff;margin:0}
html[data-venue] .hero h1{font-size:clamp(120px,20.5vw,340px);max-width:none;color:#faf5e9;line-height:1.05;letter-spacing:-.065em;text-wrap:nowrap;text-shadow:0 3px 35px #0002}
.hero-signature{font:11px var(--body);letter-spacing:.3em;text-transform:uppercase;color:#f4eddf}
.hero-promise{font:clamp(30px,3.8vw,58px)/1.1 var(--display);letter-spacing:-.035em;max-width:560px;color:#fbf7eb}
html[data-venue] .hero-description{font-size:13px;max-width:400px;margin:12px 0 0;color:#ddd8ce}
html[data-venue] .hero-actions{margin-top:22px;gap:28px}
html[data-venue] .hero-edge{z-index:3;bottom:29px;left:5vw;right:5vw;padding-top:14px;color:#eee7d8}
html[data-venue] .hero-edge .hero-edition{font:10px var(--body);letter-spacing:.12em;text-transform:uppercase}
.hero-edition>span{padding:0 12px;opacity:.6}
.hero-edge>a{font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:8px 0}
#hero-play{color:#eee7d8;border:0;background:transparent;font:10px var(--body);letter-spacing:.08em;min-height:36px;padding:6px 12px}
#hero-play:before{content:'';display:inline-block;width:7px;height:8px;margin-right:9px;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}#hero-play[aria-pressed=true]:before{content:'Ⅱ'}
.film-progress{position:absolute;z-index:3;bottom:0;left:0;width:100%;height:2px;background:#ffffff15}
.film-progress span{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--film-progress,0));transition:transform .25s linear}
/* Abigail: oversized fashion typography, champagne frame and a velvet-black film. */
html[data-venue=ab] .hero h1{font-style:normal;font-weight:400;letter-spacing:-.075em;font-size:clamp(130px,22vw,360px);line-height:1.1}
html[data-venue=ab] .hero-signature{margin-top:12px;text-align:right}
html[data-venue=ab] .hero-promise{font-style:normal}
/* Saint Yves: full-bleed film with a centred official mark and evening invitation. */
html[data-venue=sy] .hero{background:#091320;justify-content:center}
html[data-venue=sy] .hero-visual{inset:0;border:0;border-radius:0;overflow:hidden}
html[data-venue=sy] .hero:after{background:linear-gradient(0deg,#091320ed 0%,#09132099 25%,#09132020 65%),linear-gradient(180deg,#09132088,transparent 42%)}
html[data-venue=sy] .hero-masthead{top:160px}
html[data-venue=sy] .hero h1{font-size:clamp(100px,13.8vw,220px);line-height:1.3;letter-spacing:-.045em}
html[data-venue=sy] .hero-signature{letter-spacing:.38em}
html[data-venue=sy] .hero-masthead .location-note{justify-content:center;gap:30px;margin-bottom:16px}
html[data-venue=sy] .hero-copy{text-align:center;max-width:650px}
html[data-venue=sy] .hero-promise{font-size:clamp(30px,3vw,48px);max-width:none}
html[data-venue=sy] .hero-description{margin:14px auto 0}
html[data-venue=sy] .hero-actions{justify-content:center}
/* Strand: an enormous wordmark, cyan rails and an open film canvas. */
html[data-venue=st] .hero h1{font-family:var(--display);font-weight:500;font-size:clamp(130px,24.3vw,390px);letter-spacing:-.085em;line-height:.95;text-align:left}
html[data-venue=st] .hero-masthead{top:145px}
html[data-venue=st] .hero-signature{text-align:right;margin-top:12px;letter-spacing:.28em}
html[data-venue=st] .hero-promise{font:500 clamp(28px,3.3vw,50px)/1.1 var(--display);max-width:570px;letter-spacing:-.055em}
@media(min-width:1000px) and (max-height:780px){.hero-masthead{top:100px}html[data-venue=ab] .hero h1{font-size:17vw}html[data-venue=sy] .hero-masthead{top:115px}html[data-venue=sy] .hero h1{font-size:11.8vw}html[data-venue=st] .hero-masthead{top:120px}html[data-venue=st] .hero h1{font-size:18vw}}
@media(max-width:900px){html[data-venue] .hero{min-height:max(740px,calc(100svh - 40px))}html[data-venue] .hero-copy{max-width:70%}html[data-venue=sy] .hero-copy{max-width:80%}html[data-venue=sy] .hero h1{font-size:13.8vw}}
@media(max-width:600px){
  html[data-venue] .hero{min-height:max(720px,calc(100svh - 40px));padding:0 7vw 105px;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:24px}
  .hero-masthead{top:145px;left:7vw;right:7vw}
  .hero-masthead .location-note{font-size:8px;letter-spacing:.15em}
  html[data-venue=ab] .hero h1{font-size:26vw;line-height:1.45;letter-spacing:-.065em}
  .hero-signature{font-size:8px;letter-spacing:.18em}
  html[data-venue=ab] .hero-signature{margin-top:-6px}
  html[data-venue] .hero-copy{width:100%;max-width:100%}
  .hero-promise{font-size:38px;max-width:320px}
  html[data-venue] .hero-description{font-size:12px;line-height:1.6;max-width:290px;margin-top:10px}
  html[data-venue] .hero-actions{margin-top:20px;gap:20px}
  html[data-venue] .hero-edge{left:7vw;right:7vw;bottom:23px;padding-top:10px}
  html[data-venue] .hero-edge .hero-edition{font-size:8px;letter-spacing:.04em;max-width:100px;line-height:1.7}
  .hero-edition>span{padding:0 5px}#hero-play{font-size:9px;padding:6px}.hero-edge>a{font-size:8px}
  html[data-venue=sy] .hero{align-items:center}
  html[data-venue=sy] .hero-masthead{top:150px;left:3vw;right:3vw}
  html[data-venue=sy] .hero h1{font-size:16vw;line-height:1.8;letter-spacing:-.045em}
  html[data-venue=sy] .hero-signature{letter-spacing:.21em}
  html[data-venue=sy] .hero-masthead .location-note{gap:22px;margin-bottom:12px}
  html[data-venue=sy] .hero-promise{font-size:32px;max-width:340px;margin:auto}
  html[data-venue=sy] .hero-description{max-width:270px;margin:14px auto 0}
  html[data-venue=sy] .hero-actions{gap:20px}
  html[data-venue=st] .hero-masthead{top:165px;left:7vw;right:7vw}
  html[data-venue=st] .hero h1{font-size:26vw;line-height:1.45}
  html[data-venue=st] .hero-signature{margin-top:-4px;font-size:8px;text-align:left}
  html[data-venue=st] .hero-promise{font-size:34px;max-width:320px}
  html[data-venue=st] .hero-photo,html[data-venue=st] #hero-film{object-position:62% center}
}
@media(prefers-reduced-motion:reduce){.film-progress span{transition:none}}

/* Official logo artwork retains each venue's original lettering and proportions. */
html[data-venue] .hero h1{font-size:0;line-height:0;letter-spacing:0;margin:18px auto 16px;text-align:center}
.hero-brand-logo{width:auto;height:clamp(150px,18vw,260px);max-width:82vw;object-fit:contain;margin:auto;filter:drop-shadow(0 4px 22px #0005)}
html[data-venue=sy] .hero-brand-logo{height:clamp(150px,16vw,220px)}
html[data-venue=st] .hero-brand-logo{width:min(720px,80vw);height:auto;max-height:230px}
html[data-venue=ab] .hero-signature,html[data-venue=st] .hero-signature{text-align:center;margin-top:0}
@media(min-width:1000px) and (max-height:780px){.hero-brand-logo{height:190px}html[data-venue=sy] .hero-brand-logo{height:165px}html[data-venue=st] .hero-brand-logo{width:600px;max-height:160px}}
@media(max-width:600px){
 html[data-venue] .hero h1{font-size:0;line-height:0;margin:20px auto 18px}
 .hero-brand-logo{height:142px;max-width:80vw}
 html[data-venue=sy] .hero-brand-logo{height:145px}
 html[data-venue=st] .hero-brand-logo{width:82vw;max-height:120px}
 html[data-venue=st] .hero-signature{text-align:center}
}

/* The hero owns the venue mark; navigation stays quiet above the film. */
.site-header{justify-content:flex-end}

/* A quiet location line replaces the promotional hero copy. */
.hero-address{font:400 14px/1.7 var(--body);letter-spacing:.035em;color:#eee9df;max-width:440px;text-wrap:balance}
html[data-venue=sy] .hero-address{margin-inline:auto}
@media(max-width:600px){.hero-address{font-size:12px;max-width:290px}}
