/* QDTU identity, shared by the home page and the inner pages. */
:root {
  --canvas: #f7f7f0;
  --surface: #fffefa;
  --ink: #18372b;
  --accent: #245f48;
  --subtle: #50685b;
  --line: #dce5da;
  --hero-paper: #eef0e4;
  --hero-glow: #e3ebce;
}

html[data-theme="dark"] {
  --canvas: #101d18;
  --surface: #192a23;
  --ink: #eff8ef;
  --accent: #b2dfaa;
  --subtle: #b5c9b8;
  --line: #35493d;
  --hero-paper: #1b352a;
  --hero-glow: #2a4b36;
}

header, html[data-theme="dark"] header {
  max-width: 1440px;
  padding: 16px clamp(18px,3.1vw,44px);
  margin-inline: auto;
}
header .brand { gap: 10px; }
header .brand-symbol { width: 41px; min-width: 41px; height: 45px; flex-basis: 41px; }
header nav a { font-size: 12px; line-height: 1.5; padding: 10px 0; }
header nav a.active::after { bottom: 2px; }
#account-link, html[data-theme="dark"] #account-link {
  color: var(--accent);
  background: color-mix(in srgb,var(--accent) 10%,var(--surface));
}
.settings-shortcut { min-height: 42px; padding: 10px 13px; }
header nav .nav-request { display: none; }
@media (min-width: 1120px) {
  header {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto auto;
    gap: 18px;
  }
  header > .brand { grid-column: 1; grid-row: 1; }
  header > nav { grid-column: 2; grid-row: 1; gap: 8px clamp(10px,1.35vw,24px); }
  header > .settings-shortcut { grid-column: 3; grid-row: 1; }
  header > .btn { grid-column: 4; grid-row: 1; }
}

.campus-masthead {
  grid-template-columns: minmax(0,1.06fr) minmax(0,.94fr);
  background: radial-gradient(ellipse at 10% 105%,var(--hero-glow),transparent 64%),var(--hero-paper);
  border: 1px solid var(--line);
  color: var(--ink);
  margin-top: 22px;
  padding: clamp(24px,3.65vw,54px);
  gap: clamp(22px,3.5vw,48px);
  border-radius: 28px;
}
.masthead-university { color: var(--ink); gap: 13px; }
.masthead-university img { border: 0; box-shadow: 0 0 0 4px var(--surface); }
.masthead-university strong { font-size: 13px; }
.masthead-university small, .masthead-lead { color: var(--subtle); }
.campus-masthead h1, html[data-theme="dark"] .campus-masthead h1 {
  color: var(--ink);
  font-size: clamp(40px,4.45vw,64px);
  line-height: 1.05;
  margin-block: 29px 18px;
  letter-spacing: -.058em;
}
.campus-masthead h1 em { color: var(--accent); }
.masthead-lead { font-size: 15px; max-width: 49ch; }
.masthead-media { border-radius: 19px; min-height: 385px; }
.masthead-media .masthead-photo { object-position: 52% 54%; }
.masthead-media::after { inset: 20% 0 0; background: linear-gradient(transparent,#112d279e); }
.masthead-media .masthead-live, html[data-theme="dark"] .masthead-media .masthead-live {
  inset: auto 14px 14px;
  max-width: 260px;
  backdrop-filter: blur(8px);
}
.masthead-actions .btn { background: #245f48; color: #fff; }
.masthead-actions .btn:hover { background: #184b37; }
.masthead-secondary { color: var(--accent); }
.campus-section-links, html[data-theme="dark"] .campus-section-links {
  border-radius: 14px;
  padding: 9px 19px;
  column-gap: 24px;
}
.campus-section-links a { display: inline-flex; align-items: center; min-height: 37px; font-size: 12px; }

.pathways { margin-top: clamp(42px,5.5vw,76px); }
.pathways .section-head .muted-heading { margin-left: 0; }
.section-head { align-items: end; }
.section-head h2, .page-hero h1 { letter-spacing: -.045em; }
.section-head > p { color: var(--subtle); }
.help-grid { gap: 13px; }
.help-grid .help, .help-grid .help:nth-child(-n+2), .help-grid .help:last-child,
html[data-theme="dark"] .help-grid .help {
  padding: 8px 8px 18px;
  border-radius: 17px;
  box-shadow: 0 5px 15px #122c220a;
}
.help-grid .help .help-art { border-radius: 11px; }
.help-grid .help .help-top { margin-bottom: 1px; }
.help-grid .help .arr { border-radius: 50%; }
.help-grid .help h3 { line-height: 1.32; }
.help-grid .help:first-child, html[data-theme="dark"] .help-grid .help:first-child {
  border-color: color-mix(in srgb,var(--accent) 46%,var(--line));
  background: color-mix(in srgb,var(--accent) 7%,var(--surface));
}

/* Keep listing, news, and account cards on the same palette. */
.card, .recent-card, .journey-card, .news-carousel,
html[data-theme="dark"] :is(.card,.recent-card,.journey-card,.news-carousel) {
  background: var(--surface);
  border-color: var(--line);
}
.card p, html[data-theme="dark"] .card p { color: var(--subtle); }
.page-hero:not(.settings-hero) {
  margin-top: 22px;
  padding: clamp(24px,4vw,48px);
  border: 1px solid var(--line);
  border-radius: 24px;
  background: linear-gradient(115deg,var(--hero-paper),var(--surface));
}
.page-hero:not(.settings-hero) h1 { margin-block: 14px 12px; }
.search, html[data-theme="dark"] .search {
  background: var(--surface);
  border-color: var(--line);
  color: var(--ink);
  min-height: 48px;
}
.chip.selected, html[data-theme="dark"] .chip.selected {
  background: #245f48;
  color: white;
  border-color: #245f48;
}
.news-carousel .news-art-fallback {
  background: radial-gradient(circle at 20% 20%,#ecf1cc,transparent 58%),linear-gradient(130deg,#d9e9d9,#cbdcc8);
  color: #245f48;
}
.news-carousel .news-art-fallback > i { color: #245f48; }
.impact-board { border-radius: 24px; }
.metric-grid .metric-card { border-radius: 16px; }
.btn, .settings-shortcut, .help, .setting-choice { outline-offset: 4px; }
.btn:focus-visible, .settings-shortcut:focus-visible, .help:focus-visible, .setting-choice:focus-visible {
  outline: 3px solid #61916e;
}

@media (max-width:760px) {
  header, html[data-theme="dark"] header {
    grid-template-columns: minmax(0,1fr) auto auto;
    gap: 9px;
    padding: 12px 16px;
  }
  header > .brand { min-width: 0; }
  header > .settings-shortcut { grid-column: 2; padding-inline: 10px; gap: 6px; }
  header > .menu { grid-row: 1; grid-column: 3; }
  header > .btn { display: none; }
  header > nav { grid-row: 2; grid-column: 1/-1; }
  header nav.open .nav-request { display: inline-flex; align-self: stretch; min-height: 44px; margin-block: 4px; }
  .campus-masthead { grid-template-columns: minmax(0,1fr); gap: 21px; padding: 23px 18px 18px; margin-top: 15px; border-radius: 23px; }
  .campus-masthead h1, html[data-theme="dark"] .campus-masthead h1 { font-size: clamp(34px,9vw,49px); margin-block: 23px 15px; }
  .masthead-university strong { font-size: 11px; }
  .masthead-university small { font-size: 10px; }
  .masthead-lead { font-size: 13px; }
  .masthead-media { min-height: 235px; border-radius: 14px; }
  .masthead-media .masthead-live, html[data-theme="dark"] .masthead-media .masthead-live { inset: auto 11px 11px; max-width: 199px; }
  .campus-section-links, html[data-theme="dark"] .campus-section-links { gap: 0 12px; padding: 8px 12px; }
  .campus-section-links a { font-size: 11px; }
  .section-head { align-items: start; }
  .page-hero:not(.settings-hero) { padding: 24px 19px; border-radius: 20px; margin-top: 16px; }
  .page-hero:not(.settings-hero) h1 { font-size: clamp(30px,8.4vw,44px); }
}
