/* ==========================================================================
   TRAILER SECTION
   ========================================================================== */

.trailer-section {
    width: 100%;
    background-color: var(--bg-dark); /* Linked to #0f172a */
    color: var(--text-white);         /* Linked to #ffffff */
    margin: 0 auto;
}

.video-wrapper {
    width: 100%;
    max-width: 900px;
    aspect-ratio: 16 / 9;
    border-radius: 20px; /* Or whatever value you want */
    overflow: hidden;    /* <--- This cuts off the sharp iframe corners */

    margin: 0 auto;
}

.video-wrapper iframe {
    width: 100%;
    height: 100%;
    display: block;
}


/* ==========================================================================
   RESPONSIVE ADJUSTMENTS
   ========================================================================== */

@media (max-width: 1024px) {
    .video-wrapper {
        width: 95%; /* Expands to fill smaller screens */
    }
}