﻿/* --- ffffff Vertical Stacking for Links (All links stack vertically) --- */
.vertical-stack a {
    /* Changes the inline links to block-level elements */
    display: block;
    /* Adds a small space between the links */
    margin-bottom: 5px;
    /* Optional: style for the links */
    color: #4A90E2;
    text-decoration: underline;
    font-weight: bold;
}

/* --- Base/Desktop Styles (Default: 4 Columns) --- */
.footer-grid {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    padding-bottom: 20px; /* Add space below the links */
}

.legal-column {
    flex: 1; /* Each column takes equal space on desktop */
    padding: 0 10px;
    text-align: left; /* Ensure text alignment is consistent */
}

/* --- Media Query for Mobile/Tablet Screens (2x2 Grid) --- */
@media (max-width: 768px) {

    .footer-grid {
        /* Allows items to wrap to the next row for 2x2 layout */
        flex-wrap: wrap;
        justify-content: space-around;
        padding: 0 5%;
    }

    .legal-column {
        /* Forces two items per row, taking 48% of the width each */
        flex: 0 0 48%;
        margin-bottom: 30px;
        padding: 0;
    }
}
