A little less ordinary.

Build a responsive portfolio landing page for an independent design studio called folio, using React and CSS. Visual direction: expressive Swiss editorial design, cornflower blue (#79a2f0), deep navy (#203b67), and cool white (#f5f9ff). Avoid gradients and generic feature-card grids.

LAYOUT: Use a small wordmark at the top left and Work, About, and Contact links at the right. Give the hero generous whitespace. Set the headline “A little less ordinary.” in very large, tightly tracked sans-serif type, taking up most of the left two-thirds. Place a large eight-point abstract asterisk on the right. Below the headline, include a short studio description and a circular arrow link to the work section. Add a thin bottom rule and a small “Independent minds. Distinctive digital experiences.” caption.

NEXT SECTION: Show three selected projects in an asymmetric editorial grid. Each project needs a descriptive image alternative, title, discipline, and year. Use original geometric artwork as placeholders and label it as illustrative.

BEHAVIOR: The Work link scrolls to the projects. Contact opens a clearly labeled contact section. All links need visible focus states. Use subtle 180ms hover transitions and respect prefers-reduced-motion. On mobile, stack the hero, reduce the headline to clamp(3rem, 14vw, 5rem), keep navigation accessible, and prevent horizontal overflow. Use semantic headings and maintain readable color contrast.