/*.wpzoom-blocks_portfolio-block {margin-top: 0;}

@media screen and (max-width: 800px) {
	.hero {
		font-size: 50px !important;
	}
	
}


@media screen and (max-width: 500px) {
	.hero {
		font-size: 30px !important;
	}
	
} */
/* HOVER ZOOM EFFECT - used on home page */
/* Container to keep the zoomed image within its original bounds */
.zoom-image-container {
    overflow: hidden !important;
    display: inline-block; 
    border-radius: 5px; /* Optional: adds slightly rounded corners */
    aspect-ratio: 1 / 1; /* Forces the container to be a perfect square */
    width: 100%; /* Ensures the container fills its parent column */
}

/* Base image styling for a smooth transition */
.zoom-image-container img {
    transition: transform 0.4s ease-in-out;
    display: block; 
    width: 100%;
    height: 100%; /* Changed from auto to 100% to fill the square */
    object-fit: cover; /* Prevents distortion, scales the image to fill the square */
    object-position: center; /* Centers the image within the block */
}

/* The zoom effect triggered on hover */
.zoom-image-container:hover img {
    transform: scale(1.15); /* Increases size by 15%. Adjust 1.15 to change zoom level. */
}

/* Center the row container on desktops and prevent JS overrides */
@media (min-width: 992px) {
    
    .wide-desktop-text {
        max-width: 80% !important;
        width: 80% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        left: 0 !important;
        float: none !important;
        display: block !important;
    }

    /* Force the inner column engine to stay in a horizontal row layout */
    .wide-desktop-text > .vc_row, 
    .wide-desktop-text .wpb_row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        left: 0 !important;
    }

    /* Ensure both columns split the space evenly (50% each) side-by-side */
    .wide-desktop-text .wpb_column.vc_col-sm-6 {
        width: 50% !important;
        float: left !important;
    }
}

