/* experiments/scholars-discovery/ — version 2, "at a glance".
   Loaded after styles.css. Drops the AUX profile cards for a dense
   three-column roster: a small round photo, the name (the profile link),
   and one line of position and department. Custom markup on purpose;
   colors and type follow the AUX tokens. */

.scholars-feed .scholars-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 0 24px;
  margin: 0;
}
@media (min-width: 992px) {
  .scholars-feed .scholars-grid { grid-template-columns: repeat(3, 1fr); }
}
.scholars-feed .scholars-grid > * { padding: 0; margin-bottom: 2rem; }
.scholars-feed .profile-preview { width: 100%; background: #ffffff; margin-top: 0; }
.scholars-feed .profile-preview__info { flex: 1; justify-content: flex-start; }
.scholars-feed .profile-preview__info { border-bottom: solid 2px #500000; }
.scholars-feed .profile-preview__info .info__name { font-size: 1.5rem; }

.scholars-feed .info__name a { color: inherit; text-decoration: none; }
.scholars-feed .info__name a:hover, .scholars-feed .info__name a:focus-visible { text-decoration: underline; }
/* Make the whole card clickable through the name link. */
.scholars-feed .profile-preview__info { position: relative; }
.scholars-feed .info__name a::after { content: ""; position: absolute; inset: 0; }
.scholars-status, .scholars-source { font-size: 14px; color: #5c5a55; }
.scholars-source { margin-top: 8px; }

/* "Updated today" dot on the photo. Green is paired with the legend and screen-reader text, never color alone. */
.scholar-row__photo { position: relative; display: inline-flex; flex: none; }
.scholars-feed .profile-preview__image { position: relative; }
.scholars-feed .profile-preview__image .scholar-dot { position: absolute; right: 8px; bottom: 8px; width: 14px; height: 14px; border-width: 3px; }
.scholar-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #2d6a4f;
  border: 2px solid #ffffff;
  box-sizing: content-box;
}
.scholar-row__photo .scholar-dot { position: absolute; right: -2px; bottom: -1px; }
.scholars-legend {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 16px 0 0;
  font-size: 0.8125rem;
  color: #5c5a55;
}

/* experiments/scholars-discovery/ — version 2, "at a glance".
   Loaded after styles.css. Drops the AUX profile cards for a dense
   three-column roster: a small round photo, the name (the profile link),
   and one line of position and department. Custom markup on purpose;
   colors and type follow the AUX tokens. */


.scholars-feed .scholars-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 0 24px;
  margin: 0;
}
@media (min-width: 992px) {
  .scholars-feed .scholars-grid { grid-template-columns: repeat(3, 1fr); }
}
.scholars-feed .scholars-grid > * { padding: 0; margin-bottom: 2rem; }
.scholars-feed .profile-preview { width: 100%; background: #ffffff; margin-top: 0; }
.scholars-feed .profile-preview__info { flex: 1; justify-content: flex-start; }
.scholars-feed .profile-preview__info { border-bottom: solid 2px #500000; }
.scholars-feed .profile-preview__info .info__name { font-size: 1.5rem; }

.scholars-feed .info__name a { color: inherit; text-decoration: none; }
.scholars-feed .info__name a:hover, .scholars-feed .info__name a:focus-visible { text-decoration: underline; }
/* Make the whole card clickable through the name link. */
.scholars-feed .profile-preview__info { position: relative; }
.scholars-feed .info__name a::after { content: ""; position: absolute; inset: 0; }
.scholars-status, .scholars-source { font-size: 14px; color: #5c5a55; }
.scholars-source { margin-top: 8px; display: none; }

/* "Updated today" dot on the photo. Green is paired with the legend and screen-reader text, never color alone. */
.scholar-row__photo { position: relative; display: inline-flex; flex: none; }
.scholars-feed .profile-preview__image { position: relative; }
.scholars-feed .profile-preview__image .scholar-dot { position: absolute; right: 8px; bottom: 8px; width: 14px; height: 14px; border-width: 3px; }
.scholar-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #2d6a4f;
  border: 2px solid #ffffff;
  box-sizing: content-box;
}
.scholar-row__photo .scholar-dot { position: absolute; right: -2px; bottom: -1px; }
.scholars-legend {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 16px 0 0;
  font-size: 0.8125rem;
  color: #5c5a55;
}
.scholars-legend .scholar-dot { border: 0; width: 10px; height: 10px; }

/* Job title in italics (version 1 cards). */
.scholars-feed .info__title { font-style: italic; }

/* Search tips and advanced search links under the hero search bar. */
.scholars-search-help { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 24px; margin-top: 12px; font-size: 0.875rem; }
.scholars-search-help a, .scholars-tips__toggle { color: #500000; text-decoration: underline; cursor: pointer; }
.scholars-tips__toggle { background: none; border: 0; padding: 0; font: inherit; }
.scholars-tips__toggle svg { width: 1em; height: 1em; fill: currentColor; vertical-align: -0.125em; margin-right: 0.4em; }
.scholars-tips__toggle::after { content: "\00a0\25B8"; text-decoration: none; display: inline-block; }
.scholars-tips__toggle[aria-expanded="true"]::after { content: "\00a0\25BE"; }
.scholars-search-help a:hover, .scholars-tips__toggle:hover { color: #3b0000; }
.scholars-search-help a:focus-visible, .scholars-tips__toggle:focus-visible { outline: 3px solid #500000; outline-offset: 2px; }
.scholars-tips { display: grid; grid-template-rows: 1fr; font-size: 0.875rem; transition: grid-template-rows 0.35s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.35s ease, visibility 0.35s; }
.scholars-tips__inner { min-height: 0; overflow: hidden; }
.scholars-tips.is-collapsed { grid-template-rows: 0fr; opacity: 0; visibility: hidden; }
@media (prefers-reduced-motion: reduce) { .scholars-tips { transition: none; } }
.scholars-tips__heading { font-family: "Open Sans", Arial, sans-serif; font-size: 0.875rem; font-weight: 700; margin: 8px 0 4px; }
.scholars-tips ul { margin: 0; padding-left: 20px; max-width: 60ch; color: #2c2b28; }
.scholars-tips li { margin-bottom: 4px; }



.scholars-feed .scholars-grid[data-layout="compact"] {
  grid-template-columns: 1fr;
  gap: 0 32px;
}
@media (min-width: 700px) {
  .scholars-feed .scholars-grid[data-layout="compact"] { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1100px) {
  .scholars-feed .scholars-grid[data-layout="compact"] { grid-template-columns: repeat(3, 1fr); }
}

.scholars-feed .scholars-grid > .scholar-row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 22px 10px;
  border-bottom: 1px solid #e8e6e0;
  margin: 0;
}
.scholar-row img {
  width: 48px;
  height: 48px;
  flex: none;
  border-radius: 50%;
  border: 2px solid #500000;
  object-fit: cover;
  box-sizing: border-box;
  background: #f9f2f2;
}
.scholar-row__text { min-width: 0; display: flex; flex-direction: column; }
.scholar-row__name {
  font-family: "Work Sans", Arial, sans-serif;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.25;
  color: #500000;
  text-decoration: none;
}
.scholar-row__name::after { content: ""; position: absolute; inset: 0; }
.scholar-row__name:hover, .scholar-row__name:focus-visible { text-decoration: underline; }
.scholar-row:hover { background: #f9f2f2; }
.scholar-row__detail {
  font-size: 0.8125rem;
  line-height: 1.3;
  color: #5c5a55;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Job title in italics. */
.scholar-row__title { font-style: italic; }

/* Edit my profile button: top-right of the hero card, on its own row above the heading. */
.scholars-hero__action { display: flex; justify-content: flex-end; margin: -28px 0 4px; }
/* Deliberate deviation from AUX: no small button size exists, so this one button is shrunk
   (white with a maroon border and type) to stay a quiet secondary action beside the search. */
.scholars-hero__action a.btn.btn--secondary { padding: 4px 12px; min-height: 0; font-size: 0.75rem; line-height: 1.3; background: #ffffff; color: #500000; border: 2px solid #500000; }
.scholars-hero__action a.btn.btn--secondary:hover { background: #f9f2f2; color: #3b0000; border-color: #3b0000; }
.scholars-hero__action a.btn.btn--secondary:focus-visible { outline: 3px solid #500000; outline-offset: 2px; }








/* The "Updated today" dot and legend styles are shared with version 1 and live in styles.css. */


.profile-collection{
    margin-top:20px;
}

.hero.hero--main.hero--narrow .hero__image, .hero.hero--main.hero--narrow .hero__video {
    aspect-ratio: unset;
    height: 400px !important;
}
