/* 1. THE DESKTOP FLIP */
@media (min-width: 783px) {
    /* We target the container directly to force the swap */
    .reverse-row.wp-block-row, 
    .reverse-row.is-layout-flex {
        flex-direction: row-reverse !important;
        display: flex !important;
        justify-content: space-between !important;
    }

    /* This ensures the image and text don't "squish" during the flip */
    .reverse-row > * {
        flex: 1; 
    }
}

/* 2. THE MOBILE STACK (Image on Top) */
@media (max-width: 782px) {
    .wp-block-row, .wp-block-group {
        display: flex !important;
        flex-direction: column !important;
    }

    /* Force images to stay at the top of their row on phones */
    .wp-block-image {
        order: -1 !important;
        width: 100% !important;
    }

    /* Keep logos small and centered */
    img[src*="logo"], img[src*="NKBA"], img[src*="IDS"] {
        width: 150px !important;
        max-width: 150px !important;
        margin: 0 auto 15px auto !important;
        display: block !important;
    }
}

/* 3. BRANDING & FORMS */
.wp-block-gallery img, .wp-block-jetpack-slideshow img {
    border-radius: 40px !important;
}

form#wpforms-form-224 {
    border: 1px solid #cccccc;
    padding: 25px;
    border-radius: 5px;
}








/* SLIDESHOW MOBILE HEIGHT FIX */
@media (max-width: 782px) {
    /* Ensures the slideshow maintains a good height on phones */
    .wp-block-jetpack-slideshow, 
    .wp-block-jetpack-slideshow__container {
        height: 300px !important; /* Adjust this number to your liking */
    }
    
    .wp-block-jetpack-slideshow img {
        object-fit: cover !important; /* Prevents the image from looking squished */
    }
}








/* MOBILE GALLERY POLISH */
@media (max-width: 782px) {
    /* Ensures gallery images are large enough to be clear 'tap' targets */
    .wp-block-gallery, .wp-block-image {
        width: 100% !important;
        margin-bottom: 20px !important;
    }
    
    /* Adds a subtle zoom cursor on desktop to hint at the lightbox */
    .wp-block-gallery img, .wp-block-image img {
        cursor: zoom-in !important;
    }
}




/* THE VIDEO ROUNDING CATCH-ALL */
/* This rounds standard videos, YouTube/Vimeo embeds, and their containers */
.wp-block-video video, 
.wp-block-video, 
.wp-block-embed, 
.wp-block-embed iframe,
iframe[src*="youtube"], 
iframe[src*="vimeo"],
video {
    border-radius: 40px !important;
    overflow: hidden !important; /* The 'cookie cutter' that clips the video corners */
    transform: translateZ(0); /* Fixes rounding glitches on mobile */
}

/* If the video is inside that Google Tag Manager/Classic area */
.wp-block-freeform video, 
.wp-block-freeform iframe {
    border-radius: 40px !important;
}



/* MOBILE FULL-WIDTH VIDEO */
@media (max-width: 782px) {
    .wp-block-video, 
    .wp-block-embed iframe, 
    video {
        width: 100vw !important; /* Fills 100% of the screen width */
        margin-left: calc(50% - 50vw) !important; /* Centers it perfectly */
        border-radius: 0px !important; /* Removes rounding so it bleeds to the edges */
    }
}