/* EGATO page v43 layer (2026-10-26). Loaded after v42.css.

   Jump links on phones (Dominyka, 2026-10-26): on a phone the page is 12 screens long and its seven section links sit
   behind the menu icon, which visitors rarely open. Once the first screen has scrolled away, a slim row under the top
   bar offers The bike, Specs and FAQ, next to the Contact button that is already there, and underlines the section
   being read. It is a separate bar under the header, so the header keeps its 64 px height and the cat's perch.

   One text column on computers (Dominyka): text sat in five widths (640, 680, 890, 960-1120 and 1000 px). Everything
   left-aligned now shares the 1000 px column of the specification, team and contact blocks and starts at the same left
   edge; headings stay centred on the same axis; films and the sizes photo keep their own size. */
.jump-nav{display:none}
@media(max-width:859px){
  :root{--jump-h:44px}
  html{scroll-padding-top:calc(var(--header-h) + var(--jump-h) + 16px)}
  .jump-nav{position:fixed;top:var(--header-h);left:0;right:0;z-index:calc(var(--z-header) - 1);display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));height:var(--jump-h);background:#080808;border-bottom:1px solid #ffffff14;
    visibility:hidden;opacity:0;transform:translateY(-100%);
    transition:opacity 150ms var(--ease-out),transform 150ms var(--ease-out),visibility 0s linear 150ms}
  .jump-nav.is-shown{visibility:visible;opacity:1;transform:none;
    transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out),visibility 0s}
  .jump-nav a{display:flex;align-items:center;justify-content:center;color:#eee;font-size:.875rem;font-weight:500;
    letter-spacing:.08em;text-transform:uppercase;text-decoration:none;-webkit-tap-highlight-color:transparent;
    transition:color 150ms ease}
  .jump-nav span{position:relative;padding-block:6px;transition:transform 160ms var(--ease-out)}
  .jump-nav span::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:1px;background:#48bb7a;
    transform:scaleX(0);transition:transform 200ms var(--ease-out)}
  .jump-nav a[aria-current]{color:#48bb7a}
  .jump-nav a[aria-current] span::after{transform:scaleX(1)}
  .jump-nav a:active span{transform:scale(.97)}
  .jump-nav a:focus-visible{outline:2px solid #48bb7a;outline-offset:-4px}
}
@media(max-width:859px) and (prefers-reduced-motion:reduce){
  .jump-nav,.jump-nav.is-shown{transform:none}
  .jump-nav span,.jump-nav span::after{transition:none}
}

@media(min-width:860px){
  .product .spec-highlights,.compare-pair,.faq,[data-feature-gallery] .feature-viewport{
    width:min(calc(100% - var(--gutter)*2),1000px);max-width:none;margin-inline:auto}
  /* Ride time and cost side by side; the cards have no box any more (v40), so their text starts at the column edge. */
  .compare-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-bottom:20px}
  .compare-pair .compare-card{width:auto;margin:0;padding-inline:0}
  /* The text beside each feature photo (the app and the component close-ups) starts at the column edge too. */
  [data-feature-gallery] .feature-copy{padding-left:0}
}