.social-link.social-copy {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--on-surface);
  font-size: 14px;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  text-transform: lowercase;
  transition: all 0.2s ease;
}

.social-link.social-copy:hover {
  color: var(--primary);
  text-decoration: underline;
}

.contact-social-item.social-copy {
  background: var(--surface-container-low);
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  width: 100%;
}

.contact-social-item.social-copy:hover {
  background: var(--surface-container);
  border-color: var(--outline);
}
:root {
  --primary: #00FF00;
  --on-primary: #381e72;
  --primary-container: #4f378b;
  --on-primary-container: #eaddff;

  --secondary: #cbc2db;
  --on-secondary: #332d41;
  --secondary-container: #4a4458;
  --on-secondary-container: #e8def8;

  --tertiary: #efb8c8;
  --on-tertiary: #492532;
  --tertiary-container: #633b48;
  --on-tertiary-container: #ffd8e4;

  --error: #ffb4ab;
  --on-error: #690005;
  --error-container: #93000a;
  --on-error-container: #ffdad6;

  --surface: #000000;
  --on-surface: #e6e0e9;
  --on-surface-variant: #cac4d0;

  --surface-container-lowest: #262626;
  --surface-container-low: #3D3D3D;
  --surface-container: #4F4F4F;
  --surface-container-high: #5C5C5C;
  --surface-container-highest: #BABABA;

  --outline: #938f99;
  --outline-variant: #49454f;
}
.footer-credit {
  margin: 0 0 16px 0;
  font-size: 14px;
  color: var(--on-surface-variant);
}
.content h2,
.content h3,
.content h4,
.intro h2 {
  color: var(--primary);
}
.content table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  font-size: 16px;
  line-height: 1.5;
  color: var(--on-surface);
}

.content th,
.content td {
  border: 1px solid var(--outline);
  padding: 8px 12px;
  text-align: left;
}

.content th {
  font-weight: 600;
}
.custom {
    background: red;
}