/* Copiar el mismo CSS que usamos en el plugin */
body, h1, h2, h3, p, form, input, textarea, button { margin:0; padding:0; box-sizing:border-box; }
body { font-family: system-ui, sans-serif; line-height:1.5; color: #333; background: #f8f9fa; }
a { color: inherit; text-decoration: none; }

.ls-hero { text-align: center; padding: 80px 20px; background: #ffffff; }
.ls-hero h1 { font-size: 2.5rem; margin-bottom: 1rem; }
.ls-hero-text { max-width: 600px; margin: 0 auto; font-size: 1.125rem; }

.ls-benefits { display: flex; flex-wrap: wrap; justify-content:center; gap:20px; padding:60px 20px; background: #f1f5f9; }
.ls-benefits div { flex: 1 1 250px; background: #fff; padding:20px; border-radius:8px; box-shadow: 0 4px 12px rgba(0,0,0,0.05); text-align: center; }
.ls-benefits h3 { margin-bottom: 0.5rem; }

.ls-testimonials { padding:60px 20px; background: #ffffff; text-align: center; }
.ls-testimonials h2 { font-size: 2rem; margin-bottom:2rem; }
.ls-testimonials div { margin-bottom:1.5rem; }

.ls-contact { padding:60px 20px; background: #f1f5f9; max-width: 600px; margin: 0 auto; }
.ls-contact h2 { text-align: center; margin-bottom:1.5rem; }
.ls-contact form label { display: block; margin-bottom: 1rem; }
.ls-contact form input, .ls-contact form textarea {
    width:100%; padding:12px; border:1px solid #d1d5db; border-radius:6px;
}
.ls-contact form button {
    display: block; width:100%; padding:12px; background: #2563eb; color:#fff;
    border: none; border-radius:6px; cursor:pointer;
}
#ls-response { margin-top:1rem; text-align:center; font-size:0.95rem; }

@media (max-width: 600px) {
    .ls-hero h1 { font-size:2rem; }
    .ls-benefits { flex-direction: column; }
}