/* ============================================================
   Guides hub - filters, list, value ladder
   (ported from article-site-hub-v3.html page-specific block)
   ============================================================ */
.oh-hub{max-width:728px;margin:0 auto;padding:0 24px}
.oh-hub-filters{padding:44px 0 4px}
.oh-controls{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px 20px;flex-wrap:wrap;margin:6px 0 18px;
}
.oh-controls .oh-counter{margin:0}
.oh-sort{
  display:inline-flex;align-items:center;background:var(--oh-surface);
  border:1px solid var(--oh-border);border-radius:var(--oh-pill);padding:3px;gap:2px;
}
.oh-sort-btn{
  border:0;background:transparent;font-family:var(--oh-font-body);
  font-size:15.5px;font-weight:600;color:var(--oh-ink-2);
  padding:6px 14px;border-radius:var(--oh-pill);cursor:pointer;
  transition:background .12s ease,color .12s ease;
}
.oh-sort-btn:hover{color:var(--oh-ink)}
.oh-sort-btn.is-active{background:var(--oh-ink);color:var(--oh-on-accent)}
.oh-hub-list{padding:0 0 8px}
.oh-empty{
  display:none;padding:52px 16px;text-align:center;
  border-bottom:1px solid var(--oh-border);
}
.oh-empty.is-visible{display:block}
.oh-empty-title{font-size:20.5px;font-weight:700;color:var(--oh-ink);margin:0 0 6px}
.oh-empty-copy{font-size:18px;color:var(--oh-ink-2);margin:0 0 14px}
.oh-textlink--btn{background:none;border:0;cursor:pointer;font-family:var(--oh-font-body);padding:0}
.oh-ladder{padding:72px 0 88px;display:flex;flex-direction:column;gap:20px}
.oh-dfy{
  background:var(--oh-surface);border:1px solid var(--oh-border);
  border-radius:var(--oh-radius-lg);padding:48px 32px;text-align:center;
}
.oh-dfy .oh-h2{margin-bottom:12px}
.oh-dfy-copy{
  font-size:20.5px;line-height:1.6;color:var(--oh-ink-2);
  max-width:560px;margin:0 auto 26px;
}
.oh-quiet{font-size:17px;line-height:1.6;color:var(--oh-ink-2);text-align:center;margin:6px 0 0}
.oh-quiet a{color:var(--oh-violet);font-weight:600}
.oh-quiet a:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:720px){
  .oh-hub-filters{padding:36px 0 4px}
  .oh-ladder{padding:56px 0 68px}
  .oh-dfy{padding:40px 22px}
}
