47 lines
2.4 KiB
TypeScript
47 lines
2.4 KiB
TypeScript
export default function StainPromo() {
|
||
return (
|
||
<section className="stain-section">
|
||
<div className="stain-bg"></div>
|
||
<div className="stain-layout">
|
||
<div className="reveal">
|
||
<div className="stain-badge">High-Margin Product Line</div>
|
||
<h2 className="stain-h2">Expert Stain<br /><span>& Seal</span></h2>
|
||
<p className="stain-desc">Professional-grade wood care products built for contractors. Maximum results with less labor — now available in Ontario through VG Fence Products with contractor pricing and bulk ordering.</p>
|
||
|
||
<div className="stain-pills">
|
||
<div className="stain-pill"><strong>Staining</strong>Stain & Seal</div>
|
||
<div className="stain-pill"><strong>Prep</strong>Clean & Bright</div>
|
||
</div>
|
||
|
||
<div className="stain-promo-eyebrow">WHO ORDERS FROM US</div>
|
||
<div className="stain-target-list">
|
||
{[
|
||
"Deck & fence staining contractors",
|
||
"Exterior painters & handymen",
|
||
"Pressure washing companies",
|
||
"Property maintenance companies",
|
||
"Wood restoration contractors",
|
||
"DIY homeowners (decks & fences)"
|
||
].map((item, index) => (
|
||
<div key={index} className="stain-target">
|
||
<div className="stain-target-dot"></div>
|
||
<div className="stain-target-txt">{item}</div>
|
||
</div>
|
||
))}
|
||
</div>
|
||
<a href="/contact" className="btn-primary mt-32 d-inline-block">GET STAIN PRODUCT PRICING →</a>
|
||
</div>
|
||
|
||
<div className="stain-img-wrap reveal">
|
||
<img src="/assets/images/stain-product.jpg" alt="Expert Stain & Seal Products" />
|
||
<div className="stain-img-ph" aria-hidden="true">
|
||
<svg width="48" height="48" viewBox="0 0 36 36" fill="none"><rect x="3" y="5" width="30" height="22" rx="2.5" stroke="rgba(255,255,255,.15)" strokeWidth="1.5" fill="none"/><circle cx="12" cy="13" r="4" stroke="rgba(255,255,255,.15)" strokeWidth="1.2" fill="none"/><path d="M3 22 L11 15 L18 21 L24 15 L33 22" stroke="rgba(255,255,255,.15)" strokeWidth="1.2" fill="none"/></svg>
|
||
<div className="ph-label">Expert Stain & Seal</div>
|
||
<div className="ph-sub">/assets/images/stain-product.jpg<br />800×800px high-res</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
);
|
||
}
|