{{# Icon Feature Grid Section #}}
<section class="py-16 full-bleed {{ bg_color == 'light' ? 'bg-[#f7f8fa]' : 'bg-white' }}">
    <div class="max-w-6xl mx-auto">
        {{ if intro_text }}
        <h5 class="font-nunito text-lg font-bold text-[#696687] leading-snug text-left mb-10" data-aos="fade-up">{{ intro_text }}</h5>
        {{ /if }}
        {{ if items }}
        <div class="grid grid-cols-1 {{ columns == '2' ? 'md:grid-cols-2' : columns == '4' ? 'md:grid-cols-4' : 'md:grid-cols-3' }} gap-8">
            {{ items }}
            <div class="text-center" data-aos="fade-up" data-aos-delay="{{ index | multiply:100 }}">
                <div class="w-32 h-32 rounded-full bg-white shadow-lg flex items-center justify-center mx-auto mb-4">
                    {{ if icon_image }}
                    <img src="{{ icon_image:url }}" alt="{{ title }}" class="w-16 h-16 object-contain">
                    {{ /if }}
                </div>
                {{ if title }}
                <h3 class="font-nunito text-lg font-bold text-[#252a3f]">{{ title }}</h3>
                {{ /if }}
            </div>
            {{ /items }}
        </div>
        {{ /if }}
    </div>
</section>