/* Shared navigation and comparison-table polish for Rank buyer guides. */
.nav {
  box-sizing: border-box;
  width: min(100%, 860px);
  margin: 0 auto;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #293244;
}
.nav > div {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}
.nav a { text-decoration: none; }
.nav .brand { color: #f3f4f6; font-weight: 850; margin-right: auto; }
.guide-page img { display: block; max-width: 100%; height: auto; }
.comparison-table-wrap {
  overflow-x: auto;
  margin: 18px 0 28px;
  border: 1px solid #293244;
  border-radius: 14px;
  background: #111827;
  -webkit-overflow-scrolling: touch;
}
.comparison-table { width: 100%; min-width: 640px; border-collapse: collapse; line-height: 1.55; }
.comparison-table th, .comparison-table td {
  padding: 14px 16px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid #293244;
}
.comparison-table th { color: #f3f4f6; background: #171f2d; font-size: .92rem; }
.comparison-table td { color: #b7c0d1; }
.comparison-table tr:last-child td { border-bottom: 0; }
.related.wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 18px;
  row-gap: 12px;
  border-top: 1px solid #293244;
}
.related.wrap strong { flex-basis: 100%; }
.related.wrap a { line-height: 1.45; }
@media (max-width: 480px) {
  .nav { padding-inline: 16px; }
  .nav > div { gap: 14px; }
}