.hub-page { min-width: 0; }

.hub-header {
  padding: 14px 16px 12px;
  background: #fff;
  border: 1px solid var(--line);
}
.hub-header h1 { margin: 0 0 7px; color: #1b2227; font-size: 25px; line-height: 1.12; letter-spacing: -.25px; }
.hub-header p { margin: 0 0 7px; font-size: 13px; line-height: 1.45; }
.hub-header time { color: #65727a; font-size: 10.5px; }
.hub-meta { margin-top: 9px; padding-top: 7px; display: flex; justify-content: space-between; gap: 8px 18px; color: #65727a; border-top: 1px solid #d0d7db; font-size: 10.5px; }

.hub-section { margin-top: 9px; background: #fff; border: 1px solid var(--line); }
.section-title { padding: 7px 9px; background: var(--head); border-bottom: 1px solid var(--line); }
.section-title h2 { margin: 0; color: #20292f; font-size: 16px; line-height: 1.15; }

.subtopic-list { display: grid; grid-template-columns: repeat(3, 1fr); }
.subtopic-list.two-items { grid-template-columns: repeat(2, 1fr); }
.subtopic-list article { min-width: 0; padding: 11px; border-right: 1px solid var(--line-soft); }
.subtopic-list article:last-child { border-right: 0; }
.subtopic-list h3 { margin: 0 0 5px; font-size: 13px; line-height: 1.25; }
.subtopic-list p { margin: 0 0 8px; font-size: 11px; line-height: 1.35; }
.subtopic-list .more { font-size: 10.5px; font-weight: 700; }

.content-row { min-height: 83px; padding: 7px 9px; display: grid; grid-template-columns: 104px minmax(0, 1fr); align-items: center; gap: 10px; border-bottom: 1px solid var(--line-soft); }
.content-row:last-child { border-bottom: 0; }
.content-row img { width: 104px; height: 62px; object-fit: cover; border: 1px solid #b8c3ca; }
.content-row h3 { margin: 0 0 3px; font-size: 12.5px; line-height: 1.25; }
.content-row p { margin: 0 0 3px; font-size: 10.5px; line-height: 1.32; }
.content-row small { color: #68757d; font-size: 9.5px; }

.question-list { margin: 0; padding: 5px 10px 7px 27px; columns: 2; column-gap: 28px; }
.question-list li { padding: 4px 0; break-inside: avoid; border-bottom: 1px dotted #c8d0d5; font-size: 11px; }

.cluster-links { display: grid; grid-template-columns: 1fr 1fr; }
.cluster-links article { min-width: 0; padding: 9px 11px; border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.cluster-links article:nth-child(even) { border-right: 0; }
.cluster-links article:nth-last-child(-n + 2) { border-bottom: 0; }
.cluster-links h3 { margin: 0 0 3px; font-size: 12px; line-height: 1.25; }
.cluster-links p { margin: 0; font-size: 10.5px; line-height: 1.35; }

.affiliate-note { margin-top: 9px; padding: 8px 10px; background: #f3f0e3; border: 1px solid #c8bea0; font-size: 10.5px; line-height: 1.4; }
.criteria-list { margin: 0; }
.criteria-list div { padding: 9px 11px; border-bottom: 1px solid var(--line-soft); }
.criteria-list div:last-child { border-bottom: 0; }
.criteria-list dt { color: #263842; font-size: 12px; font-weight: 700; }
.criteria-list dd { margin: 2px 0 0; font-size: 10.75px; line-height: 1.4; }
.comparison-steps { margin: 0; padding: 7px 12px 9px 34px; }
.comparison-steps li { padding: 4px 0; font-size: 11px; line-height: 1.4; }

.search-page { grid-column: 1 / 4; max-width: 850px; width: 100%; margin: 0 auto; }
.page-search { margin-top: 9px; padding: 12px; background: #fff; border: 1px solid var(--line); }
.page-search label { display: block; margin-bottom: 4px; font-size: 11px; font-weight: 700; }
.page-search div { display: flex; height: 34px; }
.page-search input { min-width: 0; flex: 1; padding: 0 9px; border: 1px solid var(--line); }
.page-search button { padding: 0 18px; background: var(--head); border: 1px solid #9faab1; border-left: 0; font-weight: 700; }
.empty-search { margin: 0; padding: 14px; font-size: 11px; }
.not-found { min-height: 430px; padding: 80px 20px; text-align: center; }
.not-found h1 { margin: 0 0 12px; color: var(--ink); font-size: 28px; }

@media (max-width: 800px) {
  .subtopic-list { grid-template-columns: 1fr; }
  .subtopic-list article { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .subtopic-list article:last-child { border-bottom: 0; }
  .question-list { columns: 1; }
  .search-page { grid-column: 1 / 3; }
}

@media (max-width: 560px) {
  .hub-header { padding: 12px; }
  .hub-header h1 { font-size: 23px; }
  .subtopic-list.two-items { grid-template-columns: 1fr; }
  .content-row { grid-template-columns: 78px minmax(0, 1fr); gap: 8px; }
  .content-row img { width: 78px; height: 52px; }
  .search-page { width: 100%; }
  .hub-meta { flex-direction: column; }
  .cluster-links { grid-template-columns: 1fr; }
  .cluster-links article,
  .cluster-links article:nth-child(even),
  .cluster-links article:nth-last-child(-n + 2) { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .cluster-links article:last-child { border-bottom: 0; }
}
