/* Search landing pages (public/site/seo/*.html). Not linked from the nav. */
.seo-body { max-width: 760px; margin-inline: auto; display: grid; gap: 20px; }
.seo-body h2 { font: 800 28px/1.15 var(--display); letter-spacing: -.02em; margin-top: 12px; }
.seo-body p { color: var(--slate-600); font-size: 17px; line-height: 1.6; }
.seo-steps { counter-reset: step; display: grid; gap: 16px; max-width: 760px; margin-inline: auto; }
.seo-steps li { counter-increment: step; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 16px; padding: 20px 24px; }
.seo-steps li::before { content: counter(step, decimal-leading-zero); font: 600 15px/1 var(--mono); color: var(--orange); padding-top: 4px; }
.seo-steps h3 { font: 800 19px/1.25 var(--display); letter-spacing: -.015em; }
.seo-steps p { color: var(--slate-600); margin-top: 6px; }
.seo-note { font-size: 14px; color: var(--slate-600); max-width: 760px; margin: 24px auto 0; text-align: center; }
.seo-links { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; max-width: 900px; margin-inline: auto; }
.seo-links a { padding: 10px 16px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-weight: 600; font-size: 15px; }
.seo-links a:hover { border-color: var(--orange); }
@media (max-width: 699px) {
  .seo-steps li { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 18px; }
  .seo-body h2 { font-size: 24px; }
}
/* Comparison pages */
.seo-table { max-width: 980px; margin-inline: auto; overflow-x: auto; background: #fff; border: 1px solid var(--line); border-radius: var(--r); }
.seo-table table { width: 100%; border-collapse: collapse; font-size: 15px; }
.seo-table th, .seo-table td { padding: 14px 18px; text-align: left; vertical-align: top; border-top: 1px solid var(--line); }
.seo-table thead th { border-top: 0; font: 800 16px/1.2 var(--display); background: var(--mist); }
.seo-table thead th:nth-child(2) { color: var(--orange); }
.seo-table tbody th { font-weight: 600; color: var(--navy); width: 30%; }
.seo-table td { color: var(--slate-600); }
.seo-chooses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; max-width: 980px; margin: 40px auto 0; }
.seo-choose { padding: 24px; display: grid; gap: 14px; align-content: start; }
.seo-choose h3 { font: 800 20px/1.2 var(--display); letter-spacing: -.02em; }
@media (max-width: 699px) {
  .seo-chooses { grid-template-columns: minmax(0, 1fr); }
  .seo-table th, .seo-table td { padding: 12px; font-size: 14px; }
}
