<?php $attributes ??= new \Illuminate\View\ComponentAttributeBag;

$__newAttributes = [];
$__propNames = \Illuminate\View\ComponentAttributeBag::extractPropNames(([
    'features' => [],
    'themeClasses' => [],
]));

foreach ($attributes->all() as $__key => $__value) {
    if (in_array($__key, $__propNames)) {
        $$__key = $$__key ?? $__value;
    } else {
        $__newAttributes[$__key] = $__value;
    }
}

$attributes = new \Illuminate\View\ComponentAttributeBag($__newAttributes);

unset($__propNames);
unset($__newAttributes);

foreach (array_filter(([
    'features' => [],
    'themeClasses' => [],
]), 'is_string', ARRAY_FILTER_USE_KEY) as $__key => $__value) {
    $$__key = $$__key ?? $__value;
}

$__defined_vars = get_defined_vars();

foreach ($attributes->all() as $__key => $__value) {
    if (array_key_exists($__key, $__defined_vars)) unset($$__key);
}

unset($__defined_vars, $__key, $__value); ?>

<section id="animations"
    class="py-20 md:py-32 <?php echo e($themeClasses['sectionBg'] ?? 'bg-gray-900'); ?> border-t <?php echo e($themeClasses['divider'] ?? 'border-gray-800'); ?>">
    <div class="max-w-7xl mx-auto px-6 lg:px-8">
        <h2
            class="text-5xl font-extrabold text-center mb-6 <?php echo e($themeClasses['textNormal'] ?? 'text-white'); ?> animate-on-scroll">
            The Power of Motion</h2>
        <p class="text-center <?php echo e($themeClasses['textSecondary'] ?? 'text-gray-400'); ?> mb-16 max-w-3xl mx-auto text-lg animate-on-scroll"
            style="transition-delay: 0.1s;">
            We bring static ideas to life with state-of-the-art animation, visual effects, and dynamic motion design.
        </p>

        <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
            <?php $__currentLoopData = $features; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $index => $feature): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <div class="p-8 <?php echo e($themeClasses['cardBg'] ?? 'bg-gray-900'); ?> rounded-2xl shadow-xl transition duration-300 border <?php echo e($themeClasses['cardBorder'] ?? 'border-gray-800'); ?> hover:border-blue-500/50 animate-on-scroll"
                    style="transition-delay: <?php echo e($index * 0.15); ?>s;">
                    <div class="p-3 w-12 h-12 rounded-full mb-4 bg-blue-600/10 text-blue-400">
                        <?php echo $__env->make('partials.icon', ['name' => $feature['icon'], 'size' => 'w-full h-full'], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                    </div>
                    <h3 class="text-xl font-semibold mb-2 <?php echo e($themeClasses['textNormal'] ?? 'text-white'); ?>">
                        <?php echo e($feature['title']); ?></h3>
                    <p class="<?php echo e($themeClasses['textSecondary'] ?? 'text-gray-400'); ?> text-sm">
                        <?php echo e($feature['description']); ?></p>
                </div>
            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
        </div>

        <div class="text-center p-10 <?php echo e($themeClasses['cardBg'] ?? 'bg-gray-900'); ?> rounded-2xl shadow-2xl border border-blue-700/50 animate-on-scroll"
            style="transition-delay: 0.3s;">
            <h3 class="text-3xl font-bold mb-4 <?php echo e($themeClasses['textNormal'] ?? 'text-white'); ?>">Ready to see your
                brand move?</h3>
            <p class="<?php echo e($themeClasses['textSecondary'] ?? 'text-gray-400'); ?> mb-6">
                Explore our dedicated animation portfolio or jump straight to a consultation.
            </p>
            <div class="flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-4">
                <button onclick="scrollToSection('portfolio')"
                    class="inline-flex items-center justify-center space-x-2 bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-8 rounded-full shadow-lg transition duration-300 text-base">
                    <span>View Motion Reel &rarr;</span>
                </button>
                <button onclick="scrollToSection('contact')"
                    class="inline-flex items-center justify-center space-x-2 border border-blue-600 <?php echo e($themeClasses['textNormal'] ?? 'text-white'); ?> hover:bg-blue-600 hover:text-white font-bold py-3 px-8 rounded-full shadow-lg transition duration-300 text-base">
                    <span>Start a Project</span>
                </button>
            </div>
        </div>
    </div>
</section>
<?php /**PATH /Users/olasunkanmiarowolo/oamediakraft.co.uk/oamk/resources/views/components/animations.blade.php ENDPATH**/ ?>