.cpi-hero{position:relative;padding:64px 0 52px;overflow:hidden;text-align:center;background:radial-gradient(ellipse 80% 60% at 50% -10%,rgba(139,92,246,.22) 0%,transparent 70%);border-bottom:1px solid var(--glass-border);margin-bottom:52px}.cpi-hero:before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%238b5cf6' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");pointer-events:none}.cpi-hero-eyebrow{display:inline-block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.8px;color:var(--accent);background:var(--accent-dim);border-radius:20px;padding:4px 14px;margin-bottom:18px}.cpi-hero h1{font-size:clamp(26px,4vw,42px);font-weight:900;color:#fff;margin:0 auto 12px;line-height:1.15;letter-spacing:-.5px}.cpi-hero h1 span{color:var(--accent)}.cpi-hero-sub{font-size:15px;color:#fff6;margin:0 auto 36px;max-width:420px}.cpi-stats{display:flex;align-items:center;justify-content:center;gap:36px;flex-wrap:wrap}.cpi-stat{display:flex;flex-direction:column;align-items:center;gap:2px}.cpi-stat strong{font-size:26px;font-weight:900;color:#fff}.cpi-stat span{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#ffffff4d}.cpi-divider{width:1px;height:32px;background:#ffffff14}@media(max-width:480px){.cpi-divider{display:none}}.cpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}@media(max-width:600px){.cpi-grid{grid-template-columns:repeat(2,1fr)}}.cpi-card{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:16/9;text-decoration:none;display:block;border:1px solid var(--glass-border);transition:transform .18s,box-shadow .18s,border-color .18s;background:var(--surface)}.cpi-card:hover{transform:translateY(-3px);box-shadow:0 8px 32px #00000073;border-color:#8b5cf680}.cpi-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}.cpi-card:hover img{transform:scale(1.04)}.cpi-card-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.82) 0%,rgba(0,0,0,.1) 55%,transparent 100%)}.cpi-card-body{position:absolute;bottom:0;left:0;right:0;padding:10px 12px 11px}.cpi-card-title{font-size:13px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cpi-card-count{font-size:10px;color:#ffffff73;margin-top:2px}.cpi-card-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#6138a34d,#1e1432cc);font-size:22px;font-weight:900;color:#8b5cf680}.cpi-body{padding-bottom:80px}.cpi-genre{margin-bottom:52px}.cpi-genre-header{margin-bottom:18px}.cpi-genre-header h2{font-size:17px;font-weight:700;color:#fff;margin:0 0 4px;display:flex;align-items:center;gap:10px}.cpi-genre-header h2:before{content:"";display:block;width:3px;height:18px;background:var(--accent);border-radius:2px;flex-shrink:0}.cpi-genre-header p{font-size:13px;color:#ffffff59;margin:0 0 0 13px}.cpi-separator{height:1px;background:var(--glass-border);margin-bottom:52px}