/*
 * Careers: the job list on /careers/ (the job_list section) and the job page /jd/.
 * Owner: careers. The theme's style.css styles the module, the hero and the buttons;
 * these rules cover what the theme never had: the filters, the department headings and
 * job rows that replace Greenhouse's board, and the apply section on /jd/.
 * Colours and type are the theme's: #151515 text, #596b90 slate, #0320e6 blue,
 * #000f93 arrow, TT-Lakes headings, Open-Sans body.
 */

/* ---- /careers/: the job list ---- */
.ow-job-list [hidden] { display: none !important; }

.job-openings-module.ow-job-list-module {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
}
.ow-job-list { max-width: 62.5rem; margin: 0 auto; }

.ow-job-filters { margin: 0 0 1rem; }
.ow-job-filters label {
  font-weight: 700;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #151515;
}
.ow-job-filters select { margin: .25rem 0 1rem; }
.ow-job-filters .button.cta { margin: .25rem 7px 1.5rem 7px; }
.ow-job-list.is-enhanced [data-ow-job-filter-submit] { display: none; }

.ow-job-count,
.ow-job-nomatch,
.ow-job-general,
.ow-job-empty { text-align: center; }
.ow-job-count { margin: 0 0 .5rem; color: #596b90; font-weight: 700; }
.ow-job-nomatch a,
.ow-job-general a { text-decoration: underline; }

.ow-job-group { margin-top: 2.5rem; }
.job-openings-module .ow-job-group hr { margin: 0 0 1rem; }
.ow-job-department { margin: 0 0 .5rem; font-size: 1.75rem; }
@media print, screen and (min-width: 40em) {
  .ow-job-department { font-size: 2rem; }
}

.ow-job-rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid #151515; }
.ow-job { margin: 0; border-bottom: 1px solid #151515; }
.ow-job-link {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem 1.5rem;
  padding: 1.25rem .25rem;
  color: #151515;
  text-decoration: none;
  transition: background-color .3s;
}
.ow-job-title {
  flex: 1 1 100%;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.35;
}
.ow-job-location {
  flex: 1 1 auto;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #596b90;
}
.ow-job-cta {
  margin-left: auto;
  font-size: .8125rem;
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
}
.ow-job-cta svg { vertical-align: text-bottom; margin-left: .25rem; transition: transform .5s; }
.ow-job-cta svg path { fill: #000f93; }
.ow-job-link:hover,
.ow-job-link:focus-visible { background-color: #f3f8ff; color: #151515; }
.ow-job-link:hover .ow-job-title,
.ow-job-link:focus-visible .ow-job-title { color: #0320e6; }
.ow-job-link:hover .ow-job-cta svg,
.ow-job-link:focus-visible .ow-job-cta svg { transform: translateX(5px); }
.ow-job-link:focus-visible { outline: 2px solid #0320e6; outline-offset: -2px; }
@media print, screen and (min-width: 40em) {
  .ow-job-link { flex-wrap: nowrap; padding: 1.5rem .5rem; }
  .ow-job-title { flex: 1 1 50%; font-size: 1.25rem; }
  .ow-job-location { flex: 0 1 30%; }
}
@media (prefers-reduced-motion: reduce) {
  .ow-job-link, .ow-job-cta svg { transition: none; }
}

.ow-job-general { margin-top: 2.5rem; }
.ow-job-empty { padding: 1rem 0 0; }
.ow-job-empty p { font-size: 1.25rem; }

/* ---- /jd/: the job page ---- */
/* Job titles are longer than the live page's "Join Us": a smaller hero title. */
.ow-jd-hero .hero-content .hero-title { font-size: 2.25rem; line-height: 1.15; overflow-wrap: break-word; }
@media print, screen and (min-width: 40em) {
  .ow-jd-hero .hero-content .hero-title { font-size: 3rem; }
}
@media print, screen and (min-width: 64em) {
  .ow-jd-hero .hero-content .hero-title { font-size: 3.75rem; }
}
/* The divider under the left-aligned title starts where the title starts (RC-10), as the
   theme does for the newsroom's blog-hero. */
.ow-jd-hero.half-hero.hero .hero-content hr { margin-left: 0; }
/* Below 640px the theme's half-hero puts the photo and the text side by side in two
   narrow columns; a job title needs the width, so the photo becomes a banner above it. */
@media screen and (max-width: 39.99875em) {
  .ow-jd-hero.half-hero.hero { display: block; }
  .ow-jd-hero.half-hero.hero .img-overlay { position: relative; height: 11rem; margin-top: 4.5rem; }
  .ow-jd-hero.half-hero.hero .hero-content { padding-top: 2rem; padding-bottom: 3rem; }
}

.ow-jd { padding-top: 40px; padding-bottom: 60px; }
@media print, screen and (min-width: 40em) {
  .ow-jd { padding-top: 60px; padding-bottom: 100px; }
}
.ow-jd-back { margin-bottom: 2rem; font-weight: 700; text-transform: uppercase; font-size: .875rem; }
.ow-jd-back a { color: #151515; text-decoration: none; }
.ow-jd-back a::before { content: "\2190\00a0"; }
.ow-jd-back a:hover, .ow-jd-back a:focus { text-decoration: underline; }

.ow-jd-description h3 { font-size: 1.5rem; margin: 2rem 0 1rem; }
.ow-jd-description .content-intro h3 { margin-top: 0; }
.ow-jd-description ul { margin-bottom: 1.5rem; }
.ow-jd-description .content-conclusion { margin-top: 2rem; font-size: .875rem; }
.ow-jd-description a { text-decoration: underline; }

.ow-jd-apply { margin-top: 3rem; scroll-margin-top: 100px; }
.ow-jd-apply-cta { padding: 1rem 0 0 7px; }
.ow-jd-apply-frame iframe { display: block; width: 100%; border: 0; min-height: 600px; }

.ow-jd-message { padding: 1rem 0 2rem; }
.ow-jd-message .button.cta { margin-left: 7px; }
