{"version":3,"sources":["webpack:///./src/sections/Home/Contact.tsx"],"names":["Wrapper","styled","section","media","fullWidth","tabletLandscape","tablet","mobile","TextWrapper","div","Colors","softBlack","Label","Overline","blueYonder","Title","HeadlineM","Paragraph","Body","Lines","Form","form","Input","input","Text","textarea","Button","TextButton","Hidden","Contact","page","id","bullet","name","method","data-netlify","netlify-honeypot","action","type","value","placeholder","required","aria-required","aria-label"],"mappings":"wHAAA,4FA8FMA,EAAUC,IAAOC,QAAV,uEAAGD,CAAH,sKAKTE,IAAMC,UAGND,IAAME,gBAGNF,IAAMG,OAGNH,IAAMI,QAKJC,EAAcP,IAAOQ,IAAV,2EAAGR,CAAH,oSAGDS,IAAOC,UAUnBR,IAAMC,UAIND,IAAME,iBAKJO,EAAQX,YAAOY,KAAV,qEAAGZ,CAAH,oCAGES,IAAOI,YAGdC,EAAQd,YAAOe,KAAV,qEAAGf,CAAH,2EAGPE,IAAMI,QAKJU,EAAYhB,YAAOiB,KAAV,yEAAGjB,CAAH,kBAGTkB,EAAQlB,YAAOe,KAAV,qEAAGf,CAAH,kOAEAS,IAAOI,WAIdX,IAAMC,UAGND,IAAME,gBAMNF,IAAMI,QAQJa,EAAOnB,IAAOoB,KAAV,oEAAGpB,CAAH,goBAsBNE,IAAMC,UAOND,IAAME,gBAQNF,IAAMG,OAONH,IAAMI,QAWJe,EAAQrB,IAAOsB,MAAV,qEAAGtB,CAAH,8UAIWS,IAAOC,UAElBD,IAAOC,UAOdR,IAAMC,UAMND,IAAME,gBAINF,IAAMG,QAIJkB,EAAOvB,IAAOwB,SAAV,oEAAGxB,CAAH,4WAIYS,IAAOC,UAElBD,IAAOC,UAQdR,IAAMC,UAOND,IAAME,gBAGNF,IAAMG,QAKJoB,EAASzB,YAAO0B,KAAV,sEAAG1B,CAAH,iOAERE,IAAMC,UAGND,IAAME,gBAKNF,IAAMG,OAKNH,IAAMI,QAQJqB,EAAS3B,IAAOQ,IAAV,uEAAGR,CAAH,uCAMG4B,UAjT6B,SAAC,GAAa,IAAXC,EAAW,EAAXA,KAC7C,OACE,kBAAC9B,EAAD,CAAS+B,GAAG,WACV,kBAACvB,EAAD,KACE,kBAACI,EAAD,CAAOoB,QAAM,GAAb,WACA,kBAACjB,EAAD,qBACA,kBAACE,EAAD,qCAEE,6BAFF,4BAIE,6BAJF,yBAME,6BACA,6BAPF,6BAQ4B,6BAR5B,IAQmC,mDARnC,MAWF,kBAACE,EAAD,iBACA,kBAACC,EAAD,CACEW,GAAE,gBAAkBD,EACpBG,KAAI,WAAaH,EACjBI,OAAO,OACPC,eAAa,OACbC,mBAAiB,WACjBC,OAAO,eAEP,2BAAOC,KAAK,SAASL,KAAK,YAAYM,MAAK,WAAaT,IACxD,kBAACR,EAAD,CACEkB,YAAY,cACZT,GAAG,aACHE,KAAK,aACLK,KAAK,OACLG,UAAQ,EACRC,iBAAA,EACAC,aAAW,eAEb,kBAACrB,EAAD,CACEkB,YAAY,aACZF,KAAK,OACLG,UAAQ,EACRC,iBAAA,EACAX,GAAG,YACHE,KAAK,YACLU,aAAW,cAEb,kBAACf,EAAD,KACE,sEAEE,kBAACN,EAAD,CAAOgB,KAAK,OAAOL,KAAK,eAG5B,kBAACX,EAAD,CACEkB,YAAY,SACZF,KAAK,QACLG,UAAQ,EACRC,iBAAA,EACAC,aAAW,gBACXZ,GAAG,QACHE,KAAK,UAEP,kBAACX,EAAD,CACEkB,YAAY,WACZF,KAAK,OACLG,UAAQ,EACRC,iBAAA,EACAC,aAAW,YAEb,kBAACnB,EAAD,CACEgB,YAAY,WACZC,UAAQ,EACRC,iBAAA,EACAC,aAAW,UACXV,KAAK,gBAGP,6BACA,kBAACP,EAAD,CAAQY,KAAK,SAASL,KAAK,UAA3B","file":"sections-Home-Contact-3ecdcab7601c032afdd3.js","sourcesContent":["import React from 'react'\nimport styled from 'styled-components'\n\nimport Colors from 'styles/Colors'\n\nimport { Body, HeadlineM, Overline } from 'components/Text'\nimport { TextButton } from 'components/Buttons'\n\nimport media from 'styles/media'\n\nconst Contact: React.FC<{ page: string }> = ({ page }) => {\n  return (\n    <Wrapper id=\"contact\">\n      <TextWrapper>\n        <Label bullet>contact</Label>\n        <Title>Get in touch</Title>\n        <Paragraph>\n          Want to learn how we can help\n          <br />\n          automate your automation?\n          <br />\n          We're happy to connect\n          <br />\n          <br />\n          Fill out the form or call <br /> <strong>+1.617.302.6330</strong>.\n        </Paragraph>\n      </TextWrapper>\n      <Lines>////////</Lines>\n      <Form\n        id={`contact-form-${page}`}\n        name={`contact-${page}`}\n        method=\"POST\"\n        data-netlify=\"true\"\n        netlify-honeypot=\"Robot ID\"\n        action=\"/thank-you/\"\n      >\n        <input type=\"hidden\" name=\"form-name\" value={`contact-${page}`} />\n        <Input\n          placeholder=\"First Name*\"\n          id=\"first_name\"\n          name=\"first_name\"\n          type=\"text\"\n          required\n          aria-required\n          aria-label=\"First Name\"\n        />\n        <Input\n          placeholder=\"Last Name*\"\n          type=\"text\"\n          required\n          aria-required\n          id=\"last_name\"\n          name=\"last_name\"\n          aria-label=\"Last Name\"\n        />\n        <Hidden>\n          <label>\n            Don't fill this out if you are human\n            <Input type=\"text\" name=\"Robot ID\" />\n          </label>\n        </Hidden>\n        <Input\n          placeholder=\"Email*\"\n          type=\"email\"\n          required\n          aria-required\n          aria-label=\"Contact Email\"\n          id=\"email\"\n          name=\"email\"\n        />\n        <Input\n          placeholder=\"Company*\"\n          type=\"text\"\n          required\n          aria-required\n          aria-label=\"Company\"\n        />\n        <Text\n          placeholder=\"Message*\"\n          required\n          aria-required\n          aria-label=\"Message\"\n          name=\"description\"\n        />\n\n        <br />\n        <Button type=\"submit\" name=\"submit\">\n          Get in touch\n        </Button>\n      </Form>\n    </Wrapper>\n  )\n}\n\nconst Wrapper = styled.section`\n  height: 820px;\n  position: relative;\n  display: flex;\n  justify-content: flex-end;\n  ${media.fullWidth} {\n    height: 48.8vw;\n  }\n  ${media.tabletLandscape} {\n    height: 112.9vw;\n  }\n  ${media.tablet} {\n    height: 150vw;\n  }\n  ${media.mobile} {\n    height: 209vw;\n    min-height: 984px;\n  }\n`\nconst TextWrapper = styled.div`\n  width: 1080px;\n  height: 100%;\n  background: ${Colors.softBlack};\n  padding: 278px 0 0 378px;\n  @media screen and (max-width: 1390px) {\n    width: 1000px;\n  }\n  @media screen and (max-width: 1312px) {\n    width: 800px;\n    padding-left: 278px;\n    padding-right: 150px;\n  }\n  ${media.fullWidth} {\n    width: 64.3vw;\n    padding: 16.5vw 0 0 17.1vw;\n  }\n  ${media.tabletLandscape} {\n    width: 100%;\n    padding: 16.4vw 0 0 7vw;\n  }\n`\nconst Label = styled(Overline)`\n  color: white;\n  ::after {\n    color: ${Colors.blueYonder};\n  }\n`\nconst Title = styled(HeadlineM)`\n  color: white;\n  margin: 0.9vw 0 1.2vw;\n  ${media.mobile} {\n    line-height: 100%;\n    font-size: 36px;\n  }\n`\nconst Paragraph = styled(Body)`\n  color: white;\n`\nconst Lines = styled(HeadlineM)`\n  position: absolute;\n  color: ${Colors.blueYonder};\n  transform: rotate(-90deg);\n  top: 692px;\n  right: 62px;\n  ${media.fullWidth} {\n    top: 41.2vw;\n  }\n  ${media.tabletLandscape} {\n    left: 87.2vw;\n    right: auto;\n    top: 12.1vw;\n    font-size: 36px;\n  }\n  ${media.mobile} {\n    font-size: 24px;\n    line-height: 28px;\n    right: -11px;\n    left: auto;\n    width: fit-content;\n  }\n`\nconst Form = styled.form`\n  width: 606px;\n  height: 616px;\n  position: absolute;\n  top: 102px;\n  right: 852px;\n  background: white;\n  padding: 96px 88px 0;\n  * {\n    :focus {\n      outline: transparent;\n    }\n  }\n  @media screen and (max-width: 1460px) {\n    right: 780px;\n  }\n  @media screen and (max-width: 1390px) {\n    right: 700px;\n  }\n  @media screen and (max-width: 1312px) {\n    right: 600px;\n  }\n  ${media.fullWidth} {\n    width: 36.1vw;\n    height: 36.7vw;\n    top: 6.1vw;\n    left: 13.2vw;\n    right: auto;\n  }\n  ${media.tabletLandscape} {\n    width: 65.6vw;\n    height: 58.6vw;\n    top: 43.3vw;\n    left: 7vw;\n    right: auto;\n    padding: 6.2vw 4.6vw 0;\n  }\n  ${media.tablet} {\n    top: 59.9vw;\n    width: calc(100vw - 96px);\n    left: 48px;\n    height: 600px;\n    padding: 64px 48px 0;\n  }\n  ${media.mobile} {\n    left: 12px;\n    width: calc(100vw - 24px);\n    padding: 48px 12px;\n  }\n  @media screen and (max-width: 600px) {\n    height: 560px;\n    top: 376px;\n    // top: 100.2vw;\n  }\n`\nconst Input = styled.input`\n  font-family: 'Maison Neue Mono';\n  width: 100%;\n  height: 48px;\n  border: solid 1px ${Colors.softBlack};\n  background: rgba(124, 161, 161, 0.12);\n  color: ${Colors.softBlack};\n  padding-left: 24px;\n  font-size: 16px;\n  margin-bottom: 24px;\n  border-radius: 0;\n  box-shadow: none;\n\n  ${media.fullWidth} {\n    height: 2.7vw;\n    font-size: 1vw;\n    padding-left: 1.4vw;\n    margin-bottom: 1.4vw;\n  }\n  ${media.tabletLandscape} {\n    height: 4.6vw;\n    margin-bottom: 2.3vw;\n  }\n  ${media.tablet} {\n    height: 48px;\n  }\n`\nconst Text = styled.textarea`\n  font-family: 'Maison Neue Mono';\n  width: 100%;\n  height: 96px\n  border: solid 1px ${Colors.softBlack};\n  background: rgba(124, 161, 161, 0.12);\n  color: ${Colors.softBlack};\n  padding-left: 24px;\n  padding-top: 14px;\n  font-size: 16px;\n  margin-bottom: 1.4vw;\n  resize: none;\n  border-radius: 0;\n  box-shadow: none;\n  ${media.fullWidth} {\n    height: 5.7vw;\n    padding-left: 1.4vw;\n    padding-top: 0.8vw;\n    font-size: 0.9vw;\n    margin-bottom: 1.4vw;\n  }\n  ${media.tabletLandscape}{\n    height: 9.4vw;\n  }\n  ${media.tablet} {\n    height: 96px;\n    \n  }\n`\nconst Button = styled(TextButton)`\n  width: 136px;\n  ${media.fullWidth} {\n    width: 8.1vw;\n  }\n  ${media.tabletLandscape} {\n    margin-left: 43vw;\n    width: 13.2vw;\n    margin-top: 4.6vw;\n  }\n  ${media.tablet} {\n    width: 136px;\n    position: absolute;\n    right: 48px;\n  }\n  ${media.mobile} {\n    right: 12px;\n  }\n  @media screen and (max-width: 600px) {\n    width: calc(100% - 24px);\n    margin-top: 40px;\n  }\n`\nconst Hidden = styled.div`\n  height: 0;\n  width: 0;\n  overflow: hidden;\n`\n\nexport default Contact\n"],"sourceRoot":""}