/* «Оценка ИИ-зрелости» — язык формы семейства ДИИП-диагностик:
   бумага + точечная сетка, Lora/Golos, петроль. Палитра контуров валидирована
   dataviz-валидатором на фоне #F6F3EC (см. спеку 2026-07-14). */
:root{
  --paper:#F6F3EC;
  --paper-2:#EFEBE0;
  --card:#FFFFFF;
  --ink:#191B1E;
  --ink-soft:#4A4E54;
  --ink-mute:#8A8F96;
  --line:#DCD6C8;
  --accent:#175A5E;
  --accent-ink:#0E3C3F;
  --accent-soft:#E3ECEA;
  --brick:#A8432F;
  --ok:#2F7D5C;--ok-bg:#E2EFE7;
  --warn:#C08A1E;--warn-bg:#F6ECD6;
  --bad:#B3402E;--bad-bg:#F5E0DA;
  --na:#9AA0A6;--na-bg:#ECEDEE;
  /* метки контуров (для графики; текст всегда чернильный) */
  --c-business:#00939F;
  --c-operational:#B54732;
  --c-information:#3070A8;
  --c-culture:#8F6A10;
  --c-governance:#75539E;
  --prev:#8A8F96;
  --radius:14px;
  --serif:'Lora',Georgia,'Times New Roman',serif;
  --sans:'Golos Text',-apple-system,'Segoe UI',sans-serif;
  --shadow:0 1px 2px rgba(25,27,30,.05),0 8px 28px -12px rgba(25,27,30,.14);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);color:var(--ink);background:var(--paper);
  font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(rgba(23,90,94,.045) 1px,transparent 1px);
  background-size:26px 26px;
}
::selection{background:var(--accent);color:#fff}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.2;letter-spacing:-.01em}
button{font-family:inherit;font-size:inherit;cursor:pointer;color:inherit}
input,select{font-family:inherit;font-size:inherit;color:inherit}
a{color:var(--accent)}

.topbar{position:sticky;top:0;z-index:50;background:rgba(246,243,236,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.topbar-in{max-width:1140px;margin:0 auto;padding:13px 24px;display:flex;align-items:center;gap:14px}
.brand{display:flex;align-items:baseline;gap:10px;text-decoration:none;color:inherit}
.brand-mark{font-family:var(--serif);font-weight:700;font-size:17px;color:var(--paper);background:var(--accent);border-radius:8px;padding:2px 9px 4px;letter-spacing:.04em}
.brand-name{font-family:var(--serif);font-size:19px;font-weight:600}
.brand-sub{font-size:12.5px;color:var(--ink-mute)}
.topbar-right{margin-left:auto;display:flex;gap:8px}
@media(max-width:640px){.brand-sub{display:none}}

.wrap{max-width:1140px;margin:0 auto;padding:36px 24px 90px}

.btn{
  display:inline-flex;align-items:center;gap:8px;border:1px solid var(--ink);
  background:var(--ink);color:var(--paper);border-radius:999px;
  padding:10px 22px;font-weight:600;font-size:15px;transition:.16s;text-decoration:none;
}
.btn:hover{background:var(--accent);border-color:var(--accent);transform:translateY(-1px)}
.btn.primary{background:var(--accent);border-color:var(--accent)}
.btn.primary:hover{background:var(--accent-ink)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--ink);background:transparent;color:var(--ink);transform:translateY(-1px)}
.btn.small{padding:6px 14px;font-size:13.5px}
.btn:disabled{opacity:.4;cursor:not-allowed;transform:none}

/* ---------- интро ---------- */
.hero{padding:44px 0 36px;border-bottom:1px solid var(--line);margin-bottom:34px;animation:rise .4s ease both}
.hero .kicker{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:600;margin-bottom:14px}
.hero h1{font-size:clamp(32px,4.6vw,50px);max-width:17em}
.hero h1 em{font-style:italic;color:var(--accent)}
.hero .lead{margin-top:16px;max-width:46em;color:var(--ink-soft);font-size:17px}
.hero-stats{display:flex;gap:38px;margin-top:30px;flex-wrap:wrap}
.hstat b{display:block;font-family:var(--serif);font-size:32px;font-weight:700;color:var(--accent)}
.hstat span{font-size:13.5px;color:var(--ink-mute)}

.section-label{display:flex;align-items:center;gap:12px;margin:34px 0 16px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute);font-weight:600}
.section-label::after{content:'';flex:1;height:1px;background:var(--line)}

.intro-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:22px;align-items:start}
@media(max-width:840px){.intro-grid{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px 26px;box-shadow:var(--shadow);animation:rise .4s ease both}
.card h3{font-size:19px;margin-bottom:12px}
.howto{list-style:none}
.howto li{display:flex;gap:12px;padding:9px 0;border-top:1px dashed var(--line);font-size:14.5px;color:var(--ink-soft)}
.howto li:first-child{border-top:none;padding-top:0}
.howto .n{font-family:var(--serif);font-weight:700;color:var(--accent);flex-shrink:0}
.field{margin-bottom:18px}
.field label{display:block;font-weight:600;margin-bottom:7px;font-size:14.5px}
.field .hint{font-size:13px;color:var(--ink-mute);margin-top:5px}
.input,select.input{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--card);padding:11px 14px;font-size:15px;transition:.15s;outline:none}
.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(23,90,94,.12)}

.run-row{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:12px;background:var(--card);padding:13px 16px;margin-bottom:8px;font-size:14.5px;flex-wrap:wrap}
.run-row .date{font-weight:600}
.run-row .meta{color:var(--ink-mute);font-size:13px}
.run-row .spacer{flex:1}
.run-row .del{border:none;background:none;color:var(--ink-mute);font-size:16px;padding:4px 8px;border-radius:8px}
.run-row .del:hover{color:var(--bad);background:var(--bad-bg)}

.footer-note{margin-top:56px;padding-top:20px;border-top:1px solid var(--line);font-size:13px;color:var(--ink-mute);line-height:1.7}
.footer-note a{color:var(--accent)}

/* ---------- флоу ---------- */
.flow{display:grid;grid-template-columns:250px 1fr;gap:40px;align-items:start}
.flow>*{min-width:0}
@media(max-width:860px){.flow{grid-template-columns:1fr;gap:20px}}
.rail{position:sticky;top:84px;animation:rise .4s ease both}
@media(max-width:860px){.rail{position:static}}
.rail-contour{margin-bottom:14px}
.rail-contour .cname{display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.09em;text-transform:uppercase;font-weight:700;color:var(--ink-soft);margin-bottom:4px}
.cdot{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.rail-step{display:flex;gap:9px;align-items:center;padding:4.5px 8px;font-size:13.5px;color:var(--ink-mute);border:none;background:none;width:100%;text-align:left;border-radius:8px;transition:.13s}
.rail-step:hover{background:rgba(255,255,255,.7);color:var(--ink)}
.rail-step .dot{width:8px;height:8px;border-radius:50%;background:var(--line);flex-shrink:0;display:grid;place-items:center;font-size:0}
.rail-step.now{color:var(--ink);font-weight:600;background:var(--card);box-shadow:var(--shadow)}
.rail-step.now .dot{background:var(--accent);box-shadow:0 0 0 4px rgba(23,90,94,.14)}
.rail-step.done{color:var(--ink-soft)}
.rail-step.done .dot{background:var(--accent)}
.rail-step.skip .dot{background:var(--na)}
.rail-step .lv{margin-left:auto;font-size:11.5px;font-weight:700;color:var(--accent)}
.rail-step.skip .lv{color:var(--na)}
.rail-finish{margin-top:16px;width:100%;justify-content:center}
@media(max-width:860px){
  .rail-wrap{display:flex;gap:14px;overflow-x:auto;padding-bottom:8px}
  .rail-contour{min-width:200px}
}

.progress-track{height:4px;border-radius:99px;background:var(--paper-2);margin:0 0 26px;overflow:hidden}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),#2E8A80);border-radius:99px;transition:width .4s ease}
.flow-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.flow-head h2{font-size:clamp(23px,3.2vw,30px)}
.chip{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.flow-sub{color:var(--ink-mute);font-size:14px;margin-bottom:20px}

.qcard{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px 26px;box-shadow:var(--shadow);margin-bottom:16px;animation:rise .35s ease both}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.qcard h3{font-size:16px;margin-bottom:14px;color:var(--ink-soft);font-family:var(--sans);font-weight:600}

.lvl{width:100%;text-align:left;display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:14px 16px;transition:.14s;margin-bottom:8px}
.lvl:hover{border-color:var(--accent)}
.lvl.sel{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent)}
.lvl .lbadge{font-family:var(--serif);font-weight:700;font-size:15px;color:var(--accent);background:rgba(23,90,94,.08);border-radius:8px;padding:3px 9px;flex-shrink:0}
.lvl.sel .lbadge{color:var(--paper);background:var(--accent)}
.lvl .lt b{display:block;font-size:15.5px;margin-bottom:2px}
.lvl .lt span{font-size:13.5px;color:var(--ink-soft);line-height:1.45;display:block}
.lvl details{margin-top:8px}
.lvl summary{font-size:12.5px;color:var(--accent);cursor:pointer;font-weight:600;list-style:none}
.lvl summary::before{content:'↳ '}
.lvl details p{font-size:13.5px;color:var(--ink-soft);margin-top:6px;line-height:1.55;border-left:2px solid var(--line);padding-left:12px}

.checks{border-top:1px dashed var(--line);margin-top:16px;padding-top:16px}
.checks .ct{font-size:13px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:10px}
.check-row{display:flex;gap:11px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;background:var(--card);padding:10px 13px;cursor:pointer;transition:.13s;margin-bottom:7px;font-size:14px;line-height:1.45}
.check-row:hover{border-color:var(--accent)}
.check-row.on{border-color:var(--accent);background:var(--accent-soft)}
.check-row input{margin-top:3px;accent-color:var(--accent);width:16px;height:16px;flex-shrink:0}

.nudge{border-radius:12px;padding:14px 16px;background:var(--warn-bg);border:1px solid rgba(192,138,30,.35);font-size:14px;margin-top:12px;animation:rise .3s ease both}
.nudge b{display:block;margin-bottom:4px}
.nudge .btns{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}

.teaser{border-radius:12px;padding:14px 16px;background:var(--accent-soft);border:1px solid rgba(23,90,94,.22);font-size:14px;margin-top:12px;color:var(--accent-ink)}
.teaser .tt{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px;opacity:.75}
.teaser b{font-family:var(--serif);font-size:15.5px}

.flow-nav{display:flex;gap:10px;margin-top:22px;align-items:center;flex-wrap:wrap}
.flow-nav .spacer{flex:1}

.finish-list{list-style:none;margin:14px 0 4px}
.finish-list li{display:flex;gap:10px;padding:6px 0;font-size:14.5px;border-top:1px dashed var(--line)}
.finish-list li:first-child{border-top:none}
.finish-list b{min-width:34px;text-align:right}

/* ---------- дашборд ---------- */
.res-head{padding:6px 0 24px;border-bottom:1px solid var(--line);margin-bottom:8px;animation:rise .4s ease both}
.res-head .kicker{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:10px}
.res-head h1{font-size:clamp(28px,4.2vw,42px)}
.res-head .sub{color:var(--ink-soft);margin-top:9px;font-size:15px}
.res-actions{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.res-section{margin:40px 0;animation:rise .45s ease both}
.res-section>h2{font-size:clamp(21px,2.8vw,28px);margin-bottom:6px}
.res-section>.lead{color:var(--ink-soft);font-size:14.5px;margin-bottom:18px;max-width:58em}

.radar-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:14px;align-items:start}
.radar-side{align-self:center}
.radar-side:has(.focus-card){align-self:start}
@media(max-width:840px){.radar-card{grid-template-columns:1fr}}
.radar-side{min-width:0}
.radar-side .focus-card{margin:0;padding:16px 18px;box-shadow:none;border-left-width:4px}
.radar-side .focus-card h3{font-size:17px}
.radar-side .now{font-size:13.5px}
.radar-side .next-box{padding:12px 13px;font-size:13px}
.side-back{margin-bottom:10px}
.radar-svg{width:100%;height:auto;display:block}
.radar-legend{display:flex;flex-direction:column;gap:10px;font-size:13.5px;color:var(--ink-soft);padding:0 8px}
.radar-legend .li{display:flex;align-items:center;gap:9px}
.radar-legend svg{flex-shrink:0}
.radar-legend .cl{display:flex;align-items:center;gap:8px}
.radar-tip{position:fixed;z-index:90;background:var(--ink);color:var(--paper);border-radius:9px;padding:8px 12px;font-size:13px;line-height:1.45;max-width:260px;pointer-events:none;box-shadow:var(--shadow)}
.radar-tip b{display:block}
.radar-tip .tl{opacity:.75}
.radar-poly{animation:polyIn .8s ease both}
@keyframes polyIn{from{opacity:0}to{opacity:1}}

.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:15px 16px;border-top:3px solid var(--na)}
.tile .tn{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft)}
.tile .val{font-family:var(--serif);font-size:29px;font-weight:700;margin-top:6px}
.tile .val small{font-size:15px;color:var(--ink-mute);font-weight:400}
.tile .delta{font-size:12.5px;font-weight:700;border-radius:6px;padding:2px 8px;display:inline-block;margin-top:6px}
.tile .delta.up{background:var(--ok-bg);color:var(--ok)}
.tile .delta.downd{background:var(--bad-bg);color:var(--bad)}
.tile .delta.same{background:var(--na-bg);color:var(--na)}
.tile .cover{font-size:12px;color:var(--ink-mute);margin-top:5px}

.focus-card{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:var(--radius);padding:22px 24px;margin-bottom:14px;box-shadow:var(--shadow)}
.focus-card .fh{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.focus-card h3{font-size:20px}
.focus-card .now{font-size:14.5px;color:var(--ink-soft);margin-bottom:12px}
.focus-card .now .lb{font-weight:700;color:var(--ink)}
.next-box{border-radius:12px;background:var(--accent-soft);border:1px solid rgba(23,90,94,.2);padding:14px 16px;font-size:14px;color:var(--accent-ink)}
.next-box .tt{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.75;margin-bottom:4px}
.next-box b{font-family:var(--serif);font-size:16px}
.next-box ul{list-style:none;margin-top:10px}
.next-box li{padding:4px 0 4px 0;display:flex;gap:9px;font-size:13.5px}
.next-box li::before{content:'☐';opacity:.6}

.callout{border-radius:var(--radius);padding:16px 20px;font-size:14.5px;line-height:1.6;background:var(--paper-2);border:1px solid var(--line);color:var(--ink-soft);margin:16px 0}

.matrix-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow)}
.matrix{border-collapse:collapse;width:100%;min-width:660px}
.matrix th{font-size:12px;color:var(--ink-mute);font-weight:600;padding:11px 14px;border-bottom:1px solid var(--line);background:var(--paper-2);text-align:left;text-transform:uppercase;letter-spacing:.06em}
.matrix td{padding:10px 14px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:top}
.matrix tr:last-child td{border-bottom:none}
.matrix .lcell{font-family:var(--serif);font-weight:700;white-space:nowrap}
.matrix .na{color:var(--na)}

.cta-panel{background:var(--accent);color:var(--paper);border-radius:var(--radius);padding:28px 30px;display:flex;gap:20px;align-items:center;flex-wrap:wrap;box-shadow:var(--shadow)}
.cta-panel h2{font-size:clamp(20px,2.6vw,26px);color:var(--paper)}
.cta-panel p{font-size:14px;opacity:.85;margin-top:6px;max-width:36em}
.cta-panel .spacer{flex:1}
.cta-panel .btn{background:var(--paper);color:var(--accent-ink);border-color:var(--paper)}
.cta-panel .btn:hover{background:#fff;transform:translateY(-1px)}
.cta-panel .btn.ghost{background:transparent;color:var(--paper);border-color:rgba(246,243,236,.5)}
.cta-panel .btn.ghost:hover{border-color:var(--paper)}

.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--paper);border-radius:999px;padding:10px 22px;font-size:14px;z-index:99;box-shadow:var(--shadow);animation:rise .25s ease both}

@media print{
  .topbar,.res-actions,.cta-panel,.btn,.radar-legend .hint{display:none!important}
  body{background:#fff;font-size:13px}
  .wrap{max-width:100%;padding:0}
  .res-section{margin:22px 0;break-inside:avoid-page}
  .radar-card{box-shadow:none;grid-template-columns:1fr 200px}
  .card,.tile,.focus-card,.matrix-scroll{box-shadow:none}
  .matrix-scroll{overflow:visible}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}