How do I use inline CSS in AMP pages?

I am trying to figure out how to get the inline css to work in AMP pages. Below is the script I’ve tried in functions.php. Note the $raw_content array that includes the inline CSS.

add_filter('amp_post_template_data', function($data) {
        $raw_content = array(
        '<h2 class="amp-wp-title" style="background-color: '.get_field('bg_color').';">'.get_field('h2_title').'</h2>',
        get_field('content_2')
        );
        
        foreach ($raw_content as $content) {
            list($sanitized_html, $scripts, $styles) = AMP_Content_Sanitizer::sanitize(
                $content,
                array( 'AMP_Img_Sanitizer' => array(), 'AMP_Style_Sanitizer' => array() )
                );
            
            $data['amp_component_scripts'] = array_merge($data['amp_component_scripts'], $scripts);
            
            $data['post_amp_styles'] = array_merge($data['post_amp_styles'], $styles);
            
            add_action('customamp', function() use ($sanitized_html) {
                echo $sanitized_html;
            });
        }
    return $data;
});

In the AMP page, I get the markup for the h2 tag like this:
<h2 class="amp-wp-title amp-wp-067014b">. It looks like the script has sanitised the inline CSS and added a new class amp-wp-067014b. However the new class isn’t added into <style amp-custom>.

Have I done this incorrectly or is there a better way to resolve this?

Thanks