873026a4a9
- Convert site from royal-blue theme to black/white monochrome (desaturate all blue-hued colors; keep WhatsApp green and error red) - Swap blue circular brand logo for mono YS mark; regenerate favicon/PWA icons - Add 6 Pudu robots (CC1 Pro, MT1 Max, MT1 Vac, T600, T600 Underride, BG1 Pro) - Fix favicon.ico to RGBA (Next 16 Turbopack decode) and Stripe apiVersion type Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
64 lines
2.3 KiB
TypeScript
64 lines
2.3 KiB
TypeScript
'use client';
|
|
|
|
const REASONS = [
|
|
{
|
|
title: 'UAE robotics portfolio',
|
|
body: 'Selected Unitree and Pudu Robotics solutions available in the UAE through YS Lootah Robotics for hospitality, security, education, and industry.',
|
|
accent: '#e7e7e7',
|
|
icon: 'M3 3h7v7H3V3Zm0 11h7v7H3v-7Zm11-11h7v7h-7V3Zm0 11h7v7h-7v-7Z',
|
|
},
|
|
{
|
|
title: 'Dubai sales and support',
|
|
body: 'A local Dubai team manages your inquiry, demo, deployment, and on-the-ground support not just a website with a contact form.',
|
|
accent: '#5e5e5e',
|
|
icon: 'M12 2 2 7v6c0 5 4 9 10 11 6-2 10-6 10-11V7l-10-5Z',
|
|
},
|
|
{
|
|
title: 'Custom configuration',
|
|
body: 'Configure persona, attire, and accessories for humanoid robots visualize your deployment before you order with our 3D configurator.',
|
|
accent: '#a8a8a8',
|
|
icon: 'M12 4a4 4 0 0 1 4 4v1h5v6h-5v1a4 4 0 0 1-8 0v-1H3V9h5V8a4 4 0 0 1 4-4Z',
|
|
},
|
|
{
|
|
title: 'End-to-end deployment',
|
|
body: 'From procurement and configuration to delivery, installation, training, and ongoing support we handle the full lifecycle.',
|
|
accent: '#e7e7e7',
|
|
icon: 'M3 12h4l3-7 4 14 3-7h4',
|
|
},
|
|
];
|
|
|
|
export function WhyUs() {
|
|
return (
|
|
<div
|
|
style={{
|
|
display: 'grid',
|
|
gap: '1rem',
|
|
gridTemplateColumns: 'repeat(auto-fit, minmax(min(260px, 100%), 1fr))',
|
|
}}
|
|
>
|
|
{REASONS.map((r) => (
|
|
<div key={r.title} className="card" style={{ padding: '1.75rem', display: 'flex', flexDirection: 'column', gap: '0.875rem' }}>
|
|
<div
|
|
style={{
|
|
width: 48,
|
|
height: 48,
|
|
borderRadius: 14,
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
background: `${r.accent}1A`,
|
|
border: `1px solid ${r.accent}55`,
|
|
}}
|
|
>
|
|
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke={r.accent} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
|
|
<path d={r.icon} />
|
|
</svg>
|
|
</div>
|
|
<h3 style={{ margin: 0, fontSize: '1.1rem', fontWeight: 600 }}>{r.title}</h3>
|
|
<p style={{ margin: 0, color: '#e7e7e7', fontSize: '0.92rem', lineHeight: 1.6 }}>{r.body}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|