/* ================================================================
   BSW V2 — Pixel-perfect replica CSS (FIXED hero layout)
   ================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&display=swap');

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:'Montserrat',sans-serif;color:#333;background:#EDEDED;line-height:1.6;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
h1,h2,h3,h4,h5,h6{line-height:1.3}

/* ── Tokens ─────────────────────────────────────────────────── */
:root{
  --peach:#FF7F6B;
  --peach-light:#FF9E59;
  --salmon:#E8845C;
  --dark:#1E1E2F;
  --dark2:#2C2C3A;
  --light-bg:#EDEDED;
  --white:#fff;
  --text-dark:#333;
  --text-light:#666;
  --divider-gradient:linear-gradient(90deg,var(--peach-light),var(--peach));
  --btn-gradient:linear-gradient(-45deg,#fc6076,#ff9a44,#ef9d43,#e75516);
  --max-w:1140px;
  --pad:60px 20px;
  --radius:12px;
  --radius-lg:20px;
  --shadow:0 8px 30px rgba(0,0,0,.08);
}

.container{max-width:var(--max-w);margin:0 auto;padding:0 20px}
.section-title{text-align:center;font-size:clamp(1.4rem,3vw,2rem);font-weight:700;color:var(--dark);margin-bottom:8px}
.section-divider{width:60px;height:3px;background:var(--divider-gradient);margin:0 auto 40px;border-radius:2px}
.text-center{text-align:center}
.highlight{color:var(--peach);font-weight:700}

/* ── Animated CTA ─────────────────────────────────────────── */
.btn-cta{
  display:inline-block;position:relative;z-index:1;
  background:var(--btn-gradient);background-size:600%;
  color:#fff;font-weight:700;font-size:16px;letter-spacing:.5px;
  padding:16px 40px;border-radius:8px;border:none;cursor:pointer;
  animation:anime 5.5s linear infinite;transition:transform .2s,box-shadow .2s;text-align:center;
}
.btn-cta::after{content:"";position:absolute;z-index:-1;width:100%;height:100%;left:0;top:10px;background:var(--btn-gradient);background-size:600%;filter:blur(20px);opacity:.7;border-radius:8px;animation:anime 5.5s linear infinite}
.btn-cta:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(255,127,107,.3)}
@keyframes anime{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}

/* ── Reveal Animations ─────────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .7s cubic-bezier(.25,.46,.45,.94), transform .7s cubic-bezier(.25,.46,.45,.94)}
.reveal.revealed{opacity:1;transform:translateY(0)}

/* Variant: fade from left */
.reveal-left{opacity:0;transform:translateX(-50px);transition:opacity .7s ease, transform .7s ease}
.reveal-left.revealed{opacity:1;transform:translateX(0)}

/* Variant: fade from right */
.reveal-right{opacity:0;transform:translateX(50px);transition:opacity .7s ease, transform .7s ease}
.reveal-right.revealed{opacity:1;transform:translateX(0)}

/* Variant: scale in */
.reveal-scale{opacity:0;transform:scale(.85);transition:opacity .6s ease, transform .6s ease}
.reveal-scale.revealed{opacity:1;transform:scale(1)}

/* Stagger children: each card/item animates in sequence */
.stagger-children > *{opacity:0;transform:translateY(30px);transition:opacity .5s ease, transform .5s ease}
.stagger-children.revealed > *{opacity:1;transform:translateY(0)}
.stagger-children.revealed > *:nth-child(1){transition-delay:.05s}
.stagger-children.revealed > *:nth-child(2){transition-delay:.12s}
.stagger-children.revealed > *:nth-child(3){transition-delay:.19s}
.stagger-children.revealed > *:nth-child(4){transition-delay:.26s}
.stagger-children.revealed > *:nth-child(5){transition-delay:.33s}
.stagger-children.revealed > *:nth-child(6){transition-delay:.40s}
.stagger-children.revealed > *:nth-child(7){transition-delay:.47s}
.stagger-children.revealed > *:nth-child(8){transition-delay:.54s}
.stagger-children.revealed > *:nth-child(9){transition-delay:.61s}
.stagger-children.revealed > *:nth-child(10){transition-delay:.68s}
.stagger-children.revealed > *:nth-child(11){transition-delay:.75s}
.stagger-children.revealed > *:nth-child(12){transition-delay:.82s}

/* ================================================================
   1 — HERO HEADER (centered card with floating ribbon)
   ================================================================ */
.hero-header{
  background:var(--light-bg);
  padding:50px 20px 30px;
}
.hero-card{
  position:relative;
  background:#e5e5e5;
  border-radius:var(--radius-lg);
  padding:130px 40px 40px;
  text-align:center;
  max-width:800px;
  margin:0 auto;
  overflow:hidden;
}

/* Folded ribbon — exact reference Elementor values */
.ribbon-wrap{
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  z-index:10;
}
.ribbon{
  display:inline-block;
  background-image:linear-gradient(180deg, #FF9E59 38%, #FF7F6B 100%);
  color:#fff;
  padding:15px 30px;
  border-radius:0px 0px 15px 15px;
  font-weight:700;
  letter-spacing:1.2px;
  font-size:20px;
  font-family:'Montserrat',sans-serif;
  box-shadow:0px 0px 20px 0px rgba(0,0,0,0.15);
  text-transform:uppercase;
  line-height:1.3em;
  white-space:nowrap;
  position:relative;
  text-align:center;
}

/* Fold triangles — exact reference border-triangle technique */
.ribbon::before,
.ribbon::after{
  content:"";
  position:absolute;
  top:0;
  border:solid transparent;
  height:0;
  width:0;
  pointer-events:none;
  border-color:rgba(194,225,245,0);
}
.ribbon::before{
  right:100%;
  border-right-color:#c16253;
  border-width:10px 10px 0px 10px;
}
.ribbon::after{
  left:100%;
  border-left-color:#c16253;
  border-width:10px 10px 0px 10px;
}

.hero-title{
  font-size:clamp(1.4rem,3.5vw,2rem);
  font-weight:400;
  color:#111;
  margin-bottom:16px;
  line-height:1.35;
}
.hero-title strong{font-weight:700}
.hero-divider{width:50px;height:3px;background:var(--divider-gradient);margin:0 auto 16px;border-radius:2px}
.hero-subtitle{font-size:15px;color:#333;font-weight:400;font-style:italic}

/* ================================================================
   2 — COACH + WHAT HAPPENS (two-column)
   ================================================================ */
.coach-section{
  background:var(--light-bg);
  padding:30px 20px 30px;
}
.coach-grid{
  display:flex;
  gap:30px;
  align-items:stretch;
}

/* LEFT: Coach */
.coach-left{
  flex:1;
  max-width:50%;
}
.coach-inner{
  display:flex;
  align-items:flex-end;
  gap:20px;
  margin-bottom:16px;
}
.coach-photo{
  width:240px;
  flex-shrink:0;
}
.coach-photo img{
  width:100%;
}
.coach-info{
  padding-bottom:10px;
}
.coach-label{
  font-size:13px;
  color:var(--text-light);
  font-weight:400;
  margin-bottom:6px;
}
.coach-name{
  font-size:clamp(1.5rem,3vw,2.2rem);
  font-weight:800;
  color:var(--peach);
  letter-spacing:2px;
  margin-bottom:4px;
}
.coach-title{
  font-size:14px;
  color:var(--dark);
  font-weight:500;
  margin-bottom:8px;
}
.coach-divider{
  width:40px;height:2px;background:var(--divider-gradient);margin:10px 0;border-radius:2px;
}
.coach-stats{
  font-size:14px;
  color:var(--text-dark);
  line-height:1.5;
}
.coach-stats strong{color:var(--peach)}

/* Rating bar */
.rating-bar{
  display:flex;
  align-items:center;
  gap:12px;
  background:#fff;
  border-radius:50px;
  padding:10px 20px;
}
.rating-bar img{height:16px}
.rating-bar span{font-size:13px;color:var(--text-dark)}
.rating-bar strong{color:var(--dark)}

/* RIGHT: What Happens */
.coach-right{
  flex:1;
  max-width:50%;
  background:#e5e5e5;
  border-radius:var(--radius-lg);
  padding:30px 28px;
}
.coach-right h3{
  font-size:20px;
  font-weight:700;
  color:var(--dark);
  margin-bottom:8px;
}
.checklist-divider{
  width:40px;height:2px;background:var(--divider-gradient);margin-bottom:24px;border-radius:2px;
}
.benefit-list{display:flex;flex-direction:column;gap:18px}
.benefit-list li{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.6}
.benefit-list li svg{flex-shrink:0;margin-top:3px}
.benefit-list li strong{color:var(--dark)}

/* ================================================================
   3 — CTA + COUNTDOWN
   ================================================================ */
.cta-row{background:#fff;padding:30px 20px}
.cta-grid{display:flex;gap:30px;align-items:center}
.cta-left{flex:1}
.cta-lang{font-size:14px;font-weight:400;color:var(--text-light);margin-bottom:6px}
.cta-date{font-size:16px;font-weight:700;color:var(--peach);margin-bottom:16px;line-height:1.5}
.cta-right{flex:1;text-align:right}
.cta-register-label{font-size:16px;font-weight:700;color:var(--dark);margin-bottom:6px}
.cta-bonus-text{font-size:14px;color:var(--text-dark);margin-bottom:16px}
.countdown{display:flex;gap:12px;justify-content:flex-end}
.countdown-card{width:80px;height:80px;background:var(--dark2);color:#fff;border-radius:var(--radius);display:flex;flex-direction:column;align-items:center;justify-content:center}
.countdown-card .val{font-size:24px;font-weight:800;line-height:1}
.countdown-card .lbl{font-size:9px;letter-spacing:1.5px;margin-top:4px;opacity:.9;text-transform:uppercase}

/* ================================================================
   4 — FEATURED IN
   ================================================================ */
.featured-in{background:var(--dark);padding:var(--pad);color:#fff}
.featured-in .section-title{color:#fff}
.logo-carousel{display:flex;gap:40px;align-items:center;justify-content:center;flex-wrap:wrap;opacity:.7}
.logo-carousel img{height:40px;filter:brightness(0) invert(1)}

/* ================================================================
   5 — WHAT HAPPENS (4-col)
   ================================================================ */
.what-happens{background:var(--light-bg);padding:var(--pad)}
.benefits-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.benefit-card{background:#fff;border-radius:var(--radius);padding:30px 20px;text-align:center;box-shadow:var(--shadow);transition:transform .3s,box-shadow .3s}
.benefit-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,.12)}
.benefit-card .icon{width:50px;height:50px;background:rgba(255,127,107,.15);border-radius:10px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.benefit-card p{font-size:14px;line-height:1.5;color:var(--text-dark)}
.benefit-card p strong{color:var(--dark)}

/* ================================================================
   6 — WHAT WILL CHANGE
   ================================================================ */
.what-change{background:#fff;padding:var(--pad);text-align:center}
.what-change .chart{max-width:500px;margin:0 auto 30px}

/* ================================================================
   7 — WHO THIS HELPS
   ================================================================ */
.who-helps{background:var(--light-bg);padding:var(--pad)}
.who-helps .chart{max-width:500px;margin:0 auto 30px}

/* ================================================================
   8 — WHAT YOU LEARN
   ================================================================ */
.what-learn{background:#fff;padding:var(--pad)}
.learn-content{display:flex;gap:40px;align-items:flex-start}
.learn-image{flex:0 0 40%;border-radius:var(--radius);overflow:hidden}
.learn-list{flex:1}
.learn-item{background:#fff;border-radius:var(--radius);padding:20px 20px 20px 70px;position:relative;box-shadow:0 2px 12px rgba(0,0,0,.06);margin-bottom:15px}
.learn-item .num{position:absolute;left:15px;top:18px;font-size:18px;font-weight:800;color:var(--peach)}
.learn-item p{font-size:14px;line-height:1.6;color:var(--text-dark)}
.learn-item p strong{color:var(--dark)}

/* ================================================================
   9 — BONUSES
   ================================================================ */
.bonuses{background:var(--light-bg);padding:var(--pad)}
.bonuses .bonus-img{max-width:800px;margin:0 auto 30px;border-radius:var(--radius);overflow:hidden}

/* ================================================================
   10 — TRUSTED BY TOP VOICES
   ================================================================ */
.trusted-voices{background:var(--dark);padding:var(--pad);color:#fff}
.trusted-voices .section-title{color:#fff}
.voices-carousel{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px 0}
.voices-carousel::-webkit-scrollbar{display:none}
.voice-slide{flex:0 0 380px;height:280px;border-radius:var(--radius);overflow:hidden;scroll-snap-align:start;background-size:cover;background-position:center}

/* ================================================================
   11 — TESTIMONIALS
   ================================================================ */
.testimonials{background:var(--light-bg);padding:var(--pad)}
.testimonial-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.testimonial-card{background:#fff;border-radius:var(--radius-lg);padding:30px 24px;position:relative;padding-top:60px;margin-top:50px;box-shadow:var(--shadow);text-align:center}
.testimonial-card .avatar{width:80px;height:80px;border-radius:50%;overflow:hidden;position:absolute;top:-40px;left:50%;transform:translateX(-50%);border:3px solid #fff;box-shadow:0 4px 12px rgba(0,0,0,.1)}
.testimonial-card .avatar img{width:100%;height:100%;object-fit:cover}
.testimonial-card .quote{font-size:14px;color:var(--text-dark);line-height:1.6;margin-bottom:16px;font-style:italic}
.testimonial-card .name{font-weight:700;font-size:15px;color:var(--dark)}
.testimonial-card .company{font-size:12px;color:var(--text-light)}

/* ================================================================
   12 — MEET YOUR COACH
   ================================================================ */
.meet-coach{background:#fff;padding:var(--pad);color:var(--dark)}
.meet-coach .section-title{color:var(--dark)}
.coach-header{position:relative;text-align:center;margin-bottom:40px}
.coach-header img{width:200px;border-radius:50%;margin:0 auto 16px;border:4px solid rgba(255,127,107,.3)}
.coach-header h2{font-size:32px;font-weight:800;color:var(--dark)}
.coach-header h6{font-size:14px;color:var(--peach);letter-spacing:1px;text-transform:uppercase}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:16px}
.stat-card{background:#fff;border:1px solid #e0e0e0;border-radius:var(--radius);padding:24px 16px;text-align:center;transition:transform .3s;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.stat-card:hover{transform:translateY(-4px);border-color:var(--peach)}
.stat-card .stat-num{font-size:28px;font-weight:800;color:var(--peach);margin-bottom:8px}
.stat-card p{font-size:12px;color:var(--text-light);line-height:1.4}

/* ================================================================
   13 — MISSION
   ================================================================ */
.mission{background:#fff;padding:var(--pad)}
.mission-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}
.mission-gallery img{border-radius:var(--radius);width:100%;height:200px;object-fit:cover}
.mission-banner{border-radius:var(--radius);overflow:hidden;margin-bottom:16px}
.mission .subtitle{text-align:center;font-size:16px;color:var(--text-light);font-style:italic}

/* ================================================================
   14 — RECAP VALUE STACK
   ================================================================ */
.recap{background:var(--light-bg);padding:var(--pad)}
.recap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:20px}
.recap-card{background:#fff;border-radius:var(--radius);padding:28px 24px;position:relative;padding-right:60px;box-shadow:var(--shadow)}
.recap-card h5{font-size:14px;font-weight:600;color:var(--dark);margin-bottom:6px}
.recap-card p{font-size:13px;color:var(--text-light)}
.recap-card .price-tag{position:absolute;right:0;top:50%;transform:translateY(-50%) rotate(-90deg);background:var(--peach);color:#fff;font-weight:800;font-size:14px;padding:6px 14px;border-radius:0 0 8px 8px}
.recap-total{background:var(--dark);padding:30px 20px;text-align:center;color:#fff;margin-top:20px;border-radius:var(--radius)}
.recap-total h6{font-size:14px;font-weight:400;color:rgba(255,255,255,.7)}
.recap-total .price-big{font-size:13px;color:rgba(255,255,255,.5);text-decoration:line-through;margin:4px 0}
.recap-total .price-today{font-size:clamp(1.5rem,3vw,2.2rem);font-weight:800;color:var(--peach);margin:8px 0}
.recap-total .reserve{font-size:13px;color:rgba(255,255,255,.7);margin-bottom:20px}

/* ================================================================
   15 — GUARANTEE
   ================================================================ */
.guarantee{background:var(--light-bg);padding:var(--pad)}
.guarantee-content{display:flex;gap:40px;align-items:center;max-width:900px;margin:0 auto}
.guarantee-img{flex:0 0 200px}
.guarantee-img img{width:100%}
.guarantee-text h2{font-size:24px;font-weight:800;color:var(--dark);margin-bottom:12px}
.guarantee-text p{font-size:14px;line-height:1.7;color:var(--text-dark);margin-bottom:20px}

/* ================================================================
   16 — PROMISE
   ================================================================ */
.promise{background:#fff;padding:var(--pad)}
.promise-inner{background:var(--light-bg);border-radius:var(--radius-lg);padding:40px;max-width:800px;margin:0 auto}
.promise-inner h4{font-size:18px;font-weight:600;color:var(--dark);margin-bottom:20px;text-align:center}
.promise-inner p{font-size:14px;line-height:1.8;color:var(--text-dark);margin-bottom:12px}
.promise-inner .signature{display:flex;align-items:center;gap:8px;margin-top:16px}
.promise-inner .signature img{height:40px}

/* ================================================================
   17 — FAQ
   ================================================================ */
.faq{background:var(--light-bg);padding:var(--pad)}
.faq-list{max-width:800px;margin:0 auto}
.faq-item{border:1px solid #ddd;border-radius:var(--radius);margin-bottom:12px;overflow:hidden;transition:box-shadow .3s}
.faq-item:hover{box-shadow:0 4px 16px rgba(0,0,0,.06)}
.faq-item .faq-q{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;cursor:pointer;font-weight:600;font-size:15px;color:var(--dark);background:#fafafa}
.faq-item .faq-q .icon{font-size:20px;color:var(--peach);transition:transform .3s}
.faq-item.open .faq-q .icon{transform:rotate(45deg)}
.faq-item .faq-a{padding:0 20px;max-height:0;overflow:hidden;transition:all .3s ease;font-size:14px;color:var(--text-light);line-height:1.6}
.faq-item.open .faq-a{padding:16px 20px;max-height:400px}

/* ================================================================
   STICKY BOTTOM BAR
   ================================================================ */
.sticky-bar{position:fixed;bottom:-100px;left:0;width:100%;z-index:100;background:#fff;padding:15px 20px;display:flex;align-items:center;justify-content:center;gap:20px;transition:bottom .4s ease;box-shadow:0px -5px 15px rgba(0,0,0,0.15);border-radius:20px 20px 0 0}
.sticky-bar.visible{bottom:0}
.sticky-bar .price-area{display:flex;align-items:center;gap:12px}
.sticky-bar .price-new{color:var(--peach);font-size:28px;font-weight:800}
.sticky-bar .price-old{color:#999;font-size:14px;text-decoration:line-through}
.sticky-bar .timer-text{color:#333;font-size:14px;font-weight:500}
.sticky-bar .timer-text strong{color:var(--peach)}
.sticky-bar .btn-cta{padding:12px 30px;font-size:14px;text-transform:uppercase;letter-spacing:1px}
.sticky-bar .btn-cta::after{display:none}

/* ================================================================
   FOOTER
   ================================================================ */
.footer{background:var(--dark);color:rgba(255,255,255,.5);padding:30px 20px;text-align:center}
.footer img{height:60px;margin:0 auto 12px}
.footer p{font-size:13px}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media(max-width:1024px){
  .benefits-grid,.stats-grid{grid-template-columns:repeat(2,1fr)}
  .mission-gallery{grid-template-columns:repeat(2,1fr)}
  .recap-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .coach-grid{flex-direction:column}
  .coach-left,.coach-right{max-width:100%}
  .learn-content{flex-direction:column}
  .learn-image{flex:none;width:100%}
  .cta-grid{flex-direction:column;text-align:center}
  .countdown{justify-content:center}
  .cta-right{text-align:center}
  .testimonial-grid{grid-template-columns:1fr}
  .voice-slide{flex:0 0 300px;height:220px}
  .coach-inner{flex-direction:column;align-items:center;text-align:center}
  .coach-divider{margin:10px auto}
  .logo-carousel img{height:30px}
  .guarantee-content{flex-direction:column;text-align:center}
  .guarantee-img{flex:0 0 auto}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .ribbon{white-space:normal;font-size:13px;padding:10px 30px}
  .hero-card{padding:50px 24px 30px}
}
@media(max-width:480px){
  .benefits-grid{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:1fr}
  .mission-gallery{grid-template-columns:1fr}
  .mission-gallery img{height:160px}
  .countdown-card{width:65px;height:65px}
  .countdown-card .val{font-size:20px}
  .btn-cta{width:100%;padding:14px 20px;font-size:15px}
  .sticky-bar{flex-direction:column;gap:10px}
  .coach-photo{width:180px}
  .recap-grid{grid-template-columns:1fr}
  .promise-inner{padding:24px}
  .hero-card{padding:40px 16px 24px}
  .ribbon{font-size:12px;padding:8px 20px}
}