/* Наследуем базовые токены из base.css и слегка адаптируем под документы */
:root{
  --text-color:rgba(255,255,255,.7);
}

/* ==== ССЫЛКИ ТОЛЬКО ДЛЯ ТЕКСТОВОГО КОНТЕНТА ДОКУМЕНТОВ ==== */
.content a,
.content a:link,
.content a:visited{
  color:#1e40ff;
  text-decoration:underline;
}

.content a:hover,
.content a:focus-visible{
  color:#ffffff;
  text-decoration:underline;
  outline:0;
}

/* ==== КОМПОНЕНТНЫЕ ССЫЛКИ (кнопки меню слева, "назад" и т.п.) ==== */
.link,
.link:link,
.link:visited{
  text-decoration:none;
  color:var(--text-color);
}

.link.small{
  padding:8px 12px;
  font-size:14px;
  border:1px solid var(--stroke);
  font-weight:500;
}

.link:hover,
.link:focus-visible{
  background:#fff;
  color:#1e40ff;
  text-decoration:none;
}

.link.active{
  background:rgba(30,64,255,.1);
  border-color:#1e40ff;
  color:#1e40ff;
}

/* Ссылка "← Вернуться на главную" */
.back-link .link,
.back-link .link:link,
.back-link .link:visited{
  text-decoration:none;
}

.main{padding:var(--space-xl)}
.document{max-width:800px;margin:0 auto}

.doc-header{text-align:center;margin-bottom:var(--space-xl);padding-bottom:var(--space-lg);border-bottom:2px solid var(--stroke)}
.doc-title{font-size:48px;line-height:1.1;margin:0 0 16px;font-weight:900;letter-spacing:-.02em}
.doc-meta{color:var(--muted);font-size:16px;font-weight:600}

.content{font-size:18px;line-height:1.7}
.content h2{font-size:28px;margin:var(--space-md) 0 var(--space-md);color:var(--heading-color);font-weight:800}
.content h3{font-size:22px;margin:var(--space-lg) 0 var(--space-sm);color:var(--heading-color);font-weight:700}
.content p{margin:0 0 var(--space-md)}
.content ul{margin:var(--space-sm) 0 var(--space-md);padding-left:24px}
.content li{margin-bottom:8px}
.content strong{color:var(--heading-color)}

.section{margin-bottom:var(--space-xl);padding:var(--space-lg);border:2px solid var(--stroke);border-radius:var(--radius);background:rgba(255,255,255,.02)}
.section:target{border-color:#1e40ff;background:rgba(30,64,255,.05)}

.highlight{background:rgba(30,64,255,.1);border:2px solid #1e40ff;padding:var(--space-md);border-radius:var(--radius);margin:var(--space-md) 0}
.highlight p{margin:0;color:var(--heading-color)}

.nav{display:flex;flex-direction:column;gap:var(--gap2)}
.nav-section{margin-bottom:var(--gap2);display:flex;flex-direction:column;gap:var(--gap2)}
.nav-section h4{margin:0 0 12px;font-size:14px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-weight:700}

.back-link{margin-top:auto}

/* Логотип как на главной (лево, без растяжения) */
.logo{display:flex;justify-content:flex-start;align-items:flex-start;gap:0}
.logo-img{display:block;height:54px;width:auto;max-width:100%}
@media (max-width:1080px){ .logo-img{height:54px} }

/* Прогресс-бар уже в base.css, просто используется */
footer{margin-top:var(--space-xxl);padding-top:var(--space-lg);border-top:2px solid var(--stroke);text-align:center;color:var(--muted);font-size:14px}

@media (max-width:1080px){
  .grid{grid-template-columns:1fr}
  .side{position:relative;height:auto}
  .main{padding:var(--space-lg)}
  .doc-title{font-size:36px}
  .content{font-size:16px}
  .content h2{font-size:24px}
  .content h3{font-size:20px}
}
