/* Homes For Sale ("Modern Brokerage"). Loads after /site.css and only adds
   what this page composes differently: a compact hero, the live IDX search
   container, our listings, the community atlas, the area picker, the alerts
   and sell-to-buy pair, and a compact tools band.
   Same rules as the homepage: navy only as gradients on dark surfaces, gold
   fills with navy text, 28px sections, 20px cards, 14px images, pills. */

/* ---------- Current page in the nav ---------- */
.hd .nav-link.is-active{ background:rgba(255,255,255,.2); }
.hd.is-solid .nav-link.is-active{ background:#fff; box-shadow:0 1px 3px rgba(7,25,49,.1); }
.drop-in a[aria-current="page"]{ background:var(--panel); }
.mnav details a[aria-current="page"]{ color:var(--ink); font-weight:500; }

/* ---------- Hero: compact, copy lower left like /selling ---------- */
.hfs-hero .hero-card{
  height:auto; min-height:clamp(500px, 37vw, 580px);
  align-items:stretch; justify-content:flex-end; text-align:left;
  /* Extra room at the foot: the alerts bubble overlaps the bottom edge. */
  padding:calc(var(--hd-h) + 32px) max(24px, calc((100vw - 1320px) / 2 + 24px)) clamp(108px, 9vw, 132px);
}
.hfs-hero .hero-img{ object-position:50% 58%; }
.hfs-hero .hero-shade{ background:
  linear-gradient(90deg, rgba(4,13,27,.8) 0%, rgba(4,13,27,.56) 30%, rgba(4,13,27,.14) 58%, rgba(4,13,27,0) 74%),
  linear-gradient(0deg, rgba(4,13,27,.55) 0%, rgba(4,13,27,0) 45%),
  linear-gradient(180deg, rgba(4,13,27,.45) 0%, rgba(4,13,27,0) 26%); }
.hfs-body{ align-items:flex-start; max-width:640px; }
.hfs-crumbs{ display:inline-flex; align-items:center; gap:8px; min-height:36px; padding:4px 16px; border-radius:999px; font-size:14px; font-weight:500;
  background:rgba(4,13,27,.34); border:1px solid rgba(255,255,255,.24); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
.hfs-crumbs a{ color:rgba(255,255,255,.78); display:inline-flex; align-items:center; min-height:44px; margin:-12px 0; }
.hfs-crumbs a:hover{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.hfs-crumbs i{ font-size:12px; opacity:.6; }
.hfs-title{ margin-top:18px; font-size:clamp(2.2rem, 3.8vw, 3.5rem); font-weight:500; letter-spacing:-0.035em; line-height:1.04; }
.hfs-title .ln{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.hfs-title .ln > span{ display:inline-block; animation:lineUp 1.1s var(--ease) both; animation-delay:calc(.25s + var(--i, 0) * .12s); }
.hfs-title .ln + .ln > span{ color:var(--accent-tint); }
.hfs-sub{ margin-top:14px; font-size:clamp(15.5px, 1.25vw, 18px); line-height:1.55; color:rgba(255,255,255,.88); max-width:52ch; }
.hfs-ctas{ display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.hfs-ctas .pill:hover .pill-ic:has(.ph-arrow-down){ transform:translateY(2px); }
.pill:hover .pill-ic:has(.ph-bell-simple){ transform:rotate(-12deg); }

/* ---------- Alerts bubble: #searchModal shown inline, like the homepage's
   #heroCapture. The markup and its inline script are the live ones; only CSS
   turns the pop-up into a card. It stays visible after the script's
   closeSearchModal() sets hidden again, so the success message stays. ---------- */
.alerts-bubble{ position:relative; z-index:20; display:flex; justify-content:center; margin-top:-68px; padding:0 24px; scroll-margin-top:110px; }
.alerts-bubble #searchModal, .alerts-bubble #searchModal[hidden]{ display:block !important; position:static; inset:auto; z-index:auto; width:min(1120px, 100%); padding:0; }
.alerts-bubble .lm-backdrop, .alerts-bubble .lm-close, .alerts-bubble .btn-text[data-close-search]{ display:none !important; }
.alerts-bubble .lm-card{ width:100%; max-height:none; overflow:visible; animation:none; padding:20px 20px 20px 32px; border-radius:var(--r-sec); background:#fff; border:1px solid var(--line);
  box-shadow:0 26px 60px -28px rgba(7,25,49,.45), 0 4px 14px -6px rgba(7,25,49,.12); }
.alerts-bubble .lm-step.active{ display:grid; grid-template-columns:minmax(0, 340px) minmax(0, 1fr); column-gap:32px; align-items:center; animation:none; }
.alerts-bubble .lm-step h3{ grid-column:1; padding:0; font-size:20px; font-weight:500; letter-spacing:-0.02em; line-height:1.2; }
.alerts-bubble .lm-step > .lm-sub{ grid-column:1; margin:6px 0 0; font-size:14.5px; line-height:1.5; }
.alerts-bubble #searchModalForm, .alerts-bubble .form-error{ grid-column:2; grid-row:1 / span 2; }
.alerts-bubble .form-error{ grid-row:3; margin-top:8px; }
#searchModalForm{ display:flex; align-items:center; gap:4px; padding:6px; border-radius:999px; background:var(--panel); }
.ab-fld{ flex:1; min-width:0; display:flex; flex-direction:column; padding:8px 20px 6px; border-radius:999px; cursor:text; transition:background-color .25s ease, box-shadow .25s ease; }
.ab-fld + .ab-fld{ position:relative; }
.ab-fld + .ab-fld::before{ content:""; position:absolute; left:-2px; top:14px; bottom:14px; width:1px; background:var(--line-2); }
.ab-fld:focus-within{ background:#fff; box-shadow:0 0 0 2px var(--accent); }
.ab-fld:focus-within::before, .ab-fld:focus-within + .ab-fld::before{ opacity:0; }
.ab-fld > span{ font-size:12.5px; font-weight:500; color:var(--muted); line-height:1.2; }
.ab-fld em{ font-style:normal; font-weight:400; color:var(--muted); }
.ab-fld .field{ height:28px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none !important; font-size:16px; }
.ab-fld .field:focus{ box-shadow:none; }
#searchModalForm .btn{ flex:none; width:auto; height:56px; padding:0 28px; }
.alerts-bubble #searchModalDone.active{ display:block; }
.alerts-bubble .lm-success{ display:flex; align-items:center; gap:18px; text-align:left; padding:6px 0; }
.alerts-bubble .lm-success .ring{ margin:0; flex:none; }
.alerts-bubble .lm-success h3{ font-size:21px; }
.alerts-bubble .lm-success .lm-sub{ margin-top:4px; }
#searchModal .form-error{ color:#9E3426 !important; }

/* ---------- Live search ---------- */
.hfs-search{ padding-top:clamp(56px, 5.4vw, 80px); }
.search-head{ margin-bottom:24px; }
.search-head > div{ max-width:760px; }
.search-head p{ margin-top:14px; font-size:17px; line-height:1.6; color:var(--ink-2); max-width:56ch; }
/* The widget's container. Full width, quiet, and the same size whether the
   widget is loading, rendered or missing, so nothing jumps. */
.idx-shell{ position:relative; margin-top:14px; min-height:420px; border-radius:var(--r-sec); background:var(--panel); padding:clamp(12px, 1.6vw, 20px); }
.idx-shell > idx-listings-showcase{ display:block; opacity:0; transition:opacity .6s var(--ease); }
.idx-shell.is-ready > idx-listings-showcase{ opacity:1; }
.idx-shell.is-ready{ min-height:0; }
.idx-sk{ display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; }
.idx-sk .card-sk{ background:#fff; }
.idx-shell.is-ready .idx-sk, .idx-shell.is-missing .idx-sk{ display:none; }
.idx-fallback{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:18px 24px; min-height:280px; padding:clamp(20px, 3vw, 40px); border-radius:var(--r-card); background:#fff; }
.idx-fallback[hidden]{ display:none; }
.idx-fallback .ic{ background:var(--accent-soft); }
.idx-fb-t{ font-size:clamp(19px, 1.6vw, 23px); font-weight:500; letter-spacing:-0.02em; }
.idx-fb-s{ margin-top:6px; font-size:15.5px; line-height:1.6; color:var(--muted); max-width:52ch; }
.idx-fb-ctas{ display:flex; flex-wrap:wrap; gap:8px; }
.idx-note{ margin-top:14px; font-size:13.5px; color:var(--muted); text-align:center; }

/* ---------- Our listings ---------- */
.ours-sub{ margin-top:14px; font-size:17px; line-height:1.6; color:var(--ink-2); max-width:48ch; }
/* Cards come from the live page's own inline renderer (.prop-card markup);
   styled here to match the site's .lcard. Six at most; the rest are one
   click away on /our-listings. */
.fs-grid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px; }
.fs-grid > .prop-card:nth-child(n+7){ display:none; }
.prop-card{ display:flex; flex-direction:column; background:var(--panel); border-radius:var(--r-card); padding:8px; transition:transform .5s var(--ease), box-shadow .5s ease; }
.prop-card:not([aria-hidden]):hover{ transform:translateY(-6px); box-shadow:0 22px 44px -28px rgba(7,25,49,.35); }
.prop-card[aria-hidden]{ opacity:1 !important; }
.prop-card[aria-hidden] .art{ background:var(--panel-2) !important; }
.prop-card[aria-hidden] .prop-body > div{ background:var(--panel-2) !important; }
.prop-media{ position:relative; aspect-ratio:4/3; border-radius:var(--r-img); overflow:hidden; background:var(--panel-2); }
.prop-media .art{ position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .9s var(--ease); }
.prop-card:hover .art{ transform:scale(1.05); }
.prop-tag{ position:absolute; left:12px; top:12px; display:inline-flex; align-items:center; height:30px; padding:0 13px; border-radius:999px; background:#fff; color:var(--ink); font-size:13px; font-weight:600; }
.prop-tag.sold{ background:var(--ink); color:#fff; }
.prop-price{ position:absolute; left:12px; bottom:12px; display:inline-flex; align-items:center; height:36px; padding:0 14px; border-radius:999px; background:#fff; color:var(--ink); font-size:17px; font-weight:600; letter-spacing:-0.02em; }
.prop-body{ padding:16px 12px 10px; }
.prop-body h4{ font-size:18px; font-weight:500; letter-spacing:-0.015em; line-height:1.3; }
.prop-body .loc{ margin-top:2px; font-size:14px; color:var(--muted); }
.prop-specs{ display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:12px; font-size:14px; color:var(--ink-2); }
.prop-specs span{ display:inline-flex; align-items:center; gap:6px; }
.prop-specs svg{ width:17px; height:17px; stroke:var(--muted); }
.fs-empty{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px; max-width:560px; margin:0 auto; padding:clamp(28px, 3.4vw, 44px); border-radius:var(--r-sec); background:var(--panel); }
.fs-empty[hidden]{ display:none; }
.fs-empty h3{ font-size:clamp(20px, 1.8vw, 24px); font-weight:500; letter-spacing:-0.02em; }
.fs-empty p{ font-size:16px; color:var(--muted); max-width:44ch; }
.fs-empty .pill{ margin-top:8px; }

/* ---------- Communities: an atlas, each town with its neighbourhoods ---------- */
.comm{ display:grid; grid-template-columns:repeat(12, 1fr); gap:16px; }
.town{ display:flex; flex-direction:column; background:var(--panel); border-radius:var(--r-card); padding:8px; transition:background-color .3s ease, box-shadow .5s ease, transform .5s var(--ease); }
.town:hover{ background:#E8EDF3; box-shadow:0 24px 50px -30px rgba(7,25,49,.4); transform:translateY(-4px); }
.town-st, .town-ld{ grid-column:span 7; }
.town-ps, .town-el{ grid-column:span 5; }
.town-img{ display:block; position:relative; height:clamp(220px, 22vw, 310px); border-radius:var(--r-img); overflow:hidden; background:var(--panel-2); }
.town-img img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.town-el .town-img img{ object-position:50% 70%; }
.town:hover .town-img img{ transform:scale(1.05); }
.town-body{ display:flex; flex-direction:column; flex:1; padding:18px 14px 12px; }
.town-top{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.town-top b{ font-size:clamp(21px, 1.8vw, 25px); font-weight:500; letter-spacing:-0.03em; line-height:1.15; }
.town-go{ width:42px; height:42px; border-radius:50%; background:var(--ink); color:#fff; display:grid; place-items:center; font-size:17px; flex:none; transition:transform .35s var(--ease), background-color .3s ease, color .3s ease; }
.town:hover .town-go{ transform:rotate(45deg); background:var(--accent); color:var(--ink); }
.town-line{ margin-top:4px; font-size:15px; color:var(--muted); line-height:1.55; }
.hoods{ display:flex; flex-wrap:wrap; gap:6px; margin-top:16px; }
.hoods span{ display:inline-flex; align-items:center; height:30px; padding:0 12px; border-radius:999px; background:#fff; font-size:13.5px; color:var(--ink-2); white-space:nowrap; }
.hoods .hoods-more{ background:transparent; color:var(--accent-text); font-weight:500; padding-left:4px; }
.js-rv .comm > .rv{ transition-delay:calc(var(--i, 0) * 100ms); }
.js-rv .town.rv .town-img img{ transform:scale(1.1); transition:transform 1.6s var(--ease); }
.js-rv .town.rv.is-in .town-img img{ transform:none; }
.js-rv .town.rv.is-in:hover .town-img img{ transform:scale(1.05); }

/* ---------- Not sure which area? ---------- */
.match{ display:grid; grid-template-columns:1fr 1.08fr; gap:12px; background:var(--panel); border-radius:var(--r-sec); padding:12px; }
.match-ask{ padding:clamp(20px, 3.4vw, 44px); }
.match-sub{ margin-top:14px; font-size:16.5px; color:var(--muted); max-width:40ch; }
.match-opts{ display:grid; gap:8px; margin-top:28px; }
.mopt{ display:flex; align-items:center; gap:14px; width:100%; min-height:56px; padding:0 20px 0 14px; border-radius:999px; background:#fff; border:1px solid transparent; font-size:15.5px; font-weight:500; text-align:left;
  transition:border-color .25s ease, background-color .25s ease, color .25s ease, transform .3s var(--ease); }
.mopt i{ width:36px; height:36px; border-radius:50%; display:grid; place-items:center; flex:none; font-size:19px; background:var(--accent-soft); color:var(--accent-text); transition:background-color .25s ease, color .25s ease; }
.mopt:hover{ border-color:var(--line-2); transform:translateX(3px); }
.mopt.is-on{ background:var(--navy-grad); color:#fff; border-color:transparent; transform:none; }
.mopt.is-on i{ background:var(--accent); color:var(--ink); }
.match-ans{ position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; min-height:520px; border-radius:var(--r-card); color:#fff; background:var(--navy-2); isolation:isolate; }
.ma-img{ position:absolute; inset:0; z-index:-1; }
.ma-img img{ width:100%; height:100%; object-fit:cover; transition:opacity .45s ease, transform 1.2s var(--ease); }
.ma-img::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(4,13,27,.95) 0%, rgba(4,13,27,.84) 34%, rgba(4,13,27,.35) 62%, rgba(4,13,27,0) 88%); }
.match-ans.is-swap .ma-img img{ opacity:0; transform:scale(1.04); }
.ma-body{ padding:clamp(22px, 3vw, 40px); transition:opacity .35s ease, transform .45s var(--ease); }
.match-ans.is-swap .ma-body{ opacity:0; transform:translateY(10px); }
.ma-lbl{ font-size:14px; font-weight:500; color:var(--accent-tint); }
.ma-name{ margin-top:4px; font-size:clamp(2rem, 3.2vw, 2.9rem); font-weight:400; letter-spacing:-0.035em; line-height:1.05; }
.ma-why{ margin-top:12px; font-size:16.5px; line-height:1.6; color:rgba(255,255,255,.84); max-width:46ch; }
.ma-ctas{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }

/* ---------- Alerts + sell to buy ---------- */
.duet{ display:grid; grid-template-columns:5fr 7fr; gap:16px; }
.duet-solo{ grid-template-columns:1fr; }
.duet-solo .sellbuy{ display:grid; grid-template-columns:1fr 1.1fr; column-gap:clamp(32px, 5vw, 72px); align-items:center; }
.duet-solo .sellbuy .value-capture{ margin-top:0; }
.duet-solo .sb-note{ grid-column:2; }
.duet-t{ font-size:clamp(24px, 2.2vw, 31px); font-weight:400; letter-spacing:-0.03em; line-height:1.12; margin-top:24px; }
.sellbuy{ display:flex; flex-direction:column; border:1px solid var(--line); border-radius:var(--r-sec); padding:clamp(26px, 3.4vw, 44px); background:#fff; box-shadow:0 30px 60px -44px rgba(7,25,49,.35); }
.sellbuy .ic{ background:var(--accent-soft); }
.sb-copy p{ margin-top:14px; font-size:16px; line-height:1.6; color:var(--muted); max-width:52ch; }
.sellbuy .value-capture{ margin-top:28px; }
.sb-note{ display:flex; align-items:center; gap:10px; margin-top:16px; font-size:14.5px; color:var(--ink-2); }
.sb-note i{ font-size:19px; color:var(--accent-text); flex:none; }
.js-rv .duet > .rv{ transition-delay:calc(var(--i, 0) * 110ms); }

/* Address bar: the exact markup main.js expects, styled like the homepage pill. */
.value-capture{ position:relative; z-index:5; display:flex; align-items:center; gap:10px; background:#fff; border-radius:999px; padding:8px 8px 8px 24px;
  border:1px solid var(--line-2); transition:box-shadow .3s ease, border-color .3s ease; }
.value-capture:focus-within{ border-color:var(--accent); box-shadow:0 0 0 4px rgba(201,164,92,.28); }
.value-capture .ac-wrap{ position:static; flex:1; min-width:0; }
.value-capture input:not([name="website"]){ width:100%; height:48px; border:0; outline:0; background:transparent; font:inherit; font-size:16.5px; color:var(--ink); }
.value-capture input::placeholder{ color:#6B7585; }
.value-capture .btn{ flex:none; height:54px; }
.value-capture .ac-list{ z-index:40; }

/* ---------- Tools: compact band, four tools in a row ---------- */
.hfs-tools .tools-grid{ grid-template-columns:repeat(4, 1fr); }
.hfs-tools .tool{ padding:24px 24px 26px; }
.hfs-tools .tool p{ max-width:none; }

/* ---------- Closing form ---------- */
#pageCtaForm .btn{ width:100%; margin-top:6px; }


/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .hfs-tools .tools-grid{ grid-template-columns:1fr 1fr; }
  .idx-sk{ grid-template-columns:repeat(3, 1fr); }
  .idx-sk .card-sk:nth-child(4){ display:none; }
}
@media (max-width:1023px){
  .town-st, .town-ld, .town-ps, .town-el{ grid-column:span 6; }
  .town-img{ height:auto; aspect-ratio:16/9; }
  .match{ grid-template-columns:1fr; }
  .match-ans{ min-height:440px; }
  .duet{ grid-template-columns:1fr; }
  .duet-solo .sellbuy{ grid-template-columns:1fr; }
  .duet-solo .sellbuy .value-capture{ margin-top:28px; }
  .duet-solo .sb-note{ grid-column:auto; }
  .fs-grid{ grid-template-columns:1fr 1fr; }
  .alerts-bubble .lm-step.active{ grid-template-columns:1fr; row-gap:0; }
  .alerts-bubble #searchModalForm, .alerts-bubble .form-error{ grid-column:1; grid-row:auto; }
  .alerts-bubble #searchModalForm{ margin-top:18px; }

  .idx-fallback{ grid-template-columns:auto 1fr; }
  .idx-fb-ctas{ grid-column:1 / -1; }
}
@media (max-width:760px){
  /* Phone hero: photo up top fading into navy, the copy on the dark foot. */
  .hfs-hero .hero-card{ height:auto; min-height:0; padding:220px 20px 80px; background:#071931; }
  .hfs-hero .hero-media{ inset:0 0 auto 0; height:300px; overflow:hidden; }
  .hfs-hero .hero-img{ object-position:72% 50%; }
  .hfs-hero .hero-shade{ bottom:auto; height:302px; background:linear-gradient(180deg, rgba(4,13,27,.5) 0%, rgba(4,13,27,0) 26%, rgba(4,13,27,0) 50%, rgba(7,25,49,.9) 84%, #071931 100%); }
  .hfs-crumbs{ min-height:32px; padding:2px 12px; font-size:13px; }
  .hfs-title{ margin-top:14px; font-size:clamp(2rem, 9vw, 2.5rem); line-height:1.06; }
  .hfs-sub{ margin-top:10px; font-size:15.5px; }
  .hfs-ctas{ display:grid; grid-template-columns:1fr; gap:8px; width:100%; margin-top:20px; }
  .hfs-ctas .pill{ width:100%; justify-content:space-between; }

  .alerts-bubble{ margin-top:-52px; padding:0 16px; scroll-margin-top:84px; }
  .alerts-bubble .lm-card{ padding:22px 16px 16px; border-radius:24px; }
  .alerts-bubble .lm-step h3{ padding:0 4px; font-size:20px; }
  .alerts-bubble .lm-step > .lm-sub{ padding:0 4px; }
  #searchModalForm{ display:grid; gap:8px; padding:0; border-radius:0; background:none; }
  .ab-fld{ padding:10px 18px 8px; border-radius:16px; background:var(--panel); }
  .ab-fld + .ab-fld::before{ display:none; }
  #searchModalForm .btn{ width:100%; height:54px; margin-top:2px; }
  .alerts-bubble .lm-success{ gap:14px; }
  .alerts-bubble .lm-success .ring{ width:52px; height:52px; }
  .hfs-search{ padding-top:48px; }
  .search-head .pill{ width:100%; justify-content:center; }
  .fs-grid{ grid-template-columns:1fr; gap:12px; }
  .fs-grid > .prop-card:nth-child(n+4){ display:none; }
  .search-head p{ font-size:16px; }
  .idx-shell{ margin:12px -16px 0; padding:12px 0; border-radius:0; background:none; min-height:340px; }
  .idx-sk{ grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:80%; overflow:hidden; padding:0 16px; }
  .idx-sk .card-sk{ background:var(--panel); }
  .idx-sk .card-sk:nth-child(4){ display:block; }
  .idx-fallback{ grid-template-columns:1fr; margin:0 16px; min-height:0; background:var(--panel); }
  .idx-fb-ctas{ display:grid; }
  .idx-fb-ctas .pill{ width:100%; justify-content:space-between; }
  .idx-fb-ctas .pill-line{ justify-content:center; }
  .idx-note{ margin-top:10px; text-align:left; }

  .ours-sub{ font-size:16px; }

  .comm{ grid-template-columns:1fr; gap:12px; }
  .town-st, .town-ld, .town-ps, .town-el{ grid-column:auto; }
  .town-body{ padding:16px 10px 10px; }
  .town-line{ font-size:14.5px; }
  .hoods{ gap:5px; margin-top:12px; }
  .hoods span{ height:28px; padding:0 10px; font-size:13px; }

  .match{ padding:8px; border-radius:24px; }
  .match-ask{ padding:20px 12px 12px; }
  .match-opts{ margin-top:20px; gap:6px; }
  .mopt{ min-height:52px; font-size:15px; padding:0 14px 0 10px; border-radius:18px; }
  .match-ans{ min-height:400px; }
  .ma-body{ padding:22px 18px; }
  .ma-why{ font-size:15.5px; }
  .ma-ctas{ display:grid; }
  .ma-ctas .pill{ width:100%; justify-content:space-between; }

  .duet{ gap:12px; }
  .sellbuy{ padding:24px 20px; border-radius:var(--r-card); }
  .duet-t{ margin-top:18px; }
  .value-capture{ flex-wrap:wrap; border-radius:var(--r-card); padding:8px; gap:6px; }
  .value-capture .ac-wrap{ flex-basis:100%; }
  .value-capture input:not([name="website"]){ padding:0 12px; }
  .value-capture .btn{ width:100%; height:52px; }
  .sb-note{ align-items:flex-start; }

  .hfs-tools .tools-grid{ grid-template-columns:1fr; }
  .hfs-tools .tool{ padding:16px 60px 16px 16px; }
}

@media (prefers-reduced-motion:reduce){
  .hfs-title .ln > span{ animation:none !important; }
  .js-rv .town.rv .town-img img{ transform:none; }
  .prop-card, .prop-media .art{ transition:none; }
}
@media (max-width:760px){
  /* The photo band fades itself out, so it can never show a hard edge below the navy */
  .hfs-hero .hero-media{ -webkit-mask-image:linear-gradient(180deg, #000 55%, transparent 100%); mask-image:linear-gradient(180deg, #000 55%, transparent 100%); transform:none !important; }
  .hfs-hero .hero-card{ padding-left:var(--gut); padding-right:var(--gut); }
}

/* ---------- web4realty IDX: search bar + gallery (their widgets, framed only) ---------- */
.idx-live{ display:grid; gap:14px; margin-top:14px; padding:clamp(12px, 1.6vw, 20px); border-radius:var(--r-sec); background:var(--panel); }
.idx-live-search{ min-height:60px; }
.idx-live-feed{ min-height:420px; }
@media (max-width:760px){ .idx-live{ padding:10px; border-radius:22px; } }
