.hero {
            background: #fff;
            padding: 15px 5%;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 60px;
            /* align-items: end; */
            min-height: 500px;
            position: relative;
            overflow: hidden;
        }
        .hero .hero-img{
            margin-bottom:10px;
            padding-left: 25%;
        }
        .hero-badge {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            background: #E37028;
            color: #fff;
            font-size: 14px;
            font-weight: 500;
            padding: 6px 14px;
            border-radius: 100px;
            border: 1px solid #E37028;
            margin-bottom: 20px;
        }
        .hero-badge::before { content: '★'; font-size: 11px; }
        .hero h1 {
            font-family: "Poppins", Arial, sans-serif;
            /* font-size: clamp(34px, 4.5vw, 42px); */
            font-size: clamp(18px, 20vw, 32px);
            line-height: 1.15;
            font-weight: 500;
            color: #000000;
            margin-bottom: 5px;
            display: flex;
            flex-wrap: wrap;
            max-width: 435px;
        }
        .hero h1 em {
            font-style: normal;
            color: #E37028; 
            margin-left: 7px;
            /* display: block; */
        }
        .hero-sub {
            max-width: 500px;
            margin-bottom: 36px;
            letter-spacing: -0.05em;
            font-size: 1.2rem;
        }
        .hero-stats {
            display: flex;
            gap: 32px;
            padding-bottom: 30px;
        }
        .hero-stat { color: #000000; }
        .hero-stat-num {
            font-size: 26px;
            font-weight: 700;
            color: #E37028;
            display: block;
            line-height: 1;
            margin-bottom: 4px;
            text-align: center;
        }
        .hero-stat-label { 
            letter-spacing: -0.05em;
            font-size: 1.2rem;
         }


        /* Score Meter Card */
        .score-card {
            background: #c8763926;
            padding: 15px 32px;
            border: 1px solid #c8763952;
            border-radius: 22px;
            /* border-bottom: unset; */
            position: relative;
            align-self: start;
            max-width: 560px;
        }
        .score-card .score-card-img{
            display: none;
            text-align: center;
        }
        .score-card .score-card-heading{
            display: block;
        }
        .score-card-label {
            font-size: 12px;
            font-weight: 600;
            letter-spacing: 1px;
            text-transform: uppercase;
            color: #6B7280;
            margin-bottom: 20px;
        }

        /* Form CSS*/
        .highlight {
            color: #ff4d4f;
            font-weight: 600;
        }

        .form-control {
            border-radius: 8px;
            font-size: 14px;
            padding: 10px;
        }

        .form-check-label {
            font-size: 12px;
        }

        .submit-btn {
            width: 100%;
            background: #111;
            color: #fff;
            padding: 12px;
            border-radius: 30px;
            border: none;
            font-weight: 500;
        }

        /* TABLET AND UP */
        @media (min-width: 768px) {
            .left-panel {
            text-align: left;
            padding: 40px 30px;
            }

            .left-panel h4 {
            font-size: 22px;
            }

            .right-panel {
            padding: 40px;
            }

            .submit-btn {
            width: auto;
            padding: 12px 30px;
            }
        }

        /* OTP Modal */
        .otp-modal {
            border-radius: 12px;
            border: none;
            padding: 10px;
        }

        .otp-title {
            font-size: 20px;
            font-weight: 700;
            margin: 0;
        }

        .title-line {
            width: 50px;
            height: 3px;
            background: #fd7e14;
            margin-top: 8px;
            border-radius: 10px;
        }

        .custom-close {
            font-size: 12px;
            border: 2px solid #000;
            border-radius: 50%;
            padding: 8px;
            opacity: 1;
        }

        .otp-subtitle {
            font-size: 28px;
            font-weight: 700;
        }

        .otp-box-wrapper {
            gap: 10px;
        }

        .otp-input {
            width: 48px;
            height: 48px;
            border: none;
            background: #f1f1f1;
            border-radius: 6px;
            text-align: center;
            font-size: 22px;
            font-weight: 600;
            outline: none;
        }

        .otp-input:focus {
            border: 2px solid #000;
            background: #fff;
        }

        .otp-link {
            color: #4b3df0;
            font-size: 14px;
            text-decoration: underline;
            margin-bottom: 5px;
        }

        .otp-submit-btn {
            background: #111;
            color: #fff;
            border: none;
            border-radius: 30px;
            padding: 12px 40px;
            font-size: 18px;
            font-weight: 500;
        }

        /* Mobile */
        @media(max-width:576px){
            .otp-subtitle {
                font-size: 22px;
            }

            .otp-input {
                width: 40px;
                height: 40px;
                font-size: 18px;
            }

            .otp-submit-btn {
                width: 100%;
            }
        }
        
        /* ── TRUST STRIP ── */
        .trust-strip {
            background: #F7F8FA;
            border-bottom: 1px solid #EAECF0;
            padding: 18px 5%;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 48px;
            flex-wrap: wrap;
        }
        .trust-item {
            display: flex;
            align-items: center;
            gap: 9px;
        }
        .trust-icon {
            width: 32px; height: 32px;
            background: #111111;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }
        .trust-icon svg { width: 16px; height: 16px; fill: #ffffff; }
        
        .fw-600{
            font-weight: 600;
        }
        /* ─── WHAT IS CREDIT SCORE ─── */
        .section-tag {
            display: inline-block;
            background: rgb(200 118 57 / 30%);
            border: 1px solid #E37028;
            color: #E37028;
            font-weight: 600;
            font-size: 0.78rem;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            padding: 5px 14px;
            border-radius: 100px;
            margin-bottom: 16px;
        }
        .section-title {
            font-size: clamp(24px, 4.5vw, 36px);
            font-family: "Poppins", Arial, sans-serif;
            line-height: 1.15;
            font-weight: 500;
            color: #fff;
            margin-bottom: 10px;
        }
        .section-sub { color: #8A8F9E; font-size: 1rem; line-height: 1.15; }

        .info-section { background: #0A0A0A; padding: 80px 5%;}
        .info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; margin-top: 20px;}
        .info-text p { 
            color: #e8eaf0; 
            letter-spacing: -0.05em;
            font-size: 1.2rem;
            margin-bottom: 16px; 
        }
        .info-text p strong { color: #fff; }
        /* ─── LOAN BANNER ─── */
        .loan-banner {
            background: linear-gradient(90deg, rgba(27,117,188,0.15), rgba(247,148,29,0.08));
            border: 1px solid rgba(27,117,188,0.2);
            border-radius: 14px; padding: 18px 24px;
            display: flex; align-items: center; justify-content: space-between; gap: 16px;
            margin-top: 48px; flex-wrap: wrap;
        }
        .loan-banner-text {
            color: #e8eaf0;
            letter-spacing: -0.05em;
            font-size: 1rem;
            margin-bottom: 16px; 
        }
        .loan-banner-text strong { color: var(--blue); font-weight: 600; }

        .score-table { background: #1C1F26; border: 1px solid rgba(255,255,255,0.08);; border-radius: 16px; overflow: hidden; }
        .score-table-head {
            display: grid; grid-template-columns: 1fr 1fr 1fr;
            background: rgba(255,255,255,0.04);
            padding: 12px 20px;
            font-size: 0.75rem; font-weight: 600; color: #e8eaf0; letter-spacing: 0.06em; text-transform: uppercase;
        }
        .score-row {
            display: grid; grid-template-columns: 1fr 1fr 1fr;
            padding: 14px 20px;
            border-top: 1px solid rgba(255,255,255,0.08);;
            align-items: center;
            transition: background 0.2s;
        }
        .score-row span{
            color : #e8eaf0;
        }
        .score-row:hover { background: rgba(255,255,255,0.02); }
        .score-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; margin-right: 8px; }
        .badge { display: inline-block; font-size: 0.75rem; font-weight: 600; padding: 3px 10px; border-radius: 100px; }

        /* ─── SCORE RANGE VISUAL ─── */
        .range-section { background: #111214; padding: 80px 5%;}
        .range-section .section-sub{ color: #b6b9c3;}
        .range-visual { margin-top: 48px; }
        .range-bar-full {
            height: 14px; border-radius: 100px;
            background: linear-gradient(to right, rgb(221, 65, 46), rgb(227, 134, 58), rgb(223, 180, 42), rgb(150, 193, 108), rgb(21, 152, 57));
            margin-bottom: 8px;
            position: relative;
        }
        .range-labels {
            display: flex; justify-content: space-between;
            font-size: 0.75rem; color: #b6b9c3; margin-bottom: 32px;
        }
        .range-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
        .range-card {
            background: #1C1F26; border: 1px solid rgba(255,255,255,0.08); border-radius: 12px;
            padding: 18px 14px; text-align: center;
        }
        .range-card .rc-range { font-size: 1rem; font-weight: 700; margin-bottom: 4px; }
        .range-card .rc-label { font-size: 0.75rem; font-weight: 600; margin-bottom: 6px; }
        .range-card .rc-desc { font-size: 0.72rem; color: #b6b9c3; line-height: 1.5; }

        
        /* ─── HOW IT WORKS ─── */
        #how-it-works {
            padding: 80px 5%;
        }
        #how-it-works .section-tag {
            background: unset;
            border: none;
            margin-bottom: 12px;
        }
        #how-it-works .section-title {
            color: #000;
        }
        #how-it-works .steps-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
            gap: 0;
            margin-top: 52px;
            position: relative;
        }
        #how-it-works .steps-grid::after {
            content: '';
            position: absolute;
            top: 28px; left: 10%; right: 10%;
            height: 1px;
            background: linear-gradient(to right, transparent, #EAECF0, #EAECF0, transparent);
        }
        #how-it-works .step-card {
            text-align: center;
            padding: 0 24px;
            position: relative;
            z-index: 1;
        }
        #how-it-works .step-num-wrap {
            width: 52px; height: 52px;
            background: #0D1B3E;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 20px;
            font-family: 'Playfair Display', serif;
            font-size: 20px;
            font-weight: 700;
            color: #ff6d00;
            border: 3px solid #fff;
            box-shadow: 0 0 0 1px #EAECF0;
        }
        #how-it-works .step-title {
            font-size: 16px;
            font-weight: 600;
            color: #0D1B3E;
            margin-bottom: 10px;
        }
        #how-it-works .step-desc { font-size: 14px; color: #6B7280; line-height: 1.6; }
        /* ─── BENEFITS ─── */
        .benefits-section { background: #111214; padding: 80px 5%;}
        .benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 48px; }
        .benefit-card {
            background: #1C1F26; border: 1px solid rgba(255,255,255,0.08); border-radius: 16px;
            padding: 28px; transition: border-color 0.3s, transform 0.3s;
        }
        .benefit-card:hover { border-color: rgba(27,117,188,0.4); transform: translateY(-4px); }
        .benefit-icon { font-size: 2rem; margin-bottom: 14px; }
        .benefit-card h3 {font-size: 1.05rem;font-weight: 700;margin-bottom: 8px;color: #e9eaf0;}
        .benefit-card p {font-size: 0.85rem;line-height: 1.6;color: #b6b9c3;}

        
        /* ─── TIPS ─── */
        #score-tips {
            padding: 80px 5%;
            background: #0A0A0A;
        }
        .tips-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin-top: 48px; }
        .tip-card {
            background: #1C1F26; border: 1px solid rgba(255,255,255,0.08); border-radius: 14px;
            padding: 22px; display: flex; gap: 16px; align-items: flex-start;
            transition: border-color 0.3s;
        }
        .tip-card:hover { border-color: rgba(57,181,74,0.3); }
        .tip-icon {
            width: 42px; height: 42px; border-radius: 10px; flex-shrink: 0;
            background: rgba(57,181,74,0.1); border: 1px solid rgba(57,181,74,0.2);
            display: flex; align-items: center; justify-content: center; font-size: 1.2rem;
        }
        .tip-card h3 { font-size: 0.95rem; font-weight: 600; margin-bottom: 4px; color: #e9eaf0;}
        .tip-card p { font-size: 0.83rem; color: #8A8F9E; line-height: 1.55; }


        /* ── FAQ ── */
        .faq-section { background: #fff; padding: 80px 5%;}
        .faq-section .section-title{color: #000;}
        .faq-section .section-tag {
            background-color: #E37028;
            border: 1px solid;
            border-color: #E37028 #E37028 #bf5919;
            color: #FFF;
        }
        .faq-grid {
            max-width: 800px;
            margin: 0 auto;
            margin-top: 48px;
        }
        /* .faq-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 16px;
            margin-top: 52px;
            align-items: start;
        } */
        .faq-item {
            border: 1px solid #EAECF0;
            border-radius: 14px;
            overflow: hidden;
            margin-bottom: 10px;
        }
        .faq-q {
            width: 100%;
            background: none;
            border: none;
            padding: 20px 24px;
            text-align: left;
            font-family: "Poppins", Arial, sans-serif;
            font-size: 15px;
            font-weight: 600;
            color: #0D1B3E;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 12px;
            transition: background 0.15s;
        }
        .faq-q:hover { background: #F7F8FA; }
        .faq-q .arrow {
            flex-shrink: 0;
            width: 20px; height: 20px;
            background: #EAECF0;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 12px;
            transition: transform 0.25s, background 0.15s;
        }
        .faq-item.open .faq-q .arrow { transform: rotate(180deg); background: #0D1B3E; color: #fff; }
        .faq-a {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease, padding 0.3s;
            padding: 0 24px;
            font-size: 14px;
            color: #6B7280;
            line-height: 1.7;
        }
        .faq-item.open .faq-a { max-height: 300px; padding: 0 24px 20px; }

        
    /* ── DISCLAIMER BANNER ── */
    .disclaimer-bar {
        background: #eacbb45e;
        border-top: 1px solid rgb(200 118 57);
        padding: 17px 5%;
        font-size: 13px;
        color: #c87639;
        text-align: center;
        line-height: 1.6;
    }

    /* ── RESPONSIVE ── */
    @media (max-width: 900px) {
        .hero { grid-template-columns: 1fr; padding-bottom: 40px; }
        .hero h1 em{display: block; margin-left: unset;}
        .hero .hero-img{display: none;}
        .hero-stats { gap: 20px; flex-wrap: wrap; }
        .score-card { border-radius: 22px; margin-top: 0; order: -1;}
        .score-card .score-card-img{
            display: block;
        }
        .score-card .score-card-heading{
            display: none;
        }
        .benefits-grid { grid-template-columns: 1fr 1fr; }
        .range-cards { grid-template-columns: repeat(3, 1fr); }
        .faq-grid { grid-template-columns: 1fr; }
        #how-it-works .steps-grid { grid-template-columns: repeat(2, 1fr); }
        .tips-grid { grid-template-columns: 1fr; }
        .info-grid { grid-template-columns: 1fr; }
    }
    @media (max-width: 600px) {
        .hero { padding: 20px 4% 0; }
        .hero .hero-img{display: none;}
        .hero h1 em{display: block; margin-left: unset;}
        .hero-stats { gap: 20px; flex-wrap: wrap; }
        .score-card { margin-top: 10px; order: -1;}
        .score-card .score-card-img{
            display: block;
        }
        .score-card .score-card-heading{
            display: none;
        }
        .benefits-grid { grid-template-columns: 1fr; }
        .range-cards { grid-template-columns: 1fr 1fr; }
        .trust-strip { gap: 20px; justify-content: flex-start; overflow-x: auto; }
        #how-it-works .steps-grid { grid-template-columns: 1fr; }
        .tips-grid { grid-template-columns: 1fr; }
    }

    /* Animation */
    @keyframes fadeInUp {
        from { opacity: 0; transform: translateY(18px); }
        to { opacity: 1; transform: translateY(0); }
    }
    .hero > * { animation: fadeInUp 0.5s ease both; }
    .hero > *:nth-child(2) { animation-delay: 0.12s; }