Problem
In src/app/home.module.css, .heroDecorative { display: none } hides the ₱60k–₱80k/mo stat box below 768px. This is the strongest social proof on the page — and most Filipino VAs browse on phones.
Current behavior
- ≥768px: Stat box visible as a side panel in the hero (flex-direction: row)
- <768px: Completely hidden
Proposed fix
On mobile, show the stat below the CTA buttons in a compact horizontal layout:
[₱60k–₱80k/mo]
market rate, specialist Amazon PPC VAs
Add a mobile-specific rule inside the @media (max-width: 767px) block:
.heroDecorative {
display: flex;
flex-direction: row;
align-items: center;
gap: var(--space-2);
font-family: var(--font-mono);
font-size: var(--text-lg);
font-weight: 700;
color: var(--accent);
background: var(--accent-soft);
padding: var(--space-4) var(--space-6);
border-radius: var(--radius-md);
white-space: nowrap;
}
.heroDecorativeCaption {
font-family: var(--font-body);
font-size: var(--text-xs);
color: var(--ink-500);
white-space: normal;
}
The desktop rule at @media (min-width: 768px) already shows it as a vertical panel — no changes needed there.
Severity: Required — strongest social proof invisible on primary viewport
Problem
In
src/app/home.module.css,.heroDecorative { display: none }hides the ₱60k–₱80k/mo stat box below 768px. This is the strongest social proof on the page — and most Filipino VAs browse on phones.Current behavior
Proposed fix
On mobile, show the stat below the CTA buttons in a compact horizontal layout:
Add a mobile-specific rule inside the
@media (max-width: 767px)block:The desktop rule at
@media (min-width: 768px)already shows it as a vertical panel — no changes needed there.Severity: Required — strongest social proof invisible on primary viewport