@media (max-width: 1100px) and (min-width: 900px) {
  .conteudoLimitado { width: min(var(--larguraConteudo), calc(100% - 28px)); }
  .aplicacaoPedido { grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; }
  .produtoConteudo { padding: 15px; }
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--corFocoClaro); outline-offset: 2px; box-shadow: 0 0 0 5px var(--corFoco); }

@media (max-width: 999px) {
  .cabecalhoPedidoLinha:has(.horarioFuncionamento:not([hidden])) { grid-template-columns: minmax(0, 1fr) auto; row-gap: 10px; padding-block: 12px; }
  .horarioFuncionamento { grid-column: 1 / -1; grid-row: 2; }
  .cabecalhoPedidoLinha:has(.horarioFuncionamento:not([hidden])) .acoesCabecalhoPedido { grid-column: 2; grid-row: 1; }
}

@media (max-width: 899px) {
  .conteudoLimitado { width: min(100% - 28px, var(--larguraConteudo)); }
  .aplicacaoPedido { padding-top: 28px; display: block; }
  .cabecalhoCatalogo { align-items: flex-start; }
  .carrinhoLateral { position: fixed; z-index: 70; inset: 0 0 0 auto; top: 0; width: min(480px, 100%); height: 100dvh; min-height: 0; border: 0; border-left: 1px solid var(--corBorda); border-radius: 0; transform: translateX(102%); transition: transform .28s cubic-bezier(.2, .8, .2, 1); }
  .carrinhoLateral.aberto { transform: none; }
  .carrinhoFechar { display: block; }
  .barraCarrinhoMobile { display: flex; }
  .rodapePedido { padding-bottom: 104px; }
  .notificacao { bottom: 90px; }
}

@media (max-width: 680px) {
  :root { --raioCard: 17px; }
  .conteudoLimitado { width: min(100% - 24px, var(--larguraConteudo)); }
  .cabecalhoPedidoLinha { min-height: 70px; }
  .marcaPedido { gap: 9px; }
  .marcaPedido picture { width: 46px; height: 46px; }
  .marcaPedido strong { font-size: .95rem; }
  .marcaPedido small { font-size: .64rem; }
  .voltarSite { display: none; }
  .cabecalhoPedidoLinha:has(.horarioFuncionamento:not([hidden])) .acoesCabecalhoPedido { flex-direction: column; align-items: flex-end; gap: 3px; }
  .cabecalhoPedidoLinha:has(.horarioFuncionamento:not([hidden])) .botaoCarrinhoCabecalho { order: -1; }
  .cabecalhoPedidoLinha:has(.horarioFuncionamento:not([hidden])) .voltarSite { min-height: 28px; display: inline-flex; align-items: center; font-size: .7rem; }
  .botaoCarrinhoCabecalho { min-height: 42px; padding-left: 13px; font-size: .76rem; }
  .contadorCarrinho { min-width: 25px; height: 25px; }
  .aplicacaoPedido { padding-top: 24px; }
  .cabecalhoCatalogo { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; margin-bottom: 20px; }
  .cabecalhoCatalogo h1 { font-size: clamp(2.15rem, 11vw, 3.3rem); }
  .cabecalhoCatalogo p:not(.secaoRotulo) { grid-column: 1 / -1; margin-top: 10px; font-size: .82rem; }
  .seloPreco { min-width: 102px; padding: 11px 12px; }
  .seloPreco strong { font-size: 1.06rem; }
  .seloPreco span { font-size: .62rem; }
  .gradeProdutos { grid-template-columns: 1fr; gap: 10px; }
  .cartaoProduto { min-height: 210px; display: grid; grid-template-columns: 112px minmax(0, 1fr); }
  .produtoImagem { height: 100%; aspect-ratio: auto; }
  .produtoConteudo { padding: 13px; }
  .produtoConteudo h3 { margin-top: 7px; font-size: 1.08rem; }
  .produtoConteudo > p { display: none; }
  .produtoMeta span:last-child { display: none; }
  .produtoCompra { margin-top: 11px; grid-template-columns: 1fr; gap: 8px; }
  .produtoPreco { display: flex; align-items: baseline; gap: 6px; }
  .produtoPreco strong { font-size: .88rem; }
  .produtoPreco small { font-size: .62rem; }
  .seletorQuantidadeProduto button, .controleQuantidade button { width: 36px; height: 36px; }
  .controleQuantidade .entradaQuantidade { height: 34px; }
  .botaoAdicionar { min-height: 39px; font-size: .76rem; }
  .carrinhoCabecalho { padding: 17px 18px 12px; }
  .indicadorEtapas { padding-inline: 18px; }
  .listaCarrinho { padding-inline: 18px; }
  .carrinhoResumo { padding: 14px 18px calc(16px + env(safe-area-inset-bottom)); }
  .formularioPedido, .conteudoRevisao { padding: 18px; }
  .checkoutAcoes { bottom: -18px; margin: 18px -18px -18px; padding-inline: 18px; grid-template-columns: 1fr; }
  .campoOpcao, .campoAgrupado:has(input[name="pagamentoId"]) .campoOpcao, .gradeCampos, .gradeCamposCidade { grid-template-columns: 1fr; }
  .rodapePedido .conteudoLimitado { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .rodapePedido .conteudoLimitado p { grid-column: auto; grid-row: auto; justify-self: center; text-align: center; }
  .modalProduto { width: 100%; max-height: 92dvh; margin: auto 0 0; border-radius: 20px 20px 0 0; }
  .modalCorpo { max-height: calc(92dvh - 84px); padding: 20px 18px; }
  .modalRodape { margin: 20px -18px -20px; padding-inline: 18px; }
}

@media (max-width: 480px) {
  .horarioFuncionamento { width: 100%; flex-direction: column; gap: 7px; padding: 8px 12px; border-radius: 18px; }
}

@media (max-width: 359px) {
  .cabecalhoCatalogo { grid-template-columns: 1fr; }
  .seloPreco { width: max-content; text-align: left; }
  .cartaoProduto { grid-template-columns: 96px minmax(0, 1fr); }
  .produtoConteudo { padding: 11px; }
  .produtoConteudo h3 { font-size: 1rem; }
  .seletorQuantidadeProduto { padding: 2px; }
  .seletorQuantidadeProduto button { width: 36px; height: 36px; }
  .barraCarrinhoMobile { right: 8px; left: 8px; padding-inline: 12px; }
  .barraCarrinhoMobile > span:last-child { font-size: .68rem; }
  .itemCarrinho { grid-template-columns: 54px minmax(0, 1fr); }
  .itemCarrinhoMidia { width: 54px; height: 54px; }
}