.blog-hero-header {
    min-height: 60vh;
    background-image: url('/Resources/Images/BackgroundImages/567327817.webp');
    background-size: cover;
    background-position: 15% 60%;
}

.blog-hero-header-h1-container {
    left: 15%;
    bottom: 10%;
}

@media (max-width: 768px) {
    .blog-hero-header {
        min-height: 40vh;
        background-image: url('/Resources/Images/BackgroundImages/567327817.webp');
    }

    .blog-hero-header-h1-container {
        left: 7%;
        bottom: 7%;
    }

        .blog-hero-header-h1-container h1 {
            font-size: 2.5rem;
        }
}

@media (max-width: 576px) {
    .blog-hero-header {
        min-height: 30vh;
        background-image: url('/Resources/Images/BackgroundImages/567327817.webp');
    }

    .blog-hero-header-h1-container {
        left: 2%;
        bottom: 4%;
    }

        .blog-hero-header-h1-container h1 {
            font-size: 2rem;
        }
}

.bg-custom {
    background-color: #DFD5C8 !important;
    width: 100%; /* Ensures full width */
    min-height: 100px; /* Adjust height as needed */
    padding: 35px 0; /* Adds vertical space */
}

/* limit every .col under #award-logos to a max height */
#award-logos .col {
    max-height: 120px; /* pick your value */
    overflow: hidden; /* hide any overflow */
}

/* then make every img inside that fill its parent */
#award-logos img {
    max-height: 100%; /* fill the col height */
    width: auto; /* preserve aspect ratio */
    object-fit: contain; /* center & scale */
}

/*.BlogDisplayCard01-container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 100% !important;*/ /* Makes it fill parent column height */
    /*min-height: 485px;*/ /* Optional: Set a minimum height for better appearance */
/*}*/