/* page title styles */
#page__title {
        padding-top: 3rem;
        padding-bottom: 2rem;
}
.page__title__text {
        font-size: 2.8rem;
        color: var(--yellow-gta);
        font-family: 'Pricedown Bl', 'Pricedown', sans-serif;
        text-transform: uppercase;
        letter-spacing: 0.08em;
}
@media only screen and (min-width: 768px) {
        #page__title {
                padding-top: 5rem;
                padding-bottom: 3rem;
        }
        .page__title__text {
                font-size: 4.5rem;
        }
}
/* Our Specials Menu Styles */
#ourSpecials {
        padding: 0;
}
.ourSpecials__title {
        font-size: 1.8rem;
        color: var(--yellow-gta);
        margin-bottom: 2rem;
        font-family: 'Pricedown Bl', 'Pricedown', sans-serif;
        text-transform: uppercase;
        letter-spacing: 0.05em;
}
.ourSpecials__wrapper {
        display: flex;
        gap: 1.5rem;
        flex-direction: column;
        max-width: 400px;
}
.ourSpecials__item {
        flex: 1;
        display: flex;
        gap: 2rem;
        background-color: rgba(26, 26, 46, 0.9);
        padding: 1.5rem;
        border-radius: 12px;
        border: 1px solid rgba(255, 165, 0, 0.4);
}
.ourSpecials__item__img,
.ourSpecials__item__info {
        flex: 1;
}
.ourSpecials__item__img {
        border-radius: 12px;
        overflow: hidden;
}
.ourSpecials__item__img img {
    object-fit: cover;
}
.ourSpecials__item__title {
        font-size: 2.4rem;
        font-weight: 500;
        margin-bottom: 1rem;
        color: var(--white-1);
        line-height: 1.2em;
        font-family: 'Bank Gothic', sans-serif;
}
.ourSpecials__item__price {
        font-size: 1.8rem;
        color: var(--pink-gta);
        font-weight: 600;
        margin-bottom: 1rem;
}
.ourSpecials__item__stars {
        width: max-content;
}
@media only screen and (min-width: 768px) {
        .ourSpecials__title {
                font-size: 2.4rem;
        }
        .ourSpecials__wrapper {
                flex-direction: row;
                gap: 2rem;
                max-width: none;
        }
        .ourSpecials__item {
                padding: 3rem;
                gap: 2rem;
        }
        .ourSpecials__item__title {
                font-size: 3rem;
                margin-bottom: 1.5rem;
        }
        .ourSpecials__item__price {
                font-size: 2.4rem;
                margin-bottom: 1.5rem;
        }
}
@media only screen and (min-width: 1100px) {
        .ourSpecials__item__img {
                flex: 4;
        }
        .ourSpecials__item__info {
                flex: 3;
        }
}

/* Dish Grid Styles */
#dishGrid {
        padding-bottom: 0;
}
#dishGrid:last-of-type {
        padding-bottom: 10rem;
}

/* Estilos para items del grid dinámico */
.dishGrid__wrapper { display: grid; grid-template-columns: 1fr; gap: 2.4rem; }

/* Estilo tipo carta: filas con título a la izquierda y precio a la derecha */
.menuRow {
    padding-bottom: 1.6rem;
    border-bottom: 1px dashed var(--pink-gta);
}
.menuRow__header {
    display: flex;
    align-items: center;
    gap: .6rem;
    flex-wrap: nowrap;
}
.menuRow__title {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--yellow-gta);
    text-transform: uppercase;
    letter-spacing: .02em;
    font-family: 'Bank Gothic', sans-serif;
}
.menuRow__dots {
    flex: 1 1 auto;
    border-bottom: 2px dotted rgba(255, 165, 0, 0.3);
    transform: translateY(-2px);
}
.menuRow__price {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--pink-gta);
    white-space: nowrap;
    font-family: 'Bank Gothic', sans-serif;
}
.menuRow__unit { font-size: 1.1rem; color: var(--yellow-gta); font-weight: 400; }
.menuRow__desc { font-size: 1.4rem; color: var(--yellow-gta); margin-top: .6rem; }
.menuRow__meta { font-size: 1.2rem; color: #888; margin-top: .4rem; }

@media only screen and (min-width: 768px) {
    .menuRow__title { font-size: 2rem; }
    .menuRow__price { font-size: 1.8rem; }
}

/* Menu Images Section */
#menuImages {
    padding-top: 2rem;
    padding-bottom: 5rem;
}
.menu__images__wrapper {
    display: flex;
    flex-direction: column;
    gap: 3rem;
    max-width: 900px;
    margin: 0 auto;
}
.menu__image__box {
    position: relative;
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    border: 3px solid var(--yellow-gta);
    background: rgba(26, 26, 46, 0.9);
    transition: all 0.3s ease;
}
.menu__image__box--pink {
    border-color: var(--pink-gta);
}
.menu__image__box:hover {
    transform: translateY(-5px);
    border-color: var(--pink-gta);
}
.menu__image__box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
@media only screen and (min-width: 768px) {
    #menuImages {
        padding-top: 3rem;
        padding-bottom: 8rem;
    }
    .menu__images__wrapper {
        gap: 4rem;
    }
}
