/* ── Responsive ────────────────────────────────────────── */

@media (max-width: 820px) {
    :root { --max-width: 100%; }

    .main-title, .under-logo, .nav-wrapper { border-radius: 0; }
    .main-title {
        margin-top: 0 !important;
        padding: 14px 18px;
    }
    .main-logo { max-height: 150px; }
    .nav-wrapper { margin-bottom: 0; overflow: hidden; }

    .home-hero   { border-radius: 0; border-left: none; border-right: none; }
    .home-cards  { border-left: none; border-right: none; }
    .home-services { border-radius: 0; border-left: none; border-right: none; }
    .service-area-panel { border-left: none; border-right: none; border-radius: 0; }

    .page-header { border-radius: 0; }
    .about-cta, .tips-cta { border-radius: 0; border-left: none; border-right: none; }
    .facebook-review-section { border-radius: 0; border-left: none; border-right: none; }

    .site-footer { border-radius: 0; }

    .footer-grid { grid-template-columns: 1fr 1fr; }

    .footer-col:first-child {
        grid-column: 1 / -1;
        border-right: none;
        border-bottom: 1px solid var(--border-color);
        padding-bottom: 20px;
    }

    .footer-col:nth-child(2) { border-bottom: none; }
}

@media (max-width: 640px) {
    html { font-size: 13px; }

    .tips-grid { grid-template-columns: 1fr; }
    .google-review-grid { grid-template-columns: 1fr; }
    .facebook-review-grid { grid-template-columns: 1fr; }
    .service-area-columns { grid-template-columns: 1fr; }
    .service-area-group + .service-area-group { border-left: none; border-top: 1px solid var(--border-color); }
    .service-area-group .home-services { justify-content: center; }
    .service-area-group h3 { text-align: center; }

    .home-cards { grid-template-columns: 1fr; }
    .home-card:first-child { border-right: none; border-bottom: 1px solid var(--border-color); }
    .home-card-img { height: 220px; }

    .team-card { flex-direction: column; align-items: center; text-align: center; }
    .team-name-row { justify-content: center; }

    .footer-grid { grid-template-columns: 1fr; }
    .footer-col { border-right: none; border-bottom: 1px solid var(--border-color); }
    .footer-col:last-child { border-bottom: none; }

    .home-hero-actions { flex-direction: column; align-items: stretch; }
    .hero-btn-primary, .hero-btn-secondary { width: 100%; justify-content: center; text-align: center; }
}

@media (max-width: 480px) {
    /* Header */
    .main-title { padding: 12px 14px; }
    .main-logo { max-height: 118px; }

    .under-logo { padding: 9px 16px; gap: 4px; }

    .tagline1 { font-size: 0.82em; letter-spacing: 0.1px; line-height: 1.25; }
    .tagline2 { font-size: 0.9em; letter-spacing: 0.4px; }

    .navbar-toggler {
        margin: 0 !important;
        width: 100% !important;
        border-radius: 0 !important;
        border-left: none !important;
        border-right: none !important;
        border-top: 1px solid var(--border-color) !important;
        border-bottom: 2px solid var(--main-color) !important;
        height: 52px !important;
        background: #12110f !important;
        border-bottom: 3px solid var(--main-color) !important;
    }

    /* Mobile nav menu */
    .nav-content {
        padding: 0;
        background: #16150e;
        border-top: none;
    }
    .navbar-nav { flex-direction: column !important; padding: 0; }
    .nav-link {
        font-size: 1.05em !important;
        font-weight: 600 !important;
        letter-spacing: 0.2px;
        padding: 17px 22px !important;
        border-radius: 0 !important;
        border-bottom: 1px solid var(--border-color) !important;
        border-left: 3px solid transparent !important;
        gap: 14px !important;
        display: flex !important;
        align-items: center !important;
        transition: background 0.15s, color 0.15s, border-left-color 0.15s !important;
    }
    .nav-link i { font-size: 1em; width: 18px; text-align: center; }
    .nav-link:hover {
        background: rgba(250,106,41,.09) !important;
        color: var(--main-color) !important;
        border-left-color: var(--main-color) !important;
    }
    .nav-active, .nav-link.active {
        color: var(--main-color) !important;
        background: rgba(250,106,41,.07) !important;
        border-bottom: 2px solid var(--border-color) !important;
        border-left: 3px solid var(--main-color) !important;
        padding-left: 25px !important;
    }
    .navbar-nav .nav-item:last-child .nav-link { border-bottom: none !important; }
    .services-dropdown-menu {
        position: static !important;
        transform: none !important;
        width: 100%;
        border: none;
        border-bottom: 1px solid var(--border-color);
        border-radius: 0;
        box-shadow: none;
        padding: 0;
        background: #11100f;
    }
    .services-dropdown-menu .dropdown-item {
        padding: 14px 22px 14px 54px;
        border-radius: 0;
        border-bottom: 1px solid var(--border-color);
        font-size: 0.96em;
    }
    .services-dropdown-menu .dropdown-item:last-child { border-bottom: none; }

    /* Hero */
    .home-hero { padding: 28px 18px 24px; }
    .home-hero-heading { font-size: 1.5em !important; }
    .home-hero-sub { font-size: 0.9em; margin-bottom: 20px; }
    .hero-btn-primary, .hero-btn-secondary { padding: 13px 20px; font-size: 0.95em; }

    /* Cards */
    .home-card-img { height: 200px; }
    .home-card-label { font-size: 1.1em; }

    /* Service badges */
    .home-services { gap: 8px; padding: 12px 10px; }
    .service-badge { font-size: 0.8em; padding: 6px 12px; }

    /* Pages */
    .page-header { padding: 14px 18px; }
    .page-header h1 {
        font-size: 1.28em !important;
        line-height: 1.25;
        gap: 8px;
    }
    .about-intro {
        flex-direction: column;
        padding: 20px 18px;
        font-size: 0.96em;
        line-height: 1.55;
    }
    .about-intro-icon { width: 48px; }
    .tip-card { padding: 18px; }
    .tip-icon {
        width: 38px;
        height: 38px;
        font-size: 1em;
        margin-bottom: 10px;
    }
    .tip-card h3 {
        font-size: 0.95em !important;
        line-height: 1.3;
    }
    .tip-card p {
        font-size: 0.86em;
        line-height: 1.5;
    }
    .tips-intro { padding: 20px 18px; }
    .tips-intro h2 { font-size: 1.05em !important; }
    .tips-intro p { font-size: 0.92em; line-height: 1.55; }
    .request-card { border-radius: 0; border-left: none; border-right: none; }
    .request-card-body { padding: 18px; }
    .request-card-header { padding: 18px; border-radius: 0; }
    .review-btn-row { flex-direction: column; align-items: center; }
    .review-btn { width: 100%; justify-content: center; }
    .facebook-review-section { padding: 22px 14px; }
    .facebook-review-card { padding: 10px; }
    .footer-bottom { flex-direction: column; gap: 4px; text-align: center; }
}

@media (max-width: 360px) {
    .tagline1 { display: none; }
    .tagline2 { font-size: 0.9em; }
    .home-hero-heading { font-size: 1.3em !important; }
}
