/* =====================================================================
   NOON — SIGNATURE INTERACTIONS
   Three small persistent gestures that make the site feel like an
   instrument reading the resource — and let the visitor feel "read"
   in return. Imported across every public page.

   1. Reading line cursor: a brass horizontal hairline that follows the
      cursor y-position on desktop. The visitor's eye becomes a measured
      coordinate. Hidden on touch.
   2. Breathing bullseye: the nav brand mark expands and contracts on a
      slow ~6s cycle. Sacred. Persistent. The brand mark is alive.
   3. Scroll progress: a 1px brass hairline at the very top of the
      viewport that fills as you scroll the page — reading depth as a
      visible measure.
   ===================================================================== */

:root {
  --sig-brass: #B89968;
  --sig-brass-soft: rgba(184, 153, 104, 0.35);
}

/* ---------- 1. READING LINE CURSOR (desktop only) ---------- */
.sig-cursor {
  position: fixed;
  left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(184, 153, 104, 0.35) 18%,
    rgba(184, 153, 104, 0.55) 50%,
    rgba(184, 153, 104, 0.35) 82%,
    transparent 100%);
  pointer-events: none;
  z-index: 9998;
  top: -10px;
  opacity: 0;
  transition: opacity 320ms ease;
  will-change: transform, opacity;
  mix-blend-mode: lighten;
}
.sig-cursor.is-active {
  opacity: 0.85;
}
/* Hide on touch / coarse pointer / reduced motion */
@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
  .sig-cursor { display: none; }
}

/* ---------- 2. BREATHING BULLSEYE (everywhere via .nb-nav__mark) ---------- */
@keyframes sig-breath {
  0%, 100% {
    transform: scale(1);
    filter: drop-shadow(0 0 0 rgba(184, 153, 104, 0));
  }
  50% {
    transform: scale(1.06);
    filter: drop-shadow(0 0 8px rgba(232, 126, 45, 0.35));
  }
}
.nb-nav__mark {
  transform-origin: center;
  animation: sig-breath 6.5s ease-in-out infinite;
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  .nb-nav__mark { animation: none; }
}

/* The pulse on the inner ember dot — slightly faster, for layered breath */
.nb-nav__mark circle:last-of-type {
  animation: sig-ember-pulse 4.2s ease-in-out infinite;
  transform-origin: center;
}
@keyframes sig-ember-pulse {
  0%, 100% { r: 7; opacity: 1; }
  50% { r: 8.5; opacity: 0.85; }
}
@media (prefers-reduced-motion: reduce) {
  .nb-nav__mark circle:last-of-type { animation: none; }
}

/* ---------- 3. SCROLL PROGRESS HAIRLINE ---------- */
.sig-scroll {
  position: fixed;
  top: 0; left: 0;
  width: 0%;
  height: 1px;
  background: linear-gradient(90deg,
    rgba(184, 153, 104, 0.0) 0%,
    rgba(184, 153, 104, 0.85) 50%,
    rgba(232, 126, 45, 0.95) 100%);
  z-index: 10000;
  pointer-events: none;
  transition: width 80ms linear, opacity 240ms ease;
  opacity: 0;
}
.sig-scroll.is-reading {
  opacity: 1;
}