This commit is contained in:
Iliyan Angelov
2025-10-10 02:01:46 +03:00
parent dd8eb1c7aa
commit f962401565
36 changed files with 2560 additions and 659 deletions

View File

@@ -2,9 +2,7 @@
import { useEffect } from "react";
import gsap from "gsap";
import { ScrollTrigger } from "gsap/dist/ScrollTrigger";
import Image from "next/legacy/image";
import Link from "next/link";
import thumb from "@/public/images/banner/cp-thumb.png";
const CareerBanner = () => {
useEffect(() => {
@@ -38,23 +36,77 @@ const CareerBanner = () => {
}, []);
return (
<section className="career-banner fix-top bg-black position-relative overflow-hidden">
<section className="career-banner fix-top bg-black position-relative overflow-hidden" style={{ minHeight: '50vh', paddingTop: '100px', paddingBottom: '60px' }}>
<div className="container">
<div className="row justify-content-end">
<div className="col-12 col-lg-11">
<div className="row align-items-center">
<div className="col-12 col-sm-11 col-md-10 col-xl-8 col-xxl-9">
<div className="cp-banner__content">
<h2 className="mt-8 fw-7 text-xxl title-anim text-white">
Grow your career the way you feel
</h2>
</div>
<div className="row justify-content-center align-items-center">
<div className="col-12 col-lg-10">
<div className="cp-banner__content text-center">
<h2 className="mt-8 fw-7 text-xxl title-anim text-white mb-5">
Build Your Career with Enterprise Excellence
</h2>
<p className="text-quinary fs-5 mb-5" style={{ maxWidth: '700px', margin: '0 auto 2rem' }}>
Join our global team of innovators, problem-solvers, and tech leaders building the future of digital solutions
</p>
</div>
</div>
</div>
{/* Job Categories with Icons */}
<div className="row justify-content-center mt-5 pt-4">
<div className="col-6 col-md-3 text-center mb-4">
<div className="job-category-card" style={{
padding: '2rem 1rem',
background: 'rgba(255,255,255,0.05)',
borderRadius: '12px',
border: '1px solid rgba(255,255,255,0.1)',
transition: 'all 0.3s ease'
}}>
<div className="icon-wrapper mb-3" style={{ fontSize: '3rem', color: '#00d4ff' }}>
<i className="fa-solid fa-code"></i>
</div>
<div className="col-12 col-sm-1 col-md-2 col-xl-4 col-xxl-3">
<div className="cp-banner-thumb dir-rtl">
<Image src={thumb} className="mh-300 unset" alt="Image" width={400} height={300} />
</div>
<h5 className="text-white fw-6 mb-2">Engineering</h5>
</div>
</div>
<div className="col-6 col-md-3 text-center mb-4">
<div className="job-category-card" style={{
padding: '2rem 1rem',
background: 'rgba(255,255,255,0.05)',
borderRadius: '12px',
border: '1px solid rgba(255,255,255,0.1)',
transition: 'all 0.3s ease'
}}>
<div className="icon-wrapper mb-3" style={{ fontSize: '3rem', color: '#ff6b9d' }}>
<i className="fa-solid fa-palette"></i>
</div>
<h5 className="text-white fw-6 mb-2">Design</h5>
</div>
</div>
<div className="col-6 col-md-3 text-center mb-4">
<div className="job-category-card" style={{
padding: '2rem 1rem',
background: 'rgba(255,255,255,0.05)',
borderRadius: '12px',
border: '1px solid rgba(255,255,255,0.1)',
transition: 'all 0.3s ease'
}}>
<div className="icon-wrapper mb-3" style={{ fontSize: '3rem', color: '#ffd93d' }}>
<i className="fa-solid fa-chart-line"></i>
</div>
<h5 className="text-white fw-6 mb-2">Business</h5>
</div>
</div>
<div className="col-6 col-md-3 text-center mb-4">
<div className="job-category-card" style={{
padding: '2rem 1rem',
background: 'rgba(255,255,255,0.05)',
borderRadius: '12px',
border: '1px solid rgba(255,255,255,0.1)',
transition: 'all 0.3s ease'
}}>
<div className="icon-wrapper mb-3" style={{ fontSize: '3rem', color: '#a78bfa' }}>
<i className="fa-solid fa-users"></i>
</div>
<h5 className="text-white fw-6 mb-2">Operations</h5>
</div>
</div>
</div>