<%- include('../layouts/top') %>

<%- include('../components/page-hero', {
  heroTitle: 'Industrial transportation for the sectors we know best',
  heroLead: 'We serve industrial sectors across the country, with particular depth in three where the handling requirements are most demanding.',
  heroEyebrow: 'Industries we serve',
  heroImage: 'odc-oversized-cargo-truck',
  heroCtas: { primary: 'Get a Quote', secondary: 'Contact Us' }
}) %>

<section class="section" aria-labelledby="sectors-title">
  <div class="container">
    <h2 id="sectors-title" class="sr-only">Sectors</h2>
    <div class="grid grid--3">
      <% content.industries.forEach(function (ind) { %>
        <article class="card industry-card reveal" id="<%= ind.slug %>">
          <div class="industry-card__media"><%- img(ind.image, { alt: ind.imageAlt, sizes: '(min-width: 960px) 33vw, 100vw' }) %></div>
          <div class="industry-card__body">
            <h3 class="mb-0"><%= ind.title %></h3>
            <p><%= ind.text %></p>
            <ul class="tags"><% ind.tags.forEach(function (t) { %><li><%= t %></li><% }) %></ul>
            <ul class="footer-links">
              <% ind.services.forEach(function (slug) { var s = bySlug[slug]; %>
                <li><a class="link-arrow" href="/services/<%= s.slug %>"><%= s.shortName %><%- icon('arrow-right') %></a></li>
              <% }) %>
            </ul>
          </div>
        </article>
      <% }) %>
    </div>
    <div class="alert alert--info mt-2">
      <%- icon('message') %>
      <p>Working in a sector not listed here? HK Logistics serves industrial and commercial customers generally. <a href="/contact">Tell us what you move</a> and we will confirm whether we are the right fit.</p>
    </div>
  </div>
</section>

<section class="section section--alt" aria-labelledby="chem-title">
  <div class="container split">
    <div class="reveal">
      <p class="eyebrow">Sector focus</p>
      <h2 id="chem-title">Chemicals and bulk liquids</h2>
      <p>Chemical movements carry requirements that ordinary freight does not, and we treat them as a discipline rather than a surcharge.</p>
      <p>Drivers and staff engaged on these movements are trained in safe driving, hazard symbols, an introduction to the products carried, personal protective equipment, TREM Card and MSDS handling, fire protection and emergency preparedness. An emergency line covers movements in transit.</p>
      <p>Vapi, one of India’s largest chemical manufacturing clusters, is an operating hub for HK Logistics, including rail-cum-road capability on the Vapi – Guwahati corridor.</p>
      <a class="btn btn--outline" href="/services/chemical-tanker-transportation">Tanker services for chemicals &amp; liquids<%- icon('arrow-right', 'icon--arrow') %></a>
    </div>
    <div class="card reveal">
      <span class="icon-tile"><%- icon('shield') %></span>
      <h3>Safe, right and timely movements</h3>
      <p class="muted">The standard applied on every chemical consignment:</p>
      <ul class="check-list mb-0">
        <% content.safetyTraining.forEach(function (t) { %><li><%- icon('check') %><%= t %></li><% }) %>
      </ul>
    </div>
  </div>
</section>

<%- include('../components/cta-band') %>

<%- include('../layouts/bottom') %>
