/* VL: стаття бази знань у стилі сторінок проєктів (v3, 24.10.2026) */
.vlart-on article.row{display:none!important}
.vlart-on main.container>ul.breadcrumb{display:none}
#vlart{--ink:#1e1e1e;--mut:#6b7178;--line:#e3e5e8;--acc:#d4572a;--bg2:#f4f5f6;color:var(--ink);margin:0 0 72px}
#vlart *{box-sizing:border-box}
#vlart .k{font-size:11px;line-height:1.4;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
#vlart .v3-hero{display:grid;grid-template-columns:5fr 7fr;min-height:440px;margin:0 calc(50% - 50vw);width:100vw}
#vlart .v3-hl{background:var(--bg2);display:flex;flex-direction:column;justify-content:flex-end;padding:48px 48px 48px max(16px,calc(50vw - 690px))}
#vlart .v3-crumb{margin-bottom:auto;padding-bottom:24px}
#vlart .v3-crumb a{color:var(--mut);text-decoration:none}
#vlart .v3-crumb a:hover{color:var(--ink)}
#vlart h1.va-t{font-size:36px;line-height:1.15;letter-spacing:-.015em;font-weight:500;margin:14px 0 16px;text-wrap:balance}
#vlart .v3-lead{font-size:16px;line-height:1.6;font-weight:300;color:#3a3d41;margin:0 0 20px;max-width:520px}
#vlart .v3-meta{font-size:13px;color:var(--mut);display:flex;flex-wrap:wrap;gap:4px 16px}
#vlart .v3-hr{position:relative;overflow:hidden;background:#ddd}
#vlart .v3-hr img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#vlart .v3-key{max-width:1100px;margin:0 auto;padding:26px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px 28px}
#vlart .v3-key div{text-align:center}
#vlart .v3-key b{display:block;font-size:15px;line-height:1.35;font-weight:500;margin-top:6px}
#vlart .v3-nav{position:sticky;top:78px;z-index:5;background:#fff;border-bottom:1px solid var(--line);margin:0 calc(50% - 50vw);width:100vw}
#vlart .v3-bar{max-width:1100px;margin:0 auto;padding:0 16px;display:flex;align-items:center;gap:18px;min-height:52px}
#vlart .v3-tg{border:1px solid var(--line);background:#fff;padding:8px 14px;font-size:13px;font-weight:500;color:var(--ink);cursor:pointer;flex:0 0 auto;transition:border-color .2s}
#vlart .v3-tg:hover,#vlart .v3-tg[aria-expanded="true"]{border-color:var(--ink)}
#vlart .v3-cur{flex:1 1 auto;min-width:0;font-size:13px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#vlart .v3-cta{flex:0 0 auto;background:var(--ink);color:#fff!important;font-size:13px;padding:10px 16px;text-decoration:none!important;transition:background .2s}
#vlart .v3-cta:hover{background:#000}
#vlart .v3-list{list-style:none;margin:0 auto;padding:8px 16px 16px;max-width:1100px;columns:2;column-gap:40px;max-height:60vh;overflow:auto}
#vlart .v3-list li{break-inside:avoid}
#vlart .v3-list a{display:flex;gap:12px;padding:8px 0;font-size:14px;line-height:1.4;color:var(--mut);text-decoration:none;border-bottom:1px solid var(--line)}
#vlart .v3-list a span{font-size:11px;letter-spacing:.1em;font-weight:500;padding-top:2px;color:#9aa0a6}
#vlart .v3-list a:hover,#vlart .v3-list a.on{color:var(--ink)}
#vlart .v3-list a.on span{color:var(--acc)}
#vlart .va-body{max-width:760px;margin:56px auto 0;font-size:16px;line-height:1.7;font-weight:300}
#vlart .va-body>*:first-child{margin-top:0}
#vlart .va-body p{margin:0 0 1.1em;text-wrap:pretty}
#vlart .va-body h2{font-size:26px;line-height:1.25;font-weight:500;text-align:center;margin:2.4em 0 .9em;scroll-margin-top:140px;text-wrap:balance}
#vlart .va-body h2 .n{display:block;font-size:11px;letter-spacing:.14em;color:var(--mut);margin-bottom:10px;font-weight:500}
#vlart .va-body h3{font-size:19px;font-weight:500;margin:1.8em 0 .5em}
#vlart .va-body ul,#vlart .va-body ol{padding-left:1.3em;margin:0 0 1.2em}
#vlart .va-body li{margin-bottom:.45em}
#vlart .va-body li::marker{color:var(--acc)}
#vlart .va-body strong,#vlart .va-body b{font-weight:500}
#vlart .va-body a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--acc);text-underline-offset:3px}
#vlart .va-body a:hover{color:var(--acc)}
#vlart a:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
#vlart .va-body img{max-width:100%!important;height:auto!important}
#vlart .va-body figure{margin:2.2em -170px;max-width:none}
#vlart .va-body figcaption{font-size:12px!important;color:#7d838b;margin-top:10px}
#vlart .va-body table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:14px;font-variant-numeric:tabular-nums;display:block;overflow-x:auto}
#vlart .va-body th{font-weight:500;text-align:left;background:var(--bg2);padding:10px 12px;border:0;border-bottom:1px solid var(--line)}
#vlart .va-body td{padding:10px 12px;border:0;border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:top}
#vlart .va-body td:first-child{white-space:normal}
#vlart .v3-auth{max-width:760px;margin:56px auto 0;padding:22px 24px;background:var(--bg2);display:flex;gap:18px;align-items:flex-start}
#vlart .v3-auth .ic{flex:0 0 44px;height:44px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:13px;letter-spacing:.05em}
#vlart .v3-auth p{margin:4px 0 0;font-size:14px;line-height:1.55;color:#3a3d41}
#vlart .va-rel{max-width:1100px;margin:72px auto 0}
#vlart .va-rel .hd{text-align:center;margin-bottom:24px}
#vlart .va-rel h2{font-size:26px;font-weight:500;margin:10px 0 0}
#vlart .va-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
#vlart .va-card{display:block;color:var(--ink);text-decoration:none}
#vlart .va-card .im{aspect-ratio:16/10;background:var(--bg2);overflow:hidden;margin-bottom:12px}
#vlart .va-card img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
#vlart .va-card:hover img{transform:scale(1.03)}
#vlart .va-card .n{font-size:16px;line-height:1.35;font-weight:500}
#vlart .va-card:hover .n{color:var(--acc)}
#vlart-bar{position:fixed;left:0;top:0;height:2px;width:0;background:#d4572a;z-index:1001;pointer-events:none}
@media (max-width:1150px){#vlart .va-body figure{margin-left:0;margin-right:0}}
@media (max-width:991px){#vlart .v3-hero{grid-template-columns:1fr}#vlart .v3-hr{aspect-ratio:16/10;order:-1}#vlart .v3-hl{padding:28px 16px}#vlart .v3-nav{top:56px}#vlart .v3-nav ol{justify-content:flex-start}#vlart .va-cards{grid-template-columns:1fr 1fr}}
@media (max-width:767px){#vlart h1.va-t{font-size:27px}#vlart .v3-crumb{display:none}#vlart .v3-key{grid-template-columns:1fr 1fr;padding:20px 0;gap:16px}#vlart .v3-key div{text-align:left}#vlart .va-body{margin-top:36px}#vlart .va-body h2{font-size:22px}
 #vlart .va-cards{display:block}#vlart .va-card{display:grid;grid-template-columns:104px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}#vlart .va-card .im{margin:0;aspect-ratio:4/3}#vlart .va-card .n{font-size:15px}}
@media (max-width:767px){#vlart .v3-list{columns:1}#vlart .v3-cta{padding:9px 12px;font-size:12px}#vlart .v3-bar{gap:10px}}
/* поки скрипт будує сторінку, стара розкладка не показується (страховка: через 2,5 с показується як є) */
body.blog-blog:not(.vlart-on):has(ul.breadcrumb a[href*="/baza-znaniy/"]) article.row{visibility:hidden;animation:vlshow 0s linear 2.5s forwards}
@keyframes vlshow{to{visibility:visible}}
