:root{
  --navy:#0f2540;
  --navy-dark:#0a1a2e;
  --blue:#1d6feb;
  --blue-dark:#1557bf;
  --green:#25d366;
  --orange:#f0883e;
  --purple:#8b5cf6;
  --bg-soft:#f5f8fc;
  --radius:14px;
}
*{box-sizing:border-box}
body{
  font-family:'Poppins',sans-serif;
  color:var(--navy);
  background:#fff;
  overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6{font-weight:700;color:var(--navy)}
a{text-decoration:none}

/* Top bar */
.top-bar{background:var(--navy-dark);color:#fff}

/* Navbar */
.main-navbar{padding:.6rem 0}
.brand-text{font-size:1.4rem;font-weight:800;color:var(--navy)}
.nav-link{font-weight:500;color:var(--navy)!important;margin:0 .3rem}
.nav-link.active,.nav-link:hover{color:var(--blue)!important}

.btn-whatsapp{background:var(--green);color:#fff!important;border-radius:50px;font-weight:600;padding:.5rem 1.1rem}
.btn-whatsapp:hover{background:#1eb857;color:#fff!important}

.btn-primary{background:var(--blue);border-color:var(--blue);font-weight:600;border-radius:8px}
.btn-primary:hover{background:var(--blue-dark);border-color:var(--blue-dark)}
.btn-outline-primary{color:var(--blue);border-color:var(--blue);font-weight:600;border-radius:8px}
.btn-outline-primary:hover{background:var(--blue);border-color:var(--blue)}
.btn-danger{border-radius:8px;font-weight:600}

/* Hero */
.hero-section{
  background:linear-gradient(135deg,var(--navy-dark) 0%,var(--navy) 55%,#163a63 100%);
  color:#fff;padding:6rem 0 8rem;position:relative;overflow:hidden;
}
.hero-section::after{
  content:'';position:absolute;right:-100px;top:-100px;width:500px;height:500px;
  background:radial-gradient(circle,rgba(29,111,235,.35) 0%,transparent 70%);
}
.hero-section h1{color:#fff;font-size:3rem;font-weight:800}
.hero-section p.lead{color:#cfe0f5;font-size:1.15rem}
.hero-cta .btn{border-radius:50px;padding:.75rem 1.6rem;font-weight:600;margin:.25rem}
.hero-search-card{
  background:#fff;border-radius:var(--radius);padding:1.5rem;
  box-shadow:0 20px 50px rgba(0,0,0,.25);margin-top:-4rem;position:relative;z-index:5;
}

/* Section titles */
.section-title{font-size:2rem;margin-bottom:.5rem}
.section-sub{color:#6b7a90;max-width:620px;margin:0 auto}
.section-pad{padding:5rem 0}
.bg-soft{background:var(--bg-soft)}

/* Property cards */
.property-card{
  border:none;border-radius:var(--radius);overflow:hidden;
  box-shadow:0 6px 24px rgba(15,37,64,.08);transition:.25s;height:100%;
  background:#fff;
}
.property-card:hover{transform:translateY(-6px);box-shadow:0 16px 36px rgba(15,37,64,.16)}
.property-card .img-wrap{position:relative;height:220px;overflow:hidden}
.property-card .img-wrap img{width:100%;height:100%;object-fit:cover;transition:.4s}
.property-card:hover .img-wrap img{transform:scale(1.08)}
.badge-category{position:absolute;top:12px;left:12px;padding:.4rem .8rem;border-radius:50px;font-weight:600;font-size:.75rem;text-transform:uppercase}
.badge-buy{background:var(--blue);color:#fff}
.badge-sell{background:var(--orange);color:#fff}
.badge-rent{background:var(--purple);color:#fff}
.property-card .price-tag{color:var(--blue);font-weight:700;font-size:1.15rem}
.property-card .meta-row{color:#6b7a90;font-size:.85rem}
.property-card .meta-row i{color:var(--blue);width:18px}

/* About / why choose */
.icon-box{
  width:64px;height:64px;border-radius:16px;background:rgba(29,111,235,.1);
  display:flex;align-items:center;justify-content:center;font-size:1.6rem;color:var(--blue);margin-bottom:1rem;
}
.why-card{padding:1.75rem;border-radius:var(--radius);background:#fff;box-shadow:0 6px 20px rgba(15,37,64,.06);height:100%}

/* CTA */
.cta-section{background:linear-gradient(120deg,var(--blue) 0%,#1a4fb0 100%);color:#fff;border-radius:var(--radius);padding:3.5rem;text-align:center}

/* Footer */
.site-footer{background:var(--navy-dark);color:#cfd8e3}
.footer-links li{margin-bottom:.6rem}
.footer-links a{color:#a9b8cc}
.footer-links a:hover{color:#fff}
.footer-social-icon{display:inline-flex;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);align-items:center;justify-content:center;color:#fff;margin-right:.5rem}
.footer-social-icon:hover{background:var(--blue)}

/* WhatsApp float */
.whatsapp-float{
  position:fixed;bottom:24px;right:24px;background:var(--green);color:#fff;
  width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:1.7rem;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:1000;
}
.whatsapp-float:hover{color:#fff;transform:scale(1.08)}

/* Filter bar */
.filter-card{background:#fff;border-radius:var(--radius);padding:1.5rem;box-shadow:0 6px 24px rgba(15,37,64,.08)}

/* Property details */
.gallery-main img{width:100%;border-radius:var(--radius);height:420px;object-fit:cover}
.gallery-thumbs img{width:100%;height:90px;object-fit:cover;border-radius:10px;cursor:pointer;opacity:.7}
.gallery-thumbs img:hover,.gallery-thumbs img.active{opacity:1;outline:3px solid var(--blue)}
.detail-info-box{background:var(--bg-soft);border-radius:var(--radius);padding:1.5rem}
.amenity-pill{background:var(--bg-soft);border-radius:50px;padding:.5rem 1rem;display:inline-flex;align-items:center;font-size:.88rem;margin:.25rem}
.amenity-pill i{color:var(--blue);margin-right:.5rem}

/* Bootstrap color extensions */
.bg-purple{background:var(--purple)!important}
.bg-orange{background:var(--orange)!important}

/* Pagination */
.pagination .page-link{border-radius:8px;margin:0 3px;color:var(--navy)}
.pagination .page-item.active .page-link{background:var(--blue);border-color:var(--blue)}

/* Breadcrumb hero (inner pages) */
.page-hero{background:linear-gradient(120deg,var(--navy-dark),var(--navy));color:#fff;padding:3.5rem 0;text-align:center}
.page-hero h1{color:#fff;font-size:2.3rem}

/* Contact page */
.contact-info-item{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1.5rem}
.contact-info-item .icon-box{margin-bottom:0;flex-shrink:0}

/* Forms */
.form-control,.form-select{border-radius:8px;padding:.6rem .9rem;border-color:#dde5ef}
.form-control:focus,.form-select:focus{border-color:var(--blue);box-shadow:0 0 0 .2rem rgba(29,111,235,.15)}

@media (max-width:767px){
  .hero-section{padding:3.5rem 0 5rem}
  .hero-section h1{font-size:2.1rem}
  .hero-search-card{margin-top:-2.5rem}
  .section-pad{padding:3rem 0}
  .cta-section{padding:2rem}
}