/* ===========================================================
   Zetagradnja — svetli "Balkon" stil (original)
   Ucitava se posle site.css. Akcenat = brend plava.
   =========================================================== */
:root{
  --gold:#000079; --gold-d:#00005a; --gold-soft:#e3e3f1;
  --ink:#15161a; --muted:#6b7280; --line:#e7e8ee; --light:#f6f7f9; --soft:#f3f4f8;
  --bar:134px; --ease:cubic-bezier(.16,1,.3,1);
}
body{font-family:'Sora',system-ui,sans-serif;color:var(--ink);background:#fff}
h1,h2,h3,h4{font-family:'Sora',sans-serif;font-weight:600;letter-spacing:-.01em}
.section__title{font-weight:600}
.overline{display:inline-flex;align-items:center;gap:10px;color:var(--gold);font-family:'Sora',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:13px}
.overline .line{width:30px;height:2px;background:var(--gold);display:inline-block}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:'Sora',sans-serif;font-weight:500;font-size:13px;letter-spacing:.1em;text-transform:uppercase;padding:16px 32px;border:1.5px solid transparent;border-radius:2px;line-height:1;cursor:pointer;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease)}
.btn--lg{padding:18px 38px;font-size:13.5px}
.btn--sm{padding:8px 16px;font-size:11px}
.btn--gold{background:var(--gold);color:#fff;border-color:var(--gold)}
.btn--gold:hover{background:var(--gold-d);border-color:var(--gold-d);transform:translateY(-2px)}
.btn--dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn--dark:hover{background:var(--gold);border-color:var(--gold);transform:translateY(-2px)}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn--ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn--ghost-dark{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--ghost-dark:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}
/* HOVER THREE — tanak okvir; na hover 4 linije otklize na suprotnu stranu i ukrste se */
.btn--line{position:relative;background:transparent;color:var(--gold);border-color:transparent}
.btn--line .btn__t{position:relative;z-index:2}
.btn--line .ln{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:1;transition:transform .55s ease-in-out}
.btn--line .ln-t{border-top:1.5px solid currentColor}
.btn--line .ln-b{top:auto;bottom:0;border-bottom:1.5px solid currentColor}
.btn--line .ln-l{border-left:1.5px solid currentColor}
.btn--line .ln-r{left:auto;right:0;border-right:1.5px solid currentColor}
.btn--line:hover .ln-t{transform:translateY(100%)}
.btn--line:hover .ln-b{transform:translateY(-100%)}
.btn--line:hover .ln-l{transform:translateX(100%)}
.btn--line:hover .ln-r{transform:translateX(-100%)}
.btn--line.on-dark{color:#fff}
/* puno plavo dugme sa beli tekstom + svetliji plavi sweep na hover */
.btn--blue{position:relative;overflow:hidden;background:var(--gold);color:#fff;border-color:transparent}
.btn--blue .btn__t{position:relative;z-index:2}
.btn--blue::before{content:"";position:absolute;inset:0;z-index:1;background:var(--gold-d);transform:translateX(-101%);transition:transform .45s var(--ease)}
.btn--blue:hover::before{transform:translateX(0)}
.bintro__title{font-weight:100;font-size:clamp(34px,4.6vw,50px)}

/* ---------- Leva traka ---------- */
.lbar{display:none;position:fixed;left:0;top:0;bottom:0;width:var(--bar);background:#000079;z-index:60;flex-direction:column;align-items:center;justify-content:space-between;padding:28px 0}
.lbar__logo img{width:100px;height:auto;display:block}
.lbar__mid{display:flex;flex-direction:column;align-items:center;gap:16px;text-decoration:none}
.lbar__txt{writing-mode:vertical-rl;font-family:'Sora',sans-serif;font-weight:100;font-size:20px;letter-spacing:.34em;text-transform:uppercase;color:rgba(255,255,255,.78);clip-path:inset(0 0 100% 0);animation:lbarTxtIn 1.3s var(--ease) .9s forwards;transition:color .25s}
.lbar__arrow{display:block;color:rgba(255,255,255,.85);transition:transform .35s var(--ease),color .25s}
.lbar__arrow svg{width:19px;height:auto;display:block}
.lbar__arrow svg path{stroke-dasharray:60;stroke-dashoffset:60;animation:lbarDraw 2.8s var(--ease) .2s forwards}
.lbar__mid:hover .lbar__txt,.lbar__mid:hover .lbar__arrow{color:#fff}
.lbar__mid:hover .lbar__arrow{transform:translateY(6px)}
@keyframes lbarTxtIn{to{clip-path:inset(0 0 0 0)}}
@media(prefers-reduced-motion:reduce){.lbar__txt{clip-path:none;animation:none}.lbar__arrow svg path,.lbar__social svg *{stroke-dashoffset:0;animation:none}}
.lbar__social{display:flex;flex-direction:column;gap:10px}
.lbar__social a{width:38px;height:38px;border:0;border-radius:0;display:grid;place-items:center;background:#fff;color:#000079;transition:.25s var(--ease);text-decoration:none}
.lbar__social a:hover{background:#000079;color:#fff;box-shadow:0 0 0 1.5px rgba(255,255,255,.6)}
.lbar__social a svg{width:20px;height:20px;display:block}
.lbar__social svg rect,.lbar__social svg circle,.lbar__social svg path{stroke-dasharray:110;stroke-dashoffset:110;animation:lbarDraw 2.8s var(--ease) forwards}
.lbar__social a:nth-child(2) svg *{animation-delay:.4s}
@keyframes lbarDraw{to{stroke-dashoffset:0}}
@media(min-width:1000px){ body{padding-left:var(--bar)} .lbar{display:flex} }

/* ---------- Gornji header ---------- */
.thead{position:fixed;top:0;left:var(--bar);right:0;z-index:55;transition:background .3s var(--ease),box-shadow .3s var(--ease)}
.thead__inner{display:flex;align-items:center;justify-content:space-between;height:84px;padding:0 44px}
.thead__logo{display:none}
.thead__logo img{height:60px;width:auto}
.thead.scrolled{background:#fff;box-shadow:0 6px 26px rgba(20,22,30,.08)}
body.is-inner .thead{background:#fff;box-shadow:0 4px 20px rgba(20,22,30,.06)}
body.is-home .thead:not(.scrolled) .tnav__link,body.is-project .thead:not(.scrolled) .tnav__link{color:#fff}
.thead.scrolled .thead__logo img,body.is-inner .thead__logo img{filter:brightness(0)}
body.is-home .thead:not(.scrolled) .tburger:not(.open) span,body.is-project .thead:not(.scrolled) .tburger:not(.open) span{background:#fff}
.tnav{display:flex;align-items:center;gap:4px;margin-left:auto}
.tnav__link{font-family:'Sora',sans-serif;font-weight:200;font-size:14px;text-transform:uppercase;letter-spacing:.13em;color:var(--ink);padding:10px 16px;position:relative;transition:color .2s}
.tnav__link:hover,.tnav__link.active{color:var(--gold)}
.tnav__link::after{content:"";position:absolute;left:50%;bottom:6px;width:50%;height:1px;background:currentColor;transform:translateX(-50%) scaleX(0);transform-origin:center;transition:transform .4s var(--ease)}
.tnav__link.active::after{transform:translateX(-50%) scaleX(1)}
.tnav__link:hover::after{transform:translateX(-50%) scaleX(1)}
.tnav__cta{margin-left:14px}
.tburger{display:none;flex-direction:column;gap:6px;background:none;border:0;padding:6px;cursor:pointer}
.tburger span{width:26px;height:2px;background:var(--ink);transition:.3s var(--ease)}
.thead__social{display:none}   /* vidljivo tek kad nestane leva traka (<1000px) */
body.is-inner .page{padding-top:84px}

/* ---------- HERO: particle + slajder ---------- */
.bhero{position:relative;height:100vh;height:100svh;min-height:600px;overflow:hidden;background:#0e131c}
.bhero::before{content:"";position:absolute;top:0;left:0;right:0;height:170px;background:linear-gradient(180deg,rgba(8,11,17,.66) 0%,rgba(8,11,17,.14) 60%,transparent 100%);z-index:4;pointer-events:none}
.bhero-swiper{width:100%;height:100%;overflow:hidden}
.bhero-slide{position:relative;height:100%;overflow:hidden}
.bhero-slide img{width:100%;height:100%;object-fit:cover;object-position:center center;display:block;opacity:0;transition:opacity .7s var(--ease)}
.bhero-slide img.is-loaded{opacity:1}
.bhero-slide::after{content:"";position:absolute;left:0;right:0;bottom:0;height:55%;background:linear-gradient(to top,rgba(8,11,17,.94) 0%,rgba(8,11,17,.6) 36%,rgba(8,11,17,.2) 68%,transparent 100%);z-index:1;pointer-events:none}
.bhero-slide__cap{position:absolute;left:0;right:0;bottom:0;padding:40px 32px 32px;color:#fff;z-index:2;opacity:.4;transition:opacity .8s var(--ease)}
.bhero-swiper .swiper-slide-active .bhero-slide__cap,.bhero-swiper .swiper-slide-next .bhero-slide__cap{opacity:.96}
.bhero-swiper .swiper-slide-active:hover .bhero-slide__cap,.bhero-swiper .swiper-slide-next:hover .bhero-slide__cap{opacity:1}
.bhero-slide__ov{display:block;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.82);margin-bottom:8px;font-weight:500}
.bhero-slide__title{font-size:clamp(26px,3.2vw,44px);font-weight:200;color:#fff;letter-spacing:-.01em;line-height:1.12}
.bhero-slide__sub{margin-top:9px;color:rgba(255,255,255,.78);font-size:14.5px;line-height:1.5;max-width:34ch}
.bhero-slide__btn{margin-top:18px}
.bhero-nav{position:absolute;right:24px;top:50%;transform:translateY(-50%);z-index:6;display:flex;flex-direction:column;align-items:center;gap:8px}
.bhero-arrow{width:54px;height:54px;border-radius:50%;border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.09);color:#fff;display:grid;place-items:center;cursor:pointer;transition:.25s var(--ease);backdrop-filter:blur(3px)}
.bhero-arrow:hover{background:#fff;border-color:#fff;color:var(--ink)}
.bhero-arrow svg{width:22px;height:22px}
.bhero-nav__sep{width:26px;height:1px;background:rgba(255,255,255,.3)}
.bhero__slides{position:absolute;inset:0;z-index:1;display:flex;align-items:center}
.hslide{position:absolute;inset:0;display:flex;align-items:center;background:var(--img,#0e131c) center/cover no-repeat;opacity:0;visibility:hidden;transition:opacity 1s var(--ease)}
.hslide.is-active{opacity:1;visibility:visible}
.hslide__veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,11,17,.82) 0%,rgba(8,11,17,.5) 52%,rgba(8,11,17,.22) 100%)}
.bhero__inner{position:relative;z-index:2;max-width:780px}
.bhero__ov{display:inline-flex;align-items:center;gap:12px;color:rgba(255,255,255,.92);font-family:'Sora',sans-serif;font-weight:500;letter-spacing:.18em;font-size:13px;text-transform:uppercase;margin-bottom:22px}
.bhero__ov .ln{width:42px;height:2px;background:rgba(255,255,255,.7)}
.bhero__title{font-family:'Sora',sans-serif;font-size:clamp(42px,6vw,86px);font-weight:600;line-height:1.02;letter-spacing:-.02em;margin-bottom:22px;color:#fff}
.bhero__text{font-size:clamp(16px,1.6vw,20px);color:#e6e8ee;max-width:54ch;line-height:1.6;margin-bottom:34px}
.bhero__actions{display:flex;gap:14px;flex-wrap:wrap}
.hslide .bhero__ov,.hslide .bhero__title,.hslide .bhero__text,.hslide .bhero__actions{opacity:0;transform:translateY(28px)}
.hslide.is-active .bhero__ov{animation:bIn .7s .2s var(--ease) forwards}
.hslide.is-active .bhero__title{animation:bIn .8s .35s var(--ease) forwards}
.hslide.is-active .bhero__text{animation:bIn .8s .5s var(--ease) forwards}
.hslide.is-active .bhero__actions{animation:bIn .8s .65s var(--ease) forwards}
@keyframes bIn{to{opacity:1;transform:none}}
.hslider-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:54px;height:54px;border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.08);color:#fff;font-size:26px;border-radius:50%;cursor:pointer;display:grid;place-items:center;transition:.25s var(--ease);backdrop-filter:blur(2px)}
.hslider-arrow:hover{background:#fff;border-color:#fff;color:var(--ink)}
.hslider-arrow--prev{left:30px}
.hslider-arrow--next{right:30px}
.hslider-dots{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);z-index:5;display:flex;gap:10px}
.hslider-dots button{width:11px;height:11px;border-radius:50%;border:2px solid rgba(255,255,255,.6);background:transparent;cursor:pointer;padding:0;transition:.3s var(--ease)}
.hslider-dots button.is-active{background:#fff;border-color:#fff;width:30px;border-radius:6px}

/* ---------- 3 izdvojena projekta ---------- */
.bfeat{position:relative;overflow:hidden;background:linear-gradient(165deg,#f4f5f9 0%,#e6e8f1 100%)}
.bfeat__particles{position:absolute;inset:0;z-index:0;width:100%;height:100%}
.bfeat>.container{position:relative;z-index:1}
.bfeat__head{text-align:center;max-width:640px;margin:0 auto 46px}
.bfeat__title{font-size:clamp(30px,4vw,46px);color:var(--ink);font-weight:100;letter-spacing:-.02em;margin-top:8px}
.bfeat__all{text-align:center;margin-top:48px}
.bfeat__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:10px}
.bfeat__card{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:2px;background:#0e131c;isolation:isolate}
.bfeat__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 1.2s var(--ease)}
.bfeat__card:hover .bfeat__img{transform:scale(1.09)}
/* kompletna slika lagano zatamnjena (~0.2), malo jace pri dnu zbog naziva */
.bfeat__veil{position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.4) 0%,rgba(0,0,0,.12) 42%,rgba(0,0,0,.12) 100%)}
/* na hover cela slika potamni jos malo (citljiviji status) */
.bfeat__card::before{content:"";position:absolute;inset:0;z-index:2;background:rgba(0,0,0,.22);opacity:0;transition:opacity .5s var(--ease);pointer-events:none}
.bfeat__card:hover::before{opacity:1}
/* ramka: 4 linije krenu iz centra i razlete se do ivica (kao kod dugmeta) */
.bfeat__frame{position:absolute;inset:14px;z-index:3;pointer-events:none}
.bfeat__frame .ln{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;transition:transform .55s var(--ease),opacity .4s var(--ease)}
.bfeat__frame .ln-t{border-top:1px solid rgba(255,255,255,.72);transform:translateY(50%)}
.bfeat__frame .ln-b{border-bottom:1px solid rgba(255,255,255,.72);transform:translateY(-50%)}
.bfeat__frame .ln-l{border-left:1px solid rgba(255,255,255,.72);transform:translateX(50%)}
.bfeat__frame .ln-r{border-right:1px solid rgba(255,255,255,.72);transform:translateX(-50%)}
.bfeat__card:hover .bfeat__frame .ln{opacity:1;transform:translate(0,0)}
/* gornji red: status levo, "saznajte vise" desno (na hover) */
.bfeat__top{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:24px 26px 0}
.bfeat__tag{background:rgba(8,10,18,.45);color:#fff;font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;padding:6px 12px;border:1px solid rgba(255,255,255,.28);border-radius:2px;font-family:'Sora',sans-serif}
.bfeat__more{display:inline-flex;align-items:center;gap:6px;margin-right:4px;font-size:11px;font-weight:600;letter-spacing:.03em;color:#fff;font-family:'Sora',sans-serif;opacity:0;transform:translateY(-6px);transition:opacity .4s var(--ease),transform .4s var(--ease)}
.bfeat__more .ar{transition:transform .4s var(--ease)}
.bfeat__card:hover .bfeat__more{opacity:1;transform:translateY(0)}
.bfeat__card:hover .bfeat__more .ar{transform:translateX(5px)}
/* naziv + lokacija skroz dole */
.bfeat__cap{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:0 26px 22px;color:#fff}
.bfeat__loc{display:inline-flex;align-items:center;gap:7px;font-size:13px;letter-spacing:.03em;color:rgba(255,255,255,.85);font-family:'Sora',sans-serif;margin-bottom:8px}
.bfeat__loc svg{width:14px;height:14px;flex:none;opacity:.85}
.bfeat__name{font-size:clamp(20px,1.9vw,26px);font-weight:500;line-height:1.16;color:#fff;margin:0}

/* „Pogledajte još projekata" — carousel na stranici projekta (kartice = .bfeat stil) */
.bmore{position:relative;background:linear-gradient(165deg,#f4f5f9 0%,#e6e8f1 100%)}
.bmore__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:34px}
.bmore__title{font-size:clamp(26px,3.2vw,40px);color:var(--ink);font-weight:100;letter-spacing:-.02em;margin-top:8px}
.bmore-swiper{overflow:hidden}
.bmore-swiper .swiper-slide{height:auto}
.bmore-nav{display:flex;gap:10px;flex:none}
.bmore-prev,.bmore-next{width:46px;height:46px;display:grid;place-items:center;border:1px solid rgba(0,0,121,.22);background:transparent;color:var(--gold);border-radius:2px;cursor:pointer;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}
.bmore-prev:hover,.bmore-next:hover{background:var(--gold);color:#fff;border-color:var(--gold)}
.bmore-prev svg,.bmore-next svg{width:20px;height:20px}
.bmore-prev.swiper-button-disabled,.bmore-next.swiper-button-disabled{opacity:.28;cursor:default;pointer-events:none}
/* uže kartice u carousel-u -> sve malo manje, shodno širini slike */
.bmore .bfeat__top{padding:16px 18px 0}
.bmore .bfeat__tag{font-size:9.5px;padding:4px 9px;letter-spacing:.07em}
.bmore .bfeat__more{font-size:10px}
.bmore .bfeat__cap{padding:0 18px 16px}
.bmore .bfeat__loc{font-size:11.5px;margin-bottom:5px}
.bmore .bfeat__loc svg{width:12px;height:12px}
.bmore .bfeat__name{font-size:clamp(15px,1.25vw,18px);font-weight:500}
.bmore .bfeat__frame{inset:11px}
/* prepolovljen vertikalni razmak galerija -> carousel (bilo 90+90=180px) */
.prj-gallery.section{padding-bottom:45px}
.bmore.section{padding-top:45px}

/* ---------- O nama ---------- */
.section--soft{background:var(--soft)}
.babout{align-items:center}
.babout__media{position:relative;margin:0;border-radius:2px;overflow:hidden;box-shadow:0 28px 64px rgba(20,22,30,.13);aspect-ratio:4/5}
.babout__media img{width:100%;height:100%;object-fit:cover;will-change:transform}
.babout__frame{position:absolute;inset:16px;z-index:2;pointer-events:none}
.babout__frame svg{width:100%;height:100%;display:block}
.babout__frame path{fill:none;stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linecap:round}
.babout__badge{position:absolute;left:45px;top:45px;display:flex;align-items:center;gap:12px;min-width:218px;background:var(--gold);color:#fff;padding:19px 26px;border-radius:2px;opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.babout__badge.show{opacity:1;transform:none}
.babout__badge b{font-family:'Sora',sans-serif;font-size:52px;font-weight:600;line-height:1;min-width:1.05em;text-align:center;font-variant-numeric:tabular-nums}
.babout__badge span:not(.badge-count){display:flex;flex-direction:column;font-weight:600;font-size:17px;line-height:1.15}
.babout__badge small{font-weight:400;opacity:.85;font-size:15px}
.babout__body .checklist{margin:22px 0 26px}
.babout__body .checklist li{color:#3a3c43;font-weight:500;padding:7px 0}

/* ---------- Politika poslovanja (tamni segment) ---------- */
.bpolicy{background:#0f1218;color:#fff;padding:112px 0;position:relative;overflow:hidden}
.bpolicy__bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bpolicy__bg::before{content:"";position:absolute;inset:0;background:url('/assets/img/policy-pattern.svg') center/cover no-repeat;opacity:.05;-webkit-mask-image:radial-gradient(140% 110% at 50% 40%,#000,transparent 84%);mask-image:radial-gradient(140% 110% at 50% 40%,#000,transparent 84%)}
.bpolicy__skyline{display:none}
.bpolicy>.container{position:relative;z-index:1}
.bpolicy__head{text-align:center;max-width:640px;margin:0 auto}
.bpolicy .overline{color:#fff}
.bpolicy .overline .line{background:rgba(255,255,255,.55)}
.bpolicy__title{font-size:clamp(30px,4vw,46px);color:#fff;font-weight:100;letter-spacing:-.02em;margin-top:8px}
.bpolicy__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;margin-top:66px}
.bpolicy__item{position:relative;padding-top:18px;border-top:1px solid rgba(255,255,255,.13)}
.bpolicy__n{position:absolute;top:18px;right:0;font-family:'Sora',sans-serif;font-size:13px;font-weight:600;color:rgba(255,255,255,.3);letter-spacing:.1em}
.bpolicy__icon{display:block;color:#fff;margin:22px 0 26px}
.bpolicy__icon svg{width:62px;height:62px;display:block;stroke-width:.9}
.bpolicy__icon svg path,.bpolicy__icon svg circle,.bpolicy__icon svg line{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.7s var(--ease)}
.bpolicy__item.in .bpolicy__icon svg path,.bpolicy__item.in .bpolicy__icon svg circle,.bpolicy__item.in .bpolicy__icon svg line{stroke-dashoffset:0;transition-delay:calc(var(--i,0)*0.25s + 0.35s)}
.bpolicy__item h3{font-size:21px;color:#fff;margin-bottom:11px;font-weight:600;letter-spacing:-.01em}
.bpolicy__item p{color:#9aa1ad;font-size:15px;line-height:1.65}
@media(max-width:980px){.bpolicy__grid{grid-template-columns:1fr 1fr;gap:40px 30px}}
@media(max-width:560px){.bpolicy__grid{grid-template-columns:1fr;gap:34px}}

/* ---------- Statistika (plava traka) ---------- */
.bstats{background:#0f1218;color:#fff;padding:104px 0;position:relative;overflow:hidden}
.bstats__bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bstats__bg::before{content:"";position:absolute;inset:0;background:url('/assets/img/policy-pattern.svg') center/cover no-repeat;opacity:.05;-webkit-mask-image:radial-gradient(140% 110% at 50% 40%,#000,transparent 84%);mask-image:radial-gradient(140% 110% at 50% 40%,#000,transparent 84%)}
.bstats>.container{position:relative;z-index:1}
.bstats .overline{color:#fff}
.bstats .overline .line{background:rgba(255,255,255,.55)}
.bstats__head{text-align:center;max-width:680px;margin:0 auto 58px}
.bstats__title{font-size:clamp(28px,3.6vw,42px);color:#fff;font-weight:100;letter-spacing:-.02em;margin-top:8px}
.bstats__lead{color:rgba(255,255,255,.6);font-size:16px;line-height:1.7;margin-top:18px}
.bstats__grid{display:grid;grid-template-columns:repeat(4,1fr);text-align:center}
.bstat{position:relative;padding:10px 22px}
.bstat+.bstat::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:64px;background:rgba(255,255,255,.13)}
.bstat b{font-family:'Sora',sans-serif;font-size:27.5px;font-weight:200;color:#fff;display:block;line-height:1;letter-spacing:-.02em}
.bstat>span{color:rgba(255,255,255,.58);font-size:13.5px;letter-spacing:.04em;margin-top:13px;display:block}

/* ---------- Usluge ---------- */
.bserv{background:var(--soft)}
.bserv__head{text-align:center;max-width:640px;margin:0 auto 52px}
.bserv__title{font-size:clamp(30px,4vw,46px);color:var(--ink);font-weight:100;letter-spacing:-.02em;margin-top:8px}
.bserv__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.bserv__card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:2px;padding:34px 32px 38px;min-height:236px;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s var(--ease)}
.bserv__card:hover{transform:translateY(-6px);box-shadow:0 24px 52px rgba(0,0,121,.1)}
.bserv__bgn{position:absolute;right:18px;bottom:-12px;z-index:0;font-family:'Sora',sans-serif;font-weight:700;font-size:120px;line-height:1;letter-spacing:-.04em;color:var(--gold);opacity:.05;pointer-events:none}
.bserv__frame{position:absolute;inset:0;z-index:2;pointer-events:none}
.bserv__frame .ln{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;transition:transform .85s var(--ease),opacity .55s var(--ease)}
.bserv__frame .ln-t{border-top:1px solid var(--gold);transform:translateY(50%)}
.bserv__frame .ln-b{border-bottom:1px solid var(--gold);transform:translateY(-50%)}
.bserv__frame .ln-l{border-left:1px solid var(--gold);transform:translateX(50%)}
.bserv__frame .ln-r{border-right:1px solid var(--gold);transform:translateX(-50%)}
.bserv__card:hover .bserv__frame .ln{opacity:1;transform:translate(0,0)}
.bserv__ico{position:relative;z-index:1;display:block;color:var(--gold);margin-bottom:18px}
.bserv__ico svg{width:42px;height:42px;display:block;stroke-width:1.3}
.bserv__ico svg path,.bserv__ico svg circle,.bserv__ico svg rect{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.5s var(--ease)}
.bserv__card.in .bserv__ico svg path,.bserv__card.in .bserv__ico svg circle,.bserv__card.in .bserv__ico svg rect{stroke-dashoffset:0;transition-delay:calc(var(--i,0)*0.18s + 0.3s)}
.bserv__t{position:relative;z-index:1;font-size:21px;font-weight:500;margin:0 0 10px;letter-spacing:-.01em;color:var(--ink)}
.bserv__card p{position:relative;z-index:1;color:var(--muted);font-size:14px;line-height:1.4;max-width:31ch}

/* ---------- CTA ---------- */
.bcta{position:relative;overflow:hidden;background:#15161a var(--img) center/cover no-repeat}
.bcta__veil{position:absolute;inset:0;background:linear-gradient(120deg,rgba(0,0,121,.93),rgba(20,22,30,.85))}
.bcta__particles{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:none}
.bcta__inner{position:relative;z-index:2;padding:86px 0;display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.bcta__text{max-width:600px}
.bcta__title{color:#fff;font-weight:100;font-size:clamp(30px,3.6vw,46px);letter-spacing:-.02em;line-height:1.12}
.bcta__sub{color:rgba(255,255,255,.74);font-size:16.5px;line-height:1.7;margin-top:16px;max-width:52ch}
/* CTA centriran i u koloni i na tabletima (npr. Surface Pro 7 = 912px), ne samo na telefonu */
@media(max-width:999px){.bcta .bcta__inner{flex-direction:column;align-items:center;text-align:center}}
@media(min-width:881px) and (max-width:999px){.bcta .bcta__inner{padding:80px 30px}}

/* ---------- Footer ---------- */
.bfoot{position:relative;overflow:hidden;background:#0f1218;color:#a8abb5;padding:90px 0 30px}
.bfoot__bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bfoot__bg::before{content:"";position:absolute;inset:0;background:url('/assets/img/policy-pattern.svg') center/cover no-repeat;opacity:.05;-webkit-mask-image:radial-gradient(150% 130% at 50% 0,#000,transparent 78%);mask-image:radial-gradient(150% 130% at 50% 0,#000,transparent 78%)}
.bfoot>.container{position:relative;z-index:1}
.bfoot__inner{display:grid;grid-template-columns:1.6fr 1fr 1.4fr;gap:50px;padding-bottom:50px;border-bottom:1px solid rgba(255,255,255,.09)}
.bfoot__logo{width:150px;height:auto;display:block;margin-bottom:22px}
.bfoot__tagline{color:#9a9da6;max-width:40ch;line-height:1.75;font-size:15px}
.bfoot__col h4{color:#fff;font-family:'Sora',sans-serif;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;margin-bottom:22px}
.bfoot__nav li{margin-bottom:13px}
.bfoot__nav a{color:#bfc2ca;font-size:15px;position:relative;transition:color .25s,padding-left .25s}
.bfoot__nav a:hover{color:#fff;padding-left:7px}
.bfoot__contact{display:flex;flex-direction:column;gap:17px}
.bfoot__contact li{display:flex;align-items:flex-start;gap:13px}
.bfoot__contact svg{width:18px;height:18px;flex:none;color:#c4c7cf;margin-top:1px}
.bfoot__contact a,.bfoot__contact span{color:#c4c7cf;font-size:15px;line-height:1.5;transition:color .25s}
.bfoot__contact a:hover{color:#fff}
.bfoot__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:26px;font-size:13px;color:#7e818b}
.bfoot__by{color:#c4c7cf}
.bfoot__by a{color:inherit;transition:color .2s}
.bfoot__by a:hover{color:#fff}
/* floating "na vrh" dugme */
.totop{position:fixed;right:24px;bottom:24px;z-index:70;width:46px;height:46px;display:grid;place-items:center;background:var(--gold);color:#fff;border:0;border-radius:2px;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .35s var(--ease),transform .35s var(--ease),background .25s var(--ease);box-shadow:0 12px 30px rgba(0,0,121,.3)}
.totop.show{opacity:1;visibility:visible;transform:none}
.totop:hover{background:var(--gold-d)}
.totop svg{width:22px;height:22px}
@media(max-width:560px){.totop{right:16px;bottom:16px;width:42px;height:42px}}

/* ---------- Reveal ---------- */
.reveal-up,.reveal-left{opacity:0;transition:opacity 1.1s var(--ease),transform 1.1s var(--ease);transition-delay:calc(var(--i,0)*130ms)}
.reveal-up{transform:translateY(34px)}
.reveal-left{transform:translateX(-42px)}
.reveal-up.in,.reveal-left.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal-up,.reveal-left{opacity:1;transform:none}}

/* ===== STRANICA PROJEKTA ===== */
body.is-inner .page{padding-top:84px}
/* naslovna traka projekta — tamni pattern (sa početne) ili slika; header transparentan preko nje */
.prj-head{position:relative;overflow:hidden;background:#0f1218;color:#fff;padding:150px 0 72px}
.prj-head__bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.prj-head__bg::before{content:"";position:absolute;inset:0;background:url('/assets/img/policy-pattern.svg') center/cover no-repeat;opacity:.05;-webkit-mask-image:radial-gradient(140% 130% at 50% 30%,#000,transparent 82%);mask-image:radial-gradient(140% 130% at 50% 30%,#000,transparent 82%)}
.prj-head--img{background:#0e131c var(--himg) center/cover no-repeat}
.prj-head--img .prj-head__bg{background:linear-gradient(to top,rgba(8,10,18,.86),rgba(8,10,18,.5))}
.prj-head--img .prj-head__bg::before{display:none}
.prj-head>.container{position:relative;z-index:1}
.prj-crumb{font-size:13px;color:rgba(255,255,255,.6);margin-bottom:22px;letter-spacing:.02em}
.prj-crumb a{color:rgba(255,255,255,.72);transition:color .2s}
.prj-crumb a:hover{color:#fff}
.prj-crumb span{margin:0 9px;opacity:.45}
.prj-crumb em{font-style:normal;color:#fff}
.prj-head .overline{color:#fff}
.prj-head .overline .line{background:rgba(255,255,255,.6)}
.prj-head__title{font-size:clamp(32px,5vw,58px);font-weight:100;letter-spacing:-.02em;line-height:1.06;margin:12px 0 14px;color:#fff}
.prj-head__loc{display:inline-flex;align-items:center;gap:8px;font-size:15px;color:rgba(255,255,255,.85)}
.prj-head__loc svg{width:17px;height:17px;flex:none}
/* izdvojena slika sa status bedžom */
.prj-feature{position:relative;margin:0 0 32px;aspect-ratio:16/9;overflow:hidden;border-radius:2px;background:#0e131c}
.prj-feature__img{width:100%;height:100%;object-fit:cover;display:block}
.prj-feature__tag{position:absolute;top:20px;left:20px;z-index:2;background:rgba(8,10,18,.5);color:#fff;font-size:12px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;padding:8px 15px;border:1px solid rgba(255,255,255,.32);font-family:'Sora',sans-serif}
.prj-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:56px;align-items:start}
.prj-desc>.overline{margin-bottom:16px}
.prj-lead{font-size:clamp(18px,1.7vw,22px);font-weight:300;line-height:1.5;color:var(--ink);margin-bottom:22px}
.prj-text{color:var(--muted);font-size:14px;line-height:1.4}
.prj-text p{margin-bottom:15px}.prj-text p:last-child{margin-bottom:0}
.prj-info{position:sticky;top:106px;background:var(--soft);border:1px solid var(--line);border-radius:2px;padding:26px 26px 28px;overflow:hidden}
.prj-info__title{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;font-family:'Sora',sans-serif}
.prj-info__list{display:flex;flex-direction:column}
.prj-info__list li{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.prj-info__list li:first-child{border-top:0}
.prj-info__ic{flex:none;width:40px;height:40px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);border-radius:2px;color:var(--gold)}
.prj-info__ic svg{width:19px;height:19px}
.prj-info__txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.prj-info__k{color:var(--muted);font-size:11.5px;letter-spacing:.07em;text-transform:uppercase}
.prj-info__v{color:var(--ink);font-size:15px;font-weight:600;line-height:1.25}
.prj-info__actions{display:flex;flex-direction:column;gap:10px;margin-top:22px}
.prj-info .btn{width:100%;justify-content:center}
.prj-gallery{background:var(--soft)}
.prj-gallery__head{margin-bottom:30px}
.prj-gallery__title{font-size:clamp(26px,3.4vw,40px);color:var(--ink);font-weight:100;letter-spacing:-.02em;margin-top:8px}
.prj-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.prj-gal__item{position:relative;overflow:hidden;border-radius:2px;aspect-ratio:4/3;background:#0e131c;cursor:pointer}
.prj-gal__item img{width:100%;height:100%;object-fit:cover;transition:transform .65s var(--ease)}
.prj-gal__item:hover img{transform:scale(1.07)}
.prj-gal__item::after{content:"";position:absolute;inset:0;background:rgba(0,0,121,0);transition:background .35s var(--ease)}
.prj-gal__item:hover::after{background:rgba(0,0,121,.14)}
.prj-gal__frame{position:absolute;inset:12px;z-index:2;pointer-events:none}
.prj-gal__frame .ln{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;transition:transform .55s var(--ease),opacity .4s var(--ease)}
.prj-gal__frame .ln-t{border-top:1px solid rgba(255,255,255,.85);transform:translateY(50%)}
.prj-gal__frame .ln-b{border-bottom:1px solid rgba(255,255,255,.85);transform:translateY(-50%)}
.prj-gal__frame .ln-l{border-left:1px solid rgba(255,255,255,.85);transform:translateX(50%)}
.prj-gal__frame .ln-r{border-right:1px solid rgba(255,255,255,.85);transform:translateX(-50%)}
.prj-gal__item:hover .prj-gal__frame .ln{opacity:1;transform:translate(0,0)}
/* lightbox — listanje slika */
.lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;font-size:30px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:.2s;z-index:2}
.lightbox__nav:hover{background:#fff;color:#15161a;border-color:#fff}
.lightbox__prev{left:24px}
.lightbox__next{right:24px}
.lightbox__count{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.72);font-size:14px;letter-spacing:.05em;font-variant-numeric:tabular-nums;z-index:2}

/* ---------- Responsive ---------- */
@media(max-width:999px){
  body{padding-left:0}
  .lbar{display:none}
  .thead{left:0}
  .thead__logo{display:block}
  .tnav{position:fixed;inset:0 0 0 auto;width:min(86vw,360px);flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;background:#fff;padding:92px 28px;transform:translateX(100%);transition:transform .4s var(--ease);box-shadow:-12px 0 44px rgba(0,0,0,.12);z-index:54}
  .tnav.open{transform:none}
  .tnav__link{font-size:24px;padding:8px 0;color:var(--ink)}
  body.is-home .thead:not(.scrolled) .tnav__link,body.is-project .thead:not(.scrolled) .tnav__link{color:var(--ink)}
  .tnav__cta{margin:16px 0 0}
  .tburger{display:flex;z-index:60;margin-left:auto}
  /* FB/IG u headeru — IZA hamburgera (desno od njega), zamena za levu traku ispod 1000px */
  .thead__social{display:flex;align-items:center;gap:0;margin-left:12px}
  .thead__social a{width:36px;height:36px;display:grid;place-items:center;color:var(--ink);border-radius:2px;transition:color .25s var(--ease),background .25s var(--ease),opacity .25s var(--ease)}
  .thead__social a svg{width:20px;height:20px;display:block}
  .thead__social a:hover{color:var(--gold);background:rgba(0,0,121,.07)}
  body.is-home .thead:not(.scrolled) .thead__social a,
  body.is-project .thead:not(.scrolled) .thead__social a{color:#fff}
  body.is-home .thead:not(.scrolled) .thead__social a:hover,
  body.is-project .thead:not(.scrolled) .thead__social a:hover{background:rgba(255,255,255,.14)}
  .tnav.open ~ .thead__social{opacity:0;pointer-events:none}
  .tburger.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .tburger.open span:nth-child(2){opacity:0}
  .tburger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
}
@media(max-width:880px){
  .bfeat__grid{grid-template-columns:1fr}
  .bserv__grid{grid-template-columns:repeat(2,1fr)}
  .bstats__grid{grid-template-columns:repeat(2,1fr);gap:44px 24px}
  .bstat+.bstat::before{display:none}
  .bfoot__inner{grid-template-columns:1fr 1fr}
  .bfoot__brand{grid-column:1/-1}
  .hslider-arrow{display:none}
  .bcta__inner{flex-direction:column;align-items:center;text-align:center}
  .thead__inner{padding:0 22px;height:74px}
  body.is-inner .page{padding-top:74px}
  .bpolicy{padding:80px 0}
  .bstats{padding:76px 0}
  .bcta__inner{padding:64px 24px}
  .bfoot{padding:64px 0 28px}
  .bpolicy__head,.bstats__head{margin-bottom:40px}
  .bserv__head,.bfeat__head{margin-bottom:36px}
  .prj-grid{grid-template-columns:1fr;gap:36px}
  .prj-info{position:static}
  .prj-gal{grid-template-columns:repeat(2,1fr)}
  .prj-head{padding:120px 0 54px}
}
@media(max-width:680px){
  .babout__media{aspect-ratio:16/11}
  .bstats__title,.bpolicy__title,.bserv__title,.bfeat__title{font-size:clamp(26px,7vw,34px)}
}
@media(max-width:560px){
  .bfoot__inner{grid-template-columns:1fr;gap:32px}
  .bstats__grid{grid-template-columns:1fr 1fr;gap:34px 18px}
  .bserv__grid{grid-template-columns:1fr}
  .bpolicy{padding:60px 0}
  .bstats{padding:58px 0}
  .bcta__inner{padding:52px 22px}
  .bfoot{padding:52px 0 24px}
  .bhero-nav{right:14px}
  .bhero-arrow{width:46px;height:46px}
  .bhero-arrow svg{width:18px;height:18px}
  .prj-head{padding:100px 0 44px}
  .prj-grid{gap:28px}
  .prj-gal{gap:10px}
  .prj-info__list li{padding:12px 0}
  /* „godina iskustva" badž — manji i proporcionalan slici na telefonu */
  .babout__badge{left:38px;top:33px;min-width:0;padding:12px 16px;gap:9px}
  .babout__badge b{font-size:36px}
  .babout__badge span:not(.badge-count){font-size:13px}
  .babout__badge small{font-size:11.5px}
  /* manji font + zbijeniji redovi na telefonu */
  .bintro__title{font-size:clamp(25px,6.6vw,32px);line-height:1.16}
  .lead-text p{font-size:15px;line-height:1.55;margin-bottom:12px}
  .babout__body .checklist li{font-size:14.5px;padding:5px 0}
}
@media(max-width:400px){
  .container{padding:0 18px}
  .bcta .bcta__inner{padding:48px 20px}   /* fix: .container je gazio vertikalni padding CTA na ≤400px */
  .bhero-slide__cap{padding:30px 20px 24px}
  .babout__badge{left:34px;top:29px;min-width:0;padding:11px 14px;gap:8px}
  .babout__badge b{font-size:32px}
  .babout__badge span:not(.badge-count){font-size:12px}
  .babout__badge small{font-size:11px}
  .bserv__card{padding:30px 26px 32px;min-height:0}
  .bfeat__cap{padding:0 22px 20px}
}
/* ——— Profi mobilni footer: jedna kolona, sve centrirano ——— */
@media(max-width:560px){
  .bfoot{padding:56px 0 26px;text-align:center}
  .bfoot__inner{grid-template-columns:1fr;gap:40px;justify-items:center;padding-bottom:38px}
  /* brend */
  .bfoot__brand{display:flex;flex-direction:column;align-items:center}
  .bfoot__logo{margin:0 auto 16px}
  .bfoot__tagline{max-width:36ch;margin:0 auto;font-size:14px}
  /* kolone */
  .bfoot__col{width:100%}
  .bfoot__col h4{margin-bottom:18px}
  /* navigacija — centriran horizontalni red */
  .bfoot__nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px}
  .bfoot__nav li{margin-bottom:0}
  .bfoot__nav a:hover{padding-left:0}
  /* kontakt — ikonica na vrhu, vrednost ispod, centrirano */
  .bfoot__contact{align-items:center;gap:24px}
  .bfoot__contact li{flex-direction:column;align-items:center;gap:8px;text-align:center}
  .bfoot__contact svg{margin-top:0;width:22px;height:22px}
  /* dno */
  .bfoot__bottom{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px}
}
/* veći logo u headeru na TABLETU (561–999px); telefon (≤560) ostaje nepromijenjen */
@media(min-width:561px) and (max-width:999px){
  .thead__inner{height:90px}
  .thead__logo img{height:78px}
  body.is-inner .page{padding-top:90px}
}
@media(min-width:1700px){:root{--container:1340px}}
