/* Aviso de preço fixo e Lia no canto, copiados da home pra todas as páginas internas. 09/10/2026 */
@property --giro{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes giro{to{--giro:360deg}}
/* aviso de preço fixo embaixo, aparece quando o topo sai da tela. Vidro escuro, borda de luz girando */
.preco-fixo{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 24px);z-index:39;isolation:isolate;display:inline-flex;align-items:center;gap:18px;
  padding:12px 12px 12px 14px;border-radius:22px;color:rgba(255,255,255,.85);
  background:linear-gradient(180deg,rgba(26,30,26,.88),rgba(10,11,10,.92));-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 24px 60px -20px rgba(0,0,0,.7),0 0 50px -18px rgba(83,255,93,.55);
  opacity:0;transform:translate(-50%,28px) scale(.96);pointer-events:none;transition:opacity .35s ease,transform .7s var(--mola)}
.preco-fixo::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1px;
  background:conic-gradient(from var(--giro,0deg),rgba(83,255,93,.12),rgba(83,255,93,.85),rgba(255,255,255,.55),rgba(83,255,93,.12) 55%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:giro 6s linear infinite}
.preco-fixo.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.pf-ic img{display:block;width:34px;height:34px;border-radius:10px}
.pf-txt{display:grid;gap:2px;line-height:1}
.pf-txt small{white-space:nowrap;font-size:11.5px;font-weight:500;letter-spacing:.04em;color:var(--cinza-escuro)}
.pf-txt b{font-size:22px;font-weight:700;letter-spacing:-.03em;color:var(--branco)}
.pf-txt em{font-style:normal;font-size:13px;font-weight:500;letter-spacing:0;color:var(--cinza-escuro);margin-left:2px}
.pf-div{width:1px;height:30px;background:rgba(255,255,255,.12)}
.pf-teste{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--branco);white-space:nowrap}
.pf-btn{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 16px 0 18px;border-radius:14px;background:var(--neon);color:var(--tinta);font-size:14px;font-weight:700;white-space:nowrap;transition:transform .45s var(--mola)}
.pf-btn svg{width:18px;height:18px;transition:transform .45s var(--mola)}
.preco-fixo:hover .pf-btn svg{transform:translateX(3px)}
.preco-fixo:active .pf-btn{transform:scale(.97)}
@media (max-width:640px){
  .preco-fixo{left:12px;right:12px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);gap:12px;padding:10px 10px 10px 12px;border-radius:18px;transform:translateY(28px) scale(.96)}
  .preco-fixo.on{transform:none}
  .pf-div,.pf-teste{display:none}
  .pf-ic img{width:30px;height:30px}
  .pf-txt b{font-size:18px}
  .pf-btn{margin-left:auto;min-height:38px;padding:0 12px;font-size:13px}
  .atende{transition:opacity .35s ease,transform .7s cubic-bezier(.34,1.56,.64,1),bottom .5s var(--mola)}
  .pf-on .atende{bottom:calc(env(safe-area-inset-bottom,0px) + 96px)}
}
/* botão da Lia, molde da skill botao-atendente */
:root{--atende-cor:#53FF5D;--atende-tinta:#0A0B0A;--atende-sombra:rgba(83,255,93,.6)}
.atende{position:fixed;right:20px;bottom:calc(env(safe-area-inset-bottom,0px) + 20px);z-index:40;display:flex;align-items:center;gap:10px;opacity:0;transform:translateY(26px) scale(.72);pointer-events:none;transform-origin:right bottom;transition:opacity .35s ease,transform .7s cubic-bezier(.34,1.56,.64,1)}
.atende.on{opacity:1;transform:none;pointer-events:auto}
.atende:hover .atende-foto{transform:scale(1.04)}
.atende:active .atende-foto{transform:scale(.96)}
.atende-balao{position:relative;display:flex;align-items:center;min-height:36px;padding:10px 15px;border-radius:14px 6px 14px 14px;background:#fff;color:var(--atende-tinta);font-size:14px;font-weight:500;line-height:1;letter-spacing:-.01em;white-space:nowrap;box-shadow:0 14px 34px -16px rgba(0,0,0,.7),0 0 0 1px rgba(31,35,40,.06);opacity:0;transform:translateX(10px) scale(.9);transform-origin:right center;transition:opacity .25s ease,transform .55s cubic-bezier(.34,1.56,.64,1)}
.atende-balao.aberto{opacity:1;transform:none}
.atende-balao::after{content:"";position:absolute;top:6px;right:-3px;width:8px;height:8px;border-radius:1.5px;background:#fff;transform:rotate(45deg)}
.atende-balao .pontos{display:flex;gap:4px;padding:1px 0}
.atende-balao .pontos i{width:5px;height:5px;border-radius:50%;background:var(--atende-tinta);opacity:.4;animation:digita .95s ease-in-out infinite}
.atende-balao .pontos i:nth-child(2){animation-delay:.16s}.atende-balao .pontos i:nth-child(3){animation-delay:.32s}
@keyframes digita{50%{transform:translateY(-3.5px);opacity:.9}}
.atende-balao .frase{display:none}
.atende-balao.escreveu .pontos{display:none}
.atende-balao.escreveu .frase{display:inline;animation:frase .3s ease both}
@keyframes frase{from{opacity:0}}
.atende-foto{position:relative;display:block;flex:none;border-radius:50%;padding:2.5px;background:var(--atende-cor);box-shadow:0 16px 38px -16px var(--atende-sombra),0 2px 10px -4px rgba(0,0,0,.6);transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.atende-foto .rosto{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;object-fit:cover;background:var(--tinta);color:var(--neon);font-size:20px;font-weight:700}
.atende-foto .anel{position:absolute;inset:0;border-radius:50%;border:2px solid var(--atende-cor);opacity:0;pointer-events:none}
.atende.on .atende-foto .anel{animation:anel 1.1s .18s ease-out 1 both}
@keyframes anel{from{transform:scale(1);opacity:.85}to{transform:scale(1.75);opacity:0}}
.atende-foto .estado{position:absolute;right:1px;bottom:1px;width:14px;height:14px;border-radius:50%;background:var(--atende-tinta)}
.atende-foto .estado b{position:absolute;inset:3px;border-radius:50%;background:#34D17A;animation:estado 2.4s ease-in-out infinite}
@keyframes estado{50%{transform:scale(1.35);opacity:.55}}
@media (max-width:1180px){
  .atende{right:14px;bottom:calc(env(safe-area-inset-bottom,0px) + 14px)}
  .atende-foto .rosto{width:48px;height:48px}
  .atende-balao{font-size:13.5px}
}
@media (max-width:640px){
  .atende-foto .rosto{width:44px;height:44px}
  .atende-balao{max-width:200px}
  .pf-on .atende-balao{display:none}
}
@media (prefers-reduced-motion:reduce){.preco-fixo::before{animation:none}.atende-balao .pontos i,.atende-foto .estado b{animation:none}}
.pf-teste .st-ponto{width:8px;height:8px;border-radius:50%;background:#53FF5D;box-shadow:0 0 8px #53FF5D}
