export function Distance() {
  return (
    <div className="desktop:py-[70px] desktop:px-10 mobile:py-14 tablet:px-6 mobile:px-4">
      <h1 className="font-medium desktop:text-[64px] desktop:leading-[58px] tablet:text-[40px] tablet:leading-10 mobile:text-[28px] mobile:leading-7 text-[#ffffff] desktop:mb-14 tablet:mb-6 mobile:mb-4">
        Платформа GRAFF.training поволяет осуществлять{' '}
        <span
          className="bg-text-gradient bg-gradient-to-r from-[#798FFF] to-[#D375FF]"
          style={{
            backgroundClip: 'text',
            WebkitBackgroundClip: 'text',
            WebkitTextFillColor: 'transparent',
          }}
        >
          дистанционное обучение
        </span>{' '}
        с любого устройства
      </h1>
      <div className="xl:pl-64">
        <div className="tablet:grid desktop:gap-x-4 desktop:gap-y-6 tablet:gap-x-3 tablet:gap-y-4 desktop:grid-cols-2 tablet-figma:max-[956px]:grid-cols-[446px_1fr]">
          <p className="desktop:text-lg tablet:text-base mobile:text-sm text-[#ffffff] row-start-1 mobile:max-tablet:mb-6">
            Обучающиеся будут получать доступ к системе с высоко
            детализированной 3D графикой для прохождения сценариев на любом
            устройстве, без необходимости установки дополнительного ПО.
          </p>
          <img
            src="src/assets/datamining_2.png"
            alt=""
            className="row-start-2 mobile:max-tablet:mb-4"
          />
          <img
            src="src/assets/datamining_1.png"
            alt=""
            className="row-start-2 col-start-2 h-full"
          />
        </div>
      </div>
    </div>
  );
}
