{% if href %}<a href="{{ href|default:'#' }}" class="cyberpunk-card neon-edge-magenta block p-6 rounded-lg h-full transition-transform hover:-translate-y-0.5" style="background-color: hsl(var(--card)); color: hsl(var(--card-foreground)); border: 1px dashed hsl(var(--primary));">{% if media %}<img src="{{ media }}" alt="" class="cyberpunk-card-media w-full h-40 object-cover rounded mb-4" onerror="this.style.display='none'">{% endif %}{% if title %}<h3 class="cyberpunk-card-title text-lg font-semibold mb-2" style="color: hsl(var(--foreground)); font-family: var(--font-heading, 'Space Grotesk', system-ui, sans-serif);">{{ title }}</h3>{% endif %}{% if body %}<div class="cyberpunk-card-body text-sm leading-relaxed" style="color: hsl(var(--muted-foreground));">{{ body|safe }}</div>{% endif %}</a>{% else %}<article class="cyberpunk-card neon-edge-magenta block p-6 rounded-lg h-full" style="background-color: hsl(var(--card)); color: hsl(var(--card-foreground)); border: 1px dashed hsl(var(--primary));">{% if media %}<img src="{{ media }}" alt="" class="cyberpunk-card-media w-full h-40 object-cover rounded mb-4" onerror="this.style.display='none'">{% endif %}{% if title %}<h3 class="cyberpunk-card-title text-lg font-semibold mb-2" style="color: hsl(var(--foreground)); font-family: var(--font-heading, 'Space Grotesk', system-ui, sans-serif);">{{ title }}</h3>{% endif %}{% if body %}<div class="cyberpunk-card-body text-sm leading-relaxed" style="color: hsl(var(--muted-foreground));">{{ body|safe }}</div>{% endif %}</article>{% endif %}