/* ChamaQuem · Home V8 (2026-10-14)
   Somente apresentação visual. Não altera busca, filtros, rotas nem APIs.
   Usa as mesmas cores/variáveis de assets/site.css. */

/* ---------- Grade de prestadores: 4 / 2 / 1 ---------- */
#cards.grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media(max-width:1050px){#cards.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){#cards.grid{grid-template-columns:1fr}}

/* ---------- Card ---------- */
#cards .card{border-radius:16px}
#cards .card-body{padding:15px}
#cards .person h3{font-size:17px}
#cards .avatar{width:44px;height:44px;border-radius:12px}

/* Foto mais alta, foco no rosto/cabeça (topo da imagem preservado) */
#cards .cover{height:260px}
#cards .cover img{object-position:center 20%}
@media(max-width:700px){#cards .cover{height:300px}}

/* Fotos rotativas (somente as fotos do próprio prestador) */
#cards .cq-slides{position:absolute;inset:0}
#cards .cq-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;opacity:0;transition:opacity .6s ease}
#cards .cq-slides img.is-on{opacity:1}
#cards .cover .pill,#cards .cover .distance{z-index:3}
#cards .cq-dots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:5px;z-index:3;pointer-events:none}
#cards .cq-dots i{width:7px;height:7px;border-radius:50%;background:#ffffff8c;box-shadow:0 0 0 1px #0000001f}
#cards .cq-dots i.on{background:#fff}
@media(prefers-reduced-motion:reduce){#cards .cq-slides img{transition:none}}

/* Descrição: até ~2 linhas no card (perfil completo mostra tudo) */
#cards .description{
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;
  overflow:hidden;line-height:1.5;min-height:3em;flex:0 0 auto;margin:10px 0 12px
}
#cards .chips{max-height:58px;overflow:hidden;margin-bottom:12px}
#cards .card-actions{margin-top:auto}

/* ---------- Patrocinadores (carrossel) ---------- */
.cq-sponsors{padding-bottom:10px}
.cq-sponsor-viewport{overflow:hidden;position:relative}
.cq-sponsor-track{display:flex;gap:14px;transition:transform .45s ease;will-change:transform}
.cq-sponsor{
  flex:0 0 calc((100% - 42px)/4);min-width:0;background:#fff;border:1px solid var(--line);
  border-radius:14px;padding:16px;box-shadow:0 5px 18px rgba(0,0,0,.04);
  display:flex;flex-direction:column
}
.cq-sponsor .cq-badge{width:100%;height:72px;border-radius:12px;background:var(--pale,#eef8f6);display:grid;place-items:center;font-weight:900;font-size:22px;color:var(--teal-dark,#087d78);overflow:hidden}
.cq-sponsor .cq-badge img{width:100%;height:100%;object-fit:contain;padding:8px;background:#fff}
.cq-sponsor h3{margin:11px 0 4px;font-size:16px;color:var(--ink,#102c44)}
.cq-sponsor p{font-size:13px;color:var(--muted,#64788a);margin:0 0 12px;line-height:1.45;flex:1}
.cq-sponsor a,.cq-sponsor .cq-soon{font-size:13px;font-weight:800;color:var(--teal-dark,#087d78);text-decoration:none}
.cq-sponsor .cq-soon{color:var(--muted,#64788a)}
.cq-sponsor.is-empty{border-style:dashed;background:#fff;box-shadow:none}
.cq-sponsor.is-empty .cq-badge{background:#fff;border:1px dashed var(--line,#d6e3e8);color:var(--muted,#64788a)}
.cq-sponsor .cq-sponsor-desc{flex:0 0 auto;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
.cq-sponsor>a,.cq-sponsor>.cq-soon{margin-top:auto}
.cq-sponsor-arrows{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}
.cq-sponsor-arrows button{min-width:44px;min-height:40px;border:1px solid #b9ccd5;background:#fff;border-radius:9px;cursor:pointer;font:inherit;color:var(--ink,#102c44)}
.cq-sponsor-arrows button:focus-visible{outline:3px solid #0b736c;outline-offset:2px}
@media(max-width:1050px){.cq-sponsor{flex-basis:calc((100% - 14px)/2)}}
@media(max-width:700px){.cq-sponsor{flex-basis:100%}.cq-sponsor .cq-badge{height:88px}}
@media(prefers-reduced-motion:reduce){.cq-sponsor-track{transition:none}}

/* Foto real sem o anel decorativo por cima do rosto (o anel continua nos cards sem foto) */
#cards .cover:has(.cq-slides)::after{display:none}

/* Topo em uma linha no desktop, como no V8 (celular/tablet seguem o layout atual) */
@media(min-width:1280px){
  .top .links a{white-space:nowrap}
  .top .nav-buttons.cq-access{flex-wrap:nowrap}
  .top .nav-buttons.cq-access .btn{white-space:nowrap}
}