li.limited::before {
  content: "✓";
  color: var(--gray-dark);
  position: absolute;
  left: 0;
}

li.uncheked::before {
  content: "×";
}

.video-container {
    /* This is the key part: it creates a 16:9 aspect ratio */
    /* Calculation for 16:9 is (9 / 16) * 100 = 56.25% */
    padding-bottom: 56.25%;
    /* Make the container relative so the iframe can be positioned absolutely */
    position: relative;
    /* Set the width of the container.
You can change this to 80% to fit your requirement. */
    width: 100%;
    /* Remove the height as padding-bottom will control the aspect ratio */
    height: 0;
    /* Optional: To prevent any content from overflowing */
    overflow: hidden;
}

.video-container iframe {
    /* Absolutely position the iframe to fill the container */
    position: absolute;
    top: 0;
    left: 0;
    /* Set the width and height to 100% of the parent container */
    width: 100%;
    height: 100%;
}

/* To limit the video to 80% width on mobile */
@media (max-width: 768px) {
    .video-container {
        width: 80%;
        /* Optional: Center the video */
        margin: 0 auto;
    }
}