

<?php $__env->startSection('title', 'Ecommerce Solutions | DIGITAL STUDIO2'); ?>

<?php $__env->startPush('styles'); ?>
    <style>
        .platform-showcase {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
            gap: 2rem;
            margin: 3rem 0;
        }

        .platform-card-large {
            background: white;
            border-radius: var(--radius-xl);
            padding: 3rem;
            border: 2px solid var(--border-subtle);
            text-align: center;
            transition: all var(--transition-normal);
        }

        .platform-card-large:hover {
            transform: translateY(-8px);
            box-shadow: var(--shadow-xl);
            border-color: var(--primary-500);
        }

        .platform-icon {
            width: 80px;
            height: 80px;
            background: var(--primary-50);
            border-radius: var(--radius-full);
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
        }

        .platform-icon img {
            width: 48px;
            height: 48px;
        }

        .feature-list {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
            gap: 1rem;
        }

        .feature-item {
            background: var(--primary-50);
            border-radius: var(--radius-md);
            padding: 1.5rem;
            text-align: center;
        }

        .feature-icon {
            width: 48px;
            height: 48px;
            background: var(--primary-500);
            border-radius: var(--radius-full);
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1rem;
            color: white;
            font-size: 1.25rem;
        }
    </style>
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>
    <!-- Hero Section -->
    <section class="service-hero">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-10 text-center">
                    <div class="service-hero-content text-white">
                        <span class="badge bg-primary-100 text-primary mb-3 px-3 py-2 rounded-pill">
                            <i class="fas fa-shopping-cart me-2"></i> Ecommerce Solutions
                        </span>
                        <h1 class="display-3 fw-bold mb-4 text-white">
                            Ecommerce Website <br>
                            <span class="text-gradient">Solutions</span>
                        </h1>
                        <p class="lead mb-5 mx-auto" style="max-width: 800px;">
                            Empower your online store with our expert eCommerce solutions. We build scalable, secure,
                            and visually compelling ecommerce websites that drive conversions, simplify product
                            management, and offer seamless shopping experiences for your customers.
                        </p>
                        <div class="d-flex flex-wrap gap-3 justify-content-center">
                            <a href="<?php echo e(route('contact')); ?>" class="btn btn-primary btn-lg">
                                <i class="fas fa-calendar me-2"></i>
                                Request Free Quote
                            </a>
                            <a href="#platforms" class="btn btn-outline-light btn-lg">
                                <i class="fas fa-shopping-bag me-2"></i>
                                View Platforms
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Services Section -->
    <section id="services" class="service-section">
        <div class="container">
            <div class="text-center mb-5">
                <span class="badge bg-primary-100 text-primary mb-3 px-3 py-2 rounded-pill">
                    Our Services
                </span>
                <h2 class="mb-4">Ecommerce <br><span class="text-gradient">Solutions</span></h2>
                <p class="text-muted mx-auto" style="max-width: 800px;">
                    Boost your site performance with our comprehensive ecommerce design & development services.
                </p>
            </div>

            <div class="row g-4">
                <!-- Custom Ecommerce Design -->
                <div class="col-lg-8">
                    <div class="service-card">
                        <div class="service-icon">
                            <i class="fas fa-store"></i>
                        </div>
                        <h4 class="fw-bold mb-3">Custom Ecommerce Web Design</h4>
                        <p class="text-muted mb-4">
                            Our custom e-commerce web design service creates unique online stores that reflect your
                            brand's identity and meet your specific needs for functionality and user experience.
                        </p>
                        <div class="d-flex flex-wrap gap-2 mb-4">
                            <span class="badge bg-primary-100 text-primary px-3 py-2">
                                <i class="fas fa-paint-brush me-1"></i> Custom Design
                            </span>
                            <span class="badge bg-primary-100 text-primary px-3 py-2">
                                <i class="fas fa-mobile-alt me-1"></i> Responsive
                            </span>
                            <span class="badge bg-primary-100 text-primary px-3 py-2">
                                <i class="fas fa-search me-1"></i> SEO Optimised
                            </span>
                            <span class="badge bg-primary-100 text-primary px-3 py-2">
                                <i class="fas fa-tachometer-alt me-1"></i> High Performance
                            </span>
                        </div>
                        <a href="<?php echo e(route('contact')); ?>" class="text-primary fw-semibold d-flex align-items-center gap-2">
                            Design Your Store
                            <i class="fas fa-arrow-right"></i>
                        </a>
                    </div>
                </div>

                <div class="col-lg-4">
                    <div class="row g-4 h-100">
                        <!-- Platform Development -->
                        <div class="col-12">
                            <div class="service-card h-100">
                                <div class="service-icon">
                                    <i class="fas fa-code"></i>
                                </div>
                                <h4 class="fw-bold mb-3">Platform-Based Development</h4>
                                <p class="text-muted mb-4">
                                    We specialise in using popular e-commerce platforms like Shopify, WooCommerce, and
                                    Magento to build customised online stores.
                                </p>
                            </div>
                        </div>

                        <!-- CTA Card -->
                        <div class="col-12">
                            <div class="service-card bg-primary text-white">
                                <h4 class="fw-bold mb-3">Hire Ecommerce Expert</h4>
                                <p class="text-light opacity-90 mb-4">
                                    Get dedicated ecommerce developers for your project.
                                </p>
                                <a href="<?php echo e(route('contact')); ?>" class="btn btn-light btn-lg w-100 fw-bold">
                                    Get Started
                                </a>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Responsive Stores -->
                <div class="col-12">
                    <div class="service-card">
                        <div class="row align-items-center">
                            <div class="col-lg-5 mb-4 mb-lg-0">
                                <img src="<?php echo e(asset('assets/ecom service (2).png')); ?>" alt="Responsive Ecommerce"
                                    class="img-fluid rounded-3 shadow"
                                    onerror="this.src='https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D'">
                            </div>
                            <div class="col-lg-7">
                                <h4 class="fw-bold mb-3">Responsive & Mobile-Friendly Stores</h4>
                                <p class="text-muted mb-4">
                                    Our responsive and mobile-friendly e-commerce stores deliver an optimal shopping
                                    experience
                                    on all devices. This approach ensures easy navigation and seamless access to products,
                                    boosting customer engagement and increasing conversion rates.
                                </p>
                                <div class="d-flex flex-wrap gap-2">
                                    <span class="badge bg-primary-100 text-primary px-3 py-2">
                                        <i class="fas fa-mobile-alt me-1"></i> Mobile First
                                    </span>
                                    <span class="badge bg-primary-100 text-primary px-3 py-2">
                                        <i class="fas fa-tablet-alt me-1"></i> Tablet Optimised
                                    </span>
                                    <span class="badge bg-primary-100 text-primary px-3 py-2">
                                        <i class="fas fa-desktop me-1"></i> Desktop Perfect
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Platforms Section -->
    <section id="platforms" class="service-section bg-light">
        <div class="container">
            <div class="text-center mb-5">
                <span class="badge bg-primary-100 text-primary mb-3 px-3 py-2 rounded-pill">
                    Platforms
                </span>
                <h2 class="mb-4">Ecommerce <br><span class="text-gradient">Platforms</span></h2>
                <p class="text-muted mx-auto" style="max-width: 800px;">
                    We build on all major ecommerce platforms to deliver the perfect solution for your business.
                </p>
            </div>

            <div class="platform-showcase">
                <!-- Shopify -->
                <div class="platform-card-large">
                    <div class="platform-icon">
                        <img src="<?php echo e(asset('assets/shopify.svg')); ?>" alt="Shopify">
                    </div>
                    <h4 class="fw-bold mb-3">Shopify</h4>
                    <p class="text-muted mb-4">
                        All-in-one ecommerce platform perfect for businesses of all sizes.
                    </p>
                    <ul class="list-unstyled text-start mb-4">
                        <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Easy setup & management</li>
                        <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> 100+ payment gateways</li>
                        <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Mobile responsive themes</li>
                        <li><i class="fas fa-check-circle text-primary me-2"></i> 24/7 support</li>
                    </ul>
                    <a href="<?php echo e(route('contact')); ?>" class="btn btn-outline-primary w-100">
                        Build with Shopify
                    </a>
                </div>

                <!-- WooCommerce -->
                <div class="platform-card-large">
                    <div class="platform-icon">
                        <img src="<?php echo e(asset('assets/woocommerce.svg')); ?>" alt="WooCommerce">
                    </div>
                    <h4 class="fw-bold mb-3">WooCommerce</h4>
                    <p class="text-muted mb-4">
                        Powerful WordPress plugin for custom ecommerce solutions.
                    </p>
                    <ul class="list-unstyled text-start mb-4">
                        <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Complete customisation</li>
                        <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> SEO friendly</li>
                        <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Unlimited products</li>
                        <li><i class="fas fa-check-circle text-primary me-2"></i> Extensive plugins</li>
                    </ul>
                    <a href="<?php echo e(route('contact')); ?>" class="btn btn-outline-primary w-100">
                        Build with WooCommerce
                    </a>
                </div>

                <!-- Custom -->
                <div class="platform-card-large">
                    <div class="platform-icon">
                        <i class="fas fa-code text-primary" style="font-size: 2rem;"></i>
                    </div>
                    <h4 class="fw-bold mb-3">Custom Development</h4>
                    <p class="text-muted mb-4">
                        Bespoke ecommerce solutions built from scratch for unique requirements.
                    </p>
                    <ul class="list-unstyled text-start mb-4">
                        <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Tailored to your needs</li>
                        <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Advanced features</li>
                        <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Scalable architecture</li>
                        <li><i class="fas fa-check-circle text-primary me-2"></i> Complete ownership</li>
                    </ul>
                    <a href="<?php echo e(route('contact')); ?>" class="btn btn-outline-primary w-100">
                        Build Custom Solution
                    </a>
                </div>
            </div>
        </div>
    </section>

    <!-- Features Section -->
    <section class="service-section">
        <div class="container">
            <div class="text-center mb-5">
                <span class="badge bg-primary-100 text-primary mb-3 px-3 py-2 rounded-pill">
                    Features
                </span>
                <h2 class="mb-4">Ecommerce <br><span class="text-gradient">Features</span></h2>
                <p class="text-muted mx-auto" style="max-width: 800px;">
                    Comprehensive features to power your online store and drive sales.
                </p>
            </div>

            <div class="feature-list">
                <div class="feature-item">
                    <div class="feature-icon">
                        <i class="fas fa-shopping-cart"></i>
                    </div>
                    <h5 class="fw-bold mb-2">Shopping Cart</h5>
                    <p class="text-muted small">Seamless cart functionality with saved items</p>
                </div>
                <div class="feature-item">
                    <div class="feature-icon">
                        <i class="fas fa-credit-card"></i>
                    </div>
                    <h5 class="fw-bold mb-2">Payment Gateway</h5>
                    <p class="text-muted small">Multiple payment options with security</p>
                </div>
                <div class="feature-item">
                    <div class="feature-icon">
                        <i class="fas fa-search"></i>
                    </div>
                    <h5 class="fw-bold mb-2">Product Search</h5>
                    <p class="text-muted small">Advanced search with filters & sorting</p>
                </div>
                <div class="feature-item">
                    <div class="feature-icon">
                        <i class="fas fa-truck"></i>
                    </div>
                    <h5 class="fw-bold mb-2">Shipping Integration</h5>
                    <p class="text-muted small">Real-time shipping rates & tracking</p>
                </div>
                <div class="feature-item">
                    <div class="feature-icon">
                        <i class="fas fa-chart-line"></i>
                    </div>
                    <h5 class="fw-bold mb-2">Analytics Dashboard</h5>
                    <p class="text-muted small">Sales reports & customer insights</p>
                </div>
                <div class="feature-item">
                    <div class="feature-icon">
                        <i class="fas fa-user-shield"></i>
                    </div>
                    <h5 class="fw-bold mb-2">Security</h5>
                    <p class="text-muted small">SSL encryption & PCI compliance</p>
                </div>
                <div class="feature-item">
                    <div class="feature-icon">
                        <i class="fas fa-mobile-alt"></i>
                    </div>
                    <h5 class="fw-bold mb-2">Mobile App</h5>
                    <p class="text-muted small">Native mobile apps for iOS & Android</p>
                </div>
                <div class="feature-item">
                    <div class="feature-icon">
                        <i class="fas fa-headset"></i>
                    </div>
                    <h5 class="fw-bold mb-2">24/7 Support</h5>
                    <p class="text-muted small">Round-the-clock technical support</p>
                </div>
            </div>
        </div>
    </section>

    <!-- CTA Section -->
    <section class="service-cta">
        <div class="cta-pattern"></div>
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-8 text-center" data-aos="fade-up">
                    <div class="service-cta-content">
                        <h2 class="display-5 fw-bold mb-4">Ready to Launch Your Store?</h2>
                        <p class="lead mb-5 text-light opacity-90">
                            Let's build an ecommerce solution that drives sales and grows your business.
                        </p>

                        <div class="d-flex flex-wrap gap-3 justify-content-center">
                            <a href="<?php echo e(route('contact')); ?>" class="btn btn-primary btn-lg">
                                <i class="fas fa-calendar me-2"></i>
                                Start Ecommerce Project
                            </a>
                            <a href="<?php echo e(route('packages')); ?>" class="btn btn-outline-light btn-lg">
                                <i class="fas fa-tags me-2"></i>
                                View Pricing
                            </a>
                        </div>

                        <p class="mt-4 mb-0 text-light opacity-75">
                            <i class="fas fa-rocket me-1"></i> Launch in 30 days or less
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </section>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH C:\xampp\htdocs\maijitech-projects\company-projects\new brands\laravel1\brand3\resources\views/pages/services-ecom.blade.php ENDPATH**/ ?>