@progressive-development/pd-page 1.0.3 → 1.0.5

package/dist/pd-icon-brand/dist/brand-icon-map.js

@@ -0,0 +1,88 @@
+import { linkedinIcon } from './icons/linkedin.js';
+import { githubIcon } from './icons/github.js';
+import { xTwitterIcon } from './icons/x-twitter.js';
+import { instagramIcon } from './icons/instagram.js';
+import { facebookIcon } from './icons/facebook.js';
+import { youtubeIcon } from './icons/youtube.js';
+import { tiktokIcon } from './icons/tiktok.js';
+import { xingIcon } from './icons/xing.js';
+import { whatsappIcon } from './icons/whatsapp.js';
+import { telegramIcon } from './icons/telegram.js';
+import { stackoverflowIcon } from './icons/stackoverflow.js';
+import { dribbbleIcon } from './icons/dribbble.js';
+import { behanceIcon } from './icons/behance.js';
+import { twitchIcon } from './icons/twitch.js';
+import { soundcloudIcon } from './icons/soundcloud.js';
+import { mixcloudIcon } from './icons/mixcloud.js';
+import { spotifyIcon } from './icons/spotify.js';
+import { appleMusicIcon } from './icons/apple-music.js';
+import { deezerIcon } from './icons/deezer.js';
+import { bandcampIcon } from './icons/bandcamp.js';
+import { beatportIcon } from './icons/beatport.js';
+import { discogsIcon } from './icons/discogs.js';
+import { pinterestIcon } from './icons/pinterest.js';
+import { threadsIcon } from './icons/threads.js';
+import { blueskyIcon } from './icons/bluesky.js';
+import { snapchatIcon } from './icons/snapchat.js';
+import { discordIcon } from './icons/discord.js';
+import { redditIcon } from './icons/reddit.js';
+import { vimeoIcon } from './icons/vimeo.js';
+import { mastodonIcon } from './icons/mastodon.js';
+import { mediumIcon } from './icons/medium.js';
+import { patreonIcon } from './icons/patreon.js';
+
+/**
+ * Dynamic lookup map — use this when the icon name comes from config/data
+ * at runtime (e.g. in `pd-socialmedia` or `_getAppFooterLinks()`).
+ *
+ * **Achtung:** Importiert alle Icons. Für optimales Tree-Shaking
+ * stattdessen die Named Exports direkt importieren:
+ *
+ * ```typescript
+ * // Tree-shakeable (empfohlen für Apps mit wenigen Icons)
+ * import { linkedinIcon, githubIcon } from "@progressive-development/pd-icon-brands";
+ *
+ * // Dynamischer Lookup (wenn Icon-Name aus Config kommt)
+ * import { brandIconMap } from "@progressive-development/pd-icon-brands";
+ * const icon = brandIconMap.get("linkedin");
+ * ```
+ */
+const brandIconMap = new Map([
+    ["linkedin", linkedinIcon],
+    ["github", githubIcon],
+    ["x-twitter", xTwitterIcon],
+    ["twitter", xTwitterIcon], // Alias
+    ["x", xTwitterIcon], // Alias (pd-socialmedia provider id)
+    ["instagram", instagramIcon],
+    ["facebook", facebookIcon],
+    ["youtube", youtubeIcon],
+    ["tiktok", tiktokIcon],
+    ["xing", xingIcon],
+    ["whatsapp", whatsappIcon],
+    ["telegram", telegramIcon],
+    ["stackoverflow", stackoverflowIcon],
+    ["dribbble", dribbbleIcon],
+    ["behance", behanceIcon],
+    ["twitch", twitchIcon],
+    ["soundcloud", soundcloudIcon],
+    ["mixcloud", mixcloudIcon],
+    ["spotify", spotifyIcon],
+    ["applemusic", appleMusicIcon],
+    ["apple-music", appleMusicIcon], // Alias
+    ["deezer", deezerIcon],
+    ["bandcamp", bandcampIcon],
+    ["beatport", beatportIcon],
+    ["discogs", discogsIcon],
+    ["pinterest", pinterestIcon],
+    ["threads", threadsIcon],
+    ["bluesky", blueskyIcon],
+    ["snapchat", snapchatIcon],
+    ["discord", discordIcon],
+    ["reddit", redditIcon],
+    ["vimeo", vimeoIcon],
+    ["mastodon", mastodonIcon],
+    ["medium", mediumIcon],
+    ["patreon", patreonIcon],
+]);
+
+export { brandIconMap };

package/dist/pd-icon-brand/dist/icons/apple-music.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Apple Music brand icon (24×24, fill=currentColor) */
+const appleMusicIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M23.994 6.124a9.23 9.23 0 00-.24-2.19c-.317-1.31-1.062-2.31-2.18-3.043a5.022 5.022 0 00-1.877-.726 10.496 10.496 0 00-1.564-.15c-.04-.003-.083-.01-.124-.013H5.986c-.152.01-.303.017-.455.026-.747.043-1.49.123-2.193.4-1.336.53-2.3 1.452-2.865 2.78-.192.448-.292.925-.363 1.408-.056.392-.088.785-.1 1.18 0 .032-.007.062-.01.093v12.223c.01.14.017.283.027.424.05.815.154 1.624.497 2.373.65 1.42 1.738 2.353 3.234 2.801.42.127.856.187 1.293.228.555.053 1.11.06 1.667.06h11.03a12.5 12.5 0 001.57-.1c.822-.106 1.596-.35 2.295-.81a5.046 5.046 0 001.88-2.207c.186-.42.293-.87.37-1.324.113-.675.138-1.358.137-2.04-.002-3.8 0-7.595-.003-11.393zm-6.423 3.99v5.712c0 .417-.058.827-.244 1.206-.29.59-.76.962-1.388 1.14-.35.1-.706.157-1.07.173-.95.045-1.773-.6-1.943-1.536a1.88 1.88 0 011.038-2.022c.323-.16.67-.25 1.018-.324.378-.082.758-.153 1.134-.24.274-.063.457-.23.51-.516a.904.904 0 00.02-.193c0-1.815 0-3.63-.002-5.443a.725.725 0 00-.026-.185c-.04-.15-.15-.243-.304-.234-.16.01-.318.035-.475.066-.76.15-1.52.303-2.28.456l-2.325.47-1.374.278c-.016.003-.032.01-.048.013-.277.077-.377.203-.39.49-.002.042 0 .086 0 .13-.002 2.602 0 5.204-.003 7.805 0 .42-.047.836-.215 1.227-.278.64-.77 1.04-1.434 1.233-.35.1-.71.16-1.075.172-.96.036-1.755-.6-1.92-1.544-.14-.812.23-1.685 1.154-2.075.357-.15.73-.232 1.108-.31.287-.06.575-.116.86-.177.383-.083.583-.323.6-.714v-.15c0-2.96 0-5.922.002-8.882 0-.123.013-.25.042-.37.07-.285.273-.448.546-.518.255-.066.515-.112.774-.165.733-.15 1.466-.296 2.2-.444l2.27-.46c.67-.134 1.34-.27 2.01-.403.22-.043.442-.088.663-.106.31-.025.523.17.554.482.008.073.012.148.012.223.002 1.91.002 3.822 0 5.732z"/>
+  </svg>`;
+
+export { appleMusicIcon };

package/dist/pd-icon-brand/dist/icons/bandcamp.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Bandcamp brand icon (24×24, fill=currentColor) */
+const bandcampIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M0 18.75l7.437-13.5H24l-7.438 13.5H0z"/>
+  </svg>`;
+
+export { bandcampIcon };

package/dist/pd-icon-brand/dist/icons/beatport.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Beatport brand icon (24×24, fill=currentColor) */
+const beatportIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M21.429 17.055a7.114 7.114 0 0 1-.794 3.246 6.917 6.917 0 0 1-2.181 2.492 6.698 6.698 0 0 1-3.063 1.163 6.653 6.653 0 0 1-3.239-.434 6.796 6.796 0 0 1-2.668-1.932 7.03 7.03 0 0 1-1.481-2.983 7.124 7.124 0 0 1 .049-3.345 7.015 7.015 0 0 1 1.566-2.937l-4.626 4.73-2.421-2.479 5.201-5.265a3.791 3.791 0 0 0 1.066-2.675V0h3.41v6.613a7.172 7.172 0 0 1-.519 2.794 7.02 7.02 0 0 1-1.559 2.353l-.153.156a6.768 6.768 0 0 1 3.49-1.725 6.687 6.687 0 0 1 3.845.5 6.873 6.873 0 0 1 2.959 2.564 7.118 7.118 0 0 1 1.118 3.8Zm-3.089 0a3.89 3.89 0 0 0-.611-2.133 3.752 3.752 0 0 0-1.666-1.424 3.65 3.65 0 0 0-2.158-.233 3.704 3.704 0 0 0-1.92 1.037 3.852 3.852 0 0 0-1.031 1.955 3.908 3.908 0 0 0 .205 2.213c.282.7.76 1.299 1.374 1.721a3.672 3.672 0 0 0 2.076.647 3.637 3.637 0 0 0 2.635-1.096c.347-.351.622-.77.81-1.231.188-.461.285-.956.286-1.456Z"/>
+  </svg>`;
+
+export { beatportIcon };

package/dist/pd-icon-brand/dist/icons/behance.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Behance brand icon (24×24, fill=currentColor) */
+const behanceIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M16.969 16.927a2.561 2.561 0 0 0 1.901.677 2.501 2.501 0 0 0 1.531-.475c.362-.235.636-.584.779-.99h2.585a5.091 5.091 0 0 1-1.9 2.896 5.292 5.292 0 0 1-3.091.88 5.839 5.839 0 0 1-2.284-.433 4.871 4.871 0 0 1-1.723-1.211 5.657 5.657 0 0 1-1.08-1.874 7.057 7.057 0 0 1-.383-2.393c-.005-.8.129-1.595.396-2.349a5.313 5.313 0 0 1 5.088-3.604 4.87 4.87 0 0 1 2.376.563c.661.362 1.231.87 1.668 1.485a6.2 6.2 0 0 1 .943 2.133c.194.821.263 1.666.205 2.508h-7.699c-.063.79.184 1.574.688 2.187ZM6.947 4.084a8.065 8.065 0 0 1 1.928.198 4.29 4.29 0 0 1 1.49.638c.418.303.748.711.958 1.182.241.579.357 1.203.341 1.83a3.506 3.506 0 0 1-.506 1.961 3.726 3.726 0 0 1-1.503 1.287 3.588 3.588 0 0 1 2.027 1.437c.464.747.697 1.615.67 2.494a4.593 4.593 0 0 1-.423 2.032 3.945 3.945 0 0 1-1.163 1.413 5.114 5.114 0 0 1-1.683.807 7.135 7.135 0 0 1-1.928.259H0V4.084h6.947Zm-.235 12.9c.308.004.616-.029.916-.099a2.18 2.18 0 0 0 .766-.332c.228-.158.411-.371.534-.619.142-.317.208-.663.191-1.009a2.08 2.08 0 0 0-.642-1.715 2.618 2.618 0 0 0-1.696-.505h-3.54v4.279h3.471Zm13.635-5.967a2.13 2.13 0 0 0-1.654-.619 2.336 2.336 0 0 0-1.163.259 2.474 2.474 0 0 0-.738.62 2.359 2.359 0 0 0-.396.792c-.074.239-.12.485-.137.734h4.769a3.239 3.239 0 0 0-.679-1.785l-.002-.001Zm-13.813-.648a2.254 2.254 0 0 0 1.423-.433c.399-.355.607-.88.56-1.413a1.916 1.916 0 0 0-.178-.891 1.298 1.298 0 0 0-.495-.533 1.851 1.851 0 0 0-.711-.274 3.966 3.966 0 0 0-.835-.073H3.241v3.631h3.293v-.014ZM21.62 5.122h-5.976v1.527h5.976V5.122Z"/>
+  </svg>`;
+
+export { behanceIcon };

package/dist/pd-icon-brand/dist/icons/bluesky.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Bluesky brand icon (24×24, fill=currentColor) */
+const blueskyIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M5.202 2.857C7.954 4.922 10.913 9.11 12 11.358c1.087-2.247 4.046-6.436 6.798-8.501C20.783 1.366 24 .213 24 3.883c0 .732-.42 6.156-.667 7.037-.856 3.061-3.978 3.842-6.755 3.37 4.854.826 6.089 3.562 3.422 6.299-5.065 5.196-7.28-1.304-7.847-2.97-.104-.305-.152-.448-.153-.327 0-.121-.05.022-.153.327-.568 1.666-2.782 8.166-7.847 2.97-2.667-2.737-1.432-5.473 3.422-6.3-2.777.473-5.899-.308-6.755-3.369C.42 10.04 0 4.615 0 3.883c0-3.67 3.217-2.517 5.202-1.026"/>
+  </svg>`;
+
+export { blueskyIcon };

package/dist/pd-icon-brand/dist/icons/deezer.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Deezer brand icon (24×24, fill=currentColor) */
+const deezerIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M.693 10.024c.381 0 .693-1.256.693-2.807 0-1.55-.312-2.807-.693-2.807C.312 4.41 0 5.666 0 7.217s.312 2.808.693 2.808ZM21.038 1.56c-.364 0-.684.805-.91 2.096C19.765 1.446 19.184 0 18.526 0c-.78 0-1.464 2.036-1.784 5-1.312-2.158-.788-3.536-1.325-3.536-.745 0-1.386 2.704-1.62 6.472-.442-1.932-1.083-3.145-1.793-3.145s-1.35 1.213-1.793 3.145c-.242-3.76-.874-6.463-1.628-6.463-.537 0-1.013 1.378-1.325 3.535C6.938 2.036 6.262 0 5.474 0c-.658 0-1.247 1.447-1.602 3.665-.217-1.291-.546-2.105-.91-2.105-.675 0-1.221 2.807-1.221 6.272 0 3.466.546 6.273 1.221 6.273.277 0 .537-.476.736-1.273.32 2.928.996 4.938 1.776 4.938.606 0 1.143-1.204 1.507-3.11.251 3.622.875 6.195 1.602 6.195.46 0 .875-1.023 1.187-2.677C10.142 21.6 11 24 12.004 24c1.005 0 1.863-2.4 2.235-5.822.312 1.654.727 2.677 1.186 2.677.728 0 1.352-2.573 1.603-6.195.364 1.906.9 3.11 1.507 3.11.78 0 1.455-2.01 1.775-4.938.208.797.46 1.273.737 1.273.675 0 1.22-2.807 1.22-6.273-.008-3.457-.553-6.272-1.23-6.272ZM23.307 10.024c.381 0 .693-1.256.693-2.807 0-1.55-.312-2.807-.693-2.807-.381 0-.693 1.256-.693 2.807s.312 2.808.693 2.808Z"/>
+  </svg>`;
+
+export { deezerIcon };

package/dist/pd-icon-brand/dist/icons/default-brand.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Default brand icon — globe/link (24×24, fill=currentColor) */
+const defaultBrandIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2Zm-1 17.938A8.004 8.004 0 0 1 4 12c0-.34.028-.674.075-1.003L8 14.938V16a2 2 0 0 0 2 2v1.938Zm6.906-2.462A1.993 1.993 0 0 0 16 16h-1v-3a1 1 0 0 0-1-1H8v-2h2a1 1 0 0 0 1-1V7h2a2 2 0 0 0 2-2v-.41A7.997 7.997 0 0 1 20 12a7.97 7.97 0 0 1-2.094 5.476Z"/>
+  </svg>`;
+
+export { defaultBrandIcon };

package/dist/pd-icon-brand/dist/icons/discogs.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Discogs brand icon (24×24, fill=currentColor) */
+const discogsIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M1.7422 11.982c0-5.6682 4.61-10.2782 10.2758-10.2782 1.8238 0 3.5372.48 5.0251 1.3175l.8135-1.4879C16.1768.588 14.2474.036 12.1908.0024h-.1944C5.4091.0144.072 5.3107 0 11.886v.1152c.0072 3.4389 1.4567 6.5345 3.7748 8.7207l1.1855-1.2814c-1.9798-1.8743-3.218-4.526-3.218-7.4585zM20.362 3.4053l-1.1543 1.2406c1.903 1.867 3.0885 4.4636 3.0885 7.3361 0 5.6658-4.61 10.2758-10.2758 10.2758-1.783 0-3.4605-.456-4.922-1.2575l-.8542 1.5214c1.7086.9384 3.6692 1.4735 5.7546 1.4759C18.6245 23.9976 24 18.6246 24 11.9988c-.0048-3.3717-1.399-6.4146-3.638-8.5935zM1.963 11.982c0 2.8701 1.2119 5.4619 3.146 7.2953l1.1808-1.2767c-1.591-1.5166-2.587-3.6524-2.587-6.0186 0-4.586 3.7293-8.3152 8.3152-8.3152 1.483 0 2.875.3912 4.082 1.0751l.8351-1.5262C15.481 2.395 13.8034 1.927 12.018 1.927 6.4746 1.9246 1.963 6.4362 1.963 11.982zm18.3702 0c0 4.586-3.7293 8.3152-8.3152 8.3152-1.4327 0-2.7837-.3648-3.962-1.0055l-.852 1.5166c1.4303.7823 3.0718 1.2287 4.814 1.2287 5.5434 0 10.055-4.5116 10.055-10.055 0-2.8077-1.1567-5.3467-3.0165-7.1729l-1.183 1.2743c1.519 1.507 2.4597 3.5924 2.4597 5.8986zm-1.9486 0c0 3.5109-2.8558 6.3642-6.3642 6.3642a6.3286 6.3286 0 01-3.0069-.756l-.8471 1.507c1.147.624 2.4597.9768 3.854.9768 4.4636 0 8.0944-3.6308 8.0944-8.0944 0-2.239-.9143-4.2692-2.3902-5.7378l-1.1783 1.267c1.1351 1.152 1.8383 2.731 1.8383 4.4732zm-14.4586 0c0 2.3014.9671 4.382 2.515 5.8578l1.1734-1.2695c-1.207-1.159-1.9606-2.786-1.9606-4.5883 0-3.5108 2.8557-6.3642 6.3642-6.3642 1.1423 0 2.215.3048 3.1437.8352l.8303-1.5167c-1.1759-.6647-2.5317-1.0487-3.974-1.0487-4.4612 0-8.092 3.6308-8.092 8.0944zm12.5292 0c0 2.4502-1.987 4.4372-4.4372 4.4372a4.4192 4.4192 0 01-2.0614-.5088l-.8351 1.4879a6.1135 6.1135 0 002.8965.727c3.3885 0 6.1434-2.7548 6.1434-6.1433 0-1.6774-.6767-3.1989-1.7686-4.3076l-1.1615 1.2503c.7559.7967 1.2239 1.8718 1.2239 3.0573zm-10.5806 0c0 1.7374.7247 3.3069 1.8886 4.4252L8.92 15.1569l.0144.0144c-.8351-.8063-1.3559-1.9366-1.3559-3.1869 0-2.4502 1.9846-4.4372 4.4372-4.4372.8087 0 1.5646.2184 2.2174.5976l.8207-1.4975a6.097 6.097 0 00-3.0381-.8063c-3.3837-.0048-6.141 2.7525-6.141 6.141zm6.681 0c0 .2952-.2424.5351-.5376.5351-.2952 0-.5375-.24-.5375-.5351 0-.2976.24-.5375.5375-.5375.2952 0 .5375.24.5375.5375zm-3.9405 0c0-1.879 1.5239-3.4029 3.4005-3.4029 1.879 0 3.4005 1.5215 3.4005 3.4029 0 1.879-1.5239 3.4005-3.4005 3.4005S8.6151 13.861 8.6151 11.982zm.1488 0c.0048 1.7974 1.4567 3.2493 3.2517 3.2517 1.795 0 3.254-1.4567 3.254-3.2517-.0023-1.7974-1.4566-3.2517-3.254-3.254-1.795 0-3.2517 1.4566-3.2517 3.254Z"/>
+  </svg>`;
+
+export { discogsIcon };

package/dist/pd-icon-brand/dist/icons/discord.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Discord brand icon (24×24, fill=currentColor) */
+const discordIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z"/>
+  </svg>`;
+
+export { discordIcon };

package/dist/pd-icon-brand/dist/icons/dribbble.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Dribbble brand icon (24×24, fill=currentColor) */
+const dribbbleIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M12 24C5.385 24 0 18.615 0 12S5.385 0 12 0s12 5.385 12 12-5.385 12-12 12zm10.12-10.358c-.35-.11-3.17-.953-6.384-.438 1.34 3.684 1.887 6.684 1.992 7.308 2.3-1.555 3.936-4.02 4.395-6.87zm-6.115 7.808c-.153-.9-.75-4.032-2.19-7.77l-.066.02c-5.79 2.015-7.86 6.025-8.04 6.4 1.73 1.358 3.92 2.166 6.29 2.166 1.42 0 2.77-.29 4-.814zm-11.62-2.58c.232-.4 3.045-5.055 8.332-6.765.135-.045.27-.084.405-.12-.26-.585-.54-1.167-.832-1.74C7.17 11.775 2.206 11.71 1.756 11.7l-.004.312c0 2.633.998 5.037 2.634 6.855zm-2.42-8.955c.46.008 4.683.026 9.477-1.248-1.698-3.018-3.53-5.558-3.8-5.928-2.868 1.35-5.01 3.99-5.676 7.17zM9.6 2.052c.282.38 2.145 2.914 3.822 6 3.645-1.365 5.19-3.44 5.373-3.702-1.81-1.61-4.19-2.586-6.795-2.586-.825 0-1.63.1-2.4.285zm10.335 3.483c-.218.29-1.935 2.493-5.724 4.04.24.49.47.985.68 1.486.08.18.15.36.22.53 3.41-.43 6.8.26 7.14.33-.02-2.42-.88-4.64-2.31-6.38z"/>
+  </svg>`;
+
+export { dribbbleIcon };

package/dist/pd-icon-brand/dist/icons/facebook.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Facebook brand icon (24×24, fill=currentColor) */
+const facebookIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M9.101 23.691v-7.98H6.627v-3.667h2.474v-1.58c0-4.085 1.848-5.978 5.858-5.978.401 0 .955.042 1.468.103a8.68 8.68 0 0 1 1.141.195v3.325a8.623 8.623 0 0 0-.653-.036 26.805 26.805 0 0 0-.733-.009c-.707 0-1.259.096-1.675.309a1.686 1.686 0 0 0-.679.622c-.258.42-.374.995-.374 1.752v1.297h3.919l-.386 2.103-.287 1.564h-3.246v8.245C19.396 23.238 24 18.179 24 12.044c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.628 3.874 10.35 9.101 11.647Z"/>
+  </svg>`;
+
+export { facebookIcon };

package/dist/pd-icon-brand/dist/icons/github.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** GitHub brand icon (24×24, fill=currentColor) */
+const githubIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/>
+  </svg>`;
+
+export { githubIcon };

package/dist/pd-icon-brand/dist/icons/instagram.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Instagram brand icon (24×24, fill=currentColor) */
+const instagramIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M7.0301.084c-1.2768.0602-2.1487.264-2.911.5634-.7888.3075-1.4575.72-2.1228 1.3877-.6652.6677-1.075 1.3368-1.3802 2.127-.2954.7638-.4956 1.6365-.552 2.914-.0564 1.2775-.0689 1.6882-.0626 4.947.0062 3.2586.0206 3.6671.0825 4.9473.061 1.2765.264 2.1482.5635 2.9107.308.7889.72 1.4573 1.388 2.1228.6679.6655 1.3365 1.0743 2.1285 1.38.7632.295 1.6361.4961 2.9134.552 1.2773.056 1.6884.069 4.9462.0627 3.2578-.0062 3.668-.0207 4.9478-.0814 1.28-.0607 2.147-.2652 2.9098-.5633.7889-.3086 1.4578-.72 2.1228-1.3881.665-.6682 1.0745-1.3378 1.3795-2.1284.2957-.7632.4966-1.636.552-2.9124.056-1.2809.0692-1.6898.063-4.948-.0063-3.2583-.021-3.6668-.0817-4.9465-.0607-1.2797-.264-2.1487-.5633-2.9117-.3084-.7889-.72-1.4568-1.3876-2.1228C21.2982 1.33 20.628.9208 19.8378.6165 19.074.321 18.2017.1197 16.9244.0645 15.6471.0093 15.236-.005 11.977.0014 8.718.0076 8.31.0215 7.0301.0839m.1402 21.6932c-1.17-.0509-1.8053-.2453-2.2287-.408-.5606-.216-.96-.4771-1.3819-.895-.422-.4178-.6811-.8186-.9-1.378-.1644-.4234-.3624-1.058-.4171-2.228-.0595-1.2645-.072-1.6442-.079-4.848-.007-3.2037.0053-3.583.0607-4.848.05-1.169.2456-1.805.408-2.2282.216-.5613.4762-.96.895-1.3816.4188-.4217.8184-.6814 1.3783-.9003.423-.1651 1.0575-.3614 2.227-.4171 1.2655-.06 1.6447-.072 4.848-.079 3.2033-.007 3.5835.005 4.8495.0608 1.169.0508 1.8053.2445 2.228.408.5608.216.96.4754 1.3816.895.4217.4194.6816.8176.9005 1.3787.1653.4217.3617 1.056.4169 2.2263.0602 1.2655.0739 1.645.0796 4.848.0058 3.203-.0055 3.5834-.061 4.848-.051 1.17-.245 1.8055-.408 2.2294-.216.5604-.4763.96-.8954 1.3814-.419.4215-.8181.6811-1.3783.9-.4224.1649-1.0577.3617-2.2262.4174-1.2656.0595-1.6448.072-4.8493.079-3.2045.007-3.5825-.006-4.848-.0608M16.953 5.5864A1.44 1.44 0 1 0 18.39 4.144a1.44 1.44 0 0 0-1.437 1.4424M5.8385 12.012c.0067 3.4032 2.7706 6.1557 6.173 6.1493 3.4026-.0065 6.157-2.7701 6.1506-6.1733-.0065-3.4032-2.771-6.1565-6.174-6.1498-3.403.0067-6.156 2.771-6.1496 6.1738M8 12.0077a4 4 0 1 1 4.008 3.9921A3.9996 3.9996 0 0 1 8 12.0077"/>
+  </svg>`;
+
+export { instagramIcon };

package/dist/pd-icon-brand/dist/icons/linkedin.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** LinkedIn brand icon (24×24, fill=currentColor) */
+const linkedinIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/>
+  </svg>`;
+
+export { linkedinIcon };

package/dist/pd-icon-brand/dist/icons/mastodon.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Mastodon brand icon (24×24, fill=currentColor) */
+const mastodonIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 0 0 .023-.043v-1.809a.052.052 0 0 0-.02-.041.053.053 0 0 0-.046-.01 20.282 20.282 0 0 1-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 0 1-.319-1.433.053.053 0 0 1 .066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z"/>
+  </svg>`;
+
+export { mastodonIcon };

package/dist/pd-icon-brand/dist/icons/medium.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Medium brand icon (24×24, fill=currentColor) */
+const mediumIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M4.21 0A4.201 4.201 0 0 0 0 4.21v15.58A4.201 4.201 0 0 0 4.21 24h15.58A4.201 4.201 0 0 0 24 19.79v-1.093c-.137.013-.278.02-.422.02-2.577 0-4.027-2.146-4.09-4.832a7.592 7.592 0 0 1 .022-.708c.093-1.186.475-2.241 1.105-3.022a3.885 3.885 0 0 1 1.395-1.1c.468-.237 1.127-.367 1.664-.367h.023c.101 0 .202.004.303.01V4.211A4.201 4.201 0 0 0 19.79 0Zm.198 5.583h4.165l3.588 8.435 3.59-8.435h3.864v.146l-.019.004c-.705.16-1.063.397-1.063 1.254h-.003l.003 10.274c.06.676.424.885 1.063 1.03l.02.004v.145h-4.923v-.145l.019-.005c.639-.144.994-.353 1.054-1.03V7.267l-4.745 11.15h-.261L6.15 7.569v9.445c0 .857.358 1.094 1.063 1.253l.02.004v.147H4.405v-.147l.019-.004c.705-.16 1.065-.397 1.065-1.253V6.987c0-.857-.358-1.094-1.064-1.254l-.018-.004z"/>
+  </svg>`;
+
+export { mediumIcon };

package/dist/pd-icon-brand/dist/icons/mixcloud.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Mixcloud brand icon (24×24, fill=currentColor) */
+const mixcloudIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M2.462 8.596l1.372 6.49h.319l1.372-6.49h2.462v6.808H6.742v-5.68l.232-.81h-.402l-1.43 6.49H2.854l-1.44-6.49h-.391l.222.81v5.68H0V8.596zM24 8.63v1.429L21.257 12 24 13.941v1.43l-3.235-2.329h-.348l-3.226 2.329v-1.43l2.734-1.94-2.733-1.942V8.63l3.225 2.338h.348zm-7.869 2.75v1.24H9.304v-1.24z"/>
+  </svg>`;
+
+export { mixcloudIcon };

package/dist/pd-icon-brand/dist/icons/patreon.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Patreon brand icon (24×24, fill=currentColor) */
+const patreonIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M22.957 7.21c-.004-3.064-2.391-5.576-5.191-6.482-3.478-1.125-8.064-.962-11.384.604C2.357 3.231 1.093 7.391 1.046 11.54c-.039 3.411.302 12.396 5.369 12.46 3.765.047 4.326-4.804 6.068-7.141 1.24-1.662 2.836-2.132 4.801-2.618 3.376-.836 5.678-3.501 5.673-7.031Z"/>
+  </svg>`;
+
+export { patreonIcon };

package/dist/pd-icon-brand/dist/icons/pinterest.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Pinterest brand icon (24×24, fill=currentColor) */
+const pinterestIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M12.017 0C5.396 0 .029 5.367.029 11.987c0 5.079 3.158 9.417 7.618 11.162-.105-.949-.199-2.403.041-3.439.219-.937 1.406-5.957 1.406-5.957s-.359-.72-.359-1.781c0-1.663.967-2.911 2.168-2.911 1.024 0 1.518.769 1.518 1.688 0 1.029-.653 2.567-.992 3.992-.285 1.193.6 2.165 1.775 2.165 2.128 0 3.768-2.245 3.768-5.487 0-2.861-2.063-4.869-5.008-4.869-3.41 0-5.409 2.562-5.409 5.199 0 1.033.394 2.143.889 2.741.099.12.112.225.085.345-.09.375-.293 1.199-.334 1.363-.053.225-.172.271-.401.165-1.495-.69-2.433-2.878-2.433-4.646 0-3.776 2.748-7.252 7.92-7.252 4.158 0 7.392 2.967 7.392 6.923 0 4.135-2.607 7.462-6.233 7.462-1.214 0-2.354-.629-2.758-1.379l-.749 2.848c-.269 1.045-1.004 2.352-1.498 3.146 1.123.345 2.306.535 3.55.535 6.607 0 11.985-5.365 11.985-11.987C23.97 5.39 18.592.026 11.985.026L12.017 0z"/>
+  </svg>`;
+
+export { pinterestIcon };

package/dist/pd-icon-brand/dist/icons/reddit.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Reddit brand icon (24×24, fill=currentColor) */
+const redditIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M12 0C5.373 0 0 5.373 0 12c0 3.314 1.343 6.314 3.515 8.485l-2.286 2.286C.775 23.225 1.097 24 1.738 24H12c6.627 0 12-5.373 12-12S18.627 0 12 0Zm4.388 3.199c1.104 0 1.999.895 1.999 1.999 0 1.105-.895 2-1.999 2-.946 0-1.739-.657-1.947-1.539v.002c-1.147.162-2.032 1.15-2.032 2.341v.007c1.776.067 3.4.567 4.686 1.363.473-.363 1.064-.58 1.707-.58 1.547 0 2.802 1.254 2.802 2.802 0 1.117-.655 2.081-1.601 2.531-.088 3.256-3.637 5.876-7.997 5.876-4.361 0-7.905-2.617-7.998-5.87-.954-.447-1.614-1.415-1.614-2.538 0-1.548 1.255-2.802 2.803-2.802.645 0 1.239.218 1.712.585 1.275-.79 2.881-1.291 4.64-1.365v-.01c0-1.663 1.263-3.034 2.88-3.207.188-.911.993-1.595 1.959-1.595Zm-8.085 8.376c-.784 0-1.459.78-1.506 1.797-.047 1.016.64 1.429 1.426 1.429.786 0 1.371-.369 1.418-1.385.047-1.017-.553-1.841-1.338-1.841Zm7.406 0c-.786 0-1.385.824-1.338 1.841.047 1.017.634 1.385 1.418 1.385.785 0 1.473-.413 1.426-1.429-.046-1.017-.721-1.797-1.506-1.797Zm-3.703 4.013c-.974 0-1.907.048-2.77.135-.147.015-.241.168-.183.305.483 1.154 1.622 1.964 2.953 1.964 1.33 0 2.47-.81 2.953-1.964.057-.137-.037-.29-.184-.305-.863-.087-1.795-.135-2.769-.135Z"/>
+  </svg>`;
+
+export { redditIcon };

package/dist/pd-icon-brand/dist/icons/snapchat.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Snapchat brand icon (24×24, fill=currentColor) */
+const snapchatIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M12.206.793c.99 0 4.347.276 5.93 3.821.529 1.193.403 3.219.299 4.847l-.003.06c-.012.18-.022.345-.03.51.075.045.203.09.401.09.3-.016.659-.12 1.033-.301.165-.088.344-.104.464-.104.182 0 .359.029.509.09.45.149.734.479.734.838.015.449-.39.839-1.213 1.168-.089.029-.209.075-.344.119-.45.135-1.139.36-1.333.81-.09.224-.061.524.12.868l.015.015c.06.136 1.526 3.475 4.791 4.014.255.044.435.27.42.509 0 .075-.015.149-.045.225-.24.569-1.273.988-3.146 1.271-.059.091-.12.375-.164.57-.029.179-.074.36-.134.553-.076.271-.27.405-.555.405h-.03c-.135 0-.313-.031-.538-.074-.36-.075-.765-.135-1.273-.135-.3 0-.599.015-.913.074-.6.104-1.123.464-1.723.884-.853.599-1.826 1.288-3.294 1.288-.06 0-.119-.015-.18-.015h-.149c-1.468 0-2.427-.675-3.279-1.288-.599-.42-1.107-.779-1.707-.884-.314-.045-.629-.074-.928-.074-.54 0-.958.089-1.272.149-.211.043-.391.074-.54.074-.374 0-.523-.224-.583-.42-.061-.192-.09-.389-.135-.567-.046-.181-.105-.494-.166-.57-1.918-.222-2.95-.642-3.189-1.226-.031-.063-.052-.15-.055-.225-.015-.243.165-.465.42-.509 3.264-.54 4.73-3.879 4.791-4.02l.016-.029c.18-.345.224-.645.119-.869-.195-.434-.884-.658-1.332-.809-.121-.029-.24-.074-.346-.119-1.107-.435-1.257-.93-1.197-1.273.09-.479.674-.793 1.168-.793.146 0 .27.029.383.074.42.194.789.3 1.104.3.234 0 .384-.06.465-.105l-.046-.569c-.098-1.626-.225-3.651.307-4.837C7.392 1.077 10.739.807 11.727.807l.419-.015h.06z"/>
+  </svg>`;
+
+export { snapchatIcon };

package/dist/pd-icon-brand/dist/icons/soundcloud.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** SoundCloud brand icon (24×24, fill=currentColor) */
+const soundcloudIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M23.999 14.165c-.052 1.796-1.612 3.169-3.4 3.169h-8.18a.68.68 0 0 1-.675-.683V7.862a.747.747 0 0 1 .452-.724s.75-.513 2.333-.513a5.364 5.364 0 0 1 2.763.755 5.433 5.433 0 0 1 2.57 3.54c.282-.08.574-.121.868-.12.884 0 1.73.358 2.347.992s.948 1.49.922 2.373ZM10.721 8.421c.247 2.98.427 5.697 0 8.672a.264.264 0 0 1-.53 0c-.395-2.946-.22-5.718 0-8.672a.264.264 0 0 1 .53 0ZM9.072 9.448c.285 2.659.37 4.986-.006 7.655a.277.277 0 0 1-.55 0c-.331-2.63-.256-5.02 0-7.655a.277.277 0 0 1 .556 0Zm-1.663-.257c.27 2.726.39 5.171 0 7.904a.266.266 0 0 1-.532 0c-.38-2.69-.257-5.21 0-7.904a.266.266 0 0 1 .532 0Zm-1.647.77a26.108 26.108 0 0 1-.008 7.147.272.272 0 0 1-.542 0 27.955 27.955 0 0 1 0-7.147.275.275 0 0 1 .55 0Zm-1.67 1.769c.421 1.865.228 3.5-.029 5.388a.257.257 0 0 1-.514 0c-.21-1.858-.398-3.549 0-5.389a.272.272 0 0 1 .543 0Zm-1.655-.273c.388 1.897.26 3.508-.01 5.412-.026.28-.514.283-.54 0-.244-1.878-.347-3.54-.01-5.412a.283.283 0 0 1 .56 0Zm-1.668.911c.4 1.268.257 2.292-.026 3.572a.257.257 0 0 1-.514 0c-.241-1.262-.354-2.312-.023-3.572a.283.283 0 0 1 .563 0Z"/>
+  </svg>`;
+
+export { soundcloudIcon };

package/dist/pd-icon-brand/dist/icons/spotify.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Spotify brand icon (24×24, fill=currentColor) */
+const spotifyIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.599-1.559.3z"/>
+  </svg>`;
+
+export { spotifyIcon };

package/dist/pd-icon-brand/dist/icons/stackoverflow.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Stack Overflow brand icon (24×24, fill=currentColor) */
+const stackoverflowIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M15.725 0l-1.72 1.277 6.39 8.588 1.716-1.277L15.725 0zm-3.94 3.418l-1.369 1.644 8.225 6.85 1.369-1.644-8.225-6.85zm-3.15 4.465l-.905 1.94 9.702 4.517.904-1.94-9.701-4.517zm-1.85 4.86l-.44 2.093 10.473 2.201.44-2.092-10.473-2.203zM1.89 15.47V24h19.19v-8.53h-2.133v6.397H4.021v-6.396H1.89zm4.265 2.133v2.13h10.66v-2.13H6.154Z"/>
+  </svg>`;
+
+export { stackoverflowIcon };

package/dist/pd-icon-brand/dist/icons/telegram.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Telegram brand icon (24×24, fill=currentColor) */
+const telegramIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/>
+  </svg>`;
+
+export { telegramIcon };

package/dist/pd-icon-brand/dist/icons/threads.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Threads brand icon (24×24, fill=currentColor) */
+const threadsIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M12.186 24h-.007c-3.581-.024-6.334-1.205-8.184-3.509C2.35 18.44 1.5 15.586 1.472 12.01v-.017c.03-3.579.879-6.43 2.525-8.482C5.845 1.205 8.6.024 12.18 0h.014c2.746.02 5.043.725 6.826 2.098 1.677 1.29 2.858 3.13 3.509 5.467l-2.04.569c-1.104-3.96-3.898-5.984-8.304-6.015-2.91.022-5.11.936-6.54 2.717C4.307 6.504 3.616 8.914 3.589 12c.027 3.086.718 5.496 2.057 7.164 1.43 1.783 3.631 2.698 6.54 2.717 2.623-.02 4.358-.631 5.8-2.045 1.647-1.613 1.618-3.593 1.09-4.798-.31-.71-.873-1.3-1.634-1.75-.192 1.352-.622 2.446-1.284 3.272-.886 1.102-2.14 1.704-3.73 1.79-1.202.065-2.361-.218-3.259-.801-1.063-.689-1.685-1.74-1.752-2.964-.065-1.19.408-2.285 1.33-3.082.88-.76 2.119-1.207 3.583-1.291a13.853 13.853 0 0 1 3.02.142c-.126-.742-.375-1.332-.75-1.757-.513-.586-1.308-.883-2.359-.89h-.029c-.844 0-1.992.232-2.721 1.32L7.734 7.847c.98-1.454 2.568-2.256 4.478-2.256h.044c3.194.02 5.097 1.975 5.287 5.388.108.046.216.094.321.142 1.49.7 2.58 1.761 3.154 3.07.797 1.82.871 4.79-1.548 7.158-1.85 1.81-4.094 2.628-7.277 2.65Zm1.003-11.69c-.242 0-.487.007-.739.021-1.836.103-2.98.946-2.916 2.143.067 1.256 1.452 1.839 2.784 1.767 1.224-.065 2.818-.543 3.086-3.71a10.5 10.5 0 0 0-2.215-.221z"/>
+  </svg>`;
+
+export { threadsIcon };

package/dist/pd-icon-brand/dist/icons/tiktok.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** TikTok brand icon (24×24, fill=currentColor) */
+const tiktokIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M12.525.02c1.31-.02 2.61-.01 3.91-.02.08 1.53.63 3.09 1.75 4.17 1.12 1.11 2.7 1.62 4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97-.57-.26-1.1-.59-1.62-.93-.01 2.92.01 5.84-.02 8.75-.08 1.4-.54 2.79-1.35 3.94-1.31 1.92-3.58 3.17-5.91 3.21-1.43.08-2.86-.31-4.08-1.03-2.02-1.19-3.44-3.37-3.65-5.71-.02-.5-.03-1-.01-1.49.18-1.9 1.12-3.72 2.58-4.96 1.66-1.44 3.98-2.13 6.15-1.72.02 1.48-.04 2.96-.04 4.44-.99-.32-2.15-.23-3.02.37-.63.41-1.11 1.04-1.36 1.75-.21.51-.15 1.07-.14 1.61.24 1.64 1.82 3.02 3.5 2.87 1.12-.01 2.19-.66 2.77-1.61.19-.33.4-.67.41-1.06.1-1.79.06-3.57.07-5.36.01-4.03-.01-8.05.02-12.07z"/>
+  </svg>`;
+
+export { tiktokIcon };

package/dist/pd-icon-brand/dist/icons/twitch.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Twitch brand icon (24×24, fill=currentColor) */
+const twitchIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M11.571 4.714h1.715v5.143H11.57zm4.715 0H18v5.143h-1.714zM6 0L1.714 4.286v15.428h5.143V24l4.286-4.286h3.428L22.286 12V0zm14.571 11.143l-3.428 3.428h-3.429l-3 3v-3H6.857V1.714h13.714Z"/>
+  </svg>`;
+
+export { twitchIcon };

package/dist/pd-icon-brand/dist/icons/vimeo.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Vimeo brand icon (24×24, fill=currentColor) */
+const vimeoIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M23.9765 6.4168c-.105 2.338-1.739 5.5429-4.894 9.6088-3.2679 4.247-6.0258 6.3699-8.2898 6.3699-1.409 0-2.578-1.294-3.553-3.881l-1.9179-7.1138c-.719-2.584-1.488-3.878-2.312-3.878-.179 0-.806.378-1.8809 1.132l-1.129-1.457a315.06 315.06 0 003.501-3.1279c1.579-1.368 2.765-2.085 3.5539-2.159 1.867-.18 3.016 1.1 3.447 3.838.465 2.953.789 4.789.971 5.5069.5389 2.45 1.1309 3.674 1.7759 3.674.502 0 1.256-.796 2.265-2.385 1.004-1.589 1.54-2.797 1.612-3.628.144-1.371-.395-2.061-1.614-2.061-.574 0-1.167.121-1.777.391 1.186-3.8679 3.434-5.7568 6.7619-5.6368 2.4729.06 3.6279 1.664 3.4929 4.7969z"/>
+  </svg>`;
+
+export { vimeoIcon };

package/dist/pd-icon-brand/dist/icons/whatsapp.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** WhatsApp brand icon (24×24, fill=currentColor) */
+const whatsappIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413Z"/>
+  </svg>`;
+
+export { whatsappIcon };

package/dist/pd-icon-brand/dist/icons/x-twitter.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** X (formerly Twitter) brand icon (24×24, fill=currentColor) */
+const xTwitterIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M14.234 10.162 22.977 0h-2.072l-7.591 8.824L7.251 0H.258l9.168 13.343L.258 24H2.33l8.016-9.318L16.749 24h6.993zm-2.837 3.299-.929-1.329L3.076 1.56h3.182l5.965 8.532.929 1.329 7.754 11.09h-3.182z"/>
+  </svg>`;
+
+export { xTwitterIcon };

package/dist/pd-icon-brand/dist/icons/xing.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** Xing brand icon (24×24, fill=currentColor) */
+const xingIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M18.188 0c-.517 0-.741.325-.927.66 0 0-7.455 13.224-7.702 13.657.015.024 4.919 9.023 4.919 9.023.17.308.436.66.967.66h3.454c.211 0 .375-.078.463-.22.089-.151.089-.346-.009-.536l-4.879-8.916c-.004-.006-.004-.016 0-.022L22.139.756c.095-.191.097-.387.006-.535C22.056.078 21.894 0 21.686 0h-3.498zM3.648 4.74c-.211 0-.385.074-.473.216-.09.149-.078.339.02.531l2.34 4.05c.004.01.004.016 0 .021L1.86 16.051c-.099.188-.093.381 0 .529.085.142.239.234.45.234h3.461c.518 0 .766-.348.945-.667l3.734-6.609-2.378-4.155c-.172-.315-.434-.659-.962-.659H3.648v.016z"/>
+  </svg>`;
+
+export { xingIcon };

package/dist/pd-icon-brand/dist/icons/youtube.js

@@ -0,0 +1,9 @@
+import { svg } from 'lit';
+
+/** YouTube brand icon (24×24, fill=currentColor) */
+const youtubeIcon = svg `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+    <path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/>
+  </svg>`;
+
+export { youtubeIcon };

package/dist/pd-menu/PdMenu.d.ts

@@ -30,8 +30,12 @@ import { ButtonData } from '@progressive-development/pd-forms';
  * @cssprop --pd-menu-burger-top - Burger menu top offset. Default: `var(--pd-menu-height)`.
  * @cssprop --pd-menu-burger-font-col - Burger menu text color. Default: `var(--pd-default-font-link-col)`.
  * @cssprop --pd-menu-logo-maxwidth - Logo max width. Default: `8rem`.
- * @cssprop --pd-menu-logo-padding - Logo padding. Default: `2em`.
+ * @cssprop --pd-menu-logo-padding - Logo padding. Default: `0 1.5rem 0 0`.
  * @cssprop --pd-menu-logo-color - Logo fill color. Default: `#067394`.
+ * @cssprop --pd-menu-logo-scale - Logo scale factor (transform). Default: `1`.
+ * @cssprop --pd-menu-content-offset-y - Vertical offset for logo and menu items. Useful to visually lift content when a top-menu bar sits above. Default: `0`.
+ * @cssprop --pd-menu-gradient - Gradient overlay when bgImage is set. Default: `none`.
+ * @cssprop --pd-menu-text-shadow - Text shadow for menu items (useful with background images). Default: `none`.
  */
 export declare class PdMenu extends LitElement {
     /** Currently active route for highlighting. */
@@ -48,6 +52,8 @@ export declare class PdMenu extends LitElement {
     topMenuItems: PdMenuItem[];
     /** Disable responsive burger menu. */
     noBurgerMenu: boolean;
+    /** Background image URL. Renders an image layer with optional gradient overlay. */
+    bgImage: string;
     /**
      * Index des aktiven Inhaltsbereichs (bei Scroll)
      * @ignore */

package/dist/pd-menu/PdMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PdMenu.d.ts","sourceRoot":"","sources":["../../src/pd-menu/PdMenu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAO5D,OAAO,0CAA0C,CAAC;AAClD,OAAO,0DAA0D,CAAC;AAElE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAEpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,qBACa,MAAO,SAAQ,UAAU;IACpC,+CAA+C;IAE/C,WAAW,SAAM;IAEjB,2DAA2D;IAE3D,cAAc,SAAM;IAEpB,uCAAuC;IAEvC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,8EAA8E;IAE9E,OAAO,EAAE,UAAU,EAAE,CAAM;IAE3B,yBAAyB;IAEzB,SAAS,EAAE,UAAU,EAAE,CAAM;IAE7B,sCAAsC;IAEtC,YAAY,EAAE,UAAU,EAAE,CAAM;IAEhC,sCAAsC;IAEtC,YAAY,UAAS;IAErB;;iBAEa;IAEb,OAAO,CAAC,eAAe,CAAK;IAE5B;;iBAEa;IAEb,OAAO,CAAC,iBAAiB,CAAS;IAElC;;iBAEa;IAEb,OAAO,CAAC,YAAY,CAAS;IAE7B,cAAc;IACd,OAAO,CAAC,eAAe,CAAC,CAAiB;IAEzC,cAAc;IACd,OAAO,CAAC,mBAAmB,CAAiC;IAE5D,cAAc;IACd,OAAO,CAAC,uBAAuB,CAAqC;IAEpE,OAAgB,MAAM,EAAE,cAAc,CAgOpC;IAEO,iBAAiB;IAiBjB,oBAAoB;IAe7B,OAAO,CAAC,QAAQ,CAAS;IAEzB,OAAO,CAAC,aAAa;IAWrB,OAAO,CAAC,iBAAiB;IAIzB,OAAO,CAAC,oBAAoB;IA0D5B,MAAM;IAqFN,OAAO,CAAC,YAAY;IAgCpB;;OAEG;IACH,OAAO,CAAC,sBAAsB;IAO9B;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAU5B,OAAO,CAAC,iBAAiB;IAIzB;;OAEG;IACH,OAAO,CAAC,uBAAuB;IAI/B;;;OAGG;IACH,OAAO,CAAC,kBAAkB;IAO1B;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAc3B,OAAO,CAAC,gBAAgB;IA8CxB,OAAO,CAAC,YAAY;IAgBpB,OAAO,CAAC,MAAM,CAAC,YAAY;CAG5B"}
+{"version":3,"file":"PdMenu.d.ts","sourceRoot":"","sources":["../../src/pd-menu/PdMenu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAO5D,OAAO,0CAA0C,CAAC;AAClD,OAAO,0DAA0D,CAAC;AAElE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAEpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,qBACa,MAAO,SAAQ,UAAU;IACpC,+CAA+C;IAE/C,WAAW,SAAM;IAEjB,2DAA2D;IAE3D,cAAc,SAAM;IAEpB,uCAAuC;IAEvC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,8EAA8E;IAE9E,OAAO,EAAE,UAAU,EAAE,CAAM;IAE3B,yBAAyB;IAEzB,SAAS,EAAE,UAAU,EAAE,CAAM;IAE7B,sCAAsC;IAEtC,YAAY,EAAE,UAAU,EAAE,CAAM;IAEhC,sCAAsC;IAEtC,YAAY,UAAS;IAErB,mFAAmF;IAEnF,OAAO,SAAM;IAEb;;iBAEa;IAEb,OAAO,CAAC,eAAe,CAAK;IAE5B;;iBAEa;IAEb,OAAO,CAAC,iBAAiB,CAAS;IAElC;;iBAEa;IAEb,OAAO,CAAC,YAAY,CAAS;IAE7B,cAAc;IACd,OAAO,CAAC,eAAe,CAAC,CAAiB;IAEzC,cAAc;IACd,OAAO,CAAC,mBAAmB,CAAiC;IAE5D,cAAc;IACd,OAAO,CAAC,uBAAuB,CAAqC;IAEpE,OAAgB,MAAM,EAAE,cAAc,CA0PpC;IAEO,iBAAiB;IAiBjB,oBAAoB;IAe7B,OAAO,CAAC,QAAQ,CAAS;IAEzB,OAAO,CAAC,aAAa;IAWrB,OAAO,CAAC,iBAAiB;IAIzB,OAAO,CAAC,oBAAoB;IA0D5B,MAAM;IA8FN,OAAO,CAAC,YAAY;IAgCpB;;OAEG;IACH,OAAO,CAAC,sBAAsB;IAO9B;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAU5B,OAAO,CAAC,iBAAiB;IAIzB;;OAEG;IACH,OAAO,CAAC,uBAAuB;IAI/B;;;OAGG;IACH,OAAO,CAAC,kBAAkB;IAO1B;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAc3B,OAAO,CAAC,gBAAgB;IA8CxB,OAAO,CAAC,YAAY;IAgBpB,OAAO,CAAC,MAAM,CAAC,YAAY;CAG5B"}

package/dist/pd-menu/PdMenu.js

@@ -25,6 +25,7 @@ let PdMenu = class extends LitElement {
     this.menuItems = [];
     this.topMenuItems = [];
     this.noBurgerMenu = false;
+    this.bgImage = "";
     this._activeSecIndex = 0;
     this._activeBurgerMenu = false;
     this._smallScreen = false;
@@ -109,6 +110,13 @@ let PdMenu = class extends LitElement {
   }
   render() {
     return html`
+      ${this.bgImage ? html`
+            <div
+              class="menu-bg"
+              style="background-image: url('${this.bgImage}')"
+            ></div>
+            <div class="menu-bg-gradient"></div>
+          ` : ""}
       <nav
         class="menu-container"
         aria-label="${msg("Hauptnavigation", { id: "pd.menu.nav.aria" })}"
@@ -324,7 +332,7 @@ PdMenu.styles = [
         display: block;
         position: relative;
         height: var(--pd-menu-height, 100px);
-        background-color: var(--pd-menu-bg-col, var(--pd-default-col));
+        background: var(--pd-menu-bg-col, var(--pd-default-col));
         box-shadow: var(--pd-menu-shadow, var(--pd-shadow-lg));
         border-radius: var(--pd-menu-border-radius, 0);
         /*
@@ -342,6 +350,29 @@ PdMenu.styles = [
         border-radius: 0;
       }
 
+      /* Background image layer */
+      .menu-bg {
+        position: absolute;
+        inset: 0;
+        background-size: cover;
+        background-position: center;
+        border-radius: var(--pd-menu-border-radius, 0);
+        z-index: 0;
+      }
+
+      .menu-bg-gradient {
+        position: absolute;
+        inset: 0;
+        background: var(--pd-menu-gradient, none);
+        border-radius: var(--pd-menu-border-radius, 0);
+        z-index: 1;
+      }
+
+      :host([bg-image]) .menu-container {
+        position: relative;
+        z-index: 2;
+      }
+
       .menu-container {
         height: 100%;
         padding-left: var(--pd-spacing-md, 1rem);
@@ -362,6 +393,7 @@ PdMenu.styles = [
         align-items: center;
         list-style: none;
         margin: 0;
+        margin-top: var(--pd-menu-content-offset-y, 0);
         padding: 0;
       }
 
@@ -431,6 +463,7 @@ PdMenu.styles = [
         font-size: var(--pd-menu-font-size, 1.2em);
         font-weight: var(--pd-menu-font-weight, bold);
         padding: var(--pd-menu-item-padding, 0.6em);
+        text-shadow: var(--pd-menu-text-shadow, none);
       }
 
       .burger-item {
@@ -514,11 +547,12 @@ PdMenu.styles = [
       /* Doppelt zum logo-container, pd-logo sonst nicht mehr funktional
         */
       ::slotted(.logo) {
-        width: 100%;
         max-width: var(--pd-menu-logo-maxwidth, 8rem);
-        padding: var(--pd-menu-logo-padding, 2em);
+        padding: var(--pd-menu-logo-padding, 0 1.5rem 0 0);
         fill: var(--pd-menu-logo-color, #067394);
         cursor: pointer;
+        margin-top: var(--pd-menu-content-offset-y, 0);
+        zoom: var(--pd-menu-logo-scale, 1);
       }
 
       /* Locale selector styling */
@@ -564,6 +598,9 @@ __decorateClass([
 __decorateClass([
   property({ type: Boolean })
 ], PdMenu.prototype, "noBurgerMenu", 2);
+__decorateClass([
+  property({ type: String, reflect: true, attribute: "bg-image" })
+], PdMenu.prototype, "bgImage", 2);
 __decorateClass([
   state()
 ], PdMenu.prototype, "_activeSecIndex", 2);