@extends('client.layouts.main')

@section('title', 'Skrining')

@section('content')
<!-- breadcrumb-area -->
<section class="breadcrumb-area d-flex align-items-center"
    style="background-image:url(client/img/testimonial/test-bg.jpg)">
    <div class="container">
        <div class="row">
            <div class="col-xl-6 offset-xl-3 col-lg-8 offset-lg-2">
                <div class="breadcrumb-wrap text-center">
                    <div class="breadcrumb-title mb-30">
                        <h2>Skrining Mandiri</h2>
                        <p class="text-dark fw-bold">Apakah anda memiliki kemungkinan terkena Hipogonadisme?</p>
                        <div class="slider-btn mt-25 ">
                            <a href="{{route('client.skrining.form')}}" class="btn ss-btn" data-animation="fadeInRight" data-delay=".8s">Mulai Skrining
                                <i class="fas fa-chevron-right"></i></a>
                        </div>
                    </div>
                    <p></p>
                </div>
            </div>
        </div>
    </div>
</section>

<section id="video-section" class="row mt-5" >
    <div class="mx-auto" style="display: grid; place-items: center;">
        <h5 style="width: 500px;" class="mb-2 text-center">{{\App\Models\SkriningVideo::get()[0]->judul}}</h5>

        <iframe  allow="fullscreen;" style="height: 300px; width: 620px; margin: auto !important;" class="mx-auto" src="{{\App\Models\SkriningVideo::get()[0]->link}}"></iframe>
    </div>
</section>

<!-- about-area -->
<section class="about-area about-p mt-50 pb-80 p-relative"
    style="background-image:url(img/an-bg/an-bg03.png); background-size: contain; background-repeat: no-repeat;background-position: center center;">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-12">
                <div class="about-content s-about-content pl-30">
                    <div class="section-title mb-10">
                        <span>Tahap Skrining</span>
                    </div>
                    <ul>
                        <li>
                            <div class="icon"><i class="fas fa-chevron-right"></i></div>
                            <div class="text">Kami akan mendeteksi kemungkinan Anda terkena Hipogonadisme.
                            </div>
                        </li>
                        <li>
                            <div class="icon"><i class="fas fa-chevron-right"></i></div>
                            <div class="text">Menanyakan soal kondisi seksual Anda.
                            </div>
                        </li>
                        <li>
                            <div class="icon"><i class="fas fa-chevron-right"></i></div>
                            <div class="text">Menjaga kerahasiaan informasi medis Anda.
                            </div>
                        </li>
                        <li>
                            <div class="icon"><i class="fas fa-chevron-right"></i></div>
                            <div class="text">Butuh waktu kurang dari 1 menit melakukan skrining ini.
                            </div>
                        </li>
                        <div></div>
                    </ul>
                </div>
            </div>

        </div>
    </div>
</section>
<!-- about-area-end -->

<!-- newslater-area -->
<section class="newslater-area pb-50"
    style="background-image: url(client/img/an-bg/an-bg06.png);background-position: center bottom; background-repeat: no-repeat;">
    <div class="container">
        <div class="row align-items-end justify-content-between">
            <div class="col-xl-6 col-lg-6 col-lg-6">
                <div class="section-title mb-100">
                    <span>Disclaimer</span>
                    <p>Proses skrining ini bukanlah pengganti konsultasi medis. Selalu konsultasi ke dokter Anda sebelum memutuskan perawatan terkait sebuah penyakit. Androlog Bercerita tidak memberikan saran medis, diagnosis, atau perawatan</p>
                </div>
            </div>
            <div class="col-xl-6 col-lg-6">
                <img src="{{asset('client/img/bg/news-illustration.png')}}">
            </div>
        </div>

    </div>
</section>
<!-- newslater-aread-end -->
<!-- breadcrumb-area-end -->
@endsection