Можно ли изменить data атрибут в html через css?

Всем привет!
Есть дата атрибут в html, который связан с js. Необходимо его изменить при определенном медиа запросе. Как быть?

<p class="f1" data-delay="1s">AAAA</p>

Нужно поменять 1s на 2s через css при определенной ширине экрана.

Пока вижу решение только в создании дубликата тега с дата 2s + display: none при определенном медиа запросе.
Хотелось бы решение попроще, так как в самой верстке тег намного больше, чем указал тут в примере.
Спасибо!