.article-parts {
  margin-top: 2rem;
}
.article-part {
  margin-bottom: 2rem;
}
.article-part h2 {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

/* Make Main nav menu sit directly and transparently on top of header */
.header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 50;
  width: 100%;
  background-color: transparent;
  padding-inline: 1rem;
  padding-block: 1.25rem;
}

/* Push the hero's inner content down so it doesn't collide with the header */
.hero-banner .container.relative {
  padding-top: 3rem; /* roughly header height + spacing — tune this */
}

@media (max-width: 768px) {
  .hero-banner .container.relative {
    padding-top: 4.5rem; /* mobile header is shorter, needs less space */
  }
}

body:not(.path-frontpage) .header {
  position: relative;
  background-color: var(--sds-background-color-0); /* or your brand color */
}

body:not(.path-frontpage) .hero-banner .container.relative {
  padding-top: 0; /* undo the extra offset, header no longer overlaps */
}

/* Make Quotes styled as quotes in articles, theme fix */
blockquote {
  margin: 1.5em 0;
  padding: 0.5em 1.5em;
  border-left: 4px solid #ccc;
  font-style: italic;
  color: #555;
}

/* Make tables visible as tables on website, fix theme problem with showing tables */
.content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5em 0;
}

.content table th,
.content table td {
  padding: 0.6em 0.8em;
  border: 1px solid #ccc;
  text-align: left;
  vertical-align: top;
}

.content table th {
  background: #f3f3f3;
  font-weight: 600;
}

.content table tbody tr:nth-child(even) {
  background: #fafafa;
}

/* Indent the first word of a paragraph */
.content p {
  text-indent: 2em;
}

/* Made the articles easier on the eyes and easier for humans to read. */
.content {
  font-family: Georgia, "Source Serif 4", serif;
  font-size: 18px;
  line-height: 1.65;
  max-width: 40rem;
  margin-left: auto;
  margin-right: auto;
}
/* Decorate the captions element on all images to ensure they are styled and with smaller fonts*/
figure figcaption {
  font-size: 0.8rem;   /* smaller text */
  color: #666;         /* softer color */
  font-style: italic;  /* optional */
  text-align: center;  /* or left */
  margin-top: 0.4rem;
}