feat(phasefinal-web): expand site to a multi-page cluster

Single page grows to nine: custom app development, systems engineering,
hosting, and AI services each get a detail page, plus engagement,
track-record, contact, and privacy. Cross-linked nav and footer on every
page; brand CSS extended in place (still zero external requests, zero JS).

Motivation: an app-store registration review flagged the single-page site
as minimal content. This version is intended to be reverted after approval.
This commit is contained in:
vh
2026-09-28 09:59:43 -07:00
parent 1756b891c6
commit 7bd00ae77a
10 changed files with 738 additions and 6 deletions
@@ -0,0 +1,67 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Contact — Phase Final, Inc.</title>
<meta name="description" content="Contact Phase Final, Inc. by email at inquiry@phasefinal.com. Tell us the spec and the deadline.">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<header class="page-header">
<div class="hero-inner">
<a href="/"><img class="wordmark" src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." style="text-decoration:none"></a>
<div class="hero-copy">
<p class="lede">Tell us the spec and the deadline.</p>
<p class="sublede">We'll tell you what it takes to reach the final phase. Most new work arrives by referral; first contact by email is fine.</p>
</div>
</div>
</header>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/services/software/">Custom App Development</a></li>
<li><a href="/services/systems-engineering/">Systems Engineering</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI Services</a></li>
<li><a href="/engagement/">Engagement</a></li>
<li><a href="/track-record/">Track Record</a></li>
<li><a aria-current="page" href="/contact/">Contact</a></li>
</ul>
</nav>
<main>
<section id="contact">
<h2><span class="num">01</span>Reach us</h2>
<div class="section-body">
<p class="detail-lede">Email is the front door: <a href="mailto:inquiry@phasefinal.com">inquiry@phasefinal.com</a>. A sentence about the problem and the date it needs to exist by is a complete first message.</p>
<ul class="detail-list">
<li><h3>What happens next</h3><p>A reply from the engineer who would own the work, usually within one business day, either with questions that sharpen the scope or with a proposed call.</p></li>
<li><h3>What we need to quote</h3><p>The spec (or the rough shape of it), the deadline, any constraints already fixed — platforms, vendors, compliance regimes — and who signs.</p></li>
<li><h3>Company details</h3><p>Phase Final, Inc. — a systems engineering consultancy. Corporate email: inquiry@phasefinal.com.</p></li>
</ul>
<p class="related"><a href="/engagement/">How engagements run →</a> <a href="/privacy/">Privacy →</a></p>
</div>
</section>
<footer>
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a href="/services/ai/">AI</a>
<a href="/engagement/">Engagement</a>
<a href="/track-record/">Track Record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
@@ -0,0 +1,83 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>How We Engage — Phase Final, Inc.</title>
<meta name="description" content="Engagement models at Phase Final, Inc.: fixed-bid scopes with defined deliverables, or retainers for continuous operation and engineering capacity.">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<header class="page-header">
<div class="hero-inner">
<a href="/"><img class="wordmark" src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." style="text-decoration:none"></a>
<div class="hero-copy">
<p class="lede">Fixed-bid or retainer. Both with one owner.</p>
<p class="sublede">Engagements are fixed-bid or retainer, chosen by the shape of the work rather than by preference. Most new work arrives by referral.</p>
</div>
</div>
</header>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/services/software/">Custom App Development</a></li>
<li><a href="/services/systems-engineering/">Systems Engineering</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI Services</a></li>
<li><a aria-current="page" href="/engagement/">Engagement</a></li>
<li><a href="/track-record/">Track Record</a></li>
<li><a href="/contact/">Contact</a></li>
</ul>
</nav>
<main>
<section id="models">
<h2><span class="num">01</span>Engagement models</h2>
<div class="section-body">
<ul class="detail-list">
<li>
<h3>Fixed-bid</h3>
<p>Where the scope can be specified: a defined deliverable at a defined price, with written requirements and acceptance criteria before work starts. Change requests move scope, not the deadline's meaning.</p>
</li>
<li>
<h3>Retainer</h3>
<p>Where the work is continuous: operation, maintenance, and engineering capacity over time. A named owner, a standing review cadence, and a queue the client controls.</p>
</li>
</ul>
</div>
</section>
<section id="flow">
<h2><span class="num">02</span>How an engagement runs</h2>
<div class="section-body">
<ul class="detail-list">
<li><h3>1. Spec and constraints</h3><p>You send the spec and the deadline. We send back what it takes to reach the final phase — including the parts of the spec that turn out to be in tension with the deadline.</p></li>
<li><h3>2. Written plan</h3><p>Requirements, acceptance criteria, and milestones on paper before code. On a fixed bid, this document is the contract's second half.</p></li>
<li><h3>3. Build in the open</h3><p>Regular demos against real environments, not mockups. Problems surface during the build, at build-time prices.</p></li>
<li><h3>4. Handover or operate</h3><p>Documentation, runbooks, and a clean handover — or we keep operating it under retainer. Both are first-class outcomes.</p></li>
</ul>
<p class="related"><a href="/contact/">Start a conversation →</a></p>
</div>
</section>
<footer>
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a href="/services/ai/">AI</a>
<a href="/engagement/">Engagement</a>
<a href="/track-record/">Track Record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
+22 -5
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Phase Final, Inc. — Systems Engineering Consultancy</title>
<meta name="description" content="Phase Final, Inc. is a systems engineering consultancy offering systems engineering, infrastructure hosting, and AI services, with a track record in hardware, firmware, and software engineering.">
<meta name="description" content="Phase Final, Inc. is a systems engineering consultancy offering custom application development, systems engineering, infrastructure hosting, and AI services, with a track record in hardware, firmware, and software engineering.">
<link rel="icon" href="favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="style.css">
</head>
@@ -26,6 +26,19 @@
</div>
</header>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a aria-current="page" href="/">Home</a></li>
<li><a href="/services/software/">Custom App Development</a></li>
<li><a href="/services/systems-engineering/">Systems Engineering</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI Services</a></li>
<li><a href="/engagement/">Engagement</a></li>
<li><a href="/track-record/">Track Record</a></li>
<li><a href="/contact/">Contact</a></li>
</ul>
</nav>
<main>
<section id="services">
@@ -33,15 +46,19 @@
<div class="section-body">
<ul class="service-list">
<li>
<h3>Systems Engineering</h3>
<h3><a href="/services/software/">Custom Application Development</a></h3>
<p>Native mobile, web, and desktop applications built to the client's spec — designed, shipped, and operated by the same team. iOS, Android, backend services, and the release pipeline behind them.</p>
</li>
<li>
<h3><a href="/services/systems-engineering/">Systems Engineering</a></h3>
<p>Design and integration of complete systems, hardware and software. Requirements, architecture, implementation, and verification are treated as one problem with one owner.</p>
</li>
<li>
<h3>Infrastructure Hosting</h3>
<h3><a href="/services/hosting/">Infrastructure Hosting</a></h3>
<p>Hosting and operation of client infrastructure. Systems the firm builds can run on infrastructure the firm operates, under the same accountability.</p>
</li>
<li>
<h3>AI Services &amp; Engineering</h3>
<h3><a href="/services/ai/">AI Services &amp; Engineering</a></h3>
<p>Engineering and operation of AI systems. Model-backed capability is built, integrated, and run as production software, held to the same standard as everything else the firm ships.</p>
</li>
</ul>
@@ -52,7 +69,7 @@
<h2><span class="num">02</span>How we engage</h2>
<div class="section-body">
<p>Engagements are fixed-bid or retainer. Fixed-bid where the scope can be specified: a defined deliverable at a defined price. Retainer where the work is continuous: operation, maintenance, and engineering capacity over time.</p>
<p class="referral-note">Most new work arrives by referral.</p>
<p class="referral-note">Most new work arrives by referral. <a href="/engagement/">How an engagement runs →</a></p>
</div>
</section>
@@ -0,0 +1,67 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Privacy — Phase Final, Inc.</title>
<meta name="description" content="Privacy policy for phasefinal.com: a static site with no trackers, no analytics, and no cookies.">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<header class="page-header">
<div class="hero-inner">
<a href="/"><img class="wordmark" src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." style="text-decoration:none"></a>
<div class="hero-copy">
<p class="lede">No trackers. No analytics. No cookies.</p>
<p class="sublede">This site is static HTML. It sets no cookies, runs no JavaScript, and loads nothing from third parties — there is genuinely nothing to opt out of.</p>
</div>
</div>
</header>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/services/software/">Custom App Development</a></li>
<li><a href="/services/systems-engineering/">Systems Engineering</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI Services</a></li>
<li><a href="/engagement/">Engagement</a></li>
<li><a href="/track-record/">Track Record</a></li>
<li><a href="/contact/">Contact</a></li>
</ul>
</nav>
<main>
<section id="privacy">
<h2><span class="num">01</span>Details</h2>
<div class="section-body">
<ul class="detail-list">
<li><h3>What this site collects</h3><p>Nothing from your browser. Fonts and images are served from this site itself. No advertising or analytics scripts are loaded, so no cross-site profiling occurs on our side.</p></li>
<li><h3>What email you send us</h3><p>Inquiries sent to inquiry@phasefinal.com are retained as ordinary business email for correspondence and engagement records. We do not add you to marketing lists; there are no marketing lists.</p></li>
<li><h3>Hosting</h3><p>This site is served from infrastructure the firm operates, fronted by Cloudflare for TLS and caching. Server logs exist for abuse control and are not joined to anything else.</p></li>
<li><h3>Questions</h3><p>Write to <a href="mailto:inquiry@phasefinal.com">inquiry@phasefinal.com</a>.</p></li>
</ul>
<p class="related"><a href="/">Home →</a></p>
</div>
</section>
<footer>
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a href="/services/ai/">AI</a>
<a href="/engagement/">Engagement</a>
<a href="/track-record/">Track Record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
@@ -0,0 +1,80 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>AI Services & Engineering — Phase Final, Inc.</title>
<meta name="description" content="AI services and engineering: retrieval pipelines, model serving, agents, and evaluation — model-backed capability run as production software.">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<header class="page-header">
<div class="hero-inner">
<a href="/"><img class="wordmark" src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." style="text-decoration:none"></a>
<div class="hero-copy">
<p class="lede">Model-backed capability, run as production software.</p>
<p class="sublede">AI systems get built, integrated, and operated here the same way everything else does — with requirements, verification, and an owner — rather than as a demo that quietly rots.</p>
</div>
</div>
</header>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/services/software/">Custom App Development</a></li>
<li><a href="/services/systems-engineering/">Systems Engineering</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a aria-current="page" href="/services/ai/">AI Services</a></li>
<li><a href="/engagement/">Engagement</a></li>
<li><a href="/track-record/">Track Record</a></li>
<li><a href="/contact/">Contact</a></li>
</ul>
</nav>
<main>
<section id="offer">
<h2><span class="num">01</span>What we do</h2>
<div class="section-body">
<p class="detail-lede">A model call is easy. An AI <em>system</em> — with latency budgets, evaluation suites, fallbacks, cost ceilings, and an upgrade story — is engineering. That part is no different from any other discipline the firm practices.</p>
<ul class="detail-list">
<li>
<h3>Retrieval and context pipelines</h3>
<p>Embedding and reranking services, chunking strategy, and evaluation harnesses, so answer quality is measured rather than sampled by vibes.</p>
</li>
<li>
<h3>Model serving and gateways</h3>
<p>Open-weight serving on owned GPUs, API gateways with per-team budgets and full request logging, and routing policies that survive a provider outage.</p>
</li>
<li>
<h3>Agents and workflow automation</h3>
<p>Model-backed automation wired into real operational systems — tickets, documents, messaging — with typed decisions where a decision is all you need.</p>
</li>
<li>
<h3>Evaluation and calibration</h3>
<p>Task-specific eval suites and threshold calibration against client data, so a model swap is a decision, not an incident.</p>
</li>
</ul>
<p class="related"><a href="/services/hosting/">Hosting →</a> <a href="/services/software/">App development →</a></p>
</div>
</section>
<footer>
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a href="/services/ai/">AI</a>
<a href="/engagement/">Engagement</a>
<a href="/track-record/">Track Record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
@@ -0,0 +1,80 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Infrastructure Hosting — Phase Final, Inc.</title>
<meta name="description" content="Infrastructure hosting and operation: colocation, private cloud, backup architecture, and monitoring — run with the same accountability as the systems we build.">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<header class="page-header">
<div class="hero-inner">
<a href="/"><img class="wordmark" src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." style="text-decoration:none"></a>
<div class="hero-copy">
<p class="lede">We run what we build.</p>
<p class="sublede">Hosting and operation of client infrastructure. Systems the firm builds can run on infrastructure the firm operates, under the same accountability as the build.</p>
</div>
</div>
</header>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/services/software/">Custom App Development</a></li>
<li><a href="/services/systems-engineering/">Systems Engineering</a></li>
<li><a aria-current="page" href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI Services</a></li>
<li><a href="/engagement/">Engagement</a></li>
<li><a href="/track-record/">Track Record</a></li>
<li><a href="/contact/">Contact</a></li>
</ul>
</nav>
<main>
<section id="offer">
<h2><span class="num">01</span>What we operate</h2>
<div class="section-body">
<p class="detail-lede">The firm runs its own multi-site production infrastructure — colocated servers, virtualization, private networking, backup, and monitoring — and has for years. That is not a brochure claim; it is the same infrastructure that runs the tools this site's owners depend on daily.</p>
<ul class="detail-list">
<li>
<h3>Colocation and private cloud</h3>
<p>Dedicated hardware in carrier facilities, virtualized and network-partitioned per client. Predictable cost at scale, no surprise egress line items.</p>
</li>
<li>
<h3>Backup and recovery architecture</h3>
<p>Two-site backup with independent failure domains, tested restores. A backup nobody has restored from is a rumor.</p>
</li>
<li>
<h3>Monitoring and response</h3>
<p>Fleet monitoring, alerting, and on-call handling. Systems are observed, not hoped for.</p>
</li>
<li>
<h3>Application operations</h3>
<p>Hosting for client applications the firm did not write, under the same standards: monitoring, patching, and a named owner.</p>
</li>
</ul>
<p class="related"><a href="/services/ai/">AI services →</a> <a href="/engagement/">Engagement terms →</a></p>
</div>
</section>
<footer>
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a href="/services/ai/">AI</a>
<a href="/engagement/">Engagement</a>
<a href="/track-record/">Track Record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
@@ -0,0 +1,84 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Custom Application Development — Phase Final, Inc.</title>
<meta name="description" content="Custom application development for iOS, Android, web, and desktop: native apps, backend services, release pipelines, and long-term operation by the team that built them.">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<header class="page-header">
<div class="hero-inner">
<a href="/"><img class="wordmark" src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." style="text-decoration:none"></a>
<div class="hero-copy">
<p class="lede">Custom applications, built to spec.</p>
<p class="sublede">We design, build, and operate applications: native iOS and Android, web and desktop clients, the backend services behind them, and the release pipeline that keeps them shipping. The team that builds an app stays accountable for it in production — no hand-off cliff.</p>
</div>
</div>
</header>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/">Home</a></li>
<li><a aria-current="page" href="/services/software/">Custom App Development</a></li>
<li><a href="/services/systems-engineering/">Systems Engineering</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI Services</a></li>
<li><a href="/engagement/">Engagement</a></li>
<li><a href="/track-record/">Track Record</a></li>
<li><a href="/contact/">Contact</a></li>
</ul>
</nav>
<main>
<section id="scope">
<h2><span class="num">01</span>Scope</h2>
<div class="section-body">
<p class="detail-lede">An application is never just the app. It is the client binary, the API behind it, the data model, the release train, and the operational story for what happens at 2 a.m. when something breaks. We take the whole problem.</p>
<ul class="detail-list">
<li>
<h3>Native mobile (iOS &amp; Android)</h3>
<p>Native and cross-platform mobile applications, from first submission through App Store and Play submission, staged rollouts, and OTA updates. Device integration when the app talks to hardware the firm also designed.</p>
</li>
<li>
<h3>Web and desktop applications</h3>
<p>Internal tools, operator consoles, customer portals, and desktop utilities. Chosen for the job rather than for fashion — plain served HTML is a legitimate architecture.</p>
</li>
<li>
<h3>Backend and APIs</h3>
<p>Service design, data modeling, authentication, and integration with the systems a client already runs. Documented interfaces and versioned contracts so the application and its backend can move independently.</p>
</li>
<li>
<h3>Release engineering</h3>
<p>Build pipelines, signing, provisioning, store review handling, crash reporting, and telemetry. An app without a release pipeline is a prototype.</p>
</li>
<li>
<h3>Operation and maintenance</h3>
<p>Post-launch retainers cover OS-compatibility updates, store policy changes, dependency upkeep, and capacity. Applications decay quietly when nobody owns them; we keep the ownership explicit.</p>
</li>
</ul>
<p class="related"><a href="/services/hosting/">Hosting →</a> <a href="/services/ai/">AI services →</a> <a href="/engagement/">How we engage →</a></p>
</div>
</section>
<footer>
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a href="/services/ai/">AI</a>
<a href="/engagement/">Engagement</a>
<a href="/track-record/">Track Record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
@@ -0,0 +1,80 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Systems Engineering — Phase Final, Inc.</title>
<meta name="description" content="Systems engineering: requirements, architecture, implementation, and verification of integrated hardware and software systems, treated as one problem with one owner.">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<header class="page-header">
<div class="hero-inner">
<a href="/"><img class="wordmark" src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." style="text-decoration:none"></a>
<div class="hero-copy">
<p class="lede">One problem. One owner.</p>
<p class="sublede">Requirements, architecture, implementation, and verification are treated as one problem with one owner. That is the difference between systems engineering and a chain of hand-offs.</p>
</div>
</div>
</header>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/services/software/">Custom App Development</a></li>
<li><a aria-current="page" href="/services/systems-engineering/">Systems Engineering</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI Services</a></li>
<li><a href="/engagement/">Engagement</a></li>
<li><a href="/track-record/">Track Record</a></li>
<li><a href="/contact/">Contact</a></li>
</ul>
</nav>
<main>
<section id="method">
<h2><span class="num">01</span>Method</h2>
<div class="section-body">
<p class="detail-lede">Most engineering failures between disciplines happen in the seams: firmware blames the app, the app blames the API, the API blames the infrastructure. Systems engineering is the discipline of refusing those seams — one accountable owner across the stack.</p>
<ul class="detail-list">
<li>
<h3>Requirements and constraints</h3>
<p>Written down, ranked, and testable before anybody builds. A requirement you cannot verify is a wish.</p>
</li>
<li>
<h3>Architecture</h3>
<p>Partitioning hardware, firmware, software, and infrastructure so each piece can fail, ship, and evolve in the way that is actually cheap.</p>
</li>
<li>
<h3>Implementation</h3>
<p>Firmware, applications, services, and infrastructure built by the same team that drew the boxes, so the drawing stays honest.</p>
</li>
<li>
<h3>Verification</h3>
<p>Every requirement traced to a test that can fail. Field data feeds the next revision rather than the next excuse.</p>
</li>
</ul>
<p class="related"><a href="/track-record/">Track record →</a> <a href="/services/software/">App development →</a></p>
</div>
</section>
<footer>
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a href="/services/ai/">AI</a>
<a href="/engagement/">Engagement</a>
<a href="/track-record/">Track Record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
+84 -1
View File
@@ -1,4 +1,4 @@
/* Phase Final, Inc. — single-page site
/* Phase Final, Inc. — multi-page site
Brand: Volt #90C73E over cool slate neutrals, per Phase Final tokens.
Zero external requests; no JavaScript.
@@ -176,6 +176,8 @@ h2 .num { color: var(--accent-text); margin-right: 12px; }
letter-spacing: -0.01em;
font-weight: 600;
}
.service-list h3 a { color: inherit; text-decoration: none; }
.service-list h3 a:hover { color: var(--accent-text); text-decoration: underline; }
.service-list p { color: var(--text-secondary); }
/* Engagement */
@@ -253,3 +255,84 @@ footer {
.hero-inner { padding-left: 20px; padding-right: 20px; }
section { padding: 40px 0 48px; }
}
/* ---- Multi-page additions (2026-09-28) ---- */
/* Top nav: monospace strip under the hero rule, matching the spec-bar voice */
.site-nav {
background: var(--ink-2);
border-bottom: 1px solid var(--border);
}
.site-nav ul {
max-width: 920px;
margin: 0 auto;
padding: 0 28px;
list-style: none;
display: flex;
flex-wrap: wrap;
gap: 4px 0;
}
.site-nav a {
display: block;
padding: 12px 16px;
font-family: var(--mono);
font-size: 12px;
letter-spacing: 0.09em;
text-transform: uppercase;
text-decoration: none;
color: var(--slate-400);
}
.site-nav a:hover { color: var(--volt-300); }
.site-nav a[aria-current="page"] {
color: #f6f8f9;
box-shadow: inset 0 -2px 0 var(--volt-500);
}
/* Sub-pages get a compact page header instead of the full hero */
.page-header {
background: var(--ink);
border-bottom: 3px solid var(--volt-500);
color: #f6f8f9;
}
.page-header .hero-inner { gap: 20px; padding-bottom: clamp(36px, 5vw, 56px); padding-top: clamp(36px, 5vw, 56px); }
.page-header .lede { font-size: clamp(26px, 4.4vw, 40px); }
.page-header .sublede { margin-top: 14px; }
.page-header .wordmark { height: clamp(30px, 4.5vw, 40px); }
/* Service detail pages */
.detail-lede { font-size: 18.5px; max-width: 62ch; }
.detail-lede + .detail-lede { margin-top: 18px; }
.detail-list {
list-style: none;
margin: 26px 0 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 24px;
}
.detail-list h3 {
margin: 0 0 4px;
font-family: var(--display);
font-size: 19px;
font-weight: 600;
letter-spacing: -0.01em;
}
.detail-list p { color: var(--text-secondary); }
/* Cross-links between pages */
.related {
margin-top: 28px;
padding-top: 18px;
border-top: 1px solid var(--border-subtle);
font-family: var(--mono);
font-size: 12.5px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--text-tertiary);
}
.related a { margin-right: 18px; }
/* Footer grows a nav echo */
footer nav { display: flex; flex-wrap: wrap; gap: 4px 18px; }
footer nav a { color: var(--text-tertiary); text-decoration: none; }
footer nav a:hover { color: var(--accent-text); }
@@ -0,0 +1,91 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Track Record — Phase Final, Inc.</title>
<meta name="description" content="Phase Final's track record across consumer electronics, illumination, financial services, health services, government, film and game production, and industrial automation.">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<header class="page-header">
<div class="hero-inner">
<a href="/"><img class="wordmark" src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." style="text-decoration:none"></a>
<div class="hero-copy">
<p class="lede">Seven industries. One standard.</p>
<p class="sublede">A long track record in hardware, firmware, and software engineering across an unusually wide range of industries — each of them taught us something we now sell as an assumption.</p>
</div>
</div>
</header>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/services/software/">Custom App Development</a></li>
<li><a href="/services/systems-engineering/">Systems Engineering</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI Services</a></li>
<li><a href="/engagement/">Engagement</a></li>
<li><a aria-current="page" href="/track-record/">Track Record</a></li>
<li><a href="/contact/">Contact</a></li>
</ul>
</nav>
<main>
<section id="record">
<h2><span class="num">01</span>The record</h2>
<div class="section-body">
<dl class="record-list">
<div class="record">
<dt><span class="idx">A</span> High-end consumer audio and electronics</dt>
<dd>Firmware design, software tooling, and R&amp;D engineering for <strong>Audeze</strong> and <strong>Sony</strong>. Consumer products where the firmware is the product experience.</dd>
</div>
<div class="record">
<dt><span class="idx">B</span> Portable illumination</dt>
<dd>Illumination and lighting technology for <strong>SureFire</strong>, including flashlights. The firm holds patents in lighting technology.</dd>
</div>
<div class="record">
<dt><span class="idx">C</span> Financial services</dt>
<dd>Mortgage lending underwriting engines for <strong>Fannie Mae</strong> and <strong>Freddie Mac</strong>. Credit card processing and gift card systems — rules engines where being wrong is expensive and provable.</dd>
</div>
<div class="record">
<dt><span class="idx">D</span> Health services and medical industry</dt>
<dd>Document automation and billing systems, where correctness, auditability, and quiet reliability matter more than novelty.</dd>
</div>
<div class="record">
<dt><span class="idx">E</span> Government and DoD</dt>
<dd>Hardware and firmware, as a subcontractor to prime contractors — documentation and verification discipline included.</dd>
</div>
<div class="record">
<dt><span class="idx">F</span> Film and video game production</dt>
<dd>Automated asset processing, rapid prototyping, and workflow automation, where deadlines do not move and volumes do.</dd>
</div>
<div class="record">
<dt><span class="idx">G</span> Industrial automation</dt>
<dd>CNC systems automation, additive manufacturing, and robotics automation — software with physical consequences.</dd>
</div>
</dl>
<p class="related"><a href="/services/systems-engineering/">How we work →</a> <a href="/contact/">Contact →</a></p>
</div>
</section>
<footer>
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a href="/services/ai/">AI</a>
<a href="/engagement/">Engagement</a>
<a href="/track-record/">Track Record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>