/* Homepage hero: room photo replaces the poppy hero (6 Nov 2026).
   Loaded after landing-nav.css. The photo fills the hero (object-fit: cover);
   a soft white wash at the top keeps the headline readable over the photo.
   Uses class .hero-photo, not .poppies, so main.js leaves it still. */

.hero .hero-photo {
  position: absolute; inset: 0;
  width: 100%; height: 100%; max-width: none;
  display: block;
  object-fit: cover;
  pointer-events: none; user-select: none;
}
.hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
}

@media (max-width: 1099px) {
  .hero { background: var(--white); }
  .hero .hero-photo { object-position: 42% 60%; }
  .headline { top: 88px; }
  .hero::after {
    background: linear-gradient(to bottom,
      rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.42) 200px, rgba(255,255,255,0) 300px);
  }
}

@media (min-width: 1100px) {
  .hero { background: var(--white); }
  .hero .hero-photo { object-position: 50% 62%; }
  .headline { top: calc(88px + var(--lp-nav-h) + 40px); }
  .hero::after {
    background: linear-gradient(to bottom,
      rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.38) 280px, rgba(255,255,255,0) 430px);
  }
  .d-journeys { top: auto; bottom: 56px; }
}

/* Lighter wash needs a soft glow behind the headline so it still reads over the photo */
.headline h1, .headline p { text-shadow: 0 0 18px rgba(255,255,255,0.9), 0 0 4px rgba(255,255,255,0.8); }

/* Solid white header, like the footer */
#landing .site-header {
  background: var(--white);
  border-bottom: 1px solid var(--hairline);
  -webkit-backdrop-filter: none; backdrop-filter: none;
}


/* Narrow desktops: keep the cards clear of the subtitle */
@media (min-width: 1100px) and (max-width: 1199px) { .hero { min-height: 790px; } }