{"version":3,"sources":["webpack:///./src/hooks/useIntersectionObserver.ts","webpack:///./src/hooks/useInView.ts","webpack:///./src/stories/Components/Global/Typography/Heading.styles.ts","webpack:///./src/stories/Widgets/RichText/RichText.styles.ts","webpack:///./src/hoc/withMotion.tsx","webpack:///./src/stories/Components/Global/Typography/Paragraph.styles.ts","webpack:///./src/stories/Components/Countdown/Countdown.styles.ts","webpack:///./src/stories/Widgets/ShardLightsHeroBanner/ShardLightsHeroBanner.styles.ts","webpack:///./src/stories/Components/Breadcrumb/Breadcrumb.styles.ts","webpack:///./src/helpers/image.ts"],"names":["useIntersectionObserver","callback","options","observerRef","useRef","rootRef","elementRef","useEffect","current","IntersectionObserver","root","observe","disconnect","JSON","stringify","useInView","reverse","isEditMode","inView","setInView","useState","entries","isIntersecting","H1Styles","css","fonts","brown","thin","fluid","H2Styles","H3Styles","light","H4Styles","H5Styles","bold","H6Styles","Heading","styled","h1","visual","linkStyles","cssVar","regular","tableStyles","ParagraphStyles","RegularStyles","contentStyles","HeadingStyles","Container","SectionWrapper","verticalMargin","setCssVar","from","Device","TabletLarge","isActive","fadeIn","animation","easeInOutCubic","until","MobileLarge","Content","div","imageStyles","withMotion","WrappedComponent","displayName","name","ComponentWithMotion","props","React","createElement","LazyMotion","features","domAnimation","strict","LargeStyles","SmallStyles","Paragraph","p","size","Inner","Title","h2","TimeWrapper","TimeDigits","brand","grey","grey96","black","DigitText","span","Desktop","CountdownStyles","TimeLabel","white","section","SiteWideStyles","ClipWrapper","ImageWrapper","Image","img","ForegroundImage","SiteWide","ContentWrapper","BreadcrumbStyles","Item","orange","Tag","small","ContentContainer","RichTextStyles","IconBlockList","ul","DesktopLarge","IconItem","li","IconWrapper","rgba","IconText","IconValue","MediaWrapper","CountdownWrapper","CountdownTitle","Countdown","nav","List","StyledLink","Link","imageUrl","image","imageParams","src","imageSource","split","params","rxy","focalPoint","left","top","undefined","rmode","quality","width","heightratio","height","queryString","getSrcs","upper","lower","steps","ratio","increment","Array","fill","map","_","index","Math","ceil","getRange"],"mappings":"mIA6BeA,MAtBf,SAAiCC,EAAUC,EAAU,IACjD,MAAMC,EAAcC,iBAAO,MACrBC,EAAUD,iBAAO,MACjBE,EAAaF,iBAAO,MAiB1B,OAhBAG,oBAAU,KACN,GAAKD,EAAWE,QAQhB,OALAL,EAAYK,QAAU,IAAIC,qBAAqBR,EAAU,CACrDS,KAAML,EAAQG,WACXN,IAEPC,EAAYK,QAAQG,QAAQL,EAAWE,SAChC,KACyB,OAAxBL,EAAYK,SAGhBL,EAAYK,QAAQI,eAEzB,CAACC,KAAKC,UAAUZ,KACZ,CAAEI,aAAYH,cAAaE,YCzB/B,SAASU,EAAUb,EAASc,GAAU,EAAOC,GAAa,GAC7D,MAAOC,EAAQC,GAAaC,oBAAS,IAC/B,WAAEd,GAAeN,EAAyBqB,IACxCA,EAAQ,GAAGC,eACXH,GAAU,IAEO,IAAZH,GACLG,GAAU,IAEfjB,GACH,MAAO,CAACI,IAAYW,GAAoBC,K,gCCZ5C,yBAGA,MAAMK,EAAWC,YAAH,sGACVC,IAAMC,MAAMC,KACDC,YAAM,GAAI,IACRA,YAAM,GAAI,KAKrBC,EAAWL,YAAH,sGACVC,IAAMC,MAAMC,KACDC,YAAM,GAAI,IACRA,YAAM,GAAI,KAKrBE,EAAWN,YAAH,sGACVC,IAAMC,MAAMK,MACDH,YAAM,GAAI,IACRA,YAAM,GAAI,KAKrBI,EAAWR,YAAH,sGACVC,IAAMC,MAAMK,MACDH,YAAM,GAAI,IACRA,YAAM,GAAI,KAKrBK,EAAWT,YAAH,sGACVC,IAAMC,MAAMQ,KACDN,YAAM,GAAI,IACRA,YAAM,GAAI,KAKrBO,EAAWX,YAAH,sGACVC,IAAMC,MAAMQ,KACDN,YAAM,GAAI,IACRA,YAAM,GAAI,KAKrBQ,EAAUC,IAAOC,GAAV,6EAAGD,CAAH,QACT,EAAGE,aACH,OAAQA,GACJ,IAAK,KACD,OAAOhB,EACX,IAAK,KACD,OAAOM,EACX,IAAK,KACD,OAAOC,EACX,IAAK,KACD,OAAOE,EACX,IAAK,KACD,OAAOC,EACX,IAAK,KACD,OAAOE,KAMJ,KACXZ,WACAM,WACAC,WACAE,WACAC,WACAE,WACAC,Y,gCC9EJ,+DAQA,MAAMI,EAAahB,YAAH,4VAIViB,YAAO,eACPA,YAAO,eAIFA,YAAO,WACdhB,IAAMC,MAAMgB,SAgBVC,EAAcnB,YAAH,gHAKOiB,YAAO,WAClBA,YAAO,WACdG,IAAgBC,eAMhBC,EAAgBtB,YAAH,8dACRiB,YAAO,WACdhB,IAAMC,MAAMgB,QAGVK,IAAcxB,SAIdwB,IAAclB,SAIdkB,IAAcjB,SAIdiB,IAAcf,SAIde,IAAcd,SAIdc,IAAcZ,SAIdS,IAAgBC,cAIhBpB,IAAMC,MAAMQ,KAMZU,IAAgBC,cA+BhBL,EAQAG,GAmBAK,EAAYX,YAAOY,KAAV,+EAAGZ,CAAH,kJACX,EAAGa,oBAAqBA,GACxB1B,YADsC,SAElC2B,YAAU,gBAAiBD,IAGxBE,YAAKC,IAAOC,aAETb,YAAO,iBAGf,EAAGc,cAAeA,GACpB/B,YAD4B,SAEtBgC,YAAOD,EAAU,IAAK,EAAGE,IAAUC,iBAIlCC,YAAMN,IAAOO,aAELnB,YAAO,kBAGpBoB,EAAUxB,IAAOyB,IAAV,6EAAGzB,CAAH,iCAITS,GAEEiB,EAAcvC,YAAH,iDAMF,KACXwB,YACAa,UACAf,gBACAN,aACAuB,gB,gCCvLJ,wEAEO,SAASC,EAAWC,GACvB,MAAMC,EAAcD,EAAiBC,aAAeD,EAAiBE,MAAQ,YACvEC,EAAuBC,GACjBC,IAAMC,cAAcC,IAAY,CAAEC,SAAUC,IAAcC,QAAQ,GACtEL,IAAMC,cAAcN,EAAkB,IAAKI,KAGnD,OADAD,EAAoBF,YAAe,cAAaA,KACzCE,I,gCCTX,yBAMA,MAAMQ,EAAcpD,YAAH,6EACbC,IAAMC,MAAMK,MACDH,YAAM,GAAI,IACRA,YAAM,GAAI,KAOrBiB,EAAgBrB,YAAH,6EACfC,IAAMC,MAAMK,MACDH,YAAM,GAAI,IACRA,YAAM,GAAI,KAOrBiD,EAAcrD,YAAH,6EACbC,IAAMC,MAAMK,MACDH,YAAM,GAAI,IACRA,YAAM,GAAI,KAIrBkD,EAAYzC,IAAO0C,EAAV,iFAAG1C,CAAH,QACX,EAAG2C,WACH,OAAQA,GACJ,IAAK,QACD,OAAOJ,EACX,IAAK,UACD,OAAO/B,EACX,IAAK,QACD,OAAOgC,KAMJ,KACXC,YACAD,cACAhC,gBACA+B,gB,gCCnDJ,sDAOA,MAAM5B,EAAYX,IAAOyB,IAAV,gFAAGzB,CAAH,wEAMT4C,EAAQ5C,IAAOyB,IAAV,4EAAGzB,CAAH,8EAIPW,GAIEkC,EAAQ7C,IAAO8C,GAAV,4EAAG9C,CAAH,iPACPU,IAAclB,SAIPuB,YAAKC,IAAOC,aASiBG,IAAUC,eAClBD,IAAUC,gBAIpC0B,EAAc/C,IAAOyB,IAAV,kFAAGzB,CAAH,+ZAGRT,YAAM,GAAI,IAEfoB,EAIOI,YAAKC,IAAOC,aAaiBG,IAAUC,eAClBD,IAAUC,gBAIpC2B,EAAahD,IAAOyB,IAAV,iFAAGzB,CAAH,+HAKMiD,IAAMC,KAAKC,OACtBF,IAAMG,OAGXC,EAAYrD,IAAOsD,KAAV,gFAAGtD,CAAH,+MACXZ,IAAMC,MAAMC,KAMLyB,YAAKC,IAAOO,aAIZR,YAAKC,IAAOC,aAIZF,YAAKC,IAAOuC,UA6BjBC,EAAkB,CACpB7C,YACAiC,QACAC,QACAE,cACAC,aACAS,UA1BczD,IAAOyB,IAAV,gFAAGzB,CAAH,oNAKXZ,IAAMC,MAAMC,KAGL2D,IAAMS,MAIN3C,YAAKC,IAAOO,aAIZR,YAAKC,IAAOC,cAWnBoC,aAEWG,O,gCCjIf,sGAaA,MAAM7C,EAAYX,IAAO2D,QAAV,6FAAG3D,CAAH,oHACXc,YAAU,YAAa,UAGXvB,YAAM,IAAK,KACX0D,IAAMG,MACXH,IAAMS,MACGnE,YAAM,GAAI,IAG1BqE,IAAejD,WAIbkD,EAAc7D,IAAOyB,IAAV,+FAAGzB,CAAH,ySAONe,YAAKC,IAAOC,cAUjB6C,EAAe9D,IAAOyB,IAAV,gGAAGzB,CAAH,2IASZ+D,EAAQ/D,IAAOgE,IAAV,yFAAGhE,CAAH,iPAqBLiE,EAAkBjE,IAAOgE,IAAV,mGAAGhE,CAAH,MACf4C,EAAQ5C,YAAOkE,KAAV,yFAAGlE,CAAH,+IACPc,YAAU,YAAa,UAIVvB,YAAM,GAAI,KACPA,YAAM,GAAI,KAEnBwB,YAAKC,IAAOC,aAGV1B,YAAM,EAAG,MAGhB4E,EAAiBnE,IAAOyB,IAAV,kGAAGzB,CAAH,0RAKTsB,YAAMN,IAAOC,aASpBmD,IAAiBzD,UACApB,YAAM,GAAI,IAG3B6E,IAAiBC,KACJ9E,YAAM,GAAI,IAGnBH,IAAMC,MAAMK,MAILuD,IAAMqB,QAIfC,EAAMvE,IAAOwE,MAAV,uFAAGxE,CAAH,gFAELZ,IAAMC,MAAMgB,QACDd,YAAM,GAAI,KAInBsD,EAAQ7C,IAAOC,GAAV,yFAAGD,CAAH,2BACPU,IAAcxB,SACCK,YAAM,GAAI,KAEvBkF,EAAmBzE,IAAOyB,IAAV,oGAAGzB,CAAH,kLAEJT,YAAM,GAAI,IAUJ0D,IAAMqB,QAIxB9C,EAAUxB,IAAOyB,IAAV,4FAAGzB,CAAH,wDACT0E,IAAejE,cAGFlB,YAAM,GAAI,IAEd+B,YAAMN,IAAOC,cAKpB0D,EAAgB3E,IAAO4E,GAAV,kGAAG5E,CAAH,4JACHT,YAAM,GAAI,IAGfwB,YAAKC,IAAOC,aAOZF,YAAKC,IAAO6D,eAIjBC,EAAW9E,IAAO+E,GAAV,6FAAG/E,CAAH,gJAOHe,YAAKC,IAAOC,aAMZK,YAAMN,IAAOC,cAIlB+D,EAAchF,IAAOyB,IAAV,gGAAGzB,CAAH,8mCAIFT,YAAM,GAAI,IAENA,YAAM,GAAI,IAElB+B,YAAMN,IAAOC,aAMpB6D,EAgBcG,YAAKhC,IAAMqB,OAAQ,KAiCnBW,YAAKhC,IAAMqB,OAAQ,KAyBbrB,IAAMG,OAIxB8B,EAAWlF,IAAOyB,IAAV,6FAAGzB,CAAH,kEACKT,YAAM,EAAG,IACxBH,IAAMC,MAAMK,MACDH,YAAM,GAAI,KAGnB4F,EAAYnF,IAAOyB,IAAV,8FAAGzB,CAAH,uBACXZ,IAAMC,MAAMgB,QACDd,YAAM,GAAI,KAEnB6F,EAAepF,IAAOyB,IAAV,iGAAGzB,CAAH,iPAMPsB,YAAMN,IAAOC,cAgBlBoE,EAAmBrF,IAAOyB,IAAV,qGAAGzB,CAAH,sZAKVT,YAAM,GAAI,IAGA0D,IAAMqB,OACjBrB,IAAMG,MACJ7D,YAAM,GAAI,IAMZwB,YAAKC,IAAO6D,eASjBS,EAAiBtF,IAAOyB,IAAV,mGAAGzB,CAAH,8KAIXT,YAAM,EAAG,IACdH,IAAMC,MAAMK,MACDH,YAAM,GAAI,IAGVA,YAAM,EAAG,IAGPA,YAAM,GAAI,KAGrBgG,EAAYvF,IAAOyB,IAAV,8FAAGzB,CAAH,6uBAGXwD,IAAgBR,WAqBZ5D,IAAMC,MAAMgB,QACDd,YAAM,GAAI,IAEd+B,YAAMN,IAAOC,aAIL1B,YAAM,GAAI,IAM7BiE,IAAgBH,UACdjE,IAAMC,MAAMK,MACDH,YAAM,GAAI,IAGRA,YAAM,GAAI,IAIVA,YAAM,GAAI,IAIzBiE,IAAgBC,UACdrE,IAAMC,MAAMgB,QACDd,YAAM,EAAG,IAKb+B,YAAMN,IAAOC,aAKtBuC,IAAgBT,YAIPzB,YAAMN,IAAOC,cASX,KACXN,YACAkD,cACAC,eACAC,QACAE,kBACArB,QACAuB,iBACAQ,gBACAG,WACAE,cACAE,WACAC,YACAZ,MACAE,mBACA5B,QACArB,UACA4D,eACAC,mBACAC,iBACAC,c,gCChcJ,wCAKA,MAAM5E,EAAYX,IAAOwF,IAAV,kFAAGxF,CAAH,8CAEJI,YAAO,YAGZqF,EAAOzF,IAAO4E,GAAV,6EAAG5E,CAAH,sCAIJqE,EAAOrE,IAAO+E,GAAV,6EAAG/E,CAAH,sNAGNZ,IAAMC,MAAMgB,QAKLU,YAAKC,IAAOC,aASRb,YAAO,gBAKhBsF,EAAa1F,YAAO2F,KAAV,mFAAG3F,CAAH,wMAgBVZ,IAAMC,MAAMK,OAIH,KACXiB,YACA0D,OACAsB,KAAMD,EACND,S,+BC5DJ,0FAOO,SAASG,EAASC,EAAOC,GAC5B,IAAKD,IAAUA,EAAME,IACjB,MAAO,GAMX,MAAMC,EAAcH,EAAME,IAAIE,MAAM,KAAK,GACnCC,EAAS,CACXC,IAAKN,EAAMO,WAAc,GAAEP,EAAMO,WAAWC,QAAQR,EAAMO,WAAWE,WAAQC,EAC7EC,MAAO,OAEPC,QAASX,EAAYY,OAASZ,EAAYY,MAAQ,IAAM,QAAKH,KAC1DT,QAGyBS,IAA5BT,EAAYa,kBAAmDJ,IAAtBT,EAAYY,QACrDR,EAAOU,OAASd,EAAYY,MAAQZ,EAAYa,aAGpD,MAAQ,GAAEX,IADWa,IAAYpI,UAAUyH,GACH,IAAGW,IAAYpI,UAAUyH,GAAY,KAE1E,SAASY,EAAQjB,EAAOkB,EAAOC,EAAOC,EAAOC,GAEhD,OAMJ,SAAkBH,EAAOC,EAAOC,GAC5B,MACME,GADaJ,EAAQC,IACKC,EAAQ,GACxC,MAAO,CACHD,KACGI,MAAMH,EAAQ,GACZI,KAAK,IACLC,IAAI,CAACC,EAAGC,IAAUC,KAAKC,KAAKV,EAAQG,GAAaK,EAAQ,KAC9DT,GAfUY,CAASZ,EAAOC,EAAOC,GACxBK,IAAK3E,GAAU,GAAEiD,EAASC,EAAO,CAAEa,MAAO/D,EAAMgE,YAAaO,OAAYvE","file":"14-02469fed53d09bb979c1.js","sourcesContent":["import { useEffect, useRef } from 'react';\r\n/**\r\n * Use the IntersectionObserver to track visibility of an element in the viewport.\r\n * @param {IntersectionObserverCallback} callback\r\n * @param {IntersectionObserverInit} options\r\n * @returns {UseIntersectionObserverReturn}\r\n */\r\nfunction useIntersectionObserver(callback, options = {}) {\r\n    const observerRef = useRef(null);\r\n    const rootRef = useRef(null);\r\n    const elementRef = useRef(null);\r\n    useEffect(() => {\r\n        if (!elementRef.current) {\r\n            return undefined;\r\n        }\r\n        observerRef.current = new IntersectionObserver(callback, {\r\n            root: rootRef.current,\r\n            ...options,\r\n        });\r\n        observerRef.current.observe(elementRef.current);\r\n        return () => {\r\n            if (observerRef.current === null) {\r\n                return;\r\n            }\r\n            observerRef.current.disconnect();\r\n        };\r\n    }, [JSON.stringify(options)]);\r\n    return { elementRef, observerRef, rootRef };\r\n}\r\nexport default useIntersectionObserver;\r\n","import { useState } from 'react';\r\nimport useIntersectionObserver from './useIntersectionObserver';\r\nexport function useInView(options, reverse = false, isEditMode = false) {\r\n    const [inView, setInView] = useState(false);\r\n    const { elementRef } = useIntersectionObserver((entries) => {\r\n        if (entries[0].isIntersecting) {\r\n            setInView(true);\r\n        }\r\n        else if (reverse === true) {\r\n            setInView(false);\r\n        }\r\n    }, options);\r\n    return [elementRef, isEditMode ? true : inView];\r\n}\r\n","import { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport styled, { css } from 'styled-components';\r\nconst H1Styles = css `\r\n  ${fonts.brown.thin};\r\n  font-size: ${fluid(32, 70)};\r\n  line-height: ${fluid(32, 70)};\r\n  letter-spacing: normal;\r\n  margin: 0 0 16px;\r\n  text-transform: uppercase;\r\n`;\r\nconst H2Styles = css `\r\n  ${fonts.brown.thin};\r\n  font-size: ${fluid(28, 60)};\r\n  line-height: ${fluid(28, 64)};\r\n  letter-spacing: normal;\r\n  margin: 0 0 16px;\r\n  text-transform: uppercase;\r\n`;\r\nconst H3Styles = css `\r\n  ${fonts.brown.light};\r\n  font-size: ${fluid(24, 50)};\r\n  line-height: ${fluid(26, 54)};\r\n  letter-spacing: normal;\r\n  margin: 0 0 16px;\r\n  text-transform: uppercase;\r\n`;\r\nconst H4Styles = css `\r\n  ${fonts.brown.light};\r\n  font-size: ${fluid(21, 24)};\r\n  line-height: ${fluid(28, 32)};\r\n  letter-spacing: normal;\r\n  margin: 0 0 16px;\r\n  text-transform: uppercase;\r\n`;\r\nconst H5Styles = css `\r\n  ${fonts.brown.bold};\r\n  font-size: ${fluid(16, 20)};\r\n  line-height: ${fluid(18, 28)};\r\n  letter-spacing: normal;\r\n  margin: 0 0 16px;\r\n  text-transform: uppercase;\r\n`;\r\nconst H6Styles = css `\r\n  ${fonts.brown.bold};\r\n  font-size: ${fluid(16, 20)};\r\n  line-height: ${fluid(18, 28)};\r\n  letter-spacing: normal;\r\n  margin: 0 0 16px;\r\n  text-transform: uppercase;\r\n`;\r\nconst Heading = styled.h1 `\r\n  ${({ visual }) => {\r\n    switch (visual) {\r\n        case 'h1':\r\n            return H1Styles;\r\n        case 'h2':\r\n            return H2Styles;\r\n        case 'h3':\r\n            return H3Styles;\r\n        case 'h4':\r\n            return H4Styles;\r\n        case 'h5':\r\n            return H5Styles;\r\n        case 'h6':\r\n            return H6Styles;\r\n        default:\r\n            break;\r\n    }\r\n}}\r\n`;\r\nexport default {\r\n    H1Styles,\r\n    H2Styles,\r\n    H3Styles,\r\n    H4Styles,\r\n    H5Styles,\r\n    H6Styles,\r\n    Heading,\r\n};\r\n","import animation, { fadeIn } from '@helpers/animation';\r\nimport { cssVar, setCssVar } from '@helpers/cssVar';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, from, until } from '@helpers/media';\r\nimport HeadingStyles from '@stories/Components/Global/Typography/Heading.styles';\r\nimport ParagraphStyles from '@stories/Components/Global/Typography/Paragraph.styles';\r\nimport SectionWrapper from '@stories/Components/SectionWrapper/SectionWrapper';\r\nimport styled, { css } from 'styled-components';\r\nconst linkStyles = css `\r\n  background-color: transparent;\r\n  background-image: linear-gradient(\r\n    to right,\r\n    ${cssVar('accentColor')} 0%,\r\n    ${cssVar('accentColor')} 100%\r\n  );\r\n  background-repeat: no-repeat;\r\n  background-size: 0% 100%;\r\n  color: ${cssVar('fgColor')};\r\n  ${fonts.brown.regular};\r\n  margin: -3px;\r\n  padding: 3px;\r\n  text-decoration: underline;\r\n  text-underline-position: under;\r\n  transition: background-size 0.15s ease-out;\r\n\r\n  &:focus {\r\n    outline: none;\r\n  }\r\n\r\n  &:focus,\r\n  &:hover {\r\n    background-size: 100% 100%;\r\n  }\r\n`;\r\nconst tableStyles = css `\r\n  margin: 0 0 16px;\r\n\r\n  th,\r\n  td {\r\n    border: 1px solid ${cssVar('fgColor')};\r\n    color: ${cssVar('fgColor')};\r\n    ${ParagraphStyles.RegularStyles};\r\n    height: auto !important; // override inline height - no point this being content editable.\r\n    margin: 0;\r\n    padding: 8px 16px;\r\n  }\r\n`;\r\nconst contentStyles = css `\r\n  color: ${cssVar('fgColor')};\r\n  ${fonts.brown.regular};\r\n\r\n  h1 {\r\n    ${HeadingStyles.H1Styles};\r\n  }\r\n\r\n  h2 {\r\n    ${HeadingStyles.H2Styles};\r\n  }\r\n\r\n  h3 {\r\n    ${HeadingStyles.H3Styles};\r\n  }\r\n\r\n  h4 {\r\n    ${HeadingStyles.H4Styles};\r\n  }\r\n\r\n  h5 {\r\n    ${HeadingStyles.H5Styles};\r\n  }\r\n\r\n  h6 {\r\n    ${HeadingStyles.H6Styles};\r\n  }\r\n\r\n  p {\r\n    ${ParagraphStyles.RegularStyles};\r\n  }\r\n\r\n  strong {\r\n    ${fonts.brown.bold};\r\n  }\r\n\r\n  ol,\r\n  ul {\r\n    display: block;\r\n    ${ParagraphStyles.RegularStyles};\r\n    padding: 0 0 0 40px;\r\n  }\r\n\r\n  ol {\r\n    list-style: decimal;\r\n\r\n    li {\r\n      display: list-item;\r\n    }\r\n  }\r\n\r\n  ul {\r\n    list-style: disc;\r\n\r\n    /* Adjust padding if the browser supports custom markers, otherwise use default disc marker. */\r\n    @supports (selector(ul li::marker)) {\r\n      padding: 0 0 0 20px;\r\n\r\n      li {\r\n        display: list-item;\r\n        padding: 0 0 0 20px;\r\n\r\n        &::marker {\r\n          content: '-';\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  a {\r\n    ${linkStyles};\r\n  }\r\n\r\n  > *:last-child {\r\n    margin-bottom: 0;\r\n  }\r\n\r\n  table {\r\n    ${tableStyles};\r\n  }\r\n\r\n  hr {\r\n    margin: 16px 0;\r\n  }\r\n\r\n  sup {\r\n    position: relative;\r\n    top: -0.5em;\r\n    font-size: 80%;\r\n  }\r\n\r\n  sub {\r\n    position: relative;\r\n    top: 0.5em;\r\n    font-size: 80%;\r\n  }\r\n`;\r\nconst Container = styled(SectionWrapper) `\r\n  ${({ verticalMargin }) => verticalMargin &&\r\n    css `\r\n      ${setCssVar('sectionMargin', verticalMargin)};\r\n    `}\r\n  padding-top: 40px;\r\n  @media ${from(Device.TabletLarge)} {\r\n    scroll-margin-top: 128px;\r\n    margin: ${cssVar('sectionMargin')} 0;\r\n    opacity: 0;\r\n\r\n    ${({ isActive }) => isActive &&\r\n    css `\r\n        ${fadeIn(isActive, 375, 0, animation.easeInOutCubic)};\r\n      `}\r\n  }\r\n\r\n  @media ${until(Device.MobileLarge)} {\r\n    scroll-margin-top: 60px;\r\n    margin: calc(${cssVar('sectionMargin')} / 2) 0;\r\n  }\r\n`;\r\nconst Content = styled.div `\r\n  margin: 0 auto;\r\n  width: 100%;\r\n\r\n  ${contentStyles}\r\n`;\r\nconst imageStyles = css `\r\n  img {\r\n    object-fit: contain;\r\n    height: fit-content;\r\n  }\r\n`;\r\nexport default {\r\n    Container,\r\n    Content,\r\n    contentStyles,\r\n    linkStyles,\r\n    imageStyles,\r\n};\r\n","import { domAnimation, LazyMotion } from 'framer-motion';\r\nimport React from 'react';\r\nexport function withMotion(WrappedComponent) {\r\n    const displayName = WrappedComponent.displayName || WrappedComponent.name || 'Component';\r\n    const ComponentWithMotion = (props) => {\r\n        return (React.createElement(LazyMotion, { features: domAnimation, strict: true },\r\n            React.createElement(WrappedComponent, { ...props })));\r\n    };\r\n    ComponentWithMotion.displayName = `withMotion(${displayName})`;\r\n    return ComponentWithMotion;\r\n}\r\n","import { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport styled, { css } from 'styled-components';\r\n/**\r\n * 20px / 28px\r\n */\r\nconst LargeStyles = css `\r\n  ${fonts.brown.light};\r\n  font-size: ${fluid(18, 24)};\r\n  line-height: ${fluid(26, 36)};\r\n  letter-spacing: normal;\r\n  margin: 0 0 16px;\r\n`;\r\n/**\r\n * 18px / 28px\r\n */\r\nconst RegularStyles = css `\r\n  ${fonts.brown.light};\r\n  font-size: ${fluid(16, 20)};\r\n  line-height: ${fluid(26, 32)};\r\n  letter-spacing: normal;\r\n  margin: 0 0 16px;\r\n`;\r\n/**\r\n * 16px / 26px\r\n */\r\nconst SmallStyles = css `\r\n  ${fonts.brown.light};\r\n  font-size: ${fluid(14, 16)};\r\n  line-height: ${fluid(20, 22)};\r\n  letter-spacing: normal;\r\n  margin: 0 0 16px;\r\n`;\r\nconst Paragraph = styled.p `\r\n  ${({ size }) => {\r\n    switch (size) {\r\n        case 'large':\r\n            return LargeStyles;\r\n        case 'regular':\r\n            return RegularStyles;\r\n        case 'small':\r\n            return SmallStyles;\r\n        default:\r\n            break;\r\n    }\r\n}}\r\n`;\r\nexport default {\r\n    Paragraph,\r\n    SmallStyles,\r\n    RegularStyles,\r\n    LargeStyles,\r\n};\r\n","import animation from '@helpers/animation';\r\nimport brand from '@helpers/brand';\r\nimport { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, from } from '@helpers/media';\r\nimport styled from 'styled-components';\r\nimport HeadingStyles from '../Global/Typography/Heading.styles';\r\nconst Container = styled.div `\r\n  display: flex;\r\n  place-items: center;\r\n  justify-content: center;\r\n  width: 100%;\r\n`;\r\nconst Inner = styled.div `\r\n  width: 100%;\r\n  max-width: 804px;\r\n\r\n  ${Container}[data-show-days='true'] & {\r\n    max-width: 940px;\r\n  }\r\n`;\r\nconst Title = styled.h2 `\r\n  ${HeadingStyles.H2Styles};\r\n  text-align: center;\r\n  margin-bottom: 25px;\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    [data-active='false'] & {\r\n      opacity: 0;\r\n      transform: translateY(40px);\r\n    }\r\n\r\n    [data-active='true'] & {\r\n      opacity: 1;\r\n      transform: translateY(0px);\r\n      transition: opacity 375ms 275ms ${animation.easeInOutCubic},\r\n        transform 375ms 275ms ${animation.easeInOutCubic};\r\n    }\r\n  }\r\n`;\r\nconst TimeWrapper = styled.div `\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: ${fluid(20, 30)};\r\n\r\n  ${Container}[data-show-days='true'] & {\r\n    grid-template-columns: repeat(4, 1fr);\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    [data-active='false'] & {\r\n      opacity: 0;\r\n      transform: rotateX(90deg);\r\n      backface-visiblity: hidden;\r\n      transform-style: preserve-3d;\r\n      transform-origin: top;\r\n    }\r\n\r\n    [data-active='true'] & {\r\n      opacity: 1;\r\n      transform: translateZ(0);\r\n      transform-origin: top;\r\n      transition: opacity 775ms 375ms ${animation.easeInOutCubic},\r\n        transform 775ms 375ms ${animation.easeInOutCubic};\r\n    }\r\n  }\r\n`;\r\nconst TimeDigits = styled.div `\r\n  position: relative;\r\n  display: flex;\r\n  place-items: center;\r\n  justify-content: center;\r\n  background-color: ${brand.grey.grey96};\r\n  color: ${brand.black};\r\n  padding: 14px 12px;\r\n`;\r\nconst DigitText = styled.span `\r\n  ${fonts.brown.thin};\r\n\r\n  font-size: 50px;\r\n  line-height: 1em;\r\n  font-variant-numeric: tabular-nums;\r\n\r\n  @media ${from(Device.MobileLarge)} {\r\n    font-size: 100px;\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    font-size: 122px;\r\n  }\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    font-size: 161px;\r\n  }\r\n\r\n  &[data-message] {\r\n    display: block;\r\n    text-align: center;\r\n  }\r\n`;\r\nconst TimeLabel = styled.div `\r\n  position: absolute;\r\n  top: calc(100% + 10px);\r\n  left: 0;\r\n  width: 100%;\r\n  ${fonts.brown.thin}\r\n  font-size: 20px;\r\n  line-height: 1em;\r\n  color: ${brand.white};\r\n  text-align: center;\r\n  text-transform: uppercase;\r\n\r\n  @media ${from(Device.MobileLarge)} {\r\n    top: calc(100% + 20px);\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    font-size: 30px;\r\n  }\r\n`;\r\nconst CountdownStyles = {\r\n    Container,\r\n    Inner,\r\n    Title,\r\n    TimeWrapper,\r\n    TimeDigits,\r\n    TimeLabel,\r\n    DigitText,\r\n};\r\nexport default CountdownStyles;\r\n","import brand from '@helpers/brand';\r\nimport { setCssVar } from '@helpers/cssVar';\r\nimport { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, from, until } from '@helpers/media';\r\nimport BreadcrumbStyles from '@stories/Components/Breadcrumb/Breadcrumb.styles';\r\nimport CountdownStyles from '@stories/Components/Countdown/Countdown.styles';\r\nimport SiteWide from '@stories/Components/Global/SiteWide/SiteWide';\r\nimport SiteWideStyles from '@stories/Components/Global/SiteWide/SiteWide.styles';\r\nimport HeadingStyles from '@stories/Components/Global/Typography/Heading.styles';\r\nimport { rgba } from 'polished';\r\nimport styled from 'styled-components';\r\nimport RichTextStyles from '../RichText/RichText.styles';\r\nconst Container = styled.section `\r\n  ${setCssVar('siteWidth', '1640px')};\r\n\r\n  position: relative;\r\n  min-height: ${fluid(400, 820)};\r\n  background: ${brand.black};\r\n  color: ${brand.white};\r\n  padding-bottom: ${fluid(30, 60)};\r\n  overflow: hidden;\r\n\r\n  ${SiteWideStyles.Container} {\r\n    gap: 20px;\r\n  }\r\n`;\r\nconst ClipWrapper = styled.div `\r\n  position: relative;\r\n  display: grid;\r\n  grid-template-columns: 1fr;\r\n  grid-template-rows: 1fr;\r\n  overflow: clip;\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);\r\n    transition: clip-path 0.5s linear 0.5s;\r\n    max-height: 880px;\r\n\r\n    [data-active='true'] & {\r\n      clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 76px));\r\n    }\r\n  }\r\n`;\r\nconst ImageWrapper = styled.div `\r\n  display: grid;\r\n  grid-template-columns: 1fr;\r\n  grid-template-rows: 1fr;\r\n  grid-area: 1 / 1 / 2 / 2;\r\n  z-index: 1;\r\n  max-height: inherit;\r\n  clip-path: inherit;\r\n`;\r\nconst Image = styled.img `\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  object-position: center;\r\n\r\n  &:nth-child(1) {\r\n    grid-area: 1 / 1 / 2 / 2;\r\n  }\r\n\r\n  &:nth-child(2) {\r\n    grid-area: 1 / 1 / 1 / 1;\r\n    opacity: 0;\r\n    transition: opacity 1s linear 0.5s;\r\n\r\n    [data-active='true'] & {\r\n      opacity: 1;\r\n    }\r\n  }\r\n`;\r\nconst ForegroundImage = styled.img ``;\r\nconst Inner = styled(SiteWide) `\r\n  ${setCssVar('siteWidth', '1640px')};\r\n\r\n  grid-area: 1 / 1 / 2 / 2;\r\n  z-index: 2;\r\n  padding-top: ${fluid(74, 150)};\r\n  padding-bottom: ${fluid(74, 150)};\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr;\r\n    gap: 0 ${fluid(0, 168)};\r\n  }\r\n`;\r\nconst ContentWrapper = styled.div `\r\n  transform: translateX(-75%);\r\n  opacity: 0;\r\n  transition: opacity 1s linear 0.5s, transform 1s linear 0.3s;\r\n\r\n  @media ${until(Device.TabletLarge)} {\r\n    padding-right: 50px;\r\n  }\r\n\r\n  [data-active='true'] & {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n  }\r\n\r\n  ${BreadcrumbStyles.Container} {\r\n    margin-bottom: ${fluid(12, 24)};\r\n  }\r\n\r\n  ${BreadcrumbStyles.Item} {\r\n    font-size: ${fluid(12, 16)};\r\n\r\n    &:first-child {\r\n      ${fonts.brown.light}\r\n    }\r\n\r\n    &:last-child::before {\r\n      color: ${brand.orange};\r\n    }\r\n  }\r\n`;\r\nconst Tag = styled.small `\r\n  display: block;\r\n  ${fonts.brown.regular}\r\n  font-size: ${fluid(12, 16)};\r\n  margin-bottom: 8px;\r\n  text-transform: uppercase;\r\n`;\r\nconst Title = styled.h1 `\r\n  ${HeadingStyles.H1Styles}\r\n  margin-bottom: ${fluid(16, 32)};\r\n`;\r\nconst ContentContainer = styled.div `\r\n  position: relative;\r\n  padding-left: ${fluid(28, 48)};\r\n  max-width: 750px;\r\n\r\n  &::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0;\r\n    left: 8px;\r\n    width: 1px;\r\n    height: 100%;\r\n    background-color: ${brand.orange};\r\n    transform: rotate(10deg);\r\n  }\r\n`;\r\nconst Content = styled.div `\r\n  ${RichTextStyles.contentStyles}\r\n\r\n  p {\r\n    font-size: ${fluid(14, 24)};\r\n\r\n    @media ${until(Device.TabletLarge)} {\r\n      line-height: 1.3em;\r\n    }\r\n  }\r\n`;\r\nconst IconBlockList = styled.ul `\r\n  margin-top: ${fluid(30, 72)};\r\n  margin-bottom: 30px;\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    display: grid;\r\n    grid-template-columns: repeat(4, 1fr);\r\n    gap: 20px;\r\n    margin-bottom: 0;\r\n  }\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    margin-right: -12vw;\r\n  }\r\n`;\r\nconst IconItem = styled.li `\r\n  position: relative;\r\n\r\n  &:not(:last-child) {\r\n    margin-bottom: 20px;\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    &:not(:last-child) {\r\n      margin-bottom: unset;\r\n    }\r\n  }\r\n\r\n  @media ${until(Device.TabletLarge)} {\r\n    padding-left: 50px;\r\n  }\r\n`;\r\nconst IconWrapper = styled.div `\r\n  position: relative;\r\n  z-index: 1;\r\n  aspect-ratio: 1 / 1;\r\n  max-width: ${fluid(36, 72)};\r\n  width: 100%;\r\n  margin-bottom: ${fluid(12, 24)};\r\n\r\n  @media ${until(Device.TabletLarge)} {\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n  }\r\n\r\n  ${IconItem}:nth-child(even) & {\r\n    &::before,\r\n    &::after {\r\n      animation-delay: 0.2s;\r\n    }\r\n  }\r\n\r\n  &::before {\r\n    content: '';\r\n    position: absolute;\r\n    z-index: -1;\r\n    top: 50%;\r\n    left: 50%;\r\n    width: 100%;\r\n    height: 100%;\r\n    border-radius: 50%;\r\n    background: ${rgba(brand.orange, 0.08)};\r\n    transform: translate(-50%, -50%) scale(0.5);\r\n    animation: pulse 2s infinite;\r\n\r\n    @keyframes pulse {\r\n      0% {\r\n        transform: translate(-50%, -50%) scale(0.5);\r\n        opacity: 0;\r\n      }\r\n      50% {\r\n        transform: translate(-50%, -50%) scale(1.8);\r\n        opacity: 1;\r\n      }\r\n      75% {\r\n        transform: translate(-50%, -50%) scale(0.5);\r\n        opacity: 0;\r\n      }\r\n      100% {\r\n        transform: translate(-50%, -50%) scale(0.5);\r\n        opacity: 0;\r\n      }\r\n    }\r\n  }\r\n\r\n  &::after {\r\n    content: '';\r\n    position: absolute;\r\n    z-index: -2;\r\n    top: 50%;\r\n    left: 50%;\r\n    width: 100%;\r\n    height: 100%;\r\n    border-radius: 50%;\r\n    background: ${rgba(brand.orange, 0.16)};\r\n    transform: translate(-50%, -50%) scale(0.25);\r\n    animation: pulse-alt 2s infinite;\r\n\r\n    @keyframes pulse-alt {\r\n      0% {\r\n        transform: translate(-50%, -50%) scale(0.5);\r\n        opacity: 0;\r\n      }\r\n      25% {\r\n        transform: translate(-50%, -50%) scale(1.4);\r\n        opacity: 1;\r\n      }\r\n      50% {\r\n        transform: translate(-50%, -50%) scale(1.4);\r\n        opacity: 1;\r\n      }\r\n      100% {\r\n        transform: translate(-50%, -50%) scale(0.5);\r\n        opacity: 0;\r\n      }\r\n    }\r\n  }\r\n\r\n  svg {\r\n    background-color: ${brand.black};\r\n    border-radius: 50%;\r\n  }\r\n`;\r\nconst IconText = styled.div `\r\n  margin-bottom: ${fluid(8, 16)};\r\n  ${fonts.brown.light}\r\n  font-size: ${fluid(12, 16)};\r\n  text-transform: uppercase;\r\n`;\r\nconst IconValue = styled.div `\r\n  ${fonts.brown.regular}\r\n  font-size: ${fluid(22, 32)};\r\n`;\r\nconst MediaWrapper = styled.div `\r\n  display: flex;\r\n  place-content: flex-end;\r\n  transform: translateY(100%);\r\n  transition: transform 1s linear 0.5s;\r\n\r\n  @media ${until(Device.TabletLarge)} {\r\n    position: absolute;\r\n    top: 72px;\r\n    right: -80px;\r\n    width: 190px;\r\n\r\n    img {\r\n      width: 100%;\r\n    }\r\n  }\r\n\r\n  [data-active='true'] & {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\nconst CountdownWrapper = styled.div `\r\n  --timeColumns: 2;\r\n\r\n  position: absolute;\r\n  z-index: 10;\r\n  bottom: ${fluid(30, 60)};\r\n  left: 0;\r\n  display: inline-flex;\r\n  background-color: ${brand.orange};\r\n  color: ${brand.black};\r\n  padding: ${fluid(14, 24)};\r\n  clip-path: polygon(26px 0%, 100% 0%, calc(100% - 26px) 100%, 0% 100%);\r\n  transform: translateX(-100%);\r\n  opacity: 0;\r\n  transition: opacity 1s linear 0.5s, transform 1s linear 0.5s;\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    left: calc((100vw - var(--siteWidth)) / 2);\r\n  }\r\n\r\n  [data-active='true'] & {\r\n    opacity: 1;\r\n    transform: translateX(0);\r\n  }\r\n`;\r\nconst CountdownTitle = styled.div `\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  gap: ${fluid(6, 10)};\r\n  ${fonts.brown.light}\r\n  font-size: ${fluid(20, 40)};\r\n  text-align: center;\r\n  text-transform: uppercase;\r\n  padding: 0 ${fluid(0, 20)} 0 20px;\r\n\r\n  small {\r\n    font-size: ${fluid(10, 16)};\r\n  }\r\n`;\r\nconst Countdown = styled.div `\r\n  padding-right: 14px;\r\n\r\n  ${CountdownStyles.TimeDigits} {\r\n    position: relative;\r\n    background: none;\r\n    color: inherit;\r\n    padding: 0 12px;\r\n    margin: -4px 0 10px;\r\n\r\n    [style='--timeColumns: 3;'] & {\r\n      padding: 0px 8px;\r\n    }\r\n\r\n    [style='--timeColumns: 4;'] & {\r\n      padding: 0px 4px;\r\n    }\r\n\r\n    &:not(:last-child)::before {\r\n      content: ':';\r\n      position: absolute;\r\n      top: 50%;\r\n      right: -10px;\r\n      transform: translateY(-50%);\r\n      ${fonts.brown.regular}\r\n      font-size: ${fluid(30, 40)};\r\n\r\n      @media ${until(Device.TabletLarge)} {\r\n        [style='--timeColumns: 4;'] & {\r\n          right: -7px;\r\n          margin-top: -2px;\r\n          font-size: ${fluid(26, 40)};\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  ${CountdownStyles.DigitText} {\r\n    ${fonts.brown.light}\r\n    font-size: ${fluid(34, 52)};\r\n\r\n    [style='--timeColumns: 3;'] & {\r\n      font-size: ${fluid(26, 52)};\r\n    }\r\n\r\n    [style='--timeColumns: 4;'] & {\r\n      font-size: ${fluid(24, 52)};\r\n    }\r\n  }\r\n\r\n  ${CountdownStyles.TimeLabel} {\r\n    ${fonts.brown.regular}\r\n    font-size: ${fluid(8, 12)};\r\n    color: inherit;\r\n    bottom: -16px;\r\n    top: auto;\r\n\r\n    @media ${until(Device.TabletLarge)} {\r\n      bottom: -12px;\r\n    }\r\n  }\r\n\r\n  ${CountdownStyles.TimeWrapper} {\r\n    grid-template-columns: repeat(var(--timeColumns), 1fr);\r\n    gap: 8px;\r\n\r\n    @media ${until(Device.TabletLarge)} {\r\n      column-gap: 10px;\r\n\r\n      [style='--timeColumns: 4;'] & {\r\n        column-gap: 6px;\r\n      }\r\n    }\r\n  }\r\n`;\r\nexport default {\r\n    Container,\r\n    ClipWrapper,\r\n    ImageWrapper,\r\n    Image,\r\n    ForegroundImage,\r\n    Inner,\r\n    ContentWrapper,\r\n    IconBlockList,\r\n    IconItem,\r\n    IconWrapper,\r\n    IconText,\r\n    IconValue,\r\n    Tag,\r\n    ContentContainer,\r\n    Title,\r\n    Content,\r\n    MediaWrapper,\r\n    CountdownWrapper,\r\n    CountdownTitle,\r\n    Countdown,\r\n};\r\n","import { cssVar } from '@helpers/cssVar';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, from } from '@helpers/media';\r\nimport Link from '@stories/Components/Link/Link';\r\nimport styled from 'styled-components';\r\nconst Container = styled.nav `\r\n  display: block;\r\n  color: ${cssVar('fgColor')};\r\n  user-select: none;\r\n`;\r\nconst List = styled.ul `\r\n  display: flex;\r\n  align-items: center;\r\n`;\r\nconst Item = styled.li `\r\n  display: flex;\r\n  align-items: center;\r\n  ${fonts.brown.regular};\r\n  font-size: 12px;\r\n  letter-spacing: normal;\r\n  line-height: 18px;\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    font-size: 18px;\r\n    letter-spacing: 0.05em;\r\n    line-height: 24px;\r\n  }\r\n\r\n  & + & {\r\n    &::before {\r\n      content: '/';\r\n      color: ${cssVar('accentColor')};\r\n      margin: 0 4px;\r\n    }\r\n  }\r\n`;\r\nconst StyledLink = styled(Link) `\r\n  display: block;\r\n  color: currentColor;\r\n  text-decoration: none;\r\n  text-transform: uppercase;\r\n  text-underline-position: under;\r\n\r\n  a& {\r\n    &:focus,\r\n    &:hover {\r\n      outline: none;\r\n      text-decoration: underline;\r\n    }\r\n  }\r\n\r\n  span& {\r\n    ${fonts.brown.light};\r\n    cursor: default;\r\n  }\r\n`;\r\nexport default {\r\n    Container,\r\n    Item,\r\n    Link: StyledLink,\r\n    List,\r\n};\r\n","import queryString from 'query-string';\r\n/**\r\n * Create an image URL for ImageSharp\r\n * @param image The image model\r\n * @param imageParams The image parameters\r\n * @returns The image URL\r\n */\r\nexport function imageUrl(image, imageParams) {\r\n    if (!image || !image.src) {\r\n        return '';\r\n    }\r\n    /**\r\n     * Remove any query param string to ensure paramsString is applied correctly and\r\n     * there are no double definitions (setting a param twice prevents any tranformations)\r\n     */\r\n    const imageSource = image.src.split('?')[0];\r\n    const params = {\r\n        rxy: image.focalPoint ? `${image.focalPoint.left},${image.focalPoint.top}` : undefined,\r\n        rmode: 'crop',\r\n        // Define default quality as 95 to ensure some reduction in size for all but the smallest images\r\n        quality: imageParams.width && imageParams.width > 400 ? 95 : undefined,\r\n        ...imageParams,\r\n    };\r\n    // Imagesharp doesn't support heightratio parameter. Convert to height parameter for compatibility.\r\n    if (imageParams.heightratio !== undefined && imageParams.width !== undefined) {\r\n        params.height = imageParams.width * imageParams.heightratio;\r\n    }\r\n    const paramsString = queryString.stringify(params);\r\n    return `${imageSource}${paramsString ? `?${queryString.stringify(params)}` : ''}`;\r\n}\r\nexport function getSrcs(image, upper, lower, steps, ratio) {\r\n    const sizes = getRange(upper, lower, steps);\r\n    return sizes.map((size) => `${imageUrl(image, { width: size, heightratio: ratio })} ${size}w`);\r\n}\r\nexport function getRetinaSrcs(image, width, ratio) {\r\n    const dprs = [1, 1.5, 2, 2.5, 3];\r\n    return dprs.map((dpr) => `${imageUrl(image, { width: width * dpr, heightratio: ratio })} ${dpr}x`);\r\n}\r\nfunction getRange(upper, lower, steps) {\r\n    const difference = upper - lower;\r\n    const increment = difference / (steps - 1);\r\n    return [\r\n        lower,\r\n        ...Array(steps - 2)\r\n            .fill('')\r\n            .map((_, index) => Math.ceil(lower + increment * (index + 1))),\r\n        upper,\r\n    ];\r\n}\r\n"],"sourceRoot":""}