/* Mobile Responsive Enhancements */

/* Ensure proper mobile viewport */
html {
    scroll-behavior: smooth;
}

/* Mobile Navigation */
@media (max-width: 768px) {
    .navbar-menu {
        display: none;
    }

    .navbar-menu.active {
        display: flex;
    }

    /* Hero Section - Mobile */
    .hero-mobile {
        min-height: 250px;
    }

    /* Ensure text is readable on mobile */
    h1 {
        font-size: clamp(1.5rem, 5vw, 3rem);
    }

    h2 {
        font-size: clamp(1.25rem, 4vw, 2.25rem);
    }

    h3 {
        font-size: clamp(1rem, 3.5vw, 1.875rem);
    }

    /* Card spacing on mobile */
    .card-mobile {
        margin-bottom: 1rem;
    }

    /* Form inputs full width on mobile */
    .form-grid {
        grid-template-columns: 1fr;
    }

    /* Button sizing for mobile */
    .btn-mobile {
        padding: 0.75rem 1rem;
        font-size: 0.875rem;
        width: 100%;
    }

    /* Image optimization for mobile */
    img {
        max-width: 100%;
        height: auto;
    }

    /* Testimonial cards on mobile */
    .testimonial-card {
        padding: 1.5rem;
    }

    /* Padding adjustments for mobile */
    .section-padding {
        padding: 1rem 1rem;
    }

    /* Price text sizing */
    .price-large {
        font-size: 1.75rem;
    }

    /* Make modals mobile-friendly */
    .modal-content {
        max-height: 90vh;
        overflow-y: auto;
    }

    /* Booking form spacing */
    .booking-form-group {
        margin-bottom: 1rem;
    }
}

/* Tablet adjustments */
@media (min-width: 768px) and (max-width: 1024px) {
    .grid-responsive {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Large screens */
@media (min-width: 1024px) {
    .grid-responsive {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Touch-friendly sizing */
@media (hover: none) and (pointer: coarse) {

    /* Increase button/link hit area for touch */
    button,
    a {
        min-height: 44px;
        min-width: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Remove hover effects on touch devices */
    .hover\:scale-105:hover {
        transform: none;
    }

    .hover\:shadow-2xl:hover {
        box-shadow: none;
    }
}

/* Prevent layout shift */
input,
textarea,
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Improve readability */
body {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* Optimize images for retina displays */
img {
    image-rendering: -webkit-optimize-contrast;
}

/* Ensure form fields are easily tappable */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="date"],
textarea,
select {
    font-size: 16px;
    /* Prevents zoom on iOS */
    padding: 12px;
    border-radius: 8px;
}

/* Better spacing for mobile lists */
li {
    line-height: 1.8;
}

/* Container queries for responsive behavior */
@supports (container-type: inline-size) {
    .responsive-container {
        container-type: inline-size;
    }
}

/* Print styles */
@media print {

    nav,
    .navbar,
    .footer,
    .btn-print-hide {
        display: none !important;
    }
}