/* Slogi sekcij OSNUTKA 2 */

/* ===== 1. Naslovnica (Verzija 5) ===== */
/* 1. Naslovnica – dodatni slogi samo za to sekcijo (namizje, od 1024 px; blok V5 na koncu velja pri vseh širinah).
   Verzija 5 (23. 10. 2026): pasica »O nas so poročali« pod trakom darilnega bona, kartice medijev se vrtijo (24UR izpostavljen),
   brez gumba »Preberite«; prenovljen trak darilnega bona (3D darilna kartica, prelet svetlobe, premium gumb).
   Verzija 4 (20. 10. 2026): mehurčki v oknu se dvignejo do vrha in počasi izginejo (tečejo ves čas, tudi v varčnem načinu);
   v ozadju junaka vodni žig – znak OxySphere (polmesec + mehurčki) in rahla pikčasta mreža.
   Verzija 3 (20. 10. 2026): imena medijev so posamezne povezave na članke (nov zavihek), pred logotipom 24ur napis »24UR«.
   Verzija 2 (20. 10. 2026): značka kisika odmaknjena od okna, nihanje kazalca, »pogled po komori«,
   nove ikone v vrstici zaupanja (zdravnik, zlati pečat MZ, logotip BAROKS), logotip 24ur, trak darilnega bona s pentljo.
   Vsi slogi so omejeni na .hero / .trust / .bp2 in imajo višjo specifičnost od skupnih (namizje.css se v sestavljeni
   strani naloži pred drugim vgrajenim slogom ogrodja). */
@media (min-width:1024px){

/* ---------- 1) značka »100 % medicinski kisik« – izven jeklenega obroča (spodaj desno) ----------
   Natančno mesto izračuna skripta v sekcija.html (čim bolj desno, a zunaj obroča in znotraj junaka);
   spodnja pravila so rezerva, če skripta ne teče. */
.hero .port .port-o2{left:73.5%;right:auto;top:96.95%;bottom:auto;line-height:1.25}
.hero .port .port-o2 b{display:block}
.hero .port .port-o2.o2-l1{line-height:normal}
.hero .port .port-o2.o2-l1 b{display:inline}
.hero .port .port-o2.o2-l2 b,.hero .port .port-o2.o2-ni b{display:block}
.hero .port .port-o2.o2-ni{padding:7px 12px}
.hero .port .port-o2.o2-ni .i3d{display:none}

/* ---------- 2) lok in kazalec v lastnem sloju (nihanje ne riše celega obroča) ---------- */
.hero .port-dial{z-index:3;will-change:transform}
/* nežno »gledanje po komori« – kot bi gledalec premikal glavo za oknom */
@keyframes n2Look{
  0%  {translate:0 0;scale:1;rotate:0deg}
  17% {translate:3.2% -1.4%;scale:1.035;rotate:-.45deg}
  36% {translate:-2.6% -2%;scale:1.05;rotate:.35deg}
  55% {translate:-3.4% 1.2%;scale:1.03;rotate:.55deg}
  76% {translate:2.2% 2%;scale:1.055;rotate:-.3deg}
  100%{translate:0 0;scale:1;rotate:0deg}
}
.hero .port .hero-media img{animation:n2Look 38s ease-in-out 3.4s infinite;will-change:transform}
.hero.is-off .port .hero-media img{animation-play-state:paused}
.hero.lite .port .hero-media img{animation:none}

/* ---------- 3) kartice – daljši opisi ---------- */
.hero .tiles .tile{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:9px;align-items:center;align-content:start;padding:0 22px 0 20px}
.hero .tiles .tile:first-child{padding-left:0}
.hero .tiles .tile-txt{display:contents}
.hero .tiles .tile-t{min-height:2.2em;display:flex;align-items:center}
.hero .tiles .tile-hi .tile-t{gap:5px}
.hero .tiles .tile-t small{margin:0;vertical-align:baseline}
.hero .tiles .tile-d{grid-column:1 / -1;max-width:14.5em;text-wrap:pretty}

/* ---------- 4) vrstica zaupanja ---------- */
.trust .trust-items{grid-template-columns:minmax(0,.9fr) minmax(0,1.14fr) minmax(0,1.08fr)}
/* zdravnik: ikona je bila zamaknjena, ker je skupno pravilo ».trust-doc span« veljalo tudi za ikono */
.trust .trust-doc .trust-ico{display:flex;align-items:center;justify-content:center;margin:0;font:inherit;letter-spacing:0;text-transform:none}
.trust .trust-doc .trust-ico .ico{width:31px;height:31px;stroke-width:1.9}

/* zlati pečat dovoljenja MZ – večji, »3D« */
.trust .trust-mz{gap:18px}
.trust .mz-seal{position:relative;flex:0 0 86px;width:86px;height:86px;margin-block:-14px;display:block;
  transform:perspective(420px) rotateX(12deg) rotateY(-10deg) rotate(-7deg);transition:transform .6s var(--x-ease)}
.trust .mz-seal::after{content:"";position:absolute;left:12%;right:12%;bottom:-9%;height:18%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(242,190,80,.55),rgba(242,190,80,0));filter:blur(3px);z-index:-1}
.trust .mz-svg{display:block;width:100%;height:100%;overflow:visible;
  filter:drop-shadow(0 2px 0 rgba(90,55,8,.55)) drop-shadow(0 12px 16px rgba(0,0,0,.55)) drop-shadow(0 0 18px rgba(240,190,90,.22))}
.trust .mz-shine{animation:n2Shine 9s cubic-bezier(.4,0,.2,1) 2.4s infinite}
@keyframes n2Shine{0%{transform:rotate(20deg) translateX(0)}24%,100%{transform:rotate(20deg) translateX(310px)}}
.trust .mz-shine{transform-box:view-box;transform-origin:100px 100px}
@media (hover:hover){ .trust .trust-mz:hover .mz-seal{transform:perspective(420px) rotateX(0) rotateY(0) rotate(0) translateY(-3px) scale(1.04)} }

/* logotip BAROKS na beli »3D« plošči */
.trust .trust-baroks{gap:18px}
.trust .baroks-plate{flex:0 0 124px;width:124px;height:56px;display:flex;align-items:center;justify-content:center;border-radius:16px;
  background:radial-gradient(120% 90% at 30% 0%,#FFFFFF 0%,#FFFFFF 40%,#E7EDF4 100%);
  box-shadow:inset 0 1.5px 0 #fff,inset 0 -4px 8px rgba(10,30,60,.14),inset 0 0 0 1px rgba(255,255,255,.6),0 14px 24px -12px rgba(0,0,0,.7),0 0 0 1px rgba(127,219,255,.18),0 0 24px -8px rgba(127,219,255,.35);
  transform:perspective(420px) rotateX(9deg) rotateY(-7deg);transition:transform .5s var(--x-ease)}
.trust .baroks-plate img{display:block;width:102px;height:auto}
@media (hover:hover){ .trust .trust-baroks:hover .baroks-plate{transform:perspective(420px) rotateX(0) rotateY(0) translateY(-2px)} }

/* ---------- 5) in 6) medijska pasica in trak darilnega bona – V5: prestavljeno v nov blok na koncu datoteke ---------- */
.trust.n2-off .mz-shine{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){ .hero .port .hero-media img,.trust .mz-shine{animation:none} }

/* ---------- V4: mehurčki do vrha okna, nato počasi izginejo ---------- */
.hero .port .port-bubbles{
  -webkit-mask-image:linear-gradient(to top,#000 0%,#000 52%,rgba(0,0,0,.55) 74%,rgba(0,0,0,0) 93%),radial-gradient(closest-side,#000 84%,rgba(0,0,0,0) 100%);
  mask-image:linear-gradient(to top,#000 0%,#000 52%,rgba(0,0,0,.55) 74%,rgba(0,0,0,0) 93%),radial-gradient(closest-side,#000 84%,rgba(0,0,0,0) 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect}
.hero.lite .port .port-bubbles{display:block}
.hero .port .port-bubbles i{will-change:transform,opacity;
  animation:n4Rise var(--t) linear var(--dl) infinite,n4Sway calc(var(--t) / 3.2) ease-in-out var(--dl) infinite alternate}
.hero .port .port-bubbles i:nth-child(10){--x:38%;--s:8px;--t:12s;--dl:6s;--w:-10px}
.hero .port .port-bubbles i:nth-child(11){--x:50%;--s:5px;--t:9.5s;--dl:.9s;--w:8px}
.hero .port .port-bubbles i:nth-child(12){--x:71%;--s:11px;--t:15s;--dl:8.4s;--w:-12px}
@keyframes n4Rise{
  0%  {transform:translate3d(0,0,0) scale(.55);opacity:0}
  8%  {opacity:.9}
  100%{transform:translate3d(var(--w,0),calc(var(--pd) * -.8),0) scale(1.08);opacity:.85}
}
@keyframes n4Sway{from{translate:-5px 0}to{translate:5px 0}}
.hero.is-off .port .port-bubbles i{animation-play-state:paused}

/* ---------- V4: vodni žig v ozadju junaka ---------- */
.hero.n4 .n4-wm{position:absolute;z-index:0;left:var(--pr);top:calc(var(--hh) + 6%);height:calc((100% - var(--hh)) * 1.02);width:auto;transform:translateX(-10%);
  opacity:var(--wm-o,.32);pointer-events:none;overflow:visible;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 55%,rgba(0,0,0,.35) 85%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,#000 0%,#000 55%,rgba(0,0,0,.35) 85%,rgba(0,0,0,0) 100%)}
.hero.n4 .n4-wm .n4-bub{transform-box:fill-box;transform-origin:50% 50%;animation:n4Float 14s ease-in-out 1s infinite alternate}
@keyframes n4Float{from{transform:translateY(0)}to{transform:translateY(-1.6px)}}
.hero.n4 .n4-grid{position:absolute;z-index:0;inset:0;pointer-events:none;opacity:.55;
  background-image:radial-gradient(rgba(127,219,255,.16) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;background-position:calc(var(--pr) - 14px) 14px;
  -webkit-mask-image:radial-gradient(70% 75% at 22% 58%,#000 0%,rgba(0,0,0,.45) 45%,rgba(0,0,0,0) 78%);mask-image:radial-gradient(70% 75% at 22% 58%,#000 0%,rgba(0,0,0,.45) 45%,rgba(0,0,0,0) 78%)}
.hero.is-off.n4 .n4-wm .n4-bub{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){ .hero .port .port-bubbles i,.hero.n4 .n4-wm .n4-bub{animation:none} }
}

/* =====================================================================================================
   V5 (23. 10. 2026) – darilni bon + pasica »O nas so poročali«
   - Pasica medijev je prestavljena POD trak darilnega bona (trak loči zgornji del naslovnice od medijev);
     sekcije »Mediji« na strani ni več, zato gumb »Preberite« ni več potreben.
   - Pasica medijev je visoka kot trak darilnega bona (92 px na namizju).
   - 24UR je stalna, izpostavljena kartica (velik logotip s sijem, »članek in video«); ostale objave so kartice na
     valju, ki se po vrsti zavrtijo (ena naenkrat, vsakih 3,2 s) – ustavi jih gumb, miška ali fokus.
   - Trak darilnega bona: 3D darilna kartica z rdečo pentljo, svetlobni prelet, dvovrstično besedilo, premium gumb.
   Prvi blok velja pri vseh širinah (barve in pisave imajo rezervne vrednosti), drugi le za namizje, tretji le za telefon/tablico.
   ===================================================================================================== */

/* ---------- V5 · skupno (vse širine) ---------- */
.bon-promo.bp3{--bp-gold1:#FFF1C6;--bp-gold2:#F6CF6E;--bp-gold3:#E9A93A}
.bp3 .bp-txt em{font-style:normal;background:linear-gradient(100deg,var(--bp-gold1) 0%,var(--bp-gold2) 55%,var(--bp-gold3) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 1px 1px rgba(60,30,0,.25))}
.bp3 .bp3-gi{flex:0 0 auto;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:#fff;
  background:radial-gradient(circle at 34% 28%,#FF8C9C 0%,#E0213F 52%,#9A0C24 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 5px 10px -5px rgba(154,12,36,.85)}
.bp3 .bp3-gi .ico{width:15px;height:15px;margin:0}
.bp3 .bp-btn{color:#0A1A2E}
.bp3 .bp3-card{display:none}
.bp3 .bp3-spark{position:absolute;inset:0;pointer-events:none;z-index:0}
.bp3 .bp3-spark i{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);opacity:0;
  background:radial-gradient(closest-side,#fff 0%,#FFF3C8 45%,rgba(255,226,150,.6) 100%);
  clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);
  animation:n5Twinkle var(--t) ease-in-out var(--dl) infinite}
.bp3 .bp3-spark i:nth-child(1){--x:4%;--y:20%;--s:9px;--t:4.2s;--dl:.3s}
.bp3 .bp3-spark i:nth-child(2){--x:16%;--y:72%;--s:7px;--t:5s;--dl:1.6s}
.bp3 .bp3-spark i:nth-child(3){--x:47%;--y:16%;--s:8px;--t:4.6s;--dl:2.8s}
.bp3 .bp3-spark i:nth-child(4){--x:66%;--y:76%;--s:10px;--t:5.6s;--dl:1s}
.bp3 .bp3-spark i:nth-child(5){--x:82%;--y:20%;--s:7px;--t:4.8s;--dl:3.4s}
.bp3 .bp3-spark i:nth-child(6){--x:97%;--y:64%;--s:9px;--t:4.4s;--dl:.7s}
@keyframes n5Twinkle{0%,100%{opacity:0;transform:scale(.4) rotate(0)}45%{opacity:.95;transform:scale(1) rotate(30deg)}60%{opacity:.7}}
.bon-promo.bp3::after{content:"";display:block;position:absolute;top:0;bottom:0;left:0;width:30%;z-index:0;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.13) 50%,rgba(255,255,255,0) 100%);
  transform:translateX(-120%) skewX(-14deg);animation:n5Sweep 9s cubic-bezier(.45,0,.2,1) 1.2s infinite}
@keyframes n5Sweep{0%{transform:translateX(-120%) skewX(-14deg)}36%,100%{transform:translateX(440%) skewX(-14deg)}}

/* pasica medijev – osnova */
.mb{--mb-cyan:#7FDBFF;--mb-aqua:#A9E9FF;--mb-on:#E8F0F8;--mb-on3:rgba(232,240,248,.7);--mb-rule:rgba(127,219,255,.17);--mb-h:62px;
  --mb-sans:var(--x-sans,'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif);
  --mb-disp:var(--x-serif,'Manrope',ui-sans-serif,system-ui,sans-serif);
  position:relative;overflow:hidden;isolation:isolate;color:var(--mb-on);
  background:linear-gradient(180deg,#071630 0%,#040B16 100%);border-bottom:1px solid var(--mb-rule)}
.mb::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(127,219,255,0) 0%,rgba(127,219,255,.5) 30%,rgba(140,160,255,.55) 50%,rgba(127,219,255,0) 100%)}
.mb .mb-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(520px 190px at 30% 50%,rgba(44,63,152,.62),rgba(44,63,152,0) 72%),
             radial-gradient(760px 220px at 92% 130%,rgba(30,111,217,.26),rgba(30,111,217,0) 70%),
             radial-gradient(rgba(127,219,255,.14) 1px,rgba(127,219,255,0) 1.6px) 0 0/24px 24px}
.mb .mb-l{display:flex;flex-direction:column;gap:5px;min-width:0}
.mb .mb-eye{display:inline-flex;align-items:center;gap:7px;font:600 10.5px/1 var(--mb-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--mb-cyan)}
.mb .mb-eye .ico{width:15px;height:15px;margin:0}
.mb .mb-h{margin:0;font:600 19px/1.15 var(--mb-disp);letter-spacing:-.02em;color:#fff;white-space:nowrap}
.mb .mb-kind{flex:0 0 auto;font:600 9.5px/1 var(--mb-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mb-aqua);
  padding:4px 7px 3.5px;border-radius:999px;background:rgba(169,233,255,.1);box-shadow:inset 0 0 0 1px rgba(169,233,255,.24);white-space:nowrap}
/* 24UR – izpostavljena kartica */
.mb .mb-24{position:relative;display:flex;align-items:center;gap:15px;min-width:0;height:68px;padding:0 14px 0 5px;border-radius:18px;overflow:hidden;
  color:#fff;text-decoration:none;
  background:linear-gradient(105deg,rgba(44,63,152,.78) 0%,rgba(44,63,152,.36) 48%,rgba(30,111,217,.12) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 0 0 1px rgba(128,150,255,.55),0 16px 36px -18px rgba(14,24,100,.95),0 0 46px -10px rgba(86,112,255,.75);
  transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
.mb .mb-24::after{content:"";position:absolute;top:0;bottom:0;left:0;width:38%;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.16),rgba(255,255,255,0));
  transform:translateX(-140%) skewX(-16deg);animation:n5Sweep24 6.5s cubic-bezier(.45,0,.2,1) 2s infinite}
@keyframes n5Sweep24{0%{transform:translateX(-140%) skewX(-16deg)}30%,100%{transform:translateX(330%) skewX(-16deg)}}
.mb .mb-24-logo{position:relative;flex:0 0 58px;width:58px;height:58px}
.mb .mb-24-logo img{display:block;width:58px;height:58px;border-radius:13px;
  box-shadow:0 0 0 1px rgba(255,255,255,.32),0 10px 18px -8px rgba(0,0,0,.85),0 0 0 0 rgba(120,142,255,0);animation:n5Glow 4s ease-in-out infinite}
@keyframes n5Glow{0%,100%{box-shadow:0 0 0 1px rgba(255,255,255,.32),0 10px 18px -8px rgba(0,0,0,.85),0 0 14px 0 rgba(120,142,255,.35)}
  50%{box-shadow:0 0 0 1px rgba(255,255,255,.5),0 10px 18px -8px rgba(0,0,0,.85),0 0 26px 4px rgba(120,142,255,.75)}}
.mb .mb-24-play{position:absolute;right:-5px;bottom:-4px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  background:#fff;color:#2C3F98;box-shadow:0 0 0 2px #2C3F98,0 5px 10px -3px rgba(0,0,0,.6)}
.mb .mb-24-play .ico{width:10px;height:10px;margin:0 0 0 1.5px;fill:currentColor;stroke:none}
.mb .mb-24-b{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:5px}
.mb .mb-24-top{display:flex;align-items:center;gap:10px}
.mb .mb-24-n{font:800 20px/1 var(--mb-sans);letter-spacing:.015em;color:#fff}
.mb .mb-24-t{font:500 13.5px/1.25 var(--mb-sans);color:rgba(232,240,248,.88);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mb .mb-go{flex:0 0 32px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:#fff;
  background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);transition:background .3s,transform .35s cubic-bezier(.16,1,.3,1)}
.mb .mb-go .ico{width:15px;height:15px;margin:0}
.mb .mb-24:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 0 0 1px rgba(150,170,255,.85),0 20px 40px -18px rgba(14,24,100,.95),0 0 56px -8px rgba(96,122,255,.9)}
.mb .mb-24:hover .mb-go{background:#fff;color:#2C3F98;transform:translate(1px,-1px)}
.mb .mb-24:focus-visible,.mb .mb-card:focus-visible,.mb .mb-pp:focus-visible{outline:2px solid var(--mb-cyan);outline-offset:3px}
/* kartice na valju */
.mb .mb-deck{--slots:1;display:grid;grid-template-columns:repeat(var(--slots),minmax(0,1fr));gap:12px;min-width:0;margin:0;padding:0;list-style:none}
.mb .mb-deck>li{position:relative;height:var(--mb-h);min-width:0;margin:0;padding:0}
.mb .mb-deck:not(.is-live)>li:nth-child(n+2){display:none}
.mb .mb-slot{perspective:640px;perspective-origin:50% 50%}
.mb .mb-cube{position:relative;height:100%;transform-style:preserve-3d;
  transform:translateZ(calc(var(--mb-h) / -2)) rotateX(calc(var(--k,0) * 90deg));transition:transform 1.05s cubic-bezier(.7,0,.18,1)}
.mb .mb-face{position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;
  transform:rotateX(calc(var(--f,0) * -90deg)) translateZ(calc(var(--mb-h) / 2))}
.mb .mb-card{display:flex;align-items:center;gap:12px;height:100%;min-width:0;padding:0 14px 0 10px;border-radius:15px;color:#fff;text-decoration:none;
  background:linear-gradient(180deg,#132B52 0%,#0B1D3B 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),inset 0 0 0 1px rgba(127,219,255,.2),0 12px 24px -18px rgba(0,0,0,.95);transition:box-shadow .3s}
.mb .mb-face .mb-card{position:relative}
.mb .mb-face .mb-card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:#020812;opacity:0;pointer-events:none;transition:opacity 1.05s cubic-bezier(.7,0,.18,1)}
.mb .mb-face[aria-hidden="true"] .mb-card::after{opacity:.78}
.mb .mb-card:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 1px rgba(127,219,255,.55),0 14px 28px -16px rgba(56,182,255,.55)}
.mb .mb-ico{flex:0 0 40px;width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:var(--mb-cyan);
  background:linear-gradient(160deg,rgba(127,219,255,.2),rgba(127,219,255,.04));box-shadow:inset 0 0 0 1px rgba(127,219,255,.24)}
.mb .mb-ico .ico{width:19px;height:19px;margin:0}
.mb .mb-b{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:5px}
.mb .mb-top{display:flex;align-items:center;gap:8px;min-width:0}
.mb .mb-n{min-width:0;font:700 14.5px/1.1 var(--mb-sans);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mb .mb-t{font:400 12.5px/1.25 var(--mb-sans);color:var(--mb-on3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* gumb ustavi/zaženi z obročem do naslednjega obrata */
.mb .mb-pp{position:relative;flex:0 0 40px;width:40px;height:40px;margin:0;padding:0;border:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  color:#fff;background:rgba(255,255,255,.06);transition:background .25s}
.mb .mb-pp[hidden]{display:none}
.mb .mb-pp:hover{background:rgba(255,255,255,.14)}
.mb .mb-ring{position:absolute;inset:0;width:40px;height:40px;transform:rotate(-90deg)}
.mb .mb-ring circle{fill:none;stroke-width:2}
.mb .mb-ring-bg{stroke:rgba(127,219,255,.18)}
.mb .mb-ring-fg{stroke:var(--mb-cyan);stroke-linecap:round;stroke-dasharray:113.1;stroke-dashoffset:113.1;transition:stroke .3s}
.mb.mb-hold .mb-ring-fg{stroke:rgba(127,219,255,.55)}
.mb .mb-pp .ico{width:14px;height:14px;margin:0}
.mb .mb-pp .mb-i-play{display:none;width:13px;height:13px;margin-left:2px;fill:currentColor;stroke:none}
.mb .mb-pp.is-paused .mb-i-play{display:block}
.mb .mb-pp.is-paused .mb-i-pause{display:none}
.bp3.n2-off .bp3-spark i,.bp3.n2-off::after,.bp3.n2-off .bp3-3d,.bp3.n2-off .bp3-shine,.mb.n2-off .mb-24::after,.mb.n2-off .mb-24-logo img{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){
  .bon-promo.bp3::after,.bp3 .bp3-3d,.bp3 .bp3-shine,.mb .mb-24::after,.mb .mb-24-logo img{animation:none}
  .bp3 .bp3-spark i{animation:none;opacity:.55}
  .mb .mb-cube{transition:none}
}

/* ---------- V5 · namizje (od 1024 px) ---------- */
@media (min-width:1024px){
/* trak darilnega bona */
.bon-promo.bp3{border-top:1px solid rgba(169,233,255,.3);border-bottom:1px solid rgba(169,233,255,.2);
  background:radial-gradient(1000px 190px at 56% -70%,rgba(169,233,255,.4),rgba(169,233,255,0) 70%),
             linear-gradient(100deg,#0A2A69 0%,#114BB2 28%,#1A68D5 56%,#2793E4 82%,#3AAEEB 100%)}
.bon-promo.bp3::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(115deg,rgba(255,255,255,.035) 0 2px,rgba(255,255,255,0) 2px 14px);
  -webkit-mask:linear-gradient(90deg,#000 0%,rgba(0,0,0,.3) 40%,rgba(0,0,0,0) 70%);mask:linear-gradient(90deg,#000 0%,rgba(0,0,0,.3) 40%,rgba(0,0,0,0) 70%)}
.bp3 .bon-promo-in{gap:28px;min-height:92px;padding-block:10px}
.bp3 .bp3-card{position:relative;display:block;flex:0 0 150px;align-self:stretch;margin-block:-10px;perspective:760px}
.bp3 .bp3-card::before{content:"";position:absolute;left:50%;top:50%;width:360px;height:260px;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,214,140,.36),rgba(255,120,150,.12) 48%,rgba(255,255,255,0) 74%)}
.bp3 .bp3-3d{position:absolute;left:50%;top:50%;width:124px;height:76px;margin:-33px 0 0 -62px;transform-style:preserve-3d;
  transform:rotateX(14deg) rotateY(-20deg) rotateZ(-6deg);animation:n5Float 7s ease-in-out 1s infinite}
@keyframes n5Float{0%,100%{transform:rotateX(14deg) rotateY(-20deg) rotateZ(-6deg) translateY(0)}50%{transform:rotateX(7deg) rotateY(-9deg) rotateZ(-3deg) translateY(-3px)}}
.bp3 .bp3-face{position:absolute;inset:0;border-radius:11px;overflow:hidden;color:#fff;
  background:radial-gradient(90% 120% at 0% 0%,rgba(127,219,255,.38),rgba(127,219,255,0) 56%),
             radial-gradient(70% 90% at 100% 100%,rgba(30,111,217,.5),rgba(30,111,217,0) 62%),
             linear-gradient(135deg,#143A73 0%,#0A2047 50%,#04102A 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34),inset 0 0 0 1px rgba(169,233,255,.3),0 20px 26px -12px rgba(0,6,30,.8),0 0 32px -8px rgba(169,233,255,.6)}
.bp3 .bp3-face::before{content:"";position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(rgba(169,233,255,.3) .7px,rgba(169,233,255,0) 1.2px);background-size:9px 9px;
  -webkit-mask:linear-gradient(135deg,#000 0%,rgba(0,0,0,0) 60%);mask:linear-gradient(135deg,#000 0%,rgba(0,0,0,0) 60%)}
.bp3 .bp3-mark{position:absolute;left:9px;top:8px;width:16px;height:20px;color:var(--x-aqua,#A9E9FF);filter:drop-shadow(0 0 5px rgba(127,219,255,.6))}
.bp3 .bp3-brand{position:absolute;left:28px;top:12.5px;font:600 8.5px/1 var(--x-sans);letter-spacing:.13em;text-transform:uppercase;color:#fff}
.bp3 .bp3-k{position:absolute;left:9px;bottom:22px;font:700 8px/1 var(--x-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--x-aqua,#A9E9FF)}
.bp3 .bp3-v{position:absolute;left:9px;bottom:9px;font:500 9.5px/1 var(--x-sans);color:rgba(255,255,255,.82)}
.bp3 .bp3-rib{position:absolute;top:0;bottom:0;left:80%;width:12px;
  background:linear-gradient(90deg,#7E0A1D 0%,#C8173A 16%,#F2445C 44%,#FF7A8C 52%,#D81E3E 70%,#8F0B22 100%);box-shadow:0 0 8px rgba(0,0,0,.4)}
.bp3 .bp3-rib::before,.bp3 .bp3-rib::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:rgba(255,205,212,.55)}
.bp3 .bp3-rib::before{left:2.5px}.bp3 .bp3-rib::after{right:2.5px}
.bp3 .bp3-shine{position:absolute;inset:-20% -60%;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,0) 40%,rgba(255,255,255,.34) 48%,rgba(190,240,255,.18) 52%,rgba(255,255,255,0) 60%);
  transform:translateX(-60%);animation:n5Holo 6.5s cubic-bezier(.45,0,.2,1) 2.4s infinite}
@keyframes n5Holo{0%{transform:translateX(-60%)}34%,100%{transform:translateX(60%)}}
.bp3 .bp3-bow{position:absolute;left:calc(80% + 6px);top:-11px;width:46px;height:auto;transform:translateX(-50%) translateZ(6px) rotate(-6deg);overflow:visible;
  filter:drop-shadow(0 6px 7px rgba(40,0,10,.5)) drop-shadow(0 1px 1px rgba(60,0,15,.4))}
.bp3 .bp-txt{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px;text-shadow:0 1px 2px rgba(4,20,60,.3)}
.bp3 .bp-txt b{font:300 23px/1.15 var(--x-serif);letter-spacing:-.025em;color:#fff}
.bp3 .bp-txt em{font-weight:700}
.bp3 .bp-txt span{display:block;font:400 15.5px/1.4 var(--x-sans);color:rgba(255,255,255,.88)}
.bp3 .bp-btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:12px;min-height:54px;padding:0 22px 0 8px;border-radius:999px;
  font:600 15.5px var(--x-sans);color:var(--x-ink,#0A1A2E);background:linear-gradient(180deg,#FFFFFF 0%,#EAF3FF 100%);
  box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 rgba(30,111,217,.12),0 0 0 5px rgba(255,255,255,.15),0 18px 32px -14px rgba(2,12,40,.85),0 0 40px -8px rgba(169,233,255,.75);
  transition:transform .3s var(--x-ease),box-shadow .3s}
.bp3 .bp3-gi{width:38px;height:38px}
.bp3 .bp3-gi .ico{width:18px;height:18px}
.bp3 .bp-btn .bp3-ar{width:17px;height:17px;margin:0;transition:transform .3s var(--x-ease)}
.bp3 .bp-btn:hover{color:var(--x-ink,#0A1A2E);transform:translateY(-2px);
  box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 rgba(30,111,217,.12),0 0 0 7px rgba(255,255,255,.22),0 22px 36px -14px rgba(2,12,40,.9),0 0 52px -6px rgba(169,233,255,.9)}
.bp3 .bp-btn:hover .bp3-ar{transform:translateX(4px)}

/* pasica medijev */
.mb .mb-in{display:flex;align-items:center;gap:18px;min-height:92px;padding-block:12px}
.mb .mb-l{flex:0 0 auto;padding-right:22px;margin-right:2px;border-right:1px solid var(--mb-rule)}
.mb .mb-24{flex:0 1 400px}
@media (max-width:1279.98px){ .mb .mb-24{flex-basis:356px} .mb .mb-l{padding-right:18px} }
.mb .mb-deck .mb-card{padding-right:16px}
.mb .mb-deck{--slots:1;flex:1 1 0}
.mb .mb-pp{flex:0 0 40px}
}
@media (min-width:1360px){
.mb .mb-deck{--slots:2}
.mb .mb-deck:not(.is-live)>li:nth-child(2){display:block}
}
@media (min-width:1600px){
.mb .mb-24{flex-basis:480px}
.mb .mb-in{gap:22px}
}

/* ---------- V5 · telefon in tablica (do 1023 px) ---------- */
@media (max-width:1023.98px){
.mb{--mb-sans:var(--f-body,'Inter',ui-sans-serif,system-ui,sans-serif);--mb-disp:var(--f-display,'Manrope',ui-sans-serif,system-ui,sans-serif)}
.mb .mb-h{font-weight:800}
.bp3 .bp-btn{gap:8px;padding-left:6px}
.mb .mb-in{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px 12px;padding-block:22px 24px}
.mb .mb-l{grid-column:1;grid-row:1}
.mb .mb-pp{grid-column:2;grid-row:1}
.mb .mb-24{grid-column:1 / -1;height:72px}
.mb .mb-deck{grid-column:1 / -1}
.mb .mb-h{font-size:20px}
}
@media (min-width:640px) and (max-width:1023.98px){
.mb .mb-deck{--slots:2}
.mb .mb-deck:not(.is-live)>li:nth-child(2){display:block}
}


/* ===== 2. Komora in varnost (Končna verzija) ===== */
/* 5. Komora in varnost – Verzija 5 (21. 10. 2026): komora 4:3 manjša, video 9:16 v celoti, fotografije »Med terapijo« poravnane in manjše, kartica BAROKS z glavno sliko (glej konec datoteke).
   Verzija 4 (21. 10. 2026): temno ozadje, celotna komora + vgrajen video, živahne kartice, animirana primerjava (glej konec datoteke).
   Verzija 3 (20. 10. 2026): blok »Prostor, ki ne utesnjuje« grafično dodelan (glej konec datoteke).
   Verzija 2 (20. 10. 2026)
   Zgornji del razdelka = »Razdelek Komora in varnost / Verzija 2 – predogled D« (voden ogled: 4 fotografije,
   točka se premakne na izbrano lastnost, harmonika s 6 lastnostmi, sličice fotografij).
   Vsi slogi so omejeni na #komora.k2, razredi imajo predpono k2-, da ne trčijo s skupnimi slogi.
   Galerija in blok »Prostor, ki ne utesnjuje« ostajata iz Verzije 1. */
#komora.k2{
  --k2-abyss:#040B16;--k2-on2:rgba(232,240,248,.8);--k2-on3:rgba(232,240,248,.62);--k2-cyan:#7FDBFF;--k2-sky:#38B6FF;
  --k2-rule:rgba(169,233,255,.14);--k2-ease:cubic-bezier(.16,1,.3,1);
  --k2-sans:'Instrument Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --k2-disp:'Manrope',ui-sans-serif,system-ui,sans-serif;
  background:radial-gradient(900px 520px at 18% 8%,rgba(56,182,255,.30),transparent 65%),radial-gradient(800px 560px at 92% 30%,rgba(127,219,255,.18),transparent 65%),linear-gradient(180deg,#0C2747 0%,#123C66 40%,#1A4F82 100%);
  color:#E8F0F8;overflow:hidden}
#komora.k2::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(169,233,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(169,233,255,.05) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(70% 40% at 50% 22%,#000,transparent);mask-image:radial-gradient(70% 40% at 50% 22%,#000,transparent)}
#komora.k2 > *{position:relative}
#komora.k2 .k2-grid .ico{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
/* glava */
#komora.k2 .k2-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(40px,5vw,88px);align-items:end;margin-bottom:clamp(44px,4vw,64px)}
#komora.k2 .k2-eyebrow{margin:0 0 18px;font:600 12.5px/1.3 var(--k2-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--k2-cyan)}
#komora.k2 .k2-h2{margin:0;font-family:var(--k2-disp);font-weight:300;letter-spacing:-.025em;font-size:clamp(34px,1.85vw + 13px,58px);line-height:1.04;color:#fff;text-wrap:balance}
#komora.k2 .k2-lead{margin:0;font:400 clamp(17px,.3vw + 14px,19px)/1.62 var(--k2-sans);color:var(--k2-on2);max-width:34em}
/* fotografija */
#komora.k2 .k2-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,4vw,64px);align-items:center;margin-bottom:clamp(56px,5vw,88px)}
#komora.k2 .k2-fig{position:relative;margin:0;border-radius:28px;overflow:hidden;background:#0B2038;box-shadow:0 50px 100px -50px rgba(0,0,0,.9);isolation:isolate;aspect-ratio:4/3;--fx:50%;--fy:50%}
#komora.k2 .k2-fimg{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
#komora.k2 .k2-fig::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit;background:radial-gradient(circle at var(--fx) var(--fy),rgba(4,11,22,0) 0,rgba(4,11,22,0) 11%,rgba(4,11,22,.2) 32%,rgba(4,11,22,.34) 100%);box-shadow:inset 0 0 0 1px rgba(127,219,255,.16);transition:background .6s}
#komora.k2 .k2-cap{position:absolute;z-index:3;left:18px;bottom:18px;display:flex;align-items:center;gap:12px;max-width:calc(100% - 36px);padding:8px 18px 8px 8px;border-radius:999px;background:rgba(4,11,22,.74);border:1px solid var(--k2-rule);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
#komora.k2 .k2-cap-n{flex:0 0 32px;height:32px;border-radius:50%;background:var(--k2-sky);color:var(--k2-abyss);font:700 14px/1 var(--k2-sans);display:flex;align-items:center;justify-content:center}
#komora.k2 .k2-cap-t{font:600 15px/1.3 var(--k2-sans);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#komora.k2 .k2-cap-of{font:400 13px var(--k2-sans);color:var(--k2-on3)}
#komora.k2 .k2-dimg{opacity:0;transform:scale(1.04);transition:opacity .8s var(--k2-ease),transform 1.4s var(--k2-ease)}
#komora.k2 .k2-dimg.is-on{opacity:1;transform:none}
#komora.k2 .k2-pin{position:absolute;z-index:2;width:46px;height:46px;margin:-23px 0 0 -23px;transition:left .8s var(--k2-ease),top .8s var(--k2-ease)}
#komora.k2 .k2-pin::before,#komora.k2 .k2-pin::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(127,219,255,.75);animation:k2Ping 2.4s var(--k2-ease) infinite}
#komora.k2 .k2-pin::after{animation-delay:1.2s}
#komora.k2 .k2-pin-n{position:absolute;inset:0;border-radius:50%;background:var(--k2-sky);border:1.5px solid #fff;color:var(--k2-abyss);font:700 15px/1 var(--k2-sans);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 8px rgba(56,182,255,.22),0 0 34px rgba(56,182,255,.7)}
@keyframes k2Ping{0%{transform:scale(1);opacity:.9}100%{transform:scale(2.3);opacity:0}}
#komora.k2 .k2-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:14px}
#komora.k2 .k2-thumb{position:relative;padding:0;border:1px solid var(--k2-rule);border-radius:14px;overflow:hidden;background:#0B2038;cursor:pointer;aspect-ratio:4/3;opacity:.62;transition:opacity .35s,border-color .35s}
#komora.k2 .k2-thumb img{width:100%;height:100%;object-fit:cover;display:block}
#komora.k2 .k2-thumb span{position:absolute;left:0;right:0;bottom:0;padding:16px 8px 6px;font:400 12px/1.2 var(--k2-sans);color:#fff;background:linear-gradient(transparent,rgba(4,11,22,.85));text-align:left}
#komora.k2 .k2-thumb:hover{opacity:.9}
#komora.k2 .k2-thumb.is-on{opacity:1;border-color:var(--k2-sky);box-shadow:0 0 0 1px var(--k2-sky)}
/* harmonika */
#komora.k2 .k2-hint{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:0 4px;font:400 13.5px/1.45 var(--k2-sans);color:var(--k2-on3)}
#komora.k2 .k2-hint .ico{width:17px;height:17px;color:var(--k2-cyan)}
#komora.k2 .k2-accs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
#komora.k2 .k2-acc{border-radius:18px;border:1px solid transparent;transition:background .45s,border-color .45s}
#komora.k2 .k2-acc:not(.is-active){border-bottom-color:var(--k2-rule);border-radius:0}
#komora.k2 .k2-acc.is-active{background:rgba(255,255,255,.1);border-color:rgba(169,233,255,.4);box-shadow:0 30px 60px -40px rgba(0,0,0,.6)}
#komora.k2 .k2-acc-b{width:100%;display:flex;align-items:center;gap:16px;padding:15px 20px;background:none;border:0;text-align:left;cursor:pointer;color:inherit;font:inherit}
#komora.k2 .k2-acc-n{font:600 12.5px var(--k2-sans);letter-spacing:.18em;color:var(--k2-on3);min-width:24px;transition:color .4s}
#komora.k2 .k2-acc-t{flex:1;font:400 clamp(19px,.5vw + 13px,23px)/1.25 var(--k2-disp);letter-spacing:-.01em;color:var(--k2-on2);transition:color .4s}
#komora.k2 .k2-acc-c{width:18px;height:18px;color:var(--k2-on3);transition:transform .45s var(--k2-ease)}
#komora.k2 .k2-acc:hover .k2-acc-t{color:#fff}
#komora.k2 .k2-acc.is-active .k2-acc-n{color:var(--k2-cyan)}
#komora.k2 .k2-acc.is-active .k2-acc-t{color:#fff}
#komora.k2 .k2-acc.is-active .k2-acc-c{transform:rotate(180deg);color:var(--k2-cyan)}
#komora.k2 .k2-acc-d{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--k2-ease)}
#komora.k2 .k2-acc-d > div{overflow:hidden}
#komora.k2 .k2-acc-d p{margin:0;padding:0 22px 18px 60px;font:400 15.5px/1.62 var(--k2-sans);color:var(--k2-on2)}
#komora.k2 .k2-acc.is-active .k2-acc-d{grid-template-rows:1fr}
#komora.k2 .k2-acc-b:focus-visible,#komora.k2 .k2-thumb:focus-visible{outline:2px solid var(--k2-cyan);outline-offset:3px}
@media (max-width:900px){
  #komora.k2 .k2-head,#komora.k2 .k2-grid{grid-template-columns:1fr}
}
@media (max-width:560px){ #komora.k2 .k2-thumbs{grid-template-columns:repeat(2,1fr)} #komora.k2 .k2-cap-of{display:none} }
@media (prefers-reduced-motion:reduce){ #komora.k2 *{transition:none!important;animation:none!important} }

/* =====================================================================
   V3 – »Prostor, ki ne utesnjuje«: poudarek na sproščeni izkušnji v komori
   ===================================================================== */
#komora.k2 .pr{position:relative;margin-top:clamp(64px,6vw,104px);padding:clamp(36px,4vw,64px);border-radius:36px;isolation:isolate;overflow:hidden;
  background:radial-gradient(640px 400px at 88% -6%,rgba(56,182,255,.2),transparent 70%),radial-gradient(560px 380px at -4% 104%,rgba(28,174,143,.14),transparent 70%),linear-gradient(180deg,rgba(4,11,22,.66),rgba(4,11,22,.44));
  border:1px solid rgba(169,233,255,.16);box-shadow:0 60px 120px -60px rgba(0,0,0,.85)}
#komora.k2 .pr::before{content:"";position:absolute;z-index:-1;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:repeating-radial-gradient(circle,rgba(127,219,255,.07) 0 1px,transparent 1.5px 34px);-webkit-mask-image:radial-gradient(closest-side,#000,transparent);mask-image:radial-gradient(closest-side,#000,transparent);pointer-events:none}
#komora.k2 .pr .ico{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
#komora.k2 .pr .i3d .ico{stroke:url(#g3d);stroke-width:2.35}
/* zgoraj: besedilo + primerjava */
#komora.k2 .pr-top{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,4vw,72px);align-items:center}
#komora.k2 .pr-head{display:flex;flex-direction:column;gap:18px}
#komora.k2 .pr-head .k2-eyebrow{margin:0}
#komora.k2 .pr-h{margin:0;font:300 clamp(36px,1.6vw + 16px,54px)/1.05 var(--k2-disp);letter-spacing:-.025em;color:#fff;text-wrap:balance}
#komora.k2 .pr-lead{margin:0;font:400 17.5px/1.65 var(--k2-sans);color:var(--k2-on2);max-width:32em}
#komora.k2 .pr-quote{position:relative;margin:8px 0 0;padding:18px 22px 16px 60px;border-radius:20px;background:linear-gradient(135deg,rgba(127,219,255,.12),rgba(255,255,255,.04));border:1px solid rgba(169,233,255,.22)}
#komora.k2 .pr-quote .ico{position:absolute;left:20px;top:19px;width:26px;height:26px;fill:var(--k2-cyan);stroke:none}
#komora.k2 .pr-quote blockquote{margin:0;font:400 21px/1.35 var(--k2-disp);letter-spacing:-.01em;color:#fff}
#komora.k2 .pr-quote figcaption{margin-top:6px;font:500 13px/1.4 var(--k2-sans);color:var(--k2-on3)}
#komora.k2 .pr-cmp{display:grid;grid-template-columns:minmax(0,.8fr) auto minmax(0,1.2fr);align-items:center;gap:14px}
#komora.k2 .pr-card{margin:0;display:flex;flex-direction:column;border-radius:24px;overflow:hidden;border:1px solid var(--k2-rule);background:rgba(255,255,255,.05)}
#komora.k2 .pr-viz{position:relative;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden}
#komora.k2 .pr-mono{opacity:.8}
#komora.k2 .pr-mono .pr-viz{background:radial-gradient(120% 120% at 50% 0%,rgba(127,219,255,.1),rgba(255,255,255,0))}
#komora.k2 .pr-caps{width:80%;height:auto;margin-top:-14px;filter:saturate(.6)}
#komora.k2 .pr-ours{background:rgba(18,60,102,.6);border-color:rgba(127,219,255,.5);box-shadow:0 0 0 1px rgba(127,219,255,.2),0 40px 80px -36px rgba(56,182,255,.55)}
#komora.k2 .pr-ours img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 60%;transition:transform 1.4s var(--k2-ease)}
#komora.k2 .pr-ours:hover img{transform:scale(1.04)}
#komora.k2 .pr-card figcaption{display:flex;flex-direction:column;gap:4px;padding:14px 20px 20px}
#komora.k2 .pr-card b{font:600 18px/1.3 var(--k2-sans);color:#fff}
#komora.k2 .pr-card small{font:400 14px/1.45 var(--k2-sans);color:var(--k2-on3)}
#komora.k2 .pr-tag{align-self:flex-start;margin-bottom:6px;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.1);font:700 11px/1.2 var(--k2-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--k2-on2)}
#komora.k2 .pr-tag-on{background:var(--k2-sky);color:var(--k2-abyss)}
#komora.k2 .pr-chip{position:absolute;left:12px;bottom:12px;padding:6px 12px;border-radius:999px;background:rgba(4,11,22,.62);border:1px solid var(--k2-rule);font:600 12px/1.2 var(--k2-sans);color:var(--k2-on2);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
#komora.k2 .pr-chip-on{left:auto;right:12px;color:#fff}
#komora.k2 .pr-chip-on b{margin-right:3px;font-size:16px;color:var(--k2-cyan)}
#komora.k2 .pr-vs{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid var(--k2-rule);font:700 11px var(--k2-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--k2-on2)}
/* sredina: 90 minut v komori */
#komora.k2 .pr-life{margin-top:clamp(52px,5vw,84px)}
#komora.k2 .pr-life-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,72px);align-items:end;margin-bottom:28px}
#komora.k2 .pr-kicker{display:flex;align-items:center;gap:10px;margin:0 0 10px;font:600 12px/1.3 var(--k2-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--k2-cyan)}
#komora.k2 .pr-dot{width:8px;height:8px;border-radius:50%;background:var(--k2-cyan);animation:prPulse 2.6s ease-out infinite}
@keyframes prPulse{0%{box-shadow:0 0 0 0 rgba(127,219,255,.55)}100%{box-shadow:0 0 0 12px rgba(127,219,255,0)}}
#komora.k2 .pr-life-h{margin:0;font:300 clamp(28px,1vw + 18px,40px)/1.1 var(--k2-disp);letter-spacing:-.02em;color:#fff}
#komora.k2 .pr-life-p{margin:0;font:400 17px/1.6 var(--k2-sans);color:var(--k2-on2);max-width:34em}
#komora.k2 .pr-photos{list-style:none;margin:0;padding:0 0 32px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.5vw,24px)}
#komora.k2 .pr-ph figure{position:relative;margin:0;aspect-ratio:3/4;border-radius:26px;overflow:hidden;background:#0B2038;isolation:isolate;box-shadow:0 44px 80px -40px rgba(0,0,0,.9)}
#komora.k2 .pr-ph:nth-child(2) figure{transform:translateY(32px)}
#komora.k2 .pr-ph img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform 1.6s var(--k2-ease)}
#komora.k2 .pr-ph figure::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit;background:linear-gradient(180deg,rgba(4,11,22,0) 55%,rgba(4,11,22,.7) 100%);box-shadow:inset 0 0 0 1px rgba(127,219,255,.16)}
#komora.k2 .pr-ph:hover img{transform:scale(1.05)}
#komora.k2 .pr-ph figcaption{position:absolute;z-index:2;left:14px;right:14px;bottom:14px;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:rgba(4,11,22,.55);border:1px solid rgba(169,233,255,.18);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
#komora.k2 .pr-ph-ico.i3d{flex:0 0 42px;width:42px;height:42px}
#komora.k2 .pr-ph-ico .ico{width:19px;height:19px}
#komora.k2 .pr-ph figcaption b{display:block;font:600 16px/1.25 var(--k2-sans);color:#fff}
#komora.k2 .pr-ph figcaption small{display:block;margin-top:2px;font:400 13px/1.4 var(--k2-sans);color:var(--k2-on2)}
/* spodaj: štiri točke in opomba */
#komora.k2 .pr-points{list-style:none;margin:clamp(40px,4vw,64px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
#komora.k2 .pr-points li{display:flex;align-items:flex-start;gap:14px;padding:18px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid var(--k2-rule)}
#komora.k2 .pr-ico.i3d{flex:0 0 44px;width:44px;height:44px}
#komora.k2 .pr-ico .ico{width:19px;height:19px}
#komora.k2 .pr-points p{margin:0;display:flex;flex-direction:column;gap:4px}
#komora.k2 .pr-points b{font:600 16px/1.3 var(--k2-sans);color:#fff}
#komora.k2 .pr-points span{font:400 14px/1.5 var(--k2-sans);color:var(--k2-on3)}
#komora.k2 .pr-note{display:flex;align-items:center;gap:10px;margin:22px 0 0;font:400 14px/1.5 var(--k2-sans);color:var(--k2-on3)}
#komora.k2 .pr-note .ico{width:18px;height:18px;color:var(--k2-cyan)}
@media (max-width:1100px){
  #komora.k2 .pr-top,#komora.k2 .pr-life-head{grid-template-columns:1fr}
  #komora.k2 .pr-points{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  #komora.k2 .pr-photos{grid-template-columns:1fr;padding-bottom:0}
  #komora.k2 .pr-ph:nth-child(2) figure{transform:none}
  #komora.k2 .pr-cmp{grid-template-columns:1fr}
  #komora.k2 .pr-vs{justify-self:center}
  #komora.k2 .pr-points{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){ #komora.k2 .pr-dot{animation:none} }

/* =====================================================================
   V4 (21. 10. 2026) – temno nadaljevanje sekcij 1–4, celotna komora + vgrajen video,
   živahne kartice, primerjava enomestna/večmestna z animacijo. Slogi omejeni na #komora.k4.
   ===================================================================== */
@property --k4a{syntax:'<angle>';inherits:false;initial-value:0deg}
#komora.k2.k4{isolation:isolate;
  background:radial-gradient(44% 30% at 6% 4%,rgba(30,111,217,.15) 0%,rgba(30,111,217,0) 70%),
             radial-gradient(40% 26% at 98% 24%,rgba(56,182,255,.1) 0%,rgba(56,182,255,0) 70%),
             radial-gradient(50% 30% at 50% 78%,rgba(30,111,217,.1) 0%,rgba(30,111,217,0) 70%),
             linear-gradient(180deg,#050F1F 0%,#071A30 30%,#06162B 65%,#050F1F 100%)}
#komora.k2.k4::before{display:none}
#komora.k2.k4::after{content:"";position:absolute;z-index:1;top:0;left:50%;width:min(1100px,80%);height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.22) 50%,rgba(127,219,255,0))}
#komora.k2.k4 > *{z-index:1}
#komora.k2.k4 > .k4-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#komora.k4 .k4-glow{position:absolute;border-radius:50%;filter:blur(10px)}
#komora.k4 .k4-g1{width:820px;height:820px;left:-260px;top:-200px;background:radial-gradient(closest-side,rgba(56,182,255,.12),rgba(56,182,255,0))}
#komora.k4 .k4-g2{width:760px;height:760px;right:-220px;top:22%;background:radial-gradient(closest-side,rgba(127,219,255,.09),rgba(127,219,255,0))}
#komora.k4 .k4-g3{width:900px;height:900px;left:20%;bottom:-260px;background:radial-gradient(closest-side,rgba(30,111,217,.12),rgba(30,111,217,0))}
#komora.k4 .k4-grid{position:absolute;inset:0;opacity:.45;
  background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(46% 18% at 24% 9%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(46% 18% at 24% 9%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
/* polmesec iz znaka OxySphere desno ob glavi */
#komora.k4 .k4-wm{position:absolute;right:-230px;top:40px;height:min(1000px,34%);width:auto;opacity:.16;
  -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 45%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(270deg,#000 0%,#000 45%,rgba(0,0,0,0) 100%)}
#komora.k4 .k4-bub{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 70%,rgba(0,0,0,0) 98%);mask-image:linear-gradient(to top,#000 0%,#000 70%,rgba(0,0,0,0) 98%)}
#komora.k4 .k4-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:k4Rise var(--t) linear var(--dl) infinite,k4Sway calc(var(--t) / 8) ease-in-out var(--dl) infinite alternate}
#komora.k4 .k4-bub i:nth-child(1){--x:3%;--s:9px;--t:52s;--dl:-8s}
#komora.k4 .k4-bub i:nth-child(2){--x:11%;--s:5px;--t:44s;--dl:-30s}
#komora.k4 .k4-bub i:nth-child(3){--x:20%;--s:12px;--t:60s;--dl:-21s}
#komora.k4 .k4-bub i:nth-child(4){--x:31%;--s:6px;--t:47s;--dl:-40s}
#komora.k4 .k4-bub i:nth-child(5){--x:42%;--s:4px;--t:40s;--dl:-12s}
#komora.k4 .k4-bub i:nth-child(6){--x:50%;--s:10px;--t:56s;--dl:-46s}
#komora.k4 .k4-bub i:nth-child(7){--x:59%;--s:6px;--t:45s;--dl:-3s}
#komora.k4 .k4-bub i:nth-child(8){--x:67%;--s:14px;--t:64s;--dl:-34s}
#komora.k4 .k4-bub i:nth-child(9){--x:76%;--s:7px;--t:49s;--dl:-17s}
#komora.k4 .k4-bub i:nth-child(10){--x:84%;--s:5px;--t:42s;--dl:-26s}
#komora.k4 .k4-bub i:nth-child(11){--x:91%;--s:11px;--t:58s;--dl:-50s}
#komora.k4 .k4-bub i:nth-child(12){--x:97%;--s:6px;--t:46s;--dl:-6s}
@keyframes k4Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}4%{opacity:.7}100%{transform:translate3d(0,-3300px,0) scale(1.1);opacity:.5}}
@keyframes k4Sway{from{translate:-8px 0}to{translate:8px 0}}
#komora.k4 .k4-em{display:block;color:#A9E9FF}

/* ---------- celotna komora + video ---------- */
#komora.k4 .k4-show{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:24px;align-items:stretch;margin-top:clamp(8px,1vw,16px)}
#komora.k4 .k4-photo,#komora.k4 .k4-vid{position:relative;margin:0;min-width:0}
#komora.k4 .k4-ph,#komora.k4 .k4-frame{position:relative;border-radius:28px;overflow:hidden;background:#0B2038;isolation:isolate;
  box-shadow:0 50px 100px -50px rgba(0,0,0,.9);outline:1px solid rgba(127,219,255,.16);outline-offset:-1px}
#komora.k4 .k4-ph{aspect-ratio:16 / 10}
#komora.k4 .k4-vid .k4-frame{position:absolute;inset:0}
#komora.k4 .k4-ph img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transform-origin:60% 55%;animation:k4Kb 26s ease-in-out infinite alternate}
@keyframes k4Kb{from{transform:scale(1.02)}to{transform:scale(1.09) translate(-1.2%,-.8%)}}
#komora.k4 .k4-ph::after,#komora.k4 .k4-frame::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(4,11,22,.25) 0%,rgba(4,11,22,0) 22%,rgba(4,11,22,0) 58%,rgba(4,11,22,.72) 100%)}
#komora.k4 .k4-sweep{position:absolute;z-index:1;top:-20%;bottom:-20%;left:0;width:28%;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.14) 50%,rgba(255,255,255,0) 100%);transform:translateX(-140%) skewX(-14deg);animation:k4Sweep 11s var(--k2-ease) 2s infinite}
@keyframes k4Sweep{0%{transform:translateX(-140%) skewX(-14deg)}22%,100%{transform:translateX(420%) skewX(-14deg)}}
#komora.k4 .k4-tag,#komora.k4 .k4-live{position:absolute;z-index:3;top:16px;left:16px;display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;
  background:rgba(4,11,22,.66);border:1px solid rgba(169,233,255,.2);color:#fff;font:600 13px/1.2 var(--k2-sans);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
#komora.k4 .k4-tag .ico{width:16px;height:16px;fill:none;stroke:var(--k2-cyan);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#komora.k4 .k4-live i{width:8px;height:8px;border-radius:50%;background:#3EE6A8;box-shadow:0 0 0 0 rgba(62,230,168,.6);animation:k4Live 2s ease-out infinite}
@keyframes k4Live{0%{box-shadow:0 0 0 0 rgba(62,230,168,.6)}100%{box-shadow:0 0 0 9px rgba(62,230,168,0)}}
#komora.k4 .k4-cap{position:absolute;z-index:3;left:16px;right:16px;bottom:16px;display:flex;flex-direction:column;gap:3px;margin:0;padding:14px 18px;border-radius:18px;
  background:rgba(4,11,22,.6);border:1px solid rgba(169,233,255,.18);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
#komora.k4 .k4-photo .k4-cap{right:auto;max-width:min(460px,calc(100% - 32px))}
#komora.k4 .k4-cap b{font:600 17px/1.25 var(--k2-sans);color:#fff}
#komora.k4 .k4-cap span{font:400 14px/1.45 var(--k2-sans);color:var(--k2-on2)}
#komora.k4 .k4-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#komora.k4 .k4-vbtn{position:absolute;z-index:3;top:14px;right:14px;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;
  background:rgba(4,11,22,.66);border:1px solid rgba(169,233,255,.22);color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .3s}
#komora.k4 .k4-vbtn:hover{background:rgba(30,111,217,.7)}
#komora.k4 .k4-vbtn:focus-visible{outline:2px solid var(--k2-cyan);outline-offset:3px}
#komora.k4 .k4-vbtn .ico{width:16px;height:16px;fill:currentColor;stroke:none}
#komora.k4 .k4-vbtn .k4-i-play{display:none}
#komora.k4 .k4-vbtn.is-paused .k4-i-pause{display:none}
#komora.k4 .k4-vbtn.is-paused .k4-i-play{display:block;margin-left:2px}
#komora.k4 .k4-vbtn[hidden]{display:none}

/* ---------- plošča »Prostor, ki ne utesnjuje« na temnem ozadju ---------- */
#komora.k4 .pr{background:radial-gradient(640px 400px at 88% -6%,rgba(56,182,255,.16),transparent 70%),radial-gradient(560px 380px at -4% 104%,rgba(28,174,143,.1),transparent 70%),linear-gradient(180deg,rgba(127,219,255,.06),rgba(127,219,255,.02));
  border-color:rgba(169,233,255,.14)}

/* ---------- primerjava enomestna / večmestna ---------- */
#komora.k4 .k4-cmp{grid-template-columns:minmax(0,.86fr) auto minmax(0,1.14fr);gap:16px}
#komora.k4 .k4-mono{opacity:.9;background:rgba(255,255,255,.035);filter:saturate(.75)}
#komora.k4 .k4-mono .pr-viz{background:radial-gradient(120% 110% at 50% 0%,rgba(127,219,255,.08),rgba(255,255,255,0)),radial-gradient(80% 60% at 50% 60%,rgba(4,11,22,0),rgba(4,11,22,.35))}
#komora.k4 .k4-caps{width:84%;margin-top:-12px;filter:saturate(.7)}
#komora.k4 .k4-glass{animation:k4Glass 6.5s ease-in-out 1s infinite}
@keyframes k4Glass{0%{transform:translateX(0) skewX(-18deg)}55%,100%{transform:translateX(470px) skewX(-18deg)}}
#komora.k4 .k4-chest{transform-box:fill-box;transform-origin:50% 100%;animation:k4Breathe 4.6s ease-in-out infinite}
@keyframes k4Breathe{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.18)}}
#komora.k4 .k4-rows{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
#komora.k4 .k4-rows li{display:flex;align-items:center;gap:10px;font:500 14px/1.35 var(--k2-sans);color:var(--k2-on3)}
#komora.k4 .k4-rows li::before{content:"";flex:0 0 20px;height:20px;border-radius:50%;background:rgba(255,255,255,.06) center/12px no-repeat;border:1px solid rgba(255,255,255,.14)}
#komora.k4 .k4-no li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m3.5 3.5 5 5m0-5-5 5' stroke='%2394A8BF' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E")}
#komora.k4 .k4-yes li{color:#fff}
#komora.k4 .k4-yes li::before{border-color:transparent;background:var(--k2-sky) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m3 6.2 2 2 4-4.4' fill='none' stroke='%23040B16' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;
  box-shadow:0 0 12px rgba(56,182,255,.6)}
#komora.k4 .k4-cmp.k4-in .k4-yes li{animation:k4Row .6s var(--k2-ease) calc(.7s + var(--i) * .22s) both}
#komora.k4 .k4-cmp.k4-in .k4-yes li::before{animation:k4Tick .5s var(--k2-ease) calc(.8s + var(--i) * .22s) both}
@keyframes k4Row{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
@keyframes k4Tick{from{transform:scale(.3);opacity:0}70%{transform:scale(1.15);opacity:1}to{transform:scale(1)}}
#komora.k4 .k4-ours{position:relative;overflow:hidden;isolation:isolate}
#komora.k4 .k4-ours::before{content:"";position:absolute;inset:0;z-index:4;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--k4a),rgba(127,219,255,0) 0deg,rgba(169,233,255,.95) 50deg,rgba(56,182,255,.35) 100deg,rgba(127,219,255,0) 160deg,rgba(127,219,255,0) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:k4Spin 7s linear infinite}
@keyframes k4Spin{to{--k4a:360deg}}
#komora.k4 .k4-ours img{animation:k4Kb 22s ease-in-out infinite alternate}
#komora.k4 .k4-ours .pr-chip-on b{display:inline-block;min-width:1.2em;text-align:right;font-variant-numeric:tabular-nums}
#komora.k4 .k4-vs{position:relative;background:rgba(127,219,255,.08);border-color:rgba(169,233,255,.28);color:#fff}
#komora.k4 .k4-vs::before,#komora.k4 .k4-vs::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid rgba(127,219,255,.5);animation:k4Ring 2.8s ease-out infinite}
#komora.k4 .k4-vs::after{animation-delay:1.4s}
@keyframes k4Ring{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.9);opacity:0}}

/* ---------- štiri kartice: izmenično osvetljene, z mini prikazi ---------- */
#komora.k4 .k4-pts{gap:18px;align-items:stretch}
#komora.k4 .k4-pts li.k4-pt{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:16px;padding:14px 14px 18px;border-radius:24px;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid rgba(169,233,255,.14);
  box-shadow:0 30px 60px -44px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform .6s var(--k2-ease),border-color .6s,background .6s,box-shadow .6s}
#komora.k4 .k4-pt::after{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:45%;pointer-events:none;opacity:0;
  background:linear-gradient(100deg,rgba(169,233,255,0) 0%,rgba(169,233,255,.12) 50%,rgba(169,233,255,0) 100%);transform:translateX(-120%) skewX(-12deg)}
#komora.k4 .k4-pt.is-on{transform:translateY(-6px);border-color:rgba(127,219,255,.38);background:linear-gradient(180deg,rgba(56,182,255,.14),rgba(56,182,255,.03));
  box-shadow:0 44px 80px -42px rgba(56,182,255,.45),inset 0 1px 0 rgba(255,255,255,.1)}
#komora.k4 .k4-pt.is-on::after{animation:k4Shine 1.5s var(--k2-ease) .1s 1 both}
@keyframes k4Shine{0%{opacity:1;transform:translateX(-120%) skewX(-12deg)}100%{opacity:1;transform:translateX(320%) skewX(-12deg)}}
#komora.k4 .k4-ptx{display:flex;align-items:flex-start;gap:14px;padding:0 4px}
#komora.k4 .k4-pt .pr-ico{transition:transform .5s var(--k2-ease)}
#komora.k4 .k4-pt.is-on .pr-ico{transform:translateY(-2px) scale(1.06)}
#komora.k4 .k4-pviz{position:relative;height:100px;border-radius:16px;overflow:hidden;
  background:radial-gradient(120% 100% at 50% 0%,rgba(56,182,255,.12),rgba(4,11,22,0)),rgba(4,11,22,.45);border:1px solid rgba(169,233,255,.1);
  opacity:.72;transition:opacity .6s,border-color .6s}
#komora.k4 .k4-pt.is-on .k4-pviz{opacity:1;border-color:rgba(169,233,255,.22)}
#komora.k4 .k4-svg{position:absolute;inset:8px 10px;width:calc(100% - 20px);height:calc(100% - 16px);overflow:visible}
/* 1 – niste sami */
#komora.k4 .k4-pp circle,#komora.k4 .k4-pp path{fill:rgba(169,233,255,.16);stroke:rgba(169,233,255,.45);stroke-width:1.2}
#komora.k4 .k4-staff circle,#komora.k4 .k4-staff path{fill:#38B6FF;stroke:#A9E9FF;stroke-width:1.2}
#komora.k4 .k4-staff path{fill:rgba(56,182,255,.55)}
#komora.k4 .k4-plus circle{fill:#3EE6A8;stroke:#071A30;stroke-width:1.5}
#komora.k4 .k4-plus path{stroke:#071A30;stroke-width:1.6;stroke-linecap:round}
#komora.k4 .k4-ring{fill:none;stroke:rgba(127,219,255,.7);stroke-width:1.2;transform-box:fill-box;transform-origin:50% 50%;animation:k4Ripple 2.4s ease-out infinite}
@keyframes k4Ripple{0%{transform:scale(1);opacity:.9}100%{transform:scale(2.6);opacity:0}}
#komora.k4 .k4-links path{stroke:rgba(127,219,255,.55);stroke-dasharray:3 5;animation:k4Flow 1.6s linear infinite}
@keyframes k4Flow{to{stroke-dashoffset:-16}}
/* 2 – nadzor prek kamer */
#komora.k4 .k4-cam{position:absolute;inset:8px}
#komora.k4 .k4-cam::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(#7FDBFF,#7FDBFF) 0 0/14px 1.5px,linear-gradient(#7FDBFF,#7FDBFF) 0 0/1.5px 14px,
  linear-gradient(#7FDBFF,#7FDBFF) 100% 0/14px 1.5px,linear-gradient(#7FDBFF,#7FDBFF) 100% 0/1.5px 14px,
  linear-gradient(#7FDBFF,#7FDBFF) 0 100%/14px 1.5px,linear-gradient(#7FDBFF,#7FDBFF) 0 100%/1.5px 14px,
  linear-gradient(#7FDBFF,#7FDBFF) 100% 100%/14px 1.5px,linear-gradient(#7FDBFF,#7FDBFF) 100% 100%/1.5px 14px;background-repeat:no-repeat;opacity:.8}
#komora.k4 .k4-cam .k4-svg{inset:10px 14px 6px;width:calc(100% - 28px);height:calc(100% - 16px)}
#komora.k4 .k4-rec{position:absolute;z-index:2;left:10px;top:7px;display:flex;align-items:center;gap:5px;font:700 9.5px/1 var(--k2-sans);letter-spacing:.12em;color:#fff}
#komora.k4 .k4-rec i{width:7px;height:7px;border-radius:50%;background:#FF4D5E;box-shadow:0 0 8px #FF4D5E;animation:k4Blink 1.2s steps(2,start) infinite}
@keyframes k4Blink{to{visibility:hidden}}
#komora.k4 .k4-camn{position:absolute;z-index:2;right:10px;top:7px;font:600 9px/1 var(--k2-sans);letter-spacing:.14em;color:var(--k2-on3)}
#komora.k4 .k4-floor{stroke:rgba(169,233,255,.25);stroke-width:1.2}
#komora.k4 .k4-seats rect{fill:rgba(56,182,255,.18);stroke:rgba(169,233,255,.35);stroke-width:1.1}
#komora.k4 .k4-heads circle{fill:rgba(169,233,255,.3);stroke:rgba(169,233,255,.55);stroke-width:1.1}
#komora.k4 .k4-scan{position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.8),rgba(127,219,255,0));
  box-shadow:0 0 10px rgba(127,219,255,.6);animation:k4Scan 3.2s ease-in-out infinite alternate}
@keyframes k4Scan{from{top:4%}to{top:94%}}
#komora.k4 .k4-focus{position:absolute;top:30%;left:12%;width:20%;height:52%;border:1.5px solid rgba(62,230,168,.85);border-radius:6px;box-shadow:0 0 10px rgba(62,230,168,.35);
  animation:k4Focus 8s var(--k2-ease) infinite}
@keyframes k4Focus{0%,20%{left:10%}25%,45%{left:31%}50%,70%{left:52%}75%,95%{left:73%}100%{left:10%}}
/* 3 – pravokotna oblika */
#komora.k4 .k4-round circle:first-child{fill:rgba(255,255,255,.03);stroke:rgba(169,233,255,.32);stroke-width:1.3;stroke-dasharray:4 4}
#komora.k4 .k4-round .k4-fig{fill:rgba(169,233,255,.22);stroke:rgba(169,233,255,.4);stroke-width:1.1}
#komora.k4 .k4-rect rect{fill:rgba(56,182,255,.12);stroke:#7FDBFF;stroke-width:1.6;transform-box:fill-box;transform-origin:50% 50%;animation:k4Grow 3.4s ease-in-out infinite}
@keyframes k4Grow{0%,100%{transform:scale(.94);filter:drop-shadow(0 0 0 rgba(127,219,255,0))}50%{transform:scale(1);filter:drop-shadow(0 0 6px rgba(127,219,255,.6))}}
#komora.k4 .k4-rect .k4-fig{fill:rgba(169,233,255,.5);stroke:#A9E9FF;stroke-width:1.1}
#komora.k4 .k4-room path{fill:none;stroke:#3EE6A8;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;animation:k4Room 3.4s ease-in-out infinite}
@keyframes k4Room{0%,100%{opacity:.25}50%{opacity:1}}
#komora.k4 .k4-arrow-r{fill:none;stroke:rgba(169,233,255,.55);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;animation:k4Nudge 1.7s ease-in-out infinite}
@keyframes k4Nudge{0%,100%{transform:translateX(-3px)}50%{transform:translateX(3px)}}
#komora.k4 .k4-pviz text{font:600 8.5px var(--k2-sans);letter-spacing:.06em;fill:rgba(232,240,248,.55)}
#komora.k4 .k4-pviz text.k4-on{fill:#A9E9FF}
/* 4 – okna in TV zasloni */
#komora.k4 .k4-tvw{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:22px}
#komora.k4 .k4-port{position:relative;width:62px;height:62px;border-radius:50%;overflow:hidden;
  background:radial-gradient(circle at 35% 30%,#CFEFFF 0%,#7FC3EE 38%,#2C6FB3 100%);box-shadow:0 0 0 5px #C9D6E3,0 0 0 7px #8193A8,0 8px 18px -6px rgba(0,0,0,.8)}
#komora.k4 .k4-port i{position:absolute;top:-30%;bottom:-30%;left:0;width:34%;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.75),rgba(255,255,255,0));
  transform:translateX(-150%) skewX(-16deg);animation:k4Glint 4.5s ease-in-out infinite}
@keyframes k4Glint{0%{transform:translateX(-150%) skewX(-16deg)}45%,100%{transform:translateX(320%) skewX(-16deg)}}
#komora.k4 .k4-scr{display:grid;grid-template-columns:repeat(2,44px);gap:6px}
#komora.k4 .k4-scr i{height:28px;border-radius:5px;border:2px solid #1B2433;box-shadow:0 0 0 1px rgba(169,233,255,.25),0 6px 14px -6px rgba(0,0,0,.8);
  background:linear-gradient(120deg,#0E5FA8,#38B6FF,#3EE6A8,#1E6FD9,#7FDBFF);background-size:400% 400%;animation:k4Screen 7s ease-in-out infinite}
#komora.k4 .k4-scr i:nth-child(2){animation-delay:-1.8s;animation-duration:8s}
#komora.k4 .k4-scr i:nth-child(3){animation-delay:-3.4s;animation-duration:6.5s}
#komora.k4 .k4-scr i:nth-child(4){animation-delay:-5s;animation-duration:9s}
@keyframes k4Screen{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

#komora.k4.k4-off .k4-bub i,#komora.k4.k4-off .k4-ph img,#komora.k4.k4-off .k4-sweep,#komora.k4.k4-off .k4-live i,#komora.k4.k4-off .k4-glass,#komora.k4.k4-off .k4-chest,
#komora.k4.k4-off .k4-ours::before,#komora.k4.k4-off .k4-ours img,#komora.k4.k4-off .k4-vs::before,#komora.k4.k4-off .k4-vs::after,
#komora.k4.k4-off .k4-pviz *,#komora.k4.k4-off .k4-pviz *::before{animation-play-state:paused}
@media (max-width:1279.98px){ #komora.k4 .k4-tvw{gap:14px} #komora.k4 .k4-port{width:52px;height:52px} #komora.k4 .k4-scr{grid-template-columns:repeat(2,38px)} }
@media (max-width:1023.98px){ #komora.k4 .k4-show{grid-template-columns:1fr} #komora.k4 .k4-vid{aspect-ratio:3 / 4;width:100%;max-width:520px;justify-self:center} }
@media (max-width:700px){ #komora.k4 .k4-cmp{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){ #komora.k4 .k4-bub{display:none} }

/* =====================================================================
   V5 (21. 10. 2026) – popravki naročnika
   ===================================================================== */
/* komora (4:3, v celoti) manjša, video 9:16 v celoti; napisa pod sliko in videom */
#komora.k4 .k4-show{--vh:clamp(470px,44vw,660px);display:flex;justify-content:center;align-items:flex-end;gap:28px}
#komora.k4 .k4-photo{flex:0 0 auto;width:calc(var(--vh) * 1.15);display:flex;flex-direction:column;gap:14px}
#komora.k4 .k4-ph{aspect-ratio:4 / 3}
#komora.k4 .k4-vid{flex:0 0 auto;width:calc(var(--vh) * 9 / 16);display:flex;flex-direction:column;gap:14px}
#komora.k4 .k4-vid .k4-frame{position:relative;inset:auto;aspect-ratio:9 / 16}
#komora.k4 .k4-ph::after,#komora.k4 .k4-frame::after{background:linear-gradient(180deg,rgba(4,11,22,.28) 0%,rgba(4,11,22,0) 18%,rgba(4,11,22,0) 82%,rgba(4,11,22,.22) 100%)}
#komora.k4 .k4-ph img{transform-origin:55% 50%}
#komora.k4 .k4-cap,#komora.k4 .k4-photo .k4-cap{position:static;max-width:none;padding:0 6px;background:none;border:0;border-radius:0;-webkit-backdrop-filter:none;backdrop-filter:none}
/* »Kako mine 90 minut v komori«: fotografije poravnane, malenkost manjše (5:6 namesto 3:4) */
#komora.k4 .pr-photos{padding-bottom:0;gap:clamp(16px,1.8vw,28px)}
#komora.k4 .pr-ph:nth-child(2) figure{transform:none}
#komora.k4 .pr-ph figure{aspect-ratio:5 / 6}
#komora.k4 .pr-ph img{object-position:50% 42%}
#komora.k4 .pr-ph:nth-child(2) img{object-position:50% 30%}
#komora.k4 .pr-ph figure{transition:transform .6s var(--k2-ease),box-shadow .6s}
@media (hover:hover){ #komora.k4 .pr-ph:hover figure{transform:translateY(-6px);box-shadow:0 54px 90px -40px rgba(0,0,0,.95),0 0 0 1px rgba(127,219,255,.3)} }
@media (max-width:1023.98px){ #komora.k4 .k4-show{flex-direction:column;align-items:center} #komora.k4 .k4-photo{width:100%} #komora.k4 .k4-vid{width:min(100%,400px)} }
#komora.k4 .pr-ph figcaption{min-height:76px}
#komora.k4 .k4-show .k4-cap{min-height:66px}


/* ===== 3. Potek (Končna verzija) ===== */
/* 4. Potek – dodatni slogi samo za to sekcijo (namizje, od 1024 px).
   Verzija 3 (21. 10. 2026): kartice korakov »živijo« – koraki se izmenično osvetlijo (svetla točka potuje po črti),
   na dnu vsake kartice animiran mini prikaz (sporočilo, vprašalnik, teden terapij, utrip); daljši napis galerije se prelomi.
   Verzija 2 (21. 10. 2026): temno ozadje kot nadaljevanje sekcij 1–3 (sij, pikčasta mreža, mehurčki, vodni žig znaka),
   galerija in časovnica v temni izvedbi (stekleni koraki, črta se napolni ob prikazu), posvet in telefon v 1. koraku.
   Slogi so omejeni na #potek.p4. */
@media (min-width:1024px){

#potek.p4{position:relative;overflow:hidden;isolation:isolate;color:var(--x-on);
  background:radial-gradient(48% 42% at 96% 14%,rgba(56,182,255,.11) 0%,rgba(56,182,255,0) 70%),
             radial-gradient(40% 40% at 2% 88%,rgba(30,111,217,.13) 0%,rgba(30,111,217,0) 70%),
             linear-gradient(180deg,#071A30 0%,#06162B 55%,#050F1F 100%)}
#potek.p4 > .wrap{position:relative;z-index:1}
/* tanka svetla ločnica na prehodu iz sekcije 3 */
#potek.p4::before{content:"";position:absolute;z-index:1;top:0;left:50%;width:min(1100px,80%);height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.22) 50%,rgba(127,219,255,0))}

/* ---------- ozadje ---------- */
#potek.p4 .p4-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#potek.p4 .p4-glow{position:absolute;border-radius:50%;filter:blur(10px)}
#potek.p4 .p4-g1{width:820px;height:820px;right:-180px;top:-120px;background:radial-gradient(closest-side,rgba(56,182,255,.13),rgba(56,182,255,0))}
#potek.p4 .p4-g2{width:680px;height:680px;left:-220px;bottom:-200px;background:radial-gradient(closest-side,rgba(127,219,255,.09),rgba(127,219,255,0))}
#potek.p4 .p4-grid{position:absolute;inset:0;opacity:.45;
  background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(50% 46% at 20% 30%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(50% 46% at 20% 30%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
/* znak OxySphere – le trije mehurčki (različica motiva iz sekcij 1–3), med naslovom in galerijo */
#potek.p4 .p4-wm{position:absolute;left:calc(50% - 190px);top:44px;height:180px;width:auto;opacity:.32;overflow:visible}
#potek.p4 .p4-wm circle{transform-box:fill-box;transform-origin:50% 50%;animation:p4Float 15s ease-in-out infinite alternate}
#potek.p4 .p4-wm .p4-b2{animation-duration:11s;animation-delay:-4s}
#potek.p4 .p4-wm .p4-b3{animation-duration:9s;animation-delay:-2s}
@media (max-width:1279.98px){ #potek.p4 .p4-wm{display:none} }
@keyframes p4Float{from{transform:translateY(0)}to{transform:translateY(-1.4px)}}
#potek.p4 .p4-bub{position:absolute;inset:0;
  -webkit-mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%);mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%)}
#potek.p4 .p4-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:p4Rise var(--t) linear var(--dl) infinite,p4Sway calc(var(--t) / 4) ease-in-out var(--dl) infinite alternate}
#potek.p4 .p4-bub i:nth-child(1){--x:4%;--s:8px;--t:26s;--dl:-9s}
#potek.p4 .p4-bub i:nth-child(2){--x:14%;--s:5px;--t:20s;--dl:-3s}
#potek.p4 .p4-bub i:nth-child(3){--x:25%;--s:12px;--t:31s;--dl:-16s}
#potek.p4 .p4-bub i:nth-child(4){--x:36%;--s:6px;--t:22s;--dl:-11s}
#potek.p4 .p4-bub i:nth-child(5){--x:45%;--s:4px;--t:18s;--dl:-6s}
#potek.p4 .p4-bub i:nth-child(6){--x:54%;--s:9px;--t:28s;--dl:-19s}
#potek.p4 .p4-bub i:nth-child(7){--x:63%;--s:5px;--t:21s;--dl:-2s}
#potek.p4 .p4-bub i:nth-child(8){--x:71%;--s:14px;--t:34s;--dl:-23s}
#potek.p4 .p4-bub i:nth-child(9){--x:80%;--s:6px;--t:23s;--dl:-13s}
#potek.p4 .p4-bub i:nth-child(10){--x:88%;--s:10px;--t:30s;--dl:-7s}
#potek.p4 .p4-bub i:nth-child(11){--x:96%;--s:5px;--t:19s;--dl:-15s}
@keyframes p4Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}6%{opacity:.7}100%{transform:translate3d(0,-1500px,0) scale(1.1);opacity:.55}}
@keyframes p4Sway{from{translate:-8px 0}to{translate:8px 0}}

/* ---------- glava ---------- */
#potek.p4 .eyebrow{color:var(--x-cyan)}
#potek.p4 .h2{color:#fff;max-width:none}
#potek.p4 .h2-em{display:block;color:var(--x-aqua)}
#potek.p4 .potek-lead{color:var(--x-on-2);margin-top:20px}
#potek.p4 .potek{row-gap:72px}

/* ---------- galerija prostorov ---------- */
#potek.p4 .pg-item{box-shadow:0 34px 70px -38px rgba(0,0,0,.85);outline:1px solid rgba(127,219,255,.12);outline-offset:-1px;transition:flex-grow .8s var(--x-ease),box-shadow .5s,outline-color .5s}
#potek.p4 .pg-item.is-on{outline-color:rgba(127,219,255,.34);box-shadow:0 40px 90px -40px rgba(56,182,255,.42),0 30px 60px -36px rgba(0,0,0,.9)}
#potek.p4 .pg-item:not(.is-on)::after{background:linear-gradient(180deg,rgba(4,11,22,.3),rgba(4,11,22,.72))}
#potek.p4 .pg-item:not(.is-on):hover::after{background:linear-gradient(180deg,rgba(4,11,22,.12),rgba(4,11,22,.5))}
#potek.p4 .pg-item:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}
#potek.p4 .pg-n{color:var(--x-cyan)}

#potek.p4 .pg-cap{white-space:normal;align-items:flex-start;line-height:1.25;max-width:min(26ch, calc(100% - 32px))}
#potek.p4 .pg-cap .pg-n{padding-top:3px}

/* ---------- časovnica ---------- */
#potek.p4 .tl{position:relative;z-index:1;gap:24px;align-items:stretch}
#potek.p4 .tl::before{display:none}
#potek.p4 .p4-line{grid-column:1 / -1;grid-row:2;align-self:start;position:relative;z-index:0;height:2px;margin:27px calc((100% - 72px) / 4 - 28px) 0 28px;border-radius:2px;
  background:linear-gradient(90deg,rgba(127,219,255,.22),rgba(127,219,255,.1))}
#potek.p4 .p4-fill{position:absolute;inset:0;border-radius:inherit;transform-origin:0 50%;transform:scaleX(var(--p,0));
  background:linear-gradient(90deg,var(--x-sky),var(--x-cyan));box-shadow:0 0 14px rgba(56,182,255,.55);
  transition:transform 1.1s var(--x-ease)}
#potek.p4 .p4-dot{position:absolute;top:50%;left:calc(var(--p,0) * (100% - 10px));width:10px;height:10px;margin-top:-5px;border-radius:50%;opacity:0;
  background:#fff;box-shadow:0 0 0 3px rgba(127,219,255,.3),0 0 18px 6px rgba(127,219,255,.75);transition:left 1.1s var(--x-ease),opacity .4s}
#potek.p4.p4-go .p4-dot{opacity:1}
#potek.p4.p4-back .p4-fill{transition-duration:.7s}
#potek.p4.p4-back .p4-dot{transition-duration:.7s}

#potek.p4 .tl li{gap:20px}
#potek.p4 .tl .num{position:relative;width:56px;height:56px;color:var(--x-aqua);background:#081B31;border:1px solid rgba(127,219,255,.32);
  box-shadow:0 0 0 8px #071A30;transition:background .5s,color .5s,border-color .5s,box-shadow .5s}
#potek.p4 .tl .num::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid rgba(127,219,255,.6);opacity:0;pointer-events:none}
#potek.p4 .tl li.is-on .num{color:#fff;border-color:transparent;
  background:linear-gradient(135deg,var(--x-sky),var(--x-oxy));box-shadow:0 0 0 8px #071A30,0 10px 30px -6px rgba(56,182,255,.75)}
#potek.p4 .tl li.is-on .num::after{animation:p4Ring 2.2s ease-out infinite}
@keyframes p4Ring{0%{transform:scale(1);opacity:.75}100%{transform:scale(1.7);opacity:0}}

#potek.p4 .tl-body{position:relative;flex:1;gap:12px;padding:28px 26px 26px;border-radius:24px;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.065) 0%,rgba(255,255,255,.02) 100%);
  border:1px solid rgba(127,219,255,.14);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  box-shadow:0 30px 60px -44px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .6s var(--x-ease),border-color .6s,background .6s,box-shadow .6s}
/* svetel odsev, ki enkrat preleti osvetljeno kartico */
#potek.p4 .tl-body::before{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:45%;pointer-events:none;opacity:0;
  background:linear-gradient(100deg,rgba(169,233,255,0) 0%,rgba(169,233,255,.13) 50%,rgba(169,233,255,0) 100%);transform:translateX(-120%) skewX(-12deg)}
#potek.p4 .tl li.is-on .tl-body{transform:translateY(-6px);border-color:rgba(127,219,255,.36);
  background:linear-gradient(180deg,rgba(56,182,255,.15) 0%,rgba(56,182,255,.035) 100%);
  box-shadow:0 44px 80px -42px rgba(56,182,255,.45),inset 0 1px 0 rgba(255,255,255,.1)}
#potek.p4 .tl li.is-on .tl-body::before{animation:p4Shine 1.5s var(--x-ease) .15s 1 both}
@keyframes p4Shine{0%{opacity:1;transform:translateX(-120%) skewX(-12deg)}100%{opacity:1;transform:translateX(320%) skewX(-12deg)}}
#potek.p4 .p4-ico{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin-bottom:6px;border-radius:14px;
  color:var(--x-cyan);background:rgba(127,219,255,.08);border:1px solid rgba(127,219,255,.18);transition:color .5s,background .5s,border-color .5s,box-shadow .5s}
#potek.p4 .p4-ico .ico{width:22px;height:22px}
#potek.p4 .tl li.is-on .p4-ico{color:#fff;background:linear-gradient(135deg,rgba(56,182,255,.55),rgba(30,111,217,.55));border-color:rgba(169,233,255,.45);box-shadow:0 8px 22px -8px rgba(56,182,255,.8)}
#potek.p4 .tl li.is-on .p4-ico .ico{animation:p4Bob 2.4s ease-in-out infinite}
@keyframes p4Bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
#potek.p4 .tl-title .h3{color:#fff;font-size:20px}
#potek.p4 .tl-body p{color:var(--x-on-3)}
#potek.p4 .chip-teal{color:var(--x-aqua);background:rgba(127,219,255,.1);box-shadow:inset 0 0 0 1px rgba(127,219,255,.24)}
#potek.p4 .chip-gray{color:var(--x-on-2);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}

/* ---------- mini prikazi na dnu kartic (okrasni) ---------- */
#potek.p4 .p4-viz{position:relative;margin-top:auto;height:58px;padding-top:14px;border-top:1px solid rgba(127,219,255,.1);opacity:.72;transition:opacity .6s}
#potek.p4 .tl li.is-on .p4-viz{opacity:1}

/* 1 – sporočilo: prejeto sporočilo in »tipkanje« odgovora */
#potek.p4 .p4-chat{display:flex;align-items:center;justify-content:space-between;gap:10px}
#potek.p4 .p4-chat .c-in{display:flex;flex-direction:column;justify-content:center;gap:5px;width:58%;height:34px;padding:0 12px;border-radius:14px 14px 14px 4px;
  background:rgba(127,219,255,.1);border:1px solid rgba(127,219,255,.2)}
#potek.p4 .p4-chat .c-in i{display:block;height:4px;border-radius:2px;background:rgba(169,233,255,.45)}
#potek.p4 .p4-chat .c-in i+i{width:62%;background:rgba(169,233,255,.28)}
#potek.p4 .p4-chat .c-out{display:flex;align-items:center;gap:5px;height:34px;padding:0 14px;border-radius:14px 14px 4px 14px;
  background:linear-gradient(135deg,var(--x-sky),var(--x-oxy));box-shadow:0 8px 20px -10px rgba(56,182,255,.9)}
#potek.p4 .p4-chat .c-out i{width:6px;height:6px;border-radius:50%;background:#fff;animation:p4Type 1.3s ease-in-out infinite}
#potek.p4 .p4-chat .c-out i:nth-child(2){animation-delay:.18s}
#potek.p4 .p4-chat .c-out i:nth-child(3){animation-delay:.36s}
@keyframes p4Type{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}
#potek.p4 .p4-chat .c-in{animation:p4Pop 6s var(--x-ease) infinite}
@keyframes p4Pop{0%{opacity:0;transform:translateY(6px) scale(.96)}8%,88%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-4px)}}

/* 2 – zdravstveni vprašalnik: polja se zapovrstjo obkljukajo */
#potek.p4 .p4-form{display:flex;flex-direction:column;justify-content:center;gap:7px}
#potek.p4 .p4-form span{display:flex;align-items:center;gap:10px}
#potek.p4 .p4-form b{position:relative;flex:0 0 12px;height:12px;border-radius:4px;border:1px solid rgba(127,219,255,.45)}
#potek.p4 .p4-form b::after{content:"";position:absolute;inset:-1px;border-radius:4px;opacity:0;
  background:var(--x-cyan) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m3 6.2 2 2 4-4.4' fill='none' stroke='%23071A30' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat;
  animation:p4Tick 6s var(--x-ease) calc(var(--k) * .6s) infinite}
#potek.p4 .p4-form i{display:block;height:4px;width:var(--w,58%);border-radius:2px;background:rgba(169,233,255,.22);position:relative;overflow:hidden}
#potek.p4 .p4-form i::after{content:"";position:absolute;inset:0;background:rgba(169,233,255,.55);transform-origin:0 50%;transform:scaleX(0);
  animation:p4Fillx 6s var(--x-ease) calc(var(--k) * .6s) infinite}
@keyframes p4Tick{0%,6%{opacity:0;transform:scale(.4)}12%,86%{opacity:1;transform:scale(1)}94%,100%{opacity:0;transform:scale(1)}}
@keyframes p4Fillx{0%,4%{transform:scaleX(0)}14%,86%{transform:scaleX(1)}94%,100%{transform:scaleX(0)}}

/* 3 – teden terapij: 1× → 2–3× → 5× na teden */
#potek.p4 .p4-week{display:flex;align-items:center;justify-content:space-between;gap:12px}
#potek.p4 .p4-week .wk{display:flex;gap:6px}
#potek.p4 .p4-week .wk span{display:flex;flex-direction:column;align-items:center;gap:5px}
#potek.p4 .p4-week .wk b{position:relative;width:20px;height:20px;border-radius:50%;border:1px solid rgba(127,219,255,.3)}
#potek.p4 .p4-week .wk b::after{content:"";position:absolute;inset:3px;border-radius:50%;background:linear-gradient(135deg,var(--x-aqua),var(--x-sky));
  box-shadow:0 0 10px rgba(56,182,255,.8);opacity:0}
#potek.p4 .p4-week .wk i{font:600 10.5px/1 var(--x-sans);font-style:normal;color:var(--x-on-3);letter-spacing:.02em}
#potek.p4 .p4-week .wa b::after{opacity:1}
#potek.p4 .p4-week .wb b::after{animation:p4WB 9s ease-in-out infinite}
#potek.p4 .p4-week .wh b::after{animation:p4WH 9s ease-in-out infinite}
#potek.p4 .p4-week .wc b::after{animation:p4WC 9s ease-in-out infinite}
#potek.p4 .p4-week .wx b{border-style:dashed;border-color:rgba(127,219,255,.16)}
@keyframes p4WB{0%,31%{opacity:0;transform:scale(.3)}36%,95%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.3)}}
@keyframes p4WH{0%,31%{opacity:0;transform:scale(.3)}36%,64%{opacity:.4;transform:scale(1)}69%,95%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.3)}}
@keyframes p4WC{0%,64%{opacity:0;transform:scale(.3)}69%,95%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.3)}}
#potek.p4 .p4-week .wl{position:relative;flex:0 0 64px;height:44px;text-align:right}
#potek.p4 .p4-week .wl span{position:absolute;right:0;top:0;font:400 calc(26px * var(--x-k, 1))/1 var(--x-serif);color:#fff;opacity:0;white-space:nowrap}
#potek.p4 .p4-week .wl small{position:absolute;right:0;bottom:0;font:500 11.5px/1 var(--x-sans);color:var(--x-on-3);white-space:nowrap}
#potek.p4 .p4-week .l1{animation:p4L1 9s ease-in-out infinite}
#potek.p4 .p4-week .l2{animation:p4L2 9s ease-in-out infinite}
#potek.p4 .p4-week .l3{animation:p4L3 9s ease-in-out infinite}
@keyframes p4L1{0%,30%{opacity:1;transform:none}34%,96%{opacity:0;transform:translateY(-6px)}100%{opacity:1;transform:none}}
@keyframes p4L2{0%,31%{opacity:0;transform:translateY(6px)}35%,63%{opacity:1;transform:none}67%,100%{opacity:0;transform:translateY(-6px)}}
@keyframes p4L3{0%,64%{opacity:0;transform:translateY(6px)}68%,95%{opacity:1;transform:none}99%,100%{opacity:0;transform:translateY(-6px)}}

/* ožji zasloni (pod 1400 px): oznaka nad krogci, krogci čez vso širino */
@media (max-width:1399.98px){
  #potek.p4 .p4-viz{height:78px}
  #potek.p4 .p4-week{flex-direction:column-reverse;align-items:stretch;justify-content:flex-end;gap:6px}
  #potek.p4 .p4-week .wk{justify-content:space-between;gap:2px}
  #potek.p4 .p4-week .wk b{width:18px;height:18px}
  #potek.p4 .p4-week .wl{flex:0 0 auto;height:18px;display:flex;justify-content:flex-start;align-items:baseline}
  #potek.p4 .p4-week .wl span{left:0;right:auto;font-size:calc(19px * var(--x-k, 1))}
  #potek.p4 .p4-week .wl small{left:44px;right:auto;bottom:auto;top:4px}
}

/* 4 – spremljanje: utrip, ki potuje po črti */
#potek.p4 .p4-pulse svg{display:block;width:100%;height:44px;overflow:visible}
#potek.p4 .p4-pulse path{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
#potek.p4 .p4-pulse .pl-bg{stroke:rgba(127,219,255,.2);stroke-width:1.5}
#potek.p4 .p4-pulse .pl{stroke:var(--x-cyan);stroke-width:2.2;stroke-dasharray:22 78;stroke-dashoffset:100;filter:drop-shadow(0 0 4px rgba(127,219,255,.9));
  animation:p4Ecg 3.2s linear infinite}
@keyframes p4Ecg{to{stroke-dashoffset:0}}

/* posvet in telefon pod uvodom */
#potek.p4 .p4-act{display:flex;align-items:center;flex-wrap:wrap;gap:16px 28px;margin-top:36px}
#potek.p4 .p4-act .btn{gap:10px}
#potek.p4 .p4-act .btn .ico{width:19px;height:19px}
#potek.p4 .p4-tel{display:inline-flex;align-items:center;gap:12px;color:#fff;text-decoration:none;font:700 18px/1.2 var(--x-sans);font-variant-numeric:tabular-nums}
#potek.p4 .p4-tel-i{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;color:var(--x-cyan);
  background:rgba(127,219,255,.08);border:1px solid rgba(127,219,255,.22);transition:background .35s,border-color .35s}
#potek.p4 .p4-tel-i .ico{width:19px;height:19px}
#potek.p4 .p4-tel small{display:block;margin-bottom:2px;font:500 13px/1.3 var(--x-sans);color:var(--x-on-3)}
#potek.p4 .p4-tel:hover span{color:var(--x-aqua)}
#potek.p4 .p4-tel:hover .p4-tel-i{background:rgba(127,219,255,.16);border-color:rgba(127,219,255,.45)}
#potek.p4 .p4-tel:focus-visible{outline:2px solid var(--x-cyan);outline-offset:4px;border-radius:999px}

#potek.p4.p4-off .p4-bub i,#potek.p4.p4-off .p4-wm circle,#potek.p4.p4-off .num::after,#potek.p4.p4-off .p4-viz *,#potek.p4.p4-off .p4-viz *::after,#potek.p4.p4-off .p4-ico .ico{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){
  #potek.p4 .p4-bub{display:none}
  #potek.p4 .p4-wm circle,#potek.p4 .num::after,#potek.p4 .tl-body::before,#potek.p4 .p4-ico .ico,#potek.p4 .p4-viz *,#potek.p4 .p4-viz *::after{animation:none!important}
  #potek.p4 .p4-fill,#potek.p4 .p4-dot{transition:none}
  #potek.p4 .tl li.is-on .tl-body{transform:none}
  #potek.p4 .p4-form b::after,#potek.p4 .p4-week .wb b::after,#potek.p4 .p4-week .wh b::after{opacity:1}
  #potek.p4 .p4-form i::after{transform:scaleX(1)}
  #potek.p4 .p4-week .l2{opacity:1}
  #potek.p4 .p4-pulse .pl{stroke-dasharray:none}
}
}


/* ===== 4. Zakaj OxySphere (Končna verzija) ===== */
/* 2. Zakaj OxySphere – dodatni slogi samo za to sekcijo (namizje, od 1024 px).
   Verzija 5 (21. 10. 2026): kartica »Pred prvo terapijo …« prekrije spodnji del videa (podnapisi niso vidni), gumb za premor zgoraj desno.
   Verzija 4 (21. 10. 2026): popravki besedil (korak 02 in 03), brez napisa »Ekipa«, citat brez dodatnega narekovaja.
   Verzija 3 (20. 10. 2026): večji strokovni vodja in bolj vidna izjava, kartica »100 % medicinski kisik«, izpostavljen stavek
   o pregledu (primerna in predvsem varna), dodatni sliki spremstva v komori in nadzornega pulta, brez značke MZ.
   Verzija 2 (20. 10. 2026): sekcija je združena z »7. Ekipa« in je vizualno nadaljevanje naslovnice
   (temno ozadje, mehurčki, vodni žig znaka OxySphere). V ospredju je zdravniški pregled (video), sledijo trije
   koraki ekipe, strokovni vodja je predstavljen diskretno. Slogi so omejeni na #zakaj.z2 (višja specifičnost od skupnih). */
@media (min-width:1024px){

#zakaj.z2{position:relative;overflow:hidden;isolation:isolate;color:var(--x-on);--focus:var(--x-cyan);
  padding-block:clamp(104px, 6vw + 40px, 160px) clamp(96px, 5vw + 36px, 140px);
  background:radial-gradient(55% 45% at 88% 6%,rgba(56,182,255,.14) 0%,rgba(56,182,255,0) 70%),
             radial-gradient(45% 40% at 6% 92%,rgba(30,111,217,.16) 0%,rgba(30,111,217,0) 70%),
             linear-gradient(180deg,#071A30 0%,var(--x-abyss) 78%)}
#zakaj.z2 #ekipa{background:transparent}

/* ---------- ozadje: sij, mreža, vodni žig, mehurčki ---------- */
#zakaj.z2 .z2-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#zakaj.z2 .z2-glow{position:absolute;border-radius:50%;filter:blur(10px)}
#zakaj.z2 .z2-g1{width:720px;height:720px;left:-200px;top:22%;background:radial-gradient(closest-side,rgba(56,182,255,.16),rgba(56,182,255,0))}
#zakaj.z2 .z2-g2{width:620px;height:620px;right:-160px;top:-180px;background:radial-gradient(closest-side,rgba(127,219,255,.12),rgba(127,219,255,0))}
#zakaj.z2 .z2-grid{position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(60% 55% at 78% 40%,#000 0%,rgba(0,0,0,.4) 45%,rgba(0,0,0,0) 80%);mask-image:radial-gradient(60% 55% at 78% 40%,#000 0%,rgba(0,0,0,.4) 45%,rgba(0,0,0,0) 80%)}
#zakaj.z2 .z2-wm{position:absolute;right:-17%;top:16%;height:min(86%,1150px);width:auto;opacity:.2;transform:scaleX(-1);
  -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 50%,rgba(0,0,0,.3) 82%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(270deg,#000 0%,#000 50%,rgba(0,0,0,.3) 82%,rgba(0,0,0,0) 100%)}
#zakaj.z2 .z2-bub{position:absolute;inset:0;
  -webkit-mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%);mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%)}
#zakaj.z2 .z2-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:z2Rise var(--t) linear var(--dl) infinite,z2Sway calc(var(--t) / 4) ease-in-out var(--dl) infinite alternate}
#zakaj.z2 .z2-bub i:nth-child(1){--x:4%;--s:10px;--t:26s;--dl:0s}
#zakaj.z2 .z2-bub i:nth-child(2){--x:11%;--s:6px;--t:21s;--dl:-9s}
#zakaj.z2 .z2-bub i:nth-child(3){--x:19%;--s:14px;--t:31s;--dl:-4s}
#zakaj.z2 .z2-bub i:nth-child(4){--x:27%;--s:7px;--t:24s;--dl:-15s}
#zakaj.z2 .z2-bub i:nth-child(5){--x:35%;--s:5px;--t:19s;--dl:-2s}
#zakaj.z2 .z2-bub i:nth-child(6){--x:44%;--s:11px;--t:28s;--dl:-20s}
#zakaj.z2 .z2-bub i:nth-child(7){--x:52%;--s:6px;--t:22s;--dl:-11s}
#zakaj.z2 .z2-bub i:nth-child(8){--x:61%;--s:16px;--t:34s;--dl:-6s}
#zakaj.z2 .z2-bub i:nth-child(9){--x:68%;--s:8px;--t:25s;--dl:-17s}
#zakaj.z2 .z2-bub i:nth-child(10){--x:76%;--s:5px;--t:18s;--dl:-8s}
#zakaj.z2 .z2-bub i:nth-child(11){--x:83%;--s:12px;--t:30s;--dl:-23s}
#zakaj.z2 .z2-bub i:nth-child(12){--x:90%;--s:7px;--t:23s;--dl:-13s}
#zakaj.z2 .z2-bub i:nth-child(13){--x:96%;--s:9px;--t:27s;--dl:-3s}
#zakaj.z2 .z2-bub i:nth-child(14){--x:57%;--s:4px;--t:17s;--dl:-12s}
@keyframes z2Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}6%{opacity:.75}100%{transform:translate3d(0,-1400px,0) scale(1.1);opacity:.6}}
@keyframes z2Sway{from{translate:-8px 0}to{translate:8px 0}}
#zakaj.z2.z2-off .z2-bub i,#zakaj.z2.z2-off .z2-live i{animation-play-state:paused}

#zakaj.z2 .z2-in{position:relative;z-index:1}

/* ---------- glava ---------- */
#zakaj.z2 .z2-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end;gap:64px;margin-bottom:clamp(56px, 4vw + 16px, 84px)}
#zakaj.z2 .eyebrow{color:var(--x-cyan)}
#zakaj.z2 .h2{color:#fff;max-width:13em}
#zakaj.z2 .h2-em{color:var(--x-aqua)}
#zakaj.z2 .z2-lead{color:var(--x-on-2);margin:0 0 6px;max-width:30em}

/* ---------- oder: video + ekipa ---------- */
#zakaj.z2 .z2-stage{display:grid;grid-template-columns:clamp(400px, 36vw, 580px) minmax(0,1fr);gap:clamp(48px, 4.5vw, 88px);align-items:start}

/* video zdravniškega pregleda */
#zakaj.z2 .z2-vid{position:relative;margin:0}
#zakaj.z2 .z2-frame{position:relative;aspect-ratio:3 / 4;border-radius:30px;overflow:hidden;background:#0B2038;
  box-shadow:0 0 0 1px rgba(169,233,255,.28),0 0 0 9px rgba(127,219,255,.06),0 50px 90px -40px rgba(0,0,0,.9),0 0 80px -20px rgba(56,182,255,.45);
  transform:translateZ(0)}
#zakaj.z2 .z2-frame::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;
  background:linear-gradient(180deg,rgba(4,11,22,.42) 0%,rgba(4,11,22,0) 22%,rgba(4,11,22,0) 70%,rgba(4,11,22,.35) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 0 0 1px rgba(255,255,255,.06)}
#zakaj.z2 .z2-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
#zakaj.z2 .z2-tag,#zakaj.z2 .z2-live{position:absolute;z-index:3;top:18px;display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 11px;border-radius:999px;
  font:600 13px/1 var(--x-sans);color:#fff;background:rgba(6,18,34,.55);border:1px solid rgba(169,233,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
#zakaj.z2 .z2-tag{left:18px}
#zakaj.z2 .z2-tag .ico{width:16px;height:16px;color:var(--x-cyan)}
#zakaj.z2 .z2-live{right:18px;font-weight:500;font-size:12.5px;color:var(--x-on)}
#zakaj.z2 .z2-live i{width:8px;height:8px;border-radius:50%;background:#4BE3A6;box-shadow:0 0 0 0 rgba(75,227,166,.6);animation:z2Ping 2.2s ease-out infinite}
@keyframes z2Ping{70%{box-shadow:0 0 0 8px rgba(75,227,166,0)}100%{box-shadow:0 0 0 0 rgba(75,227,166,0)}}
#zakaj.z2 .z2-vbtn{position:absolute;z-index:3;right:16px;bottom:16px;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.4);background:rgba(6,18,34,.5);color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background-color .25s,transform .25s var(--x-ease)}
#zakaj.z2 .z2-vbtn:hover{background:rgba(6,18,34,.8);transform:scale(1.06)}
#zakaj.z2 .z2-vbtn .ico{width:16px;height:16px;fill:currentColor;stroke:none}
#zakaj.z2 .z2-vbtn .z2-i-play{display:none;margin-left:2px}
#zakaj.z2 .z2-vbtn.is-paused .z2-i-play{display:block}
#zakaj.z2 .z2-vbtn.is-paused .z2-i-pause{display:none}

/* ekipa */
#zakaj.z2 .z2-team{display:flex;flex-direction:column;padding-top:6px}
#zakaj.z2 .z2-team .head{gap:14px}
#zakaj.z2 .z2-h3{margin:0;font:400 calc(clamp(38px, 1.6vw + 18px, 54px) * var(--x-k, 1))/1.05 var(--x-serif);letter-spacing:-.01em;color:#fff}
#zakaj.z2 .z2-sub{margin:18px 0 34px;font-size:17px;line-height:1.6;color:var(--x-on-2);max-width:36em;text-wrap:pretty}

#zakaj.z2 .z2-steps{position:relative;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
#zakaj.z2 .z2-step{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:22px;padding:14px 22px 14px 14px;border-radius:24px;
  background:rgba(255,255,255,.035);border:1px solid rgba(169,233,255,.12);transition:background-color .4s,border-color .4s,transform .45s var(--x-ease)}
#zakaj.z2 .z2-step:hover{background:rgba(255,255,255,.06);border-color:rgba(169,233,255,.28);transform:translateX(4px)}
#zakaj.z2 .z2-key{padding:16px 24px 16px 16px;background:linear-gradient(110deg,rgba(56,182,255,.14),rgba(56,182,255,.03) 60%);border-color:rgba(127,219,255,.32);
  box-shadow:0 30px 60px -40px rgba(56,182,255,.7)}
#zakaj.z2 .z2-ph{position:relative;width:112px;height:112px;border-radius:18px;overflow:hidden;flex:0 0 auto;box-shadow:0 14px 26px -14px rgba(0,0,0,.8)}
#zakaj.z2 .z2-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s var(--x-ease)}
#zakaj.z2 .z2-step:hover .z2-ph img{transform:scale(1.07)}
#zakaj.z2 .z2-ph2{width:auto;height:auto;display:grid;grid-template-columns:132px 132px;gap:8px;overflow:visible;box-shadow:none}
#zakaj.z2 .z2-ph2 img{width:132px;height:150px;border-radius:18px;box-shadow:0 14px 26px -14px rgba(0,0,0,.8)}
#zakaj.z2 .z2-ph2 img:last-child{transform:translateY(10px)}
#zakaj.z2 .z2-step:hover .z2-ph2 img{transform:scale(1.04)}
#zakaj.z2 .z2-step:hover .z2-ph2 img:last-child{transform:translateY(10px) scale(1.04)}
#zakaj.z2 .z2-st{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0}
#zakaj.z2 .z2-n{font:600 12px/1 var(--x-sans);letter-spacing:.2em;color:var(--x-cyan)}
#zakaj.z2 .z2-st h4{margin:0;font:600 19px/1.3 var(--x-sans);color:#fff;letter-spacing:-.005em}
#zakaj.z2 .z2-key .z2-st h4{font-size:21px}
#zakaj.z2 .z2-st p{margin:0;font-size:15px;line-height:1.55;color:var(--x-on-3);text-wrap:pretty}


/* ---------- poziv k dejanju ---------- */
#zakaj.z2 .z2-cta{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:clamp(64px, 4vw + 24px, 96px);padding:22px 26px;border-radius:28px;
  background:linear-gradient(100deg,rgba(30,111,217,.22),rgba(56,182,255,.06) 55%,rgba(255,255,255,.03));border:1px solid rgba(127,219,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 40px 80px -50px rgba(56,182,255,.6)}
#zakaj.z2 .z2-cta-btns{display:flex;align-items:center;gap:14px}
#zakaj.z2 .z2-ghost:hover .ico{transform:translateX(3px)}
#zakaj.z2 .z2-ghost .ico{transition:transform .25s var(--x-ease)}
#zakaj.z2 .z2-proof{display:inline-flex;align-items:center;gap:12px;padding:8px 18px 8px 8px;border-radius:999px;border:1px solid rgba(169,233,255,.2);color:var(--x-on);text-decoration:none;font-size:15px;transition:border-color .25s,background-color .25s}
#zakaj.z2 .z2-proof:hover{border-color:rgba(169,233,255,.5);background:rgba(255,255,255,.04)}
#zakaj.z2 .z2-proof b{color:#fff}
#zakaj.z2 .z2-proof>.ico{width:16px;height:16px;color:var(--x-cyan)}
#zakaj.z2 .z2-ring{position:relative;width:40px;height:40px;display:flex;align-items:center;justify-content:center}
#zakaj.z2 .z2-ring svg{position:absolute;inset:0;transform:rotate(-90deg)}
#zakaj.z2 .z2-ring circle{fill:none;stroke:rgba(127,219,255,.18);stroke-width:2.6}
#zakaj.z2 .z2-ring .z2-arc{stroke:var(--x-cyan);stroke-dasharray:99 100;stroke-linecap:round}
#zakaj.z2 .z2-ring b{font:700 11.5px var(--x-sans)}

/* ---------- V3: izpostavljen stavek o pregledu pod videom ---------- */
#zakaj.z2 .z2-vcap{display:flex;align-items:flex-start;gap:16px;margin-top:22px;padding:20px 22px;border-radius:22px;
  background:linear-gradient(120deg,rgba(28,174,143,.16),rgba(28,174,143,.03) 70%);border:1px solid rgba(110,230,200,.32);
  box-shadow:0 30px 60px -40px rgba(28,174,143,.7),inset 0 1px 0 rgba(255,255,255,.06)}
#zakaj.z2 .z2-vc-ico.i3d{flex:0 0 46px;width:46px;height:46px;margin-top:2px}
#zakaj.z2 .z2-vc-ico .ico{width:22px;height:22px}
#zakaj.z2 .z2-vc-t{font-size:18px;line-height:1.5;color:var(--x-on-2);text-wrap:pretty}
#zakaj.z2 .z2-vc-t b{display:block;margin-bottom:4px;font:600 21px/1.3 var(--x-sans);color:#fff;letter-spacing:-.005em}
#zakaj.z2 .z2-vc-t em{font-style:normal;font-weight:700;color:#8DF2D8;background:linear-gradient(transparent 62%,rgba(28,174,143,.35) 62%);padding:0 2px}

/* ---------- V3: vrstica strokovni vodja + 100 % medicinski kisik ---------- */
#zakaj.z2 .z2-duo{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:28px;margin-top:clamp(56px, 3vw + 28px, 84px);align-items:stretch}
/* strokovni vodja */
#zakaj.z2 .z2-prof{position:relative;display:grid;grid-template-columns:clamp(220px, 19vw, 300px) minmax(0,1fr);gap:clamp(28px, 2.6vw, 44px);align-items:center;
  padding:26px clamp(26px, 2.4vw, 40px) 26px 26px;border-radius:30px;overflow:hidden;
  background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.02) 60%);border:1px solid rgba(169,233,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 40px 80px -50px rgba(0,0,0,.9)}
#zakaj.z2 .z2-prof::before{content:"";position:absolute;left:-80px;top:-80px;width:360px;height:360px;border-radius:50%;background:radial-gradient(closest-side,rgba(56,182,255,.22),rgba(56,182,255,0));pointer-events:none}
#zakaj.z2 .z2-prof-img{position:relative;margin:0;aspect-ratio:4 / 5;border-radius:999px 999px 22px 22px;overflow:hidden;
  box-shadow:0 0 0 1px rgba(169,233,255,.3),0 0 0 8px rgba(127,219,255,.06),0 30px 60px -28px rgba(0,0,0,.9)}
#zakaj.z2 .z2-prof-img img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block;transition:transform .9s var(--x-ease)}
#zakaj.z2 .z2-prof:hover .z2-prof-img img{transform:scale(1.04)}
#zakaj.z2 .z2-prof-t{position:relative;display:flex;flex-direction:column;align-items:flex-start;min-width:0}
#zakaj.z2 .z2-prof-l{margin:0 0 10px;font:600 11.5px var(--x-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--x-cyan)}
#zakaj.z2 .z2-prof-n{margin:0;font:400 calc(clamp(26px, .9vw + 16px, 34px) * var(--x-k, 1))/1.12 var(--x-serif);color:#fff;letter-spacing:-.01em}
#zakaj.z2 .z2-prof-r{margin:6px 0 0;font-size:15px;color:var(--x-on-3)}
#zakaj.z2 .z2-q{position:relative;margin:24px 0 26px;padding-left:20px;border-left:2px solid rgba(127,219,255,.45)}
#zakaj.z2 .z2-q .ico{display:block;width:30px;height:30px;margin-bottom:8px;color:var(--x-aqua);opacity:.7}
#zakaj.z2 .z2-q p{margin:0;font:italic 400 calc(clamp(24px, 1vw + 14px, 32px) * var(--x-k, 1))/1.25 var(--x-serif);color:#fff;text-wrap:balance}
#zakaj.z2 .z2-yt{display:inline-flex;align-items:center;gap:16px;max-width:100%;padding:8px 22px 8px 8px;border-radius:20px;border:1px solid rgba(169,233,255,.26);background:rgba(4,11,22,.4);color:#fff;text-decoration:none;
  transition:background-color .25s,border-color .25s,transform .3s var(--x-ease)}
#zakaj.z2 .z2-yt:hover{background:rgba(255,255,255,.07);border-color:rgba(169,233,255,.55);transform:translateY(-2px)}
#zakaj.z2 .z2-yt-th{position:relative;width:176px;height:99px;border-radius:14px;overflow:hidden;flex:0 0 auto}
#zakaj.z2 .z2-yt-th img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--x-ease)}
#zakaj.z2 .z2-yt:hover .z2-yt-th img{transform:scale(1.06)}
#zakaj.z2 .z2-yt-p{position:absolute;left:50%;top:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:#fff;color:var(--x-ink);display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 0 rgba(255,255,255,.55);animation:z2PlayPing 2.6s ease-out 1.5s infinite}
#zakaj.z2 .z2-yt-p .ico{width:16px;height:16px;margin-left:2px}
@keyframes z2PlayPing{70%{box-shadow:0 0 0 12px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
#zakaj.z2 .z2-yt-t{display:flex;flex-direction:column;gap:3px}
#zakaj.z2 .z2-yt-t b{font:600 16px/1.3 var(--x-sans);white-space:nowrap}
#zakaj.z2 .z2-yt-t small{font-size:13px;color:var(--x-on-3)}

/* 100 % medicinski kisik */
#zakaj.z2 .z2-o2{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:100%;padding:30px 32px;border-radius:30px;overflow:hidden;isolation:isolate;
  border:1px solid rgba(169,233,255,.22);box-shadow:0 40px 80px -46px rgba(56,182,255,.75)}
#zakaj.z2 .z2-o2-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:60% 30%;transition:transform 1.2s var(--x-ease)}
#zakaj.z2 .z2-o2:hover .z2-o2-bg{transform:scale(1.04)}
#zakaj.z2 .z2-o2::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(4,11,22,.66) 0%,rgba(4,11,22,.12) 34%,rgba(4,11,22,.25) 52%,rgba(4,11,22,.92) 100%),linear-gradient(90deg,rgba(4,11,22,.4),rgba(4,11,22,0) 60%)}
#zakaj.z2 .z2-o2-num{position:absolute;left:30px;top:22px;font:300 clamp(78px, 4.6vw + 20px, 112px)/1 var(--x-serif);letter-spacing:-.03em;color:#fff;text-shadow:0 10px 30px rgba(0,0,0,.4)}
#zakaj.z2 .z2-o2-num small{font:600 22px var(--x-sans);color:var(--x-cyan);margin-left:6px;vertical-align:.9em;letter-spacing:0}
#zakaj.z2 .z2-o2-mol{position:absolute;right:20px;top:18px;width:150px}
#zakaj.z2 .z2-o2-mol svg{display:block;width:100%;height:auto;overflow:visible}
#zakaj.z2 .z2-o2-mol text{font:600 26px var(--x-sans);fill:rgba(255,255,255,.92)}
#zakaj.z2 .z2-o2-g{transform-box:fill-box;transform-origin:50% 50%;animation:z2Mol 6s ease-in-out infinite}
@keyframes z2Mol{50%{transform:translateY(-6px) rotate(-4deg)}}
#zakaj.z2 .z2-o2-bub{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
#zakaj.z2 .z2-o2-bub i{position:absolute;bottom:-14px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;border:1px solid rgba(169,233,255,.7);
  background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.8) 0%,rgba(169,233,255,.15) 55%,rgba(169,233,255,0) 70%);animation:z2O2Rise var(--t) linear var(--dl) infinite}
#zakaj.z2 .z2-o2-bub i:nth-child(1){--x:12%;--s:8px;--t:7s;--dl:0s}
#zakaj.z2 .z2-o2-bub i:nth-child(2){--x:28%;--s:5px;--t:6s;--dl:-2s}
#zakaj.z2 .z2-o2-bub i:nth-child(3){--x:46%;--s:10px;--t:8s;--dl:-4s}
#zakaj.z2 .z2-o2-bub i:nth-child(4){--x:63%;--s:6px;--t:6.5s;--dl:-1s}
#zakaj.z2 .z2-o2-bub i:nth-child(5){--x:78%;--s:9px;--t:7.5s;--dl:-5s}
#zakaj.z2 .z2-o2-bub i:nth-child(6){--x:90%;--s:5px;--t:5.5s;--dl:-3s}
#zakaj.z2 .z2-o2-bub i:nth-child(7){--x:37%;--s:4px;--t:5s;--dl:-2.5s}
@keyframes z2O2Rise{0%{transform:translateY(0) scale(.6);opacity:0}10%{opacity:.85}80%{opacity:.5}100%{transform:translateY(-420px) scale(1.1);opacity:0}}
#zakaj.z2 .z2-o2-t{position:relative;margin-top:150px}
#zakaj.z2 .z2-o2-t h3{margin:0 0 8px;font:600 24px/1.25 var(--x-sans);color:#fff}
#zakaj.z2 .z2-o2-t p{margin:0;font-size:16px;line-height:1.55;color:var(--x-on-2);max-width:24em}
#zakaj.z2.z2-off .z2-o2-g,#zakaj.z2.z2-off .z2-o2-bub i,#zakaj.z2.z2-off .z2-yt-p{animation-play-state:paused}

@media (max-width:1599.98px){
  #zakaj.z2 .z2-yt-th{width:132px;height:74px}
  #zakaj.z2 .z2-yt-p{width:36px;height:36px;margin:-18px 0 0 -18px}
  #zakaj.z2 .z2-yt-t b{white-space:normal}
}
@media (max-width:1279.98px){
  #zakaj.z2 .z2-head{grid-template-columns:1fr;gap:22px}
  #zakaj.z2 .z2-ph2{grid-template-columns:104px 104px}
  #zakaj.z2 .z2-ph2 img{width:104px;height:122px}
  #zakaj.z2 .z2-duo{grid-template-columns:1fr}
  #zakaj.z2 .z2-o2{min-height:380px}
  #zakaj.z2 .z2-cta{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  #zakaj.z2 .z2-bub,  #zakaj.z2 .z2-live i,#zakaj.z2 .z2-o2-g,#zakaj.z2 .z2-o2-bub i{animation:none}
}
}

/* ---------- V5: kartica prekrije spodnji pas videa s podnapisi ---------- */
@media (min-width:1024px){
  #zakaj.z2 .z2-vcap{position:relative;z-index:5;margin:-20% 16px 0;
    background:linear-gradient(120deg,rgba(28,174,143,.24),rgba(28,174,143,.07) 70%),rgba(6,18,30,.95);
    -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
    box-shadow:0 -18px 40px -12px rgba(4,11,22,.75),0 30px 60px -40px rgba(28,174,143,.7),inset 0 1px 0 rgba(255,255,255,.08)}
  #zakaj.z2 .z2-vbtn{top:64px;right:18px;bottom:auto}
}


/* ===== 5. Cenik (Končna verzija) ===== */
/* 8. Cenik – dodatni slogi samo za to sekcijo.
   Verzija 5 (21. 10. 2026): področja na paketih z malo začetnico in v vrsticah (več oznak v vrsti), nova naslova polj.
   Verzija 4 (21. 10. 2026): nove animirane ikone (koledar, merilnik, srce z utripom, košarica, kartica z obroki, dokument),
   poudarjen prihranek Paketa 30, področja na paketih kot oznake, gumb »Pišite za ponudbo« (glej konec datoteke).
   Verzija 3 (21. 10. 2026): oznaki paketov višje in bolj vidni (nad robom kartice, z ikono), nov uvod, poudarek frekvence
   s ponazoritvijo seštevanja učinka, »Tipično za« na vsakem paketu (glej konec datoteke).
   Verzija 2 (21. 10. 2026): temno nadaljevanje sekcij 1–6 (sij, pikčasta mreža, mehurčki, polmesec iz znaka),
   stekleni paketi z obarvano obrobo, ikone s sijem in obročem, temen graf, storitve in Leanpay. Vsebina nespremenjena.
   Slogi so omejeni na #cenik.c8 (namizje, od 1024 px). */
#cenik .c8-icw{position:relative;display:inline-flex;flex:none}
#cenik .ppc-sum > .c8-icw{grid-row:1 / 3}
#cenik .c8-ring{display:none}
@media (min-width:1024px){

#cenik.c8{color:var(--x-on);
  background:radial-gradient(40% 26% at 4% 10%,rgba(30,111,217,.14) 0%,rgba(30,111,217,0) 70%),
             radial-gradient(44% 30% at 98% 46%,rgba(56,182,255,.11) 0%,rgba(56,182,255,0) 70%),
             linear-gradient(180deg,#050F1F 0%,#071A30 30%,#06162B 70%,#050F1F 100%)}
#cenik.c8 .price-glow{display:none}
#cenik.c8 > .wrap{position:relative;z-index:1}
#cenik.c8::before{content:"";position:absolute;z-index:1;top:0;left:50%;width:min(1100px,80%);height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.22) 50%,rgba(127,219,255,0))}

/* ---------- ozadje ---------- */
#cenik.c8 .c8-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#cenik.c8 .c8-glow{position:absolute;border-radius:50%;filter:blur(10px)}
#cenik.c8 .c8-g1{width:820px;height:820px;left:-260px;top:-240px;background:radial-gradient(closest-side,rgba(56,182,255,.12),rgba(56,182,255,0))}
#cenik.c8 .c8-g2{width:900px;height:900px;right:-260px;top:30%;background:radial-gradient(closest-side,rgba(30,111,217,.14),rgba(30,111,217,0))}
#cenik.c8 .c8-g3{width:760px;height:760px;left:10%;bottom:-320px;background:radial-gradient(closest-side,rgba(127,219,255,.08),rgba(127,219,255,0))}
#cenik.c8 .c8-grid{position:absolute;inset:0;opacity:.45;
  background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(42% 16% at 20% 8%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(42% 16% at 20% 8%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
#cenik.c8 .c8-wm{position:absolute;right:-260px;top:30%;height:min(980px,46%);width:auto;opacity:.13;
  -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 45%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(270deg,#000 0%,#000 45%,rgba(0,0,0,0) 100%)}
#cenik.c8 .c8-bub{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%);mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%)}
#cenik.c8 .c8-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:c8Rise var(--t) linear var(--dl) infinite,c8Sway calc(var(--t) / 6) ease-in-out var(--dl) infinite alternate}
#cenik.c8 .c8-bub i:nth-child(1){--x:3%;--s:9px;--t:40s;--dl:-8s}
#cenik.c8 .c8-bub i:nth-child(2){--x:11%;--s:5px;--t:33s;--dl:-21s}
#cenik.c8 .c8-bub i:nth-child(3){--x:20%;--s:12px;--t:46s;--dl:-14s}
#cenik.c8 .c8-bub i:nth-child(4){--x:31%;--s:6px;--t:36s;--dl:-29s}
#cenik.c8 .c8-bub i:nth-child(5){--x:41%;--s:4px;--t:30s;--dl:-10s}
#cenik.c8 .c8-bub i:nth-child(6){--x:50%;--s:10px;--t:43s;--dl:-34s}
#cenik.c8 .c8-bub i:nth-child(7){--x:59%;--s:6px;--t:35s;--dl:-3s}
#cenik.c8 .c8-bub i:nth-child(8){--x:67%;--s:14px;--t:49s;--dl:-25s}
#cenik.c8 .c8-bub i:nth-child(9){--x:76%;--s:7px;--t:38s;--dl:-13s}
#cenik.c8 .c8-bub i:nth-child(10){--x:84%;--s:5px;--t:32s;--dl:-18s}
#cenik.c8 .c8-bub i:nth-child(11){--x:91%;--s:11px;--t:45s;--dl:-37s}
#cenik.c8 .c8-bub i:nth-child(12){--x:97%;--s:6px;--t:35s;--dl:-5s}
@keyframes c8Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}5%{opacity:.7}100%{transform:translate3d(0,-2600px,0) scale(1.1);opacity:.5}}
@keyframes c8Sway{from{translate:-8px 0}to{translate:8px 0}}

/* ---------- ikone s sijem in obročem ---------- */
#cenik.c8 .c8-icw{--rc:127,219,255}
#cenik.c8 .price-perk .c8-icw,#cenik.c8 .lp-ico.i3d-teal{--rc:63,201,183}
#cenik.c8 .price-perk .c8-icw,#cenik.c8 .price-extra .leanpay:first-child .c8-icw{--rc:63,201,183}
#cenik.c8 .c8-icw::before{content:"";position:absolute;inset:-16px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--rc),.26),rgba(var(--rc),0));pointer-events:none}
#cenik.c8 .c8-ring{display:block;position:absolute;inset:-6px;border-radius:36%;border:1px dashed rgba(var(--rc),.5);pointer-events:none;animation:c8Spin 14s linear infinite}
@keyframes c8Spin{to{transform:rotate(360deg)}}

/* ---------- glava ---------- */
#cenik.c8 .eyebrow{color:var(--x-cyan)}
#cenik.c8 .h2{color:#fff}
#cenik.c8 .h2-em{color:var(--x-aqua)}
#cenik.c8 .price-lead{color:var(--x-on-2)}
#cenik.c8 .price-perk{background:linear-gradient(120deg,rgba(28,174,143,.18) 0%,rgba(28,174,143,.05) 100%);border:1px solid rgba(63,201,183,.34);
  box-shadow:0 30px 60px -40px rgba(28,174,143,.5),inset 0 1px 0 rgba(255,255,255,.08)}
#cenik.c8 .price-perk b{color:#7FF0D6}
#cenik.c8 .price-perk p{color:var(--x-on-2)}

/* ---------- graf cene ene terapije ---------- */
#cenik.c8 .ppc{background:linear-gradient(150deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.16);
  box-shadow:0 40px 80px -50px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
#cenik.c8 .ppc-k{color:var(--x-cyan)}
#cenik.c8 .ppc-big{color:var(--x-on-3)}
#cenik.c8 .ppc-big b{color:#fff}
#cenik.c8 .ppc-t{color:var(--x-on-2)}
#cenik.c8 .c8-chart .ppc-cols{position:relative;padding-bottom:0;
  background:repeating-linear-gradient(to top,rgba(127,219,255,.08) 0 1px,rgba(127,219,255,0) 1px 42px);background-position:0 calc(100% - 30px);background-repeat:no-repeat;background-size:100% calc(100% - 46px)}
#cenik.c8 .ppc-v{color:#fff}
#cenik.c8 .ppc-c:first-child .ppc-v{color:var(--x-on-3)}
#cenik.c8 .ppc-n{color:var(--x-on-3)}
#cenik.c8 .ppc-c.is-best .ppc-n{color:#fff}
#cenik.c8 .ppc-c:first-child .ppc-b{background:linear-gradient(180deg,rgba(232,240,248,.32) 0%,rgba(232,240,248,.12) 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),inset 0 0 0 1px rgba(255,255,255,.12)}
#cenik.c8 .ppc-b{position:relative;overflow:hidden;box-shadow:0 18px 30px -14px rgba(56,182,255,.6),inset 0 1px 0 rgba(255,255,255,.5)}
#cenik.c8 .ppc-c.is-best .ppc-b{background:radial-gradient(circle at 30% 24%,rgba(255,255,255,.85) 0 3px,transparent 4px),radial-gradient(circle at 70% 48%,rgba(255,255,255,.6) 0 2px,transparent 3px),radial-gradient(circle at 38% 74%,rgba(255,255,255,.5) 0 2.5px,transparent 3.5px),linear-gradient(180deg,#A9E9FF 0%,#38B6FF 55%,#1E6FD9 100%);
  box-shadow:0 0 0 2px rgba(169,233,255,.7),0 0 34px rgba(127,219,255,.55)}
/* svetel odsev, ki potuje po stolpcih */
#cenik.c8 .ppc-c:not(:first-child) .ppc-b::after{content:"";position:absolute;left:-20%;right:-20%;top:100%;height:40%;
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.35),rgba(255,255,255,0));animation:c8Bar 5s ease-in-out calc(1.5s + var(--j) * .35s) infinite}
@keyframes c8Bar{0%{top:100%}35%,100%{top:-40%}}

/* ---------- paketi ---------- */
#cenik.c8 .pkg{color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.065) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.14);
  box-shadow:0 30px 60px -44px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.06)}
#cenik.c8 .pkg::before{background:radial-gradient(380px circle at var(--mx,50%) var(--my,0%),rgba(56,182,255,.16),transparent 60%)}
#cenik.c8 .pkg:hover{border-color:rgba(127,219,255,.4);box-shadow:0 44px 80px -42px rgba(56,182,255,.45),inset 0 1px 0 rgba(255,255,255,.1)}
#cenik.c8 .pkg-name{color:var(--x-cyan)}
#cenik.c8 .pkg-price{color:#fff}
#cenik.c8 .pkg-desc{color:var(--x-on-3)}
#cenik.c8 .pkg-bar,#cenik.c8 .pkg-list{border-top-color:rgba(127,219,255,.14)!important}
#cenik.c8 .pkg-bar-top{color:var(--x-on-3)}
#cenik.c8 .pkg-bar-top b{color:#fff}
#cenik.c8 .pkg-off{background:conic-gradient(from -90deg,var(--x-sky) 0 calc(var(--p) * 1%),rgba(255,255,255,.12) 0);box-shadow:0 0 18px -6px rgba(56,182,255,.6)}
#cenik.c8 .pkg-off::before{background:#0B2038}
#cenik.c8 .pkg-off b{color:#fff}
#cenik.c8 .pkg-dots i{background:radial-gradient(circle at 34% 30%,#FFFFFF 0 14%,#A9E9FF 46%,#38B6FF 100%);box-shadow:0 0 7px rgba(127,219,255,.45);transition:transform .35s var(--x-ease)}
#cenik.c8 .pkg:hover .pkg-dots i{animation:c8Dot 1.2s ease-in-out calc(var(--i) * 30ms) 1}
@keyframes c8Dot{0%,100%{transform:none}40%{transform:translateY(-3px) scale(1.12)}}
#cenik.c8 .pkg-save{color:var(--x-on-3)}
#cenik.c8 .pkg-save-pill{color:#7FF0D6;background:rgba(28,174,143,.18);box-shadow:inset 0 0 0 1px rgba(63,201,183,.35)}
#cenik.c8 .pkg-list li{color:var(--x-on-2)}
#cenik.c8 .pkg-list b{color:#fff}
#cenik.c8 .pkg-list .ico{color:#3FE0C2;background:rgba(28,174,143,.2);box-shadow:0 0 10px -2px rgba(63,201,183,.6)}
#cenik.c8 .btn-outline.pkg-cta{color:#fff;border-color:rgba(232,240,248,.55)}
#cenik.c8 .btn-outline.pkg-cta:hover{background:#fff;color:var(--x-ink);border-color:#fff}
#cenik.c8 .pkg-alt{color:var(--x-aqua);text-decoration-color:rgba(169,233,255,.45)}
#cenik.c8 .pkg-alt:hover{text-decoration-color:currentColor}
/* najpogosteje izbran: modra steklena kartica s krožečo svetlo obrobo */
@property --c8a{syntax:'<angle>';inherits:false;initial-value:0deg}
#cenik.c8 .pkg-pop{background:linear-gradient(180deg,rgba(56,182,255,.2) 0%,rgba(30,111,217,.08) 55%,rgba(255,255,255,.02) 100%)!important;
  border:1px solid rgba(127,219,255,.5)!important;box-shadow:0 0 0 1px rgba(127,219,255,.15),0 50px 90px -40px rgba(56,182,255,.6)!important}
#cenik.c8 .pkg-pop::after,#cenik.c8 .pkg-best::after{content:"";position:absolute;inset:-1px;z-index:2;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--c8a),rgba(127,219,255,0) 0deg,rgba(169,233,255,.95) 45deg,rgba(56,182,255,.3) 95deg,rgba(127,219,255,0) 150deg,rgba(127,219,255,0) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:c8Border 7s linear infinite}
@keyframes c8Border{to{--c8a:360deg}}
#cenik.c8 .pkg-pop .pkg-off::before{background:#0E2D52}
#cenik.c8 .pkg-pop .pkg-tag{background:linear-gradient(135deg,var(--x-sky),var(--x-oxy));color:#fff;box-shadow:0 10px 24px -8px rgba(56,182,255,.85)}
/* najnižja cena: temnejša kartica s turkizno-modro obrobo */
#cenik.c8 .pkg-best{background:radial-gradient(120% 60% at 50% 0%,rgba(127,219,255,.26),rgba(127,219,255,0) 62%),linear-gradient(170deg,#1A4F82 0%,#0F3560 50%,#0A2442 100%)!important;
  border-color:rgba(169,233,255,.55)!important;box-shadow:0 0 0 1px rgba(169,233,255,.18),0 50px 90px -40px rgba(127,219,255,.5)}
#cenik.c8 .pkg-best::after{animation-duration:9s;animation-direction:reverse}
#cenik.c8 .pkg-best .pkg-off::before{background:#0C2848}

/* ---------- legenda, spletni nakup ---------- */
#cenik.c8 .bar-legend{color:var(--x-on-3)}
#cenik.c8 .buy-strip{background:radial-gradient(60% 120% at 100% 0%,rgba(56,182,255,.28),rgba(56,182,255,0) 60%),linear-gradient(120deg,#0B2747 0%,#0E3058 50%,#123C66 100%);
  border:1px solid rgba(127,219,255,.28);box-shadow:0 50px 90px -50px rgba(56,182,255,.5),inset 0 1px 0 rgba(255,255,255,.1)}

/* ---------- posamezne storitve, Leanpay, cenik ---------- */
#cenik.c8 .sub-label{color:var(--x-cyan)}
#cenik.c8 .svc{background:linear-gradient(180deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.14);box-shadow:0 30px 60px -44px rgba(0,0,0,.9)}
#cenik.c8 .svc li + li{border-top-color:rgba(127,219,255,.12)}
#cenik.c8 .svc li{transition:background .3s}
#cenik.c8 .svc li:hover{background:rgba(127,219,255,.05)}
#cenik.c8 .svc span{color:#fff}
#cenik.c8 .svc b{color:#fff}
#cenik.c8 .svc-note{color:#5FE3C9}
#cenik.c8 .svc-buy{background:rgba(255,255,255,.05);border-color:rgba(127,219,255,.35);color:var(--x-aqua)}
#cenik.c8 .svc-buy:hover{background:linear-gradient(135deg,var(--x-sky),var(--x-oxy));border-color:transparent;color:#fff}
#cenik.c8 .leanpay{background:linear-gradient(180deg,rgba(255,255,255,.065) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.14);box-shadow:0 30px 60px -44px rgba(0,0,0,.9)}
#cenik.c8 .leanpay:hover{border-color:rgba(127,219,255,.4);box-shadow:0 40px 70px -40px rgba(56,182,255,.45)}
#cenik.c8 .leanpay span.lp-txt{color:#fff}
#cenik.c8 .lp-txt b{color:#fff}
#cenik.c8 .lp-txt small{color:var(--x-on-3)}
#cenik.c8 .leanpay .lp-chev{color:var(--x-aqua);transition:transform .3s var(--x-ease)}
#cenik.c8 .leanpay:hover .lp-chev{transform:translateX(3px)}
#cenik.c8 .leanpay .c8-icw{display:inline-flex}
#cenik.c8 .fine{color:var(--x-on-3)}
#cenik.c8 .btn:focus-visible,#cenik.c8 .pkg-alt:focus-visible,#cenik.c8 .leanpay:focus-visible,#cenik.c8 .svc-buy:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}

#cenik.c8.c8-off .c8-bub i,#cenik.c8.c8-off .c8-ring,#cenik.c8.c8-off .ppc-b::after,#cenik.c8.c8-off .pkg-pop::after,#cenik.c8.c8-off .pkg-best::after{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){
  #cenik.c8 .c8-bub{display:none}
  #cenik.c8 .c8-ring,#cenik.c8 .ppc-b::after,#cenik.c8 .pkg-pop::after,#cenik.c8 .pkg-best::after,#cenik.c8 .pkg-dots i{animation:none!important}
}
}

/* =====================================================================
   V3 (21. 10. 2026) – popravki naročnika
   ===================================================================== */
#cenik .pkg-use-i .ico,#cenik .c8-fq-viz svg{max-width:100%}
@media (min-width:1024px){
/* oznaki paketov: nad robom kartice, nad svetlo obrobo, z ikono */
#cenik.c8 .pkgs{padding-top:46px}
#cenik.c8 .pkg-tag{z-index:6;top:0;display:inline-flex;align-items:center;gap:8px;transform:translate(-50%,calc(-100% - 8px));padding:9px 18px 9px 14px;
  font:700 13.5px/1.2 var(--x-sans);letter-spacing:.02em;white-space:nowrap;animation:c8Tag 2.8s ease-in-out infinite}
#cenik.c8 .pkg-tag .ico{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#cenik.c8 .pkg-tag::after{content:"";position:absolute;left:50%;bottom:-6px;width:12px;height:12px;margin-left:-6px;border-radius:3px;transform:rotate(45deg);background:inherit;z-index:-1}
#cenik.c8 .pkg-pop .pkg-tag{background:linear-gradient(135deg,#4FB4FF,#1E6FD9);color:#fff;--tg:56,182,255}
#cenik.c8 .pkg-best .pkg-tag{background:linear-gradient(135deg,#C9F1FF,#7FDBFF);color:#062033;--tg:127,219,255}
@keyframes c8Tag{0%,100%{box-shadow:0 10px 24px -10px rgba(var(--tg),.75),inset 0 1px 0 rgba(255,255,255,.35)}50%{box-shadow:0 12px 36px -6px rgba(var(--tg),1),inset 0 1px 0 rgba(255,255,255,.35)}}

/* »Tipično za« na paketih */
#cenik.c8 .pkg-use{display:flex;align-items:center;gap:12px;margin-top:6px;padding:10px 12px;border-radius:16px;background:rgba(127,219,255,.06);border:1px solid rgba(127,219,255,.14)}
#cenik.c8 .pkg-use-i{flex:0 0 34px;width:34px;height:34px;display:grid;place-items:center;border-radius:11px;color:#fff;
  background:linear-gradient(135deg,rgba(56,182,255,.6),rgba(30,111,217,.6));box-shadow:0 8px 18px -8px rgba(56,182,255,.8),inset 0 1px 0 rgba(255,255,255,.3)}
#cenik.c8 .pkg-use-i .ico{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
#cenik.c8 .pkg-use > span:last-child{display:flex;flex-direction:column;gap:2px;font:600 14px/1.3 var(--x-sans);color:#fff}
#cenik.c8 .pkg-use small{font:700 10.5px/1.2 var(--x-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--x-cyan)}
#cenik.c8 .pkg-best .pkg-use{background:rgba(169,233,255,.1);border-color:rgba(169,233,255,.26)}
#cenik.c8 .pkg-pop .pkg-use{background:rgba(56,182,255,.12);border-color:rgba(127,219,255,.28)}
@media (max-width:1279.98px){ #cenik.c8 .pkg-use{gap:10px;padding:9px 10px} #cenik.c8 .pkg-use-i{flex-basis:30px;width:30px;height:30px} #cenik.c8 .pkg-use > span:last-child{font-size:13px;hyphens:manual} }

/* poudarek frekvence */
#cenik.c8 .c8-freq{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:clamp(32px,4vw,64px);margin-top:clamp(36px,3vw,52px);
  padding:clamp(28px,2.4vw,40px) clamp(30px,3vw,48px);border-radius:28px;position:relative;overflow:hidden;isolation:isolate;
  background:radial-gradient(60% 120% at 100% 50%,rgba(56,182,255,.18),rgba(56,182,255,0) 65%),linear-gradient(150deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,.02) 100%);
  border:1px solid rgba(127,219,255,.2);box-shadow:0 40px 80px -50px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07)}
#cenik.c8 .c8-freq::before{content:"";position:absolute;left:0;top:18%;bottom:18%;width:3px;border-radius:0 3px 3px 0;background:linear-gradient(180deg,var(--x-aqua),var(--x-sky))}
#cenik.c8 .c8-fq-t{display:flex;flex-direction:column;gap:14px}
#cenik.c8 .c8-fq-k{display:flex;align-items:center;gap:14px;margin:0;font:600 12.5px/1.3 var(--x-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--x-cyan)}
#cenik.c8 .c8-fq-ico.i3d{width:42px;height:42px}
#cenik.c8 .c8-fq-ico .ico{width:20px;height:20px}
#cenik.c8 .c8-fq-h{margin:0;font:400 calc(clamp(28px, 1vw + 16px, 36px) * var(--x-k))/1.12 var(--x-serif);letter-spacing:-.02em;color:#fff}
:root[data-font="d"] #cenik.c8 .c8-fq-h{font-weight:300}
#cenik.c8 .c8-fq-p{margin:0;font:400 16.5px/1.65 var(--x-sans);color:var(--x-on-2);max-width:40em}
#cenik.c8 .c8-fq-viz{margin:0;display:flex;flex-direction:column;gap:12px}
#cenik.c8 .c8-fq-viz svg{display:block;width:100%;height:auto;overflow:visible}
#cenik.c8 .c8-ax path{stroke:rgba(127,219,255,.14);stroke-width:1;fill:none}
#cenik.c8 .c8-ld{fill:none;stroke:url(#c8Dense);stroke-width:2.6;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(56,182,255,.6))}
#cenik.c8 .c8-ls{fill:none;stroke:rgba(232,240,248,.42);stroke-width:2;stroke-dasharray:4 4;stroke-linejoin:round}
#cenik.c8 .c8-dd circle{fill:#A9E9FF}
#cenik.c8 .c8-ds circle{fill:rgba(232,240,248,.6)}
#cenik.c8 .c8-end{fill:#fff;filter:drop-shadow(0 0 8px rgba(127,219,255,.9));transform-box:fill-box;transform-origin:50% 50%}
#cenik.c8 .c8-fq-viz figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;font:500 13px/1.3 var(--x-sans);color:var(--x-on-2)}
#cenik.c8 .c8-lg{display:inline-flex;align-items:center;gap:8px}
#cenik.c8 .c8-lg i{width:18px;height:3px;border-radius:2px}
#cenik.c8 .c8-lg-d i{background:linear-gradient(90deg,#38B6FF,#A9E9FF);box-shadow:0 0 8px rgba(56,182,255,.7)}
#cenik.c8 .c8-lg-s i{background:repeating-linear-gradient(90deg,rgba(232,240,248,.5) 0 4px,transparent 4px 7px)}
#cenik.c8 .c8-fq-viz small{margin-left:auto;font:500 11.5px/1.3 var(--x-sans);color:var(--x-on-3)}
/* risanje ob prikazu */
#cenik.c8 .c8-freq .c8-ld{stroke-dasharray:100;stroke-dashoffset:100}
#cenik.c8 .c8-freq .c8-area,#cenik.c8 .c8-freq .c8-dd,#cenik.c8 .c8-freq .c8-ds,#cenik.c8 .c8-freq .c8-end{opacity:0}
#cenik.c8 .c8-freq.c8-go .c8-ld{animation:c8Draw 2.4s var(--x-ease) .3s forwards}
#cenik.c8 .c8-freq.c8-go .c8-area{animation:c8Fade 1s ease 1.6s forwards}
#cenik.c8 .c8-freq.c8-go .c8-ds{animation:c8Fade .8s ease .6s forwards}
#cenik.c8 .c8-freq.c8-go .c8-dd{animation:c8Fade .8s ease 1.2s forwards}
#cenik.c8 .c8-freq.c8-go .c8-end{animation:c8Fade .5s ease 2.5s forwards,c8EndP 2.2s ease-in-out 3s infinite}
@keyframes c8Draw{to{stroke-dashoffset:0}}
@keyframes c8Fade{to{opacity:1}}
@keyframes c8EndP{0%,100%{transform:scale(1)}50%{transform:scale(1.35)}}
#cenik.c8.c8-off .pkg-tag,#cenik.c8.c8-off .c8-end{animation-play-state:paused}
}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #cenik.c8 .pkg-tag{animation:none}
  #cenik.c8 .c8-freq .c8-ld{stroke-dashoffset:0}
  #cenik.c8 .c8-freq .c8-area,#cenik.c8 .c8-freq .c8-dd,#cenik.c8 .c8-freq .c8-ds,#cenik.c8 .c8-freq .c8-end{opacity:1}
}

/* =====================================================================
   V4 (21. 10. 2026) – popravki naročnika
   ===================================================================== */
/* ikone: steklena ploščica z animirano risbo (osnova velja tudi za telefon) */
#cenik .c8-tile{position:relative;flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:17px;overflow:hidden;isolation:isolate;
  background:linear-gradient(150deg,#4FB4FF 0%,#1E6FD9 55%,#0F3E86 100%);box-shadow:0 12px 26px -12px rgba(30,111,217,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,11,22,.55)}
#cenik .c8-tile-teal{background:linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%);box-shadow:0 12px 26px -12px rgba(28,174,143,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,30,26,.55)}
#cenik .c8-tile::before{content:"";position:absolute;left:12%;right:12%;top:5%;height:42%;border-radius:50% 50% 45% 45%/70% 70% 30% 30%;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,0));z-index:-1}
#cenik .c8-tile svg{width:30px;height:30px;overflow:visible}
#cenik .c8-tile .tl,#cenik .c8-tile .tl *{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
#cenik .ppc-sum > .c8-tile{grid-row:1 / 3}
@media (min-width:1024px){
#cenik.c8 .c8-tile{width:58px;height:58px;border-radius:19px}
#cenik.c8 .c8-tile svg{width:32px;height:32px}
#cenik.c8 .c8-fq-k .c8-tile{width:46px;height:46px;border-radius:15px}
#cenik.c8 .c8-fq-k .c8-tile svg{width:26px;height:26px}
#cenik.c8 .leanpay .c8-tile{display:grid}
/* koledar: trije obiski v tednu se zapovrstjo prižgejo */
#cenik.c8 .cal-d circle{fill:rgba(255,255,255,.28)}
#cenik.c8 .cal-on circle{fill:#D9F6FF;opacity:0;transform-box:fill-box;transform-origin:50% 50%;filter:drop-shadow(0 0 3px #A9E9FF)}
#cenik.c8 .c8-t-cal.c8-go .cal-on circle{animation:c8On 4.2s ease-in-out infinite}
#cenik.c8 .c8-t-cal.c8-go .o2{animation-delay:.45s!important}
#cenik.c8 .c8-t-cal.c8-go .o3{animation-delay:.9s!important}
@keyframes c8On{0%,6%{opacity:0;transform:scale(.3)}14%,74%{opacity:1;transform:scale(1)}86%,100%{opacity:0;transform:scale(.6)}}
/* merilnik: kazalec se premakne na nižjo ceno, lok se napolni */
#cenik.c8 .g-tr{fill:none;stroke:rgba(255,255,255,.28);stroke-width:4;stroke-linecap:round}
#cenik.c8 .g-ar{fill:none;stroke:url(#c8Gg);stroke-width:4;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100}
#cenik.c8 .g-nd path{stroke:#fff;stroke-width:2.6;stroke-linecap:round}
#cenik.c8 .g-nd{transform-box:view-box;transform-origin:24px 32px;rotate:-72deg}
#cenik.c8 .g-c{fill:#fff}
#cenik.c8 .c8-t-gauge.c8-go .g-ar{animation:c8Arc 1.8s var(--x-ease) .2s forwards}
#cenik.c8 .c8-t-gauge.c8-go .g-nd{animation:c8Needle 1.8s var(--x-ease) .2s forwards,c8Wob 2.6s ease-in-out 2s infinite alternate}
@keyframes c8Arc{to{stroke-dashoffset:0}}
@keyframes c8Needle{0%{rotate:-72deg}70%{rotate:62deg}100%{rotate:54deg}}
@keyframes c8Wob{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}
/* srce: utrip in krivulja EKG */
#cenik.c8 .h-h{fill:rgba(255,255,255,.14);stroke:#fff;stroke-width:2.2;stroke-linejoin:round;transform-box:fill-box;transform-origin:50% 55%}
#cenik.c8 .h-p{fill:none;stroke:#E9FFF8;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:34 66;stroke-dashoffset:100;filter:drop-shadow(0 0 2px #7FF0D6)}
#cenik.c8 .c8-t-heart.c8-go .h-h{animation:c8Beat 1.6s ease-in-out infinite}
#cenik.c8 .c8-t-heart.c8-go .h-p{animation:c8Ecg 1.6s linear infinite}
@keyframes c8Beat{0%,100%{transform:scale(1)}12%{transform:scale(1.1)}24%{transform:scale(.98)}36%{transform:scale(1.06)}50%{transform:scale(1)}}
@keyframes c8Ecg{to{stroke-dashoffset:0}}
/* košarica: paket pade v košarico */
#cenik.c8 .c-b{fill:#D9F6FF;opacity:0;transform-box:view-box}
#cenik.c8 .c-w{fill:#fff}
#cenik.c8 .c-cart{transform-box:view-box}
#cenik.c8 .c8-t-cart.c8-go .c-b{animation:c8Drop 3s cubic-bezier(.5,0,.6,1) infinite}
#cenik.c8 .c8-t-cart.c8-go .c-cart{animation:c8Bump 3s ease-out infinite}
@keyframes c8Drop{0%{opacity:0;transform:translateY(-14px)}12%{opacity:1}38%{opacity:1;transform:translateY(8px)}55%,100%{opacity:0;transform:translateY(8px)}}
@keyframes c8Bump{0%,36%,60%,100%{transform:none}44%{transform:translateY(1.6px)}}
/* kartica: obroki se zapovrstjo poravnajo */
#cenik.c8 .k-chip{fill:#E9FFF8}
#cenik.c8 .k-i rect{fill:rgba(255,255,255,.3)}
#cenik.c8 .c8-t-card.c8-go .k-i rect{animation:c8Pay 3.6s ease-in-out infinite}
#cenik.c8 .c8-t-card.c8-go .k-i rect:nth-child(2){animation-delay:.5s}
#cenik.c8 .c8-t-card.c8-go .k-i rect:nth-child(3){animation-delay:1s}
@keyframes c8Pay{0%,8%{fill:rgba(255,255,255,.3)}18%,78%{fill:#FFFFFF}90%,100%{fill:rgba(255,255,255,.3)}}
/* dokument: vrstice se izpišejo */
#cenik.c8 .d-l path{fill:none;stroke:#E6F6FF;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:10;stroke-dashoffset:10}
#cenik.c8 .c8-t-doc.c8-go .d-l path{animation:c8Write 4s ease-in-out infinite}
#cenik.c8 .c8-t-doc.c8-go .d-l path:nth-child(2){animation-delay:.4s}
#cenik.c8 .c8-t-doc.c8-go .d-l path:nth-child(3){animation-delay:.8s}
@keyframes c8Write{0%{stroke-dashoffset:10}20%,75%{stroke-dashoffset:0}92%,100%{stroke-dashoffset:-10}}
#cenik.c8 .leanpay:hover .c8-tile,#cenik.c8 .price-perk:hover .c8-tile{transform:translateY(-2px)}
#cenik.c8 .c8-tile{transition:transform .4s var(--x-ease)}

/* prihranek Paketa 30: meta barva, večji krog, ki se napolni */
@property --c8p{syntax:'<number>';inherits:false;initial-value:40}
#cenik.c8 .pkg-best .pkg-off{width:88px;height:88px;background:conic-gradient(from -90deg,#5EF2C9 0,#2FD3B0 calc(var(--c8p) * 1%),rgba(255,255,255,.12) 0);
  box-shadow:0 0 0 1px rgba(94,242,201,.3),0 0 34px -2px rgba(94,242,201,.55)}
#cenik.c8 .pkg-best .pkg-off::before{inset:7px;background:radial-gradient(circle at 50% 30%,#123F53 0%,#0B2747 75%)}
#cenik.c8 .pkg-best .pkg-off b{font:800 22px/1 var(--x-sans);color:#7FFFE0;text-shadow:0 0 14px rgba(94,242,201,.6)}
#cenik.c8 .pkg-best.c8-go .pkg-off{animation:c8Fill 1.6s var(--x-ease) .3s both}
@keyframes c8Fill{from{--c8p:0}to{--c8p:40}}
#cenik.c8 .pkg-best .pkg-save-pill{padding:6px 13px;font:800 15px/1.3 var(--x-sans);color:#03261F;background:linear-gradient(135deg,#9BFFE6,#2FD3B0);box-shadow:0 10px 26px -10px rgba(47,211,176,.95),inset 0 1px 0 rgba(255,255,255,.6)}
#cenik.c8 .pkg-best .pkg-bar-top b{color:#7FFFE0}
/* graf: oznaka »−40 %« nad stolpcem Paketa 30 in meta poudarek v povzetku */
#cenik.c8 .c8-save{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font:800 13px/1.2 var(--x-sans);color:#03261F;
  background:linear-gradient(135deg,#9BFFE6,#2FD3B0);box-shadow:0 8px 20px -8px rgba(47,211,176,.95);white-space:nowrap}
#cenik.c8 .ppc-big b{background:linear-gradient(90deg,#A9E9FF 0%,#5EF2C9 100%);-webkit-background-clip:text;background-clip:text;color:transparent}

/* področja na paketih kot oznake */
#cenik.c8 .pkg-use{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:12px 12px 13px}
#cenik.c8 .pkg-use-h{display:flex;align-items:center;gap:10px;margin:0;font:700 10.5px/1.2 var(--x-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--x-cyan)}
#cenik.c8 .pkg-use-i{flex-basis:30px;width:30px;height:30px;border-radius:10px}
#cenik.c8 .pkg-use-i .ico{width:16px;height:16px}
#cenik.c8 .pkg-use-l{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
#cenik.c8 .pkg-use-l li{padding:5px 10px;border-radius:999px;font:600 12.5px/1.25 var(--x-sans);color:#fff;background:rgba(127,219,255,.1);border:1px solid rgba(127,219,255,.22)}
#cenik.c8 .pkg-use-l li:first-child{background:rgba(56,182,255,.22);border-color:rgba(127,219,255,.4)}
#cenik.c8 .pkg-best .pkg-use-l li:first-child{background:rgba(94,242,201,.16);border-color:rgba(94,242,201,.4);color:#E9FFF8}
@media (max-width:1279.98px){ #cenik.c8 .pkg-use-l li{padding:4px 8px;font-size:11.5px} #cenik.c8 .pkg-best .pkg-off{width:76px;height:76px} #cenik.c8 .pkg-best .pkg-off b{font-size:19px} }

/* nakup po e-pošti */
#cenik.c8 .bs-act{display:flex;flex-direction:column;align-items:stretch;gap:10px}
#cenik.c8 .c8-mail{gap:9px;min-height:48px;padding:0 22px;border-radius:999px;color:#fff;background:rgba(255,255,255,.06);border:1.5px solid rgba(232,240,248,.5);white-space:nowrap;text-decoration:none}
#cenik.c8 .c8-mail .ico{width:18px;height:18px}
#cenik.c8 .c8-mail:hover{background:#fff;color:var(--x-ink);border-color:#fff}
#cenik.c8 .c8-mail:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}

#cenik.c8.c8-off .c8-tile *{animation-play-state:paused!important}
}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #cenik.c8 .c8-tile *{animation:none!important}
  #cenik.c8 .cal-on circle{opacity:1}
  #cenik.c8 .g-ar{stroke-dashoffset:0} #cenik.c8 .g-nd{rotate:54deg}
  #cenik.c8 .d-l path{stroke-dashoffset:0}
}

/* V5: oznake področij v dveh stolpcih (ne ena pod drugo); daljše oznake se prelomijo znotraj oznake */
@media (min-width:1024px){
#cenik.c8 .pkg-use{padding:12px 11px 12px}
#cenik.c8 .pkg-use-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
#cenik.c8 .pkg-use-l li{display:flex;align-items:center;min-height:38px;padding:6px 9px;border-radius:11px;font-size:12.5px;line-height:1.22;letter-spacing:-.005em;text-wrap:balance}
}
@media (min-width:1024px) and (max-width:1279.98px){ #cenik.c8 .pkg-use-l{grid-template-columns:1fr} #cenik.c8 .pkg-use-l li{min-height:0;padding:5px 8px;font-size:11.5px} }


/* ===== 6. Kako deluje (Verzija 4) ===== */
/* 3. Kako deluje – dodatni slogi samo za to sekcijo (namizje, od 1024 px).
   Verzija 4 (21. 10. 2026): pod »Več o mehanizmih delovanja« še dve povezavi – članek o razliki medicinska terapija / wellness
   in kartica s fotografijo za članek o Jakobu Omrzelu.
   Verzija 3 (21. 10. 2026): v ozadju za besedilom vodni žig znaka OxySphere (polmesec + trije mehurčki) kot na naslovnici.
   Verzija 2 (21. 10. 2026): ozadje kot nadaljevanje naslovnice in sekcije 2 (temno, sij, pikčasta mreža, mehurčki),
   dodaten odstavek pod uvodom, spodnji trije koraki so interaktivni (razkritje besedila ob prehodu z miško, fokusu ali kliku;
   samodejno menjavanje, dokler obiskovalec ne poseže). Slogi so omejeni na #zdravljenje.k3. */
@media (min-width:1024px){

#zdravljenje.k3{position:relative;overflow:hidden;isolation:isolate;
  background:radial-gradient(50% 40% at 92% 8%,rgba(56,182,255,.12) 0%,rgba(56,182,255,0) 70%),
             radial-gradient(45% 40% at 4% 70%,rgba(30,111,217,.14) 0%,rgba(30,111,217,0) 70%),
             linear-gradient(180deg,var(--x-abyss) 0%,#06152A 30%,#071A30 100%)}
#zdravljenje.k3 > .wrap{position:relative;z-index:1}

/* ---------- ozadje ---------- */
#zdravljenje.k3 .k3-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#zdravljenje.k3 .k3-glow{position:absolute;border-radius:50%;filter:blur(10px)}
#zdravljenje.k3 .k3-g1{width:760px;height:760px;right:-220px;top:16%;background:radial-gradient(closest-side,rgba(56,182,255,.14),rgba(56,182,255,0))}
#zdravljenje.k3 .k3-g2{width:640px;height:640px;left:-200px;bottom:-140px;background:radial-gradient(closest-side,rgba(127,219,255,.1),rgba(127,219,255,0))}
#zdravljenje.k3 .k3-grid{position:absolute;inset:0;opacity:.45;
  background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(55% 50% at 18% 34%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(55% 50% at 18% 34%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
#zdravljenje.k3 .k3-bub{position:absolute;inset:0;
  -webkit-mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%);mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%)}
#zdravljenje.k3 .k3-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:k3Rise var(--t) linear var(--dl) infinite,k3Sway calc(var(--t) / 4) ease-in-out var(--dl) infinite alternate}
#zdravljenje.k3 .k3-bub i:nth-child(1){--x:3%;--s:9px;--t:27s;--dl:-5s}
#zdravljenje.k3 .k3-bub i:nth-child(2){--x:12%;--s:5px;--t:21s;--dl:-12s}
#zdravljenje.k3 .k3-bub i:nth-child(3){--x:22%;--s:13px;--t:32s;--dl:-2s}
#zdravljenje.k3 .k3-bub i:nth-child(4){--x:33%;--s:6px;--t:23s;--dl:-17s}
#zdravljenje.k3 .k3-bub i:nth-child(5){--x:41%;--s:4px;--t:19s;--dl:-8s}
#zdravljenje.k3 .k3-bub i:nth-child(6){--x:49%;--s:10px;--t:29s;--dl:-21s}
#zdravljenje.k3 .k3-bub i:nth-child(7){--x:58%;--s:6px;--t:22s;--dl:-1s}
#zdravljenje.k3 .k3-bub i:nth-child(8){--x:66%;--s:15px;--t:35s;--dl:-14s}
#zdravljenje.k3 .k3-bub i:nth-child(9){--x:74%;--s:7px;--t:24s;--dl:-6s}
#zdravljenje.k3 .k3-bub i:nth-child(10){--x:82%;--s:5px;--t:18s;--dl:-10s}
#zdravljenje.k3 .k3-bub i:nth-child(11){--x:90%;--s:11px;--t:31s;--dl:-25s}
#zdravljenje.k3 .k3-bub i:nth-child(12){--x:97%;--s:6px;--t:20s;--dl:-3s}
@keyframes k3Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}6%{opacity:.7}100%{transform:translate3d(0,-1700px,0) scale(1.1);opacity:.55}}
@keyframes k3Sway{from{translate:-8px 0}to{translate:8px 0}}

/* ---------- besedilo ---------- */
#zdravljenje.k3 .how-text .k3-more{margin-top:-8px;color:#fff;font-weight:500}

/* ---------- interaktivni trije koraki ---------- */
#zdravljenje.k3 > .wrap.d-only.k3-chain-wrap{margin-top:clamp(80px, 6vw, 120px)}
#zdravljenje.k3 .k3-chain{position:relative;--k3:0}
#zdravljenje.k3 .k3-line{position:absolute;left:calc(100% / 6);right:calc(100% / 6);top:52px;height:2px;border-radius:2px;background:rgba(127,219,255,.16);overflow:visible}
#zdravljenje.k3 .k3-fill{position:absolute;left:0;top:0;bottom:0;width:calc(var(--k3) * 50%);border-radius:inherit;
  background:linear-gradient(90deg,#1E6FD9,#38B6FF 60%,#A9E9FF);box-shadow:0 0 14px rgba(56,182,255,.8);transition:width .9s var(--x-ease)}
#zdravljenje.k3 .k3-o2{position:absolute;inset:-4px 0;overflow:hidden}
#zdravljenje.k3 .k3-o2 i{position:absolute;top:1px;left:0;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#7FDBFF 60%,rgba(127,219,255,0) 72%);
  box-shadow:0 0 8px rgba(127,219,255,.9);opacity:0;animation:k3Flow 6s linear infinite}
#zdravljenje.k3 .k3-o2 i:nth-child(2){animation-delay:-1s}
#zdravljenje.k3 .k3-o2 i:nth-child(3){animation-delay:-2s}
#zdravljenje.k3 .k3-o2 i:nth-child(4){animation-delay:-3s}
#zdravljenje.k3 .k3-o2 i:nth-child(5){animation-delay:-4s}
#zdravljenje.k3 .k3-o2 i:nth-child(6){animation-delay:-5s}
@keyframes k3Flow{0%{left:0;opacity:0}8%{opacity:.95}92%{opacity:.95}100%{left:calc(100% - 8px);opacity:0}}
#zdravljenje.k3.k3-off .k3-bub i,#zdravljenje.k3.k3-off .k3-o2 i,#zdravljenje.k3.k3-off .k3-ring{animation-play-state:paused}

#zdravljenje.k3 .k3-steps{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
#zdravljenje.k3 .k3-step{position:relative;display:flex;flex-direction:column;align-items:center;padding:14px 26px 30px;border-radius:30px;border:1px solid transparent;
  transition:background-color .5s,border-color .5s,box-shadow .5s,transform .5s var(--x-ease)}
#zdravljenje.k3 .k3-step.is-on{background:linear-gradient(180deg,rgba(56,182,255,.1),rgba(56,182,255,.02) 70%);border-color:rgba(127,219,255,.28);
  box-shadow:0 40px 80px -50px rgba(56,182,255,.8),inset 0 1px 0 rgba(255,255,255,.06)}
#zdravljenje.k3 .k3-btn{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:center;cursor:pointer;border-radius:22px}
#zdravljenje.k3 .k3-btn:focus-visible{outline:2px solid var(--x-cyan);outline-offset:6px}
#zdravljenje.k3 .k3-ico{position:relative;width:76px;height:76px;margin-top:0;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--x-abyss);border:1px solid rgba(127,219,255,.42);color:var(--x-cyan);box-shadow:0 0 0 10px #06152A;
  transition:background-color .5s,color .5s,border-color .5s,box-shadow .5s,transform .5s var(--x-ease)}
#zdravljenje.k3 .k3-ico .ico{width:28px;height:28px;transition:transform .5s var(--x-ease)}
#zdravljenje.k3 .k3-step.is-on .k3-ico{background:var(--x-sky);border-color:transparent;color:var(--x-abyss);transform:scale(1.06);
  box-shadow:0 0 0 10px #06152A,0 0 46px rgba(56,182,255,.7)}
#zdravljenje.k3 .k3-step:hover .k3-ico .ico{transform:scale(1.12)}
#zdravljenje.k3 .k3-ring{position:absolute;inset:-10px;border-radius:50%;border:1px solid rgba(127,219,255,.5);opacity:0}
#zdravljenje.k3 .k3-step.is-on .k3-ring{animation:k3Ring 2.4s ease-out infinite}
@keyframes k3Ring{0%{transform:scale(.9);opacity:.8}100%{transform:scale(1.45);opacity:0}}
#zdravljenje.k3 .k3-n{font:600 12px var(--x-sans);letter-spacing:.24em;color:var(--x-on-3);margin-top:4px}
#zdravljenje.k3 .k3-step.is-on .k3-n{color:var(--x-cyan)}
#zdravljenje.k3 .k3-t{font:400 calc(clamp(28px, 1.2vw + 14px, 38px) * var(--x-k, 1))/1.12 var(--x-serif);color:rgba(255,255,255,.78);transition:color .4s}
#zdravljenje.k3 .k3-step.is-on .k3-t,#zdravljenje.k3 .k3-btn:hover .k3-t{color:#fff}
#zdravljenje.k3 .k3-more-i{display:flex;width:26px;height:26px;margin-top:2px;border-radius:50%;align-items:center;justify-content:center;border:1px solid rgba(127,219,255,.3);color:var(--x-cyan);overflow:hidden;
  transition:transform .4s var(--x-ease),opacity .4s,height .4s var(--x-ease),margin .4s var(--x-ease)}
#zdravljenje.k3 .k3-more-i .ico{width:14px;height:14px;transform:rotate(90deg)}
#zdravljenje.k3 .k3-step.is-on .k3-more-i{opacity:0;transform:scale(.6);height:0;margin-top:-12px;border-width:0}
#zdravljenje.k3 .k3-d{max-width:24em;margin-top:6px;min-height:4.8em;text-align:center}
#zdravljenje.k3 .k3-d p{margin:0;font-size:17.5px;line-height:1.6;color:var(--x-on-2);text-wrap:pretty;transition:opacity .5s,filter .5s,transform .5s var(--x-ease)}
#zdravljenje.k3 .k3-chain.js .k3-step:not(.is-on) .k3-d p{opacity:.28;filter:blur(4px);transform:translateY(6px);user-select:none}
#zdravljenje.k3 .k3-step.is-on .k3-d p{color:#E8F0F8}

/* parametri kot steklene oznake */
#zdravljenje.k3 .k3-params{gap:12px 14px;margin-top:40px}
#zdravljenje.k3 .k3-params span{gap:10px;padding:10px 18px 10px 14px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(127,219,255,.2);color:var(--x-on)}

@media (prefers-reduced-motion:reduce){
  #zdravljenje.k3 .k3-bub,#zdravljenje.k3 .k3-o2{display:none}
  #zdravljenje.k3 .k3-step.is-on .k3-ring{animation:none}
  #zdravljenje.k3 .k3-chain.js .k3-step:not(.is-on) .k3-d p{opacity:.7;filter:none;transform:none}
}

/* ---------- V3: vodni žig znaka OxySphere (kot na naslovnici) ---------- */
#zdravljenje.k3 .k3-wm{position:absolute;left:calc(max(var(--gutter, 56px), (100% - var(--maxw, 1400px)) / 2) - 70px);top:150px;height:min(940px, 62%);width:auto;
  opacity:.32;overflow:visible;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 55%,rgba(0,0,0,.35) 85%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,#000 0%,#000 55%,rgba(0,0,0,.35) 85%,rgba(0,0,0,0) 100%)}
#zdravljenje.k3 .k3-wm-bub{transform-box:fill-box;transform-origin:50% 50%;animation:k3Float 14s ease-in-out 1s infinite alternate}
@keyframes k3Float{from{transform:translateY(0)}to{transform:translateY(-1.6px)}}
#zdravljenje.k3.k3-off .k3-wm-bub{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){ #zdravljenje.k3 .k3-wm-bub{animation:none} }
}

/* ---------- V4: dodatni povezavi pod »Več o mehanizmih delovanja« ---------- */
@media (min-width:1024px){
#zdravljenje.k3 .k4-links{margin-top:-10px;display:flex;flex-direction:column;align-items:flex-start;gap:2px}
#zdravljenje.k3 .k4-links .link-arrow{min-height:40px}
#zdravljenje.k3 .k4-links li:last-child{align-self:stretch}
#zdravljenje.k3 .k4-story{display:flex;align-items:center;gap:18px;margin-top:12px;padding:8px 22px 8px 8px;border-radius:20px;
  border:1px solid rgba(169,233,255,.26);background:rgba(4,11,22,.4);color:#fff;text-decoration:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:background-color .3s,border-color .3s,transform .4s var(--x-ease)}
#zdravljenje.k3 .k4-story:hover{background:rgba(255,255,255,.07);border-color:rgba(169,233,255,.55);transform:translateY(-2px)}
#zdravljenje.k3 .k4-story:focus-visible{outline:2px solid var(--x-cyan);outline-offset:4px}
#zdravljenje.k3 .k4-story-th{position:relative;flex:0 0 auto;width:80px;height:100px;border-radius:14px;overflow:hidden;box-shadow:0 14px 28px -16px rgba(0,0,0,.9)}
#zdravljenje.k3 .k4-story-th::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#zdravljenje.k3 .k4-story-th img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--x-ease)}
#zdravljenje.k3 .k4-story:hover .k4-story-th img{transform:scale(1.06)}
#zdravljenje.k3 .k4-story-t{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}
#zdravljenje.k3 .k4-story-t b{font:600 16px/1.4 var(--x-sans);color:#fff;text-wrap:pretty}
#zdravljenje.k3 .k4-story-t small{display:inline-flex;align-items:center;gap:6px;font:600 14px/1.2 var(--x-sans);color:var(--x-cyan)}
#zdravljenje.k3 .k4-story-t small .ico{width:16px;height:16px;transition:transform .3s var(--x-ease)}
#zdravljenje.k3 .k4-story:hover .k4-story-t small .ico{transform:translateX(4px)}
@media (prefers-reduced-motion:reduce){
  #zdravljenje.k3 .k4-story,#zdravljenje.k3 .k4-story-th img{transition:none}
  #zdravljenje.k3 .k4-story:hover{transform:none}
}
}


/* ===== 7. Indikacije in baza znanja (Končna verzija) ===== */
/* 6. Indikacije in baza znanja – dodatni slogi samo za to sekcijo.
   Verzija 3 (21. 10. 2026): v pasici »Raziščite celotno bazo člankov« v ozadju fotografija raziskav (modro obarvana, zbledi proti besedilu).
   Verzija 2 (21. 10. 2026): temno nadaljevanje sekcij 1–5 (sij, pikčasta mreža, mehurčki, znak OxySphere),
   steklene kartice z obarvanim robom in ikono z obročem, poudarjen klic k posvetu, temna baza znanja,
   novo povabilo k bazi člankov z animiranim prikazom. Slogi so omejeni na #indikacije.i6 (namizje, od 1024 px). */
#indikacije .i6-bg{display:none}
@media (min-width:1024px){

#indikacije.i6{position:relative;overflow:hidden;isolation:isolate;color:var(--x-on);
  background:radial-gradient(42% 26% at 96% 6%,rgba(56,182,255,.11) 0%,rgba(56,182,255,0) 70%),
             radial-gradient(44% 30% at 2% 58%,rgba(30,111,217,.12) 0%,rgba(30,111,217,0) 70%),
             linear-gradient(180deg,#050F1F 0%,#071A30 30%,#06162B 70%,#050F1F 100%)}
#indikacije.i6 > .wrap{position:relative;z-index:1}
#indikacije.i6::before{content:"";position:absolute;z-index:1;top:0;left:50%;width:min(1100px,80%);height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.22) 50%,rgba(127,219,255,0))}

/* ---------- ozadje ---------- */
#indikacije.i6 .i6-bg{display:block;position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#indikacije.i6 .i6-glow{position:absolute;border-radius:50%;filter:blur(10px)}
#indikacije.i6 .i6-g1{width:820px;height:820px;right:-240px;top:-220px;background:radial-gradient(closest-side,rgba(56,182,255,.12),rgba(56,182,255,0))}
#indikacije.i6 .i6-g2{width:760px;height:760px;left:-260px;top:38%;background:radial-gradient(closest-side,rgba(127,219,255,.08),rgba(127,219,255,0))}
#indikacije.i6 .i6-g3{width:900px;height:900px;right:-200px;bottom:-300px;background:radial-gradient(closest-side,rgba(30,111,217,.13),rgba(30,111,217,0))}
#indikacije.i6 .i6-grid{position:absolute;inset:0;opacity:.45;
  background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(44% 16% at 22% 8%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(44% 16% at 22% 8%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
/* znak OxySphere levo, za »Pomembno« in glavo baze znanja */
#indikacije.i6 .i6-wm{position:absolute;left:calc(max(var(--gutter, 56px), (100% - var(--maxw, 1400px)) / 2) - 150px);top:42%;height:min(760px,36%);width:auto;opacity:.16;overflow:visible;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 50%,rgba(0,0,0,.3) 80%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,#000 0%,#000 50%,rgba(0,0,0,.3) 80%,rgba(0,0,0,0) 100%)}
#indikacije.i6 .i6-wm-bub{transform-box:fill-box;transform-origin:50% 50%;animation:i6Float 14s ease-in-out 1s infinite alternate}
@keyframes i6Float{from{transform:translateY(0)}to{transform:translateY(-1.6px)}}
#indikacije.i6 .i6-bub{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%);mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%)}
#indikacije.i6 .i6-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:i6Rise var(--t) linear var(--dl) infinite,i6Sway calc(var(--t) / 6) ease-in-out var(--dl) infinite alternate}
#indikacije.i6 .i6-bub i:nth-child(1){--x:4%;--s:8px;--t:40s;--dl:-6s}
#indikacije.i6 .i6-bub i:nth-child(2){--x:12%;--s:5px;--t:34s;--dl:-22s}
#indikacije.i6 .i6-bub i:nth-child(3){--x:21%;--s:12px;--t:46s;--dl:-15s}
#indikacije.i6 .i6-bub i:nth-child(4){--x:30%;--s:6px;--t:36s;--dl:-30s}
#indikacije.i6 .i6-bub i:nth-child(5){--x:40%;--s:4px;--t:31s;--dl:-9s}
#indikacije.i6 .i6-bub i:nth-child(6){--x:49%;--s:10px;--t:43s;--dl:-35s}
#indikacije.i6 .i6-bub i:nth-child(7){--x:58%;--s:6px;--t:35s;--dl:-2s}
#indikacije.i6 .i6-bub i:nth-child(8){--x:66%;--s:14px;--t:49s;--dl:-26s}
#indikacije.i6 .i6-bub i:nth-child(9){--x:75%;--s:7px;--t:38s;--dl:-12s}
#indikacije.i6 .i6-bub i:nth-child(10){--x:83%;--s:5px;--t:32s;--dl:-19s}
#indikacije.i6 .i6-bub i:nth-child(11){--x:91%;--s:11px;--t:45s;--dl:-38s}
#indikacije.i6 .i6-bub i:nth-child(12){--x:97%;--s:6px;--t:35s;--dl:-4s}
@keyframes i6Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}5%{opacity:.7}100%{transform:translate3d(0,-2600px,0) scale(1.1);opacity:.5}}
@keyframes i6Sway{from{translate:-8px 0}to{translate:8px 0}}

/* ---------- glava in zavihka ---------- */
#indikacije.i6 .eyebrow{color:var(--x-cyan)}
#indikacije.i6 .h2{color:#fff}
#indikacije.i6 .h2-em{color:var(--x-aqua)}
#indikacije.i6 .tabs{background:rgba(255,255,255,.06);border:1px solid rgba(127,219,255,.18);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
#indikacije.i6 .tabs::before{background:linear-gradient(135deg,var(--x-sky),var(--x-oxy));box-shadow:0 10px 28px -10px rgba(56,182,255,.75)}
#indikacije.i6 .tab{color:var(--x-on-2)}
#indikacije.i6 .tab:hover{color:#fff}
#indikacije.i6 .tab[aria-selected="true"]{color:#fff}
#indikacije.i6 .tab:focus-visible{outline:2px solid var(--x-cyan);outline-offset:2px}
#indikacije.i6 .badge-line{color:var(--x-on-2)}
#indikacije.i6 .chip-teal{color:#7FF0D6;background:rgba(28,174,143,.16);box-shadow:inset 0 0 0 1px rgba(63,201,183,.35)}
#indikacije.i6 .chip-blue{color:var(--x-aqua);background:rgba(56,182,255,.14);box-shadow:inset 0 0 0 1px rgba(127,219,255,.3)}

/* ---------- kartice ---------- */
#indikacije.i6 .panel-u .ind-item{--ac:#3FC9B7;--ac2:28,174,143}
#indikacije.i6 li[data-cat="mozgani"] .ind-item{--ac:#9A82FF;--ac2:142,108,242}
#indikacije.i6 li[data-cat="kronicna"] .ind-item{--ac:#4FB4FF;--ac2:44,130,234}
#indikacije.i6 li[data-cat="okrevanje"] .ind-item{--ac:#41C2F2;--ac2:65,194,242}
#indikacije.i6 li[data-cat="vitalnost"] .ind-item{--ac:#EE6C9C;--ac2:238,108,156}
#indikacije.i6 .ind-item{color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.065) 0%,rgba(255,255,255,.02) 100%);
  border:1px solid rgba(127,219,255,.13);box-shadow:0 30px 60px -44px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.06);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
#indikacije.i6 .ind-item::before{background:radial-gradient(360px circle at var(--mx,50%) var(--my,0%),rgba(var(--ac2),.2),transparent 62%)}
/* obarvan rob zgoraj */
#indikacije.i6 .ind-item::after{content:"";position:absolute;left:22px;right:22px;top:0;height:2px;border-radius:2px;opacity:.55;
  background:linear-gradient(90deg,rgba(var(--ac2),0),var(--ac),rgba(var(--ac2),0));transition:opacity .4s,left .5s var(--x-ease),right .5s var(--x-ease)}
#indikacije.i6 .ind-item:hover{border-color:rgba(var(--ac2),.5);box-shadow:0 44px 80px -42px rgba(var(--ac2),.55),inset 0 1px 0 rgba(255,255,255,.1)}
#indikacije.i6 .ind-item:hover::after{opacity:1;left:0;right:0}
#indikacije.i6 .ind-item:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}
/* velika ikona v ozadju kartice */
#indikacije.i6 .ind-wm{position:absolute;right:-18px;bottom:-22px;z-index:-1;width:132px;height:132px;fill:none;stroke:var(--ac);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;
  opacity:.07;transform:rotate(-8deg);transition:opacity .5s,transform .8s var(--x-ease)}
#indikacije.i6 .ind-item:hover .ind-wm{opacity:.16;transform:rotate(0) scale(1.06)}
/* ikona z obročem */
#indikacije.i6 .ind-icw{position:relative;display:inline-grid;place-items:center;margin-bottom:8px}
#indikacije.i6 .ind-icw .ind-ico.i3d{margin-bottom:0}
#indikacije.i6 .ind-ring{position:absolute;inset:-7px;border-radius:36%;border:1px dashed rgba(var(--ac2),.45);opacity:.55;transition:opacity .4s,transform .6s var(--x-ease)}
#indikacije.i6 .ind-icw::before{content:"";position:absolute;inset:-18px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--ac2),.28),rgba(var(--ac2),0));opacity:.6;transition:opacity .4s}
#indikacije.i6 .ind-item:hover .ind-ring{opacity:1;animation:i6Spin 9s linear infinite}
#indikacije.i6 .ind-item:hover .ind-icw::before{opacity:1}
@keyframes i6Spin{to{transform:rotate(360deg)}}
#indikacije.i6 .ind-t{color:#fff}
#indikacije.i6 .ind-item:hover .ind-t{color:#fff}
#indikacije.i6 .ind-d,#indikacije.i6 .panel-r .ind-d{color:var(--x-on-3)}
#indikacije.i6 .panel-r .ind-chip{color:var(--ac);background:rgba(var(--ac2),.14);box-shadow:inset 0 0 0 1px rgba(var(--ac2),.32)}
/* »Več« z okroglo puščico */
#indikacije.i6 .ind-more{gap:10px;color:var(--x-aqua)}
#indikacije.i6 .ind-more .ico{box-sizing:content-box;width:15px;height:15px;padding:7px;border-radius:50%;border:1px solid rgba(127,219,255,.3);transition:background .35s,border-color .35s,color .35s,transform .35s var(--x-ease)}
#indikacije.i6 .ind-item:hover .ind-more .ico{background:linear-gradient(135deg,var(--x-sky),var(--x-oxy));border-color:transparent;color:#fff;transform:translateX(4px)}

/* ---------- »Ne najdete svojega stanja?« ---------- */
#indikacije.i6 .ind-cta{background:radial-gradient(120% 90% at 100% 100%,rgba(56,182,255,.38),rgba(56,182,255,0) 60%),linear-gradient(160deg,#1A4F82 0%,#123C66 45%,#0B2747 100%);
  border:1px solid rgba(127,219,255,.35);box-shadow:0 44px 80px -40px rgba(56,182,255,.5),inset 0 1px 0 rgba(255,255,255,.14)}
#indikacije.i6 .ind-cta::after{opacity:.8}
#indikacije.i6 .ind-cta p{position:relative;z-index:1}
#indikacije.i6 .i6-cta-a{position:relative;z-index:1;display:flex;flex-direction:column;align-items:stretch;gap:12px;width:100%}
#indikacije.i6 .i6-tel{align-self:center;font:500 14px/1.3 var(--x-sans);color:var(--x-on-2);text-decoration:none}
#indikacije.i6 .i6-tel b{color:#fff;font-weight:700;font-variant-numeric:tabular-nums}
#indikacije.i6 .i6-tel:hover b{color:var(--x-aqua)}
#indikacije.i6 .i6-cbub{position:absolute;inset:0;pointer-events:none;z-index:0}
#indikacije.i6 .i6-cbub i{position:absolute;bottom:-20px;border-radius:50%;border:1px solid rgba(169,233,255,.55);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6),rgba(169,233,255,.08) 60%,rgba(169,233,255,0) 72%);
  animation:i6Cb 7s linear infinite}
#indikacije.i6 .i6-cbub i:nth-child(1){left:12%;width:10px;height:10px;animation-delay:-1s}
#indikacije.i6 .i6-cbub i:nth-child(2){left:34%;width:6px;height:6px;animation-duration:6s;animation-delay:-4s}
#indikacije.i6 .i6-cbub i:nth-child(3){left:58%;width:14px;height:14px;animation-duration:9s;animation-delay:-2.5s}
#indikacije.i6 .i6-cbub i:nth-child(4){left:76%;width:7px;height:7px;animation-duration:6.5s;animation-delay:-5.5s}
#indikacije.i6 .i6-cbub i:nth-child(5){left:90%;width:9px;height:9px;animation-duration:8s;animation-delay:-3s}
@keyframes i6Cb{0%{transform:translateY(0);opacity:0}10%{opacity:.9}100%{transform:translateY(-280px);opacity:0}}

/* ---------- preberite več, raziskave, filter, opomba ---------- */
#indikacije.i6 .ind-reads{background:linear-gradient(120deg,rgba(28,174,143,.16) 0%,rgba(28,174,143,.04) 100%);border:1px solid rgba(63,201,183,.3)}
#indikacije.i6 .ind-reads-t{color:#fff}
#indikacije.i6 .ind-reads-t .ico{color:#3FE0C2}
#indikacije.i6 .ind-reads-l a{background:rgba(4,11,22,.4);border-color:rgba(63,201,183,.35);color:#fff;transition:background .3s,border-color .3s,transform .3s,box-shadow .3s}
#indikacije.i6 .ind-reads-l a:hover{background:rgba(28,174,143,.28);border-color:#3FC9B7;color:#fff;box-shadow:0 8px 20px -10px rgba(28,174,143,.8)}
#indikacije.i6 .ind-reads-l .ico{color:#3FE0C2}
#indikacije.i6 .research-note{background:linear-gradient(120deg,rgba(56,182,255,.14) 0%,rgba(56,182,255,.04) 100%);border:1px solid rgba(127,219,255,.26)}
#indikacije.i6 .research-note p{color:var(--x-on-2)}
#indikacije.i6 .research-note b{color:#fff}
#indikacije.i6 .if-btn{background:rgba(255,255,255,.05);border-color:rgba(127,219,255,.18);color:#fff}
#indikacije.i6 .if-btn:hover{border-color:rgba(127,219,255,.5);box-shadow:0 8px 20px -12px rgba(56,182,255,.8)}
#indikacije.i6 .if-btn[aria-pressed="true"]{background:linear-gradient(135deg,var(--x-sky),var(--x-oxy));border-color:transparent;box-shadow:0 10px 26px -10px rgba(56,182,255,.75)}
#indikacije.i6 .if-n{background:rgba(255,255,255,.1);color:#fff}
#indikacije.i6 .if-btn:focus-visible{outline:2px solid var(--x-cyan);outline-offset:2px}
#indikacije.i6 .important{display:flex;align-items:center;gap:10px;color:var(--x-on-3)}
#indikacije.i6 .important .ico{width:18px;height:18px;flex:none;fill:none;stroke:var(--x-cyan);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#indikacije.i6 .important strong{color:#fff}

/* ---------- baza znanja ---------- */
#indikacije.i6 .kb-h{color:#fff}
#indikacije.i6 .kb-sub{color:var(--x-on-3)}
#indikacije.i6 .kb-all{color:var(--x-aqua)}
#indikacije.i6 .kb-all:hover{color:#fff}
#indikacije.i6 .kb-feat,#indikacije.i6 .kb-item{color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.065) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.14);
  box-shadow:0 30px 60px -44px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.06)}
#indikacije.i6 .kb-feat:hover,#indikacije.i6 .kb-item:hover{color:#fff;border-color:rgba(127,219,255,.38);box-shadow:0 44px 80px -42px rgba(56,182,255,.45),inset 0 1px 0 rgba(255,255,255,.1)}
#indikacije.i6 .kb-feat .kb-t,#indikacije.i6 .kb-item .kb-t{color:#fff}
#indikacije.i6 .kb-meta{color:var(--x-on-3)}
#indikacije.i6 .kb-x{color:var(--x-on-2)}
#indikacije.i6 .kb-go{color:var(--x-aqua)}
#indikacije.i6 .kb-cat{color:#5FE3C9}
#indikacije.i6 .kb-tag{background:rgba(4,11,22,.55);color:#fff;border:1px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
#indikacije.i6 .kb-cov > .ico{transition:transform .9s var(--x-ease)}
#indikacije.i6 .kb-feat:hover .kb-cov > .ico{transform:translateY(-6px) scale(1.05)}
#indikacije.i6 .kb-item:hover .kb-cov > .ico{transform:scale(1.08)}
#indikacije.i6 .kb-cov::after{animation:i6Pulse 6s ease-in-out infinite}
@keyframes i6Pulse{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.06)}}
#indikacije.i6 .kb-item{grid-template-columns:116px minmax(0,1fr) auto}
#indikacije.i6 .i6-go{display:grid;place-items:center;width:38px;height:38px;margin-right:8px;border-radius:50%;border:1px solid rgba(127,219,255,.26);color:var(--x-aqua);
  transition:background .35s,border-color .35s,color .35s,transform .35s var(--x-ease)}
#indikacije.i6 .i6-go .ico{width:16px;height:16px}
#indikacije.i6 .kb-item:hover .i6-go{background:linear-gradient(135deg,var(--x-sky),var(--x-oxy));border-color:transparent;color:#fff;transform:translateX(3px)}

/* ---------- povabilo k bazi člankov ---------- */
#indikacije.i6 .i6-inv{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:center;min-height:340px;padding:52px 56px;border-radius:32px;
  background:radial-gradient(60% 90% at 88% 50%,rgba(56,182,255,.32),rgba(56,182,255,0) 70%),radial-gradient(50% 80% at 0% 100%,rgba(28,174,143,.16),rgba(28,174,143,0) 70%),
             linear-gradient(135deg,#0B2747 0%,#0E3058 45%,#123C66 100%);
  border:1px solid rgba(127,219,255,.28);box-shadow:0 60px 120px -60px rgba(56,182,255,.5),inset 0 1px 0 rgba(255,255,255,.12)}
#indikacije.i6 .i6-inv::after{width:620px;right:-140px;bottom:-300px;opacity:.9}
#indikacije.i6 .i6-inv::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background-image:radial-gradient(rgba(169,233,255,.16) 1px,rgba(169,233,255,0) 1.6px);background-size:24px 24px;
  -webkit-mask-image:radial-gradient(50% 70% at 20% 30%,#000,transparent);mask-image:radial-gradient(50% 70% at 20% 30%,#000,transparent)}
#indikacije.i6 .i6-inv-txt{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:22px}
#indikacije.i6 .i6-inv-eb{display:flex;align-items:center;gap:14px;margin:0}
#indikacije.i6 .i6-inv .kb-inv-ico.i3d{width:46px;height:46px}
#indikacije.i6 .i6-inv .kb-inv-ico .ico{width:22px;height:22px}
#indikacije.i6 .i6-inv .kb-inv-t{display:flex;flex-direction:column;gap:12px}
#indikacije.i6 .i6-inv .kb-inv-t b{font-size:calc(clamp(34px, 1.3vw + 18px, 44px) * var(--x-k));line-height:1.08}
#indikacije.i6 .i6-inv .kb-inv-t p{font-size:17px;color:var(--x-on-2);max-width:32em}
#indikacije.i6 .i6-inv .kb-inv-btn{gap:10px;min-height:56px;padding-inline:26px 22px;box-shadow:0 18px 40px -18px rgba(0,0,0,.7)}
#indikacije.i6 .i6-inv .kb-inv-btn .i6-arr{width:17px;height:17px;transition:transform .35s var(--x-ease)}
#indikacije.i6 .i6-inv .kb-inv-btn:hover .i6-arr{transform:translateX(4px)}
/* animiran prikaz: trije članki v pahljači, oznake področij, orbiti */
#indikacije.i6 .i6-viz{position:relative;z-index:1;height:300px}
#indikacije.i6 .i6-orbit{position:absolute;left:50%;top:50%;width:300px;height:300px;margin:-150px 0 0 -150px;border-radius:50%;border:1px dashed rgba(127,219,255,.22);animation:i6Spin 40s linear infinite}
#indikacije.i6 .i6-orbit.i6-o2{width:430px;height:430px;margin:-215px 0 0 -215px;border-style:solid;border-color:rgba(127,219,255,.1);animation-duration:70s;animation-direction:reverse}
#indikacije.i6 .i6-orbit::after{content:"";position:absolute;left:50%;top:-4px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:#A9E9FF;box-shadow:0 0 12px 3px rgba(127,219,255,.8)}
#indikacije.i6 .i6-card{position:absolute;left:50%;top:50%;width:220px;display:flex;align-items:center;gap:12px;padding:10px;border-radius:18px;
  background:rgba(7,26,48,.78);border:1px solid rgba(169,233,255,.22);box-shadow:0 30px 60px -28px rgba(0,0,0,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  transition:transform .8s var(--x-ease)}
#indikacije.i6 .i6-card .kb-cov{flex:0 0 58px;width:58px;height:58px;border-radius:12px}
#indikacije.i6 .i6-card .kb-cov > .ico{width:28px;height:28px}
#indikacije.i6 .i6-ct{display:flex;flex-direction:column;gap:3px;font:600 13.5px/1.3 var(--x-sans);color:#fff}
#indikacije.i6 .i6-ct small{font:700 10px/1.2 var(--x-sans);letter-spacing:.14em;text-transform:uppercase;color:#5FE3C9}
#indikacije.i6 .i6-c1{transform:translate(-95%,-140%) rotate(-5deg);animation:i6Bob1 7s ease-in-out infinite}
#indikacije.i6 .i6-c2{z-index:2;transform:translate(-20%,-50%);animation:i6Bob2 6s ease-in-out infinite}
#indikacije.i6 .i6-c3{transform:translate(-90%,45%) rotate(4deg);animation:i6Bob3 8s ease-in-out infinite}
@keyframes i6Bob1{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes i6Bob2{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes i6Bob3{0%,100%{translate:0 0}50%{translate:0 -7px}}
#indikacije.i6 .i6-inv:hover .i6-c1{transform:translate(-102%,-152%) rotate(-7deg)}
#indikacije.i6 .i6-inv:hover .i6-c2{transform:translate(-12%,-50%)}
#indikacije.i6 .i6-inv:hover .i6-c3{transform:translate(-98%,56%) rotate(6deg)}
#indikacije.i6 .i6-tag{position:absolute;display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;white-space:nowrap;
  background:rgba(4,11,22,.55);border:1px solid rgba(169,233,255,.2);font:600 12px/1.2 var(--x-sans);color:var(--x-on-2);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  animation:i6Drift 9s ease-in-out infinite}
#indikacije.i6 .i6-tag i{width:7px;height:7px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}
#indikacije.i6 .i6-t1{left:2%;top:4%;animation-delay:-1s}
#indikacije.i6 .i6-t2{right:0;top:12%;animation-delay:-3s}
#indikacije.i6 .i6-t3{left:-2%;bottom:10%;animation-delay:-5s}
#indikacije.i6 .i6-t4{right:4%;bottom:0;animation-delay:-2s}
#indikacije.i6 .i6-t5{left:34%;top:-6%;animation-delay:-6s}
@keyframes i6Drift{0%,100%{translate:0 0}50%{translate:6px -6px}}

#indikacije.i6.i6-off .i6-bub i,#indikacije.i6.i6-off .i6-wm-bub,#indikacije.i6.i6-off .i6-cbub i,#indikacije.i6.i6-off .kb-cov::after,
#indikacije.i6.i6-off .i6-orbit,#indikacije.i6.i6-off .i6-card,#indikacije.i6.i6-off .i6-tag,#indikacije.i6.i6-off .ind-ring{animation-play-state:paused}
@media (max-width:1279.98px){
  #indikacije.i6 .i6-inv{grid-template-columns:minmax(0,1fr) minmax(0,.8fr);padding:44px 40px}
  #indikacije.i6 .i6-card{width:190px}
  #indikacije.i6 .i6-t1,#indikacije.i6 .i6-t3,#indikacije.i6 .i6-t5{display:none}
  #indikacije.i6 .i6-ct{font-size:12.5px}
}
@media (prefers-reduced-motion:reduce){
  #indikacije.i6 .i6-bub,#indikacije.i6 .i6-cbub{display:none}
  #indikacije.i6 .i6-wm-bub,#indikacije.i6 .kb-cov::after,#indikacije.i6 .i6-orbit,#indikacije.i6 .i6-card,#indikacije.i6 .i6-tag,#indikacije.i6 .ind-ring{animation:none!important}
}
}

/* ---------- V3: fotografija raziskav kot ozadje pasice ---------- */
@media (min-width:1024px){
#indikacije.i6 .i6-photo{position:absolute;inset:0;z-index:-1;width:100%;height:100%;max-width:none;object-fit:cover;object-position:62% 42%;pointer-events:none;
  opacity:.42;mix-blend-mode:luminosity;filter:grayscale(.2) contrast(1.05) blur(.6px);transform-origin:70% 50%;
  -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.18) 30%,rgba(0,0,0,.85) 62%,#000 100%);mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.18) 30%,rgba(0,0,0,.85) 62%,#000 100%);
  animation:i6Kb 30s ease-in-out infinite alternate;transition:opacity .8s}
@keyframes i6Kb{from{transform:scale(1.02)}to{transform:scale(1.08) translate(-1%,-.5%)}}
#indikacije.i6 .i6-inv:hover .i6-photo{opacity:.52}
/* modra tančica nad fotografijo, da ostane diskretna in v barvah strani */
#indikacije.i6 .i6-inv{background:radial-gradient(60% 90% at 88% 50%,rgba(56,182,255,.3),rgba(56,182,255,0) 70%),radial-gradient(50% 80% at 0% 100%,rgba(28,174,143,.16),rgba(28,174,143,0) 70%),
  linear-gradient(135deg,#0B2747 0%,#0E3058 45%,#123C66 100%)}
#indikacije.i6 .i6-inv .i6-inv-txt::before{content:"";position:absolute;z-index:-1;left:-56px;top:-60px;bottom:-60px;width:calc(100% + 120px);pointer-events:none;
  background:radial-gradient(70% 60% at 30% 50%,rgba(11,39,71,.85),rgba(11,39,71,0) 75%)}
#indikacije.i6.i6-off .i6-photo{animation-play-state:paused}
}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){ #indikacije.i6 .i6-photo{animation:none} }


/* ===== 8. Izkušnje (Verzija 3) ===== */
/* 10. Izkušnje – Verzija 3 (23. 10. 2026): kot V2, zvezdice Google ocene vedno pobarvane (#FFC53D kot na podstrani 19).
   Verzija 2 (23. 10. 2026) – dodatni slogi samo za to sekcijo, NAMIZJE (od 1024 px).
   - Google: pravi večbarvni logotip »G« v beli ploščici, Googlove barve kot tanek trak, zlate zvezdice s sijem,
     večja ocena, »Preberite ocene« kot gumb.
   - Povprečna ocena: obroč s sijem in oznakami; 9,9 -> 9,8 (108 / 11 izjav).
   - Statistika: ikone (pacienti, energija, spanec, razpoloženje).
   - Kartice izjav: prelivna obroba, krožna ocena 10/10, velik narekovaj, oznake s kljukico, obroč okoli inicialk.
   - Ozadje: mehak modri sij.
   Vsa pravila so omejena na #izkusnje.x2 in na @media (min-width:1024px). Nove ikone v statistiki imajo d-only (telefon in tablica
   ostaneta kot v V1); na telefonu se spremeni le ikona Google (pravi »G« namesto ikone zemljevida) in ocena 9,8. */
@media (min-width:1024px){

/* ---------- ozadje ---------- */
#izkusnje.x2::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(42% 46% at 8% 34%,rgba(56,182,255,.13),transparent 70%),
             radial-gradient(38% 42% at 92% 72%,rgba(30,111,217,.16),transparent 72%)}
#izkusnje.x2 .exp-layout{z-index:1}

/* ---------- povprečna ocena ---------- */
#izkusnje.x2 .exp-score{position:relative;overflow:hidden;isolation:isolate;padding:26px 28px;gap:24px;
  background:linear-gradient(160deg,rgba(18,48,88,.86),rgba(7,22,40,.86));box-shadow:0 30px 60px -40px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.06)}
#izkusnje.x2 .exp-score::after{content:"";position:absolute;z-index:-1;left:-60px;top:-60px;width:240px;height:240px;border-radius:50%;
  background:radial-gradient(circle,rgba(127,219,255,.16),transparent 70%)}
#izkusnje.x2 .score-ring{filter:drop-shadow(0 0 14px rgba(56,182,255,.35))}
#izkusnje.x2 .score-ring::after{content:"";position:absolute;inset:-7px;border-radius:50%;
  background:repeating-conic-gradient(rgba(169,233,255,.28) 0 .6deg,transparent .6deg 6deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 4px));
          mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 4px))}
#izkusnje.x2 .score-val{gap:2px}
#izkusnje.x2 .score-txt b{font-size:18px}

/* ---------- Google ocena ---------- */
#izkusnje.x2 .g-rate{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"src src" "val stars" "val n" "go go";
  column-gap:20px;row-gap:6px;align-items:center;padding:26px 28px 24px;border-radius:26px;overflow:hidden;
  background:linear-gradient(160deg,rgba(18,48,88,.86),rgba(7,22,40,.86));border:1px solid rgba(255,255,255,.1);
  box-shadow:0 30px 60px -40px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.06)}
#izkusnje.x2 .g-rate::before{right:-30px;top:auto;bottom:-110px;width:260px;height:260px;background:radial-gradient(circle,rgba(251,188,5,.18),transparent 68%)}
#izkusnje.x2 .g-rate:hover{border-color:rgba(255,255,255,.22);transform:translateY(-3px);box-shadow:0 34px 60px -34px rgba(0,0,0,.85)}
/* Googlove barve kot tanek trak na vrhu */
#izkusnje.x2 .g-bar{position:absolute;left:0;right:0;top:0;display:flex;height:3px}
#izkusnje.x2 .g-bar i{flex:1}
#izkusnje.x2 .g-bar i:nth-child(1){background:#4285F4}
#izkusnje.x2 .g-bar i:nth-child(2){background:#EA4335}
#izkusnje.x2 .g-bar i:nth-child(3){background:#FBBC05}
#izkusnje.x2 .g-bar i:nth-child(4){background:#34A853}
/* glava kartice */
#izkusnje.x2 .g-src{grid-area:src;gap:14px;margin-bottom:16px}
#izkusnje.x2 .g-logo{flex:0 0 46px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;border-radius:14px;background:#fff;
  box-shadow:0 10px 22px -10px rgba(0,0,0,.7),inset 0 -2px 0 rgba(10,26,46,.08)}
#izkusnje.x2 .g-logo svg{display:block;width:24px;height:24px}
#izkusnje.x2 .g-lbl{gap:3px;font:600 17px/1.2 var(--x-sans);color:#fff}
#izkusnje.x2 .g-lbl small{font:500 13px var(--x-sans);color:var(--x-on-3)}
#izkusnje.x2 .g-go{grid-area:go;justify-self:stretch;display:flex;align-items:center;justify-content:space-between;margin:18px 0 0;padding:12px 16px 12px 18px;border:1px solid rgba(255,255,255,.14);border-radius:14px;
  background:rgba(255,255,255,.05);font:600 14.5px var(--x-sans);color:#fff;white-space:nowrap;transition:background-color .3s,border-color .3s,color .3s}
#izkusnje.x2 .g-go .ico{width:17px;height:17px;color:var(--x-cyan)}
#izkusnje.x2 .g-rate:hover .g-go{background:#fff;border-color:#fff;color:#0A1A2E}
#izkusnje.x2 .g-rate:hover .g-go .ico{color:#1A73E8}
/* ocena in zvezdice */
#izkusnje.x2 .g-main{display:contents}
#izkusnje.x2 .g-val{grid-area:val;font:400 calc(76px * var(--x-k)) / .9 var(--x-serif);letter-spacing:-.03em;color:#fff;
  border-right:1px solid rgba(255,255,255,.12);padding-right:22px}
#izkusnje.x2 .g-starbox{grid-area:stars;align-self:end;justify-self:start}
#izkusnje.x2 .g-starbox,#izkusnje.x2 .g-stars svg{width:150px;height:26px}
#izkusnje.x2 .g-base svg{fill:rgba(255,255,255,.14)}
/* V3: zvezdice vedno pobarvane (kot na podstrani 19 – #FFC53D), ne čakajo na animacijo */
#izkusnje.x2 .g-top{width:var(--r);transition:none}
#izkusnje.x2 .g-top svg{fill:#FFC53D;filter:drop-shadow(0 0 6px rgba(255,197,61,.4))}
#izkusnje.x2 .g-n{grid-area:n;align-self:start;justify-self:start;padding:0;text-align:left;font:500 14.5px var(--x-sans);color:var(--x-on-2)}
#izkusnje.x2 .g-n b{color:#fff;font-weight:700}

/* ---------- statistika ---------- */
#izkusnje.x2 .exp-stats li{position:relative;overflow:hidden;background:linear-gradient(160deg,rgba(18,48,88,.7),rgba(7,22,40,.7));gap:8px}
#izkusnje.x2 .es-n{display:grid;grid-template-columns:auto;align-content:start}
#izkusnje.x2 .es-ico{display:flex;align-items:center;justify-content:center;width:36px;height:36px;margin-bottom:6px;border-radius:11px;color:var(--x-cyan);
  background:rgba(127,219,255,.1);border:1px solid rgba(127,219,255,.22)}
#izkusnje.x2 .es-ico .ico{width:18px;height:18px}
#izkusnje.x2 .es-ico.d-only{margin-top:0}
#izkusnje.x2 .exp-chg .d-only{margin-top:0}
#izkusnje.x2 .exp-chg{display:flex;flex-direction:column;gap:8px;margin-top:6px;font-size:0}
#izkusnje.x2 .exp-chg > span{display:flex;align-items:center;gap:10px;font:500 14.5px/1.3 var(--x-sans);color:#fff}
#izkusnje.x2 .exp-chg .ico{width:28px;height:28px;padding:6px;border-radius:9px;color:var(--x-cyan);background:rgba(127,219,255,.1);stroke-width:1.8}

/* ---------- povezava »Vse izkušnje« kot gumb ---------- */
#izkusnje.x2 .exp-link{align-self:flex-start;align-items:center;gap:10px;padding:12px 20px;border-radius:999px;border:1px solid rgba(127,219,255,.32);
  background:rgba(127,219,255,.06);font-weight:600;transition:background-color .3s,color .3s,border-color .3s}
#izkusnje.x2 .exp-link:hover{background:var(--x-cyan);border-color:var(--x-cyan);color:#04203A}

/* ---------- kartice izjav ---------- */
#izkusnje.x2 .qcard{background:linear-gradient(165deg,rgba(16,42,76,.72),rgba(8,24,44,.72));border-color:transparent;
  box-shadow:0 34px 70px -44px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.05)}
/* prelivna obroba */
#izkusnje.x2 .qcard::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(145deg,rgba(169,233,255,.5),rgba(127,219,255,.06) 38%,rgba(127,219,255,.04) 62%,rgba(56,182,255,.38));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
          mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
#izkusnje.x2 .qcard:hover{border-color:transparent}
#izkusnje.x2 .q-feat{background:radial-gradient(70% 90% at 100% 0%,rgba(56,182,255,.2),transparent 60%),linear-gradient(150deg,rgba(24,62,112,.82),rgba(9,28,52,.82));
  padding:44px 48px 34px}
#izkusnje.x2 .q-feat::after{background:linear-gradient(135deg,rgba(169,233,255,.75),rgba(127,219,255,.1) 35%,rgba(127,219,255,.06) 65%,rgba(56,182,255,.6))}

/* kategorija s svetlečo piko */
#izkusnje.x2 .q-cat{display:inline-flex;align-items:center;gap:10px}
#izkusnje.x2 .q-cat::before{content:"";flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:var(--x-cyan);box-shadow:0 0 0 4px rgba(127,219,255,.14),0 0 12px rgba(127,219,255,.8)}

/* ocena priporočila kot obroč (odmev velikega obroča levo) */
#izkusnje.x2 .q-score{display:flex;align-items:center;justify-content:center;width:56px;height:56px;padding:0;border:0;border-radius:50%;
  font:600 12.5px/1 var(--x-sans);letter-spacing:-.01em;color:#fff;
  background:radial-gradient(closest-side,#0C2442 calc(100% - 4px),transparent calc(100% - 3px)),conic-gradient(from 200deg,#A9E9FF,#38B6FF,#1E6FD9,#A9E9FF);
  box-shadow:0 0 18px -4px rgba(56,182,255,.55)}
#izkusnje.x2 .q-top{min-height:56px}

/* velik narekovaj */
#izkusnje.x2 .qcard .qi{display:block;position:absolute;z-index:0;left:24px;top:84px;width:70px;height:70px;color:rgba(127,219,255,.07)}
#izkusnje.x2 .q-feat .qi{left:auto;right:52px;top:112px;width:120px;height:120px;color:rgba(127,219,255,.08)}
#izkusnje.x2 .qcard blockquote{position:relative;z-index:1}

/* oznake s kljukico */
#izkusnje.x2 .q-tags{gap:8px}
#izkusnje.x2 .q-tags li{display:inline-flex;align-items:center;gap:6px;padding:6px 12px 6px 9px;border-radius:999px;color:#DDF6FF;
  background:rgba(127,219,255,.09);border:1px solid rgba(127,219,255,.2)}
#izkusnje.x2 .q-tags li::before{content:"";flex:0 0 14px;width:14px;height:14px;border-radius:50%;background:var(--x-cyan);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/100% no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/100% no-repeat}

/* podpis z obročem okoli inicialk */
#izkusnje.x2 .qcard figcaption{border-top-color:rgba(127,219,255,.12)}
#izkusnje.x2 .q-av{box-shadow:0 0 0 3px #0A2140,0 0 0 4.5px rgba(127,219,255,.5),0 10px 22px -8px rgba(56,182,255,.6)}

/* manjši prenosniki (1024–1279 px): ožji levi stolpec */
@media (max-width:1279.98px){
  #izkusnje.x2 .g-rate{padding:24px 22px 22px;column-gap:16px}
  #izkusnje.x2 .g-val{font-size:calc(62px * var(--x-k));padding-right:16px}
  #izkusnje.x2 .g-starbox,#izkusnje.x2 .g-stars svg{width:118px;height:21px}
  #izkusnje.x2 .g-n{font-size:13.5px}
  #izkusnje.x2 .exp-score{padding:22px;gap:18px}
}

@media (prefers-reduced-motion:reduce){
  #izkusnje.x2 .g-go,#izkusnje.x2 .exp-link{transition:none}
}
}


/* ===== 9. Vprašanja (Verzija 3) ===== */
/* 12. Vprašanja – dodatni slogi samo za to sekcijo.
   Verzija 2 (21. 10. 2026): temno nadaljevanje sekcij 1–9 (sij, pikčasta mreža, mehurčki, znak v ozadju);
   teme kot steklene kartice z animiranimi ikonami (komora, ščit s kljukico, kartica z obroki), številom vprašanj
   in sprotnim napredkom branja; vprašanja kot steklene kartice s številko in znakom +/−, odprto vprašanje osvetljeno;
   kartica pomoči z animiranim oblačkom. Vsebina nespremenjena.
   Verzija 3 (21. 10. 2026): odstranjena stavka (barotravma 10–15 %, analize centra Sagol); nove animirane ikone tem
   (komora z mehurčki kisika, ščit z EKG in kljukico, kartica s kovancem in obroki), lesk čez ikone, »Vprašanje x od 4«,
   kartica pomoči s fotografijo recepcije (svetleči znak diha, mehurčki, telefon zvoni); lepljivo je le kazalo s kartico (glej konec).
   Slogi so omejeni na #vprasanja.q12 (namizje, od 1024 px); telefon in tablica ostaneta kot v Verziji 1. */

/* elementi, ki so le na namizju */
#vprasanja .q12-d,#vprasanja .q12-tile{display:none}

@media (min-width:1024px){

#vprasanja.q12{position:relative;overflow:clip;isolation:isolate;color:var(--x-on);
  background:radial-gradient(40% 30% at 6% 12%,rgba(30,111,217,.15) 0%,rgba(30,111,217,0) 70%),
             radial-gradient(44% 34% at 96% 60%,rgba(56,182,255,.1) 0%,rgba(56,182,255,0) 70%),
             linear-gradient(180deg,#050F1F 0%,#071A30 30%,#06162B 72%,#050F1F 100%)}
#vprasanja.q12 > .wrap{position:relative;z-index:1}
#vprasanja.q12::before{content:"";position:absolute;z-index:1;top:0;left:50%;width:min(1100px,80%);height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.22) 50%,rgba(127,219,255,0))}

/* ---------- ozadje ---------- */
#vprasanja.q12 .q12-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#vprasanja.q12 .q12-glow{position:absolute;border-radius:50%;filter:blur(10px)}
#vprasanja.q12 .q12-g1{width:820px;height:820px;left:-280px;top:-260px;background:radial-gradient(closest-side,rgba(56,182,255,.13),rgba(56,182,255,0))}
#vprasanja.q12 .q12-g2{width:900px;height:900px;right:-300px;top:34%;background:radial-gradient(closest-side,rgba(30,111,217,.14),rgba(30,111,217,0))}
#vprasanja.q12 .q12-g3{width:700px;height:700px;left:8%;bottom:-360px;background:radial-gradient(closest-side,rgba(94,242,201,.06),rgba(94,242,201,0))}
#vprasanja.q12 .q12-grid{position:absolute;inset:0;opacity:.45;
  background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(34% 18% at 18% 9%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(34% 18% at 18% 9%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
#vprasanja.q12 .q12-wm{position:absolute;left:-150px;bottom:-60px;height:min(900px,62%);width:auto;opacity:.09;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 45%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,#000 0%,#000 45%,rgba(0,0,0,0) 100%)}
#vprasanja.q12 .q12-bub{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%);mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%)}
#vprasanja.q12 .q12-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:q12Rise var(--t) linear var(--dl) infinite,q12Sway calc(var(--t) / 6) ease-in-out var(--dl) infinite alternate}
#vprasanja.q12 .q12-bub i:nth-child(1){--x:3%;--s:9px;--t:42s;--dl:-8s}
#vprasanja.q12 .q12-bub i:nth-child(2){--x:11%;--s:5px;--t:35s;--dl:-21s}
#vprasanja.q12 .q12-bub i:nth-child(3){--x:20%;--s:12px;--t:48s;--dl:-14s}
#vprasanja.q12 .q12-bub i:nth-child(4){--x:31%;--s:6px;--t:38s;--dl:-29s}
#vprasanja.q12 .q12-bub i:nth-child(5){--x:41%;--s:4px;--t:32s;--dl:-10s}
#vprasanja.q12 .q12-bub i:nth-child(6){--x:50%;--s:10px;--t:45s;--dl:-34s}
#vprasanja.q12 .q12-bub i:nth-child(7){--x:59%;--s:6px;--t:37s;--dl:-3s}
#vprasanja.q12 .q12-bub i:nth-child(8){--x:67%;--s:14px;--t:51s;--dl:-25s}
#vprasanja.q12 .q12-bub i:nth-child(9){--x:76%;--s:7px;--t:40s;--dl:-13s}
#vprasanja.q12 .q12-bub i:nth-child(10){--x:84%;--s:5px;--t:34s;--dl:-18s}
#vprasanja.q12 .q12-bub i:nth-child(11){--x:91%;--s:11px;--t:47s;--dl:-37s}
#vprasanja.q12 .q12-bub i:nth-child(12){--x:97%;--s:6px;--t:37s;--dl:-5s}
@keyframes q12Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}5%{opacity:.7}100%{transform:translate3d(0,-2600px,0) scale(1.1);opacity:.5}}
@keyframes q12Sway{from{translate:-8px 0}to{translate:8px 0}}

/* ---------- glava ---------- */
#vprasanja.q12 .eyebrow{color:var(--x-cyan)}
#vprasanja.q12 .h2{color:#fff}
#vprasanja.q12 .q12-em{font-style:italic;color:var(--x-aqua)}

/* ---------- ikone (steklene ploščice z animirano risbo) ---------- */
#vprasanja.q12 .q12-tile{position:relative;flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:17px;overflow:hidden;isolation:isolate;
  background:linear-gradient(150deg,#4FB4FF 0%,#1E6FD9 55%,#0F3E86 100%);box-shadow:0 12px 26px -12px rgba(30,111,217,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,11,22,.55)}
#vprasanja.q12 .q12-tile-teal{background:linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%);box-shadow:0 12px 26px -12px rgba(28,174,143,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,30,26,.55)}
#vprasanja.q12 .q12-tile-sky{background:linear-gradient(150deg,#A9E9FF 0%,#38B6FF 45%,#1E6FD9 80%,#123F8E 100%);box-shadow:0 12px 26px -12px rgba(56,182,255,.9),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -10px 18px -10px rgba(4,11,22,.55)}
#vprasanja.q12 .q12-tile::before{content:"";position:absolute;left:12%;right:12%;top:5%;height:42%;border-radius:50% 50% 45% 45%/70% 70% 30% 30%;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,0));z-index:-1}
#vprasanja.q12 .q12-tile svg{width:30px;height:30px;overflow:visible}
#vprasanja.q12 .q12-tile .tl,#vprasanja.q12 .q12-tile .tl *{fill:none;stroke:#fff;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
#vprasanja.q12 .q12-tile-s{width:40px;height:40px;border-radius:13px}
#vprasanja.q12 .q12-tile-s svg{width:24px;height:24px}

/* (ikone tem – glej V3 na koncu datoteke) */

/* ---------- teme (kazalo levo) ---------- */
#vprasanja.q12 .faq-side{gap:28px}
#vprasanja.q12 .faq-nav ul{flex-direction:column;gap:10px}
#vprasanja.q12 .faq-nav a{position:relative;display:flex;align-items:center;gap:16px;min-height:80px;padding:14px 20px 14px 14px;border-radius:22px;overflow:hidden;color:#fff;
  background:linear-gradient(150deg,rgba(255,255,255,.065) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.15);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 26px 44px -36px rgba(0,0,0,.9);transition:background .35s,border-color .35s,transform .4s var(--x-ease),box-shadow .35s}
#vprasanja.q12 .faq-nav a:hover{background:linear-gradient(150deg,rgba(127,219,255,.12) 0%,rgba(255,255,255,.03) 100%);border-color:rgba(127,219,255,.36);color:#fff;transform:translateX(4px)}
#vprasanja.q12 .faq-nav a.q12-on{background:linear-gradient(150deg,rgba(56,182,255,.2) 0%,rgba(30,111,217,.08) 100%);border-color:rgba(127,219,255,.5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 26px 50px -30px rgba(56,182,255,.55)}
#vprasanja.q12 .faq-nav a:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}
#vprasanja.q12 .q12-tn{display:flex;flex-direction:column;gap:3px;flex:1 1 auto;font:600 17px/1.2 var(--x-sans)}
#vprasanja.q12 .q12-tn small{display:block;font:500 13px/1.2 var(--x-sans);color:var(--x-on-3)}
#vprasanja.q12 .q12-ta{display:block;flex:none;width:20px;height:20px;fill:none;stroke:var(--x-cyan);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.45;transition:transform .35s var(--x-ease),opacity .3s}
#vprasanja.q12 .faq-nav a:hover .q12-ta,#vprasanja.q12 .faq-nav a.q12-on .q12-ta{opacity:1;transform:translateX(3px)}
#vprasanja.q12 .q12-pb{display:block;position:absolute;left:20px;right:20px;bottom:0;height:2px;border-radius:2px;background:rgba(127,219,255,.1);overflow:hidden}
#vprasanja.q12 .q12-pb i{position:absolute;inset:0;transform-origin:left center;transform:scaleX(var(--p,0));background:linear-gradient(90deg,#38B6FF,#7FDBFF 70%,#5EF2C9);transition:transform .2s linear}

/* ---------- kartica pomoči ---------- */
#vprasanja.q12 .faq-help{position:relative;gap:14px;padding:28px 30px 30px;border-radius:26px;overflow:hidden;isolation:isolate;
  background:radial-gradient(70% 90% at 100% 0%,rgba(56,182,255,.2) 0%,rgba(56,182,255,0) 60%),linear-gradient(150deg,rgba(255,255,255,.08) 0%,rgba(255,255,255,.02) 100%);
  border:1px solid rgba(127,219,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 40px 70px -46px rgba(0,0,0,.95)}
#vprasanja.q12 .faq-help .q12-tile{margin-bottom:4px}
#vprasanja.q12 .faq-help p{color:var(--x-on-2)}
#vprasanja.q12 .phone-big{color:#fff}
#vprasanja.q12 .phone-big .ico{color:var(--x-cyan)}
#vprasanja.q12 .phone-big:hover{color:var(--x-aqua)}
#vprasanja.q12 .faq-help .btn:focus-visible,#vprasanja.q12 .phone-big:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}

/* ---------- skupine ---------- */
#vprasanja.q12 .faq{border-top:0}
#vprasanja.q12 .faq-group{display:flex;align-items:center;gap:14px;padding:52px 0 6px;border-bottom:0;color:var(--x-cyan)}
#vprasanja.q12 .faq-group:first-child{padding-top:0}
#vprasanja.q12 .q12-gc{display:inline-flex;align-items:center;min-height:26px;margin-left:auto;padding:0 12px;border-radius:999px;font:500 12.5px var(--x-sans);letter-spacing:.04em;text-transform:none;
  color:var(--x-on-3);border:1px solid rgba(127,219,255,.18)}

/* ---------- vprašanja ---------- */
#vprasanja.q12 .faq details{margin-top:12px;border:1px solid rgba(127,219,255,.14);border-radius:22px;
  background:linear-gradient(150deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,.015) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 26px 44px -38px rgba(0,0,0,.9);transition:background .35s,border-color .35s,box-shadow .35s,transform .4s var(--x-ease)}
#vprasanja.q12 .faq details:hover{border-color:rgba(127,219,255,.32);transform:translateY(-2px)}
#vprasanja.q12 .faq details[open]{border-color:rgba(127,219,255,.42);
  background:radial-gradient(80% 60% at 100% 0%,rgba(56,182,255,.14) 0%,rgba(56,182,255,0) 70%),linear-gradient(150deg,rgba(56,182,255,.1) 0%,rgba(255,255,255,.02) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 40px 70px -44px rgba(56,182,255,.55)}
#vprasanja.q12 .faq summary{gap:18px;min-height:82px;padding:18px 22px 18px 24px;border-radius:22px;color:#fff;font-size:18.5px}
#vprasanja.q12 .faq summary:hover{color:#fff}
#vprasanja.q12 .faq summary:focus-visible{outline:2px solid var(--x-cyan);outline-offset:2px}
#vprasanja.q12 .faq summary > .ico{display:none}
#vprasanja.q12 .q12-n{display:block;flex:none;width:34px;font:400 26px/1 var(--x-serif);color:rgba(127,219,255,.45);font-variant-numeric:tabular-nums;transition:color .35s}
#vprasanja.q12 .q12-q{flex:1 1 auto}
#vprasanja.q12 .faq details:hover .q12-n{color:rgba(127,219,255,.8)}
#vprasanja.q12 .faq details[open] .q12-n{color:var(--x-cyan)}
/* znak + / − */
#vprasanja.q12 .q12-tg{display:block;position:relative;flex:none;width:42px;height:42px;border-radius:50%;border:1px solid rgba(127,219,255,.3);
  transition:background .35s,border-color .35s,transform .45s var(--x-ease),box-shadow .35s}
#vprasanja.q12 .q12-tg::before,#vprasanja.q12 .q12-tg::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;border-radius:2px;background:var(--x-cyan);transition:transform .45s var(--x-ease),background .3s}
#vprasanja.q12 .q12-tg::after{transform:rotate(90deg)}
#vprasanja.q12 .faq details:hover .q12-tg{border-color:rgba(127,219,255,.6)}
#vprasanja.q12 .faq details[open] .q12-tg{transform:rotate(180deg);border-color:transparent;background:linear-gradient(150deg,#4FB4FF,#1E6FD9);box-shadow:0 10px 22px -10px rgba(56,182,255,.9)}
#vprasanja.q12 .faq details[open] .q12-tg::before{background:#fff}
#vprasanja.q12 .faq details[open] .q12-tg::after{transform:rotate(0);background:#fff}

/* odgovor */
#vprasanja.q12 .faq-a{padding:0 76px 28px 76px;color:var(--x-on-2)}
#vprasanja.q12 .faq-a strong{color:#fff}
#vprasanja.q12 .faq-a b{color:var(--x-on)}
#vprasanja.q12 .faq-a li::before{background:linear-gradient(145deg,#7FDBFF,#38B6FF);box-shadow:0 0 8px rgba(127,219,255,.6)}
#vprasanja.q12 .faq details[open] .faq-a{animation:q12In .5s var(--x-ease) both}
@keyframes q12In{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
#vprasanja.q12 .faq-more a{gap:8px;min-height:44px;margin-top:2px;padding:0 18px;border-radius:999px;color:var(--x-cyan);
  background:rgba(127,219,255,.08);border:1px solid rgba(127,219,255,.24);transition:background .3s,border-color .3s,color .3s}
#vprasanja.q12 .faq-more a:hover{text-decoration:none;color:#fff;background:rgba(127,219,255,.16);border-color:rgba(127,219,255,.5)}
#vprasanja.q12 .faq-more a .ico{transition:transform .35s var(--x-ease)}
#vprasanja.q12 .faq-more a:hover .ico{transform:translateX(3px)}
#vprasanja.q12 .faq-more a:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}

/* ---------- ožje namizje ---------- */
@media (max-width:1279.98px){
  #vprasanja.q12 .faq summary{font-size:17px;gap:14px;padding:16px 18px}
  #vprasanja.q12 .q12-n{width:28px;font-size:22px}
  #vprasanja.q12 .faq-a{padding:0 24px 24px 64px;font-size:16px}
  #vprasanja.q12 .faq-nav a{min-height:72px}
  #vprasanja.q12 .q12-tn{font-size:16px}
  #vprasanja.q12 .phone-big{font-size:34px}
}

/* ---------- varčevanje in zmanjšano gibanje ---------- */
#vprasanja.q12.q12-off .q12-bub i,#vprasanja.q12.q12-off .q12-tile *{animation-play-state:paused!important}
}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #vprasanja.q12 .q12-bub{display:none}
  #vprasanja.q12 .q12-tile *,#vprasanja.q12 .faq details[open] .faq-a{animation:none!important}
  #vprasanja.q12 .q12-t-varnost .s-ck{stroke-dashoffset:0}
  #vprasanja.q12 .q12-t-terapija .k-w circle{fill:rgba(255,255,255,.95)}
  #vprasanja.q12 .q12-t-paketi .p-i rect{fill:#fff}
}

/* =====================================================================
   V3 (21. 10. 2026) – nove ikone tem, kazalo, kartica pomoči s fotografijo recepcije
   ===================================================================== */
@media (min-width:1024px){
/* lepljivo je le kazalo s kartico pomoči; naslov se odpelje */
#vprasanja.q12 .faq-side{position:static;align-self:stretch;gap:28px}
#vprasanja.q12 .q12-stick{position:sticky;top:120px;display:flex;flex-direction:column;gap:22px}

/* ---------- ploščice ikon ---------- */
#vprasanja.q12 .q12-tile{width:58px;height:58px;border-radius:19px;transition:transform .45s var(--x-ease),box-shadow .45s}
#vprasanja.q12 .q12-tile svg{width:34px;height:34px}
#vprasanja.q12 .q12-tile-s{width:42px;height:42px;border-radius:14px}
#vprasanja.q12 .q12-tile-s svg{width:26px;height:26px}
#vprasanja.q12 .q12-tile::after{content:"";position:absolute;inset:-30%;z-index:2;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,0) 42%,rgba(255,255,255,.5) 50%,rgba(255,255,255,0) 58%);transform:translateX(-80%);animation:q12Sheen 7s ease-in-out var(--sd,0s) infinite}
#vprasanja.q12 .q12-t-varnost{--sd:-2.3s}
#vprasanja.q12 .q12-t-paketi{--sd:-4.6s}
@keyframes q12Sheen{0%,62%{transform:translateX(-80%)}82%,100%{transform:translateX(80%)}}
#vprasanja.q12 .i3-fill{fill:rgba(255,255,255,.16);stroke:none}

/* kisik: mehurček O₂ diha, iz njega stalno izplavajo trije mehurčki (kot v znaku) */
#vprasanja.q12 .q12-t-terapija .i3-o2{transform-box:fill-box;transform-origin:center}
#vprasanja.q12 .q12-t-terapija .i3-hl{fill:none;stroke:rgba(255,255,255,.85);stroke-width:2.2;stroke-linecap:round}
#vprasanja.q12 .q12-t-terapija .i3-t{font:700 15px/1 system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;fill:#fff}
#vprasanja.q12 .q12-t-terapija .i3-t2{font:700 8.5px/1 system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;fill:#fff}
#vprasanja.q12 .q12-t-terapija .i3-bb circle{fill:rgba(255,255,255,.25);stroke:#fff;stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center}
#vprasanja.q12 .q12-t-terapija.q12-go .i3-o2{animation:q12Breath 4.2s ease-in-out infinite}
#vprasanja.q12 .q12-t-terapija.q12-go .b1{animation:q12Bub 2.8s ease-out 0s infinite}
#vprasanja.q12 .q12-t-terapija.q12-go .b2{animation:q12Bub 2.8s ease-out .9s infinite}
#vprasanja.q12 .q12-t-terapija.q12-go .b3{animation:q12Bub 2.8s ease-out 1.8s infinite}
@keyframes q12Breath{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
@keyframes q12Bub{0%{opacity:0;transform:translate(-4px,7px) scale(.4)}18%{opacity:1}70%{opacity:.9;transform:translate(0,-4px) scale(1)}100%{opacity:0;transform:translate(1px,-8px) scale(1.25)}}

/* ščit: EKG utrip se izriše, nato kljukica (spremljanje med terapijo → varno) */
#vprasanja.q12 .q12-t-varnost .i3-ecg{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:100}
#vprasanja.q12 .q12-t-varnost .i3-ck{fill:none;stroke:#fff;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:10;stroke-dashoffset:10}
#vprasanja.q12 .q12-t-varnost .i3-fill{transition:fill .4s}
#vprasanja.q12 .q12-t-varnost.q12-go .i3-ecg{animation:q12Ecg 5.6s ease-in-out .2s infinite}
#vprasanja.q12 .q12-t-varnost.q12-go .i3-ck{animation:q12Ck3 5.6s var(--x-ease) .2s infinite}
#vprasanja.q12 .q12-t-varnost.q12-go .i3-fill{animation:q12Shield 5.6s ease-in-out .2s infinite}
@keyframes q12Ecg{0%{stroke-dashoffset:100;opacity:1}28%{stroke-dashoffset:0;opacity:1}40%{stroke-dashoffset:0;opacity:1}46%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes q12Ck3{0%,48%{stroke-dashoffset:10;opacity:1}60%,88%{stroke-dashoffset:0;opacity:1}96%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes q12Shield{0%,50%{fill:rgba(255,255,255,.16)}62%,86%{fill:rgba(255,255,255,.3)}96%,100%{fill:rgba(255,255,255,.16)}}

/* kartica: rahlo se nagiba, kovanec € se zavrti, trije obroki se zapovrstjo prižgejo */
#vprasanja.q12 .q12-t-paketi .i3-card{transform-box:view-box;transform-origin:21px 20px}
#vprasanja.q12 .q12-t-paketi .i3-chip{fill:#fff}
#vprasanja.q12 .q12-t-paketi .i3-coin{transform-box:fill-box;transform-origin:center}
#vprasanja.q12 .q12-t-paketi .i3-coin circle{fill:#fff;filter:drop-shadow(0 1.5px 1.5px rgba(10,40,100,.45))}
#vprasanja.q12 .q12-t-paketi .i3-coin path{fill:none;stroke:#1E6FD9;stroke-width:1.9;stroke-linecap:round}
#vprasanja.q12 .q12-t-paketi .i3-inst rect{fill:rgba(255,255,255,.3);transform-box:fill-box;transform-origin:left center}
#vprasanja.q12 .q12-t-paketi.q12-go .i3-card{animation:q12Tilt 5.4s ease-in-out infinite}
#vprasanja.q12 .q12-t-paketi.q12-go .i3-coin{animation:q12Coin 5.4s var(--x-ease) .3s infinite}
#vprasanja.q12 .q12-t-paketi.q12-go .i3-inst rect:nth-child(1){animation:q12Inst3 5.4s var(--x-ease) .9s infinite}
#vprasanja.q12 .q12-t-paketi.q12-go .i3-inst rect:nth-child(2){animation:q12Inst3 5.4s var(--x-ease) 1.2s infinite}
#vprasanja.q12 .q12-t-paketi.q12-go .i3-inst rect:nth-child(3){animation:q12Inst3 5.4s var(--x-ease) 1.5s infinite}
@keyframes q12Tilt{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(2deg) translateY(-1px)}}
@keyframes q12Coin{0%,6%{transform:translateY(-12px) scaleX(1);opacity:0}16%{transform:translateY(0) scaleX(1);opacity:1}22%{transform:translateY(-2px) scaleX(.15)}28%{transform:translateY(0) scaleX(1)}34%{transform:scaleX(.15)}40%,80%{transform:scaleX(1);opacity:1}92%,100%{transform:translateY(2px) scaleX(1);opacity:0}}
@keyframes q12Inst3{0%,3%{fill:rgba(255,255,255,.3);transform:scaleX(.35)}14%,66%{fill:#fff;transform:scaleX(1)}80%,100%{fill:rgba(255,255,255,.3);transform:scaleX(.35)}}

/* ---------- kazalo tem ---------- */
#vprasanja.q12 .faq-nav a{min-height:84px;padding:13px 20px 15px 13px}
#vprasanja.q12 .faq-nav a:hover .q12-tile,#vprasanja.q12 .faq-nav a.q12-on .q12-tile{transform:translateY(-1px) scale(1.06)}
#vprasanja.q12 .faq-nav a.q12-on .q12-tile{box-shadow:0 16px 34px -12px rgba(56,182,255,1),0 0 0 4px rgba(127,219,255,.12),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -10px 18px -10px rgba(4,11,22,.55)}
#vprasanja.q12 .faq-nav a.q12-on .q12-tile-teal{box-shadow:0 16px 34px -12px rgba(28,174,143,1),0 0 0 4px rgba(94,242,201,.14),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -10px 18px -10px rgba(4,30,26,.55)}
#vprasanja.q12 .q12-tn small.q12-c1{display:none}
#vprasanja.q12 .faq-nav a.q12-on .q12-c0{display:none}
#vprasanja.q12 .faq-nav a.q12-on .q12-c1{display:block;color:var(--x-cyan)}
#vprasanja.q12 .faq-nav a.q12-on .q12-c1::before{content:"";display:inline-block;width:6px;height:6px;margin:0 7px 1px 0;border-radius:50%;background:#5EF2C9;box-shadow:0 0 8px #5EF2C9;vertical-align:middle;animation:q12Live 1.6s ease-in-out infinite}
@keyframes q12Live{0%,100%{opacity:1}50%{opacity:.35}}
#vprasanja.q12 .q12-pb{height:3px;left:16px;right:16px;bottom:6px;border-radius:3px;overflow:visible}
#vprasanja.q12 .q12-pb i{border-radius:3px;overflow:hidden}
#vprasanja.q12 .q12-pb::after{content:"";position:absolute;top:50%;left:calc(var(--p,0) * 100%);width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#A9E9FF;
  box-shadow:0 0 10px rgba(127,219,255,.95);opacity:0;transition:left .2s linear,opacity .3s}
#vprasanja.q12 .faq-nav a.q12-on .q12-pb::after{opacity:1}

/* ---------- kartica pomoči s fotografijo recepcije ---------- */
#vprasanja.q12 .faq-help{padding:0 0 28px;gap:12px;background:linear-gradient(180deg,rgba(7,22,40,0) 0%,rgba(255,255,255,.035) 100%),linear-gradient(150deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,.02) 100%)}
#vprasanja.q12 .faq-help > :not(.q12-hp){margin-inline:30px}
#vprasanja.q12 .q12-hp{display:block;position:relative;align-self:stretch;height:215px;margin:0 0 4px;overflow:hidden;border-radius:26px 26px 0 0;isolation:isolate;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 52%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(180deg,#000 0%,#000 52%,rgba(0,0,0,0) 100%)}
#vprasanja.q12 .q12-hp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:58% 40%;filter:brightness(1.12) contrast(1.05);transform:scale(1.04);animation:q12HpZoom 22s ease-in-out infinite alternate}
#vprasanja.q12 .q12-hp::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,22,40,.1) 0%,rgba(7,22,40,0) 30%),linear-gradient(90deg,rgba(7,22,40,.5) 0%,rgba(7,22,40,0) 32%)}
#vprasanja.q12 .q12-hp-glow{position:absolute;z-index:1;left:30%;right:14%;top:14%;bottom:26%;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(140,236,255,.6),rgba(140,236,255,0));mix-blend-mode:screen;opacity:.25;animation:q12Led 5.5s ease-in-out infinite}
@keyframes q12Led{0%,100%{opacity:.18;transform:scale(.96)}50%{opacity:.55;transform:scale(1.04)}}
@keyframes q12HpZoom{from{transform:scale(1.04)}to{transform:scale(1.14) translate(-1.5%,-1%)}}
#vprasanja.q12 .q12-hp-bub{position:absolute;inset:0;z-index:3;pointer-events:none}
#vprasanja.q12 .q12-hp-bub i{position:absolute;bottom:10%;width:var(--s);height:var(--s);left:var(--x);border-radius:50%;opacity:0;
  border:1px solid rgba(169,233,255,.7);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.7),rgba(169,233,255,.12) 60%,rgba(169,233,255,0) 72%);animation:q12HpBub var(--t) ease-in var(--dl) infinite}
#vprasanja.q12 .q12-hp-bub i:nth-child(1){--x:62%;--s:7px;--t:6s;--dl:0s}
#vprasanja.q12 .q12-hp-bub i:nth-child(2){--x:70%;--s:4px;--t:5s;--dl:-1.8s}
#vprasanja.q12 .q12-hp-bub i:nth-child(3){--x:48%;--s:5px;--t:6.5s;--dl:-3.2s}
#vprasanja.q12 .q12-hp-bub i:nth-child(4){--x:80%;--s:6px;--t:7s;--dl:-4.4s}
#vprasanja.q12 .q12-hp-bub i:nth-child(5){--x:55%;--s:3px;--t:5.5s;--dl:-2.5s}
@keyframes q12HpBub{0%{opacity:0;transform:translateY(0) scale(.6)}15%{opacity:.9}100%{opacity:0;transform:translateY(-150px) scale(1.1)}}
#vprasanja.q12 .faq-help p{margin-top:-46px;position:relative;z-index:3;font:500 18px/1.4 var(--x-sans);color:#fff}
#vprasanja.q12 .phone-big{gap:14px}
#vprasanja.q12 .phone-big > .ico{display:none}
#vprasanja.q12 .q12-ph{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:15px;
  background:linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%);box-shadow:0 12px 24px -10px rgba(28,174,143,.95),inset 0 1px 0 rgba(255,255,255,.5)}
#vprasanja.q12 .q12-ph svg{width:24px;height:24px;overflow:visible;fill:none;stroke:#fff;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
#vprasanja.q12 .q12-ph .ph-h{transform-box:fill-box;transform-origin:60% 60%}
#vprasanja.q12 .q12-ph .ph-a1,#vprasanja.q12 .q12-ph .ph-a2{opacity:0}
#vprasanja.q12 .q12-ph.q12-go .ph-h{animation:q12Ring 4s ease-in-out infinite}
#vprasanja.q12 .q12-ph.q12-go .ph-a2{animation:q12Arc 4s ease-out infinite}
#vprasanja.q12 .q12-ph.q12-go .ph-a1{animation:q12Arc 4s ease-out .15s infinite}
@keyframes q12Ring{0%,8%,40%,100%{transform:rotate(0)}12%{transform:rotate(-14deg)}16%{transform:rotate(12deg)}20%{transform:rotate(-12deg)}24%{transform:rotate(10deg)}28%{transform:rotate(-6deg)}32%{transform:rotate(0)}}
@keyframes q12Arc{0%,8%{opacity:0}14%,30%{opacity:1}42%,100%{opacity:0}}
#vprasanja.q12 .phone-big:hover .q12-ph{transform:translateY(-1px)}

@media (max-width:1279.98px){
  #vprasanja.q12 .q12-hp{height:170px}
  #vprasanja.q12 .faq-help p{font-size:16.5px}
  #vprasanja.q12 .faq-nav a{min-height:76px}
}
#vprasanja.q12.q12-off .q12-tile::after,#vprasanja.q12.q12-off .q12-hp img,#vprasanja.q12.q12-off .q12-hp-glow,#vprasanja.q12.q12-off .q12-hp-bub i,
#vprasanja.q12.q12-off .q12-ph *,#vprasanja.q12.q12-off .q12-c1::before{animation-play-state:paused!important}
}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #vprasanja.q12 .q12-tile::after,#vprasanja.q12 .q12-hp-bub{display:none}
  #vprasanja.q12 .q12-hp img,#vprasanja.q12 .q12-hp-glow,#vprasanja.q12 .q12-ph *,#vprasanja.q12 .q12-c1::before{animation:none!important}
  #vprasanja.q12 .q12-t-varnost .i3-ck{stroke-dashoffset:0}
  #vprasanja.q12 .q12-t-terapija .i3-w circle{fill:#fff}
  #vprasanja.q12 .q12-t-paketi .i3-inst rect{fill:#fff}
}


/* ===== 10. Darilni bon (Končna verzija) ===== */
/* 9. Darilni bon – dodatni slogi samo za to sekcijo.
   Verzija 5 (21. 10. 2026): pasica »Podarite VIP izkušnjo« (zasebni zakup celotne komore, fotografija notranjosti, zlati poudarki);
   popravek: odtenek holograma zdaj v --b9hue (prej --hh, ki v ogrodju pomeni višino glave).
   Verzija 4 (21. 10. 2026): uvod v dveh odstavkih, ob prvem animirana ikona darila (pokrov poskoči, izplavajo trije mehurčki),
   drugi stavek o komori (glej konec datoteke).
   Verzija 3 (21. 10. 2026): nov uvodni stavek naročnika; slogi enaki kot v Verziji 2.
   Verzija 2 (21. 10. 2026): temno nadaljevanje sekcij 1–8 (sij, pikčasta mreža, mehurčki, znak v ozadju),
   premium darilna kartica (giljoš vzorec, satenasti trak in pentlja, hologram z znakom, 3D nagib za miško,
   odsev in senca), stekleni gumbi vrednosti z oznako, animirani ikoni dostave (kuverta z bonom, papirnato letalo),
   ikona veljavnosti, darilo na gumbu se odpre ob prehodu. Vsebina nespremenjena.
   Slogi so omejeni na #darilni-bon.b9 (namizje, od 1024 px); telefon in tablica ostaneta kot v Verziji 1. */

/* elementi, ki so le na namizju */
#darilni-bon .b9-d,#darilni-bon .b9-tile,#darilni-bon .b9-vi,#darilni-bon .b9-hint-i,#darilni-bon .bon-v small,#darilni-bon .bon-v .b9-ck{display:none}
#darilni-bon .b9-stage,#darilni-bon .b9-float{position:relative;width:100%;display:flex;justify-content:center}
#darilni-bon .bon-v b{font:inherit}
@property --b9hue{syntax:'<angle>';inherits:true;initial-value:0deg}

@media (min-width:1024px){

#darilni-bon.b9{color:var(--x-on);
  background:radial-gradient(46% 40% at 22% 52%,rgba(56,182,255,.13) 0%,rgba(56,182,255,0) 70%),
             radial-gradient(40% 34% at 96% 8%,rgba(30,111,217,.12) 0%,rgba(30,111,217,0) 70%),
             linear-gradient(180deg,#050F1F 0%,#071A30 32%,#06162B 72%,#050F1F 100%)}
#darilni-bon.b9 .bon-glow{display:none}
#darilni-bon.b9 > .wrap{position:relative;z-index:1}
#darilni-bon.b9::before{content:"";position:absolute;z-index:1;top:0;left:50%;width:min(1100px,80%);height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.22) 50%,rgba(127,219,255,0))}

/* ---------- ozadje ---------- */
#darilni-bon.b9 .b9-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#darilni-bon.b9 .b9-glow{position:absolute;border-radius:50%;filter:blur(10px)}
#darilni-bon.b9 .b9-g1{width:860px;height:860px;left:-180px;top:50%;margin-top:-430px;background:radial-gradient(closest-side,rgba(56,182,255,.15),rgba(56,182,255,0))}
#darilni-bon.b9 .b9-g2{width:760px;height:760px;right:-240px;top:-300px;background:radial-gradient(closest-side,rgba(30,111,217,.15),rgba(30,111,217,0))}
#darilni-bon.b9 .b9-g3{width:700px;height:700px;right:16%;bottom:-420px;background:radial-gradient(closest-side,rgba(94,242,201,.06),rgba(94,242,201,0))}
#darilni-bon.b9 .b9-grid{position:absolute;inset:0;opacity:.45;
  background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(34% 30% at 78% 18%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(34% 30% at 78% 18%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
#darilni-bon.b9 .b9-wm{position:absolute;left:-120px;top:50%;height:118%;width:auto;transform:translateY(-50%);opacity:.09;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 40%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,#000 0%,#000 40%,rgba(0,0,0,0) 100%)}
#darilni-bon.b9 .b9-bub{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%);mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%)}
#darilni-bon.b9 .b9-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:b9Rise var(--t) linear var(--dl) infinite,b9Sway calc(var(--t) / 6) ease-in-out var(--dl) infinite alternate}
#darilni-bon.b9 .b9-bub i:nth-child(1){--x:3%;--s:9px;--t:30s;--dl:-8s}
#darilni-bon.b9 .b9-bub i:nth-child(2){--x:11%;--s:5px;--t:25s;--dl:-17s}
#darilni-bon.b9 .b9-bub i:nth-child(3){--x:20%;--s:12px;--t:34s;--dl:-12s}
#darilni-bon.b9 .b9-bub i:nth-child(4){--x:31%;--s:6px;--t:27s;--dl:-22s}
#darilni-bon.b9 .b9-bub i:nth-child(5){--x:41%;--s:4px;--t:23s;--dl:-9s}
#darilni-bon.b9 .b9-bub i:nth-child(6){--x:50%;--s:10px;--t:32s;--dl:-26s}
#darilni-bon.b9 .b9-bub i:nth-child(7){--x:59%;--s:6px;--t:26s;--dl:-3s}
#darilni-bon.b9 .b9-bub i:nth-child(8){--x:67%;--s:14px;--t:36s;--dl:-19s}
#darilni-bon.b9 .b9-bub i:nth-child(9){--x:76%;--s:7px;--t:28s;--dl:-11s}
#darilni-bon.b9 .b9-bub i:nth-child(10){--x:84%;--s:5px;--t:24s;--dl:-15s}
#darilni-bon.b9 .b9-bub i:nth-child(11){--x:91%;--s:11px;--t:33s;--dl:-28s}
#darilni-bon.b9 .b9-bub i:nth-child(12){--x:97%;--s:6px;--t:26s;--dl:-5s}
@keyframes b9Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}5%{opacity:.7}100%{transform:translate3d(0,-1500px,0) scale(1.1);opacity:.5}}
@keyframes b9Sway{from{translate:-8px 0}to{translate:8px 0}}

/* ---------- glava in besedilo ---------- */
#darilni-bon.b9 .eyebrow{color:var(--x-cyan)}
#darilni-bon.b9 .h2{color:#fff}
#darilni-bon.b9 .h2-em{color:var(--x-aqua)}
#darilni-bon.b9 .bon-p{color:var(--x-on-2)}

/* ---------- oder s kartico ---------- */
#darilni-bon.b9 .bon-visual{gap:34px;perspective:none}
#darilni-bon.b9 .b9-stage{display:block;width:min(100%,540px);margin-inline:auto}
#darilni-bon.b9 .b9-float{display:block;z-index:2;animation:b9Float 7s ease-in-out infinite}
@keyframes b9Float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
#darilni-bon.b9 .b9-halo{display:block;position:absolute;z-index:0;left:-22%;right:-22%;top:-34%;bottom:-34%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(56,182,255,.26) 0%,rgba(56,182,255,.1) 45%,rgba(56,182,255,0) 100%);filter:blur(4px)}
#darilni-bon.b9 .b9-floor{display:block;position:absolute;z-index:1;left:10%;right:10%;bottom:-12%;height:15%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(0,4,12,.7),rgba(0,4,12,0));filter:blur(6px);animation:b9Floor 7s ease-in-out infinite}
#darilni-bon.b9 .b9-floor::after{content:"";position:absolute;left:18%;right:18%;top:20%;bottom:20%;border-radius:50%;background:radial-gradient(closest-side,rgba(56,182,255,.35),rgba(56,182,255,0))}
@keyframes b9Floor{0%,100%{transform:scaleX(1);opacity:.85}50%{transform:scaleX(.86);opacity:.55}}
#darilni-bon.b9 .b9-sparks{display:block;position:absolute;inset:0;z-index:3;pointer-events:none}
#darilni-bon.b9 .b9-sparks i{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);color:#D8F6FF;opacity:0;
  filter:drop-shadow(0 0 6px rgba(127,219,255,.9));animation:b9Tw 4.2s ease-in-out var(--dl) infinite}
#darilni-bon.b9 .b9-sparks svg{display:block;width:100%;height:100%;fill:currentColor}
@keyframes b9Tw{0%,100%{opacity:0;transform:scale(.2) rotate(0)}45%{opacity:1;transform:scale(1) rotate(35deg)}70%{opacity:.2;transform:scale(.5) rotate(70deg)}}

/* ---------- darilna kartica ---------- */
#darilni-bon.b9 .bon-card{container-type:inline-size;width:100%;border-radius:28px;animation:none;transform:rotate(-4deg);transition:transform .8s var(--x-ease);will-change:transform;
  background:radial-gradient(80% 70% at 92% 0%,rgba(169,233,255,.42) 0%,rgba(169,233,255,0) 60%),
             radial-gradient(70% 90% at 0% 100%,rgba(3,14,38,.6) 0%,rgba(3,14,38,0) 70%),
             linear-gradient(140deg,#2A88F0 0%,#1758B4 46%,#0A2F6C 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 46px 80px -34px rgba(0,0,0,.9),0 0 90px -18px rgba(56,182,255,.55)}
#darilni-bon.b9 .bon-card.b9-hov{transition:transform .14s linear}
#darilni-bon.b9 .b9-guil{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
#darilni-bon.b9 .b9-guil .wv polyline{fill:none;stroke:rgba(255,255,255,.09);stroke-width:.7}
#darilni-bon.b9 .b9-guil .ros polygon{fill:none;stroke:rgba(214,245,255,.16);stroke-width:.6}
#darilni-bon.b9 .bc-chip,#darilni-bon.b9 .bc-bow{display:none}
#darilni-bon.b9 .bc-logo{left:6.5%;top:8.5%;width:33%}

/* satenasti trak s šivom in sijem */
#darilni-bon.b9 .bc-ribbon-v,#darilni-bon.b9 .bc-ribbon-h{opacity:1;overflow:hidden}
#darilni-bon.b9 .bc-ribbon-v{right:25%;width:26px;
  background:linear-gradient(90deg,#4AA6DA 0%,#9FE0F8 20%,#F2FCFF 44%,#B6E9FA 62%,#6CC4EC 84%,#3E97CF 100%);
  box-shadow:-4px 0 12px -4px rgba(3,18,48,.55),4px 0 12px -4px rgba(3,18,48,.55)}
#darilni-bon.b9 .bc-ribbon-h{top:37%;height:26px;
  background:linear-gradient(180deg,#4AA6DA 0%,#9FE0F8 20%,#F2FCFF 44%,#B6E9FA 62%,#6CC4EC 84%,#3E97CF 100%);
  box-shadow:0 -4px 12px -4px rgba(3,18,48,.55),0 5px 12px -4px rgba(3,18,48,.6)}
#darilni-bon.b9 .bc-ribbon-v::before{content:"";position:absolute;top:0;bottom:0;left:3px;right:3px;border-left:1px dashed rgba(255,255,255,.7);border-right:1px dashed rgba(16,86,150,.4)}
#darilni-bon.b9 .bc-ribbon-h::before{content:"";position:absolute;left:0;right:0;top:3px;bottom:3px;border-top:1px dashed rgba(255,255,255,.7);border-bottom:1px dashed rgba(16,86,150,.4)}
#darilni-bon.b9 .bc-ribbon-h::after{content:"";position:absolute;top:0;bottom:0;left:0;width:22%;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.85),rgba(255,255,255,0));animation:b9SheenX 7s ease-in-out infinite}
#darilni-bon.b9 .bc-ribbon-v::after{content:"";position:absolute;left:0;right:0;top:0;height:26%;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.85),rgba(255,255,255,0));animation:b9SheenY 7s ease-in-out 1.2s infinite}
@keyframes b9SheenX{0%,45%{transform:translateX(-120%)}75%,100%{transform:translateX(560%)}}
@keyframes b9SheenY{0%,45%{transform:translateY(-120%)}75%,100%{transform:translateY(480%)}}
#darilni-bon.b9 .b9-bow{display:block;position:absolute;z-index:3;width:34%;left:calc(58% - 13px);top:calc(18% + 13px);overflow:visible;
  filter:drop-shadow(0 10px 10px rgba(3,18,48,.45)) drop-shadow(0 2px 2px rgba(3,18,48,.3))}

/* hologram z znakom */
#darilni-bon.b9 .b9-holo{display:grid;place-items:center;position:absolute;z-index:3;right:6%;top:7.5%;width:11.5%;aspect-ratio:1;border-radius:50%;overflow:hidden;isolation:isolate;
  background:conic-gradient(from var(--b9hue) at 50% 50%,#7FDBFF,#A99CFF,#6EF0CF,#FFE29A,#7FDBFF,#B7A6FF,#62E3FF);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.85),inset 0 0 0 4px rgba(10,47,108,.18),inset 0 -8px 12px -6px rgba(20,60,120,.45),0 8px 16px -6px rgba(3,18,48,.65);transition:--b9hue .35s ease-out}
#darilni-bon.b9 .b9-holo::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:50%;
  background:repeating-radial-gradient(circle at 50% 50%,rgba(255,255,255,.55) 0 .6px,rgba(255,255,255,0) .6px 3px),
             linear-gradient(135deg,rgba(255,255,255,.65) 0%,rgba(255,255,255,0) 45%,rgba(255,255,255,0) 60%,rgba(255,255,255,.4) 100%);mix-blend-mode:soft-light}
#darilni-bon.b9 .b9-holo svg{width:60%;height:60%;filter:drop-shadow(0 1.5px 2px rgba(10,40,100,.75)) drop-shadow(0 0 4px rgba(10,40,100,.35))}
#darilni-bon.b9 .bon-card.b9-hov .b9-holo{transition:--b9hue .12s linear}
#darilni-bon.b9 .bon-card.bump .b9-holo{animation:b9Holo .9s ease-out}
@keyframes b9Holo{from{--b9hue:0deg}to{--b9hue:360deg}}

/* mehurčki na kartici */
#darilni-bon.b9 .bc-bub i{border-color:rgba(255,255,255,.45);animation:b9Bob 5s ease-in-out infinite}
#darilni-bon.b9 .bc-bub i:nth-child(1){left:50%;top:13%;animation-delay:-1s}
#darilni-bon.b9 .bc-bub i:nth-child(2){left:45%;top:31%;animation-delay:-2.6s}
#darilni-bon.b9 .bc-bub i:nth-child(3){left:57%;top:64%;animation-delay:-.4s}
#darilni-bon.b9 .bc-bub i:nth-child(4){left:44%;top:76%;animation-delay:-3.4s}
@keyframes b9Bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* napisi na kartici */
#darilni-bon.b9 .bc-label{left:7%;bottom:18.6cqw;font:600 12.5px/1 var(--x-sans);letter-spacing:.22em;color:rgba(255,255,255,.9)}
#darilni-bon.b9 .b9-lv{display:inline;color:rgba(214,245,255,.7);letter-spacing:.16em}
#darilni-bon.b9 .bc-val{left:6.5%;bottom:5.2cqw;font-size:13.2cqw;text-shadow:none;
  background:linear-gradient(180deg,#FFFFFF 35%,#CFEFFF 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 6px 14px rgba(3,18,48,.45))}
#darilni-bon.b9 .bc-val small{color:transparent}
#darilni-bon.b9 .bc-val.b9-flip > span{display:inline-block;animation:b9Flip .55s var(--x-ease)}
@keyframes b9Flip{0%{opacity:0;transform:translateY(14px);filter:blur(5px)}100%{opacity:1;transform:none;filter:none}}
#darilni-bon.b9 .bc-sub{right:5%;bottom:8.5%;max-width:none;white-space:nowrap;padding:7px 12px;border-radius:11px;font:500 12.5px/1.3 var(--x-sans);letter-spacing:.01em;
  background:rgba(4,22,56,.5);border:1px solid rgba(214,245,255,.22);box-shadow:0 8px 18px -10px rgba(0,0,0,.6)}

/* odsev za miško in robni sij */
#darilni-bon.b9 .b9-glare{display:block;position:absolute;inset:0;z-index:5;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .5s;
  background:radial-gradient(42% 60% at var(--gx,30%) var(--gy,20%),rgba(255,255,255,.28),rgba(255,255,255,0) 70%)}
#darilni-bon.b9 .bon-card.b9-hov .b9-glare{opacity:1}
#darilni-bon.b9 .b9-edge{display:block;position:absolute;inset:0;z-index:6;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.7) 0%,rgba(255,255,255,.08) 35%,rgba(255,255,255,0) 60%,rgba(169,233,255,.35) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}

/* namig pod kartico */
#darilni-bon.b9 .b9-hint{display:flex;align-items:center;gap:12px;width:min(100%,540px);margin-inline:auto;padding:8px 20px 8px 8px;border-radius:999px;position:relative;z-index:2;
  background:linear-gradient(150deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid rgba(127,219,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
#darilni-bon.b9 .b9-hint-i{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;
  background:linear-gradient(150deg,#4FB4FF 0%,#1E6FD9 60%,#0F3E86 100%);box-shadow:0 8px 18px -8px rgba(30,111,217,.9),inset 0 1px 0 rgba(255,255,255,.4)}
#darilni-bon.b9 .b9-hint-i svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round}
#darilni-bon.b9 .bon-hint{min-height:0;text-align:left;font:500 15px/1.4 var(--x-sans);color:var(--x-aqua)}
#darilni-bon.b9 .b9-hint.b9-fade .bon-hint{animation:b9Fade .45s ease-out}
#darilni-bon.b9 .b9-hint.b9-fade .b9-hint-i{animation:b9Coin .6s var(--x-ease)}
@keyframes b9Fade{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
@keyframes b9Coin{from{transform:rotateY(0)}to{transform:rotateY(360deg)}}

/* ---------- izbira vrednosti ---------- */
#darilni-bon.b9 .bon-vals{gap:12px;padding-top:4px}
#darilni-bon.b9 .bon-v{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:80px;padding:10px 6px;border-radius:20px;
  background:linear-gradient(160deg,rgba(255,255,255,.08) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.22);color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 22px 40px -30px rgba(0,0,0,.95);
  transition:background .3s,border-color .3s,box-shadow .35s,transform .35s var(--x-ease)}
#darilni-bon.b9 .bon-v b{font:600 22px/1 var(--x-sans);letter-spacing:-.01em}
#darilni-bon.b9 .bon-v small{display:block;font:500 12px/1.2 var(--x-sans);letter-spacing:.03em;color:var(--x-on-3);transition:color .3s}
#darilni-bon.b9 .bon-v:hover{transform:translateY(-3px);border-color:rgba(127,219,255,.55);background:linear-gradient(160deg,rgba(127,219,255,.14) 0%,rgba(255,255,255,.03) 100%)}
#darilni-bon.b9 .bon-v[aria-checked="true"]{color:#fff;border-color:rgba(169,233,255,.65);
  background:linear-gradient(150deg,#4FB4FF 0%,#1E6FD9 58%,#1650B0 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 18px 36px -14px rgba(56,182,255,.85),0 0 0 4px rgba(56,182,255,.12)}
#darilni-bon.b9 .bon-v[aria-checked="true"] small{color:rgba(255,255,255,.86)}
#darilni-bon.b9 .bon-v:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}
#darilni-bon.b9 .bon-v .b9-ck{display:grid;place-items:center;position:absolute;top:-8px;right:-8px;width:24px;height:24px;border-radius:50%;
  background:linear-gradient(150deg,#7FF0D6,#2FD3B0);box-shadow:0 6px 12px -4px rgba(28,174,143,.8),0 0 0 3px #071A30;transform:scale(0);transition:transform .4s var(--x-ease)}
#darilni-bon.b9 .bon-v .b9-ck svg{width:15px;height:15px;fill:none;stroke:#05312A;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
#darilni-bon.b9 .bon-v[aria-checked="true"] .b9-ck{transform:scale(1)}
#darilni-bon.b9 .bon-other{color:var(--x-on-3)}

/* ---------- načini dostave ---------- */
#darilni-bon.b9 .bon-deliv{gap:14px}
#darilni-bon.b9 .bon-deliv li{gap:16px;padding:18px 20px;border-radius:22px;color:var(--x-on-2);
  background:linear-gradient(150deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 30px 50px -40px rgba(0,0,0,.9);transition:transform .4s var(--x-ease),border-color .3s}
#darilni-bon.b9 .bon-deliv li:hover{transform:translateY(-3px);border-color:rgba(127,219,255,.34)}
#darilni-bon.b9 .bon-deliv b{color:#fff}
#darilni-bon.b9 .bd-ico{display:none}
#darilni-bon.b9 .b9-tile{position:relative;flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:19px;overflow:hidden;isolation:isolate;
  background:linear-gradient(150deg,#4FB4FF 0%,#1E6FD9 55%,#0F3E86 100%);box-shadow:0 12px 26px -12px rgba(30,111,217,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,11,22,.55)}
#darilni-bon.b9 .b9-tile-teal{background:linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%);box-shadow:0 12px 26px -12px rgba(28,174,143,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,30,26,.55)}
#darilni-bon.b9 .b9-tile::before{content:"";position:absolute;left:12%;right:12%;top:5%;height:42%;border-radius:50% 50% 45% 45%/70% 70% 30% 30%;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,0));z-index:-1}
#darilni-bon.b9 .b9-tile svg{width:34px;height:34px;overflow:visible}
#darilni-bon.b9 .b9-tile .tl,#darilni-bon.b9 .b9-tile .tl *{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* kuverta: zavihek se odpre, bon se dvigne */
#darilni-bon.b9 .b9-t-env .e-ff,#darilni-bon.b9 .b9-t-env .e-fb{transform-box:view-box;transform-origin:24px 23.5px}
#darilni-bon.b9 .b9-t-env .e-fb{transform:scaleY(0)}
#darilni-bon.b9 .b9-t-env .e-c{transform-box:view-box}
#darilni-bon.b9 .b9-t-env .e-sp{fill:#fff;opacity:0;transform-box:fill-box;transform-origin:center}
#darilni-bon.b9 .b9-t-env.b9-go .e-ff{animation:b9EnvFF 6s ease-in-out .3s infinite}
#darilni-bon.b9 .b9-t-env.b9-go .e-fb{animation:b9EnvFB 6s ease-in-out .3s infinite}
#darilni-bon.b9 .b9-t-env.b9-go .e-c{animation:b9EnvC 6s var(--x-ease) .3s infinite}
#darilni-bon.b9 .b9-t-env.b9-go .e-sp{animation:b9EnvS 6s ease-out .3s infinite}
@keyframes b9EnvFF{0%,8%{transform:scaleY(1)}13%,87%{transform:scaleY(0)}92%,100%{transform:scaleY(1)}}
@keyframes b9EnvFB{0%,13%{transform:scaleY(0)}18%,82%{transform:scaleY(1)}87%,100%{transform:scaleY(0)}}
@keyframes b9EnvC{0%,17%{transform:translateY(0)}32%,70%{transform:translateY(-15px)}82%,100%{transform:translateY(0)}}
@keyframes b9EnvS{0%,30%{opacity:0;transform:scale(.2) rotate(0)}38%{opacity:1;transform:scale(1.1) rotate(30deg)}52%,100%{opacity:0;transform:scale(.4) rotate(70deg)}}

/* e-pošta: papirnato letalo odleti in prileti s sledjo */
#darilni-bon.b9 .b9-t-send .s-pl{transform-box:view-box}
#darilni-bon.b9 .b9-t-send .s-tr{fill:none;stroke:rgba(255,255,255,.8);stroke-width:2;stroke-linecap:round;stroke-dasharray:1.2 4;opacity:0}
#darilni-bon.b9 .b9-t-send.b9-go .s-pl{animation:b9Plane 5.4s var(--x-ease) .5s infinite}
#darilni-bon.b9 .b9-t-send.b9-go .s-tr{animation:b9Trail 5.4s ease-out .5s infinite}
@keyframes b9Plane{0%,36%{transform:translate(0,0);opacity:1}
  20%{transform:translate(0,-1.6px)}
  48%{transform:translate(20px,-20px) scale(.55);opacity:0}
  49%{transform:translate(-20px,20px) scale(.55);opacity:0}
  66%,100%{transform:translate(0,0) scale(1);opacity:1}}
@keyframes b9Trail{0%,52%{opacity:0;stroke-dashoffset:10}62%{opacity:.9}86%,100%{opacity:0;stroke-dashoffset:0}}

/* ---------- veljavnost ---------- */
#darilni-bon.b9 .b9-valid{display:flex;align-items:flex-start;gap:14px}
#darilni-bon.b9 .b9-vi{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:13px;margin-top:-6px;
  background:rgba(127,219,255,.08);border:1px solid rgba(127,219,255,.26)}
#darilni-bon.b9 .b9-vi svg{width:21px;height:21px;fill:none;stroke:var(--x-cyan);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#darilni-bon.b9 .b9-vi .v-ck{stroke:#5EF2C9;stroke-width:2.2;stroke-dasharray:10;stroke-dashoffset:10;transition:stroke-dashoffset .7s var(--x-ease) .3s}
#darilni-bon.b9 .b9-vi.b9-go .v-ck{stroke-dashoffset:0}
#darilni-bon.b9 .bon-valid{color:var(--x-on-3)}
#darilni-bon.b9 .bon-valid a{color:var(--x-cyan)}

/* ---------- gumbi ---------- */
#darilni-bon.b9 .b9-gift .g-l{transform-box:view-box;transform-origin:3px 11.5px;transition:transform .45s var(--x-ease)}
#darilni-bon.b9 .bon-cta .btn-primary:hover .b9-gift .g-l{transform:translate(-.5px,-2.6px) rotate(-9deg)}
#darilni-bon.b9 .btn:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}
#darilni-bon.b9 .bon-mail-n{color:var(--x-on-3)}

/* ---------- ožje namizje ---------- */
@media (max-width:1279.98px){
  #darilni-bon.b9 .bon-deliv{flex-direction:column}
  #darilni-bon.b9 .bon-v{min-height:74px;border-radius:18px}
  #darilni-bon.b9 .bon-v b{font-size:20px}
  #darilni-bon.b9 .bon-v small{font-size:11.5px}
  #darilni-bon.b9 .b9-lv{display:none}
  #darilni-bon.b9 .bc-sub{font-size:11px;padding:6px 10px}
}

/* ---------- varčevanje in zmanjšano gibanje ---------- */
#darilni-bon.b9.b9-off .b9-bub i,#darilni-bon.b9.b9-off .b9-float,#darilni-bon.b9.b9-off .b9-floor,#darilni-bon.b9.b9-off .b9-sparks i,
#darilni-bon.b9.b9-off .bc-bub i,#darilni-bon.b9.b9-off .bc-shine,#darilni-bon.b9.b9-off .bc-ribbon-v::after,#darilni-bon.b9.b9-off .bc-ribbon-h::after,
#darilni-bon.b9.b9-off .b9-tile *{animation-play-state:paused!important}
}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #darilni-bon.b9 .b9-bub,#darilni-bon.b9 .b9-sparks{display:none}
  #darilni-bon.b9 .b9-float,#darilni-bon.b9 .b9-floor,#darilni-bon.b9 .bc-bub i,#darilni-bon.b9 .b9-tile *,
  #darilni-bon.b9 .bc-ribbon-v::after,#darilni-bon.b9 .bc-ribbon-h::after,#darilni-bon.b9 .bc-val.b9-flip > span,#darilni-bon.b9 .b9-hint *{animation:none!important}
  #darilni-bon.b9 .bc-ribbon-v::after,#darilni-bon.b9 .bc-ribbon-h::after{display:none}
  #darilni-bon.b9 .b9-t-env .e-c{transform:translateY(-15px)}
  #darilni-bon.b9 .b9-t-env .e-ff{transform:scaleY(0)}
  #darilni-bon.b9 .b9-t-env .e-fb{transform:scaleY(1)}
}

/* =====================================================================
   V4 (21. 10. 2026) – uvod v dveh odstavkih, animirana ikona darila
   ===================================================================== */
@media (min-width:1024px){
#darilni-bon.b9 .b9-lead{display:flex;align-items:center;gap:20px}
#darilni-bon.b9 .b9-lead .lead{margin:0}
#darilni-bon.b9 .b9-tile-gift{width:64px;height:64px;border-radius:21px;
  background:linear-gradient(150deg,#7FDBFF 0%,#38B6FF 38%,#1E6FD9 72%,#123F8E 100%);box-shadow:0 14px 30px -12px rgba(56,182,255,.85),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -10px 18px -10px rgba(4,11,22,.55)}
#darilni-bon.b9 .b9-tile-gift svg{width:38px;height:38px}
#darilni-bon.b9 .b9-l2{margin-top:-6px;color:var(--x-on-2)}

/* darilo: pokrov poskoči, iz škatle izplavajo trije mehurčki (kot v znaku), iskrice */
#darilni-bon.b9 .b9-t-gift .gf-lid{transform-box:view-box;transform-origin:9px 24px}
#darilni-bon.b9 .b9-t-gift .gf-box{transform-box:view-box;transform-origin:24px 41px}
#darilni-bon.b9 .b9-t-gift .gf-b circle{fill:rgba(255,255,255,.22);stroke:#fff;stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center}
#darilni-bon.b9 .b9-t-gift .gf-sp{fill:#fff;opacity:0;transform-box:fill-box;transform-origin:center}
#darilni-bon.b9 .b9-t-gift.b9-go .gf-lid{animation:b9GLid 5.2s var(--x-ease) .4s infinite}
#darilni-bon.b9 .b9-t-gift.b9-go .gf-box{animation:b9GBox 5.2s ease-out .4s infinite}
#darilni-bon.b9 .b9-t-gift.b9-go .b1{animation:b9GB1 5.2s ease-out .4s infinite}
#darilni-bon.b9 .b9-t-gift.b9-go .b2{animation:b9GB2 5.2s ease-out .4s infinite}
#darilni-bon.b9 .b9-t-gift.b9-go .b3{animation:b9GB3 5.2s ease-out .4s infinite}
#darilni-bon.b9 .b9-t-gift.b9-go .s1{animation:b9GS 5.2s ease-out .4s infinite}
#darilni-bon.b9 .b9-t-gift.b9-go .s2{animation:b9GS 5.2s ease-out 1s infinite}
@keyframes b9GLid{0%,8%{transform:none}15%{transform:translateY(-1.5px) rotate(-84deg)}20%,56%{transform:translateY(-1px) rotate(-74deg)}64%{transform:rotate(3deg)}68%,100%{transform:none}}
@keyframes b9GBox{0%,64%{transform:none}68%{transform:scale(1.04,.94)}74%,100%{transform:none}}
@keyframes b9GB1{0%,13%{opacity:0;transform:translate(0,0) scale(.5)}22%{opacity:1}52%{opacity:.9;transform:translate(-3px,-17px) scale(1)}60%,100%{opacity:0;transform:translate(-4px,-21px) scale(1.05)}}
@keyframes b9GB2{0%,17%{opacity:0;transform:translate(0,0) scale(.5)}26%{opacity:1}56%{opacity:.9;transform:translate(3px,-19px) scale(1)}62%,100%{opacity:0;transform:translate(4px,-22px) scale(1.05)}}
@keyframes b9GB3{0%,21%{opacity:0;transform:translate(0,0) scale(.5)}30%{opacity:1}58%{opacity:.9;transform:translate(0,-24px) scale(1)}64%,100%{opacity:0;transform:translate(0,-27px) scale(1.05)}}
@keyframes b9GS{0%,16%{opacity:0;transform:scale(.2) rotate(0)}26%{opacity:1;transform:scale(1.1) rotate(30deg)}40%,100%{opacity:0;transform:scale(.4) rotate(70deg)}}
}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #darilni-bon.b9 .b9-t-gift .gf-b circle{opacity:0}
}

/* =====================================================================
   V5 (21. 10. 2026) – pasica »Podarite VIP izkušnjo« (zasebni zakup celotne komore)
   ===================================================================== */
/* osnova (telefon in tablica) */
#darilni-bon .b9-vip-w{margin-top:28px}
#darilni-bon .b9-vip{position:relative;overflow:hidden;isolation:isolate;border-radius:20px;color:#fff;
  background:linear-gradient(150deg,rgba(226,190,106,.14) 0%,rgba(255,255,255,.04) 45%,rgba(255,255,255,.02) 100%);border:1px solid rgba(226,190,106,.42);
  box-shadow:0 24px 50px -30px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.08)}
#darilni-bon .b9-vip-ph{position:relative;aspect-ratio:16/9;overflow:hidden}
#darilni-bon .b9-vip-ph img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 55%}
#darilni-bon .b9-vip-sh{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,22,40,0) 45%,rgba(7,22,40,.75) 100%)}
#darilni-bon .b9-vip-sp{display:none}
#darilni-bon .b9-vip-tx{display:flex;flex-direction:column;gap:12px;padding:18px 18px 20px}
#darilni-bon .b9-vip-h{font-family:var(--f-display);font-weight:800;font-size:22px;line-height:1.2;color:#fff}
#darilni-bon .b9-vip-h span{color:#F1D38C}
#darilni-bon .b9-vip-p{font-size:15px;line-height:1.55;color:rgba(255,255,255,.8)}
#darilni-bon .b9-vip-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
#darilni-bon .b9-vip-cta .btn{flex:1 1 200px}
#darilni-bon .b9-vip-mail{color:#2A1C04;background:linear-gradient(135deg,#F6E3B0 0%,#E2BE6A 50%,#C9963A 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 12px 26px -14px rgba(226,190,106,.9)}
#darilni-bon .b9-vip-mail:hover{color:#2A1C04;filter:brightness(1.06)}

@media (min-width:1024px){
#darilni-bon.b9 .b9-vip-w{margin-top:clamp(64px,5vw,96px)}
#darilni-bon.b9 .b9-vip{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:stretch;border-radius:30px;border:0;
  background:radial-gradient(60% 120% at 100% 0%,rgba(226,190,106,.13) 0%,rgba(226,190,106,0) 60%),linear-gradient(150deg,rgba(255,255,255,.075) 0%,rgba(255,255,255,.02) 100%);
  box-shadow:0 50px 90px -50px rgba(0,0,0,.95),0 0 80px -30px rgba(226,190,106,.35)}
/* zlata obroba s sijem, ki potuje po robu */
#darilni-bon.b9 .b9-vip::before{content:"";position:absolute;inset:0;z-index:3;border-radius:inherit;padding:1px;pointer-events:none;
  background:conic-gradient(from var(--b9va) at 50% 50%,rgba(241,211,140,.28) 0deg,rgba(255,240,200,.95) 30deg,rgba(241,211,140,.28) 75deg,rgba(241,211,140,.28) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:b9VipEdge 9s linear infinite}
#darilni-bon.b9 .b9-vip-ph{aspect-ratio:auto;min-height:300px;margin:10px 0 10px 10px;border-radius:22px}
#darilni-bon.b9 .b9-vip-ph img{position:absolute;inset:0;transform:scale(1.04);filter:brightness(.84) saturate(.92) contrast(1.04);animation:b9VipZoom 18s ease-in-out infinite alternate}
#darilni-bon.b9 .b9-vip-ph::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(160deg,rgba(30,111,217,.16),rgba(7,22,40,.1) 55%,rgba(201,150,58,.12));mix-blend-mode:multiply}
#darilni-bon.b9 .b9-vip-sh{background:linear-gradient(90deg,rgba(7,22,40,0) 55%,rgba(7,22,40,.55) 100%),linear-gradient(180deg,rgba(7,22,40,.1) 0%,rgba(7,22,40,0) 40%,rgba(7,22,40,.35) 100%),
  linear-gradient(115deg,rgba(255,240,200,0) 30%,rgba(255,240,200,.16) 45%,rgba(255,240,200,0) 60%);background-size:100% 100%,100% 100%,260% 100%;animation:b9VipSweep 7s ease-in-out infinite}
#darilni-bon.b9 .b9-vip-sp{display:block;position:absolute;inset:0;pointer-events:none}
#darilni-bon.b9 .b9-vip-sp i{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);color:#FFF1CC;opacity:0;filter:drop-shadow(0 0 6px rgba(241,211,140,.9));animation:b9Tw 4.4s ease-in-out var(--dl) infinite}
#darilni-bon.b9 .b9-vip-sp svg{display:block;width:100%;height:100%;fill:currentColor}
#darilni-bon.b9 .b9-vip-tx{justify-content:center;gap:16px;padding:40px clamp(32px,4vw,64px)}
#darilni-bon.b9 .b9-vip-hd{display:flex;align-items:center;gap:18px}
#darilni-bon.b9 .b9-vip-h{font:400 clamp(34px,2.6vw,46px)/1.05 var(--x-sans);letter-spacing:-.02em}
#darilni-bon.b9 .b9-vip-h span{font-weight:600;background:linear-gradient(180deg,#FFF1CC 10%,#E2BE6A 60%,#C9963A 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
#darilni-bon.b9 .b9-vip-p{max-width:36em;font:400 17px/1.6 var(--x-sans);color:var(--x-on-2)}
#darilni-bon.b9 .b9-vip-cta{gap:12px;margin-top:8px}
#darilni-bon.b9 .b9-vip-cta .btn{flex:0 0 auto;min-height:56px;padding:0 26px;border-radius:16px;font:600 15.5px var(--x-sans)}
#darilni-bon.b9 .b9-vip-mail{transition:transform .3s var(--x-ease),box-shadow .3s,filter .3s}
#darilni-bon.b9 .b9-vip-mail:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 18px 34px -14px rgba(226,190,106,1)}
#darilni-bon.b9 .b9-vip-tel{border-color:rgba(241,211,140,.5);color:#fff}
#darilni-bon.b9 .b9-vip-tel:hover{background:rgba(241,211,140,.12);color:#fff;border-color:rgba(241,211,140,.8)}
#darilni-bon.b9 .b9-vip .btn:focus-visible{outline:2px solid #F1D38C;outline-offset:3px}

/* zlata ikona: komora, okenca se zapovrstjo prižgejo, nad njo krona */
#darilni-bon.b9 .b9-tile-gold{width:60px;height:60px;border-radius:20px;
  background:linear-gradient(150deg,#FBEBC0 0%,#E2BE6A 42%,#B4832F 78%,#7A5520 100%);box-shadow:0 14px 28px -12px rgba(201,150,58,.9),inset 0 1px 0 rgba(255,255,255,.65),inset 0 -10px 18px -10px rgba(60,36,6,.55)}
#darilni-bon.b9 .b9-tile-gold svg{width:36px;height:36px}
#darilni-bon.b9 .b9-tile-gold .tl,#darilni-bon.b9 .b9-tile-gold .tl *{stroke:#fff;filter:drop-shadow(0 1px 1px rgba(80,50,8,.45))}
#darilni-bon.b9 .b9-t-vip .v-w circle{fill:rgba(255,255,255,0);stroke:#fff;stroke-width:2;transition:fill .3s}
#darilni-bon.b9 .b9-t-vip .v-cr{fill:#fff;opacity:0;transform-box:fill-box;transform-origin:50% 100%}
#darilni-bon.b9 .b9-t-vip .v-sp{fill:#fff;opacity:0;transform-box:fill-box;transform-origin:center}
#darilni-bon.b9 .b9-vip.b9-go .b9-t-vip .w1{animation:b9VipW 5s ease-out .3s infinite}
#darilni-bon.b9 .b9-vip.b9-go .b9-t-vip .w2{animation:b9VipW 5s ease-out .6s infinite}
#darilni-bon.b9 .b9-vip.b9-go .b9-t-vip .w3{animation:b9VipW 5s ease-out .9s infinite}
#darilni-bon.b9 .b9-vip.b9-go .b9-t-vip .v-cr{animation:b9VipCr 5s var(--x-ease) .3s infinite}
#darilni-bon.b9 .b9-vip.b9-go .b9-t-vip .v-sp{animation:b9GS 5s ease-out .5s infinite}
@keyframes b9VipW{0%,6%{fill:rgba(255,255,255,0)}14%,62%{fill:rgba(255,255,255,.95)}74%,100%{fill:rgba(255,255,255,0)}}
@keyframes b9VipCr{0%,26%{opacity:0;transform:translateY(5px) scale(.4)}36%{opacity:1;transform:translateY(-1px) scale(1.1)}42%,62%{opacity:1;transform:none}74%,100%{opacity:0;transform:translateY(-2px) scale(.9)}}
@keyframes b9VipEdge{to{--b9va:360deg}}
@keyframes b9VipZoom{from{transform:scale(1.04)}to{transform:scale(1.12) translateX(-1.5%)}}
@keyframes b9VipSweep{0%,40%{background-position:0 0,0 0,120% 0}80%,100%{background-position:0 0,0 0,-20% 0}}
@media (max-width:1279.98px){
  #darilni-bon.b9 .b9-vip-ph{min-height:260px}
  #darilni-bon.b9 .b9-vip-tx{padding:32px}
  #darilni-bon.b9 .b9-vip-h{font-size:32px}
}
#darilni-bon.b9.b9-off .b9-vip::before,#darilni-bon.b9.b9-off .b9-vip-ph img,#darilni-bon.b9.b9-off .b9-vip-sh,#darilni-bon.b9.b9-off .b9-vip-sp i{animation-play-state:paused}
}
@property --b9va{syntax:'<angle>';inherits:false;initial-value:0deg}
@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #darilni-bon.b9 .b9-vip::before,#darilni-bon.b9 .b9-vip-ph img,#darilni-bon.b9 .b9-vip-sh{animation:none!important}
  #darilni-bon.b9 .b9-vip-sp{display:none}
  #darilni-bon.b9 .b9-t-vip .v-w circle{fill:rgba(255,255,255,.95)}
  #darilni-bon.b9 .b9-t-vip .v-cr{opacity:1}
}


/* ===== 11. Brezplačen posvet (Verzija 3) ===== */
/* 13. Brezplačen posvet – dodatni slogi samo za to sekcijo.
   Verzija 2 (21. 10. 2026): temno nadaljevanje sekcij 1–12 (preliv iz #050F1F, siji, pikčasta mreža, mehurčki, znak v ozadju,
   neonski napis z recepcije diskretno za steklom obrazca); obrazec kot temna steklena kartica s krožečo svetlo obrobo,
   okencem komore in sprotnim napredkom (4 obvezni podatki); izbira področij kot v pojavnem oknu (ploščice z ikonami);
   koraki »Kaj sledi po oddaji« z animiranimi ikonami, ki se izmenično osvetlijo; telefon kot steklena kapsula.
   Polja, obveznost in besedila so poenoteni s pojavnim oknom V3 (telefon neobvezen, isto soglasje, isto sporočilo po oddaji).
   Slogi so omejeni na #posvet-sekcija.s13 in veljajo od 1024 px; telefon in tablica uporabljata skupne sloge (novi elementi imajo d-only).
   Verzija 3 (23. 10. 2026): majhno okence (56 px) zamenja VELIKO okno komore v slogu pojavnega okna 16 V3 (232 px, srebrni obroč z vijaki,
   steklo, mehurčki, počasen zoom), ki sega čez zgornji rob kartice; okoli okna merilnik napredka (4 segmenti), po oddaji zelen z značko s kljukico.
   Zaupanje (dovoljenje MZ, ocena Google) je iz vrstice pod kartico prestavljeno v glavo kartice desno od okna – kot v oknu 16. */

@property --s13a{syntax:'<angle>';inherits:false;initial-value:0deg}

@media (min-width:1024px){

/* ---------- sekcija in ozadje ---------- */
#posvet-sekcija.s13{position:relative;overflow:hidden;isolation:isolate;color:var(--x-on);
  background:radial-gradient(42% 32% at 8% 10%,rgba(30,111,217,.16) 0%,rgba(30,111,217,0) 70%),
             radial-gradient(46% 40% at 92% 55%,rgba(56,182,255,.11) 0%,rgba(56,182,255,0) 70%),
             linear-gradient(180deg,#050F1F 0%,#071A30 32%,#06162B 70%,#040B16 100%)}
#posvet-sekcija.s13::before{content:"";position:absolute;z-index:1;inset:auto;top:0;left:50%;width:min(1100px,80%);height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.22) 50%,rgba(127,219,255,0))}
#posvet-sekcija.s13 > .wrap{position:relative;z-index:2}

/* neonski napis z recepcije: le svetloba (screen), za obrazcem, zbledi proti robovom */
#posvet-sekcija.s13 .cta-bg{inset:auto;top:0;right:1%;left:auto;width:60%;height:100%;object-fit:cover;object-position:58% 40%;opacity:.8;mix-blend-mode:screen;
  filter:saturate(.85) brightness(.95);transform-origin:62% 48%;
  -webkit-mask-image:radial-gradient(54% 52% at 55% 46%,#000 0%,rgba(0,0,0,.55) 55%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(54% 52% at 55% 46%,#000 0%,rgba(0,0,0,.55) 55%,rgba(0,0,0,0) 82%);
  animation:s13Zoom 46s ease-in-out infinite alternate}
@keyframes s13Zoom{from{transform:scale(1) translate3d(0,0,0)}to{transform:scale(1.08) translate3d(-1.5%,-1%,0)}}
#posvet-sekcija.s13 .cta-copy::before{content:none}

#posvet-sekcija.s13 .s13-bg{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
#posvet-sekcija.s13 .s13-glow{position:absolute;border-radius:50%;filter:blur(10px)}
#posvet-sekcija.s13 .s13-g1{width:820px;height:820px;left:-300px;top:-280px;background:radial-gradient(closest-side,rgba(56,182,255,.13),rgba(56,182,255,0))}
#posvet-sekcija.s13 .s13-g2{width:980px;height:980px;right:-260px;top:12%;background:radial-gradient(closest-side,rgba(30,111,217,.16),rgba(30,111,217,0))}
#posvet-sekcija.s13 .s13-g3{width:720px;height:720px;left:10%;bottom:-420px;background:radial-gradient(closest-side,rgba(94,242,201,.07),rgba(94,242,201,0))}
#posvet-sekcija.s13 .s13-grid{position:absolute;inset:0;opacity:.45;
  background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(30% 26% at 16% 18%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(30% 26% at 16% 18%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
#posvet-sekcija.s13 .s13-wm{position:absolute;left:-170px;bottom:-90px;height:min(860px,72%);width:auto;opacity:.08;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 45%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,#000 0%,#000 45%,rgba(0,0,0,0) 100%)}
#posvet-sekcija.s13 .s13-bub{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%);mask-image:linear-gradient(to top,#000 0%,#000 65%,rgba(0,0,0,0) 97%)}
#posvet-sekcija.s13 .s13-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:s13Rise var(--t) linear var(--dl) infinite,s13Sway calc(var(--t) / 6) ease-in-out var(--dl) infinite alternate}
#posvet-sekcija.s13 .s13-bub i:nth-child(1){--x:2%;--s:8px;--t:30s;--dl:-6s}
#posvet-sekcija.s13 .s13-bub i:nth-child(2){--x:9%;--s:5px;--t:26s;--dl:-17s}
#posvet-sekcija.s13 .s13-bub i:nth-child(3){--x:18%;--s:12px;--t:34s;--dl:-11s}
#posvet-sekcija.s13 .s13-bub i:nth-child(4){--x:27%;--s:6px;--t:28s;--dl:-22s}
#posvet-sekcija.s13 .s13-bub i:nth-child(5){--x:37%;--s:4px;--t:24s;--dl:-8s}
#posvet-sekcija.s13 .s13-bub i:nth-child(6){--x:46%;--s:10px;--t:33s;--dl:-26s}
#posvet-sekcija.s13 .s13-bub i:nth-child(7){--x:55%;--s:6px;--t:27s;--dl:-3s}
#posvet-sekcija.s13 .s13-bub i:nth-child(8){--x:64%;--s:13px;--t:36s;--dl:-19s}
#posvet-sekcija.s13 .s13-bub i:nth-child(9){--x:73%;--s:7px;--t:29s;--dl:-12s}
#posvet-sekcija.s13 .s13-bub i:nth-child(10){--x:82%;--s:5px;--t:25s;--dl:-15s}
#posvet-sekcija.s13 .s13-bub i:nth-child(11){--x:90%;--s:11px;--t:35s;--dl:-29s}
#posvet-sekcija.s13 .s13-bub i:nth-child(12){--x:97%;--s:6px;--t:27s;--dl:-4s}
@keyframes s13Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}6%{opacity:.7}100%{transform:translate3d(0,-1500px,0) scale(1.1);opacity:.45}}
@keyframes s13Sway{from{translate:-8px 0}to{translate:8px 0}}

/* ---------- postavitev ---------- */
#posvet-sekcija.s13 .cta-d{grid-template-columns:minmax(0,1fr) minmax(0,600px);gap:clamp(56px,5.5vw,104px);align-items:center}

/* ---------- levo: besedilo ---------- */
#posvet-sekcija.s13 .cta-copy{gap:20px}
#posvet-sekcija.s13 .cta-copy .eyebrow{color:var(--x-cyan)}
#posvet-sekcija.s13 .cta-copy .h2{color:#fff}
#posvet-sekcija.s13 .s13-em{font-style:italic;color:var(--x-aqua)}
#posvet-sekcija.s13 .cta-copy .sub{display:inline-flex;align-items:center;gap:12px;margin-top:-4px;font:500 19px/1.4 var(--x-sans);font-style:normal;letter-spacing:0;color:#fff}
#posvet-sekcija.s13 .cta-copy .sub::before{content:"";flex:none;width:26px;height:26px;border-radius:50%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/13px no-repeat,linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%);
  box-shadow:0 8px 18px -8px rgba(28,174,143,.9),inset 0 1px 0 rgba(255,255,255,.45)}
#posvet-sekcija.s13 .cta-copy .lead{max-width:34em;font-size:17.5px;line-height:1.65;color:var(--x-on-2)}

/* ---------- koraki »Kaj sledi po oddaji« ---------- */
#posvet-sekcija.s13 .s13-next{width:100%;max-width:560px;margin-top:6px}
#posvet-sekcija.s13 .s13-next-h{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin:0 0 14px;font:600 12.5px/1.3 var(--x-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--x-cyan)}
#posvet-sekcija.s13 .s13-sent-chip{display:none;align-items:center;gap:7px;min-height:28px;padding:0 12px 0 8px;border-radius:999px;font:600 12.5px var(--x-sans);letter-spacing:.02em;text-transform:none;color:#062B26;
  background:linear-gradient(150deg,#8DF2D8,#38D3AE);box-shadow:0 8px 20px -10px rgba(56,211,174,.9)}
#posvet-sekcija.s13 .s13-sent-chip svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
#posvet-sekcija.s13.s13-sent .s13-sent-chip{display:inline-flex;animation:s13ChipIn .6s var(--x-ease) both}
@keyframes s13ChipIn{from{opacity:0;transform:translateY(6px) scale(.9)}to{opacity:1;transform:none}}

#posvet-sekcija.s13 .s13-steps{position:relative;display:grid;gap:10px;margin:0;padding:0 0 0 46px;list-style:none}
#posvet-sekcija.s13 .s13-steps::before,#posvet-sekcija.s13 .s13-steps::after{content:"";position:absolute;left:14px;top:var(--s13top,42px);width:2px;border-radius:2px}
#posvet-sekcija.s13 .s13-steps::before{height:var(--s13len,calc(100% - 84px));background:rgba(127,219,255,.14)}
#posvet-sekcija.s13 .s13-steps::after{height:var(--s13fill,0px);background:linear-gradient(180deg,#38B6FF,#7FDBFF 70%,#5EF2C9);transition:height .8s var(--x-ease);box-shadow:0 0 10px rgba(127,219,255,.6)}
#posvet-sekcija.s13 .s13-step{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:16px;min-height:84px;padding:14px 18px 14px 14px;border-radius:22px;
  background:linear-gradient(150deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,.015) 100%);border:1px solid rgba(127,219,255,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 26px 44px -38px rgba(0,0,0,.9);transition:background .45s,border-color .45s,box-shadow .45s,transform .5s var(--x-ease)}
#posvet-sekcija.s13 .s13-step::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;
  background:linear-gradient(105deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.12) 48%,rgba(255,255,255,0) 66%);background-size:250% 100%;background-position:120% 0}
#posvet-sekcija.s13 .s13-step.is-on{transform:translateX(6px);border-color:rgba(127,219,255,.46);
  background:radial-gradient(80% 120% at 100% 0%,rgba(56,182,255,.16) 0%,rgba(56,182,255,0) 65%),linear-gradient(150deg,rgba(56,182,255,.16) 0%,rgba(255,255,255,.02) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 34px 60px -36px rgba(56,182,255,.6)}
#posvet-sekcija.s13 .s13-step.is-on::after{animation:s13Sweep 1.3s var(--x-ease) .1s both}
@keyframes s13Sweep{0%{opacity:1;background-position:120% 0}100%{opacity:1;background-position:-30% 0}}
#posvet-sekcija.s13 .s13-node{position:absolute;left:-46px;top:50%;display:grid;place-items:center;width:30px;height:30px;margin-top:-15px;border-radius:50%;
  font:600 13px/1 var(--x-sans);color:var(--x-on-3);background:#071A30;border:1.5px solid rgba(127,219,255,.32);transition:background .4s,color .4s,border-color .4s,box-shadow .4s}
#posvet-sekcija.s13 .s13-step.is-on .s13-node{color:#fff;border-color:transparent;background:linear-gradient(150deg,#4FB4FF,#1E6FD9);box-shadow:0 0 0 5px rgba(56,182,255,.14),0 8px 18px -6px rgba(56,182,255,.9)}
#posvet-sekcija.s13 .s13-node::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:1.5px solid rgba(127,219,255,.7);opacity:0}
#posvet-sekcija.s13 .s13-step.is-on .s13-node::after{animation:s13Ring 1.9s ease-out infinite}
@keyframes s13Ring{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.9)}}
#posvet-sekcija.s13 .s13-st{display:flex;flex-direction:column;gap:3px;min-width:0}
#posvet-sekcija.s13 .s13-st b{font:600 16.5px/1.3 var(--x-sans);color:#fff}
#posvet-sekcija.s13 .s13-st > span{font-size:14.5px;line-height:1.45;color:var(--x-on-3);transition:color .4s}
#posvet-sekcija.s13 .s13-step.is-on .s13-st > span{color:var(--x-on-2)}
#posvet-sekcija.s13 .s13-state{display:none;align-items:center;gap:7px;min-height:26px;padding:0 11px;border-radius:999px;font:600 12px var(--x-sans);color:var(--x-cyan);background:rgba(127,219,255,.1);border:1px solid rgba(127,219,255,.3)}
#posvet-sekcija.s13 .s13-state::before{content:"";width:7px;height:7px;border-radius:50%;background:#7FDBFF;box-shadow:0 0 8px #7FDBFF;animation:s13Blink 1.4s ease-in-out infinite}
@keyframes s13Blink{50%{opacity:.25}}
#posvet-sekcija.s13.s13-sent .s13-step:first-child .s13-state{display:inline-flex}

/* ploščice ikon (steklo z animirano risbo, kot v sekciji 12) */
#posvet-sekcija.s13 .s13-tile{position:relative;flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:17px;overflow:hidden;isolation:isolate;
  background:linear-gradient(150deg,#4FB4FF 0%,#1E6FD9 55%,#0F3E86 100%);box-shadow:0 12px 26px -12px rgba(30,111,217,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,11,22,.55);transition:transform .5s var(--x-ease)}
#posvet-sekcija.s13 .s13-tile-teal{background:linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%);box-shadow:0 12px 26px -12px rgba(28,174,143,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,30,26,.55)}
#posvet-sekcija.s13 .s13-tile-sky{background:linear-gradient(150deg,#A9E9FF 0%,#38B6FF 45%,#1E6FD9 80%,#123F8E 100%);box-shadow:0 12px 26px -12px rgba(56,182,255,.9),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -10px 18px -10px rgba(4,11,22,.55)}
#posvet-sekcija.s13 .s13-tile::before{content:"";position:absolute;left:12%;right:12%;top:5%;height:42%;border-radius:50% 50% 45% 45%/70% 70% 30% 30%;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,0));z-index:-1}
#posvet-sekcija.s13 .s13-step.is-on .s13-tile{transform:scale(1.06) rotate(-3deg)}
#posvet-sekcija.s13 .s13-tile svg{width:31px;height:31px;overflow:visible}
#posvet-sekcija.s13 .s13-tile .tl,#posvet-sekcija.s13 .s13-tile .tl *{fill:none;stroke:#fff;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}

/* 1 – dokument: povečevalno steklo preleti vrstice, vrstice se zapovrstjo prižgejo */
#posvet-sekcija.s13 .s13-t-case .c-l path{fill:none;stroke:rgba(255,255,255,.4);stroke-width:2.3;stroke-linecap:round}
#posvet-sekcija.s13 .s13-t-case .c-m circle{fill:rgba(255,255,255,.18);stroke:#fff;stroke-width:2.4}
#posvet-sekcija.s13 .s13-t-case .c-m path{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round}
#posvet-sekcija.s13 .s13-t-case .c-m{transform:translate(0,0)}
#posvet-sekcija.s13 .is-on .s13-t-case .c-m{animation:s13Scan 3.6s ease-in-out both}
#posvet-sekcija.s13 .is-on .s13-t-case .c-l path:nth-child(1){animation:s13L1 3.6s ease both}
#posvet-sekcija.s13 .is-on .s13-t-case .c-l path:nth-child(2){animation:s13L2 3.6s ease both}
#posvet-sekcija.s13 .is-on .s13-t-case .c-l path:nth-child(3){animation:s13L3 3.6s ease both}
@keyframes s13Scan{0%{transform:translate(-12px,-9px)}22%{transform:translate(-2px,-9px)}32%{transform:translate(-12px,-3.5px)}54%{transform:translate(-2px,-3.5px)}64%{transform:translate(-12px,2px)}82%,100%{transform:translate(-6px,2px)}}
@keyframes s13L1{0%,4%{stroke:rgba(255,255,255,.4)}20%,100%{stroke:#fff}}
@keyframes s13L2{0%,34%{stroke:rgba(255,255,255,.4)}52%,100%{stroke:#fff}}
@keyframes s13L3{0%,66%{stroke:rgba(255,255,255,.4)}80%,100%{stroke:#fff}}

/* 2 – e-pošta: pismo prileti, pokaže se značka s kljukico */
#posvet-sekcija.s13 .s13-t-mail .m-s path{fill:none;stroke:rgba(255,255,255,.8);stroke-width:2.2;stroke-linecap:round;opacity:0}
#posvet-sekcija.s13 .s13-t-mail .m-b circle{fill:#fff}
#posvet-sekcija.s13 .s13-t-mail .m-b path{fill:none;stroke:#1E6FD9;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
#posvet-sekcija.s13 .s13-t-mail .m-b{transform-box:fill-box;transform-origin:center}
#posvet-sekcija.s13 .is-on .s13-t-mail .m-e{animation:s13Fly 3.6s var(--x-ease) both}
#posvet-sekcija.s13 .is-on .s13-t-mail .m-s path{animation:s13Speed 3.6s ease-out both}
#posvet-sekcija.s13 .is-on .s13-t-mail .m-s path:nth-child(2){animation-delay:.08s}
#posvet-sekcija.s13 .is-on .s13-t-mail .m-s path:nth-child(3){animation-delay:.16s}
#posvet-sekcija.s13 .is-on .s13-t-mail .m-b{animation:s13Badge 3.6s var(--x-ease) both}
@keyframes s13Fly{0%{transform:translateX(-9px)}30%{transform:translateX(1.5px)}40%,100%{transform:translateX(0)}}
@keyframes s13Speed{0%{opacity:0;transform:translateX(6px)}12%{opacity:1}34%,100%{opacity:0;transform:translateX(-3px)}}
@keyframes s13Badge{0%,34%{transform:scale(0)}46%{transform:scale(1.25)}54%,100%{transform:scale(1)}}

/* 3 – koledar: dnevi se prižgejo, izbrani termin se obarva in obkljuka */
#posvet-sekcija.s13 .s13-t-cal .k-d circle{fill:rgba(255,255,255,.45)}
#posvet-sekcija.s13 .s13-t-cal .k-c{fill:rgba(255,255,255,.16);stroke:rgba(255,255,255,.75);stroke-width:1.6}
#posvet-sekcija.s13 .s13-t-cal .k-k{fill:none;stroke:#0A6B5E;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:10;stroke-dashoffset:10;opacity:0}
#posvet-sekcija.s13 .is-on .s13-t-cal .k-d circle:nth-child(1){animation:s13Day 3.6s ease both}
#posvet-sekcija.s13 .is-on .s13-t-cal .k-d circle:nth-child(2){animation:s13Day 3.6s ease .12s both}
#posvet-sekcija.s13 .is-on .s13-t-cal .k-d circle:nth-child(3){animation:s13Day 3.6s ease .24s both}
#posvet-sekcija.s13 .is-on .s13-t-cal .k-d circle:nth-child(4){animation:s13Day 3.6s ease .36s both}
#posvet-sekcija.s13 .is-on .s13-t-cal .k-c{animation:s13Cell 3.6s var(--x-ease) both}
#posvet-sekcija.s13 .is-on .s13-t-cal .k-k{animation:s13Tick 3.6s var(--x-ease) both}
@keyframes s13Day{0%{fill:rgba(255,255,255,.45)}10%{fill:#fff}26%,100%{fill:rgba(255,255,255,.45)}}
@keyframes s13Cell{0%,34%{fill:rgba(255,255,255,.16)}46%,100%{fill:#fff}}
@keyframes s13Tick{0%,46%{stroke-dashoffset:10;opacity:0}47%{opacity:1}64%,100%{stroke-dashoffset:0;opacity:1}}

/* ---------- telefon (steklena kapsula, ikona zazvoni) ---------- */
#posvet-sekcija.s13 .cta-copy .cta-tel{gap:14px;min-height:58px;margin-top:4px;padding:0 24px 0 8px;border-radius:999px;font:600 18px var(--x-sans);color:#fff;
  background:linear-gradient(150deg,rgba(255,255,255,.08) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 22px 40px -30px rgba(0,0,0,.9);transition:border-color .3s,background .3s,transform .4s var(--x-ease)}
#posvet-sekcija.s13 .cta-copy .cta-tel:hover{color:#fff;border-color:rgba(127,219,255,.55);background:linear-gradient(150deg,rgba(127,219,255,.14) 0%,rgba(255,255,255,.03) 100%);transform:translateY(-2px)}
#posvet-sekcija.s13 .cta-copy .cta-tel .ico{width:42px;height:42px;padding:11px;border-radius:50%;color:#fff;stroke-width:2.2;
  background:linear-gradient(150deg,#4FB4FF,#1E6FD9 60%,#0F3E86);box-shadow:0 10px 22px -10px rgba(30,111,217,.95),inset 0 1px 0 rgba(255,255,255,.4);
  animation:s13RingPh 5s ease-in-out 1.5s infinite}
@keyframes s13RingPh{0%,72%,100%{transform:rotate(0)}75%{transform:rotate(-14deg)}78%{transform:rotate(12deg)}81%{transform:rotate(-10deg)}84%{transform:rotate(8deg)}87%{transform:rotate(0)}}
#posvet-sekcija.s13 .cta-copy .cta-tel:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}

/* ---------- desno: steklena kartica obrazca ---------- */
#posvet-sekcija.s13 .s13-side{position:relative;display:flex;flex-direction:column;gap:16px;min-width:0}
#posvet-sekcija.s13 .s13-card{position:relative;isolation:isolate;padding:28px 34px 24px;border-radius:30px;color:#fff;--focus:var(--x-cyan);
  background:radial-gradient(90% 50% at 100% 0%,rgba(56,182,255,.2) 0%,rgba(56,182,255,0) 62%),linear-gradient(155deg,rgba(20,48,84,.52) 0%,rgba(8,22,42,.66) 100%);
  border:1px solid rgba(127,219,255,.2);-webkit-backdrop-filter:blur(22px) saturate(1.35);backdrop-filter:blur(22px) saturate(1.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 70px 120px -56px rgba(0,0,0,.95),0 0 80px -30px rgba(56,182,255,.25)}
#posvet-sekcija.s13 .s13-card::before{content:"";position:absolute;inset:-1px;z-index:2;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--s13a),rgba(127,219,255,0) 0deg,rgba(127,219,255,0) 230deg,rgba(127,219,255,.9) 292deg,rgba(94,242,201,.75) 318deg,rgba(127,219,255,0) 350deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  animation:s13Spin 10s linear infinite}
@keyframes s13Spin{to{--s13a:360deg}}

/* ---------- glava kartice (V3): VELIKO okno komore kot v pojavnem oknu 16 ----------
   Okno sega čez zgornji rob kartice; okoli srebrnega obroča je merilnik napredka (4 segmenti = 4 obvezni podatki),
   ki se ob izpolnjevanju prižiga in ob oddaji obarva zeleno. Desno: naslov, napredek in zaupanje (kot v oknu 16). */
#posvet-sekcija.s13 .s13-side{padding-top:20px}
#posvet-sekcija.s13 .s13-card{--pd:232px;--pg:15px}
#posvet-sekcija.s13 .s13-head{position:relative;z-index:3;display:grid;grid-template-columns:var(--pd) minmax(0,1fr);align-items:end;gap:30px;margin:0 0 24px}
#posvet-sekcija.s13 .s13-port{position:relative;align-self:start;width:var(--pd);aspect-ratio:1;margin-top:calc(var(--pd) * -.21 - 28px)}
/* mehak sij za oknom, ki diha */
#posvet-sekcija.s13 .s13-port::before{content:"";position:absolute;z-index:-1;inset:calc(var(--pg) * -1 - 26px);border-radius:50%;
  background:radial-gradient(closest-side,rgba(56,182,255,.3) 0%,rgba(56,182,255,.1) 55%,rgba(56,182,255,0) 100%);animation:s13Breath 6s ease-in-out infinite}
@keyframes s13Breath{0%,100%{opacity:.6;transform:scale(.95)}50%{opacity:1;transform:scale(1.04)}}
#posvet-sekcija.s13 .s13-full .s13-port::before{background:radial-gradient(closest-side,rgba(94,242,201,.26) 0%,rgba(94,242,201,.08) 55%,rgba(94,242,201,0) 100%)}
/* srebrni obroč z vijaki (kot okno 16) */
#posvet-sekcija.s13 .s13-ring{position:absolute;inset:0;display:block;border-radius:50%;padding:calc(var(--pd) * .065);
  background:conic-gradient(from 210deg,#5D6E82,#E3EAF2 12%,#8494A8 24%,#F4F7FA 38%,#6E7F94 52%,#D9E1EA 66%,#56677B 80%,#C9D3DE 92%,#5D6E82);
  box-shadow:0 34px 60px -24px rgba(0,0,0,.9),0 0 0 6px rgba(127,219,255,.08),0 0 70px -10px rgba(56,182,255,.6),inset 0 1px 0 rgba(255,255,255,.6)}
#posvet-sekcija.s13 .s13-ring::before{content:"";position:absolute;inset:calc(var(--pd) * .03);border-radius:50%;border:2px dotted rgba(40,52,66,.55)}
#posvet-sekcija.s13 .s13-lens{position:relative;display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;isolation:isolate;background:#0B2A55}
#posvet-sekcija.s13 .s13-lens img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(1.06);transform-origin:50% 56%;animation:s13Lens 28s ease-in-out infinite alternate}
@keyframes s13Lens{from{transform:scale(1.03)}to{transform:scale(1.13) translate3d(-2%,1%,0)}}
#posvet-sekcija.s13 .s13-lens::after{content:"";position:absolute;inset:0;z-index:2;border-radius:50%;pointer-events:none;
  box-shadow:inset 0 0 0 3px #1B2836,inset 0 12px 28px rgba(4,11,22,.5),inset 0 -16px 34px rgba(4,11,22,.42)}
#posvet-sekcija.s13 .s13-glass{position:absolute;inset:0;z-index:3;border-radius:50%;overflow:hidden;pointer-events:none;background:radial-gradient(120% 80% at 25% 15%,rgba(255,255,255,.36),rgba(255,255,255,0) 45%)}
#posvet-sekcija.s13 .s13-glass::after{content:"";position:absolute;inset:-25%;background:linear-gradient(115deg,rgba(255,255,255,0) 42%,rgba(255,255,255,.26) 50%,rgba(255,255,255,0) 58%);transform:translateX(-75%);animation:s13Glint 8s ease-in-out 2.5s infinite}
@keyframes s13Glint{0%,74%{transform:translateX(-75%)}100%{transform:translateX(75%)}}
/* mehurčki v komori */
#posvet-sekcija.s13 .s13-pb{position:absolute;inset:0;z-index:2;pointer-events:none}
#posvet-sekcija.s13 .s13-pb i{position:absolute;bottom:-12px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;will-change:transform,opacity;
  border:1px solid rgba(255,255,255,.75);background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.85),rgba(255,255,255,.12) 60%);animation:s13PortB var(--t) ease-in var(--dl) infinite}
#posvet-sekcija.s13 .s13-pb i:nth-child(1){--x:22%;--s:7px;--t:5.2s;--dl:0s;--dx:6px}
#posvet-sekcija.s13 .s13-pb i:nth-child(2){--x:34%;--s:4px;--t:4.4s;--dl:-1.6s;--dx:-5px}
#posvet-sekcija.s13 .s13-pb i:nth-child(3){--x:47%;--s:9px;--t:6s;--dl:-3.1s;--dx:4px}
#posvet-sekcija.s13 .s13-pb i:nth-child(4){--x:58%;--s:5px;--t:4.8s;--dl:-.8s;--dx:-6px}
#posvet-sekcija.s13 .s13-pb i:nth-child(5){--x:67%;--s:6px;--t:5.6s;--dl:-2.4s;--dx:5px}
#posvet-sekcija.s13 .s13-pb i:nth-child(6){--x:76%;--s:4px;--t:4.2s;--dl:-3.6s;--dx:-4px}
#posvet-sekcija.s13 .s13-pb i:nth-child(7){--x:40%;--s:5px;--t:5s;--dl:-4.4s;--dx:7px}
@keyframes s13PortB{0%{opacity:0;transform:translate3d(0,0,0) scale(.6)}12%{opacity:.95}80%{opacity:.55}100%{opacity:0;transform:translate3d(var(--dx),calc(var(--pd) * -.92),0) scale(1.1)}}
/* merilnik napredka okoli okna (4 segmenti) */
#posvet-sekcija.s13 .s13-gauge{position:absolute;z-index:1;left:calc(var(--pg) * -1);top:calc(var(--pg) * -1);width:calc(100% + var(--pg) * 2);height:calc(100% + var(--pg) * 2);overflow:visible;transform:rotate(-90deg)}
#posvet-sekcija.s13 .s13-gauge circle{fill:none;stroke-width:1.5;stroke-linecap:round;stroke-dashoffset:calc(var(--k) * -25 - 1.6)}
#posvet-sekcija.s13 .s13-gauge .g-tr circle{stroke:rgba(127,219,255,.2);stroke-dasharray:21.8 78.2}
#posvet-sekcija.s13 .s13-gauge .g-on circle{stroke:url(#s13Gg);stroke-dasharray:0 100;opacity:0;filter:drop-shadow(0 0 2.5px rgba(127,219,255,.95));transition:stroke-dasharray .75s var(--x-ease),opacity .2s .55s}
#posvet-sekcija.s13 .s13-gauge .g-on circle.on{stroke-dasharray:21.8 78.2;opacity:1;transition:stroke-dasharray .75s var(--x-ease),opacity .1s}
#posvet-sekcija.s13 .s13-full .s13-gauge .g-on circle{stroke:#5EF2C9;filter:drop-shadow(0 0 3px rgba(94,242,201,.95))}
/* značka s kljukico po oddaji */
#posvet-sekcija.s13 .s13-badge{position:absolute;z-index:4;right:-1%;bottom:-1%;display:grid;place-items:center;width:calc(var(--pd) * .25);aspect-ratio:1;border-radius:50%;opacity:0;transform:scale(0);
  background:radial-gradient(circle at 35% 30%,#8DF2D8,#1CAE8F 55%,#085C55);box-shadow:0 12px 26px -10px rgba(12,120,100,.95),0 0 0 5px #0A1D35,0 0 0 7px rgba(94,242,201,.4);transition:transform .6s var(--x-ease),opacity .3s}
#posvet-sekcija.s13 .s13-badge svg{width:56%;height:56%;fill:none;stroke:#fff;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:10;stroke-dashoffset:10;transition:stroke-dashoffset .5s var(--x-ease) .4s}
#posvet-sekcija.s13.s13-sent .s13-badge{opacity:1;transform:scale(1)}
#posvet-sekcija.s13.s13-sent .s13-badge svg{stroke-dashoffset:0}
/* desno od okna: naslov, napredek, zaupanje */
#posvet-sekcija.s13 .s13-head-t{display:flex;flex-direction:column;align-items:flex-start;align-self:end;gap:12px;min-width:0;padding-bottom:2px}
#posvet-sekcija.s13 .form-title{margin:0;color:#fff;font-size:calc(34px * var(--x-k));line-height:1.04}
#posvet-sekcija.s13 .s13-prog{display:inline-flex;align-items:center;gap:9px;min-height:30px;padding:0 13px 0 11px;border-radius:999px;font:600 12.5px/1.2 var(--x-sans);letter-spacing:.03em;color:var(--x-cyan);
  background:rgba(127,219,255,.08);border:1px solid rgba(127,219,255,.24);transition:color .3s,background .3s,border-color .3s}
#posvet-sekcija.s13 .s13-prog::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:#7FDBFF;box-shadow:0 0 8px #7FDBFF;animation:s13Blink 1.6s ease-in-out infinite}
#posvet-sekcija.s13 .s13-full .s13-prog{color:#5EF2C9;background:rgba(94,242,201,.1);border-color:rgba(94,242,201,.42)}
#posvet-sekcija.s13 .s13-full .s13-prog::before{background:#5EF2C9;box-shadow:0 0 8px #5EF2C9;animation:none}

/* polja na temni podlagi */
#posvet-sekcija.s13 .pform{gap:12px}
#posvet-sekcija.s13 .fld{gap:7px;font:600 14px/1.4 var(--x-sans);color:#fff}
#posvet-sekcija.s13 .s13-opt{font-weight:500;color:var(--x-on-3)}
#posvet-sekcija.s13 .fld input,#posvet-sekcija.s13 .fld textarea{min-height:48px;padding:0 16px;border:1px solid rgba(127,219,255,.24);border-radius:14px;background:rgba(4,11,22,.42);font:400 16px var(--x-sans);color:#fff;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.25);transition:border-color .25s,background .25s,box-shadow .25s}
#posvet-sekcija.s13 .fld textarea{min-height:72px;padding:12px 16px;line-height:1.45}
#posvet-sekcija.s13 .fld input::placeholder,#posvet-sekcija.s13 .fld textarea::placeholder{color:rgba(232,240,248,.5)}
#posvet-sekcija.s13 .fld input:hover,#posvet-sekcija.s13 .fld textarea:hover{border-color:rgba(127,219,255,.45);background:rgba(4,11,22,.55)}
#posvet-sekcija.s13 .fld input:focus,#posvet-sekcija.s13 .fld textarea:focus{border-color:#7FDBFF;background:rgba(4,11,22,.62);outline:3px solid rgba(56,182,255,.3);outline-offset:1px}
#posvet-sekcija.s13 .fld input:-webkit-autofill{-webkit-box-shadow:0 0 0 40px #0A1D35 inset;-webkit-text-fill-color:#fff;caret-color:#fff}
#posvet-sekcija.s13 .fld [aria-invalid="true"]{border-color:#FF9B8F;background:rgba(120,24,20,.16)}
#posvet-sekcija.s13 .err{color:#FFB4AB}
#posvet-sekcija.s13 .consent{gap:11px;font-size:13.5px;line-height:1.5;color:var(--x-on-2)}
#posvet-sekcija.s13 .consent input{accent-color:#38B6FF}
#posvet-sekcija.s13 .consent a{color:var(--x-cyan)}
#posvet-sekcija.s13 .consent a:hover{color:#fff}
#posvet-sekcija.s13 .consent-wrap.s13-bad .consent{color:#FFB4AB}
#posvet-sekcija.s13 .s13-news{margin-top:-2px}

/* področja: ploščice z ikonami (kot v pojavnem oknu, temna izvedba) */
#posvet-sekcija.s13 .s13-topics{margin:0 0 2px;padding:0;border:0;min-width:0}
#posvet-sekcija.s13 .s13-topics legend{margin-bottom:9px;padding:0;font:600 14.5px/1.4 var(--x-sans);color:#fff}
#posvet-sekcija.s13 .s13-topics legend small{font:500 13px var(--x-sans);color:var(--x-on-3)}
#posvet-sekcija.s13 .s13-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
#posvet-sekcija.s13 .s13-chip{position:relative}
#posvet-sekcija.s13 .s13-wide{grid-column:1 / -1}
#posvet-sekcija.s13 .s13-chip input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
#posvet-sekcija.s13 .s13-chip label{display:flex;align-items:center;gap:10px;height:100%;min-height:46px;padding:6px 11px 6px 6px;border-radius:14px;cursor:pointer;
  font:600 13.5px/1.25 var(--x-sans);color:#fff;background:linear-gradient(150deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,.02) 100%);border:1px solid rgba(127,219,255,.17);
  transition:background .3s,border-color .3s,box-shadow .3s,transform .35s var(--x-ease)}
#posvet-sekcija.s13 .s13-chip label:hover{border-color:rgba(127,219,255,.42);background:linear-gradient(150deg,rgba(127,219,255,.12) 0%,rgba(255,255,255,.03) 100%);transform:translateY(-1px)}
#posvet-sekcija.s13 .s13-cl{flex:1 1 auto;min-width:0}
#posvet-sekcija.s13 .s13-ci{position:relative;display:grid;place-items:center;flex:0 0 33px;width:33px;height:33px;border-radius:10px;color:var(--x-cyan);background:rgba(127,219,255,.1);
  transition:background .3s,color .3s,box-shadow .3s,transform .45s var(--x-ease)}
#posvet-sekcija.s13 .s13-ci .ico{width:18px;height:18px}
#posvet-sekcija.s13 .s13-chip label:hover .s13-ci{transform:rotate(-8deg) scale(1.06)}
#posvet-sekcija.s13 .s13-ck{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(127,219,255,.35);transition:background .3s,border-color .3s,box-shadow .3s}
#posvet-sekcija.s13 .s13-ck svg{width:13px;height:13px;fill:none;stroke:#fff;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:10;stroke-dashoffset:10;opacity:0;transition:stroke-dashoffset .35s var(--x-ease) .05s,opacity .1s}
#posvet-sekcija.s13 .s13-chip input:checked + label{border-color:rgba(127,219,255,.62);
  background:radial-gradient(90% 120% at 0% 0%,rgba(56,182,255,.3) 0%,rgba(56,182,255,0) 70%),linear-gradient(150deg,rgba(56,182,255,.22) 0%,rgba(30,111,217,.1) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 14px 30px -18px rgba(56,182,255,.85)}
#posvet-sekcija.s13 .s13-chip input:checked + label .s13-ci{color:#fff;background:linear-gradient(150deg,#86D0FF,#2C82EA 60%,#0D3C8F);box-shadow:0 8px 16px -8px rgba(30,111,217,.95),inset 0 1px 0 rgba(255,255,255,.5)}
#posvet-sekcija.s13 .s13-chip input:checked + label .s13-ck{background:linear-gradient(150deg,#4FB4FF,#1E6FD9);border-color:transparent;box-shadow:0 0 12px rgba(56,182,255,.6)}
#posvet-sekcija.s13 .s13-chip input:checked + label .s13-ck svg{stroke-dashoffset:0;opacity:1}
#posvet-sekcija.s13 .s13-chip input:focus-visible + label{outline:2px solid var(--x-cyan);outline-offset:2px}
#posvet-sekcija.s13 .s13-ci::after{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid rgba(127,219,255,.8);opacity:0;pointer-events:none}
#posvet-sekcija.s13 .s13-chip.s13-pop input:checked + label .s13-ci{animation:s13Pop .55s var(--x-ease)}
#posvet-sekcija.s13 .s13-chip.s13-pop input:checked + label .s13-ci::after{animation:s13Ripple .7s ease-out}
@keyframes s13Pop{0%{transform:scale(.8)}55%{transform:scale(1.16) rotate(-6deg)}100%{transform:none}}
@keyframes s13Ripple{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.8)}}

/* gumb za oddajo: preliv, odsev, sij, ko je vse pripravljeno */
#posvet-sekcija.s13 .submit{position:relative;overflow:hidden;gap:12px;min-height:58px;margin-top:4px;border-radius:999px;font:700 16px var(--x-sans);letter-spacing:.02em;text-transform:none;
  background:linear-gradient(180deg,#3A8BF0 0%,#1E6FD9 62%,#1A62C2 100%);box-shadow:0 18px 36px -16px rgba(30,111,217,.95),inset 0 1px 0 rgba(255,255,255,.3)}
#posvet-sekcija.s13 .submit:hover{background:linear-gradient(180deg,#4A97F5 0%,#2A7CE6 62%,#1E6FD9 100%);transform:translateY(-1px);box-shadow:0 24px 44px -16px rgba(30,111,217,1),inset 0 1px 0 rgba(255,255,255,.3)}
#posvet-sekcija.s13 .submit::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:34%;pointer-events:none;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.32),rgba(255,255,255,0));transform:skewX(-18deg);animation:s13Shine 5.5s ease-in-out 2s infinite}
@keyframes s13Shine{0%,70%{left:-40%}100%{left:120%}}
#posvet-sekcija.s13 .s13-arr{width:19px;height:19px;transition:transform .3s var(--x-ease)}
#posvet-sekcija.s13 .submit:hover .s13-arr{transform:translateX(4px)}
#posvet-sekcija.s13 .submit.is-loading .s13-arr{display:none}
#posvet-sekcija.s13 .submit.s13-ready{animation:s13Ready 2.6s ease-in-out infinite}
@keyframes s13Ready{0%,100%{box-shadow:0 18px 36px -16px rgba(30,111,217,.95),0 0 0 0 rgba(56,182,255,.0),inset 0 1px 0 rgba(255,255,255,.3)}50%{box-shadow:0 18px 36px -16px rgba(30,111,217,.95),0 0 0 7px rgba(56,182,255,.18),inset 0 1px 0 rgba(255,255,255,.3)}}
#posvet-sekcija.s13 .submit:focus-visible{outline:2px solid var(--x-cyan);outline-offset:3px}

#posvet-sekcija.s13 .form-notes{margin-top:12px;gap:6px}
#posvet-sekcija.s13 .form-notes p{font-size:12.5px;line-height:1.5;color:var(--x-on-3)}
#posvet-sekcija.s13 .form-notes p:first-child{font-style:italic}
#posvet-sekcija.s13 .form-notes .safe .ico{color:#5EF2C9}

/* po oddaji */
#posvet-sekcija.s13 .s13-ok{gap:14px;padding:8px 8px 14px}
/* V3: kljukica je na oknu komore (značka), zato velika ikona tu odpade */
#posvet-sekcija.s13 .s13-ok > .s13-okico{display:none}
#posvet-sekcija.s13 .s13-okico{position:relative;width:88px;height:88px;color:#fff;background:radial-gradient(circle at 35% 30%,#8DF2D8,#1CAE8F 55%,#085C55);
  box-shadow:0 18px 36px -14px rgba(12,120,100,.9),0 0 0 9px rgba(28,174,143,.12)}
#posvet-sekcija.s13 .s13-okico svg{width:58px;height:58px;fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round}
#posvet-sekcija.s13 .s13-okico .o-c{stroke-width:2;stroke:rgba(255,255,255,.55);stroke-dasharray:10;stroke-dashoffset:10;opacity:0;transform:rotate(-90deg);transform-origin:center;animation:s13Draw .9s var(--x-ease) .15s forwards}
#posvet-sekcija.s13 .s13-okico .o-k{stroke-width:4.2;stroke-dasharray:10;stroke-dashoffset:10;opacity:0;animation:s13Draw .55s var(--x-ease) .7s forwards}
@keyframes s13Draw{0%{opacity:1}to{stroke-dashoffset:0;opacity:1}}
#posvet-sekcija.s13 .s13-okico::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:2px solid rgba(94,242,201,.6);animation:s13Ring 1.6s ease-out .9s 2 both}
#posvet-sekcija.s13 .s13-ok h3{color:#fff;font-size:calc(38px * var(--x-k))}
#posvet-sekcija.s13 .s13-ok h3:focus{outline:none}
#posvet-sekcija.s13 .s13-ok > p{max-width:34em;font-size:16px;line-height:1.6;color:var(--x-on-2)}
#posvet-sekcija.s13 .s13-ok .ok-note{border-color:rgba(127,219,255,.3);color:var(--x-on-3);background:rgba(4,11,22,.3)}
#posvet-sekcija.s13 .s13-ok .ok-note b{color:#fff}
#posvet-sekcija.s13 .s13-ok .ok-note .ico{color:var(--x-cyan)}
#posvet-sekcija.s13 .s13-ok .btn-outline{min-height:52px;padding:0 26px;border-radius:999px;color:#fff;background:transparent;border:1px solid rgba(127,219,255,.45)}
#posvet-sekcija.s13 .s13-ok .btn-outline:hover{background:rgba(127,219,255,.12);border-color:rgba(127,219,255,.75)}

/* zaupanje v glavi kartice (V3: prej pod kartico) */
#posvet-sekcija.s13 .s13-trust{display:flex;flex-direction:column;align-self:stretch;gap:9px;margin:2px 0 0;padding:14px 0 0;list-style:none;border-top:1px solid rgba(127,219,255,.14)}
#posvet-sekcija.s13 .s13-trust li{display:flex;align-items:center;gap:10px;font-size:13.5px;line-height:1.35;color:var(--x-on-3)}
#posvet-sekcija.s13 .s13-trust b{font-weight:600;color:#fff}
#posvet-sekcija.s13 .s13-seal{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:9px;background:linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%);box-shadow:0 8px 16px -8px rgba(28,174,143,.9),inset 0 1px 0 rgba(255,255,255,.45)}
#posvet-sekcija.s13 .s13-seal svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
#posvet-sekcija.s13 .s13-stars{display:inline-flex;flex:none;gap:1px;min-width:28px}
#posvet-sekcija.s13 .s13-stars svg{width:13px;height:13px;fill:#FFC94D;filter:drop-shadow(0 0 4px rgba(255,201,77,.45))}

/* ---------- ožje namizje ---------- */
@media (max-width:1279.98px){
  #posvet-sekcija.s13 .cta-d{grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:44px}
  #posvet-sekcija.s13 .s13-card{padding:26px 26px 24px}
  #posvet-sekcija.s13 .s13-chip label{font-size:13.5px;gap:8px;padding:7px 10px 7px 7px}
  #posvet-sekcija.s13 .s13-ci{flex-basis:32px;width:32px;height:32px}
  #posvet-sekcija.s13 .s13-step{grid-template-columns:46px minmax(0,1fr) auto;gap:14px;padding:12px 14px 12px 12px}
  #posvet-sekcija.s13 .s13-tile{width:46px;height:46px;border-radius:15px}
  #posvet-sekcija.s13 .s13-tile svg{width:27px;height:27px}
  #posvet-sekcija.s13 .s13-st b{font-size:15.5px}
  #posvet-sekcija.s13 .s13-st > span{font-size:14px}
  #posvet-sekcija.s13 .cta-copy .lead{font-size:16.5px}
  #posvet-sekcija.s13 .s13-card{--pd:184px;--pg:13px}
  #posvet-sekcija.s13 .s13-side{padding-top:8px}
  #posvet-sekcija.s13 .s13-head{gap:24px;margin-bottom:20px}
  #posvet-sekcija.s13 .s13-port{margin-top:calc(var(--pd) * -.16 - 26px)}
  #posvet-sekcija.s13 .form-title{font-size:calc(28px * var(--x-k))}
  #posvet-sekcija.s13 .s13-head-t{gap:10px}
  #posvet-sekcija.s13 .s13-trust{gap:7px;padding-top:11px}
  #posvet-sekcija.s13 .s13-trust li{font-size:13px;gap:9px}
}

/* ---------- varčevanje (izven zaslona) ---------- */
#posvet-sekcija.s13.s13-off .s13-bub i,#posvet-sekcija.s13.s13-off .cta-bg,#posvet-sekcija.s13.s13-off .s13-card::before,#posvet-sekcija.s13.s13-off .s13-pb i,
#posvet-sekcija.s13.s13-off .s13-lens img,#posvet-sekcija.s13.s13-off .s13-glass::after,#posvet-sekcija.s13.s13-off .s13-port::before,#posvet-sekcija.s13.s13-off .s13-prog::before,
#posvet-sekcija.s13.s13-off .submit::after,#posvet-sekcija.s13.s13-off .submit,#posvet-sekcija.s13.s13-off .cta-tel .ico,#posvet-sekcija.s13.s13-off .s13-node::after,
#posvet-sekcija.s13.s13-off .s13-state::before{animation-play-state:paused!important}
}

@media (min-width:1024px) and (prefers-reduced-motion:reduce){
  #posvet-sekcija.s13 .s13-bub,#posvet-sekcija.s13 .s13-pb,#posvet-sekcija.s13 .s13-glass::after,#posvet-sekcija.s13 .submit::after,#posvet-sekcija.s13 .s13-card::before{display:none}
  #posvet-sekcija.s13 .s13-lens img{transform:scale(1.03)}
  #posvet-sekcija.s13 .s13-gauge .g-on circle,#posvet-sekcija.s13 .s13-badge,#posvet-sekcija.s13 .s13-badge svg{transition:none}
  #posvet-sekcija.s13 *,#posvet-sekcija.s13 *::before,#posvet-sekcija.s13 *::after{animation:none!important}
  #posvet-sekcija.s13 .s13-t-case .c-l path{stroke:#fff}
  #posvet-sekcija.s13 .s13-t-mail .m-b{transform:none}
  #posvet-sekcija.s13 .s13-t-cal .k-c{fill:#fff}
  #posvet-sekcija.s13 .s13-t-cal .k-k{stroke-dashoffset:0;opacity:1}
  #posvet-sekcija.s13 .s13-okico .o-c,#posvet-sekcija.s13 .s13-okico .o-k{stroke-dashoffset:0;opacity:1}
  #posvet-sekcija.s13 .s13-step.is-on{transform:none}
}


/* ===== 17. Pojavno okno – cenik (Verzija 1) ===== */
/* 17. Pojavno okno – cenik – Verzija 1 (21. 10. 2026)
   Prenova obstoječega okna s cenikom (oxysphere.si) v slogu OSNUTKA 1: temno steklo, sij, pikčasta mreža,
   polmesec iz znaka, dvigajoči se mehurčki; cena na terapijo kot merilnik, prihranek, oznaki paketov 10 in 30.
   Vsebina (storitve, cene, opombe, datum) je prevzeta iz obstoječega cenika.
   Slogi so omejeni na #ck (okno) in veljajo za vse širine (namizje od 1024 px, tablica, telefon kot spodnji list).
   Animacije imajo predpono ck. */
#ck{--ck-abyss:#040B16;--ck-deep:#071628;--ck-deep2:#0B2038;--ck-on:#E8F0F8;--ck-on2:rgba(232,240,248,.78);--ck-on3:rgba(232,240,248,.58);
  --ck-oxy:#1E6FD9;--ck-oxy-h:#1762C9;--ck-sky:#38B6FF;--ck-cyan:#7FDBFF;--ck-aqua:#A9E9FF;--ck-teal:#5EF2C9;--ck-teal2:#1CAE8F;
  --ck-rule:rgba(127,219,255,.14);--ck-ease:cubic-bezier(.16,1,.3,1);
  --ck-d:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --ck-s:'Instrument Sans','Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
@property --ck-a{syntax:'<angle>';inherits:false;initial-value:0deg}
dialog.ck{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;overflow:hidden;color:var(--ck-on);font-family:var(--ck-s)}
dialog.ck::backdrop{background:rgba(2,8,18,.66);-webkit-backdrop-filter:blur(6px) saturate(120%);backdrop-filter:blur(6px) saturate(120%)}
dialog.ck[open]::backdrop{animation:ckFade .35s ease both}
dialog.ck.is-closing::backdrop{animation:ckFade .26s ease reverse both}
#ck *,#ck *::before,#ck *::after{box-sizing:border-box}
#ck p,#ck h2,#ck h3,#ck ul{margin:0;padding:0}
#ck ul{list-style:none}
#ck button,#ck a{font:inherit;color:inherit}
#ck .ico{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#ck .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#ck :focus-visible{outline:3px solid var(--ck-sky);outline-offset:3px}
#ck .ck-wrap{display:grid;place-items:center;width:100%;height:100%;padding:28px}
#ck .ck-card{position:relative;isolation:isolate;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(1000px,100%);max-height:calc(100dvh - 56px);overflow:hidden;border-radius:32px;
  background:radial-gradient(70% 40% at 12% 0%,rgba(56,182,255,.16) 0%,rgba(56,182,255,0) 70%),linear-gradient(180deg,#0B2240 0%,#081A31 34%,#061428 70%,#050F1F 100%);
  border:1px solid rgba(127,219,255,.16);box-shadow:0 60px 120px -40px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.08)}
#ck.is-in .ck-card{animation:ckIn .55s var(--ck-ease) both}
#ck.is-closing .ck-card{animation:ckOut .26s ease both}
@keyframes ckIn{from{opacity:0;transform:translateY(22px) scale(.965)}to{opacity:1;transform:none}}
@keyframes ckOut{to{opacity:0;transform:translateY(12px) scale(.98)}}
@keyframes ckFade{from{opacity:0}to{opacity:1}}

/* ---------- ozadje ---------- */
#ck .ck-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;border-radius:inherit}
#ck .ck-glow{position:absolute;border-radius:50%}
#ck .ck-g1{width:760px;height:760px;left:-300px;top:-360px;background:radial-gradient(closest-side,rgba(56,182,255,.16),rgba(56,182,255,0))}
#ck .ck-g2{width:820px;height:820px;right:-360px;bottom:-380px;background:radial-gradient(closest-side,rgba(30,111,217,.2),rgba(30,111,217,0))}
#ck .ck-grid{position:absolute;inset:0;opacity:.5;background-image:radial-gradient(rgba(127,219,255,.16) 1px,rgba(127,219,255,0) 1.6px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(46% 24% at 22% 6%,#000 0%,rgba(0,0,0,.35) 52%,rgba(0,0,0,0) 85%);mask-image:radial-gradient(46% 24% at 22% 6%,#000 0%,rgba(0,0,0,.35) 52%,rgba(0,0,0,0) 85%)}
#ck .ck-wm{position:absolute;right:-150px;top:90px;height:620px;width:auto;opacity:.16;
  -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 40%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(270deg,#000 0%,#000 40%,rgba(0,0,0,0) 100%)}
#ck .ck-bub{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%);mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%)}
#ck .ck-bub i{position:absolute;bottom:-24px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:ckRise var(--t) linear var(--dl) infinite,ckSway calc(var(--t) / 5) ease-in-out var(--dl) infinite alternate;animation-play-state:paused}
#ck[open] .ck-bub i{animation-play-state:running}
#ck .ck-bub i:nth-child(1){--x:4%;--s:8px;--t:22s;--dl:-4s}
#ck .ck-bub i:nth-child(2){--x:13%;--s:5px;--t:18s;--dl:-11s}
#ck .ck-bub i:nth-child(3){--x:27%;--s:11px;--t:26s;--dl:-7s}
#ck .ck-bub i:nth-child(4){--x:41%;--s:4px;--t:17s;--dl:-15s}
#ck .ck-bub i:nth-child(5){--x:55%;--s:9px;--t:24s;--dl:-2s}
#ck .ck-bub i:nth-child(6){--x:66%;--s:6px;--t:20s;--dl:-13s}
#ck .ck-bub i:nth-child(7){--x:76%;--s:13px;--t:29s;--dl:-9s}
#ck .ck-bub i:nth-child(8){--x:85%;--s:5px;--t:19s;--dl:-17s}
#ck .ck-bub i:nth-child(9){--x:92%;--s:9px;--t:25s;--dl:-5s}
#ck .ck-bub i:nth-child(10){--x:97%;--s:4px;--t:16s;--dl:-10s}
@keyframes ckRise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}6%{opacity:.75}100%{transform:translate3d(0,-1100px,0) scale(1.1);opacity:.35}}
@keyframes ckSway{from{translate:-7px 0}to{translate:7px 0}}

/* ---------- glava ---------- */
#ck .ck-head{position:relative;z-index:2;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:26px;padding:26px 30px 22px 36px;transition:box-shadow .3s,background-color .3s}
#ck .ck-head::after{content:"";position:absolute;left:36px;right:36px;bottom:0;height:1px;background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.26) 30%,rgba(127,219,255,.26) 70%,rgba(127,219,255,0))}
#ck .ck-card.is-scrolled .ck-head{background:rgba(6,18,36,.72);box-shadow:0 18px 30px -24px rgba(0,0,0,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
#ck .ck-grip{display:none}
#ck .ck-logo{display:block;width:auto;height:66px;filter:drop-shadow(0 0 14px rgba(127,219,255,.35))}
#ck .ck-titles{display:flex;flex-direction:column;gap:6px;min-width:0;padding-left:26px;border-left:1px solid var(--ck-rule)}
#ck .ck-eyebrow{display:inline-flex;align-items:center;gap:11px;font:600 12px/1.3 var(--ck-s);letter-spacing:.2em;text-transform:uppercase;color:var(--ck-cyan)}
#ck .ck-eyebrow::before{content:"";flex:0 0 auto;width:7px;height:7px;border-radius:50%;border:1.5px solid currentColor;box-shadow:6px -5px 0 -2px currentColor}
#ck h2{font:300 clamp(30px,2.2vw + 6px,40px)/1.05 var(--ck-d);letter-spacing:-.02em;color:#fff;outline:0}
#ck h2:focus,#ck h2:focus-visible{outline:none}
#ck .ck-em{font-weight:600;background:linear-gradient(100deg,#A9E9FF 0%,#38B6FF 60%,#7FDBFF 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
#ck .ck-sub{font-size:15px;line-height:1.45;color:var(--ck-on3)}
#ck .ck-valid{display:inline-flex;align-items:center;gap:9px;min-height:36px;padding:0 15px;border-radius:999px;font:600 13px/1 var(--ck-s);color:var(--ck-on);white-space:nowrap;
  background:rgba(94,242,201,.08);border:1px solid rgba(94,242,201,.28)}
#ck .ck-valid i{width:8px;height:8px;border-radius:50%;background:var(--ck-teal);box-shadow:0 0 0 0 rgba(94,242,201,.6);animation:ckPing 2.4s ease-out infinite}
@keyframes ckPing{70%{box-shadow:0 0 0 8px rgba(94,242,201,0)}100%{box-shadow:0 0 0 0 rgba(94,242,201,0)}}
#ck .ck-x{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);cursor:pointer;transition:background-color .2s,transform .3s var(--ck-ease),border-color .2s}
#ck .ck-x:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3);transform:rotate(90deg)}

/* ---------- vsebina ---------- */
#ck .ck-body{position:relative;z-index:1;overflow:auto;overscroll-behavior:contain;padding:22px 36px 26px;scrollbar-width:thin;scrollbar-color:rgba(127,219,255,.3) transparent;outline:0}
#ck .ck-body::-webkit-scrollbar{width:8px}
#ck .ck-body::-webkit-scrollbar-thumb{background:rgba(127,219,255,.25);border-radius:8px}
#ck .ck-perks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:24px}
#ck .ck-perks li{display:flex;align-items:center;gap:12px;padding:9px 14px 9px 10px;border-radius:16px;font-size:14px;line-height:1.35;color:var(--ck-on2);
  background:rgba(255,255,255,.035);border:1px solid rgba(127,219,255,.1)}
#ck .ck-pi{position:relative;display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:13px;color:#fff;overflow:hidden;
  background:linear-gradient(150deg,#4FB4FF 0%,#1E6FD9 55%,#0F3E86 100%);box-shadow:0 10px 20px -10px rgba(30,111,217,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -8px 14px -8px rgba(4,11,22,.55)}
#ck .ck-pi::before{content:"";position:absolute;left:12%;right:12%;top:5%;height:42%;border-radius:50% 50% 45% 45%/70% 70% 30% 30%;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,0))}
#ck .ck-pi .ico{position:relative;width:19px;height:19px;stroke-width:2.2}
#ck .ck-pi-teal{background:linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%);box-shadow:0 10px 20px -10px rgba(28,174,143,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -8px 14px -8px rgba(4,30,26,.55)}

#ck .ck-grp + .ck-grp{margin-top:28px}
#ck .ck-gt{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin-bottom:14px;font:600 13px/1.3 var(--ck-s);letter-spacing:.16em;text-transform:uppercase;color:var(--ck-on)}
#ck .ck-gt small{font-weight:500;font-size:13px;letter-spacing:0;text-transform:none;color:var(--ck-on3)}
#ck .ck-gn{font:600 12px/1 var(--ck-d);letter-spacing:.06em;color:var(--ck-cyan);padding:5px 8px;border-radius:8px;background:rgba(127,219,255,.08);border:1px solid rgba(127,219,255,.2)}
#ck .ck-list{display:flex;flex-direction:column;gap:10px}
#ck .ck-colh,#ck .ck-row{display:grid;grid-template-columns:minmax(0,1fr) 168px 132px 96px;align-items:center;gap:22px}
#ck .ck-colh{margin:0 0 8px;padding:0 16px 0 24px;font:600 10.5px/1.2 var(--ck-s);letter-spacing:.14em;text-transform:uppercase;color:var(--ck-on3)}
#ck .ck-colh span:nth-child(3){text-align:right}
#ck .ck-row{position:relative;padding:14px 16px 14px 24px;border-radius:20px;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));border:1px solid rgba(127,219,255,.1);
  transition:transform .35s var(--ck-ease),background-color .3s,border-color .3s,box-shadow .35s var(--ck-ease)}
#ck .ck-row:hover{transform:translateY(-2px);border-color:rgba(127,219,255,.26);background-color:rgba(127,219,255,.04);box-shadow:0 22px 40px -28px rgba(0,0,0,.95)}
#ck.is-in .ck-row{animation:ckRow .6s var(--ck-ease) calc(140ms + var(--i,0) * 60ms) both}
@keyframes ckRow{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
#ck .ck-name{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
#ck .ck-name b{font:600 19px/1.25 var(--ck-d);letter-spacing:-.01em;color:#fff}
#ck .ck-pkg .ck-name b{font-size:21px}
#ck .ck-name small{font-size:14px;line-height:1.4;color:var(--ck-on3)}
#ck .ck-name small.ck-teal{color:var(--ck-teal);font-weight:600;font-size:13px}
#ck .ck-inc{display:inline-flex;align-items:flex-start;gap:7px;margin-top:4px;font-size:13.5px;line-height:1.4;color:var(--ck-on2)}
#ck .ck-inc .ico{width:16px;height:16px;margin-top:1px;color:var(--ck-teal);stroke-width:2.6}
#ck .ck-badge{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;margin-bottom:5px;padding:5px 11px 5px 9px;border-radius:999px;font:700 11.5px/1 var(--ck-s);letter-spacing:.06em;text-transform:uppercase;color:#fff;
  background:linear-gradient(135deg,#38B6FF,#1E6FD9);box-shadow:0 8px 20px -8px rgba(56,182,255,.9),inset 0 1px 0 rgba(255,255,255,.35)}
#ck .ck-badge .ico{width:13px;height:13px;fill:currentColor;stroke:none}
#ck .ck-badge-teal{color:#03221D;background:linear-gradient(135deg,#8DF2D8,#5EF2C9);box-shadow:0 8px 20px -8px rgba(94,242,201,.8),inset 0 1px 0 rgba(255,255,255,.5)}
#ck .ck-badge-teal .ico{fill:none;stroke:currentColor;stroke-width:3}

/* cena na terapijo: merilnik */
#ck .ck-per{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
#ck .ck-per-l{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;font:600 11px/1.2 var(--ck-s);letter-spacing:.12em;text-transform:uppercase;color:var(--ck-on3)}
#ck .ck-per-v{display:inline-flex;align-items:center;gap:8px;font:600 16px/1 var(--ck-d);color:#fff;white-space:nowrap}
#ck .ck-per-v em{font:700 11.5px/1 var(--ck-s);font-style:normal;padding:4px 7px;border-radius:7px;color:var(--ck-aqua);background:rgba(56,182,255,.14);border:1px solid rgba(56,182,255,.28)}
#ck .ck-bar{align-self:stretch;position:relative;height:7px;border-radius:7px;background:rgba(255,255,255,.07);overflow:hidden}
#ck .ck-bar i{position:absolute;inset:0 auto 0 0;width:calc(var(--pt,100) * 1%);border-radius:inherit;background:linear-gradient(90deg,#1E6FD9,#38B6FF 60%,#A9E9FF);box-shadow:0 0 12px rgba(56,182,255,.55);transform-origin:0 50%}
#ck .ck-row:not(.ck-pkg) .ck-bar i{background:linear-gradient(90deg,rgba(255,255,255,.25),rgba(255,255,255,.45));box-shadow:none}
#ck.is-in .ck-bar i{animation:ckBar 1.1s var(--ck-ease) calc(380ms + var(--i,0) * 90ms) both}
@keyframes ckBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
#ck .ck-bar i::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-40%;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.55),rgba(255,255,255,0))}
#ck.is-in .ck-pkg .ck-bar i::after{animation:ckShine 3.6s ease-in-out calc(1.6s + var(--i,0) * .35s) infinite}
@keyframes ckShine{0%{left:-40%}45%,100%{left:110%}}

/* cena */
#ck .ck-price{display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right}
#ck .ck-price b{font:300 30px/1 var(--ck-d);letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}
#ck .ck-price small{display:inline-flex;padding:4px 9px;border-radius:999px;font:700 12px/1 var(--ck-s);color:#063B31;background:linear-gradient(135deg,#8DF2D8,#5EF2C9);white-space:nowrap}
#ck .ck-buy{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(127,219,255,.35);background:rgba(127,219,255,.06);
  font:600 14.5px/1 var(--ck-s);color:#fff;cursor:pointer;transition:background-color .25s,border-color .25s,transform .3s var(--ck-ease),box-shadow .3s}
#ck .ck-buy .ico{width:17px;height:17px}
#ck .ck-buy:hover{background:var(--ck-oxy);border-color:var(--ck-oxy);transform:translateY(-1px);box-shadow:0 12px 24px -12px rgba(30,111,217,.9)}

/* Paket 10: modro steklo s krožečo obrobo */
#ck .ck-row.is-pop{background:linear-gradient(160deg,rgba(30,111,217,.32) 0%,rgba(16,56,110,.28) 55%,rgba(10,32,62,.4) 100%);border-color:transparent;box-shadow:0 28px 50px -30px rgba(30,111,217,.75)}
#ck .ck-row.is-pop::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--ck-a),rgba(169,233,255,.15) 0deg,rgba(169,233,255,.95) 50deg,rgba(56,182,255,.35) 110deg,rgba(169,233,255,.15) 180deg,rgba(169,233,255,.15) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:ckBorder 6s linear infinite}
#ck .ck-row.is-pop .ck-buy{background:var(--ck-oxy);border-color:var(--ck-oxy);box-shadow:0 12px 24px -12px rgba(30,111,217,.9)}
#ck .ck-row.is-pop .ck-buy:hover{background:var(--ck-oxy-h)}
@keyframes ckBorder{to{--ck-a:360deg}}
/* Paket 30: turkizni poudarek */
#ck .ck-row.is-best{background:linear-gradient(160deg,rgba(94,242,201,.09) 0%,rgba(255,255,255,.025) 60%);border-color:rgba(94,242,201,.3)}
#ck .ck-row.is-best .ck-per-v em{color:#063B31;background:linear-gradient(135deg,#8DF2D8,#5EF2C9);border-color:transparent}
#ck .ck-row.is-best .ck-bar i{background:linear-gradient(90deg,#1CAE8F,#5EF2C9 70%,#C8FFF0);box-shadow:0 0 12px rgba(94,242,201,.55)}
#ck .ck-foot-note{margin-top:10px;font-size:12.5px;line-height:1.5;color:var(--ck-on3)}

/* posamezne storitve: vodilna pikčasta črta */
#ck .ck-row.ck-s{grid-template-columns:auto minmax(40px,1fr) auto;gap:18px;padding-block:16px}
#ck .ck-lead{align-self:center;height:2px;margin-top:6px;background-image:radial-gradient(circle,rgba(127,219,255,.5) 1px,rgba(127,219,255,0) 1.4px);background-size:7px 2px;background-repeat:repeat-x;background-position:0 50%;transform-origin:0 50%}
#ck.is-in .ck-lead{animation:ckBar .9s var(--ck-ease) calc(400ms + var(--i,0) * 80ms) both}
#ck .ck-s .ck-price b{font-size:26px}

/* opombe */
#ck .ck-legal{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:20px;margin-top:26px;padding-top:18px;border-top:1px solid var(--ck-rule)}
#ck .ck-legal ul{display:flex;flex-direction:column;gap:4px}
#ck .ck-legal li{position:relative;padding-left:14px;font-size:12.5px;line-height:1.5;color:var(--ck-on3)}
#ck .ck-legal li::before{content:"";position:absolute;left:0;top:.62em;width:4px;height:4px;border-radius:50%;background:rgba(127,219,255,.6)}
#ck .ck-date{font-size:12.5px;color:var(--ck-on3);white-space:nowrap}

/* ---------- noga okna ---------- */
#ck .ck-actions{position:relative;z-index:2;display:flex;align-items:center;gap:12px;padding:16px 30px 20px 36px;background:linear-gradient(180deg,rgba(5,15,31,.55),rgba(5,15,31,.92));border-top:1px solid var(--ck-rule);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
#ck .ck-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:52px;padding:0 24px;border-radius:999px;border:0;font:600 15.5px/1 var(--ck-s);cursor:pointer;white-space:nowrap;transition:background-color .25s,transform .3s var(--ck-ease),box-shadow .3s,border-color .25s}
#ck .ck-btn .ico{width:18px;height:18px}
#ck .ck-btn-p{background:var(--ck-oxy);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 14px 30px -14px rgba(30,111,217,.85)}
#ck .ck-btn-p:hover{background:var(--ck-oxy-h);transform:translateY(-2px)}
#ck .ck-btn-o{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.5)}
#ck .ck-btn-o:hover{background:#fff;color:#0A1A2E;border-color:#fff}
#ck .ck-lp{display:flex;align-items:center;gap:12px;flex:1 1 auto;min-width:0;min-height:52px;padding:6px 14px 6px 7px;border-radius:999px;text-decoration:none;background:rgba(255,255,255,.04);border:1px solid rgba(94,242,201,.22);transition:background-color .25s,border-color .25s}
#ck .ck-lp > span:not(.ck-pi){display:flex;flex-direction:column;gap:2px;min-width:0}
#ck .ck-lp b{font:600 14.5px/1.2 var(--ck-s);color:#fff}
#ck .ck-lp small{font-size:12.5px;line-height:1.3;color:var(--ck-on3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ck .ck-lp .ck-arr{margin-left:auto;width:18px;height:18px;color:var(--ck-teal);transition:transform .3s var(--ck-ease)}
#ck .ck-lp:hover{background:rgba(94,242,201,.08);border-color:rgba(94,242,201,.45)}
#ck .ck-lp:hover .ck-arr{transform:translateX(4px)}
#ck .ck-lp .ck-pi{width:38px;height:38px;border-radius:50%}
#ck .ck-print{display:inline-flex;align-items:center;gap:8px;min-height:52px;padding:0 6px;border:0;background:none;font:600 14px/1 var(--ck-s);color:var(--ck-on2);cursor:pointer}
#ck .ck-print:hover{color:#fff}
#ck .ck-print .ico{width:19px;height:19px}

/* ---------- tablica ---------- */
@media screen and (max-width:1023.98px){
  #ck .ck-colh,#ck .ck-row{grid-template-columns:minmax(0,1fr) 150px 120px 92px;gap:16px}
  #ck .ck-lp small{display:none}
}
/* ---------- telefon: spodnji list ---------- */
@media screen and (max-width:767.98px){
  #ck .ck-wrap{place-items:end center;padding:0}
  #ck .ck-card{width:100%;max-height:calc(100dvh - 18px);border-radius:26px 26px 0 0;border-bottom:0}
  #ck.is-in .ck-card{animation:ckUp .45s var(--ck-ease) both}
  #ck.is-closing .ck-card{animation:ckDown .26s ease both}
  @keyframes ckUp{from{transform:translateY(40%);opacity:.4}to{transform:none;opacity:1}}
  @keyframes ckDown{to{transform:translateY(30%);opacity:0}}
  #ck .ck-head{grid-template-columns:minmax(0,1fr) auto;gap:10px 14px;padding:22px 16px 16px 20px}
  #ck .ck-head::after{left:20px;right:20px}
  #ck .ck-grip{display:block;position:absolute;top:8px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:4px;background:rgba(255,255,255,.25)}
  #ck .ck-logo{display:none}
  #ck .ck-titles{padding-left:0;border-left:0}
  #ck h2{font-size:30px}
  #ck .ck-valid{grid-column:1;grid-row:2;justify-self:start;min-height:30px;font-size:12px}
  #ck .ck-x{grid-column:2;grid-row:1;width:42px;height:42px;align-self:start}
  #ck .ck-body{padding:18px 16px 20px}
  #ck .ck-perks{grid-template-columns:1fr;gap:8px;margin-bottom:20px}
  #ck .ck-perks li{padding:9px 12px;font-size:13.5px}
  #ck .ck-perks .ck-pi{width:32px;height:32px;border-radius:11px}
  #ck .ck-colh{display:none}
  #ck .ck-per-l{position:static;width:auto;height:auto;overflow:visible;clip:auto}
  #ck .ck-row{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name price" "per buy";gap:14px 14px;padding:16px}
  #ck .ck-row .ck-name{grid-area:name}
  #ck .ck-row .ck-price{grid-area:price;align-self:start}
  #ck .ck-row .ck-per{grid-area:per;align-self:center}
  #ck .ck-row .ck-buy{grid-area:buy}
  #ck .ck-row.ck-s{grid-template-areas:none;grid-template-columns:minmax(0,1fr) auto;padding:14px 16px}
  #ck .ck-row.ck-s .ck-lead{display:none}
  #ck .ck-row.ck-s .ck-name,#ck .ck-row.ck-s .ck-price{grid-area:auto}
  #ck .ck-name b,#ck .ck-pkg .ck-name b{font-size:18px}
  #ck .ck-badge{font-size:10.5px;letter-spacing:.04em}
  #ck .ck-price b{font-size:26px}
  #ck .ck-legal{grid-template-columns:1fr;gap:10px}
  #ck .ck-actions{flex-wrap:wrap;gap:8px;padding:12px 16px calc(14px + env(safe-area-inset-bottom,0px))}
  #ck .ck-btn{flex:1 1 calc(50% - 4px);min-height:48px;padding:0 14px;font-size:15px}
  #ck .ck-lp{order:3;flex:1 1 100%;min-height:46px}
  #ck .ck-print{display:none}
}

/* ---------- zmanjšano gibanje ---------- */
@media (prefers-reduced-motion:reduce){
  #ck *,#ck *::before,#ck *::after,dialog.ck::backdrop{animation:none!important;transition:none!important}
  #ck .ck-bub{display:none}
}

/* ---------- tisk: samo cenik, svetla različica ---------- */
@media print{
  html.ck-printing,html.ck-printing body{background:#fff!important;overflow:visible!important}
  html.ck-printing body > *:not(dialog#ck){display:none!important}
  html.ck-printing dialog#ck{position:static!important;display:block!important;width:auto!important;height:auto!important;overflow:visible!important;color:#0A1A2E!important}
  html.ck-printing dialog#ck::backdrop{display:none}
  html.ck-printing #ck .ck-wrap{display:block;padding:0;height:auto}
  html.ck-printing #ck .ck-card{display:block;max-height:none;overflow:visible;width:100%;border:0;border-radius:0;box-shadow:none;background:#fff!important;animation:none!important}
  html.ck-printing #ck .ck-bg,html.ck-printing #ck .ck-x,html.ck-printing #ck .ck-actions,html.ck-printing #ck .ck-buy,html.ck-printing #ck .ck-perks,html.ck-printing #ck .ck-foot-note,html.ck-printing #ck .ck-grip{display:none!important}
  html.ck-printing #ck *{animation:none!important;transition:none!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  html.ck-printing #ck .ck-head{display:flex;align-items:center;gap:24px;padding:0 0 16px;background:none!important;box-shadow:none!important}
  html.ck-printing #ck .ck-head::after{left:0;right:0;background:#C9D6E4}
  html.ck-printing #ck .ck-logo{filter:invert(32%) sepia(77%) saturate(1750%) hue-rotate(198deg) brightness(88%)}
  html.ck-printing #ck .ck-titles{border-left-color:#C9D6E4}
  html.ck-printing #ck h2,html.ck-printing #ck .ck-name b,html.ck-printing #ck .ck-price b,html.ck-printing #ck .ck-per-v,html.ck-printing #ck .ck-gt{color:#0A1A2E}
  html.ck-printing #ck .ck-em{color:#1E6FD9;background:none}
  html.ck-printing #ck .ck-eyebrow,html.ck-printing #ck .ck-gn{color:#1658B0}
  html.ck-printing #ck .ck-sub,html.ck-printing #ck .ck-name small,html.ck-printing #ck .ck-inc,html.ck-printing #ck .ck-per-l,html.ck-printing #ck .ck-legal li,html.ck-printing #ck .ck-date,html.ck-printing #ck .ck-gt small{color:#4A5866}
  html.ck-printing #ck .ck-valid{color:#0F6E68;background:#E3F2F0;border-color:#BFE3DC}
  html.ck-printing #ck .ck-body{overflow:visible;padding:18px 0 0}
  html.ck-printing #ck .ck-row{padding:12px 16px}
  html.ck-printing #ck .ck-price small{color:#063B31}
  @page{margin:14mm}
  html.ck-printing #ck .ck-colh{grid-template-columns:minmax(0,1fr) 150px 120px;color:#6B7A88}
  html.ck-printing #ck .ck-gt{break-after:avoid;page-break-after:avoid}
  html.ck-printing #ck .ck-grp + .ck-grp{break-inside:avoid}
  html.ck-printing #ck .ck-colh span:last-child{display:none}
  html.ck-printing #ck .ck-row{grid-template-columns:minmax(0,1fr) 150px 120px;break-inside:avoid;background:#F5F8FB!important;border:1px solid #DCE4EE;box-shadow:none;transform:none}
  html.ck-printing #ck .ck-row::before{display:none}
  html.ck-printing #ck .ck-row.ck-s{grid-template-columns:auto 1fr auto}
  html.ck-printing #ck .ck-bar{background:#E3EAF2}
  html.ck-printing #ck .ck-lead{background-image:radial-gradient(circle,#8BA3BC 1px,rgba(0,0,0,0) 1.4px)}
  html.ck-printing #ck .ck-per-v em{color:#1658B0;background:#E8F0F9;border-color:#C9DBF2}
}


/* ===== 23. Pojavno okno – spletni nakup (Verzija 2) ===== */
/* 23. Pojavno okno – spletni nakup – Verzija 2 (23. 10. 2026): kopija Verzije 1 +
   – okno večje in enako kot okno brezplačnega posveta (16, Verzija 5): širina 1060 → 1080 px (levi del 400 → 420 px, desni ostane ≈ 660 px, da se besedila paketov ne lomijo),
     ozadje levega dela kot pri posvetu (sij zgoraj desno, krožne črte spodaj desno);
   – krog (okno komore) 250 → do 360 px, z jeklenim obročem in 16 vijaki kot na naslovnici in v oknu posveta (SVG .nk-ring);
     fotografija v krogu, steklen odsev, moder sij za krogom;
   – brez drsenja na namizju: skripta okno po potrebi sorazmerno pomanjša (zoom), na nižjih zaslonih najprej tesnejši razmiki.
   Velja samo od 1024 px (namizje). Telefon in tablica ostaneta nespremenjena (levi del je tam skrit). */
@media (min-width:1024px){
  .sheet.nakup{width:min(1080px, calc(100% - 48px));max-height:calc(100dvh - 48px)}
  .nakup .sheet-inner{grid-template-columns:minmax(0,420px) minmax(0,1fr);grid-template-rows:minmax(0,1fr);max-height:calc(100dvh - 48px);border-radius:28px;box-shadow:0 40px 90px -30px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.06)}
  .nakup .sheet-main{max-height:calc(100dvh - 48px)}
  /* levi del – kot pri posvetu */
  .nakup .sheet-aside{justify-content:center;gap:18px;padding:34px 30px 30px;isolation:isolate;
    background:radial-gradient(520px 360px at 85% 0%,rgba(56,182,255,.34),transparent 60%),linear-gradient(165deg,#0F3560 0%,#0A2340 55%,#071A2E 100%)}
  .nakup .sheet-aside::after{content:"";position:absolute;right:-140px;bottom:-160px;z-index:-1;width:420px;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,rgba(127,219,255,.12) 0 1px,transparent 1px 22px);pointer-events:none}
  /* okno komore z jeklenim obročem (kot naslovnica / posvet V5) */
  .nakup .nk-port{--pz:min(360px,100%,max(170px,calc(100vh - 420px)));position:relative;flex:none;width:var(--pz);aspect-ratio:1;margin:6px auto 8px;border-radius:50%}
  .nakup .nk-port::before{content:"";position:absolute;inset:-16%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(30,111,217,.42) 0%,rgba(30,111,217,.14) 55%,rgba(30,111,217,0) 100%);pointer-events:none}
  .nakup .nk-port picture{display:contents}
  .nakup .sheet-aside .nk-port img{position:absolute;left:8.5%;top:8.5%;display:block;width:83%;height:83%;margin:0;border:0;border-radius:50%;object-fit:cover;box-shadow:none;filter:saturate(1.05)}
  .nakup .nk-glass{position:absolute;inset:8.5%;border-radius:50%;pointer-events:none;background:radial-gradient(110% 110% at 28% 16%,rgba(255,255,255,.17) 0%,rgba(255,255,255,0) 34%),radial-gradient(closest-side,rgba(4,11,22,0) 70%,rgba(4,11,22,.5) 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),inset 0 -18px 40px rgba(4,11,22,.45)}
  .nakup .nk-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;filter:drop-shadow(0 16px 30px rgba(0,0,0,.55))}
  .nakup .sheet-aside .eyebrow{margin-top:8px}
  .nakup .sheet-aside p.big{margin-top:-6px}
}
@media (min-width:1024px) and (max-height:760px){
  .nakup .sheet-aside{gap:14px;padding-top:26px}
}
/* Prilagoditev višini zaslona – skripta doda .nk-fit in okno sorazmerno pomanjša (zoom), da se vidi v celoti brez drsenja.
   .nk-measure = merjenje naravne višine; .nk-compact = malo tesnejši razmiki (če bi bilo pomanjšanje večje od 3 %). */
@media (min-width:1024px){
  .nakup.nk-measure,.nakup.nk-measure .sheet-inner,.nakup.nk-measure .sheet-main,
  .nakup.nk-fit .sheet-inner,.nakup.nk-fit .sheet-main{max-height:none!important}
  .nakup.nk-fit .sheet-main{overflow:visible}
  .nakup.nk-fit .nk-port{--pz:min(360px,100%)}
  .nakup.nk-compact .sheet-aside{gap:14px;padding-top:24px;padding-bottom:22px}
  .nakup.nk-compact .sheet-main{gap:10px;padding-top:22px;padding-bottom:12px}
  .nakup.nk-compact .x-btn{flex-basis:40px;width:40px;height:40px}
  .nakup.nk-compact .nk-opts{gap:12px 10px}
  .nakup.nk-compact .nk-opt{min-height:52px;padding-top:8px;padding-bottom:8px}
  .nakup.nk-compact .nk-sum{padding:12px 16px}
  .nakup.nk-compact .nk-sum-top{padding-bottom:8px;margin-bottom:8px}
  .nakup.nk-compact .nk-sum-list{gap:5px}
  .nakup.nk-compact .nk-after{margin-top:9px;padding:9px 12px}
  .nakup.nk-compact .nk-go{min-height:50px}
  .nakup.nk-compact .nk-link{min-height:36px}
}


/* ===== 18. Podstran – Plačilo na obroke (Leanpay) (Verzija 2) ===== */
/* 18. Podstran – Plačilo na obroke z Leanpay – Verzija 2 (23. 10. 2026) – nadgradnja V1 z logotipom in slikami Leanpay
   (V1 ostaja nespremenjena). Dodatki V2 so na koncu datoteke (razdelek »V2«).
   ---- izvirni opis V1 (21. 10. 2026):
   Prenova obstoječe podstrani oxysphere.si/placilo-na-obroke-z-leanpay/ v slogu OSNUTKA 1 (temno nadaljevanje,
   sij, pikčasta mreža, polmesec iz znaka, mehurčki, stekle kartice, animirane ikone).
   Uvod z merilnikom »do 84 obrokov«, prednosti, koraki s telefonom (zaslon sledi koraku), pogoji, video ob kliku,
   »Preveri svoj limit«, povezave Leanpay, sklepni poziv. Brez zneskov obrokov (odločitev 25. 9. 2026).
   Slogi so omejeni na .l18 (vsebina podstrani). Namizje od 1024 px, pod tem ena kolona. Animacije s predpono l18. */
.l18{--l-abyss:#040B16;--l-deep:#071628;--l-on:#E8F0F8;--l-on2:rgba(232,240,248,.8);--l-on3:rgba(232,240,248,.6);
  --l-oxy:#1E6FD9;--l-sky:#38B6FF;--l-cyan:#7FDBFF;--l-aqua:#A9E9FF;--l-teal:#5EF2C9;--l-rule:rgba(127,219,255,.14);--l-ease:cubic-bezier(.16,1,.3,1);
  --l-d:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;--l-s:'Instrument Sans','Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  position:relative;background:#050F1F;color:var(--l-on);font-family:var(--l-s);overflow:hidden}
.l18 *,.l18 *::before,.l18 *::after{box-sizing:border-box}
.l18 :where(h1,h2,h3,p,ul,ol,figure){margin:0;padding:0}
.l18 :where(ul,ol){list-style:none}
.l18 .ico{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.l18 :focus-visible{outline:3px solid var(--l-sky);outline-offset:3px}
.l18 .wrap{position:relative;z-index:1}

/* ---------- skupno ---------- */
.l18-eyebrow{display:inline-flex;align-items:center;gap:12px;font:600 12.5px/1.3 var(--l-s);letter-spacing:.2em;text-transform:uppercase;color:var(--l-cyan)}
.l18-eyebrow::before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;box-shadow:7px -6px 0 -2.5px currentColor}
.l18-h2{font:300 clamp(36px,2.1vw + 14px,62px)/1.04 var(--l-d);letter-spacing:-.022em;color:#fff;text-wrap:balance}
.l18-em{font-weight:500;background:linear-gradient(100deg,#A9E9FF 0%,#38B6FF 70%,#7FDBFF 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.l18-head{display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:760px}
.l18-head-c{align-items:center;text-align:center;margin-inline:auto}
.l18-sub{font-size:clamp(17px,.3vw + 14px,19px);line-height:1.6;color:var(--l-on2);max-width:36em}
.l18-sec{position:relative;padding-block:clamp(88px,6vw + 28px,150px)}
.l18-sec::before{content:"";position:absolute;z-index:1;top:0;left:50%;width:min(1100px,80%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.2) 50%,rgba(127,219,255,0))}
.l18-btn-line{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:58px;padding:0 28px;border-radius:999px;border:1.5px solid rgba(255,255,255,.42);background:rgba(255,255,255,.03);color:#fff;
  font:600 16px/1.2 var(--l-s);cursor:pointer;white-space:nowrap;transition:background-color .25s,border-color .25s,color .25s,transform .3s var(--l-ease)}
.l18-btn-line .ico{width:19px;height:19px}
.l18-btn-line:hover{background:#fff;color:#0A1A2E;border-color:#fff;transform:translateY(-2px)}
.l18 .btn{white-space:nowrap}

/* animirane ploščice (ikone) */
.l18-tile{position:relative;display:grid;place-items:center;flex:none;width:58px;height:58px;border-radius:19px;overflow:hidden;isolation:isolate;
  background:linear-gradient(150deg,#4FB4FF 0%,#1E6FD9 55%,#0F3E86 100%);box-shadow:0 12px 26px -12px rgba(30,111,217,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,11,22,.55)}
.l18-tile-teal{background:linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%);box-shadow:0 12px 26px -12px rgba(28,174,143,.9),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -10px 18px -10px rgba(4,30,26,.55)}
.l18-tile::before{content:"";position:absolute;left:12%;right:12%;top:5%;height:42%;border-radius:50% 50% 45% 45%/70% 70% 30% 30%;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,0));z-index:-1}
.l18-tile svg{width:32px;height:32px;overflow:visible;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.l18-tile-sm{width:44px;height:44px;border-radius:14px}
.l18-tile-sm svg{width:24px;height:24px;stroke-width:2}

/* ---------- 1. uvod ---------- */
.l18-hero{position:relative;display:flex;align-items:center;min-height:clamp(700px,94svh,940px);padding-top:calc(var(--hh,100px) + 40px);padding-bottom:72px;
  background:radial-gradient(70% 60% at 10% 0%,rgba(56,182,255,.12) 0%,rgba(56,182,255,0) 60%),linear-gradient(180deg,#071A30 0%,#050F1F 100%)}
.l18-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.l18-glow{position:absolute;border-radius:50%}
.l18-g1{width:900px;height:900px;right:-200px;top:-140px;background:radial-gradient(closest-side,rgba(30,111,217,.24),rgba(30,111,217,0))}
.l18-g2{width:700px;height:700px;left:-260px;bottom:-320px;background:radial-gradient(closest-side,rgba(94,242,201,.08),rgba(94,242,201,0))}
.l18-grid{position:absolute;inset:0;opacity:.5;background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(40% 40% at 22% 40%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(40% 40% at 22% 40%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
.l18-wm{position:absolute;left:-180px;top:12%;height:min(820px,82%);width:auto;opacity:.22;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,0) 85%);mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,0) 85%)}
.l18-bub{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%);mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%)}
.l18-bub i,.l18-end-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:l18Rise var(--t) linear var(--dl) infinite,l18Sway calc(var(--t) / 5) ease-in-out var(--dl) infinite alternate}
.l18-hero.is-off .l18-bub i,.l18-end.is-off .l18-end-bub i{animation-play-state:paused}
.l18-bub i:nth-child(1){--x:4%;--s:9px;--t:24s;--dl:-6s}
.l18-bub i:nth-child(2){--x:12%;--s:5px;--t:19s;--dl:-13s}
.l18-bub i:nth-child(3){--x:22%;--s:12px;--t:28s;--dl:-3s}
.l18-bub i:nth-child(4){--x:33%;--s:6px;--t:21s;--dl:-17s}
.l18-bub i:nth-child(5){--x:45%;--s:4px;--t:17s;--dl:-9s}
.l18-bub i:nth-child(6){--x:56%;--s:10px;--t:26s;--dl:-21s}
.l18-bub i:nth-child(7){--x:64%;--s:6px;--t:20s;--dl:-2s}
.l18-bub i:nth-child(8){--x:72%;--s:14px;--t:31s;--dl:-15s}
.l18-bub i:nth-child(9){--x:80%;--s:7px;--t:22s;--dl:-11s}
.l18-bub i:nth-child(10){--x:87%;--s:5px;--t:18s;--dl:-7s}
.l18-bub i:nth-child(11){--x:93%;--s:11px;--t:27s;--dl:-19s}
.l18-bub i:nth-child(12){--x:98%;--s:6px;--t:21s;--dl:-4s}
@keyframes l18Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}6%{opacity:.75}100%{transform:translate3d(0,-1200px,0) scale(1.1);opacity:.3}}
@keyframes l18Sway{from{translate:-8px 0}to{translate:8px 0}}

.l18-hero-in{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);align-items:center;gap:clamp(40px,4vw,90px);width:100%}
.l18-hero-t{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.l18-crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:14px;color:var(--l-on3)}
.l18-crumbs a{color:var(--l-on2);text-decoration:none;border-bottom:1px solid rgba(127,219,255,.25);transition:color .2s,border-color .2s}
.l18-crumbs a:hover{color:#fff;border-color:var(--l-cyan)}
.l18-crumbs [aria-current]{color:var(--l-cyan)}
.l18-hero h1{font:300 clamp(42px,2.3vw + 16px,72px)/1.03 var(--l-d);letter-spacing:-.025em;color:#fff;text-wrap:balance;max-width:14.5em}
.l18-lead{font-size:clamp(17.5px,.3vw + 14.5px,20px);line-height:1.62;color:var(--l-on2);max-width:35em;text-wrap:pretty}
.l18-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px}
.l18-cta .btn-lg{min-height:58px;padding:0 28px}
.l18-btn-limit .ico{width:18px;height:18px}
.l18-note{display:inline-flex;align-items:center;gap:12px;padding:8px 18px 8px 8px;border-radius:999px;font-size:15px;color:var(--l-on2);background:rgba(255,255,255,.04);border:1px solid var(--l-rule)}
.l18-note-i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:var(--l-teal);background:rgba(94,242,201,.1);border:1px solid rgba(94,242,201,.3)}
.l18-note-i .ico{width:17px;height:17px}

/* merilnik */
.l18-dial{position:relative;justify-self:center;width:clamp(400px,36vw,560px);aspect-ratio:1}
.l18-dial-ring{position:absolute;inset:0}
.l18-ticks{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.l18-trk{fill:none;stroke:rgba(255,255,255,.07);stroke-width:2}
.l18-arc{fill:none;stroke:url(#l18Tk);stroke-width:3;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;transform:rotate(-90deg);transform-origin:50% 50%;filter:drop-shadow(0 0 8px rgba(56,182,255,.6));transition:stroke-dashoffset 2.2s var(--l-ease)}
.l18-dial.is-on .l18-arc{stroke-dashoffset:0}
.l18-ticks line{stroke:rgba(255,255,255,.16);stroke-width:2.2;stroke-linecap:round;transition:stroke .4s ease calc(var(--k) * 24ms)}
.l18-ticks line.mj{stroke-width:3.2}
.l18-dial.is-on .l18-ticks line{stroke:#7FDBFF}
.l18-dial.is-on .l18-ticks line.mj{stroke:#E8FBFF}
.l18-dial-glass{position:absolute;inset:19%;border-radius:50%;
  background:radial-gradient(80% 70% at 30% 20%,rgba(169,233,255,.2) 0%,rgba(169,233,255,0) 50%),radial-gradient(closest-side,rgba(30,111,217,.32),rgba(10,32,62,.55) 72%,rgba(10,32,62,.75));
  border:1px solid rgba(169,233,255,.28);box-shadow:inset 0 2px 0 rgba(255,255,255,.12),inset 0 -30px 60px -30px rgba(0,0,0,.6),0 40px 90px -40px rgba(30,111,217,.8);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.l18-dial-glass::after{content:"";position:absolute;inset:-9%;border-radius:50%;border:1px dashed rgba(127,219,255,.24);animation:l18Spin 60s linear infinite}
.l18-dial-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center}
.l18-dial-c small{font:600 14px/1 var(--l-s);letter-spacing:.2em;text-transform:uppercase;color:var(--l-cyan)}
.l18-dial-c b{font:200 clamp(96px,8vw,150px)/.92 var(--l-d);letter-spacing:-.04em;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 0 40px rgba(127,219,255,.45)}
.l18-dial-c span{font:600 15px/1 var(--l-s);letter-spacing:.24em;text-transform:uppercase;color:var(--l-on2)}
@keyframes l18Spin{to{transform:rotate(360deg)}}
.l18-chip{position:absolute;z-index:2;display:flex;align-items:center;gap:12px;padding:10px 18px 10px 10px;border-radius:20px;white-space:nowrap;
  background:rgba(8,24,46,.72);border:1px solid rgba(127,219,255,.22);box-shadow:0 24px 44px -24px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.08);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  animation:l18Float 7s ease-in-out infinite alternate}
.l18-chip > span:last-child{display:flex;flex-direction:column;gap:3px}
.l18-chip b{font:600 17px/1.1 var(--l-d);color:#fff}
.l18-chip small{font-size:13px;line-height:1.2;color:var(--l-on3)}
.l18-ci{position:relative;display:grid;place-items:center;width:40px;height:40px;border-radius:13px;color:#fff;overflow:hidden;
  background:linear-gradient(150deg,#4FB4FF 0%,#1E6FD9 55%,#0F3E86 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 20px -10px rgba(30,111,217,.9)}
.l18-ci-teal{background:linear-gradient(150deg,#5EF2C9 0%,#1CAE8F 55%,#0A6B5E 100%)}
.l18-ci .ico{width:19px;height:19px;stroke-width:2.3}
.l18-chip-1{left:-7%;top:12%}
.l18-chip-2{right:-9%;top:47%;animation-delay:-2.5s}
.l18-chip-3{left:2%;bottom:5%;animation-delay:-4.5s}
@keyframes l18Float{from{transform:translateY(-7px)}to{transform:translateY(7px)}}
.l18-hero.is-off .l18-chip,.l18-hero.is-off .l18-dial-glass::after{animation-play-state:paused}

/* ---------- 2. prednosti ---------- */
.l18-why{background:radial-gradient(40% 50% at 92% 20%,rgba(30,111,217,.14) 0%,rgba(30,111,217,0) 70%),linear-gradient(180deg,#050F1F 0%,#071A30 100%)}
.l18-why-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:56px}
.l18-w{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:30px 30px 32px;border-radius:26px;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid rgba(127,219,255,.12);
  transition:transform .5s var(--l-ease),border-color .4s,background-color .4s,box-shadow .5s var(--l-ease)}
.l18-w::after{content:"";position:absolute;inset:auto -30% -60% auto;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(56,182,255,.22),rgba(56,182,255,0));opacity:0;transition:opacity .5s}
.l18-w h3{margin-top:8px;font:600 22px/1.2 var(--l-d);letter-spacing:-.01em;color:#fff}
.l18-w p{font-size:16.5px;line-height:1.55;color:var(--l-on2)}
.l18-w.is-hot,.l18-w:hover{transform:translateY(-6px);border-color:rgba(127,219,255,.34);background-color:rgba(127,219,255,.04);box-shadow:0 34px 60px -36px rgba(0,0,0,.95),0 0 0 1px rgba(127,219,255,.08)}
.l18-w.is-hot::after,.l18-w:hover::after{opacity:1}
/* risbe ikon (animirajo se, ko je kartica osvetljena) */
.l18 .t-paper .pp path{opacity:.7}
.l18 .t-paper .x{stroke:#FFD2D2;stroke-width:2.6;stroke-dasharray:40;stroke-dashoffset:40}
.l18-w.is-hot .t-paper .x,.l18-w:hover .t-paper .x{animation:l18Draw .6s var(--l-ease) .1s forwards}
.l18 .t-gauge .g-tr{stroke:rgba(255,255,255,.3)}
.l18 .t-gauge .g-ar{stroke:#D9F6FF;stroke-dasharray:100;stroke-dashoffset:100}
.l18 .t-gauge .g-nd{transform-origin:24px 33px;transform:rotate(-70deg);transition:transform 1s var(--l-ease)}
.l18 .t-gauge .g-c{fill:#fff;stroke:none}
.l18-w.is-hot .t-gauge .g-ar,.l18-w:hover .t-gauge .g-ar{animation:l18Draw 1s var(--l-ease) forwards}
.l18-w.is-hot .t-gauge .g-nd,.l18-w:hover .t-gauge .g-nd{transform:rotate(62deg)}
.l18 .t-slide .k1,.l18 .t-slide .k2{fill:#fff;stroke:none;transition:transform .9s var(--l-ease)}
.l18-w.is-hot .t-slide .k1,.l18-w:hover .t-slide .k1{transform:translateX(12px)}
.l18-w.is-hot .t-slide .k2,.l18-w:hover .t-slide .k2{transform:translateX(-12px)}
.l18 .t-zap .zp{fill:rgba(255,255,255,.18)}
.l18 .t-zap .sp{opacity:0}
.l18-w.is-hot .t-zap .zp,.l18-w:hover .t-zap .zp{animation:l18Zap 1.2s ease}
.l18-w.is-hot .t-zap .sp,.l18-w:hover .t-zap .sp{animation:l18Spark 1.2s ease}
@keyframes l18Zap{0%,100%{fill:rgba(255,255,255,.18)}20%,40%{fill:#fff;filter:drop-shadow(0 0 6px #fff)}30%{fill:rgba(255,255,255,.4)}}
@keyframes l18Spark{0%,100%{opacity:0}30%,60%{opacity:1}}
.l18 .t-shield .ck,.l18-ready .ck{stroke-dasharray:100;stroke-dashoffset:0;stroke-width:2.8}
.l18-w.is-hot .t-shield .ck,.l18-w:hover .t-shield .ck{animation:l18Redraw .9s var(--l-ease)}
@keyframes l18Redraw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
.l18 .t-eye .ey circle{fill:#fff;stroke:none}
.l18 .t-eye .ey{transform-origin:24px 24px}
.l18-w.is-hot .t-eye .ey,.l18-w:hover .t-eye .ey{animation:l18Look 1.6s var(--l-ease)}
@keyframes l18Look{0%,100%{transform:none}25%{transform:translateX(-4px)}55%{transform:translateX(4px)}75%{transform:scaleY(.1)}}
@keyframes l18Draw{to{stroke-dashoffset:0}}

/* ---------- 3. koraki in telefon ---------- */
.l18-steps{background:radial-gradient(40% 50% at 8% 30%,rgba(56,182,255,.1) 0%,rgba(56,182,255,0) 70%),linear-gradient(180deg,#071A30 0%,#06162B 100%)}
.l18-st-in{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(48px,6vw,120px)}
.l18-st-l{display:flex;flex-direction:column;gap:48px}
.l18-tl{position:relative;display:flex;flex-direction:column;gap:12px;--p:0}
.l18-tl::before,.l18-tl::after{content:"";position:absolute;left:43px;top:40px;bottom:40px;width:2px;border-radius:2px;background:rgba(127,219,255,.14)}
.l18-tl::after{background:linear-gradient(180deg,#38B6FF,#5EF2C9);bottom:auto;height:calc((100% - 80px) * var(--p));box-shadow:0 0 12px rgba(56,182,255,.6);transition:height .8s var(--l-ease)}
.l18-s button{position:relative;z-index:1;display:grid;grid-template-columns:52px minmax(0,1fr);align-items:start;gap:22px;width:100%;padding:18px 24px 18px 18px;border-radius:22px;border:1px solid transparent;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;
  transition:background-color .4s,border-color .4s,transform .5s var(--l-ease),box-shadow .5s}
.l18-sn{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;font:600 19px/1 var(--l-d);color:var(--l-on2);background:#0A1F3A;border:1.5px solid rgba(127,219,255,.28);transition:all .4s var(--l-ease)}
.l18-sb{display:flex;flex-direction:column;gap:6px;padding-top:4px}
.l18-sb b{font:600 22px/1.25 var(--l-d);color:#fff;transition:color .3s}
.l18-sb span{font-size:16.5px;line-height:1.58;color:var(--l-on3);transition:color .3s}
.l18-s.is-done .l18-sn{color:#03221D;background:linear-gradient(135deg,#8DF2D8,#5EF2C9);border-color:transparent}
.l18-s.is-on button{background:linear-gradient(160deg,rgba(30,111,217,.24),rgba(10,32,62,.35));border-color:rgba(127,219,255,.3);box-shadow:0 30px 50px -34px rgba(30,111,217,.8)}
.l18-s.is-on .l18-sn{color:#fff;background:linear-gradient(135deg,#38B6FF,#1E6FD9);border-color:transparent;box-shadow:0 0 0 0 rgba(56,182,255,.55);animation:l18Pulse 2.2s ease-out infinite}
.l18-s.is-on .l18-sb span{color:var(--l-on)}
.l18-s button:hover .l18-sb b{color:var(--l-aqua)}
@keyframes l18Pulse{70%{box-shadow:0 0 0 12px rgba(56,182,255,0)}100%{box-shadow:0 0 0 0 rgba(56,182,255,0)}}

.l18-phone-w{display:flex;flex-direction:column;align-items:center;gap:16px}
.l18-phone-w figcaption{font-size:13px;letter-spacing:.06em;color:var(--l-on3)}
.l18-phone{position:relative;width:310px;height:630px;border-radius:50px;padding:14px;overflow:hidden;isolation:isolate;
  background:linear-gradient(160deg,#2A3B55,#0D1828 40%,#1B2A40);box-shadow:0 70px 120px -50px rgba(0,0,0,.95),0 0 0 1px rgba(169,233,255,.18),inset 0 0 0 2px rgba(255,255,255,.06),0 0 90px -20px rgba(30,111,217,.45)}
.l18-phone::before{content:"";position:absolute;inset:14px;border-radius:38px;z-index:-1;background:radial-gradient(90% 50% at 50% 0%,rgba(56,182,255,.26),rgba(56,182,255,0) 70%),linear-gradient(180deg,#0A1E38,#050F1F)}
.l18-notch{position:absolute;z-index:5;top:24px;left:50%;width:96px;height:26px;margin-left:-48px;border-radius:20px;background:#03070D}
.l18-scr{position:absolute;inset:14px;padding:64px 20px 40px;display:flex;flex-direction:column;gap:12px;border-radius:38px;opacity:0;transform:translateY(16px) scale(.98);transition:opacity .5s ease,transform .6s var(--l-ease);pointer-events:none}
.l18-phone[data-scr="0"] .l18-scr-0,.l18-phone[data-scr="1"] .l18-scr-1,.l18-phone[data-scr="2"] .l18-scr-2,.l18-phone[data-scr="3"] .l18-scr-3{opacity:1;transform:none}
.l18-dots{position:absolute;z-index:5;left:0;right:0;bottom:30px;display:flex;justify-content:center;gap:7px}
.l18-dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.22);transition:all .4s var(--l-ease)}
.l18-phone[data-scr="0"] .l18-dots i:nth-child(1),.l18-phone[data-scr="1"] .l18-dots i:nth-child(2),.l18-phone[data-scr="2"] .l18-dots i:nth-child(3),.l18-phone[data-scr="3"] .l18-dots i:nth-child(4){width:22px;border-radius:4px;background:var(--l-cyan)}
.l18-app{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.l18-app img{height:40px;width:auto;filter:drop-shadow(0 0 8px rgba(127,219,255,.35))}
.l18-app span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--l-on3)}
.l18-ph-k{margin-top:4px;font:600 10.5px/1 var(--l-s);letter-spacing:.16em;text-transform:uppercase;color:var(--l-cyan)}
.l18-pk{display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;border-radius:16px;background:rgba(56,182,255,.14);border:1px solid rgba(127,219,255,.45)}
.l18-pk b{display:block;font:600 14.5px/1.2 var(--l-d);color:#fff}
.l18-pk small{font-size:11.5px;color:var(--l-on3)}
.l18-pk-p{font:600 15px/1 var(--l-d)!important}
.l18-pk-r{width:18px;height:18px;border-radius:50%;border:2px solid var(--l-cyan);box-shadow:inset 0 0 0 3px #0A1E38;background:var(--l-cyan)}
.l18-pk-dim{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.1);opacity:.65}
.l18-pk-dim .l18-pk-r{background:none;border-color:rgba(255,255,255,.35);box-shadow:none}
.l18-pay{display:flex;align-items:center;gap:10px;padding:12px;border-radius:16px;background:rgba(94,242,201,.1);border:1px solid rgba(94,242,201,.4)}
.l18-pay b{flex:1;font:600 13.5px/1.2 var(--l-s);color:#fff}
.l18-pay-i{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;color:#03221D;background:var(--l-teal)}
.l18-pay-i .ico{width:16px;height:16px}
.l18-ok{color:var(--l-teal);stroke-width:3}
.l18-phone.anim[data-scr="0"] .l18-pay{animation:l18Pop .6s var(--l-ease) .5s both}
.l18-phone.anim[data-scr="0"] .l18-ok{animation:l18Pop .5s var(--l-ease) 1s both}
@keyframes l18Pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.l18-time{text-align:center;font:200 54px/1 var(--l-d);color:#fff;margin:6px 0 12px}
.l18-sms{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:20px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.l18-sms-h{display:flex;align-items:center;gap:8px}
.l18-sms-h b{flex:1;font:600 13px/1 var(--l-s);color:#fff}
.l18-sms-h small{font-size:11px;color:var(--l-on3)}
.l18-sms-i{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;color:#03221D;background:var(--l-teal)}
.l18-sms-i .ico{width:14px;height:14px}
.l18-sms > p:not(.l18-sms-h){font-size:13.5px;line-height:1.45;color:var(--l-on)}
.l18-link{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;padding:7px 12px;border-radius:999px;font:600 12.5px/1 var(--l-s);color:#fff;background:var(--l-oxy)}
.l18-link .ico{width:13px;height:13px}
.l18-num{display:flex;flex-direction:column;gap:5px;margin-top:auto;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.l18-num span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--l-on3)}
.l18-num b{font:600 17px/1 var(--l-d);letter-spacing:.08em;color:#fff}
.l18-phone.anim[data-scr="1"] .l18-sms{animation:l18Drop .7s var(--l-ease) .35s both}
.l18-phone.anim[data-scr="1"] .l18-link{animation:l18Pulse 2.2s ease-out 1.2s infinite}
@keyframes l18Drop{from{opacity:0;transform:translateY(-30px) scale(.94)}to{opacity:1;transform:none}}
.l18-fld{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.l18-fld span{font-size:11px;letter-spacing:.06em;color:var(--l-on3)}
.l18-fld i{display:block;height:9px;width:0;border-radius:5px;background:linear-gradient(90deg,rgba(255,255,255,.75),rgba(255,255,255,.35))}
.l18-phone[data-scr="2"] .l18-fld i{width:72%}
.l18-phone.anim[data-scr="2"] .l18-fld i{animation:l18Type .7s steps(9) both}
.l18-phone.anim[data-scr="2"] .l18-fld:nth-of-type(2) i{animation-delay:.5s}
.l18-phone.anim[data-scr="2"] .l18-fld:nth-of-type(3) i{animation-delay:1s}
.l18-phone.anim[data-scr="2"] .l18-fld:nth-of-type(4) i{animation-delay:1.5s}
@keyframes l18Type{from{width:0}to{width:72%}}
.l18-dec{position:relative;display:flex;align-items:center;gap:12px;margin-top:auto;padding:14px;border-radius:16px;background:rgba(94,242,201,.1);border:1px solid rgba(94,242,201,.4)}
.l18-dec b{font:600 13.5px/1.25 var(--l-s);color:#fff}
.l18-spin,.l18-dec-ok{flex:none;width:30px;height:30px;border-radius:50%}
.l18-spin{position:absolute;left:14px;border:3px solid rgba(94,242,201,.25);border-top-color:var(--l-teal);opacity:0}
.l18-dec-ok{display:grid;place-items:center;color:#03221D;background:var(--l-teal)}
.l18-dec-ok .ico{width:17px;height:17px;stroke-width:3}
.l18-phone.anim[data-scr="2"] .l18-spin{animation:l18Spin .8s linear infinite,l18Hide 2.6s steps(1) both}
.l18-phone.anim[data-scr="2"] .l18-dec-ok{animation:l18Pop .5s var(--l-ease) 2.6s both}
@keyframes l18Hide{0%{opacity:1}99%{opacity:1}100%{opacity:0}}
.l18-mail,.l18-go,.l18-sepa{display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.l18-mail b,.l18-go b,.l18-sepa b{display:block;font:600 14.5px/1.2 var(--l-d);color:#fff}
.l18-mail small,.l18-go small,.l18-sepa small{font-size:12px;color:var(--l-on3)}
.l18-mail-i,.l18-go-i{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;color:#fff;background:linear-gradient(150deg,#4FB4FF,#1E6FD9)}
.l18-go-i{color:#03221D;background:linear-gradient(150deg,#8DF2D8,#5EF2C9)}
.l18-mail-i .ico,.l18-go-i .ico{width:18px;height:18px}
.l18-sepa{justify-content:space-between}
.l18-tog{position:relative;width:46px;height:26px;border-radius:999px;background:var(--l-teal);transition:background-color .4s}
.l18-tog i{position:absolute;top:3px;left:23px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:left .4s var(--l-ease)}
.l18-phone.anim[data-scr="3"] .l18-tog{animation:l18TogBg 1.4s steps(1) both}
.l18-phone.anim[data-scr="3"] .l18-tog i{animation:l18Tog .5s var(--l-ease) .9s both}
@keyframes l18TogBg{0%{background:rgba(255,255,255,.2)}70%{background:#5EF2C9}}
@keyframes l18Tog{from{left:3px}to{left:23px}}
.l18-phone.anim[data-scr="3"] .l18-mail{animation:l18Drop .6s var(--l-ease) .2s both}
.l18-phone.anim[data-scr="3"] .l18-go{animation:l18Pop .6s var(--l-ease) 1.5s both}

/* ---------- 4. pogoji ---------- */
.l18-req{background:linear-gradient(180deg,#06162B 0%,#050F1F 100%)}
.l18-req-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:56px}
.l18-panel{position:relative;padding:34px 36px 30px;border-radius:30px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.018));border:1px solid rgba(127,219,255,.14)}
.l18-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#1E6FD9,#38B6FF,#A9E9FF)}
.l18-panel-teal::before{background:linear-gradient(90deg,#1CAE8F,#5EF2C9,#C8FFF0)}
.l18-ph{display:flex;align-items:center;gap:16px;margin-bottom:22px}
.l18-ph b{font:600 24px/1.2 var(--l-d);color:#fff}
.l18-list{display:flex;flex-direction:column}
.l18-list li{display:flex;align-items:center;gap:16px;padding:15px 0;border-top:1px solid rgba(127,219,255,.1);font-size:17px;line-height:1.5;color:var(--l-on)}
.l18-list li b{font-weight:600;color:var(--l-aqua)}
.l18-panel-teal .l18-list li b{color:var(--l-teal)}
.l18-li{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:14px;color:var(--l-cyan);background:rgba(127,219,255,.07);border:1px solid rgba(127,219,255,.18)}
.l18-panel-teal .l18-li{color:var(--l-teal);background:rgba(94,242,201,.07);border-color:rgba(94,242,201,.2)}
.l18-li .ico{width:21px;height:21px}
.l18-panel.in .l18-list li{animation:l18In .6s var(--l-ease) calc(200ms + var(--k) * 90ms) both}
@keyframes l18In{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}

/* ---------- 5. video in limit ---------- */
.l18-vid{background:radial-gradient(40% 50% at 90% 60%,rgba(30,111,217,.14) 0%,rgba(30,111,217,0) 70%),linear-gradient(180deg,#050F1F 0%,#071A30 100%)}
.l18-vid-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:28px;align-items:stretch}
.l18-vid-l{display:flex;flex-direction:column;gap:30px}
.l18-yt{position:relative;display:flex;flex-direction:column;gap:10px;flex:1}
.l18-yt-btn,.l18-yt iframe{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:28px;border:1px solid rgba(127,219,255,.18);overflow:hidden}
.l18-yt iframe{display:block;height:auto;background:#000}
.l18-yt-btn{display:grid;place-items:center;padding:0;cursor:pointer;color:#fff;font:inherit;
  background:radial-gradient(60% 70% at 50% 45%,rgba(56,182,255,.3) 0%,rgba(56,182,255,0) 70%),linear-gradient(160deg,#0D2C52 0%,#071A30 60%,#050F1F 100%);box-shadow:0 40px 80px -46px rgba(0,0,0,.9)}
.l18-yt-bg{position:absolute;inset:0;display:grid;place-items:center}
.l18-yt-ring{position:absolute;width:150px;height:150px;border-radius:50%;border:1px solid rgba(169,233,255,.35);animation:l18Ring 3.2s ease-out infinite}
.l18-yt-ring.r2{animation-delay:1.6s}
@keyframes l18Ring{from{transform:scale(.6);opacity:.9}to{transform:scale(2.3);opacity:0}}
.l18-yt-play{position:relative;display:grid;place-items:center;width:92px;height:92px;border-radius:50%;background:#fff;color:#0A1A2E;box-shadow:0 20px 50px -14px rgba(56,182,255,.8);transition:transform .4s var(--l-ease)}
.l18-yt-play .ico{width:30px;height:30px;margin-left:5px;fill:currentColor;stroke:none}
.l18-yt-btn:hover .l18-yt-play{transform:scale(1.08)}
.l18-yt-t{position:absolute;left:28px;bottom:24px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left}
.l18-yt-t b{font:600 20px/1.2 var(--l-d)}
.l18-yt-t small{font-size:13.5px;color:var(--l-on3)}
.l18-yt-note{font-size:12.5px;color:var(--l-on3)}
.l18-yt.is-play .l18-yt-note{display:none}
.l18-ready{position:relative;display:flex;flex-direction:column;border-radius:30px;overflow:hidden;background:linear-gradient(180deg,#0B2A4D 0%,#081D37 100%);border:1px solid rgba(127,219,255,.18);box-shadow:0 40px 80px -46px rgba(0,0,0,.9)}
.l18-ready-img{display:block;width:100%;height:220px;object-fit:cover;opacity:.75;-webkit-mask-image:linear-gradient(180deg,#000 40%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(180deg,#000 40%,rgba(0,0,0,0) 100%)}
.l18-ready-c{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-top:-70px;padding:0 34px 34px}
.l18-ready h3{font:500 28px/1.15 var(--l-d);letter-spacing:-.015em;color:#fff}
.l18-ready p{font-size:16.5px;line-height:1.6;color:var(--l-on2)}
.l18-ready .btn{margin-top:auto}
.l18-ready-c .l18-tile{box-shadow:0 0 0 6px rgba(8,29,55,.9),0 12px 26px -12px rgba(28,174,143,.9),inset 0 1px 0 rgba(255,255,255,.45)}
.l18-ready.in .ck{animation:l18Redraw 1s var(--l-ease) .5s both}

/* ---------- 6. povezave ---------- */
.l18-faq{background:linear-gradient(180deg,#071A30 0%,#050F1F 100%)}
.l18-faq-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,5vw,100px);align-items:center}
.l18-links{display:flex;flex-direction:column;gap:12px}
.l18-links a{display:flex;align-items:center;gap:18px;padding:16px 22px 16px 16px;border-radius:22px;text-decoration:none;color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid rgba(127,219,255,.14);
  transition:transform .4s var(--l-ease),border-color .3s,background-color .3s}
.l18-links a > span:nth-child(2){display:flex;flex-direction:column;gap:3px;flex:1}
.l18-links b{font:600 18px/1.3 var(--l-d)}
.l18-links small{font-size:13px;color:var(--l-on3)}
.l18-li-lg{width:52px;height:52px;border-radius:16px}
.l18-li-lg .ico{width:24px;height:24px}
.l18-arr{color:var(--l-cyan);transition:transform .35s var(--l-ease)}
.l18-links a:hover{transform:translateX(6px);border-color:rgba(127,219,255,.36);background-color:rgba(127,219,255,.05)}
.l18-links a:hover .l18-arr{transform:translate(3px,-3px)}

/* ---------- 7. sklep ---------- */
.l18-end{position:relative;padding-block:0 clamp(96px,6vw + 30px,150px);background:#050F1F}
.l18-end-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:40px;padding:clamp(40px,4vw,64px);border-radius:36px;overflow:hidden;isolation:isolate;
  background:radial-gradient(70% 120% at 100% 0%,rgba(127,219,255,.35) 0%,rgba(127,219,255,0) 55%),linear-gradient(120deg,#1452A8 0%,#1E6FD9 55%,#2A8BEA 100%);box-shadow:0 60px 110px -50px rgba(30,111,217,.9)}
.l18-end-card .l18-h2{color:#fff}
.l18-end-card .l18-em{background:none;color:#D9F6FF;-webkit-text-fill-color:#D9F6FF}
.l18-end-t{display:flex;flex-direction:column;gap:12px}
.l18-end-t p{font-size:19px;color:rgba(255,255,255,.88)}
.l18-end-a{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px}
.l18-end .btn-primary{background:#fff;color:#0A1A2E;box-shadow:0 18px 36px -18px rgba(0,0,0,.6)}
.l18-end .btn-primary:hover{background:#EAF6FF;color:#0A1A2E}
.l18-end .l18-btn-line{border-color:rgba(255,255,255,.7)}
.l18-tel{display:inline-flex;align-items:center;gap:9px;min-height:58px;padding:0 10px;font:600 17px/1 var(--l-s);color:#fff;text-decoration:none}
.l18-tel:hover{text-decoration:underline;text-underline-offset:4px}
.l18-end-bub{position:absolute;inset:0;z-index:-1;pointer-events:none}
.l18-end-bub i:nth-child(1){--x:6%;--s:10px;--t:16s;--dl:-3s}
.l18-end-bub i:nth-child(2){--x:22%;--s:6px;--t:12s;--dl:-8s}
.l18-end-bub i:nth-child(3){--x:41%;--s:14px;--t:19s;--dl:-1s}
.l18-end-bub i:nth-child(4){--x:58%;--s:5px;--t:13s;--dl:-10s}
.l18-end-bub i:nth-child(5){--x:77%;--s:11px;--t:17s;--dl:-6s}
.l18-end-bub i:nth-child(6){--x:92%;--s:7px;--t:14s;--dl:-12s}
.l18-end-bub i{border-color:rgba(255,255,255,.55);animation-name:l18RiseS,l18Sway}
@keyframes l18RiseS{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}8%{opacity:.8}100%{transform:translate3d(0,-420px,0) scale(1.1);opacity:0}}

/* ---------- pod 1280 px ---------- */
@media (max-width:1279.98px){
  .l18-dial{width:clamp(340px,36vw,460px)}
  .l18-chip-1{left:-6%;top:6%}
  .l18-chip-2{top:auto;bottom:3%;right:-4%}
  .l18-chip-3{left:-12%;bottom:27%}
  .l18-chip small{display:none}
  .l18-end-card{grid-template-columns:1fr}
  .l18-end-a{justify-content:flex-start}
  .l18-why-grid{gap:16px}
  .l18-w{padding:26px}
}
/* ---------- tablica in telefon: ena kolona ---------- */
@media (max-width:1023.98px){
  .l18-hero{min-height:0;padding-top:168px;padding-bottom:64px}
  .l18-hero-in,.l18-st-in,.l18-vid-in,.l18-faq-in,.l18-req-grid{grid-template-columns:1fr}
  .l18-dial{width:min(84vw,440px);margin-top:20px}
  .l18-chip{padding:8px 14px 8px 8px;border-radius:16px}
  .l18-chip b{font-size:15px}
  .l18-chip-1{left:-2%;top:4%}
  .l18-chip-2{right:-2%;top:52%}
  .l18-chip-3{left:0;bottom:0}
  .l18-why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .l18-phone-w{justify-self:center}
  .l18-end-card{grid-template-columns:1fr}
  .l18-end-a{justify-content:flex-start}
  .l18-wm{opacity:.12}
}
@media (max-width:767.98px){
  .l18-hero h1{font-size:clamp(34px,8.6vw,44px)}
  .l18-cta{flex-direction:column;align-items:stretch;width:100%}
  .l18-cta .btn,.l18-btn-line{width:100%;white-space:normal}
  .l18-note{border-radius:18px;align-items:flex-start}
  .l18-dial-c b{font-size:clamp(72px,22vw,110px)}
  .l18-chip small{display:none}
  .l18-dial{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;aspect-ratio:auto;width:100%}
  .l18-dial-ring{position:relative;inset:auto;width:min(84vw,380px);aspect-ratio:1;margin-bottom:10px}
  .l18-chip,.l18-chip-1,.l18-chip-2,.l18-chip-3{position:static;animation:none}
  .l18-why-grid{grid-template-columns:1fr;margin-top:36px}
  .l18-s button{grid-template-columns:44px minmax(0,1fr);gap:16px;padding:14px}
  .l18-sn{width:44px;height:44px;font-size:17px}
  .l18-tl::before,.l18-tl::after{left:36px}
  .l18-sb b{font-size:19px}
  .l18-sb span{font-size:15.5px}
  .l18-phone{width:280px;height:570px}
  .l18-panel{padding:26px 20px 22px}
  .l18-list li{font-size:16px}
  .l18-ready-c{padding:0 22px 26px}
  .l18-end-card{padding:32px 22px;border-radius:28px}
  .l18-end-a .btn,.l18-end-a .l18-btn-line{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .l18 *,.l18 *::before,.l18 *::after{animation:none!important;transition:none!important}
  .l18-bub,.l18-end-bub{display:none}
  .l18-ticks line{stroke:#7FDBFF}
  .l18-arc{stroke-dashoffset:0}
}


/* =====================================================================================================
   V2 (23. 10. 2026): logotip in slike Leanpay, barve Leanpay kot partnerski poudarek ob temni osnovi OxySphere
   ===================================================================================================== */
.l18-v2{--lp-1:#FBA95E;--lp-2:#FF7A6E;--lp-3:#F0566E;--lp-d1:#C2365A;--lp-d2:#CF4256;--lp-d3:#D9573F;--lp-glow:255,122,110}

/* --- znak partnerja nad naslovom --- */
.l18-partner{display:inline-flex;align-items:center;gap:14px;padding:9px 20px 9px 16px;border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));border:1px solid rgba(var(--lp-glow),.32);
  box-shadow:0 14px 34px -18px rgba(var(--lp-glow),.55),inset 0 1px 0 rgba(255,255,255,.08)}
.l18-partner span{font:600 12.5px/1.2 var(--l-s);letter-spacing:.16em;text-transform:uppercase;color:var(--l-on2)}
.l18-partner img{display:block;height:28px;width:auto}
.l18-v2 .l18-hero h1 .l18-em{background:linear-gradient(100deg,#FFD0A0 0%,#FF8A72 45%,#F2647A 100%);-webkit-background-clip:text;background-clip:text}

/* --- junak: prizorišče s prenosnikom (prava slika portala Moj Leanpay) --- */
.l18-v2 .l18-bg{-webkit-mask-image:linear-gradient(180deg,#000 72%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(180deg,#000 72%,rgba(0,0,0,0) 100%)}
.l18-v2 .l18-hero{background:radial-gradient(70% 60% at 10% 0%,rgba(56,182,255,.12) 0%,rgba(56,182,255,0) 60%),linear-gradient(180deg,#071A30 0%,#050F1F 88%)}
.l18-g3{width:760px;height:760px;right:4%;top:18%;background:radial-gradient(closest-side,rgba(var(--lp-glow),.2),rgba(var(--lp-glow),0))}
.l18-v2 .l18-hero-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.l18-stage{position:relative;justify-self:center;width:min(620px,100%);aspect-ratio:1 / .9;margin:0}
.l18-halo{position:absolute;left:14%;top:6%;width:80%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,170,110,.42) 0%,rgba(var(--lp-glow),.26) 40%,rgba(56,182,255,.12) 68%,rgba(56,182,255,0) 100%);filter:blur(6px)}
.l18-orbit{position:absolute;left:10%;top:2%;width:88%;aspect-ratio:1;border-radius:50%;border:1px dashed rgba(255,190,160,.22);animation:l18Spin 80s linear infinite}
.l18-orbit i{position:absolute;top:50%;right:-5px;width:10px;height:10px;border-radius:50%;background:#FFB48A;box-shadow:0 0 14px 3px rgba(var(--lp-glow),.7)}
.l18-laptop{position:absolute;right:0;top:3%;width:76%;height:auto;
  filter:drop-shadow(0 50px 60px rgba(0,0,0,.6)) drop-shadow(0 0 40px rgba(var(--lp-glow),.25));
  animation:l18Hover 8s ease-in-out infinite alternate}
@keyframes l18Hover{from{transform:translateY(-6px) rotate(-.4deg)}to{transform:translateY(8px) rotate(.3deg)}}
/* merilnik kot značka čez prenosnik */
.l18-v2 .l18-dial{position:absolute;left:-2%;bottom:6%;width:44%;aspect-ratio:1;z-index:3}
.l18-v2 .l18-dial-glass{inset:17%;background:radial-gradient(80% 70% at 30% 20%,rgba(255,214,168,.22) 0%,rgba(255,214,168,0) 50%),radial-gradient(closest-side,rgba(30,111,217,.42),rgba(8,24,46,.88) 72%,rgba(6,18,36,.95));
  box-shadow:inset 0 2px 0 rgba(255,255,255,.12),inset 0 -30px 60px -30px rgba(0,0,0,.6),0 30px 70px -30px rgba(0,0,0,.9),0 0 0 1px rgba(255,190,160,.18)}
.l18-v2 .l18-dial-c b{font-size:clamp(64px,5.2vw,92px)}
.l18-v2 .l18-dial-c small{font-size:12px;color:#FFC4A2}
.l18-v2 .l18-dial-c span{font-size:12.5px}
.l18-v2 .l18-ticks line{stroke-width:2.6}
.l18-stage.is-on .l18-arc{stroke-dashoffset:0}
.l18-stage.is-on .l18-ticks line{stroke:#FFB48A}
.l18-stage.is-on .l18-ticks line.mj{stroke:#FFF1E6}
.l18-v2 .l18-arc{filter:drop-shadow(0 0 8px rgba(var(--lp-glow),.7))}
.l18-ci-lp{background:linear-gradient(150deg,#FFB27A 0%,#FF6F70 55%,#C7385A 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 20px -10px rgba(var(--lp-glow),.9)}
.l18-v2 .l18-chip-1{left:auto;right:58%;top:2%}
.l18-v2 .l18-chip-2{right:-4%;top:auto;bottom:30%}
.l18-v2 .l18-chip-3{left:auto;right:6%;bottom:2%}
.l18-cap{position:absolute;left:46%;top:calc(4% + 72% * 451 / 437 * .98);display:none}
.l18-v2 .l18-cap{position:absolute;left:auto;right:4%;top:-2%;display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border-radius:999px;
  font-size:12px;letter-spacing:.04em;color:var(--l-on2);background:rgba(8,24,46,.6);border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.l18-cap img{width:16px;height:auto}
.l18-hero.is-off .l18-laptop,.l18-hero.is-off .l18-orbit{animation-play-state:paused}

/* --- pas Leanpay --- */
.l18-band{position:relative;z-index:2;margin-top:-36px;padding-bottom:8px;background:transparent}
.l18-band-in{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(24px,3vw,56px);
  padding:26px clamp(28px,3vw,48px);border-radius:28px;overflow:hidden;isolation:isolate;color:#fff;
  background:radial-gradient(60% 140% at 0% 0%,rgba(255,196,140,.35) 0%,rgba(255,196,140,0) 60%),linear-gradient(100deg,var(--lp-d1) 0%,var(--lp-d2) 48%,var(--lp-d3) 100%);
  box-shadow:0 40px 80px -40px rgba(var(--lp-glow),.75),inset 0 1px 0 rgba(255,255,255,.25)}
.l18-band-in::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.35;background-image:radial-gradient(rgba(255,255,255,.35) 1px,rgba(255,255,255,0) 1.6px);background-size:22px 22px;
  -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 60%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 60%,rgba(0,0,0,0) 100%)}
.l18-band-tree{position:absolute;z-index:-1;left:-40px;top:50%;width:240px;transform:translateY(-50%) rotate(-8deg);opacity:.16}
.l18-band-tree img{width:100%;height:auto;display:block}
.l18-band-logo{display:block;height:44px;width:auto}
.l18-band-facts{display:flex;justify-content:space-around;gap:8px}
.l18-band-facts li{display:flex;flex-direction:column;gap:4px;padding:4px 0 4px 22px;border-left:1px solid rgba(255,255,255,.32)}
.l18-band-facts b{font:600 clamp(22px,1vw + 12px,28px)/1.05 var(--l-d);letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}
.l18-band-facts span{font:600 14.5px/1.3 var(--l-s);color:#fff}
.l18-band-btn{display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:0 24px;border-radius:999px;background:#fff;color:#A82A4A;text-decoration:none;
  font:700 16px/1 var(--l-s);white-space:nowrap;box-shadow:0 16px 30px -16px rgba(60,0,20,.6);transition:transform .3s var(--l-ease),box-shadow .3s}
.l18-band-btn .ico{width:18px;height:18px;transition:transform .3s var(--l-ease)}
.l18-band-btn:hover{transform:translateY(-2px);box-shadow:0 22px 40px -18px rgba(60,0,20,.7)}
.l18-band-btn:hover .ico{transform:translate(2px,-2px)}
.l18-band-btn:focus-visible{outline-color:#fff}
.l18-v2 .l18-why{padding-top:clamp(80px,5vw + 30px,130px)}

/* --- telefon: zasloni v slogu Leanpay --- */
.l18-v2 .l18-phone{box-shadow:0 70px 120px -50px rgba(0,0,0,.95),0 0 0 1px rgba(169,233,255,.18),inset 0 0 0 2px rgba(255,255,255,.06),0 0 110px -20px rgba(var(--lp-glow),.42)}
.l18-v2 .l18-phone-w{position:relative}
.l18-v2 .l18-phone-w::before{content:"";position:absolute;left:50%;top:44%;width:520px;height:520px;transform:translate(-50%,-50%);border-radius:50%;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(var(--lp-glow),.2),rgba(56,182,255,.08) 60%,rgba(56,182,255,0))}
.l18-v2 .l18-pay{background:rgba(var(--lp-glow),.12);border-color:rgba(255,150,130,.55)}
.l18-v2 .l18-pay-i{background:#fff;padding:4px}
.l18-v2 .l18-pay-i img{width:100%;height:100%;object-fit:contain}
.l18-v2 .l18-ok{color:#FF9C84}
.l18-v2 .l18-sms-i{background:linear-gradient(150deg,#FFB27A,#F0566E);padding:4px}
.l18-v2 .l18-sms-i img{width:100%;height:100%;object-fit:contain}
.l18-v2 .l18-link{background:linear-gradient(100deg,#F0566E,#FF8A62)}
.l18-v2 .l18-phone.anim[data-scr="1"] .l18-link{animation-name:l18PulseLp}
@keyframes l18PulseLp{0%{box-shadow:0 0 0 0 rgba(var(--lp-glow),.6)}70%{box-shadow:0 0 0 10px rgba(var(--lp-glow),0)}100%{box-shadow:0 0 0 0 rgba(var(--lp-glow),0)}}
.l18-lp-bar{display:flex;align-items:center;justify-content:space-between;margin:-4px 0 6px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.1)}
.l18-lp-bar img{height:24px;width:auto}
.l18-lp-bar span{display:inline-flex;align-items:center;gap:5px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--l-on3)}
.l18-lp-bar .ico{width:12px;height:12px}
.l18-v2 .l18-scr-2 .l18-fld i{background:linear-gradient(90deg,#FFD0B5,rgba(255,138,114,.55))}
.l18-v2 .l18-dec{background:rgba(94,242,201,.1)}
.l18-v2 .l18-dots i{background:rgba(255,255,255,.22)}
.l18-v2 .l18-phone[data-scr] .l18-dots i:is(:nth-child(1),:nth-child(2),:nth-child(3),:nth-child(4)){transition:all .4s var(--l-ease)}
.l18-v2 .l18-phone[data-scr="0"] .l18-dots i:nth-child(1),.l18-v2 .l18-phone[data-scr="1"] .l18-dots i:nth-child(2),.l18-v2 .l18-phone[data-scr="2"] .l18-dots i:nth-child(3),.l18-v2 .l18-phone[data-scr="3"] .l18-dots i:nth-child(4){background:linear-gradient(90deg,#FFB27A,#F0566E)}

/* --- video: plakat v barvah Leanpay (video sam se še vedno naloži šele ob kliku) --- */
.l18-v2 .l18-yt-btn{border-color:rgba(255,190,160,.35);
  background:radial-gradient(55% 80% at 20% 15%,rgba(255,206,150,.55) 0%,rgba(255,206,150,0) 60%),linear-gradient(120deg,#F7A35F 0%,#F2775F 38%,#E0505F 72%,#C7385A 100%);
  box-shadow:0 40px 80px -40px rgba(var(--lp-glow),.65)}
.l18-yt-mesh{position:absolute;inset:0;opacity:.28;background-image:radial-gradient(rgba(255,255,255,.55) 1px,rgba(255,255,255,0) 1.6px);background-size:24px 24px;
  -webkit-mask-image:radial-gradient(60% 70% at 70% 50%,#000,rgba(0,0,0,0) 80%);mask-image:radial-gradient(60% 70% at 70% 50%,#000,rgba(0,0,0,0) 80%)}
.l18-yt-tree{position:absolute;right:-4%;bottom:-14%;width:46%;height:auto;opacity:.16;transform:rotate(-10deg)}
.l18-yt-logo{position:absolute;left:28px;top:26px;height:34px;width:auto}
.l18-v2 .l18-yt-ring{border-color:rgba(255,255,255,.55)}
.l18-v2 .l18-yt-play{color:#C7385A;box-shadow:0 20px 50px -14px rgba(90,10,30,.7)}
.l18-v2 .l18-yt-t small{color:rgba(255,255,255,.92)}
.l18-v2 .l18-yt-t{text-shadow:0 1px 12px rgba(120,20,40,.35)}

/* --- povezave: vir --- */
.l18-links-w{display:flex;flex-direction:column;gap:16px}
.l18-src{display:flex;align-items:center;gap:12px;font:600 12px/1 var(--l-s);letter-spacing:.16em;text-transform:uppercase;color:var(--l-on3)}
.l18-src img{height:22px;width:auto}
.l18-v2 .l18-links a:hover{border-color:rgba(255,160,140,.45)}
.l18-v2 .l18-links a:hover .l18-arr{color:#FFA48A}

/* --- V2: pod 1280 px --- */
@media (max-width:1279.98px){
  .l18-v2 .l18-chip-1{left:-2%;right:auto;top:18%}
  .l18-v2 .l18-chip-2{right:-2%;bottom:30%;top:auto}
  .l18-v2 .l18-chip-3{right:4%;bottom:0;left:auto}
  .l18-band-in{grid-template-columns:auto auto;grid-template-areas:"lg bt" "fc fc";justify-content:space-between;row-gap:22px}
  .l18-band-logo{grid-area:lg}
  .l18-band-facts{grid-area:fc}
  .l18-band-btn{grid-area:bt;justify-self:end}
  .l18-band-facts li{padding:4px 14px}
}
/* --- V2: tablica in telefon --- */
@media (max-width:1023.98px){
  .l18-v2 .l18-hero-in{grid-template-columns:1fr}
  .l18-stage{width:min(92vw,560px);margin-top:12px}
  .l18-band{margin-top:0;padding-top:8px}
  .l18-band-in{grid-template-columns:1fr;grid-template-areas:"lg" "fc" "bt";justify-content:stretch;justify-items:start;gap:22px}
  .l18-band-btn{justify-self:start}
  .l18-band-facts{width:100%;justify-content:space-between}
}
@media (max-width:767.98px){
  .l18-partner{gap:10px;padding:8px 16px 8px 12px}
  .l18-partner span{font-size:11px;letter-spacing:.12em}
  .l18-partner img{height:22px}
  .l18-stage{display:flex;flex-direction:column;align-items:center;aspect-ratio:auto;width:100%;gap:10px}
  .l18-halo{left:50%;top:0;width:96%;transform:translateX(-50%)}
  .l18-orbit{display:none}
  .l18-laptop{position:relative;right:auto;top:auto;width:min(80vw,360px);margin:6px 0 0 14%}
  .l18-v2 .l18-dial{position:absolute;left:0;top:min(48vw,214px);bottom:auto;width:min(40vw,176px)}
  .l18-v2 .l18-dial-ring{position:absolute;inset:0;width:auto;margin:0}
  .l18-v2 .l18-dial-c b{font-size:clamp(44px,12vw,62px)}
  .l18-v2 .l18-dial-c small,.l18-v2 .l18-dial-c span{font-size:10px}
  .l18-v2 .l18-chip,.l18-v2 .l18-chip-1,.l18-v2 .l18-chip-2,.l18-v2 .l18-chip-3{position:static;animation:none;align-self:stretch}
  .l18-v2 .l18-chip small{display:block}
  .l18-v2 .l18-cap{position:static;order:-1;align-self:flex-end}
  .l18-band-in{padding:26px 22px;border-radius:24px}
  .l18-band-logo{height:36px}
  .l18-band-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));row-gap:16px}
  .l18-band-facts li{padding:2px 12px}
  .l18-band-btn{width:100%;justify-content:center}
  .l18-yt-logo{left:18px;top:18px;height:24px}
  .l18-v2 .l18-yt-t{left:18px;bottom:14px}
  .l18-v2 .l18-yt-play{width:72px;height:72px}
  .l18-v2 .l18-phone-w::before{width:360px;height:360px}
}
@media (prefers-reduced-motion:reduce){
  .l18-stage .l18-ticks line{stroke:#FFB48A}
}


/* ===== 19. Podstran – Izkušnje (Verzija 2) ===== */
/* 19. Podstran – Izkušnje – Verzija 2 (21. 10. 2026): vseh 11 objavljenih izjav (tudi tiste za »Naloži več«), povprečna ocena 108/11 = 9,8,
   številka in »/10« v krogu ne prekrivata več (v vrsti); V1 ostane nespremenjena.
   Verzija 1 (21. 10. 2026)
   Prenova obstoječe podstrani oxysphere.si/izkusnje/ v slogu OSNUTKA 1 (temno nadaljevanje, sij, pikčasta mreža,
   polmesec iz znaka, mehurčki, steklene kartice). Uvod s povprečno oceno, Googlom in vrtiljakom izbranih izjav;
   filtri po področju in opaženih spremembah; kartice izjav; okno s celotno izkušnjo (naprej/nazaj, puščice);
   »Še več izkušenj se pripravlja« in izjava o avtentičnosti; sklepni poziv.
   Vsebina izjav je prevzeta z obstoječe strani (6 objavljenih izjav, 21. 10. 2026), z redakcijskimi popravki ločil.
   Slogi so omejeni na .i19 in #i19-m. Namizje od 1024 px, pod tem ena kolona. Animacije s predpono i19. */
.i19,#i19-m{--i-on:#E8F0F8;--i-on2:rgba(232,240,248,.8);--i-on3:rgba(232,240,248,.6);--i-oxy:#1E6FD9;--i-sky:#38B6FF;--i-cyan:#7FDBFF;--i-aqua:#A9E9FF;--i-teal:#5EF2C9;
  --i-rule:rgba(127,219,255,.14);--i-ease:cubic-bezier(.16,1,.3,1);
  --i-d:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;--i-s:'Instrument Sans','Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --kc:#7FDBFF;--kr:127,219,255}
.i19 [data-k="sport"],.i19[data-k="sport"],#i19-m [data-k="sport"]{--kc:#7FDBFF;--kr:127,219,255}
.i19 [data-k="prev"],#i19-m [data-k="prev"]{--kc:#5EF2C9;--kr:94,242,201}
.i19 [data-k="okr"],#i19-m [data-k="okr"]{--kc:#9DB4FF;--kr:157,180,255}
.i19 [data-k="izg"],#i19-m [data-k="izg"]{--kc:#FFC979;--kr:255,201,121}
.i19 [data-k="rak"],#i19-m [data-k="rak"]{--kc:#C6A8FF;--kr:198,168,255}
.i19 [data-k="bio"],#i19-m [data-k="bio"]{--kc:#8DF2D8;--kr:141,242,216}
.i19 [data-k="vit"],#i19-m [data-k="vit"]{--kc:#FFA6D2;--kr:255,166,210}
.i19{position:relative;background:#050F1F;color:var(--i-on);font-family:var(--i-s);overflow:hidden}
.i19 *,.i19 *::before,.i19 *::after,#i19-m *,#i19-m *::before,#i19-m *::after{box-sizing:border-box}
.i19 :where(h1,h2,h3,p,ul,ol,figure,blockquote,dl,dd),#i19-m :where(h1,h2,h3,p,ul,ol,figure,blockquote,dl,dd){margin:0;padding:0}
.i19 :where(ul,ol),#i19-m :where(ul,ol){list-style:none}
.i19 .ico,#i19-m .ico{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.i19 :focus-visible,#i19-m :focus-visible{outline:3px solid var(--i-sky);outline-offset:3px}
.i19 .wrap{position:relative;z-index:1}
.i19 .sr-only,#i19-m .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- skupno ---------- */
.i19-eyebrow{display:inline-flex;align-items:center;gap:12px;font:600 12.5px/1.3 var(--i-s);letter-spacing:.2em;text-transform:uppercase;color:var(--i-cyan)}
.i19-eyebrow::before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;box-shadow:7px -6px 0 -2.5px currentColor}
.i19-h2{font:300 clamp(36px,2.1vw + 14px,62px)/1.04 var(--i-d);letter-spacing:-.022em;color:#fff;text-wrap:balance}
.i19-em{font-weight:500;background:linear-gradient(100deg,#A9E9FF 0%,#38B6FF 70%,#7FDBFF 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.i19-head{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.i19-btn-line{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;border:1.5px solid rgba(255,255,255,.42);background:rgba(255,255,255,.03);color:#fff;
  font:600 15.5px/1.2 var(--i-s);cursor:pointer;transition:background-color .25s,border-color .25s,color .25s,transform .3s var(--i-ease)}
.i19-btn-line .ico{width:18px;height:18px}
.i19-btn-line:hover{background:#fff;color:#0A1A2E;border-color:#fff;transform:translateY(-2px)}
.i19-cat{display:inline-flex;align-items:center;gap:8px;min-width:0;font:600 11.5px/1.3 var(--i-s);letter-spacing:.16em;text-transform:uppercase;color:var(--kc)}
.i19-cat::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--kc);box-shadow:0 0 10px rgba(var(--kr),.8)}
.i19-score{position:relative;display:inline-grid;place-items:center;flex:none;width:48px;height:48px}
.i19-score svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.i19-score .tr{fill:none;stroke:rgba(255,255,255,.1);stroke-width:2.6}
.i19-score .ar{fill:none;stroke:var(--kc);stroke-width:2.6;stroke-linecap:round;stroke-dasharray:var(--s) 100;filter:drop-shadow(0 0 3px rgba(var(--kr),.6))}
.i19-score b{position:relative;font:700 14px/1 var(--i-d);color:#fff}
.i19-score b small{font-size:9px;font-weight:600;color:var(--i-on3)}
.i19-av{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:50%;font:700 14px/1 var(--i-d);letter-spacing:.02em;color:#04121F;
  background:radial-gradient(120% 100% at 30% 10%,rgba(255,255,255,.8) 0%,rgba(255,255,255,0) 50%),linear-gradient(140deg,var(--kc),rgba(var(--kr),.55));box-shadow:0 10px 22px -10px rgba(var(--kr),.9),inset 0 1px 0 rgba(255,255,255,.6)}
.i19-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.i19-who b{font:600 16px/1.25 var(--i-d);color:#fff}
.i19-who small{font-size:13.5px;line-height:1.35;color:var(--i-on3)}
.i19-tags{display:flex;flex-wrap:wrap;gap:7px}
.i19-tags li{display:inline-flex;align-items:center;min-height:28px;padding:0 11px;border-radius:999px;font:600 12.5px/1 var(--i-s);color:var(--i-on);background:rgba(var(--kr),.1);border:1px solid rgba(var(--kr),.3)}
.i19-tags li.i19-tmore{color:var(--i-on3);background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.14)}
.i19-more{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0;border:0;background:none;color:var(--i-cyan);font:600 15px/1.2 var(--i-s);cursor:pointer}
.i19-more .ico{width:17px;height:17px;transition:transform .3s var(--i-ease)}
.i19-more:hover{color:#fff}
.i19-more:hover .ico{transform:translateX(4px)}
.i19-nb{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);color:#fff;cursor:pointer;transition:background-color .2s,border-color .2s,transform .3s var(--i-ease)}
.i19-nb:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.35);transform:scale(1.05)}

/* ---------- 1. uvod ---------- */
.i19-hero{position:relative;display:flex;align-items:center;min-height:clamp(660px,88svh,880px);padding-top:calc(var(--hh,100px) + 36px);padding-bottom:72px;
  background:radial-gradient(70% 60% at 10% 0%,rgba(56,182,255,.12) 0%,rgba(56,182,255,0) 60%),linear-gradient(180deg,#071A30 0%,#050F1F 100%)}
.i19-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.i19-photo{position:absolute;right:0;top:0;width:62%;height:100%;object-fit:cover;opacity:.22;filter:saturate(1.2) blur(1px);
  -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 45%,#000 75%,rgba(0,0,0,.2) 100%),linear-gradient(180deg,#000 50%,rgba(0,0,0,0) 100%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 45%,#000 75%,rgba(0,0,0,.2) 100%),linear-gradient(180deg,#000 50%,rgba(0,0,0,0) 100%);mask-composite:intersect}
.i19-glow{position:absolute;border-radius:50%}
.i19-g1{width:900px;height:900px;right:-160px;top:-120px;background:radial-gradient(closest-side,rgba(30,111,217,.26),rgba(30,111,217,0))}
.i19-g2{width:700px;height:700px;left:-260px;bottom:-320px;background:radial-gradient(closest-side,rgba(94,242,201,.08),rgba(94,242,201,0))}
.i19-mesh{position:absolute;inset:0;opacity:.5;background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(40% 40% at 22% 40%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(40% 40% at 22% 40%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
.i19-wm{position:absolute;left:-180px;top:14%;height:min(800px,80%);width:auto;opacity:.2;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,0) 85%);mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,0) 85%)}
.i19-bub{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%);mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%)}
.i19-bub i,.i19-end-bub i,.i19-mb-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:i19Rise var(--t) linear var(--dl) infinite,i19Sway calc(var(--t) / 5) ease-in-out var(--dl) infinite alternate}
.i19-hero.is-off .i19-bub i{animation-play-state:paused}
.i19-bub i:nth-child(1){--x:4%;--s:9px;--t:24s;--dl:-6s}
.i19-bub i:nth-child(2){--x:12%;--s:5px;--t:19s;--dl:-13s}
.i19-bub i:nth-child(3){--x:22%;--s:12px;--t:28s;--dl:-3s}
.i19-bub i:nth-child(4){--x:33%;--s:6px;--t:21s;--dl:-17s}
.i19-bub i:nth-child(5){--x:45%;--s:4px;--t:17s;--dl:-9s}
.i19-bub i:nth-child(6){--x:56%;--s:10px;--t:26s;--dl:-21s}
.i19-bub i:nth-child(7){--x:64%;--s:6px;--t:20s;--dl:-2s}
.i19-bub i:nth-child(8){--x:72%;--s:14px;--t:31s;--dl:-15s}
.i19-bub i:nth-child(9){--x:80%;--s:7px;--t:22s;--dl:-11s}
.i19-bub i:nth-child(10){--x:87%;--s:5px;--t:18s;--dl:-7s}
.i19-bub i:nth-child(11){--x:93%;--s:11px;--t:27s;--dl:-19s}
.i19-bub i:nth-child(12){--x:98%;--s:6px;--t:21s;--dl:-4s}
@keyframes i19Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}6%{opacity:.75}100%{transform:translate3d(0,-1200px,0) scale(1.1);opacity:.3}}
@keyframes i19Sway{from{translate:-8px 0}to{translate:8px 0}}

.i19-hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(40px,5vw,100px);width:100%}
.i19-hero-t{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.i19-crumbs{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--i-on3)}
.i19-crumbs a{color:var(--i-on2);text-decoration:none;border-bottom:1px solid rgba(127,219,255,.25)}
.i19-crumbs a:hover{color:#fff;border-color:var(--i-cyan)}
.i19-crumbs [aria-current]{color:var(--i-cyan)}
.i19-hero h1{font:300 clamp(46px,2.6vw + 16px,80px)/1.02 var(--i-d);letter-spacing:-.028em;color:#fff;text-wrap:balance}
.i19-lead{font-size:clamp(17.5px,.3vw + 14.5px,20px);line-height:1.62;color:var(--i-on2);max-width:32em}
.i19-stats{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.8fr) minmax(0,1fr);gap:12px;width:100%;margin-top:8px}
.i19-st{display:flex;flex-direction:column;justify-content:center;gap:4px;min-height:112px;padding:16px 18px;border-radius:22px;text-decoration:none;color:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid rgba(127,219,255,.14);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.i19-st-score{flex-direction:row;align-items:center;gap:16px}
.i19-st-score p{display:flex;flex-direction:column;gap:4px}
.i19-st-score p b{font:600 16px/1.25 var(--i-d);color:#fff}
.i19-st-score p span:not(.sr-only){font-size:13.5px;color:var(--i-on3)}
.i19-big-ring{position:relative;display:flex;align-items:center;justify-content:center;gap:1px;flex:none;width:88px;height:88px}
.i19-big-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.i19-big-ring .tr{fill:none;stroke:rgba(255,255,255,.1);stroke-width:7}
.i19-big-ring .ar{fill:none;stroke:url(#i19Sc);stroke-width:7;stroke-linecap:round;stroke-dasharray:0 100;filter:drop-shadow(0 0 6px rgba(56,182,255,.6));transition:stroke-dasharray 1.6s var(--i-ease) .3s}
.i19-hero.is-in .i19-big-ring .ar{stroke-dasharray:var(--s) 100}
.i19-big-ring b{position:relative;font:500 24px/1 var(--i-d);letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums}
.i19-big-ring small{position:relative;align-self:center;margin-top:7px;font:600 11px/1 var(--i-s);color:var(--i-on3)}
.i19-st-n b{font:300 44px/1 var(--i-d);letter-spacing:-.02em;color:#fff}
.i19-st-n span{font-size:13.5px;color:var(--i-on3)}
.i19-st-g{transition:border-color .3s,transform .4s var(--i-ease),background-color .3s}
.i19-st-g:hover{border-color:rgba(127,219,255,.36);transform:translateY(-3px)}
.i19-g-l{display:flex;align-items:center;gap:8px;font:600 13px/1.2 var(--i-s);color:var(--i-on2)}
.i19-gi{width:18px;height:18px}
.i19-g-arr{width:15px;height:15px;margin-left:auto;color:var(--i-cyan)}
.i19-g-v{display:flex;align-items:center;gap:10px}
.i19-g-v b{font:300 34px/1 var(--i-d);color:#fff}
.i19-stars{display:flex;gap:2px}
.i19-stars svg{width:15px;height:15px;fill:#FFC53D}
.i19-st-g small{font-size:12.5px;color:var(--i-on3)}
.i19-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font-size:15px;color:var(--i-on2)}
.i19-top > span{margin-right:4px;font:600 11.5px/1.3 var(--i-s);letter-spacing:.16em;text-transform:uppercase;color:var(--i-cyan)}
.i19-top b{font-weight:600;color:#fff}
.i19-top i{font-style:normal;color:var(--i-on3)}

/* vrtiljak */
.i19-feat{position:relative;display:flex;flex-direction:column;gap:22px;padding-top:24px}
.i19-deck span{position:absolute;left:8%;right:8%;top:0;height:60px;border-radius:30px 30px 0 0;background:rgba(255,255,255,.04);border:1px solid rgba(127,219,255,.12);border-bottom:0}
.i19-deck span + span{left:4%;right:4%;top:12px;background:rgba(255,255,255,.06)}
.i19-fc{position:relative;z-index:1;display:flex;flex-direction:column;gap:22px;min-height:400px;padding:40px 42px 34px;border-radius:32px;overflow:hidden;
  background:radial-gradient(70% 60% at 100% 0%,rgba(var(--kr),.16) 0%,rgba(var(--kr),0) 60%),linear-gradient(160deg,rgba(18,53,92,.75) 0%,rgba(9,29,55,.82) 55%,rgba(6,20,40,.9) 100%);
  border:1px solid rgba(127,219,255,.22);box-shadow:0 60px 110px -50px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.1);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:background .6s}
.i19-fc-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.i19-qi{position:absolute;right:34px;top:84px;width:110px;height:110px;fill:rgba(var(--kr),.12);transition:fill .6s}
.i19-fq{position:relative;margin-block:auto;padding-right:40px;font:300 clamp(26px,1.3vw + 12px,36px)/1.28 var(--i-d);letter-spacing:-.012em;color:#fff;text-wrap:pretty}
.i19-fc figcaption{display:flex;align-items:center;flex-wrap:wrap;gap:14px;padding-top:22px;border-top:1px solid rgba(127,219,255,.14)}
.i19-fc figcaption .i19-more{margin-left:auto}
.i19-fc-prog{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.06)}
.i19-fc-prog i{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,var(--kc),#fff)}
.i19-fc.run .i19-fc-prog i{animation:i19Prog 7s linear both}
.i19-fc.hold .i19-fc-prog i{animation-play-state:paused}
@keyframes i19Prog{to{transform:scaleX(1)}}
.i19-fc.swap > :not(.i19-fc-prog):not(.i19-qi){animation:i19Swap .55s var(--i-ease)}
.i19-fc.swap-b > :not(.i19-fc-prog):not(.i19-qi){animation:i19SwapB .55s var(--i-ease)}
@keyframes i19Swap{0%{opacity:1;transform:none}40%{opacity:0;transform:translateX(-18px)}41%{opacity:0;transform:translateX(18px)}100%{opacity:1;transform:none}}
@keyframes i19SwapB{0%{opacity:1;transform:none}40%{opacity:0;transform:translateX(18px)}41%{opacity:0;transform:translateX(-18px)}100%{opacity:1;transform:none}}
.i19-fc-nav{display:flex;align-items:center;justify-content:center;gap:16px}
.i19-dots{display:flex;gap:6px}
.i19-dot{display:grid;place-items:center;width:26px;height:26px;padding:0;border:0;background:none;cursor:pointer}
.i19-dot i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.25);transition:all .4s var(--i-ease)}
.i19-dot.is-on i{width:22px;border-radius:5px;background:var(--i-cyan)}
.i19-dot:hover i{background:rgba(255,255,255,.6)}

/* ---------- 2. izjave ---------- */
.i19-list{position:relative;padding-block:clamp(88px,6vw + 28px,150px) clamp(64px,4vw + 20px,100px);background:radial-gradient(40% 40% at 92% 10%,rgba(30,111,217,.14) 0%,rgba(30,111,217,0) 70%),linear-gradient(180deg,#050F1F 0%,#071A30 55%,#06162B 100%)}
.i19-list::before{content:"";position:absolute;top:0;left:50%;width:min(1100px,80%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.2) 50%,rgba(127,219,255,0))}
.i19-lhead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.i19-count{display:flex;align-items:center;gap:14px;font-size:15px;color:var(--i-on3);white-space:nowrap}
.i19-count b{font:600 15px/1 var(--i-s);color:#fff}
.i19-clear{min-height:36px;padding:0 14px;border-radius:999px;border:1px solid rgba(127,219,255,.3);background:rgba(127,219,255,.06);color:var(--i-cyan);font:600 13.5px/1 var(--i-s);cursor:pointer}
.i19-clear:hover{background:rgba(127,219,255,.14);color:#fff}
.i19-filters{display:flex;flex-direction:column;gap:12px;margin:40px 0 34px;padding:18px 20px;border-radius:24px;background:rgba(255,255,255,.03);border:1px solid rgba(127,219,255,.1)}
.i19-frow{display:flex;align-items:center;gap:16px}
.i19-fl{display:inline-flex;align-items:center;gap:8px;flex:none;width:168px;font:600 12px/1.3 var(--i-s);letter-spacing:.12em;text-transform:uppercase;color:var(--i-on3)}
.i19-fl .ico{width:16px;height:16px;color:var(--i-cyan)}
.i19-chips{display:flex;flex-wrap:wrap;gap:8px}
.i19-chip,.i19-tchip{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 15px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:var(--i-on);
  font:600 14px/1 var(--i-s);cursor:pointer;transition:background-color .25s,border-color .25s,color .25s,transform .3s var(--i-ease)}
.i19-chip span,.i19-tchip span{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;font-size:12px;color:var(--i-on3);background:rgba(255,255,255,.08)}
.i19-chip i{width:8px;height:8px;border-radius:50%;background:var(--kc);box-shadow:0 0 8px rgba(var(--kr),.8)}
.i19-chip:hover,.i19-tchip:hover{border-color:rgba(127,219,255,.4);transform:translateY(-1px)}
.i19-chip.is-on{color:#fff;border-color:transparent;background:linear-gradient(135deg,#38B6FF,#1E6FD9);box-shadow:0 10px 22px -12px rgba(30,111,217,.9)}
.i19-chip.is-on span{color:#fff;background:rgba(255,255,255,.22)}
.i19-tchip{min-height:36px;padding:0 13px;font-size:13.5px}
.i19-tchip.is-on{color:#03221D;border-color:transparent;background:linear-gradient(135deg,#8DF2D8,#5EF2C9)}
.i19-tchip.is-on span{color:#03221D;background:rgba(255,255,255,.4)}
.i19-tchip.is-zero{opacity:.38}
.i19-tchip.is-zero:hover{transform:none;border-color:rgba(255,255,255,.14)}

.i19-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.i19-c[hidden]{display:none}
.i19-c.pop{animation:i19Pop .55s var(--i-ease) var(--pd,0ms) both}
@keyframes i19Pop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.i19-card{position:relative;display:flex;flex-direction:column;gap:18px;height:100%;padding:28px 28px 22px;border-radius:26px;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));border:1px solid rgba(127,219,255,.12);
  transition:transform .5s var(--i-ease),border-color .4s,box-shadow .5s var(--i-ease)}
.i19-card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--kc),rgba(var(--kr),0));opacity:.85}
.i19-card::after{content:"";position:absolute;z-index:-1;left:var(--mx,50%);top:var(--my,0);width:420px;height:420px;margin:-210px 0 0 -210px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--kr),.16),rgba(var(--kr),0));opacity:0;transition:opacity .4s}
.i19-card:hover{transform:translateY(-6px);border-color:rgba(var(--kr),.42);box-shadow:0 36px 60px -36px rgba(0,0,0,.95)}
.i19-card:hover::after{opacity:1}
.i19-c-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.i19-q{font:300 21px/1.42 var(--i-d);letter-spacing:-.006em;color:#fff;text-wrap:pretty}
.i19-c-f{display:flex;align-items:center;gap:14px;margin-top:auto;padding-top:18px;border-top:1px solid rgba(127,219,255,.12)}
.i19-card .i19-more{align-self:flex-start;margin-top:-4px}
.i19-empty{display:flex;flex-direction:column;align-items:center;gap:16px;padding:60px 20px;text-align:center;color:var(--i-on2)}

.i19-more-band{position:relative;display:flex;align-items:center;justify-content:center;gap:22px;margin-top:20px;padding:26px 28px;border-radius:26px;overflow:hidden;
  background:linear-gradient(120deg,rgba(30,111,217,.16),rgba(255,255,255,.02) 60%);border:1px dashed rgba(127,219,255,.28)}
.i19-mb-t{display:inline-flex;align-items:center;gap:14px;font:500 18px/1.3 var(--i-d);color:var(--i-on)}
.i19-mb-dots{display:inline-flex;gap:5px}
.i19-mb-dots i{width:7px;height:7px;border-radius:50%;background:var(--i-cyan);animation:i19Dot 1.4s ease-in-out infinite}
.i19-mb-dots i:nth-child(2){animation-delay:.2s}
.i19-mb-dots i:nth-child(3){animation-delay:.4s}
@keyframes i19Dot{0%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-4px)}}
.i19-mb-bub{position:absolute;inset:0;pointer-events:none}
.i19-mb-bub i:nth-child(1){--x:12%;--s:8px;--t:9s;--dl:-2s}
.i19-mb-bub i:nth-child(2){--x:55%;--s:5px;--t:7s;--dl:-5s}
.i19-mb-bub i:nth-child(3){--x:86%;--s:10px;--t:10s;--dl:-1s}
.i19-mb-bub i{animation-name:i19RiseS,i19Sway}
@keyframes i19RiseS{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}10%{opacity:.7}100%{transform:translate3d(0,-160px,0) scale(1.1);opacity:0}}
.i19-trust{display:flex;align-items:flex-start;gap:16px;max-width:900px;margin:34px auto 0;padding:18px 22px;border-radius:20px;background:rgba(94,242,201,.05);border:1px solid rgba(94,242,201,.2)}
.i19-trust p{font-size:14px;line-height:1.6;color:var(--i-on2)}
.i19-trust-i{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:12px;color:#03221D;background:linear-gradient(150deg,#8DF2D8,#5EF2C9)}
.i19-trust-i .ico{width:19px;height:19px;stroke-width:2.2}

/* ---------- 3. sklep ---------- */
.i19-end{position:relative;padding-block:24px clamp(96px,6vw + 30px,150px);background:#06162B}
.i19-end-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:40px;padding:clamp(40px,4vw,64px);border-radius:36px;overflow:hidden;isolation:isolate;
  background:radial-gradient(70% 120% at 100% 0%,rgba(127,219,255,.35) 0%,rgba(127,219,255,0) 55%),linear-gradient(120deg,#1452A8 0%,#1E6FD9 55%,#2A8BEA 100%);box-shadow:0 60px 110px -50px rgba(30,111,217,.9)}
.i19-end-card .i19-h2{color:#fff}
.i19-end-card .i19-em{background:none;color:#D9F6FF;-webkit-text-fill-color:#D9F6FF}
.i19-end-t{display:flex;flex-direction:column;gap:12px}
.i19-end-t p{font-size:19px;color:rgba(255,255,255,.88)}
.i19-end-a{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px}
.i19-end .btn-primary{background:#fff;color:#0A1A2E;box-shadow:0 18px 36px -18px rgba(0,0,0,.6)}
.i19-end .btn-primary:hover{background:#EAF6FF;color:#0A1A2E}
.i19-tel{display:inline-flex;align-items:center;gap:9px;min-height:58px;padding:0 10px;font:600 17px/1 var(--i-s);color:#fff;text-decoration:none}
.i19-tel:hover{text-decoration:underline;text-underline-offset:4px}
.i19-end-bub{position:absolute;inset:0;z-index:-1;pointer-events:none}
.i19-end-bub i{border-color:rgba(255,255,255,.55);animation-name:i19RiseE,i19Sway}
.i19-end-bub i:nth-child(1){--x:6%;--s:10px;--t:16s;--dl:-3s}
.i19-end-bub i:nth-child(2){--x:22%;--s:6px;--t:12s;--dl:-8s}
.i19-end-bub i:nth-child(3){--x:41%;--s:14px;--t:19s;--dl:-1s}
.i19-end-bub i:nth-child(4){--x:58%;--s:5px;--t:13s;--dl:-10s}
.i19-end-bub i:nth-child(5){--x:77%;--s:11px;--t:17s;--dl:-6s}
.i19-end-bub i:nth-child(6){--x:92%;--s:7px;--t:14s;--dl:-12s}
@keyframes i19RiseE{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}8%{opacity:.8}100%{transform:translate3d(0,-420px,0) scale(1.1);opacity:0}}

/* ---------- okno: celotna izkušnja ---------- */
dialog.i19-m{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;overflow:hidden;color:var(--i-on);font-family:var(--i-s)}
dialog.i19-m::backdrop{background:rgba(2,8,18,.66);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
dialog.i19-m[open]::backdrop{animation:i19Fade .3s ease both}
dialog.i19-m.is-closing::backdrop{animation:i19Fade .24s ease reverse both}
@keyframes i19Fade{from{opacity:0}to{opacity:1}}
#i19-m .i19-m-wrap{display:grid;place-items:center;width:100%;height:100%;padding:28px}
#i19-m .i19-m-card{position:relative;isolation:isolate;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(760px,100%);max-height:calc(100dvh - 56px);overflow:hidden;border-radius:32px;
  background:radial-gradient(80% 50% at 100% 0%,rgba(var(--kr),.16) 0%,rgba(var(--kr),0) 60%),linear-gradient(180deg,#0B2240 0%,#081A31 40%,#050F1F 100%);border:1px solid rgba(127,219,255,.18);box-shadow:0 60px 120px -40px rgba(0,0,0,.9)}
#i19-m[open] .i19-m-card{animation:i19In .5s var(--i-ease) both}
#i19-m.is-closing .i19-m-card{animation:i19Out .24s ease both}
@keyframes i19In{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}
@keyframes i19Out{to{opacity:0;transform:translateY(10px) scale(.98)}}
#i19-m .i19-m-card.nx .i19-m-body > *{animation:i19Nx .45s var(--i-ease) both}
#i19-m .i19-m-card.pv .i19-m-body > *{animation:i19Pv .45s var(--i-ease) both}
@keyframes i19Nx{from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:none}}
@keyframes i19Pv{from{opacity:0;transform:translateX(-22px)}to{opacity:1;transform:none}}
#i19-m .i19-m-glow{position:absolute;z-index:-1;right:-120px;top:-160px;width:420px;height:420px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--kr),.22),rgba(var(--kr),0))}
#i19-m .i19-m-head{display:flex;align-items:center;gap:14px;padding:24px 24px 0 36px}
#i19-m .i19-m-pos{margin-left:auto;font:600 13px/1 var(--i-s);color:var(--i-on3);font-variant-numeric:tabular-nums}
#i19-m .i19-m-x{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff;cursor:pointer;transition:background-color .2s,transform .3s var(--i-ease)}
#i19-m .i19-m-x:hover{background:rgba(255,255,255,.14);transform:rotate(90deg)}
#i19-m .i19-m-body{overflow:auto;overscroll-behavior:contain;padding:18px 36px 26px;display:flex;flex-direction:column;gap:22px;scrollbar-width:thin;scrollbar-color:rgba(127,219,255,.3) transparent;outline:0}
#i19-m .i19-m-id{display:flex;align-items:center;gap:16px}
#i19-m .i19-av-lg{width:60px;height:60px;font-size:18px}
#i19-m .i19-m-id p{display:flex;flex-direction:column;gap:3px}
#i19-m .i19-m-id b{font:600 22px/1.2 var(--i-d);color:#fff;outline:0}
#i19-m .i19-m-id small{font-size:15px;color:var(--i-on3)}
#i19-m .i19-m-q{position:relative;padding-left:22px;font:300 clamp(22px,1vw + 14px,28px)/1.35 var(--i-d);color:#fff;text-wrap:pretty}
#i19-m .i19-m-q::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--kc),rgba(var(--kr),.1))}
#i19-m .i19-m-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#i19-m .i19-m-stats > div{display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(127,219,255,.12)}
#i19-m .i19-m-stats dt{font:600 11px/1.2 var(--i-s);letter-spacing:.12em;text-transform:uppercase;color:var(--i-on3)}
#i19-m .i19-m-stats dd{font:500 19px/1.2 var(--i-d);color:#fff}
#i19-m .i19-m-stats dd b{font-weight:600;color:var(--kc)}
#i19-m .i19-m-sec{display:flex;flex-direction:column;gap:9px}
#i19-m .i19-m-sec h3{font:600 12px/1.3 var(--i-s);letter-spacing:.16em;text-transform:uppercase;color:var(--i-cyan)}
#i19-m .i19-m-sec p{font-size:16.5px;line-height:1.62;color:var(--i-on)}
#i19-m .i19-m-it{font-style:italic;color:var(--i-on2)!important}
#i19-m .i19-m-foot{display:flex;align-items:center;gap:12px;padding:16px 24px 20px 36px;border-top:1px solid var(--i-rule);background:rgba(5,15,31,.85)}
#i19-m .i19-m-next{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:0 18px;border-radius:999px;border:1px solid rgba(127,219,255,.35);background:rgba(127,219,255,.06);color:#fff;font:600 15px/1 var(--i-s);cursor:pointer;transition:background-color .2s,border-color .2s}
#i19-m .i19-m-next .ico{width:17px;height:17px;transition:transform .3s var(--i-ease)}
#i19-m .i19-m-next:hover{background:rgba(127,219,255,.14);border-color:rgba(127,219,255,.55)}
#i19-m .i19-m-next:hover .ico{transform:translateX(4px)}
#i19-m .i19-m-cta{margin-left:auto;min-height:48px;border-radius:999px;padding:0 22px}

/* ---------- pod 1280 px ---------- */
@media (max-width:1279.98px){
  .i19-end-card{grid-template-columns:1fr}
  .i19-end-a{justify-content:flex-start}
  .i19-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .i19-st-score{grid-column:1 / -1}
  .i19-fc{padding:34px 32px 30px;min-height:420px}
  .i19-grid{gap:16px}
  .i19-card{padding:24px 22px 20px}
  .i19-q{font-size:19px}
}
/* ---------- tablica in telefon ---------- */
@media (max-width:1023.98px){
  .i19-hero{min-height:0;padding-top:150px;padding-bottom:64px}
  .i19-hero-in{grid-template-columns:1fr}
  .i19-photo{width:100%;opacity:.14}
  .i19-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .i19-lhead{flex-direction:column;align-items:flex-start}
  .i19-frow{flex-direction:column;align-items:flex-start;gap:10px}
  .i19-fl{width:auto}
  .i19-end-card{grid-template-columns:1fr}
  .i19-end-a{justify-content:flex-start}
}
@media (max-width:767.98px){
  .i19-hero h1{font-size:clamp(38px,10vw,50px)}
  .i19-stats{grid-template-columns:1fr 1fr}
  .i19-st{min-height:96px;padding:14px}
  .i19-st-n b{font-size:36px}
  .i19-fc{padding:26px 22px 24px;min-height:0;border-radius:26px}
  .i19-qi{width:70px;height:70px;right:18px;top:64px}
  .i19-fq{font-size:22px}
  .i19-fc figcaption .i19-more{margin-left:0}
  .i19-grid{grid-template-columns:1fr}
  .i19-filters{padding:14px;margin:28px 0 24px}
  .i19-chips{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:4px;scrollbar-width:none}
  .i19-chip,.i19-tchip{flex:none}
  .i19-more-band{flex-direction:column;text-align:center}
  .i19-end-card{padding:32px 22px;border-radius:28px}
  .i19-end-a .btn{width:100%}
  #i19-m .i19-m-wrap{place-items:end center;padding:0}
  #i19-m .i19-m-card{width:100%;max-height:calc(100dvh - 18px);border-radius:26px 26px 0 0}
  #i19-m .i19-m-head{padding:20px 16px 0 20px}
  #i19-m .i19-m-body{padding:16px 20px 22px}
  #i19-m .i19-m-stats{grid-template-columns:1fr 1fr 1fr;gap:6px}
  #i19-m .i19-m-stats > div{padding:10px}
  #i19-m .i19-m-stats dd{font-size:16px}
  #i19-m .i19-m-foot{flex-wrap:wrap;padding:12px 16px 16px}
  #i19-m .i19-m-cta{flex:1 1 100%;margin-left:0}
}
@media (prefers-reduced-motion:reduce){
  .i19 *,.i19 *::before,.i19 *::after,#i19-m *,#i19-m *::before,#i19-m *::after{animation:none!important;transition:none!important}
  .i19-bub,.i19-end-bub,.i19-mb-bub{display:none}
  .i19-big-ring .ar{stroke-dasharray:var(--s) 100}
}


/* ===== 20. Podstran – Blog (Verzija 2) ===== */
/* 20. Podstran – Blog (baza znanja) – Verzija 2 (22. 10. 2026)
   Nadgradnja V1 v slogu OSNUTKA 1. Novo v V2:
   – iskalnik s predlogi zadetkov (tipkovnica ↑ ↓ Enter, Esc);
   – »Začnite tukaj« kot pot v treh korakih (časovnica z vozlišči, velike naslovnice, opis, korak, napredek »0/3«, oznaka »Prebrano«);
   – mozaik področij (velike in široke ploščice, števec, zadnji članki, klik filtrira arhiv);
   – razgibane kartice: prva široka, steklena oznaka področja na naslovnici, barvni rob, »Novo«, »Prebrano«, »Shrani«;
   – pogled Mreža / Seznam, filter »Shranjeno«, obvestilo ob shranjevanju; večje in svetlejše besedilo za boljšo berljivost.
   Shranjeno, prebrano in izbran pogled se hranijo le v brskalniku obiskovalca (localStorage), brez piškotkov in brez strežnika.
   Slogi so omejeni na .b20. Namizje od 1024 px, tablica 640–1023 px, telefon do 639 px. Animacije s predpono b20. */
.b20{--on:#E8F0F8;--on2:rgba(232,240,248,.82);--on3:rgba(232,240,248,.64);--oxy:#1E6FD9;--sky:#38B6FF;--cyan:#7FDBFF;--aqua:#A9E9FF;--teal:#5EF2C9;--gold:#FFD36B;
  --rule:rgba(127,219,255,.14);--ease:cubic-bezier(.16,1,.3,1);
  --fd:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;--fs:'Instrument Sans','Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --kc:#7FDBFF;--kr:127,219,255;
  position:relative;background:#050F1F;color:var(--on);font-family:var(--fs);overflow-x:clip}
.b20 *,.b20 *::before,.b20 *::after{box-sizing:border-box}
.b20 :where(h1,h2,h3,p,ul,ol,dl,dd,figure){margin:0;padding:0}
.b20 :where(ul,ol){list-style:none}
.b20 a{color:inherit;text-decoration:none}
.b20 .ico{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.b20 :focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.b20 .wrap{position:relative;z-index:1}
.b20 .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.b20 mark{background:rgba(56,182,255,.28);color:#fff;border-radius:4px;padding:0 2px;box-shadow:0 0 0 1px rgba(127,219,255,.35)}

/* ---------- skupno ---------- */
.b20-eyebrow{display:inline-flex;align-items:center;gap:12px;font:600 12.5px/1.3 var(--fs);letter-spacing:.2em;text-transform:uppercase;color:var(--cyan)}
.b20-eyebrow::before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;box-shadow:7px -6px 0 -2.5px currentColor}
.b20-h2{font:300 clamp(34px,1.9vw + 14px,56px)/1.05 var(--fd);letter-spacing:-.022em;color:#fff;text-wrap:balance}
.b20-em{font-weight:500;background:linear-gradient(100deg,#A9E9FF 0%,#38B6FF 70%,#7FDBFF 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.b20-cat{display:inline-flex;align-items:center;gap:8px;min-width:0;font:600 11.5px/1.3 var(--fs);letter-spacing:.14em;text-transform:uppercase;color:var(--kc)}
.b20-cat::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--kc);box-shadow:0 0 10px rgba(var(--kr),.85)}
.b20-meta{display:inline-flex;align-items:center;flex-wrap:wrap;gap:7px;font-size:13.5px;line-height:1.3;color:var(--on3)}
.b20-meta .ico{width:15px;height:15px}
.b20-meta i{font-style:normal;opacity:.6}
.b20-go{display:inline-flex;align-items:center;gap:8px;font:600 15px/1.2 var(--fs);color:var(--kc)}
.b20-go .ico{width:17px;height:17px;transition:transform .35s var(--ease)}
.b20-link{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0;border:0;background:none;color:var(--cyan);font:600 15px/1.2 var(--fs);cursor:pointer}
.b20-link .ico{width:17px;height:17px;transition:transform .3s var(--ease)}
.b20-link:hover{color:#fff}
.b20-link:hover .ico{transform:translateX(4px)}
.b20-sec-line::before{content:"";position:absolute;left:50%;top:0;width:min(1200px,90%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.3),rgba(127,219,255,0))}

/* naslovnice: fotografija članka; dokler se ne naloži (ali če je ni) – grafika v barvi področja */
.b20-cov,.b20-fc-cov,.b20-fl-cov,.b20-pc-cov,.b20-row-cov{position:relative;display:block;overflow:hidden;isolation:isolate;background:#071A30}
.b20-cov img,.b20-fc-cov img,.b20-fl-cov img,.b20-pc-cov img,.b20-row-cov img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease),filter .6s}
.b20-fb{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;color:var(--kc);
  background:radial-gradient(70% 90% at 50% 50%,rgba(var(--kr),.3) 0%,rgba(var(--kr),.07) 45%,rgba(var(--kr),0) 72%),linear-gradient(150deg,#0C2747 0%,#071A30 100%)}
.b20-fb::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(var(--kr),.3) 1px,rgba(var(--kr),0) 1.6px);background-size:18px 18px;
  -webkit-mask-image:radial-gradient(55% 70% at 50% 50%,#000 0%,rgba(0,0,0,0) 100%);mask-image:radial-gradient(55% 70% at 50% 50%,#000 0%,rgba(0,0,0,0) 100%)}
.b20-fb-ring{position:absolute;left:50%;top:50%;height:74%;aspect-ratio:1;border-radius:50%;border:1px dashed rgba(var(--kr),.4);transform:translate(-50%,-50%);animation:b20Rot 48s linear infinite}
.b20-fb-r2{height:118%;border-style:solid;border-color:rgba(var(--kr),.16);animation-duration:70s;animation-direction:reverse}
.b20-fb-orb{position:relative;display:grid;place-items:center;width:clamp(46px,21%,92px);aspect-ratio:1;border-radius:50%;color:#04121F;
  background:radial-gradient(120% 100% at 30% 15%,rgba(255,255,255,.85) 0%,rgba(255,255,255,0) 52%),var(--kc);box-shadow:0 0 0 8px rgba(var(--kr),.12),0 20px 44px -12px rgba(var(--kr),.8)}
.b20-fb-orb .ico{width:44%;height:44%;stroke-width:1.8}
.b20-fl-cov .b20-fb-ring,.b20-row-cov .b20-fb-ring{display:none}
.b20-fl-cov .b20-fb-orb,.b20-row-cov .b20-fb-orb{width:52%;max-width:44px;box-shadow:0 10px 22px -10px rgba(var(--kr),.8)}

/* ---------- 1. uvod ---------- */
.b20-hero{position:relative;display:flex;align-items:center;min-height:clamp(700px,90svh,900px);padding-top:calc(var(--hh,100px) + 36px);padding-bottom:64px;
  background:radial-gradient(70% 60% at 10% 0%,rgba(56,182,255,.12) 0%,rgba(56,182,255,0) 60%),linear-gradient(180deg,#071A30 0%,#050F1F 100%)}
.b20-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.b20-photo{position:absolute;right:0;top:0;width:60%;height:100%;object-fit:cover;opacity:.2;filter:saturate(1.15) blur(1px);
  -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 45%,#000 75%,rgba(0,0,0,.2) 100%),linear-gradient(180deg,#000 50%,rgba(0,0,0,0) 100%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,rgba(0,0,0,0) 0%,#000 45%,#000 75%,rgba(0,0,0,.2) 100%),linear-gradient(180deg,#000 50%,rgba(0,0,0,0) 100%);mask-composite:intersect}
.b20-glow{position:absolute;border-radius:50%}
.b20-g1{width:900px;height:900px;right:-180px;top:-140px;background:radial-gradient(closest-side,rgba(30,111,217,.26),rgba(30,111,217,0))}
.b20-g2{width:700px;height:700px;left:-260px;bottom:-320px;background:radial-gradient(closest-side,rgba(94,242,201,.08),rgba(94,242,201,0))}
.b20-mesh{position:absolute;inset:0;opacity:.5;background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(40% 40% at 22% 40%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(40% 40% at 22% 40%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
.b20-wm{position:absolute;left:-180px;top:12%;height:min(800px,80%);width:auto;opacity:.2;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,0) 85%);mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,0) 85%)}
.b20-bub,.b20-end-bub,.b20-promo-bub{position:absolute;inset:0;pointer-events:none;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%);mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%)}
.b20-bub i,.b20-end-bub i,.b20-promo-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:b20Rise var(--t) linear var(--dl) infinite,b20Sway calc(var(--t) / 5) ease-in-out var(--dl) infinite alternate}
.b20-hero.is-off .b20-bub i{animation-play-state:paused}
.b20-bub i:nth-child(1){--x:4%;--s:9px;--t:24s;--dl:-6s}
.b20-bub i:nth-child(2){--x:12%;--s:5px;--t:19s;--dl:-12s}
.b20-bub i:nth-child(3){--x:21%;--s:13px;--t:28s;--dl:-2s}
.b20-bub i:nth-child(4){--x:33%;--s:6px;--t:21s;--dl:-16s}
.b20-bub i:nth-child(5){--x:44%;--s:10px;--t:26s;--dl:-9s}
.b20-bub i:nth-child(6){--x:52%;--s:4px;--t:17s;--dl:-4s}
.b20-bub i:nth-child(7){--x:61%;--s:12px;--t:30s;--dl:-20s}
.b20-bub i:nth-child(8){--x:69%;--s:7px;--t:22s;--dl:-1s}
.b20-bub i:nth-child(9){--x:77%;--s:15px;--t:32s;--dl:-14s}
.b20-bub i:nth-child(10){--x:85%;--s:5px;--t:18s;--dl:-8s}
.b20-bub i:nth-child(11){--x:91%;--s:9px;--t:25s;--dl:-18s}
.b20-bub i:nth-child(12){--x:97%;--s:6px;--t:20s;--dl:-11s}
.b20-hero-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:clamp(40px,5vw,96px);width:100%}
.b20-hero-t{display:flex;flex-direction:column;align-items:flex-start;gap:22px;min-width:0}
.b20-crumbs{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--on3)}
.b20-crumbs a{color:var(--on2);border-bottom:1px solid rgba(127,219,255,.25)}
.b20-crumbs a:hover{color:#fff;border-color:var(--cyan)}
.b20-crumbs [aria-current]{color:var(--cyan)}
.b20-hero h1{font:300 clamp(46px,2.6vw + 16px,80px)/1.02 var(--fd);letter-spacing:-.028em;color:#fff;text-wrap:balance}
.b20-w{display:inline-block}
.b20-lead{font-size:clamp(17.5px,.3vw + 14.5px,20px);line-height:1.62;color:var(--on2);max-width:32em}

.b20-search{position:relative;display:flex;align-items:center;width:100%;max-width:600px;min-height:66px;margin-top:6px;border-radius:999px;
  background:linear-gradient(180deg,#0D2647,#0A1E3A) padding-box,linear-gradient(120deg,rgba(127,219,255,.6),rgba(30,111,217,.3) 45%,rgba(127,219,255,.18)) border-box;
  border:1.5px solid transparent;box-shadow:0 30px 60px -36px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.08);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:box-shadow .35s var(--ease)}
.b20-search:focus-within{box-shadow:0 0 0 6px rgba(56,182,255,.16),0 30px 60px -36px rgba(0,0,0,.9)}
.b20-s-ico{position:absolute;left:24px;width:22px;height:22px;fill:none;stroke:var(--cyan);stroke-width:2;stroke-linecap:round;pointer-events:none}
.b20-search input{flex:1;min-width:0;height:62px;padding:0 64px 0 60px;border:0;background:none;color:#fff;font:500 17.5px/1 var(--fs);outline:none;-webkit-appearance:none;appearance:none}
.b20-search input::placeholder{color:var(--on3)}
.b20 .b20-search input:focus-visible,.b20 .b20-mini input:focus-visible{outline:none}
.b20-search input::-webkit-search-cancel-button{display:none}
.b20-s-type{position:absolute;left:60px;right:70px;top:50%;transform:translateY(-50%);font:500 17.5px/1 var(--fs);color:var(--on3);white-space:nowrap;overflow:hidden;pointer-events:none}
.b20-s-type:not(:empty)::after{content:"";display:inline-block;width:2px;height:1.05em;margin-left:2px;vertical-align:-3px;background:var(--cyan);animation:b20Caret 1s steps(1) infinite}
.b20.has-q .b20-s-type{display:none}
.b20-s-x{position:absolute;right:14px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
.b20-s-x:hover{background:rgba(255,255,255,.16)}
.b20-s-kbd{position:absolute;right:22px;display:grid;place-items:center;min-width:28px;height:28px;padding:0 8px;border-radius:8px;border:1px solid rgba(255,255,255,.2);font:600 13px/1 var(--fs);color:var(--on3)}
.b20.has-q .b20-s-kbd{display:none}
.b20-quick{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;color:var(--on3)}
.b20-quick span{margin-right:4px}
.b20-quick button{min-height:34px;padding:0 13px;border-radius:999px;border:1px solid rgba(127,219,255,.2);background:rgba(255,255,255,.03);color:var(--on2);font:500 13.5px/1 var(--fs);cursor:pointer;transition:background-color .2s,border-color .2s,color .2s,transform .3s var(--ease)}
.b20-quick button:hover{background:rgba(56,182,255,.14);border-color:rgba(127,219,255,.5);color:#fff;transform:translateY(-1px)}

.b20-stats{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.b20-stats>div{display:flex;flex-direction:column-reverse;gap:4px;min-width:118px;padding:14px 18px;border-radius:18px;background:rgba(255,255,255,.035);border:1px solid rgba(127,219,255,.12)}
.b20-stats dt{font-size:13px;color:var(--on3)}
.b20-stats b{font:500 30px/1 var(--fd);letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums}
.b20-stats .b20-st-last b{font-size:19px;line-height:1.15;padding-top:9px}

/* izpostavljen članek */
.b20-feat{display:flex;flex-direction:column;gap:14px;min-width:0}
.b20-fc{position:relative;display:flex;flex-direction:column;border-radius:30px;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.025));border:1px solid rgba(var(--kr),.28);
  box-shadow:0 50px 90px -50px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.02) inset;transition:transform .5s var(--ease),border-color .3s,box-shadow .5s var(--ease)}
.b20-fc::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,30%),rgba(var(--kr),.16),rgba(var(--kr),0) 60%)}
.b20-fc:hover{transform:translateY(-6px);border-color:rgba(var(--kr),.55);box-shadow:0 60px 100px -50px rgba(0,0,0,.95),0 0 60px -20px rgba(var(--kr),.5)}
.b20-fc:hover::after{opacity:1}
.b20-fc-ring{position:absolute;inset:-1px;z-index:4;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--b20a,0deg),rgba(var(--kr),0) 0deg,rgba(var(--kr),.9) 60deg,rgba(var(--kr),0) 130deg,rgba(var(--kr),0) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:b20Spin 7s linear infinite}
.b20-fc-cov{aspect-ratio:16/8.4}
.b20-fc-cov::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(5,15,31,0) 45%,rgba(5,15,31,.75) 100%)}
.b20-fc:hover .b20-fc-cov img{transform:scale(1.05)}
.b20-fc-b{position:relative;z-index:2;display:flex;flex-direction:column;gap:12px;margin-top:-34px;padding:0 30px 28px}
.b20-fc-top{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.b20-new{display:inline-flex;align-items:center;min-height:28px;padding:0 12px;border-radius:999px;font:700 11.5px/1 var(--fs);letter-spacing:.12em;text-transform:uppercase;color:#04121F;background:linear-gradient(135deg,#A9E9FF,#38B6FF);box-shadow:0 8px 20px -8px rgba(56,182,255,.9)}
.b20-fc-t{font:500 clamp(24px,.8vw + 15px,31px)/1.18 var(--fd);letter-spacing:-.018em;color:#fff;text-wrap:balance}
.b20-fc-x{font-size:16px;line-height:1.6;color:var(--on2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.b20-fc .b20-go{margin-top:4px}
.b20-fc:hover .b20-go .ico{transform:translateX(5px)}
.b20-fl{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.b20-fl-i{display:flex;gap:14px;align-items:center;height:100%;padding:12px;border-radius:20px;background:rgba(255,255,255,.035);border:1px solid rgba(127,219,255,.1);transition:background-color .25s,border-color .25s,transform .4s var(--ease)}
.b20-fl-i:hover{background:rgba(255,255,255,.07);border-color:rgba(var(--kr),.45);transform:translateY(-3px)}
.b20-fl-cov{flex:0 0 76px;width:76px;height:76px;border-radius:14px}
.b20-fl-b{display:flex;flex-direction:column;gap:6px;min-width:0}
.b20-fl-b .b20-cat{font-size:10.5px}
.b20-fl-t{font:600 14.5px/1.3 var(--fd);color:#fff;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.b20-fl .b20-meta{font-size:12.5px}


/* predlogi pod iskalnikom */
.b20-search{z-index:5}
.b20-sug{position:absolute;left:0;right:0;top:calc(100% + 10px);z-index:20;display:flex;flex-direction:column;gap:2px;padding:8px;border-radius:24px;
  background:#0B2140;border:1px solid rgba(127,219,255,.24);box-shadow:0 40px 80px -30px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.06);animation:b20Fade .25s var(--ease)}
.b20-sug[hidden]{display:none}
.b20-sug-i{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 14px;border-radius:16px;transition:background-color .2s}
.b20-sug-i>i{width:9px;height:9px;border-radius:50%;background:var(--kc);box-shadow:0 0 10px rgba(var(--kr),.85)}
.b20-sug-i>span{display:flex;flex-direction:column;gap:3px;min-width:0}
.b20-sug-i b{font:600 15px/1.35 var(--fd);color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.b20-sug-i small{font-size:12.5px;line-height:1.3;color:var(--on3)}
.b20-sug-i>.ico{width:16px;height:16px;color:var(--cyan);opacity:0;transform:translateX(-4px);transition:opacity .2s,transform .3s var(--ease)}
.b20-sug-i:hover,.b20-sug-i.is-on{background:rgba(56,182,255,.13)}
.b20-sug-i:hover>.ico,.b20-sug-i.is-on>.ico{opacity:1;transform:none}
.b20-sug-all{display:flex;align-items:center;gap:10px;min-height:46px;margin-top:4px;padding:0 14px;border:0;border-top:1px solid rgba(127,219,255,.12);border-radius:0 0 16px 16px;background:none;
  color:var(--cyan);font:600 14px/1.2 var(--fs);text-align:left;cursor:pointer}
.b20-sug-all .ico{width:16px;height:16px}
.b20-sug-all:hover{color:#fff}
.b20-sug-0{padding:14px;font-size:14.5px;line-height:1.5;color:var(--on2)}

/* ---------- 2. začnite tukaj: pot v treh korakih ---------- */
.b20-start{position:relative;padding-block:clamp(48px,2vw + 24px,72px) clamp(70px,3vw + 36px,110px);background:#050F1F}
.b20-start-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px 48px}
.b20-start-ht{display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:760px}
.b20-start-lead{font-size:clamp(16.5px,.2vw + 14px,18px);line-height:1.65;color:var(--on2);max-width:40em}
.b20-path-prog{display:flex;align-items:center;gap:14px;flex:none;padding:8px 22px 8px 8px;border-radius:999px;background:rgba(255,255,255,.035);border:1px solid rgba(127,219,255,.16);transition:border-color .4s}
.b20-pp-ring{position:relative;display:grid;place-items:center;width:52px;height:52px}
.b20-pp-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.b20-pp-ring circle{fill:none;stroke-width:3.5}
.b20-pp-ring .tr{stroke:rgba(127,219,255,.15)}
.b20-pp-ring .ar{stroke:var(--cyan);stroke-linecap:round;stroke-dasharray:0 100;transition:stroke-dasharray .9s var(--ease),stroke .4s}
.b20-pp-ring b{font:600 14px/1 var(--fd);color:#fff;font-variant-numeric:tabular-nums}
.b20-pp-t{display:flex;flex-direction:column;gap:4px}
.b20-pp-t b{font:600 15px/1.2 var(--fd);color:#fff}
.b20-pp-t span{font-size:13.5px;line-height:1.3;color:var(--on3)}
.b20-path-prog.is-done{border-color:rgba(94,242,201,.4)}
.b20-path-prog.is-done .ar{stroke:var(--teal)}

.b20-path{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:40px;padding-top:58px}
.b20-path::before{content:"";position:absolute;left:calc((100% - 48px) / 6);right:calc((100% - 48px) / 6);top:17px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,rgba(127,219,255,.6),rgba(56,182,255,.35) 50%,rgba(127,219,255,.15))}
.b20-path::after{content:"";position:absolute;top:13px;left:calc((100% - 48px) / 6);width:10px;height:10px;margin-left:-5px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 4px rgba(127,219,255,.22),0 0 18px 5px rgba(127,219,255,.75);animation:b20Travel 6s var(--ease) infinite;pointer-events:none}
.b20-step{position:relative;display:flex;min-width:0}
.b20-node{position:absolute;left:50%;top:-58px;z-index:2;display:grid;place-items:center;width:36px;height:36px;margin-left:-18px;border-radius:50%;
  background:#0A1E3A;border:1.5px solid rgba(127,219,255,.5);color:#fff;font:600 14px/1 var(--fd);box-shadow:0 0 0 7px #050F1F;transition:background-color .4s,border-color .4s}
.b20-node::after{content:"";position:absolute;left:50%;top:100%;width:1px;height:21px;margin-left:-.5px;background:linear-gradient(rgba(127,219,255,.5),rgba(127,219,255,0))}
.b20-node-ok{display:none;width:18px;height:18px;stroke-width:2.6}
.b20-step.is-first .b20-node{background:linear-gradient(135deg,#7FDBFF,#1E6FD9);border-color:transparent;box-shadow:0 0 0 7px #050F1F,0 0 26px rgba(56,182,255,.75)}
.b20-step.is-first:not(.is-read) .b20-node::before{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid rgba(127,219,255,.75);animation:b20Ping 2.4s ease-out infinite}
.b20-step.is-read .b20-node{background:var(--teal);border-color:transparent;color:#04121F;box-shadow:0 0 0 7px #050F1F,0 0 22px rgba(94,242,201,.55)}
.b20-step.is-read .b20-node b{display:none}
.b20-step.is-read .b20-node-ok{display:block}

.b20-pc{position:relative;display:flex;flex-direction:column;width:100%;border-radius:28px;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.02));border:1px solid rgba(127,219,255,.16);
  box-shadow:0 40px 80px -50px rgba(0,0,0,.95);transition:transform .5s var(--ease),border-color .3s,box-shadow .5s var(--ease)}
.b20-pc::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,30%),rgba(var(--kr),.14),rgba(var(--kr),0) 60%)}
.b20-step.is-first .b20-pc{border-color:rgba(127,219,255,.42);background:linear-gradient(180deg,rgba(56,182,255,.13),rgba(255,255,255,.02) 65%);box-shadow:0 40px 80px -50px rgba(0,0,0,.95),0 0 60px -30px rgba(56,182,255,.8)}
.b20-pc:hover{transform:translateY(-8px);border-color:rgba(var(--kr),.6);box-shadow:0 50px 90px -50px rgba(0,0,0,.95),0 0 60px -24px rgba(var(--kr),.75)}
.b20-pc:hover::after{opacity:1}
.b20-pc-top{position:relative;display:block}
.b20-pc-cov{aspect-ratio:16/9}
.b20-pc-cov::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(5,15,31,.35) 0%,rgba(5,15,31,0) 30%,rgba(5,15,31,0) 50%,rgba(8,22,42,.92) 100%)}
.b20-pc:hover .b20-pc-cov img{transform:scale(1.06)}
.b20-pc-n{position:absolute;left:20px;bottom:-30px;z-index:3;font:200 88px/1 var(--fd);letter-spacing:-.05em;font-variant-numeric:tabular-nums;
  background:linear-gradient(180deg,#fff 15%,rgba(127,219,255,.4) 92%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 8px 20px rgba(0,0,0,.45));transition:transform .6s var(--ease)}
.b20-pc:hover .b20-pc-n{transform:translateY(-4px)}
.b20-pc-flag,.b20-pc-read{position:absolute;top:16px;z-index:3;display:inline-flex;align-items:center;gap:7px;min-height:30px;padding:0 12px;border-radius:999px;font:700 11.5px/1 var(--fs);letter-spacing:.12em;text-transform:uppercase;color:#04121F}
.b20-pc-flag{left:16px;background:linear-gradient(135deg,#A9E9FF,#38B6FF);box-shadow:0 10px 24px -10px rgba(56,182,255,.95)}
.b20-pc-read{right:16px;background:#7FE3D6;box-shadow:0 10px 24px -10px rgba(94,242,201,.9)}
.b20-pc-flag .ico,.b20-pc-read .ico{width:14px;height:14px;stroke-width:2.6}
.b20-pc-b{position:relative;z-index:2;display:flex;flex-direction:column;gap:12px;flex:1;padding:32px 26px 24px}
.b20-pc-k{font:600 12px/1.35 var(--fs);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}
.b20-pc-t{font:600 21px/1.28 var(--fd);letter-spacing:-.012em;color:#fff;text-wrap:pretty}
.b20-pc-x{font-size:15.5px;line-height:1.62;color:var(--on2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.b20-pc-f{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:auto;padding-top:16px;border-top:1px solid rgba(127,219,255,.1)}
.b20-pc-go{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 18px;border-radius:999px;border:1px solid rgba(127,219,255,.35);color:#fff;font:600 14px/1 var(--fs);
  transition:background-color .25s,color .25s,border-color .25s,box-shadow .25s}
.b20-pc-go .ico{width:16px;height:16px;transition:transform .3s var(--ease)}
.b20-step.is-first .b20-pc-go{background:linear-gradient(135deg,#38B6FF,#1E6FD9);border-color:transparent;box-shadow:0 12px 26px -12px rgba(56,182,255,.95)}
.b20-step.is-read .b20-pc-go{border-color:rgba(94,242,201,.4);background:none;box-shadow:none}
.b20-pc:hover .b20-pc-go{background:#fff;color:#0A1A2E;border-color:#fff}
.b20-pc:hover .b20-pc-go .ico{transform:translateX(4px)}

/* ---------- 3. področja: mozaik ---------- */
.b20-areas{position:relative;padding-block:clamp(70px,3vw + 36px,110px) clamp(40px,2vw + 20px,64px);background:linear-gradient(180deg,#050F1F 0%,#06162B 100%)}
.b20-areas-head{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:36px}
.b20-bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.b20-bt{position:relative;display:flex;flex-direction:column;gap:12px;min-height:214px;padding:22px 24px;border-radius:26px;overflow:hidden;isolation:isolate;
  background:linear-gradient(160deg,rgba(var(--kr),.15) 0%,rgba(var(--kr),.04) 45%,rgba(255,255,255,.02) 100%);border:1px solid rgba(var(--kr),.24);
  transition:transform .5s var(--ease),border-color .3s,box-shadow .5s var(--ease)}
.b20-bt.is-big{grid-column:span 2;min-height:278px;padding:28px 30px}
.b20-bt.is-wide{grid-column:span 2;min-height:190px}
.b20-bt-btn{position:absolute;inset:0;z-index:1;width:100%;height:100%;padding:0;border:0;border-radius:inherit;background:none;cursor:pointer}
.b20 .b20-bt-btn:focus-visible{outline-offset:-4px}
.b20-bt-glow{position:absolute;right:-26%;top:-48%;z-index:-1;width:78%;aspect-ratio:1;border-radius:50%;opacity:.75;pointer-events:none;
  background:radial-gradient(closest-side,rgba(var(--kr),.38),rgba(var(--kr),0));transition:transform .8s var(--ease),opacity .5s}
.b20-bt::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(360px circle at var(--mx,50%) var(--my,30%),rgba(var(--kr),.16),rgba(var(--kr),0) 60%)}
.b20-bt:hover{transform:translateY(-5px);border-color:rgba(var(--kr),.62);box-shadow:0 40px 70px -40px rgba(0,0,0,.95),0 0 50px -22px rgba(var(--kr),.75)}
.b20-bt:hover::after{opacity:1}
.b20-bt:hover .b20-bt-glow{transform:scale(1.3);opacity:1}
.b20-bt-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;pointer-events:none}
.b20-bt-orb{display:grid;place-items:center;width:52px;height:52px;border-radius:17px;color:#04121F;
  background:radial-gradient(120% 100% at 30% 10%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 55%),var(--kc);box-shadow:0 14px 30px -12px rgba(var(--kr),.95);transition:transform .5s var(--ease)}
.b20-bt-orb .ico{width:25px;height:25px}
.b20-bt.is-big .b20-bt-orb{width:60px;height:60px;border-radius:19px}
.b20-bt.is-big .b20-bt-orb .ico{width:28px;height:28px}
.b20-bt:hover .b20-bt-orb{transform:rotate(-6deg) scale(1.06)}
.b20-bt-n{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:12.5px;color:var(--on3)}
.b20-bt-n b{font:300 38px/1 var(--fd);letter-spacing:-.03em;color:#fff;font-variant-numeric:tabular-nums}
.b20-bt-name{margin-top:auto;font:600 20px/1.2 var(--fd);letter-spacing:-.01em;color:#fff;pointer-events:none}
.b20-bt.is-big .b20-bt-name{font-size:26px}
.b20-bt-l{position:relative;z-index:2;display:flex;flex-direction:column;align-self:flex-start;max-width:100%}
.b20-bt-l a{position:relative;display:block;max-width:100%;padding:5px 0 5px 16px;font-size:14px;line-height:1.4;color:var(--on2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .2s}
.b20-bt-l a::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--kc);opacity:.85}
.b20-bt-l a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(var(--kr),.7)}
.b20-bt-go{display:inline-flex;align-items:center;gap:8px;font:600 14px/1 var(--fs);color:var(--kc);pointer-events:none}
.b20-bt-go .ico{width:16px;height:16px;transition:transform .3s var(--ease)}
.b20-bt:hover .b20-bt-go .ico{transform:translateX(5px)}

/* ---------- 4. arhiv: vsi članki ---------- */
.b20-arch{position:relative;padding-block:clamp(70px,4vw + 30px,110px) 40px;background:#06162B}
.b20-arch::before{content:"";position:absolute;left:50%;top:0;width:min(1200px,90%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,rgba(127,219,255,0),rgba(127,219,255,.35),rgba(127,219,255,0))}
.b20-arch-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:22px}
.b20-arch-t{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.b20-arch-note{max-width:620px;font-size:15px;line-height:1.6;color:var(--on3)}
.b20-bar{position:sticky;top:69px;z-index:6;display:flex;align-items:center;padding:10px 12px;margin-inline:-12px;border-radius:24px;
  background:rgba(6,22,43,.0);border:1px solid rgba(127,219,255,0);transition:background-color .35s,border-color .35s,box-shadow .35s,-webkit-backdrop-filter .35s,backdrop-filter .35s}
.b20-bar.is-stuck{background:rgba(6,22,43,.95);border-color:rgba(127,219,255,.14);box-shadow:0 24px 50px -30px rgba(0,0,0,.95);-webkit-backdrop-filter:saturate(150%) blur(16px);backdrop-filter:saturate(150%) blur(16px)}
.b20-chips{display:flex;flex-wrap:nowrap;gap:8px;min-width:0;width:100%;overflow-x:auto;scrollbar-width:none;padding:6px 4px 16px;margin-block:-6px -16px;scroll-padding-inline:12px}
.b20-chips::-webkit-scrollbar{display:none}
.b20-chips.is-more{padding-right:36px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 70px),rgba(0,0,0,0));mask-image:linear-gradient(90deg,#000 calc(100% - 70px),rgba(0,0,0,0))}
.b20-chips.is-less{-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0),#000 70px);mask-image:linear-gradient(90deg,rgba(0,0,0,0),#000 70px)}
.b20-chips.is-less.is-more{-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0),#000 70px,#000 calc(100% - 70px),rgba(0,0,0,0));mask-image:linear-gradient(90deg,rgba(0,0,0,0),#000 70px,#000 calc(100% - 70px),rgba(0,0,0,0))}
.b20-cs{position:absolute;top:50%;z-index:2;display:grid;place-items:center;width:40px;height:40px;margin-top:-20px;border-radius:50%;border:1px solid rgba(127,219,255,.3);background:#0A2140;color:#fff;cursor:pointer;box-shadow:0 10px 24px -10px rgba(0,0,0,.9);transition:background-color .2s,transform .3s var(--ease)}
.b20-cs[hidden]{display:none}
.b20-cs .ico{width:17px;height:17px}
.b20-cs:hover{background:#1E6FD9;transform:scale(1.06)}
.b20-cs-l{left:6px}
.b20-cs-r{right:6px}
.b20-chip{flex:none;display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:0 8px 0 13px;border-radius:999px;border:1px solid rgba(127,219,255,.16);background:rgba(255,255,255,.035);
  color:var(--on2);font:600 13.5px/1 var(--fs);cursor:pointer;white-space:nowrap;transition:background-color .25s,border-color .25s,color .25s,transform .3s var(--ease),box-shadow .3s}
.b20-chip .ico{width:15px;height:15px;color:var(--cyan)}
.b20-chip i{width:8px;height:8px;border-radius:50%;background:var(--kc);box-shadow:0 0 9px rgba(var(--kr),.85)}
.b20-chip span{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 7px;border-radius:999px;font-size:12px;color:var(--on3);background:rgba(255,255,255,.08);font-variant-numeric:tabular-nums;transition:background-color .25s,color .25s}
.b20-chip:hover{border-color:rgba(var(--kr),.55);color:#fff;transform:translateY(-1px)}
.b20-chip.is-on{color:#04121F;border-color:transparent;background:var(--kc);box-shadow:0 12px 26px -12px rgba(var(--kr),.95)}
.b20-chip[data-a="all"].is-on{color:#fff;background:linear-gradient(135deg,#38B6FF,#1E6FD9)}
.b20-chip.is-on .ico{color:#fff}
.b20-chip.is-on i{background:#04121F;box-shadow:none}
.b20-chip.is-on span{color:inherit;background:rgba(255,255,255,.28)}
.b20-chip.is-zero{opacity:.45}
.b20-tools{display:flex;align-items:center;gap:8px;flex:none;padding-bottom:4px}
.b20-mini{position:relative;display:flex;align-items:center;width:260px;height:46px;border-radius:999px;border:1px solid rgba(127,219,255,.16);background:rgba(255,255,255,.035);transition:border-color .25s,width .4s var(--ease),background-color .25s}
.b20-mini:focus-within{border-color:rgba(127,219,255,.6);width:300px;background:rgba(255,255,255,.06)}
.b20-mini .ico{position:absolute;left:14px;width:16px;height:16px;color:var(--cyan)}
.b20-mini input{width:100%;height:100%;padding:0 14px 0 38px;border:0;background:none;color:#fff;font:500 14px/1 var(--fs);outline:none;-webkit-appearance:none;appearance:none}
.b20-mini input::placeholder{color:var(--on3)}
.b20-sort{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 16px;border-radius:999px;border:1px solid rgba(127,219,255,.16);background:rgba(255,255,255,.035);color:var(--on2);font:600 14px/1 var(--fs);cursor:pointer;transition:border-color .25s,color .25s,background-color .25s}
.b20-sort .ico{width:16px;height:16px;color:var(--cyan)}
.b20-sort:hover{border-color:rgba(127,219,255,.5);color:#fff}

.b20-area-info:not(:empty){margin-top:18px}
.b20-ai{display:flex;align-items:center;gap:18px;padding:18px 22px;border-radius:22px;background:linear-gradient(100deg,rgba(var(--kr),.13),rgba(var(--kr),.02) 70%);border:1px solid rgba(var(--kr),.28);animation:b20Fade .45s var(--ease)}
.b20-ai-ico{display:grid;place-items:center;flex:none;width:50px;height:50px;border-radius:16px;color:#04121F;background:radial-gradient(120% 100% at 30% 10%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 55%),var(--kc);box-shadow:0 12px 26px -12px rgba(var(--kr),.95)}
.b20-ai-ico .ico{width:24px;height:24px}
.b20-ai p{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.b20-ai b{font:600 17px/1.25 var(--fd);color:#fff}
.b20-ai p span{font-size:14.5px;line-height:1.55;color:var(--on2)}
.b20-ai .b20-link{flex:none;color:var(--kc)}
.b20-res:not(:empty){margin-top:16px;font-size:14.5px;color:var(--on2)}


/* pogled mreža / seznam */
.b20-view{display:inline-flex;gap:2px;height:46px;padding:3px;border-radius:999px;border:1px solid rgba(127,219,255,.16);background:rgba(255,255,255,.035)}
.b20-view button{display:grid;place-items:center;width:42px;height:100%;padding:0;border:0;border-radius:999px;background:none;color:var(--on3);cursor:pointer;transition:background-color .25s,color .25s,box-shadow .25s}
.b20-view button .ico{width:17px;height:17px}
.b20-view button:hover{color:#fff}
.b20-view button[aria-pressed="true"]{background:rgba(56,182,255,.2);color:#fff;box-shadow:inset 0 0 0 1px rgba(127,219,255,.4)}
/* filter »Shranjeno« */
.b20-chip-s{border-color:rgba(255,211,107,.38)}
.b20-chip-s .ico{color:var(--gold);fill:rgba(255,211,107,.3)}
.b20-chip-s:hover{border-color:rgba(255,211,107,.7)}
.b20-chip.b20-chip-s.is-on{background:var(--gold);color:#3A2A00;box-shadow:0 12px 26px -12px rgba(255,211,107,.9)}
.b20-chip.b20-chip-s.is-on .ico{color:#3A2A00;fill:currentColor}

/* ---------- kartice člankov ---------- */
.b20-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:28px;transition:opacity .18s,transform .18s}
.b20-grid.is-out{opacity:0;transform:translateY(8px)}
.b20-li{display:flex;min-width:0}
.b20-li.is-in{animation:b20Up .7s var(--ease) backwards;animation-delay:calc(var(--i,0) * 55ms)}
.b20-li.is-wide{grid-column:span 2}
.b20-card{position:relative;display:flex;flex-direction:column;width:100%;border-radius:28px;overflow:hidden;isolation:isolate;cursor:pointer;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid rgba(127,219,255,.12);
  transition:transform .5s var(--ease),border-color .3s,box-shadow .5s var(--ease)}
.b20-card::before{content:"";position:absolute;left:0;right:0;top:0;z-index:4;height:3px;pointer-events:none;transform-origin:0 50%;transform:scaleX(.28);
  background:linear-gradient(90deg,var(--kc),rgba(var(--kr),.35));box-shadow:0 0 14px rgba(var(--kr),.8);transition:transform .7s var(--ease)}
.b20-card::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(400px circle at var(--mx,50%) var(--my,30%),rgba(var(--kr),.14),rgba(var(--kr),0) 60%)}
.b20-card:hover{transform:translateY(-6px);border-color:rgba(var(--kr),.5);box-shadow:0 40px 70px -40px rgba(0,0,0,.95),0 0 50px -22px rgba(var(--kr),.65)}
.b20-card:hover::before{transform:scaleX(1)}
.b20-card:hover::after{opacity:1}
.b20-cov-w{position:relative;display:flex;flex-direction:column}
.b20-cov{flex:1;aspect-ratio:16/10}
.b20-cov::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(5,15,31,.32) 0%,rgba(5,15,31,0) 28%,rgba(5,15,31,0) 55%,rgba(6,22,43,.72) 100%)}
.b20-card:hover .b20-cov img{transform:scale(1.06)}
.b20-cat-g{position:absolute;left:14px;bottom:14px;z-index:3;min-height:30px;padding:0 12px 0 10px;border-radius:999px;font-size:11px;color:#fff;
  background:rgba(5,15,31,.62);border:1px solid rgba(var(--kr),.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.b20-badges{position:absolute;left:14px;top:14px;z-index:3;display:flex;flex-wrap:wrap;gap:6px}
.b20-badge{display:inline-flex;align-items:center;gap:5px;min-height:28px;padding:0 11px;border-radius:999px;font:700 11px/1 var(--fs);letter-spacing:.1em;text-transform:uppercase;color:#04121F;white-space:nowrap}
.b20-badge .ico{width:13px;height:13px;stroke-width:2.8}
.b20-badge-new{background:linear-gradient(135deg,#A9E9FF,#38B6FF);box-shadow:0 8px 20px -8px rgba(56,182,255,.95)}
.b20-badge-read{background:#7FE3D6;letter-spacing:.06em}
.b20-bm{position:absolute;right:14px;top:14px;z-index:5;display:grid;place-items:center;width:42px;height:42px;padding:0;border-radius:50%;border:1px solid rgba(255,255,255,.24);
  background:rgba(5,15,31,.52);color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background-color .2s,color .2s,border-color .2s,transform .3s var(--ease)}
.b20-bm .ico{width:18px;height:18px}
.b20-bm:hover{background:rgba(5,15,31,.78);border-color:rgba(255,211,107,.75);color:var(--gold);transform:scale(1.07)}
.b20-bm.is-on{background:var(--gold);border-color:var(--gold);color:#3A2A00}
.b20-bm.is-on .ico{fill:currentColor}
.b20-bm.is-pop{animation:b20Pop .5s var(--ease)}
.b20-cb{position:relative;z-index:2;display:flex;flex-direction:column;gap:12px;flex:1;padding:22px 26px 24px}
.b20-cb-cat{display:none}
.b20-ct{font:600 20px/1.3 var(--fd);letter-spacing:-.012em;color:#fff;text-wrap:pretty}
.b20-ct a{background-image:linear-gradient(rgba(var(--kr),.85),rgba(var(--kr),.85));background-repeat:no-repeat;background-position:0 100%;background-size:0% 1.5px;transition:background-size .6s var(--ease)}
.b20-card:hover .b20-ct a{background-size:100% 1.5px}
.b20-cx{font-size:15.5px;line-height:1.62;color:var(--on2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.b20-cf{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:16px;border-top:1px solid rgba(127,219,255,.1)}
.b20-cf-m{display:inline-flex;align-items:center;flex-wrap:wrap;gap:7px;font-size:13.5px;line-height:1.3;color:var(--on3)}
.b20-cf-m .ico{width:15px;height:15px}
.b20-cf-m i{font-style:normal;opacity:.6}
.b20-cf-go{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;border:1px solid rgba(var(--kr),.42);color:var(--kc);transition:background-color .3s,color .3s,border-color .3s,transform .4s var(--ease)}
.b20-cf-go .ico{width:17px;height:17px}
.b20-cf-go>span{display:none}
.b20-li.is-wide .b20-cf-go{display:inline-flex;align-items:center;gap:8px;width:auto;height:44px;padding:0 20px;border-color:transparent;background:var(--kc);color:#04121F;font:600 14.5px/1 var(--fs);box-shadow:0 14px 30px -14px rgba(var(--kr),.95)}
.b20-li.is-wide .b20-cf-go>span{display:inline}
.b20-li.is-wide .b20-card:hover .b20-cf-go{background:#fff;border-color:#fff;color:#0A1A2E}
.b20-card:hover .b20-cf-go{background:var(--kc);border-color:var(--kc);color:#04121F;transform:translateX(3px)}
.b20-card.is-read .b20-ct,.b20-row.is-read .b20-row-t{color:rgba(255,255,255,.78)}

/* prva kartica: široka */
.b20-li.is-wide .b20-card{flex-direction:row;min-height:370px}
.b20-li.is-wide .b20-cov-w{flex:0 0 52%}
.b20-li.is-wide .b20-cov{aspect-ratio:auto}
.b20-li.is-wide .b20-cov::after{background:linear-gradient(90deg,rgba(6,22,43,0) 62%,rgba(6,22,43,.5) 100%),linear-gradient(180deg,rgba(5,15,31,.32) 0%,rgba(5,15,31,0) 28%)}
.b20-li.is-wide .b20-bm{right:auto;left:calc(52% - 56px)}
.b20-li.is-wide .b20-cb{gap:16px;padding:36px 34px 30px}
.b20-li.is-wide .b20-cb-cat{display:block}
.b20-li.is-wide .b20-cat-g{display:none}
.b20-li.is-wide .b20-ct{font-size:clamp(23px,.5vw + 16px,28px);line-height:1.22;letter-spacing:-.018em;text-wrap:balance}
.b20-li.is-wide .b20-cx{font-size:16.5px;-webkit-line-clamp:5}

/* pogled: seznam */
.b20-grid.is-list{grid-template-columns:minmax(0,1fr);gap:10px}
.b20-row{position:relative;display:grid;grid-template-columns:136px minmax(0,1fr) auto 42px;align-items:center;gap:22px;width:100%;padding:12px 18px 12px 12px;border-radius:22px;cursor:pointer;
  background:rgba(255,255,255,.03);border:1px solid rgba(127,219,255,.1);transition:background-color .25s,border-color .25s,transform .4s var(--ease)}
.b20-row::before{content:"";position:absolute;left:-1px;top:20px;bottom:20px;width:3px;border-radius:0 3px 3px 0;background:var(--kc);box-shadow:0 0 12px rgba(var(--kr),.8)}
.b20-row:hover{background:rgba(255,255,255,.06);border-color:rgba(var(--kr),.45);transform:translateX(4px)}
.b20-row-cov{width:136px;height:90px;border-radius:14px}
.b20-row:hover .b20-row-cov img{transform:scale(1.06)}
.b20-row-b{display:flex;flex-direction:column;gap:6px;min-width:0}
.b20-row-top{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px}
.b20-row-top .b20-badges{position:static}
.b20-row-top .b20-badge{min-height:22px;padding:0 8px;font-size:10px}
.b20-row-t{font:600 17.5px/1.32 var(--fd);color:#fff;text-wrap:pretty}
.b20-row-x{font-size:14.5px;line-height:1.5;color:var(--on3);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.b20-row-m{display:flex;flex-direction:column;align-items:flex-end;gap:6px;font-size:13px;color:var(--on3);white-space:nowrap}
.b20-row-m span{display:inline-flex;align-items:center;gap:6px}
.b20-row-m .ico{width:14px;height:14px}
.b20-row .b20-bm{position:static;width:42px;height:42px;background:rgba(255,255,255,.04);border-color:rgba(127,219,255,.2);-webkit-backdrop-filter:none;backdrop-filter:none}
.b20-row .b20-bm.is-on{background:var(--gold);border-color:var(--gold)}
.b20-grid.is-list .b20-promo{padding:28px 32px}

/* obvestilo (shranjeno) */
.b20-toast{position:fixed;left:50%;bottom:28px;z-index:60;max-width:calc(100% - 32px);padding:14px 20px;border-radius:16px;background:#0E2A4D;border:1px solid rgba(255,211,107,.4);
  color:#fff;font:500 14.5px/1.4 var(--fs);box-shadow:0 30px 60px -20px rgba(0,0,0,.9);opacity:0;visibility:hidden;transform:translate(-50%,16px);pointer-events:none;
  transition:opacity .3s,transform .45s var(--ease),visibility 0s .45s}
.b20-toast.is-on{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .3s,transform .45s var(--ease),visibility 0s}

/* poziv med karticami */
.b20-li-promo{display:flex}
.b20-promo{position:relative;display:flex;flex-direction:column;justify-content:center;gap:16px;width:100%;padding:34px 30px;border-radius:26px;overflow:hidden;isolation:isolate;
  background:radial-gradient(90% 70% at 100% 0%,rgba(56,182,255,.32) 0%,rgba(56,182,255,0) 60%),linear-gradient(160deg,#0E3866 0%,#0A2547 55%,#071A30 100%);border:1px solid rgba(127,219,255,.28);
  box-shadow:0 40px 70px -40px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.08)}
.b20-promo-bub{z-index:-1}
.b20-promo-bub i{border-color:rgba(255,255,255,.5);animation-name:b20RiseS,b20Sway}
.b20-promo-bub i:nth-child(1){--x:10%;--s:9px;--t:12s;--dl:-2s}
.b20-promo-bub i:nth-child(2){--x:38%;--s:5px;--t:10s;--dl:-6s}
.b20-promo-bub i:nth-child(3){--x:66%;--s:12px;--t:14s;--dl:-9s}
.b20-promo-bub i:nth-child(4){--x:88%;--s:6px;--t:11s;--dl:-4s}
.b20-promo-t{font:300 30px/1.12 var(--fd);letter-spacing:-.02em;color:#fff}
.b20-promo-t .b20-em{background:none;color:#D9F6FF;-webkit-text-fill-color:#D9F6FF;font-weight:500}
.b20-promo-x{font-size:15px;line-height:1.6;color:var(--on2)}
.b20-promo-a{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:4px}
.b20-promo .btn-primary{background:#fff;color:#0A1A2E}
.b20-promo .btn-primary:hover{background:#EAF6FF;color:#0A1A2E}
.b20-tel{display:inline-flex;align-items:center;gap:9px;min-height:48px;font:600 16px/1 var(--fs);color:#fff}
.b20-tel .ico{width:18px;height:18px}
.b20-tel:hover{text-decoration:underline;text-underline-offset:4px}

.b20-empty{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:560px;margin:40px auto 10px;padding:40px 28px;text-align:center;border-radius:28px;background:rgba(255,255,255,.03);border:1px dashed rgba(127,219,255,.25)}
.b20-empty[hidden]{display:none}
.b20-empty-ico{display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:rgba(56,182,255,.12);color:var(--cyan)}
.b20-empty-ico .ico{width:26px;height:26px}
.b20-empty-t{font:500 22px/1.3 var(--fd);color:#fff}
.b20-empty p{font-size:15px;line-height:1.6;color:var(--on2)}
.b20-empty-a{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 18px;margin-top:6px}

.b20-more{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:44px}
.b20-more[hidden]{display:none}
.b20-prog{width:min(320px,80%);height:3px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.b20-prog i{display:block;height:100%;transform-origin:0 50%;background:linear-gradient(90deg,#1E6FD9,#7FDBFF);transition:transform .6s var(--ease)}
.b20-more p{font-size:14px;color:var(--on3)}
.b20-more-btn{display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:0 28px;border-radius:999px;border:1.5px solid rgba(255,255,255,.4);background:rgba(255,255,255,.03);color:#fff;font:600 15.5px/1 var(--fs);cursor:pointer;transition:background-color .25s,color .25s,border-color .25s,transform .3s var(--ease)}
.b20-more-btn .ico{width:18px;height:18px;transition:transform .3s var(--ease)}
.b20-more-btn:hover{background:#fff;color:#0A1A2E;border-color:#fff;transform:translateY(-2px)}
.b20-more-btn:hover .ico{transform:translateY(3px)}
.b20-more-btn[hidden]{display:none}

/* ---------- 5. sklepni poziv ---------- */
.b20-end{position:relative;padding-block:40px clamp(96px,6vw + 30px,150px);background:#06162B}
.b20-end-card{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) auto;align-items:center;gap:30px 48px;padding:clamp(40px,3vw + 16px,64px);border-radius:36px;overflow:hidden;isolation:isolate;
  background:radial-gradient(70% 90% at 100% 0%,rgba(56,182,255,.35) 0%,rgba(56,182,255,0) 60%),linear-gradient(135deg,#1E6FD9 0%,#0F4E9E 55%,#0A3570 100%);
  box-shadow:0 60px 100px -50px rgba(30,111,217,.75),inset 0 1px 0 rgba(255,255,255,.18)}
.b20-end-card .b20-h2{color:#fff}
.b20-end-card .b20-em{background:none;color:#D9F6FF;-webkit-text-fill-color:#D9F6FF}
.b20-end-t{display:flex;flex-direction:column;gap:12px}
.b20-end-t p{font-size:19px;color:rgba(255,255,255,.88)}
.b20-end-a{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px}
.b20-end .btn-primary{background:#fff;color:#0A1A2E;box-shadow:0 18px 36px -18px rgba(0,0,0,.6)}
.b20-end .btn-primary:hover{background:#EAF6FF;color:#0A1A2E}
.b20-end-bub{z-index:-1}
.b20-end-bub i{border-color:rgba(255,255,255,.55);animation-name:b20RiseE,b20Sway}
.b20-end-bub i:nth-child(1){--x:6%;--s:10px;--t:16s;--dl:-3s}
.b20-end-bub i:nth-child(2){--x:22%;--s:6px;--t:12s;--dl:-8s}
.b20-end-bub i:nth-child(3){--x:41%;--s:14px;--t:19s;--dl:-1s}
.b20-end-bub i:nth-child(4){--x:58%;--s:5px;--t:13s;--dl:-10s}
.b20-end-bub i:nth-child(5){--x:77%;--s:11px;--t:17s;--dl:-6s}
.b20-end-bub i:nth-child(6){--x:92%;--s:7px;--t:14s;--dl:-12s}
.b20-news{display:flex;align-items:center;gap:18px;margin-top:18px;padding:18px 24px;border-radius:24px;background:rgba(255,255,255,.035);border:1px solid rgba(127,219,255,.14);transition:background-color .25s,border-color .25s,transform .4s var(--ease)}
.b20-news:hover{background:rgba(255,255,255,.06);border-color:rgba(127,219,255,.4);transform:translateY(-2px)}
.b20-news-ico{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:15px;background:rgba(56,182,255,.14);color:var(--cyan)}
.b20-news-t{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.b20-news-t b{font:600 17px/1.3 var(--fd);color:#fff}
.b20-news-t span{font-size:14.5px;line-height:1.5;color:var(--on3)}
.b20-news-go{display:inline-flex;align-items:center;gap:8px;font:600 15px/1 var(--fs);color:var(--cyan)}
.b20-news-go .ico{width:17px;height:17px;transition:transform .3s var(--ease)}
.b20-news:hover .b20-news-go .ico{transform:translateX(4px)}

/* ---------- vstopne animacije ---------- */
.b20.is-ready .b20-hero-t>*{animation:b20Up .9s var(--ease) backwards}
.b20.is-ready .b20-hero-t>:nth-child(2){animation-delay:.06s}
.b20.is-ready .b20-hero-t>:nth-child(3){animation-delay:.12s}
.b20.is-ready .b20-hero-t>:nth-child(4){animation-delay:.2s}
.b20.is-ready .b20-hero-t>:nth-child(5){animation-delay:.28s}
.b20.is-ready .b20-hero-t>:nth-child(6){animation-delay:.34s}
.b20.is-ready .b20-hero-t>:nth-child(7){animation-delay:.4s}
.b20.is-ready .b20-feat>*{animation:b20In 1.1s var(--ease) backwards}
.b20.is-ready .b20-feat>:nth-child(1){animation-delay:.25s}
.b20.is-ready .b20-feat>:nth-child(2){animation-delay:.45s}

@property --b20a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes b20Spin{to{--b20a:360deg}}
@keyframes b20Up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes b20In{from{opacity:0;transform:translateY(28px) scale(.97)}to{opacity:1;transform:none}}
@keyframes b20Fade{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes b20Caret{50%{opacity:0}}
@keyframes b20Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}6%{opacity:.75}100%{transform:translate3d(0,-1200px,0) scale(1.1);opacity:.3}}
@keyframes b20RiseS{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}8%{opacity:.7}100%{transform:translate3d(0,-520px,0) scale(1.1);opacity:.2}}
@keyframes b20RiseE{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}8%{opacity:.7}100%{transform:translate3d(0,-460px,0) scale(1.1);opacity:.2}}
@keyframes b20Sway{from{translate:-8px 0}to{translate:8px 0}}
@keyframes b20Rot{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes b20Travel{0%{left:calc((100% - 48px) / 6);opacity:0}8%{opacity:1}80%{opacity:1}100%{left:calc(100% - (100% - 48px) / 6);opacity:0}}
@keyframes b20Ping{0%{transform:scale(1);opacity:.85}100%{transform:scale(1.9);opacity:0}}
@keyframes b20Pop{0%{transform:scale(1)}35%{transform:scale(1.28)}65%{transform:scale(.94)}100%{transform:scale(1)}}

/* ---------- ožje namizje (do 1279 px): pot navpično, široka kartica zbita ---------- */
@media (max-width:1279.98px){
  .b20-start-head{flex-direction:column;align-items:flex-start}
  /* pot: navpična časovnica */
  .b20-path{grid-template-columns:minmax(0,1fr);gap:20px;margin-top:30px;padding-top:0;padding-left:56px}
  .b20-path::before{left:17px;right:auto;top:24px;bottom:24px;width:2px;height:auto;background:linear-gradient(180deg,rgba(127,219,255,.6),rgba(56,182,255,.35) 50%,rgba(127,219,255,.15))}
  .b20-path::after{display:none}
  .b20-node{left:-56px;top:24px;margin-left:0}
  .b20-node::after{left:100%;top:50%;width:20px;height:1px;margin:0;background:linear-gradient(90deg,rgba(127,219,255,.5),rgba(127,219,255,0))}
  .b20-pc{flex-direction:row}
  .b20-pc-top{flex:0 0 42%}
  .b20-pc-cov{aspect-ratio:auto;height:100%;min-height:230px}
  .b20-pc-cov::after{background:linear-gradient(180deg,rgba(5,15,31,.35) 0%,rgba(5,15,31,0) 35%,rgba(5,15,31,0) 55%,rgba(8,22,42,.85) 100%)}
  .b20-pc-n{bottom:4px;font-size:76px}
  .b20-pc-b{padding:26px 26px 22px}
  .b20-li.is-wide .b20-cov-w{flex-basis:44%}
  .b20-li.is-wide .b20-bm{left:calc(44% - 56px)}
  .b20-li.is-wide .b20-cb{padding:28px 26px 24px}
  .b20-li.is-wide .b20-cf-go{width:40px;height:40px;padding:0;justify-content:center}
  .b20-li.is-wide .b20-cf-go>span{display:none}
}
/* ---------- tablica (do 1023 px) ---------- */
@media (max-width:1023.98px){
  .b20-cs{display:none!important}
  .b20-hero{min-height:0;padding-top:calc(var(--hh,136px) + 6px);padding-bottom:48px}
  .b20-hero-in{grid-template-columns:1fr;gap:40px}
  .b20-photo{width:100%;opacity:.14}
  .b20-search{max-width:none}
  .b20-bento{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .b20-arch-head{flex-direction:column;align-items:flex-start;gap:16px}
  .b20-bar{top:0;margin-inline:calc(var(--gutter,20px) * -1);padding:10px var(--gutter,20px);border-radius:0;border-width:0 0 1px}
  .b20-tools{width:100%}
  .b20-mini,.b20-mini:focus-within{flex:1;width:auto}
  .b20-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
  .b20-li-promo{grid-column:1 / -1}
  .b20-li.is-wide .b20-card{min-height:330px}
  .b20-li.is-wide .b20-cov-w{flex-basis:50%}
  .b20-li.is-wide .b20-cf-go{width:auto;height:44px;padding:0 20px}
  .b20-li.is-wide .b20-cf-go>span{display:inline}
  .b20-li.is-wide .b20-bm{left:calc(50% - 56px)}
  .b20-li.is-wide .b20-cb{padding:28px 26px 24px}
  .b20-li.is-wide .b20-cx{-webkit-line-clamp:4}
  .b20-row{grid-template-columns:112px minmax(0,1fr) auto 42px;gap:16px}
  .b20-row-cov{width:112px;height:80px}
  .b20-toast{bottom:calc(96px + env(safe-area-inset-bottom,0px))}
  .b20-end-card{grid-template-columns:1fr}
  .b20-end-a{justify-content:flex-start}
}
/* ---------- telefon (do 639 px) ---------- */
@media (max-width:639.98px){
  .b20-hero h1{font-size:clamp(38px,10.4vw,48px)}
  .b20-search{min-height:58px}
  .b20-search input{height:54px;font-size:16px;padding-left:52px}
  .b20-s-ico{left:20px}
  .b20-s-type{left:52px;font-size:16px}
  .b20-sug{border-radius:20px;padding:6px}
  .b20-sug-i{padding:10px}
  .b20-sug-i>.ico{display:none}
  .b20-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%}
  .b20-stats>div{min-width:0;padding:12px 12px;border-radius:16px}
  .b20-stats dt{font-size:12px}
  .b20-stats b{font-size:24px}
  .b20-stats .b20-st-last b{font-size:14px;line-height:24px;padding-top:0;white-space:nowrap}
  .b20-fc{border-radius:24px}
  .b20-fc-b{padding:0 20px 22px}
  .b20-fl{grid-template-columns:1fr}
  /* pot */
  .b20-path-prog{padding-right:18px}
  .b20-path{gap:16px;padding-left:44px}
  .b20-path::before{left:15px;top:20px;bottom:20px}
  .b20-node{left:-44px;top:20px;width:32px;height:32px;font-size:13px;box-shadow:0 0 0 5px #050F1F}
  .b20-step.is-first .b20-node{box-shadow:0 0 0 5px #050F1F,0 0 22px rgba(56,182,255,.75)}
  .b20-node::after{width:12px}
  .b20-pc{flex-direction:column;border-radius:22px}
  .b20-pc-top{flex:none}
  .b20-pc-cov{aspect-ratio:16/8.5;height:auto;min-height:0}
  .b20-pc-n{bottom:-22px;left:14px;font-size:62px}
  .b20-pc-flag,.b20-pc-read{top:12px;min-height:26px;padding:0 10px;font-size:10.5px}
  .b20-pc-flag{left:12px}
  .b20-pc-read{right:12px}
  .b20-pc-b{gap:10px;padding:24px 18px 18px}
  .b20-pc-t{font-size:18.5px}
  .b20-pc-x{font-size:15px}
  .b20-pc-go{min-height:40px;padding:0 15px;font-size:13.5px}
  /* mozaik */
  .b20-bento{gap:10px}
  .b20-bt,.b20-bt.is-big,.b20-bt.is-wide{min-height:0;gap:10px;padding:16px;border-radius:20px}
  .b20-bt-orb,.b20-bt.is-big .b20-bt-orb{width:42px;height:42px;border-radius:14px}
  .b20-bt-orb .ico,.b20-bt.is-big .b20-bt-orb .ico{width:21px;height:21px}
  .b20-bt-n{font-size:11.5px}
  .b20-bt-n b{font-size:28px}
  .b20-bt-name{margin-top:6px;font-size:16px}
  .b20-bt.is-big .b20-bt-name{font-size:19px}
  .b20-bt:not(.is-big) .b20-bt-l{display:none}
  .b20-bt.is-wide{grid-column:auto}
  .b20-bt:not(.is-big) .b20-bt-go{margin-top:auto}
  .b20-bt-l a{font-size:13.5px;padding-block:4px}
  .b20-bt-go{font-size:13px}
  /* arhiv */
  .b20-ai{flex-wrap:wrap;padding:16px}
  .b20-view{display:none}
  .b20-grid{grid-template-columns:minmax(0,1fr);gap:12px}
  /* prva kartica ostane velika */
  .b20-li.is-wide{grid-column:auto}
  .b20-li.is-wide .b20-card{flex-direction:column;min-height:0;border-radius:24px}
  .b20-li.is-wide .b20-cov-w{flex:none}
  .b20-li.is-wide .b20-cov{aspect-ratio:16/9}
  .b20-li.is-wide .b20-cov::after{background:linear-gradient(180deg,rgba(5,15,31,.32) 0%,rgba(5,15,31,0) 28%,rgba(5,15,31,0) 55%,rgba(6,22,43,.72) 100%)}
  .b20-li.is-wide .b20-bm{left:auto;right:12px;top:12px}
  .b20-li.is-wide .b20-cb{gap:11px;padding:20px 18px 20px}
  .b20-li.is-wide .b20-cb-cat{display:none}
  .b20-li.is-wide .b20-cat-g{display:inline-flex}
  .b20-li.is-wide .b20-ct{font-size:21px;line-height:1.25}
  .b20-li.is-wide .b20-cx{font-size:15px;-webkit-line-clamp:3}
  .b20-li.is-wide .b20-cf-go{width:40px;height:40px;padding:0;justify-content:center}
  .b20-li.is-wide .b20-cf-go>span{display:none}
  /* ostale: kompaktne vrstice za hitro pregledovanje */
  .b20-li:not(.is-wide) .b20-card{display:grid;grid-template-columns:108px minmax(0,1fr);border-radius:20px}
  .b20-li:not(.is-wide) .b20-card::before{left:0;right:auto;top:0;bottom:0;width:3px;height:auto;transform:none;transform-origin:50% 0}
  .b20-li:not(.is-wide) .b20-cov{aspect-ratio:auto;min-height:136px}
  .b20-li:not(.is-wide) .b20-cov::after{background:linear-gradient(180deg,rgba(5,15,31,.35) 0%,rgba(5,15,31,0) 45%)}
  .b20-li:not(.is-wide) .b20-cat-g{display:none}
  .b20-li:not(.is-wide) .b20-badges{left:8px;top:8px;flex-direction:column;align-items:flex-start;gap:4px}
  .b20-li:not(.is-wide) .b20-badge{min-height:20px;padding:0 7px;font-size:9px;gap:3px}
  .b20-li:not(.is-wide) .b20-badge .ico{width:10px;height:10px}
  .b20-li:not(.is-wide) .b20-bm{top:auto;right:auto;left:8px;bottom:8px;width:34px;height:34px}
  .b20-li:not(.is-wide) .b20-bm .ico{width:15px;height:15px}
  .b20-li:not(.is-wide) .b20-cb{gap:7px;padding:14px 16px}
  .b20-li:not(.is-wide) .b20-cb-cat{display:block}
  .b20-cb-cat .b20-cat{font-size:10.5px}
  .b20-li:not(.is-wide) .b20-ct{font-size:16px;line-height:1.32;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .b20-li:not(.is-wide) .b20-cx{display:none}
  .b20-li:not(.is-wide) .b20-cf{padding-top:6px;border-top:0}
  .b20-li:not(.is-wide) .b20-cf-m{font-size:12.5px}
  .b20-li:not(.is-wide) .b20-cf-go{display:none}
  .b20-promo{padding:28px 22px}
  .b20-toast{left:16px;right:16px;max-width:none;transform:translateY(16px);text-align:center}
  .b20-toast.is-on{transform:none}
  .b20-end-card{padding:32px 22px;border-radius:28px}
  .b20-news{flex-wrap:wrap;padding:16px 18px}
}
@media (prefers-reduced-motion:reduce){
  .b20 *,.b20 *::before,.b20 *::after{animation:none!important;transition:none!important}
  .b20-path::after{display:none}
}


/* ===== razmiki med sekcijami (namizje) – enako kot na testni strani (v0.6.0) ===== */
@media (min-width:1024px){
  main#vsebina > section.sec,
  main#vsebina > section.cta-sec{padding-top:clamp(64px,5.4vw,84px)!important;padding-bottom:clamp(64px,5.4vw,84px)!important}
}


/* ===== Verzija 2 – »Najnovejši članki«: naslovna slika članka v ovitku (kot vtičnik 0.7.x) ===== */
.kb .kb-cov.has-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.kb .kb-cov.has-img::before{display:none}
.kb .kb-cov.has-img::after{left:0;top:0;width:100%;height:100%;aspect-ratio:auto;border-radius:0;transform:none;background:linear-gradient(180deg,rgba(6,18,38,.35) 0%,rgba(6,18,38,0) 40%,rgba(6,18,38,.25) 100%)}
/* ===== Verzija 2 – aktivna »Baza znanja« na blogu; presledek med darilnim bonom in pasico medijev ===== */
.main-nav a[aria-current="page"]{color:#fff}
.main-nav a[aria-current="page"]::after{transform:scaleX(1)}
@media (min-width:1024px){aside.bon-promo.bp3 + section.mb{border-top:clamp(22px,2.2vw,34px) solid #040B16}}

/* ===== 21. Podstran – Članek (obstoječi članki) (Verzija 1) ===== */
/* 21. Podstran – Članek (obstoječi članki) – Verzija 1 (22. 10. 2026)
   Ena predloga za VSE obstoječe članke – brez urejanja posameznega članka.
   Temen junak v slogu OSNUTKA 1 (sij, mreža, polmesec, mehurčki) + svetel bralni »list« (dolga besedila so na svetli podlagi berljivejša).
   Lastni <style> v članku predloga izpusti; vse gradnike članka (Bistvo v 30 sekundah, številke, kartice raziskav, mehanizmi,
   diagrami, tabela protokola, kontrolni seznam, pogosta vprašanja, viri, opozorilo) oblikuje ta enotni slog.
   Pokrite so vse tri družine obstoječih člankov: .ox-blog (44), .article-wrap (11) in Gutenberg bloki (8).
   Slogi so omejeni na .c21 in .c21-test. Namizje od 1024 px. Animacije s predpono c21. */
.c21{--on:#E8F0F8;--on2:rgba(232,240,248,.8);--on3:rgba(232,240,248,.62);--oxy:#1E6FD9;--sky:#38B6FF;--cyan:#7FDBFF;--aqua:#A9E9FF;--teal:#5EF2C9;
  --ink:#0B1B2E;--ink2:#22344A;--muted:#5A6B7E;--line:#E1E9F2;--line2:#CFDCEA;--paper:#EEF3F8;--tint:#EEF6FF;--oxy-ink:#1557B0;
  --ease:cubic-bezier(.16,1,.3,1);
  --fd:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;--fs:'Instrument Sans','Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --kc:#3FC9B7;--kr:63,201,183;
  position:relative;background:#050F1F;color:var(--on);font-family:var(--fs);overflow-x:clip}
.c21 *,.c21 *::before,.c21 *::after{box-sizing:border-box}
.c21 .ico{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.c21 :focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.c21 .wrap{position:relative;z-index:1}
.c21-eyebrow{display:inline-flex;align-items:center;gap:12px;margin:0;font:600 12.5px/1.3 var(--fs);letter-spacing:.2em;text-transform:uppercase;color:var(--cyan)}
.c21-eyebrow::before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;box-shadow:7px -6px 0 -2.5px currentColor}
.c21-h2{margin:0;font:300 clamp(34px,1.9vw + 14px,54px)/1.05 var(--fd);letter-spacing:-.022em;color:#fff;text-wrap:balance}
.c21-em{font-weight:500;background:linear-gradient(100deg,#A9E9FF 0%,#38B6FF 70%,#7FDBFF 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.c21-cat{display:inline-flex;align-items:center;gap:8px;font:600 11.5px/1.3 var(--fs);letter-spacing:.14em;text-transform:uppercase;color:var(--kc)}
.c21-cat::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--kc);box-shadow:0 0 10px rgba(var(--kr),.85)}
.c21-link{display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font:600 15px/1.2 var(--fs);text-decoration:none}
.c21-link .ico{width:17px;height:17px;transition:transform .3s var(--ease)}
.c21-link:hover{color:#fff}
.c21-link:hover .ico{transform:translateX(4px)}
.c21-tel{display:inline-flex;align-items:center;gap:9px;min-height:52px;font:600 16.5px/1 var(--fs);color:#fff;text-decoration:none}
.c21-tel .ico{width:18px;height:18px}
.c21-tel:hover{text-decoration:underline;text-underline-offset:4px}

/* napredek branja (telefon) */
.c21-prog{position:fixed;left:0;right:0;top:0;z-index:60;height:3px;background:rgba(255,255,255,.08);pointer-events:none}
.c21-prog i{display:block;height:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#1E6FD9,#7FDBFF)}

/* ---------- 1. junak ---------- */
.c21-hero{position:relative;padding-top:calc(var(--hh,100px) + 40px);padding-bottom:clamp(150px,9vw + 40px,220px);
  background:radial-gradient(70% 60% at 10% 0%,rgba(56,182,255,.12) 0%,rgba(56,182,255,0) 60%),linear-gradient(180deg,#071A30 0%,#050F1F 100%)}
.c21-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.c21-glow{position:absolute;border-radius:50%}
.c21-g1{width:900px;height:900px;right:-160px;top:-160px;background:radial-gradient(closest-side,rgba(30,111,217,.26),rgba(30,111,217,0))}
.c21-g2{width:640px;height:640px;left:-240px;bottom:-300px;background:radial-gradient(closest-side,rgba(var(--kr),.1),rgba(var(--kr),0))}
.c21-mesh{position:absolute;inset:0;opacity:.5;background-image:radial-gradient(rgba(127,219,255,.15) 1px,rgba(127,219,255,0) 1.6px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(40% 40% at 22% 40%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%);mask-image:radial-gradient(40% 40% at 22% 40%,#000 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 82%)}
.c21-wm{position:absolute;left:-180px;top:10%;height:min(760px,80%);width:auto;opacity:.18;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,0) 85%);mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,0) 85%)}
.c21-bub,.c21-end-bub,.c21-cta-bub,.c21-rcta-bub{position:absolute;inset:0;pointer-events:none;-webkit-mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%);mask-image:linear-gradient(to top,#000 0%,#000 60%,rgba(0,0,0,0) 96%)}
.c21-bub i,.c21-end-bub i,.c21-cta-bub i,.c21-rcta-bub i{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;opacity:0;
  border:1px solid rgba(169,233,255,.5);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.6) 0%,rgba(169,233,255,.1) 55%,rgba(169,233,255,0) 70%);
  animation:c21Rise var(--t) linear var(--dl) infinite,c21Sway calc(var(--t) / 5) ease-in-out var(--dl) infinite alternate}
.c21-bub i:nth-child(1){--x:6%;--s:9px;--t:24s;--dl:-6s}
.c21-bub i:nth-child(2){--x:18%;--s:5px;--t:19s;--dl:-12s}
.c21-bub i:nth-child(3){--x:31%;--s:12px;--t:28s;--dl:-2s}
.c21-bub i:nth-child(4){--x:46%;--s:6px;--t:21s;--dl:-16s}
.c21-bub i:nth-child(5){--x:58%;--s:10px;--t:26s;--dl:-9s}
.c21-bub i:nth-child(6){--x:72%;--s:4px;--t:17s;--dl:-4s}
.c21-bub i:nth-child(7){--x:84%;--s:13px;--t:30s;--dl:-20s}
.c21-bub i:nth-child(8){--x:95%;--s:7px;--t:22s;--dl:-1s}
.c21-hero-in{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:clamp(40px,5vw,90px)}
.c21-hero-t{display:flex;flex-direction:column;align-items:flex-start;gap:20px;min-width:0}
.c21-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font-size:14px;color:var(--on3)}
.c21-crumbs a{color:var(--on2);text-decoration:none;border-bottom:1px solid rgba(127,219,255,.25)}
.c21-crumbs a:hover{color:#fff;border-color:var(--cyan)}
.c21-crumbs a:last-child{color:var(--cyan)}
.c21-topic{margin:4px 0 0;display:inline-flex;align-items:center;gap:12px;font:600 12.5px/1.3 var(--fs);letter-spacing:.2em;text-transform:uppercase;color:var(--cyan)}
.c21-topic::before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;box-shadow:7px -6px 0 -2.5px currentColor}
.c21-hero h1{margin:0;font:300 clamp(40px,2.2vw + 16px,70px)/1.04 var(--fd);letter-spacing:-.026em;color:#fff;text-wrap:balance}
.c21-lead{margin:0;max-width:36em;font-size:clamp(17px,.3vw + 14px,19.5px);line-height:1.62;color:var(--on2)}
.c21-lead:empty{display:none}
.c21-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:2px}
.c21-area{display:inline-flex;align-items:center;gap:9px;min-height:34px;padding:0 14px 0 12px;border-radius:999px;font:600 13px/1 var(--fs);color:#fff;
  background:rgba(var(--kr),.14);border:1px solid rgba(var(--kr),.45)}
.c21-area::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--kc);box-shadow:0 0 10px rgba(var(--kr),.9)}
.c21-mi{display:inline-flex;align-items:center;gap:7px;font-size:14.5px;color:var(--on2)}
.c21-mi .ico{width:17px;height:17px;color:var(--cyan)}
.c21-mi b{font-weight:600;color:#fff}
.c21-byrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;width:100%;margin-top:6px;padding-top:20px;border-top:1px solid rgba(127,219,255,.12)}
.c21-by{display:flex;align-items:center;gap:12px;margin:0;font-size:14px;line-height:1.45;color:var(--on3);max-width:34em}
.c21-by-ico{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:50%;color:#fff;background:linear-gradient(140deg,#38B6FF,#1E6FD9);box-shadow:0 8px 20px -8px rgba(56,182,255,.9)}
.c21-by-ico svg{width:20px;height:20px}
.c21-share{display:flex;gap:8px}
.c21-sh{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid rgba(127,219,255,.22);background:rgba(255,255,255,.04);color:var(--on);cursor:pointer;transition:background-color .2s,border-color .2s,transform .3s var(--ease),color .2s}
.c21-sh .ico{width:18px;height:18px}
.c21-sh:hover{background:#fff;color:#0A1A2E;border-color:#fff;transform:translateY(-2px)}
.c21-fig{position:relative;margin:0;border-radius:30px;isolation:isolate}
.c21-fig-in{position:relative;display:block;aspect-ratio:4/3;border-radius:inherit;overflow:hidden;
  background:radial-gradient(120% 90% at 85% 0%,rgba(var(--kr),.4) 0%,rgba(var(--kr),0) 60%),linear-gradient(150deg,#0C2747 0%,#071A30 100%);
  box-shadow:0 60px 100px -50px rgba(0,0,0,.95),0 0 0 1px rgba(var(--kr),.3)}
.c21-fig-in img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover}
.c21-fig-fb{position:absolute;inset:0;display:grid;place-items:center;color:rgba(var(--kr),.9)}
.c21-fig-fb .ico{width:64px;height:64px;stroke-width:1.3;filter:drop-shadow(0 0 18px rgba(var(--kr),.6))}
.c21-fig-fb::after{content:"";position:absolute;right:-16%;bottom:-36%;width:72%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(var(--kr),.28)}
.c21-fig-ring{position:absolute;inset:-1px;z-index:3;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--c21a,0deg),rgba(var(--kr),0) 0deg,rgba(var(--kr),.95) 60deg,rgba(var(--kr),0) 130deg,rgba(var(--kr),0) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:c21Spin 8s linear infinite}
.c21-fig::after{content:"";position:absolute;left:10%;right:10%;bottom:-40px;height:80px;z-index:-1;border-radius:50%;background:rgba(var(--kr),.35);filter:blur(40px)}

/* ---------- 2. telo: kazalo + bralni list ---------- */
.c21-body{position:relative;background:var(--paper);padding-bottom:clamp(80px,5vw + 30px,130px)}
.c21-body::before{content:"";position:absolute;left:0;right:0;top:-1px;height:clamp(110px,7vw + 40px,170px);background:linear-gradient(180deg,#050F1F 0%,#050F1F 30%,rgba(5,15,31,0) 100%)}
.c21-grid{display:grid;grid-template-columns:minmax(0,290px) minmax(0,1fr);align-items:start;gap:clamp(28px,3vw,56px)}
.c21-rail{position:sticky;top:96px;display:flex;flex-direction:column;gap:16px;margin-top:clamp(-110px,-6vw,-80px)}
.c21.no-toc .c21-toc{display:none}
.c21-toc{padding:22px 18px 18px 22px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:0 30px 60px -40px rgba(11,27,46,.4)}
.c21-toc-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.c21-toc-h{display:flex;align-items:center;gap:9px;margin:0;font:700 12px/1.2 var(--fs);letter-spacing:.14em;text-transform:uppercase;color:var(--oxy-ink)}
.c21-toc-h .ico{width:17px;height:17px}
.c21-ring{position:relative;display:grid;place-items:center;flex:none;width:40px;height:40px}
.c21-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.c21-ring .tr{fill:none;stroke:var(--line);stroke-width:3}
.c21-ring .ar{fill:none;stroke:url(#c21Wm);stroke:var(--oxy);stroke-width:3;stroke-linecap:round;stroke-dasharray:0 100;transition:stroke-dasharray .2s linear}
.c21-ring b{position:relative;font:700 11px/1 var(--fd);color:var(--ink)}
.c21-ring b::after{content:"%";font-size:8px;color:var(--muted)}
.c21-toc-l{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 420px);overflow:auto;scrollbar-width:thin}
.c21-toc-l a{position:relative;display:grid;grid-template-columns:26px 1fr;gap:6px;padding:9px 10px 9px 8px;border-radius:12px;font:500 14px/1.35 var(--fs);color:var(--muted);text-decoration:none;transition:background-color .2s,color .2s}
.c21-toc-l a span{font:600 11.5px/1.6 var(--fd);color:#9AAABB;font-variant-numeric:tabular-nums}
.c21-toc-l a:hover{background:var(--tint);color:var(--ink)}
.c21-toc-l a.is-on{background:linear-gradient(90deg,rgba(30,111,217,.1),rgba(30,111,217,.02));color:var(--ink);font-weight:600}
.c21-toc-l a.is-on span{color:var(--oxy)}
.c21-toc-l a.is-on::before{content:"";position:absolute;left:-1px;top:9px;bottom:9px;width:3px;border-radius:3px;background:linear-gradient(180deg,#38B6FF,#1E6FD9)}
.c21-rcta{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:24px 22px;border-radius:24px;overflow:hidden;isolation:isolate;
  background:radial-gradient(90% 70% at 100% 0%,rgba(56,182,255,.35) 0%,rgba(56,182,255,0) 60%),linear-gradient(160deg,#0E3866 0%,#0A2547 60%,#071A30 100%);box-shadow:0 30px 60px -36px rgba(11,27,46,.8)}
.c21-rcta-bub{z-index:-1}
.c21-rcta-bub i{border-color:rgba(255,255,255,.5);animation-name:c21RiseS,c21Sway}
.c21-rcta-bub i:nth-child(1){--x:12%;--s:8px;--t:11s;--dl:-2s}
.c21-rcta-bub i:nth-child(2){--x:44%;--s:5px;--t:9s;--dl:-5s}
.c21-rcta-bub i:nth-child(3){--x:70%;--s:10px;--t:13s;--dl:-8s}
.c21-rcta-bub i:nth-child(4){--x:90%;--s:6px;--t:10s;--dl:-3s}
.c21-rcta-t{margin:0;font:300 24px/1.15 var(--fd);letter-spacing:-.015em;color:#fff}
.c21-rcta-t span{font-weight:600;color:#D9F6FF}
.c21-rcta-x{margin:0 0 6px;font-size:14px;line-height:1.5;color:var(--on2)}
.c21-rcta .btn{width:100%;min-height:50px;background:#fff;color:#0A1A2E}
.c21-rcta .btn:hover{background:#EAF6FF;color:#0A1A2E}
.c21-rcta-l{display:inline-flex;align-items:center;gap:8px;margin-top:2px;padding:6px 0;border:0;background:none;color:var(--cyan);font:600 14px/1 var(--fs);cursor:pointer}
.c21-rcta-l .ico{width:16px;height:16px;transition:transform .3s var(--ease)}
.c21-rcta-l:hover{color:#fff}
.c21-rcta-l:hover .ico{transform:translateX(4px)}

.c21-sheet{position:relative;min-width:0;margin-top:clamp(-150px,-8vw,-110px);padding:clamp(34px,3vw + 10px,64px) clamp(28px,4vw,76px) clamp(40px,3vw + 14px,70px);border-radius:34px;background:#fff;
  box-shadow:0 50px 100px -60px rgba(11,27,46,.55),0 0 0 1px rgba(11,27,46,.04)}
.c21.is-loading .c21-sheet{min-height:80vh}
.c21.is-loading .c21-prose{opacity:.25;filter:blur(2px);transition:opacity .3s,filter .3s}
.c21.is-loading .c21-hero-t h1{opacity:.4}

/* ================= BRALNI SLOG VSEBINE (velja za vse obstoječe članke) ================= */
.c21-prose{max-width:760px;margin-inline:auto;color:#1C2B3D;font:400 18px/1.75 var(--fs);counter-reset:none;
  /* spremenljivke, na katere se sklicujejo slogi v atributih style= starejših člankov – preslikane v novo paleto */
  --blue:#1E6FD9;--blue-light:#EEF6FF;--blue-mid:#9CC8F2;--blue-dark:#1557B0;--text-main:#1C2B3D;--text-muted:#5A6B7E;--border:#E1E9F2;--bg-soft:#F7FAFD;--bg-blue:#EEF6FF}
.c21-prose>*:first-child{margin-top:0}
.c21-prose :is(article,.ox-blog,.article-wrap,.article){max-width:none;margin:0;padding:0;font:inherit;color:inherit;background:none;border:0;box-shadow:none}
.c21-prose p{margin:0 0 1.15em}
.c21-prose a{color:var(--oxy-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:rgba(21,87,176,.35);transition:color .2s,text-decoration-color .2s}
.c21-prose a:hover{color:var(--oxy);text-decoration-color:currentColor}
.c21-prose a.is-ext::after{content:"";display:inline-block;width:.62em;height:.62em;margin-left:.22em;vertical-align:.05em;background:currentColor;opacity:.6;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat}
.c21-prose strong,.c21-prose b{font-weight:650;color:var(--ink)}
.c21-prose em{font-style:italic}
.c21-prose :is(h2,h3,h4,h5){font-family:var(--fd);color:var(--ink);text-wrap:balance}
.c21-prose h2{position:relative;margin:2.6em 0 .75em;padding:0;border:0;font-weight:600;font-size:clamp(26px,1vw + 17px,33px);line-height:1.2;letter-spacing:-.02em;scroll-margin-top:110px}
.c21-prose h2[data-n]::before{content:attr(data-n);display:block;width:max-content;margin-bottom:12px;padding:5px 11px;border-radius:999px;font:700 11.5px/1 var(--fd);letter-spacing:.08em;color:var(--oxy);background:var(--tint);box-shadow:inset 0 0 0 1px rgba(30,111,217,.15)}
.c21-prose h3{margin:2em 0 .6em;font-weight:600;font-size:22px;line-height:1.3;letter-spacing:-.012em}
.c21-prose h4{margin:1.6em 0 .5em;font-weight:650;font-size:18px;line-height:1.35}
.c21-prose :where(ul,ol):not([class]){margin:0 0 1.2em;padding-left:1.35em}
.c21-prose :where(ul,ol):not([class])>li{margin:.35em 0;padding-left:.2em}
.c21-prose :where(ul):not([class])>li::marker{color:var(--sky)}
.c21-prose :where(ol):not([class])>li::marker{color:var(--oxy);font-weight:700;font-family:var(--fd)}
.c21-prose hr{height:1px;margin:3em 0;border:0;background:linear-gradient(90deg,rgba(30,111,217,0),rgba(30,111,217,.35),rgba(30,111,217,0))}
.c21-prose hr.divider{position:relative;overflow:visible}
.c21-prose hr.divider::after{content:"";position:absolute;left:50%;top:-4px;width:40px;height:9px;transform:translateX(-50%);background:radial-gradient(circle,#38B6FF 3px,rgba(56,182,255,0) 3.5px) 0 0/13px 9px repeat-x}
.c21-prose img{max-width:100%;height:auto;border-radius:18px}
.c21-prose svg{max-width:100%}
/* infografike v članku prevzamejo pisave strani */
.c21-prose svg text{font-family:var(--fs)}
.c21-prose svg text[font-family*="Lora"],.c21-prose svg [font-family*="Lora"] text{font-family:var(--fd);letter-spacing:-.01em}
.c21-prose figure.is-tall svg{max-width:380px}
.c21-prose blockquote,.c21-prose .wp-block-quote{margin:1.8em 0;padding:6px 0 6px 26px;border-left:3px solid;border-image:linear-gradient(180deg,#38B6FF,#1E6FD9) 1;font:300 22px/1.5 var(--fd);color:var(--ink)}
.c21-prose blockquote p:last-child{margin-bottom:0}
.c21-prose blockquote cite{display:block;margin-top:8px;font:500 14px/1.4 var(--fs);font-style:normal;color:var(--muted)}

/* Bistvo v 30 sekundah */
.c21-prose .key-points{position:relative;margin:0 0 2.2em;padding:30px 32px 28px;border-radius:26px;overflow:hidden;isolation:isolate;color:var(--on);
  background:radial-gradient(80% 90% at 100% 0%,rgba(56,182,255,.28) 0%,rgba(56,182,255,0) 60%),linear-gradient(150deg,#0D2B52 0%,#0A1F3C 55%,#071A30 100%);
  box-shadow:0 40px 80px -50px rgba(11,27,46,.9)}
.c21-prose .key-points::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.45;background-image:radial-gradient(rgba(127,219,255,.18) 1px,rgba(127,219,255,0) 1.6px);background-size:24px 24px;-webkit-mask-image:radial-gradient(60% 80% at 100% 0%,#000,rgba(0,0,0,0));mask-image:radial-gradient(60% 80% at 100% 0%,#000,rgba(0,0,0,0))}
.c21-prose .kp-label{display:inline-flex;align-items:center;gap:12px;margin-bottom:14px;font:600 12.5px/1.3 var(--fs);letter-spacing:.2em;text-transform:uppercase;color:var(--cyan)}
.c21-prose .kp-label::before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;box-shadow:7px -6px 0 -2.5px currentColor}
.c21-prose .key-points ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.c21-prose .key-points li{position:relative;margin:0;padding-left:34px;font-size:16.5px;line-height:1.6;color:rgba(232,240,248,.9)}
.c21-prose .key-points li::before{content:"";position:absolute;left:0;top:3px;width:22px;height:22px;border-radius:50%;background:rgba(127,219,255,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237FDBFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;box-shadow:inset 0 0 0 1px rgba(127,219,255,.35)}
.c21-prose .key-points strong{color:#fff}

/* infografike in slike */
.c21-prose .hero-visual{margin:0 0 2.2em;border-radius:24px;overflow:hidden;box-shadow:0 0 0 1px var(--line),0 30px 60px -45px rgba(11,27,46,.5)}
.c21-prose .hero-visual :is(svg,img){display:block;width:100%;height:auto;border-radius:0}
.c21-prose figure,.c21-prose .ox-fig,.c21-prose .ox-figure,.c21-prose .figure-block{margin:2.2em 0;padding:clamp(18px,2vw,30px);border-radius:24px;background:linear-gradient(180deg,#F7FAFD,#F1F6FB);border:1px solid var(--line)}
.c21-prose figure svg,.c21-prose .ox-fig svg,.c21-prose .ox-figure svg{display:block;width:100%;max-width:480px;height:auto;margin:0 auto}
.c21-prose figure img{display:block;margin:0 auto}
.c21-prose figcaption,.c21-prose .caption,.c21-prose .attribution{margin-top:14px;font-size:14px;line-height:1.55;color:var(--muted);text-align:center}
.c21-prose .wp-block-image{padding:0;background:none;border:0}
.c21-prose .wp-block-image img{box-shadow:0 30px 60px -40px rgba(11,27,46,.5)}

/* ključne številke */
.c21-prose .hero-stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:2em 0 .9em}
.c21-prose .hero-stat{position:relative;display:flex;flex-direction:column;gap:10px;padding:22px 20px 20px;border-radius:22px;background:#fff;border:1px solid var(--line);overflow:hidden;box-shadow:0 24px 50px -40px rgba(11,27,46,.45)}
.c21-prose .hero-stat::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#1E6FD9,#7FDBFF)}
.c21-prose .hero-stat .number{display:block;font:600 clamp(28px,1.2vw + 16px,36px)/1.05 var(--fd);letter-spacing:-.02em;background:linear-gradient(120deg,#1557B0,#38B6FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.c21-prose .hero-stat .label{display:block;font-size:14.5px;line-height:1.5;color:var(--muted)}
.c21-prose .stat-source{margin:0 0 2em;font-size:13.5px;line-height:1.5;color:#7B8A9B}
.c21-prose .stat-highlight{display:flex;align-items:center;gap:22px;margin:2em 0;padding:24px 26px;border-radius:22px;background:var(--tint);border:1px solid #D3E6FA}
.c21-prose .stat-highlight .big-num{flex:none;font:600 44px/1 var(--fd);letter-spacing:-.03em;background:linear-gradient(120deg,#1557B0,#38B6FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.c21-prose .stat-highlight .stat-text{font-size:16px;line-height:1.55;color:var(--ink2)}

/* kartice: mehanizmi, področja, mreže */
.c21-prose :is(.mechanism-grid,.domain-grid,.brain-regions-grid,.numbered-cards,.profiles){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:2em 0}
.c21-prose :is(.mechanism-card,.domain-card,.brain-region-item,.celebrity-box){position:relative;padding:22px 22px 20px;border-radius:22px;background:#fff;border:1px solid var(--line);transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .3s}
.c21-prose :is(.mechanism-card,.domain-card,.brain-region-item):hover{transform:translateY(-3px);border-color:#C6DCF3;box-shadow:0 26px 50px -36px rgba(30,111,217,.55)}
.c21-prose .mc-head{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:8px}
.c21-prose :is(.mechanism-card,.brain-region-item) .icon,.c21-prose .brain-region-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;color:var(--oxy);
  background:radial-gradient(120% 100% at 30% 10%,#fff 0%,rgba(255,255,255,0) 60%),linear-gradient(140deg,#DDEEFF,#BFDDFB);box-shadow:inset 0 0 0 1px rgba(30,111,217,.15),0 10px 20px -12px rgba(30,111,217,.6)}
.c21-prose :is(.mechanism-card,.brain-region-item) .icon svg,.c21-prose .brain-region-icon svg{width:24px;height:24px;stroke:var(--oxy)}
.c21-prose :is(.mechanism-card,.domain-card,.brain-region-item) h4{margin:0 0 6px;font-size:17px}
.c21-prose :is(.mechanism-card,.brain-region-item) p,.c21-prose .brain-region-text{margin:0;font-size:15.5px;line-height:1.6;color:var(--muted)}
.c21-prose :is(.domain-label,.domain-name,.study-label,.study-tag){display:block;margin-bottom:8px;font:700 11.5px/1.35 var(--fs);letter-spacing:.12em;text-transform:uppercase;color:var(--oxy)}
.c21-prose :is(.domain-result,.domain-stat,.domain-num){display:block;margin-bottom:8px;font:600 20px/1.25 var(--fd);letter-spacing:-.01em;color:var(--ink)}
.c21-prose .domain-detail{font-size:15px;line-height:1.6;color:var(--muted)}
.c21-prose .numbered-cards{counter-reset:c21n}
.c21-prose .numbered-cards>*{position:relative;padding:22px 22px 20px 64px;border-radius:22px;background:#fff;border:1px solid var(--line);counter-increment:c21n}
.c21-prose .numbered-cards>*::before{content:counter(c21n);position:absolute;left:20px;top:20px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;font:700 13px/1 var(--fd);color:#fff;background:linear-gradient(140deg,#38B6FF,#1E6FD9)}

/* raziskava, klinični primer, poudarek */
.c21-prose :is(.study-banner,.case-banner){position:relative;margin:2.2em 0;padding:26px 28px 24px;border-radius:24px;background:#fff;border:1px solid #CFE2F7;
  box-shadow:0 30px 60px -44px rgba(30,111,217,.6);overflow:hidden}
.c21-prose :is(.study-banner,.case-banner)::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#38B6FF,#1E6FD9)}
.c21-prose .indication-status{max-width:100%;white-space:normal;line-height:1.4;letter-spacing:.08em}
.c21-prose .badge,.c21-prose .indication-status{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;padding:6px 12px;border-radius:999px;font:700 11px/1 var(--fs);letter-spacing:.14em;text-transform:uppercase;color:#fff;background:#0B2545}
.c21-prose .badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.c21-prose :is(.study-banner,.case-banner) h4{margin:0 0 10px;font-size:20px;line-height:1.3}
.c21-prose :is(.study-banner,.case-banner) p{font-size:16.5px;line-height:1.65}
.c21-prose :is(.study-banner,.case-banner,.evidence-card,.callout,.cta-box,.ox-glycanage-box)>:last-child{margin-bottom:0}
.c21-prose :is(.study-banner,.case-banner,.evidence-card,.callout) p:last-child{margin-bottom:0}
.c21-prose .evidence-card{position:relative;margin:2.2em 0;padding:24px 26px 22px 30px;border-radius:22px;background:linear-gradient(100deg,rgba(63,201,183,.09),rgba(63,201,183,.02));border:1px solid rgba(63,201,183,.28)}
.c21-prose .evidence-card::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:4px;border-radius:0 4px 4px 0;background:#3FC9B7}
.c21-prose .ec-label{display:inline-flex;align-items:center;gap:8px;margin-bottom:10px;font:700 11.5px/1.3 var(--fs);letter-spacing:.14em;text-transform:uppercase;color:#1F8F80}
.c21-prose .ec-label::before{content:"";width:16px;height:16px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3Cpath d='M4 21v-1a7 7 0 0 1 14 0v1'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3Cpath d='M4 21v-1a7 7 0 0 1 14 0v1'/%3E%3C/svg%3E") center/contain no-repeat}
.c21-prose .evidence-card p{font-size:16.5px;line-height:1.65}
.c21-prose .callout,.c21-prose .cta-box,.c21-prose .ox-glycanage-box{position:relative;margin:2.2em 0;padding:24px 26px;border-radius:22px;background:linear-gradient(180deg,#EEF7FF,#F6FBFF);border:1px solid #CFE6FA}
.c21-prose .callout>p:first-child strong,.c21-prose .ox-glycanage-head{display:block;font:650 18px/1.35 var(--fd);color:var(--ink)}
.c21-prose .pull-quote{margin:2em 0;padding:4px 0 4px 26px;border-left:3px solid #38B6FF;font:300 24px/1.45 var(--fd);color:var(--ink);letter-spacing:-.01em}
.c21-prose .lead{font-size:20px;line-height:1.65;color:var(--ink2)}
.c21-prose .italic-text{font-style:italic}
.c21-prose .interview .q,.c21-prose .q{margin:1.8em 0 .5em;font:650 18px/1.45 var(--fd);color:var(--ink)}
.c21-prose .interview .q::before,.c21-prose p.q::before{content:"V";display:inline-grid;place-items:center;width:26px;height:26px;margin-right:10px;border-radius:50%;font:700 12px/1 var(--fd);color:#fff;background:var(--oxy);vertical-align:2px}
.c21-prose .closing-head{margin-top:2em;font:650 20px/1.35 var(--fd);color:var(--ink)}
.c21-prose .cta-btn{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border-radius:999px;background:var(--oxy);color:#fff!important;text-decoration:none;font-weight:600}

/* kontrolni seznam (»komu bi koristila«) */
.c21-prose ul.profile-list{margin:1.2em 0 1.6em;padding:0;list-style:none;display:grid;gap:10px}
.c21-prose ul.profile-list li{position:relative;margin:0;padding:14px 18px 14px 54px;border-radius:16px;background:#F5F9FD;border:1px solid var(--line);font-size:16.5px;line-height:1.55}
.c21-prose ul.profile-list li::before{content:"";position:absolute;left:16px;top:14px;width:24px;height:24px;border-radius:50%;
  background:linear-gradient(140deg,#38B6FF,#1E6FD9) ;box-shadow:0 6px 14px -6px rgba(30,111,217,.8)}
.c21-prose ul.profile-list li::after{content:"";position:absolute;left:21px;top:19px;width:14px;height:14px;background:#fff;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}
.c21-prose .callout ul.profile-list li{background:#fff}
.c21-prose .callout ul.profile-list li::before{background:#fff;box-shadow:inset 0 0 0 1.5px #38B6FF}
.c21-prose .callout ul.profile-list li::after{background:var(--oxy);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3M12 17h.01'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3M12 17h.01'/%3E%3C/svg%3E") center/contain no-repeat}

/* tabele */
.c21-prose .c21-tbl{margin:2em 0 1em;border-radius:20px;border:1px solid var(--line);overflow:auto;box-shadow:0 24px 50px -42px rgba(11,27,46,.5)}
.c21-prose table{width:100%;margin:0;border-collapse:collapse;font-size:15.5px;line-height:1.5}
.c21-prose th{padding:14px 18px;text-align:left;font:650 13px/1.3 var(--fs);letter-spacing:.06em;text-transform:uppercase;color:#fff;background:linear-gradient(90deg,#0B2545,#123764)}
.c21-prose td{padding:14px 18px;border-top:1px solid var(--line);vertical-align:top}
.c21-prose tbody tr:nth-child(even) td{background:#F7FAFD}
.c21-prose td:first-child{font-weight:650;color:var(--ink);white-space:nowrap}
.c21-prose tbody tr:first-child td{border-top:0}

/* stolpčni grafi iz CSS (starejši članki) */
.c21-prose .css-chart-container{margin:2em 0;padding:24px;border-radius:22px;background:#F7FAFD;border:1px solid var(--line)}
.c21-prose .css-chart-row{display:grid;grid-template-columns:minmax(0,180px) minmax(0,1fr);align-items:center;gap:14px;margin:10px 0}
.c21-prose .css-chart-label{font-size:14px;line-height:1.35;color:var(--ink2)}
.c21-prose .css-chart-bar-area{position:relative;height:26px;border-radius:8px;background:#E6EEF6;overflow:hidden}
.c21-prose .css-chart-bar{height:100%;border-radius:8px;background:linear-gradient(90deg,#1E6FD9,#38B6FF);color:#fff;font:600 12.5px/26px var(--fs);padding-left:10px;white-space:nowrap}
.c21-prose .bar-pharma{background:linear-gradient(90deg,#8FA3B8,#B7C6D6)}
.c21-prose .bar-aero1,.c21-prose .bar-aero2{background:linear-gradient(90deg,#3FC9B7,#7FE3D6)}

/* video */
.c21-prose .c21-video,.c21-prose .video-embed{position:relative;margin:2em 0;aspect-ratio:16/9;border-radius:22px;overflow:hidden;background:#071A30;box-shadow:0 30px 60px -40px rgba(11,27,46,.7)}
.c21-prose .c21-video iframe,.c21-prose .video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.c21-prose .video-embed .c21-video{margin:0;border-radius:0;box-shadow:none;position:absolute;inset:0;aspect-ratio:auto}
.c21-prose .wp-block-embed{margin:2em 0}
.c21-prose .wp-block-embed__wrapper{position:static}

/* pogosta vprašanja – harmonika */
.c21-prose .faq-item{margin:0;border-bottom:1px solid var(--line)}
.c21-prose h2+.faq-item,.c21-prose .faq-item:first-of-type{border-top:1px solid var(--line)}
.c21-prose .c21-faq-h{margin:0;font-size:inherit}
.c21-prose .c21-faq-b{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;padding:20px 4px;border:0;background:none;text-align:left;cursor:pointer;font:650 17.5px/1.4 var(--fd);color:var(--ink)}
.c21-prose .c21-faq-b i{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:var(--tint);color:var(--oxy);transition:transform .35s var(--ease),background-color .25s,color .25s}
.c21-prose .c21-faq-b i .ico{width:16px;height:16px}
.c21-prose .c21-faq-b:hover i{background:var(--oxy);color:#fff}
.c21-prose .faq-item:not(.is-closed) .c21-faq-b i{transform:rotate(45deg);background:var(--oxy);color:#fff}
.c21-prose .c21-faq-a{padding:0 54px 18px 4px;font-size:16.5px;line-height:1.65;color:var(--ink2)}
.c21-prose .faq-item.is-closed .c21-faq-a{display:none}
.c21-prose .c21-faq-a p:last-child{margin-bottom:0}

/* povzetek (verdict) */
.c21-prose .verdict-box{position:relative;margin:2.6em 0 2.2em;padding:clamp(28px,2vw + 12px,40px);border-radius:28px;overflow:hidden;isolation:isolate;color:rgba(232,240,248,.9);
  background:radial-gradient(70% 90% at 100% 0%,rgba(56,182,255,.3) 0%,rgba(56,182,255,0) 60%),linear-gradient(150deg,#0F3563 0%,#0A2547 55%,#071A30 100%);box-shadow:0 50px 90px -50px rgba(11,27,46,.9)}
.c21-prose .verdict-box::before{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;border:1px solid rgba(127,219,255,.25);box-shadow:inset 0 0 50px rgba(127,219,255,.12)}
.c21-prose .verdict-box :is(h2,h3,h4){margin:0 0 14px;font:400 clamp(24px,1vw + 15px,30px)/1.2 var(--fd);letter-spacing:-.018em;color:#fff}
.c21-prose .verdict-box p{font-size:16.5px;line-height:1.7}
.c21-prose .verdict-box p:last-child{margin-bottom:0}
.c21-prose .verdict-box strong{color:#fff}
.c21-prose .verdict-box a{color:var(--aqua)}

/* viri */
.c21-prose .references-section{position:relative;margin:2.4em 0 1.6em;padding:26px 28px 22px;border-radius:24px;background:#F7FAFD;border:1px solid var(--line)}
.c21-prose .references-section>:is(h2,h3,h4){display:flex;align-items:center;gap:10px;margin:0 0 14px;font:700 13px/1.2 var(--fs);letter-spacing:.14em;text-transform:uppercase;color:var(--oxy-ink)}
.c21-prose .references-section>:is(h2,h3,h4)::before{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H20v20H6.5a2.5 2.5 0 0 1 0-5H20'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H20v20H6.5a2.5 2.5 0 0 1 0-5H20'/%3E%3C/svg%3E") center/contain no-repeat}
.c21-prose .references-list{margin:0;padding:0 0 0 1.6em;font-size:14px;line-height:1.6;color:var(--muted)}
.c21-prose .references-list li{margin:0 0 .6em;padding-left:.3em;overflow-wrap:anywhere}
.c21-prose .references-list li::marker{font:700 12.5px var(--fd);color:var(--oxy)}
.c21-prose .references-list a{color:var(--oxy-ink)}
.c21-prose .references-section.is-short :is(ol,ul)>li:nth-child(n+5){display:none}
.c21-prose .references-section :is(ol,ul){margin:0;padding:0 0 0 1.6em;font-size:14px;line-height:1.6;color:var(--muted)}
.c21-prose .references-section li{margin:0 0 .6em;padding-left:.3em;overflow-wrap:anywhere}
.c21-prose .references-section.is-short :is(ol,ul){-webkit-mask-image:linear-gradient(180deg,#000 70%,rgba(0,0,0,.35));mask-image:linear-gradient(180deg,#000 70%,rgba(0,0,0,.35))}
.c21-prose .c21-ref-more{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:10px 16px;border-radius:999px;border:1px solid var(--line2);background:#fff;color:var(--oxy-ink);font:600 14px/1 var(--fs);cursor:pointer;transition:background-color .2s,border-color .2s}
.c21-prose .c21-ref-more .ico{width:16px;height:16px;transition:transform .3s var(--ease)}
.c21-prose .c21-ref-more.is-open .ico{transform:rotate(180deg)}
.c21-prose .c21-ref-more:hover{background:var(--tint);border-color:#B9D5F2}

/* opozorilo */
.c21-prose .disclaimer-section{margin:1.6em 0 0;padding:22px 26px;border-radius:20px;background:#F3F6F9;border:1px solid #E3E9EF;font-size:14px;line-height:1.65;color:#66768A}
.c21-prose .disclaimer-section>:is(h2,h3,h4){display:flex;align-items:center;gap:10px;margin:0 0 10px;font:650 14px/1.3 var(--fs);letter-spacing:0;text-transform:none;color:#3E4F63}
.c21-prose .disclaimer-section>:is(h2,h3,h4)::before{content:"i";display:grid;place-items:center;width:20px;height:20px;border-radius:50%;font:700 12px/1 var(--fd);color:#fff;background:#8797A9}
.c21-prose .disclaimer-section p{margin:0 0 .8em}
.c21-prose .disclaimer-section p:last-child{margin-bottom:0}

/* sorodne povezave, vstavljene v starejše članke */
/* (36 člankov ima ta okvir z vgrajenimi slogi style= – zato tu izjemoma !important) */
.c21-prose .oxy-sorodni{margin:2.4em 0 1em!important;padding:22px 24px!important;border-radius:22px;background:#F7FAFD;border:1px solid var(--line)!important}
.c21-prose .oxy-sorodni :is(h2,h3,h4,p:first-child){margin:0 0 12px!important;font:700 12.5px/1.3 var(--fs)!important;letter-spacing:.14em!important;text-transform:uppercase;color:var(--oxy-ink)!important}
.c21-prose .oxy-sorodni ul{margin:0!important;padding:0!important;list-style:none;display:grid;gap:8px}
.c21-prose .oxy-sorodni li{margin:0!important;padding:0!important;list-style:none!important}
.c21-prose .oxy-sorodni li::marker{content:none}
.c21-prose .oxy-sorodni a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid var(--line);text-decoration:none!important;font:600 15.5px/1.4 var(--fs)!important;color:var(--ink)!important;transition:border-color .2s,color .2s,transform .3s var(--ease)}
.c21-prose .oxy-sorodni a::after{content:"→";flex:none;color:var(--oxy)}
.c21-prose .oxy-sorodni a:hover{border-color:#B9D5F2;color:var(--oxy)!important;transform:translateX(3px)}

/* poziv sredi članka (vstavi predloga) */
.c21-prose .c21-cta{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px 28px;margin:2.6em 0;padding:30px 32px;border-radius:28px;overflow:hidden;isolation:isolate;color:var(--on);
  background:radial-gradient(70% 90% at 100% 0%,rgba(56,182,255,.35) 0%,rgba(56,182,255,0) 60%),linear-gradient(135deg,#1E6FD9 0%,#0F4E9E 55%,#0A3570 100%);box-shadow:0 40px 80px -46px rgba(30,111,217,.85)}
.c21-cta-bub{z-index:-1}
.c21-cta-bub i{border-color:rgba(255,255,255,.55);animation-name:c21RiseS,c21Sway}
.c21-cta-bub i:nth-child(1){--x:8%;--s:9px;--t:12s;--dl:-3s}
.c21-cta-bub i:nth-child(2){--x:30%;--s:5px;--t:10s;--dl:-7s}
.c21-cta-bub i:nth-child(3){--x:55%;--s:12px;--t:14s;--dl:-1s}
.c21-cta-bub i:nth-child(4){--x:76%;--s:6px;--t:11s;--dl:-9s}
.c21-cta-bub i:nth-child(5){--x:93%;--s:8px;--t:13s;--dl:-5s}
.c21-prose .c21-cta .c21-eyebrow{color:#D9F6FF}
.c21-prose .c21-cta-h{margin:10px 0 8px;font:300 clamp(24px,1vw + 15px,31px)/1.15 var(--fd);letter-spacing:-.018em;color:#fff}
.c21-prose .c21-cta-h span{font-weight:600}
.c21-prose .c21-cta-x{margin:0;font-size:15px;line-height:1.55;color:rgba(255,255,255,.86)}
.c21-prose .c21-cta-a{display:flex;flex-direction:column;align-items:stretch;gap:2px}
.c21-prose .c21-cta .btn-primary{background:#fff;color:#0A1A2E;box-shadow:0 18px 36px -18px rgba(0,0,0,.6)}
.c21-prose .c21-cta .btn-primary:hover{background:#EAF6FF}
.c21-prose .c21-cta .c21-tel{justify-content:center;min-height:44px;font-size:15.5px;color:#fff;text-decoration:none}

/* vstopne animacije gradnikov */
.c21-prose .c21-rv.is-in{animation:c21Up .8s var(--ease) backwards}
.c21-prose .hero-stat-row.is-in .hero-stat{animation:c21Up .8s var(--ease) backwards}
.c21-prose .hero-stat-row.is-in .hero-stat:nth-child(2){animation-delay:.1s}
.c21-prose .hero-stat-row.is-in .hero-stat:nth-child(3){animation-delay:.2s}

/* ---------- 3. sorodni članki ---------- */
.c21-rel{position:relative;padding-block:clamp(80px,5vw + 30px,130px) 30px;background:#06162B}
.c21-rel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:30px}
.c21-rel-head>div{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.c21-rel-l{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0;padding:0;list-style:none}
.c21-rel-l li{display:flex}
.c21-rc{display:flex;flex-direction:column;width:100%;border-radius:24px;overflow:hidden;text-decoration:none;color:inherit;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid rgba(127,219,255,.12);transition:transform .5s var(--ease),border-color .3s,box-shadow .5s var(--ease)}
.c21-rc:hover{transform:translateY(-5px);border-color:rgba(var(--kr),.5);box-shadow:0 40px 70px -40px rgba(0,0,0,.95),0 0 50px -22px rgba(var(--kr),.6)}
.c21-rc-cov{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:radial-gradient(120% 90% at 85% 0%,rgba(var(--kr),.38) 0%,rgba(var(--kr),0) 60%),linear-gradient(150deg,#0C2747 0%,#071A30 100%)}
.c21-rc-cov img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.c21-rc:hover .c21-rc-cov img{transform:scale(1.06)}
.c21-rc-fb{position:absolute;inset:0;display:grid;place-items:center;color:rgba(var(--kr),.85)}
.c21-rc-fb .ico{width:40px;height:40px;stroke-width:1.4}
.c21-rc-b{display:flex;flex-direction:column;gap:10px;padding:20px 22px 22px}
.c21-rc-t{font:600 18px/1.3 var(--fd);color:#fff;text-wrap:pretty}
.c21-rc-m{font-size:13.5px;color:var(--on3)}

/* ---------- 4. sklepni poziv ---------- */
.c21-end{position:relative;padding-block:40px clamp(96px,6vw + 30px,150px);background:#06162B}
.c21-end-card{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) auto;align-items:center;gap:30px 48px;padding:clamp(40px,3vw + 16px,64px);border-radius:36px;overflow:hidden;isolation:isolate;
  background:radial-gradient(70% 90% at 100% 0%,rgba(56,182,255,.35) 0%,rgba(56,182,255,0) 60%),linear-gradient(135deg,#1E6FD9 0%,#0F4E9E 55%,#0A3570 100%);box-shadow:0 60px 100px -50px rgba(30,111,217,.75),inset 0 1px 0 rgba(255,255,255,.18)}
.c21-end-card .c21-em{background:none;color:#D9F6FF;-webkit-text-fill-color:#D9F6FF}
.c21-end-t{display:flex;flex-direction:column;gap:12px}
.c21-end-t p{margin:0;font-size:19px;color:rgba(255,255,255,.88)}
.c21-end-a{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px}
.c21-end .btn-primary{background:#fff;color:#0A1A2E;box-shadow:0 18px 36px -18px rgba(0,0,0,.6)}
.c21-end .btn-primary:hover{background:#EAF6FF;color:#0A1A2E}
.c21-end-bub{z-index:-1}
.c21-end-bub i{border-color:rgba(255,255,255,.55);animation-name:c21RiseE,c21Sway}
.c21-end-bub i:nth-child(1){--x:6%;--s:10px;--t:16s;--dl:-3s}
.c21-end-bub i:nth-child(2){--x:22%;--s:6px;--t:12s;--dl:-8s}
.c21-end-bub i:nth-child(3){--x:41%;--s:14px;--t:19s;--dl:-1s}
.c21-end-bub i:nth-child(4){--x:58%;--s:5px;--t:13s;--dl:-10s}
.c21-end-bub i:nth-child(5){--x:77%;--s:11px;--t:17s;--dl:-6s}
.c21-end-bub i:nth-child(6){--x:92%;--s:7px;--t:14s;--dl:-12s}

/* kazalo na telefonu + obvestilo */
.c21-tocbtn{position:fixed;left:16px;bottom:calc(88px + env(safe-area-inset-bottom,0px));z-index:49;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 14px;border-radius:999px;border:1px solid rgba(127,219,255,.35);
  background:rgba(7,26,48,.92);color:#fff;font:600 14px/1 var(--fs);box-shadow:0 16px 30px -12px rgba(0,0,0,.6);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .3s,transform .4s var(--ease)}
.c21-tocbtn.is-on{opacity:1;transform:none;pointer-events:auto}
.c21-tocbtn .ico{width:18px;height:18px;color:var(--cyan)}
.c21-tocbtn span{padding:3px 8px;border-radius:999px;font-size:12px;background:rgba(127,219,255,.16);color:var(--cyan)}
.c21-tocbtn span:empty{display:none}
.c21-tocdlg{width:100%;max-width:none;max-height:80svh;margin:auto 0 0;padding:0;border:0;border-radius:26px 26px 0 0;background:#fff;color:var(--ink)}
.c21-tocdlg::backdrop{background:rgba(4,11,22,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.c21-tocdlg[open]{animation:c21Sheet .4s var(--ease)}
.c21-tocdlg-in{padding:18px 18px calc(22px + env(safe-area-inset-bottom,0px))}
.c21-tocdlg-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.c21-tocdlg-top p{margin:0;font:700 12.5px/1 var(--fs);letter-spacing:.14em;text-transform:uppercase;color:var(--oxy-ink)}
.c21-tocdlg-top button{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:0;background:var(--tint);color:var(--ink);cursor:pointer}
.c21-tocdlg .c21-toc-l{max-height:none}
.c21-tocdlg .c21-toc-l a{font-size:15.5px;padding:12px 10px}
.c21-toast{position:fixed;left:50%;bottom:110px;z-index:70;max-width:min(90vw,520px);padding:12px 18px;border-radius:14px;background:#0B2545;color:#fff;font:500 14.5px/1.4 var(--fs);box-shadow:0 20px 40px -16px rgba(0,0,0,.7);
  transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:opacity .3s,transform .4s var(--ease);overflow-wrap:anywhere}
.c21-toast.is-on{opacity:1;transform:translate(-50%,0)}

/* preizkus predloge (le maketa) */
.c21-test{position:fixed;right:18px;bottom:18px;z-index:55;width:360px;border-radius:18px;background:rgba(255,255,255,.97);color:#0B1B2E;font:14px/1.45 'Instrument Sans','Inter',system-ui,sans-serif;box-shadow:0 20px 50px -18px rgba(0,0,0,.55);border:1px solid #D8E2EC}
.c21-test-t{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 16px;border:0;background:none;font:700 12px/1 'Instrument Sans','Inter',system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#1557B0;cursor:pointer}
.c21-test-t .ico{width:16px;height:16px;transition:transform .3s;fill:none;stroke:currentColor;stroke-width:2}
.c21-test.is-open .c21-test-t .ico{transform:rotate(180deg)}
.c21-test-b{display:none;padding:0 16px 16px}
.c21-test.is-open .c21-test-b{display:block}
.c21-test-b p{margin:0 0 10px;color:#4A5B6E}
.c21-test select{width:100%;height:42px;padding:0 10px;border-radius:10px;border:1px solid #C9D6E3;background:#fff;font:inherit;color:#0B1B2E}
.c21-test-s{margin-top:10px!important;font-size:12.5px;color:#6B7B8D!important}

@property --c21a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes c21Spin{to{--c21a:360deg}}
@keyframes c21Up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes c21Sheet{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
@keyframes c21Rise{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}6%{opacity:.75}100%{transform:translate3d(0,-1000px,0) scale(1.1);opacity:.3}}
@keyframes c21RiseS{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}8%{opacity:.7}100%{transform:translate3d(0,-460px,0) scale(1.1);opacity:.2}}
@keyframes c21RiseE{0%{transform:translate3d(0,0,0) scale(.6);opacity:0}8%{opacity:.7}100%{transform:translate3d(0,-460px,0) scale(1.1);opacity:.2}}
@keyframes c21Sway{from{translate:-8px 0}to{translate:8px 0}}
.c21.is-ready .c21-hero-t>*{animation:c21Up .9s var(--ease) backwards}
.c21.is-ready .c21-hero-t>:nth-child(2){animation-delay:.05s}
.c21.is-ready .c21-hero-t>:nth-child(3){animation-delay:.1s}
.c21.is-ready .c21-hero-t>:nth-child(4){animation-delay:.18s}
.c21.is-ready .c21-hero-t>:nth-child(5){animation-delay:.26s}
.c21.is-ready .c21-hero-t>:nth-child(6){animation-delay:.32s}
.c21.is-ready .c21-fig{animation:c21Up 1.1s var(--ease) .2s backwards}

/* ---------- tablica (do 1023 px) ---------- */
@media (max-width:1023.98px){
  .c21-hero{padding-top:calc(var(--hh,136px) + 4px);padding-bottom:120px}
  .c21-hero-in{grid-template-columns:1fr;gap:34px}
  .c21-fig{max-width:640px}
  .c21-grid{grid-template-columns:1fr}
  .c21-rail{display:none}
  .c21-sheet{margin-top:-90px;border-radius:28px}
  .c21-rel-l{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c21-rel-l li:nth-child(3){display:none}
  .c21-end-card{grid-template-columns:1fr}
  .c21-end-a{justify-content:flex-start}
  .c21-test{display:none}
}
/* ---------- telefon (do 639 px) ---------- */
@media (max-width:639.98px){
  .c21-hero h1{font-size:clamp(32px,8.6vw,42px)}
  .c21-lead{font-size:17px}
  .c21-meta{gap:8px 14px}
  .c21-byrow{gap:14px}
  .c21-fig{border-radius:22px}
  .c21-body{padding-bottom:70px}
  .c21-body .wrap{padding-inline:10px}
  .c21-sheet{margin-top:-80px;padding:26px 18px 34px;border-radius:24px}
  .c21-prose{font-size:17px;line-height:1.72}
  .c21-prose h2{font-size:25px;margin-top:2.2em}
  .c21-prose .key-points{padding:24px 20px 22px;border-radius:22px}
  .c21-prose .key-points li{font-size:15.5px}
  .c21-prose .hero-stat-row{grid-template-columns:1fr;gap:10px}
  .c21-prose .hero-stat{flex-direction:row;align-items:center;gap:16px;padding:16px 18px}
  .c21-prose .hero-stat .number{flex:none;min-width:96px;font-size:26px}
  .c21-prose :is(.mechanism-grid,.domain-grid,.brain-regions-grid,.numbered-cards,.profiles){grid-template-columns:1fr;gap:10px}
  .c21-prose figure{padding:14px;border-radius:18px}
  .c21-prose :is(.study-banner,.case-banner,.evidence-card,.callout){padding:20px 18px 18px 22px;border-radius:18px}
  .c21-prose ul.profile-list li{padding:12px 14px 12px 48px;font-size:15.5px}
  .c21-prose ul.profile-list li::before{left:12px;top:12px}
  .c21-prose ul.profile-list li::after{left:18px;top:18px}
  .c21-prose td:first-child{white-space:normal}
  .c21-prose :is(th,td){padding:12px 14px}
  .c21-prose .c21-cta{grid-template-columns:1fr;padding:26px 22px;border-radius:22px}
  .c21-prose .c21-faq-b{font-size:16.5px}
  .c21-prose .c21-faq-a{padding-right:8px}
  .c21-prose .verdict-box{border-radius:22px}
  .c21-prose .references-section{padding:20px 18px}
  .c21-prose .css-chart-row{grid-template-columns:1fr;gap:6px}
  .c21-rel-l{grid-template-columns:1fr}
  .c21-rel-l li:nth-child(3){display:flex}
  .c21-rel-head{flex-direction:column;align-items:flex-start}
  .c21-end-card{padding:32px 22px;border-radius:28px}
}
@media (min-width:1024px){
  .c21-tocbtn,.c21-tocdlg,.c21-prog{display:none!important}
}
@media (prefers-reduced-motion:reduce){
  .c21 *,.c21 *::before,.c21 *::after{animation:none!important;transition:none!important}
}



/* ===== v1.0.2 – članki: varovala za starejše oblike vsebine ===== */
/* ikona kartice (svg brez velikosti pred naslovom), npr. .mechanism-card */
.c21-prose :is(div,li)[class] > svg:first-child:not([width]):has(+ :is(h3,h4,h5)){width:46px;height:46px;display:block;margin:0 0 14px}
/* »Status indikacije« kot daljše besedilo: kartica namesto značke */
.c21-prose .indication-status:has(> strong ~ em){display:block;max-width:none;border-radius:18px;padding:18px 22px;margin:28px 0;text-transform:none;font:400 15.5px/1.6 var(--x-sans,inherit);letter-spacing:0;background:linear-gradient(135deg,#0B2545,#103A6B);color:#E8F0F8;box-shadow:0 18px 40px -24px rgba(4,11,22,.6)}
.c21-prose .indication-status:has(> strong ~ em) > *{display:inline;text-transform:none;font-size:inherit;letter-spacing:0;color:inherit}
.c21-prose .indication-status:has(> strong ~ em) > strong:first-child{display:block;margin:0 0 8px;font:700 11px/1.2 var(--x-sans,inherit);letter-spacing:.14em;text-transform:uppercase;color:#7FDBFF}
.c21-prose .indication-status:has(> strong ~ em) > strong:not(:first-child){font-weight:700;color:#fff}

/* ===== v1.0.4 – podstrani na telefonu in tablici (< 1024 px): nižja glava, logotip v pravem razmerju ===== */
@media (max-width:1023.98px){
  .oxy-pod .head-inner{height:80px;padding-top:4px}
  .oxy-pod .site-head .brand{top:0;flex:none}
  .oxy-pod .site-head .brand picture{display:block;flex:none}
  .oxy-pod .site-head .brand-logo{height:58px;width:auto;max-width:none;flex:none;object-fit:contain}
  .oxy-pod .i19{padding-top:0!important}
  .oxy-pod :is(.i19-hero,.b20-hero,.l18-hero,.c21-hero),
  .oxy-pod main > .pg-top{padding-top:calc(96px + env(safe-area-inset-top,0px))!important}
}