@extends('frontend.layout.navbar')
@section('title', 'Milestones')
@section('content')
    <div class="relative w-full h-full">
        <img src="{{ asset('img/banner.png') }}" class="absolute inset-0 object-cover w-full h-full">
        <div class="container relative inset-0 z-0 flex items-center mx-auto pt-[25rem] pb-[5rem] ">
            <div>
                <div class=" w-auto md:w-[30rem] h-44 p-4 bg-black bg-opacity-60 flex items-center justify-center border-l-4 "
                    style="border-color: #ffbd59;">
                    <div class="">
                        <p class="text-3xl font-bold text-white">About Us</p>
                        <p class="text-sm text-white">Home > About Us / Milestones and Development</p>
                    </div>

                </div>

            </div>
        </div>
    </div>
    <div class="container max-w-screen-xl p-5 mx-auto">
        <div class="flex flex-col items-center justify-center ">
            <img src="{{ asset('img/milestone/section-milestones.webp') }}">
            <p class="text-sm font-semibold md:text-3xl">Key Milestones in Our Journey</p>
        </div>


    </div>
    <div class="">

        <img src="{{ asset('img/milestone/img-timeline.webp') }}" class="object-contain w-full h-full ">

    </div>
@endsection