/* ==========================================================================
   NJSERVICES — Article template styles (article.html only)
   The shared .content-blocks typography lives in main.css since it is
   also used by the How We Work modal on the homepage.
   ========================================================================== */

.article-header {
  padding-top: calc(var(--header-height) + var(--space-4));
  padding-bottom: var(--space-4);
  max-width: 44rem;
}
.article-header .eyebrow { display: block; margin-bottom: var(--space-2); }
.article-header h1 { font-size: var(--fs-display-lg); }

.article-cover {
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
  position: relative;
  overflow: hidden;
  background: var(--color-bg-raised);
  margin-bottom: var(--space-6);
}
.article-cover img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.article-content { max-width: 42rem; }

@media (min-width: 900px) {
  .article-header h1 { font-size: var(--fs-display-xl); }
  .article-cover { padding-top: 44%; }
}