/* Header nav — LARGE, no mix-blend (was making text invisible/ghosted) */
@font-face{
  font-family: Helixa;
  src: url("/wp-content/themes/geist/dist/assets/Helixa-Bold-DjDvoSv_.woff2") format("woff2"),
       url("/wp-content/themes/geist/dist/assets/Helixa-Bold-Bg4xKTBu.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/*
  Helixa app.js clones #siteHeader → #siteHeaderWhite for a scroll/blend reveal.
  Our size bump only targeted #siteHeader (40px), so the clone stayed at 22px
  and both layers showed at once → doubled tiny-on-large text.
*/
#siteHeaderWhite {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

#siteHeader {
  mix-blend-mode: normal !important;
}

#siteHeader .navbar-link,
#siteHeader a.navbar-link,
#menu-primary-menu a {
  font-family: Helixa, Arial, Helvetica, sans-serif !important;
  font-size: 40px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  color: #ffffff !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  mix-blend-mode: normal !important;
}

#siteHeader .brand-wordmark {
  font-family: Helixa, Arial, Helvetica, sans-serif !important;
  font-size: 40px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  display: inline-block !important;
  white-space: nowrap !important;
  letter-spacing: -0.02em;
  mix-blend-mode: normal !important;
}
#siteHeader .brand-star {
  display: inline-block;
  transform: translateY(-0.12em);
  margin: 0 2px;
}

#siteHeader a[aria-label="Clearform Studio"] {
  display: inline-flex !important;
  align-items: center !important;
  text-decoration: none !important;
  mix-blend-mode: normal !important;
}

#siteHeader svg,
#siteHeader img {
  mix-blend-mode: normal !important;
  filter: none !important;
}

#menu-primary-menu {
  gap: 32px !important;
}

#siteHeader.fixed {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

.footer-link {
  font-family: Helixa, Arial, Helvetica, sans-serif !important;
  font-size: 28px !important;
  font-weight: 700 !important;
}

.mobile-links {
  font-family: Helixa, Arial, Helvetica, sans-serif !important;
  font-size: 48px !important;
  font-weight: 700 !important;
}

@media (max-width: 767px) {
  #siteHeader .navbar-link,
  #menu-primary-menu a,
  #siteHeader .brand-wordmark { font-size: 24px !important; }
}
