vh/esh-pfi-infrastructure
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(phasefinal-web): clean up the multi-page site

Browse Source 
The 2026-09-28 expansion grew the one-page design to nine pages by
bolting a nav band under each hero. This makes the cluster one site:
- One site header on every page: the wordmark (home link) and a single
  row of short, consistent labels (Applications, Systems, Hosting, AI,
  Engagement, Track record, Contact). The nav no longer wraps into two
  rows at desktop width or four on a phone.
- A real <h1> on every page (the title was a <p>), a skip link, and one
  footer outside <main> on every page, home included.
- The contact page was unreadable: its section borrowed the home page's
  dark contact-card id, so its copy was grey on near-black (2.3:1) and
  its headings measured 1.0:1. It is an ordinary section now.
- Section numbers only where there is a sequence (home, engagement).
- The spec bar names all four services; it stacks cleanly on a phone.
- Contrast: --text-tertiary 4.3:1 -> 4.96:1, --accent-text 4.36:1 ->
  4.74:1 on paper. Track-record labels drop tracked capitals.
- The grid behind the hero and the contact card is its own layer; the
  contact card loses its left side-tab stripe.
- The stylesheet link is versioned (style.css?v=2026-09-28): CSS is
  cached for an hour, and the new markup must not meet the old styles.
- README: nine pages, the shared structure, the CSS-version rule, and the
  operator's anti-slop waivers (the hero's volt rule, Space Grotesk).

Copy is unchanged apart from nav labels (the brief's legal constraints
hold). Still zero JavaScript and zero external requests. Impeccable
detector (controls 7/0, static + rendered at 1280 and 390, light and
dark): 200 unwaived -> 54, all of them the two waived brand devices;
two identical runs. Operator: "ship the site cleanup, keep the rule and
the font".
This commit is contained in:
vh
2026-09-28 16:29:02 -07:00
parent 2296fbba12
commit 85f8a3a072
11 changed files with 378 additions and 278 deletions
Download Patch File Download Diff File Expand all files Collapse all files
stacks/phasefinal-web/conf/site/services/ai/index.html
+29 -24
View File
@@ -3,40 +3,45 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#0f1318">
<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">
<link rel="stylesheet" href="/style.css?v=2026-09-28">
</head>
<body>
<a class="skip" href="#main">Skip to content</a>
<header class="site-header">
<div class="site-header-inner">
<a class="brand" href="/"><img src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." width="98" height="28"></a>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/services/software/">Applications</a></li>
<li><a href="/services/systems-engineering/">Systems</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a aria-current="page" href="/services/ai/">AI</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>
</div>
</header>
<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>
<h1 class="lede">Model-backed capability, run as production software.</h1>
<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>
<main id="main">
<section id="offer">
<h2><span class="num">01</span>What we do</h2>
<h2>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">
@@ -61,20 +66,20 @@
</div>
</section>
<footer>
</main>
<footer class="site-footer">
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/software/">Applications</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a href="/services/ai/">AI</a>
<a aria-current="page" href="/services/ai/">AI</a>
<a href="/engagement/">Engagement</a>
<a href="/track-record/">Track Record</a>
<a href="/track-record/">Track record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
stacks/phasefinal-web/conf/site/services/hosting/index.html
+29 -24
View File
@@ -3,40 +3,45 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#0f1318">
<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">
<link rel="stylesheet" href="/style.css?v=2026-09-28">
</head>
<body>
<a class="skip" href="#main">Skip to content</a>
<header class="site-header">
<div class="site-header-inner">
<a class="brand" href="/"><img src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." width="98" height="28"></a>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/services/software/">Applications</a></li>
<li><a href="/services/systems-engineering/">Systems</a></li>
<li><a aria-current="page" href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI</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>
</div>
</header>
<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>
<h1 class="lede">We run what we build.</h1>
<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>
<main id="main">
<section id="offer">
<h2><span class="num">01</span>What we operate</h2>
<h2>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">
@@ -61,20 +66,20 @@
</div>
</section>
<footer>
</main>
<footer class="site-footer">
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a href="/services/software/">Applications</a>
<a href="/services/systems-engineering/">Systems</a>
<a href="/services/hosting/">Hosting</a>
<a aria-current="page" 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="/track-record/">Track record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
stacks/phasefinal-web/conf/site/services/software/index.html
+28 -23
View File
@@ -3,40 +3,45 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#0f1318">
<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">
<link rel="stylesheet" href="/style.css?v=2026-09-28">
</head>
<body>
<a class="skip" href="#main">Skip to content</a>
<header class="site-header">
<div class="site-header-inner">
<a class="brand" href="/"><img src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." width="98" height="28"></a>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a aria-current="page" href="/services/software/">Applications</a></li>
<li><a href="/services/systems-engineering/">Systems</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI</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>
</div>
</header>
<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>
<h1 class="lede">Custom applications, built to spec.</h1>
<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>
<main id="main">
<section id="scope">
<h2><span class="num">01</span>Scope</h2>
<h2>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">
@@ -65,20 +70,20 @@
</div>
</section>
<footer>
</main>
<footer class="site-footer">
<span>Phase Final, Inc.</span>
<nav aria-label="Footer">
<a href="/services/software/">Apps</a>
<a aria-current="page" href="/services/software/">Applications</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="/track-record/">Track record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>
stacks/phasefinal-web/conf/site/services/systems-engineering/index.html
+29 -24
View File
@@ -3,40 +3,45 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#0f1318">
<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">
<link rel="stylesheet" href="/style.css?v=2026-09-28">
</head>
<body>
<a class="skip" href="#main">Skip to content</a>
<header class="site-header">
<div class="site-header-inner">
<a class="brand" href="/"><img src="/assets/pfi-wordmark-duotone-dark.svg" alt="Phase Final, Inc." width="98" height="28"></a>
<nav class="site-nav" aria-label="Site">
<ul>
<li><a href="/services/software/">Applications</a></li>
<li><a aria-current="page" href="/services/systems-engineering/">Systems</a></li>
<li><a href="/services/hosting/">Hosting</a></li>
<li><a href="/services/ai/">AI</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>
</div>
</header>
<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>
<h1 class="lede">One problem. One owner.</h1>
<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>
<main id="main">
<section id="method">
<h2><span class="num">01</span>Method</h2>
<h2>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">
@@ -61,20 +66,20 @@
</div>
</section>
<footer>
</main>
<footer class="site-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/software/">Applications</a>
<a aria-current="page" 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="/track-record/">Track record</a>
<a href="/contact/">Contact</a>
<a href="/privacy/">Privacy</a>
</nav>
</footer>
</main>
</body>
</html>