/* =========================================================
   SENIOR RESEARCHER JOB SPLASH PAGE OVERRIDES
   ========================================================= */

/*
   These rules extend the shared job splash page template for the
   Senior Researcher in Mental and Brain Health page.

   Load this stylesheet after the shared template stylesheet so these
   page-specific adjustments can override the default template behavior.
*/

/* =========================================================
   1. HERO OVERRIDES
   ========================================================= */

/* ---------------------------------------------------------
   1.1 Desktop caption width and placement
   --------------------------------------------------------- */

/*
   The senior researcher title is longer than the original associate
   dean title, so the desktop caption needs a wider line length and
   slightly more inset positioning.
*/

@media (min-width: 1024px) {
  .job-posting-hero.plugin-hero--floating-caption .plugin-hero__caption {
    left: clamp(2rem, 6vw, 6rem);
    width: min(48rem, calc(100% - 4rem));
    max-width: 48rem;
  }

  .job-posting-hero .t4-hero-img--caption h1 {
    max-width: 13ch;
  }

  .job-posting-hero .t4-hero-img--caption h1 + p,
  .job-posting-hero .hero-subtext {
    max-width: 42rem;
  }
}

/* ---------------------------------------------------------
   1.2 Large desktop caption refinement
   --------------------------------------------------------- */

@media (min-width: 1280px) {
  .job-posting-hero.plugin-hero--floating-caption .plugin-hero__caption {
    left: 6rem;
    width: 50rem;
    max-width: 50rem;
  }
}

/* =========================================================
   2. KEY RESPONSIBILITIES
   ========================================================= */

/* ---------------------------------------------------------
   2.1 Icons
   --------------------------------------------------------- */

/* Research and Scholarship */
.job-posting-key__card--primary h3::before {
  content: "\f610"; /* microscope */
}

/* Grant Leadership */
.job-posting-key__card--secondary h3::before {
  content: "\f571"; /* file-invoice-dollar */
}

/* Scientific Dissemination */
.job-posting-key__card--tertiary h3::before {
  content: "\f0a1"; /* bullhorn */
}

/* Interdisciplinary Collaboration */
.job-posting-key__card--feature h3::before {
  content: "\f6ff"; /* network-wired */
}

/* Mentoring and Impact */
.job-posting-key__card--accent h3::before {
  content: "\f19d"; /* graduation-cap */
  color: var(--vcu-black);
}

/* ---------------------------------------------------------
   2.2 Card tags
   --------------------------------------------------------- */

.job-posting-key__tag {
    display: inline-block;
    margin-bottom: 0.75rem;
    padding: 0.25rem 0.45rem;
    background: #f5f4f2;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.5;
    margin-top: 0.75rem;
}

/* =========================================================
   3. POSITION OVERVIEW ADDITIONS
   ========================================================= */

/* ---------------------------------------------------------
   3.1 Purpose card supporting points
   --------------------------------------------------------- */

.job-posting-mission__purpose-list {
  list-style: none;
}

.job-posting-mission__purpose-list li {
  position: relative;
  margin: 0;
  padding-left: 1.45rem;
}

.job-posting-mission__purpose-list li:not(:last-child) {
  margin-bottom: 0.85rem;
}

.job-posting-mission__purpose-list li::before {
  content: "\f058"; /* circle-check */
  position: absolute;
  top: 0.2em;
  left: 0;
  font-family: "Font Awesome 6 Free";
  font-size: 0.8rem;
  font-weight: 900;
  line-height: 1;
  color: var(--vcu-gold);
}

/* =========================================================
   4. PRESTIGE SECTION ADDITIONS
   ========================================================= */

/* ---------------------------------------------------------
   4.1 Full-width heading and intro card
   --------------------------------------------------------- */

.job-posting-prestige__header {
  margin: 0 auto 2rem;
}

.job-posting-prestige__header .job-posting-prestige__head {
  margin-bottom: 1.25rem;
}

.job-posting-prestige__intro-card {
  border-left: 4px solid var(--vcu-gold);
  border-radius: 0.35rem;
  box-shadow: none;
  --cwf-card--background-color: #f5f4f2;
}

.job-posting-prestige__intro-card .plugin-card__body {
  padding: 1.25rem 1.5rem;
}

/* ---------------------------------------------------------
   4.2 Metric card border adjustment
   --------------------------------------------------------- */

.job-posting-prestige__metrics {
  border-left: 1px solid var(--cwf-card--border-color, #ddd);
}

/* ---------------------------------------------------------
   4.3 Restore default two-column balance below intro
   --------------------------------------------------------- */

@media (min-width: 768px) {
  .job-posting-prestige__inner {
    align-items: center;
  }

  .job-posting-prestige__visuals {
    align-self: center;
  }
}

/* =========================================================
   5. MOBILE SPACING REFINEMENT
   ========================================================= */

/* ---------------------------------------------------------
   5.1 Position overview gutter
   --------------------------------------------------------- */

/*
   Align the first content section's horizontal gutter with the later
   full-width sections on mobile while preserving the shared template's
   larger-screen gutter behavior.
*/

.job-posting-mission {
  padding-inline: max(1.5rem, var(--main-gutter));
}

/* =========================================================
   6. POSITION OVERVIEW LAYOUT REFINEMENT
   ========================================================= */

/* ---------------------------------------------------------
   6.1 Two-column overview layout
   --------------------------------------------------------- */

/*
   The Senior Researcher page uses shorter mission copy than the
   original template. Group the overview content into two independent
   columns so the purpose card can sit directly below the mission copy
   instead of being controlled by the height of the role highlights card.
*/

.job-posting-mission--columns .job-posting-mission__main,
.job-posting-mission--columns .job-posting-mission__aside {
  display: grid;
  gap: 1.25rem;
  min-width: 0;
}

.job-posting-mission--columns .job-posting-mission__intro,
.job-posting-mission--columns .job-posting-mission__role,
.job-posting-mission--columns .job-posting-mission__purpose,
.job-posting-mission--columns .job-posting-mission__img {
  grid-column: auto;
  margin-top: 0;
}

.job-posting-mission--columns .job-posting-mission__intro p {
  max-width: 42rem;
  font-size: clamp(1rem, 1.15vw, 1.125rem);
  line-height: 1.55;
}

@media (min-width: 768px) {
  .job-posting-mission--columns {
    align-items: start;
  }

  .job-posting-mission--columns .job-posting-mission__main,
  .job-posting-mission--columns .job-posting-mission__aside {
    gap: 1.5rem;
  }
}