Next.js / Headless BigCommerce Developer — Metafield CSS Injection Audit

We run a headless BigCommerce storefront on Next.js. Product page content is stored in BC as metafields and fetched at render time — HTML sections via a product metafield namespace, CSS via category metafields. The content renders but the styles are not applying correctly. Global theme styles are overriding or blocking the injected CSS entirely. The job: Audit how category metafield CSS is currently being fetched and injected into the page Identify why the injected CSS is losing to global Next.js styles Fix the injection pattern so metafield CSS applies correctly without fighting the theme Document the correct pattern so our team can replicate it across all product categories Longer term: We're building out a full catalog across multiple product categories. If you solve this cleanly, there's consistent ongoing work available. You must know: Next.js data fetching patterns, how BC metafields are consumed in a headless setup via the BC API, CSS injection in Next.js without scoping or purge issues, and how raw HTML blobs rendered via dangerouslySetInnerHTML interact with the surrounding component styles. To apply — one question: Have you debugged a CSS injection or rendering issue in a headless BC/Next.js setup? Describe what was broken and how you fixed it. Generic proposals ignored. Live staging site rev1tech.org where issues are present on products that exist.