# 60 Industrial Capability **Philosophy and fit.** Make technical fit more useful than marketing language. Built for manufacturing, machine shop, fabrication, b2b supplier. The visitor’s next step is to request a quote. **Visual grammar.** Use a dark technical catalogue with lime datum marks and specification grids. Preserve the hierarchy of material capabilities, tolerance tables, process sequence, rfq; these patterns solve this business’s actual decision, rather than supplying interchangeable decoration. **Sample and interaction.** AXIS / Precision Works is a fictional demonstration. The entry page establishes a complete visual direction, with build an rfq and manufacturing process as supporting states. Inputs use local deterministic fixtures; no request, order, application or payment is sent. **Responsive behaviour.** On a phone, keep the primary decision first, stack facts with explicit labels, preserve the order of the workflow, and provide comfortably sized controls. Wide diagrams scale; tabular facts retain their labels. **Adaptation.** Replace the fictional brand, prices, availability, qualifications and claims with verified client information. Preserve material capabilities, tolerance tables, process sequence. Use imagery to explain the place, people, work or product, with deliberate crops and honest captions. Do not turn this into a generic hero-and-card layout. ## Commercial and content patterns - Material capabilities - Tolerance tables - Process sequence - RFQ ## Routes - Entry: /preview/60-industrial-capability/start - Build an RFQ: /preview/60-industrial-capability/rfq - Manufacturing process: /preview/60-industrial-capability/process ## Reference and adaptation - Page scope: Technical catalogue. - Distinct composition: dark technical catalogue with lime datum marks and specification grids. - Typography: IBM Plex Mono / DM Sans. - Tokens: page #202a2b, ink #eef3e8, accent #cfec91. - Make technical fit visible before asking for a quote. Machine envelopes, quantities, tolerances and revision fields form an engineering catalogue, with an RFQ summary rather than a shopping cart. - Use the native inputs and labelled states in Demo.vue as interaction references. Replace local fixtures with real validation, availability and backend behaviour in the destination application. ## Assets All brands and fixture data are fictional. Original SVG diagrams are source-native. Commercial photos are illustrative and are documented in [asset provenance](../../../docs/COMMERCIAL_ASSETS.md); do not present them as evidence of a real business or rename a stock subject as actual staff. See the public commercial asset manifest for URLs, checksums and cropping guidance.