/* Styles for West Quay Cottages */

/* Mobile Responsive Utilities */
@media (max-width: 768px) {
    /* Typography adjustments */
    h1 { font-size: 2rem !important; }
    h2 { font-size: 1.5rem !important; }
    h3 { font-size: 1.25rem !important; }
    
    /* Spacing adjustments */
    .container { padding: 1rem !important; }
    
    /* Hero sections */
    .hero-section h1 { font-size: 2.5rem !important; }
    .hero-section p { font-size: 1rem !important; }
    
    /* Cards and grids */
    .cottage-card,
    .feature-box,
    .gallery-item { margin-bottom: 1.5rem; }
    
    /* Tables */
    .table-responsive { overflow-x: auto; }
    
    /* Buttons */
    .btn { 
        width: 100%;
        margin-bottom: 0.5rem;
    }
    
    /* Navigation */
    .navbar-nav { text-align: center; }
    
    /* Images */
    img { max-width: 100%; height: auto; }
    
    /* Footer columns */
    .footer .row > div {
        margin-bottom: 2rem;
        text-align: center;
    }
}

@media (max-width: 576px) {
    /* Extra small devices */
    h1 { font-size: 1.75rem !important; }
    .hero-section { padding: 3rem 1rem !important; }
    
    /* Contact form */
    .contact-sidebar {
        position: static !important;
        margin-top: 2rem;
    }
}

/* Touch-friendly improvements */
@media (hover: none) and (pointer: coarse) {
    /* Increase tap target sizes */
    .btn,
    .nav-link,
    a {
        min-height: 44px;
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Remove hover effects on touch devices */
    .btn:hover,
    .card:hover {
        transform: none !important;
    }
}