@import url('https://fonts.googleapis.com/css2?family=Lobster&family=Nunito+Sans:wght@400;700;800&display=swap');

:root { --gold: #f7c945; --ink: #312319; --white: #fff; }
* { box-sizing: border-box; }
html { min-width: 320px; }
body { margin: 0; color: var(--ink); background: #fff; font-family: 'Nunito Sans', sans-serif; }
.topbar { min-height: 124px; padding: 10px 3.5%; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; position: relative; background: #fff; }
.brand { grid-column: 2; justify-self: center; width: 76px; height: 94px; display: grid; place-items: center; }
.brand img { max-width: 76px; max-height: 94px; object-fit: contain; mix-blend-mode: multiply; }
.phone { grid-column: 3; justify-self: end; padding: 13px 26px; border: 1px solid #c65e05; border-radius: 28px; color: #b75202; font-weight: 800; text-decoration: none; white-space: nowrap; }
.language-switcher { position: absolute; left: 3.5%; bottom: 16px; display: flex; gap: 4px; }
.language-button { border: 0; background: transparent; color: #6d625a; padding: 5px 7px; cursor: pointer; font: 800 12px 'Nunito Sans', sans-serif; border-radius: 6px; }
.language-button.is-active { background: #f6e8d2; color: #9b4b0a; }
.menu-grid { display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: minmax(280px, 425px); }
.menu-card { min-height: 280px; position: relative; display: flex; align-items: flex-end; padding: clamp(28px, 5vw, 70px); color: var(--white); text-decoration: none; isolation: isolate; background-position: center; background-size: cover; overflow: hidden; }
.menu-card[hidden] { display: none; }
.menu-card::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(20, 10, 5, .68), rgba(20, 10, 5, .08)); transition: background .3s ease; }
.menu-card:hover::before, .menu-card:focus-visible::before { background: linear-gradient(90deg, rgba(20, 10, 5, .8), rgba(20, 10, 5, .2)); }
.card-content { max-width: 620px; position: relative; z-index: 1; }
h2 { margin: 0 0 8px; color: #fff; font: 400 clamp(30px, 3.2vw, 43px)/1.05 Lobster, cursive; text-shadow: 1px 2px 3px rgba(0,0,0,.25); }
.menu-card p { margin: 0 0 22px; font-size: clamp(15px, 1.35vw, 18px); line-height: 1.45; }
.card-link { display: inline-block; padding: 12px 31px; background: var(--gold); border-radius: 25px; color: #fff; font-weight: 800; font-size: 16px; }
.card-entradas { background-image: url('http://www.familiamineira.com.br/contactless/img/pratos/SelecaoPetisco.jpg'); }
.card-executive { background-image: url('http://www.familiamineira.com.br/contactless/img/pratos/PicoDoIbituruna.jpg'); }
.card-night { background-image: url('http://www.familiamineira.com.br/contactless/img/pratos/CostelaBarbecue9x6.jpg'); }
.card-mineira { background-image: url('http://www.familiamineira.com.br/contactless/img/pratos/FeijaoTropeiro.png'); }
.card-desserts { background-image: url('http://www.familiamineira.com.br/contactless/img/pratos/Ambrosia.png'); }
.card-drinks { background-image: url('http://www.familiamineira.com.br/contactless/img/pratos/Caipirinha.png'); }
.card-cachaça { background-image: url('http://www.familiamineira.com.br/contactless/img/pratos/Cachacas.png'); }
.card-wines { background-image: url('http://www.familiamineira.com.br/contactless/img/pratos/parreirauva.png'); }
.card-drinks { grid-row: span 1; }
.card-cachaça { grid-row: span 1; }
.card-wines { grid-column: 2; }
@media (max-width: 700px) { .topbar { min-height: 156px; grid-template-columns: 1fr auto; padding: 10px 18px 42px; gap: 10px; } .brand { grid-column: 1 / -1; grid-row: 1; height: 70px; } .brand img { max-height: 70px; } .phone { grid-column: 2; grid-row: 2; font-size: 12px; padding: 10px 15px; } .language-switcher { left: 18px; bottom: 8px; } .menu-grid { grid-template-columns: 1fr; grid-auto-rows: minmax(330px, 68vw); } .menu-card { min-height: 330px; padding: 30px 24px; } .card-wines { grid-column: auto; } h2 { font-size: 34px; } }
