
:root{
  --navy:#1A237E;--navy-d:#0D1654;--navy-m:#283593;
  --green:#2E7D32;--green-l:#388E3C;--green-p:#E8F5E9;
  --gg:linear-gradient(135deg,#1B5E20,#2E7D32,#43A047);
  --ng:linear-gradient(145deg,#0D1654,#1A237E,#283593);
  --pearl:#F8FBF8;--pearl2:#F0F4F0;--muted:#546E7A;
  --bdr:rgba(26,35,126,0.1);
  --s1:0 2px 12px rgba(26,35,126,0.08);
  --s2:0 4px 24px rgba(26,35,126,0.13);
  --s3:0 12px 48px rgba(26,35,126,0.18);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Plus Jakarta Sans',sans-serif;background:var(--pearl);color:var(--navy-d);line-height:1.6;overflow-x:hidden}
h1,h2,h3,h4{font-family:'Plus Jakarta Sans',sans-serif;line-height:1.15}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
input,select{font-size:16px!important}
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-thumb{background:var(--green);border-radius:3px}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

/* ── HEADER ── */
.hdr{position:sticky;top:0;z-index:100;background:rgba(255,255,255,0.96);backdrop-filter:blur(18px);border-bottom:1px solid var(--bdr);box-shadow:0 1px 16px rgba(26,35,126,0.07)}
.hdr-in{max-width:1380px;margin:0 auto;padding:0 20px;display:flex;align-items:center;height:60px;gap:16px}
.logo{display:flex;align-items:center;gap:8px}
.logo-txt{font-size:22px;font-weight:700;color:var(--navy)}
.logo-txt b{color:var(--green)}
.hdr-back{display:flex;align-items:center;gap:6px;padding:7px 14px;border:1.5px solid var(--bdr);border-radius:8px;font-size:13px;font-weight:500;color:var(--navy);cursor:pointer;transition:.18s;margin-left:auto}
.hdr-back:hover{border-color:var(--green);color:var(--green);background:var(--green-p)}

/* ── PAGE HERO ── */
.page-hero{background:var(--ng);padding:32px 20px}
.page-hero-in{max-width:1380px;margin:0 auto}
.page-hero-eyebrow{font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,0.5);margin-bottom:8px;display:flex;align-items:center;gap:8px}
.page-hero-eyebrow a{color:rgba(255,255,255,0.5);transition:.18s}
.page-hero-eyebrow a:hover{color:#81C784}
.page-hero-eyebrow span{color:rgba(255,255,255,0.3)}
.page-hero-h1{font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(24px,4vw,38px);font-weight:600;color:#fff;margin-bottom:6px}
.page-hero-sub{font-size:14px;color:rgba(255,255,255,0.55)}

/* ── LAYOUT ── */
.layout{max-width:1380px;margin:28px auto;padding:0 20px;display:grid;grid-template-columns:272px 1fr;gap:24px;align-items:start}

/* ── SIDEBAR FILTERS ── */
.sf{background:#fff;border-radius:14px;border:1px solid var(--bdr);box-shadow:var(--s1);position:sticky;top:76px;overflow:hidden}
.sf-hd{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--pearl2)}
.sf-ttl{font-size:13px;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:6px}
.sf-reset{font-size:12px;font-weight:600;color:var(--green);border:1.5px solid rgba(46,125,50,0.3);background:transparent;padding:4px 10px;border-radius:20px;cursor:pointer;transition:.18s;font-family:'Plus Jakarta Sans',sans-serif}
.sf-reset:hover{background:var(--green);color:#fff}
.sf-grp{border-bottom:1px solid var(--pearl2);padding:14px 16px}
.sf-grp:last-child{border-bottom:none}
.sf-grp-ttl{font-size:10.5px;font-weight:700;color:#9BA8B5;letter-spacing:1px;text-transform:uppercase;margin-bottom:10px}
.sf-pills{display:flex;flex-wrap:wrap;gap:6px}
.sfp{padding:5px 12px;border-radius:7px;border:1.5px solid #E8ECF0;background:#F6F8FA;font-size:12.5px;font-weight:500;color:#64748B;cursor:pointer;transition:.15s;-webkit-tap-highlight-color:transparent}
.sfp:hover{border-color:var(--navy);color:var(--navy);background:var(--pearl)}
.sfp.on{border-color:var(--navy);background:var(--navy);color:#fff;font-weight:600}
/* Sort select */
.sf-select{width:100%;padding:9px 12px;border:1.5px solid #E8ECF0;border-radius:8px;background:#F6F8FA;font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;color:var(--navy-d);outline:none;cursor:pointer;transition:.18s}
.sf-select:focus{border-color:var(--green)}

/* ── MAIN CONTENT ── */
.main{}
.main-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:10px}
.main-count{font-size:13px;color:var(--muted)}
.main-count b{color:var(--navy);font-weight:700}
/* Mobile filter toggle */
.mob-filter-btn{display:none;align-items:center;gap:6px;padding:8px 16px;background:#fff;border:1.5px solid var(--bdr);border-radius:8px;font-size:13px;font-weight:600;color:var(--navy);cursor:pointer;-webkit-tap-highlight-color:transparent}
.mob-filter-btn svg{color:var(--navy)}

/* ── PROPERTY CARDS ── */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px;margin-bottom:40px}
.pc{background:#fff;border-radius:14px;overflow:hidden;box-shadow:var(--s1),0 0 0 1px var(--bdr);transition:transform .28s,box-shadow .28s;display:flex;flex-direction:column;cursor:pointer;animation:fadeUp .3s ease both}
.pc:hover{transform:translateY(-5px);box-shadow:var(--s3),0 0 0 1.5px rgba(46,125,50,0.18)}
.pc.hidden{display:none}
.ci{position:relative;height:185px;overflow:hidden;flex-shrink:0}
.ci img{width:100%;height:100%;object-fit:cover;transition:transform .45s;display:block}
.pc:hover .ci img{transform:scale(1.06)}
.b-rera{position:absolute;top:10px;left:10px;background:var(--green);color:#fff;font-size:9px;font-weight:800;letter-spacing:.8px;padding:3px 7px;border-radius:4px;text-transform:uppercase}
.b-type{position:absolute;top:10px;right:10px;background:rgba(13,22,84,0.78);backdrop-filter:blur(5px);color:#fff;font-size:11px;font-weight:500;padding:3px 9px;border-radius:4px}
.b-flag{position:absolute;bottom:10px;left:10px;background:rgba(46,125,50,0.88);color:#fff;font-size:9px;font-weight:800;letter-spacing:.5px;padding:3px 8px;border-radius:4px;text-transform:uppercase}
.cb{padding:14px 15px 0;flex:1;display:flex;flex-direction:column}
.cdev{font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:2px}
.cname{font-size:18px;font-weight:700;color:var(--navy);line-height:1.2;margin-bottom:5px}
.cloc{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--muted);margin-bottom:10px}
.cloc svg{flex-shrink:0;color:var(--green)}
.cspecs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.ctag{font-size:11px;color:var(--navy);background:var(--pearl);padding:2px 9px;border-radius:4px;font-weight:500;border:1px solid var(--bdr)}
.cprice{font-size:20px;font-weight:700;background:var(--gg);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.1}
.cpnote{font-size:11px;color:var(--muted);margin-top:2px}
.cacts{display:flex;gap:7px;padding:11px 14px;border-top:1px solid var(--pearl2);margin-top:auto}
.btn-exp{flex:1;padding:8px 0;background:var(--navy);border:none;border-radius:7px;font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:600;color:#fff;cursor:pointer;transition:.2s;text-align:center}
.btn-exp:hover{background:var(--green)}
.btn-dl{background:#fff!important;border:1.5px solid var(--green)!important;color:var(--green)!important}
.btn-dl:hover{background:var(--green-p)!important}
.btn-ico{width:34px;height:34px;border-radius:7px;border:1.5px solid #E0E7F0;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s;font-size:14px;flex-shrink:0}
.btn-ico.ph:hover{border-color:#1565C0;background:#E3F2FD}
.btn-ico.wa{background:#25D366;border-color:#25D366}
.btn-ico.wa:hover{background:#1ebe59;transform:scale(1.05)}

/* ── NO RESULTS ── */
.no-results{text-align:center;padding:60px 20px;background:#fff;border-radius:14px;border:1px dashed rgba(46,125,50,0.25)}
.no-results-ico{font-size:48px;margin-bottom:14px}
.no-results h3{font-size:22px;font-weight:700;color:var(--navy);margin-bottom:8px}
.no-results p{font-size:14px;color:var(--muted);margin-bottom:20px}
.btn-reset-lg{padding:10px 28px;background:var(--ng);border:none;border-radius:8px;font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:600;color:#fff;cursor:pointer;transition:.2s}
.btn-reset-lg:hover{background:var(--gg)}

/* ── MOBILE FILTER OVERLAY ── */
.mob-sf-ov{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,0.5);backdrop-filter:blur(4px)}
.mob-sf-ov.open{display:flex;align-items:flex-end}
.mob-sf-sheet{background:#fff;width:100%;border-radius:20px 20px 0 0;max-height:80svh;overflow-y:auto;padding-bottom:max(24px,env(safe-area-inset-bottom))}
.mob-sf-handle{width:44px;height:4px;background:#e0e4eb;border-radius:2px;margin:12px auto 0}
.mob-sf-hd{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--pearl2)}
.mob-sf-hd h3{font-size:16px;font-weight:700;color:var(--navy)}
.mob-sf-cls{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--pearl2);background:transparent;display:flex;align-items:center;justify-content:center;font-size:15px;cursor:pointer;color:var(--muted)}
.mob-sf-body{padding:4px 0 16px}

/* ── FOOTER ── */
.foot{background:var(--navy-d);padding:20px;text-align:center;margin-top:40px}
.foot p{font-size:12px;color:rgba(255,255,255,0.3)}
.foot a{color:rgba(255,255,255,0.3);transition:.18s}
.foot a:hover{color:#81C784}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .layout{grid-template-columns:1fr}
  .sf{display:none;position:static}
  .mob-filter-btn{display:flex}
  .mob-sf-ov .sf{display:block;border-radius:0;border:none;box-shadow:none;position:static}
}
@media(max-width:640px){
  .hdr-in{height:56px;padding:0 14px}
  .logo-txt{font-size:20px}
  .page-hero{padding:24px 14px}
  .layout{margin:16px auto;padding:0 14px;gap:16px}
  .pgrid{grid-template-columns:1fr;gap:14px}
  .main-bar{flex-direction:column;align-items:flex-start}
}
@media(min-width:400px) and (max-width:640px){
  .pgrid{grid-template-columns:repeat(2,1fr)}
  .ci{height:145px}
  .cname{font-size:15px}
  .cprice{font-size:16px}
  .cacts{gap:5px;padding:9px 10px}
  .btn-exp{font-size:12px}
  .btn-ico{width:30px;height:30px}
}
