/* Shared product navigation and accessibility; retain each app's design. */
.portfolio-locales { position: static; margin-left: 0; padding: 24px; background: #f4f6f8; color: #17212d; font: 15px/1.6 system-ui, sans-serif; }
.portfolio-locales__inner { max-width: 1120px; margin-inline: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.portfolio-locales a { color: #17212d; text-decoration: underline; text-underline-offset: .2em; padding: 8px; }
.portfolio-locales a[aria-current] { font-weight: 750; background: #e1e8ee; border-radius: 6px; }
.portfolio-skip { position: fixed; inset: 8px auto auto 8px; transform: translateY(-160%); z-index: 10000; padding: 12px 18px; background: #fff; color: #102b48; border: 2px solid #102b48; border-radius: 6px; }
.portfolio-skip:focus { transform: none; }
:where(a, button, summary, [tabindex]):focus-visible { outline: 3px solid #1685bd; outline-offset: 4px; }
main:focus { outline: none; }
.portfolio-guide { max-width: 72rem; margin: 2rem auto; padding-inline: 1.5rem; }
.portfolio-locales__inner > * { min-inline-size: 0; overflow-wrap: anywhere; }
/* Long translated headings must remain visible inside product hero grids. */
main h1 { max-inline-size: 100%; overflow-wrap: anywhere; hyphens: auto; }
.hypercam-page .nav--on-dark:not(.scrolled) .nav__toggle {
  min-width: 44px;
  min-height: 44px;
  justify-content: center;
  align-items: center;
  border: 1px solid rgba(248, 255, 251, .65);
  border-radius: 8px;
  background: #0d251d;
}
.hypercam-page .nav--on-dark:not(.scrolled) .nav__toggle span { background: #f8fffb; }
.hypercam-page .nav__toggle:focus-visible { outline-color: #ffd34d; outline-offset: 4px; }
@media (max-width: 700px) {
  .hc-hero h1, .hc-editorial-hero h1 {
    font-size: clamp(2.25rem, 10vw, 2.75rem);
    line-height: 1.05;
    letter-spacing: -.055em;
  }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
}