{"version":3,"sources":["webpack:///./src/helpers/media.ts","webpack:///./src/stories/Widgets/Header/ShortListCount/ShortListCount.styles.ts","webpack:///./src/stories/Components/Global/SiteWide/SiteWide.tsx","webpack:///./src/stories/Components/Global/Typography/Paragraph.styles.ts","webpack:///./src/stories/Components/Buttons/GeneralButton/Button.styles.ts","webpack:///./src/helpers/global.ts","webpack:///./src/helpers/layers.ts","webpack:///./src/stories/Components/Global/Typography/Heading.styles.ts","webpack:///./src/helpers/aspectRatio.ts","webpack:///./src/helpers/brand.ts","webpack:///./node_modules/react-use/esm/useEffectOnce.js","webpack:///./node_modules/react-use/esm/useMount.js","webpack:///./src/stories/Widgets/InnerPageNavigation/InnerPageNavigation.styles.ts","webpack:///./src/stories/Widgets/InnerPageNavigation/InnerPageNavigation.tsx","webpack:///./src/hooks/useIntersectionObserver.ts","webpack:///./src/hooks/useInView.ts","webpack:///./src/helpers/fonts.ts","webpack:///./src/helpers/cssVar.ts","webpack:///./src/helpers/fluid.ts","webpack:///./src/stories/Widgets/Header/Header.styles.ts","webpack:///./src/stories/Components/Global/SiteWide/SiteWide.styles.ts","webpack:///./src/helpers/scrollToTop.ts","webpack:///./src/stories/Components/OfferCard/OfferCard.styles.ts","webpack:///./src/stories/Widgets/Header/NavigationDropdown/NavigationDropdown.styles.ts","webpack:///./src/helpers/animation.ts","webpack:///./src/helpers/scrollbars.ts"],"names":["Device","from","size","until","between","start","end","Container","styled","div","fonts","inter","bold","DesktopLarge","Link","a","transition","brand","primary","blue","base","ShortListCountStyles","Heart","span","highlight","SiteWide","children","className","width","id","React","createElement","s","LargeStyles","css","sofiaPro","regular","Mobile","Tablet","Desktop","RegularStyles","SmallStyles","linkStyles","tableStyles","semiBold","grey","contentStyles","HeadingStyles","H1Styles","H2Styles","H3Styles","H4Styles","H5Styles","light","Paragraph","p","Text","PrimaryStyles","white","SecondaryStyles","TertiaryStyles","black","OutlineStyles","TransparentStyles","IconLeft","DesktopSmall","IconRight","hideText","Icon","position","BaseButtonStyles","ButtonTextStyles","TabletLarge","ButtonStyles","Button","button","branding","iconPosition","navHeight","navHeightMobile","siteWideWidth","siteWideWidthNarrow","siteWideWidthInner","siteWidePadding","siteWidePaddingTablet","siteWidePaddingMobile","ButtonReset","Layers","AboveContent","Overlays","Header","Modal","extraBold","fluid","Heading","m","h1","visual","Line","dark","attrs","props","initial","animate","variants","hidden","visible","duration","ease","aspectRatio","height","imageWrapperPreserveRatio","imageCoverContainer","relative","colourWithTransparency","hexValue","value","hex","replace","bigint","parseInt","lightAlt","steel","grey13","grey20","grey35","grey40","grey44","grey60","grey76","grey80","grey90","grey97","validation","invalid","effect","fn","nav","SiteWideStyles","Inner","PreTitle","LinkArea","scrollbars","InnerPageNavigationStyles","InnerPageNavigation","ref","inView","useInView","rootMargin","pageContext","isEditMode","activeId","setActiveId","useMount","observer","IntersectionObserver","entries","lastEntry","reverse","find","entry","isIntersecting","target","sections","forEach","section","element","document","getElementById","observe","S","map","key","href","onClick","event","preventDefault","targetEl","scrollToTop","current","getBoundingClientRect","scrollToSection","title","useIntersectionObserver","callback","options","observerRef","useRef","rootRef","elementRef","useEffect","root","disconnect","setInView","useState","medium","cssVar","name","setCssVar","DEFAULT_MIN_VALUE","TabletSmall","DEFAULT_MAX_VALUE","ActualDesktop","min","max","minWidth","maxWidth","minRem","maxRem","minWidthRem","maxWidthRem","slope","yAxisIntersection","clampMin","round","clampVal","clampMax","num","Math","GlobalStyles","createGlobalStyle","header","cubicEaseOut","NavigationDropdownStyles","TopWrapper","TopInner","LogoWrapper","LogoLink","MobileLarge","LogoMain","LogoBrand","img","MobileToggle","BottomWrapper","MobileWrapper","ShortlistAdded","ShortlistClose","HeaderStyles","ShortlistImage","global","offSet","HTMLElement","querySelector","headerHeight","offsetHeight","window","scrollTo","top","offsetTop","behavior","ImageContainer","Image","Price","ContentWrapper","Title","OfferCardStyles","CtaWrapper","Outer","List","ul","Item","li","CardList","CardListHeader","CardItem","FadeUpBase","FadeUpActive","shouldAnimate","innerCss","properties","timing","verticalFadeIn","amount","opacity","y"],"mappings":"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","file":"InnerPageNavigation-f2a392dd6fc799ebc169.js","sourcesContent":["export var Device;\r\n(function (Device) {\r\n    Device[Device[\"MobileSmall\"] = 320] = \"MobileSmall\";\r\n    Device[Device[\"Mobile\"] = 375] = \"Mobile\";\r\n    Device[Device[\"MobileLarge\"] = 480] = \"MobileLarge\";\r\n    Device[Device[\"TabletSmall\"] = 568] = \"TabletSmall\";\r\n    Device[Device[\"Tablet\"] = 768] = \"Tablet\";\r\n    Device[Device[\"TabletLarge\"] = 1024] = \"TabletLarge\";\r\n    Device[Device[\"DesktopSmall\"] = 1280] = \"DesktopSmall\";\r\n    Device[Device[\"Desktop\"] = 1366] = \"Desktop\";\r\n    Device[Device[\"DesktopLarge\"] = 1600] = \"DesktopLarge\";\r\n    Device[Device[\"ActualDesktop\"] = 1920] = \"ActualDesktop\";\r\n    Device[Device[\"DesktopXL\"] = 2560] = \"DesktopXL\";\r\n})(Device || (Device = {}));\r\nexport function from(size) {\r\n    return `(min-width: ${size}px)`;\r\n}\r\nexport function until(size) {\r\n    return `(max-width: ${size - 1}px)`;\r\n}\r\nexport function between(start, end) {\r\n    return `${from(start)} and ${until(end)}`;\r\n}\r\n","import { transition } from '@helpers/animation';\r\nimport brand from '@helpers/brand';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, from } from '@helpers/media';\r\nimport styled from 'styled-components';\r\nconst Container = styled.div `\r\n  ${fonts.inter.bold};\r\n\r\n  display: block;\r\n  font-size: 13px;\r\n  line-height: 1em;\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    font-size: 14px;\r\n  }\r\n`;\r\nconst Link = styled.a `\r\n  ${transition('text-decoration-color', 0.2)};\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  color: ${brand.primary.blue.base};\r\n  text-decoration: underline;\r\n  text-underline-position: under;\r\n  text-decoration-color: transparent;\r\n\r\n  &:focus,\r\n  &:hover {\r\n    text-decoration-color: currentColor;\r\n  }\r\n`;\r\nconst Heart = styled.span `\r\n  display: inline-block;\r\n  height: 15px;\r\n  margin: 0 8px;\r\n  width: 15px;\r\n  color: ${brand.primary.blue.highlight};\r\n`;\r\nconst ShortListCountStyles = {\r\n    Container,\r\n    Heart,\r\n    Link,\r\n};\r\nexport default ShortListCountStyles;\r\n","import React from 'react';\r\nimport s from './SiteWide.styles';\r\nconst SiteWide = ({ children, className, width = 'default', id }) => {\r\n    return (React.createElement(s.Container, { id: id, className: className, width: width }, children));\r\n};\r\nexport default SiteWide;\r\n","import { transition } from '@helpers/animation';\r\nimport brand from '@helpers/brand';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, from } from '@helpers/media';\r\nimport styled, { css } from 'styled-components';\r\nimport HeadingStyles from './Heading.styles';\r\n/**\r\n * 20px / 28px\r\n */\r\nexport const LargeStyles = css `\r\n  ${fonts.sofiaPro.regular};\r\n  font-size: 20px;\r\n  letter-spacing: normal;\r\n  line-height: 30px;\r\n  margin-bottom: 16px;\r\n\r\n  @media ${from(Device.Mobile)} {\r\n    font-size: 20px;\r\n    line-height: 30px;\r\n  }\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    font-size: 22px;\r\n    line-height: 32px;\r\n  }\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    font-size: 26px;\r\n    line-height: 36px;\r\n  }\r\n`;\r\n/**\r\n * 18px / 28px\r\n */\r\nexport const RegularStyles = css `\r\n  ${fonts.sofiaPro.regular};\r\n  font-size: 18px;\r\n  letter-spacing: normal;\r\n  line-height: 28px;\r\n  margin-bottom: 16px;\r\n`;\r\n/**\r\n * 16px / 26px\r\n */\r\nconst SmallStyles = css `\r\n  ${fonts.sofiaPro.regular};\r\n  font-size: 16px;\r\n  letter-spacing: normal;\r\n  line-height: 26px;\r\n  margin-bottom: 16px;\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    font-size: 18px;\r\n    line-height: 28px;\r\n  }\r\n`;\r\nconst linkStyles = css `\r\n  ${transition('text-decoration-color', 0.2)};\r\n\r\n  ${fonts.sofiaPro.bold};\r\n\r\n  color: ${brand.primary.blue.base};\r\n  text-decoration: underline;\r\n  text-decoration-color: currentColor;\r\n  text-decoration-thickness: 1px;\r\n  text-underline-offset: 3px;\r\n\r\n  &:hover,\r\n  &:focus {\r\n    text-decoration-color: transparent;\r\n  }\r\n`;\r\nconst tableStyles = css `\r\n  ${SmallStyles};\r\n\r\n  margin: 0 0 16px;\r\n  table-layout: fixed;\r\n  text-align: left;\r\n  width: 100%;\r\n\r\n  td,\r\n  th {\r\n    padding: 16px 10px;\r\n\r\n    @media ${from(Device.Tablet)} {\r\n      padding: 16px;\r\n    }\r\n  }\r\n\r\n  thead {\r\n    ${fonts.sofiaPro.semiBold};\r\n\r\n    tr {\r\n      border-bottom: 1px solid ${brand.primary.blue.base};\r\n    }\r\n  }\r\n\r\n  tbody {\r\n    tr {\r\n      &:nth-child(even) {\r\n        background-color: ${brand.primary.grey.base};\r\n      }\r\n    }\r\n  }\r\n`;\r\nconst contentStyles = css `\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  p {\r\n    ${SmallStyles};\r\n  }\r\n\r\n  strong {\r\n    ${fonts.sofiaPro.bold};\r\n  }\r\n\r\n  figure {\r\n    margin: 30px 0;\r\n  }\r\n\r\n  figcaption {\r\n    margin-top: 5px;\r\n    ${fonts.sofiaPro.light};\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  ol,\r\n  ul {\r\n    display: block;\r\n    ${SmallStyles};\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      margin-bottom: 1em;\r\n    }\r\n  }\r\n\r\n  ul {\r\n    list-style: disc;\r\n\r\n    li {\r\n      display: list-item;\r\n      margin-bottom: 1em;\r\n    }\r\n  }\r\n\r\n  a {\r\n    ${linkStyles};\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\n  *:last-child {\r\n    margin-bottom: 0;\r\n  }\r\n`;\r\nconst Paragraph = styled.p `\r\n  ${contentStyles}\r\n\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    contentStyles,\r\n    linkStyles,\r\n    tableStyles,\r\n    Paragraph,\r\n    SmallStyles,\r\n    RegularStyles,\r\n    LargeStyles,\r\n};\r\n","import { transition } from '@helpers/animation';\r\nimport brand from '@helpers/brand';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, until } from '@helpers/media';\r\nimport styled, { css } from 'styled-components';\r\nconst Text = styled.div ``;\r\nexport const PrimaryStyles = css `\r\n  border: 2px solid ${brand.primary.blue.base};\r\n  background-color: ${brand.primary.blue.base};\r\n  color: ${brand.white};\r\n\r\n  &:focus-visible,\r\n  &:hover {\r\n    border-color: var(--hoverColor, ${brand.primary.blue.light}) !important;\r\n    background-color: var(--hoverColor, ${brand.primary.blue.light}) !important;\r\n    color: ${brand.white};\r\n  }\r\n\r\n  &:active {\r\n    border-color: ${brand.primary.blue.base};\r\n    background-color: ${brand.primary.blue.base};\r\n    color: ${brand.white};\r\n  }\r\n`;\r\nexport const SecondaryStyles = css `\r\n  background-color: transparent;\r\n  color: ${brand.white};\r\n  border: 2px solid ${brand.white};\r\n\r\n  &:focus-visible,\r\n  &:hover,\r\n  &:active {\r\n    border-color: ${brand.primary.blue.light};\r\n    background-color: ${brand.primary.blue.light};\r\n    color: ${brand.white};\r\n  }\r\n`;\r\nexport const TertiaryStyles = css `\r\n  background-color: ${brand.white};\r\n  color: ${brand.black};\r\n  border: 2px solid ${brand.white};\r\n\r\n  &:focus-visible,\r\n  &:hover {\r\n    border-color: ${brand.primary.blue.base};\r\n    background-color: ${brand.primary.blue.base};\r\n    color: ${brand.white};\r\n  }\r\n\r\n  &:active {\r\n    border-color: ${brand.white};\r\n    background-color: ${brand.primary.blue.base};\r\n    color: ${brand.white};\r\n  }\r\n`;\r\nexport const OutlineStyles = css `\r\n  background-color: ${brand.white};\r\n  color: ${brand.primary.blue.base};\r\n  border: 2px solid ${brand.primary.blue.base};\r\n\r\n  &:focus-visible,\r\n  &:hover,\r\n  &:active {\r\n    border-color: ${brand.primary.blue.light};\r\n    background-color: ${brand.primary.blue.light};\r\n    color: ${brand.white};\r\n  }\r\n`;\r\nexport const TransparentStyles = css `\r\n  background-color: transparent;\r\n  color: ${brand.white};\r\n  border: 2px solid ${brand.white};\r\n\r\n  &:focus-visible,\r\n  &:hover,\r\n  &:active {\r\n    border-color: ${brand.white};\r\n    background-color: ${brand.primary.blue.base};\r\n    color: ${brand.white};\r\n  }\r\n`;\r\nconst IconLeft = css `\r\n  padding-right: 15px;\r\n\r\n  @media ${until(Device.DesktopSmall)} {\r\n    padding-right: 0;\r\n  }\r\n`;\r\nconst IconRight = css `\r\n  padding-left: 15px;\r\n\r\n  @media ${until(Device.DesktopSmall)} {\r\n    padding-left: 0;\r\n  }\r\n`;\r\nconst hideText = css `\r\n  ${Text} {\r\n    @media ${until(Device.DesktopSmall)} {\r\n      display: none;\r\n    }\r\n  }\r\n`;\r\nconst Icon = styled.div `\r\n  display: inline-block;\r\n  vertical-align: middle;\r\n\r\n  ${({ position }) => {\r\n    switch (position) {\r\n        case 'left':\r\n            return IconLeft;\r\n        case 'right':\r\n            return IconRight;\r\n        default:\r\n            break;\r\n    }\r\n}}\r\n\r\n  svg {\r\n    max-height: 24px;\r\n    width: 20px;\r\n  }\r\n`;\r\nexport const BaseButtonStyles = css `\r\n  ${transition('color, background-color, border-color')};\r\n\r\n  display: inline-flex;\r\n  align-items: center;\r\n  border-radius: 25px;\r\n  height: 50px;\r\n  justify-content: center;\r\n  padding: 0 32px;\r\n  text-decoration: none;\r\n  user-select: none;\r\n  white-space: nowrap;\r\n`;\r\nexport const ButtonTextStyles = css `\r\n  ${fonts.inter.semiBold};\r\n\r\n  font-size: 16px;\r\n  line-height: 26px;\r\n  text-transform: uppercase;\r\n  transform: translateY(-2px);\r\n  vertical-align: middle;\r\n\r\n  @media ${until(Device.TabletLarge)} {\r\n    font-size: 12px;\r\n    line-height: 20px;\r\n    white-space: break-spaces;\r\n    text-align: center;\r\n  }\r\n`;\r\nconst Button = styled.button `\r\n  ${BaseButtonStyles};\r\n\r\n  ${Text} {\r\n    ${ButtonTextStyles};\r\n\r\n    display: inline-block;\r\n  }\r\n\r\n  ${({ branding }) => {\r\n    switch (branding) {\r\n        case 'primary':\r\n            return PrimaryStyles;\r\n        case 'secondary':\r\n            return SecondaryStyles;\r\n        case 'tertiary':\r\n            return TertiaryStyles;\r\n        case 'outline':\r\n            return OutlineStyles;\r\n        case 'transparent':\r\n            return TransparentStyles;\r\n        default:\r\n            break;\r\n    }\r\n}}\r\n\r\n  ${({ iconPosition }) => {\r\n    switch (iconPosition) {\r\n        case 'right':\r\n            return hideText;\r\n        default:\r\n            break;\r\n    }\r\n}}\r\n\r\n  &:disabled {\r\n    opacity: 0.5;\r\n    pointer-events: none;\r\n  }\r\n`;\r\nexport const ButtonStyles = {\r\n    Button,\r\n    Icon,\r\n    Text,\r\n};\r\n","import { css } from 'styled-components';\r\nexport default {\r\n    navHeight: 175,\r\n    navHeightMobile: 92,\r\n    siteWideWidth: 1760,\r\n    siteWideWidthNarrow: 1430,\r\n    siteWideWidthInner: 860,\r\n    siteWidePadding: 36,\r\n    siteWidePaddingTablet: 26,\r\n    siteWidePaddingMobile: 15,\r\n};\r\nexport const ButtonReset = css `\r\n  border: none;\r\n  outline: none;\r\n  padding: 0px;\r\n  background: none;\r\n  border-radius: 0px;\r\n`;\r\n","/**\r\n * The various major z-index layers, adjust with caution and leave space between to add to later.\r\n */\r\nexport const Layers = {\r\n    AboveContent: 25,\r\n    Overlays: 50,\r\n    Header: 100,\r\n    Modal: 1000,\r\n};\r\n","import brand from '@helpers/brand';\r\nimport { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, from, until } from '@helpers/media';\r\nimport { m } from 'framer-motion';\r\nimport styled, { css } from 'styled-components';\r\nconst H1Styles = css `\r\n  ${fonts.inter.extraBold};\r\n\r\n  font-size: ${fluid(24, 56)};\r\n  line-height: ${fluid(40, 80)};\r\n  margin-bottom: 16px;\r\n`;\r\nconst H2Styles = css `\r\n  ${fonts.inter.extraBold};\r\n\r\n  font-size: ${fluid(20, 48)};\r\n  line-height: ${fluid(35, 70)};\r\n  margin-bottom: 16px;\r\n`;\r\nconst H3Styles = css `\r\n  ${fonts.inter.extraBold};\r\n\r\n  font-size: ${fluid(18, 40)};\r\n  line-height: ${fluid(32, 60)};\r\n  margin-bottom: 16px;\r\n`;\r\nconst H4Styles = css `\r\n  ${fonts.inter.extraBold};\r\n\r\n  font-size: ${fluid(16, 32)};\r\n  line-height: ${fluid(30, 50)};\r\n  margin-bottom: 16px;\r\n`;\r\nconst H5Styles = css `\r\n  ${fonts.inter.extraBold};\r\n\r\n  font-size: ${fluid(14, 24)};\r\n  line-height: ${fluid(24, 38)};\r\n  margin-bottom: 16px;\r\n`;\r\nconst Heading = styled(m.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        default:\r\n            break;\r\n    }\r\n}}\r\n\r\n  text-wrap: pretty;\r\n\r\n  &:has(${() => Line}) {\r\n    display: flex;\r\n    gap: 8px;\r\n  }\r\n\r\n  @media ${until(Device.Tablet)} {\r\n    flex-direction: column;\r\n    color: ${brand.primary.grey.dark};\r\n  }\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    align-items: flex-end;\r\n  }\r\n\r\n  span {\r\n    flex-shrink: 0;\r\n  }\r\n`;\r\nconst Line = styled(m.div).attrs((props) => ({\r\n    initial: 'hidden',\r\n    animate: props['showLine'] ? 'visible' : 'hidden',\r\n    variants: {\r\n        hidden: {\r\n            width: '0px',\r\n        },\r\n        visible: {\r\n            width: '100%',\r\n        },\r\n    },\r\n    transition: {\r\n        duration: 1,\r\n        ease: 'easeInOut',\r\n    },\r\n})) `\r\n  background-color: ${brand.primary.blue.base};\r\n  height: 4px;\r\n  margin-bottom: 9px;\r\n`;\r\nexport default {\r\n    H1Styles,\r\n    H2Styles,\r\n    H3Styles,\r\n    H4Styles,\r\n    H5Styles,\r\n    Heading,\r\n    Line,\r\n};\r\n","import { css } from 'styled-components';\r\n/**\r\n * Returns the aspect ratio of the given width and height as a percentage.\r\n */\r\nexport function aspectRatio(width, height) {\r\n    return (height / width) * 100;\r\n}\r\n/**\r\n * Re-usable styles for image container where the\r\n * image needs to maintain it's aspect ratio\r\n *\r\n * @param width\r\n * @param height\r\n * @returns\r\n */\r\nexport function imageWrapperPreserveRatio(width, height) {\r\n    if (!width && !height) {\r\n        return null;\r\n    }\r\n    return css `\r\n    position: relative;\r\n    height: 0;\r\n    width: 100%;\r\n    overflow: hidden;\r\n    overflow: clip;\r\n    padding-bottom: ${aspectRatio(width, height)}%;\r\n  `;\r\n}\r\n/**\r\n * Re-usable styles for an image placed within\r\n * a container maintaining aspect ratio\r\n */\r\nexport const imageCoverContainer = (relative) => css `\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  object-position: center;\r\n  ${!relative && 'position: absolute; top: 0;left: 0;'}\r\n`;\r\n","const brand = {\r\n    black: '#191919',\r\n    white: '#FEFFFF',\r\n    primary: {\r\n        grey: {\r\n            dark: '#3B4044',\r\n            base: '#949494',\r\n            light: '#F1F1F1',\r\n            lightAlt: '#F1F3F8',\r\n        },\r\n        blue: { base: '#01346B', light: '#7185BE', highlight: '#3CB5AB', steel: '#227C9D' },\r\n    },\r\n    grey: {\r\n        grey13: '#212121',\r\n        grey20: '#333333',\r\n        grey35: '#595959',\r\n        grey40: '#666666',\r\n        grey44: '#707070',\r\n        grey60: '#999999',\r\n        grey76: '#C2C2C2',\r\n        grey80: '#CCCCCC',\r\n        grey90: '#E5E5E5',\r\n        grey97: '#F7F7F7',\r\n    },\r\n    validation: {\r\n        invalid: '#DA291C',\r\n    },\r\n};\r\nexport default brand;\r\nexport function colourWithTransparency(hexValue, value) {\r\n    const hex = hexValue.replace('#', '');\r\n    const bigint = parseInt(hex, 16);\r\n    const r = (bigint >> 16) & 255;\r\n    const g = (bigint >> 8) & 255;\r\n    const b = bigint & 255;\r\n    const rgbValue = `${r}, ${g}, ${b}`;\r\n    return `rgba(${rgbValue}, ${value})`;\r\n}\r\n","import { useEffect } from 'react';\nvar useEffectOnce = function (effect) {\n    useEffect(effect, []);\n};\nexport default useEffectOnce;\n","import useEffectOnce from './useEffectOnce';\nvar useMount = function (fn) {\n    useEffectOnce(function () {\n        fn();\n    });\n};\nexport default useMount;\n","import brand from '@helpers/brand';\r\nimport { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport { Layers } from '@helpers/layers';\r\nimport { Device, from, until } from '@helpers/media';\r\nimport scrollbars from '@helpers/scrollbars';\r\nimport SiteWideStyles from '@stories/Components/Global/SiteWide/SiteWide.styles';\r\nimport { RegularStyles } from '@stories/Components/Global/Typography/Paragraph.styles';\r\nimport styled from 'styled-components';\r\nconst Container = styled.nav `\r\n  --bgColour: ${brand.primary.grey.light};\r\n  --fgColour: ${brand.primary.blue.base};\r\n\r\n  background-color: var(--bgColour);\r\n\r\n  position: sticky;\r\n  top: 92px;\r\n  width: 100%;\r\n  z-index: ${Layers.Header - 1};\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    top: 72px;\r\n  }\r\n\r\n  ${SiteWideStyles.Container} {\r\n    @media ${until(Device.Desktop)} {\r\n      padding-right: 0;\r\n    }\r\n  }\r\n`;\r\nconst Inner = styled.div `\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  align-items: center;\r\n  gap: ${fluid(10, 15)};\r\n\r\n  padding: ${fluid(12, 15)} 0;\r\n\r\n  @media ${from(Device.Tablet)} {\r\n    grid-column: 1 / span 12;\r\n  }\r\n\r\n  @media ${from(Device.DesktopSmall)} {\r\n    flex-wrap: nowrap;\r\n  }\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    grid-column: 2 / span 10;\r\n  }\r\n`;\r\nconst PreTitle = styled.span `\r\n  ${RegularStyles};\r\n  ${fonts.sofiaPro.bold};\r\n  font-size: ${fluid(18, 22)};\r\n  text-transform: uppercase;\r\n  margin: 0;\r\n  padding-right: 50px;\r\n\r\n  @media ${until(Device.DesktopSmall)} {\r\n    flex: 1 0 100%;\r\n    text-align: center;\r\n  }\r\n`;\r\nconst LinkArea = styled.div `\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  justify-content: center;\r\n  gap: ${fluid(10, 15)};\r\n  padding-right: 8px;\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    ${scrollbars};\r\n\r\n    padding-right: 0;\r\n    flex-wrap: nowrap;\r\n    overflow: auto;\r\n    justify-content: flex-start;\r\n  }\r\n`;\r\nconst Link = styled.a `\r\n  ${RegularStyles};\r\n  ${fonts.sofiaPro.bold};\r\n  position: relative;\r\n  display: inline-flex;\r\n  color: var(--fgColour);\r\n  background-color: ${brand.white};\r\n  margin: 0;\r\n  padding: 0 ${fluid(15, 25)};\r\n  border-radius: 1000000px;\r\n  place-content: center;\r\n  place-items: center;\r\n  text-decoration: none;\r\n  text-transform: uppercase;\r\n  white-space: nowrap;\r\n  font-size: ${fluid(16, 18)};\r\n  height: ${fluid(30, 40)};\r\n  transition: background-color 0.3s, color 0.3s;\r\n\r\n  &[data-active='true'],\r\n  &.focus-ring,\r\n  &:hover {\r\n    background-color: var(--fgColour);\r\n    color: ${brand.white};\r\n  }\r\n`;\r\nconst InnerPageNavigationStyles = {\r\n    Container,\r\n    Inner,\r\n    Link,\r\n    LinkArea,\r\n    PreTitle,\r\n};\r\nexport default InnerPageNavigationStyles;\r\n","import { rootMargin } from '@helpers/animation';\r\nimport { useInView } from '@hooks/useInView';\r\nimport * as React from 'react';\r\nimport { useMount } from 'react-use';\r\nimport S from './InnerPageNavigation.styles';\r\nimport SiteWide from '@stories/Components/Global/SiteWide/SiteWide';\r\nimport { scrollToTop } from '@helpers/scrollToTop';\r\nconst InnerPageNavigation = (props) => {\r\n    const [ref, inView] = useInView({ rootMargin }, true, props.pageContext?.isEditMode);\r\n    const [activeId, setActiveId] = React.useState('');\r\n    useMount(() => {\r\n        const observer = new IntersectionObserver((entries) => {\r\n            const lastEntry = [...entries].reverse().find((entry) => entry.isIntersecting);\r\n            if (lastEntry) {\r\n                setActiveId(lastEntry.target.id);\r\n            }\r\n        }, { rootMargin });\r\n        props.sections.forEach((section) => {\r\n            const element = document.getElementById(section.id);\r\n            if (element) {\r\n                observer.observe(element);\r\n            }\r\n        });\r\n    });\r\n    return (React.createElement(S.Container, { \"aria-label\": \"In-page navigation\", ref: ref, \"data-animate\": inView },\r\n        React.createElement(SiteWide, null,\r\n            React.createElement(S.Inner, null,\r\n                React.createElement(S.PreTitle, null, \"Jump To:\"),\r\n                React.createElement(S.LinkArea, null, props.sections.map((section) => (React.createElement(S.Link, { key: section.id, href: `#${section.id}`, \"data-active\": activeId === section.id, onClick: (event) => {\r\n                        event.preventDefault();\r\n                        scrollToSection(section.id);\r\n                    } }, section.title))))))));\r\n    function scrollToSection(id) {\r\n        const targetEl = document.getElementById(id);\r\n        if (targetEl) {\r\n            scrollToTop(targetEl, ref.current?.getBoundingClientRect().height);\r\n        }\r\n    }\r\n};\r\nexport default InnerPageNavigation;\r\n","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    }, [callback, 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 { css } from 'styled-components';\r\nexport default {\r\n    inter: {\r\n        light: css `\r\n      font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 300;\r\n    `,\r\n        regular: css `\r\n      font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 400;\r\n    `,\r\n        medium: css `\r\n      font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 500;\r\n    `,\r\n        semiBold: css `\r\n      font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 600;\r\n    `,\r\n        bold: css `\r\n      font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 700;\r\n    `,\r\n        extraBold: css `\r\n      font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 800;\r\n    `,\r\n    },\r\n    sofiaPro: {\r\n        light: css `\r\n      font-family: 'sofia-pro', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 300;\r\n    `,\r\n        regular: css `\r\n      font-family: 'sofia-pro', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 400;\r\n    `,\r\n        medium: css `\r\n      font-family: 'sofia-pro', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 500;\r\n    `,\r\n        semiBold: css `\r\n      font-family: 'sofia-pro', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 600;\r\n    `,\r\n        bold: css `\r\n      font-family: 'sofia-pro', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 700;\r\n    `,\r\n        black: css `\r\n      font-family: 'sofia-pro', system-ui, -apple-system, BlinkMacSystemFont;\r\n      font-style: normal;\r\n      font-weight: 900;\r\n    `,\r\n    },\r\n};\r\n","const variables = [\r\n    'fgColor',\r\n    'bgColor',\r\n    'accentColor',\r\n    'siteWidth',\r\n    'sitePadding',\r\n    'sectionMargin',\r\n];\r\nfunction cssVar(name) {\r\n    return `var(--${name})`;\r\n}\r\nfunction setCssVar(name, value) {\r\n    return `--${name}: ${value}`;\r\n}\r\nexport { cssVar, setCssVar };\r\n","import { Device } from './media';\r\n/**\r\n * Base pixel value for the \"rem\" unit.\r\n */\r\nexport const PIXELS_PER_REM = 16;\r\n/**\r\n * Default pixel value for the min width.\r\n */\r\nexport const DEFAULT_MIN_VALUE = Device.TabletSmall;\r\n/**\r\n * Default pixel value for the max width.\r\n */\r\nexport const DEFAULT_MAX_VALUE = Device.ActualDesktop;\r\n/**\r\n * Define a fluid value between the min/max values at the min/max widths.\r\n */\r\nexport function fluid(min, max, minWidth = DEFAULT_MIN_VALUE, maxWidth = DEFAULT_MAX_VALUE) {\r\n    const minRem = min / PIXELS_PER_REM;\r\n    const maxRem = max / PIXELS_PER_REM;\r\n    const minWidthRem = minWidth / PIXELS_PER_REM;\r\n    const maxWidthRem = maxWidth / PIXELS_PER_REM;\r\n    const slope = (maxRem - minRem) / (maxWidthRem - minWidthRem);\r\n    const yAxisIntersection = -minWidthRem * slope + minRem;\r\n    const clampMin = `${round(minRem)}rem`;\r\n    const clampVal = `${round(yAxisIntersection)}rem + ${round(slope * 100)}vw`;\r\n    const clampMax = `${round(maxRem)}rem`;\r\n    return `clamp(${clampMin}, ${clampVal}, ${clampMax})`;\r\n}\r\n/**\r\n * Round to nearest hundredth.\r\n */\r\nfunction round(num) {\r\n    return Math.round(num * 100) / 100;\r\n}\r\n","import { cubicEaseOut, transition } from '@helpers/animation';\r\nimport brand, { colourWithTransparency } from '@helpers/brand';\r\nimport { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport { ButtonReset } from '@helpers/global';\r\nimport { Layers } from '@helpers/layers';\r\nimport { Device, from, until } from '@helpers/media';\r\nimport SiteWide from '@stories/Components/Global/SiteWide/SiteWide';\r\nimport SiteWideStyles from '@stories/Components/Global/SiteWide/SiteWide.styles';\r\nimport { m } from 'framer-motion';\r\nimport styled, { createGlobalStyle } from 'styled-components';\r\nimport NavigationDropdownStyles from './NavigationDropdown/NavigationDropdown.styles';\r\nimport ShortListCountStyles from './ShortListCount/ShortListCount.styles';\r\nconst GlobalStyles = createGlobalStyle `\r\n  /* Declare global header CSS variables. */\r\n  :root {\r\n    --headerHeight: 92px;\r\n    --headerReducedOffset: 0px;\r\n\r\n    @media ${from(Device.Desktop)} {\r\n      --headerHeight: 177px;\r\n      --headerNavHeight: ${fluid(51, 54, Device.DesktopSmall)};\r\n      --headerReducedOffset: calc(var(--headerNavHeight) - var(--headerHeight));\r\n    }\r\n  }\r\n\r\n  #main {\r\n    padding-top: var(--headerHeight);\r\n  }\r\n`;\r\nconst Container = styled.header `\r\n  ${transition('transform, border-color', 0.2)};\r\n\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  display: flex;\r\n  background: ${brand.white};\r\n  border-bottom: 4px solid ${brand.primary.blue.base};\r\n  flex-direction: column;\r\n  height: var(--headerHeight);\r\n  padding-top: 24px;\r\n  width: 100%;\r\n  z-index: ${Layers.Header};\r\n\r\n  > ${SiteWideStyles.Container} {\r\n    align-items: center;\r\n  }\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    transition: transform 0.3s ${cubicEaseOut};\r\n\r\n    > ${SiteWideStyles.Container} {\r\n      align-items: flex-start;\r\n    }\r\n\r\n    &[data-reduce='true'] {\r\n      transform: translateY(var(--headerReducedOffset));\r\n    }\r\n  }\r\n\r\n  &:has(${NavigationDropdownStyles.Container}[data-active='true']) {\r\n    border-color: ${brand.primary.blue.highlight};\r\n\r\n    &::after {\r\n      opacity: 0;\r\n    }\r\n  }\r\n`;\r\nconst TopWrapper = styled(SiteWide) `\r\n  display: flex;\r\n  align-items: flex-start;\r\n`;\r\nconst TopInner = styled.div `\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 16px;\r\n  margin-left: auto;\r\n\r\n  @media ${until(Device.Desktop)} {\r\n    ${ShortListCountStyles.Container} {\r\n      display: none;\r\n    }\r\n  }\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    gap: 32px;\r\n  }\r\n`;\r\nconst LogoWrapper = styled.div `\r\n  display: flex;\r\n  gap: 24px;\r\n\r\n  @media ${until(Device.Desktop)} {\r\n    margin-right: 14px;\r\n  }\r\n`;\r\nconst LogoLink = styled.a `\r\n  display: block;\r\n\r\n  @media ${until(Device.MobileLarge)} {\r\n    &[data-brand='true'] {\r\n      display: none;\r\n    }\r\n  }\r\n`;\r\nconst LogoMain = styled.span `\r\n  display: block;\r\n  height: auto;\r\n  width: 106px;\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    width: 180px;\r\n  }\r\n`;\r\nconst LogoBrand = styled.img `\r\n  display: block;\r\n  height: 38px;\r\n  width: auto;\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    height: auto;\r\n    width: auto;\r\n  }\r\n`;\r\nconst MobileToggle = styled.div `\r\n  display: inline-flex;\r\n  align-items: center;\r\n  color: ${brand.primary.blue.base};\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    display: none;\r\n  }\r\n`;\r\nconst BottomWrapper = styled(SiteWide) `\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  margin-top: auto;\r\n\r\n  &::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0;\r\n    left: 50%;\r\n    height: 1px;\r\n    width: 100dvw;\r\n    transform: translateX(-50%);\r\n    background: ${brand.primary.blue.base};\r\n  }\r\n\r\n  @media ${until(Device.Desktop)} {\r\n    display: none;\r\n  }\r\n`;\r\nconst MobileWrapper = styled.div `\r\n  display: block;\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    display: none;\r\n  }\r\n`;\r\nconst ShortlistAdded = styled(m.div) `\r\n  ${fonts.inter.regular};\r\n\r\n  position: fixed;\r\n  top: calc(var(--headerHeight) + 12px);\r\n  right: 12px;\r\n  display: flex;\r\n  gap: 8px;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 260px;\r\n  background: ${brand.white};\r\n  border: 1px solid ${brand.primary.blue.base};\r\n  color: ${brand.primary.blue.base};\r\n  z-index: ${Layers.Header + 1};\r\n  box-shadow: 0 0 4px ${colourWithTransparency(brand.black, 0.2)};\r\n  padding: 8px 18px 8px 8px;\r\n  border-radius: 4px;\r\n  font-size: ${fluid(14, 16, Device.DesktopSmall)};\r\n  line-height: 1.3;\r\n\r\n  &[data-reduced='true'] {\r\n    top: calc(var(--headerHeight) + 12px + var(--headerReducedOffset));\r\n  }\r\n`;\r\nconst ShortlistClose = styled.button `\r\n  ${ButtonReset};\r\n\r\n  position: absolute;\r\n  top: 6px;\r\n  right: 6px;\r\n  width: 8px;\r\n  height: 8px;\r\n\r\n  svg {\r\n    display: block;\r\n    width: 100%;\r\n    height: 100%;\r\n  }\r\n`;\r\nconst ShortlistImage = styled.img `\r\n  width: 50px;\r\n  height: 50px;\r\n`;\r\nconst HeaderStyles = {\r\n    BottomWrapper,\r\n    Container,\r\n    GlobalStyles,\r\n    MobileWrapper,\r\n    LogoBrand,\r\n    LogoLink,\r\n    LogoMain,\r\n    LogoWrapper,\r\n    MobileToggle,\r\n    TopInner,\r\n    TopWrapper,\r\n    ShortlistAdded,\r\n    ShortlistImage,\r\n    ShortlistClose,\r\n};\r\nexport default HeaderStyles;\r\n","import { cssVar, setCssVar } from '@helpers/cssVar';\r\nimport global from '@helpers/global';\r\nimport { Device, from } from '@helpers/media';\r\nimport styled, { css } from 'styled-components';\r\nconst Container = styled.div `\r\n  ${setCssVar('sitePadding', `${global.siteWidePaddingMobile}px`)};\r\n  ${setCssVar('siteWidth', '100%')};\r\n\r\n  margin-left: auto;\r\n  margin-right: auto;\r\n  max-width: calc(${cssVar('siteWidth')} + (${cssVar('sitePadding')} * 2));\r\n  padding-left: ${cssVar('sitePadding')};\r\n  padding-right: ${cssVar('sitePadding')};\r\n  width: 100%;\r\n\r\n  @media ${from(Device.MobileLarge)} {\r\n    ${setCssVar('sitePadding', `${global.siteWidePaddingTablet}px`)};\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    ${setCssVar('sitePadding', `${global.siteWidePadding}px`)};\r\n  }\r\n\r\n  ${({ width }) => {\r\n    switch (width) {\r\n        case 'default':\r\n            return css `\r\n          @media ${from(Device.DesktopLarge)} {\r\n            ${setCssVar('siteWidth', `${global.siteWideWidth}px`)};\r\n          }\r\n        `;\r\n        case 'narrow':\r\n            return css `\r\n          @media ${from(Device.DesktopSmall)} {\r\n            ${setCssVar('siteWidth', `${global.siteWideWidthNarrow}px`)};\r\n          }\r\n        `;\r\n        case 'inner':\r\n            return css `\r\n          @media ${from(Device.Tablet)} {\r\n            ${setCssVar('siteWidth', `${global.siteWideWidthInner}px`)};\r\n          }\r\n        `;\r\n    }\r\n}}\r\n`;\r\nexport default {\r\n    Container,\r\n};\r\n","import HeaderStyles from '@stories/Widgets/Header/Header.styles';\r\nexport const scrollToTop = (ref, \r\n// Additional offset to be applied, such as for sticky inner page nav\r\noffSet) => {\r\n    const element = ref instanceof HTMLElement ? ref : ref?.current;\r\n    if (element) {\r\n        const header = document.querySelector(HeaderStyles.Container);\r\n        const headerHeight = header?.offsetHeight ?? 0;\r\n        window.scrollTo({ top: element.offsetTop - headerHeight - (offSet ?? 0), behavior: 'smooth' });\r\n    }\r\n};\r\n","import { aspectRatio } from '@helpers/aspectRatio';\r\nimport brand from '@helpers/brand';\r\nimport { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device } from '@helpers/media';\r\nimport styled from 'styled-components';\r\nimport { ButtonStyles } from '../Buttons/GeneralButton/Button.styles';\r\nconst Container = styled.a `\r\n  position: relative;\r\n  display: block;\r\n  text-decoration: none;\r\n`;\r\nconst ImageContainer = styled.div `\r\n  position: relative;\r\n  height: 0px;\r\n  padding-bottom: ${aspectRatio(380, 334)}%;\r\n  width: 100%;\r\n`;\r\nconst Image = styled.img `\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  display: block;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  width: 100%;\r\n`;\r\nconst Price = styled.span `\r\n  ${fonts.inter.extraBold};\r\n\r\n  position: absolute;\r\n  bottom: 0;\r\n  left: 50%;\r\n  background-color: ${brand.primary.blue.base};\r\n  color: ${brand.white};\r\n  font-size: ${fluid(14, 20, Device.Desktop)};\r\n  line-height: 1.2em;\r\n  max-width: 100%;\r\n  overflow: hidden;\r\n  padding: ${fluid(8, 12, Device.Desktop)} ${fluid(8, 16, Device.Desktop)};\r\n  text-align: center;\r\n  text-overflow: ellipsis;\r\n  transform: translateY(50%) translateX(-50%);\r\n  white-space: nowrap;\r\n`;\r\nconst ContentWrapper = styled.div `\r\n  padding-top: ${fluid(28, 42, Device.Desktop)};\r\n`;\r\nconst Title = styled.div `\r\n  ${fonts.inter.extraBold};\r\n\r\n  color: ${brand.black};\r\n  font-size: ${fluid(14, 18, Device.Desktop)};\r\n  line-height: 1.2em;\r\n  margin-bottom: 16px;\r\n  text-align: center;\r\n`;\r\nconst CtaWrapper = styled.div `\r\n  ${ButtonStyles.Button} {\r\n    width: 100%;\r\n  }\r\n`;\r\nexport const OfferCardStyles = {\r\n    Container,\r\n    ContentWrapper,\r\n    CtaWrapper,\r\n    Image,\r\n    ImageContainer,\r\n    Price,\r\n    Title,\r\n};\r\n","import { transition } from '@helpers/animation';\r\nimport brand, { colourWithTransparency } from '@helpers/brand';\r\nimport { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, from } from '@helpers/media';\r\nimport scrollbars from '@helpers/scrollbars';\r\nimport SiteWide from '@stories/Components/Global/SiteWide/SiteWide';\r\nimport { OfferCardStyles } from '@stories/Components/OfferCard/OfferCard.styles';\r\nimport styled from 'styled-components';\r\nconst Container = styled.section `\r\n  --colWidth: 280px;\r\n\r\n  position: absolute;\r\n  top: 100%;\r\n  left: calc(var(--sitePadding) * -1);\r\n  color: ${brand.black};\r\n  height: 100vh;\r\n  max-height: 638px;\r\n  max-height: min(638px, 100vh - var(--headerHeight) - 16px);\r\n  pointer-events: none; // disable pointer events on container as this has transparent areas either side\r\n\r\n  [data-central-menu='true'] & {\r\n    pointer-events: all;\r\n    width: calc(var(--colWidth) * 3);\r\n    left: auto;\r\n    right: calc(var(--sitePadding) * -1);\r\n  }\r\n\r\n  &[data-active='false'] {\r\n    max-height: 0;\r\n\r\n    ${() => Inner} {\r\n      max-height: 0;\r\n    }\r\n  }\r\n\r\n  @media (min-height: 900px) {\r\n    max-height: min(638px, 90vh - var(--headerHeight));\r\n  }\r\n\r\n  @media ${from(Device.DesktopLarge)} {\r\n    --colWidth: 310px;\r\n  }\r\n`;\r\nconst Outer = styled(SiteWide) `\r\n  min-height: 0;\r\n  z-index: 2;\r\n`;\r\nconst Inner = styled.div `\r\n  ${transition('border-color', 0.2)};\r\n\r\n  position: absolute;\r\n  border-top: 4px solid transparent;\r\n  pointer-events: all; // re-enable pointer events on the inner container\r\n  display: flex;\r\n\r\n  [data-active='true'] & {\r\n    border-color: ${brand.primary.blue.highlight};\r\n  }\r\n`;\r\nconst List = styled.ul `\r\n  display: block;\r\n  overflow-y: auto;\r\n  // allow space for scroll bar.\r\n  width: var(--colWidth);\r\n  position: relative;\r\n  box-shadow: 3px 0 6px ${colourWithTransparency(brand.black, 0.08)};\r\n\r\n  ${scrollbars};\r\n\r\n  &[data-empty-level='true'] {\r\n    background-color: ${brand.white};\r\n  }\r\n\r\n  &[data-empty-level='false'] {\r\n    background-color: none;\r\n  }\r\n\r\n  &[data-level='1'] {\r\n    --paddingX: 8px;\r\n\r\n    background-color: ${brand.primary.grey.light};\r\n    z-index: 3;\r\n    max-height: 0;\r\n\r\n    &[data-active='true'] {\r\n      padding: 12px var(--paddingX);\r\n      max-height: 638px;\r\n      transition: max-height 0.3s ease-out;\r\n    }\r\n  }\r\n\r\n  &[data-level='2'],\r\n  &[data-level='3'] {\r\n    --paddingX: 18px;\r\n\r\n    transition: width 0.1s ease-in;\r\n    min-height: 638px;\r\n    width: 0;\r\n    padding: 0;\r\n\r\n    &[data-active='true'] {\r\n      width: var(--colWidth);\r\n      padding: 12px var(--paddingX);\r\n      transition: width 0.3s ease-in;\r\n    }\r\n  }\r\n\r\n  &[data-level='2'] {\r\n    background-color: #fafafa;\r\n    z-index: 2;\r\n  }\r\n\r\n  &[data-level='3'] {\r\n    background-color: ${brand.white};\r\n    z-index: 1;\r\n  }\r\n`;\r\nconst Item = styled.li `\r\n  ${transition('background-color', 0.2)};\r\n\r\n  position: relative;\r\n  display: block;\r\n  border-radius: 4px;\r\n  position: relative;\r\n  width: calc(var(--colWidth) - (var(--paddingX) * 2));\r\n\r\n  &[aria-current='true'],\r\n  &:focus-within,\r\n  &:hover {\r\n    background-color: ${colourWithTransparency(brand.primary.blue.light, 0.3)};\r\n  }\r\n\r\n  ${List}[data-level=\"1\"] & {\r\n    [data-link-lines='true'] & {\r\n      &:after {\r\n        left: -8px;\r\n        width: calc(100% + 16px);\r\n      }\r\n    }\r\n  }\r\n\r\n  [data-link-lines='true'] & {\r\n    ${() => Link} {\r\n      margin: 5px 0 10px;\r\n    }\r\n\r\n    &:after {\r\n      content: '';\r\n      position: absolute;\r\n      width: calc(100% + 32px);\r\n      border-bottom: 1px solid #d9d9d9;\r\n      left: -16px;\r\n      bottom: -5px;\r\n    }\r\n  }\r\n\r\n  &:last-child {\r\n    &:after {\r\n      border-bottom: none;\r\n    }\r\n  }\r\n\r\n  &[aria-current='true'] {\r\n    &:before {\r\n      content: '';\r\n      position: absolute;\r\n      width: 3px;\r\n      height: 16px;\r\n      border-radius: 0 4px 4px 0;\r\n      background-color: ${brand.primary.blue.base};\r\n      left: -8px;\r\n      top: 50%;\r\n      transform: translateY(-50%);\r\n\r\n      ${List}[data-level=\"2\"] & {\r\n        left: -16px;\r\n      }\r\n    }\r\n\r\n    ${() => Link} {\r\n      ${fonts.inter.extraBold};\r\n\r\n      font-size: 14px;\r\n    }\r\n  }\r\n`;\r\nconst Link = styled.a `\r\n  ${transition('text-decoration-color', 0.2)};\r\n  ${fonts.sofiaPro.medium};\r\n\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  color: ${brand.black};\r\n  font-size: 16px;\r\n  letter-spacing: normal;\r\n  line-height: 1.2em;\r\n  padding: 0 8px;\r\n  height: ${fluid(42, 46)};\r\n  text-decoration: underline;\r\n  text-transform: none;\r\n  text-decoration-color: transparent;\r\n\r\n  &:focus,\r\n  &:hover {\r\n    text-decoration-color: currentColor;\r\n  }\r\n\r\n  svg {\r\n    position: absolute;\r\n    width: 7px;\r\n    height: 11px;\r\n    right: 8px;\r\n    top: 50%;\r\n    transform: translateY(-50%);\r\n  }\r\n\r\n  ${List}[data-level=\"1\"] & {\r\n    ${fonts.inter.extraBold};\r\n\r\n    font-size: 18px;\r\n  }\r\n\r\n  ${List}[data-level=\"2\"] & {\r\n    font-size: 18px;\r\n  }\r\n`;\r\nconst CardList = styled.ul `\r\n  display: grid;\r\n  column-gap: 40px;\r\n  grid-column: -7 / span 6;\r\n  grid-row: span 2;\r\n  grid-template-columns: repeat(2, 1fr);\r\n  overflow-y: auto;\r\n  padding: 23px 18px;\r\n  background-color: ${brand.white};\r\n  height: 100%;\r\n\r\n  ${scrollbars}\r\n`;\r\nconst CardListHeader = styled.li `\r\n  border-bottom: 2px solid ${brand.primary.blue.base};\r\n  font-size: 22px;\r\n  grid-column: span 2;\r\n  margin-bottom: 24px;\r\n  padding-bottom: 8px;\r\n  text-transform: none;\r\n  max-height: 60px;\r\n`;\r\nconst CardItem = styled.li `\r\n  ${OfferCardStyles.Container} {\r\n    display: flex;\r\n    flex-direction: column;\r\n    height: 100%;\r\n  }\r\n`;\r\nconst NavigationDropdownStyles = {\r\n    CardItem,\r\n    CardListHeader,\r\n    CardList,\r\n    Container,\r\n    Inner,\r\n    Item,\r\n    Link,\r\n    List,\r\n    Outer,\r\n};\r\nexport default NavigationDropdownStyles;\r\n","import { css } from 'styled-components';\r\nexport const rootMargin = '0px 0px -20% 0px';\r\nexport const cubicEaseOut = `cubic-bezier(0.215, 0.61, 0.355, 1)`;\r\nexport const FadeUpBase = css `\r\n  opacity: 0;\r\n  transform: translateY(16px);\r\n  transition: opacity var(--a-duration) ${cubicEaseOut}, transform var(--a-duration) ${cubicEaseOut};\r\n  transition-delay: var(--a-delay);\r\n`;\r\nexport const FadeUpActive = css `\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n`;\r\nexport const shouldAnimate = (innerCss) => {\r\n    return css `\r\n    @media (prefers-reduced-motion: no-preference) {\r\n      ${innerCss}\r\n    }\r\n  `;\r\n};\r\nexport const transition = (properties, duration = 0.35, timing = cubicEaseOut) => {\r\n    return shouldAnimate(css `\r\n    transition-duration: ${typeof duration === 'string' ? duration : `${duration}s`};\r\n    transition-property: ${properties};\r\n    transition-timing-function: ${timing};\r\n    will-change: ${properties};\r\n  `);\r\n};\r\nexport const horizontalFadeIn = (amount, duration) => {\r\n    return {\r\n        hidden: {\r\n            opacity: 0,\r\n            x: amount ?? 20,\r\n        },\r\n        visible: {\r\n            opacity: 1,\r\n            x: 0,\r\n            transition: {\r\n                duration: duration ?? 0.35,\r\n            },\r\n        },\r\n    };\r\n};\r\nexport const verticalFadeIn = (amount, duration) => {\r\n    return {\r\n        hidden: {\r\n            opacity: 0,\r\n            y: amount ?? 20,\r\n        },\r\n        visible: {\r\n            opacity: 1,\r\n            y: 0,\r\n            transition: {\r\n                duration: duration ?? 0.35,\r\n            },\r\n        },\r\n    };\r\n};\r\n","import { css } from 'styled-components';\r\nexport default css `\r\n  &::-webkit-scrollbar-track {\r\n    background-color: none;\r\n  }\r\n\r\n  &::-webkit-scrollbar {\r\n    background-color: none;\r\n    height: var(--scrollbar-width, 10px);\r\n    width: var(--scrollbar-width, 10px);\r\n  }\r\n\r\n  &::-webkit-scrollbar-thumb {\r\n    background-color: #9c9fa1;\r\n    border-radius: calc(var(--scrollbar-width, 10px) / 2);\r\n    cursor: pointer;\r\n  }\r\n`;\r\n"],"sourceRoot":""}