:root{
  --maxw: 1100px;
  --radius: 14px;
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --border: 1px solid rgba(0,0,0,.08);
  --muted: rgba(0,0,0,.65);
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Noto Sans",sans-serif;line-height:1.4}
a{color:inherit}
header{
  position:sticky;top:0;background:#fff;border-bottom:var(--border);z-index:10
}
.nav{
  max-width:var(--maxw);margin:0 auto;display:flex;gap:14px;align-items:center;
  padding:14px 16px;
}
.brand{font-weight:800}
.nav a{opacity:.9;text-decoration:none}
.nav a:hover{opacity:1}
.container{max-width:var(--maxw);margin:0 auto;padding:22px 16px}
.hero{
  display:grid;gap:12px;padding:18px;border:var(--border);border-radius:var(--radius);box-shadow:var(--shadow)
}
.hero h1{margin:0;font-size:28px}
.hero p{margin:0;color:var(--muted)}
.badge{display:inline-flex;gap:8px;align-items:center;font-size:13px;color:var(--muted)}
.grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px
}
@media (max-width: 900px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 600px){.grid{grid-template-columns:1fr}}
.card{
  border:var(--border);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:var(--shadow);
  display:flex;flex-direction:column;min-height:100%;
}
.card img{width:100%;height:190px;object-fit:cover;background:#f2f2f2}
.card .pad{padding:14px}
.kicker{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.card h3{margin:8px 0 10px;font-size:17px}
.list{margin:0;padding-left:18px;color:var(--muted)}
.small{font-size:13px;color:var(--muted)}
.btn{
  margin-top:12px;display:inline-block;padding:10px 12px;border-radius:12px;border:var(--border);
  text-decoration:none;font-weight:700
}
.btn:hover{transform:translateY(-1px)}
.footer{margin-top:28px;padding-top:18px;border-top:var(--border);color:var(--muted);font-size:13px}
.toolbar{
  margin-top:16px;display:flex;gap:10px;flex-wrap:wrap;align-items:center
}
input,select{
  padding:10px 12px;border-radius:12px;border:var(--border);min-width:220px
}
.notice{
  margin-top:12px;padding:12px;border-radius:12px;border:var(--border);background:rgba(0,0,0,.03);color:var(--muted)
}
