.hero {
  position: relative;
  min-height: 100svh;
  padding: calc(var(--header-h) + 24px) var(--gutter) 40px;
  overflow: hidden;
}




@keyframes h2-breathe { to { transform: scale(1.12); opacity: 0.7; } }


@keyframes h3-ping {
  0%, 100% { opacity: 0.25; }
  40% { opacity: 1; }
  70% { opacity: 0.25; transform: translate(0, 0); }
}

@keyframes h3-draw {
  0%, 25% { stroke-dashoffset: 620; }
  70%, 100% { stroke-dashoffset: 0; }
}




@keyframes sf-draw {
  0%, 22% { stroke-dashoffset: 900; }
  68%, 100% { stroke-dashoffset: 0; }
}