75 lines
3.7 KiB
TypeScript
75 lines
3.7 KiB
TypeScript
import { motion } from 'motion/react';
|
|
import { CheckCircle2 } from 'lucide-react';
|
|
|
|
export default function UseCases() {
|
|
return (
|
|
<section id="use-cases" className="py-24 bg-white px-6">
|
|
<div className="max-w-7xl mx-auto">
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6 }}
|
|
className="text-center mb-16"
|
|
>
|
|
<h2 className="text-3xl md:text-5xl font-serif font-bold text-primary-900 mb-4">
|
|
Use Cases
|
|
</h2>
|
|
{/* PART II 피봇: "만드는 실질적인 변화" (제품 중심) → 역할별 가치 (고객 중심)로 전환. */}
|
|
<p className="text-lg text-slate-600 max-w-2xl mx-auto font-medium break-keep">
|
|
프리미엄 병원과 전문 대행사가 INFINITH로 만드는 전략적 변화입니다.
|
|
</p>
|
|
</motion.div>
|
|
|
|
<div className="grid md:grid-cols-2 gap-12">
|
|
<motion.div
|
|
initial={{ opacity: 0, x: -20 }}
|
|
whileInView={{ opacity: 1, x: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6, delay: 0.1 }}
|
|
className="glass-card p-10 md:p-12 bg-gradient-to-br from-blue-50/50 to-white border border-blue-100/30"
|
|
>
|
|
<h3 className="text-2xl md:text-3xl font-serif font-bold text-primary-900 mb-8">Premium Medical Business</h3>
|
|
{/* 체크리스트 재설계: 진단(Audit) · 전략(Planning) · 운영(Weekly KPI) 3축. */}
|
|
<ul className="space-y-6">
|
|
{[
|
|
'10분 진단으로 채널별 강·약점 파악, 투자 우선순위 즉시 도출',
|
|
'12개월 마케팅 로드맵과 콘텐츠 캘린더로 기획 리소스 70% 절감',
|
|
'주간 KPI 달성도 → 전략 조정 루프로 환자 전환 흐름 자율 최적화',
|
|
].map((item, i) => (
|
|
<li key={i} className="flex items-start gap-4 text-slate-700 font-medium group">
|
|
<CheckCircle2 className="w-6 h-6 text-[#7A84D4] shrink-0 mt-1" />
|
|
<span className="leading-relaxed text-lg group-hover:text-primary-900 transition-colors">{item}</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</motion.div>
|
|
|
|
<motion.div
|
|
initial={{ opacity: 0, x: 20 }}
|
|
whileInView={{ opacity: 1, x: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6, delay: 0.2 }}
|
|
className="glass-card p-10 md:p-12 bg-gradient-to-br from-purple-50/50 to-white border border-purple-100/30"
|
|
>
|
|
<h3 className="text-2xl md:text-3xl font-serif font-bold text-primary-900 mb-8">Marketing Agency</h3>
|
|
{/* 대행사 가치축: 수주(Pitch) · 전략 품질(Strategy) · 포트폴리오 확장(Portfolio). */}
|
|
<ul className="space-y-6">
|
|
{[
|
|
'진단 리포트와 경쟁사 벤치마크로 제안서 품질 강화, 수주 경쟁력 상승',
|
|
'병원별 12개월 로드맵으로 전략 자문 일관성과 리텐션 확보',
|
|
'다수 병원 클라이언트 통합 대시보드로 운영 효율 극대화',
|
|
].map((item, i) => (
|
|
<li key={i} className="flex items-start gap-4 text-slate-700 font-medium group">
|
|
<CheckCircle2 className="w-6 h-6 text-purple-500 shrink-0 mt-1" />
|
|
<span className="leading-relaxed text-lg group-hover:text-primary-900 transition-colors">{item}</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</motion.div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|