/* ============================================================================
   UC POLICE PANEL — oblikovna plast "UC × NoPixel"
   ----------------------------------------------------------------------------
   Ta datoteka se naloži ZADNJA, za core.css, public.css in panel.css, in
   spletišče preobleče v slog, kakršnega ima nopixel.net — v barvah
   UnderControla.

   Kaj je prevzeto iz NoPixla:

     ostri vogali       nič zaobljenosti; namesto nje ima plošča odrezan
                        zgornji levi kot (pri njih clip-path 11 px)
     zgoščena tipografija  vsi naslovi so VELIKE TISKANE, težke in ozke
     bloki              poln pravokotnik barve, ki leži čez fotografijo,
                        in napis v njem
     oštevilčeni odseki "01 — KDO SMO", številka v enoširinski pisavi
     ravne plošče       brez sence in brez stekla; ločuje jih lasasta črta
     ena barva          slika nosi barvo, vmesnik je črno-bel z enim poudarkom

   Kaj ostane UnderControlovo:

     ledena modra       --glow #7FD4FF ostaja edini poudarek
     pisave             Rajdhani (naslovi) in JetBrains Mono (oznake);
                        NoPixel ima Barlow Condensed in Geist, a Rajdhani
                        je prav tako zgoščena tehnična pisava in je že tu,
                        zato ni treba uvažati tujih datotek (CSP jih ne bi
                        spustil skozi)
     vsebina            nič se ne premakne; spremeni se samo videz

   Odseki:
     1 žetoni in osnova        5 plošče, kartice, slike
     2 odrezan kot             6 javne strani
     3 tipografija             7 panel
     4 gumbi in polja          8 telefon in tiskanje
   ========================================================================== */

/* ====================================================== 1. ŽETONI IN OSNOVA */
:root{
  /* Zaobljenosti ni več. Vse troje kaže na 0, zato se cela stran — javni
     del in panel — zravna z eno samo spremembo.                          */
  --r-card:0px;
  --r-ctl:0px;
  --r-sm:0px;
  --r-pill:0px;

  /* Velikost odrezanega kota. NoPixel ima 11 px; mi 12, ker so naše
     plošče za spoznanje večje.                                          */
  --cut:12px;
  --cut-s:8px;

  /* Podlaga je temnejša in bolj nevtralna kot prej: fotografija mora biti
     edino, kar na strani sveti.                                         */
  --surf-0:#060708;
  --surf-1:#0C0D0F;
  --surf-2:#121417;
  --surf-3:#191C20;

  --line:rgba(255,255,255,.10);
  --line-2:rgba(255,255,255,.18);
  --line-3:rgba(255,255,255,.28);

  /* Pisavi sta isti kot pri NoPixlu: Barlow Condensed za naslove, Geist
     za besedilo. Enosirinska ostane JetBrains Mono, ki je ze tu.       */
  --f-display:"Barlow Condensed","Rajdhani","Segoe UI",system-ui,sans-serif;
  --f-body:"Geist","Segoe UI",system-ui,-apple-system,sans-serif;

  /* Sence izklopimo. NoPixel plošč ne dviguje — loči jih črta.          */
  --sh-1:none;
  --sh-2:none;
  --sh-3:0 24px 60px rgba(0,0,0,.6);
}

/* Fotografija ne sme biti mehka: ostri vogali veljajo tudi zanjo. */
img,video,canvas,picture{border-radius:0 !important;}

/* ========================================================= 2. ODREZAN KOT
   Razreda .cut in .cut-btn sta v HTML že od prve različice spletišča. Takrat
   sta vogale samo zaokrožila. Zdaj delata tisto, za kar sta bila mišljena:
   odrežeta zgornji levi kot.

   Rob ob rezu: clip-path odreže tudi obrobo, zato diagonala nima črte.
   Pri polnih ploščah to ni vidno. Kjer je obroba nosilka oblike, uporabimo
   .np-rez, ki obrobo nariše s podlago in jo od znotraj prekrije.        */
.cut,.cut-btn,.np-rez{
  border-radius:0;
  clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut));
}
.cut-btn,.np-rez-s{
  clip-path:polygon(var(--cut-s) 0,100% 0,100% 100%,0 100%,0 var(--cut-s));
}

/* Obrobljena plošča z rezom. Podlaga elementa je barva črte, notranji sloj
   pa pravo ozadje — med njima ostane 1 px, ki je videti kot obroba in teče
   tudi čez diagonalo.                                                    */
.np-rob{
  position:relative;border:0 !important;background:var(--line-2) !important;
  clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut));
}
.np-rob::before{
  content:"";position:absolute;inset:1px;z-index:0;background:var(--surf-1);
  clip-path:polygon(calc(var(--cut) - 1px) 0,100% 0,100% 100%,0 100%,0 calc(var(--cut) - 1px));
}
.np-rob > *{position:relative;z-index:1;}

/* =============================================================== 3. TIPOGRAFIJA
   NoPixel ima eno samo pravilo: naslov je velik, zgoščen in v velikih
   tiskanih. Razlike med ravnmi ne nosi slog, ampak velikost.            */
h1,h2,h3,
.h-xl,.h-lg,.h-md,.h-sm,
.sec-head h2,.card-head h2,.sh h2{
  font-family:var(--f-display);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.004em;
  line-height:1.02;
}
/* Barlow Condensed je ozji od Rajdhanija, zato naslovi pri isti meri
   zgledajo manjsi. Mere so zato za priblizno desetino vecje.          */
.h-xl,h1{font-size:clamp(2.9rem,6.8vw,5.5rem);}
.h-lg{font-size:clamp(2.2rem,4.8vw,3.7rem);}
h2,.sec-head h2{letter-spacing:.002em;}

/* Glavni naslov strani je posevno — natanko tako, kot ima NoPixel naslove
   clankov. Vse drugo ostane pokoncno, sicer poteza izgubi pomen.      */
h1,.h-xl,.pr-naslovnica h2{font-style:italic;font-weight:800;}
h1 .r2,h1 em,.h-xl em{font-style:italic;}
/* Naslov v glavi panela in nad prijavnim obrazcem nista naslova strani,
   ampak oznaki vmesnika. Posevnica tam ne pove nicesar, zato ju izvzamemo. */
#naslov,.prijava h1,h1.h-md{font-style:normal;font-weight:700;}

/* Nadnaslov je oznaka, ne stavek: enoširinska pisava, široko razprta.   */
.eyebrow,.kicker,.znacka,.np-oznaka{
  font-family:var(--f-mono) !important;
  font-weight:500;
  font-size:.62rem !important;
  letter-spacing:.24em !important;
  text-transform:uppercase;
  color:var(--glow);
}

/* Oštevilčeni odseki. Števec teče čez vse odseke strani, oznaka pa dobi
   pred seboj številko in kratko črto — natanko kot "01 What's New".     */
body{counter-reset:np-odsek;}
.section{counter-increment:np-odsek;}
.section > .wrap > .sec-head > .eyebrow{
  display:inline-flex;align-items:center;gap:13px;
}
/* V core.css sta ::before in ::after črtici 16 x 2 px. Številka potrebuje
   pravo škatlo, zato jima tu pobrišemo mere in podlago.                */
.section > .wrap > .sec-head > .eyebrow::before{
  content:counter(np-odsek,decimal-leading-zero);
  width:auto;height:auto;background:none;border-radius:0;
  font-size:1.65em;line-height:1;letter-spacing:.02em;color:var(--tx-1);
}
.section > .wrap > .sec-head > .eyebrow::after{
  content:"";width:36px;height:1px;background:var(--line-3);border-radius:0;
}
/* Pri sredinskih naslovih oznaka stoji nad njimi in je poravnana z njimi. */
.sec-head.is-centered .eyebrow{justify-content:center;}

/* ======================================================= 4. GUMBI IN POLJA */
.btn,.btn-primary,.btn-ghost,.lang button,.lang a{
  position:relative;
  border-radius:0 !important;
  border:0 !important;
  font-family:var(--f-display);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.09em;
  clip-path:polygon(var(--cut-s) 0,100% 0,100% 100%,0 100%,0 var(--cut-s));
  transition:background .24s var(--e-out),color .24s var(--e-out),
             transform .2s var(--e-out);
}
/* Obroba gumba je prekrivna plast, ne border — samo tako se obarva tudi
   poševnica na odrezanem kotu. Odsev, ki je prej potoval čez gumb
   (core.css, .btn::after), smo zato opustili.                          */
.btn::after,.lang button::after,.lang a::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:var(--line-2);
  transition:background .24s var(--e-out);
  transform:none !important;left:0 !important;top:0;width:auto;height:auto;
  clip-path:polygon(evenodd,
    var(--cut-s) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut-s), var(--cut-s) 0,
    calc(var(--cut-s) + 0.4142px) 1px, calc(100% - 1px) 1px,
    calc(100% - 1px) calc(100% - 1px), 1px calc(100% - 1px),
    1px calc(var(--cut-s) + 0.4142px), calc(var(--cut-s) + 0.4142px) 1px);
}
.btn:hover::after{background:var(--glow);}
/* Glavni gumb je poln blok ledene barve s črnim napisom — najmočnejši
   kontrast na strani, zato ga sme biti na zaslonu samo eden.            */
.btn-primary{
  background:var(--glow) !important;
  color:#05080C !important;
  box-shadow:none !important;
}
.btn-primary::after{background:var(--glow);}
.btn-primary:hover{background:var(--ice-50) !important;}
.btn-primary:hover::after{background:var(--ice-50);}
.btn-ghost,.btn:not(.btn-primary){
  background:transparent !important;
  color:var(--tx-1) !important;
}
.btn-ghost:hover,.btn:not(.btn-primary):hover{color:var(--glow) !important;}
/* Puščica za napisom. NoPixel jo ima na vsakem gumbu, ki pelje naprej.
   Nariše jo ::before in ne ::after: ::after je v core.css odsev, ki potuje
   čez gumb, in ta mora ostati. V zložljivi vrstici jo "order" postavi na
   konec, čeprav je ::before.                                            */
.btn-primary,.btn-ghost{display:inline-flex;align-items:center;}
.btn-primary::before,.btn-ghost::before{
  content:"→";order:9;margin-left:10px;font-family:var(--f-mono);font-size:.9em;
  transition:transform .2s var(--e-out);
}
.btn-primary:hover::before,.btn-ghost:hover::before{transform:translateX(3px);}
/* Gumbi v obrazcih, ki ne peljejo naprej, puščice ne potrebujejo. */
.btn-primary.je-brez::before,.btn-ghost.je-brez::before{content:none;}

input,select,textarea,.input,.search .input{
  border-radius:0 !important;
}
input:focus,select:focus,textarea:focus,.input:focus{
  border-color:var(--glow) !important;box-shadow:none !important;
}

/* ================================================ 5. PLOŠČE, KARTICE, SLIKE */
.panel,.card,.dok,.np-ploscа{
  border-radius:0 !important;
  box-shadow:none !important;
  background:var(--surf-1);
  border:1px solid var(--line);
}
/* Plošča se ob prehodu miške ne dvigne in ne dobi črte na vrhu. Namesto
   tega se po njej razlije svetloba — glej odsek 5b.                     */
.is-liftable{transform:none !important;}
.is-liftable:hover{transform:none !important;}

/* Blok: poln pravokotnik, ki leži čez fotografijo, z naslovom v sebi.
   To je najbolj prepoznavna poteza NoPixla.                             */
.np-blok{
  display:inline-block;padding:14px 26px 16px;background:#070809;
  clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut));
}
.np-blok.je-bel{background:#F4F8FC;color:#06080B;}
.np-blok.je-led{background:var(--glow);color:#05080C;}
.np-blok > *{margin:0;}

/* ============================================================ 6. JAVNE STRANI */
/* Glava: steklo ostane, a brez zaobljenosti in z ostro črto pod seboj.  */
.site-head{
  background:linear-gradient(180deg,rgba(8,10,13,.78),rgba(6,7,8,.62)) !important;
  border-bottom:1px solid var(--line) !important;
  box-shadow:none !important;
}
.site-nav a:not(.btn){
  border-radius:0 !important;
  font-family:var(--f-display);font-weight:600;
  text-transform:uppercase;letter-spacing:.1em;font-size:.82rem;
  background:transparent !important;
}
.site-nav a:not(.btn)::after{
  content:"";position:absolute;left:12px;right:12px;bottom:6px;height:2px;
  background:var(--glow);transform:scaleX(0);transform-origin:left;
  transition:transform .24s var(--e-out);
}
.site-nav a:not(.btn){position:relative;}
.site-nav a:not(.btn):hover::after,.site-nav a:not(.btn).is-here::after,
.site-nav a:not(.btn)[aria-current]::after{
  transform:scaleX(1);
}
.site-nav a:not(.btn).is-here,.site-nav a:not(.btn)[aria-current]{color:var(--tx-1) !important;}

.lang{border-radius:0 !important;overflow:hidden;}
.lang button,.lang a{letter-spacing:.12em;}

/* Gumb za vstop v zaprti del. Ikona stoji pred napisom, zato je gumb
   prepoznaven tudi, preden ga prebereš.                                */
.je-prijava{gap:9px;}
.je-prijava svg{width:15px;height:15px;flex:none;}
.je-prijava::before{content:none;}          /* puščice tu ne rabimo */

/* Ploščica na domači strani je z okvirjem postala kartica. Fotografija
   sega do roba, besedilo pod njo pa potrebuje odmik, sicer se dotika
   okvirja.                                                             */
.zid-kos{padding-bottom:clamp(16px,1.4vw,20px);}
.zid-kos figure{border:0 !important;margin-bottom:clamp(13px,1.2vw,16px);}
.zid-kos h3,.zid-kos p{padding-inline:clamp(16px,1.4vw,20px);}

/* Uvodni zaslon: naslov v bloku, podnapis v drugem. */
.hero .lede{max-width:52ch;}
.hero-in .h-xl{text-wrap:balance;}

/* Vrstica številk pod uvodom je v NoPixlu tabela podatkov, ne okras. */
.count,.hero-st b,.hero-st strong{
  font-family:var(--f-display);font-weight:700;letter-spacing:-.01em;
}
.hero-st,.stevilke{border-top:1px solid var(--line);}

/* Noga */
.site-foot{
  background:#050607 !important;border-top:1px solid var(--line) !important;
  box-shadow:none !important;
}
.site-foot a{border-radius:0 !important;}

/* Pas (citat čez fotografijo) dobi blokovno obravnavo. */
.pas .podpis,.pas blockquote{border-radius:0 !important;}

/* =================================================================== 7. PANEL */
.rail,.rail-nav a,.railNav a,#railNav a,
.chip,.tag,.pill,.badge,.znak,
.skeleton,.toast,.modal,.sheet{
  border-radius:0 !important;
}
/* Dejavna postavka je preprost pravokotnik z debelo črto ob svojem levem
   robu. Svetla črtica, ki je prej lebdela zunaj postavke, ob samem robu
   zaslona (panel.css, .rail-nav a.is-here::before), je odstranjena.

   Črto riše notranja senca in ne obroba: tako se besedilo ob preklopu ne
   premakne za tri pike.                                                */
.rail-nav a,#railNav a{
  border:0 !important;
  font-family:var(--f-display);font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;font-size:.84rem;
  transition:background .2s var(--e-out),color .2s var(--e-out),
             box-shadow .2s var(--e-out);
}
.rail-nav a.is-here::before{content:none !important;}
.rail-nav a.is-here,#railNav a.is-here{
  background:var(--surf-3) !important;
  box-shadow:inset 3px 0 0 var(--glow) !important;
  color:var(--tx-1) !important;
}
.rail-nav a:hover:not(.is-here){box-shadow:inset 3px 0 0 var(--line-3);}
/* Okrogli ostanejo samo tisti elementi, ki so res pike ali obrazi. */
.avatar,.avatar img,.foto-krog,.dot,.pika,.utrip,.pin .krog,.pr-znak{
  border-radius:50% !important;
}

/* Priročniki prevzamejo isti rez kot vse ostalo. */
.pr-polica,.pr-pog,.pr-naslovnica,.pr-kazalo,.pr-ploscica,.pr-stopnja,
.pr-koraki li,.pr-opomba,.pr-primer,.pr-koda,.pr-cin-skupina,.pr-uniforma,
.pr-slika,.pr-tabela-ovoj,.pr-polja,.pr-orodja,.pr-ukazi code{
  border-radius:0 !important;
}
.pr-polica,.pr-naslovnica{
  clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut));
}
.pr-pog-naslov,.pr-naslovnica h2,.pr-del-glava h3,.pr-polica h3{
  text-transform:uppercase;letter-spacing:.01em;
}
.pr-kazalo a{border-radius:0 !important;}
.pr-cin-skupina li,.pr-uniforma-opis li{border-radius:0 !important;}

/* ============================================ 5b. OKVIR OB ODREZANEM KOTU
   Problem: clip-path odreže tudi obrobo, zato diagonala ostane brez črte.
   Rešitev, kakršno uporablja prodigyrp.net: okvir ni obroba elementa,
   ampak prekrivna plast, ki jo nariše ::after. Njena oblika je zunanji
   obris MINUS notranji obris (pravilo evenodd) — med njima ostane črta,
   debela eno piko, in ta teče tudi čez rez.

   0.4142 px je zamik, ki ga pri 45-stopinjskem rezu zahteva vzporednica,
   oddaljena za eno piko (√2 − 1).

   Ob prehodu miške črta postane preliv: od ledene na zgornjem levem robu
   do skoraj nevidne na spodnjem desnem. To je tisti "gradient rob".   */
.panel,.card,.dok,.enota,.zid-kos,.stopnja,.gal-item,
.pr-polica,.pr-pog,.pr-naslovnica,.np-okvir{
  position:relative;
  border:0 !important;
  clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut));
}
/* Galerija ima ::after že zaseden s preliviom čez sliko, zato tam okvir
   nariše ::before.                                                     */
.panel::after,.card::after,.dok::after,.enota::after,.zid-kos::after,
.stopnja::after,.gal-item::before,
.pr-polica::after,.pr-pog::after,.pr-naslovnica::after,.np-okvir::after{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:var(--line);
  transition:background .3s var(--e-out);
  clip-path:polygon(evenodd,
    var(--cut) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut), var(--cut) 0,
    calc(var(--cut) + 0.4142px) 1px, calc(100% - 1px) 1px,
    calc(100% - 1px) calc(100% - 1px), 1px calc(100% - 1px),
    1px calc(var(--cut) + 0.4142px), calc(var(--cut) + 0.4142px) 1px);
  transform:none !important;
  width:auto;height:auto;left:0;top:0;
}
.panel:hover::after,.card:hover::after,.dok:hover::after,
.enota:hover::after,.zid-kos:hover::after,.stopnja:hover::after,
.gal-item:hover::before,
.pr-polica:hover::after,.np-okvir:hover::after{
  background:linear-gradient(135deg,var(--glow) 0%,rgba(127,212,255,.34) 32%,
                             rgba(255,255,255,.10) 68%,rgba(255,255,255,.06) 100%);
}

/* ------------------------------------------- tekoča obarvanost ob miški
   Ob prehodu miške se po plošči razlije ledena svetloba. Narejena je kot
   prva plast ozadja, ki v mirovanju stoji zunaj škatle (lega 150 %), ob
   prehodu pa priteče čeznjo. Animira se torej lega ozadja — brez dodatnega
   elementa in brez težav z vrstnim redom risanja, ki bi jih prinesla
   prekrivna plast nad besedilom.

   Druga plast je stalen, zelo blag sij iz odrezanega kota: plošča naj bo
   videti osvetljena z leve zgoraj, ne pobarvana.                       */
.panel,.card,.dok,.zid-kos,.stopnja,.pr-polica,.news{
  background-image:radial-gradient(420px 280px at 0% 0%,
    rgba(127,212,255,.055),rgba(127,212,255,0) 70%);
  background-repeat:no-repeat;
}
.enota{
  background-image:
    radial-gradient(520px 320px at 0% 0%,rgba(127,212,255,.06),rgba(127,212,255,0) 70%),
    linear-gradient(180deg,var(--surf-1),var(--surf-0)) !important;
  background-repeat:no-repeat;
}

/* Svetloba ob prehodu miške je svoja plast, ki ji spreminjamo samo
   motnost. Lege ozadja grafična kartica ne zna animirati — vsak korak bi
   zahteval ponovno risanje cele plošče in prav to je prej štekalo.
   Motnost zna in jo opravi brez risanja, zato je gibanje gladko.

   Plast leži nad vsebino, a je zelo blaga in brez odziva na miško, zato
   je videti kot svetloba, ki pade čez ploščo, in ne kot zavesa.      */
.panel::before,.card::before,.dok::before,.zid-kos::before,.stopnja::before,
.pr-polica::before,.enota::before{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(135deg,rgba(127,212,255,.15),
             rgba(127,212,255,.045) 40%,rgba(127,212,255,0) 68%);
  opacity:0;transition:opacity .34s var(--e-out);
}
.panel:hover::before,.card:hover::before,.dok:hover::before,
.zid-kos:hover::before,.stopnja:hover::before,.pr-polica:hover::before,
.enota:hover::before{opacity:1;}

/* Dvig in senca ob prehodu miške nista več potrebna: pove svetloba. */
.enota:hover,.gal-item:hover,.stopnja:hover,.news:hover{
  transform:none !important;box-shadow:none !important;
}
.gal-item:hover img{transform:scale(1.05);}

/* Novica ima zgoraj fotografijo; svetloba pade čez sliko, besedilo pa
   ostane nad njo, da je naslov vedno berljiv.                          */
.news{isolation:isolate;}
.news::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(135deg,rgba(127,212,255,.26),rgba(127,212,255,.07) 46%,
                             rgba(127,212,255,0) 76%);
  opacity:0;transition:opacity .34s var(--e-out);
}
.news:hover::before{opacity:1;}
.news-top{position:relative;z-index:0;}
.news-body{position:relative;z-index:2;}

@media (prefers-reduced-motion:reduce){
  .panel::before,.card::before,.dok::before,.zid-kos::before,.stopnja::before,
  .pr-polica::before,.enota::before,.news::before{transition:none;}
}

/* Rombi namesto pik pri naštevanju. */
.pr-seznam li::before,.naloge li::before,.sez li::before{
  border-radius:0 !important;transform:rotate(45deg);
}

/* ============================================== 7b. NAVPIČNA LETEV ODSEKOV
   Ozek trak ob levem robu s piko za vsak odsek strani. Naredi ga np.js.  */
.np-letev{
  position:fixed;left:0;top:0;bottom:0;z-index:90;width:58px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  border-right:1px solid var(--line);background:rgba(6,7,8,.82);
  /* Brez zameglitve: letev je pritrjena in bi se pri vsakem drsenju
     znova risala. Temnejsa podlaga naredi isto za manj dela.        */
  pointer-events:auto;
}
.np-pika{
  position:relative;display:grid;place-items:center;width:30px;height:30px;
  background:none;border:0;cursor:pointer;
}
.np-pika-krog{
  width:9px;height:9px;border-radius:50%;
  border:1px solid var(--line-3);background:transparent;
  transition:background .2s var(--e-out),border-color .2s var(--e-out),transform .2s var(--e-out);
}
.np-pika:hover .np-pika-krog{border-color:var(--glow);transform:scale(1.2);}
.np-pika.je-tu .np-pika-krog{background:var(--glow);border-color:var(--glow);}
/* Ime odseka se pokaže šele ob prehodu miške, da trak ostane tih. */
.np-pika-ime{
  position:absolute;left:38px;white-space:nowrap;opacity:0;pointer-events:none;
  padding:5px 10px;background:#0B0D10;border:1px solid var(--line-2);
  font-family:var(--f-mono);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--tx-2);transform:translateX(-6px);
  transition:opacity .18s var(--e-out),transform .18s var(--e-out);
}
.np-pika:hover .np-pika-ime,.np-pika:focus-visible .np-pika-ime{opacity:1;transform:none;}
.np-pika:focus-visible{outline:2px solid var(--glow);outline-offset:2px;}
@media (max-width:1280px){ .np-letev{display:none;} }

/* ===================================================== 8. TELEFON IN TISKANJE */
@media (max-width:720px){
  :root{--cut:9px;--cut-s:6px;}
}
@media print{
  .cut,.cut-btn,.np-rez,.np-rob,.np-blok{clip-path:none !important;}
  .np-letev{display:none !important;}
}