Vimeo Full Screen Video Background

cover.scss

.c-cover {
    --height: 100dvh;
    --safe-height: var(--height, var(--vh));
    --container-width: 100vw;
    --container-height: var(--safe-height);

    position: relative;
    height: var(--container-height);
    overflow: hidden;
    width: var(--container-width);

    iframe {
        /* [1] video width and height variables are inherited from inline styles */
        --height-width-ratio: (var(--video-height) / var(--video-width)); // [1]
        --width-height-ratio: (var(--video-width) / var(--video-height)); // [1]

        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: var(--container-width);
        height: calc(var(--container-width) * var(--height-width-ratio));
        min-height: var(--container-height);
        min-width: calc(var(--container-height) * var(--width-height-ratio));
    }
}

and now my brain is fried

    <?php get_template_part(
            'partials/block',
            'vimeo-oembed',
            [
                'vimeo' => get_field('vimeo_id'),
                'params' => "&autoplay=1&loop=1&title=0&byline=0&portrait=0&muted=1&controls=0&dnt=1"
            ]
        ); ?>

block-vimeo-oembed.php

<?php
<?php
$iframe = $args['vimeo'];
preg_match('/src="(.+?)"/', $iframe, $matches);
preg_match('/width="(.+?)"/', $iframe, $matches_width);
preg_match('/height="(.+?)"/', $iframe, $matches_height);

$src = $matches[1];
$src .= $args['params'];
$styles = '--video-width: ' . $matches_width[1] . ';';
$styles .= '--video-height: ' . $matches_height[1] . ';';
?>
<iframe src="<?= $src; ?>" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen style="<?= $styles ?>"></iframe>

Alternatively using Vimeo player SDK

 async setAspectRatio() {
    const promises = [
      this.player.getVideoWidth(),
      this.player.getVideoHeight(),
    ]
    const [width, height] = await Promise.all(promises)

    this.iframe.style.setProperty('--video-width', width)
    this.iframe.style.setProperty('--video-height', height)
  }

To do : custom lite-vimeo