{"version":3,"sources":["components/MapButtons.tsx","components/Common.tsx","components/AdditionalText.tsx","components/Container.tsx","images/icon_download.webp","components/DownloadBanner.tsx","components/FooterV2.tsx","images/people/dima-sayess.pwcimage.webp","images/people/melissa-rizk.pwcimage.webp","components/GetInTouch.tsx","images/linkedIn.gif","images/people/bajhat-el-darwivhe.pwcimage.jpg","images/people/tarek-el-zein.pwcimage.jpg","components/Header.tsx","images/dei-banner.jpg","components/HeaderBanner.tsx","components/IntroSection.tsx","services/index.ts","components/Modal.tsx","utils/contants.ts","components/MapLegend.tsx","components/Section.tsx","components/SidebarV2.tsx","components/SpiderChart.tsx","components/YearSlider.tsx","images/ellipse-grey.svg","images/ellipse-red.svg","images/striped-circle.png","visuals/DigitalEconomyMaturity.tsx","utils/format.ts","utils/lerp.ts","visuals/Map.tsx","visuals/Pillars.tsx","App.tsx","reportWebVitals.ts","index.tsx"],"names":["ButtonToggleValue","TextContainer","styled","div","props","noMargin","Title","h1","emphasis","Subtitle","h3","PlayButton","viewBox","style","height","d","PauseButton","CloseIcon","onClick","fill","className","altProps","points","HamburgerMenu","open","HamburgerContainer","AdditionalTextContainer","AdditionalText","Container","DownloadContainer","a","MainLink","Image","img","Content","h2","DownloadText","small","DownloadBanner","href","target","src","downloadIcon","BreadCrumbContainer","BreadcrumbList","ul","BreadCrumbItem","li","FooterLinksContainer","FooterLinks","Footer","zIndex","position","id","rel","paddingLeft","GetInTouchContainer","GridContainer","SocialFollow","SocialsContainer","span","SocialIcon","ContactUsContainer","ContactUsText","ContactList","PersonCard","Details","Name","Text","EmailContainer","LinkedIn","EmailLink","ContactCard","contact","image","alt","name","profilePageLink","designation","location","linkedIn","emailLink","GetInTouch","contactPersons","DimaSayessImage","MellissaRizkImage","map","person","link","BurgerMenu","HeaderContainer","NavContainer","nav","isActive","HeaderEl","MenuList","show","BackSubMenu","button","LogoContainer","BreadCrumbItemsList","Header","useState","setIsActive","isSubMenu","setIsSubMenu","isIndustries","setIsIndustries","isFunctions","setIsFunctions","isSolutions","setIsSolutions","isInsights","setIsInsights","isAboutUs","setIsAboutUs","isCareers","setIsCareers","isIdeation","setIsIdeation","clearAll","sliderActiveHeight","marginTop","backgroundColor","paddingTop","textDecoration","isMobile","window","innerWidth","e","preventDefault","showLogo","margin","width","VideoContainer","section","video","HeadingContainer","Heading","SubHeading","Category","HeaderBanner","bannerImage","IntroSectionContainer","DlButton","ButtonContainer","IntroSection","BASE_URL","getTopCountries","fetch","method","result","ok","success","error","statusText","json","getDigitalEconomyStages","getCountries","getCompareValues","countryName","firstCountry","data","foundation","talent","innovation","experience","localization","getDmiPillars","countryCode","year","dmiPillars","getGccOecdScore","dmiScore","ModalContainer","ModalBody","Modal","children","SpacedButtonContainer","ToggleButtonsContainer","ToggleButtons","selected","ModalToggle","StyledModal","ModalHeader","ModalCloseButton","SelectContainer","StyledSelect","Select","ChartContainer","StyledRadarChart","Radar","MapButtons","allCountries","resetToggles","handleButtonToggle","initialChartData","labels","datasets","hidden","label","borderColor","borderWidth","pointRadius","borderJoinStyle","initialSelectOption","value","buttonToggle","setbuttonToggle","showModel","setShowModal","countries","setCountries","countryA","setcountryA","countryB","setcountryB","chartData","setChartData","chartLoading","setChartLoading","useEffect","dot","color","alignItems","display","borderRadius","content","marginRight","border","colourStyles","control","styles","option","placeholder","input","singleValue","chartOptions","scale","r","suggestedMin","max","ticks","stepSize","scales","pointLabels","font","size","fontColor","fontStyle","lineHeight","maintainAspectRatio","plugins","legend","country","code","countryACompareValues","countryBCompareValues","dataset","countryAIndex","findIndex","o","countryBIndex","fontSize","options","onChange","DigitalLearner","toggleValue","newValue","DigitalIntelligent","DigitalDisruptors","CountryGpsCoords","gpsLat","gpsLong","ColorValues","red","ButtonWrapper","LegendButton","LegendWrapper","MapLegend","handleLegendClick","selectedValue","index","SectionWipeDiv","Section","SubPillarColors","SidebarOverlay","SidebarContainer","StyledCloseIcon","ContentContainer","GridItemContainer","bgColor","spaced","Flag","CountryName","Country","toLowerCase","CircleContainer","PillarName","SubPillarContainer","SubPillarName","SubPillarProgress","SubPillarScore","SubPillarBar","progress","SubPillar","subPillar","subPillarName","score","Pillar","pillar","text","buildStyles","textSize","textColor","pathColor","trailColor","strokeLinecap","strokeWidth","pillarName","subPillars","SidebarV2","pillars","handleClose","opacity","StyledSvg","svg","SpiderChart","stage","gcc5PlotStrokeRef","useRef","gcc5PlotFillRef","gcc4PlotFillRef","gcc3PlotFillRef","point1Label","point2Label","point3Label","point4Label","point5Label","animatePosition","gsap","timeline","STROKE_OFFSET_ARRAY","totalLength","current","getTotalLength","to","strokeDasharray","strokeDashoffset","plotFillArray","forEach","svgFill","i","fillOpacity","play","xmlns","transform","x","y","ref","SliderTrack","SliderThumb","SliderTrackContainer","RangeContainer","PlayButtonContainer","YearSlider","handleSliderChange","MAX","MIN","setValue","isPlaying","setIsPlaying","intervalIdRef","setInterval","clearInterval","marginLeft","newVal","length","values","step","min","renderTrack","onMouseDown","onTouchStart","renderThumb","isDragged","boxShadow","registerPlugin","ScrollTrigger","DigitalMaturityContainer","VisualContainer","Background","MetricContainer","UnderVisualText","MetricCircle","multiplier","CountryType","DmiValue","GrowthValue","MetricTextContainer","TopContainer","DigitalEconomyMaturity","gccValues","oecdValues","gccOecdValues","setGccOecdValues","maturityContainerRef","leftMetricImgRef","leftMetricRef","rightMetricImgRef","rightMetricRef","underVisualTextRef","oecdDmiRef","oecdgrowthRef","gccDmiRef","gccGrowthRef","gccDmiValue","oecdDmiValue","gccOecdValuesResponse","maturityContainer","leftMetricEl","leftMetricImgEl","rightMetricEl","rightMetricImgEl","underVisualTextEl","oecdDmiEl","oecdgrowthEl","gccDmiEl","gccGrowthEl","getAnimationStartEnd","scrollTrigger","trigger","markers","start","end","scrub","animateText","fromTo","duration","innerHTML","snap","flexDirection","stripedCircle","ellipseGrey","ellipseRed","formatCountryClassnames","replaceAll","lerp","clamp","Math","rangeMap","x1","y1","x2","y2","invlerp","rangeMapArray","dest","Array","_","lerpArray","item","Card","CardContent","IndexContainer","Index","MaturityIndex","CircleIndicator","StyledMapButtons","StyledMapLegend","StyledYearSlider","Map","initialButtonToggle","initialTopCountries","maturityIndex","mapRef","mapContainerRef","countriesContainerRef","topCountries","setTopCountries","opacityMap","setOpacityMap","scaleMap","setScaleMap","setAllCountries","economyStages","setEconomyStages","setYear","setButtonToggle","showSidebar","setShowSidebar","sidebarData","setSidebarData","sidebarCountry","setSidebarCountry","sidebarCode","setSidebarCode","resetToggle","setResetToggle","legendValue","setLegendValue","countryResult","maxValue","minValue","countriesContainer","mapObj","mapBounds","$node","querySelector","getBoundingClientRect","slice","countryGps","formattedCountryName","mapOffset","$mapObject","latLngToPoint","countryNode","countryBounds","yValue","xValue","background","ease","handleRegionClick","console","log","dmiPillarsResult","find","sort","b","localeCompare","draggable","zoomButtons","zoomOnScroll","containerStyle","padding","left","containerClassName","regionStyle","initial","stroke","regionsSelectable","onRegionTipShow","event","el","tooltipEl","economyStage","digitalEconomyStagePerYearItem","undefined","rank","onRegionClick","series","stagesPerYear","filteredStages","filter","floor","ceil","regions","attribute","getMapSeries","num","Intl","NumberFormat","notation","compactDisplay","format","FullPageContainer","inView","FullPageSection","PillarTitle","PillarText","DummyElement","SpiderChartContainer","StyledSpiderChart","TitleContainer","Pillars","currentStage","setCurrentStage","useInView","threshold","fpContainerRef","fpContainerInView","section0Ref","section0InView","section1Ref","section1InView","section2Ref","section2InView","section3Ref","section3InView","section4Ref","section4InView","section5Ref","section5InView","bottom","paddingBottom","FullHeightDiv","AppContainer","App","reportWebVitals","onPerfEntry","Function","then","getCLS","getFID","getFCP","getLCP","getTTFB","ReactDOM","render","StrictMode","document","getElementById"],"mappings":"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","file":"static/js/main.bf07c274.chunk.js","sourcesContent":["import { Chart } from \"chart.js\";\n// import ChartJsPluginDatalabels from \"chartjs-plugin-datalabels\";\nimport { useEffect, useState } from \"react\";\nimport { Radar } from \"react-chartjs-2\";\nimport Select from \"react-select\";\nimport { getCompareValues } from \"services\";\nimport styled, { css } from \"styled-components\";\nimport { Country } from \"visuals/Map\";\nimport { CloseIcon } from \"./Common\";\nimport Modal from \"./Modal\";\n\n// Chart.register(ChartJsPluginDatalabels);\n\ninterface MapButtonProps {\n  className?: string;\n  allCountries: Country[];\n  resetToggles?: boolean;\n  handleButtonToggle: (_: ButtonToggleValue, value: boolean) => void;\n}\n\nexport enum ButtonToggleValue {\n  DigitalLearner,\n  DigitalIntelligent,\n  DigitalDisruptors,\n}\n\nexport interface ButtonToggle {\n  button: ButtonToggleValue | null;\n  value: boolean;\n}\n\ninterface ToggleItemProps {\n  selected?: boolean;\n}\n\ninterface SelectOptions {\n  value: string;\n  label: string;\n}\n\ninterface ChartData {\n  labels: string[];\n  datasets: ChartDataset[];\n}\n\ninterface ChartDataset {\n  hidden: boolean;\n  label: string;\n  data?: number[];\n  backgroundColor: string;\n  borderColor: string;\n  borderWidth: number;\n  pointRadius: number;\n  borderJoinStyle: string;\n  // datalabels: any;\n}\n\nconst SpacedButtonContainer = styled.div`\n  display: flex;\n  justify-content: space-between;\n  margin-top: 30px;\n\n  @media (max-width: 768px) {\n    flex-direction: column-reverse;\n  }\n`;\n\nconst ToggleButtonsContainer = styled.div`\n  border: 1px solid #cecece;\n  padding: 5px;\n  border-radius: 50px;\n  display: flex;\n\n  @media (max-width: 768px) {\n    border-radius: 30px;\n    flex-direction: column;\n    margin-top: 20px;\n  }\n`;\n\nconst ToggleButtons = styled.button<ToggleItemProps>`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: normal;\n  font-size: 18px;\n  line-height: 44px;\n  text-align: center;\n  letter-spacing: -0.5px;\n  color: ${(props) => (props.selected ? \"#ffffff\" : \"#464646\")};\n  padding: 0 40px;\n  border: none;\n  background-color: ${(props) => (props.selected ? \"#000000\" : \"#efefef\")};\n  cursor: pointer;\n\n  :first-child {\n    border-top-left-radius: 50px;\n    border-bottom-left-radius: 50px;\n  }\n  :last-child {\n    border-top-right-radius: 50px;\n    border-bottom-right-radius: 50px;\n  }\n\n  @media (min-width: 768px) {\n    :hover {\n      color: #ffffff;\n      background-color: #000000;\n    }\n  }\n\n  @media (max-width: 768px) {\n    :first-child {\n      border-top-left-radius: 30px;\n      border-top-right-radius: 30px;\n      border-bottom-left-radius: 0px;\n    }\n    :last-child {\n      border-bottom-left-radius: 30px;\n      border-bottom-right-radius: 30px;\n      border-top-right-radius: 0px;\n    }\n  }\n`;\n\nconst ModalToggle = styled.button`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: bold;\n  font-size: 18px;\n  line-height: 44px;\n  text-align: center;\n  letter-spacing: -0.5px;\n  color: #ffffff;\n  padding: 0 40px;\n  border: none;\n  background-color: #000000;\n  cursor: pointer;\n  border-radius: 50px;\n`;\n\nconst StyledModal = styled(Modal)`\n  @media (max-width: 768px) {\n    width: 90vw;\n    height: 70vh;\n  }\n\n  @media (min-width: 768px) {\n    width: 550px;\n    height: 370px;\n  }\n  @media (min-width: 992px) {\n    width: 770px;\n    height: 515px;\n  }\n  @media (min-width: 1200px) {\n    width: 970px;\n    height: 650px;\n  }\n`;\n\nconst ModalHeader = styled.div`\n  height: 72px;\n  display: flex;\n  justify-content: space-between;\n  background-color: #000;\n  padding: 0 30px;\n  align-items: center;\n\n  & span {\n    color: #fff;\n    font-size: 24px;\n    font-weight: \"bold\";\n  }\n\n  @media (max-width: 768px) {\n    padding: 0px 15px;\n\n    & span {\n      font-size: 20px;\n    }\n  }\n`;\n\nconst ModalCloseButton = styled.button`\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n`;\n\nconst ModalBody = styled.div`\n  padding: 30px 60px;\n  text-align: left;\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n\n  @media (max-width: 768px) {\n    padding: 10px 15px;\n  }\n`;\n\nconst SelectContainer = styled.div`\n  display: flex;\n  justify-content: space-between;\n  margin: 20px 0;\n\n  @media (max-width: 768px) {\n    flex-direction: column;\n    margin: 10px 0;\n  }\n`;\n\nconst StyledSelect = styled(Select)`\n  flex-grow: 1;\n  :first-child {\n    margin-right: 20px;\n  }\n  :last-child {\n    margin-left: 20px;\n  }\n\n  @media (max-width: 768px) {\n    margin-bottom: 20px;\n    :first-child {\n      margin-right: 0px;\n    }\n    :last-child {\n      margin-left: 0px;\n    }\n  }\n`;\n\nconst ChartContainer = styled.div`\n  flex-grow: 1;\n`;\n\nconst StyledRadarChart = styled(Radar)`\n  height: 100%;\n`;\n\nconst MapButtons = ({\n  className,\n  allCountries,\n  resetToggles,\n  handleButtonToggle,\n}: MapButtonProps) => {\n  // Initial values\n  const initialChartData: ChartData = {\n    labels: [\n      \"Digital foundations\",\n      \"Digital talent\",\n      \"Digital innovation\",\n      \"Digital adoption\",\n      \"Digital localization\",\n    ],\n    datasets: [\n      {\n        hidden: true,\n        label: \"countryA\",\n        data: [0, 0, 0, 0, 0],\n        backgroundColor: \"#DB536A33\",\n        borderColor: \"#DB536A\",\n        borderWidth: 5,\n        pointRadius: 0,\n        borderJoinStyle: \"round\",\n        // datalabels: {\n        //   color: \"#FF6384\",\n        //   backgroundColor: \"rgba(255, 255, 255, 0.7)\",\n        //   align: \"start\",\n        // },\n      },\n      {\n        hidden: true,\n        label: \"countryB\",\n        data: [0, 0, 0, 0, 0],\n        backgroundColor: \"rgba(144, 144, 144, 0.1)\",\n        borderColor: \"#CFCFCF\",\n        borderWidth: 5,\n        pointRadius: 0,\n        borderJoinStyle: \"round\",\n        // datalabels: {\n        //   color: \"#909090\",\n        //   backgroundColor: \"rgba(255, 255, 255, 0.7)\",\n        //   align: \"end\",\n        // },\n      },\n    ],\n  };\n  const initialSelectOption: SelectOptions = {\n    label: \"\",\n    value: \"\",\n  };\n\n  // Component state\n  const [buttonToggle, setbuttonToggle] = useState<ButtonToggle>({\n    button: null,\n    value: false,\n  });\n  const [showModel, setShowModal] = useState(false);\n  const [countries, setCountries] = useState<SelectOptions[]>();\n  const [countryA, setcountryA] = useState<SelectOptions>(initialSelectOption);\n  const [countryB, setcountryB] = useState<SelectOptions>(initialSelectOption);\n  const [chartData, setChartData] = useState<ChartData>(initialChartData);\n  const [chartLoading, setChartLoading] = useState(true);\n\n  useEffect(() => {\n    if (resetToggles) {\n      setbuttonToggle({\n        button: null,\n        value: false,\n      });\n    }\n  }, [resetToggles]);\n\n  // Configs\n  const dot = (color: string) => ({\n    alignItems: \"center\",\n    display: \"flex\",\n\n    \":before\": {\n      backgroundColor: `${color}33`,\n      borderRadius: 10,\n      content: '\"\"',\n      display: \"block\",\n      marginRight: 8,\n      border: `2px solid ${color}`,\n      height: 10,\n      width: 10,\n    },\n  });\n\n  const colourStyles = (color = \"#DB536A\") => ({\n    control: (styles: any): React.CSSProperties => ({\n      ...styles,\n      backgroundColor: \"white\",\n    }),\n    option: (styles: any): React.CSSProperties => {\n      return {\n        ...styles,\n        ...dot(color),\n      };\n    },\n    placeholder: (styles: any): React.CSSProperties => ({\n      ...styles,\n      ...dot(color),\n      color: \"#000\",\n    }),\n    input: (styles: any): React.CSSProperties => ({ ...styles, ...dot(color) }),\n    singleValue: (styles: any): React.CSSProperties => ({\n      ...styles,\n      ...dot(color),\n    }),\n  });\n\n  const chartOptions = {\n    scale: {\n      r: {\n        suggestedMin: 0,\n        max: 100,\n      },\n      ticks: {\n        stepSize: 20,\n      },\n    },\n    scales: {\n      r: {\n        pointLabels: {\n          font: {\n            size: window.innerWidth <= 768 ? 14 : 18,\n            fontColor: \"#ffffff\",\n            fontStyle: \"bold\",\n            lineHeight: 1,\n          },\n        },\n      },\n    },\n    maintainAspectRatio: false,\n    plugins: {\n      legend: {\n        display: false,\n      },\n      // datalabels: {\n      //   color: \"#FF6384\",\n      //   backgroundColor: \"rgba(255, 255, 255, 0.9)\",\n      //   borderRadius: 60,\n      //   align: \"end\",\n      //   font: {\n      //     size: window.innerWidth <= 768 ? 18 : 20,\n      //   },\n      // },\n    },\n  };\n\n  // Effects\n  useEffect(() => {\n    (async () => {\n      setCountries(\n        allCountries.map((country) => {\n          return {\n            value: country.code ?? country.country,\n            label: country.country,\n          };\n        })\n      );\n    })();\n  }, [allCountries]);\n\n  useEffect(() => {\n    (async () => {\n      setChartLoading(true);\n\n      const countryACompareValues = await getCompareValues(countryA.label);\n      const countryBCompareValues = await getCompareValues(countryB.label);\n\n      let dataset = chartData.datasets;\n\n      const countryAIndex = dataset.findIndex((o) => o.label === \"countryA\");\n      if (countryACompareValues.success && countryAIndex !== -1) {\n        dataset[countryAIndex].data = countryACompareValues.data;\n        dataset[countryAIndex].hidden = false;\n      }\n\n      const countryBIndex = dataset.findIndex((o) => o.label === \"countryB\");\n      if (countryBCompareValues.success && countryBIndex !== -1) {\n        dataset[countryBIndex].data = countryBCompareValues.data;\n        dataset[countryBIndex].hidden = false;\n      }\n\n      setChartData({\n        ...initialChartData,\n        datasets: dataset,\n      });\n      (countryACompareValues.success || countryBCompareValues.success) &&\n        setChartLoading(false);\n    })();\n  }, [countryA, countryB]);\n\n  return (\n    <>\n      <StyledModal show={showModel}>\n        <ModalHeader>\n          <span>Compare and contrast</span>\n          <ModalCloseButton onClick={() => setShowModal(false)}>\n            <CloseIcon />\n          </ModalCloseButton>\n        </ModalHeader>\n        <ModalBody>\n          <span style={{ fontSize: \"18px\", lineHeight: \"20px\" }}>\n            Select comparatives\n          </span>\n          <SelectContainer>\n            <StyledSelect\n              options={countries}\n              styles={colourStyles(\"#DB536A\")}\n              value={countryA}\n              onChange={(selected: SelectOptions) => {\n                setcountryA(selected);\n              }}\n              placeholder={() => \"Type to search\"}\n            />\n            <StyledSelect\n              options={countries}\n              styles={colourStyles(\"#CFCFCF\")}\n              value={countryB}\n              onChange={(selected: SelectOptions) => {\n                setcountryB(selected);\n              }}\n            />\n          </SelectContainer>\n          <ChartContainer>\n            {chartLoading &&\n              (!countryA.value || !countryB.value\n                ? \"Select countries to compare\"\n                : \"Loading\")}\n            {!chartLoading && (\n              <StyledRadarChart data={chartData} options={chartOptions} />\n            )}\n          </ChartContainer>\n        </ModalBody>\n      </StyledModal>\n\n      <SpacedButtonContainer className={className}>\n        <ToggleButtonsContainer>\n          <ToggleButtons\n            selected={\n              buttonToggle.button === ButtonToggleValue.DigitalLearner &&\n              buttonToggle.value === true\n            }\n            onClick={() => {\n              const toggleValue =\n                buttonToggle.button === ButtonToggleValue.DigitalLearner\n                  ? !buttonToggle.value\n                  : true;\n\n              const newValue = {\n                button: ButtonToggleValue.DigitalLearner,\n                value: toggleValue,\n              };\n              setbuttonToggle(newValue);\n              handleButtonToggle(newValue.button, newValue.value);\n            }}\n          >\n            Digital learners\n          </ToggleButtons>\n          <ToggleButtons\n            selected={\n              buttonToggle.button === ButtonToggleValue.DigitalIntelligent &&\n              buttonToggle.value === true\n            }\n            onClick={() => {\n              const toggleValue =\n                buttonToggle.button === ButtonToggleValue.DigitalIntelligent\n                  ? !buttonToggle.value\n                  : true;\n\n              const newValue = {\n                button: ButtonToggleValue.DigitalIntelligent,\n                value: toggleValue,\n              };\n              setbuttonToggle(newValue);\n              handleButtonToggle(newValue.button, newValue.value);\n            }}\n          >\n            Digital adopters\n          </ToggleButtons>\n          <ToggleButtons\n            selected={\n              buttonToggle.button === ButtonToggleValue.DigitalDisruptors &&\n              buttonToggle.value === true\n            }\n            onClick={() => {\n              const toggleValue =\n                buttonToggle.button === ButtonToggleValue.DigitalDisruptors\n                  ? !buttonToggle.value\n                  : true;\n\n              const newValue = {\n                button: ButtonToggleValue.DigitalDisruptors,\n                value: toggleValue,\n              };\n              setbuttonToggle(newValue);\n              handleButtonToggle(newValue.button, newValue.value);\n            }}\n          >\n            Digital disruptors\n          </ToggleButtons>\n        </ToggleButtonsContainer>\n        <ModalToggle onClick={() => setShowModal(true)}>\n          Compare and contrast\n        </ModalToggle>\n      </SpacedButtonContainer>\n    </>\n  );\n};\n\nexport default MapButtons;\n","import styled from \"styled-components\";\n\nexport const TextContainer = styled.div<{ noMargin?: boolean }>`\n  width: 60%;\n  /* margin-bottom: ${(props) => (props.noMargin ? \"0\" : \"30px\")}; */\n\n  @media (max-width: 768px) {\n    width: 100%;\n  }\n`;\n\nexport const Title = styled.h1<{ emphasis?: boolean }>`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: bold;\n  font-size: ${(props) => (props.emphasis ? \"28px\" : \"28px\")};\n  line-height: 37px;\n  letter-spacing: -0.44px;\n  color: #000000;\n  margin: 0;\n  text-align: left;\n  margin-bottom: 20px;\n\n  @media (max-width: 768px) {\n    font-size: 22px;\n  }\n`;\n\nexport const Subtitle = styled.h3`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: normal;\n  font-size: 18px;\n  line-height: 30px;\n  letter-spacing: -0.44px;\n  color: #212121;\n  text-align: left;\n  margin-bottom: 35px;\n\n  @media (max-width: 768px) {\n    font-size: 18px;\n  }\n`;\n\nexport const PlayButton = () => {\n  return (\n    <svg viewBox=\"0 0 512 512\" style={{ height: \"40px\" }}>\n      <g>\n        <path d=\"M256,0C114.833,0,0,114.844,0,256s114.833,256,256,256s256-114.844,256-256S397.167,0,256,0z M357.771,264.969    l-149.333,96c-1.75,1.135-3.771,1.698-5.771,1.698c-1.75,0-3.521-0.438-5.104-1.302C194.125,359.49,192,355.906,192,352V160    c0-3.906,2.125-7.49,5.563-9.365c3.375-1.854,7.604-1.74,10.875,0.396l149.333,96c3.042,1.958,4.896,5.344,4.896,8.969    S360.813,263.01,357.771,264.969z\" />\n      </g>\n    </svg>\n  );\n};\n\nexport const PauseButton = () => {\n  return (\n    <svg viewBox=\"0 0 512 512\" style={{ height: \"40px\" }}>\n      <g>\n        <path d=\"M256,0C114.833,0,0,114.844,0,256s114.833,256,256,256s256-114.844,256-256S397.167,0,256,0z M234.667,352    c0,5.896-4.771,10.667-10.667,10.667h-64c-5.896,0-10.667-4.771-10.667-10.667V160c0-5.896,4.771-10.667,10.667-10.667h64    c5.896,0,10.667,4.771,10.667,10.667V352z M362.667,352c0,5.896-4.771,10.667-10.667,10.667h-64    c-5.896,0-10.667-4.771-10.667-10.667V160c0-5.896,4.771-10.667,10.667-10.667h64c5.896,0,10.667,4.771,10.667,10.667V352z\" />\n      </g>\n    </svg>\n  );\n};\n\nexport const CloseIcon = (props: JSX.IntrinsicElements[\"svg\"]) => {\n  const { onClick, fill, className } = props;\n  const altProps = props as Omit<\n    JSX.IntrinsicElements[\"svg\"],\n    \"onClick\" | \"fill\" | \"className\"\n  >;\n\n  return (\n    <svg\n      viewBox=\"0 0 357 357\"\n      className={className}\n      style={{ height: \"18px\" }}\n      onClick={onClick}\n      {...altProps}\n    >\n      <g>\n        <polygon\n          style={{ fill: fill || \"#fff\" }}\n          points=\"357,35.7 321.3,0 178.5,142.8 35.7,0 0,35.7 142.8,178.5 0,321.3 35.7,357 178.5,214.2 321.3,357 357,321.3     214.2,178.5   \"\n        />\n      </g>\n    </svg>\n  );\n};\n\ninterface HamburgerMenuProps {\n  open: boolean;\n  onClick: () => void;\n}\nexport const HamburgerMenu = ({ open, onClick }: HamburgerMenuProps) => {\n  const HamburgerContainer = styled.div<HamburgerMenuProps>`\n    position: relative;\n    margin: auto 0 auto 0;\n    width: 30px;\n    height: 18px;\n    transition: 0.5s ease-in-out;\n    cursor: pointer;\n    transform: rotate(0);\n\n    & span {\n      display: block;\n      position: absolute;\n      height: 2px;\n      width: 100%;\n      border-radius: 9px;\n      opacity: 1;\n      left: 0;\n      transition: transform 0.25s ease-in-out;\n      transform: rotate(0);\n      background: ${(props) => (props.open ? \"#dedede;\" : \"#464646\")};\n\n      &:nth-child(1) {\n        top: ${(props) => (props.open ? 8 : 0)}px;\n        transform: rotate(${(props) => (props.open ? 135 : 0)}deg);\n      }\n      &:nth-child(2) {\n        top: 8px;\n        opacity: ${(props) => (props.open ? 0 : 1)};\n      }\n      &:nth-child(3) {\n        top: ${(props) => (props.open ? 8 : 16)}px;\n        transform: rotate(${(props) => (props.open ? -135 : 0)}deg);\n      }\n    }\n  `;\n\n  return (\n    <HamburgerContainer open={open} onClick={onClick}>\n      <span></span>\n      <span></span>\n      <span></span>\n    </HamburgerContainer>\n  );\n};\n","import { Container } from \"components\";\nimport styled from \"styled-components\";\nimport { Subtitle, TextContainer, Title } from \"./Common\";\n\ninterface AdditionalTextProps {\n  className?: string;\n}\n\nconst AdditionalTextContainer = styled.div`\n  width: 100%;\n  background-color: rgb(245, 245, 245);\n  padding: 55px 0;\n\n  ::before {\n    content: \"\";\n    position: absolute;\n    width: 114%;\n    height: 20px;\n    top: 0;\n    left: -7%;\n    background-color: transparent;\n    box-shadow: 0px -10px 10px 0px rgba(70, 70, 70, 1);\n  }\n`;\n\nconst AdditionalText = ({ className }: AdditionalTextProps) => {\n  return (\n    <AdditionalTextContainer className={className}>\n      <Container>\n        <TextContainer noMargin>\n          <Title emphasis>Leaping across the digital gap</Title>\n          <Subtitle>\n            Participating in the digital economy is no longer a choice. It is\n            the core engine for economic growth. To make the leap, GCC countries\n            will need to build adaptive regulatory frameworks, aggressively\n            develop talent, expand innovation capacity, and increase local\n            production of digital goods and services. By leaping across the\n            digital gap and transitioning into digital disruptors, GCC countries\n            will increase the digital economy’s contribution to the overall\n            economy from 12.2% to 13.4%, implying an aggregate regional GDP\n            growth of US$138 billion.\n          </Subtitle>\n        </TextContainer>\n      </Container>\n    </AdditionalTextContainer>\n  );\n};\n\nexport default AdditionalText;\n","import styled from \"styled-components\";\n\nconst Container = styled.div`\n  padding-right: 15px;\n  padding-left: 15px;\n  margin-right: auto;\n  margin-left: auto;\n\n  @media (min-width: 768px) {\n    width: 750px;\n  }\n  @media (min-width: 992px) {\n    width: 970px;\n  }\n  @media (min-width: 1200px) {\n    width: 1170px;\n  }\n  @media (min-width: 1400px) {\n    width: 1370px;\n  }\n`;\n\nexport default Container;\n","export default __webpack_public_path__ + \"static/media/icon_download.5dc92407.webp\";","import styled from \"styled-components\";\nimport downloadIcon from \"../images/icon_download.webp\";\n\nconst ChevronUrl =\n  \"https://www.strategyand.pwc.com/etc.clientlibs/pwc/clientlibs/rebrand-clientlibs/components-colors/resources/images/common/Right_Chevron.svg\";\n\ninterface DownloadBannerProps {\n  className?: string;\n}\n\nconst DownloadContainer = styled.a`\n  display: flex;\n  width: 100%;\n  background-color: hsl(350, 65.38%, 59.21%);\n  padding: 55px 0;\n  border-bottom: 1px solid #fff;\n  cursor: pointer;\n  text-decoration: none;\n  justify-content: center;\n\n  :hover {\n    background-color: hsl(350, 65%, 50%);\n  }\n`;\n\nconst MainLink = styled.div`\n  display: flex;\n  justify-content: center;\n  width: 45%;\n\n  @media (max-width: 768px) {\n    width: 100%;\n    padding: 0 15px;\n  }\n`;\n\nconst Image = styled.img`\n  margin: 0 30px 0 15px;\n  height: 60px;\n\n  @media (max-width: 768px) {\n    display: none;\n  }\n`;\n\nconst Content = styled.h2`\n  color: #fff;\n  font-size: 25px;\n  font-weight: bold;\n  font-family: \"PwC Helvetica Neue\", Arial, Sans-Serif;\n  display: block;\n  position: relative;\n  margin: 0 5px;\n\n  ::after {\n    content: \"\";\n    width: 20px;\n    height: 20px;\n    display: inline-block;\n    background-image: url(${ChevronUrl});\n    position: relative;\n    right: -7px;\n    transform: translateX(0);\n    transition: transform 0.2s ease;\n  }\n\n  ${DownloadContainer}:hover &::after {\n    transform: translateX(100%);\n  }\n`;\n\nconst DownloadText = styled.small`\n  display: block;\n  width: 100%;\n  color: #fff;\n  font-weight: normal;\n  font-size: 18px;\n  line-height: 30px;\n  font-family: \"PwC Helvetica Neue\", Arial, Sans-Serif;\n`;\n\nconst DownloadBanner = ({ className }: DownloadBannerProps) => {\n  return (\n    <DownloadContainer\n      className={className}\n      href=\"https://www.strategyand.pwc.com/m1/en/ideation-center/research/2021/energizing-the-digital-economy-in-the-gulf-countries/energizing-the-digital-economy-in-the-gulf-countries-spread.pdf\"\n      target=\"_blank\"\n    >\n      <MainLink>\n        <Image src={downloadIcon} />\n        <Content>\n          <DownloadText>Download the full report</DownloadText>\n          Energizing the digital economy in the Gulf countries: From digital\n          adopters to digital disruptors\n        </Content>\n      </MainLink>\n    </DownloadContainer>\n  );\n};\n\nexport default DownloadBanner;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport Container from \"./Container\";\n\nconst BreadCrumbContainer = styled.div``;\n\nconst BreadcrumbList = styled.ul`\n  flex-wrap: nowrap;\n\n  @media (max-width: 768px) {\n    overflow: scroll;\n  }\n`;\n\nconst BreadCrumbItem = styled.li`\n  margin-left: 0;\n\n  a {\n    color: rgb(255, 255, 255);\n    line-height: 19.2px;\n    font-size: 15px;\n    font-family: \"PwC Helvetica Neue\", Arial, sans-serif;\n  }\n\n  :not(:first-child)::before {\n    background: url(\"https://www.strategyand.pwc.com/etc.clientlibs/pwc/clientlibs/rebrand-clientlibs/components-colors/resources/images/newfooter/breadcrumb__arrow--lightgrey.png\")\n      0 0 no-repeat;\n    height: 15px;\n    content: \"\";\n    display: inline-block;\n    margin: 0 20px -3px 10px;\n    color: #c7c8ca;\n    padding: 0;\n    width: 8px;\n  }\n`;\n\nconst FooterLinksContainer = styled.div`\n  padding-bottom: 40px;\n`;\n\nconst FooterLinks = styled.div`\n  a {\n    color: #fff;\n    text-decoration: none;\n    margin-right: 25px;\n    font-size: 18px;\n    line-height: 22px;\n    margin-bottom: 20px;\n    font-family: \"PwC Helvetica Neue\", Arial, Sans-Serif;\n\n    :hover {\n      text-decoration: underline;\n    }\n  }\n`;\n\nconst Footer = () => {\n  return (\n    <div\n      className=\"newPageFooter parbase section\"\n      style={{ zIndex: 200, position: \"relative\" }}\n    >\n      <div className=\"dpe-component-wrapper glb-footer\">\n        <Container>\n          <div className=\"row\">\n            <nav\n              id=\"footerBreadcrumbWrapper\"\n              className=\"col-xs-12 simple-breadcrumb-component  simple-breadcrumb-component--dark-bg \"\n            >\n              <BreadCrumbContainer className=\"breadcrumb-component__scroll-pane\">\n                <BreadcrumbList className=\"breadcrumb\">\n                  <BreadCrumbItem>\n                    <a href=\"https://www.strategyand.pwc.com/gx/en.html\">\n                      Home\n                    </a>\n                  </BreadCrumbItem>\n                  <BreadCrumbItem>\n                    <a href=\"https://www.strategyand.pwc.com/m1/en/ideation-center.html\">\n                      Ideation Center\n                    </a>\n                  </BreadCrumbItem>\n                  <BreadCrumbItem>\n                    <a href=\"https://www.strategyand.pwc.com/m1/en/ideation-center/ic-research/2021/digital-economy-index.html\">\n                      Energizing the digital economy in the Gulf countries: From\n                      digital adopters to digital disruptors\n                    </a>\n                  </BreadCrumbItem>\n                </BreadcrumbList>\n              </BreadCrumbContainer>\n              {/* <div className=\"breadcrumb-component__scroll-fade breadcrumb-component__scroll-fade--left\"></div>\n              <div className=\"breadcrumb-component__scroll-fade breadcrumb-component__scroll-fade--right\"></div> */}\n            </nav>\n          </div>\n          <FooterLinksContainer className=\"row\">\n            <div className=\"col-xs-12 col-sm-12\">\n              <FooterLinks>\n                <a\n                  className=\"serif glb-footer__link glb-footer__link--l1\"\n                  target=\"\"\n                  href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants/international-strategy-consulting.html\"\n                  aria-label=\"Office locations\"\n                >\n                  Office locations\n                </a>\n                <a\n                  className=\"serif glb-footer__link glb-footer__link--l1\"\n                  target=\"\"\n                  href=\"https://www.strategyand.pwc.com/m1/en/alumni.html\"\n                  aria-label=\"Alumni\"\n                >\n                  Alumni\n                </a>\n                <a\n                  className=\"serif glb-footer__link glb-footer__link--l1\"\n                  target=\"\"\n                  href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants/international-strategy-consulting.html\"\n                  aria-label=\"Contact us\"\n                >\n                  Contact us\n                </a>\n              </FooterLinks>\n            </div>\n          </FooterLinksContainer>\n          <div className=\"row\">\n            <div className=\"col-xs-12\">\n              <div className=\"glb-footer__disclaimer\">\n                <div className=\"row\">\n                  <div className=\"col-md-8 glb-footer__disclaimer-text\">\n                    <a\n                      id=\"slim-footer-logo\"\n                      href=\"https://www.strategyand.pwc.com/gx/en\"\n                      aria-label=\"slim-footer-logo\"\n                      className=\"slim-footer-logo\"\n                      rel=\"noreferrer\"\n                    ></a>\n                    <p>\n                      © 2019 - 2021 PwC. All rights reserved. PwC refers to the\n                      PwC network and/or one or more of its member firms, each\n                      of which is a separate legal entity. Please see{\" \"}\n                      <a\n                        href=\"http://www.pwc.com/structure\"\n                        className=\"footer\"\n                        target=\"_blank\"\n                        rel=\"noreferrer\"\n                      >\n                        www.pwc.com/structure\n                      </a>{\" \"}\n                      for further details.\n                    </p>\n                    <ul\n                      className=\"glb-footer__disclaimer-links\"\n                      id=\"pgFooter\"\n                      style={{ paddingLeft: 0 }}\n                    >\n                      <li>\n                        <a\n                          href=\"https://www.strategyand.pwc.com/gx/en/about/privacy-policy.html\"\n                          target=\"\"\n                          aria-label=\"Privacy statement\"\n                        >\n                          Privacy statement\n                        </a>\n                      </li>\n                      <li>\n                        <a\n                          href=\"https://www.strategyand.pwc.com/gx/en/about/terms-of-use.html\"\n                          target=\"\"\n                          aria-label=\"Terms of use\"\n                        >\n                          Terms of use\n                        </a>\n                      </li>\n                      <li>\n                        <a\n                          href=\"https://www.strategyand.pwc.com/gx/en/about/cookie-information.html\"\n                          target=\"\"\n                          aria-label=\"Cookies info\"\n                        >\n                          Cookies info\n                        </a>\n                      </li>\n                      <li>\n                        <a\n                          href=\"https://www.strategyand.pwc.com/gx/en/about/about-site-provider.html\"\n                          target=\"\"\n                          aria-label=\"About site provider\"\n                        >\n                          About site provider\n                        </a>\n                      </li>\n                    </ul>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </Container>\n      </div>\n    </div>\n  );\n};\n\nexport default Footer;\n","export default __webpack_public_path__ + \"static/media/dima-sayess.pwcimage.9a41f902.webp\";","export default __webpack_public_path__ + \"static/media/melissa-rizk.pwcimage.807270d0.webp\";","import { Container } from \"components\";\nimport styled from \"styled-components\";\nimport LinkedInImage from \"../images/linkedIn.gif\";\n\nimport BahjatElDarwivheImage from \"../images/people/bajhat-el-darwivhe.pwcimage.jpg\";\nimport TarekElZeinImage from \"../images/people/tarek-el-zein.pwcimage.jpg\";\nimport DimaSayessImage from \"../images/people/dima-sayess.pwcimage.webp\";\nimport MellissaRizkImage from \"../images/people/melissa-rizk.pwcimage.webp\";\n\ninterface GetInTouchProps {\n  className?: string;\n}\n\ninterface SocialLink {\n  name: string;\n  link: string;\n  image: string;\n}\n\ninterface ContactPerson {\n  name: string;\n  profilePageLink: string;\n  image: string;\n  designation: string;\n  location: string;\n  linkedIn: string;\n  emailLink: string;\n}\n\nconst GetInTouchContainer = styled.div`\n  width: 100%;\n  background-color: #ffffff;\n  padding: 55px 0;\n`;\n\nconst GridContainer = styled.div`\n  display: grid;\n  grid-template-columns: 3fr 1fr;\n\n  @media (max-width: 768px) {\n    grid-template-columns: 1fr;\n    gap: 30px;\n  }\n`;\n\nconst SocialFollow = styled.div``;\nconst FollowText = styled.span`\n  font-family: \"PwC Helvetica Neue\", Arial, Sans-Serif;\n  font-size: 28px;\n  color: #2d2d2d;\n  display: block;\n  margin-bottom: 25px;\n  padding: 0 5px 0 5px;\n  padding-left: 0;\n`;\nconst SocialsContainer = styled.div``;\nconst SocialIcon = styled.a`\n  margin: 0 10px 0 0;\n\n  & img {\n    width: 22px;\n    height: 22px;\n  }\n`;\n\nconst ContactUsContainer = styled.div``;\nconst ContactUsText = styled.h2`\n  font-size: 20px;\n  font-family: \"PwC Helvetica Neue\", Arial, Sans-Serif;\n  color: #7d7d7d;\n  font-weight: bold;\n  margin-top: 0;\n  margin-bottom: 34px;\n`;\nconst ContactList = styled.div`\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 10px;\n\n  @media (max-width: 768px) {\n    grid-template-columns: 1fr;\n  }\n`;\n\nconst PersonCard = styled.div`\n  display: flex;\n`;\nconst Image = styled.div`\n  & img {\n    height: 105px;\n    width: 105px;\n  }\n`;\nconst Details = styled.div`\n  padding: 0 20px;\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n`;\nconst Name = styled.a`\n  font-size: 22px;\n  color: #2d2d2d;\n  line-height: 1.2;\n  font-family: \"PwC ITC Charter\", Georgia, Serif;\n  text-decoration: none;\n  margin-bottom: 5px;\n\n  :hover span {\n    border-bottom: 2px solid #a32020;\n    color: #e0301e;\n  }\n`;\nconst Text = styled.span`\n  color: #464646;\n  font-size: 16px;\n  line-height: 1;\n  font-family: \"PwC Helvetica Neue\", Arial, Sans-Serif;\n  margin-bottom: 5px;\n`;\nconst EmailContainer = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n`;\nconst LinkedIn = styled.a`\n  height: 24px;\n  width: 24px;\n\n  & img {\n    height: 24px;\n    width: 24px;\n  }\n`;\nconst EmailLink = styled.a`\n  margin-left: 10px;\n  padding-bottom: 2px;\n  color: #414141;\n  font-weight: bold;\n  font-family: \"PwC Helvetica Neue\", Arial, Sans-Serif;\n  font-size: 18px;\n  text-decoration: none;\n\n  :hover {\n    padding-bottom: 0;\n    border-bottom: 2px solid #a32020;\n    color: #a32020;\n  }\n`;\n\nconst ContactCard = ({ contact }: { contact: ContactPerson }) => {\n  return (\n    <PersonCard>\n      <Image>\n        <img src={contact.image} alt={contact.name} />\n      </Image>\n      <Details>\n        <Name href={contact.profilePageLink}>\n          <span>{contact.name}</span>\n        </Name>\n        <Text>\n          {contact.designation} {contact.location}\n        </Text>\n        <EmailContainer>\n          <LinkedIn href={contact.linkedIn}>\n            <img src={LinkedInImage} alt=\"LinkedIn\" />\n          </LinkedIn>\n          <EmailLink href={contact.emailLink}>Email</EmailLink>\n        </EmailContainer>\n      </Details>\n    </PersonCard>\n  );\n};\n\nconst GetInTouch = ({ className }: GetInTouchProps) => {\n  const socialLinks: SocialLink[] = [\n    {\n      name: \"Twitter\",\n      image:\n        \"https://www.strategyand.pwc.com/content/pwc/script/network/follow/follow_twitter.png\",\n      link: \"https://twitter.com/strategyandME\",\n    },\n    {\n      name: \"LinkedIn\",\n      image:\n        \"https://www.strategyand.pwc.com/content/pwc/script/network/follow/follow_linkedin.png\",\n      link: \"https://www.linkedin.com/company/strategyandme/\",\n    },\n    {\n      name: \"Facebook\",\n      image:\n        \"https://www.strategyand.pwc.com/content/pwc/script/network/follow/follow_facebook.png\",\n      link: \"http://www.facebook.com/strategybusiness\",\n    },\n    {\n      name: \"YouTube\",\n      image:\n        \"https://www.strategyand.pwc.com/content/pwc/script/network/follow/follow_youtube.png\",\n      link: \"http://www.youtube.com/user/strategyand\",\n    },\n  ];\n\n  const contactPersons: ContactPerson[] = [\n    {\n      name: \"Bahjat El Darwiche\",\n      profilePageLink:\n        \"https://www.strategyand.pwc.com/m1/en/contacts/b/bahjat-eldarwiche.html\",\n      designation: \"Partner, Strategy&\",\n      location: \"Middle East\",\n      image: BahjatElDarwivheImage,\n      linkedIn: \"https://www.linkedin.com/in/bahjat-el-darwiche-3a52231\",\n      emailLink:\n        \"https://www.strategyand.pwc.com/15/en/content/pwc/global/forms/contactUsNew.html?parentPagePath=/content/pwc/15/en/ideation-center/ic-research/2021/digital-economy-index&style=pwc&territory=15&contactLink=/content/pwc/15/en/contacts/b/bahjat-eldarwiche\",\n    },\n    {\n      name: \"Tarek El Zein\",\n      profilePageLink:\n        \"https://www.strategyand.pwc.com/m1/en/contacts/t/tarek-el-zein.html\",\n      designation: \"Partner, Strategy&\",\n      location: \"Middle East\",\n      image: TarekElZeinImage,\n      linkedIn: \"https://www.linkedin.com/in/tarekelzein\",\n      emailLink:\n        \"https://www.strategyand.pwc.com/15/en/content/pwc/global/forms/contactUsNew.html?parentPagePath=/content/pwc/15/en/ideation-center/ic-research/2021/digital-economy-index&style=pwc&territory=15&contactLink=/content/pwc/15/en/contacts/t/tarek-el-zein\",\n    },\n    {\n      name: \"Dima Sayess\",\n      profilePageLink:\n        \"https://www.strategyand.pwc.com/m1/en/contacts/d/dima-sayess.html\",\n      designation: \"Partner, Strategy&\",\n      location: \"Middle East\",\n      image: DimaSayessImage,\n      linkedIn: \"https://www.linkedin.com/in/dima-sayess-4a17a310/\",\n      emailLink:\n        \"https://www.strategyand.pwc.com/15/en/content/pwc/global/forms/contactUsNew.html?parentPagePath=/content/pwc/15/en/ideation-center/ic-research/2021/digital-economy-index-v2&style=pwc&territory=15&contactLink=/content/pwc/15/en/contacts/d/dima-sayess\",\n    },\n    {\n      name: \"Melissa Rizk\",\n      profilePageLink:\n        \"https://www.strategyand.pwc.com/m1/en/contacts/m/melissa-rizk.html\",\n      designation: \"Senior Fellow, Ideation Center, Strategy&\",\n      location: \"Middle East\",\n      image: MellissaRizkImage,\n      linkedIn: \"https://www.linkedin.com/in/melissa-rizk/\",\n      emailLink:\n        \"https://www.strategyand.pwc.com/15/en/content/pwc/global/forms/contactUsNew.html?parentPagePath=/content/pwc/15/en/ideation-center/ic-research/2021/digital-economy-index&style=pwc&territory=15&contactLink=/content/pwc/15/en/contacts/m/melissa-rizk\",\n    },\n  ];\n\n  return (\n    <GetInTouchContainer className={className}>\n      <Container>\n        <GridContainer>\n          <ContactUsContainer>\n            <ContactUsText>Contact us</ContactUsText>\n            <ContactList>\n              {contactPersons.map((person) => (\n                <ContactCard key={person.profilePageLink} contact={person} />\n              ))}\n            </ContactList>\n          </ContactUsContainer>\n          <SocialFollow>\n            <ContactUsText>Follow us</ContactUsText>\n            <SocialsContainer>\n              {socialLinks.map((link) => (\n                <SocialIcon key={link.name} href={link.link} target=\"_blank\">\n                  <img src={link.image} alt={link.name} />\n                </SocialIcon>\n              ))}\n            </SocialsContainer>\n          </SocialFollow>\n        </GridContainer>\n      </Container>\n    </GetInTouchContainer>\n  );\n};\n\nexport default GetInTouch;\n","export default \"data:image/gif;base64,R0lGODlhGAAYALMAAACJ0KDT7UCn3PD4/HC95RCQ01Cu3zCf2cDi84DE6P///5DM6yCY1mC14v///wAAACH5BAEHAA4ALAAAAAAYABgAAAReEMhJq7046827/xWRHCCVKMrAlBKCKgILnOkqN6O8FYJQaDQFwIVqvBSLTHB4bBowSyIKMXgFoC8migBgvBBYlFYo+YaF0on5Es2Wp+exGs7Opt8KcF18B6x1gIEbEQA7\"","export default \"data:image/jpeg;base64,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\"","export default \"data:image/jpeg;base64,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\"","import React, { useState } from \"react\";\nimport { Container } from \"components\";\nimport styled, { CSSProperties } from \"styled-components\";\nimport { HamburgerMenu } from \"./Common\";\n\nconst BurgerMenu = styled.div`\n  display: none;\n\n  @media (max-width: 768px) {\n    display: block;\n  }\n`;\n\nconst HeaderContainer = styled(Container)`\n  max-width: 1600px;\n  width: 100%;\n  padding: 0 30px;\n\n  @media (max-width: 768px) {\n    position: relative;\n    margin: 0;\n    width: 100%;\n    padding: 0;\n  }\n`;\n\nconst NavContainer = styled.nav<{ isActive?: boolean }>`\n  align-items: center;\n  width: 90%;\n  justify-content: center;\n  display: flex;\n\n  ul {\n    margin-bottom: 0;\n    margin-top: 1rem;\n  }\n\n  @media (max-width: 768px) {\n    display: ${(props) => (props.isActive ? \"block\" : \"none\")};\n    position: absolute;\n    top: calc(100% + 10px);\n    z-index: 1;\n    width: 100%;\n    left: 0px;\n  }\n`;\n\nconst HeaderEl = styled.div`\n  @media (max-width: 768px) {\n    padding: 0 15px;\n  }\n`;\n\nconst MenuList = styled.ul<{ show?: boolean }>`\n  display: flex;\n\n  li a {\n    font-size: 18px;\n    line-height: 27px;\n    font-family: \"PwC Helvetica Neue\", arial, serif;\n    color: #000;\n    /* color: rgb(70, 70, 70); */\n  }\n\n  @media (max-width: 768px) {\n    flex-direction: column;\n    padding: 0;\n    margin: 0;\n    display: ${(props) => (props.show ? \"flex\" : \"none\")};\n    /*opacity: ${(props) => (props.show ? 1 : 0)}; */\n\n    & > li {\n      width: 100%;\n      position: relative;\n      margin: auto 0;\n\n      &:hover {\n        background-color: #464646;\n      }\n\n      & > a {\n        display: block;\n        width: 100%;\n        padding: 15px 30px 15px 15px;\n        position: relative;\n\n        &::after {\n          content: \"\\u276f\";\n          position: absolute;\n          right: 18px;\n        }\n      }\n    }\n  }\n`;\n\nconst BackSubMenu = styled.button`\n  height: 53px;\n  font-family: \"PwC Helvetica Neue\";\n  font-size: 1.375rem;\n  color: #dedede;\n  line-height: 19.5px;\n  letter-spacing: -0.12px;\n  margin: 0 auto 0 0;\n  line-height: 59px;\n  padding: 0 15px 0 20px;\n  display: flex;\n  align-items: center;\n  flex-flow: row nowrap;\n  cursor: pointer;\n  background-color: transparent;\n  border: none;\n  outline: none;\n  text-decoration: none;\n  position: relative;\n\n  ::before {\n    content: \"\\u276e\";\n    position: absolute;\n    left: 0;\n  }\n`;\n\nconst LogoContainer = styled.a`\n  text-decoration: none;\n\n  img {\n    width: 130px;\n    margin: 25px 3px 14px 0;\n  }\n`;\n\nconst BreadCrumbContainer = styled.div<{ isActive: boolean }>`\n  position: relative;\n  padding: 6px 0px;\n  display: flex;\n  flex-flow: row nowrap;\n  max-width: 1600px;\n  width: 100%;\n  margin: auto;\n  transition: opacity 0.25s ease-in-out;\n  border-top: 1px solid rgba(242, 242, 242, 0.85);\n\n  opacity: ${(props) => (props.isActive ? 0 : 1)};\n\n  @media (max-width: 768px) {\n    padding: 6px 15px;\n    overflow: scroll;\n  }\n`;\n\nconst BreadCrumbItemsList = styled.div`\n  display: flex;\n  white-space: nowrap;\n  flex-flow: row nowrap;\n  opacity: 1;\n  transition: opacity 0.25s ease-in-out;\n  overflow: hidden;\n  flex-shrink: 0;\n  align-self: center;\n\n  a {\n    font-size: 14px;\n    margin-right: 15px;\n    padding-right: 15px;\n    color: rgb(70, 70, 70);\n    font-weight: bold;\n    line-height: 1.8;\n    font-family: \"PwC Helvetica Neue\", arial, serif;\n    text-decoration: none;\n    position: relative;\n\n    :hover {\n      text-decoration: underline;\n    }\n\n    ::after {\n      content: \"\";\n      background-image: url(\"https://www.strategyand.pwc.com/etc.clientlibs/pwc/clientlibs/rebrand-clientlibs/components-colors/resources/images/slim-header-v2/chevron-dark.svg\");\n      width: 9px;\n      height: 6px;\n      background-repeat: no-repeat;\n      background-size: contain;\n      transform: translateY(-50%) rotate(-90deg);\n      fill: #000;\n      stroke-width: 1;\n      position: absolute;\n      top: 50%;\n      right: -5px;\n    }\n\n    :last-child::after {\n      display: none;\n    }\n  }\n`;\n\nconst Header = () => {\n  const [isActive, setIsActive] = useState(false);\n  const [isSubMenu, setIsSubMenu] = useState(true);\n  const [isIndustries, setIsIndustries] = useState(false);\n  const [isFunctions, setIsFunctions] = useState(false);\n  const [isSolutions, setIsSolutions] = useState(false);\n  const [isInsights, setIsInsights] = useState(false);\n  const [isAboutUs, setIsAboutUs] = useState(false);\n  const [isCareers, setIsCareers] = useState(false);\n  const [isIdeation, setIsIdeation] = useState(false);\n\n  const clearAll = () => {\n    setIsActive(false);\n    setIsSubMenu(false);\n    setIsIndustries(false);\n    setIsFunctions(false);\n    setIsSolutions(false);\n    setIsInsights(false);\n    setIsAboutUs(false);\n    setIsCareers(false);\n  };\n\n  const sliderHeight: CSSProperties = {\n    height: \"0\",\n  };\n\n  const sliderActiveHeight: CSSProperties = {\n    height: isFunctions || isInsights || isAboutUs ? \"582px\" : \"475px\",\n    marginTop: \"-38px\",\n  };\n\n  const showLogo = () => {\n    if (isActive) {\n      const isMobile = window.innerWidth <= 768;\n      if (isSubMenu || !isMobile) {\n        return <img src=\"/logowhite.svg\" alt=\"logo\" />;\n      } else if (isMobile) {\n        return (\n          <BackSubMenu\n            onClick={(e) => {\n              e.preventDefault();\n              clearAll();\n              setIsActive(true);\n              setIsSubMenu(true);\n            }}\n          >\n            Menu\n          </BackSubMenu>\n        );\n      }\n    } else {\n      return <img src=\"/logo.svg\" alt=\"logo\" />;\n    }\n  };\n\n  return (\n    <div\n      className={isActive ? \"header-active\" : \"\"}\n      style={{\n        zIndex: 200,\n        position: \"relative\",\n        backgroundColor: !isActive ? \"#fff\" : \"#2d2d2d\",\n      }}\n    >\n      <div className=\"header-container\">\n        <HeaderContainer style={{ paddingTop: \"2px\" }}>\n          <HeaderEl className=\"header\">\n            <LogoContainer\n              href=\"https://www.strategyand.pwc.com\"\n              style={{ textDecoration: \"none\" }}\n            >\n              {showLogo()}\n            </LogoContainer>\n            <BurgerMenu>\n              <HamburgerMenu\n                open={isActive}\n                onClick={() => {\n                  if (isActive) clearAll();\n                  else {\n                    setIsActive(true);\n                    setIsSubMenu(true);\n                  }\n                }}\n              />\n            </BurgerMenu>\n            <NavContainer className=\"nav-container\" isActive={isActive}>\n              <MenuList show={isSubMenu}>\n                <li className={isIndustries ? \"active\" : \"\"}>\n                  <a\n                    href=\"#\"\n                    aria-controls=\"industries-subnav-1\"\n                    onClick={() => {\n                      clearAll();\n                      setIsActive(true);\n                      setIsIndustries(true);\n                    }}\n                  >\n                    Industries\n                  </a>\n                </li>\n                <li className={isFunctions ? \"active\" : \"\"}>\n                  <a\n                    href=\"#\"\n                    aria-controls=\"functions-subnav-1\"\n                    onClick={() => {\n                      clearAll();\n                      setIsActive(true);\n                      setIsFunctions(true);\n                    }}\n                  >\n                    Functions\n                  </a>\n                </li>\n                <li className={isSolutions ? \"active\" : \"\"}>\n                  <a\n                    href=\"#\"\n                    aria-controls=\"solutions-subnav-1\"\n                    onClick={() => {\n                      clearAll();\n                      setIsActive(true);\n                      setIsSolutions(true);\n                    }}\n                  >\n                    Solutions\n                  </a>\n                </li>\n                <li className={isInsights ? \"active\" : \"\"}>\n                  <a\n                    href=\"#\"\n                    aria-controls=\"insights-subnav-1\"\n                    onClick={() => {\n                      clearAll();\n                      setIsActive(true);\n                      setIsInsights(true);\n                    }}\n                  >\n                    Insights\n                  </a>\n                </li>\n                <li className={isAboutUs ? \"active\" : \"\"}>\n                  <a\n                    href=\"#\"\n                    aria-controls=\"aboutus-subnav-1\"\n                    onClick={() => {\n                      clearAll();\n                      setIsActive(true);\n                      setIsAboutUs(true);\n                    }}\n                  >\n                    About Us\n                  </a>\n                </li>\n                <li className={isCareers ? \"active\" : \"\"}>\n                  <a\n                    href=\"#\"\n                    aria-controls=\"careers-subnav-1\"\n                    onClick={() => {\n                      clearAll();\n                      setIsActive(true);\n                      setIsCareers(true);\n                    }}\n                  >\n                    Careers\n                  </a>\n                </li>\n              </MenuList>\n            </NavContainer>\n            {window.innerWidth > 768 && <div>{\"\"}</div>}\n          </HeaderEl>\n\n          <BreadCrumbContainer isActive={isActive}>\n            <BreadCrumbItemsList>\n              <a href=\"https://www.strategyand.pwc.com/m1/en.html\">Home</a>\n              <a href=\"https://www.strategyand.pwc.com/m1/en/ideation-center.html\">\n                Ideation Center\n              </a>\n              <a href=\"https://www.strategyand.pwc.com/m1/en/ideation-center/ic-research.html\">\n                Research\n              </a>\n              <a href=\"https://www.strategyand.pwc.com/m1/en/ideation-center/ic-research/2021/digital-economy-index.html\">\n                Energizing the digital economy in the Gulf countries: From\n                digital adopters to digital disruptors\n              </a>\n            </BreadCrumbItemsList>\n          </BreadCrumbContainer>\n        </HeaderContainer>\n\n        <div\n          className={` ${isActive ? \"active\" : \"\"} submenu-slide`}\n          style={isActive ? sliderActiveHeight : sliderHeight}\n        >\n          <div className=\"slide-shadow\"></div>\n          <div className=\"submenu-bg\" onClick={() => clearAll()} />\n          <HeaderContainer\n            style={\n              window.innerWidth <= 768\n                ? {\n                    margin: 0,\n                    width: \"100%\",\n                  }\n                : {}\n            }\n          >\n            {isIndustries && (\n              <div\n                id=\"industries-subnav-1\"\n                className=\"sublevel-container search-hide show-subnav\"\n              >\n                <button\n                  className=\"slimheader-close search-hide\"\n                  aria-label=\"Menu Close\"\n                  onClick={() => {\n                    clearAll();\n                    window.innerWidth <= 768 && setIsActive(true);\n                    setIsSubMenu(true);\n                  }}\n                ></button>\n                <div className=\"sublevel-navs\">\n                  <div className=\"slimnav-level2 slimheader-slide-nav lv2-fade-mobile is-active\">\n                    <div className=\"slide-nav-contain\">\n                      <div className=\"sublevel-title-container search-hide\">\n                        <a\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies.html\"\n                          className=\"lv2-label\"\n                        >\n                          Industries\n                        </a>\n                      </div>\n                      <nav>\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/consumer-retail-industry.html\"\n                          aria-controls=\"consumer_markets-subnav-1-1\"\n                        >\n                          Consumer markets\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/energy-chemical-utility-management.html\"\n                          aria-controls=\"energy__chemicals_and_utilities-subnav-1-2\"\n                        >\n                          Energy, chemicals and utilities\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/financial-sector-consulting.html\"\n                          aria-controls=\"financial_services-subnav-1-3\"\n                        >\n                          Financial services\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/healthcare-intellectual-capital.html\"\n                          aria-controls=\"health-subnav-1-4\"\n                        >\n                          Health\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/transport-logistics-management.html\"\n                          aria-controls=\"industrial_manufacturing_and_automotive-subnav-1-5\"\n                        >\n                          Industrial manufacturing and automotive\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/media.html\"\n                          aria-controls=\"media_and_entertainment-subnav-1-6\"\n                        >\n                          Media and entertainment\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/multi-sector-investments.html\"\n                          aria-controls=\"multisector_investment-subnav-1-7\"\n                        >\n                          Multisector investment\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/public-sector-management.html\"\n                          aria-controls=\"public_sector-subnav-1-8\"\n                        >\n                          Public sector\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/real-estate.html\"\n                          aria-controls=\"real_estate-subnav-1-9\"\n                        >\n                          Real estate\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/thought-leadership-strategy/sustainability-and-environment.html\"\n                          aria-controls=\"sustainability_and_environment-subnav-1-10\"\n                        >\n                          Sustainability and environment\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/technology.html\"\n                          aria-controls=\"technology-subnav-1-11\"\n                        >\n                          Technology\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/telecommunications.html\"\n                          aria-controls=\"telecommunications-subnav-1-12\"\n                        >\n                          Telecommunications\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/travel-and-tourism.html\"\n                          aria-controls=\"travel_and_tourism-subnav-1-13\"\n                        >\n                          Travel and tourism\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Industries\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies.html\"\n                          aria-controls=\"view_all_industries-subnav-1-14\"\n                        >\n                          View all industries\n                        </a>\n                      </nav>\n                    </div>\n                  </div>\n\n                  <div className=\"slim-featured search-hide\">\n                    <p className=\"slim-featured-heading\">Featured</p>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/sector-strategies/travel-and-tourism.html\"\n                      >\n                        <img\n                          src=\"/teaser-travel-and-tourism.gif.pwcimage.150.100.webp\"\n                          alt=\"\"\n                        />\n                        <p>Travel and tourism</p>\n                      </a>\n                    </div>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/m1/en/thought-leadership-strategy/sustainability-and-environment.html\"\n                      >\n                        <img\n                          src=\"/teaser-sustainability-and-environment-v3.gif.pwcimage.150.100.webp\"\n                          alt=\"\"\n                        />\n                        <p>Sustainability and environment</p>\n                      </a>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            )}\n\n            {isFunctions && (\n              <div\n                id=\"functions-subnav-2\"\n                className=\"sublevel-container search-hide show-subnav\"\n              >\n                <button\n                  className=\"slimheader-close search-hide\"\n                  aria-label=\"Menu Close\"\n                  onClick={() => {\n                    clearAll();\n                    window.innerWidth <= 768 && setIsActive(true);\n                    setIsSubMenu(true);\n                  }}\n                ></button>\n                <div className=\"sublevel-navs\">\n                  <div className=\"slimnav-level2 slimheader-slide-nav lv2-fade-mobile is-active\">\n                    <div className=\"slide-nav-contain\">\n                      <div className=\"sublevel-title-container search-hide\">\n                        <a\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/functional-expertise.html\"\n                          className=\"lv2-label\"\n                        >\n                          Functions\n                        </a>\n                      </div>\n                      <nav className=\"col-nowrap\">\n                        <a\n                          className=\"levelTwoLink\"\n                          data-breadcrumb=\"Functions\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/functional-expertise/it-consulting-services.html\"\n                          aria-controls=\"digital-subnav-2-1\"\n                        >\n                          Digital\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink\"\n                          data-breadcrumb=\"Functions\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/functional-expertise/mergers-acquisitions-consultants.html\"\n                          aria-controls=\"mergers_and_restructuring-subnav-2-2\"\n                        >\n                          Mergers and restructuring\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink\"\n                          data-breadcrumb=\"Functions\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/functional-expertise/operations-management-consulting.html\"\n                          aria-controls=\"operations-subnav-2-3\"\n                        >\n                          Operations\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink\"\n                          data-breadcrumb=\"Functions\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/strategic-foresight/functional-expertise/organizational-change-management.html\"\n                          aria-controls=\"organization_and_strategy-subnav-2-4\"\n                        >\n                          Organization and strategy\n                        </a>\n                      </nav>\n                    </div>\n                  </div>\n\n                  <div className=\"slim-featured search-hide\">\n                    <p className=\"slim-featured-heading\">Featured</p>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/gx/en/functions/organisational-strategy.html\"\n                      >\n                        <img\n                          src=\"/damil-gettyimages-1028772240-670.jpg.pwcimage.150.100.jpg\"\n                          alt=\"\"\n                        />\n                        <p>Global organisation strategy</p>\n                      </a>\n                    </div>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/gx/en/functions/product-service-innovation.html\"\n                      >\n                        <img\n                          src=\"/damil_105247-670-2.jpg.pwcimage.150.100.jpg\"\n                          alt=\"\"\n                        />\n                        <p>Global product and service innovation</p>\n                      </a>\n                    </div>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/gx/en/functions/technology-strategy.html\"\n                      >\n                        <img\n                          src=\"/damil-gettyimages-1140252133-670.jpg.pwcimage.150.100.jpg\"\n                          alt=\"\"\n                        />\n                        <p>Global technology strategy</p>\n                      </a>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            )}\n\n            {isSolutions && (\n              <div\n                id=\"solutions-subnav-3\"\n                className=\"sublevel-container search-hide show-subnav\"\n              >\n                <button\n                  className=\"slimheader-close search-hide\"\n                  aria-label=\"Menu Close\"\n                  onClick={() => {\n                    clearAll();\n                    window.innerWidth <= 768 && setIsActive(true);\n                    setIsSubMenu(true);\n                  }}\n                ></button>\n                <div className=\"sublevel-navs\">\n                  <div className=\"slimnav-level2 slimheader-slide-nav no-featured lv2-fade-mobile is-active\">\n                    <div className=\"slide-nav-contain\">\n                      <div className=\"sublevel-title-container search-hide\">\n                        <a href=\"#\" className=\"lv2-label\">\n                          Solutions\n                        </a>\n                      </div>\n                      <nav className=\"col-nowrap\">\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Solutions\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/unique-solutions/capabilities-driven-strategy.html\"\n                          aria-controls=\"capabilities_driven_strategy___growth-subnav-3-1\"\n                        >\n                          Capabilities-Driven Strategy + Growth\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Solutions\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/unique-solutions/deals-strategy.html\"\n                          aria-controls=\"deals_strategy-subnav-3-2\"\n                        >\n                          Deals strategy\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Solutions\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/digital.html\"\n                          aria-controls=\"digital-subnav-3-3\"\n                        >\n                          Digital\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Solutions\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/unique-solutions/fit-for-growth.html\"\n                          aria-controls=\"fit_for_growth-subnav-3-4\"\n                        >\n                          Fit for Growth\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Solutions\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/functions/organisational-strategy/orgdna-profiler.html\"\n                          aria-controls=\"organizational_dna-subnav-3-5\"\n                        >\n                          Organizational DNA\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Solutions\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/unique-solutions/trade-promotion-excellence.html\"\n                          aria-controls=\"trade_promotion_excellence-subnav-3-6\"\n                        >\n                          Trade promotion excellence\n                        </a>\n                      </nav>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            )}\n\n            {isInsights && (\n              <div\n                id=\"insights-subnav-4\"\n                className=\"sublevel-container search-hide show-subnav\"\n              >\n                <button\n                  className=\"slimheader-close search-hide\"\n                  aria-label=\"Menu Close\"\n                  onClick={() => {\n                    clearAll();\n                    window.innerWidth <= 768 && setIsActive(true);\n                    setIsSubMenu(true);\n                  }}\n                ></button>\n                <div className=\"sublevel-navs\">\n                  <div\n                    className={`slimnav-level2 slimheader-slide-nav lv2-fade-mobile ideation-main ${\n                      !isIdeation ? \"is-active\" : \"\"\n                    } `}\n                  >\n                    <div className=\"slide-nav-contain\">\n                      <div className=\"sublevel-title-container search-hide\">\n                        <a href=\"#\" className=\"lv2-label\">\n                          Insights\n                        </a>\n                      </div>\n                      <nav>\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Insights\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/insights/books.html\"\n                          aria-controls=\"books-subnav-4-1\"\n                        >\n                          Books\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Insights\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/insights/industry-trends.html\"\n                          aria-controls=\"industry_trends-subnav-4-2\"\n                        >\n                          Industry trends\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink has-lv3\"\n                          data-breadcrumb=\"Insights\"\n                          href=\"#\"\n                          aria-controls=\"ideation_centre-subnav-4-3\"\n                          onClick={() => setIsIdeation(true)}\n                        >\n                          Ideation Centre\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Insights\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/press-media.html\"\n                          aria-controls=\"media_clips-subnav-4-4\"\n                        >\n                          Media clips\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Insights\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/thought-leadership-strategy/reports.html\"\n                          aria-controls=\"reports_and_studies-subnav-4-5\"\n                        >\n                          Reports and studies\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Insights\"\n                          href=\"https://www.strategy-business.com/\"\n                          target=\"_blank\"\n                          aria-controls=\"strategy_business-subnav-4-6\"\n                        >\n                          strategy+business\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Insights\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/insights/katzenbach-center.html\"\n                          aria-controls=\"the_katzenbach_centre-subnav-4-7\"\n                        >\n                          The Katzenbach Centre\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Insights\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/insights/tools.html\"\n                          aria-controls=\"tools-subnav-4-8\"\n                        >\n                          Tools\n                        </a>\n                      </nav>\n                    </div>\n                  </div>\n\n                  <div\n                    id=\"ideation_centre-subnav-4-3\"\n                    className={`slimheader-slide-nav lv3-fade  ideation-main${\n                      isIdeation ? \"is-active\" : \"\"\n                    }`}\n                  >\n                    <div className=\"slide-nav-contain\">\n                      <div className=\"sublevel-title-container search-hide\">\n                        <div className=\"slimheader-breadcrumb is-hidden\">\n                          <img\n                            src=\"/Chevron.svg\"\n                            className=\"back\"\n                            onClick={() => setIsIdeation(false)}\n                            alt=\"Back\"\n                          />\n                          <a\n                            href=\"#\"\n                            onClick={(e) => {\n                              e.preventDefault();\n                              setIsIdeation(false);\n                            }}\n                          >\n                            Insights\n                          </a>\n                        </div>\n                        <a\n                          href=\"https://www.strategyand.pwc.com/m1/en/ideation-center.html\"\n                          className=\"lv2-label\"\n                        >\n                          Ideation Centre\n                        </a>\n                      </div>\n                      <nav className=\"col-nowrap\">\n                        <a\n                          className=\"levelThreeLink\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/ideation-center/ic-research.html\"\n                        >\n                          Research\n                        </a>\n\n                        <a\n                          className=\"levelThreeLink\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/ideation-center/media.html\"\n                        >\n                          Media\n                        </a>\n                      </nav>\n                    </div>\n                  </div>\n\n                  <div className=\"slim-featured search-hide\">\n                    <p className=\"slim-featured-heading\">Featured</p>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/m1/en/reports/2021/sustainable-mobility.html\"\n                      >\n                        <img\n                          src=\"/teaser-sustainable-mobility.gif.pwcimage.150.100.webp\"\n                          alt=\"\"\n                        />\n                        <p>Sustainable mobility</p>\n                      </a>\n                    </div>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/m1/en/reports/2020/the-dawn-of-green-hydrogen.html\"\n                      >\n                        <img\n                          src=\"/teaser-the-dawn-of-green-hydrogen.jpg.pwcimage.150.100.webp\"\n                          alt=\"\"\n                        />\n                        <p>The dawn of green hydrogen</p>\n                      </a>\n                    </div>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/m1/en/reports/2020/skin-in-the-game.html\"\n                      >\n                        <img\n                          src=\"/teaser-skin-in-the-game.jpg.pwcimage.150.100.webp\"\n                          alt=\"\"\n                        />\n                        <p>Skin in the game</p>\n                      </a>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            )}\n\n            {isAboutUs && (\n              <div\n                id=\"about_us-subnav-5\"\n                className=\"sublevel-container search-hide show-subnav\"\n              >\n                <button\n                  className=\"slimheader-close search-hide\"\n                  aria-label=\"Menu Close\"\n                  onClick={() => {\n                    clearAll();\n                    window.innerWidth <= 768 && setIsActive(true);\n                    setIsSubMenu(true);\n                  }}\n                ></button>\n                <div className=\"sublevel-navs\">\n                  <div className=\"slimnav-level2 slimheader-slide-nav is-active lv2-fade-mobile\">\n                    <div className=\"slide-nav-contain\">\n                      <div className=\"sublevel-title-container search-hide\">\n                        <a\n                          href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants.html\"\n                          className=\"lv2-label\"\n                        >\n                          About us\n                        </a>\n                      </div>\n                      <nav>\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"About us\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants.html\"\n                          aria-controls=\"about_the_firm-subnav-5-1\"\n                        >\n                          About the firm\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"About us\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/alumni.html\"\n                          aria-controls=\"alumni-subnav-5-2\"\n                        >\n                          Alumni\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"About us\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants/management-consulting-services.html\"\n                          aria-controls=\"heritage_and_organization-subnav-5-3\"\n                        >\n                          Heritage and organization\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"About us\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants/thought-leaders.html\"\n                          aria-controls=\"our_leadership_team-subnav-5-4\"\n                        >\n                          Our leadership team\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"About us\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants/international-strategy-consulting.html\"\n                          aria-controls=\"our_middle_east_offices-subnav-5-5\"\n                        >\n                          Our Middle East offices\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"About us\"\n                          href=\"https://www.pwc.com/m1/en/about-us/purpose-and-values.html\"\n                          aria-controls=\"our_values-subnav-5-6\"\n                        >\n                          Our values\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"About us\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/press-releases.html\"\n                          aria-controls=\"press_and_media-subnav-5-7\"\n                        >\n                          Press and media\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"About us\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants/community-development.html\"\n                          aria-controls=\"social_impact-subnav-5-8\"\n                        >\n                          Social impact\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"About us\"\n                          href=\"https://www.strategyand.pwc.com/gx/en/about/worldwide-offices.html\"\n                          aria-controls=\"strategy__worldwide_offices-subnav-5-9\"\n                        >\n                          Strategy&amp; worldwide offices\n                        </a>\n                      </nav>\n                    </div>\n                  </div>\n\n                  <div className=\"slim-featured search-hide\">\n                    <p className=\"slim-featured-heading\">Featured</p>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants/management-consulting-services.html\"\n                      >\n                        <img\n                          src=\"/teaser-middleeast-unique-heritage.jpg.pwcimage.150.100.webp\"\n                          alt=\"\"\n                        />\n                        <p>Our heritage</p>\n                      </a>\n                    </div>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/m1/en/press-releases.html\"\n                      >\n                        <img\n                          src=\"/damil-gettyimages-627470003-670.jpg.pwcimage.150.100.jpg\"\n                          alt=\"\"\n                        />\n                        <p>Press room</p>\n                      </a>\n                    </div>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/m1/en/foresight-management-consultants/international-strategy-consulting.html\"\n                      >\n                        <img\n                          src=\"/teaser-middleeast-offices.jpg.pwcimage.150.100.webp\"\n                          alt=\"\"\n                        />\n                        <p>Our Middle East offices</p>\n                      </a>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            )}\n\n            {isCareers && (\n              <div\n                id=\"careers-subnav-6\"\n                className=\"sublevel-container search-hide show-subnav\"\n              >\n                <button\n                  className=\"slimheader-close search-hide\"\n                  aria-label=\"Menu Close\"\n                  onClick={() => {\n                    clearAll();\n                    window.innerWidth <= 768 && setIsActive(true);\n                    setIsSubMenu(true);\n                  }}\n                ></button>\n                <div className=\"sublevel-navs\">\n                  <div className=\"slimnav-level2 slimheader-slide-nav is-active lv2-fade-mobile\">\n                    <div className=\"slide-nav-contain\">\n                      <div className=\"sublevel-title-container search-hide\">\n                        <a\n                          href=\"https://www.strategyand.pwc.com/m1/en/careers.html\"\n                          className=\"lv2-label\"\n                        >\n                          Careers\n                        </a>\n                      </div>\n                      <nav className=\"col-nowrap\">\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Careers\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/careers/meet-our-people.html\"\n                          aria-controls=\"meet_some_of_our_people-subnav-6-1\"\n                        >\n                          Meet some of our people\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Careers\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/careers.html\"\n                          aria-controls=\"middle_east_careers-subnav-6-2\"\n                        >\n                          Middle East Careers\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Careers\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/careers/qadat.html\"\n                          aria-controls=\"qadat-subnav-6-3\"\n                        >\n                          Qadat\n                        </a>\n\n                        <a\n                          className=\"levelTwoLink \"\n                          data-breadcrumb=\"Careers\"\n                          href=\"https://www.strategyand.pwc.com/m1/en/careers/women.html\"\n                          aria-controls=\"women_at_strategy__middle_east-subnav-6-4\"\n                        >\n                          Women at Strategy&amp; Middle East\n                        </a>\n                      </nav>\n                    </div>\n                  </div>\n\n                  <div className=\"slim-featured search-hide\">\n                    <p className=\"slim-featured-heading\">Featured</p>\n\n                    <div className=\"slim-featured-item\">\n                      <a\n                        className=\"featuredLink\"\n                        href=\"https://www.strategyand.pwc.com/m1/en/careers/qadat.html\"\n                      >\n                        <img\n                          src=\"/teaser-qada.jpg.pwcimage.150.100.webp\"\n                          alt=\"\"\n                        />\n                        <p>Qadat</p>\n                      </a>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            )}\n          </HeaderContainer>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default Header;\n","export default __webpack_public_path__ + \"static/media/dei-banner.7b0b2166.jpg\";","import styled from \"styled-components\";\nimport Container from \"./Container\";\nimport bannerImage from \"../images/dei-banner.jpg\";\n\nconst VideoContainer = styled.section`\n  position: relative;\n  overflow: hidden;\n  display: block;\n  height: 539px;\n  margin: 0 auto;\n  width: 100%;\n  z-index: 100;\n\n  ::after {\n    content: \"\";\n    background-image: url(\"https://www.strategyand.pwc.com/etc.clientlibs/settings/wcm/designs/pwc/rebrand-clientlibs/component-colors-strategyand/resources/images/hero-promo-overlay-black--largedesktop-2400-optimised.svg\");\n    background-size: cover;\n    display: block;\n    content: \" \";\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    right: 0;\n    left: 0;\n    z-index: -1;\n    opacity: 0.8;\n    background-repeat: no-repeat;\n    background-position: 100% 100%;\n  }\n\n  @media (max-width: 768px) {\n    height: 350px;\n  }\n`;\n\nconst Video = styled.video`\n  position: absolute;\n  width: 100%;\n  top: 0;\n  object-fit: cover;\n  height: 100%;\n  z-index: -1;\n`;\n\nconst Image = styled.img`\n  position: absolute;\n  width: 100%;\n  top: 0;\n  object-fit: cover;\n  height: 100%;\n  z-index: -1;\n  background-color: #00030b;\n`;\n\nconst HeadingContainer = styled.div`\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  flex-direction: column;\n  position: relative;\n`;\n\nconst Heading = styled.h2`\n  font-family: \"PwC ITC Charter\";\n  font-weight: normal;\n  font-size: 40px;\n  line-height: 52px;\n  letter-spacing: 0.3px;\n  color: #ffffff;\n`;\n\nconst SubHeading = styled.h3`\n  font-family: \"PwC Helvetica Neue\", Arial, Sans-Serif;\n  font-weight: normal;\n  font-size: 20px;\n  line-height: 32px;\n  letter-spacing: 0.3px;\n  color: #ffffff;\n`;\n\nconst Category = styled.h3`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: bold;\n  font-size: 18px;\n  line-height: 27px;\n  letter-spacing: 0.3px;\n  color: #ffffff;\n  text-transform: uppercase;\n`;\n\nconst HeaderBanner = () => {\n  return (\n    <VideoContainer>\n      {/* <Video\n        autoPlay\n        loop\n        muted\n        playsInline={false}\n        onContextMenu={() => false}\n        preload=\"auto\"\n        id=\"myVideo\"\n        style={{ position: \"absolute\", width: \"100%\" }}\n      >\n        <source\n          src=\"https://videocontent.pwc.de/MediasiteDeliver/ondemand-external/MP4Video/e7ceb92a-3830-4c46-ab60-32a745521e55.mp4\"\n          type=\"video/mp4\"\n        />\n      </Video> */}\n\n      <Image src={bannerImage} alt=\"DEI page banner\" />\n\n      <Container style={{ height: \"100%\" }}>\n        <HeadingContainer>\n          <Category>Ideation Center Insight</Category>\n          <Heading>\n            Energizing the digital economy in the Gulf countries\n          </Heading>\n          <SubHeading>From digital adopters to digital disruptors</SubHeading>\n        </HeadingContainer>\n      </Container>\n    </VideoContainer>\n  );\n};\n\nexport default HeaderBanner;\n","import { Container } from \"components\";\nimport styled from \"styled-components\";\nimport { Subtitle, TextContainer, Title } from \"./Common\";\n\ninterface IntroSectionProps {\n  className?: string;\n}\n\nconst DownloadButtonIconWhite = `https://www.strategyand.pwc.com/etc.clientlibs/pwc/clientlibs/rebrand-clientlibs/components-colors/resources/images/cta-btn-images/icon-external-link-white.svg`;\nconst DownloadButtonIconBlack = `https://www.strategyand.pwc.com/etc.clientlibs/pwc/clientlibs/rebrand-clientlibs/components-colors/resources/images/cta-btn-images/icon-external-link-black.svg`;\n\nconst IntroSectionContainer = styled.div`\n  width: 100%;\n  background-color: rgb(245, 245, 245);\n  padding: 55px 0;\n`;\n\nconst DlButton = styled.a`\n  font-size: 16px;\n  font-weight: bold;\n  line-height: 18px;\n  padding: 14px 23px;\n  margin: 20px 25px 0 0;\n  background: transparent;\n  border: 1px solid #7d7d7d;\n  color: #2d2d2d;\n  text-decoration: none;\n  transition: all 0.2s ease-out;\n  font-family: \"PwC Helvetica Neue\", Arial, Sans-Serif;\n\n  :hover {\n    background: #7d7d7d;\n    color: #fff;\n    margin-right: 21px;\n\n    i {\n      margin-left: 14px;\n      background-image: url(${DownloadButtonIconWhite});\n    }\n  }\n\n  i {\n    margin-left: 10px;\n    width: 14px;\n    height: 14px;\n    display: inline-block;\n    background-repeat: no-repeat;\n    transition: all 0.3s ease;\n    background-image: url(${DownloadButtonIconBlack});\n  }\n`;\n\nconst ButtonContainer = styled.div`\n  display: flex;\n  margin-top: 40px;\n\n  @media (max-width: 768px) {\n    flex-direction: column;\n  }\n`;\n\nconst IntroSection = ({ className }: IntroSectionProps) => {\n  return (\n    <IntroSectionContainer className={className}>\n      <Container>\n        <TextContainer noMargin>\n          <Subtitle style={{ margin: 0 }}>\n            <b>\n              Economic expansion and resilience are increasingly dependent on\n              digital maturity. As the digital economy rewrites economic growth\n              stories, GCC countries have an opening to leap forward as\n              disruptors.\n            </b>\n          </Subtitle>\n        </TextContainer>\n        <ButtonContainer>\n          <DlButton\n            href=\"https://www.strategyand.pwc.com/m1/en/ideation-center/research/2021/energizing-the-digital-economy-in-the-gulf-countries/energizing-the-digital-economy-in-the-gulf-countries-spread.pdf\"\n            target=\"_blank\"\n          >\n            Download the report\n            <i></i>\n          </DlButton>\n          {/* <DlButton href=\"#\" target=\"_blank\">\n            Download the Arabic report\n            <i></i>\n          </DlButton> */}\n        </ButtonContainer>\n      </Container>\n    </IntroSectionContainer>\n  );\n};\n\nexport default IntroSection;\n","// const BASE_URL = \"https://digitaleconomydev.azurewebsites.net/api\"; // stg\n// const BASE_URL = \"https://digitaleconomyindex-api.azurewebsites.net/api\"; // uat\nconst BASE_URL = \"https://prod-dei-api.azurewebsites.net/api\"; // prod\n\nexport const getTopCountries = async () => {\n  const result = await fetch(`${BASE_URL}/DMI/GetTopCountries`, {\n    method: \"GET\",\n  });\n\n  if (!result.ok) {\n    return {\n      success: false,\n      error: result.statusText,\n    };\n  }\n\n  return await result.json();\n};\n\nexport const getDigitalEconomyStages = async () => {\n  const result = await fetch(`${BASE_URL}/DMI/GetDigitalEconomyStagesByYear`, {\n    method: \"GET\",\n  });\n\n  if (!result.ok) {\n    return {\n      success: false,\n      error: result.statusText,\n    };\n  }\n\n  return await result.json();\n};\n\nexport const getCountries = async () => {\n  const result = await fetch(`${BASE_URL}/Lookup/GetCountriesWithCode`, {\n    method: \"GET\",\n  });\n\n  if (!result.ok) {\n    return {\n      success: false,\n      error: result.statusText,\n    };\n  }\n\n  return await result.json();\n};\n\ninterface FirstCountry {\n  foundation: number;\n  talent: number;\n  localization: number;\n  experience: number;\n  innovation: number;\n}\nexport const getCompareValues = async (countryName: string) => {\n  const result = await fetch(\n    `${BASE_URL}/DMI/GetCompareCountries?FirstCountry=${countryName}`,\n    {\n      method: \"GET\",\n    }\n  );\n\n  if (!result.ok) {\n    return {\n      success: false,\n      error: result.statusText,\n    };\n  }\n\n  const { firstCountry }: { firstCountry: FirstCountry } = await result.json();\n\n  return {\n    success: true,\n    data: [\n      firstCountry.foundation,\n      firstCountry.talent,\n      firstCountry.innovation,\n      firstCountry.experience,\n      firstCountry.localization,\n    ],\n  };\n};\n\nexport interface DmiSubPillar {\n  subPillarName: string;\n  score: number;\n}\nexport interface DmiPillar {\n  pillarName: string;\n  score: number;\n  subPillars: DmiSubPillar[];\n}\n\nexport const getDmiPillars = async (countryCode: string, year: number) => {\n  const result = await fetch(\n    `${BASE_URL}/DMI/GetDMIPillarByCountryCodeAndYears?countryCode=${countryCode}&year=${year}`,\n    {\n      method: \"GET\",\n    }\n  );\n\n  if (!result.ok) {\n    return {\n      success: false,\n      error: result.statusText,\n    };\n  }\n\n  const dmiPillars: DmiPillar[] = await result.json();\n\n  return {\n    success: true,\n    data: dmiPillars,\n  };\n};\n\nexport interface GccOecdScore {\n  gccValues: number;\n  oecdValues: number;\n}\nexport const getGccOecdScore = async () => {\n  const result = await fetch(`${BASE_URL}/DMI/GetGCC_OECDDMI`, {\n    method: \"GET\",\n  });\n\n  if (!result.ok) {\n    return {\n      success: false,\n      error: result.statusText,\n    };\n  }\n\n  const dmiScore: GccOecdScore = await result.json();\n\n  return {\n    success: true,\n    data: dmiScore,\n  };\n};\n","import { useEffect } from \"react\";\nimport styled from \"styled-components\";\n\ninterface ModalProps {\n  show: boolean;\n  children: any;\n  className?: string;\n}\n\nconst ModalContainer = styled.div<{ show: boolean }>`\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: rgba(0, 0, 0, 0.6);\n  display: ${(props) => (props.show ? \"block\" : \"none\")};\n  overflow: ${(props) => (props.show ? \"hidden\" : \"auto\")};\n  z-index: 1000;\n`;\n\nconst ModalBody = styled.section`\n  position: fixed;\n  background: white;\n  width: 80%;\n  height: auto;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 1001;\n  display: flex;\n  flex-direction: column;\n`;\n\nconst Modal = ({ show, children, className }: ModalProps) => {\n  // useEffect(() => {\n  //   if (show) {\n  //     document.body.style.overflow = \"hidden\";\n  //   } else {\n  //     document.body.style.overflow = \"auto\";\n  //   }\n  // }, [show]);\n\n  return (\n    <ModalContainer show={show}>\n      <ModalBody className={className}>{children}</ModalBody>\n    </ModalContainer>\n  );\n};\n\nexport default Modal;\n","export const CountryGpsCoords = [\n  {\n    country: \"United States\",\n    gpsLat: 39.91,\n    gpsLong: -77.02,\n  },\n  {\n    country: \"China\",\n    gpsLat: 39.55,\n    gpsLong: 116.2,\n  },\n  {\n    country: \"Japan\",\n    gpsLat: 35.6762,\n    gpsLong: 139.6503,\n  },\n  {\n    country: \"United Kingdom\",\n    gpsLat: 51.36,\n    gpsLong: -0.05,\n  },\n  {\n    country: \"Germany\",\n    gpsLat: 52.3,\n    gpsLong: 13.25,\n  },\n  {\n    country: \"Korea\",\n    gpsLat: 37.31,\n    gpsLong: 126.58,\n  },\n  {\n    country: \"France\",\n    gpsLat: 48.5,\n    gpsLong: 2.2,\n  },\n  {\n    country: \"Brazil\",\n    gpsLat: -15.47,\n    gpsLong: -47.55,\n  },\n  {\n    country: \"Canada\",\n    gpsLat: 45.27,\n    gpsLong: -75.42,\n  },\n  {\n    country: \"Italy\",\n    gpsLat: 41.54,\n    gpsLong: 12.29,\n  },\n  {\n    country: \"India\",\n    gpsLat: 28.37,\n    gpsLong: 77.13,\n  },\n  {\n    country: \"Australia\",\n    gpsLat: -35.15,\n    gpsLong: 149.08,\n  },\n  {\n    country: \"Russia\",\n    gpsLat: 55.45,\n    gpsLong: 37.35,\n  },\n  {\n    country: \"Spain\",\n    gpsLat: 40.25,\n    gpsLong: -3.45,\n  },\n  {\n    country: \"Mexico\",\n    gpsLat: 19.2,\n    gpsLong: -99.1,\n  },\n  {\n    country: \"Indonesia\",\n    gpsLat: -6.09,\n    gpsLong: 106.49,\n  },\n  {\n    country: \"Saudi Arabia\",\n    gpsLat: 24.41,\n    gpsLong: 46.42,\n  },\n  {\n    country: \"Islamic Republic of Iran\",\n    gpsLat: 35.44,\n    gpsLong: 51.3,\n  },\n  {\n    country: \"Netherlands\",\n    gpsLat: 52.23,\n    gpsLong: 4.54,\n  },\n  {\n    country: \"Switzerland\",\n    gpsLat: 46.57,\n    gpsLong: 7.28,\n  },\n];\n\nexport const ColorValues = {\n  red: [\n    \"#fae5e9\",\n    \"#f4cbd2\",\n    \"#efb2bc\",\n    \"#eba0ad\",\n    \"#e68797\",\n    \"#e06d80\",\n    \"#db536a\",\n    \"#d93954\",\n    \"#a32020\",\n    \"#6e2a35\",\n  ],\n};\n","import styled from \"styled-components\";\nimport { ColorValues } from \"utils/contants\";\n\ninterface LegendItemProps {\n  value?: number;\n  color: string;\n}\n\nconst ButtonWrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-end;\n  margin-right: 5px;\n  cursor: default;\n  flex-grow: 1;\n\n  :last-child {\n    margin-right: 0;\n  }\n\n  @media (max-width: 768px) {\n    margin-right: 2px;\n  }\n`;\n\nconst LegendButton = styled.button<\n  LegendItemProps & { selected: boolean | null }\n>`\n  width: 100%;\n  height: 20px;\n  background-color: ${(props) => props.color};\n  border-style: none;\n  cursor: default;\n  transform: scaleY(${(props) => (props.selected ? 1.3 : 1)});\n  transition: transform 0.2s ease-in-out;\n\n  ${ButtonWrapper}:first-child & {\n    border-top-left-radius: 25px;\n    border-bottom-left-radius: 25px;\n  }\n  ${ButtonWrapper}:last-child & {\n    border-top-right-radius: 25px;\n    border-bottom-right-radius: 25px;\n  }\n\n  ${ButtonWrapper}:hover & {\n    transform: scaleY(1.3);\n  }\n`;\n\nconst LegendWrapper = styled.div`\n  display: flex;\n  justify-content: center;\n`;\n\nconst MapLegend = ({\n  handleLegendClick,\n  className,\n  selectedValue,\n}: {\n  handleLegendClick: (index: number) => void;\n  className?: string;\n  selectedValue?: number;\n}) => {\n  return (\n    <LegendWrapper className={className}>\n      {ColorValues.red.map((color, index) => {\n        const value = (index + 1) * 10;\n\n        return (\n          <ButtonWrapper onClick={() => handleLegendClick(value)} key={value}>\n            <span>{value}</span>\n            <LegendButton\n              color={color}\n              selected={selectedValue ? selectedValue === value : false}\n            ></LegendButton>\n          </ButtonWrapper>\n        );\n      })}\n    </LegendWrapper>\n  );\n};\n\nexport default MapLegend;\n","import styled from \"styled-components\";\n\ninterface SectionProps {\n  children: any;\n  zIndex?: number;\n  height?: \"viewport\" | \"component\";\n}\n\nconst SectionWipeDiv = styled.div`\n  scroll-snap-align: start;\n  position: relative;\n`;\n\nconst Section = ({ children = \"viewport\", zIndex }: SectionProps) => {\n  return <SectionWipeDiv style={{ zIndex: zIndex }}>{children}</SectionWipeDiv>;\n};\n\nexport default Section;\n","import { DmiPillar, DmiSubPillar } from \"services\";\nimport styled from \"styled-components\";\nimport \"flag-icon-css/css/flag-icon.min.css\";\nimport { CircularProgressbar, buildStyles } from \"react-circular-progressbar\";\nimport \"react-circular-progressbar/dist/styles.css\";\nimport { CloseIcon } from \"./Common\";\n\ninterface SidebarProps {\n  show: boolean;\n  country: string;\n  pillars: DmiPillar[];\n  handleClose: () => void;\n  className?: string;\n  code: string;\n}\n\ninterface SidebarContainerProps {\n  show: boolean;\n}\n\nconst SubPillarColors = [\"#A32020\", \"#E68797\", \"#F4CBD2\"];\n\nconst SidebarOverlay = styled.div<SidebarContainerProps>`\n  position: fixed;\n  height: 100%;\n  width: 100%;\n  background-color: rgba(0, 0, 0, 0.6);\n  left: 0;\n  right: 0;\n  top: 0;\n  bottom: 0;\n  z-index: ${(props) => (props.show ? \"101\" : \"-1\")};\n  display: ${(props) => (props.show ? \"block\" : \"none\")};\n  opacity: ${(props) => (props.show ? \"1\" : \"0\")};\n  transition: opacity 0.3s ease-in-out;\n`;\n\nconst SidebarContainer = styled.div<SidebarContainerProps>`\n  position: fixed;\n  height: 100%;\n  width: 350px;\n  background-color: #ebebeb;\n  right: ${(props) => (props.show ? \"0\" : \"-100vw\")};\n  top: 0;\n  bottom: 0;\n  z-index: 102;\n  padding: 10px;\n  transition: right 0.2s ease-in-out;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  overflow-y: scroll;\n  padding: 50px 10px;\n\n  -ms-overflow-style: none; /* IE and Edge */\n  scrollbar-width: none; /* Firefox */\n  ::-webkit-scrollbar {\n    display: none;\n  }\n\n  @media (max-width: 768px) {\n    width: 100vw;\n    padding: 100px 20px;\n  }\n`;\n\nconst StyledCloseIcon = styled(CloseIcon)`\n  position: absolute;\n  height: 18px;\n  top: -36px;\n  right: 10px;\n  cursor: pointer;\n`;\n\nconst ContentContainer = styled.div`\n  position: relative;\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 10px 10px;\n  width: 100%;\n  max-height: 100%;\n  margin: auto;\n\n  @media (max-width: 768px) {\n    gap: 20px 20px;\n  }\n`;\n\nconst GridItemContainer = styled.div<{ bgColor: string; spaced: boolean }>`\n  background-color: ${(props) => props.bgColor};\n  padding: 15px;\n  border-radius: 10px;\n  height: 200px;\n  display: flex;\n  flex-direction: column;\n  justify-content: ${(props) =>\n    props.spaced ? \"space-between\" : \"flex-start\"};\n  box-shadow: 0px 100px 80px rgba(180, 180, 180, 0.07),\n    0px 41.7776px 33.4221px rgba(168, 168, 168, 0.0503198),\n    0px 22.3363px 17.869px rgba(165, 165, 165, 0.0417275),\n    0px 12.5216px 10.0172px rgba(176, 176, 176, 0.035),\n    0px 6.6501px 5.32008px rgba(171, 171, 171, 0.0282725),\n    0px 2.76726px 2.21381px rgba(170, 170, 170, 0.0196802);\n`;\n\nconst Flag = styled.div`\n  & span.flag-icon {\n    width: 40px;\n    height: 40px;\n    border-radius: 50% !important;\n  }\n`;\n\nconst CountryName = styled.div`\n  color: #ffffff;\n  font-family: Arial;\n  font-weight: bold;\n  font-size: 24px;\n  line-height: 28px;\n`;\n\nconst Country = ({ name, code }: { name: string; code: string }) => {\n  return (\n    <GridItemContainer bgColor=\"#464646\" spaced>\n      <Flag>\n        <span\n          className={`flag-icon flag-icon-squared flag-icon-${code.toLowerCase()}`}\n        ></span>\n      </Flag>\n      <CountryName>{name}</CountryName>\n    </GridItemContainer>\n  );\n};\n\nconst CircleContainer = styled.div`\n  width: 40px;\n`;\n\nconst PillarName = styled.span`\n  color: #000000;\n  font-family: Arial;\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 18px;\n  margin: 5px 0 0;\n`;\n\nconst SubPillarContainer = styled.div``;\n\nconst SubPillarName = styled.div`\n  color: #717171;\n  font-family: Arial;\n  font-weight: normal;\n  font-size: 11px;\n  line-height: 18px;\n`;\n\nconst SubPillarProgress = styled.div`\n  display: flex;\n  align-items: center;\n  width: 100%;\n`;\n\nconst SubPillarScore = styled.div`\n  color: #212121;\n  font-family: Arial;\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 18px;\n  margin-right: 5px;\n`;\n\nconst SubPillarBar = styled.div<{ progress: number; color: string }>`\n  flex-grow: 1;\n  position: relative;\n  width: 100%;\n  flex-basis: 50%;\n\n  ::before,\n  ::after {\n    content: \"\";\n    position: absolute;\n    top: -2.5px;\n    left: 0;\n    width: 100%;\n    height: 4px;\n    background-color: rgba(0, 0, 0, 0.1);\n    border-radius: 5px;\n  }\n  ::after {\n    background-color: ${(props) => props.color};\n    width: ${(props) => `${props.progress}%` || \"0\"};\n    height: 6px;\n    top: -3px;\n  }\n`;\n\nconst SubPillar = ({\n  subPillar,\n  color,\n}: {\n  subPillar: DmiSubPillar;\n  color: string;\n}) => {\n  return (\n    <SubPillarContainer>\n      <SubPillarName>{subPillar.subPillarName}</SubPillarName>\n      <SubPillarProgress>\n        <SubPillarScore>{subPillar.score}</SubPillarScore>\n        <SubPillarBar progress={subPillar.score} color={color} />\n      </SubPillarProgress>\n    </SubPillarContainer>\n  );\n};\n\nconst Pillar = ({ pillar }: { pillar: DmiPillar }) => {\n  return (\n    <GridItemContainer bgColor=\"#ffffff\" spaced={false}>\n      <CircleContainer>\n        <CircularProgressbar\n          value={pillar.score}\n          text={`${pillar.score}`}\n          styles={buildStyles({\n            textSize: \"2.2em\",\n            textColor: \"#212121\",\n            pathColor: \"#717171\",\n            trailColor: \"#EEEEEE\",\n            strokeLinecap: \"butt\",\n          })}\n          strokeWidth={8}\n        />\n      </CircleContainer>\n      <PillarName>{pillar.pillarName}</PillarName>\n      {pillar.subPillars.map((subPillar, index) => (\n        <SubPillar\n          subPillar={subPillar}\n          color={SubPillarColors[index]}\n          key={subPillar.subPillarName}\n        />\n      ))}\n    </GridItemContainer>\n  );\n};\n\nconst SidebarV2 = ({\n  country,\n  code,\n  pillars,\n  handleClose,\n  show,\n  className,\n}: SidebarProps) => {\n  return (\n    <div className={className}>\n      <SidebarOverlay show={show} onClick={handleClose} />\n      <SidebarContainer show={show}>\n        <ContentContainer>\n          <StyledCloseIcon onClick={handleClose} fill=\"#000\" opacity={0.5} />\n          <Country code={code} name={country} />\n          {pillars.map((pillar) => (\n            <Pillar pillar={pillar} key={pillar.pillarName} />\n          ))}\n        </ContentContainer>\n      </SidebarContainer>\n    </div>\n  );\n};\n\nexport default SidebarV2;\n","import { useEffect, useRef } from \"react\";\nimport gsap from \"gsap\";\nimport styled from \"styled-components\";\n\nconst StyledSvg = styled.svg`\n  .cls-1 {\n    opacity: 0.9;\n  }\n\n  .cls-10,\n  .cls-2 {\n    fill: none;\n  }\n\n  .cls-2 {\n    stroke: #fff;\n    stroke-width: 2px;\n    opacity: 0.12;\n  }\n\n  .cls-2,\n  .cls-5,\n  .cls-7 {\n    stroke-linejoin: round;\n  }\n\n  .cls-3,\n  .cls-4,\n  .cls-6 {\n    fill: #fff;\n  }\n\n  .cls-3 {\n    opacity: 0.2;\n  }\n\n  .cls-4 {\n    font-size: 20px;\n    font-family: Arial-BoldMT, Arial;\n    font-weight: 700;\n  }\n\n  .cls-5,\n  .cls-9 {\n    fill: rgba(219, 83, 106, 0.2);\n  }\n\n  .cls-10,\n  .cls-5 {\n    stroke: #db536a;\n  }\n\n  .cls-5,\n  .cls-7 {\n    stroke-width: 9.218px;\n  }\n\n  .cls-7 {\n    fill: rgba(144, 144, 144, 0.3);\n    stroke: #909090;\n  }\n\n  .cls-8 {\n    fill: #909090;\n  }\n\n  .cls-10 {\n    stroke-linecap: round;\n    stroke-width: 10px;\n    stroke-dasharray: 1358;\n  }\n\n  .cls-11 {\n    fill: rgba(219, 83, 106, 0);\n  }\n\n  .cls-12 {\n    fill: rgba(70, 70, 70, 0.8);\n  }\n\n  .cls-13 {\n    fill: #db536a;\n  }\n`;\n\nconst SpiderChart = ({\n  className,\n  stage,\n}: {\n  className?: string;\n  stage: number;\n}) => {\n  const gcc5PlotStrokeRef = useRef<SVGPathElement>(null);\n  const gcc5PlotFillRef = useRef<SVGPathElement>(null);\n  const gcc4PlotFillRef = useRef<SVGPathElement>(null);\n  const gcc3PlotFillRef = useRef<SVGPathElement>(null);\n\n  const point1Label = useRef<SVGGElement>(null);\n  const point2Label = useRef<SVGGElement>(null);\n  const point3Label = useRef<SVGGElement>(null);\n  const point4Label = useRef<SVGGElement>(null);\n  const point5Label = useRef<SVGGElement>(null);\n\n  const animatePosition = gsap.timeline();\n\n  useEffect(() => {\n    const STROKE_OFFSET_ARRAY = [1, 0.999, 0.802, 0.634, 0.407, 0];\n\n    const totalLength = gcc5PlotStrokeRef.current!.getTotalLength();\n\n    // Stroke animation\n    if (stage === 0) {\n      animatePosition.to(\n        gcc5PlotStrokeRef.current,\n        {\n          opacity: 0,\n          strokeDasharray: totalLength,\n          strokeDashoffset: totalLength * STROKE_OFFSET_ARRAY[stage],\n        },\n        0\n      );\n    } else {\n      animatePosition.to(\n        gcc5PlotStrokeRef.current,\n        {\n          opacity: 1,\n          strokeDasharray: totalLength,\n          strokeDashoffset: totalLength * STROKE_OFFSET_ARRAY[stage],\n        },\n        0\n      );\n    }\n\n    // Fill animation\n    const plotFillArray = [\n      gcc5PlotFillRef.current!,\n      gcc4PlotFillRef.current!,\n      gcc3PlotFillRef.current!,\n    ];\n    if (stage > 2) {\n      plotFillArray.forEach((svgFill, i) => {\n        if (i === 5 - stage) {\n          animatePosition.to(\n            svgFill,\n            {\n              fillOpacity: 0.2,\n            },\n            0\n          );\n        } else {\n          animatePosition.to(\n            svgFill,\n            {\n              fillOpacity: 0,\n            },\n            0\n          );\n        }\n      });\n    } else {\n      plotFillArray.forEach((svgFill, i) => {\n        animatePosition.to(\n          svgFill,\n          {\n            fillOpacity: 0,\n          },\n          0\n        );\n      });\n    }\n\n    // Label animation\n    const labelArray = [\n      point1Label.current!,\n      point2Label.current!,\n      point3Label.current!,\n      point4Label.current!,\n      point5Label.current!,\n    ];\n\n    labelArray.forEach((label, index) => {\n      if (index <= stage - 1) {\n        animatePosition.to(\n          label,\n          {\n            opacity: 1,\n          },\n          0\n        );\n      } else {\n        animatePosition.to(\n          label,\n          {\n            opacity: 0,\n          },\n          0\n        );\n      }\n    });\n\n    animatePosition.play();\n  }, [stage, animatePosition]);\n\n  return (\n    <StyledSvg\n      viewBox=\"0 0 912 884\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={className}\n    >\n      <g id=\"Desktop - 1\" transform=\"translate(-0.621 -9.684)\">\n        <g id=\"PillarChart_01\">\n          <g id=\"graph\">\n            <g id=\"ticks\">\n              <g id=\"ticks_line\" className=\"cls-1\">\n                <path\n                  id=\"Vector\"\n                  className=\"cls-2\"\n                  d=\"M485.767,214.205,707.242,375.116a7,7,0,0,1,2.543,7.826l-84.6,260.36a7,7,0,0,1-6.658,4.837H344.773a7,7,0,0,1-6.657-4.837l-84.6-260.36a7,7,0,0,1,2.543-7.826L477.538,214.205A7,7,0,0,1,485.767,214.205Z\"\n                />\n                <path\n                  id=\"Vector_2\"\n                  className=\"cls-2\"\n                  d=\"M485.767,167.051,752.086,360.544a7,7,0,0,1,2.543,7.826L652.9,681.448a7,7,0,0,1-6.657,4.837H317.057a7,7,0,0,1-6.657-4.837L208.675,368.37a7,7,0,0,1,2.543-7.826l266.32-193.493A7,7,0,0,1,485.767,167.051Z\"\n                />\n                <path\n                  id=\"Vector_3\"\n                  className=\"cls-2\"\n                  d=\"M485.767,121.713l309.44,224.821a7,7,0,0,1,2.543,7.826l-118.2,363.768a7,7,0,0,1-6.657,4.837H290.408a7,7,0,0,1-6.657-4.837L165.555,354.36a7,7,0,0,1,2.543-7.826l309.44-224.821A7,7,0,0,1,485.767,121.713Z\"\n                />\n                <path\n                  id=\"Vector_4\"\n                  className=\"cls-2\"\n                  d=\"M485.767,77.369,837.38,332.831a7,7,0,0,1,2.543,7.826L705.619,754a7,7,0,0,1-6.658,4.837H264.343A7,7,0,0,1,257.686,754l-134.3-413.347a7,7,0,0,1,2.543-7.826L477.538,77.369A7,7,0,0,1,485.767,77.369Z\"\n                />\n                <path\n                  id=\"Vector_5\"\n                  className=\"cls-2\"\n                  d=\"M485.767,260.842,662.886,389.527a7,7,0,0,1,2.543,7.826L597.775,605.57a7,7,0,0,1-6.657,4.836H372.186a7,7,0,0,1-6.657-4.836L297.875,397.353a7,7,0,0,1,2.543-7.826l177.12-128.685A7,7,0,0,1,485.767,260.842Z\"\n                />\n                <path\n                  id=\"Vector_6\"\n                  className=\"cls-2\"\n                  d=\"M485.767,308.9l131.411,95.476a7,7,0,0,1,2.543,7.826l-50.2,154.484a7,7,0,0,1-6.657,4.837H400.435a7,7,0,0,1-6.657-4.837L343.583,412.2a7,7,0,0,1,2.543-7.826L477.538,308.9A7,7,0,0,1,485.767,308.9Z\"\n                />\n                <path\n                  id=\"Vector_7\"\n                  className=\"cls-2\"\n                  d=\"M485.767,356.83l85.83,62.359a7,7,0,0,1,2.543,7.827l-32.784,100.9a7,7,0,0,1-6.658,4.837H428.606a7,7,0,0,1-6.658-4.837l-32.784-100.9a7,7,0,0,1,2.543-7.827l85.831-62.359A7,7,0,0,1,485.767,356.83Z\"\n                />\n                <path\n                  id=\"Vector_8\"\n                  className=\"cls-2\"\n                  d=\"M485.767,405.312l39.721,28.859A7,7,0,0,1,528.031,442l-15.172,46.695a7,7,0,0,1-6.658,4.837H457.1a7,7,0,0,1-6.658-4.837L435.274,442a7,7,0,0,1,2.543-7.826l39.721-28.859A7,7,0,0,1,485.767,405.312Z\"\n                />\n                <path\n                  id=\"Vector_9\"\n                  className=\"cls-2\"\n                  d=\"M482.828,441.971l8.7,6.324a2,2,0,0,1,.726,2.236l-3.324,10.232a2,2,0,0,1-1.9,1.382H476.273a2,2,0,0,1-1.9-1.382l-3.325-10.232a2,2,0,0,1,.727-2.236l8.7-6.324A2,2,0,0,1,482.828,441.971Z\"\n                />\n              </g>\n              <g id=\"ticks_value\" className=\"cls-1\">\n                <path\n                  id=\"Vector_10\"\n                  className=\"cls-3\"\n                  d=\"M510.958,416.43h-2.744V406.088a9.457,9.457,0,0,1-3.545,2.08v-2.49A8,8,0,0,0,507,404.35a5.1,5.1,0,0,0,1.729-2.3h2.226Zm8.31-14.375a3.91,3.91,0,0,1,3.252,1.484q1.4,1.758,1.4,5.83t-1.407,5.84a3.9,3.9,0,0,1-3.242,1.465,4.1,4.1,0,0,1-3.369-1.6q-1.279-1.611-1.279-5.732,0-4.043,1.406-5.82A3.905,3.905,0,0,1,519.268,402.055Zm0,2.275a1.36,1.36,0,0,0-.888.322,2.1,2.1,0,0,0-.606,1.133,23.3,23.3,0,0,0-.029,7.051,2.45,2.45,0,0,0,.635,1.25,1.421,1.421,0,0,0,1.777,0,2.164,2.164,0,0,0,.605-1.143,23.12,23.12,0,0,0,.03-7.031,2.421,2.421,0,0,0-.645-1.26A1.325,1.325,0,0,0,519.268,404.33Z\"\n                />\n                <path\n                  id=\"Vector_11\"\n                  className=\"cls-3\"\n                  d=\"M494.434,428.055a3.91,3.91,0,0,1,3.252,1.484q1.4,1.758,1.4,5.83t-1.407,5.84a3.9,3.9,0,0,1-3.242,1.465,4.1,4.1,0,0,1-3.369-1.6q-1.279-1.611-1.279-5.732,0-4.043,1.406-5.82A3.9,3.9,0,0,1,494.434,428.055Zm0,2.275a1.364,1.364,0,0,0-.889.322,2.1,2.1,0,0,0-.605,1.133,23.295,23.295,0,0,0-.029,7.051,2.458,2.458,0,0,0,.634,1.25,1.422,1.422,0,0,0,1.778,0,2.164,2.164,0,0,0,.605-1.143,23.208,23.208,0,0,0,.03-7.031,2.429,2.429,0,0,0-.645-1.26A1.325,1.325,0,0,0,494.434,430.33Z\"\n                />\n                <path\n                  id=\"Vector_12\"\n                  className=\"cls-3\"\n                  d=\"M539.826,382.881v2.549h-9.619a6.586,6.586,0,0,1,.937-2.735,18.147,18.147,0,0,1,3.086-3.437,19.491,19.491,0,0,0,2.276-2.344,3.021,3.021,0,0,0,.566-1.68,1.882,1.882,0,0,0-.5-1.406,2.081,2.081,0,0,0-2.725.02,2.666,2.666,0,0,0-.586,1.718l-2.734-.273a4.487,4.487,0,0,1,1.533-3.252,5.148,5.148,0,0,1,3.223-.986,4.659,4.659,0,0,1,3.33,1.142,3.749,3.749,0,0,1,1.211,2.842,4.912,4.912,0,0,1-.352,1.846,7.376,7.376,0,0,1-1.093,1.826,17.554,17.554,0,0,1-1.8,1.826q-1.3,1.191-1.651,1.582a4.928,4.928,0,0,0-.556.762Zm6.064-11.826a3.91,3.91,0,0,1,3.252,1.484q1.4,1.758,1.4,5.83t-1.406,5.84a3.9,3.9,0,0,1-3.242,1.465,4.1,4.1,0,0,1-3.369-1.6q-1.279-1.611-1.28-5.732,0-4.043,1.407-5.82A3.9,3.9,0,0,1,545.89,371.055Zm0,2.275a1.364,1.364,0,0,0-.889.322,2.1,2.1,0,0,0-.6,1.133,23.335,23.335,0,0,0-.03,7.051,2.458,2.458,0,0,0,.635,1.25,1.423,1.423,0,0,0,1.778,0,2.163,2.163,0,0,0,.6-1.143,23.164,23.164,0,0,0,.029-7.031,2.422,2.422,0,0,0-.644-1.26A1.325,1.325,0,0,0,545.89,373.33Z\"\n                />\n                <path\n                  id=\"Vector_13\"\n                  className=\"cls-3\"\n                  d=\"M549.461,349.806l2.656-.323a2.513,2.513,0,0,0,.684,1.553,1.869,1.869,0,0,0,1.347.537,1.837,1.837,0,0,0,1.426-.644,2.485,2.485,0,0,0,.586-1.739,2.328,2.328,0,0,0-.557-1.64,1.773,1.773,0,0,0-1.357-.606,4.814,4.814,0,0,0-1.26.2l.3-2.236a2.421,2.421,0,0,0,1.7-.478,1.735,1.735,0,0,0,.586-1.368A1.48,1.48,0,0,0,554,341.485a1.651,1.651,0,0,0-1.2.489,2.293,2.293,0,0,0-.606,1.425l-2.529-.429a5.665,5.665,0,0,1,.791-2.071,3.591,3.591,0,0,1,1.484-1.22,4.966,4.966,0,0,1,2.139-.45,4.254,4.254,0,0,1,3.242,1.29,3.263,3.263,0,0,1-1.055,5.39,3.311,3.311,0,0,1,1.963,1.182,3.413,3.413,0,0,1,.742,2.217,4.3,4.3,0,0,1-1.377,3.213,5.149,5.149,0,0,1-6.65.214A4.406,4.406,0,0,1,549.461,349.806Zm15.429-10.577a3.911,3.911,0,0,1,3.252,1.485q1.4,1.758,1.4,5.83t-1.406,5.84a3.907,3.907,0,0,1-3.242,1.465,4.1,4.1,0,0,1-3.369-1.6q-1.279-1.611-1.28-5.732,0-4.044,1.407-5.821A3.905,3.905,0,0,1,564.89,339.229Zm0,2.276a1.359,1.359,0,0,0-.889.322,2.1,2.1,0,0,0-.6,1.133,23.335,23.335,0,0,0-.03,7.051,2.462,2.462,0,0,0,.635,1.25,1.423,1.423,0,0,0,1.778,0,2.163,2.163,0,0,0,.6-1.143,23.164,23.164,0,0,0,.029-7.031,2.413,2.413,0,0,0-.644-1.26A1.32,1.32,0,0,0,564.89,341.505Z\"\n                />\n                <path\n                  id=\"Vector_14\"\n                  className=\"cls-3\"\n                  d=\"M575.884,321.6v-2.88h-5.86v-2.4l6.211-9.092h2.3v9.083h1.777v2.412H578.54v2.88Zm0-5.292v-4.893l-3.291,4.893Zm9.95-9.083a3.91,3.91,0,0,1,3.252,1.485q1.4,1.758,1.4,5.83t-1.407,5.84a3.905,3.905,0,0,1-3.242,1.465,4.1,4.1,0,0,1-3.369-1.6q-1.28-1.611-1.279-5.732,0-4.044,1.406-5.821A3.907,3.907,0,0,1,585.834,307.229Zm0,2.276a1.355,1.355,0,0,0-.888.322,2.094,2.094,0,0,0-.606,1.133,23.3,23.3,0,0,0-.029,7.051,2.455,2.455,0,0,0,.635,1.25,1.421,1.421,0,0,0,1.777,0,2.164,2.164,0,0,0,.6-1.143,23.12,23.12,0,0,0,.03-7.031,2.413,2.413,0,0,0-.645-1.26A1.32,1.32,0,0,0,585.834,309.505Z\"\n                />\n                <path\n                  id=\"Vector_15\"\n                  className=\"cls-3\"\n                  d=\"M596.455,287.923l2.734-.283a2.36,2.36,0,0,0,.694,1.474,1.889,1.889,0,0,0,1.328.537,1.849,1.849,0,0,0,1.455-.693,3.2,3.2,0,0,0,.6-2.109,2.849,2.849,0,0,0-.6-1.973,1.947,1.947,0,0,0-1.533-.664,2.8,2.8,0,0,0-2.12,1.045l-2.226-.322,1.406-7.452h7.256v2.569h-5.176l-.429,2.431a4.193,4.193,0,0,1,4.97.87,4.779,4.779,0,0,1,1.27,3.447,5.166,5.166,0,0,1-1.026,3.154,4.546,4.546,0,0,1-3.877,1.895,4.81,4.81,0,0,1-3.232-1.065A4.384,4.384,0,0,1,596.455,287.923Zm15.292-10.694A3.911,3.911,0,0,1,615,278.714q1.4,1.758,1.4,5.83t-1.407,5.84a3.905,3.905,0,0,1-3.242,1.465,4.1,4.1,0,0,1-3.369-1.6q-1.279-1.611-1.279-5.732,0-4.044,1.406-5.821A3.908,3.908,0,0,1,611.747,277.229Zm0,2.276a1.355,1.355,0,0,0-.888.322,2.1,2.1,0,0,0-.606,1.133,23.292,23.292,0,0,0-.029,7.051,2.454,2.454,0,0,0,.635,1.25,1.421,1.421,0,0,0,1.777,0,2.164,2.164,0,0,0,.605-1.143,23.12,23.12,0,0,0,.03-7.031,2.413,2.413,0,0,0-.645-1.26A1.32,1.32,0,0,0,611.747,279.505Z\"\n                />\n                <path\n                  id=\"Vector_16\"\n                  className=\"cls-3\"\n                  d=\"M629.8,252.281l-2.657.293a1.937,1.937,0,0,0-.507-1.211,1.484,1.484,0,0,0-1.065-.39,1.811,1.811,0,0,0-1.475.781,6.633,6.633,0,0,0-.751,3.252,3.208,3.208,0,0,1,2.548-1.211,3.876,3.876,0,0,1,2.94,1.309,4.732,4.732,0,0,1,1.23,3.378,4.846,4.846,0,0,1-1.289,3.526,4.7,4.7,0,0,1-6.875-.352q-1.4-1.689-1.4-5.527,0-3.936,1.455-5.674a4.7,4.7,0,0,1,3.779-1.738,3.978,3.978,0,0,1,2.7.918A4.242,4.242,0,0,1,629.8,252.281Zm-6.221,5.987a3.129,3.129,0,0,0,.615,2.07,1.814,1.814,0,0,0,1.406.723,1.6,1.6,0,0,0,1.27-.6,3,3,0,0,0,.508-1.953,3.125,3.125,0,0,0-.547-2.041,1.749,1.749,0,0,0-2.705-.03A2.674,2.674,0,0,0,623.579,258.268Zm12.255-9.551a3.912,3.912,0,0,1,3.252,1.484q1.4,1.758,1.4,5.83t-1.407,5.84a3.9,3.9,0,0,1-3.242,1.465,4.1,4.1,0,0,1-3.369-1.6q-1.28-1.611-1.279-5.732,0-4.043,1.406-5.82A3.9,3.9,0,0,1,635.834,248.717Zm0,2.275a1.36,1.36,0,0,0-.888.322,2.1,2.1,0,0,0-.606,1.133,23.295,23.295,0,0,0-.029,7.051,2.45,2.45,0,0,0,.635,1.25,1.418,1.418,0,0,0,1.777,0,2.164,2.164,0,0,0,.6-1.143,23.12,23.12,0,0,0,.03-7.031,2.422,2.422,0,0,0-.645-1.26A1.325,1.325,0,0,0,635.834,250.992Z\"\n                />\n                <path\n                  id=\"Vector_17\"\n                  className=\"cls-3\"\n                  d=\"M642.5,221.52v-2.549h9.384v1.992a14.8,14.8,0,0,0-2.363,3.281,19.256,19.256,0,0,0-1.836,4.551,16.973,16.973,0,0,0-.615,4.3h-2.646a18.46,18.46,0,0,1,1.22-6.055,20.284,20.284,0,0,1,3.1-5.517Zm15.331-2.8a3.912,3.912,0,0,1,3.252,1.484q1.4,1.758,1.4,5.83t-1.407,5.84a3.9,3.9,0,0,1-3.242,1.465,4.1,4.1,0,0,1-3.369-1.6q-1.28-1.611-1.279-5.732,0-4.042,1.406-5.82A3.9,3.9,0,0,1,657.834,218.717Zm0,2.275a1.36,1.36,0,0,0-.888.322,2.1,2.1,0,0,0-.606,1.133,23.3,23.3,0,0,0-.029,7.051,2.45,2.45,0,0,0,.635,1.25,1.418,1.418,0,0,0,1.777,0,2.164,2.164,0,0,0,.6-1.143,23.12,23.12,0,0,0,.03-7.031,2.422,2.422,0,0,0-.645-1.26A1.325,1.325,0,0,0,657.834,220.992Z\"\n                />\n                <path\n                  id=\"Vector_18\"\n                  className=\"cls-3\"\n                  d=\"M666.856,195.367a3.243,3.243,0,0,1-1.553-1.23,3.281,3.281,0,0,1-.478-1.729,3.471,3.471,0,0,1,1.113-2.646,5.343,5.343,0,0,1,6.348,0,3.443,3.443,0,0,1,1.133,2.646,3.149,3.149,0,0,1-.518,1.778,3.286,3.286,0,0,1-1.455,1.181,3.808,3.808,0,0,1,1.807,1.4,3.679,3.679,0,0,1,.625,2.119,4.3,4.3,0,0,1-1.27,3.222,4.579,4.579,0,0,1-3.359,1.241A5.084,5.084,0,0,1,666,202.32a4,4,0,0,1-1.533-3.32,4.083,4.083,0,0,1,.576-2.129A3.7,3.7,0,0,1,666.856,195.367Zm.567-2.763a1.73,1.73,0,0,0,.459,1.279,1.918,1.918,0,0,0,2.49,0,1.744,1.744,0,0,0,.469-1.289,1.608,1.608,0,0,0-1.69-1.7,1.706,1.706,0,0,0-1.26.468A1.68,1.68,0,0,0,667.423,192.6Zm-.254,6.132a2.535,2.535,0,0,0,.576,1.768,1.9,1.9,0,0,0,1.455.635,1.827,1.827,0,0,0,1.406-.606,2.546,2.546,0,0,0,.557-1.767,2.264,2.264,0,0,0-.567-1.612,1.866,1.866,0,0,0-1.435-.615,1.73,1.73,0,0,0-1.5.693A2.559,2.559,0,0,0,667.169,198.736Zm12.665-10.019a3.912,3.912,0,0,1,3.252,1.484q1.4,1.758,1.4,5.83t-1.407,5.84a3.9,3.9,0,0,1-3.242,1.465,4.1,4.1,0,0,1-3.369-1.6q-1.28-1.611-1.279-5.732,0-4.042,1.406-5.82A3.9,3.9,0,0,1,679.834,188.717Zm0,2.275a1.36,1.36,0,0,0-.888.322,2.1,2.1,0,0,0-.606,1.133,23.3,23.3,0,0,0-.029,7.051,2.45,2.45,0,0,0,.635,1.25,1.418,1.418,0,0,0,1.777,0,2.164,2.164,0,0,0,.6-1.143,23.12,23.12,0,0,0,.03-7.031,2.422,2.422,0,0,0-.645-1.26A1.325,1.325,0,0,0,679.834,190.992Z\"\n                />\n              </g>\n            </g>\n            <g id=\"labels\">\n              <text\n                id=\"Digital_foundations\"\n                data-name=\"Digital foundations\"\n                className=\"cls-4\"\n                transform=\"translate(481.621 27.684)\"\n              >\n                <tspan x=\"-30.557\" y=\"0\">\n                  Digital\n                </tspan>\n                <tspan x=\"-57.212\" y=\"30\">\n                  foundations\n                </tspan>\n              </text>\n              <text\n                id=\"Digital_localisation\"\n                data-name=\"Digital localisation\"\n                className=\"cls-4\"\n                transform=\"translate(56.621 327.684)\"\n              >\n                <tspan x=\"-30.557\" y=\"0\">\n                  Digital\n                </tspan>\n                <tspan x=\"-55.015\" y=\"30\">\n                  localisation\n                </tspan>\n              </text>\n              <text\n                id=\"Digital_adoption\"\n                data-name=\"Digital adoption\"\n                className=\"cls-4\"\n                transform=\"translate(225.621 789.684)\"\n              >\n                <tspan x=\"-30.557\" y=\"0\">\n                  Digital\n                </tspan>\n                <tspan x=\"-42.212\" y=\"30\">\n                  adoption\n                </tspan>\n              </text>\n              <text\n                id=\"Digital_innovation\"\n                data-name=\"Digital innovation\"\n                className=\"cls-4\"\n                transform=\"translate(737.621 789.684)\"\n              >\n                <tspan x=\"-30.557\" y=\"0\">\n                  Digital\n                </tspan>\n                <tspan x=\"-50.552\" y=\"30\">\n                  innovation\n                </tspan>\n              </text>\n              <text\n                id=\"Digital_talent\"\n                data-name=\"Digital talent\"\n                className=\"cls-4\"\n                transform=\"translate(883.621 327.684)\"\n              >\n                <tspan x=\"-30.557\" y=\"0\">\n                  Digital\n                </tspan>\n                <tspan x=\"-26.67\" y=\"30\">\n                  talent\n                </tspan>\n              </text>\n            </g>\n            <g id=\"legend\">\n              <path\n                id=\"Vector_24\"\n                className=\"cls-5\"\n                d=\"M382.722,879.382a14.306,14.306,0,1,0-14.306-14.306A14.306,14.306,0,0,0,382.722,879.382Z\"\n              />\n              <path\n                id=\"Vector_25\"\n                className=\"cls-6\"\n                d=\"M421.348,866.812V864.4h6.23v5.7a7.9,7.9,0,0,1-2.637,1.552,9.589,9.589,0,0,1-3.486.664,7.869,7.869,0,0,1-3.916-.937,6.031,6.031,0,0,1-2.51-2.7,8.742,8.742,0,0,1-.839-3.819,8.235,8.235,0,0,1,.937-3.974,6.312,6.312,0,0,1,2.744-2.666,7.4,7.4,0,0,1,3.428-.713,6.793,6.793,0,0,1,4.16,1.123,5.022,5.022,0,0,1,1.934,3.086l-2.871.537a3,3,0,0,0-1.143-1.66,3.392,3.392,0,0,0-2.08-.616,3.934,3.934,0,0,0-3.018,1.2,5.072,5.072,0,0,0-1.113,3.564,5.626,5.626,0,0,0,1.133,3.828,3.791,3.791,0,0,0,2.969,1.27,5.006,5.006,0,0,0,1.816-.352,6.344,6.344,0,0,0,1.572-.869v-1.817Zm17.626,0,2.8.889a6.3,6.3,0,0,1-2.149,3.487,6.757,6.757,0,0,1-8.486-.811,7.472,7.472,0,0,1-1.836-5.332,7.805,7.805,0,0,1,1.846-5.547,6.318,6.318,0,0,1,4.853-1.982,5.955,5.955,0,0,1,4.268,1.552,5.652,5.652,0,0,1,1.465,2.637l-2.862.684a2.967,2.967,0,0,0-3.017-2.4,3.272,3.272,0,0,0-2.588,1.143,5.618,5.618,0,0,0-.986,3.7,6,6,0,0,0,.976,3.867,3.173,3.173,0,0,0,2.539,1.153,2.9,2.9,0,0,0,1.983-.733A4.254,4.254,0,0,0,438.974,866.812Zm14.013,0,2.8.889a6.3,6.3,0,0,1-2.148,3.487,6.758,6.758,0,0,1-8.487-.811,7.472,7.472,0,0,1-1.836-5.332,7.81,7.81,0,0,1,1.846-5.547,6.318,6.318,0,0,1,4.853-1.982,5.955,5.955,0,0,1,4.268,1.552,5.652,5.652,0,0,1,1.465,2.637l-2.861.684a2.969,2.969,0,0,0-3.018-2.4,3.272,3.272,0,0,0-2.588,1.143,5.624,5.624,0,0,0-.986,3.7,6,6,0,0,0,.976,3.867,3.173,3.173,0,0,0,2.539,1.153,2.9,2.9,0,0,0,1.983-.733A4.254,4.254,0,0,0,452.987,866.812Z\"\n              />\n              <path\n                id=\"Vector_26\"\n                className=\"cls-7\"\n                d=\"M512.253,879.382a14.306,14.306,0,1,0-14.306-14.306A14.306,14.306,0,0,0,512.253,879.382Z\"\n              />\n              <path\n                id=\"Vector_27\"\n                className=\"cls-6\"\n                d=\"M543.682,865.006a9.112,9.112,0,0,1,.654-3.672,6.8,6.8,0,0,1,1.328-1.963,5.636,5.636,0,0,1,1.856-1.289,7.851,7.851,0,0,1,3.086-.566,6.7,6.7,0,0,1,5.058,1.963,8.768,8.768,0,0,1,.02,10.888,7.542,7.542,0,0,1-10.117.01A7.408,7.408,0,0,1,543.682,865.006Zm2.978-.1a5.384,5.384,0,0,0,1.124,3.692,3.665,3.665,0,0,0,2.851,1.25,3.62,3.62,0,0,0,2.832-1.241,5.474,5.474,0,0,0,1.113-3.74A5.367,5.367,0,0,0,553.5,861.2a3.986,3.986,0,0,0-5.742.02A5.39,5.39,0,0,0,546.66,864.908Zm12.734,7.168V857.76H570.01v2.422h-7.725v3.173h7.187v2.413h-7.187v3.9h8v2.412Zm22.06-5.264,2.8.889a6.3,6.3,0,0,1-2.148,3.487,6.758,6.758,0,0,1-8.487-.811,7.472,7.472,0,0,1-1.836-5.332,7.81,7.81,0,0,1,1.846-5.547,6.32,6.32,0,0,1,4.854-1.982,5.954,5.954,0,0,1,4.267,1.552,5.652,5.652,0,0,1,1.465,2.637l-2.861.684a2.969,2.969,0,0,0-3.018-2.4,3.272,3.272,0,0,0-2.588,1.143,5.624,5.624,0,0,0-.986,3.7,6,6,0,0,0,.976,3.867,3.173,3.173,0,0,0,2.539,1.153,2.9,2.9,0,0,0,1.983-.733A4.254,4.254,0,0,0,581.454,866.812Zm4.844-9.052h5.283a10.329,10.329,0,0,1,2.724.273,4.791,4.791,0,0,1,2.159,1.319,6.263,6.263,0,0,1,1.367,2.324,10.534,10.534,0,0,1,.468,3.379,9.411,9.411,0,0,1-.439,3.047,6.317,6.317,0,0,1-1.533,2.529,5.082,5.082,0,0,1-2.031,1.142,8.741,8.741,0,0,1-2.559.3H586.3Zm2.89,2.422v9.482h2.158a7.875,7.875,0,0,0,1.748-.137,2.631,2.631,0,0,0,1.163-.595,3,3,0,0,0,.761-1.377,9.37,9.37,0,0,0,.293-2.627,8.528,8.528,0,0,0-.293-2.549,3.275,3.275,0,0,0-.82-1.387,2.761,2.761,0,0,0-1.338-.674,13.147,13.147,0,0,0-2.373-.136Z\"\n              />\n            </g>\n          </g>\n          <g id=\"oecd\">\n            <g id=\"oecd_plot\">\n              <path\n                id=\"Vector_28\"\n                className=\"cls-7\"\n                d=\"M677.762,390.053,485.5,135.9a4,4,0,0,0-6.7.494L332.714,403.549a4.022,4.022,0,0,0-.447,1.33L285.378,719.767a4,4,0,0,0,4.347,4.57l361.436-35.468a4,4,0,0,0,3.6-3.656l23.8-292.422A4,4,0,0,0,677.762,390.053Z\"\n              />\n            </g>\n            <g id=\"oecd_values\">\n              <path\n                id=\"Vector_29\"\n                className=\"cls-8\"\n                d=\"M460.188,79.48l-5.047.557a3.68,3.68,0,0,0-.965-2.3A2.814,2.814,0,0,0,452.153,77a3.44,3.44,0,0,0-2.8,1.484q-1.133,1.484-1.429,6.179a6.1,6.1,0,0,1,4.843-2.3,7.367,7.367,0,0,1,5.585,2.486,9,9,0,0,1,2.338,6.42,9.207,9.207,0,0,1-2.45,6.7,8.929,8.929,0,0,1-13.062-.668q-2.654-3.21-2.653-10.5,0-7.478,2.764-10.78a8.925,8.925,0,0,1,7.181-3.3,7.561,7.561,0,0,1,5.121,1.744A8.065,8.065,0,0,1,460.188,79.48Zm-11.82,11.374a5.948,5.948,0,0,0,1.169,3.934,3.448,3.448,0,0,0,2.672,1.373,3.04,3.04,0,0,0,2.412-1.132,5.705,5.705,0,0,0,.965-3.711,5.932,5.932,0,0,0-1.039-3.878,3.326,3.326,0,0,0-5.14-.056,5.083,5.083,0,0,0-1.039,3.47Zm19.34-5.511a6.16,6.16,0,0,1-2.951-2.338,6.229,6.229,0,0,1-.909-3.284,6.6,6.6,0,0,1,2.115-5.028,10.151,10.151,0,0,1,12.061,0,6.544,6.544,0,0,1,2.152,5.028,5.972,5.972,0,0,1-.983,3.377,6.249,6.249,0,0,1-2.765,2.245A7.23,7.23,0,0,1,479.861,88a6.979,6.979,0,0,1,1.187,4.026,8.181,8.181,0,0,1-2.412,6.123,8.7,8.7,0,0,1-6.383,2.356,9.662,9.662,0,0,1-6.178-1.948,7.6,7.6,0,0,1-2.913-6.309,7.761,7.761,0,0,1,1.094-4.045,7.036,7.036,0,0,1,3.452-2.859Zm1.076-5.251a3.283,3.283,0,0,0,.872,2.431,3.644,3.644,0,0,0,4.731,0,3.309,3.309,0,0,0,.891-2.449,3.057,3.057,0,0,0-3.21-3.229,3.236,3.236,0,0,0-2.394.891,3.188,3.188,0,0,0-.89,2.357ZM468.3,91.745a4.815,4.815,0,0,0,1.1,3.358,3.61,3.61,0,0,0,2.765,1.206,3.474,3.474,0,0,0,2.672-1.15A4.839,4.839,0,0,0,475.89,91.8a4.3,4.3,0,0,0-1.076-3.061,3.547,3.547,0,0,0-2.728-1.169,3.285,3.285,0,0,0-2.857,1.317,4.866,4.866,0,0,0-.929,2.858Z\"\n                transform=\"translate(15)\"\n              />\n              <path\n                id=\"Vector_31\"\n                className=\"cls-8\"\n                d=\"M679.132,710.552l-5.047.556a3.671,3.671,0,0,0-.965-2.3,2.809,2.809,0,0,0-2.022-.743,3.44,3.44,0,0,0-2.8,1.485q-1.133,1.484-1.429,6.179a6.1,6.1,0,0,1,4.843-2.3,7.367,7.367,0,0,1,5.585,2.486,8.993,8.993,0,0,1,2.338,6.42,9.206,9.206,0,0,1-2.449,6.7,8.928,8.928,0,0,1-13.063-.668q-2.653-3.21-2.653-10.5,0-7.477,2.765-10.78a8.923,8.923,0,0,1,7.18-3.3,7.564,7.564,0,0,1,5.121,1.744A8.068,8.068,0,0,1,679.132,710.552Zm-11.819,11.374a5.941,5.941,0,0,0,1.169,3.933,3.443,3.443,0,0,0,2.671,1.373,3.044,3.044,0,0,0,2.413-1.131,5.707,5.707,0,0,0,.964-3.711,5.931,5.931,0,0,0-1.039-3.878,3.325,3.325,0,0,0-5.139-.056,5.078,5.078,0,0,0-1.039,3.47Zm32.476,4.323v4.843H681.512a12.517,12.517,0,0,1,1.782-5.2,34.418,34.418,0,0,1,5.863-6.531,36.888,36.888,0,0,0,4.323-4.453,5.739,5.739,0,0,0,1.076-3.191,3.573,3.573,0,0,0-.946-2.672,3.956,3.956,0,0,0-5.177.037,5.053,5.053,0,0,0-1.113,3.266l-5.2-.52q.464-4.3,2.913-6.179a9.78,9.78,0,0,1,6.123-1.874,8.85,8.85,0,0,1,6.327,2.171,7.12,7.12,0,0,1,2.3,5.4,9.358,9.358,0,0,1-.668,3.506,14.055,14.055,0,0,1-2.078,3.47,33.365,33.365,0,0,1-3.415,3.47q-2.468,2.263-3.135,3.006a9.286,9.286,0,0,0-1.058,1.447Z\"\n                transform=\"translate(5)\"\n              />\n              <path\n                id=\"Vector_32\"\n                className=\"cls-8\"\n                d=\"M286.491,754.1v-4.842h17.831v3.785a28.033,28.033,0,0,0-4.49,6.234,36.574,36.574,0,0,0-3.489,8.647,32.2,32.2,0,0,0-1.169,8.164h-5.028a35.115,35.115,0,0,1,2.319-11.5,38.543,38.543,0,0,1,5.882-10.484Zm34.053,21.988H315.33v-19.65a17.973,17.973,0,0,1-6.73,3.962v-4.732a15.154,15.154,0,0,0,4.434-2.523,9.684,9.684,0,0,0,3.285-4.361h4.23Z\"\n              />\n              <path\n                id=\"Path_12625\"\n                data-name=\"Path 12625\"\n                className=\"cls-8\"\n                d=\"M-19.705-7.218l5.047-.612a4.778,4.778,0,0,0,1.3,2.95A3.553,3.553,0,0,0-10.8-3.859,3.517,3.517,0,0,0-8.081-5.084a4.748,4.748,0,0,0,1.1-3.3A4.427,4.427,0,0,0-8.034-11.5a3.372,3.372,0,0,0-2.579-1.15,9.1,9.1,0,0,0-2.394.39l.575-4.249A4.57,4.57,0,0,0-9.2-17.432,3.269,3.269,0,0,0-8.09-20.021a2.959,2.959,0,0,0-.816-2.189,2.934,2.934,0,0,0-2.171-.816,3.142,3.142,0,0,0-2.282.928,4.358,4.358,0,0,0-1.15,2.709l-4.806-.816A10.741,10.741,0,0,1-17.8-24.149a6.825,6.825,0,0,1,2.82-2.319,9.473,9.473,0,0,1,4.054-.844,8.087,8.087,0,0,1,6.16,2.449,6.393,6.393,0,0,1,1.911,4.527q0,3.581-3.915,5.715a6.334,6.334,0,0,1,3.739,2.245,6.515,6.515,0,0,1,1.4,4.212,8.17,8.17,0,0,1-2.616,6.1A9.012,9.012,0,0,1-10.762.464a8.967,8.967,0,0,1-6.123-2.125A8.349,8.349,0,0,1-19.705-7.218Zm21.134,0L6.476-7.83a4.778,4.778,0,0,0,1.3,2.95,3.553,3.553,0,0,0,2.561,1.021,3.517,3.517,0,0,0,2.718-1.225,4.748,4.748,0,0,0,1.1-3.3A4.427,4.427,0,0,0,13.1-11.5a3.372,3.372,0,0,0-2.579-1.15,9.1,9.1,0,0,0-2.394.39L8.7-16.514a4.57,4.57,0,0,0,3.229-.918,3.269,3.269,0,0,0,1.113-2.588,2.959,2.959,0,0,0-.816-2.189,2.934,2.934,0,0,0-2.171-.816,3.142,3.142,0,0,0-2.282.928,4.358,4.358,0,0,0-1.15,2.709l-4.806-.816a10.741,10.741,0,0,1,1.512-3.943,6.825,6.825,0,0,1,2.82-2.319,9.473,9.473,0,0,1,4.054-.844,8.087,8.087,0,0,1,6.16,2.449,6.393,6.393,0,0,1,1.911,4.527q0,3.581-3.915,5.715A6.334,6.334,0,0,1,18.1-12.376a6.515,6.515,0,0,1,1.4,4.212,8.17,8.17,0,0,1-2.616,6.1A9.012,9.012,0,0,1,10.372.464,8.967,8.967,0,0,1,4.249-1.661,8.349,8.349,0,0,1,1.429-7.218Z\"\n                transform=\"translate(290.621 425.426)\"\n              />\n              <path\n                id=\"Path_12626\"\n                data-name=\"Path 12626\"\n                className=\"cls-8\"\n                d=\"M-9.3,0V-5.474H-20.429v-4.564l11.8-17.274h4.379v17.256H-.872v4.583H-4.249V0Zm0-10.057v-9.3l-6.253,9.3ZM11.838,0V-5.474H.705v-4.564l11.8-17.274h4.379v17.256h3.377v4.583H16.885V0Zm0-10.057v-9.3l-6.253,9.3Z\"\n                transform=\"translate(725.621 396.684)\"\n              />\n            </g>\n          </g>\n          <g id=\"gcc\">\n            <g id=\"gcc_plot_5\">\n              <path\n                ref={gcc5PlotFillRef}\n                id=\"Vector_34\"\n                className=\"cls-9\"\n                d=\"M639.085,404.123,486.535,188.508a4,4,0,0,0-7.183,1.506l-50.14,244.3a3.964,3.964,0,0,1-.283.865L306.407,702.043a4,4,0,0,0,4.587,5.554l298.623-73.2a4,4,0,0,0,3.019-3.4l27.155-224.083A4,4,0,0,0,639.085,404.123Z\"\n              />\n              <path\n                ref={gcc5PlotStrokeRef}\n                id=\"Vector_34\"\n                className=\"cls-10\"\n                d=\"M482.5,186,637.646,402.114a6,6,0,0,1,1.086,4.192L612.98,627.872a6,6,0,0,1-4.514,5.13L316.548,705.508a6,6,0,0,1-6.908-8.308L427.724,437.607a5.992,5.992,0,0,0,.412-1.26L480.5,185\"\n              />\n            </g>\n            <g id=\"gcc_plot_4\">\n              <path\n                ref={gcc4PlotFillRef}\n                id=\"Vector_36\"\n                className=\"cls-11\"\n                d=\"M639.085,404.123,485.749,187.4a4,4,0,0,0-7.056,1.032L305.277,702.673a4,4,0,0,0,4.743,5.163l299.6-73.435a4,4,0,0,0,3.019-3.4l27.155-224.083A4,4,0,0,0,639.085,404.123Z\"\n              />\n            </g>\n            <g id=\"gcc_plot_3\">\n              <path\n                ref={gcc3PlotFillRef}\n                id=\"Vector_38\"\n                className=\"cls-11\"\n                d=\"M638.113,402.75l-150.9-212.724a4,4,0,0,0-7.11,3.409L604.984,632.122a4,4,0,0,0,7.821-.637l26.019-225.963A4,4,0,0,0,638.113,402.75Z\"\n              />\n            </g>\n            <g\n              ref={point5Label}\n              id=\"localization_text\"\n              transform=\"translate(60, 60)\"\n            >\n              <path\n                id=\"Vector_42\"\n                className=\"cls-12\"\n                d=\"M318,311h-4a45,45,0,0,0,0,90h4a45,45,0,0,0,0-90Z\"\n              />\n              <path\n                id=\"Path_12623\"\n                data-name=\"Path 12623\"\n                className=\"cls-13\"\n                d=\"M-6.179,0h-5.214V-19.649A17.975,17.975,0,0,1-18.128-15.7v-4.731a15.079,15.079,0,0,0,4.435-2.533,9.624,9.624,0,0,0,3.284-4.351h4.23ZM1.429-7.218,6.476-7.83a4.778,4.778,0,0,0,1.3,2.95,3.553,3.553,0,0,0,2.561,1.021,3.517,3.517,0,0,0,2.718-1.225,4.748,4.748,0,0,0,1.1-3.3A4.427,4.427,0,0,0,13.1-11.5a3.372,3.372,0,0,0-2.579-1.15,9.1,9.1,0,0,0-2.394.39L8.7-16.514a4.57,4.57,0,0,0,3.229-.918,3.269,3.269,0,0,0,1.113-2.588,2.959,2.959,0,0,0-.816-2.189,2.934,2.934,0,0,0-2.171-.816,3.142,3.142,0,0,0-2.282.928,4.358,4.358,0,0,0-1.15,2.709l-4.806-.816a10.741,10.741,0,0,1,1.512-3.943,6.825,6.825,0,0,1,2.82-2.319,9.473,9.473,0,0,1,4.054-.844,8.087,8.087,0,0,1,6.16,2.449,6.393,6.393,0,0,1,1.911,4.527q0,3.581-3.915,5.715A6.334,6.334,0,0,1,18.1-12.376a6.515,6.515,0,0,1,1.4,4.212,8.17,8.17,0,0,1-2.616,6.1A9.012,9.012,0,0,1,10.372.464,8.967,8.967,0,0,1,4.249-1.661,8.349,8.349,0,0,1,1.429-7.218Z\"\n                transform=\"translate(315.621 368.536)\"\n              />\n            </g>\n            <g ref={point4Label} id=\"adoption_text\">\n              <path\n                id=\"Vector_44\"\n                className=\"cls-12\"\n                d=\"M242,652h-3a45,45,0,0,0,0,90h3a45,45,0,1,0,0-90Z\"\n              />\n              <path\n                id=\"Path_12624\"\n                data-name=\"Path 12624\"\n                className=\"cls-13\"\n                d=\"M-1.855-20.54l-5.047.557a3.676,3.676,0,0,0-.965-2.3,2.812,2.812,0,0,0-2.022-.742,3.415,3.415,0,0,0-2.792,1.484q-1.141,1.484-1.438,6.179a6.1,6.1,0,0,1,4.843-2.3,7.4,7.4,0,0,1,5.594,2.486,9.014,9.014,0,0,1,2.329,6.42A9.208,9.208,0,0,1-3.8-2.06,8.382,8.382,0,0,1-10.094.464a8.41,8.41,0,0,1-6.772-3.2q-2.653-3.2-2.653-10.493,0-7.478,2.765-10.78a8.924,8.924,0,0,1,7.181-3.3,7.623,7.623,0,0,1,5.13,1.735A8.13,8.13,0,0,1-1.855-20.54ZM-13.675-9.166a5.909,5.909,0,0,0,1.169,3.924A3.439,3.439,0,0,0-9.834-3.859,3.04,3.04,0,0,0-7.422-4.991,5.7,5.7,0,0,0-6.457-8.7,5.974,5.974,0,0,0-7.5-12.589a3.259,3.259,0,0,0-2.6-1.234,3.263,3.263,0,0,0-2.542,1.178A5.116,5.116,0,0,0-13.675-9.166ZM1.614-21.987V-26.83H19.445v3.785a28.056,28.056,0,0,0-4.49,6.234,36.352,36.352,0,0,0-3.479,8.637A32.03,32.03,0,0,0,10.3,0H5.27A34.95,34.95,0,0,1,7.6-11.5a38.336,38.336,0,0,1,5.873-10.483Z\"\n                transform=\"translate(240.621 709.684)\"\n              />\n            </g>\n            <g\n              ref={point3Label}\n              id=\"innovation_text\"\n              transform=\"translate(-10, -10)\"\n            >\n              <path\n                id=\"Vector_46\"\n                className=\"cls-12\"\n                d=\"M688,606h-4a45,45,0,0,0,0,90h4a45,45,0,0,0,0-90Z\"\n              />\n              <path\n                id=\"Vector_47\"\n                className=\"cls-13\"\n                d=\"M651.125,664v-5.474H639.992v-4.564l11.8-17.274h4.379v17.255h3.377v4.583h-3.377V664Zm0-10.057v-9.3l-6.253,9.3Zm10.489-11.93V637.17h17.831v3.785a28.029,28.029,0,0,0-4.49,6.234,36.588,36.588,0,0,0-3.489,8.647A32.2,32.2,0,0,0,670.3,664h-5.028a35.123,35.123,0,0,1,2.319-11.5,38.523,38.523,0,0,1,5.882-10.483Z\"\n                transform=\"translate(26.281)\"\n              />\n            </g>\n            <g ref={point2Label} id=\"talent_text\" transform=\"translate(0, -10)\">\n              <path\n                id=\"Vector_48\"\n                className=\"cls-12\"\n                d=\"M675,422h-4a45,45,0,0,0,0,90h4a45,45,0,0,0,0-90Z\"\n              />\n              <path\n                id=\"Path_12627\"\n                data-name=\"Path 12627\"\n                className=\"cls-13\"\n                d=\"M-19.705-7.218l5.047-.612a4.778,4.778,0,0,0,1.3,2.95A3.553,3.553,0,0,0-10.8-3.859,3.517,3.517,0,0,0-8.081-5.084a4.748,4.748,0,0,0,1.1-3.3A4.427,4.427,0,0,0-8.034-11.5a3.372,3.372,0,0,0-2.579-1.15,9.1,9.1,0,0,0-2.394.39l.575-4.249A4.57,4.57,0,0,0-9.2-17.432,3.269,3.269,0,0,0-8.09-20.021a2.959,2.959,0,0,0-.816-2.189,2.934,2.934,0,0,0-2.171-.816,3.142,3.142,0,0,0-2.282.928,4.358,4.358,0,0,0-1.15,2.709l-4.806-.816A10.741,10.741,0,0,1-17.8-24.149a6.825,6.825,0,0,1,2.82-2.319,9.473,9.473,0,0,1,4.054-.844,8.087,8.087,0,0,1,6.16,2.449,6.393,6.393,0,0,1,1.911,4.527q0,3.581-3.915,5.715a6.334,6.334,0,0,1,3.739,2.245,6.515,6.515,0,0,1,1.4,4.212,8.17,8.17,0,0,1-2.616,6.1A9.012,9.012,0,0,1-10.762.464a8.967,8.967,0,0,1-6.123-2.125A8.349,8.349,0,0,1-19.705-7.218ZM11.838,0V-5.474H.705v-4.564l11.8-17.274h4.379v17.256h3.377v4.583H16.885V0Zm0-10.057v-9.3l-6.253,9.3Z\"\n                transform=\"translate(672.621 479.684)\"\n              />\n            </g>\n            <g\n              ref={point1Label}\n              id=\"foundation_text\"\n              transform=\"translate(-30, -20)\"\n            >\n              <path\n                id=\"Vector_54\"\n                className=\"cls-12\"\n                d=\"M581,143h-4a45,45,0,0,0,0,90h4a45,45,0,1,0,0-90Z\"\n              />\n              <path\n                id=\"Vector_55\"\n                className=\"cls-13\"\n                d=\"M533.976,194.005l5.2-.538a4.5,4.5,0,0,0,1.317,2.8,3.593,3.593,0,0,0,2.524,1.02,3.512,3.512,0,0,0,2.764-1.317,6.074,6.074,0,0,0,1.132-4.008,5.409,5.409,0,0,0-1.132-3.748,3.7,3.7,0,0,0-2.913-1.262,5.313,5.313,0,0,0-4.026,1.985l-4.23-.612,2.671-14.157H551.07v4.88h-9.834l-.817,4.62a7.972,7.972,0,0,1,9.445,1.651,9.09,9.09,0,0,1,2.412,6.55,9.82,9.82,0,0,1-1.949,5.993,8.635,8.635,0,0,1-7.366,3.6,9.138,9.138,0,0,1-6.141-2.023A8.324,8.324,0,0,1,533.976,194.005Zm20.638-14.992V174.17h17.831v3.785a28.032,28.032,0,0,0-4.49,6.234,36.591,36.591,0,0,0-3.489,8.647A32.2,32.2,0,0,0,563.3,201h-5.028a35.12,35.12,0,0,1,2.319-11.5,38.522,38.522,0,0,1,5.882-10.483Z\"\n                transform=\"translate(25.79)\"\n              />\n            </g>\n          </g>\n        </g>\n      </g>\n    </StyledSvg>\n  );\n};\n\nexport default SpiderChart;\n","import { useEffect, useRef, useState } from \"react\";\nimport { Range } from \"react-range\";\nimport styled from \"styled-components\";\nimport { PauseButton, PlayButton } from \"./Common\";\n\nconst SliderTrack = styled.div`\n  height: 10px;\n  width: 100%;\n  border-radius: 10px;\n  align-self: center;\n  background-color: #e6e6e6;\n`;\n\nconst SliderThumb = styled.div`\n  height: 40px;\n  width: 40px;\n  border-radius: 50%;\n  background-color: #d93954;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  transition: box-shadow ease-in-out 0.2s;\n  border: none;\n  outline: none;\n`;\n\nconst SliderTrackContainer = styled.div`\n  height: 36px;\n  display: flex;\n  width: 100%;\n  opacity: 0.7;\n\n  :hover {\n    opacity: 1;\n  }\n`;\n\nconst RangeContainer = styled.div`\n  display: flex;\n  align-items: center;\n  margin-top: 10px;\n`;\n\nconst PlayButtonContainer = styled.div`\n  cursor: pointer;\n`;\n\nconst YearSlider = ({\n  handleSliderChange,\n  className,\n}: {\n  handleSliderChange: (value: number) => void;\n  className?: string;\n}) => {\n  const MAX = 2020,\n    MIN = 2010,\n    STEP = 1;\n\n  const [value, setValue] = useState(2020);\n  const [isPlaying, setIsPlaying] = useState(false);\n\n  const intervalIdRef = useRef<any>(0);\n\n  useEffect(() => {\n    if (isPlaying) {\n      intervalIdRef.current = setInterval(() => {\n        let newValue = MIN;\n\n        if (value + 1 === MAX) {\n          setIsPlaying(false);\n          newValue = value + 1;\n        } else if (value >= MAX) {\n          newValue = MIN;\n        } else {\n          newValue = value + STEP;\n        }\n\n        setValue(newValue);\n        handleSliderChange(newValue);\n      }, 1000);\n    } else {\n      clearInterval(intervalIdRef.current);\n    }\n\n    return () => clearInterval(intervalIdRef.current);\n  }, [isPlaying, value, handleSliderChange]);\n\n  return (\n    <div className={className}>\n      <span>Selected year: {value}</span>\n      <RangeContainer>\n        <PlayButtonContainer onClick={() => setIsPlaying(!isPlaying)}>\n          {isPlaying ? <PauseButton /> : <PlayButton />}\n        </PlayButtonContainer>\n        <span style={{ marginRight: \"35px\", marginLeft: \"20px\" }}>{MIN}</span>\n        <Range\n          onChange={(newVal) => {\n            if (newVal && newVal.length > 0) {\n              setValue(newVal[0]);\n              handleSliderChange(newVal[0]);\n            }\n          }}\n          values={[value]}\n          step={1}\n          min={2010}\n          max={2020}\n          renderTrack={({ props, children }) => (\n            <SliderTrackContainer\n              onMouseDown={props.onMouseDown}\n              onTouchStart={props.onTouchStart}\n              style={{\n                ...props.style,\n              }}\n            >\n              <SliderTrack ref={props.ref}>{children}</SliderTrack>\n            </SliderTrackContainer>\n          )}\n          renderThumb={({ props, isDragged }) => (\n            <SliderThumb\n              {...props}\n              style={{\n                ...props.style,\n                boxShadow: isDragged\n                  ? \"0px 0px 0px 10px #E5E5E5\"\n                  : \"0px 0px 0px 5px #E5E5E5\",\n              }}\n            />\n          )}\n        />\n        <span style={{ marginLeft: \"35px\" }}>{MAX}</span>\n      </RangeContainer>\n    </div>\n  );\n};\n\nexport default YearSlider;\n","export default __webpack_public_path__ + \"static/media/ellipse-grey.9fc7034b.svg\";","export default __webpack_public_path__ + \"static/media/ellipse-red.1af9645c.svg\";","export default __webpack_public_path__ + \"static/media/striped-circle.48142b7c.png\";","import gsap from \"gsap\";\nimport { ScrollTrigger } from \"gsap/ScrollTrigger\";\nimport { useEffect, useRef, useState } from \"react\";\nimport styled from \"styled-components\";\nimport { Subtitle, TextContainer, Title } from \"../components/Common\";\nimport Container from \"../components/Container\";\nimport ellipseGrey from \"../images/ellipse-grey.svg\";\nimport ellipseRed from \"../images/ellipse-red.svg\";\nimport stripedCircle from \"../images/striped-circle.png\";\nimport { GccOecdScore, getGccOecdScore } from \"../services\";\n\ngsap.registerPlugin(ScrollTrigger);\n\nconst DigitalMaturityContainer = styled.div`\n  position: relative;\n  width: 100%;\n  background-color: #ffffff;\n\n  ::after {\n    content: \"\";\n    position: absolute;\n    width: 114%;\n    height: 20px;\n    bottom: 0;\n    left: -7%;\n    background-color: transparent;\n    box-shadow: 0px 10px 10px 0px rgba(70, 70, 70, 1);\n  }\n`;\n\nconst VisualContainer = styled.div`\n  display: flex;\n  position: relative;\n  width: 100%;\n  height: 70%;\n  margin-top: -5%;\n`;\n\nconst Background = styled.img`\n  position: absolute;\n  margin: auto;\n  left: 0;\n  right: 0;\n  height: 70%;\n  top: 0;\n  bottom: 0;\n\n  @media (max-width: 768px) {\n    height: 50%;\n  }\n`;\n\ninterface MetricProps {\n  position?: \"left\" | \"right\";\n  color?: string;\n  multiplier?: number;\n  value?: number;\n  growth?: number;\n  type?: string;\n}\n\nconst MetricContainer = styled.div<MetricProps>`\n  flex-grow: 1;\n  position: relative;\n  color: ${(props) => props.color};\n  text-align: ${(props) => props.position};\n  flex-basis: 50%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  overflow: clip;\n`;\n\nconst UnderVisualText = styled.div`\n  position: absolute;\n  bottom: 10%;\n  width: 50%;\n\n  & span {\n    font-family: \"PwC Helvetica Neue\";\n    font-weight: normal;\n    font-size: 18px;\n    line-height: 1.3;\n    letter-spacing: -0.4px;\n    color: #000000;\n  }\n\n  @media (max-width: 768px) {\n    position: relative;\n    bottom: 0;\n    width: 100%;\n    margin-bottom: 2rem;\n  }\n`;\n\nconst MetricCircle = styled.img<MetricProps>`\n  height: ${(props) => (props.multiplier ?? 1) * 40}%;\n  position: absolute;\n  ${(props) => props.position}: 2px;\n\n  @media (max-width: 768px) {\n    height: ${(props) => (props.multiplier ?? 1) * 40}%;\n  }\n`;\n\nconst CountryType = styled.span`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: bold;\n  font-size: 24px;\n  line-height: 2;\n  letter-spacing: -0.44px;\n\n  @media (max-width: 768px) {\n    font-size: 20px;\n    line-height: 1;\n  }\n`;\n\nconst DmiValue = styled.span`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: bold;\n  font-size: 46px;\n  line-height: 1;\n  letter-spacing: -0.44px;\n\n  @media (max-width: 768px) {\n    font-size: 35px;\n    line-height: 1.2;\n  }\n`;\n\nconst GrowthValue = styled.span`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: normal;\n  font-size: 24px;\n  line-height: 2;\n  letter-spacing: -0.44px;\n\n  & b {\n    font-weight: bold;\n    font-family: Arial;\n  }\n\n  @media (max-width: 768px) {\n    padding-top: 10px;\n    font-size: 20px;\n    line-height: 1.2;\n    display: flex;\n    flex-direction: column;\n  }\n`;\n\nconst MetricTextContainer = styled.div`\n  display: grid;\n  grid-template-rows: 1fr 1fr;\n`;\n\nconst TopContainer = styled.div<MetricProps>`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n\n  ::after {\n    content: \"\";\n    position: absolute;\n    bottom: -5px;\n    width: 98%;\n    height: 2px;\n    background-color: ${(props) => props.color};\n    ${(props) => (props.position === \"right\" ? \"left: 2%\" : \"\")}\n  }\n`;\n\nconst DigitalEconomyMaturity = () => {\n  const initialGccOecd: GccOecdScore = {\n    gccValues: 0,\n    oecdValues: 0,\n  };\n  const underImageText = `Note: Growth rates are CAGR for the 2010-2019 period.`;\n\n  const [gccOecdValues, setGccOecdValues] = useState(initialGccOecd);\n  const maturityContainerRef = useRef<HTMLDivElement>(null);\n  const leftMetricImgRef = useRef<HTMLImageElement>(null);\n  const leftMetricRef = useRef<HTMLDivElement>(null);\n  const rightMetricImgRef = useRef<HTMLImageElement>(null);\n  const rightMetricRef = useRef<HTMLDivElement>(null);\n  const underVisualTextRef = useRef<HTMLDivElement>(null);\n  const oecdDmiRef = useRef<HTMLSpanElement>(null);\n  const oecdgrowthRef = useRef<HTMLElement>(null);\n  const gccDmiRef = useRef<HTMLSpanElement>(null);\n  const gccGrowthRef = useRef<HTMLElement>(null);\n\n  const gccDmiValue = gccOecdValues.gccValues || 56;\n  const oecdDmiValue = gccOecdValues.oecdValues || 44;\n\n  useEffect(() => {\n    (async () => {\n      const gccOecdValuesResponse = await getGccOecdScore();\n      if (!gccOecdValuesResponse.success) {\n        return;\n      }\n      setGccOecdValues(gccOecdValuesResponse.data!);\n    })();\n  }, []);\n\n  useEffect(() => {\n    const maturityContainer = maturityContainerRef.current;\n    const leftMetricEl = leftMetricRef.current;\n    const leftMetricImgEl = leftMetricImgRef.current;\n    const rightMetricEl = rightMetricRef.current;\n    const rightMetricImgEl = rightMetricImgRef.current;\n    const underVisualTextEl = underVisualTextRef.current;\n    const oecdDmiEl = oecdDmiRef.current;\n    const oecdgrowthEl = oecdgrowthRef.current;\n    const gccDmiEl = gccDmiRef.current;\n    const gccGrowthEl = gccGrowthRef.current;\n\n    const getAnimationStartEnd = () => {\n      if (window.innerWidth <= 768) {\n        return [\"70% bottom\", \"80% center\"];\n      } else if (window.innerWidth <= 1300) {\n        return [\"center bottom\", \"60% center\"];\n      } else {\n        return [\"center bottom\", \"60% center\"];\n      }\n    };\n\n    const animatePosition = gsap.timeline({\n      scrollTrigger: {\n        trigger: maturityContainer,\n        markers: false,\n        start: getAnimationStartEnd()[0],\n        end: getAnimationStartEnd()[1],\n        scrub: true,\n      },\n    });\n\n    const animateText = gsap.timeline({\n      scrollTrigger: {\n        trigger: maturityContainer,\n        markers: false,\n        start: getAnimationStartEnd()[0],\n        end: getAnimationStartEnd()[1],\n        scrub: true,\n      },\n    });\n\n    animatePosition.fromTo(\n      underVisualTextEl,\n      { x: 100, opacity: 0 },\n      { x: 0, opacity: 1, duration: 1 },\n      0\n    );\n    animatePosition.fromTo(\n      leftMetricImgEl,\n      { x: 100, opacity: 0 },\n      { x: 0, opacity: 1, duration: 1 },\n      0\n    );\n    animatePosition.fromTo(\n      leftMetricEl,\n      { x: 100, opacity: 0 },\n      { x: 0, opacity: 1, duration: 1 },\n      0\n    );\n    animatePosition.fromTo(\n      rightMetricImgEl,\n      { x: -100, opacity: 0 },\n      { x: 0, opacity: 1, duration: 1 },\n      0\n    );\n    animatePosition.fromTo(\n      rightMetricEl,\n      { x: -100, opacity: 0 },\n      { x: 0, opacity: 1, duration: 1 },\n      0\n    );\n    animateText.fromTo(\n      oecdDmiEl,\n      { innerHTML: 4 },\n      {\n        snap: { innerHTML: 1 },\n        innerHTML: oecdDmiValue,\n      },\n      0\n    );\n    animateText.fromTo(\n      gccDmiEl,\n      { innerHTML: 2 },\n      {\n        snap: { innerHTML: 1 },\n        innerHTML: gccDmiValue,\n      },\n      0\n    );\n    animateText.fromTo(\n      oecdgrowthEl,\n      { innerHTML: 0.32 },\n      {\n        snap: { innerHTML: 0.01 },\n        innerHTML: 3.85,\n      },\n      0\n    );\n    animateText.fromTo(\n      gccGrowthEl,\n      { innerHTML: 0.71 },\n      {\n        snap: { innerHTML: 0.01 },\n        innerHTML: 5.63,\n      },\n      0\n    );\n  }, [gccDmiValue, oecdDmiValue]);\n\n  return (\n    <DigitalMaturityContainer ref={maturityContainerRef}>\n      <Container\n        style={{\n          height: window.innerWidth <= 768 ? \"800px\" : \"800px\",\n          paddingTop: window.innerWidth <= 768 ? \"55px\" : \"55px\",\n          display: \"flex\",\n          flexDirection: \"column\",\n        }}\n      >\n        <TextContainer>\n          <Title emphasis>The GCC is ripe for disruption</Title>\n          <Subtitle>\n            DEI scores reveal the majority of GCC countries are digital\n            adopters. The DEI also indicates GCC countries are growing their\n            digital economies almost twice as fast as advanced economies,\n            potentially catching up with OECD levels in five years. While that\n            is promising news, they will need to transition from adoption to\n            disruption.\n          </Subtitle>\n        </TextContainer>\n\n        <TextContainer>\n          <Title>A maturing digital economy</Title>\n        </TextContainer>\n\n        <VisualContainer>\n          <Background\n            id=\"striped\"\n            src={stripedCircle}\n            alt=\"Background circle\"\n          />\n\n          <MetricContainer position=\"left\" color=\"#464646\">\n            <MetricCircle\n              ref={leftMetricImgRef}\n              position=\"right\"\n              src={ellipseGrey}\n              alt=\"OECD\"\n            />\n            <MetricTextContainer ref={leftMetricRef}>\n              <TopContainer position=\"left\" color=\"#464646\">\n                <CountryType>OECD</CountryType>\n                <DmiValue ref={oecdDmiRef}>\n                  {gccOecdValues.oecdValues || \"&nbsp;\"}\n                </DmiValue>\n              </TopContainer>\n              <div className=\"below\">\n                <GrowthValue>\n                  Growth:{\" \"}\n                  <b>\n                    <span ref={oecdgrowthRef}>{3.85}</span>%\n                  </b>\n                </GrowthValue>\n              </div>\n            </MetricTextContainer>\n          </MetricContainer>\n\n          <MetricContainer position=\"right\" color=\"#D93954\">\n            <MetricCircle\n              ref={rightMetricImgRef}\n              position=\"left\"\n              src={ellipseRed}\n              multiplier={0.85}\n              alt=\"GCC\"\n            />\n            <MetricTextContainer ref={rightMetricRef}>\n              <TopContainer position=\"right\" color=\"#D93954\">\n                <CountryType>GCC</CountryType>\n                <DmiValue ref={gccDmiRef}>\n                  {gccOecdValues.gccValues || \"&nbsp;\"}\n                </DmiValue>\n              </TopContainer>\n              <div className=\"below\">\n                <GrowthValue>\n                  Growth:{\" \"}\n                  <b>\n                    <span ref={gccGrowthRef}>{5.63}</span>%\n                  </b>\n                </GrowthValue>\n              </div>\n            </MetricTextContainer>\n          </MetricContainer>\n        </VisualContainer>\n        <UnderVisualText ref={underVisualTextRef}>\n          <span>{underImageText}</span>\n        </UnderVisualText>\n      </Container>\n    </DigitalMaturityContainer>\n  );\n};\n\nexport default DigitalEconomyMaturity;\n","export function formatNumber(num: number) {\n  return new Intl.NumberFormat('en', {\n    notation: \"compact\",\n    compactDisplay: \"long\"\n  }).format(num)\n}\n\nexport function formatCountryClassnames(country: string) {\n  return country\n  .replaceAll(/[\\s-.]/g, \"\")\n  .toLowerCase()\n}","export const lerp = (x: number, y: number, a: number) => x * (1 - a) + y * a;\n\nexport const invlerp = (x: number, y: number, a: number) => clamp((a - x) / (y - x));\n\nexport const clamp = (a: number, min = 0, max = 1) => Math.min(max, Math.max(min, a));\n\nexport const rangeMap = (\n  x1: number,\n  y1: number,\n  x2: number,\n  y2: number,\n  a: number\n) => lerp(x2, y2, invlerp(x1, y1, a));\n\nexport const lerpArray = (x: number, y: number, length: number) => {\n  return new Array(length).fill(0).map((_, index) => {\n    return lerp(x, y, index * 1 / length)\n  });\n}\n\nexport const rangeMapArray = (src: { x: number, y: number }, dest: { x: number, y: number }, length: number) => {\n  return lerpArray(src.x, src.y, length).map((item) => {\n    return rangeMap(src.x, src.y, dest.x, dest.y, item)\n  });\n}","import { VectorMap } from \"@nexxt-intelligence/react-jvectormap\";\nimport { ButtonToggle, ButtonToggleValue } from \"components/MapButtons\";\nimport gsap from \"gsap\";\nimport { ScrollTrigger } from \"gsap/ScrollTrigger\";\nimport { useEffect, useRef, useState } from \"react\";\nimport styled from \"styled-components\";\nimport {\n  Container,\n  MapButtons,\n  MapLegend,\n  Sidebar,\n  YearSlider,\n} from \"../components\";\nimport { Subtitle, TextContainer, Title } from \"../components/Common\";\nimport {\n  DmiPillar,\n  getCountries,\n  getDigitalEconomyStages,\n  getDmiPillars,\n  getTopCountries,\n} from \"../services\";\nimport { ColorValues, CountryGpsCoords } from \"../utils/contants\";\nimport { formatCountryClassnames, formatNumber } from \"../utils/format\";\nimport { rangeMapArray } from \"../utils/lerp\";\n\ngsap.registerPlugin(ScrollTrigger);\n\ninterface TopCountry {\n  country: string;\n  countryCode: string;\n  maturityIndex: number;\n}\n\nexport interface Country {\n  country: string;\n  code: string | null;\n}\n\ninterface EconomyStagePerYear {\n  country: string;\n  maturityIndex: number;\n  rank: number;\n  countryCode: string;\n}\n\ninterface EconomyStages {\n  year: number;\n  digitalEconomyStagePerYearItem: EconomyStagePerYear[];\n}\n\nconst GridContainer = styled.div`\n  display: grid;\n  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;\n  gap: 10px 10px;\n  margin-top: 50px;\n\n  @media (max-width: 768px) {\n    grid-template-columns: 1fr 1fr;\n  }\n`;\n\nconst Card = styled.div`\n  background-color: #fff;\n  height: 120px;\n  position: relative;\n`;\n\nconst CardContent = styled.div`\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: center;\n  position: relative;\n  left: 10px;\n`;\n\nconst IndexContainer = styled.div`\n  width: 20%;\n  height: 100%;\n  position: absolute;\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: bold;\n  font-size: 12px;\n  line-height: 30px;\n  text-align: center;\n  color: #ececec;\n  /* border: 5px solid #ececec; */\n  /* border-left: 0;\n  border-top: 0; */\n\n  ::before {\n    content: \"\";\n    position: absolute;\n    left: 0;\n    top: 0;\n    height: 100%;\n    width: 100%;\n    background-color: #ececec;\n    clip-path: polygon(\n      0 0 /* left top */,\n      100% 0 /* right top */,\n      30% 100% /* right bottom */,\n      0 100% /* left bottom */\n    );\n  }\n\n  ::after {\n    content: \"#\";\n    color: #ffffff;\n    font-size: 30px;\n    position: absolute;\n    left: 50%;\n    transform: translateX(-50%);\n    top: 10px;\n  }\n`;\n\nconst Index = styled.span`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: bold;\n  font-size: 26px;\n  line-height: 1;\n  text-align: center;\n  color: #ececec;\n  position: absolute;\n  left: 95%;\n  top: 10px;\n`;\n\nconst CountryName = styled.span`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 18px;\n  text-align: center;\n  padding: 0 0 10px 0;\n  color: #464646;\n`;\n\nconst MaturityIndex = styled.span`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 18px;\n  text-align: center;\n  padding: 10px 0 0 0;\n  color: #000000;\n  text-transform: capitalize;\n`;\n\nconst CircleIndicator = styled.div`\n  border-radius: 75px;\n  width: 10px;\n  height: 10px;\n  opacity: 1;\n`;\n\nconst StyledMapButtons = styled(MapButtons)``;\n\nconst StyledMapLegend = styled(MapLegend)`\n  margin-bottom: 30px;\n`;\n\nconst StyledYearSlider = styled(YearSlider)`\n  text-align: center;\n  margin-bottom: 55px;\n`;\n\nconst Map = () => {\n  const initialDmiPillars: DmiPillar[] = [\n    {\n      pillarName: \"Pillar\",\n      score: 0,\n      subPillars: [\n        {\n          score: 0,\n          subPillarName: \"Sub Pillar\",\n        },\n      ],\n    },\n  ];\n\n  const initialButtonToggle: ButtonToggle = {\n    button: null,\n    value: false,\n  };\n\n  const initialTopCountries: TopCountry[] = new Array<TopCountry>(20).fill({\n    country: \"-\",\n    countryCode: \"-\",\n    maturityIndex: 0,\n  });\n\n  const mapRef: any = useRef();\n  const mapContainerRef = useRef<HTMLDivElement>(null);\n  const countriesContainerRef = useRef<HTMLDivElement>(null);\n\n  const [topCountries, setTopCountries] =\n    useState<TopCountry[]>(initialTopCountries);\n  const [opacityMap, setOpacityMap] = useState<number[]>([]);\n  const [scaleMap, setScaleMap] = useState<number[]>([]);\n  const [allCountries, setAllCountries] = useState<Country[]>([]);\n  const [economyStages, setEconomyStages] = useState<EconomyStages[]>([]);\n  const [year, setYear] = useState(2020);\n  const [buttonToggle, setButtonToggle] =\n    useState<ButtonToggle>(initialButtonToggle);\n  const [showSidebar, setShowSidebar] = useState(false);\n  const [sidebarData, setSidebarData] =\n    useState<DmiPillar[]>(initialDmiPillars);\n  const [sidebarCountry, setSidebarCountry] = useState(\"\");\n  const [sidebarCode, setSidebarCode] = useState(\"\");\n  const [resetToggle, setResetToggle] = useState(false);\n  const [legendValue, setLegendValue] = useState(-1);\n\n  useEffect(() => {\n    (async () => {\n      const countryResult: Country[] = await getCountries();\n      setAllCountries(countryResult);\n\n      const economyStages: EconomyStages[] = await getDigitalEconomyStages();\n      setEconomyStages(economyStages);\n    })();\n  }, []);\n\n  // Top Countries api call\n  useEffect(() => {\n    (async () => {\n      const countryResult: TopCountry[] = await getTopCountries();\n      setTopCountries([]);\n\n      const maxValue = Math.max(...countryResult.map((o) => o.maturityIndex));\n      const minValue = Math.min(...countryResult.map((o) => o.maturityIndex));\n\n      setOpacityMap(\n        rangeMapArray(\n          { x: maxValue, y: minValue },\n          { x: 1, y: 0.1 },\n          countryResult.length\n        )\n      );\n      setScaleMap(\n        rangeMapArray(\n          { x: maxValue, y: minValue },\n          { x: 1, y: 0.1 },\n          countryResult.length\n        )\n      );\n      setTopCountries(countryResult);\n    })();\n  }, []);\n\n  useEffect(() => {\n    const countriesContainer = countriesContainerRef.current!;\n    const mapObj = mapRef.current!;\n\n    const mapNode: HTMLDivElement = mapObj.$node[0].querySelector(\n      \".jvectormap-container\"\n    );\n    const mapBounds = mapNode.getBoundingClientRect();\n\n    const getAnimationStartEnd = () => {\n      if (window.innerWidth <= 768) {\n        return [\"0% center\", \"60% bottom\"];\n      } else if (window.innerWidth <= 1300) {\n        return [\"-25% center\", \"80% bottom\"];\n      } else {\n        return [\"-15% center\", \"110% bottom\"];\n      }\n    };\n\n    const animatePosition = gsap.timeline({\n      scrollTrigger: {\n        trigger: countriesContainer,\n        markers: false,\n        start: () => getAnimationStartEnd()[0],\n        end: () => getAnimationStartEnd()[1],\n        scrub: true,\n      },\n    });\n\n    topCountries.slice(0, 15).forEach((country, index) => {\n      const countryGps = CountryGpsCoords[index];\n      const formattedCountryName = formatCountryClassnames(country.country);\n\n      const mapOffset: DOMRect = mapObj.$mapObject.latLngToPoint(\n        countryGps.gpsLat,\n        countryGps.gpsLong\n      );\n\n      const countryNode = countriesContainer.querySelector(\n        `.country.c-${formattedCountryName} .circleIndicator`\n      )!;\n      const countryBounds = countryNode.getBoundingClientRect();\n\n      const yValue =\n        mapBounds.y -\n        (countryBounds.y + countryBounds.height / 2) +\n        mapOffset.y;\n      const xValue =\n        mapBounds.x - (countryBounds.x + countryBounds.width / 2) + mapOffset.x;\n\n      animatePosition.fromTo(\n        countryNode,\n        {\n          y: yValue,\n          x: xValue,\n          width: \"1px\",\n          height: \"1px\",\n          border: \"1px solid #000\",\n          background: \"transparent\",\n          opacity: 1,\n          ease: \"power1.inOut\",\n        },\n        {\n          y: 0,\n          x: 0,\n          width: 45 * scaleMap[index],\n          height: 45 * scaleMap[index],\n          border: \"10px solid #a32020\",\n          background: \"#f5bfc4\",\n          opacity: opacityMap[index],\n        },\n        0\n      );\n    });\n  }, [topCountries]);\n\n  const showTooltip = (event: Event, el: HTMLDivElement[], code: string) => {\n    const tooltipEl = el[0];\n    const economyStage = economyStages\n      .find((o) => o.year === year)\n      ?.digitalEconomyStagePerYearItem.find((o) => o.countryCode === code);\n\n    if (\n      !economyStage ||\n      economyStage.maturityIndex === undefined ||\n      code === \"\"\n    ) {\n      tooltipEl.innerHTML = \"\";\n      tooltipEl.style.opacity = \"0\";\n    } else {\n      tooltipEl.style.opacity = \"1\";\n      tooltipEl.innerHTML = `<div class=\"map-tooltip\">\n        <div class=\"progressBar set-size charts-container\">\n          <div class=\"pie-wrapper progress-${\n            economyStage?.maturityIndex\n          } style-2\">\n            <span class=\"label\">${economyStage?.maturityIndex}</span>\n            <div class=\"pie\">\n              <div class=\"left-side half-circle\"></div>\n              <div class=\"right-side half-circle\"></div>\n            </div>\n            <div class=\"shadow\"></div>\n          </div>\n        </div>\n        <div class=\"info\">\n          <div class=\"country\">${economyStage?.country}</div>\n          <div class=\"rank\">\n            <span class=\"rankLabel\">DEI rank (${year})</span>\n            <span class=\"rankValue\"><b>${economyStage?.rank}</b>/${\n        allCountries.length - 5\n      }</span>\n          </div>\n        </div>\n      </div>`;\n    }\n  };\n\n  const handleButtonToggle = (button: ButtonToggleValue, value: boolean) => {\n    setLegendValue(-1);\n    setButtonToggle({ button, value });\n  };\n\n  const handleLegendClick = (index: number) => {\n    setResetToggle(true);\n    setButtonToggle(initialButtonToggle);\n\n    index === legendValue ? setLegendValue(-1) : setLegendValue(index);\n    console.log(index);\n  };\n\n  const getMapSeries = () => {\n    const scale: any = {};\n    const values: any = {};\n\n    const stagesPerYear = economyStages.find(\n      (o) => o.year === year\n    )?.digitalEconomyStagePerYearItem;\n\n    ColorValues.red.forEach((color, index) => {\n      scale[`red-${index}`] = color;\n    });\n\n    let filteredStages = stagesPerYear?.filter((o) => {\n      if (legendValue !== -1) {\n        return (\n          Math.floor((o.maturityIndex - 1) / 10) ===\n          Math.floor(legendValue / 10) - 1\n        );\n      } else if (buttonToggle.value) {\n        switch (buttonToggle.button) {\n          case ButtonToggleValue.DigitalLearner:\n            return o.maturityIndex <= 33;\n          case ButtonToggleValue.DigitalIntelligent:\n            return o.maturityIndex > 33 && o.maturityIndex <= 60;\n          case ButtonToggleValue.DigitalDisruptors:\n            return o.maturityIndex > 60;\n        }\n      }\n      return true;\n    });\n\n    filteredStages?.forEach((item) => {\n      values[item.countryCode] = `red-${\n        Math.ceil(item.maturityIndex / 10) - 1\n      }`;\n    });\n\n    return {\n      regions: [\n        {\n          scale: scale,\n          attribute: \"fill\",\n          values,\n        },\n      ],\n    };\n  };\n\n  const handleRegionClick = async (e: Event, code: string) => {\n    console.log(code);\n    const dmiPillarsResult = await getDmiPillars(code, year);\n    const country = allCountries.find((o) => o.code === code);\n\n    if (!dmiPillarsResult.success) {\n      return;\n    }\n\n    if (country) {\n      setSidebarCountry(country.country);\n      setSidebarCode(country.code as string);\n      setSidebarData(dmiPillarsResult.data!);\n      setShowSidebar(true);\n    }\n  };\n\n  return (\n    <>\n      <div\n        style={{ width: \"100%\", backgroundColor: \"#FFF\" }}\n        ref={mapContainerRef}\n      >\n        <Container\n          style={{ paddingTop: window.innerWidth <= 768 ? \"55px\" : \"55px\" }}\n        >\n          <TextContainer>\n            <Title emphasis>A construct for measuring digital maturity</Title>\n            <Subtitle>\n              Our Digital Economy Index (DEI) is a comprehensive and\n              evidence-based tool that measures a country’s digital maturity\n              based on 86 indicators along five pillars: foundations, talent,\n              innovation, adoption, and local production. The DEI allows\n              policymakers to assess their country’s digital economic\n              development and where they need to focus their efforts to\n              encourage growth.\n            </Subtitle>\n            <Subtitle>\n              We used the DEI to assess 109 countries, which we have ranked into\n              three categories: digital learners, digital adopters, and digital\n              disruptors.\n            </Subtitle>\n          </TextContainer>\n          <TextContainer>\n            <Title>Global digital economy rankings</Title>\n          </TextContainer>\n\n          <StyledMapButtons\n            resetToggles={resetToggle}\n            handleButtonToggle={(button: ButtonToggleValue, value: boolean) => {\n              setResetToggle(false);\n              handleButtonToggle(button, value);\n            }}\n            allCountries={allCountries.sort((a, b) =>\n              a.country.localeCompare(b.country)\n            )}\n          />\n          <Sidebar\n            show={showSidebar}\n            country={sidebarCountry}\n            code={sidebarCode}\n            pillars={sidebarData!}\n            handleClose={() => setShowSidebar(false)}\n          />\n          <VectorMap\n            ref={mapRef}\n            map={\"world_mill\"}\n            backgroundColor=\"transparent\"\n            draggable={false}\n            zoomButtons={false}\n            zoomOnScroll={false}\n            containerStyle={{\n              position: \"relative\",\n              height:\n                window.innerWidth <= 768\n                  ? `${window.innerWidth - 50}px`\n                  : \"500px\",\n              padding: window.innerWidth <= 768 ? \"0\" : \"50px 0px 40px\",\n              left: window.innerWidth <= 768 ? \"0\" : \"-100px\",\n            }}\n            containerClassName=\"map\"\n            regionStyle={{\n              initial: {\n                fill: \"#e3eaef\",\n                fillOpacity: 1,\n                stroke: \"none\",\n                \"stroke-width\": 0,\n                \"stroke-opacity\": 0,\n              },\n            }}\n            regionsSelectable={false}\n            onRegionTipShow={showTooltip}\n            onRegionClick={handleRegionClick}\n            series={getMapSeries()}\n          />\n\n          <StyledMapLegend\n            handleLegendClick={handleLegendClick}\n            selectedValue={legendValue}\n          />\n          <StyledYearSlider\n            handleSliderChange={(value) => {\n              setYear(value);\n            }}\n          />\n        </Container>\n      </div>\n\n      <div\n        style={{ width: \"100%\", backgroundColor: \"#ececec\" }}\n        ref={countriesContainerRef}\n      >\n        <Container\n          style={{\n            padding: window.innerWidth <= 768 ? \"30px 15px 50px\" : \"55px 15px\",\n          }}\n        >\n          <TextContainer>\n            <Title emphasis>\n              The digital economy market value is dominated by advanced\n              economies\n            </Title>\n            <Subtitle>\n              Advanced economies lead the globe in digital economy market value,\n              with the United States representing more than one third of the\n              global sector’s market value. Saudi Arabia’s digital economy\n              market value ranks in the top 20 countries globally, making up\n              half of the GCC market size.\n            </Subtitle>\n          </TextContainer>\n          <TextContainer noMargin>\n            <Title>\n              Digital economy market value (US $) of top 15 countries\n            </Title>\n          </TextContainer>\n          <GridContainer className=\"topCountries\">\n            {topCountries.slice(0, 15).map((country, index) => {\n              return (\n                <Card\n                  className={`country c-${formatCountryClassnames(\n                    country.country\n                  )}`}\n                  key={index}\n                >\n                  <IndexContainer>\n                    <Index>{index + 1}</Index>\n                  </IndexContainer>\n                  <CardContent>\n                    <MaturityIndex>\n                      {formatNumber(country.maturityIndex)}\n                    </MaturityIndex>\n                    <CircleIndicator\n                      className=\"circleIndicator\"\n                      style={{\n                        opacity: opacityMap[index],\n                        width: `${45 * scaleMap[index]}px`,\n                        height: `${45 * scaleMap[index]}px`,\n                      }}\n                    />\n                    <CountryName>{country.country}</CountryName>\n                  </CardContent>\n                </Card>\n              );\n            })}\n          </GridContainer>\n        </Container>\n      </div>\n    </>\n  );\n};\n\nexport default Map;\n","import { useEffect, useState } from \"react\";\nimport { useInView } from \"react-intersection-observer\";\nimport styled from \"styled-components\";\nimport { Container, SpiderChart } from \"../components\";\nimport { Subtitle, Title } from \"../components/Common\";\n\ninterface ScrollObserver {\n  inView: boolean;\n}\n\nconst GridContainer = styled.div`\n  /* display: grid;\n  grid-template-columns: 40% 60%;\n  grid-template-rows: 1fr;\n  gap: 0px 30px;\n  grid-template-areas: \". .\"; */\n  height: 100%;\n\n  @media (max-width: 768px) {\n    grid-template-areas: \".\" \".\";\n    grid-template-columns: 1fr;\n    grid-template-rows: 1fr ${window.innerWidth + 50}px;\n  }\n`;\n\nconst FullPageContainer = styled.div<ScrollObserver>`\n  /* overflow: ${(props) => (props.inView ? \"scroll\" : \"hidden\")}; */\n  /* overflow: scroll; */\n  /* scroll-snap-type: y mandatory; */\n  /* height: 50%; */\n  z-index: 1;\n  position: relative;\n  width: 40%;\n\n  /* scrollbar-width: none;\n  -ms-overflow-style: none; */\n\n  /* ::-webkit-scrollbar {\n    width: 0;\n    background: transparent;\n  }\n  ::-webkit-scrollbar-thumb {\n    background: transparent;\n  } */\n\n  @media (max-width: 768px) {\n    width: 100%;\n  }\n`;\n\nconst FullPageSection = styled.div`\n  /* scroll-snap-align: start; */\n  height: 70vh;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n\n  :last-child {\n    margin-bottom: 20vh;\n  }\n\n  & > div {\n    background-color: #464646;\n    padding: 15px 0;\n  }\n`;\n\nconst PillarTitle = styled.h3`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: bold;\n  font-size: 28px;\n  line-height: 2;\n  letter-spacing: -0.5px;\n  color: #db536a;\n  margin: 0;\n\n  @media (max-width: 768px) {\n    font-size: 22px;\n    line-height: 2;\n  }\n`;\n\nconst PillarText = styled.span`\n  font-family: \"PwC Helvetica Neue\";\n  font-weight: normal;\n  font-size: 20px;\n  line-height: 30px;\n  letter-spacing: -0.5px;\n  color: #ffffff;\n  margin-top: 10px;\n\n  @media (max-width: 768px) {\n    font-size: 18px;\n    line-height: 1;\n  }\n`;\n\nconst DummyElement = styled.div`\n  position: absolute;\n  bottom: 500px;\n`;\n\nconst SpiderChartContainer = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n`;\nconst StyledSpiderChart = styled(SpiderChart)`\n  position: fixed;\n  top: 50%;\n  transform: translateY(-50%);\n  left: 48vw;\n  width: 50vw;\n  max-width: 650px;\n  padding: 15px;\n\n  @media (max-width: 1368px) {\n    width: 45vw;\n  }\n\n  @media (max-width: 768px) {\n    width: 100%;\n    top: 10%;\n    left: 0;\n    transform: translateY(40%);\n  }\n`;\n\nconst TitleContainer = styled.div`\n  position: fixed;\n  top: 0%;\n  z-index: 2;\n  height: 30%;\n  width: 30%;\n  background-color: #464646;\n\n  ::after {\n    content: \"\";\n    position: absolute;\n    width: 120%;\n    height: 150px;\n    bottom: 0px;\n    left: -10%;\n    background-color: transparent;\n    box-shadow: 0px 90px 50px 10px rgb(70, 70, 70);\n  }\n\n  @media (max-width: 1800px) {\n    width: 35%;\n\n    ::after {\n      width: 103%;\n      left: -3%;\n      box-shadow: 0px 50px 35px 15px rgb(70, 70, 70);\n    }\n  }\n\n  @media (max-width: 1700px) {\n    width: 37%;\n\n    ::after {\n      width: 103%;\n      left: -3%;\n      box-shadow: 0px 50px 35px 15px rgb(70, 70, 70);\n    }\n  }\n\n  @media (max-width: 1450px) {\n    width: 45%;\n\n    ::after {\n      width: 103%;\n      left: -3%;\n      box-shadow: 0px 30px 35px 15px rgb(70, 70, 70);\n    }\n  }\n\n  @media (max-width: 1300px) {\n    width: 50%;\n\n    ::after {\n      width: 103%;\n      left: -3%;\n      box-shadow: 0px 30px 35px 15px rgb(70, 70, 70);\n    }\n  }\n\n  @media (max-width: 768px) {\n    width: calc(100% - 30px);\n    height: 25%;\n\n    ::after {\n      box-shadow: 0px 40px 40px 15px rgb(70, 70, 70);\n      width: 110%;\n      left: -10%;\n      bottom: 20px;\n    }\n  }\n`;\n\nconst Pillars = () => {\n  const [currentStage, setCurrentStage] = useState(0);\n\n  const [fpContainerRef, fpContainerInView] = useInView({\n    threshold: 0,\n  });\n  const [section0Ref, section0InView] = useInView({ threshold: 0 });\n  const [section1Ref, section1InView] = useInView({ threshold: 0 });\n  const [section2Ref, section2InView] = useInView({ threshold: 0 });\n  const [section3Ref, section3InView] = useInView({ threshold: 0 });\n  const [section4Ref, section4InView] = useInView({ threshold: 0 });\n  const [section5Ref, section5InView] = useInView({ threshold: 0 });\n\n  useEffect(() => {\n    const inViewArray = [\n      section0InView,\n      section1InView,\n      section2InView,\n      section3InView,\n      section4InView,\n      section5InView,\n    ];\n    const index = inViewArray.findIndex((o) => o === true);\n    setCurrentStage(index === -1 ? currentStage : index);\n  }, [\n    currentStage,\n    section0InView,\n    section1InView,\n    section2InView,\n    section3InView,\n    section4InView,\n    section5InView,\n  ]);\n\n  return (\n    <div style={{ width: \"100%\", backgroundColor: \"#464646\" }}>\n      <Container\n        style={{\n          // height: window.innerWidth <= 768 ? \"700px\" : \"1000px\",\n          position: \"relative\",\n        }}\n      >\n        <GridContainer>\n          <DummyElement ref={fpContainerRef} />\n\n          <TitleContainer>\n            <div\n              style={{\n                color: \"#ffffff\",\n                position: \"absolute\",\n                bottom: 0,\n                paddingBottom: \"20px\",\n              }}\n            >\n              <Title emphasis style={{ color: \"#fff\", lineHeight: 1.3 }}>\n                Targeting the right areas for the highest return\n              </Title>\n              <Subtitle style={{ color: \"#fff\", margin: 0 }}>\n                To keep pace with advanced economies, GCC countries need to\n                evaluate themselves across the five pillars of digital maturity.\n              </Subtitle>\n            </div>\n          </TitleContainer>\n          <FullPageContainer inView={fpContainerInView}>\n            <FullPageSection>\n              <div>\n                <Title ref={section0Ref} style={{ color: \"#ffffff\" }}></Title>\n              </div>\n            </FullPageSection>\n            <FullPageSection>\n              <div>\n                <PillarTitle ref={section1Ref}>Foundations</PillarTitle>\n                <PillarText>\n                  GCC countries are almost at parity with the OECD in terms of\n                  foundational technology, thanks to heavy investments in\n                  digital infrastructure.\n                </PillarText>\n              </div>\n            </FullPageSection>\n            <FullPageSection>\n              <div>\n                <PillarTitle ref={section2Ref}>Talent</PillarTitle>\n                <PillarText>\n                  GCC countries need to produce more local digital talent by\n                  investing in STEM education at the secondary school level.\n                </PillarText>\n              </div>\n            </FullPageSection>\n            <FullPageSection>\n              <div>\n                <PillarTitle ref={section3Ref}>Innovation</PillarTitle>\n                <PillarText>\n                  Most GCC countries lack sufficient R&D and financial resources\n                  to support innovation, although the number of startups is\n                  increasing.\n                </PillarText>\n              </div>\n            </FullPageSection>\n            <FullPageSection>\n              <div>\n                <PillarTitle ref={section4Ref}>Adoption</PillarTitle>\n                <PillarText>\n                  GCC countries almost match the OECD in adoption of digital\n                  technologies. However, more could be done to encourage online\n                  consumer transactions.\n                </PillarText>\n              </div>\n            </FullPageSection>\n            <FullPageSection>\n              <div>\n                <PillarTitle ref={section5Ref}>Localization</PillarTitle>\n                <PillarText>\n                  GCC countries lack adequate localized digital production.\n                  Digital industry underdevelopment and a lack of resources for\n                  digital entrepreneurs have created a dependence on imported\n                  technology and services.\n                </PillarText>\n              </div>\n            </FullPageSection>\n          </FullPageContainer>\n          <SpiderChartContainer>\n            <StyledSpiderChart stage={currentStage} />\n          </SpiderChartContainer>\n        </GridContainer>\n      </Container>\n    </div>\n  );\n};\n\nexport default Pillars;\n","import styled from \"styled-components\";\nimport \"./App.css\";\nimport {\n  AdditionalText,\n  DownloadBanner,\n  GetInTouch,\n  HeaderBanner,\n  Section,\n  Header,\n  Footer,\n  IntroSection,\n} from \"./components\";\nimport \"./styles/jvectormap.css\";\nimport \"./styles/tooltipProgressBar.scss\";\nimport { DigitalEconomyMaturity, Map, Pillars } from \"./visuals\";\n\nconst FullHeightDiv = styled.div`\n  height: 100%;\n`;\n\nconst AppContainer = styled.div`\n  scroll-snap-type: y proximity;\n  display: flex;\n  flex-direction: column;\n`;\n\nfunction App() {\n  return (\n    <>\n      <Header />\n      <HeaderBanner />\n      <AppContainer>\n        <Section zIndex={100}>\n          <FullHeightDiv>\n            <IntroSection />\n          </FullHeightDiv>\n        </Section>\n        <Section zIndex={100} height=\"component\">\n          <FullHeightDiv style={{ backgroundColor: \"#fff\" }}>\n            <Map />\n          </FullHeightDiv>\n        </Section>\n        <Section zIndex={100}>\n          <FullHeightDiv>\n            <DigitalEconomyMaturity />\n          </FullHeightDiv>\n        </Section>\n        <Section>\n          <FullHeightDiv>\n            <Pillars />\n          </FullHeightDiv>\n        </Section>\n        <Section zIndex={100}>\n          <FullHeightDiv>\n            <AdditionalText />\n          </FullHeightDiv>\n        </Section>\n        <Section zIndex={100}>\n          <FullHeightDiv>\n            <DownloadBanner />\n          </FullHeightDiv>\n        </Section>\n        <Section zIndex={100}>\n          <FullHeightDiv>\n            <GetInTouch />\n          </FullHeightDiv>\n        </Section>\n      </AppContainer>\n      <Footer />\n    </>\n  );\n}\n\nexport default App;\n","import { ReportHandler } from 'web-vitals';\n\nconst reportWebVitals = (onPerfEntry?: ReportHandler) => {\n  if (onPerfEntry && onPerfEntry instanceof Function) {\n    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\n      getCLS(onPerfEntry);\n      getFID(onPerfEntry);\n      getFCP(onPerfEntry);\n      getLCP(onPerfEntry);\n      getTTFB(onPerfEntry);\n    });\n  }\n};\n\nexport default reportWebVitals;\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport reportWebVitals from './reportWebVitals';\n\nReactDOM.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n  document.getElementById('root')\n);\n\n// If you want to start measuring performance in your app, pass a function\n// to log results (for example: reportWebVitals(console.log))\n// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals\nreportWebVitals();\n"],"sourceRoot":""}