/* Hazard Defense Group — project dossiers. Local Suisse Intl, brand standard V1.0. */
:root{--navy:#0D2A4B;--navy-duboka:#071829;--navy-zig:#0A2442;--narandzasta:#F15A29;--tekst:#5A6675;--linija:#D5DAE0;--siva-znaka:#E8EBEE;--podloga-siva:#F4F6F8;--bijela:#fff;--na-navy:#C5CFDA;--greska:#B3311A;--font:"Suisse Intl",Arial,sans-serif;--bocno:clamp(20px,4.45vw,64px);--sekcija:clamp(64px,7.5vw,108px);--zaglavlje:88px;--prelaz:180ms ease;--ulaz:600ms cubic-bezier(.2,.7,.2,1)}
*,*::before,*::after{box-sizing:border-box}*{margin:0}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:112px}body{font-family:var(--font);font-synthesis:none;font-size:16px;line-height:1.5;color:var(--tekst);background:var(--bijela);-webkit-font-smoothing:antialiased}img,svg{display:block;max-width:100%}img{object-fit:cover}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit;color:inherit}button,summary,select{cursor:pointer}ul,ol{list-style:none;padding:0}h1,h2,h3{color:var(--navy)}[hidden],.je-skrivena{display:none!important}a,button,summary,input,textarea,select{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid var(--navy);outline-offset:5px}.podnozje :focus-visible,.cta :focus-visible,.uvodna__dokaz:focus-visible{outline-color:var(--narandzasta)}.vid-skriveno,.polje--skriveno{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.preskoci{position:fixed;top:12px;left:12px;z-index:100;background:var(--navy);color:var(--bijela);padding:12px 20px;transform:translateY(-150%)}.preskoci:focus{transform:none}.omot{width:100%;max-width:1536px;padding-inline:var(--bocno);margin-inline:auto}.ikona{flex-shrink:0}.naslov-1,.hero__naslov{font-size:clamp(38px,4.8vw,68px);line-height:1.04;letter-spacing:-.035em;font-weight:700;text-wrap:balance}.naslov-2{font-size:clamp(30px,3.25vw,46px);line-height:1.12;letter-spacing:-.025em;font-weight:700;text-wrap:balance}.naslov-3{font-size:clamp(23px,2.2vw,30px);line-height:1.2;letter-spacing:-.02em;font-weight:700}.uvod{font-size:clamp(18px,1.4vw,20px);line-height:1.5;color:var(--navy);font-weight:300;max-width:72ch}.labela{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.13em;color:var(--navy);margin-bottom:20px;line-height:1.5}.labela::before{content:none;display:none}.labela__broj{margin-right:8px}.tekst{max-width:72ch}.tekst p+p{margin-top:24px}.tekst .link-strelica{margin-top:28px}.link-strelica{display:inline-flex;align-items:center;gap:16px;max-width:100%;font-weight:700;font-size:14px;color:var(--navy);padding-block:10px;border-bottom:1px solid var(--navy);transition:border-color var(--prelaz),color var(--prelaz)}.link-strelica:hover{border-color:var(--narandzasta)}.link-strelica .ikona{transition:transform var(--prelaz)}.link-strelica:hover .ikona{transform:translateX(4px)}
/* One shared navigation, no scroll-driven repositioning. */
.zaglavlje{position:sticky;top:0;z-index:50;background:var(--bijela);border-bottom:1px solid var(--linija)}.zaglavlje__red{height:var(--zaglavlje);display:flex;align-items:center;gap:26px}.zaglavlje__logo{flex-shrink:0}.zaglavlje__logo img{width:160px;height:auto}.meni{margin-inline:auto}.meni ul{display:flex;gap:clamp(14px,1.65vw,25px)}.meni a{display:block;padding:12px 0;color:var(--navy);font-size:14px;border-bottom:2px solid transparent}.meni a:hover,.meni a[aria-current]{border-color:var(--narandzasta)}.meni a[aria-current]{font-weight:700}.zaglavlje__akcije{display:flex;align-items:center;gap:12px}.jezik{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;color:var(--navy);font-size:13px;font-weight:700;border:1px solid var(--linija)}.dugme{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:50px;padding:14px 22px;background:var(--navy);color:var(--bijela);font-weight:700;font-size:15px;line-height:1.3;border:1px solid var(--navy);border-radius:2px;transition:background var(--prelaz),border-color var(--prelaz)}.dugme:hover{background:var(--navy-duboka)}.dugme--malo{font-size:13px;min-height:44px;padding:10px 14px}.dugme--narandzasto{background:var(--bijela);color:var(--navy);border-color:var(--bijela);box-shadow:inset 4px 0 var(--narandzasta)}.dugme--narandzasto:hover{background:var(--siva-znaka)}.dugme--obrub{background:transparent;border-color:var(--na-navy);color:var(--bijela)}.dugme:disabled{opacity:.65;cursor:wait}.burger{display:none;width:44px;height:44px;background:var(--bijela);border:1px solid var(--linija);position:relative}.burger i{position:absolute;left:12px;right:12px;height:2px;background:var(--navy);transition:transform var(--prelaz)}.burger i:first-of-type{top:16px}.burger i:last-of-type{top:25px}.burger[aria-expanded=true] i:first-of-type{top:21px;transform:rotate(45deg)}.burger[aria-expanded=true] i:last-of-type{top:21px;transform:rotate(-45deg)}.mobilni{position:absolute;top:100%;left:0;right:0;background:var(--bijela);padding:16px var(--bocno) 28px;max-height:calc(100dvh - var(--zaglavlje));overflow-y:auto;border-bottom:1px solid var(--linija)}.mobilni li a{display:block;padding:14px 0;border-bottom:1px solid var(--linija);color:var(--navy);font-size:22px;font-weight:700}.mobilni [aria-current]{text-decoration:underline;text-decoration-color:var(--narandzasta);text-underline-offset:6px}.mobilni__dno{display:grid;gap:14px;padding-top:24px;color:var(--navy)}.mobilni__dno .jezik{justify-self:start;padding-inline:16px}
/* First screen: a white introduction paired with a real, labelled site photograph. */
.uvodna{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(40px,6vw,88px);padding-top:48px;padding-bottom:48px;align-items:stretch}.uvodna__tekst{padding-block:30px 8px;display:flex;flex-direction:column;align-items:flex-start}.uvodna .hero__naslov{font-size:clamp(44px,5.1vw,74px);max-width:14ch;margin-bottom:26px}.uvodna .uvod{max-width:49ch;font-size:18px;line-height:1.5}.hero__akcije{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:30px}.uvodna__kontakt{margin-top:auto;padding-top:30px;font-size:14px;color:var(--navy);display:flex;gap:14px;align-items:center}.uvodna__kontakt:hover{text-decoration:underline}.uvodna__dokaz{display:flex;flex-direction:column;background:var(--navy);color:var(--bijela);min-width:0}.uvodna__foto{overflow:hidden;flex:1;min-height:340px}.uvodna__foto img{width:100%;height:100%;object-position:57% center;aspect-ratio:1.2}.uvodna__potpis{position:relative;padding:26px 32px 30px;display:grid;gap:10px}.uvodna__potpis h2{font-size:23px;line-height:1.2;font-weight:700;color:var(--bijela);max-width:26ch;padding-right:20px}.uvodna__potpis>span:last-of-type{font-size:14px;color:var(--na-navy)}.uvodna__potpis>.ikona{position:absolute;right:28px;bottom:32px}.status{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--navy);white-space:nowrap}.status::before{content:"";width:7px;height:7px;flex-shrink:0;background:var(--navy)}.status--u-toku::before{background:var(--narandzasta)}.uvodna__potpis .status{color:var(--bijela)}.ovlascenje{display:grid;grid-template-columns:1fr 1.75fr 40px;gap:40px;padding-block:30px;border-top:1px solid var(--linija);border-bottom:1px solid var(--linija);align-items:start}.ovlascenje h2{font-size:24px;line-height:1.2;max-width:20ch}.ovlascenje p{font-size:15px;max-width:72ch}.ovlascenje__znak{font-size:32px;color:var(--navy);line-height:1}
/* Editorial rhythm and proof, without image placeholders. */
.sekcija{padding-block:var(--sekcija)}.sekcija--bez-vrha{padding-top:0}.sekcija--siva{background:var(--podloga-siva)}.glava-sekcije{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:48px}.glava-sekcije .naslov-2{max-width:23ch}.glava-sekcije>.link-strelica{flex-shrink:0}.dvije-kolone,.dvije-jednake{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,7vw,100px);align-items:start}.dvije-jednake{grid-template-columns:1fr 1fr}.izdvojen{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,88px);padding-block:40px;border-top:1px solid var(--linija);align-items:center}.izdvojen:last-child{border-bottom:1px solid var(--linija)}.izdvojen__dokaz{min-width:0}.izdvojen__dokaz>img{width:100%;aspect-ratio:1.8;height:auto}.izdvojen__meta{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;margin-bottom:20px}.izdvojen__meta .labela{margin:0}.izdvojen h3{font-size:clamp(25px,2.6vw,36px);line-height:1.15;letter-spacing:-.02em;max-width:30ch}.izdvojen p{margin-block:18px 14px;max-width:58ch}.projektna-kota{position:relative;border-left:2px solid var(--narandzasta);padding:24px 32px;color:var(--navy);display:grid;gap:18px}.projektna-kota::before,.projektna-kota::after{content:"";position:absolute;left:-6px;width:10px;height:2px;background:var(--narandzasta)}.projektna-kota::before{top:0}.projektna-kota::after{bottom:0}.projektna-kota__broj{font-size:clamp(60px,7.4vw,108px);line-height:1;letter-spacing:-.055em;font-weight:700;white-space:nowrap}.projektna-kota small{font-size:.25em;letter-spacing:0;margin-left:8px}.projektna-kota__opis{max-width:30ch;font-size:16px}.pocetne-usluge{background:var(--navy);color:var(--na-navy)}.pocetne-usluge h2,.pocetne-usluge h3,.pocetne-usluge .labela,.pocetne-usluge .link-strelica{color:var(--bijela)}.pocetne-usluge .link-strelica{border-color:var(--na-navy)}.lijepi-naslov{position:sticky;top:124px}.lijepi-naslov>.link-strelica{margin-top:30px}.harmonika details{border-top:1px solid var(--na-navy)}.harmonika details:last-child{border-bottom:1px solid var(--na-navy)}.harmonika summary{display:grid;grid-template-columns:28px 1fr 24px;gap:18px;padding-block:26px;list-style:none}.harmonika summary::-webkit-details-marker{display:none}.harmonika summary>span:first-child{font-size:14px;padding-top:3px}.harmonika summary h3{font-size:clamp(21px,1.7vw,25px);line-height:1.25;letter-spacing:-.01em}.plus{font-size:24px;line-height:1}.harmonika details[open] .plus{transform:rotate(45deg)}.harmonika__tekst{padding:0 38px 28px 46px}.harmonika__tekst p{font-size:16px;line-height:1.5}.harmonika__tekst .link-strelica{margin-top:16px}.brojke{border-block:1px solid var(--linija)}.brojke__red{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.brojka{padding:32px 24px;display:grid;gap:12px;border-left:1px solid var(--linija)}.brojka:first-child{padding-left:0;border:0}.brojka__broj{font-size:52px;line-height:1;color:var(--navy);font-weight:700;letter-spacing:-.035em}.brojka>span:last-child{font-size:14px}.zasto__stavka{display:grid;grid-template-columns:42px minmax(0,4fr) minmax(0,6fr);gap:32px;padding-block:28px;border-top:1px solid var(--linija);align-items:start}.zasto__broj{font-size:14px;color:var(--navy);padding-top:4px}.zasto h3{font-size:25px;line-height:1.2;letter-spacing:-.015em;max-width:28ch}.zasto p{max-width:65ch}.logotipi{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--linija);border-left:1px solid var(--linija)}.logotipi li{padding:22px 18px;background:var(--bijela);border-right:1px solid var(--linija);border-bottom:1px solid var(--linija)}.logotipi img{width:100%;height:auto;aspect-ratio:2;object-fit:contain}.logotipi--svi{grid-template-columns:repeat(5,minmax(0,1fr))}.logotipi--svi li{padding:32px}
/* Page titles and project register. */
.strana-hero{padding-block:40px 64px}.mrvice{display:flex;flex-wrap:wrap;gap:8px;font-size:13px;margin-bottom:30px}.mrvice a:hover{text-decoration:underline}.mrvice [aria-current]{color:var(--navy)}.strana-hero__red{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(32px,7vw,100px);align-items:start;border-top:1px solid var(--navy);padding-top:40px}.strana-hero__red .uvod{max-width:70ch}.filteri{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px;padding:24px 0 28px;border-top:1px solid var(--navy);border-bottom:1px solid var(--navy);margin-bottom:0}.filteri__usluga{width:100%;display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:center;padding-bottom:22px;border-bottom:1px solid var(--linija)}.filteri__usluga label{font-weight:700;color:var(--navy);font-size:16px}.filteri select{width:100%;min-width:0;max-width:760px;min-height:48px;background:var(--bijela);border:1px solid var(--linija);padding:10px 36px 10px 14px;border-radius:2px;color:var(--navy);font-size:15px}.filteri__grupa{display:flex;flex-wrap:wrap;gap:6px}.cip{display:inline-flex;gap:10px;align-items:center;min-height:44px;padding:10px 14px;background:var(--bijela);border:1px solid var(--linija);border-radius:2px;font-size:14px;color:var(--navy)}.cip span{font-size:12px}.cip:hover{border-color:var(--navy)}.cip[aria-pressed=true]{background:var(--navy);color:var(--bijela);border-color:var(--navy)}.filteri__broj{font-size:13px;margin-left:auto}.mreza-projekata{display:block}.kartica{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,5fr) minmax(0,2.5fr);gap:40px;padding:38px 0;border-bottom:1px solid var(--linija);align-items:start}.kartica__meta{display:grid;gap:12px;font-size:14px}.kartica__meta .labela{margin-bottom:8px;font-size:11px}.kartica__meta .labela::before{display:none}.kartica__glavno{min-width:0;grid-column:2/4}.kartica--foto .kartica__glavno{grid-column:2}.kartica__naslov{font-size:clamp(23px,2.2vw,30px);line-height:1.2;font-weight:700;letter-spacing:-.02em;max-width:44ch}.kartica__naslov a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}.kartica__uloga{margin-block:16px 12px;max-width:65ch;font-size:16px}.kartica__slika{overflow:hidden;aspect-ratio:1.5}.kartica__slika img{width:100%;height:100%;transition:transform var(--ulaz)}.kartica__slika:hover img{transform:scale(1.035)}.prazno{padding:36px 0;color:var(--navy)}.prazno button{background:none;border:0;border-bottom:1px solid var(--navy);margin-left:12px}.traka{display:grid;gap:18px}.traka>div{display:grid;gap:5px;padding-bottom:15px;border-bottom:1px solid var(--linija)}.traka dt{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700}.traka dd{font-size:16px;color:var(--navy)}
/* Project context and responsibilities form a continuous, readable document. */
.dosije{padding-top:36px}.dosije__glava{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,3fr);gap:clamp(32px,7vw,100px);border-top:1px solid var(--navy);padding-top:40px}.dosije .naslov-1{font-size:clamp(36px,4.3vw,62px);max-width:27ch}.dosije__foto{margin-top:44px;overflow:hidden;max-height:560px}.dosije__foto img{width:100%;height:auto;max-height:560px;object-fit:cover}.dosije__sadrzaj{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:clamp(40px,9vw,130px)}.dosije__indeks{position:sticky;top:120px;display:grid;gap:14px}.dosije__indeks .labela{margin-bottom:0}.dosije__indeks>a{font-size:14px;color:var(--navy);padding:8px 0;border-bottom:1px solid var(--linija)}.dosije__indeks .projektna-kota{margin-top:32px;padding:20px}.dosije__indeks .projektna-kota__broj{font-size:clamp(48px,5.2vw,75px)}.dosije__poglavlje{margin-bottom:44px;max-width:75ch}.dosije__poglavlje h2{margin-bottom:24px}.uloga{border-top:1px solid var(--navy)}.uloga li{display:grid;grid-template-columns:30px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--linija);color:var(--navy)}.uloga__br{font-size:13px;padding-top:3px}
/* Services: anchored chapters, full approved text. */
.usluge-raspored{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:clamp(40px,8vw,120px);padding-bottom:var(--sekcija)}.sadrzaj-usluga{position:sticky;top:120px;align-self:start}.sadrzaj-usluga a{display:grid;grid-template-columns:24px 1fr;gap:14px;font-size:14px;color:var(--navy);padding:18px 0;border-bottom:1px solid var(--linija)}.sadrzaj-usluga a span{font-size:12px}.sadrzaj-usluga a:hover,.sadrzaj-usluga a[aria-current]{border-color:var(--narandzasta);font-weight:700}.usluga{padding-block:40px 60px;border-top:1px solid var(--navy)}.usluga:first-child{padding-top:28px}.usluga__glava{display:grid;grid-template-columns:38px 1fr;gap:20px;margin-bottom:26px}.usluga__glava .naslov-2{font-size:clamp(28px,2.8vw,40px)}.usluga__broj{font-weight:700;font-size:14px;color:var(--navy);padding-top:8px}.usluga__opis{margin-bottom:26px}.usluga__stavke{margin-bottom:24px}.usluga__stavke li{position:relative;padding:15px 0 15px 22px;border-top:1px solid var(--linija);color:var(--navy)}.usluga__stavke li::before{content:"";position:absolute;left:0;top:25px;width:6px;height:2px;background:var(--narandzasta)}
/* Supporting pages retain the same document hierarchy. */
.siroka-slika{margin-inline:auto;width:calc(100% - 2 * var(--bocno));max-width:1408px;height:clamp(260px,38vw,520px);overflow:hidden}.siroka-slika img{width:100%;height:100%;object-fit:cover}.navy-traka{background:var(--navy);color:var(--na-navy);padding-block:var(--sekcija);position:relative;overflow:hidden;isolation:isolate}.navy-traka .naslov-2,.navy-traka .labela{color:var(--bijela);margin-bottom:24px}.navy-traka p+p{margin-top:22px}.zig{position:absolute;pointer-events:none;color:var(--navy-zig)}.navy-traka__zig{width:50%;right:-15%;bottom:-20%;z-index:-1}.oblast{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,6fr) minmax(0,3fr);gap:40px;border-top:1px solid var(--navy);padding-block:40px 64px;align-items:start}.oblast__glava .naslov-3{margin-top:18px}.oblast__tekst p+p{margin-top:24px}.oblast__slika{aspect-ratio:3/4;overflow:hidden}.oblast__slika img{width:100%;height:100%}.registar{border-top:1px solid var(--navy)}.registar__red{display:grid;grid-template-columns:44px minmax(0,4fr) minmax(0,6fr);gap:32px;padding:30px 0;border-bottom:1px solid var(--linija)}.registar__broj{font-size:14px;color:var(--navy)}.registar__naslov{font-size:25px;font-weight:700;color:var(--navy);line-height:1.2}.registar__opis{font-size:18px}
/* Contact and footer. */
.cta{background:var(--navy);color:var(--na-navy);padding-block:72px;border-top:4px solid var(--narandzasta)}.cta__red{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:80px;align-items:center}.cta .naslov-2{color:var(--bijela);max-width:24ch}.cta__tekst{margin-top:24px;font-size:18px;font-weight:300;max-width:60ch}.cta__akcije{display:flex;flex-wrap:wrap;gap:14px;align-items:center}.cta__konsultacija{width:100%;color:var(--bijela);font-size:22px;line-height:1.3;margin-bottom:12px;font-weight:700}.kontakt{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(36px,7vw,100px);align-items:start}.kontakt__info .uvod{margin-top:24px}.kontakt__lista{margin-top:32px}.kontakt__lista>div{padding:20px 0;border-top:1px solid var(--linija);display:grid;grid-template-columns:130px 1fr;gap:20px}.kontakt__lista dt{display:flex;align-items:center;gap:10px;font-size:14px}.kontakt__lista dd{display:grid;gap:8px;color:var(--navy);font-weight:700;overflow-wrap:anywhere}.kontakt__lista a:hover{text-decoration:underline}.forma{display:grid;gap:24px;padding:36px;background:var(--navy);color:var(--bijela);border-top:4px solid var(--narandzasta)}.polje{display:grid;gap:8px}.polje label{font-size:14px;font-weight:700}.polje-red{display:grid;grid-template-columns:1fr 1fr;gap:20px}.polje input,.polje textarea{width:100%;min-width:0;min-height:50px;padding:12px 14px;background:var(--bijela);border:2px solid var(--bijela);color:var(--navy);border-radius:2px}.polje textarea{resize:vertical;min-height:160px}.polje input:focus-visible,.polje textarea:focus-visible{outline-color:var(--narandzasta)}.polje.ima-gresku input,.polje.ima-gresku textarea{border-color:var(--narandzasta)}.polje__greska,.forma__poruka{color:var(--bijela);font-size:14px}.forma .dugme{justify-self:start}.forma__uspjeh .naslov-3{color:var(--bijela);margin-bottom:16px}.podnozje{background:var(--navy-duboka);color:var(--na-navy);position:relative;overflow:hidden;isolation:isolate;padding-top:64px}.podnozje__zig{width:45%;left:-15%;bottom:-25%;z-index:-1}.podnozje__gore{display:grid;grid-template-columns:1.1fr .8fr 1.3fr 1.1fr;gap:40px;padding-bottom:48px}.podnozje__brend img{width:185px;height:auto}.podnozje__brend p{margin-top:22px;max-width:25ch}.podnozje .labela{color:var(--bijela)}.podnozje__kolona ul{display:grid;gap:12px;font-size:14px}.podnozje a:hover{color:var(--bijela);text-decoration:underline}.podnozje__dno{display:flex;flex-wrap:wrap;gap:20px;padding-block:24px;border-top:1px solid var(--tekst);font-size:12px}.slogan{color:var(--bijela);text-transform:uppercase;letter-spacing:.1em;font-weight:700;margin-right:auto}.podnozje__dno a{color:var(--bijela)}
/* Motion is an enhancement: all content is visible before JS and after failures. */
@keyframes dolazak{from{opacity:.55;transform:translateY(16px)}to{opacity:1;transform:none}}@keyframes prelivanje{from{opacity:.55}to{opacity:1}}.je-vidljivo{animation:dolazak var(--ulaz) both}.uvodna__foto img{animation:prelivanje 700ms ease both}details[open] .harmonika__tekst{animation:prelivanje 350ms ease both}.kartica.filter-ulaz{animation:prelivanje 300ms ease both}
@media(min-width:1181px){.mobilni{display:none}}
@media(max-width:1180px){.meni,.zaglavlje__akcije .dugme span{display:none}.burger{display:block}.zaglavlje__akcije{margin-left:auto}.zaglavlje__akcije .dugme{width:44px;padding:0}.uvodna{gap:36px}.uvodna .hero__naslov{font-size:clamp(44px,5.3vw,64px)}.uvodna__potpis{padding:24px}.ovlascenje{grid-template-columns:1fr 2fr;gap:30px}.ovlascenje__znak{display:none}.kartica{gap:28px;grid-template-columns:minmax(0,2fr) minmax(0,5fr) minmax(0,2.5fr)}.podnozje__gore{grid-template-columns:1fr 1fr}.podnozje__brend{grid-column:1/-1}.oblast{grid-template-columns:minmax(0,3fr) minmax(0,6fr)}.oblast__slika{grid-column:2;aspect-ratio:2.3;max-height:240px}}
@media(max-width:900px){.uvodna{grid-template-columns:1.1fr 1fr;gap:28px}.uvodna .hero__naslov{font-size:46px}.uvodna .uvod{font-size:17px}.uvodna__foto{min-height:300px}.uvodna__potpis h2{font-size:21px}.dvije-kolone,.dvije-jednake{grid-template-columns:1fr;gap:32px}.lijepi-naslov{position:static}.glava-sekcije{align-items:start}.usluge-raspored{grid-template-columns:1fr;gap:32px}.sadrzaj-usluga{position:static}.sadrzaj-usluga ol{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}.usluga__glava{grid-template-columns:32px 1fr}.dosije__glava{grid-template-columns:1fr;gap:28px}.dosije__podaci .traka{grid-template-columns:repeat(3,1fr)}.dosije__sadrzaj{grid-template-columns:1fr;gap:32px}.dosije__indeks{position:static;grid-template-columns:1fr 1fr;gap:12px 24px}.dosije__indeks>.labela,.dosije__indeks .projektna-kota{grid-column:1/-1}.dosije__indeks .projektna-kota{margin-top:12px}.kontakt{grid-template-columns:1fr}.kontakt__info{max-width:70ch}.cta__red{grid-template-columns:1fr;gap:36px}.cta__akcije{max-width:600px}.logotipi,.logotipi--svi{grid-template-columns:repeat(4,1fr)}.zasto__stavka{grid-template-columns:28px 1fr;gap:16px 24px}.zasto__stavka p{grid-column:2}.kartica{grid-template-columns:minmax(0,2fr) minmax(0,5fr)}.kartica__glavno,.kartica--foto .kartica__glavno{grid-column:2}.kartica__slika{grid-column:2;max-height:260px;width:100%}.strana-hero__red{grid-template-columns:1fr;gap:24px}.brojka__broj{font-size:44px}}
@media(max-width:760px){:root{--zaglavlje:76px;--sekcija:64px}.zaglavlje__red{gap:14px}.zaglavlje__logo img{width:140px}.zaglavlje__akcije{gap:8px}.uvodna{grid-template-columns:1fr;padding-top:30px;padding-bottom:28px;gap:32px}.uvodna__tekst{padding:0}.uvodna .hero__naslov{font-size:clamp(40px,10.8vw,64px);max-width:14ch;margin-bottom:20px}.uvodna .labela{font-size:11px;margin-bottom:22px;letter-spacing:.08em}.uvodna .uvod{font-size:17px}.hero__akcije{gap:12px 20px;margin-top:24px}.uvodna__kontakt{padding-top:22px;font-size:13px}.uvodna__foto{min-height:0;flex:auto;height:230px}.uvodna__foto img{height:100%;aspect-ratio:auto;object-position:center 55%}.uvodna__potpis{padding:22px}.uvodna__potpis h2{font-size:22px;max-width:30ch}.ovlascenje{grid-template-columns:1fr;gap:14px;padding-block:26px}.ovlascenje h2{font-size:22px;max-width:none}.ovlascenje p{font-size:15px}.glava-sekcije{flex-direction:column;gap:18px;margin-bottom:32px}.izdvojen{grid-template-columns:1fr;gap:26px;padding-block:30px}.izdvojen__dokaz{order:2}.izdvojen__tekst{order:1}.izdvojen h3{font-size:28px}.izdvojen__meta{gap:12px 20px;margin-bottom:16px}.izdvojen__meta .labela{font-size:11px}.projektna-kota{padding:20px 24px;gap:12px}.projektna-kota__broj{font-size:76px}.projektna-kota__opis{font-size:15px;max-width:none}.izdvojen p{margin-top:16px}.brojke__red{grid-template-columns:1fr 1fr}.brojka{padding:26px 20px}.brojka:nth-child(odd){padding-left:0;border-left:0}.brojka:nth-child(-n+2){border-bottom:1px solid var(--linija)}.brojka__broj{font-size:44px}.logotipi,.logotipi--svi{grid-template-columns:repeat(3,minmax(0,1fr))}.logotipi li,.logotipi--svi li{padding:16px 10px}.zasto h3{font-size:23px}.strana-hero{padding-block:28px 40px}.strana-hero__red{padding-top:28px}.mrvice{font-size:12px;margin-bottom:24px}.filteri__usluga{grid-template-columns:1fr;gap:12px}.filteri{gap:18px}.filteri__broj{width:100%;margin:0}.filteri__grupa{gap:8px}.cip{font-size:13px;padding:10px 12px}.filteri select{font-size:14px}.kartica{grid-template-columns:1fr;gap:18px;padding:28px 0}.kartica__meta{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;font-size:13px}.kartica__meta .labela{width:100%;margin:0;font-size:11px}.kartica__glavno,.kartica--foto .kartica__glavno,.kartica__slika{grid-column:1}.kartica__naslov{font-size:25px}.kartica__uloga{font-size:15px}.kartica__slika{max-height:220px}.dosije{padding-top:24px}.dosije__glava{padding-top:28px}.dosije .naslov-1{font-size:38px;line-height:1.08}.dosije__podaci .traka{grid-template-columns:1fr 1fr;gap:14px}.dosije__podaci .traka>div:last-child{grid-column:1/-1}.dosije__foto{margin-top:28px}.dosije__foto img{min-height:240px}.dosije__indeks{gap:10px}.dosije__indeks>a{font-size:13px}.dosije__poglavlje{margin-bottom:36px}.dosije__poglavlje .uvod{font-size:18px}.sadrzaj-usluga ol{grid-template-columns:1fr}.sadrzaj-usluga a{padding:14px 0}.sadrzaj-usluga .labela{margin-bottom:8px}.usluga{padding-block:30px 44px}.usluga__glava{gap:12px}.usluga__glava .naslov-2{font-size:28px}.usluga__stavke li{font-size:15px}.harmonika summary{gap:12px;grid-template-columns:24px 1fr 20px;padding-block:22px}.harmonika summary h3{font-size:21px}.harmonika__tekst{padding-left:36px;padding-right:0}.oblast{grid-template-columns:1fr;gap:24px;padding-block:28px 44px}.oblast__slika{grid-column:1;max-height:220px;aspect-ratio:1.8}.oblast__glava .naslov-3{margin-top:10px}.registar__red{grid-template-columns:24px 1fr;gap:16px}.registar__naslov{font-size:23px}.registar__opis{grid-column:2;font-size:17px}.cta{padding-block:48px}.cta__konsultacija{font-size:21px}.cta__tekst{font-size:17px}.kontakt__lista>div{grid-template-columns:1fr;gap:8px}.forma{padding:26px 22px}.polje-red{grid-template-columns:1fr}.podnozje{padding-top:48px}.podnozje__gore{grid-template-columns:1fr;gap:36px}.podnozje__dno{gap:14px}.podnozje__zig{width:90%;left:-30%;bottom:-8%}.podnozje__dno .slogan{width:100%;font-size:11px}.navy-traka__zig{width:100%;right:-50%;bottom:-5%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{scroll-behavior:auto!important}.je-vidljivo{animation:prelivanje 600ms ease both}.kartica__slika:hover img,.link-strelica:hover .ikona{transform:none}.kartica__slika img,.link-strelica .ikona{transition:opacity 300ms ease}.harmonika details[open] .plus{transform:none}.harmonika details[open] .plus{font-size:0}.harmonika details[open] .plus::after{content:'−';font-size:24px}}
.plus{align-self:start;justify-self:center;width:20px;height:24px;text-align:center}.uvodna__tekst,.izdvojen__tekst,.harmonika,.zasto__stavka>*{min-width:0}

/* ---------- Pokret — vraćeno 17.09.2026 (Teodor: „animacije mi moraš ubaciti, to mi je bitno") ----------
   Sadržaj kreće od nule tek kad je <html> dobio klasu .js (postavlja se inline u <head>),
   pa bez JS-a ništa nije sakriveno. */
.js [data-otkrij]:not(.je-vidljivo) { opacity: 0; }
@keyframes dolazak { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes prelivanje { from { opacity: 0; } to { opacity: 1; } }
.je-vidljivo { animation-delay: calc(var(--kasni, 0) * 90ms); }
.uvodna__foto { overflow: hidden; }
.uvodna__foto img { animation: heroZoom 2.4s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes heroZoom { from { transform: scale(1.14); } to { transform: scale(1); } }
.izdvojen__dokaz { overflow: hidden; }
.izdvojen.je-vidljivo .izdvojen__dokaz img { animation: otkrivanje 1.1s cubic-bezier(.7, 0, .2, 1) .15s both; }
@keyframes otkrivanje { from { clip-path: inset(0 100% 0 0); transform: scale(1.08); } to { clip-path: inset(0 0 0 0); transform: none; } }
.projektna-kota { transition: none; }
.je-vidljivo .projektna-kota__broj, .projektna-kota.je-vidljivo .projektna-kota__broj { font-variant-numeric: tabular-nums; }
.status--u-toku::before { animation: puls 2.4s ease-in-out infinite; }
@keyframes puls { 50% { opacity: .3; } }
.logotipi--red { margin-top: 56px; }
@media (prefers-reduced-motion: reduce) {
  .uvodna__foto img, .izdvojen.je-vidljivo .izdvojen__dokaz img, .status--u-toku::before { animation: none; }
}
/* Uvod usluga stoji na navy traci. */
.pocetne-usluge .uvod { color: var(--bijela); }
/* 27 logotipa: 9 kolona = tri puna reda na širokom ekranu. */
@media (min-width: 1200px) { .logotipi--red { grid-template-columns: repeat(9, 1fr); } }
/* Galerija sa terena na stranici projekta — prave dron fotografije. */
.galerija { padding-bottom: var(--sekcija); }
.galerija__mreza { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: clamp(180px, 20vw, 300px); gap: 12px; }
.galerija__slika { margin: 0; overflow: hidden; background: var(--navy); }
.galerija__slika img { width: 100%; height: 100%; object-fit: cover; transition: transform 900ms cubic-bezier(.2, .7, .2, 1); }
.galerija__slika:hover img { transform: scale(1.04); }
/* 1 fotka: puna širina · 2: jedna do druge, visoke · 3: velika lijevo, dvije desno */
.galerija__mreza--n1 { grid-template-columns: 1fr; grid-auto-rows: clamp(260px, 42vw, 620px); }
.galerija__mreza--n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.galerija__mreza--n2 .galerija__slika { grid-row: span 2; }
.galerija__mreza--n3 .galerija__slika:first-child { grid-column: span 2; grid-row: span 2; }
@media (max-width: 760px) {
  .galerija__mreza, .galerija__mreza--n2 { grid-template-columns: 1fr; grid-auto-rows: 58vw; }
  .galerija__mreza .galerija__slika, .galerija__mreza--n3 .galerija__slika:first-child { grid-column: auto; grid-row: auto; }
  .galerija__slika--uspravno { grid-row: span 2 !important; }
}
@media (prefers-reduced-motion: reduce) { .galerija__slika img { transition: none; } .galerija__slika:hover img { transform: none; } }
/* Video u uvodu: puni okvir; fotografija je rezerva samo kad je pokret smanjen (bez videa u petlji). */
.uvodna__foto { position: relative; }
.uvodna__video { width: 100%; height: 100%; object-fit: cover; display: block; }
.uvodna__rezerva { display: none; }
@media (prefers-reduced-motion: reduce) {
  .uvodna__video { display: none; }
  .uvodna__rezerva { display: block; width: 100%; height: 100%; object-fit: cover; }
}
/* Galerija od samih uspravnih kadrova: tri visoka u redu. */
.galerija__mreza--n3 .galerija__slika--uspravno:first-child { grid-column: auto; }
.galerija__slika--uspravno { grid-row: span 2; }

/* ---------- Heroj sa videom preko cijele širine (17.09.2026) ---------- */
.hero-video { position: relative; isolation: isolate; min-height: min(92vh, 900px); display: flex; flex-direction: column; justify-content: flex-end; background: var(--navy-duboka); color: var(--bijela); overflow: hidden; }
.hero-video__snimak, .hero-video__rezerva { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.hero-video__rezerva { display: none; }
.hero-video::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, rgba(7, 24, 41, .88) 0%, rgba(7, 24, 41, .62) 38%, rgba(7, 24, 41, .08) 72%),
              linear-gradient(0deg, rgba(7, 24, 41, .9) 0%, rgba(7, 24, 41, 0) 34%); }
.hero-video__sadrzaj { padding-block: clamp(96px, 14vh, 160px) clamp(40px, 6vh, 64px); }
.hero-video .hero__naslov { color: var(--bijela); font-size: clamp(44px, 6vw, 92px); line-height: .98; max-width: 12ch; margin-bottom: 26px; }
.hero-video .uvod { color: #DCE3EB; max-width: 46ch; }
.hero-video .labela { color: var(--bijela); }
.hero-video .link-strelica { color: var(--bijela); border-color: rgba(255, 255, 255, .5); gap: 12px; }
.hero-video .link-strelica:hover { border-color: var(--narandzasta); }
.hero-video__traka { display: block; border-top: 1px solid rgba(255, 255, 255, .2); background: rgba(7, 24, 41, .55); backdrop-filter: blur(6px); }
.hero-video__traka > .omot { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 24px; min-height: 72px; }
.hero-video__traka strong { font-weight: 700; }
.hero-video__traka > .omot > span:last-of-type { color: var(--na-navy); font-size: 14px; }
.hero-video__traka .status { color: var(--bijela); }
.hero-video__traka .ikona { transition: transform var(--prelaz); }
.hero-video__traka:hover .ikona { transform: translateX(4px); }
@media (max-width: 760px) {
  .hero-video { min-height: calc(100svh - 64px); }
  .hero-video::before { background: linear-gradient(0deg, rgba(7, 24, 41, .95) 30%, rgba(7, 24, 41, .35) 100%); }
  .hero-video__traka > .omot { grid-template-columns: auto 1fr; row-gap: 4px; padding-block: 16px; }
  .hero-video__traka > .omot > span:last-of-type { grid-column: 2; }
  .hero-video__traka .ikona { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-video__snimak { display: none; }
  .hero-video__rezerva { display: block; }
}
@media (max-width: 760px) { .hero-video__sadrzaj { padding-block: 40px 28px; } .hero-video .hero__naslov { margin-bottom: 18px; } }
/* Heroj + zaglavlje = tačno jedan ekran (zaglavlje je var(--zaglavlje), ne 64 px). */
.hero-video { min-height: min(calc(100svh - var(--zaglavlje)), 860px); }
@media (max-width: 760px) { .hero-video { min-height: calc(100svh - var(--zaglavlje)); } }

/* =====================================================================
   HOVER I POKRET — drugi krug (17.09.2026)
   Obrasci iz kataloga skrol-animacije: C (maska po riječima), E (paralaksa),
   M (magnetno dugme), N (zaglavlje koje se skloni), Q (maska slike), Z (traka napretka).
   Trajanja: hover 0,2–0,35 s, ulaz 0,7–0,9 s (izmjereno na nagrađenim sajtovima).
   ===================================================================== */
:root { --kriva: cubic-bezier(.2, .7, .2, 1); --kriva-io: cubic-bezier(.7, 0, .2, 1); }

/* --- Dugmad: popuna klizi s lijeva, strelica ide naprijed, pritisak se osjeti --- */
.dugme { position: relative; overflow: hidden; isolation: isolate; transition: color .3s var(--kriva), border-color .3s var(--kriva), box-shadow .3s var(--kriva), transform .2s var(--kriva); }
.dugme::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--narandzasta); transform: scaleX(0); transform-origin: left center; transition: transform .45s var(--kriva-io); }
.dugme:hover::after, .dugme:focus-visible::after { transform: scaleX(1); }
.dugme:hover, .dugme:focus-visible { color: var(--bijela); border-color: var(--narandzasta); background: var(--navy); }
.dugme:active { transform: scale(.97); }
.dugme .ikona { transition: transform .35s var(--kriva); }
.dugme:hover .ikona--strelica { transform: translateX(5px); }
.dugme:hover .ikona:not(.ikona--strelica) { transform: rotate(-12deg); }
/* bijelo dugme sa narandžastom ivicom: popuna navy */
.dugme--narandzasto:hover, .dugme--narandzasto:focus-visible { background: var(--bijela); border-color: var(--bijela); box-shadow: inset 4px 0 var(--narandzasta); }
.dugme--narandzasto::after { background: var(--navy); }
.dugme--obrub::after { background: var(--bijela); }
.dugme--obrub:hover, .dugme--obrub:focus-visible { color: var(--navy); border-color: var(--bijela); background: transparent; }
/* magnetno dugme: pomak postavlja JS kroz --mx / --my */
.dugme[data-magnet] { translate: var(--mx, 0) var(--my, 0); transition: translate .5s var(--kriva), color .3s var(--kriva), border-color .3s var(--kriva), box-shadow .3s var(--kriva), transform .2s var(--kriva); }

/* --- Linkovi sa strelicom: narandžasta crta se povlači preko tanke --- */
.link-strelica { border-bottom-color: transparent !important; background: linear-gradient(var(--narandzasta), var(--narandzasta)) left bottom / 0 2px no-repeat, linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat; transition: background-size .45s var(--kriva-io), color .25s var(--kriva); }
.link-strelica:hover, .link-strelica:focus-visible { background-size: 100% 2px, 100% 1px; }
.link-strelica .ikona { transition: transform .35s var(--kriva); }
.link-strelica:hover .ikona--strelica { transform: translateX(6px); }

/* --- Meni: crta raste iz sredine --- */
.meni a { position: relative; border-bottom-color: transparent !important; }
.meni a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--narandzasta); transform: scaleX(0); transition: transform .35s var(--kriva); }
.meni a:hover::after, .meni a[aria-current]::after { transform: scaleX(1); }
.jezik { transition: background-color .25s var(--kriva), color .25s var(--kriva), border-color .25s var(--kriva); }
.jezik:hover { background: var(--navy); color: var(--bijela); border-color: var(--navy); }

/* --- Zaglavlje: uvijek vidljivo, sjenka kad se skroluje (klasu postavlja JS) --- */
.zaglavlje { transition: transform .4s var(--kriva), box-shadow .3s var(--kriva); }
.zaglavlje.je-skrolovano { box-shadow: 0 10px 30px -22px rgba(13, 42, 75, .55); }
.traka-napretka { position: absolute; left: 0; bottom: -1px; height: 2px; width: 100%; background: var(--narandzasta); transform: scaleX(var(--napredak, 0)); transform-origin: left; pointer-events: none; }

/* --- Naslovi: riječi izlaze iza maske, jedna za drugom (JS ih omota) --- */
.rijec { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
.rijec > span { display: inline-block; transform: translateY(108%); transition: transform .85s var(--kriva); transition-delay: calc(var(--i, 0) * 45ms + var(--kasni, 0) * 90ms); }
[data-rijeci].je-vidljivo .rijec > span { transform: none; }
[data-rijeci].je-vidljivo { animation: none !important; opacity: 1 !important; }

/* --- Redovi projekata: pozadina se podvuče, crta ispod naslova, slika zumira --- */
.kartica { position: relative; isolation: isolate; }
.kartica::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(var(--bocno) * -.5); right: calc(var(--bocno) * -.5); z-index: -1; background: var(--podloga-siva); opacity: 0; transition: opacity .35s var(--kriva); }
.kartica:hover::before { opacity: 1; }
.kartica__naslov a, .izdvojen h3 a { background: linear-gradient(var(--narandzasta), var(--narandzasta)) left 100% / 0 2px no-repeat; transition: background-size .5s var(--kriva-io); }
.kartica:hover .kartica__naslov a, .izdvojen:hover h3 a { background-size: 100% 2px; }
.kartica__slika img, .izdvojen__dokaz img { transition: transform .9s var(--kriva); }
.kartica:hover .kartica__slika img, .izdvojen:hover .izdvojen__dokaz img { transform: scale(1.06); }
.izdvojen .projektna-kota__broj { transition: color .35s var(--kriva); }
.izdvojen:hover .projektna-kota__broj { color: var(--narandzasta); }

/* --- Filteri (čipovi) --- */
.cip { transition: background-color .25s var(--kriva), color .25s var(--kriva), border-color .25s var(--kriva), transform .2s var(--kriva); }
.cip:hover { border-color: var(--navy); transform: translateY(-2px); }
.cip:active { transform: scale(.96); }

/* --- Harmonika usluga: glatko otvaranje gdje preglednik podržava, plus se okreće --- */
@supports (interpolate-size: allow-keywords) {
  .harmonika { interpolate-size: allow-keywords; }
  .harmonika details::details-content { block-size: 0; overflow: hidden; transition: block-size .5s var(--kriva), content-visibility .5s allow-discrete; }
  .harmonika details[open]::details-content { block-size: auto; }
}
.harmonika summary { transition: padding-left .35s var(--kriva); }
.harmonika summary:hover { padding-left: 8px; }
.harmonika summary h3 { transition: color .25s var(--kriva); }
.harmonika summary:hover h3 { color: var(--narandzasta); }
.harmonika .plus { transition: transform .4s var(--kriva); }
.harmonika details[open] .plus { transform: rotate(45deg); }

/* --- Logotipi klijenata: ostaju u boji, ćelija se podigne --- */
.logotipi li { position: relative; transition: transform .35s var(--kriva), box-shadow .35s var(--kriva); }
.logotipi li:hover { transform: translateY(-4px); box-shadow: 0 14px 30px -20px rgba(13, 42, 75, .45); z-index: 1; }

/* --- Zašto raditi sa nama: narandžasta crta se povuče kad stavka uđe --- */
.zasto__stavka { position: relative; }
.zasto__stavka::after { content: ""; position: absolute; left: 0; top: -1px; height: 2px; width: 100%; background: var(--narandzasta); transform: scaleX(0); transform-origin: left; transition: transform .7s var(--kriva-io); }
.zasto__stavka.je-vidljivo::after { transform: scaleX(1); transition-delay: calc(var(--kasni, 0) * 120ms + .2s); }

/* --- Galerija: maska se otvori odozdo, slika ide u suprotnom smjeru --- */
.galerija__slika.je-vidljivo img { animation: maskaSlike 1.1s var(--kriva-io) both; animation-delay: calc(var(--kasni, 0) * 110ms); }
@keyframes maskaSlike { from { clip-path: inset(100% 0 0 0); transform: scale(1.18) translateY(-4%); } to { clip-path: inset(0 0 0 0); transform: none; } }

/* --- Heroj: paralaksa videa (JS postavlja --pomak), prsten oko statusa --- */
.hero-video__snimak, .hero-video__rezerva { transform: translateY(var(--pomak, 0px)) scale(1.08); }
.hero-video__traka .status::before { animation: puls 2.4s ease-in-out infinite, prsten 2.4s ease-out infinite; }
@keyframes prsten { 0% { box-shadow: 0 0 0 0 rgba(241, 90, 41, .55); } 70%, 100% { box-shadow: 0 0 0 10px rgba(241, 90, 41, 0); } }
.hero-video__traka strong { transition: color .25s var(--kriva); }
.hero-video__traka:hover strong { color: var(--narandzasta); }

/* --- Smanjen pokret: bez pomjeranja, zumiranja i magneta; boje i prelivanje ostaju --- */
@media (prefers-reduced-motion: reduce) {
  .dugme[data-magnet] { translate: none; }
  .dugme:active, .cip:hover, .cip:active, .logotipi li:hover { transform: none; }
  .rijec > span { transform: none; transition: none; }
  .kartica:hover .kartica__slika img, .izdvojen:hover .izdvojen__dokaz img { transform: none; }
  .galerija__slika.je-vidljivo img { animation: prelivanje .7s ease both; }
  .hero-video__snimak, .hero-video__rezerva { transform: none; }
  .harmonika summary:hover { padding-left: 0; }
  .hero-video__traka .status::before { animation: none; }
  .dugme:hover .ikona, .link-strelica:hover .ikona--strelica { transform: none; }
}

/* bijelo dugme na hoveru: navy popuna, bijeli tekst */
.dugme--narandzasto:hover, .dugme--narandzasto:focus-visible { color: var(--bijela); }
.dugme--narandzasto:hover .ikona { color: var(--bijela); }
/* Trake projekata u heroju: slažu se jedna preko druge, aktivna se prelije i klizne. */
.hero-video__trake { display: grid; }
.hero-video__trake > .hero-video__traka { grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .6s var(--kriva), transform .6s var(--kriva), visibility 0s .6s; }
.hero-video__trake > .hero-video__traka.je-aktivna { opacity: 1; visibility: visible; transform: none; transition: opacity .6s var(--kriva), transform .6s var(--kriva), visibility 0s; }
@media (prefers-reduced-motion: reduce) { .hero-video__trake > .hero-video__traka { transform: none; } }
/* SEO naslovi (17.09): H2 u sekciji usluga na navy traci, uvod ispod naslova */
.pocetne-usluge .naslov-2 { color: var(--bijela); margin-bottom: 22px; max-width: 18ch; }
.pocetne-usluge .lijepi-naslov .uvod { font-size: 17px; color: var(--na-navy); }
.usluge__uvod { margin-bottom: 40px; padding-bottom: 32px; border-bottom: 1px solid var(--linija); max-width: 62ch; }
/* Duga H1 (SEO naslov) na unutrašnjoj strani: manja, šira kolona */
.strana-hero--dugi .naslov-1 { font-size: clamp(34px, 3.9vw, 58px); line-height: 1.06; max-width: 20ch; }
.strana-hero--dugi .uvod { font-size: clamp(18px, 1.45vw, 22px); }
@media (min-width: 901px) { .strana-hero--dugi .strana-hero__red { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; } .strana-hero--dugi .naslov-1 { max-width: 22ch; } }
/* Jednoredni logo u zaglavlju (odnos 7,7 : 1) — širina određuje veličinu, visina uvijek auto da se ne izobliči. */
.zaglavlje__logo img { width: 250px !important; height: auto !important; }
@media (max-width: 1100px) { .zaglavlje__logo img { width: 210px !important; } }
@media (max-width: 760px) { .zaglavlje__logo img { width: 180px !important; } }
@media (max-width: 380px) { .zaglavlje__logo img { width: 158px !important; } }

/* ---------- Sa terena: petlje sa gradilišta (17.09.2026) ---------- */
.sa-terena__mreza { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.sa-terena__stavka { display: grid; gap: 10px; align-content: start; color: var(--navy); }
.sa-terena__okvir { display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--navy); }
.sa-terena__okvir video { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .9s var(--kriva); }
.sa-terena__stavka:hover video { transform: scale(1.05); }
.sa-terena__projekat { font-weight: 700; font-size: 15px; line-height: 1.3; justify-self: start; background: linear-gradient(var(--narandzasta), var(--narandzasta)) left 100% / 0 2px no-repeat; transition: background-size .5s var(--kriva-io); }
.sa-terena__stavka:hover .sa-terena__projekat { background-size: 100% 2px; }
.sa-terena__uloga { font-size: 14px; color: var(--tekst); }
@media (max-width: 1000px) { .sa-terena__mreza { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; } }
@media (max-width: 480px) { .sa-terena__mreza { gap: 20px 12px; } .sa-terena__uloga { font-size: 13px; } }

/* Petlja na stranici projekta */
.galerija__video { margin: 0 0 12px; aspect-ratio: 16 / 9; overflow: hidden; background: var(--navy); }
.galerija__video video { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Slika uz uslugu */
.usluga__slika { margin: 28px 0 22px; display: grid; gap: 10px; }
.usluga__slika img { width: 100%; object-fit: cover; background: var(--podloga-siva); }
.usluga__slika--siroko img { aspect-ratio: 16 / 9; }
.usluga__slika--uspravno img { aspect-ratio: 16 / 10; object-position: center 35%; }
.usluga__slika--dokument img { aspect-ratio: 16 / 10; object-fit: contain; background: #E8EBEE; }
.usluga__slika figcaption { font-size: 13px; color: var(--tekst); }
.usluga__slika figcaption a { color: var(--navy); font-weight: 700; background: linear-gradient(var(--narandzasta), var(--narandzasta)) left 100% / 0 2px no-repeat; transition: background-size .45s var(--kriva-io); }
.usluga__slika figcaption a:hover { background-size: 100% 2px; }
.usluga__slika.je-vidljivo img { animation: maskaSlike 1.1s var(--kriva-io) both; }
@media (prefers-reduced-motion: reduce) {
  .sa-terena__stavka:hover video { transform: none; }
  .usluga__slika.je-vidljivo img { animation: prelivanje .7s ease both; }
}
/* atribut height na img je jači od aspect-ratio — visina mora biti auto */
.usluga__slika img { height: auto; max-height: 520px; }
.usluga__slika--dokument { max-width: 720px; }

/* Drugi red glavnog naslova na početnoj — nosi oblasti i zemlju radi pretrage. */
.hero__naslov-pod { display: block; margin-top: 18px; max-width: 34ch; font-size: clamp(16px, 1.25vw, 19px); font-weight: 300; line-height: 1.45; letter-spacing: 0; color: #DCE3EB; }
@media (max-width: 760px) { .hero__naslov-pod { margin-top: 14px; font-size: 15px; max-width: none; } }
.hero__naslov-red { display: block; }
.hero-video .hero__naslov-pod { max-width: 46ch; font-size: clamp(16px, 1.3vw, 20px); color: #DCE3EB; }

/* ── O nama ─────────────────────────────────────────────────────────── */
.o-nama-uvod { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(40px, 6vw, 88px); align-items: center; }
.o-nama-uvod .naslov-2 { margin-bottom: 24px; }
.o-nama-uvod__foto { position: relative; display: block; overflow: hidden; background: var(--navy); }
.o-nama-uvod__foto img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; transition: transform .8s var(--kriva); }
.o-nama-uvod__foto:hover img { transform: scale(1.04); }
.o-nama-uvod__natpis { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 24px 20px; font-size: 14px; font-weight: 700; color: var(--bijela); background: linear-gradient(transparent, rgba(7, 24, 41, .82)); }
.sekcija--navy { background: var(--navy); color: var(--na-navy); }
.sekcija--navy .labela, .sekcija--navy .naslov-2 { color: var(--bijela); }
.o-nama-oblasti__lista { list-style: none; margin: 48px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid rgba(197, 207, 218, .3); }
.o-nama-oblasti__lista li { display: grid; gap: 14px; padding: 32px 32px 8px 0; }
.o-nama-oblasti__lista li + li { padding-left: 32px; border-left: 1px solid rgba(197, 207, 218, .3); }
.o-nama-oblasti__kratko { font-size: clamp(48px, 5.4vw, 80px); line-height: 1; font-weight: 700; letter-spacing: -.04em; color: var(--narandzasta); }
.o-nama-oblasti__naziv { font-size: 18px; color: var(--bijela); }
.o-nama-ovlascenja li { font-size: clamp(18px, 1.5vw, 22px); line-height: 1.4; }
.o-nama-brojke { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 24px; }
.o-nama-brojke .projektna-kota { margin-top: 0; }
.o-nama-oblasti-rada { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.o-nama-grupa__naslov { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 20px; font-weight: 700; color: var(--navy); padding-bottom: 16px; border-bottom: 2px solid var(--navy); margin: 0; }
.o-nama-grupa__naslov a { color: inherit; text-decoration: none; }
.o-nama-grupa__naslov a:hover { color: var(--narandzasta); }
.o-nama-grupa__naslov span { font-size: 14px; color: var(--tekst); }
.o-nama-grupa ul { list-style: none; margin: 0; padding: 0; }
.o-nama-grupa li a { display: block; padding: 14px 0; border-bottom: 1px solid var(--linija); color: var(--navy); text-decoration: none; transition: color var(--prelaz), padding var(--prelaz); }
.o-nama-grupa li a:hover { color: var(--narandzasta); padding-left: 6px; }
.o-nama-kraj { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(40px, 6vw, 88px); align-items: start; }
.o-nama-osoba { border-left: 2px solid var(--narandzasta); padding: 8px 0 8px 28px; }
.o-nama-osoba .naslov-3 { margin: 0 0 6px; color: var(--navy); }
.o-nama-osoba__zvanje { margin: 0 0 20px; }
.o-nama-osoba__veze { display: grid; gap: 10px; margin: 0; }
.o-nama-osoba__veze a { display: inline-flex; align-items: center; gap: 10px; color: var(--navy); font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.o-nama-osoba__veze a:hover { color: var(--narandzasta); }
.o-nama-logotipi { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (min-width: 1200px) { .o-nama-logotipi { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
@media (max-width: 1000px) {
  .o-nama-uvod, .o-nama-kraj { grid-template-columns: 1fr; }
  .o-nama-uvod__foto img { aspect-ratio: 16 / 10; }
  .o-nama-oblasti-rada { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .o-nama-oblasti__lista { grid-template-columns: 1fr; }
  .o-nama-oblasti__lista li, .o-nama-oblasti__lista li + li { padding: 24px 0; border-left: 0; border-bottom: 1px solid rgba(197, 207, 218, .3); }
  .o-nama-logotipi { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .o-nama-brojke { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; }
  .o-nama-brojke .projektna-kota { padding: 16px 0 16px 14px; }
  .o-nama-brojke .projektna-kota__broj { font-size: 44px; }
  .o-nama-brojke .projektna-kota__opis { font-size: 14px; }
}

/* ── Doradе po Teodorovim primjedbama (21.09) ───────────────────────── */
/* zaglavlje: stavke menija uz kontakt, bez linije ispod broja */
.meni { margin-inline: auto 0; }
.zaglavlje__red { gap: clamp(16px, 2vw, 32px); }
/* dugmad bez narandžaste linije sa strane */
.dugme--narandzasto, .dugme--narandzasto:hover, .dugme--narandzasto:focus-visible { box-shadow: none; }
/* uvodna sekcija: telefon bez linije ispod */
.hero__akcije .link-strelica { border-bottom: 0; padding-block: 12px;
  background: linear-gradient(var(--narandzasta), var(--narandzasta)) left bottom / 0 2px no-repeat; }
.hero__akcije .link-strelica:hover { background-size: 100% 2px; }
/* navy sekcija usluga: bijele linije na 30 % */
.pocetne-usluge .harmonika details { border-top-color: rgba(255, 255, 255, .3); }
.pocetne-usluge .harmonika details:last-child { border-bottom-color: rgba(255, 255, 255, .3); }
.pocetne-usluge .link-strelica { border-color: rgba(255, 255, 255, .3); }
.pocetne-usluge .link-strelica:hover { border-color: var(--narandzasta); }
/* sa terena: veći naziv projekta */
.sa-terena__projekat { font-size: 18px; }
/* zašto raditi sa nama: ikona umjesto broja, blijede linije */
.zasto__stavka { border-top-color: rgba(213, 218, 224, .7); }
.zasto__ikona { display: block; width: 34px; height: 34px; color: var(--narandzasta); margin-top: 2px; }
.sekcija--siva .zasto__stavka { border-top-color: rgba(13, 42, 75, .12); }
/* baner na kraju strane: fotografija sa terena ispod navy podloge */
.cta { position: relative; isolation: isolate; overflow: hidden; }
.cta__slika { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; opacity: .3; }
.cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, var(--navy) 22%, rgba(13, 42, 75, .72)); }
.pocetne-usluge .link-strelica { background-image: linear-gradient(var(--narandzasta), var(--narandzasta)), linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, .3)); }
.zasto__stavka::after { background: rgba(13, 42, 75, .18); }

/* --- Izmjene 12.10.2026: podusluge, prelaz među uslugama, logotipi, O nama --- */
.podusluga { margin: 0 0 32px; max-width: 75ch; }
.podusluga__naslov { display: flex; align-items: baseline; gap: 14px; font-size: clamp(19px, 1.6vw, 23px); line-height: 1.3; letter-spacing: -.01em; color: var(--navy); margin-bottom: 10px; }
.podusluga__oznaka { flex: none; padding: 3px 9px; background: var(--narandzasta); color: var(--navy); font-size: 12px; font-weight: 700; letter-spacing: .06em; border-radius: 2px; }
.podusluga p { margin-bottom: 14px; }
.podusluga .usluga__stavke { margin-bottom: 0; }
.usluge-most { margin: 8px 0 0; padding: 32px 0 8px; border-top: 1px solid var(--navy); }
.usluge-most .labela { margin-bottom: 10px; }
.usluge-most .naslov-3 { margin-bottom: 8px; }
/* 30 logotipa: 10 kolona = tri puna reda na širokom ekranu. */
@media (min-width: 1200px) { .logotipi--red { grid-template-columns: repeat(10, 1fr); } }
.o-nama-uvod__tekst .uvod + .uvod { margin-top: 18px; }
.o-nama-uvod__tekst .uvod ~ .link-strelica { margin-top: 26px; display: inline-flex; }
/* 320 px: zaglavlje je bilo 22 px preširoko — logo i razmaci se smanje. */
@media (max-width: 360px) { .zaglavlje__red { gap: 8px; } .zaglavlje__akcije { gap: 6px; } .zaglavlje__logo { min-width: 0; } .zaglavlje__logo img { width: 112px !important; height: auto; } }
/* ===== O nama — raspored za desktop (17.10.2026). Samo ≥1100 px; telefon i tablet ostaju kako jesu. ===== */
@media (min-width: 1100px) {
  /* Ko smo: tekst lijevo, fotografija desno sa narandžastim okvirom pomaknutim iza nje */
  .o-nama-uvod { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center; gap: clamp(64px, 7vw, 120px); padding-block: 8px; }
  .o-nama-uvod__tekst { max-width: 62ch; }
  .o-nama-uvod .naslov-2 { margin-bottom: 28px; }
  .o-nama-uvod__tekst .uvod { font-size: 18px; line-height: 1.62; }
  .o-nama-uvod__foto { isolation: isolate; overflow: visible; background: transparent; }
  .o-nama-uvod__foto::before { content: ""; position: absolute; z-index: -1; inset: 28px -28px -28px 28px; border: 2px solid var(--narandzasta); }
  .o-nama-uvod__foto img { aspect-ratio: 4 / 5; max-height: 600px; width: 100%; background: var(--navy); }
  .o-nama-uvod__natpis { background: linear-gradient(transparent, rgba(7, 24, 41, .86)); }

  /* Ovlašćenja: naslov lijevo, tri reda sa velikim narandžastim brojem */
  .o-nama-ovl-sekcija { padding-block: clamp(72px, 6vw, 96px); }
  .o-nama-ovlascenja { border-top: 2px solid var(--navy); }
  .o-nama-ovlascenja li { grid-template-columns: 56px 1fr; align-items: baseline; padding-block: 28px; }
  .o-nama-ovlascenja .uloga__br { font-size: 20px; font-weight: 700; color: var(--narandzasta); }

  /* Brojke: naslov lijevo, tri velike brojke u redu desno */
  .o-nama-brojke-omot { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(48px, 6vw, 96px); align-items: center; }
  .o-nama-brojke-omot .glava-sekcije { margin: 0; }
  .o-nama-brojke-omot .glava-sekcije .naslov-2 { max-width: 14ch; }
  .o-nama-brojke { gap: 0; background: var(--bijela); border-top: 2px solid var(--narandzasta); }
  .o-nama-brojke .projektna-kota { border-left: 0; padding: 36px 28px 40px; gap: 14px; }
  .o-nama-brojke .projektna-kota + .projektna-kota { border-left: 1px solid var(--linija); }
  .o-nama-brojke .projektna-kota::before, .o-nama-brojke .projektna-kota::after { display: none; }
  .o-nama-brojke .projektna-kota__broj { font-size: clamp(64px, 6vw, 96px); color: var(--navy); }
  .o-nama-brojke .projektna-kota__opis { font-size: 15px; max-width: 18ch; color: var(--tekst); }

  /* Kako radimo: koraci u redu (3 ili 4 kolone prema broju koraka), sa velikim rednim brojem */
  .o-nama-kako-sekcija .labela { margin-bottom: 36px; }
  .zasto--kolone { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 24px; counter-reset: korak; }
  .zasto--kolone .zasto__stavka { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 36px 30px 40px; background: var(--podloga-siva); border-top: 2px solid var(--navy); counter-increment: korak; position: relative; }
  .zasto--kolone .zasto__stavka::after { display: none; }
  .zasto--kolone .zasto__stavka::before { content: "0" counter(korak); position: absolute; top: 28px; right: 30px; font-size: 44px; line-height: 1; font-weight: 700; letter-spacing: -.04em; color: rgba(13, 42, 75, .14); }
  .zasto--kolone .zasto__ikona { width: 38px; height: 38px; margin-bottom: 18px; }
  .zasto--kolone h3 { font-size: 24px; max-width: none; }
  .zasto--kolone p { font-size: 16px; line-height: 1.6; max-width: none; }
}