/* Responsive polish for the public site (loaded after the other global sheets). Everything here applies only below the desktop
   breakpoints or on touch screens, so the layout at 1280px and above is exactly what it was before. Colours and fonts are unchanged. */

/* ---------- phones: readable text ---------- */
@media (width < 744px) {
  body:not(.panel-page) .text--body,
  body:not(.panel-page) .text--body-medium { font-size: 16px; line-height: 1.5; }
  body:not(.panel-page) .text--footnote { font-size: 14px; line-height: 1.45; }
  body:not(.panel-page) .jb-posted,
  body:not(.panel-page) .jb-tag { font-size: 14px; }
}

/* ---------- touch screens and tablets: comfortable tap targets (44px) ---------- */
@media (width < 1100px), (pointer: coarse) {
  body:not(.panel-page) .rs-nav__logo { display: inline-flex; align-items: center; min-height: 44px; }
  body:not(.panel-page) .footer__social-link { width: 44px; height: 44px; }
  body:not(.panel-page) .footer__bottom .footer__link { display: inline-flex; align-items: center; min-height: 44px; }
  body:not(.panel-page) .footer__column-list { gap: 0; }
  body:not(.panel-page) .footer__column-list .footer__link { display: inline-flex; align-items: center; min-height: 44px; }
  /* hero / carousel pause buttons: keep the look, enlarge the area that reacts to a tap */
  body:not(.panel-page) .homepage-hero__controls,
  body:not(.panel-page) .king-carousel__toolbar-button { position: relative; }
  body:not(.panel-page) .homepage-hero__controls::after,
  body:not(.panel-page) .king-carousel__toolbar-button::after { content: ""; position: absolute; inset: -8px; }
  /* Jobs */
  body:not(.panel-page) .jb-chip { min-height: 44px; }
  body:not(.panel-page) .jb-select { min-height: 44px; font-size: 16px; }
  body:not(.panel-page) .jb-details { min-height: 44px; display: inline-flex; align-items: center; }
  body:not(.panel-page) .jb-modal__close { min-width: 44px; min-height: 44px; }
  /* Contact */
  body:not(.panel-page) .cc-link { display: inline-flex; align-items: center; min-height: 44px; }
  body:not(.panel-page) .cf-check { min-height: 44px; display: inline-flex; align-items: center; }
  body:not(.panel-page) .cf-input, body:not(.panel-page) .job-search__input { font-size: 16px; }
  /* Pricing */
  body:not(.panel-page) .pr-link { display: inline-flex; align-items: center; min-height: 44px; }
}

/* ---------- long words and wide content never push the page sideways ---------- */
body:not(.panel-page) main img, body:not(.panel-page) main video, body:not(.panel-page) main iframe { max-width: 100%; }
body:not(.panel-page) main { overflow-wrap: break-word; }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
