{{ partial:components/molecules/cards/card size="md"  bg_color="{ card_color ?? 'bg-transparent' }" classes="text-primary-500" :asset="thumbnail ?? header_asset" direction="col" }}
    {{ partial:components/atoms/text/heading size="sm" tag="h3" weight="font-bold" }}
        {{ title }}
    {{ /partial:components/atoms/text/heading }}
    <div class="mt-4 space-y-4">
        <p>{{ position }}</p>

        <ul class="space-y-2 text-sm">
            {{ if tel }}
                <li>
                    <a href="tel:{{ tel }}" class="flex items-center font-medium underline-offset-2 hover:underline">
                        {{ partial:components/atoms/icons/phone size="size-5" classes="mr-2" }}
                        <span>{{ tel }}</span>
                    </a>
                </li>
            {{ /if }}
            {{ if mail }}
                <li>
                    <a href="mailto:{{ mail }}" class="flex items-center font-medium underline-offset-2 hover:underline">
                        {{ partial:components/atoms/icons/mail size="size-5" classes="mr-2" }}
                        <span>{{ mail }}</span>
                    </a>
                </li>
            {{ /if }}
            {{ if linkedin }}
                <li>
                    <a href="{{ linkedin }}" target="_blank" class="flex items-center font-medium underline-offset-2 hover:underline">
                        {{ partial:components/atoms/icons/linkedin size="size-5" classes="mr-2" }}
                        <span>{{ trans key="View LinkedIn" }}</span>
                    </a>
                </li>
            {{ /if }}
            {{ if other }}
                <li>
                    <a href="{{ other }}" target="_blank" class="flex items-center font-medium underline-offset-2 hover:underline">
                        {{ partial:components/atoms/icons/globe size="size-5" classes="mr-2" }}
                        <span>{{ trans key="View website" }}</span>
                    </a>
                </li>
            {{ /if }}
        </ul>
    </div>
{{ /partial:components/molecules/cards/card }}
