/* V196 — HEE PEE HOSTEL botanical background, homepage only.
   Visual layer only. No pointer events, no layout/logic changes. */
.hph-botanical-page{
  --hph-botanical:url("hph-botanical-bg-v196.png");
}

/* Apply the faint botanical artwork only to the principal white content areas. */
.hph-botanical-page .hero,
.hph-botanical-page .hero-copy,
.hph-botanical-page .section,
.hph-botanical-page .highlights{
  background-color:#fff!important;
  background-image:
    linear-gradient(rgba(255,255,255,.68),rgba(255,255,255,.68)),
    var(--hph-botanical)!important;
  background-repeat:repeat-y!important;
  background-size:min(1180px,100vw) auto!important;
  background-position:center top!important;
}

/* Keep non-white branded sections untouched. */
.hph-botanical-page .about{
  background-image:none!important;
}
.hph-botanical-page .footer{
  background-image:none!important;
}

/* Cards stay readable and preserve their existing layout. */
.hph-botanical-page .room,
.hph-botanical-page .feature,
.hph-botanical-page .bike-feature,
.hph-botanical-page .contact-card,
.hph-botanical-page .room-icon-link{
  background-color:rgba(255,255,255,.94)!important;
}

/* Decorative layer must never interfere with taps/clicks. */
.hph-botanical-page .hero,
.hph-botanical-page .hero-copy,
.hph-botanical-page .section,
.hph-botanical-page .highlights{
  pointer-events:auto;
}

@media(max-width:640px){
  .hph-botanical-page .hero,
  .hph-botanical-page .hero-copy,
  .hph-botanical-page .section,
  .hph-botanical-page .highlights{
    background-size:920px auto!important;
    background-position:center top!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .hph-botanical-page *{scroll-behavior:auto!important;}
}
