/* Outrun guides release (guides-20261030): the /guides hero card and the home "New here?" link.
   The HTML is the finished state. html.np-anim (noir-newpages-head.js) hides the card until noir-guides.js draws its start state.
   Motion uses transforms, opacity and one custom property only, so nothing reflows. */

/* home hero: a quiet text link under the CTAs. Taken out of the flow (absolute, just below the buttons), so the hero keeps its exact
   height and the CTAs never move at any width. */
.hero-side{position:relative}
.hero-side p.hero-new{position:absolute;left:0;top:100%;margin:14px 0 0;font-size:13.5px;line-height:1.4;color:var(--cream-3);white-space:nowrap}
.hero-new a{color:var(--cream-2);text-decoration:none;border-bottom:1px solid var(--line-2);padding-bottom:1px;transition:color .2s,border-color .2s}
.hero-new a span{color:var(--orange);margin-left:2px;display:inline-block;transition:transform .2s var(--ease,ease)}
.hero-new a:hover,.hero-new a:focus-visible{color:var(--cream);border-color:var(--orange)}
.hero-new a:hover span,.hero-new a:focus-visible span{transform:translateX(3px)}

/* /guides hero card: numbered route of guide groups */
html.np-anim [data-npg]{visibility:hidden}
.np-gd .np-gd-rows{position:relative;counter-reset:none}
.np-gd .np-gd-rows::before{content:"";position:absolute;left:11px;top:24px;bottom:12px;width:1px;background:linear-gradient(var(--orange),rgba(255,85,0,.35));
  transform-origin:top;transform:scaleY(var(--gd-line,1))}
.np-gd .stat .np-gd-rows li{position:relative;justify-content:flex-start;align-items:center;padding-left:38px;background:var(--ink-2);will-change:transform}
/* while stacked (start state), each group reads as a card in a pile; box-shadow only, so no size change */
.np-gd .stat .np-gd-rows li.stk{border-radius:10px;box-shadow:0 0 0 1px var(--line-2),0 10px 26px rgba(0,0,0,.55)}
.np-gd .stat .np-gd-rows li:last-child{padding-bottom:0}
.np-gd .np-gd-t{flex:1;min-width:0}
.np-gd .np-gd-n{position:absolute;left:0;top:50%;width:23px;height:23px;margin-top:-11.5px;display:grid;place-items:center;border:1px solid var(--line-2);border-radius:50%;
  background:var(--ink-2);font-size:10px;letter-spacing:0;color:var(--cream-3);transition:background .25s,border-color .25s,color .25s}
.np-gd .np-gd-rows li:last-child .np-gd-n{margin-top:-5.5px}
.np-gd .np-gd-rows li.on .np-gd-n{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.np-gd .np-gd-rows b{font-family:var(--mono);font-variant-numeric:tabular-nums;min-width:2ch}
.np-gd .stat-big{font-variant-numeric:tabular-nums}