@extends('layouts.component.app')

@section('title', 'Kontakt')

@section('content')
    <div class="flex-grow bg-white">
        <div class="mx-auto max-w-7xl px-6 py-18 sm:pt-24 lg:px-8 flex flex-col space-y-3">
            <div class="text-3xl mb-6 text-blue-900">Kontakt:</div>
            <div class="lg:grid lg:grid-cols-12 lg:gap-8">
                <div class="mt-10 lg:col-span-7 lg:mt-0">
                    <dl class="space-y-10">
                        <div>
                            <dt class="text-xl decoration-4 leading-7 text-gray-900">Haben Sie Fragen oder Anregungen? Benötigen Sie Unterstützung?</dt>
                            <dt class="text-xl decoration-6 leading-7 text-gray-900 mb-32">Gern steht Ihnen unser Support zur Verfügung:</dt>
                        </div>
                    </dl>
                </div>
            </div>
        </div>
    </div>

    <div>
        <div class="relative mx-auto max-w-xl px-6 py-18 mb-20 mt-3 bg-gray-200 flex flex-col space-y-6 items-center text-center p-6 rounded-lg shadow-md z-10">
            <p class="text-2xl font-semibold text-gray-800">📞 (0208) 69609-730</p>
            <a href="mailto:support@consyltec.de" class="text-2xl font-semibold text-indigo-800 hover:text-orange-500">
                ✉️ support@consyltec.de
            </a>
        </div>
    </div>
@endsection