/* ===== V12 — platform polish: instant search panel, premium motion, loading states. Light + ink + emerald; red only
   for LIVE (not used here). Every animation/transition is switched off under prefers-reduced-motion (block at the end). */
:root{--v12-ease:cubic-bezier(.22,.8,.2,1);--v12-spring:cubic-bezier(.2,1.1,.3,1);--v12-ink:#141414;--v12-mute:#5F5E59;--v12-em:#0C6B4F;
  --v12-line:rgba(20,20,20,.08);--v12-sh-1:0 1px 1px rgba(20,20,20,.03),0 4px 10px rgba(20,20,20,.04),0 18px 36px -12px rgba(20,20,20,.08);
  --v12-sh-2:0 1px 2px rgba(20,20,20,.04),0 10px 24px rgba(20,20,20,.06),0 36px 70px -20px rgba(20,20,20,.18)}

/* ---- page-to-page: a soft cross-fade between pages (View Transitions, progressive — browsers without it just navigate) */
@view-transition{navigation:auto}
::view-transition-old(root){animation:v12-vt-out .28s var(--v12-ease) both}
::view-transition-new(root){animation:v12-vt-in .42s var(--v12-ease) both}
@keyframes v12-vt-out{to{opacity:0}}
@keyframes v12-vt-in{from{opacity:0;transform:translateY(8px)}}
html{scroll-behavior:smooth}
::selection{background:rgba(12,107,79,.16)}

/* ---- buttons: a quiet lift on hover, a press on click */
body:not(#_x) :is(.bx-btn,.st-btn,.v12-c-ask){transition:transform .35s var(--v12-spring),box-shadow .35s var(--v12-ease),background-color .25s,color .25s,border-color .25s}
body:not(#_x) :is(.bx-btn,.st-btn):hover{transform:translateY(-1px)}
body:not(#_x) :is(.bx-btn,.st-btn,.v12-c-ask):active{transform:translateY(0) scale(.97);transition-duration:.08s}
body:not(#_x) :is(a,button,select,input):focus-visible{outline:2px solid var(--v12-em);outline-offset:3px}

/* ---- cards across the platform: lift + deeper shadow, photo eases in closer */
body:not(#_x) :is(.bx-home,.gc-card,.v9-recc,.lx-area,.area){transition:transform .5s var(--v12-ease),box-shadow .5s var(--v12-ease),border-color .3s}
body:not(#_x) :is(.bx-home,.gc-card,.v9-recc):hover{transform:translateY(-4px);box-shadow:var(--v12-sh-2)}
body:not(#_x) :is(.bx-home .bx-media img,.v9-recc img,.lx-area img){transition:transform 1.1s var(--v12-ease)}
body:not(#_x) :is(.bx-home:hover .bx-media img,.v9-recc:hover img,.lx-area:hover img){transform:scale(1.05)}

/* ---- homepage hero: the still settles in once (slow push-in), the search bar glows when in use */
:root body.home:not(#_x) .v7-walk .lx-hero .st-player .st-poster{animation:v12-settle 2.6s var(--v12-ease) backwards}
@keyframes v12-settle{from{transform:scale(1.07);filter:saturate(.85) brightness(.92)}to{transform:none;filter:none}}
body.home:not(#_x) .v9-search{transition:box-shadow .4s var(--v12-ease),transform .4s var(--v12-ease)}
body.home:not(#_x) .v9-search:focus-within{box-shadow:0 0 0 4px rgba(12,107,79,.18),0 30px 60px -28px rgba(0,0,0,.45);transform:translateY(-2px)}
body.home:not(#_x) .v9-search .bx-btn{position:relative;overflow:hidden}
body.home:not(#_x) .v9-search .bx-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%) -150% 0/250% 100% no-repeat;transition:background-position .9s var(--v12-ease)}
body.home:not(#_x) .v9-search .bx-btn:hover::after{background-position:150% 0}

/* ======================================================================== instant search panel */
html.v12-sr-on,html.v12-sr-on body{overflow:hidden}
.v12-sr{position:fixed;inset:0;z-index:1200;display:flex;flex-direction:column;background:#FCFCFA;color:var(--v12-ink);visibility:hidden;opacity:0;transform:translateY(24px);
  transition:opacity .45s var(--v12-ease),transform .55s var(--v12-ease),visibility 0s linear .55s}
.v12-sr.is-on{visibility:visible;opacity:1;transform:none;transition:opacity .45s var(--v12-ease),transform .55s var(--v12-ease),visibility 0s}
.v12-sr-in{width:100%;max-width:1440px;margin:0 auto;padding:0 clamp(16px,4vw,56px)}
.v12-sr-top{flex:none;background:rgba(252,252,250,.86);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--v12-line);padding:clamp(14px,1.6vw,22px) 0 14px}
.v12-sr-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.v12-sr-k{display:block;font:600 11px/1 var(--sans,inherit);letter-spacing:.16em;text-transform:uppercase;color:var(--v12-mute);margin-bottom:8px}
.v12-sr h2{margin:0;font:500 clamp(24px,2.4vw,34px)/1.1 var(--display,inherit);letter-spacing:-.026em}
.v12-sr-n{color:var(--v12-mute);font-weight:400}
.v12-sr-x{all:unset;box-sizing:border-box;flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;border:1px solid var(--v12-line);cursor:pointer;color:var(--v12-ink);transition:transform .4s var(--v12-spring),background .2s}
.v12-sr-x:hover{transform:rotate(90deg);background:#F3F5F4}
.v12-sr-x svg{width:20px;height:20px}
.v12-sr-f{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch}
.v12-sr-f label{display:flex;flex-direction:column;gap:3px;padding:8px 14px 9px;border:1px solid var(--v12-line);border-radius:14px;background:#fff;min-width:150px;flex:0 1 auto;transition:border-color .2s,box-shadow .2s}
.v12-sr-f label:focus-within{border-color:rgba(12,107,79,.5);box-shadow:0 0 0 4px rgba(12,107,79,.12)}
.v12-sr-f label span{font:600 10px/1 var(--sans,inherit);letter-spacing:.14em;text-transform:uppercase;color:var(--v12-mute)}
.v12-sr-f select{all:unset;box-sizing:border-box;font:500 15px/1.3 var(--sans,inherit);color:var(--v12-ink);cursor:pointer;padding-right:18px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23141414' stroke-width='1.5'/%3E%3C/svg%3E") right center/10px no-repeat}
.v12-sr-all{margin-left:auto;align-self:center;display:inline-flex;align-items:center;gap:6px;font:500 14px/1 var(--sans,inherit);color:#1B4FD6;text-decoration:none}
.v12-sr-all svg{width:14px;height:14px;transition:transform .3s var(--v12-ease)}
.v12-sr-all:hover svg{transform:translateX(3px)}
.v12-sr-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:22px 0 60px;-webkit-overflow-scrolling:touch}
.v12-sr-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 20px}
@media(max-width:1180px){.v12-sr-g{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:860px){.v12-sr-g{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}}
@media(max-width:560px){.v12-sr-g{grid-template-columns:minmax(0,1fr);gap:28px}
  .v12-sr .v12-c .v12-c-m{aspect-ratio:16/10}
  .v12-sr-f{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * clamp(16px,4vw,56px));padding:0 clamp(16px,4vw,56px) 2px}
  .v12-sr-f::-webkit-scrollbar{display:none}
  .v12-sr-f label{min-width:130px}.v12-sr-all{display:none}}

/* result card — photo-first, compact, every card credits the listing brokerage */
.v12-c{position:relative;display:flex;flex-direction:column;gap:12px;min-width:0;animation:v12-rise .6s var(--v12-ease) both;animation-delay:calc(var(--i,0) * 35ms)}
@keyframes v12-rise{from{opacity:0;transform:translateY(14px)}}
.v12-c-m{position:relative;display:block;aspect-ratio:4/3;border-radius:16px;overflow:hidden;
  background:linear-gradient(100deg,#EEF1EF 30%,#F8FAF9 50%,#EEF1EF 70%) 0 0/300% 100%;animation:v12-shim 1.4s linear infinite;
  box-shadow:var(--v12-sh-1);transition:box-shadow .5s var(--v12-ease),transform .5s var(--v12-ease)}
@keyframes v12-shim{to{background-position:-300% 0}}
.v12-c-m img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.03);transition:opacity .7s var(--v12-ease),transform 1.2s var(--v12-ease)}
.v12-c-m.is-in{animation:none;background:#E9ECEA}
.v12-c-m.is-in img{opacity:1;transform:none}
.v12-c:hover .v12-c-m{box-shadow:var(--v12-sh-2);transform:translateY(-3px)}
.v12-c:hover .v12-c-m.is-in img{transform:scale(1.05)}
.v12-c-pend{position:absolute;inset:0;display:grid;place-items:center;padding:12px 14px;text-align:center;font:500 12px/1.3 var(--sans,inherit);color:#095540;opacity:0;transition:opacity .4s}
.v12-c-m.is-pending{animation:none;background:radial-gradient(120% 90% at 20% 10%,#E4EFE8 0%,#EEF1EF 55%,#E6EAE8 100%)}
.v12-c-m.is-pending img{opacity:0}
.v12-c-m.is-pending .v12-c-pend{opacity:1}
.v12-c-tag{position:absolute;left:10px;top:10px;padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.94);color:var(--v12-ink);font:600 10.5px/1 var(--sans,inherit);letter-spacing:.12em;text-transform:uppercase}
.v12-c-go{position:absolute;left:10px;bottom:10px;display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;background:rgba(20,20,20,.72);color:#fff;font:500 12.5px/1 var(--sans,inherit);
  opacity:0;transform:translateY(6px);transition:opacity .35s var(--v12-ease),transform .45s var(--v12-ease);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.v12-c-go svg{width:13px;height:13px}
.v12-c:hover .v12-c-go,.v12-c-m:focus-visible .v12-c-go{opacity:1;transform:none}
@media(hover:none){.v12-c-go{display:none}}
html.v12-sr-on #bridges-wa{opacity:0;pointer-events:none}
.v12-c-fav{position:absolute;right:10px;top:10px;z-index:2}
.v12-c-b{display:flex;flex-direction:column;gap:3px;padding:0 2px}
.v12-c-p{font:500 21px/1.15 var(--display,inherit);letter-spacing:-.02em}
.v12-c-a{color:var(--v12-ink);text-decoration:none;font:500 14.5px/1.35 var(--sans,inherit);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v12-c-a:hover{text-decoration:underline;text-underline-offset:3px}
.v12-c-l,.v12-c-s{font:400 13.5px/1.4 var(--sans,inherit);color:var(--v12-mute)}
.v12-c-s{color:var(--v12-ink)}
.v12-c-f{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding-top:10px;border-top:1px solid var(--v12-line)}
.v12-c-f small{font:400 11.5px/1.35 var(--sans,inherit);color:var(--v12-mute);min-width:0}
.v12-c-ask{all:unset;box-sizing:border-box;flex:none;padding:8px 12px;border-radius:999px;border:1px solid rgba(12,107,79,.35);color:var(--v12-em);font:500 12.5px/1 var(--sans,inherit);cursor:pointer;white-space:nowrap}
.v12-c-ask:hover{background:var(--v12-em);color:#fff;border-color:var(--v12-em)}
.v12-c--sk{animation:none}
.v12-c--sk .v12-c-m{box-shadow:none}
.v12-c--sk i{display:block;height:14px;border-radius:6px;background:#EEF1EF;margin:4px 0}
.v12-c--sk i:nth-child(1){width:45%;height:20px}.v12-c--sk i:nth-child(2){width:80%}.v12-c--sk i:nth-child(3){width:60%}
.v12-sr-empty{grid-column:1/-1;display:flex;flex-direction:column;gap:6px;padding:48px 24px;border-radius:22px;background:#F3F5F4;text-align:center}
.v12-sr-empty b{font:500 22px/1.2 var(--display,inherit)}
.v12-sr-empty span{color:var(--v12-mute)}
.v12-sr-more{display:flex;align-items:center;justify-content:center;gap:10px;padding:28px 0 6px;color:var(--v12-mute);font:500 14px/1 var(--sans,inherit)}
.v12-spin{width:16px;height:16px;border-radius:50%;border:2px solid rgba(12,107,79,.2);border-top-color:var(--v12-em);animation:v12-spin .8s linear infinite}
@keyframes v12-spin{to{transform:rotate(360deg)}}
.v12-sr-attr{margin:28px 0 0;font:400 12px/1.5 var(--sans,inherit);color:var(--v12-mute)}

/* ---- /listings opened with a search (?city / price / beds): results first, the page intro after them */
html.ls-q body:not(#_x) main{display:flex;flex-direction:column}
html.ls-q body:not(#_x) main>.fl{order:-2}
html.ls-q body:not(#_x) main>#res{order:-1}
html.ls-q body:not(#_x) main>#res .bx-rv{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  ::view-transition-old(root),::view-transition-new(root){animation:none}
  body:not(#_x) :is(.bx-btn,.st-btn,.v12-c-ask,.bx-home,.gc-card,.v9-recc,.lx-area,.area,.bx-home .bx-media img,.v9-recc img,.lx-area img),body.home:not(#_x) .v9-search,body.home:not(#_x) .v9-search .bx-btn::after{transition:none!important;transform:none!important}
  :root body.home:not(#_x) .v7-walk .lx-hero .st-player .st-poster{animation:none!important}
  .v12-sr,.v12-sr.is-on{transition:none;transform:none}
  .v12-c,.v12-c-m,.v12-spin{animation:none!important}
  .v12-c-m img,.v12-c-go,.v12-sr-x,.v12-c-m{transition:none!important;transform:none!important}
}