
header.floating-nav{position:fixed;top:12px;left:16px;right:16px;width:auto;height:76px;padding:0 clamp(20px,3vw,58px);display:grid;grid-template-columns:1fr 80px 1fr;gap:20px;border:1px solid #eee1c529;border-radius:24px;background:linear-gradient(110deg,rgba(92,72,35,.30),rgba(77,83,81,.30));backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);z-index:100;transition:transform .32s ease,opacity .32s ease,background .3s;box-shadow:0 8px 32px #00000012}
header.floating-nav.is-scrolled{background:rgba(21,25,22,.30)}header.floating-nav.is-hidden{transform:translateY(calc(-100% - 24px));opacity:0;pointer-events:none}header.floating-nav:focus-within{transform:none;opacity:1;pointer-events:auto}
.floating-nav nav{display:flex;align-items:center;gap:clamp(15px,2vw,34px);font-size:12px;font-weight:300;white-space:nowrap}.floating-nav .nav-left{justify-content:flex-end}.floating-nav .nav-right{justify-content:flex-start}.floating-nav nav a{color:#e3dfd4ba;padding:14px 0;transition:color .2s}.floating-nav nav a:hover,.floating-nav nav a:focus-visible{color:#fff}.floating-nav .brand-symbol{display:grid;place-items:center;color:#f6f4ec;width:60px;height:60px;justify-self:center}.brand-symbol svg{width:44px;height:44px;transition:transform .3s cubic-bezier(.2,.7,.2,1);transform-origin:center}.brand-symbol:hover svg,.brand-symbol:focus-visible svg{transform:scale(1.12)}
.floating-nav .mobile-menu-toggle,.floating-nav .mobile-navigation{display:none}.cinema-intro{position:relative;height:100svh;min-height:540px;background:#151815;z-index:5;overflow:hidden}.cinema-media,.cinema-vignette{position:absolute;inset:0}.cinema-media img,.cinema-media video{width:100%;height:100%;object-fit:cover;object-position:center}.cinema-vignette{background:linear-gradient(180deg,#070b0633,transparent 40%,#03050355);pointer-events:none}.cinema-explore{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;color:#f0e6cf;padding:12px;z-index:2}.cinema-explore svg{width:35px;height:35px}.cinema-arrow{font-size:22px}.button>span>svg,.text-link>span>svg{width:25px;height:25px;vertical-align:middle;display:block}.symbol-divider{display:flex;justify-content:center;align-items:center;gap:30px;padding:40px 8%;background:#0d0f10;position:relative;z-index:3;color:#bdab88}.symbol-divider:before,.symbol-divider:after{content:'';height:1px;background:#bba78533;flex:1;max-width:300px}.symbol-divider svg{width:40px;height:40px}.signature-symbol{color:#c4b293;margin-bottom:30px}.signature-symbol svg{width:48px;height:48px}.video-pause{position:absolute;bottom:32px;right:30px;border:1px solid #ffffff55;border-radius:30px;background:#131a1677;color:#eee;padding:12px 18px;font-size:12px}
@media(max-width:1100px){header.floating-nav{gap:8px;grid-template-columns:1fr 55px 1fr;padding:0 18px}.floating-nav nav{gap:16px;font-size:10px}.brand-symbol svg{width:37px}}
@media(max-width:800px){header.floating-nav{height:64px;top:10px;left:12px;right:12px;border-radius:20px;display:flex;justify-content:space-between;padding:0 18px}.floating-nav .nav-left,.floating-nav .nav-right{display:none}.floating-nav .brand-symbol{width:45px;height:50px}.floating-nav .mobile-menu-toggle{display:flex;align-items:center;gap:15px;border:0;background:none;font-size:12px;padding:12px 0}.menu-bars{width:21px;height:10px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;transition:transform .2s}.mobile-menu-toggle[aria-expanded=true] .menu-bars{transform:rotate(-45deg)}.floating-nav .mobile-navigation:not([hidden]){position:absolute;display:flex;flex-direction:column;align-items:stretch;top:75px;left:0;right:0;padding:20px 26px;background:rgba(20,26,22,.30);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid #c4b29333;border-radius:20px;gap:0;max-height:calc(100svh - 110px);overflow:auto;font-size:14px}.floating-nav .mobile-navigation a{padding:14px 0;border-bottom:1px solid #ffffff13}.cinema-intro{min-height:500px}.cinema-explore{bottom:24px}}
@media(prefers-reduced-motion:reduce){header.floating-nav,.brand-symbol svg{transition:none}}

/* Brand signature centered over the opening film. */
.cinema-brand{position:absolute;inset:100px 5% 105px;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;color:#fff}
.cinema-logo{display:block;width:clamp(300px,54vw,900px);max-width:100%;height:auto;filter:drop-shadow(0 3px 18px #0007)}
.cinema-tagline{max-width:1160px;margin:30px auto 0;font-size:clamp(12px,1.2vw,19px);font-weight:300;line-height:2;letter-spacing:.19em;text-wrap:balance;text-shadow:0 2px 16px #000,0 1px 4px #0008}
.cinema-brand-name{white-space:nowrap}
@media(max-width:800px){.cinema-brand{inset:90px 7% 110px}.cinema-logo{width:min(100%,600px)}.cinema-tagline{font-size:12px;line-height:2.1;letter-spacing:.12em;margin-top:24px;max-width:480px}.cinema-brand-name{display:block;margin-bottom:6px;letter-spacing:.22em}}
@media(max-height:500px) and (min-width:801px){.cinema-logo{width:400px}.cinema-tagline{margin-top:12px;font-size:12px}}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/cormorant-garamond-400.ttf) format('truetype');
}

.cinema-tagline{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-style:normal;font-size:clamp(16px,1.65vw,26px);letter-spacing:.38em;line-height:1.9;max-width:1400px}
.cinema-tagline .cinema-brand-name{font-family:inherit;letter-spacing:inherit}
@media(max-width:800px){.cinema-tagline{font-size:16px;letter-spacing:.23em;line-height:1.9;max-width:520px}}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(assets/fonts/cormorant-garamond-300.ttf) format('truetype');
}

/* Fine, unshadowed signature matching the supplied visual reference. */
.cinema-brand .cinema-tagline{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-style:normal;font-size:clamp(12px,1.05vw,17px);letter-spacing:.46em;line-height:1.9;text-shadow:none;filter:none;-webkit-font-smoothing:antialiased;color:#f1eee8;margin-top:24px;max-width:1400px}
.cinema-brand .cinema-tagline .cinema-brand-name{font-weight:300;letter-spacing:inherit}
@media(max-width:800px){.cinema-brand .cinema-tagline{font-size:12px;letter-spacing:.24em;line-height:2;margin-top:20px;max-width:520px}}

/* Spacious central signature, with balanced navigation on either side. */
@media(min-width:1101px){
 header.floating-nav{grid-template-columns:minmax(0,1fr) clamp(220px,24vw,520px) minmax(0,1fr);column-gap:24px;padding-inline:clamp(28px,4vw,80px)}
 .floating-nav .nav-left{justify-content:flex-end}
 .floating-nav .nav-right{justify-content:flex-start}
 .floating-nav nav{gap:clamp(18px,1.8vw,38px)}
 .floating-nav .brand-symbol{width:76px;height:64px}
 .floating-nav .brand-symbol svg{width:48px;height:48px}
}
@media(min-width:801px) and (max-width:1100px){
 header.floating-nav{grid-template-columns:minmax(0,1fr) 140px minmax(0,1fr);gap:12px;padding-inline:22px}
 .floating-nav nav{gap:12px;font-size:10px}
 .floating-nav .brand-symbol svg{width:42px;height:42px}
}

/* Lower the logo and signature together within the opening film. */
.cinema-brand{transform:translateY(clamp(28px,6svh,65px))}
@media(max-height:500px){.cinema-brand{transform:translateY(20px)}}

/* Official Vendôme mark: white on dark surfaces, black on inverted buttons. */
.vendome-symbol{color:#fff;flex-shrink:0}
.button:hover .vendome-symbol{color:#000}

@media(prefers-reduced-motion:reduce){.brand-symbol:hover svg,.brand-symbol:focus-visible svg{transform:none}}
