/* =================================================
   Houses For Sale — Custom Homepage Stylesheet
   All selectors prefixed with .hfs- to avoid clashing
   with the parent MyHome theme.
   ================================================= */

/* Hide MyHome's default header/nav on our custom homepage template.
   Uses hfs-homepage body class (added via body_class filter in functions.php)
   so it works regardless of how WordPress names template classes. */
body.hfs-homepage > header,
body.hfs-homepage .header-container,
body.hfs-homepage .header_top,
body.hfs-homepage .header_top_panel,
body.hfs-homepage .header-area,
body.hfs-homepage .site-header,
body.hfs-homepage #masthead,
body.hfs-homepage #header,
body.hfs-homepage .top-header,
body.hfs-homepage .mh-header,
body.hfs-homepage .top-line,
body.hfs-homepage .header-top-bar,
body.hfs-homepage .navbar-header,
body.hfs-homepage .main-navigation,
body.hfs-homepage .header_logo,
body.hfs-homepage #wrap > header,
body.hfs-homepage #page > header,
body.hfs-homepage .estate-header,
body.hfs-homepage .fave-header,
body.hfs-homepage .mh_header_wrap,
body.hfs-homepage .header_main,
body.hfs-homepage .top_panel,
body.hfs-homepage .top_panel_wrap,
body.hfs-homepage .menu_main_wrap,
body.hfs-homepage .breadcrumbs,
body.hfs-homepage .page-header,
body.hfs-homepage .entry-header {
  display: none !important;
  height: 0 !important;
  visibility: hidden !important;
}

/* Zero out all wrappers so the hero sits at the very top */
body.hfs-homepage,
body.hfs-homepage html,
body.hfs-homepage #main,
body.hfs-homepage #content,
body.hfs-homepage #wrap,
body.hfs-homepage #page,
body.hfs-homepage .site-content,
body.hfs-homepage .page-content,
body.hfs-homepage main,
body.hfs-homepage .container,
body.hfs-homepage .wrapper,
body.hfs-homepage article,
body.hfs-homepage .entry-content {
  padding-top: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Make hfs-app fill the page from the very top */
body.hfs-homepage #hfs-app {
  position: relative;
  z-index: 1;
}

:root {
  --hfs-bg:       #ffffff;
  --hfs-paper:    #ffffff;
  --hfs-paper-2:  #f5f4ef;
  --hfs-ink:      #171717;
  --hfs-ink-2:    #333333;
  --hfs-muted:    #737373;
  --hfs-line:     #e5e3dd;
  --hfs-line-2:   #cccccc;
  --hfs-accent:   #2563eb;
  --hfs-accent-2: #1d4ed8;
  --hfs-light:    #ffffff;
  --hfs-font-display: 'Frank Ruhl Libre', Georgia, serif;
  --hfs-font-body:    'Rubik', system-ui, -apple-system, sans-serif;
}

/* Scoped reset — only inside #hfs-app */
#hfs-app, #hfs-app * { box-sizing: border-box; }
#hfs-app { font-family: var(--hfs-font-body); line-height: 1.55; color: var(--hfs-ink); direction: rtl; background: var(--hfs-bg); overflow-x: hidden; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
#hfs-app img { display: block; max-width: 100%; }
#hfs-app button { font-family: inherit; }
#hfs-app a { color: inherit; text-decoration: none; }
#hfs-app h1, #hfs-app h2, #hfs-app h3, #hfs-app h4 { margin: 0; line-height: 1.15; }

.hfs-display { font-family: var(--hfs-font-display); font-weight: 500; line-height: 1.1; }
.hfs-italic { font-style: italic; font-weight: 400; opacity: 0.78; }
.hfs-num { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum'; }
.hfs-eyebrow { font-size: 12px; letter-spacing: 0.14em; font-weight: 500; text-transform: uppercase; color: var(--hfs-muted); font-family: var(--hfs-font-body); }
.hfs-hairline { display: inline-block; width: 32px; height: 1px; background: currentColor; opacity: 0.5; }

/* Reveal on scroll */
.hfs-reveal { opacity: 0; transform: translateY(12px); transition: opacity 0.9s cubic-bezier(.2,.7,.2,1), transform 0.9s cubic-bezier(.2,.7,.2,1); }
.hfs-reveal.in { opacity: 1; transform: none; }

/* ========== BUTTONS ========== */
.hfs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--hfs-font-body); font-size: 13px; line-height: 22px;
  text-transform: uppercase; letter-spacing: 0;
  padding: 14px 28px; border: 1px solid; cursor: pointer;
  font-weight: 500; border-radius: 0;
  transition: background-color .3s, color .3s, border-color .3s, transform .2s;
  text-decoration: none;
}
.hfs-btn:hover { transform: translateY(-1px); }
.hfs-btn-primary { background: var(--hfs-accent); color: #fff; border-color: var(--hfs-accent); }
.hfs-btn-primary:hover { background: transparent; color: var(--hfs-accent); border-color: var(--hfs-accent); }
.hfs-btn-light { background: var(--hfs-light); color: var(--hfs-ink); border-color: var(--hfs-light); }
.hfs-btn-light:hover { background: transparent; color: var(--hfs-light); border-color: var(--hfs-light); }
.hfs-btn-wa {
  background: #25D366;
  color: #fff;
  border-color: #25D366;
  box-shadow: 0 4px 14px rgba(37, 211, 102, .35);
}
.hfs-btn-wa:hover {
  background: #1FAA52;
  border-color: #1FAA52;
  color: #fff;
}

/* Phone CTA — distinct from the other two buttons, elegant + attention-getting */
.hfs-phone-cta {
  background: rgba(255,255,255,0.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.35);
  backdrop-filter: blur(8px);
  padding: 10px 22px 10px 18px;
  gap: 14px;
  text-transform: none;
  letter-spacing: 0;
}
.hfs-phone-cta:hover {
  background: var(--hfs-accent);
  color: #fff;
  border-color: var(--hfs-accent);
}
.hfs-phone-ring {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--hfs-accent);
  color: #fff;
  flex-shrink: 0;
  animation: hfs-phone-ring 2.6s ease-in-out infinite;
}
.hfs-phone-cta:hover .hfs-phone-ring {
  background: #fff;
  color: var(--hfs-accent);
}
.hfs-phone-cta:hover .hfs-phone-lead,
.hfs-phone-cta:hover .hfs-phone-num {
  color: #fff !important;
}
.hfs-phone-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.1;
  text-align: right;
}
.hfs-phone-lead {
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0.7;
  font-weight: 400;
  margin-bottom: 2px;
}
.hfs-phone-num {
  font-family: var(--hfs-font-display);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.5px;
  direction: ltr;
}
@keyframes hfs-phone-ring {
  0%, 100% { transform: rotate(0); }
  4%, 12%  { transform: rotate(14deg); }
  8%, 16%  { transform: rotate(-14deg); }
  20%      { transform: rotate(0); }
}
@media (max-width: 600px) {
  .hfs-phone-cta {
    width: 100%;
    justify-content: center;
  }
  .hfs-phone-num { font-size: 18px; }
}
.hfs-btn-ghost { background: transparent; color: var(--hfs-ink); border-color: var(--hfs-line-2); }
.hfs-btn-ghost:hover { background: var(--hfs-ink); color: #fff; border-color: var(--hfs-ink); }
.hfs-btn-cta {
  background: var(--hfs-accent);
  color: #fff !important;
  border-color: var(--hfs-accent);
  padding: 11px 26px;
  font-size: 14px;
  box-shadow: 0 4px 14px rgba(37, 99, 235, .35);
}
.hfs-btn-cta:hover {
  background: var(--hfs-accent-2);
  border-color: var(--hfs-accent-2);
  color: #fff !important;
}

/* ========== NAV ========== */
.hfs-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  padding: 22px 32px;
  color: #fff;
  transition: background .3s, color .3s, border-color .3s, box-shadow .3s, padding .3s;
}
/* Subtle dark gradient at the top so the nav stays readable over light videos */
.hfs-nav::before {
  content: "";
  position: absolute;
  inset: 0 0 -40px 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.25) 60%, rgba(0,0,0,0) 100%);
  z-index: -1;
  pointer-events: none;
  transition: opacity .3s;
}
.hfs-nav.scrolled::before { opacity: 0; }
.hfs-nav.scrolled {
  background: rgba(250, 250, 248, 0.92);
  backdrop-filter: saturate(1.2) blur(16px);
  color: var(--hfs-ink);
  border-bottom: 1px solid var(--hfs-line);
  padding: 14px 32px;
}
.hfs-nav.scrolled .hfs-btn-cta { background: var(--hfs-accent); color: #fff; border-color: var(--hfs-accent); }
.hfs-nav-inner { max-width: 1440px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }

/* Menu list — handle BOTH our own LIs and WordPress wp_nav_menu output (.menu-item) */
.hfs-nav-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 28px;
  align-items: center;
  flex-wrap: wrap;
}
.hfs-nav-links li,
.hfs-nav-links .menu-item {
  list-style: none;
  padding: 0;
  margin: 0;
  display: inline-flex;
  align-items: center;
}
.hfs-nav-links a,
.hfs-navlink {
  color: inherit;
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
  position: relative;
  padding: 2px 0;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5);
  transition: color .3s;
}
.hfs-nav.scrolled .hfs-nav-links a,
.hfs-nav.scrolled .hfs-navlink {
  text-shadow: none;
}
.hfs-nav-links a::after,
.hfs-navlink::after {
  content: "";
  position: absolute;
  right: 0; bottom: -4px;
  height: 1px; width: 0;
  background: var(--hfs-accent);
  transition: width .3s;
}
.hfs-nav-links a:hover,
.hfs-navlink:hover { color: var(--hfs-accent); }
.hfs-nav-links a:hover::after,
.hfs-navlink:hover::after { width: 100%; }

/* Dropdown submenu — appears on hover under "כל הנכסים" */
.hfs-has-children { position: relative; }
.hfs-chev {
  font-size: 10px;
  margin-inline-start: 4px;
  display: inline-block;
  transition: transform .3s;
}
.hfs-has-children:hover .hfs-chev,
.hfs-has-children:focus-within .hfs-chev {
  transform: rotate(180deg);
}
.hfs-submenu {
  list-style: none;
  padding: 8px 0;
  margin: 0;
  position: absolute;
  top: calc(100% + 8px);
  right: -16px;
  min-width: 180px;
  background: rgba(20, 20, 20, 0.96);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  box-shadow: 0 20px 60px -10px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
  z-index: 100;
}
.hfs-has-children:hover .hfs-submenu,
.hfs-has-children:focus-within .hfs-submenu {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
.hfs-submenu li {
  display: block;
  padding: 0;
}
.hfs-submenu a {
  display: block;
  padding: 10px 18px;
  color: #fff !important;
  font-size: 14px;
  font-weight: 400;
  text-shadow: none;
  transition: background .2s, color .2s;
  white-space: nowrap;
}
.hfs-submenu a::after { display: none !important; }
.hfs-submenu a:hover {
  background: var(--hfs-accent);
  color: #fff !important;
}
/* When the main nav is in scrolled (white) state, the dropdown stays dark — keeps a nice contrast */
.hfs-nav.scrolled .hfs-submenu a { color: #fff !important; }

/* Hero logo — centered above the EST line, over the video */
.hfs-hero-logo {
  display: flex;
  justify-content: center;
  margin-bottom: 32px;
}
.hfs-hero-logo img {
  height: 110px;
  width: auto;
  max-width: 90%;
  filter: drop-shadow(0 4px 24px rgba(0, 0, 0, 0.5));
  transition: height .3s;
}
@media (max-width: 768px) {
  .hfs-hero-logo img { height: 80px; }
  .hfs-hero-logo { margin-bottom: 24px; }
}
.hfs-nav-right { display: flex; align-items: center; gap: 14px; }
.hfs-phone { font-size: 15px; font-weight: 500; text-shadow: 0 1px 4px rgba(0,0,0,0.5); }

/* ========== HAMBURGER BUTTON (mobile only) ========== */
.hfs-burger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  flex-direction: column;
  gap: 5px;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: inherit;
  position: relative;
  z-index: 210;
}
.hfs-burger span {
  display: block;
  width: 24px;
  height: 2px;
  background: currentColor;
  transition: transform .3s, opacity .3s, background .3s;
  box-shadow: 0 1px 4px rgba(0,0,0,0.4);
}
.hfs-burger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hfs-burger.active span:nth-child(2) { opacity: 0; }
.hfs-burger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ========== MOBILE MENU OVERLAY ========== */
.hfs-mobile-menu {
  position: fixed;
  inset: 0;
  background: rgba(15, 15, 15, 0.98);
  backdrop-filter: blur(20px);
  z-index: 200;
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s ease;
  overflow-y: auto;
}
.hfs-mobile-menu.open {
  opacity: 1;
  pointer-events: auto;
}
.hfs-mobile-menu-inner {
  padding: 100px 28px 40px;
  max-width: 500px;
  margin: 0 auto;
  color: #fff;
}
.hfs-mobile-menu-links {
  list-style: none;
  padding: 0;
  margin: 0 0 32px;
}
.hfs-mobile-menu-links > li {
  padding: 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.hfs-mobile-menu-links > li > a,
.hfs-mobile-menu-links .hfs-navlink {
  display: block;
  color: #fff !important;
  font-size: 19px;
  font-weight: 500;
  padding: 18px 4px;
  text-shadow: none;
}
.hfs-mobile-menu-links > li > a::after { display: none !important; }
.hfs-mobile-menu-links .hfs-chev {
  font-size: 14px;
  opacity: 0.6;
}
/* In mobile menu, the submenu is always visible (no hover) */
.hfs-mobile-menu-links .hfs-submenu {
  position: static;
  display: block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none !important;
  background: transparent;
  backdrop-filter: none;
  border: none;
  box-shadow: none;
  padding: 0 0 12px;
  margin: 0;
}
.hfs-mobile-menu-links .hfs-submenu li {
  padding-inline-start: 18px;
}
.hfs-mobile-menu-links .hfs-submenu a {
  font-size: 16px !important;
  font-weight: 400 !important;
  padding: 10px 12px !important;
  color: rgba(255,255,255,0.75) !important;
  border-radius: 4px;
}
.hfs-mobile-menu-links .hfs-submenu a:hover {
  background: var(--hfs-accent) !important;
  color: #fff !important;
}
.hfs-mobile-menu-footer {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Show hamburger / hide desktop menu on smaller screens */
@media (max-width: 900px) {
  .hfs-burger { display: flex; }
  .hfs-nav-links { display: none !important; }
  .hfs-nav-right .hfs-hide-mobile { display: none !important; }
  .hfs-nav { padding: 16px 20px; }
  .hfs-hero-logo img { height: 72px; }
}

/* ========== HERO ========== */
.hfs-hero {
  position: relative; min-height: 100vh; color: #fff; overflow: hidden;
  display: flex; flex-direction: column;
}
.hfs-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.9); }
.hfs-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(14,14,12,.30) 0%, rgba(14,14,12,.40) 40%, rgba(14,14,12,.65) 100%);
}
.hfs-hero-inner {
  position: relative; z-index: 2; max-width: 1440px; margin: 0 auto;
  padding: 180px 32px 60px; display: flex; flex-direction: column; min-height: 100vh; width: 100%;
}
.hfs-eyebrow-line {
  display: flex; align-items: center; gap: 12px; font-size: 11px;
  letter-spacing: .22em; font-weight: 500; text-transform: uppercase; opacity: .9; margin-bottom: 28px;
}
.hfs-eyebrow-line .hfs-hairline { background: #fff; opacity: 1; }
.hfs-dot { opacity: .5; }
.hfs-hero-title {
  font-family: var(--hfs-font-display); font-size: clamp(52px, 10vw, 140px);
  font-weight: 500; max-width: 14ch; margin: 0;
}
.hfs-hero-desc { font-size: 17px; line-height: 1.6; opacity: .92; max-width: 460px; margin: 48px 0 0; font-weight: 400; }
.hfs-hero-actions { display: flex; gap: 10px; margin-top: 40px; flex-wrap: wrap; }
.hfs-hero-stats {
  margin-top: auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px;
  padding-top: 56px; border-top: 1px solid rgba(255,255,255,.18);
}
.hfs-stat-n { font-size: clamp(28px, 3.4vw, 44px); font-weight: 500; }
.hfs-stat-l { font-size: 12px; margin-top: 6px; opacity: .7; letter-spacing: .04em; }

/* ========== MARQUEE (SOLD TICKER) ========== */
@keyframes hfs-marquee { from { transform: translateX(0); } to { transform: translateX(50%); } }
.hfs-marquee { background: var(--hfs-ink); color: #fff; overflow: hidden; }
.hfs-marquee-row { display: flex; align-items: stretch; }
.hfs-marquee-label {
  padding: 14px 20px; border-left: 1px solid rgba(255,255,255,.12);
  display: flex; align-items: center; gap: 10px; flex-shrink: 0;
  font-size: 11px; letter-spacing: .22em; font-weight: 500; text-transform: uppercase;
}
.hfs-pulse-dot { width: 5px; height: 5px; border-radius: 50%; background: #4BD48B; display: inline-block; }
.hfs-marquee-track-wrap { overflow: hidden; flex: 1; }
.hfs-marquee-track { display: flex; width: max-content; animation: hfs-marquee 80s linear infinite; }
.hfs-marquee-track:hover { animation-play-state: paused; }
.hfs-marquee-item {
  padding: 14px 22px; border-left: 1px solid rgba(255,255,255,.12);
  display: flex; align-items: center; gap: 14px; white-space: nowrap;
}
.hfs-marquee-time { opacity: .5; font-size: 11px; letter-spacing: .04em; }
.hfs-marquee-meta { font-size: 13px; opacity: .9; }
.hfs-marquee-price { font-size: 14px; font-weight: 500; }

/* ========== SEARCH BAR ========== */
.hfs-search-wrap {
  position: relative; z-index: 3; max-width: 1200px; margin: -36px auto 0; padding: 0 32px;
}
.hfs-search-grid {
  background: #fff; border: 1px solid var(--hfs-line); padding: 10px;
  display: grid; grid-template-columns: 1fr 1fr 1fr 1fr auto; gap: 0; align-items: stretch;
}
.hfs-search-field {
  padding: 10px 18px; border-left: 1px solid var(--hfs-line); display: flex;
  flex-direction: column; gap: 2px; cursor: pointer;
}
.hfs-search-field:last-of-type { border-left: none; }
.hfs-search-field select {
  background: transparent; border: none; font-family: inherit; font-size: 15px;
  font-weight: 500; color: var(--hfs-ink); outline: none; padding: 0; padding-left: 24px;
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' stroke='%23171717' stroke-width='1.2' fill='none'/></svg>");
  background-repeat: no-repeat; background-position: left 4px center;
}
.hfs-search-btn { padding: 0 32px; }

/* ========== SECTIONS ========== */
.hfs-section { padding: 140px 32px 100px; max-width: 1440px; margin: 0 auto; }
.hfs-section-dark { background: var(--hfs-ink); color: #fff; padding: 120px 32px; }
.hfs-section-tinted { background: var(--hfs-paper-2); padding: 140px 32px; }
.hfs-border-top { border-top: 1px solid var(--hfs-line); }

.hfs-section-header {
  display: grid; grid-template-columns: auto 1fr auto; gap: 40px; align-items: flex-end;
  padding-bottom: 40px; border-bottom: 1px solid var(--hfs-line); flex-wrap: wrap;
  max-width: 1440px; margin: 0 auto;
}
.hfs-section-header-dark { border-bottom-color: rgba(255,255,255,.18); }
.hfs-section-num { font-size: 14px; font-weight: 500; color: var(--hfs-muted); padding-bottom: 8px; }
.hfs-section-header-dark .hfs-section-num { color: rgba(255,255,255,.5); }
.hfs-section-title { font-size: clamp(36px, 5vw, 64px); margin: 14px 0 0; font-weight: 500; max-width: 720px; }
.hfs-section-sub { font-size: 16px; color: var(--hfs-muted); margin-top: 18px; max-width: 620px; line-height: 1.6; }
.hfs-section-header-dark .hfs-section-sub,
.hfs-section-header-dark .hfs-eyebrow { color: rgba(255,255,255,.7); }

/* ========== CHIPS / FILTER ========== */
.hfs-chips { display: flex; gap: 6px; padding: 28px 0 32px; flex-wrap: wrap; align-items: center; }
.hfs-chip {
  font-size: 13px; font-weight: 400; padding: 8px 16px; border-radius: 999px;
  cursor: pointer; display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid var(--hfs-line-2); background: transparent; color: var(--hfs-ink);
  transition: all .2s;
}
.hfs-chip.active { background: var(--hfs-ink); color: #fff; border-color: var(--hfs-ink); }
.hfs-chip-count { font-size: 11px; opacity: .55; }

/* ========== PROPERTIES ========== */
.hfs-prop-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 4px; }
.hfs-prop-card { background: #fff; display: block; position: relative; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.hfs-prop-card:hover { transform: translateY(-3px); }
.hfs-prop-img { position: relative; aspect-ratio: 4/3; overflow: hidden; background: var(--hfs-paper-2); }
.hfs-prop-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); transform: scale(1.01); }
.hfs-prop-card:hover .hfs-prop-img img { transform: scale(1.06); }
.hfs-prop-badges { position: absolute; top: 16px; right: 16px; display: flex; gap: 6px; }
.hfs-badge {
  padding: 5px 10px; font-size: 10px; font-weight: 600; letter-spacing: .12em;
  text-transform: uppercase; border-radius: 3px;
}
.hfs-badge-status { background: rgba(255,255,255,.95); color: var(--hfs-ink); }
.hfs-prop-hover {
  position: absolute; bottom: 0; left: 0; right: 0; padding: 30px 20px 16px;
  background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.6));
  color: #fff; display: flex; justify-content: space-between; align-items: flex-end;
  opacity: 0; transition: opacity .3s; font-size: 12px; font-weight: 500;
}
.hfs-prop-card:hover .hfs-prop-hover { opacity: 1; }
.hfs-prop-body { padding: 20px 4px 8px; }
.hfs-prop-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-top: 8px; }
.hfs-prop-title { font-size: 20px; font-weight: 500; line-height: 1.2; }
.hfs-prop-price { font-size: 18px; font-weight: 500; color: var(--hfs-accent); flex-shrink: 0; }
.hfs-prop-meta {
  display: flex; gap: 18px; margin-top: 14px; padding-top: 12px;
  border-top: 1px solid var(--hfs-line); font-size: 12px; color: var(--hfs-muted);
}

/* Hidden state for filter */
.hfs-prop-card.hidden { display: none; }

/* ========== STATS BIG (DARK) ========== */
.hfs-stats-grid { max-width: 1440px; margin: 60px auto 0; display: grid; grid-template-columns: repeat(4, 1fr); }
.hfs-stats-grid > div { padding: 40px 28px 0 0; border-inline-end: 1px solid rgba(255,255,255,.15); display: flex; flex-direction: column; align-items: flex-start; }
.hfs-stats-grid > div:last-child { border-inline-end: none; }
.hfs-stat-big { font-size: clamp(56px, 7vw, 110px); font-weight: 200; line-height: 1; }
.hfs-stat-big span { font-weight: 200; }
.hfs-stat-label { margin-top: 14px; font-size: 13px; opacity: .65; letter-spacing: .04em; }

/* ========== ABOUT ========== */
.hfs-about-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: start; max-width: 1440px; margin: 0 auto; }
.hfs-about-img { aspect-ratio: 4/5; overflow: hidden; background: var(--hfs-paper-2); }
.hfs-about-img img { width: 100%; height: 100%; object-fit: cover; }
.hfs-about-credit { margin-top: 18px; font-size: 12px; color: var(--hfs-muted); letter-spacing: .04em; }
.hfs-about-title { font-size: clamp(40px, 5.5vw, 72px); margin: 14px 0 32px; font-weight: 500; }
.hfs-about-lead { font-size: 18px; line-height: 1.65; color: var(--hfs-ink-2); }
.hfs-about-body { font-size: 15px; line-height: 1.7; color: var(--hfs-muted); margin-top: 20px; }
.hfs-about-stats { display: grid; grid-template-columns: 1fr 1fr; margin-top: 40px; border-top: 1px solid var(--hfs-line); }
.hfs-about-stats > div { padding: 22px 0; border-bottom: 1px solid var(--hfs-line); }
.hfs-about-stats > div:nth-last-child(-n+2) { border-bottom: none; }
.hfs-about-stats > div:nth-child(odd) { border-inline-end: 1px solid var(--hfs-line); padding-inline-end: 24px; }
.hfs-about-stats > div:nth-child(even) { padding-inline-start: 24px; }
.hfs-about-stats > div > div:first-child { font-size: 24px; font-weight: 400; }
.hfs-about-stats > div > div:last-child { font-size: 13px; color: var(--hfs-muted); margin-top: 4px; }
.hfs-about-cta { display: flex; gap: 10px; margin-top: 36px; flex-wrap: wrap; }

/* ========== NEIGHBORHOODS MAP ========== */
.hfs-map-grid { display: grid; grid-template-columns: 1.5fr .9fr; gap: 48px; margin-top: 60px; align-items: stretch; max-width: 1440px; margin-inline: auto; }
.hfs-map-canvas { position: relative; aspect-ratio: 4/3; background: #fff; border: 1px solid var(--hfs-line); }
.hfs-map-svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.hfs-hot { position: absolute; transform: translate(-50%, -50%); background: none; border: none; padding: 0; cursor: pointer; }
.hfs-hot-dot {
  display: block; width: 9px; height: 9px; border-radius: 50%; background: var(--hfs-ink);
  transition: all .3s;
}
.hfs-hot.active .hfs-hot-dot {
  width: 14px; height: 14px; background: var(--hfs-accent);
  box-shadow: 0 0 0 5px rgba(37, 99, 235, .25);
}
.hfs-hot-label {
  position: absolute; top: calc(100% + 8px); inset-inline-start: 50%; transform: translateX(50%);
  white-space: nowrap; font-size: 11px; font-weight: 600; color: var(--hfs-ink);
  opacity: .5; transition: opacity .2s; pointer-events: none;
}
.hfs-hot.active .hfs-hot-label { opacity: 1; }

.hfs-map-side { display: flex; flex-direction: column; gap: 18px; }
.hfs-map-card { background: #fff; border: 1px solid var(--hfs-line); padding: 32px 30px 28px; flex: 1; position: relative; min-height: 320px; }
.hfs-map-panel { display: none; }
.hfs-map-panel.active { display: block; }
.hfs-map-name { font-size: 42px; margin: 10px 0 6px; }
.hfs-map-avg { color: var(--hfs-accent); font-size: 14px; font-weight: 500; }
.hfs-map-desc { margin-top: 20px; font-size: 15px; line-height: 1.65; color: var(--hfs-ink-2); }
.hfs-map-stats { display: flex; gap: 32px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--hfs-line); }
.hfs-map-stats > div > div:first-child { font-size: 28px; }
.hfs-map-stats > div > div:last-child { font-size: 12px; color: var(--hfs-muted); margin-top: 2px; }
.hfs-map-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
.hfs-map-tab {
  padding: 12px 8px; border: 1px solid var(--hfs-line); background: #fff;
  color: var(--hfs-ink); cursor: pointer; font-family: inherit; font-size: 12px; font-weight: 500;
  transition: all .2s;
}
.hfs-map-tab.active { background: var(--hfs-ink); color: #fff; border-color: var(--hfs-ink); }

/* ========== TESTIMONIALS — KEPT IN ORIGINAL STYLE ========== */
.hfs-elfsight-wrap {
  margin-top: 50px;
  min-height: 200px;
}
.hfs-elfsight-wrap .elfsight-app-loader { display: none; }
.hfs-rev-nav { display: flex; gap: 6px; padding-bottom: 8px; }
.hfs-rev-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 50px; }
.hfs-rev-card { border-top: 1px solid var(--hfs-line); padding-top: 30px; display: none; flex-direction: column; }
.hfs-rev-card.visible { display: flex; }
.hfs-rev-stars { display: flex; gap: 2px; color: var(--hfs-accent); font-size: 12px; margin-bottom: 20px; }
.hfs-rev-text { font-family: var(--hfs-font-display); font-size: 20px; line-height: 1.55; color: var(--hfs-ink); margin: 0; flex: 1; }
.hfs-rev-foot { margin-top: 28px; display: flex; justify-content: space-between; align-items: center; }
.hfs-rev-name { font-weight: 500; font-size: 14px; }
.hfs-rev-when { font-size: 11px; color: var(--hfs-muted); margin-top: 3px; letter-spacing: .04em; }

/* ========== ARTICLES ========== */
.hfs-art-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 50px; }
.hfs-art-card { display: flex; flex-direction: column; gap: 20px; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.hfs-art-card:hover { transform: translateY(-3px); }
.hfs-art-img { aspect-ratio: 5/4; overflow: hidden; background: var(--hfs-paper-2); }
.hfs-art-img img { width: 100%; height: 100%; object-fit: cover; }
.hfs-art-meta { display: flex; gap: 10px; align-items: center; font-size: 11px; color: var(--hfs-muted); letter-spacing: .06em; }
.hfs-art-tag { color: var(--hfs-accent); font-weight: 500; }
.hfs-art-title { font-size: 26px; margin: 12px 0 6px; line-height: 1.15; }
.hfs-art-sub { margin: 0; color: var(--hfs-muted); font-size: 14px; line-height: 1.6; }

/* ========== FAQ ========== */
.hfs-faq-wrap { max-width: 1000px; margin: 0 auto; }
.hfs-faq-head { text-align: center; margin-bottom: 60px; }
.hfs-faq-list { border-top: 1px solid var(--hfs-line-2); }
.hfs-faq-item { border-bottom: 1px solid var(--hfs-line-2); padding: 24px 0; }
.hfs-faq-item summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; cursor: pointer; list-style: none; }
.hfs-faq-item summary::-webkit-details-marker { display: none; }
.hfs-faq-q { font-size: 22px; font-weight: 400; }
.hfs-faq-plus { transition: transform .3s; display: inline-flex; flex-shrink: 0; color: var(--hfs-ink); }
.hfs-faq-item[open] .hfs-faq-plus { transform: rotate(45deg); }
.hfs-faq-a { margin-top: 16px; font-size: 16px; line-height: 1.7; color: var(--hfs-muted); max-width: 75ch; }

/* ========== CONTACT ========== */
.hfs-contact-grid { max-width: 1440px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.1fr; gap: 80px; }
.hfs-eyebrow-dark { color: rgba(255,255,255,.6) !important; }
.hfs-contact-title { font-size: clamp(44px, 7vw, 92px); margin: 14px 0 28px; font-weight: 500; }
.hfs-contact-lead { font-size: 17px; line-height: 1.6; opacity: .8; max-width: 440px; }
.hfs-contact-rows { margin-top: 50px; }
.hfs-contact-row { display: grid; grid-template-columns: 24px 1fr; gap: 20px; padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.15); align-items: center; }
.hfs-contact-icon { color: rgba(255,255,255,.6); display: inline-flex; }
.hfs-contact-val { font-size: 17px; font-weight: 400; margin-top: 4px; }

/* Form */
.hfs-form { background: #fff; color: var(--hfs-ink); padding: 44px 40px; }
.hfs-form-title { font-size: 32px; margin: 10px 0 30px; }
.hfs-form .hfs-eyebrow { font-size: 10px; }
.hfs-form input, .hfs-form select, .hfs-form textarea {
  width: 100%; background: transparent; border: none; border-bottom: 1px solid var(--hfs-line-2);
  padding: 10px 0; font-family: inherit; font-size: 15px; color: var(--hfs-ink); margin-top: 6px;
  outline: none; direction: rtl; border-radius: 0;
}
.hfs-form input:focus, .hfs-form select:focus, .hfs-form textarea:focus { border-bottom-color: var(--hfs-accent); }
.hfs-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
.hfs-form-full { display: block; margin-top: 14px; }
.hfs-form-check { display: flex; gap: 10px; align-items: flex-start; margin-top: 22px; font-size: 12px; color: var(--hfs-muted); }
.hfs-form-submit { margin-top: 24px; width: 100%; padding: 16px; justify-content: center; }
#hfs-form-message { margin-top: 14px; padding: 0; font-size: 14px; }
#hfs-form-message.success { padding: 14px; background: #e8f5e9; color: #1b5e20; }
#hfs-form-message.error { padding: 14px; background: #ffebee; color: #b71c1c; }

/* ========== FLOATING WHATSAPP ========== */
@keyframes hfs-wa-pulse {
  0%   { box-shadow: 0 10px 30px rgba(37,211,102,.35), 0 0 0 0 rgba(37,211,102,.5); }
  70%  { box-shadow: 0 10px 30px rgba(37,211,102,.35), 0 0 0 18px rgba(37,211,102,0); }
  100% { box-shadow: 0 10px 30px rgba(37,211,102,.35), 0 0 0 0 rgba(37,211,102,0); }
}
.hfs-float-wa {
  display: none !important; /* Hidden — using site's existing WhatsApp plugin button instead */
}
.hfs-float-wa:hover { transform: scale(1.08); }
.hfs-float-wa-tip {
  position: absolute; left: calc(100% + 14px); top: 50%; transform: translateY(-50%);
  background: var(--hfs-ink); color: #fff; padding: 8px 14px; border-radius: 999px;
  font-size: 12px; white-space: nowrap; opacity: 0; transition: opacity .2s;
  pointer-events: none; font-weight: 500;
}
.hfs-float-wa:hover .hfs-float-wa-tip { opacity: 1; }

/* ========== ACCESSIBILITY WIDGET ========== */
.hfs-float-a11y {
  position: fixed; bottom: 100px; right: 24px; z-index: 70;
  width: 52px; height: 52px; border-radius: 50%; background: #1d4fa6; color: #fff;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  box-shadow: 0 8px 24px rgba(0,0,0,.25); border: none;
  transition: transform .25s ease;
}
.hfs-float-a11y:hover { transform: scale(1.08); }
.hfs-a11y-panel {
  position: fixed; bottom: 90px; right: 24px; z-index: 80;
  background: #fff; border: 1px solid var(--hfs-line); width: 320px;
  max-width: calc(100vw - 32px); padding: 22px;
  box-shadow: 0 24px 60px -10px rgba(0,0,0,.25); border-radius: 8px;
  opacity: 0; transform: translateY(8px) scale(.96); transform-origin: bottom right;
  transition: opacity .25s ease, transform .25s ease; pointer-events: none;
}
.hfs-a11y-panel.on { opacity: 1; transform: none; pointer-events: auto; }
.hfs-a11y-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.hfs-a11y-title { font-size: 18px; font-weight: 500; }
.hfs-a11y-close { background: transparent; border: none; cursor: pointer; color: var(--hfs-ink); padding: 4px; }
.hfs-a11y-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.hfs-a11y-tool {
  padding: 14px 8px; border: 1px solid var(--hfs-line); background: #fff;
  cursor: pointer; font-family: inherit; font-size: 11.5px; font-weight: 500;
  color: var(--hfs-ink); border-radius: 6px; text-align: center; transition: all .2s;
}
.hfs-a11y-tool:hover { border-color: var(--hfs-ink); background: var(--hfs-paper-2); }
.hfs-a11y-tool.active { background: var(--hfs-accent); color: #fff; border-color: var(--hfs-accent); }
.hfs-a11y-reset {
  margin-top: 12px; width: 100%; padding: 10px; border: 1px solid var(--hfs-ink);
  background: var(--hfs-ink); color: #fff; cursor: pointer; font-family: inherit;
  font-size: 13px; font-weight: 500; border-radius: 6px;
}
.hfs-a11y-note { margin-top: 10px; font-size: 11px; color: var(--hfs-muted); text-align: center; line-height: 1.5; }

/* Accessibility body classes */
body.hfs-a11y-text-lg, body.hfs-a11y-text-lg * { font-size: 1.15em !important; line-height: 1.7 !important; }
body.hfs-a11y-text-xl, body.hfs-a11y-text-xl * { font-size: 1.3em !important; line-height: 1.8 !important; }
body.hfs-a11y-grayscale { filter: grayscale(100%); }
body.hfs-a11y-contrast { filter: contrast(1.6); }
body.hfs-a11y-invert { filter: invert(1) hue-rotate(180deg); }
body.hfs-a11y-invert img, body.hfs-a11y-invert video { filter: invert(1) hue-rotate(180deg); }
body.hfs-a11y-light, body.hfs-a11y-light * { background: #fff !important; color: #000 !important; }
body.hfs-a11y-links a, body.hfs-a11y-links button { outline: 2px solid #ffeb3b !important; outline-offset: 2px; background: #1d4fa6 !important; color: #fff !important; }
body.hfs-a11y-readable, body.hfs-a11y-readable * { font-family: Arial, sans-serif !important; letter-spacing: .03em !important; }

/* ========== MOBILE CTA ========== */
.hfs-mobile-cta {
  position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 60;
  background: var(--hfs-ink); color: #fff; border-radius: 8px; padding: 6px;
  display: none; align-items: center; justify-content: space-between; gap: 6px;
  box-shadow: 0 14px 40px -10px rgba(0,0,0,.35);
}
.hfs-mobile-cta a {
  flex: 1; text-align: center; padding: 12px; font-weight: 500; font-size: 13px;
  text-decoration: none; border-radius: 4px;
}
.hfs-mobile-wa { background: #1F9D54; color: #fff !important; }
.hfs-mobile-tel { background: #fff; color: var(--hfs-ink) !important; }

/* ========== RESPONSIVE ========== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .hfs-reveal { opacity: 1 !important; transform: none !important; }
}

@media (max-width: 1100px) {
  .hfs-prop-grid, .hfs-art-grid, .hfs-rev-grid { grid-template-columns: 1fr 1fr; }
  .hfs-section-header { grid-template-columns: 1fr; gap: 20px; }
}

@media (max-width: 900px) {
  .hfs-hide-mobile { display: none !important; }
  .hfs-nav-links { display: none; }
  .hfs-search-grid { grid-template-columns: 1fr 1fr; }
  .hfs-search-field { border-left: none; border-bottom: 1px solid var(--hfs-line); }
  .hfs-search-btn { grid-column: 1 / -1; padding: 14px; }
  .hfs-prop-grid, .hfs-art-grid, .hfs-rev-grid { grid-template-columns: 1fr; }
  .hfs-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .hfs-stats-grid > div { border-inline-end: none; border-bottom: 1px solid rgba(255,255,255,.15); padding-bottom: 28px; margin-bottom: 28px; }
  .hfs-about-grid { grid-template-columns: 1fr; gap: 60px; }
  .hfs-map-grid { grid-template-columns: 1fr; }
  .hfs-contact-grid { grid-template-columns: 1fr; gap: 60px; }
  .hfs-section { padding: 100px 20px 80px; }
  .hfs-section-dark, .hfs-section-tinted { padding: 100px 20px; }
  .hfs-hero-inner { padding: 140px 20px 40px; }
}

@media (max-width: 820px) {
  .hfs-mobile-cta { display: flex; }
  .hfs-float-wa { display: none !important; }
  .hfs-float-a11y { bottom: 90px; width: 46px; height: 46px; right: 16px; }
  .hfs-a11y-panel { bottom: 140px; right: 12px; }
}

@media (max-width: 720px) {
  .hfs-hero-stats { grid-template-columns: repeat(2, 1fr); gap: 22px; }
  .hfs-form { padding: 30px 24px; }
  .hfs-form-row { grid-template-columns: 1fr; }
  .hfs-about-stats { grid-template-columns: 1fr; }
  .hfs-about-stats > div { border-inline-end: none !important; padding-inline-end: 0 !important; padding-inline-start: 0 !important; }
  .hfs-map-tabs { grid-template-columns: 1fr 1fr; }
}