/* Native HTML port of the approved cinematic-5 hero. Rules stay inside this module. */
body.yf-cinematic-page { overflow-x: clip; }
body.yf-cinematic-page #wrap,
body.yf-cinematic-page #lqd-site-content,
body.yf-cinematic-page #lqd-contents-wrap { overflow: visible; }
#banner.yf-hero {
  --yf-navy: #1d3045;
  position: relative; height: 100vh; width: 100%; padding: 0; margin: 0;
  max-width: none; overflow: visible; isolation: isolate; scroll-margin-top: 0;
  font-family: 'Helvetica Neue ME', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: var(--yf-navy); background: #eef0f0; -webkit-font-smoothing: antialiased;
}
#banner.yf-hero *, #yf-menu * { box-sizing: border-box; }
#yf-menu * { transition: none; }
#banner.yf-hero.yf-sequence-active { height: 500vh; }
#banner.yf-hero h1, #banner.yf-hero h2, #banner.yf-hero p {
  padding: 0; margin: 0; font-family: inherit; text-transform: uppercase;
}
#banner.yf-hero a, #banner.yf-hero button, #yf-menu a, #yf-menu button {
  font-family: inherit; color: inherit; text-decoration: none; box-shadow: none;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
#banner.yf-hero button, #yf-menu button {
  appearance: none; background: none; border: 0; padding: 0; margin: 0;
  line-height: inherit; font-weight: inherit; border-radius: 0;
}
#banner.yf-hero svg, #yf-menu svg { display: block; flex: none; }
#banner.yf-hero :focus-visible, #yf-menu :focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
#banner .yf-sticky { position: sticky; top: 0; width: 100%; height: 100vh; overflow: hidden; }
#banner .yf-poster, #banner .yf-canvas { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
#banner .yf-canvas { opacity: 0; transition: opacity .3s; }
#banner .yf-overlay { position: absolute; inset: 0; pointer-events: none; }
#banner .yf-nav {
  position: absolute; inset: 0 0 auto; z-index: 50; display: flex;
  align-items: center; justify-content: space-between; padding: 32px 24px 24px;
  color: var(--yf-navy); pointer-events: auto; transition: color .5s;
}
#banner .yf-nav.is-light { color: #fff; }
#banner .yf-nav-desktop { display: none; align-items: center; gap: 32px; }
#banner .yf-nav-link { position: relative; font-size: 12px; line-height: 16px; letter-spacing: .15em; font-weight: 500; text-transform: uppercase; }
#banner .yf-nav-link[aria-current="page"]::after { content: ''; position: absolute; left: 0; right: 0; bottom: -12px; height: 2px; background: currentColor; }
#banner .yf-nav a:hover, #banner .yf-nav button:hover { opacity: .7; }
#banner .yf-nav-right { display: none; align-items: center; gap: 32px; font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: .2em; }
#banner .yf-plan-link { display: flex; align-items: center; gap: 12px; }
#banner .yf-info { width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #1d3045; color: #fff; }
#banner .yf-nav.is-light .yf-info { background: #fff; color: #1d3045; }
#banner .yf-hamburger { display: flex; width: 32px; height: 32px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 5px; }
#banner .yf-hamburger span { display: block; width: 24px; height: 2px; background: currentColor; }
#banner .yf-hamburger span:last-child { width: 16px; }
#banner .yf-scene { position: absolute; inset: 0; display: flex; align-items: center; padding: 0 24px; transition: opacity .1s ease-out; }
#banner .yf-brand-copy { position: relative; max-width: 100%; }
#banner .yf-scene-one .yf-brand-kicker { margin-bottom: 20px; color: #1d3045a6; font-size: 11px; font-weight: 500; line-height: 1.5; letter-spacing: .36em; }
#banner .yf-scene-one h1 { color: #1d3045; font-size: clamp(88px,10.5vw,152px); font-weight: 300; line-height: 1.08; letter-spacing: .12em; }
#banner .yf-scene-one .yf-subtitle { margin-top: 28px; color: #1d3045; font-size: clamp(22px,2.3vw,34px); font-weight: 300; line-height: 1.55; letter-spacing: .06em; }
#banner .yf-subtitle-tail { display: block; }
#banner .yf-scene-one .yf-description { margin-top: 24px; color: #1d3045a6; font-size: 12px; font-weight: 400; line-height: 1.9; letter-spacing: .12em; }
#banner .yf-first-cta { position: absolute; top: 100%; left: 0; margin-top: 32px; }
#banner .yf-booking { display: flex; align-items: center; gap: 16px; width: fit-content; pointer-events: auto; transition: opacity 60ms cubic-bezier(.165,.84,.44,1); }
#banner .yf-booking:hover { opacity: .7; }
#banner .yf-booking-label { font-size: 14px; line-height: 20px; letter-spacing: .3em; text-transform: uppercase; }
#banner .yf-circle { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border: 1px solid #1d304580; border-radius: 50%; pointer-events: auto; }
#banner button.yf-circle { border: 1px solid #1d304566; border-radius: 50%; }
#banner .yf-scene-two { justify-content: center; color: #1d3045; }
#banner .yf-center-copy { max-width: 900px; }
#banner .yf-scene-two h2 { font-size: clamp(1.5rem,4.5vw,4.5rem); font-weight: 200; letter-spacing: .025em; line-height: 1.3; text-align: center; color: inherit; }
#banner .yf-tone-medium { color: #1d3045cc; }
#banner .yf-tone-light { color: #1d304580; }
#banner .yf-scene-controls { position: absolute; right: 24px; bottom: 64px; display: flex; flex-direction: column; align-items: center; gap: 16px; }
#banner .yf-dots { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: 16px; }
#banner .yf-dots span { width: 6px; height: 6px; border-radius: 50%; background: #1d304566; }
#banner .yf-dots span:first-child { width: 8px; height: 8px; background: #1d3045; }
#banner .yf-return { margin-top: 8px; }
#banner .yf-return .yf-circle { width: 40px; height: 40px; border-color: #1d30454d; color: #1d3045cc; }
#banner .yf-scene-three { justify-content: flex-end; color: #fff; }
#banner .yf-final-copy { max-width: 672px; text-align: left; }
#banner .yf-scene-three .yf-eyebrow { margin-bottom: 16px; font-size: 18px; line-height: 28px; letter-spacing: .025em; color: #fff9; }
#banner .yf-scene-three h2 { margin-bottom: 32px; font-size: clamp(2rem,4vw,4rem); font-weight: 300; line-height: 1.2; letter-spacing: .025em; color: #fff; }
#banner .yf-scene-three .yf-booking-label { color: #fffc; }
#banner :is(.yf-scene-one, .yf-scene-three) .yf-booking .yf-circle { width: 40px; height: 40px; border: 0; background: #fff; color: #1f2937; transition: background-color 60ms cubic-bezier(.165,.84,.44,1); }
#banner :is(.yf-scene-one, .yf-scene-three) .yf-booking:hover .yf-circle { background: #edf2f5; }
#banner .yf-stagger { transition: opacity 120ms cubic-bezier(.32,.72,0,1); }
#banner.yf-motion-ready .yf-stagger:not(.is-visible) { opacity: 0; }
#banner .yf-stagger.is-visible { opacity: 1; }
#banner .yf-nav-entry { transition: opacity 60ms cubic-bezier(.165,.84,.44,1); }
#yf-menu {
  position: fixed; inset: 0; z-index: 10000; color: #fff; background: #1d3045;
  font-family: 'Helvetica Neue ME', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  opacity: 0; visibility: hidden; overflow-y: auto; transition: opacity 300ms cubic-bezier(.165,.84,.44,1), visibility 0s 300ms;
}
#yf-menu.is-open { opacity: 1; visibility: visible; transition-property: opacity; transition-delay: 0s; }
#yf-menu button { transition: color 60ms cubic-bezier(.165,.84,.44,1), background-color 60ms cubic-bezier(.165,.84,.44,1), border-color 60ms cubic-bezier(.165,.84,.44,1); }
#yf-menu .yf-menu-inner { display: flex; flex-direction: column; min-height: 100%; transform: translateY(-16px); transition: transform 300ms cubic-bezier(.165,.84,.44,1); }
#yf-menu.is-open .yf-menu-inner { transform: translateY(0); }
#yf-menu .yf-menu-close-wrap { position: absolute; top: 0; right: 0; padding: 32px 24px 0; }
#yf-menu .yf-menu-close { display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; border: 1px solid #ffffff4d; border-radius: 50%; }
#yf-menu .yf-menu-close:hover { border-color: #fff; }
#yf-menu .yf-menu-links { display: flex; flex: 1; flex-direction: column; justify-content: center; padding: 0 32px; }
#yf-menu .yf-menu-link { display: block; padding: 12px 0; font-size: 24px; font-weight: 400; line-height: 32px; letter-spacing: 0; color: #c8d2dc; transition: color 60ms cubic-bezier(.165,.84,.44,1); }
#yf-menu .yf-menu-link[aria-current="page"], #yf-menu .yf-menu-link:hover { color: #fff; }
#yf-menu.is-open .yf-menu-link { opacity: 1; }
#yf-menu .yf-menu-footer { display: flex; gap: 32px; padding: 0 32px 40px; font-size: 12px; line-height: 16px; letter-spacing: .2em; color: #fff9; }
@media(min-width:640px) {
  #banner .yf-nav { padding: 48px 32px 24px; }
  #banner .yf-nav-right { display: flex; }
  #banner .yf-scene { padding-left: 32px; padding-right: 32px; }
  #banner .yf-scene-controls { right: 32px; }
  #banner .yf-mobile-break { display: none; }
  #banner .yf-subtitle-tail { display: inline; }
  #banner .yf-scene-one .yf-brand-kicker { font-size: 12px; }
  #banner .yf-scene-one .yf-description { font-size: 14px; }
  #yf-menu .yf-menu-close-wrap { padding: 48px 32px 0; }
  #yf-menu .yf-menu-links { padding: 0 48px; }
  #yf-menu .yf-menu-link { font-size: 30px; line-height: 36px; }
  #yf-menu .yf-menu-footer { padding-left: 48px; padding-right: 48px; }
}
@media(min-width:768px) {
  #banner .yf-nav { padding-left: 48px; padding-right: 48px; }
  #banner .yf-scene-one, #banner .yf-scene-three { padding-left: 80px; padding-right: 80px; }
  #banner .yf-scene-controls { right: 48px; }
}
@media(min-width:1024px) {
  #banner .yf-nav-desktop { display: flex; }
  #banner .yf-hamburger { display: none; }
  #banner .yf-scene-one, #banner .yf-scene-three { padding-left: 128px; padding-right: 128px; }
}
@media(min-width:1280px) { #banner .yf-nav-desktop { gap: 40px; } }
/* Keep the mobile opening copy in the quiet mist above the portrait artwork. */
@media(max-width:767px) {
  #banner .yf-scene-one .yf-brand-copy { transform: translateY(-15vh); }
}
@media(max-height:620px) {
  #banner .yf-scene-one h1 { font-size: clamp(56px,14vh,88px); }
  #banner .yf-scene-one .yf-brand-kicker { margin-bottom: 12px; }
  #banner .yf-scene-one .yf-subtitle { margin-top: 16px; font-size: 20px; }
  #banner .yf-scene-one .yf-description { margin-top: 16px; font-size: 12px; }
  #banner .yf-first-cta { margin-top: 20px; }
}
@media(prefers-reduced-motion:reduce) {
  #banner .yf-stagger, #banner .yf-nav-entry, #yf-menu, #yf-menu * { transition-duration: .01ms !important; transition-delay: 0ms !important; }
  #yf-menu .yf-menu-inner { transform: none; }
}
