/* Hero Section - Responsive Fixes */
/* Add media query fixes for different screen widths here */

/* Tablet: Use mobile video position */
@media (min-width: 34.375rem) and (max-width: 79.9375rem) { /* 550px - 1279px */
    .hero__video-wrapper {
        top: 5rem; /* 80px - same as mobile */
        right: -16rem; /* -256px - same as mobile */
        left: auto;
        width: 82.765625rem; /* 1324.25px - same as mobile */
        height: 55.17706rem; /* 882.833px - same as mobile */
    }

    .hero__video {
        width: 82.765625rem; /* 1324.25px - same as mobile */
        height: 55.17706rem; /* 882.833px - same as mobile */
        aspect-ratio: 1324.25/882.83;
    }
}

/* Desktop: Fix video position for desktop sizes */
@media (min-width: 80rem) { /* 1280px and above */
    .hero__video-wrapper {
        left: auto;
        right: -8.875rem; /* -142px */
    }
}

/* Desktop: Adjust top position below 1920px */
@media (min-width: 80rem) and (max-width: 119.9375rem) { /* 1280px - 1919px */
    .hero__video-wrapper {
        top: -12.5rem; /* -200px */
    }
}
