/* Home atualizada a partir do arquivo Holy Garlic — Home no Figma. */
.header .nav a { color: #fff; }
.hero__mobile-photo { display: none; }
/* Evita rolagem horizontal sem interferir nos menus que acompanham a página. */
body { overflow-x: clip; }
@media (min-width: 1000px) {
  #promocoes > .container { width: calc(100% - 64px); max-width: 1440px; }
  #promocoes .promos { gap: 24px; }
  #promocoes .promo__media { aspect-ratio: 4 / 3; }
  #promocoes .promo__body { padding: 24px; gap: 10px; }
  #promocoes .promo h3 { font-size: 2.2rem; }
  #promocoes .promo p { font-size: 1rem; }
  #promocoes .promo__prices strong { font-size: 1.8rem; }
}
#menu-tabs {
  position: sticky;
  top: var(--header-h);
  z-index: 40;
  padding-top: 14px;
  padding-bottom: 14px;
  background: var(--bg-2);
  box-shadow: 0 8px 16px rgba(0, 0, 0, .18);
}
.cta {
  background: linear-gradient(rgba(10, 10, 11, .58), rgba(10, 10, 11, .8)), url("../assets/img/delivery-holy.png") center / cover no-repeat;
}
.cta::before, .cta::after { display: none; }
.cta p { color: var(--cream); }
#order-sidebar { display: none; }
@media (min-width: 1100px) {
  #cardapio > .container { width: calc(100% - 64px); max-width: 1440px; }
  .menu-order-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 28px; align-items: start; }
  .menu-order-products { min-width: 0; }
  .menu-order-products .menu-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #order-sidebar { display: block; position: sticky; top: calc(var(--header-h) + 16px); scroll-margin-top: calc(var(--header-h) + 16px); }
  #order-sidebar .drawer { position: static; display: block; z-index: auto; }
  #order-sidebar .drawer__backdrop, #order-sidebar .drawer__close { display: none; }
  #order-sidebar .drawer__panel { position: static; width: 100%; height: auto; max-height: calc(100vh - var(--header-h) - 32px); border: 1px solid var(--line-2); border-radius: var(--radius); transform: none; animation: none; overflow: hidden; }
  #order-sidebar .drawer__body { min-height: 0; }
  #order-sidebar .drawer__head, #order-sidebar .drawer__foot { flex-shrink: 0; }
  #order-sidebar .cart-item { grid-template-columns: 44px minmax(0, 1fr) auto; gap: 10px; }
  #order-sidebar .cart-item__thumb { width: 44px; height: 44px; }
  #order-sidebar .cart-item__price { grid-column: 2 / -1; text-align: right; }
  .cart-bar { display: none; }
  body.has-cart { padding-bottom: 0; }
}
.local { grid-template-columns: 1fr; }
.header .nav a:hover { color: var(--accent); }
.hero--figma {
  display: flex;
  flex-direction: column;
  min-height: clamp(800px, 70vw, 1120px);
  height: auto;
  padding: 0 0 32px;
}
.hero--figma.has-banner .hero__bg {
  background-image: url("../assets/img/hero-burger-batatas.png");
  inset: 0 0 auto;
  height: 64.4663vw;
  max-height: 1031px;
  background-position: top center;
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-color: var(--bg);
}
.hero--figma.has-banner .hero__bg::after { display: none; }
.hero--figma .hero__brand {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: clamp(40px, 3.8624vw, 62px);
  transform: translateX(-50%);
  width: clamp(130px, 11.1657vw, 179px);
  height: auto;
}
.hero--figma .hero__inner {
  display: block;
  width: calc(100% - 11.6573%);
  max-width: 1414px;
  padding-top: clamp(180px, 15.0281vw, 240px);
}
.hero--figma .hero__content { max-width: 757px; }
.hero--figma .badge { font-size: .7788rem; padding: 7.33px 12.827px; gap: 7.33px; }
.hero--figma .hero__title {
  font-size: clamp(48px, 5.0837vw, 81.35px);
  line-height: 1;
  margin: 28px 0 5px;
}
.hero--figma .hero__lead {
  max-width: 604px;
  font-size: 16.858px;
  line-height: 26.973px;
  margin: 14px 0 27px;
}
.hero--figma .hero__cta .btn--primary {
  background: linear-gradient(90deg, #b00425, #e0262b);
  color: #fff;
}
.hero--figma .hero__cta .btn--primary:hover { background: linear-gradient(90deg, #97031f, #c92025); }
.header__actions > .btn--primary { background: #b00425; color: #fff; }
.header__actions > .btn--primary:hover { background: #97031f; }
.hero--figma .hero__note {
  position: absolute;
  top: min(44.03vw, 870px);
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  max-width: calc(100% - 32px);
  text-align: center;
  margin: 0;
}
.hero--figma > .container:last-child {
  position: relative;
  margin-top: auto;
  padding-top: 48px;
}
.hero--figma .trust { margin: 0; }
@media (max-width: 1000px) {
  .hero--figma { height: auto; min-height: 900px; padding-bottom: 48px; }
  .hero--figma.has-banner .hero__bg { height: 900px; background-position: center bottom; }
  .hero--figma.has-banner .hero__bg::after {
    display: block;
    background: linear-gradient(90deg, rgba(10,10,11,.85), rgba(10,10,11,.25)), linear-gradient(0deg, var(--bg), transparent 35%);
  }
  .hero--figma .hero__inner { width: calc(100% - 48px); padding-top: 210px; }
  .hero--figma .hero__content { max-width: 600px; }
  .hero--figma .hero__title { font-size: clamp(36px, 7.2vw, 66px); overflow-wrap: anywhere; }
  .hero--figma .hero__note { position: relative; top: auto; left: auto; transform: none; width: auto; margin: 44px auto 48px; }
  .hero--figma > .container:last-child { position: relative; top: auto; left: auto; transform: none; }
}
@media (max-width: 520px) {
  .hero--figma .hero__note { margin-bottom: 260px; }
  .hero--figma .hero__inner { width: calc(100% - 32px); padding-top: 190px; }
  .hero--figma .hero__lead { font-size: 1rem; line-height: 1.6; }
  .hero--figma .hero__cta { flex-direction: column; align-items: stretch; }
  .hero--figma .hero__cta .btn { width: 100%; }
}

/* Ajustes para celulares e tablets, incluindo telas estreitas e modo paisagem. */
@media (max-width: 1099px) {
  .hero--figma { height: auto; min-height: 0; padding: 28px 0 40px; }
  .hero--figma.has-banner .hero__bg { display: none; }
  .hero--figma .hero__brand { position: relative; top: auto; left: auto; transform: none; width: clamp(104px, 16vw, 145px); margin: 0 auto 28px; }
  .hero--figma .hero__inner { width: min(100% - 32px, 820px); padding-top: 0; }
  .hero--figma .hero__content { max-width: 720px; margin-inline: auto; }
  .hero--figma .hero__title { font-size: clamp(32px, 7vw, 64px); margin: 22px 0 16px; overflow-wrap: normal; }
  .hero--figma .hero__lead { max-width: 640px; font-size: 1rem; line-height: 1.65; margin-bottom: 24px; }
  .hero--figma .hero__note { position: static; transform: none; width: auto; max-width: 640px; margin: 24px 16px; font-size: .82rem; }
  .hero--figma .hero__mobile-photo { display: block; width: 100%; height: auto; margin: 0 auto 28px; }
  .hero--figma > .container:last-child { position: static; transform: none; margin-top: 0; padding-top: 0; width: min(100% - 32px, 820px); }
  .hero--figma .trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trust li { padding: 16px 12px; gap: 10px; }
  .trust strong { font-size: .85rem; }
  .trust small { font-size: .75rem; }
  .section { padding: clamp(40px, 7vw, 72px) 0; }
  .section__title { font-size: clamp(32px, 5.6vw, 52px); }
  .section__lead { font-size: 1rem; }
  .promos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .promo__body { padding: 18px; }
  .item__actions { flex-wrap: wrap; }
  .tabs button, .cart-item__qty button, .item__custom, .item__add { min-height: 44px; }
  .cart-item__qty button { width: 36px; }
  .drawer__panel { max-height: calc(100dvh - 24px); }
  .drawer__body { min-height: 0; overscroll-behavior: contain; }
  .drawer__foot { padding-bottom: max(18px, env(safe-area-inset-bottom)); }
  .modal__panel, .checkout__panel { max-height: 94dvh; }
  .cart-bar { padding-bottom: max(12px, env(safe-area-inset-bottom)); }
  .cta { padding: 56px 0; }
  .cta__logo { width: clamp(170px, 30vw, 280px); }
  .cta p { font-size: 1rem; }
}
@media (max-width: 600px) {
  .header__inner { gap: 8px; }
  .header__actions { gap: 8px; }
  .header .brand__logo { height: 50px; }
  .promos { grid-template-columns: minmax(0, 1fr); }
  .promo__media { aspect-ratio: 4 / 3; }
  .promo__foot { gap: 14px; }
  .promo__foot .item__actions { flex-wrap: nowrap; }
  .menu-grid { grid-template-columns: minmax(0, 1fr); }
  .item__media { width: clamp(82px, 25vw, 130px); }
  .item__body { flex: 1; padding: 12px; }
  .item__actions { gap: 6px; }
  .item__custom { font-size: .75rem; padding: 8px; }
  .item__add { font-size: .78rem; padding: 10px; }
  .item__foot { align-items: flex-start; }
  #menu-tabs { padding-block: 10px; gap: 6px; }
  .tabs button { flex-shrink: 0; }
  .hero--figma .hero__title { font-size: clamp(32px, 8.5vw, 48px); letter-spacing: .01em; }
  .hero--figma .badge { max-width: 100%; font-size: .72rem; padding: 8px 10px; }
  .hero--figma .hero__cta, .cta__actions { flex-direction: column; width: 100%; }
  .cta__actions .btn { width: 100%; }
  .local__actions { flex-wrap: wrap; }
  .local__actions .btn { width: 100%; white-space: normal; }
  .local__info { padding: 24px 16px; }
  .hours li { gap: 8px; }
  .footer__grid { grid-template-columns: minmax(0, 1fr); }
  .footer__bottom { gap: 12px; flex-wrap: wrap; }
  .cart-bar__inner { gap: 8px; }
  .cart-bar__inner > .btn { padding-inline: 18px; }
  .cart-item { grid-template-columns: 38px minmax(0, 1fr) auto; gap: 8px; }
  .cart-item__thumb { width: 38px; height: 38px; }
  .cart-item__info strong { font-size: .85rem; }
  .cart-item__qty { gap: 2px; }
  .drawer__head, .drawer__body, .drawer__foot { padding-inline: 16px; }
  .cookies__texto { font-size: .8rem; }
  .cookies { padding-block: 12px; }
}

/* Fotos de produtos verticais: área maior e recorte mais baixo para não cortar o prato. */
.menu-grid .item__media {
  aspect-ratio: 4 / 5;
}
.menu-grid .item__media.has-photo img {
  object-position: center 60%;
}
@media (max-width: 360px) {
  .header .btn--sm { padding-inline: 10px; font-size: .78rem; }
  .header__actions { gap: 6px; }
  .header .brand__logo { height: 44px; }
  .item__media { width: 80px; }
  .item__name { font-size: 1.15rem; }
  .trust li { padding: 12px 8px; gap: 7px; }
  .trust svg { width: 28px; height: 28px; padding: 5px; }
}
@media (min-width: 1100px) and (max-width: 1279px) {
  .menu-order-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; }
  .menu-order-products .menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-height: 600px) and (max-width: 1099px) {
  .drawer__panel, .modal__panel, .checkout__panel { max-height: 96dvh; }
  .drawer__foot { gap: 6px; padding-top: 10px; }
  .drawer__foot .btn { padding-block: 12px; }
}

/* Banner compacto no celular, com a foto atrás do conteúdo. */
@media (max-width: 600px) {
  .hero--figma { padding: 40px 0 32px; }
  .hero--figma .hero__brand,
  .hero--figma .hero__mobile-photo { display: none; }
  .hero--figma.has-banner .hero__bg {
    display: block;
    inset: 0;
    height: 100%;
    max-height: none;
    background-size: cover;
    background-position: 62% center;
  }
  .hero--figma.has-banner .hero__bg::after {
    display: block;
    background: linear-gradient(90deg, rgba(10,10,11,.9), rgba(10,10,11,.62)), linear-gradient(0deg, var(--bg), transparent 50%);
  }
  .hero--figma .hero__inner { position: relative; z-index: 1; }
  .hero--figma .hero__cta { flex-direction: row; align-items: center; gap: 10px; flex-wrap: wrap; }
  .hero--figma .hero__cta .btn {
    width: auto;
    padding: 12px 16px;
    font-size: .82rem;
    min-height: 44px;
    gap: 7px;
  }
  .hero--figma .hero__note { position: relative; z-index: 1; margin: 22px 16px 28px; }
}
@media (max-width: 360px) {
  .hero--figma .hero__cta .btn { padding-inline: 12px; font-size: .76rem; }
}

/* Teste: dois produtos por fileira no celular. */
@media (max-width: 600px) {
  .menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .menu-grid .item { flex-direction: column; min-width: 0; }
  .menu-grid .item__media { width: 100%; aspect-ratio: 4 / 5; flex: none; }
  .menu-grid .item__media img { width: 100%; height: 100%; object-fit: cover; }
  .menu-grid .item__body { padding: 10px; gap: 6px; }
  .menu-grid .item__name { font-size: 1.2rem; overflow-wrap: anywhere; }
  .menu-grid .item__desc { font-size: .75rem; line-height: 1.45; }
  .menu-grid .item__foot { flex-direction: column; align-items: stretch; gap: 8px; }
  .menu-grid .item__actions { flex-direction: column; align-items: stretch; gap: 6px; }
  .menu-grid .item__actions button { width: 100%; min-height: 40px; font-size: .75rem; padding: 9px 6px; justify-content: center; }
  .menu-grid .item__price { font-size: 1.1rem; }
}

/* Avaliações: dois cards visíveis por vez no celular. */
@media (max-width: 600px) {
  #depoimentos .marquee { padding-inline: 16px; }
  #depoimentos .marquee__track {
    width: 100%;
    gap: 10px;
    animation: none;
    transform: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-bottom: 8px;
  }
  #depoimentos .marquee__track::-webkit-scrollbar { display: none; }
  #depoimentos .review {
    width: calc((100% - 10px) / 2);
    flex: 0 0 calc((100% - 10px) / 2);
    min-width: 0;
    padding: 16px 12px;
    scroll-snap-align: start;
  }
  #depoimentos .review p { font-size: .8rem; line-height: 1.5; overflow-wrap: anywhere; }
  #depoimentos .review__stars { font-size: .85rem; letter-spacing: .04em; margin-bottom: 10px; }
  #depoimentos .review footer { flex-direction: column; gap: 4px; font-size: .75rem; }
}
@media (max-width: 600px) {
  #depoimentos .marquee { mask-image: none; -webkit-mask-image: none; }
  #depoimentos .review[aria-hidden="true"] { display: none; }
}

/* Destaques em duas colunas no celular. */
@media (max-width: 600px) {
  #promocoes .promos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  #promocoes .promo { min-width: 0; }
  #promocoes .promo__media { aspect-ratio: 4 / 3; }
  #promocoes .promo__body { padding: 12px 10px; gap: 7px; }
  #promocoes .promo h3 { font-size: 1.3rem; overflow-wrap: anywhere; }
  #promocoes .promo p { font-size: .75rem; line-height: 1.5; }
  #promocoes .promo__when { font-size: .6rem; letter-spacing: .07em; }
  #promocoes .promo__badge { font-size: 1.1rem; padding: 6px 9px; top: 8px; left: 8px; }
  #promocoes .promo__foot { flex-direction: column; align-items: stretch; gap: 10px; }
  #promocoes .promo__prices strong { font-size: 1.25rem; }
  #promocoes .promo__prices s { font-size: .7rem; }
  #promocoes .promo__foot .item__actions { flex-direction: column; align-items: stretch; gap: 6px; }
  #promocoes .item__actions button { width: 100%; min-height: 40px; font-size: .75rem; padding: 9px 6px; justify-content: center; }
}

/* Categorias mais compactas no celular. */
@media (max-width: 600px) {
  #menu-tabs { gap: 5px; padding-block: 8px; }
  #menu-tabs button { min-height: 36px; padding: 9px 12px; font-size: .75rem; line-height: 1.2; }
}
@media (max-width: 360px) {
  #menu-tabs button { padding-inline: 10px; font-size: .7rem; }
}
