/* =========================================================
   GLOBAL
========================================================= */

:root {
    --mp-gold: #e89a0b;
    --mp-gold-dark: #cf8200;
    --mp-blue: #063b91;
    --mp-dark: #080d16;
    --mp-text: #111a35;
    --mp-light: #f7f8fa;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Inter", sans-serif;
    color: var(--mp-text);
    overflow-x: hidden;
}

a {
    text-decoration: none;
}


/* =========================================================
   TOP BAR
========================================================= */

.topbar {
    height: 58px;
    background: #080d16;
    color: #fff;
    position: relative;
    z-index: 1000;
}

.topbar-container {
    height: 100%;
    display: flex;
    align-items: center;
}

.topbar-left {
    height: 100%;
    display: flex;
    align-items: center;
    padding-left: 6%;
    flex: 1;
    font-size: 14px;
}

.topbar-left a {
    color: var(--mp-gold);
    font-weight: 700;
    margin-left: 4px;
}

.topbar-icon {
    color: var(--mp-gold);
    font-size: 20px;
    margin-right: 10px;
}

.topbar-address {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 35px;
    font-size: 14px;
}

.topbar-address i {
    color: var(--mp-gold);
    font-size: 20px;
}

.topbar-email {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--mp-gold);
    padding: 0 5%;
    min-width: 27%;
    font-size: 14px;
}

.topbar-email i {
    font-size: 20px;
}


/* =========================================================
   MAIN HEADER
========================================================= */

.main-header {
      background: #fff;
    position: relative;
    z-index: 999;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.06);
}

.navbar {
    /* min-height: 146px; */
    padding: 0 3%;
}

.logo-box {
    display: flex;
    align-items: center;
}

.main-logo {
    width: 120px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.navbar-nav {
    gap: 4px;
}

.nav-link {
    color: #101831 !important;
    font-size: 15px;
    font-weight: 600;
    padding: 15px 15px !important;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.nav-link:hover,
.nav-link.active {
    color: var(--mp-gold) !important;
}

.apply-nav-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(
        135deg,
        #eda614,
        #d98b00
    );
    color: #fff;
    padding: 16px 25px;
    border-radius: 4px;
    font-weight: 600;
    font-size: 15px;
    transition: all 0.3s ease;
    box-shadow: 0 8px 20px rgba(226, 147, 7, 0.18);
}

.apply-nav-btn:hover {
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(226, 147, 7, 0.3);
}

.apply-nav-btn i {
    font-size: 18px;
}


/* =========================================================
   HERO
========================================================= */

.hero-section {
    min-height: 760px;
    position: relative;
    background-image: url("../images/herp.webp");
    background-size: cover;
    background-position: center center;
    display: flex;
    align-items: center;
    overflow: visible;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(5, 9, 15, 0.91) 0%,
            rgba(5, 9, 15, 0.72) 43%,
            rgba(5, 9, 15, 0.55) 100%
        );
}

.hero-container {
    position: relative;
    z-index: 2;
    padding-top: 20px;
    padding-bottom: 180px;
}

.hero-content {
    max-width: 900px;
    padding-left: 4%;
}


/* =========================================================
   HERO TITLE
========================================================= */

.hero-small-title {
    color: var(--mp-gold);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.hero-small-title span {
    width: 85px;
    height: 3px;
    background: var(--mp-gold);
    display: inline-block;
}

.hero-content h1 {
    color: #fff;
    font-size: clamp(45px, 5vw, 72px);
    line-height: 1.08;
    font-weight: 700;
    margin-bottom: 25px;
    letter-spacing: -2px;
}

.hero-content h1 strong {
    color: #f0a313;
    font-weight: 800;
}

.hero-description {
    color: rgba(255,255,255,0.9);
    font-size: 18px;
    line-height: 1.8;
    max-width: 720px;
    margin-bottom: 35px;
}


/* =========================================================
   HERO FEATURES
========================================================= */

.hero-features {
    display: flex;
    align-items: center;
    gap: 50px;
    margin-bottom: 40px;
}

.hero-feature {
    display: flex;
    align-items: center;
    gap: 14px;
    color: #fff;
}

.feature-icon {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    border: 1px solid rgba(255, 174, 22, 0.35);
    background: rgba(255,255,255,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f3a313;
    font-size: 27px;
}

.hero-feature strong,
.hero-feature span {
    display: block;
    font-size: 15px;
    line-height: 1.5;
}

.hero-feature strong {
    font-weight: 700;
}

.hero-feature span {
    color: #fff;
}


/* =========================================================
   HERO BUTTONS
========================================================= */

.hero-buttons {
    display: flex;
    align-items: center;
    gap: 18px;
}

.hero-btn {
    min-height: 62px;
    padding: 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    border-radius: 5px;
    font-size: 16px;
    font-weight: 700;
    transition: all 0.3s ease;
}

.primary-btn {
    background: linear-gradient(
        135deg,
        #f2a612,
        #d98900
    );
    color: #fff;
    box-shadow: 0 10px 30px rgba(225, 146, 8, 0.25);
}

.primary-btn:hover {
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 15px 35px rgba(225, 146, 8, 0.4);
}

.primary-btn i {
    font-size: 19px;
}

.secondary-btn {
    border: 1px solid rgba(255,255,255,0.8);
    color: #fff;
    background: rgba(255,255,255,0.03);
}

.secondary-btn:hover {
    background: #fff;
    color: #111a35;
}

.play-icon {
    width: 28px;
    height: 28px;
    background: #fff;
    color: #111a35;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.play-icon i {
    margin-left: 2px;
}


/* =========================================================
   STATS CARD
========================================================= */

.stats-container {
    position: absolute;
    z-index: 10;
    bottom: -40px;
    left: 50%;
    transform: translateX(-50%);
}

.stats-card {
    background: #fff;
    border-radius: 18px;
    min-height: 135px;
    padding: 20px 35px;
    box-shadow: 0 15px 50px rgba(0,0,0,0.16);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.stat-item {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 17px;
}

.stat-icon {
    width: 58px;
    height: 58px;
    color: #e99a0b;
    font-size: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-content h3 {
    margin: 0 0 5px;
    color: #111a35;
    font-size: 24px;
    font-weight: 800;
}

.stat-content p {
    margin: 0;
    color: #555b68;
    font-size: 14px;
    font-weight: 500;
}

.stat-divider {
    width: 1px;
    height: 55px;
    background: #e1e3e7;
}


/* =========================================================
   INTRO
========================================================= */

.intro-section {
    padding: 130px 0 90px;
    background: #fff;
}

.section-label {
    color: var(--mp-gold);
    font-weight: 700;
    letter-spacing: 2px;
    font-size: 14px;
}

.intro-section h2 {
    margin-top: 15px;
    font-size: 42px;
    font-weight: 800;
    color: #111a35;
}

.intro-section h2 span {
    color: var(--mp-gold);
}

.intro-section p {
    margin-top: 15px;
    color: #6b7280;
    font-size: 16px;
    line-height: 1.8;
}


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

@media (max-width: 1399px) {

    .main-logo {
        width: 120px;
    }

    .nav-link {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }

    .navbar-nav {
        gap: 0;
    }

    .topbar-left {
        padding-left: 3%;
    }

    .topbar-address {
        padding: 0 15px;
    }

}


@media (max-width: 1199px) {

    .topbar {
        height: auto;
    }

    .topbar-container {
        flex-wrap: wrap;
        min-height: 55px;
    }

    .topbar-left {
        padding: 10px 20px;
        flex: 1;
    }

    .topbar-address {
        display: none;
    }

    .topbar-email {
        min-width: auto;
        padding: 10px 25px;
    }

    .main-header,
    .navbar {
        min-height: 100px;
        height: auto;
    }

    .main-logo {
        width: 120px;
    }

    .navbar-collapse {
        background: #fff;
        padding: 20px;
        margin-top: 10px;
        box-shadow: 0 15px 30px rgba(0,0,0,0.08);
    }

    .navbar-nav {
        align-items: stretch !important;
    }

    .nav-link {
        padding: 12px !important;
    }

    .apply-nav-btn {
        margin-top: 10px;
        display: flex;
        justify-content: center;
    }

    .hero-section {
        min-height: 720px;
    }

    .stats-container {
        width: 95%;
    }

}


@media (max-width: 991px) {

    .hero-section {
        min-height: 850px;
    }

    .hero-container {
        padding-top: 50px;
        padding-bottom: 220px;
    }

    .hero-content {
        padding-left: 0;
    }

    .hero-content h1 {
        font-size: 52px;
    }

    .hero-features {
        gap: 25px;
        flex-wrap: wrap;
    }

    .stats-card {
        padding: 25px 15px;
    }

    .stat-item {
        flex-direction: column;
        gap: 4px;
        text-align: center;
    }

    .stat-icon {
        font-size: 32px;
        height: 40px;
    }

    .stat-content h3 {
        font-size: 20px;
    }

}


@media (max-width: 767px) {

    .topbar-left {
        width: 100%;
        justify-content: center;
        font-size: 14px;
    }

    .topbar-email {
        width: 100%;
        justify-content: center;
        font-size: 14px;
    }

    .main-logo {
        width: 190px;
    }

    .hero-section {
        min-height: 930px;
        background-position: 60% center;
    }

    .hero-container {
        padding-top: 55px;
        padding-bottom: 300px;
    }

    .hero-small-title {
        font-size: 15px;
    }

    .hero-small-title span {
        width: 45px;
    }

    .hero-content h1 {
        font-size: 40px;
        letter-spacing: -1px;
    }

    .hero-description {
        font-size: 15px;
        line-height: 1.7;
    }

    .hero-features {
        gap: 18px;
        display: grid;
        grid-template-columns: 1fr;
    }

    .hero-feature {
        gap: 12px;
    }

    .feature-icon {
        width: 48px;
        height: 48px;
        font-size: 22px;
    }

    .hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .hero-btn {
        width: 100%;
    }

    .stats-container {
        bottom: -160px;
        width: 92%;
    }

    .stats-card {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 25px 10px;
        padding: 25px 15px;
    }

    .stat-divider {
        display: none;
    }

    .intro-section {
        padding-top: 220px;
    }

    .intro-section h2 {
        font-size: 32px;
    }

}


@media (max-width: 480px) {

    .main-logo {
        width: 120px;
    }

    .hero-content h1 {
        font-size: 34px;
    }

    .hero-section {
        min-height: 950px;
    }

    .stats-card {
        grid-template-columns: 1fr;
    }

    .stat-item {
        flex-direction: row;
        justify-content: flex-start;
        text-align: left;
        padding-left: 20px;
    }

}
/* =========================================================
   MAX PRIME PAISA
   PREMIUM ABOUT US SECTION
========================================================= */

.mpp-about-section {
    position: relative;
    padding: 120px 0 100px;
    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(232, 154, 11, 0.08),
            transparent 32%
        ),
        radial-gradient(
            circle at 100% 20%,
            rgba(6, 59, 145, 0.06),
            transparent 30%
        ),
        #ffffff;
    overflow: hidden;
}


/* Background Decorative Glow */

.mpp-about-glow {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(2px);
}

.mpp-glow-one {
    width: 300px;
    height: 300px;
    left: -180px;
    top: 180px;
    background: rgba(232, 154, 11, 0.07);
}

.mpp-glow-two {
    width: 350px;
    height: 350px;
    right: -200px;
    bottom: 50px;
    background: rgba(6, 59, 145, 0.06);
}


/* =========================================================
   VISUAL AREA
========================================================= */

.mpp-about-visual {
    position: relative;
    min-height: 610px;
    width: 100%;
}


/* Main Image */

.mpp-about-image-wrap {
    position: absolute;
    top: 20px;
    left: 35px;
    width: calc(100% - 75px);
    height: 540px;
    border-radius: 25px;
    overflow: hidden;
    z-index: 2;
    box-shadow:
        0 25px 70px rgba(9, 24, 50, 0.18);
}

.mpp-about-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.mpp-about-image-wrap:hover .mpp-about-image {
    transform: scale(1.05);
}


/* Image Overlay */

.mpp-image-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(3, 15, 35, 0.02),
            rgba(3, 15, 35, 0.30)
        );
}


/* =========================================================
   GOLD DECORATIVE SHAPE
========================================================= */

.mpp-gold-shape {
    position: absolute;
    width: 260px;
    height: 260px;
    background: linear-gradient(
        135deg,
        #f5b62b,
        #d98900
    );
    border-radius: 35px;
    left: 0;
    bottom: 5px;
    transform: rotate(-12deg);
    z-index: 1;
    opacity: 0.9;
}


/* =========================================================
   CIRCLE DECORATION
========================================================= */

.mpp-circle-decoration {
    position: absolute;
    right: -10px;
    top: -10px;
    width: 130px;
    height: 130px;
    z-index: 3;
    border-radius: 50%;
    border: 2px dashed rgba(232, 154, 11, 0.5);
}

.mpp-circle-decoration span {
    position: absolute;
    width: 8px;
    height: 8px;
    background: var(--mp-gold);
    border-radius: 50%;
}

.mpp-circle-decoration span:nth-child(1) {
    top: 15px;
    left: 25px;
}

.mpp-circle-decoration span:nth-child(2) {
    right: 10px;
    top: 55px;
}

.mpp-circle-decoration span:nth-child(3) {
    bottom: 15px;
    left: 50px;
}


/* =========================================================
   EXPERIENCE CARD
========================================================= */

.mpp-experience-card {
    position: absolute;
    z-index: 5;
    top: 65px;
    left: -15px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 24px;
    background: #fff;
    border-radius: 14px;
    box-shadow:
        0 18px 45px rgba(13, 29, 55, 0.16);
}

.mpp-experience-icon {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(232, 154, 11, 0.12);
    color: var(--mp-gold);
    font-size: 24px;
}

.mpp-experience-card strong {
    display: block;
    font-size: 16px;
    color: var(--mp-text);
}

.mpp-experience-card span {
    display: block;
    margin-top: 3px;
    color: #737985;
    font-size: 14px;
}


/* =========================================================
   FLOATING LOAN CARD
========================================================= */

.mpp-loan-floating-card {
    position: absolute;
    z-index: 6;
    right: -10px;
    bottom: 75px;
    width: 235px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 17px;
    background: rgba(255,255,255,0.96);
    border: 1px solid rgba(255,255,255,0.8);
    border-radius: 15px;
    box-shadow:
        0 18px 45px rgba(7, 26, 55, 0.20);
    backdrop-filter: blur(12px);
}

.mpp-floating-icon {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #0b428f;
    color: #fff;
    font-size: 21px;
}

.mpp-loan-floating-card small {
    display: block;
    color: #7a7f88;
    font-size: 15px;
    margin-bottom: 2px;
}

.mpp-loan-floating-card strong {
    display: block;
    color: var(--mp-text);
    font-size: 18px;
}

.mpp-success-icon {
    margin-left: auto;
    width: 27px;
    height: 27px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    background: #20a05a;
    font-size: 14px;
}


/* =========================================================
   RIGHT CONTENT
========================================================= */

.mpp-about-content {
    position: relative;
    z-index: 2;
    padding-left: 25px;
}


/* Section Tag */

.mpp-section-tag {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--mp-gold);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 2px;
    margin-bottom: 18px;
}

.mpp-tag-line {
    width: 45px;
    height: 3px;
    background: var(--mp-gold);
}


/* Heading */

.mpp-about-content h2 {
    margin: 0;
    max-width: 650px;
    font-size: clamp(40px, 4vw, 58px);
    line-height: 1.08;
    letter-spacing: -2px;
    font-weight: 800;
    color: #111a35;
}

.mpp-about-content h2 span {
    color: var(--mp-gold);
    display: block;
}


/* Paragraph */

.mpp-about-intro {
    margin-top: 25px;
    margin-bottom: 10px;
    color: #20283b;
    font-size: 18px;
    line-height: 1.7;
    font-weight: 500;
}

.mpp-about-intro strong {
    color: var(--mp-blue);
}

.mpp-about-text {
    color: #697080;
    font-size: 15px;
    line-height: 1.8;
    max-width: 650px;
}


/* =========================================================
   FEATURE GRID
========================================================= */

.mpp-about-features {
    margin-top: 30px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.mpp-about-feature {
    display: flex;
    gap: 14px;
    padding: 18px;
    border: 1px solid #edf0f4;
    border-radius: 12px;
    background: rgba(255,255,255,0.75);
    transition: all 0.35s ease;
}

.mpp-about-feature:hover {
    transform: translateY(-5px);
    border-color: rgba(232, 154, 11, 0.3);
    box-shadow:
        0 15px 35px rgba(18, 36, 64, 0.08);
}

.mpp-feature-number {
    flex-shrink: 0;
    width: 39px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #fdf2dc;
    color: var(--mp-gold-dark);
    font-size: 14px;
    font-weight: 800;
}

.mpp-about-feature h4 {
    margin: 1px 0 5px;
    color: #111a35;
    font-size: 15px;
    font-weight: 800;
}

.mpp-about-feature p {
    margin: 0;
    color: #7a808c;
    font-size: 14px;
    line-height: 1.6;
}


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

.mpp-about-bottom {
    margin-top: 32px;
    display: flex;
    align-items: center;
    gap: 30px;
}

.mpp-about-btn {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    padding: 15px 24px;
    border-radius: 6px;
    background: #111a35;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    transition: all 0.3s ease;
}

.mpp-about-btn:hover {
    background: var(--mp-gold);
    color: #fff;
    transform: translateY(-3px);
}

.mpp-about-btn i {
    font-size: 17px;
}


/* Mini Trust */

.mpp-trust-mini {
    display: flex;
    align-items: center;
    gap: 12px;
}

.mpp-trust-avatars {
    display: flex;
}

.mpp-trust-avatars span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #e8eef8;
    color: #17488b;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    margin-left: -7px;
}

.mpp-trust-avatars span:first-child {
    margin-left: 0;
}

.mpp-trust-mini strong {
    display: block;
    color: #111a35;
    font-size: 14px;
}

.mpp-trust-mini small {
    display: block;
    color: #8a8f98;
    font-size: 15px;
    margin-top: 2px;
}


/* =========================================================
   TRUST STRIP
========================================================= */

.mpp-about-trust-strip {
    margin-top: 90px;
    padding: 25px 20px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-radius: 18px;
    background: #fff;
    border: 1px solid #edf0f5;
    box-shadow:
        0 20px 55px rgba(17, 33, 57, 0.08);
}

.mpp-trust-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border-right: 1px solid #e8ebef;
}

.mpp-trust-item:last-child {
    border-right: 0;
}

.mpp-trust-icon {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(232,154,11,0.1);
    color: var(--mp-gold);
    font-size: 22px;
}

.mpp-trust-item strong {
    display: block;
    color: #111a35;
    font-size: 14px;
    font-weight: 800;
}

.mpp-trust-item span {
    display: block;
    color: #818793;
    font-size: 15px;
    margin-top: 4px;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {

    .mpp-about-section {
        padding: 90px 0;
    }

    .mpp-about-content {
        padding-left: 0;
    }

    .mpp-about-visual {
        min-height: 550px;
    }

    .mpp-about-image-wrap {
        height: 500px;
    }

}


@media (max-width: 991px) {

    .mpp-about-section {
        padding: 80px 0;
    }

    .mpp-about-visual {
        max-width: 650px;
        margin: 0 auto 40px;
    }

    .mpp-about-content {
        max-width: 700px;
        margin: auto;
    }

    .mpp-about-trust-strip {
        grid-template-columns: 1fr 1fr;
        gap: 25px 10px;
    }

    .mpp-trust-item:nth-child(2) {
        border-right: 0;
    }

}


@media (max-width: 767px) {

    .mpp-about-section {
        padding: 70px 0;
    }

    .mpp-about-visual {
        min-height: 460px;
    }

    .mpp-about-image-wrap {
        left: 20px;
        width: calc(100% - 40px);
        height: 410px;
        border-radius: 18px;
    }

    .mpp-experience-card {
        left: 0;
        top: 35px;
        padding: 12px 15px;
    }

    .mpp-experience-icon {
        width: 42px;
        height: 42px;
    }

    .mpp-loan-floating-card {
        right: 0;
        bottom: 30px;
    }

    .mpp-gold-shape {
        width: 160px;
        height: 160px;
    }

    .mpp-circle-decoration {
        width: 90px;
        height: 90px;
        right: 0;
    }

    .mpp-about-content h2 {
        font-size: 39px;
        letter-spacing: -1px;
    }

    .mpp-about-features {
        grid-template-columns: 1fr;
    }

    .mpp-about-bottom {
        align-items: flex-start;
        flex-direction: column;
    }

    .mpp-about-trust-strip {
        grid-template-columns: 1fr;
        margin-top: 60px;
    }

    .mpp-trust-item {
        justify-content: flex-start;
        border-right: 0;
        border-bottom: 1px solid #e8ebef;
        padding: 12px;
    }

    .mpp-trust-item:last-child {
        border-bottom: 0;
    }

}


@media (max-width: 480px) {

    .mpp-about-visual {
        min-height: 410px;
    }

    .mpp-about-image-wrap {
        height: 360px;
    }

    .mpp-experience-card {
        transform: scale(0.88);
        transform-origin: left top;
    }

    .mpp-loan-floating-card {
        transform: scale(0.88);
        transform-origin: right bottom;
    }

    .mpp-about-content h2 {
        font-size: 34px;
    }

    .mpp-about-intro {
        font-size: 16px;
    }

    .mpp-about-text {
        font-size: 14px;
    }

}
/* =========================================================
   MAX PRIME PAISA
   HOW IT WORKS SECTION
========================================================= */

.mpp-how-section {
    position: relative;
    padding: 115px 0 105px;
    background: #f7f9fc;
    overflow: hidden;
}


/* =========================================================
   BACKGROUND DECORATION
========================================================= */

.mpp-how-bg-circle {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.circle-left {
    width: 420px;
    height: 420px;
    left: -250px;
    top: 100px;
    border: 70px solid rgba(232, 154, 11, 0.045);
}

.circle-right {
    width: 500px;
    height: 500px;
    right: -330px;
    bottom: -180px;
    border: 80px solid rgba(6, 59, 145, 0.035);
}


/* =========================================================
   HEADING
========================================================= */

.mpp-how-heading {
    position: relative;
    z-index: 2;
    max-width: 760px;
    margin: 0 auto;
}

.mpp-how-heading .mpp-section-tag {
    margin-bottom: 18px;
}

.mpp-how-heading h2 {
    margin: 0;
    color: #111a35;
    font-size: clamp(40px, 4vw, 56px);
    line-height: 1.1;
    letter-spacing: -2px;
    font-weight: 800;
}

.mpp-how-heading h2 span {
    color: var(--mp-gold);
}

.mpp-how-heading p {
    max-width: 650px;
    margin: 20px auto 0;
    color: #737a88;
    font-size: 15px;
    line-height: 1.8;
}


/* =========================================================
   PROCESS WRAPPER
========================================================= */

.mpp-process-wrapper {
    position: relative;
    z-index: 2;
    margin-top: 75px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}


/* =========================================================
   HORIZONTAL LINE
========================================================= */

.mpp-process-line {
    position: absolute;
    top: 43px;
    left: 9%;
    right: 9%;
    height: 3px;
    background: #dfe4eb;
    z-index: 0;
    overflow: hidden;
}

.mpp-process-progress {
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        #e49a0b,
        #f4b72d,
        #e49a0b
    );
    transform-origin: left;
}


/* =========================================================
   PROCESS STEP
========================================================= */

.mpp-process-step {
    position: relative;
    text-align: center;
    z-index: 2;
}


/* Step Number */

.mpp-step-number {
    position: absolute;
    top: -38px;
    left: 50%;
    transform: translateX(-50%);
    color: #c9ced6;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 1px;
}


/* Step Icon */

.mpp-step-icon {
    width: 88px;
    height: 88px;
    margin: 0 auto;
    position: relative;
    z-index: 3;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #fff;

    border: 7px solid #f7f9fc;

    box-shadow:
        0 0 0 1px #e5e9ef,
        0 15px 35px rgba(15, 34, 62, 0.10);

    color: var(--mp-gold);

    font-size: 31px;

    transition:
        transform 0.35s ease,
        background 0.35s ease,
        color 0.35s ease,
        box-shadow 0.35s ease;
}


/* Hover */

.mpp-process-step:hover .mpp-step-icon {
    transform: translateY(-8px);
    background: linear-gradient(
        135deg,
        #eda615,
        #d88b00
    );
    color: #fff;
    box-shadow:
        0 15px 35px rgba(226, 147, 7, 0.28);
}


/* =========================================================
   STEP CONTENT
========================================================= */

.mpp-step-content {
    margin-top: 27px;
    padding: 0 8px;
}

.mpp-step-label {
    color: var(--mp-gold);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.mpp-step-content h3 {
    margin: 8px 0 10px;
    color: #111a35;
    font-size: 18px;
    font-weight: 800;
}

.mpp-step-content p {
    margin: 0 auto;
    max-width: 205px;
    color: #777e8b;
    font-size: 14px;
    line-height: 1.7;
}


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

.mpp-how-bottom {
    position: relative;
    z-index: 2;

    margin-top: 75px;
    padding: 20px 25px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    background: #fff;

    border: 1px solid #e9edf2;
    border-radius: 15px;

    box-shadow:
        0 18px 50px rgba(14, 32, 57, 0.07);
}


/* Note */

.mpp-how-note {
    display: flex;
    align-items: center;
    gap: 14px;
}

.mpp-how-note-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(232, 154, 11, 0.11);
    color: var(--mp-gold);

    font-size: 21px;
}

.mpp-how-note strong {
    display: block;
    color: #111a35;
    font-size: 14px;
    font-weight: 800;
}

.mpp-how-note span {
    display: block;
    color: #858b96;
    font-size: 15px;
    margin-top: 3px;
}


/* CTA */

.mpp-how-btn {
    display: inline-flex;
    align-items: center;
    gap: 14px;

    padding: 15px 23px;

    color: #fff;
    background: #111a35;

    border-radius: 6px;

    font-size: 14px;
    font-weight: 700;

    transition: all 0.3s ease;
}

.mpp-how-btn:hover {
    color: #fff;
    background: var(--mp-gold);
    transform: translateY(-3px);
}

.mpp-how-btn i {
    font-size: 16px;
}


/* =========================================================
   RESPONSIVE — TABLET
========================================================= */

@media (max-width: 991px) {

    .mpp-how-section {
        padding: 90px 0;
    }

    .mpp-process-wrapper {
        grid-template-columns: repeat(2, 1fr);
        gap: 60px 25px;
    }

    .mpp-process-line {
        display: none;
    }

    .mpp-step-number {
        top: -30px;
    }

    .mpp-how-bottom {
        margin-top: 65px;
    }

}


/* =========================================================
   RESPONSIVE — MOBILE
========================================================= */

@media (max-width: 767px) {

    .mpp-how-section {
        padding: 75px 0;
    }

    .mpp-how-heading h2 {
        font-size: 38px;
        letter-spacing: -1px;
    }

    .mpp-how-heading p {
        font-size: 14px;
    }

    .mpp-process-wrapper {
        display: block;
        margin-top: 60px;
        padding-left: 25px;
    }

    /* Vertical timeline */

    .mpp-process-wrapper::before {
        content: "";
        position: absolute;
        left: 68px;
        top: 20px;
        bottom: 20px;
        width: 3px;
        background: #e2e6ec;
    }

    .mpp-process-step {
        min-height: 150px;
        display: grid;
        grid-template-columns: 85px 1fr;
        text-align: left;
        margin-bottom: 40px;
    }

    .mpp-process-step:last-child {
        margin-bottom: 0;
    }

    .mpp-step-number {
        top: -18px;
        left: 42px;
        transform: none;
        font-size: 14px;
    }

    .mpp-step-icon {
        width: 70px;
        height: 70px;
        margin: 0;
        font-size: 24px;
    }

    .mpp-step-content {
        margin-top: 0;
        padding: 8px 0 0 18px;
    }

    .mpp-step-content h3 {
        font-size: 17px;
        margin-top: 6px;
    }

    .mpp-step-content p {
        margin: 0;
        max-width: 100%;
        font-size: 14px;
    }

    .mpp-how-bottom {
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
        padding: 20px;
    }

    .mpp-how-btn {
        justify-content: center;
    }

}


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

@media (max-width: 480px) {

    .mpp-how-heading h2 {
        font-size: 33px;
    }

    .mpp-process-wrapper {
        padding-left: 5px;
    }

    .mpp-process-wrapper::before {
        left: 48px;
    }

    .mpp-process-step {
        grid-template-columns: 65px 1fr;
    }

    .mpp-step-icon {
        width: 62px;
        height: 62px;
        font-size: 21px;
    }

    .mpp-step-number {
        left: 31px;
    }

}
/* =========================================================
   WHY CHOOSE US
========================================================= */

.mpp-why-section {
    position: relative;
    padding: 120px 0 105px;
    background: #fff;
    overflow: hidden;
}


/* =========================================================
   BACKGROUND PATTERN
========================================================= */

.mpp-why-pattern {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.45;

    background-image:
        radial-gradient(
            rgba(232,154,11,0.12) 1px,
            transparent 1px
        );

    background-size: 28px 28px;

    mask-image: linear-gradient(
        to bottom,
        transparent,
        black 20%,
        black 80%,
        transparent
    );
}


/* =========================================================
   HEADING
========================================================= */

.mpp-why-heading {
    position: relative;
    z-index: 2;
    max-width: 760px;
    margin: 0 auto;
}

.mpp-why-heading h2 {
    margin: 0;
    color: #111a35;
    font-size: clamp(40px, 4vw, 56px);
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -2px;
}

.mpp-why-heading h2 span {
    color: var(--mp-gold);
}

.mpp-why-heading p {
    max-width: 650px;
    margin: 20px auto 0;
    color: #747b88;
    font-size: 15px;
    line-height: 1.8;
}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.mpp-why-layout {
    position: relative;
    z-index: 2;

    margin-top: 80px;

    display: grid;
    grid-template-columns: 1fr 330px 1fr;
    align-items: center;
    gap: 55px;
}


/* =========================================================
   CARD COLUMNS
========================================================= */

.mpp-why-column {
    display: flex;
    flex-direction: column;
    gap: 25px;
}


/* =========================================================
   WHY CARD
========================================================= */

.mpp-why-card {
    position: relative;

    display: flex;
    align-items: flex-start;

    gap: 17px;

    padding: 25px;

    background: rgba(255,255,255,0.92);

    border: 1px solid #edf0f4;

    border-radius: 16px;

    box-shadow:
        0 12px 35px rgba(17,31,54,0.055);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

.mpp-why-card:hover {
    transform: translateY(-6px);

    border-color: rgba(232,154,11,0.3);

    box-shadow:
        0 20px 45px rgba(17,31,54,0.11);
}


/* Icon */

.mpp-why-icon {
    width: 52px;
    height: 52px;

    flex-shrink: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background:
        linear-gradient(
            135deg,
            rgba(232,154,11,0.16),
            rgba(232,154,11,0.06)
        );

    color: var(--mp-gold);

    font-size: 23px;

    transition: all 0.35s ease;
}

.mpp-why-card:hover .mpp-why-icon {
    background: var(--mp-gold);
    color: #fff;
    transform: scale(1.05);
}


/* Number */

.mpp-why-number {
    display: block;

    margin-bottom: 4px;

    color: #b8bec8;

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


/* Title */

.mpp-why-card h3 {
    margin: 0 0 7px;

    color: #111a35;

    font-size: 17px;

    font-weight: 800;
}


/* Description */

.mpp-why-card p {
    margin: 0;

    color: #7c828e;

    font-size: 14px;

    line-height: 1.7;
}


/* =========================================================
   CENTER
========================================================= */

.mpp-why-center {
    position: relative;

    height: 330px;

    display: flex;

    align-items: center;

    justify-content: center;
}


/* Orbit */

.mpp-why-orbit {
    position: absolute;

    border-radius: 50%;

    border: 1px dashed rgba(232,154,11,0.35);

    animation: mppOrbitRotate 18s linear infinite;
}

.orbit-one {
    width: 310px;
    height: 310px;
}

.orbit-two {
    width: 255px;
    height: 255px;

    border-color: rgba(6,59,145,0.18);

    animation-direction: reverse;

    animation-duration: 13s;
}


/* Center Circle */

.mpp-why-center-circle {
    position: relative;

    z-index: 4;

    width: 210px;
    height: 210px;

    border-radius: 50%;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    text-align: center;

    background:
        radial-gradient(
            circle at 35% 25%,
            #fff,
            #f5f7fa
        );

    border: 8px solid #fff;

    box-shadow:
        0 20px 60px rgba(11,32,62,0.15),
        0 0 0 1px #e7ebf0;
}


/* Logo */

.mpp-center-logo {
    width: 105px;

    margin-bottom: 8px;
}

.mpp-center-logo img {
    width: 100%;
    height: auto;
}


/* Shield */

.mpp-center-shield {
    width: 38px;
    height: 38px;

    margin-bottom: 7px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: var(--mp-gold);

    color: #fff;

    font-size: 18px;
}


/* Center Text */

.mpp-why-center-circle strong {
    color: #111a35;

    font-size: 14px;

    font-weight: 800;
}

.mpp-why-center-circle > span {
    margin-top: 3px;

    color: #8a909a;

    font-size: 14px;
}


/* =========================================================
   BOTTOM TRUST STRIP
========================================================= */

.mpp-why-bottom {
    position: relative;

    z-index: 2;

    margin-top: 75px;

    padding: 24px 20px;

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    background: #111a35;

    border-radius: 16px;

    box-shadow:
        0 20px 50px rgba(12,24,47,0.16);
}


.mpp-why-bottom-item {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 13px;

    border-right: 1px solid
        rgba(255,255,255,0.12);
}

.mpp-why-bottom-item:last-child {
    border-right: 0;
}


.mpp-why-bottom-item > i {
    color: var(--mp-gold);

    font-size: 22px;
}


.mpp-why-bottom-item strong {
    display: block;

    color: #fff;

    font-size: 14px;

    font-weight: 700;
}


.mpp-why-bottom-item span {
    display: block;

    margin-top: 3px;

    color: rgba(255,255,255,0.5);

    font-size: 14px;
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes mppOrbitRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


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

@media (max-width: 1100px) {

    .mpp-why-layout {
        grid-template-columns: 1fr 260px 1fr;

        gap: 25px;
    }

    .mpp-why-card {
        padding: 20px;
    }

    .mpp-why-icon {
        width: 45px;
        height: 45px;

        font-size: 20px;
    }

    .mpp-why-center-circle {
        width: 175px;
        height: 175px;
    }

    .orbit-one {
        width: 260px;
        height: 260px;
    }

    .orbit-two {
        width: 215px;
        height: 215px;
    }

}


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

@media (max-width: 991px) {

    .mpp-why-section {
        padding: 90px 0;
    }

    .mpp-why-layout {
        grid-template-columns: 1fr;

        max-width: 700px;

        margin-left: auto;
        margin-right: auto;
    }

    .mpp-why-center {
        order: -1;

        margin-bottom: 20px;
    }

    .mpp-why-column {
        display: grid;

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

    .mpp-why-bottom {
        grid-template-columns: 1fr 1fr;

        gap: 20px;
    }

    .mpp-why-bottom-item {
        padding: 10px;

        border-right: 0;

        border-bottom:
            1px solid rgba(255,255,255,0.12);
    }

}


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

@media (max-width: 767px) {

    .mpp-why-section {
        padding: 75px 0;
    }

    .mpp-why-heading h2 {
        font-size: 38px;

        letter-spacing: -1px;
    }

    .mpp-why-heading p {
        font-size: 14px;
    }

    .mpp-why-layout {
        margin-top: 60px;
    }

    .mpp-why-column {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .mpp-why-center {
        height: 290px;
    }

    .mpp-why-bottom {
        grid-template-columns: 1fr;

        gap: 0;

        padding: 15px;
    }

    .mpp-why-bottom-item {
        justify-content: flex-start;

        padding: 15px;

        border-bottom:
            1px solid rgba(255,255,255,0.1);
    }

    .mpp-why-bottom-item:last-child {
        border-bottom: 0;
    }

}


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

@media (max-width: 480px) {

    .mpp-why-heading h2 {
        font-size: 33px;
    }

    .mpp-why-center {
        height: 250px;
    }

    .mpp-why-center-circle {
        width: 170px;
        height: 170px;
    }

    .mpp-center-logo {
        width: 90px;
    }

    .orbit-one {
        width: 225px;
        height: 225px;
    }

    .orbit-two {
        width: 190px;
        height: 190px;
    }

}
/* =========================================================
   FEATURES & BENEFITS
========================================================= */

.mpp-benefits-section {
    position: relative;
    padding: 120px 0 110px;
    background: #f7f9fc;
    overflow: hidden;
}


/* =========================================================
   HEADING
========================================================= */

.mpp-benefits-heading {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns: 1fr 430px;

    align-items: end;

    gap: 70px;

    margin-bottom: 60px;
}

.mpp-benefits-heading h2 {
    margin: 15px 0 0;

    max-width: 650px;

    color: #111a35;

    font-size: clamp(40px, 4vw, 56px);

    line-height: 1.08;

    letter-spacing: -2px;

    font-weight: 800;
}

.mpp-benefits-heading h2 span {
    display: block;

    color: var(--mp-gold);
}

.mpp-benefits-heading > p {
    margin: 0;

    color: #737a87;

    font-size: 14px;

    line-height: 1.9;
}


/* =========================================================
   MAIN GRID
========================================================= */

.mpp-benefits-grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns: 0.85fr 1.15fr;

    gap: 25px;
}


/* =========================================================
   MAIN FEATURE
========================================================= */

.mpp-benefit-main {
    position: relative;

    min-height: 620px;

    overflow: hidden;

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            #111d38 0%,
            #071329 100%
        );

    box-shadow:
        0 25px 60px rgba(9,25,50,0.14);
}

.mpp-benefit-main-bg {
    position: absolute;

    width: 420px;
    height: 420px;

    right: -170px;
    bottom: -170px;

    border-radius: 50%;

    border: 80px solid rgba(232,154,11,0.10);
}


/* Content */

.mpp-benefit-main-content {
    position: relative;

    z-index: 3;

    padding: 50px 42px;
}


/* Badge */

.mpp-benefit-badge {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding: 8px 13px;

    border-radius: 30px;

    background:
        rgba(232,154,11,0.12);

    color: #f1aa19;

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 1.3px;
}

.mpp-benefit-badge i {
    font-size: 14px;
}


/* Main Heading */

.mpp-benefit-main h3 {
    margin: 30px 0 20px;

    color: #fff;

    font-size: 38px;

    line-height: 1.13;

    letter-spacing: -1px;

    font-weight: 700;
}

.mpp-benefit-main h3 strong {
    color: #f0a514;
}


/* Description */

.mpp-benefit-main-content > p {
    max-width: 430px;

    color: rgba(255,255,255,0.64);

    font-size: 14px;

    line-height: 1.8;
}


/* List */

.mpp-benefit-main-list {
    margin-top: 30px;

    display: flex;

    flex-direction: column;

    gap: 15px;
}

.mpp-benefit-main-list div {
    display: flex;

    align-items: center;

    gap: 12px;

    color: rgba(255,255,255,0.9);

    font-size: 14px;
}

.mpp-benefit-main-list i {
    color: #efa614;

    font-size: 16px;
}


/* Main Button */

.mpp-benefit-main-btn {
    margin-top: 38px;

    display: inline-flex;

    align-items: center;

    gap: 14px;

    padding: 15px 22px;

    color: #111a35;

    background: #fff;

    border-radius: 6px;

    font-size: 14px;

    font-weight: 800;

    transition: all 0.3s ease;
}

.mpp-benefit-main-btn:hover {
    color: #fff;

    background: var(--mp-gold);

    transform: translateY(-3px);
}


/* =========================================================
   DECORATIVE COINS
========================================================= */

.mpp-benefit-coins {
    position: absolute;

    right: 25px;
    bottom: 35px;

    width: 180px;
    height: 180px;

    z-index: 2;
}

.coin {
    position: absolute;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #ffd15a,
            #d88700
        );

    color: #fff;

    font-weight: 800;

    box-shadow:
        inset 0 2px 5px rgba(255,255,255,0.5),
        0 12px 25px rgba(0,0,0,0.2);
}

.coin-one {
    width: 80px;
    height: 80px;

    right: 20px;
    bottom: 20px;

    font-size: 30px;

    z-index: 3;
}

.coin-two {
    width: 65px;
    height: 65px;

    right: 75px;
    bottom: 65px;

    font-size: 24px;

    opacity: 0.85;
}

.coin-three {
    width: 50px;
    height: 50px;

    right: 105px;
    bottom: 15px;

    font-size: 19px;

    opacity: 0.7;
}


/* =========================================================
   BENEFIT CARDS
========================================================= */

.mpp-benefit-cards {
    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 15px;
}

.mpp-benefit-card {
    position: relative;

    min-height: 195px;

    padding: 25px;

    display: flex;

    align-items: flex-start;

    gap: 15px;

    background: #fff;

    border: 1px solid #e9edf2;

    border-radius: 16px;

    overflow: hidden;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

.mpp-benefit-card::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 0;
    height: 3px;

    background: var(--mp-gold);

    transition: width 0.35s ease;
}

.mpp-benefit-card:hover {
    transform: translateY(-5px);

    border-color: rgba(232,154,11,0.25);

    box-shadow:
        0 18px 40px rgba(14,31,55,0.09);
}

.mpp-benefit-card:hover::after {
    width: 100%;
}


/* Icon */

.mpp-benefit-icon {
    width: 50px;
    height: 50px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 13px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 21px;

    transition: all 0.35s ease;
}

.mpp-benefit-card:hover .mpp-benefit-icon {
    background: var(--mp-gold);

    color: #fff;

    transform: rotate(-5deg);
}


/* Content */

.mpp-benefit-card-content {
    padding-right: 12px;
}

.mpp-benefit-card-content > span {
    color: #c0c5ce;

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 1px;
}

.mpp-benefit-card h3 {
    margin: 5px 0 7px;

    color: #111a35;

    font-size: 16px;

    font-weight: 800;
}

.mpp-benefit-card p {
    margin: 0;

    color: #7c828d;

    font-size: 15px;

    line-height: 1.7;
}


/* Arrow */

.mpp-benefit-arrow {
    position: absolute;

    right: 18px;
    top: 18px;

    color: #c4c9d1;

    font-size: 15px;

    transition: all 0.3s ease;
}

.mpp-benefit-card:hover .mpp-benefit-arrow {
    color: var(--mp-gold);

    transform: translate(3px,-3px);
}


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

.mpp-benefit-strip {
    position: relative;

    z-index: 2;

    margin-top: 55px;

    padding: 20px;

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    background: #fff;

    border: 1px solid #e9edf2;

    border-radius: 15px;

    box-shadow:
        0 18px 50px rgba(15,31,54,0.06);
}

.mpp-benefit-strip-item {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    border-right: 1px solid #e7ebef;
}

.mpp-benefit-strip-item:last-child {
    border-right: 0;
}

.mpp-strip-icon {
    width: 44px;
    height: 44px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 19px;
}

.mpp-benefit-strip-item strong {
    display: block;

    color: #111a35;

    font-size: 15px;

    font-weight: 800;
}

.mpp-benefit-strip-item span {
    display: block;

    margin-top: 3px;

    color: #858b96;

    font-size: 14px;
}


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

@media (max-width: 1100px) {

    .mpp-benefits-grid {
        grid-template-columns: 1fr;
    }

    .mpp-benefit-main {
        min-height: 520px;
    }

    .mpp-benefit-cards {
        grid-template-columns: repeat(3, 1fr);
    }

    .mpp-benefit-card {
        min-height: 210px;

        flex-direction: column;
    }

    .mpp-benefits-heading {
        grid-template-columns: 1fr 350px;

        gap: 30px;
    }

}


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

@media (max-width: 991px) {

    .mpp-benefits-section {
        padding: 90px 0;
    }

    .mpp-benefits-heading {
        grid-template-columns: 1fr;

        gap: 15px;
    }

    .mpp-benefit-cards {
        grid-template-columns: 1fr 1fr;
    }

    .mpp-benefit-strip {
        grid-template-columns: 1fr 1fr;

        gap: 20px;
    }

    .mpp-benefit-strip-item {
        border-right: 0;
    }

}


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

@media (max-width: 767px) {

    .mpp-benefits-section {
        padding: 75px 0;
    }

    .mpp-benefits-heading h2 {
        font-size: 38px;

        letter-spacing: -1px;
    }

    .mpp-benefits-heading > p {
        font-size: 14px;
    }

    .mpp-benefit-main {
        min-height: 590px;
    }

    .mpp-benefit-main-content {
        padding: 38px 28px;
    }

    .mpp-benefit-main h3 {
        font-size: 32px;
    }

    .mpp-benefit-coins {
        opacity: 0.7;
    }

    .mpp-benefit-cards {
        grid-template-columns: 1fr;
    }

    .mpp-benefit-card {
        min-height: auto;

        flex-direction: row;
    }

    .mpp-benefit-strip {
        grid-template-columns: 1fr;

        gap: 0;
    }

    .mpp-benefit-strip-item {
        justify-content: flex-start;

        padding: 14px;

        border-bottom: 1px solid #edf0f3;
    }

    .mpp-benefit-strip-item:last-child {
        border-bottom: 0;
    }

}


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

@media (max-width: 480px) {

    .mpp-benefits-heading h2 {
        font-size: 33px;
    }

    .mpp-benefit-main {
        min-height: 620px;
    }

    .mpp-benefit-main h3 {
        font-size: 29px;
    }

    .mpp-benefit-main-content > p {
        font-size: 14px;
    }

    .mpp-benefit-coins {
        transform: scale(0.75);

        transform-origin: right bottom;
    }

}
/* =========================================================
   MAX PRIME PAISA
   RATES & CHARGES
========================================================= */

.mpp-rates-section {
    position: relative;
    padding: 120px 0 110px;
    background: #f7f9fc;
    overflow: hidden;
}

.mpp-rates-pattern {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .45;

    background-image:
        linear-gradient(
            rgba(6,59,145,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(6,59,145,.035) 1px,
            transparent 1px
        );

    background-size: 50px 50px;
}


/* =========================================================
   HEADING
========================================================= */

.mpp-rates-heading {
    position: relative;
    z-index: 2;
    max-width: 760px;
    margin: 0 auto 60px;
}

.mpp-rates-heading h2 {
    margin: 15px 0 0;

    color: #111a35;

    font-size: clamp(40px, 4vw, 56px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -2px;
}

.mpp-rates-heading h2 span {
    display: block;
    color: var(--mp-gold);
}

.mpp-rates-heading p {
    max-width: 650px;
    margin: 20px auto 0;

    color: #737b88;

    font-size: 14px;
    line-height: 1.8;
}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.mpp-rates-layout {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns: 350px 1fr;

    gap: 25px;
}


/* =========================================================
   APR CARD
========================================================= */

.mpp-apr-card {
    position: relative;

    min-height: 535px;

    padding: 38px;

    overflow: hidden;

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            #111d38,
            #061329
        );

    box-shadow:
        0 25px 60px rgba(9,25,50,.18);
}

.mpp-apr-glow {
    position: absolute;

    width: 300px;
    height: 300px;

    right: -150px;
    top: -100px;

    border-radius: 50%;

    border: 60px solid
        rgba(232,154,11,.08);
}

.mpp-apr-top {
    position: relative;
}

.mpp-apr-badge {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding: 8px 12px;

    border-radius: 30px;

    background:
        rgba(232,154,11,.12);

    color: #f1aa19;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.2px;
}

.mpp-apr-bg-icon {
    position: absolute;

    right: 0;
    top: -5px;

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

    font-size: 70px;
}


/* APR Value */

.mpp-apr-value {
    margin-top: 60px;
}

.mpp-apr-value small {
    display: block;

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

    font-size: 14px;
}

.mpp-apr-value strong {
    display: block;

    margin-top: 5px;

    color: #fff;

    font-size: 76px;

    line-height: 1;

    font-weight: 800;

    letter-spacing: -4px;
}

.mpp-apr-value strong span {
    color: #f0a414;
}

.mpp-apr-value label {
    display: block;

    margin-top: 8px;

    color: #f0a414;

    font-size: 14px;

    font-weight: 600;
}


/* Info */

.mpp-apr-info {
    margin-top: 50px;

    display: flex;

    align-items: flex-start;

    gap: 12px;

    padding: 15px;

    border-radius: 10px;

    background:
        rgba(255,255,255,.05);
}

.mpp-apr-info i {
    color: #f0a414;

    font-size: 16px;
}

.mpp-apr-info p {
    margin: 0;

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

    font-size: 15px;

    line-height: 1.7;
}


/* Bottom */

.mpp-apr-bottom {
    position: absolute;

    left: 38px;
    right: 38px;
    bottom: 35px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 20px;

    padding-top: 22px;

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

.mpp-apr-bottom span {
    display: block;

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

    font-size: 14px;
}

.mpp-apr-bottom strong {
    display: block;

    margin-top: 5px;

    color: #fff;

    font-size: 14px;
}


/* =========================================================
   RATE GRID
========================================================= */

.mpp-rates-grid {
    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 15px;
}


/* Card */

.mpp-rate-card {
    position: relative;

    min-height: 125px;

    padding: 22px;

    display: flex;

    align-items: center;

    gap: 15px;

    border: 1px solid #e8ecf1;

    border-radius: 15px;

    background: #fff;

    transition: all .35s ease;
}

.mpp-rate-card:hover {
    transform: translateY(-5px);

    border-color:
        rgba(232,154,11,.3);

    box-shadow:
        0 18px 40px rgba(13,31,55,.09);
}


/* Icon */

.mpp-rate-icon {
    width: 50px;
    height: 50px;

    flex-shrink: 0;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 21px;

    transition: all .35s ease;
}

.mpp-rate-card:hover .mpp-rate-icon {
    background: var(--mp-gold);

    color: #fff;
}


/* Content */

.mpp-rate-content span {
    display: block;

    color: #9a9faa;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1px;
}

.mpp-rate-content h3 {
    margin: 5px 0 2px;

    color: #111a35;

    font-size: 20px;

    font-weight: 800;
}

.mpp-rate-content p {
    margin: 0;

    color: #858b96;

    font-size: 15px;
}


/* Featured */

.featured-rate {
    background:
        linear-gradient(
            135deg,
            #fffaf0,
            #fff
        );

    border-color:
        rgba(232,154,11,.25);
}


/* =========================================================
   APR EXPLANATION
========================================================= */

.mpp-apr-explanation {
    position: relative;

    z-index: 2;

    margin-top: 25px;

    padding: 30px;

    display: grid;

    grid-template-columns: 330px 1fr;

    gap: 40px;

    align-items: center;

    background: #fff;

    border: 1px solid #e8ecf1;

    border-radius: 18px;

    box-shadow:
        0 15px 45px rgba(15,32,56,.05);
}

.mpp-explanation-heading {
    display: flex;

    align-items: center;

    gap: 15px;
}

.mpp-explanation-icon {
    width: 55px;
    height: 55px;

    display: flex;

    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    border-radius: 14px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 23px;
}

.mpp-explanation-heading > div:last-child > span {
    color: var(--mp-gold);

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.5px;
}

.mpp-explanation-heading h3 {
    margin: 5px 0 0;

    color: #111a35;

    font-size: 20px;

    font-weight: 800;
}

.mpp-explanation-content > p {
    margin: 0 0 15px;

    color: #727987;

    font-size: 14px;

    line-height: 1.8;
}


/* Fixed APR */

.mpp-fixed-apr {
    display: flex;

    align-items: center;

    gap: 12px;

    padding: 13px 15px;

    border-radius: 9px;

    background: #f7f9fc;

    border-left: 3px solid
        var(--mp-gold);
}

.mpp-fixed-apr > i {
    color: var(--mp-gold);
}

.mpp-fixed-apr strong {
    display: block;

    color: #111a35;

    font-size: 15px;
}

.mpp-fixed-apr span {
    display: block;

    margin-top: 3px;

    color: #7d838e;

    font-size: 14px;
}


/* =========================================================
   WORKING SECTION
========================================================= */

.mpp-rates-working {
    position: relative;

    z-index: 2;

    margin-top: 80px;

    display: grid;

    grid-template-columns: 390px 1fr;

    gap: 80px;

    align-items: center;
}


/* Visual */

.mpp-working-visual {
    position: relative;

    height: 390px;

    display: flex;

    align-items: center;

    justify-content: center;
}

.mpp-working-circle {
    width: 280px;
    height: 280px;

    border-radius: 50%;

    display: flex;

    align-items: center;
    justify-content: center;

    background:
        radial-gradient(
            circle,
            #fff 48%,
            #fff7e6 49%,
            #fff7e6 58%,
            #fff 59%
        );

    border:
        1px solid #eadfbf;

    box-shadow:
        0 25px 60px rgba(17,34,57,.10);
}

.mpp-working-percent {
    width: 175px;
    height: 175px;

    border-radius: 50%;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    background: #111a35;

    box-shadow:
        0 15px 35px rgba(10,25,50,.2);
}

.mpp-working-percent span {
    color: #f0a414;

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 2px;
}

.mpp-working-percent strong {
    margin-top: 5px;

    color: #fff;

    font-size: 40px;

    font-weight: 800;
}


/* Floating mini icons */

.mpp-working-mini {
    position: absolute;

    width: 52px;
    height: 52px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #fff;

    color: var(--mp-gold);

    border: 1px solid #edf0f3;

    box-shadow:
        0 12px 30px rgba(14,31,55,.10);

    font-size: 18px;
}

.mini-one {
    top: 35px;
    left: 50px;
}

.mini-two {
    right: 20px;
    top: 130px;
}

.mini-three {
    bottom: 45px;
    left: 75px;
}


/* Working Content */

.mpp-working-content h2 {
    margin: 15px 0 20px;

    color: #111a35;

    font-size: 44px;

    line-height: 1.1;

    font-weight: 800;

    letter-spacing: -1.5px;
}

.mpp-working-content h2 span {
    display: block;

    color: var(--mp-gold);
}

.mpp-working-content > p {
    max-width: 650px;

    color: #747b88;

    font-size: 14px;

    line-height: 1.85;
}


/* Points */

.mpp-working-points {
    margin-top: 25px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 12px;
}

.mpp-working-points div {
    display: flex;

    align-items: center;

    gap: 8px;

    color: #30384b;

    font-size: 15px;

    font-weight: 600;
}

.mpp-working-points i {
    color: var(--mp-gold);

    font-size: 15px;
}


/* =========================================================
   DISCLAIMER
========================================================= */

.mpp-rates-disclaimer {
    position: relative;

    z-index: 2;

    margin-top: 70px;

    padding: 18px 22px;

    display: flex;

    align-items: flex-start;

    gap: 12px;

    border-radius: 10px;

    background: #fff9ed;

    border: 1px solid #f2dfb5;
}

.mpp-rates-disclaimer > i {
    color: var(--mp-gold);

    font-size: 18px;
}

.mpp-rates-disclaimer p {
    margin: 0;

    color: #77705f;

    font-size: 15px;

    line-height: 1.7;
}

.mpp-rates-disclaimer strong {
    color: #4d4637;
}


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

@media (max-width: 1100px) {

    .mpp-rates-layout {
        grid-template-columns: 1fr;
    }

    .mpp-apr-card {
        min-height: 400px;
    }

    .mpp-apr-value {
        margin-top: 40px;
    }

    .mpp-apr-info {
        margin-top: 30px;
    }

    .mpp-rates-working {
        grid-template-columns: 300px 1fr;

        gap: 45px;
    }

}


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

@media (max-width: 991px) {

    .mpp-rates-section {
        padding: 90px 0;
    }

    .mpp-rates-grid {
        grid-template-columns: 1fr 1fr;
    }

    .mpp-apr-explanation {
        grid-template-columns: 1fr;

        gap: 20px;
    }

    .mpp-rates-working {
        grid-template-columns: 1fr;

        gap: 40px;
    }

    .mpp-working-visual {
        max-width: 400px;

        margin: auto;
    }

    .mpp-working-content {
        text-align: left;
    }

}


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

@media (max-width: 767px) {

    .mpp-rates-section {
        padding: 75px 0;
    }

    .mpp-rates-heading h2 {
        font-size: 38px;

        letter-spacing: -1px;
    }

    .mpp-rates-heading p {
        font-size: 14px;
    }

    .mpp-rates-grid {
        grid-template-columns: 1fr;
    }

    .mpp-apr-card {
        min-height: 500px;

        padding: 30px;
    }

    .mpp-apr-value strong {
        font-size: 65px;
    }

    .mpp-apr-bottom {
        left: 30px;
        right: 30px;
    }

    .mpp-apr-explanation {
        padding: 23px;
    }

    .mpp-working-content h2 {
        font-size: 37px;
    }

    .mpp-working-points {
        grid-template-columns: 1fr;
    }

    .mpp-rates-disclaimer {
        margin-top: 50px;
    }

}


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

@media (max-width: 480px) {

    .mpp-rates-heading h2 {
        font-size: 33px;
    }

    .mpp-apr-card {
        min-height: 530px;
    }

    .mpp-apr-value strong {
        font-size: 58px;
    }

    .mpp-working-circle {
        width: 250px;
        height: 250px;
    }

    .mpp-working-percent {
        width: 155px;
        height: 155px;
    }

    .mpp-working-percent strong {
        font-size: 34px;
    }

    .mpp-working-content h2 {
        font-size: 32px;
    }

}
/* =========================================================
   MAX PRIME PAISA
   LOAN CALCULATOR
========================================================= */

.mpp-calculator-section {
    position: relative;
    padding: 120px 0 110px;
    background: #fff;
    overflow: hidden;
}

.mpp-calculator-bg {
    position: absolute;
    width: 700px;
    height: 700px;
    right: -400px;
    top: -250px;

    border-radius: 50%;

    border: 100px solid rgba(232,154,11,0.045);
}


/* =========================================================
   HEADING
========================================================= */

.mpp-calculator-heading {
    position: relative;
    z-index: 2;

    max-width: 750px;

    margin: 0 auto 60px;
}

.mpp-calculator-heading h2 {
    margin: 15px 0 0;

    color: #111a35;

    font-size: clamp(40px, 4vw, 56px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -2px;
}

.mpp-calculator-heading h2 span {
    display: block;

    color: var(--mp-gold);
}

.mpp-calculator-heading p {
    max-width: 620px;

    margin: 20px auto 0;

    color: #737a87;

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================================
   CALCULATOR BOX
========================================================= */

.mpp-calculator-box {
    position: relative;

    z-index: 2;

    /* display: grid; */

    grid-template-columns:
        1.15fr 0.85fr;

    overflow: hidden;

    border-radius: 24px;

    background: #fff;

    border: 1px solid #e7ebf0;

    box-shadow:
        0 25px 70px rgba(12,31,56,0.10);
}


/* =========================================================
   FORM
========================================================= */

.mpp-calculator-form {
    padding: 45px 50px;
}

.mpp-calculator-form-header {
    display: flex;

    align-items: center;

    justify-content: space-between;

    padding-bottom: 25px;

    border-bottom: 1px solid #edf0f3;
}

.mpp-calculator-form-header > div:first-child > span {
    color: var(--mp-gold);

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 1.5px;
}

.mpp-calculator-form-header h3 {
    margin: 7px 0 0;

    color: #111a35;

    font-size: 23px;

    font-weight: 800;
}

.mpp-calculator-icon {
    width: 52px;
    height: 52px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 13px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 22px;
}


/* =========================================================
   FIELDS
========================================================= */

.mpp-calc-field {
    margin-top: 30px;
}

.mpp-calc-label {
    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 17px;
}

.mpp-calc-label label {
    color: #111a35;

    font-size: 14px;

    font-weight: 700;
}

.mpp-calc-value {
    min-width: 105px;

    padding: 8px 13px;

    text-align: center;

    border-radius: 7px;

    background: #f7f9fc;

    color: #111a35;

    font-size: 14px;

    font-weight: 800;
}

.mpp-calc-value small {
    font-size: 15px;

    color: #777e8b;
}


/* =========================================================
   RANGE SLIDER
========================================================= */

.mpp-range {
    width: 100%;

    height: 6px;

    appearance: none;

    -webkit-appearance: none;

    border-radius: 10px;

    outline: none;

    background:
        linear-gradient(
            to right,
            var(--mp-gold) 0%,
            var(--mp-gold) 10%,
            #e6e9ee 10%,
            #e6e9ee 100%
        );

    cursor: pointer;
}


/* Chrome */

.mpp-range::-webkit-slider-thumb {
    appearance: none;

    -webkit-appearance: none;

    width: 22px;
    height: 22px;

    border-radius: 50%;

    border: 5px solid #fff;

    background: var(--mp-gold);

    box-shadow:
        0 2px 10px rgba(232,154,11,.35);

    cursor: pointer;
}


/* Firefox */

.mpp-range::-moz-range-thumb {
    width: 18px;
    height: 18px;

    border-radius: 50%;

    border: 4px solid #fff;

    background: var(--mp-gold);

    box-shadow:
        0 2px 10px rgba(232,154,11,.35);

    cursor: pointer;
}


/* Range Labels */

.mpp-range-labels {
    margin-top: 9px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    color: #9a9faa;

    font-size: 14px;
}


/* =========================================================
   NOTE
========================================================= */

.mpp-calc-note {
    margin-top: 30px;

    padding: 13px 15px;

    display: flex;

    align-items: flex-start;

    gap: 10px;

    border-radius: 9px;

    background: #f8f9fb;
}

.mpp-calc-note i {
    color: var(--mp-gold);

    font-size: 15px;
}

.mpp-calc-note span {
    color: #7c828d;

    font-size: 14px;

    line-height: 1.7;
}


/* =========================================================
   RESULT PANEL
========================================================= */

.mpp-calculator-result {
    position: relative;

    padding: 45px;

    background:
        linear-gradient(
            145deg,
            #111d38,
            #061329
        );

    color: #fff;

    overflow: hidden;
}

.mpp-calculator-result::before {
    content: "";

    position: absolute;

    width: 400px;
    height: 400px;

    right: -220px;
    top: -180px;

    border-radius: 50%;

    border: 70px solid rgba(232,154,11,.07);
}


/* Result Top */

.mpp-result-top {
    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    justify-content: space-between;
}

.mpp-result-top > span {
    color: rgba(255,255,255,.55);

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 1.5px;
}

.mpp-result-check {
    width: 35px;
    height: 35px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: rgba(232,154,11,.15);

    color: #f1a615;

    font-size: 15px;
}


/* =========================================================
   RESULT CIRCLE
========================================================= */

.mpp-result-circle {
    position: relative;

    z-index: 2;

    width: 245px;
    height: 245px;

    margin: 30px auto;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    text-align: center;

    background:
        radial-gradient(
            circle,
            #142440 50%,
            #102038 51%,
            #102038 62%,
            transparent 63%
        );

    border: 1px solid rgba(232,154,11,.4);

    box-shadow:
        0 0 0 12px rgba(232,154,11,.035);
}

.mpp-result-circle small {
    display: block;

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

    font-size: 15px;
}

.mpp-result-circle strong {
    display: block;

    margin-top: 7px;

    color: #fff;

    font-size: 31px;

    font-weight: 800;

    letter-spacing: -1px;
}

.mpp-result-circle span {
    display: block;

    margin-top: 7px;

    color: #efa614;

    font-size: 14px;
}


/* =========================================================
   BREAKDOWN
========================================================= */

.mpp-result-breakdown {
    position: relative;

    z-index: 2;

    border-top:
        1px solid rgba(255,255,255,.1);
}

.mpp-result-row {
    padding: 14px 0;

    display: flex;

    align-items: center;

    justify-content: space-between;

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

.mpp-result-row span {
    display: flex;

    align-items: center;

    gap: 8px;

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

    font-size: 15px;
}

.mpp-result-row span i {
    color: #efa614;
}

.mpp-result-row strong {
    color: #fff;

    font-size: 14px;
}

.mpp-result-row.total-row {
    border-bottom: 0;

    padding-bottom: 0;
}

.mpp-result-row.total-row span {
    color: #fff;

    font-weight: 700;
}

.mpp-result-row.total-row strong {
    color: #f0a414;

    font-size: 17px;
}


/* =========================================================
   APPLY BUTTON
========================================================= */

.mpp-calc-apply-btn {
    position: relative;

    z-index: 2;

    margin-top: 25px;

    width: 100%;

    min-height: 53px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 13px;

    border-radius: 6px;

    background:
        linear-gradient(
            135deg,
            #f0a614,
            #d98900
        );

    color: #fff;

    font-size: 14px;

    font-weight: 800;

    transition: all .3s ease;
}

.mpp-calc-apply-btn:hover {
    color: #fff;

    transform: translateY(-3px);

    box-shadow:
        0 12px 25px rgba(226,147,7,.25);
}


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

.mpp-calculator-benefits {
    position: relative;

    z-index: 2;

    margin-top: 30px;

    padding: 20px;

    display: grid;

    grid-template-columns:
        repeat(4,1fr);

    background: #fff;

    border: 1px solid #e9edf2;

    border-radius: 14px;

    box-shadow:
        0 15px 40px rgba(15,31,54,.05);
}

.mpp-calculator-benefits > div {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    border-right: 1px solid #e8ebef;
}

.mpp-calculator-benefits > div:last-child {
    border-right: 0;
}

.mpp-calculator-benefits i {
    color: var(--mp-gold);

    font-size: 18px;
}

.mpp-calculator-benefits span {
    color: #555d6c;

    font-size: 15px;

    font-weight: 600;
}


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

@media (max-width: 991px) {

    .mpp-calculator-section {
        padding: 90px 0;
    }

    .mpp-calculator-box {
        grid-template-columns: 1fr;
    }

    .mpp-calculator-form {
        padding: 40px;
    }

    .mpp-calculator-result {
        padding: 40px;
    }

    .mpp-result-circle {
        margin-top: 35px;
    }

    .mpp-calculator-benefits {
        grid-template-columns: 1fr 1fr;

        gap: 20px;
    }

    .mpp-calculator-benefits > div {
        border-right: 0;
    }

}


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

@media (max-width: 767px) {

    .mpp-calculator-section {
        padding: 75px 0;
    }

    .mpp-calculator-heading h2 {
        font-size: 38px;

        letter-spacing: -1px;
    }

    .mpp-calculator-form {
        padding: 30px 22px;
    }

    .mpp-calculator-result {
        padding: 30px 22px;
    }

    .mpp-calculator-form-header h3 {
        font-size: 19px;
    }

    .mpp-result-circle {
        width: 220px;
        height: 220px;
    }

    .mpp-result-circle strong {
        font-size: 27px;
    }

    .mpp-calculator-benefits {
        grid-template-columns: 1fr;

        gap: 0;
    }

    .mpp-calculator-benefits > div {
        justify-content: flex-start;

        padding: 13px;

        border-bottom: 1px solid #edf0f3;
    }

    .mpp-calculator-benefits > div:last-child {
        border-bottom: 0;
    }

}


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

@media (max-width: 480px) {

    .mpp-calculator-heading h2 {
        font-size: 33px;
    }

    .mpp-calc-label {
        align-items: flex-start;

        gap: 10px;
    }

    .mpp-calc-value {
        min-width: 90px;
    }

    .mpp-apr-value strong {
        font-size: 55px;
    }

}
/* =========================================================
   MAX PRIME PAISA
   ELIGIBILITY & DOCUMENTS
========================================================= */

.mpp-eligibility-section {
    position: relative;

    padding: 120px 0 110px;

    background: #f7f9fc;

    overflow: hidden;
}

.mpp-eligibility-pattern {
    position: absolute;

    inset: 0;

    pointer-events: none;

    opacity: .45;

    background-image:
        radial-gradient(
            rgba(232,154,11,.12) 1px,
            transparent 1px
        );

    background-size: 30px 30px;
}


/* =========================================================
   HEADING
========================================================= */

.mpp-eligibility-heading {
    position: relative;

    z-index: 2;

    max-width: 760px;

    margin: 0 auto 60px;
}

.mpp-eligibility-heading h2 {
    margin: 15px 0 0;

    color: #111a35;

    font-size: clamp(40px,4vw,56px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -2px;
}

.mpp-eligibility-heading h2 span {
    display: block;

    color: var(--mp-gold);
}

.mpp-eligibility-heading p {
    max-width: 650px;

    margin: 20px auto 0;

    color: #737a87;

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================================
   MAIN GRID
========================================================= */

.mpp-eligibility-grid {
    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 25px;
}


/* =========================================================
   CARDS
========================================================= */

.mpp-eligibility-card,
.mpp-documents-card {
    position: relative;

    padding: 35px;

    background: #fff;

    border: 1px solid #e8ecf1;

    border-radius: 20px;

    box-shadow:
        0 18px 50px rgba(13,31,55,.06);
}


/* =========================================================
   CARD TOP
========================================================= */

.mpp-card-top {
    display: flex;

    align-items: center;

    gap: 15px;

    padding-bottom: 25px;

    border-bottom: 1px solid #edf0f3;
}

.mpp-card-icon {
    width: 55px;
    height: 55px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            #fff5df,
            #fffaf0
        );

    color: var(--mp-gold);

    font-size: 24px;
}

.mpp-card-top span {
    display: block;

    color: var(--mp-gold);

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.5px;
}

.mpp-card-top h3 {
    margin: 5px 0 0;

    color: #111a35;

    font-size: 22px;

    font-weight: 800;
}

.mpp-card-intro {
    margin: 20px 0;

    color: #7b828e;

    font-size: 11px;

    line-height: 1.7;
}


/* =========================================================
   ELIGIBILITY LIST
========================================================= */

.mpp-eligibility-list {
    display: flex;

    flex-direction: column;

    gap: 4px;
}

.mpp-eligibility-item {
    position: relative;

    display: flex;

    align-items: center;

    gap: 13px;

    padding: 13px 10px;

    border-radius: 10px;

    transition: all .3s ease;
}

.mpp-eligibility-item:hover {
    background: #fffaf0;

    transform: translateX(4px);
}


/* Check icon */

.mpp-check-icon {
    width: 40px;
    height: 40px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: #f7f9fc;

    color: var(--mp-blue);

    font-size: 16px;
}

.mpp-eligibility-item:hover .mpp-check-icon {
    background: var(--mp-gold);

    color: #fff;
}


/* Content */

.mpp-eligibility-item strong {
    display: block;

    color: #111a35;

    font-size: 14px;

    font-weight: 800;
}

.mpp-eligibility-item span {
    display: block;

    margin-top: 3px;

    color: #858b96;

    font-size: 11px;

    line-height: 1.5;
}


/* Number */

.mpp-eligibility-item b {
    margin-left: auto;

    color: #d4d8de;

    font-size: 11px;
}
/* =========================================================
   MAX PRIME PAISA
   PREMIUM FOOTER
========================================================= */

.mpp-footer {
    position: relative;
    color: #fff;
}


/* =========================================================
   FINAL CTA
========================================================= */

.mpp-footer-cta {
    position: relative;

    background: #f7f9fc;

    padding: 70px 0 0;
}

.mpp-footer-cta-inner {
    position: relative;

    min-height: 220px;

    padding: 40px 55px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

    overflow: hidden;

    border-radius: 22px 22px 0 0;

    background:
        linear-gradient(
            115deg,
            #111d38,
            #07152c
        );
}

.mpp-footer-cta-inner::before {
    content: "";

    position: absolute;

    width: 350px;
    height: 350px;

    right: -140px;
    top: -220px;

    border-radius: 50%;

    border: 65px solid rgba(232,154,11,.08);
}

.mpp-footer-cta-inner::after {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    left: 45%;
    bottom: -130px;

    border-radius: 50%;

    background: rgba(232,154,11,.05);
}


/* CTA Content */

.mpp-footer-cta-content {
    position: relative;

    z-index: 2;
}

.mpp-footer-cta-content > span {
    display: flex;

    align-items: center;

    gap: 8px;

    color: #f0a414;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.5px;
}

.mpp-footer-cta-content h2 {
    margin: 10px 0 7px;

    color: #fff;

    font-size: 34px;

    line-height: 1.15;

    font-weight: 700;
}

.mpp-footer-cta-content h2 strong {
    color: #f0a414;
}

.mpp-footer-cta-content p {
    margin: 0;

    max-width: 570px;

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

    font-size: 11px;

    line-height: 1.7;
}


/* CTA Button */

.mpp-footer-cta-btn {
    position: relative;

    z-index: 2;

    min-width: 155px;

    padding: 16px 22px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    border-radius: 6px;

    background:
        linear-gradient(
            135deg,
            #f0a614,
            #d98900
        );

    color: #fff;

    font-size: 14px;

    font-weight: 800;

    box-shadow:
        0 12px 30px rgba(226,147,7,.2);

    transition: all .3s ease;
}

.mpp-footer-cta-btn:hover {
    color: #fff;

    transform: translateY(-3px);

    box-shadow:
        0 18px 35px rgba(226,147,7,.35);
}


/* =========================================================
   MAIN FOOTER
========================================================= */

.mpp-footer-main {
    position: relative;

    padding: 75px 0 35px;

    background:
        linear-gradient(
            180deg,
            #071329,
            #050c19
        );
}

.mpp-footer-main::before {
    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    opacity: .25;

    background-image:
        radial-gradient(
            rgba(255,255,255,.09) 1px,
            transparent 1px
        );

    background-size: 35px 35px;
}


/* =========================================================
   COMPANY
========================================================= */

.mpp-footer-company {
    position: relative;

    z-index: 2;
}

.mpp-footer-logo {
    display: inline-block;

    width: 270px;

    padding: 10px 18px;

    background: #fff;

    border-radius: 8px;
}

.mpp-footer-logo img {
    width: 100%;

    height: auto;

    display: block;
}

.mpp-footer-company > p {
    max-width: 390px;

    margin: 23px 0;

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

    font-size: 11px;

    line-height: 1.8;
}


/* Trust */

.mpp-footer-trust {
    display: flex;

    align-items: center;

    gap: 12px;

    padding: 13px;

    max-width: 300px;

    border-radius: 10px;

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

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

.mpp-footer-trust-icon {
    width: 40px;
    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    background: rgba(232,154,11,.12);

    color: #f0a414;

    font-size: 17px;
}

.mpp-footer-trust strong {
    display: block;

    color: #fff;

    font-size: 14px;
}

.mpp-footer-trust span {
    display: block;

    margin-top: 3px;

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

    font-size: 13px;
}


/* Social */

.mpp-footer-social {
    margin-top: 25px;

    display: flex;

    gap: 8px;
}

.mpp-footer-social a {
    width: 35px;
    height: 35px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 8px;

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

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

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

    font-size: 14px;

    transition: all .3s ease;
}

.mpp-footer-social a:hover {
    color: #fff;

    background: var(--mp-gold);

    border-color: var(--mp-gold);

    transform: translateY(-3px);
}


/* =========================================================
   FOOTER COLUMNS
========================================================= */

.mpp-footer-column {
    position: relative;

    z-index: 2;
}

.mpp-footer-column h3 {
    position: relative;

    margin: 0 0 25px;

    padding-bottom: 12px;

    color: #fff;

    font-size: 14px;

    font-weight: 800;
}

.mpp-footer-column h3::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 28px;
    height: 2px;

    background: var(--mp-gold);
}

.mpp-footer-column ul {
    padding: 0;

    margin: 0;

    list-style: none;
}

.mpp-footer-column li {
    margin-bottom: 12px;
}

.mpp-footer-column li a {
    display: inline-flex;

    align-items: center;

    gap: 7px;

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

    font-size: 14px;

    transition: all .3s ease;
}

.mpp-footer-column li a i {
    color: #e9a313;

    font-size: 13px;

    transition: transform .3s ease;
}

.mpp-footer-column li a:hover {
    color: #fff;

    transform: translateX(3px);
}

.mpp-footer-column li a:hover i {
    transform: translateX(3px);
}


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

.mpp-footer-contact {
    display: flex;

    align-items: flex-start;

    gap: 11px;

    margin-bottom: 20px;
}

.mpp-footer-contact-icon {
    width: 34px;
    height: 34px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 8px;

    color: #f0a414;

    background:
        rgba(232,154,11,.09);

    font-size: 15px;
}

.mpp-footer-contact span {
    display: block;

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

    font-size: 13px;

    text-transform: uppercase;

    letter-spacing: .7px;
}

.mpp-footer-contact p,
.mpp-footer-contact a {
    display: block;

    margin: 4px 0 0;

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

    font-size: 14px;

    line-height: 1.6;
}

.mpp-footer-contact a:hover {
    color: var(--mp-gold);
}


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

.mpp-footer-legal {
    position: relative;

    z-index: 2;

    margin-top: 55px;

    padding-top: 25px;

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

.mpp-footer-legal > div {
    display: flex;

    align-items: center;

    gap: 30px;
}

.mpp-footer-legal > div > span {
    flex-shrink: 0;

    color: #fff;

    font-size: 14px;

    font-weight: 700;
}

.mpp-footer-legal-links {
    display: flex;

    flex-wrap: wrap;

    gap: 8px 25px;
}

.mpp-footer-legal-links a {
    color: rgba(255,255,255,.42);

    font-size: 13px;

    transition: color .3s ease;
}

.mpp-footer-legal-links a:hover {
    color: var(--mp-gold);
}


/* =========================================================
   DISCLAIMER
========================================================= */

.mpp-footer-disclaimer {
    position: relative;

    z-index: 2;

    margin-top: 25px;

    padding: 20px;

    display: flex;

    align-items: flex-start;

    gap: 13px;

    border-radius: 10px;

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

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

.mpp-footer-disclaimer-icon {
    width: 35px;
    height: 35px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 8px;

    background:
        rgba(232,154,11,.1);

    color: #eaa313;

    font-size: 14px;
}

.mpp-footer-disclaimer strong {
    display: block;

    margin-bottom: 5px;

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

    font-size: 13px;

    font-weight: 800;
}

.mpp-footer-disclaimer p {
    margin: 0;

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

    font-size: 13px;

    line-height: 1.8;
}


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

.mpp-footer-bottom {
    background: #030812;

    border-top:
        1px solid rgba(255,255,255,.05);
}

.mpp-footer-bottom-inner {
    min-height: 65px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;
}

.mpp-footer-bottom p {
    margin: 0;

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

    font-size: 13px;
}

.mpp-footer-bottom-inner > div span {
    color: rgba(255,255,255,.3);

    font-size: 13px;
}

.mpp-footer-bottom-inner i {
    color: #e9a313;

    margin: 0 2px;
}


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

@media (max-width: 991px) {

    .mpp-footer-cta-inner {
        padding: 35px;
    }

    .mpp-footer-cta-content h2 {
        font-size: 29px;
    }

    .mpp-footer-main {
        padding-top: 60px;
    }

    .mpp-footer-legal > div {
        align-items: flex-start;

        flex-direction: column;

        gap: 15px;
    }

}


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

@media (max-width: 767px) {

    .mpp-footer-cta {
        padding-top: 60px;
    }

    .mpp-footer-cta-inner {
        min-height: 330px;

        padding: 35px 25px;

        flex-direction: column;

        align-items: flex-start;

        justify-content: center;

        border-radius: 18px 18px 0 0;
    }

    .mpp-footer-cta-content h2 {
        font-size: 31px;
    }

    .mpp-footer-cta-btn {
        width: 100%;
    }

    .mpp-footer-logo {
        width: 240px;
    }

    .mpp-footer-main {
        padding: 55px 0 30px;
    }

    .mpp-footer-bottom-inner {
        min-height: auto;

        padding: 20px 0;

        flex-direction: column;

        text-align: center;
    }

}


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

@media (max-width: 480px) {

    .mpp-footer-cta-content h2 {
        font-size: 27px;
    }

    .mpp-footer-company > p {
        font-size: 14px;
    }

    .mpp-footer-disclaimer {
        padding: 15px;
    }

}

/* =========================================================
   DOCUMENTS
========================================================= */

.mpp-documents-card {
    background:
        linear-gradient(
            145deg,
            #111d38,
            #071329
        );

    border: 0;

    box-shadow:
        0 25px 60px rgba(8,25,51,.15);
}

.mpp-documents-card .mpp-card-top {
    border-color:
        rgba(255,255,255,.1);
}

.mpp-documents-card .mpp-card-top h3 {
    color: #fff;
}

.mpp-documents-card .mpp-card-intro {
    color: rgba(255,255,255,.58);
}


/* Document List */

.mpp-documents-list {
    display: flex;

    flex-direction: column;

    gap: 8px;
}


/* Document Item */

.mpp-document-item {
    position: relative;

    display: flex;

    align-items: center;

    gap: 12px;

    padding: 13px;

    border-radius: 11px;

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

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

    transition: all .3s ease;
}

.mpp-document-item:hover {
    background:
        rgba(232,154,11,.09);

    border-color:
        rgba(232,154,11,.25);

    transform: translateX(4px);
}


/* Number */

.mpp-document-number {
    width: 24px;

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

    font-size: 13px;

    font-weight: 800;
}


/* Icon */

.mpp-document-icon {
    width: 39px;
    height: 39px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    background:
        rgba(232,154,11,.12);

    color: #f0a514;

    font-size: 17px;
}


/* Content */

.mpp-document-content {
    flex: 1;
}

.mpp-document-content h4 {
    margin: 0;

    color: #fff;

    font-size: 11px;

    font-weight: 800;
}

.mpp-document-content p {
    margin: 3px 0 0;

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

    font-size: 13px;

    line-height: 1.5;
}


/* Check */

.document-check {
    color: #e9a313;

    font-size: 15px;
}


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

.mpp-document-process {
    position: relative;

    z-index: 2;

    margin-top: 30px;

    padding: 23px 27px;

    display: grid;

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

    align-items: center;

    gap: 30px;

    background: #fff;

    border: 1px solid #e8ecf1;

    border-radius: 15px;

    box-shadow:
        0 15px 40px rgba(14,31,55,.05);
}


/* Heading */

.mpp-process-heading {
    display: flex;

    align-items: center;

    gap: 12px;
}

.mpp-process-mini-icon {
    width: 45px;
    height: 45px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 18px;
}

.mpp-process-heading span {
    display: block;

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.3px;
}

.mpp-process-heading h3 {
    margin: 4px 0 0;

    color: #111a35;

    font-size: 14px;

    font-weight: 800;
}


/* Points */

.mpp-process-points {
    display: grid;

    grid-template-columns:
        repeat(3,1fr);

    gap: 15px;
}

.mpp-process-points div {
    display: flex;

    align-items: center;

    gap: 7px;
}

.mpp-process-points i {
    color: var(--mp-gold);

    font-size: 14px;
}

.mpp-process-points span {
    color: #6f7683;

    font-size: 11px;

    line-height: 1.5;
}


/* Button */

.mpp-document-btn {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    min-width: 155px;

    padding: 14px 18px;

    border-radius: 6px;

    background: #111a35;

    color: #fff;

    font-size: 15px;

    font-weight: 800;

    transition: all .3s ease;
}

.mpp-document-btn:hover {
    color: #fff;

    background: var(--mp-gold);

    transform: translateY(-3px);
}


/* =========================================================
   DISCLAIMER
========================================================= */

.mpp-eligibility-disclaimer {
    position: relative;

    z-index: 2;

    margin-top: 25px;

    padding: 16px 20px;

    display: flex;

    align-items: flex-start;

    gap: 10px;

    border-radius: 9px;

    background: #fffaf0;

    border: 1px solid #f0dfb8;
}

.mpp-eligibility-disclaimer > i {
    color: var(--mp-gold);

    font-size: 15px;
}

.mpp-eligibility-disclaimer p {
    margin: 0;

    color: #77705f;

    font-size: 11px;

    line-height: 1.7;
}


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

@media (max-width: 1100px) {

    .mpp-document-process {
        grid-template-columns: 1fr;

        gap: 20px;
    }

    .mpp-process-points {
        grid-template-columns:
            repeat(3,1fr);
    }

}


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

@media (max-width: 991px) {

    .mpp-eligibility-section {
        padding: 90px 0;
    }

    .mpp-eligibility-grid {
        grid-template-columns: 1fr;
    }

    .mpp-document-process {
        grid-template-columns: 1fr;
    }

    .mpp-document-btn {
        width: 100%;
    }

}


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

@media (max-width: 767px) {

    .mpp-eligibility-section {
        padding: 75px 0;
    }

    .mpp-eligibility-heading h2 {
        font-size: 38px;

        letter-spacing: -1px;
    }

    .mpp-eligibility-heading p {
        font-size: 15px;
    }

    .mpp-eligibility-card,
    .mpp-documents-card {
        padding: 25px 20px;
    }

    .mpp-card-top h3 {
        font-size: 19px;
    }

    .mpp-process-points {
        grid-template-columns: 1fr;
    }

    .mpp-document-process {
        padding: 20px;
    }

}


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

@media (max-width: 480px) {

    .mpp-eligibility-heading h2 {
        font-size: 33px;
    }

    .mpp-eligibility-item {
        padding: 11px 5px;
    }

    .mpp-check-icon {
        width: 36px;
        height: 36px;

        font-size: 14px;
    }

    .mpp-document-item {
        padding: 11px 8px;
    }

    .mpp-document-number {
        display: none;
    }

}
/* =========================================================
   MAX PRIME PAISA
   PREMIUM BREADCRUMB
========================================================= */

.mpp-breadcrumb-section {
    position: relative;

    min-height: 330px;

    display: flex;

    align-items: center;

    overflow: hidden;

    background:
        linear-gradient(
            115deg,
            #111d38 0%,
            #08162d 55%,
            #061225 100%
        );
}


/* =========================================================
   BACKGROUND PATTERN
========================================================= */

.mpp-breadcrumb-pattern {
    position: absolute;

    inset: 0;

    pointer-events: none;

    opacity: .25;

    background-image:
        radial-gradient(
            rgba(255,255,255,.15) 1px,
            transparent 1px
        );

    background-size: 28px 28px;
}


/* =========================================================
   BACKGROUND CIRCLES
========================================================= */

.mpp-breadcrumb-circle {
    position: absolute;

    border-radius: 50%;

    border: 1px solid
        rgba(232,154,11,.12);

    pointer-events: none;
}

.circle-one {
    width: 500px;
    height: 500px;

    right: -220px;
    top: -280px;
}

.circle-two {
    width: 330px;
    height: 330px;

    right: -110px;
    bottom: -230px;

    border-color:
        rgba(255,255,255,.06);
}


/* =========================================================
   WRAPPER
========================================================= */

.mpp-breadcrumb-wrapper {
    position: relative;

    z-index: 2;

    min-height: 330px;

    display: grid;

    grid-template-columns:
        1fr 430px;

    align-items: center;

    gap: 50px;
}


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

.mpp-breadcrumb-content {
    padding: 45px 0;
}


/* Label */

.mpp-breadcrumb-label {
    display: flex;

    align-items: center;

    gap: 9px;

    color: #efa514;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 2px;
}

.mpp-breadcrumb-label span {
    width: 25px;
    height: 2px;

    background: #efa514;
}


/* Heading */

.mpp-breadcrumb-content h1 {
    margin: 12px 0 10px;

    color: #fff;

    font-size: clamp(40px,4vw,54px);

    line-height: 1.1;

    letter-spacing: -1.5px;

    font-weight: 800;
}

.mpp-breadcrumb-content h1 strong {
    color: #efa514;
}


/* Description */

.mpp-breadcrumb-content > p {
    max-width: 560px;

    margin: 0 0 20px;

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

    font-size: 14px;

    line-height: 1.7;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.mpp-breadcrumb {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 8px;

    padding: 0;
    margin: 0;

    list-style: none;
}

.mpp-breadcrumb li {
    font-size: 14px;
}

.mpp-breadcrumb li a {
    display: flex;

    align-items: center;

    gap: 6px;

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

    transition: color .3s ease;
}

.mpp-breadcrumb li a:hover {
    color: #efa514;
}

.mpp-breadcrumb li a i {
    color: #efa514;

    font-size: 11px;
}

.mpp-breadcrumb-separator {
    color: rgba(255,255,255,.25);

    font-size: 13px !important;
}

.mpp-breadcrumb-separator i {
    font-size: 13px;
}

.mpp-breadcrumb .active {
    color: #fff;

    font-weight: 600;
}


/* =========================================================
   RIGHT VISUAL
========================================================= */

.mpp-breadcrumb-visual {
    position: relative;

    height: 300px;

    display: flex;

    align-items: center;

    justify-content: center;
}


/* =========================================================
   ORBITS
========================================================= */

.mpp-breadcrumb-orbit {
    position: absolute;

    border-radius: 50%;

    border: 1px dashed
        rgba(232,154,11,.25);

    animation:
        mppBreadRotate 18s linear infinite;
}

.orbit-a {
    width: 275px;
    height: 275px;
}

.orbit-b {
    width: 215px;
    height: 215px;

    border-color:
        rgba(255,255,255,.12);

    animation-direction: reverse;

    animation-duration: 12s;
}


/* =========================================================
   MAIN CIRCLE
========================================================= */

.mpp-breadcrumb-main-circle {
    position: relative;

    z-index: 3;

    width: 175px;
    height: 175px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    text-align: center;

    background:
        radial-gradient(
            circle at 35% 25%,
            #1b2b4a,
            #0b192f
        );

    border:
        1px solid rgba(232,154,11,.35);

    box-shadow:
        0 20px 60px rgba(0,0,0,.3),
        0 0 0 12px rgba(232,154,11,.035);
}

.mpp-breadcrumb-rupee {
    width: 45px;
    height: 45px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 8px;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            #f5b82e,
            #d98a00
        );

    color: #fff;

    font-size: 23px;

    font-weight: 800;

    box-shadow:
        0 8px 20px rgba(232,154,11,.25);
}

.mpp-breadcrumb-main-circle span {
    color: rgba(255,255,255,.45);

    font-size: 13px;

    letter-spacing: 2px;

    font-weight: 700;
}

.mpp-breadcrumb-main-circle strong {
    margin-top: 3px;

    color: #fff;

    font-size: 14px;

    letter-spacing: 1px;
}


/* =========================================================
   FLOATING CARDS
========================================================= */

.mpp-bread-float {
    position: absolute;

    z-index: 5;

    display: flex;

    align-items: center;

    gap: 9px;

    padding: 10px 13px;

    border-radius: 9px;

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

    box-shadow:
        0 12px 35px rgba(0,0,0,.18);

    animation:
        mppBreadFloat 4s ease-in-out infinite;
}

.mpp-bread-float > i {
    width: 32px;
    height: 32px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 8px;

    background: #fff5df;

    color: #e9a313;

    font-size: 14px;
}

.mpp-bread-float small {
    display: block;

    color: #9a9faa;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1px;
}

.mpp-bread-float strong {
    display: block;

    margin-top: 2px;

    color: #111a35;

    font-size: 11px;
}

.float-one {
    top: 35px;
    left: 5px;
}

.float-two {
    right: 5px;
    bottom: 35px;

    animation-delay: -1.5s;
}

.float-three {
    right: 55px;
    top: 15px;

    width: 43px;
    height: 43px;

    padding: 0;

    justify-content: center;

    animation-delay: -2.5s;
}

.float-three i {
    width: 100%;
    height: 100%;

    border-radius: 9px;
}


/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes mppBreadRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}

@keyframes mppBreadFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }

}


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

@media (max-width: 991px) {

    .mpp-breadcrumb-wrapper {
        grid-template-columns:
            1fr 320px;

        gap: 20px;
    }

    .mpp-breadcrumb-visual {
        transform: scale(.85);
    }

}


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

@media (max-width: 767px) {

    .mpp-breadcrumb-section {
        min-height: 440px;
    }

    .mpp-breadcrumb-wrapper {
        min-height: 440px;

        display: block;
    }

    .mpp-breadcrumb-content {
        padding: 55px 0 0;

        position: relative;

        z-index: 10;
    }

    .mpp-breadcrumb-content h1 {
        font-size: 38px;
    }

    .mpp-breadcrumb-content > p {
        font-size: 11px;

        max-width: 450px;
    }

    .mpp-breadcrumb-visual {
        position: absolute;

        width: 100%;

        height: 260px;

        left: 0;

        bottom: -45px;

        transform: scale(.72);

        opacity: .95;
    }

}


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

@media (max-width: 480px) {

    .mpp-breadcrumb-section {
        min-height: 425px;
    }

    .mpp-breadcrumb-wrapper {
        min-height: 425px;
    }

    .mpp-breadcrumb-content {
        padding-top: 45px;
    }

    .mpp-breadcrumb-content h1 {
        font-size: 33px;
    }

    .mpp-breadcrumb-content > p {
        max-width: 330px;
    }

    .mpp-breadcrumb-visual {
        bottom: -55px;

        transform: scale(.62);
    }

}
/* =========================================================
   MAX PRIME PAISA
   ABOUT PAGE
========================================================= */

.mpp-about-page-section {

    position: relative;

    padding: 120px 0 110px;

    background: #fff;

    overflow: hidden;

}


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

.mpp-about-page-bg {

    position: absolute;

    width: 700px;
    height: 700px;

    right: -450px;
    top: 80px;

    border-radius: 50%;

    border: 120px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   MAIN GRID
========================================================= */

.mpp-about-page-grid {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 80px;

    align-items: center;

}


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

.mpp-about-page-content h2 {

    margin: 17px 0 20px;

    color: #111a35;

    font-size: clamp(42px,4vw,58px);

    line-height: 1.06;

    letter-spacing: -2px;

    font-weight: 800;

}

.mpp-about-page-content h2 span {

    display: block;

    color: var(--mp-gold);

}


.mpp-about-page-content p {

    max-width: 650px;

    margin: 0 0 15px;

    color: #747b87;

    font-size: 15px;

    line-height: 1.9;

}

.mpp-about-page-content .mpp-about-lead {

    color: #394155;

    font-size: 15px;

    line-height: 1.8;

    font-weight: 500;

}


/* =========================================================
   HIGHLIGHTS
========================================================= */

.mpp-about-highlights {

    display: grid;

    grid-template-columns:
        repeat(3,1fr);

    gap: 10px;

    margin-top: 30px;

}


.mpp-about-highlight {

    padding: 13px;

    display: flex;

    align-items: center;

    gap: 9px;

    border-radius: 10px;

    background: #f8f9fb;

    border: 1px solid #edf0f3;

}


.mpp-about-highlight-icon {

    width: 38px;
    height: 38px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 15px;

}


.mpp-about-highlight strong {

    display: block;

    color: #111a35;

    font-size: 13px;

    font-weight: 800;

}


.mpp-about-highlight span {

    display: block;

    margin-top: 3px;

    color: #9298a2;

    font-size: 12px;

}


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

.mpp-about-primary-btn {

    margin-top: 32px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 13px;

    padding: 15px 22px;

    border-radius: 6px;

    background: #111a35;

    color: #fff;

    font-size: 11px;

    font-weight: 800;

    transition: all .3s ease;

}


.mpp-about-primary-btn:hover {

    color: #fff;

    background: var(--mp-gold);

    transform: translateY(-3px);

    box-shadow:
        0 12px 25px rgba(232,154,11,.2);

}


/* =========================================================
   VISUAL
========================================================= */

.mpp-about-page-visual {

    position: relative;

    min-height: 500px;

    display: flex;

    align-items: center;

    justify-content: center;

}


/* Rings */

.mpp-about-visual-ring {

    position: absolute;

    border-radius: 50%;

    border: 1px dashed
        rgba(232,154,11,.28);

    animation:
        mppAboutRotate 20s linear infinite;

}


.ring-one {

    width: 450px;
    height: 450px;

}


.ring-two {

    width: 330px;
    height: 330px;

    border-color:
        rgba(6,59,145,.14);

    animation-direction: reverse;

    animation-duration: 15s;

}


/* =========================================================
   FINANCE CARD
========================================================= */

.mpp-about-finance-card {

    position: relative;

    z-index: 3;

    width: 420px;

    padding: 30px;

    border-radius: 20px;

    background:
        linear-gradient(
            145deg,
            #111d38,
            #071329
        );

    box-shadow:
        0 30px 70px rgba(9,25,50,.20);

    overflow: hidden;

}


.mpp-about-finance-card::before {

    content: "";

    position: absolute;

    width: 280px;
    height: 280px;

    right: -150px;
    top: -150px;

    border-radius: 50%;

    border: 50px solid
        rgba(232,154,11,.08);

}


/* Card Top */

.mpp-finance-card-top {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: space-between;

}


.mpp-finance-card-top span {

    display: block;

    color: #eaa313;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-finance-card-top strong {

    display: block;

    margin-top: 5px;

    color: #fff;

    font-size: 16px;

}


.mpp-finance-card-logo {

    width: 42px;
    height: 42px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            #f5b52b,
            #d88700
        );

    color: #fff;

    font-size: 20px;

    font-weight: 800;

}


/* =========================================================
   CHART
========================================================= */

.mpp-finance-chart {

    position: relative;

    height: 190px;

    margin-top: 25px;

    overflow: hidden;

}


.mpp-chart-grid {

    position: absolute;

    inset: 0;

    opacity: .25;

    background-image:
        linear-gradient(
            rgba(255,255,255,.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.08) 1px,
            transparent 1px
        );

    background-size:
        50px 38px;

}


.mpp-finance-chart svg {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

}


.mpp-chart-area {

    fill:
        rgba(232,154,11,.08);

}


.mpp-chart-line {

    fill: none;

    stroke: #efa514;

    stroke-width: 3;

    stroke-linecap: round;

}


/* Bottom */

.mpp-finance-card-bottom {

    position: relative;

    padding-top: 20px;

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

    display: flex;

    align-items: center;

    justify-content: space-between;

}


.mpp-finance-card-bottom span {

    display: block;

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

    font-size: 13px;

}


.mpp-finance-card-bottom strong {

    display: block;

    margin-top: 4px;

    color: #fff;

    font-size: 11px;

}


.mpp-finance-card-bottom > i {

    width: 35px;
    height: 35px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: rgba(232,154,11,.1);

    color: #efa514;

    font-size: 14px;

}


/* =========================================================
   TRUST FLOAT
========================================================= */

.mpp-about-trust-card {

    position: absolute;

    z-index: 5;

    left: 0;

    bottom: 70px;

    padding: 13px 16px;

    display: flex;

    align-items: center;

    gap: 10px;

    border-radius: 11px;

    background: #fff;

    box-shadow:
        0 15px 40px rgba(13,31,55,.12);

    animation:
        mppAboutFloat 4s ease-in-out infinite;

}


.mpp-trust-icon {

    width: 38px;
    height: 38px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    background: #fff5df;

    color: var(--mp-gold);

}


.mpp-about-trust-card strong {

    display: block;

    color: #111a35;

    font-size: 13px;

}


.mpp-about-trust-card span {

    display: block;

    margin-top: 3px;

    color: #9298a2;

    font-size: 12px;

}


/* =========================================================
   EXPERIENCE
========================================================= */

.mpp-about-experience {

    position: absolute;

    z-index: 5;

    right: 0;

    top: 70px;

    padding: 16px 18px;

    border-radius: 12px;

    background: var(--mp-gold);

    box-shadow:
        0 15px 35px rgba(232,154,11,.25);

    animation:
        mppAboutFloat 4s ease-in-out infinite;

    animation-delay: -1.5s;

}


.mpp-about-experience strong {

    display: block;

    color: #fff;

    font-size: 25px;

    line-height: 1;

}


.mpp-about-experience span {

    display: block;

    margin-top: 5px;

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

    font-size: 12px;

}


/* =========================================================
   MISSION / VISION
========================================================= */

.mpp-about-purpose {

    position: relative;

    z-index: 2;

    margin-top: 100px;

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 20px;

}


.mpp-purpose-card {

    padding: 30px;

    display: flex;

    align-items: flex-start;

    gap: 18px;

    border-radius: 16px;

    background: #f7f9fc;

    border: 1px solid #e8ecf1;

    transition: all .3s ease;

}


.mpp-purpose-card:hover {

    transform: translateY(-5px);

    background: #fff;

    box-shadow:
        0 20px 45px rgba(13,31,55,.08);

}


.mpp-purpose-icon {

    width: 52px;
    height: 52px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 13px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 20px;

}


.mpp-purpose-card span {

    color: var(--mp-gold);

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-purpose-card h3 {

    margin: 7px 0 9px;

    color: #111a35;

    font-size: 17px;

    font-weight: 800;

}


.mpp-purpose-card p {

    margin: 0;

    color: #7a818d;

    font-size: 14px;

    line-height: 1.8;

}


/* =========================================================
   VALUES
========================================================= */

.mpp-about-values {

    position: relative;

    z-index: 2;

    margin-top: 100px;

}


.mpp-values-heading h2 {

    margin: 15px 0 40px;

    color: #111a35;

    font-size: 42px;

    line-height: 1.1;

    font-weight: 800;

    letter-spacing: -1px;

}


.mpp-values-heading h2 span {

    color: var(--mp-gold);

}


.mpp-values-grid {

    display: grid;

    grid-template-columns:
        repeat(4,1fr);

    gap: 15px;

}


.mpp-value-card {

    position: relative;

    padding: 27px;

    min-height: 220px;

    border-radius: 15px;

    background: #fff;

    border: 1px solid #e8ecf1;

    overflow: hidden;

    transition: all .35s ease;

}


.mpp-value-card:hover {

    transform: translateY(-7px);

    box-shadow:
        0 20px 45px rgba(13,31,55,.09);

    border-color:
        rgba(232,154,11,.25);

}


.mpp-value-card > span {

    position: absolute;

    right: 20px;
    top: 17px;

    color: #e5e8ec;

    font-size: 24px;

    font-weight: 800;

}


.mpp-value-icon {

    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 12px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 20px;

}


.mpp-value-card h3 {

    margin: 20px 0 8px;

    color: #111a35;

    font-size: 15px;

    font-weight: 800;

}


.mpp-value-card p {

    margin: 0;

    color: #7b828e;

    font-size: 14px;

    line-height: 1.8;

}


/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes mppAboutRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


@keyframes mppAboutFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }

}


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

@media (max-width: 1100px) {

    .mpp-about-page-grid {

        gap: 45px;

    }

    .mpp-about-highlights {

        grid-template-columns: 1fr;

    }

    .mpp-about-finance-card {

        width: 380px;

    }

    .mpp-values-grid {

        grid-template-columns:
            1fr 1fr;

    }

}


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

@media (max-width: 991px) {

    .mpp-about-page-section {

        padding: 90px 0;

    }

    .mpp-about-page-grid {

        grid-template-columns: 1fr;

    }

    .mpp-about-page-visual {

        min-height: 480px;

    }

    .mpp-about-highlights {

        grid-template-columns:
            repeat(3,1fr);

    }

    .mpp-about-purpose {

        margin-top: 70px;

    }

}


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

@media (max-width: 767px) {

    .mpp-about-page-section {

        padding: 75px 0;

    }

    .mpp-about-page-content h2 {

        font-size: 38px;

        letter-spacing: -1px;

    }

    .mpp-about-page-content .mpp-about-lead {

        font-size: 14px;

    }

    .mpp-about-highlights {

        grid-template-columns: 1fr;

    }

    .mpp-about-page-visual {

        min-height: 400px;

    }

    .mpp-about-finance-card {

        width: 100%;

        max-width: 420px;

    }

    .mpp-about-visual-ring {

        transform: scale(.8);

    }

    .mpp-about-trust-card {

        left: 0;

        bottom: 20px;

    }

    .mpp-about-experience {

        right: 0;

        top: 25px;

    }

    .mpp-about-purpose {

        grid-template-columns: 1fr;

        margin-top: 60px;

    }

    .mpp-about-values {

        margin-top: 70px;

    }

    .mpp-values-heading h2 {

        font-size: 35px;

    }

    .mpp-values-grid {

        grid-template-columns: 1fr;

    }

}


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

@media (max-width: 480px) {

    .mpp-about-page-content h2 {

        font-size: 33px;

    }

    .mpp-about-page-visual {

        min-height: 360px;

    }

    .mpp-about-finance-card {

        padding: 22px;

    }

    .mpp-finance-chart {

        height: 150px;

    }

    .mpp-about-trust-card {

        transform: scale(.85);

        transform-origin: left bottom;

    }

    .mpp-about-experience {

        transform: scale(.85);

        transform-origin: right top;

    }

}
/* =========================================================
   MAX PRIME PAISA
   VISION MISSION VALUES
========================================================= */

.mpp-vmv-section {

    position: relative;

    padding: 120px 0 110px;

    background: #f7f9fc;

    overflow: hidden;

}


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

.mpp-vmv-bg {

    position: absolute;

    width: 700px;
    height: 700px;

    left: -450px;
    top: 50px;

    border-radius: 50%;

    border: 120px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADING
========================================================= */

.mpp-vmv-heading {

    position: relative;

    z-index: 2;

    max-width: 760px;

    margin: 0 auto 70px;

}


.mpp-vmv-heading h2 {

    margin: 15px 0 0;

    color: #111a35;

    font-size: clamp(40px,4vw,56px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -2px;

}


.mpp-vmv-heading h2 span {

    display: block;

    color: var(--mp-gold);

}


.mpp-vmv-heading p {

    max-width: 650px;

    margin: 20px auto 0;

    color: #737a87;

    font-size: 14px;

    line-height: 1.8;

}


/* =========================================================
   MAIN WRAPPER
========================================================= */

.mpp-vmv-wrapper {

    position: relative;

    z-index: 2;

    max-width: 1050px;

    margin: auto;

    display: grid;

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

    gap: 18px;

}


/* =========================================================
   CONNECTING LINE
========================================================= */

.mpp-vmv-line {

    position: absolute;

    left: 16.66%;

    right: 16.66%;

    top: 45px;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(232,154,11,.45),
            transparent
        );

}


.mpp-vmv-line span {

    position: absolute;

    top: -4px;

    width: 9px;
    height: 9px;

    border-radius: 50%;

    background: var(--mp-gold);

    box-shadow:
        0 0 0 5px rgba(232,154,11,.1);

}


.mpp-vmv-line span:nth-child(1) {
    left: 0;
}

.mpp-vmv-line span:nth-child(2) {
    left: 50%;
}

.mpp-vmv-line span:nth-child(3) {
    right: 0;
}


/* =========================================================
   CARD
========================================================= */

.mpp-vmv-card {

    position: relative;

    min-height: 440px;

    padding: 35px 28px 30px;

    border-radius: 18px;

    background: #fff;

    border: 1px solid #e7ebf0;

    box-shadow:
        0 18px 50px rgba(13,31,55,.055);

    overflow: hidden;

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

}


.mpp-vmv-card::before {

    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    right: -90px;
    bottom: -90px;

    border-radius: 50%;

    background:
        rgba(232,154,11,.05);

}


.mpp-vmv-card:hover {

    transform: translateY(-8px);

    border-color:
        rgba(232,154,11,.25);

    box-shadow:
        0 25px 60px rgba(13,31,55,.10);

}


/* =========================================================
   NUMBER
========================================================= */

.mpp-vmv-number {

    position: absolute;

    top: 20px;

    right: 23px;

    color: #e8ebef;

    font-size: 30px;

    font-weight: 800;

    line-height: 1;

}


/* =========================================================
   ICON
========================================================= */

.mpp-vmv-icon {

    position: relative;

    z-index: 2;

    width: 65px;
    height: 65px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 16px;

    background:
        linear-gradient(
            135deg,
            #fff5df,
            #fffaf0
        );

    color: var(--mp-gold);

    font-size: 26px;

    box-shadow:
        0 10px 25px rgba(232,154,11,.08);

    transition: all .35s ease;

}


.mpp-vmv-card:hover .mpp-vmv-icon {

    color: #fff;

    background: var(--mp-gold);

    transform:
        translateY(-3px)
        rotate(-4deg);

}


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

.mpp-vmv-content {

    position: relative;

    z-index: 2;

    margin-top: 55px;

}


.mpp-vmv-content > span {

    color: var(--mp-gold);

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.7px;

}


.mpp-vmv-content h3 {

    margin: 10px 0 17px;

    color: #111a35;

    font-size: 23px;

    line-height: 1.25;

    font-weight: 800;

}


.mpp-vmv-content h3 strong {

    display: block;

    color: var(--mp-gold);

}


.mpp-vmv-content p {

    margin: 0;

    color: #777e8a;

    font-size: 11px;

    line-height: 1.9;

}


/* =========================================================
   ARROW
========================================================= */

.mpp-vmv-arrow {

    position: absolute;

    z-index: 3;

    left: 28px;

    bottom: 28px;

    width: 38px;
    height: 38px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #f7f9fc;

    color: #9ba1ab;

    font-size: 15px;

    transition: all .3s ease;

}


.mpp-vmv-card:hover .mpp-vmv-arrow {

    color: #fff;

    background: var(--mp-gold);

    transform:
        translate(3px,-3px);

}


/* =========================================================
   DIFFERENT CARD ACCENTS
========================================================= */

.mpp-vmv-vision {

    border-top:
        3px solid #e9a313;

}


.mpp-vmv-mission {

    border-top:
        3px solid #111a35;

}


.mpp-vmv-values {

    border-top:
        3px solid #d58d06;

}


/* =========================================================
   VALUES STRIP
========================================================= */

.mpp-values-strip {

    position: relative;

    z-index: 2;

    margin-top: 35px;

    padding: 18px;

    display: grid;

    grid-template-columns:
        repeat(5,1fr);

    background: #111a35;

    border-radius: 15px;

    box-shadow:
        0 20px 50px rgba(10,25,50,.12);

}


.mpp-value-mini {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

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

}


.mpp-value-mini:last-child {

    border-right: 0;

}


.mpp-value-mini-icon {

    width: 38px;
    height: 38px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    background:
        rgba(232,154,11,.1);

    color: #efa514;

    font-size: 15px;

}


.mpp-value-mini strong {

    display: block;

    color: #fff;

    font-size: 13px;

    font-weight: 800;

}


.mpp-value-mini span {

    display: block;

    margin-top: 3px;

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

    font-size: 12px;

}


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

.mpp-vmv-statement {

    position: relative;

    z-index: 2;

    margin-top: 55px;

    padding: 25px 30px;

    display: flex;

    align-items: center;

    gap: 18px;

    background: #fff;

    border: 1px solid #e8ecf1;

    border-radius: 14px;

}


.mpp-statement-icon {

    width: 48px;
    height: 48px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 12px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 22px;

}


.mpp-vmv-statement span {

    display: block;

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-vmv-statement h3 {

    margin: 5px 0 0;

    color: #111a35;

    font-size: 18px;

    font-weight: 800;

}


.mpp-vmv-statement h3 strong {

    color: var(--mp-gold);

}


.mpp-statement-line {

    flex: 1;

    height: 1px;

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

}


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

@media (max-width: 991px) {

    .mpp-vmv-section {

        padding: 90px 0;

    }

    .mpp-vmv-wrapper {

        grid-template-columns:
            1fr 1fr;

    }

    .mpp-vmv-values {

        grid-column:
            1 / -1;

        min-height: auto;

    }

    .mpp-values-strip {

        grid-template-columns:
            repeat(3,1fr);

        gap: 15px;

    }

    .mpp-value-mini {

        border-right: 0;

    }

    .mpp-value-mini:nth-child(4),
    .mpp-value-mini:nth-child(5) {

        margin-top: 10px;

    }

    .mpp-vmv-line {

        display: none;

    }

}


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

@media (max-width: 767px) {

    .mpp-vmv-section {

        padding: 75px 0;

    }

    .mpp-vmv-heading {

        margin-bottom: 50px;

    }

    .mpp-vmv-heading h2 {

        font-size: 38px;

        letter-spacing: -1px;

    }

    .mpp-vmv-heading p {

        font-size: 15px;

    }

    .mpp-vmv-wrapper {

        grid-template-columns: 1fr;

        gap: 15px;

    }

    .mpp-vmv-card {

        min-height: 350px;

    }

    .mpp-vmv-values {

        grid-column: auto;

    }

    .mpp-values-strip {

        grid-template-columns: 1fr;

        padding: 10px;

    }

    .mpp-value-mini {

        justify-content: flex-start;

        padding: 12px;

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

    }

    .mpp-value-mini:last-child {

        border-bottom: 0;

    }

    .mpp-vmv-statement {

        padding: 20px;

    }

    .mpp-statement-line {

        display: none;

    }

}


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

@media (max-width: 480px) {

    .mpp-vmv-heading h2 {

        font-size: 33px;

    }

    .mpp-vmv-card {

        padding: 28px 23px;

    }

    .mpp-vmv-content h3 {

        font-size: 21px;

    }

    .mpp-vmv-content p {

        font-size: 14px;

    }

}
/* =========================================================
   MAX PRIME PAISA
   SERVICES SECTION
========================================================= */

.mpp-services-section {

    position: relative;

    padding: 120px 0 110px;

    background: #ffffff;

    overflow: hidden;

}


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

.mpp-services-bg {

    position: absolute;

    width: 650px;
    height: 650px;

    right: -400px;
    top: -150px;

    border-radius: 50%;

    border: 100px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADING
========================================================= */

.mpp-services-heading {

    position: relative;

    z-index: 2;

    max-width: 760px;

    margin: 0 auto 60px;

}


.mpp-services-heading h2 {

    margin: 15px 0 0;

    color: #111a35;

    font-size: clamp(40px,4vw,56px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -2px;

}


.mpp-services-heading h2 span {

    display: block;

    color: var(--mp-gold);

}


.mpp-services-heading p {

    max-width: 650px;

    margin: 20px auto 0;

    color: #737a87;

    font-size: 14px;

    line-height: 1.8;

}


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

.mpp-services-grid {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        repeat(3,1fr);

    gap: 18px;

}


/* =========================================================
   SERVICE CARD
========================================================= */

.mpp-service-card {

    position: relative;

    min-height: 350px;

    padding: 27px;

    display: flex;

    flex-direction: column;

    overflow: hidden;

    border-radius: 17px;

    background: #ffffff;

    border: 1px solid #e8ecf1;

    box-shadow:
        0 12px 35px rgba(13,31,55,.045);

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

}


.mpp-service-card:hover {

    transform: translateY(-8px);

    border-color:
        rgba(232,154,11,.3);

    box-shadow:
        0 25px 55px rgba(13,31,55,.10);

}


/* =========================================================
   CARD TOP
========================================================= */

.mpp-service-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

}


.mpp-service-icon {

    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 15px;

    background:
        linear-gradient(
            135deg,
            #fff5df,
            #fffaf0
        );

    color: var(--mp-gold);

    font-size: 24px;

    transition: all .35s ease;

}


.mpp-service-card:hover .mpp-service-icon {

    color: #ffffff;

    background: var(--mp-gold);

    transform:
        rotate(-5deg)
        translateY(-2px);

}


.mpp-service-number {

    color: #e4e7eb;

    font-size: 25px;

    line-height: 1;

    font-weight: 800;

}


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

.mpp-service-content {

    position: relative;

    z-index: 2;

    margin-top: 45px;

}


.mpp-service-label {

    display: block;

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.4px;

}


.mpp-service-content h3 {

    margin: 8px 0 12px;

    color: #111a35;

    font-size: 25px;

    font-weight: 800;

}


.mpp-service-content p {

    margin: 0;

    color: #7b828d;

    font-size: 14px;

    line-height: 1.8;

}


/* =========================================================
   SERVICE LINK
========================================================= */

.mpp-service-link {

    position: relative;

    z-index: 3;

    margin-top: auto;

    padding-top: 22px;

    display: flex;

    align-items: center;

    gap: 8px;

    color: #111a35;

    font-size: 13px;

    font-weight: 800;

    transition: all .3s ease;

}


.mpp-service-link i {

    color: var(--mp-gold);

    transition: transform .3s ease;

}


.mpp-service-link:hover {

    color: var(--mp-gold);

}


.mpp-service-link:hover i {

    transform:
        translate(3px,-3px);

}


/* =========================================================
   WATERMARK NUMBER
========================================================= */

.mpp-service-watermark {

    position: absolute;

    right: -15px;

    bottom: -40px;

    color: rgba(232,154,11,.035);

    font-size: 150px;

    line-height: 1;

    font-weight: 900;

    pointer-events: none;

}


/* =========================================================
   FEATURED PERSONAL LOAN
========================================================= */

.mpp-service-featured {

    background:
        linear-gradient(
            145deg,
            #111d38,
            #071329
        );

    border-color: transparent;

}


.mpp-service-featured .mpp-service-content h3 {

    color: #ffffff;

}


.mpp-service-featured .mpp-service-content p {

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

}


.mpp-service-featured .mpp-service-link {

    color: #ffffff;

}


.mpp-service-featured .mpp-service-number {

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

}


.mpp-service-featured .mpp-service-watermark {

    color: rgba(232,154,11,.045);

}


.mpp-service-featured:hover {

    border-color:
        rgba(232,154,11,.3);

}


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

.mpp-services-bottom {

    position: relative;

    z-index: 2;

    margin-top: 30px;

    padding: 20px 25px;

    display: flex;

    align-items: center;

    gap: 15px;

    border-radius: 13px;

    background: #f7f9fc;

    border: 1px solid #e8ecf1;

}


.mpp-services-bottom-icon {

    width: 45px;
    height: 45px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 18px;

}


.mpp-services-bottom strong {

    display: block;

    color: #111a35;

    font-size: 11px;

}


.mpp-services-bottom span {

    display: block;

    margin-top: 4px;

    color: #858b96;

    font-size: 13px;

}


.mpp-services-bottom a {

    margin-left: auto;

    min-width: 120px;

    padding: 13px 16px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    border-radius: 6px;

    background: #111a35;

    color: #ffffff;

    font-size: 13px;

    font-weight: 800;

    transition: all .3s ease;

}


.mpp-services-bottom a:hover {

    background: var(--mp-gold);

    color: #ffffff;

    transform: translateY(-2px);

}


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

@media (max-width: 991px) {

    .mpp-services-section {

        padding: 90px 0;

    }

    .mpp-services-grid {

        grid-template-columns:
            repeat(2,1fr);

    }

    .mpp-service-featured {

        grid-column: 1 / -1;

    }

}


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

@media (max-width: 767px) {

    .mpp-services-section {

        padding: 75px 0;

    }

    .mpp-services-heading {

        margin-bottom: 45px;

    }

    .mpp-services-heading h2 {

        font-size: 38px;

        letter-spacing: -1px;

    }

    .mpp-services-heading p {

        font-size: 15px;

    }

    .mpp-services-grid {

        grid-template-columns: 1fr;

    }

    .mpp-service-featured {

        grid-column: auto;

    }

    .mpp-service-card {

        min-height: 320px;

    }

    .mpp-services-bottom {

        align-items: flex-start;

        flex-wrap: wrap;

    }

    .mpp-services-bottom a {

        width: 100%;

        margin-left: 0;

        margin-top: 5px;

    }

}


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

@media (max-width: 480px) {

    .mpp-services-heading h2 {

        font-size: 33px;

    }

    .mpp-service-card {

        padding: 23px;

    }

}
/* =========================================================
   MAX PRIME PAISA
   HOW IT WORKS
========================================================= */

.mpp-how-section {

    position: relative;

    padding: 120px 0 110px;

    background: #f7f9fc;

    overflow: hidden;

}


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

.mpp-how-bg {

    position: absolute;

    width: 650px;
    height: 650px;

    left: -400px;
    bottom: -300px;

    border-radius: 50%;

    border: 100px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADING
========================================================= */

.mpp-how-heading {

    position: relative;

    z-index: 2;

    max-width: 750px;

    margin: 0 auto 75px;

}


.mpp-how-heading h2 {

    margin: 15px 0 0;

    color: #111a35;

    font-size: clamp(40px,4vw,56px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -2px;

}


.mpp-how-heading h2 span {

    display: block;

    color: var(--mp-gold);

}


.mpp-how-heading p {

    max-width: 620px;

    margin: 20px auto 0;

    color: #737a87;

    font-size: 14px;

    line-height: 1.8;

}


/* =========================================================
   PROCESS
========================================================= */

.mpp-how-process {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        repeat(5,1fr);

    gap: 18px;

}


/* =========================================================
   CONNECTING LINE
========================================================= */

.mpp-how-line {

    position: absolute;

    left: 9%;

    right: 9%;

    top: 39px;

    height: 2px;

    background: #e2e6eb;

}


.mpp-how-line-progress {

    width: 100%;

    height: 100%;

    background:
        linear-gradient(
            90deg,
            #e5a014,
            #e5a014,
            #d78c00
        );

}


/* =========================================================
   STEP
========================================================= */

.mpp-how-step {

    position: relative;

    z-index: 2;

    text-align: center;

}


.mpp-how-number {

    position: absolute;

    top: -18px;

    right: 20px;

    color: #e3e7eb;

    font-size: 25px;

    font-weight: 900;

    line-height: 1;

}


/* =========================================================
   ICON
========================================================= */

.mpp-how-icon {

    position: relative;

    z-index: 3;

    width: 78px;
    height: 78px;

    margin: 0 auto;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #fff;

    border: 7px solid #f7f9fc;

    outline: 1px solid
        rgba(232,154,11,.25);

    color: var(--mp-gold);

    font-size: 25px;

    box-shadow:
        0 12px 30px rgba(13,31,55,.08);

    transition: all .35s ease;

}


.mpp-how-step:hover .mpp-how-icon {

    color: #fff;

    background: var(--mp-gold);

    transform:
        translateY(-5px)
        scale(1.05);

    box-shadow:
        0 15px 35px rgba(232,154,11,.25);

}


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

.mpp-how-content {

    margin-top: 30px;

    padding: 0 5px;

}


.mpp-how-content > span {

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-how-content h3 {

    margin: 8px 0 10px;

    color: #111a35;

    font-size: 16px;

    font-weight: 800;

}


.mpp-how-content p {

    margin: 0;

    color: #7c838e;

    font-size: 13px;

    line-height: 1.8;

}


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

.mpp-how-bottom {

    position: relative;

    z-index: 2;

    margin-top: 55px;

    padding: 22px 25px;

    display: flex;

    align-items: center;

    gap: 15px;

    border-radius: 14px;

    background: #fff;

    border: 1px solid #e7ebf0;

    box-shadow:
        0 15px 40px rgba(13,31,55,.05);

}


.mpp-how-bottom-icon {

    width: 45px;
    height: 45px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 18px;

}


.mpp-how-bottom strong {

    display: block;

    color: #111a35;

    font-size: 11px;

}


.mpp-how-bottom span {

    display: block;

    margin-top: 4px;

    color: #858b96;

    font-size: 13px;

}


.mpp-how-bottom a {

    margin-left: auto;

    min-width: 160px;

    padding: 14px 17px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    border-radius: 6px;

    background: #111a35;

    color: #fff;

    font-size: 13px;

    font-weight: 800;

    transition: all .3s ease;

}


.mpp-how-bottom a:hover {

    background: var(--mp-gold);

    color: #fff;

    transform: translateY(-2px);

}


/* =========================================================
   DISCLAIMER
========================================================= */

.mpp-how-disclaimer {

    position: relative;

    z-index: 2;

    margin-top: 20px;

    display: flex;

    align-items: flex-start;

    gap: 8px;

    color: #8a9099;

}


.mpp-how-disclaimer i {

    margin-top: 2px;

    color: var(--mp-gold);

    font-size: 14px;

}


.mpp-how-disclaimer span {

    font-size: 13px;

    line-height: 1.7;

}


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

@media (max-width: 991px) {

    .mpp-how-section {

        padding: 90px 0;

    }

    .mpp-how-process {

        grid-template-columns:
            repeat(3,1fr);

        row-gap: 55px;

    }

    .mpp-how-line {

        display: none;

    }

    .mpp-how-bottom {

        flex-wrap: wrap;

    }

    .mpp-how-bottom a {

        margin-left: 0;

    }

}


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

@media (max-width: 767px) {

    .mpp-how-section {

        padding: 75px 0;

    }

    .mpp-how-heading {

        margin-bottom: 50px;

    }

    .mpp-how-heading h2 {

        font-size: 38px;

        letter-spacing: -1px;

    }

    .mpp-how-heading p {

        font-size: 15px;

    }

    .mpp-how-process {

        grid-template-columns: 1fr;

        gap: 15px;

    }

    .mpp-how-step {

        min-height: 150px;

        padding: 25px 20px 25px 95px;

        text-align: left;

        background: #fff;

        border: 1px solid #e8ecf1;

        border-radius: 14px;

    }

    .mpp-how-icon {

        position: absolute;

        left: 20px;

        top: 30px;

        width: 60px;
        height: 60px;

        font-size: 20px;

    }

    .mpp-how-number {

        top: 15px;

        right: 15px;

        font-size: 20px;

    }

    .mpp-how-content {

        margin-top: 0;

    }

    .mpp-how-content h3 {

        font-size: 15px;

    }

    .mpp-how-content p {

        font-size: 13px;

        max-width: 400px;

    }

    .mpp-how-bottom {

        align-items: flex-start;

    }

    .mpp-how-bottom a {

        width: 100%;

        margin-top: 5px;

    }

}


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

@media (max-width: 480px) {

    .mpp-how-heading h2 {

        font-size: 33px;

    }

    .mpp-how-step {

        padding-left: 88px;

    }

}
/* =========================================================
   MAX PRIME PAISA
   FAQ SECTION
========================================================= */

.mpp-faq-section {

    position: relative;

    padding: 120px 0 110px;

    background: #ffffff;

    overflow: hidden;

}


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

.mpp-faq-bg {

    position: absolute;

    width: 650px;
    height: 650px;

    left: -430px;
    top: -180px;

    border-radius: 50%;

    border: 100px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADING
========================================================= */

.mpp-faq-heading {

    position: relative;

    z-index: 2;

    max-width: 780px;

    margin-bottom: 60px;

}


.mpp-faq-heading h2 {

    margin: 15px 0 0;

    color: #111a35;

    font-size: clamp(40px,4vw,55px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -2px;

}


.mpp-faq-heading h2 span {

    display: block;

    color: var(--mp-gold);

}


.mpp-faq-heading p {

    max-width: 650px;

    margin: 18px 0 0;

    color: #777e89;

    font-size: 15px;

    line-height: 1.8;

}


/* =========================================================
   FAQ ACCORDION
========================================================= */

.mpp-faq-accordion {

    position: relative;

    z-index: 2;

}


.mpp-faq-item {

    margin-bottom: 10px;

    overflow: hidden;

    border: 1px solid #e7ebf0;

    border-radius: 10px;

    background: #fff;

    transition:
        border-color .3s ease,
        box-shadow .3s ease;

}


.mpp-faq-item:has(
    .accordion-button:not(.collapsed)
) {

    border-color:
        rgba(232,154,11,.28);

    box-shadow:
        0 10px 30px rgba(13,31,55,.045);

}


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

.mpp-faq-item .accordion-button {

    position: relative;

    min-height: 65px;

    padding: 15px 50px 15px 18px;

    display: flex;

    align-items: center;

    gap: 14px;

    color: #111a35;

    background: #fff;

    box-shadow: none;

    font-size: 11px;

    font-weight: 700;

}


.mpp-faq-item .accordion-button:not(.collapsed) {

    color: #111a35;

    background:
        linear-gradient(
            90deg,
            #fffaf0,
            #fff
        );

}


.mpp-faq-item .accordion-button::after {

    width: 28px;
    height: 28px;

    margin: 0;

    position: absolute;

    right: 15px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background-color: #f7f9fc;

    background-size: 11px;

}


.mpp-faq-item .accordion-button:not(.collapsed)::after {

    background-color: #fff2d4;

}


/* =========================================================
   FAQ NUMBER
========================================================= */

.mpp-faq-number {

    width: 32px;
    height: 32px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 8px;

    color: #a4a9b1;

    background: #f7f9fc;

    font-size: 13px;

    font-weight: 800;

}


.mpp-faq-item
.accordion-button:not(.collapsed)
.mpp-faq-number {

    color: #fff;

    background: var(--mp-gold);

}


/* =========================================================
   ANSWER
========================================================= */

.mpp-faq-item .accordion-body {

    padding: 0 55px 20px 64px;

    color: #777e89;

    font-size: 14px;

    line-height: 1.9;

}


/* =========================================================
   SIDE CARD
========================================================= */

.mpp-faq-side {

    position: relative;

    z-index: 2;

    min-height: 500px;

    padding: 35px;

    overflow: hidden;

    border-radius: 20px;

    background:
        linear-gradient(
            145deg,
            #111d38,
            #071329
        );

    box-shadow:
        0 25px 60px rgba(9,25,50,.15);

}


.mpp-faq-side::before {

    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    right: -170px;
    top: -170px;

    border-radius: 50%;

    border: 50px solid
        rgba(232,154,11,.08);

}


.mpp-faq-side::after {

    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    left: -110px;
    bottom: -100px;

    border-radius: 50%;

    background:
        rgba(232,154,11,.045);

}


/* =========================================================
   SIDE ICON
========================================================= */

.mpp-faq-side-icon {

    position: relative;

    z-index: 2;

    width: 60px;
    height: 60px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 15px;

    background:
        rgba(232,154,11,.12);

    color: #f0a414;

    font-size: 23px;

}


.mpp-faq-side-label {

    position: relative;

    z-index: 2;

    display: block;

    margin-top: 28px;

    color: #eaa313;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-faq-side h3 {

    position: relative;

    z-index: 2;

    margin: 9px 0 15px;

    color: #fff;

    font-size: 30px;

    line-height: 1.2;

    font-weight: 800;

}


.mpp-faq-side h3 strong {

    display: block;

    color: #efa514;

}


.mpp-faq-side > p {

    position: relative;

    z-index: 2;

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

    font-size: 14px;

    line-height: 1.9;

}


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

.mpp-faq-contact-btn {

    position: relative;

    z-index: 2;

    margin-top: 20px;

    padding: 14px 18px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    border-radius: 6px;

    background: #eaa313;

    color: #fff;

    font-size: 13px;

    font-weight: 800;

    transition: all .3s ease;

}


.mpp-faq-contact-btn:hover {

    color: #fff;

    background: #d58d06;

    transform: translateY(-3px);

    box-shadow:
        0 12px 25px rgba(232,154,11,.25);

}


/* =========================================================
   DIVIDER
========================================================= */

.mpp-faq-side-divider {

    position: relative;

    z-index: 2;

    height: 1px;

    margin: 28px 0 20px;

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

}


/* =========================================================
   SIDE POINTS
========================================================= */

.mpp-faq-side-points {

    position: relative;

    z-index: 2;

}


.mpp-faq-side-points > div {

    display: flex;

    align-items: center;

    gap: 9px;

    margin-bottom: 12px;

}


.mpp-faq-side-points i {

    color: #eaa313;

    font-size: 14px;

}


.mpp-faq-side-points span {

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

    font-size: 13px;

}


/* =========================================================
   QUOTE
========================================================= */

.mpp-faq-quote {

    position: absolute;

    z-index: 2;

    left: 35px;

    right: 35px;

    bottom: 25px;

    padding-top: 18px;

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

    display: flex;

    align-items: center;

    gap: 9px;

}


.mpp-faq-quote i {

    color: #eaa313;

    font-size: 20px;

}


.mpp-faq-quote span {

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

    font-size: 13px;

}


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

@media (max-width: 991px) {

    .mpp-faq-section {

        padding: 90px 0;

    }

    .mpp-faq-side {

        min-height: auto;

    }

    .mpp-faq-quote {

        position: relative;

        left: auto;
        right: auto;
        bottom: auto;

        margin-top: 30px;

    }

}


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

@media (max-width: 767px) {

    .mpp-faq-section {

        padding: 75px 0;

    }

    .mpp-faq-heading {

        margin-bottom: 40px;

    }

    .mpp-faq-heading h2 {

        font-size: 38px;

        letter-spacing: -1px;

    }

    .mpp-faq-heading p {

        font-size: 14px;

    }

    .mpp-faq-item .accordion-button {

        min-height: 60px;

        padding-left: 13px;

        font-size: 14px;

    }

    .mpp-faq-number {

        width: 29px;
        height: 29px;

        font-size: 12px;

    }

    .mpp-faq-item .accordion-body {

        padding:
            0 45px 18px 55px;

        font-size: 13px;

    }

    .mpp-faq-side {

        margin-top: 15px;

        padding: 28px;

    }

}


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

@media (max-width: 480px) {

    .mpp-faq-heading h2 {

        font-size: 33px;

    }

    .mpp-faq-side h3 {

        font-size: 27px;

    }

}
/* =========================================================
   MAX PRIME PAISA
   CONTACT US
========================================================= */

.mpp-contact-section {

    position: relative;

    padding: 120px 0 110px;

    background: #f7f9fc;

    overflow: hidden;

}


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

.mpp-contact-bg {

    position: absolute;

    width: 700px;
    height: 700px;

    right: -450px;
    top: -220px;

    border-radius: 50%;

    border: 120px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADING
========================================================= */

.mpp-contact-heading {

    position: relative;

    z-index: 2;

    max-width: 780px;

    margin-bottom: 60px;

}


.mpp-contact-heading h2 {

    margin: 15px 0 0;

    color: #111a35;

    font-size: clamp(40px,4vw,56px);

    line-height: 1.08;

    letter-spacing: -2px;

    font-weight: 800;

}


.mpp-contact-heading h2 span {

    display: block;

    color: var(--mp-gold);

}


.mpp-contact-heading p {

    max-width: 620px;

    margin: 18px 0 0;

    color: #777e89;

    font-size: 15px;

    line-height: 1.8;

}


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

.mpp-contact-grid {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        .9fr 1.1fr;

    gap: 55px;

    align-items: stretch;

}


/* =========================================================
   LEFT INFO
========================================================= */

.mpp-contact-info {

    padding: 35px 0;

}


.mpp-contact-intro > span {

    color: var(--mp-gold);

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.6px;

}


.mpp-contact-intro h3 {

    max-width: 470px;

    margin: 12px 0 15px;

    color: #111a35;

    font-size: 32px;

    line-height: 1.2;

    font-weight: 800;

}


.mpp-contact-intro h3 strong {

    display: block;

    color: var(--mp-gold);

}


.mpp-contact-intro p {

    max-width: 520px;

    margin: 0;

    color: #777e89;

    font-size: 11px;

    line-height: 1.9;

}


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

.mpp-contact-details {

    margin-top: 35px;

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 18px;

}


.mpp-contact-detail {

    display: flex;

    align-items: flex-start;

    gap: 11px;

}


.mpp-contact-detail-icon {

    width: 40px;
    height: 40px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 15px;

}


.mpp-contact-detail span {

    display: block;

    color: #a1a6ae;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1px;

}


.mpp-contact-detail strong {

    display: block;

    margin-top: 3px;

    color: #111a35;

    font-size: 13px;

    font-weight: 800;

}


.mpp-contact-detail p,
.mpp-contact-detail a {

    display: block;

    margin: 4px 0 0;

    color: #777e89;

    font-size: 13px;

    line-height: 1.65;

}


.mpp-contact-detail a:hover {

    color: var(--mp-gold);

}


/* =========================================================
   TRUST
========================================================= */

.mpp-contact-trust {

    margin-top: 30px;

    padding: 15px;

    display: flex;

    align-items: center;

    gap: 11px;

    border-radius: 11px;

    background: #fff;

    border: 1px solid #e7ebf0;

}


.mpp-contact-trust-icon {

    width: 40px;
    height: 40px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    background: #111a35;

    color: #f0a414;

    font-size: 15px;

}


.mpp-contact-trust strong {

    display: block;

    color: #111a35;

    font-size: 13px;

}


.mpp-contact-trust span {

    display: block;

    margin-top: 3px;

    color: #858b95;

    font-size: 13px;

}


/* =========================================================
   FORM CARD
========================================================= */

.mpp-contact-form-card {

    position: relative;

    padding: 35px;

    border-radius: 20px;

    background: #fff;

    border: 1px solid #e7ebf0;

    box-shadow:
        0 25px 60px rgba(13,31,55,.08);

}


.mpp-contact-form-head {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 25px;

}


.mpp-contact-form-head > div:first-child span {

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-contact-form-head h3 {

    margin: 7px 0 0;

    color: #111a35;

    font-size: 25px;

    font-weight: 800;

}


.mpp-contact-form-head h3 strong {

    color: var(--mp-gold);

}


.mpp-form-icon {

    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 12px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 17px;

}


/* =========================================================
   FORM GROUP
========================================================= */

.mpp-form-group {

    margin-bottom: 17px;

}


.mpp-form-group label {

    display: block;

    margin-bottom: 6px;

    color: #32394b;

    font-size: 13px;

    font-weight: 800;

}


.mpp-input-wrap {

    position: relative;

}


.mpp-input-wrap > i {

    position: absolute;

    left: 13px;

    top: 50%;

    z-index: 2;

    transform: translateY(-50%);

    color: #b0b5bd;

    font-size: 14px;

    pointer-events: none;

}


.mpp-input-wrap .form-control {

    min-height: 45px;

    padding: 10px 13px 10px 37px;

    border: 1px solid #e2e6eb;

    border-radius: 7px;

    background: #fafbfc;

    color: #20283c;

    box-shadow: none;

    font-size: 14px;

    transition: all .25s ease;

}


.mpp-input-wrap .form-control::placeholder {

    color: #b0b5bd;

}


.mpp-input-wrap .form-control:focus {

    border-color: var(--mp-gold);

    background: #fff;

    box-shadow:
        0 0 0 3px rgba(232,154,11,.08);

}


.mpp-textarea-wrap > i {

    top: 18px;

    transform: none;

}


.mpp-textarea-wrap textarea {

    resize: vertical;

}


/* =========================================================
   CONSENT
========================================================= */

.mpp-contact-consent {

    margin: 5px 0 17px;

}


.mpp-contact-consent label {

    position: relative;

    display: flex;

    align-items: flex-start;

    gap: 9px;

    cursor: pointer;

}


.mpp-contact-consent input {

    position: absolute;

    opacity: 0;

}


.mpp-checkmark {

    width: 16px;
    height: 16px;

    flex-shrink: 0;

    margin-top: 1px;

    border: 1px solid #d5dae0;

    border-radius: 3px;

    background: #fff;

}


.mpp-contact-consent input:checked
+ .mpp-checkmark {

    background: var(--mp-gold);

    border-color: var(--mp-gold);

}


.mpp-contact-consent input:checked
+ .mpp-checkmark::after {

    content: "✓";

    display: block;

    color: #fff;

    font-size: 14px;

    line-height: 14px;

    text-align: center;

}


.mpp-consent-text {

    color: #7d838d;

    font-size: 7.5px;

    line-height: 1.7;

}


/* =========================================================
   SUBMIT
========================================================= */

.mpp-contact-submit {

    width: 100%;

    min-height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    border: 0;

    border-radius: 7px;

    background:
        linear-gradient(
            135deg,
            #111d38,
            #071329
        );

    color: #fff;

    font-size: 14px;

    font-weight: 800;

    cursor: pointer;

    transition: all .3s ease;

}


.mpp-contact-submit:hover {

    background: var(--mp-gold);

    transform: translateY(-2px);

    box-shadow:
        0 12px 25px rgba(232,154,11,.2);

}


/* =========================================================
   FORM NOTE
========================================================= */

.mpp-form-note {

    margin-top: 12px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 5px;

    color: #a0a5ad;

    font-size: 12px;

}


.mpp-form-note i {

    color: #75a875;

}


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

.mpp-contact-bottom {

    position: relative;

    z-index: 2;

    margin-top: 65px;

    min-height: 220px;

    display: grid;

    grid-template-columns:
        1fr 1fr;

    overflow: hidden;

    border-radius: 18px;

    background: #111a35;

    box-shadow:
        0 20px 50px rgba(13,31,55,.12);

}


/* =========================================================
   MAP VISUAL
========================================================= */

.mpp-contact-map {

    position: relative;

    min-height: 220px;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #dfe5e9,
            #eef1f3
        );

}


.mpp-map-grid {

    position: absolute;

    inset: -20px;

    transform: rotate(-8deg);

    opacity: .7;

    background-image:
        linear-gradient(
            25deg,
            transparent 45%,
            rgba(255,255,255,.8) 46%,
            rgba(255,255,255,.8) 48%,
            transparent 49%
        ),
        linear-gradient(
            115deg,
            transparent 45%,
            rgba(255,255,255,.8) 46%,
            rgba(255,255,255,.8) 48%,
            transparent 49%
        );

    background-size: 100px 100px;

}


.mpp-map-pin {

    position: absolute;

    left: 50%;

    top: 50%;

    transform:
        translate(-50%,-50%);

    text-align: center;

}


.mpp-map-pin > div {

    width: 50px;
    height: 50px;

    margin: auto;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50% 50% 50% 5px;

    transform: rotate(-45deg);

    background: var(--mp-gold);

    color: #fff;

    box-shadow:
        0 10px 25px rgba(232,154,11,.3);

}


.mpp-map-pin i {

    transform: rotate(45deg);

}


.mpp-map-pin span {

    display: block;

    margin-top: 12px;

    padding: 5px 9px;

    border-radius: 4px;

    background: #111a35;

    color: #fff;

    font-size: 12px;

    font-weight: 700;

}


.mpp-map-route {

    position: absolute;

    height: 3px;

    background: rgba(232,154,11,.35);

    transform: rotate(-18deg);

}


.route-one {

    width: 300px;

    left: -30px;

    top: 70px;

}


.route-two {

    width: 240px;

    right: -20px;

    bottom: 50px;

    transform: rotate(12deg);

}


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

.mpp-contact-bottom-content {

    padding: 40px;

}


.mpp-contact-bottom-content > span {

    color: #eaa313;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-contact-bottom-content h3 {

    margin: 9px 0 12px;

    color: #fff;

    font-size: 25px;

    line-height: 1.2;

    font-weight: 800;

}


.mpp-contact-bottom-content h3 strong {

    color: #efa514;

}


.mpp-contact-bottom-content p {

    max-width: 390px;

    margin: 0;

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

    font-size: 13px;

    line-height: 1.8;

}


.mpp-contact-bottom-content a {

    margin-top: 20px;

    padding: 12px 17px;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    border-radius: 6px;

    background: #eaa313;

    color: #fff;

    font-size: 13px;

    font-weight: 800;

}


.mpp-contact-bottom-content a:hover {

    color: #fff;

    background: #d58d06;

}


/* =========================================================
   DISCLAIMER
========================================================= */

.mpp-contact-disclaimer {

    position: relative;

    z-index: 2;

    margin-top: 18px;

    display: flex;

    align-items: flex-start;

    gap: 8px;

}


.mpp-contact-disclaimer i {

    margin-top: 2px;

    color: var(--mp-gold);

    font-size: 11px;

}


.mpp-contact-disclaimer p {

    margin: 0;

    color: #9298a2;

    font-size: 7.5px;

    line-height: 1.7;

}


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

@media (max-width: 991px) {

    .mpp-contact-section {

        padding: 90px 0;

    }

    .mpp-contact-grid {

        grid-template-columns: 1fr;

        gap: 25px;

    }

    .mpp-contact-info {

        padding: 0;

    }

}


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

@media (max-width: 767px) {

    .mpp-contact-section {

        padding: 75px 0;

    }

    .mpp-contact-heading {

        margin-bottom: 40px;

    }

    .mpp-contact-heading h2 {

        font-size: 38px;

        letter-spacing: -1px;

    }

    .mpp-contact-heading p {

        font-size: 14px;

    }

    .mpp-contact-details {

        grid-template-columns: 1fr;

    }

    .mpp-contact-form-card {

        padding: 25px 20px;

    }

    .mpp-contact-bottom {

        grid-template-columns: 1fr;

    }

    .mpp-contact-map {

        min-height: 180px;

    }

    .mpp-contact-bottom-content {

        padding: 30px 25px;

    }

}


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

@media (max-width: 480px) {

    .mpp-contact-heading h2 {

        font-size: 33px;

    }

    .mpp-contact-intro h3 {

        font-size: 27px;

    }

    .mpp-contact-form-head h3 {

        font-size: 22px;

    }

}
/* =========================================================
   MAX PRIME PAISA
   REPAY LOAN SECTION
========================================================= */

.mpp-repay-section {

    position: relative;

    padding: 120px 0 110px;

    background: #f7f9fc;

    overflow: hidden;

}


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

.mpp-repay-bg {

    position: absolute;

    width: 700px;
    height: 700px;

    right: -450px;
    top: -250px;

    border-radius: 50%;

    border: 120px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADING
========================================================= */

.mpp-repay-heading {

    position: relative;

    z-index: 2;

    max-width: 760px;

    margin: 0 auto 60px;

}


.mpp-repay-heading h2 {

    margin: 15px 0 0;

    color: #111a35;

    font-size: clamp(40px,4vw,56px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -2px;

}


.mpp-repay-heading h2 span {

    display: block;

    color: var(--mp-gold);

}


.mpp-repay-heading p {

    max-width: 650px;

    margin: 20px auto 0;

    color: #777e89;

    font-size: 15px;

    line-height: 1.8;

}


/* =========================================================
   MAIN CARD
========================================================= */

.mpp-repay-card {

    position: relative;

    height: 100%;

    padding: 35px;

    border-radius: 20px;

    background: #fff;

    border: 1px solid #e5e9ee;

    box-shadow:
        0 20px 55px rgba(13,31,55,.065);

    overflow: hidden;

}


.mpp-repay-card::before {

    content: "";

    position: absolute;

    width: 170px;
    height: 170px;

    right: -100px;
    bottom: -100px;

    border-radius: 50%;

    background:
        rgba(232,154,11,.045);

}


/* =========================================================
   CARD HEADER
========================================================= */

.mpp-repay-card-head {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 30px;

}


.mpp-repay-card-head span {

    display: block;

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-repay-card-head h3 {

    margin: 6px 0 0;

    color: #111a35;

    font-size: 24px;

    line-height: 1.2;

    font-weight: 800;

}


.mpp-repay-card-icon,
.mpp-payment-icon {

    width: 58px;
    height: 58px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 15px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 22px;

}


/* =========================================================
   FORM
========================================================= */

.mpp-repay-form {

    position: relative;

    z-index: 2;

}


.mpp-repay-form-group {

    margin-bottom: 20px;

}


.mpp-repay-form-group label {

    display: block;

    margin-bottom: 7px;

    color: #343b4d;

    font-size: 13px;

    font-weight: 800;

}


.mpp-repay-input {

    position: relative;

    display: flex;

    align-items: center;

}


.mpp-repay-input > i {

    position: absolute;

    left: 14px;

    z-index: 2;

    color: #aeb4bd;

    font-size: 15px;

}


.mpp-repay-input input {

    width: 100%;

    height: 48px;

    padding:
        10px 15px 10px 40px;

    border: 1px solid #e2e6eb;

    border-radius: 7px;

    outline: none;

    background: #fafbfc;

    color: #182039;

    font-size: 11px;

    transition: .25s ease;

}


.mpp-repay-input input:focus {

    border-color: var(--mp-gold);

    background: #fff;

    box-shadow:
        0 0 0 3px
        rgba(232,154,11,.08);

}


.mpp-country-code {

    position: absolute;

    left: 39px;

    z-index: 2;

    color: #737984;

    font-size: 14px;

    pointer-events: none;

}


.mpp-country-code + input {

    padding-left: 70px;

}


/* =========================================================
   SUBMIT BUTTON
========================================================= */

.mpp-repay-submit {

    width: 100%;

    min-height: 50px;

    margin-top: 5px;

    padding: 12px 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    border: 0;

    border-radius: 7px;

    background:
        linear-gradient(
            135deg,
            #111d38,
            #071329
        );

    color: #fff;

    font-size: 14px;

    font-weight: 800;

    cursor: pointer;

    transition: .3s ease;

}


.mpp-repay-submit i {

    color: #efaa18;

    transition: .3s ease;

}


.mpp-repay-submit:hover {

    background: var(--mp-gold);

    transform: translateY(-2px);

    box-shadow:
        0 12px 25px
        rgba(232,154,11,.2);

}


.mpp-repay-submit:hover i {

    color: #fff;

    transform: translateX(4px);

}


/* =========================================================
   SECURITY
========================================================= */

.mpp-repay-security {

    margin-top: 15px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    color: #9298a1;

    font-size: 12px;

}


.mpp-repay-security i {

    color: #6da06d;

    font-size: 14px;

}


/* =========================================================
   INFO BOX
========================================================= */

.mpp-repay-info-box {

    position: relative;

    z-index: 2;

    margin-top: 28px;

    padding: 15px;

    display: flex;

    align-items: flex-start;

    gap: 10px;

    border-radius: 10px;

    background: #f8f9fb;

    border: 1px solid #edf0f3;

}


.mpp-repay-info-icon {

    width: 31px;
    height: 31px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 8px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 14px;

}


.mpp-repay-info-box strong {

    display: block;

    color: #20283c;

    font-size: 13px;

}


.mpp-repay-info-box p {

    margin: 4px 0 0;

    color: #858b94;

    font-size: 7.5px;

    line-height: 1.7;

}


/* =========================================================
   PAYMENT LAYOUT
========================================================= */

/* .mpp-payment-layout {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        1.1fr .9fr;

    gap: 25px;

} */


/* =========================================================
   BANK DETAILS
========================================================= */

.mpp-bank-details {

    padding: 20px;

    border-radius: 12px;

    background: #f8f9fb;

    border: 1px solid #e8ebef;

}


.mpp-bank-logo {

    width: 42px;
    height: 42px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: #111a35;

    color: #efaa18;

    font-size: 15px;

}


.mpp-bank-label {

    display: block;

    margin-top: 15px;

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.3px;

}


.mpp-bank-row {

    padding: 10px 0;

    display: flex;

    flex-direction: column;

    border-bottom: 1px solid #e5e8ec;

}


.mpp-bank-row span {

    color: #949aa3;

    font-size: 12px;

}


.mpp-bank-row strong {

    margin-top: 3px;

    color: #1d2539;

    font-size: 13px;

    word-break: break-word;

}


/* =========================================================
   PAYMENT NOTE
========================================================= */

.mpp-payment-note {

    margin-top: 15px;

    display: flex;

    align-items: flex-start;

    gap: 6px;

    color: #8b9099;

    font-size: 12px;

    line-height: 1.6;

}


.mpp-payment-note i {

    margin-top: 1px;

    color: var(--mp-gold);

}


/* =========================================================
   QR AREA
========================================================= */

.mpp-qr-area {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

}


.mpp-qr-area > span {

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-qr-box {

   

    display: flex;

    align-items: center;

    justify-content: center;

    background: #fff;

    border: 1px solid #e1e5e9;

    border-radius: 12px;

    box-shadow:
        0 12px 30px
        rgba(13,31,55,.07);

}


.mpp-qr-box img {

    width: 100%;
    height: 100%;

    object-fit: contain;

}


.mpp-qr-area strong {

    display: block;

    color: #182039;

    font-size: 14px;

}


.mpp-qr-area small {

    display: block;

    max-width: 160px;

    margin-top: 5px;

    color: #9499a2;

    font-size: 12px;

    line-height: 1.5;

}


/* =========================================================
   PAYMENT FOOTER
========================================================= */

.mpp-payment-footer {

    position: relative;

    z-index: 2;

    margin-top: 22px;

    padding-top: 17px;

    display: flex;

    justify-content: space-between;

    gap: 15px;

    border-top: 1px solid #edf0f3;

}


.mpp-payment-footer > div {

    display: flex;

    align-items: center;

    gap: 6px;

}


.mpp-payment-footer i {

    color: #75a575;

    font-size: 14px;

}


.mpp-payment-footer span {

    color: #8b919a;

    font-size: 12px;

}


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

.mpp-repay-bottom {

    position: relative;

    z-index: 2;

    margin-top: 25px;

    padding: 20px 25px;

    display: flex;

    align-items: center;

    gap: 13px;

    border-radius: 12px;

    background: #111a35;

}


.mpp-repay-bottom-icon {

    width: 42px;
    height: 42px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: rgba(232,154,11,.12);

    color: #efa514;

    font-size: 17px;

}


.mpp-repay-bottom strong {

    display: block;

    color: #fff;

    font-size: 13px;

}


.mpp-repay-bottom p {

    margin: 4px 0 0;

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

    font-size: 7.5px;

    line-height: 1.7;

}


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

@media (max-width: 991px) {

    .mpp-repay-section {

        padding: 90px 0;

    }

    .mpp-payment-layout {

        grid-template-columns: 1fr;

    }

    .mpp-qr-box {

        width: 180px;
        height: 180px;

    }

}


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

@media (max-width: 767px) {

    .mpp-repay-section {

        padding: 75px 0;

    }

    .mpp-repay-heading {

        margin-bottom: 40px;

    }

    .mpp-repay-heading h2 {

        font-size: 38px;

        letter-spacing: -1px;

    }

    .mpp-repay-heading p {

        font-size: 14px;

    }

    .mpp-repay-card {

        padding: 25px 20px;

    }

    .mpp-payment-footer {

        flex-direction: column;

    }

    .mpp-repay-bottom {

        align-items: flex-start;

    }

}


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

@media (max-width: 480px) {

    .mpp-repay-heading h2 {

        font-size: 33px;

    }

    .mpp-repay-card-head h3 {

        font-size: 21px;

    }

    .mpp-payment-layout {

        gap: 20px;

    }

}
/* =========================================================
   MAX PRIME PAISA
   PRIVACY POLICY
========================================================= */

.mpp-privacy-section {

    position: relative;

    padding: 110px 0;

    background: #f7f9fc;

    overflow: hidden;

}

.mpp-privacy-bg {

    position: absolute;

    width: 700px;
    height: 700px;

    right: -450px;
    top: -250px;

    border-radius: 50%;

    border: 120px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADER
========================================================= */

.mpp-privacy-header {

    position: relative;

    z-index: 2;

    max-width: 850px;

    margin-bottom: 45px;

}

.mpp-privacy-header h1 {

    margin: 15px 0;

    color: #111a35;

    font-size: clamp(42px,5vw,62px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -2px;

}

.mpp-privacy-header h1 span {

    color: var(--mp-gold);

}

.mpp-privacy-header > p {

    max-width: 680px;

    margin: 0;

    color: #777e89;

    font-size: 15px;

    line-height: 1.8;

}


.mpp-privacy-meta {

    margin-top: 22px;

    display: flex;

    align-items: center;

    gap: 10px;

    flex-wrap: wrap;

}

.mpp-privacy-meta span {

    display: flex;

    align-items: center;

    gap: 7px;

    padding: 8px 12px;

    border-radius: 5px;

    background: #fff;

    border: 1px solid #e7ebef;

    color: #777e89;

    font-size: 13px;

    font-weight: 600;

}

.mpp-privacy-meta i {

    color: var(--mp-gold);

}


/* =========================================================
   INTRO
========================================================= */

.mpp-privacy-intro {

    position: relative;

    z-index: 2;

    margin-bottom: 35px;

    padding: 22px 25px;

    display: flex;

    align-items: flex-start;

    gap: 15px;

    border-radius: 13px;

    background: #111a35;

    box-shadow:
        0 15px 40px rgba(13,31,55,.10);

}

.mpp-privacy-intro-icon {

    width: 48px;
    height: 48px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: rgba(232,154,11,.12);

    color: #efa514;

    font-size: 19px;

}

.mpp-privacy-intro strong {

    display: block;

    color: #fff;

    font-size: 11px;

}

.mpp-privacy-intro p {

    margin: 6px 0 0;

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

    font-size: 8.5px;

    line-height: 1.8;

}


/* =========================================================
   LAYOUT
========================================================= */

.mpp-privacy-layout {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns: 260px 1fr;

    gap: 35px;

    align-items: start;

}


/* =========================================================
   SIDEBAR
========================================================= */

.mpp-privacy-sidebar {

    position: sticky;

    top: 25px;

    padding: 20px;

    border-radius: 13px;

    background: #fff;

    border: 1px solid #e5e9ee;

    box-shadow:
        0 10px 30px rgba(13,31,55,.045);

}

.mpp-privacy-sidebar-title {

    padding-bottom: 13px;

    margin-bottom: 8px;

    border-bottom: 1px solid #edf0f3;

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}

.mpp-privacy-sidebar a {

    display: block;

    padding: 7px 5px;

    color: #747b86;

    font-size: 13px;

    line-height: 1.5;

    border-radius: 4px;

    transition: all .2s ease;

}

.mpp-privacy-sidebar a:hover {

    padding-left: 9px;

    background: #fff8eb;

    color: var(--mp-gold);

}


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

.mpp-privacy-content {

    min-width: 0;

}

.mpp-privacy-content article {

    position: relative;

    padding: 30px 30px 30px 85px;

    margin-bottom: 12px;

    border-radius: 13px;

    background: #fff;

    border: 1px solid #e7ebef;

    transition: all .3s ease;

    scroll-margin-top: 25px;

}

.mpp-privacy-content article:hover {

    border-color:
        rgba(232,154,11,.2);

    box-shadow:
        0 12px 35px rgba(13,31,55,.05);

}

.mpp-policy-number {

    position: absolute;

    left: 25px;

    top: 28px;

    width: 42px;
    height: 42px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 13px;

    font-weight: 800;

}

.mpp-privacy-content article h2 {

    margin: 0 0 10px;

    color: #111a35;

    font-size: 17px;

    line-height: 1.3;

    font-weight: 800;

}

.mpp-privacy-content article p {

    margin: 0;

    color: #777e89;

    font-size: 14px;

    line-height: 1.9;

}


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

.mpp-privacy-contact-box {

    margin-top: 20px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 10px;

}

.mpp-privacy-contact-box > div {

    padding: 15px;

    border-radius: 9px;

    background: #f8f9fb;

    border: 1px solid #e8ecf0;

}

.mpp-privacy-contact-box i {

    display: block;

    margin-bottom: 8px;

    color: var(--mp-gold);

    font-size: 14px;

}

.mpp-privacy-contact-box span {

    display: block;

    color: #9a9fa7;

    font-size: 12px;

    text-transform: uppercase;

}

.mpp-privacy-contact-box strong {

    display: block;

    margin-top: 4px;

    color: #182039;

    font-size: 13px;

    word-break: break-word;

}


/* =========================================================
   FINAL NOTICE
========================================================= */

.mpp-privacy-final {

    margin-top: 20px;

    padding: 22px;

    display: flex;

    align-items: flex-start;

    gap: 13px;

    border-radius: 13px;

    background:
        linear-gradient(
            135deg,
            #111d38,
            #071329
        );

}

.mpp-privacy-final-icon {

    width: 43px;
    height: 43px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: rgba(232,154,11,.12);

    color: #efa514;

}

.mpp-privacy-final strong {

    display: block;

    color: #fff;

    font-size: 14px;

}

.mpp-privacy-final p {

    margin: 5px 0 0;

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

    font-size: 13px;

    line-height: 1.7;

}


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

@media (max-width: 991px) {

    .mpp-privacy-section {

        padding: 90px 0;

    }

    .mpp-privacy-layout {

        grid-template-columns: 1fr;

    }

    .mpp-privacy-sidebar {

        position: relative;

        top: auto;

        display: grid;

        grid-template-columns: 1fr 1fr;

        gap: 2px 10px;

    }

    .mpp-privacy-sidebar-title {

        grid-column: 1 / -1;

    }

}


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

@media (max-width: 767px) {

    .mpp-privacy-section {

        padding: 75px 0;

    }

    .mpp-privacy-header h1 {

        font-size: 39px;

        letter-spacing: -1px;

    }

    .mpp-privacy-header > p {

        font-size: 14px;

    }

    .mpp-privacy-intro {

        padding: 18px;

    }

    .mpp-privacy-layout {

        gap: 20px;

    }

    .mpp-privacy-sidebar {

        grid-template-columns: 1fr;

    }

    .mpp-privacy-content article {

        padding: 25px 20px 25px 70px;

    }

    .mpp-policy-number {

        left: 18px;

        top: 23px;

        width: 37px;
        height: 37px;

    }

    .mpp-privacy-content article h2 {

        font-size: 15px;

    }

    .mpp-privacy-content article p {

        font-size: 13px;

    }

    .mpp-privacy-contact-box {

        grid-template-columns: 1fr;

    }

}


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

@media (max-width: 480px) {

    .mpp-privacy-header h1 {

        font-size: 33px;

    }

    .mpp-privacy-meta {

        align-items: flex-start;

        flex-direction: column;

    }

    .mpp-privacy-intro {

        align-items: flex-start;

    }

}
/* =========================================================
   MAX PRIME PAISA
   TERMS & CONDITIONS
========================================================= */

.mpp-terms-section {

    position: relative;

    padding: 110px 0;

    background: #f7f9fc;

    overflow: hidden;

}


.mpp-terms-bg {

    position: absolute;

    width: 700px;
    height: 700px;

    right: -450px;
    top: -250px;

    border-radius: 50%;

    border: 120px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADER
========================================================= */

.mpp-terms-header {

    position: relative;

    z-index: 2;

    max-width: 850px;

    margin-bottom: 45px;

}


.mpp-terms-header h1 {

    margin: 15px 0;

    color: #111a35;

    font-size: clamp(42px,5vw,62px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -2px;

}


.mpp-terms-header h1 span {

    color: var(--mp-gold);

}


.mpp-terms-header > p {

    max-width: 680px;

    margin: 0;

    color: #777e89;

    font-size: 15px;

    line-height: 1.8;

}


.mpp-terms-meta {

    margin-top: 22px;

    display: flex;

    align-items: center;

    gap: 10px;

    flex-wrap: wrap;

}


.mpp-terms-meta span {

    padding: 8px 12px;

    display: flex;

    align-items: center;

    gap: 7px;

    border-radius: 5px;

    background: #fff;

    border: 1px solid #e7ebef;

    color: #777e89;

    font-size: 13px;

    font-weight: 600;

}


.mpp-terms-meta i {

    color: var(--mp-gold);

}


/* =========================================================
   NOTICE
========================================================= */

.mpp-terms-notice {

    position: relative;

    z-index: 2;

    margin-bottom: 35px;

    padding: 22px 25px;

    display: flex;

    align-items: flex-start;

    gap: 15px;

    border-radius: 13px;

    background: #111a35;

    box-shadow:
        0 15px 40px rgba(13,31,55,.10);

}


.mpp-terms-notice-icon {

    width: 48px;
    height: 48px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: rgba(232,154,11,.12);

    color: #efa514;

    font-size: 18px;

}


.mpp-terms-notice strong {

    display: block;

    color: #fff;

    font-size: 11px;

}


.mpp-terms-notice p {

    margin: 6px 0 0;

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

    font-size: 8.5px;

    line-height: 1.8;

}


/* =========================================================
   LAYOUT
========================================================= */

.mpp-terms-layout {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns: 260px 1fr;

    gap: 35px;

    align-items: start;

}


/* =========================================================
   SIDEBAR
========================================================= */

.mpp-terms-sidebar {

    position: sticky;

    top: 25px;

    padding: 20px;

    border-radius: 13px;

    background: #fff;

    border: 1px solid #e5e9ee;

    box-shadow:
        0 10px 30px rgba(13,31,55,.045);

}


.mpp-terms-sidebar-title {

    padding-bottom: 13px;

    margin-bottom: 8px;

    border-bottom: 1px solid #edf0f3;

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-terms-sidebar a {

    display: block;

    padding: 7px 5px;

    color: #747b86;

    font-size: 13px;

    line-height: 1.5;

    border-radius: 4px;

    transition: all .2s ease;

}


.mpp-terms-sidebar a:hover {

    padding-left: 9px;

    background: #fff8eb;

    color: var(--mp-gold);

}


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

.mpp-terms-content {

    min-width: 0;

}


.mpp-terms-content article {

    position: relative;

    padding: 30px 30px 30px 85px;

    margin-bottom: 12px;

    border-radius: 13px;

    background: #fff;

    border: 1px solid #e7ebef;

    transition: all .3s ease;

    scroll-margin-top: 25px;

}


.mpp-terms-content article:hover {

    border-color:
        rgba(232,154,11,.2);

    box-shadow:
        0 12px 35px rgba(13,31,55,.05);

}


.mpp-terms-number {

    position: absolute;

    left: 25px;

    top: 28px;

    width: 42px;
    height: 42px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 13px;

    font-weight: 800;

}


.mpp-terms-content article h2 {

    margin: 0 0 10px;

    color: #111a35;

    font-size: 17px;

    line-height: 1.3;

    font-weight: 800;

}


.mpp-terms-content article p {

    margin: 0;

    color: #777e89;

    font-size: 14px;

    line-height: 1.9;

}


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

.mpp-terms-contact {

    margin-top: 20px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 10px;

}


.mpp-terms-contact > div {

    padding: 15px;

    border-radius: 9px;

    background: #f8f9fb;

    border: 1px solid #e8ecf0;

}


.mpp-terms-contact i {

    display: block;

    margin-bottom: 8px;

    color: var(--mp-gold);

    font-size: 14px;

}


.mpp-terms-contact span {

    display: block;

    color: #9a9fa7;

    font-size: 12px;

    font-weight: 700;

}


.mpp-terms-contact strong {

    display: block;

    margin-top: 4px;

    color: #182039;

    font-size: 13px;

    word-break: break-word;

}


/* =========================================================
   FINAL NOTICE
========================================================= */

.mpp-terms-final {

    margin-top: 20px;

    padding: 22px;

    display: flex;

    align-items: flex-start;

    gap: 13px;

    border-radius: 13px;

    background:
        linear-gradient(
            135deg,
            #111d38,
            #071329
        );

}


.mpp-terms-final-icon {

    width: 43px;
    height: 43px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: rgba(232,154,11,.12);

    color: #efa514;

}


.mpp-terms-final strong {

    display: block;

    color: #fff;

    font-size: 14px;

}


.mpp-terms-final p {

    margin: 5px 0 0;

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

    font-size: 13px;

    line-height: 1.7;

}


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

@media (max-width: 991px) {

    .mpp-terms-section {

        padding: 90px 0;

    }

    .mpp-terms-layout {

        grid-template-columns: 1fr;

    }

    .mpp-terms-sidebar {

        position: relative;

        top: auto;

        display: grid;

        grid-template-columns: 1fr 1fr;

        gap: 2px 10px;

    }

    .mpp-terms-sidebar-title {

        grid-column: 1 / -1;

    }

}


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

@media (max-width: 767px) {

    .mpp-terms-section {

        padding: 75px 0;

    }

    .mpp-terms-header h1 {

        font-size: 39px;

        letter-spacing: -1px;

    }

    .mpp-terms-header > p {

        font-size: 14px;

    }

    .mpp-terms-notice {

        padding: 18px;

    }

    .mpp-terms-sidebar {

        grid-template-columns: 1fr;

    }

    .mpp-terms-content article {

        padding: 25px 20px 25px 70px;

    }

    .mpp-terms-number {

        left: 18px;

        top: 23px;

        width: 37px;
        height: 37px;

    }

    .mpp-terms-content article h2 {

        font-size: 15px;

    }

    .mpp-terms-content article p {

        font-size: 13px;

    }

    .mpp-terms-contact {

        grid-template-columns: 1fr;

    }

}


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

@media (max-width: 480px) {

    .mpp-terms-header h1 {

        font-size: 33px;

    }

    .mpp-terms-meta {

        align-items: flex-start;

        flex-direction: column;

    }

}
/* =========================================================
   MAX PRIME PAISA
   GRIEVANCE REDRESSAL
========================================================= */

.mpp-grievance-section {

    position: relative;

    padding: 110px 0;

    background: #f7f9fc;

    overflow: hidden;

}


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

.mpp-grievance-orb {

    position: absolute;

    width: 650px;
    height: 650px;

    right: -420px;
    top: -250px;

    border-radius: 50%;

    border: 110px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADER
========================================================= */

.mpp-grievance-header {

    position: relative;

    z-index: 2;

    max-width: 820px;

    margin-bottom: 40px;

}


.mpp-grievance-header h2 {

    margin: 15px 0;

    color: #111a35;

    font-size: clamp(40px, 4.5vw, 58px);

    line-height: 1.07;

    font-weight: 800;

    letter-spacing: -2px;

}


.mpp-grievance-header h2 span {

    display: block;

    color: var(--mp-gold);

}


.mpp-grievance-header p {

    max-width: 720px;

    margin: 0;

    color: #777e89;

    font-size: 14px;

    line-height: 1.9;

}


/* =========================================================
   NOTICE
========================================================= */

.mpp-grievance-notice {

    position: relative;

    z-index: 2;

    margin-bottom: 50px;

    padding: 20px 24px;

    display: flex;

    align-items: center;

    gap: 15px;

    border-radius: 13px;

    background: #111a35;

    box-shadow:
        0 15px 40px rgba(13,31,55,.09);

}


.mpp-grievance-notice-icon {

    width: 48px;
    height: 48px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: rgba(232,154,11,.12);

    color: #efa514;

    font-size: 19px;

}


.mpp-grievance-notice strong {

    display: block;

    color: #fff;

    font-size: 14px;

}


.mpp-grievance-notice p {

    margin: 5px 0 0;

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

    font-size: 13px;

    line-height: 1.7;

}


/* =========================================================
   TIMELINE
========================================================= */

.mpp-grievance-timeline {

    position: relative;

    z-index: 2;

}


/* vertical line */

.mpp-grievance-timeline::before {

    content: "";

    position: absolute;

    left: 31px;

    top: 30px;

    bottom: 30px;

    width: 2px;

    background:
        linear-gradient(
            to bottom,
            #e9a513,
            #e9a513 70%,
            #263b60
        );

}


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

.mpp-grievance-item {

    position: relative;

    display: grid;

    grid-template-columns: 64px 1fr;

    gap: 25px;

    margin-bottom: 22px;

}


/* =========================================================
   STEP
========================================================= */

.mpp-grievance-step {

    position: relative;

    z-index: 3;

    width: 64px;
    height: 64px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #fff;

    border: 5px solid #f7f9fc;

    box-shadow:
        0 5px 20px rgba(13,31,55,.10);

}


.mpp-grievance-step::before {

    content: "";

    position: absolute;

    inset: 5px;

    border-radius: 50%;

    background: #111a35;

}


.mpp-grievance-step span {

    position: relative;

    z-index: 2;

    color: #efaa18;

    font-size: 14px;

    font-weight: 800;

}


/* =========================================================
   CARD
========================================================= */

.mpp-grievance-card {

    position: relative;

    padding: 28px 30px;

    border-radius: 15px;

    background: #fff;

    border: 1px solid #e4e9ee;

    box-shadow:
        0 10px 30px rgba(13,31,55,.045);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;

}


.mpp-grievance-card:hover {

    transform: translateY(-3px);

    border-color:
        rgba(232,154,11,.25);

    box-shadow:
        0 18px 45px rgba(13,31,55,.08);

}


/* =========================================================
   CARD TOP
========================================================= */

.mpp-grievance-card-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

}


.mpp-grievance-level {

    display: inline-block;

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-grievance-card h3 {

    margin: 6px 0 0;

    color: #111a35;

    font-size: 21px;

    font-weight: 800;

}


.mpp-grievance-card-icon {

    width: 46px;
    height: 46px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 17px;

}


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

.mpp-grievance-description {

    max-width: 850px;

    margin: 17px 0 20px;

    color: #777e89;

    font-size: 13px;

    line-height: 1.85;

}


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

.mpp-grievance-contact-grid {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 10px;

}


.mpp-grievance-contact-grid > div {

    min-height: 60px;

    padding: 12px;

    border-radius: 8px;

    background: #f8f9fb;

    border: 1px solid #edf0f3;

}


.mpp-grievance-contact-grid span {

    display: block;

    color: #a0a5ad;

    font-size: 6.5px;

    font-weight: 800;

    letter-spacing: 1px;

}


.mpp-grievance-contact-grid strong {

    display: block;

    margin-top: 5px;

    color: #1c253a;

    font-size: 13px;

    line-height: 1.5;

    word-break: break-word;

}


/* =========================================================
   LEVEL 4 / RBI
========================================================= */

.mpp-grievance-final .mpp-grievance-step::before {

    background: #e9a513;

}


.mpp-grievance-final .mpp-grievance-step span {

    color: #fff;

}


.mpp-grievance-final .mpp-grievance-card {

    background:
        linear-gradient(
            135deg,
            #fffdf7,
            #fff8e7
        );

    border-color:
        rgba(232,154,11,.25);

}


.mpp-grievance-final .mpp-grievance-card-icon {

    background: #111a35;

    color: #efaa18;

}


/* =========================================================
   RBI BOX
========================================================= */

.mpp-grievance-rbi-box {

    margin-top: 20px;

    padding: 17px;

    display: flex;

    align-items: center;

    gap: 13px;

    border-radius: 10px;

    background: #fff;

    border: 1px solid
        rgba(232,154,11,.25);

}


.mpp-rbi-icon {

    width: 43px;
    height: 43px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    background: #111a35;

    color: #efaa18;

    font-size: 15px;

}


.mpp-grievance-rbi-box span {

    display: block;

    color: #a0a5ad;

    font-size: 6.5px;

    font-weight: 800;

    letter-spacing: 1px;

}


.mpp-grievance-rbi-box strong {

    display: block;

    margin-top: 3px;

    color: #182039;

    font-size: 13px;

}


.mpp-grievance-rbi-box a {

    display: inline-flex;

    align-items: center;

    gap: 5px;

    margin-top: 6px;

    color: var(--mp-gold);

    font-size: 13px;

    font-weight: 800;

}


.mpp-grievance-rbi-box a:hover {

    color: #111a35;

}


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

.mpp-grievance-bottom {

    position: relative;

    z-index: 2;

    margin-top: 35px;

    padding: 18px 22px;

    display: flex;

    align-items: flex-start;

    gap: 12px;

    border-radius: 11px;

    background: #fff;

    border: 1px solid #e5e9ee;

}


.mpp-grievance-bottom-icon {

    width: 37px;
    height: 37px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    background: #fff5df;

    color: var(--mp-gold);

}


.mpp-grievance-bottom strong {

    display: block;

    color: #182039;

    font-size: 13px;

}


.mpp-grievance-bottom p {

    margin: 4px 0 0;

    color: #858b94;

    font-size: 7.5px;

    line-height: 1.7;

}


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

@media (max-width: 991px) {

    .mpp-grievance-section {

        padding: 90px 0;

    }

    .mpp-grievance-contact-grid {

        grid-template-columns:
            repeat(2, 1fr);

    }

}


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

@media (max-width: 767px) {

    .mpp-grievance-section {

        padding: 75px 0;

    }

    .mpp-grievance-header h2 {

        font-size: 38px;

        letter-spacing: -1px;

    }

    .mpp-grievance-header p {

        font-size: 11px;

    }

    .mpp-grievance-notice {

        align-items: flex-start;

        padding: 18px;

    }

    .mpp-grievance-timeline::before {

        left: 22px;

    }

    .mpp-grievance-item {

        grid-template-columns: 45px 1fr;

        gap: 12px;

    }

    .mpp-grievance-step {

        width: 45px;
        height: 45px;

        border-width: 3px;

    }

    .mpp-grievance-step::before {

        inset: 4px;

    }

    .mpp-grievance-step span {

        font-size: 13px;

    }

    .mpp-grievance-card {

        padding: 20px 17px;

    }

    .mpp-grievance-card h3 {

        font-size: 17px;

    }

    .mpp-grievance-contact-grid {

        grid-template-columns: 1fr;

    }

    .mpp-grievance-description {

        font-size: 8.5px;

    }

}


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

@media (max-width: 480px) {

    .mpp-grievance-header h2 {

        font-size: 32px;

    }

    .mpp-grievance-card-top {

        align-items: flex-start;

    }

    .mpp-grievance-card-icon {

        width: 40px;
        height: 40px;

        font-size: 14px;

    }

    .mpp-grievance-rbi-box {

        align-items: flex-start;

    }

}
/* =========================================================
   MAX PRIME PAISA
   DISCLAIMER
========================================================= */

.mpp-disclaimer-section {

    position: relative;

    padding: 110px 0;

    background: #f7f9fc;

    overflow: hidden;

}

.mpp-disclaimer-orb {

    position: absolute;

    width: 700px;
    height: 700px;

    right: -460px;
    top: -260px;

    border-radius: 50%;

    border: 120px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADER
========================================================= */

.mpp-disclaimer-header {

    position: relative;

    z-index: 2;

    max-width: 850px;

    margin-bottom: 45px;

}

.mpp-disclaimer-header h1 {

    margin: 15px 0;

    color: #111a35;

    font-size: clamp(42px,5vw,62px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -2px;

}

.mpp-disclaimer-header h1 span {

    color: var(--mp-gold);

}

.mpp-disclaimer-header > p {

    max-width: 700px;

    margin: 0;

    color: #777e89;

    font-size: 15px;

    line-height: 1.8;

}


.mpp-disclaimer-meta {

    margin-top: 22px;

    display: flex;

    gap: 10px;

    flex-wrap: wrap;

}

.mpp-disclaimer-meta span {

    padding: 8px 12px;

    display: flex;

    align-items: center;

    gap: 7px;

    border-radius: 5px;

    background: #fff;

    border: 1px solid #e7ebef;

    color: #777e89;

    font-size: 13px;

}

.mpp-disclaimer-meta i {

    color: var(--mp-gold);

}


/* =========================================================
   ALERT
========================================================= */

.mpp-disclaimer-alert {

    position: relative;

    z-index: 2;

    margin-bottom: 20px;

    padding: 23px 25px;

    display: flex;

    align-items: flex-start;

    gap: 15px;

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            #111d38,
            #071329
        );

    box-shadow:
        0 18px 45px rgba(13,31,55,.10);

}

.mpp-disclaimer-alert-icon {

    width: 48px;
    height: 48px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: rgba(232,154,11,.13);

    color: #efa514;

    font-size: 18px;

}

.mpp-disclaimer-alert strong {

    display: block;

    color: #fff;

    font-size: 11px;

}

.mpp-disclaimer-alert p {

    margin: 6px 0 0;

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

    font-size: 8.5px;

    line-height: 1.8;

}


/* =========================================================
   HIGHLIGHTS
========================================================= */

.mpp-disclaimer-highlights {

    position: relative;

    z-index: 2;

    margin-bottom: 35px;

    display: grid;

    grid-template-columns:
        repeat(3,1fr);

    gap: 12px;

}


.mpp-disclaimer-highlight {

    padding: 17px;

    display: flex;

    align-items: flex-start;

    gap: 11px;

    border-radius: 11px;

    background: #fff;

    border: 1px solid #e5e9ee;

}


.mpp-disclaimer-highlight > i {

    color: var(--mp-gold);

    font-size: 16px;

}


.mpp-disclaimer-highlight strong {

    display: block;

    color: #182039;

    font-size: 8.5px;

}


.mpp-disclaimer-highlight span {

    display: block;

    margin-top: 4px;

    color: #8a9099;

    font-size: 12px;

    line-height: 1.6;

}


/* =========================================================
   LAYOUT
========================================================= */

.mpp-disclaimer-layout {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns: 260px 1fr;

    gap: 35px;

    align-items: start;

}


/* =========================================================
   SIDEBAR
========================================================= */

.mpp-disclaimer-sidebar {

    position: sticky;

    top: 25px;

    padding: 20px;

    border-radius: 13px;

    background: #fff;

    border: 1px solid #e5e9ee;

    box-shadow:
        0 10px 30px rgba(13,31,55,.045);

}


.mpp-disclaimer-sidebar-title {

    padding-bottom: 13px;

    margin-bottom: 8px;

    border-bottom: 1px solid #edf0f3;

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-disclaimer-sidebar a {

    display: block;

    padding: 7px 5px;

    color: #747b86;

    font-size: 13px;

    line-height: 1.5;

    border-radius: 4px;

    transition: .2s ease;

}


.mpp-disclaimer-sidebar a:hover {

    padding-left: 9px;

    background: #fff8eb;

    color: var(--mp-gold);

}


/* =========================================================
   CONTENT CARDS
========================================================= */

.mpp-disclaimer-content {

    min-width: 0;

}


.mpp-disclaimer-content article {

    position: relative;

    padding: 30px 30px 30px 85px;

    margin-bottom: 12px;

    border-radius: 13px;

    background: #fff;

    border: 1px solid #e7ebef;

    scroll-margin-top: 25px;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;

}


.mpp-disclaimer-content article:hover {

    transform: translateY(-2px);

    border-color:
        rgba(232,154,11,.22);

    box-shadow:
        0 12px 35px rgba(13,31,55,.055);

}


.mpp-disclaimer-number {

    position: absolute;

    left: 25px;

    top: 28px;

    width: 42px;
    height: 42px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: #fff5df;

    color: var(--mp-gold);

    font-size: 13px;

    font-weight: 800;

}


.mpp-disclaimer-content article h2 {

    margin: 0 0 10px;

    color: #111a35;

    font-size: 17px;

    line-height: 1.3;

    font-weight: 800;

}


.mpp-disclaimer-content article p {

    margin: 0;

    color: #777e89;

    font-size: 14px;

    line-height: 1.9;

}


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

.mpp-disclaimer-contact {

    margin-top: 20px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 10px;

}


.mpp-disclaimer-contact > div {

    padding: 15px;

    border-radius: 9px;

    background: #f8f9fb;

    border: 1px solid #e8ecf0;

}


.mpp-disclaimer-contact i {

    display: block;

    margin-bottom: 8px;

    color: var(--mp-gold);

    font-size: 14px;

}


.mpp-disclaimer-contact span {

    display: block;

    color: #9a9fa7;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: .7px;

}


.mpp-disclaimer-contact strong {

    display: block;

    margin-top: 4px;

    color: #182039;

    font-size: 13px;

    word-break: break-word;

}


/* =========================================================
   FINAL SECURITY BOX
========================================================= */

.mpp-disclaimer-final {

    margin-top: 20px;

    padding: 23px;

    display: flex;

    align-items: flex-start;

    gap: 13px;

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            #111d38,
            #071329
        );

}


.mpp-disclaimer-final-icon {

    width: 44px;
    height: 44px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: rgba(232,154,11,.12);

    color: #efa514;

    font-size: 17px;

}


.mpp-disclaimer-final strong {

    display: block;

    color: #fff;

    font-size: 14px;

}


.mpp-disclaimer-final p {

    margin: 5px 0 0;

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

    font-size: 13px;

    line-height: 1.75;

}


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

@media (max-width: 991px) {

    .mpp-disclaimer-section {

        padding: 90px 0;

    }

    .mpp-disclaimer-highlights {

        grid-template-columns: 1fr;

    }

    .mpp-disclaimer-layout {

        grid-template-columns: 1fr;

    }

    .mpp-disclaimer-sidebar {

        position: relative;

        top: auto;

        display: grid;

        grid-template-columns: 1fr 1fr;

        gap: 2px 10px;

    }

    .mpp-disclaimer-sidebar-title {

        grid-column: 1 / -1;

    }

}


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

@media (max-width: 767px) {

    .mpp-disclaimer-section {

        padding: 75px 0;

    }

    .mpp-disclaimer-header h1 {

        font-size: 39px;

        letter-spacing: -1px;

    }

    .mpp-disclaimer-header > p {

        font-size: 11px;

    }

    .mpp-disclaimer-alert {

        padding: 18px;

    }

    .mpp-disclaimer-sidebar {

        grid-template-columns: 1fr;

    }

    .mpp-disclaimer-content article {

        padding: 25px 20px 25px 70px;

    }

    .mpp-disclaimer-number {

        left: 18px;

        top: 23px;

        width: 37px;
        height: 37px;

    }

    .mpp-disclaimer-content article h2 {

        font-size: 15px;

    }

    .mpp-disclaimer-content article p {

        font-size: 13px;

    }

    .mpp-disclaimer-contact {

        grid-template-columns: 1fr;

    }

}


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

@media (max-width: 480px) {

    .mpp-disclaimer-header h1 {

        font-size: 33px;

    }

    .mpp-disclaimer-meta {

        flex-direction: column;

        align-items: flex-start;

    }

    .mpp-disclaimer-final {

        padding: 18px;

    }

}
/* =========================================================
   MAX PRIME PAISA
   LOAN CALCULATOR
========================================================= */

.mpp-calculator-section {

    position: relative;

    padding: 105px 0;

    background: #f7f9fc;

    overflow: hidden;

}


.mpp-calculator-glow {

    position: absolute;

    width: 650px;
    height: 650px;

    left: -450px;
    bottom: -300px;

    border-radius: 50%;

    border: 110px solid
        rgba(232,154,11,.045);

    pointer-events: none;

}


/* =========================================================
   HEADING
========================================================= */

.mpp-calculator-heading {

    position: relative;

    z-index: 2;

    max-width: 760px;

    margin: 0 auto 45px;

}


.mpp-calculator-heading h2 {

    margin: 14px 0;

    color: #111a35;

    font-size: clamp(38px, 4.5vw, 56px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -1.8px;

}


.mpp-calculator-heading h2 span {

    color: var(--mp-gold);

}


.mpp-calculator-heading p {

    max-width: 650px;

    margin: auto;

    color: #7c838d;

    font-size: 11px;

    line-height: 1.9;

}


/* =========================================================
   MAIN BOX
========================================================= */

.mpp-calculator-box {

    position: relative;

    z-index: 2;

    overflow: hidden;

    border-radius: 20px;

    background: #fff;

    border: 1px solid #e4e9ef;

    box-shadow:
        0 25px 70px rgba(15,30,55,.08);

}


/* =========================================================
   FORM
========================================================= */

.mpp-calculator-form {

    padding: 45px;

}


.mpp-calc-small-title {

    color: var(--mp-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.8px;

}


.mpp-calc-form-title h3 {

    margin: 7px 0 5px;

    color: #111a35;

    font-size: 25px;

    font-weight: 800;

}


.mpp-calc-form-title p {

    margin: 0 0 35px;

    color: #8a9099;

    font-size: 13px;

}


/* =========================================================
   FIELD
========================================================= */

.mpp-calc-field {

    margin-bottom: 30px;

}


.mpp-calc-label-row {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;

    margin-bottom: 14px;

}


.mpp-calc-label-row label {

    color: #263047;

    font-size: 14px;

    font-weight: 700;

}


.mpp-calc-input-box {

    display: flex;

    align-items: center;

    gap: 4px;

    padding: 5px 9px;

    min-width: 115px;

    border-radius: 7px;

    background: #f7f9fb;

    border: 1px solid #e4e8ed;

}


.mpp-calc-input-box span {

    color: #8a9098;

    font-size: 13px;

    white-space: nowrap;

}


.mpp-calc-input-box input {

    width: 90px;

    padding: 3px;

    border: 0;

    outline: none;

    background: transparent;

    color: #111a35;

    font-size: 14px;

    font-weight: 800;

    text-align: right;

}


/* =========================================================
   RANGE
========================================================= */

.mpp-range {

    width: 100%;

    height: 5px;

    appearance: none;

    -webkit-appearance: none;

    border-radius: 10px;

    outline: none;

    background:
        linear-gradient(
            to right,
            #e9a513 0%,
            #e9a513 20%,
            #e6e9ed 20%,
            #e6e9ed 100%
        );

    cursor: pointer;

}


.mpp-range::-webkit-slider-thumb {

    appearance: none;

    -webkit-appearance: none;

    width: 18px;

    height: 18px;

    border-radius: 50%;

    background: #fff;

    border: 4px solid #e9a513;

    box-shadow:
        0 3px 10px rgba(0,0,0,.15);

}


.mpp-range::-moz-range-thumb {

    width: 18px;

    height: 18px;

    border-radius: 50%;

    background: #fff;

    border: 4px solid #e9a513;

}


.mpp-range-values {

    display: flex;

    justify-content: space-between;

    margin-top: 8px;

}


.mpp-range-values span {

    color: #9ca2aa;

    font-size: 12px;

}


/* =========================================================
   APPLY BUTTON
========================================================= */

.mpp-calc-action {

    margin-top: 8px;

}


.mpp-calc-apply-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    padding: 13px 23px;

    border-radius: 7px;

    background: #e9a513;

    color: #fff;

    font-size: 13px;

    font-weight: 800;

    text-decoration: none;

    transition: all .3s ease;

}


.mpp-calc-apply-btn i {

    transition: transform .3s ease;

}


.mpp-calc-apply-btn:hover {

    color: #fff;

    background: #111a35;

    transform: translateY(-2px);

}


.mpp-calc-apply-btn:hover i {

    transform: translateX(4px);

}


/* =========================================================
   RESULT
========================================================= */

.mpp-calc-result {

    height: 100%;

    padding: 40px;

    color: #fff;

    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(233,165,19,.15),
            transparent 35%
        ),
        linear-gradient(
            145deg,
            #152541,
            #081329
        );

}


.mpp-result-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

}


.mpp-result-top span {

    color: #e9a513;

    font-size: 6.5px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.mpp-result-top h3 {

    margin: 6px 0 0;

    color: #fff;

    font-size: 20px;

    font-weight: 800;

}


.mpp-result-icon {

    width: 44px;
    height: 44px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    background: rgba(233,165,19,.12);

    color: #e9a513;

    font-size: 16px;

}


/* =========================================================
   TOTAL
========================================================= */

.mpp-total-payable {

    margin: 32px 0 25px;

    padding-bottom: 25px;

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

}


.mpp-total-payable span {

    display: block;

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

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 1px;

}


.mpp-total-payable strong {

    display: block;

    margin: 7px 0 2px;

    color: #fff;

    font-size: 36px;

    line-height: 1;

    font-weight: 800;

}


.mpp-total-payable small {

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

    font-size: 12px;

}


/* =========================================================
   BREAKDOWN
========================================================= */

.mpp-result-breakdown {

    display: flex;

    flex-direction: column;

    gap: 13px;

}


.mpp-result-row {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;

}


.mpp-result-row span {

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

    font-size: 13px;

}


.mpp-result-row strong {

    color: #fff;

    font-size: 13px;

}


/* =========================================================
   DAILY PAYMENT
========================================================= */

.mpp-daily-payment {

    margin-top: 28px;

    padding: 14px;

    display: flex;

    align-items: center;

    gap: 12px;

    border-radius: 10px;

    background:
        rgba(233,165,19,.09);

    border: 1px solid
        rgba(233,165,19,.18);

}


.mpp-daily-icon {

    width: 38px;
    height: 38px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 8px;

    background: #e9a513;

    color: #fff;

}


.mpp-daily-payment span {

    display: block;

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

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 1px;

}


.mpp-daily-payment strong {

    display: block;

    margin-top: 3px;

    color: #fff;

    font-size: 15px;

}


/* =========================================================
   NOTE
========================================================= */

.mpp-calculator-note {

    margin: 20px 0 0;

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

    font-size: 12px;

    line-height: 1.7;

}


.mpp-calculator-note i {

    margin-right: 4px;

    color: #e9a513;

}


/* =========================================================
   FEATURES
========================================================= */

.mpp-calc-features {

    position: relative;

    z-index: 2;

    margin-top: 20px;

    display: grid;

    grid-template-columns:
        repeat(4,1fr);

    gap: 10px;

}


.mpp-calc-features > div {

    padding: 14px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    border-radius: 8px;

    background: #fff;

    border: 1px solid #e7ebef;

}


.mpp-calc-features i {

    color: var(--mp-gold);

    font-size: 14px;

}


.mpp-calc-features span {

    color: #737a84;

    font-size: 12px;

    font-weight: 700;

}


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

@media (max-width: 991px) {

    .mpp-calculator-section {

        padding: 85px 0;

    }

    .mpp-calculator-form {

        padding: 35px;

    }

    .mpp-calc-result {

        padding: 35px;

    }

    .mpp-calc-features {

        grid-template-columns:
            repeat(2,1fr);

    }

}


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

@media (max-width: 767px) {

    .mpp-calculator-section {

        padding: 70px 0;

    }

    .mpp-calculator-heading h2 {

        font-size: 37px;

    }

    .mpp-calculator-heading p {

        font-size: 14px;

    }

    .mpp-calculator-form {

        padding: 27px 20px;

    }

    .mpp-calc-form-title h3 {

        font-size: 22px;

    }

    .mpp-calc-label-row {

        align-items: flex-start;

        flex-direction: column;

    }

    .mpp-calc-input-box {

        width: 100%;

        justify-content: space-between;

    }

    .mpp-calc-input-box input {

        width: 100%;

    }

    .mpp-calc-result {

        padding: 30px 20px;

    }

    .mpp-total-payable strong {

        font-size: 32px;

    }

}


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

@media (max-width: 480px) {

    .mpp-calc-features {

        grid-template-columns: 1fr;

    }

    .mpp-calculator-heading h2 {

        font-size: 32px;

    }

}
 /* =========================================================
    URGENT MUDRA
    GRIEVANCE FOOTER BLOCK
 ========================================================= */

.um-grievance-block {

    position: relative;

    display: flex;

    align-items: stretch;

    width: 100%;
margin-top: 30px;
    padding: 15px;

    
border-radius: 10px;
    background: rgba(255, 255, 255, .035);
    border: 1px solid rgba(255, 255, 255, .06);

    overflow: hidden;

    box-shadow:
        0 8px 30px rgba(15, 35, 55, .05);

}


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

.um-grievance-brand {

    width: 28%;

    padding: 5px 35px 5px 10px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

    border-right: 1px solid #e2e9e7;

    position: relative;

}


/* Decorative Gold Curve */

.um-grievance-brand::after {

    content: "";

    position: absolute;

    width: 120px;

    height: 120px;

    right: -60px;

    bottom: -75px;

    border-radius: 50%;

    border: 1px solid rgba(18, 55, 92, .06);

}


/* LOGO */

.um-grievance-logo {

    width: 150px;

    margin-bottom: 12px;

}

.um-grievance-logo img {

    width: 100%;

    height: auto;

    display: block;

}


/* PLATFORM TEXT */

.um-grievance-platform {

    margin: 5px 0 3px;

    color: #7a858d;

    font-size: 14px;

    line-height: 1.5;

}


/* COMPANY */

.um-grievance-brand h4 {

    margin: 0;

    color: #fff;

    font-size: 15px;

    font-weight: 700;

    line-height: 1.4;

}


/* =========================================================
   NBFC BADGE
========================================================= */

.um-nbfc-badge {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    margin-top: 18px;

    padding: 9px 15px;

    color: #58716f;

    background: #f6faf8;

    border: 1px solid #dceae5;

    border-radius: 30px;

    font-size: 12px;

    font-weight: 600;

}

.um-nbfc-badge i {

    color: #477b72;

    font-size: 14px;

}


/* =========================================================
   RIGHT CONTENT
========================================================= */

.um-grievance-content {

    width: 72%;

    padding: 2px 5px 2px 45px;

}


/* HEADING */

.um-grievance-heading {

    display: flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 18px;

}


.um-grievance-icon {

    width: 55px;

    height: 55px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 15px;

    color: #3c6e68;

    background: #f1f7f5;

    border: 1px solid #dcebe6;

    font-size: 20px;

}


.um-grievance-heading h3 {

    margin: 0;

    color: #fff;

    font-size: 16px;

    font-weight: 750;

}


/* =========================================================
   TEXT
========================================================= */

.um-grievance-text p {

    margin: 0 0 12px;

    color: #607080;

    font-size: 14px;

    line-height: 1.75;

}

.um-grievance-text p:last-child {

    margin-bottom: 18px;

}

.um-grievance-text strong {

    color: #263c54;

    font-weight: 750;

}


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

.um-grievance-contacts {

    display: flex;

    align-items: center;

    gap: 14px;

}


.um-grievance-contact {

    min-width: 280px;

    padding: 10px 14px;

    display: flex;

    align-items: center;

    gap: 12px;

    background: #f8fbfa;

    border: 1px solid #e1ebe8;

    border-radius: 12px;

    transition: all .25s ease;

}


.um-grievance-contact:hover {

    border-color: #c9ddd7;

    transform: translateY(-2px);

    box-shadow:
        0 7px 18px rgba(40, 80, 75, .06);

}


/* CONTACT ICON */

.um-contact-icon {

    width: 42px;

    height: 42px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    color: #527b74;

    background: #eaf3f0;

    font-size: 14px;

}


/* CONTACT LABEL */

.um-grievance-contact span {

    display: block;

    margin-bottom: 2px;

    color: #87939a;

    font-size: 11px;

}


/* CONTACT LINK */

.um-grievance-contact a {

    display: block;

    color: #1b3149;

    font-size: 14px;

    font-weight: 700;

    text-decoration: none;

    white-space: nowrap;

}

.um-grievance-contact a:hover {

    color: #c88908;

}


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

@media (max-width: 991px) {

    .um-grievance-block {

        padding: 25px;

    }

    .um-grievance-brand {

        width: 30%;

        padding-right: 25px;

    }

    .um-grievance-content {

        width: 70%;

        padding-left: 30px;

    }

    .um-grievance-logo {

        width: 125px;

    }

    .um-grievance-contact {

        min-width: 0;

        flex: 1;

    }

}


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

@media (max-width: 767px) {

    .um-grievance-block {

        display: block;

        padding: 25px 20px;

        border-radius: 14px;

    }


    .um-grievance-brand {

        width: 100%;

        padding: 0 0 25px;

        border-right: 0;

        border-bottom: 1px solid #e2e9e7;

    }


    .um-grievance-content {

        width: 100%;

        padding: 25px 0 0;

    }


    .um-grievance-logo {

        width: 135px;

    }


    .um-grievance-heading {

        margin-bottom: 15px;

    }


    .um-grievance-text p {

        font-size: 13px;

        line-height: 1.7;

    }


    .um-grievance-contacts {

        display: block;

    }


    .um-grievance-contact {

        width: 100%;

        margin-bottom: 10px;

    }


    .um-grievance-contact a {

        white-space: normal;

        word-break: break-word;

    }

}