html, body {
  height: 100%;       /* full height */
  margin: 0;          /* remove default margins */
  display: flex;      /* enable flexbox */
  flex-direction: column; /* stack header, main, footer vertically */
}

main {
  flex: 1;            /* main content expands to fill space */
}

footer {
  margin-top: auto;   /* pushes footer to the bottom */
    padding: 1rem 0;           /* optional spacing */

}