/* =====================================================================
   Logo GH · prata com letras desgastadas, como a logo da barbearia.
   Usada no topo, na abertura e no rodapé.
   ===================================================================== */
:root {
  --silver: linear-gradient(135deg, #ffffff 0%, #C9E3D1 28%, #F2F8F4 48%, #8FB39B 70%, #DCEBE0 100%);
  --silver-solid: #CFE0D5;
  /* textura de letra desgastada (manchas), usada como máscara na marca */
  --distress: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='d'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.6' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 -6 4.3'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23d)'/%3E%3C/svg%3E");
}

/* o desgaste acompanha o tamanho da letra (em "em") */
.wordmark { -webkit-mask-image: var(--distress); mask-image: var(--distress); -webkit-mask-size: 9em 9em; mask-size: 9em 9em; }
.wordmark__gh { background: var(--silver); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wordmark__name { color: #EFF6F1; border-left-color: var(--silver-solid); }
.wordmark--stack .wordmark__name { font-size: .3em; letter-spacing: .32em; line-height: 1.12; }
.wordmark--img { -webkit-mask-image: none; mask-image: none; }
.wordmark--img img { height: 1.25em; width: auto; }

/* no topo a marca é pequena: prata limpa, sem desgaste, para ficar legível */
.brand { font-size: 2.5rem; -webkit-mask-image: none; mask-image: none; }
.brand .wordmark__name { font-size: .31em; font-weight: 600; letter-spacing: .3em; }
.footer__brand { font-size: 3rem; }