/* =========================================================
               MAXBLO PREMIUM FOOTER
               BRAND:
               #18235F — Deep Navy
               #245DE8 — Electric Blue
               #3948D0 — Indigo
               #7045E8 — Violet
            ========================================================= */

 .mf-footer {

     --mf-navy: #18235F;
     --mf-blue: #245DE8;
     --mf-indigo: #3948D0;
     --mf-violet: #7045E8;

     position: relative;

     width: 100%;

     overflow: hidden;

     padding: 115px 0 0;

     background:
         radial-gradient(circle at 78% 5%,
             rgba(112, 69, 232, .18),
             transparent 28%),

         radial-gradient(circle at 25% 35%,
             rgba(36, 93, 232, .12),
             transparent 30%),

         linear-gradient(135deg,
             #0b1238 0%,
             #10194a 48%,
             #0d143d 100%);

     color: #ffffff;

 }


 /* =========================================================
               BACKGROUND GRID
            ========================================================= */

 .mf-footer-grid {

     position: absolute;

     inset: 0;

     z-index: 0;

     pointer-events: none;

     opacity: .35;

     background-image:

         linear-gradient(rgba(255, 255, 255, .025) 1px,
             transparent 1px),

         linear-gradient(90deg,
             rgba(255, 255, 255, .025) 1px,
             transparent 1px);

     background-size: 72px 72px;

 }


 /* =========================================================
               BACKGROUND GLOW
            ========================================================= */

 .mf-footer-glow {

     position: absolute;

     z-index: 0;

     border-radius: 50%;

     pointer-events: none;

     filter: blur(50px);

 }


 .mf-footer-glow-one {

     width: 600px;

     height: 600px;

     right: -250px;

     top: -300px;

     background:
         radial-gradient(circle,
             rgba(112, 69, 232, .22),
             rgba(57, 72, 208, .08) 45%,
             transparent 70%);

     animation:
         mfFooterGlowOne 9s ease-in-out infinite alternate;

 }


 .mf-footer-glow-two {

     width: 450px;

     height: 450px;

     left: -260px;

     bottom: -220px;

     background:
         radial-gradient(circle,
             rgba(36, 93, 232, .15),
             transparent 70%);

     animation:
         mfFooterGlowTwo 11s ease-in-out infinite alternate;

 }


 @keyframes mfFooterGlowOne {

     0% {

         transform:
             scale(.88) translate3d(0, 0, 0);

         opacity: .55;

     }

     100% {

         transform:
             scale(1.12) translate3d(-20px, 20px, 0);

         opacity: 1;

     }

 }


 @keyframes mfFooterGlowTwo {

     0% {

         transform:
             scale(.9) translate3d(0, 0, 0);

         opacity: .45;

     }

     100% {

         transform:
             scale(1.1) translate3d(25px, -20px, 0);

         opacity: .8;

     }

 }


 /* =========================================================
               CONTAINER
            ========================================================= */

 .mf-footer>.container {

     position: relative;

     z-index: 2;

 }


 /* =========================================================
               TOP CTA
            ========================================================= */

 .mf-footer-cta {

     position: relative;

     padding-bottom: 105px;

     border-bottom:
         1px solid rgba(255, 255, 255, .09);

 }


 /* =========================================================
               CTA LABEL
            ========================================================= */

 .mf-footer-cta-label {

     display: flex;

     align-items: center;

     gap: 14px;

     margin-bottom: 28px;

     color:
         #79a1ff;

     font-size: 9px;

     font-weight: 800;

     letter-spacing: 3.5px;

     text-transform: uppercase;

 }


 .mf-footer-line {

     width: 46px;

     height: 1px;

     background:
         linear-gradient(90deg,
             transparent,
             #245DE8);

 }


 .mf-footer-line-right {

     background:
         linear-gradient(90deg,
             #7045E8,
             transparent);

 }


 /* =========================================================
               CTA TITLE
            ========================================================= */

 .mf-footer-cta-title {

     max-width: 900px;

     margin: 0;

     color:
         #ffffff !important;

     font-size:
         clamp(58px, 8vw, 112px);

     line-height: .88;

     font-weight: 800;

     letter-spacing: -6px;

 }


 .mf-footer-cta-title span {

     display: inline-block;

     background:
         linear-gradient(90deg,
             #245DE8 0%,
             #3948D0 48%,
             #7045E8 100%);

     -webkit-background-clip: text;

     background-clip: text;

     -webkit-text-fill-color: transparent;

     color: transparent;

 }


 /* =========================================================
               CTA DESCRIPTION
            ========================================================= */

 .mf-footer-cta-text {

     max-width: 590px;

     margin: 32px 0 30px;

     color:
         rgba(255, 255, 255, .56);

     font-size: 14px;

     line-height: 1.8;

 }


 /* =========================================================
               CTA BUTTON
            ========================================================= */

 .mf-footer-cta-button {

     display: inline-flex;

     align-items: center;

     gap: 18px;

     min-height: 62px;

     padding: 7px 8px 7px 25px;

     color:
         #ffffff !important;

     text-decoration: none !important;

     border-radius: 60px;

     background:
         linear-gradient(110deg,
             #245DE8 0%,
             #3948D0 55%,
             #7045E8 100%);

     font-size: 12px;

     font-weight: 800;

     box-shadow:
         0 15px 40px rgba(36, 93, 232, .25);

     transition:
         transform .35s ease,
         box-shadow .35s ease;

 }


 .mf-footer-cta-button i {

     display: flex;

     align-items: center;

     justify-content: center;

     width: 48px;

     height: 48px;

     border-radius: 50%;

     color: #ffffff;

     background:
         rgba(255, 255, 255, .14);

     border:
         1px solid rgba(255, 255, 255, .18);

     font-style: normal;

     font-size: 18px;

     transition:
         transform .35s ease,
         background .35s ease;

 }


 .mf-footer-cta-button:hover {

     color:
         #ffffff !important;

     transform:
         translateY(-4px);

     box-shadow:
         0 22px 55px rgba(112, 69, 232, .30);

 }


 .mf-footer-cta-button:hover i {

     transform:
         rotate(45deg);

     background:
         rgba(255, 255, 255, .25);

 }


 /* =========================================================
               FOOTER CONTENT
            ========================================================= */

 .mf-footer-content {

     display: grid;

     grid-template-columns:
         2fr 1fr 1.2fr 1.55fr;

     gap: 55px;

     padding:
         75px 0;

     border-bottom:
         1px solid rgba(255, 255, 255, .08);

 }


 /* =========================================================
               BRAND
            ========================================================= */

 .mf-footer-brand {

     min-width: 0;

 }


 /* =========================================================
               LOGO
            ========================================================= */

 .mf-footer-logo {

     display: inline-flex;

     align-items: center;

     margin-bottom: 22px;

     text-decoration: none;

 }


 .mf-footer-logo-img {

     display: block;

     width: 150px;

     height: auto;

     max-width: 100%;

     object-fit: contain;

 }


 /* =========================================================
               DESCRIPTION
            ========================================================= */

 .mf-footer-description {

     max-width: 340px;

     margin: 0 0 25px;

     color:
         rgba(255, 255, 255, .48);

     font-size: 12px;

     line-height: 1.85;

 }


 /* =========================================================
               STATUS
            ========================================================= */

 .mf-footer-status {

     display: flex;

     align-items: center;

     gap: 9px;

     color:
         rgba(255, 255, 255, .34);

     font-size: 8px;

     font-weight: 800;

     letter-spacing: 1.8px;

 }


 .mf-footer-status-dot {

     display: block;

     width: 7px;

     height: 7px;

     flex-shrink: 0;

     border-radius: 50%;

     background:
         #245DE8;

     box-shadow:
         0 0 14px rgba(36, 93, 232, .9);

     animation:
         mfFooterStatus 2s ease-in-out infinite;

 }


 @keyframes mfFooterStatus {

     0%,
     100% {

         opacity: 1;

         transform: scale(1);

     }

     50% {

         opacity: .35;

         transform: scale(.7);

     }

 }


 /* =========================================================
               SOCIAL
            ========================================================= */

 .mf-footer-socials {

     display: flex;

     align-items: center;

     gap: 8px;

     margin-top: 25px;

 }


 .mf-social-link {

     display: flex;

     align-items: center;

     justify-content: center;

     width: 34px;

     height: 34px;

     border:
         1px solid rgba(255, 255, 255, .12);

     border-radius: 50%;

     color:
         rgba(255, 255, 255, .58);

     background:
         rgba(255, 255, 255, .025);

     text-decoration: none;

     font-size: 9px;

     font-weight: 800;

     transition:
         all .3s ease;

 }


 .mf-social-link:hover {

     color: #ffffff;

     border-color:
         rgba(36, 93, 232, .75);

     background:
         linear-gradient(135deg,
             rgba(36, 93, 232, .30),
             rgba(112, 69, 232, .30));

     transform:
         translateY(-4px);

     box-shadow:
         0 8px 20px rgba(36, 93, 232, .18);

 }


 /* =========================================================
               COLUMN
            ========================================================= */

 .mf-footer-column {

     min-width: 0;

 }


 .mf-footer-column-title {

     margin:
         4px 0 25px;

     color:
         #ffffff !important;

     font-size:
         10px;

     font-weight:
         800;

     letter-spacing:
         1.7px;

     text-transform:
         uppercase;

 }


 /* =========================================================
               LINKS
            ========================================================= */

 .mf-footer-links {

     margin: 0;

     padding: 0;

     list-style: none;

 }


 .mf-footer-links li {

     margin-bottom:
         13px;

 }


 .mf-footer-links li a {

     position: relative;

     display: inline-block;

     color:
         rgba(255, 255, 255, .48);

     text-decoration: none;

     font-size: 12px;

     line-height: 1.5;

     transition:
         color .3s ease,
         transform .3s ease;

 }


 .mf-footer-links li a::before {

     content: "";

     position: absolute;

     left: 0;

     bottom: -4px;

     width: 0;

     height: 1px;

     background:
         linear-gradient(90deg,
             #245DE8,
             #7045E8);

     transition:
         width .3s ease;

 }


 .mf-footer-links li a:hover {

     color:
         #ffffff;

     transform:
         translateX(4px);

 }


 .mf-footer-links li a:hover::before {

     width:
         100%;

 }


 /* =========================================================
               CONTACT
            ========================================================= */

 .mf-footer-contact {

     min-width:
         0;

 }


 /* =========================================================
               CONTACT ITEM
            ========================================================= */

 .mf-footer-contact-item {

     display: flex;

     align-items: flex-start;

     gap: 12px;

     margin-bottom: 19px;

 }


 .mf-contact-icon {

     display: flex;

     align-items: center;

     justify-content: center;

     width: 32px;

     height: 32px;

     flex-shrink: 0;

     color:
         #6f9cff;

     border:
         1px solid rgba(111, 156, 255, .16);

     border-radius: 9px;

     background:
         rgba(36, 93, 232, .07);

     transition:
         all .3s ease;

 }


 .mf-contact-icon svg {

     width: 16px;

     height: 16px;

 }


 .mf-footer-contact-item:hover .mf-contact-icon {

     color:
         #ffffff;

     border-color:
         rgba(112, 69, 232, .55);

     background:
         linear-gradient(135deg,
             rgba(36, 93, 232, .30),
             rgba(112, 69, 232, .30));

     transform:
         translateY(-2px);

 }


 /* =========================================================
               CONTACT CONTENT
            ========================================================= */

 .mf-contact-content {

     min-width:
         0;

 }


 .mf-contact-label {

     display:
         block;

     margin-bottom:
         4px;

     color:
         rgba(255, 255, 255, .28);

     font-size:
         7px;

     font-weight:
         800;

     letter-spacing:
         1.8px;

 }


 .mf-contact-content address {

     margin:
         0;

     color:
         rgba(255, 255, 255, .58);

     font-size:
         11px;

     font-style:
         normal;

     line-height:
         1.65;

 }


 .mf-contact-content a {

     display:
         inline-block;

     color:
         rgba(255, 255, 255, .62);

     text-decoration:
         none;

     font-size:
         11px;

     line-height:
         1.5;

     transition:
         color .3s ease;

 }


 .mf-contact-content a:hover {

     color:
         #79a1ff;

 }


 /* =========================================================
               BOTTOM
            ========================================================= */

 .mf-footer-bottom {

     display: flex;

     align-items: center;

     justify-content: space-between;

     gap: 25px;

     min-height:
         78px;

     color:
         rgba(255, 255, 255, .30);

     font-size:
         8px;

 }


 /* =========================================================
               COPYRIGHT
            ========================================================= */

 .mf-footer-copyright {

     white-space:
         nowrap;

 }


 /* =========================================================
               LEGAL
            ========================================================= */

 .mf-footer-legal {

     display:
         flex;

     align-items:
         center;

     gap:
         25px;

 }


 .mf-footer-legal a {

     color:
         rgba(255, 255, 255, .34);

     text-decoration:
         none;

     transition:
         color .3s ease;

 }


 .mf-footer-legal a:hover {

     color:
         #ffffff;

 }


 /* =========================================================
               TAGLINE
            ========================================================= */

 .mf-footer-tagline {

     color:
         rgba(255, 255, 255, .25);

     font-size:
         7px;

     font-weight:
         800;

     letter-spacing:
         1.5px;

     white-space:
         nowrap;

 }


 /* =========================================================
               TABLET
            ========================================================= */

 @media (max-width: 1199px) {

     .mf-footer-content {

         grid-template-columns:
             1.7fr 1fr 1.2fr 1.4fr;

         gap:
             35px;

     }

 }


 /* =========================================================
               TABLET / SMALL LAPTOP
            ========================================================= */

 @media (max-width: 991px) {

     .mf-footer {

         padding-top:
             90px;

     }


     .mf-footer-content {

         grid-template-columns:
             1.5fr 1fr 1fr;

         gap:
             45px;

     }


     .mf-footer-brand {

         grid-column:
             span 3;

         margin-bottom:
             15px;

     }


     .mf-footer-cta-title {

         font-size:
             clamp(55px, 9vw, 85px);

     }


     .mf-footer-bottom {

         flex-wrap:
             wrap;

         padding:
             18px 0;

     }

 }


 /* =========================================================
               MOBILE
            ========================================================= */

 @media (max-width: 767px) {

     .mf-footer {

         padding-top:
             75px;

     }


     .mf-footer-cta {

         padding-bottom:
             70px;

     }


     .mf-footer-cta-label {

         font-size:
             8px;

         letter-spacing:
             2.5px;

     }


     .mf-footer-cta-title {

         font-size:
             55px;

         line-height:
             .92;

         letter-spacing:
             -3px;

     }


     .mf-footer-cta-text {

         max-width:
             100%;

         margin:
             25px 0;

         font-size:
             13px;

     }


     .mf-footer-content {

         grid-template-columns:
             1fr 1fr;

         gap:
             45px 25px;

         padding:
             60px 0;

     }


     .mf-footer-brand {

         grid-column:
             span 2;

     }


     .mf-footer-logo-img {

         width:
             135px;

     }


     .mf-footer-contact {

         grid-column:
             span 2;

     }


     .mf-footer-bottom {

         display:
             flex;

         flex-direction:
             column;

         align-items:
             flex-start;

         justify-content:
             center;

         gap:
             14px;

         min-height:
             auto;

         padding:
             25px 0;

     }


     .mf-footer-copyright {

         white-space:
             normal;

     }


     .mf-footer-legal {

         gap:
             18px;

     }


     .mf-footer-tagline {

         white-space:
             normal;

         line-height:
             1.6;

     }


     .mf-footer-glow-one {

         width:
             400px;

         height:
             400px;

         right:
             -220px;

         top:
             -150px;

     }


     .mf-footer-glow-two {

         width:
             300px;

         height:
             300px;

         left:
             -180px;

         bottom:
             -100px;

     }

 }


 /* =========================================================
               SMALL MOBILE
            ========================================================= */

 @media (max-width: 480px) {

     .mf-footer-cta-title {

         font-size:
             46px;

         letter-spacing:
             -2.5px;

     }


     .mf-footer-content {

         grid-template-columns:
             1fr;

     }


     .mf-footer-brand {

         grid-column:
             auto;

     }


     .mf-footer-contact {

         grid-column:
             auto;

     }


     .mf-footer-cta-button {

         width:
             100%;

         justify-content:
             space-between;

         padding-left:
             20px;

     }


     .mf-footer-cta-button i {

         width:
             45px;

         height:
             45px;

     }

 }