@royaloperahouse/harmonic 0.15.0 → 0.17.0-a

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/CHANGELOG.md +0 -7
  2. package/README.md +252 -43
  3. package/dist/components/atoms/TextField/TextField.style.d.ts +1 -1
  4. package/dist/components/index.d.ts +2 -2
  5. package/dist/components/molecules/Card/Card.style.d.ts +1 -1
  6. package/dist/components/molecules/ContentSummary/ContentSummary.style.d.ts +1 -1
  7. package/dist/components/molecules/Information/Information.style.d.ts +1 -1
  8. package/dist/components/molecules/PageHeading/HighlightCarousel/HighlightCarousel.d.ts +4 -0
  9. package/dist/components/molecules/PageHeading/HighlightCarousel/HighlightCarousel.style.d.ts +14 -0
  10. package/dist/components/molecules/PageHeading/HighlightCarousel/index.d.ts +2 -0
  11. package/dist/components/molecules/PageHeading/index.d.ts +2 -2
  12. package/dist/components/molecules/Pagination/Pagination.style.d.ts +1 -1
  13. package/dist/components/molecules/PromoWithTags/PromoWithTags.style.d.ts +273 -3
  14. package/dist/components/molecules/PromoWithTitle/PromoWithTitle.style.d.ts +273 -3
  15. package/dist/components/molecules/index.d.ts +2 -2
  16. package/dist/components/organisms/Carousels/Carousel/Carousel.style.d.ts +271 -1
  17. package/dist/harmonic.cjs.development.js +126 -101
  18. package/dist/harmonic.cjs.development.js.map +1 -1
  19. package/dist/harmonic.cjs.production.min.js +1 -1
  20. package/dist/harmonic.cjs.production.min.js.map +1 -1
  21. package/dist/harmonic.esm.js +126 -101
  22. package/dist/harmonic.esm.js.map +1 -1
  23. package/dist/index.d.ts +2 -2
  24. package/dist/types/impactHeader.d.ts +2 -20
  25. package/dist/types/types.d.ts +0 -61
  26. package/package.json +1 -1
  27. package/README.GIT +0 -294
  28. package/dist/components/molecules/CastFilter/CastFilters.d.ts +0 -4
  29. package/dist/components/molecules/CastFilter/CastFilters.style.d.ts +0 -16
  30. package/dist/components/molecules/CastFilter/index.d.ts +0 -2
  31. package/dist/components/molecules/PageHeading/Highlight/Highlight.d.ts +0 -4
  32. package/dist/components/molecules/PageHeading/Highlight/Highlight.style.d.ts +0 -9
  33. package/dist/components/molecules/PageHeading/Highlight/index.d.ts +0 -2
@@ -7489,7 +7489,7 @@ var SwipeGridWrapper = /*#__PURE__*/styled__default(GridItem)(_templateObject9$4
7489
7489
 
7490
7490
  var _templateObject$O, _templateObject2$B;
7491
7491
  var SWIPE_SLIDE_CLASS_NAME = 'swipe-slide';
7492
- var SwipeContainer = /*#__PURE__*/styled__default.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n width: 100%;\n touch-action: pan-y;\n padding-inline-start: 2px;\n padding-block-start: 2px;\n"])));
7492
+ var SwipeContainer = /*#__PURE__*/styled__default.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n width: 100%;\n touch-action: pan-y;\n"])));
7493
7493
  var SwipeTrack = /*#__PURE__*/styled__default.div(_templateObject2$B || (_templateObject2$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n transition: ", ";\n transform: translateX(", ");\n\n .", " {\n flex-shrink: 0;\n }\n"])), function (_ref) {
7494
7494
  var transitioning = _ref.transitioning;
7495
7495
  return transitioning ? 'transform 0.3s ease' : 'none';
@@ -9851,58 +9851,10 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
9851
9851
  })))))))))));
9852
9852
  };
9853
9853
 
9854
- var _templateObject$15, _templateObject2$Q, _templateObject3$E, _templateObject4$y;
9855
- var GRID = {
9856
- desktop: {
9857
- leftWithImage: '1 / 1 / 3 / 7',
9858
- leftNoImage: '1 / 1 / 3 / 12',
9859
- right: '1 / 7 / 3 / 17'
9860
- },
9861
- mobile: {
9862
- leftWithImage: '3 / 1 / 4 / 15',
9863
- leftNoImage: '1 / 1 / 3 / 15',
9864
- right: '2 / 1 / 3 / 15'
9865
- }
9866
- };
9867
- var HighlightPanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n background-color: ", ";\n color: var(--color-base-white);\n"])), function (_ref) {
9868
- var $background = _ref.$background;
9869
- return "var(--color-" + $background + ")";
9870
- });
9871
- var LeftPanel$1 = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n\n box-sizing: border-box;\n height: 100%;\n display: grid;\n grid-auto-rows: 90% 1fr;\n gap: 0 36px;\n align-items: center;\n\n @media ", " {\n grid-area: ", ";\n }\n"])), function (_ref2) {
9872
- var hasImage = _ref2.hasImage;
9873
- return hasImage ? GRID.desktop.leftWithImage : GRID.desktop.leftNoImage;
9874
- }, devices.mobileAndTablet, function (_ref3) {
9875
- var hasImage = _ref3.hasImage;
9876
- return hasImage ? GRID.mobile.leftWithImage : GRID.mobile.leftNoImage;
9877
- });
9878
- var RightPanel$1 = /*#__PURE__*/styled__default.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--color-base-black);\n\n @media ", " {\n grid-area: ", ";\n }\n"])), GRID.desktop.right, devices.mobileAndTablet, GRID.mobile.right);
9879
- var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 36px 36px 36px 50px;\n overflow: hidden;\n\n :first-child * {\n margin-block-start: 0;\n }\n\n @media ", " {\n margin: 36px 20px 5px 20px;\n max-height: unset;\n }\n"])), devices.mobileAndTablet);
9880
-
9881
- var PageHeadingHighlight = function PageHeadingHighlight(_ref) {
9882
- var _image$src, _image$alt;
9883
- var image = _ref.image,
9884
- children = _ref.children,
9885
- _ref$background = _ref.background,
9886
- background = _ref$background === void 0 ? 'base-black' : _ref$background,
9887
- className = _ref.className;
9888
- return /*#__PURE__*/React__default.createElement(HighlightPanelGrid, {
9889
- className: className,
9890
- "$background": background,
9891
- "data-testid": "highlight-heading-wrapper"
9892
- }, /*#__PURE__*/React__default.createElement(LeftPanel$1, {
9893
- hasImage: !!image
9894
- }, /*#__PURE__*/React__default.createElement(Wrapper$6, null, children)), image && (/*#__PURE__*/React__default.createElement(RightPanel$1, null, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
9895
- aspectRatio: exports.AspectRatio['4:3']
9896
- }, /*#__PURE__*/React__default.createElement("img", {
9897
- src: (_image$src = image == null ? void 0 : image.src) != null ? _image$src : '',
9898
- alt: (_image$alt = image == null ? void 0 : image.alt) != null ? _image$alt : ''
9899
- })))));
9900
- };
9901
-
9902
- var _templateObject$16, _templateObject2$R, _templateObject3$F, _templateObject5$r, _templateObject6$k, _templateObject7$g, _templateObject8$c, _templateObject9$8, _templateObject0$7;
9903
- var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-2);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
9904
- var BrandingTextBody = /*#__PURE__*/styled__default.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
9905
- var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
9854
+ var _templateObject$15, _templateObject2$Q, _templateObject3$E, _templateObject5$r, _templateObject6$k, _templateObject7$g, _templateObject8$c, _templateObject9$8, _templateObject0$7;
9855
+ var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-2);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
9856
+ var BrandingTextBody = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
9857
+ var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
9906
9858
  var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 37.5vw;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-color: #000;\n img {\n position: relative;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n video {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: contain;\n @media ", " {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n margin: auto;\n height: auto;\n max-height: 100vh;\n width: 100%;\n object-fit: contain;\n }\n }\n @media ", " {\n height: 85vw;\n max-height: 100vh;\n }\n"])), devices.mobile, devices.mobile);
9907
9859
  var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 160px;\n grid-template-rows: min-content min-content;\n grid-template-rows: min-content min-content;\n grid-template-columns: [logo] 1fr [title] 3fr [cta] 1fr;\n align-content: center;\n gap: 0;\n background-color: ", ";\n color: ", ";\n\n svg {\n width: 210px;\n fill: ", ";\n }\n\n h1::selection,\n div::selection {\n ", ";\n }\n\n @media ", " {\n svg {\n width: 145px;\n }\n }\n\n @media ", " {\n display: flex;\n flex-direction: column;\n height: auto;\n padding: 32px 20px;\n\n svg {\n width: 180px;\n }\n }\n"])), function (_ref) {
9908
9860
  var invert = _ref.invert,
@@ -10123,13 +10075,86 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
10123
10075
  }), linkText))))));
10124
10076
  };
10125
10077
 
10126
- var _templateObject$17, _templateObject2$S, _templateObject3$G, _templateObject5$s, _templateObject6$l, _templateObject7$h, _templateObject8$d;
10078
+ var _templateObject$16, _templateObject2$R, _templateObject3$F, _templateObject4$y, _templateObject5$s, _templateObject6$l, _templateObject7$h;
10079
+ var HighlightsGrid$1 = /*#__PURE__*/styled__default(Grid)(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-template-rows: max-content minmax(0, 1fr);\n gap: 0 var(--grid-column-gap);\n background-color: var(--color-base-black);\n color: var(--color-base-white);\n user-select: none;\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
10080
+ var HighlightTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n h1 {\n margin: 0 0 8px 0;\n }\n p {\n text-transform: uppercase;\n }\n"])));
10081
+ var HighlightTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobile);
10082
+ var HighlightsInfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n align-self: center;\n padding: 36px 36px 36px 50px;\n\n @media ", " {\n & {\n grid-area: ", ";\n width: 100%;\n padding: 20px;\n }\n }\n"])), function (_ref) {
10083
+ var hasImages = _ref.hasImages;
10084
+ return hasImages ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
10085
+ }, devices.mobile, function (_ref2) {
10086
+ var hasImages = _ref2.hasImages;
10087
+ return hasImages ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
10088
+ });
10089
+ var HighlightsCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--color-base-black);\n\n .swipe-slide {\n ", "\n }\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 3 / 15;\n\n .swiper-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n"])), function (_ref3) {
10090
+ var hasMultipleImages = _ref3.hasMultipleImages;
10091
+ return hasMultipleImages ? 'width: calc(100% - 50px - var(--rotator-button-width)); -webkit-transform: translate3d(0, 0, 0);' : 'width: 100%';
10092
+ }, devices.mobile);
10093
+ var RotatorButtonsWrapperMobile$1 = /*#__PURE__*/styled__default.div(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n margin-bottom: 8px;\n\n @media ", " {\n div {\n background-color: var(--color-base-black);\n }\n svg path {\n fill: var(--color-base-white);\n }\n\n & {\n display: flex;\n margin-left: 100px;\n align-self: center;\n justify-content: flex-end;\n }\n }\n"])), devices.mobile);
10094
+ var RotatorButtonsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: 50px;\n top: calc(50% - calc(var(--rotator-button-width) / 2));\n z-index: 2;\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.mobileAndTablet);
10095
+
10096
+ var PageHeadingHighlightCarousel = function PageHeadingHighlightCarousel(_ref) {
10097
+ var title = _ref.title,
10098
+ subtitle = _ref.subtitle,
10099
+ text = _ref.text,
10100
+ images = _ref.images;
10101
+ var headerImages = images || [];
10102
+ var hasImages = !!headerImages.length;
10103
+ var hasMultipleImages = headerImages.length > 1;
10104
+ var swipeRef = React.useRef(null);
10105
+ var onNext = function onNext() {
10106
+ var _swipeRef$current;
10107
+ return (_swipeRef$current = swipeRef.current) == null ? void 0 : _swipeRef$current.nextSlide();
10108
+ };
10109
+ var onPrev = function onPrev() {
10110
+ var _swipeRef$current2;
10111
+ return (_swipeRef$current2 = swipeRef.current) == null ? void 0 : _swipeRef$current2.prevSlide();
10112
+ };
10113
+ return /*#__PURE__*/React__default.createElement(HarmonicThemeProvider, {
10114
+ theme: exports.ThemeType.Stream
10115
+ }, /*#__PURE__*/React__default.createElement(HighlightsGrid$1, null, hasImages && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapperMobile$1, null, hasMultipleImages && /*#__PURE__*/React__default.createElement(RotatorButtons, {
10116
+ onClickNext: onNext,
10117
+ onClickPrev: onPrev
10118
+ }))), /*#__PURE__*/React__default.createElement(HighlightsInfoWrapper, {
10119
+ hasImages: hasImages
10120
+ }, /*#__PURE__*/React__default.createElement(HighlightTitleWrapper, null, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
10121
+ size: "large",
10122
+ hierarchy: "h1"
10123
+ }, title), /*#__PURE__*/React__default.createElement(HarmonicOverline, {
10124
+ size: "large"
10125
+ }, subtitle)), text ? (/*#__PURE__*/React__default.createElement(HighlightTextWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, null, /*#__PURE__*/React__default.createElement("span", {
10126
+ dangerouslySetInnerHTML: {
10127
+ __html: text
10128
+ }
10129
+ })))) : null), hasImages && (/*#__PURE__*/React__default.createElement(HighlightsCarouselWrapper, {
10130
+ hasMultipleImages: hasMultipleImages
10131
+ }, hasMultipleImages && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$1, {
10132
+ "data-testid": "rotator-buttons"
10133
+ }, /*#__PURE__*/React__default.createElement(RotatorButtons, {
10134
+ onClickNext: onNext,
10135
+ onClickPrev: onPrev
10136
+ }))), /*#__PURE__*/React__default.createElement(Swipe, {
10137
+ infinite: hasMultipleImages,
10138
+ ref: swipeRef
10139
+ }, headerImages.map(function (image, index) {
10140
+ return /*#__PURE__*/React__default.createElement("div", {
10141
+ key: "carousel-image-" + index
10142
+ }, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
10143
+ aspectRatio: exports.AspectRatio['4:3']
10144
+ }, /*#__PURE__*/React__default.createElement("img", {
10145
+ src: image.src,
10146
+ alt: image.alt
10147
+ })));
10148
+ }))))));
10149
+ };
10150
+
10151
+ var _templateObject$17, _templateObject2$S, _templateObject3$G, _templateObject5$t, _templateObject6$m, _templateObject7$i, _templateObject8$d;
10127
10152
  var linkButtonStyles = /*#__PURE__*/styled.css(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n background: none;\n border: none;\n color: inherit;\n text-decoration: none;\n cursor: pointer;\n font: inherit;\n padding: 0;\n\n span {\n height: 1.5em;\n width: 1.5em;\n\n svg > path {\n fill: var(--color-base-black);\n }\n }\n\n &:hover {\n outline: none;\n }\n"])));
10128
10153
  var PageNav = /*#__PURE__*/styled__default.a(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
10129
10154
  var PaginationLink = /*#__PURE__*/styled__default.a(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
10130
- var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n min-width: fit-content;\n align-items: center;\n justify-content: center;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: 0 auto;\n\n li {\n margin-left: 24px;\n color: var(--color-base-black);\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n\n li:first-child {\n margin-left: 0px;\n }\n"])));
10131
- var LastPageItem = /*#__PURE__*/styled__default.li(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
10132
- var PreviousPageItem = /*#__PURE__*/styled__default.li(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
10155
+ var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n min-width: fit-content;\n align-items: center;\n justify-content: center;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: 0 auto;\n\n li {\n margin-left: 24px;\n color: var(--color-base-black);\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n\n li:first-child {\n margin-left: 0px;\n }\n"])));
10156
+ var LastPageItem = /*#__PURE__*/styled__default.li(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
10157
+ var PreviousPageItem = /*#__PURE__*/styled__default.li(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
10133
10158
  var TextLinkPagination = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject8$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: ", ";\n border-bottom: ", ";\n }\n\n :hover {\n cursor: pointer;\n color: var(--color-primary-red);\n border-bottom: 1px solid var(--color-primary-red);\n svg > path {\n fill: var(--color-base-black);\n }\n }\n"])), function (_ref) {
10134
10159
  var active = _ref.active;
10135
10160
  return active ? "var(--color-primary-red)" : 'inherit';
@@ -10282,14 +10307,14 @@ var Pagination = function Pagination(_ref) {
10282
10307
  }))))));
10283
10308
  };
10284
10309
 
10285
- var _templateObject$18, _templateObject2$T, _templateObject3$H, _templateObject4$z, _templateObject5$t, _templateObject6$m, _templateObject7$i;
10310
+ var _templateObject$18, _templateObject2$T, _templateObject3$H, _templateObject4$z, _templateObject5$u, _templateObject6$n, _templateObject7$j;
10286
10311
  var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n p {\n margin: 0;\n }\n\n grid-template-columns: 1fr 1fr 1fr;\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n"])), devices.mobile, devices.tablet, devices.largeDesktop);
10287
10312
  var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
10288
10313
  var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
10289
10314
  var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
10290
- var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
10291
- var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
10292
- var ReplacementWrapper = /*#__PURE__*/styled__default.span(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n"])));
10315
+ var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
10316
+ var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
10317
+ var ReplacementWrapper = /*#__PURE__*/styled__default.span(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n"])));
10293
10318
 
10294
10319
  var Person = function Person(_ref) {
10295
10320
  var person = _ref.person,
@@ -10480,7 +10505,7 @@ var CreditListing = function CreditListing(_ref) {
10480
10505
  }, creditEntries);
10481
10506
  };
10482
10507
 
10483
- var _templateObject$1a, _templateObject3$J, _templateObject4$B, _templateObject5$u, _templateObject6$n, _templateObject7$j, _templateObject8$e, _templateObject9$9, _templateObject0$8, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16;
10508
+ var _templateObject$1a, _templateObject3$J, _templateObject4$B, _templateObject5$v, _templateObject6$o, _templateObject7$k, _templateObject8$e, _templateObject9$9, _templateObject0$8, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16;
10484
10509
  var LENGTH_TEXT = 28;
10485
10510
  var LENGTH_TEXT_TABLET$1 = 12;
10486
10511
  var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
@@ -10528,9 +10553,9 @@ var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
10528
10553
  var mobileMarginBottom = _ref8.mobileMarginBottom;
10529
10554
  return mobileMarginBottom && "\n @media " + devices.mobile + " {\n margin-bottom: " + mobileMarginBottom + "px;\n }\n ";
10530
10555
  });
10531
- var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
10532
- var TextLinkWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
10533
- var ExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
10556
+ var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
10557
+ var TextLinkWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
10558
+ var ExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
10534
10559
  var IconWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n position: absolute;\n top: 25px;\n right: 35px;\n width: 24px;\n height: 24px;\n\n @media ", " {\n top: 30px;\n right: 30px;\n }\n\n @media ", " {\n top: 3px;\n right: 20px;\n }\n"])), devices.tablet, devices.mobile);
10535
10560
  var PrimaryButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--button-height);\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
10536
10561
  var MobileTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject0$8 || (_templateObject0$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n margin: 0 50px 0 20px;\n\n h2,\n h3 {\n margin: 0;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
@@ -10735,7 +10760,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
10735
10760
  }))));
10736
10761
  };
10737
10762
 
10738
- var _templateObject$1b, _templateObject2$V, _templateObject3$K, _templateObject4$C, _templateObject5$v, _templateObject6$o, _templateObject7$k;
10763
+ var _templateObject$1b, _templateObject2$V, _templateObject3$K, _templateObject4$C, _templateObject5$w, _templateObject6$p, _templateObject7$l;
10739
10764
  var LENGTH_TEXT$2 = 28;
10740
10765
  var LENGTH_TEXT_TABLET$2 = 10;
10741
10766
  var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n grid-template-areas: ", ";\n }\n }\n\n @media ", " {\n & {\n grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n grid-template-rows: min-content 24px min-content;\n gap: 0;\n grid-template-areas:\n 'row1 row1 row1'\n '. . .'\n '. row2 .';\n }\n }\n"])), function (_ref) {
@@ -10754,9 +10779,9 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObj
10754
10779
  return imageToLeft ? 'right' : 'left';
10755
10780
  }, devices.mobile);
10756
10781
  var HarmonicHeaderWithWrapper$1 = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 32px;\n\n @media ", " {\n padding-bottom: 24px;\n }\n"])), devices.mobile);
10757
- var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
10758
- var BodyCopyHarmonicWithWrapper$2 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n margin-bottom: 32px;\n whiete-space: break-spaces;\n overflow-wrap: break-word;\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n @media ", " {\n margin-bottom: 24px;\n }\n"])), devices.mobile);
10759
- var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 32px;\n\n ", "\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref5) {
10782
+ var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
10783
+ var BodyCopyHarmonicWithWrapper$2 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n margin-bottom: 32px;\n whiete-space: break-spaces;\n overflow-wrap: break-word;\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n @media ", " {\n margin-bottom: 24px;\n }\n"])), devices.mobile);
10784
+ var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 32px;\n\n ", "\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref5) {
10760
10785
  var _ref5$primaryButtonTe = _ref5.primaryButtonTextLength,
10761
10786
  primaryButtonTextLength = _ref5$primaryButtonTe === void 0 ? 0 : _ref5$primaryButtonTe,
10762
10787
  _ref5$tertiaryButtonT = _ref5.tertiaryButtonTextLength,
@@ -11111,7 +11136,7 @@ var SectionTitle = function SectionTitle(_ref) {
11111
11136
  }, description)))));
11112
11137
  };
11113
11138
 
11114
- var _templateObject$1g, _templateObject2$Y, _templateObject3$N, _templateObject4$D, _templateObject5$w, _templateObject6$p, _templateObject7$l, _templateObject8$f, _templateObject9$a, _templateObject0$9, _templateObject1$5;
11139
+ var _templateObject$1g, _templateObject2$Y, _templateObject3$N, _templateObject4$D, _templateObject5$x, _templateObject6$q, _templateObject7$m, _templateObject8$f, _templateObject9$a, _templateObject0$9, _templateObject1$5;
11115
11140
  var stateStyles = /*#__PURE__*/styled.css(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &:focus,\n &.focus {\n outline: ", ";\n }\n\n &.disabled {\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n cursor: none;\n }\n"])), function (_ref) {
11116
11141
  var theme = _ref.theme;
11117
11142
  return "3px solid " + theme.colors.lapisLazuli;
@@ -11135,9 +11160,9 @@ var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
11135
11160
  color: theme.colors.black,
11136
11161
  title: 'Select Arrow'
11137
11162
  };
11138
- })(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n pointer-events: none;\n\n max-width: 24px;\n max-height: 24px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n"])));
11139
- var Wrapper$7 = /*#__PURE__*/styled__default.div(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
11140
- var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
11163
+ })(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n pointer-events: none;\n\n max-width: 24px;\n max-height: 24px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n"])));
11164
+ var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
11165
+ var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
11141
11166
  var Options = /*#__PURE__*/styled__default.div(_templateObject8$f || (_templateObject8$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
11142
11167
  var Option = /*#__PURE__*/styled__default.li(_templateObject9$a || (_templateObject9$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
11143
11168
  var theme = _ref6.theme,
@@ -11445,7 +11470,7 @@ function Select(_ref3) {
11445
11470
  }
11446
11471
  setSelectedValue(options[0]);
11447
11472
  }, [options, resetWhenOptionsUpdate]);
11448
- return /*#__PURE__*/React__default.createElement(Wrapper$7, null, label !== '' && (/*#__PURE__*/React__default.createElement(BodyText, {
11473
+ return /*#__PURE__*/React__default.createElement(Wrapper$6, null, label !== '' && (/*#__PURE__*/React__default.createElement(BodyText, {
11449
11474
  level: 1,
11450
11475
  tag: "p",
11451
11476
  "data-testid": "select-label"
@@ -11631,7 +11656,7 @@ var SelectComponent$1 = function SelectComponent(_ref) {
11631
11656
  };
11632
11657
 
11633
11658
  var _templateObject$1i, _templateObject2$_;
11634
- var Wrapper$8 = /*#__PURE__*/styled__default.figure(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n margin: 0;\n\n ", " {\n height: calc(100% - 34px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n\n @media ", " {\n height: calc(100% - 30px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
11659
+ var Wrapper$7 = /*#__PURE__*/styled__default.figure(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n margin: 0;\n\n ", " {\n height: calc(100% - 34px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n\n @media ", " {\n height: calc(100% - 30px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
11635
11660
  var _ref$aspectRatio = _ref.aspectRatio,
11636
11661
  aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
11637
11662
  return aspectRatio;
@@ -11719,7 +11744,7 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
11719
11744
  };
11720
11745
  return /*#__PURE__*/React__default.cloneElement(childElement, newProps);
11721
11746
  });
11722
- return /*#__PURE__*/React__default.createElement(Wrapper$8, {
11747
+ return /*#__PURE__*/React__default.createElement(Wrapper$7, {
11723
11748
  aspectRatio: aspectRatio,
11724
11749
  ref: wrapperRef,
11725
11750
  height: height
@@ -11730,13 +11755,13 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
11730
11755
  }, caption));
11731
11756
  };
11732
11757
 
11733
- var _templateObject$1j, _templateObject2$$, _templateObject3$P, _templateObject4$F, _templateObject5$x, _templateObject6$q;
11758
+ var _templateObject$1j, _templateObject2$$, _templateObject3$P, _templateObject4$F, _templateObject5$y, _templateObject6$r;
11734
11759
  var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n width: 100%;\n display: grid;\n grid-template-columns: repeat(7, minmax(0, 1fr));\n gap: 15px;\n min-height: 50px;\n"])));
11735
11760
  var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
11736
11761
  var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
11737
11762
  var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
11738
- var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
11739
- var TitleWrapper$5 = /*#__PURE__*/styled__default.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
11763
+ var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
11764
+ var TitleWrapper$5 = /*#__PURE__*/styled__default.div(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
11740
11765
 
11741
11766
  var MiniCard = function MiniCard(_ref) {
11742
11767
  var _ref$title = _ref.title,
@@ -11774,7 +11799,7 @@ var MiniCard = function MiniCard(_ref) {
11774
11799
  }, title)))));
11775
11800
  };
11776
11801
 
11777
- var _templateObject$1k, _templateObject2$10, _templateObject3$Q, _templateObject4$G, _templateObject5$y;
11802
+ var _templateObject$1k, _templateObject2$10, _templateObject3$Q, _templateObject4$G, _templateObject5$z;
11778
11803
  var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0px 0px 12px 0px !important;\n }\n width: 100%;\n"])));
11779
11804
  var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n\n @media print {\n visibility: hidden;\n }\n"])));
11780
11805
  var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
@@ -11785,7 +11810,7 @@ var IntroTextContainer = /*#__PURE__*/styled__default.div(_templateObject4$G ||
11785
11810
  var isVisible = _ref2.isVisible;
11786
11811
  return isVisible ? 'visible' : 'hidden';
11787
11812
  });
11788
- var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
11813
+ var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
11789
11814
 
11790
11815
  var keyDown = function keyDown(e, toggleFunction) {
11791
11816
  if (e.key === 'Enter' || e.key === 'Space') {
@@ -11866,7 +11891,7 @@ var ReadMore = function ReadMore(_ref) {
11866
11891
  }, isFullTextOpen ? "" + hideText : "" + showMoreText))));
11867
11892
  };
11868
11893
 
11869
- var _templateObject$1l, _templateObject2$11, _templateObject3$R, _templateObject4$H, _templateObject5$z;
11894
+ var _templateObject$1l, _templateObject2$11, _templateObject3$R, _templateObject4$H, _templateObject5$A;
11870
11895
  var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
11871
11896
  var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n }\n"])), exports.Colors.LightGrey);
11872
11897
  var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 46px 14px 20px;\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n cursor: pointer;\n position: relative;\n span {\n width: 25px;\n height: 25px;\n position: absolute;\n top: 50%;\n margin-top: -12px;\n right: 10px;\n }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey);
@@ -11874,7 +11899,7 @@ var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$H || (_template
11874
11899
  var isActive = _ref.isActive;
11875
11900
  return isActive ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
11876
11901
  }, exports.Colors.MidGrey);
11877
- var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
11902
+ var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
11878
11903
  var isOpen = _ref2.isOpen;
11879
11904
  return isOpen ? 'block' : 'none';
11880
11905
  }, exports.Colors.White, exports.Colors.DarkGrey, MenuItem$1);
@@ -12030,7 +12055,7 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
12030
12055
  });
12031
12056
  };
12032
12057
 
12033
- var _templateObject$1m, _templateObject2$12, _templateObject3$S, _templateObject4$I, _templateObject5$A, _templateObject6$r;
12058
+ var _templateObject$1m, _templateObject2$12, _templateObject3$S, _templateObject4$I, _templateObject5$B, _templateObject6$s;
12034
12059
  var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
12035
12060
  var Sections = /*#__PURE__*/styled__default.div(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
12036
12061
  var Section = /*#__PURE__*/styled__default.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
@@ -12038,11 +12063,11 @@ var Section = /*#__PURE__*/styled__default.div(_templateObject3$S || (_templateO
12038
12063
  return "var(--base-color-" + color + ")";
12039
12064
  });
12040
12065
  var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
12041
- var Text = /*#__PURE__*/styled__default.div(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
12066
+ var Text = /*#__PURE__*/styled__default.div(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
12042
12067
  var color = _ref2.color;
12043
12068
  return "var(--base-color-" + color + ")";
12044
12069
  });
12045
- var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
12070
+ var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
12046
12071
  var color = _ref3.color;
12047
12072
  return "var(--base-color-" + color + ")";
12048
12073
  });
@@ -12124,18 +12149,18 @@ var PasswordStrength = function PasswordStrength(_ref) {
12124
12149
  }, strengthLabel))));
12125
12150
  };
12126
12151
 
12127
- var _templateObject$1n, _templateObject2$13, _templateObject3$T, _templateObject4$J, _templateObject5$B, _templateObject6$s, _templateObject7$m, _templateObject8$g;
12152
+ var _templateObject$1n, _templateObject2$13, _templateObject3$T, _templateObject4$J, _templateObject5$C, _templateObject6$t, _templateObject7$n, _templateObject8$g;
12128
12153
  var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
12129
12154
  var Container$6 = /*#__PURE__*/styled__default.div(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
12130
- var Wrapper$9 = /*#__PURE__*/styled__default.div(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
12155
+ var Wrapper$8 = /*#__PURE__*/styled__default.div(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
12131
12156
  var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n text-transform: capitalize;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n white-space: nowrap;\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n @media ", " {\n &:last-child {\n white-space: nowrap;\n }\n }\n\n @media ", " {\n min-width: 150px;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
12132
12157
  return "calc(100% / " + (props.columns - 1) + ")";
12133
12158
  }, devices.tablet, devices.mobile);
12134
- var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n vertical-align: middle;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n min-width: 150px;\n }\n"])), function (props) {
12159
+ var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n vertical-align: middle;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n min-width: 150px;\n }\n"])), function (props) {
12135
12160
  return "calc(100% / " + (props.columns - 1) + ")";
12136
12161
  }, devices.mobile);
12137
- var PaginationWrapper = /*#__PURE__*/styled__default(Pagination)(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 40px;\n padding-bottom: 80px;\n\n @media ", " {\n padding-top: 24px;\n padding-bottom: 60px;\n }\n"])), devices.mobile);
12138
- var ScrollButtons = /*#__PURE__*/styled__default.div(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 60px 0 24px 0;\n\n div:hover {\n background-color: var(--color-base-light-grey);\n }\n\n > div > div {\n background-color: var(--color-base-light-grey);\n }\n\n svg path {\n fill: var(--color-base-black) !important;\n }\n"])));
12162
+ var PaginationWrapper = /*#__PURE__*/styled__default(Pagination)(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 40px;\n padding-bottom: 80px;\n\n @media ", " {\n padding-top: 24px;\n padding-bottom: 60px;\n }\n"])), devices.mobile);
12163
+ var ScrollButtons = /*#__PURE__*/styled__default.div(_templateObject7$n || (_templateObject7$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 60px 0 24px 0;\n\n div:hover {\n background-color: var(--color-base-light-grey);\n }\n\n > div > div {\n background-color: var(--color-base-light-grey);\n }\n\n svg path {\n fill: var(--color-base-black) !important;\n }\n"])));
12139
12164
  var AriaDescription$2 = /*#__PURE__*/styled__default.span(_templateObject8$g || (_templateObject8$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
12140
12165
 
12141
12166
  /* eslint-disable react/no-danger */
@@ -12309,7 +12334,7 @@ var Table = function Table(_ref) {
12309
12334
  } else {
12310
12335
  visibleRows = totalRows;
12311
12336
  }
12312
- return /*#__PURE__*/React__default.createElement(Wrapper$9, {
12337
+ return /*#__PURE__*/React__default.createElement(Wrapper$8, {
12313
12338
  className: className
12314
12339
  }, showScrollButtons && (/*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
12315
12340
  onClickPrev: handlePrev,
@@ -12339,8 +12364,8 @@ var Table = function Table(_ref) {
12339
12364
  }))));
12340
12365
  };
12341
12366
 
12342
- var _templateObject$1o, _templateObject2$14, _templateObject3$U, _templateObject4$K, _templateObject5$C, _templateObject6$t, _templateObject7$n, _templateObject8$h, _templateObject9$b, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
12343
- var Wrapper$a = /*#__PURE__*/styled__default('div')(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
12367
+ var _templateObject$1o, _templateObject2$14, _templateObject3$U, _templateObject4$K, _templateObject5$D, _templateObject6$u, _templateObject7$o, _templateObject8$h, _templateObject9$b, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
12368
+ var Wrapper$9 = /*#__PURE__*/styled__default('div')(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
12344
12369
  var theme = _ref.theme;
12345
12370
  return "var(--color-" + theme + ")";
12346
12371
  }, function (_ref2) {
@@ -12350,9 +12375,9 @@ var Wrapper$a = /*#__PURE__*/styled__default('div')(_templateObject$1o || (_temp
12350
12375
  var SignUpFormWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject2$14 || (_templateObject2$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
12351
12376
  var SignUpTitleWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n position: relative;\n top: -25px;\n left: -20px;\n height: 52px;\n background: var(--color-base-white);\n display: inline-block;\n padding: 0 20px;\n\n @media ", " {\n top: -18px;\n height: 37px;\n padding: 0 13px;\n left: -13px;\n }\n"])), devices.mobile);
12352
12377
  var Error = /*#__PURE__*/styled__default.div(_templateObject4$K || (_templateObject4$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
12353
- var Form = /*#__PURE__*/styled__default.form(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n align-items: center;\n ", " {\n margin-top: -20px;\n }\n a[href] {\n color: inherit;\n }\n"])), Error);
12354
- var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n gap: 28px;\n align-items: center;\n\n @media ", " {\n flex-direction: column;\n align-items: flex-start;\n }\n"])), devices.mobile);
12355
- var ServerError = /*#__PURE__*/styled__default.div(_templateObject7$n || (_templateObject7$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
12378
+ var Form = /*#__PURE__*/styled__default.form(_templateObject5$D || (_templateObject5$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n align-items: center;\n ", " {\n margin-top: -20px;\n }\n a[href] {\n color: inherit;\n }\n"])), Error);
12379
+ var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$u || (_templateObject6$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n gap: 28px;\n align-items: center;\n\n @media ", " {\n flex-direction: column;\n align-items: flex-start;\n }\n"])), devices.mobile);
12380
+ var ServerError = /*#__PURE__*/styled__default.div(_templateObject7$o || (_templateObject7$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
12356
12381
  var CTALinkWrapper = /*#__PURE__*/styled__default.a(_templateObject8$h || (_templateObject8$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n @media ", " {\n text-decoration: underline;\n }\n"])), devices.mobile);
12357
12382
  var ButtonWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject9$b || (_templateObject9$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n all: unset;\n width: fit-content;\n color: var(--base-color-white);\n text-decoration: none;\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
12358
12383
  var FieldsWrapper = /*#__PURE__*/styled__default.div(_templateObject0$a || (_templateObject0$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 36px;\n\n @media ", " {\n grid-template-columns: 1fr;\n gap: 20px;\n }\n"])), devices.mobile);
@@ -12699,7 +12724,7 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
12699
12724
  React.useEffect(function () {
12700
12725
  setDropdownOpen(isOpened);
12701
12726
  }, [isOpened]);
12702
- return /*#__PURE__*/React__default.createElement(Wrapper$a, {
12727
+ return /*#__PURE__*/React__default.createElement(Wrapper$9, {
12703
12728
  theme: themeToColor(theme),
12704
12729
  className: className
12705
12730
  }, /*#__PURE__*/React__default.createElement(SignUpFormWrapper, null, isMobile && !isLoggedIn && !isSuccess ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(HiddenInstructions, {
@@ -12764,13 +12789,13 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
12764
12789
  }))))));
12765
12790
  };
12766
12791
 
12767
- var _templateObject$1p, _templateObject2$15, _templateObject4$L, _templateObject5$D;
12792
+ var _templateObject$1p, _templateObject2$15, _templateObject4$L, _templateObject5$E;
12768
12793
  var AnchorBarContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n top: 0;\n min-height: 70px;\n background: var(--color-base-white);\n z-index: ", ";\n align-content: center;\n border-bottom: 1px solid var(--color-base-light-grey);\n\n ", "\n\n @media ", " {\n min-height: 60px;\n }\n"])), zIndexes.anchor, function (_ref) {
12769
12794
  var withShadow = _ref.withShadow;
12770
12795
  return withShadow && styled.css(_templateObject2$15 || (_templateObject2$15 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
12771
12796
  }, devices.mobile);
12772
12797
  var CloseButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject4$L || (_templateObject4$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 24px;\n min-width: 24px;\n max-height: 24px;\n max-width: 24px;\n border: none;\n padding: 0;\n background: none;\n\n :hover {\n cursor: pointer;\n }\n\n @media ", " {\n min-height: 12px;\n min-width: 12px;\n max-height: 12px;\n max-width: 12px;\n }\n"])), devices.mobile);
12773
- var ContentWrapper$3 = /*#__PURE__*/styled__default.a(_templateObject5$D || (_templateObject5$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
12798
+ var ContentWrapper$3 = /*#__PURE__*/styled__default.a(_templateObject5$E || (_templateObject5$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
12774
12799
 
12775
12800
  var AnchorBar = function AnchorBar(_ref) {
12776
12801
  var cta = _ref.cta,
@@ -13855,7 +13880,7 @@ exports.NavigationText = NavigationText;
13855
13880
  exports.Overline = Overline;
13856
13881
  exports.PageHeading = PageHeading;
13857
13882
  exports.PageHeadingCompact = PageHeadingCompact;
13858
- exports.PageHeadingHighlight = PageHeadingHighlight;
13883
+ exports.PageHeadingHighlightCarousel = PageHeadingHighlightCarousel;
13859
13884
  exports.PageHeadingImpact = PageHeadingImpact;
13860
13885
  exports.PageHeadingPanel = PageHeadingPanel;
13861
13886
  exports.PageHeadingPromo = PageHeadingPromo;