[Theme: Focus] Child theme not importing parent styles.

As far as I can tell the problem is that the @import url is searching for the styles.css in /focus-child/focus (which doesn’t exist). Instead it should be searching in just /focus.

The php in the header in the child theme is

<style type="text/css" media="screen">
@import url(<?php echo get_stylesheet_directory_uri(); ?>/style.css);
<?php if(get_option('custom_css')) { echo get_option('custom_css'); } ?>
</style>

And this results in

<style type="text/css" media="screen">
@import url(https://www.3dprint-uk.com.3dprint-uk.co.uk/wp-content/themes/focus-child/style.css);
</style>

in the source which seems fine to me.

However the next line in my chrome inspect element tool is
GET https://www.3dprint-uk.com.3dprint-uk.co.uk/wp-content/themes/focus-child/.../focus/style.csss 404 (Not Found)

My style.css in my child theme is

/*
Theme Name: Focus-Child
Theme URI: https://www.cadengrant.me/themes/focus
Description: Premium Portfolio/Photography WordPress Theme
Author: Caden Grant
Author URI: https://www.stunningwp.com/
Template: focus
License: GNU General Public License version 3.0
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Version: 1.0
Tags: dark, theme-options, custom-menu, white, black, one-column, two-columns, three-columns, four-columns, custom-colors, custom-background, photoblogging, threaded-comments, theme-options, light, red, silver, tan
*/

@import url("../focus/style.css");

What have I done wrong?