@section('title', 'Program Studi')

@extends('Frontend.Layouts.app')
@section('content')
<div class=" md:h-[957px] h-auto flex flex-col items-center md:flex-row justify-center md:justify-start py-8 md:py-[100px] px-4 md:px-[200px] md:bg-center bg-right-top bg-cover bg-no-repeat"
    style="background-image: url('{{ asset('./images/background/bg-1.png') }}');">
    <div class="  flex flex-col md:items-start justify-center items-center w-full md:w-[40%] w-[100%] mt-4 md:mt-0"
        data-aos="fade-up">

        <x-header-section subtext="BIAYA & PROGRAM STUDI  IBISA" subtext-color="#fe0002" title=" "
        title-color="#124185" />
        <div class="swiper mySwiper md:w-[1300px] w-full">
            <div class="swiper-wrapper space-x-[10px] pb-[20px] md:ps-[20px]">

                <!-- start card -->
                
                <div
                    class="swiper-slide bg-white shadow-lg rounded-lg p-5 w-full sm:w-[280px] md:w-[320px] flex flex-col space-y-4">
                    <!-- Judul -->
                    <h3 class="text-lg font-semibold text-primary font-poppins">S1 Informatika</h3>

                    <!-- Detail Biaya -->
                    <div class="text-sm font-dmsans text-gray-600 space-y-1">
                    <p>Biaya Registrasi Pendaftaran: <span class="text-primary font-medium">Rp. 150.000</span></p>
                    <p>Biaya  Awal: <span class="text-primary font-medium">Rp. 550.000</span></p>
                    <p>Biaya Bulanan: <span class="text-primary font-medium">Rp. 475.000</span></p>

                    </div>

                    <!-- Tombol -->
                    <div class="flex justify-between items-center mt-3 gap-3">
                        <a href="/pendaftaran" style="color:#fff"
                            class="bg-primary hover:bg-secondary  font-medium py-2 px-3 rounded-md text-sm transition-all w-full text-center">Daftar
                            Sekarang</a>
                        <a href="/brosur" style="color:#fff"
                            class="bg-yellow-400 hover:bg-primary  font-medium py-2 px-3 rounded-md text-sm transition-all w-full text-center">Informasi</a>
                    </div>
                </div>

                <div
                    class="swiper-slide bg-white shadow-lg rounded-lg p-5 w-full sm:w-[280px] md:w-[320px] flex flex-col space-y-4">
                    <!-- Judul -->
                    <h3 class="text-lg font-semibold text-primary font-poppins">S1 Sains Data</h3>

                    <!-- Detail Biaya -->
                    <div class="text-sm font-dmsans text-gray-600 space-y-1">
                    <p>Biaya Registrasi Pendaftaran: <span class="text-primary font-medium">Rp. 150.000</span></p>
                    <p>Biaya  Awal: <span class="text-primary font-medium">Rp. 550.000</span></p>
                    <p>Biaya Bulanan: <span class="text-primary font-medium">Rp. 475.000</span></p>

                    </div>

                    <!-- Tombol -->
                    <div class="flex justify-between items-center mt-3 gap-3">
                        <a href="/pendaftaran" style="color:#fff"
                            class="bg-primary hover:bg-secondary  font-medium py-2 px-3 rounded-md text-sm transition-all w-full text-center">Daftar
                            Sekarang</a>
                        <a href="/brosur" style="color:#fff"
                            class="bg-yellow-400 hover:bg-primary  font-medium py-2 px-3 rounded-md text-sm transition-all w-full text-center">Informasi</a>
                    </div>
                </div>

                <div
                    class="swiper-slide bg-white shadow-lg rounded-lg p-5 w-full sm:w-[280px] md:w-[320px] flex flex-col space-y-4">
                    <!-- Judul -->
                    <h3 class="text-lg font-semibold text-primary font-poppins">S1 Bisnis Digital</h3>

                    <!-- Detail Biaya -->
                    <div class="text-sm font-dmsans text-gray-600 space-y-1">
                    <p>Biaya Registrasi Pendaftaran: <span class="text-primary font-medium">Rp. 150.000</span></p>
                    <p>Biaya  Awal: <span class="text-primary font-medium">Rp. 550.000</span></p>
                    <p>Biaya Bulanan: <span class="text-primary font-medium">Rp. 475.000</span></p>

                    </div>

                    <!-- Tombol -->
                    <div class="flex justify-between items-center mt-3 gap-3">
                        <a href="/pendaftaran" style="color:#fff"
                            class="bg-primary hover:bg-secondary  font-medium py-2 px-3 rounded-md text-sm transition-all w-full text-center">Daftar
                            Sekarang</a>
                        <a href="/brosur" style="color:#fff"
                            class="bg-yellow-400 hover:bg-primary  font-medium py-2 px-3 rounded-md text-sm transition-all w-full text-center">Informasi</a>
                    </div>
                </div>

                <div
                    class="swiper-slide bg-white shadow-lg rounded-lg p-5 w-full sm:w-[280px] md:w-[320px] flex flex-col space-y-4">
                    <!-- Judul -->
                    <h3 class="text-lg font-semibold text-primary font-poppins">D3 Kebidanan</h3>

                    <!-- Detail Biaya -->
                    <div class="text-sm font-dmsans text-gray-600 space-y-1">
                    <p>Biaya Registrasi Pendaftaran: <span class="text-primary font-medium">Rp. 150.000</span></p>
                    <p>Biaya  Awal: <span class="text-primary font-medium">Rp. 550.000</span></p>
                    <p>Biaya Bulanan: <span class="text-primary font-medium">Rp. 800.000</span></p>

                    </div>

                    <!-- Tombol -->
                    <div class="flex justify-between items-center mt-3 gap-3">
                        <a href="/pendaftaran" style="color:#fff"
                            class="bg-primary hover:bg-secondary  font-medium py-2 px-3 rounded-md text-sm transition-all w-full text-center">Daftar
                            Sekarang</a>
                        <a href="/brosur" style="color:#fff"
                            class="bg-yellow-400 hover:bg-primary  font-medium py-2 px-3 rounded-md text-sm transition-all w-full text-center">Informasi</a>
                    </div>
                </div>
                <!-- end card -->

            </div>
            <br><br>
            <div class="swiper-pagination"></div>
        </div>


        <div data-aos="fade-up"
            class="flex md:items-center justify-center items-center flex-col md:w-[1200px] w-full pt-5">
            <div data-aos="fade-up" class="w-full h-[1px] bg-blue-900 my-4"></div>
            <p data-aos="fade-up"
                class="text-center md:text-start mb-5 text-[14px] font-dmsans md:text-[14px] lg:text-[16px]">
                Bersama  IBISA, kami hadir untuk membangun masa depan gemilang melalui program studi terbaik, pengajaran berkualitas, dan fasilitas modern yang dirancang untuk mendukung langkah suksesmu.                        </p>

            <x-button url="/pendaftaran">PENDAFTARAN ONLINE</x-button>
        </div>
    </div>
</div>
@endsection