/* znhub: design CSS used by this page (tools/page_css.cjs), loaded only on this page */
a:not([class]):hover{color:inherit}
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --n{syntax:'<integer>';inherits:false;initial-value:0}
@media (max-width: 760px){
  #moduli,#znanje,#blog{padding-bottom:72px !important}
}
@property --dent{syntax:'<length>';inherits:true;initial-value:0px}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:#8e8e93}
.crumbs a{color:#a1a1a6;text-decoration:none}
.crumbs a:hover{color:#f5f4f1}
.crumbs [aria-current]{color:#f5f4f1}
button.pp-pill{cursor:pointer;font:inherit;font-size:17px;background:none}
button.pp-pill.pp-pill-on{background:#f26322}
button.pp-pill{cursor:pointer;font:inherit;font-size:17px;background:none}
.zn-hb{padding:90px 0;background:linear-gradient(135deg,#ff8a4c,#f26322 55%,#d4520f);color:#2a1206}
.zn-hb-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px;align-items:center}
.zn-hb-h{margin:10px 0 14px;font-size:clamp(34px,4.2vw,58px);line-height:1.02;letter-spacing:-0.045em;color:#1d0d04}
.zn-hb p{margin:0;font-size:17px;line-height:1.6;color:#3a1a08}
.zn-hb-form form{display:flex;gap:10px;padding:10px;border-radius:999px;background:rgba(255,255,255,.92);box-shadow:0 30px 60px -30px rgba(80,20,0,.6)}
.zn-hb-form input{flex:1;min-width:0;padding:12px 16px;border:0;background:transparent;font:inherit;font-size:16px;color:#1d1d1f;outline:none}
.zn-hb-form .pp-pill{white-space:nowrap;background:#0a0a0b;border-color:#0a0a0b;color:#ffffff}
.zn-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (max-width: 900px){
  .zn-hb-in{grid-template-columns:minmax(0,1fr);gap:36px}
  .zn-hb-form form{flex-direction:column;border-radius:22px}
}
.og-host{position:relative;overflow:hidden;isolation:isolate}
.og-host>.wrap{position:relative;z-index:1}
.og{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.og::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a0a0b 0%,rgba(10,10,11,.85) 30%,rgba(10,10,11,.2) 70%,rgba(10,10,11,0) 100%)}
.og i{position:absolute;display:block;filter:blur(70px);opacity:.8;will-change:transform,border-radius}
.og i:nth-child(1){right:4%;top:-55%;width:560px;height:440px;background:radial-gradient(closest-side,#f26322,rgba(242,99,34,0));border-radius:42% 58% 63% 37% / 55% 39% 61% 45%}
.og i:nth-child(2){right:26%;top:10%;width:420px;height:340px;background:radial-gradient(closest-side,#ffb27a,rgba(255,178,122,0));opacity:.45;border-radius:58% 42% 40% 60% / 45% 60% 40% 55%}
.og i:nth-child(3){right:-8%;bottom:-70%;width:640px;height:460px;background:radial-gradient(closest-side,#9a3412,rgba(154,52,18,0));opacity:.9;border-radius:50% 50% 38% 62% / 60% 44% 56% 40%}
.og i:nth-child(4){right:40%;bottom:-80%;width:520px;height:380px;background:radial-gradient(closest-side,#5b1d0a,rgba(91,29,10,0));opacity:.8;border-radius:63% 37% 54% 46% / 40% 55% 45% 60%}
.motion .og i:nth-child(1){animation:ogA 19s ease-in-out infinite alternate}
.motion .og i:nth-child(2){animation:ogB 23s ease-in-out infinite alternate}
.motion .og i:nth-child(3){animation:ogC 27s ease-in-out infinite alternate}
.motion .og i:nth-child(4){animation:ogB 31s ease-in-out infinite alternate-reverse}
@keyframes ogA{0%{transform:translate(0,0) rotate(0deg) scale(1);border-radius:42% 58% 63% 37% / 55% 39% 61% 45%}50%{transform:translate(-120px,60px) rotate(40deg) scale(1.15);border-radius:60% 40% 35% 65% / 40% 62% 38% 60%}100%{transform:translate(-40px,110px) rotate(80deg) scale(.95);border-radius:38% 62% 55% 45% / 62% 35% 65% 38%}}
@keyframes ogB{0%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(140px,-40px) rotate(-35deg) scale(1.2)}100%{transform:translate(60px,50px) rotate(-70deg) scale(.9)}}
@keyframes ogC{0%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(-160px,-60px) rotate(30deg) scale(1.1)}100%{transform:translate(-60px,-120px) rotate(60deg) scale(1.05)}}
@media (prefers-reduced-motion: reduce){.og i{animation:none !important}}
.zh{background:#ffffff;color:#1d1d1f}
.zh-hero{padding:130px 0 80px;background:radial-gradient(900px 480px at 85% 10%,rgba(242,99,34,0),transparent 62%),#0a0a0b;color:#f5f4f1}
.zh-hero .wrap{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.zh-h1{margin:6px 0 0;max-width:900px;font-size:clamp(42px,6vw,84px);line-height:1;letter-spacing:-0.045em;font-weight:600}
.zh-h1 em{color:#ff9a62}
.zh-sub{max-width:640px}
.zh-jump{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;width:100%;margin-top:18px}
.zh-jump a{display:flex;align-items:center;gap:14px;padding:12px 16px 12px 12px;border-radius:20px;background:rgba(245,244,241,.06);border:1px solid rgba(245,244,241,.1);color:#f5f4f1;text-decoration:none;transition:background .3s,border-color .3s,transform .35s cubic-bezier(.2,.7,.1,1)}
.zh-jump a:hover{background:rgba(245,244,241,.1);border-color:rgba(242,99,34,.6);transform:translateY(-2px)}
.zh-ic{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:rgba(242,99,34,.14)}
.zh-ic svg{width:24px;height:24px;fill:none;stroke:#ff9a62;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.zh-jump a>span:not(.zh-ic){display:flex;flex-direction:column;gap:2px;min-width:0}
.zh-jump b{font-size:16px;letter-spacing:-0.01em}
.zh-jump small{font-size:13.5px;color:#a1a1a6}
.zh-sec{padding:110px 0;scroll-margin-top:70px}
.zh-sec.alt{background:#f5f5f7}
.zh-split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:72px;align-items:start}
.zh-side{position:sticky;top:110px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:14px;min-height:520px;padding:34px;border-radius:30px;overflow:hidden;isolation:isolate;background:#0a0a0b;color:#f5f4f1}
.zh-side-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:60% 30%;transition:transform 1.2s cubic-bezier(.2,.7,.1,1)}
.zh-side::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,10,11,0) 20%,rgba(10,10,11,.75) 55%,#0a0a0b 92%)}
.zh-side:hover .zh-side-bg{transform:scale(1.04)}
.zh-side .pp-k{color:#ff9a62}
.zh-side .pp-h2{margin:0;color:#f5f4f1}
.zh-side .pp-lead{margin:0;color:#c7c7cc}
.zh-rows{list-style:none;margin:0;padding:0;border-top:1px solid #e5e5ea}
.zh-sec.alt .zh-rows,.zh-sec.alt .zh-rows a{border-color:#dcdce1}
.zh-rows a{display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:16px;padding:22px 8px;border-bottom:1px solid #e5e5ea;color:#1d1d1f;text-decoration:none;transition:padding .35s cubic-bezier(.2,.7,.1,1),background .35s}
.zh-rows i{font-family:'Instrument Serif','Instrument Serif Fallback',Georgia,serif;font-style:italic;font-size:30px;line-height:1;color:#f26322}
.zh-rt{display:flex;flex-direction:column;gap:4px;min-width:0}
.zh-rt b{font-size:19px;line-height:1.3;letter-spacing:-0.02em;font-weight:600}
.zh-rt small{font-size:14.5px;line-height:1.45;color:#6e6e73}
.zh-rm{font-size:14px;color:#86868b;white-space:nowrap}
.zh-rows a:hover{padding-left:20px;background:#fff6f0}
.zh-rows a:hover b{color:#c2410c}
.zh-row{position:relative}
.zh-row a{position:relative;z-index:0}
.zh-row:hover a,.zh-row.on a{z-index:3}
.zh .zh-pop{z-index:5;right:110px;bottom:calc(100% - 34px);width:210px}
.zh-row:hover .zh-pop,.zh-row.on .zh-pop{opacity:1;transform:none}
.zh-rows .zh-row.on a{padding-left:20px;background:#fff6f0}
.zh-rows .zh-row.on b{color:#c2410c}
@media (hover: none){
  .zh .zh-pop{display:block;right:-4px;top:50%;bottom:auto;width:104px;margin-top:-52px;transform:scale(.6) rotate(-8deg);transform-origin:50% 50%}
}
@media (max-width: 900px){
  .zh-hero{padding:100px 0 50px}
  .zh-jump{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .zh-jump a{flex-direction:column;align-items:flex-start;gap:10px;padding:12px}
  .zh-ic{width:44px;height:44px;border-radius:13px}
  .zh-sec{padding:70px 0}
  .zh-split{grid-template-columns:minmax(0,1fr);gap:28px}
  .zh-side{position:relative;top:auto;min-height:420px;padding:26px;border-radius:24px}
  .zh-rows a{grid-template-columns:40px minmax(0,1fr);padding:18px 4px}
  .zh-rows i{font-size:26px}
  .zh-rm{grid-column:2;margin-top:-10px;white-space:normal}
  .zh-rt b{font-size:17.5px}
}
@media (hover: none) and (max-width: 900px){
  .zh-rows a,.zh-rows .zh-row.on a{padding-right:96px}
}
@keyframes ofDrift{0%,100%{transform:translate(0,0) rotate(0deg)}33%{transform:translate(1.5px,-2px) rotate(4deg)}66%{transform:translate(-2px,1.5px) rotate(-3deg)}}
@keyframes ofSpin{to{transform:rotate(360deg)}}
@keyframes count{from{--n:0}to{--n:var(--to)}}