/* ==========================================================================
   LicitaMais — Site público (landing de conversão)
   Depende de tokens.css, base.css e components.css. Mobile-first.
   ========================================================================== */

.lp { background: var(--color-bg); }
.lp section[id] { scroll-margin-top: calc(var(--header-h) + var(--safe-top)); }
.lp-largo { display: none; }
@media (min-width: 26rem) { .lp-largo { display: inline; } }

/* ---- Cabeçalho ------------------------------------------------------------ */
.lp-header {
  position: sticky; top: 0; z-index: var(--z-header);
  padding-top: var(--safe-top);
  background: var(--color-surface);
  border-bottom: var(--border-w) solid var(--color-border);
}
.lp-header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); min-height: var(--header-h); }
.lp-header .logo { --logo-h: 1.75rem; flex: none; }
.lp-nav { display: none; gap: var(--sp-1); }
.lp-nav a {
  display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 var(--sp-3);
  border-radius: var(--radius-md); color: var(--color-text); font-size: var(--fs-sm); font-weight: var(--fw-semibold); text-decoration: none;
}
@media (hover: hover) { .lp-nav a:hover { background: var(--color-surface-2); color: var(--color-heading); } }
.lp-header__acoes { display: flex; align-items: center; gap: var(--sp-2); }
@media (min-width: 64rem) {
  .lp-nav { display: flex; }
  .lp-header .logo { --logo-h: 2rem; }
}

/* ---- Herói ---------------------------------------------------------------- */
.lp-hero {
  padding-block: var(--sp-10) var(--sp-8);
  background: var(--lm-gradient-panel);
  color: var(--color-on-brand);
  overflow: hidden;
}
.lp-hero__grid { display: grid; gap: var(--sp-10); align-items: center; }
.lp-hero__texto { display: flex; flex-direction: column; gap: var(--sp-5); max-width: 40rem; }
.lp-selo {
  display: inline-flex; align-items: center; gap: var(--sp-2); width: fit-content;
  padding: var(--sp-1) var(--sp-3); border-radius: var(--radius-pill);
  background: var(--color-on-brand-fill); color: var(--color-on-brand);
  font-size: var(--fs-sm); font-weight: var(--fw-semibold);
}
.lp-selo .icon { width: 1rem; height: 1rem; color: var(--lm-green-light); }
.lp-hero h1 {
  color: var(--color-on-brand);
  font-size: clamp(2.125rem, 1.35rem + 3.3vw, 3.5rem);
  font-weight: var(--fw-extrabold);
  line-height: 1.06;
}
.lp-destaque { display: block; color: var(--lm-green-light); }
.lp-hero__sub { color: var(--color-on-brand-muted); font-size: var(--fs-md); line-height: var(--lh-normal); max-width: 36rem; }
.lp-hero__ctas { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
.lp-hero__ctas .btn { flex: 1 1 14rem; }
@media (min-width: 40rem) { .lp-hero__ctas .btn { flex: 0 0 auto; } }
.lp-cta { --btn-bg: var(--lm-white); --btn-fg: var(--lm-navy); --btn-border: var(--lm-white); --btn-bg-hover: var(--lm-navy-50); --btn-bg-active: var(--lm-navy-50); }
.lp-cta-sec { --btn-bg: transparent; --btn-fg: var(--color-on-brand); --btn-border: var(--color-on-brand-muted); --btn-bg-hover: var(--color-on-brand-fill); --btn-bg-active: var(--color-on-brand-fill); }
.lp-hero :focus-visible, .lp-final :focus-visible, .lp-rodape :focus-visible { outline-color: var(--lm-green-light); }
.lp-garantias { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-5); margin: 0; padding: 0; list-style: none; color: var(--color-on-brand-muted); font-size: var(--fs-sm); }
.lp-garantias li { display: inline-flex; align-items: center; gap: var(--sp-2); }
.lp-garantias .icon { width: 1.125rem; height: 1.125rem; color: var(--lm-green-light); }

.lp-hero__visual { display: grid; gap: var(--sp-4); max-width: 26rem; width: 100%; margin-inline: auto; }
@media (min-width: 64rem) {
  .lp-hero { padding-block: var(--sp-16) var(--sp-10); }
  .lp-hero__grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: var(--sp-12); }
  .lp-mock--imovel { margin-left: calc(var(--sp-10) * -1); margin-right: var(--sp-8); }
}

/* Números reais (vêm da API) */
.lp-numeros {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-5) var(--sp-4);
  margin: var(--sp-10) 0 0; padding-top: var(--sp-6);
  border-top: var(--border-w) solid var(--color-on-brand-fill);
}
@media (min-width: 48rem) { .lp-numeros { grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); } }
.lp-numeros > div { display: flex; flex-direction: column-reverse; gap: var(--sp-1); }
.lp-numeros dd { margin: 0; color: var(--lm-white); font-size: clamp(1.625rem, 1.2rem + 1.6vw, 2.25rem); font-weight: var(--fw-extrabold); letter-spacing: var(--ls-tight); font-variant-numeric: tabular-nums; line-height: 1.1; }
.lp-numeros dt { color: var(--color-on-brand-muted); font-size: var(--fs-sm); line-height: var(--lh-snug); }
.lp-atualizado { display: flex; align-items: center; gap: var(--sp-2); margin-top: var(--sp-4); color: var(--color-on-brand-muted); font-size: var(--fs-xs); }
.lp-atualizado .icon { width: 0.875rem; height: 0.875rem; }

/* ---- Cartões ilustrativos ------------------------------------------------------ */
.lp-mock {
  position: relative;
  display: flex; flex-direction: column; gap: var(--sp-3);
  padding: var(--sp-5);
  border: var(--border-w) solid var(--color-border);
  border-radius: var(--radius-xl);
  background: var(--color-surface);
  color: var(--color-text);
  box-shadow: var(--shadow-lg);
}
.lp-mock__rotulo {
  width: fit-content; padding: 2px var(--sp-2); border-radius: var(--radius-pill);
  background: var(--color-surface-2); color: var(--color-text-muted);
  font-size: var(--fs-xs); font-weight: var(--fw-semibold); letter-spacing: var(--ls-caps); text-transform: uppercase;
}
.lp-mock__topo { display: flex; align-items: center; gap: var(--sp-3); }
.lp-mock__icone {
  display: grid; place-items: center; flex: none; width: 2.5rem; height: 2.5rem;
  border-radius: var(--radius-md); background: var(--color-surface-brand); color: var(--color-heading);
}
.lp-mock__icone--verde { background: var(--color-success-bg); color: var(--color-success-text); }
.lp-mock__titulo { display: flex; align-items: center; gap: var(--sp-2); color: var(--color-heading); font-weight: var(--fw-bold); line-height: var(--lh-snug); }
.lp-mock__sub { color: var(--color-text-muted); font-size: var(--fs-sm); }
.lp-mock__lista { display: grid; gap: var(--sp-2); margin: 0; padding: 0; list-style: none; }
.lp-mock__lista li {
  display: grid; grid-template-columns: 1fr auto; gap: 0 var(--sp-3); align-items: center;
  padding: var(--sp-3); border-radius: var(--radius-md); background: var(--color-surface-2); font-size: var(--fs-sm);
}
.lp-mock__lista strong { color: var(--color-heading); }
.lp-mock__lista span:not(.lp-mock__prazo) { grid-column: 1; color: var(--color-text-muted); }
.lp-mock__prazo { grid-column: 2; grid-row: 1 / span 2; padding: 2px var(--sp-2); border-radius: var(--radius-pill); background: var(--color-success-bg); color: var(--color-success-text); font-size: var(--fs-xs); font-weight: var(--fw-semibold); white-space: nowrap; }
.lp-mock__prazo--alta { background: var(--color-warning-bg); color: var(--color-warning-text); }
.lp-mock--imovel { flex-direction: row; align-items: center; }

.lp-filtros { display: grid; gap: var(--sp-3); margin: 0; }
.lp-filtros > div { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: var(--sp-3); align-items: baseline; padding-top: var(--sp-3); border-top: var(--border-w) solid var(--color-border); }
.lp-filtros dt { color: var(--color-text-muted); font-size: var(--fs-xs); font-weight: var(--fw-semibold); letter-spacing: var(--ls-caps); text-transform: uppercase; }
.lp-filtros dd { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1); margin: 0; color: var(--color-heading); font-size: var(--fs-sm); font-weight: var(--fw-medium); }
.lp-filtros dd .icon { width: 1rem; height: 1rem; color: var(--color-success-icon); }
.lp-tag { padding: 2px var(--sp-2); border-radius: var(--radius-pill); background: var(--color-surface-brand); color: var(--color-heading); font-size: var(--fs-xs); font-weight: var(--fw-semibold); }
.lp-tag--nao { background: var(--color-error-bg); color: var(--color-error-text); text-decoration: line-through; }

.lp-mock--balao { border-color: var(--color-success-border); }
.lp-mock--balao .lp-mock__titulo .icon { color: var(--color-success-icon); }
.lp-mock--balao ol { display: grid; gap: var(--sp-2); margin: 0; padding-left: 1.25rem; font-size: var(--fs-sm); }
.lp-mock--balao > p { font-size: var(--fs-sm); }
.lp-mock__dica { padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-md); background: var(--color-warning-bg); color: var(--color-warning-text); }
.lp-mock__acoes { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.lp-botao-falso {
  display: inline-flex; align-items: center; gap: var(--sp-1); padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-md);
  background: var(--color-accent); color: var(--color-on-accent); font-size: var(--fs-sm); font-weight: var(--fw-semibold);
}
.lp-botao-falso .icon { width: 0.875rem; height: 0.875rem; }
.lp-botao-falso--sec { background: transparent; color: var(--color-heading); box-shadow: inset 0 0 0 var(--border-w-strong) var(--color-border-strong); }

/* ---- Seções ----------------------------------------------------------------- */
.lp-secao { padding-block: var(--sp-12); }
.lp-secao--alt { background: var(--color-surface); border-block: var(--border-w) solid var(--color-border); }
@media (min-width: 64rem) { .lp-secao { padding-block: var(--sp-20); } }
.lp-estreito { max-width: calc(48rem + var(--gutter) * 2); }
.lp-cab { display: flex; flex-direction: column; gap: var(--sp-3); max-width: 46rem; margin-bottom: var(--sp-8); }
.lp-cab--centro { margin-inline: auto; text-align: center; align-items: center; }
.lp-cab h2, .lp-duo h2 { font-size: clamp(1.625rem, 1.1rem + 2vw, 2.375rem); font-weight: var(--fw-extrabold); }
.lp-cab > p:not(.eyebrow) { color: var(--color-text-muted); font-size: var(--fs-md); }
.lp .eyebrow { color: var(--color-success-text); }
.lp-centro { display: flex; justify-content: center; margin-top: var(--sp-8); }
.lp-lead { color: var(--color-text-muted); font-size: var(--fs-md); line-height: var(--lh-normal); }

/* Experimente */
.lp-busca { display: grid; gap: var(--sp-4); align-items: end; }
@media (min-width: 40rem) { .lp-busca { grid-template-columns: minmax(0, 1fr) 11rem auto; } }
.lp-busca .input-group { width: 100%; }
.lp-demo { display: flex; flex-direction: column; gap: var(--sp-3); margin-top: var(--sp-5); }
.lp-demo:empty { display: none; }
.lp-demo__item { display: grid; gap: var(--sp-1); padding: var(--sp-4); }
.lp-demo__topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-2); }
.lp-demo__org { color: var(--color-text-muted); font-size: var(--fs-sm); }
.lp-demo__obj { color: var(--color-heading); font-weight: var(--fw-semibold); }
.lp-demo__mais { display: flex; flex-direction: column; align-items: center; gap: var(--sp-3); padding: var(--sp-6) var(--sp-5); text-align: center; background: var(--color-surface-brand); border-color: transparent; }
.lp-demo__mais strong { color: var(--color-heading); font-size: var(--fs-lg); }

/* Como funciona */
.lp-passos { display: grid; gap: var(--sp-4); margin: 0; padding: 0; list-style: none; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.lp-passo { display: flex; flex-direction: column; gap: var(--sp-3); padding: var(--sp-6); border: var(--border-w) solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-bg); }
.lp-passo__n { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--color-accent); color: var(--color-on-accent); font-weight: var(--fw-extrabold); font-size: var(--fs-lg); }
.lp-passo p { color: var(--color-text-muted); }

/* Blocos de duas colunas */
.lp-duo { display: grid; gap: var(--sp-8); align-items: center; }
.lp-duo__texto { display: flex; flex-direction: column; gap: var(--sp-4); }
.lp-duo__visual { max-width: 30rem; width: 100%; margin-inline: auto; }
@media (min-width: 64rem) {
  .lp-duo { grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr); gap: var(--sp-16); }
  .lp-duo--inverso .lp-duo__visual { order: -1; }
}
.lp-check { display: grid; gap: var(--sp-3); margin: var(--sp-2) 0 0; padding: 0; list-style: none; }
.lp-check li { display: flex; gap: var(--sp-3); align-items: flex-start; }
.lp-check .icon { flex: none; width: 1.25rem; height: 1.25rem; margin-top: 0.1em; color: var(--color-success-icon); }
.lp-check strong { color: var(--color-heading); }
.lp-nota { display: flex; gap: var(--sp-2); align-items: center; color: var(--color-text-muted); font-size: var(--fs-sm); }
.lp-nota .icon { flex: none; width: 1rem; height: 1rem; color: var(--color-info-icon); }
.lp-portais { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin: var(--sp-2) 0 0; padding: 0; list-style: none; }
.lp-portais li { padding: var(--sp-1) var(--sp-3); border: var(--border-w) solid var(--color-border); border-radius: var(--radius-pill); background: var(--color-surface); font-size: var(--fs-sm); font-weight: var(--fw-medium); color: var(--color-heading); }
.lp-portais li:last-child { border-style: dashed; color: var(--color-text-muted); }

/* Recursos */
.lp-recursos { display: grid; gap: var(--sp-4); margin: 0; padding: 0; list-style: none; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
.lp-recursos li { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-6); border: var(--border-w) solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-bg); }
.lp-recursos p { color: var(--color-text-muted); font-size: var(--fs-sm); line-height: var(--lh-normal); }
.lp-recursos__icone { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; margin-bottom: var(--sp-1); border-radius: var(--radius-md); background: var(--color-surface-brand); color: var(--color-heading); }

/* Para quem */
.lp-publico { display: grid; gap: var(--sp-3); margin: 0; padding: 0; list-style: none; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.lp-publico li { display: flex; gap: var(--sp-4); align-items: flex-start; padding: var(--sp-5); border: var(--border-w) solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); }
.lp-publico .icon { flex: none; width: 1.5rem; height: 1.5rem; color: var(--color-success-icon); }
.lp-publico span { display: flex; flex-direction: column; gap: var(--sp-1); color: var(--color-text-muted); font-size: var(--fs-sm); }
.lp-publico strong { color: var(--color-heading); font-size: var(--fs-base); }

/* Fontes oficiais */
.lp-fontes { padding-block: var(--sp-8); background: var(--color-surface-brand); }
.lp-fontes__inner { display: flex; gap: var(--sp-5); align-items: flex-start; }
.lp-fontes__icone { display: grid; place-items: center; flex: none; width: 3rem; height: 3rem; border-radius: 50%; background: var(--color-surface); color: var(--color-heading); }
.lp-fontes h2 { font-size: var(--fs-lg); }
.lp-fontes p { margin-top: var(--sp-1); color: var(--color-text); max-width: 60rem; }

/* Planos */
.lp-planos { display: grid; gap: var(--sp-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); max-width: 68rem; margin-inline: auto; }
.lp-plano { display: flex; flex-direction: column; gap: var(--sp-4); padding: var(--sp-6); }
.lp-plano[data-destaque] { border: 2px solid var(--color-accent); box-shadow: var(--shadow-md); }
.lp-plano__topo { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); }
.lp-plano__preco { color: var(--color-heading); font-size: var(--fs-3xl); font-weight: var(--fw-extrabold); letter-spacing: var(--ls-tight); line-height: 1; font-variant-numeric: tabular-nums; }
.lp-plano__preco small { color: var(--color-text-muted); font-size: var(--fs-sm); font-weight: var(--fw-medium); letter-spacing: 0; }
.lp-plano > p:not(.lp-plano__preco) { color: var(--color-text-muted); font-size: var(--fs-sm); }
.lp-plano ul { display: grid; gap: var(--sp-2); margin: 0; padding: 0; list-style: none; font-size: var(--fs-sm); }
.lp-plano li { display: flex; gap: var(--sp-2); align-items: flex-start; }
.lp-plano li .icon { flex: none; width: 1.125rem; height: 1.125rem; margin-top: 0.1em; color: var(--color-success-icon); }
.lp-plano li.is-off { color: var(--color-text-muted); }
.lp-plano li.is-off .icon { color: var(--color-text-muted); }
.lp-plano .btn { margin-top: auto; }
.lp-plano--breve { border-style: dashed; background: var(--color-bg); }

/* Dúvidas */
.lp-faq { display: flex; flex-direction: column; border-top: var(--border-w) solid var(--color-border); }
.lp-faq details { border-bottom: var(--border-w) solid var(--color-border); }
.lp-faq summary {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4);
  min-height: var(--tap); padding-block: var(--sp-4); cursor: pointer; list-style: none;
  color: var(--color-heading); font-size: var(--fs-md); font-weight: var(--fw-semibold);
}
.lp-faq summary::-webkit-details-marker { display: none; }
.lp-faq summary::after {
  content: ""; flex: none; width: 0.55rem; height: 0.55rem; margin-right: 0.3rem;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(45deg); transition: transform var(--dur-fast) var(--ease-out);
}
.lp-faq details[open] summary::after { transform: rotate(-135deg); }
.lp-faq summary:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; border-radius: var(--radius-sm); }
.lp-faq details p { padding-bottom: var(--sp-5); color: var(--color-text); line-height: var(--lh-normal); max-width: 44rem; }

/* CTA final */
.lp-final { padding-block: var(--sp-16); background: var(--lm-gradient-panel); color: var(--color-on-brand); }
.lp-final__inner { display: flex; flex-direction: column; align-items: center; gap: var(--sp-4); text-align: center; }
.lp-final h2 { color: var(--color-on-brand); font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.75rem); font-weight: var(--fw-extrabold); max-width: 40rem; }
.lp-final p { color: var(--color-on-brand-muted); font-size: var(--fs-md); }
.lp-final .btn { margin-top: var(--sp-2); }
.lp-final__entrar a { color: var(--lm-white); font-weight: var(--fw-semibold); }

/* Rodapé */
.lp-rodape { padding-block: var(--sp-12) calc(var(--sp-8) + var(--safe-bottom)); background: var(--lm-navy-900); color: var(--color-on-brand-muted); font-size: var(--fs-sm); }
.lp-rodape__grid { display: grid; gap: var(--sp-8); grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); }
.lp-rodape__marca { display: flex; flex-direction: column; gap: var(--sp-3); grid-column: 1 / -1; max-width: 22rem; }
@media (min-width: 64rem) { .lp-rodape__grid { grid-template-columns: 2fr repeat(3, 1fr); } .lp-rodape__marca { grid-column: auto; } }
.lp-rodape__marca img { width: 10rem; height: auto; }
.lp-rodape h2 { margin-bottom: var(--sp-3); color: var(--lm-white); font-size: var(--fs-sm); letter-spacing: var(--ls-caps); text-transform: uppercase; }
.lp-rodape ul { display: grid; gap: var(--sp-1); margin: 0; padding: 0; list-style: none; }
.lp-rodape a { display: inline-flex; align-items: center; min-height: 2.25rem; color: var(--color-on-brand-muted); text-decoration: none; }
.lp-rodape a:hover { color: var(--lm-white); text-decoration: underline; }
.lp-rodape__base { margin-top: var(--sp-10); font-size: var(--fs-xs); }
.lp-rodape__base p { padding-top: var(--sp-6); border-top: var(--border-w) solid var(--color-on-brand-fill); }

/* Barra fixa de conversão (celular, depois do herói) */
.lp-barra-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-sticky);
  padding: var(--sp-3) max(var(--gutter), var(--safe-right)) calc(var(--sp-3) + var(--safe-bottom)) max(var(--gutter), var(--safe-left));
  background: var(--color-surface); border-top: var(--border-w) solid var(--color-border); box-shadow: var(--shadow-lg);
}
@media (min-width: 48rem) { .lp-barra-cta { display: none !important; } }
.lp.com-barra .lp-rodape { padding-bottom: calc(var(--sp-8) + 4.5rem + var(--safe-bottom)); }

/* ---- Páginas legais ------------------------------------------------------------ */
.legal { padding-block: var(--sp-10) var(--sp-16); }
.legal .container { max-width: calc(46rem + var(--gutter) * 2); display: flex; flex-direction: column; gap: var(--sp-4); }
.legal h1 { font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.25rem); font-weight: var(--fw-extrabold); }
.legal h2 { margin-top: var(--sp-6); font-size: var(--fs-lg); }
.legal p, .legal li { line-height: var(--lh-normal); }
.legal ul { display: grid; gap: var(--sp-2); padding-left: 1.25rem; margin: 0; }
.legal .text-muted { font-size: var(--fs-sm); }

/* ---- Banners rotativos (topo do herói) ------------------------------------------ */
.lp-banners { position: relative; margin-bottom: var(--sp-10); }
.lp-banners__trilho {
  display: flex; gap: var(--sp-4); margin: 0; padding: 0; list-style: none;
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
  scrollbar-width: none; border-radius: var(--radius-xl);
}
.lp-banners__trilho::-webkit-scrollbar { display: none; }
.lp-banner {
  flex: 0 0 100%; scroll-snap-align: start; scroll-snap-stop: always;
  display: grid; gap: var(--sp-5); align-items: center;
  padding: var(--sp-6) var(--sp-5);
  border: var(--border-w) solid rgb(255 255 255 / 0.16);
  border-radius: var(--radius-xl);
  background: linear-gradient(135deg, rgb(255 255 255 / 0.12), rgb(255 255 255 / 0.04));
}
.lp-banner--caixa {
  border-color: rgb(145 227 184 / 0.4);
  background: linear-gradient(135deg, rgb(26 127 82 / 0.55), rgb(4 46 86 / 0.35));
}
.lp-banner__texto { display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-3); min-width: 0; }
.lp-banner__selo {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  padding: var(--sp-1) var(--sp-3); border-radius: var(--radius-pill);
  background: var(--lm-white); color: var(--lm-navy);
  font-size: var(--fs-xs); font-weight: var(--fw-bold); letter-spacing: var(--ls-caps); text-transform: uppercase;
}
.lp-banner__selo .icon { width: 0.95rem; height: 0.95rem; color: var(--lm-green); }
.lp-banner__titulo { color: var(--lm-white); font-size: clamp(1.375rem, 1rem + 1.6vw, 2rem); font-weight: var(--fw-extrabold); line-height: 1.15; letter-spacing: var(--ls-tight); text-wrap: balance; }
.lp-banner__desc { color: var(--color-on-brand-muted); font-size: var(--fs-base); line-height: var(--lh-normal); max-width: 34rem; }
.lp-banner__cta { margin-top: var(--sp-1); }
.lp-banner__visual { display: none; }
.lp-banner__icone {
  display: grid; place-items: center; width: 5.5rem; height: 5.5rem; border-radius: 50%;
  background: var(--lm-white); color: var(--lm-navy); box-shadow: var(--shadow-lg);
}
.lp-banner--caixa .lp-banner__icone { color: var(--lm-green); }
.lp-banner__icone .icon { width: 2.5rem; height: 2.5rem; }
.lp-banner__chips { display: grid; gap: var(--sp-2); margin: 0; padding: 0; list-style: none; }
.lp-banner__chips li {
  display: flex; align-items: center; gap: var(--sp-2); padding: var(--sp-2) var(--sp-3);
  border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-heading);
  font-size: var(--fs-sm); font-weight: var(--fw-semibold); box-shadow: var(--shadow-md);
}
.lp-banner__chips .icon { width: 1rem; height: 1rem; color: var(--color-success-icon); }
@media (min-width: 48rem) {
  .lp-banner { grid-template-columns: minmax(0, 1fr) auto; padding: var(--sp-8) var(--sp-10); min-height: 17rem; }
  .lp-banner__visual { display: flex; align-items: center; gap: var(--sp-5); }
}

.lp-banners__controles { display: flex; align-items: center; justify-content: center; gap: var(--sp-1); margin-top: var(--sp-3); }
.lp-banners__btn { --btn-fg: var(--color-on-brand); --btn-bg-hover: var(--color-on-brand-fill); --btn-bg-active: var(--color-on-brand-fill); }
.lp-banners__pontos { display: flex; align-items: center; margin-inline: var(--sp-2); }
/* Área de toque de 44px com o ponto visual pequeno no centro. */
.lp-banners__ponto { display: grid; place-items: center; width: 1.75rem; height: var(--tap); padding: 0; border: 0; background: none; cursor: pointer; }
.lp-banners__ponto::before { content: ""; width: 0.55rem; height: 0.55rem; border-radius: var(--radius-pill); background: rgb(255 255 255 / 0.45); transition: width var(--dur) var(--ease-out), background var(--dur) var(--ease-out); }
.lp-banners__ponto[aria-current="true"]::before { width: 1.5rem; background: var(--lm-white); }
.lp-banners__ponto:focus-visible { outline: 3px solid var(--lm-green-light); outline-offset: -4px; border-radius: var(--radius-sm); }
@media (prefers-reduced-motion: reduce) { .lp-banners__trilho { scroll-behavior: auto; } }
/* Celular estreito: "Entrar" vira ícone para caber o botão de tema. */
.lp-so-icone { display: none; } /* "Entrar" é escrito por extenso em qualquer tela */
/* Em telas bem estreitas os dois botões encolhem em vez de o "Entrar" virar só um ícone:
   quem chega pelo celular precisa achar onde entrar sem procurar. */
@media (max-width: 25.99rem) {
  .lp-header__acoes .btn--sm { padding-inline: var(--sp-2); font-size: var(--fs-sm); }
  .lp-header__acoes { gap: var(--sp-1); }
}
@media (max-width: 25.99rem) {
  .lp-header__inner { gap: var(--sp-2); }
  .lp-header__acoes { gap: var(--sp-1); }
  .lp-header .logo { --logo-h: 1.625rem; }
}
/* Celular pequeno (320 px): logo e margens encolhem para os dois botões caberem inteiros. */
@media (max-width: 20rem) {
  .lp-header .logo { --logo-h: 1.375rem; }
  .lp-header__inner { padding-inline: var(--sp-2); gap: var(--sp-1); }
  .lp-header__acoes .btn--sm { padding-inline: var(--sp-1); }
}

/* Seção "no celular" da landing. */
.lp-cel__passos { margin: var(--sp-3) 0; padding-left: var(--sp-5); display: grid; gap: var(--sp-2); color: var(--color-text); }
.lp-cel__passos li { line-height: var(--lh-snug); }