UI styling update

app/dna-sequencing/whole-genome-sequencing/resequencing/components/ResequencingIntroduction.jsx

@@ -9,11 +9,19 @@ const ResequencingIntroduction = () => {
     "These reads undergo alignment to a reference genome, followed by the analysis of genetic variations using advanced bioinformatics tools.",
     "It enables detailed analysis of genetic variations across diverse species like humans, plants, and bacteria."
   ];
+  const advantageItems = [
+    "Provides a detailed examination of an organism's entire genome, revealing all genetic variations compared to a reference genome.",
+    "Enables accurate identification of single nucleotide polymorphisms (SNPs), insertions, deletions, and structural variants, crucial for understanding genetic diversity and disease mechanisms.",
+    "Facilitates the discovery of genetic markers associated with diseases, guiding personalized treatment approaches.",
+    "Supports diverse studies including evolutionary biology, agricultural genetics, and microbial genomics, enhancing insights into genetic adaptations and relationships across species."
+  ];
 
   return (
     <IntroductionLayout
-      title="Introduction and Workflow"
-      contentItems={contentItems}
+      introTitle="Introduction and Workflow"
+      advantageTitle="Advantage"
+      introItems={contentItems}
+      advantageItems={advantageItems}
       imageUrl="/images/dna/resequencing-workflow.png"
       imageAlt="Resequencing Workflow"
       badgeText="RESEQUENCING"

app/dna-sequencing/whole-genome-sequencing/resequencing/components/WGSResequencingPipeline.jsx

@@ -5,16 +5,15 @@ const WGSResequencingPipeline = ({
   svgContent = null, // Pass your SVG content here as JSX
   svgUrl = "/images/flowchart/resequencing.svg",
   backgroundColor = "bg-gray-50",
-  textColor = "text-gray-700",
   className = "",
   titleClassName = "",
   svgClassName = "",
   containerClassName = ""
 }) => {
   return (
-    <section className={`py-6 sm:py-8 lg:py-12 ${backgroundColor} ${className}`}>
+    <section className={`py-6 sm:py-8 lg:py-4 ${backgroundColor} ${className}`}>
       <div className={`container mx-auto max-w-none px-3 sm:px-4 lg:px-6 ${containerClassName}`}>
-        <h2 className={`${textColor} text-left pb-4 sm:pb-6 text-xl sm:text-2xl lg:text-3xl font-normal ${titleClassName}`}>
+        <h2 className={"text-3xl font-bold text-teal-700 mb-4"}>
           {title}
         </h2>
 
@@ -22,19 +21,19 @@ const WGSResequencingPipeline = ({
         <div className="bg-white rounded-xl shadow-lg p-4 sm:p-6 lg:p-8">
           <div className="flex justify-center">
             <div className="w-full max-w-6xl">
-              {/* SVG Container with responsive sizing */}
-              <div className={`w-full ${svgClassName}`}>
+              {/* SVG Container with responsive sizing and reduced height */}
+              <div className={`w-full max-h-100 overflow-hidden ${svgClassName}`}>
                 {svgUrl ? (
                   // If SVG URL/path is provided
                   <img 
                     src={svgUrl} 
                     alt="Flowchart diagram"
-                    className="w-full h-auto object-contain"
+                    className="w-full h-auto object-contain max-h-100"
                   />
                 ) : svgContent ? (
                   // If SVG content is provided as JSX
-                  <div className="w-full">
-                    <div className="w-full">
+                  <div className="w-full max-h-100">
+                    <div className="w-full max-h-100 overflow-hidden">
                       {svgContent}
                     </div>
                   </div>

app/dna-sequencing/whole-genome-sequencing/resequencing/page.js

@@ -24,7 +24,6 @@ export default function WholeGenomeResequencingPage() {
       
       <div className="page-content">
         <ResequencingIntroduction />
-        <ResequencingAdvantages />
         <WGSResequencingPipeline/>
         <ResequencingApplications />
         <ResequencingSpecifications />