/* Навігатор «Що робити» 2.0 — підключається лише на /navigator/*. Токени — з umbrella.css. */
.nx-head{padding-bottom:30px}
.nx-head>.wrap+.wrap::after{display:none}
.nx-headin{display:grid;gap:8px}
.nx-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--label);font-weight:600;font-size:.8125rem;letter-spacing:.06em;text-transform:uppercase;color:var(--deep);background:#F1EFFD;border-radius:100px;padding:6px 12px 6px 8px}
.nx-tag .ic{width:20px;height:20px;display:inline-flex}.nx-tag .ic svg{width:20px;height:20px}
.nx-head h1{max-width:24ch}
.nx-head .callout{max-width:760px}
.nx-jump{position:sticky;top:64px;z-index:5;display:flex;gap:8px;flex-wrap:wrap;margin-top:22px;padding:10px 0;background:linear-gradient(#fff 70%,rgba(255,255,255,0))}
.nx-jump a{font-size:.875rem;font-weight:600;color:var(--txt2);border:1px solid var(--line2);border-radius:100px;padding:7px 14px;text-decoration:none;transition:background .2s,color .2s,border-color .2s}
.nx-jump a:hover,.nx-jump a.on{background:var(--txt);border-color:var(--txt);color:#fff}
.nx-sec h2{font-family:var(--head);font-weight:800;font-size:clamp(1.5rem,3vw,2.125rem);letter-spacing:-.01em;margin:0}
.nx-sh{margin-bottom:22px}.nx-sh .nv-sub{margin-top:8px;color:var(--txt2);max-width:62ch}
.nx-tint{background:linear-gradient(180deg,#FAF9FE,#fff)!important}
.nx-h3{font-family:var(--head);font-weight:800;font-size:1.125rem;margin:34px 0 14px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* кроки */
.nx-steps{counter-reset:s;list-style:none;padding:0;margin:0;display:grid;gap:12px;position:relative}
.nx-steps::before{content:"";position:absolute;left:27px;top:28px;bottom:28px;width:2px;border-radius:2px;background:linear-gradient(var(--deep),var(--pulse),var(--heat));opacity:.35}
.nx-steps li{counter-increment:s;position:relative;padding:18px 20px 16px 74px;background:#fff;border:1px solid var(--line);border-radius:16px;max-width:none}
.nx-steps li::before{content:counter(s);position:absolute;left:12px;top:14px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-family:var(--head);font-weight:800;font-size:.9375rem;color:#fff;background:var(--field,linear-gradient(135deg,#5B4BE0,#FF4D6D,#FFB23E));box-shadow:0 0 0 6px #fff}
.nx-steps li p{margin:0;color:var(--txt);max-width:none;line-height:1.6}
.nx-src{display:inline-flex;align-items:center;gap:4px;margin-top:8px;font-size:.8125rem;color:var(--txt3);text-decoration:none;border-bottom:1px dashed var(--line2)}
.nx-src:hover{color:var(--deep);border-color:var(--deep)}
.nx-srcline{font-size:.8125rem;color:var(--txt3);margin-top:14px}.nx-srcline a{color:var(--txt3)}

/* як говорити */
.nx-pairs{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.nx-pair{border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#fff;display:flex;flex-direction:column}
.nx-pair p{margin:0;padding:14px 18px 14px 50px;position:relative;line-height:1.55;max-width:none}
.nx-pair p>span:first-child{position:absolute;left:16px;top:13px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.8125rem}
.nx-pair .do{background:#EEF9F2}.nx-pair .do>span:first-child{background:#2E9E5B;color:#fff}
.nx-pair .dont{background:#FFF1F3;border-top:1px solid #FBD9DF;flex:1}.nx-pair .dont>span:first-child{background:#E0405E;color:#fff}

/* права */
.nx-rights{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.nx-right{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px 20px}
.nx-right .ic{display:inline-flex;width:36px;height:36px;border-radius:10px;background:#F1EFFD;color:var(--deep);align-items:center;justify-content:center;margin-bottom:10px}
.nx-right .ic svg{width:20px;height:20px}.nx-right p{margin:0;line-height:1.55;max-width:none}

/* гарячі лінії */
.nx-hls{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.nx-hl{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px;display:flex;flex-direction:column;gap:6px;max-width:none!important;margin:0!important;transition:transform .2s,box-shadow .2s}
.nx-hl:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.nx-hl[hidden]{display:none}
.nx-ph{display:flex;gap:8px;flex-wrap:wrap}
.nx-ph .tel{font-family:var(--head);font-weight:800;font-size:clamp(1.0625rem,1.6vw,1.25rem);overflow-wrap:anywhere;color:var(--txt);text-decoration:none;letter-spacing:.01em}
.nx-ph .tel:hover{color:var(--deep)}
.nx-hl b{font-size:.9375rem}.nx-hl p{margin:0;font-size:.875rem;color:var(--txt2);line-height:1.5;max-width:none}
.nx-hl small{font-size:.8125rem;color:var(--txt3)}.nx-url{font-size:.8125rem;color:var(--txt3);margin-top:auto}

/* чипи-фільтри */
.nx-chips,.nx-who-f{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px}
.nx-chip{display:inline-flex;align-items:center;gap:8px;font:600 .875rem/1 var(--label);color:var(--txt2);background:#fff;border:1px solid var(--line2);border-radius:100px;padding:9px 14px;cursor:pointer;transition:all .2s}
.nx-chip i{width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 20%,transparent)}
.nx-chip.on{background:var(--txt);border-color:var(--txt);color:#fff}
.nx-chip:not(.on) i{opacity:.35}
.nx-chip:focus-visible{outline:3px solid var(--deep);outline-offset:2px}

/* мапа */
.nx-mapgrid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,1fr);gap:18px;align-items:start}
.nx-canvas{position:relative;aspect-ratio:1040/708.1;background:radial-gradient(60% 70% at 45% 35%,#F4F1FF 0%,#fff 70%);border:1px solid var(--line);border-radius:22px;overflow:hidden}
.nx-svg{position:absolute;inset:0;width:100%;height:100%}
.nx-outline{stroke-dasharray:6000;stroke-dashoffset:6000;transition:stroke-dashoffset 2.4s cubic-bezier(.4,.1,.2,1)}
.nx-map.in .nx-outline{stroke-dashoffset:0}
.nx-pins{position:absolute;inset:0}
.nx-pin{position:absolute;transform:translate(-50%,-50%) scale(0);width:var(--s,22px);height:var(--s,22px);border-radius:50%;border:0;padding:0;cursor:pointer;background:var(--c,#5B4BE0);color:#fff;font:800 .6875rem/1 var(--label);display:grid;place-items:center;box-shadow:0 0 0 3px #fff,0 6px 16px rgba(21,23,38,.18);transition:transform .45s cubic-bezier(.3,1.6,.5,1),opacity .2s;transition-delay:calc(var(--i,0)*35ms)}
.nx-map.in .nx-pin{transform:translate(-50%,-50%) scale(1)}
.nx-pin::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--c,#5B4BE0);opacity:0}
.nx-pin:hover::after,.nx-pin.on::after{animation:nxPulse 1.4s ease-out infinite}
.nx-pin.on{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--c,#5B4BE0)}
.nx-pin[hidden]{display:none}
.nx-pin:focus-visible{outline:3px solid var(--txt);outline-offset:4px}
.nx-pin .lb{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);white-space:nowrap;background:var(--txt);color:#fff;font:600 .75rem/1 var(--label);padding:6px 9px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .15s}
.nx-pin:hover .lb,.nx-pin:focus-visible .lb,.nx-pin.on .lb{opacity:1}
@keyframes nxPulse{0%{transform:scale(.8);opacity:.7}100%{transform:scale(1.9);opacity:0}}
.nx-panel{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;max-height:min(70vh,560px);overflow:auto}
.nx-panel h3{font-family:var(--head);font-weight:800;font-size:1.25rem;margin:0 0 4px}
.nx-panel .ob{font-size:.8125rem;color:var(--txt3);margin:0 0 12px}
.nx-hint{margin:0;color:var(--txt2);line-height:1.55}.nx-hint b{font-family:var(--head);font-size:1.5rem;color:var(--txt);display:block}
.nx-items{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.nx-items li{border:1px solid var(--line);border-left:4px solid var(--c);border-radius:12px;padding:12px 14px;margin:0;max-width:none;animation:nxIn .3s ease both;animation-delay:calc(var(--i,0)*40ms)}
.nx-items .ty{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--txt3)}
.nx-items b{display:block;margin:2px 0 4px;font-size:.9375rem}
.nx-items span{display:block;font-size:.875rem;color:var(--txt2)}
.nx-items a{font-size:.875rem;margin-right:12px}
@keyframes nxIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.nx-alllist{margin-top:18px}
.nx-alllist h3{font-size:1rem;margin:0 0 8px}
.nx-alllist details{border-bottom:1px solid var(--line)}
.nx-alllist summary{cursor:pointer;padding:12px 0;font-weight:600;display:flex;justify-content:space-between;list-style-position:inside}
.nx-alllist summary span{color:var(--txt3);font-weight:500}
.nx-list{list-style:none;padding:0 0 12px;margin:0;display:grid;gap:8px}
.nx-list li{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.875rem;margin:0;max-width:none}
.nx-list li b{flex-basis:100%;font-size:.9375rem}.nx-list li span{color:var(--txt2)}
.nx-list li[hidden]{display:none}
.nx-kyiv{display:none}

/* пошукові сервіси, матеріали, спільноти */
.nx-finders,.nx-mats,.nx-comms{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.nx-finder,.nx-mat,.nx-comm{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px;color:var(--txt);text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s}
.nx-finder:hover,.nx-mat:hover,.nx-comm:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--line2)}
.nx-finder .ic,.nx-comm .ic{width:34px;height:34px;border-radius:10px;background:#F1EFFD;color:var(--deep);display:inline-flex;align-items:center;justify-content:center}
.nx-finder .ic svg,.nx-comm .ic svg{width:19px;height:19px}
.nx-finder b,.nx-mat b,.nx-comm b{font-size:.9375rem;line-height:1.35}
.nx-finder>span:not(.ic),.nx-mat>span:not(.nx-badge),.nx-comm>span:not(.ic){font-size:.875rem;color:var(--txt2);line-height:1.5}
.nx-finder em,.nx-mat em,.nx-comm em{font-style:normal;font-size:.8125rem;color:var(--txt3);margin-top:auto}
.nx-badge{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;font:600 .75rem/1 var(--label);text-transform:uppercase;letter-spacing:.06em;border-radius:100px;padding:6px 10px 6px 7px;background:#F1EFFD;color:var(--deep)}
.nx-badge svg{width:15px;height:15px}
.nx-mat.t-video{background:linear-gradient(160deg,#1C1B33,#2A2154);border-color:transparent;color:#fff}
.nx-mat.t-video .nx-badge{background:rgba(255,77,109,.18);color:#FF8FA3}
.nx-mat.t-video>span:not(.nx-badge),.nx-mat.t-video em{color:#C9C6E6}
.nx-mat.t-video b{color:#fff}
.nx-hl,.nx-finder,.nx-mat,.nx-comm,.nx-right,.nx-pair{min-width:0;overflow-wrap:anywhere}

/* аварійний блок (залежність) */
.nx-emerg{margin:8px 0 6px;background:#FFF4F1;border:1px solid #FAD3C9;border-radius:20px;padding:20px 22px}
.nx-emerg h2,.nx-emerg h3{margin:0 0 10px;font-family:var(--head);font-weight:800;font-size:1.125rem;color:#9A2A15}
.nx-emerg ul{margin:0;padding-left:20px;display:grid;gap:6px}.nx-emerg li{max-width:none;line-height:1.55}

/* SYNTONIA */
.nx-we{display:grid;grid-template-columns:1.6fr 1fr;gap:24px;align-items:center;background:linear-gradient(120deg,#F1EFFD,#FFF3E9);border-radius:26px;padding:32px 34px}
.nx-we h2{font-size:clamp(1.375rem,2.6vw,1.875rem);margin:8px 0}
.nx-we p{margin:0;color:var(--txt2)}
.nx-we-acts{display:flex;flex-direction:column;gap:10px;align-items:flex-start}

/* плитки ситуацій */
.nv-tile{position:relative}
.nx-who{position:absolute;top:14px;right:14px;font-style:normal;font-size:.6875rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--txt3)}
.nv-tile[hidden]{display:none}

/* поява */
.js .nx-sec .reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.js .nx-sec .reveal.in{opacity:1;transform:none}

@media (max-width:900px){
  .nx-mapgrid{grid-template-columns:1fr}
  .nx-panel{max-height:none}
  .nx-we{grid-template-columns:1fr;padding:24px 20px}
  .nx-jump{top:56px;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .nx-jump a{white-space:nowrap}
  .nx-pin{--s:18px!important;font-size:.5625rem}
  .nx-steps li{padding-left:62px}
}
@media (prefers-reduced-motion:reduce){
  .nx-outline{transition:none;stroke-dashoffset:0}
  .nx-pin{transition:none;transform:translate(-50%,-50%) scale(1)}
  .nx-pin::after{animation:none!important}
  .js .nx-sec .reveal{opacity:1;transform:none;transition:none}
  .nx-items li{animation:none}
}
html.a11y .nx-mat.t-video{background:#fff!important;color:#000!important}
html.a11y-still .nx-pin::after{animation:none!important}