/* Landings por público (Views/Landing). Usa los colores y botones de Registro.css */

.lp-nav { display: flex; align-items: center; gap: 16px; font-size: .95rem; }

.lp-nav a { color: var(--muted); font-weight: 600; text-decoration: none; }

.lp-nav a:hover { color: var(--brand); }

.lp-nav .lp-nav-cta { padding: 8px 14px; color: #fff; background: var(--brand); border-radius: 999px; }

.lp-nav .lp-nav-cta:hover { color: #fff; background: var(--brand-dark); }

.lp { max-width: 1040px; margin: 0 auto; padding: 0 16px 56px; line-height: 1.65; color: var(--text); }

.lp-hero { display: grid; gap: 28px; align-items: center; padding: 36px 0 12px; }

.lp-antetitulo { margin: 0 0 8px; font-size: .85rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #A253D8; }

.lp-hero h1 { margin: 0 0 14px; font-size: clamp(1.8rem, 4vw, 2.6rem); line-height: 1.15; }

.lp-bajada { margin: 0 0 22px; font-size: 1.1rem; color: var(--muted); }

.lp-botones { display: flex; flex-wrap: wrap; gap: 10px; }

.lp-botones .btn, .lp-plan .btn, .lp-cta .btn { width: auto; padding-left: 24px; padding-right: 24px; }

.lp-btn-borde { color: var(--brand); background: var(--surface); border: 2px solid var(--brand-soft); }

.lp-btn-borde:hover { background: var(--brand-soft); }

.lp-hero-img { width: 100%; max-width: 440px; height: auto; justify-self: center; border-radius: 24px; box-shadow: var(--shadow); }

.lp-seccion { padding: 36px 0 8px; }

.lp-seccion h2 { margin: 0 0 14px; font-size: clamp(1.4rem, 3vw, 1.9rem); line-height: 1.2; color: var(--brand-dark); }

.lp-seccion h3 { margin: 18px 0 6px; font-size: 1.15rem; }

.lp-seccion p { margin: 0 0 12px; }

.lp-seccion ul { margin: 0 0 12px; padding-left: 22px; }

.lp-seccion li { margin: 6px 0; }

.lp a { color: var(--brand); font-weight: 600; }

.lp .btn { color: #fff; text-decoration: none; }

.lp .lp-btn-borde { color: var(--brand); }

/* Cómo funciona: 3 pasos */
.lp-pasos ol { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; counter-reset: paso; }

.lp-pasos li { position: relative; margin: 0; padding: 18px 18px 18px 64px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); counter-increment: paso; }

.lp-pasos li::before { content: counter(paso); position: absolute; left: 18px; top: 18px; display: grid; place-items: center; width: 32px; height: 32px; font-weight: 800; color: #fff; background: linear-gradient(148deg, #A253D8, #1545CB); border-radius: 50%; }

.lp-pasos li h3 { margin: 0 0 4px; }

.lp-pasos li p { margin: 0; color: var(--muted); }

/* Plan */
.lp-plan-caja { max-width: 520px; padding: 22px 24px; background: var(--surface); border: 2px solid #A253D8; border-radius: var(--radius); box-shadow: var(--shadow); }

.lp-plan-caja h3 { margin: 0; }

.lp-precio { margin: 6px 0 4px !important; font-size: 2rem; font-weight: 800; color: var(--text); }

.lp-precio small { font-size: .95rem; font-weight: 600; color: var(--muted); }

.lp-plan-nota { color: var(--muted); }

.lp-plan-pie { margin-top: 16px !important; font-size: .92rem; color: var(--muted); }

/* Privacidad */
.lp-privacidad { margin-top: 24px; padding: 24px; background: var(--brand-soft); border-radius: var(--radius); }

/* Preguntas frecuentes */
.lp-faq details { margin: 0 0 10px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }

.lp-faq summary { padding: 14px 18px; cursor: pointer; list-style-position: inside; }

.lp-faq summary h3 { display: inline; margin: 0; font-size: 1.02rem; }

.lp-faq details p { margin: 0; padding: 0 18px 16px; color: var(--muted); }

/* Llamado final y relacionadas */
.lp-cta { margin: 36px 0 0; padding: 32px 24px; text-align: center; color: #fff; background: linear-gradient(148deg, #A253D8, #1545CB); border-radius: 24px; }

.lp-cta h2 { margin: 0 0 8px; color: #fff; }

.lp-cta p { margin: 0 auto 18px; max-width: 560px; color: rgba(255, 255, 255, .9); }

.lp-cta .btn { color: var(--brand); background: #fff; }

.lp-relacionadas { margin-top: 28px; }

.lp-relacionadas p { margin: 0 0 6px; font-weight: 700; }

.lp-relacionadas ul { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0; padding: 0; list-style: none; }

.lp-todo { padding: 14px 18px; color: #8a5a00; background: #fff4d6; border-radius: 12px; }

.lp-pie { padding: 28px 16px 40px; text-align: center; font-size: .9rem; color: var(--muted); background: var(--surface); border-top: 1px solid var(--border); }

.lp-pie ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; margin: 0 0 12px; padding: 0; list-style: none; }

.lp-pie a { color: var(--muted); }

@media (min-width: 820px) {
    .lp-hero { grid-template-columns: 1.2fr 1fr; padding-top: 48px; }
    .lp-pasos ol { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 560px) {
    .lp-nav a:not(.lp-nav-cta) { display: none; }
}
