.header {
    background-color: #dc1c28; /* Header background color */
    padding: 0; /* Remove all padding from header */
    display: flex; /* Use flexbox for layout */
    align-items: center; /* Center items vertically */
    justify-content: space-between; /* Space between title and logo */
    flex-wrap: wrap; /* Allow wrapping for smaller screens */
}

    .header h2 {
        color: #fff; /* Header text color */
        margin: 0; /* Remove default margin */
        padding: 15px; /* Add padding to the header text */
        flex: 1; /* Allow the text to grow */
        min-width: 200px; /* Minimum width for the header text */
    }

    .header img {
        max-width: 100%; /* Responsive image */
        height: auto; /* Maintain aspect ratio */
        width: 270px; /* Fixed width for larger screens */
        padding: 0; /* Remove padding */
        margin: 0; /* Remove margin */
    }

@media (max-width: 768px) {
    .header h2 {
        font-size: 1.5rem; /* Smaller font size on mobile */
        text-align: center; /* Center text on smaller screens */
    }

    .header img {
        width: 200px; /* Smaller logo width on mobile */
    }
}

@media (max-width: 576px) {
    .header h2 {
        font-size: 1.2rem; /* Further reduce font size on extra small screens */
    }

    .header img {
        width: 150px; /* Even smaller logo width */
    }
}