.static-page {
  --brand-navy: #F1F6F4;
  --brand-blue: #8F9C96;
  --brand-muted: #6b7280;
  --brand-line: rgba(52, 221, 160, 0.14);
  --brand-bg-soft: rgba(52, 221, 160, 0.14);
  --brand-link-bright: #34DDA0;
  --brand-blue-mid: #34DDA0;
}

/* Sidebar */
.sidebar-title {
  font-size: 12px;
  letter-spacing: 0.18em;
  color: var(--brand-link-bright);
}

.sidebar-list {
  border-left: 1px solid var(--brand-line);
}

.sidebar-link {
  display: block;
  margin-left: -1px;
  padding: 6px 0 6px 16px;
  border-left: 2px solid transparent;
  font-size: 13.5px;
  line-height: 20px;
  color: var(--brand-muted);
  transition: color 0.15s;
  text-decoration: none;
}
.sidebar-link:hover {
  color: var(--brand-navy);
  background: transparent;
}
.sidebar-link.active {
  border-left-color: var(--brand-blue-mid);
  font-weight: 600;
}

/* Desktop sidebar width */
@media (min-width: 992px) {
  .col-lg-auto[style*="--sidebar-w"] {
    width: 260px;
    flex: 0 0 260px;
  }
  .content-col {
    max-width: 760px;
  }
}

/* Mobile TOC */
.mobile-toc {
  margin-left: -.75rem;
  margin-right: -.75rem;
  padding: 0.75rem 1.25rem;
  backdrop-filter: blur(10px);
}
@media (min-width: 576px) {
  .mobile-toc { margin-left: -2rem; margin-right: -2rem; padding-left: 2rem; padding-right: 2rem; }
}
.mobile-toc-btn {
  height: 40px;
  border-radius: 10px;
}

/* Content */
.content-section {
  scroll-margin-top: 120px;
  margin-top: 3rem;
}
.content-section:first-of-type { margin-top: 0; }

.section-title {
  font-weight: 600;
  font-size: 24px;
  line-height: 32px;
  color: var(--brand-navy);
}
@media (min-width: 576px) {
  .section-title { font-size: 28px; line-height: 36px; }
}

.sub-title {
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
  color: var(--brand-navy);
  margin-top: 0.5rem;
  margin-bottom: 0.75rem;
}

.section-body {
  margin-top: 1rem;
  font-size: 16px;
  line-height: 26px;
  color: var(--brand-blue);
}
.section-body p { margin-bottom: 1rem; }
.section-body ul.list-disc {
  padding-left: 1.25rem;
  margin-bottom: 1rem;
}
.section-body ul.list-disc li { margin-bottom: 0.5rem; }
.section-body ul.list-disc li::marker { color: var(--brand-link-bright); }
.section-body a { color: var(--brand-link-bright); }

/* Copy link button */
.copy-link-btn {
  width: 32px; height: 32px;
  font-size:13px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  color: var(--brand-muted);
  opacity: 0.4;
  text-decoration: none;
}
  
.copy-link-btn:hover,
.copy-link-btn:focus-visible {
  color: var(--brand-link-bright);
  background: var(--brand-bg-soft);
  opacity: 1;
}
.content-section:hover .copy-link-btn,
.copy-link-btn:focus-visible {
  opacity: 1;
}

/* состояние «скопировано» */
.copy-link-btn.is-copied {
  color: var(--brand-link-bright);
  background: var(--brand-bg-soft);
  opacity: 1;
}
  
.reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;              /* толщина полосы */
  z-index: 1080;            /* выше шапки, ниже offcanvas (1045→1080 ок) */
  background: transparent;
  pointer-events: none;     /* не мешает кликам */
}

.reading-progress__bar {
  height: 100%;
  width: 0%;
  background: linear-gradient(to right, rgba(52, 221, 160, 0.5), #34DDA0);
  transition: width .08s linear;  /* плавно, но почти мгновенно */
  will-change: width;
}

/* Уважаем настройку "меньше движения" */
@media (prefers-reduced-motion: reduce) {
  .reading-progress__bar { transition: none; }
}

/* Firefox */
.sidebar-nav {
  scrollbar-width: thin;
  scrollbar-color: #34DDA0 rgba(255,255,255, 0);
}

/* WebKit */
.sidebar-nav::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.sidebar-nav::-webkit-scrollbar-track {
  background: rgba(255,255,255, 0);
  border-radius: 5px;
}

.sidebar-nav::-webkit-scrollbar-thumb {
  background: #34DDA0;
  border-radius: 5px;
}

.sidebar-nav::-webkit-scrollbar-thumb:hover {
  background: #34DDA0;
}

.sidebar-nav::-webkit-scrollbar-button {
  display: none;
}