Renewal 2 - #5

Add contact.page.* keys (ko/en/jp) for badge, title, subtitle,
form labels/placeholders, inquiry options, success state, and
contact info. Replace all hardcoded strings in Contact.jsx with t().

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

Replace custom blobFloat animation with shared animate-blob class
(3 blobs: cyan top-left, emerald top-right, blue bottom-center).

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

Replace old flip-card/custom-component layout with new design:
- Hero: badge + gradient title + subtitle
- Mission & Vision: glass panels with icons
- History: alternating timeline (2024/2023/2022)
- Leadership: 4-col grid with hover overlay
- Recruit CTA: gradient background section
Add company.page.* i18n keys (ko/en/jp).

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

- Hero: left text + right SVG animated logistics flow
- 3 feature cards: warehouse automation, IMS, smart routing
- Dark stats section: progress bars + 4-cell metric grid
- Add commercelogi.page.* i18n keys (ko/en/jp)

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

Implements new design: hero with gradient title + pulse dots, 3 feature
cards with hover icon animation, Technical Edge section with spinning ring
visual, Performance stats panel, and CTA. Adds syncseries.page.* i18n keys
to ko/en/jp. Removes old animation component dependencies.

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

Replace broken cloud-upload SVG path (relative 'm' command caused wrong
rendering in React) with polyline+line+path form. Add box-shadow to icon
containers for visibility on glass panel background.

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

Hero with dark code window + floating security badge, 3 capability cards
with hover effects, dark/light split Traffic Control section with gateway
load chart, stats grid, and demo CTA with email input. Adds
syncapim.page.* i18n keys to ko/en/jp. Removes old animation component
dependencies.

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

- Replace framer-motion animations with new se-* CSS glass panel design
- Add live status card with ETA timer and reliability progress bar
- Add 3 feature cards (ETA prediction, alerts, analytics dashboard)
- Add Control Center split layout with predictive dashboard visual
- Add synceta.page.* i18n keys in ko/en/jp JSON files

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

- Replace framer-motion/animation components with new sb-* CSS glass panel design
- Add hero with network-dot background, badge, gradient title, and feature pills
- Add 3 feature cards (Pre-check Diagnostics, Incremental Sync, Rollback Protection)
- Add How It Works split layout with animated node diagram and progress bar
- Add syncboot.page.* i18n keys in ko/en/jp JSON files

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

Remove animate-blob (which has position:absolute) from diagram icons,
replace with sb-node-float animation. Fix connector line vertical
alignment using margin-top to center with icon height.

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

- Replace framer-motion/animation components with new sc-* CSS glass panel design
- Add hero with network-dot background, badge, gradient title, and 3 feature pills
- Add single-source split section with mock dashboard visual and sync badge
- Add 3 capability cards (Smart Asset Library, Enterprise Workflow, Real-time Collab)
- Add centered CTA with gradient glow effect
- Add synccms.page.* i18n keys in ko/en/jp JSON files

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

Updates ko.json page.* keys for SyncSeries, SyncBoot, SyncCMS, SyncEta,
SyncAPIM, CommerceLogi, and Company to use the Korean copy already present
in the non-page keys (hero, cta, values, features, team, etc.) on renewal-2.

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

Apply motion.div enter animations matching the UseCases.jsx pattern:
- Hero sections: opacity+y animate on mount
- Feature card grids: staggered whileInView (delay i*0.08)
- Section blocks (how-it-works, traffic, stats, CTA): whileInView fade-up
- Two-column heroes (APIM, CommerceLogi): dual animate with slight delay offset

Design unchanged; only motion wrapper divs added.

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

- Sync Series: letter squares → actual SVG icons per product
  (SyncBoot checkmark/cyan, SyncEta clock/teal, SyncCMS home/blue, SyncAPIM grid/purple)
- Commerce & Logi: 🏪 → truck SVG with cyan gradient matching CommerceLogi page
- Let's Talk: 💬 → speech bubble SVG with cyan-to-emerald gradient

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

On mobile, the alternating two-column timeline broke because empty
placeholder cells occupied space in column flex layout. Fix:
- Mobile: left-rail vertical line (left:7px), dot positioned
  absolutely on the rail, content flows to the right
- Hide empty placeholder cells (non --right/--left) on mobile
- Desktop ≥768px: restore original alternating left/right layout

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

The second .company-timeline-dot rule set position:relative globally,
cancelling the absolute positioning needed to pin the dot to the
left-rail line on mobile.

https://claude.ai/code/session_012eWBVLcmbKeaKHLVhavYU6

…-token-SHu7D

fix: remove duplicate timeline dot CSS that overrode mobile positioning