.seo-article {
  --seo-ink: #25212a;
  --seo-muted: #615969;
  --seo-line: rgba(47, 40, 53, 0.14);
  --seo-soft: #f7f2f5;
  --seo-accent: #9f416d;
}

.seo-article__hero,
.seo-article__body,
.seo-article__cta {
  width: min(780px, calc(100% - 40px));
  margin-inline: auto;
}

.seo-article__hero { padding: clamp(56px, 9vw, 96px) 0 40px; }
.seo-article__eyebrow { margin: 0 0 12px; color: var(--seo-accent); font-size: .82rem; font-weight: 600; letter-spacing: .12em; }
.seo-article__hero h1 { margin: 0; color: var(--seo-ink); font-size: clamp(2rem, 6vw, 3.5rem); line-height: 1.28; letter-spacing: -.025em; text-wrap: balance; }
.seo-article__lead { max-width: 42rem; margin: 24px 0 0; color: var(--seo-muted); font-size: clamp(1.05rem, 2vw, 1.2rem); }
.seo-article__meta { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 24px; color: var(--seo-muted); font-size: .86rem; }
.seo-article__body { padding: 16px 0 72px; }
.seo-article__body h2 { margin: 56px 0 16px; color: var(--seo-ink); font-size: clamp(1.45rem, 4vw, 2rem); line-height: 1.45; }
.seo-article__body h3 { margin: 32px 0 10px; color: var(--seo-ink); font-size: 1.15rem; }
.seo-article__body p,
.seo-article__body li,
.seo-article__body th,
.seo-article__body td { color: var(--seo-muted); }
.seo-article__body a:not(.btn) { color: var(--seo-accent); text-decoration: underline; text-underline-offset: .2em; }
.seo-article__summary,
.seo-article__note,
.seo-article__sources { margin: 28px 0; padding: 22px; border: 1px solid var(--seo-line); border-radius: 16px; background: var(--seo-soft); }
.seo-article__summary h2,
.seo-article__sources h2 { margin-top: 0; font-size: 1.3rem; }
.seo-article__table-wrap { max-width: 100%; overflow-x: auto; margin: 24px 0; border: 1px solid var(--seo-line); border-radius: 16px; }
.seo-article__table { width: 100%; min-width: 600px; border-collapse: collapse; }
.seo-article__table th,
.seo-article__table td { padding: 14px 16px; border-bottom: 1px solid var(--seo-line); text-align: left; vertical-align: top; }
.seo-article__table th { color: var(--seo-ink); background: var(--seo-soft); }
.seo-article__related { display: grid; gap: 12px; padding: 0; list-style: none; }
.seo-article__related a { display: block; padding: 14px 16px; border: 1px solid var(--seo-line); border-radius: 12px; background: #fff; }
.seo-article__cta { margin-bottom: 96px; padding: clamp(28px, 6vw, 44px); border-radius: 22px; color: #fff; background: linear-gradient(135deg, #7f3157, #3d7774); }
.seo-article__cta h2 { margin: 0 0 12px; font-size: clamp(1.45rem, 4vw, 2rem); }
.seo-article__cta p { margin: 0 0 22px; }
.seo-article__cta .btn { width: min(100%, 22rem); min-height: 48px; color: #31232c; background: #fff; }
.seo-decision-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
.seo-decision-links article { padding: 20px; border: 1px solid var(--seo-line); border-radius: 16px; background: #fff; }
.seo-decision-links h3 { margin-top: 0; }

@media (max-width: 640px) {
  .seo-article__hero,
  .seo-article__body,
  .seo-article__cta { width: min(100% - 32px, 780px); }
  .seo-article__hero h1 { word-break: auto-phrase; overflow-wrap: anywhere; }
  .seo-decision-links { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .seo-article *, .seo-article *::before, .seo-article *::after { scroll-behavior: auto !important; transition: none !important; }
}
