/* Palette and typography inspired by https://pages-themes.github.io/architect/.
   Keep the existing navigation, responsive layout and pricing semantics. */
body {
  --nav-accent: #2879d0;
  --heading-font: "Architects Daughter", "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: #666;
  background: #fafafa;
}
button, input, select, textarea { font-family: inherit; }
a { color: #2879d0; }
a:hover { color: #2268b2; }
.sidebar { background: #f7f9fc; border-right-color: #dbe7f3; }
.sidebar-brand {
  font-family: var(--heading-font);
  color: white;
  background-color: #2e7bcf;
  background-image: linear-gradient(#ffffff09 1px, transparent 1px), linear-gradient(90deg, #ffffff09 1px, transparent 1px);
  background-size: 20px 20px;
  margin: -34px -20px 0;
  padding: 36px 32px;
  border-bottom: 1px solid #275da1;
  font-weight: 500;
}
.sidebar-brand span { color: #c9ecff; }
.nav-label { color: #738397; }
.sidebar .tab-btn { color: #596a7e; font-weight: 400; }
.sidebar .tab-btn:hover { color: #2268b2; background: #edf4fb; }
.sidebar .tab-btn.active { color: #2268b2; background: #e3effb; box-shadow: inset 3px 0 #2e7bcf; font-weight: 600; }
.page-title, .section-title, .cost-heading h2 { font-family: var(--heading-font); color: #474747; font-weight: 500; }
.page-title::before { content: "/"; color: #9ddcff; margin-right: 10px; font-family: var(--heading-font); }
.section-title { border-left-color: #9ddcff; }
.search-input:focus { box-shadow: 0 0 0 3px #2879d014; }
.table-wrapper, .price-meta { border: 1px solid #e5eaf0; box-shadow: 0 1px 2px #273f5910; }
.data-table th, .price-table thead, .ds-table thead { background: #f2f8fc; color: #474747; }
.data-table th { border-bottom-color: #dbe7f3; font-weight: 500; }
.ds-table th.ds-model, .price-card { background: #f8fbfe; color: #474747; }
.price-meta strong, .price-card a, .ds-table summary { color: #2879d0; }
.pm-badge { color: #2268b2; background: #e8f3fd; }
.new-badge { background: #2e7bcf; }
.ds-table .capability-group { background: #e3effb; color: #2268b2; }
.ds-table .capability-cell { background: #f5faff; }
.cost-open { color: #2268b2; background: #eef6fe; border-color: #c4ddf4; }
.cost-open:hover { background: #dfefff; border-color: #2879d0; }
.cost-totals div { background: #edf5fd; }
.cost-totals strong { color: #2268b2; font-variant-numeric: tabular-nums; }
.cost-dialog input:focus, .cost-dialog select:focus, .capability-toggle:focus-visible, .ds-table-wrapper:focus-visible { outline-color: #2879d0; }
.footer { color: #888; border-top-color: #e5eaf0; }
/* Preserve purple as a distinct channel marker for original-provider supply. */
.subnav { margin: 0 0 18px 25px; padding-left: 14px; border-left: 1px solid #dbe7f3; }
.subnav-link { display: block; padding: 9px 12px; margin: 3px 0; border-radius: 7px; color: #596a7e; font-size: 14px; text-decoration: none; }
.subnav-link:hover { background: #edf4fb; }
.subnav-link.active { color: #2268b2; background: #e3effb; font-weight: 600; }
.subnav-link:focus-visible { outline: 2px solid #2879d0; outline-offset: 2px; }
@media (max-width: 1000px) {
  .sidebar-brand { margin: -26px -12px 0; padding: 28px 24px; }
}
@media (max-width: 600px) {
  .sidebar-brand { margin: -22px -8px 0; padding: 22px 8px; }
  .sidebar .tab-btn span { white-space: normal; overflow-wrap: anywhere; font-size: 10px; line-height: 1.4; }
  .subnav { margin: 0 0 16px; padding-left: 0; border-left: 0; }
  .subnav-link { padding: 9px 1px; text-align: center; font-size: 10px; }
}