main {
    padding: 2em;
}

footer.banner {
    padding: 1em 2em;
    margin-top: auto;
    background-color: #57ffcb;
}

[layout="column"] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}


/* === MEDIA SCREEN & DARK MODE === */

@media (prefers-color-scheme: dark) {
    footer.banner {
        background-color: #1a3a34; /* Deep teal green: still branded, but dark mode friendly */
        color: #e0f7f4; /* Optional: ensures footer text remains readable */
    }   
}