
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,sans-serif;background:#090909;color:#fff}
body:before{content:"";position:fixed;inset:0;background:
radial-gradient(circle at 15% 20%,rgba(255,193,7,.15),transparent 35%),
radial-gradient(circle at 85% 15%,rgba(255,193,7,.08),transparent 25%),
linear-gradient(#0b0b0b,#070707);z-index:-2}
.wrap{max-width:1180px;margin:auto;padding:0 20px}
nav{position:sticky;top:0;background:rgba(10,10,10,.75);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.08);z-index:99}
.nav{display:flex;justify-content:space-between;align-items:center;padding:18px 0}
.logo{font-size:28px;font-weight:800}.logo span{color:#ffc107}
nav ul{display:flex;list-style:none;gap:26px}
nav a{text-decoration:none;color:#ddd}
.btn{display:inline-block;background:#ffc107;color:#111;padding:14px 26px;border-radius:999px;font-weight:800;text-decoration:none;box-shadow:0 0 25px rgba(255,193,7,.35);transition:.3s}
.btn:hover{transform:translateY(-3px)}
.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:20px;align-items:center;padding:90px 0;min-height:85vh;}
h1{font-size:58px;line-height:1.1;margin-bottom:18px}
.gold{color:#ffc107}
.lead{color:#bbb;font-size:18px;margin-bottom:30px}
.mock{height:420px;border-radius:28px;background:linear-gradient(145deg,#161616,#0d0d0d);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.mock:before{content:"📈";font-size:140px;opacity:.12}
.mock:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;background:#ffc10722;filter:blur(60px)}
.sec{padding:80px 0}
.title{text-align:center;font-size:38px;margin-bottom:40px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px}
.card{background:rgba(255,255,255,.05);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);padding:28px;border-radius:24px;transition:.35s}
.card:hover{transform:translateY(-8px);border-color:#ffc107}
.card i{font-size:40px;color:#ffc107;margin-bottom:16px}
.card h3{margin-bottom:10px}
.card p{color:#bcbcbc;font-size:15px}
.recommended{border:2px solid #ffc107;position:relative}
.badge{position:absolute;top:-12px;right:18px;background:#ffc107;color:#111;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:700}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
.stat{padding:25px;background:#101010;border-radius:18px}
.stat h2{color:#ffc107;font-size:40px}
.faq details{background:#111;padding:18px;border-radius:16px;margin:12px 0}
.cta{background:linear-gradient(135deg,#1b1b1b,#0d0d0d);padding:70px;border-radius:30px;text-align:center;border:1px solid #ffc10755}
footer{padding:40px 0;color:#999;text-align:center;border-top:1px solid rgba(255,255,255,.08)}
.reveal{opacity:0;transform:translateY(30px);transition:1s}
.reveal.show{opacity:1;transform:none}
@media(max-width:850px){
.hero{grid-template-columns:1fr}
h1{font-size:42px}
nav ul{display:none}
.stats{grid-template-columns:repeat(2,1fr)}
}
  
  .hero-image{
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-right:-30px;
}

.hero-image img{

    width:115%;
    max-width:620px;

    z-index:2;

    position:relative;

    filter:drop-shadow(0 35px 70px rgba(0,0,0,.55));

    animation:float 5s ease-in-out infinite;
    
    transform: translateY(-60px);
  background: radial-gradient(circle, rgba(255,193,7,.18), transparent 70%);
}

.glow{

    position:absolute;

    width:650px;

    height:650px;

    background:#ffc107;

    border-radius:50%;

    filter:blur(160px);

    opacity:.28;

}

@keyframes float{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-10px);

}

100%{

transform:translateY(0px);

}

}


/* FAQ Premium Update */
.faq details{
  margin-bottom:22px;
  padding:28px 32px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(255,255,255,.03);
  transition:.35s ease;
}
.faq details[open]{
  border-color:#FFC10755;
  box-shadow:0 0 0 1px rgba(255,193,7,.15),0 10px 30px rgba(0,0,0,.25);
}
.faq summary{
  cursor:pointer;
  font-size:1.15rem;
  font-weight:700;
  list-style:none;
  margin:0;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
  content:'+';
  float:right;
  color:#FFC107;
  font-size:1.3rem;
  transition:.3s;
}
.faq details[open] summary::after{content:'−';transform:rotate(180deg);}
.faq details p{
  margin-top:18px;
  line-height:1.9;
  color:#cfcfcf;
}


/* MWWS v0.4 Responsive Hero Fix */
.hero{
padding-left:clamp(24px,5vw,60px);
padding-right:clamp(24px,5vw,60px);
}
.hero h1{
font-size:clamp(2.5rem,7vw,4.8rem);
line-height:1.08;
}
.hero .lead{
font-size:clamp(1rem,2.5vw,1.15rem);
line-height:1.8;
max-width:640px;
}
@media (max-width:768px){
.hero{
grid-template-columns:1fr;
gap:42px;
padding:90px 24px 60px;
text-align:left;
}
.hero-image{
justify-content:center!important;
margin-right:0!important;
}
.hero-image img{
width:min(100%,340px)!important;
transform:none!important;
}
.btn{
width:100%;
text-align:center;
}
nav .nav{
padding-left:20px;
padding-right:20px;
}
.faq details{
padding:28px 24px;
margin-bottom:18px;
}
.faq details p{
margin-top:18px;
line-height:1.9;
}
}

.trust-strip .card{text-align:center}
.trust-strip .card i{font-size:34px}
#platforms .card ul{padding-left:0;list-style:none}
#platforms .card ul li:before{content:'✓ ';color:#FFC107;font-weight:bold}
#platforms .lead{color:#bcbcbc}

footer{
    background:#111;
    color:#ddd;
    padding:60px 20px 25px;
    margin-top:80px;
}

.footer-container{
    max-width:1200px;
    margin:auto;

    display:flex;
    justify-content:space-between;
    gap:60px;

    flex-wrap:wrap;
}

.footer-brand{
    flex:1;
    min-width:260px;
}

.footer-brand h3{
    color:white;
    margin-bottom:15px;
}

.footer-brand span{
    color:#FFD54A;
}

.footer-brand p{
    color:#aaa;
    line-height:1.8;
}

.footer-links{
    display:flex;
    gap:60px;
}

.footer-column{
    display:flex;
    flex-direction:column;
}

.footer-column h4{
    color:white;
    margin-bottom:15px;
}

.footer-column a{
    color:#bbb;
    text-decoration:none;
    margin-bottom:10px;
    transition:.25s;
}

.footer-column a:hover{
    color:#FFD54A;
}

.footer-bottom{
    max-width:1200px;
    margin:50px auto 0;

    border-top:1px solid #2a2a2a;

    padding-top:25px;

    text-align:center;
}

.footer-bottom p{
    color:#888;
    margin:10px 0;
    line-height:1.7;
}

@media (max-width:768px){

.footer-container{

flex-direction:column;

gap:40px;

}

.footer-links{

flex-direction:column;

gap:30px;

}

}

.footer-logo{
color:white;
text-decoration:none;
}

.footer-logo span{
color:#FFD54A;
}