@props([
    'color' => '#C2552E',
    'strokeWidth' => 2,
    'class' => '',
    'animated' => true,
])

<div {{ $attributes->merge(['class' => 'pointer-events-none select-none overflow-visible ' . $class]) }}>
    <svg viewBox="0 0 600 600" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-full h-full">
        <!-- Fibonacci-inspired Growth Spiral outward from center (300, 300) -->
        <path 
            d="M 300 300 
               A 20 20 0 0 1 320 300 
               A 40 40 0 0 1 280 300 
               A 70 70 0 0 1 350 300 
               A 115 115 0 0 1 235 300 
               A 185 185 0 0 1 420 300 
               A 300 300 0 0 1 120 300 
               A 480 480 0 0 1 600 300"
            stroke="{{ $color }}" 
            stroke-width="{{ $strokeWidth }}" 
            stroke-linecap="round"
            class="{{ $animated ? 'animate-growth-spiral' : '' }}"
            opacity="0.85"
        />
    </svg>
</div>