47 lines
1.8 KiB
TypeScript
47 lines
1.8 KiB
TypeScript
import React from 'react';
|
|
import Link from 'next/link';
|
|
import { Container } from '@/components/ui';
|
|
import Scribble from '@/components/Scribble';
|
|
|
|
export default function Hero() {
|
|
return (
|
|
<section className="relative h-[80vh] flex items-center justify-center overflow-hidden bg-neutral-dark">
|
|
<div className="absolute inset-0 z-0">
|
|
<video
|
|
className="w-full h-full object-cover"
|
|
autoPlay
|
|
muted
|
|
loop
|
|
playsInline
|
|
poster="/uploads/2025/02/Still-2025-02-10-104337_1.1.1.webp"
|
|
>
|
|
<source src="/uploads/2025/02/header.webm" type="video/webm" />
|
|
<source src="/uploads/2025/02/header.mp4" type="video/mp4" />
|
|
</video>
|
|
<div className="absolute inset-0 bg-gradient-to-b from-black/10 to-black/40" />
|
|
</div>
|
|
|
|
<Container className="relative z-10 text-left text-white w-full">
|
|
<div className="max-w-4xl">
|
|
<h1 className="text-4xl md:text-6xl lg:text-7xl font-bold mb-6 tracking-tight leading-tight">
|
|
We are helping to expand the energy cable networks for a
|
|
<span className="relative inline-block ml-4 mr-2">
|
|
<span className="relative z-10 text-white italic">green</span>
|
|
<Scribble variant="circle" className="w-[140%] h-[140%] -top-[20%] -left-[20%]" />
|
|
</span>
|
|
future
|
|
</h1>
|
|
<div className="mt-8">
|
|
<Link href="/contact" className="inline-flex items-center text-white text-xl font-medium group">
|
|
Let's talk
|
|
<span className="ml-2 w-8 h-8 border-2 border-white rounded-full flex items-center justify-center group-hover:bg-white group-hover:text-black transition-all">
|
|
→
|
|
</span>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</Container>
|
|
</section>
|
|
);
|
|
}
|