2025-12-18 18:47:56 +05:30

132 lines
6.6 KiB
TypeScript

'use client';
import Image from 'next/image';
import styles from './CoreServices.module.css';
export default function CoreServices() {
return (
<section className={styles.section}>
<div className="container">
<div className={styles.header}>
<div className={styles.subTitle}>OUR SOLUTIONS</div>
<h2 className={styles.title}>One Platform to Run <br />Every <span className="gradient-text">Social Activity</span></h2>
<p className={styles.subtitle}>
Social Buddy brings planning, publishing, monitoring, and performance tracking together in a single workspace. Instead of juggling multiple tools, teams can manage daily social operations efficiently while staying focused on growth and engagement.
</p>
</div>
<div className={styles.gridContainer}>
{/* Left Column */}
<div className={styles.columnLeft}>
<div className={styles.serviceItem}>
<div className={styles.iconWrapper}>
<Image
src="/images/home/control-panel.webp"
alt="Central Control Panel"
width={29}
height={29}
/>
</div>
<div className={styles.content}>
<h3>Central Control Panel</h3>
<p>Oversee multiple social profiles from one streamlined interface, making it easier to publish updates, monitor activity, and stay organized across platforms.</p>
</div>
</div>
<div className={styles.serviceItem}>
<div className={styles.iconWrapper}>
<Image
src="/images/home/automation.webp"
alt="Intelligent Posting Automation"
width={29}
height={29}
/>
</div>
<div className={styles.content}>
<h3>Intelligent Posting Automation</h3>
<p>Schedule content using engagement-driven timing recommendations that help posts reach audiences when attention levels are highest.</p>
</div>
</div>
<div className={styles.serviceItem}>
<div className={styles.iconWrapper}>
<Image
src="/images/home/planning.webp"
alt="Interactive Planning View"
width={29}
height={29}
/>
</div>
<div className={styles.content}>
<h3>Interactive Planning View</h3>
<p>Map out campaigns visually with a flexible content planner that helps teams align messaging weeks or months ahead.</p>
</div>
</div>
</div>
{/* Center Column - Image */}
<div className={styles.columnCenter}>
<div className={styles.centralVisual}>
<Image
src="/images/home/our-solutions-centre-main.webp"
alt="Our Solutions Centre"
width={203}
height={256}
className={styles.centerImage}
/>
</div>
</div>
{/* Right Column */}
<div className={styles.columnRight}>
<div className={styles.serviceItem}>
<div className={styles.iconWrapper}>
<Image
src="/images/home/insights.webp"
alt="Performance Insights"
width={29}
height={29}
/>
</div>
<div className={styles.content}>
<h3>Performance Insights & Exports</h3>
<p>Access clear performance summaries with customizable reports that help evaluate results and communicate value to stakeholders.</p>
</div>
</div>
<div className={styles.serviceItem}>
<div className={styles.iconWrapper}>
<Image
src="/images/home/team.webp"
alt="Team-Based Workflows"
width={29}
height={29}
/>
</div>
<div className={styles.content}>
<h3>Team-Based Workflows</h3>
<p>Coordinate seamlessly with internal teams or clients using structured review processes and permission-based access.</p>
</div>
</div>
<div className={styles.serviceItem}>
<div className={styles.iconWrapper}>
<Image
src="/images/home/message.webp"
alt="Unified Message Center"
width={29}
height={29}
/>
</div>
<div className={styles.content}>
<h3>Unified Message Center</h3>
<p>Handle comments, mentions, and private messages from different platforms in one response hub - so no interaction goes unnoticed.</p>
</div>
</div>
</div>
</div>
</div>
</section>
);
}