/* ── Reset + Base ───────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: #f3f4f6;
  color: #111827;
  min-height: 100vh;
}
a { text-decoration: none; color: inherit; }
img { display: block; max-width: 100%; }

/* ── Variáveis ──────────────────────────────────────────────────────────────── */
:root {
  --green:    #16a34a;
  --green-dk: #15803d;
  --green-lt: #dcfce7;
  --red:      #ef4444;
  --yellow:   #f59e0b;
  --gray-100: #f3f4f6;
  --gray-200: #e5e7eb;
  --gray-300: #d1d5db;
  --gray-400: #9ca3af;
  --gray-500: #6b7280;
  --gray-600: #4b5563;
  --gray-700: #374151;
  --gray-900: #111827;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
  --shadow:    0 1px 3px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.06);
  --shadow-md: 0 4px 6px rgba(0,0,0,.07), 0 2px 4px rgba(0,0,0,.06);
  --shadow-lg: 0 10px 15px rgba(0,0,0,.1), 0 4px 6px rgba(0,0,0,.05);
  --radius:    12px;
  --header-h:  64px;
}

/* ── Header ─────────────────────────────────────────────────────────────────── */
.mkt-header {
  position: sticky; top: 0; z-index: 100;
  background: #fff;
  border-bottom: 1px solid var(--gray-200);
  box-shadow: var(--shadow-sm);
}

/* Linha 1: logo + cidade */
.mkt-header-top {
  max-width: 1200px; margin: 0 auto;
  padding: 0 20px; height: 56px;
  display: flex; align-items: center; gap: 12px;
}

.mkt-logo {
  display: flex; align-items: center; gap: 8px;
  font-size: 20px; font-weight: 800; letter-spacing: -0.5px;
  color: var(--green); white-space: nowrap; flex-shrink: 0;
}
.mkt-logo i { font-size: 20px; }

/* O bloco inteiro (pin+nome+lápis) é a área clicável pra trocar de cidade —
   antes só o ícone de lápis (26px) era link, achado real: usuário clicava no
   nome da cidade (maior, mais óbvio) e nada acontecia, "parecia travado". */
.mkt-location {
  display: flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 600;
  color: var(--gray-700); margin-left: auto;
  padding: 6px 8px; margin-right: -8px; border-radius: 8px;
  transition: background .15s;
}
.mkt-location:hover { background: var(--gray-100); color: var(--gray-700); }
.mkt-location > i { color: var(--green); font-size: 14px; }
.mkt-location-change {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 7px;
  background: var(--gray-100); color: var(--gray-500);
  font-size: 11px; margin-left: 4px;
  transition: background .15s, color .15s;
}
.mkt-location:hover .mkt-location-change { background: var(--green-lt); color: var(--green); }

.mkt-search-wrap { position: relative; width: 100%; }
.mkt-search-icon {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  color: var(--gray-400); font-size: 14px; pointer-events: none;
}
.mkt-search {
  width: 100%; padding: 10px 16px 10px 40px;
  background: var(--gray-100); border: 1.5px solid transparent;
  border-radius: 24px; font-size: 14px; font-family: inherit;
  color: var(--gray-900); outline: none;
  transition: border-color .15s, background .15s;
}
.mkt-search:focus { background: #fff; border-color: var(--green); }
.mkt-header-tagline { margin-left: auto; font-size: 13px; color: var(--gray-500); }

/* ── Home hero ──────────────────────────────────────────────────────────────── */
.mkt-home-hero {
  background: linear-gradient(135deg, #064e3b 0%, #065f46 60%, #16a34a 100%);
  color: #fff; padding: 64px 20px 56px; text-align: center;
  position: relative; overflow: hidden;
}
.mkt-home-hero h1 { font-size: clamp(24px, 5vw, 40px); font-weight: 800; margin-bottom: 12px; }
.mkt-home-hero p  { font-size: 16px; opacity: .85; margin-bottom: 32px; }
.mkt-hero-content { position: relative; z-index: 1; }

/* Icones de comida flutuando no fundo do hero — só decoração, aria-hidden.
   Posições/tamanhos fixos por nth-child pra não precisar de JS nem inline style. */
.mkt-hero-pattern { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.mkt-hero-pattern i { position: absolute; color: #fff; opacity: .08; animation: mktHeroFloat 7s ease-in-out infinite; }
.mkt-hero-pattern i:nth-child(1) { top: 8%;  left: 6%;  font-size: 46px; animation-delay: 0s; }
.mkt-hero-pattern i:nth-child(2) { top: 62%; left: 12%; font-size: 30px; animation-delay: .6s; }
.mkt-hero-pattern i:nth-child(3) { top: 18%; left: 88%; font-size: 34px; animation-delay: 1.2s; }
.mkt-hero-pattern i:nth-child(4) { top: 72%; left: 90%; font-size: 42px; animation-delay: 1.8s; }
.mkt-hero-pattern i:nth-child(5) { top: 40%; left: 2%;  font-size: 26px; animation-delay: 2.4s; }
.mkt-hero-pattern i:nth-child(6) { top: 4%;  left: 46%; font-size: 24px; animation-delay: 3s; }
.mkt-hero-pattern i:nth-child(7) { top: 78%; left: 48%; font-size: 30px; animation-delay: 3.6s; }
.mkt-hero-pattern i:nth-child(8) { top: 30%; left: 70%; font-size: 22px; animation-delay: 4.2s; }
@keyframes mktHeroFloat { 0%,100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-14px) rotate(6deg); } }
@media (max-width: 640px) { .mkt-hero-pattern i:nth-child(6), .mkt-hero-pattern i:nth-child(8) { display: none; } }

.mkt-hero-stats { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 28px; flex-wrap: wrap; }
.mkt-hero-stat { display: flex; flex-direction: column; align-items: center; line-height: 1.2; }
.mkt-hero-stat strong { font-size: 22px; font-weight: 800; color: #fff; }
.mkt-hero-stat span { font-size: 12px; color: rgba(255,255,255,.7); text-transform: uppercase; letter-spacing: .4px; }
.mkt-hero-stat-sep { width: 1px; height: 28px; background: rgba(255,255,255,.2); }
@media (prefers-reduced-motion: reduce) { .mkt-hero-pattern i { animation: none; } }

.mkt-city-search-wrap { position: relative; max-width: 480px; margin: 0 auto; }
.mkt-city-search-wrap i {
  position: absolute; left: 18px; top: 50%; transform: translateY(-50%);
  color: var(--gray-400); font-size: 16px;
}
#city-search {
  width: 100%; padding: 16px 20px 16px 48px;
  border-radius: 50px; border: none;
  font-size: 16px; font-family: inherit; color: var(--gray-900);
  outline: none; box-shadow: var(--shadow-lg);
}

/* ── Container ──────────────────────────────────────────────────────────────── */
.mkt-container { max-width: 1200px; margin: 0 auto; padding: 20px 20px 32px; }
.mkt-section   { margin-bottom: 48px; }
.mkt-section-title {
  font-size: 20px; font-weight: 700; color: var(--gray-900);
  margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
}
.mkt-count {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--gray-200); color: var(--gray-500);
  font-size: 12px; font-weight: 600; border-radius: 20px; padding: 1px 10px;
}

/* ── Cities grid ────────────────────────────────────────────────────────────── */
.mkt-cities-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.city-card {
  display: flex; align-items: center; gap: 14px;
  background: #fff; border: 1.5px solid var(--gray-200);
  border-radius: var(--radius); padding: 16px 18px;
  cursor: pointer; transition: box-shadow .15s, border-color .15s, transform .1s;
}
.city-card:hover { border-color: var(--green); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.city-card-icon {
  width: 40px; height: 40px; border-radius: 10px;
  background: var(--green-lt); display: flex; align-items: center;
  justify-content: center; color: var(--green); font-size: 16px; flex-shrink: 0;
}
.city-card-info { flex: 1; }
.city-card-info strong { display: block; font-size: 14px; font-weight: 600; }
.city-card-info span  { font-size: 12px; color: var(--gray-400); }
.city-card-count { font-size: 12px; font-weight: 600; color: var(--green); white-space: nowrap; }

/* ── CTA Lojista (home, versão rica 2 colunas) ────────────────────────────── */
.mkt-partner-cta { background: #f8fafc; padding: 56px 20px; margin-top: 16px; }
.mkt-partner-cta-inner {
  max-width: 1200px; margin: 0 auto; background: linear-gradient(135deg, #0f172a, #064e3b);
  border-radius: 20px; padding: 0; overflow: hidden; display: flex; align-items: stretch;
  box-shadow: 0 12px 40px rgba(6,78,59,.2);
}
.mkt-partner-cta-text { flex: 1 1 420px; padding: 44px 40px; color: #fff; }
.mkt-partner-eyebrow {
  display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px; color: #4ade80; margin-bottom: 14px;
}
.mkt-partner-cta-text h2 { font-size: clamp(22px, 3.4vw, 30px); font-weight: 800; margin-bottom: 10px; letter-spacing: -.01em; }
.mkt-partner-cta-text p { font-size: 15px; color: rgba(255,255,255,.8); margin-bottom: 20px; max-width: 460px; line-height: 1.55; }
.mkt-partner-features { list-style: none; padding: 0; margin: 0 0 26px; display: flex; flex-direction: column; gap: 10px; }
.mkt-partner-features li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: rgba(255,255,255,.9); }
.mkt-partner-features i { color: #4ade80; font-size: 14px; }
.mkt-partner-cta-visual {
  flex: 0 0 220px; display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.05); position: relative; overflow: hidden;
}
.mkt-partner-cta-visual i { font-size: 88px; color: rgba(255,255,255,.18); }
.mkt-partner-cta-visual::before {
  content: ''; position: absolute; width: 260px; height: 260px; border-radius: 50%;
  background: radial-gradient(circle, rgba(74,222,128,.25), transparent 70%);
}
@media (max-width: 760px) {
  .mkt-partner-cta { padding: 40px 16px; }
  .mkt-partner-cta-inner { flex-direction: column; border-radius: 16px; }
  .mkt-partner-cta-text { padding: 32px 24px; }
  .mkt-partner-cta-visual { flex-basis: 120px; }
  .mkt-partner-cta-visual i { font-size: 56px; }
}

/* ── Busca standalone (abaixo dos banners) ──────────────────────────────────── */
.mkt-search-bar {
  padding: 20px 10px 0px 4px;
}
.mkt-search-bar .mkt-search-wrap {
  max-width: 1200px; margin: 0 auto;
}
.mkt-search-bar .mkt-search {
  background: #fff;
  box-shadow: var(--shadow-md);
  border-color: transparent;
  padding: 14px 20px 14px 48px;
  font-size: 15px;
  border-radius: 28px;
}
.mkt-search-bar .mkt-search-icon {
  font-size: 16px; left: 18px;
}
.mkt-search-bar .mkt-search:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(22,163,74,.12), var(--shadow-md);
}
/* Flutua por cima da borda inferior do hero (banner ou faixa verde) em vez de
   vir depois como bloco separado com corte reto — cola visualmente os 2. */
.mkt-search-bar--floating {
  position: relative; z-index: 5;
  margin-top: -24px;
  padding-top: 0;
}

/* ── Hero da cidade (momento de chegada, quando NÃO há banner configurado) ───── */
.mkt-city-hero {
  position: relative; overflow: hidden;
  background: linear-gradient(120deg, #064e3b 0%, #16a34a 100%);
  color: #fff; padding: 30px 20px 46px; text-align: center;
}
.mkt-city-hero-inner { position: relative; z-index: 1; }
.mkt-city-hero h1 { font-size: clamp(22px, 4vw, 30px); font-weight: 800; margin: 0 0 4px; letter-spacing: -.01em; }
.mkt-city-hero h1 i { font-size: .7em; opacity: .85; margin-right: 4px; }
.mkt-city-hero p { font-size: 14px; color: rgba(255,255,255,.85); margin: 0; }
.mkt-city-hero .mkt-hero-pattern i { opacity: .1; }

/* ── Hero = banner (quando a loja TEM banner configurado) — banner e faixa
   verde nunca aparecem juntos, senão empilha 3 divisores duros. Nome da
   cidade fica escrito por cima, com gradiente na base pra dar contraste. ── */
.mkt-hero-banner { position: relative; }
.mkt-hero-banner-overlay {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  padding: 44px 70px 20px 20px;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.72) 100%);
  color: #fff; pointer-events: none;
}
.mkt-hero-banner-overlay h1 { font-size: clamp(20px, 4vw, 28px); font-weight: 800; margin: 0 0 2px; letter-spacing: -.01em; text-shadow: 0 1px 4px rgba(0,0,0,.5); }
.mkt-hero-banner-overlay h1 i { font-size: .7em; opacity: .9; margin-right: 4px; }
.mkt-hero-banner-overlay p { font-size: 13px; color: rgba(255,255,255,.92); margin: 0; text-shadow: 0 1px 3px rgba(0,0,0,.5); }
/* Dots sobem pro topo do banner — embaixo colidiriam com o texto da cidade
   sobreposto (.mkt-hero-banner-overlay), que também fica na base. */
.mkt-hero-banner .banners-dots { top: 14px; bottom: auto; }

/* ── Banners ────────────────────────────────────────────────────────────────── */
.mkt-banners { position: relative; overflow: hidden; background: #000; height: 340px; }
.mkt-banner-slide { display: none; position: relative; height: 100%; }
.mkt-banner-slide.active { display: block; }
.mkt-banner-slide img { width: 100%; height: 280px; object-fit: cover; object-position: center; }
.banners-dots {
  position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 6px; z-index: 10;
}
.banner-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(255,255,255,.5); border: none; cursor: pointer; padding: 0;
  transition: background .15s, transform .15s;
}
.banner-dot.active { background: #fff; transform: scale(1.3); }
.banner-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,.9); border: none; border-radius: 50%;
  width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 10; font-size: 14px; color: var(--gray-700);
  box-shadow: var(--shadow-md); transition: background .15s;
}
.banner-nav:hover { background: #fff; }
.banner-nav.prev { left: 14px; }
.banner-nav.next { right: 14px; }

/* ── Descubra (carrossel Fominha / Indicaê) ─────────────────────────────────── */
.mkt-discover-rail {
  display: flex; gap: 14px;
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;                /* Firefox */
  /* padding generoso p/ a sombra do card caber sem ser cortada (evita "borda reta") */
  margin: -6px -6px 0;
  padding: 14px 12px 24px;
}
.mkt-discover-rail::-webkit-scrollbar { display: none; }  /* Chrome/Safari */
.mkt-discover-card {
  position: relative; overflow: hidden; isolation: isolate;
  flex: 0 0 340px;                      /* largura fixa no rail (desktop) */
  scroll-snap-align: start;
  display: flex; align-items: center; gap: 14px;
  min-width: 0;
  padding: 18px 20px; border-radius: 18px;
  color: #fff; text-decoration: none;
  box-shadow: 0 6px 16px -4px rgba(17,24,39,.22);   /* tighter/softer = mais refinado */
  transition: transform .18s ease, box-shadow .18s ease;
}
.mkt-discover-card::after {                /* brilho decorativo no canto */
  content: ""; position: absolute; z-index: -1;
  top: -45%; right: -8%; width: 170px; height: 170px;
  background: radial-gradient(circle, rgba(255,255,255,.28), transparent 68%);
  pointer-events: none;
}
.mkt-discover-card:hover { transform: translateY(-3px); box-shadow: 0 12px 24px -6px rgba(17,24,39,.30); }
.mkt-discover-card:hover .mkt-discover-arrow { transform: translateX(4px); }
.mkt-discover-ico {
  flex-shrink: 0; width: 46px; height: 46px; border-radius: 13px;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; line-height: 1;
  background: rgba(255,255,255,.18);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.28);
  backdrop-filter: blur(3px);
}
.mkt-discover-txt { flex: 1; min-width: 0; }
.mkt-discover-txt strong {
  display: block; font-size: 15.5px; font-weight: 800; letter-spacing: -.2px;
}
.mkt-discover-txt span {
  display: block; font-size: 12.5px; opacity: .92; margin-top: 2px; line-height: 1.3;
}
.mkt-discover-arrow { flex-shrink: 0; font-size: 13px; opacity: .9; transition: transform .18s ease; }
.mkt-discover-card--fominha { background: linear-gradient(120deg,#f43f5e,#f59e0b); }
.mkt-discover-card--indicae { background: linear-gradient(120deg,#a855f7,#ec4899); }

/* ── Ofertas ────────────────────────────────────────────────────────────────── */
.mkt-ofertas-section {
  margin: 24px 0 32px;
}
.mkt-ofertas-scroll {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 6px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.mkt-ofertas-scroll::-webkit-scrollbar { display: none; }
.oferta-card {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
  width: 220px;
  padding: 16px 18px;
  border-radius: 14px;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  transition: transform .2s, box-shadow .2s;
}
.oferta-card:hover { transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.oferta-card-icon {
  width: 40px; height: 40px; flex-shrink: 0;
  background: rgba(255,255,255,.2);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
}
.oferta-card-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.oferta-titulo { font-size: 14px; font-weight: 700; line-height: 1.2; }
.oferta-sub    { font-size: 11px; opacity: .85; line-height: 1.3; }

/* Card com imagem — mesma largura/altura, imagem cobre tudo */
.oferta-card--img {
  padding: 0;
  overflow: hidden;
  background: var(--gray-200);
}
.oferta-card--img img {
  width: 220px; height: 96px;
  object-fit: cover; object-position: center;
  display: block;
}

/* ── Categorias ─────────────────────────────────────────────────────────────── */
.mkt-cats-wrap {
  position: sticky;
  top: 56px; /* altura exata do .mkt-header */
  z-index: 90;
  background: #fff;
  border-bottom: 1px solid var(--gray-200);
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  overflow: hidden;
  transition: box-shadow .2s;
}
.mkt-cats-wrap.scrolled {
  box-shadow: 0 3px 16px rgba(0,0,0,.1);
}
.mkt-cats {
  display: flex; gap: 8px; overflow-x: auto;
  max-width: 1200px; margin: 0 auto;
  padding: 10px 20px 10px; scrollbar-width: none; -ms-overflow-style: none;
}
.mkt-cats::-webkit-scrollbar { display: none; }
.cat-chip {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  flex-shrink: 0; background: #fff; border: 1.5px solid var(--gray-200);
  border-radius: var(--radius); padding: 10px 14px; cursor: pointer;
  font-size: 11px; font-weight: 600; color: var(--gray-500);
  transition: border-color .15s, color .15s, background .15s;
  font-family: inherit; white-space: nowrap; min-width: 64px;
}
.cat-chip:hover { border-color: var(--green); color: var(--green); }
.cat-chip.active { border-color: var(--green); background: var(--green-lt); color: var(--green-dk); }
.cat-icon {
  width: 32px; height: 32px; border-radius: 8px;
  background: var(--gray-100); display: flex; align-items: center;
  justify-content: center; font-size: 14px; transition: background .15s;
}
.cat-chip.active .cat-icon { background: rgba(22,163,74,.15); }

/* ── Section header ─────────────────────────────────────────────────────────── */
.mkt-section-header {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  flex-wrap: wrap; margin-bottom: 20px;
}
.mkt-section-header .mkt-section-title { margin-bottom: 0; }

/* Grade/Lista — mesmo padrão visual do toggle já usado no cardápio */
.view-toggle { display: flex; align-items: center; gap: 2px; background: var(--gray-100); border-radius: 8px; padding: 2px; flex-shrink: 0; }
.view-toggle-btn { width: 32px; height: 28px; border: 0; background: none; border-radius: 6px; color: var(--gray-400); font-size: 13px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all .2s ease; }
.view-toggle-btn.active { background: #fff; color: var(--gray-900); box-shadow: 0 1px 3px rgba(0,0,0,.1); }

/* Filtros: 2 colunas iguais + bairro full width */
.mkt-filters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 20px;
}
.mkt-select--full { grid-column: 1 / -1; }

.mkt-select {
  padding: 9px 12px; border: 1.5px solid var(--gray-200); border-radius: 8px;
  background: #fff; font-size: 13px; font-family: inherit;
  color: var(--gray-700); cursor: pointer; outline: none; transition: border-color .15s;
  width: 100%;
}
.mkt-select:focus { border-color: var(--green); }

/* ── Grid ───────────────────────────────────────────────────────────────────── */
.mkt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; }
.mkt-grid--destaques .store-card { border-color: rgba(245,158,11,.35); }

/* ── Store card ─────────────────────────────────────────────────────────────── */
.store-card {
  background: #fff; border-radius: var(--radius); overflow: hidden;
  border: 1.5px solid var(--gray-200);
  transition: box-shadow .2s, transform .15s, border-color .2s;
  display: flex; flex-direction: column; cursor: pointer;
}
.store-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); border-color: var(--gray-300); }
.store-card--destaque { border-color: rgba(245,158,11,.4); }
.store-card-img {
  position: relative; width: 100%; aspect-ratio: 16/9;
  background: linear-gradient(135deg, #e5e7eb, #d1d5db);
  overflow: hidden;
}
/* Foto do card: capa/produto real (cover) OU fundo colorido+ícone quando a
   loja não tem nenhuma foto própria ainda — nunca mais logo esticada. */
.store-card-hero-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.store-card-hero-placeholder {
  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
}
.store-card-hero-placeholder i { font-size: 42px; color: rgba(255,255,255,.55); }
/* Selinho da logo — substitui a logo esticada, vira só uma confirmação de marca
   no canto (mesmo padrão iFood/Rappi: comida em destaque, logo é coadjuvante). */
.store-card-logo-badge {
  position: absolute; left: 10px; bottom: 10px; z-index: 2;
  width: 38px; height: 38px; border-radius: 50%;
  border: 2px solid #fff; background: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.25);
  overflow: hidden;
}
.store-card-logo-badge img { width: 100%; height: 100%; object-fit: cover; display: block; }
.store-badge {
  position: absolute; top: 10px; left: 10px;
  padding: 3px 9px; border-radius: 20px; font-size: 11px; font-weight: 700; letter-spacing: .3px;
}
.store-badge.open  { background: var(--green); color: #fff; }
.store-badge.closed{ background: rgba(0,0,0,.55); color: rgba(255,255,255,.85); }
.store-badge-dest {
  position: absolute; top: 10px; right: 10px;
  padding: 3px 9px; border-radius: 20px; font-size: 11px; font-weight: 700;
  background: #f59e0b; color: #fff;
}
.store-badge-dest i { font-size: 9px; }
.store-card-body { padding: 14px; flex: 1; display: flex; flex-direction: column; gap: 6px; }
.store-name {
  font-size: 15px; font-weight: 700; color: var(--gray-900); line-height: 1.3;
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.store-rating { display: flex; align-items: center; gap: 3px; font-size: 12px; color: var(--yellow); }
.store-rating-val { font-weight: 700; color: var(--gray-700); margin-left: 2px; }
.store-reviews { color: var(--gray-400); font-weight: 400; }
.store-meta { display: flex; gap: 12px; font-size: 12px; color: var(--gray-500); }
.store-meta i { font-size: 11px; margin-right: 3px; }
.store-meta-frete { margin-top: -2px; }
.store-frete { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 700; color: var(--green-dk); }
.store-frete i { font-size: 11px; }
.store-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 2px; }
.store-tag {
  font-size: 11px; padding: 2px 8px; border-radius: 20px;
  background: var(--gray-100); color: var(--gray-600); font-weight: 500;
}

/* ── Lista (imagem à esquerda, dados à direita) — mesmo padrão do cardápio ───── */
.mkt-grid.list-view { grid-template-columns: 1fr; gap: 10px; }
.mkt-grid.list-view .store-card { flex-direction: row; align-items: stretch; }
.mkt-grid.list-view:hover .store-card:hover { transform: none; }
.mkt-grid.list-view .store-card-img {
  width: 108px; min-width: 108px; max-width: 108px; height: auto; aspect-ratio: auto;
}
.mkt-grid.list-view .store-card-logo-badge { width: 28px; height: 28px; left: 6px; bottom: 6px; border-width: 1.5px; }
.mkt-grid.list-view .store-card-hero-placeholder i { font-size: 26px; }
.mkt-grid.list-view .store-badge { font-size: 9px; padding: 2px 6px; top: 6px; left: 6px; }
.mkt-grid.list-view .store-badge-dest { font-size: 9px; padding: 2px 6px; top: 6px; right: 6px; }
.mkt-grid.list-view .store-card-body { padding: 10px 12px; gap: 4px; justify-content: center; }
.mkt-grid.list-view .store-name { font-size: 14px; -webkit-line-clamp: 1; }
.mkt-grid.list-view .store-tags { display: none; }
.mkt-grid.list-view .store-verificado { font-size: 10.5px; }
@media (max-width: 480px) {
  .mkt-grid.list-view .store-card-img { width: 84px; min-width: 84px; max-width: 84px; }
  .mkt-grid.list-view .store-card-logo-badge { width: 24px; height: 24px; }
}

/* ── Load more / Loading ─────────────────────────────────────────────────────── */
.mkt-load-more-wrap { text-align: center; margin-top: 24px; }
.btn-load-more {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 32px; background: #fff; border: 1.5px solid var(--gray-200);
  border-radius: 24px; font-size: 14px; font-weight: 600; font-family: inherit;
  color: var(--gray-700); cursor: pointer; transition: border-color .15s, color .15s, box-shadow .15s;
}
.btn-load-more:hover { border-color: var(--green); color: var(--green); box-shadow: var(--shadow-sm); }
.mkt-loading { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 24px; font-size: 14px; color: var(--gray-400); }
.mkt-no-results { grid-column: 1/-1; text-align: center; padding: 56px 24px; color: var(--gray-400); }
.mkt-no-results i { font-size: 40px; opacity: .4; display: block; margin-bottom: 16px; }
.mkt-no-results p { font-size: 15px; }
.mkt-empty { text-align: center; padding: 80px 24px; color: var(--gray-400); }
.mkt-empty i { font-size: 48px; display: block; margin-bottom: 20px; opacity: .4; }

/* ── Footer ─────────────────────────────────────────────────────────────────── */
.mkt-footer {
  background: #fff; border-top: 1px solid var(--gray-200);
  padding: 20px 0; margin-top: 40px;
  font-size: 13px; color: var(--gray-400); text-align: center;
}

/* ── Responsive ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .mkt-header-top { padding: 0 14px; }
  .mkt-section-header { flex-direction: column; align-items: flex-start; }
  .mkt-filters { margin-left: 0; }
  .mkt-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
  .mkt-home-hero { padding: 44px 16px 40px; }
  .mkt-banners, .mkt-banner-slide img { height: 260px; }
  .mkt-search-bar { padding: 14px; }
  .mkt-search-bar--floating { padding-top: 0; margin-top: -20px; }
  .mkt-hero-banner-overlay { padding: 34px 56px 16px 16px; }
  .mkt-city-hero { padding-bottom: 40px; }
  .mkt-discover-rail { gap: 12px; margin-bottom: 4px; }
  .mkt-discover-card { flex: 0 0 84%; padding: 14px 16px; border-radius: 15px; gap: 12px; }
  .mkt-discover-ico { width: 42px; height: 42px; font-size: 22px; border-radius: 12px; }
}
@media (max-width: 480px) {
  .mkt-banners, .mkt-banner-slide img { height: 210px; }
  .mkt-hero-banner-overlay { padding: 26px 48px 14px 14px; }
  .mkt-search-bar--floating { margin-top: -16px; }
}
@media (max-width: 480px) {
  .mkt-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .mkt-filters .mkt-select { font-size: 12px; padding: 6px 8px; }
  .store-card-body { padding: 10px; }
  .store-name { font-size: 13px; }
  .mkt-location { font-size: 12px; gap: 4px; padding: 6px 4px; margin-right: -4px; }
}

/* ── CTA Rodapé: botão reusado dentro de .mkt-partner-cta (2 colunas) ────────── */
.mkt-footer-cta-btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: #fff; color: var(--green-dk); font-weight: 700;
  font-size: 15px; padding: 14px 32px; border-radius: 50px;
  text-decoration: none; font-family: inherit;
  box-shadow: 0 4px 14px rgba(0,0,0,.2);
  transition: transform .15s, box-shadow .15s;
}
.mkt-footer-cta-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,.25); }

/* ── Badge Novo ───────────────────────────────────────────────────── */
.store-badge-novo {
  position: absolute; top: 10px; right: 10px;
  background: #f97316; color: #fff;
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  padding: 3px 7px; border-radius: 20px;
  letter-spacing: .5px; line-height: 1;
}
/* Quando destaque e novo estão juntos, empilha verticalmente */
.store-badge-dest ~ .store-badge-novo {
  top: 36px;
}

/* ── Parceiro Verificado — badge dourado ─────────────────────────── */
.store-verificado {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 700;
  color: #92400e;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  border: 1px solid #f59e0b;
  border-radius: 20px;
  padding: 3px 10px;
  margin-top: 4px;
  letter-spacing: .2px;
}
.store-verificado i {
  font-size: 13px;
  color: #d97706;
}

/* ── Filtros rápidos (chips) ─────────────────────────────────────── */
.mkt-quick-filters {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 12px;
}
.quick-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 20px;
  border: 1.5px solid #d1fae5; background: #fff;
  color: #374151; font-size: 13px; font-weight: 500;
  cursor: pointer; transition: background .15s, border-color .15s, color .15s;
  font-family: inherit;
}
.quick-chip:hover { background: #f0fdf4; border-color: var(--green); }
.quick-chip.active {
  background: var(--green); border-color: var(--green);
  color: #fff;
}
.quick-chip i { font-size: 11px; }

/* ── Select de ordenação ─────────────────────────────────────────── */
#filter-sort { min-width: 160px; }

/* ── Seção Lojas em Alta ─────────────────────────────────────────── */
#section-alta .mkt-section-title i { vertical-align: middle; }