/* ============================================================
   SITE-SHELL.CSS — Nav logo · Booking modal logo
   Single source of truth for logo sizing.
   Foil Explore Cruising — v2.1
   ============================================================ */

/* Nav logo — <img> injected by site-shell.js
   The logo asset is dark on transparent. Every page hero is a dark
   photo, and the scrolled nav is also dark (rgba 10,10,10 / 0.94).
   Apply a permanent invert so the logo is always white in the nav. */
.nav__logo-image {
  display: block;
  width: auto;
  height: 28px;
  max-width: 240px;
  filter: brightness(0) invert(1);
  transition: filter 400ms ease, opacity 0.2s;
}

@media (max-width: 767px) {
  .nav__logo-image {
    height: 24px;
    max-width: 180px;
  }
}

@media (min-width: 1200px) {
  .nav__logo-image {
    height: 28px;
    max-width: 240px;
  }
}

/* Booking modal logo — SVG wordmark injected by site-shell.js */
.booking-logo svg,
.booking-logo img {
  height: 28px;
  width: auto;
  max-width: 240px;
}