/* TWJ Climatização — doca fixa no rodapé da tela com ticker vertical (home, LPs e páginas legais).
   A doca contém o ticker e, nas LPs no celular, a barra verde de WhatsApp. --dock-h é medido por lp/ticker.js.
   Interação: PC, passar o mouse mostra a camada "Fale conosco" e pausa o ticker (ao sair, retoma do mesmo ponto).
   Celular: 1º toque mostra "Clique aqui para falar conosco" (classe .is-cta, via ticker.js); 2º toque abre o WhatsApp. */
:root{--ticker-h:38px;--dock-h:var(--ticker-h)}
body{padding-bottom:var(--dock-h)}
body .wa-float{bottom:calc(var(--dock-h) + 16px)}

.bottom-dock{position:fixed;left:0;right:0;bottom:0;z-index:58}

.ticker{position:relative;height:var(--ticker-h);display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:rgba(7,58,79,.97);color:#fff;border-top:1px solid rgba(255,255,255,.08);cursor:pointer;
  font:600 .86rem/1 var(--font-body,"Inter",system-ui,sans-serif);letter-spacing:.02em;-webkit-tap-highlight-color:transparent}
@supports (backdrop-filter:blur(6px)){.ticker{background:rgba(7,58,79,.9);backdrop-filter:blur(6px)}}
.ticker__window{height:var(--ticker-h);overflow:hidden}
.ticker__list{list-style:none;margin:0;padding:0;animation:twj-ticker 20s infinite;animation-timing-function:cubic-bezier(.65,0,.35,1)}
.ticker__list li{height:var(--ticker-h);display:flex;align-items:center;justify-content:center;gap:9px;white-space:nowrap}
.ticker__list li::before{content:"";flex-shrink:0;width:6px;height:6px;border-radius:50%;background:var(--clr-accent,#25D366)}
.ticker__list .ticker__brand::before,.ticker__list .ticker__cta::before{display:none}
.ticker__brand span{color:#7dd3fc}
.ticker__list .ticker__cta{gap:7px;color:#4ade80}
.ticker svg{width:16px;height:16px;flex-shrink:0}

/* Camada "Fale conosco": fica escondida abaixo da barra e sobe por cima do ticker */
.ticker__focus{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:#073a4f;transform:translateY(101%);transition:transform .35s cubic-bezier(.65,0,.35,1)}
.ticker__link{display:inline-flex;align-items:center;gap:7px;color:#4ade80;text-decoration:none;border-bottom:1px solid transparent;white-space:nowrap}
.ticker__link:hover{border-bottom-color:currentColor}
.ticker__link:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:2px}
.ticker__link-touch{display:none}

/* PC (mouse): passar o mouse mostra a camada e pausa o ticker, que retoma do mesmo ponto ao sair */
@media (hover:hover){
  .ticker:hover .ticker__list{animation-play-state:paused}
  .ticker:hover .ticker__focus{transform:none}
}
/* Teclado (só foco por teclado, não por clique/toque): o link da camada recebe o foco e fica visível */
.ticker:has(.ticker__link:focus-visible) .ticker__list{animation-play-state:paused}
.ticker:has(.ticker__link:focus-visible) .ticker__focus{transform:none}

/* Celular (toque): confirmação em formato de botão */
@media (hover:none){
  .ticker__link-pc{display:none}
  .ticker__link-touch{display:inline}
  .ticker__link{padding:6px 14px;border:0;border-radius:999px;background:var(--clr-accent,#25D366);color:#fff;font-size:.84rem}
  .ticker.is-cta .ticker__list{animation-play-state:paused}
  .ticker.is-cta .ticker__focus{transform:none}
}

/* 7 itens + cópia do 1º (loop sem salto). Itens 1–6: 1,7 s parado + 0,5 s deslizando. "Fale conosco": 6,3 s parado. */
@keyframes twj-ticker{
  0%,8.5%{transform:translateY(0)}
  11%,19.5%{transform:translateY(calc(var(--ticker-h) * -1))}
  22%,30.5%{transform:translateY(calc(var(--ticker-h) * -2))}
  33%,41.5%{transform:translateY(calc(var(--ticker-h) * -3))}
  44%,52.5%{transform:translateY(calc(var(--ticker-h) * -4))}
  55%,63.5%{transform:translateY(calc(var(--ticker-h) * -5))}
  66%,97.5%{transform:translateY(calc(var(--ticker-h) * -6))}
  100%{transform:translateY(calc(var(--ticker-h) * -7))}
}

/* Quem desativa animações no sistema vê o "Fale conosco" parado; a camada aparece sem deslizar */
@media (prefers-reduced-motion:reduce){
  .ticker__list{animation:none;transform:translateY(calc(var(--ticker-h) * -6))}
  .ticker__focus{transition:none}
}
