/* BBB CMS · Panorama projekata: široka traka istaknutih projekata sa listanjem levo/desno.
   Zajednička za sve teme; boje i zaobljenja dolaze iz profila boja sajta (--green, --text, --card-bg…). */
.bbb-panorama{--pan-akcent:var(--green,#FF7E05);--pan-tekst:#fff;--pan-radius:var(--radius-large,22px);--pan-gap:18px;--pan-slide:78%;position:relative;margin-top:26px}
.bbb-panorama-viewport{overflow:hidden;border-radius:var(--pan-radius)}
.bbb-panorama-track{list-style:none;margin:0;padding:0;display:flex;gap:var(--pan-gap);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab;padding-inline:0}
.bbb-panorama-track::-webkit-scrollbar{display:none}
.bbb-panorama-track.prevlaci{cursor:grabbing;scroll-behavior:auto;scroll-snap-type:none}
.bbb-panorama-slide{position:relative;flex:0 0 var(--pan-slide);max-width:var(--pan-slide);scroll-snap-align:center;scroll-snap-stop:always;border-radius:var(--pan-radius);overflow:hidden;background:#101214;aspect-ratio:16/9;isolation:isolate;box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}
.bbb-panorama-slide:first-child{scroll-snap-align:start}
.bbb-panorama-slide:last-child{scroll-snap-align:end}
.bbb-panorama-media{position:absolute;inset:0;display:block;border:0;padding:0;margin:0;background:transparent;cursor:pointer;width:100%;height:100%;text-align:left;font:inherit;color:inherit}
.bbb-panorama-media picture,.bbb-panorama-media img{display:block;width:100%;height:100%}
.bbb-panorama-media img{object-fit:cover;object-position:center;transform:scale(1.02);transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.bbb-panorama-slide.aktivan .bbb-panorama-media img{transform:scale(1)}
.bbb-panorama-slide:hover .bbb-panorama-media img{transform:scale(1.045)}
/* Logotipi i grafika koju ne treba seći: cela slika na zamućenoj pozadini iste slike. */
.bbb-panorama-slide[data-fit="contain"] .bbb-panorama-media,.bbb-panorama-media[data-fokus="manje"]{background:var(--pan-slika) center/cover no-repeat}
.bbb-panorama-media[data-fokus="manje"] img,.bbb-panorama-media[data-fokus="manje"] picture{position:relative;z-index:1}
.bbb-panorama-slide[data-fit="contain"] .bbb-panorama-media::before,.bbb-panorama-media[data-fokus="manje"]::before{content:"";position:absolute;inset:-40px;background:var(--pan-slika) center/cover no-repeat;filter:blur(34px) saturate(1.15) brightness(.55);z-index:0}
.bbb-panorama-slide[data-fit="contain"] .bbb-panorama-media img{position:relative;z-index:1;object-fit:contain;padding:clamp(28px,7%,72px);transform:none}
.bbb-panorama-slide[data-fit="contain"] .bbb-panorama-media picture{position:relative;z-index:1}
.bbb-panorama-caption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(22px,4vw,44px) clamp(22px,4vw,46px);color:var(--pan-tekst);display:grid;gap:8px;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.42) 45%,rgba(0,0,0,.78) 100%)}
.bbb-panorama-caption>*{pointer-events:auto;max-width:min(680px,92%)}
.bbb-panorama-kicker{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--pan-akcent)}
.bbb-panorama-kicker span+span::before{content:"·";margin-right:14px;color:rgba(255,255,255,.55)}
.bbb-panorama-caption h3{margin:0;font-size:clamp(1.35rem,2.4vw,2.35rem);line-height:1.08;letter-spacing:-.02em;color:#fff;text-transform:none;white-space:pre-wrap;text-shadow:0 2px 18px rgba(0,0,0,.35)}
.bbb-panorama-caption p{margin:0;font-size:clamp(.9rem,1.1vw,1.02rem);line-height:1.55;color:rgba(255,255,255,.82);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bbb-panorama-cta{display:inline-flex;align-items:center;gap:10px;margin-top:6px;padding:11px 18px;border-radius:999px;background:var(--pan-akcent);color:#0b0b0b;font-weight:700;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:transform .25s,box-shadow .25s;width:max-content}
.bbb-panorama-cta:hover{transform:translateY(-2px);box-shadow:0 14px 30px -12px var(--pan-akcent)}
.bbb-panorama-cta[data-svetao="1"]{color:#fff}
/* Strelice, tačke, brojač, traka napretka */
.bbb-panorama-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(12,12,14,.55);color:#fff;font-size:1.6rem;line-height:1;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:background .25s,transform .25s,opacity .25s;opacity:.92}
.bbb-panorama-arrow:hover{background:var(--pan-akcent);color:#0b0b0b;border-color:transparent}
.bbb-panorama-arrow:disabled{opacity:.28;cursor:default;transform:translateY(-50%)}
.bbb-panorama-arrow.prev{left:14px}.bbb-panorama-arrow.next{right:14px}
.bbb-panorama-arrow svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.bbb-panorama-dno{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:16px;padding-inline:4px}
.bbb-panorama-dno:not(:has(.bbb-panorama-brojac)){justify-content:center}
.bbb-panorama-dots{display:flex;gap:8px;margin:0;padding:0;list-style:none}
.bbb-panorama-dots button{width:10px;height:10px;border-radius:999px;border:0;padding:0;background:color-mix(in srgb,var(--pan-akcent) 38%,transparent);cursor:pointer;transition:width .3s,background .3s}
.bbb-panorama-dots button:hover{background:color-mix(in srgb,var(--pan-akcent) 70%,transparent)}
.bbb-panorama-dots button[aria-current="true"]{width:30px;background:var(--pan-akcent)}
.bbb-panorama-brojac{font-variant-numeric:tabular-nums;font-size:.78rem;letter-spacing:.14em;color:inherit;opacity:.62;text-transform:uppercase}
.bbb-panorama-brojac b{font-weight:700;opacity:1}
.bbb-panorama-napredak{position:absolute;left:0;right:0;bottom:0;height:3px;z-index:3;background:rgba(255,255,255,.14);opacity:0;transition:opacity .3s}
.bbb-panorama[data-auto="1"] .bbb-panorama-napredak{opacity:1}
.bbb-panorama-napredak i{display:block;height:100%;width:0;background:var(--pan-akcent);transition:width .2s linear}
.bbb-panorama[data-pauza="1"] .bbb-panorama-napredak i{transition:none}
/* ---- Stil „kover" (podrazumevano): centralna kartica velika i osvetljena, susedne umanjene i zatamnjene sa strane ---- */
.bbb-panorama[data-stil="kover"]{--pan-slide:62%}
.bbb-panorama[data-stil="kover"] .bbb-panorama-viewport{overflow:visible;border-radius:0;padding-block:18px 26px}
/* Prva/poslednja kartica dobijaju margine (ne padding trake: procenat širine kartice računa se prema sadržaju trake). */
.bbb-panorama[data-stil="kover"] .bbb-panorama-track{overflow-y:visible}
.bbb-panorama[data-stil="kover"] .bbb-panorama-slide:first-child{margin-left:calc((100% - var(--pan-slide)) / 2)}
.bbb-panorama[data-stil="kover"] .bbb-panorama-slide:last-child{margin-right:calc((100% - var(--pan-slide)) / 2)}
.bbb-panorama[data-stil="kover"] .bbb-panorama-slide,.bbb-panorama[data-stil="kover"] .bbb-panorama-slide:first-child,.bbb-panorama[data-stil="kover"] .bbb-panorama-slide:last-child{scroll-snap-align:center;transform-origin:center;will-change:transform,opacity;transition:box-shadow .45s,outline-color .45s;outline:2px solid transparent;outline-offset:-2px}
.bbb-panorama[data-stil="kover"] .bbb-panorama-slide.aktivan{outline-color:color-mix(in srgb,var(--pan-akcent) 70%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--pan-akcent) 35%,transparent),0 30px 70px -20px color-mix(in srgb,var(--pan-akcent) 45%,rgba(0,0,0,.6)),0 30px 60px -30px rgba(0,0,0,.6)}
.bbb-panorama[data-stil="kover"] .bbb-panorama-caption{transition:opacity .35s,transform .35s}
.bbb-panorama[data-stil="kover"] .bbb-panorama-slide:not(.aktivan) .bbb-panorama-caption{opacity:0;transform:translateY(10px);pointer-events:none}
.bbb-panorama[data-stil="kover"] .bbb-panorama-arrow{background:rgba(12,12,14,.7)}
@media (min-width:1600px){.bbb-panorama[data-stil="kover"]{--pan-slide:56%}}
@media (max-width:1024px){.bbb-panorama[data-stil="kover"]{--pan-slide:72%}}
@media (max-width:760px){.bbb-panorama[data-stil="kover"]{--pan-slide:78%}}
/* Tamna sekcija teme: tačke i brojač u svetlim bojama. */
.bbb-panorama.tamno{--text:#fff;--muted:rgba(255,255,255,.66)}
/* Jedan projekat: cela širina, bez listanja. */
.bbb-panorama[data-broj="1"]{--pan-slide:100%}
.bbb-panorama[data-broj="1"] .bbb-panorama-arrow,.bbb-panorama[data-broj="1"] .bbb-panorama-dno{display:none}
@media (min-width:1600px){.bbb-panorama{--pan-slide:72%}}
@media (max-width:1024px){.bbb-panorama{--pan-slide:84%;--pan-gap:14px}}
@media (max-width:760px){
  .bbb-panorama{--pan-slide:92%;--pan-gap:12px;--pan-radius:16px}
  .bbb-panorama-slide{aspect-ratio:4/3}
  .bbb-panorama-arrow{width:42px;height:42px;font-size:1.3rem}
  .bbb-panorama-arrow.prev{left:8px}.bbb-panorama-arrow.next{right:8px}
  .bbb-panorama-caption p{display:none}
  .bbb-panorama-kicker span:nth-child(n+3){display:none}
  .bbb-panorama-caption{padding:14px 16px;gap:5px}
  .bbb-panorama-caption h3{font-size:1.15rem}
  .bbb-panorama-kicker{font-size:.62rem}
  .bbb-panorama-cta{padding:9px 14px;font-size:.74rem}
}
@media (prefers-reduced-motion:reduce){
  .bbb-panorama-track{scroll-behavior:auto}
  .bbb-panorama-media img{transition:none}
}

/* ---- Premium galerija (lightbox projekata, zajednička za sve teme; projects.js dodaje .premium i traku sličica) ---- */
.project-lightbox.premium{padding:0!important}
.project-lightbox.premium .project-lightbox-backdrop{background:rgba(6,8,10,.9)!important;backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2)}
.project-lightbox.premium .project-lightbox-dialog{
  width:100vw!important;height:100svh!important;max-height:none!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
  display:grid!important;grid-template-rows:minmax(0,1fr) auto!important;place-items:stretch!important;padding:clamp(56px,7vh,72px) clamp(64px,9vw,120px) 14px!important;overflow:hidden
}
.project-lightbox.premium figure{display:grid!important;grid-template-rows:minmax(0,1fr) auto!important;min-height:0;margin:0!important;width:100%!important;height:100%!important;animation:bbbLbUlaz .35s cubic-bezier(.2,.7,.2,1)}
.project-lightbox.premium figure img{max-height:100%!important;max-width:100%!important;width:auto!important;height:auto!important;margin:auto!important;object-fit:contain;border-radius:12px;box-shadow:0 40px 90px -30px rgba(0,0,0,.8)}
.project-lightbox.premium figcaption{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:2px 18px!important;padding:14px 4px 0!important;color:#fff!important;width:100%!important}
.project-lightbox.premium figcaption strong{font-size:1.05rem;letter-spacing:-.01em}
.project-lightbox.premium figcaption span{grid-column:1;color:rgba(255,255,255,.66)!important;font-size:.9rem}
.project-lightbox.premium figcaption span[hidden]{display:none}
.project-lightbox.premium figcaption small{grid-column:2;grid-row:1/3;align-self:center;font-variant-numeric:tabular-nums;letter-spacing:.14em;color:rgba(255,255,255,.66)!important}
.project-lightbox.premium .project-lightbox-close,.project-lightbox.premium .project-lightbox-nav,.project-lightbox.premium .project-lightbox-prev,.project-lightbox.premium .project-lightbox-next{
  background:rgba(255,255,255,.08)!important;color:#fff!important;border:1px solid rgba(255,255,255,.18)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:none!important;transition:background .25s,transform .25s
}
.project-lightbox.premium .project-lightbox-close:hover,.project-lightbox.premium .project-lightbox-nav:hover,.project-lightbox.premium .project-lightbox-prev:hover,.project-lightbox.premium .project-lightbox-next:hover{background:var(--green,#FF7E05)!important;color:#0b0b0b!important;border-color:transparent!important}
.project-lightbox.premium .project-lightbox-close{top:16px!important;right:16px!important;width:46px!important;height:46px!important}
.project-lightbox.premium .project-lightbox-nav,.project-lightbox.premium .project-lightbox-prev,.project-lightbox.premium .project-lightbox-next{width:54px!important;height:54px!important;font-size:30px!important}
.project-lightbox.premium .project-lightbox-nav.previous,.project-lightbox.premium .project-lightbox-prev{left:18px!important}
.project-lightbox.premium .project-lightbox-nav.next,.project-lightbox.premium .project-lightbox-next{right:18px!important}
.project-lightbox-thumbs{display:flex;gap:8px;justify-content:center;overflow-x:auto;padding:12px 4px 4px;scrollbar-width:none;scroll-snap-type:x proximity}
.project-lightbox-thumbs::-webkit-scrollbar{display:none}
.project-lightbox-thumbs[hidden]{display:none}
.project-lightbox-thumbs button{flex:0 0 auto;width:72px;height:50px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;background:rgba(255,255,255,.06);cursor:pointer;opacity:.55;transition:opacity .25s,border-color .25s,transform .25s;scroll-snap-align:center}
.project-lightbox-thumbs button img{width:100%;height:100%;object-fit:cover;display:block}
.project-lightbox-thumbs button:hover{opacity:.9}
.project-lightbox-thumbs button.aktivna{opacity:1;border-color:var(--green,#FF7E05);transform:translateY(-2px)}
@keyframes bbbLbUlaz{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
@media (max-width:760px){
  .project-lightbox.premium .project-lightbox-dialog{padding:56px 10px 10px!important}
  .project-lightbox.premium .project-lightbox-nav,.project-lightbox.premium .project-lightbox-prev,.project-lightbox.premium .project-lightbox-next{width:42px!important;height:42px!important;font-size:24px!important;top:auto!important;bottom:86px;transform:none!important}
  .project-lightbox.premium .project-lightbox-nav.previous,.project-lightbox.premium .project-lightbox-prev{left:10px!important}
  .project-lightbox.premium .project-lightbox-nav.next,.project-lightbox.premium .project-lightbox-next{right:10px!important}
  .project-lightbox.premium figcaption{grid-template-columns:1fr!important}
  .project-lightbox.premium figcaption small{grid-column:1;grid-row:auto}
  .project-lightbox-thumbs button{width:58px;height:42px}
}
