/* ── Credit „Mit ♥ gemacht von Paul Reingruber · 3D Print & Media“ ──
   Gleicher Baustein auf allen von Paul betreuten Seiten. Übernimmt Schrift und
   Linkfarbe der Umgebung. Beim Überfahren zeichnet sich das PR-Zeichen neu und
   das Herz schlägt einmal. Varianten: pr-credit--line (einzeilig),
   pr-credit--mono (einfarbig, braucht --pr-credit-cut = Hintergrundfarbe). */
.pr-credit { display: inline-flex; align-items: center; gap: .65em; color: inherit; text-decoration: none; line-height: 1.25; text-align: left; }
.pr-credit__mark { flex: none; width: 2.1em; height: 2.1em; }
.pr-credit__mark rect { fill: #234de0; }
.pr-credit__mark path { fill: none; stroke: #fff; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.pr-credit__text { display: flex; flex-direction: column; }
.pr-credit__by { font-weight: 600; }
.pr-credit__tag { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .82em; letter-spacing: .12em; text-transform: uppercase; opacity: .72; }
.pr-credit__love { display: inline-block; width: .9em; height: .9em; vertical-align: -.1em; margin-inline: .05em; }
.pr-credit__love path { fill: currentColor; transition: fill .2s; }
.pr-credit:hover .pr-credit__by,
.pr-credit:focus-visible .pr-credit__by { text-decoration: underline; text-underline-offset: .2em; }
.pr-credit:hover .pr-credit__love path { fill: #e5484d; }

.pr-credit--line .pr-credit__mark { width: 1.5em; height: 1.5em; }
.pr-credit--line .pr-credit__text { flex-direction: row; flex-wrap: wrap; align-items: baseline; column-gap: .6em; }
.pr-credit--mono .pr-credit__mark rect { fill: currentColor; }
.pr-credit--mono .pr-credit__mark path { stroke: var(--pr-credit-cut, #fff); }

@media (prefers-reduced-motion: no-preference) {
  .pr-credit:hover .pr-credit__mark path { animation: pr-credit-print .45s cubic-bezier(.5, 0, .5, 1) both; }
  .pr-credit:hover .pr-credit__mark path + path { animation-delay: .35s; }
  .pr-credit:hover .pr-credit__mark path + path + path { animation-delay: .7s; }
  .pr-credit:hover .pr-credit__love { animation: pr-credit-beat .7s ease-in-out; }
}
@keyframes pr-credit-print { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes pr-credit-beat { 30% { transform: scale(1.3); } 60% { transform: scale(.94); } }