/* How It Works disclosure: open and close mechanics only. The panel layout lives in public-nav-panels.css. */
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 300 800; font-display: swap; src: url("/webfonts/owners-properties/open-sans-latin-variable.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 600; font-display: swap; src: url("/webfonts/owners-properties/poppins-latin-600.woff2") format("woff2"); }
#site-nav .how-nav-wrap { position: static; cursor: default; }
#site-nav .how-nav-panel {
  opacity: 0; visibility: hidden; pointer-events: none; z-index: 112;
  /* Keep the menu opaque while moving so listing text cannot show through. */
  transition: transform .18s ease;
}
#site-nav .how-nav-wrap:not([data-how-nav-ready]):is(:hover,:focus-within) .how-nav-panel,
#site-nav .how-nav-wrap.is-how-open .how-nav-panel { opacity: 1; visibility: visible; pointer-events: auto; }
#site-nav .how-nav-wrap:is(:hover,:focus-within,.is-how-open)::after {
  content: ""; position: absolute; top: 100%; left: 50%; width: min(1180px, calc(100vw - 48px));
  height: 9px; transform: translateX(-50%); z-index: 113;
}
#site-nav .how-nav-wrap.is-how-open .nav-chev { transform: rotate(180deg); }
#site-nav .how-nav-wrap.is-how-open .nav-top::after { transform: scaleX(1); opacity: 1; }
#site-nav .how-nav-mobile { font-family: "Open Sans", Arial, sans-serif; color: var(--text); color-scheme: light; }
#site-nav .how-nav-mobile > summary { list-style: none; cursor: pointer; }
#site-nav .how-nav-mobile > summary::-webkit-details-marker { display: none; }
#site-nav .how-nav-mobile[open] > summary .sl-v2-row-chev { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { #site-nav .how-nav-panel { transition: none; } }