/* lz.css — o que a implementação acrescenta ao design da designer: o aviso do telefone, a
   armadilha para bots e o aviso de cookies. Mesmas cores e cantos "em pixel" do design. */

[hidden] { display: none !important; }

/* Armadilha para bots: fora do ecrã, mas não display:none (há bots que saltam esses). */
.lz-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Ecrãs muito estreitos (320 px): "SEGUIMENTO" (70 px) não cabia nos 56 px da caixa do percurso
   (texto mono sem quebra). Seletor mais específico porque o CSS do design vem depois deste ficheiro. */
@media (max-width: 359px) { .lz-steps .lz-step span { font-size: 9px; letter-spacing: 0; } }

/* Aviso do telefone (país que não bate certo com o número). Avisa, não bloqueia. */
.lz-warn { display: grid; grid-template-columns: 20px 1fr; gap: 8px; align-items: center; font-size: 14px; line-height: 1.3; color: #6b5cbc; }
.lz-warn b { font-family: var(--mono, 'Geist Mono', ui-monospace, monospace); font-weight: 500; background: #cac1ff; color: #2b16a0; width: 20px; height: 20px; display: grid; place-items: center; font-size: 12px; }
.has-photo .lz-f-tel .lz-warn { white-space: normal; }

/* ── Aviso de cookies ─────────────────────────────────────────────────────
   Por cima de tudo: nada vai para a Meta com cookies antes de a pessoa escolher.
   Aceitar e Recusar têm o mesmo tamanho e o mesmo peso. */
.ck { position: fixed; left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 200;
  max-width: 520px; margin: 0 auto; padding: 18px 20px; background: #ffffff; color: #2b16a0;
  border: 1px solid #6b5cbc; box-shadow: 0 0 0 4px rgba(43, 22, 160, .18);
  font-family: 'ALT Picaro', 'Iowan Old Style', Georgia, serif; font-size: 16px; line-height: 1.45; }
.ck__title { margin: 0 0 6px; font-family: 'Geist Mono', ui-monospace, Menlo, monospace; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: #6b5cbc; }
.ck__text { margin: 0; color: #2b16a0; }
.ck__text a { color: #2b16a0; text-decoration: underline; text-underline-offset: 2px; }
.ck__btns { display: flex; gap: 10px; margin-top: 14px; }
.ck__btn { --px: 3px; flex: 1 1 0; min-height: 46px; padding: 10px 16px; border: 0; cursor: pointer;
  font-family: 'ALT Picaro', 'Iowan Old Style', Georgia, serif; font-size: 17px; line-height: 1;
  clip-path: polygon(0 calc(var(--px)*3), var(--px) calc(var(--px)*3), var(--px) calc(var(--px)*2), calc(var(--px)*2) calc(var(--px)*2), calc(var(--px)*2) var(--px), calc(var(--px)*3) var(--px), calc(var(--px)*3) 0, calc(100% - var(--px)*3) 0, calc(100% - var(--px)*3) var(--px), calc(100% - var(--px)*2) var(--px), calc(100% - var(--px)*2) calc(var(--px)*2), calc(100% - var(--px)) calc(var(--px)*2), calc(100% - var(--px)) calc(var(--px)*3), 100% calc(var(--px)*3), 100% calc(100% - var(--px)*3), calc(100% - var(--px)) calc(100% - var(--px)*3), calc(100% - var(--px)) calc(100% - var(--px)*2), calc(100% - var(--px)*2) calc(100% - var(--px)*2), calc(100% - var(--px)*2) calc(100% - var(--px)), calc(100% - var(--px)*3) calc(100% - var(--px)), calc(100% - var(--px)*3) 100%, calc(var(--px)*3) 100%, calc(var(--px)*3) calc(100% - var(--px)), calc(var(--px)*2) calc(100% - var(--px)), calc(var(--px)*2) calc(100% - var(--px)*2), var(--px) calc(100% - var(--px)*2), var(--px) calc(100% - var(--px)*3), 0 calc(100% - var(--px)*3)); }
.ck__btn--ghost { background: #ececee; color: #2b16a0; }
.ck__btn--primary { background: #2b16a0; color: #ffffff; }
/* O clip-path corta o contorno por fora: o foco desenha-se por dentro. */
.ck__btn:focus-visible { outline: 2px solid #16c784; outline-offset: -6px; }
@media (max-width: 480px) {
  .ck { left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); padding: 14px 16px; font-size: 15px; }
  .ck__btns { margin-top: 12px; }
  .ck__btn { min-height: 44px; font-size: 16px; }
}