/* ============================================
   Savlee Vibhav Estate - Responsive CSS
   Mobile First Design for all pages
   ============================================ */

/* ---- Global Fixes ---- */
*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: hidden; max-width: 100%; }
img { max-width: 100%; height: auto; }

/* ---- Navbar ---- */
.navbar-brand img { height: 45px !important; }
.navbar .nav-link { font-size: 15px; }

/* ---- Back-to-top & Floating Buttons ---- */
.back-to-top { right: 15px; bottom: 15px; }
.floating-whatsapp, .floating-call { right: 10px; width: 48px !important; height: 48px !important; font-size: 20px !important; }
.floating-whatsapp { bottom: 15px; }
.floating-call { bottom: 75px; }

/* ---- Lead Hero Section ---- */
.lead-hero { padding: 60px 0; }
.lead-hero h1 { font-size: 36px; }

/* ---- Customer Enquiry Form ---- */
.form-card { padding: 20px; border-radius: 10px; }

/* ---- Tables ---- */
table { width: 100%; overflow-x: auto; display: block; }

/* ---- Search Bar ---- */
.search-bar { flex-wrap: wrap; gap: 10px; }
.search-bar input, .search-bar select { width: 100%; }

/* ============================================
   Tablet Styles (max-width: 991px)
   ============================================ */
@media (max-width: 991px) {
  /* Navbar */
  .navbar-collapse { background: #fff; padding: 15px; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,.1); }
  .navbar-nav .nav-link { padding: 8px 15px !important; border-bottom: 1px solid #f0f0f0; }
  .navbar-nav .nav-link:last-child { border-bottom: none; }
  .dropdown-menu { box-shadow: none; border: none; padding-left: 15px; }

  /* Hero sections */
  .hero-grid { grid-template-columns: 1fr !important; }
  .hero { padding: 60px 0 !important; }
  .hero h1 { font-size: 32px !important; }

  /* Cards grid */
  .cards { grid-template-columns: repeat(2, 1fr) !important; }
  .features-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* Lead hero */
  .lead-hero { min-height: auto !important; }
  .lead-hero h1 { font-size: 32px !important; }

  /* Topbar */
  .topbar .container { flex-direction: column; gap: 8px; text-align: center; }

  /* Property listing */
  .property-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* Form card */
  .form-card { padding: 25px !important; }

  /* Section padding */
  section { padding: 40px 0 !important; }

  /* Image responsiveness */
  .about-img, .service-img { width: 100% !important; height: auto !important; }

  /* Search filters */
  .search-wrap { flex-direction: column; }
  .search-wrap select, .search-wrap input, .search-wrap button { width: 100% !important; border-radius: 8px !important; }
}

/* ============================================
   Mobile Styles (max-width: 767px)
   ============================================ */
@media (max-width: 767px) {
  /* Body */
  body { font-size: 15px; }

  /* Navbar */
  .navbar { padding: 8px 15px !important; }
  .navbar-brand img { height: 40px !important; }

  /* Hero */
  .hero { text-align: center; padding: 50px 15px !important; }
  .hero h1, .lead-hero h1 { font-size: 26px !important; }
  .hero p { font-size: 15px; }
  .hero .btn { width: 100%; max-width: 280px; }

  /* Cards */
  .cards { grid-template-columns: 1fr !important; }
  .features-grid { grid-template-columns: 1fr !important; }
  .property-grid { grid-template-columns: 1fr !important; }

  /* Service cards */
  .row.g-4 .col-lg-4, .row.g-4 .col-md-6 { margin-bottom: 15px; }

  /* Section headings */
  h1 { font-size: 26px !important; }
  h2 { font-size: 22px !important; }
  h3 { font-size: 18px !important; }
  .section-title { font-size: 22px !important; }

  /* Form card - enquiry form */
  .form-card { padding: 15px !important; border-radius: 8px !important; }
  .form-card h3 { font-size: 18px !important; }

  /* Enquiry form fields */
  .row.mb-3 [class*="col-"] { margin-bottom: 10px; }
  input, select, textarea { font-size: 15px !important; }
  .btn-lg { padding: 10px 16px !important; font-size: 16px !important; }

  /* Consent accordion */
  .accordion-button { font-size: 14px !important; padding: 10px 12px !important; }
  .accordion-body { font-size: 13px !important; }
  .form-check-label { font-size: 13px !important; }

  /* Gallery */
  .gallery-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }

  /* Contact section */
  .contact-info { margin-bottom: 20px; }

  /* Topbar */
  .topbar { display: none; }

  /* Floating buttons */
  .floating-whatsapp { right: 10px; bottom: 10px; width: 45px !important; height: 45px !important; }
  .floating-call { right: 10px; bottom: 65px; width: 45px !important; height: 45px !important; }

  /* Lead badge */
  .lead-badge { font-size: 12px; padding: 5px 10px; }

  /* Lead features */
  .lead-features .item { padding: 15px !important; }

  /* Back to top */
  .back-to-top { right: 10px; bottom: 80px; }

  /* Search bar orange strip */
  .bg-secondary.py-3 .row { flex-direction: column; }
  .bg-secondary.py-3 select, .bg-secondary.py-3 input { width: 100% !important; margin-bottom: 10px; }
  .bg-secondary.py-3 .btn { width: 100%; }

  /* Fix overflow on any fixed-width elements */
  .container-fluid { padding-left: 15px !important; padding-right: 15px !important; }
  [style*="width:1200px"], [style*="width: 1200px"] { width: 100% !important; }
  .min-vh-100 { min-height: auto !important; }

  /* Property agent page */
  .agent-card { text-align: center; }
  .agent-card img { margin: 0 auto 15px; display: block; }

  /* Table responsive */
  .table-responsive { overflow-x: auto; }
}

/* ============================================
   Small Mobile Styles (max-width: 480px)
   ============================================ */
@media (max-width: 480px) {
  h1 { font-size: 22px !important; }
  h2 { font-size: 19px !important; }
  .form-card { padding: 12px !important; }
  .btn { font-size: 14px !important; }
  .gallery-grid { grid-template-columns: 1fr !important; }
  .navbar-brand img { height: 35px !important; }
  .hero h1 { font-size: 21px !important; }
  .lead-hero h1 { font-size: 22px !important; }
  .accordion-button { font-size: 13px !important; }

  /* Enquiry form logo */
  .text-center img { max-width: 80px !important; }

  /* Full-width columns on tiny screens */
  .col-sm-6, .col-md-4, .col-md-3, .col-lg-3, .col-lg-4 { width: 100% !important; }
}

/* ============================================
   Print / Accessibility
   ============================================ */
@media print {
  .topbar, .navbar, .back-to-top, .floating-whatsapp, .floating-call { display: none !important; }
}