/* style.css */

/* 1. Apply flex column to the wrapper container */
html, body {
    height: 100%;
    margin: 0;
}

body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* Ensures body stretches full screen height */
}

/* 2. Header and Footer take up only their natural height */
header, footer {
    flex-shrink: 0;
}

/* 3. Main grows to fill all available space, pushing footer down */
main {
    flex: 1 0 auto; /* Grows to fill space, doesn't shrink */
    padding-top: 90px; /* Space for fixed header */
    
}

/* Active navigation link */
.nav-links li a.active {
    color: #1e3a8a;
    font-weight: 700;
}