/* ============================================================
   fazz. — service chip colors + tags
   One hue per service type, shared by work.html + project.html
   ============================================================ */
.sv-web      { --sv: oklch(0.52 0.20 295); }
.sv-redesign { --sv: oklch(0.58 0.18 305); }
.sv-shop     { --sv: oklch(0.62 0.16 300); }
.sv-social   { --sv: oklch(0.55 0.22 310); }
.sv-ads      { --sv: oklch(0.48 0.19 290); }
.sv-email    { --sv: oklch(0.60 0.14 300); }
.sv-booking  { --sv: oklch(0.50 0.16 315); }
.sv-care     { --sv: oklch(0.45 0.08 295); }
.sv-it       { --sv: oklch(0.42 0.13 290); }

.sv-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 600; letter-spacing: .01em;
  padding: 5px 11px; border-radius: 100px; white-space: nowrap;
  color: var(--sv);
  background: color-mix(in oklab, var(--sv) 9%, #fff);
  border: 1px solid color-mix(in oklab, var(--sv) 25%, #fff);
}
.sv-chip::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--sv); }
.sv-chip.soon { opacity: .68; border-style: dashed; }

.pj-tag {
  display: inline-flex; align-items: center;
  font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: #fff; background: var(--sv, var(--violet));
  padding: 6px 14px; border-radius: 100px;
}