/* =====================================================================
   Páginas das unidades Velox (veloxsolucoes.com.br/<unidade>/).
   O visual é o da home do site: esta página carrega o mesmo home.css.
   Aqui ficam só as diferenças. Carregar por último.
   ===================================================================== */

/* Mensagem do formulário (no lugar do campo de texto que a home não tem) */
.apres-campo textarea{
  width:100%;border:1.5px solid #E1E8F2;border-radius:12px;
  padding:.85rem 1rem;font-family:inherit;font-size:.98rem;line-height:1.5;color:var(--navy);
  background:#F7FAFD;resize:vertical;min-height:5.5rem;
  transition:border-color .2s,background-color .2s;
}
.apres-campo textarea::placeholder{color:#6B7794}
.apres-campo textarea:focus{outline:none;border-color:var(--orange);background:#fff}

/* Confirmação depois do envio: o WhatsApp abriu em outra aba */
.form-ok{
  margin-top:.4rem;background:#EAF7F1;border:1px solid #BFE6D2;border-radius:16px;
  padding:1.4rem 1.5rem;
}
.form-ok:focus{outline:3px solid var(--orange);outline-offset:3px}
.form-ok h3{font-size:1.15rem;color:var(--navy);margin-bottom:.45rem}
.form-ok p{color:#33415E;font-size:.95rem;line-height:1.6}
.form-ok a{color:#0E4FC9;font-weight:700;text-decoration:underline;text-underline-offset:2px}

/* Rodapé: a unidade não tem foto própria, "Onde estamos" ocupa a linha */
.foot-onde.sem-foto{grid-template-columns:1fr}
.foot-onde-info .so-cidade{color:#C9D6F0}
.foot-identificacao .franqueadora{margin-top:.6rem}
.foot-identificacao .correspondente{margin-top:.6rem;color:#AFC2E8}

/* 404: o botão fica dentro do texto da política, que pinta todo link de
   azul e sublinha; aqui ele volta a ser o botão laranja da home */
.post-body a.btn{color:var(--navy-deep);text-decoration:none;font-weight:700}
.post-body a.btn:hover{color:var(--navy-deep)}
.post-body .acao-404{margin:1.8rem 0 .5rem}

/* Título do topo: o nome da cidade pode ser longo ("São Gonçalo do Amarante")
   e precisa quebrar linha. O risco da home é um ::after numa linha só; aqui
   ele vira fundo da própria palavra e se repete em cada linha quebrada. */
.hero h1 .risco{
  white-space:normal;overflow-wrap:break-word;
  background:linear-gradient(90deg,#F6871F,#FFB067) no-repeat 0 calc(100% - .02em) / 100% .12em;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
  animation:riscaFundo 1s cubic-bezier(.2,.7,.2,1) .9s both;
}
.hero h1 .risco::after{display:none}
@keyframes riscaFundo{from{background-size:0 .12em}to{background-size:100% .12em}}
@media (prefers-reduced-motion:reduce){
  .hero h1 .risco{animation:none}
}

/* Nome de cidade ou de unidade sem espaço ("Pindamonhangaba/SP") não pode
   alargar a coluna em tela de 320px: quebra dentro da palavra se precisar */
#fale-com-a-unidade .apres-texto,#fale-com-a-unidade .apres-card{min-width:0}
#fale-com-a-unidade h2,#fale-com-a-unidade h3,#fale-com-a-unidade p,.hero-selo{overflow-wrap:anywhere}