:root{
    --gold:#f7c948;
    --gold2:#ffd86a;
    --dark:#0f0f10;
    --card:rgba(255,255,255,.06);
    --text:#ffffff;
    --green:#25D366;
    --shadow:0 15px 40px rgba(0,0,0,.35);
}

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

html{
    scroll-behavior:smooth;
}

body{
    background:
    radial-gradient(circle at top,#1d1d1d 0%,#0f0f10 65%);
    color:var(--text);
    font-family:Arial,Helvetica,sans-serif;
    overflow-x:hidden;
}

.hero{
    min-height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:40px 20px 120px;
}

.card{

    width:100%;
    max-width:760px;

    background:var(--card);

    backdrop-filter:blur(12px);

    border:1px solid rgba(255,255,255,.08);

    border-radius:28px;

    padding:55px;

    text-align:center;

    box-shadow:var(--shadow);

}

.logo{

font-size:72px;

font-weight:900;

letter-spacing:5px;

color:var(--gold);

margin-bottom:10px;

}

.badge{

display:inline-block;

padding:10px 18px;

border-radius:999px;

background:#1d1d1d;

border:1px solid rgba(255,255,255,.1);

margin-bottom:25px;

}

.title{

font-size:34px;

font-weight:bold;

margin-bottom:15px;

}

.subtitle{

opacity:.8;

font-size:18px;

margin-bottom:35px;

}

.phone{

font-size:40px;

font-weight:bold;

color:var(--gold);

margin-bottom:35px;

}

.buttons{

display:flex;

gap:16px;

justify-content:center;

flex-wrap:wrap;

}

.btn{

padding:18px 34px;

border-radius:16px;

font-size:19px;

font-weight:bold;

text-decoration:none;

transition:.35s;

}

.btn:hover{

transform:translateY(-4px);

}

.call{

background:linear-gradient(45deg,var(--gold),var(--gold2));

color:#111;

}

.wp{

background:var(--green);

color:white;

}

.bottomBar{

position:fixed;

bottom:0;

left:0;

width:100%;

display:flex;

z-index:999;

box-shadow:0 -10px 25px rgba(0,0,0,.35);

}

.bottomBar a{

flex:1;

padding:18px;

text-align:center;

text-decoration:none;

font-size:20px;

font-weight:bold;

}

.bottomCall{

background:#111;

color:white;

}

.bottomWp{

background:var(--green);

color:white;

}

@media(max-width:700px){

.card{

padding:35px 20px;

}

.logo{

font-size:54px;

}

.title{

font-size:27px;

}

.phone{

font-size:30px;

}

.btn{

width:100%;

}

}

/* ===== Premium Hero ===== */

.hero{
    position:relative;
    overflow:hidden;
    background:
    radial-gradient(circle at top,#2a2a2a 0%,#111 60%,#000 100%);
}

.overlay{
    position:absolute;
    inset:0;
    background:
    radial-gradient(circle,#FFD54F22 0%,transparent 60%);
    animation:pulse 6s infinite;
}

.box{
    position:relative;
    z-index:2;
    background:rgba(255,255,255,.04);
    backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    padding:55px;
    box-shadow:0 20px 60px rgba(0,0,0,.45);
}

.badge{
    display:inline-block;
    background:#FFD54F;
    color:#111;
    padding:8px 18px;
    border-radius:999px;
    font-size:14px;
    font-weight:bold;
    margin-bottom:22px;
}

.logo{
    font-size:82px;
    font-weight:900;
    color:#FFD54F;
    letter-spacing:4px;
    text-shadow:0 0 20px rgba(255,213,79,.35);
}

.subtitle{
    margin-top:12px;
    font-size:34px;
    font-weight:700;
}

.desc{
    max-width:600px;
    margin:25px auto;
    color:#d5d5d5;
    font-size:20px;
}

.phone{
    font-size:42px;
}

@keyframes pulse{

0%{
opacity:.35;
transform:scale(1);
}

50%{
opacity:.8;
transform:scale(1.08);
}

100%{
opacity:.35;
transform:scale(1);
}

}

@media(max-width:768px){

.box{
padding:35px 22px;
}

.logo{
font-size:58px;
}

.subtitle{
font-size:24px;
}

.desc{
font-size:17px;
}

.phone{
font-size:28px;
}

}
