Docker config

app/components/Company/CompanyHero.jsx

@@ -0,0 +1,41 @@
+import React from 'react';
+
+const CompanyHero = () => {
+  return (
+    <section 
+      className="relative bg-cover bg-center py-6 h-24" 
+      style={{ backgroundImage: "url('images/bredcrumb.jpg')" }}
+    >
+      {/* Breadcrumb */}
+      <div className="relative z-10 mb-1 -mt-3">
+        <div className="container mx-auto max-w-none px-4">
+          <nav className="flex items-center space-x-2 text-sm">
+            <a href="/" className="text-white hover:text-yellow-400 underline">Home</a>
+            <span className="text-white">
+              <svg className="w-3 h-3" fill="currentColor" viewBox="0 0 20 20">
+                <path fillRule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clipRule="evenodd" />
+              </svg>
+            </span>
+            <a href="/about-us" className="text-white hover:text-yellow-400 underline">About Us</a>
+            <span className="text-white">
+              <svg className="w-3 h-3" fill="currentColor" viewBox="0 0 20 20">
+                <path fillRule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clipRule="evenodd" />
+              </svg>
+            </span>
+            <span className="text-white">Company</span>
+          </nav>
+        </div>
+      </div>
+      
+      {/* Page Title */}
+      <div className="relative z-10 text-center -mt-2">
+        <h1 className="text-4xl md:text-5xl font-bold text-white mb-2">
+          Our Company
+        </h1>
+        <div className="w-16 h-1 bg-yellow-400 mx-auto"></div>
+      </div>
+    </section>
+  );
+};
+
+export default CompanyHero;

app/components/Company/CompanyIntro.jsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+const CompanyIntro = () => {
+  return (
+    <section className="py-0">
+      <div className="container-fluid">
+
+          {/* Right side content */}
+          <div className="bg-gradient-to-br from-teal-600 to-teal-700 text-white p-8 lg:p-12 flex items-center">
+            <div className="w-full">
+
+              <p className=" leading-relaxed text-justify">
+                Operify Tech is at the forefront of unlocking genomic secrets through advanced
+                next-generation sequencing (NGS) technology that empowers researchers,
+                academicians, and innovators. We are ISO certified for quality management of DNA
+                sequencing, RNA sequencing, and genomics informatics to bring the best to the
+                research and clinical community. Whether you are planning for whole genome sequencing
+                for never-before sequenced genomes or thinking of performing Total RNA sequencing for
+                your experiments, we have got it covered.
+              </p>
+
+            </div>
+          </div>
+        </div>
+    </section>
+  );
+};
+
+export default CompanyIntro;

app/components/Company/OurOfferings.jsx

@@ -0,0 +1,74 @@
+import React from 'react';
+import Image from 'next/image';
+
+const OurOfferings = () => {
+  return (
+    <section className="pt-6 bg-white rounded-2xl shadow-lg">
+      <div className="container mx-auto px-4">
+        <h2 className="text-4xl font-bold text-gray-700 text-left pb-2 mb-4">
+          Our Offerings
+        </h2>
+
+        {/* Services paragraph */}
+        <div className="mb-4 text-justify">
+          <p className="text-gray-600 leading-relaxed text-base">
+            Our diverse portfolio covers entire spectrum of services Whole Genome DNA
+            Sequencing, Hi-C Sequencing, Optical mapping, Whole Exome DNA Sequencing,
+            Targeted DNA Sequencing / Gene Panels, Amplicon Sequencing, Transcriptome Sequencing
+            (RNA-seq), Small RNA Sequencing, Single-cell DNA and RNA Sequencing, Microbiome
+            Profiling, Epigenetics Services, Metagenomics Sequencing, SARS CoV-2
+            Sequencing, Bioinformatics Solutions and many more.
+          </p>
+        </div>
+
+        {/* Introduction text */}
+        <div className="mb-4 text-justify">
+          <p className="text-gray-600 text-base leading-relaxed">
+            As your trusted ally, we deliver customized solutions for extraction,
+            library preparation, sequencing, and bioinformatics, all from our state-of-the-art New Delhi
+            laboratory. Partner with us for state-of-the-art NGS services on the platform of your choice
+            (Illumina, Oxford Nanopore, PacBio), fast turnaround time and strict QC, advanced or
+            customized Bioinformatics services, and end-to-end support by our experienced scientists.
+          </p>
+        </div>
+
+        {/* Team Highlight */}
+        <div className="mb-4 text-justify">
+          <p className="text-gray-600 text-base leading-relaxed">
+            Our team of PhDs, leading each department, ensures unmatched support from
+            initial consultation to post-delivery assistance, providing a seamless experience
+            throughout. Operify Tech is committed to helping you achieve your research goals efficiently
+            and affordably.
+          </p>
+        </div>
+
+        {/* Closing Statement */}
+        <div className="text-justify mb-10">
+          <p className="text-gray-600 text-base leading-relaxed">
+            Let's collaborate to create innovative solutions and provide exceptional support on your
+            genomics journey. Explore our services and contact us for your NGS studies.
+          </p>
+        </div>
+
+        {/* Centered image with background effect */}
+        <div className="max-w-2xl mx-auto text-center pb-4">
+          <div className="relative">
+            {/* Background gradient circle */}
+            <div className="absolute inset-0 flex items-center justify-center">
+              <div className="w-64 h-64 bg-gradient-radial from-teal-50 to-transparent rounded-full opacity-70"></div>
+            </div>
+            <Image 
+              src="/images/services1.png" 
+              alt="Advanced Laboratory Services" 
+              width={600} 
+              height={400}
+              className="relative z-10 w-full rounded-lg"
+            />
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default OurOfferings;

app/components/Company/VisionMission.jsx

@@ -0,0 +1,51 @@
+import React from 'react';
+import Image from 'next/image';
+
+const VisionMissionCard = ({ icon, title, description, color, borderColor }) => (
+  <div className="relative z-10 p-4">
+    <div className="flex items-center gap-5 mb-5">
+      <div 
+        className={`${color} rounded-xl w-15 h-15 flex items-center justify-center flex-shrink-0`}
+        style={{ width: '60px', height: '60px' }}
+      >
+        <Image src={icon} alt={title} width={30} height={30} className="object-contain" />
+      </div>
+      <h2 className={`text-2xl font-bold ${borderColor === 'border-teal-600' ? 'text-teal-600' : 'text-yellow-500'} tracking-tight`}>
+        {title}
+      </h2>
+    </div>
+    <div className={`text-gray-600 text-base leading-relaxed ml-2 border-l-2 ${borderColor} pl-5`}>
+      {description}
+    </div>
+  </div>
+);
+
+const VisionMission = () => {
+  return (
+    <section className="pt-6 bg-gray-50">
+      <div className="container mx-auto px-4">
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
+          {/* Vision Section */}
+          <VisionMissionCard
+            icon="/images/service/sight.png"
+            title="Our Vision"
+            description="To decode and discover the intricacies of genomes using the power of Next-Generation Sequencing (NGS) with the highest quality possible. To contribute to taking Indian NGS discoveries to a global scale."
+            color="bg-teal-50"
+            borderColor="border-teal-600"
+          />
+
+          {/* Mission Section */}
+          <VisionMissionCard
+            icon="/images/service/target.png"
+            title="Our Mission"
+            description="To transform genomics by delivering unparalleled quality and affordability in high-throughput technology services, empowering academia, research, and clinical practices to achieve groundbreaking discoveries and advancements."
+            color="bg-yellow-50"
+            borderColor="border-yellow-500"
+          />
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default VisionMission;

app/components/Company/WhyChooseUs.jsx

@@ -0,0 +1,69 @@
+import React from 'react';
+import Image from 'next/image';
+
+const FeatureCard = ({ icon, title, description, hasBorder = true }) => (
+  <div className={`p-6 h-full ${hasBorder ? 'border-r border-gray-300' : ''}`}>
+    <div className="mb-4">
+      <Image src={icon} alt={title} width={80} height={80} className="object-contain" />
+    </div>
+    <h3 className="text-xl font-semibold text-teal-600 mb-3">
+      {title}
+    </h3>
+    <p className="text-gray-600 text-base leading-relaxed">
+      {description}
+    </p>
+  </div>
+);
+
+const WhyChooseUs = () => {
+  const features = [
+    {
+      icon: "/images/service/award.png",
+      title: "Unmatched Quality",
+      description: "Our ISO certification in DNA Sequencing, RNA Sequencing, and Genomics Informatics underscores our dedication to delivering superior technical advice and results that align seamlessly with research objectives and expected outcomes."
+    },
+    {
+      icon: "/images/service/execution.png",
+      title: "Exceptional Value",
+      description: "Our comprehensive NGS and bioinformatics services offer unbeatable value for money. We ensure that our pricing structure never stands in the way of your research goals."
+    },
+    {
+      icon: "/images/service/social-support.png",
+      title: "Dedicated Support",
+      description: "We prioritize your needs, offering prompt technical advice and support. Our fast response times and client-focused approach ensure your research stays on track."
+    },
+    {
+      icon: "/images/service/accurate.png",
+      title: "Proven Reliability",
+      description: "We guarantee timely, accurate results using the latest chemistry, instruments, and software, maintaining the highest standards in our analyses."
+    }
+  ];
+
+  return (
+    <section>
+      <div className="container mx-auto max-w-none px-4">
+        <div className="rounded-3xl p-8" style={{ backgroundColor: '#f2fcfc' }}>
+          <div className="mb-6">
+            <h2 className="text-4xl font-bold text-gray-600 text-left">
+              Why Choose Operify Tech?
+            </h2>
+          </div>
+          
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4">
+            {features.map((feature, index) => (
+              <FeatureCard
+                key={index}
+                icon={feature.icon}
+                title={feature.title}
+                description={feature.description}
+                hasBorder={index < 3} // Remove border from last item
+              />
+            ))}
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default WhyChooseUs;