CodeStore

Cards

Card with Background Image

The Card with title and description and background Image

This is a sample card with a background image. It includes a title, description, and a call-to-action button.
This is a sample card with a background image. It includes a title, description, and a call-to-action button.
HTML
        <div class="grid lg:grid-cols-2 gap-6">
    <div class="p-8 flex flex-col justify-between rounded-lg" style="background-image:url('https://images.unsplash.com/photo-1504253163759-c23fccaebb55?fm=jpg&ixid=M3wxMjA3fDB8MHxzZWFyY2h8M3x8Y2xvdWR8ZW58MHx8MHx8fDA%3D&ixlib=rb-4.1.0&q=60&w=3000'); background-size:cover;">
        <h5 class="mb-5 text-black">
            This is a sample card with a background image. It includes a title, description, and a call-to-action button.
        </h5>
        <button width="100%" class="text-[14px] p-2 brand-btn bg-[white] border border-grey-500 font-Inter font-[600]">Click Me</button>
    </div>
    <div class="p-8 flex flex-col justify-between rounded-lg" style="background-image:url('https://images.unsplash.com/photo-1509803874385-db7c23652552?fm=jpg&ixid=M3wxMjA3fDB8MHxzZWFyY2h8M3x8Y2xvdWQlMjBiYWNrZ3JvdW5kfGVufDB8fDB8fHww&ixlib=rb-4.1.0&q=60&w=3000'); background-size:cover;">
        <h5 class="mb-5 text-white">
            This is a sample card with a background image. It includes a title, description, and a call-to-action button.
        </h5>
        <button width="100%" class="text-[14px] p-2 brand-btn bg-[white] border border-grey-500 font-Inter font-[600]">Click Me</button>
    </div>
</div>
      

Hover Card

A minimal card with hover animation

Elevating brand visibility
Sustainable websites load faster and rank better, helping your brand stay visible and accessible to more people.
Boosting your conversions
Fast, lightweight websites with high UX reduce drop-offs and encourage visitors to stay, engage, and convert.
HTML
        <div class="flex lg:flex-row flex-col gap-5">
        <div class="flex lg:flex-row flex-col bg-white shadow-lg w-full border-b-[1.5px] border-[#C9F001] relative group overflow-hidden lg:min-h-[250px]">
            <div class="w-full p-8">
                <svg class="mx-auto mb-6" width="39" height="53" viewBox="0 0 39 53" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M32.55 5.41582C28.9077 1.85794 24.0957 -0.0325393 18.9965 0.0842023C14.1726 0.197466 9.62218 2.15947 6.18327 5.60931C2.74461 9.0589 0.796522 13.6155 0.697912 18.4402C0.5921 23.6156 2.55535 28.4758 6.22575 32.1248C7.06331 32.9574 7.52456 34.057 7.52456 35.2207V37.9577C7.52456 39.1772 8.06307 40.2711 8.91131 41.0225C8.07102 41.6579 7.52456 42.6623 7.52456 43.7947C7.52456 45.7123 9.08443 47.2721 11.002 47.2721H11.8102C12.2335 50.2173 14.7722 52.4883 17.8326 52.4883H21.0616C24.122 52.4883 26.6607 50.2173 27.084 47.2721H27.892C29.8095 47.2721 31.3694 45.7123 31.3694 43.7947C31.3694 42.6623 30.823 41.6579 29.9827 41.0225C30.8309 40.2711 31.3694 39.1772 31.3694 37.9577V35.2209C31.3694 34.0575 31.8321 32.9562 32.6727 32.1201C36.237 28.5741 38.2 23.855 38.2 18.8319C38.2 13.7395 36.1936 8.9747 32.55 5.41582ZM21.0614 50.7496H17.8324C15.7332 50.7496 13.9772 49.2538 13.5733 47.2721H25.3205C24.9166 49.2538 23.1605 50.7496 21.0614 50.7496ZM27.892 42.056C28.8505 42.056 29.6307 42.836 29.6307 43.7947C29.6307 44.7535 28.8505 45.5334 27.892 45.5334H26.2775H12.6162H11.0017C10.0432 45.5334 9.26303 44.7535 9.26303 43.7947C9.26303 42.836 10.0432 42.056 11.0017 42.056H11.6227H19.1985H27.271H27.892ZM31.4464 30.8876C30.2755 32.0525 29.6307 33.5915 29.6307 35.2209V37.9577C29.6307 39.2587 28.5721 40.3173 27.271 40.3173H20.0678V28.3824C20.1088 28.3883 20.1496 28.3948 20.192 28.3948C26.8346 28.3948 32.2388 22.9906 32.2388 16.348C32.2388 15.8679 31.8495 15.4787 31.3694 15.4787C25.014 15.4787 19.7961 20.4266 19.3562 26.672C19.3048 26.6625 19.2524 26.6561 19.1985 26.6561C19.1421 26.6561 19.0872 26.6623 19.0336 26.6727C18.6014 21.935 14.6083 18.2109 9.7598 18.2109C9.27967 18.2109 8.89045 18.6002 8.89045 19.0803C8.89045 24.2164 13.0688 28.3948 18.2049 28.3948C18.2474 28.3948 18.2881 28.3881 18.3291 28.3824V40.3173H11.6227C10.3216 40.3173 9.26303 39.2587 9.26303 37.9577V35.2207C9.26303 33.5905 8.61971 32.0533 7.45155 30.8918C4.12144 27.5808 2.34025 23.1715 2.43613 18.4757C2.61969 9.50351 10.067 2.03305 19.0373 1.82242C23.6625 1.71164 28.0304 3.43171 31.3351 6.65974C34.6409 9.88876 36.4616 14.2117 36.4616 18.8319C36.4613 23.3888 34.6804 27.6702 31.4464 30.8876ZM21.1011 26.6163C21.5366 21.6563 25.5003 17.6926 30.4603 17.2571C30.0249 22.2172 26.0612 26.1809 21.1011 26.6163ZM17.2792 26.5997C13.8403 26.1789 11.106 23.4445 10.6853 20.0058C14.1242 20.4268 16.8584 23.161 17.2792 26.5997Z" fill="#00C71C"/>
                </svg>
                <div class="border-t border-[#00000033] pt-6 text-center cardslide">
                    Elevating brand visibility
                </div>
            </div>
            <div class="card_text lg:absolute lg:py-0 py-12 flex items-center justify-center px-5 inset-x-0 w-full z-[10] h-[100%] lg:translate-y-[98%] lg:group-hover:translate-y-0 translate-y-0 transition ease-in-out delay-150 duration-300 bottom-0 bg-[#C9F001]" style="width: 100%;"> 
                Sustainable websites load faster and rank better, helping your brand stay visible and accessible to more people.
            </div>
        </div>
        <div class="flex lg:flex-row flex-col bg-white shadow-lg w-full border-b-[1.5px] border-[#C9F001] relative group overflow-hidden h-full lg:min-h-[250px]">
            <div class="w-full p-8">
                <svg class="mx-auto mb-6" width="47" height="54" viewBox="0 0 47 54" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M23.6287 40.1981C22.6294 39.2973 21.9694 38.7016 20.9197 38.7201C19.5674 38.7479 18.2663 39.7902 18.1362 40.9456C18.059 41.5927 18.2693 41.9823 18.5602 42.5212C18.6413 42.6716 18.7382 42.8512 18.8508 43.0739L18.851 43.0746C19.0675 43.5023 19.0957 43.8055 19.0259 43.9196C18.9618 44.0247 18.7301 44.1531 18.5258 44.2666C18.1228 44.49 17.6217 44.7682 17.3315 45.3324C16.8242 46.3065 17.337 47.4535 18.1241 47.998C18.7887 48.4608 19.5547 48.5597 20.2785 48.597C20.5204 48.6111 20.7792 48.6215 21.0505 48.6215C21.919 48.6215 22.9099 48.5149 23.8441 48.0803C25.211 47.4384 26.1065 46.1675 26.126 44.8427C26.1344 44.2829 26.0169 43.885 25.8492 43.3826C25.2813 41.6894 24.1655 40.6824 23.6287 40.1981ZM23.1112 46.5118C22.43 46.8287 21.5878 46.9388 20.3733 46.8683C19.9011 46.8435 19.4214 46.7914 19.1112 46.5757C18.9096 46.4362 18.8359 46.1923 18.8691 46.1279C18.921 46.0273 19.157 45.8962 19.3655 45.7806C19.739 45.5736 20.2036 45.3159 20.5039 44.8214C20.7967 44.3438 21.0156 43.5179 20.3963 42.2935C20.2756 42.0538 20.1714 41.8608 20.0838 41.6988C19.8432 41.2528 19.8449 41.2395 19.856 41.145C19.8818 40.9174 20.3953 40.4625 20.9528 40.4509C20.9565 40.4509 20.9602 40.4509 20.9642 40.4509C21.306 40.4509 21.6224 40.7203 22.4691 41.4834C22.9287 41.8982 23.7838 42.6702 24.2068 43.9315C24.3535 44.371 24.3982 44.5503 24.3943 44.8167C24.3834 45.5768 23.7405 46.2165 23.1112 46.5118Z" fill="#00C71C"/>
                    <path d="M46.4 30.2796C46.4 22.2022 42.2899 14.8424 35.4055 10.5924C35.4055 10.5924 35.4053 10.5924 35.4053 10.5921C35.2376 10.4885 35.058 10.3819 34.8604 10.2681C33.6659 4.85521 28.858 0.967773 23.2725 0.967773C17.6872 0.967773 12.8784 4.85619 11.6844 10.2696C7.54688 12.6748 4.19127 16.3706 2.21366 20.7228C0.841087 23.7381 0.14502 26.9534 0.14502 30.2796C0.14502 34.472 1.28162 38.5811 3.43138 42.1623C3.43188 42.1631 3.43237 42.1636 3.43286 42.1643C3.43385 42.1658 3.43487 42.1672 3.43561 42.169C3.4371 42.1715 3.43881 42.1742 3.44029 42.1766C7.60328 49.1043 15.2008 53.4073 23.2725 53.4073C29.8183 53.4073 36.0867 50.6127 40.4701 45.74C44.294 41.4863 46.4 35.9958 46.4 30.2796ZM23.2723 2.6995C28.1605 2.6995 32.3534 6.18423 33.2414 10.9851C33.2414 10.9854 33.2414 10.9854 33.2414 10.9854C33.2679 11.1272 33.2914 11.2696 33.3117 11.4133C33.3795 11.8949 33.4138 12.3753 33.4138 12.8408C33.4138 15.9511 32.0269 18.8184 29.6043 20.7562H24.0893C24.1504 20.6377 24.188 20.5051 24.188 20.3626V19.0111H24.9278C26.8386 19.0111 28.393 17.4565 28.393 15.5457C28.393 14.2102 27.6448 13.0164 26.4401 12.4307H26.4397C25.9615 12.1984 25.4527 12.0807 24.9276 12.0807H21.7164C20.7606 12.0807 19.9827 11.3028 19.9827 10.347C19.9827 9.78846 20.256 9.2606 20.7141 8.93484C21.0097 8.72434 21.3562 8.61326 21.7164 8.61326H23.322H24.9276C25.2927 8.61326 25.6434 8.72779 25.9422 8.94423C26.3993 9.27544 26.6613 9.78672 26.6613 10.347C26.6613 10.8251 27.0489 11.2127 27.527 11.2127C28.0052 11.2127 28.3928 10.8251 28.3928 10.347C28.3928 9.2418 27.8565 8.19351 26.9581 7.54222C26.362 7.1101 25.66 6.88178 24.9276 6.88178H24.1877V5.53023C24.1877 5.05209 23.8001 4.66448 23.322 4.66448C22.8439 4.66448 22.4562 5.05209 22.4562 5.53023V6.88178H21.7164C20.9944 6.88178 20.3005 7.10391 19.7103 7.52417C18.7969 8.17397 18.2514 9.22943 18.2514 10.347C18.2514 12.2578 19.8058 13.8122 21.7167 13.8122H24.9278C25.1885 13.8122 25.4425 13.8713 25.683 13.988C26.2868 14.2817 26.6615 14.8788 26.6615 15.5457C26.6615 16.5017 25.8836 17.2796 24.9278 17.2796H23.3222H22.014H21.7167C20.7609 17.2796 19.9829 16.5017 19.9829 15.5457C19.9829 15.0675 19.5953 14.6799 19.1172 14.6799C18.6391 14.6799 18.2514 15.0675 18.2514 15.5457C18.2514 17.4565 19.8058 19.0111 21.7167 19.0111H22.014H22.4565V20.3626C22.4565 20.5051 22.4943 20.6377 22.5552 20.7562H21.9887H17.1289H16.9385C16.4876 20.3946 16.0626 19.9933 15.6757 19.556C15.6755 19.5558 15.6752 19.5553 15.675 19.555C14.0343 17.7004 13.1307 15.3159 13.1307 12.8408C13.1307 12.2264 13.1891 11.6003 13.3041 10.9805V10.98C14.1938 6.18225 18.386 2.6995 23.2723 2.6995ZM23.2723 51.6758C16.0811 51.6758 9.54231 48.1788 5.55124 42.265C7.75394 41.6286 9.62047 40.5583 11.1093 39.0724C11.582 38.6032 12.1418 37.9536 12.2736 37.0888C12.3233 36.7636 12.3045 36.4637 12.2882 36.1991C12.2786 36.0464 12.2696 35.9023 12.2758 35.7821C12.3349 34.7301 13.5942 33.9781 14.134 33.7033C14.4184 33.5576 14.714 33.4243 15.0267 33.283C15.9414 32.8697 16.8873 32.4425 17.6528 31.6692C18.7454 30.5702 19.302 28.9706 19.3544 26.7785C19.3658 26.3006 18.9876 25.9039 18.5094 25.8925C18.037 25.8799 17.6348 26.2593 17.6234 26.7375C17.5828 28.441 17.1794 29.6897 16.4235 30.45C15.8823 30.9967 15.1202 31.341 14.3138 31.7054C13.9962 31.8488 13.668 31.9972 13.3469 32.1612C11.6196 33.0416 10.6252 34.2929 10.5471 35.6885C10.5352 35.9109 10.5486 36.1214 10.5602 36.3072C10.5723 36.5021 10.5839 36.6858 10.5621 36.8278C10.5065 37.1914 10.1738 37.5617 9.88787 37.845C8.5054 39.225 6.72615 40.1884 4.60013 40.7245C2.81695 37.5437 1.87627 33.9467 1.87627 30.2796C1.87627 27.2025 2.52013 24.2283 3.78955 21.4399L3.78983 21.4396C5.434 17.8216 8.10568 14.691 11.4079 12.4782C11.4042 12.5994 11.3994 12.7206 11.3994 12.8413C11.3994 15.7393 12.4571 18.531 14.3781 20.7028C14.3786 20.7032 14.3791 20.7035 14.3796 20.704C14.3954 20.7218 14.4125 20.7386 14.4286 20.7564H12.2654C11.7873 20.7564 11.3997 21.144 11.3997 21.6222C11.3997 22.1003 11.7873 22.4879 12.2654 22.4879H16.6367H17.1294H21.9892H29.9088H34.2801C34.7582 22.4879 35.1458 22.1003 35.1458 21.6222C35.1458 21.144 34.7582 20.7564 34.2801 20.7564H32.1209C34.0619 18.5993 35.1458 15.8153 35.1458 12.8411C35.1458 12.7213 35.1431 12.6006 35.1391 12.4794C41.1207 16.4646 44.669 23.0623 44.669 30.2796C44.669 35.2163 42.9699 39.9708 39.8658 43.7828C39.332 42.9044 39.1453 41.9389 39.3536 41.0324C39.5571 40.1449 40.0706 39.3296 40.6143 38.4663C40.7964 38.1772 40.9849 37.8781 41.162 37.5746C42.2011 35.7974 42.4841 34.2153 42.0032 32.8746C41.6428 31.8605 40.6955 31.0555 39.5896 30.8243C38.6773 30.6331 37.8195 30.8805 37.2347 31.503C36.8071 31.9599 36.6148 32.5056 36.4456 32.9869C36.4172 33.0681 36.3888 33.1489 36.3586 33.2301C35.455 35.6828 32.9723 37.3236 30.7053 36.9627C29.5435 36.7784 28.4571 35.9273 27.8701 34.7414C27.3724 33.7364 27.344 32.6836 27.7909 31.8548C28.0017 31.4657 28.3097 31.0897 28.6354 30.692C29.2729 29.9138 29.9951 29.0322 30.082 27.8447C30.1171 27.3678 29.7584 26.9532 29.2818 26.9183C28.8051 26.8787 28.3901 27.2418 28.3554 27.7185C28.3087 28.3591 27.8394 28.9315 27.2965 29.5944C26.9334 30.0375 26.5579 30.4958 26.2677 31.0318C25.5504 32.3628 25.569 33.9949 26.3187 35.5097C27.1503 37.1902 28.7274 38.4023 30.4344 38.6732C33.4895 39.1562 36.8043 37.0297 37.9835 33.8304C38.0164 33.7418 38.048 33.6518 38.0797 33.5615C38.2034 33.2101 38.3204 32.8779 38.4985 32.6876C38.7077 32.465 39.0149 32.4729 39.2353 32.5192C39.7387 32.6245 40.2171 33.0181 40.3729 33.4569C40.6735 34.2949 40.4362 35.3865 39.667 36.7014C39.5042 36.9804 39.332 37.254 39.1495 37.5439C38.5529 38.4913 37.936 39.4714 37.6664 40.6448C37.3178 42.1611 37.6869 43.7558 38.6788 45.1219C34.6533 49.2953 29.0814 51.6758 23.2723 51.6758Z" fill="#00C71C"/>
                </svg>
                <div class="border-t border-[#00000033] pt-6 text-center cardslide">
                    Boosting your conversions
                </div>
            </div>
            <div class="card_text font-[400] text-center lg:absolute lg:py-0 py-12 flex items-center justify-center px-5 inset-x-0 w-full z-[10] h-[100%] lg:translate-y-[98%] lg:group-hover:translate-y-0 translate-y-0 transition ease-in-out delay-150 duration-300 bottom-0 bg-[#C9F001]" style="width: 100%;"> 
                Fast, lightweight websites with high UX reduce drop-offs and encourage visitors to stay, engage, and convert.
            </div>
        </div>
    </div>
      

Case Study Single Card

Showcases a detailed project case study with title, summary, and key outcomes.

Turn Your Manifestation Into Reality!
We Are Ready To KickStart, Are You?
We offer a full suite of digital services. Let’s connect and create
something amazing together!
HTML
        <div class="lg:px-0 px-8 mb-12 lg:mt-0 mt-20">
        <FixedW>
            <div class="rounded-[10px] discover lg:pt-16 pt-8 pb-16 bg-[#1C9EDC] relative overflow-hidden text-white">
                <div class="flex justify-center flex-col items-center lg:px-0 px-6">
                    <div class="minitext font-inter">Turn Your Manifestation Into Reality!</div>
                    <div class="font-inter py-5 lg:text-[45px] text-[20px] font-[600] lg:leading-[44px] leading-[28px] text-white lg:pb-5 pb-8 text-center lg:px-20">
                        We Are Ready To KickStart, Are You?
                    </div>
                    <div class="tiny_text text-center lg:w-[80%] font-inter">We offer a full suite of digital services. Let’s connect and create<br> something amazing together!</div>
                    <div class="pt-10">
                        <button class="bg-[#1E1E1E] rounded-[5px] inline-flex gap-3 items-center text-center self-start text-[white] p-3">Contact Us Now</button>
                    </div>
                </div>
                <div class="empani"></div>
            </div>
        </FixedW>
    </div>
      

Blog card

Blogs listed with launch date, time, title, image, and CTA.

A Complete Guide to Testing Accommodations for GMAT, GRE, TOEFL, MCAT, LSAT, USMLE & OET
5 Min READ SEP 21, 2025

The 9 Website Types for Bussiness
in 2025

A Complete Guide to Testing Accommodations for GMAT, GRE, TOEFL, MCAT, LSAT, USMLE & OET
5 Min READ SEP 19, 2025

A Complete Guide to Testing Accommodations

A Complete Guide to Testing Accommodations for GMAT, GRE, TOEFL, MCAT, LSAT, USMLE & OET
5 Min READ JULY 04, 2025

Understanding the Mind: Insights from Clinical Neuropsychology

HTML
        <div class="grid gap-8 sm:grid-cols-1 lg:grid-cols-3">
            <div class="bg-white rounded-lg overflow-hidden">
                <img
                    src="https://images.unsplash.com/photo-1519389950473-47ba0277781c?fm=jpg&q=60&w=3000"
                    alt="A Complete Guide to Testing Accommodations for GMAT, GRE, TOEFL, MCAT, LSAT, USMLE & OET"
                    class="w-full h-52 object-cover"
                />
                <div class="py-5">
                    <div style={{ fontFamily: "Manrope" }} class="flex items-center space-x-3 text-[11px] font-[700] leading-[-1px] text-start">
                        <span class="text-[#757575]">5 Min READ</span>
                        <span></span>
                        <span class="text-[#1DA2C9]">SEP 21, 2025</span>
                    </div>
                    <h3 style={{ fontFamily: "Manrope" }} class="mt-3 font-semibold text-[18px] text-[#151515CC] hover:text-blue-600 transition-colors text-start tracking-[-0.5px]">
                        The 9 Website Types for Bussiness<br> in 2025
                    </h3>
                    <div class="mt-8">
                        <a href="#">
                            <div class="text-[15px] font-[700] text-[#333333] flex items-center gap-2" style={{ fontFamily: "Manrope"}}>
                                <svg width="21" height="21" viewBox="0 0 22 23" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <circle cx="11" cy="11.5" r="11" fill="#1DA2C9"/>
                                    <path d="M9.04954 15.0672L9.7858 15.8028L13.796 11.7939C13.8607 11.7297 13.912 11.6533 13.947 11.5692C13.982 11.485 14 11.3948 14 11.3037C14 11.2125 13.982 11.1223 13.947 11.0382C13.912 10.954 13.8607 10.8776 13.796 10.8134L9.7858 6.80249L9.05023 7.53806L12.8141 11.3026L9.04954 15.0672Z" fill="white"/>
                                </svg>
                                <span>
                                    Read More
                                </span>	
                            </div>
                        </a>
                    </div>
                </div>
            </div>
            <div class="bg-white rounded-lg overflow-hidden">
                <img
                    src="https://images.unsplash.com/photo-1506744038136-46273834b3fb?fm=jpg&q=60&w=3000"
                    alt="A Complete Guide to Testing Accommodations for GMAT, GRE, TOEFL, MCAT, LSAT, USMLE & OET"
                    class="w-full h-52 object-cover"
                />
                <div class="py-5">
                    <div style={{ fontFamily: "Manrope" }} class="flex items-center space-x-3 text-[11px] font-[700] leading-[-1px] text-start">
                        <span class="text-[#757575]">5 Min READ</span>
                        <span></span>
                        <span class="text-[#1DA2C9]">SEP 19, 2025</span>
                    </div>
                    <h3 style={{ fontFamily: "Manrope" }} class="mt-3 font-semibold text-[18px] text-[#151515CC] hover:text-blue-600 transition-colors text-start tracking-[-0.5px]">
                        A Complete Guide to Testing Accommodations
                    </h3>
                    <div class="mt-8">
                        <a href="#">
                            <div class="text-[15px] font-[700] text-[#333333] flex items-center gap-2" style={{ fontFamily: "Manrope"}}>
                                <svg width="21" height="21" viewBox="0 0 22 23" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <circle cx="11" cy="11.5" r="11" fill="#1DA2C9"/>
                                    <path d="M9.04954 15.0672L9.7858 15.8028L13.796 11.7939C13.8607 11.7297 13.912 11.6533 13.947 11.5692C13.982 11.485 14 11.3948 14 11.3037C14 11.2125 13.982 11.1223 13.947 11.0382C13.912 10.954 13.8607 10.8776 13.796 10.8134L9.7858 6.80249L9.05023 7.53806L12.8141 11.3026L9.04954 15.0672Z" fill="white"/>
                                </svg>
                                <span>
                                    Read More
                                </span>	
                            </div>
                        </a>
                    </div>
                </div>
            </div> 
            <div class="bg-white rounded-lg overflow-hidden">
                <img
                    src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?fm=jpg&q=60&w=3000"
                    alt="A Complete Guide to Testing Accommodations for GMAT, GRE, TOEFL, MCAT, LSAT, USMLE & OET"
                    class="w-full h-52 object-cover"
                />
                <div class="py-5">
                    <div style={{ fontFamily: "Manrope" }} class="flex items-center space-x-3 text-[11px] font-[700] leading-[-1px] text-start">
                        <span class="text-[#757575]">5 Min READ</span>
                        <span></span>
                        <span class="text-[#1DA2C9]">JULY 04, 2025</span>
                    </div>
                    <h3 style={{ fontFamily: "Manrope" }} class="mt-3 font-semibold text-[18px] text-[#151515CC] hover:text-blue-600 transition-colors text-start tracking-[-0.5px]">
                        Understanding the Mind: Insights from Clinical Neuropsychology
                    </h3>
                    <div class="mt-8">
                        <a href="#">
                            <div class="text-[15px] font-[700] text-[#333333] flex items-center gap-2" style={{ fontFamily: "Manrope"}}>
                                <svg width="21" height="21" viewBox="0 0 22 23" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <circle cx="11" cy="11.5" r="11" fill="#1DA2C9"/>
                                    <path d="M9.04954 15.0672L9.7858 15.8028L13.796 11.7939C13.8607 11.7297 13.912 11.6533 13.947 11.5692C13.982 11.485 14 11.3948 14 11.3037C14 11.2125 13.982 11.1223 13.947 11.0382C13.912 10.954 13.8607 10.8776 13.796 10.8134L9.7858 6.80249L9.05023 7.53806L12.8141 11.3026L9.04954 15.0672Z" fill="white"/>
                                </svg>
                                <span>
                                    Read More
                                </span>	
                            </div>
                        </a>
                    </div>
                </div>
            </div>   
        </div>