/* Categoria premium (task 17tjyy3gu2p, 29/09) — design/DESIGN.md + ajustes da Aquiles
   sobre o mockup aprovado. Carregado SO em is_product_category()||is_tax('categoria')
   (ver jm_enqueue_categoria_premium_css() em functions.php) -- nunca em home/anuncio/
   institucional/pagina "Ver todos os veiculos" (restricao do operador, 29/09).
   Tokens reusados de :root em styles.min.css (--red-1:#940002, --dark-3, --gray-6) --
   nenhum hex novo introduzido. */

.cat-hero-summary{
  font-size:16px;
  font-weight:600;
  line-height:24px;
  color:var(--dark-3);
  opacity:.82;
  margin:6px 0 0;
}
.cat-hero-summary b{
  color:var(--dark-3);
  font-weight:800;
  opacity:1;
}
.cat-hero-summary-sep{
  margin:0 6px;
  color:var(--gray-6);
  font-weight:400;
}

.cat-hero-trust{
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  padding:12px 0;
  margin-top:12px;
  border-top:1px solid var(--gray-2);
  border-bottom:1px solid var(--gray-2);
}
.cat-hero-trust-item{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:12.5px;
  font-weight:600;
  color:#940002;
}
.cat-hero-trust-item svg{flex-shrink:0}

.cat-hero-wa{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-top:16px;
  background:var(--red-1);
  color:#fff;
  font-weight:800;
  font-size:14px;
  line-height:1;
  padding:13px 20px;
  border-radius:999px;
  box-shadow:0 6px 16px rgba(148,0,2,.22);
  transition:transform .15s ease-out, box-shadow .15s ease-out;
}
.cat-hero-wa:hover,
.cat-hero-wa:focus-visible{
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(148,0,2,.3);
  color:#fff;
}

/* Selo "Ano XXXX" / "Parecido: ..." do bloco Alternativas parecidas (parts/alternativas-
   parecidas.php) -- item 4 do pedido da Aquiles (29/09): legivel no mobile de 390px, sem
   cobrir a foto de forma feia. O rotulo "Parecido: {motivo}" pode ser bem mais longo que
   "Ano 2013" -- trunca com reticencias em vez de esticar/quebrar por cima da foto inteira. */
.jm-alt-selo{
  max-width:calc(100% - 16px);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

@media (max-width:760px){
  .cat-hero-summary{font-size:14px;line-height:20px;}
  .cat-hero-trust{gap:7px 14px;}
  .cat-hero-trust-item{font-size:11.5px;}
  .cat-hero-wa{width:100%;justify-content:center;padding:13px 16px;font-size:13.5px;}
  .jm-alt-selo{font-size:10px;padding:3px 7px;}
}

/* Contador de ofertas (task 17tjyy3gu2p, 06/10) — "Mais de N anuncios" logo abaixo do H1. */
.jm-contador-ofertas{
  font-size:14px;
  font-weight:600;
  line-height:20px;
  color:var(--dark-3);
  opacity:1; /* 07/10: era .7 -> cinza abaixo de AA */
  margin:4px 0 0;
}

/* 07/10 — separador do resumo so entre itens (nunca orfao no inicio de linha). */
.cat-hero-summary-item + .cat-hero-summary-item::before{
  content:"·";
  margin:0 6px;
  color:var(--gray-6);
  font-weight:400;
}
@media (max-width:480px){
  .cat-hero-summary-item{display:block;}
  .cat-hero-summary-item + .cat-hero-summary-item::before{content:none;margin:0;}
}

/* 07/10/2026 (17tjyy3jred, correcoes do designer-revisor na vitrine Paradiso 1200) */
/* (3)(4) blocos "Anos proximos" / "Tambem procuram": mesma margem lateral do resto da pagina (20px) -> alinha com breadcrumb, H1, intro e FAQ (x=140 no desktop, 20 no mobile) */
.jm-escada-anos .jm-tambem-procuram-inner,
.jm-tambem-procuram .jm-tambem-procuram-inner{padding-left:20px;padding-right:20px;box-sizing:border-box;width:100%}
/* (7) breadcrumb: 14px no desktop; no mobile fica 12px e nunca quebra o nivel (testado em 390) */
@media (min-width:761px){
  #vehicles-category-tax .breadcrumb ul li{font-size:14px;line-height:24px}
}
#vehicles-category-tax .breadcrumb ul li{white-space:nowrap}
/* (9) mobile: reserva espaco no fim da pagina para o botao flutuante do WhatsApp nao cobrir o ultimo texto */
@media (max-width:760px){
  .footer{padding-bottom:88px}
}

/* 07/10 pos-fiscal (4): paginacao logo apos a grade (dentro de .vehicles-content, sem 2o "Ver todos") */
.vehicles-content .pagination-embutida{padding:20px 0 8px;flex:0 0 100%;width:100%;max-width:100%;display:block}
.vehicles-content .pagination-embutida .container{padding-left:0;padding-right:0;width:100%;max-width:100%}

/* 08/10 (17tjyy3jred) mobile: botao flutuante do WhatsApp nao cobre o contador dos chips de link.
   JS (functions.php, jm_categoria_wpp_nao_cobre_chips) liga .jm-wpp-oculto enquanto um bloco .single-vehicles-escada esta na tela. Chat aberto = nunca oculta. */
@media (max-width:720px){
  .wpp{transition:opacity .2s ease,visibility .2s ease}
  .wpp.jm-wpp-oculto:not(:has(.wpp-chat.active)){opacity:0;visibility:hidden;pointer-events:none}
}

/* 08/10 (17tjyy3jred) overflow horizontal no mobile 390: o nome do item dos blocos "Outros anos do ..." / "Outras opcoes do ..." (escada-links.css)
   tem white-space:nowrap e a trilha `1fr` (min-content) crescia ate caber o nome mais longo -> itens de 393px, contador cortado, rolagem lateral.
   Aqui (so categoria): trilha minmax(0,1fr), item/link com min-width:0 e max-width:100%, nome quebra linha, contador nunca encolhe. */
.single-vehicles-escada .single-vehicles-escada-list{grid-template-columns:repeat(2,minmax(0,1fr))}
.single-vehicles-escada .single-vehicles-escada-item{min-width:0;max-width:100%}
.single-vehicles-escada .single-vehicles-escada-item .single-vehicles-escada-link{box-sizing:border-box;max-width:100%;min-width:0}
.single-vehicles-escada .single-vehicles-escada-main{min-width:0;flex:1 1 auto}
.single-vehicles-escada .single-vehicles-escada-nome{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
.single-vehicles-escada .single-vehicles-escada-sub{overflow-wrap:anywhere}
.single-vehicles-escada .single-vehicles-escada-badge,.single-vehicles-escada .single-vehicles-escada-seta{flex-shrink:0}
@media (max-width:720px){
  .single-vehicles-escada .single-vehicles-escada-list{grid-template-columns:minmax(0,1fr)}
}
