/* ============================================================
   CSURFACE — Landing Pages
   Cabeçalho/rodapé enxutos · hero compacto · row informação + formulário
   ============================================================ */

/* ---- cabeçalho / rodapé ---- */
.lp-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--sp-4) var(--sp-6);
  border-bottom: 1px solid var(--border);
  background: var(--bg);
  position: sticky; top: 0; z-index: 50;
}
.lp-header__brand .brand-logo { height: 26px; }

.lp-footer {
  border-top: 1px solid var(--border);
  padding: var(--sp-7) var(--sp-6);
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: var(--sp-4);
}
.lp-footer__brand .footer-logo { height: 24px; }
.lp-footer__meta { font-size: var(--fs-sm); color: var(--text-muted); }
.lp-footer__links { display: flex; gap: var(--sp-5); flex-wrap: wrap; }
.lp-footer__links a { color: var(--text-muted); text-decoration: none; font-size: var(--fs-sm); }
.lp-footer__links a:hover { color: var(--accent); }
@media (max-width: 600px) { .lp-footer { justify-content: center; text-align: center; } }

/* ---- hero compacto ---- */
.lp-hero { min-height: auto !important; }
.lp-hero .hero__inner { padding-block: var(--sp-9) var(--sp-8); }

/* ---- row: informação (esquerda) + formulário (direita) ---- */
.lp-form-row {
  display: grid; grid-template-columns: 0.95fr 1.05fr;
  gap: var(--sp-8); align-items: start;
}
@media (max-width: 920px) { .lp-form-row { grid-template-columns: 1fr; } }

.lp-info-list { list-style: none; padding: 0; margin: var(--sp-5) 0; display: grid; gap: var(--sp-3); }
.lp-info-list li {
  position: relative; padding-left: var(--sp-6);
  font-size: var(--fs-sm); color: var(--text); line-height: 1.55;
}
.lp-info-list li::before {
  content: ""; position: absolute; left: 0; top: .5em;
  width: 9px; height: 9px; border-radius: 3px; background: var(--accent);
}
.lp-info-list strong { color: var(--text-strong); }
.lp-info-note {
  font-size: var(--fs-sm); color: var(--text-muted);
  border-left: 3px solid var(--accent); padding-left: var(--sp-4);
  margin-top: var(--sp-5);
}

/* ---- quadro do formulário ---- */
.lp-form-box {
  border: 1px solid var(--border-strong); border-radius: var(--r-lg);
  background: var(--bg-card); padding: var(--sp-7);
}
.lp-form-box__title { font-size: var(--fs-xl); margin-bottom: var(--sp-1); }
.lp-form-box__sub { font-size: var(--fs-sm); color: var(--text-muted); margin-bottom: var(--sp-5); }

.lp-field { margin-bottom: var(--sp-4); }
.lp-field label {
  display: block; font-size: var(--fs-sm); font-weight: 600;
  color: var(--text-strong); margin-bottom: var(--sp-2);
}
.lp-field input, .lp-field select, .lp-field textarea {
  width: 100%; padding: 10px 12px;
  border: 1px solid var(--border); border-radius: var(--r-sm);
  background: var(--bg); color: var(--text-strong);
  font-size: var(--fs-sm); font-family: inherit;
}
.lp-field input::placeholder, .lp-field textarea::placeholder { color: var(--text-faint, var(--text-muted)); }
.lp-field input:focus, .lp-field select:focus, .lp-field textarea:focus {
  outline: 2px solid var(--accent); outline-offset: 0; border-color: transparent;
}
.lp-field textarea { resize: vertical; min-height: 66px; }
.lp-field-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); }
@media (max-width: 480px) { .lp-field-2 { grid-template-columns: 1fr; } }

.lp-tos {
  display: flex; gap: var(--sp-3); align-items: flex-start;
  font-size: var(--fs-xs); color: var(--text-muted); line-height: 1.5;
  margin: var(--sp-4) 0 var(--sp-5);
}
.lp-tos input { margin-top: 3px; flex-shrink: 0; }
.lp-tos a { color: var(--accent); }

.lp-form-box .btn { width: 100%; }

.lp-form-status {
  margin-top: var(--sp-4); font-size: var(--fs-sm);
  padding: var(--sp-3) var(--sp-4); border-radius: var(--r-sm); line-height: 1.5;
}
.lp-form-status--ok { background: rgba(0,184,169,.12); color: var(--accent); }
.lp-form-status--err { background: rgba(240,69,90,.12); color: #f0455a; }