:root {
  --ink: #17202b;
  --navy: #0f2d4c;
  --blue: #2384c6;
  --muted: #607080;
  --line: #d7e0e8;
  --soft: #f4f8fb;
  --accent: #0b5ed7;
  --accent-dark: #084298;
}
body {
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 80% 28rem, rgba(35, 132, 198, .18), transparent 32rem),
    linear-gradient(180deg, #fbfdff 0%, #eef4f8 100%);
}
.site-frame { max-width: 1160px; }
.announcement {
  background: linear-gradient(90deg, var(--blue), var(--navy));
  color: #fff;
  font-weight: 800;
  font-size: .92rem;
}
.announcement a { color: #fff; text-decoration-thickness: .09em; }
.site-nav {
  background: #fff;
  box-shadow: 0 .8rem 2rem rgba(15, 45, 76, .08);
}
.brand-mark {
  display: inline-grid;
  width: 3.1rem;
  height: 3.1rem;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: var(--blue);
  font-weight: 900;
  font-size: 1.25rem;
}
.brand-name { color: var(--navy); font-size: 1.05rem; line-height: 1.05; }
.nav-link { color: #001a3c; font-weight: 800; }
.nav-link:hover,
.nav-link.active { color: var(--blue); }
.btn { border-radius: .55rem; font-weight: 700; }
.btn-primary { background: var(--accent); border-color: var(--accent); }
.btn-primary:hover { background: var(--accent-dark); border-color: var(--accent-dark); }
.section-label {
  color: var(--accent);
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.solution-hero { padding-block: 4.5rem 2rem; }
.solution-hero h1 {
  max-width: 16ch;
  color: var(--navy);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.45rem, 5.7vw, 5rem);
  line-height: .98;
  font-weight: 900;
}
.panel {
  background: rgba(255, 255, 255, .94);
  border: 1px solid rgba(215, 224, 232, .92);
  border-radius: .75rem;
  box-shadow: 0 1rem 2.5rem rgba(23, 32, 43, .08);
}
.detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.detail-list { color: var(--muted); padding-left: 1.15rem; }
.detail-list li + li { margin-top: .45rem; }
@media (max-width: 767.98px) {
  .navbar-brand span:last-child { max-width: 15rem; white-space: normal; line-height: 1.15; }
  .detail-grid { grid-template-columns: 1fr; }
  .solution-hero h1 { max-width: 12ch; font-size: clamp(2.4rem, 12vw, 4rem); }
}
