import Image from "next/image"
import Link from "next/link"

export default function MissionSection() {
  return (
    <section className="section-small bg-neutral overflow-hidden">
      <div className="w-layout-blockcontainer container-default w-container">
        <div className="inner-container _1068px center">
          <div className="position-relative---z-index-1">
            <div data-w-id="384ef9a0-4895-c961-61d5-c03fea5bc587" style={{"opacity": "0", "filter": "blur(8px)"}} className="title-left-content-right">
              <div className="inner-container _460px">
                <div className="subtitle">
                      </div>
                <div className="mg-top-4x-extra-small">
                  <h2>
    The values behind our platform                    </h2>
                </div>
                <div className="mg-top-4x-extra-small">
                  <p>
    ipsum dolor sit amet consectetur nec quis suspendisse nulla.                    </p>
                </div>
              </div>
              <Link href="#more-positions" className="tertiary-button w-inline-block">
                <div className="button-content">
                  <div>
     More positions</div>
                  <div className="button-icon-wrapper secondary">
                    <svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 17 17" fill="none" className="squared-icon">
                      <path d="M6.25391 3.45312L10.7458 8.01563L6.25391 12.5781" stroke="currentColor" strokeWidth="1.5" strokeLinecap="square">
                      </path>
                    </svg>
                    <div className="button-icon-bg bg-neutral-800">
                    </div>
                    <div className="button-icon-bg-inside bg-neutral-600">
                    </div>
                  </div>
                </div>
              </Link>
            </div>
          </div>
        </div>
      </div>
      <div data-w-id="ff387e65-d5fd-6c3f-9251-5bd1999b387a" style={{"opacity": "0", "filter": "blur(8px)"}} className="container-large">
        <div className="corner-gradient-container">
          <div className="border-wrapper">
            <div className="w-layout-grid values-grid">
              <div className="value-item">
                <Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598eeb838c974f3def70a_accuracy-icon-quantum-webflow-template-1.svg" width={64} height={64} alt="Accuracy Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
                <div className="display-4 medium text-titles">Transparency</div>
              </div>
              <div className="value-item">
                <Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598f0e3caa08df665212f_trust-icon-quantum-webflow-template.svg" width={64} height={64} alt="Trust Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
                <div className="display-4 medium text-titles">
                     </div>
              </div>
              <div className="value-item">
                <Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598f1f8443cbbcf767239_intellect-icon-quantum-webflow-template.svg" width={64} height={64} alt="Intellect Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
                <div className="display-4 medium text-titles">Innovation</div>
              </div>
              <div className="value-item">
                <Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598f00141b9ac31a01989_velocity-icon-quantum-webflow-template.svg" width={64} height={64} alt="Velocity Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
                <div className="display-4 medium text-titles">
                     </div>
              </div>
              <div className="value-item">
                <Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598eefda8dc1927236eb3_clarity-icon-quantum-webflow-template.svg" width={64} height={64} alt="Clarify Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
                <div className="display-4 medium text-titles">Safety</div>
              </div>
              <div className="value-item">
                <Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598f04600b3080cab823c_scalability-icon-quantum-webflow-template.svg" width={64} height={64} alt="Scalability Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
                <div className="display-4 medium text-titles">Reliability</div>
              </div>
              <div className="value-item">
                <Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598ed8d91f474a2d4ecdc_excellence-icon-quantum-webflow-template.svg" width={64} height={64} alt="Excellence Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
                <div className="display-4 medium text-titles">Excellence</div>
              </div>
              <div className="value-item">
                <Image src="/assets/wubflow-shield-nocodexport-dev/68a342b7066c56fa60eb3af1/68a598ed19f8b3ed79933a38_communication-icon-quantum-webflow-template.svg" width={64} height={64} alt="Communication Icon - Quantum | Webflow Template" data-wf--icon-square--variant="small" className="icon-square w-variant-9e5d53ad-bad6-e5fc-88e0-62e38939214f" />
                <div className="display-4 medium text-titles">Communication</div>
              </div>
            </div>
          </div>
          <div data-wf--corner-gradient-outline--variant="small" className="corner-gradient-wrapper">
            <div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
            </div>
            <div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
            </div>
            <div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
            </div>
            <div className="corner-gradient-horizontal w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
            </div>
            <div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-left">
            </div>
            <div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 bottom-right">
            </div>
            <div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-left">
            </div>
            <div className="corner-gradient-vertical w-variant-8f36765c-221f-a254-35b4-28a5852d67d7 top-right">
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}