.header-brand-mark {
  --brand-mark-glow:rgba(255,255,255,.86);
  display:grid;
  width:4.65rem;
  height:3.9rem;
  place-items:center;
  padding:0;
  color:inherit;
}

.header-brand-mark-logo {
  display:block;
  width:4.25rem;
  height:3.6rem;
  overflow:visible;
  shape-rendering:geometricPrecision;
  text-rendering:geometricPrecision;
  transform:translateZ(0) scale(1);
  transform-origin:center;
  transition:transform var(--motion-standard,.35s) var(--motion-ease,cubic-bezier(.22,1,.36,1));
}

.header-brand-mark-logo :is(path,use) {
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-miterlimit:2;
  vector-effect:non-scaling-stroke;
}

.header-brand-mark .header-brand-mark-logo .logo-base use {
  stroke:currentColor;
  stroke-width:5.8;
}

.header-brand-mark .header-brand-mark-logo .logo-flow use {
  stroke:currentColor;
  stroke-width:6.4;
  stroke-dasharray:120 880;
  animation:brand-flow-attention 8.2s linear infinite;
}

.header-brand-mark .header-brand-mark-logo .logo-flow use:nth-child(2) {
  animation-name:brand-flow-distraction;
  animation-duration:7.3s;
  animation-delay:-1.5s;
}

.header-brand-mark .header-brand-mark-logo .logo-flow use:nth-child(3) {
  animation-name:brand-flow-hyperfocus;
  animation-duration:9.1s;
  animation-delay:-3s;
}

.header-brand-mark .header-brand-mark-logo .logo-flow use:nth-child(4) {
  animation-name:brand-flow-stop-go;
  animation-duration:7.6s;
  animation-delay:-4.5s;
}

.header-brand-mark .header-brand-mark-logo .logo-point use {
  stroke:currentColor;
  stroke-width:9;
  stroke-dasharray:.01 999.99;
  filter:drop-shadow(0 0 2px var(--brand-mark-glow));
  animation:brand-point-attention 8.2s linear infinite;
}

.header-brand-mark .header-brand-mark-logo .logo-point use:nth-child(2) {
  animation-name:brand-point-distraction;
  animation-duration:7.3s;
  animation-delay:-1.5s;
}

.header-brand-mark .header-brand-mark-logo .logo-point use:nth-child(3) {
  animation-name:brand-point-hyperfocus;
  animation-duration:9.1s;
  animation-delay:-3s;
}

.header-brand-mark .header-brand-mark-logo .logo-point use:nth-child(4) {
  animation-name:brand-point-stop-go;
  animation-duration:7.6s;
  animation-delay:-4.5s;
}

body .header-brand-mark .header-brand-mark-logo :is(.logo-flow,.logo-point) use {
  animation-play-state:running !important;
}

body.is-page-hidden .header-brand-mark .header-brand-mark-logo :is(.logo-flow,.logo-point) use,
body.modal-open .header-brand-mark .header-brand-mark-logo :is(.logo-flow,.logo-point) use {
  animation-play-state:paused !important;
}

.header-brand-mark:hover .header-brand-mark-logo,
.header-brand-mark:focus-visible .header-brand-mark-logo {
  transform:translateZ(0) scale(1.06);
}

html[data-theme="light"] .header-brand-mark,
.preview-brand.header-brand-mark {
  --brand-mark-glow:rgba(5,5,5,.7);
}

@keyframes brand-point-attention {
  0% { stroke-dashoffset:-118; }
  28% { stroke-dashoffset:-368; }
  54% { stroke-dashoffset:-638; }
  76% { stroke-dashoffset:-888; }
  100% { stroke-dashoffset:-1118; }
}

@keyframes brand-point-distraction {
  0% { stroke-dashoffset:0; }
  26% { stroke-dashoffset:235; }
  39% { stroke-dashoffset:350; }
  54% { stroke-dashoffset:500; }
  76% { stroke-dashoffset:735; }
  100% { stroke-dashoffset:1000; }
}

@keyframes brand-point-hyperfocus {
  0% { stroke-dashoffset:-72; }
  30% { stroke-dashoffset:-340; }
  58% { stroke-dashoffset:-710; }
  80% { stroke-dashoffset:-935; }
  100% { stroke-dashoffset:-1072; }
}

@keyframes brand-point-stop-go {
  from { stroke-dashoffset:-118; }
  to { stroke-dashoffset:-1118; }
}

@keyframes brand-flow-attention {
  0% { stroke-dashoffset:0; opacity:.62; }
  28% { stroke-dashoffset:-250; opacity:.75; }
  54% { stroke-dashoffset:-520; opacity:1; }
  76% { stroke-dashoffset:-770; opacity:.88; }
  100% { stroke-dashoffset:-1000; opacity:.62; }
}

@keyframes brand-flow-distraction {
  0% { stroke-dashoffset:0; opacity:.68; }
  26% { stroke-dashoffset:235; opacity:.82; }
  39% { stroke-dashoffset:350; opacity:.35; }
  54% { stroke-dashoffset:500; opacity:.72; }
  76% { stroke-dashoffset:735; opacity:1; }
  100% { stroke-dashoffset:1000; opacity:.7; }
}

@keyframes brand-flow-hyperfocus {
  0% { stroke-dashoffset:0; stroke-dasharray:72 928; opacity:.48; }
  30% { stroke-dashoffset:-250; stroke-dasharray:90 910; opacity:.62; }
  58% { stroke-dashoffset:-560; stroke-dasharray:150 850; opacity:1; }
  80% { stroke-dashoffset:-800; stroke-dasharray:135 865; opacity:.95; }
  100% { stroke-dashoffset:-1000; stroke-dasharray:72 928; opacity:.45; }
}

@keyframes brand-flow-stop-go {
  from { stroke-dashoffset:0; }
  to { stroke-dashoffset:-1000; }
}

@media (max-width:650px) {
  .header-brand-mark-logo { width:3.95rem; }
}

@media (prefers-reduced-motion:reduce) {
  .header-brand-mark .header-brand-mark-logo :is(.logo-flow,.logo-point) use { animation:none !important; }
}
