/* Padrão visual único da Bruttus (dono 09/11/2026): o do compras.bruttus.com.br. Carrega depois do estilo.css. */
@font-face{font-family:Inter;src:url(fontes/inter-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url(fontes/inter-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Inter;src:url(fontes/inter-700.woff2) format("woff2");font-weight:700;font-display:swap}
:root{
  --fundo:#0C0C0C; --preto:#0C0C0C; --card:#161616; --card-alto:#1E1E1E; --borda:#2C2C2C;
  --texto:#F5F2EA; --texto-2:#B8B3A8; --vidro:rgba(12,12,12,.92); --vermelho:#E5483B;
  --r-card:12px; --r-input:8px; --sombra:none;
  --fonte:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
html,body{background:var(--fundo);color:var(--texto)}
body{font-size:16px}
.cabeca h1{text-transform:uppercase;display:inline-block;transform:rotate(-1.2deg);position:relative;padding-bottom:10px;font-size:34px}
.cabeca h1::after{content:"";position:absolute;left:-2px;right:-6px;bottom:0;height:9px;width:auto;background:url("img/pincel.svg") no-repeat center/100% 100%;display:block}

/* ===== Peças do padrão 09/11 (do compras/static/tema-marketing.css), com as variáveis deste painel ===== */
/* LISTA COM FILTROS — Cardápio: pílulas com aria-current, "N produto(s)" + "Limpar filtros", estado vazio. Só GET. */
.lista-filtros .lf-busca{flex:1 1 260px}
.lista-filtros .lf-busca input{width:100%;min-height:44px}
.lf-pilulas{display:flex;gap:8px;flex-basis:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px;min-width:0}
.lf-pilulas::-webkit-scrollbar{display:none}
.lf-pilulas a{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid var(--borda);border-radius:999px;color:var(--texto);background:var(--card);text-decoration:none;white-space:nowrap;font-weight:600;font-size:14px}
.lf-pilulas a:hover{border-color:var(--texto-2)}
.lf-pilulas a[aria-current]{background:var(--amarelo);border-color:var(--amarelo);color:var(--preto)}
.lf-barra{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:0 0 var(--e2)}
.lf-conta{margin:0;color:var(--texto-2)}.lf-conta b{color:var(--texto)}
.lf-vazio{padding:var(--e4) var(--e3);text-align:center;color:var(--texto-2)}.lf-vazio b{display:block;color:var(--texto);margin-bottom:4px}
.filtros-cardapio.lista-filtros{min-width:0}
@media (max-width:640px){.lf-pilulas{margin:0 calc(-1*var(--e3));padding:0 var(--e3) 2px;flex-basis:calc(100% + 2*var(--e3))}.lf-pilulas a{min-height:48px}}

/* TABELA LARGA — complementos do produto: cabeçalho e 1ª coluna presos, números à direita, sombra = "tem mais ao lado". */
.larga{overflow:auto;max-height:78vh;
  background:linear-gradient(to left,var(--card) 30%,rgba(22,22,22,0)) 100% 0/48px 100% no-repeat local,
    radial-gradient(farthest-side at 100% 50%,rgba(245,242,234,.22),transparent) 100% 0/16px 100% no-repeat scroll,var(--card)}
.larga thead th{position:sticky;top:0;z-index:2;background:var(--card);box-shadow:inset 0 -1px var(--borda)}
.larga tbody td:first-child{position:sticky;left:0;z-index:1;background:var(--card)}
.larga thead th:first-child{left:0;z-index:3}
.larga .num{text-align:right;white-space:nowrap}

/* CARTÃO DE MÍDIA — fotos extras do produto: proporção fixa, object-fit cover, 1 coluna no celular. */
.grade-midia{list-style:none;margin:var(--e2) 0 0;padding:0;display:grid;align-items:start;gap:var(--e2);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:600px){.grade-midia{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}}
.cartao-midia{display:flex;flex-direction:column;min-width:0;background:var(--card-alto);border:1px solid var(--borda);border-radius:var(--r-card);overflow:hidden}
.cm-midia{position:relative;margin:0;aspect-ratio:1/1;background:var(--card-alto);overflow:hidden}
.cm-midia img{display:block;width:100%;height:100%;object-fit:cover}
.cm-corpo{display:flex;flex-direction:column;gap:var(--e1);padding:12px}
.cm-meta{margin:0;color:var(--texto-2);font-size:13px}