*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background-color:#0d0d0d;color:#e8e8e8;font-family:"Inter",-apple-system,BlinkMacSystemFont,sans-serif;min-height:100vh;display:flex;align-items:center;justify-content:center}main{padding:64px 32px;max-width:1600px;width:100%;margin:0 auto}header{text-align:center;margin-bottom:56px}header h1{font-size:.85rem;font-weight:300;letter-spacing:.25em;text-transform:uppercase;color:#666}.grid{display:flex;flex-wrap:wrap;gap:28px;justify-content:center;align-items:flex-start}.card{display:block;text-decoration:none;color:inherit;width:240px;border-radius:10px;overflow:hidden;background:#161616;border:1px solid hsla(0,0%,100%,.07);box-shadow:0 4px 24px rgba(0,0,0,.5);transition:transform .25s ease,box-shadow .25s ease,background .25s ease}.card:hover{transform:translateY(-8px);background:#1c1c1c;box-shadow:0 16px 48px rgba(0,0,0,.7)}.card .card-preview{width:240px;height:300px;overflow:hidden;background:#0a0a0a}.card .card-preview img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform .4s ease}.card:hover .card-preview img{transform:scale(1.03)}.card .card-footer{height:64px;padding:0 18px;display:flex;flex-direction:column;justify-content:center;gap:3px;border-top:1px solid hsla(0,0%,100%,.07)}.card .card-footer .card-name{font-size:.8rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:#e8e8e8;transition:color .25s ease}.card .card-footer .card-desc{font-size:.7rem;font-weight:300;color:#666;letter-spacing:.04em}.card:hover .card-footer .card-name{color:#c9a961}@media(max-width: 1320px){.grid{gap:22px}}@media(max-width: 768px){main{padding:48px 20px}.card{width:200px}.card .card-preview{width:200px;height:333px}}@media(max-width: 520px){.grid{gap:16px}.card{width:160px}.card .card-preview{width:160px;height:267px}}