PageSourceSearch

https://www.mx.com/_next/static/chunks/pages/case-studies/notre-dame-fcu-1ed02bda23ca4f77.js

js mx.com collected 2026-09-24 09:28:16 UTC 33,781 bytes, 1 lines download raw bytes

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[33423],{52249:function(a,b,c){(window.__NEXT_P=window.__NEXT_P||[]).push(["/case-studies/notre-dame-fcu",function(){return c(30415)}])},65436:function(a,b,c){"use strict";var d=c(85893),e=c(35736),f=c(71819),g=c(57344);function h(){var a,b,c=(a=["\n  position: relative;\n  padding-top: 63px;\n  overflow: hidden;\n\n  .cta-accent-top {\n    position: absolute;\n    left: calc(50% - -348px);\n    top: -11px;\n    z-index: 2;\n    @media (max-width: 950px) {\n      left: calc(50%);\n    }\n  }\n  .cta-accent-bottom {\n    position: absolute;\n    left: calc(50% - 925px);\n    bottom: 13px;\n    z-index: 2;\n\n    @media (max-width: 950px) {\n      display: none;\n    }\n  }\n\n  .inner {\n    .block-graphic {\n      position: absolute;\n      top: -20px;\n      left: calc(50% + 219px);\n      @media (max-width: 950px) {\n        display: none;\n      }\n    }\n    .bg-graphic {\n      position: absolute;\n      top: 0;\n      left: calc(50% + -750px);\n      height: 100%;\n    }\n\n    background: black;\n    max-width: 100%;\n    position: relative;\n    display: grid;\n    place-items: center;\n    padding: 75px 30px;\n\n    h2 {\n      font-size: 38px;\n      font-style: normal;\n      font-weight: 700;\n      line-height: 1.25;\n      color: white;\n      width: 460px;\n      max-width: 100%;\n      @media (max-width: 500px) {\n        width: 300px;\n      }\n    }\n\n    .inner-inner {\n      width: 745px;\n      max-width: 100%;\n      position: relative;\n      z-index: 2;\n      @media (max-width: 800px) {\n        width: unset;\n      }\n\n      p {\n        font-size: 18px;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 1.5;\n        color: white;\n        margin: 20px 0;\n      }\n    }\n  }\n"],b||(b=a.slice(0)),Object.freeze(Object.defineProperties(a,{raw:{value:Object.freeze(b)}})));return h=function(){return c},c}var i=c(19521).default.section(h());b.Z=function(a){var b=a.header,c=a.paragraph,h=a.btnText,j=a.btnHref,k=a.blueButton,l=a.className;return(0,d.jsxs)(i,{className:"cta-2023".concat(l?" ".concat(l):""),children:[(0,d.jsx)(f.Z,{className:"cta-accent-top",url:"https://assets.mx.com/images/accent-graphics/cta-accent-top.svg"}),(0,d.jsx)(f.Z,{className:"cta-accent-bottom",url:"https://assets.mx.com/images/accent-graphics/cta-accent-bottom.svg"}),(0,d.jsxs)("div",{className:"inner",children:[(0,d.jsx)("img",{className:"block-graphic",src:"https://assets.mx.com/images/resources/2023/bg-block.svg",alt:"bg block"}),(0,d.jsx)("img",{className:"bg-graphic",src:"https://assets.mx.com/images/resources/2023/cta-bg.jpg",alt:"cta bg"}),(0,d.jsxs)("div",{className:"inner-inner",children:[(0,d.jsx)("h2",{children:b}),!c&&(0,d.jsx)(g.Z,{size:33}),c&&(0,d.jsx)("p",{children:c}),k?(0,d.jsx)(e.Z,{href:j,text:h}):(0,d.jsx)(e.Z,{href:j,text:h,darkOutlined:!0})]})]})]})}},14996:function(a,b,c){"use strict";var d=c(85893);function e(){var a,b,c=(a=["\n  display: inline-flex;\n  align-items: center;\n  svg {\n    transition: rotate ease 0.3s;\n  }\n  &.down svg {\n    rotate: 90deg;\n  }\n  &.left svg {\n    rotate: 180deg;\n  }\n"],b||(b=a.slice(0)),Object.freeze(Object.defineProperties(a,{raw:{value:Object.freeze(b)}})));return e=function(){return c},c}var f=c(19521).default.div(e());b.Z=function(a){var b=a.color,c=a.direction,e=a.down,g=a.onClick;return(0,d.jsx)(f,{onClick:g,className:"arrow ".concat(c||""," ").concat(e?"down":""),children:(0,d.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"7",height:"12",viewBox:"0 0 7 12",fill:"none",children:(0,d.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0.292893 0.292893C0.683417 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L6.70711 5.29289C7.09763 5.68342 7.09763 6.31658 6.70711 6.70711L1.70711 11.7071C1.31658 12.0976 0.683417 12.0976 0.292893 11.7071C-0.0976311 11.3166 -0.0976311 10.6834 0.292893 10.2929L4.58579 6L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z",fill:b||"#2C64EF"})})})}},2498:function(a,b,c){"use strict";var d=c(85893),e=c(67294),f=c(11405);b.Z=function(a){var b=a.children,c=a.onlyOnce,g=(0,e.useState)(""),h=g[0],i=g[1],j=(0,e.useRef)();return(0,e.useEffect)(function(){var a=function(){if(!h||!c){var a=f.Z.isHalfInViewport(j.current,300);a!=h&&i(a)}};return window.addEventListener("scroll",a),a(),function(){window.removeEventListener("scroll",a)}}
1,[h]),(0,d.jsx)("div",{ref:j,className:h?"on-screen":"",children:b})}},29624:function(a,b,c){"use strict";var d=c(85893);c(67294);var e=c(19521);function f(){var a,b,c=(a=["\n  background: #000;\n  position: relative;\n  overflow: hidden;\n  width: 1191px;\n  max-width: 100%;\n  margin: 0 auto;\n  border-radius: 200px;\n  margin-bottom: 50px;\n  padding: 80px 20px;\n  box-sizing: content-box;\n\n  @media only screen and (max-width: 1100px) {\n    max-width: 90%;\n  }\n\n  @media only screen and (max-width: 600px) {\n    max-width: 100%;\n    border-radius: 20px;\n  }\n\n  &:after {\n    filter: blur(100px);\n    position: absolute;\n    width: 100%;\n    height: 80%;\n    z-index: 1;\n    content: \"\";\n    top: 0;\n    left: 0;\n    background: linear-gradient(\n      212deg,\n      rgba(0, 188, 248, 100) 18.9%,\n      rgba(0, 117, 255, 100) 42.9%,\n      rgba(155, 63, 223, 100) 74.43%\n    );\n  }\n\n  @media only screen and (max-width: 1200px) {\n    box-sizing: border-box;\n  }\n\n  .text {\n    position: relative;\n    z-index: 2;\n    padding: 0 100px;\n\n    @media only screen and (max-width: 1100px) {\n      padding: 0 50px;\n    }\n    @media only screen and (max-width: 600px) {\n      padding: 0 20px;\n    }\n\n    blockquote {\n    }\n\n    p {\n      color: #fff;\n      font-size: 24px;\n      font-weight: 300;\n      line-height: 1.6;\n      margin: 0;\n\n      @media only screen and (max-width: 1100px) {\n        font-size: 18px;\n      }\n    }\n    .name {\n      color: #fff;\n      font-weight: 700;\n      font-size: 18px;\n      margin: 20px 0 0 0;\n\n      @media only screen and (max-width: 1100px) {\n        font-size: 16px;\n      }\n    }\n    .title {\n      color: #fff;\n      font-weight: 300;\n      font-size: 18px;\n      @media only screen and (max-width: 1100px) {\n        font-size: 16px;\n      }\n    }\n  }\n\n  .quote-logo {\n    position: absolute;\n    right: 100px;\n    bottom: 0;\n\n    @media only screen and (max-width: 800px) {\n      right: unset;\n      position: relative;\n      display: block;\n      text-align: center;\n      width: fit-content;\n      margin: 0 auto;\n      margin-top: 20px;\n    }\n  }\n"],b||(b=a.slice(0)),Object.freeze(Object.defineProperties(a,{raw:{value:Object.freeze(b)}})));return f=function(){return c},c}c(71819),c(35736);var g=e.default.div.withConfig({componentId:"sc-d98df5f9-0"})(f());b.Z=function(a){var b=a.quoteText,c=a.quoteeName,e=a.quoteeTitle,f=a.clientLogo;return(0,d.jsx)(d.Fragment,{children:(0,d.jsx)(g,{className:"quote",children:(0,d.jsxs)("div",{className:"text",children:[(0,d.jsx)("blockquote",{children:b}),(0,d.jsx)("p",{className:"name",children:c}),(0,d.jsx)("p",{className:"title",children:e}),f&&(0,d.jsx)("img",{className:"quote-logo",src:f,alt:"logo"})]})})})}},71819:function(a,b,c){"use strict";c.d(b,{Z:function(){return m}});var d=c(85893),e=c(34051),f=c.n(e),g=c(67294);function h(a,b,c,d,e,f,g){try{var h=a[f](g),i=h.value}catch(j){c(j);return}h.done?b(i):Promise.resolve(i).then(d,e)}var i=function(a){var b=a.url;a.animateClass;var c=(0,g.useRef)(null);return(0,g.useEffect)(function(){var a,d;(a=f().mark(function a(){var d,e,g,h,i,j;return f().wrap(function(a){for(;;)switch(a.prev=a.next){case 0:return a.prev=2,a.next=5,fetch(b);case 5:return d=a.sent,a.next=8,d.text();case 8:e=a.sent,a.next=13;break;case 11:a.prev=11,a.t0=a.catch(2);case 13:if(d){a.next=15;break}return a.abrupt("return");case 15:(i=(h=(g=new DOMParser()).parseFromString(e,"image/svg+xml")).documentElement).setAttribute("xmlns","http://www.w3.org/2000/svg"),(j=Array.from(i.children)).forEach(function(a,b){a.classList.contains("dont-animate")||(a.classList.add("loadified"),a.style.animationDelay="".concat(.2*b,"s"))}),c&&c.current&&c.current.replaceWith(i);case 22:case"end":return a.stop()}},a,null,[[2,11]])}),d=function(){var b=this,c=arguments;return new Promise(function(d,e){var f=a.apply(b,c);function g(a){h(f,d,e,g,i,"next",a)}function i(a){h(f,d,e,g,i,"throw",a)}g(void 0)})},function(){return d.apply(this,arguments)})()},[b]),(0,d.jsx)(d.Fragment,{children:(0,d.jsx)("div",{ref:c})})},j=c(2498);function k(){var a,b,c=(a=["\n  position: absolute;\n  z-index: -1;\n\n  svg {\n    overflow: visible;\n  }\n\n  @keyframes loadified-left-in {\n    0% {\n      translate: 100px;\n      opacity: 0;\n    }\n    100% {\n      translate: 0px;\n      opacity: 1;\n    }\n  }\n\n  @keyframes loadified-right-in {\n    0% {\n      translate: -100px;\n      opacity: 0;\n    }\n    100% {\n      translate: 0px;\n      opacity: 1;\n    }\n  }\n\n  .loadified {\n    animation-duration: 2s;\n    animation-fill-mode: forwards;\n    animation-timing-function: ease;\n    opacity: 0;\n  }\n\n  .on-screen {\n    .loadified:nth-child(odd) {\n      animation-name: loadified-left-in;\n    }\n\n    .loadified:nth-child(even) {\n      animation-name: loadified-right-in;\n    }\n  }\n"],b||(b=a.slice(0)),Object.freeze(Object.defineProperties(a,{raw:{value:Object.freeze(b)}})));return k=function(){return c},c}var l=c(19521).default.div(k()),m=function(a){var b=a.className,c=a.url;return(0,d.jsx)(l,{className:"fade-accent ".concat(b),children:(0,d.jsx)(j.Z,{children:(0,d.jsx)(i,{url:c})})})}},99057:function(a,b,c){"use strict";var d=c(47902);b.Z=d.Z},69170:function(a,b,c){"use strict";var d=c(31672);b.Z=d.Z},30415:function(a,b,c){"use strict";c.r(b);var d=c(85893);c(67294);var e=c(63189);c(11163);var f=c(19521),g=c(69170),h=c(99057),i=c(39994),j=c(71819),k=c(65436),l=c(14996),m=c(35736),n=c(57344),o=c(29624);function p(a,b){return b||(b=a.slice(0)),Object.freeze(Object.defineProperties(a,{raw:{value:Object.freeze(b)}}))}function q(){var a=p(["\n  overflow: hidden;\n  position: relative;\n\n  @media only screen and (max-width: 1100px) {\n    overflow: hidden;\n  }\n\n  p {\n    font-size: 16px;\n    font-weight: 300;\n    line-height: 1.2;\n  }\n\n  .popup-video {\n    top: 30px;\n    background-color: #000;\n    padding: 0;\n\n    @media only screen and (max-width: 900px) {\n      top: 50px;\n    }\n\n    #close-x {\n      top: -25px;\n      right: -35px;\n      filter: invert(1);\n\n      @media only screen and (max-width: 900px) {\n        top: -40px;\n        right: 0;\n        margin: auto;\n      }\n    }\n  }\n\n  .hero-accent-1 {\n    @media only screen and (max-width: 1100px) {\n      display: none;\n    }\n  }\n\n  #hero-bottom-wrap {\n    width: 100%;\n    position: relative;\n    z-index: -1;\n    .accent-hero-bottom {\n      position: absolute;\n      bottom: -31px;\n      left: calc(50% - 1595px);\n      z-index: 5;\n      @media only screen and (max-width: 1100px) {\n        display: none;\n      }\n    }\n  }\n\n  /* just for this page */\n  .quote-logo {\n    width: 158px !important;\n  }\n"]);return q=function(){return a},a}function r(){var a=p(["\n  position: relative;\n  z-index: 1;\n  padding: 0;\n  background: #000;\n  margin-bottom: 20px;\n\n  #hero-logo {\n    width: 285px;\n  }\n\n  #bg-wrap {\n    position: absolute;\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n    top: 0;\n    right: 0;\n  }\n  #hero-bg-gradient {\n    position: absolute;\n    top: -195px;\n    right: calc(50% - 871px);\n    z-index: -1;\n    pointer-events: none;\n    @media only screen and (max-width: 1100px) {\n      top: unset;\n      bottom: -307px;\n      right: calc(50% - 466px);\n    }\n  }\n\n  #hero-black-overlay {\n    position: absolute;\n    height: 100px;\n    background: linear-gradient(0deg, #000 20%, transparent 100%);\n    left: 0;\n    right: 0;\n    width: 100%;\n    bottom: 0;\n    z-index: 1;\n  }\n\n  .back-arrow {\n    font-style: normal !important;\n    font-weight: 600 !important;\n    font-size: 16px !important;\n    line-height: 1 !important;\n    color: #0075ff !important;\n    cursor: pointer !important;\n    margin-top: 15px !important;\n    margin-bottom: 60px;\n    display: block;\n\n    .arrow {\n      margin-right: 10px;\n      /* transition: transform 0.3s ease; */\n    }\n\n    &:hover {\n      .arrow {\n        /* transform: translateX(-10px); */\n      }\n    }\n  }\n\n  .case-featured-logo {\n    border-radius: 30px;\n    line-height: 1;\n    margin: 0;\n    width: fit-content;\n    display: flex;\n    margin-bottom: 30px;\n    border: 1px solid #fff;\n    max-height: 70px;\n    overflow: hidden;\n\n    @media only screen and (max-width: 1100px) {\n      margin: 0 auto 30px auto;\n      ",";\n    }\n  }\n\n  .partner-logo-wrap {\n    border-radius: 0 30px 30px 0;\n    padding: 15px 30px 15px 5px;\n    background: #fff;\n    width: 100%;\n    margin-left: -2px;\n\n    .partner-logo {\n      height: 20px;\n    }\n  }\n\n  .mx-logo-wrap {\n    display: flex;
1\n    align-items: center;\n    padding-right: 20px;\n    background: linear-gradient(-70deg, #fff 0%, #fff 25px, transparent 10px);\n    width: 90px;\n\n    .mx-logo {\n      padding: 0 0 0 20px;\n      margin-right: 10px;\n      box-sizing: content-box;\n      width: 40px;\n      height: auto;\n    }\n  }\n\n  .wrapper {\n    position: relative;\n    width: 1191px;\n    max-width: 100%;\n    margin: 0 auto;\n    padding: 0 20px;\n    box-sizing: content-box;\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n\n    @media only screen and (max-width: 1250px) {\n      box-sizing: border-box;\n    }\n    @media only screen and (max-width: 1100px) {\n      padding: 0;\n      flex-direction: column;\n      align-items: center;\n      text-align: center;\n    }\n\n    @media only screen and (max-width: 600px) {\n      box-sizing: border-box;\n    }\n\n    .hero-cta-btns {\n      display: flex;\n      width: 100%;\n      align-items: center;\n      margin-top: 40px;\n      position: relative;\n      z-index: 5;\n\n      @media only screen and (max-width: 1100px) {\n        margin: 30px auto 0 auto;\n        justify-content: space-between;\n        width: 600px;\n        justify-content: center;\n      }\n      @media only screen and (max-width: 700px) {\n        width: 100%;\n        flex-direction: column;\n      }\n\n      .primary-button {\n      }\n\n      .video-btn {\n        display: flex;\n        align-items: center;\n        margin-left: 100px;\n\n        @media only screen and (max-width: 700px) {\n          text-align: center;\n          flex-direction: column;\n          margin: 30px auto;\n        }\n\n        p {\n          font-size: 15px;\n          font-style: normal;\n          font-weight: 700;\n          color: #fff;\n\n          @media only screen and (max-width: 700px) {\n            margin-bottom: 15px;\n          }\n        }\n\n        img {\n          margin-left: 20px;\n          width: 171px;\n          cursor: pointer;\n        }\n      }\n    }\n    .hero-img-wrap {\n      position: relative;\n      top: 48px;\n      width: 450px;\n      max-width: 100%;\n      z-index: 2;\n      margin-left: 122px;\n      align-self: center;\n\n      @media only screen and (max-width: 1200px) {\n        margin-left: 0;\n        padding-left: 20px;\n      }\n\n      @media only screen and (max-width: 1100px) {\n        padding-left: 0;\n        margin: 0 auto;\n        width: 100%;\n      }\n\n      .hero-tall-img {\n        transform-origin: left;\n        pointer-events: none;\n        width: 352px;\n        top: 15px;\n        left: 40px;\n        position: relative;\n        z-index: 2;\n\n        @media only screen and (max-width: 1200px) {\n          transform: scale(1);\n        }\n\n        @media only screen and (max-width: 1100px) {\n          padding: 0 20px;\n          left: 0px;\n        }\n      }\n      .hero-user-back {\n        position: absolute;\n        bottom: 34px;\n        left: -50px;\n        z-index: 1;\n        @media only screen and (max-width: 1100px) {\n          left: calc(50% - 235px);\n        }\n      }\n      .hero-user-bottom {\n        position: absolute;\n        bottom: -85px;\n        left: 33px;\n        z-index: 0;\n        @media only screen and (max-width: 1100px) {\n          left: calc(50% - 235px);\n        }\n      }\n    }\n\n    .content {\n      z-index: 1;\n      max-width: 100%;\n      padding: 40px 0 50px 0;\n      display: flex;\n      justify-content: space-between;\n      height: 484px;\n\n      @media only screen and (max-width: 1100px) {\n        height: auto;\n        width: 100%;\n        padding: 40px 0 0 0;\n        flex-direction: column;\n        box-sizing: border-box;\n      }\n\n      h1 {\n        color: #fff;\n        font-size: 48px;\n        font-weight: 600;\n        line-height: 1.2;\n        margin-bottom: 20px;\n\n        @media only screen and (max-width: 600px) {\n          font-size: 30px;\n        }\n      }\n      & > div > p {\n        color: #fff;\n        font-size: 21px;\n        font-weight: 300;\n        line-height: 1.4;\n        margin-bottom: 30px;\n\n        @media only screen and (max-width: 1100px) {\n          margin: 0 auto;\n        }\n        @media only screen and (max-width: 600px) {\n          font-size: 18px;\n        }\n      }\n    }\n  }\n  .hero-top {\n    top: 33px;\n    right: 524px;\n    z-index: 3;\n    @media only screen and (max-width: 1100px) {\n      right: -76px;\n    }\n    @media only screen and (max-width: 650px) {\n      display: none;\n    }\n  }\n"]);return r=function(){return a},a}function s(){var a=p(["\n  width: 1191px;\n  max-width: 100%;\n  margin: 0 auto;\n  position: relative;\n  padding: 0 20px;\n  box-sizing: content-box;\n\n  @media only screen and (max-width: 1100px) {\n    flex-direction: column;\n    padding: 0 20px;\n    box-sizing: border-box;\n  }\n\n  .hero-accent-1 {\n    z-index: 2;\n    top: 120px;\n    right: -10px;\n\n    @media only screen and (max-width: 1100px) {\n      top: 135px;\n      right: -150px;\n    }\n    @media only screen and (max-width: 900px) {\n      display: none;\n    }\n  }\n\n  p {\n    font-size: 16px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1.5;\n  }\n\n  p.intro {\n    font-size: 16px;\n    font-weight: 400;\n    line-height: 1.5;\n    max-width: 100%;\n    @media only screen and (max-width: 1100px) {\n      width: 663px;\n      margin: auto;\n      text-align: center;\n    }\n  }\n\n  #challenge-solution {\n    display: flex;\n    justify-content: space-between;\n    flex-direction: column;\n    margin: 0 auto 50px;\n\n    @media only screen and (max-width: 1100px) {\n      flex-direction: column;\n    }\n\n    p {\n      margin: 10px 0;\n    }\n\n    .col-2 {\n      max-width: calc(100% - 30px);\n\n      @media only screen and (max-width: 1100px) {\n        max-width: 100%;\n        width: 663px;\n        flex-direction: column;\n        align-items: center;\n        margin: 0 auto;\n        text-align: center;\n      }\n\n      & > div {\n        @media only screen and (max-width: 1100px) {\n          width: 663px;\n          max-width: 100%;\n        }\n\n        &:first-child {\n          margin-right: 40px;\n\n          @media only screen and (max-width: 1100px) {\n            margin-right: 0;\n          }\n        }\n      }\n    }\n\n    h2 {\n      color: #0075ff;\n      font-size: 32px;\n      font-weight: bold;\n      margin-bottom: 20px;\n\n      @media only screen and (max-width: 1100px) {\n        text-align: center;\n      }\n    }\n\n    ul {\n      padding-left: 20px;\n      list-style: disc;\n      margin-top: 20px;\n\n      li {\n        margin: 10px 0;\n        line-height: 1.6;\n      }\n    }\n\n    #challenge {\n      position: relative;\n    }\n    .challenge-bottom-right {\n      position: absolute;\n      bottom: -85px;\n      right: calc(50% + -821px);\n    }\n\n    #solution {\n      h3 {\n        color: #0075ff;\n        font-size: 20px;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 1.2;\n      }\n      i {\n        color: #000;\n        font-size: 16px;\n        font-style: italic;\n        font-weight: 400;\n        line-height: 1.5;\n      }\n      @media only screen and (max-width: 1100px) {\n        width: 663px;\n        max-width: 100%;\n        margin: 0 auto;\n      }\n    }\n  }\n"]);return s=function(){return a},a}function t(){var a=p(["\n  background: #000;\n  padding: 50px 0 70px;\n  text-align: center;\n  position: relative;\n\n  .accent-benefits-left {\n    left: 232px;\n    top: -30px;\n    z-index: 2;\n  }\n\n  h2 {\n    color: #fff;\n    font-size: 32px;\n    font-weight: 600;\n    margin-bottom: 50px;\n  }\n\n  .accent-benefits-mid {\n    left: calc(50% - -277px);\n    bottom: -30px;\n    z-index: 2;\n  }\n\n  .wrapper {\n    width: 632px;\n    max-width: 100%;\n    margin: 0 auto;\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n\n    .benefit {\n      text-align: center;\n      margin: 10px 0;\n      padding: 0;\n      box-sizing: border-box;\n      width: 300px;\n\n      @media only screen and (max-width: 950px) {\n        width: ",";\n      }\n\n      @media only screen and (max-width: 950px) {\n        width: 100%;\n        padding: 20px;\n        margin: 0;\n      }\n\n      img {\n      }\n      p {\n        color: #fff;\n        font-size: 14px;\n        font-weight: 300;\n        line-height: 1.6;\n\n        @media only screen and (max-width: 950px) {\n          width: 200px;\n          max-width: 100%;\n          margin: 0 auto;\n        }\n      }\n    }\n  }\n"]);return t=function(){return a},a}function u(){var a=p(["\n  position: relative;\n  padding: 50px 20px;\n  box-sizing: content-box;\n\n  .accent-feature-1 {\n    position: absolute;\n    right: 200px;\n    bottom: -30px;\n    z-index: -1;\n    height: 100px;\n\n    @media only screen and (max-width: 1100px) {\n      display: none;\n    }\n  }\n\n  .accent-feature-2 {\n    left: 0;\n    top: 0;\n  }\n  .accent-feature-3 {\n    right: 300px;\n    bottom: 0;\n\n    @media only screen and (max-width: 600px) {\n      display: none;\n    }\n  }\n  .accent-feature-bottom {\n    left: -300px;\n    bottom: -100px;\n\n    @media only screen and (max-width: 600px) {\n      display: none;\n    }\n  }\n\n  .wrapper {\n    width: 1191px;\n    max-width: 100%;\n    margin: 0 auto;\n  }\n  .feature {\n    display: flex;\n    position: relative;\n\n    @media only screen and (max-width: 1100px) {\n      flex-direction: column-reverse;\n      padding: 0 20px;\n      margin-top: 20px;\n    }\n\n    &.v-center {\n      align-items: center;\n    }\n\n    .link-line {\n      margin-top: 20px;\n    }\n\n    .text {\n      width: 596px;\n      max-width: 100%;\n      margin-right: 30px;\n      margin-top: 70px;\n\n      @media only screen and (max-width: 1100px) {\n        margin: 20px auto !important;\n      }\n\n      h3 {\n        font-size: 32px;\n        font-style: normal;\n        font-weight: 700;\n        line-height: 1;\n        margin-bottom: 30px;\n      }\n      p {\n        font-size: 16px;\n        font-weight: 400;\n        line-height: 1.5;\n      }\n    }\n    img {\n      width: 600px;\n      max-width: 100%;\n    }\n    &.reverse {\n      flex-direction: row-reverse;\n\n      @media only screen and (max-width: 1100px) {\n        flex-direction: column-reverse;\n      }\n\n      .text {\n        margin-left: 30px;\n        margin-right: 0;\n      }\n    }\n\n    #product-image-1 {\n      position: relative;\n      left: 30px;\n      top: 50px;\n      @media only screen and (max-width: 1100px) {\n        left: unset;\n        top: -42px;\n        margin-top: 80px;\n      }\n    }\n\n    #product-image-2 {\n      scale: 1.2;\n      position: relative;\n      left: -61px;\n      top: 50px;\n      @media only screen and (max-width: 1100px) {\n        left: unset;\n        top: -42px;\n        margin-top: 120px;\n      }\n    }\n\n    #product-image-3 {\n      scale: 0.9;\n      position: relative;\n      left: 1px;\n      top: 1px;\n      @media only screen and (max-width: 1100px) {\n        left: unset;\n        top: -20px;\n        margin-top: 100px;\n      }\n    }\n  }\n"]);return u=function(){return a},a}function v(){var a=p(["\n  z-index: 1;\n  position: absolute;\n  ",";\n  ","\n  ","\n  ","\n  width: ",";\n  background: #000;\n  height: ",";\n"]);return v=function(){return a},a}var w=f.default.div.withConfig({componentId:"sc-feeab1a6-0"})(q()),x=f.default.div.withConfig({componentId:"sc-feeab1a6-1"})(r(),function(a){return"".concat(a.noHeaderImage&&"margin: 30px auto")}),y=f.default.div.withConfig({componentId:"sc-feeab1a6-2"})(s()),z=f.default.div.withConfig({componentId:"sc-feeab1a6-3"}
1)(t(),function(a){return a.benefits?"".concat(100/(a.benefits/2),"%"):"0"}),A=f.default.div.withConfig({componentId:"sc-feeab1a6-4"})(u()),B=f.default.div.withConfig({componentId:"sc-feeab1a6-5"})(v(),function(a){return a.top&&"top:  ".concat(a.top,";")},function(a){return a.bottom&&"bottom:  ".concat(a.bottom,";")},function(a){return a.left&&"left:  ".concat(a.left,";")},function(a){return a.right&&"right:  ".concat(a.right,";")},function(a){return a.width?a.width:"100%"},function(a){return a.height?a.height:"50px"});b.default=function(a){var a=null!==a?a:function(a){throw a}(new TypeError("Cannot destructure undefined"));return(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(e.Z,{title:"Notre Dame FCU Increases Active Users by 3 Times with MX",meta:"Notre Dame Federal Credit Union improves mobile banking experience with MX money management tools.",metaImage:"https://assets.mx.com/images/case-studies/notre-dame-fcu/meta.jpg"}),(0,d.jsx)(g.Z,{}),(0,d.jsxs)(w,{children:[(0,d.jsxs)(x,{className:"hero",children:[(0,d.jsx)("div",{id:"bg-wrap",children:(0,d.jsx)("img",{src:"https://assets.mx.com/images/case-studies/cure-for-lost-deposits/bg-gradient.svg",alt:"background gradient",id:"hero-bg-gradient"})}),(0,d.jsx)("div",{className:"wrapper",children:(0,d.jsxs)("div",{className:"content",children:[(0,d.jsxs)("div",{children:[(0,d.jsxs)("a",{className:"back-arrow",href:"/case-studies/",children:[(0,d.jsx)(l.Z,{color:"#0075FF",direction:"left"}),"View All Case Studies"]}),(0,d.jsx)("img",{src:"https://assets.mx.com/images/case-studies/notre-dame-fcu/mx-notre-dame-logos.png",alt:"notre dame logo",id:"hero-logo"}),(0,d.jsx)(n.Z,{size:20}),(0,d.jsx)("h1",{children:"Digital Money Management"}),(0,d.jsx)("p",{children:"Notre Dame FCU Increases Active Users by 3 Times with MX"}),(0,d.jsx)("div",{className:"hero-cta-btns",children:(0,d.jsx)(m.Z,{text:"Download the PDF",href:"https://assets.mx.com/images/case-studies/notre-dame-fcu/notre-dame-fcu.pdf"})})]}),(0,d.jsx)(j.Z,{className:"hero-top",url:"https://assets.mx.com/images/accent-graphics/case-studies/affinity-based-marketing/hero-top.svg"}),(0,d.jsxs)("div",{className:"hero-img-wrap",children:[(0,d.jsx)("img",{className:"hero-tall-img",src:"https://assets.mx.com/images/case-studies/notre-dame-fcu/hero-user.png",alt:"product image"}),(0,d.jsx)(j.Z,{className:"hero-user-bottom",url:"https://assets.mx.com/images/accent-graphics/case-studies/notre-dame-fcu/hero-user-bottom.svg"}),(0,d.jsx)(j.Z,{className:"hero-user-back",url:"https://assets.mx.com/images/accent-graphics/case-studies/notre-dame-fcu/hero-user-back.svg"})]})]})})]}),(0,d.jsx)("div",{id:"hero-bottom-wrap",children:(0,d.jsx)(j.Z,{className:"accent-hero-bottom",url:"https://assets.mx.com/images/accent-graphics/case-studies/afcu/hero-bottom.svg"})}),(0,d.jsx)(n.Z,{size:150}),(0,d.jsxs)(y,{children:[(0,d.jsx)("p",{className:"intro",children:"Notre Dame Federal Credit Union is a mission-based financial institution that shares the common beliefs of its members and is dedicated to solving problems through extraordinary member service. The credit union believes that by providing its members with access to a full array of financial resources, combined with honest advice and education, it can provide them with financial empowerment to enrich their lives and contribute to the betterment of the communities they serve."}),(0,d.jsx)(n.Z,{size:70}),(0,d.jsxs)("div",{id:"challenge-solution",children:[(0,d.jsxs)("div",{id:"challenge",className:"col-2",children:[(0,d.jsx)(j.Z,{className:"challenge-bottom-right",url:"https://assets.mx.com/images/accent-graphics/case-studies/notre-dame-fcu/challenge-bottom-right.svg"}),(0,d.jsx)("h2",{children:"The Challenge"}),(0,d.jsx)("div",{children:(0,d.jsx)("div",{children:(0,d.jsx)("p",{children:"Notre Dame FCU wanted to make all its financial tools as accessible and valuable as possible for their users, so the credit union strategically sought to make them available on mobile by integrating it with its online banking single sign-on (SSO), as opposed to using traditional standalone apps. The credit union is cognizant of the fact that having a centralized location where members can access any and all tools related to their finances will only serve to increase their overall financial health."})})})]}),(0,d.jsx)(n.Z,{size:80}),(0,d.jsxs)("div",{id:"solution",className:"col-2",children:[(0,d.jsx)("h2",{children:"The Solution"}),(0,d.jsxs)("p",{children:["Notre Dame integrated MX’s digital money management tools into its native mobile app, “Money Works.”",(0,d.jsx)("br",{}),(0,d.jsx)("br",{}),"Notre Dame knew that a seamless integration would be a “game changer” for its users and for the financial institution itself. Based on research that shows"," ",(0,d.jsx)("a",{target:"_blank",rel:"noreferrer",href:"https://www.nytimes.c
1om/2018/06/17/business/media/mobile-apps-advertising.html",children:"Millennials prefer mobile apps to personal service"}),", the credit union’s strategic team prioritized mobile integration. Within 60 days of launch, it saw a 20% increase in total users and a 3x increase in active users. Within 120 days, total users had increased 29%. Seeing the success it has had since this integration, Notre Dame FCU is now looking to add more innovative features to its mobile app, including valuable metrics around its rewards programs and the ability for individuals to pull their financial statements."]})]})]})]}),(0,d.jsx)(n.Z,{size:50}),(0,d.jsx)(o.Z,{quoteText:(0,d.jsx)(d.Fragment,{children:(0,d.jsxs)("p",{children:[(0,d.jsx)("b",{children:"We removed the roadblocks and friction to make this tool valuable."})," ","Standalone is nice, and it gives users a great tool, but you really need to integrate it into a mobile app so it’s alongside their users’ mobile funds."," ",(0,d.jsx)("b",{children:"Making it a one-stop shop is what makes all the difference."})]})}),quoteeName:"Rick Burden",quoteeTitle:"Chief Strategic Officer, Notre Dame FCU",clientLogo:"https://assets.mx.com/images/case-studies/notre-dame-fcu/notre-dame-logo.png",logoWidth:"158px"}),(0,d.jsx)(n.Z,{size:70}),(0,d.jsxs)(z,{benefits:2,children:[(0,d.jsx)(B,{top:"-10px",right:"0",left:"0",width:"80%",style:{borderRadius:"50px 50px 0 0",margin:"0 auto"}}),(0,d.jsx)("h2",{children:"Key Benefits"}),(0,d.jsxs)("div",{className:"wrapper",children:[(0,d.jsx)(j.Z,{className:"accent-benefits-left",url:"https://assets.mx.com/images/accent-graphics/resources/case-studies/indv/dots-benefits-left.svg"}),(0,d.jsx)(j.Z,{className:"accent-benefits-mid",url:"https://assets.mx.com/images/accent-graphics/resources/case-studies/indv/dots-benefits-mid.svg"}),(0,d.jsxs)("div",{className:"benefit",children:[(0,d.jsx)("img",{src:"https://assets.mx.com/images/case-studies/notre-dame-fcu/benefit-icon-1.svg",alt:"icon"}),(0,d.jsx)("p",{children:"increase in total users and a 3x increase in active users within 60 days of launch"})]}),(0,d.jsxs)("div",{className:"benefit",children:[(0,d.jsx)("img",{src:"https://assets.mx.com/images/case-studies/notre-dame-fcu/benefit-icon-2.svg",alt:"icon"}),(0,d.jsx)("p",{children:"increase in total users within 120 days"})]})]})]}),(0,d.jsx)(n.Z,{size:30}),(0,d.jsxs)(A,{children:[(0,d.jsx)("div",{className:"wrapper",children:(0,d.jsxs)("div",{className:"feature v-center",children:[(0,d.jsxs)("div",{className:"text",children:[(0,d.jsx)("h3",{children:"About MX Personal Financial Management"}),(0,d.jsx)("p",{children:"MX Personal Financial Management simplifies consumer interactions with their finances from connecting all their accounts in one place, to best-in-class digital money management and notification capabilities."}),(0,d.jsx)(i.Z,{href:"/products/personal-financial-management/",children:"Learn More"})]}),(0,d.jsx)("img",{src:"https://assets.mx.com/images/case-studies/cure-for-lost-deposits/pfm-elements.png",alt:"product image",id:"product-image-3"})]})}),(0,d.jsx)(n.Z,{size:0,mSize:100,mobile:1100}),(0,d.jsx)(j.Z,{className:"accent-feature-bottom",url:"https://assets.mx.com/images/accent-graphics/resources/case-studies/indv/dots-feature-bottom.svg"})]}),(0,d.jsx)(k.Z,{header:"Ready to Get Started?",paragraph:"Explore how MX can help you get the most from financial data and build better money experiences for consumers.",btnText:"Request Demo",btnHref:"/request-demo/",blueButton:!0})]}),(0,d.jsx)(h.Z,{})]})}},11405:function(a,b){"use strict";b.Z={isDivVerticallyCentered:function(a,b){var c=a.getBoundingClientRect(),d=window.innerHeight/2;return c.top<=d+b&&c.bottom>=d-b},isHalfInViewport:function(a){var b=a.getBoundingClientRect();return b.top+b.height/2>=0&&b.bottom-b.height/2<=window.innerHeight}}},11163:function(a,b,c){a.exports=c(90387)},4298:function(a,b,c){a.exports=c(20699)}},function(a){a.O(0,[7080,31672,49774,92888,40179],function(){return a(a.s=52249)}),_N_E=a.O()}])

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.