<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <link rel="icon" type="image/png" href="{{ asset($setting->favicon_image) }}">
    <link rel="preload"
        href="{{ asset('frontend') }}/assets-desktop/css/test-prep-register.css?v={{ env('ASSETS_VERSION') }}"
        as="style" onload="this.onload=null;this.rel='stylesheet'">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css">

    <link rel="prefetch"
        href="{{ asset('frontend') }}/assets-desktop/images/start-journey/country-logo/checkmark.svg" />
    {{-- popup csss for authmodal --}}
    <link rel="stylesheet"
        href="{{ asset('frontend') }}/assets-desktop/css/modals/plan-lead-popup.css?v={{ env('ASSETS_VERSION') }}">
    <link rel="stylesheet"
        href="{{ asset('frontend') }}/assets-desktop/css/modals/plan-lead-validate-popup.css?v={{ env('ASSETS_VERSION') }}">
    <link rel="stylesheet"
        href="{{ asset('frontend') }}/assets-desktop/css/modals/login-pin-popup.css?v={{ env('ASSETS_VERSION') }}">
    <link rel="stylesheet"
        href="{{ asset('frontend') }}/assets-desktop/css/modals/login-success.css?v={{ env('ASSETS_VERSION') }}">
    <link rel="stylesheet" type="text/css"
        href="{{ asset('frontend') }}/assets-desktop/css/modals/authModal-new.css?v={{ env('ASSETS_VERSION') }}">
    {{-- Popup Modal css end --}}
    <script src="{{ asset('frontend') }}/assets-desktop/js/lottie.min.js?v={{ env('ASSETS_VERSION') }}"></script>

    <script src="{{ asset('frontend') }}/assets-desktop/js/jquery-3.7.0.js?v={{ env('ASSETS_VERSION') }}"></script>
    <script src="{{ asset('frontend') }}/assets-desktop/js/validation.js?v={{ env('ASSETS_VERSION') }}"></script>

    @if (env('APP_MODE') == 'live')
        <script type="text/javascript">
            (function(c, l, a, r, i, t, y) {
                c[a] = c[a] || function() {
                    (c[a].q = c[a].q || []).push(arguments)
                };
                t = l.createElement(r);
                t.async = 1;
                t.src = "https://www.clarity.ms/tag/" + i;
                y = l.getElementsByTagName(r)[0];
                y.parentNode.insertBefore(t, y);
            })(window, document, "clarity", "script", "hrxmeqet4g");
        </script>
    @endif

</head>

<body>
    {{-- <div class="d-content"> --}}
        <div class="progress-container">
            {{-- <div class="progress-bar" id="progress-bar"></div> --}}
            <input type="range" name="progressBar" id="progressBar" class="progress-bar" min="0" max="5"
                value="3" disabled>
        </div>
        <main>

            {{-- <section class="welcome-screen-section show" style="">
                <div class="welcome-content">
                    <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/gradding-logo.svg" alt="">
                    <h1>Welcome to Gradding’s FREE Study Planner Tool</h1>
                    <p>Start your abroad journey with us!</p>
                    <a href="" class="blue-btn">Let’s Get Started <svg xmlns="http://www.w3.org/2000/svg"
                            width="16" height="16" viewBox="0 0 16 16" fill="none">
                            <path fill-rule="evenodd" clip-rule="evenodd"
                                d="M8.47005 3.13696C8.21036 2.87727 7.78932 2.87727 7.52963 3.13696C7.2701 3.39648 7.26991 3.8172 7.52921 4.07696L10.7798 7.33341H3.33317C2.96498 7.33341 2.6665 7.63189 2.6665 8.00008C2.6665 8.36827 2.96498 8.66675 3.33317 8.66675H10.7798L7.52921 11.9232C7.26991 12.183 7.2701 12.6037 7.52963 12.8632C7.78932 13.1229 8.21036 13.1229 8.47005 12.8632L13.3332 8.00008L8.47005 3.13696Z"
                                fill="white" />
                        </svg></a>
                </div>
            </section> --}}
            {{-- <div class="gradding-title-logo">
                <svg xmlns="http://www.w3.org/2000/svg" width="167" height="50" viewBox="0 0 167 50" fill="none">
                    <path d="M13.3414 26.5067H33.4632V27.1551C33.4632 35.927 25.7651 42.8301 17.1523 42.8301C8.31093 42.8301 0.574707 36.0414 0.574707 26.7737C0.574707 17.6967 8.27282 10.7173 16.9618 10.7173C24.698 10.7173 30.3382 15.9804 31.9007 20.3664H25.0791C23.7453 18.3069 20.9252 16.0186 16.8475 16.0186C9.91153 16.0567 6.29113 22.0064 6.29113 26.8118C6.29113 31.5029 9.83531 37.4907 17.1523 37.4907C20.9252 37.4907 24.4694 35.3931 26.2605 31.808H13.3414V26.5067Z" fill="#055AAB"/>
                    <path d="M88.6859 32.0747C88.6859 28.6041 90.0959 25.5149 92.4206 23.3028V10.5645C92.4206 10.5645 88.3429 10.8314 88.3048 15.6369C88.2286 20.4043 88.3048 24.2181 88.3048 24.2181V24.2563C86.3231 22.3112 83.6173 21.0908 80.5685 21.0908C74.5091 21.0908 69.593 26.0107 69.593 32.0747C69.593 38.1388 74.5091 43.0587 80.5685 43.0587C83.6173 43.0587 86.3993 41.8001 88.4191 39.7788C88.6859 40.5415 89.5243 41.9908 92.4587 41.9908V40.8466C90.134 38.6346 88.6859 35.4691 88.6859 32.0747ZM80.6067 37.91C77.3673 37.91 74.7378 35.2784 74.7378 32.0366C74.7378 28.7948 77.3673 26.1632 80.6067 26.1632C83.846 26.1632 86.4755 28.7948 86.4755 32.0366C86.4374 35.3165 83.8079 37.91 80.6067 37.91Z" fill="#096DBF"/>
                    <path d="M108.649 15.5988C108.573 20.3661 108.649 24.18 108.649 24.18V24.2181C106.667 22.2731 103.961 21.0526 100.913 21.0526C94.8531 21.0526 89.937 25.9725 89.937 32.0366C89.937 38.1006 94.8531 43.0205 100.913 43.0205C103.961 43.0205 106.743 41.762 108.763 39.7406C109.03 40.5034 109.868 41.9527 112.803 41.9527V10.5645C112.765 10.5645 108.725 10.8314 108.649 15.5988ZM100.913 37.91C97.6732 37.91 95.0437 35.2784 95.0437 32.0366C95.0437 28.7948 97.6732 26.1632 100.913 26.1632C104.152 26.1632 106.781 28.7948 106.781 32.0366C106.781 35.3165 104.152 37.91 100.913 37.91Z" fill="url(#paint0_linear_3193_7947)"/>
                    <path d="M37.2329 22.6543H41.5012V24.3705H41.5774C42.4539 23.1119 43.3304 21.9678 45.7313 21.9678H46.1124V26.5063C41.9204 26.697 41.9204 30.0151 41.9204 31.1974V42.105H37.2329V22.6543Z" fill="#0762B3"/>
                    <path d="M67.6836 42.1051H63.4153V39.6642C61.9671 41.4186 59.0708 42.6772 56.6318 42.6772C51.6395 42.6772 47.1807 38.6726 47.1807 32.189C47.1807 26.2394 51.5251 21.9297 56.8986 21.9297C60.862 21.9297 63.2248 24.7901 63.3391 25.0189H63.4153V22.5399H67.6836V42.1051ZM57.5846 26.2775C53.7736 26.2775 51.7919 29.5574 51.7919 32.4941C51.7919 35.7741 54.269 38.4819 57.5846 38.4819C60.7858 38.4819 63.2629 35.9648 63.2629 32.3416C63.2629 28.2989 60.3665 26.2775 57.5846 26.2775Z" fill="#0867B9"/>
                    <path d="M117.184 16.2085H121.872V20.48H117.184V16.2085ZM117.184 22.6539H121.872V42.1047H117.184V22.6539Z" fill="#0B7ACB"/>
                    <path d="M125.609 22.6543H129.916V24.3324C130.716 23.5696 132.316 21.9678 135.213 21.9678C136.89 21.9678 139.443 22.7305 141.044 24.6756C142.835 26.8114 142.835 30.0532 142.835 31.5406V42.0669H138.147V32.4941C138.147 30.8922 138.147 26.2393 134.222 26.2393C133.384 26.2393 131.859 26.6588 131.059 27.9556C130.22 29.1379 130.22 31.1592 130.22 32.7992V42.0669H125.533L125.609 22.6543Z" fill="#0D7FD1"/>
                    <path d="M166.501 22.6543V38.52C166.501 47.864 159.604 49.9998 155.907 49.9998C151.905 49.9998 147.828 47.9021 146.151 43.5543H151.448C153.277 45.7282 155.526 45.7282 156.212 45.7282C158.841 45.7282 161.928 43.8976 162.157 39.6642L162.081 39.5879C161.433 40.4651 159.642 42.6771 155.716 42.6771C150.991 42.6771 145.77 38.6344 145.77 32.1508C145.77 26.0486 150.724 21.9678 155.678 21.9678C159.68 21.9678 161.357 24.2561 161.89 24.9807H161.966V22.6161L166.501 22.6543ZM156.174 26.2775C153.354 26.2775 150.495 28.5658 150.495 32.2271C150.495 36.1935 153.468 38.4819 156.288 38.4819C159.108 38.4819 161.852 36.0791 161.852 32.189C161.852 29.443 159.604 26.2775 156.174 26.2775Z" fill="#0E85D7"/>
                    <path d="M3.81095 10.4879C3.81095 10.4879 10.442 1.98297 19.8931 6.33079L23.0562 3.24155L9.75603 -0.000244141L0 10.4879H3.81095Z" fill="#055AAB"/>
                    <path d="M6.55762 12.7386L5.75732 10.2214C5.75732 10.2214 8.61554 6.06432 18.0286 6.48385L19.3243 9.61123C19.3243 9.61123 12.8838 8.5052 6.55762 12.7386Z" fill="#055AAB"/>
                    <path d="M2.47669 16.5135C3.02392 16.5135 3.46753 16.0695 3.46753 15.5219C3.46753 14.9742 3.02392 14.5303 2.47669 14.5303C1.92946 14.5303 1.48584 14.9742 1.48584 15.5219C1.48584 16.0695 1.92946 16.5135 2.47669 16.5135Z" fill="#055AAB"/>
                    <path d="M2.66874 10.0686H2.28735V15.408H2.66874V10.0686Z" fill="#055AAB"/>
                    <defs>
                    <linearGradient id="paint0_linear_3193_7947" x1="112.803" y1="26.7925" x2="89.937" y2="26.7925" gradientUnits="userSpaceOnUse">
                        <stop stop-color="#0E86D8"/>
                        <stop offset="1" stop-color="#055AAB"/>
                    </linearGradient>
                    </defs>
                </svg>
            </div> --}}

            <section class="study-planner-section multi_step_form show">

                {{-- Toast notification --}}
                <ul class="notifications">
                    <!-- li toast -->
                </ul>
                <div class="left-div">
                    <a href="/" class="gradding-logo">
                        <svg width="167" height="50" viewBox="0 0 167 50" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M13.3414 26.5072H33.4632V27.1556C33.4632 35.9275 25.7651 42.8306 17.1523 42.8306C8.31093 42.8306 0.574707 36.0419 0.574707 26.7742C0.574707 17.6972 8.27282 10.7178 16.9618 10.7178C24.698 10.7178 30.3382 15.9809 31.9007 20.3669H25.0791C23.7453 18.3074 20.9252 16.0191 16.8475 16.0191C9.91153 16.0572 6.29113 22.0069 6.29113 26.8123C6.29113 31.5034 9.83531 37.4912 17.1523 37.4912C20.9252 37.4912 24.4694 35.3936 26.2605 31.8085H13.3414V26.5072Z" fill="#055AAB"/>
                            <path d="M88.686 32.0747C88.686 28.6041 90.096 25.5149 92.4207 23.3028V10.5645C92.4207 10.5645 88.343 10.8314 88.3049 15.6369C88.2287 20.4043 88.3049 24.2181 88.3049 24.2181V24.2563C86.3232 22.3112 83.6174 21.0908 80.5687 21.0908C74.5093 21.0908 69.5931 26.0107 69.5931 32.0747C69.5931 38.1388 74.5093 43.0587 80.5687 43.0587C83.6174 43.0587 86.3994 41.8001 88.4192 39.7788C88.686 40.5415 89.5244 41.9908 92.4588 41.9908V40.8466C90.1341 38.6346 88.686 35.4691 88.686 32.0747ZM80.6068 37.91C77.3675 37.91 74.7379 35.2784 74.7379 32.0366C74.7379 28.7948 77.3675 26.1632 80.6068 26.1632C83.8461 26.1632 86.4756 28.7948 86.4756 32.0366C86.4375 35.3165 83.808 37.91 80.6068 37.91Z" fill="#096DBF"/>
                            <path d="M108.649 15.5988C108.573 20.3661 108.649 24.18 108.649 24.18V24.2181C106.667 22.2731 103.961 21.0526 100.913 21.0526C94.8531 21.0526 89.937 25.9725 89.937 32.0366C89.937 38.1006 94.8531 43.0205 100.913 43.0205C103.961 43.0205 106.743 41.762 108.763 39.7406C109.03 40.5034 109.868 41.9527 112.803 41.9527V10.5645C112.765 10.5645 108.725 10.8314 108.649 15.5988ZM100.913 37.91C97.6732 37.91 95.0437 35.2784 95.0437 32.0366C95.0437 28.7948 97.6732 26.1632 100.913 26.1632C104.152 26.1632 106.781 28.7948 106.781 32.0366C106.781 35.3165 104.152 37.91 100.913 37.91Z" fill="url(#paint0_linear_1432_1874)"/>
                            <path d="M37.2328 22.6543H41.501V24.3705H41.5773C42.4538 23.1119 43.3303 21.9678 45.7312 21.9678H46.1123V26.5063C41.9203 26.697 41.9203 30.0151 41.9203 31.1974V42.105H37.2328V22.6543Z" fill="#0762B3"/>
                            <path d="M67.6836 42.1051H63.4153V39.6642C61.9671 41.4186 59.0708 42.6772 56.6318 42.6772C51.6395 42.6772 47.1807 38.6726 47.1807 32.189C47.1807 26.2394 51.5251 21.9297 56.8986 21.9297C60.862 21.9297 63.2248 24.7901 63.3391 25.0189H63.4153V22.5399H67.6836V42.1051ZM57.5846 26.2775C53.7736 26.2775 51.7919 29.5574 51.7919 32.4941C51.7919 35.7741 54.269 38.4819 57.5846 38.4819C60.7858 38.4819 63.2629 35.9648 63.2629 32.3416C63.2629 28.2989 60.3665 26.2775 57.5846 26.2775Z" fill="#0867B9"/>
                            <path d="M117.184 16.209H121.872V20.4805H117.184V16.209ZM117.184 22.6544H121.872V42.1052H117.184V22.6544Z" fill="#0B7ACB"/>
                            <path d="M125.609 22.6543H129.916V24.3324C130.716 23.5696 132.317 21.9678 135.213 21.9678C136.89 21.9678 139.443 22.7305 141.044 24.6756C142.835 26.8114 142.835 30.0532 142.835 31.5406V42.0669H138.147V32.4941C138.147 30.8922 138.147 26.2393 134.222 26.2393C133.384 26.2393 131.859 26.6588 131.059 27.9556C130.221 29.1379 130.221 31.1592 130.221 32.7992V42.0669H125.533L125.609 22.6543Z" fill="#0D7FD1"/>
                            <path d="M166.501 22.6543V38.52C166.501 47.864 159.604 49.9998 155.907 49.9998C151.906 49.9998 147.828 47.9021 146.151 43.5543H151.448C153.277 45.7282 155.526 45.7282 156.212 45.7282C158.841 45.7282 161.928 43.8976 162.157 39.6642L162.081 39.5879C161.433 40.4651 159.642 42.6771 155.716 42.6771C150.991 42.6771 145.77 38.6344 145.77 32.1508C145.77 26.0486 150.724 21.9678 155.678 21.9678C159.68 21.9678 161.357 24.2561 161.89 24.9807H161.966V22.6161L166.501 22.6543ZM156.174 26.2775C153.354 26.2775 150.495 28.5658 150.495 32.2271C150.495 36.1935 153.468 38.4819 156.288 38.4819C159.108 38.4819 161.852 36.0791 161.852 32.189C161.852 29.443 159.604 26.2775 156.174 26.2775Z" fill="#0E85D7"/>
                            <path d="M3.81095 10.4882C3.81095 10.4882 10.442 1.98322 19.8931 6.33104L23.0562 3.2418L9.75603 0L0 10.4882H3.81095Z" fill="#055AAB"/>
                            <path d="M6.55762 12.7386L5.75732 10.2214C5.75732 10.2214 8.61554 6.06432 18.0286 6.48385L19.3243 9.61123C19.3243 9.61123 12.8838 8.5052 6.55762 12.7386Z" fill="#055AAB"/>
                            <path d="M10.5887 7.82354L10.6647 8.18122L10.076 8.30636L10.4696 10.1581L10.0264 10.2522L9.63285 8.40055L9.04411 8.52569L8.96808 8.16801L10.5887 7.82354ZM11.9911 7.97538C12.1241 7.94712 12.2485 7.95154 12.3645 7.98865C12.48 8.02365 12.5783 8.09207 12.6595 8.19391C12.7424 8.29319 12.8006 8.42196 12.8343 8.58023L13.0529 9.60895L12.6098 9.70314L12.4039 8.73456C12.3743 8.59529 12.3168 8.49612 12.2315 8.43707C12.1457 8.3759 12.0427 8.3581 11.9224 8.38367C11.8 8.40968 11.711 8.4683 11.6554 8.55952C11.6015 8.64818 11.5893 8.76214 11.6189 8.90141L11.8248 9.86999L11.3817 9.96419L10.8838 7.62187L11.3269 7.52768L11.4985 8.33483C11.5393 8.24675 11.6027 8.17152 11.6887 8.10913C11.7743 8.04463 11.8751 8.00005 11.9911 7.97538ZM14.91 8.25811C14.9235 8.32142 14.9314 8.37929 14.9337 8.43173L13.6518 8.70421C13.6892 8.82858 13.7546 8.91834 13.8479 8.97349C13.9413 9.02864 14.0449 9.04411 14.1589 9.01989C14.3234 8.9849 14.4255 8.88932 14.4651 8.73313L14.9431 8.63154C14.9283 8.81112 14.8609 8.97102 14.7407 9.11126C14.6201 9.24938 14.4553 9.34064 14.2464 9.38504C14.0776 9.42093 13.9178 9.41629 13.767 9.37114C13.618 9.32343 13.4908 9.23907 13.3857 9.11805C13.2827 8.99659 13.2121 8.84618 13.174 8.66681C13.1354 8.48533 13.1385 8.31816 13.1832 8.1653C13.2279 8.01244 13.3089 7.88495 13.4261 7.78284C13.5434 7.68072 13.6885 7.61127 13.8616 7.57449C14.0283 7.53906 14.1847 7.54331 14.3307 7.58725C14.4789 7.63074 14.603 7.71133 14.703 7.82902C14.8047 7.94415 14.8737 8.08718 14.91 8.25811ZM14.4241 8.22905C14.3978 8.11555 14.3374 8.03356 14.2428 7.98308C14.1478 7.93049 14.0423 7.91653 13.9263 7.94119C13.8165 7.96452 13.7309 8.01802 13.6692 8.10169C13.6093 8.18281 13.5834 8.28424 13.5917 8.406L14.4241 8.22905Z" fill="white"/>
                            <path d="M2.47681 16.5135C3.02404 16.5135 3.46765 16.0695 3.46765 15.5219C3.46765 14.9742 3.02404 14.5303 2.47681 14.5303C1.92958 14.5303 1.48596 14.9742 1.48596 15.5219C1.48596 16.0695 1.92958 16.5135 2.47681 16.5135Z" fill="#055AAB"/>
                            <path d="M2.66874 10.0684H2.28735V15.4078H2.66874V10.0684Z" fill="#055AAB"/>
                            <g clip-path="url(#clip0_1432_1874)">
                            <rect x="136" y="4" width="31" height="14" rx="3" fill="url(#paint1_linear_1432_1874)"/>
                            <path d="M144.079 8.367V10.611H146.719V11.634H144.079V13.977H147.049V15H142.825V7.344H147.049V8.367H144.079ZM148.176 11.942C148.176 11.3333 148.3 10.7943 148.55 10.325C148.806 9.85567 149.151 9.49267 149.584 9.236C150.024 8.972 150.511 8.84 151.047 8.84C151.443 8.84 151.831 8.928 152.213 9.104C152.601 9.27267 152.909 9.5 153.137 9.786V6.86H154.402V15H153.137V14.087C152.931 14.3803 152.645 14.6223 152.279 14.813C151.919 15.0037 151.505 15.099 151.036 15.099C150.508 15.099 150.024 14.967 149.584 14.703C149.151 14.4317 148.806 14.0577 148.55 13.581C148.3 13.097 148.176 12.5507 148.176 11.942ZM153.137 11.964C153.137 11.546 153.049 11.183 152.873 10.875C152.704 10.567 152.48 10.3323 152.202 10.171C151.923 10.0097 151.622 9.929 151.3 9.929C150.977 9.929 150.676 10.0097 150.398 10.171C150.119 10.325 149.892 10.556 149.716 10.864C149.547 11.1647 149.463 11.524 149.463 11.942C149.463 12.36 149.547 12.7267 149.716 13.042C149.892 13.3573 150.119 13.5993 150.398 13.768C150.684 13.9293 150.984 14.01 151.3 14.01C151.622 14.01 151.923 13.9293 152.202 13.768C152.48 13.6067 152.704 13.372 152.873 13.064C153.049 12.7487 153.137 12.382 153.137 11.964ZM161.538 8.939V15H160.284V14.285C160.086 14.5343 159.825 14.7323 159.503 14.879C159.187 15.0183 158.85 15.088 158.491 15.088C158.014 15.088 157.585 14.989 157.204 14.791C156.83 14.593 156.533 14.2997 156.313 13.911C156.1 13.5223 155.994 13.053 155.994 12.503V8.939H157.237V12.316C157.237 12.8587 157.372 13.2767 157.644 13.57C157.915 13.856 158.285 13.999 158.755 13.999C159.224 13.999 159.594 13.856 159.866 13.57C160.144 13.2767 160.284 12.8587 160.284 12.316V8.939H161.538Z" fill="#CFE2F5"/>
                            </g>
                            <defs>
                            <linearGradient id="paint0_linear_1432_1874" x1="112.803" y1="26.7925" x2="89.937" y2="26.7925" gradientUnits="userSpaceOnUse">
                            <stop stop-color="#0E86D8"/>
                            <stop offset="1" stop-color="#055AAB"/>
                            </linearGradient>
                            <linearGradient id="paint1_linear_1432_1874" x1="167" y1="11" x2="136" y2="11" gradientUnits="userSpaceOnUse">
                            <stop stop-color="#0E86D8"/>
                            <stop offset="1" stop-color="#055AAB"/>
                            </linearGradient>
                            <clipPath id="clip0_1432_1874">
                            <rect x="136" y="4" width="31" height="14" rx="3" fill="white"/>
                            </clipPath>
                            </defs>
                        </svg>                   
                    </a>
                    {{-- <div class="whatsapp-mobile">
                        <a aria-label="whatsapp-chat" href="https://wa.me/919773388670">
                            <div class="whtsapp-icon">
                                <svg xmlns="http://www.w3.org/2000/svg" height="1.3rem" viewBox="0 0 448 512"><path fill="#fff" d="M380.9 97.1C339 55.1 283.2 32 223.9 32c-122.4 0-222 99.6-222 222 0 39.1 10.2 77.3 29.6 111L0 480l117.7-30.9c32.4 17.7 68.9 27 106.1 27h.1c122.3 0 224.1-99.6 224.1-222 0-59.3-25.2-115-67.1-157zm-157 341.6c-33.2 0-65.7-8.9-94-25.7l-6.7-4-69.8 18.3L72 359.2l-4.4-7c-18.5-29.4-28.2-63.3-28.2-98.2 0-101.7 82.8-184.5 184.6-184.5 49.3 0 95.6 19.2 130.4 54.1 34.8 34.9 56.2 81.2 56.1 130.5 0 101.8-84.9 184.6-186.6 184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5 2.8-3.7 5.6-14.3 18-17.6 21.8-3.2 3.7-6.5 4.2-12 1.4-32.6-16.3-54-29.1-75.5-66-5.7-9.8 5.7-9.1 16.3-30.3 1.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7 0-9.7 1.4-14.8 6.9-5.1 5.6-19.4 19-19.4 46.3 0 27.3 19.9 53.7 22.6 57.4 2.8 3.7 39.1 59.7 94.8 83.8 35.2 15.2 49 16.5 66.6 13.9 10.7-1.6 32.8-13.4 37.4-26.4 4.6-13 4.6-24.1 3.2-26.4-1.3-2.5-5-3.9-10.5-6.6z"></path></svg>
                            </div>
                        </a>
                    </div> --}}
                    <!-- Multi step form -->
                    <form id="msform">

                        <!-- Tittle -->
                        <div class="tittle">
                            <a href="/">
                                {{-- <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/gradding-logo-mobile.svg"
                                    alt="" class="gradding-logo-mobile"> --}}
                                <span class="gradding-logo-mobile">
                                    <svg width="167" height="50" viewBox="0 0 167 50" fill="none" xmlns="http://www.w3.org/2000/svg">
                                        <path d="M13.3414 26.5072H33.4632V27.1556C33.4632 35.9275 25.7651 42.8306 17.1523 42.8306C8.31093 42.8306 0.574707 36.0419 0.574707 26.7742C0.574707 17.6972 8.27282 10.7178 16.9618 10.7178C24.698 10.7178 30.3382 15.9809 31.9007 20.3669H25.0791C23.7453 18.3074 20.9252 16.0191 16.8475 16.0191C9.91153 16.0572 6.29113 22.0069 6.29113 26.8123C6.29113 31.5034 9.83531 37.4912 17.1523 37.4912C20.9252 37.4912 24.4694 35.3936 26.2605 31.8085H13.3414V26.5072Z" fill="#055AAB"/>
                                        <path d="M88.686 32.0747C88.686 28.6041 90.096 25.5149 92.4207 23.3028V10.5645C92.4207 10.5645 88.343 10.8314 88.3049 15.6369C88.2287 20.4043 88.3049 24.2181 88.3049 24.2181V24.2563C86.3232 22.3112 83.6174 21.0908 80.5687 21.0908C74.5093 21.0908 69.5931 26.0107 69.5931 32.0747C69.5931 38.1388 74.5093 43.0587 80.5687 43.0587C83.6174 43.0587 86.3994 41.8001 88.4192 39.7788C88.686 40.5415 89.5244 41.9908 92.4588 41.9908V40.8466C90.1341 38.6346 88.686 35.4691 88.686 32.0747ZM80.6068 37.91C77.3675 37.91 74.7379 35.2784 74.7379 32.0366C74.7379 28.7948 77.3675 26.1632 80.6068 26.1632C83.8461 26.1632 86.4756 28.7948 86.4756 32.0366C86.4375 35.3165 83.808 37.91 80.6068 37.91Z" fill="#096DBF"/>
                                        <path d="M108.649 15.5988C108.573 20.3661 108.649 24.18 108.649 24.18V24.2181C106.667 22.2731 103.961 21.0526 100.913 21.0526C94.8531 21.0526 89.937 25.9725 89.937 32.0366C89.937 38.1006 94.8531 43.0205 100.913 43.0205C103.961 43.0205 106.743 41.762 108.763 39.7406C109.03 40.5034 109.868 41.9527 112.803 41.9527V10.5645C112.765 10.5645 108.725 10.8314 108.649 15.5988ZM100.913 37.91C97.6732 37.91 95.0437 35.2784 95.0437 32.0366C95.0437 28.7948 97.6732 26.1632 100.913 26.1632C104.152 26.1632 106.781 28.7948 106.781 32.0366C106.781 35.3165 104.152 37.91 100.913 37.91Z" fill="url(#paint0_linear_1432_1921)"/>
                                        <path d="M37.2328 22.6543H41.501V24.3705H41.5773C42.4538 23.1119 43.3303 21.9678 45.7312 21.9678H46.1123V26.5063C41.9203 26.697 41.9203 30.0151 41.9203 31.1974V42.105H37.2328V22.6543Z" fill="#0762B3"/>
                                        <path d="M67.6836 42.1051H63.4153V39.6642C61.9671 41.4186 59.0708 42.6772 56.6318 42.6772C51.6395 42.6772 47.1807 38.6726 47.1807 32.189C47.1807 26.2394 51.5251 21.9297 56.8986 21.9297C60.862 21.9297 63.2248 24.7901 63.3391 25.0189H63.4153V22.5399H67.6836V42.1051ZM57.5846 26.2775C53.7736 26.2775 51.7919 29.5574 51.7919 32.4941C51.7919 35.7741 54.269 38.4819 57.5846 38.4819C60.7858 38.4819 63.2629 35.9648 63.2629 32.3416C63.2629 28.2989 60.3665 26.2775 57.5846 26.2775Z" fill="#0867B9"/>
                                        <path d="M117.184 16.209H121.872V20.4805H117.184V16.209ZM117.184 22.6544H121.872V42.1052H117.184V22.6544Z" fill="#0B7ACB"/>
                                        <path d="M125.609 22.6543H129.916V24.3324C130.716 23.5696 132.317 21.9678 135.213 21.9678C136.89 21.9678 139.443 22.7305 141.044 24.6756C142.835 26.8114 142.835 30.0532 142.835 31.5406V42.0669H138.147V32.4941C138.147 30.8922 138.147 26.2393 134.222 26.2393C133.384 26.2393 131.859 26.6588 131.059 27.9556C130.221 29.1379 130.221 31.1592 130.221 32.7992V42.0669H125.533L125.609 22.6543Z" fill="#0D7FD1"/>
                                        <path d="M166.501 22.6543V38.52C166.501 47.864 159.604 49.9998 155.907 49.9998C151.906 49.9998 147.828 47.9021 146.151 43.5543H151.448C153.277 45.7282 155.526 45.7282 156.212 45.7282C158.841 45.7282 161.928 43.8976 162.157 39.6642L162.081 39.5879C161.433 40.4651 159.642 42.6771 155.716 42.6771C150.991 42.6771 145.77 38.6344 145.77 32.1508C145.77 26.0486 150.724 21.9678 155.678 21.9678C159.68 21.9678 161.357 24.2561 161.89 24.9807H161.966V22.6161L166.501 22.6543ZM156.174 26.2775C153.354 26.2775 150.495 28.5658 150.495 32.2271C150.495 36.1935 153.468 38.4819 156.288 38.4819C159.108 38.4819 161.852 36.0791 161.852 32.189C161.852 29.443 159.604 26.2775 156.174 26.2775Z" fill="#0E85D7"/>
                                        <path d="M3.81095 10.4882C3.81095 10.4882 10.442 1.98322 19.8931 6.33104L23.0562 3.2418L9.75603 0L0 10.4882H3.81095Z" fill="#055AAB"/>
                                        <path d="M6.55762 12.7386L5.75732 10.2214C5.75732 10.2214 8.61554 6.06432 18.0286 6.48385L19.3243 9.61123C19.3243 9.61123 12.8838 8.5052 6.55762 12.7386Z" fill="#055AAB"/>
                                        <path d="M10.5887 7.82354L10.6647 8.18122L10.076 8.30636L10.4696 10.1581L10.0264 10.2522L9.63285 8.40055L9.04411 8.52569L8.96808 8.16801L10.5887 7.82354ZM11.9911 7.97538C12.1241 7.94712 12.2485 7.95154 12.3645 7.98865C12.48 8.02365 12.5783 8.09207 12.6595 8.19391C12.7424 8.29319 12.8006 8.42196 12.8343 8.58023L13.0529 9.60895L12.6098 9.70314L12.4039 8.73456C12.3743 8.59529 12.3168 8.49612 12.2315 8.43707C12.1457 8.3759 12.0427 8.3581 11.9224 8.38367C11.8 8.40968 11.711 8.4683 11.6554 8.55952C11.6015 8.64818 11.5893 8.76214 11.6189 8.90141L11.8248 9.86999L11.3817 9.96419L10.8838 7.62187L11.3269 7.52768L11.4985 8.33483C11.5393 8.24675 11.6027 8.17152 11.6887 8.10913C11.7743 8.04463 11.8751 8.00005 11.9911 7.97538ZM14.91 8.25811C14.9235 8.32142 14.9314 8.37929 14.9337 8.43173L13.6518 8.70421C13.6892 8.82858 13.7546 8.91834 13.8479 8.97349C13.9413 9.02864 14.0449 9.04411 14.1589 9.01989C14.3234 8.9849 14.4255 8.88932 14.4651 8.73313L14.9431 8.63154C14.9283 8.81112 14.8609 8.97102 14.7407 9.11126C14.6201 9.24938 14.4553 9.34064 14.2464 9.38504C14.0776 9.42093 13.9178 9.41629 13.767 9.37114C13.618 9.32343 13.4908 9.23907 13.3857 9.11805C13.2827 8.99659 13.2121 8.84618 13.174 8.66681C13.1354 8.48533 13.1385 8.31816 13.1832 8.1653C13.2279 8.01244 13.3089 7.88495 13.4261 7.78284C13.5434 7.68072 13.6885 7.61127 13.8616 7.57449C14.0283 7.53906 14.1847 7.54331 14.3307 7.58725C14.4789 7.63074 14.603 7.71133 14.703 7.82902C14.8047 7.94415 14.8737 8.08718 14.91 8.25811ZM14.4241 8.22905C14.3978 8.11555 14.3374 8.03356 14.2428 7.98308C14.1478 7.93049 14.0423 7.91653 13.9263 7.94119C13.8165 7.96452 13.7309 8.01802 13.6692 8.10169C13.6093 8.18281 13.5834 8.28424 13.5917 8.406L14.4241 8.22905Z" fill="white"/>
                                        <path d="M2.47681 16.5135C3.02404 16.5135 3.46765 16.0695 3.46765 15.5219C3.46765 14.9742 3.02404 14.5303 2.47681 14.5303C1.92958 14.5303 1.48596 14.9742 1.48596 15.5219C1.48596 16.0695 1.92958 16.5135 2.47681 16.5135Z" fill="#055AAB"/>
                                        <path d="M2.66874 10.0684H2.28735V15.4078H2.66874V10.0684Z" fill="#055AAB"/>
                                        <g clip-path="url(#clip0_1432_1921)">
                                        <rect x="136" y="4" width="31" height="14" rx="3" fill="url(#paint1_linear_1432_1921)"/>
                                        <path d="M144.079 8.367V10.611H146.719V11.634H144.079V13.977H147.049V15H142.825V7.344H147.049V8.367H144.079ZM148.176 11.942C148.176 11.3333 148.3 10.7943 148.55 10.325C148.806 9.85567 149.151 9.49267 149.584 9.236C150.024 8.972 150.511 8.84 151.047 8.84C151.443 8.84 151.831 8.928 152.213 9.104C152.601 9.27267 152.909 9.5 153.137 9.786V6.86H154.402V15H153.137V14.087C152.931 14.3803 152.645 14.6223 152.279 14.813C151.919 15.0037 151.505 15.099 151.036 15.099C150.508 15.099 150.024 14.967 149.584 14.703C149.151 14.4317 148.806 14.0577 148.55 13.581C148.3 13.097 148.176 12.5507 148.176 11.942ZM153.137 11.964C153.137 11.546 153.049 11.183 152.873 10.875C152.704 10.567 152.48 10.3323 152.202 10.171C151.923 10.0097 151.622 9.929 151.3 9.929C150.977 9.929 150.676 10.0097 150.398 10.171C150.119 10.325 149.892 10.556 149.716 10.864C149.547 11.1647 149.463 11.524 149.463 11.942C149.463 12.36 149.547 12.7267 149.716 13.042C149.892 13.3573 150.119 13.5993 150.398 13.768C150.684 13.9293 150.984 14.01 151.3 14.01C151.622 14.01 151.923 13.9293 152.202 13.768C152.48 13.6067 152.704 13.372 152.873 13.064C153.049 12.7487 153.137 12.382 153.137 11.964ZM161.538 8.939V15H160.284V14.285C160.086 14.5343 159.825 14.7323 159.503 14.879C159.187 15.0183 158.85 15.088 158.491 15.088C158.014 15.088 157.585 14.989 157.204 14.791C156.83 14.593 156.533 14.2997 156.313 13.911C156.1 13.5223 155.994 13.053 155.994 12.503V8.939H157.237V12.316C157.237 12.8587 157.372 13.2767 157.644 13.57C157.915 13.856 158.285 13.999 158.755 13.999C159.224 13.999 159.594 13.856 159.866 13.57C160.144 13.2767 160.284 12.8587 160.284 12.316V8.939H161.538Z" fill="#CFE2F5"/>
                                        </g>
                                        <defs>
                                        <linearGradient id="paint0_linear_1432_1921" x1="112.803" y1="26.7925" x2="89.937" y2="26.7925" gradientUnits="userSpaceOnUse">
                                        <stop stop-color="#0E86D8"/>
                                        <stop offset="1" stop-color="#055AAB"/>
                                        </linearGradient>
                                        <linearGradient id="paint1_linear_1432_1921" x1="167" y1="11" x2="136" y2="11" gradientUnits="userSpaceOnUse">
                                        <stop stop-color="#0E86D8"/>
                                        <stop offset="1" stop-color="#055AAB"/>
                                        </linearGradient>
                                        <clipPath id="clip0_1432_1921">
                                        <rect x="136" y="4" width="31" height="14" rx="3" fill="white"/>
                                        </clipPath>
                                        </defs>
                                    </svg>                                        
                                </span>
                            </a>
                            {{-- <h2 class="form-title">Start your Language prep Now!</h2>
                            <p class="form-desc">Get Your Dream Score with our Experts</p> --}}
                            <nav role="navigation" aria-label="" class="breadcrumb">
                                {{-- <ol>
                                    <li>
                                        <a href="javascript:;">UK</a>
                                    </li>
                                    <span aria-hidden="true" class="breadcrumb-separator"><svg
                                            xmlns="http://www.w3.org/2000/svg" width="8" height="14"
                                            viewBox="0 0 8 14" fill="none">
                                            <path fill-rule="evenodd" clip-rule="evenodd"
                                                d="M7.66526 7.82496C8.11158 7.36935 8.11158 6.63065 7.66526 6.17504L1.95098 0.341709C1.50467 -0.113903 0.781048 -0.113903 0.334734 0.341709C-0.111579 0.79732 -0.111579 1.53601 0.334734 1.99162L5.2409 7L0.334734 12.0084C-0.111579 12.464 -0.111579 13.2027 0.334734 13.6583C0.781048 14.1139 1.50467 14.1139 1.95098 13.6583L7.66526 7.82496Z"
                                                fill="#B6B6B6" />
                                        </svg></span>
                                    <li>
                                        <a href="javascript:;">DEC 23</a>
                                    </li>
                                    <span aria-hidden="true" class="breadcrumb-separator"><svg
                                            xmlns="http://www.w3.org/2000/svg" width="8" height="14"
                                            viewBox="0 0 8 14" fill="none">
                                            <path fill-rule="evenodd" clip-rule="evenodd"
                                                d="M7.66526 7.82496C8.11158 7.36935 8.11158 6.63065 7.66526 6.17504L1.95098 0.341709C1.50467 -0.113903 0.781048 -0.113903 0.334734 0.341709C-0.111579 0.79732 -0.111579 1.53601 0.334734 1.99162L5.2409 7L0.334734 12.0084C-0.111579 12.464 -0.111579 13.2027 0.334734 13.6583C0.781048 14.1139 1.50467 14.1139 1.95098 13.6583L7.66526 7.82496Z"
                                                fill="#B6B6B6" />
                                        </svg></span>
                                    <li>
                                        <a href="javascript:;">bachelors</a>
                                    </li>
                                    <span aria-hidden="true" class="breadcrumb-separator"><svg
                                            xmlns="http://www.w3.org/2000/svg" width="8" height="14"
                                            viewBox="0 0 8 14" fill="none">
                                            <path fill-rule="evenodd" clip-rule="evenodd"
                                                d="M7.66526 7.82496C8.11158 7.36935 8.11158 6.63065 7.66526 6.17504L1.95098 0.341709C1.50467 -0.113903 0.781048 -0.113903 0.334734 0.341709C-0.111579 0.79732 -0.111579 1.53601 0.334734 1.99162L5.2409 7L0.334734 12.0084C-0.111579 12.464 -0.111579 13.2027 0.334734 13.6583C0.781048 14.1139 1.50467 14.1139 1.95098 13.6583L7.66526 7.82496Z"
                                                fill="#B6B6B6" />
                                        </svg></span>
                                    <li>
                                        <strong>
                                            <a href="javascript:;" aria-current="page">management</a>
                                        </strong>
                                    </li>
                                </ol> --}}
                            </nav>
                        </div>
                        <!-- fieldsets -->
                        <div class="fieldset-div">
                            {{-- <fieldset id="country-fieldset">
                                <div>
                                    <h3>Select Your Dream Country <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="You can pick a country of your choice where you wish to study abroad"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
                                                fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span></h3>
                                    <div class="dearm-country-option">
                                        <input type="radio" id="uk-country" name="preffered_country" value="79"
                                            data-name="United Kingdom" data-id="79">
                                        <label for="uk-country">
                                            <h5 class="">UK</h5>
                                            <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/country-logo/uk.svg"
                                                alt="uk-logo">
                                        </label>
                                        <input type="radio" id="us-country" name="preffered_country" data-id="233" value="233"
                                            data-name="United States">
                                        <label for="us-country">
                                            <h5 class="">USA</h5>
                                            <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/country-logo/us.svg"
                                                alt="uk-logo">
                                        </label>
                                        <input type="radio" id="ca-country" name="preffered_country" data-id="39" value="39"
                                            data-name="Canada">
                                        <label for="ca-country">
                                            <h5 class="">canada</h5>
                                            <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/country-logo/ca.svg"
                                                alt="uk-logo">
                                        </label>
                                        <input type="radio" id="au-country" name="preffered_country" data-id="15" value="15"
                                            data-name="Australia">
                                        <label for="au-country">
                                            <h5 class="">Australia</h5>
                                            <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/country-logo/au.svg"
                                                alt="uk-logo">
                                        </label>
                                        <input type="radio" id="italy-country" name="preffered_country" data-id="110"
                                            value="110" data-name="Italy">
                                        <label for="italy-country">
                                            <h5 class="">italy</h5>
                                            <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/country-logo/it.svg"
                                                alt="uk-logo">
                                        </label>
                                        <input type="radio" id="germany-country" name="preffered_country" data-id="59"
                                            value="59" data-name="Germany">
                                        <label for="germany-country">
                                            <h5 class="">germany</h5>
                                            <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/country-logo/gr.svg"
                                                alt="uk-logo">
                                        </label>
                                        
                                        <div class="more-country">
                                            <select name="more-country-dropdown" class="more-country-dropdown" id="">
                                                <option value="" disabled selected>More</option>
                                                <option value="France">France</option>
                                                <option value="Malta">Malta</option>
                                                <option value="Hungary">Hungary</option>
                                                <option value="New Zealand">New Zealand</option>
                                            </select>
                                        </div>
                                        
                                        <input type="radio" id="open-to-all" name="preffered_country" value="open-to-all"
                                            data-name="Open to All">
                                        <label for="open-to-all" class="open-to-all">
                                            <h5 class="">open to all</h5>
                                            <p> Don't have any particular country in mind? Click on "More," and let's find out your
                                                best fit.</p>
                                        </label>
                                    </div>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="next action-button">Save & Proceed</button>
                                </div>
                            </fieldset> --}}
                            {{-- <fieldset class="intake_fieldset" id="intake-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3>What’s Your Preferred<span class="country_name">Selected country name</span> Intake?
                                        <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="You can pick your suitable intake to get admission into your dream college"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span>
                                    </h3>
                                    <select class="intake_select" name="intake_year">
                                        <option value="2024" selected>2024</option>
                                        <option value="2025">2025</option>
                                        <option value="2026">2026</option>
                                    </select>
                                </div>
                                <div class="dearm-country-intake country-intakes-year">
                                    <input type="checkbox" id="jan-intake" name="intake" data-name="Jan" value="jan"
                                        disabled>
                                    <label for="jan-intake" class="">
                                        <h5 class="">Jan</h5>
                                    </label>
                                    <input type="checkbox" id="dec-intake" name="intake" data-name="Dec" value="dec">
                                    <label for="dec-intake" class="">
                                        <h5 class="">Dec</h5>
                                        
                                    </label>
                                    <input type="checkbox" id="may-intake" name="intake" data-name="May" value="may">
                                    <label for="may-intake">
                                        <h5 class="">May</h5>
                                    </label>
                                    <input type="checkbox" id="not-decided" name="intake" value="Not Decided"
                                        data-name="Not Decided">
                                    <label for="not-decided" class="not-decided open-to-all">
                                        <h5 class="">Not decided</h5>
                                        <p>Not sure which one would be right for you? Our consultants are just a call away.</p>
                                    </label>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white"/>
                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z" fill="#25292D"/>
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Proceed</button>
                                </div>
                            </fieldset> --}}
                            {{-- <fieldset id="course-fieldset">
                                <h3>Select a Course You Wish to Pursue! <span class="planner-tooltip-contant" data-tooltip-auto
                                        data-tooltip=" You can select a course of your interest here to get your study plan ready"><svg
                                            xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                            viewBox="0 0 24 24" fill="none">
                                            <path
                                                d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                fill="#B9BCC8" />
                                        </svg></span></h3>
                                <div class="dearm-country-course">
                                    <input type="checkbox" id="mba-course" name="courseLevel" data-name="MBA"
                                        value="Postgraduate">
                                    <label for="mba-course">
                                        <h5 class="">mba</h5>
                                    </label>
                                    <input type="checkbox" id="bachelors-course" name="courseLevel" data-name="Bachelors"
                                        value="Undergraduate">
                                    <label for="bachelors-course">
                                        <h5 class="">bachelors</h5>
                                    </label>
                                    <input type="checkbox" id="masters-course" name="courseLevel" data-name="Masters"
                                        value="Postgraduate">
                                    <label for="masters-course">
                                        <h5 class="">masters </h5>
                                    </label>
                                    <input type="checkbox" id="PG-diploma-course" name="courseLevel" data-name="PG Diploma"
                                        value="PG Diploma /Certificate">
                                    <label for="PG-diploma-course">
                                        <h5 class="">PG diploma</h5>
                                    </label>
                                    <input type="checkbox" id="certification-course" name="courseLevel"
                                        data-name="Certification" value="PG Diploma /Certificate">
                                    <label for="certification-course">
                                        <h5 class="">certification</h5>
                                    </label>
                                    <input type="checkbox" id="phd-course" name="courseLevel" data-name="PHD"
                                        value="phD">
                                    <label for="phd-course">
                                        <h5 class="">phd</h5>
                                    </label>
                                    <input type="checkbox" id="others-course" name="courseLevel" data-name="Others"
                                        value="others">
                                    <label for="others-course">
                                        <h5 class="">others</h5>
                                    </label>
                                    <input type="checkbox" id="not-decided-course" name="courseLevel"
                                        data-name="Not Decided" value="Not Decided">
                                    <label for="not-decided-course" class="not-decided open-to-all">
                                        <h5 class="">Not decided</h5>
                                        <p>Not sure which course best suits you? Let AI do the rest!</p>
                                    </label>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white"/>
                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z" fill="#25292D"/>
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Proceed</button>
                                </div>
                            </fieldset> --}}
                            {{-- <fieldset class="stream-fieldset" id="stream-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3>Select a Stream of Your Choice!
                                        <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Pick a stream you’re interested in building your career."><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span>
                                    </h3>
                                </div>

                                <div class="dearm-country-intake">
                                    <input type="checkbox" id="management" name="stream" data-name="Management"
                                        value="4">
                                    <label for="management" class="">
                                        <h5 class="">management</h5>
                                    </label>
                                    <input type="checkbox" id="engineering" name="stream" data-name="Engineering"
                                        value="7">
                                    <label for="engineering" class="">
                                        <h5 class="">engineering</h5>
                                    </label>
                                    <input type="checkbox" id="design" name="stream" data-name="Design" value="3">
                                    <label for="design">
                                        <h5 class="">design</h5>
                                    </label>
                                    <input type="checkbox" id="science" name="stream" data-name="Science"
                                        value="17 ">
                                    <label for="science">
                                        <h5 class="">science </h5>
                                    </label>
                                    <input type="checkbox" id="maths" name="stream" data-name="Maths" value="15">
                                    <label for="maths">
                                        <h5 class="">maths</h5>
                                    </label>
                                    <input type="checkbox" id="other-stream" name="stream" data-name="Others"
                                        value="others">
                                    <label for="other-stream">
                                        <h5 class="">Other</h5>
                                    </label>
                                    
                                    <div class="more-country more-stream">
                                        
                                        <select name="more-streams-dropdown" class="more-streams-dropdown" id="">
                                            <option value="" disabled selected>More</option>
                                            @foreach ($streams as $stream)
                                            <option value="{{ @$stream->id }}" >{{ @$stream->name }}</option>
                                            @endforeach
                                        </select>
                                    
                
                                    </div>
                                    <input type="checkbox" id="no-preference" name="stream" data-name="No Preference"
                                        value="No Preference">
                                    <label for="no-preference">
                                        <h5 class="">no preference</h5>
                                    </label>
                                </div>
                            
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white"/>
                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z" fill="#25292D"/>
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Proceed</button>
                                </div>
                            </fieldset> --}}
                            {{-- <fieldset class="highest-edu two-flex-div" id="edu-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3 class="question-title">
                                        What Is Your Highest Education Qualification?
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="12th" name="highedu" data-name="12th" value="12th">
                                    <label for="12th" class="">
                                        <h5 class="">12th</h5>
                                    </label>
                                    <input type="radio" id="bachelors" name="highedu" data-name="Bachelors"
                                        value="bachelors">
                                    <label for="bachelors" class="">
                                        <h5 class="">bachelors</h5>
                                    </label>
                                    <input type="radio" id="masters" name="highedu" data-name="Masters"
                                        value="masters">
                                    <label for="masters">
                                        <h5 class="">masters</h5>
                                    </label>
                                    <input type="radio" id="phd-equivalent" name="highedu"
                                        data-name="PHD or Equivalent" value="phd or equivalent">
                                    <label for="phd-equivalent" class="">
                                        <h5 class="">phd or equivalent</h5>
                                    </label>
                                </div>
                                <div class="score-div edu-score-div">
                                    <h3>Enter Score of <span class="edu-score"> </span></h3>
                                    <div class="input-field">
                                        <select class="score_unit_select" name="high_edu_type">
                                            <option data-display="Percentage" value="percentage">Percentage</option>
                                            <option value="CGPA (4)">CGPA (4.0)</option>
                                            <option value="CGPA (5)">CGPA (5.0)</option>
                                            <option value="CGPA (10)">CGPA (10.0)</option>
                                        </select>
                                        <input type="text" placeholder="Enter Score" class="high-edu-marks"
                                            name="high_edu_score" maxlength="5">
                                        <span class="unit-label" style="display: none"></span>
                                    </div>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="next action-button"
                                        >Save & Proceed</button>
                                </div>


                            </fieldset> --}}



                            <fieldset class="highest-edu three-flex-fieldset" id="interest-exam-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3>Select the Language Proficiency Test!
                                        {{-- <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Have you appeared for any language proficiency test, or are you about to give one?"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span> --}}
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="in-ielts" name="exam" data-name="IELTS"
                                        value="IeltsRequired">
                                    <label for="in-ielts" class="">
                                        <h5 class="">ielts</h5>
                                    </label>
                                    <input type="radio" id="in-pte" name="exam" data-name="PTE"
                                        value="PteRequired">
                                    <label for="in-pte" class="">
                                        <h5 class="">pte</h5>
                                    </label>
                                    <input type="radio" id="in-toefl" name="exam" data-name="TOEFL"
                                        value="ToeflRequired">
                                    <label for="in-toefl">
                                        <h5 class="">toefl</h5>
                                    </label>
                                    <input type="radio" id="in-duolingo" name="exam" data-name="DUOLINGO"
                                        value="duolingo">
                                    <label for="in-duolingo" class="">
                                        <h5 class="">duolingo</h5>
                                    </label>
                                    <input type="radio" id="in-German" name="exam" data-name="German"
                                        value="German">
                                    <label for="in-German" class="">
                                        <h5 class="">German</h5>
                                    </label>
                                    <input type="radio" id="in-French" name="exam" data-name="French"
                                        value="French">
                                    <label for="in-French" class="">
                                        <h5 class="">French</h5>
                                    </label>
                                </div>
                                <div class="action-button-div">
                                    {{-- <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25"
                                                viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white" />
                                                <path fill-rule="evenodd" clip-rule="evenodd"
                                                    d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z"
                                                    fill="#25292D" />
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button> --}}
                                    <button type="button" class="next action-button">Save & Next</button>
                                </div>
                            </fieldset>
                            {{-- <fieldset class="highest-edu" id="exam-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3>Select the Appeared Language Proficiency Test!
                                        <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Have you appeared for any language proficiency test, or are you about to give one?"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span>
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="ielts" name="exam" data-name="IELTS"
                                        value="IeltsRequired">
                                    <label for="ielts" class="">
                                        <h5 class="">ielts</h5>
                                    </label>
                                    <input type="radio" id="pte" name="exam" data-name="PTE"
                                        value="PteRequired">
                                    <label for="pte" class="">
                                        <h5 class="">pte</h5>
                                    </label>
                                    <input type="radio" id="toefl" name="exam" data-name="TOEFL"
                                        value="ToeflRequired">
                                    <label for="toefl">
                                        <h5 class="">toefl</h5>
                                    </label>
                                    <input type="radio" id="duolingo" name="exam" data-name="DUOLINGO"
                                        value="duolingo">
                                    <label for="duolingo" class="">
                                        <h5 class="">duolingo</h5>
                                    </label>
                                    <input type="radio" id="not-taken" name="exam" data-name="Not Taken"
                                        value="NT">
                                    <label for="not-taken" class="">
                                        <h5 class="">not taken</h5>
                                    </label>
                                    <input type="radio" id="others" name="exam" data-name="Others" value="others">
                                    <label for="others" class="">
                                        <h5 class="">others</h5>
                                    </label>
                                </div>
                                <div class="score-div exam-score-div">
                                    <h3>Score</h3>
                                    <div class="input-field">
                                        <input type="text" placeholder="Enter Score" class="examScore"
                                            name="language_test_score" maxlength="5">
                                    </div>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white"/>
                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z" fill="#25292D"/>
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Proceed</button>
                                </div>
                            </fieldset> --}}
                            {{-- <fieldset class="highest-edu" id="test-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3>Which Is Your Preferred Academic Test?
                                        <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Select the academic test you’ve taken to help AI get you a customized plan"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span>
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="act" name="exam1" data-name="ACT"
                                        value="ActRequired">
                                    <label for="act" class="">
                                        <h5 class="">act</h5>
                                    </label>
                                    <input type="radio" id="sat" name="exam1" data-name="SAT"
                                        value="SatRequired">
                                    <label for="sat" class="">
                                        <h5 class="">sat</h5>
                                    </label>
                                    <input type="radio" id="not-taken-ac" name="exam1" data-name="Not Taken"
                                        value="NT">
                                    <label for="not-taken-ac" class="">
                                        <h5 class="">not taken</h5>
                                    </label>
                                    <input type="radio" id="others-ac" name="exam1" data-name="Others" value="others">
                                    <label for="others-ac" class="">
                                        <h5 class="">others</h5>
                                    </label>
                                </div>
                                <div class="score-div exam-score-div">
                                    <h3>Score</h3>
                                    <div class="input-field">
                                        <input type="text" placeholder="Enter Score" class="examScore"
                                            name="academic_test_score" maxlength="5">
                                    </div>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white"/>
                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z" fill="#25292D"/>
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Proceed</button>
                                </div>
                            </fieldset> --}}
                            {{-- <fieldset id="prefered-mode" class="two-flex-div">
                                <div class="intake-question-dropdown">
                                    <h3>What is your Preferred mode of Class?
                                        <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Select an option about your fund's availability for abroad studies to ensure a smooth process"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span>
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="online" name="mode" data-name="Online"
                                        value="online">
                                    <label for="online" class="">
                                        <h5 class="">Online</h5>
                                    </label>
                                    <input type="radio" id="offline" name="mode" data-name="Offline"
                                        value="offline">
                                    <label for="offline" class="">
                                        <h5 class="">Offline</h5>
                                    </label>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white"/>
                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z" fill="#25292D"/>
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Proceed</button>
                                </div>
                            </fieldset> --}}




                            <fieldset class="highest-edu three-flex-fieldset" id="exam-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3>Have you taken<span class="examName"></span> before?
                                        {{-- <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Have you appeared for any language proficiency test?"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span> --}}
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="ielts" name="examRequire" data-name="Yes"
                                        value="Yes">
                                    <label for="ielts" class="">
                                        <h5 class="">Yes</h5>
                                    </label>
                                    <input type="radio" id="others" name="examRequire" data-name="No"
                                        value="No">
                                    <label for="others" class="">
                                        <h5 class="">No</h5>
                                    </label>
                                </div>
                                

                                <div class="score-div exam-score-div">
                                    <h3>Score</h3>
                                    <div class="input-field">
                                        <input type="tel" placeholder="Enter Score" class="examScore"
                                            name="language_test_score" maxlength="5">
                                    </div>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25"
                                                viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white" />
                                                <path fill-rule="evenodd" clip-rule="evenodd"
                                                    d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z"
                                                    fill="#25292D" />
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Next</button>
                                </div>

                            </fieldset>


                            <fieldset id="ielts-giving" class="three-flex-fieldset highest-edu">
                                <div class="intake-question-dropdown">
                                    <h3>When are you planning to take your<span class="examName"></span> exam?
                                        {{-- <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Select an option about your fund's availability for abroad studies to ensure a smooth process"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span> --}}
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="3-months" name="timeDuration" data-name="3 Months"
                                        value="3-months">
                                    <label for="3-months" class="">
                                        <h5 class="">Within 3 Months</h5>
                                    </label>
                                    <input type="radio" id="3-6-months" name="timeDuration" data-name="3-6 Months"
                                        value="3-6-months">
                                    <label for="3-6-months" class="">
                                        <h5 class="">3-6 Months</h5>
                                    </label>
                                    <input type="radio" id="already-booked" name="timeDuration"
                                        data-name="Already Booked" value="already-booked">
                                    <label for="already-booked" class="">
                                        <h5 class="">Already Booked</h5>
                                    </label>
                                </div>
                                <div class="score-div exam-date-div">
                                    <h3>Exam Date</h3>
                                    <div class="form-input-group">
                                         {{-- <input placeholder="Please Select a Date" class="date input-field-group" type="text" onfocus="(this.type = 'date')"  id="date"> --}}
                                        <input type="tel" name="exam_date"  class="date input-field-group" maxlength="10"  onkeydown="autoSlash(this, event)"  placeholder="Date (DDMMYYYY)">
                                    </div>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25"
                                                viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white" />
                                                <path fill-rule="evenodd" clip-rule="evenodd"
                                                    d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z"
                                                    fill="#25292D" />
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Next</button>
                                </div>
                            </fieldset>

                            {{-- <fieldset class="highest-edu three-flex-fieldset" id="exam-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3>Have you given < Ielts >
                                        <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Have you appeared for any language proficiency test, or are you about to give one?"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span>
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="ielts" name="exam" data-name="IELTS"
                                        value="IeltsRequired">
                                    <label for="ielts" class="">
                                        <h5 class="">Yes</h5>
                                    </label>
                                    <input type="radio" id="others" name="exam" data-name="Others" value="others">
                                    <label for="others" class="">
                                        <h5 class="">No</h5>
                                    </label>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white"/>
                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z" fill="#25292D"/>
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Proceed</button>
                                </div>
                                <div class="score-div exam-score-div">
                                    <h3>Score</h3>
                                    <div class="input-field">
                                        <input type="text" placeholder="Enter Score" class="examScore"
                                            name="language_test_score" maxlength="5">
                                    </div>
                                </div>
                                
                            </fieldset> --}}
                            {{-- <fieldset id="fund-fieldset" class="two-flex-div">
                                <div class="intake-question-dropdown">
                                    <h3>What Is Your Funds Availability Status?
                                        <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Select an option about your fund's availability for abroad studies to ensure a smooth process"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span>
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="self-fund" name="funds" data-name="Self Funded"
                                        value="self fund">
                                    <label for="self-fund" class="">
                                        <h5 class="">SELF-FUNDED</h5>
                                    </label>
                                    <input type="radio" id="sponsered" name="funds" data-name="Sponsered"
                                        value="sponsered">
                                    <label for="sponsered" class="">
                                        <h5 class="">SPONSORED</h5>
                                    </label>
                                    <input type="radio" id="partial-loan" name="funds" data-name="Partial Loan"
                                        value="partial loan">
                                    <label for="partial-loan">
                                        <h5 class="">PARTIAL LOAN</h5>
                                    </label>
                                    <input type="radio" id="full-loan" name="funds" data-name="Full Loan"
                                        value="full loan">
                                    <label for="full-loan">
                                        <h5 class="">FULL LOAN</h5>
                                    </label>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white"/>
                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z" fill="#25292D"/>
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="button" class="next action-button">Save & Proceed</button>
                                </div>
                            </fieldset> --}}


                            <fieldset id="lang-time-fieldset" class="highest-edu three-flex-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3>What is the Purpose of taking<span class="examName"></span>?
                                        {{-- <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Select an option about your fund's availability for abroad studies to ensure a smooth process"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span> --}}
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <input type="radio" id="study" name="purpose" data-name="Study"
                                        value="study">
                                    <label for="study" class="">
                                        <h5 class="">Study Abroad</h5>
                                    </label>
                                    <input type="radio" id="immigration" name="purpose" data-name="Immigration"
                                        value="immigration">
                                    <label for="immigration" class="">
                                        <h5 class="">Immigration / Work visa</h5>
                                    </label>
                                    <input type="radio" id="other" name="purpose" data-name="Other"
                                        value="other">
                                    <label for="other" class="">
                                        <h5 class="">other</h5>
                                    </label>
                                </div>

                                <div class="score-div reason-score-div">
                                    {{-- <h3>Score</h3> --}}
                                    <div class="input-field">
                                        <input type="text" placeholder="Enter Reason" class="reason"
                                            name="reason">
                                        {{-- <textarea name="" id=""  placeholder="Enter Reason" class="examScore" cols="80" rows="2"></textarea> --}}
                                    </div>
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25"
                                                viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white" />
                                                <path fill-rule="evenodd" clip-rule="evenodd"
                                                    d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z"
                                                    fill="#25292D" />
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    @if(auth()->check())
                                    <button type="button" onclick="window.location='{{ route('website.test-preparation.ieltsDemoClass') }}'" class="action-button m-action-btn">Save & Next</button>
                                    @else
                                    <button type="button" class="action-button m-action-btn"
                                        onclick="showPopup('login')">Save & Next</button>
                                    @endif
                                </div>
                            </fieldset>
                            {{-- <fieldset id="passport-fieldset">
                                <div class="intake-question-dropdown">
                                    <h3>Issued Passport Details
                                        <span class="planner-tooltip-contant" data-tooltip-auto
                                            data-tooltip="Provide the details of the passport issue state and city"><svg
                                                xmlns="http://www.w3.org/2000/svg" width="24" height="24"
                                                viewBox="0 0 24 24" fill="none">
                                                <path
                                                    d="M12 24C18.612 24 24 18.612 24 12C24 5.388 18.612 0 12 0C5.388 0 0 5.388 0 12C0 18.612 5.388 24 12 24ZM12.9 16.8C12.9 17.292 12.492 17.7 12 17.7C11.508 17.7 11.1 17.292 11.1 16.8V10.8C11.1 10.308 11.508 9.9 12 9.9C12.492 9.9 12.9 10.308 12.9 10.8V16.8ZM10.896 6.744C10.956 6.588 11.04 6.468 11.148 6.348C11.268 6.24 11.4 6.156 11.544 6.096C11.688 6.036 11.844 6 12 6C12.156 6 12.312 6.036 12.456 6.096C12.6 6.156 12.732 6.24 12.852 6.348C12.96 6.468 13.044 6.588 13.104 6.744C13.164 6.888 13.2 7.044 13.2 7.2C13.2 7.356 13.164 7.512 13.104 7.656C13.044 7.8 12.96 7.932 12.852 8.052C12.732 8.16 12.6 8.244 12.456 8.304C12.168 8.424 11.832 8.424 11.544 8.304C11.4 8.244 11.268 8.16 11.148 8.052C11.04 7.932 10.956 7.8 10.896 7.656C10.836 7.512 10.8 7.356 10.8 7.2C10.8 7.044 10.836 6.888 10.896 6.744Z"
                                                    fill="#B9BCC8" />
                                            </svg></span>
                                    </h3>
                                </div>
                                <div class="dearm-country-intake">
                                    <div class="passport-dropdown">
                                        
                                        <select name="user_country_id" class="country-dropdown">
                                            <option value="India"> <span
                                                    class="flag-icon flag-icon-gb flag-icon-squared"></span> India</option>
                                            <option value="United Kingdom">United Kingdom</option>
                                            <option value="United States">United States</option>
                                        </select>

                                        
                                        <select name="state" class="state-dropdown">
                                            <option value="Rajasthan">Rajasthan</option>
                                            <option value="Madhya Pradesh">Madhya Pradesh</option>
                                            <option value="Mahrastra">Mahrastra</option>
                                        </select>
                                        <select name="city" class="city-dropdown">
                                            <option value="" selected disabled>Select City</option>
                                        </select>
                                    </div>
                                    <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/passport-bg.png"
                                        alt="" class="passport-img-desk">
                                    <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/passport-mobile.png"
                                        alt="" class="passport-img-mobile">
                                </div>
                                <div class="action-button-div">
                                    <button type="button" class="action-button previous previous_button">
                                        <span class="back-mobile">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
                                                <circle cx="12.5" cy="12.5" r="12.5" fill="white"/>
                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12.3857 17.3778C12.1122 17.6916 11.6362 17.7242 11.3224 17.4507L6.71227 13.4315C6.54811 13.2884 6.45389 13.0813 6.45389 12.8635C6.45389 12.6457 6.54811 12.4386 6.71227 12.2955L11.3224 8.27634C11.6362 8.00284 12.1122 8.03545 12.3857 8.34916C12.6592 8.66288 12.6266 9.13891 12.3129 9.41241L9.21866 12.1099L18.2601 12.1099C18.6763 12.1099 19.0137 12.4473 19.0137 12.8635C19.0137 13.2797 18.6763 13.6171 18.2601 13.6171L9.21866 13.6171L12.3129 16.3146C12.6266 16.5881 12.6592 17.0641 12.3857 17.3778Z" fill="#25292D"/>
                                            </svg>
                                        </span>
                                        <span class="back-desktop">Back</span>
                                    </button>
                                    <button type="submit" class="action-button create-plan">Create Plan</button>
                                </div>
                            </fieldset> --}}
                        </div>
                    </form>
                    <!-- End Multi step form -->
                </div>
                <div class="right-div">
                    <div class="contact-strip">
                        <p class="contact-que">Have Questions? We're here to help</p>
                        <a href="tel:+91-9773388670" class="contact-cta">
                            <span class="contact-svg">
                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <g clip-path="url(#clip0_1432_1871)">
                                    <path d="M4.50898 0.672296C4.29844 0.163703 3.74336 -0.107001 3.21289 0.0379212L0.806641 0.694171C0.330859 0.825421 0 1.25745 0 1.74964C0 8.51448 5.48516 13.9996 12.25 13.9996C12.7422 13.9996 13.1742 13.6688 13.3055 13.193L13.9617 10.7867C14.1066 10.2563 13.8359 9.7012 13.3273 9.49066L10.7023 8.39691C10.2566 8.21097 9.73984 8.33948 9.43633 8.71409L8.33164 10.0621C6.40664 9.15159 4.84805 7.593 3.9375 5.668L5.28555 4.56605C5.66016 4.2598 5.78867 3.74573 5.60273 3.30003L4.50898 0.675031V0.672296Z" fill="#066AC9"/>
                                    </g>
                                    <defs>
                                    <clipPath id="clip0_1432_1871">
                                    <rect width="14" height="14" fill="white"/>
                                    </clipPath>
                                    </defs>
                                </svg>                                    
                            </span>
                            +91-9773388670
                        </a>
                    </div>
                    <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/test-prep-bg2.png"
                        alt="">
                    {{-- <h2>What we will do <br>just for you!</h2>
                    <ul>
                        <li>FREE Counselling</li>
                        <li>Customized study plans</li>
                        <li>Test Preparation</li>
                        <li>Shortlist Universities</li>
                        <li>Hand-picked courses</li>
                        <li>Finance your journey</li>
                        <li>Apply for scholarships</li>
                        <li>Exceptional Counselling</li>
                        <li>Visa Assistance</li>
                        <li>Accommodation Assistance</li>
                    </ul>
                    <p>Need help? <a href="https://wa.me/919773388670">Connect with Expert</a></p> --}}
                </div>

            </section>
            <div class="term-cond-strip">
                By Registering you agree with
                <a href="/terms-condition" class="blue-link"> terms and conditions </a>
                and <a href="/privacy-policy" class="blue-link"> privacy policy</a>
            </div>
            <section class="loader-planner">
                <div class="loader-planner-div">
                    <h2>Take a Deep Breathe and Relax While Our AI Gathers the Best Results for You!</h2>
                    <p>Your Dream Universities Are Loading in a Few Minutes…</p>
                    <lottie-player
                        src="{{ asset('/') }}frontend/assets-desktop/images/start-journey/planner-loader.json"
                        id="planner-loader" speed="1" loop autoplay defer></lottie-player>
                    <div class="progress-bar-div">
                        <div id="progress-bar"></div>
                    </div>
                </div>
            </section>
            {{-- Strip --}}
            {{-- <div class="strip-container" style="display: ;">
            
                <div class="complete-profile-strip">
                    <div class="content-div">
                        <h4>Complete profile now and unlock all 93 courses and Universities that you are eligible for!</h4>
                        <a href="" class="complete-profile-btn">Complete Profile</a>
                    </div>
                    <div id="lock-lottie"></div>
                </div>
                
                <div class="assign-expert-strip">
                    <div class="content-div">
                        <h4>These are AI based results, to get accurate personalized results, get in touch with our expert
                            counsellor and don't take risk!</h4>
                        <a href="" class="assign-expert-btn">Assign me an Expert</a>
                    </div>
                    <div id="expert-lottie"></div>
                </div>
                
                <div class="increase-chance-strip">
                    <div class="content-div">
                        <h4>Increase your chance of successful admission by 60% with our expert team! </h4>
                        <a href="" class="assign-expert-btn">Assign me an Expert</a>
                    </div>
                    <div class="right-svg">
                        <svg width="105" height="124" viewBox="0 0 105 124" fill="none"
                            xmlns="http://www.w3.org/2000/svg">
                            <path opacity="0.4"
                                d="M92.7131 41.8883C92.7131 65.0226 73.9591 83.7766 50.8248 83.7766C27.6906 83.7766 8.93652 65.0226 8.93652 41.8883C8.93652 18.754 27.6906 0 50.8248 0C73.9591 0 92.7131 18.754 92.7131 41.8883ZM18.152 41.8883C18.152 59.933 32.7801 74.5612 50.8248 74.5612C68.8695 74.5612 83.4977 59.933 83.4977 41.8883C83.4977 23.8436 68.8695 9.21543 50.8248 9.21543C32.7801 9.21543 18.152 23.8436 18.152 41.8883Z"
                                fill="url(#paint0_linear_331_22297)" />
                            <mask id="path-2-inside-1_331_22297" fill="white">
                                <path
                                    d="M88.1054 41.8883C90.6502 41.8883 92.7394 43.9576 92.46 46.487C91.4812 55.3503 87.6917 63.7152 81.5843 70.3221C74.4294 78.0623 64.6194 82.8205 54.1113 83.6475C43.6033 84.4745 33.1697 81.3095 24.892 74.7839C16.6144 68.2583 11.1011 58.8518 9.45224 48.4411C7.80333 38.0303 10.14 27.3806 15.996 18.6164C21.852 9.85226 30.7969 3.61802 41.0462 1.15738C51.2955 -1.30327 62.0957 0.19059 71.2923 5.34093C79.1424 9.73716 85.3314 16.5216 89.0012 24.6487C90.0485 26.968 88.701 29.5816 86.2808 30.368C83.8605 31.1543 81.2897 29.8099 80.171 27.5242C77.2674 21.5921 72.6148 16.6437 66.7895 13.3813C59.6161 9.36409 51.192 8.19888 43.1975 10.1182C35.203 12.0375 28.226 16.9002 23.6583 23.7362C19.0906 30.5723 17.2681 38.8791 18.5542 46.9995C19.8404 55.1199 24.1407 62.4569 30.5972 67.5469C37.0538 72.6368 45.192 75.1055 53.3883 74.4604C61.5846 73.8154 69.2364 70.104 74.8172 64.0667C79.3493 59.1639 82.2451 53.0199 83.1734 46.4809C83.5311 43.9614 85.5606 41.8883 88.1054 41.8883Z" />
                            </mask>
                            <path
                                d="M88.1054 41.8883C90.6502 41.8883 92.7394 43.9576 92.46 46.487C91.4812 55.3503 87.6917 63.7152 81.5843 70.3221C74.4294 78.0623 64.6194 82.8205 54.1113 83.6475C43.6033 84.4745 33.1697 81.3095 24.892 74.7839C16.6144 68.2583 11.1011 58.8518 9.45224 48.4411C7.80333 38.0303 10.14 27.3806 15.996 18.6164C21.852 9.85226 30.7969 3.61802 41.0462 1.15738C51.2955 -1.30327 62.0957 0.19059 71.2923 5.34093C79.1424 9.73716 85.3314 16.5216 89.0012 24.6487C90.0485 26.968 88.701 29.5816 86.2808 30.368C83.8605 31.1543 81.2897 29.8099 80.171 27.5242C77.2674 21.5921 72.6148 16.6437 66.7895 13.3813C59.6161 9.36409 51.192 8.19888 43.1975 10.1182C35.203 12.0375 28.226 16.9002 23.6583 23.7362C19.0906 30.5723 17.2681 38.8791 18.5542 46.9995C19.8404 55.1199 24.1407 62.4569 30.5972 67.5469C37.0538 72.6368 45.192 75.1055 53.3883 74.4604C61.5846 73.8154 69.2364 70.104 74.8172 64.0667C79.3493 59.1639 82.2451 53.0199 83.1734 46.4809C83.5311 43.9614 85.5606 41.8883 88.1054 41.8883Z"
                                stroke="url(#paint1_linear_331_22297)" stroke-width="10.311" stroke-linecap="round"
                                mask="url(#path-2-inside-1_331_22297)" />
                            <path
                                d="M32.5747 45.9992H32.7959C33.7273 45.9992 34.5268 45.8866 35.1943 45.6615C35.8695 45.4287 36.4245 45.0949 36.8592 44.6603C37.2938 44.2256 37.6159 43.6939 37.8255 43.0652C38.0351 42.4287 38.1399 41.7069 38.1399 40.8997V37.6863C38.1399 37.0731 38.0778 36.5337 37.9536 36.068C37.8372 35.6023 37.6664 35.2181 37.4413 34.9154C37.224 34.6049 36.9678 34.372 36.6729 34.2168C36.3857 34.0616 36.0675 33.984 35.7182 33.984C35.3456 33.984 35.0158 34.0771 34.7286 34.2634C34.4414 34.4419 34.1969 34.6864 33.9951 34.9969C33.801 35.3073 33.6497 35.6644 33.541 36.068C33.4401 36.4638 33.3897 36.8791 33.3897 37.3138C33.3897 37.7484 33.4401 38.1637 33.541 38.5595C33.6419 38.9476 33.7933 39.293 33.9951 39.5957C34.1969 39.8907 34.4491 40.1274 34.7519 40.3059C35.0546 40.4767 35.4116 40.562 35.823 40.562C36.2188 40.562 36.572 40.4883 36.8825 40.3408C37.2007 40.1856 37.4685 39.9838 37.6858 39.7354C37.9109 39.487 38.0816 39.2115 38.1981 38.9088C38.3223 38.6061 38.3844 38.2995 38.3844 37.989L39.4904 38.5944C39.4904 39.1378 39.374 39.6733 39.1411 40.2011C38.9083 40.7289 38.5823 41.2102 38.1631 41.6448C37.7518 42.0717 37.2744 42.4132 36.7311 42.6694C36.1878 42.9255 35.6056 43.0536 34.9847 43.0536C34.193 43.0536 33.4906 42.91 32.8774 42.6228C32.2642 42.3278 31.7442 41.9242 31.3173 41.412C30.8981 40.8919 30.5799 40.2865 30.3626 39.5957C30.1453 38.9049 30.0366 38.1559 30.0366 37.3487C30.0366 36.5259 30.1685 35.7536 30.4324 35.0318C30.7041 34.31 31.0883 33.6735 31.5851 33.1224C32.0896 32.5713 32.6911 32.1405 33.3897 31.8301C34.096 31.5118 34.8799 31.3527 35.7415 31.3527C36.603 31.3527 37.387 31.5196 38.0933 31.8534C38.7996 32.1871 39.405 32.6606 39.9095 33.2738C40.4141 33.8792 40.8021 34.6049 41.0738 35.4509C41.3532 36.297 41.4929 37.2361 41.4929 38.2684V39.4327C41.4929 40.5349 41.3726 41.5594 41.132 42.5064C40.8992 43.4533 40.546 44.311 40.0725 45.0794C39.6068 45.84 39.0247 46.492 38.3261 47.0353C37.6353 47.5787 36.832 47.9939 35.9161 48.2811C35.0002 48.5683 33.9757 48.7119 32.8425 48.7119H32.5747V45.9992ZM46.5696 40.8298L43.8918 40.1895L44.8581 31.5972H54.3818V34.31H47.6174L47.1983 38.0705C47.4234 37.9386 47.7649 37.7989 48.2228 37.6514C48.6808 37.4962 49.1931 37.4185 49.7597 37.4185C50.5824 37.4185 51.312 37.5466 51.9485 37.8027C52.585 38.0589 53.1244 38.4314 53.5668 38.9204C54.017 39.4094 54.3585 40.0071 54.5914 40.7134C54.8242 41.4197 54.9406 42.2192 54.9406 43.1118C54.9406 43.8647 54.8242 44.5826 54.5914 45.2657C54.3585 45.9409 54.0054 46.5464 53.5319 47.0819C53.0584 47.6097 52.4646 48.025 51.7506 48.3277C51.0365 48.6304 50.1905 48.7817 49.2125 48.7817C48.4829 48.7817 47.7765 48.6731 47.0935 48.4557C46.4182 48.2384 45.8089 47.9163 45.2656 47.4894C44.7301 47.0625 44.2993 46.5464 43.9733 45.9409C43.6551 45.3278 43.4882 44.6292 43.4727 43.8453H46.8024C46.849 44.3265 46.9732 44.7417 47.175 45.091C47.3846 45.4325 47.6601 45.6964 48.0016 45.8827C48.3432 46.069 48.7429 46.1621 49.2008 46.1621C49.6277 46.1621 49.9925 46.0807 50.2952 45.9177C50.5979 45.7547 50.8424 45.5296 51.0287 45.2424C51.215 44.9474 51.3508 44.6059 51.4362 44.2178C51.5294 43.822 51.5759 43.3951 51.5759 42.9371C51.5759 42.4792 51.5216 42.0639 51.4129 41.6914C51.3043 41.3188 51.1374 40.9967 50.9123 40.725C50.6872 40.4534 50.4 40.2438 50.0507 40.0963C49.7092 39.9489 49.3095 39.8751 48.8515 39.8751C48.2306 39.8751 47.7494 39.9722 47.4079 40.1662C47.0741 40.3602 46.7947 40.5814 46.5696 40.8298ZM56.5827 35.7536V34.8572C56.5827 34.2129 56.7224 33.6269 57.0019 33.0991C57.2813 32.5713 57.6927 32.1483 58.236 31.8301C58.7793 31.5118 59.4468 31.3527 60.2385 31.3527C61.0535 31.3527 61.7326 31.5118 62.276 31.8301C62.8271 32.1483 63.2384 32.5713 63.5101 33.0991C63.7895 33.6269 63.9292 34.2129 63.9292 34.8572V35.7536C63.9292 36.3823 63.7895 36.9606 63.5101 37.4884C63.2384 38.0162 62.8309 38.4392 62.2876 38.7574C61.7443 39.0757 61.0729 39.2348 60.2734 39.2348C59.4662 39.2348 58.7871 39.0757 58.236 38.7574C57.6927 38.4392 57.2813 38.0162 57.0019 37.4884C56.7224 36.9606 56.5827 36.3823 56.5827 35.7536ZM58.8065 34.8572V35.7536C58.8065 36.0253 58.8569 36.2853 58.9578 36.5337C59.0665 36.7743 59.2295 36.9722 59.4468 37.1275C59.6719 37.2749 59.9436 37.3487 60.2618 37.3487C60.5955 37.3487 60.8672 37.2749 61.0768 37.1275C61.2863 36.9722 61.4416 36.7743 61.5425 36.5337C61.6434 36.2853 61.6938 36.0253 61.6938 35.7536V34.8572C61.6938 34.57 61.6395 34.3061 61.5308 34.0655C61.4299 33.8171 61.2708 33.6192 61.0535 33.4717C60.8439 33.3164 60.5723 33.2388 60.2385 33.2388C59.928 33.2388 59.6641 33.3164 59.4468 33.4717C59.2295 33.6192 59.0665 33.8171 58.9578 34.0655C58.8569 34.3061 58.8065 34.57 58.8065 34.8572ZM64.686 45.289V44.3925C64.686 43.756 64.8257 43.1739 65.1051 42.6461C65.3923 42.1183 65.8076 41.6953 66.3509 41.377C66.902 41.0588 67.5772 40.8997 68.3767 40.8997C69.1839 40.8997 69.8592 41.0588 70.4025 41.377C70.9458 41.6953 71.3572 42.1183 71.6366 42.6461C71.9161 43.1739 72.0558 43.756 72.0558 44.3925V45.289C72.0558 45.9254 71.9161 46.5075 71.6366 47.0353C71.365 47.5631 70.9575 47.9862 70.4142 48.3044C69.8708 48.6226 69.1995 48.7817 68.4 48.7817C67.5928 48.7817 66.9136 48.6226 66.3625 48.3044C65.8114 47.9862 65.3923 47.5631 65.1051 47.0353C64.8257 46.5075 64.686 45.9254 64.686 45.289ZM66.9214 44.3925V45.289C66.9214 45.5684 66.9835 45.8323 67.1077 46.0807C67.2318 46.329 67.4026 46.527 67.6199 46.6744C67.845 46.8219 68.105 46.8956 68.4 46.8956C68.7726 46.8956 69.0636 46.8219 69.2732 46.6744C69.4828 46.527 69.6263 46.329 69.704 46.0807C69.7893 45.8323 69.832 45.5684 69.832 45.289V44.3925C69.832 44.113 69.7777 43.853 69.669 43.6124C69.5604 43.364 69.3974 43.1661 69.18 43.0186C68.9705 42.8634 68.7027 42.7858 68.3767 42.7858C68.0507 42.7858 67.7791 42.8634 67.5617 43.0186C67.3522 43.1661 67.193 43.364 67.0844 43.6124C66.9757 43.853 66.9214 44.113 66.9214 44.3925ZM69.2033 34.0189L60.9254 47.2682L59.2955 46.4066L67.5734 33.1573L69.2033 34.0189Z"
                                fill="#6A9833" />
                            <path
                                d="M5.03205 113.596L7.87914 101.569H9.46959L9.83284 103.572L6.79921 115.864H5.09095L5.03205 113.596ZM3.56923 101.569L5.92545 113.596L5.72909 115.864H3.82449L0.65341 101.569H3.56923ZM12.3363 113.547L14.6631 101.569H17.5789L14.4176 115.864H12.513L12.3363 113.547ZM10.363 101.569L13.2297 113.645L13.1512 115.864H11.4429L8.38966 103.562L8.78236 101.569H10.363ZM21.987 105.241V115.864H19.1497V105.241H21.987ZM18.973 102.473C18.973 102.06 19.117 101.72 19.405 101.452C19.693 101.183 20.0791 101.049 20.5634 101.049C21.0412 101.049 21.4241 101.183 21.7121 101.452C22.0066 101.72 22.1539 102.06 22.1539 102.473C22.1539 102.885 22.0066 103.225 21.7121 103.494C21.4241 103.762 21.0412 103.896 20.5634 103.896C20.0791 103.896 19.693 103.762 19.405 103.494C19.117 103.225 18.973 102.885 18.973 102.473ZM29.5269 105.241V107.244H23.3418V105.241H29.5269ZM24.8734 102.62H27.7008V112.663C27.7008 112.971 27.7401 113.207 27.8186 113.37C27.9037 113.534 28.0281 113.648 28.1917 113.714C28.3553 113.773 28.5615 113.802 28.8102 113.802C28.9869 113.802 29.144 113.796 29.2814 113.783C29.4254 113.763 29.5465 113.743 29.6447 113.724L29.6545 115.805C29.4123 115.883 29.1505 115.946 28.8691 115.991C28.5877 116.037 28.2768 116.06 27.9364 116.06C27.3147 116.06 26.7714 115.959 26.3067 115.756C25.8486 115.546 25.4951 115.213 25.2464 114.754C24.9977 114.296 24.8734 113.694 24.8734 112.948V102.62ZM33.8957 100.784V115.864H31.0682V100.784H33.8957ZM33.4932 110.179H32.7176C32.7241 109.44 32.8223 108.759 33.0121 108.137C33.2019 107.509 33.4735 106.966 33.827 106.508C34.1804 106.043 34.6026 105.683 35.0934 105.428C35.5909 105.172 36.1407 105.045 36.7428 105.045C37.2664 105.045 37.7409 105.12 38.1663 105.271C38.5983 105.415 38.9681 105.65 39.2757 105.978C39.5899 106.298 39.8321 106.72 40.0022 107.244C40.1724 107.768 40.2575 108.402 40.2575 109.149V115.864H37.4104V109.129C37.4104 108.658 37.3417 108.288 37.2042 108.02C37.0733 107.745 36.8802 107.552 36.625 107.44C36.3763 107.323 36.0687 107.264 35.7021 107.264C35.2963 107.264 34.9495 107.339 34.6615 107.489C34.38 107.64 34.1542 107.849 33.9841 108.118C33.8139 108.38 33.6895 108.687 33.611 109.041C33.5325 109.394 33.4932 109.774 33.4932 110.179ZM57.183 113.567V115.864H49.5744V113.567H57.183ZM50.5365 101.569V115.864H47.5912V101.569H50.5365ZM56.1914 107.391V109.63H49.5744V107.391H56.1914ZM57.1732 101.569V103.877H49.5744V101.569H57.1732ZM61.002 105.241L62.7594 108.471L64.5658 105.241H67.5798L64.5756 110.435L67.7172 115.864H64.6934L62.779 112.447L60.8646 115.864H57.8408L60.9824 110.435L57.9782 105.241H61.002ZM71.7817 107.283V119.948H68.9542V105.241H71.5755L71.7817 107.283ZM78.5067 110.435V110.641C78.5067 111.413 78.4151 112.13 78.2318 112.791C78.0551 113.452 77.7933 114.028 77.4464 114.519C77.0996 115.003 76.6676 115.383 76.1505 115.658C75.64 115.926 75.051 116.06 74.3834 116.06C73.7354 116.06 73.1725 115.929 72.6947 115.667C72.2169 115.406 71.8144 115.039 71.4872 114.568C71.1665 114.09 70.9079 113.537 70.7116 112.909C70.5152 112.28 70.3647 111.606 70.26 110.886V110.346C70.3647 109.574 70.5152 108.867 70.7116 108.226C70.9079 107.578 71.1665 107.018 71.4872 106.547C71.8144 106.069 72.2137 105.699 72.6849 105.438C73.1627 105.176 73.7223 105.045 74.3637 105.045C75.0379 105.045 75.6302 105.172 76.1407 105.428C76.6578 105.683 77.0897 106.05 77.4366 106.527C77.7901 107.005 78.0551 107.575 78.2318 108.236C78.4151 108.897 78.5067 109.63 78.5067 110.435ZM75.6695 110.641V110.435C75.6695 109.983 75.6302 109.567 75.5517 109.188C75.4797 108.802 75.3618 108.465 75.1982 108.177C75.0411 107.889 74.8317 107.666 74.5699 107.509C74.3146 107.345 74.0037 107.264 73.6372 107.264C73.2511 107.264 72.9205 107.326 72.6456 107.45C72.3773 107.575 72.158 107.755 71.9879 107.99C71.8177 108.226 71.6901 108.507 71.605 108.834C71.5199 109.162 71.4675 109.531 71.4479 109.944V111.308C71.4806 111.793 71.5723 112.228 71.7228 112.614C71.8733 112.994 72.1057 113.295 72.4198 113.517C72.734 113.74 73.1463 113.851 73.6569 113.851C74.0299 113.851 74.3441 113.769 74.5993 113.606C74.8546 113.436 75.0608 113.203 75.2179 112.909C75.3815 112.614 75.496 112.274 75.5615 111.888C75.6335 111.502 75.6695 111.086 75.6695 110.641ZM85.1532 116.06C84.3286 116.06 83.589 115.929 82.9345 115.667C82.28 115.399 81.7236 115.029 81.2655 114.558C80.8139 114.087 80.467 113.54 80.2248 112.919C79.9827 112.29 79.8616 111.623 79.8616 110.916V110.523C79.8616 109.718 79.9761 108.982 80.2052 108.314C80.4343 107.647 80.7615 107.067 81.1869 106.576C81.6189 106.086 82.1425 105.709 82.7578 105.447C83.373 105.179 84.0668 105.045 84.8391 105.045C85.5918 105.045 86.2594 105.169 86.8419 105.418C87.4244 105.667 87.912 106.02 88.3047 106.478C88.7039 106.936 89.005 107.486 89.2079 108.128C89.4108 108.762 89.5122 109.469 89.5122 110.248V111.426H81.0691V109.541H86.7339V109.325C86.7339 108.933 86.6619 108.582 86.5179 108.275C86.3804 107.961 86.171 107.712 85.8896 107.529C85.6081 107.345 85.2481 107.254 84.8096 107.254C84.4366 107.254 84.1158 107.336 83.8475 107.499C83.5792 107.663 83.3599 107.892 83.1897 108.186C83.0261 108.481 82.9017 108.828 82.8167 109.227C82.7381 109.62 82.6988 110.052 82.6988 110.523V110.916C82.6988 111.341 82.7578 111.734 82.8756 112.094C82.9999 112.454 83.1734 112.765 83.3959 113.027C83.625 113.288 83.8999 113.491 84.2206 113.635C84.5478 113.779 84.9176 113.851 85.33 113.851C85.8405 113.851 86.315 113.753 86.7535 113.557C87.1986 113.354 87.5815 113.049 87.9022 112.644L89.2766 114.136C89.0541 114.457 88.7497 114.764 88.3636 115.059C87.984 115.353 87.5258 115.595 86.9891 115.785C86.4524 115.969 85.8405 116.06 85.1532 116.06ZM93.9498 107.558V115.864H91.1223V105.241H93.7829L93.9498 107.558ZM97.1503 105.172L97.1012 107.794C96.9638 107.774 96.7969 107.758 96.6005 107.745C96.4107 107.725 96.2373 107.715 96.0802 107.715C95.6809 107.715 95.3341 107.768 95.0395 107.872C94.7515 107.971 94.5094 108.118 94.313 108.314C94.1232 108.51 93.9792 108.749 93.8811 109.031C93.7894 109.312 93.7371 109.633 93.724 109.993L93.1546 109.816C93.1546 109.129 93.2233 108.497 93.3607 107.921C93.4982 107.339 93.6978 106.832 93.9596 106.4C94.2279 105.968 94.5552 105.634 94.9414 105.398C95.3275 105.163 95.7693 105.045 96.2667 105.045C96.4238 105.045 96.5842 105.058 96.7478 105.084C96.9114 105.104 97.0456 105.133 97.1503 105.172ZM104.18 105.241V107.244H97.9946V105.241H104.18ZM99.5262 102.62H102.354V112.663C102.354 112.971 102.393 113.207 102.471 113.37C102.557 113.534 102.681 113.648 102.845 113.714C103.008 113.773 103.214 113.802 103.463 113.802C103.64 113.802 103.797 113.796 103.934 113.783C104.078 113.763 104.199 113.743 104.298 113.724L104.307 115.805C104.065 115.883 103.803 115.946 103.522 115.991C103.24 116.037 102.93 116.06 102.589 116.06C101.967 116.06 101.424 115.959 100.96 115.756C100.501 115.546 100.148 115.213 99.8992 114.754C99.6505 114.296 99.5262 113.694 99.5262 112.948V102.62Z"
                                fill="#6A9833" />
                            <defs>
                                <linearGradient id="paint0_linear_331_22297" x1="80.268" y1="11.2309"
                                    x2="23.0511" y2="73.001" gradientUnits="userSpaceOnUse">
                                    <stop stop-color="#BEED99" />
                                    <stop offset="1" stop-color="#90CA47" />
                                </linearGradient>
                                <linearGradient id="paint1_linear_331_22297" x1="80.268" y1="11.2309"
                                    x2="23.0511" y2="73.001" gradientUnits="userSpaceOnUse">
                                    <stop stop-color="#8DBD66" />
                                    <stop offset="1" stop-color="#71A62D" />
                                </linearGradient>
                            </defs>
                        </svg>
                        <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/vs-logo.png"
                            alt="">
                        <svg width="138" height="123" viewBox="0 0 138 123" fill="none"
                            xmlns="http://www.w3.org/2000/svg">
                            <g opacity="0.4">
                                <mask id="path-1-inside-1_331_22298" fill="white">
                                    <path
                                        d="M109.479 42.7656C109.479 66.3844 90.3326 85.5312 66.7138 85.5312C43.095 85.5312 23.9482 66.3844 23.9482 42.7656C23.9482 19.1468 43.095 0 66.7138 0C90.3326 0 109.479 19.1468 109.479 42.7656ZM33.3567 42.7656C33.3567 61.1882 48.2912 76.1227 66.7138 76.1227C85.1365 76.1227 100.071 61.1882 100.071 42.7656C100.071 24.3429 85.1365 9.40843 66.7138 9.40843C48.2912 9.40843 33.3567 24.3429 33.3567 42.7656Z" />
                                </mask>
                                <path
                                    d="M109.479 42.7656C109.479 66.3844 90.3326 85.5312 66.7138 85.5312C43.095 85.5312 23.9482 66.3844 23.9482 42.7656C23.9482 19.1468 43.095 0 66.7138 0C90.3326 0 109.479 19.1468 109.479 42.7656ZM33.3567 42.7656C33.3567 61.1882 48.2912 76.1227 66.7138 76.1227C85.1365 76.1227 100.071 61.1882 100.071 42.7656C100.071 24.3429 85.1365 9.40843 66.7138 9.40843C48.2912 9.40843 33.3567 24.3429 33.3567 42.7656Z"
                                    stroke="url(#paint0_linear_331_22298)" stroke-width="10.1481" stroke-linecap="round"
                                    mask="url(#path-1-inside-1_331_22298)" />
                            </g>
                            <mask id="path-2-inside-2_331_22298" fill="white">
                                <path
                                    d="M104.775 42.7656C107.373 42.7656 109.506 44.878 109.221 47.4604C108.729 51.9106 107.541 56.2659 105.691 60.3642C103.193 65.8952 99.5473 70.8313 94.9952 74.8445C90.4431 78.8577 85.0889 81.8562 79.2886 83.6406C74.9907 84.9628 70.5207 85.596 66.044 85.5259C63.4463 85.4852 61.6178 83.1044 61.9435 80.5268C62.2691 77.9492 64.6285 76.1587 67.2263 76.1188C70.371 76.0705 73.5011 75.5775 76.5222 74.6481C81.0464 73.2563 85.2226 70.9175 88.7733 67.7871C92.324 64.6568 95.1677 60.8067 97.1156 56.4925C98.4164 53.6117 99.2977 50.5681 99.7398 47.4543C100.105 44.882 102.177 42.7656 104.775 42.7656Z" />
                            </mask>
                            <path
                                d="M104.775 42.7656C107.373 42.7656 109.506 44.878 109.221 47.4604C108.729 51.9106 107.541 56.2659 105.691 60.3642C103.193 65.8952 99.5473 70.8313 94.9952 74.8445C90.4431 78.8577 85.0889 81.8562 79.2886 83.6406C74.9907 84.9628 70.5207 85.596 66.044 85.5259C63.4463 85.4852 61.6178 83.1044 61.9435 80.5268C62.2691 77.9492 64.6285 76.1587 67.2263 76.1188C70.371 76.0705 73.5011 75.5775 76.5222 74.6481C81.0464 73.2563 85.2226 70.9175 88.7733 67.7871C92.324 64.6568 95.1677 60.8067 97.1156 56.4925C98.4164 53.6117 99.2977 50.5681 99.7398 47.4543C100.105 44.882 102.177 42.7656 104.775 42.7656Z"
                                stroke="url(#paint1_linear_331_22298)" stroke-width="10.1481" stroke-linecap="round"
                                mask="url(#path-2-inside-2_331_22298)" />
                            <path
                                d="M57.8274 46.397V48.9752H46.4145V46.7751L51.8115 40.9885C52.3539 40.385 52.7817 39.8541 53.0949 39.3957C53.4081 38.9297 53.6335 38.5134 53.771 38.1467C53.9161 37.7724 53.9887 37.4172 53.9887 37.0811C53.9887 36.5769 53.9047 36.1453 53.7366 35.7862C53.5685 35.4196 53.3203 35.1369 52.9918 34.9383C52.671 34.7397 52.2737 34.6404 51.8001 34.6404C51.2959 34.6404 50.8605 34.7626 50.4938 35.007C50.1348 35.2515 49.8597 35.5914 49.6688 36.0269C49.4854 36.4623 49.3938 36.955 49.3938 37.505H46.0822C46.0822 36.512 46.319 35.6029 46.7926 34.7779C47.2663 33.9452 47.9347 33.2844 48.7979 32.7955C49.6611 32.299 50.6848 32.0507 51.8688 32.0507C53.0376 32.0507 54.0231 32.2417 54.8252 32.6236C55.6349 32.9979 56.2461 33.5403 56.6586 34.2508C57.0787 34.9536 57.2888 35.7939 57.2888 36.7717C57.2888 37.3217 57.201 37.8603 57.0253 38.3874C56.8496 38.9068 56.5975 39.4263 56.269 39.9457C55.9481 40.4576 55.5585 40.977 55.1002 41.5041C54.6418 42.0312 54.1338 42.5774 53.5762 43.1427L50.6771 46.397H57.8274ZM70.7533 32.2913V34.0674L64.302 48.9752H60.8186L67.2698 34.8695H58.9622V32.2913H70.7533ZM72.3809 36.3821V35.4998C72.3809 34.8657 72.5184 34.289 72.7934 33.7695C73.0684 33.25 73.4733 32.8337 74.008 32.5205C74.5427 32.2073 75.1997 32.0507 75.9789 32.0507C76.781 32.0507 77.4494 32.2073 77.9842 32.5205C78.5266 32.8337 78.9314 33.25 79.1988 33.7695C79.4738 34.289 79.6113 34.8657 79.6113 35.4998V36.3821C79.6113 37.0009 79.4738 37.57 79.1988 38.0894C78.9314 38.6089 78.5304 39.0252 77.9956 39.3384C77.4609 39.6516 76.8001 39.8082 76.0133 39.8082C75.2188 39.8082 74.5504 39.6516 74.008 39.3384C73.4733 39.0252 73.0684 38.6089 72.7934 38.0894C72.5184 37.57 72.3809 37.0009 72.3809 36.3821ZM74.5695 35.4998V36.3821C74.5695 36.6495 74.6191 36.9054 74.7184 37.1498C74.8254 37.3866 74.9858 37.5814 75.1997 37.7342C75.4212 37.8794 75.6886 37.9519 76.0018 37.9519C76.3303 37.9519 76.5977 37.8794 76.8039 37.7342C77.0102 37.5814 77.163 37.3866 77.2623 37.1498C77.3616 36.9054 77.4112 36.6495 77.4112 36.3821V35.4998C77.4112 35.2171 77.3578 34.9574 77.2508 34.7206C77.1515 34.4761 76.9949 34.2813 76.781 34.1362C76.5748 33.9834 76.3074 33.907 75.9789 33.907C75.6733 33.907 75.4136 33.9834 75.1997 34.1362C74.9858 34.2813 74.8254 34.4761 74.7184 34.7206C74.6191 34.9574 74.5695 35.2171 74.5695 35.4998ZM80.3561 45.7668V44.8845C80.3561 44.258 80.4936 43.6851 80.7686 43.1656C81.0513 42.6462 81.46 42.2299 81.9947 41.9166C82.5371 41.6034 83.2017 41.4468 83.9885 41.4468C84.783 41.4468 85.4476 41.6034 85.9824 41.9166C86.5171 42.2299 86.922 42.6462 87.197 43.1656C87.472 43.6851 87.6095 44.258 87.6095 44.8845V45.7668C87.6095 46.3932 87.472 46.9661 87.197 47.4856C86.9296 48.005 86.5286 48.4214 85.9938 48.7346C85.4591 49.0478 84.7983 49.2044 84.0115 49.2044C83.217 49.2044 82.5486 49.0478 82.0062 48.7346C81.4638 48.4214 81.0513 48.005 80.7686 47.4856C80.4936 46.9661 80.3561 46.3932 80.3561 45.7668ZM82.5562 44.8845V45.7668C82.5562 46.0418 82.6173 46.3015 82.7395 46.546C82.8618 46.7904 83.0298 46.9852 83.2437 47.1304C83.4653 47.2755 83.7212 47.3481 84.0115 47.3481C84.3781 47.3481 84.6646 47.2755 84.8709 47.1304C85.0771 46.9852 85.2184 46.7904 85.2948 46.546C85.3789 46.3015 85.4209 46.0418 85.4209 45.7668V44.8845C85.4209 44.6094 85.3674 44.3535 85.2605 44.1167C85.1535 43.8723 84.9931 43.6775 84.7792 43.5323C84.5729 43.3795 84.3094 43.3032 83.9885 43.3032C83.6677 43.3032 83.4003 43.3795 83.1864 43.5323C82.9802 43.6775 82.8236 43.8723 82.7166 44.1167C82.6097 44.3535 82.5562 44.6094 82.5562 44.8845ZM84.8021 34.6747L76.655 47.7148L75.0507 46.8668L83.1979 33.8268L84.8021 34.6747Z"
                                fill="#FD3A5F" />
                            <path
                                d="M13.5755 113.876L16.1075 103.18H17.522L17.845 104.961L15.1471 115.892H13.6279L13.5755 113.876ZM12.2745 103.18L14.37 113.876L14.1954 115.892H12.5015L9.68138 103.18H12.2745ZM20.0715 113.832L22.1408 103.18H24.7339L21.9225 115.892H20.2286L20.0715 113.832ZM18.3165 103.18L20.866 113.919L20.7962 115.892H19.2769L16.5615 104.952L16.9108 103.18H18.3165ZM28.6542 106.445V115.892H26.1309V106.445H28.6542ZM25.9737 103.983C25.9737 103.616 26.1018 103.314 26.3579 103.075C26.614 102.836 26.9574 102.717 27.3882 102.717C27.8131 102.717 28.1536 102.836 28.4097 103.075C28.6717 103.314 28.8026 103.616 28.8026 103.983C28.8026 104.35 28.6717 104.653 28.4097 104.891C28.1536 105.13 27.8131 105.249 27.3882 105.249C26.9574 105.249 26.614 105.13 26.3579 104.891C26.1018 104.653 25.9737 104.35 25.9737 103.983ZM35.3597 106.445V108.226H29.8591V106.445H35.3597ZM31.2212 104.114H33.7357V113.046C33.7357 113.32 33.7707 113.529 33.8405 113.675C33.9162 113.82 34.0268 113.922 34.1723 113.98C34.3178 114.033 34.5012 114.059 34.7224 114.059C34.8795 114.059 35.0192 114.053 35.1415 114.041C35.2695 114.024 35.3772 114.007 35.4645 113.989L35.4732 115.84C35.2579 115.91 35.025 115.965 34.7747 116.006C34.5245 116.047 34.248 116.067 33.9453 116.067C33.3923 116.067 32.9092 115.977 32.4959 115.796C32.0885 115.61 31.7741 115.313 31.5529 114.906C31.3318 114.498 31.2212 113.963 31.2212 113.299V104.114ZM39.2451 102.481V115.892H36.7305V102.481H39.2451ZM38.8871 110.837H38.1974C38.2032 110.179 38.2905 109.574 38.4593 109.021C38.6281 108.462 38.8697 107.979 39.184 107.572C39.4983 107.158 39.8737 106.838 40.3103 106.611C40.7527 106.384 41.2416 106.271 41.7771 106.271C42.2428 106.271 42.6648 106.338 43.0432 106.472C43.4273 106.6 43.7562 106.809 44.0298 107.1C44.3092 107.385 44.5245 107.761 44.6759 108.226C44.8272 108.692 44.9029 109.257 44.9029 109.92V115.892H42.3709V109.903C42.3709 109.484 42.3097 109.155 42.1875 108.916C42.0711 108.672 41.8994 108.5 41.6724 108.401C41.4512 108.296 41.1776 108.244 40.8516 108.244C40.4907 108.244 40.1822 108.311 39.9261 108.445C39.6758 108.579 39.475 108.765 39.3237 109.004C39.1723 109.236 39.0617 109.51 38.9919 109.824C38.922 110.139 38.8871 110.476 38.8871 110.837ZM46.4134 111.265V111.082C46.4134 110.389 46.5123 109.752 46.7102 109.169C46.9082 108.582 47.1963 108.072 47.5746 107.642C47.953 107.211 48.4186 106.876 48.9716 106.637C49.5246 106.393 50.1591 106.271 50.875 106.271C51.591 106.271 52.2283 106.393 52.7871 106.637C53.3459 106.876 53.8145 107.211 54.1929 107.642C54.577 108.072 54.8681 108.582 55.066 109.169C55.2639 109.752 55.3628 110.389 55.3628 111.082V111.265C55.3628 111.952 55.2639 112.589 55.066 113.177C54.8681 113.759 54.577 114.268 54.1929 114.705C53.8145 115.136 53.3488 115.47 52.7959 115.709C52.2429 115.948 51.6084 116.067 50.8925 116.067C50.1765 116.067 49.5391 115.948 48.9804 115.709C48.4274 115.47 47.9588 115.136 47.5746 114.705C47.1963 114.268 46.9082 113.759 46.7102 113.177C46.5123 112.589 46.4134 111.952 46.4134 111.265ZM48.928 111.082V111.265C48.928 111.661 48.9629 112.03 49.0327 112.374C49.1026 112.717 49.2132 113.02 49.3645 113.282C49.5217 113.538 49.7254 113.739 49.9757 113.884C50.226 114.03 50.5316 114.103 50.8925 114.103C51.2417 114.103 51.5415 114.03 51.7918 113.884C52.0421 113.739 52.2429 113.538 52.3942 113.282C52.5456 113.02 52.6562 112.717 52.726 112.374C52.8017 112.03 52.8395 111.661 52.8395 111.265V111.082C52.8395 110.697 52.8017 110.337 52.726 109.999C52.6562 109.655 52.5427 109.353 52.3855 109.091C52.2342 108.823 52.0333 108.614 51.7831 108.462C51.5328 108.311 51.2301 108.235 50.875 108.235C50.5199 108.235 50.2173 108.311 49.967 108.462C49.7225 108.614 49.5217 108.823 49.3645 109.091C49.2132 109.353 49.1026 109.655 49.0327 109.999C48.9629 110.337 48.928 110.697 48.928 111.082ZM62.4962 113.631V106.445H65.0108V115.892H62.6446L62.4962 113.631ZM62.7756 111.693L63.5177 111.675C63.5177 112.304 63.445 112.889 63.2995 113.43C63.1539 113.966 62.9357 114.431 62.6446 114.827C62.3536 115.217 61.9869 115.523 61.5445 115.744C61.1021 115.959 60.5812 116.067 59.9816 116.067C59.5218 116.067 59.0969 116.003 58.7069 115.875C58.3227 115.741 57.9909 115.534 57.7115 115.255C57.4379 114.97 57.2226 114.606 57.0654 114.164C56.9141 113.715 56.8384 113.177 56.8384 112.548V106.445H59.353V112.566C59.353 112.845 59.385 113.081 59.449 113.273C59.5189 113.465 59.6149 113.622 59.7371 113.745C59.8594 113.867 60.002 113.954 60.165 114.007C60.3338 114.059 60.52 114.085 60.7238 114.085C61.2418 114.085 61.6493 113.98 61.9461 113.771C62.2488 113.561 62.4613 113.276 62.5835 112.915C62.7116 112.548 62.7756 112.141 62.7756 111.693ZM71.5591 106.445V108.226H66.0585V106.445H71.5591ZM67.4206 104.114H69.9351V113.046C69.9351 113.32 69.9701 113.529 70.0399 113.675C70.1156 113.82 70.2262 113.922 70.3717 113.98C70.5172 114.033 70.7006 114.059 70.9218 114.059C71.0789 114.059 71.2186 114.053 71.3409 114.041C71.4689 114.024 71.5766 114.007 71.6639 113.989L71.6726 115.84C71.4573 115.91 71.2244 115.965 70.9742 116.006C70.7239 116.047 70.4474 116.067 70.1447 116.067C69.5917 116.067 69.1086 115.977 68.6953 115.796C68.2879 115.61 67.9735 115.313 67.7524 114.906C67.5312 114.498 67.4206 113.963 67.4206 113.299V104.114ZM86.1314 113.849V115.892H79.3648V113.849H86.1314ZM80.2204 103.18V115.892H77.6011V103.18H80.2204ZM85.2496 108.357V110.348H79.3648V108.357H85.2496ZM86.1227 103.18V105.232H79.3648V103.18H86.1227ZM89.5279 106.445L91.0908 109.318L92.6973 106.445H95.3778L92.706 111.064L95.5 115.892H92.8108L91.1082 112.854L89.4056 115.892H86.7164L89.5104 111.064L86.8387 106.445H89.5279ZM99.1147 108.261V119.525H96.6001V106.445H98.9313L99.1147 108.261ZM105.096 111.064V111.247C105.096 111.934 105.014 112.572 104.851 113.16C104.694 113.748 104.461 114.26 104.153 114.696C103.844 115.127 103.46 115.465 103 115.709C102.546 115.948 102.022 116.067 101.428 116.067C100.852 116.067 100.352 115.951 99.9267 115.718C99.5018 115.485 99.1438 115.159 98.8528 114.74C98.5675 114.315 98.3376 113.823 98.163 113.264C97.9884 112.706 97.8545 112.106 97.7614 111.466V110.986C97.8545 110.299 97.9884 109.67 98.163 109.1C98.3376 108.523 98.5675 108.026 98.8528 107.607C99.1438 107.182 99.4989 106.853 99.918 106.62C100.343 106.387 100.841 106.271 101.411 106.271C102.011 106.271 102.537 106.384 102.991 106.611C103.451 106.838 103.835 107.164 104.144 107.589C104.458 108.014 104.694 108.52 104.851 109.108C105.014 109.696 105.096 110.348 105.096 111.064ZM102.572 111.247V111.064C102.572 110.662 102.537 110.293 102.467 109.955C102.403 109.612 102.299 109.312 102.153 109.056C102.013 108.8 101.827 108.602 101.594 108.462C101.367 108.317 101.091 108.244 100.765 108.244C100.421 108.244 100.128 108.299 99.883 108.41C99.6444 108.52 99.4494 108.681 99.298 108.89C99.1467 109.1 99.0332 109.35 98.9575 109.641C98.8819 109.932 98.8353 110.261 98.8178 110.628V111.841C98.8469 112.272 98.9284 112.659 99.0623 113.002C99.1962 113.34 99.4028 113.608 99.6822 113.806C99.9616 114.004 100.328 114.103 100.782 114.103C101.114 114.103 101.394 114.03 101.621 113.884C101.848 113.733 102.031 113.526 102.171 113.264C102.316 113.002 102.418 112.7 102.476 112.356C102.54 112.013 102.572 111.643 102.572 111.247ZM111.007 116.067C110.273 116.067 109.615 115.951 109.033 115.718C108.451 115.479 107.956 115.15 107.549 114.731C107.147 114.312 106.839 113.826 106.623 113.273C106.408 112.714 106.3 112.121 106.3 111.492V111.143C106.3 110.427 106.402 109.772 106.606 109.178C106.81 108.584 107.101 108.069 107.479 107.633C107.863 107.196 108.329 106.862 108.876 106.629C109.423 106.39 110.04 106.271 110.727 106.271C111.397 106.271 111.99 106.381 112.508 106.602C113.026 106.824 113.46 107.138 113.809 107.545C114.164 107.953 114.432 108.442 114.613 109.012C114.793 109.577 114.883 110.206 114.883 110.898V111.946H107.374V110.27H112.412V110.078C112.412 109.728 112.348 109.417 112.22 109.143C112.098 108.864 111.912 108.643 111.661 108.48C111.411 108.317 111.091 108.235 110.701 108.235C110.369 108.235 110.084 108.308 109.845 108.454C109.607 108.599 109.412 108.803 109.26 109.065C109.115 109.327 109.004 109.635 108.929 109.99C108.859 110.339 108.824 110.724 108.824 111.143V111.492C108.824 111.87 108.876 112.22 108.981 112.54C109.092 112.86 109.246 113.136 109.444 113.369C109.647 113.602 109.892 113.782 110.177 113.91C110.468 114.039 110.797 114.103 111.164 114.103C111.618 114.103 112.04 114.015 112.43 113.841C112.826 113.66 113.166 113.39 113.451 113.029L114.674 114.356C114.476 114.641 114.205 114.915 113.862 115.177C113.524 115.438 113.117 115.654 112.639 115.823C112.162 115.986 111.618 116.067 111.007 116.067ZM118.83 108.506V115.892H116.315V106.445H118.681L118.83 108.506ZM121.676 106.384L121.632 108.715C121.51 108.698 121.362 108.683 121.187 108.672C121.018 108.654 120.864 108.646 120.724 108.646C120.369 108.646 120.061 108.692 119.799 108.785C119.543 108.873 119.327 109.004 119.153 109.178C118.984 109.353 118.856 109.565 118.769 109.816C118.687 110.066 118.64 110.351 118.629 110.671L118.122 110.514C118.122 109.903 118.184 109.341 118.306 108.829C118.428 108.311 118.606 107.86 118.838 107.476C119.077 107.091 119.368 106.795 119.712 106.585C120.055 106.375 120.448 106.271 120.89 106.271C121.03 106.271 121.173 106.282 121.318 106.306C121.464 106.323 121.583 106.349 121.676 106.384ZM127.928 106.445V108.226H122.427V106.445H127.928ZM123.789 104.114H126.304V113.046C126.304 113.32 126.338 113.529 126.408 113.675C126.484 113.82 126.595 113.922 126.74 113.98C126.886 114.033 127.069 114.059 127.29 114.059C127.447 114.059 127.587 114.053 127.709 114.041C127.837 114.024 127.945 114.007 128.032 113.989L128.041 115.84C127.826 115.91 127.593 115.965 127.343 116.006C127.092 116.047 126.816 116.067 126.513 116.067C125.96 116.067 125.477 115.977 125.064 115.796C124.656 115.61 124.342 115.313 124.121 114.906C123.9 114.498 123.789 113.963 123.789 113.299V104.114Z"
                                fill="#FD3A5F" />
                            <defs>
                                <linearGradient id="paint0_linear_331_22298" x1="96.7737" y1="11.4661"
                                    x2="38.3584" y2="74.5299" gradientUnits="userSpaceOnUse">
                                    <stop stop-color="#FFA4A4" />
                                    <stop offset="1" stop-color="#F24768" />
                                </linearGradient>
                                <linearGradient id="paint1_linear_331_22298" x1="96.7737" y1="11.4661"
                                    x2="38.3584" y2="74.5299" gradientUnits="userSpaceOnUse">
                                    <stop stop-color="#FF2E2E" />
                                    <stop offset="1" stop-color="#F24768" />
                                </linearGradient>
                            </defs>
                        </svg>

                    </div>
                </div>
            </div> --}}
        </main>
    {{-- </div> --}}

    {{-- <div class="m-content container">
        <a href="javascript:;" class="logo">
            <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/gradding-logo-mobile.svg"
                alt="gradding-logo-mobile">
        </a>

        <div class="small-banner">
            <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/verified.svg" alt="verified-icon">
            <p class="head">
                India’s <span class="blue">Most Trusted</span> <span class="red">IELTS</span> Prep Platform
            </p>
            <span class="text">Certified by</span>

            <div class="logo-list">
                <a href="javascript:;" class="single-logo">
                    <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/british.png"
                        alt="british">
                </a>

                <a href="javascript:;" class="single-logo">
                    <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/icef.png" alt="icef">
                </a>

                <a href="javascript:;" class="single-logo">
                    <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/ciac.png" alt="ciac">
                </a>

                <a href="javascript:;" class="single-logo">
                    <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/cca.png" alt="cca">
                </a>
            </div>
        </div>

        <p class="mid-head">
            Book Your <span class="blue">FREE</span> Demo Class
        </p>

        <img class="mid-icon" src="{{ asset('frontend') }}/assets-desktop/images/start-journey/limited-seat.png"
            alt="limited">

        <form class="form">
            <div class="single-input country-input">
                <select name="country_code" id="" class="country-select">
                    <option value="IN +91">IN +91</option>
                </select>

                <input class="input-field phone-validate" type="tel" placeholder="Enter Your Mobile Number"
                    value="" id="" aria-label="mobile number" name="phone" maxlength="15">
                <span class="spin-loader" style="display: none;"></span>
            </div>

            <!--show when not Login-->
            <div class="single-input name-input" style="">
                <input class="input-field" type="text" placeholder="First Name" value=""
                    id="" aria-label="Name" name="name">
                <input class="input-field" type="text" placeholder="Last Name" value=""
                    id="" aria-label="Name" name="last_name">
            </div>

            <button class="form-btn" type="submit">Book Seat</button>
        </form>
    </div> --}}

    {{-- Popup Authmodal --}}
    <div id="login" class="model" style="display: none">
        <div class="model-content">
            <div class="popup-body">
                <div class="popup-brand">
                    <div class="logo-card">
                        {{-- <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/auth-ielts-logo.png" alt="">
                        <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/auth-grad-logo.png" alt=""> --}}
                        <img src="{{ asset('student-panel') }}/images/grad-edu-logo.png" alt="">
                    </div>
                    <p class="brand-desc">India’s Largest IELTS Prep Platform</p>
                </div>
                {{-- <p class="head">Register Now and Get <span class="green">FREE</span></p> --}}
                {{-- <p class="head">Enter Your details below to book your FREE Demo Class</p> --}}
                {{-- <p class="head">Stop wasting time Googling IELTS stuff! Secure your spot for a FREE Demo Class now - your first step towards success!</p> --}}
                {{-- <p class="head">Level up your IELTS game by snagging a spot for your FREE Demo Class. It's not just a class; it's your shortcut to success.</p> --}}
                {{-- <p class="popup-desc">Your Hassle-Free Study Abroad Journey Starts Here!</p> --}}
                <div class="ielts-highlight-parent">
                    <p class="head">Register Now and Get <span class="green">FREE</span></p>
                    <div class="ielts-highlights-strip">
                        <div class="single-highlight">
                            <span class="highlight-svg">
                                <svg width="49" height="48" viewBox="0 0 49 48" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <circle cx="24.4366" cy="24.039" r="23.3684" fill="#F7FFF5" stroke="#51B53C" stroke-width="1.03859"/>
                                    <path d="M34.4366 27.0391V21.0391C34.4366 16.0391 32.4366 14.0391 27.4366 14.0391H21.4366C16.4366 14.0391 14.4366 16.0391 14.4366 21.0391V27.0391C14.4366 32.0391 16.4366 34.0391 21.4366 34.0391H27.4366C32.4366 34.0391 34.4366 32.0391 34.4366 27.0391Z" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M14.9566 19.1494H33.9166" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M20.9566 14.1494V19.0094" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M27.9166 14.1494V18.5594" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M22.1866 26.4892V25.2892C22.1866 23.7492 23.2766 23.1192 24.6066 23.8892L25.6466 24.4892L26.6866 25.0892C28.0166 25.8592 28.0166 27.1192 26.6866 27.8892L25.6466 28.4892L24.6066 29.0892C23.2766 29.8592 22.1866 29.2292 22.1866 27.6892V26.4892V26.4892Z" stroke="#51B53C" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
                                </svg>                                                                                                             
                            </span>
                            <p class="highlight-desc">
                                <strong>FREE</strong> Demo Class
                            </p>
                        </div>
                        <div class="single-highlight">
                            <span class="highlight-svg">
                                <svg width="49" height="48" viewBox="0 0 49 48" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <circle cx="24.1705" cy="24.1182" r="23.3684" fill="#F7FFF5" stroke="#51B53C" stroke-width="1.03859"/>
                                    <path d="M24.5405 20.998H29.7905" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M18.5505 20.998L19.3005 21.748L21.5505 19.498" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M24.5405 27.998H29.7905" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M18.5505 27.998L19.3005 28.748L21.5505 26.498" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M21.1705 34.1182H27.1705C32.1705 34.1182 34.1705 32.1182 34.1705 27.1182V21.1182C34.1705 16.1182 32.1705 14.1182 27.1705 14.1182H21.1705C16.1705 14.1182 14.1705 16.1182 14.1705 21.1182V27.1182C14.1705 32.1182 16.1705 34.1182 21.1705 34.1182Z" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                </svg>                                                                                                              
                            </span>
                            <p class="highlight-desc">
                                FREE <br>
                                Pre-<span class="red">IELTS</span> Test
                            </p>
                        </div>
                        <div class="single-highlight">
                            <span class="highlight-svg">
                                <svg width="49" height="48" viewBox="0 0 49 48" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <circle cx="24.7375" cy="24.039" r="23.3684" fill="#F7FFF5" stroke="#51B53C" stroke-width="1.03859"/>
                                    <path d="M21.8976 22.9091C21.7976 22.8991 21.6776 22.8991 21.5676 22.9091C19.1876 22.8291 17.2976 20.8791 17.2976 18.4791C17.2976 16.0291 19.2776 14.0391 21.7376 14.0391C24.1876 14.0391 26.1776 16.0291 26.1776 18.4791C26.1676 20.8791 24.2776 22.8291 21.8976 22.9091Z" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M29.1476 16.0391C31.0876 16.0391 32.6476 17.6091 32.6476 19.5391C32.6476 21.4291 31.1476 22.9691 29.2776 23.0391C29.1976 23.0291 29.1076 23.0291 29.0176 23.0391" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M16.8975 26.5991C14.4775 28.2191 14.4775 30.8591 16.8975 32.4691C19.6475 34.3091 24.1575 34.3091 26.9075 32.4691C29.3275 30.8491 29.3275 28.2091 26.9075 26.5991C24.1675 24.7691 19.6575 24.7691 16.8975 26.5991Z" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <path d="M31.0775 32.0391C31.7975 31.8891 32.4775 31.5991 33.0375 31.1691C34.5975 29.9991 34.5975 28.0691 33.0375 26.8991C32.4875 26.4791 31.8175 26.1991 31.1075 26.0391" stroke="#51B53C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                </svg>                                                                                                             
                            </span>
                            <p class="highlight-desc">
                                1-1 Counselling
                            </p>
                        </div>
                        
                    </div>
                    <span class="left-arrow">
                        <svg width="44" height="59" viewBox="0 0 44 59" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M43.5536 4.53343C31.2298 5.79458 6.97825 17.5397 8.56222 54.431" stroke="#779ACB" stroke-width="2"/>
                            <path d="M1.05927 50.4775L9.21553 55.6661L14.464 47.4156" stroke="#779ACB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                        </svg>                            
                    </span>
                    <span class="right-arrow">
                        <svg width="48" height="67" viewBox="0 0 48 67" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M0.74939 7.36035C14.1607 8.38856 40.6667 20.509 39.3999 60.7654" stroke="#779ACB" stroke-width="2"/>
                            <path d="M32.9688 52.8867L38.6247 60.7261L46.5547 55.0047" stroke="#779ACB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                        </svg>                                                       
                    </span>
                </div>
                
                <div class="certified-strip">
                    <hr>
                    <p class="strip-title">Certified by</p>
                    <div class="comp-list">
                        <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/british.png" alt="">
                        <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/icef.png" alt="">
                        <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/ciac.png" alt="">
                        <img src="{{ asset('frontend') }}/assets-desktop/images/start-journey/cca.png" alt="">
                    </div>
                </div>
                <form class="plan-lead-form register-ielts-form" id="plan-lead-form">
                    <div class="single-input country-input">
                        <select name="country_code" id="" class="country-select">
                            <option value="" selected>IN(+91)</option>
                        </select>

                        <input class="input-field phone-validate" type="tel"
                            placeholder="Enter Your Mobile Number" value="" id="phone"
                            aria-label="mobile number" name="phone">
                        <span class="spin-loader" style="display: none"></span>
                    </div>

                    <!--show when not Login-->
                    <div class="single-input name-input" style="display: none">
                        <input class="input-field" type="text" placeholder="First Name" value=""
                            id="" aria-label="Name" name="name">
                        <input class="input-field" type="text" placeholder="Last Name" value=""
                            id="" aria-label="Name" name="last_name">
                    </div>
                    {{-- <div class="single-input book-input">
                        <select name="book_slot" id="" class="slot-select">
                            <option value="" selected disabled>Book a Slot</option>
                            <option value="10:00 AM - 11:00 AM">10:00 AM - 11:00 AM</option>
                            <option value="11:00 AM - 12:00 PM">11:00 AM - 12:00 PM</option>
                            <option value="12:00 PM - 1:00 PM">12:00 PM - 1:00 PM</option>
                            <option value="1:00 PM - 2:00 PM">1:00 PM - 2:00 PM</option>
                            <option value="2:00 PM - 3:00 PM">2:00 PM - 3:00 PM</option>
                            <option value="3:00 PM - 4:00 PM">3:00 PM - 4:00 PM</option>
                            <option value="4:00 PM - 5:00 PM">4:00 PM - 5:00 PM</option>
                            <option value="5:00 PM - 6:00 PM">5:00 PM - 6:00 PM</option>
                        </select>
                    </div> --}}

                    <div class="agree-checkbox">
                        {{-- <input type="checkbox" checked> --}}
                        <input type="checkbox" id="weekday-1" name="weekday-1" value="Friday" checked>
                        <label class="bottom-text" for="weekday-1">I agree to receive whatsapp messages from
                            gradding</label>
                    </div>
                    <button class="form-btn submit-button" type="submit">Continue
                        <span class="loader" style="display: none"></span>
                    </button>
                </form>
                <!--hide when screen-2 is visible-->

            </div>
            {{-- <button type="button" class="close-button" data-close="model" aria-label="Close">
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                    xmlns="http://www.w3.org/2000/svg">
                    <path d="M7 7L17 17" stroke="#2B3340" stroke-width="2" stroke-linecap="round" />
                    <path d="M17 7L7 17" stroke="#2B3340" stroke-width="2" stroke-linecap="round" />
                </svg>
            </button> --}}
        </div>
    </div>

    <div id="login-success" class="model" style="display:none;">
        <div class="model-content">
            <div class="modal-body">
                <span class="close" data-close="model">&times;</span>
                <div class="login-success-popup">
                    <lottie-player class="popup-img" src="{{ asset('frontend') }}/assets-desktop/js/success.json"
                        background="transparent" speed="1" width="100%" hight="100%"
                        style="width:133px; height:102px;" loop autoplay></lottie-player>
                    <p class="head">Login Successful!</p>
                </div>
            </div>
        </div>
    </div>

    <div id="pin-popup" class="model" style="display:none">
        <div class="model-content">
            
    
            <div class="modal-body">
                <span class="close" data-close="model">
                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path d="M7 7L17 17" stroke="#2B3340" stroke-width="2" stroke-linecap="round"></path>
                        <path d="M17 7L7 17" stroke="#2B3340" stroke-width="2" stroke-linecap="round"></path>
                    </svg>
                </span>
                <div class="mid-content common-space container">
                    <div class="screen-3">
                        <lottie-player class="popup-img" src="{{ asset('frontend') }}/assets-desktop/js/pin.json"
                            background="transparent" speed="1" width="100%" height="100%"
                            style="width:120px; height:120px;" loop autoplay></lottie-player>
    
                        <p class="edit-num"><span class="phone_edit">+91 14253 52142</span>
                            <a href="javascript:;" id="edit__btn1" class="edit-icon" aria-label="edit">
                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                    xmlns="http://www.w3.org/2000/svg">
                                    <path
                                        d="M7.30978 3.59676L2.18753 8.71901C2.11695 8.78962 2.07264 8.88225 2.06197 8.98151L1.75265 11.7645C1.74589 11.8256 1.75209 11.8875 1.77086 11.9461C1.78963 12.0046 1.82054 12.0586 1.86158 12.1044C1.90262 12.1503 1.95286 12.1869 2.00902 12.212C2.06519 12.2371 2.12601 12.2501 2.18753 12.2501C2.20361 12.2501 2.21967 12.2492 2.23566 12.2474L5.02034 11.9381C5.11961 11.9275 5.21223 11.8832 5.28284 11.8126L10.4033 6.69076L7.30978 3.59676ZM12.4093 2.82851L11.1716 1.59083C10.9255 1.34477 10.5917 1.20654 10.2437 1.20654C9.89563 1.20654 9.56185 1.34477 9.31572 1.59083L7.92841 2.97814L11.022 6.07214L12.4097 4.68439C12.6557 4.4382 12.7939 4.10439 12.7938 3.75636C12.7937 3.40833 12.6554 3.07458 12.4093 2.82851Z"
                                        fill="#066AC9" />
                                </svg>
    
                            </a>
                        </p>
    
                        <p class="head login-condition">Create your 4 digit Login PIN</p>
    
                        <form id="user-pin-form">
                            <div class="pin-input">
                                <input class="input-field" type="tel" value="" id="pin-input-0" aria-label="code"
                                    maxlength="1" oninput="handlePinInput(0, this);" onkeydown="handleKeyDown(event, 0);">
                                <input class="input-field" type="tel" value="" id="pin-input-1" aria-label="code"
                                    maxlength="1" oninput="handlePinInput(1, this);" onkeydown="handleKeyDown(event, 1);">
                                <input class="input-field" type="tel" value="" id="pin-input-2" aria-label="code"
                                    maxlength="1" oninput="handlePinInput(2, this);" onkeydown="handleKeyDown(event, 2);">
                                <input class="input-field" type="tel" value="" id="pin-input-3" aria-label="code"
                                    maxlength="1" oninput="handlePinInput(3, this);" onkeydown="handleKeyDown(event, 3);">
                                    <p class="wrong-pin-error" style="display: none">Invalid Pin</p>
                            </div>
    
                            <p class="small-head" style="display: none">Forgot Pin? <a href="javascript:;" class="blue reset-link">Reset</a></p> <!-- Hide when new pin is created-->
                            <input type="hidden" name="template" value="register_ielts">
    
                            <button type="submit" class="form-btn submit-button">Continue
                                <span class="loader" style="display: none"></span>
                            </button>
                            <p class="bottom-text">By continuing, you agree to our <a class="link" target="_blank" href="/terms-condition">Terms of service</a> and <a class="link" target="_blank" href="/privacy-policy">Privacy policy</a></p>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div id="plan-lead-validate-popup" class="model" style="display:none;">
        <div class="model-content">


            <div class="modal-body">
                <span class="close close-button" data-close="model"><svg width="24" height="24"
                        viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path d="M7 7L17 17" stroke="#2B3340" stroke-width="2" stroke-linecap="round"></path>
                        <path d="M17 7L7 17" stroke="#2B3340" stroke-width="2" stroke-linecap="round"></path>
                    </svg></span>
                <div id="verify_screen" class="mid-content common-space container">
                    <div class="heading">
                        <p class="head">Verification Code</p>
                        <p class="sub-head">Please Enter 4 Digit Code sent to: </p>
                        <p class="edit-num"><span class="phone_edit">+91 14253 52142</span>
                            <a href="javascript:;" id="edit__btn" class="edit-icon" aria-label="edit">
                                <svg width="14" height="14" viewBox="0 0 14 14" fill="none"
                                    xmlns="http://www.w3.org/2000/svg">
                                    <path
                                        d="M7.30978 3.59676L2.18753 8.71901C2.11695 8.78962 2.07264 8.88225 2.06197 8.98151L1.75265 11.7645C1.74589 11.8256 1.75209 11.8875 1.77086 11.9461C1.78963 12.0046 1.82054 12.0586 1.86158 12.1044C1.90262 12.1503 1.95286 12.1869 2.00902 12.212C2.06519 12.2371 2.12601 12.2501 2.18753 12.2501C2.20361 12.2501 2.21967 12.2492 2.23566 12.2474L5.02034 11.9381C5.11961 11.9275 5.21223 11.8832 5.28284 11.8126L10.4033 6.69076L7.30978 3.59676ZM12.4093 2.82851L11.1716 1.59083C10.9255 1.34477 10.5917 1.20654 10.2437 1.20654C9.89563 1.20654 9.56185 1.34477 9.31572 1.59083L7.92841 2.97814L11.022 6.07214L12.4097 4.68439C12.6557 4.4382 12.7939 4.10439 12.7938 3.75636C12.7937 3.40833 12.6554 3.07458 12.4093 2.82851Z"
                                        fill="#066AC9" />
                                </svg>

                            </a>
                        </p>
                    </div>
                    <input type="hidden" name="from" id="from" value="">

                    <form class="form verify-otp-form" id="verify_otp_form">
                        @csrf
                        <div id="otp_input" class="single-input otp-input number">
                            <input type="hidden" id="token" name="token" value="">
                            <input type="tel" name="digit1" class="input-field otp_enter"
                                oninput="this.value = this.value.replace(/[^0-9]/g, '').replace(/(\..*)\./g, '$1');"
                                maxlength="1" value="" autocomplete="off" aria-label="code">
                            <input type="tel" name="digit2" class="input-field otp_enter"
                                oninput="this.value = this.value.replace(/[^0-9]/g, '').replace(/(\..*)\./g, '$1');"
                                maxlength="1" value="" autocomplete="off" aria-label="code">
                            <input type="tel" name="digit3" class="input-field otp_enter"
                                oninput="this.value = this.value.replace(/[^0-9]/g, '').replace(/(\..*)\./g, '$1');"
                                maxlength="1" value="" autocomplete="off" aria-label="code">
                            <input type="tel" id="" name="digit4" class="input-field otp_enter"
                                oninput="this.value = this.value.replace(/[^0-9]/g, '').replace(/(\..*)\./g, '$1');"
                                maxlength="1" value="" autocomplete="off" aria-label="code">
                            <span class="wrong-otp-error">Invalid OTP</span>
                        </div>
                        <p id="resend_timer" class="resend-text">Resend OTP in <span class="timer"
                                id="timer">00.30</span></p>
                        {{-- <button class=" resend-btn" >Resend OTP</button> --}}
                        <p class="resend-text resend-btn" id="resend_block">Didn't get it?<a id="resend_otp"
                                href="javascript:;" class="resend-link"> Resend Code</a></p>


                        <button type="submit" id="verify_otp_button" class="btn">Verify & Continue<i
                                id="send_spinner" class=""></i></button>
                    </form>


                </div>
            </div>
        </div>
    </div>
    {{-- Loader after test submitted & move to the next page in between --}}
    <div class="generic-loader">
        <div class="generic-body">
            <lottie-player class="popup-lottie" src="{{ asset('frontend') }}/assets-desktop/js/grad-loader.json"
                background="transparent" speed="3" width="100%" hight="100%" loop autoplay></lottie-player>
        </div>
    </div>
    @include('website.desktop.partials.whatsapp-bottom')

    <link rel="stylesheet"
        href="{{ asset('frontend') }}/assets-desktop/jquery-nice-select-master/css/nice-select.css?v={{ env('ASSETS_VERSION') }}">
    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />

    {{-- <link rel="stylesheet"
        href="{{ asset('frontend') }}/assets-desktop/css/planner-strip.css?v={{ env('ASSETS_VERSION') }}"> --}}

    {{-- <script src="https://code.jquery.com/jquery-3.7.0.js" integrity="sha256-JlqSTELeR4TLqP0OG9dxM7yDPqX1ox/HfgiSLBj8+kM="
        crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-nice-select/1.1.0/js/jquery.nice-select.min.js"></script>
   
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
        <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script> --}}
   
    <script
        src="{{ asset('frontend') }}/assets-desktop/jquery-nice-select-master/js/jquery.nice-select.js?v={{ env('ASSETS_VERSION') }}">
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/18.2.1/js/intlTelInput.min.js"
        integrity="sha512-uZZS8rsETXJQX6Jy57Zdc7PAmP83GCjC1F/LX0xUj12wY5SlfUX+CVnYFEX89doutQPeFbI9FjUCkpuTWqlBwg=="
        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    {{-- <script src="{{ asset('frontend') }}/assets-desktop/js/intlTelInput.min.js?v={{ env('ASSETS_VERSION') }}"></script> --}}
    <script src="{{ asset('frontend') }}/assets-desktop/js/jquery.easing.min.js?v={{ env('ASSETS_VERSION') }}"></script>
    <script src="{{ asset('frontend') }}/assets-desktop/js/lottie-player.js?v={{ env('ASSETS_VERSION') }}"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>

    <script>
       
        $(document).ready(function() {
            var input = $('.high-edu-marks');
            var fakeCursor = $('.unit-label');

            input.on('input', function() {
                // Update fake cursor position based on text length
                var text = input.val();
                var position = text.length * 8; // Adjust the multiplier based on font size
                fakeCursor.css('left', position + 'px');
            });

            input.on('focus', function() {
                fakeCursor.show();
            });

            let category = localStorage.getItem('saveEducation');
            if(category != null && category != undefined){
                $(`[data-name='${category}']`).prop('checked', true).trigger('change');                
            }

            delete localStorage.saveEducation;
        });
    </script>


    <script>
        $(document).ready(function() {
            $('select').niceSelect();

        });
        // Country code dropdown
        // const iti = window.intlTelInput($("#country-dropdown")[0], {
        //     autoHideDialCode: false,
        //     nationalMode: true,
        //     initialCountry: "in"
        // });

        $(".input-field").on('keyup', function() {
            if (!$(this).val()) {
                $(this).parent('.single-input').removeClass('field-not-empty');
                $('.input-field').removeClass('input-box-error');
            } else {
                $(this).parent('.single-input').addClass('field-not-empty');
            }
        });

        $(".input-field").change(function() {
            if (!$(this).val()) {
                $(this).parent('.single-input').removeClass('field-not-empty');
            } else {
                $(this).parent('.single-input').addClass('field-not-empty');
            }
        });

        $('input[name="highedu"]').change(function() {
            var selectedValue = $('input[name="highedu"]:checked').val();

            if (selectedValue) {
                $('.edu-score').text(selectedValue);
                $('.edu-score-div').addClass('active');
            } else {
                $('.edu-score').text('');
                $('.edu-score-div').removeClass('active');
            }
        });

        $(document).on('change', 'input[name="examRequire"]', function() {
            var radioValue = $('input[type="radio"][name="examRequire"]:checked').val();

            if (radioValue === 'Yes') {
                $('.exam-score-div').addClass('active');
            } else {
                $('.exam-score-div').removeClass('active');
            }
        });

        $(document).on('change', 'input[name="timeDuration"]', function() {
            var radioValue = $('input[type="radio"][name="timeDuration"]:checked').val();

            if (radioValue === 'already-booked') {
                $('.exam-date-div').addClass('active');
            } else {
                $('.exam-date-div').removeClass('active');
            }
        });

        $(document).on('change', 'input[name="exam"]', function() {
            var exam = $('input[name="exam"][type="radio"]:checked').data('name');
            $('.examName').text(exam);
        });


        $(document).on('change', 'input[name="purpose"]', function() {
            var purpose = $('input[name="purpose"][type="radio"]:checked').val();
            if (purpose === 'other') {
                $('.reason-score-div').addClass('active');
            } else {
                $('.reason-score-div').removeClass('active');
            }
        });



        $(document).ready(function() {
            var maxChecked = 1;

            $(document).ready(function() {
                var maxLimit = 100;
                var score_type = 'percentage';
                $('.score_unit_select').on('change', function() {
                    score_type = $(this).val();
                    $('.high-edu-marks').val('')
                    $('.high-edu-marks').next('.unit-label').text('');

                    if (score_type.startsWith('CGPA')) {
                        var cgpaValue = parseFloat(score_type.replace('CGPA', ''));
                        maxLimit = cgpaValue;
                        $('.high-edu-marks').attr('maxlength', 4);
                    } else {
                        maxLimit = 100;
                        $('.high-edu-marks').attr('maxlength', 5);
                    }

                    $('.high-edu-marks').attr('max', maxLimit);
                });

                // Validate the input on keypress
                $(document).on('input', '.high-edu-marks', function() {
                    var inputValue = $(this).val();
                    $('.unit-label').show()
                    $('.input-field').removeClass('input-box-error');

                    if (score_type == 'percentage') {
                        $('.high-edu-marks').next('.unit-label').text('%');
                    } else {
                        $('.high-edu-marks').next('.unit-label').text('CGPA');
                    }

                    if (isNaN(inputValue) || inputValue < 0) {
                        $(this).val('');
                        $('.high-edu-marks').next('.unit-label').text('');
                    } else if (score_type.startsWith('CGPA')) {
                        // Extract the numeric part from the CGPA format
                        var maxCgpa = parseFloat(score_type.match(/\((\d+(\.\d+)?)\)/)[1]);

                        // Check if CGPA value is within the valid range
                        if (inputValue > maxCgpa) {
                            $(this).val(maxCgpa);
                            return false;
                        }
                    } else if (parseFloat(inputValue) > maxLimit) {
                        // Validate for percentage
                        var truncatedValue = Math.floor(parseFloat(inputValue) / 10);
                        $(this).val(truncatedValue);
                        return false;
                    }

                    if (inputValue == "") {
                        $('.high-edu-marks').next('.unit-label').text('');
                    } else {
                        console.log(inputValue);
                    }
                });

                var maxScore;

                $(document).on('click',
                    'input[type="radio"][name="exam"]',
                    function() {
                        var exam = $(this).data('name');

                        // Update maxScore based on the selected exam
                        if (exam == 'IELTS') {
                            maxScore = 9;
                        } else if (exam == 'PTE') {
                            maxScore = 90;
                        } else if (exam == 'TOEFL') {
                            maxScore = 120;
                        } else if (exam == 'DUOLINGO') {
                            maxScore = 160;
                        } else if (exam == 'German') {
                            maxScore = 100;
                        } else if (exam == 'French') {
                            maxScore = 990;
                        }

                        // Clear and set the max attribute of the examScore input
                        // $('.examScore').val('');
                        $('.examScore').attr('max', maxScore);
                        updateJson()
                        generateBreadcrumbNavigation(jsonData)
                    });

                // Validate the input on keypress
                $(document).on('input', '.examScore', function() {
                    var inputValue = $(this).val();

                    // Remove non-numeric and non-dot characters
                    inputValue = inputValue.replace(/[^0-9.]/g, '');

                    // Update the value in the input field
                    $(this).val(inputValue);

                    // Rest of your code...
                    $('.input-field').removeClass('input-box-error');

                    inputValue = parseFloat(inputValue);

                    if (isNaN(inputValue) || inputValue < 0) {
                        $(this).val('');
                    } else if (inputValue > maxScore) {
                        var truncatedValue = Math.floor(inputValue / 10);
                        $(this).val(truncatedValue);
                    }
                });


            });




            // Call the updateJson function whenever a checkbox or radio button changes
            $('input[type="radio"]').on('change', function() {
                updateJson();
                generateBreadcrumbNavigation(jsonData);
            });

            
        });
        function generateBreadcrumbNavigation(jsonData) {
            var breadcrumbHtml = '<ol id="planner-scroll-nav">';

            // Add the values for preffered_country
            // if (jsonData.highedu && jsonData.highedu.length > 0) {
            //     breadcrumbHtml +=
            //         '<li><strong><a href="javascript:;" onclick="redirectToFieldset(\'edu-fieldset\', 25)" aria-current="page">' +
            //         jsonData.highedu +
            //         '</a></strong></li>';
            // }

            // Add the values for stream
            if (jsonData.exam && jsonData.exam.length > 0) {
                // breadcrumbHtml += `<span aria-hidden="true" class="breadcrumb-separator"><svg
                //                     xmlns="http://www.w3.org/2000/svg" width="8" height="14"
                //                     viewBox="0 0 8 14" fill="none">
                //                     <path fill-rule="evenodd" clip-rule="evenodd"
                //                         d="M7.66526 7.82496C8.11158 7.36935 8.11158 6.63065 7.66526 6.17504L1.95098 0.341709C1.50467 -0.113903 0.781048 -0.113903 0.334734 0.341709C-0.111579 0.79732 -0.111579 1.53601 0.334734 1.99162L5.2409 7L0.334734 12.0084C-0.111579 12.464 -0.111579 13.2027 0.334734 13.6583C0.781048 14.1139 1.50467 14.1139 1.95098 13.6583L7.66526 7.82496Z"
                //                         fill="#B6B6B6" />
                //                 </svg></span>`;
                breadcrumbHtml +=
                    '<li><a href="javascript:;" onclick="redirectToFieldset(\'interest-exam-fieldset\', 25)">' +
                    jsonData
                    .exam.join(', ') + '</a></li>';
            }

            // if (jsonData.mode && jsonData.mode.length > 0) {
            //     breadcrumbHtml += `<span aria-hidden="true" class="breadcrumb-separator"><svg
            //                         xmlns="http://www.w3.org/2000/svg" width="8" height="14"
            //                         viewBox="0 0 8 14" fill="none">
            //                         <path fill-rule="evenodd" clip-rule="evenodd"
            //                             d="M7.66526 7.82496C8.11158 7.36935 8.11158 6.63065 7.66526 6.17504L1.95098 0.341709C1.50467 -0.113903 0.781048 -0.113903 0.334734 0.341709C-0.111579 0.79732 -0.111579 1.53601 0.334734 1.99162L5.2409 7L0.334734 12.0084C-0.111579 12.464 -0.111579 13.2027 0.334734 13.6583C0.781048 14.1139 1.50467 14.1139 1.95098 13.6583L7.66526 7.82496Z"
            //                             fill="#B6B6B6" />
            //                     </svg></span>`;
            //     breadcrumbHtml +=
            //         '<li><a href="javascript:;" onclick="redirectToFieldset(\'prefered-mode\', 40)">' + jsonData
            //         .mode.join(', ') + '</a></li>';
            // }

            // Add the values for courseLevel
            if (jsonData.examRequire && jsonData.examRequire.length > 0) {
                breadcrumbHtml += `<span aria-hidden="true" class="breadcrumb-separator"><svg
                                    xmlns="http://www.w3.org/2000/svg" width="8" height="14"
                                    viewBox="0 0 8 14" fill="none">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M7.66526 7.82496C8.11158 7.36935 8.11158 6.63065 7.66526 6.17504L1.95098 0.341709C1.50467 -0.113903 0.781048 -0.113903 0.334734 0.341709C-0.111579 0.79732 -0.111579 1.53601 0.334734 1.99162L5.2409 7L0.334734 12.0084C-0.111579 12.464 -0.111579 13.2027 0.334734 13.6583C0.781048 14.1139 1.50467 14.1139 1.95098 13.6583L7.66526 7.82496Z"
                                        fill="#B6B6B6" />
                                </svg></span>`;
                breadcrumbHtml +=
                    '<li><a href="javascript:;" onclick="redirectToFieldset(\'exam-fieldset\', 50)">' + jsonData
                    .examRequire.join(', ') + '</a></li>';
            }

            // Add the values for stream
            if (jsonData.timeDuration && jsonData.timeDuration.length > 0) {
                breadcrumbHtml += `<span aria-hidden="true" class="breadcrumb-separator"><svg
                                    xmlns="http://www.w3.org/2000/svg" width="8" height="14"
                                    viewBox="0 0 8 14" fill="none">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M7.66526 7.82496C8.11158 7.36935 8.11158 6.63065 7.66526 6.17504L1.95098 0.341709C1.50467 -0.113903 0.781048 -0.113903 0.334734 0.341709C-0.111579 0.79732 -0.111579 1.53601 0.334734 1.99162L5.2409 7L0.334734 12.0084C-0.111579 12.464 -0.111579 13.2027 0.334734 13.6583C0.781048 14.1139 1.50467 14.1139 1.95098 13.6583L7.66526 7.82496Z"
                                        fill="#B6B6B6" />
                                </svg></span>`;
                breadcrumbHtml +=
                    '<li><a href="javascript:;" onclick="redirectToFieldset(\'ielts-giving\', 75)">' + jsonData
                    .timeDuration.join(', ') + '</a></li>';
            }

            if (jsonData.purpose && jsonData.purpose.length > 0) {
                breadcrumbHtml += `<span aria-hidden="true" class="breadcrumb-separator"><svg
                                    xmlns="http://www.w3.org/2000/svg" width="8" height="14"
                                    viewBox="0 0 8 14" fill="none">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M7.66526 7.82496C8.11158 7.36935 8.11158 6.63065 7.66526 6.17504L1.95098 0.341709C1.50467 -0.113903 0.781048 -0.113903 0.334734 0.341709C-0.111579 0.79732 -0.111579 1.53601 0.334734 1.99162L5.2409 7L0.334734 12.0084C-0.111579 12.464 -0.111579 13.2027 0.334734 13.6583C0.781048 14.1139 1.50467 14.1139 1.95098 13.6583L7.66526 7.82496Z"
                                        fill="#B6B6B6" />
                                </svg></span>`;
                breadcrumbHtml +=
                    '<li><a href="javascript:;" onclick="redirectToFieldset(\'lang-time-fieldset\', 100)">' +
                    jsonData
                    .purpose.join(', ') + '</a></li>';
            }

            breadcrumbHtml += '</ol>';

            $('.breadcrumb').html(breadcrumbHtml)
            document.getElementById('planner-scroll-nav').scrollTo({
                left: 600,
                behavior: 'smooth'
            });
        }

        // Initialize an empty JSON object
        var jsonData = {};
        var userFormData = {};

        // Function to update the JSON object based on checkbox and radio selections
        function updateJson() {
            // Clear the JSON object
            jsonData = {};
            userFormData = {};

            // Loop through the checkboxes
            $('input[type="checkbox"]').each(function() {
                if ($(this).is(':checked')) {
                    var groupName = $(this).attr('name');
                    var value = $(this).val();
                    var dataName = $(this).data('name');
                    var dataId = $(this).data('id');

                    // Check if the group exists in the JSON object
                    if (!jsonData[groupName]) {
                        jsonData[groupName] = [];
                    }

                    if (!userFormData[groupName]) {
                        userFormData[groupName] = [];
                    }

                    // Check the length before pushing a new value
                    jsonData[groupName].push(dataName);
                    userFormData[groupName].push(dataName);
                }
            });

            // Loop through the radio buttons
            $('input[type="radio"]').each(function() {
                if ($(this).is(':checked')) {
                    var groupName = $(this).attr('name');
                    var value = $(this).val();
                    var dataName = $(this).data('name');
                    var dataId = $(this).data('id');

                    // Add the value to the group in the JSON object
                    if (!jsonData[groupName]) {
                        jsonData[groupName] = [];
                    }

                    if (!userFormData[groupName]) {
                        userFormData[groupName] = [];
                    }

                    jsonData[groupName].push(dataName);
                    userFormData[groupName].push(dataName);
                }
            });

            // Add additional fields to jsonData and userFormData
            var grade_type = $('[name="high_edu_type"]').val();
            var grade = $('[name="high_edu_score"]').val();
            var test_score = $('[name="language_test_score"]').val();
            var reason = $('[name="reason"]').val();
            var exam_date = $('[name="exam_date"]').val();

            if (grade_type) {
                jsonData['grade_type'] = grade_type;
                userFormData['grade_type'] = grade_type;
            }

            if (grade) {
                jsonData['grade'] = grade;
                userFormData['grade'] = grade;
            }

            if (test_score) {
                jsonData['test_score'] = test_score;
                userFormData['test_score'] = test_score;
            }

            if (reason) {
                jsonData['reason'] = reason;
                userFormData['reason'] = reason;
            }

            if(exam_date){
                jsonData['exam_date'] = exam_date;
                userFormData['exam_date'] = exam_date;
            }

            localStorage.setItem('jsonData', JSON.stringify(userFormData));

            // Log the updated JSON object
            console.log(jsonData);
        }

        const parentWidth = $('.progress-container').width();
        var progressWidth = 25;


        function redirectToFieldset(fieldsetId, width) {
            // Hide all fieldsets
            $('fieldset:visible').hide();
            $('fieldset#' + fieldsetId).show();
            $('fieldset#' + fieldsetId).css('opacity', 1);
            $('fieldset').css('transform', 'scale(1)');

            progressWidth = width;
            $('.progress-container .progress-bar').css('width', progressWidth + '%');
        }

        // document.addEventListener('DOMContentLoaded', function() {
        //     // Get the buttons and sections
        //     const startButton = document.querySelector('.blue-btn');
        //     // const startButton1 = document.querySelector('.blue-btn1');
        //     const welcomeSection = document.querySelector('.welcome-screen-section');
        //     const plannerSection = document.querySelector('.study-planner-section');
        //     const loaderSection = document.querySelector('.loader-planner');

        //     // Add a click event listener to the "Let's Get Started" button
        //     startButton.addEventListener('click', function(event) {
        //         event.preventDefault(); // Prevent the default link behavior

        //         // Toggle the "show" class on welcomeSection and plannerSection
        //         welcomeSection.classList.remove('show');
        //         plannerSection.classList.add('show');
        //     });
        // });


        (function($) {
            // "use strict";

            //* Form js
            function verificationForm() {
                //jQuery time
                var current_fs, next_fs, previous_fs; //fieldsets
                var left, opacity, scale; //fieldset properties which we will animate
                var animating; //flag to prevent quick multi-click glitches

                $(document).on('click', '.next', function() {
                    var current_fs = $(this).closest('fieldset');

                    if (ValidatePlanner(current_fs)) {
                        if (animating) return false;
                        animating = true;

                        var next_fs = $(this).closest('fieldset').next();

                        //show the next fieldset
                        next_fs.show();

                        progressWidth += 25; // Increase the width by 20%
                        $('.progress-container .progress-bar').css('width', progressWidth + '%');


                        //hide the current fieldset with style
                        current_fs.animate({
                            opacity: 0
                        }, {
                            step: function(now, mx) {
                                //as the opacity of current_fs reduces to 0 - stored in "now"
                                //1. scale current_fs down to 80%
                                var scale = 1 - (1 - now) * 0.2;
                                //2. bring next_fs from the right(50%)
                                var left = (now * 50) + "%";
                                //3. increase opacity of next_fs to 1 as it moves in
                                var opacity = 1 - now;
                                current_fs.css({
                                    'transform': 'scale(' + scale + ')',
                                    'position': 'absolute'
                                });
                                next_fs.css({
                                    'left': left,
                                    'opacity': opacity
                                });
                            },
                            duration: 800,
                            complete: function() {
                                current_fs.hide();
                                animating = false;
                            },
                            //this comes from the custom easing plugin
                            easing: 'easeInOutBack'
                        });
                    }
                });

                $(document).on('click', '.previous', function() {
                    if (animating) return false;
                    animating = true;

                    current_fs = $(this).closest('fieldset');
                    previous_fs = $(this).closest('fieldset').prev();

                    progressWidth -= 25; // Remove 20% width
                    $('.progress-container .progress-bar').css('width', progressWidth + '%');

                    //show the previous fieldset
                    previous_fs.show();
                    //hide the current fieldset with style
                    current_fs.animate({
                        opacity: 0
                    }, {
                        step: function(now, mx) {
                            //as the opacity of current_fs reduces to 0 - stored in "now"
                            //1. scale previous_fs from 80% to 100%
                            scale = 0.8 + (1 - now) * 0.2;
                            //2. take current_fs to the right(50%) - from 0%
                            left = ((1 - now) * 50) + "%";
                            //3. increase opacity of previous_fs to 1 as it moves in
                            opacity = 1 - now;
                            current_fs.css({
                                'left': left
                            });
                            previous_fs.css({
                                'transform': 'scale(' + scale + ')',
                                'opacity': opacity
                            });
                        },
                        duration: 800,
                        complete: function() {
                            current_fs.hide();
                            animating = false;
                        },
                        //this comes from the custom easing plugin
                        easing: 'easeInOutBack'
                    });
                });

                $(".submit").click(function() {
                    return false;
                })
            };

            //* Select js
            // function nice_Select() {
            //     if ($('.product_select').length) {
            //         $('select').niceSelect();
            //     };
            // };
            /*Function Calls*/
            verificationForm();
        })(jQuery);

        // Function to show a progress bar for 4 seconds
        function showProgressBar() {
            // Create a progress bar element
            var progressBar = document.getElementById('progress-bar');

            // Start the progress animation
            requestAnimationFrame(function() {
                progressBar.style.width = '100%';
            });

            // After 4 seconds, redirect to another URL
            // setTimeout(function() {
            //     window.location.href = '/student/finder'; // Replace with your desired URL
            // }, 4000); // 4 seconds in milliseconds
        }

        // Call the function to show the progress bar and redirect


        $('[data-close="model"]').on('click', function() {
            $('#get-in-touch-popup').hide();
        });


        testInp = '';
        function ValidatePlanner(current_fs) {
            var valid = true; // Assume true initially

            // Check radios only if they are present
            var radios = $(current_fs).find('input[type=radio]');
            if (radios.length > 0) {
                var radioChecked = false;

                radios.each(function () {
                    if ($(this).is(':checked')) {
                        radioChecked = true;
                        return false; // exit each loop early
                    }
                });

                if (!radioChecked) {
                    createToast('error', 'Please Select At Least One Option');
                    valid = false;
                    return valid; // exit the function if radio not checked
                }
            }

            var inputFields = $(current_fs).find('.score-div.active input[type=text]:not(.nice-select-search)');
            console.log("inputFields",inputFields.value);
            testInp = inputFields;
            if (inputFields.length > 0) {
                var inputFilled = false;

                inputFields.each(function () {
                    // Check if the input field is empty
                    if ($(this).val().trim() === '') {
                        inputFilled = true;
                        return false; // exit each loop early
                    }
                });

                if (inputFilled) {
                    radios.each(function () {
                        // Check the value of each input field
                        if ($(this).is(':checked')) {
                            var inputValue = $(this).val().trim();
                            if (inputValue === 'already-booked') {
                                createToast('error', 'Please Enter the Date');
                            } else if(inputValue === 'other') {
                                createToast('error', 'Please Enter the Reason');
                            } else {
                                createToast('error', 'Please Enter the Score');
                            }
                        }
                    });

                    $('.score-div.active .input-field, .score-div.active .input-field-group').addClass('input-box-error');
                    valid = false;
                    return valid; // exit the function if input not filled
                }
            }

            if($(inputFields).attr("name") == "exam_date"){
                inputDate = $(inputFields).val();
                var dateArr = $(testInp).val().split("/");
                if(dateArr.length < 3){
                    valid = false;
                    createToast('error', 'Please Enter valid Date');
                }

                if(dateArr.length < 3){
                    valid = false;
                    createToast('error', 'Please Enter valid Date');
                }else {
                    var currentDate = new Date();
                    
                    var sixMonthsFromToday = new Date();
                    sixMonthsFromToday.setMonth(sixMonthsFromToday.getMonth() + 6);
                    
                    var inputDateObject = new Date(dateArr[2], dateArr[1] - 1, dateArr[0]);
                    console.log(inputDateObject,currentDate);
                    if (isNaN(inputDateObject) || inputDateObject < currentDate) {
                        createToast('error', "Invalid Date Entered, The date you've entered is in the past");
                        valid = false;
                    }
                    
                    if (inputDateObject > sixMonthsFromToday) {
                        createToast('error', 'Invalid Date Entered, The date can not be grater then 6 Months');
                        valid = false;
                    }
                }

            }

           


            return valid;
        }



        // function sendError(current_fs, msg) {
        //     // Remove any existing error messages
        //     $(current_fs).find('.input-error').remove();

        //     // Find the first input element and add an error message after it
        //     $(current_fs).find('input').first().val('').focus().after('<div class="input-error custom-error">' + msg +
        //         '</div>');
        // }
    </script>
    {{-- Toast Notification --}}
    <script>
        let docs = document;

        const notifications = docs.querySelector(".notifications"),
            buttons = docs.querySelectorAll(".buttons .btn");

        const toastDetails = {
            timer: 5000,
            success: {
                icon: "fa-circle-check",
                text: "Success: This is a success toast."
            },
            error: {
                icon: "fa-circle-xmark",
                text: "Error: This is an error toast."
            },
            warning: {
                icon: "fa-circle-exclamation",
                text: "You Can Select Only Three Country."
            },
            info: {
                icon: "fa-circle-info",
                text: "Info: This is an information toast."
            }
        }

        let isToastVisible = false; // Flag to track if a toast is currently visible

        const removeToast = (toast) => {
            toast.classList.add("hide");
            if (toast.timeoutId) clearTimeout(toast.timeoutId);
            setTimeout(() => {
                toast.remove();
                isToastVisible = false; // Reset the flag when the toast is removed
            }, 500);
        };

        const createToast = (id, msg) => {
            // Check if a toast is currently visible
            if (isToastVisible) {
                return; // If visible, exit without creating a new toast
            }

            // Getting the icon and text for the toast based on the id passed
            const {
                icon,
                text
            } = toastDetails[id];
            const toast = docs.createElement("li");
            toast.className = `toast ${id}`;
            toast.innerHTML = `<div class="column">
                                    <i class="fa-solid ${icon}"></i>
                                    <span>${msg}</span>
                                </div>
                                <i class="fa-solid fa-xmark" onclick="removeToast(this.parentElement)"></i>`;

            notifications.appendChild(toast);

            isToastVisible = true; // Set the flag to indicate that a toast is now visible

            // Setting a timeout to remove the toast after the specified duration
            toast.timeoutId = setTimeout(() => removeToast(toast), toastDetails.timer);
        };

        // Adding a click event listener to each button to create a toast when clicked
        // buttons.forEach(btn => {
        //     btn.addEventListener("click", () => createToast(btn.id))
        // });
    </script>
    <script>
        (function($) {

            $.fn.niceSelect = function(method) {

                // Methods
                if (typeof method == 'string') {
                    if (method == 'update') {
                        this.each(function() {
                            var $select = $(this);
                            var $dropdown = $(this).next('.nice-select');
                            var open = $dropdown.hasClass('open');

                            if ($dropdown.length) {
                                $dropdown.remove();
                                create_nice_select($select);

                                if (open) {
                                    $select.next().trigger('click');
                                }
                            }
                        });
                    } else if (method == 'destroy') {
                        this.each(function() {
                            var $select = $(this);
                            var $dropdown = $(this).next('.nice-select');

                            if ($dropdown.length) {
                                $dropdown.remove();
                                $select.css('display', '');
                            }
                        });
                        if ($('.nice-select').length == 0) {
                            $(document).off('.nice_select');
                        }
                    } else {}
                    return this;
                }

                // Hide native select
                this.hide();

                // Create custom markup
                this.each(function() {
                    var $select = $(this);

                    if (!$select.next().hasClass('nice-select')) {
                        create_nice_select($select);
                    }
                });

                function create_nice_select($select) {
                    $select.after($('<div></div>')
                        .addClass('nice-select')
                        .addClass($select.attr('class') || '')
                        .addClass($select.attr('disabled') ? 'disabled' : '')
                        .addClass($select.attr('multiple') ? 'has-multiple' : '')
                        .attr('tabindex', $select.attr('disabled') ? null : '0')
                        .html($select.attr('multiple') ?
                            '<span class="multiple-options"></span><div class="nice-select-search-box"><input type="text" class="nice-select-search" placeholder="Search..."/></div><ul class="list"></ul>' :
                            '<span class="current"></span><div class="nice-select-search-box"><input type="text" class="nice-select-search" placeholder="Search..."/></div><ul class="list"></ul>'
                        )
                    );

                    var $dropdown = $select.next();
                    var $options = $select.find('option');
                    if ($select.attr('multiple')) {
                        var $selected = $select.find('option:selected');
                        var $selected_html = '';
                        $selected.each(function() {
                            $selected_option = $(this);
                            $selected_text = $selected_option.data('display') || $selected_option.text();
                            $selected_html += '<span class="current">' + $selected_text + '</span>';
                        });
                        $select_placeholder = $select.data('placeholder') || $select.attr('placeholder');
                        $select_placeholder = $select_placeholder == '' ? 'Select' : $select_placeholder;
                        $selected_html = $selected_html == '' ? $select_placeholder : $selected_html;
                        $dropdown.find('.multiple-options').html($selected_html);
                    } else {
                        var $selected = $select.find('option:selected');
                        $dropdown.find('.current').html($selected.data('display') || $selected.text());
                    }


                    $options.each(function(i) {
                        var $option = $(this);
                        var display = $option.data('display');

                        $dropdown.find('ul').append($('<li></li>')
                            .attr('data-value', $option.val())
                            .attr('data-display', (display || null))
                            .addClass('option' +
                                ($option.is(':selected') ? ' selected' : '') +
                                ($option.is(':disabled') ? ' disabled' : ''))
                            .html($option.text())
                        );
                    });
                }

                /* Event listeners */

                // Unbind existing events in case that the plugin has been initialized before
                $(document).off('.nice_select');

                // Open/close
                $(document).on('click.nice_select', '.nice-select', function(event) {
                    var $dropdown = $(this);

                    $('.nice-select').not($dropdown).removeClass('open');
                    $dropdown.toggleClass('open');

                    if ($dropdown.hasClass('open')) {
                        $dropdown.find('.option');
                        $dropdown.find('.nice-select-search').val('');
                        $dropdown.find('.nice-select-search').focus();
                        $dropdown.find('.focus').removeClass('focus');
                        $dropdown.find('.selected').addClass('focus');
                        $dropdown.find('ul li').show();
                    } else {
                        $dropdown.focus();
                    }
                });

                // $(document).on('click', '.nice-select-search-box', function(event) {
                //     event.stopPropagation();
                //     return false;
                // });
                // $(document).on('keyup.nice-select-search', '.nice-select', function() {
                //     var $self = $(this);
                //     var $text = $self.find('.nice-select-search').val();
                //     var $options = $self.find('ul li');
                //     if ($text == '')
                //         $options.show();
                //     else if ($self.hasClass('open')) {
                //         $text = $text.toLowerCase();
                //         var $matchReg = new RegExp($text);
                //         if (0 < $options.length) {
                //             $options.each(function() {
                //                 var $this = $(this);
                //                 var $optionText = $this.text().toLowerCase();
                //                 var $matchCheck = $matchReg.test($optionText);
                //                 $matchCheck ? $this.show() : $this.hide();
                //             })
                //         } else {
                //             $options.show();
                //         }
                //     }
                //     $self.find('.option'),
                //         $self.find('.focus').removeClass('focus'),
                //         $self.find('.selected').addClass('focus');
                // });

                // Search box click
                $(document).on('click', '.nice-select-search-box', function(event) {
                    event.stopPropagation(); // Stop the event from propagating
                    return false;
                });

                // Search box keyup
                $(document).on('keyup.nice-select-search', '.nice-select', function() {
                    var $self = $(this);
                    var $text = $self.find('.nice-select-search').val();
                    var $options = $self.find('ul li');

                    if ($text == '') {
                        $options.show();
                    } else if ($self.hasClass('open')) {
                        $text = $text.toLowerCase();
                        var $matchReg = new RegExp($text);

                        if (0 < $options.length) {
                            $options.each(function() {
                                var $this = $(this);
                                var $optionText = $this.text().toLowerCase();
                                var $matchCheck = $matchReg.test($optionText);
                                $matchCheck ? $this.show() : $this.hide();
                            });
                        } else {
                            $options.show();
                        }
                    }

                    $self.find('.option'),
                        $self.find('.focus').removeClass('focus'),
                        $self.find('.selected').addClass('focus');
                });


                // Close when clicking outside
                $(document).on('click.nice_select', function(event) {
                    if ($(event.target).closest('.nice-select').length === 0) {
                        $('.nice-select').removeClass('open').find('.option');
                    }
                });

                // Option click
                $(document).on('click.nice_select', '.nice-select .option:not(.disabled)', function(event) {
                    var $option = $(this);
                    var $dropdown = $option.closest('.nice-select');
                    if ($dropdown.hasClass('has-multiple')) {
                        if ($option.hasClass('selected')) {
                            $option.removeClass('selected');
                        } else {
                            $option.addClass('selected');
                        }
                        $selected_html = '';
                        $selected_values = [];
                        $dropdown.find('.selected').each(function() {
                            $selected_option = $(this);
                            var text = $selected_option.data('display') || $selected_option.text()
                            $selected_html += '<span class="current">' + text + '</span>';
                            $selected_values.push($selected_option.data('value'));
                        });
                        $select_placeholder = $dropdown.prev('select').data('placeholder') || $dropdown
                            .prev('select').attr('placeholder');
                        $select_placeholder = $select_placeholder == '' ? 'Select' : $select_placeholder;
                        $selected_html = $selected_html == '' ? $select_placeholder : $selected_html;
                        $dropdown.find('.multiple-options').html($selected_html);
                        $dropdown.prev('select').val($selected_values).trigger('change');
                    } else {
                        $dropdown.find('.selected').removeClass('selected');
                        $option.addClass('selected');
                        var text = $option.data('display') || $option.text();
                        $dropdown.find('.current').text(text);
                        $dropdown.prev('select').val($option.data('value')).trigger('change');
                    }
                });

                // Keyboard events
                $(document).on('keydown.nice_select', '.nice-select', function(event) {
                    var $dropdown = $(this);
                    var $focused_option = $($dropdown.find('.focus') || $dropdown.find(
                        '.list .option.selected'));

                    // Space or Enter
                    if (event.keyCode == 32 || event.keyCode == 13) {
                        if ($dropdown.hasClass('open')) {
                            $focused_option.trigger('click');
                        } else {
                            $dropdown.trigger('click');
                        }
                        return false;
                        // Down
                    } else if (event.keyCode == 40) {
                        if (!$dropdown.hasClass('open')) {
                            $dropdown.trigger('click');
                        } else {
                            var $next = $focused_option.nextAll('.option:not(.disabled)').first();
                            if ($next.length > 0) {
                                $dropdown.find('.focus').removeClass('focus');
                                $next.addClass('focus');
                            }
                        }
                        return false;
                        // Up
                    } else if (event.keyCode == 38) {
                        if (!$dropdown.hasClass('open')) {
                            $dropdown.trigger('click');
                        } else {
                            var $prev = $focused_option.prevAll('.option:not(.disabled)').first();
                            if ($prev.length > 0) {
                                $dropdown.find('.focus').removeClass('focus');
                                $prev.addClass('focus');
                            }
                        }
                        return false;
                        // Esc
                    } else if (event.keyCode == 27) {
                        if ($dropdown.hasClass('open')) {
                            $dropdown.trigger('click');
                        }
                        // Tab
                    } else if (event.keyCode == 9) {
                        if ($dropdown.hasClass('open')) {
                            return false;
                        }
                    }
                });

                // Detect CSS pointer-events support, for IE <= 10. From Modernizr.
                var style = document.createElement('a').style;
                style.cssText = 'pointer-events:auto';
                if (style.pointerEvents !== 'auto') {
                    $('html').addClass('no-csspointerevents');
                }

                return this;

            };

        }(jQuery));


        var currentUrl = window.location.href;

        var cParameterRegex = /(\?|&)c=([a-zA-Z0-9]+)/;
        var cMatch = currentUrl.match(cParameterRegex);

        var sParameterRegex = /(\?|&)s=ppc/;
        var sMatch = currentUrl.match(sParameterRegex);

        var eventData = [];

        if (cMatch) {
            var cParameterValue = cMatch[2];
            eventData.push({
                'event_id': cParameterValue,
                'source': 'Event'
            });
        } else if (sMatch) {
            var isPpc = true;
            eventData.push({
                'event_id': '',
                'source': isPpc ? 'Google PPC' : 'Planner'
            });
        } else {
            eventData.push({
                'event_id': '',
                'source': 'Planner'
            });
        }

        localStorage.setItem('eventData', JSON.stringify(eventData));
        console.log('eventData:', eventData);

        // $(document).ready(function() {
        //     $('.country-dropdown,.state-dropdown,.city-dropdown').niceSelectSearch();
        // });

        $(document).ready(function() {
            var urlParams = new URLSearchParams(window.location.search);
            var examValue = urlParams.get('e');
            var testTaken = urlParams.get('t');

            $('input[type="radio"][data-name="' + examValue + '"]').prop('checked', true);
            $('input[type="radio"][data-name="' + testTaken + '"]').prop('checked', true);

            if($('input[type="radio"][data-name="' + testTaken + '"]').is(':checked')) {
                if(testTaken == 'Yes') {
                    $('.exam-score-div').addClass('active');
                    redirectToFieldset('exam-fieldset', 50);
                    updateJson();
                    generateBreadcrumbNavigation(jsonData);
                } else {
                    redirectToFieldset('ielts-giving', 75);
                    updateJson();
                    generateBreadcrumbNavigation(jsonData);
                }
            } else if ($('input[type="radio"][data-name="' + examValue + '"]').is(':checked')) {
                $('.examName').text(examValue);

                redirectToFieldset('exam-fieldset', 50);
                updateJson();
                generateBreadcrumbNavigation(jsonData);
            }

            var maxScore;

            if (examValue == 'IELTS') {
                maxScore = 9;
            } else if (examValue == 'PTE') {
                maxScore = 90;
            } else if (examValue == 'TOEFL') {
                maxScore = 120;
            } else if (examValue == 'DUOLINGO') {
                maxScore = 160;
            } else if (examValue == 'German') {
                maxScore = 100;
            } else if (examValue == 'French') {
                maxScore = 990;
            }

            $('.examScore').attr('max', maxScore);

            $(document).on('input', '.examScore', function() {
                var inputValue = $(this).val();

                // Remove non-numeric and non-dot characters
                inputValue = inputValue.replace(/[^0-9.]/g, '');

                // Update the value in the input field
                $(this).val(inputValue);

                // Rest of your code...
                $('.input-field').removeClass('input-box-error');

                inputValue = parseFloat(inputValue);

                if (isNaN(inputValue) || inputValue < 0) {
                    $(this).val('');
                } else if (inputValue > maxScore) {
                    var truncatedValue = Math.floor(inputValue / 10);
                    $(this).val(truncatedValue);
                }
            });
        });



    </script>
    <script>
        {{-- popup close code   --}}
        $('.close, .close-button').on('click', function() {
            $(this).parents('#plan-lead-validate-popup,#pin-popup, #login').hide();
        });
    </script>
    <link rel="stylesheet"
        href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/3.5.0/css/flag-icon.min.css" />
    <script>

        function showPopup(id) {

            var current_fs = $('#lang-time-fieldset').closest('fieldset');
            if (ValidatePlanner(current_fs)) {
                $('#' + id).show();
                $("body").addClass('no-scroll');
                // $(':input', '#plan-lead-form')
                // .not(':button, :submit, :reset, :hidden')
                // .val('');
            }
            updateJson()

            var countryName = '{{ getLocationInfoByIp() }}';
            countryValue = JSON.parse(countryName);

            var countryName = countryValue.country_name;

            $.ajax({
                url: "/countryArray.php",
                success: function(res) {
                    $(".country-select").html(res);
                    $('.country-select').val(function() {
                        return $('option[data-country="' + countryName + '"]', this).val();
                    });
                    selectedOption = $("option:selected", '.country-select');
                    $(selectedOption).text(
                        `${$(selectedOption).attr("data-country")} +${$(selectedOption).attr("data-code")}`);
                    $("option:selected", '.country-select').text(
                        `${$(selectedOption).attr("data-sort_code")} +${$(selectedOption).attr("data-code")}`
                    );
                    // Reinitialize nice select after updating options
                    $('select').niceSelect('update');
                }
            });
        }


        actualPin = [];

        if ('{{ $device }}' == 'desktop') {
            function handlePinInput(index, inputField) {
                // Allow only numeric input
                $('.wrong-otp-error').hide()
                inputField.value = inputField.value.replace(/[^0-9]/g, '');

                // Store the real value in the array
                actualPin[index] = inputField.value;

                // Display the entered digit for 1 second, then replace with "*"
                setTimeout(() => {
                    inputField.value = '*';
                }, 1000);

                // Move focus to the next input field
                if (index < 3 && inputField.value !== '') {
                    document.getElementById(`pin-input-${index + 1}`).focus();
                }
            }

            function handleKeyDown(event, index) {
                $('.wrong-otp-error').hide()
                // Move to the previous input field on backspace
                if (event.key === 'Backspace') {
                    const currentInput = document.getElementById(`pin-input-${index}`);
                    const previousInput = document.getElementById(`pin-input-${index - 1}`);

                    // Move focus to the previous input field
                    if (index > 0 && currentInput.value === '') {
                        previousInput.focus();
                    }

                    // Clear the value of the current input
                    currentInput.value = '';
                }

                $('.wrong-otp-error').hide()
                // Allow only numeric input
                if (!/[0-9]/.test(event.key)) {
                    event.preventDefault();
                }
            }
        } else {
            function handlePinInput(index, inputField) {
                // Allow only numeric input
                inputField.value = inputField.value.replace(/[^0-9]/g, '');

                $('.wrong-otp-error').hide()
                // Store the real value in the array
                actualPin[index] = inputField.value;

                // Move focus to the next input field
                if (index < 3 && inputField.value !== '') {
                    document.getElementById(`pin-input-${index + 1}`).focus();
                }
            }

            function handleKeyDown(event, index) {
                // Move to the previous input field on backspace
                if (event.key === 'Backspace') {
                    const currentInput = document.getElementById(`pin-input-${index}`);
                    const previousInput = document.getElementById(`pin-input-${index - 1}`);

                    // Move focus to the previous input field
                    if (index > 0 && currentInput.value === '') {
                        previousInput.focus();
                    }

                    // Clear the value of the current input
                    currentInput.value = '';
                }
                $('.wrong-otp-error').hide()
                // Allow only numeric input
                if (!/[0-9]/.test(event.key)) {
                    event.preventDefault();
                }
            }
        }

    var userLogged = false;
	var userVerified = false;
	var reset = '';

    $(document).ready(function(){

        $(".country-select").change(function() {
            $("option", this).each((i, e) => {
                if ($(e).attr("data-code") != 'Country' || $(e).attr("value") != '') {
                    $(e).text(`${$(e).attr("data-country")} +${$(e).attr("data-code")}`);
                } else {
                    $(e).text(`${$(e).attr("data-country")} ${$(e).attr("data-code")}`);
                }
            })
            selectedOption = $("option:selected", this);
            if ($(selectedOption).attr("data-code") == 'Country') {
                $("option:selected", this).text(
                    `${$(selectedOption).attr("data-sort_code")} ${$(selectedOption).attr("data-code")}`
                )
            } else {
                $("option:selected", this).text(
                    `${$(selectedOption).attr("data-sort_code")} +${$(selectedOption).attr("data-code")}`
                )
            }
            // Reinitialize nice select after changing selection
            $('select').niceSelect('update');
        });

        $(document).ready(function() {
            $('.single-filter-tab').on('click', function() {
                $('.single-filter-tab').removeClass('active');
                $(this).addClass('active');
            })

            $(document).on('input', '.phone-validate', handleInputAndChange);
            $(document).on('change', '.country-select', handleInputAndChange);

        });

        function handleInputAndChange() {
            var phoneValue = $('.phone-validate').val();
            var countryValue = $('.country-select').val();

            // Check both conditions before proceeding
            if (phoneValue.length === 10 && countryValue !== '') {
                mobileValidation();
            }
        }

        function mobileValidation() {
            $('.spin-loader').show();
            $('.submit-button').prop('disabled', true);
            var phone = $('.phone-validate').val();
            var country = $('.country-select').val();
            var country_code = country.split('@#$?');
            country_code = country_code[1];
            $.ajax({
                type: 'POST',
                url: '/dashboard/mobile-verification',
                data: {
                    country_code: country_code,
                    phone: phone,
                    _token: $('meta[name="csrf-token"]').attr('content')
                },
                dataType: 'json',
                success: (res) => {
                    $('.spin-loader,.loader').hide();
                    if (res.status) {
                        // Handle success
                        $('.name-input').hide();
                        userLogged = true;
                        $('.submit-button').prop('disabled', false);
                    } else if (res.status == 0) {
                        // Handle failure
                        $('.name-input').show();
                        userLogged = false;
                        $('.submit-button').prop('disabled', false);
                    }
                }
            });
        }


        var interval;
        var userLogged = false;

        $(document).on('submit', "#plan-lead-form", function(e) {
            e.preventDefault();

            if (interval) {
                clearInterval(interval);
            }

            var formData = new FormData($(this)[0]);
            var _token = $('meta[name="csrf-token"]').attr('content');
            formData.append("_token", _token);

            var country = $('.country-select').val();
            country = country.split('@#$?');
            country_code = country[1];
            country = country[0];

            formData.append('url', location.pathname);
            formData.append('country', country);
            formData.append('country_code', country_code);
            formData.append('source', 'Test Preparation');

            formData.append('reset', reset);
            formData.append("jsonData", JSON.stringify(jsonData));

            if (ValidateForm($(this))) {
                if(reset !== 'reset') {
                    mobileValidation();
                }
                $('.loader , .spin-loader').show();
                $('.submit-button').prop("disabled", true);
                if (!userLogged) {
                    $.ajax({
                        type: 'POST',
                        url: '{{ route('website.test-prep.otpSent') }}',
                        data: formData,
                        cache: false,
                        processData: false,
                        contentType: false,
                        success: (res) => {
                            if (res.status == 1) {
                                $('.submit-button').prop("disabled", false);
                                $('.loader , .spin-loader').hide();
                                $('#login').hide();
                                $('#plan-lead-validate-popup').show();
                                $('.resend-btn').hide()
                                $('#pin-popup').hide();
                                $('#timer').html('00.30');
                                $('#resend_timer').show()
                                $('.wrong-otp-error').hide()
                                var number = country_code + ' ' + $('.phone-validate').val();
                                $('.phone_edit').text('+' + number);
                                // Get the timer element
                                var timerElement = document.getElementById('timer');

                                var timerValue = timerElement.innerHTML.split('.');

                                var seconds = parseInt(timerValue[0]) * 60 + parseInt(timerValue[1]);

                                // Function to update the timer
                                function updateTimer() {
                                    seconds--;
                                    if (seconds < 0) {
                                        clearInterval(interval);
                                        timerElement.innerHTML = '00.00';
                                        $('.resend-btn').show();
                                        $('#resend_timer').hide();
                                    } else {
                                        var minutes = Math.floor(seconds / 60);
                                        var remainingSeconds = seconds % 60;
                                        timerElement.innerHTML = (minutes < 10 ? '0' : '') + minutes +
                                            '.' +
                                            (remainingSeconds < 10 ? '0' : '') + remainingSeconds;
                                    }
                                }

                                // Call the updateTimer function every second
                                interval = setInterval(updateTimer, 1000);

                            } else if (res.status == 2) {
                                $('.submit-button').prop("disabled", false);
                                $('.loader , .spin-loader').hide();
                                var number = country_code + ' ' + $('.phone-validate').val();
                                $('.phone_edit').text('+' + number);
                                $('#login').hide();
                                $('#plan-lead-validate-popup').show();
                                $('.wrong-otp-error').hide();
                                $('.login-condition').text('Enter Your 4 digit Login Pin');
                                $('.small-head').show();
                            } else {
                                $('.submit-button').prop("disabled", false);
                                $('.loader , .spin-loader').hide();
                            }
                            $(':input', '#plan-lead-form')
                                .not(':button, :submit, :reset, :hidden')
                                .val('');
                            var number = country_code + ' ' + $('.phone-validate').val();
                            $('.phone_edit').text('+' + number);
                        },
                        error: function(xhr, status, error) {
                            $('.submit-button').prop("disabled", false);
                            $('.loader , .spin-loader').hide();
                        }
                    });
                } else {
                    $('.submit-button').prop("disabled", false);
                    $('#login').hide();
                    $('.login-condition').text('Enter Your 4 digit Login Pin');
                    $('.small-head').show();
                    $('#pin-popup').show();
                    var number = country_code + ' ' + $('.phone-validate').val();
                    $('.phone_edit').text('+' + number);
                }
            }
        });

        $("#verify_otp_form").on('submit', function(e) {
            e.preventDefault();
            formData = new FormData($(this)[0]);
            var _token = $('meta[name="csrf-token"]').attr('content');
            formData.append("_token", _token);
            var num1 = $('input[type="tel"][name="digit1"]').val();
            var num2 = $('input[type="tel"][name="digit2"]').val();
            var num3 = $('input[type="tel"][name="digit3"]').val();
            var num4 = $('input[type="tel"][name="digit4"]').val();
            var otp = num1 + '' + num2 + '' + num3 + '' + num4;
            formData.append("otp", otp);

            if (ValidateForm($(this))) {
                $('.loader , .spin-loader').show();
                $('.submit-button').prop("disabled", true);
                $.ajax({
                    type: 'POST',
                    url: '/dashboard/otp-verification',
                    data: formData,
                    cache: false,
                    processData: false,
                    contentType: false,
                    success: (res) => {
                        if (res.status) {
                            $(':input', '#verify_otp_form')
                                .not(':button, :submit, :reset, :hidden, #date')
                                .val('');
                            $('.submit-button').prop("disabled", false);
                            $('.loader , .spin-loader').hide();
                            $('#plan-lead-validate-popup').hide();
                            $('#pin-popup').show();
                            $('#profile_complete').val(res.profile);
                            $('.wrong-otp-error').hide()
                            if (res.profile == 100) {
                                // profile_complete = res.profile;
                                showCourseFilter()
                            }
                            userVerified = true;
                            $('.login-condition').text('Create your 4 digit Login PIN');
                            $('.small-head').hide();
                        } else if (res.status == 0) {
                            $('.wrong-otp-error').show()
                            $('.submit-button').prop("disabled", false);
                            $('.loader , .spin-loader').hide();
                        }
                    },
                    error: function(xhr, status, error) {
                        $('.submit-button').prop("disabled", false);
                        $('.loader , .spin-loader').hide();
                    }
                });
            }
        });

        // Country code dropdown

        $(document).on('click', '.edit-icon', function() {
            $('#plan-lead-validate-popup').hide()
            $('#pin-popup').hide()
            $('#login').show()
        })

        // Get all the input fields
        var inputFields = document.querySelectorAll('.otp_enter');

        // Add input event listener to each input field
        inputFields.forEach(function(inputField, index) {
            inputField.addEventListener('input', function() {
                // If the input value is not empty and the length is equal to the maxlength
                if (this.value && this.value.length === parseInt(this.getAttribute('maxlength'))) {
                    // If there is a next input field, focus on it
                    if (index < inputFields.length - 1) {
                        inputFields[index + 1].focus();
                    }
                }
            });

            // Add keydown event listener to each input field
            inputField.addEventListener('keydown', function(event) {
                // If the backspace key is pressed and the input value is empty
                if (event.keyCode === 8 && !this.value) {
                    // If there is a previous input field, focus on it
                    if (index > 0) {
                        inputFields[index - 1].focus();
                    }
                }
            });
        });

        $('.resend-link').on('click', function() {
            reset = 'reset';
            $('#plan-lead-form').submit();
        });

        $(document).on('click', '.reset-link', function() {
            reset = 'reset';
            userLogged = false;
            $('#plan-lead-form').submit();
        });


        $(document).on('submit', '#user-pin-form', function(e) {
            e.preventDefault();
            
            formData = new FormData($(this)[0]);
            var _token = $('meta[name="csrf-token"]').attr('content');
            formData.append("_token", _token);
            actualPin1 = actualPin.join('');
            formData.append("pin", actualPin1);

            if (ValidateForm($(this))) {
                $('.loader , .spin-loader').show();
                $('.submit-button').prop("disabled", true);
                if(!userVerified){
                    $.ajax({
                        type: 'POST',
                        url: '/dashboard/pin-verification',
                        data: formData,
                        cache: false,
                        processData: false,
                        contentType: false,
                        success: (res) => {
                            if (res.status) {
                                $(':input', '#user-pin-form')
                                    .not(':button, :submit, :reset, :hidden')
                                    .val('');
                                $('.submit-button').prop("disabled", false);
                                // $('.loader , .spin-loader').hide();
                                // $('#pin-popup').hide();
                                    // Retrieve the localStorage flag
                                    var hasTablet = localStorage.getItem('hasTablet');

                                    // Check the value and perform actions accordingly
                                    if (hasTablet === 'true') {
                                        $('#thank-you-tab').show();
                                    } else {
                                        // $('#login-success').show();
                                    }
                                
                                // setTimeout(() => {
                                //     $('#login-success').hide();
                                //     $('body').css('overflow','');
                                var examName = $('input[type="radio"][name="exam"]:checked').data('name');
                                if(examName == 'IELTS') {
                                    window.location.href = '{{ route('website.test-preparation.ieltsDemoClass') }}';
                                } else {
                                    window.location.href = '{{ route('dashboard.dashboard') }}';
                                }
                                // }, 2000);
                            } else if (res.status == 0) {
                                $('.wrong-pin-error').show()
                                $('.submit-button').prop("disabled", false);
                                $('.loader , .spin-loader').hide();
                            }
                        }, error: function(xhr, status, error) {
                            $('.submit-button').prop("disabled", false);
                            $('.loader , .spin-loader').hide();
                        }
                    });
                } else{
                    $.ajax({
                        type: 'POST',
                        url: '/dashboard/pin-generate',
                        data: formData,
                        cache: false,
                        processData: false,
                        contentType: false,
                        success: (res) => {
                            if (res.status) {
                                $(':input', '#user-pin-form')
                                    .not(':button, :submit, :reset, :hidden')
                                    .val('');
                                $('.submit-button').prop("disabled", false);
                                $('.loader , .spin-loader').hide();
                                // $('#pin-popup').hide();
                                    // Retrieve the localStorage flag
                                    var hasTablet = localStorage.getItem('hasTablet');

                                    // Check the value and perform actions accordingly
                                    if (hasTablet === 'true') {
                                        $('#thank-you-tab').show();
                                    } else {
                                        // $('#login-success').show();
                                    }

                                $('#login-success').hide();
                                $('body').css('overflow','');
                                window.location.href = '{{ route('website.test-preparation.ieltsDemoClass') }}';
                            } else if (res.status == 0) {
                                $('.wrong-pin-error').show()
                                $('.submit-button').prop("disabled", false);
                            }
                        }, error: function(xhr, status, error) {
                            $('.submit-button').prop("disabled", false);
                        }
                    });
                }
            }
        });

    })

    $(document).ready(function () {
        $('#phone').on('input', function () {
            var sanitizedValue = $(this).val().replace(/[^0-9]/g, '');
            $(this).val(sanitizedValue);
        });
    });

    function autoSlash(input, event) {
            if (event && (event.key == "Backspace" )) {
                return;
            }else{
                var value = input.value.replace(/\D/g, '');
                var dataValue = $(input).data('value');

                if(value.length == 1){
                    let day = value.substring(0, 1);
                    if (day != 1 && day != 2 && day != 3 && day != 0) {                
                        value = '0'+day;
                    }
                }

                if (value.length >= 2) {
                    var day = value.substring(0, 2);
                    if (day > 31) {
                        day = '31';
                    }
                    value = day + '/' + value.substring(2);
                }

                if (value.length > 3) {
                    var month = value.charAt(3);
                    demo = value.substring(0, 3);
                    if(month != '0' && month != 1){
                        value = value.substring(0, 3) + '0' + month;
                    }
                }

                if (value.length >= 5) {
                    var month = value.substring(3, 5);
                    var correctResult = true;
                    if (month > 12) {
                        correctResult = false;
                        month = '12';
                        value = value.substring(0, 3) + month + '/';
                    }
                    if (month == '00') {
                        correctResult = false;
                        month = '12';
                        value = value.substring(0, 3) + month + '/';
                    }
                    if (month === '02' && parseInt(value.substring(0, 2)) > 28) {
                        correctResult = false;
                        value = '29/' + value.substring(3);
                        value = value.substring(0, 5) + '/' + value.substring(5);
                    }
                    if ((month === '04' || month === '06' || month === '09' || month === '11') && parseInt(value.substring(0, 2)) > 30) {
                        correctResult = false;                
                        value = '30/' + value.substring(3);
                        value = value.substring(0, 5) + '/' + value.substring(5);
                    }
                    if(correctResult){
                        value = value.substring(0, 5) + '/' + value.substring(5);
                    }
                }

                if(value.length > 9){
                    var year = value.substring(6);
                    var currentYear = new Date().getFullYear();
                    if(dataValue == 'expiration'){
                        if(year > currentYear + 12){
                            year = currentYear;
                            value = value.substring(0, 6) + year;
                        }else if(year < currentYear){
                            year = currentYear;
                            value = value.substring(0, 6) + year;
                        }
                    }    
                    if(dataValue == 'birth'){
                        if(year > thisYear){
                            year = thisYear;
                            value = value.substring(0, 6) + year;
                        }if(year < 1990){
                            year = '1990';
                            value = value.substring(0, 6) + year;
                        }
                    }
                    if(dataValue == 'test'){
                        if(year > currentYear){
                            year = currentYear;
                            value = value.substring(0, 6) + year;
                        }
                    } 
                    if(year < 1990){
                        year = '1990';
                        value = value.substring(0, 6) + year;
                    }
                }
                input.value = value;
            }
        }

        function validateDate(input) {
            var value = input.value.replace(/\D/g, '');
            var id = input.id;

            if (!input.value.match(/^\d{1,2} [a-zA-Z]{3}, \d{4}$/)) {
                $('#'+id).val(dateMonthFormatSecond(input.value));
            }
        }

        function dateMonthFormatSecond(dateString) {
            if (dateString != null && dateString != undefined) {
                const dateRegex = /^\d{2}\/\d{2}\/\d{4}$/;
                if (dateRegex.test(dateString)) {
                    const parts = dateString.split("/");
                    const formattedDate = `${parts[1]}/${parts[0]}/${parts[2]}`;
                    
                    const date = new Date(formattedDate);
                    const month = new Intl.DateTimeFormat('en-US', { month: 'short' }).format(date);
                    const dayOfMonth = date.getDate();
                    const formattedDay = dayOfMonth < 10 ? `0${dayOfMonth}` : dayOfMonth;
                    const year = date.getFullYear();
            
                    return `${formattedDay} ${month}, ${year}`;
                }
            }
        }

    if ('OTPCredential' in window) {
        window.addEventListener('DOMContentLoaded', async (e) => {
            try {
                const otpCredential = await navigator.credentials.get({
                    otp: { transport: ['sms'] },
                });

                if (otpCredential && otpCredential.code) {
                    fillOtpInForm(otpCredential.code);
                    console.warn(`Received OTP: ${otpCredential.code}`);
                } else {
                    console.warn('No OTP received or invalid OTP credential.');
                }
            } catch (err) {
                console.error('Error obtaining OTP credential:', err);
            }
        });
    } else {
            console.log('WebOTP not supported!');
    }

    function fillOtpInForm(otp) {
		for (let i = 0; i < otp.length; i++) {
			$('input[name="digit' + (i + 1) + '"]').val(otp[i]);
		}
	}


    $(window).on('load', function(){
        setTimeout(() => {
            $('.generic-loader').hide();
        }, 500);
    })
    </script>
</body>

</html>
