@comicrelief/component-library 8.47.3 → 8.47.4

package/dist/components/Atoms/SocialIcons/Icon/Icon.js

@@ -36,7 +36,7 @@ const StyledLink = _styledComponents.default.a.withConfig({
   let {
     newStyle
   } = _ref4;
-  return newStyle && (0, _styledComponents.css)(["background-color:", ";border-radius:0.5rem;padding:0.5rem;display:flex;align-items:center;justify-content:center;width:100%;height:100%;", " &:hover,&:focus{background-color:", ";opacity:1;}"], _ref5 => {
+  return newStyle && (0, _styledComponents.css)(["background-color:", ";border-radius:0.5rem;padding:0.5rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;height:100%;", " &:hover,&:focus{background-color:", ";opacity:1;}"], _ref5 => {
     let {
       theme
     } = _ref5;

package/dist/components/Atoms/SocialIcons/SocialIcons.js

@@ -14,46 +14,71 @@ var _spacing = _interopRequireDefault(require("../../../theme/shared/spacing"));
 const StyledList = _styledComponents.default.ul.withConfig({
   displayName: "SocialIcons__StyledList",
   componentId: "sc-i6jfaw-0"
-})(["display:flex;list-style-type:none;justify-content:", ";margin:", ";padding:0;align-items:center;@media ", "{justify-content:start;margin:", ";}"], newStyle => newStyle ? 'space-around' : 'center', _ref => {
+})(["display:flex;flex-wrap:", ";gap:", ";list-style-type:none;justify-content:", ";margin:", ";padding:0;align-items:center;@media ", "{justify-content:start;margin:", ";}"], _ref => {
   let {
     newStyle
   } = _ref;
-  return newStyle ? `${(0, _spacing.default)('lg')} 0` : '0 auto 0 0';
+  return newStyle ? 'wrap' : 'nowrap';
 }, _ref2 => {
   let {
-    theme
+    newStyle
   } = _ref2;
-  return theme.breakpoints2026('M');
-}, _ref3 => {
+  return newStyle ? `${(0, _spacing.default)('l')}` : '0';
+}, newStyle => newStyle ? 'flex-start' : 'center', _ref3 => {
   let {
     newStyle
   } = _ref3;
+  return newStyle ? `${(0, _spacing.default)('lg')} 0` : '0 auto 0 0';
+}, _ref4 => {
+  let {
+    theme
+  } = _ref4;
+  return theme.breakpoints2026('M');
+}, _ref5 => {
+  let {
+    newStyle
+  } = _ref5;
   return newStyle ? `${(0, _spacing.default)('sm')} 0` : '0 auto 0 0';
 });
 const StyledItem = _styledComponents.default.li.withConfig({
   displayName: "SocialIcons__StyledItem",
   componentId: "sc-i6jfaw-1"
-})(["width:48px;margin-right:", ";@media ", "{margin-right:", ";}"], _ref4 => {
+})(["width:", ";height:", ";flex:0 0 ", ";margin-right:", ";@media ", "{margin-right:", ";}"], _ref6 => {
   let {
     newStyle
-  } = _ref4;
+  } = _ref6;
+  return newStyle ? '54px' : '48px';
+}, _ref7 => {
+  let {
+    newStyle
+  } = _ref7;
+  return newStyle ? '54px' : 'auto';
+}, _ref8 => {
+  let {
+    newStyle
+  } = _ref8;
+  return newStyle ? '54px' : '48px';
+}, _ref9 => {
+  let {
+    newStyle
+  } = _ref9;
   return newStyle ? '0' : (0, _spacing.default)('m');
-}, _ref5 => {
+}, _ref10 => {
   let {
     theme
-  } = _ref5;
+  } = _ref10;
   return theme.breakpoints2026('M');
-}, _ref6 => {
+}, _ref11 => {
   let {
     newStyle
-  } = _ref6;
-  return newStyle ? (0, _spacing.default)('md') : (0, _spacing.default)('m');
+  } = _ref11;
+  return newStyle ? 0 : (0, _spacing.default)('m');
 });
 const StyledIcon = (0, _styledComponents.default)(_Icon.default).withConfig({
   displayName: "SocialIcons__StyledIcon",
   componentId: "sc-i6jfaw-2"
 })(["width:auto;"]);
-const SocialIcons = _ref7 => {
+const SocialIcons = _ref12 => {
   let {
     campaign,
     showFacebookSocialIcon,
@@ -65,7 +90,7 @@ const SocialIcons = _ref7 => {
     newStyle = false,
     invertColor = false,
     ...restProps
-  } = _ref7;
+  } = _ref12;
   const links = (0, _Links.default)(campaign);
 
   // We've got two sets now - one better suited to the new footer design,

package/dist/components/Atoms/SocialIcons/__snapshots__/SocialIcons.test.js.snap

@@ -25,11 +25,15 @@ exports[`renders correctly with Comic Relief links 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  gap: 0;
   list-style-type: none;
-  -webkit-box-pack: space-around;
-  -webkit-justify-content: space-around;
-  -ms-flex-pack: space-around;
-  justify-content: space-around;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
   margin: 0 auto 0 0;
   padding: 0;
   -webkit-align-items: center;
@@ -40,6 +44,10 @@ exports[`renders correctly with Comic Relief links 1`] = `
 
 .c1 {
   width: 48px;
+  height: auto;
+  -webkit-flex: 0 0 48px;
+  -ms-flex: 0 0 48px;
+  flex: 0 0 48px;
   margin-right: 1.5rem;
 }
 
@@ -166,11 +174,15 @@ exports[`renders correctly with Red Nose Day links and self target 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  gap: 0;
   list-style-type: none;
-  -webkit-box-pack: space-around;
-  -webkit-justify-content: space-around;
-  -ms-flex-pack: space-around;
-  justify-content: space-around;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
   margin: 0 auto 0 0;
   padding: 0;
   -webkit-align-items: center;
@@ -181,6 +193,10 @@ exports[`renders correctly with Red Nose Day links and self target 1`] = `
 
 .c1 {
   width: 48px;
+  height: auto;
+  -webkit-flex: 0 0 48px;
+  -ms-flex: 0 0 48px;
+  flex: 0 0 48px;
   margin-right: 1.5rem;
 }
 
@@ -307,11 +323,15 @@ exports[`renders correctly with Sport Relief links 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  gap: 0;
   list-style-type: none;
-  -webkit-box-pack: space-around;
-  -webkit-justify-content: space-around;
-  -ms-flex-pack: space-around;
-  justify-content: space-around;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
   margin: 0 auto 0 0;
   padding: 0;
   -webkit-align-items: center;
@@ -322,6 +342,10 @@ exports[`renders correctly with Sport Relief links 1`] = `
 
 .c1 {
   width: 48px;
+  height: auto;
+  -webkit-flex: 0 0 48px;
+  -ms-flex: 0 0 48px;
+  flex: 0 0 48px;
   margin-right: 1.5rem;
 }
 

package/dist/components/Molecules/EmailSignUp/EmailSignUp.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _Arrow = _interopRequireDefault(require("../../Atoms/Icons/Arrow"));
 var _EmailSignUp = require("./EmailSignUp.style");
 const EmailSignUp = _ref => {
   let {
@@ -33,6 +34,17 @@ const EmailSignUp = _ref => {
   }, register('email'), rest))), /*#__PURE__*/_react.default.createElement(_EmailSignUp.ButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_EmailSignUp.StyledEmailSignUpButton, {
     type: "submit",
     color: "white"
-  }, "Sign up"))));
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "emailSignUpButtonContent"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "emailSignUpButtonLabel"
+  }, "Sign up"), /*#__PURE__*/_react.default.createElement("span", {
+    className: "emailSignUpButtonArrow",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/_react.default.createElement(_Arrow.default, {
+    direction: "right",
+    colour: "white",
+    size: 18
+  })))))));
 };
 var _default = exports.default = EmailSignUp;

package/dist/components/Molecules/EmailSignUp/EmailSignUp.style.js

@@ -72,11 +72,11 @@ const StyledEmailInput = exports.StyledEmailInput = (0, _styledComponents.defaul
     theme
   } = _ref7;
   return theme.breakpoints2026('M');
-}, (0, _animations.springScaleAnimation)(true, 1.04, 1), _ref8 => {
+}, (0, _animations.formFieldInputAnimation)(4), _ref8 => {
   let {
     theme
   } = _ref8;
-  return (0, _styledComponents.css)(["", " background-color:", ";border-color:transparent;transition:background-color 0.2s ease;border:1px solid ", ";color:", ";&::placeholder{color:", ";}&:hover,&:focus{background-color:", ";}"], (0, _fontHelper.default)(theme, 'formFieldInput'), theme.color('grey_5'), theme.color('white'), theme.color('white'), theme.color('grey_2'), theme.color('grey_4_hover'));
+  return (0, _styledComponents.css)(["font-size:1rem;line-height:1.25rem;font-family:", ";background-color:", ";border-color:transparent;padding-left:18px;transition:background-color 0.2s ease,text-indent 0.18s ease;border:1px solid ", ";color:", ";&::placeholder{color:", ";}&:hover,&:focus{background-color:", ";}"], theme.fontFamilies('Montserrat'), theme.color('grey_5'), theme.color('white'), theme.color('white'), theme.color('grey_2'), theme.color('grey_4_hover'));
 });
 const ButtonWrapper = exports.ButtonWrapper = _styledComponents.default.div.withConfig({
   displayName: "EmailSignUpstyle__ButtonWrapper",
@@ -90,21 +90,21 @@ const ButtonWrapper = exports.ButtonWrapper = _styledComponents.default.div.with
 const StyledEmailSignUpButton = exports.StyledEmailSignUpButton = (0, _styledComponents.default)(_Button.default).withConfig({
   displayName: "EmailSignUpstyle__StyledEmailSignUpButton",
   componentId: "sc-d38yg6-7"
-})(["margin:0;font-family:", ";border-radius:0.5rem;@media ", "{", " margin:0;}&:hover,&:focus{background-color:", ";color:", ";}"], _ref10 => {
+})(["margin:0;font-family:", ";padding:", ";border-radius:0.5rem;overflow:hidden;@media ", "{margin:0;}.emailSignUpButtonContent{display:inline-grid;grid-auto-flow:column;grid-template-columns:auto 18px;column-gap:0.5rem;align-items:center;justify-content:center;line-height:1;}.emailSignUpButtonLabel{display:inline-block;transform:translateX(13px);transition:transform 0.22s ease;will-change:transform;}.emailSignUpButtonArrow{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;opacity:0;transform:translateX(-13px);transition:opacity 0.22s ease,transform 0.22s ease;will-change:transform,opacity;svg{fill:currentColor !important;}}&:hover,&:focus{background-color:", ";color:", ";.emailSignUpButtonLabel{transform:translateX(0);}.emailSignUpButtonArrow{opacity:1;transform:translateX(0);}}"], _ref10 => {
   let {
     theme
   } = _ref10;
   return theme.fontFamilies('Montserrat');
-}, _ref11 => {
+}, (0, _spacing.default)('md'), _ref11 => {
   let {
     theme
   } = _ref11;
   return theme.breakpoints2026('M');
-}, (0, _animations.springScaleAnimation)(true, 1.02, 1), _ref12 => {
+}, _ref12 => {
   let {
     theme
   } = _ref12;
-  return theme.color('white');
+  return theme.color('grey_2');
 }, _ref13 => {
   let {
     theme

package/dist/components/Organisms/Footer/FundraisingRegulatorLogo/FundraisingRegulatorLogo.js

@@ -12,7 +12,7 @@ var _animations = require("../../../../theme/shared/animations");
 const FundraisingRegulatorWrapper = _styledComponents.default.div.withConfig({
   displayName: "FundraisingRegulatorLogo__FundraisingRegulatorWrapper",
   componentId: "sc-1ngdz4u-0"
-})(["width:75%;margin:", ";max-width:200px;img{display:block;}", ""], _ref => {
+})(["width:75%;margin:", ";max-width:166px;img{display:block;}", ""], _ref => {
   let {
     $noMargin
   } = _ref;
@@ -21,7 +21,7 @@ const FundraisingRegulatorWrapper = _styledComponents.default.div.withConfig({
   let {
     animateOnHover
   } = _ref2;
-  return animateOnHover && (0, _animations.springScaleAnimation)(true);
+  return animateOnHover && (0, _animations.springScaleAnimation)(true, 1.03, 1);
 });
 const FundraisingRegulatorLogo = _ref3 => {
   let {

package/dist/components/Organisms/Footer/__snapshots__/Footer.test.js.snap

@@ -164,11 +164,15 @@ exports[`renders correctly 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  gap: 0;
   list-style-type: none;
-  -webkit-box-pack: space-around;
-  -webkit-justify-content: space-around;
-  -ms-flex-pack: space-around;
-  justify-content: space-around;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
   margin: 0 auto 0 0;
   padding: 0;
   -webkit-align-items: center;
@@ -179,6 +183,10 @@ exports[`renders correctly 1`] = `
 
 .c4 {
   width: 48px;
+  height: auto;
+  -webkit-flex: 0 0 48px;
+  -ms-flex: 0 0 48px;
+  flex: 0 0 48px;
   margin-right: 1.5rem;
 }
 

package/dist/components/Organisms/FooterNew/FooterNew.js

@@ -63,7 +63,7 @@ const FooterNew = _ref => {
     title: `Go to ${campaign} homepage`,
     animateRotate: animateRotate
   }, /*#__PURE__*/_react.default.createElement(_Logo.default, {
-    sizeSm: "48px",
+    sizeSm: "59px",
     sizeMd: "72px",
     rotate: false,
     campaign: campaign
@@ -131,6 +131,8 @@ const FooterNew = _ref => {
   }, rest)), /*#__PURE__*/_react.default.createElement(_FooterNew.FooterCopyright, null, displayCopyrightText && /*#__PURE__*/_react.default.createElement(_FooterNew.FooterCopyrightText, null, displayCopyrightText), legalText && /*#__PURE__*/_react.default.createElement(_FooterNew.FooterCopyrightText, null, legalText)), /*#__PURE__*/_react.default.createElement(_FooterNew.LogosContainer, {
     $mobileOnly: true,
     $showFundraiserAtBottom: true
-  }, showFundraisingRegulatorLogo && /*#__PURE__*/_react.default.createElement(_FundraisingRegulatorLogo.default, null)))));
+  }, showFundraisingRegulatorLogo && /*#__PURE__*/_react.default.createElement(_FundraisingRegulatorLogo.default, {
+    noMargin: true
+  })))));
 };
 var _default = exports.default = FooterNew;

package/dist/components/Organisms/FooterNew/FooterNew.style.js

@@ -15,7 +15,7 @@ const FooterWrapper = exports.FooterWrapper = _styledComponents.default.footer.a
 })).withConfig({
   displayName: "FooterNewstyle__FooterWrapper",
   componentId: "sc-17mkhu6-0"
-})(["text-align:left;background:", ";padding-top:6rem;@media ", "{padding-bottom:", ";}"], _ref => {
+})(["text-align:left;background:", ";padding-top:4.5rem;@media ", "{padding-bottom:", ";}@media ", "{padding-top:5.5rem;padding-bottom:5rem;}"], _ref => {
   let {
     theme
   } = _ref;
@@ -25,94 +25,99 @@ const FooterWrapper = exports.FooterWrapper = _styledComponents.default.footer.a
     theme
   } = _ref2;
   return theme.breakpoints2026('M');
-}, (0, _spacing.default)('lg'));
+}, (0, _spacing.default)('lg'), _ref3 => {
+  let {
+    theme
+  } = _ref3;
+  return theme.breakpoints2026('L');
+});
 const InnerWrapper = exports.InnerWrapper = _styledComponents.default.div.withConfig({
   displayName: "FooterNewstyle__InnerWrapper",
   componentId: "sc-17mkhu6-1"
-})(["position:relative;display:block;width:100%;height:100%;max-width:1200px;margin:0 auto;padding:0 ", ";@media ", "{padding:0 ", "};}"], (0, _spacing.default)('md'), _ref3 => {
+})(["position:relative;display:block;width:100%;height:100%;max-width:1200px;margin:0 auto;padding:0 ", ";@media ", "{padding:0 9rem;}"], (0, _spacing.default)('l'), _ref4 => {
   let {
     theme
-  } = _ref3;
+  } = _ref4;
   return theme.breakpoints2026('L');
-}, (0, _spacing.default)('md'));
+});
 const FooterLegalLine = exports.FooterLegalLine = (0, _styledComponents.default)(_Text.default).attrs({
   tag: 'p'
 }).withConfig({
   displayName: "FooterNewstyle__FooterLegalLine",
   componentId: "sc-17mkhu6-2"
-})(["text-align:left;margin-top:1rem;margin-bottom:", ";line-height:1.5rem;color:", ";"], (0, _spacing.default)('md'), _ref4 => {
+})(["text-align:left;margin-top:1rem;margin-bottom:", ";line-height:1.5rem;color:", ";opacity:0.8;"], (0, _spacing.default)('md'), _ref5 => {
   let {
     theme
-  } = _ref4;
-  return theme.color('grey');
+  } = _ref5;
+  return theme.color('white');
 });
 const TopSection = exports.TopSection = _styledComponents.default.div.withConfig({
   displayName: "FooterNewstyle__TopSection",
   componentId: "sc-17mkhu6-3"
-})(["display:flex;flex-direction:column;margin-bottom:", ";gap:", ";@media ", "{flex-direction:row;justify-content:space-between;align-items:", ";}"], (0, _spacing.default)('md'), (0, _spacing.default)('md'), _ref5 => {
+})(["display:flex;flex-direction:column;margin-bottom:", ";gap:", ";@media ", "{flex-direction:row;justify-content:space-between;align-items:", ";}"], (0, _spacing.default)('md'), (0, _spacing.default)('md'), _ref6 => {
   let {
     theme
-  } = _ref5;
+  } = _ref6;
   return theme.breakpoints2026('M');
-}, _ref6 => {
+}, _ref7 => {
   let {
     $hasEmailSignup
-  } = _ref6;
+  } = _ref7;
   return $hasEmailSignup ? 'flex-start' : 'center';
 });
 const TopSectionLeft = exports.TopSectionLeft = _styledComponents.default.div.withConfig({
   displayName: "FooterNewstyle__TopSectionLeft",
   componentId: "sc-17mkhu6-4"
-})(["display:flex;flex-direction:column;gap:", ";@media ", "{flex-direction:column;flex:0 0 auto;}"], (0, _spacing.default)('md'), _ref7 => {
+})(["display:flex;flex-direction:column;gap:", ";@media ", "{flex-direction:column;flex:0 0 auto;}"], (0, _spacing.default)('md'), _ref8 => {
   let {
     theme
-  } = _ref7;
+  } = _ref8;
   return theme.breakpoints2026('M');
 });
 const NewsletterSignUpWrapper = exports.NewsletterSignUpWrapper = _styledComponents.default.div.withConfig({
   displayName: "FooterNewstyle__NewsletterSignUpWrapper",
   componentId: "sc-17mkhu6-5"
-})(["max-width:100%;@media ", "{max-width:100%;}"], _ref8 => {
+})(["max-width:100%;@media ", "{max-width:100%;}"], _ref9 => {
   let {
     theme
-  } = _ref8;
+  } = _ref9;
   return theme.breakpoints2026('M');
 });
 const SocialIconWrapper = exports.SocialIconWrapper = _styledComponents.default.div.withConfig({
   displayName: "FooterNewstyle__SocialIconWrapper",
   componentId: "sc-17mkhu6-6"
-})(["margin-bottom:", ";box-sizing:content-box;gap:", ";display:", ";@media ", "{box-sizing:border-box;display:", ";margin-bottom:", ";align-items:center;}"], (0, _spacing.default)('md'), (0, _spacing.default)('md'), _ref9 => {
+})(["margin-bottom:", ";box-sizing:content-box;gap:", ";display:", ";@media ", "{box-sizing:border-box;display:", ";margin-bottom:", ";align-items:center;}"], (0, _spacing.default)('md'), (0, _spacing.default)('md'), _ref10 => {
   let {
     $desktopOnly
-  } = _ref9;
+  } = _ref10;
   if ($desktopOnly) return 'none';
   return 'block';
-}, _ref10 => {
+}, _ref11 => {
   let {
     theme
-  } = _ref10;
+  } = _ref11;
   return theme.breakpoints2026('M');
-}, _ref11 => {
+}, _ref12 => {
   let {
     $mobileOnly,
     $inTopSection
-  } = _ref11;
+  } = _ref12;
   if ($mobileOnly) return 'none';
   if ($inTopSection) return 'flex';
   return 'block';
-}, _ref12 => {
+}, _ref13 => {
   let {
     $inTopSection
-  } = _ref12;
+  } = _ref13;
   return $inTopSection ? '0' : (0, _spacing.default)('md');
 });
 const PrimaryNav = exports.PrimaryNav = _styledComponents.default.nav.withConfig({
   displayName: "FooterNewstyle__PrimaryNav",
   componentId: "sc-17mkhu6-7"
-})(["display:flex;flex-direction:column;list-style:none;padding:", " 0;margin:0 0 ", " 0;gap:", ";@media ", "{flex-direction:row;flex-wrap:wrap;gap:", ";}"], (0, _spacing.default)('md'), (0, _spacing.default)('md'), (0, _spacing.default)('l'), _ref13 => {
+})(["display:flex;flex-direction:column;list-style:none;padding:", " 0;margin:0 0 ", " 0;gap:", ";@media ", "{flex-direction:row;flex-wrap:wrap;gap:", ";}"], (0, _spacing.default)('md'), (0, _spacing.default)('md'), (0, _spacing.default)('l'), _ref14 => {
   let {
     theme
-  } = _ref13;
+  } = _ref14;
   return theme.breakpoints2026('M');
 }, (0, _spacing.default)('m'));
 const PrimaryNavItem = exports.PrimaryNavItem = _styledComponents.default.li.withConfig({
@@ -122,24 +127,29 @@ const PrimaryNavItem = exports.PrimaryNavItem = _styledComponents.default.li.wit
 const PrimaryNavLink = exports.PrimaryNavLink = (0, _styledComponents.default)(_Link.default).withConfig({
   displayName: "FooterNewstyle__PrimaryNavLink",
   componentId: "sc-17mkhu6-9"
-})(["color:", ";text-decoration:none;font-weight:bold;&:hover,&:focus{text-decoration:underline;text-decoration-color:", ";}"], _ref14 => {
+})(["color:", ";text-decoration:none;font-weight:bold;font-size:", ";&:hover,&:focus{text-decoration:underline;text-decoration-color:", ";}"], _ref15 => {
   let {
     theme
-  } = _ref14;
+  } = _ref15;
   return theme.color('white');
-}, _ref15 => {
+}, _ref16 => {
   let {
     theme
-  } = _ref15;
+  } = _ref16;
+  return theme.fontSize('s');
+}, _ref17 => {
+  let {
+    theme
+  } = _ref17;
   return theme.color('white');
 });
 const PrimaryNavText = exports.PrimaryNavText = (0, _styledComponents.default)(_Text.default).withConfig({
   displayName: "FooterNewstyle__PrimaryNavText",
   componentId: "sc-17mkhu6-10"
-})(["color:", ";font-weight:bold;"], _ref16 => {
+})(["color:", ";font-weight:bold;"], _ref18 => {
   let {
     theme
-  } = _ref16;
+  } = _ref18;
   return theme.color('white');
 });
 const SecondaryNav = exports.SecondaryNav = _styledComponents.default.nav.withConfig({
@@ -149,68 +159,58 @@ const SecondaryNav = exports.SecondaryNav = _styledComponents.default.nav.withCo
 const SecondaryNavItem = exports.SecondaryNavItem = _styledComponents.default.li.withConfig({
   displayName: "FooterNewstyle__SecondaryNavItem",
   componentId: "sc-17mkhu6-12"
-})(["margin:0;display:flex;align-items:center;@media ", "{display:inline;}&:not(:last-child)::after{content:'|';margin-left:", ";color:", ";}"], _ref17 => {
+})(["margin:0;display:flex;align-items:center;@media ", "{display:inline;}&:not(:last-child)::after{content:'|';margin-left:", ";color:", ";opacity:0.8;}"], _ref19 => {
   let {
     theme
-  } = _ref17;
+  } = _ref19;
   return theme.breakpoints2026('M');
-}, (0, _spacing.default)('sm'), _ref18 => {
+}, (0, _spacing.default)('sm'), _ref20 => {
   let {
     theme
-  } = _ref18;
-  return theme.color('grey');
+  } = _ref20;
+  return theme.color('white');
 });
 const SecondaryNavLink = exports.SecondaryNavLink = (0, _styledComponents.default)(_Link.default).withConfig({
   displayName: "FooterNewstyle__SecondaryNavLink",
   componentId: "sc-17mkhu6-13"
-})(["text-decoration:none;> span{color:", ";text-decoration:underline;text-decoration-color:", ";font-weight:normal;font-size:", ";}@media ", "{> span{text-decoration:none;}}&:hover,&:focus{text-decoration:underline;text-decoration-color:", ";}"], _ref19 => {
-  let {
-    theme
-  } = _ref19;
-  return theme.color('grey');
-}, _ref20 => {
-  let {
-    theme
-  } = _ref20;
-  return theme.color('grey');
-}, _ref21 => {
+})(["text-decoration:none;> span{color:", ";opacity:0.8;text-decoration:underline;text-decoration-color:", ";font-weight:normal;font-size:0.875rem;}@media ", "{> span{text-decoration:none;}}&:hover,&:focus{text-decoration:underline;text-decoration-color:", ";}"], _ref21 => {
   let {
     theme
   } = _ref21;
-  return theme.fontSize('xs');
+  return theme.color('white');
 }, _ref22 => {
   let {
     theme
   } = _ref22;
-  return theme.breakpoints2026('M');
+  return theme.color('white');
 }, _ref23 => {
   let {
     theme
   } = _ref23;
-  return theme.color('grey');
+  return theme.breakpoints2026('M');
+}, _ref24 => {
+  let {
+    theme
+  } = _ref24;
+  return theme.color('white');
 });
 const SecondaryNavText = exports.SecondaryNavText = (0, _styledComponents.default)(_Text.default).withConfig({
   displayName: "FooterNewstyle__SecondaryNavText",
   componentId: "sc-17mkhu6-14"
-})(["color:", ";font-weight:normal;"], _ref24 => {
+})(["color:", ";opacity:0.8;font-weight:normal;"], _ref25 => {
   let {
     theme
-  } = _ref24;
+  } = _ref25;
   return theme.color('white');
 });
 const LogosContainer = exports.LogosContainer = _styledComponents.default.div.withConfig({
   displayName: "FooterNewstyle__LogosContainer",
   componentId: "sc-17mkhu6-15"
-})(["display:flex;flex-direction:row;align-items:center;gap:", ";justify-content:", ";margin-top:", ";margin-bottom:", ";", " @media ", "{flex:0 0 auto;margin-top:0;margin-bottom:0;padding-top:", ";display:", ";justify-content:", ";}}@media ", "{display:", ";}"], (0, _spacing.default)('l'), _ref25 => {
-  let {
-    $mobileOnly
-  } = _ref25;
-  return $mobileOnly ? 'flex-start' : 'center';
-}, _ref26 => {
+})(["display:flex;flex-direction:row;align-items:center;gap:", ";justify-content:", ";margin-bottom:", ";", " @media ", "{flex:0 0 auto;margin-top:0;margin-bottom:0;padding-top:", ";display:", ";justify-content:", ";}}@media ", "{display:", ";}"], (0, _spacing.default)('l'), _ref26 => {
   let {
     $mobileOnly
   } = _ref26;
-  return $mobileOnly ? (0, _spacing.default)('md') : '0';
+  return $mobileOnly ? 'flex-start' : 'center';
 }, _ref27 => {
   let {
     $mobileOnly
@@ -293,20 +293,20 @@ const Brand = exports.Brand = (0, _styledComponents.default)(_Link.default).with
 const FooterCopyright = exports.FooterCopyright = _styledComponents.default.div.withConfig({
   displayName: "FooterNewstyle__FooterCopyright",
   componentId: "sc-17mkhu6-17"
-})(["display:block;width:100%;height:100%;text-align:left;"]);
+})(["display:block;width:100%;height:100%;text-align:left;margin-bottom:", ";@media ", "{margin-bottom:0;}"], (0, _spacing.default)('l'), _ref36 => {
+  let {
+    theme
+  } = _ref36;
+  return theme.breakpoints2026('L');
+});
 const FooterCopyrightText = exports.FooterCopyrightText = (0, _styledComponents.default)(_Text.default).attrs({
   tag: 'p'
 }).withConfig({
   displayName: "FooterNewstyle__FooterCopyrightText",
   componentId: "sc-17mkhu6-18"
-})(["color:", ";font-size:", ";margin-bottom:", ";"], _ref36 => {
-  let {
-    theme
-  } = _ref36;
-  return theme.color('grey');
-}, _ref37 => {
+})(["color:", ";opacity:0.8;font-size:0.875rem;margin-bottom:", ";"], _ref37 => {
   let {
     theme
   } = _ref37;
-  return theme.fontSize('xs');
+  return theme.color('white');
 }, (0, _spacing.default)('sm'));