
footer {
    display: flex;
    justify-content: space-between; /* Logo container on the left, nav on the right */
    align-items: center; /* Vertically center everything */
    padding: 20px 40px;
    background-color: #231F20;
    color: white;

}
.logo-container {
    display: flex; /* Flexbox for logo and text */
    align-items: center; /* Vertically center logo and text */
}

.logo img {
    width: 150px; /* Adjust the logo size */
    height: auto;
}

.logo-text {
    margin-left: 10px; /* Space between logo and text */
    font-size: 18px;
    color: white; /* Text color */
}



.subfooter { background-color: #F9F9F9; margin-top: 2rem;}

.footer-container {
    display: grid;
    grid-template-columns: repeat(6, 1fr); /* Creates 6 equal-width columns */
    column-gap: 10px;
    padding: 80px 20px;
    row-gap: 20px;
    width: 80%; /* Set the width to 80% */
    margin: 0 auto; /* Center the container horizontally */
}

.block-link {
  text-decoration: none; /* Removes underline */
  color: inherit; /* Keeps text color */
  display: block; /* Makes the link cover the entire block */
}

.block-link h3, .block-link ul, .block-link li {
  margin: 0; /* Optional: adjust margins */
}

/* Columns spanning grid 2-3 and 4-5 */
.column.left {
    grid-column: 2 / 4; /* Spans from column 2 to 3 */
    padding: 10px;
}

.column.right {
    grid-column: 4 / 6; /* Spans from column 4 to 5 */
    padding: 10px;
}

.column ul {
display: block;
list-style-type: none;
margin-top: 0.5em;
margin-bottom: 0.5 em;
margin-left: 0;
margin-right: 0;
padding-left: 0px;
line-height: 1.4em;
}

.column h3 {color: #476F85;
}




/* Media query for mobile view */
@media (max-width: 768px) {
    .footer-container {
        grid-template-columns: 1fr 1fr; /* Two equal columns for mobile */
        width: 90%; /* Slightly wider on mobile for better readability */
    }

    .column.left, .column.right {
        grid-column: span 2; /* Each will take up the full width */
    }
}
