[UI] Month badge text overflows on UK University Intake cards for longer month names (e.g., "September")

[jikrana1]

Describe the bug
On the UK page (/pages/uk.html), the "University Intake Dates" cards use a fixed-size red square badge to display the month name. Because the badge has fixed dimensions, longer month names like "September" overflow and get cut off at the right edge of the box. This is the exact same UI issue previously reported on the New Zealand page (Issue #164) and the Canada page.

Steps to reproduce

1. Navigate to the UK page (/pages/uk.html).
2. Scroll down to the "University Intake Dates" section.
3. Look at the month badge on the "Autumn Intake" card.
4. Notice the "September" text is getting clipped or overflowing outside the red box.

Expected behavior
The month badges on the UK page should automatically expand to accommodate the month name. The text must always be fully visible, perfectly centered, and stay on a single line without overflowing or getting clipped.

Actual behavior
The "September" badge overflows because it uses a fixed square size. This breaks the clean UI design across the UK page.

Suggested Fix
(Following the same fix applied to NZ and Canada pages)

• Replace the fixed width / height with width: auto and height: auto.
• Add CSS padding: 16px 24px to allow the badge to expand for longer text.
• Apply white-space: nowrap to prevent text wrapping.
• Apply flex-shrink: 0 to prevent squishing on mobile screens.

Screenshot

Acceptance Criteria

• The "September" badge must fit perfectly without any text clipping.
• Other month names like "January", "April", "December" should also fit perfectly.
• Badge should automatically resize based on the text length.
• Badges must remain responsive on desktop, tablet, and mobile.

[jikrana1]

Hi
please assign to me this issue
Thnak you!