/* ------------------------------------------------------------------
   Static-mirror corrections.

   The original page swaps a few image dimensions in React at runtime,
   which server-rendered markup alone cannot express. The served HTML
   carries the desktop sizes, so only the mobile values are restored
   here. Everything else comes from the site's own main.css / home.css.
   ------------------------------------------------------------------ */

/* App Store / Google Play badges render at 132x44 below 992px on the
   live site (the served markup bakes in the 160x52 desktop sizer).
   next/image sizes the box from the aria-hidden sizer, whose inline
   styles need !important to override.

   Scoped to the container rather than the link: only the first anchor
   carries the storeLink class, the second one is unclassed. */
@media (max-width: 991.98px) {
  [class*="StoreLinks_storeLinks"] img[aria-hidden="true"] {
    width: 132px !important;
    height: 44px !important;
  }
}

/* Scroll-reveal state for the feature and pricing cards. app.js tags
   the frozen elements with data-reveal (dropping the inline opacity:0
   the capture baked in) and adds .is-revealed once they scroll into
   view. Keeping the hidden state here rather than inline means the
   cards are never left invisible if the tagging pass does not run. */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

[data-reveal].is-revealed {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    transform: none;
    transition-duration: 0.01ms;
  }
}

/* Register / Login nav links. They sit among the 16px/400 menu items but
   should read at the smaller weight of the language switch beside them,
   so these values are copied from AppHeader_lang (12px / 600 / 14px). */
[data-auth-link] {
  font-size: 12px;
  font-weight: 600;
  line-height: 14px;
}

/* Nav items space themselves with 0 11px of their own padding, so any two
   neighbours sit 22px apart. Tighten only the edges that face each other,
   which leaves Career -> Register and Login -> language switch untouched.
   Logical properties so the pair also reads correctly in the RTL header.

   The site sets these with a four-class chain and the `padding` shorthand
   (.AppHeader_appHeader .AppHeader_desktop .AppHeader_links .AppHeader_link),
   which outweighs a plain attribute selector, hence !important here. */
[data-auth-link]:has(+ [data-auth-link]) {
  padding-inline-end: 5px !important;
}

[data-auth-link] + [data-auth-link] {
  padding-inline-start: 5px !important;
}