/* NStay Homes V51.9 - fast pages + full cover images in property cards (loaded in <head> on every public page) */

/* ---------- 1) property cards: the whole cover image is always visible ----------
   The card frame follows the photo shape (16:9). If a photo has another shape, the full photo is shown
   in the middle and the rest of the frame is filled with a soft blurred copy of the same photo (no crop, no squeeze). */
.property-card .media,.hp13-property-image,.pd-similar-img{position:relative;isolation:isolate;overflow:hidden;background-color:#e8eef3;background-size:0 0!important}
.property-card .media::before,.hp13-property-image::before,.pd-similar-img::before{content:"";position:absolute;inset:-14px;z-index:-2;background-image:inherit;background-size:cover;background-position:center;background-repeat:no-repeat;filter:blur(16px) saturate(1.05);opacity:.85;pointer-events:none}
.property-card .media::after,.hp13-property-image::after,.pd-similar-img::after{content:"";position:absolute;inset:0;z-index:-1;background-image:inherit;background-size:contain;background-position:center;background-repeat:no-repeat;pointer-events:none}
/* homepage + similar-property cards: frame = photo shape */
.nsc-card .hp13-property-image,.hp13-property-image{height:auto!important;aspect-ratio:16/9;max-width:100%}
.pd-similar-img{height:auto!important;aspect-ratio:16/9;max-width:100%}
/* listing (wide card on desktop): a little wider photo column; the full photo is shown inside it */
@media(min-width:901px){.property-card{grid-template-columns:360px minmax(0,1fr)}}
/* listing on tablet / phone (photo on top): frame = photo shape */
@media(max-width:900px){.property-card .media{min-height:0!important;height:auto;aspect-ratio:16/9;max-width:100%}}

/* ---------- 2) no "Loading..." text: quiet page-shaped placeholders (normally visible for a split second only) ---------- */
.nsf-sk{display:block;background:#edf1f4;border-radius:8px}
.nsf-list{display:grid;gap:18px}
.nsf-card{display:grid;grid-template-columns:360px minmax(0,1fr);gap:0;min-height:250px;border:1px solid #e3e8ee;border-radius:11px;overflow:hidden;background:#fff}
.nsf-card>.nsf-sk:first-child{border-radius:0;min-height:250px}
.nsf-card>div{display:flex;flex-direction:column;gap:12px;padding:22px}
@media(max-width:900px){.nsf-card{grid-template-columns:1fr}.nsf-card>.nsf-sk:first-child{min-height:0;aspect-ratio:16/9}}
.nsf-l{height:14px}.nsf-l.w30{width:30%}.nsf-l.w45{width:45%}.nsf-l.w60{width:60%}.nsf-l.w80{width:80%}.nsf-l.big{height:24px}
#resultCount .nsf-sk{display:inline-block;width:150px;height:16px;vertical-align:middle}
#pdLoading.nsf-pd{display:flex;flex-direction:column;gap:12px;padding:6px 0 30px;border:0;background:none;box-shadow:none;min-height:0;color:transparent}
#pdLoading.nsf-pd[hidden]{display:none}
html.pm602-hold #pdLoading.nsf-pd[hidden]{display:flex!important}
#pdLoading.nsf-pd .nsf-hero{height:auto;aspect-ratio:16/9;max-height:460px;width:100%;margin-top:10px;border-radius:12px}
.pl-grid .nsf-pl{grid-column:auto;min-height:260px;border-radius:12px}

/* ---------- 3) projects page (mobile) ---------- */
.pl-chipgrid .pl-empty{display:flex;flex-direction:column;align-items:flex-start;gap:12px;width:100%;box-sizing:border-box;line-height:1.55;overflow-wrap:anywhere}
.pl-chipgrid .pl-empty a.pl-textlink{display:inline-flex;align-items:center;max-width:100%;white-space:normal;margin:0}
@media(max-width:700px){
  .pl-section{padding:36px 0!important}
  .pl-empty{padding:18px!important}
}

/* ---------- V51.10 ---------- */
/* home page search box: "Search Property" sits level with the select boxes (was level with their labels) */
.hp13-search-grid>#hpSearchBtn{align-self:end;height:50px;min-height:50px;border-radius:8px}
/* card buttons: the same small label on hover for Call and WhatsApp */
.nsc-actions .nsc-ic{position:relative}
@media(hover:hover) and (pointer:fine){
  .nsc-actions .nsc-ic::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);background:#0b2f4f;color:#fff;font:600 11.5px/1 Inter,system-ui,sans-serif;padding:6px 8px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s}
  .nsc-actions .nsc-ic:hover::after,.nsc-actions .nsc-ic:focus-visible::after{opacity:1}
}
.nsf-callpop{position:fixed;z-index:2147483100;width:260px;max-width:calc(100vw - 24px);background:#fff;border:1px solid #e3e8ee;border-radius:12px;box-shadow:0 14px 34px rgba(11,49,84,.18);padding:14px 16px 14px;font-family:Inter,system-ui,sans-serif;color:#122431;box-sizing:border-box}
.nsf-callpop small{display:block;font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#6e7e87}
.nsf-callpop strong{display:block;font-size:21px;font-weight:800;margin:4px 0 12px;font-variant-numeric:tabular-nums}
.nsf-cp-row{display:flex;gap:8px}
.nsf-cp-row button{flex:1;border:1px solid #d4dde5;background:#fff;color:#0b2f4f;border-radius:8px;padding:9px 8px;font:600 12.5px/1.2 Inter,system-ui,sans-serif;cursor:pointer}
.nsf-cp-row .nsf-cp-cb{background:#0b2f4f;border-color:#0b2f4f;color:#fff}
.nsf-cp-x{position:absolute;top:6px;right:6px;width:28px;height:28px;border:0;background:none;font-size:20px;line-height:1;color:#6e7e87;cursor:pointer;border-radius:50%}
.nsf-cp-x:hover{background:#f1f4f6}
/* listing: "Show more" */
.ns-more{display:flex;flex-direction:column;align-items:center;gap:10px;margin:22px 0 6px;text-align:center}
.ns-more p{margin:0;color:#6e7e87;font-size:13.5px}
.ns-more .btn{min-width:240px;cursor:pointer}
