sa-results-hero v2026-06-04
Centered H1-only hero for aguiarinjurylawyers.com. Full-bleed Visible Depth navy-to-black gradient, a single centered Georgia/Times New Roman H1 with an italic-orange emphasis line, and a soft orange radial glow. NO eyebrow, NO subheadline, NO stat row, NO CTA button inside the hero. Use as the top-of-page hero on the Case Results page and any page that wants a clean, statement-style headline moment instead of the standard split-card hero. Triggers on 'results hero,' 'centered hero,' 'H1-only hero,' 'sa-results-hero,' 'statement hero,' 'Real Clients Real Results hero,' or any request for a minimal centered headline hero. Distinct from sa-cva-split-hero (image-left/copy-right) and the standard interior hero (eyebrow + subhead + trust strip) — pick one per page.
Source skill: sa-results-hero · Updated 2026-06-06 16:03:24
When to use
Top-of-page hero when a page wants a clean, statement-style centered headline moment instead of the standard split-card or eyebrow+subhead+trust-strip hero (e.g. the Case Results page).
Rules & constraints
- Centered H1 only — NO eyebrow, NO subheadline, NO stat row, NO CTA button inside the hero.
- H1 uses Georgia/Times New Roman with an italic-orange <em> emphasis line; orange (#D97706) for text only, never background.
- Visible Depth navy-to-black gradient background with a soft orange radial glow.
- No emoji.
Live reference
https://previews.aguiarinjurylawyers.com/our-results-enhanced
Deployment notes
Place as the first/top section of the page. Full-bleed. Pick ONE hero per page — distinct from sa-cva-split-hero (image-left/copy-right) and the standard interior hero. Run pre-publish-qa and playwright-visual-qa after deploy.
HTML
<!-- SA RESULTS HERO (centered, H1-only) - START -->
<section class="sa-results-hero">
<h1>Real Clients.<br><em>Real Results.</em></h1>
</section>
<!-- SA RESULTS HERO - END -->
CSS
.sa-results-hero{position:relative;background:linear-gradient(0deg,#000 0%,#0B212D 100%);color:#fff;overflow:hidden;text-align:center;padding:96px 24px}
.sa-results-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 0%,rgba(217,119,6,.14),transparent 70%);pointer-events:none}
.sa-results-hero h1{position:relative;z-index:1;font-family:Georgia,'Times New Roman',serif;font-weight:500;font-size:clamp(40px,6.6vw,80px);line-height:1.06;letter-spacing:-.01em;margin:0;max-width:none;color:#fff}
.sa-results-hero h1 em{font-style:italic;color:#D97706}
@media(prefers-reduced-motion:reduce){.sa-results-hero{transition:none}}