/* Shared mobile-first safeguards for rooms pages */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

img,
video,
iframe,
svg {
    max-width: 100%;
    height: auto;
}

@media (max-width: 768px) {
    body {
        font-size: 16px;
        line-height: 1.6;
    }

    nav,
    .main-nav,
    .nav-container {
        width: 100%;
        max-width: 100%;
    }

    nav,
    .main-nav {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .nav-container {
        gap: 0.75rem !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .nav-links {
        display: none !important;
    }

    .nav-logo img,
    .nav-logo-img {
        max-height: 30px !important;
        width: auto;
    }

    .nav-cta {
        max-width: 46vw;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .hero,
    .page-hero {
        min-height: auto !important;
        padding: 5.5rem 1rem 2.5rem !important;
    }

    .hero-content,
    .hero-inner,
    .section-content,
    .content-wrap,
    .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .features-grid,
    .features-grid.compact,
    .rooms-grid,
    [class*="features-grid"] {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }

    .feature-card,
    .content-block,
    .comparison-block,
    .cta-section,
    .hero-card,
    .detail-card {
        padding: 1.25rem !important;
    }

    .hero-actions,
    .hero-cta-group,
    .hero-buttons,
    .cta-group {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 0.75rem !important;
    }

    .hero-actions a,
    .hero-cta-group a,
    .hero-buttons a,
    .cta-group a,
    .hero-actions .cta-button,
    .hero-cta-group .cta-button,
    .hero-buttons .cta-button,
    .cta-group .cta-button {
        width: 100% !important;
        max-width: 320px;
        justify-content: center;
    }

    .hero-title,
    .page-hero h1,
    h1 {
        line-height: 1.2 !important;
        word-break: break-word;
        font-size: clamp(1.8rem, 7.8vw, 2.6rem) !important;
    }

    .hero-sub,
    .hero-tagline,
    .hero-desc,
    .page-hero p,
    p {
        word-wrap: break-word;
    }

    .feature-card > div[style*="width: 140px"],
    .feature-card > div[style*="width:140px"] {
        width: 96px !important;
        height: 96px !important;
        margin-bottom: 1.25rem !important;
    }

    .feature-card h2[style*="font-size"],
    .feature-card h3[style*="font-size"] {
        font-size: clamp(1.4rem, 6.2vw, 1.9rem) !important;
    }

    [style*="max-width: 800px"],
    [style*="max-width:800px"] {
        max-width: 100% !important;
    }
}