@extends('layouts.landingPage.master')

@section('title')
    {{ __('message.Pelatihan') }}
@endsection

@section('content')
    <section class="relative pb-10 pt-20 lg:pt-48">
        <picture class="pointer-events-none absolute inset-x-0 top-0 -z-10 dark:hidden">
            <img src="{{ asset('') }}landing/img/bg-beranda.png" alt="gradient" class="w-full" />
        </picture>
        <picture class="pointer-events-none absolute inset-x-0 top-0 -z-10 hidden dark:block">
            <img src="{{ asset('') }}landing/img/gradient_dark.jpg" alt="gradient dark" class="w-full" />
        </picture>
        <div class="container">
            <h2 class="mb-4 mt-2 font-display text-3xl text-jacarta-700 dark:text-white"style="text-align: justify">
                {{ __('message.Pelatihan') }}
            </h2>
            <hr style="max-width: 10%; color:#BA3C3C; padding:10px;">
        </div>
    </section>
    <section class="relative py-16">
        <div class="container">
            <div class="flex">
                <div class="w-1/2">
                    <img src="{{ asset('') }}landing/img/service3.png" class=" px-5 inline-block rounded-2.5xl "
                        width="500" />
                </div>
                <div class="w-1/2">
                    <h2 class="mb-4 mt-2 font-display text-3xl text-jacarta-700 dark:text-white"style="text-align: justify">
                        {{ __('message.Pelatihan Pertapindo') }}
                    </h2>
                    <hr style="max-width: 10%; color:#BA3C3C; padding:10px;">

                    <div class="py-2 px-4">
                        <p style="text-align: justify">
                            {{ __('message.Kami dengan antusias mempersembahkan program kerja Pelatihan organisasi kami, yang bertujuan untuk memberdayakan dan meningkatkan keterampilan anggota kami. Program ini dirancang untuk memberikan pendidikan praktis dan berkelanjutan guna mendukung pertumbuhan profesional dan pribadi setiap individu dalam organisasi kami.') }}
                        </p>
                        <p class="py-4" style="text-align: justify">
                            {{ __('message.Melalui pelatihan yang komprehensif dan berfokus pada keahlian kunci, kami menyediakan kesempatan bagi anggota kami untuk mengasah keterampilan teknis, kepemimpinan, komunikasi, kolaborasi, dan manajemen waktu. Program ini mencakup serangkaian workshop, seminar, kursus, dan mentoring yang disampaikan oleh para ahli dan praktisi terkemuka di bidangnya.') }}
                        </p>
                    </div>
                </div>

            </div>
        </div>
    </section>
    <section class="bg-white relative py-16">
        <div class="container">
            <h2 class="mt-2 font-display text-3xl text-jacarta-700 dark:text-white"style="text-align: justify">
                {{ __('message.Galeri') }}
            </h2>
            <div class="flex flex-wrap py-10">
                <div class="w-1/3 py-5">
                    <div class="bg-light-base shadow-xl mx-4 rounded-xl max-w-sm dark:bg-gray-800 dark:border-gray-700">
                        <a href="#">
                            <img class="rounded-t-lg px-10 py-10" src="https://flowbite.com/docs/images/blog/image-1.jpg"
                                alt="">
                        </a>
                    </div>
                </div>
                <div class="w-1/3 py-5">
                    <div class="bg-light-base shadow-xl mx-4 rounded-xl max-w-sm dark:bg-gray-800 dark:border-gray-700">
                        <a href="#">
                            <img class="rounded-t-lg px-10 py-10" src="https://flowbite.com/docs/images/blog/image-1.jpg"
                                alt="">
                        </a>
                    </div>
                </div>
                <div class="w-1/3 py-5">
                    <div class="bg-light-base shadow-xl mx-4 rounded-xl max-w-sm dark:bg-gray-800 dark:border-gray-700">
                        <a href="#">
                            <img class="rounded-t-lg px-10 py-10" src="https://flowbite.com/docs/images/blog/image-1.jpg"
                                alt="">
                        </a>
                    </div>
                </div>

            </div>
        </div>
    </section>
@endsection