/* VARIABLES */
:root{
  --azul-oscuro:#100530;
  --rosa-fuerte:#F71662;
  --blanco:#FFFFFF;
  --fondo-claro:#f7f7f9;
  --texto-principal:#333;
  --texto-secundario:#6c757d;
  --verde-whatsapp:#25D366;
  --borde-suave:#e9ecef;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{line-height:1.6;color:var(--texto-principal);background:var(--fondo-claro);}

/* HERO BG */
.hero-bg{
  background:linear-gradient(135deg,var(--azul-oscuro) 0%,#1a0a40 100%);
  position:relative;overflow:hidden;
}
.hero-bg::before{
  content:'';position:absolute;inset:0;
  background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="rgba(247,22,98,0.1)" d="M0,96L48,112C96,128,192,160,288,160C384,160,480,128,576,122.7C672,117,768,139,864,138.7C960,139,1056,117,1152,106.7C1248,96,1344,96,1392,96L1440,96L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>') no-repeat bottom center;
  background-size:cover;
}

/* COMPONENTES */
.card{
  background:var(--blanco);border-radius:16px;
  box-shadow:0 8px 32px rgba(16,5,48,.08);
  transition:all .3s ease;
}
.card:hover{transform:translateY(-5px);box-shadow:0 12px 40px rgba(16,5,48,.12);}
.btn-primary{
  background:var(--rosa-fuerte);color:var(--blanco);border:none;
  padding:16px 32px;border-radius:50px;font-weight:700;font-size:18px;
  transition:all .3s ease;cursor:pointer;display:inline-flex;align-items:center;gap:8px;
}
.btn-primary:hover{background:#d61456;transform:translateY(-2px);box-shadow:0 8px 24px rgba(247,22,98,.3);}
.btn-secondary{
  background:var(--blanco);color:var(--azul-oscuro);border:2px solid var(--azul-oscuro);
  padding:14px 28px;border-radius:50px;font-weight:700;font-size:16px;
  transition:all .3s ease;cursor:pointer;display:inline-flex;align-items:center;gap:8px;
}
.btn-secondary:hover{background:var(--azul-oscuro);color:var(--blanco);transform:translateY(-2px);}
.section{padding:60px 0;}
.section-alt{background:var(--fondo-claro);}

.animate-on-scroll{opacity:0;transform:translateY(30px);transition:all .8s ease;}
.animate-on-scroll.is-visible{opacity:1;transform:translateY(0);}

/* VIDEO */
.video-container{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:16px;box-shadow:0 12px 40px rgba(16,5,48,.15);}
.video-container iframe,.video-container .wistia_embed{position:absolute;top:0;left:0;width:100%;height:100%;}

/* FAQ Accesible */
.faq-item{border-bottom:1px solid var(--borde-suave);}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease;padding:0;}
.faq-answer.show{max-height:500px;padding:0 0 24px 0;}

/* Testimonios */
.testimonial-card{
  background:var(--blanco);border-radius:16px;padding:24px;
  box-shadow:0 8px 32px rgba(16,5,48,.08);transition:all .3s ease;
}
.testimonial-card:hover{transform:translateY(-8px);box-shadow:0 16px 48px rgba(16,5,48,.12);}

/* Método / Bonos / Garantías */
.guarantee-badge{
  background:var(--rosa-fuerte);color:var(--blanco);
  padding:12px 24px;border-radius:50px;font-weight:700;
  display:inline-flex;align-items:center;gap:8px;margin-bottom:24px;
}
.method-step{
  background:var(--blanco);border-radius:16px;padding:32px;text-align:center;
  box-shadow:0 8px 32px rgba(16,5,48,.08);transition:all .3s ease;
}
.method-step:hover{transform:translateY(-5px);box-shadow:0 12px 40px rgba(16,5,48,.12);}
.method-icon{
  width:80px;height:80px;background:var(--rosa-fuerte);border-radius:50%;
  display:flex;align-items:center;justify-content:center;margin:0 auto 24px;font-size:32px;color:var(--blanco);
}
.bonus-card{
  background:var(--blanco);border-radius:16px;padding:24px;border:2px solid var(--borde-suave);
  transition:all .3s ease;
}
.bonus-card:hover{border-color:var(--rosa-fuerte);transform:translateY(-3px);}

/* Countdown */
.countdown{
  background:var(--rosa-fuerte);color:var(--blanco);
  padding:16px 32px;border-radius:12px;font-weight:700;
  text-align:center;margin-bottom:24px;
}

/* Header */
.sticky-header{
  position:sticky;top:1rem;width:90%;max-width:1200px;margin:1rem auto;
  background:rgba(255,255,255,.85);backdrop-filter:blur(10px);z-index:1000;
  border-radius:16px;box-shadow:0 8px 32px rgba(16,5,48,.08);
}
.logo-img{height:50px!important;width:auto;}
#mobile-menu{transition:opacity .3s ease-out,transform .3s ease-out;}
#mobile-menu-button.menu-active{background-color:var(--rosa-fuerte);color:var(--blanco);border-radius:8px;padding:4px;}

/* Slider testimonios */
.slider-wrapper{position:relative;overflow:hidden;}
.slider-track{display:flex;}
.slide{flex:0 0 100%;}
@media(min-width:768px){.slide{flex:0 0 50%;}}
@media(min-width:1024px){.slide{flex:0 0 33.3333%;}}
.slider-dot{width:10px;height:10px;border-radius:9999px;background:#d1d5db;cursor:pointer;}
.slider-dot.active{background:var(--rosa-fuerte);}

/* Popup salida animación */
#exit-overlay.hidden{display:none;}
#exit-box{animation:fadeInUp .35s ease both;}
@keyframes fadeInUp{
  from{opacity:0;transform:translateY(20px);}
  to{opacity:1;transform:translateY(0);}
}

/* Responsive */
@media(max-width:768px){
  .section{padding:40px 0;}
  .btn-primary{padding:14px 24px;font-size:16px;}
  .method-step{padding:24px;}
  .method-icon{width:60px;height:60px;font-size:24px;}
  .sticky-header{width:95%;margin:.5rem auto;top:.5rem;}
}