import Heading from '@/components/reuseables/Heading'
import { cleanImage } from '@/layout/imageHandling'
import Image from 'next/image'
import React from 'react'
import { Container } from 'react-bootstrap'

const DigitalHowWeDoIt = (heading, data) => {

    return (
        <Container>
            <div className="section-title">
                {/* <span className="sub-title">{heading.Subtitle}</span> */}
                <Heading el="h2" heading={heading?.heading} />
            </div>
            <Image src={cleanImage(data?.DesktopImg?.url)} alt={data?.DesktopImg?.alternativeText || "image"} width={1000} height={1000} className='img-fluid d-none d-md-block' />
            <Image src={cleanImage(data?.MobileImg?.url)} alt={data?.MobileImg?.alternativeText || "image"} width={1000} height={1000} className='img-fluid d-block d-md-none' />
        </Container>
    )
}

export default DigitalHowWeDoIt