import React, {useEffect} from 'react'
import Navbar from '../components/common/Navbar'
import Footer from '../components/common/Footer';
import { assetPath } from "../utils/assetPath";

const technology = assetPath("/assets/images/technology.png");
const cyberSecurity = assetPath("/assets/images/cyber-security.png");
const medical = assetPath("/assets/images/medical.png");
const KatherineMayer = assetPath("/assets/images/katherine-mayer.jpeg");



const AboutPageHTML = () => {

  return (
    <>
      <div>
        <Navbar />
        <section className="abouthcontainer">
          <div className="abouthinner">
            <div className="container">
              <div className="row">
                {/* <div className="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-sm-12 col-12">
                  <div className="aboutimgouter">
                    <img src={assetPath("/assets/images/about-img-1.png")} alt="" />

                  </div>
                </div> */}
                <div className="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-sm-12 col-12 align-self-center">
                  <div className="abouthcontent">
                    <div className="section-heading mb-2" data-aos="fade-down" data-aos-delay={1000} data-aos-duration={500}>
                      <div className="subheading">Who We Are</div>
                      <h2>Our Story</h2>
                    </div>
                    <div className="row">
                      <div className="col-xxl-8 col-xl-8" data-aos="fade-down" data-aos-delay={1000} data-aos-duration={700}>
                        <h6>Where Deep Expertise Meets Practical Technology</h6>
                        <p>Jury Intel wasn't born in a tech incubator. It was built in courtrooms, during real trials, by
                          people who understand what's actually at stake when jury selection begins.</p>
                        <p>Katherine Mayer founded Mayer Consulting in 2012 after recognizing a gap in the
                          criminal defense landscape—a need for holistic support that combined fact
                          investigation, mitigation strategy, and jury consulting under one roof. Over a decade of
                          high-stakes casework followed, including capital defense, complex civil matters, and
                          everything in between.</p>
                        <p>Through hundreds of engagements, one challenge kept surfacing: jury research was
                          fragmented, time-consuming, and too often left to instinct rather than insight. The tools
                          available were either too generic or too cumbersome for the realities of trial prep.</p>
                        <p>Jury Intel is the solution we built for ourselves and now offer to legal teams who share
                          our commitment to rigorous, data-informed jury selection.</p>
                      </div>
                      <div className="col-xxl-4 col-xl-4" data-aos="zoom-in" data-aos-delay={1000} data-aos-duration={800}>
                        <div className="aboutimgbx">
                          <div className="ownername">Katherine Mayer, M.A., CLI, CCDI</div>
                          <img src={KatherineMayer} alt="Katherine Mayer, M.A., CLI, CCDI" />
                        </div>
                      </div>
                    </div>

                    <h3 data-aos="fade-in-left" data-aos-delay={1000} data-aos-duration={500}>What Makes Us Different</h3>
                    <div className="row gx-3 gx-md-4">
                      <div className="col-xl-4 col-lg-4 col-md-6 col-sm-12 col-12 mt-md-2 mb-2 mb-md-3" data-aos="fade-up" data-aos-delay={1000} data-aos-duration={1000}>
                        <div className="d-flex gap-2 gap-md-3 abouticonbx">
                          <div className="abouticon">
                            <img src={medical} alt="Practitioner-Built, Not Consultant-Sol" />
                          </div>
                          <div className="w-100 align-self-center">
                            <h6>Practitioner-Built, Not Consultant-Sol</h6>
                            <p>We don't just advise on jury selection—we do it. Jury Intel reflects thousands of hours in
                          voir dire, not theoretical best practices from a distance.</p>
                          </div>
                        </div>
                      </div>
                      <div className="col-xl-4 col-lg-4 col-md-6 col-sm-12 col-12 mt-md-2 mb-2 mb-md-3" data-aos="fade-up" data-aos-delay={1000} data-aos-duration={1200}>
                        <div className="d-flex gap-2 gap-md-3 abouticonbx">
                          <div className="abouticon">
                            <img src={technology} alt="Insight Engine, Not AI Hype" />
                          </div>
                          <div className="w-100 align-self-center">
                            <h6>Insight Engine, Not AI Hype</h6>
                            <p>We're not chasing buzzwords. Jury Intel connects platforms, organizes data, and
                              surfaces intelligence. It's technology in service of expertise—not a replacement for it.
                            </p>
                          </div>
                        </div>
                      </div>
                      <div className="col-xl-4 col-lg-4 col-md-6 col-sm-12 col-12 mt-md-2 mb-2 mb-md-3" data-aos="fade-up" data-aos-delay={1000} data-aos-duration={1500}>
                        <div className="d-flex gap-2 gap-md-3 abouticonbx">
                          <div className="abouticon">
                            <img src={cyberSecurity} alt="Security and Discretion First" />
                          </div>
                          <div className="w-100 align-self-center">
                            <h6>Security and Discretion First</h6>
                            <p>Your case data is sensitive. Our platform is designed with privacy, auditability, and clear
                          data sourcing as foundational principles.</p>
                          </div>
                        </div>
                      </div>
                    </div>
                    
                    <h3 data-aos="fade-down" data-aos-delay={1000} data-aos-duration={500}>Our Approach</h3>
                    <p data-aos="fade-down" data-aos-delay={1000} data-aos-duration={700}>We believe the best jury research happens when experienced judgment meets
                      organized information. Jury Intel doesn't tell you who to strike—it equips you to make
                      those calls with clarity and confidence.
                    </p>
                    <p data-aos="fade-down" data-aos-delay={1000} data-aos-duration={900}>Our platform handles the repetitive work—data collection, profile organization, report
                      generation—so your team can focus on the strategic decisions that win cases</p>
                    {/* <ul>
                      <li>Integer et lectus eget tortor tincidunt</li>
                      <li>Aliquam sit amet pretium neque</li>
                      <li>Egestas hendrerit dolor leo</li>
                    </ul> */}
                    {/* <a href="javascript:void(0);" className="theme-btn">Book a Demo</a> */}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </section>
        <Footer />
      </div>
    </>
  );
};

export default AboutPageHTML;
