/* The Facet Line — signature element, design.md §21.
   1px gold hairline; a small faceted diamond glyph at a content-relevant
   offset (never centered). Light-sweep once on first scroll-into-view. */

.facet-line {
  position: relative;
  height: 1px;
  background: var(--accent-gold);
  width: 100%;
}

.facet-line__glyph {
  position: absolute;
  top: 50%;
  left: var(--facet-offset, 25%); /* content-relevant offset, set per usage */
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  overflow: visible;
}

/* Light sweep — 400ms, once only (class added by IntersectionObserver, then never re-added) */
.facet-line--swept .facet-line__sweep {
  animation: facet-sweep 400ms var(--easing-standard) 1 forwards;
}

@keyframes facet-sweep {
  from { transform: translateX(-14px) rotate(20deg); opacity: 0.9; }
  to   { transform: translateX(14px) rotate(20deg); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .facet-line--swept .facet-line__sweep { animation: none; opacity: 0; }
}