/* ==========================================================================
   NETHU PRIYAA HOME — RESPONSIVE MEDIA QUERIES
   Pixel-level layout adjustments across 320px - 1920px+
   ========================================================================== */

/* Large Desktop Displays (1440px +) */
@media (min-width: 1440px) {
    .container {
        max-width: 1360px;
    }
}

/* Standard Desktop to Laptop (1025px - 1280px) */
@media (max-width: 1280px) {
    .nav-menu {
        gap: 14px;
    }
    .nav-link {
        font-size: 0.875rem;
    }
    .footer-grid {
        gap: 32px;
    }
}

/* Tablet Landscape & Small Laptop (max-width: 1180px) */
/* Tablet & Mobile Slide-out Right-to-Left Drawer (75% Width) */
@media (max-width: 1180px) {
    .nav-menu {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        left: auto !important;
        width: 75% !important;
        max-width: 320px !important;
        height: 100vh !important;
        height: 100dvh !important;
        background-color: #ffffff !important;
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 80px 24px 32px 24px !important;
        border-left: 1.5px solid #ebdcc9 !important;
        border-bottom: none !important;
        box-shadow: -10px 0 36px rgba(14, 46, 30, 0.2) !important;
        transform: translateX(100%) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease, visibility 0.25s ease !important;
        gap: 8px !important;
        z-index: 999999 !important;
        overflow-y: auto !important;
    }

    .nav-menu.active {
        transform: translateX(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .nav-link {
        font-size: 1.05rem !important;
        font-weight: 600 !important;
        color: #1b382b !important;
        padding: 12px 16px !important;
        border-radius: 12px !important;
        display: block !important;
        transition: all 0.2s ease !important;
    }

    .nav-link:hover, .nav-link.active {
        background-color: #f7f2ea !important;
        color: #b88a44 !important;
        padding-left: 20px !important;
    }

    .mobile-menu-toggle {
        display: block;
        z-index: 1000000 !important;
        position: relative !important;
    }

    .header-cta .btn {
        display: none;
    }

    .trust-card-group {
        grid-template-columns: 1fr;
    }
}

/* Mobile Devices & Small Screens (max-width: 767px) */
@media (max-width: 767px) {
    .top-bar {
        display: none;
    }

    /* Mobile Sticky Top Header — Zero Cut-off, Zero White Space */
    .site-header {
        position: sticky !important;
        position: -webkit-sticky !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 68px !important;
        background-color: #ffffff !important;
        border-bottom: 1.5px solid #ebdcc9 !important;
        box-shadow: 0 4px 16px rgba(14, 46, 30, 0.08) !important;
        z-index: 999999 !important;
        overflow: visible !important;
    }

    .header-container {
        height: 68px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .brand-logo {
        display: flex !important;
        align-items: center !important;
        height: 100% !important;
    }

    .brand-logo img {
        height: 42px !important;
        max-height: 42px !important;
        width: auto !important;
        object-fit: contain !important;
    }

    .header-cta {
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        height: 100% !important;
    }

    .btn-schedule-visit {
        padding: 7px 13px !important;
        font-size: 0.76rem !important;
        font-weight: 700 !important;
        border-radius: 9999px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 34px !important;
        box-sizing: border-box !important;
    }

    .mobile-menu-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 6px !important;
        margin: 0 !important;
        height: 40px !important;
        width: 40px !important;
    }

    main,
    #main-content,
    .hero-editorial,
    .page-banner,
    .contact-hero-section,
    .site-main {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 0;
    }

    .hero-editorial {
        padding-top: 32px;
        padding-bottom: 50px;
        overflow: hidden;
        width: 100%;
        max-width: 100%;
        background-position: 72% center !important;
        background-size: cover !important;
        background-image: linear-gradient(180deg, rgba(10, 24, 16, 0.88) 0%, rgba(10, 24, 16, 0.68) 60%, rgba(10, 24, 16, 0.45) 100%), url('../images/gallery/banner_image.png') !important;
    }

    .hero-title {
        font-size: 1.85rem;
    }

    .hero-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .btn-hero-primary,
    .btn-hero-glass {
        width: 100%;
        text-align: center;
        justify-content: center;
    }

    /* Mobile Hero Trust Strip Scaling — Strict Vertical Stack */
    .hero-trust-strip {
        padding: 16px 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .hero-trust-grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 4px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .hero-trust-item {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        justify-content: center !important;
        padding: 0 2px !important;
        gap: 4px !important;
    }

    .hero-trust-item:not(:last-child) {
        border-right: 1px solid rgba(255, 255, 255, 0.2) !important;
    }

    .hero-trust-icon {
        width: 34px !important;
        height: 34px !important;
        font-size: 0.95rem !important;
        margin: 0 auto 2px auto !important;
        flex-shrink: 0 !important;
    }

    .hero-trust-number {
        font-size: 1.15rem !important;
        line-height: 1 !important;
    }

    .hero-trust-label {
        font-size: 0.68rem !important;
        line-height: 1.2 !important;
        color: #c4d1c9 !important;
    }

    /* Hide Persistent Mobile Action Bar on Mobile */
    .mobile-action-bar {
        display: none !important;
    }

    .action-bar-grid {
        display: grid !important;
        grid-template-columns: 1fr 1.15fr 1fr !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .action-bar-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        padding: 8px 2px !important;
        font-size: 0.76rem !important;
        font-weight: 700 !important;
        border-radius: 9999px !important;
        text-align: center !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }

    .services-grid,
    .amenities-content-grid,
    .gallery-grid,
    .philosophy-cards-grid,
    .services-grid,
    .testimonials-grid {
        grid-template-columns: 1fr;
    }

    .philosophy-container,
    .visit-booking-grid,
    .path-steps-grid,
    .path-detail-grid,
    .adl-cards-row-1,
    .adl-cards-row-2,
    .nursing-grid,
    .ready-tour-grid,
    .respite-grid,
    .amenities-content-grid,
    .gallery-row-1,
    .gallery-row-2,
    .blogs-featured-grid,
    .blogs-bottom-grid,
    .care-questions-grid,
    .contact-main-grid,
    .contact-form-grid-2,
    .contact-locations-grid {
        grid-template-columns: 1fr;
    }

    /* Support CTA Cards Mobile Centering */
    .adl-support-cta-bar,
    .nursing-cta-bar,
    .faq-still-questions-bar {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: 1fr !important;
        text-align: center !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 28px 20px !important;
        gap: 16px !important;
    }

    .adl-support-left,
    .nursing-cta-left,
    .faq-still-left {
        display: flex !important;
        flex-direction: column !important;
        text-align: center !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
        border-right: none !important;
        padding-right: 0 !important;
    }

    .adl-support-icon-circle,
    .nursing-cta-icon-circle,
    .faq-still-icon {
        margin: 0 auto !important;
    }

    .adl-support-info,
    .nursing-cta-info,
    .faq-still-info {
        text-align: center !important;
    }

    .btn-talk-care-team {
        width: 100% !important;
        max-width: 280px !important;
        margin: 0 auto !important;
        text-align: center !important;
        justify-content: center !important;
    }

    .nursing-banner-top {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 14px !important;
    }

    .nursing-banner-numbers {
        align-items: flex-start !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .care-questions-features {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    .blog-hero-card {
        flex-direction: column;
    }

    .blog-hero-img-wrapper,
    .blog-hero-content {
        width: 100%;
    }

    .amenities-bottom-cta-bar {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .amenities-cta-left {
        border-right: none;
        padding-right: 0;
        border-bottom: 1px solid #ebdcc9;
        padding-bottom: 16px;
    }

    .amenities-cta-right {
        flex-direction: column;
        align-items: flex-start;
    }

    .respite-features-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .respite-feature-col {
        border-right: none;
        padding-right: 0;
    }

    .respite-action-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .ready-tour-features {
        grid-template-columns: 1fr;
        gap: 20px;
        padding-right: 0;
    }

    .ready-tour-feature-item {
        border-right: none;
        padding-right: 0;
        border-bottom: 1px dashed #ebdcc9;
        padding-bottom: 16px;
    }

    .ready-tour-feature-item:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

    .adl-item-card.adl-card-wide {
        grid-column: span 1;
    }

    .adl-support-cta-bar,
    .nursing-cta-bar {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .nursing-cta-left {
        border-right: none;
        padding-right: 0;
        border-bottom: 1px solid #ebdcc9;
        padding-bottom: 16px;
    }

    .path-steps-line {
        display: none;
    }

    .path-checklist-column {
        border-left: none;
        padding-left: 0;
        border-top: 1px solid #ebdcc9;
        padding-top: 24px;
    }

    .path-full-guide-bar {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .btn-read-full-guide {
        width: 100%;
        justify-content: center;
    }

    .stat-pill-bar,
    .lifestyle-bottom-bar,
    .visit-trust-strip {
        grid-template-columns: 1fr;
        border-radius: 24px;
        gap: 16px;
        padding: 24px 20px;
        position: static;
        margin-top: 24px;
    }

    .stat-pill-item:not(:last-child),
    .lifestyle-bar-item:not(:last-child) {
        border-right: none;
        border-bottom: 1px solid #ebdcc9;
        padding-bottom: 16px;
    }
    .footer-main-body {
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }

    /* Brand col spans full width */
    .footer-brand-col {
        grid-column: 1 / -1;
        border-right: none;
        padding-right: 0;
        border-bottom: 1px solid #ebdcc9;
        padding-bottom: 20px;
    }

    /* Contact info col spans full width at bottom */
    .footer-main-body > .footer-col:last-child {
        grid-column: 1 / -1;
        border-top: 1px solid #ebdcc9;
        padding-top: 16px;
    }

    /* Compact nav list */
    .footer-nav-list {
        gap: 6px;
    }

    .footer-nav-list li {
        padding-bottom: 6px;
    }

    /* Smaller header badge on mobile */
    .footer-col-icon-badge {
        width: 32px;
        height: 32px;
        font-size: 0.9rem;
    }

    .footer-col-header {
        margin-bottom: 12px;
        gap: 8px;
    }

    .footer-col-header h4 {
        font-size: 0.8rem;
    }

    .footer-trust-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .footer-trust-item {
        border-right: none;
        padding-right: 0;
        border-bottom: 1px dashed #ebdcc9;
        padding-bottom: 16px;
    }

    .footer-social-wrapper {
        justify-content: center;
        padding-top: 8px;
    }

    .footer-dark-strip {
        text-align: center;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    body, html {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
        overflow-x: clip !important;
        max-width: 100vw !important;
        box-sizing: border-box !important;
    }
}

/* Small Mobile Breakpoints (320px - 414px) */
@media (max-width: 414px) {
    .btn {
        width: 100%;
    }

    .hero-actions {
        flex-direction: column;
    }

    .trust-feature-card {
        padding: 20px 16px;
    }

    .testimonial-card {
        padding: 24px 20px;
    }

    .contact-info-block,
    .contact-form-block {
        padding: 24px 20px;
    }
}

/* ============================================================
   MOBILE SECTION SPACING — Remove excessive whitespace gaps
   ============================================================ */
@media (max-width: 767px) {
    .philosophy-section,
    .services-section,
    .adl-section,
    .nursing-section,
    .thoughtful-path-section,
    .faq-section,
    .respite-section,
    .testimonials-section,
    .visit-booking-section,
    .community-section,
    .amenities-section,
    .gallery-section,
    .blogs-hero-section,
    .blogs-list-section,
    .care-questions-section,
    .contact-hero-section,
    .contact-main-section,
    .contact-locations-section,
    .lifestyle-section,
    .living-section,
    .planning-section {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    .site-footer {
        padding-top: 40px !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }

    .hero-editorial {
        padding-top: 32px !important;
        padding-bottom: 40px !important;
    }
}

/* ============================================================
   MODAL FORM — Mobile Fix
   ============================================================ */
@media (max-width: 767px) {
    /* Reduce modal card padding on mobile */
    .schedule-visit-modal-card {
        padding: 24px 20px !important;
        border-radius: 18px !important;
        max-height: 95vh !important;
    }

    /* Stack 2-col form grid to single column */
    .modal-form-grid-2 {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }

    /* Make form fields full width and comfortable */
    .modal-input-group {
        margin-bottom: 12px !important;
    }

    .modal-input-field {
        padding: 12px 14px !important;
        font-size: 0.9rem !important;
    }

    /* Tighten modal header */
    .modal-header-box h3 {
        font-size: 1.25rem !important;
    }

    /* Also fix contact form 2-col grid on mobile */
    .contact-form-grid-2 {
        grid-template-columns: 1fr !important;
    }
}