.hub-wrap {
max-width:1200px;
margin:0 auto;
padding:20px;
}
.hub-title {
font-size:34px;
margin-bottom:10px;
font-weight:700;
}
.hub-sub {
color:#666;
margin-bottom:25px;
}
.hub-search {position:relative; margin-bottom:35px;}
.hub-search input {
width:100%;
padding:14px 18px;
border-radius:8px;
border:1px solid #ccc;
font-size:17px;
}
#hub-search-results {
position:absolute;
top:52px;
left:0;
right:0;
background:#fff;
border:1px solid #ddd;
border-radius:10px;
display:none;
z-index:50;
}
#hub-search-results .item {
padding:10px 14px;
cursor:pointer;
}
#hub-search-results .item:hover {
background:#f5f5f5;
}
.hub-block-title {
font-size:24px;
font-weight:700;
margin:35px 0 20px;
} .hub-grid {
display:grid;
grid-template-columns:repeat(auto-fill, minmax(180px,1fr));
gap:18px;
}
.hub-card {
border:1px solid #ececec;
border-radius:10px;
overflow:hidden;
background:#fff;
transition:.2s;
}
.hub-card:hover {
transform:translateY(-3px);
box-shadow:0 3px 10px rgba(0,0,0,.1);
}
.hub-card img {
width:100%;
height:130px;
object-fit:cover;
}
.hub-card-body {
padding:10px 12px;
}
.hub-card-title {
font-size:16px;
font-weight:600;
margin-bottom:6px;
}
.hub-card-meta {
font-size:14px;
color:#777;
} .hub-mini-grid {
display:grid;
grid-template-columns:repeat(auto-fill, minmax(250px,1fr));
gap:15px;
}
.hub-mini {
padding:15px;
border-radius:10px;
background:#fafafa;
border:1px solid #eee;
} .hub-tags {
display:flex;
flex-wrap:wrap;
gap:10px;
}
.hub-tag {
background:#f1f1f1;
padding:6px 12px;
border-radius:20px;
font-size:14px;
}