/* Campus Pocus: a quiet touch of wonder around the existing study tools. */
:root {
  --cp-amethyst: #756198;
  --cp-amethyst-deep: #665184;
  --cp-lilac: #eee8f5;
  --cp-gold: #b39863;
  --st-paper: #faf9f5;
  --paper: var(--st-paper);
}

body {
  background-color: var(--st-paper);
  background-image: radial-gradient(ellipse 620px 350px at 83% 160px, #eee8f56b, transparent 75%);
  background-repeat: no-repeat;
}

.st-site-header {
  background: #faf9f5f5;
  border-bottom-color: #e1e3dc;
}

.st-site-header-inner { gap: 22px; }
.st-brand {
  gap: 9px;
  font-size: 28px;
  letter-spacing: -1.15px;
  white-space: nowrap;
  text-decoration: none;
  flex-shrink: 0;
}
.cp-brand-mark {
  display: block;
  width: 40px;
  height: 40px;
  flex: none;
}
.st-brand .cp-wordmark { display: inline-block; }
.st-brand .cp-wordmark b { color: var(--cp-amethyst); font-weight: inherit; }
.cp-brand-dot { color: var(--cp-gold); }
.st-header-profile {
  border-color: #dcd3e6;
  background: #f1edf657;
}
.st-header-profile > svg { color: var(--cp-amethyst); }
.st-header-profile:hover { background: var(--cp-lilac); border-color: #b9a8cc; }

.st-intro { position: relative; isolation: isolate; }
.st-intro h1 em { color: var(--cp-amethyst-deep); }
.cp-intro-eyebrow { display: flex; align-items: center; gap: 8px; }
.cp-tiny-spark {
  display: inline-block;
  color: var(--cp-gold);
  font-size: 17px;
  line-height: 1;
}
.st-intro-note.cp-magic-note {
  width: 264px;
  min-height: 168px;
  padding: 37px 0 12px 28px;
  border-left-color: #e0d9e7;
  transform: none;
  color: #59634e;
}
.cp-magic-note > span { position: relative; }
.cp-magic-note strong { color: var(--cp-amethyst-deep); }
.cp-magic-note p { color: #687164; }
.cp-constellation {
  position: absolute;
  top: -20px;
  right: -8px;
  width: 154px;
  height: 77px;
  pointer-events: none;
  overflow: visible;
}
.cp-orbit { stroke: #d8cde5; stroke-width: 1; stroke-dasharray: 2 6; }
.cp-star { fill: #eee7f5; stroke: #9a84b7; stroke-width: 1.15; }
.cp-star-small { fill: #f4f0f8; stroke: #b4a2cb; }
.cp-star-gold { fill: #eee4cf; stroke: var(--cp-gold); }
.cp-dust { fill: #baa579; stroke: none; }

.st-search-bar {
  border-color: #d9d5df;
  box-shadow: 0 5px 26px #75619808;
}
.st-search-bar:focus-within {
  border-color: #b49cc9;
  box-shadow: 0 0 0 3px #a88ac31a, 0 6px 25px #75619809;
}
.st-search-input svg { color: #807193; }
.st-search-submit { box-shadow: 0 2px 6px #284f3d14; }
.st-quick-chip[data-quick="biotechnology"],
.st-quick-chip[data-quick="neuroscience"] {
  background: #f3eff8;
  border-color: #e3daed;
  color: #6d5b85;
}
.st-quick-chip[data-quick="biotechnology"]:hover,
.st-quick-chip[data-quick="neuroscience"]:hover { background: #eae1f3; }
.st-program-card:hover {
  border-color: #c4b5d2;
  box-shadow: 0 8px 26px #7561980b;
}
.st-discovery-footer {
  background: linear-gradient(110deg, #eef1e6, #efebf4 75%, #f4eee2);
  border: 1px solid #e4dfe8;
}
.st-discovery-footer .st-eyebrow { color: var(--cp-amethyst-deep); }
.st-home-tools [data-view="profile"] svg { color: var(--cp-amethyst); }
.st-footer { border-top-color: #ded9e4; }
.st-footer-top .cp-brand-mark { width: 31px; height: 31px; }
.st-footer-top .st-brand { font-size: 24px; }

@media (min-width: 701px) and (max-width: 1120px) {
  .st-site-header-inner { gap: 18px; }
  .st-brand { font-size: 25px; gap: 7px; }
  .cp-brand-mark { width: 35px; height: 35px; }
  .st-header-profile { width: 44px; min-width: 44px; padding: 10px; }
  .cp-profile-label { display: none; }
  .st-desktop-nav { gap: 17px; }
  .st-intro { gap: 25px; }
  .st-intro-note.cp-magic-note { width: 225px; padding-left: 22px; }
}

@media (min-width: 701px) and (max-width: 800px) {
  .st-site-header-inner { gap: 12px; }
  .st-brand { font-size: 22px; gap: 5px; }
  .cp-brand-mark { width: 32px; height: 32px; }
  .st-desktop-nav { gap: 10px; }
  .st-desktop-nav button { font-size: 12px; }
}

@media (max-width: 700px) {
  body { background-image: radial-gradient(ellipse 330px 270px at 95% 105px, #eee8f566, transparent 85%); }
  .st-site-header { background: #faf9f5f7; }
  .st-site-header-inner { gap: 12px; }
  .st-brand { font-size: 25px; letter-spacing: -1px; gap: 6px; }
  .cp-brand-mark { width: 34px; height: 34px; }
  .st-header-profile { width: 44px; min-width: 44px; padding: 10px; }
  .cp-profile-label { display: none; }
  .cp-intro-eyebrow { gap: 6px; }
  .cp-tiny-spark { font-size: 14px; }
  .st-intro-note.cp-magic-note { display: none; }
  .st-mobile-nav { background: #faf9f5f5; border-top-color: #ded9e4; }
  .st-mobile-nav button.active { background: #eee8f4; color: var(--cp-amethyst-deep); }
  .st-footer-top .st-brand { font-size: 23px; }
}

@media (prefers-reduced-motion: no-preference) {
  .cp-brand-mark { transition: transform .2s ease; }
  .st-brand:hover .cp-brand-mark { transform: rotate(-5deg); }
  .cp-star-main { transform-origin: 103px 31px; animation: cp-arrive 1.7s ease-out both; }
  @keyframes cp-arrive {
    0% { opacity: .45; transform: scale(.82); }
    55% { opacity: 1; transform: scale(1.06); }
    100% { opacity: 1; transform: scale(1); }
  }
}

@media (prefers-reduced-motion: reduce) {
  .cp-star-main, .cp-brand-mark { animation: none; transition: none; transform: none; }
}
