/* Homepage-only art direction. Property pages retain their white header. */
body:has(.hero-viver) { min-width: 0; }
.hero-viver {
  --hero-cream: #f8f2e9;
  height: auto;
  min-height: 0;
  overflow: visible;
  z-index: 20;
  background: var(--hero-cream);
}

/* Immersive condominium hero: real interface layered over a clean property photograph. */
body:has(.hero-viver) { background: #071a2b; }
.hero-viver { position: relative; min-height: 100svh; height: 100svh; overflow: hidden; background: #071a2b; }
.hero-viver .hero-scene { position: absolute; inset: 0; overflow: hidden; background: #071a2b; }
.hero-viver .hero-scene::after { position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgba(4,18,31,.72) 0%, rgba(4,18,31,.36) 35%, rgba(4,18,31,.04) 72%), linear-gradient(0deg, rgba(2,14,25,.32), transparent 42%); content: ""; pointer-events: none; }
.hero-viver .hero-art { position: absolute; z-index: 0; inset: 0; width: 100%; margin: 0; padding: 0; }
.hero-viver .hero-art > img { display: block; width: 100%; height: 100%; max-height: none; aspect-ratio: auto; object-fit: cover; object-position: center center; filter: saturate(.92) contrast(1.02) brightness(.92); }
.hero-viver .site-header { position: absolute; z-index: 7; top: 0; right: 0; left: 0; display: grid; grid-template-columns: 1fr auto 1fr; min-height: 102px; padding: 22px 5%; background: transparent; color: #fff; }
.hero-viver .brand { width: 178px; padding: 10px 13px; background: rgba(255,255,255,.92); }
.hero-viver .brand-logo { display: block; width: 100%; height: auto; }
.hero-viver .main-nav { display: none; }
.hero-viver .hero-contact-links { justify-self: end; }
.hero-viver .hero-contact-links a { color: #fff; background: transparent; }
.hero-viver .hero-contact-links a:hover { background: rgba(255,255,255,.12); }
.hero-immersive-nav { position: absolute; z-index: 5; top: 25%; left: 5%; display: grid; gap: 17px; }
.hero-immersive-nav > a { display: block; color: rgba(222,231,235,.48); font-size: clamp(20px, 2.7vw, 42px); font-weight: 500; letter-spacing: .035em; line-height: 1.05; text-decoration: none; transform-origin: left center; transition: color 180ms ease, opacity 180ms ease, transform 180ms var(--ease-out, cubic-bezier(.23,1,.32,1)); }
.hero-immersive-nav > a.is-active, .hero-immersive-nav > a:hover, .hero-immersive-nav > a:focus-visible { color: #fff; transform: scale(1.07); }
.hero-immersive-nav > a.is-active { position: relative; }
.hero-immersive-nav > a.is-active::before { position: absolute; top: 0; bottom: 0; left: -22px; width: 2px; background: var(--green); content: ""; }
.hero-immersive-note { display: grid; gap: 17px; margin: 10px 0 0; }
.hero-immersive-note > span { width: 30px; height: 1px; background: rgba(255,255,255,.72); }
.hero-immersive-note p { margin: 0; color: rgba(255,255,255,.78); font-size: 10px; font-weight: 700; letter-spacing: .22em; line-height: 1.75; }
.hero-viver .search-panel { position: absolute; z-index: 8; right: 5%; bottom: 42px; left: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr); width: min(520px, 46vw); min-height: 0; margin: 0; padding: 10px; gap: 8px; border: 1px solid rgba(255,255,255,.7); border-radius: 3px; background: rgba(248,244,236,.94); box-shadow: 0 18px 42px rgba(0,0,0,.22); backdrop-filter: blur(12px); }
.hero-viver .search-tabs { grid-column: 1 / -1; min-height: 48px; border: 0; }
.hero-viver .search-tab, .hero-viver .search-submit, .hero-viver .filters-toggle { min-height: 48px; border-radius: 2px; font-size: 11px; letter-spacing: .14em; }
.hero-viver .search-tab { width: 100%; min-width: 0; background: #0b2e4d; color: #fff; }
.hero-viver .location-field { grid-column: 1 / -1; min-height: 48px; margin: 0; padding: 0 10px; border: 1px solid rgba(11,46,77,.2); background: rgba(255,255,255,.55); }
.hero-viver .location-field::before { content: none; }
.hero-viver .location-field input { font-size: 11px; letter-spacing: .07em; }
.hero-viver .search-submit { min-width: 0; margin: 0; background: #0b2e4d; }
.hero-viver .filters-toggle { min-width: 0; margin: 0; padding: 0 10px; border: 1px solid rgba(11,46,77,.22); background: transparent; }
.hero-viver .filters-popover { right: 0; bottom: calc(100% + 12px); width: min(620px, 92vw); }
.hero-viver .search-feedback { color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,.4); }
@media (max-width: 900px) {
  .hero-viver { min-height: 100svh; height: 100svh; }
  .hero-viver .site-header { grid-template-columns: 1fr auto auto; min-height: 78px; padding: 14px 18px; }
  .hero-viver .brand { width: 148px; padding: 8px 10px; }
  .hero-viver .hero-contact-links a { width: 38px; height: 38px; }
  .hero-viver .hero-menu-toggle { display: flex; color: #fff; border-color: rgba(255,255,255,.55); background: rgba(4,18,31,.28); }
  .hero-immersive-nav { top: 22%; left: 31px; gap: 13px; }
  .hero-immersive-nav > a { font-size: clamp(19px, 5vw, 30px); }
  .hero-immersive-nav > a.is-active::before { left: -13px; }
  .hero-immersive-note p { font-size: 8px; }
  .hero-viver .search-panel { right: 18px; bottom: 18px; left: 18px; width: auto; }
}
@media (max-width: 640px) {
  .hero-viver .hero-art > img { object-position: 64% center; }
  .hero-viver .hero-contact-links { gap: 0; }
  .hero-viver .hero-contact-links a:first-child { display: none; }
  .hero-immersive-nav { top: 20%; left: 27px; }
  .hero-immersive-nav > a { font-size: clamp(17px, 5.8vw, 25px); }
  .hero-immersive-note { margin-top: 6px; }
  .hero-viver .search-panel { grid-template-columns: 1fr 1fr; padding: 8px; gap: 7px; }
  .hero-viver .search-tabs, .hero-viver .location-field { grid-column: 1 / -1; }
  .hero-viver .filters-popover { position: fixed; inset: auto 12px 12px; width: auto; max-height: calc(100svh - 100px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-immersive-nav > a { transition: none; }
}
.hero-scene { position: relative; background: #fff; }
.hero-art { display: block; }
.hero-art > img { display: block; width: 100%; height: clamp(420px, 40vw, 600px); aspect-ratio: auto; object-fit: cover; object-position: center 45%; }
.hero-viver .site-header {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 32px;
  min-height: clamp(82px, 7vw, 112px);
  padding: 0 6.6%;
  background: #fff;
  color: var(--navy);
  z-index: 6;
}
.hero-viver .brand { gap: 0; width: clamp(180px, 15vw, 230px); color: inherit; text-decoration: none; }
.hero-viver .brand-logo { display: block; width: 100%; height: auto; filter: none; }
.hero-brand-mark { position: relative; display: block; width: 44px; height: 46px; overflow: hidden; flex: 0 0 auto; }
.hero-viver .hero-brand-mark img { position: absolute; width: 290px; height: auto; max-width: none; left: -123px; top: 0; filter: brightness(0) invert(1); }
.hero-brand-name { font-size: clamp(22px, 1.9vw, 32px); font-weight: 500; letter-spacing: .23em; line-height: 1; }
.hero-brand-name small { display: block; padding-top: 8px; font-size: 8px; font-weight: 400; letter-spacing: .46em; }
.hero-viver .main-nav { display: flex; justify-content: center; gap: clamp(22px, 2.5vw, 48px); min-height: 44px; }
.hero-viver .main-nav > a { color: var(--navy); font-size: clamp(11px, .86vw, 14px); font-weight: 600; letter-spacing: .08em; line-height: 1.4; text-transform: uppercase; }
.hero-viver .main-nav > a { display: inline-flex; align-items: center; min-height: 44px; }
.hero-viver .main-nav a:first-child::after { content: none; }
.hero-contact-links { display: flex; align-items: center; gap: 8px; justify-self: end; }
.hero-contact-links a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--navy); text-decoration: none; border-radius: 2px; transition: background-color 160ms ease; }
.hero-contact-links a:active { transform: scale(.97); }
.hero-menu-toggle { display: none; }
.hero-intro { position: absolute; bottom: clamp(38px, 4vw, 72px); left: 6%; margin: 0; color: var(--hero-cream); font-size: clamp(12px, 1.28vw, 23px); line-height: 1.4; letter-spacing: .035em; font-weight: 400; text-transform: uppercase; text-shadow: 0 2px 16px rgba(0,0,0,.25); }
.hero-viver .search-panel { text-transform: uppercase; }
.hero-viver .search-panel {
  position: relative;
  inset: auto;
  display: grid;
  grid-template-columns: auto minmax(180px, 1fr) auto auto;
  align-items: center;
  gap: clamp(18px, 2.1vw, 40px);
  min-height: 112px;
  margin: 0;
  padding: clamp(20px, 1.4vw, 28px) 4.2% clamp(26px, 2.5vw, 42px);
  border: 0;
  border-top: 1px solid #d9dfe2;
  border-radius: 0;
  box-shadow: none;
  background: var(--hero-cream);
  backdrop-filter: none;
  letter-spacing: 0;
  scroll-margin-top: 24px;
  z-index: 7;
}
.hero-viver .search-tabs { grid-column: auto; align-self: stretch; min-height: 56px; border: 1px solid var(--navy); }
.hero-viver .search-tab,
.hero-viver .search-submit,
.hero-viver .filters-toggle { min-height: 56px; font-size: clamp(12px, .9vw, 16px); font-weight: 500; letter-spacing: .06em; text-transform: uppercase; border-radius: 0; transition: background-color 160ms ease, color 160ms ease; }
.hero-viver .search-tab { min-width: clamp(100px, 10vw, 170px); padding: 0 20px; }
.hero-viver .location-field { position: relative; align-self: stretch; margin: 0; padding: 0 8px 0 14px; gap: 18px; border: 0; border-bottom: 1px solid var(--navy); }
.hero-viver .location-field::before { content: ""; position: absolute; top: 12%; bottom: 12%; left: calc(clamp(18px, 2.1vw, 40px) / -2); width: 1px; background: #304b5566; }
.hero-search-icon { flex: 0 0 auto; }
.hero-viver .location-field input { padding: 10px 0; font-size: clamp(12px, .9vw, 16px); font-weight: 400; letter-spacing: .015em; color: var(--navy); }
.hero-viver .search-panel input::placeholder { text-transform: uppercase; }
.hero-viver .location-field input::placeholder { color: #496873; }
.hero-viver .search-submit { min-width: clamp(112px, 10vw, 170px); margin: 0; padding: 0 22px; }
.hero-viver .search-submit:hover { transform: none; }
.hero-viver .filters-toggle { gap: 16px; min-width: 110px; margin: 0; padding: 0 0 0 clamp(20px, 2.5vw, 42px); border-left: 1px solid #304b5566; }
.hero-viver .filters-popover { right: 4.2%; bottom: calc(100% + 12px); width: min(620px, 91.6vw); max-height: min(660px, 72svh); overscroll-behavior: contain; border-radius: 4px; background: #fff; }
.hero-filter-actions { display: flex; align-items: center; gap: 18px; }
.hero-filters-close { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--line); background: transparent; color: var(--navy); cursor: pointer; }
.hero-viver .search-feedback { position: static; grid-column: 1 / -1; margin: -10px 0 0; color: var(--navy); font-size: 11px; font-weight: 500; line-height: 1.5; letter-spacing: .03em; text-shadow: none; text-align: left; }
.hero-viver .search-feedback:empty { display: none; }
.hero-viver :is(a, button, summary, input):focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.hero-viver .location-field:focus-within { box-shadow: 0 1px 0 var(--navy); }
.hero-viver .location-field input:focus-visible { outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) {
  .hero-viver .main-nav > a:hover { text-decoration: underline; text-underline-offset: 6px; }
  .hero-contact-links a:hover { background: #ffffff14; }
  .hero-viver .search-tab:not(.is-active):hover,
  .hero-viver .filters-toggle:hover { background: #304b550c; }
}
@media (max-width: 1100px) {
  .hero-viver .site-header { padding-inline: 5%; gap: 20px; grid-template-columns: auto 1fr auto; }
  .hero-viver .main-nav { justify-self: center; gap: 20px; }
  .hero-viver .search-panel { gap: 22px; padding-inline: 4%; }
  .hero-viver .search-tab { min-width: 92px; padding-inline: 16px; }
  .hero-viver .location-field { gap: 12px; padding-left: 2px; }
}
@media (max-width: 900px) {
  .hero-viver .site-header { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; min-height: 78px; padding: 12px 5%; }
  .hero-viver .brand { grid-column: 1; grid-row: 1; }
  .hero-contact-links { grid-column: 2; grid-row: 1; gap: 0; }
  .hero-menu-toggle { grid-column: 3; grid-row: 1; }
  .hero-menu-toggle { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; width: 44px; height: 44px; border: 1px solid #304b5533; background: #fff; color: var(--navy); cursor: pointer; }
  .hero-menu-toggle span { width: 22px; height: 1px; background: currentColor; }
  .hero-menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
  .hero-menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
  .hero-viver .main-nav { display: none; position: absolute; top: calc(100% - 4px); left: 5%; right: 5%; justify-self: stretch; padding: 16px 24px; background: #fff; border: 1px solid #304b551f; box-shadow: 0 12px 28px #00132522; }
  .hero-viver .main-nav.is-open { display: grid; gap: 2px; max-height: calc(100svh - 100px); overflow-y: auto; }
  .hero-viver .site-header:has(.main-nav.is-open) { z-index: 8; }
  .hero-viver .main-nav > a { color: var(--navy); font-size: 13px; }
  .hero-viver .search-panel { grid-template-columns: 1fr auto auto; gap: 16px 22px; padding: 22px 5% 28px; }
  .hero-viver .search-tabs { grid-row: 1; grid-column: 1 / -1; justify-self: start; }
  .hero-viver .location-field { grid-row: 2; }
  .hero-viver .location-field::before { content: none; }
  .hero-viver .search-submit,
  .hero-viver .filters-toggle { grid-row: 2; }
  .hero-intro { font-size: clamp(11px, 1.28vw, 16px); }
}
@media (min-width: 641px) and (max-width: 900px) {
  .hero-viver .site-header { padding-block: 8px; }
  .hero-brand-mark { width: 30px; height: 32px; }
  .hero-viver .hero-brand-mark img { width: 205px; left: -87px; }
  .hero-brand-name { font-size: 20px; }
  .hero-brand-name small { padding-top: 5px; font-size: 6px; }
  .hero-menu-toggle { width: 40px; height: 40px; }
}
@media (max-width: 640px) {
  .hero-art > img { height: min(112vw, 520px); object-position: center 44%; }
  .hero-viver .site-header { padding: 14px 16px; gap: 6px; }
  .hero-viver .brand { width: 150px; }
  .hero-brand-mark { width: 30px; height: 32px; }
  .hero-viver .hero-brand-mark img { width: 205px; left: -87px; }
  .hero-viver .brand { gap: 8px; }
  .hero-brand-name { font-size: 20px; }
  .hero-brand-name small { padding-top: 6px; font-size: 6px; }
  .hero-intro { left: 5%; bottom: 28px; padding: 0; font-size: 12px; line-height: 1.35; }
  .hero-viver .search-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 20px 20px 24px; }
  .hero-viver .search-tabs { width: 100%; justify-self: stretch; min-height: 48px; }
  .hero-viver .search-tab { width: 50%; min-width: 0; min-height: 48px; }
  .hero-viver .location-field { grid-column: 1 / -1; width: 100%; min-height: 52px; padding: 0; border-top: 0; border-right: 0; border-left: 0; gap: 10px; }
  .hero-search-icon { width: 24px; height: 24px; }
  .hero-viver .location-field input { font-size: 16px; }
  .hero-viver .location-field input::placeholder { font-size: 12px; letter-spacing: .005em; }
  .hero-viver .search-submit,
  .hero-viver .filters-toggle { grid-row: 3; min-width: 0; min-height: 48px; font-size: 12px; padding: 0 16px; }
  .hero-viver .filters-toggle { border: 1px solid var(--navy); }
  .hero-viver .filters-popover { position: fixed; inset: auto 12px 12px; width: auto; max-height: calc(100svh - 100px); padding: 18px; box-shadow: 0 0 0 100vmax #03182b66; }
  .hero-viver .filter-section summary small { display: none; }
  .hero-viver .filter-fields { grid-template-columns: 1fr 1fr; }
  .hero-viver .filter-fields-three label:last-child { grid-column: 1 / -1; }
  .hero-viver .search-feedback { margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(.hero-viver) { scroll-behavior: auto; }
  .hero-viver :is(button, a, summary) { transition: none; }
}

/* Editorial hero direction: open cream canvas, oversized type and organic property image. */
.hero-viver {
  --hero-cream: #f4f1e8;
  background: var(--hero-cream);
}

.hero-viver .hero-scene {
  background: var(--hero-cream);
}

.hero-editorial-copy {
  padding: clamp(34px, 4.6vw, 76px) 24px 0;
  color: var(--navy);
  text-align: center;
}

.hero-editorial-kicker {
  margin: 0 0 clamp(15px, 1.6vw, 24px);
  color: var(--green);
  font-size: clamp(9px, .72vw, 12px);
  font-weight: 700;
  letter-spacing: .24em;
  line-height: 1.4;
}

.hero-editorial-copy h1 {
  max-width: none;
  margin: 0;
  color: var(--navy);
  font-size: clamp(58px, 9.25vw, 156px);
  font-weight: 800;
  letter-spacing: -.085em;
  line-height: .78;
  text-transform: uppercase;
}

.hero-editorial-copy h1 em {
  display: inline-block;
  font-family: Georgia, "Times New Roman", serif;
  font-size: .74em;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -.075em;
  text-transform: none;
}

.hero-viver .hero-art {
  width: min(100%, 1510px);
  margin: clamp(24px, 3vw, 44px) auto 0;
  padding: 0 clamp(16px, 4.5vw, 76px);
}

.hero-viver .hero-art > img {
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  object-position: center;
  filter: saturate(.88) contrast(.96) brightness(1.04);
}

.hero-viver .hero-intro {
  position: static;
  width: fit-content;
  margin: clamp(18px, 2vw, 28px) auto 0;
  color: var(--navy);
  font-size: clamp(10px, .8vw, 13px);
  font-weight: 700;
  letter-spacing: .19em;
  line-height: 1.55;
  text-align: center;
  text-shadow: none;
}

.hero-viver .search-panel {
  width: min(100%, 1510px);
  margin: clamp(26px, 4vw, 56px) auto 0;
  padding-top: clamp(18px, 1.6vw, 28px);
  background: var(--hero-cream);
}

@media (max-width: 640px) {
  .hero-editorial-copy {
    padding-top: 32px;
  }

  .hero-editorial-kicker {
    max-width: 250px;
    margin-right: auto;
    margin-left: auto;
    font-size: 9px;
    letter-spacing: .18em;
  }

  .hero-editorial-copy h1 {
    font-size: clamp(50px, 17vw, 84px);
    line-height: .84;
  }

  .hero-viver .hero-art {
    margin-top: 24px;
    padding-inline: 12px;
  }

  .hero-viver .hero-art > img {
    aspect-ratio: auto;
  }

  .hero-viver .hero-intro {
    margin-top: 14px;
    font-size: 9px;
    letter-spacing: .13em;
  }

  .hero-viver .search-panel {
    margin-top: 28px;
  }
}

/* Final immersive hero overrides: keep the clean property image as the canvas
   and place the real logo, navigation and search UI above it. */
body:has(.hero-viver) {
  background: #071a2b;
}

.hero-viver {
  position: relative;
  height: 100svh;
  min-height: 100svh;
  overflow: hidden;
  background: #071a2b;
}

.hero-viver .hero-scene {
  position: absolute;
  inset: 0;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
  background: #071a2b;
}

.hero-viver .hero-scene::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 18, 31, .74) 0%, rgba(4, 18, 31, .38) 35%, rgba(4, 18, 31, .04) 72%),
    linear-gradient(0deg, rgba(2, 14, 25, .34), transparent 42%);
  content: "";
  pointer-events: none;
}

.hero-viver .hero-art {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

.hero-viver .hero-art > img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: none;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center center;
  filter: saturate(.92) contrast(1.02) brightness(.92);
}

.hero-viver .site-header {
  position: absolute;
  z-index: 7;
  top: 0;
  right: 0;
  bottom: auto;
  left: 0;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 102px;
  padding: 22px 5%;
  background: transparent;
  color: #fff;
}

.hero-viver .brand {
  width: 178px;
  padding: 10px 13px;
  background: rgba(255, 255, 255, .92);
}

.hero-viver .brand-logo {
  display: block;
  width: 100%;
  height: auto;
}

.hero-viver .main-nav {
  display: none;
}

.hero-viver .hero-contact-links {
  justify-self: end;
}

.hero-viver .hero-contact-links a {
  color: #fff;
  background: transparent;
}

.hero-viver .hero-contact-links a:hover {
  background: rgba(255, 255, 255, .12);
}

.hero-immersive-nav {
  position: absolute;
  z-index: 5;
  top: 25%;
  left: 5%;
  display: grid;
  gap: 17px;
}

.hero-immersive-nav > a {
  display: block;
  color: rgba(222, 231, 235, .48);
  font-size: clamp(20px, 2.7vw, 42px);
  font-weight: 500;
  letter-spacing: .035em;
  line-height: 1.05;
  text-decoration: none;
  transform-origin: left center;
  transition: color 180ms ease, opacity 180ms ease, transform 180ms var(--ease-out, cubic-bezier(.23, 1, .32, 1));
}

.hero-immersive-nav > a.is-active,
.hero-immersive-nav > a:hover,
.hero-immersive-nav > a:focus-visible {
  color: #fff;
  transform: scale(1.07);
}

.hero-immersive-nav > a.is-active {
  position: relative;
}

.hero-immersive-nav > a.is-active::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -22px;
  width: 2px;
  background: var(--green);
  content: "";
}

.hero-immersive-note {
  display: grid;
  gap: 17px;
  margin: 10px 0 0;
}

.hero-immersive-note > span {
  width: 30px;
  height: 1px;
  background: rgba(255, 255, 255, .72);
}

.hero-immersive-note p {
  margin: 0;
  color: rgba(255, 255, 255, .78);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .22em;
  line-height: 1.75;
}

.hero-viver .search-panel {
  position: absolute;
  z-index: 8;
  right: 5%;
  bottom: 42px;
  left: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr);
  width: min(520px, 46vw);
  min-height: 0;
  margin: 0;
  padding: 10px;
  gap: 8px;
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 3px;
  background: rgba(248, 244, 236, .94);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .22);
  backdrop-filter: blur(12px);
}

.hero-viver .search-tabs {
  grid-column: 1 / -1;
  min-height: 48px;
  border: 0;
}

.hero-viver .search-tab,
.hero-viver .search-submit,
.hero-viver .filters-toggle {
  min-height: 48px;
  border-radius: 2px;
  font-size: 11px;
  letter-spacing: .14em;
}

.hero-viver .search-tab {
  width: 100%;
  min-width: 0;
  background: #0b2e4d;
  color: #fff;
}

.hero-viver .location-field {
  grid-column: 1 / -1;
  min-height: 48px;
  margin: 0;
  padding: 0 10px;
  border: 1px solid rgba(11, 46, 77, .2);
  background: rgba(255, 255, 255, .55);
}

.hero-viver .location-field::before {
  content: none;
}

.hero-viver .location-field input {
  font-size: 11px;
  letter-spacing: .07em;
}

.hero-viver .search-submit {
  min-width: 0;
  margin: 0;
  background: #0b2e4d;
}

.hero-viver .filters-toggle {
  min-width: 0;
  margin: 0;
  padding: 0 10px;
  border: 1px solid rgba(11, 46, 77, .22);
  background: transparent;
}

.hero-viver .filters-popover {
  right: 0;
  bottom: calc(100% + 12px);
  width: min(620px, 92vw);
}

.hero-viver .search-feedback {
  color: #fff;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .4);
}

@media (max-width: 900px) {
  .hero-viver .site-header {
    grid-template-columns: minmax(0, 1fr) auto auto;
    min-height: 78px;
    padding: 14px 18px;
  }

  .hero-viver .brand {
    width: 148px;
    padding: 8px 10px;
  }

  .hero-viver .hero-contact-links a {
    width: 38px;
    height: 38px;
  }

  .hero-viver .hero-menu-toggle {
    display: flex;
    color: #fff;
    border-color: rgba(255, 255, 255, .55);
    background: rgba(4, 18, 31, .28);
  }

  .hero-immersive-nav {
    top: 22%;
    left: 31px;
    gap: 13px;
  }

  .hero-immersive-nav > a {
    font-size: clamp(19px, 5vw, 30px);
  }

  .hero-immersive-nav > a.is-active::before {
    left: -13px;
  }

  .hero-immersive-note p {
    font-size: 8px;
  }

  .hero-viver .search-panel {
    right: 18px;
    bottom: 18px;
    left: 18px;
    width: auto;
  }
}

@media (max-width: 640px) {
  .hero-viver .hero-art > img {
    object-position: 64% center;
  }

  .hero-viver .hero-contact-links {
    gap: 0;
  }

  .hero-viver .hero-contact-links a:first-child {
    display: none;
  }

  .hero-immersive-nav {
    top: 20%;
    left: 27px;
  }

  .hero-immersive-nav > a {
    font-size: clamp(17px, 5.8vw, 25px);
  }

  .hero-immersive-note {
    margin-top: 6px;
  }

  .hero-viver .search-panel {
    grid-template-columns: 1fr 1fr;
    padding: 8px;
    gap: 7px;
  }

  .hero-viver .search-tabs,
  .hero-viver .location-field {
    grid-column: 1 / -1;
  }

  .hero-viver .filters-popover {
    position: fixed;
    inset: auto 12px 12px;
    width: auto;
    max-height: calc(100svh - 100px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-immersive-nav > a {
    transition: none;
  }
}

/* Editorial interior gallery: one neutral, immersive stage for the search. */
.hero-viver .hero-art {
  isolation: isolate;
}

.hero-viver .hero-art > img {
  display: block;
  transition: opacity 700ms ease, transform 1200ms cubic-bezier(.2, .7, .2, 1);
}

.hero-viver .hero-art.is-changing > img {
  opacity: .2;
  transform: scale(1.025);
}

.hero-gallery-controls {
  position: absolute;
  z-index: 3;
  right: clamp(22px, 5vw, 76px);
  bottom: clamp(24px, 4vw, 54px);
  left: clamp(22px, 5vw, 76px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
}

.hero-gallery-arrow,
.hero-gallery-dot {
  pointer-events: auto;
}

.hero-gallery-arrow {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 50%;
  color: #fff;
  background: rgba(7, 26, 43, .18);
  font: 400 23px/1 Arial, sans-serif;
  cursor: pointer;
  transition: background-color 180ms ease, transform 180ms ease;
}

.hero-gallery-arrow:hover,
.hero-gallery-arrow:focus-visible {
  background: rgba(255, 255, 255, .22);
  transform: scale(1.04);
}

.hero-gallery-dots {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 999px;
  background: rgba(7, 26, 43, .22);
  backdrop-filter: blur(7px);
}

.hero-gallery-dot {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .86);
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  transition: background-color 180ms ease, transform 180ms ease;
}

.hero-gallery-dot.is-active,
.hero-gallery-dot:hover,
.hero-gallery-dot:focus-visible {
  background: #fff;
  transform: scale(1.25);
}

.hero-viver .search-panel {
  top: 44%;
  right: 50%;
  bottom: auto;
  left: auto;
  transform: translate(50%, -50%);
}

@media (max-width: 900px) {
  .hero-viver .search-panel {
    top: 46%;
    right: 18px;
    bottom: auto;
    left: 18px;
    transform: translateY(-50%);
  }
}

@media (max-width: 640px) {
  .hero-gallery-controls {
    right: 18px;
    bottom: 18px;
    left: 18px;
  }

  .hero-gallery-arrow {
    width: 42px;
    height: 42px;
  }

  .hero-viver .search-panel {
    top: 48%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-viver .hero-art > img,
  .hero-gallery-arrow,
  .hero-gallery-dot {
    transition: none;
  }
}

/* Final hero direction: white navigation band above a full-width image strip. */
body:has(.hero-viver) {
  background: #fff;
}

.hero-viver {
  height: min(100svh, 820px);
  min-height: 620px;
  background: #fff;
}

.hero-viver .hero-scene {
  position: relative;
  inset: auto;
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 100%;
  background: #fff;
}

.hero-viver .site-header {
  position: relative;
  inset: auto;
  z-index: 7;
  flex: 0 0 auto;
  min-height: 94px;
  padding: 15px 5%;
  border-bottom: 1px solid rgba(11, 46, 77, .12);
  background: #fff;
  color: #0b2e4d;
}

.hero-viver .brand {
  width: 178px;
  padding: 0;
  background: transparent;
}

.hero-viver .main-nav {
  display: flex;
  align-items: center;
  justify-self: center;
  gap: clamp(18px, 2.6vw, 42px);
}

.hero-viver .main-nav a {
  color: #0b2e4d;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  white-space: nowrap;
}

.hero-viver .main-nav a:hover,
.hero-viver .main-nav a:focus-visible {
  color: #6c9a74;
}

.hero-viver .hero-contact-links a {
  color: #0b2e4d;
  background: transparent;
}

.hero-viver .hero-contact-links a:hover,
.hero-viver .hero-contact-links a:focus-visible {
  background: rgba(11, 46, 77, .08);
}

.hero-viver .hero-art {
  position: relative;
  inset: auto;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  height: auto;
}

.hero-viver .hero-art > img {
  object-position: center center;
}

.hero-viver .search-panel {
  top: 46%;
  right: 50%;
  bottom: auto;
  left: auto;
  width: min(540px, calc(100vw - 32px));
  transform: translate(50%, -50%);
}

@media (max-width: 900px) {
  .hero-viver .site-header {
    min-height: 76px;
    padding: 13px 18px;
  }

  .hero-viver .brand {
    width: 148px;
  }

  .hero-viver .main-nav {
    display: none;
  }

  .hero-viver .hero-menu-toggle {
    display: flex;
    color: #0b2e4d;
    border-color: rgba(11, 46, 77, .24);
    background: transparent;
  }

  .hero-viver .search-panel {
    top: 48%;
    right: 16px;
    left: 16px;
    width: auto;
    transform: translateY(-50%);
  }
}

@media (max-width: 640px) {
  .hero-viver {
    min-height: 560px;
  }

  .hero-viver .hero-art > img {
    object-position: 58% center;
  }

  .hero-viver .search-panel {
    top: 49%;
  }
}

/* Keep the first interaction quiet: search first, advanced filters second. */
.hero-viver {
  height: min(100svh, 900px);
  min-height: 680px;
}

.hero-viver .search-panel {
  grid-template-columns: minmax(0, 1fr) auto auto;
  width: min(690px, calc(100vw - 32px));
  padding: 8px 9px 8px 16px;
  gap: 5px;
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 5px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 18px 42px rgba(4, 18, 31, .2);
}

.hero-viver .search-tabs {
  display: none;
}

.hero-viver .location-field {
  grid-column: auto;
  min-height: 52px;
  padding: 0;
  border: 0;
  background: transparent;
}

.hero-viver .location-field input {
  color: #0b2e4d;
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
}

.hero-viver .location-field input::placeholder {
  color: rgba(11, 46, 77, .78);
  text-transform: none;
}

.hero-viver .search-submit,
.hero-viver .filters-toggle {
  min-width: 48px;
  min-height: 48px;
  margin: 0;
  padding: 0 12px;
  border: 0;
  border-radius: 3px;
  color: #0b2e4d;
  background: transparent;
}

.hero-viver .search-submit {
  display: grid;
  place-items: center;
}

.hero-viver .search-submit:hover,
.hero-viver .search-submit:focus-visible,
.hero-viver .filters-toggle:hover,
.hero-viver .filters-toggle:focus-visible {
  background: rgba(11, 46, 77, .08);
}

.hero-viver .filters-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-left: 1px solid rgba(11, 46, 77, .14);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.hero-viver .filters-popover {
  right: 0;
  bottom: calc(100% + 14px);
  width: min(620px, 92vw);
}

@media (max-width: 900px) {
  .hero-viver {
    min-height: 640px;
  }

  .hero-viver .search-panel {
    width: auto;
    padding-left: 14px;
  }
}

@media (max-width: 640px) {
  .hero-viver {
    height: min(100svh, 760px);
    min-height: 600px;
  }

  .hero-viver .search-panel {
    grid-template-columns: minmax(0, 1fr) auto auto;
    padding: 7px 7px 7px 13px;
  }

  .hero-viver .filters-toggle {
    width: 46px;
    padding: 0;
    justify-content: center;
    font-size: 0;
  }
}

/* Keep the contact header available while the visitor scrolls the landing page. */
.hero-viver .hero-scene {
  padding-top: 94px;
}

.hero-viver .site-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 50;
}

/* The advanced panel opens below the search instead of being clipped above it. */
.hero-viver .filters-popover {
  top: calc(100% + 14px);
  right: 0;
  bottom: auto;
  z-index: 60;
  max-height: min(620px, 70svh);
  overflow-y: auto;
}

@media (max-width: 900px) {
  .hero-viver .hero-scene {
    padding-top: 76px;
  }

  .hero-viver .hero-contact-links a:first-child {
    display: grid;
  }

  .hero-viver .hero-contact-links {
    gap: 2px;
  }
}

/* Persistent search: the filters are part of the first screen, not a hidden task. */
.hero-viver { height: min(100svh, 980px); min-height: 820px; }
.hero-viver .search-panel { top: 40%; width: min(980px, calc(100vw - 48px)); display: grid; grid-template-columns: minmax(0, 1fr) 52px; gap: 8px; padding: 10px; border-radius: 5px; }
.hero-viver .location-field { grid-column: 1; min-height: 54px; padding: 0 10px; }
.hero-viver .search-submit { grid-column: 2; min-height: 54px; }
.hero-viver .filters-inline { position: static; display: block; grid-column: 1 / -1; width: auto; max-height: none; padding: 16px 4px 2px; border: 0; border-top: 1px solid rgba(11,46,77,.12); border-radius: 0; background: transparent; box-shadow: none; overflow: visible; }
.hero-viver .filters-inline[hidden] { display: block; }
.hero-viver .filters-inline .filters-header { align-items: center; margin-bottom: 12px; }.hero-viver .filters-inline .filters-kicker { margin: 0; color: #60707a; font-size: 8px; }.hero-viver .filters-inline .filters-mode { display: none; }.hero-viver .hero-filter-actions { margin-left: auto; }.hero-viver .filters-clear { color: #0b2e4d; }
.hero-viver .active-summary { display: none; }.hero-viver .filter-sections { display: grid; grid-template-columns: 1.25fr 1.4fr 1fr; gap: 10px 18px; }.hero-viver .filter-section { min-width: 0; margin: 0; border: 0; background: transparent; }.hero-viver .filter-section:nth-child(2),.hero-viver .filter-section:nth-child(5) { display: none; }.hero-viver .filter-section:nth-child(3) { grid-column: span 2; }.hero-viver .filter-section:nth-child(4) { grid-row: span 2; }.hero-viver .filter-section summary { display: block; padding: 0 0 7px; color: #5d6e79; border: 0; font-size: 8px; letter-spacing: .13em; cursor: default; }.hero-viver .filter-section summary small { display: none; }.hero-viver .filter-section summary::-webkit-details-marker { display: none; }.hero-viver .filter-controls { gap: 6px; }.hero-viver .filter-choice { min-height: 32px; padding: 0 10px; border: 1px solid rgba(11,46,77,.18); border-radius: 999px; color: #294458; background: rgba(255,255,255,.56); font-size: 9px; letter-spacing: .07em; }.hero-viver .filter-choice:hover,.hero-viver .filter-choice:focus-visible,.hero-viver .filter-choice.is-selected { border-color: #0b2e4d; color: #fff; background: #0b2e4d; }.hero-viver .filter-fields-three { grid-template-columns: 1fr; gap: 5px; }.hero-viver .filter-fields label { display: none; }.hero-viver .hero-range-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }.hero-viver .hero-range { min-width: 0; }.hero-viver .hero-range-heading { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 11px; color: #60707a; font-size: 8px; font-weight: 700; letter-spacing: .12em; }.hero-viver .hero-range-heading output { color: #0b2e4d; font-weight: 600; letter-spacing: .04em; text-align: right; }.hero-viver .range-track { position: relative; height: 18px; }.hero-viver .range-track::before,.hero-viver .range-fill { position: absolute; top: 8px; right: 0; left: 0; height: 2px; border-radius: 4px; background: rgba(11,46,77,.16); content: ""; }.hero-viver .range-fill { right: calc(100% - var(--range-end)); left: var(--range-start); background: #0b2e4d; }.hero-viver .range-track input[type="range"] { position: absolute; inset: 0; width: 100%; margin: 0; appearance: none; pointer-events: none; background: transparent; }.hero-viver .range-track input[type="range"]::-webkit-slider-thumb { width: 13px; height: 13px; appearance: none; border: 2px solid #0b2e4d; border-radius: 50%; background: #fff; box-shadow: 0 1px 5px rgba(11,46,77,.2); pointer-events: auto; cursor: grab; }.hero-viver .range-track input[type="range"]::-moz-range-thumb { width: 10px; height: 10px; border: 2px solid #0b2e4d; border-radius: 50%; background: #fff; pointer-events: auto; cursor: grab; }.hero-viver .hero-range input[type="hidden"] { display:none; }.hero-viver .filters-apply { display:none; }
@media (max-width:900px){.hero-viver{height:auto;min-height:780px}.hero-viver .search-panel{top:49%;width:calc(100vw - 32px)}.hero-viver .filter-sections{grid-template-columns:1fr 1fr}.hero-viver .filter-section:nth-child(3),.hero-viver .filter-section:nth-child(4){grid-column:1 / -1;grid-row:auto}.hero-viver .filter-section:nth-child(2){display:none}.hero-viver .hero-range-grid{gap:12px}.hero-viver .filter-choice{min-height:30px;padding:0 8px;font-size:8px}}
@media (max-width:640px){.hero-viver{min-height:835px}.hero-viver .search-panel{top:48%;right:16px;left:16px;width:auto}.hero-viver .filters-inline{padding-top:12px}.hero-viver .filter-sections{gap:12px}.hero-viver .hero-range-grid{grid-template-columns:1fr}.hero-viver .filter-section:nth-child(4) .filter-controls{max-height:68px;overflow:hidden}.hero-viver .hero-range-heading{font-size:7px}}

@media (max-width: 640px) {
  .hero-viver .search-panel {
    right: 24px;
    left: 24px;
    width: auto;
  }

  .hero-viver .filters-popover {
    position: fixed;
    top: 88px;
    right: 16px;
    bottom: auto;
    left: 16px;
    width: auto;
    max-height: calc(100svh - 108px);
    padding: 16px;
  }
}

/* The header belongs to the image at the top, then becomes a white utility bar. */
.hero-viver .hero-scene {
  padding-top: 0;
}

.hero-viver .site-header {
  border-bottom-color: transparent;
  background: transparent;
  color: #fff;
  transition: background-color 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.hero-viver .brand-logo {
  filter: brightness(0) invert(1);
  transition: filter 220ms ease;
}

.hero-viver .main-nav a,
.hero-viver .hero-contact-links a {
  color: #fff;
}

.hero-viver .hero-menu-toggle {
  color: #fff;
  border-color: rgba(255, 255, 255, .6);
  background: rgba(4, 18, 31, .16);
}

.hero-viver .site-header.is-scrolled {
  border-bottom-color: rgba(11, 46, 77, .12);
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 8px 24px rgba(4, 18, 31, .08);
  color: #0b2e4d;
  backdrop-filter: blur(12px);
}

.hero-viver .site-header.is-scrolled .brand-logo {
  filter: none;
}

.hero-viver .site-header.is-scrolled .main-nav a,
.hero-viver .site-header.is-scrolled .hero-contact-links a {
  color: #0b2e4d;
}

.hero-viver .site-header.is-scrolled .hero-menu-toggle {
  color: #0b2e4d;
  border-color: rgba(11, 46, 77, .24);
  background: transparent;
}

@media (max-width: 900px) {
  .hero-viver .hero-scene {
    padding-top: 0;
  }
}

/* Refined persistent filters: compact, legible and built for repeated use. */
.hero-viver .search-panel {
  top: 35%;
  width: min(1060px, calc(100vw - 48px));
  padding: 12px;
  gap: 9px;
}

.hero-viver .filters-inline {
  order: 1;
  grid-row: 2;
  padding: 13px 4px 0;
}

.hero-viver .location-field,
.hero-viver .search-submit {
  grid-row: 1;
}

.hero-viver .filters-inline .filters-header {
  margin-bottom: 10px;
}

.hero-viver .filters-inline .filters-kicker {
  color: #294458;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .17em;
}

.hero-viver .filters-clear {
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(11, 46, 77, .24);
  border-radius: 0;
  background: transparent;
  color: #0b2e4d;
  font-family: var(--font-sans);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .14em;
  transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.hero-viver .filters-clear:hover,
.hero-viver .filters-clear:focus-visible {
  border-color: #0b2e4d;
  background: #0b2e4d;
  color: #fff;
}

.hero-viver .filters-clear:active,
.hero-viver .filter-choice:active {
  transform: scale(.97);
}

.hero-viver .filter-sections-refined {
  display: grid;
  grid-template-columns: 1.18fr 1.32fr 1fr;
  align-items: start;
  gap: 0;
}

.hero-viver .filter-sections-refined .filter-section {
  display: block;
  min-width: 0;
  padding: 0 20px;
  border: 0;
  border-left: 1px solid rgba(11, 46, 77, .13);
  background: transparent;
}

.hero-viver .filter-sections-refined .filter-section:first-child {
  padding-left: 0;
  border-left: 0;
}

.hero-viver .filter-sections-refined .filter-section:last-child {
  padding-right: 0;
}

.hero-viver .filter-title {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 21px;
  margin: 0 0 9px;
}

.hero-viver .filter-title h2 {
  margin: 0;
  color: #173b60;
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1;
  text-transform: none;
}

.hero-viver .filter-graphic {
  position: relative;
  width: 18px;
  height: 14px;
  border-top: 1px solid #88b982;
  border-bottom: 1px solid #88b982;
}

.hero-viver .filter-graphic::after {
  position: absolute;
  top: 5px;
  right: 0;
  left: 5px;
  height: 1px;
  background: #88b982;
  content: "";
}

.hero-viver .filter-type-controls {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 5px;
}

.hero-viver .filter-sections-refined .filter-choice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 39px;
  margin: 0;
  padding: 0 7px;
  border: 1px solid rgba(11, 46, 77, .2);
  border-radius: 0;
  background: rgba(255, 255, 255, .42);
  color: #294458;
  font-family: var(--font-sans);
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .025em;
  line-height: 1;
  text-transform: none;
  white-space: nowrap;
  transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.hero-viver .filter-sections-refined .filter-choice svg,
.hero-viver .environment-label svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.45;
}

.hero-viver .filter-sections-refined .filter-choice:hover,
.hero-viver .filter-sections-refined .filter-choice:focus-visible,
.hero-viver .filter-sections-refined .filter-choice.is-selected {
  border-color: #0b2e4d;
  background: #0b2e4d;
  color: #fff;
}

.hero-viver .environment-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.hero-viver .environment-control {
  min-width: 0;
}

.hero-viver .environment-label {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 20px;
  margin-bottom: 5px;
  color: #35546a;
  font-family: var(--font-sans);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1;
  text-transform: none;
}

.hero-viver .environment-label svg {
  width: 16px;
  height: 16px;
}

.hero-viver .filter-sections-refined .filter-numbers {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 3px;
}

.hero-viver .filter-sections-refined .filter-numbers .filter-choice {
  min-width: 0;
  min-height: 25px;
  padding: 0;
  font-size: 8px;
}

.hero-viver .filter-section-ranges .hero-range-grid {
  grid-template-columns: 1fr;
  gap: 9px;
}

.hero-viver .filter-section-ranges .hero-range-heading {
  margin-bottom: 6px;
  color: #35546a;
  font-family: var(--font-sans);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: none;
}

.hero-viver .filter-section-ranges .hero-range-heading output {
  color: #173b60;
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: none;
}

.hero-viver .filter-section-ranges .range-track {
  height: 14px;
}

.hero-viver .filter-section-ranges .range-track::before,
.hero-viver .filter-section-ranges .range-fill {
  top: 6px;
  height: 2px;
}

.hero-viver .filter-section-ranges .range-track input[type="range"]::-webkit-slider-thumb {
  width: 12px;
  height: 12px;
  border-width: 2px;
}

@media (max-width: 960px) {
  .hero-viver { min-height: 890px; }
  .hero-viver .search-panel { top: 30%; }
  .hero-viver .filter-sections-refined { grid-template-columns: 1fr 1fr; gap: 14px 0; }
  .hero-viver .filter-sections-refined .filter-section:nth-child(3) { grid-column: 1 / -1; padding-left: 0; border-left: 0; }
}

@media (max-width: 640px) {
  .hero-viver { min-height: 850px; }
  .hero-viver .search-panel { top: 138px; right: 16px; left: 16px; width: auto; padding: 10px; transform: none; }
  .hero-viver .filters-inline { position: static; inset: auto; max-height: none; padding-top: 11px; }
  .hero-viver .filter-sections-refined { display: block; }
  .hero-viver .filter-sections-refined .filter-section,
  .hero-viver .filter-sections-refined .filter-section:first-child,
  .hero-viver .filter-sections-refined .filter-section:last-child { padding: 0 0 12px; border: 0; border-bottom: 1px solid rgba(11, 46, 77, .12); }
  .hero-viver .filter-sections-refined .filter-section + .filter-section { padding-top: 11px; }
  .hero-viver .filter-sections-refined .filter-section:last-child { padding-bottom: 0; border-bottom: 0; }
  .hero-viver .filter-title { margin-bottom: 7px; }
  .hero-viver .filter-type-controls { display: flex; gap: 5px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
  .hero-viver .filter-type-controls::-webkit-scrollbar { display: none; }
  .hero-viver .filter-type-controls .filter-choice { min-width: max-content; padding: 0 9px; }
  .hero-viver .environment-grid { gap: 8px; }
  .hero-viver .environment-label { font-size: 7px; }
  .hero-viver .filter-section-ranges .hero-range-grid { grid-template-columns: 1fr 1fr; gap: 13px; }
}

/* Shared header scale: the hero keeps its transparent treatment, not a different geometry. */
.hero-viver .site-header {
  min-height: 76px;
  padding: 0 clamp(24px, 5vw, 76px);
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}

.hero-viver .brand { width: 154px; }
.hero-viver .main-nav { gap: clamp(20px, 2.8vw, 42px); }
.hero-viver .main-nav a { font-size: 10px; font-weight: 600; letter-spacing: .12em; }
.hero-viver .hero-contact-links a { width: 36px; height: 36px; }

@media (max-width: 820px) {
  .hero-viver .site-header { min-height: 68px; padding: 0 16px; }
  .hero-viver .brand { width: 132px; }
}

/* Use the available desktop width before adding more density. */
@media (min-width: 961px) {
  .hero-viver .filter-sections-refined {
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.3fr);
    gap: 14px 0;
  }

  .hero-viver .filter-sections-refined .filter-section:nth-child(1),
  .hero-viver .filter-sections-refined .filter-section:nth-child(2) {
    grid-column: auto;
    grid-row: auto;
  }

  .hero-viver .filter-sections-refined .filter-section:nth-child(3) {
    grid-column: 1 / -1;
    grid-row: auto;
    padding-left: 0;
    border-left: 0;
  }

  .hero-viver .filter-section-ranges .hero-range-grid {
    grid-template-columns: 1fr 1fr;
    gap: 42px;
  }
}

/* On mobile, the artwork remains a full-bleed backdrop for the entire filter composition. */
@media (max-width: 640px) {
  .hero-viver {
    height: max(850px, 100svh);
    background: #071a2b;
  }

  .hero-viver .hero-scene {
    position: absolute;
    inset: 0;
    display: block;
    min-height: 0;
    background: #071a2b;
  }

  .hero-viver .hero-art,
  .hero-viver .hero-art > img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
  }

  .hero-viver .hero-art > img {
    object-fit: cover;
    object-position: center;
  }

  .hero-viver .search-panel {
    box-shadow: 0 20px 45px rgba(2, 14, 25, .28);
  }
}

/* Compact search first; advanced controls unfold from an explicit action. */
.hero-viver .search-panel {
  top: 45%;
  right: auto;
  left: 50%;
  grid-template-columns: minmax(0, 1fr) 52px;
  align-items: stretch;
  width: min(760px, calc(100vw - 48px));
  padding: 10px;
  gap: 0 8px;
  overflow: visible;
  transform: translate(-50%, -20%);
}

.hero-viver .location-field,
.hero-viver .search-submit { grid-row: 1; }

.hero-viver .filters-disclosure {
  grid-column: 1 / -1;
  grid-row: 2;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 42px;
  margin: 5px 0 0;
  padding: 0 4px;
  border: 0;
  border-top: 1px solid rgba(11, 46, 77, .13);
  background: transparent;
  color: #173b60;
  cursor: pointer;
  font-family: var(--font-sans);
  text-align: left;
  transition: color 160ms ease, background-color 160ms ease;
}

.hero-viver .filters-disclosure-icon {
  margin-right: 9px;
  flex: 0 0 auto;
}

.hero-viver .filters-disclosure-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.hero-viver .filters-disclosure-count {
  margin-left: 10px;
  padding: 5px 7px;
  border-radius: 999px;
  background: rgba(11, 46, 77, .08);
  color: #526979;
  font-size: 9px;
  font-weight: 650;
  letter-spacing: .04em;
}

.hero-viver .filters-disclosure-chevron {
  margin-left: auto;
  transition: transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

.hero-viver .filters-disclosure[aria-expanded="true"] .filters-disclosure-chevron {
  transform: rotate(180deg);
}

@media (hover: hover) and (pointer: fine) {
  .hero-viver .filters-disclosure:hover { background: rgba(11, 46, 77, .045); }
}

.hero-viver .filters-disclosure:focus-visible {
  outline: 2px solid rgba(11, 46, 77, .38);
  outline-offset: 2px;
}

.hero-viver .filters-inline,
.hero-viver .filters-inline[hidden] {
  position: static;
  grid-column: 1 / -1;
  grid-row: 3;
  display: block;
  width: auto;
  height: 0;
  max-height: none;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: 0;
  pointer-events: none;
  transition:
    height 200ms cubic-bezier(0.23, 1, 0.32, 1),
    opacity 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

.hero-viver .filters-inline[data-expanded="true"] {
  opacity: 1;
  pointer-events: auto;
}

.hero-viver .filters-expand-content {
  padding: 13px 4px 3px;
  border-top: 1px solid rgba(11, 46, 77, .13);
}

@media (max-width: 640px) {
  .hero-viver { min-height: 760px; }

  .hero-viver .search-panel {
    top: 132px;
    right: 20px;
    left: 20px;
    width: auto;
    transform: none;
  }

  .hero-viver .filters-disclosure {
    min-height: 40px;
    margin-top: 4px;
  }

  .hero-viver .filters-disclosure-label { font-size: 9px; }
  .hero-viver .filters-expand-content { padding-top: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-viver .filters-inline,
  .hero-viver .filters-disclosure-chevron { transition-duration: 1ms; }
}

/* Desktop composition: functional search left, editorial service signature right. */
.hero-viver .hero-curation-mark {
  position: absolute;
  z-index: 3;
  top: 68%;
  right: clamp(40px, 6vw, 112px);
  bottom: auto;
  color: #fff;
  text-align: right;
  text-shadow: 0 2px 20px rgba(2, 14, 25, .4);
  pointer-events: none;
}

.hero-viver .hero-curation-mark strong {
  display: block;
  font-family: var(--font-sans);
  font-size: clamp(40px, 3.5vw, 58px);
  font-weight: 300;
  line-height: .95;
  letter-spacing: .16em;
}

.hero-viver .hero-curation-mark strong span {
  margin-left: .04em;
  color: #a8d09c;
}

.hero-viver .hero-curation-mark p {
  margin: 10px .16em 0 0;
  color: rgba(255, 255, 255, .9);
  font-size: 12px;
  font-weight: 350;
  line-height: 1.55;
  letter-spacing: .1em;
}

/* Generous shared header, preserving the hero's transparent treatment. */
.hero-viver .site-header {
  min-height: 84px;
  padding: 0 clamp(24px, 5vw, 76px);
}

.hero-viver .brand { width: 158px; }
.hero-viver .main-nav a { font-size: 10px; letter-spacing: .12em; }
.hero-viver .hero-contact-links a { width: 38px; height: 38px; }

@media (min-width: 961px) {
  .hero-viver .search-panel {
    left: clamp(430px, 40vw, 760px);
  }
}

@media (max-width: 820px) {
  .hero-viver .site-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-rows: 78px;
    min-height: 78px;
    padding: 0 18px;
    column-gap: 4px;
    align-items: center;
  }

  .hero-viver .brand {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    align-self: center;
    width: 128px;
  }

  .hero-viver .hero-contact-links {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    align-items: center;
    align-self: center;
    justify-self: end;
    gap: 0;
  }

  .hero-viver .hero-contact-links a,
  .hero-viver .hero-contact-links a:first-child {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
  }

  .hero-viver .hero-menu-toggle {
    position: static;
    grid-column: 3;
    grid-row: 1;
    align-self: center;
    justify-self: end;
    width: 40px;
    height: 40px;
  }
}

@media (max-width: 640px) {
  .hero-viver .hero-curation-mark {
    top: auto;
    right: 20px;
    bottom: 32px;
  }

  .hero-viver .hero-curation-mark strong { font-size: 32px; }
  .hero-viver .hero-curation-mark p { margin-top: 8px; font-size: 9.5px; line-height: 1.5; }

  .hero-viver .search-panel { top: 178px; }
}

/* Mobile navigation opens as a full-screen layer so it never competes with the hero. */
@media (max-width: 820px) {
  body.mobile-navigation-open { overflow: hidden; }
  body.mobile-navigation-open .hero-viver .site-header,
  body.mobile-navigation-open .hero-viver .site-header:has(.main-nav.is-open) { z-index: 1002; }

  .hero-viver .main-nav.is-open {
    position: fixed;
    z-index: 1000;
    inset: 0;
    display: flex;
    width: 100%;
    max-width: none;
    justify-self: stretch;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 0;
    min-height: 100dvh;
    padding: 110px 28px 44px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(5, 23, 40, .18);
  }

  .hero-viver .main-nav.is-open a {
    display: flex;
    min-height: 62px;
    align-items: center;
    padding: 0 4px;
    border-bottom: 1px solid rgba(11, 46, 77, .14);
    color: #0b2e4d;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: .08em;
  }

  .hero-viver .main-nav.is-open a:first-child::after { display: none; }
  .hero-viver .hero-menu-toggle { z-index: 1001; }
}