/* VASUNDHARA — CURRENT EDITORIAL LAYER + APPROVED HOMEPAGE COMPOSITION */
@import url('https://raw.githubusercontent.com/kusnyc/vasundhara.homes/17842ca95bf0a51cea953db5d5beff62d19037b9/legibility.css');

/* ================================================================
   HOMEPAGE — FULL-FRAME CINEMATIC HERO
   Reference: approved Aegean Sea composition.
   The photograph owns the frame; proposition/search sit quietly in
   the lower-left editorial field. Day/night swaps are full-frame,
   never a split-screen.
   ================================================================ */
body:has(.hero-cinematic) .hero-cinematic{
  height:100vh!important;
  min-height:720px!important;
  max-height:none!important;
  width:100vw!important;
  overflow:hidden!important;
  position:relative!important;
  background:#08111c!important;
}

body:has(.hero-cinematic) .hero-sea,
body:has(.hero-cinematic) .hero-mountain{
  inset:0!important;
  left:0!important;
  right:0!important;
  top:0!important;
  bottom:0!important;
  width:100%!important;
  height:100%!important;
  background-size:cover!important;
  background-position:center!important;
  transition:opacity 900ms ease,filter 900ms ease!important;
}

/* Full-frame state: one landscape at a time. */
body:has(.hero-cinematic) .hero-cinematic[data-hero-mode="day"] .hero-sea{
  opacity:1!important;
  filter:none!important;
  z-index:0!important;
}
body:has(.hero-cinematic) .hero-cinematic[data-hero-mode="day"] .hero-mountain{
  opacity:0!important;
  filter:none!important;
  z-index:0!important;
}
body:has(.hero-cinematic) .hero-cinematic[data-hero-mode="night"] .hero-sea{
  opacity:0!important;
  filter:none!important;
  z-index:0!important;
}
body:has(.hero-cinematic) .hero-cinematic[data-hero-mode="night"] .hero-mountain{
  opacity:1!important;
  filter:none!important;
  z-index:0!important;
}

/* Quiet cinematic grading — preserves the photograph instead of
   laying a heavy dashboard-like wash over it. */
body:has(.hero-cinematic) .hero-fade{
  inset:0!important;
  z-index:1!important;
  pointer-events:none!important;
  background:
    linear-gradient(180deg,rgba(5,13,24,.24) 0%,rgba(5,13,24,0) 24%,rgba(5,13,24,.10) 55%,rgba(4,10,18,.72) 100%),
    linear-gradient(90deg,rgba(4,11,20,.22) 0%,rgba(4,11,20,0) 48%,rgba(4,11,20,.10) 100%)!important;
}

/* Navigation remains over the image, exactly as in the reference. */
body:has(.hero-cinematic) .topbar{
  z-index:10!important;
  height:84px!important;
  padding:0 3.9vw!important;
}
body:has(.hero-cinematic) .brand span{font-size:1.42rem!important}
body:has(.hero-cinematic) .brand small{font-size:.46rem!important}
body:has(.hero-cinematic) .topbar nav{gap:38px!important}
body:has(.hero-cinematic) .topbar nav a{font-size:.82rem!important}
body:has(.hero-cinematic) .header-actions{gap:20px!important}
body:has(.hero-cinematic) .journey-btn{border-radius:12px!important;padding:15px 20px!important}

/* Lower-left proposition: deliberately compact and photographic. */
body:has(.hero-cinematic) .hero-copy{
  position:absolute!important;
  z-index:3!important;
  left:3.9vw!important;
  bottom:6.1vh!important;
  width:min(810px,55vw)!important;
  margin:0!important;
  padding:0!important;
  text-align:left!important;
}
body:has(.hero-cinematic) .hero-copy .kicker{
  max-width:720px!important;
  margin:0 0 18px!important;
  font-size:.58rem!important;
  line-height:1.35!important;
  letter-spacing:.27em!important;
}
body:has(.hero-cinematic) .hero-copy h1{
  max-width:620px!important;
  margin:0 0 17px!important;
  font-family:'Playfair Display',serif!important;
  font-size:clamp(2.8rem,3.35vw,3.65rem)!important;
  font-weight:400!important;
  line-height:.94!important;
  letter-spacing:-.025em!important;
  text-shadow:0 3px 24px rgba(0,0,0,.42)!important;
}
body:has(.hero-cinematic) .hero-copy .hero-sub{
  max-width:650px!important;
  margin:0 0 17px!important;
  font-size:.78rem!important;
  line-height:1.48!important;
  color:#f4f5f5!important;
  text-shadow:0 2px 12px rgba(0,0,0,.42)!important;
}

/* Reference search bar: wide, shallow, three-part control. */
body:has(.hero-cinematic) .hero-search{
  display:grid!important;
  grid-template-columns:1fr 1fr 205px!important;
  width:100%!important;
  max-width:none!important;
  margin:17px 0 13px!important;
  padding:4px!important;
  border-radius:8px!important;
  background:rgba(250,249,246,.95)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.20)!important;
}
body:has(.hero-cinematic) .hero-search>div{
  min-height:51px!important;
  padding:0 16px!important;
  border-right:1px solid #d8d6cf!important;
}
body:has(.hero-cinematic) .hero-search label{
  font-size:1rem!important;
  margin-right:9px!important;
}
body:has(.hero-cinematic) .hero-search input{
  padding:12px 0!important;
  font-size:.72rem!important;
}
body:has(.hero-cinematic) .hero-search>button{
  min-height:51px!important;
  padding:0 12px!important;
  font-size:.72rem!important;
  border-radius:5px!important;
}
body:has(.hero-cinematic) .hero-search>button b{
  font-size:1rem!important;
  margin-left:9px!important;
}
body:has(.hero-cinematic) .quick-search{
  font-size:.66rem!important;
  line-height:1.3!important;
  color:#f2f3f3!important;
  text-shadow:0 2px 10px rgba(0,0,0,.42)!important;
}
body:has(.hero-cinematic) .quick-search a{margin:0 7px!important}

/* Right-hand editorial signature. */
body:has(.hero-cinematic) .hero-side-note{
  right:3.9vw!important;
  bottom:7.1vh!important;
  z-index:3!important;
  font-size:2rem!important;
  line-height:.97!important;
  text-shadow:0 3px 20px rgba(0,0,0,.42)!important;
}
body:has(.hero-cinematic) .hero-side-note em{font-size:1.25rem!important}
body:has(.hero-cinematic) .hero-side-note span{margin-top:23px!important;font-size:.49rem!important}

@media(max-width:1100px){
  body:has(.hero-cinematic) .hero-copy{width:min(760px,64vw)!important}
  body:has(.hero-cinematic) .hero-copy h1{font-size:clamp(2.65rem,4.1vw,3.5rem)!important}
  body:has(.hero-cinematic) .hero-side-note{display:none!important}
}

@media(max-width:750px){
  body:has(.hero-cinematic) .hero-cinematic{min-height:760px!important}
  body:has(.hero-cinematic) .topbar{height:70px!important;padding:0 5vw!important}
  body:has(.hero-cinematic) .topbar nav,
  body:has(.hero-cinematic) .pin-mini{display:none!important}
  body:has(.hero-cinematic) .brand span{font-size:1.05rem!important}
  body:has(.hero-cinematic) .journey-btn{padding:10px 14px!important}
  body:has(.hero-cinematic) .hero-copy{
    left:1.2rem!important;
    right:1.2rem!important;
    bottom:1.9rem!important;
    width:auto!important;
  }
  body:has(.hero-cinematic) .hero-copy .kicker{font-size:.5rem!important;margin-bottom:12px!important}
  body:has(.hero-cinematic) .hero-copy h1{
    max-width:11ch!important;
    font-size:clamp(2.45rem,10vw,3.25rem)!important;
    margin-bottom:12px!important;
  }
  body:has(.hero-cinematic) .hero-copy .hero-sub{font-size:.74rem!important;margin-bottom:12px!important}
  body:has(.hero-cinematic) .hero-search{
    grid-template-columns:1fr!important;
    margin-top:12px!important;
  }
  body:has(.hero-cinematic) .hero-search>div{border-right:0!important;border-bottom:1px solid #ddd!important}
  body:has(.hero-cinematic) .hero-search>button{padding:14px!important}
  body:has(.hero-cinematic) .quick-search{display:none!important}
}