Fix footer position: stick to bottom on short pages, scroll on long pages

[O2sa]

The footer is not always positioned correctly.

Current behavior:

• On pages with little content → footer appears in the middle of the screen ❌
• On pages with long content → footer does not behave consistently ❌

Expected behavior:

• If the page content is short → footer should stick to the bottom of the screen ✅
• If the content is long → footer should move naturally with the page (scroll) ✅

Goal:
Make the footer always appear at the bottom of the viewport when content is small, and behave normally when content grows.

Tasks:

• Update layout structure to support proper footer positioning
• Ensure the footer is pushed to the bottom when content is short
• Ensure normal scrolling behavior when content is long
• Test on multiple screen sizes