fix(hero): Social icons container overlaps with the role description text on wide viewports

[bartosz-korec]

Description

In the Hero.astro component, the floating social icons container (Email, LinkedIn, GitHub, etc.) breaks layout flow and overlaps with the role description text ("Senior Software Engineer") under specific scaling conditions on wide viewports (tested at 1920px width).

Steps to Reproduce

1. Open the portfolio template.
2. Set the viewport width to 1920px with a Device Pixel Ratio (DPR) of 1.25 (simulating high UI scaling).
3. Observe the social media SVG icons container at the bottom left of the hero section.

Expected Behavior

Social icons should have a fixed or adaptive vertical safety margin below the main text container, flowing naturally without overlapping typography bounds.

Actual Behavior

The absolute-positioned social icon container sits directly on top of the text string, rendering the description unreadable.

Proposed Solution

1. Change the main hero section wrapper property from a rigid viewport-bound height (md:h-screen) to a minimum height constraint (min-h-screen) to accommodate expanding text fields.
2. Remove the absolute bottom-0 positioning rule from the social icons bar wrapper, placing it directly inside the normal document flow below the role description <p> element with an appropriate margin (mt-8 sm:mt-10).