Custom Fonts issues

Hallo I have followed the instructions of GP for the local custom fonts, but I cant make them work on my editor.

What I have done till now is this

style.css ( Child Theme )

/* PFBagueSansPro - Regular */
@font-face {
    font-family: 'PFBagueRegular';
    font-style: normal;
    font-weight: 400; /* Regular */
    src: url('/wp-content/themes/generatepress_child/fonts/PFBagueSansPro-Regular.otf') format('opentype');
}

/* PFBagueSansPro - Bold */
@font-face {
    font-family: 'PFBagueSansPro';
    font-style: bold;
    font-weight: 700; /* Bold */
    src: url('/wp-content/themes/generatepress_child/fonts/PFBagueSansPro-Bold.otf') format('opentype');
}

/* PFBagueSansPro - Black */
@font-face {
    font-family: 'PFBagueBlack';
    font-style: normal;
    font-weight: 700; /* Black */
    src: url('/wp-content/themes/generatepress_child/fonts/PFBagueSansPro-Black.otf') format('opentype');
}

@font-face {
    font-family: 'PFBagueBlackBold';
    font-style: normal;
    font-weight: bold; 
    src: url('wp-content/themes/generatepress_child/fonts/PFBagueSansPro-Bold.otf') format('opentype');
}

Functions PHP

add_filter( 'generate_editor_styles', function( $editor_styles ) {
    $editor_styles[] = 'style.css';

    return $editor_styles;
} );

Which by the way does not show the available fonts on the customizer and its font weights, but If I write it down it works – but still on the front end.

Thanks in advance