/* ============================================================
   LeakProof Solutions — Responsive CSS
   ============================================================ */

/* ── Large Desktops (≥1400px) ────────────────────────────── */
@media (min-width: 1400px) {
    .hero-title { font-size: 4rem; }
    .container { max-width: 1320px; }
}

/* ── Desktops (≥1200px) ──────────────────────────────────── */
@media (min-width: 1200px) {
    .hero-section { min-height: 100vh; }
}

/* ── Tablets & Below (≤991px) ────────────────────────────── */
@media (max-width: 991.98px) {

    :root { --section-pad: 64px; }

    /* Navbar */
    #mainNavbar .navbar-nav {
        padding: 14px 0;
        gap: 2px;
    }
    .btn-quote {
        margin: 8px 0 0 !important;
        width: fit-content;
    }

    /* Hero */
    .hero-section { padding: 100px 0 90px; text-align: center; }
    .hero-subtitle { margin: 0 auto 32px; }
    .hero-stats { justify-content: center; }
    .hero-visual { margin-top: 40px; }
    .hero-badge-float.top-left  { top: -12px; left: 0; }
    .hero-badge-float.bot-right { bottom: -12px; right: 0; }

    /* About */
    .about-img-wrapper { margin-bottom: 48px; }
    .about-experience-badge { right: 10px; }

    /* Stats */
    .stat-divider { display: none; }
    .stat-item { padding: 24px 16px; }

    /* Timeline */
    .timeline-wrap::before { left: 28px; }

    /* Contact */
    .contact-form-card { padding: 32px; }
    .contact-info-card { padding: 32px; margin-top: 32px; }

    /* Footer */
    .footer { padding: 56px 0 0; }
    .footer-col { margin-bottom: 36px; }
}

/* ── Mobile Landscape (≤767px) ───────────────────────────── */
@media (max-width: 767.98px) {

    :root { --section-pad: 50px; }

    /* Top bar */
    .top-bar .top-bar-address { display: none; }
    .top-bar { text-align: center; }

    /* Navbar brand */
    .navbar-brand img { height: 40px; }
    .navbar-brand .brand-name { font-size: 1.1rem; }

    /* Hero */
    .hero-title { font-size: clamp(1.8rem, 7vw, 2.6rem); }
    .hero-subtitle { font-size: 1rem; }
    .hero-buttons { display: flex; flex-direction: column; align-items: center; gap: 12px; }
    .hero-buttons .btn-primary-custom,
    .hero-buttons .btn-outline-custom { width: 100%; max-width: 280px; justify-content: center; }
    .hero-stats { gap: 20px; }
    .hero-stat-num { font-size: 1.5rem; }
    .hero-badge-float { display: none; }

    /* Page banner */
    .page-banner { padding: 100px 0 56px; text-align: center; }
    .page-banner .breadcrumb { justify-content: center; }

    /* Section headings */
    .section-subtitle { font-size: 0.9rem; }

    /* Services */
    .service-card { padding: 28px 22px; }

    /* Stats */
    .stat-item .counter-number { font-size: 2.2rem; }

    /* Timeline */
    .timeline-step { gap: 16px; }
    .timeline-icon { width: 48px; height: 48px; min-width: 48px; font-size: 1.1rem; }

    /* Testimonials */
    .testimonial-card { margin: 8px 0 24px; padding: 28px 24px; }
    #testimonialCarousel .carousel-control-prev { left: 0; }
    #testimonialCarousel .carousel-control-next { right: 0; }

    /* CTA */
    .cta-section { text-align: center; }
    .cta-section .d-flex { justify-content: center !important; }

    /* Contact form */
    .contact-form-card { padding: 24px 20px; }

    /* Footer */
    .footer-bottom { text-align: center; }
    .footer-bottom .d-flex { flex-direction: column; gap: 8px; align-items: center !important; }
}

/* ── Small Phones (≤575px) ───────────────────────────────── */
@media (max-width: 575.98px) {

    /* Hero stats — 2 per row */
    .hero-stats { flex-wrap: wrap; }
    .hero-stats > div { flex: 0 0 45%; }

    /* Why choose us — single column */
    .why-card { margin-bottom: 8px; }

    /* Stats 2-col grid */
    .stats-row .col-6 { border-bottom: 1px solid rgba(255,255,255,0.1); }

    /* About experience badge — reposition */
    .about-experience-badge { position: static; display: inline-block; margin-top: 16px; border-radius: var(--radius); }

    /* Service detail cards */
    .service-detail-img { height: 160px; }

    /* Back to top */
    #backToTop { bottom: 20px; right: 16px; width: 40px; height: 40px; font-size: 0.9rem; }

    /* FAQ */
    .faq-accordion .accordion-button { font-size: 0.88rem; }

    /* Contact info card */
    .contact-info-card { padding: 24px 20px; }

    /* Hero badge float */
    .hero-img-placeholder { font-size: 4rem; }
}

/* ── Print ───────────────────────────────────────────────── */
@media print {
    .top-bar, #mainNavbar, .cta-section, .footer, #backToTop { display: none !important; }
    body { font-size: 12pt; }
}