import s from './styles.module.scss';
import Image from 'next/image';
import { Button, Icons, PartnersSlider } from '@shared/ui';
import bg from '@public/images/bg-main.jpg';
import lines from '@public/images/bg-lines.png';

export default function Main() {
  return (
    <>
      <section className={s.Main}>
        <div className={s.BgWrapper}>
          <Image className={s.Background} src={bg} alt={''} />
        </div>
        <h2 className={s.Header}>
          Независимая оценка и экспертиза в <br /> Краснодарском крае
        </h2>
        <Image className={s.Lines} src={lines} alt={''} />
      </section>

      <section className={s.Row}>
        <div className={s.LeftBlock}>
          <div className={s.Rounded}>
            <p> 3300 </p>
            <p>оценок</p>
          </div>
          <div className={s.Rounded}>
            <p>2800</p>
            <p>экспертиз</p>
          </div>
        </div>
        <div className={s.RightBlock}>
          <div className={s.SubBlock}>
            <Icons.MapOutline width={64} height={64} color={'#FFFFFF'} />
            <p className={s.Text}>
              Мы производим независимую оценку и экспертизу на всей территории
              Краснодарского края и города Сочи
            </p>
          </div>
          <div className={s.SubBlock}>
            <Icons.Consultation width={64} height={64} color={'#FFFFFF'} />
            <p className={s.Text}>
              Клиентам предоставляется бесплатная юридическая консультация
            </p>
          </div>
        </div>
      </section>

      <section className={s.BottomRow}>
        <div className={s.LeftBlock}>
          <p className={s.LineTitle}>Остались вопросы?</p>
          <p className={s.LineText}>Свяжитесь с нами любым удобным способом</p>
        </div>
        <div className={s.RightBlock}>
          <Button>Написать в чат</Button>
          <Button>Бесплатный звонок</Button>
        </div>
      </section>

      <section className={s.Slider}>
        <h3 className={s.Title}>Наши клиенты и партнеры</h3>
        <PartnersSlider />
      </section>
    </>
  );
}
