* { margin:0; padding:0; box-sizing:border-box; }

body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; background:#0d0b1a; color:#fff; overflow-x:hidden; min-height:100vh; }

.bg-grid { position:fixed; top:0; left:0; width:100%; height:100%; background-image:linear-gradient(rgba(118,75,162,0.13) 1px,transparent 1px),linear-gradient(90deg,rgba(118,75,162,0.13) 1px,transparent 1px); background-size:52px 52px; z-index:-3; }
.grid-lines { position:fixed; top:0; left:0; width:100%; height:100%; background-image:linear-gradient(rgba(150,90,220,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(150,90,220,0.04) 1px,transparent 1px); background-size:26px 26px; animation:gridMove 18s linear infinite; z-index:-2; }
.grid-lines::after { content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:radial-gradient(circle at 20% 50%,rgba(118,75,162,0.08) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(102,63,200,0.06) 0%,transparent 50%); }
@keyframes gridMove { 0%{transform:translateY(0)} 100%{transform:translateY(26px)} }
.bg-glow { position:fixed; border-radius:50%; filter:blur(120px); pointer-events:none; z-index:0; }
.bg-glow-1 { width:600px; height:600px; top:-200px; left:-200px; background:rgba(118,75,162,0.18); animation:glowPulse 10s ease-in-out infinite; }
.bg-glow-2 { width:500px; height:500px; bottom:-150px; right:-150px; background:rgba(102,63,200,0.14); animation:glowPulse 13s ease-in-out 4s infinite; }
.bg-glow-3 { width:300px; height:300px; top:40%; left:50%; transform:translate(-50%,-50%); background:rgba(150,90,220,0.07); animation:glowPulse 8s ease-in-out 2s infinite; }
@keyframes glowPulse { 0%,100%{opacity:.5;transform:scale(1)} 50%{opacity:1;transform:scale(1.1)} }
.bg-sweep { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.bg-sweep::before { content:''; position:absolute; top:0; bottom:0; left:-20%; width:2px; background:linear-gradient(180deg,transparent 0%,rgba(180,130,255,0) 15%,rgba(180,130,255,0.35) 40%,rgba(200,160,255,0.5) 50%,rgba(180,130,255,0.35) 60%,rgba(180,130,255,0) 85%,transparent 100%); filter:blur(3px); animation:lineSweep 7s ease-in-out infinite; }
@keyframes lineSweep { 0%{left:-5%;opacity:0} 5%{opacity:1} 95%{opacity:1} 100%{left:105%;opacity:0} }
.star { position:fixed; width:2px; height:2px; background:#fff; border-radius:50%; animation:twinkle 3s infinite; z-index:-1; }
@keyframes twinkle { 0%,100%{opacity:0.1} 50%{opacity:0.4} }

header { position:fixed; top:0; width:100%; padding:0 50px; height:70px; display:flex; justify-content:space-between; align-items:center; z-index:1000; backdrop-filter:blur(10px); background:rgba(144,0,255,0.1); border-bottom:1px solid rgba(255,255,255,0.1); }
.logo { font-size:24px; font-weight:700; color:#fff; letter-spacing:1px; }
nav { display:flex; gap:40px; align-items:center; height:100%; }
nav a { color:#fff; text-decoration:none; font-weight:500; transition:all .3s; padding:8px 16px; border-radius:8px; display:flex; align-items:center; }
nav a:hover { background:rgba(255,255,255,0.1); }
nav a.btn-home { background:transparent; border:3px solid #fff; color:#fff; padding:0 35px; border-radius:12px; font-weight:700; font-size:16px; letter-spacing:1px; height:70px; margin-right:-50px; }
nav a.btn-home:hover { background:rgba(255,255,255,0.1); box-shadow:0 0 20px rgba(255,255,255,0.3); }

main { padding-top:100px; padding-bottom:60px; max-width:1400px; margin:0 auto; padding-left:50px; padding-right:50px; }

.search-section { margin-bottom:32px; }
.page-title { font-size:48px; font-weight:900; margin-bottom:24px; color:#fff; }

.search-container { display:flex; align-items:center; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.search-box { flex:1; min-width:180px; display:flex; align-items:center; background:rgba(255,255,255,0.05); border:2px solid rgba(255,255,255,0.2); border-radius:12px; padding:12px 16px; transition:all .3s; }
.search-box:focus-within { border-color:#fff; background:rgba(255,255,255,0.08); }
.search-icon { width:20px; height:20px; margin-right:10px; color:rgba(255,255,255,0.5); flex-shrink:0; }
#searchInput { flex:1; background:none; border:none; outline:none; color:#fff; font-size:14px; font-weight:500; min-width:0; }
#searchInput::placeholder { color:rgba(255,255,255,0.35); }

.filter-select { appearance:none; -webkit-appearance:none; background:rgba(255,255,255,0.06); border:1.5px solid rgba(255,255,255,0.2); color:#fff; font-size:13px; font-weight:600; padding:11px 34px 11px 14px; border-radius:10px; cursor:pointer; outline:none; transition:all .2s; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'%3E%3Cpath fill='%23ffffff' d='M0 0l5 7 5-7z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 11px center; }
.filter-select:hover { border-color:rgba(255,255,255,0.45); background-color:rgba(255,255,255,0.09); }
.filter-select option { background:#1a1228; color:#fff; }

.filters-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; }

.filter-chip { padding:8px 14px; border-radius:20px; border:1.5px solid rgba(255,255,255,0.15); background:rgba(255,255,255,0.04); color:rgba(255,255,255,0.6); font-size:12px; font-weight:600; cursor:pointer; transition:all .2s; white-space:nowrap; }
.filter-chip:hover { border-color:rgba(255,255,255,0.4); color:#fff; }
.filter-chip.active { background:rgba(255,255,255,0.14); border-color:rgba(255,255,255,0.6); color:#fff; box-shadow:0 0 10px rgba(255,255,255,0.08); }

.btn-reset { padding:8px 14px; border-radius:20px; border:1.5px solid rgba(255,80,80,0.4); background:rgba(255,60,60,0.07); color:rgba(255,120,120,0.9); font-size:12px; font-weight:600; cursor:pointer; transition:all .2s; white-space:nowrap; }
.btn-reset:hover { background:rgba(255,60,60,0.15); border-color:rgba(255,80,80,0.7); color:#ff8080; }

.search-result { font-size:13px; color:rgba(255,255,255,0.4); font-weight:600; letter-spacing:.5px; margin-top:6px; }

.programs-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:22px; }

.program-card { position:relative; background:rgba(255,255,255,0.04); backdrop-filter:blur(12px); border:1.5px solid rgba(255,255,255,0.10); border-radius:18px; overflow:hidden; transition:all .3s; display:flex; flex-direction:column; }
.program-card:hover { transform:translateY(-5px); background:rgba(255,255,255,0.07); border-color:rgba(255,255,255,0.28); box-shadow:0 14px 44px rgba(0,0,0,0.45),0 0 0 1px rgba(255,255,255,0.04); }

.card-accent { height:3px; width:100%; background:linear-gradient(90deg,rgba(118,75,162,0.9),rgba(102,63,200,0.3)); }
.program-card.fixado-card .card-accent { background:linear-gradient(90deg,rgba(255,255,255,0.9),rgba(255,255,255,0.2)); }
.program-card.novo-card .card-accent { background:linear-gradient(90deg,#00e676,rgba(0,230,118,0.2)); }

.card-body { padding:20px 20px 14px; flex:1; display:flex; flex-direction:column; gap:12px; }

.card-header { display:flex; align-items:center; gap:11px; }
.owner-avatar { width:36px; height:36px; border-radius:50%; border:1.5px solid rgba(255,255,255,0.2); background:rgba(255,255,255,0.07); object-fit:cover; flex-shrink:0; }
.card-header-info { flex:1; min-width:0; }
.owner-label { font-size:10px; font-weight:700; color:rgba(255,255,255,0.4); letter-spacing:1px; text-transform:uppercase; }
.program-name { font-size:16px; font-weight:800; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }

.card-badges { display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.badge { display:inline-flex; align-items:center; gap:3px; padding:3px 9px; border-radius:20px; font-size:10px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; }
.badge-type { background:rgba(102,63,200,0.22); border:1px solid rgba(120,80,220,0.35); color:rgba(190,160,255,0.9); }
.badge-fixado { background:rgba(255,255,255,0.10); border:1px solid rgba(255,255,255,0.25); color:#fff; }
.badge-novo { background:rgba(0,230,118,0.12); border:1px solid rgba(0,230,118,0.35); color:#00e676; }

.program-description { font-size:13px; color:rgba(255,255,255,0.6); line-height:1.65; flex:1; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

.card-footer { padding:12px 20px; border-top:1px solid rgba(255,255,255,0.06); display:flex; gap:9px; }
.btn { flex:1; padding:10px 12px; border:1.5px solid rgba(255,255,255,0.22); background:transparent; color:rgba(255,255,255,0.82); font-weight:700; font-size:12px; border-radius:9px; cursor:pointer; transition:all .25s; text-transform:uppercase; letter-spacing:.5px; }
.btn:hover { background:rgba(255,255,255,0.1); border-color:rgba(255,255,255,0.5); color:#fff; }
.btn-abrir { background:rgba(255,255,255,0.07); }
.btn-abrir:hover { background:rgba(255,255,255,0.16); }

.no-results { grid-column:1/-1; text-align:center; padding:60px 20px; color:rgba(255,255,255,0.25); font-size:15px; }

@media (max-width:768px) {
    header { padding:0 20px; }
    nav a.btn-home { height:60px; padding:0 20px; margin-right:-20px; }
    main { padding-left:16px; padding-right:16px; padding-top:86px; }
    .page-title { font-size:30px; margin-bottom:16px; }
    .programs-grid { grid-template-columns:1fr; gap:14px; }
    .search-container { gap:7px; }
}