/* =============================================================
   RCI Design System — Stony Brook Research Computing & Informatics
   Shared stylesheet for the prototype and the Drupal theme.
   ============================================================= */
:root {
  --sbu-red: #990000;
  --sbu-red-dark: #7a0000;
  --sbu-red-bright: #c1121f;
  --sbu-navy: #002244;
  --ink: #1c1e21;
  --ink-soft: #44484d;
  --gray-100: #f8f9fa;
  --gray-200: #e9ecef;
  --gray-300: #dee2e6;
  --gray-400: #ced4da;
  --gray-500: #5f656b; /* was #adb5bd (2:1); darkened for WCAG AA text contrast */
  --gray-600: #6c757d;
  --gray-700: #495057;
  --gray-800: #343a40;
  --gray-900: #212529;
  --black: #000000;
  --footer-bg: #002244;
  --white: #ffffff;
  --radius: 10px;
  --shadow-sm: 0 1px 3px rgba(20, 22, 26, 0.08);
  --shadow-md: 0 6px 18px rgba(20, 22, 26, 0.1);
  --shadow-lg: 0 14px 34px rgba(20, 22, 26, 0.16);
  --font:
    "Barlow Semi Condensed", "Arial Narrow", -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  font-size: 20px;
}
body {
  font-family: var(--font);
  color: var(--ink);
  background: var(--white);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
a {
  color: var(--sbu-red);
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
img {
  max-width: 100%;
  display: block;
}
.container {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ---------- Utility bar ---------- */
.utilbar {
  background: var(--white);
  font-family: "Barlow", sans-serif;
  color: #000000;
  font-size: 0.8rem;
  border-bottom: 1px solid var(--gray-400);
}
.utilbar .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 65px;
  flex-wrap: wrap;
  row-gap: 2px;
  padding-top: 3px;
  padding-bottom: 3px;
}
.utilbar a {
  color: var(--sbu-red);
  margin-right: 18px;
  text-decoration: none;
  transition: color 0.15s;
}
.utilbar a:hover {
  color: var(--navy);
}
.utilbar .quick {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 2px;
}
.utilbar .quick a {
  font-size: 0.92rem;
  font-weight: 600;
}
.utilbar .quick .lbl {
  color: #5f656b;
  margin-right: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.68rem;
}
.btn-ticket {
  background: var(--sbu-red);
  color: #fff !important;
  padding: 5px 14px;
  border-radius: 999px;
  font-weight: 600;
  margin-right: 0 !important;
  transition: background 0.15s;
}
.btn-ticket:hover {
  background: var(--sbu-red-bright);
  text-decoration: none;
}

/* ---------- Header ---------- */
header.site {
  background: var(--white);
  border-bottom: 1px solid var(--gray-200);
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.02);
}
.site-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 96px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.brand a {
  text-decoration: none;
}
.shield {
  width: 46px;
  height: 46px;
  flex: none;
  background: var(--sbu-red);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: 0.02em;
  font-family: Georgia, serif;
}
.brand-text .u {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--sbu-red);
  font-weight: 700;
}
.brand-text .d {
  font-size: 1.12rem;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.15;
}
nav.main {
  display: flex;
  align-items: center;
  gap: 4px;
}
nav.main > a,
nav.main .drop > button {
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--ink-soft);
  padding: 10px 13px;
  border-radius: 8px;
  background: none;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  transition:
    color 0.15s,
    background 0.15s;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
}
nav.main > a:hover,
nav.main .drop > button:hover {
  color: var(--sbu-red);
  background: var(--gray-100);
  text-decoration: none;
}
nav.main > a.active {
  color: var(--sbu-red);
}
.drop {
  position: relative;
}
.caret {
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.2s;
}
.drop.open .caret {
  transform: rotate(225deg) translateY(-1px);
}
.menu {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%) translateY(6px);
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  padding: 18px;
  display: none;
  width: 640px;
  opacity: 0;
  transition:
    opacity 0.18s,
    transform 0.18s;
}
.drop.open .menu {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px 26px;
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.menu h5 {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--sbu-red);
  margin: 10px 0 4px;
}
.menu a {
  display: block;
  padding: 5px 8px;
  border-radius: 6px;
  color: var(--ink-soft);
  font-size: 0.88rem;
  font-weight: 500;
}
.menu a:hover {
  background: var(--gray-100);
  color: var(--sbu-red);
  text-decoration: none;
}
.hamb {
  display: none;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 8px;
}
.hamb span {
  display: block;
  width: 24px;
  height: 2.5px;
  background: var(--ink);
  margin: 5px 0;
  border-radius: 2px;
  transition: 0.25s;
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 0.95rem;
  padding: 13px 26px;
  border-radius: 8px;
  transition:
    transform 0.15s,
    box-shadow 0.15s,
    background 0.15s;
  text-decoration: none !important;
}
.btn-solid {
  background: #fff;
  color: var(--sbu-red);
}
.btn-solid:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
}
.btn-ghost {
  border: 1.5px solid rgba(255, 255, 255, 0.6);
  color: #fff;
}
.btn-ghost:hover {
  background: rgba(255, 255, 255, 0.12);
  transform: translateY(-2px);
}
.btn-red {
  background: var(--sbu-red);
  color: #fff;
}
.btn-red:hover {
  background: var(--sbu-red-bright);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.btn-outline {
  border: 1.5px solid var(--gray-300);
  color: var(--ink);
}
.btn-outline:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}

/* ---------- Home hero ---------- */
.hero {
  position: relative;
  color: #fff;
  overflow: hidden;
  background:
    radial-gradient(
      ellipse 90% 120% at 105% -10%,
      rgba(255, 120, 90, 0.28),
      transparent 55%
    ),
    radial-gradient(
      ellipse 70% 90% at -8% 108%,
      rgba(20, 0, 4, 0.85),
      transparent 62%
    ),
    linear-gradient(118deg, #1d0507 0%, #4b080c 38%, #8a0f14 72%, #b3251f 100%);
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      ellipse 60% 55% at 85% 20%,
      rgba(255, 255, 255, 0.12),
      transparent 60%
    ),
    url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1600 600%22 preserveAspectRatio=%22xMidYMid slice%22%3E%3Cpath d=%22M-40 90 C 260 44, 520 136, 820 58 S 1380 127, 1660 67%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.050%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 158 C 260 105, 520 211, 820 121 S 1380 200, 1660 132%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.062%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 226 C 260 166, 520 286, 820 184 S 1380 274, 1660 196%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.074%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 294 C 260 227, 520 361, 820 247 S 1380 348, 1660 260%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.086%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 362 C 260 288, 520 436, 820 310 S 1380 421, 1660 325%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.098%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 430 C 260 349, 520 511, 820 373 S 1380 495, 1660 390%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.110%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 498 C 260 410, 520 586, 820 436 S 1380 568, 1660 454%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.122%22 stroke-width=%221.6%22/%3E%3Ccircle cx=%221231%22 cy=%22117%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221566%22 cy=%2264%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221448%22 cy=%2288%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221496%22 cy=%2269%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221119%22 cy=%2259%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221344%22 cy=%22254%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221146%22 cy=%2286%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221334%22 cy=%2270%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221026%22 cy=%22154%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221542%22 cy=%2271%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221499%22 cy=%22243%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221126%22 cy=%2263%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221036%22 cy=%22188%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221047%22 cy=%22100%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3C/svg%3E")
      center/cover no-repeat;
}
.hero-grid {
  position: absolute;
  inset: 0;
  opacity: 0.08;
  mix-blend-mode: screen;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.35) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.35) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(
    ellipse 75% 90% at 70% 30%,
    #000 30%,
    transparent 75%
  );
}
.hero .container {
  position: relative;
  padding: 84px 24px 72px;
}
.kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.25);
  padding: 7px 14px;
  border-radius: 999px;
  margin-bottom: 22px;
  backdrop-filter: blur(4px);
}
.kicker .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #7ee08a;
  box-shadow: 0 0 0 4px rgba(126, 224, 138, 0.22);
}
.hero h1 {
  font-family:
    "Alumni Sans", "Barlow Condensed", "Arial Narrow", "Roboto Condensed",
    "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(2.6rem, 4.4vw, 4.4rem);
  line-height: 0.98;
  font-weight: 600;
  letter-spacing: -0.015em;
  max-width: 760px;
}
.hero p.lead {
  margin-top: 18px;
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  max-width: 640px;
  color: rgba(255, 255, 255, 0.88);
}
.hero-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 32px;
}

/* ---------- Page hero (subpages) ---------- */
.page-hero {
  font-family:
    "Alumni Sans", "Barlow Condensed", "Arial Narrow", "Roboto Condensed",
    "Helvetica Neue", Arial, sans-serif;
  position: relative;
  color: #fff;
  overflow: hidden;
  background:
    radial-gradient(
      ellipse 85% 130% at 104% -12%,
      rgba(255, 120, 90, 0.24),
      transparent 55%
    ),
    linear-gradient(118deg, #200507 0%, #4e080c 42%, #8a0f14 78%, #ad211d 100%);
}
.page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      ellipse 55% 70% at 88% 25%,
      rgba(255, 255, 255, 0.11),
      transparent 60%
    ),
    url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1600 600%22 preserveAspectRatio=%22xMidYMid slice%22%3E%3Cpath d=%22M-40 90 C 260 44, 520 136, 820 58 S 1380 127, 1660 67%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.050%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 158 C 260 105, 520 211, 820 121 S 1380 200, 1660 132%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.062%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 226 C 260 166, 520 286, 820 184 S 1380 274, 1660 196%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.074%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 294 C 260 227, 520 361, 820 247 S 1380 348, 1660 260%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.086%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 362 C 260 288, 520 436, 820 310 S 1380 421, 1660 325%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.098%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 430 C 260 349, 520 511, 820 373 S 1380 495, 1660 390%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.110%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M-40 498 C 260 410, 520 586, 820 436 S 1380 568, 1660 454%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%220.122%22 stroke-width=%221.6%22/%3E%3Ccircle cx=%221231%22 cy=%22117%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221566%22 cy=%2264%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221448%22 cy=%2288%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221496%22 cy=%2269%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221119%22 cy=%2259%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221344%22 cy=%22254%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221146%22 cy=%2286%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221334%22 cy=%2270%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221026%22 cy=%22154%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221542%22 cy=%2271%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221499%22 cy=%22243%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221126%22 cy=%2263%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221036%22 cy=%22188%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3Ccircle cx=%221047%22 cy=%22100%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%220.10%22/%3E%3C/svg%3E")
      center/cover no-repeat;
}
.page-hero .container {
  position: relative;
  padding: 52px 24px 46px;
}
.page-hero .eyebrow {
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: rgba(255, 255, 255, 0.75);
  margin-bottom: 10px;
}
.page-hero h1 {
  font-size: clamp(1.7rem, 3.4vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -0.015em;
  max-width: 820px;
}
.page-hero p.sub {
  margin-top: 12px;
  max-width: 700px;
  color: rgba(255, 255, 255, 0.85);
  font-size: 1.02rem;
}
.meta-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}
.meta-chip {
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.28);
  padding: 6px 13px;
  border-radius: 999px;
}

/* ---------- Breadcrumb ---------- */
.crumbs {
  background: var(--gray-100);
  border-bottom: 1px solid var(--gray-200);
  font-size: 0.82rem;
}
.crumbs .container {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 11px 24px;
  color: var(--gray-500);
}
.crumbs a {
  color: var(--ink-soft);
  font-weight: 600;
}
.crumbs a:hover {
  color: var(--sbu-red);
}
.crumbs .sep {
  color: var(--gray-300);
}

/* ---------- Stats ---------- */
.stats {
  background: #fff;
  border-bottom: 1px solid var(--gray-200);
}
.stats .container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--gray-200);
  border-left: 1px solid var(--gray-200);
  border-right: 1px solid var(--gray-200);
}
.stat {
  background: #fff;
  padding: 34px 26px;
  text-align: center;
}
.stat .num {
  font-size: 2.25rem;
  font-weight: 800;
  color: var(--sbu-red);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.stat .lab {
  font-size: 0.86rem;
  color: var(--ink-soft);
  margin-top: 6px;
}

/* ---------- Sections ---------- */
section.block {
  padding: 78px 0;
}
.band-gray {
  background: var(--gray-100);
}
.sec-head {
  max-width: 800px;
  margin-bottom: 38px;
}
.sec-head .eyebrow,
.eyebrow {
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--sbu-red);
  margin-bottom: 10px;
}
.sec-head h2 {
  font-family:
    "Alumni Sans", "Barlow Condensed", "Arial Narrow", "Roboto Condensed",
    "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(1.6rem, 3vw, 3.2rem);
  font-weight: 600;
  letter-spacing: -0.015em;
}
.sec-head p {
  margin-top: 12px;
  color: var(--ink-soft);
}

/* ---------- Pathways ---------- */
.paths {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.path {
  background: var(--gray-200);
  border: 1px solid var(--gray-400);
  border-radius: var(--radius);
  padding: 22px;
  transition:
    transform 0.18s,
    box-shadow 0.18s,
    border-color 0.18s;
  cursor: pointer;
}
.path:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: var(--sbu-red);
}
.path .q {
  font-weight: 700;
  font-size: 0.98rem;
  margin-bottom: 8px;
}
.path .a {
  font-size: 0.85rem;
  color: var(--ink-soft);
}

/* ---------- Service cards ---------- */
.svc-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  margin-bottom: 26px;
}
.search-wrap {
  position: relative;
  flex: 1;
  min-width: 260px;
}
.search-wrap svg {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--gray-500);
}
#svcSearch,
#swSearch,
#teamSearch,
#annSearch,
#saSearch {
  width: 100%;
  padding: 13px 16px 13px 44px;
  border: 1.5px solid var(--gray-300);
  border-radius: 999px;
  font-size: 0.95rem;
  font-family: inherit;
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
  background: #fff;
}
#svcSearch:focus,
#swSearch:focus,
#teamSearch:focus,
#annSearch:focus {
  border-color: var(--sbu-red);
  box-shadow: 0 0 0 4px rgba(153, 0, 0, 0.1);
}
.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.chip {
  border: 1.5px solid var(--gray-300);
  background: #fff;
  color: var(--ink-soft);
  font-size: 0.8rem;
  font-weight: 600;
  padding: 8px 15px;
  border-radius: 999px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
}
.chip:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}
.chip.active {
  background: var(--sbu-red);
  border-color: var(--sbu-red);
  color: #fff;
}
.svc-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.svc {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  padding: 26px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition:
    transform 0.18s,
    box-shadow 0.18s,
    border-color 0.18s;
  position: relative;
}
.svc:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lg);
  border-color: transparent;
}
.svc .top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.svc .icon {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  background: rgba(153, 0, 0, 0.08);
  color: var(--sbu-red);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
}
.svc .tag {
  font-size: 0.66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gray-700);
  background: var(--gray-100);
  padding: 4px 10px;
  border-radius: 999px;
}
.svc h3 {
  font-size: 1.08rem;
  font-weight: 700;
}
.svc h3 a {
  color: var(--ink);
}
.svc h3 a::after {
  content: "";
  position: absolute;
  inset: 0;
}
.svc h3 a:hover {
  text-decoration: none;
  color: var(--sbu-red);
}
.svc p {
  font-size: 0.88rem;
  color: var(--ink-soft);
  flex: 1;
}
.svc .go {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--sbu-red);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.svc:hover .go .arr {
  transform: translateX(4px);
}
.go .arr {
  transition: transform 0.18s;
  display: inline-block;
}
#noResults {
  display: none;
  text-align: center;
  color: var(--gray-500);
  padding: 50px 0;
  font-size: 0.95rem;
}
/* University IT (DoIT) band — same card, with a provider badge + external cue (patch 46) */
.svc .top {
  gap: 8px;
}
.svc .prov {
  margin-left: auto;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #3a5a86;
  background: #eef1f4;
  border: 1px solid #dbe2ec;
  border-radius: 6px;
  padding: 3px 7px;
  white-space: nowrap;
}
.svc-ext .tag {
  max-width: none;
}
.svc-ext h3 a .ext {
  font-size: 0.78em;
  color: var(--gray-500);
  font-weight: 600;
}
.svc-ext:hover h3 a .ext {
  color: var(--sbu-red);
}
#university-it .uit-src {
  font-size: 0.84rem;
  color: var(--gray-500);
  margin-top: 20px;
}
#university-it .uit-src a {
  color: var(--sbu-red);
  font-weight: 600;
  text-decoration: none;
}
#university-it .uit-src a:hover {
  text-decoration: underline;
}

/* ---------- Announcements ---------- */
.ann-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.ann {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  overflow: hidden;
  transition:
    transform 0.18s,
    box-shadow 0.18s;
}
.ann:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.ann .bar {
  height: 4px;
  background: var(--sbu-red);
}
.ann .pad {
  padding: 24px;
}
.ann .date {
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gray-500);
  margin-bottom: 8px;
}
.ann h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: 8px;
}
.ann p {
  font-size: 0.88rem;
  color: var(--ink-soft);
}
.pill {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  margin-bottom: 10px;
}
.pill-maint {
  background: #fdecec;
  color: var(--sbu-red);
}
.pill-new {
  background: #e9f7ec;
  color: #1c7c31;
}
.pill-event {
  background: #eef3fd;
  color: #274f9c;
}
.viewall {
  margin-top: 28px;
  text-align: center;
}

/* Announcement list page */
.ann-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 860px;
}
.ann-row {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-left: 4px solid var(--sbu-red);
  border-radius: var(--radius);
  padding: 22px 26px;
  transition:
    transform 0.15s,
    box-shadow 0.15s;
}
.ann-row:hover {
  transform: translateX(4px);
  box-shadow: var(--shadow-md);
}
.ann-row .date {
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gray-500);
}
.ann-row h3 {
  font-size: 1.08rem;
  font-weight: 700;
  margin: 4px 0 6px;
}
.ann-row p {
  font-size: 0.9rem;
  color: var(--ink-soft);
}

/* ---------- CRIO band ---------- */
.crio {
  background: linear-gradient(
    115deg,
    #3d0507,
    var(--sbu-red-dark) 55%,
    var(--sbu-red)
  );
  color: #fff;
  position: relative;
  overflow: hidden;
}
.crio::after {
  content: "☕";
  position: absolute;
  right: 6%;
  top: 50%;
  transform: translateY(-50%);
  font-size: 9rem;
  opacity: 0.12;
}
.crio .container {
  padding: 60px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  flex-wrap: wrap;
  position: relative;
}
.crio h2 {
  font-size: clamp(1.4rem, 2.6vw, 1.9rem);
  font-weight: 800;
  max-width: 560px;
}
.crio p {
  color: rgba(255, 255, 255, 0.85);
  margin-top: 8px;
  max-width: 560px;
}

/* ---------- Feature ---------- */
.feature {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 0;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.feature .visual {
  background: linear-gradient(140deg, #141619, #33383d);
  min-height: 320px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.feature .visual .molecule {
  font-size: 5rem;
  opacity: 0.9;
}
.feature .visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(
    rgba(255, 255, 255, 0.16) 1.5px,
    transparent 1.5px
  );
  background-size: 26px 26px;
  opacity: 0.5;
}
.feature .copy {
  background: #fff;
  padding: 46px;
}
.feature h3 {
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.feature p {
  margin-top: 12px;
  color: var(--ink-soft);
  font-size: 0.95rem;
}

/* ---------- Subpage layout ---------- */
.layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 44px;
  padding: 56px 0 78px;
}
.content h2 {
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  margin: 48px 0 16px;
  padding-top: 8px;
}
.content h2:first-child {
  margin-top: 0;
}
.content h3 {
  font-size: 1.08rem;
  font-weight: 700;
  margin: 34px 0 12px;
}
.content p {
  margin-bottom: 14px;
  color: var(--ink-soft);
}
.content ul {
  margin: 0 0 16px 20px;
  color: var(--ink-soft);
}
.content ul li {
  margin-bottom: 7px;
}
.content .lede {
  font-size: 1.08rem;
  color: var(--ink);
}
.steps {
  counter-reset: step;
  list-style: none;
  margin: 0 0 16px;
}
.steps li {
  counter-increment: step;
  position: relative;
  padding: 0 0 18px 52px;
  color: var(--ink-soft);
}
.steps li::before {
  content: counter(step);
  position: absolute;
  left: 0;
  top: -2px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(153, 0, 0, 0.08);
  color: var(--sbu-red);
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
}
.steps li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 16px;
  top: 34px;
  bottom: 0;
  width: 2px;
  background: var(--gray-200);
}
.callout {
  background: var(--gray-100);
  border-left: 4px solid var(--sbu-red);
  border-radius: 0 var(--radius) var(--radius) 0;
  padding: 18px 22px;
  margin: 20px 0;
  font-size: 0.92rem;
  color: var(--ink-soft);
}
.callout strong {
  color: var(--ink);
}
.twocol {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 16px 0;
}
.minicard {
  background: var(--gray-100);
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  padding: 18px 20px;
}
.minicard h4 {
  font-size: 0.86rem;
  font-weight: 800;
  margin-bottom: 8px;
}
.minicard ul {
  margin-left: 18px;
  font-size: 0.86rem;
}
.minicard li {
  margin-bottom: 5px;
}

/* Sidebar */
.sidebar {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.side-card {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  padding: 24px;
  box-shadow: var(--shadow-sm);
}
.side-card h4 {
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--sbu-red);
  margin-bottom: 14px;
}
.side-card .btn {
  width: 100%;
  justify-content: center;
  margin-bottom: 10px;
  padding: 12px 18px;
  font-size: 0.9rem;
}
.side-card .btn:last-child {
  margin-bottom: 0;
}
.side-links a {
  display: block;
  padding: 8px 0;
  border-bottom: 1px solid var(--gray-100);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--ink-soft);
}
.side-links a:last-child {
  border-bottom: 0;
}
.side-links a:hover {
  color: var(--sbu-red);
  text-decoration: none;
}
.side-contact {
  font-size: 0.9rem;
  color: var(--ink-soft);
}
.side-contact strong {
  display: block;
  color: var(--ink);
}
.side-contact div {
  margin-bottom: 12px;
}
.side-contact div:last-child {
  margin-bottom: 0;
}

/* Related services */
.rel-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* ---------- Team ---------- */
.team-group {
  margin-bottom: 46px;
}
.team-group h2 {
  font-size: 1.2rem;
  font-weight: 800;
  margin-bottom: 18px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--gray-300);
}
.team-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.person {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  padding: 22px;
  display: flex;
  gap: 14px;
  align-items: center;
  transition:
    transform 0.15s,
    box-shadow 0.15s;
}
.person:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}
.person .avatar {
  width: 83px;
  height: 83px;
  flex: none;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--sbu-red), #c94b4b);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 1.05rem;
}
.person .nm {
  font-weight: 700;
  font-size: 0.98rem;
}
.person .ti {
  font-size: 0.82rem;
  color: var(--ink-soft);
}
.person-lead {
  grid-column: 1/-1;
  background: linear-gradient(115deg, #2b0507, var(--sbu-red-dark));
  color: #fff;
  border: 0;
}
.person-lead .ti {
  color: rgba(255, 255, 255, 0.8);
}
.person-lead .avatar {
  background: #fff;
  color: var(--sbu-red);
}

/* ---------- Stories ---------- */
.story-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.story {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: 14px;
  overflow: hidden;
  transition:
    transform 0.18s,
    box-shadow 0.18s;
  position: relative;
}
.story:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lg);
}
.story .visual {
  height: 170px;
  background: linear-gradient(140deg, #141619, #3a4046);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  position: relative;
}
.story .visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(
    rgba(255, 255, 255, 0.14) 1.5px,
    transparent 1.5px
  );
  background-size: 24px 24px;
}
.story .pad {
  padding: 24px;
}
.story h3 {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 8px;
}
.story h3 a {
  color: var(--ink);
}
.story h3 a::after {
  content: "";
  position: absolute;
  inset: 0;
}
.story h3 a:hover {
  text-decoration: none;
  color: var(--sbu-red);
}
.story p {
  font-size: 0.88rem;
  color: var(--ink-soft);
}

/* ---------- Footer ---------- */
footer.site-footer {
  font-size: 0.9rem;
}
.gradient-specialty-deep-blue-green {
  height: 28px;
  background: -webkit-linear-gradient(
    1.59deg,
    #002244 0%,
    #1791ad 36%,
    #bccf9d 100%
  );
  background: -o-linear-gradient(
    1.59deg,
    #002244 0%,
    #1791ad 36%,
    #bccf9d 100%
  );
  background: linear-gradient(88.41deg, #002244 0%, #1791ad 36%, #bccf9d 100%);
}
@media (max-width: 35.9988rem) {
  .gradient-specialty-deep-blue-green {
    height: 16px;
  }
  .gradient-specialty-deep-blue-green.no-show {
    display: none;
  }
}
.foot-main {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 40px;
  padding: 60px 0 44px;
}
.foot-main :is(h2,h4) {
  color: #fff;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin-bottom: 16px;
}
.foot-main a {
  display: block;
  color: var(--black);
  padding: 4px 0;
  transition: color 0.15s;
}
.foot-main a:hover {
  color: var(--sbu-red);
  text-decoration: none;
}
.foot-brand .shield {
  margin-bottom: 14px;
}
.foot-brand p {
  max-width: 300px;
  font-size: 0.85rem;
  line-height: 1.6;
}
.footer-red-bar {
  height: 35px;
  background: var(--sbu-red);
}
.foot-bottom {
  background: var(--footer-bg);
  font-size: 0.88rem;
  padding: 40px 0;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 0.78rem;
  color: var(--white);
  text-align: center;
}
.foot-bottom a {
  color: var(--white);
}
.foot-bottom a:hover {
  color: var(--gray-200);
}
a.university-legal {
  text-decoration: underline;
  font-weight: 500;
}
.foot-bottom .copyright {
  font-size: 0.78rem;
  color: var(--gray-200);
  padding: 20px 0;
}
/* ---------- Reveal ---------- */
.reveal {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity 0.6s ease,
    transform 0.6s ease;
}
.reveal.in {
  opacity: 1;
  transform: none;
}

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .svc-grid,
  .ann-grid,
  .rel-grid,
  .team-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .paths {
    grid-template-columns: repeat(2, 1fr);
  }
  .stats .container {
    grid-template-columns: repeat(2, 1fr);
  }
  .feature,
  .story-grid,
  .twocol {
    grid-template-columns: 1fr;
  }
  .layout {
    grid-template-columns: 1fr;
  }
  .foot-main {
    grid-template-columns: 1fr 1fr;
  }
  .nav-wrapper {
    background: var(--sbu-red);
  }
  nav.main {
    display: none;
    position: absolute;
    top: 78px;
    left: 0;
    right: 0;
    background: #fff;
    flex-direction: column;
    align-items: stretch;
    padding: 12px 20px 20px;
    border-bottom: 1px solid var(--gray-300);
    box-shadow: var(--shadow-lg);
  }
  nav.main.open {
    display: flex;
  }
  .menu {
    position: static;
    transform: none;
    width: 100%;
    box-shadow: none;
    border: 0;
    padding: 6px 10px;
  }
  .drop.open .menu {
    transform: none;
    grid-template-columns: 1fr;
    z-index: 100;
  }
  .hamb {
    display: block;
  }
}
@media (max-width: 600px) {
  .svc-grid,
  .ann-grid,
  .rel-grid,
  .team-grid,
  .paths,
  .stats .container {
    grid-template-columns: 1fr;
  }
  .utilbar .quick .hide-sm {
    display: none;
  }
  .hero .container {
    padding: 60px 24px 54px;
  }
}

/* ---------- HPC section ---------- */
.cmp-wrap {
  overflow-x: auto;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  background: #fff;
}
.cmp {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.cmp th {
  background: var(--ink);
  color: #fff;
  text-align: left;
  padding: 13px 16px;
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  white-space: nowrap;
}
.cmp td {
  padding: 14px 16px;
  border-top: 1px solid var(--gray-300);
  vertical-align: top;
  color: var(--ink-soft);
}
.cmp td strong {
  color: var(--ink);
}
.cmp td a {
  font-weight: 700;
}
.cmp tbody tr {
  transition: background 0.12s;
}
.cmp tbody tr:hover {
  background: var(--gray-100);
}
.cmp .ok {
  color: #1c7c31;
  font-weight: 800;
}
.cmp .no {
  color: var(--gray-300);
  font-weight: 800;
}
.badge-yes {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  background: #e9f7ec;
  color: #1c7c31;
}
.badge-no {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--gray-100);
  color: var(--gray-500);
}
.doc-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.doc-cat {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  padding: 24px;
  transition:
    transform 0.15s,
    box-shadow 0.15s;
}
.doc-cat:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}
.doc-cat .icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: rgba(153, 0, 0, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  margin-bottom: 12px;
}
.doc-cat h3 {
  font-size: 1.02rem;
  font-weight: 700;
  margin-bottom: 10px;
}
.doc-cat a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid var(--gray-100);
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--ink-soft);
}
.doc-cat a:last-child {
  border-bottom: 0;
}
.doc-cat a:hover {
  color: var(--sbu-red);
  text-decoration: none;
}
.doc-cat a.hidden {
  display: none;
}
.clu-tag {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--gray-100);
  color: var(--gray-500);
  white-space: nowrap;
}
.portal-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.portal {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  padding: 26px;
  text-align: center;
  transition:
    transform 0.15s,
    box-shadow 0.15s;
}
.portal:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.portal .picon {
  font-size: 2rem;
  margin-bottom: 10px;
}
.portal h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: 6px;
}
.portal p {
  font-size: 0.84rem;
  color: var(--ink-soft);
  margin-bottom: 16px;
}
.spec-list {
  list-style: none;
  margin: 0 0 16px;
}
.spec-list li {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 9px 0;
  border-bottom: 1px solid var(--gray-100);
  font-size: 0.9rem;
}
.spec-list li span:first-child {
  color: var(--gray-500);
  font-weight: 600;
  white-space: nowrap;
}
.spec-list li span:last-child {
  color: var(--ink);
  text-align: right;
}
@media (max-width: 960px) {
  .doc-grid,
  .portal-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .doc-grid,
  .portal-grid {
    grid-template-columns: 1fr;
  }
}

/* ---------- FAQ accordion ---------- */
.faq details {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  margin-bottom: 10px;
  overflow: hidden;
}
.faq summary {
  padding: 16px 20px;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.faq summary::-webkit-details-marker {
  display: none;
}
.faq summary::after {
  content: "+";
  color: var(--sbu-red);
  font-size: 1.25rem;
  font-weight: 800;
  flex: none;
}
.faq details[open] summary::after {
  content: "−";
}
.faq summary:hover {
  color: var(--sbu-red);
}
.faq .ans {
  padding: 0 20px 18px;
  color: var(--ink-soft);
  font-size: 0.92rem;
}
.faq .ans p {
  margin-bottom: 10px;
}

/* ---------- People ---------- */
a.person {
  text-decoration: none;
  color: inherit;
}
.person img.photo {
  width: 83px;
  height: 83px;
  border-radius: 50%;
  object-fit: cover;
  flex: none;
  background: var(--gray-100);
}
.person-lead img.photo {
  width: 110px;
  height: 110px;
}
.bio-photo {
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 12px;
  object-fit: cover;
  background: var(--gray-100);
  display: block;
}
.bio-fallback {
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--sbu-red), #c94b4b);
  color: #fff;
  display: none;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 3rem;
}

/* ---------- Article figures ---------- */
.content figure {
  margin: 34px 0 38px;
}
.content img {
  margin: 6px 0;
}
.content figure img {
  width: 100%;
  border-radius: 12px;
  border: 1px solid var(--gray-300);
  display: block;
  background: var(--gray-100);
}
.content figcaption {
  font-size: 0.82rem;
  color: var(--gray-500);
  margin-top: 8px;
  text-align: center;
}
.story .visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
}
.story .visual .emoji-fallback {
  position: relative;
  z-index: 1;
}

/* ---------- Storage picker ---------- */
.picker {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: 16px;
  box-shadow: var(--shadow-md);
  overflow: hidden;
  max-width: 760px;
  margin: 0 auto;
}
.picker .pk-head {
  background: linear-gradient(
    115deg,
    #3d0507,
    var(--sbu-red-dark) 60%,
    var(--sbu-red)
  );
  color: #fff;
  padding: 22px 26px;
}
.picker .pk-head h3 {
  font-size: 1.15rem;
  font-weight: 800;
}
.picker .pk-head p {
  font-size: 0.88rem;
  color: rgba(255, 255, 255, 0.85);
  margin-top: 4px;
}
.picker .pk-body {
  padding: 26px;
}
.pk-progress {
  display: flex;
  gap: 6px;
  margin-bottom: 22px;
}
.pk-progress span {
  height: 4px;
  flex: 1;
  border-radius: 2px;
  background: var(--gray-200);
  transition: background 0.2s;
}
.pk-progress span.done {
  background: var(--sbu-red);
}
.pk-q {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 6px;
}
.pk-hint {
  font-size: 0.86rem;
  color: var(--gray-500);
  margin-bottom: 18px;
}
.pk-opts {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pk-opt {
  text-align: left;
  background: var(--gray-100);
  border: 1.5px solid var(--gray-300);
  border-radius: 10px;
  padding: 15px 18px;
  font-family: inherit;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
  transition: all 0.14s;
  display: flex;
  align-items: center;
  gap: 12px;
}
.pk-opt:hover {
  border-color: var(--sbu-red);
  background: #fff;
  transform: translateX(3px);
}
.pk-opt .pk-ic {
  font-size: 1.3rem;
  flex: none;
}
.pk-opt .pk-sub {
  display: block;
  font-weight: 400;
  font-size: 0.82rem;
  color: var(--ink-soft);
  margin-top: 2px;
}
.pk-nav {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
}
.pk-back {
  background: none;
  border: 0;
  color: var(--gray-500);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  padding: 8px 4px;
}
.pk-back:hover {
  color: var(--sbu-red);
}
.pk-back[disabled] {
  opacity: 0;
  pointer-events: none;
}
/* result */
.pk-result .pk-rec {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  border: 1px solid var(--gray-300);
  border-radius: 12px;
  margin-bottom: 18px;
  background: var(--gray-100);
}
.pk-result .pk-rec .pk-badge {
  width: 54px;
  height: 54px;
  border-radius: 12px;
  background: rgba(153, 0, 0, 0.08);
  color: var(--sbu-red);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  flex: none;
}
.pk-result .pk-rec h4 {
  font-size: 1.15rem;
  font-weight: 800;
}
.pk-result .pk-rec .lbl {
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--sbu-red);
}
.pk-flags {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 18px;
}
.pk-flag {
  font-size: 0.88rem;
  padding: 10px 14px;
  border-radius: 8px;
  border-left: 3px solid var(--gray-300);
  background: var(--gray-100);
  color: var(--ink-soft);
}
.pk-flag.warn {
  border-left-color: var(--sbu-red);
  background: #fdecec;
}
.pk-flag.ok {
  border-left-color: #1c7c31;
  background: #e9f7ec;
}
.pk-flag.also {
  border-left-color: #274f9c;
  background: #eef3fd;
}
.pk-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* ---------- Code blocks (how-to guides) ---------- */
.content pre.cmd {
  background: #1c1e21;
  color: #e8eaed;
  border-radius: 10px;
  padding: 18px 20px;
  overflow-x: auto;
  font-family: var(
    --font-mono,
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    monospace
  );
  font-size: 0.95rem;
  line-height: 1.7;
  margin: 20px 0;
}
.content pre.cmd .c {
  color: #8a8f95;
}
.content pre.cmd .p {
  color: #7ee08a;
}
.content code.inline {
  background: var(--gray-100);
  border: 1px solid var(--gray-300);
  border-radius: 5px;
  padding: 1px 6px;
  font-family: var(
    --font-mono,
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    monospace
  );
  font-size: 0.92em;
  color: var(--sbu-red-dark);
}

/* ---------- Home metrics (grouped, color-coded) ---------- */
.metrics {
  background: #fff;
  border-bottom: 1px solid var(--gray-300);
}
.metrics .container {
  padding: 44px 24px 8px;
}
.metric-group {
  margin-bottom: 36px;
}
.metric-group .mg-label {
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  margin-bottom: 16px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--gray-300);
}
.mgrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--gray-200);
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  overflow: hidden;
}
.metric {
  background: #fff;
  padding: 26px 24px;
  text-align: center;
}
.metric .num {
  font-size: 2.3rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1.05;
}
.metric .lab {
  font-size: 0.88rem;
  color: var(--ink-soft);
  margin-top: 8px;
}
.mg-red .mg-label {
  color: var(--sbu-red);
}
.mg-red .num {
  color: var(--sbu-red);
}
.mg-blue .mg-label {
  color: #185fa5;
}
.mg-blue .num {
  color: #185fa5;
}
.mg-green .mg-label {
  color: #27500a;
}
.mg-green .num {
  color: #27500a;
}
@media (max-width: 960px) {
  .mgrid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 560px) {
  .mgrid {
    grid-template-columns: 1fr;
  }
}
.metric .num {
  font-size: 2.05rem;
}

/* ---------- About "By the numbers" (compact, in content column) ---------- */
.bynum .metric-group {
  margin-bottom: 22px;
}
.bynum .mgrid {
  grid-template-columns: repeat(4, 1fr);
}
.bynum .metric {
  padding: 14px 12px;
}
.bynum .metric .num {
  font-size: 1.3rem;
}
.bynum .metric .lab {
  font-size: 0.74rem;
  margin-top: 5px;
}
@media (max-width: 760px) {
  .bynum .mgrid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .bynum .mgrid {
    grid-template-columns: 1fr;
  }
}

/* ---------- System status ---------- */
.status-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #e9f7ec;
  border: 1px solid #b6e3c1;
  border-radius: 12px;
  padding: 18px 22px;
  margin-bottom: 26px;
}
.status-banner.warn {
  background: #fdf3e6;
  border-color: #f4d9a8;
}
.status-banner .dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #1c7c31;
  flex: none;
  box-shadow: 0 0 0 4px rgba(28, 124, 49, 0.18);
}
.status-banner.warn .dot {
  background: #ba7517;
  box-shadow: 0 0 0 4px rgba(186, 117, 23, 0.18);
}
.status-banner h3 {
  font-size: 1.05rem;
  font-weight: 800;
}
.status-banner p {
  font-size: 0.86rem;
  color: var(--ink-soft);
}
.status-list {
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  overflow: hidden;
}
.status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  border-top: 1px solid var(--gray-300);
  background: #fff;
}
.status-row:first-child {
  border-top: 0;
}
.status-row .svc-name {
  font-weight: 700;
}
.status-row .svc-name span {
  display: block;
  font-weight: 400;
  font-size: 0.82rem;
  color: var(--gray-500);
}
.st-pill {
  font-size: 0.74rem;
  font-weight: 700;
  padding: 5px 13px;
  border-radius: 999px;
  white-space: nowrap;
}
.st-ok {
  background: #e9f7ec;
  color: #1c7c31;
}
.st-maint {
  background: #fdf3e6;
  color: #a5610a;
}
.st-down {
  background: #fdecec;
  color: #a32d2d;
}

/* ---------- Copyable boilerplate ---------- */
.copybox {
  border: 1px solid var(--gray-300);
  border-radius: 12px;
  overflow: hidden;
  margin: 14px 0;
}
.copybox .cb-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--gray-100);
  padding: 10px 16px;
  border-bottom: 1px solid var(--gray-300);
}
.copybox .cb-head span {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--gray-500);
}
.copybtn {
  background: var(--sbu-red);
  color: #fff;
  border: 0;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.15s;
}
.copybtn:hover {
  background: var(--sbu-red-bright);
}
.copybtn.done {
  background: #1c7c31;
}
.copybox .cb-body {
  padding: 16px 18px;
  font-size: 0.9rem;
  color: var(--ink);
  line-height: 1.6;
  background: #fff;
}
.copybox .cb-body em {
  color: var(--sbu-red-dark);
  font-style: normal;
  background: #fdecec;
  padding: 0 4px;
  border-radius: 3px;
}

/* ---------- Events / calendar ---------- */
.ev-group {
  margin-bottom: 34px;
}
.ev {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  background: #fff;
  border: 1px solid var(--gray-300);
  border-left: 4px solid var(--sbu-red);
  border-radius: var(--radius);
  padding: 18px 22px;
  margin-bottom: 12px;
  transition:
    transform 0.15s,
    box-shadow 0.15s;
}
.ev:hover {
  transform: translateX(4px);
  box-shadow: var(--shadow-md);
}
.ev .when {
  flex: none;
  width: 120px;
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--sbu-red);
}
.ev .when span {
  display: block;
  font-weight: 400;
  font-size: 0.8rem;
  color: var(--gray-500);
}
.ev .what h3 {
  font-size: 1.02rem;
  font-weight: 700;
  margin-bottom: 4px;
}
.ev .what p {
  font-size: 0.88rem;
  color: var(--ink-soft);
}
.ev.recurring {
  border-left-color: #185fa5;
}
.ev.recurring .when {
  color: #185fa5;
}

/* ---------- Accessibility: skip link + focus ---------- */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 2000;
  background: var(--sbu-red);
  color: #fff;
  padding: 12px 20px;
  border-radius: 0 0 8px 0;
  font-weight: 700;
}
.skip-link:focus {
  left: 0;
  text-decoration: none;
}
:focus-visible {
  outline: 3px solid #185fa5;
  outline-offset: 2px;
  border-radius: 3px;
}
.utilbar a:focus-visible {
  outline-offset: -1px;
}
main:focus {
  outline: none;
}
.nav-search-sm {
  display: none;
}

/* ---------- Search page ---------- */
.search-wrap.big {
  max-width: 640px;
  margin: 0 auto 10px;
}
#siteSearch {
  width: 100%;
  padding: 16px 18px 16px 48px;
  border: 1.5px solid var(--gray-300);
  border-radius: 12px;
  font-size: 1.05rem;
  font-family: inherit;
  outline: none;
  background: #fff;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
#siteSearch:focus {
  border-color: var(--sbu-red);
  box-shadow: 0 0 0 4px rgba(153, 0, 0, 0.1);
}
.search-wrap.big svg {
  left: 16px;
}
#searchCount {
  text-align: center;
  color: var(--gray-500);
  font-size: 0.86rem;
  margin: 14px 0 22px;
}
.search-results {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.sr {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius);
  padding: 18px 22px;
  transition:
    transform 0.12s,
    box-shadow 0.12s;
}
.sr:hover {
  transform: translateX(4px);
  box-shadow: var(--shadow-md);
}
.sr .sr-sec {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--sbu-red);
}
.sr h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin: 3px 0 5px;
}
.sr p {
  font-size: 0.88rem;
  color: var(--ink-soft);
}
.sr mark {
  background: #fdf3c4;
  color: inherit;
  padding: 0 2px;
  border-radius: 2px;
}

/* ---------- ARIE chat assistant ---------- */
#arie-fab {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 900;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--sbu-red);
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: 13px 20px 13px 16px;
  font: inherit;
  font-weight: 700;
  font-size: 0.92rem;
  cursor: pointer;
  box-shadow: var(--shadow-lg);
  transition:
    background 0.15s,
    transform 0.15s;
}
#arie-fab:hover {
  background: var(--sbu-red-bright);
  transform: translateY(-2px);
}
#arie-fab .a-av {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #fff;
  color: var(--sbu-red);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 0.8rem;
  flex: none;
}
#arie-panel {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 901;
  width: 390px;
  max-width: calc(100vw - 32px);
  height: 600px;
  max-height: calc(100vh - 40px);
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: 16px;
  box-shadow: var(--shadow-lg);
  display: none;
  flex-direction: column;
  overflow: hidden;
}
#arie-panel.open {
  display: flex;
}
.arie-head {
  background: linear-gradient(
    115deg,
    #3d0507,
    var(--sbu-red-dark) 60%,
    var(--sbu-red)
  );
  color: #fff;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.arie-head .a-av {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  color: var(--sbu-red);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  flex: none;
}
.arie-head h3 {
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.1;
}
.arie-head p {
  font-size: 0.74rem;
  color: rgba(255, 255, 255, 0.82);
}
.arie-head button {
  margin-left: auto;
  background: none;
  border: 0;
  color: #fff;
  font-size: 1.3rem;
  cursor: pointer;
  line-height: 1;
  padding: 4px;
}
.arie-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  background: var(--gray-100);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.a-msg {
  max-width: 88%;
  padding: 11px 14px;
  border-radius: 14px;
  font-size: 0.9rem;
  line-height: 1.5;
}
.a-msg.bot {
  background: #fff;
  border: 1px solid var(--gray-300);
  align-self: flex-start;
  border-bottom-left-radius: 4px;
}
.a-msg.user {
  background: var(--sbu-red);
  color: #fff;
  align-self: flex-end;
  border-bottom-right-radius: 4px;
}
.a-msg.bot a {
  font-weight: 700;
}
.a-src {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.a-src a {
  display: block;
  background: var(--gray-100);
  border: 1px solid var(--gray-300);
  border-radius: 8px;
  padding: 8px 11px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--ink);
  text-decoration: none;
}
.a-src a:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}
.a-src a span {
  display: block;
  font-weight: 400;
  font-size: 0.72rem;
  color: var(--gray-500);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.a-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 4px;
}
.a-chip {
  background: #fff;
  border: 1.5px solid var(--gray-300);
  border-radius: 999px;
  padding: 7px 12px;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--ink-soft);
  cursor: pointer;
  transition: all 0.14s;
}
.a-chip:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}
.a-warn {
  background: #fdf3e6;
  border: 1px solid #f4d9a8;
  color: #8a5a10;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 0.82rem;
  line-height: 1.5;
}
.arie-foot {
  border-top: 1px solid var(--gray-300);
  padding: 10px;
  background: #fff;
}
.arie-inputrow {
  display: flex;
  gap: 8px;
}
#arie-input {
  flex: 1;
  border: 1.5px solid var(--gray-300);
  border-radius: 999px;
  padding: 11px 16px;
  font: inherit;
  font-size: 0.9rem;
  outline: none;
}
#arie-input:focus {
  border-color: var(--sbu-red);
  box-shadow: 0 0 0 3px rgba(153, 0, 0, 0.1);
}
#arie-send {
  background: var(--sbu-red);
  color: #fff;
  border: 0;
  border-radius: 999px;
  width: 42px;
  flex: none;
  cursor: pointer;
  font-size: 1.1rem;
}
#arie-send:hover {
  background: var(--sbu-red-bright);
}
.arie-disc {
  font-size: 0.68rem;
  color: var(--gray-500);
  text-align: center;
  margin-top: 7px;
  line-height: 1.4;
}
@media (max-width: 480px) {
  #arie-panel {
    right: 8px;
    bottom: 8px;
    height: calc(100vh - 16px);
  }
}

/* ---------- Voice input ---------- */
.mic-btn {
  background: #fff;
  border: 1.5px solid var(--gray-300);
  color: var(--ink-soft);
  border-radius: 999px;
  width: 38px;
  height: 38px;
  flex: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
}
.mic-btn:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}
.mic-btn.listening {
  background: var(--sbu-red);
  border-color: var(--sbu-red);
  color: #fff;
  animation: micpulse 1.2s ease-in-out infinite;
}
@keyframes micpulse {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(153, 0, 0, 0.35);
  }
  50% {
    box-shadow: 0 0 0 9px rgba(153, 0, 0, 0);
  }
}
.mic-in-input {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
}
.arie-inputrow .mic-btn {
  width: 42px;
  height: 42px;
}
.arie-speak {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #fff;
  border-radius: 999px;
  width: 32px;
  height: 32px;
  cursor: pointer;
  font-size: 0.85rem;
  margin-left: auto;
  flex: none;
}
.arie-speak.on {
  background: #fff;
  color: var(--sbu-red);
}
.arie-head button#arie-close {
  margin-left: 8px;
}

/* --- SLURM script builder ---------------------------------------------- */
.sb-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 26px;
  align-items: start;
}
@media (max-width: 960px) {
  .sb-grid {
    grid-template-columns: 1fr;
  }
}
.sb-form {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: 14px;
  padding: 24px;
  box-shadow: var(--shadow-md);
}
.sb-form h3 {
  font-size: 1.05rem;
  font-weight: 800;
  margin-bottom: 16px;
}
.sb-field {
  margin-bottom: 14px;
}
.sb-field label {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--gray-500);
  margin-bottom: 5px;
}
.sb-field input[type="text"],
.sb-field input[type="email"],
.sb-field input[type="number"],
.sb-field select,
.sb-field textarea {
  width: 100%;
  border: 1.5px solid var(--gray-300);
  border-radius: 8px;
  padding: 9px 12px;
  font: inherit;
  font-size: 0.92rem;
  color: var(--ink);
  background: var(--gray-100);
}
.sb-field input:focus,
.sb-field select:focus,
.sb-field textarea:focus {
  outline: none;
  border-color: var(--sbu-red);
  background: #fff;
}
.sb-field textarea {
  font-family: var(
    --font-mono,
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    monospace
  );
  font-size: 0.84rem;
  line-height: 1.5;
  resize: vertical;
}
.sb-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.sb-row3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
}
.sb-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--ink);
}
.sb-check input {
  width: 16px;
  height: 16px;
  accent-color: var(--sbu-red);
}
.sb-hint {
  font-size: 0.78rem;
  color: var(--gray-500);
  margin-top: 5px;
}
.sb-out-wrap {
  position: sticky;
  top: 88px;
}
.sb-out-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  background: var(--gray-100);
  border: 1px solid var(--gray-300);
  border-bottom: 0;
  border-radius: 12px 12px 0 0;
  padding: 10px 16px;
}
.sb-out-head span {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--gray-500);
}
.sb-out-head .btns {
  display: flex;
  gap: 8px;
}
.sb-out-head button {
  border: 1px solid var(--gray-300);
  background: #fff;
  border-radius: 7px;
  padding: 6px 12px;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
}
.sb-out-head button:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}
.sb-out-head button.done {
  border-color: #1c7c31;
  color: #1c7c31;
}
pre#sbOut {
  margin: 0;
  background: #1c1e21;
  color: #e8eaed;
  border-radius: 0 0 12px 12px;
  padding: 18px 20px;
  overflow-x: auto;
  font-family: var(
    --font-mono,
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    monospace
  );
  font-size: 0.84rem;
  line-height: 1.65;
  min-height: 340px;
}
.sb-submit {
  margin-top: 12px;
  font-size: 0.85rem;
  color: var(--ink-soft);
}
.sb-submit code {
  background: var(--gray-100);
  border: 1px solid var(--gray-300);
  border-radius: 6px;
  padding: 3px 8px;
  font-size: 0.82rem;
  color: var(--sbu-red-dark);
}
#sbWarn {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}

/* --- Print stylesheet ---------------------------------------------------- */
@page {
  margin: 0.6in;
}
@media print {
  header.site,
  .site-footer,
  .skip-link,
  .utilbar,
  .hero-ctas,
  .svc-tools,
  .search-wrap,
  .viewall,
  #arie-fab,
  #arie-panel,
  .arie-panel,
  .mic-btn,
  .side-card:has(.bio-photo),
  .picker,
  #storagePicker,
  #clusterPicker,
  .sb-form,
  .sb-out-head .btns,
  #sbWarn,
  .chips,
  button[data-copy],
  .code-copy,
  .cb-head button,
  .fb-wrap,
  .az-strip,
  .video-embed,
  .am-share {
    display: none !important;
  }
  .hero::before,
  .page-hero::before,
  .hero-grid {
    display: none !important;
  }
  *,
  body {
    background: #fff !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
  body {
    font-size: 11pt;
    line-height: 1.5;
  }
  .reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .page-hero {
    background: #fff !important;
    border-bottom: 2pt solid #000;
    padding: 0 0 10pt;
    margin-bottom: 14pt;
  }
  .page-hero .eyebrow,
  .page-hero h1,
  .page-hero .sub {
    color: #000 !important;
  }
  .page-hero .meta-chip {
    border: 1pt solid #000;
    background: #fff !important;
  }
  .crumbs {
    border: 0;
    padding: 0;
    margin: 0 0 8pt;
    font-size: 9pt;
  }
  .layout {
    display: block;
  }
  .sidebar {
    margin-top: 18pt;
    page-break-inside: avoid;
  }
  .side-card {
    border: 1pt solid #999 !important;
    border-radius: 0;
    margin-bottom: 10pt;
  }
  .side-card * {
    color: #000 !important;
  }
  a {
    color: #000 !important;
    text-decoration: underline;
  }
  main a[href^="http"]:not(.btn):not(.clu-tag):not(.path):after {
    content: " (" attr(href) ")";
    font-size: 8.5pt;
    color: #444 !important;
    word-break: break-all;
  }
  .btn {
    border: 1pt solid #000 !important;
    background: #fff !important;
    color: #000 !important;
  }
  pre,
  pre#sbOut,
  .content pre.cmd {
    background: #fff !important;
    color: #000 !important;
    border: 1pt solid #000;
    border-radius: 0;
    font-size: 9pt;
    white-space: pre-wrap;
    word-break: break-word;
    overflow: visible !important;
    max-width: 100% !important;
    width: auto !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }
  .steps li {
    page-break-inside: auto;
  }
  .content pre.cmd .c,
  .content pre.cmd .p {
    color: #000 !important;
  }
  h1,
  h2,
  h3,
  h4 {
    page-break-after: avoid;
  }
  .callout,
  .copybox,
  .doc-cat,
  .metric-group,
  .ann,
  .svc,
  .person,
  .faq-item,
  table,
  figure,
  .steps li {
    page-break-inside: avoid;
  }
  table {
    border-collapse: collapse;
  }
  th,
  td {
    border: 0.5pt solid #666 !important;
    padding: 4pt 6pt;
  }
  .pill,
  .clu-tag {
    border: 0.5pt solid #000 !important;
    background: #fff !important;
    color: #000 !important;
  }
  .metric .num {
    color: #000 !important;
  }
  .band-gray,
  .block {
    background: #fff !important;
    padding-top: 8pt;
    padding-bottom: 8pt;
  }
  .feature .visual,
  .bio-fallback {
    display: none !important;
  }
  img {
    max-width: 200pt;
  }
  .sb-grid {
    display: block;
  }
  .sb-out-wrap {
    position: static;
  }
}

/* --- Docs polish: code copy buttons + prev/next nav ---------------------- */
.content pre.cmd {
  position: relative;
  padding-right: 74px;
}
.code-copy {
  position: absolute;
  top: 8px;
  right: 8px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.08);
  color: #cfd3d7;
  border-radius: 6px;
  padding: 4px 10px;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
}
.code-copy:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}
.code-copy.done {
  border-color: #7ee08a;
  color: #7ee08a;
}
.doc-pn {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-top: 30px;
  padding-top: 22px;
  border-top: 1px solid var(--gray-300);
}
.doc-pn-link {
  display: flex;
  flex-direction: column;
  gap: 3px;
  text-decoration: none;
  max-width: 46%;
}
.doc-pn-link .k {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gray-500);
}
.doc-pn-link .t {
  font-weight: 700;
  color: var(--sbu-red);
}
.doc-pn-link:hover .t {
  color: var(--sbu-red-hover, #c1121f);
}
.doc-pn-link.next {
  text-align: right;
  margin-left: auto;
}

/* --- Feedback widget ----------------------------------------------------- */
.fb-wrap {
  background: var(--gray-100);
  border-top: 1px solid var(--gray-300);
  padding: 26px 0;
}
.fb-box {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  max-width: 820px;
}
.fb-q {
  font-weight: 800;
  color: var(--ink);
}
.fb-btns {
  display: flex;
  gap: 8px;
}
.fb-btn {
  border: 1.5px solid var(--gray-300);
  background: #fff;
  border-radius: 999px;
  padding: 8px 18px;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
}
.fb-btn:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}
.fb-thanks {
  font-weight: 600;
  color: #1c7c31;
}
.fb-form {
  flex-basis: 100%;
  max-width: 640px;
}
.fb-form label {
  display: block;
  font-size: 0.85rem;
  font-weight: 700;
  margin-bottom: 6px;
}
.fb-form textarea {
  width: 100%;
  border: 1.5px solid var(--gray-300);
  border-radius: 8px;
  padding: 10px 12px;
  font: inherit;
  font-size: 0.9rem;
  background: #fff;
}
.fb-form textarea:focus {
  outline: none;
  border-color: var(--sbu-red);
}
.fb-actions {
  display: flex;
  gap: 10px;
  margin-top: 10px;
  flex-wrap: wrap;
}

/* --- Glossary tooltips --------------------------------------------------- */
.gloss {
  border-bottom: 1.5px dotted var(--sbu-red);
  cursor: help;
  position: relative;
}
.gloss:hover::after,
.gloss:focus::after {
  content: attr(data-def);
  position: absolute;
  left: 0;
  bottom: calc(100% + 8px);
  z-index: 60;
  width: 290px;
  background: #1c1e21;
  color: #f1f2f3;
  font-size: 0.8rem;
  font-weight: 400;
  line-height: 1.5;
  padding: 10px 13px;
  border-radius: 9px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}
.gloss:hover::before,
.gloss:focus::before {
  content: "";
  position: absolute;
  left: 14px;
  bottom: calc(100% + 2px);
  border: 6px solid transparent;
  border-top-color: #1c1e21;
  z-index: 60;
}
.gloss:focus {
  outline: 2px solid var(--sbu-red);
  outline-offset: 2px;
}

/* --- A–Z index ----------------------------------------------------------- */
.az-strip {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-bottom: 34px;
  position: sticky;
  top: 76px;
  background: #fff;
  padding: 10px 0;
  z-index: 20;
  border-bottom: 1px solid var(--gray-300);
}
.az-strip a,
.az-strip span {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  font-weight: 800;
  font-size: 0.9rem;
}
.az-strip a {
  color: var(--sbu-red);
  background: rgba(153, 0, 0, 0.06);
  text-decoration: none;
}
.az-strip a:hover {
  background: var(--sbu-red);
  color: #fff;
}
.az-strip span {
  color: var(--gray-300);
}
.az-group {
  margin-bottom: 30px;
}
.az-group h2 {
  font-size: 1.5rem;
  color: var(--sbu-red);
  border-bottom: 2px solid var(--gray-300);
  padding-bottom: 6px;
  margin-bottom: 10px;
  scroll-margin-top: 140px;
}
.az-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 2px 26px;
}
.az-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  padding: 7px 8px;
  border-radius: 7px;
  font-weight: 600;
  font-size: 0.93rem;
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid var(--gray-100);
}
.az-row:hover {
  background: var(--gray-100);
  color: var(--sbu-red);
}
.az-row .az-sec {
  font-size: 0.72rem;
  color: var(--gray-500);
  font-weight: 600;
  white-space: nowrap;
}

/* --- Events: calendar buttons ------------------------------------------- */
.ev .ev-cal {
  margin-top: 10px;
  font-size: 0.82rem;
  padding: 7px 14px;
}

/* --- Research in Action article polish ----------------------------------- */
.art-meta {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 12px 0;
  border-top: 3px solid var(--sbu-red);
  border-bottom: 1px solid var(--gray-300);
  margin-bottom: 26px;
  font-size: 0.85rem;
  color: var(--ink-soft);
}
.art-meta .am-field {
  background: var(--sbu-red);
  color: #fff;
  font-weight: 700;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 4px 12px;
  border-radius: 999px;
}
.art-meta .am-item {
  font-weight: 600;
}
.art-meta .am-share {
  margin-left: auto;
  border: 1px solid var(--gray-300);
  background: #fff;
  border-radius: 7px;
  padding: 6px 12px;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
}
.art-meta .am-share:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}
.art-meta .am-share.done {
  border-color: #1c7c31;
  color: #1c7c31;
}
.article .lede {
  font-size: 1.13rem;
  line-height: 1.75;
}
.article .lede::first-letter {
  float: left;
  font-size: 3.4rem;
  line-height: 0.85;
  font-weight: 800;
  color: var(--sbu-red);
  padding: 6px 10px 0 0;
  font-family: Georgia, serif;
}
.article h2 {
  position: relative;
  padding-top: 14px;
  margin-top: 34px;
}
.article h2::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 44px;
  height: 4px;
  border-radius: 2px;
  background: var(--sbu-red);
}
.article .callout {
  background: none;
  border-left: 0;
  position: relative;
  padding: 10px 0 10px 58px;
  font-size: 1.12rem;
  line-height: 1.7;
  font-style: italic;
  color: var(--ink);
}
.article .callout::before {
  content: "\201C";
  position: absolute;
  left: 0;
  top: -8px;
  font-size: 4.4rem;
  line-height: 1;
  color: var(--sbu-red);
  font-family: Georgia, serif;
  opacity: 0.85;
}
.article .callout strong {
  font-style: normal;
  display: block;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--sbu-red);
  margin-bottom: 6px;
}
.article figure img {
  box-shadow: var(--shadow-md);
}
.article figcaption {
  border-top: 2px solid var(--gray-300);
  padding-top: 8px;
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}
.video-embed {
  position: relative;
  aspect-ratio: 16/9;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--shadow-md);
  border: 1px solid var(--gray-300);
  margin: 26px 0 8px;
  background: #1c1e21;
}
.video-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.video-cap {
  font-size: 0.84rem;
  color: var(--gray-500);
  text-align: center;
  margin-bottom: 22px;
}

/* --- Magazine figure treatments ------------------------------------------ */
.article .fig-inset {
  float: right;
  width: 42%;
  max-width: 310px;
  margin: 4px 0 16px 26px;
}
.article .fig-inset img {
  box-shadow: var(--shadow-md);
}
.article .fig-inset figcaption {
  text-align: left;
  max-width: none;
  font-size: 0.78rem;
}
.article h2 {
  clear: both;
}
.article figcaption .cred {
  display: block;
  font-size: 0.72rem;
  color: var(--gray-500);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  margin-top: 2px;
}
@media (max-width: 640px) {
  .article .fig-inset {
    float: none;
    width: 100%;
    max-width: none;
    margin: 14px 0;
  }
}

.video-embed[data-yt] {
  cursor: pointer;
}
.video-embed[data-yt] img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.yt-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 76px;
  height: 54px;
  background: var(--sbu-red);
  border-radius: 14px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.45);
  transition:
    background 0.15s,
    transform 0.15s;
}
.yt-play::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-40%, -50%);
  border-style: solid;
  border-width: 11px 0 11px 19px;
  border-color: transparent transparent transparent #fff;
}
.video-embed[data-yt]:hover .yt-play,
.video-embed[data-yt]:focus .yt-play {
  background: #c1121f;
  transform: translate(-50%, -50%) scale(1.08);
}
.video-embed[data-yt]:focus {
  outline: 3px solid var(--sbu-red);
  outline-offset: 3px;
}

/* Drupal block/nav wrappers: let menu items participate in the header flex row */
nav.main > div,
nav.main > div > nav {
  display: contents;
}

/* --- Page-feedback webform: match the prototype .fb-box look ------------- */
.webform-submission-page-feedback-form {
  background: var(--gray-100);
  border: 1px solid var(--gray-300);
  border-radius: 14px;
  padding: 22px 26px 24px;
  margin: 38px 0 10px;
  max-width: 820px;
}
.webform-submission-page-feedback-form fieldset.webform-type-radios {
  border: 0;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}
.webform-submission-page-feedback-form legend {
  float: left;
  padding: 0;
  margin: 0 4px 0 0;
}
.webform-submission-page-feedback-form .fieldset-legend {
  font-weight: 800;
  color: var(--ink);
  font-size: 1rem;
}
.webform-submission-page-feedback-form .form-required::after {
  display: none;
}
.webform-submission-page-feedback-form .fieldset-wrapper {
  display: contents;
}
.webform-submission-page-feedback-form .js-webform-radios {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.webform-submission-page-feedback-form .form-type-radio {
  margin: 0;
}
.webform-submission-page-feedback-form input.form-radio {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.webform-submission-page-feedback-form input.form-radio + label.option {
  display: inline-block;
  border: 1.5px solid var(--gray-300);
  background: #fff;
  border-radius: 999px;
  padding: 8px 18px;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
  margin: 0;
  transition:
    border-color 0.15s,
    color 0.15s;
}
.webform-submission-page-feedback-form input.form-radio + label.option:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}
.webform-submission-page-feedback-form input.form-radio:checked + label.option {
  border-color: var(--sbu-red);
  color: #fff;
  background: var(--sbu-red);
}
.webform-submission-page-feedback-form
  input.form-radio:focus-visible
  + label.option {
  outline: 2px solid var(--sbu-red);
  outline-offset: 2px;
}
.webform-submission-page-feedback-form .form-item-comment {
  margin: 16px 0 0;
  max-width: 640px;
}
.webform-submission-page-feedback-form .form-item-comment label {
  display: block;
  font-size: 0.85rem;
  font-weight: 700;
  margin-bottom: 6px;
  color: var(--ink);
}
.webform-submission-page-feedback-form .form-item-comment textarea {
  width: 100%;
  border: 1.5px solid var(--gray-300);
  border-radius: 10px;
  padding: 10px 12px;
  font: inherit;
  font-size: 0.92rem;
  resize: vertical;
  background: #fff;
}
.webform-submission-page-feedback-form .form-item-comment textarea:focus {
  outline: none;
  border-color: var(--sbu-red);
}
.webform-submission-page-feedback-form .form-actions {
  margin: 14px 0 0;
}
.webform-submission-page-feedback-form .webform-button--submit {
  border: 0;
  background: var(--sbu-red);
  color: #fff;
  border-radius: 999px;
  padding: 10px 24px;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s;
}
.webform-submission-page-feedback-form .webform-button--submit:hover {
  background: var(--sbu-red-dark);
}
.webform-confirmation__message {
  font-weight: 600;
  color: #1c7c31;
}
@media print {
  .webform-submission-page-feedback-form {
    display: none !important;
  }
}

/* --- Front page: hide the services view + its title (template renders the grid) --- */
.front-page-content .views-element-container,
.front-page-content h1 {
  display: none !important;
}

/* --- Views exposed filters (/services, /announcements): prototype-style ---- */
.views-exposed-form {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0 0 26px;
}
.views-exposed-form .form-item {
  margin: 0;
}
.views-exposed-form label {
  display: block;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gray-500);
  margin-bottom: 6px;
}
.views-exposed-form input[type="text"],
.views-exposed-form input[type="search"] {
  border: 1.5px solid var(--gray-300);
  border-radius: 999px;
  padding: 10px 18px;
  font: inherit;
  font-size: 0.92rem;
  min-width: 280px;
  background: #fff;
}
.views-exposed-form input[type="text"]:focus,
.views-exposed-form input[type="search"]:focus {
  outline: none;
  border-color: var(--sbu-red);
}
.views-exposed-form select {
  border: 1.5px solid var(--gray-300);
  border-radius: 999px;
  padding: 10px 38px 10px 18px;
  font: inherit;
  font-size: 0.92rem;
  background: #fff;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23666'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
}
.views-exposed-form .form-actions {
  margin: 0;
}
.views-exposed-form .form-submit {
  border: 0;
  background: var(--sbu-red);
  color: #fff;
  border-radius: 999px;
  padding: 11px 24px;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
}
.views-exposed-form .form-submit:hover {
  background: var(--sbu-red-dark);
}

/* --- Core search page: prototype styling ------------------------------- */
.search-form {
  margin: 6px 0 30px;
}
.search-form .form-item {
  margin: 0;
}
.search-form label {
  display: block;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gray-500);
  margin-bottom: 8px;
}
.search-form input[type="search"],
.search-form input[type="text"] {
  border: 1.5px solid var(--gray-300);
  border-radius: 999px;
  padding: 13px 22px;
  font: inherit;
  font-size: 1rem;
  width: min(560px, 100%);
  background: #fff;
}
.search-form input:focus {
  outline: none;
  border-color: var(--sbu-red);
}
.search-form .form-submit {
  border: 0;
  background: var(--sbu-red);
  color: #fff;
  border-radius: 999px;
  padding: 13px 26px;
  font: inherit;
  font-size: 0.95rem;
  font-weight: 700;
  cursor: pointer;
  margin-left: 10px;
}
.search-form .form-submit:hover {
  background: var(--sbu-red-dark);
}
.search-help-link,
.search-advanced {
  font-size: 0.85rem;
}
ol.search-results {
  list-style: none;
  padding: 0;
  margin: 0;
  max-width: 820px;
}
ol.search-results li {
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: 12px;
  padding: 18px 22px;
  margin-bottom: 14px;
}
ol.search-results h3 {
  margin: 0 0 6px;
  font-size: 1.05rem;
}
ol.search-results h3 a {
  color: var(--sbu-red);
  text-decoration: none;
}
ol.search-results h3 a:hover {
  text-decoration: underline;
}
ol.search-results p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
}
ol.search-results strong {
  color: var(--ink);
}
.pager__items {
  display: flex;
  gap: 6px;
  list-style: none;
  padding: 0;
  margin: 26px 0;
  flex-wrap: wrap;
}
.pager__item a,
.pager__item.is-active a {
  display: inline-block;
  border: 1.5px solid var(--gray-300);
  border-radius: 999px;
  padding: 7px 15px;
  text-decoration: none;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 600;
  background: #fff;
}
.pager__item.is-active a {
  background: var(--sbu-red);
  border-color: var(--sbu-red);
  color: #fff;
}
.pager__item a:hover {
  border-color: var(--sbu-red);
  color: var(--sbu-red);
}
.pager__item.is-active a:hover {
  color: #fff;
}

/* --- View pages: width + spacing --------------------------------------- */
.view-meet-our-team,
.view-research-in-action,
.view-rci-announcements {
  margin-top: 10px;
}
.view-meet-our-team .team-group {
  margin-bottom: 38px;
}
.view-meet-our-team .team-group h2 {
  margin-bottom: 16px;
}
.view-research-in-action .story-grid,
.view-rci-announcements .ann-grid {
  margin-top: 6px;
}
.view-rci-announcements .ann h3 a {
  color: inherit;
  text-decoration: none;
}
.view-rci-announcements .ann h3 a:hover {
  color: var(--sbu-red);
}

/* ===== Patch 7: interior-page fidelity (heroes, story detail, announcements list, widget placement) ===== */
/* Feedback widget sits directly in the content region — constrain to content width */
#block-rci-webform {
  max-width: 1200px;
  margin: 10px auto 46px;
  padding: 0 24px;
}
/* About: the hero shows the intro line; hide the duplicate leading p.sub in the body */
.about-page p.sub {
  display: none;
}
/* RIA listing: the static prototype grid is the visible UI; the configured view stays rendered but hidden */
.ria-view-hidden {
  display: none;
}
/* Story detail: float article figures like the prototype's .fig-inset */
.story-detail .article figure {
  width: 100%;
  max-width: none;
  margin: 30px 0 34px;
}
.story-detail .article figure figcaption {
  text-align: center;
  max-width: 640px;
  font-size: 0.82rem;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 760px) {
  .story-detail .article figure {
    float: none;
    width: 100%;
    max-width: none;
    margin: 14px 0;
  }
}
/* Suppressed page-title blocks (hero pages) — belt & braces alongside the preprocess */
.block-page-title-block.visually-hidden {
  display: none;
}

/* ===== Patch 9: doc-page heroes ===== */
/* Doc bodies created from the prototype carry their own .container; neutralize double padding inside the page container */
.doc-page .container .container {
  padding-left: 0;
  padding-right: 0;
}
/* Leading body p.sub (if any remains) reads as an intro line inside the container, not a hero duplicate */
.doc-page article > div > div > p.sub:first-child {
  color: var(--ink-soft);
  font-size: 1.02rem;
  max-width: 720px;
  margin-bottom: 18px;
}

/* ===== Patch 16: keep article/figure images proportional (migrated imgs carry fixed width/height attrs) ===== */
.article figure img,
.article img,
.doc-page article img {
  max-width: 100%;
  height: auto;
}

/* ===== Patch 20: no doubled padding when a doc-page body brings its own sections ===== */
.doc-page > section.block:has(.container.layout),
.doc-page > section.block:has(section.block),
.doc-page > section.block:has(section.band-gray) {
  padding-top: 0;
  padding-bottom: 0;
}

/* ===== Patch 24: Elinor Schoenfeld portrait crops (profile: top 60%; card: top third) ===== */
img.bio-photo[src*="elinor-schoenfeld"] {
  object-position: 50% 0;
}
.person img.photo[src*="elinor-schoenfeld"] {
  object-position: 50% 0;
}

/* ===== Patch 25: simple (single-column) nav dropdown, e.g. About ===== */
.menu.menu-mini {
  width: max-content;
  min-width: 230px;
  max-width: 320px;
  grid-template-columns: 1fr;
  z-index: 100;
}
.menu.menu-mini a {
  white-space: nowrap;
}

/* ===== Patch 27: menu icons (echoing the original site's category icons) ===== */
.menu .mi {
  display: inline-block;
  width: 1.45em;
  text-align: center;
  margin-right: 5px;
  font-style: normal;
}
.menu h5 .mi {
  font-size: 0.95rem;
  vertical-align: -1px;
}

/* ===== Patch 29: header brand text-only (RCI) + SBU logo in the utility bar ===== */
.brand .brand-link {
  font-family: "Alumni Sans", sans-serif;
  font-weight: 300;
  text-transform: uppercase;
  font-size: clamp(2.25rem, -0.446rem + 4.337vw, 4.25rem);
  line-height: 1;
  color: var(--black);
}
.brand .brand-link:hover {
  text-decoration: none;
  color: var(--sbu-red-dark);
}
.utilbar .ub-brand {
  display: flex;
  align-items: center;
  gap: 12px;
}
.utilbar .ub-brand a {
  margin-right: 0;
  display: inline-flex;
  align-items: center;
  color: var(--black);
}
.utilbar .ub-logo {
  height: 44px;
  width: auto;
  display: block;
}
.utilbar .ub-sep {
  color: #5a5f64;
}

/* ===== Patch 31: footer branding matches the header (SBU white logo + RCI name) ===== */
.foot-brand .foot-logo {
  height: auto;
  max-height: 145px;
  width: auto;
  display: block;
  margin-bottom: 14px;
}
.foot-brand :is(h2,h4) {
  font-size: 1.05rem;
}

/* ---- patch34: review fixes ---- */
/* "Applies to clusters" footer on doc pages — visually separated from body text */
.applies-note {
  margin-top: 44px;
  padding-top: 14px;
  border-top: 1px solid var(--gray-300);
  font-size: 0.8rem;
  color: var(--gray-500);
}
.applies-note strong {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--gray-500);
  display: block;
  margin-bottom: 6px;
}
.applies-note .meta-chips {
  margin-top: 0;
}
.applies-note .meta-chip {
  font-size: 0.72rem;
  padding: 3px 10px;
  background: var(--gray-100);
  border: 1px solid var(--gray-300);
  color: var(--ink-soft);
}
/* paragraphs breathe a little more in long-form docs */
.doc-page .content p {
  margin-bottom: 1.05em;
}

/* ---- patch36 ---- */
/* homepage full-site search dropdown */
.search-drop {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid var(--gray-300);
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  z-index: 80;
  overflow: hidden;
}
.search-drop a {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  padding: 10px 16px;
  font-size: 0.9rem;
  color: var(--ink);
  text-decoration: none;
}
.search-drop a:hover {
  background: var(--gray-100);
  text-decoration: none;
}
.search-drop a .g {
  font-size: 0.66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--gray-500);
  flex: none;
}
.search-drop .all {
  display: block;
  padding: 11px 16px;
  background: var(--gray-100);
  font-weight: 700;
  font-size: 0.85rem;
  color: var(--sbu-red);
  text-align: center;
}
/* announcement article pages */
.ann-article .content {
  max-width: 820px;
  font-size: 1.02rem;
  line-height: 1.75;
}
.ann-article .content p {
  margin-bottom: 1.05em;
}
.ann-article .lede {
  font-size: 1.15rem;
  color: var(--ink-soft);
}

/* ---- patch38: legible story figures ---- */
.article figure img {
  cursor: zoom-in;
}
.article .fig-inset {
  cursor: auto;
}

/* patch39: crop focus for new headshots — keep tops of heads in frame */
img[src*="alejandro-gil-gomez"],
img[src*="melanie-keister"] {
  object-position: 50% 10%;
}

/* ---------- /start guided-path polish (patch 40) ----------
   Scoped to the .startx wrapper in node 419's body, plus the sticky
   .path-switch nav and hero-art that js/rci.js injects on /start only. */
.startx .block {
  padding: 34px 0;
}
.startx .sec-head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 18px;
  max-width: none;
}
.startx .sec-head .tx {
  max-width: 680px;
}
.startx .sec-head .eyebrow {
  margin-bottom: 4px;
}
.startx .sec-head h2 {
  font-size: clamp(1.45rem, 2.6vw, 1.9rem);
}
.startx .sec-head p {
  margin-top: 4px;
  font-size: 0.92rem;
}
.startx .content {
  max-width: none;
}
.startx .med {
  flex: none;
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background-color: var(--sbu-red);
  background-image:
    var(--medi, none),
    linear-gradient(135deg, var(--sbu-red-dark), var(--sbu-red-bright));
  background-repeat: no-repeat;
  background-position: center;
  background-size:
    28px 28px,
    cover;
  box-shadow: 0 4px 12px rgba(153, 0, 0, 0.28);
  display: inline-block;
}
.startx .med--pi {
  --medi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='9' r='2.7'/%3E%3Cpath d='M6.5 5.8 12 3.2l5.5 2.6L12 8.2z'/%3E%3Cpath d='M17.5 6.4v2.8'/%3E%3Cpath d='M5.5 20.8c0-3.4 2.9-5.7 6.5-5.7s6.5 2.3 6.5 5.7'/%3E%3C/svg%3E");
}
.startx .med--grad {
  --medi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 6.1 12 3.7l5 2.4-5 2.4z'/%3E%3Cpath d='M17 6.7v2.4'/%3E%3Ccircle cx='12' cy='9.9' r='2.3'/%3E%3Cpath d='M5.8 20.8c0-3.2 2.7-5.4 6.2-5.4 1.2 0 2.3.2 3.2.7'/%3E%3Crect x='15.3' y='14' width='5.2' height='2.2' rx='.5'/%3E%3Crect x='15.3' y='17' width='5.2' height='2.2' rx='.5'/%3E%3C/svg%3E");
}
.startx .med--clin {
  --medi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 2.5v1.5M5 2.5V4'/%3E%3Cpath d='M5 3.5H4a2 2 0 0 0-2 2v4a6 6 0 0 0 12 0v-4a2 2 0 0 0-2-2h-1'/%3E%3Cpath d='M8 15.5a6 6 0 0 0 12 0v-3'/%3E%3Ccircle cx='20' cy='10.5' r='2'/%3E%3C/svg%3E");
}
.startx .med--ext {
  --medi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E");
}
.startx .med--coffee {
  --medi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 9h1.5a3 3 0 0 1 0 6H17'/%3E%3Cpath d='M4 9h13v6a5 5 0 0 1-5 5H9a5 5 0 0 1-5-5V9z'/%3E%3Cpath d='M8 2.5c0 1-1 1.2-1 2.2M12 2.5c0 1-1 1.2-1 2.2'/%3E%3C/svg%3E");
}
.startx .paths {
  gap: 12px;
}
.startx .path {
  position: relative;
  overflow: hidden;
  display: block;
  background: var(--white);
  padding: 16px;
}
.startx .path::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--sbu-red), var(--sbu-red-bright));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.22s;
}
.startx .path:hover {
  text-decoration: none;
}
.startx .path:hover::before {
  transform: none;
}
.startx .path .med {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  margin-bottom: 10px;
  background-size:
    24px 24px,
    cover;
}
.startx .path .q {
  font-size: 0.96rem;
  margin-bottom: 3px;
}
.startx .path .a {
  font-size: 0.84rem;
}
.startx .pmeta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--gray-500);
}
.startx .pmeta .go {
  color: var(--sbu-red);
  transform: translateX(-4px);
  opacity: 0;
  transition: all 0.2s;
  font-size: 1rem;
}
.startx .path:hover .pmeta .go {
  transform: none;
  opacity: 1;
}
.startx .pathbar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--gray-500);
}
.startx .pathbar .track {
  flex: 1;
  max-width: 200px;
  height: 6px;
  border-radius: 999px;
  background: var(--gray-200);
  overflow: hidden;
}
.startx .pathbar .fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--sbu-red), var(--sbu-red-bright));
  transition: width 0.3s;
}
.startx .pathbar.done {
  color: #1e7d3c;
}
.startx .pathbar.done .fill {
  background: #1e7d3c;
}
.startx .steps {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 0;
}
.startx .steps li {
  padding: 12px 14px 12px 58px;
  margin: 0;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  transition:
    box-shadow 0.18s,
    border-color 0.18s,
    opacity 0.2s;
  font-size: 0.92rem;
}
.startx .block:not(.band-gray) .steps li {
  background: var(--gray-100);
}
.startx .steps li:hover {
  box-shadow: var(--shadow-md);
  border-color: var(--gray-300);
}
.startx .steps li::before {
  left: 13px;
  top: 11px;
  width: 32px;
  height: 32px;
  background: linear-gradient(135deg, var(--sbu-red), var(--sbu-red-bright));
  color: #fff;
  font-size: 0.9rem;
  box-shadow: 0 2px 6px rgba(153, 0, 0, 0.25);
}
.startx .steps li::after {
  display: none;
}
.startx .steps.has-check li::before {
  display: none;
}
.startx .steps li strong {
  color: var(--ink);
}
.startx .snum {
  position: absolute;
  left: 13px;
  top: 11px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--sbu-red), var(--sbu-red-bright));
  color: #fff;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  cursor: pointer;
  border: 0;
  padding: 0;
  font-family: inherit;
  transition: transform 0.15s;
  box-shadow: 0 2px 6px rgba(153, 0, 0, 0.25);
}
.startx .snum:hover {
  transform: scale(1.12);
}
.startx .steps li.done {
  opacity: 0.62;
}
.startx .steps li.done .snum {
  background: #1e7d3c;
  box-shadow: 0 2px 6px rgba(30, 125, 60, 0.3);
}
.startx .steps li.done strong,
.startx .steps li.done a {
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}
@media (max-width: 820px) {
  .startx .steps {
    grid-template-columns: 1fr;
  }
}
.startx .coffee-card {
  display: flex;
  gap: 20px;
  align-items: center;
  background: linear-gradient(135deg, #fff, var(--gray-100));
  border: 1px solid var(--gray-200);
  border-radius: 14px;
  padding: 20px 24px;
  box-shadow: var(--shadow-sm);
  flex-wrap: wrap;
}
.startx .coffee-card .tx {
  flex: 1;
  min-width: 240px;
}
.startx .coffee-card h3 {
  font-size: 1.1rem;
  font-weight: 800;
  margin-bottom: 2px;
}
.startx .coffee-card p {
  font-size: 0.9rem;
  color: var(--ink-soft);
}
.startx .coffee-card .act {
  display: flex;
  gap: 14px;
  align-items: center;
  flex-wrap: wrap;
}
.startx .coffee-card .alt {
  font-size: 0.88rem;
  font-weight: 600;
}
.path-switch {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--gray-200);
  box-shadow: var(--shadow-sm);
  transform: translateY(-110%);
  transition: transform 0.25s;
}
.path-switch.on {
  transform: none;
}
.path-switch .container {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-top: 7px;
  padding-bottom: 7px;
}
.path-switch a {
  flex: none;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--ink-soft);
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: all 0.15s;
}
.path-switch a:hover {
  background: var(--gray-100);
  text-decoration: none;
}
.path-switch a.cur {
  background: rgba(153, 0, 0, 0.08);
  color: var(--sbu-red);
  border-color: rgba(153, 0, 0, 0.18);
}
.page-hero a.meta-chip {
  color: #fff;
  transition:
    background 0.15s,
    color 0.15s;
}
.page-hero a.meta-chip:hover {
  background: #fff;
  color: var(--sbu-red);
  text-decoration: none;
}
.page-hero a.meta-chip::after {
  content: " ↓";
  opacity: 0.7;
}
.hero-art {
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  width: 340px;
  opacity: 0.9;
  pointer-events: none;
}
@media (max-width: 960px) {
  .hero-art {
    display: none;
  }
}
.path-switch {
  visibility: hidden;
}
.path-switch.on {
  visibility: visible;
}
/* ---------- live cluster status (patch 47) ---------- */
.clu-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.clu-head h2 {
  font-size: 1.5rem;
  font-weight: 800;
}
.clu-headnote {
  font-size: 0.84rem;
  color: var(--gray-500);
}
.clu-headnote a {
  color: var(--sbu-red);
  font-weight: 600;
  text-decoration: none;
}
.clu-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #1f8a53;
  margin-right: 5px;
  vertical-align: middle;
}
.clu-dot.warn {
  background: #b8860b;
}
.clu-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 18px;
}
@media (max-width: 900px) {
  .clu-grid {
    grid-template-columns: 1fr;
  }
}
.clu-card {
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  padding: 22px;
  background: #fff;
}
.clu-card.is-stale {
  opacity: 0.82;
}
.clu-card h3 {
  font-size: 1.2rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.clu-card h3 a {
  color: var(--ink);
  text-decoration: none;
}
.clu-card h3 a:hover {
  color: var(--sbu-red);
}
.clu-status {
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 999px;
  white-space: nowrap;
}
.clu-status.ok {
  background: #e7f4ec;
  color: #1f8a53;
}
.clu-status.busy {
  background: #fbf1dc;
  color: #b8860b;
}
.clu-status.hot {
  background: #fbe9e9;
  color: #a4161a;
}
.clu-tag {
  font-size: 0.84rem;
  color: var(--ink-soft);
  margin: 2px 0 14px;
}
.clu-metric {
  margin: 12px 0;
}
.clu-lab {
  display: flex;
  justify-content: space-between;
  font-size: 0.85rem;
  margin-bottom: 5px;
}
.clu-lab b {
  font-weight: 700;
}
.clu-pct {
  color: var(--gray-500);
  font-variant-numeric: tabular-nums;
}
.clu-bar {
  height: 9px;
  border-radius: 6px;
  background: var(--gray-200);
  overflow: hidden;
}
.clu-bar > span {
  display: block;
  height: 100%;
  border-radius: 6px;
  background: linear-gradient(
    90deg,
    var(--sbu-red),
    var(--sbu-red-dark, #7a0000)
  );
}
.clu-bar.g > span {
  background: linear-gradient(90deg, #1f8a53, #146c40);
}
.clu-sub {
  font-size: 0.8rem;
  color: var(--gray-500);
  margin-top: -4px;
}
.clu-gtypes {
  margin-top: 10px;
  font-size: 0.82rem;
  color: var(--ink-soft);
}
.clu-grow {
  display: flex;
  justify-content: space-between;
  padding: 3px 0;
  border-bottom: 1px dashed var(--gray-200);
}
.clu-jobs {
  display: flex;
  gap: 10px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--gray-200);
}
.clu-jbox {
  flex: 1;
  text-align: center;
  background: var(--gray-100);
  border-radius: 10px;
  padding: 9px 6px;
}
.clu-jbox .n {
  font-size: 1.3rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.clu-jbox .l {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--gray-500);
}
.clu-upd {
  margin-top: 12px;
  font-size: 0.78rem;
  color: var(--gray-500);
}
.clu-foot {
  margin-top: 20px;
  font-size: 0.82rem;
  color: var(--gray-500);
}
/* compact strips (hpc hub + cluster pages) */
.clu-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 14px;
}
.clu-strip--one {
  grid-template-columns: 1fr;
  max-width: 560px;
}
@media (max-width: 820px) {
  .clu-strip {
    grid-template-columns: 1fr;
  }
}
.clu-stripcard {
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  padding: 14px 16px;
  background: #fff;
}
.clu-stripcard.is-stale {
  opacity: 0.82;
}
.clu-striptop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.clu-striptop a {
  font-weight: 800;
  color: var(--ink);
  text-decoration: none;
}
.clu-striptop a:hover {
  color: var(--sbu-red);
}
.clu-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  font-size: 0.86rem;
  color: var(--ink-soft);
}
.clu-stat b {
  font-weight: 800;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.clu-onelink {
  margin-top: 12px;
  font-size: 0.85rem;
}
.clu-onelink a {
  color: var(--sbu-red);
  font-weight: 600;
  text-decoration: none;
}
/* Inner pages with gray band did not have proper padding and adjusted section padding */
section.block.band-gray {
  padding-top: 40px;
  padding-bottom: 40px;
}
section.block.band-gray > div.container {
  padding-left: 40px;
  padding-right: 40px;
}

/* ---------- /start redesign (2026-09-23) ---------- */
/* /start redesign (startx2). px sizes: theme root is 20px. */
.startx2{--sx-ink:#222629;--sx-soft:#5a6066;--sx-line:#e6e8ea;--sx-head:"Alumni Sans","Barlow Semi Condensed",Arial,sans-serif;--sx-shadow:0 1px 3px rgba(16,20,26,.06),0 6px 20px rgba(16,20,26,.05);}
.startx2 .c-pi{--c:#990000;--t:#fbeeee;--b:#efcfcf;}
.startx2 .c-grad{--c:#15788e;--t:#e8f3f6;--b:#c3e0e7;}
.startx2 .c-clin{--c:#2f7d4e;--t:#eaf5ee;--b:#c7e3d0;}
.startx2 .c-ext{--c:#002244;--t:#e9eef5;--b:#c9d4e3;}
.startx2 .c-coffee{--c:#8a5a2b;--t:#f6eee6;--b:#e8d6c3;}
.startx2 svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block;}
.startx2 .sx-eyebrow{font-family:var(--sx-head);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#990000;font-size:13px;}
.startx2 .sx-title{font-family:var(--sx-head);font-weight:800;font-size:32px;line-height:1.05;color:#002244;margin:2px 0 0;}
.startx2 .sx-lead{color:var(--sx-soft);font-size:16px;line-height:1.5;max-width:64ch;margin-top:8px;}
.startx2 .container{max-width:none;padding:0;}
.startx2 .sx-pick{padding:0 0 36px;background:#fff;}
.startx2 .sx-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px;}
.startx2 .sx-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--sx-line);border-top:4px solid var(--c);border-radius:14px;padding:20px 20px 18px;text-decoration:none;color:var(--sx-ink);box-shadow:var(--sx-shadow);transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease;}
.startx2 .sx-card:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(16,20,26,.12);}
.startx2 .sx-card.on{border-color:var(--c);box-shadow:0 0 0 2px var(--c),0 10px 28px rgba(16,20,26,.10);}
.startx2 .sx-ic{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;background:var(--t);color:var(--c);flex:0 0 auto;}
.startx2 .sx-ic svg{width:26px;height:26px;}
.startx2 .sx-ic.big{width:58px;height:58px;border-radius:14px;}
.startx2 .sx-ic.big svg{width:30px;height:30px;}
.startx2 .sx-card h3{font-family:var(--sx-head);font-weight:800;font-size:21px;line-height:1.05;margin:14px 0 6px;color:var(--sx-ink);}
.startx2 .sx-card p{font-size:14.5px;line-height:1.45;color:var(--sx-soft);}
.startx2 .sx-prev{list-style:none;margin:12px 0 14px;padding:0;border-top:1px dashed var(--sx-line);padding-top:10px;flex:1;}
.startx2 .sx-prev li{position:relative;padding-left:16px;font-size:13.5px;color:#44484d;line-height:1.35;margin:4px 0;}
.startx2 .sx-prev li::before{content:"";position:absolute;left:2px;top:.5em;width:6px;height:6px;border-radius:50%;background:var(--c);opacity:.8;}
.startx2 .sx-meta{display:flex;justify-content:space-between;align-items:center;font-family:var(--sx-head);font-size:14px;letter-spacing:.03em;text-transform:uppercase;}
.startx2 .sx-meta b{color:#5f6368;font-weight:700;}
.startx2 .sx-meta .go{color:var(--c);font-weight:800;}
.startx2 .sx-journey{background:#f5f6f7;border:1px solid var(--sx-line);border-radius:18px;padding:0 24px 26px;}
.startx2 .sx-tabs{position:sticky;top:0;z-index:20;display:flex;gap:6px;background:#f5f6f7;border-radius:18px 18px 0 0;padding:16px 0 14px;border-bottom:1px solid var(--sx-line);margin-bottom:26px;}
.startx2 .sx-tab{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;border:1px solid var(--sx-line);background:#fff;color:#44484d;text-decoration:none;font:600 15px var(--sx-head);letter-spacing:.02em;transition:background .12s,color .12s,border-color .12s;}
.startx2 .sx-tab svg{width:18px;height:18px;color:var(--c);}
.startx2 .sx-tab:hover{border-color:var(--c);color:var(--c);}
.startx2 .sx-tab.on{background:var(--c);border-color:var(--c);color:#fff;}
.startx2 .sx-tab.on svg{color:#fff;}
.startx2.js .sx-panel{display:none;}
.startx2.js .sx-panel.on{display:block;animation:sxIn .25s ease;}
@keyframes sxIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.startx2 .sx-panel{margin-bottom:0;}
.startx2:not(.js) .sx-panel{margin-bottom:34px;}
.startx2 .sx-phead{display:flex;align-items:center;gap:18px;background:#fff;border:1px solid var(--sx-line);border-left:5px solid var(--c);border-radius:14px;padding:18px 22px;box-shadow:var(--sx-shadow);}
.startx2 .sx-phead .tx{flex:1;min-width:0;}
.startx2 .sx-phead .sx-eyebrow{color:var(--c);}
.startx2 .sx-phead h2{font-family:var(--sx-head);font-weight:800;font-size:28px;line-height:1.05;color:var(--sx-ink);margin:2px 0 4px;}
.startx2 .sx-phead p{font-size:15px;color:var(--sx-soft);line-height:1.45;}
.startx2 .sx-prog{flex:0 0 210px;text-align:right;}
.startx2 .sx-prog .ct{display:block;font-family:var(--sx-head);font-weight:700;font-size:14px;letter-spacing:.04em;text-transform:uppercase;color:var(--c);margin-bottom:6px;}
.startx2 .sx-prog .track{display:block;height:8px;border-radius:8px;background:var(--t);overflow:hidden;}
.startx2 .sx-prog .fill{display:block;height:100%;width:0;background:var(--c);border-radius:8px;transition:width .3s ease;}
.startx2 .sx-steps{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;counter-reset:none;}
.startx2 .sx-steps li{position:relative;display:flex;align-items:flex-start;gap:14px;background:#fff;border:1px solid var(--sx-line);border-radius:12px;padding:16px 16px 16px 14px;box-shadow:var(--sx-shadow);transition:border-color .12s,background .12s;}
.startx2 .sx-steps li:hover{border-color:var(--b);}
.startx2 .sx-num{flex:0 0 30px;width:30px;height:30px;border-radius:50%;border:2px solid var(--c);background:#fff;color:var(--c);font:800 15px var(--sx-head);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;margin-top:8px;transition:background .12s,color .12s;}
.startx2 .sx-num:hover{background:var(--t);}
.startx2 .sx-sic{flex:0 0 46px;width:46px;height:46px;border-radius:11px;background:var(--t);color:var(--c);display:inline-flex;align-items:center;justify-content:center;}
.startx2 .sx-sic svg{width:25px;height:25px;}
.startx2 .sx-steps .bd{flex:1;min-width:0;}
.startx2 .sx-steps h4{font-family:var(--sx-head);font-weight:800;font-size:18.5px;line-height:1.1;margin:2px 0 4px;}
.startx2 .sx-steps h4 a{color:var(--sx-ink);text-decoration:none;}
.startx2 .sx-steps h4 a::after{content:" \2192";color:var(--c);font-weight:700;}
.startx2 .sx-steps h4 a:hover{color:var(--c);}
.startx2 .sx-steps p{font-size:14.5px;line-height:1.45;color:var(--sx-soft);}
.startx2 .sx-steps li.done{background:#fbfcfb;border-color:var(--b);}
.startx2 .sx-steps li.done .sx-num{background:var(--c);color:#fff;}
.startx2 .sx-steps li.done h4 a{color:#5f6368;text-decoration:line-through;text-decoration-color:rgba(0,0,0,.25);}
.startx2 .sx-help{background:#fff;padding:30px 0 10px;}
.startx2 .sx-helpcard{display:flex;align-items:center;gap:20px;border:1px solid var(--sx-line);border-radius:14px;padding:22px 24px;background:linear-gradient(100deg,#fff 0%,#fbf7f2 100%);box-shadow:var(--sx-shadow);}
.startx2 .sx-helpcard .tx{flex:1;}
.startx2 .sx-helpcard h3{font-family:var(--sx-head);font-weight:800;font-size:24px;color:var(--sx-ink);margin:0 0 4px;}
.startx2 .sx-helpcard p{font-size:15px;color:var(--sx-soft);}
.startx2 .sx-quick{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.startx2 .sx-quick a{font:600 14px var(--sx-head);letter-spacing:.02em;color:#990000;text-decoration:none;border:1px solid #efcfcf;background:#fff;border-radius:999px;padding:5px 12px;}
.startx2 .sx-quick a:hover{background:#fbeeee;}
.startx2 .sx-btn{flex:0 0 auto;display:inline-flex;align-items:center;font:700 16px var(--sx-head);letter-spacing:.03em;text-transform:uppercase;text-decoration:none;color:#fff;background:#990000;border-radius:8px;padding:13px 20px;}
.startx2 .sx-btn:hover{background:#c1121f;}
@media (max-width:960px){.startx2 .sx-cards{grid-template-columns:repeat(2,1fr);} .startx2 .sx-steps{grid-template-columns:1fr;} .startx2 .sx-phead{flex-wrap:wrap;} .startx2 .sx-prog{flex-basis:100%;text-align:left;} .startx2 .sx-helpcard{flex-wrap:wrap;} }
@media (max-width:560px){.startx2 .sx-cards{grid-template-columns:1fr;} .startx2 .sx-tabs{overflow-x:auto;} }

.sx-herochips{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.sx-herochips .meta-chip{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:999px;padding:7px 14px;font:600 15px "Alumni Sans",sans-serif;letter-spacing:.02em;text-decoration:none;}
.sx-herochips .meta-chip:hover{background:rgba(255,255,255,.2);}
.sx-herochips svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}

/* ---------- /status page v2 (2026-09-24): summary first, calmer cluster cards ----------
   Top summary + cluster cards are rendered by js/cluster-status.js (renderStatusV2);
   Service health + Planned work live in node 420's body (#stxBody). */
  .stx{--ink:#222629;--soft:#5a6066;--faint:#5f6368;--line:#e6e8ea;--head:"Alumni Sans","Barlow Semi Condensed",Arial,sans-serif;--sh:0 1px 3px rgba(16,20,26,.06),0 6px 20px rgba(16,20,26,.05);font-family:var(--font);}
  .stx svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
  .stx-now{padding:30px 0 8px}
  .stx-top{display:flex;align-items:center;gap:16px;background:#eef7f1;border:1px solid #cfe7d8;border-radius:14px;padding:16px 20px}
  .stx-top .ic{width:40px;height:40px;color:#1f7a45;flex:0 0 auto}
  .stx-top .ic svg{width:40px;height:40px}
  .stx-top h2{font-family:var(--head);font-weight:800;font-size:26px;color:#155d35;margin:0;line-height:1.05}
  .stx-top p{color:#3d6b50;font-size:14.5px;margin-top:2px}
  .stx-top .upd{margin-left:auto;display:flex;align-items:center;gap:6px;color:#3d6b50;font-size:13.5px;white-space:nowrap}
  .stx-top .upd svg{width:16px;height:16px}
  .stx-maint{display:flex;gap:14px;align-items:flex-start;background:#fff8e8;border:1px solid #f0dca8;border-left:5px solid #c98a0b;border-radius:12px;padding:14px 18px;margin-top:12px}
  .stx-maint .ic{width:28px;height:28px;color:#855800;flex:0 0 auto}
  .stx-maint .ic svg{width:28px;height:28px}
  .stx-maint b{font-family:var(--head);font-size:19px;color:#6b4a00;display:block;margin-bottom:2px}
  .stx-maint p{font-size:14.5px;color:#6b5a2e;line-height:1.45}
  .stx-sum{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
  .stx-sum a{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 16px;text-decoration:none;color:var(--ink);box-shadow:var(--sh)}
  .stx-sum a b{font-family:var(--head);font-size:20px;font-weight:800}
  .stx-sum a span.f{font-size:14px;color:var(--soft)}
  .stx-pill{display:inline-flex;align-items:center;gap:6px;font:700 11.5px var(--head);letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:4px 10px;white-space:nowrap}
  .stx-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
  .stx-pill.ok{background:#e6f3f6;color:#12697d}.stx-pill.busy{background:#fdf2dc;color:#855800}.stx-pill.hot{background:#fbe7e5;color:#b3261e}
  .stx-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:34px 0 14px}
  .stx-h .eb{font-family:var(--head);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#990000;font-size:13px}
  .stx-h h2{font-family:var(--head);font-weight:800;font-size:28px;color:#002244;margin:0;line-height:1.05}
  .stx-h .note{font-size:13.5px;color:var(--faint)}
  .stx-svc{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .stx-svc>div{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px 14px}
  .stx-svc i{width:10px;height:10px;border-radius:50%;background:#1f9d57;box-shadow:0 0 0 4px #e3f4ea;flex:0 0 auto}
  .stx-svc b{font-family:var(--head);font-size:17px;font-weight:700;color:var(--ink);display:block;line-height:1.1}
  .stx-svc span{font-size:13px;color:var(--faint)}
  .stx-svc em{margin-left:auto;font-style:normal;font:700 12px var(--head);letter-spacing:.06em;text-transform:uppercase;color:#1f7a45}
  .stx-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  .stx-card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh);padding:18px 18px 14px;display:flex;flex-direction:column}
  .stx-card .t{display:flex;align-items:center;justify-content:space-between;gap:8px}
  .stx-card h3{font-family:var(--head);font-weight:800;font-size:26px;margin:0;line-height:1}
  .stx-card h3 a{color:var(--ink);text-decoration:none}
  .stx-card .tag{font-size:13px;color:var(--faint);margin-top:2px}
  .stx-free{display:flex;gap:10px;margin:14px 0 6px}
  .stx-free div{flex:1;background:#f5f7f8;border-radius:10px;padding:10px 12px;display:flex;align-items:center;gap:10px}
  .stx-free svg{width:22px;height:22px;color:#15788e;flex:0 0 auto}
  .stx-free b{font-family:var(--head);font-size:26px;font-weight:800;line-height:1;color:var(--ink);display:block}
  .stx-free span{font-size:12px;color:var(--soft);line-height:1.2}
  .stx-bar{margin-top:12px}
  .stx-bar .l{display:flex;justify-content:space-between;font-size:14px;color:var(--ink)}
  .stx-bar .l b{font-weight:600}.stx-bar .l span{color:var(--faint);font-size:13px}
  .stx-bar .tr{height:9px;border-radius:9px;background:#eef1f3;margin-top:5px;overflow:hidden}
  .stx-bar .tr i{display:block;height:100%;border-radius:9px}
  .stx-bar.ok i{background:#2a9bb3}.stx-bar.busy i{background:#d69a1c}.stx-bar.hot i{background:#c0392b}
  .stx-off{font-size:13px;color:#8a6200;margin-top:6px;line-height:1.4}
  .stx-jobs{display:flex;gap:14px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-size:14px;color:var(--soft)}
  .stx-jobs b{font-family:var(--head);font-size:20px;color:var(--ink);margin-right:4px}
  .stx-card details{margin-top:10px;border-top:1px dashed var(--line);padding-top:8px;font-size:13.5px;color:var(--soft)}
  .stx-card summary{cursor:pointer;font:700 14px var(--head);letter-spacing:.04em;text-transform:uppercase;color:#15788e}
  .stx-card details p{margin:6px 0 0;line-height:1.45}
  .stx-card table{width:100%;border-collapse:collapse;margin-top:8px;font-size:12.5px}
  .stx-card td,.stx-card th{padding:4px 4px;border-bottom:1px solid #f0f1f2;text-align:right}
  .stx-card td:first-child,.stx-card th:first-child{text-align:left}
  .stx-card .upd{font-size:12px;color:var(--faint);margin-top:10px}
  .stx-foot{font-size:13px;color:var(--faint);margin-top:12px;line-height:1.45}
  .stx-mt{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
  .stx-mt .box{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--sh)}
  .stx-mt h3{font-family:var(--head);font-weight:800;font-size:20px;margin:0 0 10px;color:var(--ink)}
  .stx-empty{display:flex;align-items:center;gap:10px;color:#1f7a45;font-size:15px}
  .stx-empty svg{width:22px;height:22px}
  .stx-past li{display:flex;gap:12px;align-items:flex-start;padding:8px 0;border-top:1px solid #f0f1f2;list-style:none}
  .stx-past li:first-child{border-top:0}
  .stx-past .d{flex:0 0 58px;text-align:center;background:#f5f6f7;border-radius:8px;padding:4px 0;font:700 12px var(--head);color:var(--soft);text-transform:uppercase;line-height:1.1}
  .stx-past .d b{display:block;font-size:20px;color:var(--ink)}
  .stx-past .x b{font-family:var(--head);font-size:16px;color:var(--ink);display:block}
  .stx-past .x > span,.stx-past .x > a > span{font-size:13px;color:var(--faint);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
  .stx-more{margin-top:10px;font:700 14px var(--head);letter-spacing:.04em;text-transform:uppercase;color:#990000;text-decoration:none;display:inline-block}
  

  .stx-top.warn{background:#fff8e8;border-color:#f0dca8}.stx-top.warn .ic{color:#855800}.stx-top.warn h2{color:#6b4a00}.stx-top.warn p,.stx-top.warn .upd{color:#6b5a2e}
  .stx-sum a div b{display:block}
  .stx-svc>div[data-state="warn"] i{background:#d69a1c;box-shadow:0 0 0 4px #fbefd6}.stx-svc>div[data-state="warn"] em{color:#855800}
  .stx-svc>div[data-state="down"] i{background:#c0392b;box-shadow:0 0 0 4px #f8e1de}.stx-svc>div[data-state="down"] em{color:#b3261e}
  .stx-svc>div>div{min-width:0}
  .stx-card.is-stale{opacity:.8}
  .stx-card .stx-q{margin-top:8px}.stx-card .stx-qh{font-weight:600;color:var(--ink);margin:8px 0 0}
  .stx-card .stx-q table{margin-top:4px}
  .stx-win{display:flex;gap:12px;align-items:flex-start;padding:8px 0;border-top:1px solid #f0f1f2}
  .stx-win:first-child{border-top:0}
  .stx-win .d{flex:0 0 58px;text-align:center;background:#fff4df;border-radius:8px;padding:4px 0;font:700 12px var(--head);color:#855800;text-transform:uppercase;line-height:1.1}
  .stx-win .d b{display:block;font-size:20px;color:var(--ink)}
  .stx-win .x b{font-family:var(--head);font-size:16px;color:var(--ink);display:block}
  .stx-win .x span{font-size:13.5px;color:var(--soft)}
  .stx-past .x a{color:inherit;text-decoration:none;display:block}.stx-past .x a:hover b{color:#990000}
  .stx-inprog{display:flex;align-items:center;gap:8px;font-size:14px;color:#6b5a2e;margin-top:10px}
  .stx-inprog svg{width:18px;height:18px;color:#855800;flex:0 0 auto}
  .stx-body .stx-h:first-child{margin-top:4px}
  main section.block:has(#stxBody){padding-top:10px}
  /* Planned work, filled from Maintenance announcements (2026-10-01) */
  .stx-wins .d{background:#fff4df;color:#855800}
  .stx-wins .x > a > span{display:block;-webkit-line-clamp:unset;overflow:visible;color:var(--soft)}
  .stx-now-tag{display:inline-block;margin:4px 0 2px;padding:2px 10px;border-radius:999px;background:#fff4df;color:#6b4500;font:700 16px var(--head);font-style:normal}
  .stx-none{margin:0;font-size:16px;color:var(--soft)}
  @media (max-width:900px){.stx-sum,.stx-cards,.stx-svc,.stx-mt{grid-template-columns:1fr} .stx-top{flex-wrap:wrap} .stx-top .upd{margin-left:0}}

/* ===== Subpage hero: larger type (2026-09-24) =====
   Every subpage hero (.page-hero). The home page is not affected. Screen only,
   so the print styles above still apply. */
@media screen {
  .page-hero .container{padding:60px 24px 54px;}
  .page-hero .eyebrow{font-size:26px;letter-spacing:.14em;margin-bottom:12px;color:rgba(255,255,255,.9);}
  .page-hero h1{font-size:clamp(44px,4.6vw,70px);line-height:1.04;letter-spacing:-.01em;max-width:980px;}
  .page-hero p.sub{font-size:clamp(21px,1.75vw,27px);line-height:1.42;max-width:900px;margin-top:16px;color:rgba(255,255,255,.9);}
  .page-hero .meta-chips{gap:12px;margin-top:26px;}
  .page-hero .meta-chip{font-size:23px;font-weight:600;letter-spacing:.03em;word-spacing:.12em;padding:10px 20px;display:inline-block;line-height:1.2;}
  /* space between the leading emoji and the label */
  .page-hero .meta-chips:not(.sx-herochips) > .meta-chip::first-letter{margin-right:.4em;}
  /* /start chips carry an SVG icon instead of an emoji */
  .page-hero .sx-herochips .meta-chip{display:inline-flex;align-items:center;gap:10px;}
  .page-hero .meta-chip svg{width:22px;height:22px;}
}
@media screen and (max-width:600px){
  .page-hero .container{padding:40px 20px 36px;}
  .page-hero .eyebrow{font-size:18px;}
  .page-hero h1{font-size:40px;}
  .page-hero p.sub{font-size:20px;}
  .page-hero .meta-chip{font-size:17px;padding:7px 14px;}
}

/* ===== HPC service page (/services/high-performance-computing) redesign (2026-09-25) =====
   Body markup lives in the node body (.hpx); live numbers are filled by
   js/cluster-status.js (page key "hpcsvc"). Sizes follow the site scale set in
   the text-size sheet: labels 24, headings 40, card titles 24-30, text 20, meta 18. */
.hpx{font-size:20px;line-height:1.55;color:#33373b}
.hpx h2{font-family:"Alumni Sans",sans-serif;font-weight:800;font-size:40px;line-height:1.08;color:#12203a;margin:0 0 14px}
.hpx .eb{font:700 24px "Alumni Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#990000;margin:44px 0 4px}
.hpx .eb:first-child{margin-top:0}
.hpx a{color:#990000}
.hpx-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 8px}
.hpx-stats > div{background:#fff;border:1px solid #e3e6e9;border-top:4px solid #990000;border-radius:12px;padding:16px 18px}
.hpx-stats b{display:block;font:800 38px/1 "Alumni Sans",sans-serif;color:#990000;margin-bottom:6px}
.hpx-stats span{font-size:18px;line-height:1.35;color:#5a6066;display:block}
.hpx-stats .live{font-size:16px;color:#2e7d32;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-top:4px}
.hpx-stats .live:before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:#43a047;margin-right:6px;vertical-align:1px}
.hpx-pick{display:flex;align-items:center;gap:18px;background:#fff8e8;border:1px solid #f0dca8;border-left:6px solid #c98a0b;border-radius:12px;padding:18px 22px;margin:4px 0 18px}
.hpx-pick .ic{font-size:36px;line-height:1}
.hpx-pick b{display:block;font:800 24px "Alumni Sans",sans-serif;color:#5a3d00}
.hpx-pick span{font-size:20px;color:#6b5a2e}
.hpx a.hpx-btn{margin-left:auto;white-space:nowrap;background:#990000;color:#fff;text-decoration:none;font:700 20px "Alumni Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;border-radius:10px;padding:13px 20px}
.hpx a.hpx-btn:hover{background:#7a0000}
.hpx-cl{display:grid;grid-template-columns:80px 1fr 220px;gap:20px;align-items:start;background:#fff;border:1px solid #e3e6e9;border-radius:14px;padding:20px 22px;margin:0 0 14px;box-shadow:0 1px 3px rgba(16,20,26,.05)}
.hpx-cl img{width:80px;height:auto;border-radius:10px;background:#f5f6f7;margin:0}
.hpx-cl h3{font:800 30px/1.05 "Alumni Sans",sans-serif;margin:0 0 6px;color:#12203a}
.hpx-cl h3 a{color:inherit;text-decoration:none}
.hpx-cl .best{font-size:20px;color:#990000;font-weight:600;margin:0 0 8px;line-height:1.35}
.hpx-cl ul{margin:0;padding-left:22px;font-size:20px}
.hpx-cl li{margin:3px 0}
.hpx-live{text-align:right;min-height:40px}
.hpx-live .stx-pill{font-size:20px}
.hpx-live .free{font-size:18px;color:#5a6066;margin:10px 0 10px;line-height:1.4}
.hpx-live .free b{font:800 26px "Alumni Sans",sans-serif;color:#12203a}
.hpx-live .lk a{display:block;font:700 20px "Alumni Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;margin-top:6px}
.hpx-steps{counter-reset:hs;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0}
.hpx-steps a{counter-increment:hs;display:block;background:#fff;border:1px solid #e3e6e9;border-radius:14px;padding:20px;text-decoration:none;color:#33373b}
.hpx-steps a:hover{border-color:#990000}
.hpx-steps a:before{content:counter(hs);display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#990000;color:#fff;font:800 24px "Alumni Sans",sans-serif;margin-bottom:12px}
.hpx-steps b{display:block;font:800 24px/1.15 "Alumni Sans",sans-serif;color:#12203a;margin-bottom:6px}
.hpx-steps span{font-size:20px;line-height:1.45;color:#5a6066;display:block}
.hpx-steps em{display:block;font:700 20px "Alumni Sans",sans-serif;font-style:normal;letter-spacing:.06em;text-transform:uppercase;color:#990000;margin-top:12px}
.hpx-ood{display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;background:linear-gradient(118deg,#12203a,#1f3a5f);color:#fff;border-radius:16px;padding:26px 28px;margin:44px 0 0}
.hpx-ood h3{font:800 32px "Alumni Sans",sans-serif;margin:0 0 6px;color:#fff}
.hpx-ood p{margin:0 0 14px;color:#d8e1ec;font-size:20px}
.hpx-ood .apps span{display:inline-block;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:6px 14px;margin:0 6px 6px 0;font:600 20px "Alumni Sans",sans-serif;letter-spacing:.03em}
.hpx a.hpx-ood-btn{background:#fff;color:#12203a;text-decoration:none;font:800 22px "Alumni Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;border-radius:10px;padding:15px 22px;white-space:nowrap}
.hpx-help{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 10px}
.hpx-help a{display:block;background:#fff;border:1px solid #e3e6e9;border-radius:12px;padding:18px;text-decoration:none;color:#33373b}
.hpx-help a:hover{border-color:#990000}
.hpx-help i{font-style:normal;font-size:30px;display:block;margin-bottom:8px}
.hpx-help b{display:block;font:800 24px "Alumni Sans",sans-serif;color:#12203a}
.hpx-help span{font-size:18px;line-height:1.4;color:#5a6066;display:block}
@media (max-width:900px){
  .hpx h2{font-size:32px}
  .hpx .eb{font-size:20px}
  .hpx-stats,.hpx-help{grid-template-columns:1fr 1fr}
  .hpx-steps{grid-template-columns:1fr}
  .hpx-cl{grid-template-columns:56px 1fr}
  .hpx-cl img{width:56px}
  .hpx-live{grid-column:1 / -1;text-align:left}
  .hpx-pick{flex-wrap:wrap}
  .hpx a.hpx-btn{margin-left:0}
  .hpx-ood{grid-template-columns:1fr}
}

/* ===== HPC section clean-up (2026-09-25) =====
   body.is-hpc = /hpc, every /hpc/* page (incl. software pages) and the HPC service
   page. One type scale for the whole section, matching the text-size sheet:
   labels 24 caps, section headings 48, content headings 40, body 20, secondary 18,
   pills/tags 16. Hard-coded inline font sizes were removed from the page bodies.
   2026-09-25: the same scale now also covers body.is-trinetx (/trinetx/* and the
   TriNetX service page). */
:is(.is-hpc,.is-trinetx,.is-oncore) main .eyebrow,:is(.is-hpc,.is-trinetx,.is-oncore) main .sec-head .eyebrow{font-size:24px;letter-spacing:.14em}
:is(.is-hpc,.is-trinetx,.is-oncore) main h2{font-size:40px;line-height:1.1}
:is(.is-hpc,.is-trinetx,.is-oncore) main .sec-head h2{font-size:48px;line-height:1.08}
:is(.is-hpc,.is-trinetx,.is-oncore) main .sec-head p{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) main p,:is(.is-hpc,.is-trinetx,.is-oncore) main li{font-size:20px;line-height:1.55}
:is(.is-hpc,.is-trinetx,.is-oncore) main th{font-size:18px}
:is(.is-hpc,.is-trinetx,.is-oncore) main td{font-size:18px}
:is(.is-hpc,.is-trinetx,.is-oncore) main td span.ok,:is(.is-hpc,.is-trinetx,.is-oncore) main td span.no,:is(.is-hpc,.is-trinetx,.is-oncore) main .badge-no,:is(.is-hpc,.is-trinetx,.is-oncore) main .badge-yes{font-size:16px}
:is(.is-hpc,.is-trinetx,.is-oncore) main .callout,:is(.is-hpc,.is-trinetx,.is-oncore) main .callout *{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) main .chips .chip,:is(.is-hpc,.is-trinetx,.is-oncore) main .chips > span{font-size:18px}
:is(.is-hpc,.is-trinetx,.is-oncore) main .clu-tag{font-size:16px}
/* comparison table on /hpc */
:is(.is-hpc,.is-trinetx,.is-oncore) .cmp td{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .cmp td *{font-size:18px}
:is(.is-hpc,.is-trinetx,.is-oncore) .cmp td:first-child a,:is(.is-hpc,.is-trinetx,.is-oncore) .cmp td:first-child strong{font:800 22px "Alumni Sans",sans-serif}
:is(.is-hpc,.is-trinetx,.is-oncore) .cmp .badge-no,:is(.is-hpc,.is-trinetx,.is-oncore) .cmp .badge-yes{font-size:16px}
/* card grids: fit the number of cards (no half-empty rows) */
:is(.is-hpc,.is-trinetx,.is-oncore) .paths{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
:is(.is-hpc,.is-trinetx,.is-oncore) .path .q{font-size:24px;line-height:1.2;display:flex;gap:8px;align-items:center}
:is(.is-hpc,.is-trinetx,.is-oncore) .path .a{font-size:20px;line-height:1.5}
:is(.is-hpc,.is-trinetx,.is-oncore) .path .pill,:is(.is-hpc,.is-trinetx,.is-oncore) .ann .pill{font-size:16px}
:is(.is-hpc,.is-trinetx,.is-oncore) .ann .date{font-size:18px}
:is(.is-hpc,.is-trinetx,.is-oncore) .ann p{font-size:20px}
/* live cluster strips (hub + cluster pages): same labels/colours as /status */
:is(.is-hpc,.is-trinetx,.is-oncore) .clu-head h2{font-size:40px}
:is(.is-hpc,.is-trinetx,.is-oncore) .clu-headnote a,:is(.is-hpc,.is-trinetx,.is-oncore) .clu-onelink a{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .clu-striptop a{font-size:26px}
:is(.is-hpc,.is-trinetx,.is-oncore) .clu-status{font:700 18px "Alumni Sans",sans-serif;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:4px 12px}
:is(.is-hpc,.is-trinetx,.is-oncore) .clu-status.ok{background:#e6f3f6;color:#12697d}
:is(.is-hpc,.is-trinetx,.is-oncore) .clu-status.busy{background:#fdf2dc;color:#855800}
:is(.is-hpc,.is-trinetx,.is-oncore) .clu-status.hot{background:#fbe7e5;color:#b3261e}
:is(.is-hpc,.is-trinetx,.is-oncore) .clu-stat,:is(.is-hpc,.is-trinetx,.is-oncore) .clu-stat b{font-size:18px}
:is(.is-hpc,.is-trinetx,.is-oncore) #rciClusterOne{padding:32px 0 0}
:is(.is-hpc,.is-trinetx,.is-oncore) #rciClusterOne .clu-strip--one{grid-template-columns:1fr;max-width:none}
:is(.is-hpc,.is-trinetx,.is-oncore) #rciClusterOne + main > section.block:first-child{padding-top:28px}
:is(.is-hpc,.is-trinetx,.is-oncore) .layout .content > h2:first-child{margin-top:0}
/* sidebar cards */
:is(.is-hpc,.is-trinetx,.is-oncore) .side-card h4{font-size:20px;letter-spacing:.12em}
:is(.is-hpc,.is-trinetx,.is-oncore) .side-card a:not(.btn),:is(.is-hpc,.is-trinetx,.is-oncore) .side-links a{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .side-card .btn{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .side-card p,:is(.is-hpc,.is-trinetx,.is-oncore) .side-contact div{font-size:18px}
/* "Also available" / related cards */
:is(.is-hpc,.is-trinetx,.is-oncore) .svc h3 a,:is(.is-hpc,.is-trinetx,.is-oncore) .rel-grid h3 a{font-size:26px}
:is(.is-hpc,.is-trinetx,.is-oncore) .svc p{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .svc .go{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .top > .tag{font-size:16px}
/* docs catalog, OnDemand portals, student assistants, picker, script builder */
:is(.is-hpc,.is-trinetx,.is-oncore) .doc-cat a > span:first-child{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .doc-cat a > span.go{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .portal p{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .minicard h4{font-size:24px}
:is(.is-hpc,.is-trinetx,.is-oncore) main .ti,:is(.is-hpc,.is-trinetx,.is-oncore) main figcaption{font-size:18px}
:is(.is-hpc,.is-trinetx,.is-oncore) .nm span{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .pk-sub,:is(.is-hpc,.is-trinetx,.is-oncore) .pk-hint,:is(.is-hpc,.is-trinetx,.is-oncore) .pk-nav span{font-size:18px}
:is(.is-hpc,.is-trinetx,.is-oncore) .pk-opt span{font-size:20px}
:is(.is-hpc,.is-trinetx,.is-oncore) .sb-field label,:is(.is-hpc,.is-trinetx,.is-oncore) p > label,:is(.is-hpc,.is-trinetx,.is-oncore) .sb-hint,:is(.is-hpc,.is-trinetx,.is-oncore) .btns button{font-size:18px}
@media (max-width:900px){
  :is(.is-hpc,.is-trinetx,.is-oncore) main .sec-head h2{font-size:36px}
  :is(.is-hpc,.is-trinetx,.is-oncore) main h2,:is(.is-hpc,.is-trinetx,.is-oncore) .clu-head h2{font-size:32px}
  :is(.is-hpc,.is-trinetx,.is-oncore) main .eyebrow{font-size:20px}
}

/* ===== TriNetX section (2026-09-25) =====
   Service page (/services/trinetx-cohort-discovery) uses the .hpx components plus the
   four below. The /trinetx/* subpages share the section type scale above via
   body.is-trinetx; the rules after the components tune the parts unique to them. */
.hpx-fig{margin:0 0 18px;border-radius:14px;overflow:hidden;position:relative}
.hpx-fig img{display:block;width:100%;height:auto}
.hpx-fig figcaption{position:absolute;left:0;right:0;bottom:0;padding:14px 18px;background:linear-gradient(transparent,rgba(10,15,25,.85));color:#fff;font-size:18px;line-height:1.4}
.hpx-uses{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 0 18px}
.hpx-uses > div{background:#fff;border:1px solid #e3e6e9;border-left:5px solid #990000;border-radius:12px;padding:18px 20px}
.hpx-uses b{display:block;font:800 24px/1.15 "Alumni Sans",sans-serif;color:#12203a;margin-bottom:6px}
.hpx-uses span{font-size:20px;line-height:1.45;color:#44484d;display:block}
.hpx-feat{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0}
.hpx-feat > div{background:#fff;border:1px solid #e3e6e9;border-radius:12px;padding:16px}
.hpx-feat i{font-style:normal;font-size:28px;line-height:1;display:block;margin-bottom:8px}
.hpx-feat b{display:block;font:800 22px/1.15 "Alumni Sans",sans-serif;color:#12203a;margin-bottom:4px}
.hpx-feat span{font-size:18px;line-height:1.4;color:#5a6066;display:block}
.hpx-data{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 0 14px}
.hpx-data > div{border-radius:12px;padding:18px 20px;border:1px solid #e3e6e9;background:#fff}
.hpx-data .yes{border-top:4px solid #2e7d32}
.hpx-data .no{border-top:4px solid #b3261e}
.hpx-data h3{font:800 24px/1.15 "Alumni Sans",sans-serif;margin:0 0 8px;color:#12203a}
.hpx-data ul{list-style:none;margin:0;padding:0}
.hpx .hpx-data li{font-size:20px;line-height:1.4;margin:0;padding:7px 0 7px 32px;position:relative;border-bottom:1px solid #f0f1f3}
.hpx-data li:last-child{border-bottom:0}
.hpx-data .yes li:before{content:"\2713";position:absolute;left:4px;color:#2e7d32;font-weight:800}
.hpx-data .no li:before{content:"\2715";position:absolute;left:4px;color:#b3261e;font-weight:800}
.hpx .hpx-note{font-size:20px;margin:0 0 8px}

/* Subpages */
:is(.is-trinetx,.is-oncore) .content > .lede{font-size:24px;line-height:1.5;color:#33373b}
:is(.is-trinetx,.is-oncore) .content > h3{font:800 28px/1.15 "Alumni Sans",sans-serif;color:#12203a;margin:26px 0 8px}
:is(.is-trinetx,.is-oncore) .steps li{padding-left:62px;padding-bottom:22px}
:is(.is-trinetx,.is-oncore) .steps li::before{width:42px;height:42px;font:800 22px "Alumni Sans",sans-serif;background:#990000;color:#fff;top:-4px}
:is(.is-trinetx,.is-oncore) .steps li:not(:last-child)::after{left:20px;top:42px}
:is(.is-trinetx,.is-oncore) .faq summary{font-size:22px;padding:18px 22px;line-height:1.3}
:is(.is-trinetx,.is-oncore) .faq summary::after{font-size:30px}
:is(.is-trinetx,.is-oncore) .faq details[open]{border-color:#990000}
:is(.is-trinetx,.is-oncore) .faq .ans{padding:0 22px 20px}
:is(.is-trinetx,.is-oncore) .spec-list li{align-items:baseline}
:is(.is-trinetx,.is-oncore) .spec-list li span:first-child{font:700 20px "Alumni Sans",sans-serif;letter-spacing:.08em;color:#990000;min-width:90px}
:is(.is-trinetx,.is-oncore) .spec-list li span:last-child{font-size:20px;text-align:left;flex:1}
:is(.is-trinetx,.is-oncore) .minicard{background:#fff;border-top:4px solid #990000}
:is(.is-trinetx,.is-oncore) .minicard li:not(:has(a)){color:#5a6066}
:is(.is-trinetx,.is-oncore) .cmp .pill{font-size:16px}
:is(.is-trinetx,.is-oncore) .side-links a[aria-current="page"]{color:#990000;font-weight:800;box-shadow:inset 4px 0 0 #990000;padding-left:12px}
/* OnCore section (2026-10-05): /services/oncore and the /docs/oncore-* guides reuse the
   TriNetX pieces above. The guides are doc pages, which already sit in a padded
   container, so their two-column layout drops its own padding. */
.is-oncore .block .layout{padding:0}
.is-oncore .cmp td:first-child{width:34%}
.is-oncore .cmp td:first-child strong{font:700 20px/1.35 "Barlow Semi Condensed","Arial Narrow",Arial,sans-serif;color:#12203a}
.is-oncore .cmp td{overflow-wrap:anywhere}
.is-oncore main a[href^="mailto:"]{overflow-wrap:break-word}
.is-oncore .hpx-uses > div{min-width:0}
.is-oncore .hpx-uses span{overflow-wrap:break-word}
@media (max-width:600px){
  .is-oncore .cmp thead{display:none}
  .is-oncore .cmp tr{display:block;padding:14px 16px;border-top:1px solid var(--gray-300)}
  .is-oncore .cmp tr:first-child{border-top:0}
  .is-oncore .cmp td{display:block;width:auto;padding:0;border:0}
  .is-oncore .cmp td:first-child{width:auto;margin-bottom:4px}
}
/* Previous / next how-to guide */
.tnx-next{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:30px 0 0}
.tnx-next a{display:block;background:#fff;border:1px solid #e3e6e9;border-radius:12px;padding:16px 20px;text-decoration:none;color:#12203a}
.tnx-next a:hover{border-color:#990000;text-decoration:none}
.tnx-next a.nx{grid-column:2;text-align:right}
.tnx-next small{display:block;font:700 18px "Alumni Sans",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#990000}
.tnx-next b{display:block;font:800 24px/1.2 "Alumni Sans",sans-serif}
@media (max-width:900px){
  .hpx-uses,.hpx-data{grid-template-columns:1fr}
  .hpx-feat{grid-template-columns:1fr 1fr}
  .hpx-fig figcaption{position:static;background:#12203a}
  :is(.is-trinetx,.is-oncore) .content > .lede{font-size:21px}
  :is(.is-trinetx,.is-oncore) .content > h3{font-size:24px}
  :is(.is-trinetx,.is-oncore) .faq summary{font-size:20px}
  :is(.is-trinetx,.is-oncore) .spec-list li{flex-direction:column;gap:2px}
  .tnx-next{grid-template-columns:1fr}
  .tnx-next a.nx{grid-column:auto}
}

/* ===== Phone overflow fixes (2026-09-25) =====
   Found while checking the TriNetX and HPC pages at 390px. Grid children now shrink
   instead of growing to their longest word (sidebar email, doc links, script
   builder), long hostnames wrap, wide tables scroll inside their wrapper, and
   inline multi-column .twocol grids stack on phones. */
.layout>.content,.layout>.sidebar,.doc-grid>*,.sb-grid>*{min-width:0}
.side-card a,.side-contact a,.spec-list li span{overflow-wrap:anywhere}
.spec-list li span{min-width:0}
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.sb-grid pre{overflow-x:auto;max-width:100%}
@media (max-width:600px){
  .doc-cat a{flex-wrap:wrap}
  .twocol{grid-template-columns:1fr!important}
}
/* Glossary terms (span.gloss, added by the site's glossary filter) inside .hpx cards
   keep the look of the text around them instead of the card's span styles. */
.hpx span.gloss{display:inline;font:inherit;color:inherit;margin:0;padding:0;letter-spacing:inherit;text-transform:inherit}

/* ===== Announcements page enhancement (2026-09-25) =====
   /announcements: list + sidebar layout, month groups, date blocks, colour by type,
   summaries (falls back to the body when the summary field is empty), result count.
   Type scale matches the text-size sheet: labels 24 caps, titles 28, body 20,
   secondary 18, pills/tags 16. */
.annx{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start}
.annx-tools{background:#fff;border:1px solid #e3e6e9;border-radius:14px;padding:20px 22px;margin:0 0 26px}
.annx-tools .search-wrap{margin:0 0 14px}
.annx-tools .search-wrap input{font-size:20px;padding-top:14px;padding-bottom:14px}
.annx-tools .chips{margin:0 0 10px;gap:8px;flex-wrap:wrap}
.annx-tools .chips:last-of-type{margin-bottom:0}
.annx-tools .chips .lbl{font:700 20px "Alumni Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#5a6066;align-self:center;min-width:86px}
.annx-tools .chip{font-size:18px;padding:7px 16px}
.annx-count{font-size:18px;color:#5a6066;margin:0 0 20px}
.annx-count b{color:#12203a}
.annx-month{font:700 24px "Alumni Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#990000;margin:26px 0 12px;padding-bottom:8px;border-bottom:1px solid #e3e6e9}
.annx-month:first-child{margin-top:0}
.annx .ann-list{max-width:none;gap:14px}
.annx .ann-row{display:grid;grid-template-columns:84px minmax(0,1fr);gap:22px;padding:22px 24px;border-left-width:6px}
.annx .ann-row:hover{transform:none;box-shadow:0 6px 18px rgba(18,32,58,.08)}
.annx .ann-row[data-kind="maint"]{border-left-color:#990000}
.annx .ann-row[data-kind="news"]{border-left-color:#1c7c31}
.annx .ann-row[data-kind="event"]{border-left-color:#274f9c}
.annx-day{text-align:center;border-radius:12px;background:#f4f5f7;padding:10px 0 8px;align-self:start}
.annx-day b{display:block;font:800 44px/1 "Alumni Sans",sans-serif;color:#12203a}
.annx-day span{display:block;font:700 18px "Alumni Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#5a6066;margin-top:2px}
.annx-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 6px}
.annx .ann-row .pill{font-size:16px;margin:0}
.annx .ann-row .clu-tag{font-size:16px}
.annx .ann-row .date{font-size:16px;position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.annx .ann-row{position:relative}
.annx-meta .sys-tags{display:contents}
.annx-meta .clu-tag{margin:0;line-height:1.3}
.annx .ann-row h3{font:800 28px/1.15 "Alumni Sans",sans-serif;margin:2px 0 6px}
.annx .ann-row h3 a{color:#12203a}
.annx .ann-row h3 a:hover{color:#990000;text-decoration:none}
.annx .ann-row p:empty{display:none}
.annx .ann-row p{font-size:20px;line-height:1.5;color:#44484d;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.annx .ann-row .more{display:inline-block;margin-top:8px;font:700 18px "Alumni Sans",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#990000}
.annx-side{display:flex;flex-direction:column;gap:18px}
.annx-card{background:#fff;border:1px solid #e3e6e9;border-radius:14px;padding:22px}
.annx-card h4{font:700 20px "Alumni Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#990000;margin:0 0 12px}
.annx-card p{font-size:18px;line-height:1.45;color:#5a6066;margin:0 0 14px}
.annx-card .btn{width:100%;justify-content:center;font-size:20px}
.annx-types button{font-family:inherit;display:flex;justify-content:space-between;align-items:center;width:100%;background:none;border:0;border-bottom:1px solid #f0f1f3;padding:10px 0;font-weight:600;font-size:20px;color:#33373b;cursor:pointer;text-align:left}
.annx-types button:last-child{border-bottom:0}
.annx-types button:hover,.annx-types button.on{color:#990000}
.annx-types i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:10px;vertical-align:0}
.annx-types b{font:800 24px "Alumni Sans",sans-serif;color:#12203a}
.annx-links a{display:block;font-size:20px;font-weight:600;padding:9px 0;border-bottom:1px solid #f0f1f3;color:#33373b}
.annx-links a:last-child{border-bottom:0}
.annx-links a:hover{color:#990000;text-decoration:none}
.annx-status{background:linear-gradient(135deg,#12203a,#1d3358);color:#fff;border:0}
.annx-status h4{color:#fff}
.annx-status p{color:rgba(255,255,255,.85)}
.annx-status .btn{background:#fff;color:#12203a;border:0}
#annEmpty{font-size:20px}
@media (max-width:1000px){
  .annx{grid-template-columns:1fr}
  .annx-side{display:grid;grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  .annx-side{grid-template-columns:1fr}
  .annx .ann-row{grid-template-columns:1fr;gap:10px;padding:18px}
  .annx-day{display:flex;gap:8px;align-items:baseline;justify-content:flex-start;background:none;padding:0;text-align:left}
  .annx-day b{font-size:30px}
  .annx .ann-row h3{font-size:24px}
  .annx-tools .chips .lbl{min-width:0;width:100%}
  .annx-month{font-size:20px}
}

/* ===== Research in Action enhancement (2026-09-25) =====
   /research-in-action: featured lead story, larger cards with read time and a
   "Read the story" line, filter chips with counts, and a "share your research"
   band. Type scale: labels 20-24 caps, titles 28 (lead 40), body 20, secondary 18,
   tags 16. */
.ria-page .chips{gap:8px;flex-wrap:wrap;margin-bottom:28px}
.ria-page .chips .chip{font-size:18px;padding:8px 18px}
.ria-page .chips .chip i{font-style:normal;opacity:.7;margin-left:6px}
.ria-page .story-grid{gap:26px}
.ria-page .story{display:flex;flex-direction:column}
.ria-page .story .visual{height:240px}
.ria-page .story .pad{padding:24px 26px 22px;display:flex;flex-direction:column;flex:1}
.ria-page .story .eyebrow{font:700 20px "Alumni Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#990000}
.ria-page .story .clu-tag{font-size:16px}
.ria-page .story h3{font:800 28px/1.15 "Alumni Sans",sans-serif;margin:4px 0 10px}
.ria-page .story p{font-size:20px;line-height:1.5;color:#44484d}
.ria-page .story p.by{font-size:18px;line-height:1.45;color:#5a6066;margin-top:12px;padding-left:28px;position:relative}
.ria-page .story p.by:before{content:"👥";position:absolute;left:0;top:0}
.ria-page .story .foot{margin-top:auto;padding-top:16px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #f0f1f3}
.ria-page .story .foot .rt{font-size:18px;color:#5a6066}
.ria-page .story .foot .go{font:700 20px "Alumni Sans",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#990000}
.ria-page .story .pad > .foot{margin-top:auto}
.ria-page .story .pad > p.by{margin-bottom:16px}
/* Lead story: spans the grid, image left */
.ria-page .story.lead{grid-column:1 / -1;flex-direction:row;min-height:400px}
.ria-page .story.lead .visual{height:auto;flex:0 0 55%}
.ria-page .story.lead .pad{padding:36px 38px 30px;justify-content:center}
.ria-page .story.lead .lead-lbl{font:700 18px "Alumni Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:#990000;border-radius:999px;padding:4px 14px;align-self:flex-start;margin-bottom:14px}
.ria-page .story.lead h3{font-size:40px;line-height:1.08}
.ria-page .story.lead p{font-size:22px}
.ria-page .story.lead p.by{font-size:18px}
/* Share band */
.ria-share{margin-top:48px;border-radius:16px;background:linear-gradient(115deg,#3d0507,#7a0000 55%,#990000);color:#fff;padding:36px 40px;display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center}
.ria-share .eb{font:700 22px "Alumni Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.85);margin:0 0 6px}
.ria-share h2{font:800 40px/1.08 "Alumni Sans",sans-serif;color:#fff;margin:0 0 10px}
.ria-share p{font-size:20px;line-height:1.5;color:rgba(255,255,255,.9);margin:0;max-width:720px}
.ria-share .acts{display:flex;flex-direction:column;gap:10px;min-width:280px}
.ria-share .acts a{display:block;text-align:center;border-radius:999px;padding:13px 24px;font:700 20px "Alumni Sans",sans-serif;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.ria-share .acts a.pri{background:#fff;color:#990000}
.ria-share .acts a.sec{border:2px solid rgba(255,255,255,.7);color:#fff}
.ria-share .acts a:hover{text-decoration:none;opacity:.92}
@media (max-width:900px){
  .ria-page .story.lead{flex-direction:column;min-height:0}
  .ria-page .story.lead .visual{height:240px;flex:none}
  .ria-page .story.lead .pad{padding:24px 26px 22px}
  .ria-page .story.lead h3{font-size:32px}
  .ria-page .story.lead p{font-size:20px}
  .ria-share{grid-template-columns:1fr;padding:28px 24px}
  .ria-share h2{font-size:32px}
  .ria-share .acts{min-width:0}
}
@media (max-width:600px){
  .ria-page .story .visual{height:200px}
  .ria-page .story h3{font-size:24px}
}

/* ===== Accessibility fixes (2026-09-25) =====
   From the axe-core audit (claude/rci-accessibility-audit.md):
   - text greys darkened at the source (--gray-500, .utilbar .lbl, --faint, --fp-faint);
   - links inside running text are underlined so they are not identified by colour
     alone (WCAG 1.4.1); card/button links keep their own styling (they have classes
     or are not inside a paragraph);
   - reduced motion: people who ask their OS for less motion get no scroll-reveal
     fades, hover lifts or smooth scrolling. */
main :is(p,li,dd,figcaption) a:not([class]),
main :is(.callout,.a,.ans,.sb-hint) a:not([class]){text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
main :is(p,li,dd,figcaption) a:not([class]):hover,
main :is(.callout,.a,.ans) a:not([class]):hover{text-decoration-thickness:2px}
main[tabindex="-1"]:focus{outline:none}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1!important;transform:none!important}
  .story:hover,.ann-row:hover,.doc-cat:hover,.svc:hover,.sg-card:hover,.fp-path:hover,.fp-story:hover{transform:none!important}
}
/* Accessibility round 2 (2026-09-26): visually hidden helper (same as Drupal core's),
   used for section headings that exist only for screen readers. */
.visually-hidden:not(:focus):not(:active){position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(1px,1px,1px,1px)!important;clip-path:inset(50%)!important;white-space:nowrap!important;word-wrap:normal!important}

/* ===== A-Z index enhancement (2026-09-26) =====
   /atoz (node 417 body: .az-strip + .az-group lists). rci.js adds the filter bar,
   section chips, counts and data-sec on rows; this block styles it.
   Type scale: letters 40, titles 20, labels 18-20, pills 16. */
.block:has(> .azx){padding-top:28px}
.azx-tools{position:sticky;top:76px;z-index:30;background:#fff;padding:18px 0 12px;margin:0 0 8px;border-bottom:1px solid #e3e6e9}
.azx-search{position:relative;margin:0 0 12px}
.azx-search svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:#5f656b}
.azx-search input{width:100%;font:inherit;font-size:20px;padding:14px 18px 14px 50px;border:1.5px solid #cfd4d9;border-radius:999px;background:#fff}
.azx-search input:focus{border-color:#990000;outline:3px solid rgba(153,0,0,.18);outline-offset:1px}
.azx-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 10px}
.azx-chips .lbl{font:700 18px "Alumni Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#5f656b;margin-right:4px}
.azx-chips button{font:600 18px/1 "Barlow Semi Condensed",sans-serif;font-family:inherit;padding:9px 16px;border-radius:999px;border:1.5px solid #d5d9dd;background:#fff;color:#33373b;cursor:pointer}
.azx-chips button i{font-style:normal;opacity:.7;margin-left:6px}
.azx-chips button:hover{border-color:#990000;color:#990000}
.azx-chips button[aria-pressed="true"]{background:#990000;border-color:#990000;color:#fff}
.azx-count{font-size:18px;color:#5f656b;margin:0}
.azx-count b{color:#12203a}
.azx .az-strip{position:static;top:auto;border:0;padding:4px 0 0;margin:10px 0 0;gap:6px;display:grid;grid-template-columns:repeat(auto-fill,minmax(36px,1fr))}
.azx .az-strip a,.azx .az-strip span{width:auto;height:40px;font:800 20px "Alumni Sans",sans-serif;border-radius:10px}
.azx .az-strip a.off{background:#f4f5f7;color:#9aa0a6;pointer-events:none}
.azx .az-strip a.on{background:#990000;color:#fff}
.azx .az-group{margin:0 0 34px;scroll-margin-top:260px}
.azx .az-group h2{display:flex;align-items:baseline;gap:14px;font:800 40px/1 "Alumni Sans",sans-serif;color:#990000;border-bottom:2px solid #e3e6e9;padding-bottom:8px;margin-bottom:14px;scroll-margin-top:260px}
.azx .az-group h2 small{font:600 18px "Barlow Semi Condensed",sans-serif;font-family:inherit;color:#5f656b;letter-spacing:0}
.azx .az-list{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:10px 14px}
.azx .az-row{align-items:center;padding:14px 16px;border:1px solid #e3e6e9;border-radius:12px;background:#fff;font-size:20px;line-height:1.3;border-bottom-width:1px}
.azx .az-row:hover{background:#fff;border-color:#990000;color:#990000;box-shadow:0 4px 14px rgba(18,32,58,.07)}
.azx .az-row mark{background:#fff1b8;color:inherit;border-radius:3px;padding:0 1px}
.azx .az-row .az-sec{font:700 16px/1 "Barlow Semi Condensed",sans-serif;font-family:inherit;padding:6px 10px;border-radius:999px;background:#f1f3f5;color:#44484d;flex:0 0 auto}
.azx .az-row[data-sec="service"] .az-sec{background:#fbe9e9;color:#8a0000}
.azx .az-row[data-sec="service-guide"] .az-sec{background:#e8eef7;color:#1d3f73}
.azx .az-row[data-sec="hpc"] .az-sec{background:#e3f1f4;color:#0f5f70}
.azx .az-row[data-sec="hpc-software"] .az-sec{background:#efe9f7;color:#553487}
.azx .az-row[data-sec="team"] .az-sec{background:#e7f4ea;color:#1c6b31}
.azx .az-row[data-sec="research-in-action"] .az-sec{background:#fdf2dc;color:#7a5200}
.azx-empty{font-size:20px;color:#5f656b;padding:24px 0}
@media (max-width:999px){.azx-tools{position:static}}
@media (max-width:700px){
  .azx .az-list{grid-template-columns:1fr}
  .azx .az-group h2{font-size:34px}
  .azx .az-strip a,.azx .az-strip span{height:36px;font-size:18px}
}
@media print{.azx-tools .azx-search,.azx-tools .azx-chips,.azx-count{display:none}}

/* ===== HPC documentation library (/hpc/docs, node 424) enhancement (2026-09-26) =====
   rci.js initDocs() adds search, cluster filter with counts, jump links and category counts.
   Start-here cards, tool cards and the help band are in the node body. */
.dcx-start{margin:0 0 30px}
.dcx-start h2,.dcx-more h2{font:800 40px/1 "Alumni Sans",sans-serif;color:#12203a;margin:0 0 6px}
.dcx-start .sub,.dcx-more .sub{font-size:20px;color:#4a5159;margin:0 0 18px}
.dcx-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.dcx-card{display:flex;flex-direction:column;gap:6px;padding:20px 20px 18px;border:1px solid #e3e6e9;border-top:4px solid var(--c,#990000);border-radius:14px;background:#fff;text-decoration:none;color:#1f2933;transition:box-shadow .15s,transform .15s}
.dcx-card:hover{box-shadow:0 8px 24px rgba(18,32,58,.10);transform:translateY(-2px)}
.dcx-card .n{font:800 18px/1 "Alumni Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--c,#990000)}
.dcx-card b{font:800 26px/1.1 "Alumni Sans",sans-serif;color:#12203a}
.dcx-card span.d{font-size:18px;line-height:1.4;color:#4a5159}
.dcx-card .go{margin-top:auto;padding-top:6px;font-size:18px;font-weight:700;color:var(--c,#990000)}
.dcx-tools{position:sticky;top:76px;z-index:30;background:#fff;padding:16px 0 12px;margin:0 0 18px;border-bottom:1px solid #e3e6e9}
.dcx-row{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center}
.dcx-search{position:relative;flex:1 1 380px}
.dcx-search svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:#5f656b}
.dcx-search input{width:100%;font:inherit;font-size:20px;padding:13px 18px 13px 50px;border:1.5px solid #cfd4d9;border-radius:999px;background:#fff}
.dcx-search input:focus{border-color:#990000;outline:3px solid rgba(153,0,0,.18);outline-offset:1px}
.dcx-seg{display:inline-flex;flex-wrap:wrap;gap:6px;align-items:center}
.dcx-seg .lbl,.dcx-jump .lbl{font:700 18px "Alumni Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#5f656b;margin-right:4px}
.dcx-seg button{font:inherit;font-size:18px;font-weight:600;padding:9px 16px;border-radius:999px;border:1.5px solid #d5d9dd;background:#fff;color:#33373b;cursor:pointer;line-height:1}
.dcx-seg button i{font-style:normal;opacity:.7;margin-left:6px}
.dcx-seg button:hover{border-color:#990000;color:#990000}
.dcx-seg button[aria-pressed="true"]{background:#990000;border-color:#990000;color:#fff}
.dcx-jump{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin:12px 0 0}
.dcx-jump a{font-size:18px;color:#12203a;text-decoration:none;border-bottom:2px solid transparent;padding:2px 0}
.dcx-jump a:hover{border-color:#990000;color:#990000}
.dcx-jump a i{font-style:normal;color:#5f656b;margin-left:4px}
.dcx-jump a.off{color:#9aa0a6;pointer-events:none}
.dcx-count{font-size:18px;color:#5f656b;margin:10px 0 0}
.dcx-count b{color:#12203a}
.dcx .doc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.dcx .doc-cat{padding:22px 24px 12px;border-radius:16px;border:1px solid #e3e6e9;border-top:4px solid var(--c,#990000);scroll-margin-top:260px}
.dcx .doc-cat:hover{transform:none}
.dcx .doc-cat .icon{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--t,#fbe9e9);color:var(--c,#990000);font-size:0;margin:0 0 10px}
.dcx .doc-cat .icon svg{width:26px;height:26px}
.dcx .doc-cat h3{display:flex;align-items:baseline;gap:12px;font:800 30px/1.1 "Alumni Sans",sans-serif;color:#12203a;margin:0 0 8px}
.dcx .doc-cat h3 small{font:600 18px "Barlow Semi Condensed",sans-serif;font-family:inherit;color:#5f656b}
.dcx .doc-cat a{align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid #eef0f2}
.dcx .doc-cat a:last-of-type{border-bottom:0}
.dcx .doc-cat a > span:first-child{font-size:20px;line-height:1.3}
.dcx .doc-cat a:hover > span:first-child{color:#990000}
.dcx .doc-cat a mark{background:#fff1b8;color:inherit;border-radius:3px;padding:0 1px}
.dcx .clu-tag{font-size:16px;font-weight:700;border-radius:999px;padding:4px 10px;white-space:nowrap;background:#f1f3f5;color:#5f656b;border:0}
.dcx .clu-tag.t-sea{background:#e8eef7;color:#1d3f73}
.dcx .clu-tag.t-nv{background:#eaf5d6;color:#3c5f00}
.dcx .clu-tag.t-clin{background:#e3f1f4;color:#0f5f70}
.dcx .doc-cat[data-k="connect"]{--c:#990000;--t:#fbe9e9}
.dcx .doc-cat[data-k="jobs"]{--c:#1d3f73;--t:#e8eef7}
.dcx .doc-cat[data-k="storage"]{--c:#0f5f70;--t:#e3f1f4}
.dcx .doc-cat[data-k="software"]{--c:#553487;--t:#efe9f7}
.dcx .doc-cat[data-k="ondemand"]{--c:#1c6b31;--t:#e7f4ea}
.dcx .doc-cat[data-k="policies"]{--c:#7a5200;--t:#fdf2dc}
.dcx-empty{font-size:20px;color:#5f656b;padding:20px 0}
.dcx-more{margin:40px 0 0}
.dcx-help{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin:28px 0 0;padding:22px 26px;border-radius:16px;background:#12203a;color:#fff}
.dcx-help b{font:800 30px/1 "Alumni Sans",sans-serif;margin-right:auto}
.dcx-help a,.dcx-help button{font:inherit;font-size:19px;font-weight:700;color:#fff;background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.35);border-radius:999px;padding:10px 18px;text-decoration:none;cursor:pointer}
.dcx-help a:hover,.dcx-help button:hover{background:#fff;color:#12203a}
@media (max-width:999px){.dcx-tools{position:static}.dcx-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.dcx .doc-grid,.dcx-cards{grid-template-columns:1fr}.dcx-start h2,.dcx-more h2{font-size:32px}.dcx-help b{width:100%}}
@media print{.dcx-tools{display:none}}

/* ===== Front page enhancements (2026-09-26) =====
   page--front: live status pill (#fpStatus), hero search (.fpx-search), live
   "Right now" row (#fpNow). rci.js initFront() fills them from
   /rci/cluster-status.json (rci_content module) and window.ARIE_INDEX. */
.hero .kicker.fpx-live{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.28);font-weight:600}
.hero .kicker.fpx-live .dot{width:10px;height:10px;border-radius:50%;background:#7ee08a;box-shadow:0 0 0 4px rgba(126,224,138,.25)}
.hero .kicker.fpx-live.warn .dot{background:#ffc15c;box-shadow:0 0 0 4px rgba(255,193,92,.28)}
.hero .kicker.fpx-live.down .dot{background:#ff7b7b;box-shadow:0 0 0 4px rgba(255,123,123,.28)}
.hero .kicker.fpx-live u{text-decoration:none;opacity:.8;font-weight:400}
.fpx-search{position:relative;max-width:640px;margin:22px 0 6px}
.fpx-search svg{position:absolute;left:20px;top:50%;transform:translateY(-50%);width:22px;height:22px;color:#5f656b;pointer-events:none}
.fpx-search input{width:100%;font:inherit;font-size:21px;padding:16px 20px 16px 56px;border:0;border-radius:999px;background:#fff;color:#1f2933;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.fpx-search input:focus{outline:3px solid rgba(255,255,255,.6);outline-offset:2px}
.fpx-hits{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:40;background:#fff;border-radius:16px;box-shadow:0 18px 48px rgba(0,0,0,.28);padding:8px;display:none}
.fpx-hits.open{display:block}
.fpx-hits a{display:flex;justify-content:space-between;gap:14px;align-items:baseline;padding:11px 14px;border-radius:10px;color:#1f2933;text-decoration:none}
.fpx-hits a:hover,.fpx-hits a:focus{background:#f3f6f9;outline:none}
.fpx-hits a b{font-size:19px;font-weight:600}
.fpx-hits a span{font-size:16px;color:#5f656b;white-space:nowrap}
.fpx-hits .all{border-top:1px solid #e3e6e9;margin-top:6px;border-radius:0 0 10px 10px;color:#990000;font-weight:700;font-size:18px}
.fpx-hits .none{padding:12px 14px;font-size:18px;color:#5f656b}
.fpx-now{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 18px;padding:14px 16px;border-radius:14px;background:#fff;border:1px solid #e3e6e9}
.fpx-now .lbl{font:700 18px "Alumni Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#5f656b;margin-right:4px}
.fpx-now a{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;font-size:17px;font-weight:700;text-decoration:none;border:1px solid transparent}
.fpx-now a i{width:9px;height:9px;border-radius:50%;background:currentColor}
.fpx-now a.ok{background:#e3f1f4;color:#0f5f70}
.fpx-now a.busy{background:#fdf2dc;color:#7a5200}
.fpx-now a.hot{background:#fbe9e9;color:#8a0000}
.fpx-now a.maint{background:#fdf2dc;color:#7a5200;border-color:#e8c98a}
.fpx-now a:hover{border-color:currentColor}
.fpx-now .more{margin-left:auto;font-size:17px;font-weight:700;color:#990000;text-decoration:none}
.hero .kicker.fpx-live.pending .dot{background:#c9d1d9;box-shadow:0 0 0 4px rgba(201,209,217,.25)}
.hero:has(.fpx-hits.open){overflow:visible;z-index:6}
.fpx-hits a.on{background:#f3f6f9}
@media (max-width:700px){.fpx-search input{font-size:18px;padding:14px 16px 14px 50px}.fpx-hits a span{display:none}.fpx-now .more{margin-left:0}}

/* ===== Events + newsletter (2026-09-27) =====
   .evx = event layout inside an announcement body (node body markup).
   .nlx = /newsletter landing page. .nlx-web = web version of a newsletter issue. */
.ann-article .content:has(.evx){max-width:none;font-size:inherit;line-height:inherit}
.evx{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:40px;align-items:start;padding:10px 0 20px}
.evx h2{font:800 34px/1.05 "Alumni Sans",sans-serif;color:#12203a;margin:26px 0 10px}
.evx h2:first-child{margin-top:0}
.evx p{font-size:20px;line-height:1.55;margin:0 0 14px;color:#33373b}
.evx-facts{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #e3e6e9;border-radius:16px;overflow:hidden;margin:0 0 26px}
.evx-facts div{padding:18px 20px;border-right:1px solid #e3e6e9;background:#fff}
.evx-facts div:last-child{border-right:0}
.evx-facts small{display:block;font:700 16px "Alumni Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#990000;margin:0 0 4px}
.evx-facts b{font-size:20px;line-height:1.3;color:#12203a}
.evx-learn{list-style:none;margin:0 0 10px;padding:0}
.evx-learn li{position:relative;padding:0 0 10px 34px;font-size:20px;line-height:1.45}
.evx-learn li:before{content:"";position:absolute;left:0;top:5px;width:20px;height:20px;border-radius:50%;background:#15788e;box-shadow:inset 0 0 0 6px #e3f1f4}
.evx-apps{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 18px;padding:0;list-style:none}
.evx-apps li{font-size:17px;font-weight:600;padding:6px 14px;border-radius:999px;background:#f1f3f5;color:#33373b}
.evx-who{background:#fff8dc;border-left:5px solid #d9a400;border-radius:8px;padding:14px 18px;font-size:19px;line-height:1.45}
.evx-band{margin:26px 0 0;padding:18px 20px;background:#12203a;border-radius:14px;color:#dfe6ee;font-size:17px;line-height:1.5}
.evx-side{display:grid;gap:20px;position:sticky;top:96px}
.evx-card{border:1px solid #e3e6e9;border-radius:16px;background:#fff;padding:22px 24px}
.evx-card h3{font:800 28px/1.05 "Alumni Sans",sans-serif;color:#12203a;margin:0 0 12px}
.evx-card.reg{border-top:5px solid #990000;text-align:center}
.evx-card.reg img{width:170px;height:170px;display:block;margin:0 auto 10px}
.evx-card .btn-reg{display:block;background:#990000;color:#fff;font-size:20px;font-weight:700;padding:14px;border-radius:12px;text-decoration:none;margin:0 0 10px}
.evx-card .btn-reg:hover,.evx-card .btn-reg:focus{background:#7a0000;color:#fff}
.evx-card .btn-sec{display:block;border:1.5px solid #cfd4d9;color:#12203a;font-size:18px;font-weight:700;padding:11px;border-radius:12px;text-decoration:none;margin:10px 0 0}
.evx-card.reg .fine{font-size:16px;color:#5f656b;margin:0}
.evx-host{display:flex;gap:14px;align-items:center;margin:0 0 14px;text-decoration:none;color:inherit}
.evx-host:last-child{margin:0}
.evx-host img{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:50% 20%;flex:0 0 72px}
.evx-host b{display:block;font-size:20px;color:#12203a}
.evx-host span{font-size:17px;color:#5f656b;line-height:1.3}
.evx-card p.fine{font-size:17px;line-height:1.5;color:#4a5159;margin:0}
.evx-card p.fine a{color:#990000;font-weight:700}
@media (max-width:980px){.evx{grid-template-columns:1fr}.evx-side{position:static}.evx-facts{grid-template-columns:1fr}.evx-facts div{border-right:0;border-bottom:1px solid #e3e6e9}.evx-facts div:last-child{border-bottom:0}}

.nlx{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:36px;align-items:start;padding:10px 0 20px}
.nlx h2{font:800 36px/1.05 "Alumni Sans",sans-serif;color:#12203a;margin:0 0 14px}
.nlx .eb{font:700 18px "Alumni Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#990000;margin:0 0 6px}
.nlx-issue{border:1px solid #e3e6e9;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 8px 28px rgba(18,32,58,.07)}
.nlx-mast{background:#990000;color:#fff;padding:26px 30px 22px;position:relative}
.nlx-mast:after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:6px;background:linear-gradient(90deg,#002244,#15788e,#9cc4a6)}
.nlx-mast small{display:block;font-size:15px;letter-spacing:.16em;text-transform:uppercase;opacity:.85}
.nlx-mast b{display:block;font:800 52px/1 "Alumni Sans",sans-serif;margin:6px 0 4px}
.nlx-mast span{font-size:19px;opacity:.92}
.nlx-body{padding:30px 30px 26px}
.nlx-body h3{font:800 26px/1.1 "Alumni Sans",sans-serif;color:#12203a;margin:0 0 12px}
.nlx-toc{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:10px}
.nlx-toc li{display:flex;gap:14px;align-items:baseline;font-size:20px;line-height:1.35}
.nlx-toc li i{font-style:normal;flex:0 0 150px;font:700 16px "Alumni Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#990000}
.nlx-btns{display:flex;flex-wrap:wrap;gap:12px}
.nlx-btns a{font-size:19px;font-weight:700;padding:12px 20px;border-radius:12px;text-decoration:none}
.nlx-btns a.p{background:#990000;color:#fff}
.nlx-btns a.s{border:1.5px solid #cfd4d9;color:#12203a}
.nlx-past{margin:34px 0 0}
.nlx-past .row{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:16px 4px;border-bottom:1px solid #e3e6e9;font-size:20px}
.nlx-past .row a{color:#12203a;font-weight:600;text-decoration:none}
.nlx-past .row a:hover{color:#990000}
.nlx-past .row span{font-size:17px;color:#5f656b}
.nlx-past p{font-size:18px;color:#5f656b;margin:14px 0 0}
.nlx-side{display:grid;gap:20px;position:sticky;top:96px}
.nlx-card{border:1px solid #e3e6e9;border-radius:16px;background:#fff;padding:24px 24px 22px}
.nlx-card.sub{border-top:5px solid #990000}
.nlx-card h3{font:800 28px/1.05 "Alumni Sans",sans-serif;color:#12203a;margin:0 0 8px}
.nlx-card p{font-size:18px;line-height:1.45;color:#4a5159;margin:0 0 12px}
.nlx-card p:last-child{margin:0}
.nlx-card ul{margin:0;padding-left:20px;font-size:18px;line-height:1.5;color:#33373b}
.nlx-card a.lk{font-size:18px;font-weight:700;color:#990000;text-decoration:none}
@media (max-width:980px){.nlx{grid-template-columns:1fr}.nlx-side{position:static}.nlx-toc li{flex-direction:column;gap:2px}.nlx-toc li i{flex:none}}

.nlx-web{max-width:680px;margin:0 auto 10px;background:#fff;border:1px solid #e3e6e9;border-radius:14px;overflow:hidden;box-shadow:0 8px 28px rgba(18,32,58,.07);font-family:Arial,Helvetica,sans-serif;color:#1f2933}
.nlx-web a{color:#990000}
.nlx-web .pad{padding:24px 32px}
.nlx-web .tag{font-size:13px;font-weight:bold;letter-spacing:.14em;text-transform:uppercase;color:#990000;margin:0 0 6px}
.nlx-web h2{font:bold 25px/1.2 Arial,Helvetica,sans-serif;color:#12203a;margin:0 0 10px}
.nlx-web h3{font:bold 18px/1.3 Arial,Helvetica,sans-serif;color:#12203a;margin:0 0 4px}
.nlx-web p{font-size:17px;line-height:1.55;margin:0 0 12px}
.nlx-web .rule{border:0;border-top:1px solid #e3e6e9;margin:0}
.nlx-web .btn{display:inline-block;background:#990000;color:#fff;text-decoration:none;font-weight:bold;font-size:16px;padding:12px 20px;border-radius:8px}
.nlx-web .confirm{background:#fff1b8;padding:0 3px;border-radius:3px}
.nlx-web table{border-collapse:separate}
@media (max-width:600px){.nlx-web .pad{padding:20px}.nlx-web .two td{display:block;width:100%!important;padding:0 0 14px!important}}

/* ===== About RCI (node body .abx) 2026-09-27 ===== */
.abx{--c:#990000}
.abx-sec{padding:56px 0}
.abx-sec.alt{background:#f5f6f7}
.abx .eb{font:700 18px "Alumni Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#990000;margin:0 0 6px}
.abx h2{font:800 44px/1.02 "Alumni Sans",sans-serif;color:#12203a;margin:0 0 12px}
.abx .lead{font-size:22px;line-height:1.5;color:#33373b;margin:0 0 16px;max-width:760px}
.abx-intro{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:48px;align-items:start}
.abx-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:26px 0 0}
.abx-facts div{background:#fff;border:1px solid #e3e6e9;border-top:4px solid var(--c);border-radius:14px;padding:16px 16px 14px}
.abx-facts b{display:block;font:800 40px/1 "Alumni Sans",sans-serif;color:#990000}
.abx-facts span{font-size:17px;line-height:1.3;color:#4a5159}
.abx-crio{background:#12203a;color:#fff;border-radius:18px;padding:26px 26px 24px;position:relative;overflow:hidden}
.abx-crio:after{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.05)}
.abx-crio .who{display:flex;gap:16px;align-items:center;margin:0 0 16px}
.abx-crio img{width:84px;height:84px;border-radius:50%;object-fit:cover;object-position:50% 20%;border:3px solid rgba(255,255,255,.25)}
.abx-crio b{display:block;font:800 26px/1.05 "Alumni Sans",sans-serif}
.abx-crio small{display:block;font-size:16px;color:#c3ccd7;line-height:1.3;margin-top:3px}
.abx-crio q{display:block;font-size:20px;line-height:1.5;color:#eef2f6;margin:0 0 18px;quotes:none}
.abx-crio .btns{display:flex;flex-wrap:wrap;gap:10px}
.abx-crio .btns a{font-size:18px;font-weight:700;padding:11px 18px;border-radius:12px;text-decoration:none}
.abx-crio .btns a.p{background:#fff;color:#12203a}
.abx-crio .btns a.s{border:1.5px solid rgba(255,255,255,.4);color:#fff}
.abx-mission{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:22px 0 0}
.abx-mcard{display:flex;gap:18px;align-items:flex-start;background:#fff;border:1px solid #e3e6e9;border-radius:16px;padding:22px 24px}
.abx-ic{width:56px;height:56px;flex:0 0 56px;border-radius:14px;display:grid;place-items:center;background:var(--t,#fbe9e9);color:var(--c,#990000)}
.abx-ic svg{width:30px;height:30px}
.abx-mcard h3{font:800 28px/1.05 "Alumni Sans",sans-serif;color:#12203a;margin:0 0 6px}
.abx-mcard p{font-size:19px;line-height:1.45;color:#4a5159;margin:0}
.abx-life{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;counter-reset:st}
.abx-life li{counter-increment:st}
.abx-life a{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid #e3e6e9;border-top:5px solid var(--c);border-radius:14px;padding:16px 14px;text-decoration:none;color:#1f2933;transition:box-shadow .15s,transform .15s}
.abx-life a:hover{box-shadow:0 8px 22px rgba(18,32,58,.1);transform:translateY(-2px)}
.abx-life a:before{content:counter(st);font:800 16px "Alumni Sans",sans-serif;color:var(--c);letter-spacing:.1em}
.abx-life b{font:800 22px/1.1 "Alumni Sans",sans-serif;color:#12203a;margin:4px 0 6px}
.abx-life span{font-size:16px;line-height:1.35;color:#4a5159}
.abx-teams{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:26px 0 0}
.abx-team{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid #e3e6e9;border-radius:16px;padding:18px 18px 16px;text-decoration:none;color:#1f2933}
.abx-team:hover{border-color:#990000}
.abx-team .faces{display:flex}
.abx-team .faces img{width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:50% 20%;border:3px solid #fff;margin-left:-10px;box-shadow:0 1px 3px rgba(0,0,0,.15)}
.abx-team .faces img:first-child{margin-left:0}
.abx-team b{font:800 22px/1.1 "Alumni Sans",sans-serif;color:#12203a}
.abx-team span{font-size:16px;color:#5f656b}
.abx-more{display:inline-block;margin:20px 0 0;font:700 20px "Alumni Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#990000;text-decoration:none}
.abx-work{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:26px 0 0}
.abx-work a{display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid #e3e6e9;border-radius:16px;padding:20px;text-decoration:none;color:#1f2933}
.abx-work a:hover{border-color:#990000;box-shadow:0 8px 22px rgba(18,32,58,.08)}
.abx-work b{font:800 24px/1.1 "Alumni Sans",sans-serif;color:#12203a}
.abx-work span{font-size:17px;line-height:1.4;color:#4a5159}
.abx-work i{font-style:normal;margin-top:auto;font-size:17px;font-weight:700;color:#990000}
@media (max-width:1100px){.abx-life{grid-template-columns:repeat(4,minmax(0,1fr))}.abx-teams,.abx-work{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.abx-intro,.abx-mission{grid-template-columns:1fr}.abx-facts{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.abx-life,.abx-teams,.abx-work{grid-template-columns:1fr}.abx h2{font-size:34px}.abx-sec{padding:40px 0}}

.abx .abx-life a,.abx .abx-life a b,.abx .abx-life a span{text-decoration:none}
.abx .abx-life a:hover b{text-decoration:underline}

/* ---- About text sizes: same scale as the home page (rci-sizes.css) ----
   eyebrows 24, section titles 48, intro 22, card titles 24, card text 20,
   CRIO name 26 / quote 24, metrics 20 / 38 / 20, "All ..." links 24.
   Nothing on this page is set below 20px. */
.abx-intro{grid-template-columns:minmax(0,1fr) 440px}
.abx .eb{font-size:24px}
.abx h2{font-size:48px;line-height:1.08}
.abx .lead{font-size:22px}
.abx-facts b{font-size:42px}
.abx-facts span{font-size:20px}
.abx-crio b{font-size:26px}
.abx-crio small{font-size:20px}
.abx-crio q{font-size:24px;line-height:1.45}
.abx-crio .btns a{font-size:20px}
.abx-mcard h3{font-size:30px}
.abx-mcard p{font-size:20px}
.abx-life{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.abx-life a{padding:18px 18px 16px}
.abx-life a:before{font-size:20px}
.abx-life b{font-size:26px}
.abx-life span{font-size:20px}
.abx-team b{font-size:24px}
.abx-team span{font-size:20px}
.abx-team .faces img{width:52px;height:52px}
.abx-more{font-size:24px}
.abx .bynum .metric-group .mg-label{font-size:20px}
.abx .bynum .metric .num{font-size:38px;line-height:1.05}
.abx .bynum .metric .lab{font-size:20px;line-height:1.35}
.abx-work b{font-size:26px}
.abx-work span{font-size:20px}
.abx-work i{font-size:20px}
@media (max-width:1100px){.abx-intro{grid-template-columns:minmax(0,1fr) 400px}}
@media (max-width:900px){
  .abx-intro{grid-template-columns:1fr}
  .abx .eb{font-size:22.2px}
  .abx h2{font-size:35.4px}
  .abx .lead{font-size:21.1px}
  .abx-facts b{font-size:32px}
  .abx-crio b,.abx-life b,.abx-work b{font-size:23.3px}
  .abx-crio q,.abx-team b,.abx-more{font-size:22.2px}
  .abx-mcard h3{font-size:25.5px}
  .abx .bynum .metric .num{font-size:29.9px}
}
@media (max-width:600px){.abx-life{grid-template-columns:1fr}}
.abx-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
.abx-life li.more a{border-top-color:#5f656b;background:#f5f6f7}
.abx-life li.more a:before{content:"?"}

/* ===== Full-text search results (2026-09-27) =====
   /search: instant results, then "Found in page text" (.ftx) from
   /rci/search.json. Home + Services dropdowns: .ftx-sep/.ftx-h rows.
   Sizes follow the home-page scale (nothing under 16px, body text 20px). */
.search-page .search-results,.search-page .ftx{max-width:900px;margin-left:auto;margin-right:auto}
.search-page #searchCount{font-size:20px}
.search-page .sr .sr-sec{font-size:16px}
.search-page .sr h3{font-size:26px;line-height:1.2}
.search-page .sr p{font-size:20px;line-height:1.5}
.ftx{margin-top:34px;padding-top:26px;border-top:2px solid #e3e6e9}
.ftx[hidden]{display:none}
.ftx-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:0 0 6px}
.ftx-head h2{font:800 36px/1.1 "Alumni Sans","Arial Narrow",sans-serif;color:#12203a;margin:0}
.ftx-head span{font-size:20px;color:#5f656b}
.ftx-note,.ftx-wait{font-size:20px;color:#5f656b;margin:0 0 16px}
.ftx-list{display:grid;gap:12px}
.ftx-item{display:block;background:#fff;border:1px solid #e3e6e9;border-left:4px solid #15788e;border-radius:12px;padding:16px 22px;text-decoration:none;color:#1f2933;transition:box-shadow .12s,transform .12s}
.ftx-item:hover,.ftx-item:focus{border-color:#15788e;box-shadow:0 6px 18px rgba(18,32,58,.08);transform:translateX(4px);text-decoration:none}
.ftx-item .ty{font:700 16px "Alumni Sans","Arial Narrow",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#0f5f70}
.ftx-item h3{font:800 26px/1.15 "Alumni Sans","Arial Narrow",sans-serif;color:#12203a;margin:2px 0 6px}
.ftx-item p{font-size:20px;line-height:1.5;color:#4a5159;margin:0;overflow-wrap:anywhere}
.ftx-item mark{background:#fdf3c4;color:inherit;padding:0 2px;border-radius:2px}
/* dropdown rows (home hero search + Services search) */
.fpx-hits .ftx-sep,#siteHits .ftx-sep{font:700 16px "Alumni Sans","Arial Narrow",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#0f5f70;padding:12px 16px 4px;margin-top:4px;border-top:1px solid #e3e6e9}
.fpx-hits a.ftx-h,#siteHits a.ftx-h{display:block;text-align:left}
.fpx-hits a.ftx-h b,#siteHits a.ftx-h b{display:block;font-size:19px;font-weight:600;color:#1f2933}
.fpx-hits a.ftx-h small,#siteHits a.ftx-h small{display:block;font-size:16px;color:#5f656b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
#siteHits a.ftx-h b{font-size:20px}
@media (max-width:700px){.fpx-hits a.ftx-h small{display:block}.ftx-head h2{font-size:30px}.ftx-item h3{font-size:23px}.search-page .sr h3{font-size:23px}}

/* ===== Page-type pills (2026-09-27): same colours as the A-Z index =====
   .rpill[data-k] on /search (both sections), the home + Services dropdowns
   and ARIE sources. Keys: service, service-guide, hpc, hpc-software, team,
   story, news, uit, page. Result cards (.sr / .ftx-item) take the colour on
   their left edge; all result titles are navy so the pills stand out. */
.rpill.rpill{display:inline-block;width:auto;font-family:"Barlow Semi Condensed","Segoe UI",sans-serif;font-weight:700;font-size:16px;line-height:1;letter-spacing:.02em;text-transform:none;padding:6px 11px;border-radius:999px;background:#f1f3f5;color:#44484d;white-space:nowrap;vertical-align:middle}
.rpill.rpill[data-k="service"]{background:#fbe9e9;color:#8a0000}
.rpill.rpill[data-k="service-guide"]{background:#e8eef7;color:#1d3f73}
.rpill.rpill[data-k="hpc"]{background:#e3f1f4;color:#0f5f70}
.rpill.rpill[data-k="hpc-software"]{background:#efe9f7;color:#553487}
.rpill.rpill[data-k="team"]{background:#e7f4ea;color:#1c6b31}
.rpill.rpill[data-k="story"]{background:#fdf2dc;color:#7a5200}
.rpill.rpill[data-k="news"]{background:#fce8f1;color:#8a1c4f}
.rpill.rpill[data-k="uit"]{background:#fff;color:#33373b;box-shadow:inset 0 0 0 1.5px #8a8f95}
/* /search cards */
.search-page .sr .sr-sec.rpill,.ftx-item .ty.rpill{font-size:16px;letter-spacing:.02em;text-transform:none;margin:0 0 8px}
.search-page .sr .sr-sec.rpill:not([data-k]){color:#44484d}
.search-page .sr{border-left:4px solid #c4c8cc}
.search-page .sr h3{color:#12203a}
.sr[data-k="service"],.ftx-item[data-k="service"]{border-left-color:#b00020}
.sr[data-k="service-guide"],.ftx-item[data-k="service-guide"]{border-left-color:#1d3f73}
.sr[data-k="hpc"],.ftx-item[data-k="hpc"]{border-left-color:#15788e}
.sr[data-k="hpc-software"],.ftx-item[data-k="hpc-software"]{border-left-color:#553487}
.sr[data-k="team"],.ftx-item[data-k="team"]{border-left-color:#2f7d4e}
.sr[data-k="story"],.ftx-item[data-k="story"]{border-left-color:#b07a00}
.sr[data-k="news"],.ftx-item[data-k="news"]{border-left-color:#a8316a}
.sr[data-k="uit"],.ftx-item[data-k="uit"]{border-left-color:#8a8f95}
.sr[data-k="page"],.ftx-item[data-k="page"]{border-left-color:#c4c8cc}
/* dropdowns: pills keep each dropdown's own label size */
.fpx-hits a > span.rpill{font-size:16px;padding:5px 10px}
#siteHits a .g.rpill{padding:5px 10px;letter-spacing:.02em;text-transform:none}
.fpx-hits a.ftx-h small .rpill,#siteHits a.ftx-h small .rpill{font-size:16px;padding:3px 8px;margin-right:6px}
/* ARIE sources */
.a-src a .rpill{display:table;margin:0 0 5px;font-size:16px;font-weight:700;text-transform:none;letter-spacing:.02em;padding:4px 9px}
@media (max-width:700px){.fpx-hits a > span.rpill{display:none}}


/* ===== Researcher spotlight (2026-09-27) =====
   Body markup: <div class="spx" data-field data-season data-who data-clusters
   data-poster data-duration data-video data-short> with .spx-sec sections.
   rci.theme _rci_spot_data() reads the data-* for cards; rci.js
   initSpotlight() runs the video facade and chapter links. */
.spx{--ink:#12203a;--mut:#4a5159;--line:#e3e6e9}
.spx-sec{padding:48px 0}
.spx-sec.alt{background:#f5f6f7}
.spx .eb{font:700 24px "Alumni Sans","Arial Narrow",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#990000;margin:0 0 6px}
.spx h2{font:800 44px/1.05 "Alumni Sans","Arial Narrow",sans-serif;color:var(--ink);margin:0 0 14px}
.spx p{font-size:20px;line-height:1.55;color:#33373b}
.spx-top{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:32px;align-items:start}
.spx-video{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#0c1a2e;box-shadow:0 18px 44px rgba(18,32,58,.22)}
.spx-video img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block}
.spx-video:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,18,36,0) 45%,rgba(8,18,36,.78) 100%)}
.spx-play{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:104px;height:104px;border-radius:50%;background:#990000;border:0;display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.35);z-index:2;cursor:pointer}
.spx-play svg{width:42px;height:42px;margin-left:6px;fill:#fff}
.spx-vcap{position:absolute;left:24px;right:24px;bottom:20px;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;color:#fff}
.spx-vcap b{display:block;font:800 30px/1.05 "Alumni Sans","Arial Narrow",sans-serif}
.spx-vcap span{font-size:18px;color:#dfe6ee}
.spx-badges{display:flex;gap:8px;flex:none}
.spx-badges i{font-style:normal;font:700 16px "Barlow Semi Condensed",sans-serif;background:rgba(255,255,255,.18);border:1.5px solid rgba(255,255,255,.55);border-radius:8px;padding:5px 9px;color:#fff}
.spx-chap{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 0;padding:0;list-style:none}
.spx-chap a{display:flex;gap:10px;align-items:baseline;background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-size:18px;color:var(--ink);text-decoration:none}
.spx-chap a b{font:700 16px "Barlow Semi Condensed",sans-serif;color:#0f5f70;font-variant-numeric:tabular-nums}
.spx-chap a:hover{border-color:#15788e}
.spx-facts{background:#fff;border:1px solid var(--line);border-top:5px solid #15788e;border-radius:16px;padding:22px 24px}
.spx-facts h3{font:800 28px "Alumni Sans","Arial Narrow",sans-serif;color:var(--ink);margin:0 0 12px}
.spx-facts dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 16px}
.spx-facts dt{font:700 16px "Alumni Sans","Arial Narrow",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#5f656b;padding-top:3px}
.spx-facts dd{margin:0;font-size:20px;line-height:1.35;color:#1f2933}
.spx-facts .big{display:flex;gap:12px;align-items:center;background:#fdf2dc;border-radius:12px;padding:12px 14px;margin:0 0 16px}
.spx-facts .big b{font:800 34px/1 "Alumni Sans","Arial Narrow",sans-serif;color:#7a5200}
.spx-facts .big span{font-size:18px;line-height:1.3;color:#5a4000}
.spx-facts .lk{display:inline-block;margin-top:16px;font-size:20px;font-weight:700;color:#990000}
.spx-two{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:start}
.spx-quote{margin:0;background:#12203a;color:#fff;border-radius:18px;padding:28px 30px;position:relative}
.spx-quote:before{content:"\201C";position:absolute;top:-6px;left:18px;font:800 110px/1 Georgia,serif;color:rgba(255,255,255,.14)}
.spx-quote p{color:#eef2f6;font-size:24px;line-height:1.45;margin:0 0 14px;position:relative}
.spx-quote cite{font-style:normal;font-size:18px;color:#c3ccd7}
.spx-tr{margin:26px 0 0;background:#fff;border:1px solid var(--line);border-radius:16px}
.spx-tr summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;padding:18px 22px;font:800 28px "Alumni Sans","Arial Narrow",sans-serif;color:var(--ink)}
.spx-tr summary span{font:600 18px "Barlow Semi Condensed",sans-serif;color:#0f5f70}
.spx-tr .body{padding:0 22px 20px}
.spx-tr .body p{margin:0 0 12px}
.spx-tr .body p b{color:#0f5f70;font-variant-numeric:tabular-nums;margin-right:8px}
.spx-tr .note{font-size:16px;color:#5f656b;margin:6px 0 0}
.spx-use{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}
.spx-use a{display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px;text-decoration:none;color:#1f2933}
.spx-use a:hover{border-color:#15788e}
.spx-use img{height:34px;width:auto;align-self:flex-start}
.spx-use b{font:800 26px "Alumni Sans","Arial Narrow",sans-serif;color:var(--ink)}
.spx-use span{font-size:18px;line-height:1.4;color:var(--mut)}
.spx-use i{font-style:normal;margin-top:auto;font-size:18px;font-weight:700;color:#990000}
.spx-more{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:22px}
.spx-card{display:block;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;color:#1f2933}
.spx-card .th{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,#1d3a66,#0c1a2e);display:grid;place-items:center}
.spx-card .th img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.spx-card .th .pl{position:relative;width:64px;height:64px;border-radius:50%;background:rgba(153,0,0,.92);display:grid;place-items:center}
.spx-card .th .pl svg{width:26px;height:26px;margin-left:4px;fill:#fff}
.spx-card .th .dur{position:absolute;right:10px;bottom:10px;background:rgba(8,18,36,.8);color:#fff;font:700 16px "Barlow Semi Condensed",sans-serif;border-radius:6px;padding:4px 8px}
.spx-card .th .soon{position:absolute;left:10px;top:10px;background:#fff;color:#12203a;font:700 16px "Barlow Semi Condensed",sans-serif;border-radius:999px;padding:5px 10px}
.spx-card .tx{padding:16px 18px 18px}
.spx-card .tx .rpill{margin:0 0 8px}
.spx-card h3{font:800 26px/1.1 "Alumni Sans","Arial Narrow",sans-serif;color:var(--ink);margin:0 0 6px}
.spx-card p{font-size:18px;line-height:1.4;color:var(--mut);margin:0}
@media (max-width:1000px){.spx-use,.spx-more{grid-template-columns:1fr 1fr}}
@media (max-width:900px){
 .spx-top,.spx-two,.spx-home{grid-template-columns:minmax(0,1fr)}
 .spx h2{font-size:35.4px}.spx .eb{font-size:22.2px}
 .spx-quote p{font-size:21px}
 .spx-vcap{left:14px;right:14px;bottom:12px}.spx-vcap b{font-size:20px}.spx-vcap span{font-size:16px}
 .spx-play{width:72px;height:72px}.spx-play svg{width:30px;height:30px}
 
 .spx-chap a{font-size:17px;padding:8px 13px}
}
@media (max-width:600px){.spx-use,.spx-more{grid-template-columns:minmax(0,1fr)}.spx-badges{display:none}.spx-vcap b{font-size:18px}.spx-tr summary{flex-wrap:wrap;gap:6px}}
.spx p{margin:0 0 14px}
.spx .spx-chap a,.spx .spx-chap a *,.spx a.spx-card,.spx a.spx-card *,.spx .spx-use a,.spx .spx-use a *,.spx .spx-home a,.spx .spx-home a *{text-decoration:none}
@media (max-width:600px){.spx-vcap b{display:none}.spx-play{top:50%}}

/* video facade: poster + play button until clicked, then a privacy-mode iframe */
.spx-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:3}
.spx-video.playing:after,.spx-video.playing .spx-vcap,.spx-video.playing .spx-play{display:none}
.spx-video.no-video .spx-play{width:auto;height:auto;border-radius:999px;padding:14px 22px;background:rgba(8,18,36,.72);cursor:default;font:700 20px "Barlow Semi Condensed",sans-serif;color:#fff;gap:10px;display:flex;align-items:center}
.spx-video.no-video .spx-play svg{width:22px;height:22px;margin:0}
.spx-video.no-video .spx-badges{display:none}
.spx-chap a[aria-disabled="true"]{cursor:default;opacity:.75}
.spx-chap a[aria-disabled="true"]:hover{border-color:var(--line)}
.spx-play:focus-visible{outline:4px solid #fff;outline-offset:3px}
/* Research in Action + story cards: video badge */
.story .visual .spot-dur{position:absolute;right:12px;bottom:12px;z-index:2;background:rgba(8,18,36,.82);color:#fff;font:700 16px "Barlow Semi Condensed",sans-serif;border-radius:8px;padding:5px 10px}
.story.is-spot .visual:after{content:"";position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(153,0,0,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M8 5l12 7-12 7z'/%3E%3C/svg%3E") 55% 50%/26px no-repeat;z-index:2}
/* home: spotlight card at the top of "Real research, powered by RCI" */
.fp-spot{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:#fff;border:1px solid #e3e6e9;border-left:5px solid #b07a00;border-radius:14px;overflow:hidden;text-decoration:none;color:#1f2933;margin-top:20px;box-shadow:0 6px 20px rgba(16,20,26,.06)}
.fp-spot:hover{box-shadow:0 10px 28px rgba(16,20,26,.12)}
.fp-spot .th{position:relative;min-height:210px;background:linear-gradient(135deg,#1d3a66,#0c1a2e);display:grid;place-items:center}
.fp-spot .th img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.fp-spot .pl{position:relative;width:64px;height:64px;border-radius:50%;background:rgba(153,0,0,.92);display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.3)}
.fp-spot .pl svg{width:26px;height:26px;margin-left:4px;fill:#fff}
.fp-spot .dur{position:absolute;right:10px;bottom:10px;background:rgba(8,18,36,.82);color:#fff;font:700 16px "Barlow Semi Condensed",sans-serif;border-radius:6px;padding:4px 8px}
.fp-spot .tx{display:flex;flex-direction:column;gap:8px;padding:20px 22px}
.fp-spot .fld{font:700 20px "Alumni Sans","Arial Narrow",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#7a5200}
.fp-spot b{font:800 28px/1.1 "Alumni Sans","Arial Narrow",sans-serif;color:#12203a}
.fp-spot .sm{font-size:20px;line-height:1.45;color:#4a5159}
@media (max-width:900px){.fp-spot{grid-template-columns:minmax(0,1fr)}.fp-spot .th{min-height:0;aspect-ratio:16/9}.fp-spot b{font-size:24px}}

/* ===== SecureWulf cluster page (.swx, 2026-09-27) =====
   Body markup in the /hpc/clusters/securewulf doc page, plus the SecureWulf
   card on the HPC service page and the "Also available" cards. Sizes follow
   the .is-hpc scale: body 20, labels 16+, card titles 24. */
.swx-soon{display:flex;gap:16px;align-items:flex-start;background:#eefafd;border:1px solid #bfe9f3;border-left:6px solid #12b3d4;border-radius:14px;padding:18px 22px;margin:0 0 30px}
.swx-soon img{width:120px;height:auto;flex:none}
.swx-soon b{display:block;font:800 26px/1.1 "Alumni Sans","Arial Narrow",sans-serif;color:#0b1c2f;margin:0 0 4px}
.swx-soon p{margin:0;font-size:20px;line-height:1.5;color:#1f2933}
.swx-three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:8px 0 12px}
.swx-three div{background:#fff;border:1px solid #e3e6e9;border-top:4px solid #12b3d4;border-radius:14px;padding:18px 18px 16px}
.swx-three i{font-style:normal;font-size:30px;line-height:1}
.swx-three b{display:block;font:800 24px/1.15 "Alumni Sans","Arial Narrow",sans-serif;color:#0b1c2f;margin:8px 0 6px}
.swx-three span{display:block;font-size:19px;line-height:1.45;color:#4a5159}
.swx-gpu{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:12px 0 10px}
.swx-gpu div{background:#fff;border:1px solid #e3e6e9;border-radius:14px;padding:16px 18px}
.swx-gpu b{display:block;font:800 24px/1.15 "Alumni Sans","Arial Narrow",sans-serif;color:#0b1c2f;margin:0 0 4px}
.swx-gpu span{font-size:19px;line-height:1.45;color:#4a5159}
.swx-note{font-size:18px;color:#5f656b;margin:6px 0 0}
table.swx-cmp{width:100%;border-collapse:collapse;margin:10px 0 8px}
table.swx-cmp th{background:#f5f6f7;text-align:left;padding:12px 14px;font:800 20px "Alumni Sans","Arial Narrow",sans-serif;color:#0b1c2f;border-bottom:2px solid #e3e6e9}
table.swx-cmp td{padding:12px 14px;border-bottom:1px solid #eef0f2;vertical-align:top;font-size:19px;line-height:1.45;color:#33373b}
table.swx-cmp tr.hl td{background:#eefafd}
table.swx-cmp td:first-child{font-weight:700;color:#0b1c2f;white-space:nowrap}
.swx .pill-soon,.pill-soon{display:inline-block;font:700 16px/1 "Barlow Semi Condensed",sans-serif;background:#0b1c2f;color:#fff;border-radius:999px;padding:6px 11px;vertical-align:middle;letter-spacing:.02em}
/* HPC service page: SecureWulf "coming" card beside the live cluster cards */
.hpx-cl.swx-card .hpx-live{background:#eefafd;border:1px solid #bfe9f3;border-radius:12px;padding:14px 16px;text-align:left}
.hpx-cl.swx-card .swx-when{display:block;font:800 24px/1.1 "Alumni Sans","Arial Narrow",sans-serif;color:#0b1c2f;margin:0 0 6px}
.hpx-cl.swx-card .swx-when + p{font-size:18px;line-height:1.4;color:#33373b;margin:0 0 10px}
@media (max-width:900px){.swx-three,.swx-gpu{grid-template-columns:minmax(0,1fr)}.swx-soon{flex-direction:column}.swx-soon img{width:100px}table.swx-cmp td:first-child{white-space:normal}}
@media (max-width:600px){table.swx-cmp,table.swx-cmp tbody,table.swx-cmp tr,table.swx-cmp td{display:block;width:100%}table.swx-cmp thead,table.swx-cmp tr:first-child:has(th){display:none}table.swx-cmp tr{border-bottom:1px solid #e3e6e9;padding:8px 0}table.swx-cmp td{border:0;padding:4px 10px}}
/* SecureWulf follow-up: glossary terms stay inline inside the feature cards; status pill on one line */
.swx .swx-three .gloss,.swx .swx-gpu .gloss{display:inline}
.pill-soon{white-space:nowrap}

/* Spotlight: self-hosted video clips (2026-09-28) */
.spx-video video{position:absolute;inset:0;width:100%;height:100%;z-index:3;background:#000;object-fit:contain;display:block}

/* Listen to this story (2026-09-28) */
.lsn{display:flex;align-items:center;flex-wrap:wrap;gap:12px 16px;background:#f7f8fa;border:1px solid #e3e6e9;border-radius:14px;padding:14px 18px;margin:0 0 28px}
.lsn-btn{display:inline-flex;align-items:center;gap:8px;background:var(--sbu-red,#990000);color:#fff;border:0;border-radius:999px;padding:10px 20px 10px 16px;font-weight:700;font-size:18px;line-height:1.2;font-family:inherit;cursor:pointer;min-height:44px}
.lsn-btn svg{width:20px;height:20px;fill:currentColor}
.lsn-btn:hover{background:#7a0000}
.lsn-btn:focus-visible,.lsn-speed button:focus-visible,.lsn-restart:focus-visible{outline:3px solid #15788e;outline-offset:2px}
.lsn-mid{flex:1 1 200px;min-width:0}
.lsn-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:16px;color:#33373b}
.lsn-top b{font-weight:700;color:#12203a}
.lsn-time{color:#5f656b;white-space:nowrap}
.lsn-bar{height:6px;background:#dfe3e7;border-radius:3px;margin-top:8px;overflow:hidden}
.lsn-bar i{display:block;height:100%;width:0;background:var(--sbu-red,#990000);transition:width .4s ease}
.lsn-speed{display:flex;gap:6px}
.lsn-speed button{font-weight:700;font-size:16px;line-height:1;font-family:inherit;border:1px solid #cfd4d9;background:#fff;color:#33373b;border-radius:8px;padding:10px 10px;min-width:52px;min-height:44px;cursor:pointer}
.lsn-speed button[aria-pressed="true"]{background:#12203a;border-color:#12203a;color:#fff}
.lsn-restart{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #cfd4d9;background:#fff;color:#33373b;border-radius:50%;cursor:pointer}
.lsn-restart svg{width:20px;height:20px}
.lsn-note{flex-basis:100%;margin:0!important;font-size:16px!important;line-height:1.4;color:#5f656b}
.lsn.is-playing{position:sticky;top:106px;z-index:30;box-shadow:0 10px 28px rgba(18,32,58,.14);background:#fff}
.lsn-on{background:#fff4cc;box-shadow:0 0 0 6px #fff4cc;border-radius:4px;transition:background .3s ease,box-shadow .3s ease}
@media (max-width:560px){.lsn{padding:14px}.lsn-mid{flex-basis:100%;order:3}.lsn-speed{margin-left:auto}}
@media (prefers-reduced-motion:reduce){.lsn-bar i,.lsn-on{transition:none}}

/* About: the four facts in one row under the intro (2026-10-04) */
.abx-facts-row{margin-top:30px}
.abx-facts-row .abx-facts{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0}
.abx-facts-row .abx-facts div{padding:20px 22px 18px}
@media (max-width:900px){.abx-facts-row .abx-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}}

/* ===== Patch (2026-10-05): side gutters for top-level .container.layout pages =====
   On service pages the template puts .container and .layout on the same element, and
   .layout's padding shorthand zeroed the container's 24px side padding, so below
   1228px wide the text ran to the screen edge. Nested layouts inside another
   container are left alone. */
@media (max-width:1228px){
  .container.layout:not(.container *){padding-left:24px;padding-right:24px}
}


/* ===== Documentation polish (2026-10-08) =====
   Every doc page (main.doc-page; main.dpx once js/rci.js has found its body). Same design, easier to read and move around:
   on-this-page rail with the current section marked, numbered steps, callout
   types, table and figure styling, image zoom, heading links, cluster tags in
   the hero, and a last-updated / feedback strip. The rail, zoom, links and
   strip are added by the "Documentation polish" block in js/rci.js; without
   JavaScript the pages read exactly as before. Nothing here is under 16px. */

main.dpx .content h2[id],
main.dpx .content h3[id] { scroll-margin-top: 100px; }

/* Section headings: a quiet rule above each h2 so long guides scan in chunks */
main.dpx .content > h2 { border-top: 1px solid var(--gray-200); padding-top: 30px; margin-top: 52px; }
main.dpx .content > h2:first-child,
main.dpx .content > .lede + h2,
main.dpx .content > .dpx-inline-toc + h2 { border-top: 0; padding-top: 0; margin-top: 36px; }

/* Heading links: a # appears on hover or keyboard focus */
main.dpx .dpx-anchor { margin-left: 10px; font-size: 0.8em; font-weight: 700; color: var(--gray-400); text-decoration: none !important; opacity: 0; transition: opacity .15s, color .15s; }
main.dpx :is(h2, h3):hover .dpx-anchor,
main.dpx .dpx-anchor:focus { opacity: 1; }
main.dpx .dpx-anchor:hover,
main.dpx .dpx-anchor:focus { color: var(--sbu-red); }
main.dpx .dpx-anchor.done::after { content: " Link copied"; font-size: 16px; font-weight: 600; color: #1c7c31; }

/* Lede reads as an intro */
main.dpx .content > .lede { font-size: 22px; line-height: 1.55; color: var(--ink); margin-bottom: 22px; }
@media (max-width: 600px) { main.dpx .content > .lede { font-size: 20px; } }

/* The inline "On this page" line becomes a row of chips */
main.dpx .dpx-inline-toc { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 0 0 26px; padding: 14px 18px; background: var(--gray-100); border-radius: var(--radius); font-size: 17px; }
main.dpx .dpx-inline-toc strong { font-size: 16px; text-transform: uppercase; letter-spacing: .08em; color: var(--gray-500); margin-right: 4px; }
main.dpx .dpx-inline-toc a { display: inline-block; padding: 4px 12px; border: 1px solid var(--gray-300); border-radius: 999px; background: #fff; color: var(--ink); font-weight: 600; text-decoration: none !important; line-height: 1.35; }
main.dpx .dpx-inline-toc a:hover { border-color: var(--sbu-red); color: var(--sbu-red); }

/* ---- On-this-page rail (wide screens) ---- */
main.dpx .dpx-toc { display: none; }
@media (min-width: 1200px) {
  main.dpx .dpx-grid { display: grid; grid-template-columns: minmax(0, 1fr) 248px; gap: 56px; align-items: start; }
  main.dpx .dpx-grid > .dpx-main { min-width: 0; }
  main.dpx .dpx-toc { display: block; position: sticky; top: 100px; max-height: calc(100vh - 124px); overflow-y: auto; padding: 4px 0 8px; }
  main.dpx .dpx-grid .dpx-inline-toc { display: none; }
}
main.dpx .dpx-toc h2 { font-size: 16px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: var(--sbu-red); margin: 0 0 12px; padding: 0; border: 0; }
main.dpx .dpx-toc ol { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--gray-200); }
main.dpx .dpx-toc li { margin: 0; }
main.dpx .dpx-toc a { display: block; margin-left: -2px; padding: 7px 0 7px 16px; border-left: 2px solid transparent; font-size: 17px; line-height: 1.35; color: var(--ink-soft); text-decoration: none !important; }
main.dpx .dpx-toc a:hover { color: var(--sbu-red); }
main.dpx .dpx-toc a.on { border-left-color: var(--sbu-red); color: var(--sbu-red); font-weight: 700; }
main.dpx .dpx-toc .dpx-top { display: inline-block; margin: 16px 0 0 16px; font-size: 16px; font-weight: 700; color: var(--gray-500); text-decoration: none !important; }
main.dpx .dpx-toc .dpx-top:hover { color: var(--sbu-red); }

/* ---- Numbered steps for plain ordered lists ---- */
main.dpx .content > ol:not([class]) { counter-reset: dpx; list-style: none; padding-left: 0; margin: 0 0 22px; }
main.dpx .content > ol:not([class]) > li { counter-increment: dpx; position: relative; padding: 2px 0 0 50px; margin-bottom: 16px; min-height: 34px; color: var(--ink-soft); }
main.dpx .content > ol:not([class]) > li::before { content: counter(dpx); position: absolute; left: 0; top: 0; width: 34px; height: 34px; border-radius: 50%; background: rgba(153, 0, 0, .08); color: var(--sbu-red); font-size: 17px; font-weight: 800; line-height: 34px; text-align: center; }

/* ---- Callouts: info (default), tip, and caution ---- */
main.dpx .callout { position: relative; background: #f4f6f9; border-left: 4px solid #12203a; border-radius: 0 var(--radius) var(--radius) 0; padding: 18px 22px 18px 62px; font-size: 19px; line-height: 1.55; }
main.dpx .callout::before { content: "i"; position: absolute; left: 20px; top: 18px; width: 26px; height: 26px; border-radius: 50%; background: #12203a; color: #fff; font: 800 17px/26px Georgia, serif; text-align: center; }
main.dpx .callout.dpx-tip { background: #effaf2; border-left-color: #1c7c31; }
main.dpx .callout.dpx-tip::before { content: "\2713"; background: #1c7c31; font: 800 16px/26px Arial, sans-serif; }
main.dpx .callout.dpx-warn { background: #fff8e8; border-left-color: #b36b00; }
main.dpx .callout.dpx-warn::before { content: "!"; background: #b36b00; font: 800 17px/26px Arial, sans-serif; }
main.dpx .callout > strong:first-child { color: var(--ink); }
main.dpx .callout a { overflow-wrap: anywhere; }
@media (max-width: 600px) {
  main.dpx .callout { padding: 16px 16px 16px 52px; }
  main.dpx .callout::before { left: 14px; top: 16px; }
}

/* ---- Tables ---- */
main.dpx .cmp-wrap { margin: 10px 0 28px; }
main.dpx .cmp-wrap > table { margin: 0 !important; }
main.dpx .cmp-wrap .hx-tbl { font-size: 18px; }
main.dpx .cmp-wrap .hx-tbl th { background: var(--gray-100); padding: 12px 16px; font-size: 16px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--ink); border-bottom: 1px solid var(--gray-300); }
main.dpx .cmp-wrap .hx-tbl td { padding: 12px 16px; border-bottom: 1px solid var(--gray-200); }
main.dpx .cmp-wrap .hx-tbl tbody tr:last-child td { border-bottom: 0; }
main.dpx .cmp-wrap .hx-tbl tbody tr:nth-child(even) td { background: #fbfbfc; }
main.dpx .cmp-wrap .hx-tbl tbody tr:hover td { background: #f4f6f9; }
main.dpx .cmp-wrap .hx-tbl td:first-child { color: var(--ink); font-weight: 600; }
main.dpx .cmp-wrap .cmp th { font-size: 16px; }
@media (max-width: 600px) {
  main.dpx .cmp-wrap .hx-tbl th,
  main.dpx .cmp-wrap .hx-tbl td { padding: 10px 12px; }
}

/* ---- Figures: numbered captions, click to enlarge ---- */
main.dpx .content figure { margin: 30px 0 36px; }
main.dpx .content figure img { border-radius: 10px; box-shadow: var(--shadow-md); cursor: zoom-in; }
main.dpx .content figcaption { text-align: left; font-size: 17px; line-height: 1.5; color: var(--gray-700); margin-top: 12px; padding-left: 14px; border-left: 3px solid var(--gray-300); }
main.dpx .content figcaption .dpx-fn { font-weight: 800; color: var(--ink); margin-right: 6px; }
.dpx-zoom { border: 0; padding: 0; background: transparent; max-width: 96vw; max-height: 94vh; overflow: visible; }
.dpx-zoom::backdrop { background: rgba(10, 15, 25, .82); }
.dpx-zoom img { display: block; max-width: 96vw; max-height: 82vh; width: auto; height: auto; border-radius: 8px; background: #fff; }
.dpx-zoom p { color: #fff; font-size: 17px; line-height: 1.45; margin: 10px 4px 0; max-width: 1100px; }
.dpx-zoom button { position: absolute; top: -48px; right: 0; border: 1px solid rgba(255, 255, 255, .5); background: rgba(0, 0, 0, .35); color: #fff; border-radius: 999px; padding: 6px 16px; font: 700 16px Arial, sans-serif; cursor: pointer; }

/* ---- FAQ / troubleshooting accordions ---- */
main.dpx .faq details[open] { border-color: var(--sbu-red); }
main.dpx .faq summary { font-size: 19px; }
main.dpx .faq .ans { font-size: 18px; }

/* ---- Related guides ---- */
main.dpx .hx-related { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 8px; }
main.dpx .hx-related a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border: 1px solid var(--gray-300); border-radius: var(--radius); background: #fff; font-size: 18px; font-weight: 700; color: var(--ink); text-decoration: none !important; box-shadow: var(--shadow-sm); }
main.dpx .hx-related a::after { content: "\2192"; color: var(--sbu-red); }
main.dpx .hx-related a:hover { border-color: var(--sbu-red); color: var(--sbu-red); }

/* ---- 16px floor on every doc page: "Applies to", sidebar titles, copy buttons, inline code ---- */
main.doc-page .side-card h4 { font-size: 16px; }
main.doc-page .code-copy,
main.doc-page .copybtn { font-size: 16px; }
main.doc-page .content code.inline { font-size: max(16px, .85em); overflow-wrap: anywhere; }
main.doc-page .content .meta-chip { font-size: 16px; }
.applies-note strong { font-size: 16px; }
.applies-note .meta-chip { font-size: 16px; padding: 4px 12px; }

/* Cluster tags in the hero, copied from "Applies to" */
.page-hero .dpx-applies { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 18px; font-family: var(--font); }
.page-hero .dpx-applies > span:first-child { font-size: 16px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .78); margin-right: 4px; }
.page-hero .dpx-applies .dpx-clu { font-size: 17px; font-weight: 700; color: #fff; padding: 4px 14px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .45); background: rgba(255, 255, 255, .12); }

/* ---- Last updated and feedback strip ---- */
main.dpx .dpx-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; margin-top: 40px; padding: 18px 22px; border: 1px solid var(--gray-300); border-radius: var(--radius); background: var(--gray-100); }
main.dpx .dpx-foot p { margin: 0; font-size: 18px; color: var(--ink-soft); }
main.dpx .dpx-foot .dpx-upd { font-size: 16px; color: var(--gray-500); display: block; margin-top: 2px; }
main.dpx .dpx-foot a.btn { white-space: nowrap; font-size: 17px; padding: 10px 18px; }
main.dpx .dpx-main .applies-note { margin-top: 28px; }

@media print {
  main.dpx .dpx-toc, main.dpx .dpx-foot, main.dpx .dpx-anchor { display: none !important; }
  main.dpx .dpx-grid { display: block !important; }
}