*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    background:#050505;
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
}

/* CABECERA TRANSPARENTE */

.lp-header{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    z-index:1000;

    background:transparent;
    border:none;

    padding:20px 0 12px;
    text-align:center;
}

.lp-logo{
    font-size:28px;
    font-weight:900;
    letter-spacing:3px;
    color:#111;
    text-shadow:0 0 2px #d4a53a,0 0 8px rgba(212,165,58,.8),0 0 16px rgba(212,165,58,.5);
    margin-bottom:14px;
}

.lp-nav{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:6px;
}

.lp-nav a{
    padding:8px 14px;
    border:1px solid #a87914;
    color:#d4a53a;
    text-decoration:none;
    font-size:11px;
    font-weight:800;
    letter-spacing:1px;
    background:rgba(0,0,0,.55);
    backdrop-filter:blur(3px);
}

.lp-nav a:hover{
    background:rgba(20,20,20,.85);
}

.lp-nav a.active{
    background:#d4a53a;
    color:#000;
}

.lp-vips-page{
    width:100%;
    min-height:calc(100vh - 120px);

    padding:140px 24px 70px;

    background:
        linear-gradient(rgba(0,0,0,.35), rgba(0,0,0,.35)),
        url('/assets/img/vip-fondo.png') center top / cover no-repeat;

    background-attachment:fixed;
}

.lp-vips-box{
    width:min(980px,100%);
    margin:0 auto 45px;
    text-align:center;
    padding:55px 45px;
    border:1px solid rgba(212,165,58,.35);
    background:rgba(8,8,8,.78);
    backdrop-filter:blur(4px);
    box-shadow:0 0 35px rgba(212,165,58,.18);
}

.lp-vips-box h1{
    color:#d4a53a;
    font-size:48px;
    margin-bottom:12px;
    letter-spacing:1px;
}

.vip-price{
    display:inline-block;
    margin-bottom:22px;
    padding:8px 22px;
    border:1px solid rgba(212,165,58,.55);
    color:#f2c15a;
    font-weight:900;
    font-size:22px;
    letter-spacing:1px;
    background:rgba(0,0,0,.65);
}

.lp-vips-box p{
    max-width:780px;
    margin:0 auto 30px;
    font-size:19px;
    line-height:1.7;
}

.lp-buy-btn{
    display:inline-block;
    padding:16px 42px;
    background:#d4a53a;
    color:#000;
    text-decoration:none;
    font-weight:900;
    border:1px solid #f2c15a;
    transition:.15s ease;
}

.lp-buy-btn:hover{
    background:#f2c15a;
    transform:translateY(-1px);
}

.vip-features{
    margin:35px auto 0;
    max-width:760px;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
    gap:12px;
}

.vip-features div{
    padding:13px 15px;
    border:1px solid rgba(212,165,58,.25);
    background:rgba(10,10,10,.78);
    backdrop-filter:blur(3px);
    color:#e7e7e7;
    font-weight:800;
    font-size:14px;
}

.vip-section{
    width:min(1100px,100%);
    margin:0 auto 45px;
}

.vip-section h2,
.vip-final h2{
    text-align:center;
    color:#d4a53a;
    font-size:34px;
    margin-bottom:25px;
    letter-spacing:1px;
}

.vip-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:18px;
}

.vip-card,
.faq-item{
    padding:28px;
    border:1px solid rgba(212,165,58,.28);
    background:rgba(10,10,10,.78);
    backdrop-filter:blur(3px);
}

.vip-card h3,
.faq-item h3{
    color:#f2c15a;
    font-size:20px;
    margin-bottom:12px;
}

.vip-card p,
.faq-item p{
    color:#ddd;
    font-size:16px;
    line-height:1.6;
}

.vip-faq{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:18px;
}

.vip-final{
    width:min(980px,100%);
    margin:0 auto;
    padding:45px;
    text-align:center;
    border:1px solid rgba(242,193,90,.45);
    background:rgba(12,12,12,.82);
    backdrop-filter:blur(4px);
}

.vip-final p{
    margin:0 auto 28px;
    max-width:680px;
    color:#eee;
    font-size:18px;
    line-height:1.6;
}

@media(max-width:700px){

    .lp-vips-page{
        padding:120px 14px 50px;
        background-attachment:scroll;
    }

    .lp-vips-box{
        padding:38px 22px;
    }

    .lp-vips-box h1{
        font-size:34px;
    }

    .lp-vips-box p{
        font-size:16px;
    }

    .vip-section h2,
    .vip-final h2{
        font-size:26px;
    }

    .vip-final{
        padding:32px 20px;
    }
}

.vip-image{
    text-align:center;
    margin:0 auto 40px;
}

.vip-image img{
    max-width:350px;
    width:100%;
    height:auto;
    display:inline-block;
    border:1px solid rgba(212,165,58,.35);
}