How to add custom font in magento2 transactional email?

I am trying to add custom fonts in magento 2 transactional emails however, it does not work. I am using hyva theme.

I have imported Sofia-pro font under app/design/frontend///web/fonts/SofiaProRegular.woff2 and app/design/frontend///web/fonts/Sofia_pro_regular.ttf

Then I have added _typography.less file under app/design/frontend///web/css/source/_typography.less and added the following code in it

.lib-font-face {
    @family-name: @font-family-name__base;
    @font-path: '@{baseDir}fonts/SofiaProRegular.woff2';
    font-weight: 300;
    font-style: normal;
}

After that, I added the following code inside _variable.less

@font-family-name__base:'Sofia-pro';
@font-family__base: @font-family-name__base, @font-family__sans-serif;

Then tried using in my less file as,

body {
font-family: 'Sofia-pro', Sans-serif';
}

But, none of that seems to work, the font is not applied into my email template.

How do I apply custom fonts in my transactional email templates in magento 2?

My magento 2 version is magento 2.4