/* HomeSearch / D'Evia: separate each content section without reviving old light-blue branding.
   Every section shade is mixed ONLY from navy #14213D, cream #FAEDE0,
   coral #FF6B5B, and accessible white; photographs and floorplan art remain original. */
:root{
  --section-intro:color-mix(in srgb, #FAEDE0 89%, #FF6B5B 11%);
  --section-location:#FAEDE0;
  --section-layouts:color-mix(in srgb, #FAEDE0 84%, #FF6B5B 16%);
  --section-facilities:color-mix(in srgb, #FAEDE0 42%, #FFFFFF 58%);
  --section-gallery:color-mix(in srgb, #FAEDE0 92%, #FF6B5B 8%);
  --section-contact:color-mix(in srgb, #FAEDE0 82%, #FFFFFF 18%);
}
/* Fallback cream is first for browsers without color-mix support. */
.intro.section{background:#FAEDE0!important;background:var(--section-intro)!important}
.highlights.section{background:#14213D!important}
.location.section{background:#FAEDE0!important;background:var(--section-location)!important}
.layouts.section{background:#FAEDE0!important;background:var(--section-layouts)!important}
.facilities.section{background:#FAEDE0!important;background:var(--section-facilities)!important}
.gallery-section.section{background:#FAEDE0!important;background:var(--section-gallery)!important}
.virtual-tour.section{background:#14213D!important}
.contact.section{background:#FAEDE0!important;background:var(--section-contact)!important}
/* Thin separators strengthen the reading rhythm, without creating detached cards or gaps. */
main>.section{border-top:2px solid rgba(255,107,91,.18)}
main>.highlights.section,main>.virtual-tour.section{border-top-color:rgba(255,107,91,.50)}
/* The original intro's descriptive paragraphs are black as requested. */
#about .intro-copy>p:not(.fact-note){color:#000!important}
/* Original six illustrations remain white SVG artwork. */
#highlights .highlight-photo img{filter:drop-shadow(0 0 8px rgba(255,255,255,.13))!important}
@media(max-width:800px){
  /* Hero is cream on mobile; next section now has a distinctly peach-cream surface. */
  .intro.section{background:#FAEDE0!important;background:var(--section-intro)!important}
  .location.section{background:var(--section-location)!important}
  .layouts.section{background:var(--section-layouts)!important}
  .facilities.section{background:var(--section-facilities)!important}
  .gallery-section.section{background:var(--section-gallery)!important}
  .contact.section{background:var(--section-contact)!important}
  main>.section{border-top-width:2px}
}