/* Senior-friendly reading system: retain dramatic H1s, improve supporting copy and contrast. */
:root {
  --silvachar-readable-black: #000;
}

/* Supporting copy beside or directly below the primary H1 on every public template. */
.hero.hero-approved > .wrap > p,
.why-page-hero-copy > p,
.applications-hero-copy > p,
.blog-hero-copy,
.article-deck {
  color: #fff !important;
  font-size: clamp(1.25rem, 1.75vw, 1.5rem) !important;
  font-weight: 500;
  line-height: 1.58 !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
}

/* Give the homepage support copy enough contrast over the forest photograph. */
.hero.hero-approved {
  background-image:
    linear-gradient(90deg, rgba(5, 17, 13, .88) 0%, rgba(5, 17, 13, .70) 52%, rgba(5, 17, 13, .3) 100%),
    url('images/silvachar-hero.webp') !important;
}

.hero.hero-approved > .wrap > p strong { font-weight: 700; }

/* True black for ordinary reading copy on light surfaces. */
.biochar-explainer :is(.biochar-lead p, .biochar-feature p),
.about-copy > p,
.about-team-intro > p,
.team-card > p,
.why-page-proof .why-page-chain span,
.why-page-benefits :is(.why-page-section-heading > p, .why-page-benefit-copy p, .why-page-best-for),
.why-page-faq :is(.why-page-faq-layout > div:first-child > p, details p),
.why-page-next p,
.applications-page .application-detail :is(.application-lead, .application-use-grid p, .evidence-card p, .evidence-results li, .evidence-context, .evidence-reference),
.blog-index :is(.blog-section-heading > p, .blog-card-content > p, .blog-empty p),
.article-layout :is(.article-body, .article-aside p),
.social-media-heading-copy,
.contact-heading > p,
.contact-form-card :is(p, label),
.sds-dialog-panel :is(p, li) {
  color: var(--silvachar-readable-black) !important;
}

/* Feature-card paragraphs are easier to separate when a card contains two. */
.biochar-feature-copy p + p { margin-top: 1rem; }

/* Preserve high-contrast light text inside intentionally dark components. */
.technical-product-info p,
.why-page-applications p,
.applications-fit p,
.blog-cta p,
.contact-panel p,
.site-footer p {
  color: #fff !important;
}

@media (max-width: 760px) {
  html body { font-size: 17px; }

  .hero.hero-approved > .wrap > p,
  .why-page-hero-copy > p,
  .applications-hero-copy > p,
  .blog-hero-copy,
  .article-deck {
    font-size: 1.2rem !important;
    line-height: 1.55 !important;
  }
}
