(Copy the code below and paste in the source code of the page)

<div id="youtube-player">
   &nbsp;
</div>
<script src="https://www.youtube.com/iframe_api"></script><script>
   // This function creates the YouTube player
   let player;
   function onYouTubeIframeAPIReady() {
       player = new YT.Player('youtube-player', {
           // Choose one of these size options by uncommenting it:
           height: '405',  width: '720',  // 720p (original)
           // height: '203',  width: '360',  // Half of 720p
           // height: '304',  width: '540',  // A quarter smaller than 720p
           videoId: '2iNVSJ9P6Oc',  // Replace with your YouTube video ID
           playerVars: {
               'playsinline': 1,
               'rel': 0,    // Hides related videos at the end
               'showinfo': 0, // Hides video title and uploader info
               'modestbranding': 1 // Removes YouTube logo
           },
           events: {
               'onReady': onPlayerReady
           }
       });
   }
   // Autoplay when player is ready (optional)
   function onPlayerReady(event) {
       // event.target.playVideo(); // Uncomment this line if you want it to autoplay
   }
</script><style>
   /* Makes the video responsive while maintaining aspect ratio */
   #youtube-player {
       max-width: 100%;
       height: auto;
       aspect-ratio: 16 / 9; /* Ensures 16:9 aspect ratio */
   }
</style>

++++++++++
Here is how the video will show on your page:

 Replace the YouTube Video ID with your video ID:

 videoId: '2iNVSJ9P6Oc',  // Replace with your YouTube video ID

You also have the option to change the Video Size on the page. 

 Choose one of these size options by uncommenting it and make sure to comment the current option by placing //:
           height: '405',  width: '720',  // 720p (original)
           // height: '203',  width: '360',  // Half of 720p
           // height: '304',  width: '540',  // A quarter smaller than 720p