109 lines
5.8 KiB
TypeScript
109 lines
5.8 KiB
TypeScript
"use client";
|
|
|
|
import Navbar from "../components/layout/Navbar";
|
|
import DNAHeroBackground from "../components/canvas/DNAHeroBackground";
|
|
import { motion } from "framer-motion";
|
|
import { Activity, Bluetooth, ShieldCheck, Zap } from "lucide-react";
|
|
import Footer from "../components/layout/Footer";
|
|
|
|
export default function DevicesPage() {
|
|
return (
|
|
<div className="relative min-h-screen">
|
|
<DNAHeroBackground />
|
|
<Navbar />
|
|
|
|
<main className="relative z-10 pt-40 pb-24">
|
|
<div className="container mx-auto px-6">
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 20 }}
|
|
animate={{ opacity: 1, y: 0 }}
|
|
className="max-w-4xl"
|
|
>
|
|
<h1 className="text-5xl md:text-8xl font-black tracking-tighter mb-8">
|
|
Medical <span className="text-gradient">Hardware</span>
|
|
</h1>
|
|
<p className="text-xl text-foreground/60 leading-relaxed mb-12 max-w-2xl">
|
|
Precision-engineered Bluetooth vitals monitors and maternity care tools. Designed for reliability, accuracy, and absolute security.
|
|
</p>
|
|
</motion.div>
|
|
|
|
{/* Device Detailed Grid */}
|
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12 mt-20">
|
|
{[
|
|
{
|
|
title: "Vitals Hub X1",
|
|
feature: "Multi-Parameter Monitoring",
|
|
desc: "Measures Blood Pressure, Heart Rate, SpO2, and Body Temperature in one sleek device.",
|
|
specs: ["Bluetooth 5.2", "48h Battery", "Cloud Sync"]
|
|
},
|
|
{
|
|
title: "Fetal Doppler Pro",
|
|
feature: "Maternity Care",
|
|
desc: "High-sensitivity fetal heart rate detection with ultra-sound noise reduction technology.",
|
|
specs: ["OLED Display", "Built-in Speaker", "App Integration"]
|
|
}
|
|
].map((item, i) => (
|
|
<motion.div
|
|
key={i}
|
|
initial={{ opacity: 0, scale: 0.95 }}
|
|
whileInView={{ opacity: 1, scale: 1 }}
|
|
className="glass p-12 rounded-[3rem] border-white/5 space-y-8"
|
|
>
|
|
<div className="flex justify-between items-start">
|
|
<div className="space-y-2">
|
|
<span className="text-primary font-bold tracking-widest uppercase text-xs">{item.feature}</span>
|
|
<h2 className="text-4xl font-bold">{item.title}</h2>
|
|
</div>
|
|
<div className="w-16 h-16 rounded-full bg-primary/20 flex items-center justify-center">
|
|
<Activity className="w-8 h-8 text-primary" />
|
|
</div>
|
|
</div>
|
|
<p className="text-lg text-foreground/60">{item.desc}</p>
|
|
|
|
<div className="flex flex-wrap gap-4">
|
|
{item.specs.map((spec, j) => (
|
|
<span key={j} className="px-4 py-2 rounded-full bg-white/5 border border-white/5 text-sm">
|
|
{spec}
|
|
</span>
|
|
))}
|
|
</div>
|
|
|
|
<button className="w-full bg-white text-black py-4 rounded-2xl font-bold hover:bg-zinc-200 transition-colors">
|
|
View Specifications
|
|
</button>
|
|
</motion.div>
|
|
))}
|
|
</div>
|
|
|
|
{/* Compliance Banner */}
|
|
<motion.div
|
|
initial={{ opacity: 0 }}
|
|
whileInView={{ opacity: 1 }}
|
|
className="mt-32 p-12 glass rounded-[3rem] border-accent/20 flex flex-col md:flex-row items-center justify-between gap-12"
|
|
>
|
|
<div className="space-y-4">
|
|
<div className="flex items-center gap-3">
|
|
<ShieldCheck className="w-8 h-8 text-accent" />
|
|
<h3 className="text-3xl font-bold italic">HIPAA Verified Hardware</h3>
|
|
</div>
|
|
<p className="text-foreground/60 max-w-xl">
|
|
Every device in our ecosystem undergoes rigorous security audits. Data transmission is encrypted from the sensor to the cloud.
|
|
</p>
|
|
</div>
|
|
<div className="flex gap-4">
|
|
<div className="w-16 h-16 rounded-2xl bg-white/5 flex items-center justify-center">
|
|
<Bluetooth className="w-8 h-8 text-primary" />
|
|
</div>
|
|
<div className="w-16 h-16 rounded-2xl bg-white/5 flex items-center justify-center">
|
|
<Zap className="w-8 h-8 text-yellow-500" />
|
|
</div>
|
|
</div>
|
|
</motion.div>
|
|
</div>
|
|
</main>
|
|
|
|
<Footer />
|
|
</div>
|
|
);
|
|
}
|