/* Landing do LunaChat — sistema Órbita, versão escura.
   Pedido do Cauã (2026-09-15): «toda animada e perfeita», identidade própria, estrutura de secções como a da iumy.
   Movimento com um só critério: explica ou dá vida sem distrair; tudo parado e visível em prefers-reduced-motion.
   Tokens em ../comum/orbita.css; aqui só composição e movimento. */

:root { --lp-curva: cubic-bezier(.16, 1, .3, 1); --lp-topo-h: 64px; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--lp-topo-h) + 24px + env(safe-area-inset-top, 0px)); }
body.lp { margin: 0; overflow-x: hidden; }
.lp a { color: inherit; }
.lp a.o-botao { color: var(--o-acento-tinta); }
.lp a.o-botao--secundario { color: var(--o-tinta); }
.lp-defs { position: absolute; }
.lp-caixa { width: 100%; max-width: 1180px; margin-inline: auto; padding-inline: clamp(16px, 4vw, 32px); box-sizing: border-box; }
.lp-invisivel { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.lp-pular { position: absolute; left: 16px; top: -60px; z-index: 50; background: var(--o-acento); color: var(--o-acento-tinta); padding: 10px 14px; border-radius: 10px; text-decoration: none; font-weight: 700; }
.lp-pular:focus { top: calc(12px + env(safe-area-inset-top, 0px)); }

/* ── tipografia da landing ──────────────────────────────────────────── */
.lp-titulo-2 { font: 600 clamp(28px, 3.6vw, 44px)/1.1 var(--o-display); letter-spacing: -.02em; margin: 10px 0 0; text-wrap: balance; }
.lp-titulo-2 span { display: inline; }
.lp-acento { color: var(--o-acento); }
.lp-texto { font-size: 17px; line-height: 1.65; color: var(--o-tinta-2); max-width: 60ch; margin: 16px 0 0; }
.lp-texto a { color: var(--o-acento); display: inline-block; padding-block: 4px; }
.lp-miudo { font-size: 13px; color: var(--o-tinta-2); margin: 12px 0 0; }
.lp-link { font-weight: 600; font-size: 14px; text-decoration: none; padding: 8px 10px; border-radius: 8px; }
.lp-link:hover { background: var(--o-superficie-2); }

.lp-lista-check { list-style: none; padding: 0; margin: 22px 0 0; display: grid; gap: 12px; }
.lp-lista-check li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; line-height: 1.5; }
.lp-lista-check li::before { content: ""; width: 20px; height: 20px; border-radius: 50%; margin-top: 2px; background: var(--o-acento-suave) no-repeat center / 12px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 5 8.5 9.5 3.5' fill='none' stroke='%238C9BFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }

.lp-acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.lp-acoes--centro { justify-content: center; }
.lp-botao-grande { min-height: 50px; padding: 0 22px; font-size: 15px; border-radius: 12px; }
.lp .o-botao:not(.o-botao--secundario) { box-shadow: 0 8px 28px rgba(140, 155, 255, .28); }
.lp .o-botao:hover { transform: translateY(-1px); }

/* ── topo flutuante ─────────────────────────────────────────────────── */
.lp-topo { position: fixed; inset: 0 0 auto; z-index: 40; padding: calc(12px + env(safe-area-inset-top, 0px)) clamp(12px, 3vw, 24px) 0; pointer-events: none; }
.lp-topo__barra { pointer-events: auto; max-width: 1180px; margin-inline: auto; display: flex; align-items: center; gap: 16px; min-height: var(--lp-topo-h); padding: 0 10px 0 18px; border-radius: 18px; border: 1px solid rgba(220, 225, 238, .10); background: rgba(12, 18, 48, .55); backdrop-filter: blur(16px) saturate(1.2); -webkit-backdrop-filter: blur(16px) saturate(1.2); transition: background-color .3s ease, box-shadow .3s ease, border-color .3s ease; }
.lp-topo.lp-topo--rolado .lp-topo__barra { background: rgba(12, 18, 48, .88); border-color: rgba(220, 225, 238, .16); box-shadow: 0 12px 40px rgba(0, 0, 0, .35); }
.lp-topo__marca { font-size: 16px; }
.lp-topo__nav { display: flex; gap: 2px; margin-inline: auto; }
.lp-topo__nav a { font-size: 14px; font-weight: 600; color: var(--o-tinta-2); text-decoration: none; padding: 8px 12px; border-radius: 10px; }
.lp-topo__nav a:hover { color: var(--o-tinta); background: rgba(220, 225, 238, .06); }
.lp-topo__acoes { display: flex; align-items: center; gap: 6px; }

/* ── hero ───────────────────────────────────────────────────────────── */
.lp-hero { position: relative; isolation: isolate; padding-top: calc(var(--lp-topo-h) + 44px + env(safe-area-inset-top, 0px)); overflow: hidden; }
.lp-hero__texto { text-align: left; display: grid; justify-items: start; }
.lp-selo { display: inline-flex; align-items: center; gap: 10px; margin: 0; padding: 7px 14px 7px 10px; border-radius: 999px; border: 1px solid var(--o-linha); background: rgba(20, 27, 66, .6); font-size: 13px; font-weight: 600; color: var(--o-tinta-2); }
.lp-selo__ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--o-halo); box-shadow: 0 0 0 4px rgba(255, 227, 163, .15); animation: lp-pulso 2.6s ease-in-out infinite; }
.lp-hero__titulo { font: 600 clamp(36px, 4.3vw, 58px)/1.04 var(--o-display); letter-spacing: -.03em; margin: 20px 0 0; max-width: 17ch; text-wrap: balance; }
.lp-hero__titulo em { font-style: normal; color: var(--o-acento); }
.lp-hero__sub { font-size: clamp(16px, 1.6vw, 19px); line-height: 1.6; color: var(--o-tinta-2); max-width: 58ch; margin: 22px 0 0; }
.lp-hero .lp-acoes { justify-content: flex-start; }
.lp-hero__palco { position: relative; margin-top: 76px; }  /* espaço para os cartões a cavalo no topo não tocarem o texto */

.lp-brilho { position: absolute; left: 50%; top: 8%; width: min(900px, 90vw); height: 420px; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(closest-side, rgba(140, 155, 255, .42), rgba(140, 155, 255, .12) 55%, transparent 75%); filter: blur(20px); animation: lp-respira 7s ease-in-out infinite alternate; pointer-events: none; }

.lp-janela { position: relative; margin: 0; border-radius: 18px; border: 1px solid rgba(220, 225, 238, .14); background: #0A0F2A; box-shadow: 0 40px 120px rgba(0, 0, 0, .55), 0 0 0 1px rgba(140, 155, 255, .06) inset; overflow: hidden; }

.lp-janela__barra { display: flex; align-items: center; gap: 7px; height: 40px; padding: 0 14px; background: #10163A; border-bottom: 1px solid rgba(220, 225, 238, .08); }
.lp-janela__barra i { width: 10px; height: 10px; border-radius: 50%; background: #2B3468; }
.lp-janela__barra span { margin-left: 12px; font: 12px/1 var(--o-mono); color: var(--o-tinta-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp-janela__corpo { display: grid; grid-template-columns: 200px minmax(0, 1fr); min-height: 380px; font-size: 13px; }

.lp-mini-lateral { background: var(--o-superficie); border-right: 1px solid var(--o-linha); padding: 18px 12px; display: flex; flex-direction: column; gap: 4px; }
.lp-mini-marca { font-size: 14px; margin: 0 6px 14px; }
.lp-mini-nav { display: flex; justify-content: space-between; padding: 8px 10px; border-radius: 9px; color: var(--o-tinta-2); font-weight: 600; }
.lp-mini-nav b { font: 500 11px/1 var(--o-mono); background: var(--o-acento-suave); color: var(--o-tinta); padding: 3px 6px; border-radius: 999px; }
.lp-mini-nav--ativo { background: var(--o-nav-ativo); color: var(--o-nav-ativo-tinta); }
.lp-mini-trabalho { padding: 22px; display: grid; gap: 14px; align-content: start; min-width: 0; }
.lp-mini-cabeca b { display: block; font: 600 20px/1.1 var(--o-display); }
.lp-mini-cabeca span { color: var(--o-tinta-2); font-size: 12.5px; }
.lp-mini-contadores { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.lp-mini-contadores .o-cartao { padding: 14px; }
.lp-mini-contadores .o-contador b { font-size: 26px; }
.lp-mini-tabela { padding: 4px 14px; }
.lp-mini-linha { display: grid; grid-template-columns: 70px minmax(0, 1fr) 110px; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--o-linha); }
.lp-mini-linha:last-child { border-bottom: 0; }
.lp-mini-linha > span:last-child { color: var(--o-tinta-2); text-align: right; }
.lp-mini-linha .o-selo { justify-self: start; }

/* ── primeiro ecrã «UAU» (pedido do Cauã, 2026-09-15 19:03) ─────────────
   Céu de estrelas, feixe diagonal que se move devagar, luz que segue o rato, globo com pacotes a chegar
   aos destinos, cartões de evento a flutuar e o painel em perspectiva que se endireita ao rolar.
   Só transform/opacity animam; canvas pára fora do ecrã e em prefers-reduced-motion. */
.lp-estrelas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -3; pointer-events: none; }
.lp-feixe { position: absolute; z-index: -2; top: -40%; left: -25%; width: 75%; height: 170%; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(140, 155, 255, .20) 38%, rgba(255, 227, 163, .10) 56%, transparent 80%);
  filter: blur(46px); transform: rotate(24deg) translateX(-8%); animation: lp-feixe 18s ease-in-out infinite alternate; }
.lp-luz { position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(620px circle at var(--mx, 72%) var(--my, 28%), rgba(140, 155, 255, .16), transparent 62%); }
.lp-hero__grelha { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.lp-globo { position: relative; width: 100%; max-width: 540px; aspect-ratio: 1; justify-self: center; }
.lp-globo canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.lp-globo__rotulo { position: absolute; left: var(--x); top: var(--y); transform: translate(12px, -130%); display: inline-flex; gap: 7px; align-items: center; padding: 5px 11px; border-radius: 999px; white-space: nowrap;
  background: rgba(20, 27, 66, .74); border: 1px solid var(--o-linha); color: var(--o-tinta-2); font-size: 12px; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  transition: color .35s ease, border-color .35s ease, box-shadow .35s ease, transform .5s var(--lp-curva); }
.lp-globo__rotulo b { color: var(--o-tinta); font-weight: 700; }
.lp-globo__rotulo--aceso { color: var(--o-halo); border-color: rgba(255, 227, 163, .6); box-shadow: 0 0 26px rgba(255, 227, 163, .28); transform: translate(12px, -155%); }
.lp-globo__rotulo--esq { transform: translate(calc(-100% - 12px), -130%); }
.lp-globo__rotulo--esq.lp-globo__rotulo--aceso { transform: translate(calc(-100% - 12px), -155%); }
.lp-globo__rotulo--baixo { transform: translate(12px, 40%); }
.lp-globo__rotulo--baixo.lp-globo__rotulo--aceso { transform: translate(12px, 60%); }
.lp-inclina { position: relative; z-index: 1; perspective: 1800px; animation: lp-sobe-janela 1.2s var(--lp-curva) .2s both; }
.lp-inclina > .lp-janela { transform: rotateX(var(--lp-incl, 20deg)) scale(var(--lp-esc, .92)); transform-origin: 50% 0%; will-change: transform; }
.lp-flutua { position: absolute; z-index: 3; display: grid; gap: 6px; width: 208px; padding: 12px 14px; border-radius: 16px; translate: 0 var(--lp-par, 0px);
  background: rgba(20, 27, 66, .84); border: 1px solid var(--o-linha-forte); box-shadow: 0 22px 54px rgba(0, 0, 0, .45); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  animation: lp-flutuar 6s ease-in-out infinite alternate; }
.lp-flutua .o-selo { justify-self: start; }
.lp-flutua b { font-size: 14px; font-weight: 600; line-height: 1.35; }
.lp-flutua small { font: 11.5px/1 var(--o-mono); color: var(--o-tinta-2); }
/* cartões nas bordas do painel, fora dos dados: dois a cavalo no topo (sobre a barra do navegador),
   um a cavalo no fundo à esquerda (sobre o vazio da lateral). Nunca encostam ao ecrã (gutter da .lp-caixa + 16px). */
.lp-flutua--a { left: 16px; top: -58px; }
.lp-flutua--b { right: 16px; top: -34px; animation-delay: -2s; }
.lp-flutua--c { left: 16px; bottom: -34px; animation-delay: -4s; }
.lp-palavra { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  .lp-js:not(.lp-pronto) .lp-hero__titulo { opacity: 0; animation: lp-seguro .01s 1.2s forwards; }
  .lp-pronto .lp-hero__titulo .lp-palavra { animation: lp-palavra .8s var(--lp-curva) both; animation-delay: calc(var(--i) * 70ms + 120ms); }
  /* resto da página: a entrada acompanha a rolagem (onde o navegador sabe), não só um fade */
  @supports (animation-timeline: view()) {
    .lp-cartao, .lp-plano, .lp-chat, .lp-janela--loja, .lp-traducao, .lp-caminho, .lp-orbita-grande, .lp-chamada__caixa { animation: lp-entra-vista linear both; animation-timeline: view(); animation-range: entry 0% cover 26%; }
  }
}
@keyframes lp-seguro { to { opacity: 1; } }
@keyframes lp-palavra { from { opacity: 0; transform: translateY(.45em); filter: blur(8px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes lp-feixe { from { transform: rotate(24deg) translateX(-12%); opacity: .75; } to { transform: rotate(24deg) translateX(42%); opacity: 1; } }
@keyframes lp-flutuar { from { transform: translateY(-9px); } to { transform: translateY(9px); } }
@keyframes lp-entra-vista { from { opacity: 0; transform: translateY(56px) scale(.95); } to { opacity: 1; transform: none; } }

/* ── faixa em loop ──────────────────────────────────────────────────── */
.lp-faixa { margin-top: 72px; border-block: 1px solid var(--o-linha); background: rgba(20, 27, 66, .45); overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.lp-faixa__trilho { display: flex; width: max-content; animation: lp-desliza 42s linear infinite; }
.lp-faixa__lista { display: flex; list-style: none; margin: 0; padding: 0; }
.lp-faixa__lista li { display: flex; align-items: center; gap: 22px; padding: 20px 22px 20px 0; font: 500 15px/1 var(--o-display); white-space: nowrap; color: var(--o-tinta); }
.lp-faixa__lista li::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--o-acento); }

/* ── secções ────────────────────────────────────────────────────────── */
.lp-secao { position: relative; padding-block: clamp(80px, 11vw, 140px); }
.lp-cabeca { max-width: 760px; margin-bottom: 48px; }
.lp-cabeca--centro { margin-inline: auto; text-align: center; }
.lp-cabeca--centro .lp-texto { margin-inline: auto; }

/* dois tempos */
.lp-dois-tempos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); gap: clamp(32px, 6vw, 80px); align-items: center; }
.lp-dois-tempos .lp-titulo-2 span { display: block; }
.lp-chat { background: var(--o-superficie); border: 1px solid var(--o-linha); border-radius: 22px; padding: 22px; display: grid; gap: 14px; box-shadow: var(--o-sombra-alta); }
.lp-chat__cabeca { display: flex; align-items: center; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--o-linha); }
.lp-chat__cabeca b { display: block; font-size: 15px; }
.lp-chat__cabeca span { font-size: 12.5px; color: var(--o-tinta-2); }
.lp-chat__av { width: 38px; height: 38px; border-radius: 50%; background: var(--o-superficie-2); display: grid; place-items: center; }
.lp-chat__av svg { width: 28px; height: 28px; }
.lp-balao { margin: 0; padding: 12px 14px; font-size: 14.5px; line-height: 1.55; max-width: 88%; }
.lp-balao--cliente { justify-self: end; background: var(--o-acento); color: var(--o-acento-tinta); border-radius: 16px 16px 4px 16px; }
.lp-balao--luna { background: var(--o-superficie-2); border-radius: 4px 16px 16px 16px; }
.lp-chat__nota { display: flex; justify-content: space-between; align-items: center; margin: 0; font-size: 12px; color: var(--o-tinta-2); }

/* caminho do pedido: cada passo acende em sequência */
.lp-caminho { list-style: none; margin: clamp(56px, 8vw, 96px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; position: relative; }
.lp-caminho::before { content: ""; position: absolute; left: 12px; right: 12px; top: 11px; height: 2px; background: linear-gradient(90deg, var(--o-acento), var(--o-trilho)); opacity: .5; }
.lp-caminho li { position: relative; display: grid; gap: 8px; padding-top: 38px; }
.lp-caminho b { font: 600 16px/1.3 var(--o-display); }
.lp-caminho li > span:last-child { color: var(--o-tinta-2); font-size: 14.5px; line-height: 1.55; }
.lp-caminho__ponto { position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%; background: var(--o-fundo); border: 2px solid var(--o-trilho); animation: lp-acende 8s ease-in-out infinite; }
.lp-caminho__ponto::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: var(--o-acento); opacity: .75; }
.lp-caminho li:nth-child(2) .lp-caminho__ponto { animation-delay: 2s; }
.lp-caminho li:nth-child(3) .lp-caminho__ponto { animation-delay: 4s; }
.lp-caminho li:nth-child(4) .lp-caminho__ponto { animation-delay: 6s; }

/* cartões */
.lp-grelha-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.lp-cartao { background: var(--o-superficie); border: 1px solid var(--o-linha); border-radius: 20px; padding: 24px; transition: translate .35s var(--lp-curva), border-color .35s ease; }
.lp-cartao:hover { translate: 0 -4px; border-color: var(--o-linha-forte); }
.lp-cartao h3 { font: 600 19px/1.25 var(--o-display); margin: 22px 0 8px; }
.lp-cartao p { margin: 0; color: var(--o-tinta-2); line-height: 1.6; }
.lp-cartao__visual { border-radius: 14px; background: var(--o-fundo); border: 1px solid var(--o-linha); padding: 16px; min-height: 128px; display: grid; gap: 10px; align-content: start; }
.lp-cartao__visual p { color: var(--o-tinta); font-size: 14px; line-height: 1.5; }
.lp-visual-pendencia p b { display: block; font-family: var(--o-mono); font-weight: 400; font-size: 12.5px; color: var(--o-tinta-2); margin-bottom: 4px; }
.lp-visual-pendencia .o-selo, .lp-visual-guarda .o-selo { justify-self: start; }
.lp-visual-guarda { align-content: center; justify-items: start; }
.lp-riscado { font: 600 14px/1 var(--o-texto); color: var(--o-tinta-2); text-decoration: line-through; text-decoration-color: var(--o-erro); text-decoration-thickness: 2px; }

/* página do cliente */
.lp-portal { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 80px); align-items: center; }
.lp-idiomas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.lp-idiomas button { font: 500 13px/1 var(--o-mono); color: var(--o-tinta-2); background: transparent; border: 1px solid var(--o-linha-forte); border-radius: 999px; min-width: 52px; min-height: 38px; cursor: pointer; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.lp-idiomas button:hover { color: var(--o-tinta); border-color: var(--o-acento); }
.lp-idiomas button[aria-pressed="true"] { background: var(--o-acento); border-color: var(--o-acento); color: var(--o-acento-tinta); }
.lp-janela--loja { background: #F7F6F3; }
.lp-loja { padding: clamp(20px, 3vw, 32px); color: #1B1D22; font-family: var(--o-texto); display: grid; gap: 14px; }
.lp-loja__marca { margin: 0; text-align: center; font: 600 15px/1 Georgia, "Times New Roman", serif; letter-spacing: .28em; color: #7A2E2E; }
.lp-loja__titulo { margin: 0; text-align: center; font: 700 24px/1.2 var(--o-texto); transition: opacity .25s ease; }
.lp-loja__cartao { background: #FFFFFF; border: 1px solid #E6E2DA; border-radius: 14px; padding: 18px; display: grid; gap: 10px; }
.lp-loja__linha { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.lp-loja__estado { font-size: 12.5px; font-weight: 700; color: #7A2E2E; background: #F6ECEC; border-radius: 999px; padding: 4px 10px; }
.lp-loja__codigo { margin: 0; font: 12.5px/1 var(--o-mono); color: #5E6068; }
.lp-loja__eventos { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 12px; }
.lp-loja__eventos li { display: grid; grid-template-columns: 12px minmax(0, 1fr); column-gap: 12px; font-size: 14px; }
.lp-loja__eventos li::before { content: ""; grid-row: span 2; width: 10px; height: 10px; margin-top: 4px; border-radius: 50%; border: 2px solid #C9C4BA; }
.lp-loja__eventos li.lp-loja__evento--atual::before { background: #7A2E2E; border-color: #7A2E2E; }
.lp-loja__eventos small { color: #6B6D74; font-size: 12px; }
.lp-loja__prazo { margin: 4px 0 0; padding-top: 12px; border-top: 1px solid #EFEBE3; font-size: 13px; color: #4A4C53; }
.lp-loja [data-t] { transition: opacity .25s ease; }
.lp-loja.lp-loja--trocando [data-t] { opacity: 0; }

/* rastreio ao vivo */
.lp-rastreio { background: linear-gradient(180deg, var(--o-fundo), #080C22 30%, #080C22 70%, var(--o-fundo)); overflow: hidden; }
.lp-mapa { position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image:
    radial-gradient(ellipse 60% 40% at 50% 45%, rgba(140, 155, 255, .10), transparent 70%),
    repeating-radial-gradient(ellipse at 50% 120%, transparent 0 38px, rgba(220, 225, 238, .045) 38px 39px);
  mask-image: linear-gradient(180deg, transparent, #000 25%, #000 75%, transparent); -webkit-mask-image: linear-gradient(180deg, transparent, #000 25%, #000 75%, transparent); }
.lp-rastreio .lp-cabeca, .lp-rastreio .lp-caixa, .lp-carrossel { position: relative; }
.lp-carrossel { overflow: hidden; padding-block: 8px; mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent); }
.lp-carrossel__trilho { display: flex; width: max-content; animation: lp-desliza 56s linear infinite; }
.lp-carrossel:hover .lp-carrossel__trilho { animation-play-state: paused; }
.lp-carrossel__lista { display: flex; gap: 16px; list-style: none; margin: 0; padding: 0 16px 0 0; }
.lp-evento { width: 300px; display: grid; gap: 10px; align-content: start; padding: 18px; border-radius: 18px; background: rgba(20, 27, 66, .78); border: 1px solid var(--o-linha); }
.lp-evento .o-selo { justify-self: start; }
.lp-evento b { font-size: 15.5px; line-height: 1.4; font-weight: 600; min-height: 2.8em; }
.lp-evento__meta { font: 12px/1 var(--o-mono); color: var(--o-tinta-2); }

.lp-orbita-grande { margin: 64px auto 0; max-width: 820px; }
.lp-orbita-grande svg { width: 100%; height: auto; display: block; overflow: visible; }
.lp-orbita-grande__feito { stroke-dasharray: 0 100; animation: lp-percorre 9s cubic-bezier(.45, 0, .25, 1) infinite; }
.lp-orbita-grande__marcos circle { fill: var(--o-superficie); stroke: var(--o-trilho); stroke-width: 2.5; }
.lp-orbita-grande__pacote { fill: var(--o-halo); stroke: var(--o-fundo); stroke-width: 4; filter: drop-shadow(0 0 10px rgba(255, 227, 163, .55)); }
.lp-orbita-grande__etapas { list-style: none; margin: 14px 0 0; padding: 0; position: relative; height: 1.6em; font-size: 13.5px; color: var(--o-tinta-2); }
/* x dos pontos no viewBox de 640, em passos iguais: 20 · 170 · 320 · 470 · 620 (a 93 px os rótulos colidiam) */
.lp-orbita-grande__etapas li { position: absolute; top: 0; white-space: nowrap; transform: translateX(-50%); }
.lp-orbita-grande__etapas li:nth-child(1) { left: 3.125%; transform: none; margin-left: -8px; }
.lp-orbita-grande__etapas li:nth-child(2) { left: 26.56%; }
.lp-orbita-grande__etapas li:nth-child(3) { left: 50%; }
.lp-orbita-grande__etapas li:nth-child(4) { left: 73.44%; }
.lp-orbita-grande__etapas li:nth-child(5) { left: 96.875%; transform: translateX(-100%); margin-left: 8px; }
.lp-paises { text-align: center; margin: 44px auto 0; max-width: 70ch; font-size: 14px; color: var(--o-tinta-2); line-height: 1.8; }

/* chamada intermédia */
.lp-chamada__caixa { text-align: center; display: grid; justify-items: center; padding-block: clamp(48px, 7vw, 80px); border-radius: 28px; background:
  radial-gradient(ellipse 70% 90% at 50% 0%, rgba(140, 155, 255, .20), transparent 70%), var(--o-superficie); border: 1px solid var(--o-linha); }
.lp-chamada__caixa .lp-titulo-2 { max-width: 22ch; }
.lp-chamada__caixa .lp-texto { margin-inline: auto; }

/* bento */
.lp-bento { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 18px; }
.lp-bento .lp-cartao h3 { margin-top: 10px; }
.lp-bento .lp-cartao > p:not(.o-rotulo) { max-width: 52ch; }
.lp-caixa-entrada { list-style: none; margin: 24px 0 0; padding: 6px 16px; border-radius: 14px; background: var(--o-fundo); border: 1px solid var(--o-linha); }
.lp-caixa-entrada li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--o-linha); font-size: 14px; }
.lp-caixa-entrada li:last-child { border-bottom: 0; }
.lp-caixa-entrada b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp-caixa-entrada time { font: 12px/1 var(--o-mono); color: var(--o-tinta-2); white-space: nowrap; }
.lp-alerta { margin-top: 24px; padding: 16px; border-radius: 14px; background: var(--o-fundo); border: 1px solid var(--o-linha); display: grid; gap: 10px; }
.lp-alerta .o-selo { justify-self: start; }
.lp-alerta p { color: var(--o-tinta) !important; }

/* dropshipping */
.lp-drop { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: clamp(32px, 6vw, 80px); align-items: center; }
.lp-traducao { display: grid; gap: 10px; padding: 24px; border-radius: 22px; background: var(--o-superficie); border: 1px solid var(--o-linha); }
.lp-traducao__passo { display: grid; gap: 6px; padding: 14px 16px; border-radius: 14px; background: var(--o-fundo); border: 1px solid var(--o-linha); }
.lp-traducao__passo p { margin: 0; font-size: 16px; font-weight: 600; }
.lp-traducao__cru { color: var(--o-tinta-2) !important; text-decoration: line-through; text-decoration-color: var(--o-erro); }
.lp-traducao__seta { justify-self: center; width: 2px; height: 22px; background: linear-gradient(var(--o-trilho), var(--o-acento)); position: relative; }
.lp-traducao__seta::after { content: ""; position: absolute; left: 50%; bottom: -2px; width: 8px; height: 8px; border-right: 2px solid var(--o-acento); border-bottom: 2px solid var(--o-acento); transform: translateX(-50%) rotate(45deg); }

/* preços */
.lp-planos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.lp-plano { position: relative; display: flex; flex-direction: column; padding: 24px; border-radius: 22px; background: var(--o-superficie); border: 1px solid var(--o-linha); }
.lp-plano h3 { font: 600 22px/1.2 var(--o-display); margin: 0; }
.lp-plano__para { color: var(--o-tinta-2); margin: 8px 0 0; }
.lp-plano__preco { display: flex; align-items: baseline; gap: 6px; margin: 22px 0 0; }
.lp-plano__preco b { font: 600 44px/1 var(--o-display); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.lp-plano__preco span { color: var(--o-tinta-2); font-weight: 600; }
.lp-plano .lp-lista-check { flex: 1; align-content: start; }
.lp-plano__botao { margin-top: 26px; width: 100%; min-height: 48px; box-sizing: border-box; }
.lp-plano--destaque { border-color: var(--o-acento); background: radial-gradient(ellipse 90% 60% at 50% 0%, rgba(140, 155, 255, .16), transparent 70%), var(--o-superficie); box-shadow: 0 30px 80px rgba(140, 155, 255, .12); }
.lp-plano__selo { position: absolute; top: -13px; left: 24px; margin: 0; padding: 6px 12px; border-radius: 999px; background: var(--o-halo); color: #0C1230; font: 700 12px/1 var(--o-texto); letter-spacing: .04em; }

/* dúvidas */
.lp-duvidas { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 80px); align-items: start; }
.lp-faq { display: grid; gap: 10px; }
.lp-faq details { border-radius: 16px; background: var(--o-superficie); border: 1px solid var(--o-linha); transition: border-color .2s ease; }
.lp-faq details[open] { border-color: var(--o-linha-forte); }
.lp-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 18px 20px; font-weight: 700; font-size: 15.5px; line-height: 1.4; }
.lp-faq summary::-webkit-details-marker { display: none; }
.lp-faq summary::after { content: ""; flex: none; width: 10px; height: 10px; border-right: 2px solid var(--o-acento); border-bottom: 2px solid var(--o-acento); transform: rotate(45deg); transition: transform .3s var(--lp-curva); margin-top: -4px; }
.lp-faq details[open] summary::after { transform: rotate(-135deg); margin-top: 4px; }
.lp-faq details p { margin: 0; padding: 0 20px 20px; color: var(--o-tinta-2); line-height: 1.65; }

/* rodapé */
.lp-rodape { border-top: 1px solid var(--o-linha); padding-block: 56px calc(32px + env(safe-area-inset-bottom, 0px)); }
.lp-rodape__grelha { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 32px; }
.lp-rodape__marca p { color: var(--o-tinta-2); max-width: 32ch; margin: 14px 0 0; line-height: 1.6; }
.lp-rodape nav { display: grid; gap: 10px; align-content: start; }
.lp-rodape nav .o-rotulo { margin: 0 0 4px; }
.lp-rodape nav a { color: var(--o-tinta-2); text-decoration: none; font-size: 14.5px; display: inline-flex; align-items: center; min-height: 32px; justify-self: start; }
.lp-rodape nav a:hover { color: var(--o-tinta); }
.lp-rodape__fim { margin-top: 40px; font-size: 13px; color: var(--o-tinta-2); }

/* ── entrada por rolagem: só para o que está abaixo da primeira tela (o script marca) ── */
.lp-escondido { opacity: 0; transform: translateY(22px); }
.lp-visto { opacity: 1; transform: none; transition: opacity .8s var(--lp-curva), transform .8s var(--lp-curva); }

/* ── movimentos ─────────────────────────────────────────────────────── */
@keyframes lp-desliza { to { transform: translateX(-50%); } }
@keyframes lp-respira { from { opacity: .7; transform: translateX(-50%) scale(.94); } to { opacity: 1; transform: translateX(-50%) scale(1.06); } }
@keyframes lp-pulso { 50% { box-shadow: 0 0 0 8px rgba(255, 227, 163, 0); } }
@keyframes lp-sobe-janela { from { opacity: 0; transform: translateY(60px) rotateX(14deg) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes lp-acende {
  0%, 30%, 100% { background: var(--o-fundo); border-color: var(--o-trilho); box-shadow: none; }
  8%, 22% { background: var(--o-acento); border-color: var(--o-acento); box-shadow: 0 0 0 6px var(--o-acento-suave), 0 0 24px rgba(140, 155, 255, .5); }
}
@keyframes lp-percorre { 0% { stroke-dasharray: 0 100; } 88%, 100% { stroke-dasharray: 100 100; } }

/* ── celular e tablet ───────────────────────────────────────────────── */
.lp-plano__extra { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--o-linha); color: var(--o-tinta-2); font-size: 13.5px; line-height: 1.45; }
.lp-plano__extra b { color: var(--o-tinta); font-variant-numeric: tabular-nums; }
/* Estreia: plano de entrada em faixa larga acima dos quatro, para a comparação deles continuar lado a lado */
.lp-plano--estreia { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, .85fr) auto minmax(0, 1.75fr) minmax(0, .95fr); gap: 20px 32px; align-items: center; padding: 22px 28px; margin-bottom: 8px; }
.lp-plano--estreia .lp-plano__preco { margin: 0; }
.lp-plano--estreia .lp-lista-check { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 18px; margin: 0; font-size: 14.5px; }
.lp-plano--estreia .lp-plano__botao { margin-top: 0; }
.lp-plano--estreia .lp-plano__extra { margin-top: 12px; padding-top: 0; border-top: 0; }
@media (max-width: 1120px) {
  .lp-planos { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 760px; margin-inline: auto; }
  .lp-plano--estreia { grid-template-columns: minmax(0, 1fr) auto; }
  .lp-plano--estreia .lp-lista-check, .lp-plano--estreia .lp-plano__fim { grid-column: 1 / -1; }
}

@media (max-width: 960px) {
  .lp-topo__nav { display: none; }
  .lp-hero__grelha { grid-template-columns: minmax(0, 1fr); }
  .lp-globo { max-width: 440px; }
  .lp-flutua--b, .lp-flutua--c { display: none; }
  .lp-flutua--a { left: auto; right: 16px; top: -58px; }
  .lp-topo__acoes { margin-left: auto; }
  .lp-dois-tempos, .lp-portal, .lp-drop, .lp-duvidas, .lp-bento { grid-template-columns: minmax(0, 1fr); }
  .lp-grelha-3, .lp-planos { grid-template-columns: minmax(0, 1fr); max-width: 560px; margin-inline: auto; }
  .lp-plano--estreia { display: flex; flex-direction: column; align-items: stretch; padding: 24px; margin-bottom: 0; }
  .lp-plano--estreia .lp-plano__preco { margin-top: 22px; }
  .lp-plano--estreia .lp-lista-check { grid-template-columns: minmax(0, 1fr); margin-top: 16px; font-size: inherit; }
  .lp-plano--estreia .lp-plano__fim { margin-top: 26px; }
  .lp-caminho { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 32px; }
  .lp-caminho::before { display: none; }
  .lp-rodape__grelha { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lp-rodape__marca { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  :root { --lp-topo-h: 56px; }
  .lp-topo__barra { padding: 0 6px 0 12px; gap: 8px; }
  .lp-topo__marca { font-size: 14px; }
  .lp-so-largo { display: none; }
  .lp-link { padding: 8px 6px; font-size: 13px; }
  .lp-hero { padding-top: calc(var(--lp-topo-h) + 64px + env(safe-area-inset-top, 0px)); }
  .lp-hero__palco { margin-top: 12px; }
  .lp-flutua { display: none; }
  /* celular: o globo sobe para trás do título, para o «UAU» estar no primeiro ecrã (revisão 19:22).
     Fica atrás do texto (z -1 dentro do isolamento do hero) e esbatido para o título manter o contraste. */
  .lp-hero__grelha { position: relative; }
  .lp-globo { position: absolute; z-index: -1; top: -36px; right: -38%; width: 340px; max-width: none; opacity: .5; pointer-events: none; }
  .lp-globo__rotulo { display: none; }
  .lp-janela__corpo { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .lp-mini-lateral { display: none; }
  .lp-mini-trabalho { padding: 16px; }
  .lp-mini-contadores .o-contador b { font-size: 21px; }
  .lp-mini-contadores .o-cartao { padding: 10px; }
  .lp-mini-linha { grid-template-columns: 56px minmax(0, 1fr); }
  .lp-mini-linha > span:last-child { display: none; }
  .lp-acoes .lp-botao-grande { width: 100%; }
  .lp-caminho { grid-template-columns: minmax(0, 1fr); }
  .lp-evento { width: 250px; }
  .lp-orbita-grande__etapas { font-size: 11.5px; }
  .lp-orbita-grande__etapas li:nth-child(2), .lp-orbita-grande__etapas li:nth-child(4) { visibility: hidden; }
  .lp-caixa-entrada li { grid-template-columns: minmax(0, 1fr) auto; }
  .lp-caixa-entrada li .o-selo { grid-column: 1 / -1; justify-self: start; }
  .lp-rodape__grelha { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-balao { max-width: 100%; }
}

/* ── quem prefere menos movimento: tudo parado e visível ─────────────── */
@media (max-width: 640px) and (prefers-reduced-motion: reduce) {
  /* parado e pequeno: dois destinos que não se tocam */
  .lp-globo__rotulo:nth-of-type(n+3) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .lp-faixa__trilho, .lp-carrossel__trilho { animation: none; }
  .lp-carrossel { overflow-x: auto; mask-image: none; -webkit-mask-image: none; }
  .lp-carrossel__trilho { padding-inline: clamp(16px, 4vw, 32px); }
  .lp-carrossel__lista[aria-hidden="true"] { display: none; }
  .lp-brilho, .lp-selo__ponto, .lp-caminho__ponto, .lp-orbita-grande__feito, .lp-feixe, .lp-flutua, .lp-inclina { animation: none; }
  .lp-inclina > .lp-janela { transform: none; }
  .lp-orbita-grande__feito { stroke-dasharray: 55 100; }
  .lp-escondido { opacity: 1; transform: none; }
  .lp-cartao:hover, .lp .o-botao:hover { transform: none; translate: none; }
}