2025-12-11 11:30:18 +08:00

63 lines
2.9 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import React from 'react';
import Image from 'next/image';
const About: React.FC = () => {
return (
<section id="about" className="py-24 bg-feie-cream relative">
<div className="container mx-auto px-6">
<div className="flex flex-col md:flex-row items-center gap-16">
{/* Image/Visual Area */}
<div className="w-full md:w-1/2 relative">
<div className="aspect-4/5 bg-feie-dark rounded-sm overflow-hidden relative shadow-xl">
<Image
src="/assets/186-800x1000-grayscale.jpg"
alt="Office architecture"
fill
className="object-cover opacity-80 hover:scale-105 transition-transform duration-700"
/>
<div className="absolute inset-0 border border-feie-gold/30 m-4 pointer-events-none"></div>
</div>
<div className="absolute -bottom-10 -right-10 w-48 h-48 bg-feie-gold/10 -z-10 rounded-full blur-3xl"></div>
</div>
{/* Text Content */}
<div className="w-full md:w-1/2 space-y-8">
<h2 className="text-sm font-bold tracking-widest text-feie-gold uppercase mb-2"> About Us</h2>
<h3 className="text-4xl md:text-5xl font-serif text-feie-dark leading-tight">
<br />
<span className="italic text-gray-500"></span>
</h3>
<div className="space-y-6 text-gray-600 font-light leading-relaxed">
<p>
沿
</p>
<p>
"技术驱动、服务至上"
</p>
<p>
IT解决方案
</p>
</div>
<div className="pt-4 grid grid-cols-2 gap-8">
<div>
<h4 className="text-3xl font-serif text-feie-gold">100+</h4>
<p className="text-sm text-gray-500 uppercase tracking-wider mt-1"></p>
</div>
<div>
<h4 className="text-3xl font-serif text-feie-gold">24/7</h4>
<p className="text-sm text-gray-500 uppercase tracking-wider mt-1"></p>
</div>
</div>
</div>
</div>
</div>
</section>
);
};
export default About;