/* Only imported SEO pages. Layout and article typography come from blog/blog.css. */
.seo-page .seo-intro {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 100%;
  min-height: calc(100dvh - var(--ct-content-top) - var(--ct-page-edge));
  gap: var(--ct-space-4);
}
.seo-page .seo-intro .ct-card-header { gap: var(--ct-space-3); }
.seo-page .seo-description {
  margin: 0;
  color: var(--ct-color-text-muted);
  font-size: var(--ct-type-body-size);
  line-height: var(--ct-type-body-leading);
}
.seo-page .seo-header-label { margin-right: auto; font-size: var(--ct-type-body-size); color: #666; }
/* Reuse the exact existing card action component, including its colors/motion. */
.seo-page .seo-intro-bottom { margin-top: auto; display: grid; gap: 8px; }
.seo-page .seo-description { margin-top: 16px; }
.seo-page .blog-post { display: grid; gap: var(--ct-space-4); background: transparent; }
.seo-page .seo-toc { margin-top: auto; }
.seo-page .seo-toc summary { cursor: pointer; font-size: 14px; line-height: 18px; color: #666; }
.seo-page .seo-toc nav { display: grid; gap: var(--ct-space-3); margin-top: var(--ct-space-4); }
.seo-page .seo-toc a { color: #666; font-size: 14px; line-height: 18px; text-decoration: none; }
.seo-page .seo-toc a:hover { color: #282828; }
.seo-page .seo-quote-help { width: min(400px, calc(100% - 32px)); padding: 16px; border: 0; border-radius: var(--ct-radius-card); background: var(--ct-color-card); color: #fff; }
.seo-page .seo-quote-help h2 { margin: 0 0 16px; font: inherit; }
.seo-page .seo-quote-help p { margin: 0 0 24px; font-size: 14px; line-height: 18px; }
.seo-page .seo-quote-help::backdrop { background: rgb(102 102 102 / 40%); backdrop-filter: blur(80px); }
.seo-page .seo-content { overflow-wrap: anywhere; }
.seo-page .seo-content [id] { scroll-margin-top: var(--ct-space-4); }
.seo-page .seo-content section { margin: 0; padding: 0; }
.seo-page .seo-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.seo-page .seo-content :is(th,td) { padding: var(--ct-space-3); border-bottom: 1px solid rgb(0 0 0 / 4%); text-align: left; }
.seo-page .seo-content img { margin-block: var(--ct-space-5); }
.seo-page :focus-visible { outline: 2px solid #007e6a; outline-offset: 4px; }
@media (max-width: 767px), (orientation: portrait) and (min-width: 768px) and (max-width: 1199px) {
  .seo-page .blog-shell { padding-top: var(--ct-content-top); }
  .seo-page.has-open-post .blog-grid { display: grid; padding: 0 16px 16px; }
  .seo-page .seo-intro { min-height: 280px; }
  .seo-page .blog-post-column { padding-top: 0; }
}
.seo-page .seo-content { margin-top: 0; }
.seo-page .seo-content :is(h1,h2,h3,h4,h5,h6) { margin: 24px 0 16px; }
.seo-page .seo-content > section > :first-child { margin-top: 0; }
.seo-page .seo-content > :first-child { margin-top: 0; }
.seo-page .seo-content > section > :last-child { margin-bottom: 0; }
.seo-page .seo-content > section + section { margin-top: 16px; }
@media (max-width: 767px), (orientation: portrait) and (min-width: 768px) and (max-width: 1199px) {
  body.seo-page.resource-master-detail.has-open-post .blog-grid {
    grid-area: 1 / 1;
    position: relative;
    inset: auto;
    padding: 0;
    margin: 0 0 16px;
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }
  body.seo-page.resource-master-detail.has-open-post .blog-post-column {
    grid-area: 2 / 1;
    padding-top: 0;
  }
}