/* Central de Montagens — home.css | o que é exclusivo da Home
   O visual comum (cabeçalho, rodapé, seções) fica em comum.css, ligado antes deste arquivo. */

/* ---------- S15. Mapa da região (Google Maps, não é foto) ----------
   Círculo verde por cima marcando a área atendida; ele não bloqueia o mapa (dá para arrastar e dar zoom). */
.mapa { position: relative; aspect-ratio: 4 / 3; border-radius: var(--cm-radius-lg); overflow: hidden; background: #DCE1E7; border: 1px solid var(--cm-border); }
.mapa iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.mapa__circulo { position: absolute; left: 50%; top: 50%; width: 52%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; background: rgba(7,50,40,.12); border: 2px solid var(--cm-green-700); pointer-events: none; }
.mapa__selo { position: absolute; left: var(--cm-space-3); bottom: var(--cm-space-3); padding: 6px 10px; border-radius: var(--cm-radius-xs); background: var(--cm-green-700); color: #fff; font-family: var(--cm-font-display); font-weight: var(--cm-weight-semibold); font-size: var(--cm-text-xs); line-height: 1.2; pointer-events: none; }
@media (min-width: 768px) { .mapa { aspect-ratio: 16 / 9; } .mapa__circulo { width: 40%; } }

/* ---------- S4.2 Para empresas: um cartão largo só ----------
   No celular ocupa a largura toda (sem arrastar); no computador, foto à esquerda e texto à direita. */
.servicos__cartoes--um { grid-auto-columns: 100%; overflow: visible; }
@media (min-width: 768px) {
  .servicos__cartoes--um { grid-template-columns: 1fr; }
  .cartao-servico--largo { display: grid; grid-template-columns: 1fr 1fr; }
  .cartao-servico--largo .cartao-servico__foto { aspect-ratio: auto; min-height: 320px; height: 100%; }
  .cartao-servico--largo .cartao-servico__corpo { justify-content: center; padding: var(--cm-space-12); }
  .cartao-servico--largo p { font-size: var(--cm-text-body-lg); line-height: 24px; max-width: 46ch; }
  .cartao-servico--largo .cartao-servico__acoes { justify-content: flex-start; margin-top: 0; padding-top: var(--cm-space-8); }
  .cartao-servico--largo .cartao-servico__acoes .botao { flex: 0 0 auto; }
}