/* =====================================================================
   ARXO — naslovnica v38: noćna kuća u presjeku (js/naslovna-noc.js)
   Pozornica u koordinatama slike 1672 × 941 (img/naslovna/noc/kuca-noc-*).
   Na računalu cijela kompozicija stane u zaslon (contain); rubovi se nastavljaju
   zamućenom slikom. Naslov, gumbi, kartice, oznake i zone su elementi stranice.
   ===================================================================== */
.junak.nk {
  --nk-bg: #070c22; --nk-tx: #f3f5ff; --nk-tx2: #c9cfee; --nk-cij: #33d1ff; --nk-lj: #8e6bff;
  --nk-f: 'Plus Jakarta Sans', 'Archivo', 'Segoe UI', Arial, sans-serif;
  --s: .8;
  position: relative; isolation: isolate; overflow: clip;
  margin-top: -72px; padding: 0; display: block;
  min-height: 0; height: max(560px, 100svh);
  background: var(--nk-bg); color: var(--nk-tx);
}
/* produžetak rubova: ista slika, zamućena (vidi se samo izvan pozornice) */
.nk-poz-bg { position: absolute; inset: -40px; z-index: 0; background: #0a1230 center / cover no-repeat; filter: blur(26px) saturate(1.1) brightness(.78); transform: scale(1.06); pointer-events: none; }
.nk-poz-bg::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 70% 60% at 50% 55%, transparent 40%, rgba(5, 8, 26, .55) 100%); }

/* ---------- pozornica (#jkPozornica) ---------- */
.nk-pozornica { position: absolute; inset: 0; z-index: 1; transform-origin: 50% 50%; }
.nk.jk-zum .nk-pozornica { transition: transform .82s cubic-bezier(.65, 0, .25, 1); will-change: transform; }
.nk.jk-zum .nk-ui, .nk.jk-zum .nk-t, .nk.jk-zum .nk-popis { opacity: 0; transition: opacity .3s ease; pointer-events: none; }
.junak.nk .nk-t, .junak.nk .nk-popis { transition: opacity .35s ease; }
.nk-tocka-g, .nk-mala { transition: opacity .3s ease; }
.nk.jk-zum .nk-tocka-g, .nk.jk-zum .nk-mala { opacity: 0; }   /* crte i točke oznaka ne rastu s približavanjem */
.nk-platno { position: absolute; left: 0; top: 0; width: 1672px; height: 941px; transform-origin: 0 0; transform: translate(var(--x0, 0px), var(--y0, 0px)) scale(var(--s)); }
.nk-platno::before { content: ''; position: absolute; inset: 0; z-index: 9; pointer-events: none;
  background: linear-gradient(90deg, var(--nk-bg-r, transparent), transparent 3%, transparent 97%, var(--nk-bg-r, transparent)); opacity: var(--nk-rub, 0); }
.nk-osnova, .nk-osnova img { position: absolute; left: 0; top: 0; width: 1672px; height: 941px; display: block; }
.nk-osnova img { object-fit: fill; user-select: none; -webkit-user-drag: none; }
.nk-maska { -webkit-mask: linear-gradient(90deg, transparent 0, #000 2.4%, #000 97.6%, transparent 100%), linear-gradient(180deg, transparent 0, #000 2%, #000 97.5%, transparent 100%); -webkit-mask-composite: source-in; mask-composite: intersect;
  mask: linear-gradient(90deg, transparent 0, #000 2.4%, #000 97.6%, transparent 100%), linear-gradient(180deg, transparent 0, #000 2%, #000 97.5%, transparent 100%); }

/* slikovni slojevi (koordinate slike) */
.nk-sloj { position: absolute; display: block; pointer-events: none; opacity: 0; will-change: transform, opacity; }
.nk-sloj > img { display: block; width: 100%; height: 100%; }
.nk-sloj.ucitan { transition: opacity .35s ease, transform .9s cubic-bezier(.3, .7, .2, 1); }
.nk-svg { position: absolute; left: 0; top: 0; width: 1672px; height: 941px; overflow: visible; pointer-events: none; }
.nk-pogoci { position: absolute; left: 0; top: 0; width: 1672px; height: 941px; z-index: 5; }
.nk-pogoci .nk-z { fill: transparent; stroke: none; cursor: default; pointer-events: all; }   /* v38.1: dio kuće samo pokreće animaciju */
.nk-pogoci .nk-z:focus { outline: none; }

/* ---------- dodani elementi scene (stalno vidljivi, u istom stilu i perspektivi) ---------- */
.nk-staklo { fill: url(#nkGStaklo); stroke: rgba(214, 232, 248, .38); stroke-width: .8; }
.nk-rukohvat { fill: none; stroke: #d6dbe2; stroke-width: 2.2; stroke-linecap: round; }
.nk-rukohvat-s { fill: none; stroke: rgba(20, 24, 36, .55); stroke-width: 1.2; }
.nk-stup { stroke: #c8ced6; stroke-width: 1.6; stroke-linecap: round; }
.nk-prihvat { fill: #9aa2ad; stroke: #59606b; stroke-width: .5; }
.nk-resetka { fill: #aab0b8; stroke: #5c626b; stroke-width: .6; }
.nk-resetka-l { stroke: #6c727b; stroke-width: 1; }
.nk-resetka-g { transition: opacity .3s ease .25s; }
.nk[data-dio="fasada"] .nk-resetka-g { opacity: 0; transition-delay: .18s; }   /* rešetka je u završnom sloju koji se odreže */

/* ---------- animacije (jedna aktivna zona: .nk[data-dio]) — bez okvira isticanja ----------
   Skupina animacija zone blijedi pri izlasku (glatki povratak), JS (WAAPI) pokreće pojedine elemente. */
.nk-anim { opacity: 0; transition: opacity .35s ease; }
.nk[data-dio="grijanje"] .nk-anim[data-z="grijanje"], .nk[data-dio="elektro"] .nk-anim[data-z="elektro"], .nk[data-dio="vodovod"] .nk-anim[data-z="vodovod"],
.nk[data-dio="ventilacija"] .nk-anim[data-z="ventilacija"], .nk[data-dio="zid"] .nk-anim[data-z="zid"], .nk[data-dio="beton"] .nk-anim[data-z="beton"],
.nk[data-dio="ograde"] .nk-anim[data-z="ograde"] { opacity: 1; transition-duration: .15s; }

/* krov: crijep se podigne uz pad, ispod letve, kontraletve, folija, vuna i rogovi */
.nk-sloj.krov-ispod.ucitan { opacity: 0; }
.nk[data-dio="krov"] .nk-sloj.krov-ispod.ucitan { opacity: 1; transition-duration: .2s; }
.nk-sloj.krov-crijep.ucitan { transition: opacity .3s ease, transform 1s cubic-bezier(.3, .7, .2, 1), filter 1s ease; }
.nk[data-dio="krov"] .nk-sloj.krov-crijep.ucitan { opacity: 1; transform: translate(var(--kx), var(--ky)); filter: drop-shadow(0 12px 7px rgba(0, 0, 0, .62)); transition-delay: .05s; }
/* fasada: stepenasti presjek — žbuka se odreže, zatim izolacija, vidi se nosivi zid */
.nk[data-dio="fasada"] .nk-sloj.fasada-zid.ucitan,
.nk[data-dio="fasada"] .nk-sloj.fasada-izol.ucitan,
.nk[data-dio="fasada"] .nk-sloj.fasada-zbuka.ucitan { opacity: 1; }
.nk-sloj.fasada-zbuka > img, .nk-sloj.fasada-izol > img { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); transition: clip-path .75s cubic-bezier(.45, .05, .25, 1); }
.nk[data-dio="fasada"] .nk-sloj.fasada-zbuka > img { clip-path: polygon(0 66%, 100% 50%, 100% 100%, 0 100%); transition-delay: .06s; }
.nk[data-dio="fasada"] .nk-sloj.fasada-izol > img { clip-path: polygon(0 36%, 100% 20%, 100% 100%, 0 100%); transition-delay: .5s; }
.nk[data-dio="fasada"] .nk-sloj.fasada-zbuka.ucitan { transform: translate(var(--fx), var(--fy)); filter: drop-shadow(0 -1.2px 0 rgba(236, 240, 248, .85)) drop-shadow(0 -2px 2.5px rgba(0, 0, 0, .5)); }
.nk[data-dio="fasada"] .nk-sloj.fasada-izol.ucitan { transform: translate(calc(var(--fx) * .5), calc(var(--fy) * .5)); filter: drop-shadow(0 -1px 0 rgba(255, 226, 150, .7)) drop-shadow(0 -2px 2px rgba(0, 0, 0, .45)); }
/* zid (Knauf): zid se otvori (CW profili, UW profil, vuna), ploča ga zatvori, vijci na profilima — slijed pokreće JS */
.nk-sloj.zid-presjek.ucitan { opacity: 0; transition: opacity .3s ease; }
.nk[data-dio="zid"] .nk-sloj.zid-presjek.ucitan { opacity: 1; transition-duration: .1s; }
.nk-sloj.zid-presjek > img { clip-path: inset(0 100% 0 0); }
.nk-ploca { fill: none; stroke: rgba(244, 248, 255, .95); stroke-width: 2.2; stroke-linecap: round; opacity: 0; }
.nk-vijak { fill: #eef2f7; stroke: #3c4250; stroke-width: .6; opacity: 0; transform-box: fill-box; transform-origin: center; }
/* beton: armatura (šipke se iscrtaju, zatim spone) */
.nk-arm { fill: none; stroke: #d9935a; stroke-width: 1.8; stroke-linecap: round; stroke-dasharray: 1 1; stroke-dashoffset: 1; }
.nk-arm-v { fill: none; stroke: #c4844f; stroke-width: 1.1; opacity: 0; }
.nk-izljev { transform: translateY(380px); }
/* ograde i stepenice: odsjaj stakla, svjetlo uz rukohvat, prihvati, rubovi gazišta */
.nk-odsjaj { opacity: 0; }
.nk-stup-s { stroke: #e9fbff; stroke-width: 2.2; stroke-linecap: round; opacity: 0; }
.nk-nos { fill: none; stroke: rgba(255, 236, 205, .95); stroke-width: 1.7; stroke-linecap: round; opacity: 0; }

/* tokovi u cijevima (pokreće js: .tece) */
.nk-tok { fill: none; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.nk-tok.top { stroke: #ff8a4c; stroke-width: 2.6; }
.nk-tok.pov { stroke: #63b8ff; stroke-width: 2.4; }
.nk-tok.voda { stroke: #6fe7ff; stroke-width: 2.6; }
.nk-tok.odvod { stroke: #c9a46a; stroke-width: 2.8; }
.nk-tok.struja { stroke: #fff2b0; stroke-width: 3.2; }
.nk-tok.zrak { stroke: rgba(210, 240, 255, .9); stroke-width: 2; }
.nk-tok.ruk { stroke: #dff9ff; stroke-width: 3; }
.nk-toplo { opacity: 0; transition: opacity .9s ease .2s; }
.nk[data-dio="grijanje"] .nk-toplo { opacity: .9; }
.nk-svjetlo { opacity: 0; transition: opacity .6s ease; }
.nk-mrak { opacity: 0; transition: opacity .15s ease; }
.nk[data-dio="elektro"] .nk-svjetlo.upaljeno { opacity: 1; }
.nk[data-dio="elektro"] .nk-mrak.ugaseno { opacity: .5; }

/* ---------- oznake (4 glavne) i diskretne točke ---------- */
.nk-ui { position: absolute; inset: 0; z-index: 6; pointer-events: none; transition: opacity .3s ease; }
.nk-oz { position: absolute; left: calc(var(--x) * 1px); top: calc(var(--y) * 1px); width: calc(var(--w) * 1px); height: calc(var(--h) * 1px);
  display: flex; align-items: center; gap: 0; padding: 0 18px 0 20px; box-sizing: border-box; pointer-events: auto; cursor: default;
  border-radius: 14px; border: 1.2px solid rgba(190, 205, 255, .46); color: #fff; font: 700 21px/1 var(--nk-f); letter-spacing: -.01em;
  background: linear-gradient(180deg, rgba(31, 41, 82, .9), rgba(14, 20, 50, .92)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 10px 26px -12px rgba(0, 0, 0, .7);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  transition: border-color .25s, box-shadow .25s, transform .25s; transform-origin: 50% 50%; }
.nk-oz svg { width: 38px; height: 38px; flex: none; fill: none; stroke: #fff; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.nk-oz span { flex: 1; text-align: center; }
.nk-oz:hover, .nk-oz.on, .nk-oz:focus-visible { border-color: rgba(110, 220, 255, .95); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 0 0 1px rgba(80, 210, 255, .35), 0 0 26px -2px rgba(51, 209, 255, .55); }
.nk-oz:focus-visible, .nk-tc:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.nk-crta { fill: none; stroke: var(--nk-cij); stroke-width: 2.2; stroke-linecap: round; filter: url(#nkSjajH); opacity: .95; }
.nk-tocka-c { fill: #0b1530; stroke: var(--nk-cij); stroke-width: 3; filter: url(#nkSjajH); }
.nk-tocka-i { fill: var(--nk-cij); }
.nk-mala-c { fill: rgba(20, 30, 70, .7); stroke: rgba(150, 225, 255, .9); stroke-width: 2; }
.nk-mala-i { fill: #bfefff; }
.nk-mala-pul { fill: none; stroke: rgba(120, 220, 255, .55); stroke-width: 1.2; transform-box: fill-box; transform-origin: center; animation: nkPuls 2.6s ease-out infinite; }
@keyframes nkPuls { 0% { transform: scale(.7); opacity: .9; } 80%, 100% { transform: scale(2.1); opacity: 0; } }
.nk-tc { position: absolute; left: calc(var(--x) * 1px); top: calc(var(--y) * 1px); width: 40px; height: 40px; margin: -20px 0 0 -20px; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: default; pointer-events: auto; }
.nk-tc i { position: absolute; left: 50%; bottom: calc(100% + 2px); transform: translate(-50%, 6px); white-space: nowrap; padding: 7px 12px; border-radius: 999px; font: 700 15px/1 var(--nk-f); font-style: normal; color: #fff;
  background: rgba(14, 20, 50, .92); border: 1px solid rgba(150, 220, 255, .6); box-shadow: 0 8px 22px -10px rgba(0, 0, 0, .8); opacity: 0; transition: opacity .2s, transform .25s; pointer-events: none; }
.nk-tc:hover i, .nk-tc.on i, .nk-tc:focus-visible i { opacity: 1; transform: translate(-50%, 0); }
.nk[data-dio] .nk-oz:not(.on) { opacity: .82; }

/* ---------- tekst i gumbi junaka (koordinate slike, mjerilo --s) ---------- */
.nk-t { position: absolute; left: 0; right: 0; z-index: 7; text-align: center; pointer-events: none; }
.nk-t > * { pointer-events: auto; }
.nk-vrh { top: var(--ty, max(calc(var(--y0, 0px) + 88px * var(--s)), 82px)); }
.junak.nk .nk-pozdrav { font: 500 calc(max(12px, 13px * var(--s))) / 1.4 var(--f-mono, 'IBM Plex Mono', monospace); color: #b8c0ea; letter-spacing: .03em; }
/* pozdrav prijavljenog korisnika: dolje lijevo, uz kartice (nebo iznad krova ostaje za naslov) */
.junak.nk > .nk-pozdrav { position: absolute; z-index: 7; left: 24px; bottom: 14px; margin: 0; text-align: left; max-width: max(160px, calc(50vw - 478px * var(--s) - 48px)); }
.nk-uski > .nk-pozdrav { position: static; max-width: none; margin: 16px 16px 0; text-align: center; }
.nk-t .pozdrav b, .junak.nk .nk-pozdrav b { color: #9fe6ff; }
.junak.nk .nk-pozdrav .t-gumb { color: #c9d0ff; }
.junak.nk h1 { margin: 0 auto; max-width: none; text-wrap: balance; font: 800 calc(max(30px, 74px * var(--s))) / 1.04 var(--nk-f); letter-spacing: -.035em; color: #fff; text-shadow: 0 2px 30px rgba(5, 10, 40, .55); }
.junak.nk h1 em { font-style: normal; background: linear-gradient(90deg, #2fd6ff 0%, #4fb6ff 35%, #7d78ff 70%, #9a6bff 100%); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.nk .nk-pod { margin: calc(max(8px, 12px * var(--s))) 0 0; font: 500 calc(max(15px, 23px * var(--s))) / 1.3 var(--nk-f); color: #d9def8; text-shadow: 0 1px 12px rgba(5, 10, 40, .6); }
.nk-dno { top: calc(var(--y0, 0px) + 760px * var(--s)); display: flex; flex-direction: column; align-items: center; gap: calc(16px * var(--s)); }
.nk-cta-red { display: flex; align-items: center; justify-content: center; gap: calc(34px * var(--s)); }
.nk-cta { display: inline-flex; align-items: center; gap: calc(14px * var(--s)); height: calc(max(46px, 60px * var(--s))); padding: 0 calc(max(18px, 30px * var(--s))); border-radius: calc(max(12px, 16px * var(--s)));
  font: 700 calc(max(15px, 19px * var(--s))) / 1 var(--nk-f); color: #fff; text-decoration: none; border: 1px solid rgba(255, 255, 255, .22); cursor: pointer;
  background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 55%), linear-gradient(100deg, #1f8cff 0%, #3e6dff 45%, #7646f0 100%);
  box-shadow: 0 0 0 1px rgba(90, 120, 255, .25), 0 16px 40px -14px rgba(60, 90, 255, .95), inset 0 1px 0 rgba(255, 255, 255, .3); transition: filter .2s, transform .2s; }
.nk-cta:hover { filter: brightness(1.08); transform: translateY(-1px); }
.nk-cta:focus-visible, .nk-svi:focus-visible, .nk-k:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.nk-cta svg, .nk-svi svg, .nk-k svg { flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.nk-cta .nk-ik { width: calc(max(22px, 30px * var(--s))); height: calc(max(22px, 30px * var(--s))); }
.nk-cta .nk-str { width: calc(max(16px, 20px * var(--s))); height: calc(max(16px, 20px * var(--s))); }
.nk-razd { width: 1px; height: calc(max(26px, 34px * var(--s))); background: rgba(190, 205, 255, .35); }
.nk-svi { display: inline-flex; align-items: center; gap: 8px; padding: 6px 2px; border: 0; background: none; cursor: pointer; text-decoration: none;
  font: 600 calc(max(14px, 16px * var(--s))) / 1 var(--nk-f); color: #59d4ff; }
.nk-svi:hover { color: #9be6ff; }
.nk-svi svg { width: 16px; height: 16px; }
.nk-kartice { display: flex; align-items: center; justify-content: center; gap: calc(18px * var(--s)); margin-top: calc(2px * var(--s)); }
.nk-k { display: flex; align-items: center; gap: calc(16px * var(--s)); width: calc(292px * var(--s)); min-width: 210px; box-sizing: border-box; padding: calc(14px * var(--s)) calc(20px * var(--s)); text-align: left; text-decoration: none;
  border-radius: calc(max(10px, 14px * var(--s))); color: #fff; background: rgba(12, 18, 46, .62); border: 1px solid rgba(150, 165, 230, .26); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  transition: border-color .2s, background .2s; }
.nk-k:hover { border-color: rgba(120, 210, 255, .6); background: rgba(16, 26, 62, .78); }
.nk-k svg { width: calc(max(28px, 38px * var(--s))); height: calc(max(28px, 38px * var(--s))); stroke-width: 1.5; color: #e7ebff; }
.nk-k b { display: block; font: 700 calc(max(14px, 17px * var(--s))) / 1.2 var(--nk-f); }
.nk-k small { display: block; margin-top: 4px; font: 500 calc(max(11.5px, 13.5px * var(--s))) / 1.3 var(--nk-f); color: #b8c0e6; }
.nk-kraz { color: rgba(220, 228, 255, .75); width: calc(max(12px, 16px * var(--s))); height: calc(max(12px, 16px * var(--s))); flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nk-uski .nk-kraz { display: none; }

/* ---------- popis dijelova (mobitel / tablet uspravno; i za čitače zaslona) ---------- */
.nk-popis { display: none; }
.nk-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* =====================================================================
   USKI ZASLON (js: .nk-uski): naslov gore, kuća u prozoru, oznake ispod kuće
   ===================================================================== */
.junak.nk.nk-uski { height: auto; min-height: 0; padding: 86px 0 26px; background: radial-gradient(ellipse 120% 60% at 50% 34%, #13204f 0%, #0a1230 55%, #070c22 100%); }
.nk-uski .nk-poz-bg { display: none; }
.nk-uski .nk-t { position: relative; left: auto; right: auto; top: auto; padding: 0 18px; }
.junak.nk.nk-uski h1 { font-size: clamp(30px, 8.6vw, 54px); }
.nk-uski .nk-pod { font-size: clamp(15px, 4.1vw, 20px); }
.nk-uski .nk-pozornica { position: relative; inset: auto; height: var(--okno-h, 260px); margin: 16px 0 0; overflow: hidden; }
.nk-uski .nk-oz, .nk-uski .nk-crta { display: none; }
.nk-uski .nk-tc { width: 46px; height: 46px; margin: -23px 0 0 -23px; transform: scale(calc(1 / var(--s))); transform-origin: 50% 50%; }
.nk-uski .nk-tc i { display: none; }
.nk-uski .nk-mala-c { stroke-width: calc(2px / var(--s)); }
.nk-uski .nk-popis { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 14px 16px 0; padding: 0; list-style: none; }
.nk-popis button { width: 100%; display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 8px 12px; border-radius: 14px; text-align: left; cursor: pointer;
  font: 650 14px/1.15 var(--nk-f); color: #fff; background: rgba(18, 26, 62, .78); border: 1px solid rgba(150, 165, 230, .3); }
.nk-popis button.on { border-color: rgba(110, 220, 255, .95); box-shadow: 0 0 0 1px rgba(80, 210, 255, .35), 0 0 18px -4px rgba(51, 209, 255, .6); }
.nk-popis button:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.nk-popis svg { width: 22px; height: 22px; flex: none; fill: none; stroke: #bfe9ff; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.nk-uski .nk-dno { position: relative; top: auto; margin-top: 18px; padding: 0 16px; gap: 14px; }
.nk-uski .nk-cta-red { flex-direction: column; gap: 10px; }
.nk-uski .nk-razd { display: none; }
.nk-uski .nk-kartice { flex-direction: column; align-items: stretch; width: 100%; max-width: 520px; gap: 8px; }
.nk-uski .nk-k { width: 100%; min-width: 0; padding: 12px 14px; }

/* zaglavlje preko noćne slike (dok je junak ispod zaglavlja) */
html.nk-vrh-noc .vrh:not(.skrol) .izbornik a { color: #e7ebff; }
html.nk-vrh-noc .vrh:not(.skrol) .izbornik a:hover, html.nk-vrh-noc .vrh:not(.skrol) .izbornik a.akt { color: #fff; }
html.nk-vrh-noc .vrh:not(.skrol) .gumb-uvod:not(.gumb-zapocni):not(.gumb-prijava) { color: #fff; background: transparent; border-color: transparent; box-shadow: none; }
html.nk-vrh-noc .vrh:not(.skrol) .gumb-uvod:not(.gumb-zapocni):not(.gumb-prijava):hover { border-color: rgba(255, 255, 255, .35); }
html.nk-vrh-noc .vrh:not(.skrol) .korisnik, html.nk-vrh-noc .vrh:not(.skrol) .korisnik small { color: #e7ebff; }
html.nk-vrh-noc .vrh:not(.skrol) .burger { color: #fff; border-color: rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .06); }
html.nk-vrh-noc .vrh:not(.skrol) .marka .arxo { --arxo-ink: #fff; }
html.nk-vrh-noc .vrh:not(.skrol) .vrh-jezik { color: #eef1ff; }
html.nk-vrh-noc .vrh:not(.skrol) .vrh-jezik .i18n-gumb { border-color: rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .06); }
html.nk-vrh-noc .vrh:not(.skrol) .vrh-jezik .i18n-meni { color: var(--text, #111); }
.gumb-zapocni { display: inline-flex; align-items: center; gap: 8px; color: #fff !important; border: 1px solid rgba(255, 255, 255, .2) !important; padding: 10px 16px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 55%), linear-gradient(100deg, #1f8cff 0%, #3e6dff 45%, #7646f0 100%) !important; box-shadow: 0 10px 26px -12px rgba(60, 90, 255, .9) !important; }
.gumb-zapocni svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.gumb-zapocni[hidden] { display: none !important; }

/* smanjeno kretanje: bez rastavljanja i približavanja — mirno isticanje */
@media (prefers-reduced-motion: reduce) {
  /* bez kretanja: završno stanje dijela odmah, bez prijelaza i bez putujućih tokova */
  .nk-sloj.ucitan, .nk-sloj > img, .nk-oz, .nk-tc i, .nk-anim, .nk-toplo, .nk-svjetlo, .nk-mrak { transition: opacity .15s ease !important; }
  .nk-sloj > img { transition: none !important; }
  .nk[data-dio="zid"] .nk-sloj.zid-presjek > img { clip-path: none; }
  .nk[data-dio="elektro"] .nk-svjetlo { opacity: 1; }
  .nk[data-dio] .nk-anim .nk-tok { opacity: .8; }
  .nk[data-dio="beton"] .nk-arm { stroke-dashoffset: 0; opacity: .8; }
  .nk[data-dio="beton"] .nk-arm-v { opacity: .5; }
  .nk[data-dio="ograde"] .nk-nos, .nk[data-dio="ograde"] .nk-stup-s { opacity: .7; }
  .nk-mala-pul { animation: none; opacity: 0; }
  .nk.jk-zum .nk-pozornica { transition: none; }
}
@media print { .junak.nk { height: auto; } .nk-ui, .nk-pogoci { display: none; } }