/* Phone footer nav link interaction (TASK E v9, brief 2026-09-30c section 31). <=940px only; desktop footer untouched.
   Reproduces Cuberto's footer .nav mechanic, MEASURED from source (research/phone-v5/cuberto-js/cuberto.com__astro_Footer.v_lo1qnf.css)
   and live (research/phone-v9/footer-cub-link-motion.json, 390px pointer:fine page):
   - .nav__title{overflow:hidden}: a mask one line box tall.
   - label span: transform .8s cubic-bezier(.16,1,.3,1); on hover translateY(-100%) (settles at -24.95px = one 24.96px line box; ~90% by 240ms).
   - clone (::after, content:attr(data-text)) sits at top:100%, scale(.7) at rest, transition .4s ease -> scale(1) on hover
     (it rides up INTO the mask while it grows from 70% to 100%). No underline, no opacity change, no colour change, no cursor change.
   - The translate is gated to (pointer:fine) in Cuberto's CSS; on touch NOTHING is visible (MEASURED: touch hold, span transform stays none).
   Touch adaptation (ours, not Cuberto's): a minimal :active press = label opacity .55, 100ms in / 200ms out (animate skill: press feedback
   100-160ms, opacity only, no displacement so it never reads as a half-played hover roll).
   Reduced motion: no roll; hover dims to .6 opacity instead (state stays legible, nothing moves).
   Markup (built by footer-links.js): <a><span class="fl-t"><span data-text="Label">Label</span></span></a> */
@media (max-width:940px){
  html body footer .fnav a{-webkit-tap-highlight-color:transparent}
  html body footer .fnav a .fl-t{display:block;position:relative;overflow:hidden}
  html body footer .fnav a .fl-t > span{display:block;position:relative;transition:transform .8s cubic-bezier(.16,1,.3,1)}
  html body footer .fnav a .fl-t > span::after{content:attr(data-text);display:block;position:absolute;top:100%;left:0;right:0;
    transform:scale(.7);transition:transform .4s ease}
  html body footer .fnav a:hover .fl-t > span::after{transform:scale(1)}
  html body footer .fnav a .fl-t{transition:opacity .2s cubic-bezier(.23,1,.32,1)}
}
@media (max-width:940px) and (hover:hover) and (pointer:fine){
  html body footer .fnav a:hover .fl-t > span{transform:translateY(-100%)}
}
@media (max-width:940px) and (hover:none), (max-width:940px) and (pointer:coarse){
  html body footer .fnav a:active .fl-t{opacity:.55;transition-duration:.1s}
}
@media (max-width:940px){
  html body footer .fnav a.is-press .fl-t{opacity:.55;transition-duration:.1s}   /* JS press class (footer-links.js), touch/pen only */
}
@media (max-width:940px) and (prefers-reduced-motion:reduce){
  html body footer .fnav a .fl-t > span, html body footer .fnav a .fl-t > span::after{transition:none!important;transform:none!important}
  html body footer .fnav a .fl-t > span::after{visibility:hidden}
  html body footer .fnav a:hover .fl-t{opacity:.6}
}