"use client";

import React from 'react';

const ChainLinkOverview = () => {
  return (
    <section className="overview">
      <div className="reveal">
        <div className="section-eyebrow">About this product line</div>
        <h2 className="sh">Complete chain link<br /><span>fence supply.</span></h2>
      </div>
      <div className="overview-grid">
        <div className="overview-text reveal">
          <p>
            <strong>VG Fence Products is your dedicated chain link fence materials supplier in the Kitchener–Waterloo–Cambridge region.</strong> Our chain link fence product line includes every component required for a complete installation — from mesh and posts to gates and hardware.
          </p>
          <p>
            Whether you're a fence contractor building a residential backyard fence or a commercial contractor securing a large industrial site, we carry the materials you need in both <strong>galvanized and vinyl coated finishes</strong>. Order in bulk with contractor pricing, or contact us for a custom quote on your specific project requirements.
          </p>
          <p>
            We deliver directly to job sites across our 250km service radius — covering Waterloo Region, Guelph, Hamilton, Brantford, Toronto GTA, London, Windsor and everywhere in between.
          </p>
          <ul className="check-list">
            <li>Full product range always in stock — no waiting on special orders</li>
            <li>Galvanized and black vinyl coated options available</li>
            <li>Bulk contractor pricing on all orders</li>
            <li>Scheduled delivery direct to your job site</li>
            <li>Knowledgeable team to help spec your project</li>
            <li>Commercial and residential applications</li>
          </ul>
        </div>
        <div className="use-cards reveal">
          <div className="use-card">
            <div className="use-card-title">Residential installations</div>
            <div className="use-card-desc">Backyard fencing, pool enclosures, pet containment, garden borders, property boundaries. Standard residential heights from 3ft to 6ft.</div>
            <div className="use-card-tags">
              <span className="mini-tag">Black vinyl coated</span>
              <span className="mini-tag">Galvanized</span>
              <span className="mini-tag">Privacy slats</span>
            </div>
          </div>
          <div className="use-card">
            <div className="use-card-title">Commercial &amp; industrial</div>
            <div className="use-card-desc">Security perimeters, facility enclosures, parking lots, industrial yards, warehouses. Heavy gauge commercial chain link with barbed wire options.</div>
            <div className="use-card-tags">
              <span className="mini-tag">Heavy gauge</span>
              <span className="mini-tag">Barbed wire</span>
              <span className="mini-tag">Security grade</span>
            </div>
          </div>
          <div className="use-card">
            <div className="use-card-title">Construction &amp; temporary</div>
            <div className="use-card-desc">Site security, pedestrian barriers, crowd control, hazard enclosures. Available for temporary rental or permanent installation.</div>
            <div className="use-card-tags">
              <span className="mini-tag">Rental available</span>
              <span className="mini-tag">Site security</span>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
};

export default ChainLinkOverview;
