Responsive blog preview card using Flexbox and custom fonts

What are you most proud of, and what would you do differently next time?

I’m proud of having implemented a clean, responsive card layout using only HTML and CSS without relying on external frameworks. I also successfully used @font-face to load local fonts and applied subtle hover effects to make the component more interactive.
Next time, I would experiment with CSS Grid for the layout and focus more on creating a fluid design that adapts to different screen sizes without using fixed heights.

What challenges did you encounter, and how did you overcome them?

One of the main challenges was making the design responsive for smaller devices while maintaining good spacing and proportions. I overcame this by:

• Using media queries to adjust font sizes and layout.
• Applying Flexbox for alignment and spacing.
• Testing frequently in mobile and desktop views.

Another small issue was with image scaling, which I solved by applying the object-fit: cover property.

What specific areas of your project would you like help with?

I would like feedback on:

• Improving accessibility (ARIA attributes, semantic structure).
• Making the card layout more scalable for future use in a multi-card grid.
• Suggestions for optimizing the CSS for cleaner and more reusable code.