:root {
  --cm-primary: #316fe8;
  --cm-primary-dark: #1f56c2;
  --cm-teal: #21a7a0;
  --cm-violet: #7664dc;
  --cm-ink: #15325b;
  --cm-body: #40536f;
  --cm-muted: #708198;
  --cm-border: #dce7f2;
  --cm-surface: #ffffff;
  --cm-soft: #f3f8fd;
  --cm-radius: 20px;
  --cm-shadow: 0 18px 50px rgba(38, 83, 135, 0.1);
}

html { scroll-behavior: smooth; }

body {
  min-height: 100vh;
  color: var(--cm-body);
  background: #f8fbfe;
  font-family: "Noto Sans SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  line-height: 1.7;
}

a { color: var(--cm-primary); }
a:hover { color: var(--cm-primary-dark); }
h1, h2, h3, h4, h5, h6 { color: var(--cm-ink); font-weight: 750; }

.site-nav {
  background: rgba(255, 255, 255, 0.94);
  border-bottom: 1px solid rgba(220, 231, 242, 0.85);
  backdrop-filter: blur(16px);
}

.navbar-brand { color: var(--cm-ink); font-weight: 800; letter-spacing: -0.02em; }
.brand-mark {
  display: inline-grid;
  width: 34px;
  height: 34px;
  margin-right: 9px;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, var(--cm-primary), var(--cm-teal));
  border-radius: 11px;
  box-shadow: 0 7px 18px rgba(49, 111, 232, 0.22);
}

.nav-link { color: #40506a; font-weight: 600; }
.nav-link:hover, .nav-link:focus { color: var(--cm-primary); }

.site-main { min-height: calc(100vh - 160px); padding: 38px 0 64px; }
.page-shell { padding-top: 12px; }

.btn {
  border-radius: 12px;
  font-weight: 700;
  padding: 0.68rem 1.15rem;
}
.btn-primary {
  border-color: var(--cm-primary);
  background: var(--cm-primary);
  box-shadow: 0 8px 22px rgba(49, 111, 232, 0.2);
}
.btn-primary:hover, .btn-primary:focus {
  border-color: var(--cm-primary-dark);
  background: var(--cm-primary-dark);
  transform: translateY(-1px);
}
.btn-outline-primary { color: var(--cm-primary); border-color: #a9c4f5; }
.btn-outline-secondary { color: #56677e; border-color: #cbd8e5; }

.card, .list-group-item, .section-card {
  border: 1px solid var(--cm-border);
  border-radius: var(--cm-radius);
  background: var(--cm-surface);
  box-shadow: 0 10px 32px rgba(45, 83, 124, 0.06);
}
.card-body { padding: 1.5rem; }
.list-group { gap: 12px; }
.list-group-item { margin-bottom: 0; }

.form-control, .form-select {
  min-height: 48px;
  border-color: #cddbe8;
  border-radius: 12px;
  background-color: #fff;
}
.form-control:focus, .form-select:focus {
  border-color: #74a2ef;
  box-shadow: 0 0 0 0.24rem rgba(49, 111, 232, 0.12);
}
.form-label { color: var(--cm-ink); font-weight: 700; }
.form-text, .text-muted { color: var(--cm-muted) !important; }
.form-check-input:checked { border-color: var(--cm-primary); background-color: var(--cm-primary); }

.alert { border: 0; border-radius: 14px; }
.badge { border-radius: 999px; padding: 0.5em 0.75em; }

.hero {
  position: relative;
  overflow: hidden;
  padding: clamp(42px, 7vw, 84px);
  border: 1px solid #dceafa;
  border-radius: 30px;
  background:
    radial-gradient(circle at 82% 18%, rgba(118, 100, 220, 0.15), transparent 18%),
    radial-gradient(circle at 68% 72%, rgba(33, 167, 160, 0.13), transparent 24%),
    linear-gradient(120deg, #f5fbff 0%, #edf7ff 58%, #f7f5ff 100%);
  box-shadow: var(--cm-shadow);
}
.hero h1 {
  max-width: 720px;
  margin-bottom: 18px;
  font-size: clamp(2.25rem, 5.3vw, 4.65rem);
  line-height: 1.08;
  letter-spacing: -0.045em;
}

.hero h1 span { display: block; }
.hero-subtitle {
  color: var(--cm-teal);
  font-size: clamp(1.25rem, 2.5vw, 2rem);
  font-weight: 800;
}
.hero-copy { max-width: 620px; margin: 22px 0 30px; font-size: 1.08rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-art { position: relative; min-height: 330px; }
.campus-orbit {
  position: absolute;
  inset: 8% 4% 2% 8%;
  border: 2px solid rgba(49, 111, 232, 0.2);
  border-radius: 50%;
}
.campus-orbit::before, .campus-orbit::after {
  position: absolute;
  content: "";
  border-radius: 50%;
}
.campus-orbit::before { width: 90px; height: 90px; top: -20px; left: 15%; background: rgba(118, 100, 220, 0.2); }
.campus-orbit::after { width: 120px; height: 120px; right: -10px; bottom: 8%; background: rgba(33, 167, 160, 0.2); }
.campus-building {
  position: absolute;
  right: 13%;
  bottom: 9%;
  width: 68%;
  height: 56%;
  border: 3px solid #477be2;
  border-radius: 14px 14px 3px 3px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 16px 18px 0 rgba(49, 111, 232, 0.08);
}
.campus-building::before {
  position: absolute;
  width: 28%;
  height: 72%;
  left: 36%;
  bottom: 0;
  content: "";
  border: 3px solid #477be2;
  border-bottom: 0;
  border-radius: 60px 60px 0 0;
}
.campus-building::after {
  position: absolute;
  width: 18%;
  height: 76%;
  left: 41%;
  bottom: 100%;
  content: "";
  border: 3px solid #477be2;
  border-bottom: 0;
  background: rgba(255, 255, 255, 0.78);
}

.section-space { margin-top: clamp(54px, 8vw, 90px); }
.section-heading { max-width: 680px; margin-bottom: 28px; }
.section-heading p { margin-bottom: 0; color: var(--cm-muted); }
.feature-card { height: 100%; padding: 26px; }
.feature-icon {
  display: grid;
  width: 58px;
  height: 58px;
  margin-bottom: 22px;
  place-items: center;
  border-radius: 18px;
  font-size: 1.55rem;
  font-weight: 850;
}
.feature-icon.teal { color: #167f7a; background: #e0f7f4; }
.feature-icon.blue { color: #2867d8; background: #e6efff; }
.feature-icon.violet { color: #6551cd; background: #eeebff; }
.feature-card h3 { font-size: 1.25rem; }

.trust-panel {
  padding: clamp(28px, 5vw, 52px);
  border: 1px solid #d7e7f7;
  border-radius: 26px;
  background: linear-gradient(120deg, #eef7ff, #f6f9ff);
}
.trust-list { display: grid; gap: 15px; margin: 0; padding: 0; list-style: none; }
.trust-list li { position: relative; padding-left: 28px; color: var(--cm-ink); font-weight: 650; }
.trust-list li::before {
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 9px;
  height: 9px;
  content: "";
  border-radius: 50%;
  background: var(--cm-primary);
}

.auth-wrap { max-width: 560px; margin: 20px auto 0; }
.auth-card { padding: clamp(24px, 5vw, 42px); }
.auth-card + .auth-card { margin-top: 18px; }
.auth-intro { margin-bottom: 28px; }

.privacy-page section { padding: 24px 0; border-bottom: 1px solid var(--cm-border); }
.privacy-page section:last-child { border-bottom: 0; }
.privacy-page h2 { font-size: 1.28rem; }

.site-footer { padding: 32px 0; color: var(--cm-muted); border-top: 1px solid var(--cm-border); background: #fff; }
.site-footer a { color: var(--cm-muted); text-decoration: none; }
.site-footer a:hover { color: var(--cm-primary); }

@media (max-width: 991.98px) {
  .hero-art { min-height: 260px; margin-top: 18px; }
  .navbar-collapse { padding: 14px 0 6px; }
  .navbar-nav { gap: 4px; }
}

@media (max-width: 575.98px) {
  .site-main { padding-top: 22px; }
  .hero { padding: 32px 22px; border-radius: 22px; }
  .hero h1 { font-size: 2.35rem; }
  .hero-art { min-height: 210px; }
  .hero-actions .btn { width: 100%; }
  .card-body, .feature-card { padding: 21px; }
  .input-group { flex-direction: column; }
  .input-group > .form-control, .input-group > .btn { width: 100%; border-radius: 12px !important; }
  .input-group > .btn { margin-top: 8px; }
}