:root{
  --lsp-bg:#0b0b12;
  --lsp-card:rgba(255,255,255,.06);
  --lsp-card2:rgba(255,255,255,.08);
  --lsp-border:rgba(255,255,255,.12);
  --lsp-text:rgba(255,255,255,.92);
  --lsp-muted:rgba(255,255,255,.72);
  --lsp-dim:rgba(255,255,255,.55);
  --lsp-grad:linear-gradient(135deg,#a78bfa 0%,#3b82f6 35%,#ec4899 100%);
  --lsp-grad2:linear-gradient(135deg,rgba(167,139,250,.35),rgba(59,130,246,.25),rgba(236,72,153,.22));
  --lsp-shadow:0 18px 60px rgba(0,0,0,.55);
  --lsp-radius:18px;
}

/* isolar do resto (sem poluir global) */
.lsp-page{
  color:var(--lsp-text);
  background:
    radial-gradient(900px 500px at 20% 10%, rgba(167,139,250,.18), transparent 60%),
    radial-gradient(900px 500px at 80% 30%, rgba(59,130,246,.16), transparent 60%),
    radial-gradient(900px 500px at 60% 90%, rgba(236,72,153,.14), transparent 60%),
    var(--lsp-bg);
  min-height:100vh;
}

/* esconder widget global de chat nesta landing (mantém resto do site intacto) */
.lsp-page ~ .wa-float,
.lsp-page ~ .wa-chat-overlay,
.lsp-page ~ .wa-chat-panel{ display:none !important; }

.lsp-wrap{ width:min(1100px, calc(100% - 2rem)); margin:0 auto; }

.lsp-hero{ padding:4.5rem 0 2rem; position:relative; overflow:hidden; }
.lsp-kicker{
  display:inline-flex; gap:.6rem; align-items:center;
  padding:.45rem .8rem; border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  color:var(--lsp-muted);
  font-weight:700; font-size:.85rem;
}
.lsp-h1{
  font-size:clamp(2rem, 4.2vw, 3.2rem);
  line-height:1.05;
  letter-spacing:-.02em;
  margin:.9rem 0 .9rem;
}
.lsp-sub{ color:var(--lsp-muted); font-size:1.05rem; line-height:1.55; margin:0 0 1.2rem; }
.lsp-hero-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:2.5rem; align-items:center; }

.lsp-hero-price{
  margin:.2rem 0 1.1rem;
  color:var(--lsp-dim);
  font-weight:800;
}
.lsp-hero-price strong{
  font-size:1.1em;
  background:var(--lsp-grad);
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
}

.lsp-hero-ctas{ display:flex; gap:.85rem; flex-wrap:wrap; margin:1.2rem 0 1.1rem; }
.lsp-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.95rem 1.15rem;
  border-radius:14px;
  font-weight:800;
  letter-spacing:.01em;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.14);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
  will-change:transform;
}
.lsp-btn:hover{ transform: translateY(-2px); }
.lsp-btn-primary{
  background:var(--lsp-grad);
  color:#0b0b12;
  box-shadow: 0 18px 40px rgba(167,139,250,.22), 0 12px 34px rgba(59,130,246,.18);
  border-color: rgba(255,255,255,.18);
}
.lsp-btn-primary:hover{ box-shadow: 0 22px 55px rgba(236,72,153,.20), 0 16px 40px rgba(59,130,246,.20); }
.lsp-btn-ghost{
  background:rgba(255,255,255,.04);
  color:var(--lsp-text);
}
.lsp-btn-ghost:hover{ border-color:rgba(167,139,250,.45); box-shadow: 0 16px 42px rgba(0,0,0,.35); }
.lsp-btn-block{ width:100%; }

.lsp-authority{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.3rem; }
.lsp-pill{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.55rem .75rem;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  color:var(--lsp-muted);
  font-weight:700; font-size:.9rem;
}
.lsp-pill-dot{ width:9px; height:9px; border-radius:99px; background:rgba(34,197,94,.95); box-shadow:0 0 0 5px rgba(34,197,94,.12); }

.lsp-hero-visual{ position:relative; min-height:360px; }
.lsp-mockup{
  position:relative;
  border-radius:var(--lsp-radius);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.14);
  box-shadow:var(--lsp-shadow);
  overflow:hidden;
}
.lsp-mockup-topbar{
  display:flex; align-items:center; gap:.5rem;
  padding:.85rem 1rem;
  background:rgba(0,0,0,.25);
  border-bottom:1px solid rgba(255,255,255,.10);
}
.lsp-dot{ width:10px; height:10px; border-radius:99px; opacity:.95; }
.lsp-dot-red{ background:#ef4444; }
.lsp-dot-yellow{ background:#f59e0b; }
.lsp-dot-green{ background:#22c55e; }
.lsp-mockup-url{ margin-left:auto; font-size:.85rem; color:rgba(255,255,255,.65); font-weight:700; }
.lsp-mockup-body{ padding:1.1rem; }
.lsp-mockup-hero{
  border-radius:14px;
  padding:1rem;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
}
.lsp-mockup-logo{ width:120px; height:14px; border-radius:99px; background:rgba(255,255,255,.16); }
.lsp-mockup-title{ width:92%; height:16px; border-radius:99px; margin:.9rem 0 .55rem; background:rgba(167,139,250,.35); }
.lsp-mockup-sub{ width:78%; height:12px; border-radius:99px; background:rgba(255,255,255,.12); }
.lsp-mockup-cta-row{ display:flex; gap:.6rem; margin-top:1rem; }
.lsp-mockup-cta{ flex:1; height:34px; border-radius:12px; background:rgba(167,139,250,.45); }
.lsp-mockup-cta--wa{ background:rgba(34,197,94,.35); }
.lsp-mockup-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; margin-top:.95rem; }
.lsp-mockup-card{ height:70px; border-radius:14px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); }
.lsp-glow{ position:absolute; inset:auto; filter: blur(40px); opacity:.8; pointer-events:none; }
.lsp-glow-1{ width:240px; height:240px; left:-40px; top:30px; background:rgba(167,139,250,.25); }
.lsp-glow-2{ width:260px; height:260px; right:-60px; bottom:-60px; background:rgba(236,72,153,.20); }

.lsp-trustbar{
  padding:1rem 0;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.25);
  backdrop-filter: blur(14px);
}
.lsp-trustbar-inner{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:.85rem 1.25rem;
  color:var(--lsp-muted);
  font-weight:700;
}
.lsp-ic{ display:inline-flex; width:18px; height:18px; align-items:center; justify-content:center; border-radius:6px; background:rgba(34,197,94,.15); color:#22c55e; margin-right:.45rem; }

.lsp-section{ padding:3.2rem 0; }
.lsp-section-alt{ background:rgba(0,0,0,.18); border-top:1px solid rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.06); }
.lsp-section-head{ max-width:760px; margin:0 auto 1.4rem; text-align:center; }
.lsp-h2{ font-size:clamp(1.55rem, 2.6vw, 2.1rem); margin:0 0 .6rem; letter-spacing:-.015em; }
.lsp-h3{ margin:0 0 .35rem; font-size:1.05rem; }
.lsp-p{ margin:0; color:var(--lsp-muted); line-height:1.6; }

.lsp-grid-3{ display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem; }
.lsp-card{
  background:var(--lsp-card);
  border:1px solid var(--lsp-border);
  border-radius:var(--lsp-radius);
  padding:1.15rem 1.1rem;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
.lsp-card-ic{
  width:42px; height:42px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  background:var(--lsp-grad2);
  border:1px solid rgba(255,255,255,.12);
  margin-bottom:.65rem;
  font-weight:900;
}

.lsp-mid-cta{ margin-top:1.4rem; display:flex; justify-content:center; gap:.8rem; flex-wrap:wrap; }

.lsp-steps{ display:grid; gap:.8rem; max-width:860px; margin:0 auto; }
.lsp-step{
  display:flex; gap:.95rem; align-items:flex-start;
  padding:1rem 1.05rem;
  border-radius:var(--lsp-radius);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
}
.lsp-step-n{
  width:38px; height:38px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(167,139,250,.18);
  border:1px solid rgba(167,139,250,.35);
  color:rgba(255,255,255,.9);
  font-weight:900;
  flex-shrink:0;
}

.lsp-portfolio{ display:grid; grid-template-columns: repeat(5, 1fr); gap:1rem; }
.lsp-portfolio-card{
  grid-column: span 1;
  background:var(--lsp-card);
  border:1px solid var(--lsp-border);
  border-radius:var(--lsp-radius);
  padding:1rem;
  min-width:0;
}
.lsp-portfolio-thumb{
  height:150px;
  border-radius:16px;
  border:1px dashed rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,.55);
  font-weight:800;
  margin-bottom:.85rem;
  background: linear-gradient(135deg, rgba(167,139,250,.12), rgba(59,130,246,.08), rgba(236,72,153,.10));
}
.lsp-portfolio-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:inherit;
  display:block;
}
.lsp-thumb-2{ background: linear-gradient(135deg, rgba(34,197,94,.10), rgba(59,130,246,.08), rgba(167,139,250,.10)); }
.lsp-thumb-3{ background: linear-gradient(135deg, rgba(236,72,153,.12), rgba(167,139,250,.10), rgba(59,130,246,.08)); }
.lsp-thumb-4{ background: linear-gradient(135deg, rgba(59,130,246,.12), rgba(34,197,94,.08), rgba(236,72,153,.10)); }
.lsp-thumb-5{ background: linear-gradient(135deg, rgba(167,139,250,.12), rgba(236,72,153,.10), rgba(34,197,94,.08)); }

.lsp-section-offer{ padding:3.6rem 0; }
.lsp-offer{ display:grid; grid-template-columns: 1.05fr .95fr; gap:1.2rem; align-items:start; }
.lsp-offer-card{
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.14);
  border-radius:24px;
  padding:1.4rem 1.25rem;
  box-shadow: var(--lsp-shadow);
}
.lsp-offer-badge{
  display:inline-flex;
  padding:.45rem .75rem;
  border-radius:999px;
  background:rgba(167,139,250,.14);
  border:1px solid rgba(167,139,250,.35);
  font-weight:900;
}
.lsp-offer-price{ margin:1rem 0 .9rem; display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap; }
.lsp-offer-from{ color:var(--lsp-dim); font-weight:800; }
.lsp-offer-value{
  font-size:2.2rem; font-weight:900;
  background:var(--lsp-grad);
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
}
.lsp-offer-list{ margin:0; padding:0 0 0 1.1rem; color:var(--lsp-muted); line-height:1.75; }
.lsp-offer-ctas{ display:grid; gap:.7rem; margin-top:1rem; }
.lsp-offer-note{ color:var(--lsp-dim); margin:.9rem 0 0; font-weight:700; font-size:.95rem; }
.lsp-offer-side{ display:grid; gap:1rem; }
.lsp-mini{
  background:var(--lsp-card);
  border:1px solid var(--lsp-border);
  border-radius:var(--lsp-radius);
  padding:1.05rem 1rem;
}
.lsp-mini-list{ margin:.5rem 0 0; padding:0 0 0 1.1rem; color:var(--lsp-muted); line-height:1.7; }
.lsp-metrics{ display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; margin-top:.75rem; }
.lsp-metric{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  padding:.85rem .75rem;
  text-align:center;
}
.lsp-metric-n{ display:block; font-weight:950; letter-spacing:-.01em; }
.lsp-metric-l{ display:block; color:var(--lsp-dim); font-weight:800; font-size:.88rem; margin-top:.15rem; }

.lsp-testimonial{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--lsp-radius);
  padding:1.1rem 1rem;
}
.lsp-testimonial-text{ margin:0; color:rgba(255,255,255,.86); line-height:1.6; font-weight:700; }
.lsp-testimonial-meta{ margin:.7rem 0 0; color:var(--lsp-dim); font-weight:800; }

.lsp-commit{
  display:grid; grid-template-columns: 1.1fr .9fr; gap:1.2rem; align-items:start;
  background: linear-gradient(135deg, rgba(167,139,250,.10), rgba(59,130,246,.06), rgba(236,72,153,.08));
  border:1px solid rgba(255,255,255,.10);
  border-radius:26px;
  padding:1.4rem 1.25rem;
}
.lsp-commit-cards{ display:grid; gap:.75rem; }
.lsp-commit-cards .lsp-mini strong{ display:block; margin-bottom:.25rem; }
.lsp-commit-cards .lsp-mini span{ color:var(--lsp-muted); font-weight:700; }

.lsp-faq{ max-width:860px; margin:0 auto; display:grid; gap:.7rem; }
.lsp-faq-item{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--lsp-radius);
  overflow:hidden;
}
.lsp-faq-item summary{
  cursor:pointer;
  padding:1rem 1.05rem;
  list-style:none;
  font-weight:900;
  color:rgba(255,255,255,.92);
}
.lsp-faq-item summary::-webkit-details-marker{ display:none; }
.lsp-faq-body{ padding:0 1.05rem 1.05rem; color:var(--lsp-muted); line-height:1.65; font-weight:700; }

.lsp-final{
  padding:3.8rem 0 4.2rem;
  background: radial-gradient(850px 380px at 50% 0%, rgba(167,139,250,.22), transparent 60%), rgba(0,0,0,.18);
  border-top:1px solid rgba(255,255,255,.06);
}
.lsp-final-inner{
  text-align:center;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  border-radius:26px;
  padding:1.6rem 1.25rem;
  box-shadow: var(--lsp-shadow);
}

.lsp-wa-float{
  position:fixed;
  right:16px;
  bottom:16px;
  z-index:1002;
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.85rem 1rem;
  border-radius:999px;
  background: rgba(34,197,94,.14);
  border:1px solid rgba(34,197,94,.38);
  color:rgba(255,255,255,.92);
  text-decoration:none;
  font-weight:900;
  box-shadow: 0 14px 40px rgba(0,0,0,.45);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}
.lsp-wa-float:hover{
  transform: translateY(-2px);
  background: rgba(34,197,94,.18);
  border-color: rgba(34,197,94,.55);
  box-shadow: 0 18px 55px rgba(0,0,0,.52);
}
.lsp-wa-dot{
  width:10px; height:10px; border-radius:99px;
  background:#22c55e;
  box-shadow:0 0 0 6px rgba(34,197,94,.14);
}

@media (max-width: 980px){
  .lsp-hero-grid{ grid-template-columns:1fr; }
  .lsp-hero{ padding:3.7rem 0 1.5rem; }
  .lsp-hero-visual{ order:-1; }
  .lsp-mockup-cards{ grid-template-columns:repeat(3,1fr); }
  .lsp-grid-3{ grid-template-columns: repeat(2, 1fr); }
  .lsp-portfolio{ grid-template-columns: repeat(2, 1fr); }
  .lsp-offer{ grid-template-columns:1fr; }
  .lsp-metrics{ grid-template-columns:repeat(3,1fr); }
  .lsp-commit{ grid-template-columns:1fr; }
}

@media (max-width: 560px){
  /* HERO mobile: primeira dobra mais eficiente */
  .lsp-hero{ padding: 2.2rem 0 1.1rem; }
  .lsp-kicker{ padding:.38rem .65rem; font-size:.8rem; }
  .lsp-h1{ font-size: 1.9rem; line-height: 1.06; margin: .75rem 0 .6rem; }
  .lsp-sub{ font-size: .98rem; line-height: 1.5; margin: 0 0 .75rem; }
  .lsp-hero-price{ margin: .1rem 0 .85rem; font-size: .98rem; }
  .lsp-hero-ctas{ margin: .85rem 0 .85rem; gap: .65rem; }
  .lsp-btn{ padding: .88rem 1rem; border-radius: 14px; }

  /* No mobile, texto primeiro (CTA aparece cedo), mockup depois e menor */
  .lsp-hero-text{ order: 1; }
  .lsp-hero-visual{ order: 2; min-height: 240px; }
  .lsp-mockup-topbar{ padding: .7rem .85rem; }
  .lsp-mockup-body{ padding: .9rem; }
  .lsp-mockup-hero{ padding: .85rem; }
  .lsp-mockup-cards{ grid-template-columns: repeat(3, 1fr); gap: .55rem; margin-top: .75rem; }
  .lsp-mockup-card{ height: 54px; border-radius: 14px; }

  /* Autoridade: menos altura, mais compacto */
  .lsp-authority{ gap: .45rem; }
  .lsp-pill{ padding: .48rem .62rem; font-size: .86rem; }

  .lsp-grid-3{ grid-template-columns:1fr; }
  .lsp-portfolio{ grid-template-columns:1fr; }
  .lsp-mockup-cards{ grid-template-columns:1fr; }

  /* WhatsApp flutuante: mais discreto no mobile */
  .lsp-wa-float{
    right: 12px;
    bottom: 12px;
    padding: .66rem .78rem;
    font-size: .88rem;
    gap: .45rem;
    box-shadow: 0 12px 34px rgba(0,0,0,.42);
  }
  .lsp-wa-dot{ width: 9px; height: 9px; box-shadow: 0 0 0 5px rgba(34,197,94,.12); }
}

@media (prefers-reduced-motion: reduce){
  .lsp-btn, .lsp-wa-float{ transition:none; }
  .lsp-btn:hover, .lsp-wa-float:hover{ transform:none; }
}