/* motion.css — home page (/b2/index.html) ONLY. Not linked from any other page, so every
   rule here is automatically scoped to the home page: no other page's visual behaviour can
   change. Uses the tokens defined in styles.css :root (--ease-gravity, --rev-*).
   Sections: A2 line-by-line reveal · A3 quiet hover/focus.
   (Part C, the Measured Gap dimension-line device, was removed 2026-07-27 per client
   feedback on both mobile and desktop - see motion.js for the matching JS removal.) */

/* ===== A2. Line-by-line reveal on the big statements ===================================== */
/* resting (pre-reveal): built by motion.js into <span class="ln"><span class="ln__i">…</span></span> */
.js .ln{display:block;overflow:hidden;}
.js .ln__i{display:block;opacity:0;transform:translateY(10px);will-change:transform,opacity;}
/* reveal: element's ancestor [data-lines] gets .in (IntersectionObserver) */
.in .ln__i{opacity:1;transform:none;
  transition:opacity var(--rev-line) var(--ease-gravity),transform var(--rev-line) var(--ease-gravity);
  transition-delay:calc(var(--i,0) * var(--rev-stagger));}
/* reduced motion: every line sits at its final, readable state — no dependency on .in ever firing */
@media(prefers-reduced-motion:reduce){.js .ln__i{opacity:1;transform:none;}}
/* preserved inline accent inside a split hero statement (see index.html hero__h2) */
.hero__h2 .ember{color:var(--ember);}

/* ===== A3. Quiet hover / focus feedback =================================================== */
/* Pathway lens — SVG fallback (index.html's instance only: .whofor--lens-c) */
.whofor--lens-c .seg{transition:transform var(--rev-fast) var(--ease-gravity);}
.whofor--lens-c .seg__arc{transition:fill var(--rev-fast) var(--ease-gravity),stroke var(--rev-fast) var(--ease-gravity);}
.whofor--lens-c .seg__txt{transition:fill var(--rev-fast) var(--ease-gravity);}
/* the lens hint reads as a control, not a caption — raised resting contrast */
.whofor--lens-c .wl__hint{color:var(--ink-2);}

/* CTA form (get in touch) — border eases to brass on focus, quiet, no glow */
.cta__form .field input,.cta__form .field textarea{
  transition:border-color var(--rev-fast) var(--ease-gravity);}
.cta__form .field input:focus,.cta__form .field textarea:focus{border-bottom-color:var(--brass);}

/* Buttons/links — one quiet state change, same curve/duration as everything else on the page */
.btn{transition:background var(--rev-fast) var(--ease-gravity),color var(--rev-fast) var(--ease-gravity),
  transform var(--rev-fast) var(--ease-gravity),border-color var(--rev-fast) var(--ease-gravity);}