@section('title', 'kontak')

@extends('Frontend.Layouts.app2')
@section('content')
<br><br>
    <x-header-section-page title="Contact {{ $settings['nama kampus'] ?? 'Nama kampus tidak tersedia' }}" breadcrumb-home="Home" breadcrumb-current="Contact Us" />

    <div data-aos="fade-up" class="py-10 bg-gray-50 shadow-xl mt-10">
        <div data-aos="fade-up" class="container mx-auto px-4 lg:px-16">
             <div data-aos="fade-up" class="grid grid-cols-1 lg:grid-cols-12 gap-8">
                

                <!-- Informasi Kontak -->
                <div data-aos="fade-up" class="bg-white shadow-md rounded-lg p-6">
                    <h3 data-aos="fade-up" class="text-xl font-semibold text-blue-900 mb-4 font-poppins">Alamat Kampus &
                        Sekretariat</h3>
                    <p data-aos="fade-up" class="text-gray-600 mb-6 font-dmsans">
                    {{ $settings['alamat kampus'] ?? 'tidak tersedia' }}
                    </p>
                    <h3 data-aos="fade-up" class="text-xl font-semibold text-blue-900 mb-4 font-poppins">Call & SMS Center
                    </h3>
                    <p data-aos="fade-up" class="text-gray-600 font-dmsans">
                        <span data-aos="fade-up" class="font-semibold font-poppins">Telepon :</span> 0878-9019-8284<br>
                        <span data-aos="fade-up" class="font-semibold font-poppins">Whatsapp :</span> +62 878-9019-8284
                    </p>
                </div>
            </div>
            <!-- Google Maps -->
            <div data-aos="fade-up" class="mt-10">
                <iframe
                src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3965.477488116952!2d107.28192377499128!3d-6.332129993657468!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e699d0001e8b709%3A0x6ead93ec3b5aa61e!2sSTMIK%20Pamitran!5e0!3m2!1sen!2sid!4v1751439532949!5m2!1sen!2sid"
                    width="100%" height="400" style="border:0;" allowfullscreen="" loading="lazy"
                    referrerpolicy="no-referrer-when-downgrade" data-aos="fade-up" class="rounded-lg shadow-md"></iframe>
            </div>
        </div>
    </div>
@endsection