@extends('frontend.layouts.main-en')

@section('styles')
    <!-- AOS Animation CSS -->
    <link href="{{ asset('build/frontend/assets/css/aos.css') }}" rel="stylesheet" />
    <!-- Style CSS -->
    <link rel="stylesheet" href="{{ asset('build/frontend/assets/css/style.css') }}" />

    <!-- Swiper Slider -->
    <link rel="stylesheet" href="{{ asset('build/frontend/assets/css/swiper-bundle.min.css') }}" />
@endsection

@section('content')
    <div class="-mt-[82px] flex-grow overflow-x-hidden lg:-mt-[106px]">
        <div
            class="bg-[url(../build/frontend/assets/images/inner-page-hero-bg.png)] bg-cover bg-bottom bg-no-repeat pt-[82px] lg:pt-[106px]">
            <div class="relative">
                <div class="container">
                    <div class="relative w-full py-14 md:my-14 md:inline-block md:py-0 lg:my-[128px]">
                        <div class="heading relative mb-8 text-center lg:mb-0 lg:w-1/2 ltr:lg:text-left rtl:lg:text-right">
                            <h6>Member of the Investment Committee</h6>
                            <h4 class="!text-white">Milun Trivunac</h4>
                            <ul class="items-center justify-center pt-6 sm:flex lg:justify-start">
                                <li class="flex items-center justify-center">
                                </li>
                                <li>
                                </li>
                                <li>
                                </li>
                            </ul>
                        </div>
                        <div class="top-0 mt-6 ltr:right-0 rtl:left-0 md:mt-0 lg:absolute" data-aos="fade-left"
                            data-aos-duration="1000">
                            <img src="{{ asset('') }}build/frontend/assets/images/team/milun-trivunac.jpg"
                                alt="blog-detail-hero"
                                class="mx-auto h-80 rounded-[32px] object-cover sm:h-[400px] sm:w-[445px]" />
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <section class="bg-gradient-to-t from-white to-transparent py-14 dark:bg-none md:py-[100px]">
            <div class="container">
                <div class="prose max-w-full dark:prose-invert">
                    <h2>&nbsp;</h2>

                    <p>Milun Trivunac has over 20 years of experience both domestically and internationally in corporate
                    finance and the public sector. His expertise includes preparing due diligence reports, capital
                    valuation, and auditing financial statements for major companies in Serbia. In addition, he has worked
                    as a portfolio manager in two open-end investment funds in Serbia.</p>
                    <p>Throughout his career, he has held
                    senior positions in relevant ministries, ranging from advisor to Assistant Minister of Economy and State
                    Secretary, dealing with development financing. He currently serves as the President of the Assembly of
                    Elektromreža Srbije a.d. and a member of the Board of Directors of AMSS Insurance.</p>
                    <p>He graduated in
                    economics from the Anglo American University in Prague and earned his MBA from the Rochester Institute
                    of Technology in the USA. He holds a state portfolio manager license.</p>
                    <p>At Eclectica Capital a.d., he
                    serves as a member of the Investment Committee.</p>

                </div>
            </div>
        </section>

        @include('frontend.pages.en.team-slider')

    </div>
@endsection

@section('scripts')
    <!-- AOS Animation JS -->
    <script src="{{ asset('build/frontend/assets/js/aos.js') }}"></script>
    <!-- Custom Js -->
    <script src="{{ asset('build/frontend/assets/js/custom.js') }}"></script>


    <!-- Swiper Slider JS -->
    <script src="{{ asset('build/frontend/assets/js/swiper-bundle.min.js') }}"></script>

    <script>
        // Logo Slider
        var logoSwiper = new Swiper('.logo-slider', {
            loop: true,
            slidesPerView: 'auto',
            spaceBetween: 10,
            speed: 4000,
            autoplay: {
                delay: 0,
                disableOnInteraction: false,
            },
            breakpoints: {
                320: {
                    slidesPerView: 1.7,
                },
                600: {
                    slidesPerView: 2,
                },
                1000: {
                    slidesPerView: 3,
                },
                1142: {
                    slidesPerView: 5,
                },
            },
        });
    </script>
@endsection