/* =============================================================
   NLIGN — Pages / Posts / 404
   Generic WordPress content area styles.
   ============================================================= */

.nlign-page-content {
  background-color: var(--nlign-color-onyx);
  color:            var(--nlign-color-dust-grey);
  padding:          var(--nlign-section-padding-y) var(--nlign-section-padding-x);
  max-width:        var(--nlign-max-width);
  margin-inline:    auto;
  min-height:       40vh;
}

/* ── Headings ───────────────────────────────────────────────── */
.nlign-page-content h1,
.nlign-page-content h2,
.nlign-page-content h3,
.nlign-page-content h4,
.nlign-page-content h5,
.nlign-page-content h6 {
  color:         var(--nlign-color-dust-grey);
  margin-bottom: 1rem;
}

h3.nlign-product-feature__heading--accent{
  color: var(--nlign-color-orange);
}
/* ── Body text ──────────────────────────────────────────────── */
.nlign-page-content p {
  font-size:     var(--nlign-body-font-size);
  line-height:   var(--nlign-body-line-height);
  margin-bottom: 1.5rem;
  color:         var(--nlign-color-dust-grey);
}

/* ── Links ──────────────────────────────────────────────────── */
.nlign-page-content a {
  color:      var(--nlign-color-orange);
  transition: opacity var(--nlign-transition);
}

.nlign-page-content a:hover { opacity: 0.8; }

/* ── Post meta ──────────────────────────────────────────────── */
.entry-meta {
  font-size:   14px;
  color:       var(--nlign-color-onyx-600);
  margin-top:  0.5rem;
  margin-bottom: 2rem;
}

/* ── Featured image ─────────────────────────────────────────── */
.page-featured-image,
.post-featured-image {
  margin-bottom: 3rem;
}

.page-featured-image img,
.post-featured-image img {
  width:      100%;
  height:     auto;
  object-fit: cover;
}

/* ── Post navigation ────────────────────────────────────────── */
.post-navigation {
  display:         flex;
  justify-content: space-between;
  gap:             1rem;
  margin-top:      3rem;
  padding-top:     2rem;
  border-top:      1px solid var(--nlign-color-onyx-600);
}

.post-navigation a {
  color:      var(--nlign-color-dust-grey);
  transition: color var(--nlign-transition);
}

.post-navigation a:hover { color: var(--nlign-color-orange); }

/* ── Alt page shell (#1A1A1A): 404, Privacy Policy, Terms ───── */
body.error404,
body.error404 .nlign-page-content,
body.nlign-legal-page,
body.privacy-policy,
body.page-slug-privacy-policy,
body.page-slug-privacy-policy .nlign-page-content,
body.page-slug-terms-of-use,
body.page-slug-terms-of-use .nlign-page-content {
  background-color: var(--nlign-color-onyx-800);
}

body.error404 .nlign-page-content {
  min-height: calc(100vh - var(--nlign-navbar-height) - var(--nlign-footer-height));
  display:         flex;
  flex-direction:  column;
  justify-content: center;
  align-items:     center;
}

body.error404 .error-404.not-found {
  width:           100%;
  max-width:       720px;
  margin-inline:   auto;
  text-align:      center;
}

body.error404 .error-404 .page-header,
body.error404 .error-404 .page-content {
  text-align: center;
}

body.error404 .error-404 .page-content p {
  margin-inline: auto;
}

body.error404 .error-404 .page-content .btn {
  display:     inline-flex;
  margin-top:  2rem;
  margin-inline: auto;
  color:var(--nlign-color-white-olive);
  background-color: var(--nlign-color-orange);
}

body.nlign-legal-page .nlign-page-content,
body.privacy-policy .nlign-page-content,
body.page-slug-privacy-policy .nlign-page-content,
body.page-slug-terms-of-use .nlign-page-content {
  min-height:     auto;
  padding-top:    48px;
  padding-bottom: 48px;
}

.error-404 .page-title {
  font-size:     48px;
  line-height:   1.1;
  margin-bottom: 1.5rem;
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 1199.98px) {
  .nlign-page-content { padding-left: 60px; padding-right: 60px; }
}

@media (max-width: 767.98px) {
  .nlign-page-content { padding-left: 24px; padding-right: 24px; padding-top: 48px; padding-bottom: 48px; }

  body.privacy-policy .nlign-page-content,
  body.nlign-legal-page .nlign-page-content,
  body.page-slug-privacy-policy .nlign-page-content,
  body.page-slug-terms-of-use .nlign-page-content {
    padding-top:    32px;
    padding-bottom: 32px;
  }
}
