/* TABLET AND UP (600px+) */

@media (min-width: 600px) {
    .about-values__grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .hero__buttons {
        flex-direction: row;
    }
    
    .contact-buttons {
        flex-direction: row;
    }
}


/* DESKTOP (768px+) */

@media (min-width: 768px) {
    .menu-grid {
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
    }
    
    .about-section {
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
        align-items: center;
    }

    .about-section--reverse .about-section__content {
        order: 2;
    }

    .about-section--reverse .about-section__image {
        order: 1;
    }
    
    .footer__container {
        grid-template-columns: 1.5fr 1fr 1fr 1fr;
        gap: 2rem;
    }
}


/* LARGE DESKTOP (900px+) */

@media (min-width: 900px) {
    .contact-content {
        grid-template-columns: 1fr 1.2fr;
        gap: 4rem;
        min-height: 600px;
    }
    
    .about-values__grid {
        grid-template-columns: repeat(4, 1fr);
    }
}


/* MOBILE (< 480px) - Small phones */

@media (max-width: 479px) {
    /* Typography - Keep full 16px base */
    html {
        font-size: 16px;
    }
    
    h1 {
        font-size: 3rem;
    }
    
    h2 {
        font-size: 2.5rem;
    }
    
    /* Navigation */
    .nav {
        padding: 1.25rem 1.25rem;
    }
    
    .nav__logo {
        font-size: 1.5rem;
    }
    
    /* Hero */
    .hero__content {
        padding: 2rem 1.5rem;
    }
    
    .hero__title {
        font-size: 3.25rem;
    }
    
    .hero__description {
        font-size: 1.125rem;
        line-height: 1.7;
    }
    
    .hero__buttons {
        flex-direction: column;
        width: 100%;
    }
    
    .hero__buttons .btn {
        width: 100%;
        text-align: center;
        padding: 1rem 1.5rem;
        font-size: 0.875rem;
    }
    
    /* Home About Section */
    .home-about {
        padding: 4rem 1.5rem;
    }
    
    .home-about__title {
        font-size: 2rem;
    }
    
    .home-about__text {
        font-size: 1rem;
    }
    
    .home-about__image img,
    .home-about__image-placeholder {
        height: 300px;
    }
    
    /* Home Dishes Section */
    .home-dishes {
        padding: 4rem 1.5rem;
    }
    
    .home-dishes__header {
        margin-bottom: 2.5rem;
    }
    
    .home-dishes__title {
        font-size: 2rem;
    }
    
    .home-dish__image img,
    .home-dish__image-placeholder {
        height: 200px;
    }
    
    .home-dish__content {
        padding: 1.25rem;
    }
    
    .home-dish__name {
        font-size: 1.25rem;
    }
    
    /* Home Gallery Section */
    .home-gallery {
        padding: 4rem 1.5rem;
    }
    
    .home-gallery__header {
        margin-bottom: 2.5rem;
    }
    
    .home-gallery__title {
        font-size: 2rem;
    }
    
    .home-gallery__grid {
        gap: 0.75rem;
    }
    
    /* Menu Page */
    .menu-page {
        padding: 0 1.5rem 2.5rem;
    }
    
    .menu-header {
        padding: 5rem 0 1.5rem;
    }
    
    .menu-header__title {
        font-size: 3.25rem;
    }
    
    .menu-tabs {
        gap: 1.25rem;
        padding-bottom: 1rem;
    }
    
    .menu-tabs__btn {
        font-size: 0.9375rem;
        padding: 0 0.25rem 1rem;
    }
    
    .featured-dish {
        padding: 1.5rem 1.75rem;
    }
    
    .featured-dish__name {
        font-size: 1.625rem;
    }
    
    .featured-dish__desc {
        font-size: 1rem;
        line-height: 1.6;
    }
    
    .menu-item__name {
        font-size: 1.0625rem;
    }
    
    .menu-item__price {
        font-size: 0.9375rem;
    }
    
    .menu-item__desc {
        font-size: 0.9375rem;
    }
    
    .allergen-badges {
        gap: 0.3rem;
        margin-top: 0.5rem;
    }
    
    .allergen-badge {
        font-size: 0.625rem;
        padding: 0.25rem 0.5rem;
    }
    
    /* Contact Page */
    .contact-page {
        padding: 0 1.5rem;
    }
    
    .contact-header {
        padding: 5rem 0 2rem;
    }
    
    .contact-header__title {
        font-size: 3.25rem;
    }
    
    .contact-block__text {
        font-size: 1.125rem;
    }
    
    .contact-block__phone {
        font-size: 1.875rem;
    }
    
    .contact-hours li {
        font-size: 1rem;
        padding: 0.75rem 0;
    }
    
    .contact-buttons {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .contact-buttons .btn {
        width: 100%;
        text-align: center;
        justify-content: center;
        padding: 1rem 1.5rem;
        font-size: 0.9375rem;
    }
    
    /* About Page */
    .about-page {
        padding: 0 1.5rem;
    }
    
    .about-header {
        padding: 5rem 0 2.5rem;
    }
    
    .about-header__title {
        font-size: 3.25rem;
    }
    
    .about-intro__text {
        font-size: 1.25rem;
        line-height: 1.7;
    }
    
    .about-section__text {
        font-size: 1.0625rem;
        line-height: 1.7;
    }
    
    .about-value {
        padding: 1.75rem;
    }
    
    .about-value__title {
        font-size: 1.375rem;
    }
    
    .about-value__text {
        font-size: 1rem;
        line-height: 1.6;
    }
    
    .about-cta {
        margin: 0 -1.5rem;
        padding: 4rem 1.5rem;
    }
    
    .about-cta__title {
        font-size: 2.25rem;
    }
    
    .about-cta__text {
        font-size: 1.125rem;
    }
    
    .about-cta__buttons {
        flex-direction: column;
        width: 100%;
        gap: 0.75rem;
    }
    
    .about-cta__buttons .btn {
        width: 100%;
        padding: 1rem 1.5rem;
    }
    
    /* Footer */
    .footer {
        padding: 3.5rem 1.5rem 2rem;
    }
    
    .footer__logo {
        font-size: 1.75rem;
    }
    
    .footer__tagline {
        font-size: 1rem;
    }
    
    .footer__heading {
        font-size: 0.8125rem;
    }
    
    .footer__address {
        font-size: 1.0625rem;
    }
    
    .footer__phone {
        font-size: 1.1875rem;
    }
    
    .footer__hours li {
        font-size: 0.9375rem;
    }
    
    .footer__bottom {
        flex-direction: column;
        gap: 1.25rem;
        text-align: center;
    }
    
    .footer__reserve {
        width: 100%;
        padding: 1rem 1.5rem;
    }
    
    /* Sponsors */
    .footer__sponsors {
        margin-top: 2rem;
        padding-top: 1.5rem;
    }
    
    .footer__sponsors-logos {
        gap: 1.5rem;
    }
    
    .footer__sponsor-logo {
        max-height: 40px;
        max-width: 120px;
    }
    
    /* Full Screen Menu */
    .menu {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    
    .menu__link {
        font-size: 2.25rem;
        padding: 0.625rem 0;
    }
    
    .menu__social {
        left: 2rem;
        bottom: 2.5rem;
        flex-wrap: wrap;
    }
    
    .menu__social-link {
        font-size: 1rem;
    }
    
    /* Preloader */
    .preloader__logo {
        font-size: 2.25rem;
    }
    
    .preloader__counter {
        font-size: 1.125rem;
    }
    
    .preloader__progress {
        left: 1.5rem;
        right: 1.5rem;
        bottom: 2rem;
    }
}


/* MOBILE (< 768px) - Phones and small tablets */

@media (max-width: 767px) {
    /* Menu Page */
    .menu-page {
        padding: 0 1rem 3rem;
    }
    
    .menu-header {
        padding: 5rem 0 1.5rem;
    }
    
    .featured-dish {
        padding: 1.25rem 1.5rem;
    }
    
    .featured-dish__name {
        font-size: 1.5rem;
    }
    
    .menu-tabs {
        gap: 1rem;
    }
    
    .section-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
    
    /* About Page */
    .about-page {
        padding: 0 1.5rem;
    }

    .about-header {
        padding: 5rem 0 3rem;
    }

    .about-section__image-placeholder {
        height: 250px;
    }

    .about-cta {
        margin: 0 -1.5rem;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    
    /* Footer */
    .footer {
        padding: 3rem 1.5rem 2rem;
    }

    .footer__hours li {
        flex-direction: column;
        gap: 0.25rem;
    }

    .footer__hours span:last-child {
        text-align: left;
    }

    .footer__bottom {
        flex-direction: column;
        text-align: center;
    }
}


/* MOBILE (< 900px) - Tablets and below */

@media (max-width: 899px) {
    /* Contact Page */
    .contact-page {
        padding: 0 1.5rem;
    }

    .contact-header {
        padding: 5rem 0 2rem;
    }

    .contact-hours li {
        flex-direction: column;
        gap: 0.25rem;
    }

    .contact-hours span:last-child {
        text-align: left;
    }

    .contact-map {
        height: 350px;
        margin-top: 2rem;
    }
}


/* LANDSCAPE PHONES  */

@media (max-width: 900px) and (orientation: landscape) {
    .hero {
        min-height: auto;
        padding: 6rem 0 4rem;
    }
    
    .hero__title {
        font-size: 2.5rem;
    }
    
    .menu {
        padding-top: 4rem;
    }
    
    .menu__link {
        font-size: 1.5rem;
        padding: 0.3rem 0;
    }
    
    .preloader__logo {
        font-size: 2rem;
    }
}


/*  TOUCH DEVICE IMPROVEMENTS */

@media (hover: none) {
    /* Remove hover effects on touch devices */
    .menu__list.is-ready:hover .menu__link {
        opacity: 1;
    }
    
    /* Increase tap targets */
    .btn {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    
    .nav__toggle {
        min-width: 44px;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .menu-tabs__btn {
        min-height: 44px;
    }
}


/*  PRINT STYLES  */

@media print {
    .nav,
    .preloader,
    .page-transition,
    .menu,
    .footer__reserve {
        display: none !important;
    }
    
    .hero {
        min-height: auto;
        page-break-after: always;
    }
    
    .hero__overlay {
        background: none;
    }
    
    .hero__content {
        color: #000;
    }
    
    .menu-content.hidden {
        display: block !important;
    }
}


/* Wines */

@media (max-width: 768px) {
    .vinos-header {
        padding: 5rem 0 2rem;
    }
 
    .vinos-do__name {
        font-size: 1.25rem;
    }
 
    .vinos-do__toggle {
        padding: 1.25rem 0;
    }
 
    .vinos-wine__name {
        font-size: 0.875rem;
    }
 
    .vinos-wine__detail {
        font-size: 0.6875rem;
    }
 
    .vinos-wine__info {
        flex-direction: column;
        gap: 0.125rem;
    }
}