/* Legal header, phone only: one faint line of light under the hero that a short spectrum glint travels along, and a
   soft wash that leans with the scroll. Restraint: 1px, low opacity, slow. Desktop and reduced-motion get no motion. */
.lg-spec{display:none}
@media (hover:none) and (pointer:coarse){
  .lg-hero{position:relative}
  .lg-spec{display:block;position:absolute;left:calc(var(--gut) + var(--sal));right:calc(var(--gut) + var(--sar));bottom:0;height:1px;
    background:rgba(252,252,252,.09);overflow:visible;pointer-events:none;touch-action:pan-y pinch-zoom}
  .lg-spec::before{content:"";position:absolute;left:0;top:0;height:1px;width:38%;
    background:linear-gradient(90deg,transparent,#3045e0 14%,#9c92f2 30%,#cf99d3 46%,#fce3a3 60%,#fe9a04 78%,#fb1a08 90%,transparent);
    opacity:.75;transform:translateX(-100%);animation:lgGlint 11s cubic-bezier(.45,.05,.35,1) infinite}
  .lg-spec::after{content:"";position:absolute;left:0;top:-70px;width:100%;height:70px;
    background:radial-gradient(60% 100% at calc(10% + var(--lg-p,0) * 80%) 100%,rgba(156,146,242,.16),rgba(207,153,211,.07) 45%,transparent 75%);
    opacity:.9;filter:blur(8px);transition:background-position .4s}
}
@keyframes lgGlint{0%{transform:translateX(-100%)}70%,100%{transform:translateX(262%)}}
@media (prefers-reduced-motion:reduce){
  .lg-spec::before{animation:none;transform:translateX(70%)}
}