feat(site): vertical-specific order-page headers (trucking/telecom/healthcare/corporate) via unified VerticalOrderHeader; apply to all 49 order pages; retire TruckingOrderHeader
This commit is contained in:
parent
695c3e2431
commit
9bcd27db80
52 changed files with 386 additions and 174 deletions
|
|
@ -1,124 +0,0 @@
|
|||
---
|
||||
---
|
||||
|
||||
<section class="pw-trucking-order-hero" aria-labelledby="pw-trucking-order-hero-title">
|
||||
<div class="pw-trucking-order-badge">DOT / FMCSA Compliance Specialists</div>
|
||||
<h2 id="pw-trucking-order-hero-title">We handle your FMCSA filings so you can focus on the road.</h2>
|
||||
<p class="pw-trucking-order-copy">
|
||||
Performance West is a dedicated transportation compliance firm serving thousands of motor carriers nationwide.
|
||||
We combine deep regulatory expertise with purpose-built filing technology so your paperwork is done right, done fast,
|
||||
and tracked every step of the way.
|
||||
</p>
|
||||
<div class="pw-trucking-order-cards" aria-label="Performance West trucking compliance advantages">
|
||||
<article>
|
||||
<div class="pw-card-icon">📋</div>
|
||||
<h3>Specialized in trucking compliance</h3>
|
||||
<p>MCS-150, BOC-3, UCR, IFTA/IRP, operating authority and more, filed correctly the first time.</p>
|
||||
</article>
|
||||
<article>
|
||||
<div class="pw-card-icon">⚡</div>
|
||||
<h3>Fast turnaround</h3>
|
||||
<p>Our automated filing systems submit most updates within 1-2 business days of receiving your information.</p>
|
||||
</article>
|
||||
<article>
|
||||
<div class="pw-card-icon">🔍</div>
|
||||
<h3>Attention to detail</h3>
|
||||
<p>Every filing is verified against current FMCSA requirements. We catch errors before they become problems.</p>
|
||||
</article>
|
||||
<article>
|
||||
<div class="pw-card-icon">📞</div>
|
||||
<h3>Real support, real people</h3>
|
||||
<p>Questions? Call (888) 411-0383 or reply to any email. We respond same business day.</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<style>
|
||||
.pw-trucking-order-hero {
|
||||
margin: 0 0 1.5rem;
|
||||
padding: 2rem 1.5rem;
|
||||
border-radius: 18px;
|
||||
background: var(--pw-navy-dark, #0f172a);
|
||||
text-align: center;
|
||||
box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
|
||||
}
|
||||
|
||||
.pw-trucking-order-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
margin-bottom: 0.875rem;
|
||||
padding: 0.25rem 0.875rem;
|
||||
border: 1px solid rgba(249, 115, 22, 0.3);
|
||||
border-radius: 999px;
|
||||
background: rgba(249, 115, 22, 0.15);
|
||||
color: #fb923c;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.pw-trucking-order-hero h2 {
|
||||
margin: 0 0 0.75rem;
|
||||
color: #ffffff;
|
||||
font-size: clamp(1.45rem, 3vw, 2rem);
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.pw-trucking-order-copy {
|
||||
margin: 0 auto 1.5rem;
|
||||
max-width: 42rem;
|
||||
color: #cbd5e1;
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.pw-trucking-order-cards {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
|
||||
gap: 0.75rem;
|
||||
max-width: 920px;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.pw-trucking-order-cards article {
|
||||
padding: 1rem;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 10px;
|
||||
background: rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
.pw-card-icon {
|
||||
margin-bottom: 0.375rem;
|
||||
font-size: 1.375rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.pw-trucking-order-cards h3 {
|
||||
margin: 0 0 0.25rem;
|
||||
color: #ffffff;
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 800;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.pw-trucking-order-cards p {
|
||||
margin: 0;
|
||||
color: #94a3b8;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.pw-trucking-order-hero {
|
||||
padding: 1.5rem 1rem;
|
||||
border-radius: 14px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.pw-trucking-order-copy {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
159
site/src/components/VerticalOrderHeader.astro
Normal file
159
site/src/components/VerticalOrderHeader.astro
Normal file
|
|
@ -0,0 +1,159 @@
|
|||
---
|
||||
// Vertical-specific order-page hero. One component, four verticals, so the copy
|
||||
// + accent live in a single place and never drift across the ~50 order pages.
|
||||
//
|
||||
// Usage: <VerticalOrderHeader vertical="healthcare" />
|
||||
// Verticals: "trucking" | "telecom" | "healthcare" | "corporate"
|
||||
// (trucking mirrors the original TruckingOrderHeader copy verbatim.)
|
||||
export interface Props {
|
||||
vertical: "trucking" | "telecom" | "healthcare" | "corporate";
|
||||
}
|
||||
const { vertical } = Astro.props;
|
||||
|
||||
type Card = { icon: string; h: string; p: string };
|
||||
type Content = {
|
||||
badge: string;
|
||||
title: string;
|
||||
intro: string;
|
||||
accent: string; // accent color (badge text + card highlight)
|
||||
cards: Card[];
|
||||
};
|
||||
|
||||
const PHONE = "(888) 411-0383";
|
||||
|
||||
const CONTENT: Record<Props["vertical"], Content> = {
|
||||
trucking: {
|
||||
badge: "DOT / FMCSA Compliance Specialists",
|
||||
title: "We handle your FMCSA filings so you can focus on the road.",
|
||||
intro:
|
||||
"Performance West is a dedicated transportation compliance firm serving thousands of motor carriers nationwide. We combine deep regulatory expertise with purpose-built filing technology so your paperwork is done right, done fast, and tracked every step of the way.",
|
||||
accent: "#fb923c",
|
||||
cards: [
|
||||
{ icon: "\u{1F4CB}", h: "Specialized in trucking compliance", p: "MCS-150, BOC-3, UCR, IFTA/IRP, operating authority and more, filed correctly the first time." },
|
||||
{ icon: "\u{26A1}", h: "Fast turnaround", p: "Our automated filing systems submit most updates within 1-2 business days of receiving your information." },
|
||||
{ icon: "\u{1F50D}", h: "Attention to detail", p: "Every filing is verified against current FMCSA requirements. We catch errors before they become problems." },
|
||||
{ icon: "\u{1F4DE}", h: "Real support, real people", p: `Questions? Call ${PHONE} or reply to any email. We respond same business day.` },
|
||||
],
|
||||
},
|
||||
telecom: {
|
||||
badge: "FCC / Telecom Compliance Specialists",
|
||||
title: "We handle your FCC filings so you can focus on your network.",
|
||||
intro:
|
||||
"Performance West is a dedicated telecommunications compliance firm serving carriers, VoIP providers, and resellers nationwide. We pair deep FCC regulatory expertise with purpose-built filing technology so your Form 499, STIR/SHAKEN, CPNI, and registrations are done right, done on time, and tracked every step of the way.",
|
||||
accent: "#60a5fa",
|
||||
cards: [
|
||||
{ icon: "\u{1F4E1}", h: "Specialized in telecom compliance", p: "Form 499-A/Q, FCC registration, STIR/SHAKEN, CPNI, Robocall Mitigation, OCN/CORES and more." },
|
||||
{ icon: "\u{26A1}", h: "Deadline-driven filing", p: "We track every FCC and USAC due date and file on time so you avoid red-light status and penalties." },
|
||||
{ icon: "\u{1F50D}", h: "Accuracy you can audit", p: "Every filing is verified against current FCC rules. We catch revenue and classification errors before they cost you." },
|
||||
{ icon: "\u{1F4DE}", h: "Real support, real people", p: `Questions? Call ${PHONE} or reply to any email. We respond same business day.` },
|
||||
],
|
||||
},
|
||||
healthcare: {
|
||||
badge: "Healthcare Provider Compliance Specialists",
|
||||
title: "We handle your Medicare and NPI filings so you can focus on patients.",
|
||||
intro:
|
||||
"Performance West is a dedicated healthcare compliance firm serving providers, group practices, and facilities nationwide. We combine deep CMS and NPPES regulatory expertise with purpose-built filing technology so your revalidation, enrollment, and registry updates are done right, done fast, and tracked every step of the way.",
|
||||
accent: "#34d399",
|
||||
cards: [
|
||||
{ icon: "\u{1FA7A}", h: "Specialized in provider compliance", p: "Medicare PECOS revalidation, NPI/NPPES updates, reactivation, enrollment, and OIG/SAM screening." },
|
||||
{ icon: "\u{26A1}", h: "Beat the deactivation deadline", p: "Miss a revalidation date and CMS deactivates your billing privileges. We file before the clock runs out." },
|
||||
{ icon: "\u{1F50D}", h: "Accuracy that protects billing", p: "Every filing is checked against current CMS requirements so an error never interrupts your reimbursements." },
|
||||
{ icon: "\u{1F4DE}", h: "Real support, real people", p: `Questions? Call ${PHONE} or reply to any email. We respond same business day.` },
|
||||
],
|
||||
},
|
||||
corporate: {
|
||||
badge: "Corporate Compliance Specialists",
|
||||
title: "We handle your corporate filings so you can focus on the business.",
|
||||
intro:
|
||||
"Performance West is a dedicated corporate compliance firm serving companies registering and operating across multiple states. We combine deep regulatory expertise with purpose-built filing technology so your registrations, agent designations, and annual obligations are done right, done fast, and tracked every step of the way.",
|
||||
accent: "#a78bfa",
|
||||
cards: [
|
||||
{ icon: "\u{1F3DB}\u{FE0F}", h: "Specialized in corporate filings", p: "Foreign qualification, registered/process agent service, formations, and annual reports nationwide." },
|
||||
{ icon: "\u{26A1}", h: "Fast, multi-state turnaround", p: "We handle the Secretary of State paperwork in every jurisdiction so you can expand without the delay." },
|
||||
{ icon: "\u{1F50D}", h: "Nothing falls through the cracks", p: "Every registration is verified and tracked, so deadlines and renewals never slip." },
|
||||
{ icon: "\u{1F4DE}", h: "Real support, real people", p: `Questions? Call ${PHONE} or reply to any email. We respond same business day.` },
|
||||
],
|
||||
},
|
||||
};
|
||||
|
||||
const c = CONTENT[vertical];
|
||||
---
|
||||
|
||||
<section class="pw-vhero" style={`--pw-accent:${c.accent}`} aria-labelledby="pw-vhero-title">
|
||||
<div class="pw-vhero-badge">{c.badge}</div>
|
||||
<h2 id="pw-vhero-title">{c.title}</h2>
|
||||
<p class="pw-vhero-copy">{c.intro}</p>
|
||||
<div class="pw-vhero-cards" aria-label="Performance West compliance advantages">
|
||||
{c.cards.map((card) => (
|
||||
<article>
|
||||
<div class="pw-card-icon">{card.icon}</div>
|
||||
<h3>{card.h}</h3>
|
||||
<p>{card.p}</p>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<style>
|
||||
.pw-vhero {
|
||||
margin: 0 0 1.5rem;
|
||||
padding: 2rem 1.5rem;
|
||||
border-radius: 18px;
|
||||
background: var(--pw-navy-dark, #0f172a);
|
||||
text-align: center;
|
||||
box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
|
||||
}
|
||||
.pw-vhero-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
margin-bottom: 0.875rem;
|
||||
padding: 0.25rem 0.875rem;
|
||||
border: 1px solid color-mix(in srgb, var(--pw-accent) 35%, transparent);
|
||||
border-radius: 999px;
|
||||
background: color-mix(in srgb, var(--pw-accent) 16%, transparent);
|
||||
color: var(--pw-accent);
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
.pw-vhero h2 {
|
||||
margin: 0 0 0.75rem;
|
||||
color: #ffffff;
|
||||
font-size: clamp(1.45rem, 3vw, 2rem);
|
||||
line-height: 1.2;
|
||||
}
|
||||
.pw-vhero-copy {
|
||||
margin: 0 auto 1.5rem;
|
||||
max-width: 42rem;
|
||||
color: #cbd5e1;
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.7;
|
||||
}
|
||||
.pw-vhero-cards {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
|
||||
gap: 0.75rem;
|
||||
max-width: 920px;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
}
|
||||
.pw-vhero-cards article {
|
||||
padding: 1rem;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 10px;
|
||||
background: rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
.pw-card-icon { margin-bottom: 0.375rem; font-size: 1.375rem; line-height: 1; }
|
||||
.pw-vhero-cards h3 {
|
||||
margin: 0 0 0.25rem;
|
||||
color: #ffffff;
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 800;
|
||||
line-height: 1.35;
|
||||
}
|
||||
.pw-vhero-cards p { margin: 0; color: #94a3b8; font-size: 0.75rem; line-height: 1.5; }
|
||||
@media (max-width: 640px) {
|
||||
.pw-vhero { padding: 1.5rem 1rem; border-radius: 14px; text-align: left; }
|
||||
.pw-vhero-copy { margin-left: 0; margin-right: 0; }
|
||||
}
|
||||
</style>
|
||||
Loading…
Add table
Add a link
Reference in a new issue