/* Styles for body-only Knowledge and Blog articles using the shared HTML classes. */
.article-prose .wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin-inline: 0;
  padding: 0;
}

.article-prose .article-inner > :first-child,
.article-prose .after-cards > :first-child { margin-top: 0; }

.article-prose .eyebrow {
  color: var(--color-primary);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.article-prose .lead {
  color: #263653;
  font-size: 1.1rem;
  line-height: 1.7;
}

.article-prose .summary,
.article-prose .toc,
.article-prose .cta {
  margin: 1.5em 0;
  padding: 1.25em 1.4em;
  border-radius: 10px;
}

.article-prose .summary,
.article-prose .cta { background: #eef3ff; }

.article-prose .summary { border-left: 1px solid var(--color-primary); }

.article-prose .summary strong,
.article-prose .toc strong {
  display: block;
  margin-bottom: 0.45em;
  color: #1b2d50;
}

.article-prose .summary > :last-child,
.article-prose .cta > :last-child { margin-bottom: 0; }

.article-prose .toc {
  border: 1px solid var(--color-border);
  background: #fff;
}

.article-prose .toc ol {
  columns: 2;
  column-gap: 2em;
  margin: 0;
}

.article-prose .flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 0;
  list-style: none;
}

.article-prose .flow li {
  min-width: 0;
  margin: 0;
  padding: 0.85em 0.65em;
  border-radius: 8px;
  background: #eef3ff;
  color: #1b2d50;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}

.article-prose figure img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.article-prose .product-section {
  min-width: 0;
  margin: 2.6em 0 2em;
  padding-top: 1.5em;
  border-top: 1px solid var(--color-primary);
}

.article-prose .product-section > h2 { margin-top: 0; }
.article-prose .product-intro { color: var(--color-text-soft); }

.article-prose .cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 1.4em 0 0;
}

.article-prose .cards > .card {
  display: flex;
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: #fbfcff;
  flex-direction: column;
}

.article-prose .product-image {
  display: block;
  width: 100%;
  height: auto;
  max-height: 250px;
  margin-bottom: 14px;
  object-fit: contain;
  background: #fff;
}

.article-prose .tag {
  color: var(--color-primary);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.article-prose .cards > .card h3 { margin: 0.65em 0 0.45em; font-size: 1.05rem; }
.article-prose .cards > .card p { margin-bottom: 1em; font-size: 0.94rem; line-height: 1.6; }
.article-prose .cards > .card a { margin-top: auto; font-weight: 700; }

.article-prose .table-scroll {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 1.3em 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.article-prose .table-scroll table { min-width: 610px; margin-bottom: 0; }
.article-prose .cta h2 { margin-top: 0; }

.article-prose .faq details {
  padding: 0.95em 0;
  border-top: 1px solid var(--color-border);
}

.article-prose .faq details:last-child { border-bottom: 1px solid var(--color-border); }
.article-prose .faq summary { color: #1b2d50; font-weight: 700; line-height: 1.5; cursor: pointer; }
.article-prose .faq details p { margin: 0.75em 0 0; }

@media (max-width: 1100px) {
  .article-prose .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  .article-prose .summary,
  .article-prose .toc,
  .article-prose .cta { padding: 1.1em; }

  .article-prose .toc ol { columns: 1; }
  .article-prose .flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .article-prose .cards { grid-template-columns: 1fr; }
}