fix: resolve uneven margin caused by card flex overflow

[Iam-Karan-Suresh]

What was fixed

I fixed an uneven margin issue on this page which was causing visual misalignment.

The Explore Blueprints carousel showed uneven right-side spacing and card misalignment after navigating with the arrow buttons, especially on smaller screen sizes.

Root cause

The carousel scroll distance was hardcoded, causing cards to overshoot the visible area. In addition, horizontal padding and implicit margins contributed to the appearance of extra space on the right.

Solution

• Fixed the margin around the cards with responsive
• Replaced fixed scroll values with a dynamic scroll calculation based on actual card width and gap
• Added scroll snapping to ensure cards align cleanly after navigation
• Removed unintended horizontal padding from container sections
• Explicitly reset carousel margins to prevent layout overflow

Result

• Cards remain properly aligned
• No extra right-side spacing or horizontal overflow
• Improved responsive behavior and visual consistency

Screenshots

Screen Record

Screencast.from.2026-01-12.23-08-18.mp4