:root {
    --neon-green: #00FF88;
    --dark-bg: #050505; /* Fundo ligeiramente mais escuro e sóbrio */
    --card-bg: #141414;
    --text-gray: #b0b0b0;
}

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

body {
    background-color: var(--dark-bg);
    color: white;
    padding-bottom: 100px;
    overflow-x: hidden;
    line-height: 1.5;
}

.container {
    width: 90%;
    max-width: 450px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    text-align: center;
}

/* --- HERO SECTION --- */
.hero {
    position: relative;
    padding: 30px 0;
    /* Certifique-se que a imagem stadium-bg.jpg é de alta qualidade e não parece um casino */
    background-image: url('assets/stadium-bg.jpg'); 
    background-size: cover;
    background-position: center;
    min-height: 90vh; /* Ajustado para melhor visualização mobile */
    display: flex;
    align-items: center;
}

.overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to bottom, rgba(5,5,5,0.7), rgba(5,5,5,1));
    z-index: 1;
}

.logo-container {
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
}

.logo-img {
    max-height: 60px; /* Logo um pouco mais discreto */
    width: auto;
}

.trust-header {
    display: flex;
    justify-content: center;
    gap: 15px;
    font-size: 0.8rem;
    margin-bottom: 20px;
    align-items: center;
}

.live-badge {
    background: rgba(0, 255, 136, 0.1);
    border: 1px solid var(--neon-green);
    color: var(--neon-green);
    padding: 4px 12px;
    border-radius: 4px;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.rating { color: #FFD700; font-weight: 600; font-size: 0.8rem;}

.headline {
    font-size: 1.8rem;
    line-height: 1.2;
    font-weight: 800;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.green-text {
    color: var(--neon-green);
}

.sub-headline {
    font-size: 0.95rem;
    color: var(--text-gray);
    margin-bottom: 25px;
    font-weight: 400;
    padding: 0 10px;
}

/* COMMITMENT BOX - Mais sóbria */
.commitment-box {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 25px;
}

.commitment-text {
    font-size: 0.9rem;
    color: #e0e0e0;
    font-weight: 500;
}

.highlight-money {
    color: var(--neon-green);
    font-weight: 700;
}

/* BUTTONS */
.btn-main {
    display: block;
    background: var(--neon-green);
    color: #000;
    text-decoration: none;
    padding: 18px;
    border-radius: 8px;
    font-weight: 800;
    text-transform: uppercase;
    box-shadow: 0 4px 20px rgba(0, 255, 136, 0.25);
    transition: transform 0.2s;
    margin-bottom: 10px;
}

.btn-main:active { transform: scale(0.98); }

.btn-text { display: block; font-size: 1rem; letter-spacing: 0.5px; }
.btn-sub { display: block; font-size: 0.75rem; font-weight: 600; margin-top: 4px; opacity: 0.8; }

/* MARQUEE - PROVA SOCIAL */
.social-proof-section {
    width: 100%;
    background: transparent;
    padding: 15px 0;
    overflow: hidden;
    margin-top: 20px;
    opacity: 0.7;
}

.marquee-wrapper { display: flex; overflow: hidden; user-select: none; }
.marquee-track {
    display: flex; gap: 2rem; width: max-content;
    animation: scroll-left 30s linear infinite; /* Mais lento para leitura fácil */
}
.review-group { display: flex; gap: 2rem; align-items: center; }
.review-item {
    font-size: 0.8rem; color: #888;
    display: flex; align-items: center; gap: 6px;
    white-space: nowrap;
}
.check-icon { color: var(--neon-green); font-size: 0.8rem;}

@keyframes scroll-left {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-100% - 2rem)); }
}

/* --- SEÇÃO DE MÉTODO --- */
.method-section { padding: 50px 0; background: #0f0f0f; }

.cards-grid { display: flex; flex-direction: column; gap: 20px; }
.card {
    background: var(--card-bg); padding: 25px; border-radius: 12px;
    text-align: left; border: 1px solid #222;
}
.highlight-card { border: 1px solid rgba(0, 255, 136, 0.3); background: rgba(0, 255, 136, 0.02); }
.card h3 { color: #fff; margin-bottom: 8px; font-size: 1.1rem; }
.card p { color: var(--text-gray); font-size: 0.9rem; line-height: 1.6; }
.icon { font-size: 1.8rem; margin-bottom: 15px; }

/* --- SEÇÃO DE PROVA SOCIAL --- */
.proof-section { padding: 50px 0; background: var(--dark-bg); }

.highlight-gallery {
    display: flex; 
    flex-direction: column; 
    gap: 20px; 
}

.proof-img {
    width: 100%; 
    border-radius: 8px;
    border: 1px solid #333;
}

.scroll-container {
    display: flex;
    overflow-x: auto;
    gap: 15px;
    padding: 10px 5px 20px 5px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}
.scroll-container::-webkit-scrollbar { display: none; }

.scroll-item {
    flex: 0 0 85%;
    scroll-snap-align: center;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #333;
}

.scroll-item img {
    width: 100%;
    display: block;
}

.btn-secondary {
    display: inline-block;
    color: var(--neon-green);
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 255, 136, 0.3);
    font-weight: 600;
    font-size: 0.9rem;
    padding-bottom: 2px;
}

/* --- FOOTER & STICKY --- */
footer { padding: 40px 0 120px 0; font-size: 0.7rem; color: #555; background: #020202; }
.footer-links { margin-top: 10px; }
.footer-links a { color: #777; text-decoration: none; margin: 0 5px; transition: color 0.3s;}
.footer-links a:hover { color: #aaa; }

.sticky-wrapper {
    position: fixed; bottom: 20px; left: 0; right: 0;
    padding: 0 20px; z-index: 999; text-align: center;
}

.btn-sticky {
    display: block; background: var(--neon-green);
    color: #000; font-weight: 800; padding: 16px;
    border-radius: 50px; text-decoration: none;
    text-transform: uppercase; font-size: 1rem;
    box-shadow: 0 5px 20px rgba(0,0,0,0.8);
    width: 100%; max-width: 450px; margin: 0 auto;
    border: 2px solid #fff; /* Borda branca para destacar no fundo escuro */
}