index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- favicon  -->
    <link rel="shortcut icon" href="./assets/favicon.ico" type="image/x-icon">

    <!-- fontawsome cdn link  -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />

    <!-- css stylesheet link  -->
    <link rel="stylesheet" href="./style.css">
    <title>Redbus-Clone</title>
</head>
<body class="font-Mont">

    <!-- ------------------------navbar section starts here ----------------------- -->
    <nav class="px-4 md:px-14 py-1 md:py-3 flex text-xs md:text-base font-normal items-center justify-between sticky top-0 bg-white z-20 drop-shadow-xl">

        <!-- navbar left part stats here -->
        <div class="flex gap-2 md:gap-16 items-center w-full justify-between md:w-auto md:justify-start">
            <div class="grid place-content-center">
                <img class="md:w-[4.5rem] md:h-auto w-12 h-10" src="./assets/redbus-logo.svg" alt="Redbus Logo">
            </div>
            <div class="h-6 w-[1px] bg-gray-200"></div>
            <div class="flex gap-3">
                <a href="#" class="flex flex-col items-center text-center gap-1 px-2 py-3 rounded-lg group hover:bg-gray-100 bg-main-color sm:bg-transparent">
                    <svg class="group-hover:fill-main-color fill-white sm:fill-black" width="29" height="20" viewBox="0 0 29 20">
                        <path fill-rule="evenodd" clip-rule="evenodd" d="M27.4574 2.53544C26.7324 1.13025 25.8004 0.327283 24.7992 0.217787C15.4095 -0.712926 3.43064 1.49524 0.979642 3.88589C-0.090514 4.9261 -0.28038 7.3715 0.392782 11.3681C0.858818 14.1602 1.58376 16.6604 1.60102 16.7699L1.75637 17.3174L4.74245 16.9706C4.9841 18.6861 6.3822 20 8.07374 20C9.92062 20 11.4396 18.4123 11.4396 16.4414C11.4396 16.3501 11.4396 16.2771 11.4223 16.1859L18.4991 15.3282C18.4991 15.3464 18.4991 15.3829 18.4991 15.4012C18.4991 17.3539 20.0008 18.9598 21.8649 18.9598C23.7118 18.9598 25.2308 17.3721 25.2308 15.4012C25.2308 15.1092 25.1962 14.8172 25.1272 14.5435L28.1478 14.1785L28.3031 13.8317C29.5114 11.2039 29.0971 5.71082 27.4574 2.53544ZM8.07374 18.5948C6.9518 18.5948 6.03699 17.6276 6.03699 16.4414C6.03699 15.2552 6.9518 14.288 8.07374 14.288C9.19568 14.288 10.1105 15.2552 10.1105 16.4414C10.1105 17.6276 9.19568 18.5948 8.07374 18.5948ZM21.8477 17.5728C20.7257 17.5728 19.8109 16.6056 19.8109 15.4194C19.8109 14.2332 20.7257 13.266 21.8477 13.266C22.9696 13.266 23.8844 14.2332 23.8844 15.4194C23.8844 16.6056 22.9696 17.5728 21.8477 17.5728ZM27.233 12.8828L24.4886 13.2113C24.2814 12.9193 24.0225 12.682 23.7464 12.4813C23.2113 12.0798 22.5554 11.8608 21.8477 11.8608C20.8121 11.8608 19.8627 12.3718 19.2586 13.1565C19.0687 13.3755 18.8961 13.631 18.7235 13.9047L11.0598 14.8172C10.9908 14.6712 10.9045 14.5252 10.8182 14.3975C10.8009 14.3792 10.8009 14.361 10.7837 14.3427C10.1623 13.4668 9.17842 12.8828 8.07374 12.8828C7.21071 12.8828 6.43399 13.2295 5.84713 13.777C5.34657 14.215 4.96684 14.8172 4.74245 15.5472L2.7057 15.7844C1.61828 11.7878 0.686212 6.0758 1.87719 4.90785C3.51695 3.30191 11.9229 1.38574 20.1389 1.38574C21.6751 1.38574 23.194 1.45874 24.6612 1.60473C25.2135 1.67773 25.8004 2.24346 26.3009 3.21067C27.6472 5.82031 28.0788 10.5286 27.233 12.8828ZM4.89779 7.60874C4.82875 7.554 4.72519 7.49925 4.5871 7.4445C4.44902 7.38975 4.29367 7.3715 4.12107 7.3715C3.91394 7.3715 3.74134 7.408 3.58599 7.46275C3.44791 7.53575 3.32708 7.60874 3.22352 7.71824V10.6016H2.08432V6.33129L3.22352 6.2583V6.67803L3.58599 6.44079C3.70681 6.36779 3.82764 6.31304 3.98298 6.2583C4.13833 6.20355 4.25915 6.1853 4.39724 6.1853C4.53532 6.1853 4.63889 6.1853 4.70793 6.20355C4.79423 6.2218 4.84601 6.24005 4.89779 6.2583V7.60874ZM8.14278 8.08322C8.091 7.75474 7.97018 7.5175 7.79757 7.35325C7.62497 7.18901 7.41784 7.11601 7.15893 7.11601C6.8655 7.11601 6.64111 7.20726 6.48577 7.38975C6.33042 7.57224 6.24412 7.80949 6.2096 8.10147H8.14278V8.08322ZM9.21294 8.64895H6.22686C6.2959 8.99569 6.41673 9.25118 6.60659 9.39717C6.79646 9.54317 7.03811 9.63441 7.31428 9.63441C7.53866 9.63441 7.78031 9.59791 8.05648 9.52492C8.33265 9.45192 8.53978 9.36067 8.69512 9.25118V10.3279C8.53978 10.4374 8.33265 10.5286 8.02196 10.5834C7.72853 10.6381 7.48688 10.6746 7.31428 10.6746C6.60659 10.6746 6.03699 10.4739 5.64 10.0541C5.24301 9.63441 5.03588 9.08693 5.03588 8.39346C5.03588 7.69999 5.24301 7.13426 5.65726 6.71453C6.07151 6.2948 6.57207 6.0758 7.19345 6.0758C7.81483 6.0758 8.29813 6.31304 8.6606 6.76928C9.02307 7.22551 9.21294 7.86423 9.21294 8.64895ZM12.4752 9.28768V7.408C12.4061 7.31675 12.3026 7.24376 12.1645 7.18901C12.0264 7.13426 11.8711 7.09776 11.6985 7.09776C11.3878 7.09776 11.1461 7.18901 11.008 7.38975C10.8527 7.59049 10.7837 7.90073 10.7837 8.32046C10.7837 8.75845 10.87 9.06869 11.0253 9.28768C11.1806 9.50667 11.405 9.59791 11.6812 9.59791C11.8538 9.59791 12.0092 9.56141 12.1472 9.50667C12.2853 9.45192 12.3889 9.37892 12.4752 9.28768ZM13.5971 10.6016H12.7341L12.4925 10.2001L11.8883 10.5469C11.8365 10.5834 11.7675 10.6016 11.6639 10.6199C11.5604 10.6381 11.4913 10.6381 11.4223 10.6381C10.8354 10.6381 10.3867 10.4374 10.076 9.9994C9.76528 9.57966 9.60993 9.05044 9.60993 8.41171C9.60993 7.71824 9.7998 7.17076 10.1623 6.76928C10.542 6.36779 11.0253 6.16705 11.6294 6.16705C11.802 6.16705 11.9574 6.1853 12.0955 6.20355C12.2335 6.24005 12.3544 6.27655 12.4752 6.36779V4.48812H13.5971V10.6016ZM17.4635 8.6672C17.4635 8.35696 17.3772 8.11972 17.2219 7.97373C17.0665 7.82773 16.8421 7.75474 16.5832 7.75474H15.7892V9.57967H16.6868C16.9457 9.57967 17.1528 9.50667 17.2736 9.34242C17.3945 9.19643 17.4635 8.95919 17.4635 8.6672ZM17.2564 6.34954C17.2564 6.1123 17.1873 5.91156 17.0492 5.76557C16.9112 5.61957 16.7213 5.54658 16.4796 5.54658H15.7892V7.18901H16.5487C16.7731 7.18901 16.9457 7.11601 17.0665 6.97002C17.2046 6.80578 17.2564 6.60503 17.2564 6.34954ZM18.7408 8.83144C18.7408 9.36067 18.5854 9.79866 18.2575 10.1089C17.9295 10.4374 17.5153 10.5834 17.0147 10.5834H14.5465V4.50637H16.9629C17.4117 4.50637 17.7914 4.63411 18.0676 4.90785C18.361 5.18159 18.4991 5.54658 18.4991 6.02106C18.4991 6.40429 18.4128 6.69628 18.2402 6.93352C18.0676 7.17076 17.8087 7.29851 17.4635 7.35325C17.8087 7.408 18.1021 7.57225 18.361 7.82773C18.62 8.08322 18.7408 8.41171 18.7408 8.83144ZM23.2285 10.6016H22.0893V10.1271L21.606 10.4191C21.468 10.4921 21.3299 10.5651 21.1918 10.6016C21.0537 10.6381 20.8811 10.6746 20.7257 10.6746C20.3288 10.6746 20.0181 10.5469 19.7764 10.2914C19.552 10.0359 19.4312 9.68916 19.4312 9.25118V6.34954H20.5704V8.97744C20.5704 9.14168 20.6222 9.26943 20.7257 9.39717C20.8293 9.52492 21.0019 9.57967 21.209 9.57967C21.4162 9.57967 21.5888 9.54317 21.7269 9.45192C21.8822 9.36067 21.9858 9.28768 22.0548 9.19643V6.33129H23.194V10.6016H23.2285ZM27.1985 9.14168C27.1985 9.59791 27.0431 9.98115 26.7324 10.2731C26.4217 10.5469 26.0247 10.6929 25.5587 10.6929C25.3343 10.6929 25.0754 10.6746 24.782 10.6199C24.4713 10.5651 24.2124 10.4739 23.9707 10.3461V9.26943C24.1606 9.37892 24.3677 9.47017 24.6094 9.56142C24.851 9.63441 25.1099 9.68916 25.4379 9.68916C25.6623 9.68916 25.8349 9.65266 25.973 9.59791C26.1111 9.52492 26.1801 9.41542 26.1801 9.23293C26.1801 9.12343 26.1283 9.01394 26.0075 8.94094C25.8867 8.86794 25.6968 8.8132 25.4034 8.79495C24.8855 8.75845 24.5403 8.61245 24.3332 8.39346C24.1261 8.17447 24.0225 7.88248 24.0225 7.5175C24.0225 7.09776 24.1779 6.76928 24.4886 6.49554C24.7992 6.2218 25.1962 6.09405 25.645 6.09405C25.8521 6.09405 26.0593 6.1123 26.2837 6.1488C26.508 6.1853 26.6979 6.2218 26.8705 6.2948V7.38975C26.6634 7.29851 26.4735 7.22551 26.2837 7.18901C26.0938 7.15251 25.8694 7.11601 25.645 7.11601C25.4551 7.11601 25.3171 7.15251 25.2135 7.20726C25.1099 7.28026 25.0582 7.35325 25.0582 7.42625C25.0582 7.59049 25.1272 7.69999 25.2825 7.73649C25.4206 7.79124 25.576 7.82773 25.7486 7.82773C26.2319 7.86423 26.6116 7.99198 26.8533 8.21097C27.0776 8.44821 27.1985 8.75845 27.1985 9.14168Z" />
                    </svg>                        
                    <p class="text-white sm:text-black">Bus Tickets</p>
                </a>

                <a href="#" class="flex flex-col items-center text-center gap-1 px-2 py-3 rounded-lg group hover:bg-gray-100">
                    <svg class="group-hover:fill-[#5F4299]" width="35" height="20" viewBox="0 0 35 20">
                        <path d="M16.3867 14.881L16.3002 14.7492L16.1873 14.8594C15.6684 15.365 15.0775 15.7819 14.4314 16.0982C13.8116 16.4026 13.1535 16.6086 12.4737 16.7117V10.6877L17.0328 6.13978C17.3091 6.53514 17.5421 6.96166 17.727 7.40495L17.7847 7.54153L17.9144 7.46725L17.9384 7.45288C17.9528 7.44329 17.9697 7.4361 17.9841 7.42652C18.5125 7.13418 19.0962 6.94249 19.7208 6.85383L19.8865 6.82987L19.8241 6.67652C19.1635 5.02077 18.0345 3.60942 16.5572 2.59105C15.0439 1.55112 13.2736 1 11.4336 1C9.59355 1 7.84242 1.54393 6.33871 2.57668C4.86863 3.58307 3.73964 4.98243 3.07186 6.6238L3.0022 6.79633L3.18716 6.80351C3.86695 6.83466 4.50351 6.97604 5.08001 7.22764L5.19771 7.27796L5.25056 7.16054C5.4163 6.80351 5.61327 6.46086 5.83667 6.13738L10.3958 10.6853V16.7093C9.15877 16.52 7.99856 15.9928 7.03532 15.1781L6.93203 15.0919L6.84795 15.1973C6.47563 15.6645 6.01683 16.0503 5.48596 16.3427C5.44753 16.3642 5.4091 16.3858 5.35865 16.4097L5.19291 16.496L5.32983 16.623C7.00169 18.1565 9.16838 19 11.4336 19C13.814 19 16.0624 18.0799 17.7655 16.405L17.8832 16.2899L17.7439 16.2013C17.201 15.861 16.7446 15.4153 16.3867 14.8762V14.881ZM15.606 4.63978L11.436 8.79952L7.26351 4.63978C7.82801 4.20128 8.45255 3.85623 9.12274 3.61422C9.86258 3.34585 10.6409 3.21166 11.4336 3.21166C12.2262 3.21166 13.0045 3.34824 13.7444 3.61422C14.4146 3.85623 15.0391 4.20128 15.6036 4.63978H15.606Z"/>
                        <path d="M2.13749 8.92406V8.00873H0.0812988V16.3043H2.22877V12.2763C2.22877 11.5119 2.42334 10.9225 2.81008 10.5247C3.19441 10.1269 3.74209 9.92566 4.4339 9.92566C4.5564 9.92566 4.69572 9.94004 4.84706 9.96879L5.00319 9.99754V7.92007H4.87108C3.64361 7.92007 2.72841 8.25793 2.13749 8.92406Z" />
                        <path d="M23.7708 4.88175H23.6387V8.80907C23.3624 8.55028 23.0454 8.34661 22.6874 8.20044C22.231 8.01354 21.7218 7.92009 21.1741 7.92009C20.3814 7.92009 19.6584 8.09741 19.0218 8.44725C18.3853 8.79948 17.8785 9.30028 17.5157 9.94245C17.1554 10.5822 16.9705 11.3274 16.9705 12.1589C16.9705 12.9904 17.153 13.738 17.5157 14.3825C17.8785 15.0271 18.3853 15.5327 19.0218 15.8849C19.656 16.2348 20.3814 16.4121 21.1741 16.4121C21.741 16.4121 22.2695 16.3115 22.7403 16.1174C23.1078 15.964 23.4345 15.7484 23.7131 15.4776V16.3091H25.7837V4.88175H23.7684H23.7708ZM23.6699 12.1589C23.6699 12.6357 23.569 13.0599 23.3696 13.4193C23.1703 13.7763 22.8988 14.0567 22.5601 14.2484C22.219 14.4425 21.8299 14.5407 21.4023 14.5407C20.9748 14.5407 20.5856 14.4425 20.2469 14.2484C19.9082 14.0567 19.6344 13.7763 19.4374 13.4193C19.238 13.0599 19.1371 12.6357 19.1371 12.1589C19.1371 11.6821 19.238 11.2579 19.4374 10.8985C19.6368 10.5415 19.9082 10.2611 20.2469 10.0695C20.588 9.87536 20.9772 9.77712 21.4023 9.77712C21.8275 9.77712 22.219 9.87536 22.5601 10.0695C22.8988 10.2611 23.1727 10.5415 23.3696 10.8985C23.569 11.2579 23.6699 11.6821 23.6699 12.1589Z"/>
                        <path d="M34.3807 9.96639C34.0228 9.32182 33.5184 8.81384 32.8818 8.45681C32.2477 8.10218 31.5174 7.92007 30.7151 7.92007C29.9129 7.92007 29.161 8.10218 28.51 8.464C27.8591 8.82582 27.3402 9.3362 26.9751 9.98077C26.6076 10.6253 26.4226 11.3562 26.4226 12.1589C26.4226 12.9616 26.6148 13.7092 26.9919 14.3538C27.369 14.9983 27.9119 15.5087 28.6061 15.8705C29.2955 16.23 30.1026 16.4121 31.0034 16.4121C31.7096 16.4121 32.3558 16.2971 32.9227 16.0718C33.4944 15.8442 33.9724 15.5015 34.3471 15.0558L34.4192 14.9696L34.3447 14.8857L33.3334 13.7284L33.2398 13.6205L33.1413 13.7212C32.596 14.2747 31.8922 14.555 31.049 14.555C30.3885 14.555 29.8288 14.3897 29.3844 14.0614C28.988 13.7691 28.7262 13.3737 28.6013 12.8897H34.878L34.8876 12.7699C34.9092 12.5231 34.9188 12.3362 34.9188 12.202C34.9188 11.361 34.7387 10.6086 34.3832 9.964L34.3807 9.96639ZM32.8362 11.3801H28.5797C28.683 10.8913 28.9136 10.4912 29.2691 10.1892C29.6606 9.85617 30.1459 9.68604 30.7151 9.68604C31.2844 9.68604 31.7817 9.85617 32.166 10.194C32.5167 10.5007 32.7425 10.8985 32.8362 11.3801Z"/>
                        </svg>                                               
                    <p>Cab Rental</p>
                </a>


                <a href="#" class="flex flex-col items-center text-center gap-1 px-2 py-3 rounded-lg group hover:bg-gray-100">
                    <svg class="group-hover:fill-main-color" width="35" height="20" viewBox="0 0 35 20">
                        <path d="M34.6657 13.3366L33.8769 14.3512H33.4167L33.5463 10.8389C33.5572 10.5179 33.5077 10.1979 33.4006 9.89748L30.9659 2.99232C30.8016 2.53105 30.5088 2.13359 30.1264 1.85262C29.744 1.57164 29.2901 1.42044 28.8247 1.41904H24.6508L23.8934 0.518577C23.7561 0.355357 23.5879 0.224779 23.3996 0.135409C23.2113 0.0460392 23.0073 -0.000151152 22.8009 4.79963e-07H20.718C20.4128 -0.000254262 20.1151 0.100901 19.8669 0.289128C19.6187 0.477356 19.4324 0.743237 19.3342 1.04944L19.2155 1.41904H0V2.8851H28.8276C29.0108 2.88542 29.1897 2.94459 29.3405 3.05479C29.4913 3.165 29.6071 3.32106 29.6725 3.50239L32.1072 10.4067C32.1493 10.5254 32.1684 10.6519 32.1633 10.7787L32.0132 14.862C32.0047 15.1089 31.906 15.3425 31.7379 15.5137C31.5698 15.6849 31.3455 15.7802 31.1123 15.7794H27.9282C27.7499 15.7796 27.5756 15.7239 27.4273 15.6191C27.2789 15.5143 27.1633 15.3652 27.095 15.1907L26.4912 13.6475C26.3343 13.244 26.0676 12.8992 25.7251 12.657C25.3825 12.4147 24.9797 12.2859 24.5678 12.2871H24.5612L5.85336 12.3643C5.46486 12.3641 5.08415 12.4798 4.75481 12.6981C4.42547 12.9164 4.1608 13.2286 3.99109 13.5989L3.6903 14.2447C3.61545 14.4045 3.50013 14.539 3.35724 14.6333C3.21434 14.7276 3.04951 14.7779 2.88116 14.7787H0V16.2447H2.88116C3.24969 16.243 3.61246 16.1477 3.93894 15.9665C4.26541 15.7854 4.54606 15.5238 4.75727 15.2038C4.51709 16.1252 4.61461 17.1088 5.03028 17.9572C5.44594 18.8056 6.14901 19.4562 6.99847 19.7784C7.84793 20.1006 8.78095 20.0705 9.61041 19.6944C10.4399 19.3182 11.1044 18.6237 11.4707 17.7501H9.84299C9.54763 18.1021 9.15824 18.3506 8.72649 18.4627C8.29474 18.5748 7.84102 18.5452 7.42552 18.3778C7.01002 18.2104 6.65237 17.9131 6.40002 17.5254C6.14766 17.1377 6.01252 16.6779 6.01252 16.2069C6.01252 15.7359 6.14766 15.2761 6.40002 14.8884C6.65237 14.5007 7.01002 14.2035 7.42552 14.0361C7.84102 13.8687 8.29474 13.839 8.72649 13.9511C9.15824 14.0632 9.54763 14.3117 9.84299 14.6637H11.4686C11.3386 14.3571 11.1708 14.0702 10.9697 13.8103L12.4809 13.8034C12.2771 14.0648 12.1076 14.3542 11.9769 14.6637H13.6047C13.8101 14.4187 14.0621 14.2226 14.3443 14.0883C14.6264 13.954 14.9322 13.8845 15.2415 13.8845C15.5508 13.8845 15.8566 13.954 16.1388 14.0883C16.4209 14.2226 16.673 14.4187 16.8784 14.6637H18.5069C18.3718 14.3453 18.1961 14.048 17.9847 13.7802L19.5425 13.7732C19.3284 14.0427 19.1507 14.3424 19.0145 14.6637H20.6452C20.9406 14.3115 21.3301 14.0627 21.762 13.9505C22.1939 13.8382 22.6479 13.8678 23.0636 14.0352C23.4793 14.2026 23.8371 14.5 24.0896 14.8879C24.3421 15.2757 24.4773 15.7357 24.4773 16.2069C24.4773 16.6781 24.3421 17.1381 24.0896 17.526C23.8371 17.9139 23.4793 18.2112 23.0636 18.3786C22.6479 18.546 22.1939 18.5756 21.762 18.4633C21.3301 18.3511 20.9406 18.1023 20.6452 17.7501H19.0167C19.3504 18.5426 19.9307 19.1896 20.6607 19.5831C21.3906 19.9767 22.226 20.0928 23.027 19.9121C23.8281 19.7314 24.5463 19.2649 25.0617 18.5904C25.577 17.916 25.8583 17.0746 25.8583 16.2069C25.8583 16.0716 25.8512 15.9363 25.8372 15.8018C26.0154 16.2315 26.3079 16.5968 26.679 16.8531C27.0502 17.1094 27.4837 17.2455 27.9267 17.2447H31.1123C31.5564 17.2461 31.9913 17.1099 32.3633 16.8528C32.7353 16.5958 33.0283 16.2291 33.2062 15.798H33.9301L34.6672 16.6367C34.693 16.6659 34.7265 16.6862 34.7633 16.695C34.8001 16.7038 34.8386 16.7007 34.8738 16.6861C34.9089 16.6714 34.9391 16.646 34.9604 16.613C34.9818 16.58 34.9933 16.5409 34.9934 16.5009L35 13.4662C35.0005 13.4248 34.9889 13.3842 34.9667 13.3501C34.9445 13.316 34.9129 13.2901 34.8762 13.2758C34.8395 13.2616 34.7995 13.2598 34.7618 13.2706C34.7241 13.2815 34.6905 13.3046 34.6657 13.3366Z"  />
                        <path d="M15.2441 18.5273C14.9346 18.5275 14.6286 18.4581 14.3464 18.3236C14.0641 18.1892 13.8121 17.9926 13.6069 17.7472H11.9784C12.2594 18.416 12.7173 18.9842 13.2968 19.3829C13.8762 19.7817 14.5524 19.9939 15.2434 19.9939C15.9343 19.9939 16.6105 19.7817 17.19 19.3829C17.7694 18.9842 18.2274 18.416 18.5083 17.7472H16.8806C16.6755 17.9926 16.4235 18.189 16.1414 18.3235C15.8593 18.458 15.5535 18.5274 15.2441 18.5273Z"  />
                        <path d="M22.9757 16.2039C22.9757 16.0095 22.9028 15.8231 22.7731 15.6857C22.6433 15.5482 22.4673 15.4709 22.2838 15.4709H8.20576C8.02226 15.4709 7.84628 15.5482 7.71653 15.6857C7.58677 15.8231 7.51388 16.0095 7.51388 16.2039C7.51388 16.3983 7.58677 16.5848 7.71653 16.7223C7.84628 16.8598 8.02226 16.937 8.20576 16.937H22.2816C22.3727 16.9373 22.4629 16.9186 22.5471 16.8819C22.6313 16.8452 22.7078 16.7912 22.7723 16.7231C22.8368 16.655 22.8879 16.5741 22.9228 16.485C22.9578 16.3959 22.9757 16.3004 22.9757 16.2039Z"  />
                        <path d="M0 10.3448V6.26733H1.28678V7.45598L1.09483 7.11744C1.20858 6.8115 1.39342 6.5833 1.64935 6.43284C1.90529 6.27737 2.21573 6.19963 2.58067 6.19963V7.48607C2.51906 7.47604 2.46455 7.47102 2.41716 7.47102C2.3745 7.46601 2.3271 7.4635 2.27497 7.4635C2.00008 7.4635 1.77732 7.54375 1.6067 7.70424C1.43607 7.85971 1.35076 8.1155 1.35076 8.47159V10.3448H0Z"  />
                        <path d="M5.1224 10.4125C4.66741 10.4125 4.26929 10.3223 3.92804 10.1417C3.59154 9.95614 3.3285 9.70537 3.13891 9.3894C2.95407 9.06842 2.86165 8.7048 2.86165 8.29856C2.86165 7.89231 2.9517 7.53121 3.1318 7.21524C3.31665 6.89426 3.57021 6.646 3.8925 6.47046C4.21479 6.2899 4.57736 6.19963 4.98022 6.19963C5.35938 6.19963 5.70536 6.28238 6.01817 6.44789C6.33098 6.60838 6.57981 6.84661 6.76465 7.16258C6.94949 7.47855 7.04191 7.86222 7.04191 8.3136C7.04191 8.36376 7.03954 8.42144 7.0348 8.48664C7.03006 8.55183 7.02532 8.61202 7.02058 8.66719H3.9707V7.91488H6.30254L5.79068 8.12553C5.79542 7.93996 5.76224 7.77947 5.69115 7.64405C5.62479 7.50864 5.53 7.40332 5.40677 7.32809C5.28829 7.25285 5.14847 7.21524 4.98733 7.21524C4.82618 7.21524 4.684 7.25285 4.56077 7.32809C4.44228 7.40332 4.34986 7.51115 4.28351 7.65158C4.21715 7.78699 4.18398 7.94748 4.18398 8.13305V8.35122C4.18398 8.55183 4.22189 8.72486 4.29773 8.87031C4.3783 9.01576 4.49205 9.1286 4.63897 9.20885C4.7859 9.28408 4.96126 9.32169 5.16506 9.32169C5.35464 9.32169 5.51578 9.29411 5.64849 9.23894C5.78594 9.17876 5.92101 9.08848 6.05372 8.96811L6.76465 9.75051C6.57981 9.96617 6.35231 10.1317 6.08216 10.247C5.812 10.3574 5.49209 10.4125 5.1224 10.4125Z"  />
                        <path d="M9.34248 10.4125C8.99176 10.4125 8.67184 10.3273 8.38273 10.1568C8.09836 9.98121 7.87086 9.73797 7.70024 9.42702C7.52962 9.11105 7.44431 8.7349 7.44431 8.29856C7.44431 7.86724 7.52962 7.4961 7.70024 7.18515C7.87086 6.86918 8.09836 6.62593 8.38273 6.45541C8.67184 6.28489 8.99176 6.19963 9.34248 6.19963C9.67425 6.19963 9.95388 6.27486 10.1814 6.42532C10.4136 6.57578 10.589 6.80649 10.7075 7.11744C10.826 7.42839 10.8852 7.8221 10.8852 8.29856C10.8852 8.78505 10.8283 9.18377 10.7146 9.49472C10.6008 9.80568 10.4302 10.0364 10.2027 10.1868C9.97521 10.3373 9.68847 10.4125 9.34248 10.4125ZM9.62686 9.27656C9.77852 9.27656 9.9136 9.23894 10.0321 9.16371C10.1553 9.08848 10.2525 8.97814 10.3236 8.8327C10.3947 8.68223 10.4302 8.50419 10.4302 8.29856C10.4302 8.09293 10.3947 7.9199 10.3236 7.77947C10.2525 7.63402 10.1553 7.52368 10.0321 7.44845C9.9136 7.37322 9.77852 7.33561 9.62686 7.33561C9.47045 7.33561 9.33064 7.37322 9.20741 7.44845C9.08892 7.52368 8.99413 7.63402 8.92304 7.77947C8.85194 7.9199 8.8164 8.09293 8.8164 8.29856C8.8164 8.50419 8.85194 8.68223 8.92304 8.8327C8.99413 8.97814 9.08892 9.08848 9.20741 9.16371C9.33064 9.23894 9.47045 9.27656 9.62686 9.27656ZM10.4729 10.3448V9.64518L10.48 8.29856L10.4089 6.95193V4.76273H11.7596V10.3448H10.4729Z"  />
                        <path d="M12.6927 10.3448V5.07869H14.9676C15.4226 5.07869 15.8137 5.15643 16.1407 5.31191C16.4724 5.46738 16.7284 5.69308 16.9085 5.98898C17.0886 6.27987 17.1786 6.62593 17.1786 7.02716C17.1786 7.42338 17.0886 7.76693 16.9085 8.05782C16.7284 8.3437 16.4724 8.56437 16.1407 8.71985C15.8137 8.87031 15.4226 8.94554 14.9676 8.94554H13.4747L14.1003 8.32113V10.3448H12.6927ZM15.771 10.3448L14.534 8.42645H16.034L17.2782 10.3448H15.771ZM14.1003 8.47911L13.4747 7.79451H14.8823C15.1762 7.79451 15.3942 7.72681 15.5364 7.59139C15.6833 7.45598 15.7568 7.2679 15.7568 7.02716C15.7568 6.78141 15.6833 6.59083 15.5364 6.45541C15.3942 6.32 15.1762 6.25229 14.8823 6.25229H13.4747L14.1003 5.56769V8.47911Z"  />
                        <path d="M20.2097 10.3448V9.585L20.1173 9.39692V7.99764C20.1173 7.77195 20.0509 7.59891 19.9182 7.47855C19.7902 7.35316 19.5841 7.29047 19.2997 7.29047C19.1149 7.29047 18.9276 7.32307 18.7381 7.38827C18.5485 7.44845 18.3873 7.53372 18.2546 7.64405L17.7996 6.67358C18.0177 6.52312 18.2783 6.40777 18.5817 6.32752C18.8897 6.24226 19.1954 6.19963 19.4988 6.19963C20.1244 6.19963 20.6078 6.3526 20.9491 6.65853C21.295 6.95946 21.468 7.43341 21.468 8.08039V10.3448H20.2097ZM19.0722 10.4125C18.7641 10.4125 18.5035 10.3574 18.2902 10.247C18.0769 10.1367 17.9134 9.98623 17.7996 9.79565C17.6906 9.60506 17.6361 9.39191 17.6361 9.15619C17.6361 8.90542 17.6954 8.68976 17.8139 8.5092C17.9371 8.32364 18.1243 8.1832 18.3755 8.08791C18.6267 7.98761 18.9513 7.93745 19.3495 7.93745H20.2595V8.68223H19.5343C19.3163 8.68223 19.1623 8.71985 19.0722 8.79508C18.9869 8.87031 18.9442 8.97062 18.9442 9.096C18.9442 9.22139 18.9893 9.32169 19.0793 9.39692C19.1694 9.47216 19.2926 9.50977 19.449 9.50977C19.5959 9.50977 19.7286 9.47216 19.8471 9.39692C19.9703 9.31668 20.0604 9.19631 20.1173 9.03582L20.3021 9.56243C20.231 9.84329 20.0912 10.0564 19.8827 10.2019C19.6789 10.3423 19.4087 10.4125 19.0722 10.4125Z"  />
                        <path d="M22.3206 10.3448V6.26733H23.6714V10.3448H22.3206ZM22.996 5.81595C22.7496 5.81595 22.5505 5.74323 22.3988 5.59778C22.2472 5.45234 22.1713 5.27178 22.1713 5.05612C22.1713 4.84046 22.2472 4.65991 22.3988 4.51446C22.5505 4.36902 22.7496 4.2963 22.996 4.2963C23.2425 4.2963 23.4415 4.36651 23.5932 4.50694C23.7449 4.64236 23.8207 4.81789 23.8207 5.03356C23.8207 5.25925 23.7449 5.44732 23.5932 5.59778C23.4463 5.74323 23.2472 5.81595 22.996 5.81595Z"  />
                        <path d="M24.5492 10.3448V4.76273H25.9V10.3448H24.5492Z"  />
                        </svg>
                                                                      
                    <p>Train Tickets</p>
                </a>
            </div>
        </div>
        <!-- navbar left part ends here -->


        <!-- navbar right part starts here  -->
        <div class="hidden md:flex items-center gap-3">
            <a class="flex items-center justify-center gap-2 h-10 px-2 rounded-lg hover:bg-gray-100" href="#">
                <i class="fa-solid fa-headset text-[#4a4a4a] text-xl"></i>
                <p>Help</p>
            </a>
            <a class="flex items-center justify-center gap-2 h-10 px-2 rounded-lg hover:bg-gray-100" href="#">
                <i class="fa-regular fa-user text-[#4a4a4a] text-xl"></i>
                <p>Account</p>
                <i class="fa-solid fa-angle-down  text-[#4a4a4a] text-xl"></i>
            </a>
        </div>
        <!-- navbar right part ends here  -->

    </nav>
    <!-- ------------------------navbar section ends here ----------------------- -->

    <!-- --------------------------- hero section starts here ---------------------------  -->
    <section class="h-[32rem] bg-main-color bg-[url('./assets/hero-img.png')] bg-center  bg-no-repeat bg-cover flex justify-center">
        <div class="flex flex-col items-center w-full max-w-[1400px]">
            <h1 class="text-2xl mx-4 md:text-[2rem] text-white font-bold mt-16 mb-4 text-center">India's No. 1 Online Bus Ticket Booking Site</h1>


            <!-- travel search section sharts here -->
            <div class="w-[90%] sm:w-[80%] lg:h-24 mt-4 bg-white cursor-pointer relative bottom-7 sm:bottom-0 flex flex-col lg:flex-row rounded-3xl overflow-hidden hover:drop-shadow-lg">
                <!-- travel search left side  -->
                <div class="h-full flex flex-col sm:flex-row items-center justify-center lg:w-1/2">
                    <div class="h-full border-b sm:border-r border-gray-300 w-full md:w-[50%] sm:w-auto">
                        <div class="px-7 py-8 flex items-center h-full gap-3">
                            <i class="fa-solid fa-bus-simple text-gray-500 text-2xl"></i>
                            <input class="outline-none w-full" type="text" name="" id="" placeholder="From">
                        </div>
                    </div>
                    <div class="w-10 h-10 bg-white rounded-full  grid place-content-center absolute border border-gray-300">
                        <i class="fa-solid fa-arrows-turn-to-dots text-gray-500 text-xl"></i>
                    </div>
                    <div class="h-full border-b sm:border-r border-gray-300 w-full md:w-[50%] sm:w-auto">
                        <div class="px-7 py-8 flex items-center h-full gap-3">
                            <i class="fa-solid fa-person-walking-luggage text-gray-500 text-2xl"></i>
                            <input class="outline-none w-full" type="text" name="" id="" placeholder="To">
                        </div>
                    </div>
                </div>
                <!-- travel search right section  -->
                <div class="flex bg-white flex-col sm:flex-row lg:w-1/2">
                    <div class="h-full border-b sm:border-r border-gray-300 sm:w-1/2 w-full">
                        <div class="px-7 py-8 flex items-center h-full gap-3 group relative pr-12">
                            <i class="fa-solid fa-calendar-days text-gray-500 text-2xl"></i>
                            <input class="outline-none opacity-0 scale-[3] h-14 w-[30px] absolute left-14 z-10" type="date" name="" id="" placeholder="To">
                            <p class="text-gray-400">Date</p>
                        </div>
                    </div>
                    <button class=" px-7 py-8 flex items-center justify-center bg-main-color whitespace-nowrap text-white font-bold w-full sm:w-1/2 text-center">
                       SEARCH BUSES
                    </button>
                </div>

            </div>
            <!-- travel search section ends here -->
        </div>
    </section>
    <!-- -------------------------- hero section ends here ---------------------------  -->


    <!-- ------------------------------- offers section starts here -------------------- -->
    <section class="flex relative md:bottom-[150px] mb-20 mt-10 md:my-0 justify-center">
        <div class="flex flex-col items-center w-full max-w-[1400px] py-6 pb-0">
            <div class="w-full md:w-[80%] md:p-8 flex flex-col gap-6 bg-white md:rounded-3xl md:drop-shadow-xl">
                <div class="flex justify-between px-4 md:px-0">
                    <h2 class="text-xl md:text-3xl text-gray-600">TRENDING OFFERS</h2>
                    <button class="text-blue-600 py-1 font-semibold text-base  px-4 rounded-full border border-gray-500 hover:shadow-lg">View All</button>
                </div>
                <div class="flex text-white gap-6 overflow-auto pl-4 md:pl-0">

                    <!-- offer card one  -->
                    <div class="h-36 w-64 rounded-xl bg-gradient-to-r from-blue-800 to-blue-500 flex p-3 cursor-pointer flex-shrink-0">
                        <div class="h-full grid place-content-center px-2">
                            <img class="rounded-full w-24" src="./assets/offer1.png" alt="">
                        </div>
                        <div class="flex flex-col gap-2">
                            <p class="text-xs px-1 py-[1px] bg-[#ffffff4c] rounded-full w-10 grid place-content-center">BUS</p>
                            <h3 class="font-bold text-base leading-5">Save up to Rs 250 on bus tickets</h3>
                            <p class="text-xs">Valid till 30 Nov</p>
                            <div class="flex gap-3 items-center">
                                <p class="grid place-content-center bg-[#ffffff4c] h-6 font-semibold px-2 rounded-sm border border-dashed border-white text-xs">FIRST</p>
                                <i class="fa-regular fa-copy text-xl"></i>
                            </div>
                        </div>
                    </div>

                    <!-- offer card two  -->
                    <div class="h-36 w-64 rounded-xl bg-gradient-to-r from-red-800 to-red-500 flex p-3 cursor-pointer flex-shrink-0">
                        <div class="h-full grid place-content-center px-2">
                            <img class="rounded-full w-24" src="./assets/offer2.png" alt="">
                        </div>
                        <div class="flex flex-col gap-2">
                            <p class="text-xs px-1 py-[1px] bg-[#ffffff4c] rounded-full w-10 grid place-content-center">BUS</p>
                            <h3 class="font-bold text-base leading-5">Save up to Rs 300 on AP, TS routes</h3>
                            <p class="text-xs">Valid till 30 Nov</p>
                            <div class="flex gap-3 items-center">
                                <p class="grid place-content-center bg-[#ffffff4c] h-6 font-semibold px-2 rounded-sm border border-dashed border-white text-xs">SUPERHIT</p>
                                <i class="fa-regular fa-copy text-xl"></i>
                            </div>
                        </div>
                    </div>

                    <!-- offer card three  -->
                    <div class="h-36 w-64 rounded-xl bg-gradient-to-r from-green-800 to-green-500 flex p-3 cursor-pointer flex-shrink-0">
                        <div class="h-full grid place-content-center px-2">
                            <img class="rounded-full w-24" src="./assets/offer3.png" alt="">
                        </div>
                        <div class="flex flex-col gap-2">
                            <p class="text-xs px-1 py-[1px] bg-[#ffffff4c] rounded-full w-10 grid place-content-center">BUS</p>
                            <h3 class="font-bold text-base leading-5">Save up to Rs 300 on RJ,MH, Goa, MP,</h3>
                            <p class="text-xs">Valid till 30 Nov</p>
                            <div class="flex gap-3 items-center">
                                <p class="grid place-content-center bg-[#ffffff4c] h-6 font-semibold px-2 rounded-sm border border-dashed border-white text-xs">BUS300</p>
                                <i class="fa-regular fa-copy text-xl"></i>
                            </div>
                        </div>
                    </div>

                    <!-- offer card four  -->
                    <div class="h-36 w-64 rounded-xl bg-gradient-to-r from-sky-800 to-sky-500 flex p-3 cursor-pointer flex-shrink-0">
                        <div class="h-full grid place-content-center px-2">
                            <img class="rounded-full w-24" src="./assets/offer4.png" alt="">
                        </div>
                        <div class="flex flex-col gap-2">
                            <p class="text-xs px-1 py-[1px] bg-[#ffffff4c] rounded-full w-10 grid place-content-center">BUS</p>
                            <h3 class="font-bold text-base leading-5">Save up to Rs 200 in Kerala routes.</h3>
                            <p class="text-xs">Valid till 30 Nov</p>
                            <div class="flex gap-3 items-center">
                                <p class="grid place-content-center bg-[#ffffff4c] h-6 font-semibold px-2 rounded-sm border border-dashed border-white text-xs">RBTRIP</p>
                                <i class="fa-regular fa-copy text-xl"></i>
                            </div>
                        </div>
                    </div>

                    <!-- offer card one  -->
                    <div class="h-36 w-64 rounded-xl bg-gradient-to-r from-blue-800 to-blue-500 flex p-3 cursor-pointer flex-shrink-0">
                        <div class="h-full grid place-content-center px-2">
                            <img class="rounded-full w-24" src="./assets/offer1.png" alt="">
                        </div>
                        <div class="flex flex-col gap-2">
                            <p class="text-xs px-1 py-[1px] bg-[#ffffff4c] rounded-full w-10 grid place-content-center">BUS</p>
                            <h3 class="font-bold text-base leading-5">Save up to Rs 250 on bus tickets</h3>
                            <p class="text-xs">Valid till 30 Nov</p>
                            <div class="flex gap-3 items-center">
                                <p class="grid place-content-center bg-[#ffffff4c] h-6 font-semibold px-2 rounded-sm border border-dashed border-white text-xs">FIRST</p>
                                <i class="fa-regular fa-copy text-xl"></i>
                            </div>
                        </div>
                    </div>

                    <!-- offer card two  -->
                    <div class="h-36 w-64 rounded-xl bg-gradient-to-r from-red-800 to-red-500 flex p-3 cursor-pointer flex-shrink-0">
                        <div class="h-full grid place-content-center px-2">
                            <img class="rounded-full w-24" src="./assets/offer2.png" alt="">
                        </div>
                        <div class="flex flex-col gap-2">
                            <p class="text-xs px-1 py-[1px] bg-[#ffffff4c] rounded-full w-10 grid place-content-center">BUS</p>
                            <h3 class="font-bold text-base leading-5">Save up to Rs 300 on AP, TS routes</h3>
                            <p class="text-xs">Valid till 30 Nov</p>
                            <div class="flex gap-3 items-center">
                                <p class="grid place-content-center bg-[#ffffff4c] h-6 font-semibold px-2 rounded-sm border border-dashed border-white text-xs">SUPERHIT</p>
                                <i class="fa-regular fa-copy text-xl"></i>
                            </div>
                        </div>
                    </div>

                    <!-- offer card three  -->
                    <div class="h-36 w-64 rounded-xl bg-gradient-to-r from-green-800 to-green-500 flex p-3 cursor-pointer flex-shrink-0">
                        <div class="h-full grid place-content-center px-2">
                            <img class="rounded-full w-24" src="./assets/offer3.png" alt="">
                        </div>
                        <div class="flex flex-col gap-2">
                            <p class="text-xs px-1 py-[1px] bg-[#ffffff4c] rounded-full w-10 grid place-content-center">BUS</p>
                            <h3 class="font-bold text-base leading-5">Save up to Rs 300 on RJ,MH, Goa, MP,</h3>
                            <p class="text-xs">Valid till 30 Nov</p>
                            <div class="flex gap-3 items-center">
                                <p class="grid place-content-center bg-[#ffffff4c] h-6 font-semibold px-2 rounded-sm border border-dashed border-white text-xs">BUS300</p>
                                <i class="fa-regular fa-copy text-xl"></i>
                            </div>
                        </div>
                    </div>

                    <!-- offer card four  -->
                    <div class="h-36 w-64 rounded-xl bg-gradient-to-r from-sky-800 to-sky-500 flex p-3 cursor-pointer flex-shrink-0">
                        <div class="h-full grid place-content-center px-2">
                            <img class="rounded-full w-24" src="./assets/offer4.png" alt="">
                        </div>
                        <div class="flex flex-col gap-2">
                            <p class="text-xs px-1 py-[1px] bg-[#ffffff4c] rounded-full w-10 grid place-content-center">BUS</p>
                            <h3 class="font-bold text-base leading-5">Save up to Rs 200 in Kerala routes.</h3>
                            <p class="text-xs">Valid till 30 Nov</p>
                            <div class="flex gap-3 items-center">
                                <p class="grid place-content-center bg-[#ffffff4c] h-6 font-semibold px-2 rounded-sm border border-dashed border-white text-xs">RBTRIP</p>
                                <i class="fa-regular fa-copy text-xl"></i>
                            </div>
                        </div>
                    </div>


                </div>
            </div>
        </div>    
    </section>
    <!-- ------------------------------- offers section ends here -------------------- -->


    <!-- --------------------- other services section starts here ----------------------  -->
    <section class="flex justify-center bg-white  my-20 md:mt-0">
        <div class="flex w-full mx-6 md:mx-0 md:w-[80%] max-w-[1300px] justify-between">
            <!-- left side content section starts here  -->
            <div class="w-full lg:w-1/2 flex flex-col justify-between items-center md:items-start">
            <div>
                <!-- heading  -->
                <h1 class="text-2xl sm:text-3xl text-center md:text-left md:text-[2.5rem]">NOW, <span class="font-bold">GET MORE THAN JUST BUS</span> TICKETS WITH REDBUS!</h1>

                <!-- left side nav buttons  -->
                <div class="w-full md:w-[480px] h-14 flex items-center border-b border-gray-200 justify-center text-left md:justify-between my-6">
                    <button class="h-full flex gap-3 px-4 py-[0.8rem] rounded-t-lg items-center border-b-2 border-main-color">
                        <svg class="fill-main-color h-full" viewBox="0 0 35 20">
                            <path d="M16.3867 14.881L16.3002 14.7492L16.1873 14.8594C15.6684 15.365 15.0775 15.7819 14.4314 16.0982C13.8116 16.4026 13.1535 16.6086 12.4737 16.7117V10.6877L17.0328 6.13978C17.3091 6.53514 17.5421 6.96166 17.727 7.40495L17.7847 7.54153L17.9144 7.46725L17.9384 7.45288C17.9528 7.44329 17.9697 7.4361 17.9841 7.42652C18.5125 7.13418 19.0962 6.94249 19.7208 6.85383L19.8865 6.82987L19.8241 6.67652C19.1635 5.02077 18.0345 3.60942 16.5572 2.59105C15.0439 1.55112 13.2736 1 11.4336 1C9.59355 1 7.84242 1.54393 6.33871 2.57668C4.86863 3.58307 3.73964 4.98243 3.07186 6.6238L3.0022 6.79633L3.18716 6.80351C3.86695 6.83466 4.50351 6.97604 5.08001 7.22764L5.19771 7.27796L5.25056 7.16054C5.4163 6.80351 5.61327 6.46086 5.83667 6.13738L10.3958 10.6853V16.7093C9.15877 16.52 7.99856 15.9928 7.03532 15.1781L6.93203 15.0919L6.84795 15.1973C6.47563 15.6645 6.01683 16.0503 5.48596 16.3427C5.44753 16.3642 5.4091 16.3858 5.35865 16.4097L5.19291 16.496L5.32983 16.623C7.00169 18.1565 9.16838 19 11.4336 19C13.814 19 16.0624 18.0799 17.7655 16.405L17.8832 16.2899L17.7439 16.2013C17.201 15.861 16.7446 15.4153 16.3867 14.8762V14.881ZM15.606 4.63978L11.436 8.79952L7.26351 4.63978C7.82801 4.20128 8.45255 3.85623 9.12274 3.61422C9.86258 3.34585 10.6409 3.21166 11.4336 3.21166C12.2262 3.21166 13.0045 3.34824 13.7444 3.61422C14.4146 3.85623 15.0391 4.20128 15.6036 4.63978H15.606Z"/>
                            <path d="M2.13749 8.92406V8.00873H0.0812988V16.3043H2.22877V12.2763C2.22877 11.5119 2.42334 10.9225 2.81008 10.5247C3.19441 10.1269 3.74209 9.92566 4.4339 9.92566C4.5564 9.92566 4.69572 9.94004 4.84706 9.96879L5.00319 9.99754V7.92007H4.87108C3.64361 7.92007 2.72841 8.25793 2.13749 8.92406Z" />
                            <path d="M23.7708 4.88175H23.6387V8.80907C23.3624 8.55028 23.0454 8.34661 22.6874 8.20044C22.231 8.01354 21.7218 7.92009 21.1741 7.92009C20.3814 7.92009 19.6584 8.09741 19.0218 8.44725C18.3853 8.79948 17.8785 9.30028 17.5157 9.94245C17.1554 10.5822 16.9705 11.3274 16.9705 12.1589C16.9705 12.9904 17.153 13.738 17.5157 14.3825C17.8785 15.0271 18.3853 15.5327 19.0218 15.8849C19.656 16.2348 20.3814 16.4121 21.1741 16.4121C21.741 16.4121 22.2695 16.3115 22.7403 16.1174C23.1078 15.964 23.4345 15.7484 23.7131 15.4776V16.3091H25.7837V4.88175H23.7684H23.7708ZM23.6699 12.1589C23.6699 12.6357 23.569 13.0599 23.3696 13.4193C23.1703 13.7763 22.8988 14.0567 22.5601 14.2484C22.219 14.4425 21.8299 14.5407 21.4023 14.5407C20.9748 14.5407 20.5856 14.4425 20.2469 14.2484C19.9082 14.0567 19.6344 13.7763 19.4374 13.4193C19.238 13.0599 19.1371 12.6357 19.1371 12.1589C19.1371 11.6821 19.238 11.2579 19.4374 10.8985C19.6368 10.5415 19.9082 10.2611 20.2469 10.0695C20.588 9.87536 20.9772 9.77712 21.4023 9.77712C21.8275 9.77712 22.219 9.87536 22.5601 10.0695C22.8988 10.2611 23.1727 10.5415 23.3696 10.8985C23.569 11.2579 23.6699 11.6821 23.6699 12.1589Z"/>
                            <path d="M34.3807 9.96639C34.0228 9.32182 33.5184 8.81384 32.8818 8.45681C32.2477 8.10218 31.5174 7.92007 30.7151 7.92007C29.9129 7.92007 29.161 8.10218 28.51 8.464C27.8591 8.82582 27.3402 9.3362 26.9751 9.98077C26.6076 10.6253 26.4226 11.3562 26.4226 12.1589C26.4226 12.9616 26.6148 13.7092 26.9919 14.3538C27.369 14.9983 27.9119 15.5087 28.6061 15.8705C29.2955 16.23 30.1026 16.4121 31.0034 16.4121C31.7096 16.4121 32.3558 16.2971 32.9227 16.0718C33.4944 15.8442 33.9724 15.5015 34.3471 15.0558L34.4192 14.9696L34.3447 14.8857L33.3334 13.7284L33.2398 13.6205L33.1413 13.7212C32.596 14.2747 31.8922 14.555 31.049 14.555C30.3885 14.555 29.8288 14.3897 29.3844 14.0614C28.988 13.7691 28.7262 13.3737 28.6013 12.8897H34.878L34.8876 12.7699C34.9092 12.5231 34.9188 12.3362 34.9188 12.202C34.9188 11.361 34.7387 10.6086 34.3832 9.964L34.3807 9.96639ZM32.8362 11.3801H28.5797C28.683 10.8913 28.9136 10.4912 29.2691 10.1892C29.6606 9.85617 30.1459 9.68604 30.7151 9.68604C31.2844 9.68604 31.7817 9.85617 32.166 10.194C32.5167 10.5007 32.7425 10.8985 32.8362 11.3801Z"/>
                        </svg>
                        <p class="text-main-color font-bold">Cab/Bus Rental</p>
                    </button>
                    <div class="h-[50%] w-[1px] bg-gray-300 rounded-full mx-3"></div>
                    <button class="h-full flex gap-3 px-4 py-[0.8rem] group hover:bg-gray-200 rounded-t-lg items-center ">
                        <svg class="fill-gray-600 group-hover:fill-main-color h-full" viewBox="0 0 35 20">
                            <path d="M34.6657 13.3366L33.8769 14.3512H33.4167L33.5463 10.8389C33.5572 10.5179 33.5077 10.1979 33.4006 9.89748L30.9659 2.99232C30.8016 2.53105 30.5088 2.13359 30.1264 1.85262C29.744 1.57164 29.2901 1.42044 28.8247 1.41904H24.6508L23.8934 0.518577C23.7561 0.355357 23.5879 0.224779 23.3996 0.135409C23.2113 0.0460392 23.0073 -0.000151152 22.8009 4.79963e-07H20.718C20.4128 -0.000254262 20.1151 0.100901 19.8669 0.289128C19.6187 0.477356 19.4324 0.743237 19.3342 1.04944L19.2155 1.41904H0V2.8851H28.8276C29.0108 2.88542 29.1897 2.94459 29.3405 3.05479C29.4913 3.165 29.6071 3.32106 29.6725 3.50239L32.1072 10.4067C32.1493 10.5254 32.1684 10.6519 32.1633 10.7787L32.0132 14.862C32.0047 15.1089 31.906 15.3425 31.7379 15.5137C31.5698 15.6849 31.3455 15.7802 31.1123 15.7794H27.9282C27.7499 15.7796 27.5756 15.7239 27.4273 15.6191C27.2789 15.5143 27.1633 15.3652 27.095 15.1907L26.4912 13.6475C26.3343 13.244 26.0676 12.8992 25.7251 12.657C25.3825 12.4147 24.9797 12.2859 24.5678 12.2871H24.5612L5.85336 12.3643C5.46486 12.3641 5.08415 12.4798 4.75481 12.6981C4.42547 12.9164 4.1608 13.2286 3.99109 13.5989L3.6903 14.2447C3.61545 14.4045 3.50013 14.539 3.35724 14.6333C3.21434 14.7276 3.04951 14.7779 2.88116 14.7787H0V16.2447H2.88116C3.24969 16.243 3.61246 16.1477 3.93894 15.9665C4.26541 15.7854 4.54606 15.5238 4.75727 15.2038C4.51709 16.1252 4.61461 17.1088 5.03028 17.9572C5.44594 18.8056 6.14901 19.4562 6.99847 19.7784C7.84793 20.1006 8.78095 20.0705 9.61041 19.6944C10.4399 19.3182 11.1044 18.6237 11.4707 17.7501H9.84299C9.54763 18.1021 9.15824 18.3506 8.72649 18.4627C8.29474 18.5748 7.84102 18.5452 7.42552 18.3778C7.01002 18.2104 6.65237 17.9131 6.40002 17.5254C6.14766 17.1377 6.01252 16.6779 6.01252 16.2069C6.01252 15.7359 6.14766 15.2761 6.40002 14.8884C6.65237 14.5007 7.01002 14.2035 7.42552 14.0361C7.84102 13.8687 8.29474 13.839 8.72649 13.9511C9.15824 14.0632 9.54763 14.3117 9.84299 14.6637H11.4686C11.3386 14.3571 11.1708 14.0702 10.9697 13.8103L12.4809 13.8034C12.2771 14.0648 12.1076 14.3542 11.9769 14.6637H13.6047C13.8101 14.4187 14.0621 14.2226 14.3443 14.0883C14.6264 13.954 14.9322 13.8845 15.2415 13.8845C15.5508 13.8845 15.8566 13.954 16.1388 14.0883C16.4209 14.2226 16.673 14.4187 16.8784 14.6637H18.5069C18.3718 14.3453 18.1961 14.048 17.9847 13.7802L19.5425 13.7732C19.3284 14.0427 19.1507 14.3424 19.0145 14.6637H20.6452C20.9406 14.3115 21.3301 14.0627 21.762 13.9505C22.1939 13.8382 22.6479 13.8678 23.0636 14.0352C23.4793 14.2026 23.8371 14.5 24.0896 14.8879C24.3421 15.2757 24.4773 15.7357 24.4773 16.2069C24.4773 16.6781 24.3421 17.1381 24.0896 17.526C23.8371 17.9139 23.4793 18.2112 23.0636 18.3786C22.6479 18.546 22.1939 18.5756 21.762 18.4633C21.3301 18.3511 20.9406 18.1023 20.6452 17.7501H19.0167C19.3504 18.5426 19.9307 19.1896 20.6607 19.5831C21.3906 19.9767 22.226 20.0928 23.027 19.9121C23.8281 19.7314 24.5463 19.2649 25.0617 18.5904C25.577 17.916 25.8583 17.0746 25.8583 16.2069C25.8583 16.0716 25.8512 15.9363 25.8372 15.8018C26.0154 16.2315 26.3079 16.5968 26.679 16.8531C27.0502 17.1094 27.4837 17.2455 27.9267 17.2447H31.1123C31.5564 17.2461 31.9913 17.1099 32.3633 16.8528C32.7353 16.5958 33.0283 16.2291 33.2062 15.798H33.9301L34.6672 16.6367C34.693 16.6659 34.7265 16.6862 34.7633 16.695C34.8001 16.7038 34.8386 16.7007 34.8738 16.6861C34.9089 16.6714 34.9391 16.646 34.9604 16.613C34.9818 16.58 34.9933 16.5409 34.9934 16.5009L35 13.4662C35.0005 13.4248 34.9889 13.3842 34.9667 13.3501C34.9445 13.316 34.9129 13.2901 34.8762 13.2758C34.8395 13.2616 34.7995 13.2598 34.7618 13.2706C34.7241 13.2815 34.6905 13.3046 34.6657 13.3366Z"  />
                            <path d="M15.2441 18.5273C14.9346 18.5275 14.6286 18.4581 14.3464 18.3236C14.0641 18.1892 13.8121 17.9926 13.6069 17.7472H11.9784C12.2594 18.416 12.7173 18.9842 13.2968 19.3829C13.8762 19.7817 14.5524 19.9939 15.2434 19.9939C15.9343 19.9939 16.6105 19.7817 17.19 19.3829C17.7694 18.9842 18.2274 18.416 18.5083 17.7472H16.8806C16.6755 17.9926 16.4235 18.189 16.1414 18.3235C15.8593 18.458 15.5535 18.5274 15.2441 18.5273Z"  />
                            <path d="M22.9757 16.2039C22.9757 16.0095 22.9028 15.8231 22.7731 15.6857C22.6433 15.5482 22.4673 15.4709 22.2838 15.4709H8.20576C8.02226 15.4709 7.84628 15.5482 7.71653 15.6857C7.58677 15.8231 7.51388 16.0095 7.51388 16.2039C7.51388 16.3983 7.58677 16.5848 7.71653 16.7223C7.84628 16.8598 8.02226 16.937 8.20576 16.937H22.2816C22.3727 16.9373 22.4629 16.9186 22.5471 16.8819C22.6313 16.8452 22.7078 16.7912 22.7723 16.7231C22.8368 16.655 22.8879 16.5741 22.9228 16.485C22.9578 16.3959 22.9757 16.3004 22.9757 16.2039Z"  />
                            <path d="M0 10.3448V6.26733H1.28678V7.45598L1.09483 7.11744C1.20858 6.8115 1.39342 6.5833 1.64935 6.43284C1.90529 6.27737 2.21573 6.19963 2.58067 6.19963V7.48607C2.51906 7.47604 2.46455 7.47102 2.41716 7.47102C2.3745 7.46601 2.3271 7.4635 2.27497 7.4635C2.00008 7.4635 1.77732 7.54375 1.6067 7.70424C1.43607 7.85971 1.35076 8.1155 1.35076 8.47159V10.3448H0Z"  />
                            <path d="M5.1224 10.4125C4.66741 10.4125 4.26929 10.3223 3.92804 10.1417C3.59154 9.95614 3.3285 9.70537 3.13891 9.3894C2.95407 9.06842 2.86165 8.7048 2.86165 8.29856C2.86165 7.89231 2.9517 7.53121 3.1318 7.21524C3.31665 6.89426 3.57021 6.646 3.8925 6.47046C4.21479 6.2899 4.57736 6.19963 4.98022 6.19963C5.35938 6.19963 5.70536 6.28238 6.01817 6.44789C6.33098 6.60838 6.57981 6.84661 6.76465 7.16258C6.94949 7.47855 7.04191 7.86222 7.04191 8.3136C7.04191 8.36376 7.03954 8.42144 7.0348 8.48664C7.03006 8.55183 7.02532 8.61202 7.02058 8.66719H3.9707V7.91488H6.30254L5.79068 8.12553C5.79542 7.93996 5.76224 7.77947 5.69115 7.64405C5.62479 7.50864 5.53 7.40332 5.40677 7.32809C5.28829 7.25285 5.14847 7.21524 4.98733 7.21524C4.82618 7.21524 4.684 7.25285 4.56077 7.32809C4.44228 7.40332 4.34986 7.51115 4.28351 7.65158C4.21715 7.78699 4.18398 7.94748 4.18398 8.13305V8.35122C4.18398 8.55183 4.22189 8.72486 4.29773 8.87031C4.3783 9.01576 4.49205 9.1286 4.63897 9.20885C4.7859 9.28408 4.96126 9.32169 5.16506 9.32169C5.35464 9.32169 5.51578 9.29411 5.64849 9.23894C5.78594 9.17876 5.92101 9.08848 6.05372 8.96811L6.76465 9.75051C6.57981 9.96617 6.35231 10.1317 6.08216 10.247C5.812 10.3574 5.49209 10.4125 5.1224 10.4125Z"  />
                            <path d="M9.34248 10.4125C8.99176 10.4125 8.67184 10.3273 8.38273 10.1568C8.09836 9.98121 7.87086 9.73797 7.70024 9.42702C7.52962 9.11105 7.44431 8.7349 7.44431 8.29856C7.44431 7.86724 7.52962 7.4961 7.70024 7.18515C7.87086 6.86918 8.09836 6.62593 8.38273 6.45541C8.67184 6.28489 8.99176 6.19963 9.34248 6.19963C9.67425 6.19963 9.95388 6.27486 10.1814 6.42532C10.4136 6.57578 10.589 6.80649 10.7075 7.11744C10.826 7.42839 10.8852 7.8221 10.8852 8.29856C10.8852 8.78505 10.8283 9.18377 10.7146 9.49472C10.6008 9.80568 10.4302 10.0364 10.2027 10.1868C9.97521 10.3373 9.68847 10.4125 9.34248 10.4125ZM9.62686 9.27656C9.77852 9.27656 9.9136 9.23894 10.0321 9.16371C10.1553 9.08848 10.2525 8.97814 10.3236 8.8327C10.3947 8.68223 10.4302 8.50419 10.4302 8.29856C10.4302 8.09293 10.3947 7.9199 10.3236 7.77947C10.2525 7.63402 10.1553 7.52368 10.0321 7.44845C9.9136 7.37322 9.77852 7.33561 9.62686 7.33561C9.47045 7.33561 9.33064 7.37322 9.20741 7.44845C9.08892 7.52368 8.99413 7.63402 8.92304 7.77947C8.85194 7.9199 8.8164 8.09293 8.8164 8.29856C8.8164 8.50419 8.85194 8.68223 8.92304 8.8327C8.99413 8.97814 9.08892 9.08848 9.20741 9.16371C9.33064 9.23894 9.47045 9.27656 9.62686 9.27656ZM10.4729 10.3448V9.64518L10.48 8.29856L10.4089 6.95193V4.76273H11.7596V10.3448H10.4729Z"  />
                            <path d="M12.6927 10.3448V5.07869H14.9676C15.4226 5.07869 15.8137 5.15643 16.1407 5.31191C16.4724 5.46738 16.7284 5.69308 16.9085 5.98898C17.0886 6.27987 17.1786 6.62593 17.1786 7.02716C17.1786 7.42338 17.0886 7.76693 16.9085 8.05782C16.7284 8.3437 16.4724 8.56437 16.1407 8.71985C15.8137 8.87031 15.4226 8.94554 14.9676 8.94554H13.4747L14.1003 8.32113V10.3448H12.6927ZM15.771 10.3448L14.534 8.42645H16.034L17.2782 10.3448H15.771ZM14.1003 8.47911L13.4747 7.79451H14.8823C15.1762 7.79451 15.3942 7.72681 15.5364 7.59139C15.6833 7.45598 15.7568 7.2679 15.7568 7.02716C15.7568 6.78141 15.6833 6.59083 15.5364 6.45541C15.3942 6.32 15.1762 6.25229 14.8823 6.25229H13.4747L14.1003 5.56769V8.47911Z"  />
                            <path d="M20.2097 10.3448V9.585L20.1173 9.39692V7.99764C20.1173 7.77195 20.0509 7.59891 19.9182 7.47855C19.7902 7.35316 19.5841 7.29047 19.2997 7.29047C19.1149 7.29047 18.9276 7.32307 18.7381 7.38827C18.5485 7.44845 18.3873 7.53372 18.2546 7.64405L17.7996 6.67358C18.0177 6.52312 18.2783 6.40777 18.5817 6.32752C18.8897 6.24226 19.1954 6.19963 19.4988 6.19963C20.1244 6.19963 20.6078 6.3526 20.9491 6.65853C21.295 6.95946 21.468 7.43341 21.468 8.08039V10.3448H20.2097ZM19.0722 10.4125C18.7641 10.4125 18.5035 10.3574 18.2902 10.247C18.0769 10.1367 17.9134 9.98623 17.7996 9.79565C17.6906 9.60506 17.6361 9.39191 17.6361 9.15619C17.6361 8.90542 17.6954 8.68976 17.8139 8.5092C17.9371 8.32364 18.1243 8.1832 18.3755 8.08791C18.6267 7.98761 18.9513 7.93745 19.3495 7.93745H20.2595V8.68223H19.5343C19.3163 8.68223 19.1623 8.71985 19.0722 8.79508C18.9869 8.87031 18.9442 8.97062 18.9442 9.096C18.9442 9.22139 18.9893 9.32169 19.0793 9.39692C19.1694 9.47216 19.2926 9.50977 19.449 9.50977C19.5959 9.50977 19.7286 9.47216 19.8471 9.39692C19.9703 9.31668 20.0604 9.19631 20.1173 9.03582L20.3021 9.56243C20.231 9.84329 20.0912 10.0564 19.8827 10.2019C19.6789 10.3423 19.4087 10.4125 19.0722 10.4125Z"  />
                            <path d="M22.3206 10.3448V6.26733H23.6714V10.3448H22.3206ZM22.996 5.81595C22.7496 5.81595 22.5505 5.74323 22.3988 5.59778C22.2472 5.45234 22.1713 5.27178 22.1713 5.05612C22.1713 4.84046 22.2472 4.65991 22.3988 4.51446C22.5505 4.36902 22.7496 4.2963 22.996 4.2963C23.2425 4.2963 23.4415 4.36651 23.5932 4.50694C23.7449 4.64236 23.8207 4.81789 23.8207 5.03356C23.8207 5.25925 23.7449 5.44732 23.5932 5.59778C23.4463 5.74323 23.2472 5.81595 22.996 5.81595Z"  />
                            <path d="M24.5492 10.3448V4.76273H25.9V10.3448H24.5492Z"  />
                        </svg>
                        <p class="">Cab/Bus Rental</p>
                    </button>
                </div>

                <!-- transports  -->
                <div>
                    <p class="mb-7">Rent Cabs, Tempo Travellers & Buses with best drivers</p>
                    <div class="flex flex-col gap-5">
                    <div class="flex gap-4 items-center">
                        <img class="w-20" src="./assets/ryde_car.svg" alt="">
                        <h3 class="font-bold">Outstation</h3>
                    </div>
                    <div class="flex gap-4 items-center">
                        <img class="w-20" src="./assets/ryde_car_hourly.svg" alt="">
                        <h3 class="font-bold">Hourly Rental</h3>
                    </div>
                    <div class="flex gap-4 items-center">
                        <img class="w-20" src="./assets/airport_transport.svg" alt="">
                        <h3 class="font-bold">Airport Transfers</h3>
                    </div>
                </div>
                </div>
            </div>   
                <!-- main button  -->
                <button class="font-bold text-base gap-3 bg-main-color text-white px-5 max-w-xs py-3 flex items-center rounded-xl mt-12">Book Cab / Bus Rental
                    <i class="fa-solid fa-arrow-right-long text-2xl"></i>
                </button>

            </div>
            <!-- left side content section ends here  -->


            <!-- right side image section starts here -->
            <div class="relative w-1/2 h-full hidden lg:inline-block">
                <svg class="float-right"  height="100%" viewBox="0 0 564 628" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <mask id="mask0_3718_198646" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="12" y="0" width="552" height="628">
                    <path d="M524 0H205.447C187.492 0 171.738 11.9634 166.916 29.2584L14.1456 577.258C7.03787 602.755 26.2081 628 52.6764 628H524C546.091 628 564 610.091 564 588V40C564 17.9086 546.091 0 524 0Z" fill="#F1F1F1"/>
                    </mask>
                    <g mask="url(#mask0_3718_198646)">
                    <path opacity="0.4" d="M-101.178 -214.402H564.553V755.535H-101.178V-214.402Z" fill="url(#paint0_linear_3718_198646)"/>
                    </g>
                    <defs>
                    <linearGradient id="paint0_linear_3718_198646" x1="383.275" y1="633.313" x2="-81.5339" y2="-44.2445" gradientUnits="userSpaceOnUse">
                    <stop stop-color="#BF849A"/>
                    <stop offset="0.0758" stop-color="#C48BA0"/>
                    <stop offset="0.1898" stop-color="#D1A0B1"/>
                    <stop offset="0.3271" stop-color="#E6C2CC"/>
                    <stop offset="0.461" stop-color="#FFE9EC"/>
                    <stop offset="0.6918" stop-color="#D5D7F0"/>
                    <stop offset="0.8876" stop-color="#B9CAF3"/>
                    <stop offset="1" stop-color="#AEC5F4"/>
                    </linearGradient>
                    </defs>
                    </svg>
                <img class="absolute bottom-24 right-16 scale-125 z-10" src="./assets/all-rides.svg" alt="">
            </div>
            <!-- right side image section ends here  -->

        </div>
    </section>
    <!-- --------------------- other services section ends here ----------------------  -->


    <!-- ---------------------- app install section starts here ---------------------- -->
    <section class="flex justify-center  my-20 md:my-40 ">
        <div class="flex flex-col w-full mx-6 md:mx-0 md:w-[80%] max-w-[1300px]  bg-main-color rounded-[2.5rem] bg-[url('./assets/appInstallbg.svg')] bg-center  bg-no-repeat bg-cover p-4 py-8 md:p-8">
            <h2 class="text-xl md:text-3xl text-white mb-7">ENJOY THE APP!</h2>

            <!-- main content section starts here -->
            <div class="flex flex-col md:flex-row text-gray-700 items-center gap-6 lg:gap-14">
                <!-- app features  -->
                <div class="flex flex-col px-8 py-10 bg-white rounded-xl gap-6 w-full md:w-auto drop-shadow-2xl">
                <div class="flex flex-col gap-3">
                    <div class="flex items-center gap-4">
                        <i class="fa-solid fa-circle-check text-green-500 text-xl"></i>
                        <p class="text-lg leading-none">Quick access</p>
                    </div>
                    <div class="flex items-center gap-4">
                        <i class="fa-solid fa-circle-check text-green-500 text-xl"></i>
                        <p class="text-lg leading-none">Superior live tracking</p>
                    </div>
                </div>
                <!-- rating  -->
                <div class="flex justify-between gap-8 items-center">
                    <div class="flex flex-col gap-1">
                        <p class="font-bold flex items-center gap-1 text-xl">4.5<i class="fa-solid fa-star text-sm"></i></p>
                        <p class="text-sm">50M+ downloads</p>
                        <p class="text-sm font-bold">Play Store</p>
                    </div>
                    <div class="w-[2px] h-[80%] rounded-full bg-gray-300"></div>
                    <div class="flex flex-col gap-1">
                        <p class="font-bold flex items-center gap-1 text-xl">4.6<i class="fa-solid fa-star text-sm"></i></p>
                        <p class="text-sm">50M+ downloads</p>
                        <p class="text-sm font-bold">App Store</p>
                    </div>
                </div>

                </div>

                <div class="flex gap-6 lg:gap-14 w-full md:w-auto justify-around">
                <!-- qr code -->
                <div class="w-[110px]">
                    <p class="text-white font-bold leading-5 mb-3">Scan to download</p>
                    <img src="./assets/qrCode.svg" alt="">
                </div>

                <!-- downloads  -->
                <div class="w-[150px] flex flex-col gap-4">
                    <p class="text-white font-bold leading-5 ">Download the App on</p>
                    <a href=""><img src="./assets/playStore.svg" alt=""></a>
                    <a href=""><img src="./assets/appStore.svg" alt=""></a>
                </div>
            </div>
            </div>
            <!-- main content section ends here -->

        </div>
    </section>
    <!-- ---------------------- app install section ends here ---------------------- -->


    <!-- ------------------- primo section starts here ---------------------  -->
    <section class="flex justify-center  my-20 md:my-40">
        <div class="flex flex-col w-full mx-6 md:mx-0 md:w-[90%] max-w-[1300px]">
            <div class="w-full flex justify-center">
                <img src="./assets/primoTopBanner.svg" alt="">
            </div>


            <!-- primo features card starts here -->
            <div class="flex text-white xl:justify-between justify-center flex-wrap gap-3 mt-6 md:mt-12">
                <div class="h-40 bg-gradient-to-r from-blue-800 to-purple-700 p-5 flex rounded-3xl gap-5 max-w-[370px] items-center justify-center">
                    <div class="py-2 w-[40%] h-full flex justify-center">
                        <img class="h-full" src="./assets/primoSubImg1.svg" alt="">
                    </div>
                    <div class="flex flex-col gap-1 w-[60%]">
                        <h3 class="font-bold text-xl">1 of 5 buses qualify</h3>
                        <p class="text-sm">Primo’s strict safety qualification ensures a safer travel for you</p>
                    </div>
                </div>
                <div class="h-40 bg-gradient-to-r from-blue-800 to-purple-700 p-5 flex rounded-3xl gap-5 max-w-[370px] items-center justify-center">
                    <div class="py-2 w-[40%] h-full flex justify-center">
                        <img class="h-full" src="./assets/primoSubImg2.svg" alt="">
                    </div>
                    <div class="flex flex-col gap-1 w-[60%]">
                        <h3 class="font-bold text-xl">Preferred by 90%</h3>
                        <p class="text-sm">90% of travellers re-book Primo buses for its punctuality and comfort</p>
                    </div>
                </div>
                <div class="h-40 bg-gradient-to-r from-blue-800 to-purple-700 p-5 flex rounded-3xl gap-5 max-w-[370px] items-center justify-center">
                    <div class="py-2 w-[40%] h-full flex justify-center">
                        <img class="h-full" src="./assets/primoSubImg3.svg" alt="">
                    </div>
                    <div class="flex flex-col gap-1 w-[60%]">
                        <h3 class="font-bold text-xl">9 Lac+ monthly travellers</h3>
                        <p class="text-sm">In 2022, 9 Lac+ people traveled with Primo every month</p>
                    </div>
                </div>
            </div>
            <!-- primo features card ends here  -->
        </div>
    </section>
    <!-- ------------------- primo section starts here ---------------------  -->


    <!-- ---------------------- partners section starts here ------------------ -->
    <section class="flex justify-center  my-20 md:my-40">
        <div class="flex flex-col w-full px-6 md:px-0 md:w-[80%] max-w-[1300px]">
            <h1 class="text-gray-700 text-2xl md:text-[2.5rem] mb-6 md:mb-14">PARTNERED WITH</h1>


            <!-- govt. partners starts here -->
            <div>
            <div class="flex items-center justify-between">
                <h2 class="text-xl md:text-3xl text-gray-600">25 RTCs</h2>
                <button class="text-black font-medium py-2 text-sm md:text-base  px-6 rounded-2xl border border-gray-500 hover:shadow-lg hover:shadow-gray-400/50">View All</button>
            </div>
            <div class="flex items-center justify-between mt-8 overflow-auto">
                <div class="p-1 flex flex-col items-center w-[8.5rem] cursor-pointer group lg:flex-shrink-0">
                    <div class="h-24 w-24 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/partner1.png" alt="">
                    </div>
                    <a class="mt-3 w-full py-[0.4rem] rounded-full group-hover:bg-gray-200 font-medium grid place-content-center" href="">APSRTC</a>
                </div>
                <div class="p-1 flex flex-col items-center w-[8.5rem] cursor-pointer group lg:flex-shrink-0">
                    <div class="h-24 w-24 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/partner2.svg" alt="">
                    </div>
                    <a class="mt-3 w-full py-[0.4rem] rounded-full group-hover:bg-gray-200 font-medium grid place-content-center" href="">GSRTC</a>
                </div>
                <div class="p-1 flex flex-col items-center w-[8.5rem] cursor-pointer group lg:flex-shrink-0">
                    <div class="h-24 w-24 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/partner3.png" alt="">
                    </div>
                    <a class="mt-3 w-full py-[0.4rem] rounded-full group-hover:bg-gray-200 font-medium grid place-content-center" href="">TSRTC</a>
                </div>
                <div class="p-1 flex flex-col items-center w-[8.5rem] cursor-pointer group lg:flex-shrink-0">
                    <div class="h-24 w-24 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/partner4.png" alt="">
                    </div>
                    <a class="mt-3 w-full py-[0.4rem] rounded-full group-hover:bg-gray-200 font-medium grid place-content-center" href="">MSRTC</a>
                </div>
                <div class="p-1 flex flex-col items-center w-[8.5rem] cursor-pointer group lg:flex-shrink-0">
                    <div class="h-24 w-24 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/partner5.svg" alt="">
                    </div>
                    <a class="mt-3 w-full py-[0.4rem] rounded-full group-hover:bg-gray-200 font-medium grid place-content-center" href="">Kerala RTC</a>
                </div>
                <div class="p-1 flex flex-col items-center w-[8.5rem] cursor-pointer group lg:flex-shrink-0">
                    <div class="h-24 w-24 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/partner6.png" alt="">
                    </div>
                    <a class="mt-3 w-full py-[0.4rem] rounded-full group-hover:bg-gray-200 font-medium grid place-content-center" href="">SBSTC</a>
                </div>
                <div class="p-1 flex flex-col items-center w-[8.5rem] cursor-pointer group lg:flex-shrink-0">
                    <div class="h-24 w-24 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/partner7.svg" alt="">
                    </div>
                    <a class="mt-3 w-full py-[0.4rem] rounded-full group-hover:bg-gray-200 font-medium grid place-content-center" href="">RSRTC</a>
                </div>
                <div class="p-1 flex flex-col items-center w-[8.5rem] cursor-pointer group lg:flex-shrink-0">
                    <div class="h-24 w-24 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/partner8.svg" alt="">
                    </div>
                    <a class="mt-3 w-full py-[0.4rem] rounded-full group-hover:bg-gray-200 font-medium grid place-content-center" href="">UPSRTC</a>
                </div>
            </div>
        </div>
            <!-- govt. partners ends here -->


            <!-- private bus operators starts here  -->
            <div class="mt-6 md:mt-14">
                <div class="flex items-center justify-between">
                    <h2 class="text-xl md:text-3xl text-gray-600">3500+ Private Bus Operators</h2>
                    <button class="text-black font-medium py-2 text-sm md:text-base  px-6 rounded-2xl border border-gray-500 hover:shadow-lg hover:shadow-gray-400/50">View All</button>
                </div>
                <div class="grid grid-cols-2 grid-rows-2 md:flex text-center md:text-left justify-between gap-6 text-sm md:text-base mt-8">
                    <div class="flex flex-col gap-2 md:gap-4 items-center md:items-start [&>*]:px-1 md:[&>*]:px-2 [&>*]:py-1 md:[&>*]:py-3 [&>*]:rounded-full">
                        <a class="hover:bg-gray-100" href="">SRS Travels</a>
                        <a class="hover:bg-gray-100" href="">Parveen Travels</a>
                        <a class="hover:bg-gray-100" href="">SRM Travels</a>
                        <a class="hover:bg-gray-100" href="">Eagle Travels</a>
                        <a class="hover:bg-gray-100" href="">Mahasagar Travels</a>
                    </div>
                    <div class="flex flex-col gap-2 md:gap-4 items-center md:items-start [&>*]:px-1 md:[&>*]:px-2 [&>*]:py-1 md:[&>*]:py-3 [&>*]:rounded-full">
                        <a class="hover:bg-gray-100" href="">SRS Travels</a>
                        <a class="hover:bg-gray-100" href="">Parveen Travels</a>
                        <a class="hover:bg-gray-100" href="">SRM Travels</a>
                        <a class="hover:bg-gray-100" href="">Eagle Travels</a>
                        <a class="hover:bg-gray-100" href="">Mahasagar Travels</a>
                    </div>
                    <div class="flex flex-col gap-2 md:gap-4 items-center md:items-start [&>*]:px-1 md:[&>*]:px-2 [&>*]:py-1 md:[&>*]:py-3 [&>*]:rounded-full">
                        <a class="hover:bg-gray-100" href="">SRS Travels</a>
                        <a class="hover:bg-gray-100" href="">Parveen Travels</a>
                        <a class="hover:bg-gray-100" href="">SRM Travels</a>
                        <a class="hover:bg-gray-100" href="">Eagle Travels</a>
                        <a class="hover:bg-gray-100" href="">Mahasagar Travels</a>
                    </div>
                    <div class="flex flex-col gap-2 md:gap-4 items-center md:items-start [&>*]:px-1 md:[&>*]:px-2 [&>*]:py-1 md:[&>*]:py-3 [&>*]:rounded-full">
                        <a class="hover:bg-gray-100" href="">SRS Travels</a>
                        <a class="hover:bg-gray-100" href="">Parveen Travels</a>
                        <a class="hover:bg-gray-100" href="">SRM Travels</a>
                        <a class="hover:bg-gray-100" href="">Eagle Travels</a>
                        <a class="hover:bg-gray-100" href="">Mahasagar Travels</a>
                    </div>
               
                </div>
            </div>
            <!-- private bus operators ends here  -->


        </div>
    </section>
    <!-- ---------------------- partners section ends here -------------------- -->


    <!-- -------------------------- FAQ scetion starts here ----------------------- -->
    <section class="flex justify-center  my-20 md:my-40">
        <div class="flex flex-col w-full px-6 md:px-0 md:w-[80%] max-w-[1300px]">
            <h1 class="text-gray-700 text-2xl md:text-[2.5rem] mb-6 md:mb-12">FREQUENTY ASKED QUESTIONS</h1>

            <!-- faq navigation buttons starts here  -->
            <div class="flex gap-6 text-sm md:text-base lg:text-lg">
                <a class="py-2 px-2 border-b-[3px] border-main-color text-main-color" href="">General</a>
                <a class="py-2 px-2 hover:border-b-[3px] border-gray-300" href="">Ticket-related</a>
                <a href="" class=" leading-none flex justify-center items-center gap-3 py-2 px-2 hover:border-b-[3px] border-gray-300 sm:hidden">More <i class="fa-solid fa-chevron-right"></i></a>
                <a class="hidden sm:inline-block py-2 px-2 hover:border-b-[3px] border-gray-300" href="">Payment</a>
                <a class="hidden sm:inline-block py-2 px-2 hover:border-b-[3px] border-gray-300" href="">Cancellation & Refund</a>
                <a class="hidden sm:inline-block py-2 px-2 hover:border-b-[3px] border-gray-300" href="">Insurance</a>
            </div>
            <!-- faq navigation buttons starts here  -->

            <!-- faq ans stats here  -->
            <div class="flex flex-col gap-6 md:gap-10 mt-11">

                <!-- 1st faq  -->
                <div class="p-4 md:p-7 cursor-pointer bg-white group hover:bg-slate-100 rounded-2xl border border-gray-100">
                    <!-- displayed part  -->
                    <div class="flex md:text-base text-sm justify-between items-center font-semibold gap-2">
                        <h3>Can I track the location of my booked bus online?</h3>
                        <i class="fa-solid fa-plus inline-block group-hover:hidden"></i>
                        <i class="fa-solid fa-minus hidden group-hover:inline-block"></i>
                    </div>

                    <!-- hidden content -->
                    <div class="text-xs md:text-sm mt-6 hidden group-hover:inline-block">
                        <p>Yes, you can track your <strong>bus online</strong> by using our bus tracking app feature called <a class="text-blue-500">Track My Bus</a>. This feature allows passengers and their families to track the live bus tracking location. You may follow your bus on a map and use the information to plan your trip to the boarding point and to get off at the correct stop. Family and friends may also check the bus position to plan pick-ups and ensure your safety.</p>
                    </div>
                </div>
                <!-- 1st faq ends here  -->

                <div class="p-4 md:p-7 cursor-pointer bg-slate-100 rounded-2xl border border-gray-100">
                    <!-- displayed part  -->
                    <div class="flex md:text-base text-sm justify-between items-center font-semibold gap-2">
                        <h3>What are the advantages of purchasing a bus ticket with redBus?</h3>
                        <i class="fa-solid fa-minus inline-block"></i>
                    </div>

                    <!-- hidden content -->
                    <div class="text-xs md:text-sm mt-6 inline-block">
                        <p>There are many advantages to purchasing online bus tickets with redBus. redBus is India’s most trusted bus ticket company, where you can book any type of private or Government owned buses. redBus allows you to find the different types of buses, choose the preferred bus seats, and your nearest boarding and dropping points. You can also filter the buses based on timings like morning, evening bus etc.</p>
                    </div>
                </div>


                <div class="p-4 md:p-7  cursor-pointer bg-white group hover:bg-slate-100 rounded-2xl border border-gray-100">
                    <!-- displayed part  -->
                    <div class="flex md:text-base text-sm justify-between items-center font-semibold gap-2">
                        <h3>Why book bus tickets online on redBus?</h3>
                        <i class="fa-solid fa-plus inline-block group-hover:hidden"></i>
                        <i class="fa-solid fa-minus hidden group-hover:inline-block"></i>
                    </div>

                    <!-- hidden content -->
                    <div class="text-xs md:text-sm mt-6 hidden group-hover:inline-block">
                        <p>Yes, you can track your <strong>bus online</strong> by using our bus tracking app feature called <a class="text-blue-500">Track My Bus</a>. This feature allows passengers and their families to track the live bus tracking location. You may follow your bus on a map and use the information to plan your trip to the boarding point and to get off at the correct stop. Family and friends may also check the bus position to plan pick-ups and ensure your safety.</p>
                    </div>
                </div>


                <div class="p-4 md:p-7  cursor-pointer bg-white group hover:bg-slate-100 rounded-2xl border border-gray-100">
                    <!-- displayed part  -->
                    <div class="flex md:text-base text-sm justify-between items-center font-semibold gap-2">
                        <h3>Do I need to create an account on the redBus site to book my bus ticket?</h3>
                        <i class="fa-solid fa-plus inline-block group-hover:hidden"></i>
                        <i class="fa-solid fa-minus hidden group-hover:inline-block"></i>
                    </div>

                    <!-- hidden content -->
                    <div class="text-xs md:text-sm mt-6 hidden group-hover:inline-block">
                        <p>Yes, you can track your <strong>bus online</strong> by using our bus tracking app feature called <a class="text-blue-500">Track My Bus</a>. This feature allows passengers and their families to track the live bus tracking location. You may follow your bus on a map and use the information to plan your trip to the boarding point and to get off at the correct stop. Family and friends may also check the bus position to plan pick-ups and ensure your safety.</p>
                    </div>
                </div>


                <div class="p-4 md:p-7  cursor-pointer bg-white group hover:bg-slate-100 rounded-2xl border border-gray-100">
                    <!-- displayed part  -->
                    <div class="flex md:text-base text-sm justify-between items-center font-semibold gap-2">
                        <h3>Does bus booking online cost me more?</h3>
                        <i class="fa-solid fa-plus inline-block group-hover:hidden"></i>
                        <i class="fa-solid fa-minus hidden group-hover:inline-block"></i>
                    </div>

                    <!-- hidden content -->
                    <div class="text-xs md:text-sm mt-6 hidden group-hover:inline-block">
                        <p>Yes, you can track your <strong>bus online</strong> by using our bus tracking app feature called <a class="text-blue-500">Track My Bus</a>. This feature allows passengers and their families to track the live bus tracking location. You may follow your bus on a map and use the information to plan your trip to the boarding point and to get off at the correct stop. Family and friends may also check the bus position to plan pick-ups and ensure your safety.</p>
                    </div>
                </div>


                <div class="p-4 md:p-7  cursor-pointer bg-white group hover:bg-slate-100 rounded-2xl border border-gray-100">
                    <!-- displayed part  -->
                    <div class="flex md:text-base text-sm justify-between items-center font-semibold gap-2">
                        <h3>How can I get the discounts on the bus booking?</h3>
                        <i class="fa-solid fa-plus inline-block group-hover:hidden"></i>
                        <i class="fa-solid fa-minus hidden group-hover:inline-block"></i>
                    </div>

                    <!-- hidden content -->
                    <div class="text-xs md:text-sm mt-6 hidden group-hover:inline-block">
                        <p>Yes, you can track your <strong>bus online</strong> by using our bus tracking app feature called <a class="text-blue-500">Track My Bus</a>. This feature allows passengers and their families to track the live bus tracking location. You may follow your bus on a map and use the information to plan your trip to the boarding point and to get off at the correct stop. Family and friends may also check the bus position to plan pick-ups and ensure your safety.</p>
                    </div>
                </div>


                <div class="p-4 md:p-7  cursor-pointer bg-white group hover:bg-slate-100 rounded-2xl border border-gray-100">
                    <!-- displayed part  -->
                    <div class="flex md:text-base text-sm justify-between items-center font-semibold gap-2">
                        <h3>What's New in Bus Booking on redBus?</h3>
                        <i class="fa-solid fa-plus inline-block group-hover:hidden"></i>
                        <i class="fa-solid fa-minus hidden group-hover:inline-block"></i>
                    </div>

                    <!-- hidden content -->
                    <div class="text-xs md:text-sm mt-6 hidden group-hover:inline-block">
                        <p>Yes, you can track your <strong>bus online</strong> by using our bus tracking app feature called <a class="text-blue-500">Track My Bus</a>. This feature allows passengers and their families to track the live bus tracking location. You may follow your bus on a map and use the information to plan your trip to the boarding point and to get off at the correct stop. Family and friends may also check the bus position to plan pick-ups and ensure your safety.</p>
                    </div>
                </div>


                <div class="p-4 md:p-7  cursor-pointer bg-white group hover:bg-slate-100 rounded-2xl border border-gray-100">
                    <!-- displayed part  -->
                    <div class="flex md:text-base text-sm justify-between items-center font-semibold gap-2">
                        <h3>Can I book a Government bus ticket on redBus?</h3>
                        <i class="fa-solid fa-plus inline-block group-hover:hidden"></i>
                        <i class="fa-solid fa-minus hidden group-hover:inline-block"></i>
                    </div>

                    <!-- hidden content -->
                    <div class="text-xs md:text-sm mt-6 hidden group-hover:inline-block">
                        <p>Yes, you can track your <strong>bus online</strong> by using our bus tracking app feature called <a class="text-blue-500">Track My Bus</a>. This feature allows passengers and their families to track the live bus tracking location. You may follow your bus on a map and use the information to plan your trip to the boarding point and to get off at the correct stop. Family and friends may also check the bus position to plan pick-ups and ensure your safety.</p>
                    </div>
                </div>


            </div>
            <!-- faq ans ends here  -->

        </div>
    </section>
    <!-- -------------------------- FAQ scetion starts here ----------------------- -->

    <!-- ----------------------- Global section starts here -------------------- -->
    <section class="flex justify-center my-20 mb-2 md:my-40 md:mb-32">
        <div class="flex flex-col w-full px-6 md:px-0 md:w-[80%] max-w-[1300px]">
            <h1 class="text-gray-700 text-2xl font-medium md:text-[2.5rem] mb-6 md:mb-12">GLOBAL PRESENCE</h1>
            <div class="flex gap-3 items-center justify-between mt-4 md:mt-8 overflow-auto">

                
                <div class="flex flex-col items-center w-40 cursor-pointer group lg:flex-shrink-0">
                    <div class="h-32 w-32 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/Colombia.svg" alt="">
                    </div>
                    <a class="mt-3 w-full rounded-full group-hover:bg-gray-200 py-2 px-4 font-semibold text-2xl grid place-content-center" href="">Colombia</a>
                </div>

                <div class="flex flex-col items-center w-40 cursor-pointer group lg:flex-shrink-0">
                    <div class="h-32 w-32 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/India.svg" alt="">
                    </div>
                    <a class="mt-3 w-full rounded-full group-hover:bg-gray-200 py-2 px-4 font-semibold text-2xl grid place-content-center" href="">India</a>
                </div>


                <div class="flex flex-col items-center w-40 cursor-pointer group lg:flex-shrink-0">
                    <div class="h-32 w-32 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/Indonesia.svg" alt="">
                    </div>
                    <a class="mt-3 w-full rounded-full group-hover:bg-gray-200 py-2 px-4 font-semibold text-2xl grid place-content-center" href="">Indonesia</a>
                </div>


                <div class="flex flex-col items-center w-40 cursor-pointer group lg:flex-shrink-0">
                    <div class="h-32 w-32 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/Malaysia.svg" alt="">
                    </div>
                    <a class="mt-3 w-full rounded-full group-hover:bg-gray-200 py-2 px-4 font-semibold text-2xl grid place-content-center" href="">Malaysia</a>
                </div>


                <div class="flex flex-col items-center w-40 cursor-pointer group lg:flex-shrink-0">
                    <div class="h-32 w-32 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/Peru.svg" alt="">
                    </div>
                    <a class="mt-3 w-full rounded-full group-hover:bg-gray-200 py-2 px-4 font-semibold text-2xl grid place-content-center" href="">Peru</a>
                </div>


                <div class="flex flex-col items-center w-40 cursor-pointer group lg:flex-shrink-0">
                    <div class="h-32 w-32 rounded-full overflow-hidden">
                        <img class="w-full h-full object-cover" src="./assets/Singapore.svg" alt="">
                    </div>
                    <a class="mt-3 w-full rounded-full group-hover:bg-gray-200 py-2 px-4 font-semibold text-2xl grid place-content-center" href="">Singapore</a>
                </div>


            </div>

        </div>
    </section>
    <!-- ----------------------- Global section ends here -------------------- -->

      <!-- up arrow  -->
      <section class="flex justify-center relative right-2 md:static mb-14">
        <div class="flex flex-col w-full px-6 md:px-0 md:w-[80%] max-w-[1300px]">
            <div class="flex justify-end">
                <a href="" class="text-2xl font-thin border text-gray-600 border-gray-400 rounded-xl py-3 px-2"><i class="fa-solid fa-arrow-up fa-bounce"></i></a>
            </div>
        </div>
    </section>


    <!-- ------------------- footer section starts here--------------------------  -->
    <footer class="flex flex-col bg-gray-100 py-16 items-center">
        <div class="flex flex-col-reverse md:text-base text-sm md:flex-col w-full px-6 md:px-0 md:w-[80%] max-w-[1300px]">

            <!-- footer upper part starts here  -->
            <div class="flex justify-between flex-col md:flex-row gap-6">
                <ul class="flex flex-col gap-2">
                    <li class="text-xl font-bold">Top RTCs</li>
                    <li><a href="">APSRTC</a></li>
                    <li><a href="">GSRTC</a></li>
                    <li><a href="">MSRTC</a></li>
                    <li><a href="">TNSTC</a></li>
                    <li><a href="">View All</a></li>
                </ul>


                <ul class="flex flex-col gap-2">
                    <li class="text-xl font-bold">Others</li>
                    <li><a href="">TSRTC</a></li>
                    <li><a href="">SBSTC</a></li>
                    <li><a href="">RSRTC</a></li>
                    <li><a href="">Kerala RTC</a></li>
                    <li><a href="">View All</a></li>
                </ul>


                <ul class="flex flex-col gap-2">
                    <li class="text-xl font-bold">Top bus routes</li>
                    <li><a href="">Hyderabad to Bangalore Bus</a></li>
                    <li><a href="">Bangalore to Chennai Bus</a></li>
                    <li><a href="">Pune to Bangalore Bus</a></li>
                    <li><a href="">Mumbai to Bangalore Bus</a></li>
                    <li><a href="">View All</a></li>
                </ul>


                <ul class="flex flex-col gap-2">
                    <li class="text-xl font-bold">Top cities</li>
                    <li><a href="">Hyderabad Bus Tickets</a></li>
                    <li><a href="">Bangalore Bus Tickets</a></li>
                    <li><a href="">Chennai Bus Tickets</a></li>
                    <li><a href="">Pune Bus Tickets</a></li>
                    <li><a href="">View All</a></li>
                </ul>


                <ul class="flex flex-col gap-2">
                    <li class="text-xl font-bold">redRail</li>
                    <li><a href="">Book Train Tickets</a></li>
                    <li><a href="">PNR Status</a></li>
                    <li><a href="">Live Train Status</a></li>
                    <li><a href="">Train Seat Availability</a></li>
                    <li><a href="">Trains between Stations</a></li>
                </ul>


            </div>
            <!-- footer upper part ends here  -->

            <hr class="my-8">
            <!-- footer bottom part starts here  -->
            <div class="flex justify-between flex-col md:flex-row gap-6">

                <div class="flex flex-col gap-2 md:w-[25%]">
                    <div>
                        <img class="w-28" src="./assets/redbus-logo.svg" alt="">
                    </div>
                    <p>redBus is the world's largest online bus ticket booking service trusted by over 25 million happy customers globally. redBus offers bus ticket booking through its website, iOS and Android mobile apps for all major routes.</p>
                </div>


                <ul class="flex flex-col gap-2">
                    <li class="text-xl font-bold">About redBus</li>
                    <li><a href="">About us</a></li>
                    <li><a href="">Investor Relations</a></li>
                    <li><a href="">Contact us</a></li>
                    <li><a href="">Mobile version</a></li>
                    <li><a href="">redBus on mobile</a></li>
                    <li><a href="">Sitemap</a></li>
                    <li><a href="">Offers</a></li>
                    <li><a href="">Careers</a></li>
                    <li><a href="">Values</a></li>
                </ul>


                <ul class="flex flex-col gap-2">
                    <li class="text-xl font-bold">Info</li>
                    <li><a href="">T&C</a></li>
                    <li><a href="">Privacy policy</a></li>
                    <li><a href="">FAQ</a></li>
                    <li><a href="">Blog</a></li>
                    <li><a href="">Bus operator registration</a></li>
                    <li><a href="">Agent registration</a></li>
                    <li><a href="">Insurance partner</a></li>
                    <li><a href="">User agreement</a></li>
                </ul>


                <ul class="flex flex-col gap-2">
                    <li class="text-xl font-bold">Global Sites</li>
                    <li><a href="">India</a></li>
                    <li><a href="">Singapore</a></li>
                    <li><a href="">Malaysia</a></li>
                    <li><a href="">Indonesia</a></li>
                    <li><a href="">Peru</a></li>
                    <li><a href="">Colombia</a></li>
                </ul>


                <ul class="flex flex-col gap-2">
                    <li class="text-xl font-bold">Our Partners</li>
                    <li><a href="">Goibibo Bus</a></li>
                    <li><a href="">Goibibo Hotels</a></li>
                    <li><a href="">Makemytrip Bus</a></li>
                    <li><a href="">Makemytrip Hotels</a></li>
                </ul>


            </div>
            <!-- footer bottom part ends here  -->


        </div>
    </footer>
    <!-- ------------------- footer section starts here--------------------------  -->

      
</body>
</html>