/* =====================================================
   Vitrine de negócios (serviços, delivery, lojinha, imóveis)
   Usada por servicos.html, delivery.html, shopping.html e imoveis.html
   ===================================================== */
.vitrine {
  --vc: #00adee;
  --vc-ink: #001a24;
  /* Segue o tema da página (claro/escuro, mesmas cores do perfil); sem tema, fica escuro. */
  --vt-bg: var(--bg, #0b1115);
  --vt-card: var(--panel, #10181d);
  --vt-card-2: var(--panel-2, #162128);
  --vt-line: var(--line, #22313a);
  --vt-text: var(--text, #eef3f5);
  --vt-muted: var(--muted, #8fa0ab);
  --vt-text-2: color-mix(in srgb, var(--vt-text) 80%, var(--vt-muted));
  --vt-ok: #4fd88f;
  --vt-bad: #ff8a8e;
  --vt-warn: #f5c542;
  --vt-sombra: rgba(0, 0, 0, .45);
  width: min(1180px, 100%);
  margin: 26px auto 10px;
  padding: 0 16px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--vt-text);
  text-align: left;
}
:root[data-theme="light"] .vitrine { --vt-ok: #138a4b; --vt-bad: #d23b40; --vt-warn: #946b00; --vt-sombra: rgba(15, 30, 40, .14); }
:root[data-theme="light"] .vt-modal { background: rgba(10, 20, 26, .5); }
:root[data-theme="light"] .vt-modal .caixa { box-shadow: 0 30px 80px rgba(15, 30, 40, .25); }
.vitrine[data-tipo="delivery"] { --vc: #ff7a1a; --vc-ink: #2a1100; }
.vitrine[data-tipo="lojinha"] { --vc: #b066ff; --vc-ink: #1d0033; }
.vitrine[data-tipo="imoveis"] { --vc: #2fbf71; --vc-ink: #002612; }
.vitrine[data-tipo="saude"] { --vc: #0fb5a6; --vc-ink: #00261f; }
.vitrine[data-tipo="comunidade"] { --vc: #e5487f; --vc-ink: #2b0013; }
.vitrine * { box-sizing: border-box; }
.vitrine [hidden] { display: none !important; }
.vitrine button { font: inherit; color: inherit; }
.vitrine svg.vi { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.vitrine svg.vi.s { width: 15px; height: 15px; }

.vt-cabeca { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.vt-cabeca h2 { margin: 0; font-size: clamp(20px, 3vw, 26px); font-weight: 800; letter-spacing: -.3px; }
.vt-cabeca h2 span { color: var(--vc); }
.vt-cabeca p { margin: 4px 0 0; color: var(--vt-muted); font-size: 14px; }
.vt-criar { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 12px; background: var(--vc); color: var(--vc-ink); font-weight: 800; font-size: 14px; text-decoration: none; white-space: nowrap; }
.vt-criar:hover { filter: brightness(1.08); }
.vt-contagem { color: var(--vt-muted); font-size: 13px; margin: -6px 0 14px; }

.vt-grade { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); }
.vitrine[data-tipo="imoveis"] .vt-grade { grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)); }

.vt-card {
  position: relative; display: flex; flex-direction: column; background: var(--vt-card); border: 1px solid var(--vt-line);
  border-radius: 22px; overflow: hidden; cursor: pointer; transition: transform .2s, border-color .2s, box-shadow .2s;
}
.vt-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--vc) 55%, var(--vt-line)); box-shadow: 0 18px 40px var(--vt-sombra); }
.vt-card:focus-visible { outline: 2px solid var(--vc); outline-offset: 3px; }
.vt-avatar { width: 56px; height: 56px; border-radius: 50%; overflow: hidden; flex-shrink: 0; display: grid; place-items: center; font-weight: 800; color: #fff; background: linear-gradient(135deg, #0a3140, var(--vc)); }
.vt-avatar img { width: 100%; height: 100%; object-fit: cover; }
.vt-nome { margin: 0; font-size: 17px; font-weight: 800; line-height: 1.25; }
.vt-sub { color: var(--vt-muted); font-size: 13px; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.vt-tag { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 750; background: color-mix(in srgb, var(--vc) 15%, transparent); color: var(--vc); }
.vt-tag.neutra { background: var(--vt-card-2); color: var(--vt-muted); }
.vt-tag.ok { background: rgba(47, 191, 113, .16); color: var(--vt-ok); }
.vt-tag.off { background: rgba(229, 72, 77, .14); color: var(--vt-bad); }
.vt-desc { margin: 0; color: var(--vt-text-2); font-size: 14px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vt-botoes { display: flex; gap: 8px; margin-top: auto; padding-top: 12px; }
.vt-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 0; border-radius: 12px; padding: 10px 12px; font-weight: 800; font-size: 13.5px; cursor: pointer; text-decoration: none; }
.vt-btn.pri { background: var(--vc); color: var(--vc-ink); }
.vt-btn.sec { background: var(--vt-card-2); color: var(--vt-text); border: 1px solid var(--vt-line); }
.vt-btn.whats { background: #1fa855; color: #fff; }
.vt-btn:hover { filter: brightness(1.08); }
.vt-dono { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--vt-muted); }
.vt-dono .vt-avatar { width: 24px; height: 24px; font-size: 10px; }

/* ---------- Serviços: cartão de profissional ---------- */
.vt-servico { padding: 18px; gap: 12px; }
.vt-servico::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, var(--vc), #7de3ff); }
.vt-servico .topo { display: flex; gap: 14px; align-items: center; }
.vt-servico .vt-avatar { width: 64px; height: 64px; box-shadow: 0 0 0 3px var(--vt-card), 0 0 0 5px var(--vc); }
.vt-preco-desde { display: flex; align-items: baseline; gap: 6px; }
.vt-preco-desde small { color: var(--vt-muted); font-size: 12px; }
.vt-preco-desde strong { font-size: 20px; color: var(--vc); }
.vt-lista-serv { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.vt-lista-serv li { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; padding: 8px 10px; border-radius: 10px; background: var(--vt-card-2); }
.vt-lista-serv li span:last-child { color: var(--vc); font-weight: 800; white-space: nowrap; }
.vt-modos { display: flex; gap: 6px; flex-wrap: wrap; }

/* ---------- Delivery: cartão de restaurante ---------- */
.vt-delivery .capa { position: relative; aspect-ratio: 16 / 8; background: #1a0f06 center / cover no-repeat; }
.vt-delivery .capa::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(0, 0, 0, .65)); }
.vt-delivery .capa .vt-tag { position: absolute; top: 12px; left: 12px; z-index: 2; backdrop-filter: blur(6px); }
.vt-delivery .capa .vt-tag.ok { background: rgba(0, 0, 0, .62); color: #5be39a; }
.vt-delivery .capa .vt-tag.off { background: rgba(0, 0, 0, .62); color: #ff9a9e; }
.vt-delivery .logo { position: absolute; left: 16px; bottom: -26px; z-index: 3; width: 60px; height: 60px; border: 3px solid var(--vt-card); box-shadow: 0 6px 18px rgba(0, 0, 0, .45); }
.vt-delivery .corpo { padding: 32px 16px 16px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.vt-infos { display: flex; gap: 14px; flex-wrap: wrap; font-size: 13px; color: var(--vt-muted); }
.vt-infos span { display: inline-flex; align-items: center; gap: 5px; }
.vt-infos strong { color: var(--vt-text); }
.vt-cardapio { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.vt-cardapio::-webkit-scrollbar { display: none; }
.vt-prato { flex: 0 0 104px; }
.vt-prato .ft { aspect-ratio: 1; border-radius: 12px; background: var(--vt-card-2) center / cover; }
.vt-prato small { display: block; margin-top: 5px; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-prato strong { font-size: 12.5px; color: var(--vc); }

/* ---------- Lojinha: vitrine de loja ---------- */
.vt-loja { padding: 16px; gap: 12px; }
.vt-loja .topo { display: flex; gap: 12px; align-items: center; }
.vt-loja .vt-avatar { border-radius: 16px; }
.vt-produtos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.vt-produto { position: relative; aspect-ratio: 3 / 4; border-radius: 14px; overflow: hidden; background: var(--vt-card-2) center / cover; }
.vt-produto span { position: absolute; left: 6px; bottom: 6px; padding: 3px 8px; border-radius: 8px; background: rgba(0, 0, 0, .7); font-size: 12px; font-weight: 800; }
.vt-produto.vazio { display: grid; place-items: center; color: var(--vt-muted); font-size: 12px; text-align: center; padding: 8px; }

/* ---------- Imóveis: anúncio ---------- */
.vt-imovel .galeria { position: relative; aspect-ratio: 4 / 3; background: #07170f center / cover no-repeat; }
.vt-imovel .galeria::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, .7)); }
.vt-imovel .galeria .vt-tag { position: absolute; top: 12px; left: 12px; z-index: 2; background: var(--vc); color: var(--vc-ink); }
.vt-imovel .galeria .fotos-n { position: absolute; top: 12px; right: 12px; z-index: 2; padding: 4px 9px; border-radius: 999px; background: rgba(0, 0, 0, .6); font-size: 12px; font-weight: 700; display: inline-flex; gap: 5px; align-items: center; }
.vt-imovel .galeria .preco { position: absolute; left: 14px; bottom: 12px; z-index: 2; font-size: 24px; font-weight: 900; letter-spacing: -.4px; text-shadow: 0 2px 10px rgba(0, 0, 0, .6); }
.vt-imovel .galeria .preco small { font-size: 13px; font-weight: 700; opacity: .85; }
.vt-imovel .corpo { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.vt-specs { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--vt-line); border-radius: 14px; overflow: hidden; }
.vt-specs div { padding: 9px 4px; text-align: center; font-size: 11.5px; color: var(--vt-muted); }
.vt-specs div + div { border-left: 1px solid var(--vt-line); }
.vt-specs strong { display: flex; justify-content: center; align-items: center; gap: 4px; font-size: 15px; color: var(--vt-text); }

/* ---------- estados ---------- */
.vt-mais { display: flex; justify-content: center; margin: 18px 0 6px; }
.vt-mais[hidden] { display: none; }
.vt-mais-bt { min-height: 44px; padding: 0 22px; border-radius: 999px; border: 1px solid var(--vt-line); background: transparent; color: inherit; font: inherit; font-weight: 700; cursor: pointer; }
.vt-mais-bt:hover { border-color: currentColor; }
.vt-mais-bt:disabled { opacity: .6; cursor: wait; }
.vt-vazio { grid-column: 1 / -1; padding: 46px 20px; text-align: center; border: 1px dashed var(--vt-line); border-radius: 22px; color: var(--vt-muted); }
.vt-vazio strong { display: block; color: var(--vt-text); font-size: 17px; margin-bottom: 6px; }
.vt-vazio .vt-criar { margin-top: 14px; }
.vt-esqueleto { position: relative; height: 300px; border-radius: 22px; overflow: hidden; background: var(--vt-card); border: 1px solid var(--vt-line); pointer-events: none; }
.vt-esqueleto i { --sk: color-mix(in srgb, var(--vt-card) 90%, var(--vt-text, #888) 10%); position: absolute; display: block; background: linear-gradient(90deg, var(--sk) 25%, color-mix(in srgb, var(--sk) 70%, var(--vt-card) 30%) 50%, var(--sk) 75%); background-size: 200% 100%; animation: vt-brilho 1.2s infinite linear; }
.vt-esqueleto .sk-capa { inset: 0 0 auto 0; height: 42%; }
.vt-esqueleto .sk-av { left: 50%; top: 42%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; border: 4px solid var(--vt-card); }
.vt-esqueleto .sk-l1 { left: 18%; right: 18%; top: calc(42% + 46px); height: 13px; border-radius: 7px; }
.vt-esqueleto .sk-l2 { left: 28%; right: 28%; top: calc(42% + 70px); height: 10px; border-radius: 5px; opacity: .75; }
.vt-esqueleto .sk-l3 { left: 14px; right: 14px; bottom: 16px; height: 30px; border-radius: 12px; opacity: .55; }
@media (prefers-reduced-motion: reduce) { .vt-esqueleto i { animation: none; } }
@keyframes vt-brilho { to { background-position: -200% 0; } }

/* ---------- detalhe ---------- */
.vt-modal { position: fixed; inset: 0; z-index: 9000; display: grid; place-items: center; padding: 20px; background: rgba(2, 6, 9, .78); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.vt-modal .caixa { width: min(720px, 100%); max-height: 90vh; overflow-y: auto; background: var(--vt-card); border: 1px solid var(--vt-line); border-radius: 26px; color: var(--vt-text); box-shadow: 0 30px 80px rgba(0, 0, 0, .6); }
.vt-modal .fechar { position: sticky; top: 10px; float: right; margin: 10px 10px -52px 0; z-index: 5; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(0, 0, 0, .6); color: #fff; cursor: pointer; display: grid; place-items: center; }
.vt-modal .fotos { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; background: #000; }
.vt-modal .fotos img { flex: 0 0 100%; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; scroll-snap-align: start; }
.vt-modal .conteudo { padding: 18px 20px 22px; display: grid; gap: 14px; }
.vt-modal h3 { margin: 0; font-size: 22px; }
.vt-modal h4 { margin: 4px 0 0; font-size: 13px; letter-spacing: .6px; text-transform: uppercase; color: var(--vc); }
.vt-modal .texto { margin: 0; white-space: pre-wrap; color: var(--vt-text-2); line-height: 1.55; }
.vt-itens { display: grid; gap: 8px; }
.vt-item { display: flex; gap: 12px; align-items: center; padding: 10px; border-radius: 14px; background: var(--vt-card-2); }
.vt-item .ft { width: 58px; height: 58px; border-radius: 12px; background: var(--vt-card-2) center / cover; flex-shrink: 0; }
.vt-item .tx { flex: 1; min-width: 0; }
.vt-item .tx strong { display: block; }
.vt-item .tx small { color: var(--vt-muted); }
.vt-item .pr { font-weight: 900; color: var(--vc); white-space: nowrap; }
.vt-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 9100; padding: 12px 18px; border-radius: 12px; background: var(--vt-text); color: var(--vt-card); font-weight: 700; font-family: inherit; }

@media (max-width: 640px) {
  .vt-grade { grid-template-columns: 1fr; }
  .vt-modal { padding: 0; align-items: end; }
  .vt-modal .caixa { border-radius: 24px 24px 0 0; max-height: 92vh; }
}
.vt-modal.vitrine { width: auto; margin: 0; padding: 20px; }
@media (max-width: 640px) { .vt-modal.vitrine { padding: 0; } }

/* ---------- perfil completo do negócio ---------- */
.vt-modal .caixa.vd { position: relative; padding: 0; }
.vd-capa { position: relative; aspect-ratio: 16 / 7; background: #06202c center / cover no-repeat; }
.vd-capa::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .1), rgba(0, 0, 0, .55)); }
.vd-logo { position: absolute; left: 20px; bottom: -34px; z-index: 2; width: 80px; height: 80px; font-size: 24px; border: 4px solid var(--vt-card); box-shadow: 0 8px 22px rgba(0, 0, 0, .45); }
.vitrine[data-tipo="lojinha"] .vd-logo { border-radius: 22px; }
.vt-modal .caixa.vd .conteudo { padding-top: 44px; }
.vd-cab { display: grid; gap: 8px; }
.vd-previa { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 14px; border-radius: 14px; background: color-mix(in srgb, var(--vc) 14%, transparent); border: 1px dashed color-mix(in srgb, var(--vc) 60%, transparent); font-size: 13px; }
.vd-previa span { flex: 1; min-width: 180px; }
.vd-previa .vt-btn { flex: 0 0 auto; }
.vd-fatos { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; }
.vd-fato { display: grid; gap: 2px; padding: 12px; border-radius: 14px; background: var(--vt-card-2); border: 1px solid var(--vt-line); }
.vd-fato svg { color: var(--vc); margin-bottom: 4px; }
.vd-fato strong { font-size: 15px; }
.vd-fato small { color: var(--vt-muted); font-size: 11.5px; text-transform: uppercase; letter-spacing: .5px; }
.vd-itens { display: grid; gap: 10px; grid-template-columns: repeat(2, 1fr); }
.vd-itens.lojinha { grid-template-columns: repeat(3, 1fr); }
.vd-item { display: grid; gap: 4px; padding: 8px; border-radius: 16px; background: var(--vt-card-2); border: 1px solid var(--vt-line); }
.vd-item .ft { aspect-ratio: 1; border-radius: 12px; background: var(--vt-card-2) center / cover; display: grid; place-items: center; color: var(--vt-muted); }
.vd-itens.lojinha .vd-item .ft { aspect-ratio: 3 / 4; }
.vd-item strong { font-size: 13.5px; line-height: 1.3; }
.vd-item span { color: var(--vc); font-weight: 900; font-size: 13.5px; }
.vd-galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; }
.vd-galeria img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; cursor: zoom-in; }
.vitrine[data-tipo="imoveis"] .vd-galeria img:first-child { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
.vd-acoes { position: sticky; bottom: 0; display: flex; gap: 8px; padding: 12px 0 2px; background: linear-gradient(180deg, transparent, var(--vt-card) 30%); }
@media (max-width: 640px) { .vd-itens.lojinha { grid-template-columns: repeat(2, 1fr); } }

a.vt-dono { text-decoration: none; width: fit-content; border-radius: 999px; padding: 2px 8px 2px 2px; margin-left: -2px; }
a.vt-dono:hover { background: var(--vt-card-2); color: var(--vt-text); }
a.vt-dono strong { color: var(--vt-text); font-weight: 750; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--vc) 60%, transparent); text-underline-offset: 3px; }

/* ===== v6: cartões reorganizados, vários imóveis, anunciante ===== */
.vt-card .vt-dono .vt-avatar, .vd .vt-dono .vt-avatar { width: 24px; height: 24px; font-size: 10px; box-shadow: none; border: 0; border-radius: 50%; }
.vt-topo { display: flex; gap: 14px; align-items: center; }
.vt-topo .vt-avatar { width: 58px; height: 58px; box-shadow: 0 0 0 3px var(--vt-card), 0 0 0 5px var(--vc); }
.vt-topo-tx { min-width: 0; flex: 1; display: grid; gap: 4px; }
.vt-topo-tx .vt-nome { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-local { display: inline-flex; align-items: center; gap: 4px; }
.vt-areas { display: flex; flex-wrap: wrap; gap: 6px; }
.vt-tag.cnh { background: rgba(245, 183, 0, .14); color: var(--vt-warn); }
.vt-tag svg { width: 14px; height: 14px; }
.vt-linha-preco { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.vt-rodape { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--vt-line); display: grid; gap: 10px; }
.vt-rodape .vt-botoes { padding-top: 0; margin-top: 0; }
.vt-servico .vt-lista-serv li { padding: 7px 10px; }
.vd-subtitulo { font-size: 12.5px; font-weight: 800; color: var(--vt-muted); margin: 2px 0 -6px; }
.vd-imoveis { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.vd-imoveis.linha { display: flex; overflow-x: auto; scrollbar-width: none; }
.vd-imoveis.linha::-webkit-scrollbar { display: none; }
.vd-imoveis.linha .vd-mini-imovel { flex: 0 0 210px; }
.vd-mini-imovel { display: grid; border: 1px solid var(--vt-line); background: var(--vt-card-2); border-radius: 16px; overflow: hidden; padding: 0; text-align: left; cursor: pointer; color: var(--vt-text); }
.vd-mini-imovel:hover { border-color: var(--vc); }
.vd-mini-imovel .ft { position: relative; aspect-ratio: 16 / 10; background: #07170f center / cover; }
.vd-mini-imovel .ft .vt-tag { position: absolute; top: 8px; left: 8px; background: var(--vc); color: var(--vc-ink); }
.vd-mini-imovel .tx { display: grid; gap: 2px; padding: 10px 12px 12px; }
.vd-mini-imovel .tx strong { color: var(--vc); font-size: 16px; }
.vd-mini-imovel .tx span { font-size: 13.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vd-mini-imovel .tx small { color: var(--vt-muted); font-size: 12px; }
.vd-fotos { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; background: #000; scrollbar-width: none; }
.vd-fotos::-webkit-scrollbar { display: none; }
.vd-fotos img { flex: 0 0 100%; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; scroll-snap-align: start; }
.vd-fotos-n { font-size: 12px; color: var(--vt-muted); text-align: center; padding: 8px 0 0; }
.vt-modal .caixa.vd > .vd-fotos ~ .conteudo { padding-top: 16px; }
.vd-preco { font-size: 28px; font-weight: 900; letter-spacing: -.5px; color: var(--vc); }
.vd-anunciante { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: var(--vt-card-2); border: 1px solid var(--vt-line); }
.vd-anunciante .tx { display: grid; gap: 4px; }
.vd-anunciante small { color: var(--vt-muted); font-size: 12.5px; }

/* ===== v7: botões com a fonte certa e blocos de informação organizados ===== */
.vt-btn, button.vt-btn { font-family: inherit !important; font-size: 13.5px !important; font-weight: 800 !important; line-height: 1.2; white-space: nowrap; min-height: 44px; letter-spacing: 0; }
.vt-botoes .vt-btn, .vd-contato .vt-btn { min-width: 0; }
.vd-fatos { grid-template-columns: 1fr 1fr; gap: 1px; background: var(--vt-line); border: 1px solid var(--vt-line); border-radius: 16px; overflow: hidden; }
.vd-fato { grid-template-columns: 36px 1fr; column-gap: 10px; row-gap: 1px; align-items: center; align-content: center; min-height: 64px; padding: 10px 12px; border: 0; border-radius: 0; background: var(--vt-card-2); }
.vitrine .vd-fato svg.vi, .vd-fato svg { grid-row: 1 / 3; grid-column: 1; width: 36px; height: 36px; padding: 9px; box-sizing: border-box; margin: 0; border-radius: 10px; background: color-mix(in srgb, var(--vc) 15%, transparent); }
.vd-fato small { grid-row: 1; grid-column: 2; font-size: 10.5px; }
.vd-fato strong { grid-row: 2; grid-column: 2; font-size: 14px; line-height: 1.25; overflow-wrap: anywhere; }
.vd-fato:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (max-width: 340px) { .vd-fatos { grid-template-columns: 1fr; } }

/* ===== v8: carrinho (delivery e lojinha), estoque e fechar negócio ===== */
.vd-dica { margin: -4px 0 10px; color: var(--vt-muted); font-size: 13px; }
.vd-item { position: relative; align-content: start; }
.vd-item .ft { position: relative; }
.vd-item.esgotado { opacity: .55; }
.vd-selo { position: absolute; left: 6px; top: 6px; padding: 3px 8px; border-radius: 999px; background: rgba(0, 0, 0, .7); color: #fff; font-size: 11px; font-weight: 800; }
.vd-selo.ok { background: var(--vc); color: var(--vc-ink); }
.vd-qtd { margin-top: 4px; display: grid; grid-template-columns: 34px 1fr 34px; align-items: center; height: 36px; border-radius: 12px; background: color-mix(in srgb, var(--vc) 14%, transparent); overflow: hidden; }
.vd-qtd:not(.ativo) { display: block; background: none; }
.vd-qtd button { height: 100%; border: 0; background: transparent; color: var(--vc); cursor: pointer; display: grid; place-items: center; padding: 0; font-family: inherit; }
.vd-qtd button:disabled { opacity: .35; cursor: default; }
.vd-qtd strong { text-align: center; font-size: 15px; color: var(--vt-text); }
.vd-item .vd-qtd strong { font-size: 15px; }
.vd-qtd .vd-add { width: 100%; height: 36px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--vc) 55%, transparent); color: var(--vc); font-weight: 800; font-size: 13px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
.vd-qtd .vd-add:hover { background: color-mix(in srgb, var(--vc) 14%, transparent); }
.vd-vendi { margin-top: 4px; height: 34px; border-radius: 10px; border: 1px dashed var(--vt-line); background: transparent; color: var(--vt-muted); font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
.vd-vendi:hover { color: var(--vt-text); border-color: var(--vc); }
.vd.com-carrinho > .conteudo > .vd-acoes { display: none; }
.vd-carrinho { position: sticky; bottom: 0; z-index: 4; display: flex; align-items: center; gap: 12px; margin-top: 14px; padding: 10px 10px 10px 14px; border-radius: 16px; background: var(--vt-card-2); border: 1px solid color-mix(in srgb, var(--vc) 50%, var(--vt-line)); box-shadow: 0 -10px 30px var(--vt-sombra); }
.vd-carrinho[hidden] { display: none; }
.vd-carrinho .tx { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; color: var(--vc); }
.vd-carrinho .tx .n { min-width: 24px; height: 24px; margin-left: -18px; margin-top: -18px; padding: 0 6px; border-radius: 999px; background: var(--vc); color: var(--vc-ink); font-size: 12px; font-weight: 900; display: grid; place-items: center; }
.vd-carrinho .tx div { display: grid; line-height: 1.2; }
.vd-carrinho .tx small { color: var(--vt-muted); font-size: 12px; }
.vd-carrinho .tx strong { color: var(--vt-text); font-size: 17px; }
.vd-carrinho .vt-btn { flex: 0 0 auto; }
.vd-pedido { max-width: 520px; }
.vd-pedido .conteudo { padding-top: 22px; }
.vd-pedido-lista { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.vd-pedido-lista li { display: grid; grid-template-columns: 112px 1fr auto; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 14px; background: var(--vt-card-2); border: 1px solid var(--vt-line); }
.vd-pedido-lista .vd-qtd { margin: 0; }
.vd-pedido-lista .tx { display: grid; min-width: 0; }
.vd-pedido-lista .tx strong { font-size: 14px; overflow-wrap: anywhere; }
.vd-pedido-lista .tx small { color: var(--vt-muted); font-size: 12px; }
.vd-pedido-lista .vl { font-weight: 900; color: var(--vt-text); white-space: nowrap; }
.vd-totais { margin-top: 12px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--vt-line); display: grid; gap: 6px; font-size: 14px; color: var(--vt-muted); }
.vd-totais div { display: flex; justify-content: space-between; gap: 10px; }
.vd-totais .total { padding-top: 8px; border-top: 1px solid var(--vt-line); color: var(--vt-text); font-size: 17px; font-weight: 900; }
.vd-totais .total span:last-child { color: var(--vc); }
.vd-aviso { margin: 10px 0 0; padding: 10px 12px; border-radius: 12px; background: color-mix(in srgb, #f5b700 14%, transparent); color: var(--vt-warn); font-size: 13px; font-weight: 700; }
.vd-obs { width: 100%; box-sizing: border-box; margin-top: 12px; min-height: 70px; resize: vertical; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--vt-line); background: var(--vt-card-2); color: var(--vt-text); font: inherit; font-size: 14px; }
.vd-obs:focus { outline: none; border-color: var(--vc); }
.vd-limpar { display: block; margin: 10px auto 0; border: 0; background: none; color: var(--vt-muted); font: inherit; font-size: 13px; text-decoration: underline; cursor: pointer; }
@media (max-width: 420px) { .vd-pedido-lista li { grid-template-columns: 100px 1fr; } .vd-pedido-lista .vl { grid-column: 2; justify-self: end; margin-top: -6px; } }

/* ===== v9: layouts por página (lista, carrossel, marketplace) ===== */
.vt-destaques:empty { display: none; }
.vt-carrossel { margin: 0 0 22px; }
.vt-car-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.vt-car-topo h3, .vt-titulo-lista { margin: 0; font-size: 17px; font-weight: 800; letter-spacing: -.2px; }
.vt-titulo-lista { grid-column: 1 / -1; margin: 2px 0 -4px; }
.vt-setas { display: flex; gap: 6px; }
.vt-setas button { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--vt-line); background: var(--vt-card); color: var(--vt-text); cursor: pointer; display: grid; place-items: center; }
.vt-setas button.esq svg { transform: rotate(180deg); }
.vt-trilho { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 2px 2px 8px; scrollbar-width: none; }
.vt-trilho::-webkit-scrollbar { display: none; }
.vt-trilho > * { scroll-snap-align: start; flex: 0 0 auto; }
@media (max-width: 640px) { .vt-setas { display: none; } .vt-trilho { margin: 0 -16px; padding: 2px 16px 8px; scroll-padding: 16px; } }
.vt-carrossel.abertos .vt-card { width: 280px; }
.vt-carrossel .vt-rodape, .vt-carrossel .vt-cardapio, .vt-carrossel .vt-desc { display: none; }
.vt-carrossel.abertos .vt-delivery .corpo { padding-bottom: 14px; }

/* Serviços: destaque com foto e lista de profissionais */
.vt-destaque { width: 220px; border-radius: 18px; overflow: hidden; background: var(--vt-card); border: 1px solid var(--vt-line); cursor: pointer; }
.vt-destaque .capa { position: relative; aspect-ratio: 4 / 3; background: #06202c center / cover; }
.vt-destaque .capa .vt-avatar { position: absolute; left: 10px; bottom: -20px; width: 44px; height: 44px; font-size: 14px; border: 3px solid var(--vt-card); }
.vt-destaque .tx { padding: 26px 12px 12px; display: grid; gap: 2px; }
.vt-destaque .tx strong { font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-destaque .tx small { color: var(--vt-muted); font-size: 12px; }
.vt-destaque .pr { color: var(--vc); font-weight: 800; font-size: 13px; }
.vt-grade.lista { grid-template-columns: repeat(auto-fill, minmax(min(100%, 440px), 1fr)); }
.vt-tag.urgente { background: rgba(255, 90, 90, .16); color: var(--vt-bad); }

/* Delivery: lista de restaurantes (estilo app de comida) */
.vt-grade.lista-lojas { grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); gap: 10px 16px; }
.vt-linha-loja { display: flex; align-items: center; gap: 14px; padding: 12px; border-radius: 18px; background: var(--vt-card); border: 1px solid var(--vt-line); cursor: pointer; transition: border-color .15s, transform .15s; }
.vt-linha-loja:hover { border-color: color-mix(in srgb, var(--vc) 55%, var(--vt-line)); transform: translateY(-1px); }
.vt-linha-loja.fechado { opacity: .62; }
.vt-linha-loja .logo { width: 64px; height: 64px; border-radius: 16px; font-size: 18px; }
.vt-linha-loja .tx { flex: 1; min-width: 0; display: grid; gap: 3px; }
.vt-linha-loja .tx strong { font-size: 15.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-linha-loja .tx small { color: var(--vt-muted); font-size: 12.5px; }
.vt-linha-loja .vt-infos { gap: 10px; font-size: 12.5px; }
.vt-linha-loja .gratis { color: var(--vt-ok); font-weight: 700; }
.vt-linha-loja .aberto { color: var(--vt-ok); font-weight: 700; }
.vt-linha-loja .fechado-tx { color: var(--vt-bad); font-weight: 700; }
.vt-linha-loja .mini { display: flex; flex-shrink: 0; }
.vt-linha-loja .mini span { width: 40px; height: 40px; border-radius: 10px; background: #1a0f06 center / cover; border: 2px solid var(--vt-card); margin-left: -12px; }
@media (max-width: 420px) { .vt-linha-loja .mini { display: none; } }

/* Shopping: lojas em bolinhas e grade de produtos (estilo marketplace) */
.vt-bolha-loja { width: 76px; display: grid; justify-items: center; gap: 6px; border: 0; background: none; cursor: pointer; padding: 0; }
.vt-bolha-loja .vt-avatar { width: 64px; height: 64px; box-shadow: 0 0 0 2px var(--vt-bg), 0 0 0 4px var(--vc); }
.vt-bolha-loja span { font-size: 12px; max-width: 76px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--vt-text); }
.vt-grade.produtos { grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 640px) { .vt-grade.produtos { grid-template-columns: repeat(3, 1fr); gap: 14px; } }
@media (min-width: 900px) { .vt-grade.produtos { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1120px) { .vt-grade.produtos { grid-template-columns: repeat(5, 1fr); } }
.vt-prod { position: relative; display: flex; flex-direction: column; border-radius: 16px; overflow: hidden; background: var(--vt-card); border: 1px solid var(--vt-line); cursor: pointer; transition: transform .15s, border-color .15s; }
.vt-prod:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--vc) 55%, var(--vt-line)); }
.vt-prod.esgotado { opacity: .55; }
.vt-prod .ft { position: relative; aspect-ratio: 1; background: var(--vt-card-2) center / cover; display: grid; place-items: center; color: var(--vt-muted); }
.vt-prod .selo { position: absolute; left: 8px; top: 8px; padding: 3px 8px; border-radius: 8px; background: rgba(0, 0, 0, .72); color: #fff; font-size: 11px; font-weight: 800; }
.vt-prod .selo.desc { background: #16a34a; }
.vt-prod .selo.cond { top: auto; bottom: 8px; background: rgba(0, 0, 0, .6); }
.vt-prod .tx { padding: 9px 10px 11px; display: grid; gap: 3px; }
.vt-prod .nome { font-size: 13.5px; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em; }
.vt-prod small { color: var(--vt-muted); font-size: 11.5px; }
.vt-prod .loja { display: flex; align-items: center; gap: 4px; font-size: 11.5px; color: var(--vt-muted); white-space: nowrap; overflow: hidden; }
.vt-prod .loja em { font-style: normal; margin-left: auto; color: var(--vt-ok); font-weight: 700; }
.vd-preco-prod { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.vd-preco-prod s { color: var(--vt-muted); font-size: 12px; }
.vd-preco-prod strong { font-size: 17px; font-weight: 900; color: var(--vt-text); }
.vd-preco-prod .desc { color: var(--vt-ok); font-size: 12px; font-weight: 800; }
.vd-itens.lojinha { gap: 10px; }
.vd-itens.lojinha .vt-prod .vd-vendi { margin: 0 10px 10px; }
.vt-modal .vd-produto .vd-preco-prod strong { font-size: 26px; }

/* Janela de produto */
.vd-produto .vd-prod-foto { position: relative; aspect-ratio: 1; max-height: 58vh; width: 100%; background: var(--vt-card-2) center / contain no-repeat; display: grid; place-items: center; color: var(--vt-muted); }
.vd-produto .vd-prod-foto .vd-selo { left: 14px; top: 14px; }
.vd-condicao { color: var(--vt-muted); font-size: 12.5px; }
.vd-ficha { display: grid; grid-template-columns: minmax(90px, 35%) 1fr; margin: 0; border: 1px solid var(--vt-line); border-radius: 14px; overflow: hidden; font-size: 13.5px; }
.vd-ficha dt, .vd-ficha dd { margin: 0; padding: 9px 12px; border-bottom: 1px solid var(--vt-line); }
.vd-ficha dt { color: var(--vt-muted); background: var(--vt-card-2); }
.vd-ficha dt:nth-last-child(2), .vd-ficha dd:last-child { border-bottom: 0; }
.vd-loja-mini { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px; border-radius: 14px; border: 1px solid var(--vt-line); background: var(--vt-card-2); cursor: pointer; text-align: left; }
.vd-loja-mini > div { flex: 1; display: grid; }
.vd-loja-mini small { color: var(--vt-muted); font-size: 12px; }
.vd-loja-mini .vt-avatar { width: 44px; height: 44px; border-radius: 12px; font-size: 14px; }

/* Formulários dentro das janelas (pedido, orçamento, produto) */
.vd-campo { display: grid; gap: 8px; }
.vd-campo > label { font-size: 13.5px; font-weight: 800; color: var(--vt-text); }
.vd-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.vd-chip { padding: 8px 14px; border-radius: 999px; border: 1px solid var(--vt-line); background: var(--vt-card-2); color: var(--vt-text); font-size: 13.5px; font-weight: 700; cursor: pointer; }
.vd-chip.on { border-color: var(--vc); background: color-mix(in srgb, var(--vc) 18%, transparent); color: var(--vc); }
.vd-input { width: 100%; padding: 11px 12px; border-radius: 12px; border: 1px solid var(--vt-line); background: var(--vt-card-2); color: var(--vt-text); font: inherit; font-size: 14px; color-scheme: dark; }
.vd-input:focus { outline: none; border-color: var(--vc); }
.vd-obs.curto { min-height: 56px; margin-top: 0; }
.vd-campo .vd-obs { margin-top: 0; }
.vd-link { justify-self: start; display: inline-flex; align-items: center; gap: 6px; border: 0; background: none; color: var(--vc); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; padding: 2px 0; }
.vd-nota { color: var(--vt-muted); font-size: 12px; margin: 0; }
.vd-duas { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 10px; }
@media (max-width: 460px) { .vd-duas { grid-template-columns: 1fr; } }
.vd-neg-mini { display: flex; align-items: center; gap: 8px; color: var(--vt-muted); font-size: 13.5px; }
.vd-neg-mini .vt-avatar { width: 26px; height: 26px; font-size: 10px; }

/* Serviços no perfil: cada serviço com preço, como cobra e botão Pedir */
.vd-diferenciais { display: flex; flex-wrap: wrap; gap: 6px; }
.vd-servicos { display: grid; gap: 8px; }
.vd-serv { display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; padding: 12px 14px; border-radius: 14px; background: var(--vt-card-2); border: 1px solid var(--vt-line); }
.vd-serv .tx { display: grid; gap: 3px; min-width: 0; }
.vd-serv .tx strong { font-size: 14.5px; }
.vd-serv .tx small { color: var(--vt-muted); font-size: 12px; }
.vd-serv .tx p { margin: 2px 0 0; color: var(--vt-text-2); font-size: 13px; line-height: 1.45; }
.vd-serv .pr { display: grid; justify-items: end; gap: 2px; text-align: right; flex-shrink: 0; }
.vd-serv .pr strong { color: var(--vc); font-size: 15px; white-space: nowrap; }
.vd-serv .pr small { color: var(--vt-muted); font-size: 11.5px; }
.vd-pedir { margin-top: 6px; padding: 6px 14px; border-radius: 999px; border: 1px solid var(--vc); background: transparent; color: var(--vc); font: inherit; font-size: 12.5px; font-weight: 800; cursor: pointer; }
.vd-pedir:hover { background: color-mix(in srgb, var(--vc) 16%, transparent); }

/* Cardápio do delivery em linhas, por seção */
.vd-cardapio-area { display: grid; gap: 10px; }
.vd-secoes { position: sticky; top: 0; z-index: 3; display: flex; gap: 8px; overflow-x: auto; padding: 8px 0; background: var(--vt-card); scrollbar-width: none; }
.vd-secoes::-webkit-scrollbar { display: none; }
.vd-secoes .vd-chip { flex: 0 0 auto; }
.vd-secao-tit { font-size: 16px; font-weight: 800; margin-top: 6px; scroll-margin-top: 60px; }
.vd-pratos { display: grid; gap: 0; border-top: 1px solid var(--vt-line); }
.vd-prato { display: flex; gap: 14px; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid var(--vt-line); }
.vd-prato.esgotado { opacity: .5; }
.vd-prato .tx { display: grid; gap: 4px; align-content: start; min-width: 0; }
.vd-prato .tx strong { font-size: 15px; }
.vd-prato .tx p { margin: 0; color: var(--vt-muted); font-size: 13px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.vd-prato .vd-preco-prod strong { font-size: 15px; }
.vd-prato .lado { display: grid; gap: 6px; width: 112px; flex-shrink: 0; }
.vd-prato .ft { aspect-ratio: 1; border-radius: 12px; background: var(--vt-card-2) center / cover; display: grid; place-items: center; color: var(--vt-muted); }
.vd-prato .vd-qtd { margin: 0; height: 34px; }
.vd-prato .vd-qtd .vd-add { height: 34px; font-size: 12.5px; }
.vd-selo-inline { text-align: center; font-size: 12px; font-weight: 800; color: var(--vt-bad); }

/* Imóvel: características e condições */
.vd-caract { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px 14px; }
.vd-caract span { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--vt-text-2); }
.vd-caract svg { color: var(--vc); }
.vt-prod .loja .ln { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.vt-prod .loja em { flex-shrink: 0; }
.vd-secoes { margin-right: 46px; }
.vd-prato .lado.sem-foto { align-self: end; }
.vd-produto .vd-prod-foto.vazia { aspect-ratio: auto; height: 150px; }

/* ---------- Avaliações (estrelas) nos cartões ---------- */
.vd-nota-cab { margin-top: 6px; display: flex; align-items: center; gap: 8px; min-height: 18px; }
.vt-bolha-loja .hf-estrelas { font-size: 11px; justify-content: center; }
.vt-prod .hf-estrelas { font-size: 12px; }
.vt-linha-loja .hf-estrelas, .vt-destaque .hf-estrelas { font-size: 12.5px; }

/* =====================================================
   Freelances: destaques de cada categoria + grade compacta
   ===================================================== */
.vt-car-sub { margin: -6px 0 12px; color: var(--vt-muted); font-size: 13px; }
.vt-carrossel.top-cat .vt-trilho { gap: 14px; }
.vt-slot { flex: 0 0 auto; scroll-snap-align: start; display: grid; }
.vt-slot.sai > * { animation: vt-sai .42s ease forwards; }
.vt-slot.entra > * { animation: vt-entra .6s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes vt-sai { to { opacity: 0; transform: translateY(10px) scale(.95); filter: blur(3px); } }
@keyframes vt-entra { 0% { opacity: 0; transform: translateY(-12px) scale(.95); filter: blur(3px); } 60% { opacity: 1; filter: none; } 100% { opacity: 1; transform: none; } }

/* lista de todos */
.vt-lista-topo { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 4px 0 4px; }
.vt-titulo-lista .vt-conta { margin-left: 8px; padding: 2px 9px; border-radius: 999px; font-size: 12.5px; font-weight: 800; vertical-align: 2px; color: var(--vc); background: color-mix(in srgb, var(--vc) 14%, transparent); }
.vt-ordem { display: inline-flex; padding: 3px; border-radius: 999px; background: var(--vt-card-2); border: 1px solid var(--vt-line); }
.vt-ordem button { border: 0; background: transparent; color: var(--vt-muted); font: inherit; font-size: 12.5px; font-weight: 700; padding: 6px 11px; border-radius: 999px; cursor: pointer; transition: background .2s, color .2s; }
.vt-ordem button[aria-pressed="true"] { background: var(--vc); color: #fff; }
@keyframes vt-pro-entra { from { opacity: 0; transform: translateY(8px); } }
@media (prefers-reduced-motion: reduce) { .vt-slot > * { animation: none !important; } }

/* =====================================================
   Imóveis: grade compacta (3 por fileira no celular, 5 no computador)
   ===================================================== */
.vt-imo {
  min-width: 0; display: flex; flex-direction: column; overflow: hidden; border-radius: 16px; cursor: pointer; background: var(--vt-card);
  border: 1px solid var(--vt-line); transition: transform .2s, border-color .2s, box-shadow .2s; animation: vt-pro-entra .45s ease both;
}
.vt-imo:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--vc) 60%, var(--vt-line)); box-shadow: 0 12px 28px color-mix(in srgb, var(--vc) 18%, transparent); }
.vt-imo:focus-visible { outline: 3px solid var(--vc); outline-offset: 2px; }
.vt-imo .ft { position: relative; aspect-ratio: 1 / 1; background: #07170f center / cover no-repeat; }
.vt-imo .ft::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .25) 0%, transparent 30%, transparent 50%, rgba(0, 0, 0, .78) 100%); }
.vt-imo .tag { position: absolute; top: 6px; left: 6px; z-index: 1; padding: 3px 7px; border-radius: 999px; font-size: 10.5px; font-weight: 800; color: var(--vc-ink); background: var(--vc); }
.vt-imo .nf { position: absolute; top: 6px; right: 6px; z-index: 1; display: inline-flex; align-items: center; gap: 3px; padding: 3px 6px; border-radius: 999px; font-size: 10.5px; font-weight: 700; color: #fff; background: rgba(0, 0, 0, .55); }
.vt-imo .nf svg { width: 11px; height: 11px; }
.vt-imo .pr { position: absolute; left: 8px; right: 6px; bottom: 6px; z-index: 1; color: #fff; font-size: 14px; font-weight: 900; letter-spacing: -.2px; text-shadow: 0 2px 8px rgba(0, 0, 0, .6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-imo .pr small { font-size: 10.5px; font-weight: 700; opacity: .9; }
.vt-imo .tx { padding: 8px 8px 10px; display: grid; gap: 3px; }
.vt-imo .nm { font-size: 12.5px; font-weight: 800; line-height: 1.25; min-height: 2.5em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vt-imo .loc { display: flex; align-items: center; gap: 3px; min-width: 0; font-size: 11px; color: var(--vt-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-imo .loc svg, .vt-imo .sp svg { width: 12px; height: 12px; flex-shrink: 0; }
.vt-imo .sp { display: flex; flex-wrap: wrap; gap: 4px 8px; font-size: 11px; font-weight: 700; color: var(--vt-text-2); }
.vt-imo .sp span { display: inline-flex; align-items: center; gap: 3px; }
@media (min-width: 700px) {
  .vt-imo .ft { aspect-ratio: 4 / 3; }
  .vt-imo .pr { font-size: 17px; }
  .vt-imo .nm { font-size: 14px; }
  .vt-imo .tx { padding: 10px 12px 12px; }
}
@media (prefers-reduced-motion: reduce) { .vt-imo { animation: none !important; } }

/* =====================================================
   Modos de exibição (Por categoria, 1, 2 ou 3 por linha) — as 4 páginas
   ===================================================== */
.vt-ferramentas { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; }
.vt-lista-topo { row-gap: 10px; }
.vt-modos-ver { display: inline-flex; flex-shrink: 0; padding: 3px; border-radius: 12px; background: var(--vt-card-2); border: 1px solid var(--vt-line); }
.vt-modos-ver button { width: 34px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 9px; background: transparent; color: var(--vt-muted); cursor: pointer; transition: background .2s, color .2s; }
.vt-modos-ver button svg { width: 18px; height: 18px; }
.vt-modos-ver button[aria-pressed="true"] { background: var(--vc); color: #fff; }
.vt-modos-ver button:focus-visible, .vt-ordem button:focus-visible { outline: 2px solid var(--vc); outline-offset: 1px; }

/* grade: o número de colunas escolhido vale no celular; em telas maiores cabe mais */
.vitrine .vt-grade.vt-cols { display: grid; gap: 10px; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); }
.vitrine .vt-grade.vt-cols.c1 { --cols: 1; gap: 8px; }
.vitrine .vt-grade.vt-cols.c2 { --cols: 2; }
.vitrine .vt-grade.vt-cols.c3 { --cols: 3; }
@media (min-width: 700px) {
  .vitrine .vt-grade.vt-cols { gap: 12px; }
  .vitrine .vt-grade.vt-cols.c1 { --cols: 2; }
  .vitrine .vt-grade.vt-cols.c2 { --cols: 3; }
  .vitrine .vt-grade.vt-cols.c3 { --cols: 4; }
}
@media (min-width: 1000px) {
  .vitrine .vt-grade.vt-cols.c2 { --cols: 4; }
  .vitrine .vt-grade.vt-cols.c3 { --cols: 5; }
}
/* 2 por linha: cartões um pouco maiores */
.vt-cols.c2 .vt-imo .ft { aspect-ratio: 4 / 3; }
.vt-cols.c2 .vt-imo .pr { font-size: 16px; }
.vt-cols.c2 .vt-imo .nm { font-size: 13.5px; }

/* por categoria: uma fileira por categoria, rolando para o lado */
.vitrine .vt-grade.vt-linhas { display: block; }

.vt-linhas .vt-car-topo { gap: 10px; }
.vt-linhas .vt-car-topo h3 { flex: 1; min-width: 0; }
.vt-linhas .vt-trilho { gap: 10px; }
.vt-linhas .vt-trilho > * { flex: 0 0 var(--w, min(44vw, 200px)); scroll-snap-align: start; } /* mesma largura nas 4 páginas */
@media (min-width: 700px) { .vt-linhas .vt-trilho > * { --w: 180px !important; } }
.vt-ver-todos { flex-shrink: 0; border: 0; background: none; color: var(--vc); font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; padding: 4px 2px; }
.vt-car-topo .vt-conta { margin-left: 8px; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 800; vertical-align: 2px; color: var(--vc); background: color-mix(in srgb, var(--vc) 14%, transparent); }

/* destaques de imóveis: cartão um pouco maior */
.vt-carrossel.top-imo .vt-slot { width: 46vw; max-width: 220px; }
.vt-carrossel.top-imo .vt-imo { height: 100%; }
.vt-carrossel.top-imo .vt-imo .ft { aspect-ratio: 4 / 3; }

/* 1 por linha: linha compacta (foto à esquerda, dados no meio, preço à direita) */
.vt-row {
  display: flex; align-items: center; gap: 12px; min-width: 0; padding: 10px 12px; border-radius: 16px; cursor: pointer;
  background: var(--vt-card); border: 1px solid var(--vt-line); transition: border-color .2s, transform .2s; animation: vt-pro-entra .45s ease both;
}
.vt-row:hover { border-color: color-mix(in srgb, var(--vc) 55%, var(--vt-line)); transform: translateY(-1px); }
.vt-row:focus-visible { outline: 3px solid var(--vc); outline-offset: 2px; }
.vt-row .vt-avatar { width: 52px; height: 52px; font-size: 16px; box-shadow: 0 0 0 2px var(--vt-card), 0 0 0 4px var(--vc); }
.vt-row .th { position: relative; flex-shrink: 0; width: 76px; height: 76px; border-radius: 12px; background: var(--vt-card-2) center / cover no-repeat; display: grid; place-items: center; color: var(--vt-muted); overflow: hidden; }
.vt-row .th .tag { position: absolute; left: 4px; bottom: 4px; padding: 2px 6px; border-radius: 999px; font-size: 10px; font-weight: 800; color: var(--vc-ink); background: var(--vc); }
.vt-row .tx { flex: 1; min-width: 0; display: grid; gap: 2px; }
.vt-row .nm { font-size: 14.5px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-row small { color: var(--vt-muted); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-row .hf-estrelas { font-size: 12px; }
.vt-row .pr, .vt-row .vt-preco { flex-shrink: 0; text-align: right; font-size: 13.5px; font-weight: 900; color: var(--vc); }
.vt-row .pr small { display: block; color: var(--vt-muted); font-size: 10.5px; }
.vt-row.esgotado { opacity: .55; }
.vt-cols.c1 .vt-linha-loja { margin: 0; }

/* delivery compacto (2 ou 3 por linha e por categoria) */
.vt-del { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border-radius: 16px; cursor: pointer; background: var(--vt-card); border: 1px solid var(--vt-line); transition: transform .2s, border-color .2s; animation: vt-pro-entra .45s ease both; }
.vt-del:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--vc) 60%, var(--vt-line)); }
.vt-del:focus-visible { outline: 3px solid var(--vc); outline-offset: 2px; }
.vt-del.fechado { opacity: .7; }
.vt-del .ft { position: relative; aspect-ratio: 4 / 3; background: #1a0f06 center / cover no-repeat; }
.vt-del .ft::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(0, 0, 0, .55)); }
.vt-del .st { position: absolute; top: 6px; right: 6px; z-index: 1; padding: 2px 7px; border-radius: 999px; font-size: 10px; font-weight: 800; color: #fff; background: rgba(0, 0, 0, .6); }
.vt-del .st.on { background: #16a34a; }
.vt-del .ft .vt-avatar.logo { position: absolute; left: 8px; bottom: -16px; z-index: 2; width: 38px; height: 38px; font-size: 12px; border-radius: 12px; border: 2px solid var(--vt-card); }
.vt-del .tx { padding: 20px 8px 10px; display: grid; gap: 2px; }
.vt-del .nm { font-size: 13px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-del small { font-size: 11px; color: var(--vt-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-del .hf-estrelas { font-size: 11.5px; }
.vt-del .tx-taxa { font-size: 11px; font-weight: 700; color: var(--vt-text-2); }
.vt-del .tx-taxa.gratis { color: var(--vt-ok); }
@media (prefers-reduced-motion: reduce) { .vt-row, .vt-del { animation: none !important; } }
/* barra da lista: no celular a ordenação pode rolar para o lado e os modos descem se não couber */
.vt-ferramentas { flex-wrap: wrap; }
.vt-ferramentas .vt-ordem { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.vt-ferramentas .vt-ordem::-webkit-scrollbar { display: none; }
.vt-ordem button { white-space: nowrap; flex-shrink: 0; }
.vt-ferramentas .vt-modos-ver { margin-left: auto; }
.vt-car-topo .vt-ver-todos { color: var(--vc); }

/* Freelances no mesmo cartão das páginas irmãs (foto em cima, avatar, nome, nota, categoria e preço) */
.vt-free .ft .vt-avatar.logo { border-radius: 50%; }
.vt-del .tag-dest {
  position: absolute; top: 6px; left: 6px; z-index: 1; display: inline-flex; align-items: center; gap: 4px; max-width: calc(100% - 12px);
  padding: 3px 7px 3px 5px; border-radius: 999px; font-size: 10.5px; font-weight: 800; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  background: rgba(4, 14, 24, .62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.vt-del .tag-dest svg { width: 12px; height: 12px; color: #f5c542; flex-shrink: 0; }
.vt-del .st.urg { background: #ef4444; }
.vt-free .tx-taxa { color: var(--vc); font-weight: 800; }
/* destaques dos Freelances: mesmo tamanho dos destaques de Imóveis */
.vt-carrossel.top-cat .vt-slot { width: 46vw; max-width: 220px; }
.vt-carrossel.top-cat .vt-del, .vt-carrossel.top-cat .vt-cv { height: 100%; }
/* com a etiqueta de destaque no alto, "Urgência" desce para o canto de baixo da foto */
.vt-del .tag-dest ~ .st.urg { top: auto; bottom: 6px; }

/* Avaliar e Reclamar no perfil do negócio */
.vd-confianca { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.vd-confianca .vt-btn { justify-content: center; }
.vd-confianca .vt-btn.reclamar { color: #ff8a8e; border-color: rgba(239, 68, 68, .45); }
.vd-confianca small { grid-column: 1 / -1; text-align: center; color: var(--vt-muted); font-size: 12px; }

.vd-confianca .vd-denunciar { grid-column: 1 / -1; justify-self: center; border: 0; background: none; padding: 2px 0; color: var(--muted, #8fa0ab); font: inherit; font-size: 12.5px; font-weight: 700; text-decoration: underline; cursor: pointer; }
.vd-confianca .vd-denunciar:hover { color: #ef4444; }

/* ---------- filtro de local da busca (Estado → Cidade → Bairro) ---------- */
.filtros:has(.vt-local-btn) { display: flex; gap: 8px; align-items: center; }
.filtros:has(.vt-local-btn) .filter-chips { flex: 1; min-width: 0; }
.vt-local-btn { flex: none; display: inline-flex; align-items: center; gap: 6px; max-width: 46vw; height: 38px; padding: 0 10px 0 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel); color: var(--text); font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.vt-local-btn span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-local-btn svg { width: 16px; height: 16px; flex: none; color: var(--classe, var(--accent)); }
.vt-local-btn svg:last-child { width: 13px; height: 13px; transform: rotate(90deg); color: var(--muted); }
.vt-local-btn.on { border-color: var(--classe, var(--accent)); background: color-mix(in srgb, var(--classe, var(--accent)) 12%, var(--panel)); }
.vt-local-btn:focus-visible { outline: 2px solid var(--classe, var(--accent)); outline-offset: 2px; }
.vt-local-fundo { position: fixed; inset: 0; z-index: 1500; display: grid; place-items: center; padding: 16px; background: rgba(2, 6, 9, .6); animation: vtLocalFundo .18s ease-out; }
.vt-local-pop { width: min(440px, 100%); background: var(--panel); color: var(--text); border: 1px solid var(--line); border-radius: 20px; padding: 18px; box-shadow: 0 24px 70px rgba(0,0,0,.4); display: grid; gap: 14px; animation: vtLocalCaixa .2s cubic-bezier(.2, .8, .2, 1); }
.vt-local-topo { display: flex; align-items: center; justify-content: space-between; }
.vt-local-topo strong { font-size: 17px; }
.vt-local-x { width: 36px; height: 36px; border-radius: 50%; border: 0; background: transparent; color: var(--muted); font-size: 24px; line-height: 1; cursor: pointer; }
.vt-local-x:hover { background: var(--hover); color: var(--text); }
.vt-local-campos .campo { display: grid; gap: 6px; }
.vt-local-campos label { font-size: 13px; font-weight: 700; }
.vt-local-campos input, .vt-local-campos select { height: 44px; border-radius: 12px; border: 1px solid var(--line); background: var(--input, var(--panel)); color: var(--text); padding: 0 12px; font: inherit; font-size: 15px; }
.vt-local-campos input:focus, .vt-local-campos select:focus { outline: 0; border-color: var(--classe, var(--accent)); }
.vt-local-campos .ajuda { font-size: 12px; color: var(--muted); }
.vt-local-dica { color: var(--muted); font-size: 12.5px; margin-top: -4px; }
.vt-local-acoes { display: grid; grid-template-columns: 1fr 1.3fr; gap: 10px; }
.vt-local-acoes button { min-height: 44px; border-radius: 12px; font: inherit; font-weight: 800; cursor: pointer; }
.vt-local-limpar { border: 1px solid var(--line); background: transparent; color: var(--text); }
.vt-local-aplicar { border: 0; background: var(--classe, var(--accent)); color: #fff; }
@keyframes vtLocalFundo { from { opacity: 0; } }
@keyframes vtLocalCaixa { from { opacity: 0; transform: translateY(12px); } }
@media (max-width: 600px) { .vt-local-fundo { place-items: end center; padding: 0; } .vt-local-pop { border-radius: 20px 20px 0 0; padding-bottom: calc(18px + env(safe-area-inset-bottom)); } }
@media (prefers-reduced-motion: reduce) { .vt-local-fundo, .vt-local-pop { animation: none; } }

/* ---------- perfil do negócio: selos, promoção, atalhos e horário por dia ---------- */
.vd-selos { display: flex; flex-wrap: wrap; gap: 6px; }
.vd-selo-ok, .vd-selo-cnpj, .vd-selo-pro { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px 4px 7px; border-radius: 999px; font-size: 12px; font-weight: 750; }
.vd-selo-ok { background: color-mix(in srgb, #1d9bf0 14%, transparent); color: #1d9bf0; }
.vd-selo-ok svg { fill: #1d9bf0; stroke: #fff; }
.vd-selo-cnpj { background: var(--vt-card-2); color: var(--vt-text-2); border: 1px solid var(--vt-line); }
.vd-promo { position: relative; display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 18px; overflow: hidden;
  background: linear-gradient(120deg, color-mix(in srgb, var(--vc) 22%, transparent), color-mix(in srgb, var(--vc) 6%, transparent));
  border: 1px dashed color-mix(in srgb, var(--vc) 60%, transparent); }
.vd-promo .ic { flex: none; width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: var(--vc); box-shadow: 0 8px 20px -8px var(--vc); }
.vd-promo .tx { flex: 1; min-width: 0; display: grid; gap: 2px; }
.vd-promo .tx small { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--vc); }
.vd-promo .tx strong { font-size: 15.5px; line-height: 1.3; }
.vd-promo .tx p { margin: 0; font-size: 13px; color: var(--vt-text-2); line-height: 1.4; }
.vd-promo .ate { font-size: 12px; color: var(--vt-muted); }
.vd-cupom { flex: none; display: grid; justify-items: center; gap: 1px; padding: 8px 12px; border-radius: 12px; border: 1.5px dashed var(--vc); background: var(--vt-card); cursor: pointer; }
.vd-cupom span { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 14px; font-weight: 800; letter-spacing: .06em; color: var(--vc); }
.vd-cupom small { display: none; }
.vd-cupom svg { width: 14px; height: 14px; color: var(--vt-muted); }
.vd-links { display: flex; flex-wrap: wrap; gap: 8px; }
.vd-link { flex: none; display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border-radius: 999px; border: 1px solid var(--vt-line); background: var(--vt-card-2);
  color: var(--vt-text); font-size: 13px; font-weight: 700; text-decoration: none; cursor: pointer; }
.vd-link:hover { border-color: var(--vc); color: var(--vc); }
.vd-link svg { color: var(--vc); }
.vd-horario { display: grid; gap: 0; border: 1px solid var(--vt-line); border-radius: 16px; overflow: hidden; }
.vd-horario-agora { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 11px 14px; background: var(--vt-card-2); font-size: 13.5px; }
.vd-horario-agora i { width: 8px; height: 8px; border-radius: 50%; background: var(--vt-ok); box-shadow: 0 0 0 4px color-mix(in srgb, var(--vt-ok) 25%, transparent); }
.vd-horario-agora.off i { background: var(--vt-bad); box-shadow: 0 0 0 4px color-mix(in srgb, var(--vt-bad) 22%, transparent); }
.vd-horario-agora.ok strong { color: var(--vt-ok); }
.vd-horario-agora.off strong { color: var(--vt-bad); }
.vd-horario-agora span { color: var(--vt-muted); }
.vd-horario-dia { display: flex; justify-content: space-between; gap: 10px; padding: 9px 14px; border-top: 1px solid var(--vt-line); font-size: 13.5px; }
.vd-horario-dia span { color: var(--vt-text-2); }
.vd-horario-dia strong { font-weight: 700; font-variant-numeric: tabular-nums; }
.vd-horario-dia strong.fechado { color: var(--vt-muted); font-weight: 600; }
.vd-horario-dia.hoje { background: color-mix(in srgb, var(--vc) 8%, transparent); }
.vd-horario-dia.hoje span, .vd-horario-dia.hoje strong { color: var(--vc); font-weight: 800; }

/* ---------- promoção / cupom: selo nos cartões e bloco no pedido ---------- */
.vt-promo-tag { position: absolute; right: 6px; bottom: 6px; z-index: 1; display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px 3px 6px; border-radius: 999px;
  font-size: 10.5px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #f43f5e, #f97316); box-shadow: 0 4px 12px -4px rgba(244, 63, 94, .7); }
.vt-promo-tag svg { width: 12px; height: 12px; }
.vt-del .tag-dest ~ .st.urg ~ .vt-promo-tag { bottom: 30px; }
.vt-bolha-loja { position: relative; }
.vt-bolha-promo { position: absolute; top: 48px; left: 50%; transform: translateX(-50%); padding: 1px 7px; border-radius: 999px; font-size: 9.5px; font-style: normal; font-weight: 800; color: #fff;
  background: linear-gradient(135deg, #f43f5e, #f97316); box-shadow: 0 0 0 2px var(--vt-bg); white-space: nowrap; }
.vd-cupom-ped { display: flex; align-items: flex-start; gap: 12px; margin: 12px 0 2px; padding: 12px 14px; border-radius: 16px; border: 1.5px dashed color-mix(in srgb, var(--vc) 55%, transparent);
  background: color-mix(in srgb, var(--vc) 7%, transparent); }
.vd-cupom-ped .ic { flex: none; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; color: #fff; background: var(--vc); }
.vd-cupom-ped .tx { flex: 1; min-width: 0; display: grid; gap: 3px; }
.vd-cupom-ped .tx small { font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--vc); }
.vd-cupom-ped .tx strong { font-size: 14.5px; line-height: 1.3; color: var(--vt-text); }
.vd-cupom-ped .nota { font-size: 12.5px; color: var(--vt-muted); line-height: 1.35; }
.vd-cupom-ped.ok { border-style: solid; border-color: #16a34a; background: color-mix(in srgb, #16a34a 9%, transparent); }
.vd-cupom-ped.ok .ic { background: #16a34a; }
.vd-cupom-ped.ok .tx small { color: #16a34a; }
.vd-cupom-ped > .vd-link { align-self: center; padding: 7px 12px; }
.vd-cupom-linha { display: flex; gap: 8px; margin-top: 6px; }
.vd-cupom-linha .vd-input { flex: 1; min-width: 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .06em; text-transform: uppercase; }
.vd-cupom-linha .vt-btn { flex: none; width: auto; padding: 0 16px; }

/* ---------- barra de filtros: Local + Filtros em cima, categorias embaixo; etiquetas dos filtros ligados ---------- */
.filtros:has(.vt-local-btn) { flex-wrap: wrap; row-gap: 10px; }
.filtros:has(.vt-local-btn) .filter-chips { flex: 1 1 100%; }
.filtros:has(.vt-filtros-btn) .vt-local-btn { flex: 1 1 auto; max-width: none; justify-content: flex-start; }
.filtros:has(.vt-filtros-btn) .vt-local-btn svg:last-child { margin-left: auto; }
.vt-filtros-btn { flex: none; position: relative; display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px 0 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel); color: var(--text); font: inherit; font-size: 13.5px; font-weight: 750; cursor: pointer; }
.vt-filtros-btn svg { width: 17px; height: 17px; color: var(--classe, var(--accent)); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.vt-filtros-btn b { display: none; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 99px; background: var(--classe, var(--accent)); color: #fff; font-size: 11.5px; line-height: 19px; text-align: center; }
.vt-filtros-btn.on { border-color: var(--classe, var(--accent)); background: color-mix(in srgb, var(--classe, var(--accent)) 12%, var(--panel)); }
.vt-filtros-btn.on b { display: inline-block; }
.vt-filtros-btn:focus-visible { outline: 2px solid var(--classe, var(--accent)); outline-offset: 2px; }
.vt-ativos { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: 10px 0 0; }
.vt-ativos::-webkit-scrollbar { display: none; }
.vt-ativos[hidden] { display: none; }
.vt-ativo { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 10px 0 12px; border-radius: 999px; border: 0; background: color-mix(in srgb, var(--classe, var(--accent)) 16%, transparent); color: var(--classe, var(--accent)); font: inherit; font-size: 12.5px; font-weight: 800; cursor: pointer; }
.vt-ativo svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.4; }
.vt-ativo.limpar { background: none; color: var(--muted); text-decoration: underline; }
.vt-filtros-pop { max-height: min(86vh, 680px); grid-template-rows: auto minmax(0, 1fr) auto; }
.vt-filtros-corpo { overflow-y: auto; overscroll-behavior: contain; display: grid; gap: 16px; align-content: start; padding: 2px; }
.vt-f-sec h4 { margin: 0 0 9px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.vt-f-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.vt-f-seg { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.vt-f-chip { min-height: 40px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel-2, var(--panel)); color: var(--text); font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.vt-f-seg .vt-f-chip { padding: 0 4px; border-radius: 12px; }
.vt-f-chip.on { border-color: var(--classe, var(--accent)); background: color-mix(in srgb, var(--classe, var(--accent)) 16%, transparent); color: var(--classe, var(--accent)); }
.vt-local-aplicar:disabled { opacity: .5; cursor: default; }

/* distância (Perto de você) */
.vt-dist { position: absolute; left: 6px; top: 6px; z-index: 1; display: inline-flex; align-items: center; gap: 3px; padding: 2px 7px 2px 5px; border-radius: 999px; font-size: 10.5px; font-weight: 800; color: #fff; background: rgba(4, 14, 24, .62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vt-dist svg { width: 11px; height: 11px; }
.vt-del .tag-dest ~ .vt-dist, .vt-imo .tag ~ .vt-dist { top: auto; bottom: 6px; left: auto; right: 6px; }
.vt-f-onde { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; font-size: 13px; color: var(--muted); }
.vt-f-loc { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--classe, var(--accent)); background: none; color: var(--classe, var(--accent)); font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }
.vt-f-loc svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }
.vt-f-seg.seis { grid-template-columns: repeat(3, 1fr); }

/* Plano Pro: selo no nome do cartão e no perfil do negócio */
.nm.com-pro { display: flex; align-items: center; gap: 5px; min-width: 0; }
.nm.com-pro .selo-pro { flex: none; height: 16px; font-size: 9px; padding: 0 5px; }
.vd-selo-pro { background: color-mix(in srgb, #7c3aed 14%, transparent); color: #8b5cf6; }
.vd-selo-pro .selo-pro { height: 16px; font-size: 9px; padding: 0 5px; }

/* ---------- Saúde: registro do conselho, como atende e avisos ---------- */
.vd-saude { display: grid; gap: 10px; margin: 4px 0 14px; padding: 14px; border-radius: 18px; border: 1px solid color-mix(in srgb, var(--vc) 40%, var(--line)); background: color-mix(in srgb, var(--vc) 7%, var(--panel)); }
.vd-saude-reg { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.vd-saude-reg .ic { flex: none; width: 42px; height: 42px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: var(--vc); box-shadow: 0 8px 20px -10px var(--vc); }
.vd-saude-reg .tx { flex: 1; min-width: 180px; display: grid; gap: 1px; }
.vd-saude-reg .tx small { font-size: 11.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.vd-saude-reg .tx strong { font-size: 16px; }
.vd-saude-reg .tx span { font-size: 12.5px; color: var(--muted); line-height: 1.4; }
.vd-saude-conf { display: inline-flex; align-items: center; gap: 4px; padding: 8px 12px; border-radius: 999px; border: 1px solid var(--vc); color: var(--vc); font-size: 13px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.vd-saude-conf .vi { width: 14px; height: 14px; }
.vd-saude-mod { display: flex; flex-wrap: wrap; gap: 6px; }
.vd-saude-mod .vt-tag { display: inline-flex; align-items: center; gap: 5px; }
.vd-saude-mod .vt-tag .vi { width: 14px; height: 14px; }
.vd-saude-urg { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 10px 12px; border-radius: 12px; font-size: 12.5px; line-height: 1.45; color: var(--text);
  background: color-mix(in srgb, #ef4444 9%, transparent); border: 1px solid color-mix(in srgb, #ef4444 30%, transparent); }
.vd-saude-urg .vi { flex: none; width: 16px; height: 16px; color: #ef4444; margin-top: 1px; }
.vt-saude .tx small.reg { display: inline-flex; align-items: center; gap: 4px; color: var(--vc); font-weight: 700; }
.vt-saude .tx small.reg .vi { width: 13px; height: 13px; }
.vt-saude .ft .st.saude-mod { background: var(--vc); color: #fff; }

/* Tempo de resposta do negócio (média das conversas): selo nos cartões e no perfil */
.vt-rapido { display: inline-flex; align-items: center; gap: 4px; margin-top: 2px; padding: 2px 8px 2px 6px; border-radius: 999px; font-size: 11px; font-weight: 750; color: #16a34a; background: color-mix(in srgb, #16a34a 12%, transparent); width: fit-content; }
.vt-rapido svg { width: 13px; height: 13px; }
.vd-selo-resp { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px 4px 7px; border-radius: 999px; font-size: 12px; font-weight: 750; color: var(--muted, #8c9ca7); background: color-mix(in srgb, var(--muted, #8c9ca7) 14%, transparent); }
.vd-selo-resp.rapido { color: #16a34a; background: color-mix(in srgb, #16a34a 13%, transparent); }
.vd-selo-resp svg { width: 15px; height: 15px; }

/* ---------- Freelances (azul da Help Floripa) ---------- */
/* ---------- Cartão de visita dos Freelances (.vt-cv): capa curta, foto no centro, nome, área, nota, onde e preço ---------- */
.vt-cv { --pl: var(--vc); --pl-cta: var(--vc); --pl-cta-ink: var(--vc-ink); position: relative; min-width: 0; display: flex; flex-direction: column;
  border-radius: 18px; overflow: hidden; cursor: pointer; background: var(--vt-card); border: 1px solid var(--vt-line);
  transition: transform .2s, box-shadow .2s; animation: vt-pro-entra .45s ease both; container-type: inline-size; }
.vt-cv:hover { transform: translateY(-3px); }
.vt-cv:focus-visible { outline: 3px solid var(--vc); outline-offset: 2px; }
.vt-cv .cv-capa { position: relative; aspect-ratio: 16 / 7; background: #0b1a3a center / cover no-repeat; }
.vt-cv .cv-capa::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .28), transparent 40%, color-mix(in srgb, var(--vt-card) 75%, transparent)); }
.vt-cv .cv-capa.sem-capa { background-image: radial-gradient(120% 140% at 85% 0%, color-mix(in srgb, var(--pl) 70%, transparent), transparent 60%), linear-gradient(135deg, #061235, #0b2a80); }
.vt-cv .cv-tag, .vt-cv .cv-plano { position: absolute; top: 7px; z-index: 2; display: inline-flex; align-items: center; gap: 4px; max-width: calc(62% - 8px);
  padding: 3px 8px 3px 6px; border-radius: 999px; font-size: 10.5px; font-weight: 800; color: #fff; white-space: nowrap;
  background: rgba(4, 12, 28, .66); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vt-cv .cv-tag { left: 7px; }
.vt-cv .cv-tag span { overflow: hidden; text-overflow: ellipsis; }
.vt-cv .cv-tag svg { width: 12px; height: 12px; flex: none; }
.vt-cv .cv-tag.dest svg { color: #f5c542; }
.vt-cv .cv-tag.urg { background: #ef4444; }
.vt-cv .cv-tag.promo { background: #16a34a; }
.vt-cv .cv-plano { right: 7px; left: auto; max-width: none; padding: 3px 8px; font-size: 9.5px; letter-spacing: .6px; background: var(--pl-selo, var(--pl)); }
.vt-cv .cv-corpo { position: relative; z-index: 3; display: grid; justify-items: center; text-align: center; gap: 3px; padding: 0 10px 10px; margin-top: -32px; min-width: 0; }
.vt-cv .cv-corpo > * { min-width: 0; max-width: 100%; }
.vt-cv .cv-foto { position: relative; margin-bottom: 4px; }
.vt-cv .cv-foto .vt-avatar { width: 62px; height: 62px; font-size: 18px; box-shadow: 0 0 0 3px var(--vt-card), 0 0 0 5.5px var(--pl), 0 8px 20px -6px rgba(0, 0, 0, .6); }
.vt-cv .fl-online { position: absolute; right: 1px; bottom: 2px; width: 15px; height: 15px; border-radius: 50%; background: #22c55e; border: 2.5px solid var(--vt-card); animation: fl-pulso 2.2s ease-out infinite; }
@keyframes fl-pulso { 0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); } 70%, 100% { box-shadow: 0 0 0 7px rgba(34, 197, 94, 0); } }
.vt-cv .nm { font-size: 14.5px; font-weight: 850; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.vt-cv .cv-area { font-size: 12px; font-weight: 700; color: var(--vc); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-cv .hf-estrelas { font-size: 11.5px; justify-content: center; }
.vt-cv .cv-onde { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; color: var(--vt-muted); }
.vt-cv .cv-onde svg { width: 12px; height: 12px; flex: none; }
.vt-cv .cv-onde span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-cv .cv-extras { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; margin-top: 3px; }
.vt-cv .cv-extras .vt-rapido { margin: 0; font-size: 10.5px; }
.vt-cv .cv-modo { padding: 2px 7px; border-radius: 999px; font-size: 10.5px; font-weight: 700; color: var(--vt-text-2); background: var(--vt-card-2); border: 1px solid var(--vt-line); white-space: nowrap; }
.vt-cv .cv-rodape { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px 10px 12px; border-top: 1px solid var(--vt-line);
  background: color-mix(in srgb, var(--pl) 7%, transparent); }
.vt-cv .cv-preco { display: grid; min-width: 0; line-height: 1.15; text-align: left; }
.vt-cv .cv-preco small { font-size: 10px; font-weight: 700; color: var(--vt-muted); }
.vt-cv .cv-preco b { font-size: 14px; font-weight: 850; color: var(--vt-text, inherit); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-cv .fl-cta { flex: none; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--pl-cta); color: var(--pl-cta-ink); }
.vt-cv .fl-cta svg { width: 15px; height: 15px; }
/* Cor do plano: borda em degradê, anel da foto, selo e seta. Grátis = azul claro do site. */
@keyframes fl-brilho { 0%, 30% { background-position: 120% 0; } 70%, 100% { background-position: -20% 0; } }
/* Cor do plano de quem anuncia: borda em degradê, anel da foto e seta (grátis fica na cor da página) */
.vt-cv.pl-plus { --pl: #2563ff; --pl-cta: linear-gradient(135deg, #3b82f6, #1d4ed8); --pl-cta-ink: #fff; --pl-selo: linear-gradient(135deg, #3b82f6, #1d4ed8);
  --pl-borda: linear-gradient(135deg, #7cb4ff, #2563ff 45%, #1e3a8a); box-shadow: 0 12px 30px -16px #2563ff; }
.vt-cv.pl-pro { --pl: #7c3aed; --pl-cta: linear-gradient(135deg, #7c3aed, #2f6bff); --pl-cta-ink: #fff; --pl-selo: linear-gradient(135deg, #a855f7, #2f6bff);
  --pl-borda: linear-gradient(135deg, #a855f7, #7c3aed 45%, #2f6bff); box-shadow: 0 12px 30px -16px #7c3aed; }
.vt-cv.pl-premium { --pl: #f59e0b; --pl-cta: linear-gradient(135deg, #f59e0b, #fbbf24); --pl-cta-ink: #2a1600; --pl-selo: linear-gradient(135deg, #fbbf24, #b45309);
  --pl-borda: linear-gradient(135deg, #fde68a, #f59e0b 35%, #b45309 60%, #fcd34d); box-shadow: 0 14px 34px -14px rgba(245, 158, 11, .65); }
.vt-cv.pl-plus, .vt-cv.pl-pro, .vt-cv.pl-premium { border: 1.5px solid transparent; background: linear-gradient(var(--vt-card), var(--vt-card)) padding-box, var(--pl-borda) border-box; }
.vt-cv.pl-plus .cv-foto .vt-avatar, .vt-cv.pl-pro .cv-foto .vt-avatar { box-shadow: 0 0 0 3px var(--vt-card), 0 0 0 5.5px transparent, 0 8px 20px -6px rgba(0, 0, 0, .6); }
.vt-cv.pl-plus .cv-foto::before, .vt-cv.pl-pro .cv-foto::before, .vt-cv.pl-premium .cv-foto::before { content: ""; position: absolute; inset: -5.5px; border-radius: 50%; background: var(--pl-borda); z-index: -1; }
.vt-cv.pl-premium .cv-foto .vt-avatar { box-shadow: 0 0 0 3px var(--vt-card), 0 8px 20px -6px rgba(0, 0, 0, .6); }
.vt-cv .cv-foto { isolation: isolate; }
.vt-cv.pl-premium .cv-capa::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(115deg, transparent 35%, rgba(255, 236, 170, .25) 50%, transparent 65%); background-size: 250% 100%; animation: fl-brilho 4.5s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .vt-cv, .vt-cv .fl-online, .vt-cv.pl-premium .cv-capa::before { animation: none; } }
/* Variações do cartão base: Saúde (registro), Delivery (aberto/fechado, entrega grátis), itens (Imóveis, produtos) */
.vt-cv .cv-tag.aberto { background: #16a34a; }
.vt-cv .cv-tag.fechado { background: rgba(60, 66, 76, .85); }
.vt-cv .cv-tag.saude-mod { background: #0f9488; }
.vt-cv .cv-tag.fin { background: var(--vc); color: var(--vc-ink); }
.vt-cv .cv-tag.esgot { background: rgba(20, 20, 24, .85); }
.vt-cv .cv-tag.ultima { background: #ea580c; }
.vt-cv .cv-extras .cv-tag.mini { position: static; max-width: 100%; padding: 2px 7px 2px 5px; font-size: 10.5px; }
.vt-cv.fechado .cv-capa, .vt-cv.fechado .cv-foto { filter: grayscale(.6); opacity: .85; }
.vt-cv .cv-reg { display: inline-flex; align-items: center; gap: 3px; font-size: 10.5px; font-weight: 750; color: #0f9488; }
.vt-cv .cv-reg { color: color-mix(in srgb, #14d3c0 80%, var(--vt-text, #fff)); }
.vt-cv .cv-reg svg { width: 12px; height: 12px; flex: none; }
.vt-cv .cv-reg span, .vt-cv .cv-area { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-cv .cv-preco b.gratis { color: var(--vt-ok, #16a34a); }
.vt-cv .cv-preco-in { display: grid; min-width: 0; line-height: 1.15; }
.vt-cv .cv-preco-in small { font-size: 10px; font-weight: 700; color: var(--vt-muted); }
.vt-cv .cv-preco-in s { font-size: 10.5px; color: var(--vt-muted); }
.vt-cv .cv-preco-in b { font-size: 14px; font-weight: 850; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vt-cv .cv-preco-in b em { font-style: normal; font-size: 10.5px; font-weight: 700; color: var(--vt-muted); margin-left: 1px; }
/* Itens: a foto do item é a estrela do cartão, texto alinhado à esquerda */
.vt-cv.cv-item .cv-capa { aspect-ratio: 4 / 3; }
.vt-cv.cv-prod .cv-capa { aspect-ratio: 1; background-color: var(--vt-card-2); display: grid; place-items: center; }
.vt-cv.cv-item .cv-capa::after { background: linear-gradient(180deg, rgba(0, 0, 0, .25), transparent 35%); }
.vt-cv .cv-sem-foto { width: 34px; height: 34px; color: var(--vt-muted); }
.vt-cv.cv-item .cv-corpo { margin-top: 0; padding: 9px 11px 10px; justify-items: start; text-align: left; gap: 3px; }
.vt-cv.cv-item .nm { font-size: 13.5px; font-weight: 800; }
.vt-cv.cv-item .hf-estrelas { justify-content: flex-start; }
.vt-cv .cv-nf { position: absolute; right: 7px; bottom: 7px; z-index: 2; display: inline-flex; align-items: center; gap: 3px; padding: 3px 7px; border-radius: 999px; font-size: 10.5px; font-weight: 750; color: #fff; background: rgba(4, 12, 28, .66); }
.vt-cv .cv-nf svg { width: 11px; height: 11px; }
.vt-cv .cv-specs { display: flex; flex-wrap: wrap; gap: 4px 9px; font-size: 11px; font-weight: 750; color: var(--vt-text-2); }
.vt-cv .cv-specs span { display: inline-flex; align-items: center; gap: 3px; }
.vt-cv .cv-specs svg { width: 12px; height: 12px; }
.vt-cv .cv-loja { display: flex; align-items: center; gap: 4px; width: 100%; font-size: 11px; color: var(--vt-muted); }
.vt-cv .cv-loja svg { width: 12px; height: 12px; flex: none; }
.vt-cv .cv-loja .ln { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vt-cv .cv-loja em { flex: none; margin-left: auto; font-style: normal; font-weight: 750; color: var(--vt-ok, #16a34a); }
.vt-cv.esgotado { opacity: .6; }
.vt-cv .vd-vendi { margin: 0 10px 10px; }
/* Cartão médio (2 por linha no celular) */
@container (max-width: 210px) {
  .vt-cv .cv-corpo { padding: 0 8px 9px; margin-top: -28px; gap: 2px; }
  .vt-cv .cv-foto .vt-avatar { width: 54px; height: 54px; font-size: 16px; }
  .vt-cv .nm { font-size: 13.5px; }
  .vt-cv .cv-area { font-size: 11.5px; }
  .vt-cv .cv-tag svg + span { display: none; }
  .vt-cv .cv-tag:has(svg) { padding: 4px; }
  .vt-cv .cv-extras .cv-modo:nth-child(n+2) { display: none; }
}
/* Cartão estreito (3 por linha no celular): só o essencial, sem cortar nada */
@container (max-width: 140px) {
  .vt-cv .cv-capa { aspect-ratio: 16 / 9; }
  .vt-cv .cv-tag, .vt-cv .cv-plano { top: 5px; }
  .vt-cv .cv-tag { left: 5px; }
  .vt-cv .cv-plano { right: 5px; padding: 2px 5px; font-size: 8px; letter-spacing: .3px; }
  .vt-cv .cv-corpo { padding: 0 6px 8px; margin-top: -24px; }
  .vt-cv .cv-foto { margin-bottom: 2px; }
  .vt-cv .cv-foto .vt-avatar { width: 44px; height: 44px; font-size: 14px; }
  .vt-cv .fl-online { width: 12px; height: 12px; border-width: 2px; right: 0; bottom: 1px; }
  .vt-cv .nm { font-size: 12px; }
  .vt-cv .cv-area { font-size: 10.5px; }
  .vt-cv .hf-estrelas { font-size: 10.5px; }
  .vt-cv .cv-onde { font-size: 10px; }
  .vt-cv .cv-extras { display: none; }
  .vt-cv .cv-rodape { padding: 7px 6px 8px 8px; gap: 4px; }
  .vt-cv .cv-preco small { font-size: 9px; }
  .vt-cv .cv-preco b { font-size: 12px; }
  .vt-cv .fl-cta { width: 22px; height: 22px; }
  .vt-cv .fl-cta svg { width: 12px; height: 12px; }
  .vt-cv.cv-item .cv-corpo { padding: 7px 7px 8px; }
  .vt-cv.cv-item .nm { font-size: 12px; }
  .vt-cv .cv-specs { font-size: 10px; gap: 2px 6px; }
  .vt-cv .cv-loja em { display: none; }
  .vt-cv .cv-preco-in b { font-size: 12px; letter-spacing: -.2px; }
  .vt-cv.cv-item .fl-cta { display: none; }
  .vt-cv .cv-tag.fin { display: none; }
  .vt-cv.cv-item .cv-rodape { padding: 7px 8px 8px; }
  .vt-cv .cv-tag { max-width: calc(100% - 64px); }
  .vt-cv .cv-nf { right: 5px; bottom: 5px; padding: 2px 5px; font-size: 9.5px; }
  .vt-cv .cv-reg { font-size: 9.5px; }
}
/* Freelances: título da lista e "Criar meu perfil" mais compactos */
.vitrine[data-tipo="servicos"] .vt-cabeca { align-items: center; gap: 10px; margin-bottom: 12px; }
.vitrine[data-tipo="servicos"] .vt-cabeca h2 { font-size: 19px; }
.vitrine[data-tipo="servicos"] .vt-cabeca p { font-size: 13px; }
.vitrine[data-tipo="servicos"] .vt-cabeca .vt-criar { padding: 8px 14px; font-size: 13px; border-radius: 999px; }

/* ---------- Freelances: bolinhas dos profissionais em abas (Online agora · Destaques · Novos · Perto) ---------- */
.fl-bolhas { margin: 2px 0 22px; }
.fl-bolhas-abas { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-bottom: 12px; }
.fl-bolhas-abas::-webkit-scrollbar { display: none; }
.fl-aba { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 13px; border-radius: 999px; border: 1px solid var(--vt-line); background: var(--vt-card); color: var(--vt-text-2); font-size: 13px; font-weight: 750; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.fl-aba.on { background: var(--vc); border-color: var(--vc); color: var(--vc-ink); }
.fl-aba b { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; display: grid; place-items: center; font-size: 11px; background: color-mix(in srgb, #22c55e 18%, transparent); color: #16a34a; }
.fl-aba.on b { background: rgba(255, 255, 255, .22); color: inherit; }
.fl-aba-on { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px color-mix(in srgb, #22c55e 25%, transparent); }
.fl-bolhas-trilho { display: flex; gap: 14px; overflow-x: auto; scrollbar-width: none; padding: 6px 2px 4px; scroll-snap-type: x proximity; }
.fl-bolhas-trilho::-webkit-scrollbar { display: none; }
.fl-bolha { --anel: var(--vc); flex: none; width: 74px; display: grid; justify-items: center; gap: 4px; padding: 0; border: 0; background: none; cursor: pointer; scroll-snap-align: start; color: var(--vt-text); }
.fl-bolha.pl-plus { --anel: linear-gradient(135deg, #7cb4ff, #2563ff 50%, #1e3a8a); }
.fl-bolha.pl-pro { --anel: linear-gradient(135deg, #a855f7, #7c3aed 45%, #2f6bff); }
.fl-bolha.pl-premium { --anel: linear-gradient(135deg, #fde68a, #f59e0b 40%, #b45309 65%, #fcd34d); }
.fl-anel { position: relative; width: 66px; height: 66px; padding: 3px; border-radius: 50%; background: var(--anel); }
.fl-anel .vt-avatar { width: 100%; height: 100%; font-size: 18px; border: 2.5px solid var(--vt-bg); box-shadow: none; }
.fl-bolha-on { position: absolute; right: 1px; bottom: 3px; width: 15px; height: 15px; border-radius: 50%; background: #22c55e; border: 2.5px solid var(--vt-bg); animation: fl-pulso 2.2s ease-out infinite; }
.fl-bolha-nome { max-width: 74px; font-size: 12px; font-weight: 700; line-height: 1.2; text-align: center; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.fl-bolha small { font-size: 11px; font-weight: 700; color: var(--vt-muted); }
.fl-bolha:hover .fl-anel { transform: scale(1.04); }
.fl-anel { transition: transform .2s; }
.fl-bolha:focus-visible { outline: 2px solid var(--vc); outline-offset: 3px; border-radius: 12px; }
@media (prefers-reduced-motion: reduce) { .fl-bolha-on { animation: none; } }

/* Shopping: folga para o anel das bolinhas das lojas (com a cor do plano ficava cortado em cima e nos lados) */
.vt-carrossel.lojas .vt-trilho { padding: 9px 16px 10px; gap: 14px; scroll-padding-left: 16px; }

/* ---------- Gaveta de filtros (.vf): cabeçalho fixo, seções com ícone, opções com contagem, rodapé fixo ---------- */
.vt-local-fundo.vf { display: grid; place-items: end center; padding: 0;
  --vt-card: var(--panel, #10181d); --vt-card-2: var(--panel-2, #162128); --vt-line: var(--line, #22313a); --vt-muted: var(--muted, #8c9ca7); color: var(--text); }
.vf-pop { width: min(560px, 100%); max-height: min(88vh, 860px); display: flex; flex-direction: column; overflow: hidden; border-radius: 24px 24px 0 0;
  background: var(--vt-card); border: 1px solid var(--vt-line); border-bottom: 0; box-shadow: 0 -24px 60px rgba(0, 0, 0, .45); animation: vfSobe .24s ease-out; }
@keyframes vfSobe { from { transform: translateY(40px); opacity: .5; } to { transform: none; opacity: 1; } }
@media (min-width: 700px) { .vt-local-fundo.vf { place-items: center; padding: 16px; } .vf-pop { border-radius: 24px; border-bottom: 1px solid var(--vt-line); } }
.vf-topo { position: relative; display: flex; align-items: center; gap: 12px; padding: 18px 16px 12px; border-bottom: 1px solid var(--vt-line);
  background: linear-gradient(180deg, color-mix(in srgb, var(--vc) 10%, transparent), transparent); }
.vf-alca { position: absolute; top: 7px; left: 50%; width: 40px; height: 4px; margin-left: -20px; border-radius: 4px; background: var(--vt-line); }
.vf-tit { flex: 1; display: grid; gap: 1px; min-width: 0; }
.vf-tit strong { font-size: 19px; font-weight: 850; letter-spacing: -.2px; }
.vf-tit small { font-size: 12.5px; color: var(--vt-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vf-x { flex: none; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--vt-line); background: var(--vt-card-2); color: inherit; cursor: pointer; }
.vf-x svg { width: 18px; height: 18px; }
.vf-corpo { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 4px 16px 12px; }
.vf-sec { padding: 14px 0; border-bottom: 1px solid color-mix(in srgb, var(--vt-line) 70%, transparent); }
.vf-sec:last-child { border-bottom: 0; }
.vf-sec h4 { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; font-size: 14.5px; font-weight: 800; }
.vf-ic { width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; flex: none; color: var(--vc); background: color-mix(in srgb, var(--vc) 14%, transparent); }
.vf-ic svg { width: 15px; height: 15px; }
.vf-dica { margin-left: auto; font-size: 11.5px; font-weight: 600; color: var(--vt-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.vf-onde { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 14px; border-radius: 16px; cursor: pointer; text-align: left; font: inherit; color: inherit;
  border: 1px solid color-mix(in srgb, var(--vc) 45%, var(--vt-line)); background: color-mix(in srgb, var(--vc) 8%, var(--vt-card-2)); }
.vf-onde > svg { width: 22px; height: 22px; flex: none; color: var(--vc); }
.vf-onde-tx { flex: 1; display: grid; gap: 1px; min-width: 0; }
.vf-onde-tx strong { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vf-onde-tx small { font-size: 12px; color: var(--vt-muted); }
.vf-mudar { flex: none; padding: 6px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 800; color: var(--vc-ink); background: var(--vc); }
.vf-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.vf-seg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.vf-seg:has(> :nth-child(5):last-child) { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.vf-chip { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 8px 13px; border-radius: 12px; cursor: pointer; font: inherit;
  font-size: 13.5px; font-weight: 700; color: inherit; background: var(--vt-card-2); border: 1px solid var(--vt-line); transition: background .15s, border-color .15s, transform .1s; }
.vf-chip:active { transform: scale(.97); }
.vf-chip em { font-style: normal; font-size: 11px; font-weight: 800; min-width: 20px; padding: 1px 6px; border-radius: 999px; color: var(--vt-muted); background: color-mix(in srgb, var(--vt-line) 60%, transparent); }
.vf-chip svg { width: 15px; height: 15px; }
.vf-chip.on { color: var(--vc-ink); background: var(--vc); border-color: var(--vc); box-shadow: 0 6px 16px -8px var(--vc); }
.vf-chip.on em { color: inherit; background: rgba(255, 255, 255, .22); }
.vf-chip.zero { opacity: .5; }
.vf-seg .vf-chip { padding: 8px 4px; }
.vf-rod { display: grid; grid-template-columns: auto 1fr; gap: 10px; padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--vt-line); background: var(--vt-card); }
.vf-limpar { padding: 13px 16px; border-radius: 14px; border: 1px solid var(--vt-line); background: transparent; color: inherit; font: inherit; font-weight: 750; cursor: pointer; }
.vf-limpar:disabled { opacity: .45; cursor: default; }
.vf-aplicar { padding: 13px 16px; border-radius: 14px; border: 0; font: inherit; font-weight: 850; font-size: 15px; cursor: pointer; color: var(--vc-ink); background: var(--vc); box-shadow: 0 10px 24px -12px var(--vc); }
.vf-aplicar:disabled { opacity: .5; cursor: default; box-shadow: none; }
@media (prefers-reduced-motion: reduce) { .vf-pop { animation: none; } }
/* Destaques de Delivery, Saúde e Shopping: cartões direto no trilho (sem o "slot" que reveza dos Freelances) */
.vt-carrossel.top-cat .vt-trilho > article { flex: none; width: 46vw; max-width: 220px; scroll-snap-align: start; }
/* A gaveta fica fora da .vitrine: os ícones precisam do traço aqui também */
.vf svg { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
/* Local dentro dos Filtros (sem abrir outra janela): onde você está, atalhos e Estado/Cidade */
.vf-local .vf-onde { cursor: default; margin-bottom: 10px; }
.vf-local-ops { margin-bottom: 10px; }
.vf-local-ops .vf-chip svg { color: var(--vc); }
.vf-campos .hf-end { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.vf-campos .campo { display: grid; gap: 5px; min-width: 0; position: relative; }
.vf-campos .campo label { font-size: 12.5px; font-weight: 700; color: var(--vt-muted); }
.vf-campos .campo select, .vf-campos .campo input { width: 100%; box-sizing: border-box; min-height: 44px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--vt-line); background: var(--vt-card-2); color: inherit; font: inherit; font-size: 15px; }
.vf-campos .campo select:focus, .vf-campos .campo input:focus { outline: 2px solid color-mix(in srgb, var(--vc) 55%, transparent); border-color: var(--vc); }
.vf-campos .campo .ajuda { font-size: 11.5px; color: var(--vt-muted); }
.vf-campos .campo .ajuda:empty { display: none; }
.vf-aviso { display: block; margin-top: 8px; font-size: 12.5px; color: #ef4444; }
.vt-local-fundo.vf { --accent: var(--vc); }

/* ---------- Cor do plano em todas as vitrines (classes hf-pl-* do planos-base.js) ---------- */
.vitrine .hf-pl-plus, .vitrine .hf-pl-pro, .vitrine .hf-pl-premium { --hf-pl-bg: var(--vt-card); }
.vitrine .hf-pl-gratis { --hf-pl: var(--vc); }
.vitrine :is(.hf-pl-plus, .hf-pl-pro, .hf-pl-premium, .hf-pl-gratis) .vt-avatar { box-shadow: 0 0 0 2px var(--vt-card), 0 0 0 4px var(--hf-pl); }
.vt-bolha-loja[data-plano="gratis"] .vt-avatar { box-shadow: 0 0 0 2px var(--vt-bg), 0 0 0 4px var(--vc); }
.vt-bolha-loja[data-plano="plus"] .vt-avatar { box-shadow: 0 0 0 2px var(--vt-bg), 0 0 0 4.5px #2563ff, 0 6px 18px -6px #2563ff; }
.vt-bolha-loja[data-plano="pro"] .vt-avatar { box-shadow: 0 0 0 2px var(--vt-bg), 0 0 0 4.5px #7c3aed, 0 6px 18px -6px #7c3aed; }
.vt-bolha-loja[data-plano="premium"] .vt-avatar { box-shadow: 0 0 0 2px var(--vt-bg), 0 0 0 4.5px #f59e0b, 0 6px 18px -6px #f59e0b; }

/* ---------- Fileiras no estilo dos apps de música: título grande, frase, "›" e cabeçalho com foto ---------- */
.vt-car-tit { display: flex; align-items: center; gap: 12px; min-width: 0; flex: 1; }
.vt-car-tx { display: grid; gap: 2px; min-width: 0; }
.vt-carrossel .vt-car-topo { align-items: flex-end; gap: 10px; margin-bottom: 12px; }
.vt-carrossel .vt-car-topo h3 { font-size: 20px; font-weight: 850; letter-spacing: -.3px; line-height: 1.2; }
.vt-car-pre { font-size: 12.5px; font-weight: 600; color: var(--vt-muted); }
.vt-car-sub { margin: 0; font-size: 13px; line-height: 1.35; color: var(--vt-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vt-car-tit.com-foto .vt-avatar { width: 52px; height: 52px; font-size: 16px; flex: none; box-shadow: 0 0 0 2px var(--vt-bg), 0 0 0 4px var(--vc); }
.vt-car-mais { flex: none; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; border: 0; background: transparent; color: var(--vt-text); cursor: pointer; }
.vt-car-mais svg { width: 22px; height: 22px; }
.vt-car-mais:hover { background: color-mix(in srgb, var(--vc) 14%, transparent); color: var(--vc); }
.vt-carrossel { margin-bottom: 28px; }
/* no celular: só o "›" (arrastar com o dedo); no computador: as setas */
@media (max-width: 760px) { .vt-carrossel .vt-setas { display: none; } }
/* Fileiras das categorias com o mesmo espaço das outras */
.vt-linhas .vt-carrossel.linha-cat { margin: 18px 0 10px; }
/* Imóveis: a distância fica acima da linha do preço (antes cobria o valor) */
.vt-imo .tag ~ .vt-dist, .vt-imo .vt-dist { top: auto; left: auto; right: 6px; bottom: 34px; }

/* avisos (toasts) organizados: largura certa, quebra equilibrada, sem palavra solta (02/11/2026) */
.vt-toast { width: max-content; max-width: min(calc(100% - 32px), 440px); box-sizing: border-box; text-align: center; line-height: 1.35; text-wrap: balance; overflow-wrap: break-word; animation: hfToastEntra .22s ease-out; }
@keyframes hfToastEntra { from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translate(-50%, 0); } }
@media (prefers-reduced-motion: reduce) { .toast, .vt-toast, .cm-toast, .ad-toast { animation: none !important; } }
