.documentation {
    --docs-accent: #b13236;
    --docs-text: #303030;
    --docs-muted: #667276;
    --docs-card: #ffffff;
    color: var(--docs-text);
    padding: 8px 0 40px;
}
.documentation *, .documentation *::before, .documentation *::after { box-sizing: border-box; }
.documentation a { text-decoration: none; }
.documentation__section + .documentation__section { margin-top: 42px; }
.documentation__section-head { display:flex; align-items:center; gap:11px; margin-bottom:17px; }
.documentation__section-title { margin:0; padding:0; color:var(--docs-text); font-size:25px; line-height:1.2; font-weight:800; letter-spacing:-.02em; }
.documentation__counter { display:inline-flex; min-width:29px; height:29px; align-items:center; justify-content:center; padding:0 8px; border-radius:10px; color:var(--docs-accent); background:rgba(177,50,54,.08); font-size:13px; font-weight:800; }
.documentation__list { display:grid; gap:12px; }
.documentation__document { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:22px; align-items:center; min-height:96px; padding:16px 18px; border:1px solid transparent; border-radius:17px; background:var(--docs-card); box-shadow:0 12px 34px rgba(26,38,45,.05); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.documentation__document:hover { border-color:rgba(177,50,54,.14); box-shadow:0 20px 48px rgba(26,38,45,.09); transform:translateY(-2px); }
.documentation__document-main { display:flex; align-items:center; gap:17px; min-width:0; color:var(--docs-text); }
.documentation__document-main:focus-visible { outline:2px solid rgba(177,50,54,.25); outline-offset:4px; border-radius:12px; }
.documentation__file-icon { position:relative; display:flex; width:58px; height:64px; flex:0 0 58px; align-items:center; justify-content:center; border-radius:14px; color:#606b6f; background:#eef3f4; }
.documentation__file-icon--pdf { color:var(--docs-accent); background:rgba(177,50,54,.075); }
.documentation__file-icon svg { width:31px; height:31px; transform:translateY(-6px); }
.documentation__file-icon > span { position:absolute; right:6px; bottom:6px; left:6px; overflow:hidden; color:currentColor; font-size:9px; line-height:1; font-weight:900; letter-spacing:.05em; text-align:center; text-overflow:ellipsis; }
.documentation__document-content { display:block; min-width:0; }
.documentation__document-title { display:block; color:var(--docs-text); font-size:16px; line-height:1.45; font-weight:700; transition:color .25s ease; overflow-wrap:anywhere; }
.documentation__document-main:hover .documentation__document-title { color:var(--docs-accent); }
.documentation__document-meta { display:block; margin-top:7px; color:#7b868a; font-size:13px; line-height:1.3; font-weight:500; }
.documentation__actions { display:flex; align-items:center; gap:9px; }
.documentation__action { display:inline-flex; min-height:42px; align-items:center; justify-content:center; gap:8px; padding:0 14px; border:1px solid rgba(48,48,48,.1); border-radius:12px; font-size:13px; line-height:1; font-weight:750; transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, color .2s ease; }
.documentation__action svg { width:18px; height:18px; flex:0 0 18px; }
.documentation__action--open { color:var(--docs-text); background:#fff; }
.documentation__action--open:hover { color:var(--docs-accent); border-color:rgba(177,50,54,.2); }
.documentation__action--download { color:#fff; border-color:var(--docs-accent); background:var(--docs-accent); box-shadow:0 8px 20px rgba(177,50,54,.16); }
.documentation__action--download:hover { color:#fff; transform:translateY(-1px); box-shadow:0 12px 24px rgba(177,50,54,.23); }
.documentation__footer-action { margin-top:28px; }
.documentation__back { display:inline-flex; min-height:46px; align-items:center; gap:9px; padding:0 17px; border:1px solid rgba(48,48,48,.1); border-radius:14px; color:var(--docs-text); background:#fff; font-size:14px; font-weight:750; box-shadow:0 10px 28px rgba(26,38,45,.045); transition:transform .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease; }
.documentation__back svg { width:19px; height:19px; transform:rotate(180deg); }
.documentation__back:hover { color:var(--docs-accent); border-color:rgba(177,50,54,.18); box-shadow:0 14px 34px rgba(26,38,45,.08); transform:translateY(-2px); }
@media (max-width: 767px) {
    .documentation { padding-bottom:24px; }
    .documentation__section + .documentation__section { margin-top:32px; }
    .documentation__section-title { font-size:22px; }
    .documentation__document { grid-template-columns:1fr; gap:14px; padding:16px; }
    .documentation__actions { padding-left:75px; }
    .documentation__action { flex:1 1 auto; }
}
@media (max-width: 560px) {
    .documentation__document-main { align-items:flex-start; gap:13px; }
    .documentation__file-icon { width:52px; height:58px; flex-basis:52px; }
    .documentation__document-title { font-size:15px; }
    .documentation__actions { padding-left:0; display:grid; grid-template-columns:1fr 1fr; }
    .documentation__action { width:100%; }
    .documentation__back { width:100%; justify-content:center; }
}