
/* =========================================================
   BRIGHT HERO / CONTACT SEPARATION / BUILDING COLOR FIX
   ========================================================= */

/* ---------------------------------------------------------
   HERO — brighter, same image throughout both scroll stages
   --------------------------------------------------------- */
.hero-scroll-story .hero-media,
.hero-scroll-story .hero-overlay{
  position:sticky!important;
  top:0!important;
  height:100svh!important;
  min-height:100svh!important;
}

.hero-scroll-story .hero-media img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  filter:
    brightness(1.18)
    contrast(.96)
    saturate(1.04)
    sepia(.02)!important;
  transform:none!important;
}

/* Lighter overlay so the room feels bright, not dull */
.hero-scroll-story .hero-overlay{
  background:
    linear-gradient(
      0deg,
      rgba(0,0,0,.46) 0%,
      rgba(0,0,0,.18) 48%,
      rgba(0,0,0,.08) 100%
    )!important;
}

/* Keep both stages visually tied to the same fixed image */
.hero-scroll-story .hero-stage{
  background:transparent!important;
}

.hero-opening-title,
.hero-stage-two{
  text-shadow:0 3px 24px rgba(0,0,0,.34);
}

/* ---------------------------------------------------------
   CONTACT — eliminate overlap completely
   --------------------------------------------------------- */
#contact{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:4rem!important;
  overflow:visible!important;
}

#contact .contact-heading{
  position:relative!important;
  width:100%!important;
  max-width:860px!important;
  margin:0!important;
  padding:0!important;
  z-index:1!important;
}

#contact .contact-heading h2{
  width:100%!important;
  max-width:760px!important;
  margin:0 0 1.75rem!important;
  font-size:clamp(2.5rem,4.2vw,4.6rem)!important;
  line-height:1.35!important;
  white-space:normal!important;
  word-break:keep-all!important;
  overflow:visible!important;
}

#contact .contact-heading p{
  width:100%!important;
  max-width:620px!important;
  margin:0!important;
}

#contact .contact-form{
  position:relative!important;
  width:100%!important;
  max-width:920px!important;
  margin:0!important;
  padding:0!important;
  z-index:1!important;
  clear:both!important;
}

/* Desktop alignment */
@media(min-width:769px){
  #contact{
    padding-top:clamp(7rem,9vw,10rem)!important;
    padding-bottom:clamp(7rem,9vw,10rem)!important;
  }

  #contact .contact-heading{
    margin-left:auto!important;
    margin-right:auto!important;
  }

  #contact .contact-form{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* Mobile */
@media(max-width:768px){
  #contact{
    display:block!important;
    padding:72px 20px!important;
  }

  #contact .contact-heading{
    max-width:100%!important;
    margin-bottom:3.25rem!important;
  }

  #contact .contact-heading h2{
    max-width:100%!important;
    font-size:clamp(1.9rem,8vw,2.3rem)!important;
    line-height:1.45!important;
  }

  #contact .contact-form{
    max-width:100%!important;
  }
}

/* ---------------------------------------------------------
   FINAL BUILDING IMAGE — remove blue cast
   --------------------------------------------------------- */
.reserve,
.reserve-bg,
.reserve-bg picture{
  background:#15120f!important;
}

.reserve-bg img,
.reserve > img{
  object-fit:cover!important;
  object-position:center 42%!important;
  filter:
    brightness(.92)
    contrast(1.02)
    saturate(.82)
    sepia(.10)
    hue-rotate(-8deg)!important;
  background:#15120f!important;
}

/* Replace any cool blue overlay with a warm neutral overlay */
.reserve::before,
.reserve-overlay,
.reserve-shade{
  background:
    linear-gradient(
      90deg,
      rgba(24,18,13,.68) 0%,
      rgba(24,18,13,.36) 45%,
      rgba(24,18,13,.12) 100%
    ),
    linear-gradient(
      0deg,
      rgba(20,15,11,.24),
      transparent 58%
    )!important;
  mix-blend-mode:normal!important;
}

/* Prevent inherited blue filters or tints */
.reserve,
.reserve *{
  box-shadow:none;
}

.reserve::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  background:rgba(255,238,214,.025);
}
