/* ===== Tokens ===== */
:root{
  --bg-dark-1:hsl(220 70% 4%);
  --bg-dark-2:hsl(220 65% 9%);
  --bg-dark-3:hsl(220 70% 18%);
  --primary:hsl(22 90% 53%);
  --primary-hover:hsl(20 95% 48%);
  --accent:hsl(45 100% 55%);
  --success:hsl(142 70% 45%);
  --destructive:hsl(0 85% 55%);
  --text-light:#fff;
  --text-dark:hsl(220 60% 12%);
  --text-muted:hsl(220 15% 45%);
  --border-light:hsl(220 30% 88%);
  --bg-soft:hsl(210 60% 97%);
  --shadow-cta:0 10px 28px -8px hsl(22 95% 50% / 0.55), 0 4px 10px -4px rgba(0,0,0,.4);
  --hero-grad:linear-gradient(180deg,var(--bg-dark-1) 0%,var(--bg-dark-2) 35%,var(--bg-dark-3) 100%);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden;width:100%}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:#fff;color:var(--text-dark);
  -webkit-font-smoothing:antialiased;line-height:1.5;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{letter-spacing:-.02em;line-height:1.15}

.container{width:100%;max-width:1152px;margin:0 auto;padding:0 1rem}
.text-accent{color:var(--accent)}
.text-primary{color:var(--primary)}
.section-dark{background:var(--hero-grad);color:var(--text-light)}
.section-light{background:#fff;color:var(--text-dark)}

/* ===== CTA Button ===== */
.cta-button{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  background:linear-gradient(180deg,hsl(22 95% 56%) 0%,hsl(18 95% 48%) 100%);
  color:#fff;font-weight:800;text-transform:uppercase;letter-spacing:.05em;
  padding:1rem 1.25rem;border-radius:.75rem;font-size:.875rem;
  box-shadow:var(--shadow-cta);transition:all .2s;text-align:center;
  border:none;cursor:pointer;line-height:1.2;
}
.cta-button:hover{background:linear-gradient(180deg,hsl(22 100% 62%) 0%,hsl(18 100% 52%) 100%);transform:scale(1.02)}
.cta-button:active{transform:scale(.98)}
.w-full{width:100%}
@media(min-width:640px){.cta-button{font-size:1rem}}

@keyframes pulse-glow{
  0%,100%{box-shadow:var(--shadow-cta)}
  50%{box-shadow:0 14px 40px -8px hsl(22 95% 56% / .85),0 4px 12px -4px rgba(0,0,0,.4)}
}
.pulse-glow{animation:pulse-glow 2.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.6}}
.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}

/* ===== Top Bar ===== */
.topbar{background:var(--destructive);color:#fff}
.topbar__inner{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem;text-align:center}
.topbar__inner p{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
@media(min-width:640px){.topbar__inner p{font-size:.85rem}}

/* ===== Hero ===== */
.hero{padding:2rem 0 2.5rem}
@media(min-width:640px){.hero{padding:3rem 0 4rem}}
.hero__grid{display:grid;gap:2rem;align-items:center}
@media(min-width:1024px){.hero__grid{grid-template-columns:1fr 1fr;gap:3rem}}
.hero__copy{order:2;text-align:center;min-width:0}
.hero__image{order:1;display:flex;justify-content:center;min-width:0}
.hero__image img{width:100%;max-width:24rem;height:auto;filter:drop-shadow(0 25px 25px rgba(0,0,0,.4))}
@media(min-width:1024px){
  .hero__copy{order:1;text-align:left}
  .hero__image{order:2}
  .hero__image img{max-width:100%;width:auto;max-height:34rem}
}
.hero__badge{
  display:inline-flex;align-items:center;gap:.5rem;
  background:hsl(220 60% 85%);color:hsl(220 60% 25%);
  padding:.5rem 1.25rem;border-radius:9999px;
  font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  margin-bottom:1.5rem;
}
@media(min-width:640px){.hero__badge{font-size:.85rem}}
.hero__copy h1{font-size:clamp(1.75rem,6vw,2.25rem);font-weight:800;margin-bottom:1.25rem;overflow-wrap:break-word;hyphens:auto}
@media(min-width:640px){.hero__copy h1{font-size:3rem}}
@media(min-width:1024px){.hero__copy h1{font-size:3.75rem}}
.hero__lead{font-size:1rem;color:rgba(255,255,255,.9);margin-bottom:1.5rem;max-width:36rem;margin-left:auto;margin-right:auto}
@media(min-width:640px){.hero__lead{font-size:1.125rem}}
@media(min-width:1024px){.hero__lead{margin-left:0}}
.hero__lead strong{color:#fff;font-weight:700}
.hero__cta{width:100%;max-width:100%;font-size:.8rem;padding:1.1rem 1rem;white-space:normal;word-break:break-word}
@media(min-width:640px){.hero__cta{font-size:.95rem}}
@media(min-width:1024px){.hero__cta{width:auto;min-width:480px;font-size:1rem}}
.hero__mail{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:1.25rem;font-size:.8rem;color:rgba(255,255,255,.85);text-align:center}
@media(min-width:1024px){.hero__mail{justify-content:flex-start;text-align:left}}
.hero__mail svg{flex-shrink:0;color:var(--accent)}

/* ===== Book Carousel 3D ===== */
.book-section{padding:3.5rem 0 5rem;overflow:hidden}
.book-section__head{text-align:center;margin-bottom:2.5rem;max-width:64rem;margin-left:auto;margin-right:auto;padding:0 1rem}
.book-section__head h2{font-size:clamp(1.25rem,4.5vw,1.5rem);font-weight:800}
@media(min-width:640px){.book-section__head h2{font-size:2.25rem}}
.carousel{position:relative;perspective:1400px;height:320px;width:100%;overflow:hidden}
@media(min-width:480px){.carousel{height:400px}}
@media(min-width:768px){.carousel{height:520px}}
.carousel__fade{position:absolute;top:0;bottom:0;width:4rem;z-index:30;pointer-events:none}
@media(min-width:640px){.carousel__fade{width:10rem}}
.carousel__fade--left{left:0;background:linear-gradient(to right,var(--bg-soft),transparent)}
.carousel__fade--right{right:0;background:linear-gradient(to left,var(--bg-soft),transparent)}
.carousel__stage{position:absolute;left:50%;top:50%;transform-style:preserve-3d;width:0;height:0}
.carousel__slide{position:absolute;border-radius:.75rem;overflow:hidden;background:#fff;box-shadow:0 25px 50px -12px rgba(0,0,0,.5);outline:1px solid rgba(0,0,0,.1)}
.carousel__slide img{width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}

/* ===== What You Get ===== */
.wyg{padding:4rem 0}
@media(min-width:640px){.wyg{padding:6rem 0}}
.wyg__title{font-size:1.875rem;font-weight:800;text-align:center;margin-bottom:3rem}
@media(min-width:640px){.wyg__title{font-size:3rem;margin-bottom:4rem}}
.wyg__title-em{display:block;font-style:italic;color:hsl(230 85% 55%)}
@media(min-width:640px){.wyg__title-em{display:inline}}
.wyg__grid{display:grid;gap:1.25rem;max-width:64rem;margin:0 auto}
@media(min-width:640px){.wyg__grid{grid-template-columns:1fr 1fr;gap:1.5rem}}
.wyg__card{background:#fff;border-radius:1rem;padding:1.75rem;box-shadow:0 1px 2px 0 rgba(0,0,0,.05)}
@media(min-width:640px){.wyg__card{padding:2.25rem}}
.wyg__card img{height:5rem;width:5rem;object-fit:contain;margin-bottom:1.5rem}
@media(min-width:640px){.wyg__card img{height:6rem;width:6rem;margin-bottom:2rem}}
.wyg__card p{font-size:1rem;color:hsl(220 12% 45%)}
@media(min-width:640px){.wyg__card p{font-size:1.125rem}}
.wyg__footer{text-align:center;margin-top:3rem;font-size:1rem;font-weight:500;color:hsl(230 85% 55%)}
@media(min-width:640px){.wyg__footer{margin-top:4rem;font-size:1.125rem}}

/* ===== Steps ===== */
.steps{padding:4rem 0}
@media(min-width:640px){.steps{padding:6rem 0}}
.steps h2{font-size:1.875rem;font-weight:800;text-align:center;margin-bottom:.75rem}
@media(min-width:640px){.steps h2{font-size:3rem}}
.steps__sub{text-align:center;margin-bottom:3rem;color:hsl(220 15% 40%);font-size:1rem}
@media(min-width:640px){.steps__sub{margin-bottom:4rem;font-size:1.125rem}}
.steps__grid{display:grid;gap:3rem;grid-template-columns:1fr}
@media(min-width:640px){.steps__grid{grid-template-columns:1fr 1fr;gap:2rem}}
@media(min-width:1024px){.steps__grid{grid-template-columns:repeat(4,1fr)}}
.step{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 .5rem}
.step__emoji{font-size:3.75rem;margin-bottom:1.25rem;transition:transform .3s}
.step__emoji:hover{transform:scale(1.1)}
@media(min-width:640px){.step__emoji{font-size:4.5rem}}
.step__badge{background:hsl(225 85% 55%);color:#fff;padding:.5rem 1.5rem;border-radius:9999px;font-size:.85rem;font-weight:700;letter-spacing:.04em;margin-bottom:1rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1)}
.step h3{font-size:1.5rem;font-weight:800;margin-bottom:.75rem}
.step p{color:hsl(220 15% 40%);max-width:18rem}

/* ===== Limited Offer ===== */
.limited{padding:1.5rem 0 2rem}
.limited__wrap{max-width:28rem;margin:0 auto}
.limited__card{background:hsl(220 70% 18%);color:#fff;padding:1.75rem;border-radius:1.5rem;box-shadow:0 25px 50px -12px rgba(0,0,0,.5)}
@media(min-width:640px){.limited__card{padding:2.25rem}}
.limited__tag{display:flex;justify-content:center;margin-bottom:1.25rem}
.limited__tag{background:none}
.limited__tag::before{content:"🚨 Oferta Limitada Solo Hoy";display:inline-flex;background:var(--destructive);color:#fff;padding:.5rem 1.25rem;border-radius:.75rem;font-size:.85rem;font-weight:700}
.limited__tag{font-size:0}
.limited__card h3{text-align:center;font-size:1.5rem;font-weight:800;margin-bottom:1.5rem;color:#fff}
@media(min-width:640px){.limited__card h3{font-size:1.875rem}}
.limited__img{margin:0 auto 1.5rem;width:100%;max-width:280px;height:auto;filter:drop-shadow(0 25px 25px rgba(0,0,0,.4))}
.limited__sub{text-align:center;font-size:.85rem;font-weight:600;margin-bottom:1rem;color:rgba(255,255,255,.8)}
.limited__list{list-style:none;display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}
.limited__list li{display:flex;align-items:center;gap:.75rem;font-size:.9rem}
.limited__list .check{color:var(--success);font-weight:bold}
.limited__warn{text-align:center;font-size:.9rem;font-weight:700;margin-bottom:1.25rem}
.limited__mail{margin-top:1rem;text-align:center;font-size:.75rem;color:rgba(255,255,255,.75)}

/* ===== Benefits ===== */
.benefits{padding:3.5rem 0 5rem}
.benefits__wrap{max-width:48rem;margin:0 auto}
.benefits h2{font-size:1.875rem;font-weight:800;text-align:center;margin-bottom:2.5rem}
@media(min-width:640px){.benefits h2{font-size:2.25rem;margin-bottom:3rem}}
.benefits ul{list-style:none;max-width:36rem;margin:0 auto;display:flex;flex-direction:column;gap:1rem}
.benefits li{display:flex;align-items:center;gap:1rem;background:hsl(140 60% 97%);border:1px solid hsl(140 40% 88%);padding:1.25rem 1.5rem;border-radius:1rem;font-size:.9rem;font-weight:700;color:hsl(220 40% 18%)}
@media(min-width:640px){.benefits li{font-size:1rem;padding:1.5rem}}
.benefits .bullet{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:2.5rem;width:2.5rem;border-radius:9999px;background:hsl(140 60% 85%);color:var(--success);font-weight:bold;font-size:1.1rem}

/* ===== Countdown ===== */
.countdown__banner{background:var(--destructive);color:#fff;padding:1.5rem 1rem}
@media(min-width:640px){.countdown__banner{padding:2rem 1rem}}
.countdown__banner h2{text-align:center;font-size:1rem;font-weight:800;text-transform:uppercase;margin-bottom:1rem}
@media(min-width:640px){.countdown__banner h2{font-size:1.5rem}}
.countdown__timer{display:flex;justify-content:center;gap:1.5rem}
@media(min-width:640px){.countdown__timer{gap:2.5rem}}
.time{display:flex;flex-direction:column;align-items:center}
.time span{font-size:3rem;font-weight:800;color:#fff;font-variant-numeric:tabular-nums;line-height:1}
@media(min-width:640px){.time span{font-size:4.5rem}}
.time small{margin-top:.5rem;font-size:.75rem;color:rgba(255,255,255,.9)}
@media(min-width:640px){.time small{font-size:.85rem}}
.countdown__cta{padding:2.5rem 1rem;max-width:42rem}
@media(min-width:640px){.countdown__cta{padding:3.5rem 1rem}}
.countdown__card{background:#fff;border:1px solid var(--border-light);border-radius:1rem;padding:1.75rem;text-align:center;box-shadow:0 20px 25px -5px rgba(0,0,0,.1)}
@media(min-width:640px){.countdown__card{padding:2.5rem}}
.countdown__card p{font-size:1.5rem;font-weight:800;margin-bottom:1.75rem;line-height:1.3}
@media(min-width:640px){.countdown__card p{font-size:1.875rem}}
.countdown__card .cta-button{min-width:320px}
@media(max-width:639px){.countdown__card .cta-button{width:100%;min-width:0}}

/* ===== Offer ===== */
.offer{padding:3.5rem 0 5rem}
.offer__wrap{max-width:64rem;margin:0 auto}
.offer__warn{text-align:center;font-size:.7rem;font-weight:700;letter-spacing:.15em;color:var(--destructive);text-transform:uppercase;margin-bottom:2.5rem;animation:pulse 2s infinite}
@media(min-width:640px){.offer__warn{font-size:.85rem}}
.offer__card{position:relative;max-width:28rem;margin:0 auto;background:#fff;border:2px solid var(--primary);border-radius:1rem;padding:1.5rem;box-shadow:var(--shadow-cta);display:flex;flex-direction:column}
@media(min-width:640px){.offer__card{padding:2rem}}
.offer__ribbon{position:absolute;top:-.875rem;left:50%;transform:translateX(-50%);background:var(--success);color:#fff;padding:.4rem 1rem;border-radius:9999px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;box-shadow:0 4px 6px -1px rgba(0,0,0,.1)}
.offer__alert{margin:.5rem 0 .75rem;background:var(--destructive);color:#fff;text-align:center;font-size:.75rem;font-weight:700;text-transform:uppercase;padding:.5rem .75rem;border-radius:.5rem;animation:pulse 2s infinite}
@media(min-width:640px){.offer__alert{font-size:.85rem}}
.offer__card img{margin:.75rem auto;display:block;max-width:100%;width:auto;max-height:18rem;height:auto;object-fit:contain}
@media(min-width:640px){.offer__card img{max-height:20rem}}
.offer__list{list-style:none;display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;flex:1}
.offer__list li{display:flex;align-items:flex-start;gap:.5rem;font-size:1rem;color:hsl(220 40% 18%)}
@media(min-width:640px){.offer__list li{font-size:1.125rem}}
.offer__list .check{color:var(--success);font-weight:bold;margin-top:.15rem}
.offer__price{margin-bottom:1.25rem;text-align:center}
.offer__from{font-size:1rem;color:var(--text-muted)}
.offer__from s{color:var(--destructive)}
.offer__big{font-size:3.75rem;font-weight:800;color:var(--success);line-height:1}
@media(min-width:640px){.offer__big{font-size:4.5rem}}
.offer__inst{font-size:.875rem;color:var(--text-muted)}
.offer__save{margin-top:.5rem;color:var(--success);font-weight:600;font-size:1rem}
@media(min-width:640px){.offer__save{font-size:1.125rem}}

/* Guarantee */
.guarantee{margin-top:2.5rem;border:1px solid hsl(220 30% 88%);background:linear-gradient(to bottom right,#fff,var(--bg-soft));padding:1.5rem;border-radius:1rem;display:flex;flex-direction:column;align-items:center;gap:1.5rem;text-align:center;box-shadow:0 20px 25px -5px rgba(0,0,0,.1)}
@media(min-width:640px){.guarantee{flex-direction:row;text-align:left;padding:2rem}}
.guarantee__seal{position:relative;flex-shrink:0;display:flex;height:9rem;width:9rem;align-items:center;justify-content:center}
.seal__ring{position:absolute;inset:0;border-radius:9999px;background:linear-gradient(135deg,var(--accent),hsl(45 95% 60%),hsl(38 90% 45%));box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}
.seal__inner{position:relative;width:6rem;height:6rem;border-radius:9999px;background:linear-gradient(135deg,var(--success),hsl(142 75% 30%));display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;border:1px solid rgba(255,255,255,.4);box-shadow:inset 0 2px 4px rgba(0,0,0,.06)}
.seal__num{font-size:1.875rem;font-weight:900;line-height:1}
.seal__lbl{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.15em;margin-top:.15rem}
.guarantee__chip{display:inline-flex;align-items:center;gap:.4rem;background:rgba(34,197,94,.1);color:var(--success);padding:.25rem .75rem;border-radius:9999px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}
.guarantee h3{font-size:1.125rem;font-weight:800;margin-bottom:.5rem}
@media(min-width:640px){.guarantee h3{font-size:1.5rem}}
.guarantee p{font-size:.875rem;color:hsl(220 25% 35%);line-height:1.6}
@media(min-width:640px){.guarantee p{font-size:1rem}}

/* ===== Testimonials ===== */
.testimonials{padding:3.5rem 0 5rem}
.testimonials h2{font-size:1.5rem;font-weight:800;text-align:center;margin-bottom:.5rem}
@media(min-width:640px){.testimonials h2{font-size:2.25rem}}
.testimonials__sub{text-align:center;margin-bottom:2.5rem;color:hsl(220 15% 40%)}
.testimonials__grid{display:grid;gap:1.25rem;max-width:64rem;margin:0 auto}
@media(min-width:640px){.testimonials__grid{grid-template-columns:1fr 1fr}}
.testimonial{background:var(--bg-soft);border:1px solid var(--border-light);padding:1.5rem;border-radius:1rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1)}
.stars{color:var(--accent);font-size:1rem;letter-spacing:2px;margin-bottom:.75rem}
.testimonial p{font-size:.9rem;line-height:1.6;color:hsl(220 40% 18%);margin-bottom:1rem}
@media(min-width:640px){.testimonial p{font-size:1rem}}
.t-author{border-top:1px solid var(--border-light);padding-top:.75rem}
.t-author b{display:block;color:var(--text-dark)}
.t-author small{font-size:.75rem;color:var(--text-muted)}

/* ===== FAQ ===== */
.faq{padding:3.5rem 0 5rem}
.faq__wrap{max-width:42rem;margin:0 auto}
.faq h2{font-size:1.5rem;font-weight:800;text-align:center;margin-bottom:2.5rem}
@media(min-width:640px){.faq h2{font-size:2.25rem}}
.faq__list{display:flex;flex-direction:column;gap:.75rem}
details{background:var(--bg-soft);border:1px solid var(--border-light);border-radius:.75rem;padding:1rem 1.25rem}
summary{font-weight:600;cursor:pointer;color:var(--text-dark);font-size:.9rem;list-style:none;display:flex;justify-content:space-between;align-items:center}
@media(min-width:640px){summary{font-size:1rem}}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:1.5rem;font-weight:300;color:var(--text-muted);transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details p{margin-top:.75rem;font-size:.875rem;line-height:1.6;color:hsl(220 25% 35%)}

/* ===== Footer ===== */
.footer{border-top:1px solid var(--border-light);padding:2rem 0;text-align:center;font-size:.75rem;color:var(--text-muted)}
.footer p{margin:.25rem 0}