Veltro

Technology buyers rarely convert from a polished headline alone. They want to understand the offer, find proof that the team can deliver, and see experience that matches their industry.

Veltro is built around that buying journey. Services explain the capability. Portfolio entries show the work. Case studies add the challenge, process, and outcome. Industry pages connect the same expertise to a buyer’s specific context. The result is a technology company website with a clear sales structure instead of disconnected landing pages.

By The Numbers

• 02 Homepage Layouts
• 35 Reusable Sections
• 14 Service Entries
• 09 Portfolio Entries
• 08 Industry Entries
• 06 Case Studies
• 3 Contact Form Providers

Sell The Capability, Then Prove It

Veltro gives each stage of the sales argument its own content type:

• Services define what the company can deliver, with dedicated detail pages for deeper evaluation.
• Portfolio presents selected work and supports category archives for faster browsing.
• Case studies structure the business problem, solution, process, features, and results.
• Industries organize sector-specific expertise so buyers can find relevant proof quickly.
• Team, awards, and testimonials support the trust layer behind the work.
• Pricing, FAQ, and contact give qualified visitors a direct path to the next conversation.

That content model is especially useful for agencies and consultancies with several capabilities, several buyer types, and a sales cycle that depends on evidence.

Two Homepages With Different Sales Narratives

The two routed homepages are different compositions, not a simple color or header swap.

Home 01 moves from positioning into services and portfolio work, then strengthens the pitch with solution steps, testimonials, customers, case studies, industries, contact, and recent articles. It suits a company that wants capabilities and proof to carry the homepage.

Home 02 uses roadmap and process content before services and portfolio, then adds video, awards, team, testimonials, and articles. It suits a company that wants to sell how the team works as strongly as what it delivers.

Both compositions use the same content architecture, so teams can choose the stronger narrative without rebuilding the rest of the site.

A Page System That Supports Growth

Veltro includes routed layouts for:

• Home and Home Two
• About and Awards
• Services and Service Single
• Portfolio, Portfolio Category, and Portfolio Single
• Case Studies and Case Study Single
• Industries and Industry Single
• Team and Team Single
• Careers and Career Single
• Blog, Blog Single, Blog Category, and Blog Tag
• Pricing, FAQ, Testimonials, Contact, Components, legal pages, and 404

Blog, portfolio, services, and case studies include pagination routes. Portfolio and blog also include taxonomy routes, giving a growing content library room to expand without changing the underlying page architecture.

Navigation Built For Complex Offers

The navigation is designed for a technology company with more to explain than five flat links.

• Grouped mega menu layouts for services and industries
• Standard links and multi-level dropdowns
• Menu badges and external-link handling
• Localized menu files for each language
• Configurable header action
• Side menu and optional offcanvas panel
• Footer link columns and legal navigation

The practical sales benefit is faster self-selection. A buyer can move directly to a relevant service, industry, or proof point instead of working through a generic company page first.

Content Architecture Developers Can Extend

Veltro uses Astro content collections rather than hardcoded page copy.

• Collection definitions and validation live in src/content.config.ts.
• Reusable section schemas live in src/sections.schema.ts.
• Editable section content lives in src/content/sections/<language>/.
• Route composition lives in src/pages/[...lang]/.
• Shared section components live in src/layouts/components/sections/.

Pages can override section content through named frontmatter blocks while the section components retain their shared defaults. This keeps routine content work in Markdown and MDX, while developers still have a predictable component and schema layer for deeper changes.

The source also includes architecture guidance for Cursor, GitHub Copilot, and Windsurf so generated edits can follow the theme’s component, content, schema, and Tailwind conventions.

Rebrand From A Small Set Of Files

The main project controls are separated by responsibility:

• src/config/config.toml for site identity, SEO defaults, forms, behavior, contact details, and localization
• src/config/menu.en.json and src/config/menu.fr.json for navigation
• src/config/fonts.json for font families and variants
• src/config/social.json for social profiles
• src/config/language.json for available languages
• src/styles/theme.css for Tailwind CSS 4 colors, type scales, breakpoints, radii, and surface tokens

[settings]
pagination = 6
stickyHeader = true
contactFormProvider = "formsubmit.co"

[settings.multilingual]
enable = true
defaultLanguage = "en"
showDefaultLangInUrl = false

This separation makes the theme faster to brand, easier to review in code, and cleaner to hand over to another developer or an internal marketing team.

Lead Capture Without A Form Rewrite

The contact layer supports three providers:

• formsubmit.co
• formspree
• netlify

The provider and endpoint are selected in config.toml. Form fields are defined in Markdown frontmatter and support text, email, textarea, select, searchable select, radio, checkbox, and status-note entries.

A Mailchimp subscription component is included for layouts that render it. That gives teams a quick starting point for contact and newsletter capture while keeping provider-specific logic out of the page content.

English and French From the Same Architecture

English and French content, menus, shared labels, and routes are included. English uses unprefixed URLs by default, while French uses /fr/.

The project includes commands to remove the multilingual files for a single-language launch or regenerate the multilingual structure later:

npm run remove-multilingual
npm run generate-multilingual-content

Modern Static Foundation

• Astro 7.1.3
• Tailwind CSS 4.3.3
• Static Astro output
• Schema-validated Markdown and MDX content
• Astro image optimization
• Sitemap, robots.txt, canonical, Open Graph, Twitter card, and JSON-LD support
• Draft-page sitemap cleanup during production builds
• Preline navigation and form widgets
• Swiper sliders
• Lenis smooth scrolling with reduced-motion handling
• AOS-marked motion, counters, and an optional cursor follower
• Cloudflare Pages deployment command and static dist/ output

The required runtime is Node.js 22.12.0 or later. Development, checking, testing, building, previewing, and deployment are exposed through npm scripts.

Choose Veltro When

Choose Veltro when the website must do more than announce a product or list services. It is strongest when the sales story needs several connected layers: capability, relevant work, detailed proof, industry context, company credibility, and a clear route to contact.

For a small one-page launch, it is more structure than necessary. For a software company, IT solutions provider, product studio, or digital agency with a growing offer and real work to organize, the deeper structure is the point.