/* Shared palette based on the approved sourcing hero: deep teal, soft grid and warm gold. */
:root {
  --site-ink: #143b36;
  --site-green: #17695b;
  --site-green-deep: #10473d;
  --site-green-soft: #dcece6;
  --site-paper: #f5f8f7;
  --site-line: #d7e5df;
  --site-gold: #e6c58d;
  --site-blue: #2869c6;
}

body:not(.admin-body) { background: var(--site-paper); color: var(--site-ink); }
body:not(.admin-body) main { background: var(--site-paper); }

/* Apply the quiet grid only to prominent color panels, keeping photos untouched. */
body main :is(.hero,.products-hero,.about-hero,.faq-hero,.blog-hero,
  .verification-hero,.fba-hero,.test-hero,.pay-hero,.policy-hero,.terms-hero,
  .contact-hero,.contact-four-hero,.fba-cta,.faq-cta,.blog-cta,.products-cta,
  .about-cta,.verification-request,.case-study,.case-studies,.contact,.stats-band) {
  color: #f7fbf9;
  background-color: #14594d !important;
  background-image:
    linear-gradient(rgba(211, 239, 229, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(211, 239, 229, .045) 1px, transparent 1px),
    linear-gradient(112deg, #124b40 0%, #155b4e 52%, #17695b 100%) !important;
  background-size: 112px 112px, 112px 112px, cover !important;
  background-position: center, center, center !important;
}

body main :is(.hero,.products-hero,.about-hero,.faq-hero,.blog-hero,
  .verification-hero,.fba-hero,.test-hero,.pay-hero,.policy-hero,.terms-hero,
  .contact-hero,.contact-four-hero,.fba-cta,.faq-cta,.blog-cta,.products-cta,
  .about-cta,.verification-request,.case-study,.case-studies,.contact,.stats-band)
  :is(h1,h2,h3) { color: #fff; }
body main :is(.hero,.products-hero,.about-hero,.faq-hero,.blog-hero,
  .verification-hero,.fba-hero,.test-hero,.pay-hero,.policy-hero,.terms-hero,
  .contact-hero,.contact-four-hero,.fba-cta,.faq-cta,.blog-cta,.products-cta,
  .about-cta,.verification-request,.case-study,.case-studies,.contact,.stats-band)
  :is(.eyebrow,.section-kicker) { color: #b9e1d5; }
body main :is(.hero,.products-hero,.about-hero,.faq-hero,.blog-hero,
  .verification-hero,.fba-hero,.test-hero,.pay-hero,.policy-hero,.terms-hero,
  .contact-hero,.contact-four-hero,.fba-cta,.faq-cta,.blog-cta,.products-cta,
  .about-cta,.verification-request,.case-study,.case-studies,.contact,.stats-band)
  :is(p,li,span,small) { color: #e0eee9; }
body main :is(.hero,.products-hero,.about-hero,.faq-hero,.blog-hero,
  .verification-hero,.fba-hero,.test-hero,.pay-hero,.policy-hero,.terms-hero,
  .contact-hero,.contact-four-hero,.fba-cta,.faq-cta,.blog-cta,.products-cta,
  .about-cta,.verification-request,.case-study,.case-studies,.contact,.stats-band) h1 em,
body main :is(.hero,.products-hero,.about-hero,.faq-hero,.blog-hero,
  .verification-hero,.fba-hero,.test-hero,.pay-hero,.policy-hero,.terms-hero,
  .contact-hero,.contact-four-hero,.fba-cta,.faq-cta,.blog-cta,.products-cta,
  .about-cta,.verification-request,.case-study,.case-studies,.contact,.stats-band) h2 em { color: var(--site-gold); }

/* Keep supporting content light, with green ink, dividers and restrained card fills. */
body main :is(.section-light,.section-alt,.catalog,.why-verify,.verification-faq,
  .fba-section,.policy-content,.terms-content,.blog-list,.faq-content,.test-wrap,
  .payment-panel,.about-values,.about-story,.about-method,.about-team) {
  background-color: var(--site-paper);
}
body main :is(.verification-grid article,.benefit-grid article,.plan-card,
  .product-card,.payment-card,.faq-list details,.faq details,.blog-card,
  .article-takeaways,.contact-box,.fba-prep) {
  border-color: var(--site-line);
}
body main :is(.verification-grid article,.benefit-grid article,.plan-card,
  .product-card,.payment-card,.faq-list details,.faq details,.blog-card,
  .contact-box,.fba-prep) { background-color: #fff; }
body main :is(.verification-grid h3,.benefit-grid h3,.plan-card h3,
  .product-card h3,.section-heading h2,.process h2,.audit h2) { color: var(--site-ink); }
body main :is(.verification-grid p,.benefit-grid p,.process-steps p,
  .audit-copy>p,.section-lead,.fba-section p) { color: #5d756f; }
body main :is(.hero-actions a:first-child,.verification-form button,
  .fba-primary,.blog-cta a,.fba-cta a,.products-cta a,.faq-cta a) {
  background: var(--site-blue);
  color: #fff;
}
body main :is(.hero-actions a:first-child,.verification-form button,
  .fba-primary,.blog-cta a,.fba-cta a,.products-cta a,.faq-cta a):hover {
  background: #1f58aa;
  color: #fff;
}
body main :is(.hero-points span,.hero-pills span,.request-notes span) {
  border-color: rgba(220, 242, 233, .42);
  background-color: rgba(231, 246, 239, .10);
}
body main :is(a,button,input,textarea,select,summary):focus-visible {
  outline: 3px solid var(--site-gold);
  outline-offset: 3px;
}

/* Article pages use the same green grid for the title block and the article CTA. */
body:has(.managed-article) { background: var(--site-paper); }
body .managed-article .article-header {
  padding: clamp(24px, 4vw, 42px);
  border-radius: 20px;
  background-color: #14594d;
  background-image:
    linear-gradient(rgba(211, 239, 229, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(211, 239, 229, .045) 1px, transparent 1px),
    linear-gradient(112deg, #124b40 0%, #155b4e 52%, #17695b 100%);
  background-size: 112px 112px, 112px 112px, cover;
}
body .managed-article .article-header h1 { color: #fff; }
body .managed-article .article-header .article-kicker { background: #ffffff1c; color: #b9e1d5; }
body .managed-article .article-header .article-summary,
body .managed-article .article-header .article-meta { color: #e0eee9; }
body .managed-article .article-header .article-badge { background: #f5f8ef; color: #155344; }
body .managed-article .article-body { color: #334e48; }
body .managed-article .article-body h2,
body .managed-article .article-body h3 { color: #155344; }
body .related-articles { background: var(--site-paper); }

@media (max-width: 680px) {
  body main :is(.hero,.products-hero,.about-hero,.faq-hero,.blog-hero,
    .verification-hero,.fba-hero,.test-hero,.pay-hero,.policy-hero,.terms-hero,
    .contact-hero,.contact-four-hero,.fba-cta,.faq-cta,.blog-cta,.products-cta,
    .about-cta,.verification-request,.case-study,.case-studies,.contact,.stats-band) {
    background-size: 76px 76px, 76px 76px, cover !important;
  }
}