<div class="socials">
<ul class="list-socials" aria-label="Liste des réseaux sociaux d’Index">
    <li>
        <a href="https://x.com/index_ngo" target="_blank" rel="noopener noreferrer">
            <span class="icon"><?= svg('assets/icons/socials/x-social.svg') ?></span>
            <span class="text">X</span>
        </a>
    </li>
    <li>
        <a href="https://www.instagram.com/index.ngo/" target="_blank" rel="noopener noreferrer">
            <span class="icon"><?= svg('assets/icons/socials/instagram.svg') ?></span>
            <span class="text">Instagram</span>
        </a>
    </li>
    <li>
        <a href="https://www.facebook.com/index.ngo/" target="_blank" rel="noopener noreferrer">
            <span class="icon"><?= svg('assets/icons/socials/facebook.svg') ?></span>
            <span class="text">Facebook</span>
        </a>
    </li>
    <li>
        <a href="https://www.youtube.com/index-ngo" target="_blank" rel="noopener noreferrer">
            <span class="icon"><?= svg('assets/icons/socials/youtube.svg') ?></span>
            <span class="text">Youtube</span>
        </a>
    </li>
    <li>
        <a href="https://fr.linkedin.com/company/index-ngo" target="_blank" rel="noopener noreferrer">
            <span class="icon"><?= svg('assets/icons/socials/linkedin.svg') ?></span>
            <span class="text">LinkedIn</span>
        </a>
    </li>
    <li>
        <a href="https://bsky.app/profile/index-ngo.bsky.social" target="_blank" rel="noopener noreferrer">
            <span class="icon"><?= svg('assets/icons/socials/bluesky.svg') ?></span>
            <span class="text">Bluesky</span>
        </a>
    </li>
    <li>
        <a href="https://mastodon.design/@index_ngo@mastodon.social" target="_blank" rel="noopener noreferrer">
            <span class="icon"><?= svg('assets/icons/socials/mastodon.svg') ?></span>
            <span class="text">Mastodon</span>
        </a>
    </li>
</ul>
</div>