@royaloperahouse/harmonic 0.18.6 → 0.18.8-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 (34) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/README.md +267 -43
  3. package/dist/components/atoms/Buttons/Auxiliary/AuxiliaryButton.style.d.ts +9 -1
  4. package/dist/components/atoms/Buttons/Button.d.ts +10 -3
  5. package/dist/components/atoms/Buttons/Primary/PrimaryButton.d.ts +17 -3
  6. package/dist/components/atoms/Buttons/Primary/PrimaryButton.style.d.ts +9 -1
  7. package/dist/components/atoms/Buttons/Secondary/SecondaryButton.style.d.ts +9 -1
  8. package/dist/components/atoms/Dropdown/Dropdown.d.ts +1 -1
  9. package/dist/components/atoms/Tab/Tab.d.ts +1 -1
  10. package/dist/components/atoms/VideoControlsImpact/VideoControlsImpact.d.ts +4 -0
  11. package/dist/components/atoms/VideoControlsImpact/VideoControlsImpact.style.d.ts +5 -0
  12. package/dist/components/atoms/VideoControlsImpact/index.d.ts +2 -0
  13. package/dist/components/molecules/HotFilters/HotFilters.style.d.ts +16 -1
  14. package/dist/components/molecules/PageHeading/Compact/Compact.style.d.ts +16 -1
  15. package/dist/components/molecules/PageHeading/Impact/Impact.style.d.ts +302 -9
  16. package/dist/components/molecules/SkipToMain/SkipToMain.style.d.ts +1 -1
  17. package/dist/components/molecules/Swipe/Swipe.d.ts +1 -0
  18. package/dist/components/organisms/Carousels/Carousel/Carousel.d.ts +3 -1
  19. package/dist/components/organisms/Carousels/HighlightsCarousel/HighlightsCarousel.d.ts +3 -1
  20. package/dist/components/organisms/TitleWithCTA/TitleWithCTA.style.d.ts +16 -1
  21. package/dist/harmonic.cjs.development.css +319 -0
  22. package/dist/harmonic.cjs.development.js +625 -370
  23. package/dist/harmonic.cjs.development.js.map +1 -1
  24. package/dist/harmonic.cjs.production.min.js +1 -1
  25. package/dist/harmonic.cjs.production.min.js.map +1 -1
  26. package/dist/harmonic.esm.js +637 -379
  27. package/dist/harmonic.esm.js.map +1 -1
  28. package/dist/styles/HarmonicThemeProvider/HarmonicThemeProvider.d.ts +1 -0
  29. package/dist/types/impactHeader.d.ts +14 -32
  30. package/dist/types/signUpForm.d.ts +1 -0
  31. package/dist/types/types.d.ts +15 -1
  32. package/dist/types/upsell.d.ts +2 -0
  33. package/package.json +3 -4
  34. package/README.GIT +0 -293
@@ -1,6 +1,6 @@
1
- import React__default, { createElement, memo, useCallback, useRef, useImperativeHandle, useMemo, useEffect, useState, forwardRef, cloneElement, useLayoutEffect } from 'react';
1
+ import React__default, { createElement, memo, forwardRef, useCallback, useRef, useImperativeHandle, useMemo, useEffect, useState, cloneElement, useLayoutEffect } from 'react';
2
2
  import styled, { css, ThemeProvider, createGlobalStyle } from 'styled-components';
3
- import moment from 'moment';
3
+ import { isPast, intervalToDuration, differenceInDays } from 'date-fns';
4
4
  import { renderToString } from 'react-dom/server';
5
5
  import Select$1, { components } from 'react-select';
6
6
  import Select$2 from 'react-select/async';
@@ -237,7 +237,8 @@ var HarmonicHeader = function HarmonicHeader(_ref2) {
237
237
  em = _ref2.em,
238
238
  _ref2$color = _ref2.color,
239
239
  color = _ref2$color === void 0 ? 'inherit' : _ref2$color,
240
- serif = _ref2.serif,
240
+ _ref2$serif = _ref2.serif,
241
+ serif = _ref2$serif === void 0 ? false : _ref2$serif,
241
242
  hierarchy = _ref2.hierarchy,
242
243
  tag = _ref2.tag,
243
244
  className = _ref2.className,
@@ -2649,7 +2650,7 @@ var Icon = /*#__PURE__*/memo(function (props) {
2649
2650
  Icon.displayName = 'Icon';
2650
2651
 
2651
2652
  var _excluded$2 = ["children", "iconName", "iconDirection", "iconClassName", "color", "className", "href", "onClick"];
2652
- var Button = function Button(_ref) {
2653
+ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
2653
2654
  var children = _ref.children,
2654
2655
  iconName = _ref.iconName,
2655
2656
  iconDirection = _ref.iconDirection,
@@ -2659,7 +2660,7 @@ var Button = function Button(_ref) {
2659
2660
  href = _ref.href,
2660
2661
  onClick = _ref.onClick,
2661
2662
  rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
2662
- var truncatedString = children.substring(0, 30);
2663
+ var truncatedString = children == null ? void 0 : children.substring(0, 30);
2663
2664
  var handleClick = useCallback(function (e) {
2664
2665
  if (!href) e.preventDefault();
2665
2666
  onClick == null || onClick(e);
@@ -2671,7 +2672,8 @@ var Button = function Button(_ref) {
2671
2672
  href: href != null ? href : '#',
2672
2673
  onClick: handleClick,
2673
2674
  iconName: iconName,
2674
- className: className
2675
+ className: className,
2676
+ ref: ref
2675
2677
  }), iconName ? (/*#__PURE__*/React__default.createElement(ButtonIconWrapper, {
2676
2678
  "data-testid": "button-icon",
2677
2679
  className: iconClassName
@@ -2682,7 +2684,8 @@ var Button = function Button(_ref) {
2682
2684
  }))) : null, /*#__PURE__*/React__default.createElement(ButtonText, {
2683
2685
  color: "inherit"
2684
2686
  }, truncatedString));
2685
- };
2687
+ });
2688
+ Button.displayName = 'Button';
2686
2689
 
2687
2690
  var getPointerEvents = function getPointerEvents(_ref) {
2688
2691
  var disabled = _ref.disabled;
@@ -2747,7 +2750,7 @@ var PrimaryButtonWrapper = /*#__PURE__*/styled(Button)(_templateObject$3 || (_te
2747
2750
  var AriaDescription = /*#__PURE__*/styled.span(_templateObject2$1 || (_templateObject2$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
2748
2751
 
2749
2752
  var _excluded$3 = ["children", "disabled", "className"];
2750
- var PrimaryButton = function PrimaryButton(_ref) {
2753
+ var PrimaryButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
2751
2754
  var children = _ref.children,
2752
2755
  disabled = _ref.disabled,
2753
2756
  className = _ref.className,
@@ -2762,6 +2765,7 @@ var PrimaryButton = function PrimaryButton(_ref) {
2762
2765
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(AriaDescription, {
2763
2766
  id: disabledButtonDescriptionId
2764
2767
  }, disabledButtonDescription), /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({
2768
+ ref: ref,
2765
2769
  disabled: true,
2766
2770
  "aria-disabled": "true",
2767
2771
  role: "button",
@@ -2771,10 +2775,13 @@ var PrimaryButton = function PrimaryButton(_ref) {
2771
2775
  onClick: handleClick
2772
2776
  }), children));
2773
2777
  }
2774
- return /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({}, props, {
2778
+ return /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({
2779
+ ref: ref
2780
+ }, props, {
2775
2781
  className: className
2776
2782
  }), children);
2777
- };
2783
+ });
2784
+ PrimaryButton.displayName = 'PrimaryButton';
2778
2785
 
2779
2786
  var COLORS$1 = {
2780
2787
  disabled: 'var(--color-state-disabled)',
@@ -3670,6 +3677,9 @@ var RotatorButtons = function RotatorButtons(_ref) {
3670
3677
  isTablet = _useViewport.isTablet,
3671
3678
  hydrated = _useViewport.hydrated;
3672
3679
  if (!hydrated) return null;
3680
+ var preventMouseFocus = function preventMouseFocus(e) {
3681
+ e.preventDefault();
3682
+ };
3673
3683
  var onClickLeftHandler = function onClickLeftHandler() {
3674
3684
  if (onClickPrev) {
3675
3685
  onClickPrev();
@@ -3722,6 +3732,7 @@ var RotatorButtons = function RotatorButtons(_ref) {
3722
3732
  className: className
3723
3733
  }, availablePrev ? (/*#__PURE__*/React__default.createElement(IconWrapper$1, {
3724
3734
  size: size,
3735
+ onMouseDown: preventMouseFocus,
3725
3736
  onClick: onClickLeftHandler,
3726
3737
  onKeyDown: onPrevKeyDownHandler,
3727
3738
  tabIndex: 0,
@@ -3731,9 +3742,12 @@ var RotatorButtons = function RotatorButtons(_ref) {
3731
3742
  role: "button"
3732
3743
  }, renderPrevIcon())) : (/*#__PURE__*/React__default.createElement(IconUnavailableWrapper, {
3733
3744
  size: size,
3734
- "data-testid": "iconprevnoavailable"
3745
+ onMouseDown: preventMouseFocus,
3746
+ "data-testid": "iconprevnoavailable",
3747
+ "aria-hidden": "true"
3735
3748
  }, renderPrevIcon())), availableNext ? (/*#__PURE__*/React__default.createElement(IconWrapper$1, {
3736
3749
  size: size,
3750
+ onMouseDown: preventMouseFocus,
3737
3751
  onClick: onClickRightHandler,
3738
3752
  onKeyDown: onNextKeyDownHandler,
3739
3753
  tabIndex: 0,
@@ -3743,9 +3757,12 @@ var RotatorButtons = function RotatorButtons(_ref) {
3743
3757
  role: "button"
3744
3758
  }, renderNextIcon())) : (/*#__PURE__*/React__default.createElement(IconUnavailableWrapper, {
3745
3759
  size: size,
3746
- "data-testid": "iconnextnoavailable"
3760
+ onMouseDown: preventMouseFocus,
3761
+ "data-testid": "iconnextnoavailable",
3762
+ "aria-hidden": "true"
3747
3763
  }, renderNextIcon())), showFullscreen && !isMobile && !isTablet && (/*#__PURE__*/React__default.createElement(FullscreenIconWrapper, {
3748
3764
  size: size,
3765
+ onMouseDown: preventMouseFocus,
3749
3766
  onClick: onClickFullscreenHandler,
3750
3767
  onKeyDown: onFullscreenKeyDownHandler,
3751
3768
  tabIndex: 0,
@@ -3923,6 +3940,7 @@ var Tab = function Tab(_ref) {
3923
3940
  className = _ref.className,
3924
3941
  role = _ref.role,
3925
3942
  ariaLabel = _ref.ariaLabel,
3943
+ tabLinkId = _ref.tabLinkId,
3926
3944
  color = _ref.color,
3927
3945
  dataTestId = _ref.dataTestId,
3928
3946
  isOpen = _ref.isOpen;
@@ -3957,8 +3975,9 @@ var Tab = function Tab(_ref) {
3957
3975
  className: className,
3958
3976
  "data-testid": dataTestId
3959
3977
  }, /*#__PURE__*/React__default.createElement(TabText, {
3960
- color: color,
3978
+ id: tabLinkId,
3961
3979
  trimText: trimText,
3980
+ color: color,
3962
3981
  withTextInMobile: withTextInMobile,
3963
3982
  "aria-hidden": "true"
3964
3983
  }, title), withIcon !== 'none' && /*#__PURE__*/React__default.createElement(Icon, {
@@ -4646,6 +4665,31 @@ var TimerValueSeparator = /*#__PURE__*/styled.div(_templateObject6$3 || (_templa
4646
4665
  var TimerValueWrapper = /*#__PURE__*/styled.div(_templateObject7$1 || (_templateObject7$1 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
4647
4666
  var TimerValue = /*#__PURE__*/styled.div(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
4648
4667
 
4668
+ var pad = function pad(num) {
4669
+ return String(num || 0).padStart(2, '0');
4670
+ };
4671
+ var renderTimerValue = function renderTimerValue(value, label, separator) {
4672
+ if (separator === void 0) {
4673
+ separator = true;
4674
+ }
4675
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(TimerValueWrapper, null, /*#__PURE__*/React__default.createElement(TimerValue, {
4676
+ className: "harmonic-timer-value"
4677
+ }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
4678
+ color: "inherit",
4679
+ hierarchy: "h3",
4680
+ size: "medium",
4681
+ "data-testid": label
4682
+ }, value)), /*#__PURE__*/React__default.createElement(TimerLabel, {
4683
+ className: "harmonic-timer-label"
4684
+ }, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
4685
+ color: "inherit",
4686
+ size: "large"
4687
+ }, label))), separator && (/*#__PURE__*/React__default.createElement(HarmonicHeader, {
4688
+ color: "inherit",
4689
+ hierarchy: "h3",
4690
+ size: "medium"
4691
+ }, /*#__PURE__*/React__default.createElement(TimerValueSeparator, null, ":"))));
4692
+ };
4649
4693
  var Timer = function Timer(_ref) {
4650
4694
  var endDate = _ref.endDate,
4651
4695
  title = _ref.title,
@@ -4654,43 +4698,22 @@ var Timer = function Timer(_ref) {
4654
4698
  bottomLine = _ref$bottomLine === void 0 ? true : _ref$bottomLine,
4655
4699
  _ref$color = _ref.color,
4656
4700
  color = _ref$color === void 0 ? ThemeColor['base-black'] : _ref$color;
4657
- var _React$useState = React__default.useState('00'),
4658
- seconds = _React$useState[0],
4659
- setSeconds = _React$useState[1];
4660
- var _React$useState2 = React__default.useState('00'),
4661
- minutes = _React$useState2[0],
4662
- setMinutes = _React$useState2[1];
4663
- var _React$useState3 = React__default.useState('00'),
4664
- hours = _React$useState3[0],
4665
- setHours = _React$useState3[1];
4666
- var _React$useState4 = React__default.useState('00'),
4667
- days = _React$useState4[0],
4668
- setDays = _React$useState4[1];
4669
- var _React$useState5 = React__default.useState(false),
4670
- isEndDateReached = _React$useState5[0],
4671
- setIsEndDateReached = _React$useState5[1];
4672
- var renderTimerValue = function renderTimerValue(value, label, separator) {
4673
- if (separator === void 0) {
4674
- separator = true;
4675
- }
4676
- return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(TimerValueWrapper, null, /*#__PURE__*/React__default.createElement(TimerValue, {
4677
- className: "harmonic-timer-value"
4678
- }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
4679
- color: "inherit",
4680
- hierarchy: "h3",
4681
- size: "medium"
4682
- }, value)), /*#__PURE__*/React__default.createElement(TimerLabel, {
4683
- className: "harmonic-timer-label"
4684
- }, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
4685
- color: "inherit",
4686
- size: "large"
4687
- }, label))), separator && (/*#__PURE__*/React__default.createElement(HarmonicHeader, {
4688
- color: "inherit",
4689
- hierarchy: "h3",
4690
- size: "medium"
4691
- }, /*#__PURE__*/React__default.createElement(TimerValueSeparator, null, ":"))));
4692
- };
4693
- React__default.useEffect(function () {
4701
+ var _useState = useState('00'),
4702
+ seconds = _useState[0],
4703
+ setSeconds = _useState[1];
4704
+ var _useState2 = useState('00'),
4705
+ minutes = _useState2[0],
4706
+ setMinutes = _useState2[1];
4707
+ var _useState3 = useState('00'),
4708
+ hours = _useState3[0],
4709
+ setHours = _useState3[1];
4710
+ var _useState4 = useState('00'),
4711
+ days = _useState4[0],
4712
+ setDays = _useState4[1];
4713
+ var _useState5 = useState(false),
4714
+ isEndDateReached = _useState5[0],
4715
+ setIsEndDateReached = _useState5[1];
4716
+ useEffect(function () {
4694
4717
  if (isEndDateReached) return undefined;
4695
4718
  // We use this to set values for the timer immediately
4696
4719
  var setIntervalAndExecute = function setIntervalAndExecute(fn, delay) {
@@ -4698,19 +4721,21 @@ var Timer = function Timer(_ref) {
4698
4721
  return setInterval(fn, delay);
4699
4722
  };
4700
4723
  var updateValues = function updateValues() {
4701
- var futureDate = moment(endDate);
4702
- var nowDate = moment();
4703
- var differenceInMilliseconds = futureDate.valueOf() - nowDate.valueOf();
4704
- var difference = moment(differenceInMilliseconds).utc();
4705
- if (differenceInMilliseconds < 0) {
4724
+ var futureDate = new Date(endDate);
4725
+ var nowDate = new Date();
4726
+ var diffInMs = futureDate.getTime() - nowDate.getTime();
4727
+ if (diffInMs < 0) {
4706
4728
  setIsEndDateReached(true);
4707
4729
  if (endDateHandler) endDateHandler();
4708
4730
  } else {
4709
- var fullDaysLeft = Math.floor(futureDate.diff(nowDate, 'days', true));
4710
- var daysDiff = fullDaysLeft < 10 ? "0" + fullDaysLeft : fullDaysLeft.toString();
4711
- var hoursDiff = difference.format('HH');
4712
- var minutesDiff = difference.format('mm');
4713
- var secondsDiff = difference.format('ss');
4731
+ var duration = intervalToDuration({
4732
+ start: nowDate,
4733
+ end: futureDate
4734
+ });
4735
+ var daysDiff = pad(differenceInDays(futureDate, nowDate));
4736
+ var hoursDiff = pad(duration.hours);
4737
+ var minutesDiff = pad(duration.minutes);
4738
+ var secondsDiff = pad(duration.seconds);
4714
4739
  setDays(daysDiff);
4715
4740
  setHours(hoursDiff);
4716
4741
  setMinutes(minutesDiff);
@@ -4722,7 +4747,7 @@ var Timer = function Timer(_ref) {
4722
4747
  clearInterval(interval);
4723
4748
  };
4724
4749
  });
4725
- var hideTimer = moment(endDate).isBefore(moment());
4750
+ var hideTimer = isPast(new Date(endDate));
4726
4751
  if (hideTimer) return null;
4727
4752
  return /*#__PURE__*/React__default.createElement(TimerWrapper, {
4728
4753
  color: color
@@ -5440,6 +5465,7 @@ var Dropdown = function Dropdown(_ref) {
5440
5465
  className = _ref.className,
5441
5466
  role = _ref.role,
5442
5467
  ariaLabel = _ref.ariaLabel,
5468
+ tabLinkId = _ref.tabLinkId,
5443
5469
  trimTabText = _ref.trimTabText;
5444
5470
  var node = useRef();
5445
5471
  var _useState = useState(false),
@@ -5536,6 +5562,7 @@ var Dropdown = function Dropdown(_ref) {
5536
5562
  };
5537
5563
  var renderTab = function renderTab() {
5538
5564
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Tab, {
5565
+ tabLinkId: tabLinkId,
5539
5566
  trimText: trimTabText,
5540
5567
  title: title,
5541
5568
  titleLink: titleLink,
@@ -5615,7 +5642,8 @@ var Account = function Account(_ref) {
5615
5642
  iconName: iconName,
5616
5643
  withOptionsInMobile: false,
5617
5644
  withIcon: "left",
5618
- className: className
5645
+ className: className,
5646
+ tabLinkId: "account-link"
5619
5647
  });
5620
5648
  };
5621
5649
 
@@ -5937,7 +5965,7 @@ var SearchBar = function SearchBar(_ref) {
5937
5965
  };
5938
5966
 
5939
5967
  var _templateObject$D, _templateObject2$t, _templateObject3$j, _templateObject4$g, _templateObject5$c, _templateObject6$8, _templateObject7$5;
5940
- var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n div {\n overflow: hidden;\n }\n border-top: 2px solid var(--color-base-light-grey);\n border-bottom: ", ";\n"])), function (_ref) {
5968
+ var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n border-top: 2px solid var(--color-base-light-grey);\n border-bottom: ", ";\n"])), function (_ref) {
5941
5969
  var showLine = _ref.showLine;
5942
5970
  return showLine ? '2px solid var(--color-base-light-grey)' : 'none';
5943
5971
  });
@@ -5961,13 +5989,31 @@ var ContentContainer = /*#__PURE__*/styled(ExtendedBodyCopyHarmonic).withConfig(
5961
5989
  shouldForwardProp: function shouldForwardProp(prop) {
5962
5990
  return prop !== 'textHeight';
5963
5991
  }
5964
- })(_templateObject6$8 || (_templateObject6$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-height: ", ";\n\n @media print {\n max-height: max-content;\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\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), function (_ref6) {
5992
+ })(_templateObject6$8 || (_templateObject6$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-height: ", ";\n overflow: ", ";\n margin-bottom: ", ";\n\n @media print {\n max-height: max-content;\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\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), function (_ref6) {
5965
5993
  var textHeight = _ref6.textHeight;
5966
5994
  return textHeight;
5995
+ }, function (_ref7) {
5996
+ var textHeight = _ref7.textHeight;
5997
+ return textHeight === '0px' ? 'hidden' : 'visible';
5998
+ }, function (_ref8) {
5999
+ var textHeight = _ref8.textHeight;
6000
+ return textHeight === '0px' ? '0px' : '12px';
5967
6001
  }, devices.mobile);
5968
6002
  var PrintHideWrapper = /*#__PURE__*/styled.div(_templateObject7$5 || (_templateObject7$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media print {\n display: none;\n }\n"])));
5969
6003
 
5970
6004
  /* eslint-disable react/no-unstable-nested-components */
6005
+ /** In-flow height only so absolutely positioned UI (e.g. react-select menu) does not inflate scrollHeight. */
6006
+ function getPanelContentHeight(panel) {
6007
+ var inner = panel.firstElementChild;
6008
+ if (!inner || !(inner instanceof HTMLElement)) {
6009
+ return panel.scrollHeight;
6010
+ }
6011
+ var innerStyle = window.getComputedStyle(inner);
6012
+ var marginY = (parseFloat(innerStyle.marginTop) || 0) + (parseFloat(innerStyle.marginBottom) || 0);
6013
+ var panelStyle = window.getComputedStyle(panel);
6014
+ var paddingY = (parseFloat(panelStyle.paddingTop) || 0) + (parseFloat(panelStyle.paddingBottom) || 0);
6015
+ return inner.offsetHeight + marginY + paddingY;
6016
+ }
5971
6017
  var Accordion = function Accordion(_ref) {
5972
6018
  var _expandedStateIcon$ic, _collapsedStateIcon$i;
5973
6019
  var _ref$title = _ref.title,
@@ -6008,7 +6054,7 @@ var Accordion = function Accordion(_ref) {
6008
6054
  var intervalRef = useRef(null);
6009
6055
  useEffect(function () {
6010
6056
  if (content.current && initOpen) {
6011
- setTextHeight(content.current.scrollHeight + "px");
6057
+ setTextHeight(getPanelContentHeight(content.current) + "px");
6012
6058
  }
6013
6059
  }, [initOpen]);
6014
6060
  useEffect(function () {
@@ -6034,7 +6080,7 @@ var Accordion = function Accordion(_ref) {
6034
6080
  return cleanup;
6035
6081
  }
6036
6082
  var updateHeight = function updateHeight() {
6037
- setTextHeight(el.scrollHeight + "px");
6083
+ setTextHeight(getPanelContentHeight(el) + "px");
6038
6084
  };
6039
6085
  rafRef.current = window.requestAnimationFrame(updateHeight);
6040
6086
  if (typeof ResizeObserver !== 'undefined') {
@@ -6090,6 +6136,7 @@ var Accordion = function Accordion(_ref) {
6090
6136
  var toggleAccordion = function toggleAccordion() {
6091
6137
  if (React__default.Children.count(children) === 0) return;
6092
6138
  if (openAccordion) {
6139
+ setIcon(collapsedStateIconData);
6093
6140
  setOpenAccordion(false);
6094
6141
  setTextHeight('0px');
6095
6142
  setIcon(collapsedStateIconData);
@@ -6624,7 +6671,7 @@ var CastFiltersComponentWrapper = /*#__PURE__*/styled.div(_templateObject$J || (
6624
6671
  var CastFiltersWrapper = /*#__PURE__*/styled.div(_templateObject2$x || (_templateObject2$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n\n @media ", " {\n gap: 15px;\n }\n"])), devices.mobile);
6625
6672
  var HeadingTextWrapper = /*#__PURE__*/styled.div(_templateObject3$m || (_templateObject3$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 44px;\n display: flex;\n align-items: center;\n"])));
6626
6673
  var RotatorButtonsWrapper = /*#__PURE__*/styled(GridItem)(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
6627
- var CastWrapper = /*#__PURE__*/styled.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 20px;\n overflow-x: scroll;\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n ::-webkit-scrollbar {\n display: none;\n }\n\n @media ", " {\n flex-direction: column;\n gap: 10px;\n }\n"])), devices.mobile);
6674
+ var CastWrapper = /*#__PURE__*/styled.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 20px;\n overflow-x: hidden;\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n ::-webkit-scrollbar {\n display: none;\n }\n\n @media ", " {\n flex-direction: column;\n gap: 10px;\n overflow-x: scroll;\n }\n"])), devices.mobile);
6628
6675
  var ActionButtons = /*#__PURE__*/styled.div(_templateObject6$a || (_templateObject6$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: baseline;\n gap: 32px;\n\n .mobile-only {\n visibility: hidden;\n\n p {\n font-size: 14px;\n line-height: 17px;\n }\n }\n\n @media ", " {\n .mobile-only {\n visibility: visible;\n padding-block: 24px;\n font-size: 17px;\n line-height: 24px;\n }\n\n flex-direction: row-reverse;\n gap: unset;\n justify-content: space-between;\n border-block-end: 2px solid var(--base-color-light-grey);\n\n :has(.mobile-only) {\n justify-content: left;\n }\n\n :not(:has(.mobile-only)) {\n padding-block: 12px;\n }\n\n a {\n width: fit-content;\n }\n }\n"])), devices.mobile);
6629
6676
  var PersonWrapper = /*#__PURE__*/styled.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 6px;\n margin-block-start: 2px;\n margin-inline: 2px;\n\n p {\n font-size: 14px;\n line-height: 17px;\n }\n\n :focus-visible {\n outline: none;\n\n & > div:first-child {\n outline: 2px solid var(--color-base-black);\n }\n }\n\n @media ", " {\n flex-direction: row;\n gap: 20px;\n margin-block-end: 2px;\n margin-inline-end: unset;\n\n p {\n font-size: 17px;\n line-height: 24px;\n }\n }\n"])), devices.mobile);
6630
6677
  var PersonToggle = /*#__PURE__*/styled.div(_templateObject8$4 || (_templateObject8$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n width: 86px;\n height: 86px;\n min-width: 86px;\n border: 4px solid;\n border-color: ", ";\n border-radius: 50%;\n background: var(--color-base-white);\n position: relative;\n box-shadow: inset 0 0 0 4px var(--color-base-white);\n"])), function (_ref) {
@@ -6714,7 +6761,7 @@ var getMovedSlides = function getMovedSlides(delta, slideWidths) {
6714
6761
  return movedSlides;
6715
6762
  };
6716
6763
 
6717
- var _excluded$h = ["children", "infinite", "onIndexChange", "slidesOffsetBefore", "slidesAriaHidden", "onActiveChange", "onOverflowChange"];
6764
+ var _excluded$h = ["children", "infinite", "onIndexChange", "slidesOffsetBefore", "slidesAriaHidden", "onActiveChange", "onOverflowChange", "limitDragToNavigableRange"];
6718
6765
  var MAX_CLONES_NUMBER = 6;
6719
6766
  var CLICK_DRAG_THRESHOLD = 10;
6720
6767
  var getClonesCount = function getClonesCount(infinite, childrenLength) {
@@ -6739,6 +6786,8 @@ var Swipe = /*#__PURE__*/forwardRef(function (_ref, ref) {
6739
6786
  slidesAriaHidden = _ref$slidesAriaHidden === void 0 ? false : _ref$slidesAriaHidden,
6740
6787
  onActiveChange = _ref.onActiveChange,
6741
6788
  onOverflowChange = _ref.onOverflowChange,
6789
+ _ref$limitDragToNavig = _ref.limitDragToNavigableRange,
6790
+ limitDragToNavigableRange = _ref$limitDragToNavig === void 0 ? false : _ref$limitDragToNavig,
6742
6791
  props = _objectWithoutPropertiesLoose(_ref, _excluded$h);
6743
6792
  var containerRef = useRef(null);
6744
6793
  var childRefs = useRef([]);
@@ -6844,6 +6893,39 @@ var Swipe = /*#__PURE__*/forwardRef(function (_ref, ref) {
6844
6893
  }, 0);
6845
6894
  return (slidesOffsetBefore || 0) - widthsBefore;
6846
6895
  };
6896
+ var canScrollRightFromIndex = function canScrollRightFromIndex(index) {
6897
+ if (infinite) return true;
6898
+ if (slideWidths.length === 0 || containerWidth === 0) return false;
6899
+ var totalContentWidth = slideWidths.reduce(function (sum, width) {
6900
+ return sum + width;
6901
+ }, 0);
6902
+ var widthBeforeCurrent = slideWidths.slice(0, index).reduce(function (sum, width) {
6903
+ return sum + width;
6904
+ }, 0);
6905
+ var visibleSpace = containerWidth - (slidesOffsetBefore || 0);
6906
+ var remainingToRight = totalContentWidth - widthBeforeCurrent - visibleSpace;
6907
+ var visible = getVisibleIndexes(index, slideWidths, containerWidth, slides.length);
6908
+ var lastVisibleIndex = visible.length ? visible[visible.length - 1] : index;
6909
+ var nextIndex = lastVisibleIndex + 1;
6910
+ if (nextIndex >= slideWidths.length) return false;
6911
+ var nextSlideWidth = typeof slideWidths[nextIndex] === 'number' ? slideWidths[nextIndex] : 0;
6912
+ if (nextSlideWidth === 0) return false;
6913
+ var EPS = 1; // pixel tolerance
6914
+ // full next slide fits
6915
+ if (remainingToRight + EPS >= nextSlideWidth) return true;
6916
+ return remainingToRight > 0;
6917
+ };
6918
+ var canMoveNext = function canMoveNext() {
6919
+ return canScrollRightFromIndex(currentIndex);
6920
+ };
6921
+ var getMaxNavigableIndex = function getMaxNavigableIndex() {
6922
+ if (infinite) return slides.length - 1;
6923
+ var index = 0;
6924
+ while (index < slides.length - 1 && canScrollRightFromIndex(index)) {
6925
+ index += 1;
6926
+ }
6927
+ return index;
6928
+ };
6847
6929
  var navigateOnSwipeEnd = function navigateOnSwipeEnd() {
6848
6930
  var delta = currentTranslate.current - getTranslateX();
6849
6931
  var direction = delta > 0 ? -1 : 1;
@@ -6851,7 +6933,8 @@ var Swipe = /*#__PURE__*/forwardRef(function (_ref, ref) {
6851
6933
  if (Math.abs(delta) > 20) {
6852
6934
  movedSlides = Math.max(1, movedSlides);
6853
6935
  var targetIndex = currentIndex + direction * movedSlides;
6854
- var finalIndex = infinite ? targetIndex : Math.max(0, Math.min(slides.length - 1, targetIndex));
6936
+ var maxNavigableIndex = limitDragToNavigableRange ? getMaxNavigableIndex() : slides.length - 1;
6937
+ var finalIndex = infinite ? targetIndex : Math.max(0, Math.min(maxNavigableIndex, targetIndex));
6855
6938
  if (!infinite) {
6856
6939
  currentTranslate.current = getTranslateForIndex(finalIndex);
6857
6940
  setDragTranslateX(null);
@@ -6866,28 +6949,6 @@ var Swipe = /*#__PURE__*/forwardRef(function (_ref, ref) {
6866
6949
  }
6867
6950
  setDragTranslateX(null);
6868
6951
  };
6869
- var canMoveNext = function canMoveNext() {
6870
- if (infinite) return true;
6871
- if (slideWidths.length === 0 || containerWidth === 0) return false;
6872
- var totalWidth = slideWidths.reduce(function (acc, w) {
6873
- return acc + w;
6874
- }, 0);
6875
- var widthsBefore = slideWidths.slice(0, currentIndex).reduce(function (acc, w) {
6876
- return acc + w;
6877
- }, 0);
6878
- var visibleSpace = containerWidth - (slidesOffsetBefore || 0);
6879
- var remainingToRight = totalWidth - widthsBefore - visibleSpace;
6880
- var visible = getVisibleIndexes(currentIndex, slideWidths, containerWidth, slides.length);
6881
- var lastVisibleIndex = visible.length ? visible[visible.length - 1] : currentIndex;
6882
- var nextIndex = lastVisibleIndex + 1;
6883
- if (nextIndex >= slideWidths.length) return false;
6884
- var nextSlideWidth = typeof slideWidths[nextIndex] === 'number' ? slideWidths[nextIndex] : 0;
6885
- if (nextSlideWidth === 0) return false;
6886
- var EPS = 1; // pixel tolerance
6887
- // full next slide fits
6888
- if (remainingToRight + EPS >= nextSlideWidth) return true;
6889
- return remainingToRight > 0;
6890
- };
6891
6952
  var handleTransitionEnd = function handleTransitionEnd() {
6892
6953
  setTransitioning(false);
6893
6954
  if (!infinite) return;
@@ -7099,11 +7160,13 @@ var CastFilters = function CastFilters(_ref) {
7099
7160
  };
7100
7161
  var onNext = function onNext() {
7101
7162
  var _swipeRef$current4;
7102
- return (_swipeRef$current4 = swipeRef.current) == null ? void 0 : _swipeRef$current4.nextSlide();
7163
+ if (!availableNext) return;
7164
+ (_swipeRef$current4 = swipeRef.current) == null || _swipeRef$current4.nextSlide();
7103
7165
  };
7104
7166
  var onPrev = function onPrev() {
7105
7167
  var _swipeRef$current5;
7106
- return (_swipeRef$current5 = swipeRef.current) == null ? void 0 : _swipeRef$current5.prevSlide();
7168
+ if (!availablePrev) return;
7169
+ (_swipeRef$current5 = swipeRef.current) == null || _swipeRef$current5.prevSlide();
7107
7170
  };
7108
7171
  useEffect(function () {
7109
7172
  var el = castWrapperRef.current;
@@ -7126,15 +7189,15 @@ var CastFilters = function CastFilters(_ref) {
7126
7189
  };
7127
7190
  }, []);
7128
7191
  var handleMouseDown = useCallback(function (e) {
7129
- if (!castWrapperRef.current) return;
7192
+ if (!isMobile || !castWrapperRef.current) return;
7130
7193
  isDraggingRef.current = true;
7131
7194
  hasDraggedRef.current = false;
7132
7195
  startXRef.current = e.clientX;
7133
7196
  scrollStartRef.current = castWrapperRef.current.scrollLeft;
7134
7197
  if (e.target === castWrapperRef.current) e.preventDefault();
7135
- }, []);
7198
+ }, [isMobile]);
7136
7199
  var handleMouseMove = useCallback(function (e) {
7137
- if (!isDraggingRef.current || !castWrapperRef.current) return;
7200
+ if (!isMobile || !isDraggingRef.current || !castWrapperRef.current) return;
7138
7201
  var deltaX = e.clientX - startXRef.current;
7139
7202
  var threshold = 5;
7140
7203
  if (Math.abs(deltaX) > threshold) {
@@ -7142,17 +7205,19 @@ var CastFilters = function CastFilters(_ref) {
7142
7205
  e.preventDefault();
7143
7206
  castWrapperRef.current.scrollLeft = scrollStartRef.current - deltaX;
7144
7207
  }
7145
- }, []);
7208
+ }, [isMobile]);
7146
7209
  var handleMouseUp = useCallback(function () {
7210
+ if (!isMobile) return;
7147
7211
  isDraggingRef.current = false;
7148
7212
  setTimeout(function () {
7149
7213
  hasDraggedRef.current = false;
7150
7214
  }, 0);
7151
- }, []);
7215
+ }, [isMobile]);
7152
7216
  var handleMouseLeave = useCallback(function () {
7217
+ if (!isMobile) return;
7153
7218
  isDraggingRef.current = false;
7154
7219
  hasDraggedRef.current = false;
7155
- }, []);
7220
+ }, [isMobile]);
7156
7221
  var handleClick = React__default.useCallback(function (index, onClick) {
7157
7222
  if (hasDraggedRef.current) return;
7158
7223
  if (onSelect) onSelect(index);
@@ -7238,7 +7303,8 @@ var CastFilters = function CastFilters(_ref) {
7238
7303
  onIndexChange: onIndexChangeHandler,
7239
7304
  "data-testid": "cast-filter-swipe",
7240
7305
  ref: swipeRef,
7241
- onOverflowChange: handleOverflowChange
7306
+ onOverflowChange: handleOverflowChange,
7307
+ limitDragToNavigableRange: true
7242
7308
  }, getPersonCards())))), showActionButtonsSection && (/*#__PURE__*/React__default.createElement(ActionButtons, null, selectedIndices.length === 0 && emptySelectionText && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
7243
7309
  size: "medium",
7244
7310
  className: "mobile-only"
@@ -7576,22 +7642,25 @@ var InfoBodyWrapper = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject4$n |
7576
7642
  var css_248z$1 = "@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Regular.woff2') format('woff2');\n font-weight: 400;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Medium.woff2') format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Bold.woff2') format('woff2');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://static.roh.org.uk/fonts/harmonic/VictorSerif-Medium.woff2') format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://static.roh.org.uk/fonts/harmonic/VictorSerif-MediumItalic.woff2') format('woff2');\n font-weight: 500;\n font-style: italic;\n font-display: swap;\n}\n";
7577
7643
  styleInject(css_248z$1);
7578
7644
 
7579
- var css_248z$2 = ".core-theme-module_coreTheme__pWxYB {\n /* RBO Red */\n /* Primary Palette */\n --color-primary: #1a1a1a;\n --color-primary-background: #eb0a0a;\n --color-primary-red: #eb0a0a;\n --color-primary-black: #1a1a1a;\n\n /* Base Colours */\n --color-base-white: #ffffff;\n --color-base-black: #000000;\n --color-base-dark-grey: #4c4f53;\n --color-base-mid-grey: #72767c;\n --color-base-light-grey: #e9e9e9;\n --color-base-transparent: transparent;\n\n /* States */\n --color-state-error: #cc071e;\n --color-state-medium: #ffce45;\n --color-state-good: #2a874a;\n --color-state-focused: #1e1da0;\n --color-state-disabled: #b3b3b3;\n\n /* RBO Red (Core) */\n --color-rbo-red-hovered: #c40808;\n --color-rbo-red-pressed: #9d0707;\n\n /* RBO Black */\n --color-rbo-black-hovered: #575757;\n --color-rbo-black-pressed: #353535;\n\n /* Black */\n --color-black-hovered: #575757;\n --color-black-pressed: #353535;\n\n /* White */\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n /* Secondary Palette */\n --color-secondary-yellow: #ffce45;\n --color-secondary-pink: #ff36d0;\n --color-secondary-orange: #ff6700;\n --color-secondary-blue: #5f9cff;\n\n /* Shadows */\n --shadow-floating: 0px 4px 38px 0px #0000000a;\n\n /* Core theme colors */\n --base-color-primary: #c8102e;\n --base-color-core: #c8102e;\n --base-color-stream: #1866dc;\n --base-color-cinema: #1a1a1a;\n --base-color-white: #ffffff;\n --base-color-black: #000000;\n --base-color-dark-grey: #4c4f53;\n --base-color-mid-grey: #72767c;\n --base-color-light-grey: #e9e9e9;\n --base-color-transparent: transparent;\n --base-color-errorstate: #eb0a0a;\n --base-color-mediumstate: #ffce45;\n --base-color-goodstate: #2a874a;\n --base-color-progress: #1866dc;\n --base-color-navigation: #c8102e;\n --base-color-lapislazuli: #0060a0;\n --base-color-lemonchiffon: #fffbbe;\n\n --button-height: 48px;\n --button-line-height: 20px;\n --button-padding-x: 20px;\n --button-padding-y: 14px;\n --button-padding-y-icon: 12px;\n --button-icon-margin: 12px;\n --button-icon-width: 20px;\n --button-icon-height: 20px;\n --button-font-size: 14px;\n --button-font-weight: 400;\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-red);\n --button-hover-color: var(--color-rbo-red-hovered);\n --button-pressed-color: var(--color-rbo-red-pressed);\n --button-secondary-color: var(--color-primary-red);\n --button-secondary-hover-color: var(--color-rbo-red-hovered);\n --button-secondary-pressed-color: var(--color-rbo-red-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-auxiliary-color: var(--color-primary-black);\n --button-auxiliary-bg-color: var(--color-base-transparent);\n --button-anchor-tab-color: var(--color-primary-red);\n\n /* ----- Variables already used in Harmonic START ----- */\n --grid-column-gap: 36px;\n --grid-margin: 10%;\n\n --rotator-button-width: 60px;\n --rotator-button-icon-width: 36px;\n --rotator-button-small-width: 44px;\n --rotator-button-small-icon-width: 28px;\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-red);\n\n --carousel-image-caption-margin: 12px;\n\n --line-height-listing: 36px;\n\n --upsell-border-color: var(--color-primary-red);\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n\n @media (max-width: 699px) {\n --grid-column-gap: 12px;\n --grid-margin: 20px;\n --rotator-button-width: 40px;\n --rotator-button-icon-width: 24px;\n\n --line-height-listing: 34px;\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-column-gap: 20px;\n --grid-margin: 32px;\n --rotator-button-width: 44px;\n --rotator-button-icon-width: 24px;\n }\n\n /* ----- Variables already used in Harmonic END ----- */\n\n --font-size-header-1: 96px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 2px;\n --line-height-header-1: 110px;\n --margin-header-1: 0.67em 0;\n\n --font-size-header-2: 68px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 72px;\n --margin-header-2: 0.83em 0;\n\n --font-size-header-3: 44px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 48px;\n --margin-header-3: 1em 0;\n\n --font-size-header-4: 34px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 40px;\n --margin-header-4: 1.33em 0;\n\n --font-size-header-5: 24px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 30px;\n --margin-header-5: 1.67em 0;\n\n --font-size-header-6: 20px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 28px;\n --margin-header-6: 2.33em 0;\n\n --font-size-altHeader-3: 44px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 48px;\n\n --font-size-altHeader-4: 34px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 44px;\n\n --font-size-altHeader-5: 24px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 30px;\n\n --font-size-altHeader-6: 20px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 28px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-overline-3: 10px;\n --font-weight-overline-3: 500;\n --letter-spacing-overline-3: 1px;\n --line-height-overline-3: 12px;\n\n --font-size-overline-4: 8px;\n --font-weight-overline-4: 500;\n --letter-spacing-overline-4: 1px;\n --line-height-overline-4: 10px;\n\n --font-size-body-1: 19px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 26px;\n\n --font-size-body-2: 16px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 22px;\n\n --font-size-body-3: 14px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 20px;\n\n --font-size-subtitle-1: 18px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 22px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 22px;\n\n --font-size-title-description: 20px;\n --line-height-title-description: 28px;\n\n --font-size-individual-listing-name: 19px;\n --line-height-individual-listing-name: 24px;\n --line-height-people-listing-gap: 24px;\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-subtitle: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --font-family-navigation: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-size-navigation: 13px;\n --font-weight-navigation: 500;\n --line-height-navigation: 16px;\n --text-transform-navigation: uppercase;\n --letter-spacing-navigation: 1px;\n\n --navigation-small-gap: 16px;\n --navigation-middle-gap: 20px;\n --navigation-large-gap: 24px;\n --navigation-xlarge-gap: 36px;\n --navigation-large-margin: 60px;\n\n --font-size-search: 24px;\n --font-family-search: 'adobe-garamond-pro';\n\n --grid-outer-margin: 50px;\n --grid-template-columns: 14px calc(10% - 86px) repeat(12, minmax(0, 1fr)) calc(10% - 86px) 14px;\n\n --footer-height: 380px;\n --footer-padding-top: 44px;\n --footer-padding-bottom: 44px;\n --footer-items-gap: 32px;\n --footer-media-gap: 32px;\n --footer-media-icon-width: 24px;\n --footer-media-icon-height: 24px;\n --footer-vertical-spacing-lg: 58px;\n --footer-vertical-spacing-sm: 16px;\n\n --text-link-underline-offset: 8px;\n --cards-spacing-stack: 40px;\n\n --editorial-subtitle-margin-bottom: 16px;\n --editorial-margin-between: 24px;\n --editorial-spacing-hover: 4px;\n --anchor-tabs-height: 70px;\n\n --font-family-sans: 'GreyLLTT', 'Roboto', sans-serif;\n --font-family-serif: 'VictorSerif', 'Inria Serif Regular', serif;\n\n --harmonic-text-link-underline-offset: 4px;\n --harmonic-font-size-navigation: 19px;\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-red);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-red);\n --information-panel-button-color: var(--color-primary-black);\n --information-panel-button-bg-color: var(--color-base-white);\n --information-panel-button-hover-color: var(--color-white-hovered);\n --information-panel-button-pressed-color: var(--color-white-pressed);\n\n --heading-promo-bg-color: var(--color-primary-red);\n --page-header-bg-color: var(--color-primary-red);\n\n @media (max-width: 699px) {\n --font-size-header-1: 38px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 1px;\n --line-height-header-1: 42px;\n\n --font-size-header-2: 30px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 34px;\n\n --font-size-header-3: 26px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 30px;\n\n --font-size-header-4: 24px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 28px;\n\n --font-size-header-5: 20px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 28px;\n\n --font-size-header-6: 17px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 24px;\n\n --font-size-altHeader-3: 26px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 30px;\n\n --font-size-altHeader-4: 24px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 28px;\n\n --font-size-altHeader-5: 20px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 28px;\n\n --font-size-altHeader-6: 17px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 24px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-body-1: 17px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 24px;\n\n --font-size-body-2: 12px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 18px;\n\n --font-size-body-3: 11px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 16px;\n\n --font-size-subtitle-1: 16px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 24px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 18px;\n\n --font-size-title-description: 17px;\n --line-height-title-description: 24px;\n --line-height-people-listing-gap: 16px;\n\n --font-size-search: 20px;\n --font-family-search: 'adobe-garamond-pro';\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm Medium', sans-serif;\n --font-family-subtitle: 'Gotham SSm Medium', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --grid-template-columns: calc(20px - 12px) repeat(12, minmax(0, 1fr)) calc(20px - 12px);\n\n --footer-height: auto;\n --footer-padding-top: 20px;\n --footer-padding-bottom: 20px;\n --footer-items-gap: 12px;\n --footer-media-icon-width: 28px;\n --footer-media-icon-height: 28px;\n --footer-vertical-spacing-lg: 24px;\n --footer-vertical-spacing-sm: 24px;\n\n --anchor-tabs-height: 60px;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-template-columns: calc(32px - 20px) repeat(12, minmax(0, 1fr)) calc(32px - 20px);\n --font-size-header-6: 17px;\n --font-size-altHeader-4: 24px;\n --font-size-body-1: 17px;\n\n --footer-media-gap: 24px;\n --footer-padding-top: 40px;\n --footer-padding-bottom: 40px;\n }\n}\n";
7580
- var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
7645
+ var css_248z$2 = "/* ~~~~~ General Styling Classes ~~~~~ */\n.typography_color-primary__LOfDi {\n color: var(--color-primary);\n}\n\n.typography_color-black__6MHRL {\n color: var(--color-base-black);\n}\n\n.typography_color-white__PfW5s {\n color: var(--color-base-white);\n}\n\n.typography_color-red__iPlbG {\n color: var(--color-primary-red);\n}\n\n.typography_color-grey__GA1c2 {\n color: var(--color-base-dark-grey);\n}\n\n.typography_color-inherit__RDd0Y {\n color: inherit;\n}\n\n.typography_em__E6tX- {\n font-style: italic;\n}\n/* ~~~ */\n\n/* Display Headers */\n.typography_display__-F3p4 {\n margin: 0;\n font-family: var(--font-family-sans);\n line-height: 100%;\n\n &.typography_large__uq0zC {\n font-size: 96px;\n font-weight: 700;\n letter-spacing: -5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 68px;\n font-weight: 500;\n letter-spacing: -3px;\n }\n\n /* Serif and Italic styles */\n &.typography_serif__VSO38,\n &.typography_em__E6tX- {\n font-family: var(--font-family-serif);\n font-weight: 500;\n }\n\n /* Serif and Italic adjustments */\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX- {\n letter-spacing: -3px;\n }\n\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -2px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 38px;\n letter-spacing: -1.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 32px;\n letter-spacing: -1.5px;\n }\n\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX-,\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n }\n}\n\n/* Headers */\n.typography_header__BexiD {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n\n &.typography_large__uq0zC {\n font-size: 44px;\n line-height: 48px;\n letter-spacing: -1.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 34px;\n line-height: 40px;\n letter-spacing: -1px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 26px;\n line-height: 32px;\n letter-spacing: -0.5px;\n }\n\n /* Serif and Italic styles */\n &.typography_serif__VSO38,\n &.typography_em__E6tX- {\n font-family: var(--font-family-serif);\n }\n\n /* Serif and Italic letter-spacing overrides */\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n\n &.typography_medium__K0uZD.typography_serif__VSO38,\n &.typography_medium__K0uZD.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 28px;\n line-height: 34px;\n letter-spacing: -1.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 24px;\n line-height: 28px;\n letter-spacing: -1px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 20px;\n line-height: 26px;\n letter-spacing: -0.75px;\n }\n\n /* Mobile overrides for serif/italic letter-spacing */\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX-,\n &.typography_medium__K0uZD.typography_serif__VSO38,\n &.typography_medium__K0uZD.typography_em__E6tX-,\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n }\n}\n\n/* Subtitle */\n.typography_subtitle__aoFTV {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n\n &.typography_large__uq0zC {\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n }\n}\n\n/* Body Copy */\n.typography_bodycopy__vYtQ8 {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n\n &.typography_large__uq0zC {\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.5px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 11px;\n line-height: 16px;\n letter-spacing: -0.2px;\n }\n }\n}\n\n/* Overline */\n.typography_overline__EnUK3 {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n text-transform: uppercase;\n\n &.typography_large__uq0zC {\n font-size: 14px;\n line-height: 18px;\n letter-spacing: 0.3px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 12px;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n line-height: 17px;\n letter-spacing: 0.3px; /* Added to ensure it stays */\n }\n\n &.typography_small__wfQ0K {\n line-height: 14px;\n letter-spacing: 0.3px;\n }\n }\n}\n\n/* Button Text */\n.typography_buttontext__vcxNi {\n margin: 0;\n font-family: var(--font-family-sans);\n font-size: 17px;\n line-height: 20px;\n letter-spacing: -0.5px;\n font-weight: 400;\n\n @media (max-width: 699px) {\n font-weight: 500;\n line-height: 17px;\n }\n}\n\n/* Caption Text */\n.typography_captiontext__91UFb {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n\n @media (max-width: 699px) {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n}\n\n/* Navigation Text */\n.typography_navigationtext__YfGf7 {\n margin: 0;\n font-family: var(--font-family-sans);\n font-size: 19px;\n line-height: 19px;\n letter-spacing: 0.4px;\n font-weight: 500;\n\n @media (max-width: 699px) {\n font-size: 17px;\n line-height: 17px;\n }\n}\n";
7581
7646
  styleInject(css_248z$2);
7582
7647
 
7583
- var css_248z$3 = ".stream-theme-module_streamTheme__lTfqQ {\n /* Stream theme overrides */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-background: #1a1a1a;\n --color-primary-button: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-black);\n --button-hover-color: var(--color-black-hovered);\n --button-pressed-color: var(--color-black-pressed);\n --button-secondary-color: var(--color-primary-black);\n --button-secondary-hover-color: var(--color-black-hovered);\n --button-secondary-pressed-color: var(--color-black-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-anchor-tab-color: var(--color-primary-black);\n\n --rotator-button-color: var(--color-base-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-black);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-black);\n\n --heading-promo-bg-color: var(--color-base-black);\n --page-header-bg-color: var(--color-primary-black);\n\n --upsell-border-color: var(--color-primary-black);\n}\n";
7584
- var streamThemeStyles = {"streamTheme":"stream-theme-module_streamTheme__lTfqQ"};
7648
+ var css_248z$3 = ".core-theme-module_coreTheme__pWxYB {\n /* RBO Red */\n /* Primary Palette */\n --color-primary: #1a1a1a;\n --color-primary-background: #eb0a0a;\n --color-primary-red: #eb0a0a;\n --color-primary-black: #1a1a1a;\n\n /* Base Colours */\n --color-base-white: #ffffff;\n --color-base-black: #000000;\n --color-base-dark-grey: #4c4f53;\n --color-base-mid-grey: #72767c;\n --color-base-light-grey: #e9e9e9;\n --color-base-transparent: transparent;\n\n /* States */\n --color-state-error: #cc071e;\n --color-state-medium: #ffce45;\n --color-state-good: #2a874a;\n --color-state-focused: #1e1da0;\n --color-state-disabled: #b3b3b3;\n\n /* RBO Red (Core) */\n --color-rbo-red-hovered: #c40808;\n --color-rbo-red-pressed: #9d0707;\n\n /* RBO Black */\n --color-rbo-black-hovered: #575757;\n --color-rbo-black-pressed: #353535;\n\n /* Black */\n --color-black-hovered: #575757;\n --color-black-pressed: #353535;\n\n /* White */\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n /* Secondary Palette */\n --color-secondary-yellow: #ffce45;\n --color-secondary-pink: #ff36d0;\n --color-secondary-orange: #ff6700;\n --color-secondary-blue: #5f9cff;\n\n /* Shadows */\n --shadow-floating: 0px 4px 38px 0px #0000000a;\n\n /* Core theme colors */\n --base-color-primary: #c8102e;\n --base-color-core: #c8102e;\n --base-color-stream: #1866dc;\n --base-color-cinema: #1a1a1a;\n --base-color-white: #ffffff;\n --base-color-black: #000000;\n --base-color-dark-grey: #4c4f53;\n --base-color-mid-grey: #72767c;\n --base-color-light-grey: #e9e9e9;\n --base-color-transparent: transparent;\n --base-color-errorstate: #eb0a0a;\n --base-color-mediumstate: #ffce45;\n --base-color-goodstate: #2a874a;\n --base-color-progress: #1866dc;\n --base-color-navigation: #c8102e;\n --base-color-lapislazuli: #0060a0;\n --base-color-lemonchiffon: #fffbbe;\n\n --button-height: 48px;\n --button-line-height: 20px;\n --button-padding-x: 20px;\n --button-padding-y: 14px;\n --button-padding-y-icon: 12px;\n --button-icon-margin: 12px;\n --button-icon-width: 20px;\n --button-icon-height: 20px;\n --button-font-size: 14px;\n --button-font-weight: 400;\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-red);\n --button-hover-color: var(--color-rbo-red-hovered);\n --button-pressed-color: var(--color-rbo-red-pressed);\n --button-secondary-color: var(--color-primary-red);\n --button-secondary-hover-color: var(--color-rbo-red-hovered);\n --button-secondary-pressed-color: var(--color-rbo-red-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-auxiliary-color: var(--color-primary-black);\n --button-auxiliary-bg-color: var(--color-base-transparent);\n --button-anchor-tab-color: var(--color-primary-red);\n\n /* ----- Variables already used in Harmonic START ----- */\n --grid-column-gap: 36px;\n --grid-margin: 10%;\n\n --rotator-button-width: 60px;\n --rotator-button-icon-width: 36px;\n --rotator-button-small-width: 44px;\n --rotator-button-small-icon-width: 28px;\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-red);\n\n --carousel-image-caption-margin: 12px;\n\n --line-height-listing: 36px;\n\n --upsell-border-color: var(--color-primary-red);\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n\n @media (max-width: 699px) {\n --grid-column-gap: 12px;\n --grid-margin: 20px;\n --rotator-button-width: 40px;\n --rotator-button-icon-width: 24px;\n\n --line-height-listing: 34px;\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-column-gap: 20px;\n --grid-margin: 32px;\n --rotator-button-width: 44px;\n --rotator-button-icon-width: 24px;\n }\n\n /* ----- Variables already used in Harmonic END ----- */\n\n --font-size-header-1: 96px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 2px;\n --line-height-header-1: 110px;\n --margin-header-1: 0.67em 0;\n\n --font-size-header-2: 68px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 72px;\n --margin-header-2: 0.83em 0;\n\n --font-size-header-3: 44px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 48px;\n --margin-header-3: 1em 0;\n\n --font-size-header-4: 34px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 40px;\n --margin-header-4: 1.33em 0;\n\n --font-size-header-5: 24px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 30px;\n --margin-header-5: 1.67em 0;\n\n --font-size-header-6: 20px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 28px;\n --margin-header-6: 2.33em 0;\n\n --font-size-altHeader-3: 44px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 48px;\n\n --font-size-altHeader-4: 34px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 44px;\n\n --font-size-altHeader-5: 24px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 30px;\n\n --font-size-altHeader-6: 20px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 28px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-overline-3: 10px;\n --font-weight-overline-3: 500;\n --letter-spacing-overline-3: 1px;\n --line-height-overline-3: 12px;\n\n --font-size-overline-4: 8px;\n --font-weight-overline-4: 500;\n --letter-spacing-overline-4: 1px;\n --line-height-overline-4: 10px;\n\n --font-size-body-1: 19px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 26px;\n\n --font-size-body-2: 16px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 22px;\n\n --font-size-body-3: 14px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 20px;\n\n --font-size-subtitle-1: 18px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 22px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 22px;\n\n --font-size-title-description: 20px;\n --line-height-title-description: 28px;\n\n --font-size-individual-listing-name: 19px;\n --line-height-individual-listing-name: 24px;\n --line-height-people-listing-gap: 24px;\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-subtitle: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --font-family-navigation: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-size-navigation: 13px;\n --font-weight-navigation: 500;\n --line-height-navigation: 16px;\n --text-transform-navigation: uppercase;\n --letter-spacing-navigation: 1px;\n\n --navigation-small-gap: 16px;\n --navigation-middle-gap: 20px;\n --navigation-large-gap: 24px;\n --navigation-xlarge-gap: 36px;\n --navigation-large-margin: 60px;\n\n --font-size-search: 24px;\n --font-family-search: 'adobe-garamond-pro';\n\n --grid-outer-margin: 50px;\n --grid-template-columns: 14px calc(10% - 86px) repeat(12, minmax(0, 1fr)) calc(10% - 86px) 14px;\n\n --footer-height: 380px;\n --footer-padding-top: 44px;\n --footer-padding-bottom: 44px;\n --footer-items-gap: 32px;\n --footer-media-gap: 32px;\n --footer-media-icon-width: 24px;\n --footer-media-icon-height: 24px;\n --footer-vertical-spacing-lg: 58px;\n --footer-vertical-spacing-sm: 16px;\n\n --text-link-underline-offset: 8px;\n --cards-spacing-stack: 40px;\n\n --editorial-subtitle-margin-bottom: 16px;\n --editorial-margin-between: 24px;\n --editorial-spacing-hover: 4px;\n --anchor-tabs-height: 70px;\n\n --font-family-sans: 'GreyLLTT', 'Roboto', sans-serif;\n --font-family-serif: 'VictorSerif', 'Inria Serif Regular', serif;\n\n --harmonic-text-link-underline-offset: 4px;\n --harmonic-font-size-navigation: 19px;\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-red);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-red);\n --information-panel-button-color: var(--color-primary-black);\n --information-panel-button-bg-color: var(--color-base-white);\n --information-panel-button-hover-color: var(--color-white-hovered);\n --information-panel-button-pressed-color: var(--color-white-pressed);\n\n --heading-promo-bg-color: var(--color-primary-red);\n --page-header-bg-color: var(--color-primary-red);\n\n @media (max-width: 699px) {\n --font-size-header-1: 38px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 1px;\n --line-height-header-1: 42px;\n\n --font-size-header-2: 30px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 34px;\n\n --font-size-header-3: 26px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 30px;\n\n --font-size-header-4: 24px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 28px;\n\n --font-size-header-5: 20px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 28px;\n\n --font-size-header-6: 17px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 24px;\n\n --font-size-altHeader-3: 26px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 30px;\n\n --font-size-altHeader-4: 24px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 28px;\n\n --font-size-altHeader-5: 20px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 28px;\n\n --font-size-altHeader-6: 17px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 24px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-body-1: 17px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 24px;\n\n --font-size-body-2: 12px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 18px;\n\n --font-size-body-3: 11px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 16px;\n\n --font-size-subtitle-1: 16px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 24px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 18px;\n\n --font-size-title-description: 17px;\n --line-height-title-description: 24px;\n --line-height-people-listing-gap: 16px;\n\n --font-size-search: 20px;\n --font-family-search: 'adobe-garamond-pro';\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm Medium', sans-serif;\n --font-family-subtitle: 'Gotham SSm Medium', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --grid-template-columns: calc(20px - 12px) repeat(12, minmax(0, 1fr)) calc(20px - 12px);\n\n --footer-height: auto;\n --footer-padding-top: 20px;\n --footer-padding-bottom: 20px;\n --footer-items-gap: 12px;\n --footer-media-icon-width: 28px;\n --footer-media-icon-height: 28px;\n --footer-vertical-spacing-lg: 24px;\n --footer-vertical-spacing-sm: 24px;\n\n --anchor-tabs-height: 60px;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-template-columns: calc(32px - 20px) repeat(12, minmax(0, 1fr)) calc(32px - 20px);\n --font-size-header-6: 17px;\n --font-size-altHeader-4: 24px;\n --font-size-body-1: 17px;\n\n --footer-media-gap: 24px;\n --footer-padding-top: 40px;\n --footer-padding-bottom: 40px;\n }\n}\n";
7649
+ var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
7585
7650
  styleInject(css_248z$3);
7586
7651
 
7587
- var css_248z$4 = ".cinema-theme-module_cinemaTheme__f5QFs {\n /* White */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-button: #ffffff;\n --color-primary-background: #1a1a1a;\n --color-primary-button-reverse-bg: #ffffff;\n --color-primary-button-reverse: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n --button-color: var(--color-primary-black);\n --button-bg-color: var(--color-base-white);\n --button-hover-color: var(--color-white-hovered);\n --button-pressed-color: var(--color-white-pressed);\n --button-secondary-color: var(--color-base-white);\n --button-secondary-hover-color: var(--color-white-hovered);\n --button-secondary-pressed-color: var(--color-white-pressed);\n --button-tertiary-color: var(--color-base-white);\n --button-tertiary-hover-color: var(--color-white-hovered);\n --button-tertiary-pressed-color: var(--color-white-pressed);\n --button-anchor-tab-color: var(--color-primary-black);\n\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-primary-red);\n --announcement-banner-bg-color: var(--color-base-white);\n --announcement-banner-hover-color: var(--color-rbo-red-hovered);\n --announcement-banner-pressed-color: var(--color-rbo-red-pressed);\n\n --information-panel-color: var(--color-primary-black);\n --information-panel-bg-color: var(--color-base-white);\n --information-panel-button-color: var(--color-base-white);\n --information-panel-button-bg-color: var(--color-primary-red);\n --information-panel-button-hover-color: var(--color-rbo-red-hovered);\n --information-panel-button-pressed-color: var(--color-rbo-red-pressed);\n\n --heading-promo-bg-color: var(--color-base-white);\n --page-header-bg-color: var(--color-primary-black);\n\n --upsell-border-color: var(--color-primary-black);\n}\n";
7588
- var cinemaThemeStyles = {"cinemaTheme":"cinema-theme-module_cinemaTheme__f5QFs"};
7652
+ var css_248z$4 = ".stream-theme-module_streamTheme__lTfqQ {\n /* Stream theme overrides */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-background: #1a1a1a;\n --color-primary-button: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-black);\n --button-hover-color: var(--color-black-hovered);\n --button-pressed-color: var(--color-black-pressed);\n --button-secondary-color: var(--color-primary-black);\n --button-secondary-hover-color: var(--color-black-hovered);\n --button-secondary-pressed-color: var(--color-black-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-anchor-tab-color: var(--color-primary-black);\n\n --rotator-button-color: var(--color-base-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-black);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-black);\n\n --heading-promo-bg-color: var(--color-base-black);\n --page-header-bg-color: var(--color-primary-black);\n\n --upsell-border-color: var(--color-primary-black);\n}\n";
7653
+ var streamThemeStyles = {"streamTheme":"stream-theme-module_streamTheme__lTfqQ"};
7589
7654
  styleInject(css_248z$4);
7590
7655
 
7591
- var css_248z$5 = ".schools-theme-module_schoolsTheme__CWHba {\n /* Schools theme overrides */\n --base-color-primary: #c8102e;\n --color-primary: #c8102e;\n --color-primary-button: #c8102e;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n\n @media only screen and (max-width: calc(var(--breakpoint-sm) - 1px)) {\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n }\n}\n";
7592
- var schoolsThemeStyles = {"schoolsTheme":"schools-theme-module_schoolsTheme__CWHba"};
7656
+ var css_248z$5 = ".cinema-theme-module_cinemaTheme__f5QFs {\n /* White */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-button: #ffffff;\n --color-primary-background: #1a1a1a;\n --color-primary-button-reverse-bg: #ffffff;\n --color-primary-button-reverse: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n --button-color: var(--color-primary-black);\n --button-bg-color: var(--color-base-white);\n --button-hover-color: var(--color-white-hovered);\n --button-pressed-color: var(--color-white-pressed);\n --button-secondary-color: var(--color-base-white);\n --button-secondary-hover-color: var(--color-white-hovered);\n --button-secondary-pressed-color: var(--color-white-pressed);\n --button-tertiary-color: var(--color-base-white);\n --button-tertiary-hover-color: var(--color-white-hovered);\n --button-tertiary-pressed-color: var(--color-white-pressed);\n --button-anchor-tab-color: var(--color-primary-black);\n\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-primary-red);\n --announcement-banner-bg-color: var(--color-base-white);\n --announcement-banner-hover-color: var(--color-rbo-red-hovered);\n --announcement-banner-pressed-color: var(--color-rbo-red-pressed);\n\n --information-panel-color: var(--color-primary-black);\n --information-panel-bg-color: var(--color-base-white);\n --information-panel-button-color: var(--color-base-white);\n --information-panel-button-bg-color: var(--color-primary-red);\n --information-panel-button-hover-color: var(--color-rbo-red-hovered);\n --information-panel-button-pressed-color: var(--color-rbo-red-pressed);\n\n --heading-promo-bg-color: var(--color-base-white);\n --page-header-bg-color: var(--color-primary-black);\n\n --upsell-border-color: var(--color-primary-black);\n}\n";
7657
+ var cinemaThemeStyles = {"cinemaTheme":"cinema-theme-module_cinemaTheme__f5QFs"};
7593
7658
  styleInject(css_248z$5);
7594
7659
 
7660
+ var css_248z$6 = ".schools-theme-module_schoolsTheme__CWHba {\n /* Schools theme overrides */\n --base-color-primary: #c8102e;\n --color-primary: #c8102e;\n --color-primary-button: #c8102e;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n\n @media only screen and (max-width: calc(var(--breakpoint-sm) - 1px)) {\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n }\n}\n";
7661
+ var schoolsThemeStyles = {"schoolsTheme":"schools-theme-module_schoolsTheme__CWHba"};
7662
+ styleInject(css_248z$6);
7663
+
7595
7664
  /* eslint-disable react/jsx-no-useless-fragment */
7596
7665
  var DEFAULT_THEME = ThemeType.Core;
7597
7666
  var getThemeClass = function getThemeClass(theme) {
@@ -7859,91 +7928,274 @@ var PageHeading = function PageHeading(_ref) {
7859
7928
  };
7860
7929
 
7861
7930
  var _templateObject$R, _templateObject2$F, _templateObject3$t, _templateObject4$p, _templateObject5$k, _templateObject6$e, _templateObject7$a, _templateObject8$6;
7862
- var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n position: relative;\n display: flex;\n background: var(--base-color-black);\n\n @media ", " {\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n }\n"])), devices.mobile);
7863
- var ImpactHeaderImageWrapper = /*#__PURE__*/styled.div(_templateObject2$F || (_templateObject2$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n overflow: hidden;\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n img {\n width: 100%;\n filter: brightness(0.7);\n opacity: 0.95;\n }\n\n @media ", " {\n height: fit-content;\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n\n img {\n height: 100%;\n object-fit: cover;\n }\n }\n"])), devices.mobile);
7864
- var ImpactGrid = /*#__PURE__*/styled(Grid)(_templateObject3$t || (_templateObject3$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n align-self: center;\n width: 100%;\n z-index: ", ";\n gap: 0 var(--grid-column-gap);\n grid-template-rows: min-content min-content min-content;\n grid-template-areas:\n '. . . . . logo logo logo logo logo logo . . . . .'\n '. . . text text text text text text text text text text . . .'\n '. . . button button button button button button button button button button . . .';\n\n @media ", " {\n & {\n height: 100%;\n grid-template-rows: 1fr max-content 1fr;\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. text text text text text text text text text text text text .'\n '. button button button button button button button button button button button button .';\n }\n }\n\n @media ", " {\n align-content: center;\n\n & {\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. . text text text text text text text text text text . .'\n '. . button button button button button button button button button button . .';\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
7865
- var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
7866
- var LogoWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
7867
- var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n color: var(--base-color-white);\n text-align: center;\n margin-top: 40px;\n max-height: calc(2 * var(--line-height-header-3));\n overflow: hidden;\n\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n max-height: calc(4 * var(--line-height-header-3));\n }\n }\n\n @media ", " {\n & {\n margin-top: 12px;\n max-height: calc(4 * var(--line-height-header-3));\n }\n\n h3 {\n font-size: var(--font-size-header-3);\n letter-spacing: var(--letter-spacing-header-5);\n line-height: var(--line-height-header-5);\n }\n }\n"])), devices.tablet, devices.mobile);
7868
- var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n align-self: end;\n display: flex;\n justify-content: center;\n margin-top: 40px;\n\n @media ", " {\n & {\n margin-top: 0px;\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
7869
- var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 20px;\n left: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
7931
+ var ImpactHeaderWrapper = /*#__PURE__*/styled.header(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n background-color: var(--color-base-black);\n padding: 36px 0;\n\n @media ", " {\n padding: 21px 0;\n }\n"])), devices.mobile);
7932
+ var ImpactTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$F || (_templateObject2$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: grid;\n grid-template-columns: ", ";\n padding: 0 50px;\n\n @media ", " {\n padding: 0 50px;\n }\n\n @media ", " {\n padding: 0 20px;\n grid-template-columns: ", ";\n }\n"])), function (_ref) {
7933
+ var hasButton = _ref.hasButton,
7934
+ sponsorPresent = _ref.sponsorPresent;
7935
+ if (hasButton || sponsorPresent) return 'auto 80px 1fr 80px auto';
7936
+ return '1fr';
7937
+ }, devices.tablet, devices.mobile, function (_ref2) {
7938
+ var sponsorPresent = _ref2.sponsorPresent;
7939
+ return sponsorPresent ? '1fr 20px auto' : '1fr';
7940
+ });
7941
+ var TitleButtonWrapper = /*#__PURE__*/styled.div(_templateObject3$t || (_templateObject3$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1;\n display: flex;\n align-items: center;\n min-width: ", ";\n"])), function (_ref3) {
7942
+ var sponsorWidth = _ref3.sponsorWidth;
7943
+ return sponsorWidth ? sponsorWidth + "px" : 'auto';
7944
+ });
7945
+ var TitleButton = /*#__PURE__*/styled(PrimaryButton)(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n position: static;\n margin-right: 0;\n }\n"])), devices.mobile);
7946
+ var MobileButtonWrapper = /*#__PURE__*/styled.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 0;\n width: 100%;\n box-sizing: border-box;\n padding: 0 20px 16px 20px;\n"])));
7947
+ var ImpactTitle = /*#__PURE__*/styled(HarmonicHeader)(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: -webkit-box;\n align-self: center;\n grid-column: ", ";\n min-width: 0;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-line-clamp: 2;\n max-height: calc(48px * 2);\n text-align: center;\n padding-bottom: 2px;\n\n @media ", " {\n grid-column: 1;\n -webkit-line-clamp: 4;\n max-height: calc(34px * 4);\n text-align: left;\n }\n"])), function (_ref4) {
7948
+ var hasColumns = _ref4.hasColumns;
7949
+ return hasColumns ? '3' : '1';
7950
+ }, devices.mobile);
7951
+ var ImpactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n position: relative;\n overflow: hidden;\n background-color: #000;\n aspect-ratio: 21 / 9;\n height: auto;\n &::before {\n content: '';\n display: block;\n padding-top: calc(9 / 21 * 100%);\n }\n\n > picture,\n img,\n video {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n img {\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: cover;\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: cover;\n }\n }\n @media ", " {\n aspect-ratio: 1 / 1;\n &::before {\n padding-top: 100%;\n }\n max-height: 100vh;\n img {\n object-fit: cover;\n }\n }\n"])), devices.mobile, devices.mobile);
7952
+ var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 5;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n z-index: ", ";\n min-width: ", ";\n\n @media ", " {\n grid-column: 3;\n justify-content: flex-start;\n min-width: unset;\n }\n"])), zIndexes.sponsorship, function (_ref5) {
7953
+ var buttonWidth = _ref5.buttonWidth;
7954
+ return buttonWidth ? buttonWidth + "px" : 'auto';
7955
+ }, devices.mobile);
7956
+
7957
+ var _templateObject$S, _templateObject2$G, _templateObject3$u, _templateObject4$q;
7958
+ var VideoPlayButton$1 = /*#__PURE__*/styled.button(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 80px;\n height: 80px;\n background-color: var(--color-base-transparent);\n border: none;\n cursor: pointer;\n\n @media ", " {\n width: 60px;\n height: 60px;\n }\n"])), devices.mobile);
7959
+ var VideoControlsWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$G || (_templateObject2$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n width: 100%;\n"])));
7960
+ var VideoControlsInnerWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 20px;\n\n @media ", " {\n margin: 20px 4px;\n }\n"])), devices.mobile);
7961
+ var LeftWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n"])));
7962
+
7963
+ var VideoControlsImpact = function VideoControlsImpact(_ref) {
7964
+ var videoElementId = _ref.videoElementId,
7965
+ _ref$loop = _ref.loop,
7966
+ loop = _ref$loop === void 0 ? false : _ref$loop;
7967
+ var _React$useState = React__default.useState(false),
7968
+ playing = _React$useState[0],
7969
+ setPlaying = _React$useState[1];
7970
+ var getVideoElement = function getVideoElement() {
7971
+ return document.querySelector("#" + videoElementId);
7972
+ };
7973
+ React__default.useEffect(function () {
7974
+ var video = getVideoElement();
7975
+ if (video) {
7976
+ video.loop = loop;
7977
+ }
7978
+ }, [loop]);
7979
+ var handlePlay = React__default.useCallback(function () {
7980
+ var video = getVideoElement();
7981
+ if (!video) return;
7982
+ if (playing) {
7983
+ video.pause();
7984
+ setPlaying(false);
7985
+ } else {
7986
+ video == null || video.play();
7987
+ setPlaying(true);
7988
+ }
7989
+ }, [playing]);
7990
+ return /*#__PURE__*/React__default.createElement(VideoControlsWrapper$1, {
7991
+ className: "video-controls-container"
7992
+ }, /*#__PURE__*/React__default.createElement(VideoControlsInnerWrapper$1, null, /*#__PURE__*/React__default.createElement(LeftWrapper$1, null, /*#__PURE__*/React__default.createElement(VideoPlayButton$1, {
7993
+ id: "play",
7994
+ onClick: handlePlay,
7995
+ className: "video-play-button",
7996
+ "data-testid": "video-play-button",
7997
+ "aria-label": !playing ? 'Play' : 'Pause'
7998
+ }, /*#__PURE__*/React__default.createElement(Icon, {
7999
+ iconName: !playing ? 'Play' : 'Pause',
8000
+ color: "white"
8001
+ })))));
8002
+ };
7870
8003
 
7871
8004
  var _excluded$k = ["text"];
7872
- var PageHeadingImpact = function PageHeadingImpact(_ref) {
7873
- var children = _ref.children,
7874
- text = _ref.text,
7875
- link = _ref.link,
7876
- _ref$sponsor = _ref.sponsor,
7877
- sponsor = _ref$sponsor === void 0 ? true : _ref$sponsor,
7878
- customSponsorImage = _ref.customSponsorImage,
7879
- scrollHref = _ref.scrollHref,
7880
- bgUrlDesktop = _ref.bgUrlDesktop,
7881
- bgUrlDevice = _ref.bgUrlDevice,
7882
- _ref$bgImageAltText = _ref.bgImageAltText,
7883
- bgImageAltText = _ref$bgImageAltText === void 0 ? '' : _ref$bgImageAltText,
7884
- _ref$semanticLevel = _ref.semanticLevel,
7885
- semanticLevel = _ref$semanticLevel === void 0 ? 3 : _ref$semanticLevel;
7886
- var truncatedText = text == null ? void 0 : text.substring(0, 75);
7887
- var _ref2 = link || {},
7888
- linkText = _ref2.text,
7889
- restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$k);
7890
- return /*#__PURE__*/React__default.createElement(ImpactWrapper, {
7891
- bgUrlDesktop: bgUrlDesktop,
7892
- bgUrlDevice: bgUrlDevice,
7893
- "data-testid": "impact-wrapper"
7894
- }, sponsor ? (/*#__PURE__*/React__default.createElement(SponsorWrapper, {
7895
- "data-testid": "impact-sponsor"
7896
- }, customSponsorImage ? (/*#__PURE__*/React__default.createElement(Sponsorship, Object.assign({
7897
- "data-testid": "impact-custom-sponsor"
7898
- }, customSponsorImage))) : (/*#__PURE__*/React__default.createElement(Sponsorship, null)))) : null, /*#__PURE__*/React__default.createElement(ImpactHeaderImageWrapper, null, /*#__PURE__*/React__default.createElement("picture", {
8005
+ var CHAR_LIMIT = 100;
8006
+ var useResponsiveVideo = function useResponsiveVideo(video, poster) {
8007
+ var mobileVideo = video.mobile || video.desktop;
8008
+ var desktopVideo = video.desktop || video.mobile;
8009
+ var mobilePoster = poster.mobile || poster.desktop;
8010
+ var desktopPoster = poster.desktop || poster.mobile;
8011
+ var _useState = useState(desktopPoster),
8012
+ posterUrl = _useState[0],
8013
+ setPoster = _useState[1];
8014
+ var _useState2 = useState(desktopVideo),
8015
+ videoUrl = _useState2[0],
8016
+ setVideoUrl = _useState2[1];
8017
+ var isMobile = useMobile();
8018
+ useEffect(function () {
8019
+ setPoster(isMobile ? mobilePoster : desktopPoster);
8020
+ setVideoUrl(isMobile ? mobileVideo : desktopVideo);
8021
+ }, [isMobile]);
8022
+ return {
8023
+ posterUrl: posterUrl,
8024
+ videoUrl: videoUrl
8025
+ };
8026
+ };
8027
+ var VideoWithControls = function VideoWithControls(_ref) {
8028
+ var video = _ref.video,
8029
+ poster = _ref.poster;
8030
+ var _useResponsiveVideo = useResponsiveVideo(video, poster),
8031
+ posterUrl = _useResponsiveVideo.posterUrl,
8032
+ videoUrl = _useResponsiveVideo.videoUrl;
8033
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("video", {
8034
+ id: video.elementId,
8035
+ width: "100%",
8036
+ height: "100%",
8037
+ poster: posterUrl,
8038
+ src: videoUrl,
8039
+ "data-testid": "impact-video",
8040
+ playsInline: true
8041
+ }, /*#__PURE__*/React__default.createElement("source", {
8042
+ src: videoUrl
8043
+ }), /*#__PURE__*/React__default.createElement("img", {
8044
+ src: posterUrl,
8045
+ alt: poster.alt,
8046
+ "data-testid": "impact-image"
8047
+ })), /*#__PURE__*/React__default.createElement(VideoControlsImpact, {
8048
+ loop: true,
8049
+ videoElementId: video.elementId
8050
+ }));
8051
+ };
8052
+ var ImpactHeaderImage = function ImpactHeaderImage(_ref2) {
8053
+ var mobile = _ref2.mobile,
8054
+ desktop = _ref2.desktop,
8055
+ alt = _ref2.alt;
8056
+ return /*#__PURE__*/React__default.createElement("picture", {
7899
8057
  "data-testid": "impact-picture"
7900
- }, bgUrlDevice && (/*#__PURE__*/React__default.createElement("source", {
7901
- srcSet: bgUrlDevice,
8058
+ }, mobile && /*#__PURE__*/React__default.createElement("source", {
8059
+ srcSet: mobile,
7902
8060
  media: "" + devices.mobile,
7903
8061
  "data-testid": "impact-mobile-image-source"
7904
- })), /*#__PURE__*/React__default.createElement("source", {
7905
- srcSet: bgUrlDesktop,
8062
+ }), /*#__PURE__*/React__default.createElement("source", {
8063
+ srcSet: desktop,
7906
8064
  media: "" + devices.desktop,
7907
8065
  "data-testid": "impact-desktop-image-source"
7908
8066
  }), /*#__PURE__*/React__default.createElement("img", {
7909
- src: bgUrlDesktop,
7910
- alt: bgImageAltText,
8067
+ src: desktop,
8068
+ alt: alt,
7911
8069
  "data-testid": "impact-image"
7912
- }))), /*#__PURE__*/React__default.createElement(ImpactGrid, null, children ? /*#__PURE__*/React__default.createElement(LogoWrapper$1, {
7913
- "data-testid": "impact-logo"
7914
- }, children) : null, text ? (/*#__PURE__*/React__default.createElement(TextWrapper$1, {
7915
- "data-testid": "impact-text"
7916
- }, /*#__PURE__*/React__default.createElement(Header, {
7917
- level: 3,
7918
- semanticLevel: semanticLevel
7919
- }, truncatedText))) : null, link ? (/*#__PURE__*/React__default.createElement(ButtonWrapper$2, {
8070
+ }));
8071
+ };
8072
+ var ImpactHeaderVideo = function ImpactHeaderVideo(_ref3) {
8073
+ var video = _ref3.video,
8074
+ poster = _ref3.poster;
8075
+ if (!video.desktop && !video.mobile) {
8076
+ return /*#__PURE__*/React__default.createElement(ImpactHeaderImage, Object.assign({}, poster));
8077
+ }
8078
+ return /*#__PURE__*/React__default.createElement(VideoWithControls, {
8079
+ video: video,
8080
+ poster: poster
8081
+ });
8082
+ };
8083
+ var useElementWidth = function useElementWidth() {
8084
+ var _React$useState = React__default.useState(undefined),
8085
+ width = _React$useState[0],
8086
+ setWidth = _React$useState[1];
8087
+ var observerRef = React__default.useRef(null);
8088
+ var ref = React__default.useCallback(function (node) {
8089
+ if (observerRef.current) {
8090
+ observerRef.current.disconnect();
8091
+ observerRef.current = null;
8092
+ }
8093
+ if (!node) return;
8094
+ observerRef.current = new ResizeObserver(function () {
8095
+ setWidth(node.offsetWidth);
8096
+ });
8097
+ observerRef.current.observe(node);
8098
+ }, []);
8099
+ return [ref, width];
8100
+ };
8101
+ var PageHeadingImpact = function PageHeadingImpact(_ref4) {
8102
+ var text = _ref4.text,
8103
+ link = _ref4.link,
8104
+ _ref4$sponsor = _ref4.sponsor,
8105
+ sponsor = _ref4$sponsor === void 0 ? true : _ref4$sponsor,
8106
+ customSponsorImage = _ref4.customSponsorImage,
8107
+ bgUrlDesktop = _ref4.bgUrlDesktop,
8108
+ bgUrlDevice = _ref4.bgUrlDevice,
8109
+ _ref4$bgImageAltText = _ref4.bgImageAltText,
8110
+ bgImageAltText = _ref4$bgImageAltText === void 0 ? '' : _ref4$bgImageAltText,
8111
+ videoUrlDesktop = _ref4.videoUrlDesktop,
8112
+ videoUrlMobile = _ref4.videoUrlMobile,
8113
+ className = _ref4.className;
8114
+ var _useViewport = useViewport(),
8115
+ isMobile = _useViewport.isMobile,
8116
+ hydrated = _useViewport.hydrated;
8117
+ var _useElementWidth = useElementWidth(),
8118
+ buttonRef = _useElementWidth[0],
8119
+ buttonWidth = _useElementWidth[1];
8120
+ var _useElementWidth2 = useElementWidth(),
8121
+ sponsorRef = _useElementWidth2[0],
8122
+ sponsorWidth = _useElementWidth2[1];
8123
+ var truncatedText = text && text.length > CHAR_LIMIT ? text.slice(0, CHAR_LIMIT).trimEnd() + "\u2026" : text;
8124
+ var _ref5 = link || {},
8125
+ linkText = _ref5.text,
8126
+ restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$k);
8127
+ var video = {
8128
+ elementId: 'impact-header-video',
8129
+ desktop: videoUrlDesktop,
8130
+ mobile: videoUrlMobile
8131
+ };
8132
+ var poster = {
8133
+ desktop: bgUrlDesktop,
8134
+ mobile: bgUrlDevice,
8135
+ alt: bgImageAltText
8136
+ };
8137
+ var sponsorContent = sponsor ? (/*#__PURE__*/React__default.createElement(Sponsorship, Object.assign({
8138
+ "data-testid": customSponsorImage ? 'impact-custom-sponsor' : undefined
8139
+ }, customSponsorImage != null ? customSponsorImage : {}))) : null;
8140
+ var hasButton = !isMobile && !!(link && linkText);
8141
+ var showSideColumns = hasButton || !!sponsor;
8142
+ var showTitleBar = !!(text || hasButton || sponsor);
8143
+ var renderSponsor = function renderSponsor() {
8144
+ if (isMobile) {
8145
+ if (!sponsorContent) return null;
8146
+ return /*#__PURE__*/React__default.createElement(SponsorWrapper, {
8147
+ "data-testid": "impact-sponsor"
8148
+ }, sponsorContent);
8149
+ }
8150
+ if (!showSideColumns) return null;
8151
+ return /*#__PURE__*/React__default.createElement(SponsorWrapper, {
8152
+ ref: sponsorRef,
8153
+ buttonWidth: buttonWidth,
8154
+ "data-testid": "impact-sponsor"
8155
+ }, sponsorContent);
8156
+ };
8157
+ if (!hydrated) return null;
8158
+ return /*#__PURE__*/React__default.createElement(HarmonicThemeProvider, {
8159
+ theme: ThemeType.Cinema
8160
+ }, showTitleBar ? (/*#__PURE__*/React__default.createElement(ImpactHeaderWrapper, {
8161
+ className: className
8162
+ }, /*#__PURE__*/React__default.createElement(ImpactTitleWrapper, {
8163
+ "data-testid": "impact-title-wrapper",
8164
+ sponsorPresent: !!sponsor,
8165
+ hasButton: hasButton
8166
+ }, !isMobile && showSideColumns ? (/*#__PURE__*/React__default.createElement(TitleButtonWrapper, {
8167
+ sponsorWidth: sponsorWidth
8168
+ }, hasButton ? (/*#__PURE__*/React__default.createElement(TitleButton, Object.assign({
8169
+ ref: buttonRef
8170
+ }, restLink, {
7920
8171
  "data-testid": "impact-link"
7921
- }, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restLink), linkText))) : null), scrollHref ? (/*#__PURE__*/React__default.createElement(ScrollDownWrapper, {
7922
- "data-testid": "impact-scroll-link"
7923
- }, /*#__PURE__*/React__default.createElement(TabLink, {
7924
- iconName: "Arrow",
7925
- iconDirection: "down",
7926
- href: scrollHref,
7927
- color: ThemeColor['base-white'],
7928
- hoverColor: ThemeColor['base-white']
7929
- }, "Scroll Down"))) : null);
8172
+ }), linkText)) : null)) : null, text ? (/*#__PURE__*/React__default.createElement(ImpactTitle, {
8173
+ size: "large",
8174
+ color: "white",
8175
+ hasColumns: !isMobile && showSideColumns
8176
+ }, truncatedText)) : null, renderSponsor()))) : null, /*#__PURE__*/React__default.createElement(ImpactHeaderAssetWrapper, {
8177
+ className: className
8178
+ }, /*#__PURE__*/React__default.createElement(ImpactHeaderVideo, {
8179
+ video: video,
8180
+ poster: poster
8181
+ }), isMobile && link && linkText ? (/*#__PURE__*/React__default.createElement(MobileButtonWrapper, null, /*#__PURE__*/React__default.createElement(TitleButton, Object.assign({}, restLink), linkText))) : null));
7930
8182
  };
7931
8183
 
7932
- var _templateObject$S, _templateObject2$G, _templateObject3$u, _templateObject4$q, _templateObject5$l;
7933
- var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n grid-template-rows: 48px max-content max-content;\n }\n"])), function (_ref) {
8184
+ var _templateObject$T, _templateObject2$H, _templateObject3$v, _templateObject4$r, _templateObject5$l;
8185
+ var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n grid-template-rows: 48px max-content max-content;\n }\n"])), function (_ref) {
7934
8186
  var color = _ref.color;
7935
8187
  return "\n background-color: " + (color ? "var(--base-color-" + color + ")" : 'var(--base-color-core)') + ";\n color: " + (color === Colors.White ? 'var(--base-color-black)' : 'var(--base-color-white)') + ";\n ";
7936
8188
  }, devices.mobileAndTablet);
7937
- var LeftPanel = /*#__PURE__*/styled.div(_templateObject2$G || (_templateObject2$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n box-sizing: border-box;\n height: 100%;\n display: grid;\n grid-auto-rows: 90% 1fr;\n gap: 0px 36px;\n align-items: center;\n\n @media ", " {\n grid-area: ", ";\n }\n"])), function (_ref2) {
8189
+ var LeftPanel = /*#__PURE__*/styled.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n box-sizing: border-box;\n height: 100%;\n display: grid;\n grid-auto-rows: 90% 1fr;\n gap: 0px 36px;\n align-items: center;\n\n @media ", " {\n grid-area: ", ";\n }\n"])), function (_ref2) {
7938
8190
  var hasImage = _ref2.hasImage;
7939
8191
  return hasImage ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
7940
8192
  }, devices.mobileAndTablet, function (_ref3) {
7941
8193
  var hasImage = _ref3.hasImage;
7942
8194
  return hasImage ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
7943
8195
  });
7944
- var RightPanel = /*#__PURE__*/styled.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--base-color-black);\n\n @media ", " {\n grid-area: 2 / 1 / 3 / 15;\n }\n"])), devices.mobileAndTablet);
7945
- var InfoWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 36px;\n max-height: 33vw;\n overflow: hidden;\n\n :first-child * {\n margin-block-start: 0;\n }\n\n @media ", " {\n margin: 36px 20px;\n max-height: unset;\n }\n"])), devices.mobileAndTablet);
7946
- var ScrollDownWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$l || (_templateObject5$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0 0 25px 36px;\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
8196
+ var RightPanel = /*#__PURE__*/styled.div(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--base-color-black);\n\n @media ", " {\n grid-area: 2 / 1 / 3 / 15;\n }\n"])), devices.mobileAndTablet);
8197
+ var InfoWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$r || (_templateObject4$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 36px;\n max-height: 33vw;\n overflow: hidden;\n\n :first-child * {\n margin-block-start: 0;\n }\n\n @media ", " {\n margin: 36px 20px;\n max-height: unset;\n }\n"])), devices.mobileAndTablet);
8198
+ var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject5$l || (_templateObject5$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0 0 25px 36px;\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
7947
8199
 
7948
8200
  var PageHeadingPanel = function PageHeadingPanel(_ref) {
7949
8201
  var _image$src, _image$alt;
@@ -7957,7 +8209,7 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
7957
8209
  "data-testid": "wrapper"
7958
8210
  }, /*#__PURE__*/React__default.createElement(LeftPanel, {
7959
8211
  hasImage: hasImage
7960
- }, /*#__PURE__*/React__default.createElement(InfoWrapper$1, null, info), scrollTo && (/*#__PURE__*/React__default.createElement(ScrollDownWrapper$1, {
8212
+ }, /*#__PURE__*/React__default.createElement(InfoWrapper$1, null, info), scrollTo && (/*#__PURE__*/React__default.createElement(ScrollDownWrapper, {
7961
8213
  "data-testid": "scroll-link"
7962
8214
  }, /*#__PURE__*/React__default.createElement(TabLink, {
7963
8215
  iconName: "Arrow",
@@ -7973,11 +8225,11 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
7973
8225
  })))));
7974
8226
  };
7975
8227
 
7976
- var _templateObject$T, _templateObject2$H, _templateObject3$v, _templateObject4$r, _templateObject5$m, _templateObject6$f, _templateObject7$b, _templateObject8$7, _templateObject9$4, _templateObject0$4, _templateObject1$3;
7977
- var Wrapper$3 = /*#__PURE__*/styled.section(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
7978
- var ImageWrapper = /*#__PURE__*/styled.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n picture,\n img {\n width: 100%;\n height: 100%;\n }\n"])));
7979
- var SponsorWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
7980
- var ImageButtonWrapper = /*#__PURE__*/styled.div(_templateObject4$r || (_templateObject4$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: var(--grid-outer-margin);\n bottom: 20px;\n z-index: 10;\n\n @media ", " {\n right: var(--grid-margin);\n bottom: 10px;\n }\n"])), devices.tablet);
8228
+ var _templateObject$U, _templateObject2$I, _templateObject3$w, _templateObject4$s, _templateObject5$m, _templateObject6$f, _templateObject7$b, _templateObject8$7, _templateObject9$4, _templateObject0$4, _templateObject1$3;
8229
+ var Wrapper$3 = /*#__PURE__*/styled.section(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
8230
+ var ImageWrapper = /*#__PURE__*/styled.div(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n picture,\n img {\n width: 100%;\n height: 100%;\n }\n"])));
8231
+ var SponsorWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$w || (_templateObject3$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
8232
+ var ImageButtonWrapper = /*#__PURE__*/styled.div(_templateObject4$s || (_templateObject4$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: var(--grid-outer-margin);\n bottom: 20px;\n z-index: 10;\n\n @media ", " {\n right: var(--grid-margin);\n bottom: 10px;\n }\n"])), devices.tablet);
7981
8233
  var ContentSection = /*#__PURE__*/styled.div(_templateObject5$m || (_templateObject5$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--heading-promo-bg-color);\n border-bottom: ", ";\n display: ", ";\n\n @media ", " {\n padding: 12px 0 20px;\n }\n"])), function (_ref) {
7982
8234
  var theme = _ref.theme;
7983
8235
  return theme == ThemeType.Cinema ? '2px solid var(--color-base-light-grey)' : 'none';
@@ -8187,7 +8439,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
8187
8439
  })))))))))));
8188
8440
  };
8189
8441
 
8190
- var _templateObject$U, _templateObject2$I, _templateObject3$w, _templateObject4$s;
8442
+ var _templateObject$V, _templateObject2$J, _templateObject3$x, _templateObject4$t;
8191
8443
  var GRID = {
8192
8444
  desktop: {
8193
8445
  leftWithImage: '1 / 1 / 3 / 7',
@@ -8200,19 +8452,19 @@ var GRID = {
8200
8452
  right: '2 / 1 / 3 / 15'
8201
8453
  }
8202
8454
  };
8203
- var HighlightPanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n background-color: ", ";\n color: var(--color-base-white);\n"])), function (_ref) {
8455
+ var HighlightPanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n background-color: ", ";\n color: var(--color-base-white);\n"])), function (_ref) {
8204
8456
  var $background = _ref.$background;
8205
8457
  return "var(--color-" + $background + ")";
8206
8458
  });
8207
- var LeftPanel$1 = /*#__PURE__*/styled.div(_templateObject2$I || (_templateObject2$I = /*#__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) {
8459
+ var LeftPanel$1 = /*#__PURE__*/styled.div(_templateObject2$J || (_templateObject2$J = /*#__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) {
8208
8460
  var hasImage = _ref2.hasImage;
8209
8461
  return hasImage ? GRID.desktop.leftWithImage : GRID.desktop.leftNoImage;
8210
8462
  }, devices.mobileAndTablet, function (_ref3) {
8211
8463
  var hasImage = _ref3.hasImage;
8212
8464
  return hasImage ? GRID.mobile.leftWithImage : GRID.mobile.leftNoImage;
8213
8465
  });
8214
- var RightPanel$1 = /*#__PURE__*/styled.div(_templateObject3$w || (_templateObject3$w = /*#__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);
8215
- var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject4$s || (_templateObject4$s = /*#__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);
8466
+ var RightPanel$1 = /*#__PURE__*/styled.div(_templateObject3$x || (_templateObject3$x = /*#__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);
8467
+ var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject4$t || (_templateObject4$t = /*#__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);
8216
8468
 
8217
8469
  var PageHeadingHighlight = function PageHeadingHighlight(_ref) {
8218
8470
  var _image$src, _image$alt;
@@ -8235,10 +8487,10 @@ var PageHeadingHighlight = function PageHeadingHighlight(_ref) {
8235
8487
  })))));
8236
8488
  };
8237
8489
 
8238
- var _templateObject$V, _templateObject2$J, _templateObject3$x, _templateObject5$n, _templateObject6$g, _templateObject7$c, _templateObject8$8, _templateObject9$5, _templateObject0$5;
8239
- var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$V || (_templateObject$V = /*#__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);
8240
- var BrandingTextBody = /*#__PURE__*/styled.div(_templateObject2$J || (_templateObject2$J = /*#__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"])));
8241
- var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$x || (_templateObject3$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
8490
+ var _templateObject$W, _templateObject2$K, _templateObject3$y, _templateObject5$n, _templateObject6$g, _templateObject7$c, _templateObject8$8, _templateObject9$5, _templateObject0$5;
8491
+ var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$W || (_templateObject$W = /*#__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);
8492
+ var BrandingTextBody = /*#__PURE__*/styled.div(_templateObject2$K || (_templateObject2$K = /*#__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"])));
8493
+ var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$y || (_templateObject3$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
8242
8494
  var CompactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject5$n || (_templateObject5$n = /*#__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);
8243
8495
  var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$g || (_templateObject6$g = /*#__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) {
8244
8496
  var invert = _ref.invert,
@@ -8349,7 +8601,7 @@ var CompactHeaderBranding = function CompactHeaderBranding(_ref) {
8349
8601
  };
8350
8602
 
8351
8603
  var _excluded$l = ["text"];
8352
- var useResponsiveVideo = function useResponsiveVideo(video, poster) {
8604
+ var useResponsiveVideo$1 = function useResponsiveVideo(video, poster) {
8353
8605
  var mobileVideo = video.mobile || video.desktop;
8354
8606
  var desktopVideo = video.desktop || video.mobile;
8355
8607
  var mobilePoster = poster.mobile || poster.desktop;
@@ -8370,10 +8622,10 @@ var useResponsiveVideo = function useResponsiveVideo(video, poster) {
8370
8622
  videoUrl: videoUrl
8371
8623
  };
8372
8624
  };
8373
- var VideoWithControls = function VideoWithControls(_ref) {
8625
+ var VideoWithControls$1 = function VideoWithControls(_ref) {
8374
8626
  var video = _ref.video,
8375
8627
  poster = _ref.poster;
8376
- var _useResponsiveVideo = useResponsiveVideo(video, poster),
8628
+ var _useResponsiveVideo = useResponsiveVideo$1(video, poster),
8377
8629
  posterUrl = _useResponsiveVideo.posterUrl,
8378
8630
  videoUrl = _useResponsiveVideo.videoUrl;
8379
8631
  var isIOS = useIOS();
@@ -8426,7 +8678,7 @@ var CompactHeaderVideo = function CompactHeaderVideo(_ref3) {
8426
8678
  if (!video.desktop && !video.mobile) {
8427
8679
  return /*#__PURE__*/React__default.createElement(CompactHeaderImage, Object.assign({}, poster));
8428
8680
  }
8429
- return /*#__PURE__*/React__default.createElement(VideoWithControls, {
8681
+ return /*#__PURE__*/React__default.createElement(VideoWithControls$1, {
8430
8682
  video: video,
8431
8683
  poster: poster
8432
8684
  });
@@ -8489,11 +8741,11 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
8489
8741
  }), linkText))))));
8490
8742
  };
8491
8743
 
8492
- var _templateObject$W, _templateObject2$K, _templateObject3$y, _templateObject4$t, _templateObject5$o, _templateObject6$h, _templateObject7$d;
8493
- var HighlightsGrid = /*#__PURE__*/styled(Grid)(_templateObject$W || (_templateObject$W = /*#__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);
8494
- var HighlightTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n h1 {\n margin: 0 0 8px 0;\n }\n p {\n text-transform: uppercase;\n }\n"])));
8495
- var HighlightTextWrapper = /*#__PURE__*/styled.div(_templateObject3$y || (_templateObject3$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobile);
8496
- var HighlightsInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$t || (_templateObject4$t = /*#__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) {
8744
+ var _templateObject$X, _templateObject2$L, _templateObject3$z, _templateObject4$u, _templateObject5$o, _templateObject6$h, _templateObject7$d;
8745
+ var HighlightsGrid = /*#__PURE__*/styled(Grid)(_templateObject$X || (_templateObject$X = /*#__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);
8746
+ var HighlightTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$L || (_templateObject2$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n h1 {\n margin: 0 0 8px 0;\n }\n p {\n text-transform: uppercase;\n }\n"])));
8747
+ var HighlightTextWrapper = /*#__PURE__*/styled.div(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobile);
8748
+ var HighlightsInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__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) {
8497
8749
  var hasImages = _ref.hasImages;
8498
8750
  return hasImages ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
8499
8751
  }, devices.mobile, function (_ref2) {
@@ -8568,10 +8820,10 @@ var PageHeadingHighlightCarousel = function PageHeadingHighlightCarousel(_ref) {
8568
8820
  }))))));
8569
8821
  };
8570
8822
 
8571
- var _templateObject$X, _templateObject2$L, _templateObject3$z, _templateObject5$p, _templateObject6$i, _templateObject7$e, _templateObject8$9;
8572
- var linkButtonStyles = /*#__PURE__*/css(_templateObject$X || (_templateObject$X = /*#__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"])));
8573
- var PageNav = /*#__PURE__*/styled.a(_templateObject2$L || (_templateObject2$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
8574
- var PaginationLink = /*#__PURE__*/styled.a(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
8823
+ var _templateObject$Y, _templateObject2$M, _templateObject3$A, _templateObject5$p, _templateObject6$i, _templateObject7$e, _templateObject8$9;
8824
+ var linkButtonStyles = /*#__PURE__*/css(_templateObject$Y || (_templateObject$Y = /*#__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"])));
8825
+ var PageNav = /*#__PURE__*/styled.a(_templateObject2$M || (_templateObject2$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
8826
+ var PaginationLink = /*#__PURE__*/styled.a(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
8575
8827
  var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject5$p || (_templateObject5$p = /*#__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"])));
8576
8828
  var LastPageItem = /*#__PURE__*/styled.li(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
8577
8829
  var PreviousPageItem = /*#__PURE__*/styled.li(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
@@ -8727,19 +8979,19 @@ var Pagination = function Pagination(_ref) {
8727
8979
  }))))));
8728
8980
  };
8729
8981
 
8730
- var _templateObject$Y;
8731
- var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$Y || (_templateObject$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 40px 36px;\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: ", ";\n }\n"])), devices.mobile, devices.tablet, devices.largeDesktop, function (_ref) {
8982
+ var _templateObject$Z;
8983
+ var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 40px 36px;\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: ", ";\n }\n"])), devices.mobile, devices.tablet, devices.largeDesktop, function (_ref) {
8732
8984
  var $largeDesktopColumns = _ref.$largeDesktopColumns;
8733
8985
  return "repeat(" + ($largeDesktopColumns != null ? $largeDesktopColumns : 4) + ", 1fr)";
8734
8986
  });
8735
8987
 
8736
- var _templateObject$Z, _templateObject2$M;
8737
- var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-primary-black);\n }\n grid-area: role-person;\n break-inside: avoid;\n"])));
8738
- var RoleContent = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject2$M || (_templateObject2$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-base-dark-grey);\n }\n overflow-wrap: break-word;\n padding-bottom: 4px;\n"])));
8739
-
8740
8988
  var _templateObject$_, _templateObject2$N;
8741
- var PersonLink = /*#__PURE__*/styled.a(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: underline;\n text-underline-offset: 6px;\n\n && {\n color: var(--color-primary-black);\n\n :hover {\n color: var(--color-rbo-black-hovered);\n :after {\n color: var(--color-primary-black);\n }\n }\n\n :visited {\n color: var(--color-primary-black);\n }\n }\n"])));
8742
- var ReplacementContent = /*#__PURE__*/styled.span(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--base-color-dark-grey);\n }\n"])));
8989
+ var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-primary-black);\n }\n grid-area: role-person;\n break-inside: avoid;\n"])));
8990
+ var RoleContent = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-base-dark-grey);\n }\n overflow-wrap: break-word;\n padding-bottom: 4px;\n"])));
8991
+
8992
+ var _templateObject$$, _templateObject2$O;
8993
+ var PersonLink = /*#__PURE__*/styled.a(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: underline;\n text-underline-offset: 6px;\n\n && {\n color: var(--color-primary-black);\n\n :hover {\n color: var(--color-rbo-black-hovered);\n :after {\n color: var(--color-primary-black);\n }\n }\n\n :visited {\n color: var(--color-primary-black);\n }\n }\n"])));
8994
+ var ReplacementContent = /*#__PURE__*/styled.span(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--base-color-dark-grey);\n }\n"])));
8743
8995
 
8744
8996
  var Person = function Person(_ref) {
8745
8997
  var person = _ref.person,
@@ -8762,7 +9014,7 @@ var PersonDetails = function PersonDetails(_ref) {
8762
9014
  var _role$people;
8763
9015
  var role = _ref.role,
8764
9016
  className = _ref.className;
8765
- return /*#__PURE__*/React__default.createElement(TextWrapper$2, {
9017
+ return /*#__PURE__*/React__default.createElement(TextWrapper$1, {
8766
9018
  className: className
8767
9019
  }, /*#__PURE__*/React__default.createElement(RoleContent, {
8768
9020
  title: "role",
@@ -8778,9 +9030,9 @@ var PersonDetails = function PersonDetails(_ref) {
8778
9030
  })));
8779
9031
  };
8780
9032
 
8781
- var _templateObject$$, _templateObject2$O;
8782
- var PersonWrapper$1 = /*#__PURE__*/styled.div(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 82px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 16px;\n"])));
8783
- var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 82px;\n height: 82px;\n filter: ", ";\n }\n"])), function (_ref) {
9033
+ var _templateObject$10, _templateObject2$P;
9034
+ var PersonWrapper$1 = /*#__PURE__*/styled.div(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 82px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 16px;\n"])));
9035
+ var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 82px;\n height: 82px;\n filter: ", ";\n }\n"])), function (_ref) {
8784
9036
  var greyscale = _ref.greyscale;
8785
9037
  return greyscale ? 'grayscale(100%)' : 'none';
8786
9038
  });
@@ -8829,14 +9081,14 @@ var PeopleListing = function PeopleListing(_ref) {
8829
9081
  }));
8830
9082
  };
8831
9083
 
8832
- var _templateObject$10, _templateObject2$P, _templateObject3$A, _templateObject4$u;
8833
- var ReplacementWrapper = /*#__PURE__*/styled.div(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
8834
- var CreditListingWrapper = /*#__PURE__*/styled(PeopleListingGrid)(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n\n grid-template-columns: ", ";\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: repeat(2, 1fr);\n }\n"])), function (_ref) {
9084
+ var _templateObject$11, _templateObject2$Q, _templateObject3$B, _templateObject4$v;
9085
+ var ReplacementWrapper = /*#__PURE__*/styled.div(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
9086
+ var CreditListingWrapper = /*#__PURE__*/styled(PeopleListingGrid)(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n\n grid-template-columns: ", ";\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: repeat(2, 1fr);\n }\n"])), function (_ref) {
8835
9087
  var columnCount = _ref.columnCount;
8836
9088
  return "repeat(" + columnCount + ", 1fr)";
8837
9089
  }, devices.mobile, devices.tablet);
8838
- var DescriptionWrapper = /*#__PURE__*/styled.div(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 25px;\n margin-bottom: 3px;\n }\n"])));
8839
- var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n min-height: 1.5em;\n"])));
9090
+ var DescriptionWrapper = /*#__PURE__*/styled.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 25px;\n margin-bottom: 3px;\n }\n"])));
9091
+ var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n min-height: 1.5em;\n"])));
8840
9092
 
8841
9093
  // Get the total character length of a property in an array of objects
8842
9094
  var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
@@ -8925,7 +9177,7 @@ var CreditListing = function CreditListing(_ref) {
8925
9177
  columnSpanSmallDevice: 1,
8926
9178
  key: "credit-entry-" + name + "-" + index,
8927
9179
  "data-testid": "credit-entry"
8928
- }, /*#__PURE__*/React__default.createElement(TextWrapper$2, null, /*#__PURE__*/React__default.createElement(RoleWrapper, {
9180
+ }, /*#__PURE__*/React__default.createElement(TextWrapper$1, null, /*#__PURE__*/React__default.createElement(RoleWrapper, {
8929
9181
  title: "role",
8930
9182
  "data-roh": dataROH
8931
9183
  }, /*#__PURE__*/React__default.createElement(Overline, {
@@ -8963,8 +9215,8 @@ var CreditListing = function CreditListing(_ref) {
8963
9215
  }, creditEntries);
8964
9216
  };
8965
9217
 
8966
- var _templateObject$11;
8967
- var PolicyLinksTextLinkWrapper = /*#__PURE__*/styled(TextLink)(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-sans);\n font-size: 17px;\n line-height: 24px;\n letter-spacing: 0.4px;\n color: var(--color-base-white);\n border-bottom: unset;\n text-decoration: underline;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n margin-bottom: 0;\n padding-bottom: 0;\n"])));
9218
+ var _templateObject$12;
9219
+ var PolicyLinksTextLinkWrapper = /*#__PURE__*/styled(TextLink)(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-sans);\n font-size: 17px;\n line-height: 24px;\n letter-spacing: 0.4px;\n color: var(--color-base-white);\n border-bottom: unset;\n text-decoration: underline;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n margin-bottom: 0;\n padding-bottom: 0;\n"])));
8968
9220
 
8969
9221
  var PolicyLinks = function PolicyLinks(_ref) {
8970
9222
  var items = _ref.items;
@@ -8982,14 +9234,14 @@ var PolicyLinks = function PolicyLinks(_ref) {
8982
9234
  }));
8983
9235
  };
8984
9236
 
8985
- var _templateObject$12, _templateObject3$B, _templateObject4$v, _templateObject5$q, _templateObject6$j, _templateObject7$f, _templateObject8$a, _templateObject9$6, _templateObject0$6, _templateObject1$4, _templateObject10$3, _templateObject11$2, _templateObject12$2, _templateObject13$1, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
9237
+ var _templateObject$13, _templateObject3$C, _templateObject4$w, _templateObject5$q, _templateObject6$j, _templateObject7$f, _templateObject8$a, _templateObject9$6, _templateObject0$6, _templateObject1$4, _templateObject10$3, _templateObject11$2, _templateObject12$2, _templateObject13$1, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
8986
9238
  var LENGTH_TEXT = 28;
8987
9239
  var LENGTH_TEXT_TABLET$1 = 12;
8988
9240
  var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
8989
9241
  var GridTemplateImageToRight = "'. . left left left left left . right right right right right right right right'";
8990
9242
  var GridTemplateAsCard = "'. . left left left left left right right right right right right right . . '";
8991
9243
  var GridTemplateAsCardTablet = "'. . left left left left left left left right right right right right . . '";
8992
- var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$12 || (_templateObject$12 = /*#__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\n /* Overwrite template for card */\n ", "\n"])), function (_ref) {
9244
+ var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$13 || (_templateObject$13 = /*#__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\n /* Overwrite template for card */\n ", "\n"])), function (_ref) {
8993
9245
  var imageToLeft = _ref.imageToLeft;
8994
9246
  return imageToLeft ? GridTemplateImageToLeft : GridTemplateImageToRight;
8995
9247
  }, devices.tablet, function (_ref2) {
@@ -8999,7 +9251,7 @@ var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$12 || (_templa
8999
9251
  var asCard = _ref3.asCard;
9000
9252
  return asCard ? "\n grid-template-areas: " + GridTemplateAsCard + ";\n @media " + devices.tablet + " {\n grid-template-areas: " + GridTemplateAsCardTablet + ";\n }\n " : "";
9001
9253
  });
9002
- var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 24px;\n\n ", ";\n\n ", "\n\n @media ", " {\n gap: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref4) {
9254
+ var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 24px;\n\n ", ";\n\n ", "\n\n @media ", " {\n gap: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref4) {
9003
9255
  var hasTextLinks = _ref4.hasTextLinks;
9004
9256
  return "margin-top: " + (hasTextLinks ? '0' : '24px') + ";";
9005
9257
  }, function (_ref5) {
@@ -9023,7 +9275,7 @@ var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject3$B || (_templat
9023
9275
  }
9024
9276
  return '';
9025
9277
  });
9026
- var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n\n ", "\n"])), function (_ref7) {
9278
+ var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n\n ", "\n"])), function (_ref7) {
9027
9279
  var marginBottom = _ref7.marginBottom;
9028
9280
  return marginBottom + "px";
9029
9281
  }, function (_ref8) {
@@ -9063,7 +9315,7 @@ var _excluded$m = ["text"],
9063
9315
  _excluded3$1 = ["text"];
9064
9316
  var _buttonTypeToButton$1;
9065
9317
  var LENGTH_TEXT$1 = 28;
9066
- var LENGTH_TEXT_PARAGRAPH = 130;
9318
+ var LENGTH_TEXT_PARAGRAPH = 185;
9067
9319
  var buttonTypeToButton$1 = (_buttonTypeToButton$1 = {}, _buttonTypeToButton$1[ButtonType.Primary] = PrimaryButton, _buttonTypeToButton$1[ButtonType.Secondary] = SecondaryButton, _buttonTypeToButton$1[ButtonType.Tertiary] = TertiaryButton, _buttonTypeToButton$1);
9068
9320
  var PromoWithTags = function PromoWithTags(_ref) {
9069
9321
  var _ref$imagePosition = _ref.imagePosition,
@@ -9254,25 +9506,25 @@ var PromoWithTags = function PromoWithTags(_ref) {
9254
9506
  }))));
9255
9507
  };
9256
9508
 
9257
- var _templateObject$13, _templateObject2$Q, _templateObject3$C, _templateObject4$w, _templateObject5$r, _templateObject6$k, _templateObject7$g;
9509
+ var _templateObject$14, _templateObject2$R, _templateObject3$D, _templateObject4$x, _templateObject5$r, _templateObject6$k, _templateObject7$g;
9258
9510
  var LENGTH_TEXT$2 = 28;
9259
9511
  var LENGTH_TEXT_TABLET$2 = 10;
9260
- var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$13 || (_templateObject$13 = /*#__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) {
9512
+ var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$14 || (_templateObject$14 = /*#__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) {
9261
9513
  var imageToLeft = _ref.imageToLeft;
9262
9514
  return imageToLeft ? "'left left left left left left left left . right right right right right . .'" : "'. . left left left left left . right right right right right right right right'";
9263
9515
  }, devices.tablet, function (_ref2) {
9264
9516
  var imageToLeft = _ref2.imageToLeft;
9265
9517
  return imageToLeft ? "'left left left left left left left right right right right right right .'" : "'. left left left left left left right right right right right right right'";
9266
9518
  }, devices.mobile);
9267
- var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref3) {
9519
+ var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref3) {
9268
9520
  var imageToLeft = _ref3.imageToLeft;
9269
9521
  return imageToLeft ? 'left' : 'right';
9270
9522
  }, devices.mobile);
9271
- var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n }\n"])), function (_ref4) {
9523
+ var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n }\n"])), function (_ref4) {
9272
9524
  var imageToLeft = _ref4.imageToLeft;
9273
9525
  return imageToLeft ? 'right' : 'left';
9274
9526
  }, devices.mobile);
9275
- var HarmonicHeaderWithWrapper$1 = /*#__PURE__*/styled(HarmonicHeader)(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 32px;\n\n @media ", " {\n padding-bottom: 24px;\n }\n"])), devices.mobile);
9527
+ var HarmonicHeaderWithWrapper$1 = /*#__PURE__*/styled(HarmonicHeader)(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 32px;\n\n @media ", " {\n padding-bottom: 24px;\n }\n"])), devices.mobile);
9276
9528
  var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
9277
9529
  var BodyCopyHarmonicWithWrapper$2 = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject6$k || (_templateObject6$k = /*#__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);
9278
9530
  var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$g || (_templateObject7$g = /*#__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) {
@@ -9297,8 +9549,8 @@ var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$g || (_templat
9297
9549
  return '';
9298
9550
  });
9299
9551
 
9300
- var _templateObject$14;
9301
- var VideoContainer = /*#__PURE__*/styled.div(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n video {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
9552
+ var _templateObject$15;
9553
+ var VideoContainer = /*#__PURE__*/styled.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n video {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
9302
9554
  var _ref$aspectRatio = _ref.aspectRatio,
9303
9555
  aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
9304
9556
  return aspectRatio;
@@ -9329,7 +9581,7 @@ var getAspectRatioFromVideo = function getAspectRatioFromVideo(video) {
9329
9581
  return AspectRatio[aspectRatioKey] || AspectRatio['16:9'];
9330
9582
  };
9331
9583
 
9332
- var VideoWithControls$1 = function VideoWithControls(_ref) {
9584
+ var VideoWithControls$2 = function VideoWithControls(_ref) {
9333
9585
  var video = _ref.video,
9334
9586
  settings = _ref.settings;
9335
9587
  var videoRef = useRef(null);
@@ -9404,7 +9656,7 @@ var PromoChild = function PromoChild(_ref) {
9404
9656
  }, isImage && (/*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
9405
9657
  aspectRatio: AspectRatio['4:3'],
9406
9658
  "data-testid": "AspectRatioWrapper"
9407
- }, children)), isVideo && /*#__PURE__*/React__default.createElement(VideoWithControls$1, {
9659
+ }, children)), isVideo && /*#__PURE__*/React__default.createElement(VideoWithControls$2, {
9408
9660
  video: children,
9409
9661
  settings: videoSettings
9410
9662
  }));
@@ -9467,7 +9719,7 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
9467
9719
  size: titleSize,
9468
9720
  hierarchy: titleHierarchy
9469
9721
  }, title), subtitle ? /*#__PURE__*/React__default.createElement(HarmonicSubtitleWithWrapper$1, {
9470
- size: "medium"
9722
+ size: "small"
9471
9723
  }, subtitle) : null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$2, {
9472
9724
  size: "large",
9473
9725
  dangerouslySetInnerHTML: {
@@ -9480,8 +9732,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
9480
9732
  }, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? (/*#__PURE__*/React__default.createElement(TertiaryButton, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate)) : null)) : null));
9481
9733
  };
9482
9734
 
9483
- var _templateObject$15;
9484
- var RadioGroupContainer = /*#__PURE__*/styled.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 30px;\n"])));
9735
+ var _templateObject$16;
9736
+ var RadioGroupContainer = /*#__PURE__*/styled.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 30px;\n"])));
9485
9737
 
9486
9738
  /**
9487
9739
  * DEPRECATED. Use RadioGroup2 instead
@@ -9536,9 +9788,9 @@ var RadioGroup = function RadioGroup(_ref) {
9536
9788
  })));
9537
9789
  };
9538
9790
 
9539
- var _templateObject$16, _templateObject2$R, _templateObject3$D;
9540
- var Container$3 = /*#__PURE__*/styled.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
9541
- var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
9791
+ var _templateObject$17, _templateObject2$S, _templateObject3$E;
9792
+ var Container$3 = /*#__PURE__*/styled.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
9793
+ var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
9542
9794
  var horizontalMode = _ref.horizontalMode;
9543
9795
  if (horizontalMode) return 'row';
9544
9796
  return 'column';
@@ -9546,7 +9798,7 @@ var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$R || (_templateObjec
9546
9798
  var gap = _ref2.gap;
9547
9799
  return gap + "px";
9548
9800
  });
9549
- var ErrorLabel$4 = /*#__PURE__*/styled.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref3) {
9801
+ var ErrorLabel$4 = /*#__PURE__*/styled.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref3) {
9550
9802
  var darkMode = _ref3.darkMode;
9551
9803
  if (darkMode) return 'var(--base-color-white)';
9552
9804
  return 'var(--base-color-errorstate)';
@@ -9623,10 +9875,10 @@ var RadioGroup2 = function RadioGroup2(_ref) {
9623
9875
  }, error))));
9624
9876
  };
9625
9877
 
9626
- var _templateObject$17, _templateObject2$S, _templateObject3$E;
9627
- var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-light-grey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
9628
- var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.3s ease-in-out;\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"])));
9629
- var SvgContainer$3 = /*#__PURE__*/styled.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: end;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n padding-left: 50px;\n }\n\n cursor: pointer;\n\n @media ", " {\n padding-left: 20px;\n }\n"])), devices.mobile);
9878
+ var _templateObject$18, _templateObject2$T, _templateObject3$F;
9879
+ var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-light-grey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
9880
+ var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.3s ease-in-out;\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"])));
9881
+ var SvgContainer$3 = /*#__PURE__*/styled.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: end;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n padding-left: 50px;\n }\n\n cursor: pointer;\n\n @media ", " {\n padding-left: 20px;\n }\n"])), devices.mobile);
9630
9882
 
9631
9883
  /* eslint-disable react/no-danger */
9632
9884
  var StatusBanner = function StatusBanner(_ref) {
@@ -9682,8 +9934,8 @@ var StatusBanner = function StatusBanner(_ref) {
9682
9934
  return null;
9683
9935
  };
9684
9936
 
9685
- var _templateObject$18;
9686
- var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 30px 0;\n\n & > div {\n row-gap: 0;\n }\n\n & h1,\n & h2 {\n margin: 16px 0;\n white-space: pre-wrap;\n }\n\n @media ", " {\n & h1,\n & h2 {\n margin: 12px 0;\n }\n }\n\n & div {\n margin-block-start: 0;\n }\n"])), devices.mobile);
9937
+ var _templateObject$19;
9938
+ var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 30px 0;\n\n & > div {\n row-gap: 0;\n }\n\n & h1,\n & h2 {\n margin: 16px 0;\n white-space: pre-wrap;\n }\n\n @media ", " {\n & h1,\n & h2 {\n margin: 12px 0;\n }\n }\n\n & div {\n margin-block-start: 0;\n }\n"])), devices.mobile);
9687
9939
 
9688
9940
  /* ~~~~~~~ new harmonic types ~~~~~~~ */
9689
9941
  var HarmonicSize = {
@@ -9725,8 +9977,8 @@ var SectionTitle = function SectionTitle(_ref) {
9725
9977
  }, description)))));
9726
9978
  };
9727
9979
 
9728
- var _templateObject$19, _templateObject2$T, _templateObject3$F, _templateObject4$x, _templateObject5$s, _templateObject6$l, _templateObject7$h, _templateObject8$b, _templateObject9$7, _templateObject0$7, _templateObject1$5;
9729
- var stateStyles = /*#__PURE__*/css(_templateObject$19 || (_templateObject$19 = /*#__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) {
9980
+ var _templateObject$1a, _templateObject2$U, _templateObject3$G, _templateObject4$y, _templateObject5$s, _templateObject6$l, _templateObject7$h, _templateObject8$b, _templateObject9$7, _templateObject0$7, _templateObject1$5;
9981
+ var stateStyles = /*#__PURE__*/css(_templateObject$1a || (_templateObject$1a = /*#__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) {
9730
9982
  var theme = _ref.theme;
9731
9983
  return "3px solid " + theme.colors.lapisLazuli;
9732
9984
  }, function (_ref2) {
@@ -9736,12 +9988,12 @@ var stateStyles = /*#__PURE__*/css(_templateObject$19 || (_templateObject$19 = /
9736
9988
  var theme = _ref3.theme;
9737
9989
  return theme.colors.lightgrey;
9738
9990
  });
9739
- var borderStyles = /*#__PURE__*/css(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-radius: 0;\n outline: 1px solid ", ";\n"])), function (_ref4) {
9991
+ var borderStyles = /*#__PURE__*/css(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-radius: 0;\n outline: 1px solid ", ";\n"])), function (_ref4) {
9740
9992
  var theme = _ref4.theme;
9741
9993
  return theme.colors.darkgrey;
9742
9994
  });
9743
- var noMarginAndPaddingStyles = /*#__PURE__*/css(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
9744
- var listItemStyles = /*#__PURE__*/css(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style: none;\n user-select: none;\n"])));
9995
+ var noMarginAndPaddingStyles = /*#__PURE__*/css(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
9996
+ var listItemStyles = /*#__PURE__*/css(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style: none;\n user-select: none;\n"])));
9745
9997
  var ArrowIcon = /*#__PURE__*/styled(Icon).attrs(function (_ref5) {
9746
9998
  var theme = _ref5.theme;
9747
9999
  return {
@@ -10106,9 +10358,9 @@ function Select(_ref3) {
10106
10358
  })))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
10107
10359
  }
10108
10360
 
10109
- var _templateObject$1a, _templateObject2$U, _templateObject3$G, _templateObject4$y;
10110
- var Container$4 = /*#__PURE__*/styled.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
10111
- var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .harmonic-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n\n .harmonic-select__control--is-focused {\n border-color: var(--color-base-dark-grey);\n box-shadow: ", ";\n }\n\n .harmonic-select__control--menu-is-open {\n .harmonic-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n\n .harmonic-select__indicator {\n font-size: 25px;\n padding: 0;\n margin-right: 12px;\n color: var(--color-primary-black);\n svg {\n height: 1em;\n width: 1em;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n }\n\n .harmonic-select__single-value,\n .harmonic-select__placeholder {\n margin-left: 0;\n margin-right: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n\n @media ", " {\n font-size: 17px;\n }\n }\n\n .harmonic-select__placeholder {\n color: var(--color-primary-black);\n }\n\n .harmonic-select__single-value {\n color: var(--color-primary-black);\n }\n\n .harmonic-select__value-container {\n padding-left: 20px;\n padding-right: 20px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n\n .harmonic-select--is-disabled {\n .harmonic-select__control {\n border: 1px solid var(--color-base-light-grey);\n background: var(--color-base-light-grey);\n }\n .harmonic-select__indicator,\n .harmonic-select__single-value {\n color: var(--color-base-dark-grey);\n }\n }\n\n .harmonic-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--color-base-mid-grey);\n }\n\n .harmonic-select__menu-list {\n padding: 10px 0;\n }\n\n .harmonic-select__option {\n padding: 10px 20px;\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n color: var(--color-primary-black);\n\n @media ", " {\n font-size: 17px;\n }\n\n &:active,\n &.harmonic-select__option--is-focused {\n background: var(--color-base-light-grey);\n }\n }\n\n .harmonic-select__option--is-selected {\n color: var(--color-primary-black);\n background: none;\n }\n\n .harmonic-select__input-container {\n margin: 0;\n padding-top: 0;\n padding-bottom: 0;\n color: var(--color-primary-black);\n }\n\n .harmonic-select__menu-notice {\n color: var(--color-primary-black);\n padding: 20px 20px;\n text-align: left;\n }\n\n .harmonic-select__menu-notice--loading {\n font-style: italic;\n }\n"])), function (_ref) {
10361
+ var _templateObject$1b, _templateObject2$V, _templateObject3$H, _templateObject4$z;
10362
+ var Container$4 = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
10363
+ var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .harmonic-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n\n .harmonic-select__control--is-focused {\n border-color: var(--color-base-dark-grey);\n box-shadow: ", ";\n }\n\n .harmonic-select__control--menu-is-open {\n .harmonic-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n\n .harmonic-select__indicator {\n font-size: 25px;\n padding: 0;\n margin-right: 12px;\n color: var(--color-primary-black);\n svg {\n height: 1em;\n width: 1em;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n }\n\n .harmonic-select__single-value,\n .harmonic-select__placeholder {\n margin-left: 0;\n margin-right: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n\n @media ", " {\n font-size: 17px;\n }\n }\n\n .harmonic-select__placeholder {\n color: var(--color-primary-black);\n }\n\n .harmonic-select__single-value {\n color: var(--color-primary-black);\n }\n\n .harmonic-select__value-container {\n padding-left: 20px;\n padding-right: 20px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n\n .harmonic-select--is-disabled {\n .harmonic-select__control {\n border: 1px solid var(--color-base-light-grey);\n background: var(--color-base-light-grey);\n }\n .harmonic-select__indicator,\n .harmonic-select__single-value {\n color: var(--color-base-dark-grey);\n }\n }\n\n .harmonic-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--color-base-mid-grey);\n }\n\n .harmonic-select__menu-list {\n padding: 10px 0;\n }\n\n .harmonic-select__option {\n padding: 10px 20px;\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n color: var(--color-primary-black);\n\n @media ", " {\n font-size: 17px;\n }\n\n &:active,\n &.harmonic-select__option--is-focused {\n background: var(--color-base-light-grey);\n }\n }\n\n .harmonic-select__option--is-selected {\n color: var(--color-primary-black);\n background: none;\n }\n\n .harmonic-select__input-container {\n margin: 0;\n padding-top: 0;\n padding-bottom: 0;\n color: var(--color-primary-black);\n }\n\n .harmonic-select__menu-notice {\n color: var(--color-primary-black);\n padding: 20px 20px;\n text-align: left;\n }\n\n .harmonic-select__menu-notice--loading {\n font-style: italic;\n }\n"])), function (_ref) {
10112
10364
  var width = _ref.width;
10113
10365
  if (!width) return 'none';
10114
10366
  return width + "px";
@@ -10125,12 +10377,12 @@ var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$U || (_templateOb
10125
10377
  if (darkMode) return "0 0 0 1px var(--color-state-medium)";
10126
10378
  return "0 0 0 3px var(--base-color-lapislazuli)";
10127
10379
  }, devices.mobile, devices.mobile);
10128
- var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0 20px;\n color: ", ";\n\n @media ", " {\n margin: 0 0 12px;\n }\n"])), function (_ref5) {
10380
+ var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0 20px;\n color: ", ";\n\n @media ", " {\n margin: 0 0 12px;\n }\n"])), function (_ref5) {
10129
10381
  var darkMode = _ref5.darkMode;
10130
10382
  if (darkMode) return "var(--color-base-white)";
10131
10383
  return "var(--color-primary-black)";
10132
10384
  }, devices.mobile);
10133
- var ErrorLabel$5 = /*#__PURE__*/styled.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 20px 0 0;\n color: ", ";\n"])), function (_ref6) {
10385
+ var ErrorLabel$5 = /*#__PURE__*/styled.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 20px 0 0;\n color: ", ";\n"])), function (_ref6) {
10134
10386
  var darkMode = _ref6.darkMode;
10135
10387
  if (darkMode) return "var(--color-base-white)";
10136
10388
  return "var(--color-state-error)";
@@ -10249,10 +10501,10 @@ var SelectComponent$1 = function SelectComponent(_ref) {
10249
10501
  })));
10250
10502
  };
10251
10503
 
10252
- var _templateObject$1b, _templateObject3$H, _templateObject4$z, _templateObject5$t, _templateObject6$m, _templateObject7$i, _templateObject8$c, _templateObject9$8;
10253
- var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--color-base-light-grey);\n padding: 40px 20px;\n position: relative;\n display: flex;\n flex-direction: column;\n gap: 20px;\n align-items: stretch;\n"])));
10254
- var PromoLabel = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: var(--upsell-border-color);\n padding: 6px 8px;\n width: fit-content;\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n right: 20px;\n top: 0;\n width: auto;\n margin: auto;\n\n && {\n color: var(--color-base-white);\n }\n\n font-feature-settings:\n 'tnum' on,\n 'lnum' on,\n 'liga' off,\n 'calt' off;\n text-align: center;\n"])));
10255
- var ButtonContainer = /*#__PURE__*/styled.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: auto;\n padding-top: 10px;\n width: fit-content;\n display: flex;\n flex-direction: row;\n gap: 20px;\n\n @media ", " {\n width: 100%;\n flex-direction: column;\n gap: 16px;\n }\n\n ", "\n\n @media ", ", ", " {\n a {\n text-align: center;\n }\n }\n"])), function (_ref) {
10504
+ var _templateObject$1c, _templateObject3$I, _templateObject4$A, _templateObject5$t, _templateObject6$m, _templateObject7$i, _templateObject8$c, _templateObject9$8;
10505
+ var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--color-base-light-grey);\n padding: 40px 20px;\n position: relative;\n display: flex;\n flex-direction: column;\n gap: 20px;\n align-items: stretch;\n"])));
10506
+ var PromoLabel = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: var(--upsell-border-color);\n padding: 6px 8px;\n width: fit-content;\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n right: 20px;\n top: 0;\n width: auto;\n margin: auto;\n\n && {\n color: var(--color-base-white);\n }\n\n font-feature-settings:\n 'tnum' on,\n 'lnum' on,\n 'liga' off,\n 'calt' off;\n text-align: center;\n"])));
10507
+ var ButtonContainer = /*#__PURE__*/styled.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: auto;\n padding-top: 10px;\n width: fit-content;\n display: flex;\n flex-direction: row;\n gap: 20px;\n\n @media ", " {\n width: 100%;\n flex-direction: column;\n gap: 16px;\n }\n\n ", "\n\n @media ", ", ", " {\n a {\n text-align: center;\n }\n }\n"])), function (_ref) {
10256
10508
  var stackCtasEarly = _ref.stackCtasEarly;
10257
10509
  return stackCtasEarly ? devices.smallDesktop + ", " + devices.mobileAndTablet : devices.mobile;
10258
10510
  }, function (_ref2) {
@@ -10355,8 +10607,8 @@ var UpsellCard = function UpsellCard(_ref) {
10355
10607
  }, /*#__PURE__*/React__default.createElement(SecondaryButton, Object.assign({}, secondaryLink), truncate(secondaryLink.text, LENGTH_SMALL_TEXT$2))))))));
10356
10608
  };
10357
10609
 
10358
- var _templateObject$1c, _templateObject2$V, _templateObject3$I;
10359
- var Wrapper$7 = /*#__PURE__*/styled.figure(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: table;\n width: auto;\n margin: 0;\n\n ", " {\n width: 100%;\n\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
10610
+ var _templateObject$1d, _templateObject2$W, _templateObject3$J;
10611
+ var Wrapper$7 = /*#__PURE__*/styled.figure(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: table;\n width: auto;\n margin: 0;\n\n ", " {\n width: 100%;\n\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
10360
10612
  var _ref$aspectRatio = _ref.aspectRatio,
10361
10613
  aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
10362
10614
  return aspectRatio;
@@ -10366,8 +10618,8 @@ var Wrapper$7 = /*#__PURE__*/styled.figure(_templateObject$1c || (_templateObjec
10366
10618
  height = _ref2.height;
10367
10619
  return height ? "calc(" + height + "px * " + AspectRatioWidth[aspectRatio] + ")" : 'auto';
10368
10620
  });
10369
- var CaptionWrapper = /*#__PURE__*/styled.figcaption(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: table-caption;\n caption-side: bottom;\n margin-top: var(--carousel-image-caption-margin);\n"])));
10370
- var CaptionContext = /*#__PURE__*/styled(Caption)(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n line-clamp: 2;\n max-height: 46px;\n white-space: normal;\n word-break: break-word;\n font-feature-settings: var(--font-feature-settings-body);\n text-transform: var(--text-transform-body);\n"])));
10621
+ var CaptionWrapper = /*#__PURE__*/styled.figcaption(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: table-caption;\n caption-side: bottom;\n margin-top: var(--carousel-image-caption-margin);\n"])));
10622
+ var CaptionContext = /*#__PURE__*/styled(Caption)(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n line-clamp: 2;\n max-height: 46px;\n white-space: normal;\n word-break: break-word;\n font-feature-settings: var(--font-feature-settings-body);\n text-transform: var(--text-transform-body);\n"])));
10371
10623
 
10372
10624
  var _excluded$q = ["caption", "altText", "src", "srcSet", "sizes", "loading", "aspectRatio", "className"];
10373
10625
  var ImageWithCaption = function ImageWithCaption(_ref) {
@@ -10400,11 +10652,11 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
10400
10652
  }, caption))));
10401
10653
  };
10402
10654
 
10403
- var _templateObject$1d, _templateObject2$W, _templateObject3$J, _templateObject4$A, _templateObject5$u, _templateObject6$n;
10404
- var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$1d || (_templateObject$1d = /*#__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"])));
10405
- var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
10406
- var StyledImage = /*#__PURE__*/styled.img(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
10407
- var ImageWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
10655
+ var _templateObject$1e, _templateObject2$X, _templateObject3$K, _templateObject4$B, _templateObject5$u, _templateObject6$n;
10656
+ var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$1e || (_templateObject$1e = /*#__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"])));
10657
+ var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
10658
+ var StyledImage = /*#__PURE__*/styled.img(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
10659
+ var ImageWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
10408
10660
  var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$u || (_templateObject5$u = /*#__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);
10409
10661
  var TitleWrapper$4 = /*#__PURE__*/styled.div(_templateObject6$n || (_templateObject6$n = /*#__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);
10410
10662
 
@@ -10444,14 +10696,14 @@ var MiniCard = function MiniCard(_ref) {
10444
10696
  }, title)))));
10445
10697
  };
10446
10698
 
10447
- var _templateObject$1e, _templateObject2$X, _templateObject3$K, _templateObject4$B, _templateObject5$v;
10448
- var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1e || (_templateObject$1e = /*#__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"])));
10449
- var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$X || (_templateObject2$X = /*#__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"])));
10450
- var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
10699
+ var _templateObject$1f, _templateObject2$Y, _templateObject3$L, _templateObject4$C, _templateObject5$v;
10700
+ var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1f || (_templateObject$1f = /*#__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"])));
10701
+ var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$Y || (_templateObject2$Y = /*#__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"])));
10702
+ var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
10451
10703
  var isVisible = _ref.isVisible;
10452
10704
  return isVisible ? 'visible' : 'hidden';
10453
10705
  });
10454
- var IntroTextContainer = /*#__PURE__*/styled.div(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: hidden;\n }\n"])), function (_ref2) {
10706
+ var IntroTextContainer = /*#__PURE__*/styled.div(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: hidden;\n }\n"])), function (_ref2) {
10455
10707
  var isVisible = _ref2.isVisible;
10456
10708
  return isVisible ? 'visible' : 'hidden';
10457
10709
  });
@@ -10536,11 +10788,11 @@ var ReadMore = function ReadMore(_ref) {
10536
10788
  }, isFullTextOpen ? "" + hideText : "" + showMoreText))));
10537
10789
  };
10538
10790
 
10539
- var _templateObject$1f, _templateObject2$Y, _templateObject3$L, _templateObject4$C, _templateObject5$w;
10540
- var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
10541
- var MenuList = /*#__PURE__*/styled.ul(_templateObject2$Y || (_templateObject2$Y = /*#__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"])), Colors.LightGrey);
10542
- var MobileButton = /*#__PURE__*/styled.button(_templateObject3$L || (_templateObject3$L = /*#__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"])), Colors.Black, Colors.White, Colors.DarkGrey);
10543
- var MenuItem$1 = /*#__PURE__*/styled.a(_templateObject4$C || (_templateObject4$C = /*#__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 text-decoration: none;\n margin: 0;\n padding: 16px 20px 15px 5px;\n display: block;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n"])), Colors.Black, function (_ref) {
10791
+ var _templateObject$1g, _templateObject2$Z, _templateObject3$M, _templateObject4$D, _templateObject5$w;
10792
+ var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
10793
+ var MenuList = /*#__PURE__*/styled.ul(_templateObject2$Z || (_templateObject2$Z = /*#__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"])), Colors.LightGrey);
10794
+ var MobileButton = /*#__PURE__*/styled.button(_templateObject3$M || (_templateObject3$M = /*#__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"])), Colors.Black, Colors.White, Colors.DarkGrey);
10795
+ var MenuItem$1 = /*#__PURE__*/styled.a(_templateObject4$D || (_templateObject4$D = /*#__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 text-decoration: none;\n margin: 0;\n padding: 16px 20px 15px 5px;\n display: block;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n"])), Colors.Black, function (_ref) {
10544
10796
  var isActive = _ref.isActive;
10545
10797
  return isActive ? "var(--base-color-" + Colors.MidGrey + ")" : 'none';
10546
10798
  }, Colors.MidGrey);
@@ -10700,14 +10952,14 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
10700
10952
  });
10701
10953
  };
10702
10954
 
10703
- var _templateObject$1g, _templateObject2$Z, _templateObject3$M, _templateObject4$D, _templateObject5$x, _templateObject6$o;
10704
- var Container$5 = /*#__PURE__*/styled.div(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
10705
- var Sections = /*#__PURE__*/styled.div(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
10706
- var Section = /*#__PURE__*/styled.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
10955
+ var _templateObject$1h, _templateObject2$_, _templateObject3$N, _templateObject4$E, _templateObject5$x, _templateObject6$o;
10956
+ var Container$5 = /*#__PURE__*/styled.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
10957
+ var Sections = /*#__PURE__*/styled.div(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
10958
+ var Section = /*#__PURE__*/styled.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
10707
10959
  var color = _ref.color;
10708
10960
  return "var(--base-color-" + color + ")";
10709
10961
  });
10710
- var BottomLine = /*#__PURE__*/styled.div(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
10962
+ var BottomLine = /*#__PURE__*/styled.div(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
10711
10963
  var Text = /*#__PURE__*/styled.div(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
10712
10964
  var color = _ref2.color;
10713
10965
  return "var(--base-color-" + color + ")";
@@ -10794,11 +11046,11 @@ var PasswordStrength = function PasswordStrength(_ref) {
10794
11046
  }, strengthLabel))));
10795
11047
  };
10796
11048
 
10797
- var _templateObject$1h, _templateObject2$_, _templateObject3$N, _templateObject4$E, _templateObject5$y, _templateObject6$p, _templateObject7$j, _templateObject8$d;
10798
- var TableContainer = /*#__PURE__*/styled.table(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
10799
- var Container$6 = /*#__PURE__*/styled.div(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
10800
- var Wrapper$8 = /*#__PURE__*/styled.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
10801
- var TableHeader = /*#__PURE__*/styled.th(_templateObject4$E || (_templateObject4$E = /*#__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) {
11049
+ var _templateObject$1i, _templateObject2$$, _templateObject3$O, _templateObject4$F, _templateObject5$y, _templateObject6$p, _templateObject7$j, _templateObject8$d;
11050
+ var TableContainer = /*#__PURE__*/styled.table(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
11051
+ var Container$6 = /*#__PURE__*/styled.div(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
11052
+ var Wrapper$8 = /*#__PURE__*/styled.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
11053
+ var TableHeader = /*#__PURE__*/styled.th(_templateObject4$F || (_templateObject4$F = /*#__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) {
10802
11054
  return "calc(100% / " + (props.columns - 1) + ")";
10803
11055
  }, devices.tablet, devices.mobile);
10804
11056
  var TableCell = /*#__PURE__*/styled.td(_templateObject5$y || (_templateObject5$y = /*#__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) {
@@ -11009,22 +11261,22 @@ var Table = function Table(_ref) {
11009
11261
  }))));
11010
11262
  };
11011
11263
 
11012
- var _templateObject$1i, _templateObject2$$, _templateObject3$O, _templateObject4$F, _templateObject5$z, _templateObject6$q, _templateObject7$k, _templateObject8$e, _templateObject9$9, _templateObject0$8, _templateObject1$6, _templateObject10$4, _templateObject11$3, _templateObject12$3, _templateObject13$2;
11013
- var Wrapper$9 = /*#__PURE__*/styled('div')(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
11264
+ var _templateObject$1j, _templateObject2$10, _templateObject3$P, _templateObject4$G, _templateObject5$z, _templateObject6$q, _templateObject7$k, _templateObject8$e, _templateObject9$9, _templateObject0$8, _templateObject1$6, _templateObject10$4, _templateObject11$3, _templateObject12$3, _templateObject13$2;
11265
+ var Wrapper$9 = /*#__PURE__*/styled('div')(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
11014
11266
  var theme = _ref.theme;
11015
11267
  return "var(--color-" + theme + ")";
11016
11268
  }, function (_ref2) {
11017
11269
  var theme = _ref2.theme;
11018
11270
  return "var(--color-" + theme + ")";
11019
11271
  });
11020
- var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
11021
- var SignUpTitleWrapper = /*#__PURE__*/styled('div')(_templateObject3$O || (_templateObject3$O = /*#__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);
11022
- var Error = /*#__PURE__*/styled.div(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
11272
+ var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
11273
+ var SignUpTitleWrapper = /*#__PURE__*/styled('div')(_templateObject3$P || (_templateObject3$P = /*#__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);
11274
+ var Error = /*#__PURE__*/styled.div(_templateObject4$G || (_templateObject4$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
11023
11275
  var Form = /*#__PURE__*/styled.form(_templateObject5$z || (_templateObject5$z = /*#__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);
11024
11276
  var FormFooterWrapper = /*#__PURE__*/styled.div(_templateObject6$q || (_templateObject6$q = /*#__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);
11025
11277
  var ServerError = /*#__PURE__*/styled.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
11026
11278
  var CTALinkWrapper = /*#__PURE__*/styled.a(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n @media ", " {\n text-decoration: underline;\n }\n"])), devices.mobile);
11027
- var ButtonWrapper$3 = /*#__PURE__*/styled.div(_templateObject9$9 || (_templateObject9$9 = /*#__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);
11279
+ var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject9$9 || (_templateObject9$9 = /*#__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);
11028
11280
  var FieldsWrapper = /*#__PURE__*/styled.div(_templateObject0$8 || (_templateObject0$8 = /*#__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);
11029
11281
  var MessageWrapper = /*#__PURE__*/styled.div(_templateObject1$6 || (_templateObject1$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n div > p {\n margin: 0;\n }\n"])));
11030
11282
  var DropdownAreaWrapper = /*#__PURE__*/styled.div(_templateObject10$4 || (_templateObject10$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1 / -1;\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n gap: var(--grid-column-gap);\n cursor: pointer;\n"])));
@@ -11052,7 +11304,9 @@ var themeToColor = function themeToColor(theme) {
11052
11304
  var SignUpTitle = function SignUpTitle(_ref) {
11053
11305
  var title = _ref.title,
11054
11306
  _ref$isMobile = _ref.isMobile,
11055
- isMobile = _ref$isMobile === void 0 ? false : _ref$isMobile;
11307
+ isMobile = _ref$isMobile === void 0 ? false : _ref$isMobile,
11308
+ _ref$titleFontFamily = _ref.titleFontFamily,
11309
+ titleFontFamily = _ref$titleFontFamily === void 0 ? false : _ref$titleFontFamily;
11056
11310
  return /*#__PURE__*/React__default.createElement(GridItem, {
11057
11311
  columnStartDesktop: 3,
11058
11312
  columnSpanDesktop: 10,
@@ -11061,7 +11315,7 @@ var SignUpTitle = function SignUpTitle(_ref) {
11061
11315
  }, /*#__PURE__*/React__default.createElement(SignUpTitleWrapper, null, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
11062
11316
  color: "black",
11063
11317
  hierarchy: "h3",
11064
- serif: true,
11318
+ serif: titleFontFamily === 'Victor',
11065
11319
  size: isMobile ? 'small' : 'medium'
11066
11320
  }, title)));
11067
11321
  };
@@ -11314,10 +11568,10 @@ var SignUpForm = function SignUpForm(_ref) {
11314
11568
  tabIndex: 0
11315
11569
  }, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
11316
11570
  size: "small"
11317
- }, ctaPrivacy.text)), /*#__PURE__*/React__default.createElement(ButtonWrapper$3, null, /*#__PURE__*/React__default.createElement(SignUpFormButton, {
11571
+ }, ctaPrivacy.text)), /*#__PURE__*/React__default.createElement(ButtonWrapper$2, null, /*#__PURE__*/React__default.createElement(SignUpFormButton, {
11318
11572
  onClick: handleFormSubmit,
11319
11573
  theme: theme
11320
- })))) : (/*#__PURE__*/React__default.createElement(FormFooterWrapper, null, /*#__PURE__*/React__default.createElement(ButtonWrapper$3, null, /*#__PURE__*/React__default.createElement(SignUpFormButton, {
11574
+ })))) : (/*#__PURE__*/React__default.createElement(FormFooterWrapper, null, /*#__PURE__*/React__default.createElement(ButtonWrapper$2, null, /*#__PURE__*/React__default.createElement(SignUpFormButton, {
11321
11575
  onClick: handleFormSubmit,
11322
11576
  theme: theme
11323
11577
  })), /*#__PURE__*/React__default.createElement(CTALinkWrapper, {
@@ -11434,12 +11688,12 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
11434
11688
  }))))));
11435
11689
  };
11436
11690
 
11437
- var _templateObject$1j, _templateObject2$10, _templateObject4$G, _templateObject5$A;
11438
- var AnchorBarContainer = /*#__PURE__*/styled(Grid)(_templateObject$1j || (_templateObject$1j = /*#__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) {
11691
+ var _templateObject$1k, _templateObject2$11, _templateObject4$H, _templateObject5$A;
11692
+ var AnchorBarContainer = /*#__PURE__*/styled(Grid)(_templateObject$1k || (_templateObject$1k = /*#__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) {
11439
11693
  var withShadow = _ref.withShadow;
11440
- return withShadow && css(_templateObject2$10 || (_templateObject2$10 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
11694
+ return withShadow && css(_templateObject2$11 || (_templateObject2$11 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
11441
11695
  }, devices.mobile);
11442
- var CloseButtonWrapper = /*#__PURE__*/styled.a(_templateObject4$G || (_templateObject4$G = /*#__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);
11696
+ var CloseButtonWrapper = /*#__PURE__*/styled.a(_templateObject4$H || (_templateObject4$H = /*#__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);
11443
11697
  var ContentWrapper$2 = /*#__PURE__*/styled.a(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
11444
11698
 
11445
11699
  var defaultGrid = {
@@ -11498,12 +11752,12 @@ var AnchorBar = function AnchorBar(_ref) {
11498
11752
  return null;
11499
11753
  };
11500
11754
 
11501
- var _templateObject$1k, _templateObject2$11;
11502
- var FocusableTab = /*#__PURE__*/styled(Tab)(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n &:not(:active):not(:focus) {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: 0;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n border: 0;\n white-space: nowrap;\n user-select: none;\n }\n\n @media ", " {\n position: absolute;\n left: 10px;\n top: 10px;\n width: 80px;\n height: 44px;\n margin: 0;\n padding: 0;\n overflow: hidden;\n clip: auto;\n color: transparent;\n background: transparent;\n opacity: 0;\n border: 0;\n white-space: nowrap;\n user-select: none;\n }\n"])), function (_ref) {
11755
+ var _templateObject$1l, _templateObject2$12;
11756
+ var FocusableTab = /*#__PURE__*/styled(Tab)(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n &:not(:active):not(:focus) {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: 0;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n border: 0;\n white-space: nowrap;\n user-select: none;\n }\n\n @media ", " {\n position: absolute;\n left: 10px;\n top: 10px;\n width: 80px;\n height: 44px;\n margin: 0;\n padding: 0;\n overflow: hidden;\n clip: auto;\n color: transparent;\n background: transparent;\n opacity: 0;\n border: 0;\n white-space: nowrap;\n user-select: none;\n }\n"])), function (_ref) {
11503
11757
  var hide = _ref.hide;
11504
11758
  return hide && "display: none;";
11505
11759
  }, devices.mobileAndTablet);
11506
- var HiddenBlock = /*#__PURE__*/styled.div(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 29px 50px;\n display: inline-block;\n width: 100%;\n height: fit-content;\n border-bottom: solid 2px var(--color-base-light-grey);\n overflow: hidden;\n &:not(:has(div:focus)) {\n position: absolute;\n border-bottom: 0;\n padding: 0;\n }\n @media ", " {\n border-bottom: 0;\n position: absolute;\n padding: 0;\n }\n"])), devices.mobileAndTablet);
11760
+ var HiddenBlock = /*#__PURE__*/styled.div(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 29px 50px;\n display: inline-block;\n width: 100%;\n height: fit-content;\n border-bottom: solid 2px var(--color-base-light-grey);\n overflow: hidden;\n &:not(:has(div:focus)) {\n position: absolute;\n border-bottom: 0;\n padding: 0;\n }\n @media ", " {\n border-bottom: 0;\n position: absolute;\n padding: 0;\n }\n"])), devices.mobileAndTablet);
11507
11761
 
11508
11762
  /**
11509
11763
  * An accessible component which allows Assistive Technology users to move the focus
@@ -11595,8 +11849,8 @@ var SkipToMain = function SkipToMain(_ref) {
11595
11849
  }));
11596
11850
  };
11597
11851
 
11598
- var _templateObject$1l;
11599
- var TextContainer$1 = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-base-black);\n font-feature-settings: var(--font-feature-settings-body);\n\n & h1,\n h2,\n h3,\n h4 {\n font-feature-settings: var(--font-feature-settings-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 60px 0 16px;\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\n font-feature-settings: var(--font-feature-settings-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 60px 0 16px;\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: var(--color-base-black);\n text-decoration: underline;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n cursor: pointer;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n\n &:hover {\n color: var(--color-rbo-black-hovered);\n }\n\n &:active {\n color: var(--color-rbo-black-pressed);\n }\n }\n\n p {\n margin: 30px 0;\n }\n\n p:has(+ ul),\n p:has(+ ol) {\n margin-bottom: 12px;\n }\n\n & ul,\n & ol {\n padding: 0;\n list-style: none;\n margin-block-start: 0;\n margin-block-end: 0;\n }\n\n & ul li,\n & ol li {\n position: relative;\n padding-left: 32px;\n padding-top: 6px;\n padding-bottom: 6px;\n\n @media ", " {\n padding-left: 28px;\n padding-top: 4px;\n padding-bottom: 4px;\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n position: absolute;\n left: 0;\n width: 20px;\n text-align: right;\n margin-right: 12px;\n\n @media ", " {\n width: 16px;\n margin-right: 12px;\n }\n }\n\n & ol {\n counter-reset: custom-ol;\n }\n\n & ol > li {\n counter-increment: custom-ol;\n }\n\n & ol > li::before {\n content: counter(custom-ol, decimal-leading-zero) '';\n position: absolute;\n left: 0;\n min-width: 20px;\n text-align: right;\n margin-right: 12px;\n display: inline-block;\n\n @media ", " {\n min-width: 16px;\n margin-right: 12px;\n }\n }\n"])), devices.mobile, devices.mobile, devices.mobile);
11852
+ var _templateObject$1m;
11853
+ var TextContainer$1 = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-base-black);\n font-feature-settings: var(--font-feature-settings-body);\n\n & h1,\n h2,\n h3,\n h4 {\n font-feature-settings: var(--font-feature-settings-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 60px 0 16px;\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\n font-feature-settings: var(--font-feature-settings-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 60px 0 16px;\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: var(--color-base-black);\n text-decoration: underline;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n cursor: pointer;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n\n &:hover {\n color: var(--color-rbo-black-hovered);\n }\n\n &:active {\n color: var(--color-rbo-black-pressed);\n }\n }\n\n p {\n margin: 30px 0;\n }\n\n p:has(+ ul),\n p:has(+ ol) {\n margin-bottom: 12px;\n }\n\n & ul,\n & ol {\n padding: 0;\n list-style: none;\n margin-block-start: 0;\n margin-block-end: 0;\n }\n\n & ul li,\n & ol li {\n position: relative;\n padding-left: 32px;\n padding-top: 6px;\n padding-bottom: 6px;\n\n @media ", " {\n padding-left: 28px;\n padding-top: 4px;\n padding-bottom: 4px;\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n position: absolute;\n left: 0;\n width: 20px;\n text-align: right;\n margin-right: 12px;\n\n @media ", " {\n width: 16px;\n margin-right: 12px;\n }\n }\n\n & ol {\n counter-reset: custom-ol;\n }\n\n & ol > li {\n counter-increment: custom-ol;\n }\n\n & ol > li::before {\n content: counter(custom-ol, decimal-leading-zero) '';\n position: absolute;\n left: 0;\n min-width: 20px;\n text-align: right;\n margin-right: 12px;\n display: inline-block;\n\n @media ", " {\n min-width: 16px;\n margin-right: 12px;\n }\n }\n"])), devices.mobile, devices.mobile, devices.mobile);
11600
11854
 
11601
11855
  var addTypographyClasses = function addTypographyClasses(html) {
11602
11856
  return html.replace(/<h1>/g, "<h1 class=\"" + typographyStyles.header + " " + typographyStyles['header--large'] + "\">").replace(/<h2>/g, "<h2 class=\"" + typographyStyles.header + " " + typographyStyles['header--large'] + "\">").replace(/<h3>/g, "<h3 class=\"" + typographyStyles.header + " " + typographyStyles['header--medium'] + "\">").replace(/<h4>/g, "<h4 class=\"" + typographyStyles.header + " " + typographyStyles['header--medium'] + "\">").replace(/<h5>/g, "<h5 class=\"" + typographyStyles.header + " " + typographyStyles['header--small'] + "\">").replace(/<h6>/g, "<h6 class=\"" + typographyStyles.header + " " + typographyStyles['header--small'] + "\">");
@@ -11631,14 +11885,9 @@ var BodyContent = function BodyContent(_ref2) {
11631
11885
  _ref2$renderGridItem = _ref2.renderGridItem,
11632
11886
  renderGridItem = _ref2$renderGridItem === void 0 ? true : _ref2$renderGridItem;
11633
11887
  var textContainerClassName = !renderGrid && !renderGridItem ? className : undefined;
11634
- var content = /*#__PURE__*/React__default.createElement(TextContainer$1, {
11635
- tag: "div",
11636
- size: "large",
11637
- "data-testid": "text-container",
11888
+ var content = /*#__PURE__*/React__default.createElement(BodyContentTextContainer, {
11638
11889
  className: textContainerClassName,
11639
- dangerouslySetInnerHTML: {
11640
- __html: addTypographyClasses(text)
11641
- }
11890
+ html: text
11642
11891
  });
11643
11892
  var gridItemOrContent = renderGridItem ? (/*#__PURE__*/React__default.createElement(GridItem, {
11644
11893
  columnStartDesktop: columnStartDesktop,
@@ -11656,20 +11905,20 @@ var BodyContent = function BodyContent(_ref2) {
11656
11905
  }, gridItemOrContent);
11657
11906
  };
11658
11907
 
11659
- var _templateObject$1m, _templateObject2$12, _templateObject3$P, _templateObject4$H, _templateObject5$B, _templateObject6$r, _templateObject7$l;
11908
+ var _templateObject$1n, _templateObject2$13, _templateObject3$Q, _templateObject4$I, _templateObject5$B, _templateObject6$r, _templateObject7$l;
11660
11909
  var color = 'primary-black';
11661
11910
  var Button$2 = /*#__PURE__*/styled(SecondaryButton).attrs({
11662
11911
  borderColor: color,
11663
11912
  hoveredColor: color,
11664
11913
  pressedColor: color,
11665
11914
  textColor: color
11666
- })(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 35px;\n margin-top: 33px;\n width: fit-content;\n\n @media ", " {\n margin-bottom: 33px;\n margin-top: 31px;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n"])), devices.mobile);
11667
- var Container$7 = /*#__PURE__*/styled.div(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--color-", ");\n padding: 60px 59px 59px;\n\n @media ", " {\n padding: 35px 20px 34px;\n }\n"])), color, devices.mobile);
11668
- var Description = /*#__PURE__*/styled(BodyContentTextContainer)(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n margin: 27px 0;\n\n @media ", " {\n margin: 20px 0;\n }\n }\n"])), devices.mobile);
11915
+ })(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 35px;\n margin-top: 33px;\n width: fit-content;\n\n @media ", " {\n margin-bottom: 33px;\n margin-top: 31px;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n"])), devices.mobile);
11916
+ var Container$7 = /*#__PURE__*/styled.div(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--color-", ");\n padding: 60px 59px 59px;\n\n @media ", " {\n padding: 35px 20px 34px;\n }\n"])), color, devices.mobile);
11917
+ var Description = /*#__PURE__*/styled(BodyContentTextContainer)(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n margin: 27px 0;\n\n @media ", " {\n margin: 20px 0;\n }\n }\n"])), devices.mobile);
11669
11918
  var Heading = /*#__PURE__*/styled(HarmonicHeader).attrs({
11670
11919
  serif: true,
11671
11920
  size: 'medium'
11672
- })(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n letter-spacing: -0.5px;\n margin-bottom: 27px;\n\n @media ", " {\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
11921
+ })(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n letter-spacing: -0.5px;\n margin-bottom: 27px;\n\n @media ", " {\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
11673
11922
  var Intro = /*#__PURE__*/styled(HarmonicSubtitle).attrs({
11674
11923
  size: 'large'
11675
11924
  })(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-bottom: 27px;\n\n @media ", " {\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
@@ -11869,11 +12118,11 @@ var Navigation = function Navigation(_ref) {
11869
12118
  })))))));
11870
12119
  };
11871
12120
 
11872
- var _templateObject$1n, _templateObject2$13, _templateObject3$Q, _templateObject4$I, _templateObject5$C, _templateObject6$s, _templateObject7$m;
11873
- var FooterSection = /*#__PURE__*/styled(Grid)(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--color-base-black);\n color: var(--color-base-white);\n padding: 44px 0px;\n grid-template-areas: '. . policy policy policy policy social social social social logo logo logo logo . .';\n\n @media ", " {\n padding: 40px 0px;\n gap: 24px;\n }\n\n @media ", " {\n padding: 20px 0px;\n row-gap: 40px;\n grid-template-areas:\n '. social social social social social social social social social social social social .'\n '. policy policy policy policy policy policy policy policy policy policy policy policy .'\n '. logo logo logo logo logo logo logo logo logo logo logo logo .';\n }\n"])), devices.tablet, devices.mobile);
11874
- var PolicyLinksSection = /*#__PURE__*/styled(GridItem)(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: policy;\n display: flex;\n flex-direction: column;\n gap: 16px;\n\n @media ", " {\n gap: 20px;\n }\n\n @media ", " {\n gap: 12px;\n }\n"])), devices.tablet, devices.mobile);
11875
- var SocialAndNewsletterSection = /*#__PURE__*/styled(GridItem)(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: social;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 20px;\n\n @media ", " {\n gap: 40px;\n }\n"])), devices.mobile);
11876
- var SectionWrapper = /*#__PURE__*/styled.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 20px;\n\n @media ", " {\n gap: 24px;\n }\n"])), devices.mobile);
12121
+ var _templateObject$1o, _templateObject2$14, _templateObject3$R, _templateObject4$J, _templateObject5$C, _templateObject6$s, _templateObject7$m;
12122
+ var FooterSection = /*#__PURE__*/styled(Grid)(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--color-base-black);\n color: var(--color-base-white);\n padding: 44px 0px;\n grid-template-areas: '. . policy policy policy policy social social social social logo logo logo logo . .';\n\n @media ", " {\n padding: 40px 0px;\n gap: 24px;\n }\n\n @media ", " {\n padding: 20px 0px;\n row-gap: 40px;\n grid-template-areas:\n '. social social social social social social social social social social social social .'\n '. policy policy policy policy policy policy policy policy policy policy policy policy .'\n '. logo logo logo logo logo logo logo logo logo logo logo logo .';\n }\n"])), devices.tablet, devices.mobile);
12123
+ var PolicyLinksSection = /*#__PURE__*/styled(GridItem)(_templateObject2$14 || (_templateObject2$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: policy;\n display: flex;\n flex-direction: column;\n gap: 16px;\n\n @media ", " {\n gap: 20px;\n }\n\n @media ", " {\n gap: 12px;\n }\n"])), devices.tablet, devices.mobile);
12124
+ var SocialAndNewsletterSection = /*#__PURE__*/styled(GridItem)(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: social;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 20px;\n\n @media ", " {\n gap: 40px;\n }\n"])), devices.mobile);
12125
+ var SectionWrapper = /*#__PURE__*/styled.div(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 20px;\n\n @media ", " {\n gap: 24px;\n }\n"])), devices.mobile);
11877
12126
  var LogoAndDescriptionSection = /*#__PURE__*/styled(GridItem)(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n\n @media ", " {\n gap: 24px;\n }\n"])), devices.mobile);
11878
12127
  var SponsorLogoContainer = /*#__PURE__*/styled.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 290px;\n\n @media ", " {\n max-width: unset;\n }\n"])), devices.mobile);
11879
12128
  var TextLinkWrapper$3 = /*#__PURE__*/styled(TextLink)(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-sans);\n font-size: 17px;\n line-height: 24px;\n letter-spacing: 0.4px;\n color: var(--color-base-white);\n border-bottom: unset;\n text-decoration: underline;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n margin-bottom: 0;\n padding-bottom: 0;\n"])));
@@ -11934,17 +12183,17 @@ var Footer = function Footer(_ref) {
11934
12183
  }, additionalInfo))));
11935
12184
  };
11936
12185
 
11937
- var _templateObject$1o, _templateObject2$14, _templateObject3$R, _templateObject4$J, _templateObject5$D, _templateObject8$f, _templateObject9$a, _templateObject0$9;
12186
+ var _templateObject$1p, _templateObject2$15, _templateObject3$S, _templateObject4$K, _templateObject5$D, _templateObject8$f, _templateObject9$a, _templateObject0$9;
11938
12187
  var LIST_ITEM_GAP = 32;
11939
- var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--color-base-white);\n z-index: ", ";\n\n ", "\n"])), function (_ref) {
12188
+ var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--color-base-white);\n z-index: ", ";\n\n ", "\n"])), function (_ref) {
11940
12189
  var bottomBorder = _ref.bottomBorder;
11941
12190
  return bottomBorder ? '1px solid var(--color-base-light-grey)' : 'none';
11942
12191
  }, zIndexes.anchor, function (_ref2) {
11943
12192
  var withShadow = _ref2.withShadow;
11944
- return withShadow && css(_templateObject2$14 || (_templateObject2$14 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
12193
+ return withShadow && css(_templateObject2$15 || (_templateObject2$15 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
11945
12194
  });
11946
- var TabsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
11947
- var TabsWrapper = /*#__PURE__*/styled.div(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
12195
+ var TabsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
12196
+ var TabsWrapper = /*#__PURE__*/styled.div(_templateObject4$K || (_templateObject4$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
11948
12197
  var TabsList = /*#__PURE__*/styled.ul(_templateObject5$D || (_templateObject5$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n display: flex;\n gap: ", "px;\n justify-content: ", ";\n align-items: center;\n list-style: none;\n padding: 0;\n margin: 0;\n height: var(--anchor-tabs-height);\n white-space: nowrap;\n overflow: scroll;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n scroll-behavior: smooth;\n\n @media ", " {\n & {\n width: ", ";\n }\n }\n"])), function (_ref3) {
11949
12198
  var tabsOverflow = _ref3.tabsOverflow;
11950
12199
  return tabsOverflow ? 'calc(100% - 74px)' : '100%';
@@ -12215,17 +12464,17 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
12215
12464
  })))) : null))));
12216
12465
  };
12217
12466
 
12218
- var _templateObject$1p, _templateObject2$15, _templateObject3$S, _templateObject4$K, _templateObject6$t, _templateObject7$n, _templateObject8$g, _templateObject9$b, _templateObject0$a;
12219
- var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
12467
+ var _templateObject$1q, _templateObject2$16, _templateObject3$T, _templateObject4$L, _templateObject6$t, _templateObject7$n, _templateObject8$g, _templateObject9$b, _templateObject0$a;
12468
+ var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$1q || (_templateObject$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
12220
12469
  var sticky = _ref.sticky;
12221
12470
  return sticky ? 'sticky' : 'initial';
12222
12471
  }, zIndexes.anchor);
12223
- var TitleCTAGrid = /*#__PURE__*/styled(Grid)(_templateObject2$15 || (_templateObject2$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: solid 2px var(--base-color-light-grey);\n"])));
12224
- var TitleCTAGridItem = /*#__PURE__*/styled.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2 / span 15;\n display: flex;\n align-items: center;\n flex-direction: ", ";\n gap: 40px;\n justify-content: space-between;\n\n @media ", " {\n & {\n grid-column: 2 / span 13;\n gap: 20px;\n }\n }\n\n @media ", " {\n & {\n grid-column: 2 / span 12;\n }\n }\n"])), function (_ref2) {
12472
+ var TitleCTAGrid = /*#__PURE__*/styled(Grid)(_templateObject2$16 || (_templateObject2$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: solid 2px var(--base-color-light-grey);\n"])));
12473
+ var TitleCTAGridItem = /*#__PURE__*/styled.div(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2 / span 15;\n display: flex;\n align-items: center;\n flex-direction: ", ";\n gap: 40px;\n justify-content: space-between;\n\n @media ", " {\n & {\n grid-column: 2 / span 13;\n gap: 20px;\n }\n }\n\n @media ", " {\n & {\n grid-column: 2 / span 12;\n }\n }\n"])), function (_ref2) {
12225
12474
  var title = _ref2.title;
12226
12475
  return title ? 'row' : 'row-reverse';
12227
12476
  }, devices.tablet, devices.mobile);
12228
- var AnchorTitle = /*#__PURE__*/styled.div(_templateObject4$K || (_templateObject4$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n min-height: var(--button-height);\n\n h5 {\n padding: 0;\n margin: 0;\n }\n\n @media ", " {\n & {\n min-height: 50px;\n }\n }\n"])), devices.mobile);
12477
+ var AnchorTitle = /*#__PURE__*/styled.div(_templateObject4$L || (_templateObject4$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n min-height: var(--button-height);\n\n h5 {\n padding: 0;\n margin: 0;\n }\n\n @media ", " {\n & {\n min-height: 50px;\n }\n }\n"])), devices.mobile);
12229
12478
  var ButtonsDesktopWrapper = /*#__PURE__*/styled.div(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n\n @media ", " {\n display: none;\n }\n\n a {\n width: max-content;\n }\n"])), devices.mobile);
12230
12479
  var ButtonsMobileWrapper = /*#__PURE__*/styled.div(_templateObject7$n || (_templateObject7$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: block;\n }\n }\n"])), devices.mobile);
12231
12480
  var PrimaryButtonReverse = /*#__PURE__*/styled(PrimaryButton)(_templateObject8$g || (_templateObject8$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n"])), function (_ref3) {
@@ -12275,14 +12524,14 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
12275
12524
  }, message))));
12276
12525
  };
12277
12526
 
12278
- var _templateObject$1q, _templateObject2$16, _templateObject3$T, _templateObject4$L;
12279
- var UpsellBorderBox = /*#__PURE__*/styled.div(_templateObject$1q || (_templateObject$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: solid 4px;\n border-color: var(--upsell-border-color);\n padding: 66px 74px 70px;\n\n @media ", " {\n & {\n border-left: none;\n border-right: none;\n padding: 40px 0px;\n }\n }\n"])), devices.mobile);
12280
- var TitleContent = /*#__PURE__*/styled(HarmonicHeader)(_templateObject2$16 || (_templateObject2$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-primary-black);\n\n @media ", " {\n margin-left: 20px;\n margin-right: 20px;\n }\n }\n"])), devices.mobile);
12281
- var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 60px;\n\n @media ", " {\n margin-bottom: 40px;\n margin-left: 20px;\n margin-right: 20px;\n }\n"])), devices.mobile);
12282
- var TextContent = /*#__PURE__*/styled(BodyContent)(_templateObject4$L || (_templateObject4$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && :is(h1, h2, h3, h4, h5, h6, p, ul, ol):first-child {\n margin: 35px 0 10px;\n\n @media ", " {\n margin-top: 24px;\n }\n }\n\n && :is(h1, h2, h3, h4, h5, h6, p, ul, ol):last-child {\n margin-bottom: 0;\n }\n"])), devices.mobile);
12527
+ var _templateObject$1r, _templateObject2$17, _templateObject3$U, _templateObject4$M;
12528
+ var UpsellBorderBox = /*#__PURE__*/styled.div(_templateObject$1r || (_templateObject$1r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: solid 4px;\n border-color: var(--upsell-border-color);\n padding: 66px 74px 70px;\n\n @media ", " {\n & {\n border-left: none;\n border-right: none;\n padding: 40px 0px;\n }\n }\n"])), devices.mobile);
12529
+ var TitleContent = /*#__PURE__*/styled(HarmonicHeader)(_templateObject2$17 || (_templateObject2$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-primary-black);\n\n @media ", " {\n margin-left: 20px;\n margin-right: 20px;\n }\n }\n"])), devices.mobile);
12530
+ var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 60px;\n\n @media ", " {\n margin-bottom: 40px;\n margin-left: 20px;\n margin-right: 20px;\n }\n"])), devices.mobile);
12531
+ var TextContent = /*#__PURE__*/styled(BodyContent)(_templateObject4$M || (_templateObject4$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && :is(h1, h2, h3, h4, h5, h6, p, ul, ol):first-child {\n margin: 35px 0 10px;\n\n @media ", " {\n margin-top: 24px;\n }\n }\n\n && :is(h1, h2, h3, h4, h5, h6, p, ul, ol):last-child {\n margin-bottom: 0;\n }\n"])), devices.mobile);
12283
12532
 
12284
- var _templateObject$1r;
12285
- var Wrapper$a = /*#__PURE__*/styled.div(_templateObject$1r || (_templateObject$1r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 60px 74px;\n grid-template-columns: repeat(2, 1fr);\n width: 100%;\n\n @media ", " {\n gap: 40px 74px;\n width: 100%;\n padding-left: 0;\n padding-right: 0;\n grid-template-columns: 1fr;\n }\n"])), devices.mobile);
12533
+ var _templateObject$1s;
12534
+ var Wrapper$a = /*#__PURE__*/styled.div(_templateObject$1s || (_templateObject$1s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 60px 74px;\n grid-template-columns: repeat(2, 1fr);\n width: 100%;\n\n @media ", " {\n gap: 40px 74px;\n width: 100%;\n padding-left: 0;\n padding-right: 0;\n grid-template-columns: 1fr;\n }\n"])), devices.mobile);
12286
12535
 
12287
12536
  var UpsellCards = function UpsellCards(_ref) {
12288
12537
  var upsellCards = _ref.upsellCards;
@@ -12311,13 +12560,15 @@ var UpsellSection = function UpsellSection(_ref) {
12311
12560
  upsellCards = _ref.upsellCards,
12312
12561
  _ref$theme = _ref.theme,
12313
12562
  theme = _ref$theme === void 0 ? ThemeType.Core : _ref$theme,
12314
- className = _ref.className;
12563
+ className = _ref.className,
12564
+ titleFontFamily = _ref.titleFontFamily;
12315
12565
  var themedUpsellCards = upsellCards ? [].concat(upsellCards).map(function (card) {
12316
12566
  return _extends({}, card, {
12317
12567
  theme: card.theme || theme,
12318
12568
  secondaryTheme: card.secondaryTheme || card.theme || theme
12319
12569
  });
12320
12570
  }) : [];
12571
+ var isVictorTitleFont = titleFontFamily === 'Victor';
12321
12572
  return /*#__PURE__*/React__default.createElement(HarmonicThemeProvider, {
12322
12573
  theme: theme
12323
12574
  }, /*#__PURE__*/React__default.createElement(Grid, {
@@ -12330,7 +12581,7 @@ var UpsellSection = function UpsellSection(_ref) {
12330
12581
  columnStartSmallDevice: 1,
12331
12582
  columnSpanSmallDevice: 14
12332
12583
  }, /*#__PURE__*/React__default.createElement(UpsellBorderBox, null, /*#__PURE__*/React__default.createElement(TitleContent, {
12333
- serif: true
12584
+ serif: isVictorTitleFont
12334
12585
  }, title), /*#__PURE__*/React__default.createElement(TextContainer$2, null, /*#__PURE__*/React__default.createElement(TextContent, {
12335
12586
  text: richText != null ? richText : '',
12336
12587
  columnStartDesktop: 1,
@@ -12344,9 +12595,9 @@ var UpsellSection = function UpsellSection(_ref) {
12344
12595
  })))));
12345
12596
  };
12346
12597
 
12347
- var _templateObject$1s, _templateObject2$17;
12348
- var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$1s || (_templateObject$1s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--color-base-white);\n"])), zIndexes.anchor);
12349
- var StickyBarGrid = /*#__PURE__*/styled(Grid)(_templateObject2$17 || (_templateObject2$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n padding: 28px 0 26px;\n\n @media ", " {\n padding: 24px 0 28px;\n }\n\n @media ", " {\n border-bottom: none;\n }\n"])), function (_ref) {
12598
+ var _templateObject$1t, _templateObject2$18;
12599
+ var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$1t || (_templateObject$1t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--color-base-white);\n"])), zIndexes.anchor);
12600
+ var StickyBarGrid = /*#__PURE__*/styled(Grid)(_templateObject2$18 || (_templateObject2$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n padding: 28px 0 26px;\n\n @media ", " {\n padding: 24px 0 28px;\n }\n\n @media ", " {\n border-bottom: none;\n }\n"])), function (_ref) {
12350
12601
  var bottomBorder = _ref.bottomBorder;
12351
12602
  return bottomBorder && 'border-bottom: 1px solid var(--color-base-light-grey);';
12352
12603
  }, devices.mobileAndTablet, devices.mobile);
@@ -12377,11 +12628,11 @@ var StickyBar = function StickyBar(_ref) {
12377
12628
  }, children)));
12378
12629
  };
12379
12630
 
12380
- var _templateObject$1t, _templateObject2$18, _templateObject3$U, _templateObject4$M;
12381
- var InnerModal = /*#__PURE__*/styled.div(_templateObject$1t || (_templateObject$1t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 62px;\n background-color: var(--base-color-white);\n z-index: ", ";\n position: relative;\n\n @media ", ", ", " {\n height: 100vh;\n padding: 62px 0 0;\n }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
12382
- var CloseButton = /*#__PURE__*/styled.button(_templateObject2$18 || (_templateObject2$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n right: 0;\n margin: 15px;\n height: 26px;\n width: 26px;\n padding: 0;\n background-color: transparent;\n border: none;\n cursor: pointer;\n @media ", " {\n margin: 25px;\n }\n @media ", ", ", " {\n margin: 30px;\n }\n"])), devices.tablet, devices.desktop, devices.largeDesktop);
12383
- var ContentWrapper$3 = /*#__PURE__*/styled.div(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
12384
- var Overlay = /*#__PURE__*/styled(Grid)(_templateObject4$M || (_templateObject4$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n align-content: center;\n background-color: rgba(0, 0, 0, 0.4);\n"])));
12631
+ var _templateObject$1u, _templateObject2$19, _templateObject3$V, _templateObject4$N;
12632
+ var InnerModal = /*#__PURE__*/styled.div(_templateObject$1u || (_templateObject$1u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 62px;\n background-color: var(--base-color-white);\n z-index: ", ";\n position: relative;\n\n @media ", ", ", " {\n height: 100vh;\n padding: 62px 0 0;\n }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
12633
+ var CloseButton = /*#__PURE__*/styled.button(_templateObject2$19 || (_templateObject2$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n right: 0;\n margin: 15px;\n height: 26px;\n width: 26px;\n padding: 0;\n background-color: transparent;\n border: none;\n cursor: pointer;\n @media ", " {\n margin: 25px;\n }\n @media ", ", ", " {\n margin: 30px;\n }\n"])), devices.tablet, devices.desktop, devices.largeDesktop);
12634
+ var ContentWrapper$3 = /*#__PURE__*/styled.div(_templateObject3$V || (_templateObject3$V = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
12635
+ var Overlay = /*#__PURE__*/styled(Grid)(_templateObject4$N || (_templateObject4$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n align-content: center;\n background-color: rgba(0, 0, 0, 0.4);\n"])));
12385
12636
 
12386
12637
  var _excluded$t = ["isOpen", "setIsOpen", "children", "appElementId"];
12387
12638
  var MAX_Z_INDEX = 9999999999;
@@ -12585,21 +12836,21 @@ var getCardSlideMobileStyles = function getCardSlideMobileStyles(type) {
12585
12836
  return "\n width: " + ("calc((" + columnsPerSlide + " * " + gridColumnWidth + ") + (" + gapsPerSlide + " * " + GRID_COLUMN_GAP + "))") + ";\n margin-right: " + ("calc(" + gridColumnWidth + " + (" + GRID_COLUMN_GAP + " * 2))") + ";\n ";
12586
12837
  };
12587
12838
 
12588
- var _templateObject$1u, _templateObject2$19, _templateObject3$V, _templateObject4$N, _templateObject5$E, _templateObject6$u, _templateObject7$o, _templateObject8$h, _templateObject9$c;
12589
- var ImageCarouselWrapper = /*#__PURE__*/styled.div(_templateObject$1u || (_templateObject$1u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n @media ", " {\n ", "\n }}\n\n &:fullscreen {\n background: var(--color-base-white);\n padding-top: 44px;\n padding-bottom: 84px;\n\n .swipe-slide > figure {\n height: var(--fullscreen-figure-height);\n\n > div {\n height: var(--fullscreen-figure-height);\n }\n }\n }\n"])), function (_ref) {
12839
+ var _templateObject$1v, _templateObject2$1a, _templateObject3$W, _templateObject4$O, _templateObject5$E, _templateObject6$u, _templateObject7$o, _templateObject8$h, _templateObject9$c;
12840
+ var ImageCarouselWrapper = /*#__PURE__*/styled.div(_templateObject$1v || (_templateObject$1v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n @media ", " {\n ", "\n }}\n\n &:fullscreen {\n background: var(--color-base-white);\n padding-top: 44px;\n padding-bottom: 84px;\n\n .swipe-slide > figure {\n height: var(--fullscreen-figure-height);\n\n > div {\n height: var(--fullscreen-figure-height);\n }\n }\n }\n"])), function (_ref) {
12590
12841
  var imagesHeightDesktop = _ref.imagesHeightDesktop;
12591
12842
  return "& {\n .swipe-slide {\n height: fit-content;\n width: auto;\n margin-right: var(--grid-column-gap);\n\n > figure {\n margin: 0px;\n\n > div {\n height: " + imagesHeightDesktop + "px;\n }\n }\n }\n }";
12592
12843
  }, devices.mobile, function (_ref2) {
12593
12844
  var imagesHeightDevice = _ref2.imagesHeightDevice;
12594
12845
  return "&&& {\n .swipe-slide > figure {\n > div {\n height: " + imagesHeightDevice + "px;\n }\n }\n }";
12595
12846
  });
12596
- var CardsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject2$19 || (_templateObject2$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n}"])), function (_ref3) {
12847
+ var CardsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject2$1a || (_templateObject2$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n}"])), function (_ref3) {
12597
12848
  var type = _ref3.type,
12598
12849
  isActive = _ref3.isActive;
12599
12850
  return "\n & {\n .swipe-slide {\n " + getCardSlideDesktopStyles(type, isActive) + "\n }\n }\n\n @media " + devices.tablet + " {\n & {\n .swipe-slide {\n " + getCardSlideTabletStyles(type) + "\n }\n }\n }\n\n @media " + devices.mobile + " {\n && {\n .swipe-slide {\n " + getCardSlideMobileStyles(type) + "\n }\n }\n }\n ";
12600
12851
  });
12601
- var TitleButtonsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$V || (_templateObject3$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 28px;\n\n @media ", " {\n padding-bottom: 0;\n }\n\n @media ", " {\n margin-bottom: 20px;\n }\n"])), devices.mobile, devices.mobile);
12602
- var CarouselInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$N || (_templateObject4$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n user-select: text;\n"])));
12852
+ var TitleButtonsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$W || (_templateObject3$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 28px;\n\n @media ", " {\n padding-bottom: 0;\n }\n\n @media ", " {\n margin-bottom: 20px;\n }\n"])), devices.mobile, devices.mobile);
12853
+ var CarouselInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$O || (_templateObject4$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n user-select: text;\n"])));
12603
12854
  var TitleWrapper$5 = /*#__PURE__*/styled.div(_templateObject5$E || (_templateObject5$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref4) {
12604
12855
  var isDescriptionPresent = _ref4.isDescriptionPresent;
12605
12856
  return isDescriptionPresent && 'margin: 20px 0';
@@ -12637,7 +12888,8 @@ var Carousel = function Carousel(_ref) {
12637
12888
  _ref$infinite = _ref.infinite,
12638
12889
  infinite = _ref$infinite === void 0 ? true : _ref$infinite,
12639
12890
  _ref$useOffset = _ref.useOffset,
12640
- useOffset = _ref$useOffset === void 0 ? true : _ref$useOffset;
12891
+ useOffset = _ref$useOffset === void 0 ? true : _ref$useOffset,
12892
+ titleFontFamily = _ref.titleFontFamily;
12641
12893
  var _useState = useState(false),
12642
12894
  isFullscreen = _useState[0],
12643
12895
  setIsFullscreen = _useState[1];
@@ -12787,6 +13039,7 @@ var Carousel = function Carousel(_ref) {
12787
13039
  var carouselTitleId = "carousel-title-" + title;
12788
13040
  var titleSemanticLevelValue = titleSemanticLevel ? "h" + titleSemanticLevel : 'h2';
12789
13041
  var Wrapper = type === CarouselType.Image ? ImageCarouselWrapper : CardsCarouselWrapper;
13042
+ var isVictorTitleFont = titleFontFamily === 'Victor';
12790
13043
  return /*#__PURE__*/React__default.createElement(Wrapper, {
12791
13044
  className: className,
12792
13045
  type: type,
@@ -12810,7 +13063,7 @@ var Carousel = function Carousel(_ref) {
12810
13063
  isDescriptionPresent: !!description
12811
13064
  }, /*#__PURE__*/React__default.createElement(TitleText$1, {
12812
13065
  size: "medium",
12813
- serif: true,
13066
+ serif: isVictorTitleFont,
12814
13067
  hierarchy: titleSemanticLevelValue
12815
13068
  }, title)), /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
12816
13069
  size: "large"
@@ -12850,11 +13103,11 @@ var Carousel = function Carousel(_ref) {
12850
13103
  }, children))));
12851
13104
  };
12852
13105
 
12853
- var _templateObject$1v, _templateObject2$1a, _templateObject3$W, _templateObject4$O, _templateObject5$F, _templateObject6$v, _templateObject7$p, _templateObject8$i, _templateObject9$d, _templateObject0$b, _templateObject1$7, _templateObject10$5, _templateObject11$4, _templateObject12$4, _templateObject13$3, _templateObject14$1, _templateObject15$1, _templateObject16$1;
12854
- var HighlightsGrid$1 = /*#__PURE__*/styled(Grid)(_templateObject$1v || (_templateObject$1v = /*#__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 user-select: none;\n\n .highlight-carousel-text {\n color: var(--color-base-white);\n }\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
12855
- var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$1a || (_templateObject2$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 1 / 1 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n padding-top: 40px;\n padding-left: 50px;\n padding-right: 36px;\n user-select: text;\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 12;\n padding: 12px 0 12px var(--grid-margin);\n min-height: 64px;\n box-sizing: border-box;\n width: 100%;\n }\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 11;\n width: 100%;\n padding: 8px 0 8px 20px;\n min-height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
12856
- var HeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$W || (_templateObject3$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
12857
- var InfoWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$O || (_templateObject4$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 2 / 1 / 2 / 7;\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 a {\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n }\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 2 / 7;\n padding: 0 12px 12px var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n grid-area: 3 / 1 / 4 / 15;\n width: 100%;\n padding: 0 20px;\n margin: 24px 0;\n }\n }\n"])), devices.tablet, devices.mobile);
13106
+ var _templateObject$1w, _templateObject2$1b, _templateObject3$X, _templateObject4$P, _templateObject5$F, _templateObject6$v, _templateObject7$p, _templateObject8$i, _templateObject9$d, _templateObject0$b, _templateObject1$7, _templateObject10$5, _templateObject11$4, _templateObject12$4, _templateObject13$3, _templateObject14$1, _templateObject15$1, _templateObject16$1;
13107
+ var HighlightsGrid$1 = /*#__PURE__*/styled(Grid)(_templateObject$1w || (_templateObject$1w = /*#__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 user-select: none;\n\n .highlight-carousel-text {\n color: var(--color-base-white);\n }\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
13108
+ var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$1b || (_templateObject2$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 1 / 1 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n padding-top: 40px;\n padding-left: 50px;\n padding-right: 36px;\n user-select: text;\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 12;\n padding: 12px 0 12px var(--grid-margin);\n min-height: 64px;\n box-sizing: border-box;\n width: 100%;\n }\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 11;\n width: 100%;\n padding: 8px 0 8px 20px;\n min-height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
13109
+ var HeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$X || (_templateObject3$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
13110
+ var InfoWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$P || (_templateObject4$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 2 / 1 / 2 / 7;\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 a {\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n }\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 2 / 7;\n padding: 0 12px 12px var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n grid-area: 3 / 1 / 4 / 15;\n width: 100%;\n padding: 0 20px;\n margin: 24px 0;\n }\n }\n"])), devices.tablet, devices.mobile);
12858
13111
  var InfoLogoWrapper = /*#__PURE__*/styled.div(_templateObject5$F || (_templateObject5$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n width: 132px;\n height: 36px;\n\n @media ", " {\n & {\n margin-bottom: 16px;\n width: 102px;\n height: 28px;\n }\n }\n\n @media ", " {\n & {\n margin-bottom: 20px;\n width: 102px;\n height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
12859
13112
  var InfoTitleWrapper = /*#__PURE__*/styled.div(_templateObject6$v || (_templateObject6$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n\n h1,\n h2,\n h3 {\n margin-bottom: 8px;\n }\n"])));
12860
13113
  var InfoTextWrapper = /*#__PURE__*/styled.div(_templateObject7$p || (_templateObject7$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobileAndTablet);
@@ -13000,7 +13253,7 @@ var VideoSlide = function VideoSlide(_ref) {
13000
13253
  });
13001
13254
  return /*#__PURE__*/React__default.createElement(VideoWithControlsWrapper, {
13002
13255
  isCurrentSlide: isCurrentSlide
13003
- }, /*#__PURE__*/React__default.createElement(VideoWithControls$1, {
13256
+ }, /*#__PURE__*/React__default.createElement(VideoWithControls$2, {
13004
13257
  video: video,
13005
13258
  settings: settings
13006
13259
  }));
@@ -13031,7 +13284,10 @@ var SwipeCarousel = function SwipeCarousel(_ref2) {
13031
13284
  isCurrentSlide: index === currentSlide
13032
13285
  })) : (/*#__PURE__*/React__default.createElement("img", Object.assign({
13033
13286
  alt: mediaContent.alt
13034
- }, mediaContent)))));
13287
+ }, mediaContent, {
13288
+ fetchPriority: index === currentSlide ? 'high' : 'auto',
13289
+ loading: index === currentSlide ? 'eager' : 'lazy'
13290
+ })))));
13035
13291
  }));
13036
13292
  };
13037
13293
 
@@ -13040,7 +13296,8 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
13040
13296
  carouselTitle = _ref.carouselTitle,
13041
13297
  slides = _ref.slides,
13042
13298
  titleSemanticLevel = _ref.titleSemanticLevel,
13043
- className = _ref.className;
13299
+ className = _ref.className,
13300
+ titleFontFamily = _ref.titleFontFamily;
13044
13301
  var slidesMedia = useMemo(function () {
13045
13302
  return slides.map(function (_ref2) {
13046
13303
  var mediaContent = _ref2.mediaContent;
@@ -13071,6 +13328,7 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
13071
13328
  var handleClickInside = function handleClickInside(e) {
13072
13329
  e.stopPropagation();
13073
13330
  };
13331
+ var isVictorTitleFont = titleFontFamily === 'Victor';
13074
13332
  return /*#__PURE__*/React__default.createElement(HighlightsGrid$1, {
13075
13333
  role: "region",
13076
13334
  "aria-labelledby": carouselTitleId,
@@ -13083,7 +13341,7 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
13083
13341
  }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
13084
13342
  className: TYPOGRAPHY_CLASS_NAME,
13085
13343
  size: "medium",
13086
- serif: true,
13344
+ serif: isVictorTitleFont,
13087
13345
  hierarchy: titleSemanticLevelValue
13088
13346
  }, carouselTitle))), hasMultipleSlides && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapperMobile$1, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
13089
13347
  onClickNext: onNext,
@@ -13175,9 +13433,9 @@ var HighlightsStream = function HighlightsStream(_ref) {
13175
13433
  })));
13176
13434
  };
13177
13435
 
13178
- var _templateObject$1w, _templateObject3$X;
13179
- var CarouselWrapper$1 = /*#__PURE__*/styled.div(_templateObject$1w || (_templateObject$1w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n\n .swipe-slide {\n width: 100%;\n }\n"])));
13180
- var ButtonsWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$X || (_templateObject3$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
13436
+ var _templateObject$1x, _templateObject3$Y;
13437
+ var CarouselWrapper$1 = /*#__PURE__*/styled.div(_templateObject$1x || (_templateObject$1x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n\n .swipe-slide {\n width: 100%;\n }\n"])));
13438
+ var ButtonsWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$Y || (_templateObject3$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
13181
13439
 
13182
13440
  var MinimalCarousel = function MinimalCarousel(_ref) {
13183
13441
  var children = _ref.children;
@@ -13772,8 +14030,8 @@ var Theme = function Theme(_ref) {
13772
14030
  }, children);
13773
14031
  };
13774
14032
 
13775
- var _templateObject$1x;
13776
- var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1x || (_templateObject$1x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", ";\n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n\n --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n --harmonic-text-link-underline-offset: 4px;\n --harmonic-text-transform-navigation: capitalize;\n --harmonic-font-size-navigation: 19px;\n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n }\n\n @media ", " {\n\n }\n\n @media ", " {\n\n }\n }\n"])), function (_ref) {
14033
+ var _templateObject$1y;
14034
+ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1y || (_templateObject$1y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", ";\n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n\n --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n --harmonic-text-link-underline-offset: 4px;\n --harmonic-text-transform-navigation: capitalize;\n --harmonic-font-size-navigation: 19px;\n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n }\n\n @media ", " {\n\n }\n\n @media ", " {\n\n }\n }\n"])), function (_ref) {
13777
14035
  var theme = _ref.theme;
13778
14036
  return theme.colors.primary;
13779
14037
  }, function (_ref2) {
@@ -14720,10 +14978,10 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1x || (_templa
14720
14978
  return theme.footer.tablet.paddingBottom;
14721
14979
  }, devices.desktop, devices.largeDesktop);
14722
14980
 
14723
- var _templateObject$1y, _templateObject2$1b, _templateObject3$Y;
14724
- var FigureBlock = /*#__PURE__*/styled.figure(_templateObject$1y || (_templateObject$1y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
14725
- var BlockquoteBlock = /*#__PURE__*/styled.blockquote(_templateObject2$1b || (_templateObject2$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
14726
- var AttributionBlock = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject3$Y || (_templateObject3$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 32px 0;\n\n & cite {\n font-style: normal;\n }\n\n @media ", " {\n padding: 24px 0;\n }\n"])), devices.mobile);
14981
+ var _templateObject$1z, _templateObject2$1c, _templateObject3$Z;
14982
+ var FigureBlock = /*#__PURE__*/styled.figure(_templateObject$1z || (_templateObject$1z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
14983
+ var BlockquoteBlock = /*#__PURE__*/styled.blockquote(_templateObject2$1c || (_templateObject2$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
14984
+ var AttributionBlock = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject3$Z || (_templateObject3$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 32px 0;\n\n & cite {\n font-style: normal;\n }\n\n @media ", " {\n padding: 24px 0;\n }\n"])), devices.mobile);
14727
14985
 
14728
14986
  /* eslint-disable react/no-danger */
14729
14987
  var Quote = function Quote(_ref) {
@@ -14753,5 +15011,5 @@ var Quote = function Quote(_ref) {
14753
15011
  }, /*#__PURE__*/React__default.createElement("cite", null, attribution))))));
14754
15012
  };
14755
15013
 
14756
- export { Accordion, Accordions, AltHeader, AnchorBar, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyContent, BodyCopyHarmonic, BodyText, ButtonText, ButtonType, Caption, Card, Cards, Carousel, CarouselType, CastFilters as CastFilter, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicHeader, HarmonicOverline, HarmonicSize, HarmonicSubtitle, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, MiniCard, MinimalCarousel, ModalWindow, Navigation, NavigationText, Overline, PageHeading, PageHeadingCompact, PageHeadingHighlight, PageHeadingHighlightCarousel, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, Pagination, PasswordStrength, Paywall, PeopleListing, PersonCard, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls$1 as VideoWithControls, breakpoints, devices, useHarmonicTheme, zIndexes };
15014
+ export { Accordion, Accordions, AltHeader, AnchorBar, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyContent, BodyCopyHarmonic, BodyText, ButtonText, ButtonType, Caption, Card, Cards, Carousel, CarouselType, CastFilters as CastFilter, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicHeader, HarmonicOverline, HarmonicSize, HarmonicSubtitle, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, MiniCard, MinimalCarousel, ModalWindow, Navigation, NavigationText, Overline, PageHeading, PageHeadingCompact, PageHeadingHighlight, PageHeadingHighlightCarousel, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, Pagination, PasswordStrength, Paywall, PeopleListing, PersonCard, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls$2 as VideoWithControls, breakpoints, devices, useHarmonicTheme, zIndexes };
14757
15015
  //# sourceMappingURL=harmonic.esm.js.map