@font-face{font-family:"Antonio";src:url("../../C/fonts/Antonio-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Satoshi";src:url("../../C/fonts/Satoshi-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Pinyon Script";src:url("../../C/fonts/PinyonScript-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Saira XC";src:url("../../A/fonts/SairaExtraCondensed-Black.ttf") format("truetype");font-weight:900;font-display:swap}
@font-face{font-family:"Saira XC";src:url("../../A/fonts/SairaExtraCondensed-Light.ttf") format("truetype");font-weight:300;font-display:swap}
@font-face{font-family:"Plex Mono";src:url("../../A/fonts/IBMPlexMono-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono";src:url("../../A/fonts/IBMPlexMono-Medium.ttf") format("truetype");font-weight:500;font-display:swap}

:root{
  --noc:#0B0614;
  --ljubicasta:#7C3AED;
  --ljubicasta-svijetla:#A78BFA;
  --lavanda:#C4B5FD;
  --zlatna:#F5C451;
  --tekst:#EFEAFF;
  --tekst-2:#D3CAEB;
  --tekst-3:#ABA1CB;
  --svijetlo:#f3eef9;
  --zlato:#f5c451;
  --rub:48px;
  --zlato-metal:linear-gradient(146deg,#FFF3C6 0%,#F5C451 14%,#A9771F 31%,#F4D27A 47%,#9B6A16 64%,#EDBD4C 81%,#FFEAA9 100%);
  --sw:min(100vw,1728px);
  --vu:min(calc(var(--sw) / 100),1.8vh);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{background:var(--noc);-webkit-text-size-adjust:100%;text-size-adjust:100%}

body{min-height:100vh;background:var(--noc);color:var(--tekst);font-family:"Satoshi",system-ui,-apple-system,sans-serif;font-weight:500;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;overflow-x:clip}
img,svg{display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
.skriveno{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
:focus-visible{outline:2px solid var(--lavanda);outline-offset:4px}

.vrh{position:fixed;left:0;right:0;top:0;height:96px;z-index:45;pointer-events:none}
.vrh>*{pointer-events:auto}
.znak{position:absolute;left:var(--rub);top:28px;width:29px;height:42px;color:var(--tekst)}
.znak::before{content:"";position:absolute;inset:-6px -11px}
.znak svg{width:100%;height:100%}
.ime{position:absolute;left:50%;top:33px;z-index:6;transform:translateX(-50%);padding-left:.06em;
  font:700 21px/1 "Antonio",sans-serif;letter-spacing:.06em;white-space:nowrap;color:var(--tekst)}

.meni{position:absolute;right:calc(var(--rub) - 6px);top:29px;width:44px;height:44px;display:grid;place-items:center;-webkit-tap-highlight-color:transparent}
.meni svg{width:32px;height:14px;overflow:visible;fill:var(--tekst)}
.meni path{transition:transform .3s cubic-bezier(.4,0,.2,1)}
@media (hover:hover){
  html:not(.meni-otvoren) .meni:hover .meni__gore{transform:translateX(2px)}
  html:not(.meni-otvoren) .meni:hover .meni__dole{transform:translateX(-2px)}
}
.zvuk{position:fixed;right:24px;bottom:23px;z-index:30;width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;background:rgba(11,6,20,.55);box-shadow:inset 0 0 0 1px rgba(196,181,253,.34);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.zvuk::before{content:"";position:absolute;inset:-2px}
.zvuk svg{width:15px;height:12px;fill:var(--tekst);transition:opacity .3s ease}

.zvuk--trake rect{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(.35);transition:transform .3s ease}
.zvuk--trake[aria-pressed="false"] svg{opacity:.5}
.zvuk--trake[aria-pressed="true"] rect{animation:zvuk-eq .85s ease-in-out infinite alternate}
.zvuk--trake[aria-pressed="true"] rect:nth-child(2){animation-delay:.13s}
.zvuk--trake[aria-pressed="true"] rect:nth-child(3){animation-delay:.26s}
.zvuk--trake[aria-pressed="true"] rect:nth-child(4){animation-delay:.39s}
@keyframes zvuk-eq{from{transform:scaleY(.18)}to{transform:scaleY(.95)}}

.meni-panel{--vu-m:min(calc(min(100vw,1728px) / 100),1.8vh);position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;
  overflow:auto;overscroll-behavior:contain;background:#0E0819;opacity:0;visibility:hidden;
  transition:opacity .5s cubic-bezier(.4,0,.2,1),visibility 0s linear .5s}
.meni-otvoren .meni-panel{opacity:1;visibility:visible;transition:opacity .5s cubic-bezier(.4,0,.2,1),visibility 0s}
.meni-otvoren body{overflow:hidden}
.meni-panel__sjaj{position:fixed;inset:0;pointer-events:none;
  background:radial-gradient(62% 56% at 50% 47%,rgba(124,58,237,.17),transparent 70%),radial-gradient(40% 42% at 88% 92%,rgba(91,33,182,.13),transparent 70%)}
.meni-panel__sadrzaj{position:relative;display:flex;flex-direction:column;align-items:center;margin:auto;padding:120px var(--rub) 72px;text-align:center}
.meni-panel__linkovi{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;column-gap:.4em;
  font:700 clamp(48px,calc(7 * var(--vu-m)),116px)/1.04 "Antonio",sans-serif;letter-spacing:-.02em;text-transform:uppercase}
.meni-panel__linkovi li{order:1;opacity:0;translate:0 26px;transition:opacity .5s ease-out,translate .5s ease-out}
.meni-panel__linkovi::before{content:"";order:2;flex-basis:100%;height:0}
.meni-panel__linkovi li:nth-child(n+4){order:3}
.meni-otvoren .meni-panel__linkovi li{opacity:1;translate:0 0}
.meni-otvoren .meni-panel__linkovi li:nth-child(1){transition-delay:.08s}
.meni-otvoren .meni-panel__linkovi li:nth-child(2){transition-delay:.125s}
.meni-otvoren .meni-panel__linkovi li:nth-child(3){transition-delay:.17s}
.meni-otvoren .meni-panel__linkovi li:nth-child(4){transition-delay:.215s}
.meni-otvoren .meni-panel__linkovi li:nth-child(5){transition-delay:.26s}
.meni-link{position:relative;display:inline-block;padding:0 .04em;color:rgba(239,234,255,.5);transition:translate .38s cubic-bezier(.16,1,.3,1)}
.meni-link:focus-visible{outline-offset:2px}

.meni-link__puno{position:absolute;inset:0;padding:inherit;color:var(--tekst);pointer-events:none;
  clip-path:polygon(0 -15%,0 -15%,-18% 115%,0 115%);transition:clip-path .38s cubic-bezier(.16,1,.3,1)}
.meni-link[aria-current="true"] .meni-link__puno,.meni-link:focus-visible .meni-link__puno{clip-path:polygon(0 -15%,118% -15%,100% 115%,0 115%)}
@media (hover:hover){
  .meni-link:hover{translate:0 -2px}
  .meni-link:hover .meni-link__puno{clip-path:polygon(0 -15%,118% -15%,100% 115%,0 115%)}
}
.meni-panel__mreze{margin-top:48px;opacity:0;transition:opacity .5s ease-out}
.meni-panel__mreze:empty{display:none}
.meni-panel__kredit{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 28px;margin-top:48px;
  font:400 12px/1.4 "Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:rgba(239,234,255,.55);opacity:0;transition:opacity .5s ease-out}
.meni-otvoren .meni-panel__mreze{opacity:1;transition-delay:.42s}
.meni-otvoren .meni-panel__kredit{opacity:1;transition-delay:.5s}

.heroj{position:relative;width:100%;height:100vh;height:100svh;isolation:isolate;overflow:hidden;z-index:1}

.pozadina{position:absolute;inset:0;overflow:hidden;z-index:0;
  background:radial-gradient(118% 82% at 50% 108%,#241050 0%,#170A35 30%,#10081F 56%,#0B0614 80%);
  background:radial-gradient(118% 82svh at 50% 108svh,#241050 0%,#170A35 30%,#10081F 56%,#0B0614 80%)}

.monogram{position:absolute;left:0;top:0;width:100%;height:100vh;height:100svh;overflow:visible;pointer-events:none}
.monogram img{position:absolute;left:50%;top:50%;max-width:none;height:auto;
  width:max(100%,160vh);margin-left:calc(max(100%,160vh) / -2);margin-top:calc(max(62.5%,100vh) / -2);
  width:max(100%,160svh);margin-left:calc(max(100%,160svh) / -2);margin-top:calc(max(62.5%,100svh) / -2)}
.sjaj{position:absolute;left:50%;top:60%;top:60svh;width:860px;height:960px;transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,rgba(162,116,255,.64) 0%,rgba(134,74,246,.46) 38%,rgba(110,50,216,.24) 62%,rgba(88,34,176,.08) 82%,rgba(80,30,160,0) 100%)}

.heroj__sloj{position:absolute;inset:0;z-index:1}

.predmet-okvir{position:absolute;inset:0;overflow:hidden;z-index:2;pointer-events:none}
.predmet{position:absolute;left:50%}
.predmet img{width:100%;height:auto}

.predmet--portret{top:12.5vh;width:min(99vh,62vw,calc(100vw - 500px));transform:translateX(-50%)}

.opis{font:500 14.5px/1.34 "Satoshi",sans-serif;color:var(--tekst-2);letter-spacing:.002em}

.opis--lijevo{position:absolute;left:var(--rub);top:74.2vh;top:max(74.2vh,calc(48vh + 236px));width:182px;z-index:3}
.opis--desno{position:absolute;left:calc(100% - 243px);top:74.2vh;width:196px;z-index:3}
.potpis{position:absolute;right:42px;top:51.4vh;z-index:3;font:400 58px/.9 "Pinyon Script",cursive;color:var(--ljubicasta-svijetla);text-align:right;white-space:nowrap}
.potpis span{display:block}
.potpis span + span{margin-top:2px;margin-right:6px}
.kartica-mala{position:absolute;left:var(--rub);top:48vh;width:124px;z-index:3}

.kartica{--deb:4px;--kos:12px;position:relative;filter:drop-shadow(0 18px 26px rgba(4,1,10,.62)) drop-shadow(0 3px 6px rgba(4,1,10,.5))}
.kartica__okvir{padding:var(--deb);background:var(--zlato-metal);
  clip-path:polygon(var(--kos) 0,100% 0,100% calc(100% - var(--kos)),calc(100% - var(--kos)) 100%,0 100%,0 var(--kos))}
.kartica__unutra{--k:calc(var(--kos) - var(--deb) * .586);position:relative;padding:1px;background:#4B3108;
  clip-path:polygon(var(--k) 0,100% 0,100% calc(100% - var(--k)),calc(100% - var(--k)) 100%,0 100%,0 var(--k))}
.kartica__slika{--k2:calc(var(--kos) - var(--deb) * .586 - .6px);width:100%;height:auto;
  clip-path:polygon(var(--k2) 0,100% 0,100% calc(100% - var(--k2)),calc(100% - var(--k2)) 100%,0 100%,0 var(--k2))}
.kartica__unutra::after{content:"";position:absolute;inset:1px;pointer-events:none;
  background:linear-gradient(128deg,rgba(255,255,255,.13) 0%,rgba(255,255,255,0) 30%,rgba(255,255,255,0) 72%,rgba(255,236,190,.06) 100%)}

.potpisani{--sk:min(calc(100vw / 1440),calc(100vh / 900));--ox:calc((100vw - 1440 * var(--sk)) / 2);
  --u:27.5px;--u10:calc(var(--u) * 10);--nula:-60px;--raster:4px;--crtica:rgba(196,181,253,.26);
  --karta:min(calc(24 * min(1vw,1.6vh)),28vh);
  --bj:min(1vh,calc(var(--vu) * .625));
  position:relative;z-index:2;height:100vh;height:100svh;min-height:560px;overflow:hidden;background:var(--noc);color:var(--svijetlo)}
@media (min-width:1280px){.potpisani{--karta:calc(16 * var(--vu))}}
.okno{position:relative;height:100%;overflow:hidden;overflow:clip}
.ploca{position:absolute;inset:0;overflow:hidden;overflow:clip;background:var(--noc)}
.ploca__sadrzaj{position:absolute;inset:0}
.noc-sjaj{position:absolute;inset:0;
  background:
    radial-gradient(58% 52% at 36% 16%,rgba(124,58,237,.17),transparent 70%),
    radial-gradient(46% 42% at 84% 62%,rgba(91,33,182,.12),transparent 70%),
    linear-gradient(180deg,rgba(11,6,20,0) 55%,rgba(5,2,10,.6) 100%)}

.noc-zraka{position:absolute;left:2%;top:-25%;width:34%;height:150%;transform:rotate(-21deg);pointer-events:none;
  background:linear-gradient(90deg,rgba(167,139,250,0) 0%,rgba(167,139,250,.045) 30%,rgba(196,181,253,.085) 50%,rgba(167,139,250,.04) 70%,rgba(167,139,250,0) 100%);
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 92%);mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 92%)}

.polje{position:absolute;left:0;top:0;bottom:0;width:300%;pointer-events:none;z-index:1}
.vodilje{position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(90deg,rgba(196,181,253,.075) 0 1px,transparent 1px var(--u10));
  background-position:calc(var(--nula) + var(--u10) - 1px) 0;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 78%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 78%,transparent 100%)}

.naslov{position:absolute;left:calc(var(--ox) + 40 * var(--sk));top:calc(24 * var(--sk));z-index:1;
  font-family:"Saira XC",sans-serif;font-weight:900;font-size:calc(232.832 * var(--sk));line-height:.8;letter-spacing:0;
  white-space:nowrap;text-transform:uppercase;color:transparent;
  background-image:
    radial-gradient(circle at 50% 50%,rgba(226,216,255,.26) 0 .7px,transparent 1.1px),
    radial-gradient(circle at 50% 50%,rgba(10,4,26,.45) 0 .78px,transparent 1.18px),
    linear-gradient(180deg,#8a66ec 0%,#8059e8 40%,#7550df 72%,#6a45d6 100%);
  background-size:var(--raster) var(--raster),var(--raster) var(--raster),100% 100%;
  background-position:0 0,calc(var(--raster) / 2) calc(var(--raster) / 2),0 0;
  -webkit-background-clip:text;background-clip:text}

.zkarta{--k-rub:4px;--k-trn:4px;--k-ploca:6px;position:relative;width:143px;height:209px;padding:var(--k-rub);border-radius:4px;
  background:
    linear-gradient(116deg,transparent 0 33%,rgba(255,250,226,.9) 42%,transparent 50%),
    linear-gradient(164deg,#fff7d6 0%,#ffd66e 10%,#d0921f 24%,#875709 37%,#e8b23f 50%,#fff0b0 60%,#dca233 72%,#7f520b 86%,#e9b647 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,246,210,.6),
    0 0 0 .5px rgba(92,58,6,.55),
    0 22px 30px -14px rgba(28,12,52,.55),
    0 3px 8px rgba(28,12,52,.2)}
.zkarta__slika{width:100%;height:100%;filter:drop-shadow(0 0 .7px rgba(64,38,2,.95))}
.zkarta__slika img{width:100%;height:100%;object-fit:cover;-webkit-user-drag:none;user-select:none;
  clip-path:polygon(0 0,100% 0,100% 100%,41% 100%,calc(41% - var(--k-ploca)) calc(100% - var(--k-ploca)),var(--k-trn) calc(100% - var(--k-ploca)),var(--k-trn) 57%,0 calc(57% - var(--k-trn)))}
.zkarta--redbull img{object-position:50% 100%}
.zkarta--desno img{object-position:100% 50%}

.zkarta__sjaj{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:var(--h,0);transition:opacity .25s ease;mix-blend-mode:screen;
  background:radial-gradient(circle at var(--gx,50%) var(--gy,28%),rgba(255,246,222,.26),rgba(255,246,222,0) 58%)}

.traka{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:calc(var(--sw) * .16)}
.rad{--b:0;--rz0:2.4deg;position:relative;flex:none;width:var(--karta);margin:0;translate:0 calc(var(--b) * var(--bj));
  perspective:1200px;perspective-origin:50% calc(var(--karta) * .7304)}
.rad:nth-child(5n+1){--b:-10}
.rad:nth-child(5n+2){--b:12}
.rad:nth-child(5n+3){--b:-15}
.rad:nth-child(5n+4){--b:8}
.rad:nth-child(5n){--b:-5}
.rad:nth-child(even){--rz0:-2.4deg}
.rad__kutija{position:relative;transform:rotate(var(--rz0));transition:transform .2s cubic-bezier(.22,1,.36,1)}
.rad .zkarta{--k-rub:6px;--k-trn:8px;--k-ploca:11px;width:100%;height:auto;aspect-ratio:230/336;border-radius:6px}
.rad figcaption{position:relative;left:50%;width:max-content;margin-top:20px;translate:-50% 0;text-align:center;white-space:nowrap;font-family:"Plex Mono",monospace;text-transform:uppercase}
.rad__ime{display:block;font-weight:500;font-size:14px;letter-spacing:.15em;color:var(--svijetlo)}
.rad__opis{display:block;margin-top:9px;font-weight:400;font-size:12px;letter-spacing:.17em;color:#a99fbb}
.rad__oznaka{display:inline-flex;align-items:center;gap:10px;margin-top:12px;font-weight:500;font-size:12px;letter-spacing:.2em;color:var(--zlato)}
.rad__oznaka::before{content:"";flex:none;width:18px;height:1px;background:currentColor;opacity:.8}

.lenjir{position:absolute;left:var(--nula);right:0;bottom:0;height:150px;pointer-events:none;z-index:1}
.lenjir__crtice{position:absolute;left:0;right:0;bottom:0;height:34px;
  background:
    linear-gradient(var(--crtica),var(--crtica)) left bottom / 100% 1px no-repeat,
    repeating-linear-gradient(90deg,var(--crtica) 0 1px,transparent 1px var(--u10)) left bottom / 100% 30px no-repeat,
    repeating-linear-gradient(90deg,var(--crtica) 0 1px,transparent 1px calc(var(--u) * 5)) left bottom / 100% 18px no-repeat,
    repeating-linear-gradient(90deg,var(--crtica) 0 1px,transparent 1px var(--u)) left bottom / 100% 10px no-repeat,
    repeating-linear-gradient(90deg,rgba(196,181,253,.16) 0 1px,transparent 1px calc(var(--u) / 2)) left bottom / 100% 5px no-repeat}
.lenjir__broj{position:absolute;bottom:44px;left:calc(var(--u10) * var(--n,1));transform:translateX(-50%);
  font-family:"Saira XC",sans-serif;font-weight:300;font-size:74px;line-height:.8;
  color:rgba(196,181,253,.13);letter-spacing:.01em}
.tackice{display:none}

html.scena-radova .heroj{position:sticky;top:0}
html.scena-radova .heroj__sloj{transform-origin:50% 100%;will-change:transform}
html.scena-radova .potpisani{height:auto;min-height:0;overflow:visible;background:transparent;pointer-events:none}
html.scena-radova .okno{position:sticky;top:0;height:100vh}

html.scena-radova .ploca{inset:0 -100vmax -100vmax -100vmax;transform-origin:100vmax 0;pointer-events:auto;will-change:transform;
  -webkit-user-select:none;user-select:none}
html.scena-radova .ploca__sadrzaj{inset:auto;left:100vmax;top:0;width:calc(100% - 200vmax);height:calc(100% - 100vmax);transform-origin:0 0;will-change:transform}
html.scena-radova .traka{right:auto;justify-content:flex-start;width:max-content;padding:0 calc(var(--sw) * .08) 0 calc(var(--sw) * .14);will-change:transform}
html.scena-radova .polje{will-change:transform}
html.scena-radova .rad__kutija{transform:none}
html.scena-radova .rad--ceka .rad__kutija{visibility:hidden}
html.scena-radova .zkarta:hover,html.scena-radova .zkarta:has(.zkarta__dugme:focus-visible){translate:none}
html.vuce-karte .ploca,html.vuce-karte .zkarta__dugme{cursor:grabbing}
html.scena-radova .rad figcaption{transition:transform .3s cubic-bezier(.22,1,.36,1)}
html.scena-radova .rad--gore figcaption{transform:translateY(24px)}

[data-sekcija][tabindex="-1"]:focus{outline:none}

@keyframes karta-lebdi{0%{transform:translateY(1.3%)}50%{transform:translateY(-1.3%)}100%{transform:translateY(1.3%)}}
html.scena-radova .rad__lebdi{animation:karta-lebdi 6.4s ease-in-out infinite}
html.scena-radova .rad:nth-child(3n+2) .rad__lebdi{animation-duration:7.5s}
html.scena-radova .rad:nth-child(3n) .rad__lebdi{animation-duration:8.6s}

.let{position:absolute;left:0;top:0;z-index:5;visibility:hidden;pointer-events:none;transform-style:preserve-3d;cursor:pointer;-webkit-tap-highlight-color:transparent}
.let.leti{visibility:visible;pointer-events:auto}
.let__lice,.let__nalicje{position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.let__nalicje{transform:rotateY(180deg);border-radius:6px;background:var(--zlato-metal);box-shadow:inset 0 0 0 1px rgba(255,246,210,.55),0 18px 30px -12px rgba(4,1,10,.6)}
.let__nalicje::after{content:"";position:absolute;inset:7px;border-radius:3px;background:radial-gradient(70% 60% at 50% 40%,#2a1650,#120a24)}
.let .kartica,.let .kartica__okvir,.let .kartica__unutra{height:100%}
.let .kartica__slika{height:100%;object-fit:cover}
.let .zkarta{width:100%;height:100%;aspect-ratio:auto}

@media (max-width:899px){
  :root{--rub:24px}
  html{scrollbar-width:none}
  ::-webkit-scrollbar{width:0;height:0;display:none}
  .znak{top:20px;width:23.5px;height:34px}
  .ime{top:30px;font-size:15px}
  .meni{right:calc(var(--rub) - 8px);top:16px}
  .meni svg{width:28px;height:12px}
  .zvuk{right:24px;bottom:24px}
  .meni-panel__sadrzaj{padding:104px var(--rub) 64px}
  .meni-panel__linkovi{flex-direction:column;align-items:center;font-size:clamp(30px,13vw,72px);line-height:1.08}
  .meni-panel__linkovi::before{display:none}
  .meni-panel__kredit{flex-direction:column;align-items:center;margin-top:40px;font-size:11px}

  .heroj{height:calc(100vh + 72px);height:calc(100svh + 72px)}

  .monogram img{width:max(100%,46.2085vh);margin-left:calc(max(100%,46.2085vh) / -2);margin-top:calc(max(216.4103%,100vh) / -2);
    width:max(100%,46.2085svh);margin-left:calc(max(100%,46.2085svh) / -2);margin-top:calc(max(216.4103%,100svh) / -2)}
  .sjaj{top:66%;top:66svh;width:560px;height:680px}
  .predmet--portret{top:24vh;width:min(177vw,82vh)}
  .opis{font-size:14px;line-height:1.42}
  .opis--desno{left:24px;top:92px;width:184px}
  .potpis{right:24px;top:98px;font-size:31px}
  .potpis span + span{margin-top:1px;margin-right:4px}

  .kartica-mala,.opis--lijevo{display:none}

  .potpisani{--u:13px;--nula:0px;--raster:3px;--pu:min(1vw,.5svh);--karta:calc(66 * var(--pu));
    height:auto;min-height:0;margin-top:-240px;background:transparent;pointer-events:none}
  .okno{height:auto}
  .ploca{position:relative;inset:auto;padding:232px 0 112px;clip-path:polygon(0 214px,100% 172px,100% 100%,0 100%);pointer-events:auto}
  .ploca__sadrzaj{position:static}
  .naslov{position:relative;left:auto;top:auto;margin:0 24px;font-size:calc((100vw - 48px) * .1712);line-height:.82}
  .traka{position:relative;inset:auto;justify-content:flex-start;align-items:flex-start;gap:14px;margin-top:28px;padding:12px 24px 10px;
    overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;scroll-padding-inline:24px;-webkit-overflow-scrolling:touch}
  .traka::-webkit-scrollbar{display:none}
  .rad{translate:none;perspective:none}
  .rad__kutija{transform:none}
  .rad figcaption{left:0;width:auto;translate:none;margin-top:18px;white-space:normal;transition:opacity .5s ease}
  html.skrol-spreman .rad:not(.aktivan) figcaption{opacity:.3}
  .rad__ime{font-size:14px;letter-spacing:.13em}
  .rad__opis{font-size:14px;letter-spacing:.1em;margin-top:7px}
  .rad__oznaka{font-size:14px;letter-spacing:.14em;margin-top:9px;align-items:flex-start}
  .rad__oznaka::before{margin-top:.6em}
  .rad__sep{display:none}
  .rad__red2{display:block}

  .zkarta--video .zkarta__dugme::after{content:"";position:absolute;right:14px;bottom:14px;width:40px;height:40px;border-radius:50%;
    background:rgba(124,58,237,.8) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M4 2.2v9.6a.6.6 0 0 0 .92.5l7.4-4.8a.6.6 0 0 0 0-1L4.92 1.7A.6.6 0 0 0 4 2.2z' fill='%23EFEAFF'/%3E%3C/svg%3E") 55% 50% / 14px no-repeat;
    box-shadow:0 0 0 1px rgba(196,181,253,.45),0 6px 16px rgba(4,1,10,.5)}
  .tackice{display:flex;justify-content:center;gap:9px;margin-top:26px}
  .tackice i{width:5px;height:5px;border-radius:3px;background:rgba(243,238,249,.32);transition:width .3s ease,background-color .3s ease}
  .tackice i.aktivna{width:18px;background:var(--zlato)}
  .polje{width:200%}
  .lenjir{height:70px}
  .lenjir__crtice{height:26px;background-size:100% 1px,100% 22px,100% 14px,100% 8px,100% 4px}
  .lenjir__broj{font-size:30px;bottom:30px}
}

html{scrollbar-gutter:stable}
.ulaz,.ulaz body{overflow:hidden}
.predulaz{display:none;position:fixed;inset:0;z-index:100;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:var(--noc)}
.ulaz .predulaz{display:flex}
.predulaz__znak{position:relative;width:44px;height:64px}
.predulaz__znak svg{position:absolute;inset:0;width:100%;height:100%}
.predulaz__baza{color:rgba(196,181,253,.14)}
.predulaz__puno{color:var(--tekst);clip-path:inset(calc(100% - var(--p,0%)) 0 0 0)}
.predulaz__broj{padding-left:.24em;font:400 10px/1 "Plex Mono",monospace;letter-spacing:.24em;color:rgba(196,181,253,.55);font-variant-numeric:tabular-nums}
.predulaz__broj b{font-weight:400}
.scena-ulaz{display:none;position:fixed;inset:0;z-index:95;pointer-events:none}
.ulaz .scena-ulaz{display:block}

.scena-ulaz__okvir{position:absolute;top:0;left:50%;height:100%;aspect-ratio:9/16;translate:-50% 0;overflow:hidden;background:#05020b;
  box-shadow:0 40px 120px rgba(4,1,10,.6)}
.scena-ulaz__video{width:100%;height:100%;object-fit:cover}

.ulaz .vrh,.ulaz .ime,.ulaz .opis--lijevo,.ulaz .zvuk,.ulaz .predmet-okvir,.ulaz .kartica-mala,.ulaz .kartica__slika{opacity:0}
.ulaz .slovo:not(.vidi){opacity:0}
.ulaz .potpis span{clip-path:inset(-60% 100% -60% -14%)}
.potpis span{width:fit-content;margin-left:auto}
.slovo.kursor{position:relative}
.slovo.kursor::after{content:"";position:absolute;left:100%;top:.12em;bottom:.04em;width:1.5px;margin-left:1px;background:var(--lavanda)}

.kartica-mala{-webkit-tap-highlight-color:transparent}
.kartica,.kartica__okvir,.kartica__unutra{display:block}
.kartica-mala .kartica{transition:transform .5s cubic-bezier(.22,1,.36,1)}
.kartica-mala:focus-visible{outline-offset:6px}

.zkarta{transition:translate .5s cubic-bezier(.22,1,.36,1),opacity .3s ease}
.zkarta.otvorena{opacity:0;transition:none}
.zkarta__dugme{position:absolute;inset:0;z-index:1;border-radius:inherit;-webkit-tap-highlight-color:transparent}
.zkarta:has(.zkarta__dugme:focus-visible){translate:0 -6px}
@media (hover:hover){
  .kartica-mala:hover .kartica{transform:translateY(-5px) scale(1.035)}
  .zkarta:hover{translate:0 -6px}
}

html.plejer-otvoren{overflow:hidden}
.plejer{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;
  background:transparent;color:var(--tekst);overflow:hidden;overscroll-behavior:contain}
.plejer::backdrop{background:transparent}
.plejer__pozadina{position:absolute;inset:0;background:rgba(7,3,14,.8);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.plejer__okvir{position:absolute;overflow:hidden;border-radius:10px;background:#07030e;
  box-shadow:0 0 0 1px rgba(196,181,253,.14),0 34px 90px rgba(2,0,8,.6)}
.plejer__slika,.plejer__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.plejer__video{opacity:0;cursor:pointer;transition:opacity .35s ease}
.plejer__video.radi{opacity:1}
.plejer__dugme{position:relative;z-index:2;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;
  background:rgba(11,6,20,.52);box-shadow:inset 0 0 0 1px rgba(196,181,253,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  transition:background-color .2s ease}
.plejer__dugme svg{width:14px;height:14px}
.plejer__zatvori{position:absolute;top:14px;right:14px}
.plejer__traka{position:absolute;z-index:2;left:14px;bottom:16px;display:flex;gap:8px}

.plejer__naziv{position:absolute;z-index:2;left:50%;top:100%;margin:0;padding-top:16px;width:max-content;max-width:calc(100vw - 32px);
  transform:translateX(-50%);font-family:"Plex Mono",monospace;text-transform:uppercase;text-align:center;pointer-events:none}
.plejer__naziv span{display:block}
.plejer__ime{font-weight:500;font-size:13px;line-height:1.35;letter-spacing:.16em;color:var(--tekst)}
.plejer__oznaka{margin-top:6px;font-weight:500;font-size:11px;line-height:1.35;letter-spacing:.18em;color:var(--zlatna)}
.plejer__oznaka:empty{display:none}
.plejer__napredak{position:absolute;z-index:2;left:0;right:0;bottom:0;height:2px;background:rgba(239,234,255,.16);pointer-events:none}
.plejer__napredak i{display:block;height:100%;background:var(--zlatna);transform:scaleX(0);transform-origin:0 50%}
.ik-pusti,.ik-tiho,.plejer.pauzirano .ik-pauza,.plejer.utisano .ik-ton{display:none}
.plejer.pauzirano .ik-pusti,.plejer.utisano .ik-tiho{display:block}
.plejer.slika-samo .plejer__video,.plejer.slika-samo .plejer__traka,.plejer.slika-samo .plejer__napredak,.plejer.bez-tona .plejer__ton{display:none}
@media (hover:hover){.plejer__dugme:hover{background:rgba(124,58,237,.6)}}

@media (max-width:899px){
  .scena-ulaz__okvir{left:0;width:100%;aspect-ratio:auto;translate:none;box-shadow:none}
  .plejer__zatvori{top:10px;right:10px}
  .plejer__traka{left:10px;bottom:12px}
  .plejer__naziv{padding-top:14px}
  .plejer__ime{font-size:12px;letter-spacing:.13em}
  .plejer__oznaka{font-size:10.5px;letter-spacing:.13em}
}
@media (prefers-reduced-motion:reduce){
  .zkarta,.kartica-mala .kartica,.plejer__video,.plejer__dugme{transition:none}
  .zvuk--trake[aria-pressed="true"] rect{animation:none;transform:scaleY(.6)}
  .meni-panel,.meni-panel__linkovi li,.meni-link,.meni-link__puno,.meni-panel__mreze,.meni-panel__kredit,.meni path{transition:none!important}
  .meni-panel__linkovi li{translate:none}
  .rad__lebdi{animation:none!important}
}