/* Header letters fill on scroll. Hero and footer stay plain ink. */
.hero-title,
.footer-mark {
  white-space: nowrap;
  color: var(--ink);
  -webkit-text-fill-color: var(--ink);
  background: none;
}

.logo-mark {
  position: relative;
  display: inline-block;
  white-space: nowrap;
  color: var(--ink);
}

.logo-mark::after {
  content: 'Vuebb';
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  white-space: nowrap;
  pointer-events: none;
  border: 0;
  outline: none;
  box-shadow: none;
  filter: none;
  color: transparent;
  -webkit-text-fill-color: transparent;
  background-color: transparent;
  background-image: linear-gradient(90deg, var(--magenta), var(--lime));
  background-repeat: no-repeat;
  background-size: 100% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  clip-path: inset(0 calc(100% - var(--logo-fill, 0%)) 0 0);
}

.footer-cookie-btn {
  color: var(--muted);
  font-size: 0.82rem;
  transition: color 0.35s var(--ease);
}

.footer-cookie-btn:hover {
  color: var(--lime);
}