﻿body {
    .dept-container

{
    border: 1px solid #c8ced3;
    background-color: #fff;
    margin: 0 auto;
    max-width: 1600px; /* Wider for big screens */
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

/* Top Header Area */
.dept-main-header {
    padding: 10px 20px;
    background: #fff;
    border-bottom: 3px solid #a52a2a;
    display: flex;
    align-items: center;
}

    .dept-main-header h2 {
        color: #a52a2a;
        font-family: 'Oswald', sans-serif;
        font-size: 24px;
        margin: 0;
        text-transform: uppercase;
        letter-spacing: 1px;
    }

/* THE GRID SYSTEM:
           Using a nested grid ensures headers in Row 2 align 
           perfectly regardless of the content in Row 1.
        */
.dept-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 4 Columns */
    border-top: 1px solid #e0e0e0;
    padding-left: 25px;
}

.grid-column {
    display: flex;
    flex-direction: column;
    border-right: 0px solid #e0e0e0;
}

    .grid-column:last-child {
        border-right: none;
    }

/* Sub-Headers: Slate Blue background with Gold text */
.dept-header {
    /* background-color:#ffddae;*/
    color: #880000;
    padding: 8px 12px;
    font-weight: 900;
    /* font-family: 'Oswald', sans-serif;*/
    font-size: 20px;
    /*            text-transform: uppercase;
           border-bottom: 1px solid #242d3a;*/
}

/* Link Lists */
.dept-list {
    list-style: none;
    padding: 0;
    margin: 0;
    /* background: #ffddae;*/
}

    .dept-list li {
        border-bottom: 0px solid #f1f1f1;
    }

        .dept-list li a {
            display: block;
            /* Reduced padding to fit more on one screen */
            padding: 6px 12px;
            color: #01252f;
            text-decoration: none;
            /* font-family: 'Roboto Condensed', sans-serif;*/
            font-size: 17px;
            line-height: 1.2;
            transition: all 0.2s ease;
            font-weight: 500
        }

            .dept-list li a:hover {
                background-color: #f8f9fa;
                color: #a52a2a;
                padding-left: 18px;
                font-weight: bold;
            }

/* Alignment Fix: Row 2 start */
.row-2-header {
    border-top: 0px solid #e0e0e0;
}

/* Responsive */
@media (max-width: 1200px) {
    .dept-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .dept-grid {
        grid-template-columns: 1fr;
    }
}
.dept-list {
    list-style: none;
    padding-left: 0 !important;
    margin: 0;
}

    .dept-list li {
        position: relative;
        padding-left: 10px;
        margin-bottom: 6px;
    }

        /* Arrow inside circle */
        .dept-list li::before {
            content: "➤"; /* Arrow symbol */
            position: absolute;
            left: 0;
            top: 9px;
            width: 16px;
            height: 16px;
            line-height: 16px;
            text-align: center;
            font-size: 9px;
            color: #fff;
            background: #000; /* Black circle */
            border-radius: 50%;
        }

}
