body[data-pagetype=public-page] #main,
body[data-pagetype=public-page] #wrapper.main-page { background: none; }
.main-page #main { overflow: visible; z-index: 10; }
.multi-lang-drop .dropdown-toggle { padding: 10px 0 9px 14px; border-radius: 0; }
.logo a { padding-left: 0; }
.hero-block #header { position: relative; display: block; height: auto; box-shadow: none; }
/*.hero-block #header .navbar { border: none; padding: 55px 0; }*/
.hero-block #header:after { display: none; }
.hero-block .hero-block-bg:before { content: ''; position: absolute; left: 50%; bottom: 1%; transform: translate(58%, -35px); width: 435px; height: 435px; background: url(../../../../cstatic/1f259aee-2851-4864-9b9b-763f4871ca26/debit-hero-img.svg) no-repeat; pointer-events: none; }
.hero-block #header { margin: 0 0 73px; }
.hero-block #header .navbar { border-width: 0; }
.navbar-expand-lg .navbar-nav .nav-item.sign-in .nav-link { color: #1336EF; }
@media(max-width:991px) {
	.hero-block #header:after { display: none; }
}
.hero-block .hero-block-bg { top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; position: absolute; }
.hero-block { color: #848689; height: 1%; z-index: 8; position: relative; display: table-header-group }
.hero-block .frame { position: relative; padding: 0 0 50px; }
.hero-block .hero-holder { position: relative; padding: 0 0 29px }
.hero-block .row { position: relative }
.hero-block .hero-holder h1 { margin: 0 0 24px; font-weight: 500; max-width: 590px; font-size: 4.571428571428571em; line-height: 1.0625; letter-spacing: -0.075rem;color: transparent; -webkit-background-clip: text; background-image: linear-gradient(90deg, #081A66 39%, #1434CB 58.66%); background-size: 200% auto;animation: gradientAnimation 3s ease-in-out reverse, solidColorTransition 0.5s ease 3s forwards; }
@keyframes gradientAnimation {
	0% { background-position: -100%; }
	100% { background-position: 100%; }
}
@keyframes solidColorTransition {
	0% { color: transparent; }
	100% { color: #081A66; background-image: transparent; }
}

/* .hero-block .hero-holder h1 .sub-heading { color: #1434CB; } */
.hero-block h2 { font-size: 1.714285714285714em; line-height: 1.333333333333333; color: #081A66; font-weight: 500; margin: 0 0 24px; letter-spacing: 0.04375rem; }
.hero-block p { margin: 0 0 40px; font-size: 1.285714285714286em; line-height: 1.555555555555556; color: #081A66; font-weight: 400; max-width: 440px; letter-spacing: 0.03125rem; }
.body-loaded .hero-block .hero-textbox { padding-bottom: 0; padding-top: 0; position: relative; }
.hero-block .media { align-items: center; }
.hero-block .media .thumbnail-img { position: relative; width: 220px; flex-shrink: 0; }
.hero-block .media .thumbnail-img > img { max-width: 100%; height: auto; display: block; }
.hero-block .btn-media { position: absolute; right: -23px; top: 50%; border-width: 0; margin: -21px 0 0; outline: solid 4px rgba(255, 255, 255, 0.6); border-radius: 100%; width: 42px; height: 42px; background: #F97C00; display: flex; align-items: center; justify-content: center; }
.hero-block .btn-media:where(:hover, :focus, :active) { background: #1E37A8; }
.hero-block .media .ico { width: 8px; height: 8px; background: url(../../../../cstatic/1f259aee-2851-4864-9b9b-763f4871ca27/debit-playIcon.svg) no-repeat 50% 50%; display: block; }
.hero-block .media .media-info { flex-grow: 1; padding: 0 0 0 38px; }
.hero-block h3 { font-size: 1.428571428571429em; line-height: 1.1; font-weight: 600; color: #081A66; margin: 0 0 15px; letter-spacing: -0.0625rem; }
.hero-block .media-info p { color: #0D227F; margin: 0; font-size: 1.285em; line-height: 1.25; max-width: 250px;}

.form-login { z-index: 3; max-width: 462px; margin: 0 0 0 auto; position: relative; }
.form-login .alert.alert-danger { padding-left: 50px; margin-top: -15px }
.form-login .alert.alert-danger br { display: none }
.form-login .form-area { padding: 37px 40px 40px; border-radius: 24px; margin: 0 0 0 -8px; box-shadow: 0px 20px 80px -10px rgba(166, 194, 228, 0.25);}
@media(max-width:767px) {
	.form-login:before { display: none; }
	.hero-block .hero-block-bg { background-size: cover; }
}
.form-login .form-logo { font-size: 1.625rem; line-height: 1.45833; margin: 0 0 21px; font-weight: 400; letter-spacing: -0.0125rem;color: #000; font-weight: 600; }
.form-login .form-group { margin: 0 0 21px }
.form-login .field-holder { min-height: 70px; margin: 0 0 16px }
.form-login .field { position: relative }
.form-login .field label { color: #000823; font-size: 1em; line-height: 1.428571428571429; }
.field-readonly-holder .label-slide label, .label-slide label.top-auto { transform: translate(0,0) scale(1); transform-origin: 0 0; }

/*.form-login .field.field-focused label{color:#999;font-size:.85714em;line-height:20px}*/
.form-login .field .ico { top: 50%; left: 21px; color: #d7d9e0; font-size: 24px; line-height: 1; position: absolute; margin: -12px 0 0; pointer-events: none }
.form-login .field .ico~.form-control { padding-left: 56px }
.form-login .field .link { right: 0; top: 100%; font-weight: 400; position: absolute; margin: 6px 0 0; font-size: 1em; line-height: 1.428571428571429; color: #081A66; }
.form-login .field .link:where(:hover, :focus, :active) { color: var(--ch32-brand); text-decoration: underline; }
.form-login .field .link~.form-control { padding-right: 70px }
.form-login label { font-weight: 400; font-size: 0.75rem; line-height: 20px }
.form-login .form-control { height: 40px; color: #222; border-width: 0 0 2px; font-size: 1.14286em; line-height: 1.5 }
.form-login .form-control::-webkit-input-placeholder { color: #999 }
.form-login .form-control::-moz-placeholder { opacity: 1; color: #999 }
.form-login .form-control:-moz-placeholder { color: #999 }
.form-login .form-control:-ms-input-placeholder { color: #999 }
.form-login .form-control.placeholder { color: #999 }
.form-login .remember { margin: 24px 0 0; }
.form-login .error-field .link { color: #ce6262 }
.form-login .error-field .form-control { border-color: #ce6262 }
.form-login [data-type=submit] { width: 100%; display: block; margin: 16px 0 0; font-weight: 400; min-height: 46px; padding: 10px; position: relative; border-color: #69be28; font-size: 16px; line-height: 1.5; background: #69be28 }
.form-login [data-type=submit]:hover, .form-login [data-type=submit]:focus { background: #467f1b }
.form-login .btn-default[data-type=submit]:hover, .form-login .btn-default[data-type=submit]:focus { color: #fff !important }
.form-login [data-type=submit].btn-orange { margin-top: 15px; border-radius: 4px; font-weight: 500; }
.form-login [data-type=submit]:hover, .form-login [data-type=submit]:focus { color: #fff !important }
.form-login .btn.btn-orange:hover { background: #ffffff !important; border-color: #1434CB !important;	color: #1434CB !important;  }
.form-login .btn-default[data-type="submit"] {font-size: 20px; font-weight: 600; }
.form-login [data-type=submit] .ico { top: 50%; right: 21px; font-size: 12px; margin: -6px 0 0; position: absolute }
.form-login .form-footer { overflow: hidden; position: relative; margin: 50px -48px -49px; border-radius: 0 0 15px 15px; border-top: solid 1px #e5e5e5 }
.form-login h3 { margin: 0; font-size: 1.058823529411765em }
.form-login h3 a { display: block; font-weight: 400; color: #999; padding: 26px 120px 32px 47px }
.form-login h3 a:hover, .form-login h3 a:focus { text-decoration: none; color: #737373 }
.form-login h3 a:focus, .form-login h3 a:hover { background: #f1f1f1 }
.form-login h3 img[aria-hidden] { top: 50%; right: 45px; margin: -20px 0 0; position: absolute }
.form-login .heading { color: #69be28; display: block; margin: 0 0 8px; font-weight: 500; font-size: 1.42857em; line-height: 1.2 }
.form-login .remember label { margin: 0; font-size: 12px; line-height: 1.46154; color: #1B223A; }
.form-login [class*=icheckbox] { top: 0; vertical-align: middle }
.form-login.credit:before { left: 50%; content: ''; z-index: -2; bottom: -131px; position: absolute; width: 596px; height: 596px; margin: 0 0 0 -298px; background: url(../../../../cstatic/61b9a734-1434-4ba9-bb64-528c4c32f8cb/circle1.png) }
.form-login.credit .form-area { border-radius: 15px }
.form-login .captcha-area { margin: 30px 0 }
.form-login [class*="icheckbox"] { border-width: 1px; }
.form-login [class*="icheckbox"]:not(.hover, .focus, .checked) { border-color: #A1A3AE; }
.go-to-next-section { display: none }

/* manage-card-section */
.manage-card-section { padding: 41px 0 60px; }
.manage-card-section .holder { margin-left: -12px; margin-right: -12px; }
.manage-card-section .holder [class*="col-"] { padding-left: 12px; padding-right: 12px; }
.manage-card-section .inner-holder { height: 100%; display: flex; flex-direction: column; background: #1434CB; border-radius: 24px; color: #fff; padding: 64px 0 64px 40px; position: relative; overflow: hidden; }
.manage-card-section .inner-holder:before { width: 397px; height: 438px; content: ''; background: url(../../../../cstatic/1b6e5a6f-b355-409e-ba1e-c1800983b95d/debit-bgimg-1.svg); right: -19px; bottom: 20px; position: absolute; z-index: 1; }
.manage-card-section .inner-holder:after { width: 100%; height: 100%; z-index: 2; position: absolute; left: 0; top: 0;  background: url(../../../../cstatic/1f259aee-2851-4864-9b9b-763f4871ca29/debit-bg-2.svg) no-repeat 100% 100%; content: ''; }
.manage-card-section .inner { margin: 0; position: relative; z-index: 3; height: 100%; }
.manage-card-section .box { display: flex; align-items: center; height: 100%; gap: 57px; }
.manage-card-section .textbox { padding: 0; display: flex; flex-direction: column; }
.manage-card-section .text-content { flex-grow: 1; min-height: 359px; }
.manage-card-section .title { display: block; font-size: 1.142857142857143em; line-height: 1.5; margin: 0 0 16px; font-weight: 400; letter-spacing: 0.03125rem; }
.manage-card-section h2 { font-size: 36px; line-height: 40px; font-weight: 500; margin: 0 0 16px; }
.manage-card-section h2 .dot { color: #F97C00; }
.manage-card-section .textbox p { font-size: 1.142857142857143em; line-height: 1.5; margin: 0 0 10px; letter-spacing: 0.0375rem; }
.manage-card-section .link-holder { flex-shrink: 0; }
.manage-card-section .link-card { color: #fff; display: inline-flex; align-items: center; font-weight: 500; font-size: 1.285714285714286em; line-height: 1.222222222222222; }
.manage-card-section .link-card:where(:hover, :focus, :active) .text { text-decoration: underline; }
.manage-card-section .link-card .ico { flex-shrink: 0; border-radius: 100%; outline: solid 3px transparent; }
.manage-card-section .link-card:where(:hover, :focus, :active) .ico { outline: solid 3px rgba(255,255,255,0.2);  }
.manage-card-section .link-card .text { margin: 0 16px 0 0; }
.manage-card-section .link-card img { display: block; }
.manage-card-section .demo-card { width: 427px; }
.manage-card-section .focused.right .demo-card{ position: relative; left: 29px;}
.manage-card-section .demo-card img { display: block; }
.manage-card-section .add-info-holder.alt { overflow: hidden; color: #fff; }

.manage-card-section .alt .inner-holder { display: flex; flex-direction: column; border-radius: 24px; padding: 64px 40px; background: #000823 url(../../../../cstatic/1f259aee-2851-4864-9b9b-763f4871ca30/debit-bg-3.svg) no-repeat right -120px top 50%; }
.manage-card-section .focused.right .alt .inner-holder{background-position-x: 100%;}
.manage-card-section .alt .inner-holder:after,
.manage-card-section .alt .inner-holder:before { display: none; }

@media screen and (min-width: 992px) {
	.manage-card-section .info-holder,
	.manage-card-section .info-holder * { transition: all 0.75s ease; }
	.manage-card-section .textbox { max-width: 290px; flex: 0 0 290px; }
	.manage-card-section .demo-card { opacity: 0; }
	.manage-card-section .focused.left .info-holder:first-child { flex: 0 0 66.66667%; max-width: 66.66667%; }
	.manage-card-section .focused.left .info-holder:last-child { flex: 0 0 33.33333%; max-width: 33.33333%; }

	.manage-card-section .focused.right .info-holder:first-child { flex: 0 0 33.33333%; max-width: 33.33333%; }
	.manage-card-section .focused.right .info-holder:last-child { flex: 0 0 66.66667%; max-width: 66.66667%; }

	.manage-card-section .focused.left .info-holder:first-child .demo-card,
	.manage-card-section .focused.right .info-holder:last-child .demo-card { opacity: 1; }


	.manage-card-section .focused.left .info-holder:last-child .link-card .text,
	.manage-card-section .focused.right .info-holder:first-child .link-card .text { font-size: 0; line-height: 22px; }
	.manage-card-section .focused.left .info-holder:last-child .textbox p,
	.manage-card-section .focused.right .info-holder:first-child .textbox p { opacity: 0; }
	.manage-card-section .focused.right .info-holder:first-child .demo-card { width: 0; }
}

/* features-section */
.features-section { padding: 116px 0 60px; --leftColWidth: 42.44288224956063%; --rightColWidth: 57.55711775043937%; }
.features-section .container { max-width: 1350px; }
.features-section .holder { position: relative; background: #fff; }
.features-section .inner-holder { background: linear-gradient(180deg, #E5F3FF 0%, #FFFFFF 100%); border-radius: 24px; padding: 114px 92px 90px 90px; display: flex; position: relative; z-index: 2; border: solid 1px #E5F3FF; }
.features-section .bg-img { position: absolute; left: -150px; top: 50%; margin: 0; z-index: 1; pointer-events: none; width: 435px; height: 437px; }
.features-section .bg-img img { max-width: 100%; height: auto; display: block; }
.features-section .left-col { flex: 0 0 var(--leftColWidth); max-width: var(--leftColWidth); }
.features-section .inner { padding: 0 55px 0 0; display: flex; height: 100%; justify-content: space-between; flex-direction: column; }
.features-section .text-area { flex-shrink: 0; }
.features-section .title { display: block; color: #1434CB; font-size: 20px; line-height: normal; margin: 0 0 19px; font-weight: 500; letter-spacing: 0.04375rem; }
.features-section .headingh2 { font-size: 3.428571428571429em; line-height: 1.166666666666667; font-weight: 500; letter-spacing: -0.03125rem;  color: transparent;
	-webkit-background-clip: text; background-image: linear-gradient(90deg, #081A66 39%, #1434CB 58.66%);	background-size: 200% auto; 
}
.features-section .holder.section-active .headingh2 { animation: gradientAnimation 3s ease-in-out reverse, solidColorTransition 0.5s ease 3s forwards;  }
.features-section h2 .text { display: flex; align-items: flex-end; color: #1434CB; }
.features-section h2 img { margin: 0 0 7px 15px; position: relative; top: 12px;	left: 100px;}
.features-section .left-img { flex-shrink: 0; margin: 0 0 -90px; }
.features-section .left-img img { max-width: 100%; height: auto; display: block; }
.features-section .right-col { max-width: var(--rightColWidth); flex: 0 0 var(--rightColWidth); margin: 134px 0 0; height: 600px; position: relative;}
.features-section .right-col::before { position: absolute;	content: ''; top: 0; left: 0; width: 100%; height: 70px;
	background: linear-gradient(180deg, #ecf6ff 0%, rgba(255, 255, 255, 0) 100%); pointer-events: none; }
.features-section .right-col::after { position: absolute; content: ''; bottom: 0; left: 0; width: 100%; height: 50px; background: linear-gradient(360deg, #FFF 0%, rgba(255, 255, 255, 0) 100%); pointer-events: none; }  
.features-section .right-col .right-col-holder{ height: 100%; overflow-y: auto;}


.features-section .inner-box { display: flex; align-items: center; }
.features-section .inner-box + .inner-box { margin: 40px 0 0; }
.features-section .text-holder { padding: 0 24px 0 0; flex-grow: 1; }
.features-section h3 { font-size: 2em; line-height: 1.071428571428571; margin: 0 0 16px; font-weight: 500; color: #081A66 !important; letter-spacing: -0.03125rem; }
.features-section p { margin: 0; font-size: 1.142857142857143em; line-height: 1.25; color: #000823; letter-spacing: 0.0375rem; }
.features-section .demo-img-holder { flex-shrink: 0; width: 267px; }
.features-section .demo-img-holder img { max-width: 100%; height: auto; display: block; }
.features-section .left-img.mobile { display: none; }

/* benefits-section */
.benefits-section { padding: 62px 0 60px; }
.benefits-section[class] { background: none; }
.benefits-section .holder { position: relative; z-index: 2; }
.benefits-section .holder:before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 637px; height: 640px; background: url(../../../../cstatic/1f259aee-2851-4864-9b9b-763f4871ca26/debit-hero-img.svg) no-repeat; background-size: 100% 100%; z-index: -1; margin: 110px 0 0; }
.benefits-section .sub-head { text-align: center; margin: 0 auto 31px; max-width: 520px; }
.benefits-section .sub-head .title { display: block; margin: 0 0 19px; font-size: 20px; line-height: normal; color: #1434CB; font-weight: 500; }
.benefits-section h2 { font-size: 3.428571428571429em; line-height: 1.166666666666667; margin: 0; letter-spacing: -0.96px; font-weight: 500; color: #081A66; color: transparent;
	-webkit-background-clip: text; background-image: linear-gradient(90deg, #081A66 39%, #1434CB 58.66%);	background-size: 200% auto;
}
.benefits-section .holder.section-active .headingh2 { animation: gradientAnimation 3s ease-in-out reverse, solidColorTransition 0.5s ease 3s forwards; }
.benefits-section h2 .sub-title { display: block; color: #1434CB; }
.benefits-section .col-holder { display: flex; --subColWidth: 33.33333333333333333333%; margin: 0 -12px; }
.benefits-section .boxColumn { flex: 0 0 var(--subColWidth); max-width: var(--subColWidth); padding: 0 12px; }
.benefits-section .boxColumn:nth-child(2) { margin: 120px 0 0; }
.benefits-section .box { padding: 40px 24px; background: rgba(255, 255, 255, 0.8); border-radius: 16px; border: 1px solid rgba(199, 226, 255, 1); box-shadow: 0px 4px 12px 0px rgba(166, 194, 228, 0.1); backdrop-filter: blur(20px);  }
.benefits-section .box + .box { margin: 40px 0 0; }
.benefits-section .ico-holder { margin: 0 0 32px; display: flex; }
.benefits-section .ico-holder img { max-width: 100%; height: auto; display: block; }
.benefits-section .textbox { margin: 0; }
.benefits-section h3 { font-size: 2em; line-height: 1.071428571428571; color: #081A66; margin: 0 0 18px; font-weight: 500; letter-spacing: -0.01875rem; }
.benefits-section p { margin: 0; font-size: 1.142857142857143em; line-height: 1.25; color: #081A66; letter-spacing: 0.01875rem; }
.benefits-section .boxColumn:nth-child(1) .box:nth-child(2) h3 { letter-spacing: normal; }

/* bank-with-us */
.bank-with-us { padding: 58px 0 20px; }
.bank-with-us .holder { background: #1434CB url(../../../../cstatic/1f259aee-2851-4864-9b9b-763f4871ca32/debit-app-bg-1.svg) no-repeat 100% 50%; border-radius: 24px; display: flex; padding: 85px 97px 0 99px; color: #fff; }
.bank-with-us .demo-acc-img { width: 427px; flex-shrink: 0; }
.bank-with-us .demo-acc-img img { max-width: 100%; height: auto; display: block; }
.bank-with-us .column-right { flex-grow: 1; padding: 38px 0 0 56px; }
.bank-with-us .textbox { max-width: 461px; }
.bank-with-us h2 { font-size: 3.428571428571429em; line-height: 1.083333333333333; margin: 0 0 24px; font-weight: 500; color: #fff; }
.bank-with-us p { font-size: 1.285714285714286em; line-height: 1.444444444444444; margin: 0 0 40px; }
.bank-with-us .list-logos { margin: 0; display: flex; flex-wrap: wrap; }
.bank-with-us .list-logos li { margin: 0 13px 13px 0; }
.bank-with-us .list-logos a { display: block; border-radius: 8px; border: solid 1px #99C6FF; padding: 14px; height: 60px; }
.bank-with-us .list-logos a:where(:hover, :focus, :active) { background: #081A66; opacity: 1; }
.bank-with-us .list-logos a img { max-width: 100%; display: block; height: auto; }
.bank-with-us .list-logos .list-inline-item:last-child a{padding: 16px 14px;}


@media (max-width: 1365px) {
	.features-section .inner-holder { padding: 90px 50px; }
	.features-section .right-col { padding: 149px 0 0; }
	.features-section h2 img { width: 100px; margin: 0 0 13px; }
}

@media (max-width: 1199px) {
	.features-section .inner-holder { padding: 70px 40px; }
	.features-section .right-col { padding: 110px 0 0; }
	.features-section h2 { font-size: 2.571428571428571em; }
	.features-section .demo-img-holder { width: 200px; }
	.manage-card-section .demo-card { width: 340px; }
	.benefits-section h3 { font-size: 1.5em; }
	.bank-with-us .demo-acc-img { max-width: 280px; }
	.bank-with-us h2 { font-size: 2.25em; }
	.features-section{padding: 60px 0;}
}


@media (max-width:991px) {
	.logo { max-width: 192px; }
	.hero-block #header .navbar { padding: 20px 0; }
	.hero-block #header { margin: 0 0 65px; }
	.hero-block { text-align: center }
	.hero-block .frame { padding: 0 0 105px; }
	.manage-card-section { padding: 40px 0 60px; }
	.hero-block .hero-block-bg::before { transform: translate(-16%, -20px); }
	.hero-block h2 { font-size: 1.714285714285714em; line-height: 1.333333333333333; margin: 0 0 24px; }
	.hero-block h1 { max-width: 484px; margin: 0 auto 24px; font-size: 4.571428571428571em; line-height: 1.0625; }
	.hero-block p { margin: 0 auto 40px; max-width: 490px; }
	.hero-block .media { margin: 0 auto 40px; }
	.hero-block .media .media-info { text-align: left; }
	.form-login { margin: 0 auto -60px; text-align: left }
	.form-login .form-area { margin: 0; }
	.nav-active .navbar-collapse { padding: 0 !important }

	.hero-block .media { justify-content: center; }
	.hero-block .media .media-info { flex-grow: inherit; }
	.hero-block .hero-holder h1 { margin: 0 auto 24px; }

	.manage-card-section .info-holder { flex: 0 0 100%; max-width: 100%; }
	.manage-card-section .info-holder + .info-holder { margin: 24px 0 0; }
	.manage-card-section .box { gap: 50px; }
	.manage-card-section .demo-card { width: 371px; }
	.manage-card-section .alt .inner-holder{background: #000823 url(../../../../cstatic/1f259aee-2851-4864-9b9b-763f4871ca30/debit-bg-3.svg) no-repeat right 0px top 50%;}
	.manage-card-section .alt .inner-holder .demo-card{ position: relative; left: 75px;}

	.features-section { --leftColWidth: 100%; --rightColWidth: var(--leftColWidth); padding: 62px 0 60px; }
	.features-section .inner-holder { flex-direction: column; padding: 66px 39px; }
	.features-section .inner { height: auto; padding: 0; }
	.features-section .text-area { max-width: 400px; }
	.features-section h2 { font-size: 3.428571428571429em; line-height: 1.166666666666667; }
	.features-section .right-col { padding: 0 2px 0 0; margin: 48px 0 0; height: auto; flex: none;}
	.features-section .right-col::before, .features-section .right-col::after { display: none;}
	.features-section .demo-img-holder { width: 267px; }
	.features-section .left-img.mobile { display: inherit; }
	.features-section .left-img.desktop { display: none; }
	.features-section .left-img { margin: 48px auto -66px; }
	.features-section h2 img { display: none; }

	.benefits-section { padding: 62px 0 32px; }
	.benefits-section .sub-head { margin: 0 auto 40px; }
	.benefits-section .col-holder { flex-direction: column; --subColWidth: 100%; }
	.benefits-section .boxColumn { display: flex; flex-wrap: wrap; --boxColumnWidth: calc(50% - 12px); gap: 24px; }
	.benefits-section .box { flex: var(--boxColumnWidth); max-width: var(--boxColumnWidth); }
	.benefits-section .boxColumn:nth-child(2) { margin: 0; }
	.benefits-section .box,
	.benefits-section .box + .box { margin: 0 0 24px; }
	.benefits-section h3 { font-size: 2em; }

	.bank-with-us .holder { padding: 81px 40px 0; flex-direction: column; margin: 0 -15px; border-radius: 0; }
	.bank-with-us .demo-acc-img { max-width: none; order: 2; margin: 0 auto -2px; overflow: hidden; height: 392px; }
	.bank-with-us .demo-acc-img img { margin: 0 auto; max-width: 436px; }
	.bank-with-us .column-right { padding: 0 0 64px; order: 1; text-align: center; }
	.bank-with-us h2 { font-size: 3.428571428571429em; }
	.bank-with-us p { margin: 0 0 40px; }
	.bank-with-us .textbox { margin: 0 auto; }
	.bank-with-us .list-logos { justify-content: center; }
	.bank-with-us .list-logos li:last-child { margin-right: 0; }
	.bank-with-us .list-logos li { margin: 0 8px 16px; }

}
@media (max-width: 767px) {
	.form-login .form-area { padding: 40px; }
	.form-login .form-logo { font-size: 1.857142857142857em; }
	.hero-block .frame { padding: 0 0 82px; }
	.hero-block .hero-holder h1 { font-size: 3.428571428571429em; line-height: 1.208333333333333; }
	.hero-block p { letter-spacing: -0.025em; }
	.hero-block #header {margin: 0 0 44px;  }
	.hero-block .hero-block-bg::before, .benefits-section .holder::before { display: none;}

	.manage-card-section { padding: 30px 0; }
	.manage-card-section .info-holder + .info-holder { margin: 32px 0 0; }
	.manage-card-section .inner-holder { padding: 40px; }
	.manage-card-section .box { flex-direction: column; gap: 10px; align-items: flex-start; }
	.manage-card-section .text-content { min-height: inherit; }
	.manage-card-section .textbox p { margin: 0 0 15px; }
	.manage-card-section .demo-card { width: auto; }
	.manage-card-section .link-card .text { display: none; }
	.manage-card-section .demo-card img { max-width: 100%; height: auto; }
	.manage-card-section .alt .inner-holder { padding: 42px 40px 40px; }
	.manage-card-section .alt .inner-holder .demo-card{ left: 0;}
	.manage-card-section .alt .inner-holder {background-position:right -130px top 50%;  }
	
	.features-section { padding: 49px 0 30px; }
	.features-section .inner-holder { padding: 51px 23px; }
	.features-section h2 { font-size: 2.571428571428571em; line-height: 1.21; }
	.features-section .inner-box { flex-direction: column; align-items: flex-start; gap: 24px; }
	.features-section .right-col { padding: 0; }
	.features-section .text-holder { padding: 0; }
	.features-section .demo-img-holder { width: 297px; height: 200px; border-radius: 8px; overflow: hidden; }
	.features-section .demo-img-holder img { width: 100%; max-width: none; }
	.features-section .left-img { margin: 48px auto -51px; }
	.features-section .left-img img { max-width: 305px; }

	.benefits-section { padding: 51px 0 32px; }
	.benefits-section h2, .features-section .headingh2 { font-size: 2.571428571428571em; line-height: 1.21; letter-spacing: -0.0625rem; }

	.bank-with-us { padding: 22px 0 32px; }
	.bank-with-us .holder { padding: 80px 24px 0; margin: 0; border-radius: 24px; }
	.bank-with-us h2 { margin: 0 0 26px; }
	.bank-with-us .demo-acc-img { height: 237px; width: auto; }
	.bank-with-us .demo-acc-img img { width: 280px; }
	.bank-with-us .list-logos { margin: 0 -4px; }
	.bank-with-us .list-logos li { margin: 0 16px 16px 0; }
	.bank-with-us .list-logos li a { padding: 16px 8px; }
	.bank-with-us .column-right { padding: 0 0 34px; }
	
}
@media (max-width: 580px) {
	.logo { max-width: 144px; }
	.hero-block .media { max-width: 240px; flex-direction: column; margin: 0 auto 32px; }
	.form-login .form-area { padding: 40px; }
	.form-login .form-logo { font-size: 1.72em;  }
	.hero-block .media .media-info { padding: 0; text-align: center; }
	.hero-block .media .thumbnail-img { margin: 0 auto 12px; width: 153px; }
	.hero-block .btn-media { width: 30px; height: 30px; right: -15px; margin: -15px 0 0; }
	.hero-block h3 {font-size: 1.288em;}
	.benefits-section .boxColumn { flex-direction: column; --boxColumnWidth: 100%; gap: 0; }
	.hero-block .media-info p{font-size: 1.14em;}
}

.box svg { transition: transform 0.3s ease; }
.box svg path { stroke-dasharray: 500; stroke-dashoffset: 0; fill: none; }
.box.box-0:hover svg path { animation: boxAanimation 3s ease forwards infinite; }
@keyframes boxAanimation {
	0% { stroke-dashoffset: 0; }
	50% { stroke-dashoffset: 500; }
	100% { stroke-dashoffset: 0; }
}
.box.box-1:hover svg path { animation: boxBanimation 3s ease forwards infinite; }
@keyframes boxBanimation {
	0% { stroke-dashoffset: 0; }
	50% { stroke-dashoffset: 500; }
	100% { stroke-dashoffset: 0; }
}
.box.box-2:hover svg path { animation: boxCanimation 3s ease forwards infinite; }
@keyframes boxCanimation {
	0% { stroke-dashoffset: 0; }
	50% { stroke-dashoffset: 500; }
	100% { stroke-dashoffset: 0; }
}

.box.box-3 svg path { stroke-dasharray: 200; stroke-dashoffset: 0; transition: stroke 0.3s ease; }
.box.box-3:hover svg path { animation: drawPath 2s ease forwards infinite; }
@keyframes drawPath {
	0% { stroke-dashoffset: 0; }
	50% { stroke-dashoffset: 200; }
	100% { stroke-dashoffset: 0; }
}
.box.box-4:hover svg path { animation: boxEanimation 3s ease forwards infinite; }
@keyframes boxEanimation {
	0% { stroke-dashoffset: 0; }
	50% { stroke-dashoffset: 500; }
	100% { stroke-dashoffset: 0; }
}
.box.box-5:hover svg path { animation: boxFanimation 3s ease forwards infinite; }
@keyframes boxFanimation {
	0% { stroke-dashoffset: 0; }
	50% { stroke-dashoffset: 500; }
	100% { stroke-dashoffset: 0; }
}