@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500;700;800;900&display=swap');
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;color:#fff;background:#030406;min-height:100vh}
body:before{content:"";position:fixed;inset:0;z-index:-1;background:
radial-gradient(circle at 0% 20%,rgba(0,255,100,.28),transparent 35%),
radial-gradient(circle at 100% 25%,rgba(255,0,100,.22),transparent 35%),
radial-gradient(circle at 50% 0%,rgba(255,130,0,.12),transparent 30%),
#030406}
.page{width:min(980px,100%);margin:auto;padding:28px 16px 36px}
header{text-align:center;margin-bottom:22px}
.logo{width:70px;height:70px;border-radius:22px;background:#1ed760;color:#001608;display:grid;place-items:center;margin:0 auto 14px;font-size:24px;font-weight:900;box-shadow:0 0 50px rgba(30,215,96,.35)}
h1{font-size:clamp(42px,7vw,68px);line-height:.9;margin:0;font-weight:900;letter-spacing:-.06em}
h1 span{color:#1ed760}
header p{font-size:clamp(16px,2vw,22px);color:#ddd;margin:12px 0 0}
.cards{display:grid;gap:18px}
a{text-decoration:none;color:inherit}
.card{display:grid;grid-template-columns:220px 1fr auto;gap:26px;align-items:center;padding:18px 22px;border-radius:26px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);box-shadow:0 24px 80px rgba(0,0,0,.45);position:relative;overflow:hidden;transition:.22s}
.card:before{content:"";position:absolute;inset:0;z-index:0;opacity:.62}
.card:after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(0,0,0,.08),rgba(0,0,0,.70))}
.card>*{position:relative;z-index:1}
.card:hover{transform:translateY(-5px);border-color:#1ed760}
.sertanejo{border-color:rgba(255,90,0,.55)}.sertanejo:before{background:linear-gradient(135deg,#ff5a00,transparent 60%)}
.forro{border-color:rgba(255,205,0,.55)}.forro:before{background:linear-gradient(135deg,#ffb000,transparent 60%)}
.tiktok{border-color:rgba(255,0,120,.55)}.tiktok:before{background:linear-gradient(135deg,#ff006e,transparent 60%)}
.card img{width:220px;height:150px;object-fit:cover;border-radius:16px;border:1px solid rgba(255,255,255,.18);box-shadow:0 18px 45px rgba(0,0,0,.45)}
.tag{display:inline-block;font-weight:900;font-size:13px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.09);margin-bottom:12px}
h2{font-size:clamp(30px,4vw,46px);margin:0 0 8px;line-height:1;letter-spacing:-.05em}
.info p{font-size:18px;color:#eee;margin:0 0 15px}
small{display:block;font-size:17px;color:#eee;margin-bottom:14px}
.btn{display:inline-block;background:#1ed760;color:#001608;font-size:16px;font-weight:900;padding:15px 22px;border-radius:999px;box-shadow:0 0 35px rgba(30,215,96,.40)}
@media(max-width:760px){
.page{padding:22px 14px 30px}
.card{grid-template-columns:92px 1fr;gap:14px;padding:14px;border-radius:24px}
.card:after{background:linear-gradient(90deg,rgba(0,0,0,.1),rgba(0,0,0,.75))}
.card img{width:92px;height:92px;border-radius:18px}
.tag{font-size:11px;padding:6px 9px;margin-bottom:7px}
h2{font-size:25px;margin-bottom:5px}
.info p{font-size:14px;margin-bottom:8px}
small{font-size:13px;margin-bottom:10px}
.btn{font-size:13px;padding:11px 13px}
}