/* Bloco de links do anuncio v4 "premium" (task 17tjyy3gu2p, 05/10). Lapidacao do v3, MESMA estrutura e MESMO markup
   (inc/escada-links-v3.php + bloco do template ficam como estao; troca so este CSS).
   - grade de 8px; raio 12px; borda hairline + sombra de 1px
   - rotulo em coluna fixa (72px), caixa-alta com tracking .08em, cinza AA
   - nome peso 700 (era 800), sem reticencias: quebra em ate 2 linhas
   - pilula com numeros tabulares, largura minima fixa (todas alinham), fundo tingido em vez de contorno
   - seta discreta (pseudo-elemento ::after, sem markup novo)
   - 2 primeiros: tinta leve da marca + barra lateral de 3px (inset shadow, respeita o raio)
   - hover sutil, foco visivel 2px (WCAG 2.4.7/2.4.13), respeita prefers-reduced-motion
   - desktop >=1220: o bloco usa a largura toda do container (lado direito estava vazio) -> nomes inteiros */
.jm-esc3{padding-top:32px}
.jm-esc3-t{font-size:18px;line-height:24px;font-weight:800;letter-spacing:-.01em;color:var(--dark-3);margin:0 0 4px}
.jm-esc3-h{font-size:13px;line-height:20px;font-weight:500;color:var(--gray-6);margin:0 0 16px}
.jm-esc3-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.jm-esc3-l li{list-style:none;min-width:0;display:flex}
.jm-esc3-l li:last-child:nth-child(odd){grid-column:auto}
.jm-esc3 .jm-esc3-l .jm-esc3-a{
  position:relative;flex:1;min-width:0;
  display:grid;grid-template-columns:72px minmax(0,1fr) auto 8px;align-items:center;column-gap:12px;
  min-height:56px;padding:8px 16px;border-radius:12px;
  background:#fff;border:1px solid rgba(13,13,13,.08);
  box-shadow:0 1px 2px rgba(13,13,13,.04);
  color:var(--dark-3);text-decoration:none;
  -webkit-tap-highlight-color:transparent;
  transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}
.jm-esc3 .jm-esc3-l .jm-esc3-a::after{
  content:"\203A";font-size:22px;line-height:1;font-weight:500;color:#767676;
  justify-self:end;transform:translateY(-1px);transition:transform .2s ease,color .2s ease}
.jm-esc3-k{font-size:11px;line-height:16px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--gray-6);white-space:nowrap}
.jm-esc3-n{font-size:15px;line-height:20px;font-weight:700;letter-spacing:-.005em;min-width:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.jm-esc3-b{min-width:40px;height:24px;padding:0 8px;border-radius:999px;
  font-size:12px;line-height:24px;font-weight:800;text-align:center;
  font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1;
  color:var(--red-1);background:rgba(148,0,2,.07);
  transition:background-color .2s ease,color .2s ease}
/* 2 primeiros (TODOS / MODELO): tinta + barra fina, sem pesar */
.jm-esc3 .jm-esc3-l .jm-esc3-d{background:#FFF8F8;border-color:rgba(148,0,2,.16);box-shadow:inset 3px 0 0 var(--red-1),0 1px 2px rgba(148,0,2,.06)}
.jm-esc3-d .jm-esc3-k{color:var(--red-1)}
.jm-esc3-d .jm-esc3-b{background:rgba(148,0,2,.11)}
/* hover (so em ponteiro fino, nao gruda no toque) */
@media (hover:hover){
  .jm-esc3 .jm-esc3-l .jm-esc3-a:hover{border-color:rgba(13,13,13,.18);box-shadow:0 4px 12px rgba(13,13,13,.06),0 1px 2px rgba(13,13,13,.04);text-decoration:none}
  .jm-esc3 .jm-esc3-l .jm-esc3-d:hover{border-color:rgba(148,0,2,.32);box-shadow:inset 3px 0 0 var(--red-1),0 4px 12px rgba(148,0,2,.08)}
  .jm-esc3-a:hover .jm-esc3-b{background:var(--red-1);color:#fff}
  .jm-esc3 .jm-esc3-l .jm-esc3-a:hover::after{color:var(--red-1);transform:translate(2px,-1px)}
}
/* toque/pressionado */
.jm-esc3 .jm-esc3-l .jm-esc3-a:active{background:#F9F9F9}
.jm-esc3 .jm-esc3-l .jm-esc3-d:active{background:#FFF0F0}
/* foco de teclado: anel 2px vermelho JM (contraste 8:1 sobre o fundo #F6F6F6) */
.jm-esc3 .jm-esc3-l .jm-esc3-a:focus{outline:none}
.jm-esc3 .jm-esc3-l .jm-esc3-a:focus-visible{outline:2px solid var(--red-1);outline-offset:2px;text-decoration:none}
.jm-esc3-a:focus-visible .jm-esc3-b{background:var(--red-1);color:#fff}
.jm-esc3 .jm-esc3-l .jm-esc3-a:focus-visible::after{color:var(--red-1)}
@media (prefers-reduced-motion:reduce){
  .jm-esc3 .jm-esc3-l .jm-esc3-a,.jm-esc3 .jm-esc3-l .jm-esc3-a::after,.jm-esc3-b{transition:none}
  .jm-esc3 .jm-esc3-l .jm-esc3-a:hover::after{transform:translateY(-1px)}
}
/* desktop largo: o bloco ocupa a largura toda do container (antes ficava preso na metade esquerda e cortava os nomes) */
@media (min-width:1220px){
  .jm-esc3 .grid-xl-6{width:100%}
  .jm-esc3-l{column-gap:16px}
}
/* celular: 1 coluna, alvo de toque >= 56px (minimo exigido 48) */
@media (max-width:700px){
  .jm-esc3{padding-top:24px}
  .jm-esc3-l{grid-template-columns:1fr}
  .jm-esc3-t{font-size:17px;line-height:24px}
  .jm-esc3 .jm-esc3-l .jm-esc3-a{grid-template-columns:60px minmax(0,1fr) auto 8px;column-gap:10px;padding:7px 12px 7px 14px}
  .jm-esc3-k{font-size:10.5px;letter-spacing:.06em}
  .jm-esc3-n{font-size:14.5px;line-height:20px;-webkit-line-clamp:3}
}