/* vc: 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){
  #znanje{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}
.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-sec{padding:110px 0;scroll-margin-top:70px}
.zh-rows{list-style:none;margin:0;padding:0;border-top:1px solid #e5e5ea}
.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-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 (max-width: 900px){
  .zh-sec{padding:70px 0}
  .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}
}
.vc{background:#ffffff;color:#1d1d1f}
.vc-hero{padding:130px 0 90px;background:radial-gradient(900px 480px at 80% 30%,rgba(242,99,34,0),transparent 62%),#0a0a0b;color:#f5f4f1;overflow:hidden}
.vc-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
.vc-hero-in{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.vc-n{display:flex;align-items:center;gap:10px;font-size:15px;color:#a1a1a6}
.vc-n em{font-size:24px;color:#ff9a62}
.vc-n i{font-style:normal;color:#48484d}
.vc-h1{margin:0;font-size:clamp(40px,5.4vw,76px);line-height:1.02;letter-spacing:-0.045em;font-weight:600;text-wrap:balance}
.vc-art .of{max-width:440px;margin:0 auto}
.vc-rows a .zh-rm{color:#c2410c;font-weight:600;opacity:0;transform:translateX(-6px);transition:opacity .3s,transform .3s}
.vc-rows a:hover .zh-rm,.vc-rows .zh-row.on .zh-rm{opacity:1;transform:none}
.vc-subs{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.vc-subs span{padding:4px 10px;border-radius:999px;background:#f5f5f7;font-size:13px;color:#515154}
.vc-nav{padding:0 0 110px}
.vc-nav-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.vc-next{position:relative;display:flex;flex-direction:column;gap:6px;flex:1;min-width:280px;max-width:640px;padding:28px 80px 28px 30px;border-radius:26px;background:#0a0a0b;color:#f5f4f1;text-decoration:none;transition:transform .35s cubic-bezier(.2,.7,.1,1)}
.vc-next small{font-size:13.5px;color:#a1a1a6}
.vc-next b{font-size:24px;letter-spacing:-0.025em}
.vc-next i{position:absolute;right:28px;top:50%;margin-top:-22px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#f26322;font-style:normal;font-size:20px;transition:transform .35s}
.vc-next:hover{transform:translateY(-3px)}
.vc-next:hover i{transform:translateX(4px)}
.vc-all{font-weight:600;color:#c2410c;text-decoration:none}
.vc-all:hover{text-decoration:underline}
@media (max-width: 900px){
  .vc-hero{padding:100px 0 50px}
  .vc-hero-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .vc-art .of{max-width:280px}
  .vc-rows a .zh-rm{display:none}
  .vc-nav{padding-bottom:70px}
}
@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)}}
