/* =====================================================================
   Vitrine da loja — estilo mobile-first.
   As cores vêm da loja (painel) através das variáveis abaixo.
   ===================================================================== */
:root {
  --cor-principal: #c2185b;
  --cor-destaque: #f2b705;
  --cor-fundo: #fffdf8;
  --cor-texto: #1a1a1a;
  --cor-sobre-principal: #ffffff;
  --cor-sobre-destaque: #1a1a1a;
  --cor-principal-texto: #c2185b;
  --cor-zap: #0f7a3f;         /* verde escuro: branco por cima dá 5,4:1 (AA) */
  --cor-promo: var(--cor-principal);
  --cor-promo-texto: var(--cor-principal-texto);
  --cor-foco: var(--cor-texto);
  --cor-texto-suave: rgba(0, 0, 0, .66);
  --cor-ouro: #b8862b;        /* só fios e ícones */
  --cor-ouro-texto: #8a6420;

  /* tons derivados (com reserva para navegadores antigos) */
  --cor-superficie: #ffffff;
  --cor-linha: rgba(0, 0, 0, .1);
  --cor-suave: rgba(0, 0, 0, .62);
  --cor-superficie: color-mix(in srgb, var(--cor-fundo) 55%, #fff);
  --cor-linha: color-mix(in srgb, var(--cor-texto) 12%, transparent);
  --cor-suave: var(--cor-texto-suave);

  --fonte-titulo: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --fonte-assinatura: "Great Vibes", cursive;
  --fs-display: clamp(2.5rem, 1.8rem + 3.4vw, 4.25rem);
  --fs-h2: clamp(1.875rem, 1.5rem + 1.6vw, 2.75rem);
  --fs-h3: clamp(1.625rem, 1.4rem + 1vw, 2.25rem);
  --fonte-texto: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --raio: 14px;
  --raio-g: 22px;
  --sombra: 0 10px 30px -12px rgba(0, 0, 0, .22);
  --largura: 1180px;
  --gutter: 16px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { animation: none !important; transition: none !important; } }
body {
  margin: 0;
  background: var(--cor-fundo);
  color: var(--cor-texto);
  font-family: var(--fonte-texto);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: var(--cor-principal-texto); }
:focus-visible { outline: 3px solid var(--cor-foco); outline-offset: 2px; border-radius: 6px; }

.pular { position: absolute; left: -999px; top: 8px; background: var(--cor-principal); color: var(--cor-sobre-principal); padding: 10px 16px; border-radius: 10px; z-index: 100; }
.pular:focus { left: 8px; }

/* ---------- Botões ---------- */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 12px 22px; border-radius: 999px; border: 0;
  font-weight: 600; font-size: 1rem; text-decoration: none; cursor: pointer;
  transition: transform .15s ease, filter .15s ease, background .15s;
}
.botao:hover { filter: brightness(1.06); }
.botao:active { transform: scale(.98); }
.botao svg { width: 20px; height: 20px; flex: none; }
.botao--principal { background: var(--cor-principal); color: var(--cor-sobre-principal); }
.botao--claro { background: rgba(255, 255, 255, .92); color: #1a1a1a; }
.botao--zap { background: var(--cor-zap); color: #fff; }
.botao--borda { background: transparent; color: var(--cor-texto); border: 1.5px solid var(--cor-linha); }
.botao--pequeno { min-height: 44px; padding: 8px 14px; font-size: .9rem; }
.botao--largo { width: 100%; }
.botao[disabled], .botao[aria-disabled="true"] { opacity: .5; cursor: not-allowed; filter: grayscale(.4); }
.botao-icone {
  position: relative; display: inline-grid; place-items: center;
  width: 44px; height: 44px; border-radius: 999px; border: 0; background: transparent; cursor: pointer; color: inherit;
}
.botao-icone svg { width: 24px; height: 24px; }
.botao-icone:hover { background: var(--cor-linha); }
.botao-link { background: none; border: 0; color: var(--cor-suave); text-decoration: underline; cursor: pointer; padding: 10px; min-height: 44px; }

/* ---------- Topo ---------- */
.topo {
  position: sticky; top: 0; z-index: 30;
  background: color-mix(in srgb, var(--cor-fundo) 88%, transparent);
  -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid var(--cor-linha);
}
.topo__dentro { max-width: var(--largura); margin: 0 auto; padding: 10px var(--gutter); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.marca { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--cor-texto); min-width: 0; }
.marca__logo { height: 48px; width: auto; max-width: 160px; object-fit: contain; border-radius: 999px; background: #fff; box-shadow: 0 0 0 1.5px var(--cor-ouro); }
.marca__nome { font-family: var(--fonte-assinatura); font-weight: 400; font-size: 28px; line-height: 1; color: var(--cor-principal-texto); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; flex-direction: column; }
.marca__nome small { font-family: var(--fonte-titulo); font-weight: 600; font-size: 10px; text-transform: uppercase; letter-spacing: .3em; color: var(--cor-ouro-texto); margin-bottom: 2px; }
@media (min-width: 1040px) { .marca__nome { font-size: 34px; } }
.topo__acoes { display: flex; align-items: center; gap: 6px; flex: none; }
.contador {
  position: absolute; top: 2px; right: 0; min-width: 20px; height: 20px; padding: 0 5px;
  border-radius: 999px; background: var(--cor-principal); color: var(--cor-sobre-principal);
  font-size: .72rem; font-weight: 700; display: grid; place-items: center;
}
/* Celular: um só botão de WhatsApp (o flutuante). */
@media (max-width: 1039px) { .so-computador { display: none !important; } }

/* ---------- Hero ---------- */
.hero {
  position: relative; overflow: hidden; isolation: isolate;
  min-height: 62vh; min-height: 62svh; display: grid; align-items: end;
  padding: 56px var(--gutter) 40px;
  background:
    radial-gradient(120% 80% at 100% 0%, color-mix(in srgb, var(--cor-destaque) 55%, transparent), transparent 60%),
    linear-gradient(160deg, var(--cor-principal), color-mix(in srgb, var(--cor-principal) 70%, #000));
  color: var(--cor-sobre-principal);
}
.hero--com-foto { color: #fff; }
.hero__imagem { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.hero--com-foto::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0,0,0,.05) 20%, rgba(0,0,0,.62) 100%); }
.hero__conteudo { max-width: var(--largura); width: 100%; margin: 0 auto; }
.hero__titulo { font-family: var(--fonte-titulo); font-weight: 600; font-size: var(--fs-display); line-height: 1.02; max-width: 17ch; margin: 0 0 12px; letter-spacing: -.01em; text-shadow: 0 2px 18px rgba(0,0,0,.25); }
.hero__slogan { font-size: clamp(1.05rem, 3.6vw, 1.3rem); max-width: 34ch; margin: 0 0 26px; opacity: .95; text-shadow: 0 1px 12px rgba(0,0,0,.3); }
.hero__botoes { display: flex; flex-wrap: wrap; gap: 10px; }
.hero .botao--principal { background: #fff; color: #1a1a1a; }

/* ---------- Seções ---------- */
.secao { max-width: var(--largura); margin: 0 auto; padding: 48px var(--gutter) 8px; }
.secao__cabeca { margin-bottom: 18px; }
.secao__titulo { font-family: var(--fonte-titulo); font-weight: 600; font-size: var(--fs-h2); line-height: 1.15; margin: 0; }
.secao__sub { margin: 4px 0 0; color: var(--cor-suave); }

/* ---------- Filtros ---------- */
.filtros { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 14px; margin: 0 calc(var(--gutter) * -1); padding-left: var(--gutter); padding-right: var(--gutter); scrollbar-width: none; }
.filtros::-webkit-scrollbar { display: none; }
.filtro {
  flex: none; min-height: 44px; padding: 8px 18px; border-radius: 999px; cursor: pointer;
  border: 1.5px solid var(--cor-linha); background: var(--cor-superficie); color: var(--cor-texto); font-weight: 500;
}
.filtro[aria-pressed="true"] { background: var(--cor-principal); border-color: var(--cor-principal); color: var(--cor-sobre-principal); }

/* ---------- Grade e cards ---------- */
.grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 12px; }
@media (min-width: 720px) { .grade { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 20px; } }
@media (min-width: 1040px) { .grade { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.card { position: relative; display: flex; flex-direction: column; min-width: 0; }
.card__fotos {
  position: relative; aspect-ratio: 4 / 5; border-radius: var(--raio); overflow: hidden;
  background: var(--cor-linha);
}
.card__trilho { display: flex; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.card__trilho::-webkit-scrollbar { display: none; }
.card__trilho img { flex: 0 0 100%; width: 100%; height: 100%; object-fit: cover; scroll-snap-align: start; transition: transform .5s ease; }
.card:hover .card__trilho img { transform: scale(1.03); }
.card__pontos { position: absolute; left: 0; right: 0; bottom: 8px; display: flex; justify-content: center; gap: 5px; pointer-events: none; }
.card__pontos span { width: 6px; height: 6px; border-radius: 99px; background: rgba(255,255,255,.6); box-shadow: 0 0 2px rgba(0,0,0,.4); }
.card__pontos span.ativo { background: #fff; width: 16px; }
.card__abrir { all: unset; cursor: pointer; display: block; }
.card__abrir:focus-visible { outline: 3px solid var(--cor-foco); outline-offset: 3px; border-radius: var(--raio); }
.card__info { padding: 10px 2px 0; }
.card__categoria { font-size: .74rem; text-transform: uppercase; letter-spacing: .08em; color: var(--cor-suave); margin: 0; }
.card__nome { font-size: 1rem; font-weight: 500; margin: 2px 0 4px; line-height: 1.3; }
.card--esgotado .card__fotos::after { content: ""; position: absolute; inset: 0; background: color-mix(in srgb, var(--cor-fundo) 45%, transparent); pointer-events: none; z-index: 1; }
.card--esgotado .preco__atual { color: var(--cor-texto-suave); }

.selos { position: absolute; top: 8px; left: 8px; display: flex; flex-direction: column; gap: 6px; z-index: 3; pointer-events: none; }
.selo { padding: 4px 10px; border-radius: 999px; font-size: .74rem; font-weight: 700; letter-spacing: .02em; }
.selo--promo { background: var(--cor-principal); color: var(--cor-sobre-principal); }
.selo--esgotado { background: #1a1a1a; color: #fff; }
.selo--destaque { background: var(--cor-destaque); color: var(--cor-sobre-destaque); }

.preco { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.preco__atual { font-weight: 700; font-size: 1.05rem; color: var(--cor-texto); }
.preco__antigo { color: var(--cor-suave); text-decoration: line-through; font-size: .9rem; }
.preco--promo .preco__atual { color: var(--cor-promo-texto); }

/* esqueleto de carregamento */
.esqueleto { display: block; border-radius: 8px; background: linear-gradient(90deg, var(--cor-linha), color-mix(in srgb, var(--cor-linha) 30%, transparent), var(--cor-linha)); background-size: 200% 100%; animation: brilho 1.3s infinite linear; }
.esqueleto--foto { aspect-ratio: 4 / 5; border-radius: var(--raio); }
.esqueleto--linha { height: 16px; margin-top: 12px; width: 80%; }
.esqueleto--curta { height: 14px; margin-top: 8px; width: 40%; }
.hero .esqueleto--linha { height: 52px; width: min(420px, 80%); background: rgba(255,255,255,.25); }
@keyframes brilho { to { background-position: -200% 0; } }

.aviso-vazio { text-align: center; padding: 40px 16px; color: var(--cor-suave); font-size: 1.05rem; border: 1.5px dashed var(--cor-linha); border-radius: var(--raio-g); }

/* ---------- Carrossel de destaques ---------- */
.carrossel { display: grid; grid-auto-flow: column; grid-auto-columns: 68%; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 var(--gutter) 10px; margin: 0 calc(var(--gutter) * -1); scrollbar-width: none; }
.carrossel::-webkit-scrollbar { display: none; }
.carrossel > .card { scroll-snap-align: start; }
@media (min-width: 720px) { .carrossel { grid-auto-columns: 32%; } }
@media (min-width: 1040px) { .carrossel { grid-auto-columns: 24%; } }

/* ---------- Frete, sobre, contato ---------- */
.faixa-frete { max-width: var(--largura); margin: 48px auto 0; padding: 0 var(--gutter); display: flex; gap: 14px; align-items: center; }
.faixa-frete svg { width: 34px; height: 34px; flex: none; color: var(--cor-principal-texto); }
.faixa-frete p { margin: 0; padding: 16px 18px; flex: 1; border-radius: var(--raio); background: var(--cor-superficie); border: 1px solid var(--cor-linha); }

.sobre__caixa { background: var(--cor-superficie); border: 1px solid var(--cor-linha); border-radius: var(--raio-g); padding: 28px 22px; }
.sobre__texto p { margin: 12px 0 0; max-width: 65ch; }

.contato { padding-bottom: 48px; }
.contato__lista { list-style: none; padding: 0; margin: 16px 0 0; display: grid; gap: 12px; }
@media (min-width: 720px) { .contato__lista { grid-template-columns: repeat(3, 1fr); } }
.contato__item { display: flex; gap: 14px; align-items: flex-start; padding: 18px; border-radius: var(--raio); background: var(--cor-superficie); border: 1px solid var(--cor-linha); min-height: 64px; }
.contato__item svg { width: 26px; height: 26px; flex: none; color: var(--cor-principal-texto); margin-top: 2px; }
.contato__item strong { display: block; font-weight: 600; }
.contato__item a { word-break: break-word; }

.rodape { text-align: center; padding: 28px var(--gutter) 96px; color: var(--cor-suave); font-size: .9rem; border-top: 1px solid var(--cor-linha); }
.rodape p { margin: 4px 0; }
.rodape__demo { display: inline-block; padding: 2px 10px; border-radius: 99px; border: 1px dashed var(--cor-linha); font-size: .78rem; }

.zap-flutuante {
  position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 40;
  min-width: 56px; height: 56px; border-radius: 999px; display: flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; font-weight: 600;
  background: var(--cor-zap); color: #fff; box-shadow: var(--sombra);
}
.zap-flutuante svg { width: 30px; height: 30px; }

/* ---------- Janelas (produto e sacola) ---------- */
.janela { border: 0; padding: 0; background: var(--cor-fundo); color: var(--cor-texto); max-width: 100vw; max-height: 100dvh; }
.janela::backdrop { background: rgba(0, 0, 0, .5); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.janela--produto { width: 100vw; height: 100dvh; margin: 0; }
@media (min-width: 860px) {
  .janela--produto { width: min(980px, 94vw); height: auto; max-height: 92vh; margin: auto; border-radius: var(--raio-g); box-shadow: var(--sombra); }
}
.janela__corpo { position: relative; }
.janela__fechar { position: absolute; top: 10px; right: 10px; z-index: 5; background: rgba(255,255,255,.92); color: #1a1a1a; box-shadow: 0 2px 10px rgba(0,0,0,.15); }
.janela__fechar:hover { background: #fff; }

.produto { display: grid; }
@media (min-width: 860px) { .produto { grid-template-columns: 1.05fr 1fr; } }
.galeria { position: relative; background: var(--cor-linha); }
.galeria__trilho { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; aspect-ratio: 4 / 5; }
.galeria__trilho::-webkit-scrollbar { display: none; }
.galeria__trilho img { flex: 0 0 100%; width: 100%; height: 100%; object-fit: cover; scroll-snap-align: start; }
@media (min-width: 860px) { .galeria__trilho { max-height: 92vh; } }
.galeria__seta { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.9); color: #1a1a1a; }
.galeria__seta--esq { left: 10px; } .galeria__seta--dir { right: 10px; }
.galeria__miniaturas { display: flex; gap: 8px; padding: 10px; overflow-x: auto; }
.galeria__miniaturas button { flex: none; width: 56px; height: 70px; padding: 0; border: 2px solid transparent; border-radius: 8px; overflow: hidden; cursor: pointer; background: none; }
.galeria__miniaturas button[aria-current="true"] { border-color: var(--cor-principal-texto); }
.galeria__miniaturas img { width: 100%; height: 100%; object-fit: cover; }

.produto__info { padding: 22px var(--gutter) 32px; display: flex; flex-direction: column; gap: 16px; }
@media (min-width: 860px) { .produto__info { padding: 36px 32px; overflow-y: auto; max-height: 92vh; } }
.produto__nome { font-family: var(--fonte-titulo); font-weight: 600; font-size: var(--fs-h3); line-height: 1.15; margin: 0; }
.produto .preco__atual { font-size: 1.5rem; }
.produto__descricao { margin: 0; white-space: pre-line; color: var(--cor-suave); }
.opcoes { border: 0; padding: 0; margin: 0; }
.opcoes legend { font-weight: 600; margin-bottom: 8px; padding: 0; }
.opcoes__lista { display: flex; flex-wrap: wrap; gap: 8px; }
.opcao {
  min-width: 48px; min-height: 44px; padding: 8px 14px; border-radius: 12px; cursor: pointer;
  border: 1.5px solid var(--cor-linha); background: var(--cor-superficie); font-weight: 500;
}
.opcao[aria-pressed="true"] { border-color: var(--cor-principal); background: var(--cor-principal); color: var(--cor-sobre-principal); }
.produto__acoes { display: grid; gap: 10px; margin-top: 4px; }
.produto__alerta { margin: 0; padding: 12px 14px; border-radius: 12px; background: color-mix(in srgb, var(--cor-principal) 10%, transparent); color: var(--cor-texto); font-weight: 500; }

.janela--sacola { margin: 0 0 0 auto; width: min(440px, 100vw); height: 100dvh; }
.sacola { display: flex; flex-direction: column; height: 100%; }
.sacola__cabeca { display: flex; align-items: center; justify-content: space-between; padding: 14px var(--gutter); border-bottom: 1px solid var(--cor-linha); }
.sacola__cabeca h2 { font-family: var(--fonte-titulo); margin: 0; font-size: 1.5rem; }
.sacola__itens { list-style: none; margin: 0; padding: 8px var(--gutter); overflow-y: auto; flex: 1; }
.sacola__item { display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--cor-linha); align-items: center; }
.sacola__item img { width: 64px; height: 80px; object-fit: cover; border-radius: 8px; }
.sacola__item p { margin: 0; line-height: 1.35; }
.sacola__detalhe { color: var(--cor-suave); font-size: .88rem; }
.quantidade { display: flex; align-items: center; gap: 4px; margin-top: 6px; }
.quantidade button { width: 44px; height: 44px; border-radius: 99px; border: 1.5px solid var(--cor-linha); background: var(--cor-superficie); cursor: pointer; font-weight: 700; }
.sacola__vazia { padding: 32px var(--gutter); color: var(--cor-suave); text-align: center; }
.sacola__rodape { padding: 16px var(--gutter) calc(16px + env(safe-area-inset-bottom)); border-top: 1px solid var(--cor-linha); display: grid; gap: 8px; }
.sacola__total { display: flex; justify-content: space-between; font-size: 1.15rem; margin: 0 0 6px; }

.aviso-rapido {
  position: fixed; left: 50%; bottom: 90px; transform: translate(-50%, 20px); z-index: 60;
  background: #1a1a1a; color: #fff; padding: 12px 20px; border-radius: 999px; font-weight: 500;
  opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; max-width: calc(100vw - 32px); text-align: center;
}
.aviso-rapido.visivel { opacity: 1; transform: translate(-50%, 0); }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.card__fotos { cursor: pointer; }

/* ===================== Rodada 2 ===================== */
.zap-flutuante__texto { display: none; }
@media (min-width: 1040px) { .zap-flutuante { padding: 0 22px 0 16px; } .zap-flutuante__texto { display: inline; } }
body.janela-aberta .zap-flutuante { display: none; }

.hero { min-height: min(64svh, 520px); }
@media (min-width: 1040px) { .hero { min-height: 600px; align-items: center; } }
.hero__sobre { font-family: var(--fonte-titulo); font-weight: 600; font-size: .95rem; text-transform: uppercase; letter-spacing: .25em; margin: 0 0 10px; opacity: .95; }
.hero__botoes .botao { flex: 1 1 160px; }
@media (min-width: 720px) { .hero__botoes .botao { flex: 0 0 auto; } }

/* Faixa de benefícios */
.beneficios-faixa { max-width: var(--largura); margin: 0 auto; padding: 0 var(--gutter); }
.beneficios { list-style: none; margin: 0; padding: 16px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; border-bottom: 1px solid var(--cor-linha); }
.beneficio { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; font-size: .82rem; color: var(--cor-texto-suave); line-height: 1.3; }
.beneficio svg { width: 28px; height: 28px; color: var(--cor-ouro); }
.beneficio strong { color: var(--cor-texto); font-size: .9rem; }
@media (min-width: 720px) { .beneficios { gap: 24px; } .beneficio { flex-direction: row; text-align: left; gap: 12px; font-size: .9rem; } .beneficio span { display: block; } }

/* Categorias em círculo */
.secao--curta { padding-top: 28px; }
.categorias { display: flex; gap: 14px; overflow-x: auto; scrollbar-width: none; padding: 6px var(--gutter) 6px; margin: 0 calc(var(--gutter) * -1); }
.categorias::-webkit-scrollbar { display: none; }
.categoria { flex: none; display: flex; flex-direction: column; align-items: center; gap: 8px; background: none; border: 0; cursor: pointer; color: var(--cor-texto); font-weight: 500; font-size: .9rem; min-width: 76px; padding: 4px; }
.categoria .foto { width: 76px; height: 76px; border-radius: 50%; overflow: hidden; background: var(--cor-linha); box-shadow: 0 0 0 2px var(--cor-fundo), 0 0 0 4px var(--cor-linha); }
.categoria .foto img { width: 100%; height: 100%; object-fit: cover; }
.categoria[aria-pressed="true"] .foto { box-shadow: 0 0 0 2px var(--cor-fundo), 0 0 0 4px var(--cor-principal); }
@media (min-width: 1040px) { .categoria .foto { width: 120px; height: 120px; } }

.carrossel { scroll-padding-inline: var(--gutter); grid-auto-columns: 66%; }

/* Card: tamanhos e "avise-me" */
.card__tamanhos { font-size: .75rem; color: var(--cor-texto-suave); margin: 2px 0 0; }
.card__avise { position: relative; z-index: 2; display: inline-flex; align-items: center; min-height: 44px; font-size: .9rem; font-weight: 600; color: var(--cor-principal-texto); }

/* Erro e vazio */
.aviso-vazio { display: grid; justify-items: center; gap: 12px; }
.aviso-vazio p { margin: 0; }
.erro-carga { padding: 24px 18px; border-radius: var(--raio-g); background: color-mix(in srgb, var(--cor-principal) 8%, var(--cor-fundo)); border: 1px solid color-mix(in srgb, var(--cor-principal) 25%, transparent); display: grid; gap: 14px; justify-items: start; }
.erro-carga p { margin: 0; }

/* Lista VIP */
.vip { background: var(--cor-superficie); border: 1px solid var(--cor-linha); border-radius: var(--raio-g); padding: 28px 20px; max-width: 640px; }
.vip__form { display: grid; gap: 14px; margin-top: 18px; }
.vip__campo span { display: block; font-weight: 600; margin-bottom: 6px; }
.vip__campo input { width: 100%; min-height: 50px; padding: 12px 14px; border-radius: 12px; border: 1.5px solid var(--cor-linha); background: #fff; color: #1a1a1a; font-size: 1rem; }
.vip__aceite { display: flex; gap: 12px; align-items: flex-start; font-size: .92rem; line-height: 1.45; cursor: pointer; }
.vip__aceite input { width: 24px; height: 24px; flex: none; margin-top: 1px; accent-color: var(--cor-principal); }
.vip__nota { margin: 0; font-size: .82rem; color: var(--cor-texto-suave); }
.vip__erro { margin: 0; padding: 10px 14px; border-radius: 12px; background: color-mix(in srgb, var(--cor-principal) 10%, transparent); font-weight: 600; }
.vip__ok { margin: 18px 0 0; padding: 14px 16px; border-radius: 12px; background: color-mix(in srgb, var(--cor-zap) 12%, var(--cor-fundo)); font-weight: 600; }
.armadilha { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Rodapé legal */
.rodape { text-align: left; padding: 32px var(--gutter) 110px; }
.rodape__dentro { max-width: var(--largura); margin: 0 auto; }
.rodape__nome { font-family: var(--fonte-titulo); font-weight: 600; font-size: 1.3rem; color: var(--cor-texto); margin: 0 0 6px; }
.rodape__dados { list-style: none; padding: 0; margin: 0 0 12px; display: flex; flex-wrap: wrap; gap: 4px 14px; }
.rodape__texto { margin: 8px 0; max-width: 75ch; }
.rodape__links a { display: inline-flex; align-items: center; min-height: 44px; }
.rodape__pequeno { font-size: .82rem; }

.sacola__nota { margin: 0; font-size: .85rem; color: var(--cor-texto-suave); text-align: center; }

/* Páginas de Privacidade e Trocas */
.legal { max-width: 760px; margin: 0 auto; padding: 32px var(--gutter) 64px; }
.legal h1 { font-family: var(--fonte-titulo); font-weight: 600; font-size: var(--fs-h2); line-height: 1.15; margin: 0 0 8px; }
.legal h2 { font-family: var(--fonte-titulo); font-weight: 600; font-size: 1.6rem; margin: 32px 0 8px; }
.legal p, .legal li { max-width: 70ch; }
.legal__data { color: var(--cor-texto-suave); font-size: .9rem; }
.legal__tabela { overflow-x: auto; }
.legal table { border-collapse: collapse; width: 100%; min-width: 560px; font-size: .92rem; }
.legal th, .legal td { text-align: left; vertical-align: top; padding: 10px; border-bottom: 1px solid var(--cor-linha); }
.legal__links a { display: inline-flex; align-items: center; min-height: 44px; }
.falta { color: var(--cor-texto-suave); }