71 lines
2.6 KiB
JavaScript
71 lines
2.6 KiB
JavaScript
// components/ClinicalAreas.js
|
|
import Link from "next/link";
|
|
import Image from "next/image";
|
|
|
|
export default function ClinicalAreas() {
|
|
return (
|
|
<div className="mx-auto px-10 py-4">
|
|
{/* Heading */}
|
|
<h2 className="text-3xl font-bold text-teal-700 mb-4">
|
|
Precise Solutions for Clinical Areas
|
|
</h2>
|
|
|
|
{/* Subtext */}
|
|
<p className="text-gray-600 leading-relaxed text-base mb-4 text-justify">
|
|
Empowering you with precise, tailored approaches to diagnostics and care —
|
|
addressing the unique needs of each clinical area to improve patient outcomes.
|
|
</p>
|
|
|
|
{/* Cards */}
|
|
<div className="grid grid-cols-1 sm:grid-cols-2 gap-6">
|
|
{/* Rare Disorders */}
|
|
<Link href="/health/rare-disorders">
|
|
<div className="rounded-lg p-6 hover:shadow-sm transition-shadow cursor-pointer" style={{backgroundColor: '#f2fcfc'}}>
|
|
<div className="flex items-start gap-4">
|
|
{/* Icon */}
|
|
<div className="flex-shrink-0 mt-1">
|
|
<Image
|
|
src="/images/icons/disorder.png"
|
|
alt="Rare Disorders"
|
|
width={40}
|
|
height={40}
|
|
className="object-contain"
|
|
/>
|
|
</div>
|
|
<div className="flex-1">
|
|
<h3 className="text-lg font-semibold text-gray-900 mb-2">Rare Disorders</h3>
|
|
<p className="text-gray-500 text-sm leading-relaxed">
|
|
Advancing diagnostics and treatments for rare genetic conditions.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
|
|
{/* Oncology */}
|
|
<Link href="/health/oncology">
|
|
<div className="rounded-lg p-6 hover:shadow-sm transition-shadow cursor-pointer" style={{backgroundColor: '#f2fcfc'}}>
|
|
<div className="flex items-start gap-4">
|
|
{/* Icon */}
|
|
<div className="flex-shrink-0 mt-1">
|
|
<Image
|
|
src="/images/icons/oncology.png"
|
|
alt="Oncology"
|
|
width={40}
|
|
height={40}
|
|
className="object-contain"
|
|
/>
|
|
</div>
|
|
<div className="flex-1">
|
|
<h3 className="text-lg font-semibold text-gray-900 mb-2">Oncology</h3>
|
|
<p className="text-gray-500 text-sm leading-relaxed">
|
|
Revolutionizing cancer care with targeted therapies and early detection.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
);
|
|
} |