/* Smooth scroll for in-page anchors (e.g. "See how it works ↓") */
html {
  scroll-behavior: smooth;
}

/* Better default for FAQ <details> markers — remove default triangle, we'll add our own */
details > summary {
  list-style: none;
  cursor: pointer;
}
details > summary::-webkit-details-marker {
  display: none;
}

/* Subtle in-section anchor offset so headings clear the (non-sticky) nav cleanly */
section[id] {
  scroll-margin-top: 2rem;
}

/* Hero background: faint dotted grid, extends the blueprint/diagram aesthetic */
.hero-bg {
  background-image: radial-gradient(#e2e8f0 1.2px, transparent 1.4px);
  background-size: 22px 22px;
  background-position: 0 0;
}

/* Hero diagram: staggered page-load reveal showing data extraction */
.diagram-line {
  stroke-dasharray: 140;
  stroke-dashoffset: 140;
  animation: diagram-draw 0.9s cubic-bezier(0.65, 0, 0.35, 1) forwards;
}
.diagram-line-1 { animation-delay: 0.2s; }
.diagram-line-2 { animation-delay: 0.5s; }
.diagram-line-3 { animation-delay: 0.8s; }

.diagram-dot,
.diagram-value {
  opacity: 0;
  animation: diagram-fade 0.4s ease-out forwards;
}
.diagram-dot-1 { animation-delay: 1.0s; }
.diagram-dot-2 { animation-delay: 1.3s; }
.diagram-dot-3 { animation-delay: 1.6s; }
.diagram-value-1 { animation-delay: 1.05s; }
.diagram-value-2 { animation-delay: 1.35s; }
.diagram-value-3 { animation-delay: 1.65s; }

@keyframes diagram-draw {
  to { stroke-dashoffset: 0; }
}
@keyframes diagram-fade {
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .diagram-line,
  .diagram-dot,
  .diagram-value {
    animation: none;
    stroke-dashoffset: 0;
    opacity: 1;
  }
}