/* Shared long-form content shell for articles, products and future templates. */
.article-page-shell {
  --article-ink: var(--brand-ink);
  --article-green: var(--brand-green);
  --article-green-deep: var(--brand-green-deep);
  --article-gold: var(--brand-gold);
  --article-muted: var(--brand-surface);
  --article-line: var(--brand-line);
}

.article-content-surface {
  margin-top: 34px;
  padding: clamp(28px, 4.2vw, 54px);
  border: 1px solid var(--article-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(7, 22, 17, .08);
}

.article-content-surface .newscontent-details article > h2:first-child {
  margin-top: 0;
}

/* Keep pasted/editor tables inside the long-form content width. */
.article-page-shell .newscontent-details,
.article-page-shell .newscontent-details article {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.article-page-shell .newscontent-details {
  overflow: hidden;
}

.article-page-shell .newscontent-details article .table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: 8px;
  -webkit-overflow-scrolling: touch;
}

.article-page-shell .newscontent-details article table {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  table-layout: fixed;
}

.article-page-shell .newscontent-details article th,
.article-page-shell .newscontent-details article td {
  min-width: 0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: normal;
}

.article-page-shell .newscontent-details article .table-wrap table {
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  .article-content-surface {
    margin-top: 24px;
    padding: 24px 20px;
    border-radius: 8px;
    box-shadow: 0 10px 28px rgba(7, 22, 17, .06);
  }

  .article-page-shell .newscontent-details article .table-wrap table {
    min-width: 640px !important;
    table-layout: auto;
  }
}
