<div class="baobab-container">
    <img src="/files/atasteofafricanmarketplace/assets/images/boabab.jpeg" alt="Real Baobab Tree" class="baobab-image">
    
    <!-- Points mapped to data-field -->
    <div class="coach-point" style="top: 25%; left: 20%;" data-field="mind" onclick="showCoach('coach-1')" title="Elena Thorne">
        <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364-6.364l-.707.707M6.343 17.657l-.707.707m12.728 0l-.707-.707M6.343 6.343l-.707-.707"></path></svg>
    </div>
    
    <div class="coach-point" style="top: 35%; right: 15%;" data-field="botanical" onclick="showCoach('coach-2')" title="Dr. Julian Vance">
        <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.675.337a2 2 0 00-1.022.547l-2.387-.477a6 6 0 01-3.86-.517l-.675-.337a2 2 0 01-1.022-.547l-2.387-.477a6 6 0 01-3.86-.517l-.675-.337a2 2 0 01-1.022-.547l-2.387-.477a6 6 0 01-3.86-.517l-.675-.337a2 2 0 01-1.022-.547"></path></svg>
    </div>
    
    <div class="coach-point" style="top: 15%; left: 55%;" data-field="ancestral" onclick="showCoach('coach-3')" title="Mama Nia">
        <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253'></path></svg>
    </div>
    
    <div class="coach-point" style="top: 50%; left: 40%;" data-field="ancestral" onclick="showCoach('coach-4')" title="Baba Kojo">
        <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg>
    </div>

    <div class="coach-point" style="top: 55%; right: 40%;" data-field="botanical" onclick="showCoach('coach-5')" title="Dr. Amara Okoro">
        <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path></svg>
    </div>
</div>
