/* ================================================================
   Need English Now · portada (landing v2)
   Diseño aprobado en _referencia/index.html, pasado a clases lp2- (la CSP no admite estilos en línea).
   Colores: variables de theme.css. Donde el diseño no llegaba al contraste AA (texto blanco sobre --brand o
   --green-bg, gris #777) se usan los tonos más oscuros de la misma marca.
   Responsive: @media (max-width: 820px), equivalente a la @container de la referencia (la página ocupa todo el ancho).
   ================================================================ */

.lp2-body {
    --lp2-muted: #5f5f5f;      /* textos secundarios (6:1 sobre el fondo) */
    --lp2-soft-ink: #6b6b6b;   /* etiquetas pequeñas (5,3:1 sobre blanco) */
    --lp2-line: #eef0f3;
    --lp2-gold-ink: #8a5a00;
    --lp2-header-h: 72px;
    margin: 0;
    background: var(--canvas);
    font-family: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
    font-weight: 600;
    color: var(--ink);
}
html:has(.lp2-body) { scroll-behavior: smooth; scrollbar-gutter: auto; }
.lp2 { width: 100%; overflow-x: clip; }
.lp2 section[id] { scroll-margin-top: calc(var(--lp2-header-h) + 12px); }
.lp2 h1, .lp2 h2, .lp2 h3, .lp2 p, .lp2 ul, .lp2 ol { margin: 0; }
.lp2 ul, .lp2 ol { padding: 0; list-style: none; }
.lp2 a { color: var(--brand-strong); }
.lp2 :focus-visible { outline: 3px solid var(--brand-strong); outline-offset: 3px; border-radius: 6px; }
.lp2-wrap { max-width: 1200px; margin: 0 auto; box-sizing: border-box; }
.lp2-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.lp2-show-m { display: none !important; }

/* Botones «3D»: sombra sólida inferior que se hunde al pulsar */
.b3d {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    min-height: 52px; padding: 0 28px; box-sizing: border-box;
    border: 0; border-radius: 16px; cursor: pointer;
    font-family: inherit; font-weight: 900; font-size: 15px; letter-spacing: .08em; text-transform: uppercase;
    text-decoration: none; transition: transform .08s ease, box-shadow .08s ease, background-color .12s ease;
}
.b3d:active { transform: translateY(4px); }
.lp2 .b-blue { background: var(--brand-strong); color: #fff; box-shadow: 0 5px 0 var(--brand-shadow); }
.lp2 .b-blue:hover { background: var(--brand-shadow); color: #fff; }
.lp2 .b-blue:active { box-shadow: 0 1px 0 var(--brand-shadow); }
.lp2 .b-ghost { background: #fff; color: var(--brand-strong); border: 2px solid var(--line-strong); box-shadow: 0 5px 0 var(--line-strong); }
.lp2 .b-ghost:hover { background: #f1f7fe; color: var(--brand-shadow); }
.lp2 .b-ghost:active { box-shadow: 0 1px 0 var(--line-strong); }
.lp2 .b-white { background: #fff; color: var(--brand-strong); box-shadow: 0 5px 0 var(--brand-line); }
.lp2 .b-white:hover { background: #f1f7fe; color: var(--brand-shadow); }
.lp2 .b-white:active { box-shadow: 0 1px 0 var(--brand-line); }
.lp2 .b-white-gold { align-self: flex-start; background: #fff; color: var(--lp2-gold-ink); border: 2px solid var(--gold); box-shadow: 0 5px 0 var(--gold-shadow); }
.lp2 .b-white-gold:active { box-shadow: 0 1px 0 var(--gold-shadow); }
.b3d.b-sm { min-height: 44px; padding: 0 18px; font-size: 13px; }
.b3d.b-md { min-height: 50px; padding: 0 22px; font-size: 14px; }
.b3d.b-lg { min-height: 58px; padding: 0 30px; font-size: 16px; }
.b3d.b-xl { min-height: 62px; padding: 0 40px; font-size: 17px; margin-top: 8px; }

/* Cabecera fija */
.lp2-header { position: sticky; top: 0; z-index: 10; background: rgba(255, 255, 255, .94); border-bottom: 2px solid var(--lp2-line); backdrop-filter: saturate(1.4) blur(6px); }
.lp2-hdr { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 24px; }
.lp2-logo { display: flex; align-items: center; min-height: 44px; text-decoration: none; color: var(--ink-strong); }
.lp2-logo .brand-mark { width: 40px; height: 40px; }
.lp2-logo .brand-name { font-size: 19px; }
.lp2-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; }
.lp2 .lp2-navlink { padding: 10px 4px; color: var(--lp2-muted); font-weight: 800; font-size: 15px; text-decoration: none; }
.lp2 .lp2-navlink:hover { color: var(--brand-strong); }
.lp2-hdr-actions { display: flex; align-items: center; gap: 12px; }
.lp2-burger { width: 48px; height: 48px; padding: 0; align-items: center; justify-content: center; border: 2px solid var(--line); border-radius: 14px; background: #fff; box-shadow: 0 3px 0 var(--line); color: var(--ink-strong); cursor: pointer; }
.lp2-menu { display: flex; flex-direction: column; padding: 4px 16px 20px; background: #fff; border-top: 2px solid var(--lp2-line); box-shadow: 0 12px 24px -12px rgba(31, 35, 40, .18); }
.lp2-menu[hidden] { display: none; }
.lp2 .lp2-mlink { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 0 6px; border-bottom: 2px solid var(--lp2-line); color: var(--ink-strong); font-weight: 900; font-size: 18px; text-decoration: none; }
.lp2-mlink span { color: var(--brand-strong); }
.lp2-menu-ctas { display: flex; flex-direction: column; gap: 12px; padding-top: 18px; }
.lp2-notice { max-width: 1200px; margin: 16px auto 0; padding: 14px 18px; box-sizing: border-box; border: 2px solid #b2f2bb; border-radius: 16px; background: var(--green-soft); color: #2b6a00; font-weight: 800; }

/* Hero */
.lp2-hero { padding: 72px 24px 96px; background: radial-gradient(circle at 85% 20%, rgba(88, 204, 2, .14) 0, rgba(88, 204, 2, 0) 40%), linear-gradient(180deg, var(--brand-soft) 0%, var(--canvas) 100%); }
.lp2-hero-row { display: flex; flex-wrap: wrap; align-items: center; gap: 56px; }
.lp2-hero-text { flex: 1 1 480px; min-width: 0; display: flex; flex-direction: column; gap: 26px; }
.lp2-pill { display: inline-flex; align-self: flex-start; align-items: center; gap: 8px; padding: 6px 14px 6px 8px; border: 2px solid var(--brand-line); border-radius: 999px; background: #fff; color: var(--brand-strong); font-weight: 800; font-size: 14px; }
.lp2-pill-tag { padding: 2px 9px; border-radius: 999px; background: var(--brand-strong); color: #fff; font-size: 12px; font-weight: 900; letter-spacing: .06em; }
.lp2-h1 { font-weight: 900; font-size: clamp(40px, 6vw, 72px); line-height: 1.02; letter-spacing: -.03em; color: var(--ink-strong); }
.lp2-mark { padding: 0 4px; color: var(--brand); background: linear-gradient(180deg, transparent 62%, #ffe08a 62%, #ffe08a 92%, transparent 92%); }
.lp2-lead { max-width: 540px; font-size: 20px; line-height: 1.55; color: var(--lp2-muted); }
.lp2-lead strong { color: var(--ink-strong); font-weight: 800; }
.lp2-hero-ctas { display: flex; flex-wrap: wrap; gap: 16px; padding-top: 4px; }
.lp2-checks { display: flex; flex-wrap: wrap; gap: 10px 22px; font-weight: 800; font-size: 15px; color: var(--lp2-muted); }
.lp2-checks li { display: inline-flex; align-items: center; gap: 8px; }
.lp2-check { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--green-bg); }

/* Teléfono y mini ejercicio */
.lp2-phone-wrap { position: relative; flex: 1 1 400px; min-width: 0; display: flex; justify-content: center; padding: 24px 0; }
.lp2-float { position: absolute; z-index: 2; display: flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 14px; font-weight: 900; font-size: 14px; }
.lp2-float-streak { top: 0; left: 4%; background: #fff; border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); color: var(--ink-strong); transform: rotate(-4deg); }
.lp2-float-xp { bottom: 8px; right: 4%; background: #fff; border: 2px solid #ffe08a; box-shadow: 0 4px 0 #ffd43b; color: var(--lp2-gold-ink); font-size: 15px; gap: 6px; transform: rotate(3deg); }
.lp2-float-side { top: 46%; left: -2%; padding: 10px 14px; background: var(--brand-strong); color: #fff; box-shadow: 0 4px 0 var(--brand-shadow); font-size: 13px; transform: rotate(-2deg); }
.lp2-phone { width: 340px; max-width: 100%; padding: 12px; box-sizing: border-box; border-radius: 44px; background: var(--ink-strong); box-shadow: 0 30px 60px -20px rgba(24, 100, 171, .45); transform: rotate(2deg); }
.lp2-screen { display: flex; flex-direction: column; gap: 18px; min-height: 560px; padding: 22px 20px 20px; box-sizing: border-box; border-radius: 34px; background: #fff; }
.lp2-q-top { display: flex; align-items: center; gap: 12px; }
.lp2-q-bar { flex: 1; height: 14px; overflow: hidden; border-radius: 999px; background: var(--line); }
.lp2-q-fill { width: 35%; height: 100%; border-radius: 999px; background: var(--green-bg); transition: width .3s; }
.lp2-q-title { font-weight: 900; font-size: 20px; color: var(--ink-strong); }
.lp2-q-source { display: flex; align-items: center; gap: 12px; }
.lp2-q-speaker { display: flex; align-items: center; justify-content: center; flex: none; width: 48px; height: 48px; border-radius: 14px; background: var(--brand-strong); box-shadow: 0 3px 0 var(--brand-shadow); }
.lp2-q-speaker.is-sm { width: 44px; height: 44px; border-radius: 12px; }
.lp2-q-text { padding: 10px 14px; border: 2px solid var(--line); border-radius: 14px; font-weight: 800; font-size: 16px; color: var(--ink); }
.lp2-q-slots { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px; min-height: 104px; padding: 10px 0; box-sizing: border-box; border-top: 2px solid var(--line); border-bottom: 2px solid var(--line); }
.lp2-q-bank { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.lp2-q-spacer { flex: 1; }
.lp2-chip { min-height: 44px; padding: 8px 14px; box-sizing: border-box; border: 2px solid var(--line); border-radius: 12px; background: #fff; box-shadow: 0 3px 0 var(--line); font-family: inherit; font-weight: 800; font-size: 15px; color: var(--ink); cursor: pointer; }
.lp2-chip:hover { border-color: var(--brand-line); box-shadow: 0 3px 0 var(--brand-line); }
.lp2-chip-gap { display: inline-block; min-width: 60px; height: 44px; border-radius: 12px; background: var(--line); }
.lp2-q-result { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border-radius: 16px; }
.lp2-q-result[hidden], .lp2-q-idle[hidden] { display: none; }
.lp2-q-result.is-ok { background: var(--green-soft); color: #2b6a00; }
.lp2-q-result.is-bad { background: var(--red-soft); color: #c92a2a; }
.lp2-q-result-title { font-weight: 900; font-size: 17px; }
.lp2-q-result-text { font-weight: 800; }
.lp2-q-reset { min-height: 44px; margin-top: 8px; border: 0; border-radius: 12px; font-family: inherit; font-weight: 900; font-size: 14px; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.lp2-q-reset.is-ok { background: var(--green-bg); box-shadow: 0 4px 0 var(--green-shadow); color: var(--ink-strong); }
.lp2-q-reset.is-bad { background: #c92a2a; box-shadow: 0 4px 0 #a51d1d; color: #fff; }
.lp2-q-idle { padding: 8px 0; text-align: center; font-weight: 800; font-size: 13px; color: var(--lp2-soft-ink); }

/* Cifras */
.lp2-stats-sec { position: relative; z-index: 1; margin-top: -48px; padding: 0 24px; }
.lp2-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1100px; margin: 0 auto; overflow: hidden; border: 2px solid var(--line); border-radius: 28px; background: #fff; box-shadow: 0 6px 0 var(--line); }
.lp2-stat { display: flex; align-items: center; gap: 16px; padding: 28px 24px; }
.lp2-stat + .lp2-stat { border-left: 2px solid var(--lp2-line); }
.lp2-stat-icon { display: flex; align-items: center; justify-content: center; flex: none; width: 52px; height: 52px; border-radius: 16px; }
.lp2-stat-icon.is-blue, .lp2-ficon.is-blue { background: var(--brand-soft); color: var(--brand); }
.lp2-stat-icon.is-green, .lp2-ficon.is-green { background: var(--green-soft); color: var(--green-shadow); }
.lp2-stat-icon.is-gold, .lp2-ficon.is-gold { background: #fff4d6; color: #c98a00; }
.lp2-stat-icon.is-purple, .lp2-ficon.is-purple { background: var(--purple-soft); color: #7b3fc4; }
.lp2-ficon.is-orange { background: #fff0e0; }
.lp2-stat-num { font-weight: 900; font-size: 36px; line-height: 1; color: var(--ink-strong); }
.lp2-stat-label { margin-top: 4px !important; font-weight: 800; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--lp2-soft-ink); }

/* Secciones y titulares */
.lp2-sec { padding: 100px 24px; }
.lp2-sec-method { padding-top: 120px; padding-bottom: 40px; }
.lp2-sec-include { padding-top: 40px; }
.lp2-stack { display: flex; flex-direction: column; gap: 48px; }
.lp2-sec-method .lp2-stack { gap: 56px; }
.lp2-head { display: flex; flex-direction: column; gap: 14px; }
.lp2-head.is-center { align-items: center; text-align: center; }
.lp2-head.is-split { flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px; }
.lp2-head.is-split > .lp2-head { max-width: 640px; }
.lp2-kicker { font-weight: 900; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-strong); }
.lp2-kicker.is-gold { color: var(--lp2-gold-ink); }
.lp2-h2 { max-width: 760px; font-weight: 900; font-size: clamp(32px, 4vw, 48px); line-height: 1.08; letter-spacing: -.02em; color: var(--ink-strong); }
.lp2-h2.is-big { font-size: clamp(36px, 5vw, 60px); line-height: 1; letter-spacing: -.03em; }
.lp2-h2.is-white { color: #fff; }
.lp2-blue { color: var(--brand); }
.lp2-sub { max-width: 620px; font-size: 18px; line-height: 1.6; color: var(--lp2-muted); }
.lp2-h3 { font-weight: 900; font-size: 21px; color: var(--ink-strong); }
.lp2-h3.is-white { color: #fff; font-size: 26px; }
.lp2-text { font-size: 16px; line-height: 1.6; color: var(--lp2-muted); }
.lp2-card { padding: 28px; box-sizing: border-box; border: 2px solid var(--line); border-radius: 28px; background: #fff; box-shadow: 0 6px 0 var(--line); }

/* Cómo funciona */
.lp2-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 28px; }
.lp2-step { display: flex; flex-direction: column; gap: 18px; }
.lp2-step .lp2-h3 { font-size: 24px; }
.lp2-step-head { display: flex; align-items: center; gap: 12px; }
.lp2-num { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; font-weight: 900; font-size: 20px; }
.lp2-num.is-blue { background: var(--brand-strong); box-shadow: 0 3px 0 var(--brand-shadow); color: #fff; }
.lp2-num.is-green { background: var(--green-bg); box-shadow: 0 3px 0 var(--green-shadow); color: var(--ink-strong); }
.lp2-num.is-gold { background: var(--gold); box-shadow: 0 3px 0 var(--gold-shadow); color: var(--ink-strong); }
.lp2-demo { display: flex; flex-direction: column; gap: 12px; padding: 20px; border-radius: 20px; }
.lp2-demo.is-blue { background: var(--brand-soft); gap: 10px; }
.lp2-demo.is-green { background: var(--green-soft); }
.lp2-demo.is-gold { background: #fff8e1; }
.lp2-word { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; border: 2px solid var(--brand-line); border-radius: 16px; background: #fff; }
.lp2-word-en { font-weight: 900; font-size: 24px; color: var(--ink-strong); }
.lp2-word-es { font-weight: 700; font-size: 15px; color: var(--lp2-soft-ink); }
.lp2-word-example { padding: 12px 18px; border-radius: 16px; background: #fff; font-weight: 800; font-size: 15px; color: var(--lp2-soft-ink); }
.lp2-word-example span { color: var(--brand-strong); }
.lp2-demo-q { font-weight: 900; font-size: 17px; color: var(--ink-strong); }
.lp2-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.lp2-options span { padding: 10px; border: 2px solid var(--line); border-radius: 12px; background: #fff; text-align: center; font-weight: 800; }
.lp2-options .is-right { border-color: var(--green-bg); box-shadow: 0 3px 0 var(--green-bg); font-weight: 900; color: #2b6a00; }
.lp2-review-head { display: flex; justify-content: space-between; font-weight: 800; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: #7a5c00; }
.lp2-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.lp2-days span { aspect-ratio: 1; box-sizing: border-box; border: 2px dashed var(--gold-shadow); border-radius: 8px; background: #fff; }
.lp2-days .is-on { border: 0; background: var(--gold); }
.lp2-days .is-half { border: 0; background: #ffe08a; }
.lp2-review-note { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 15px; color: var(--ink); }

/* Niveles en escalera */
.lp2-stairs { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px; }
.lp2-stair { flex: 1 1 150px; min-width: 0; display: flex; flex-direction: column; gap: 10px; padding: 20px 18px; box-sizing: border-box; border: 2px solid var(--line); border-radius: 22px; background: #fff; box-shadow: 0 5px 0 var(--line); }
.lp2-stair p { font-size: 14px; line-height: 1.5; color: var(--lp2-muted); }
.lp2-stair-title { font-weight: 900; font-size: 17px; color: var(--ink-strong); }
.lp2-stair.s1 { min-height: 210px; } .lp2-stair.s2 { min-height: 236px; } .lp2-stair.s3 { min-height: 262px; }
.lp2-stair.s4 { min-height: 288px; } .lp2-stair.s5 { min-height: 314px; } .lp2-stair.s6 { min-height: 340px; } .lp2-stair.s7 { min-height: 366px; }
.lp2-stair.is-blue { background: var(--brand-strong); border-color: var(--brand-strong); box-shadow: 0 5px 0 var(--brand-shadow); }
.lp2-stair.is-blue .lp2-stair-title, .lp2-stair.is-blue p { color: #fff; }
.lp2-stair.is-gold { background: linear-gradient(160deg, #fff4d6 0%, #ffe8b0 100%); border-color: #ffd43b; box-shadow: 0 5px 0 var(--gold-shadow); }
.lp2-stair.is-gold p { color: #6b5300; }
.lp2-tag { display: flex; align-items: center; gap: 4px; align-self: flex-start; padding: 4px 10px; border-radius: 10px; font-weight: 900; font-size: 14px; }
.t-starter { background: var(--green-soft); color: #2b6a00; }
.t-a1 { background: #d3f9d8; color: #24692f; }
.t-a2 { background: var(--brand-soft); color: var(--brand-shadow); }
.t-b1 { background: #fff; color: var(--brand-shadow); }
.t-b2 { background: #edf2ff; color: #3b5bdb; }
.t-c1 { background: var(--purple-soft); color: #7b3fc4; }
.t-c2 { background: var(--gold); color: var(--ink-strong); }

/* Qué incluye (bento) */
.lp2-bento { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 20px; }
.lp2-bento-hero { grid-column: 1 / -1; min-width: 0; display: flex; flex-direction: column; gap: 14px; padding: 30px; border-radius: 28px; background: var(--brand-strong); box-shadow: 0 6px 0 var(--brand-shadow); color: #fff; }
.lp2-bento-hero > p { max-width: 460px; font-size: 17px; line-height: 1.6; color: #fff; }
.lp2-levels-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.lp2-levels-row span { padding: 4px 10px; border: 2px solid rgba(255, 255, 255, .55); border-radius: 10px; font-weight: 900; font-size: 14px; }
.lp2-levels-row .is-you { border-color: #fff; background: #fff; color: var(--brand-shadow); }
.lp2-feature { display: flex; flex-direction: column; gap: 12px; padding: 30px; }
.lp2-ficon { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 16px; }
.lp2-wave { display: flex; align-items: center; gap: 4px; height: 36px; margin-top: auto; }
.lp2-wave span { width: 5px; border-radius: 3px; background: var(--purple); }
.lp2-wave .is-soft { background: #c9a6f2; }
.lp2-wave .h20 { height: 20%; } .lp2-wave .h30 { height: 30%; } .lp2-wave .h40 { height: 40%; } .lp2-wave .h45 { height: 45%; }
.lp2-wave .h50 { height: 50%; } .lp2-wave .h60 { height: 60%; } .lp2-wave .h65 { height: 65%; } .lp2-wave .h70 { height: 70%; }
.lp2-wave .h85 { height: 85%; } .lp2-wave .h100 { height: 100%; }
.lp2-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; text-align: center; font-weight: 900; font-size: 12px; color: var(--lp2-soft-ink); }
.lp2-week span { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.lp2-week span::before { content: ""; width: 26px; height: 26px; border-radius: 50%; background: var(--line); }
.lp2-week .is-on::before { background: var(--orange); }

/* Gratis, de verdad */
.lp2-sec-free { padding: 0 24px 100px; }
.lp2-free { display: flex; flex-wrap: wrap; align-items: center; gap: 48px; padding: clamp(24px, 5vw, 64px); border: 2px solid #ffe8a3; border-radius: 32px; background: linear-gradient(135deg, #fff9db 0%, #fff4e6 100%); }
.lp2-free-text { flex: 1 1 380px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.lp2-free-text .lp2-sub { max-width: 460px; }
.lp2-nolist { flex: 1 1 420px; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.lp2-nolist li { display: flex; align-items: center; gap: 12px; padding: 18px 20px; border-radius: 20px; background: #fff; font-weight: 900; font-size: 17px; color: var(--ink-strong); }
.lp2-nolist .is-yes { grid-column: 1 / -1; padding: 20px 22px; gap: 14px; background: var(--green-bg); box-shadow: 0 5px 0 var(--green-shadow); font-size: 19px; }
.lp2-x, .lp2-yes { display: flex; align-items: center; justify-content: center; flex: none; border-radius: 50%; }
.lp2-x { width: 32px; height: 32px; background: var(--red-soft); }
.lp2-yes { width: 36px; height: 36px; background: #fff; }

/* Preguntas frecuentes */
.lp2-sec-faq { padding: 0 24px 110px; }
.lp2-faq { max-width: 860px; display: flex; flex-direction: column; gap: 36px; }
.lp2-faq .lp2-h2 { font-size: clamp(30px, 4vw, 44px); line-height: 1.1; }
.lp2-faq-list { display: flex; flex-direction: column; gap: 14px; }
.lp2-details { padding: 0 24px; border: 2px solid var(--line); border-radius: 20px; background: #fff; box-shadow: 0 4px 0 var(--line); }
.lp2-details summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 68px; list-style: none; cursor: pointer; font-weight: 900; font-size: 18px; color: var(--ink-strong); }
.lp2-details summary::-webkit-details-marker { display: none; }
.lp2-details p { padding: 0 0 22px; font-size: 16px; line-height: 1.6; color: var(--lp2-muted); }
.lp2-plus { line-height: 1; font-size: 28px; color: var(--brand-strong); transition: transform .2s; }
.lp2-details[open] .lp2-plus { transform: rotate(45deg); }

/* Llamada final */
.lp2-cta { position: relative; overflow: hidden; padding: 100px 24px; background: var(--brand-strong); }
.lp2-cta-blob { position: absolute; border-radius: 50%; }
.lp2-cta-blob.is-a { width: 420px; height: 420px; top: -180px; left: -120px; background: var(--brand); }
.lp2-cta-blob.is-b { width: 300px; height: 300px; bottom: -140px; right: -60px; background: var(--brand-shadow); }
.lp2-cta-inner { position: relative; max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 22px; text-align: center; color: #fff; }
.lp2-cta-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.lp2-cta-chips span { padding: 8px 14px; border-radius: 12px; font-weight: 900; color: var(--ink-strong); }
.lp2-cta-chips .is-white { background: #fff; box-shadow: 0 3px 0 var(--brand-line); }
.lp2-cta-chips .is-gold { background: var(--gold); box-shadow: 0 3px 0 var(--gold-shadow); }
.lp2-cta-chips .is-green { background: var(--green-bg); box-shadow: 0 3px 0 var(--green-shadow); }
.lp2-cta-text { font-size: 19px; line-height: 1.6; color: #fff; }

/* Pie */
.lp2-footer { padding: 48px 24px 32px; border-top: 2px solid var(--lp2-line); background: #fff; }
.lp2-foot { display: flex; flex-direction: column; gap: 32px; }
.lp2-foot-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 32px; }
.lp2-foot-brand { display: flex; flex-direction: column; gap: 12px; max-width: 360px; color: var(--ink-strong); }
.lp2-foot-brand p { font-size: 15px; line-height: 1.6; color: var(--lp2-soft-ink); }
.lp2-foot-cols { display: flex; flex-wrap: wrap; gap: 48px; }
.lp2-foot-col { display: flex; flex-direction: column; gap: 4px; }
.lp2-foot-title { margin-bottom: 6px !important; font-weight: 900; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-strong); }
.lp2 .lp2-foot-col a { display: inline-flex; align-items: center; min-height: 32px; color: var(--lp2-soft-ink); font-weight: 700; text-decoration: none; }
.lp2 .lp2-foot-col a:hover { color: var(--brand-strong); text-decoration: underline; }
.lp2 .lp2-foot-col a.is-strong { color: var(--brand-strong); font-weight: 800; }
.lp2-foot-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 22px; border-top: 2px solid var(--lp2-line); font-size: 14px; color: var(--lp2-soft-ink); }
.lp2-love { display: inline-flex; align-items: center; gap: 6px; }

/* Barra inferior (solo móvil) */
.lp2-mbar { position: sticky; bottom: 0; z-index: 20; align-items: center; gap: 12px; padding: 12px 16px 16px; border-top: 2px solid var(--lp2-line); background: rgba(255, 255, 255, .96); }
.lp2-mbar-text { flex: 1; min-width: 0; line-height: 1.2; }
.lp2-mbar-text p:first-child { font-weight: 900; font-size: 15px; color: var(--ink-strong); }
.lp2-mbar-text p:last-child { font-weight: 700; font-size: 13px; color: var(--lp2-soft-ink); }

/* Páginas legales (privacidad, condiciones): franja como el inicio de la portada + texto en tarjeta */
.lp2-page-hero { padding: 56px 24px 88px; background: radial-gradient(circle at 85% 20%, rgba(88, 204, 2, .14) 0, rgba(88, 204, 2, 0) 40%), linear-gradient(180deg, var(--brand-soft) 0%, var(--canvas) 100%); }
.lp2-page-hero-inner { display: flex; flex-direction: column; gap: 14px; }
.lp2 .lp2-page-title { font-size: clamp(36px, 5vw, 56px); line-height: 1.04; letter-spacing: -.03em; }
.lp2-tabs { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 8px; }
.lp2 .lp2-tab { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 2px solid var(--line-strong); border-radius: 14px; background: #fff; box-shadow: 0 4px 0 var(--line-strong); color: var(--lp2-muted); font-weight: 900; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; }
.lp2 .lp2-tab:hover { color: var(--brand-strong); }
.lp2 .lp2-tab.is-active { border-color: var(--brand-strong); background: var(--brand-strong); box-shadow: 0 4px 0 var(--brand-shadow); color: #fff; }
.lp2-legal-sec { margin-top: -56px; padding: 0 24px 100px; position: relative; }
.lp2 .lp2-legal { display: block; max-width: 1200px; padding: clamp(24px, 4vw, 56px); border: 2px solid var(--line); border-radius: 28px; background: #fff; box-shadow: 0 6px 0 var(--line); }
.lp2-legal h2 { margin: 36px 0 12px; font-weight: 900; font-size: 22px; letter-spacing: -.01em; color: var(--ink-strong); }
.lp2-legal h2:first-child { margin-top: 0; }
.lp2-legal p, .lp2-legal ul { max-width: 80ch; margin: 0 0 12px; font-size: 17px; line-height: 1.65; color: var(--lp2-muted); }
.lp2-legal ul { padding-left: 1.25rem; list-style: disc; }
.lp2-legal li { margin-bottom: 8px; }
.lp2-legal strong { color: var(--ink-strong); }

@media (max-width: 820px) {
    .lp2-body { --lp2-header-h: 68px; }
    .lp2-page-hero { padding: 36px 16px 80px; }
    .lp2-legal-sec { padding: 0 16px 72px; }
    .lp2-tabs .lp2-tab { flex: 1 1 auto; justify-content: center; }
    .lp2-hide-m { display: none !important; }
    .lp2-show-m { display: flex !important; }
    .lp2-hdr { padding: 10px 16px; }
    .lp2-hero { padding: 36px 16px 80px; }
    .lp2-hero-row { gap: 36px; }
    .lp2-hero-ctas a { flex: 1 1 100%; }
    .lp2-float-side { display: none; }
    .lp2-phone { transform: none; }
    .lp2-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lp2-stat { flex-direction: column; align-items: flex-start; gap: 10px; padding: 20px 16px; }
    .lp2-stat + .lp2-stat { border-left: 0; }
    .lp2-stat:nth-child(odd) { border-right: 2px solid var(--lp2-line); }
    .lp2-stat:nth-child(-n+2) { border-bottom: 2px solid var(--lp2-line); }
    .lp2-sec, .lp2-sec-method { padding: 72px 16px 40px; }
    .lp2-sec-include { padding-top: 40px; }
    .lp2-sec-free, .lp2-sec-faq { padding-left: 16px; padding-right: 16px; }
    .lp2-stats-sec { padding: 0 16px; }
    .lp2-stair { flex-basis: 100%; min-height: 0 !important; }
    .lp2-card, .lp2-feature, .lp2-bento-hero { padding: 22px; }
    .lp2-free { border-radius: 24px; }
    .lp2-cta { padding: 72px 16px 96px; }
    .lp2-footer { padding-left: 16px; padding-right: 16px; }
    .lp2-steps { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    html:has(.lp2-body) { scroll-behavior: auto; }
    .lp2 *, .lp2 *::before, .lp2 *::after { transition: none !important; animation: none !important; }
    .b3d:active { transform: none; }
}