Portfolio de Serviços
A high-end industrial and corporate portfolio style guide featuring a 'Porto de Itapoá' aesthetic. Characterized by a sophisticated forest green color palette (#007651), heavy uppercase typography, and immersive image cards. The design uses a clean white backdrop with minimalist accents, focusing on logistics, supply chain, and professional services. Key features include grayscale-to-color hover transitions, slide-up micro-interactions, and a structured bento-style grid for service presentation. Suitable for industrial, fintech, maritime, and large-scale enterprise websites.
Summary
A clean, authoritative corporate portfolio design utilizing a deep green and white palette, bold uppercase headings, and interactive image-based service cards with smooth reveal animations.
Style
The style is built on 'Open Sans' with an emphasis on extreme font weights (Black/800). The color palette is dominated by #007651 (Primary Green), #022C22 (Deep Dark Green), and #F0FAF5 (Mint Accent). Animations use a standard cubic-bezier(0.4, 0, 0.2, 1) for a high-end, responsive feel. Imagery starts as grayscale and transitions to full color on hover, accompanied by a deepening of the green overlay.
Layout & Structure
A structured section consisting of an asymmetrical header followed by a multi-column responsive grid. The layout prioritizes readability and visual impact through large vertical padding (128px) and wide gutters.
Section Container
Header Section
Services Grid
Components
Interactive Service Card
A 450px high card with an image background and an animated text overlay.
Special Notes
MUST use 'Open Sans' for all typography to maintain the corporate look. MUST ensure the grayscale filter on images is exactly 100% until hovered. MUST maintain the 32px left padding on the intro paragraph to create the 'asymmetric' alignment look. DO NOT use rounded corners; the aesthetic depends on sharp, 90-degree angles for a professional, industrial feel.