Rails 7 url_for(article.header_image) background-image not appearing

Question

I have the following code for showing the header image in my index.html.erb for my articles:

<% @articles.each do |article| %>
    <% if article.public? %>
    <%= link_to article_path(article), class: 'text-decoration-none' do %>
    <div class="card mt-3 post-card">
      <div class="card-body">
        <div class="row">
          <div class="col-md-2">
            <% if article.header_image.present? %>
            <div class="header-img"
             style="background-image: url(<%= url_for(article.header_image) %>);">
            </div>
            <% end %>
          </div>
          <div class="col-md-10">

            <h5 class='card-title mb-1 text-dark'><%= article.title %></h5>
          <p class='text-secondary mb-0'><%= article.body %> </p>
          </div>

        </div>
      </div>
    </div>
      <% end %>
    <% end %>
  <% end %>

I am following the tutorial by Techmaker Studio, and the desired output is at this timestamp: https://youtu.be/MCEzxY9BbiU?t=5059

The code is correct because I inspected and see the example image (the ruby icon) shows up in the inspector but not in the background image. inspect screenshot proves url is working

The one difference between my project and the tutorial I am following is that I am using Rails 7 and importmaps. Does anyone have an idea why it isn't showing up? when I use image_tag, it works but not with the background-image style I desire.