.header-client-logo {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 9px;
  background: #fff;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.72), 0 6px 18px rgba(1, 8, 13, 0.28);
  object-fit: contain;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
}

/* The generated homepage still contains the former SVG mark. Render the
   customer mark from CSS so the correct logo is present on the first paint. */
.site-header a[aria-label="Arcanum Media, home"][href="#home"] > svg:first-child {
  display: none;
}

.site-header a[aria-label="Arcanum Media, home"][href="#home"]::before {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 9px;
  background: #fff url("/assets/malta-header-logo.svg") center / contain no-repeat;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.72), 0 6px 18px rgba(1, 8, 13, 0.28);
  content: "";
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
}

.site-header a:hover .header-client-logo,
.site-header a:focus-visible .header-client-logo {
  border-color: rgba(176, 30, 37, 0.72);
  transform: translateY(-1px);
}

.site-header a[aria-label="Arcanum Media, home"][href="#home"]:hover::before,
.site-header a[aria-label="Arcanum Media, home"][href="#home"]:focus-visible::before {
  border-color: rgba(176, 30, 37, 0.72);
  transform: translateY(-1px);
}

/* Reserve the final Hiring item before the homepage enhancement runs. The
   pseudo item and the real link have identical metrics, preventing reflow. */
.site-header nav[aria-label="Primary navigation"]::after {
  order: 7;
  color: #dce3e5;
  padding-block: 1.65rem;
  content: "Hiring";
  font-size: 0.66rem;
  font-weight: 550;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.site-header nav[aria-label="Primary navigation"]:has(> a[href="/hiring/"])::after {
  display: none;
}

.site-header nav[aria-label="Primary navigation"] > a[href="#contact"],
.site-header nav[aria-label="Primary navigation"] > a[href="/#contact"] {
  order: 8;
}

@media (max-width: 640px) {
  .header-client-logo {
    width: 34px;
    height: 34px;
    border-radius: 8px;
  }

  .site-header a[aria-label="Arcanum Media, home"][href="#home"]::before {
    width: 34px;
    height: 34px;
    border-radius: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .header-client-logo {
    transition: none;
  }


  .site-header a[aria-label="Arcanum Media, home"][href="#home"]::before {
    transition: none;
  }
}
