.hp-archive{font-family:'Inter',system-ui,sans-serif;color:#0f172a}
.hp-archive *{box-sizing:border-box}
.hp-archive h1,.hp-archive h2{font-family:'Plus Jakarta Sans',sans-serif;margin:0}
.hp-a-wrap{max-width:1240px;margin:0 auto;padding:0 20px}
.hp-a-hero{background:#0a1424;color:#fff;padding:64px 20px;text-align:center;border-radius:14px;margin-top:24px}
.hp-a-hero h1{font-size:40px;font-weight:800;letter-spacing:-.02em;margin:0 0 10px}
.hp-a-hero p{margin:0;opacity:.7;font-size:15px}
.hp-a-count{color:#64748b;font-size:14px;margin:24px 0 20px}
.hp-a-grid{display:grid;gap:20px;grid-template-columns:1fr;margin-bottom:60px}
@media(min-width:640px){.hp-a-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.hp-a-grid{grid-template-columns:repeat(3,1fr)}}
.hp-a-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px;box-shadow:0 1px 2px rgba(0,0,0,.04);transition:all .2s}
.hp-a-card:hover{box-shadow:0 8px 24px rgba(0,0,0,.08);border-color:#F5C400;transform:translateY(-2px)}
.hp-a-card h3{font-size:16px;font-weight:700;margin:0 0 4px}
.hp-a-card .sub{font-size:12px;font-weight:700;color:#F5C400;margin:0 0 10px}
.hp-a-card .desc{font-size:14px;color:#64748b;line-height:1.55;margin:0 0 14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.hp-a-card .foot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #f1f5f9;padding-top:14px}
.hp-a-card .rating{color:#facc15;font-size:14px;letter-spacing:1px}
.hp-a-card .rating span{color:#64748b;font-size:12px;margin-left:4px;letter-spacing:0}
.hp-a-card .vbtn{background:#0f172a;color:#fff;font-size:12px;font-weight:700;padding:7px 14px;border-radius:6px;text-decoration:none;transition:background-color .2s}
.hp-a-card .vbtn:hover{background:#F5C400;color:#0f172a}
.hp-a-empty{border:2px dashed #e5e7eb;border-radius:12px;padding:48px;text-align:center;color:#64748b;font-size:14px;background:#f8fafc}