Confused about time

I have a HA instance that is 1 timezone away from where I am located. For some reason, cards that display information about sunrise / sunset show those times as 1 hour earlier than they occur in the timezone of the HA instance.

I have a couple of sensors set up that I can display on an entity card and the times are correct:


- platform: template
    sensors:
      nextsunrise:
        entity_id: sun.sun
        friendly_name: 'Next Sunrise'
        value_template: >
          {{ as_timestamp(states.sun.sun.attributes.next_rising) | timestamp_custom(' %I:%M %p') | replace(" 0", "") }}
        icon_template: mdi:weather-sunset-up

      nextsunset:
        entity_id: sun.sun
        friendly_name: 'Next Sunset'
        value_template: >
          {{ as_timestamp(states.sun.sun.attributes.next_setting) | timestamp_custom(' %I:%M %p') | replace(" 0", "") }}
        icon_template: mdi:weather-sunset-down

If I look at the source for the cards that show the 1 hour offset, they use code like:

    if (sun) {
      next_rising = new Date(sun.attributes.next_rising);
      next_setting = new Date(sun.attributes.next_setting);
    }

I am assuming that these somehow get executed on the browser / mobile app, which seems odd that entities such as sun are present there. I don’t understand why this happens with the cards written in javascript, yet the template code works fine. Can anyone explain what is happening and maybe suggest a workaround?