/* ==========================================================================
   CECILIA — menu page
   Two-level tabs: Food / Drinks, then sub-sections.
   ========================================================================== */

.menu{padding:clamp(2.5rem,5vw,4rem) 0 clamp(3.5rem,7vw,5rem)}

/* ---- top tabs (Food / Drinks) ------------------------------------------ */
.toptabs{
  display:flex;justify-content:center;gap:clamp(1.5rem,5vw,3.5rem);
  border-bottom:1px solid var(--rule);margin-bottom:clamp(2rem,4vw,3rem);
}
.toptab{
  font-family:var(--display);font-size:clamp(1.6rem,4vw,2.4rem);font-weight:400;
  background:none;border:0;cursor:pointer;color:var(--muted);
  padding:0 0 1rem;position:relative;transition:color .25s ease;line-height:1;
}
.toptab::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:var(--ink);transform:scaleX(0);transition:transform .3s ease;
}
.toptab:hover{color:var(--ink)}
.toptab[aria-selected="true"]{color:var(--ink)}
.toptab[aria-selected="true"]::after{transform:scaleX(1)}

[data-toppanel][hidden]{display:none}

/* ---- sub tabs ----------------------------------------------------------- */
.subtabs{
  display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem clamp(1rem,2.5vw,1.8rem);
  margin-bottom:clamp(2.2rem,5vw,3.5rem);
}
.subtab{
  font-family:var(--body);font-size:.72rem;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;background:none;border:0;cursor:pointer;color:var(--muted);
  padding:.5rem 0;position:relative;transition:color .2s ease;
}
.subtab::after{
  content:"";position:absolute;left:0;right:0;bottom:.15rem;height:1px;
  background:var(--wine);transform:scaleX(0);transition:transform .28s ease;
}
.subtab:hover{color:var(--wine)}
.subtab[aria-selected="true"]{color:var(--ink)}
.subtab[aria-selected="true"]::after{background:var(--ink);transform:scaleX(1)}

[data-subpanel]{animation:rise .35s ease both}
[data-subpanel][hidden]{display:none}
@keyframes rise{from{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:none}}

/* ---- dishes ------------------------------------------------------------- */
.menu__body{max-width:62rem;margin:0 auto}
.course{margin-bottom:clamp(2.4rem,5vw,3.4rem);max-width:62rem;margin-left:auto;margin-right:auto}
.course:last-child{margin-bottom:0}
.course__title,
.course > h3{
  font-family:var(--body);font-size:.72rem;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--muted);
  padding-bottom:.8rem;margin-bottom:1.6rem;border-bottom:1px solid var(--rule);
}
.dishes{display:grid;gap:1.4rem}
@media(min-width:54em){.dishes{grid-template-columns:1fr 1fr;gap:1.5rem 3.5rem}}
.dish{display:flex;justify-content:space-between;align-items:baseline;gap:1.2rem}
.dish__main{display:flex;flex-direction:column;gap:.25rem}
.dish__name{display:block;font-family:var(--display);font-size:1.1rem;font-weight:500;line-height:1.2}
.dish__desc{display:block;font-size:.82rem;color:var(--ink-soft);line-height:1.45;text-wrap:pretty}
.dish__price{font-family:var(--body);font-size:.84rem;font-weight:500;color:var(--ink);white-space:nowrap}

/* ---- rede de seguranca do editor visual ---------------------------------
   Se o cliente criar um item novo no editor, ele sai sem as classes do
   site (.dish, .dish__main...). As regras abaixo fazem esse item herdar
   o layout mesmo assim, em vez de virar uma linha solta e torta.
   -------------------------------------------------------------------- */
.dishes > li:not(.dish):not(.wine){
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.25rem 1.2rem;
  font-family:var(--display);font-size:1.1rem;font-weight:500;line-height:1.2;
}
/* prato "achatado": o editor tirou o div pai e deixou os spans soltos.
   Nome e preco ficam na primeira linha, descricao desce inteira embaixo. */
.dishes > li:not(.dish) > .dish__name{order:0}
.dishes > li:not(.dish) > .dish__price{order:1}
.dishes > li:not(.dish) > .dish__desc{order:2;flex-basis:100%;text-align:left}
/* paragrafo solto dentro de uma secao do menu */
.course > p{font-size:.82rem;color:var(--ink-soft);line-height:1.45}
/* item novo numa coluna do set menu */
.setmenu__col > ul > li{font-size:.84rem;color:var(--ink-soft);line-height:1.5;text-wrap:pretty}

/* ---- wine (two price cols) --------------------------------------------- */
.winehead{display:none}
.wines{max-width:62rem;margin:0 auto;display:grid;gap:1.5rem 3.5rem!important;grid-template-columns:1fr!important}
@media(min-width:54em){.wines{grid-template-columns:1fr 1fr!important}}
.wine{display:grid;grid-template-columns:1fr auto auto;gap:0 1rem;align-items:baseline}
.wine > span{text-align:right;font-family:var(--body);font-size:.84rem;font-weight:500;min-width:2.6rem}
.wine__main{display:flex;flex-direction:column;gap:.2rem}

/* ---- set menu ----------------------------------------------------------- */
.setmenu__head{max-width:34rem;margin:0 auto clamp(2rem,4vw,2.6rem);text-align:center}
.setmenu__head .lede{font-size:.92rem;max-width:none;margin:0 auto}
.setmenu__grid{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule)}
@media(min-width:54em){.setmenu__grid{grid-template-columns:1fr 1fr}}
.setmenu__col{background:var(--bianco);padding:clamp(1.6rem,3vw,2.4rem)}
.setmenu__price{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  padding-bottom:1rem;margin-bottom:1.6rem;border-bottom:1px solid var(--ink)}
.setmenu__price h3{font-size:1.6rem}
.setmenu__price span{font-family:var(--body);font-size:.9rem;font-weight:600;letter-spacing:.04em}
.setmenu__col h4{font-family:var(--body);font-size:.64rem;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted);margin:1.6rem 0 .8rem}
.setmenu__col h4:first-of-type{margin-top:0}
.setlist{display:grid;gap:.55rem}
.setlist li{font-size:.84rem;color:var(--ink-soft);line-height:1.5;text-wrap:pretty}

/* ---- foot --------------------------------------------------------------- */
.fine{max-width:52ch;font-size:.8rem;line-height:1.65;color:var(--muted);text-wrap:pretty}
.menu__foot{max-width:62rem;margin:clamp(3rem,6vw,4.5rem) auto 0;padding-top:clamp(2rem,4vw,3rem);
  border-top:1px solid var(--rule);display:flex;flex-direction:column;gap:1.6rem;align-items:flex-start}

/* wine legend (glass/bottle) */
.wine-legend{font-family:var(--body);font-size:.62rem;font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin-left:.6rem}