/* ===== TEMA ESCURO PREMIUM ===== */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',sans-serif;background:#0f0f0f;color:#ffffff;padding-bottom:80px;font-size:16px}
.bg-pattern{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background:radial-gradient(circle at 20% 30%, rgba(255,59,48,0.08) 0%, transparent 50%), radial-gradient(circle at 80% 70%, rgba(255,59,48,0.05) 0%, transparent 50%), #0f0f0f}

/* ===== NAVBAR ===== */
.navbar-top{background:#111111;border-bottom:1px solid #252525;padding:10px 0;position:sticky;top:0;z-index:1000}
.logo{font-weight:900;font-size:1.4rem;color:#fff;display:flex;align-items:center;gap:8px;text-decoration:none}
.logo img{height:36px;display:block}
.logo span{background:linear-gradient(135deg,#ff3b30,#ff6b6b);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.nav-link-custom{color:#888!important;font-weight:600;padding:6px 14px!important;border-radius:8px;font-size:0.85rem;text-decoration:none;transition:0.3s}
.nav-link-custom:hover{color:#fff!important;background:rgba(255,255,255,0.05)}
.nav-link-custom.active{color:#fff!important;background:rgba(255,59,48,0.15)}
.nav-link-custom i{margin-right:6px}

/* ===== BOTTOM NAV ===== */
.bottom-nav{position:fixed;bottom:0;left:0;width:100%;background:#111111;border-top:1px solid #252525;padding:4px 0;z-index:1000}
.bottom-nav .nav-item{display:flex;flex-direction:column;align-items:center;gap:1px;color:#555;text-decoration:none;font-size:0.55rem;font-weight:600;padding:4px 0;border-radius:8px;transition:0.3s}
.bottom-nav .nav-item i{font-size:1.2rem;transition:0.3s}
.bottom-nav .nav-item:hover,.bottom-nav .nav-item.active{color:#ff3b30}
.bottom-nav .nav-item.active i{color:#ff3b30;text-shadow:0 0 20px rgba(255,59,48,0.3)}

/* ===== CARDS ===== */
.glass-card{background:#181818;border:1px solid #252525;border-radius:16px;padding:20px;transition:all 0.3s;height:100%}
.glass-card:hover{transform:translateY(-5px);border-color:#ff3b30;box-shadow:0 0 30px rgba(255,59,48,0.15)}
.stat-card{background:#181818;border:1px solid #252525;border-radius:16px;padding:20px;text-align:center;transition:0.3s}
.stat-card:hover{transform:translateY(-5px);border-color:#ff3b30}
.stat-card .numero{font-size:2.2rem;font-weight:900;background:linear-gradient(135deg,#ff3b30,#ff6b6b);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.stat-card .label{color:#888;font-size:0.85rem}

/* ===== PLANOS ===== */
.plano-card{background:#181818;border:1px solid #252525;border-radius:16px;padding:20px;transition:0.3s;height:100%;text-align:center;position:relative}
.plano-card:hover{transform:translateY(-6px);border-color:#ff3b30;box-shadow:0 0 30px rgba(255,59,48,0.15)}
.plano-card.popular{border-color:#ff3b30}
.plano-card.popular::before{content:'🔥 MAIS VENDIDO';position:absolute;top:-10px;right:10px;background:#ff3b30;color:#fff;padding:3px 12px;border-radius:30px;font-size:0.55rem;font-weight:700}
.plano-card .plano-preco{font-weight:900;font-size:1.8rem;margin:8px 0}
.plano-card .plano-preco small{font-size:0.8rem;color:#666}
.plano-card .plano-features{list-style:none;padding:0;margin:12px 0;text-align:left}
.plano-card .plano-features li{padding:4px 0;color:#aaa;font-size:0.85rem;display:flex;align-items:center;gap:8px}
.plano-card .plano-features li .fa-check-circle{color:#34d399}

/* ===== BOTÕES ===== */
.btn-premium{border:none;padding:10px 20px;border-radius:12px;font-weight:700;font-size:0.9rem;transition:0.3s;color:#fff;width:100%}
.btn-premium:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(255,59,48,0.3)}
.btn-red{background:linear-gradient(135deg,#ff3b30,#e6352b)}
.btn-bronze{background:linear-gradient(135deg,#cd7f32,#a8651e)}
.btn-silver{background:linear-gradient(135deg,#b0a69b,#8a7e72)}
.btn-gold{background:linear-gradient(135deg,#d4a373,#b8863a)}
.btn-dark-custom{background:#252525}
.btn-dark-custom:hover{background:#333}
.btn-success-custom{background:#34d399}
.btn-success-custom:hover{background:#2ecc71}

/* ===== HERO BANNER ===== */
.hero-banner{min-height:300px;display:flex;align-items:center;background:linear-gradient(135deg,rgba(255,59,48,0.15),rgba(0,0,0,0.8)),url('/assets/img/banner.webp') center center;background-size:cover;border-radius:16px;margin-bottom:30px;padding:30px}
.hero-banner h1{font-weight:900;font-size:2.5rem;color:#fff}
.hero-banner h1 span{background:linear-gradient(135deg,#ff3b30,#ff6b6b);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hero-banner p{font-size:1.1rem;color:rgba(255,255,255,0.7)}
.hero-banner .btn{font-size:1rem;padding:12px 30px;border-radius:50px}

/* ===== PRODUTOS ===== */
.produto-card{background:#181818;border:1px solid #252525;border-radius:16px;padding:16px;transition:0.3s;height:100%;text-align:center}
.produto-card:hover{transform:translateY(-6px);border-color:#ff3b30}
.produto-card .produto-img{max-width:100%;height:120px;object-fit:cover;border-radius:12px;margin-bottom:10px}
.produto-card .produto-preco{font-weight:900;font-size:1.5rem;color:#ff3b30}

/* ===== WHATSAPP ===== */
.whatsapp-float{position:fixed;bottom:100px;right:15px;width:55px;height:55px;background:#25D366;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.8rem;z-index:999;text-decoration:none;transition:0.3s;box-shadow:0 4px 30px rgba(37,211,102,0.4)}
.whatsapp-float:hover{transform:scale(1.1);color:#fff}

/* ===== RANKING ===== */
.ranking-item{display:flex;align-items:center;gap:12px;padding:10px 14px;background:#181818;border:1px solid #252525;border-radius:12px;margin-bottom:8px;transition:0.3s}
.ranking-item:hover{background:#222;border-color:#ff3b30}
.ranking-item .posicao{font-weight:900;font-size:1.1rem;color:#ff3b30;width:25px}
.ranking-item .nome{flex:1;font-size:0.9rem}

/* ===== CONTATO ===== */
.contato-card{background:#181818;border:1px solid #252525;border-radius:16px;padding:16px;text-align:center;transition:0.3s}
.contato-card:hover{transform:translateY(-4px);border-color:#ff3b30}
.contato-card .contato-icon{font-size:2.2rem;color:#25D366;display:block;margin-bottom:6px}

/* ===== RODAPÉ ===== */
.footer{background:#111111;padding:30px 0 16px;margin-top:40px;border-top:1px solid #252525}
.footer a{color:#666;text-decoration:none;font-size:0.85rem;transition:0.2s}
.footer a:hover{color:#ff3b30}
.footer a i{margin-right:6px}

/* ===== RESPONSIVIDADE TOTAL ===== */
@media (max-width: 992px) {
    .hero-banner h1 { font-size: 2rem; }
    .hero-banner { min-height: 250px; padding: 25px; }
    .stat-card .numero { font-size: 1.8rem; }
    .plano-card .plano-preco { font-size: 1.5rem; }
}

@media (max-width: 768px) {
    body { font-size: 14px; padding-bottom: 70px; }
    .hero-banner { min-height: 200px; padding: 20px; border-radius: 12px; }
    .hero-banner h1 { font-size: 1.6rem; }
    .hero-banner p { font-size: 0.9rem; }
    .hero-banner .btn { font-size: 0.85rem; padding: 10px 20px; }
    .navbar-top .logo { font-size: 1.2rem; }
    .navbar-top .logo img { height: 30px; }
    .glass-card { padding: 16px; border-radius: 12px; }
    .plano-card { padding: 16px; border-radius: 12px; }
    .plano-card .plano-preco { font-size: 1.3rem; }
    .plano-card .plano-features li { font-size: 0.8rem; }
    .stat-card .numero { font-size: 1.5rem; }
    .stat-card { padding: 14px; }
    .produto-card .produto-img { height: 100px; }
    .produto-card .produto-preco { font-size: 1.2rem; }
    .contato-card { padding: 14px; }
    .footer { padding: 20px 0 12px; }
    .footer a { font-size: 0.8rem; }
    .bottom-nav .nav-item { font-size: 0.5rem; }
    .bottom-nav .nav-item i { font-size: 1rem; }
    .whatsapp-float { width: 48px; height: 48px; font-size: 1.5rem; bottom: 80px; right: 12px; }
    .section-title { font-size: 1.5rem !important; }
    .section-subtitle { font-size: 0.9rem !important; }
    .hero-badge { font-size: 0.65rem !important; padding: 4px 14px !important; }
    .btn-premium { padding: 8px 16px; font-size: 0.8rem; }
    .ranking-item { padding: 8px 12px; }
    .ranking-item .posicao { font-size: 0.9rem; width: 20px; }
    .ranking-item .nome { font-size: 0.8rem; }
}

@media (max-width: 480px) {
    body { font-size: 13px; padding-bottom: 65px; }
    .hero-banner { min-height: 160px; padding: 15px; }
    .hero-banner h1 { font-size: 1.3rem; }
    .hero-banner p { font-size: 0.8rem; }
    .hero-banner .btn { font-size: 0.75rem; padding: 8px 16px; }
    .navbar-top .logo { font-size: 1rem; }
    .navbar-top .logo img { height: 26px; }
    .nav-link-custom { font-size: 0.75rem !important; padding: 4px 10px !important; }
    .glass-card { padding: 12px; border-radius: 10px; }
    .plano-card { padding: 12px; border-radius: 10px; }
    .plano-card .plano-preco { font-size: 1.1rem; }
    .plano-card .plano-features li { font-size: 0.7rem; }
    .plano-card .plano-features li i { font-size: 0.8rem; }
    .stat-card .numero { font-size: 1.2rem; }
    .stat-card { padding: 10px; }
    .stat-card .label { font-size: 0.7rem; }
    .produto-card { padding: 12px; }
    .produto-card .produto-img { height: 80px; }
    .produto-card .produto-preco { font-size: 1rem; }
    .produto-card h4 { font-size: 0.9rem; }
    .contato-card { padding: 10px; }
    .contato-card .contato-icon { font-size: 1.8rem; }
    .contato-card h5 { font-size: 0.9rem; }
    .contato-card .text-secondary { font-size: 0.75rem; }
    .footer { padding: 16px 0 10px; }
    .footer a { font-size: 0.7rem; }
    .bottom-nav .nav-item { font-size: 0.45rem; }
    .bottom-nav .nav-item i { font-size: 0.9rem; }
    .whatsapp-float { width: 42px; height: 42px; font-size: 1.3rem; bottom: 70px; right: 10px; }
    .section-title { font-size: 1.2rem !important; }
    .section-subtitle { font-size: 0.8rem !important; }
    .hero-badge { font-size: 0.55rem !important; padding: 3px 10px !important; }
    .btn-premium { padding: 6px 12px; font-size: 0.7rem; }
    .ranking-item { padding: 6px 10px; }
    .ranking-item .posicao { font-size: 0.8rem; width: 18px; }
    .ranking-item .nome { font-size: 0.7rem; }
}