/* ==========================================================================
   Rose Water Capital — site-level overrides for the rebuilt (non-HubSpot) site
   ==========================================================================
   Two deliberate divergences from the original HubSpot build:

   1. HEADER POSITION NORMALIZED.
      HubSpot served `position: relative` on /, /wallis-and-stacy-townhomes
      and /via-delray-condominiums, but `position: static` on the other five
      pages. That inconsistency is what made the header look glitchy when
      moving between pages.

   2. HEADER IS NOW STICKY, solid brand navy (#141f3a).
      It was non-sticky and transparent everywhere before.
   ========================================================================== */

:root {
  --rw-navy: #141f3a;
  --rw-header-h: 123px;
}

/* --- 1 + 2: uniform, sticky, solid header ------------------------------- */

/* HubSpot set `overflow: hidden auto` on <body>, which turns body into its own
   scroll container. `position: sticky` then anchors to body instead of the
   viewport, so the header scrolls away on any page tall enough to scroll.
   Hand overflow back to the document; keep horizontal clipping via `clip`
   on <html> so we don't reintroduce sideways scroll. */
html {
  overflow-x: clip;
}

body {
  overflow: visible !important;
}

header.hs-elevate-header,
header[class*="site-header"],
body > header {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 10000 !important;
  background-color: var(--rw-navy) !important;
  width: 100%;
  transition: box-shadow 0.25s ease;
}

/* subtle lift once the page scrolls under it */
header.hs-elevate-header.rw-scrolled,
body > header.rw-scrolled {
  box-shadow: 0 2px 18px rgba(0, 0, 0, 0.34);
}

/* The header used to sit transparent over the hero. Now that it is solid and
   sticky, kill any negative offset that assumed an overlay header. */
main#main-content {
  margin-top: 0 !important;
}

/* Keep in-page anchor targets clear of the sticky header. */
[id]:not(body):not(html) {
  scroll-margin-top: calc(var(--rw-header-h) + 12px);
}

html {
  scroll-behavior: smooth;
}

/* Mobile: header shrinks, so track it with a smaller offset. */
@media (max-width: 767px) {
  :root {
    --rw-header-h: 96px;
  }
}