/* The full comparison uses the same illustration language as the homepage. */
.compare-page .comparison-modern { color: #1d1d1f; }
.compare-page .comparison-modern .compare-hero {
  padding-top: calc(var(--hero-clearance, 6rem) + 3.5rem);
  padding-bottom: clamp(3.5rem, 6vw, 5.5rem);
}
.compare-page .comparison-modern .compare-hero h1 {
  max-width: 64rem;
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  line-height: 1.08;
  letter-spacing: -.025em;
}
.compare-page .comparison-modern .compare-lead {
  max-width: 48rem;
  margin: 2rem auto 0;
  color: #1d1d1f;
  font-size: clamp(1.1875rem, 2vw, 1.5rem);
  line-height: 1.4;
}
.compare-page .comparison-modern .article-intro-text {
  display: block;
  max-width: 49rem;
  margin: 1.5rem auto 0;
  color: #6e6e73;
  font: 400 1.0625rem/1.55 var(--font);
  text-align: center;
}
.compare-page .comparison-modern .article-intro-text p + p { margin-top: 1rem; }
.article-jump {
  display: flex;
  justify-content: center;
  gap: .5rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}
.article-jump a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: .625rem 1.125rem;
  border: 0;
  border-radius: 999px;
  background: #f5f5f7;
  color: #1d1d1f;
  font: 500 .9375rem/1.4 var(--font);
  text-decoration: none;
  transition: background-color 160ms ease;
}
.article-jump a:hover { background: #e8e8ed; }
.article-jump a:focus-visible {
  outline: 2px solid #1d1d1f;
  outline-offset: 4px;
}
.article-process-tabs button:focus-visible {
  outline: 2px solid #1d1d1f;
  outline-offset: -3px;
}
.article-comparison-container {
  width: min(var(--ui-width, 1200px), calc(100% - var(--ui-gutter, 2rem) * 2));
  margin-inline: auto;
}
.article-section-heading { margin-bottom: 2.5rem; text-align: center; }
.comparison-modern .article-section-heading h2 {
  margin: 0;
  color: #1d1d1f;
  font: 600 clamp(2rem, 3.5vw, 3rem)/1.1 var(--heading);
  letter-spacing: -.018em;
  text-transform: none;
  text-wrap: balance;
}
.article-process,
.article-results,
.article-cost { padding-block: clamp(3.5rem, 6vw, 5.5rem); }
.article-process { background: #f5f5f7; }
.article-process-tabs {
  position: relative;
  display: flex;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 2rem;
  padding: .375rem;
  gap: .25rem;
  border-radius: 999px;
  background: #e8e8ed;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.article-process-tabs::-webkit-scrollbar { display: none; }
.article-process-tabs button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 44px;
  padding: .6875rem 1.125rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #1d1d1f;
  font: 500 .9375rem/1.3 var(--font);
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 180ms ease, box-shadow 180ms ease;
}
.article-process-tabs button:hover { background: #ffffff80; }
.article-process-tabs button[aria-selected="true"] {
  background: #fff;
  box-shadow: 0 1px 4px #00000009;
}
.article-comparison-panel { scroll-margin-top: calc(var(--header-clearance, 6rem) + 1rem); }
.article-comparison-panel[hidden] { display: none !important; }
.article-process:not(.is-enhanced) .article-comparison-panel + .article-comparison-panel { margin-top: 3.5rem; }
.article-topic-fallback { margin: 0 0 1.5rem; font-size: 1.5rem; }
.article-process.is-enhanced .article-topic-fallback { display: none; }
.article-comparison-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 1.5rem;
}
.article-comparison-column { min-width: 0; }
.comparison-modern .article-comparison-label {
  margin: 0 0 1rem;
  padding-inline: .375rem;
  color: #1d1d1f;
  font: 600 1.125rem/1.4 var(--font);
  letter-spacing: -.01em;
  text-transform: none;
  text-align: left;
}
.article-comparison-label::before,
.article-comparison-label::after { content: none; }
.article-comparison-card {
  padding: 1.75rem clamp(1.5rem, 3vw, 2.5rem) 2.5rem;
  border: 0;
  border-radius: 28px;
  background: #fff;
  min-width: 0;
}
.article-comparison-art {
  display: grid;
  place-items: center;
  width: min(100%, 270px);
  height: 160px;
  margin: 0 auto 1.75rem;
}
.article-comparison-art svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.comparison-modern .article-comparison-lead {
  margin: 0 0 1.125rem;
  color: #1d1d1f;
  font: 600 clamp(1.375rem, 2.1vw, 1.75rem)/1.16 var(--heading);
  letter-spacing: -.015em;
  text-wrap: pretty;
}
.article-comparison-prose {
  color: #6e6e73;
  font: 400 1.0625rem/1.55 var(--font);
  letter-spacing: 0;
}
.article-comparison-prose p + p { margin-top: 1.125rem; }
.article-comparison-prose strong { color: #1d1d1f; font-weight: 600; }
.article-results { background: #f5f5f7; padding-top: 0; }
.article-results .article-section-heading { padding-top: 1rem; }
.article-results .article-comparison-prose strong { color: #6e6e73; font-weight: 400; }
.article-brand-question { padding-block: clamp(4rem, 7vw, 6.5rem); text-align: center; }
.article-brand-question p {
  max-width: 50rem;
  margin-inline: auto;
  color: #1d1d1f;
  font: 600 clamp(1.75rem, 3.2vw, 2.5rem)/1.18 var(--heading);
  letter-spacing: -.015em;
  text-wrap: balance;
}
.article-brand-question strong { font-weight: inherit; }
.article-cost { padding-top: 0; background: #fff; }
.article-cost .article-section-heading { text-align: left; }
.article-cost-grid {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}
.article-cost-copy,
.article-cost-professional-copy { color: #6e6e73; font: 400 1.125rem/1.5 var(--font); }
.article-cost-takeaway { margin-top: 1.5rem; color: #1d1d1f; }
.article-cost-takeaway strong { font-weight: 600; }
.article-cost-breakdown {
  padding: 1.5rem 2rem 2rem;
  background: #f5f5f7;
  border-radius: 28px;
}
.article-cost-breakdown .article-comparison-art { height: 130px; margin-bottom: 1rem; }
.comparison-modern .article-cost-breakdown h3 {
  margin: 0 0 1.5rem;
  font: 600 1.375rem/1.2 var(--heading);
  color: #1d1d1f;
  letter-spacing: -.01em;
}
.article-cost-breakdown ul { display: grid; gap: 1rem; list-style: none; margin: 0; padding: 0; }
.article-cost-breakdown li { display: flex; align-items: center; gap: .875rem; font: 500 1rem/1.4 var(--font); color: #1d1d1f; }
.article-cost-breakdown li > span { color: #6e6e73; font-size: .8125rem; font-variant-numeric: tabular-nums; }
.article-cost-professional {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
  margin-top: clamp(3.5rem, 6vw, 5.5rem);
  padding: clamp(2rem, 4vw, 3rem);
  border-radius: 28px;
  background: #f5f5f7;
}
.article-cost-professional-title p { margin-bottom: .75rem; font: 500 .9375rem/1.4 var(--font); color: #6e6e73; }
.comparison-modern .article-cost-professional-title h3 { margin: 0; font: 600 1.875rem/1.15 var(--heading); letter-spacing: -.015em; color: #1d1d1f; }
.article-cost-professional-copy p + p { margin-top: 1.25rem; }
.article-comparison-closing { margin-top: clamp(3.5rem, 6vw, 5.5rem); text-align: center; }
.article-comparison-closing p { max-width: 43rem; margin: 0 auto 1.75rem; color: #1d1d1f; font: 600 clamp(1.625rem, 3vw, 2.25rem)/1.15 var(--heading); letter-spacing: -.015em; text-wrap: balance; }
.article-comparison-closing strong { font-weight: inherit; }
@media (max-width: 800px) {
  .article-process-tabs { border-radius: 24px; }
  .article-process-tabs button { padding-inline: 1rem; }
  .article-cost-grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .article-cost-breakdown { padding-inline: 1.5rem; }
}
@media (max-width: 699px) {
  .compare-page .comparison-modern .compare-hero { padding-top: calc(var(--hero-clearance, 5rem) + 2rem); }
  .compare-page .comparison-modern .compare-hero h1 { font-size: clamp(2rem, 8.4vw, 3rem); line-height: 1.09; }
  .compare-page .comparison-modern .article-intro-text { text-align: left; }
  .article-jump { gap: .5rem; }
  .article-jump a { padding-inline: .875rem; font-size: .875rem; }
  .article-section-heading { margin-bottom: 1.75rem; }
  .article-comparison-pair { grid-template-columns: 1fr; gap: 2rem; }
  .article-comparison-label { text-align: left; }
  .article-comparison-card { padding: 1.25rem 1.5rem 1.75rem; border-radius: 24px; }
  .article-comparison-art { height: 140px; width: min(100%, 240px); margin-bottom: 1.25rem; }
  .article-comparison-prose { font-size: 1rem; line-height: 1.55; }
  .article-cost-grid,
  .article-cost-professional { grid-template-columns: 1fr; gap: 1.75rem; }
  .article-cost-copy,
  .article-cost-professional-copy { font-size: 1.0625rem; }
  .article-cost-professional { padding: 1.75rem 1.5rem; border-radius: 24px; }
  .article-cost-breakdown { border-radius: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .article-jump a,
  .article-process-tabs button { transition: none; }
}
@media print {
  .article-process-tabs,
  .article-jump { display: none; }
  .article-process .article-comparison-panel[hidden] { display: block !important; }
  .article-process.is-enhanced .article-topic-fallback { display: block; }
  .article-comparison-panel + .article-comparison-panel { margin-top: 3rem; }
  .article-comparison-card { break-inside: avoid; }
}