/* =====================================================================
   Feirao do Bras | estilos das paginas internas
   (produto, listagens, carrinho, checkout, conta e paginas de conteudo)
   Carregado junto com loja.css, que traz os tokens e componentes base.
   ===================================================================== */

/* ------------------------------------------------- cabecalho de lista -- */
.cabecalho-lista{padding:20px 0 14px}
.cabecalho-lista h1{font-size:26px;letter-spacing:-.03em}
.cabecalho-lista p{color:var(--tinta-3);font-size:14px;margin-top:5px;max-width:70ch}
.cabecalho-lista--destaque h1{font-size:30px}
.destaque-busca{color:var(--marca)}
.subtitulo{color:var(--tinta-3);font-size:14px;margin-top:5px}

.atalhos-sub{display:flex;gap:8px;overflow-x:auto;padding-bottom:14px;scrollbar-width:none}
.atalhos-sub::-webkit-scrollbar{display:none}
.atalhos-sub a{background:#fff;border:1px solid var(--linha);border-radius:var(--r-full);
  padding:8px 16px;font-size:13.5px;font-weight:600;white-space:nowrap;transition:var(--transicao)}
.atalhos-sub a:hover{border-color:var(--marca);color:var(--marca)}

.chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-bottom:14px;
  font-size:12.5px;color:var(--tinta-3)}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--marca-claro);
  color:var(--marca-escuro);border-radius:var(--r-full);padding:6px 13px;font-size:12.5px;
  font-weight:700;transition:var(--transicao)}
.chip:hover{background:var(--marca);color:#fff}
.chip--limpar{background:none;border:1px solid var(--linha);color:var(--tinta-2)}

.termos-populares{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-bottom:16px;
  font-size:13px;color:var(--tinta-3)}
.sugestao-correcao{background:#FFF8EC;border:1px solid #FDE8C4;border-radius:var(--r);
  padding:12px 16px;font-size:14px;color:#8A5A00;margin-bottom:16px}
.sugestao-correcao a{color:var(--marca);font-weight:800;text-decoration:underline}

/* ---------------------------------------------------------- listagem -- */
.lista{display:grid;grid-template-columns:250px 1fr;gap:22px;align-items:start;
  padding-bottom:30px}
.lista__conteudo{min-width:0}
.lista__barra{display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#fff;border:1px solid var(--linha);border-radius:var(--r);padding:11px 16px;
  margin-bottom:14px;flex-wrap:wrap}
.lista__total{font-size:13.5px;color:var(--tinta-2)}
.lista__controles{display:flex;align-items:center;gap:12px}
.lista__controles [data-abrir-filtros]{display:none}
.ordenar{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--tinta-3)}
.ordenar select{border:1.5px solid var(--linha);border-radius:var(--r-sm);padding:7px 11px;
  font-size:13.5px;font-weight:600;background:#fff;outline:0;cursor:pointer}
.ordenar select:focus{border-color:var(--marca)}

.filtros{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);
  padding:18px;position:sticky;top:120px}
.filtros__topo{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.filtros__topo h2{font-size:15px;display:flex;align-items:center;gap:8px}
.filtros__topo button{display:none;color:var(--tinta-3)}
.filtro-grupo{padding:14px 0;border-top:1px solid var(--linha-2)}
.filtro-grupo:first-of-type{border-top:0;padding-top:0}
.filtro-grupo h3{font-size:12.5px;text-transform:uppercase;letter-spacing:.05em;
  color:var(--tinta-3);margin-bottom:10px}
.filtro-links li a{display:flex;align-items:center;justify-content:space-between;padding:7px 0;
  font-size:13.5px;color:var(--tinta-2)}
.filtro-links li a:hover{color:var(--marca)}
.filtro-preco{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.filtro-preco input{width:100%;min-width:0;padding:9px 10px;border:1.5px solid var(--linha);
  border-radius:var(--r-sm);outline:0;font-size:13px}
.filtro-preco input:focus{border-color:var(--marca)}
.filtro-preco span{font-size:12px;color:var(--tinta-3)}
.filtro-faixas{display:grid;gap:5px}
.filtro-faixas a{font-size:13px;color:var(--tinta-2);padding:4px 0}
.filtro-faixas a:hover{color:var(--marca)}
.filtro-opcoes li{padding:4px 0}
.filtro-opcoes label{display:flex;align-items:center;gap:9px;font-size:13.5px;cursor:pointer;
  color:var(--tinta-2)}
.filtro-opcoes input{accent-color:var(--marca);width:16px;height:16px}
.filtros__acoes{display:grid;gap:8px;padding-top:14px;border-top:1px solid var(--linha-2)}

/* ---------------------------------------------------------- produto -- */
.produto{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:40px;
  padding:16px 0 30px}
.galeria{display:grid;grid-template-columns:74px minmax(0,1fr);gap:14px;
  align-items:start;position:sticky;top:120px;max-width:620px}
.galeria__miniaturas{display:grid;gap:9px}
.mini{border:1.5px solid var(--linha);border-radius:var(--r);overflow:hidden;background:#fff;
  aspect-ratio:1;padding:5px;transition:var(--transicao)}
.mini img{width:100%;height:100%;object-fit:contain}
.mini:hover{border-color:var(--tinta-3)}
.mini.ativa{border-color:var(--marca);box-shadow:0 0 0 2px rgba(91,42,224,.14)}
.galeria__principal{position:relative;background:linear-gradient(160deg,#FCFCFE,#F1F2F7);
  border:1px solid var(--linha);border-radius:var(--r-lg);aspect-ratio:1;padding:26px;
  overflow:hidden;cursor:zoom-in}
.galeria__principal img{width:100%;height:100%;object-fit:contain}
.galeria__lupa{position:absolute;bottom:12px;left:12px;display:flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.9);border-radius:var(--r-full);padding:6px 13px;font-size:12px;
  color:var(--tinta-2);font-weight:600}
.galeria__zoom{position:absolute;inset:0;background-repeat:no-repeat;background-size:210%;
  background-color:#fff;z-index:3}
/* no celular nao existe mouse, entao a dica de zoom nao faz sentido */
@media (hover:none){.galeria__lupa{display:none}}

.detalhes__topo{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.detalhes__marca{font-size:12px;font-weight:700;color:var(--tinta-3);text-transform:uppercase;
  letter-spacing:.05em}
.detalhes h1{font-size:26px;line-height:1.25;margin-bottom:10px}
.detalhes__meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:13px;
  color:var(--tinta-3);padding-bottom:16px;border-bottom:1px solid var(--linha-2)}
.detalhes__nota{display:flex;align-items:center;gap:6px}
.detalhes__nota b{color:var(--tinta)}
.detalhes__nota span{color:var(--marca)}
.detalhes__vendidos{font-weight:600}

.preco-bloco{padding:18px 0}
.preco-bloco__de{display:flex;align-items:center;gap:10px;margin-bottom:4px;flex-wrap:wrap}
.preco-bloco__de s{font-size:14px}
.pill-desconto{background:var(--sucesso);color:#fff;font-size:12px;font-weight:800;
  padding:3px 10px;border-radius:var(--r-full)}
.preco-bloco__economia{font-size:12.5px;color:var(--sucesso);font-weight:700}
.preco-bloco__apartir{display:block;font-size:13px;color:var(--tinta-3);font-weight:600;
  margin-bottom:2px}
.preco-bloco__valor{font-size:38px;font-weight:800;letter-spacing:-.04em;line-height:1.1}
.preco-bloco__faixa{font-size:12.5px;color:var(--tinta-3);margin-top:5px}
.preco-bloco__linhas{display:grid;gap:6px;margin-top:8px}
.preco-bloco__parcela,.preco-bloco__pix{display:flex;align-items:center;gap:8px;font-size:14px;
  color:var(--tinta-2)}
.preco-bloco__parcela .ic,.preco-bloco__pix .ic{width:18px;height:18px;color:var(--tinta-3)}
.preco-bloco__pix{color:var(--sucesso);font-weight:600}
.preco-bloco__pix .ic{color:var(--sucesso)}
.pill-pix{background:#E6F6EF;color:var(--sucesso);font-size:11.5px;font-weight:800;
  padding:2px 8px;border-radius:var(--r-full)}

.variacoes{display:grid;gap:16px;padding:16px 0;border-top:1px solid var(--linha-2)}
.variacao__rotulo{display:block;font-size:13.5px;color:var(--tinta-3);margin-bottom:8px}
.variacao__rotulo b{color:var(--tinta);font-weight:700}
.variacao__opcoes{display:flex;flex-wrap:wrap;gap:8px}
.opcao-btn{border:1.5px solid var(--linha);border-radius:var(--r);padding:9px 16px;
  font-size:13.5px;font-weight:600;background:#fff;transition:var(--transicao)}
.opcao-btn:hover{border-color:var(--tinta-3)}
.opcao-btn.ativa{border-color:var(--marca);background:var(--marca-claro);color:var(--marca-escuro);
  box-shadow:0 0 0 2px rgba(91,42,224,.12)}
.variacao__aviso{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--aviso);
  background:#FFF8EC;padding:9px 13px;border-radius:var(--r)}

.compra{display:grid;gap:10px;padding:18px 0;border-top:1px solid var(--linha-2)}
.compra__linha{display:flex;align-items:center;gap:14px;margin-bottom:4px}
.qtd--grande button{width:38px;height:40px}
.qtd--grande input{width:48px;font-size:15px}
.compra__estoque{font-size:13.5px}
.compra__estoque .ok{color:var(--sucesso);display:flex;align-items:center;gap:5px}
.compra__estoque .ok .ic{width:16px;height:16px}
.compra__estoque .alerta{color:var(--aviso)}
.compra__estoque .esgotado{color:var(--alerta)}

.frete-box{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);padding:16px;
  margin-top:6px}
.frete-box h2{font-size:14px;display:flex;align-items:center;gap:8px;margin-bottom:12px}
.frete-box h2 .ic{color:var(--marca)}
.frete-box__form{display:flex;gap:8px}
.frete-box__form input{flex:1;min-width:0;padding:11px 14px;border:1.5px solid var(--linha);
  border-radius:var(--r);outline:0;font-size:14px}
.frete-box__form input:focus{border-color:var(--marca)}
.frete-box__ajuda{display:inline-block;font-size:12px;color:var(--marca);margin-top:8px}
.frete-box__gratis{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--sucesso);
  font-weight:700;margin-top:10px}
.frete-box__gratis .ic{width:16px;height:16px}
.frete-opcoes{margin-top:12px;display:grid;gap:8px}
.frete-opcoes li{display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:10px 12px;background:var(--fundo);border-radius:var(--r);font-size:13.5px}
.frete-opcoes b{display:block}
.frete-opcoes small{font-size:11.5px;color:var(--tinta-3)}
.frete-opcoes__lado{text-align:right}
.frete-opcoes .gratis{color:var(--sucesso)}
.frete-regiao{font-size:12px;color:var(--tinta-3);margin-top:8px}
.frete-erro{font-size:13px;color:var(--alerta);margin-top:10px}

.garantias{display:grid;gap:12px;padding:18px 0;border-top:1px solid var(--linha-2);margin-top:16px}
.garantias li{display:flex;gap:11px;align-items:start}
.garantias .ic{color:var(--marca);flex:none;margin-top:1px}
.garantias b{display:block;font-size:13.5px}
.garantias small{font-size:12.5px;color:var(--tinta-3);line-height:1.4}
.garantias--compacta{border:0;padding:0;margin:12px 0 0;gap:9px}
.garantias--compacta li{font-size:13px;color:var(--tinta-2);align-items:center}

.pagamentos-produto{padding-top:16px;border-top:1px solid var(--linha-2)}
.pagamentos-produto>span{display:block;font-size:11.5px;text-transform:uppercase;
  letter-spacing:.05em;font-weight:800;color:var(--tinta-3);margin-bottom:9px}
.selos--claro .selo{background:var(--linha-2);color:var(--tinta-2)}

/* --------------------------------------------------------------- abas -- */
.abas{background:#fff;border:1px solid var(--linha);border-radius:var(--r-lg);
  margin-bottom:20px;overflow:hidden}
.abas__nav{display:flex;gap:2px;border-bottom:1px solid var(--linha);padding:6px;
  overflow-x:auto;scrollbar-width:none}
.abas__nav::-webkit-scrollbar{display:none}
.abas__nav button{padding:11px 20px;border-radius:var(--r);font-size:14px;font-weight:700;
  color:var(--tinta-3);white-space:nowrap;transition:var(--transicao)}
.abas__nav button:hover{background:var(--linha-2);color:var(--tinta)}
.abas__nav .ativa{background:var(--marca);color:#fff}
.abas__painel{display:none;padding:26px}
.abas__painel.ativo{display:block}
.abas__painel h2{font-size:19px;margin-bottom:14px}
.abas__painel h3{font-size:15px;margin:22px 0 10px}
.texto-rico p{margin-bottom:12px;color:var(--tinta-2);line-height:1.7;font-size:14.5px;
  max-width:78ch}
.lista-produto{display:grid;gap:7px;margin:0 0 14px;padding-left:2px;max-width:78ch}
.lista-produto li{position:relative;padding-left:20px;font-size:14.5px;color:var(--tinta-2);
  line-height:1.6}
.lista-produto li::before{content:'';position:absolute;left:2px;top:9px;width:6px;height:6px;
  border-radius:50%;background:var(--marca)}
.lista-produto--num{counter-reset:passo}
.lista-produto--num li{counter-increment:passo;padding-left:28px}
.lista-produto--num li::before{content:counter(passo);width:19px;height:19px;top:2px;left:0;
  background:var(--marca-claro);color:var(--marca-escuro);font-size:11.5px;font-weight:800;
  display:grid;place-items:center;border-radius:50%}
.aviso-produto{background:#FFF8EC;border-left:3px solid var(--aviso);border-radius:0 var(--r) var(--r) 0;
  padding:11px 14px;font-size:13.5px;color:#8A5A00;margin:14px 0;max-width:78ch}
.texto-rico h3{font-size:15px;margin:20px 0 10px;letter-spacing:-.01em}

.lista-check{display:grid;gap:8px}
.lista-check li{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--tinta-2)}
.lista-check .ic{width:17px;height:17px;color:var(--sucesso);flex:none}
.tabela-specs{width:100%;border-collapse:collapse;max-width:640px}
.tabela-specs th{text-align:left;padding:11px 14px;background:var(--linha-2);font-size:13.5px;
  font-weight:700;width:40%;border-bottom:2px solid #fff}
.tabela-specs td{padding:11px 14px;font-size:13.5px;color:var(--tinta-2);
  border-bottom:1px solid var(--linha-2)}
.vazio-simples{color:var(--tinta-3);font-size:14px;padding:10px 0}
.vazio-simples a{color:var(--marca);font-weight:700}

.avaliacoes__resumo{display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center;
  background:var(--fundo);border-radius:var(--r-md);padding:20px;margin-bottom:22px}
.avaliacoes__media{text-align:center}
.avaliacoes__media b{display:block;font-size:42px;font-weight:800;letter-spacing:-.04em;
  line-height:1}
.avaliacoes__media small{display:block;font-size:12.5px;color:var(--tinta-3);margin-top:4px}
.avaliacoes__barras{display:grid;gap:6px;max-width:380px}
.barra-nota{display:grid;grid-template-columns:38px 1fr 34px;align-items:center;gap:10px;
  font-size:12.5px;color:var(--tinta-3)}
.barra-nota span{display:flex;align-items:center;gap:3px;color:#F5A524}
.barra-nota__trilho{height:7px;background:var(--linha);border-radius:var(--r-full);overflow:hidden}
.barra-nota__trilho i{display:block;height:100%;background:#F5A524;border-radius:var(--r-full)}
.barra-nota em{font-style:normal;text-align:right}

.avaliacoes__lista{display:grid;gap:16px}
.avaliacao{border-bottom:1px solid var(--linha-2);padding-bottom:16px}
.avaliacao__topo{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.avaliacao__autor{font-weight:700;font-size:13.5px}
.avaliacao time{font-size:12px;color:var(--tinta-3)}
.avaliacao__titulo{display:block;font-size:14px;margin-bottom:4px}
.avaliacao p{color:var(--tinta-2);font-size:14px;line-height:1.6;max-width:78ch}

.form-avaliacao{background:var(--fundo);border-radius:var(--r-md);padding:20px;margin-top:22px}
.form-avaliacao h3{margin-top:0}
.form-avaliacao__notas{display:flex;gap:4px;margin-bottom:14px}
.form-avaliacao__notas label{cursor:pointer;color:#DCDFE8}
.form-avaliacao__notas label.ativa{color:#F5A524}
.form-avaliacao__notas input{position:absolute;opacity:0;width:0}
.form-avaliacao__notas .ic{width:26px;height:26px}
.form-avaliacao__grade{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.form-avaliacao input[type=text],.form-avaliacao textarea{width:100%;padding:11px 14px;
  border:1.5px solid var(--linha);border-radius:var(--r);outline:0;font-size:14px;
  font-family:inherit;background:#fff}
.form-avaliacao input:focus,.form-avaliacao textarea:focus{border-color:var(--marca)}
.form-avaliacao textarea{margin-bottom:12px;resize:vertical}

.barra-compra-mobile{display:none;position:fixed;bottom:0;left:0;right:0;background:#fff;
  border-top:1px solid var(--linha);padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  z-index:95;align-items:center;justify-content:space-between;gap:12px;
  box-shadow:0 -4px 18px rgba(16,20,38,.1);transform:translateY(110%);transition:transform .22s}
.barra-compra-mobile.visivel{transform:none}
.barra-compra-mobile b{font-size:19px;font-weight:800;display:block;line-height:1.1}
.barra-compra-mobile small{font-size:11.5px;color:var(--tinta-3)}
.barra-compra-mobile .btn{padding:13px 24px}

/* --------------------------------------------------------- carrinho -- */
.carrinho{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;
  align-items:start;padding-bottom:30px}
.carrinho__itens{display:grid;gap:12px}
.aviso-frete{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--linha);
  border-radius:var(--r-md);padding:14px 18px;font-size:13.5px}
.aviso-frete .ic{color:var(--marca);flex:none}
.aviso-frete div{flex:1}
.aviso-frete b{display:block;margin-bottom:6px}
.aviso-frete a{color:var(--marca);font-weight:700;white-space:nowrap;font-size:13px}
.aviso-frete--ok{background:#E6F6EF;border-color:#BFE8D6;color:#0B6B4B}
.aviso-frete--ok .ic{color:var(--sucesso)}

.item-carrinho{display:grid;grid-template-columns:110px 1fr auto;gap:16px;background:#fff;
  border:1px solid var(--linha);border-radius:var(--r-md);padding:16px}
.item-carrinho__img{background:var(--linha-2);border-radius:var(--r);padding:8px;
  display:grid;place-items:center}
.item-carrinho__img img{width:100%;height:auto;object-fit:contain;max-height:94px}
.item-carrinho__nome{font-size:15px;font-weight:600;line-height:1.35;display:block}
.item-carrinho__nome:hover{color:var(--marca)}
.item-carrinho__var{display:inline-block;font-size:12.5px;color:var(--tinta-2);
  background:var(--linha-2);padding:2px 9px;border-radius:var(--r-sm);margin-top:5px}
.item-carrinho__sku{display:block;font-size:11.5px;color:var(--tinta-3);margin-top:4px}
.item-carrinho__selos{display:flex;gap:5px;margin-top:8px;flex-wrap:wrap}
.item-carrinho__acoes{display:flex;gap:16px;margin-top:12px}
.item-carrinho__acoes button{display:flex;align-items:center;gap:6px;font-size:12.5px;
  color:var(--tinta-3);font-weight:600}
.item-carrinho__acoes button:hover{color:var(--marca)}
.item-carrinho__acoes .ic{width:15px;height:15px}
.item-carrinho__lado{display:grid;gap:6px;justify-items:end;align-content:start;text-align:right}
.item-carrinho__lado s{font-size:12px}
.item-carrinho__total{font-size:19px;font-weight:800;letter-spacing:-.02em}
.item-carrinho__lado small{font-size:11.5px;color:var(--tinta-3)}
.remover{color:var(--tinta-3);padding:5px;transition:var(--transicao)}
.remover:hover{color:var(--alerta)}

.voltar-comprando{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;
  color:var(--marca);padding:8px 0}
.salvos{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);padding:18px;
  margin-top:8px}
.salvos h2{font-size:16px;margin-bottom:14px}
.item-salvo{display:flex;align-items:center;gap:14px;padding:12px 0;
  border-top:1px solid var(--linha-2)}
.item-salvo img{width:64px;height:64px;object-fit:contain;background:var(--linha-2);
  border-radius:var(--r-sm);flex:none}
.item-salvo>div{flex:1;min-width:0}
.item-salvo a{font-size:14px;font-weight:600;display:block}
.item-salvo b{font-size:15px;display:block;margin-top:3px}
.item-salvo__acoes{display:flex;align-items:center;gap:12px}
.link-apagar{font-size:12.5px;color:var(--tinta-3);text-decoration:underline}
.link-apagar:hover{color:var(--alerta)}

.resumo-compra{display:grid;gap:14px;position:sticky;top:120px}
.resumo-compra__caixa{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);
  padding:20px}
.resumo-compra__caixa h2{font-size:16px;margin-bottom:14px}
.resumo-compra__caixa h3{font-size:14px;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.resumo-compra__caixa h3 .ic{color:var(--marca)}
.resumo-linha{display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:7px 0;font-size:14px;color:var(--tinta-2)}
.resumo-linha b{color:var(--tinta);font-weight:700}
.resumo-linha small{display:block;font-size:11.5px;color:var(--tinta-3)}
.resumo-linha--verde,.resumo-linha .verde,.verde{color:var(--sucesso)}
.resumo-total{display:flex;justify-content:space-between;align-items:flex-end;
  padding:14px 0;margin-top:6px;border-top:1px solid var(--linha)}
.resumo-total>span{font-size:15px;font-weight:700}
.resumo-total div{text-align:right}
.resumo-total b{font-size:26px;font-weight:800;letter-spacing:-.03em;display:block;line-height:1.1}
.resumo-total small{font-size:12.5px;color:var(--sucesso);font-weight:700}
.resumo-seguro{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--tinta-3);
  margin-top:10px;justify-content:center;text-align:center}
.resumo-seguro .ic{width:15px;height:15px}
.cupom-form{display:flex;gap:8px}
.cupom-form input{flex:1;min-width:0;padding:11px 13px;border:1.5px solid var(--linha);
  border-radius:var(--r);outline:0;font-size:14px;text-transform:uppercase}
.cupom-form input:focus{border-color:var(--marca)}
.cupom-aplicado{display:flex;align-items:center;justify-content:space-between;
  background:#E6F6EF;border-radius:var(--r);padding:11px 14px}
.cupom-aplicado b{color:#0B6B4B;font-size:14px}
.cupom-aplicado button{font-size:12px;color:#0B6B4B;text-decoration:underline}
.cupom-dica{font-size:12px;color:var(--tinta-3);margin-top:10px}
.cupom-dica b{color:var(--marca)}
.frete-escolha{display:grid;gap:8px;margin-top:12px}
.frete-escolha label{display:flex;align-items:center;gap:11px;padding:11px 13px;
  border:1.5px solid var(--linha);border-radius:var(--r);cursor:pointer;font-size:13.5px;
  transition:var(--transicao)}
.frete-escolha label:hover{border-color:var(--tinta-3)}
.frete-escolha input{accent-color:var(--marca);width:17px;height:17px}
.frete-escolha input:checked+.frete-escolha__info{color:var(--marca)}
.frete-escolha__info{flex:1}
.frete-escolha__info b{display:block}
.frete-escolha__info small{font-size:11.5px;color:var(--tinta-3)}
.link-editar-carrinho{display:block;text-align:center;font-size:13px;color:var(--marca);
  font-weight:700;margin-top:12px}

/* --------------------------------------------------------- checkout -- */
.checkout-topo{background:#fff;border-bottom:1px solid var(--linha);padding:14px 0;
  margin-bottom:6px}
.checkout-topo .container{display:flex;align-items:center;justify-content:space-between}
.checkout-seguro{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--sucesso);
  font-weight:700}
.passos{display:flex;gap:6px;padding:18px 0;overflow-x:auto;scrollbar-width:none}
.passos::-webkit-scrollbar{display:none}
.passos li{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--tinta-3);
  white-space:nowrap;padding-right:14px;font-weight:600}
.passos b{width:26px;height:26px;border-radius:50%;background:var(--linha);color:var(--tinta-3);
  display:grid;place-items:center;font-size:12.5px;font-weight:800;transition:var(--transicao)}
.passos .ativo{color:var(--tinta)}
.passos .ativo b{background:var(--marca);color:#fff}
.passos .feito b{background:var(--sucesso);color:#fff}
.passos .feito{color:var(--sucesso)}

.checkout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;align-items:start;
  padding-bottom:40px}
.checkout__form{display:grid;gap:12px}
.checkout__resumo{display:grid;gap:14px;position:sticky;top:20px}
.passo{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);overflow:hidden;
  transition:var(--transicao)}
.passo__topo{display:flex;align-items:center;justify-content:space-between;padding:16px 20px}
.passo__topo h2{font-size:16px;display:flex;align-items:center;gap:11px}
.passo__n{width:26px;height:26px;border-radius:50%;background:var(--linha-2);color:var(--tinta-3);
  display:grid;place-items:center;font-size:13px;font-weight:800}
.passo.aberto{border-color:var(--marca);box-shadow:0 6px 20px rgba(91,42,224,.1)}
.passo.aberto .passo__n{background:var(--marca);color:#fff}
.passo.concluido .passo__n{background:var(--sucesso);color:#fff}
.passo__editar{font-size:13px;color:var(--marca);font-weight:700}
.passo__corpo{display:none;padding:0 20px 20px}
.passo.aberto .passo__corpo{display:block}
.passo__dica{font-size:13px;color:var(--tinta-3);margin-bottom:14px}
.passo__dica a{color:var(--marca);font-weight:700}

.campos{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.campo{display:block;margin-bottom:14px}
.campo>span{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.campo input,.campo select,.campo textarea{width:100%;padding:12px 14px;
  border:1.5px solid var(--linha);border-radius:var(--r);outline:0;font-size:14.5px;
  background:#fff;font-family:inherit;transition:var(--transicao)}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--marca);
  box-shadow:0 0 0 3px rgba(91,42,224,.11)}
.campo input:disabled{background:var(--linha-2);color:var(--tinta-3)}
.campo small{display:block;font-size:11.5px;color:var(--tinta-3);margin-top:5px}
.campo textarea{resize:vertical;min-height:70px}
.campo--2{grid-column:span 2}
.campo--full{grid-column:1/-1}
.campo--curto input{max-width:110px}
.campo.com-erro input,.campo.com-erro select{border-color:var(--alerta);background:#FEF6F6}
.checkbox{display:flex;align-items:center;gap:10px;font-size:13.5px;cursor:pointer;
  padding:6px 0;margin-bottom:12px}
.checkbox input{width:17px;height:17px;accent-color:var(--marca)}
.separador{padding-top:10px;border-top:1px solid var(--linha-2);margin-top:6px}
.separador b{display:block;font-size:13.5px}
.separador small{font-size:12px;color:var(--tinta-3)}

.enderecos-salvos{display:grid;gap:9px;margin-bottom:16px}
.endereco-op{display:flex;align-items:flex-start;gap:11px;border:1.5px solid var(--linha);
  border-radius:var(--r);padding:13px;cursor:pointer;font-size:13.5px;color:var(--tinta-2);
  transition:var(--transicao)}
.endereco-op:hover{border-color:var(--tinta-3)}
.endereco-op input{margin-top:2px;accent-color:var(--marca);width:17px;height:17px;flex:none}
.endereco-op b{display:block;color:var(--tinta);margin-bottom:2px}
.endereco-op:has(input:checked){border-color:var(--marca);background:var(--marca-claro)}

.pagamentos{display:grid;gap:9px;margin-bottom:16px}
.pagamento-op{border:1.5px solid var(--linha);border-radius:var(--r);cursor:pointer;
  transition:var(--transicao)}
.pagamento-op:hover{border-color:var(--tinta-3)}
.pagamento-op.ativo,.pagamento-op:has(input:checked){border-color:var(--marca);
  background:var(--marca-claro)}
.pagamento-op input{position:absolute;opacity:0}
.pagamento-op__conteudo{display:flex;align-items:center;gap:13px;padding:14px}
.pagamento-op__conteudo>.ic{width:24px;height:24px;color:var(--marca)}
.pagamento-op b{display:block;font-size:14px}
.pagamento-op small{font-size:12.5px;color:var(--tinta-3)}
.cartao-campos{background:var(--fundo);border-radius:var(--r);padding:16px;margin-bottom:14px}
.pix-aviso{display:flex;gap:12px;background:#E6F6EF;border-radius:var(--r);padding:14px;
  margin-bottom:14px;font-size:13px;color:#0B6B4B}
.pix-aviso .ic{color:var(--sucesso);flex:none}
.pix-aviso b{display:block;margin-bottom:2px}

.revisao{display:grid;gap:12px;margin-bottom:16px}
.revisao-bloco{background:var(--fundo);border-radius:var(--r);padding:14px;font-size:13.5px;
  color:var(--tinta-2);line-height:1.6}
.revisao-bloco b{display:block;color:var(--tinta);font-size:12px;text-transform:uppercase;
  letter-spacing:.05em;margin-bottom:5px}
.revisao-frete{color:var(--marca);font-weight:600;margin-top:4px}
.revisao-itens{display:grid;gap:11px;margin-bottom:14px;max-height:290px;overflow-y:auto}
.revisao-itens li{display:flex;align-items:center;gap:11px;font-size:13px}
.revisao-itens img{width:48px;height:48px;object-fit:contain;background:var(--linha-2);
  border-radius:var(--r-sm);flex:none}
.revisao-itens div{flex:1;min-width:0}
.revisao-itens span{display:block;font-weight:600;font-size:13px;overflow:hidden;
  text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.revisao-itens small{font-size:11.5px;color:var(--tinta-3)}
.revisao-itens b{white-space:nowrap}

/* -------------------------------------------------- pedido confirmado -- */
.pedido-ok{background:#fff;border:1px solid var(--linha);border-radius:var(--r-lg);
  padding:38px;text-align:center;margin:20px 0}
.pedido-ok__selo{width:64px;height:64px;border-radius:50%;background:#E6F6EF;color:var(--sucesso);
  display:grid;place-items:center;margin:0 auto 16px}
.pedido-ok__selo .ic{width:32px;height:32px;stroke-width:2.6}
.pedido-ok h1{font-size:26px;margin-bottom:8px}
.pedido-ok p{color:var(--tinta-2);font-size:14.5px;max-width:56ch;margin:0 auto 20px}
.pedido-ok__acoes{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

.pagar-pix{background:#fff;border:2px solid var(--sucesso);border-radius:var(--r-lg);padding:24px;
  margin-bottom:20px}
.pagar-pix h2{font-size:18px;display:flex;align-items:center;gap:10px;margin-bottom:8px}
.pagar-pix h2 .ic{color:var(--sucesso)}
.pagar-pix>p{font-size:14px;color:var(--tinta-2);margin-bottom:16px;max-width:70ch}
.pix-codigo{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}
.pix-codigo code{flex:1;min-width:260px;background:var(--fundo);border:1px solid var(--linha);
  border-radius:var(--r);padding:13px;font-size:11.5px;word-break:break-all;
  font-family:ui-monospace,Menlo,Consolas,monospace;max-height:90px;overflow-y:auto}
.pix-valor{font-size:15px;margin-top:14px}
.pix-valor b{font-size:20px}
.pix-aviso-mini{font-size:12.5px;color:var(--tinta-3);margin-top:6px}

.pedido-detalhe{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;
  align-items:start;padding-bottom:30px}
.pedido-detalhe__itens{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);
  padding:20px}
.pedido-detalhe__itens h2{font-size:17px;margin-bottom:14px}
.pedido-detalhe__resumo{display:grid;gap:14px}
.linha-pedido{display:flex;align-items:center;gap:14px;padding:12px 0;
  border-bottom:1px solid var(--linha-2)}
.linha-pedido:last-child{border:0}
.linha-pedido img{width:58px;height:58px;object-fit:contain;background:var(--linha-2);
  border-radius:var(--r-sm);flex:none}
.linha-pedido>div{flex:1;min-width:0}
.linha-pedido a{font-size:14px;font-weight:600;display:block}
.linha-pedido a:hover{color:var(--marca)}
.linha-pedido small{display:block;font-size:12px;color:var(--tinta-3)}
.linha-pedido b{white-space:nowrap;font-size:15px}
.endereco-txt{font-size:13.5px;color:var(--tinta-2);line-height:1.7;margin-bottom:10px}

/* -------------------------------------------------------- area cliente -- */
.conta{display:grid;grid-template-columns:250px 1fr;gap:22px;align-items:start;padding:20px 0 40px}
.conta__menu{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);
  overflow:hidden;position:sticky;top:120px}
.conta__perfil{display:flex;align-items:center;gap:12px;padding:18px;
  background:linear-gradient(135deg,var(--tinta),#3A312A);color:#fff}
.conta__avatar{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.22);
  display:grid;place-items:center;font-weight:800;font-size:17px;flex:none}
.conta__perfil b{display:block;font-size:14px}
.conta__perfil small{font-size:11.5px;opacity:.85;word-break:break-all}
.conta__menu nav{padding:8px}
.conta__menu a{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:var(--r);
  font-size:13.5px;font-weight:600;color:var(--tinta-2);transition:var(--transicao)}
.conta__menu a:hover{background:var(--linha-2);color:var(--tinta)}
.conta__menu a.ativo{background:var(--marca-claro);color:var(--marca-escuro)}
.conta__menu .ic{width:18px;height:18px}
.conta__sair{color:var(--tinta-3)!important;border-top:1px solid var(--linha-2);
  border-radius:0!important;margin-top:6px;padding-top:14px!important}
.conta__conteudo{min-width:0}
.conta__conteudo h1{font-size:24px;margin-bottom:4px}
.conta__cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}
.conta-card{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);padding:16px;
  transition:var(--transicao)}
.conta-card:hover{border-color:var(--marca);transform:translateY(-2px)}
.conta-card .ic{color:var(--marca);margin-bottom:8px}
.conta-card b{display:block;font-size:22px;font-weight:800;letter-spacing:-.02em}
.conta-card span{font-size:12.5px;color:var(--tinta-3)}
.conta__bloco{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);
  padding:20px;margin-bottom:16px}
.conta__bloco>header{display:flex;align-items:center;justify-content:space-between;
  margin-bottom:14px;gap:12px}
.conta__bloco h2{font-size:16px}
.conta__bloco>header a{font-size:13px;color:var(--marca);font-weight:700}
.tabela-conta{display:grid}
.linha-conta{display:grid;grid-template-columns:1.4fr 1fr auto auto 20px;gap:14px;
  align-items:center;padding:13px 0;border-bottom:1px solid var(--linha-2);font-size:13.5px}
.linha-conta:last-child{border:0}
.linha-conta b{font-size:14px}
.linha-conta small{display:block;font-size:11.5px;color:var(--tinta-3)}
.linha-conta__itens{color:var(--tinta-3)}
.linha-conta .ic{color:var(--tinta-3);width:16px;height:16px}
.badge{display:inline-block;padding:4px 11px;border-radius:var(--r-full);font-size:11.5px;
  font-weight:800;white-space:nowrap}
.badge--azul{background:#E7F1FD;color:#1B7CE0}
.badge--verde{background:#E6F6EF;color:var(--sucesso)}
.badge--roxo{background:var(--marca-claro);color:var(--marca-escuro)}
.badge--laranja{background:#FFF3E4;color:var(--aviso)}
.badge--vermelho{background:#FEE9E9;color:var(--alerta)}

.filtros-status{display:flex;gap:6px;overflow-x:auto;padding:14px 0;scrollbar-width:none}
.filtros-status::-webkit-scrollbar{display:none}
.filtros-status a{background:#fff;border:1px solid var(--linha);border-radius:var(--r-full);
  padding:8px 15px;font-size:13px;font-weight:600;white-space:nowrap;color:var(--tinta-2)}
.filtros-status a.ativo{background:var(--marca);border-color:var(--marca);color:#fff}

.pedidos-lista{display:grid;gap:12px}
.pedido-card{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);padding:16px}
.pedido-card>header{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding-bottom:12px;border-bottom:1px solid var(--linha-2);margin-bottom:12px}
.pedido-card>header b{font-size:15px}
.pedido-card>header small{display:block;font-size:12px;color:var(--tinta-3)}
.pedido-card__itens{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.pedido-card__itens img{width:50px;height:50px;object-fit:contain;background:var(--linha-2);
  border-radius:var(--r-sm)}
.mais-itens{width:50px;height:50px;border-radius:var(--r-sm);background:var(--linha-2);
  display:grid;place-items:center;font-size:13px;font-weight:700;color:var(--tinta-3)}
.pedido-card__resumo{margin-left:auto;text-align:right}
.pedido-card__resumo b{font-size:18px;display:block}
.pedido-card__resumo small{font-size:12px;color:var(--tinta-3)}
.pedido-card>footer{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}

.pedido-cabecalho{display:flex;align-items:center;justify-content:space-between;gap:14px;
  margin-bottom:18px;flex-wrap:wrap}
.pedido-colunas{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.voltar-link{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;
  color:var(--marca);margin-bottom:14px}

.etapas{display:grid;gap:0;padding:6px 0}
.etapas li{display:flex;gap:14px;align-items:center;padding:10px 0;position:relative;
  color:var(--tinta-3)}
.etapas__ponto{width:30px;height:30px;border-radius:50%;background:var(--linha);color:#fff;
  display:grid;place-items:center;flex:none;z-index:2}
.etapas__ponto .ic{width:16px;height:16px;stroke-width:3}
.etapas .feita{color:var(--tinta)}
.etapas .feita .etapas__ponto{background:var(--sucesso)}
.etapas .atual .etapas__ponto{background:var(--marca);box-shadow:0 0 0 5px rgba(91,42,224,.16)}
.etapas b{font-size:14px}
.etapas--horizontal{display:flex;justify-content:space-between;background:#fff;
  border:1px solid var(--linha);border-radius:var(--r-md);padding:18px;margin-bottom:16px;
  position:relative;overflow-x:auto}
.etapas--horizontal li{flex-direction:column;gap:8px;text-align:center;flex:1;min-width:88px}
.etapas--horizontal b{font-size:12.5px}

.enderecos-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;
  margin:16px 0}
.endereco-card{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);padding:16px;
  font-size:13.5px}
.endereco-card.principal{border-color:var(--marca)}
.endereco-card b{display:block;font-size:14px;margin:6px 0 6px}
.endereco-card p{color:var(--tinta-2);line-height:1.65}
.endereco-card__acoes{display:flex;gap:12px;align-items:center;margin-top:12px}
.endereco-card__acoes form{display:inline}

.cupons-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.cupom-card{background:#fff;border:1.5px dashed var(--marca);border-radius:var(--r-md);
  padding:16px}
.cupom-card b{display:block;font-size:17px;color:var(--marca-escuro);letter-spacing:.02em}
.cupom-card span{font-size:12.5px;color:var(--tinta-2);display:block;margin-top:4px}
.cupom-card--grande{display:flex;align-items:center;gap:14px}
.cupom-card__valor{width:62px;height:62px;border-radius:var(--r);background:var(--marca-claro);
  color:var(--marca-escuro);display:grid;place-items:center;font-size:17px;font-weight:800;
  flex:none}
.cupom-card__info{flex:1;min-width:0}
.cupom-card__info small{display:block;font-size:11.5px;color:var(--tinta-3);margin-top:3px}
.cupom-destaque{background:var(--marca-claro);border:1.5px dashed var(--marca);
  border-radius:var(--r);padding:16px;text-align:center;margin-bottom:16px}
.cupom-destaque b{display:block;font-size:22px;color:var(--marca-escuro);letter-spacing:.04em}
.cupom-destaque span{font-size:13px;color:var(--tinta-2)}

/* ------------------------------------------------------------- login -- */
.auth{display:grid;grid-template-columns:1fr 380px;gap:26px;align-items:start;padding:26px 0 50px}
.auth__caixa{background:#fff;border:1px solid var(--linha);border-radius:var(--r-lg);padding:30px;
  max-width:520px}
.auth__caixa h1{font-size:24px}
.auth__caixa .subtitulo{margin-bottom:20px}
.auth__troca{text-align:center;font-size:13.5px;color:var(--tinta-3);margin-top:16px}
.auth__troca a{color:var(--marca);font-weight:700}
.auth__lado{background:linear-gradient(140deg,#2A0C1E,#6B1E4C);color:#fff;
  border-radius:var(--r-lg);padding:28px}
.auth__lado h2{font-size:18px;margin-bottom:16px}
.auth__lado .lista-check li{color:rgba(255,255,255,.86);font-size:13.5px}
.auth__lado .lista-check .ic{color:#5EE9B5}
.auth__dica{background:rgba(255,255,255,.1);border-radius:var(--r);padding:13px;margin-top:18px;
  font-size:12.5px}
.auth__dica b{display:block;margin-bottom:3px}
.auth__dica span{opacity:.8}
.aviso-login{text-align:center;font-size:13.5px;color:var(--tinta-3);margin-top:16px}
.aviso-login a{color:var(--marca);font-weight:700}

/* --------------------------------------------------- paginas simples -- */
.pagina-conteudo{background:#fff;border:1px solid var(--linha);border-radius:var(--r-lg);
  padding:32px;margin:20px 0 40px}
.pagina-conteudo--estreita{max-width:760px;margin-inline:auto}
.pagina-conteudo h1{font-size:28px;margin-bottom:16px}
.pagina-conteudo h2{font-size:19px;margin:24px 0 10px}
.contato-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;
  margin:20px 0}
.contato-card{background:var(--fundo);border-radius:var(--r-md);padding:20px;
  transition:var(--transicao)}
.contato-card:hover{background:var(--marca-claro)}
.contato-card .ic{width:26px;height:26px;color:var(--marca);margin-bottom:10px}
.contato-card b{display:block;font-size:15px}
.contato-card small{display:block;font-size:13.5px;color:var(--tinta);margin:3px 0 6px;
  font-weight:600}
.contato-card span{font-size:12.5px;color:var(--tinta-3);line-height:1.5}
.sobre-numeros{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;
  margin:24px 0}
.sobre-numeros div{background:var(--fundo);border-radius:var(--r-md);padding:18px;
  text-align:center}
.sobre-numeros b{display:block;font-size:26px;font-weight:800;color:var(--marca);
  letter-spacing:-.03em}
.sobre-numeros span{font-size:12.5px;color:var(--tinta-3)}
.pagina-ajuda{background:var(--fundo);border-radius:var(--r-md);padding:22px;margin-top:26px;
  text-align:center}
.pagina-ajuda p{color:var(--tinta-3);font-size:14px;margin:6px 0 14px}

.rastreio-form{display:flex;gap:10px;margin:18px 0}
.rastreio-form input{flex:1;padding:13px 16px;border:1.5px solid var(--linha);
  border-radius:var(--r);outline:0;font-size:15px;text-transform:uppercase}
.rastreio-form input:focus{border-color:var(--marca)}
.linha-tempo{margin-top:24px;border-top:1px solid var(--linha);padding-top:20px}
.linha-tempo h2{font-size:19px}
.linha-tempo h3{font-size:15px;margin:22px 0 10px}
.rastreio-codigo{background:var(--fundo);border-radius:var(--r);padding:13px;font-size:13.5px;
  margin-top:14px}

.arvore-categorias{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:14px;padding-bottom:40px}
.arvore-bloco{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);
  overflow:hidden}
.arvore-bloco__topo{display:flex;align-items:center;gap:13px;padding:16px;
  border-bottom:1px solid var(--linha-2)}
.arvore-bloco__ic{width:42px;height:42px;border-radius:var(--r);display:grid;place-items:center;
  background:color-mix(in srgb,var(--cor) 13%,#fff);color:var(--cor);flex:none}
.arvore-bloco__topo div{flex:1;min-width:0}
.arvore-bloco__topo b{display:block;font-size:15px}
.arvore-bloco__topo small{font-size:12px;color:var(--tinta-3)}
.arvore-bloco__topo>.ic{color:var(--tinta-3);width:17px;height:17px}
.arvore-bloco ul{padding:8px}
.arvore-bloco li a{display:flex;align-items:center;justify-content:space-between;
  padding:9px 12px;border-radius:var(--r-sm);font-size:13.5px;color:var(--tinta-2)}
.arvore-bloco li a:hover{background:var(--linha-2);color:var(--marca)}
.arvore-bloco li em{font-style:normal;font-size:11.5px;color:var(--tinta-3)}

.pagina-erro{text-align:center;padding:70px 20px}
.pagina-erro__codigo{font-size:76px;font-weight:800;color:var(--marca);opacity:.22;
  letter-spacing:-.05em;line-height:1}
.pagina-erro h1{font-size:26px;margin:6px 0 8px}
.pagina-erro p{color:var(--tinta-3);font-size:15px;max-width:48ch;margin:0 auto 22px}
.pagina-erro__acoes{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* -------------------------------------------------------- responsivo -- */
@media (max-width:1100px){
  .produto{grid-template-columns:1fr;gap:24px}
  .galeria{position:static}
  .carrinho,.checkout,.pedido-detalhe{grid-template-columns:1fr}
  .resumo-compra,.checkout__resumo{position:static}
  .conta{grid-template-columns:1fr}
  .conta__menu{position:static}
  .conta__menu nav{display:flex;overflow-x:auto;scrollbar-width:none}
  .conta__menu nav a{white-space:nowrap}
  .conta__cards{grid-template-columns:1fr 1fr}
  .auth{grid-template-columns:1fr}
}
@media (max-width:900px){
  .lista{grid-template-columns:1fr}
  .lista__controles [data-abrir-filtros]{display:inline-flex}
  .filtros{position:fixed;inset:0 0 0 auto;width:min(90vw,340px);z-index:120;border-radius:0;
    transform:translateX(100%);transition:transform .25s ease;overflow-y:auto;max-height:100vh}
  .filtros.aberto{transform:none}
  .filtros__topo button{display:block}
  .galeria{grid-template-columns:1fr}
  .galeria__miniaturas{grid-auto-flow:column;grid-auto-columns:64px;overflow-x:auto;
    order:2;scrollbar-width:none}
  .galeria__miniaturas::-webkit-scrollbar{display:none}
  .galeria__principal{padding:16px}
  .detalhes h1{font-size:21px}
  .preco-bloco__valor{font-size:32px}
  .barra-compra-mobile{display:flex}
  .item-carrinho{grid-template-columns:84px 1fr;gap:12px;padding:12px}
  .item-carrinho__lado{grid-column:1/-1;justify-items:stretch;text-align:left;
    display:flex;align-items:center;justify-content:space-between}
  .pedido-colunas{grid-template-columns:1fr}
  .campos{grid-template-columns:1fr}
  .campo--2{grid-column:auto}
  .form-avaliacao__grade{grid-template-columns:1fr}
  .avaliacoes__resumo{grid-template-columns:1fr;gap:18px}
  .conta__cards{grid-template-columns:1fr 1fr}
  .pagina-conteudo{padding:22px}
  .abas__painel{padding:18px}
}
@media (max-width:600px){
  .conta__cards{grid-template-columns:1fr}
  .linha-conta{grid-template-columns:1fr auto;gap:8px}
  .linha-conta__itens,.linha-conta>.ic{display:none}
}

/* ------------------------------------------- acabamento editorial -- */
/* Mesmo princípio da vitrine: a foto da peça ocupa o quadro inteiro e a
   moldura some. Fica no fim do arquivo para vencer as regras acima. */
.galeria{grid-template-columns:86px minmax(0,1fr);gap:16px}
.galeria__principal{background:var(--linha-2);border:0;border-radius:0;
  aspect-ratio:3/4}
.galeria__principal img{object-fit:cover}
.galeria__miniaturas a,.galeria__miniaturas button{border-radius:0}
.galeria__lupa{border-radius:0;font-size:11px;text-transform:uppercase;
  letter-spacing:.1em}

.preco-bloco__valor{font-size:30px;font-weight:600;letter-spacing:-.02em}
.preco-bloco__economia{font-weight:500}

/* rodapé e newsletter no mesmo tom de tinta da marca */
.newsletter{background:var(--tinta);color:#fff}
.newsletter h2{font-family:var(--fonte-titulo);font-size:28px}
.newsletter p{opacity:.74}
.newsletter__form input{border-radius:0}
.newsletter__form .btn{border-radius:0}

/* QR Code do PIX gerado pelo gateway */
.pix-qr{display:block;margin:0 auto 18px;width:220px;height:220px;
  background:#fff;padding:10px;border:1px solid var(--linha)}

/* --------------------------------- celular: nada pode furar a tela -- */
/* Filho de grid e de flex só encolhe com min-width:0, senão o conteúdo
   largo (barra de subcategorias, tabela, carrossel) empurra a página
   inteira e nasce aquela rolagem lateral que não deveria existir. */
@media (max-width:900px){
  html{overflow-x:hidden}
  .lista{min-width:0}
  .lista>*{min-width:0;max-width:100%}
  .atalhos-sub{max-width:100%;min-width:0}
  .cabecalho-lista{min-width:0}
  .cabecalho-lista h1,.cabecalho-lista p{overflow-wrap:anywhere}
  .detalhes{min-width:0}
  /* a foto grande vem primeiro e as miniaturas descem para baixo dela */
  .galeria{min-width:0;grid-template-columns:1fr;gap:10px}
  .galeria__miniaturas{grid-auto-flow:column;grid-auto-columns:70px;overflow-x:auto;
    order:2;scrollbar-width:none}
  .galeria__principal{order:1;padding:0;aspect-ratio:3/4}
  .galeria__lupa{display:none}
}
