*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

body{
background:#050505;
color:white;
overflow-x:hidden;
}

.container{
width:min(1180px,92%);
margin:auto;
}

.hero-bg{
position:fixed;
inset:0;
background:
radial-gradient(circle at top,#ff730020,transparent 45%),
linear-gradient(#050505,#090909);
z-index:-1;
}

.promo-bar{
background:#ff6b00;
padding:12px;
text-align:center;
font-weight:600;
}

.header{
padding:20px 0;
position:sticky;
top:0;
backdrop-filter:blur(18px);
background:#050505cc;
z-index:99;
}

.header-wrap{
display:flex;
justify-content:space-between;
align-items:center;
}

.brand{
display:flex;
align-items:center;
gap:12px;
}

.brand img{
width:55px;
}

.btn-header{
background:#ff6b00;
padding:12px 22px;
border-radius:50px;
color:white;
text-decoration:none;
font-weight:700;
}

.hero{
padding:60px 0 80px;
}

.hero-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:50px;
align-items:center;
}

.badge{
display:inline-block;
padding:10px 18px;
background:#ff6b0020;
border:1px solid #ff6b00;
border-radius:50px;
color:#ffb067;
font-size:14px;
margin-bottom:20px;
}

.hero h1{
font-size:56px;
line-height:1.05;
margin-bottom:20px;
}

.hero h1 span{
color:#ff8a00;
}

.subtitle{
font-size:18px;
color:#ddd;
line-height:1.8;
margin-bottom:30px;
}

.price-box{
margin-bottom:30px;
}

.old-price{
text-decoration:line-through;
font-size:24px;
color:#999;
}

.new-price{
font-size:64px;
font-weight:800;
color:#ff8a00;
}

.save{
color:#00ff84;
font-weight:700;
}

.countdown-box{
background:#111;
border:1px solid #333;
padding:20px;
border-radius:20px;
margin:25px 0;
}

#countdown{
font-size:34px;
font-weight:700;
color:#ff9b27;
}

.btn-buy{
display:inline-block;
padding:20px 34px;
background:linear-gradient(90deg,#ff6b00,#ff9f1a);
color:white;
text-decoration:none;
font-weight:700;
border-radius:60px;
box-shadow:0 0 30px #ff730055;
}

.payment-icons{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-top:25px;
}

.payment-icons span{
padding:10px 18px;
border-radius:40px;
background:#171717;
font-size:13px;
}

.video-card{
position:relative;
border-radius:30px;
overflow:hidden;
border:2px solid #ff6b00;
box-shadow:0 0 40px #ff6b0035;
}

.video-card video{
width:100%;
display:block;
}

.video-btn{
position:absolute;
width:48px;
height:48px;
border:none;
border-radius:50%;
background:#000000aa;
color:white;
font-size:18px;
cursor:pointer;
}

.play{bottom:15px;left:15px;}
.sound{bottom:15px;right:75px;}
.full{bottom:15px;right:15px;}

.trust{
padding:80px 0;
background:#0d0d0d;
}

.trust-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
}

.trust-grid div{
background:#151515;
padding:30px;
border-radius:20px;
}

.problem{
padding:80px 0;
}

.problem h2{
text-align:center;
font-size:42px;
margin-bottom:40px;
}

.problem-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
}

.problem-card{
background:#121212;
padding:25px;
border-radius:20px;
}

.solution{
padding:90px 0;
}

.solution-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:50px;
align-items:center;
}

.bundle-cover{
width:100%;
border-radius:24px;
}

.checkout{
padding:90px 0 140px;
}

.checkout-card{
background:linear-gradient(180deg,#141414,#0b0b0b);
padding:60px;
border-radius:35px;
text-align:center;
border:1px solid #ff6b00;
}

.checkout-price h1{
font-size:70px;
color:#ff8a00;
margin:20px 0;
}

.checkout-button{
display:inline-block;
padding:22px 42px;
background:#ff6b00;
color:white;
text-decoration:none;
font-size:22px;
font-weight:700;
border-radius:60px;
margin-top:25px;
}

.safe-payment{
margin-top:25px;
color:#00ff84;
}

#stickyBuyBar{
position:fixed;
bottom:-120px;
left:0;
width:100%;
padding:18px 25px;
background:#111;
display:flex;
justify-content:space-between;
align-items:center;
transition:.35s;
z-index:999;
}

#stickyBuyBar.show{
bottom:0;
}

.sticky-button{
background:#ff6b00;
padding:16px 24px;
border-radius:50px;
text-decoration:none;
color:white;
font-weight:700;
}

@media(max-width:768px){
.hero-grid,
.solution-grid,
.trust-grid,
.problem-grid{
grid-template-columns:1fr;
}

.hero h1{
font-size:40px;
}

.new-price{
font-size:48px;
}

.checkout-card{
padding:30px;
}

.checkout-price h1{
font-size:48px;
}
}

/* ================= PREVIEW EBOOK ================= */

.preview-section{
padding:100px 0;
background:#090909;
}

.preview-section h2{
font-size:42px;
text-align:center;
margin:20px 0;
}

.section-subtitle{
text-align:center;
max-width:700px;
margin:auto;
color:#cfcfcf;
margin-bottom:40px;
line-height:1.8;
}

.preview-slider{
overflow:hidden;
border-radius:30px;
}

.preview-track{
display:flex;
gap:25px;
transition:.5s;
}

.preview-track img{
width:260px;
border-radius:18px;
flex-shrink:0;
border:2px solid #222;
box-shadow:0 15px 30px rgba(0,0,0,.4);
}

.preview-track img:hover{
transform:translateY(-8px);
border-color:#ff6b00;
transition:.3s;
}

.slider-buttons{
display:flex;
justify-content:center;
gap:20px;
margin-top:35px;
}

.slider-buttons button{
width:55px;
height:55px;
border-radius:50%;
border:none;
background:#ff6b00;
color:white;
font-size:22px;
cursor:pointer;
}

/* ================= GRID BUNDLE ================= */

.bundle-section{
padding:100px 0;
}

.bundle-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:25px;
margin-top:50px;
}

.bundle-card{
background:#111;
padding:20px;
border-radius:22px;
text-align:center;
transition:.3s;
border:1px solid #1f1f1f;
}

.bundle-card:hover{
transform:translateY(-10px);
border-color:#ff6b00;
box-shadow:0 0 25px rgba(255,107,0,.3);
}

.bundle-card img{
width:100%;
border-radius:15px;
margin-bottom:15px;
}

.bundle-card h3{
color:#ff8a00;
margin-bottom:10px;
}

.bundle-card p{
font-size:14px;
color:#ccc;
}

@media(max-width:768px){
.bundle-grid{
grid-template-columns:repeat(2,1fr);
}
}

/* ================= BONUS ================= */

.bonus-section{
padding:100px 0;
background:#090909;
}

.bonus-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:25px;
margin-top:40px;
}

.bonus-card{
background:linear-gradient(180deg,#171717,#0b0b0b);
padding:18px;
border-radius:22px;
text-align:center;
border:1px solid #222;
}

.bonus-card img{
width:100%;
border-radius:15px;
margin-bottom:15px;
}

.bonus-card h3{
font-size:15px;
color:#ffb067;
}

@media(max-width:768px){
.bonus-grid{
grid-template-columns:repeat(2,1fr);
}
}

/* ================= VALUE STACK ================= */

.value-section{
padding:100px 0;
}

.value-card{
background:linear-gradient(180deg,#141414,#080808);
padding:60px;
border-radius:35px;
border:1px solid #ff6b00;
}

.value-list div{
display:flex;
justify-content:space-between;
padding:15px 0;
border-bottom:1px solid #222;
}

.value-list strong{
color:#ff8a00;
}

.total-price{
text-align:center;
padding-top:30px;
}

.total-price h3{
text-decoration:line-through;
color:#999;
margin-bottom:10px;
}

.total-price h1{
font-size:64px;
color:#ff8a00;
margin-bottom:25px;
}

.big{
width:100%;
text-align:center;
font-size:22px;
}

/* ================= CTA TENGAH ================= */

.middle-cta{
padding:100px 0;
text-align:center;
background:linear-gradient(90deg,#ff6b00,#ff8a00);
}

.middle-cta h2{
font-size:42px;
margin-bottom:20px;
}

.middle-cta p{
max-width:650px;
margin:auto;
margin-bottom:35px;
font-size:18px;
line-height:1.8;
}

.middle-cta .btn-buy{
background:black;
color:#ff8a00;
}

/* ================= STATS ================= */

.stats-section{

padding:90px 0;

background:#0a0a0a;

}

.stats-grid{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:25px;

}

.stat-box{

background:#141414;
padding:35px;
border-radius:25px;
text-align:center;
border:1px solid #222;

}

.stat-box h2{

font-size:48px;
color:#ff8a00;
margin-bottom:10px;

}

.stat-box p{

color:#bbb;

}

@media(max-width:768px){

.stats-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* ================= FAQ ================= */

.faq-section{

padding:100px 0;

}

.faq-item{

background:#121212;
border-radius:18px;
margin-bottom:20px;
overflow:hidden;
border:1px solid #222;

}

.faq-question{

padding:25px;
display:flex;
justify-content:space-between;
cursor:pointer;
font-weight:600;
font-size:18px;

}

.faq-question span{

color:#ff8a00;
font-size:26px;

}

.faq-answer{

padding:0 25px;
max-height:0;
overflow:hidden;
color:#bbb;
transition:.4s;

}

.faq-item.active .faq-answer{

padding:20px 25px 30px;
max-height:250px;

}

/* ================= TESTIMONI ================= */

.testimonial-section{

padding:100px 0;
background:#090909;

}

.testimonial-grid{

display:grid;
grid-template-columns:repeat(3,1fr);
gap:25px;

}

.testimonial-card{

background:#151515;
padding:30px;
border-radius:22px;
text-align:center;

}

.testimonial-card img{

width:80px;
height:80px;
border-radius:50%;
margin-bottom:20px;

}

.testimonial-card h4{

color:#ff8a00;
margin-bottom:15px;

}

.testimonial-card p{

color:#ccc;
line-height:1.7;

}

@media(max-width:768px){

.testimonial-grid{

grid-template-columns:1fr;

}

}

/* ================= GARANSI ================= */

.guarantee{

padding:100px 0;

}

.guarantee-box{

display:grid;
grid-template-columns:140px 1fr;
gap:30px;
align-items:center;
background:#052814;
padding:40px;
border-radius:30px;

}

.icon{

font-size:70px;
text-align:center;

}

.guarantee ul{

margin:25px 0;
line-height:2;

}

@media(max-width:768px){

.guarantee-box{

grid-template-columns:1fr;
text-align:center;

}

}

/* ================= WA POPUP ================= */

#waPopup{

position:fixed;
right:25px;
bottom:-500px;
width:330px;
transition:.5s;
z-index:9999;

}

#waPopup.show{

bottom:30px;

}

.wa-popup-box{

background:#111;
padding:25px;
border-radius:25px;
border:1px solid #25D366;
position:relative;

}

#closeWaPopup{

position:absolute;
top:12px;
right:15px;
background:none;
border:none;
color:white;
font-size:20px;
cursor:pointer;

}

/* ================= REVEAL ================= */

.reveal{

opacity:0;
transform:translateY(60px);
transition:all .8s ease;

}

.reveal.active{

opacity:1;
transform:translateY(0);

}

/* ================= EXIT POPUP ================= */

#exitPopup{

position:fixed;
inset:0;
background:rgba(0,0,0,.85);
display:flex;
justify-content:center;
align-items:center;
opacity:0;
visibility:hidden;
transition:.35s;
z-index:99999;

}

#exitPopup.show{

opacity:1;
visibility:visible;

}

.exit-box{

background:#111;
width:min(560px,92%);
padding:40px;
border-radius:30px;
border:2px solid #ff6b00;
text-align:center;
position:relative;

}

.exit-box h2{

font-size:36px;
margin:20px 0;
color:#ff8a00;

}

.exit-box p{

line-height:1.8;
color:#ddd;
margin-bottom:25px;

}

.bonus-mini{

display:grid;
gap:12px;
margin-bottom:30px;

}

.bonus-mini div{

background:#1b1b1b;
padding:14px;
border-radius:12px;

}

#closeExit{

position:absolute;
right:20px;
top:20px;
background:none;
border:none;
color:white;
font-size:24px;
cursor:pointer;

}

/* ================= LIVE PURCHASE ================= */

#livePurchase{

position:fixed;
left:25px;
bottom:-200px;
display:flex;
gap:15px;
align-items:center;
background:#101010;
padding:15px 20px;
border-radius:20px;
border:1px solid #ff6b00;
transition:.5s;
z-index:9999;
width:320px;

}

#livePurchase.show{

bottom:25px;

}

#livePurchase img{

width:55px;
height:55px;
border-radius:50%;

}

#livePurchase h4{

color:#ff8a00;
margin-bottom:4px;

}

#livePurchase p{

font-size:13px;
color:#ddd;

}

#livePurchase small{

color:#777;

}

/* ================= FLOATING WA ================= */

#floatingWA{

position:fixed;
right:25px;
bottom:25px;
background:#25D366;
padding:16px 22px;
border-radius:50px;
display:flex;
align-items:center;
gap:12px;
color:white;
text-decoration:none;
font-weight:600;
box-shadow:0 15px 35px rgba(37,211,102,.4);
z-index:999;

}

#floatingWA img{

width:26px;

}

#floatingWA:hover{

transform:scale(1.05);

}

/* ================= SCROLL BAR ================= */

#scrollBar{

position:fixed;
top:0;
left:0;
height:4px;
width:0%;
background:#ff6b00;
z-index:999999;

}

/* ================= PROMO CTA ================= */

#promoCTA{

position:fixed;
bottom:-150px;
left:50%;
transform:translateX(-50%);
background:#ff6b00;
padding:18px 28px;
border-radius:60px;
display:flex;
align-items:center;
gap:20px;
transition:.4s;
z-index:9999;

}

#promoCTA.show{

bottom:95px;

}

#promoCTA a{

color:white;
font-weight:700;
text-decoration:none;

}

/* ================= FOOTER ================= */

.footer-premium{

background:#050505;
padding-top:80px;
border-top:1px solid #222;

}

.footer-grid{

display:grid;
grid-template-columns:2fr 1fr 1fr;
gap:40px;

}

.footer-logo{

width:80px;
margin-bottom:20px;

}

.footer-grid h4{

color:#ff8a00;
margin-bottom:20px;

}

.footer-grid li{

margin-bottom:12px;
color:#bbb;
list-style:none;

}

.footer-bottom{

padding:35px 0;
text-align:center;
color:#777;

}

@media(max-width:768px){

.footer-grid{

grid-template-columns:1fr;

}

}

/* ======================================
   PROGRESS BAR SCROLL
====================================== */

#scrollBar{
    position: fixed;
    top: 0;
    left: 0;
    width: 0%;
    height: 4px;
    background: #ff6b00;
    z-index: 999999;
    transition: width .15s linear;
}