/* CSS de la landing trazos-en-juego (extraído del index.html original por tools/migrate_landing_html.php). */

:root{
  --bg:#FBF9FF; --bg2:#F4F0FF; --card:#FFFFFF; --ink:#241E38; --muted:#655E7A; --muted2:#9C96B0;
  --orange:#7C3AED; --orange2:#EC4899; --yellow:#FFC53D; --yellow-soft:#FFF1C2;
  --teal:#4F46E5; --teal-dark:#4338CA; --green:#16A34A; --green-bg:#E7F8EE;
  --red:#E11D48; --line:#EDE7FA; --line2:#E3DBF7;
  --radius:16px; --radius-lg:24px;
  --shadow:0 10px 30px rgba(76,40,130,.08);
  --shadow-lg:0 20px 55px rgba(124,58,237,.16);
  --font-head:"Baloo 2","Inter",system-ui,sans-serif;
  --font-body:"Inter",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--bg);color:var(--ink);line-height:1.55;font-size:16px;padding-bottom:86px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--font-head);font-weight:800;line-height:1.08;letter-spacing:-.01em}
img{max-width:100%;height:auto;display:block}
a{color:var(--orange)}
.wrap{width:min(920px,92%);margin:0 auto}
.wrap-wide{width:min(1080px,92%);margin:0 auto}

/* Top urgency bar */
.offer-bar{background:linear-gradient(90deg,#7C3AED,#EC4899,#7C3AED);color:#fff;padding:10px 12px;font-size:13px;font-weight:800;text-align:center;position:sticky;top:0;z-index:80;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;box-shadow:0 2px 14px rgba(124,58,237,.3)}
.offer-bar .lbl{letter-spacing:.05em;text-transform:uppercase;font-size:12px}
.offer-bar .timer{display:inline-flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums}
.offer-bar .tbox{background:rgba(0,0,0,.28);color:#fff;padding:3px 8px;border-radius:8px;font-weight:800;min-width:2.4ch;text-align:center;font-size:14px}
.offer-bar .sep{opacity:.8;font-weight:800}

/* Hero */
.hero{padding:40px 0 52px;text-align:center;background:radial-gradient(ellipse 70% 45% at 50% 0%,#EAE0FF 0%,transparent 65%),radial-gradient(ellipse 40% 30% at 85% 15%,rgba(236,72,153,.10),transparent 60%),var(--bg)}
.tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:18px}
.tag{display:inline-flex;align-items:center;gap:5px;padding:7px 14px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.tag-orange{background:linear-gradient(135deg,var(--orange),var(--orange2));color:#fff;box-shadow:0 4px 14px rgba(124,58,237,.3)}
.tag-dark{background:#22201B;color:#fff}
.tag-teal{background:var(--teal);color:#fff}
.hero h1{font-size:clamp(1.9rem,5.2vw,3rem);margin:0 auto 12px;max-width:20ch;color:var(--ink)}
.hero h1 .hi{background:linear-gradient(135deg,var(--orange),var(--orange2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lead{color:#483F62;font-size:1.05rem;font-weight:500;max-width:46ch;margin:0 auto 18px;line-height:1.6}
.checks{list-style:none;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:24px;padding:0}
.checks li{background:#fff;color:#5B21B6;border:1.5px solid rgba(124,58,237,.28);padding:7px 14px;border-radius:999px;font-size:13px;font-weight:700;display:inline-flex;align-items:center;gap:5px;box-shadow:var(--shadow)}

/* Price card */
.hero-cta{max-width:440px;margin:0 auto 26px;text-align:center}.hero-cta .cta{display:block}
.price-card{background:#fff;border:2px solid rgba(124,58,237,.3);border-radius:var(--radius-lg);padding:26px 22px;max-width:440px;margin:0 auto 26px;box-shadow:var(--shadow-lg);text-align:center;position:relative;overflow:hidden}
.price-card::before{content:'🔥 OFERTA 70% OFF';position:absolute;top:0;left:0;right:0;background:linear-gradient(90deg,var(--orange),var(--orange2));color:#fff;font-size:11px;font-weight:800;letter-spacing:.08em;padding:7px 10px}
.price-card .pc-label{font-size:13px;font-weight:600;color:var(--muted);margin:22px 0 6px}
.price-card .anchor{text-decoration:line-through;color:var(--muted2);font-weight:700;font-size:1.1rem}
.price-card .main{font-family:var(--font-head);font-size:clamp(2.6rem,8vw,3.4rem);font-weight:800;color:var(--ink);line-height:1;margin:4px 0;letter-spacing:-.02em}
.price-card .main small{font-size:1rem;font-weight:700;color:var(--muted);vertical-align:super;margin-left:2px;font-family:var(--font-body)}
.price-card .save{display:inline-block;background:var(--green-bg);color:var(--green);border:1.5px solid rgba(22,163,74,.3);font-weight:800;font-size:13px;padding:7px 14px;border-radius:999px;margin:10px 0 16px}
.cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(135deg,var(--orange),var(--orange2));color:#fff!important;text-decoration:none;font-weight:800;text-transform:uppercase;letter-spacing:.03em;padding:17px 28px;border-radius:14px;box-shadow:0 8px 26px rgba(124,58,237,.4);font-size:.95rem;transition:transform .15s,box-shadow .15s;border:0;cursor:pointer;width:100%}
.cta:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(124,58,237,.5)}
.cta-sm{width:auto;padding:14px 24px;font-size:.88rem}
.cta-link{display:inline-block;margin-top:14px;font-size:14px;font-weight:700;color:var(--teal-dark);text-decoration:none;border-bottom:1.5px solid rgba(67,56,202,.35)}
.cta-link:hover{color:var(--orange);border-color:rgba(124,58,237,.45)}
.mid-cta{text-align:center;margin-top:28px;max-width:420px;margin-left:auto;margin-right:auto}
.mid-cta .cta{display:block}
.trust-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:14px;font-size:12.5px;font-weight:600;color:var(--muted)}
.trust-row span{display:inline-flex;align-items:center;gap:4px}

.hero-visual{max-width:600px;margin:0 auto;border-radius:22px;overflow:hidden;border:3px solid #fff;box-shadow:0 24px 60px rgba(76,40,130,.18);background:#fff}
.hero-visual img{width:100%}
.hero-visual .collage{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px}
.hero-cap{margin-top:10px;font-size:12.5px;color:var(--muted);font-weight:600}

/* Sections */
section{padding:60px 0}
section.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
section.tint{background:linear-gradient(180deg,#F1EBFF,#FBF9FF)}
section h2{font-size:clamp(1.55rem,3.6vw,2.25rem);text-align:center;margin-bottom:10px;color:var(--ink)}
section h2 .hi{color:var(--orange)}
section h2 .hi-teal{color:var(--teal-dark)}
.sec-lead{text-align:center;color:var(--muted);font-weight:500;max-width:560px;margin:0 auto 30px;font-size:1rem}
.badge-sec{display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin:0 auto 14px;background:#22201B;color:#fff}
.badge-sec.warm{background:linear-gradient(135deg,var(--orange),var(--orange2));color:#fff}
.badge-sec.cool{background:var(--teal);color:#fff}
.badge-wrap{text-align:center}

/* Problem */
.pain-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;max-width:860px;margin:0 auto}
.pain{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:18px 16px;display:flex;gap:12px;align-items:flex-start;box-shadow:var(--shadow)}
.pain .ico{font-size:1.35rem;flex-shrink:0;width:46px;height:46px;border-radius:14px;background:#F0EBFF;display:flex;align-items:center;justify-content:center}
.pain strong{display:block;font-size:1rem;margin-bottom:4px;font-weight:800;font-family:var(--font-head)}
.pain p{font-size:.9rem;color:var(--muted);margin:0;font-weight:500}
.pain-outro{text-align:center;margin-top:22px;font-weight:700;font-size:1.05rem;color:#483F62}
.pain-outro em{color:var(--orange);font-style:normal;font-weight:800}

/* Journey */
.journey{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;max-width:920px;margin:0 auto;background:#fff;border:1.5px solid var(--line);border-radius:var(--radius-lg);padding:22px 16px;box-shadow:var(--shadow)}
.j-step{background:#FBF9FF;border:1.5px dashed var(--line2);border-radius:10px;cursor:default;padding:10px 16px;font-weight:700;font-size:13px;color:var(--ink);text-align:center}
.j-arrow{color:var(--muted2);font-weight:800;font-size:1rem}
.j-end{background:linear-gradient(135deg,var(--orange),var(--orange2));color:#fff;border-radius:999px;padding:10px 18px;font-weight:800;font-size:13px}

/* Capability */
.cap-grid{display:grid;gap:10px;max-width:660px;margin:0 auto}
.cap{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:15px 18px;font-weight:600;font-size:.95rem;display:flex;gap:12px;align-items:center;box-shadow:var(--shadow)}
.cap::before{content:"✓";flex-shrink:0;width:28px;height:28px;border-radius:9px;background:var(--green);color:#fff;font-weight:900;font-size:15px;display:flex;align-items:center;justify-content:center}

/* Areas */
.areas{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.area{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:20px 16px;transition:.15s;box-shadow:var(--shadow)}
.area:hover{border-color:rgba(124,58,237,.45);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.area .a-ico{width:46px;height:46px;border-radius:14px;background:#F0EBFF;display:flex;align-items:center;justify-content:center;font-size:1.35rem;margin-bottom:12px}
.area h3{font-size:1.08rem;margin-bottom:6px}
.area p{font-size:.88rem;color:var(--muted);margin:0;font-weight:500}
.area .pages{display:inline-block;margin-top:12px;font-size:11px;font-weight:800;color:var(--orange);background:#F0EBFF;padding:4px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.03em}

/* Benefits */
.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ben{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:22px 16px;text-align:center;box-shadow:var(--shadow)}
.ben .num{font-family:var(--font-head);font-size:1.9rem;color:var(--orange);font-weight:800;margin-bottom:4px;letter-spacing:-.02em}
.ben h3{font-size:1rem;margin-bottom:6px}
.ben p{font-size:.85rem;color:var(--muted);margin:0;font-weight:500}

/* Gallery */
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.gal figure{margin:0;background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.gal img{width:100%}
.gal figcaption{font-size:12px;font-weight:600;color:var(--muted);padding:8px 10px;text-align:center}

/* Lifestyle */
.lifestyle{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.lifestyle img{border-radius:20px;border:3px solid #fff;box-shadow:0 20px 50px rgba(76,40,130,.16);width:100%}
.lifestyle h2{text-align:left}
.lifestyle .sec-lead{text-align:left;margin:8px 0 0}
.lifestyle ul{margin:16px 0 20px;padding:0;list-style:none}
.lifestyle li{font-weight:600;padding:7px 0;display:flex;gap:10px;align-items:flex-start;color:#3B3552}
.lifestyle li::before{content:"→";color:var(--orange);font-weight:900;flex-shrink:0}

/* Modules */
.mods{display:grid;gap:10px;max-width:860px;margin:0 auto}
.mod{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.mod[open]{border-color:rgba(124,58,237,.5)}
.mod-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;cursor:pointer;user-select:none;list-style:none}
.mod-head::-webkit-details-marker{display:none}
.mod-head .left{display:flex;align-items:center;gap:12px}
.mod-head .m-ico{width:42px;height:42px;border-radius:12px;background:#F0EBFF;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0}
.mod-head h3{font-size:1.02rem;margin:0}
.mod-head .sub{font-size:12.5px;color:var(--muted);font-weight:500;margin-top:2px;font-family:var(--font-body)}
.mod-toggle{font-weight:800;font-size:12px;color:var(--orange);white-space:nowrap;text-transform:uppercase;letter-spacing:.03em;font-family:var(--font-body)}
.mod-toggle::after{content:" +";font-size:1.1rem}
details[open] .mod-toggle::after{content:" –"}
.mod-body{padding:0 18px 16px 72px}
.mod-body ul{list-style:none;display:grid;gap:6px;padding:0}
.mod-body li{font-size:.9rem;font-weight:500;color:#483F62;display:flex;gap:8px;align-items:flex-start}
.mod-body li::before{content:"✓";color:var(--green);font-weight:900;flex-shrink:0}

/* Reviews / levels */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.rev{background:#FBF9FF;border:1.5px dashed #E1D8F5;border-radius:var(--radius);padding:24px 18px;text-align:center;min-height:150px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px}
.rev .stars{color:#EC4899;letter-spacing:2px;font-size:1.05rem}
.rev p{font-weight:600;color:var(--muted);font-style:italic;margin:0}
.rev .hint{font-size:12px;font-weight:600;color:var(--muted2)}

/* Promise */
.promise{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:760px;margin:26px auto 0}
.promise span{background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:8px 16px;font-size:13px;font-weight:700;color:#483F62;box-shadow:var(--shadow)}

/* Final CTA */
.final-cta{padding:68px 0;text-align:center;background:radial-gradient(ellipse 70% 55% at 50% 60%,#E7DEFF 0%,transparent 70%),#F4EFFF;border-top:1px solid var(--line)}
.final-cta h2{margin-bottom:10px}
.final-meta{color:var(--muted);font-size:14px;font-weight:500;margin-bottom:18px}
.final-price-row{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.final-price-row .anchor{text-decoration:line-through;color:var(--muted2);font-weight:700;font-size:1.15rem}
.final-price-row .main{font-family:var(--font-head);font-size:clamp(2.4rem,7vw,3.2rem);font-weight:800;color:var(--ink);letter-spacing:-.02em}
.final-price-row .off-pill{background:var(--green-bg);color:var(--green);border:1.5px solid rgba(22,163,74,.35);font-weight:800;font-size:12px;padding:5px 12px;border-radius:999px}
.final-list{text-align:left;list-style:none;margin:20px auto 22px;display:grid;gap:8px;max-width:520px;padding:0}
.final-list li{font-weight:500;font-size:.92rem;color:#483F62;display:flex;gap:8px;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:10px 14px;box-shadow:var(--shadow)}
.final-list li::before{content:"✓";color:var(--green);font-weight:900}
.final-box{max-width:540px;margin:0 auto;background:#fff;border:2px solid rgba(124,58,237,.28);border-radius:var(--radius-lg);padding:30px 24px;box-shadow:var(--shadow-lg)}

/* FAQ */
.faq{max-width:680px;margin:0 auto;display:flex;flex-direction:column;gap:10px}
.faq-item{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:border-color .15s;box-shadow:var(--shadow)}
.faq-item[open]{border-color:rgba(124,58,237,.5)}
.faq-item summary{padding:16px 18px;font-weight:700;font-size:.98rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--ink);list-style:none;font-family:var(--font-body)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary .plus{color:var(--orange);font-size:1.4rem;font-weight:800;flex-shrink:0;line-height:1}
.faq-item .faq-a{padding:0 18px 16px;font-size:.92rem;color:var(--muted);font-weight:500;line-height:1.6}

/* Closing band */
.closing{padding:52px 0;text-align:center;background:linear-gradient(135deg,#7C3AED,#EC4899);color:#fff}
.closing h2{color:#fff;margin-bottom:8px}
.closing p{font-weight:600;opacity:.95;margin-bottom:12px;color:#fff}
.closing .price-line{font-size:1.5rem;font-weight:800;margin-bottom:18px;color:#fff;font-family:var(--font-head)}
.closing .price-line s{opacity:.75;font-size:1rem;margin-right:8px;font-weight:600}
.closing .cta-inv{display:inline-flex;background:#fff;color:var(--orange)!important;text-decoration:none;font-weight:800;text-transform:uppercase;letter-spacing:.03em;padding:15px 30px;border-radius:14px;font-size:.95rem;box-shadow:0 6px 22px rgba(0,0,0,.25)}

/* Sticky bottom bar */
.sticky-cta{position:fixed;bottom:0;left:0;right:0;z-index:90;background:rgba(251,249,255,.97);backdrop-filter:blur(12px);border-top:1.5px solid rgba(124,58,237,.3);padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:100%;transform:translateY(110%);transition:transform .28s;box-shadow:0 -8px 32px rgba(76,40,130,.12)}
.sticky-cta.show{transform:none}
.sticky-cta .prices{display:flex;flex-direction:column;line-height:1.15}
.sticky-cta .now{color:var(--ink);font-weight:900;font-size:1.35rem;letter-spacing:-.02em;font-family:var(--font-head)}
.sticky-cta .old{color:var(--muted2);font-weight:600;font-size:12px;text-decoration:line-through}
.sticky-cta a{background:linear-gradient(135deg,var(--orange),var(--orange2));color:#fff!important;text-decoration:none;font-weight:800;text-transform:uppercase;letter-spacing:.02em;padding:14px 20px;border-radius:12px;font-size:13px;white-space:nowrap;box-shadow:0 6px 20px rgba(124,58,237,.4)}

.disclaimer{max-width:640px;margin:0 auto;font-size:12px;color:var(--muted2);text-align:center;padding:24px 16px 8px;line-height:1.5}
footer{text-align:center;padding:24px 16px 28px;font-size:12px;color:var(--muted2);border-top:1px solid var(--line);background:#fff}
footer strong{color:var(--muted)}

/* Responsive */
@media(max-width:800px){.areas{grid-template-columns:1fr 1fr}.benefits{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.lifestyle{grid-template-columns:1fr}.lifestyle h2,.lifestyle .sec-lead{text-align:center}.lifestyle .sec-lead{margin:8px auto 0}section{padding:44px 0}.mod-body{padding-left:18px}.gal{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.pain-grid{grid-template-columns:1fr}}
@media(max-width:600px){.j-arrow{display:none}.journey{flex-direction:column;align-items:stretch}.j-step,.j-end{width:100%}}
@media(max-width:520px){.areas{grid-template-columns:1fr}.benefits{grid-template-columns:1fr}.reviews{grid-template-columns:1fr}.final-box{padding:24px 16px}body{padding-bottom:96px}}
@media(max-width:420px){.sticky-cta a{padding:12px 14px;font-size:12px}.sticky-cta .now{font-size:1.15rem}.cta{font-size:.85rem;padding:16px 18px}}

/* Mobile/tablet: las imágenes del pack (portadas y páginas) van como galería horizontal deslizable */
@media(max-width:900px){
  .hero-visual .collage{display:flex;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:8px;padding:8px;scrollbar-width:none}
  .hero-visual .collage::-webkit-scrollbar{display:none}
  .hero-visual .collage img{flex:0 0 72%;width:auto;scroll-snap-align:center;border-radius:12px}
  .gal{display:flex;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:10px;padding:2px;scrollbar-width:none}
  .gal::-webkit-scrollbar{display:none}
  .gal figure{flex:0 0 70%;scroll-snap-align:center}
  .gal figcaption{font-size:11.5px;padding:7px 8px}
}
@media(min-width:601px) and (max-width:900px){
  .hero-visual .collage img{flex-basis:46%}
  .gal figure{flex-basis:44%}
}

