/* Window opening and projected light. Loaded on the homepage only. */
.home-page { isolation: isolate; overflow-x: clip; }
.home-page .header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 10;
  background: transparent;
  border: 0;
  height: 96px;
  color: var(--cream);
}
.home-page .header > .brand { display: none; }
.home-page .desktop-nav { gap: 34px; }
.home-page .desktop-nav a { text-shadow: 0 1px 5px var(--onyx); }
.home-page .header .button {
  background: var(--onyx);
  border-color: var(--taupe);
  color: var(--cream);
}
.home-page .header .button:hover { background: var(--cream); color: var(--onyx); }
.home-page .window-hero {
  position: relative;
  display: block;
  width: 100%;
  height: 100vh;
  height: 100svh;
  min-height: 560px;
  max-width: none;
  overflow: hidden;
}
.window-hero-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 42%;
}
.window-wordmark {
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 49%;
  transform: translate(-50%, -50%);
  width: clamp(300px, 43vw, 650px);
  margin: 0;
  line-height: 0;
  mix-blend-mode: normal;
}
.window-wordmark .logo {
  width: 100%;
  height: auto;
  transform: none;
  object-fit: contain;
  /* Remove the scan's pale paper tone and one-pixel outer frame without redrawing the wordmark. */
  filter: url('/images/wordmark-filter.svg#light-wordmark');
  clip-path: inset(2px);
  mix-blend-mode: normal;
}
/* Section backgrounds remain below the projection; content stays above it. */
.home-page .intro > *,
.home-page .food > *,
.home-page .room > *,
.home-page .story > *,
.home-page .invitation > * { position: relative; z-index: 3; }
.home-page footer { position: relative; z-index: 3; }
.projected-light {
  position: fixed;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  user-select: none;
  opacity: 0;
  transform-origin: 50% 35%;
  mix-blend-mode: hard-light;
  /* Only the small pre-softened texture surfaces move. No full-screen blur. */
}
.projected-light[hidden] { display: none; }
.light-fragments {
  position: absolute;
  width: min(55vw, 790px);
  height: auto;
  object-fit: contain;
  pointer-events: none;
}
.light-fragments-primary { top: -26%; left: -15%; transform: rotate(-16deg); }
.light-fragments-secondary { top: -35%; right: -22%; transform: rotate(-16deg) scale(.74); opacity: .64; }
@media(max-width:959px) {
  .home-page .header { height: 84px; }
  .home-page .header-actions { width: 100%; flex-direction: row-reverse; justify-content: space-between; }
  .home-page .menu-toggle { text-shadow: 0 1px 5px var(--onyx); }
  .home-page .mobile-nav { top: 0; padding-top: 90px; z-index: -1; }
  .home-page .window-hero { min-height: 560px; }
  .window-wordmark { width: 58vw; }
}
@media(max-width:600px) {
  .home-page .window-hero { min-height: 500px; }
  .window-hero-photo { object-position: 20% 50%; }
  .window-wordmark { width: 80vw; max-width: 360px; top: 49%; }
  .light-fragments-primary { width: 100vw; left: -37%; top: 1%; transform: rotate(-16deg); }
  .light-fragments-secondary { display: none; }
}
@media(prefers-reduced-motion:reduce) {
  .projected-light { display: none !important; }
}
