/* ========================================================
   Mobile Responsive Styles — max-width: 480px
   IMPORTANT: PC (desktop) version must NOT be affected.
   All styles here are strictly inside the media query.
   ======================================================== */

/* --- Desktop: hide mobile-only elements --- */
.burger-menu-btn,
.mobile-nav-overlay,
.mobile-service-buttons,
.collab-btn,
.mobile-booking-relocation {
    display: none;
}

/* ======================================================== */
@media only screen and (max-width: 480px) {

    /* ─────────────────────────────────────────────────────
       1. GLOBAL & BODY
    ───────────────────────────────────────────────────── */
    body {
        padding-top: 60px;
        background-color: #f5f7fa;
    }

    /* ─────────────────────────────────────────────────────
       2. HEADER — Fixed Sticky Ribbon
       Layout: [☰ Burger]  ···  [Slogan / Logo]
    ───────────────────────────────────────────────────── */
    .header-wrapper {
        position: fixed !important;
        top: 0;
        left: 0;
        width: 100%;
        height: 60px;
        z-index: 1100;
        background: #fff;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.13);
        transition: none !important;
        /* Disable all transitions for stability */
        will-change: transform;
        contain: layout size;
    }

    .top-header {
        height: 60px !important;
        padding: 0 16px !important;
        display: flex !important;
        align-items: center !important;
        background: #fff !important;
        border-bottom: none !important;
        transition: none !important;
    }

    /* Fixed state stability for mobile */
    .header-wrapper.scrolled {
        box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15);
    }

    .header-wrapper.scrolled .top-header {
        padding: 0 16px !important;
        height: 60px !important;
    }

    .nav-container {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin: 0;
        padding: 0;
        max-width: 100%;
    }

    /* Hide desktop utilities */
    .utility-group {
        display: none !important;
    }

    /* Hide desktop bottom nav bar */
    .bottom-bar {
        display: none !important;
    }

    /* Logo + Slogan — right side */
    .logo-group {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        text-align: right;
        gap: 1px;
    }

    .logo {
        font-size: 1.35rem;
        font-weight: 800;
        line-height: 1;
        color: var(--primary);
        text-decoration: none;
    }

    .slogan {
        font-size: 0.58rem;
        color: var(--text-muted);
        white-space: nowrap;
        display: block;
        text-align: right;
        font-weight: 500;
    }

    /* ─── Burger Menu Button ─── */
    .burger-menu-btn {
        display: flex !important;
        align-items: center;
        justify-content: center;
        background: none;
        border: none;
        font-size: 1.7rem;
        color: var(--primary);
        cursor: pointer;
        padding: 0;
        width: 44px;
        height: 44px;
        border-radius: 8px;
        transition: none;
        min-height: unset;
        z-index: 1200;
        flex-shrink: 0;
    }

    .burger-menu-btn:hover,
    .burger-menu-btn:active {
        background: rgba(26, 35, 126, 0.07);
    }

    /* ─────────────────────────────────────────────────────
       3. MOBILE NAV OVERLAY (slide-down drawer)
    ───────────────────────────────────────────────────── */
    .mobile-nav-overlay {
        display: none;
        position: fixed;
        top: 60px;
        left: 0;
        width: 100%;
        height: calc(100vh - 60px);
        background: rgba(255, 255, 255, 0.98);
        z-index: 1050;
        flex-direction: column;
        padding: 10px 20px 30px;
        overflow-y: auto;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    }

    .mobile-nav-overlay.active {
        display: flex;
    }

    .mobile-nav-overlay a,
    .mobile-nav-overlay .submenu-trigger {
        font-size: 1.1rem;
        /* padding: 14px 0; */
        /* Moved to sub-elements */
        border-bottom: 1px solid #eee;
        color: var(--primary);
        font-weight: 600;
        text-decoration: none;
        display: flex;
        justify-content: space-between;
        align-items: center;
        transition: color 0.2s, padding-left 0.2s;
        width: 100%;
        background: none;
        border-left: none;
        border-right: none;
        text-align: left;
    }

    .mobile-nav-overlay a:not(.submenu-text-link) {
        padding: 14px 0;
    }

    .mobile-nav-overlay .submenu-text-link {
        flex: 1;
        padding: 14px 0;
        color: inherit;
        text-decoration: none;
        font-size: inherit;
        font-weight: inherit;
        border-bottom: none;
    }

    .mobile-nav-overlay .submenu-arrow-toggle {
        padding: 14px 10px 14px 20px;
        cursor: pointer;
        font-size: 0.8rem;
        transition: transform 0.3s, color 0.2s;
        color: var(--primary);
    }

    .mobile-nav-overlay .submenu-arrow-toggle.open {
        transform: rotate(90deg);
        color: var(--accent);
    }

    .mobile-nav-overlay a:last-child {
        border-bottom: none;
    }

    .mobile-nav-overlay a:hover,
    .mobile-nav-overlay a:active,
    .mobile-nav-overlay .submenu-trigger:active {
        color: var(--accent);
        padding-left: 8px;
    }

    /* Submenu Styles */
    /* Handled by .submenu-arrow-toggle above */

    .mobile-nav-overlay .submenu-content {
        display: none;
        background: rgba(0, 0, 0, 0.03);
        padding-left: 20px;
        border-bottom: 1px solid #eee;
    }

    .mobile-nav-overlay .submenu-content.active {
        display: block;
    }

    .mobile-nav-overlay .submenu-content a {
        font-size: 1rem;
        padding: 12px 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    }

    .mobile-nav-overlay .submenu-content a:last-child {
        border-bottom: none;
    }

    /* ─────────────────────────────────────────────────────
       4. HERO BANNER — Hidden on Mobile
    ───────────────────────────────────────────────────── */
    .hero {
        display: none !important;
    }

    /* ──── Mobile Relocated Booking Engine UI ENHANCEMENT ──── */
    #mobile-booking-engine-placeholder .booking-engine {
        display: block !important;
        background: #fff;
        border-top: 4px solid var(--primary);
        /* Prominent brand identifier */
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
        /* Modern, softer shadow */
        border-radius: 12px;
        padding: 1.15rem;
        /* Slight padding increase for better card focus */
        margin-bottom: 24px;
        max-width: 100% !important;
        width: 100%;
        position: static;
        overflow: hidden;
    }

    /* Hide specific fields on mobile */
    .group-trip-type,
    .group-extra-stop {
        display: none !important;
    }

    .booking-engine h2 {
        font-size: 1.15rem;
        font-weight: 800;
        color: var(--primary);
        margin-bottom: 0.7rem;
        text-align: left;
        letter-spacing: -0.3px;
    }

    .form-row {
        grid-template-columns: 1fr !important;
        gap: 0.45rem !important;
        margin-bottom: 0.45rem !important;
    }

    .form-group {
        margin-bottom: 0 !important;
    }

    .form-group label {
        font-size: 0.78rem;
        margin-bottom: 2px;
        color: #4a5568;
        /* Improved contrast labels */
        font-weight: 700;
    }

    .form-control,
    .btn-datetime {
        height: 48px !important;
        font-size: 0.95rem !important;
        border-radius: 8px !important;
        padding: 0 12px !important;
        background-color: #f8fafc !important;
        /* Extremely subtle field tint */
        border: 1px solid #cbd5e0 !important;
        color: #2d3748 !important;
        transition: all 0.2s ease !important;
    }

    /* Placeholder style enhancement */
    .form-control::placeholder {
        font-size: 0.8rem !important;
        /* Smaller than entered text */
        color: #94a3b8 !important;
    }

    .form-control option:disabled,
    .form-control option[value=""] {
        font-size: 0.8rem !important;
    }

    .form-control:focus,
    .btn-datetime:focus {
        border-color: var(--primary) !important;
        background-color: #fff !important;
        box-shadow: 0 0 0 3px rgba(26, 35, 126, 0.08) !important;
        outline: none;
    }

    .btn-quote {
        height: 52px !important;
        font-size: 1.05rem !important;
        font-weight: 800 !important;
        margin-top: 10px;
        background: linear-gradient(135deg, var(--primary), #1a237e) !important;
        /* Modern brand gradient */
        color: #fff !important;
        border: none !important;
        box-shadow: 0 4px 12px rgba(26, 35, 126, 0.25) !important;
        transition: all 0.1s ease !important;
    }

    .btn-quote:active {
        transform: scale(0.98);
        box-shadow: 0 2px 6px rgba(26, 35, 126, 0.2) !important;
    }

    .input-wrapper {
        flex-direction: column !important;
        gap: 0.45rem !important;
    }

    .input-wrapper select,
    .input-wrapper input {
        width: 100% !important;
        flex: none !important;
    }

    /* ─────────────────────────────────────────────────────
       5. MOBILE SERVICE BUTTONS — "Comprehensive Service"
       4 circular photo buttons, app-style (Trip.com / Grab)
    ───────────────────────────────────────────────────── */
    .mobile-booking-relocation {
        display: block;
        background: #f5f7fa;
        padding: 0 16px 1.5rem;
    }

    .mobile-service-buttons {
        display: block;
        background: #f5f7fa;
        padding: 24px 16px 12px;
        margin-bottom: 0;
    }

    .mobile-book-title {
        font-size: 1.2rem;
        font-weight: 800;
        color: var(--primary) !important;
        margin: 0 0 16px 0;
        letter-spacing: -0.3px;
        text-align: left;
    }

    .mobile-service-grid {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 6px;
    }

    .mobile-service-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        text-decoration: none;
        flex: 1;
        min-width: 0;
        transition: transform 0.15s ease;
    }

    .mobile-service-item:active {
        transform: scale(0.93);
    }

    /* Circular photo frame */
    .mobile-service-circle {
        width: 68px;
        height: 68px;
        border-radius: 50%;
        overflow: hidden;
        border: none;
        box-shadow: none;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: transform 0.15s;
        background: #f0f2f8;
    }

    .mobile-service-circle img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
        border-radius: 50%;
        transition: transform 0.3s ease;
    }

    /* Active/hover state */
    .mobile-service-item:hover .mobile-service-circle,
    .mobile-service-item:active .mobile-service-circle {
        transform: translateY(-2px);
    }

    .mobile-service-item:hover .mobile-service-circle img,
    .mobile-service-item:active .mobile-service-circle img {
        transform: scale(1.08);
    }

    /* First item highlighted (like Trip.com selected state) */
    /* No border or shadow as requested */

    .mobile-service-item span {
        font-size: 0.7rem;
        font-weight: 600;
        color: var(--text-main);
        text-align: center;
        line-height: 1.3;
    }

    /* ─────────────────────────────────────────────────────
       6. OUR SERVICE SECTION — Hidden on Mobile
    ───────────────────────────────────────────────────── */
    .fleet {
        display: none !important;
    }

    /* ─────────────────────────────────────────────────────
       7. HIGHLIGHT DESTINATIONS — Horizontal Infinite Carousel
    ───────────────────────────────────────────────────── */
    #destinations {
        padding: 0 0 8px;
        background: #f5f7fa;
    }

    #destinations .section-title {
        padding: 8px 16px 12px;
        text-align: left;
        margin: 0;
    }

    #destinations .section-title h2 {
        font-size: 1.2rem;
        font-weight: 800;
        color: var(--primary) !important;
    }

    #destinations .section-title p {
        display: none !important;
    }

    /* Wrapper: disable old stacked layout */
    .destinations-wrapper {
        overflow: visible;
        padding: 0;
        min-height: unset;
        position: static;
        background: transparent;
    }

    /* Hide desktop slider arrows */
    .slider-arrow {
        display: none !important;
    }

    /* ─── Infinite Carousel Track ─── */
    .destinations-track {
        /* Override ALL desktop/stacked transforms */
        display: flex !important;
        position: relative !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        height: auto !important;
        transform: none !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        gap: 12px;
        padding: 0 16px 16px;
        /* Hide scrollbar for clean look */
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .destinations-track::-webkit-scrollbar {
        display: none;
    }

    /* Each destination card — horizontal card style */
    #destinations .destination-item {
        /* Reset desktop/stacked positioning */
        position: relative !important;
        top: auto !important;
        left: auto !important;
        transform: none !important;
        opacity: 1 !important;
        z-index: auto !important;
        pointer-events: auto !important;
        /* Card dimensions */
        flex: 0 0 200px;
        width: 200px !important;
        min-width: 200px !important;
        max-width: 200px !important;
        height: 150px !important;
        background: transparent !important;
        border-radius: 14px;
        box-shadow: none !important;
        overflow: hidden;
        display: flex !important;
        flex-direction: column !important;
        transition: transform 0.2s;
        padding-bottom: 0 !important;
    }

    #destinations .destination-item:active {
        transform: scale(0.97);
        box-shadow: none !important;
    }

    /* Card image */
    #destinations .destination-item .dest-img-box {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        flex-shrink: 0;
        z-index: 1;
    }

    #destinations .destination-item img {
        width: 100%;
        height: 100% !important;
        object-fit: cover;
        border-radius: 14px;
        display: block;
        margin-bottom: 0;
    }

    #destinations .destination-item:hover img,
    #destinations .destination-item:active img {
        transform: none !important;
        filter: none !important;
    }

    /* Tappable overlay replacing "Learn More" button */
    #destinations .dest-btn-group {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        z-index: 3;
    }

    #destinations .dest-btn {
        width: 100%;
        height: 100%;
        opacity: 0;
        /* invisible but clickable */
        position: absolute;
        top: 0;
        left: 0;
    }

    /* Card title */
    #destinations .destination-item h3 {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        font-size: 0.85rem;
        font-weight: 700;
        color: #fff;
        background: linear-gradient(transparent, rgba(0, 0, 0, 0.85));
        padding: 24px 12px 12px;
        margin: 0;
        text-align: left;
        line-height: 1.3;
        z-index: 2;
    }

    /* ─────────────────────────────────────────────────────
       8. REVIEWS & OTHER SECTIONS
    ───────────────────────────────────────────────────── */
    /* Testimonials Section Revision (Mobile Only) */
    .reviews-section {
        padding: 12px 16px 20px;
        background: #f5f7fa;
        display: flex;
        flex-direction: column;
    }

    .reviews-section .section-title {
        order: 1;
        text-align: left;
        padding: 0;
        margin-bottom: 0;
        /* minimal vertical spacing */
    }

    .reviews-section .section-title h2 {
        font-size: 0;
        margin: 0;
    }

    .reviews-section .section-title h2::after {
        content: "Testimonials";
        font-size: 1.25rem;
        font-weight: 800;
        color: var(--primary);
    }

    .reviews-section .section-title p {
        display: none !important;
        /* Remain hidden as per earlier request, but summary area is now showing more */
    }

    .reviews-carousel-wrapper {
        order: 2;
        width: 100%;
    }

    .reviews-summary {
        order: 3;
        display: flex;
        justify-content: center;
        align-items: center;
        padding-left: 0;
        margin-top: 8px;
        margin-bottom: 0;
        width: 100%;
    }

    .rating-big {
        display: none !important;
    }

    .btn-write-review {
        width: 100%;
        padding: 14px 20px;
        font-size: 0.95rem;
        border-radius: 8px;
        background: var(--primary);
        color: #fff !important;
        border: none;
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        box-shadow: 0 4px 12px rgba(26, 35, 126, 0.25);
        text-transform: none;
        letter-spacing: normal;
    }

    .btn-write-review::before {
        content: "✎";
        font-size: 1rem;
    }

    .reviews-track {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 16px;
        padding: 4px 0 8px;
        scrollbar-width: none;
        align-items: stretch;
        transform: none !important;
        /* Fix disappearance bug caused by JS auto-slider */
    }

    .reviews-track::-webkit-scrollbar {
        display: none;
    }

    .reviews-dots {
        display: none !important;
    }

    .review-card {
        flex: 0 0 calc(100vw - 64px) !important;
        /* Wider cards */
        width: calc(100vw - 64px) !important;
        min-width: calc(100vw - 64px) !important;
        max-width: calc(100vw - 64px) !important;
        scroll-snap-align: center;
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
        padding: 14px 18px;
        /* Slightly tighter vertical padding */
        display: flex;
        flex-direction: column;
        gap: 8px;
        overflow: hidden;
        /* Ensure width > height by controlling content */
    }

    .review-card .review-header {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .review-card .reviewer-avatar {
        display: none !important;
    }

    .review-card .reviewer-info {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .review-card .reviewer-email {
        display: block !important;
        font-size: 0.75rem;
        color: var(--text-muted);
    }

    .review-card .review-rating {
        display: flex;
        gap: 2px;
        margin: 0;
        padding: 0;
    }

    .review-card .review-rating .star {
        font-size: 0.85rem;
        color: #fbbf24;
    }

    .review-card .reviewer-name {
        color: var(--text-main);
        font-size: 0.95rem;
        font-weight: 700;
        margin-right: 0;
        line-height: 1.2;
    }

    .review-card .reviewer-name::before {
        display: none;
    }

    .review-card .review-text {
        font-size: 0.82rem;
        line-height: 1.5;
        padding: 0;
        margin: 4px 0;
        color: var(--text-main);
        display: -webkit-box;
        -webkit-line-clamp: 3;
        line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .review-card .review-footer {
        display: flex;
        justify-content: flex-end;
        margin-top: auto;
    }

    .review-card .review-date {
        color: var(--text-muted);
        font-size: 0.75rem;
    }

    .reviews-arrow {
        display: none !important;
    }

    /* ─────────────────────────────────────────────────────
       9. FOOTER
    ───────────────────────────────────────────────────── */
    footer {
        padding: 40px 16px 30px;
    }

    .footer-content {
        display: flex;
        flex-direction: column;
        gap: 28px;
        padding-bottom: 10px;
    }

    .footer-section {
        width: 100%;
        text-align: left;
    }

    .footer-section h4 {
        font-size: 1.15rem;
        margin-bottom: 16px;
        color: var(--secondary);
    }

    .footer-section p {
        font-size: 0.95rem !important;
        margin-bottom: 6px !important;
        /* Reduced from 12px */
        line-height: 1.4 !important;
        /* Reduced from 1.6 */
    }

    .footer-section ul {
        display: flex;
        flex-direction: column;
        gap: 6px;
        /* Reduced from 12px */
    }

    .footer-section ul li {
        margin-bottom: 0;
    }

    .footer-section ul li a {
        font-size: 0.95rem;
        display: inline-block;
        padding: 3px 0;
        /* Reduced from 6px */
    }

    .copyright {
        margin-top: 20px;
        padding-top: 20px;
        font-size: 0.85rem;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    /* ─────────────────────────────────────────────────────
       10. TOUCH-FRIENDLY FORM CONTROLS (other pages)
    ───────────────────────────────────────────────────── */
    .form-control,
    select {
        min-height: 44px;
        font-size: 16px;
    }

    .form-group {
        margin-bottom: 14px;
    }

    /* ─────────────────────────────────────────────────────
       11. OTHER PAGE CAROUSELS (Service pages)
    ───────────────────────────────────────────────────── */
    .fleet-grid,
    #itinerary-offers .itinerary-grid,
    .collab-grid {
        display: flex !important;
        flex-direction: row;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 16px;
        padding-bottom: 8px;
        /* Reduced */
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .collab-grid::-webkit-scrollbar {
        display: none;
    }

    #collaboration {
        padding-bottom: 1.5rem !important;
        /* Tighten up */
    }

    /* About.html specific sections */
    .about {
        padding: 40px 16px !important;
        background-image: none !important;
    }

    .about-container {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    .about-text {
        padding-left: 0 !important;
        text-align: center !important;
    }

    .about-text h2 {
        font-size: 1.8rem !important;
        margin-bottom: 1rem !important;
        text-align: center !important;
    }

    .about-text p {
        text-align: center !important;
    }

    .about-stats {
        justify-content: center !important;
        margin-top: 1.5rem !important;
    }

    .about-stats .stat-item {
        min-width: 70px !important;
        flex: 0 0 auto !important;
    }

    .about-stats .stat-num {
        font-size: 1.8rem !important;
    }

    .about-container .booking-engine {
        display: none !important;
    }

    /* Why Choose Us Redesign */
    .choose-us-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
        padding: 0 16px !important;
    }

    .choose-card {
        aspect-ratio: 1 / 1 !important;
        height: auto !important;
        min-height: unset !important;
        padding: 12px !important;
    }

    .choose-card h3 {
        font-size: 0.85rem !important;
    }

    /* Collaboration Swipe Redesign */
    .collab-grid .collab-card {
        flex: 0 0 260px !important;
        width: 260px !important;
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
        text-align: left;
    }

    .collab-img img {
        height: 150px !important;
    }

    .collab-content {
        padding: 14px !important;
        height: 200px;
        display: flex;
        flex-direction: column;
    }

    .collab-content h3 {
        font-size: 0.95rem !important;
        line-height: 1.3 !important;
        margin-bottom: 8px !important;
    }

    .collab-content p {
        font-size: 0.78rem !important;
        line-height: 1.4 !important;
        margin-bottom: 12px !important;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        line-clamp: 4;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .collab-btn {
        margin-top: auto;
        display: block;
        padding: 10px;
        background: var(--primary);
        color: #fff !important;
        text-align: center;
        border-radius: 6px;
        font-weight: 700;
        font-size: 0.85rem;
    }

    footer {
        padding-top: 20px !important;
    }

    .destinations-grid,
    .stops-grid {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        gap: 14px;
        padding: 10px 16px 28px;
        grid-template-columns: none !important;
        width: 100%;
    }

    .car-card,
    #itinerary-offers .itinerary-card,
    .destinations-grid .destination-item,
    .stop-card {
        flex: 0 0 85%;
        width: 85% !important;
        min-width: 85% !important;
        max-width: 85% !important;
        scroll-snap-align: center;
        margin: 0 !important;
    }

    /* Hanoi Airport Transfer Page - Mobile Redesign */
    .hanoi-airport-transfer-page .booking-form-wrapper,
    .hanoi-airport-transfer-page .desktop-only-table {
        display: none !important;
    }

    .hanoi-airport-transfer-page .mobile-price-cards {
        display: flex !important;
        flex-direction: column;
        gap: 8px;
        margin-top: 5px;
        margin-bottom: 15px;
    }

    .hanoi-airport-transfer-page .price-card {
        background: #fff;
        border-radius: 10px;
        padding: 8px 12px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
        border: 1px solid #eee;
    }

    .hanoi-airport-transfer-page .card-header {
        border-bottom: 1px solid #f0f0f0;
        padding-bottom: 4px;
        margin-bottom: 4px;
    }

    .hanoi-airport-transfer-page .card-header h3 {
        color: var(--primary);
        font-size: 1rem;
        margin-bottom: 0;
    }

    .hanoi-airport-transfer-page .capacity {
        display: flex;
        gap: 12px;
        font-size: 0.75rem;
        color: var(--text-muted);
    }

    .hanoi-airport-transfer-page .capacity span {
        display: flex;
        align-items: center;
        gap: 4px;
    }

    .hanoi-airport-transfer-page .capacity span:not(:first-child)::before {
        content: "•";
        font-size: 0.75rem;
        color: #ddd;
    }

    .hanoi-airport-transfer-page .price-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 2px 0;
    }

    .hanoi-airport-transfer-page .price-row .label {
        font-size: 0.9rem;
        color: var(--text-main);
    }

    .hanoi-airport-transfer-page .price-row .value {
        font-size: 1.1rem;
        font-weight: 700;
        color: var(--accent);
    }

    .hanoi-airport-transfer-page .btn-reserve-mobile {
        display: flex !important;
        width: 100%;
        padding: 14px;
        background: var(--primary);
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: 700;
        justify-content: center;
        align-items: center;
        text-transform: uppercase;
        box-shadow: 0 4px 15px rgba(26, 35, 126, 0.3);
        margin-bottom: 20px;
    }

    /* Overall font size reduction for this page */
    .hanoi-airport-transfer-page {
        font-size: 14px !important;
    }

    .hanoi-airport-transfer-page h1.page-title {
        font-size: 1.4rem !important;
    }

    .hanoi-airport-transfer-page h2.section-heading {
        font-size: 1.15rem !important;
        margin-bottom: 0.75rem !important;
        padding-bottom: 0.3rem !important;
    }

    .hanoi-airport-transfer-page section.section-box {
        padding: 1.25rem !important;
    }

    .hanoi-airport-transfer-page .fee-list li,
    .hanoi-airport-transfer-page .exclusion-list li {
        font-size: 0.8rem !important;
        padding: 0.3rem 0 !important;
        line-height: 1.3 !important;
    }

    .hanoi-airport-transfer-page .nested-list {
        margin-top: 0.3rem !important;
        font-size: 0.75rem !important;
    }

    .hanoi-airport-transfer-page .nested-list p {
        margin-bottom: 0.1rem !important;
    }

    .hanoi-airport-transfer-page p,
    .hanoi-airport-transfer-page li {
        font-size: 0.82rem !important;
        line-height: 1.4 !important;
        margin-bottom: 0.5rem !important;
    }

    .hanoi-airport-transfer-page h3 {
        font-size: 1rem !important;
        margin-bottom: 0.5rem !important;
    }

    .hanoi-airport-transfer-page h4 {
        font-size: 0.9rem !important;
        margin-bottom: 0.4rem !important;
    }

    .hanoi-airport-transfer-page .policy-block {
        padding: 0.8rem !important;
        margin-bottom: 0.6rem !important;
    }

    .hanoi-airport-transfer-page .policy-block p {
        font-size: 0.8rem !important;
        margin-bottom: 0.4rem !important;
    }

    .hanoi-airport-transfer-page .contact-highlight {
        font-size: 1.1rem !important;
    }

    /* Override inline margins and tighten layout for mobile */
    .hanoi-airport-transfer-page .section-box h3,
    .hanoi-airport-transfer-page .section-box h4,
    .hanoi-airport-transfer-page .section-box p {
        margin-bottom: 0.5rem !important;
    }

    .hanoi-airport-transfer-page .map-container {
        gap: 0.5rem !important;
        margin-top: 0.5rem !important;
    }

    .hanoi-airport-transfer-page .map-item {
        min-width: 140px !important;
        height: 120px !important;
    }

    .hanoi-airport-transfer-page .meet-greet-images {
        margin-top: 0.5rem !important;
        gap: 10px !important;
    }

    /* Hanoi City Tour Page - Mobile Redesign */
    .hanoi-city-tour-page .booking-form-wrapper,
    .hanoi-city-tour-page .desktop-only-table {
        display: none !important;
    }

    .hanoi-city-tour-page .mobile-price-cards {
        display: flex !important;
        flex-direction: column;
        gap: 6px;
        margin-top: 5px;
        margin-bottom: 12px;
    }

    .hanoi-city-tour-page .price-card {
        background: #fff;
        border-radius: 8px;
        padding: 6px 10px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
        border: 1px solid #eee;
    }

    .hanoi-city-tour-page .card-header {
        border-bottom: 1px solid #f0f0f0;
        padding-bottom: 3px;
        margin-bottom: 3px;
        text-align: left;
    }

    .hanoi-city-tour-page .card-header h3 {
        color: var(--primary);
        font-size: 0.95rem;
        margin-bottom: 0;
        text-align: left;
    }

    .hanoi-city-tour-page .price-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1px 0;
    }

    .hanoi-city-tour-page .price-row .label {
        font-size: 0.85rem;
        color: var(--text-main);
    }

    .hanoi-city-tour-page .price-row .value {
        font-size: 1rem;
        font-weight: 700;
        color: var(--accent);
    }

    .hanoi-city-tour-page .btn-reserve-mobile {
        display: flex !important;
        width: 100%;
        padding: 14px;
        background: var(--primary);
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: 700;
        justify-content: center;
        align-items: center;
        text-transform: uppercase;
        box-shadow: 0 4px 15px rgba(26, 35, 126, 0.3);
        margin-bottom: 20px;
    }

    /* Overall font size reduction for City Tour */
    .hanoi-city-tour-page {
        font-size: 14px !important;
    }

    .hanoi-city-tour-page h1.page-title {
        font-size: 1.5rem !important;
    }

    .hanoi-city-tour-page h2.section-heading {
        font-size: 1.15rem !important;
        margin-bottom: 0.75rem !important;
        padding-bottom: 0.3rem !important;
    }

    .hanoi-city-tour-page section.section-box {
        padding: 1.25rem !important;
        margin-bottom: 1.25rem !important;
    }

    .hanoi-city-tour-page p,
    .hanoi-city-tour-page li {
        font-size: 0.82rem !important;
        line-height: 1.4 !important;
        margin-bottom: 0.5rem !important;
    }

    .hanoi-city-tour-page h3 {
        font-size: 1rem !important;
        margin-bottom: 0.5rem !important;
    }

    .hanoi-city-tour-page .fee-list li,
    .hanoi-city-tour-page .exclusion-list li {
        font-size: 0.8rem !important;
        padding: 0.3rem 0 !important;
    }

    .hanoi-city-tour-page .policy-block {
        padding: 0.8rem !important;
        margin-bottom: 0.6rem !important;
        border-left-width: 3px !important;
    }

    /* Tighten Itinerary section */
    .hanoi-city-tour-page .itinerary-card .card-header {
        padding: 0.6rem 1rem 0.3rem !important;
        text-align: center !important;
    }

    .hanoi-city-tour-page .itinerary-card .card-header h3,
    .hanoi-city-tour-page .itinerary-card .time-text {
        text-align: center !important;
        width: 100%;
        display: block;
    }

    .hanoi-city-tour-page .itinerary-card .card-body {
        padding: 0 1rem 0.6rem !important;
    }

    .hanoi-city-tour-page .itinerary-list li {
        font-size: 0.8rem !important;
        margin-bottom: 0.3rem !important;
    }

    .hanoi-city-tour-page .itinerary-header {
        justify-content: space-between !important;
    }

    .hanoi-city-tour-page .card-footer {
        padding: 0.8rem 1rem !important;
        gap: 0.4rem !important;
    }

    .hanoi-city-tour-page .btn-reserve-card {
        font-size: 0.75rem !important;
        padding: 0.4rem 0.6rem !important;
        white-space: nowrap !important;
    }

    .hanoi-city-tour-page .price-value {
        font-size: 1.1rem !important;
    }

    /* Tighten Our Offer and Included sections */
    .hanoi-city-tour-page #itinerary-offers p {
        font-size: 0.82rem !important;
        margin-bottom: 0.8rem !important;
        line-height: 1.4 !important;
    }

    .hanoi-city-tour-page .clean-dropdown {
        margin-top: 1rem !important;
    }

    .hanoi-city-tour-page .clean-dropdown div[style*="font-size: 1.1rem"] {
        font-size: 1rem !important;
        padding: 0.5rem 0 !important;
    }

    .hanoi-city-tour-page .info-content {
        padding: 1rem !important;
    }

    .hanoi-city-tour-page .info-col h4 {
        font-size: 0.9rem !important;
        margin-bottom: 0.3rem !important;
    }

    .hanoi-city-tour-page .info-ul li {
        font-size: 0.8rem !important;
        margin-bottom: 0.2rem !important;
    }

    /* ─────────────────────────────────────────────────────
       Hanoi Suburban Transfer Page - Mobile Redesign
    ───────────────────────────────────────────────────── */
    .hanoi-suburban-transfer-page .booking-form-wrapper,
    .hanoi-suburban-transfer-page .desktop-only-table {
        display: none !important;
    }

    .hanoi-suburban-transfer-page .mobile-price-cards {
        display: flex !important;
        flex-direction: column;
        gap: 8px;
        margin-top: 5px;
        margin-bottom: 8px;
    }

    .hanoi-suburban-transfer-page .price-card {
        background: #fff;
        border: 1px solid #e0e0e0;
        border-radius: 8px;
        padding: 10px 12px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    }

    .hanoi-suburban-transfer-page .card-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 8px;
        border-bottom: 1px solid #f5f5f5;
        padding-bottom: 6px;
    }

    .hanoi-suburban-transfer-page .card-header h3 {
        font-size: 1rem !important;
        font-weight: 700;
        color: var(--primary);
        margin: 0 !important;
    }

    .hanoi-suburban-transfer-page .price-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 4px 0;
    }

    .hanoi-suburban-transfer-page .price-row .label {
        font-size: 0.82rem;
        color: var(--text-main);
    }

    .hanoi-suburban-transfer-page .price-row .value {
        font-size: 0.95rem;
        font-weight: 700;
        color: var(--accent);
    }

    .hanoi-suburban-transfer-page .btn-reserve-mobile {
        display: flex !important;
        width: 100%;
        padding: 14px;
        background: var(--primary);
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: 700;
        justify-content: center;
        align-items: center;
        text-transform: uppercase;
        box-shadow: 0 4px 15px rgba(26, 35, 126, 0.3);
        margin-top: 6px !important;
        margin-bottom: 15px !important;
    }

    /* Swipeable Package row */
    .hanoi-suburban-transfer-page .offers-grid {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        gap: 12px !important;
        padding: 0 16px 16px !important;
        scrollbar-width: none !important;
        margin: 0 -1.25rem 1rem !important;
        width: calc(100% + 2.5rem) !important;
    }

    .hanoi-suburban-transfer-page .offers-grid::-webkit-scrollbar {
        display: none !important;
    }

    .hanoi-suburban-transfer-page .offer-card {
        flex: 0 0 280px !important;
        min-width: 280px !important;
    }

    .hanoi-suburban-transfer-page .offer-card-footer {
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        text-align: left !important;
        padding: 0.8rem 1rem !important;
    }

    .hanoi-suburban-transfer-page .offer-price-area {
        text-align: left !important;
        margin-bottom: 0 !important;
        display: flex !important;
        align-items: baseline !important;
        gap: 4px !important;
    }

    .hanoi-suburban-transfer-page .offer-price-label {
        font-size: 0.85rem !important;
        text-transform: none !important;
        margin-bottom: 0 !important;
    }

    .hanoi-suburban-transfer-page .offer-price-value {
        font-size: 1.15rem !important;
        margin-bottom: 0 !important;
    }

    /* Overall font size reduction for this page */
    .hanoi-suburban-transfer-page {
        font-size: 14px !important;
    }

    .hanoi-suburban-transfer-page h1.page-title {
        font-size: 1.4rem !important;
    }

    .hanoi-suburban-transfer-page h2.section-heading {
        font-size: 1.15rem !important;
        margin-bottom: 0.75rem !important;
        padding-bottom: 0.3rem !important;
    }

    .hanoi-suburban-transfer-page section.section-box {
        padding: 1.25rem !important;
        margin-bottom: 1rem !important;
    }

    .hanoi-suburban-transfer-page p,
    .hanoi-suburban-transfer-page li {
        font-size: 0.82rem !important;
        line-height: 1.4 !important;
        margin-bottom: 0.5rem !important;
    }

    .hanoi-suburban-transfer-page .fee-list li {
        font-size: 0.8rem !important;
        padding: 0.3rem 0 !important;
    }

    .hanoi-suburban-transfer-page .meet-greet-list li {
        font-size: 0.8rem !important;
        line-height: 1.3 !important;
        margin-bottom: 0.4rem !important;
    }

    .hanoi-suburban-transfer-page .offer-card-title {
        font-size: 0.95rem !important;
        margin-bottom: 0.4rem !important;
    }

    .hanoi-suburban-transfer-page .offer-card-content p {
        font-size: 0.78rem !important;
        margin-bottom: 0.3rem !important;
    }

    .hanoi-suburban-transfer-page .btn-reserve-offer {
        font-size: 0.75rem !important;
        padding: 0.4rem 0.6rem !important;
    }

    .hanoi-suburban-transfer-page .clean-dropdown div[style*="font-size: 1.1rem"] {
        font-size: 1rem !important;
        padding: 0.5rem 0 !important;
    }

    .hanoi-suburban-transfer-page .info-content {
        padding: 1rem !important;
    }

    .hanoi-suburban-transfer-page .info-col h4 {
        font-size: 0.85rem !important;
        margin-bottom: 0.3rem !important;
    }

    .hanoi-suburban-transfer-page .info-ul li {
        font-size: 0.78rem !important;
        margin-bottom: 0.2rem !important;
    }

    .hanoi-suburban-transfer-page .map-wrapper {
        padding-top: 0.8rem !important;
    }

    .hanoi-suburban-transfer-page .map-image {
        max-width: 140px !important;
    }

    /* ─────────────────────────────────────────────────────
       Hanoi Northern Transfer Page - Mobile Redesign
    ───────────────────────────────────────────────────── */
    .hanoi-northern-transfer-page .mobile-price-cards {
        display: flex !important;
        flex-direction: column;
        gap: 8px;
        margin-top: 5px;
        margin-bottom: 8px;
    }

    .hanoi-northern-transfer-page .price-card {
        background: #fff;
        border: 1px solid #e0e0e0;
        border-radius: 8px;
        padding: 10px 12px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    }

    .hanoi-northern-transfer-page .card-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 8px;
        border-bottom: 1px solid #f5f5f5;
        padding-bottom: 6px;
    }

    .hanoi-northern-transfer-page .card-header h3 {
        font-size: 1rem !important;
        font-weight: 700;
        color: var(--primary);
        margin: 0 !important;
    }

    .hanoi-northern-transfer-page .price-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 4px 0;
    }

    .hanoi-northern-transfer-page .price-row .label {
        font-size: 0.82rem;
        color: var(--text-main);
    }

    .hanoi-northern-transfer-page .price-row .value {
        font-size: 0.95rem;
        font-weight: 700;
        color: var(--accent);
    }

    .hanoi-northern-transfer-page .btn-reserve-mobile {
        display: flex !important;
        width: 100%;
        padding: 14px;
        background: var(--primary);
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: 700;
        justify-content: center;
        align-items: center;
        text-transform: uppercase;
        box-shadow: 0 4px 15px rgba(26, 35, 126, 0.3);
        margin-top: 6px !important;
        margin-bottom: 15px !important;
    }

    /* Swipeable Stops grid */
    .hanoi-northern-transfer-page .stops-grid {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        gap: 12px !important;
        padding: 0 16px 16px !important;
        scrollbar-width: none !important;
        margin: 0 -1.25rem 1rem !important;
        width: calc(100% + 2.5rem) !important;
        align-items: stretch !important;
    }

    .hanoi-northern-transfer-page .stops-grid::-webkit-scrollbar {
        display: none !important;
    }

    .hanoi-northern-transfer-page .stop-card {
        flex: 0 0 280px !important;
        min-width: 280px !important;
        padding: 1rem !important;
        border-top: 1px solid #eee !important;
        display: flex !important;
        flex-direction: column !important;
        height: auto !important;
    }

    .hanoi-northern-transfer-page .stop-card-footer {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        text-align: left !important;
        padding-top: 0.8rem !important;
        margin-top: auto !important;
    }

    .hanoi-northern-transfer-page .stop-price {
        text-align: left !important;
        margin-bottom: 0 !important;
        display: flex !important;
        align-items: baseline !important;
        gap: 4px !important;
        font-size: 0.85rem !important;
    }

    .hanoi-northern-transfer-page .stop-price .mobile-only {
        display: inline-block !important;
    }

    .hanoi-northern-transfer-page .stop-price b {
        font-size: 1.15rem !important;
        margin-left: 0 !important;
    }

    .hanoi-northern-transfer-page .btn-learn-more {
        width: auto !important;
        padding: 0.4rem 0.8rem !important;
        font-size: 0.75rem !important;
    }

    /* Overall font size reduction */
    .hanoi-northern-transfer-page {
        font-size: 14px !important;
    }

    .hanoi-northern-transfer-page h1.page-title {
        font-size: 1.45rem !important;
    }

    .hanoi-northern-transfer-page h2.section-heading {
        font-size: 1.15rem !important;
        margin-bottom: 0.75rem !important;
        padding-bottom: 0.3rem !important;
    }

    .hanoi-northern-transfer-page section.section-box {
        padding: 1.25rem !important;
        margin-bottom: 1rem !important;
    }

    .hanoi-northern-transfer-page p,
    .hanoi-northern-transfer-page li {
        font-size: 0.82rem !important;
        line-height: 1.4 !important;
        margin-bottom: 0.4rem !important;
    }

    .hanoi-northern-transfer-page .stop-list li {
        margin-bottom: 0.3rem !important;
        gap: 0.3rem !important;
    }

    .hanoi-northern-transfer-page .route-duration {
        font-size: 0.75rem !important;
    }

    .hanoi-northern-transfer-page .fee-list li,
    .hanoi-northern-transfer-page .meet-greet-list li {
        font-size: 0.8rem !important;
        padding: 0.3rem 0 !important;
    }

    .hanoi-northern-transfer-page .map-thumbnail {
        max-width: 150px !important;
    }

    /* ─────────────────────────────────────────────────────
       Ninh Binh Transfer Page - Mobile Redesign
    ───────────────────────────────────────────────────── */
    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .booking-form-wrapper,
    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .desktop-only-table {
        display: none !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .mobile-price-cards {
        display: flex !important;
        flex-direction: column;
        gap: 8px;
        margin-top: 5px;
        margin-bottom: 8px;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .price-card {
        background: #fff;
        border: 1px solid #e0e0e0;
        border-radius: 8px;
        padding: 10px 12px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .card-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 8px;
        border-bottom: 1px solid #f5f5f5;
        padding-bottom: 6px;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .card-header h3 {
        font-size: 1rem !important;
        font-weight: 700;
        color: var(--primary);
        margin: 0 !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .price-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 4px 0;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .price-row .label {
        font-size: 0.82rem;
        color: var(--text-main);
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .price-row .value {
        font-size: 0.95rem;
        font-weight: 700;
        color: var(--accent);
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .btn-reserve-mobile {
        display: flex !important;
        width: 100%;
        padding: 14px;
        background: var(--primary);
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: 700;
        justify-content: center;
        align-items: center;
        text-transform: uppercase;
        box-shadow: 0 4px 15px rgba(26, 35, 126, 0.3);
        margin-top: 6px !important;
        margin-bottom: 15px !important;
    }

    /* Swipeable Offers grid */
    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offers-grid {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        gap: 12px !important;
        padding: 0 16px 16px !important;
        scrollbar-width: none !important;
        margin: 0 -1.25rem 1rem !important;
        width: calc(100% + 2.5rem) !important;
        align-items: stretch !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offers-grid::-webkit-scrollbar {
        display: none !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card {
        flex: 0 0 280px !important;
        min-width: 280px !important;
        border-top: 1px solid #eee !important;
        display: flex !important;
        flex-direction: column !important;
        height: auto !important;
        margin-bottom: 0 !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-footer {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        text-align: left !important;
        padding: 0.8rem 1rem !important;
        margin-top: auto !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-price-area {
        text-align: left !important;
        margin-bottom: 0 !important;
        display: flex !important;
        align-items: baseline !important;
        gap: 4px !important;
        font-size: 0.85rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-price-label {
        font-size: 0.85rem !important;
        text-transform: none !important;
        margin-bottom: 0 !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-price-value {
        font-size: 1.15rem !important;
        margin-left: 0 !important;
        margin-bottom: 0 !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .btn-reserve-offer {
        width: auto !important;
        padding: 0.4rem 0.8rem !important;
        font-size: 0.75rem !important;
        margin-left: 0 !important;
    }

    /* Overall font size reduction */
    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) {
        font-size: 14px !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) h1.page-title {
        font-size: 1.45rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) h2.section-heading {
        font-size: 1.15rem !important;
        margin-bottom: 0.75rem !important;
        padding-bottom: 0.3rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) section.section-box {
        padding: 1.25rem !important;
        margin-bottom: 1rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) p,
    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) li {
        font-size: 0.82rem !important;
        line-height: 1.4 !important;
        margin-bottom: 0.4rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .description-text .info-line {
        font-size: 0.82rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-content .time-slot {
        font-size: 0.65rem !important;
        padding: 0.15rem 0.4rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-content .activity-title {
        font-size: 0.75rem !important;
        line-height: 1.2 !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-content h4 {
        font-size: 0.8rem !important;
        margin-top: 0.8rem !important;
        margin-bottom: 0.4rem !important;
        line-height: 1.2 !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-content h4:first-of-type {
        margin-top: 0.2rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-title {
        font-size: 0.9rem !important;
        margin-bottom: 0.4rem !important;
        padding: 0 0.5rem !important;
        line-height: 1.2 !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-header {
        padding: 0.5rem 0.5rem 0 !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-content {
        padding: 0 0.5rem 0.5rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-footer {
        padding: 0.5rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-price-area {
        margin-bottom: 0.35rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-price-label {
        font-size: 0.62rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-price-value {
        font-size: 1rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .btn-reserve-offer {
        padding: 0.45rem 0.8rem !important;
        font-size: 0.72rem !important;
    }

    /* Simplify the description inside each card - keep only Time and Main Destination */
    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-content .activity-desc {
        display: none !important;
    }

    /* Keep generic bullet list simple by hiding it entirely since it's redundant to features? Wait, just keeping specific stuff */
    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .offer-card-content>ul.desktop-only {
        display: none !important;
    }

    /* Vertical stack for What's Included section */
    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .included-grid {
        grid-template-columns: 1fr !important;
        gap: 1.2rem !important;
        padding: 1.25rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .included-grid ul {
        padding-left: 1.2rem !important;
        margin-top: 0.5rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .included-grid h4 {
        margin-bottom: 0.5rem !important;
        color: var(--primary);
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .included-reference-wrapper {
        padding: 1.25rem 0.75rem !important;
        margin-top: 0.5rem !important;
        margin-left: -0.5rem !important;
        margin-right: -0.5rem !important;
    }

    /* Compact Typography for Mobile Itinerary */
    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .itinerary-item {
        gap: 0.5rem !important;
        margin-bottom: 0.35rem !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .activity-desc b {
        font-size: 0.85rem !important;
        margin-bottom: 0.1rem !important;
        line-height: 1.2 !important;
    }

    :is(.ninh-binh-transfer-page, .ha-long-transfer-page, .mai-chau-transfer-page, .sapa-transfer-page) .activity-desc {
        font-size: 0.78rem !important;
        line-height: 1.3 !important;
    }

    /* ─────────────────────────────────────────────────────
       12. VEHICLE PAGE — Mobile Optimization
    ───────────────────────────────────────────────────── */
    .vehicles-modern-section {
        padding: 3.5rem 1rem 2rem !important;
    }

    .vehicle-category-block {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
        margin-bottom: 2.5rem !important;
    }

    .category-info-panel {
        position: static !important;
        /* Remove sticky behavior to prevent covering images */
        padding: 1.25rem !important;
        /* Reduce panel "box" size */
        border-radius: 12px !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
        top: auto !important;
        margin-bottom: 0.5rem !important;
        background: #fff !important;
        /* Cleaner white on light gray background */
    }

    .category-info-panel h3 {
        font-size: 1.4rem !important;
        /* Compacter vehicle type label */
        margin-bottom: 0.75rem !important;
        line-height: 1.2 !important;
        color: var(--primary) !important;
    }

    .category-specs-list {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        /* Two-column specs to save height */
        gap: 0.75rem !important;
        flex-direction: row !important;
    }

    .spec-item {
        font-size: 0.78rem !important;
        gap: 0.5rem !important;
        font-weight: 700 !important;
    }

    .spec-icon {
        width: 30px !important;
        height: 30px !important;
        font-size: 0.95rem !important;
        border-radius: 8px !important;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05) !important;
    }

    .category-info-panel p {
        margin-top: 1rem !important;
        font-size: 0.78rem !important;
        line-height: 1.45 !important;
        color: var(--text-muted) !important;
    }

    .vehicle-showcase-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        /* 2 models per row for better readability */
        gap: 0.75rem !important;
        margin-top: 0.5rem !important;
    }

    .vehicle-model-card {
        padding: 0.75rem 0.5rem !important;
        border-radius: 10px !important;
        background: #fff !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
    }

    .vehicle-model-card img {
        height: 85px !important;
        /* Ensure images are fully visible and logically sized */
        margin-bottom: 0.4rem !important;
        object-fit: contain !important;
    }

    .vehicle-model-name {
        font-size: 0.68rem !important;
        letter-spacing: 0 !important;
    }

    .category-divider {
        margin: 1.5rem 0 !important;
        opacity: 0.5 !important;
    }

    /* ─────────────────────────────────────────────────────
       13. BLOG PAGE — Mobile Optimization
    ───────────────────────────────────────────────────── */
    .blog-page .blog-header {
        height: 160px !important;
        /* Standard compact height for regional pages */
        margin-top: 0 !important;
        /* Body padding handles top spacing */
        margin-bottom: 1.5rem !important;
        background-attachment: scroll !important;
    }

    .blog-page .blog-header h1 {
        font-size: 1.45rem !important;
        /* Uniform page-title scale */
        margin-bottom: 0 !important;
        padding: 0 1rem !important;
    }

    .blog-page .blog-subtitle {
        display: none !important;
        /* Eliminate specific text as requested */
    }

    .blog-page .blog-container {
        padding: 0 1rem 2rem !important;
    }

    .blog-page .blog-grid {
        gap: 1.5rem !important;
    }

    /* ─────────────────────────────────────────────────────
       14. RESERVATION WIZARD — Section 2: Fare
    ───────────────────────────────────────────────────── */
    #confirmation-modal .modal-content {
        width: 95% !important;
        margin: 20px auto !important;
        max-height: 95vh !important;
    }

    #confirmation-modal .modal-body {
        padding: 1.25rem 1rem !important;
    }

    #confirmation-modal .step-indicator {
        margin-bottom: 1.5rem !important;
        gap: 0.5rem !important;
    }

    #confirmation-modal .step-label {
        font-size: 0.65rem !important;
    }

    #confirmation-modal .modal-form.step-2 {
        grid-template-columns: 1fr !important;
        gap: 0.9rem !important;
        background: #f8fafc;
        padding: 1.25rem 1rem;
        border-radius: 12px;
        border: 1px solid #e2e8f0;
    }

    #confirmation-modal .modal-form.step-2 .form-group {
        grid-column: span 1 !important;
        display: flex;
        flex-direction: column;
    }

    #confirmation-modal .modal-form.step-2 label {
        font-size: 0.8rem !important;
        margin-bottom: 4px !important;
        color: #64748b !important;
    }

    #confirmation-modal .modal-form.step-2 .form-control {
        height: 48px !important;
        border: 1px solid #cbd5e1 !important;
        box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    }

}

/* End of @media (max-width: 480px) */