{% if config.extra.show_profile %}
<div class="profile-section" style="display: flex; flex-direction: column; align-items: center; justify-content: center; margin-bottom: 4rem; text-align: center;">
    {% if config.extra.avatar_url %}
    <div class="avatar" style="width: 100px; height: 100px; border-radius: 50%; overflow: hidden; margin-bottom: 1rem; background-color: #1a1a1a; display: flex; align-items: center; justify-content: center;">
        <img src="{{ config.extra.avatar_url }}" alt="Avatar" loading="lazy" decoding="async" style="width: 100%; height: 100%; object-fit: cover;" onerror="this.src='data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 24 24\' fill=\'none\' stroke=\'%23f9fafb\' stroke-width=\'2\' stroke-linecap=\'round\' stroke-linejoin=\'round\'><path d=\'M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\'></path><circle cx=\'12\' cy=\'7\' r=\'4\'></circle></svg>'"/>
    </div>
    {% endif %}
    {% if config.extra.profile_subtitle %}
    <p class="profile-subtitle" style="color: var(--text-muted); font-size: 1rem; margin-bottom: 1rem;">{{ config.extra.profile_subtitle }}</p>
    {% endif %}
    
    <div class="social-links" style="display: flex; gap: 1rem; color: var(--text-muted);">
        {% if config.extra.github_url %}
        <a href="{{ config.extra.github_url }}" style="color: inherit;" class="hover-scale" aria-label="GitHub">
            <svg viewBox="0 0 24 24" width="20" height="20" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path></svg>
        </a>
        {% endif %}
        {% if config.extra.twitter_url %}
        <a href="{{ config.extra.twitter_url }}" style="color: inherit;" class="hover-scale" aria-label="Twitter">
            <svg viewBox="0 0 24 24" width="20" height="20" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z"></path></svg>
        </a>
        {% endif %}
        {% if config.extra.youtube_url %}
        <a href="{{ config.extra.youtube_url }}" style="color: inherit;" class="hover-scale" aria-label="YouTube">
            <svg viewBox="0 0 24 24" width="20" height="20" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.42a2.78 2.78 0 0 0-1.94 2C1 8.13 1 12 1 12s0 3.87.46 5.58a2.78 2.78 0 0 0 1.94 2C5.12 20 12 20 12 20s6.88 0 8.6-.42a2.78 2.78 0 0 0 1.94-2C23 15.87 23 12 23 12s0-3.87-.46-5.58z"></path><polygon points="9.75 15.02 15.5 12 9.75 8.98 9.75 15.02"></polygon></svg>
        </a>
        {% endif %}
        {% if config.extra.linkedin_url %}
        <a href="{{ config.extra.linkedin_url }}" style="color: inherit;" class="hover-scale" aria-label="LinkedIn">
            <svg viewBox="0 0 24 24" width="20" height="20" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path><rect x="2" y="9" width="4" height="12"></rect><circle cx="4" cy="4" r="2"></circle></svg>
        </a>
        {% endif %}
        {% if config.extra.email %}
        <a href="mailto:{{ config.extra.email }}" style="color: inherit;" class="hover-scale" aria-label="Email">
            <svg viewBox="0 0 24 24" width="20" height="20" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>
        </a>
        {% endif %}
        {% if config.extra.show_rss_link %}
        <a href="{{ get_url(path="rss.xml") }}" style="color: inherit;" class="hover-scale" aria-label="RSS">
            <svg viewBox="0 0 24 24" width="20" height="20" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M4 11a9 9 0 0 1 9 9"></path><path d="M4 4a16 16 0 0 1 16 16"></path><circle cx="5" cy="19" r="1"></circle></svg>
        </a>
        {% endif %}
    </div>
</div>
{% endif %}