938ebacbf9
- MultiChannelInput: URL 뭉치 붙여넣기 → classifyUrls로 7개 채널 자동 분류
(homepage·YouTube·Instagram·Facebook·네이버플레이스·블로그·강남언니)
· "Analyze" pill 버튼 복원 + variant별 색 분기 (hero=dark brand,
cta=#fff3eb→#e4cfff→#f5f9ff warm 3-stop)
· placeholder 중앙 정렬 + "한 줄씩" 규칙 제거 (유연 파싱 노출)
- Navbar: Free Report CTA 제거 → Login + 문의하기 (contact@o2o.kr) duo
- LoginPage: 계약 고객용 스캐폴딩 페이지 신규 추가
- PricingPage: 계약 기반 영업 반영, FAQ에서 해지·환불 항목 제거
(세부 정책 미확정 → 후속 추가)
- Landing 카피 Strategic Planner 포지셔닝 피봇:
· Hero sub: "10분 진단 → 12개월 전략 설계"
· Solution AGDP: Audit / Generation / Direction / Planning 재해석
· Modules: Intelligence + Planning Available, 나머지 Coming Soon 정직화
· TargetAudience: 전략 파트너 / 전략 자문 + Partner Program 신청 waitlist
· Problems: 콘텐츠 소진 / 경쟁사 분석 부재 / 데이터 부족 3축
· UseCases: 진단·전략·KPI(Medical) · 수주·자문·포트폴리오(Agency)
- discover-channels Edge Function: manualChannels 수용 — 사용자 붙여넣은
URL이 Firecrawl 스크래핑보다 우선, naverPlace/gangnamUnni 직접 주입
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
76 lines
3.0 KiB
TypeScript
76 lines
3.0 KiB
TypeScript
/**
|
|
* CTA — 랜딩 페이지 하단 최종 전환 섹션.
|
|
*
|
|
* PART III 피봇:
|
|
* - Hero와 동일한 입력 로직(url state/navigate)을 중복 구현하던 문제 해소.
|
|
* 이제 `<MultiChannelInput variant="cta" />` 한 줄로 통일.
|
|
* - "무료 진단" 언급 삭제 — 계약 기반 모델 반영.
|
|
* - 헤드라인은 전략 소유권 메시지로 피봇 ("Own Your Marketing Strategy.").
|
|
* - 보조 CTA "가격 플랜 보기" 추가 (/pricing?from=cta).
|
|
*/
|
|
import { useNavigate, Link } from 'react-router';
|
|
import { motion } from 'motion/react';
|
|
import MultiChannelInput, { type AnalyzePayload } from './MultiChannelInput';
|
|
|
|
export default function CTA() {
|
|
const navigate = useNavigate();
|
|
|
|
const handleAnalyze = (payload: AnalyzePayload) => {
|
|
navigate('/report/loading', {
|
|
state: {
|
|
url: payload.primaryUrl,
|
|
manualChannels: payload.manualChannels,
|
|
},
|
|
});
|
|
};
|
|
|
|
return (
|
|
<section className="py-20 md:py-24 bg-primary-900 text-white px-6 relative overflow-hidden">
|
|
<div className="absolute inset-0 -z-10 bg-[radial-gradient(ellipse_at_center,_var(--tw-gradient-stops))] from-indigo-900 via-primary-900 to-primary-900 opacity-80"></div>
|
|
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[600px] h-[600px] bg-purple-500/20 rounded-full blur-[100px] pointer-events-none"></div>
|
|
|
|
<div className="max-w-4xl mx-auto text-center relative z-10">
|
|
<motion.h2
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6 }}
|
|
className="text-4xl md:text-5xl font-serif font-bold mb-4 leading-tight text-transparent bg-clip-text bg-gradient-to-r from-[#fff3eb] via-[#e4cfff] to-[#f5f9ff]"
|
|
>
|
|
Own Your Marketing Strategy.
|
|
</motion.h2>
|
|
|
|
<motion.p
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6, delay: 0.1 }}
|
|
className="text-lg md:text-xl text-purple-200 mb-10 max-w-2xl mx-auto font-light"
|
|
>
|
|
URL 하나로 시작하는 AI 마케팅 전략 플래너.
|
|
</motion.p>
|
|
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6, delay: 0.2 }}
|
|
className="w-full"
|
|
>
|
|
<MultiChannelInput variant="cta" onAnalyze={handleAnalyze} />
|
|
|
|
{/* 보조 CTA — 가격 플랜 */}
|
|
<div className="mt-6 flex justify-center">
|
|
<Link
|
|
to="/pricing?from=cta"
|
|
className="inline-flex items-center gap-2 text-sm font-semibold text-purple-200 hover:text-white transition-colors underline-offset-4 hover:underline"
|
|
>
|
|
가격 플랜 보기 →
|
|
</Link>
|
|
</div>
|
|
</motion.div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|