@props(['title', 'description' => null])
<div {{ $attributes->merge(['class' => 'group rounded-3xl bg-white p-7 ring-1 ring-stone-900/5 transition-all duration-300 hover:shadow-xl hover:shadow-stone-900/5 hover:ring-accent-600/20 hover:-translate-y-1']) }}>
    <div class="flex h-12 w-12 items-center justify-center rounded-2xl bg-gradient-to-br from-accent-600 to-gold-400 text-white shadow-sm transition-transform duration-300 group-hover:scale-105">
        {{ $icon }}
    </div>
    <h3 class="mt-5 text-[17px] font-semibold text-stone-900">{{ $title }}</h3>
    @if ($description)
        <p class="mt-2 text-[15px] leading-relaxed text-stone-600">{{ $description }}</p>
    @endif
</div>