First commit
This commit is contained in:
143
src/components/AboutSection.tsx
Normal file
143
src/components/AboutSection.tsx
Normal file
@@ -0,0 +1,143 @@
|
||||
import React from 'react';
|
||||
import { motion } from 'framer-motion';
|
||||
import { BookOpen, Target, Sparkles, Milestone, Award, Lightbulb, Cpu, ShieldCheck } from 'lucide-react';
|
||||
|
||||
export const AboutSection: React.FC = () => {
|
||||
const offerings = [
|
||||
{ icon: <Milestone className="w-5 h-5 text-neutral-800" />, name: "Guidance & Training" },
|
||||
{ icon: <Cpu className="w-5 h-5 text-neutral-800" />, name: "Infrastructure support" },
|
||||
{ icon: <Target className="w-5 h-5 text-neutral-800" />, name: "1-on-1 Mentorship" },
|
||||
{ icon: <Award className="w-5 h-5 text-neutral-800" />, name: "Seed Funding Support" },
|
||||
{ icon: <Sparkles className="w-5 h-5 text-neutral-800" />, name: "IPR & Patent Filing" },
|
||||
{ icon: <ShieldCheck className="w-5 h-5 text-neutral-800" />, name: "Networking Events" }
|
||||
];
|
||||
|
||||
const curriculumPoints = [
|
||||
{ title: "Academic Ideation", desc: "Formulate ideas with solid validation and engineering frameworks built into your college curriculum." },
|
||||
{ title: "Business Model Design", desc: "Map your target market, construct unit economics, and define your revenue capture strategy." },
|
||||
{ title: "IPR & Pitch Readiness", desc: "Gain legal structures, learn patent filing mechanics, and polish your investor-facing deck." }
|
||||
];
|
||||
|
||||
return (
|
||||
<section
|
||||
id="about"
|
||||
className="relative w-full py-24 md:py-32 px-6 md:px-12 bg-white overflow-hidden"
|
||||
>
|
||||
<div className="absolute top-0 right-1/3 w-96 h-96 bg-brand-orange/5 rounded-full blur-[120px] pointer-events-none" />
|
||||
|
||||
<div className="max-w-7xl mx-auto space-y-24 md:space-y-32">
|
||||
{/* Core Vision & Mission */}
|
||||
<div className="grid grid-cols-1 lg:grid-cols-12 gap-12 items-start">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, x: -30 }}
|
||||
whileInView={{ opacity: 1, x: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.8 }}
|
||||
className="lg:col-span-5 space-y-6"
|
||||
>
|
||||
<span className="font-sans text-xs font-bold uppercase tracking-widest text-[#e91e63] bg-[#e91e63]/10 px-3.5 py-1.5 rounded-full">
|
||||
Who We Are
|
||||
</span>
|
||||
<h2 className="font-heading text-3xl md:text-5xl font-extrabold text-neutral-900 tracking-tight leading-none">
|
||||
Empowering Student Founders
|
||||
</h2>
|
||||
<p className="font-sans text-sm md:text-base text-neutral-500 leading-relaxed">
|
||||
RAISE Incubator is a dedicated Section 8 (not-for-profit) company situated directly within the Rajalakshmi Institute of Technology campus. We transform engineering ideas into market-viable products.
|
||||
</p>
|
||||
|
||||
{/* Offerings Icons List */}
|
||||
<div className="pt-6">
|
||||
<h4 className="font-heading font-bold text-xs uppercase tracking-wider text-neutral-400 mb-4">
|
||||
What We Provide
|
||||
</h4>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
{offerings.map((item, i) => (
|
||||
<div key={i} className="flex items-center gap-2.5">
|
||||
<div className="p-2 bg-neutral-50 border border-neutral-200/50 rounded-lg">
|
||||
{item.icon}
|
||||
</div>
|
||||
<span className="font-sans text-xs font-bold text-neutral-700">{item.name}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, x: 30 }}
|
||||
whileInView={{ opacity: 1, x: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.8 }}
|
||||
className="lg:col-span-7 grid grid-cols-1 sm:grid-cols-2 gap-6"
|
||||
>
|
||||
{/* Vision Card */}
|
||||
<div className="bg-neutral-50 rounded-3xl p-6 md:p-8 border border-neutral-200/60 shadow-premium">
|
||||
<div className="w-12 h-12 rounded-xl bg-neutral-900 text-white flex items-center justify-center mb-6">
|
||||
<Target className="w-6 h-6" />
|
||||
</div>
|
||||
<h3 className="font-heading text-xl font-bold text-neutral-900 mb-3">Our Vision</h3>
|
||||
<p className="font-sans text-xs md:text-sm text-neutral-500 leading-relaxed">
|
||||
To create a vibrant innovation and entrepreneurship ecosystem that transforms ideas into impactful startups, fosters industry-relevant technologies, and nurtures socially responsible innovators.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Mission Card */}
|
||||
<div className="bg-neutral-50 rounded-3xl p-6 md:p-8 border border-neutral-200/60 shadow-premium">
|
||||
<div className="w-12 h-12 rounded-xl bg-neutral-900 text-white flex items-center justify-center mb-6">
|
||||
<Lightbulb className="w-6 h-6" />
|
||||
</div>
|
||||
<h3 className="font-heading text-xl font-bold text-neutral-900 mb-3">Our Mission</h3>
|
||||
<ul className="font-sans text-xs md:text-sm text-neutral-500 space-y-3 list-disc pl-4 leading-relaxed">
|
||||
<li>Promote entrepreneurial thinking among students & faculty through structured ideation.</li>
|
||||
<li>Facilitate industry partnerships, IP/Patent creation, and critical seed funding.</li>
|
||||
<li>Align initiatives with national missions for long-term societal and economic impact.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</motion.div>
|
||||
</div>
|
||||
|
||||
{/* Unique Differentiator - Academic Course */}
|
||||
<div className="relative rounded-3xl bg-neutral-950 text-white p-8 md:p-16 border border-neutral-800 shadow-2xl overflow-hidden">
|
||||
{/* Subtle decoration */}
|
||||
<div className="absolute right-0 bottom-0 w-80 h-80 bg-brand-pink/10 rounded-full blur-[100px] pointer-events-none" />
|
||||
|
||||
<div className="grid grid-cols-1 lg:grid-cols-12 gap-12 items-center relative z-10">
|
||||
<div className="lg:col-span-5 space-y-6">
|
||||
<span className="font-sans text-xs font-bold uppercase tracking-widest text-yellow-400 bg-yellow-400/10 px-3.5 py-1.5 rounded-full border border-yellow-400/20">
|
||||
Unique Differentiator
|
||||
</span>
|
||||
<h2 className="font-heading text-3xl md:text-4xl font-extrabold tracking-tight leading-none">
|
||||
Not Just a Club. <br />An Academic Course.
|
||||
</h2>
|
||||
<p className="font-sans text-xs md:text-sm text-neutral-400 leading-relaxed">
|
||||
RAISE is different from regular university incubators. We integrate entrepreneurship as a structured academic course for RIT students.
|
||||
</p>
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="p-3 bg-neutral-800 rounded-xl">
|
||||
<BookOpen className="w-6 h-6 text-yellow-400" />
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-heading font-bold text-sm block">Structured Syllabus</span>
|
||||
<span className="font-sans text-xs text-neutral-400">Earn course credits while launching a company.</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Differentiator Milestones */}
|
||||
<div className="lg:col-span-7 space-y-6">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
{curriculumPoints.map((point, index) => (
|
||||
<div key={index} className="bg-neutral-900 border border-neutral-800 rounded-2xl p-5 space-y-3">
|
||||
<span className="font-heading font-extrabold text-sm text-neutral-600">0{index + 1}</span>
|
||||
<h4 className="font-heading font-bold text-sm text-white">{point.title}</h4>
|
||||
<p className="font-sans text-xs text-neutral-400 leading-relaxed">{point.desc}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user