/* Fotografias 4K dos gêneros */
.genre-card{isolation:isolate;background:#111826;box-shadow:0 22px 55px rgba(0,0,0,.34);transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.genre-card::before{content:"";position:absolute;z-index:-2;inset:0;background-image:var(--genre-image);background-position:center;background-size:cover;transform:scale(1.01);transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .5s ease;filter:saturate(.92) brightness(.88)}
.genre-card::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,rgba(5,9,16,.08) 0%,rgba(5,9,16,.16) 38%,rgba(5,9,16,.94) 88%),linear-gradient(90deg,rgba(5,9,16,.2),transparent 55%);pointer-events:none}
.genre-card>span,.genre-card>div{position:relative;z-index:1}
.genre-card>.genre-brand{align-self:flex-start;width:90px;height:51px;padding:0;display:block;border:0;background:url('images/marca-pendrive-onda-jovem-correta-v4.png') center/contain no-repeat;filter:drop-shadow(0 4px 7px rgba(0,0,0,.72));overflow:hidden;font-size:0;color:transparent}
.genre-brand b,.genre-brand small{display:none}
.genre-card>img.genre-brand{align-self:flex-start;width:90px;height:51px;display:block;object-fit:contain;border-radius:0;box-shadow:none;filter:drop-shadow(0 4px 7px rgba(0,0,0,.72))}
.genre-card>div{margin:auto -24px -24px;padding:7px 8px 8px;border-top:1px solid rgba(244,216,137,.7);background:linear-gradient(180deg,rgba(3,7,13,.88),#02050a 58%);box-shadow:0 -14px 34px rgba(0,0,0,.65);text-align:center;text-shadow:0 3px 16px #000}
.genre-card>div>small{display:block;margin-bottom:5px;color:var(--gold2);font-family:Inter,Arial,sans-serif;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.genre-card h3{margin:0;padding:8px 8px;border:2px solid var(--gold);border-radius:2px;background:#030303;color:#fff;font-family:Inter,Arial,sans-serif;font-size:31px;font-weight:900;line-height:1;text-transform:uppercase;letter-spacing:-.05em;box-shadow:inset 0 0 18px rgba(251,191,36,.08),0 0 0 1px rgba(0,0,0,.8)}
.genre-playlist-btn{min-height:54px;margin-top:7px;padding:0 12px;display:flex;align-items:center;justify-content:center;border:1px solid #22d3ee;border-radius:5px;background:linear-gradient(135deg,#22e8f0,#18cfe8);color:#062033;font-family:Inter,Arial,sans-serif;font-size:13px;font-weight:900;letter-spacing:.03em;text-decoration:none;text-shadow:none;text-transform:uppercase;transition:.25s}
.genre-playlist-btn:hover,.genre-playlist-btn:focus-visible{background:#67f5f7;box-shadow:0 0 24px rgba(34,211,238,.38);outline:none}
.genre-card:hover,.genre-card:focus-within{transform:translateY(-8px);border-color:rgba(244,216,137,.6);box-shadow:0 30px 70px rgba(0,0,0,.5)}
.genre-card:hover::before,.genre-card:focus-within::before{transform:scale(1.09);filter:saturate(1.08) brightness(.98)}
@media(max-width:600px){.genre-card{height:410px}.genre-card>div{margin:auto -24px -24px;padding:7px}.genre-card h3{font-size:27px}.genre-playlist-btn{min-height:50px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.genre-card,.genre-card::before{transition:none!important;transform:none!important}}