58 lines
2.2 KiB
TypeScript
58 lines
2.2 KiB
TypeScript
import React from 'react';
|
|
import { TrendingDown, Leaf, ThermometerSun, Wallet } from 'lucide-react';
|
|
|
|
const benefits = [
|
|
{
|
|
title: 'Znaczne oszczędności',
|
|
description: 'Nawet 70% niższe koszty ogrzewania w porównaniu do tradycyjnych źródeł ciepła, takich jak węgiel, olej czy gaz.',
|
|
icon: TrendingDown,
|
|
},
|
|
{
|
|
title: 'Ekologiczne ciepło',
|
|
description: 'Brak emisji spalin i zanieczyszczeń w miejscu działania. Pompa w 75% korzysta z odnawialnej energii z otoczenia.',
|
|
icon: Leaf,
|
|
},
|
|
{
|
|
title: 'Komfort całoroczny',
|
|
description: 'Bezobsługowy system zapewniający przyjemne ciepło zimą oraz chłodzenie i produkcję ciepłej wody użytkowej latem.',
|
|
icon: ThermometerSun,
|
|
},
|
|
{
|
|
title: 'Dotacje i ulgi',
|
|
description: 'Możliwość odliczenia od podatku oraz skorzystania z programów Czyste Powietrze lub Mój Prąd na pokrycie części kosztów.',
|
|
icon: Wallet,
|
|
},
|
|
];
|
|
|
|
export const BenefitsGrid = () => {
|
|
return (
|
|
<section className="py-16 bg-white">
|
|
<div className="container mx-auto px-4 md:px-8 max-w-7xl">
|
|
<div className="text-center max-w-2xl mx-auto mb-12">
|
|
<h2 className="text-3xl font-bold text-primary mb-4">Dlaczego warto wybrać pompę ciepła?</h2>
|
|
<p className="text-gray-600">
|
|
Pompa ciepła to obecnie najbardziej efektywne i przyszłościowe rozwiązanie do ogrzewania budynków.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
|
|
{benefits.map((item, idx) => {
|
|
const Icon = item.icon;
|
|
return (
|
|
<div key={idx} className="bg-gray-50 border border-gray-100 rounded-2xl p-8 hover:shadow-lg transition-shadow">
|
|
<div className="w-14 h-14 bg-accent/10 rounded-2xl flex items-center justify-center mb-6 text-accent">
|
|
<Icon className="w-7 h-7" />
|
|
</div>
|
|
<h3 className="text-xl font-bold text-primary mb-3">{item.title}</h3>
|
|
<p className="text-gray-600 text-sm leading-relaxed">
|
|
{item.description}
|
|
</p>
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|