.mobile-menu-toggle,
.site-nav [data-mobile-only] {
    display: none;
}

@media (max-width: 768px) {
    html { scroll-padding-top: 88px; }
    .site-nav {
        height: 72px;
        padding-right: max(5%, env(safe-area-inset-right));
        padding-left: max(5%, env(safe-area-inset-left));
        justify-content: space-between;
        z-index: 1000;
    }
    body > .site-nav { position: fixed; top: 0; left: 0; width: 100%; }
    .site-nav .logo-container { min-width: 0; }
    .site-nav .logo-img { height: 40px; }
    .site-nav .logo-text { font-size: 1rem; }
    .site-nav.mobile-ready .mobile-menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 48px;
        width: 48px;
        height: 48px;
        padding: 12px;
        border: 1px solid rgba(0, 0, 0, 0.35);
        border-radius: 8px;
        background: transparent;
        color: #000;
        cursor: pointer;
        touch-action: manipulation;
    }
    .mobile-menu-icon { display: grid; gap: 5px; width: 22px; }
    .mobile-menu-icon span {
        display: block;
        width: 22px;
        height: 2px;
        border-radius: 2px;
        background: currentColor;
        transition: transform 180ms ease, opacity 180ms ease;
    }
    .mobile-menu-open .mobile-menu-icon span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .mobile-menu-open .mobile-menu-icon span:nth-child(2) { opacity: 0; }
    .mobile-menu-open .mobile-menu-icon span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
    .site-nav .nav-links {
        display: flex;
        flex-direction: column;
        gap: 4px;
        width: 100%;
        margin: 0;
        padding: 12px 5% 16px;
        list-style: none;
        text-align: left;
        background: #ffcc00;
    }
    .site-nav.mobile-ready .nav-links {
        position: absolute;
        top: 100%;
        left: 0;
        border-top: 1px solid rgba(0, 0, 0, 0.15);
        border-bottom: 2px solid #000;
        box-shadow: 0 16px 24px rgba(0, 0, 0, 0.2);
        max-height: calc(100vh - 72px);
        max-height: calc(100dvh - 72px);
        overflow-y: auto;
        overscroll-behavior: contain;
        padding-bottom: max(16px, env(safe-area-inset-bottom));
    }
    .site-nav .nav-links[hidden] { display: none; }
    .site-nav .nav-links a {
        display: flex;
        align-items: center;
        min-height: 48px;
        padding: 12px 14px;
        border-radius: 6px;
        color: #000;
        text-decoration: none;
        font-size: 1rem;
        line-height: 1.4;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.025em;
        overflow-wrap: anywhere;
        touch-action: manipulation;
    }
    .site-nav .nav-links a::after { content: none; }
    .site-nav .nav-links a:hover { background: rgba(0, 0, 0, 0.08); }
    .site-nav .nav-links a:focus-visible,
    .mobile-menu-toggle:focus-visible { outline: 3px solid #000; outline-offset: 2px; }
    .site-nav:not(.mobile-ready) { position: relative; height: auto; min-height: 72px; flex-wrap: wrap; padding-top: 12px; }
    .site-nav:not(.mobile-ready) .nav-links { padding: 12px 0; }
    .site-nav:not(.mobile-ready) ~ .hero { margin-top: 0; }
    .hero {
        margin-top: 72px;
        height: auto;
        min-height: calc(100vh - 72px);
        min-height: calc(100svh - 72px);
        padding-top: 36px;
        padding-bottom: 36px;
    }
    .hero-text-content { max-width: 100%; }
    section { padding: 56px 5%; }
    .hero { padding-top: 36px; padding-bottom: 36px; }
    .highlight-text { font-size: clamp(1.8rem, 7.8vw, 3.5rem); overflow-wrap: anywhere; }
    .hero-btn { min-width: 0; min-height: 48px; }
    .decarb-list { grid-template-columns: minmax(0, 1fr); }
    .decarb-header h2 { overflow-wrap: anywhere; max-width: 100%; }
    .decarb-images img { max-width: 100%; height: auto; max-height: 160px; }
    .highlight-box { max-width: 100%; padding: 20px; overflow-wrap: anywhere; }
    .service-card { min-width: 0; max-width: 100%; }
    .map-container { height: 350px; }
    .fb-contact { max-width: 100%; text-align: left; }
    .fb-contact span { min-width: 0; overflow-wrap: anywhere; }
    .footer-legal a { display: inline-flex; align-items: center; min-height: 44px; }
    .close-lb { min-width: 48px; min-height: 48px; top: max(12px, env(safe-area-inset-top)); right: max(12px, env(safe-area-inset-right)); }
    .arrow-btn { width: 44px; height: 44px; }
    #lightbox-img { max-height: 72vh; max-height: 72dvh; }
    #lb-counter { max-width: calc(100% - 24px); bottom: max(20px, env(safe-area-inset-bottom)); text-align: center; }
    body > .container { width: calc(100% - 24px); margin: 96px auto 24px; padding: 24px 20px; }
    body > .container h1 { max-width: 100%; padding: 10px 14px; font-size: clamp(1.4rem, 5.5vw, 2rem); line-height: 1.35; overflow-wrap: anywhere; }
    body > .container p, body > .container li { overflow-wrap: anywhere; }
    body > .container .back-btn { min-height: 48px; }
}

@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .mobile-menu-icon span { transition: none; }
}