Formatting placeholder text in forms

Hi there,

I am hoping someone may be able to help - I feel like I've tried everything but cannot work out how to format placeholder text in my contact form. 

I have injected some code into the page footer which is allowing me to add placeholder text into the form:

<script>
(function() {
document.querySelector(".first-name input").setAttribute("placeholder", "First name");
document.querySelector(".last-name input").setAttribute("placeholder", "Last name");
document.querySelector(".email input").setAttribute("placeholder", "Email");
document.querySelector(".message input").setAttribute("placeholder", "Type your message here");
})()
</script>

However, I cannot seem to find a way to change the formatting of the placeholder text. I'm ideally looking to change it to:

• Font family: 'Circular-Book' [custom font]
• Font colour: #00282e

If anyone has any ideas about how I do this, I will be forever grateful! 

Page URL: https://rectangle-wisteria-55e2.squarespace.com/contact
Password: AstonHolmes23

Thank you very much in advance.

Matt

Thank you SO much Tuanphan!  🙏