.menu .container {
    max-width: 100%;
    margin: 0 auto;
    padding: 64px 20px;
}

@media (min-width: 1200px) {
    .menu .container {
        padding-left: 6rem;
        padding-right: 6rem;
    }
}

.menu h2 {
    font-size: 2.5rem;
    margin: 0 0 1.25rem;
    color: var(--color-text);
}

.menu-hero {
    padding: 56px 20px 12px;
}

.menu-hero h1 {
    margin: 0;
    font-family: 'Avenir', system-ui, sans-serif;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: clamp(28px, 3.6vw, 46px);
    color: var(--color-text);
}

.menu-hero .subtitle {
    color: #808680;
    margin-top: 6px;
}

.tt-group-title, .tt-degustation h3 {
    font-family: 'Avenir', system-ui, sans-serif;
    text-transform: uppercase!important;
    letter-spacing: .08em;
    font-size: 1.8rem;
    margin: 1.5rem 0 .5rem;
    color: var(--color-text);
    text-decoration: underline;
}


@media (max-width: 560px) {
    .menu-hero {
        padding: 32px 14px 12px;
    }

    .menu .container {
        padding: 28px 14px;
    }
    
}
