.opening-home .header-location {
  position: relative;
}

.entrance-sprout {
  position: absolute;
  inset-block-end: -.16em;
  inline-size: 1.6em;
  block-size: 1.7em;
  fill: none;
  stroke: #000000;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}

.entrance-sprout:first-of-type { inset-inline-end: calc(100% + .35em); }
.entrance-sprout:last-of-type { inset-inline-start: calc(100% + .35em); }

@media (prefers-reduced-motion: no-preference) {
  .home-entering .header-brand svg,
  .home-entering .header-location,
  .home-intro-entered .intro-keywords > span,
  .home-intro-entered .intro-tagline > .curly-line {
    animation: home-text-emerge .48s cubic-bezier(.2, .65, .3, 1) var(--emerge-delay, 0s) both;
  }

  .home-entering .header-location { --emerge-delay: .12s; }
  .home-intro-entered .intro-keywords > span:nth-child(2) { --emerge-delay: .09s; }
  .home-intro-entered .intro-keywords > span:nth-child(3) { --emerge-delay: .18s; }
  .home-intro-entered .intro-tagline > .curly-line:first-child { --emerge-delay: .28s; }
  .home-intro-entered .intro-tagline > .curly-line:last-child { --emerge-delay: .37s; }

  /* Tiny SVG strokes draw and erase in place, without moving the header. */
  .entrance-sprout path {
    stroke-dasharray: 1 1;
    animation: location-sprout-ink 6.4s linear var(--sprout-phase, -1.2s) infinite both;
  }

  .entrance-sprout:last-of-type { --sprout-phase: -3.8s; }
  .entrance-sprout path:nth-child(2) {
    animation-delay: calc(var(--sprout-phase, -1.2s) + .35s);
  }
  .entrance-sprout path:nth-child(3) {
    animation-delay: calc(var(--sprout-phase, -1.2s) + .7s);
  }

  .motion-paused .entrance-sprout path,
  [data-flowers-paused="true"] .entrance-sprout path {
    animation-play-state: paused;
  }

  .home-entering .motion-paused :is(.header-brand svg, .header-location, .entrance-sprout path, .intro-keywords > span, .intro-tagline > .curly-line) {
    animation-play-state: paused;
  }
}

@keyframes home-text-emerge {
  from { opacity: .72; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes location-sprout-ink {
  0% { stroke-dashoffset: 1; }
  30%, 65% { stroke-dashoffset: 0; }
  95%, 100% { stroke-dashoffset: -1; }
}