/* ============================================================
   Агенција за квалификације — јавни сајт
   Модеран, приступачан (WCAG 2.1 AA), mobile-first, без библиотека.
   ============================================================ */

:root {
    /* нова палета: дубока плава + златни акценат */
    --plava: #103c62;
    --plava-svetla: #1b5a8e;
    --plava-tamna: #0a2a46;
    --zlatna: #c9971c;
    --zlatna-tamna: #a67a10;
    --crvena: #c0392b;
    --zelena: #1e7a46;
    --pozadina: #ffffff;
    --pozadina-siva: #f4f6f9;
    --tekst: #182430;
    --tekst-bledi: #4c5a68;
    --ivica: #dfe5ec;
    --radius: 12px;
    --senka: 0 2px 8px rgba(10, 42, 70, .08), 0 8px 32px rgba(10, 42, 70, .07);
    --prelaz: .22s ease;
    --okvir-sirina: 1200px;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

html { overflow-x: hidden; }
body {
    margin: 0;
    font-family: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
    font-size: clamp(15px, 1vw + 10px, 17px);
    line-height: 1.65;
    color: var(--tekst);
    background: var(--pozadina);
    overflow-x: hidden;   /* заштита од хоризонталног прелива на мобилном */
    max-width: 100%;
}

img { max-width: 100%; height: auto; }

a { color: var(--plava-svetla); }
a:hover { color: var(--plava-tamna); }

h1, h2, h3, h4 { line-height: 1.25; color: var(--plava-tamna); }
h1 { font-size: clamp(26px, 3vw, 38px); }
h2 { font-size: clamp(21px, 2.2vw, 28px); }

:focus-visible {
    outline: 3px solid var(--zlatna);
    outline-offset: 2px;
    border-radius: 2px;
}

/* садржај преко пуне ширине екрана, са флуидним бочним размаком */
.okvir { width: 100%; margin: 0 auto; padding: 0 clamp(20px, 4vw, 72px); }

.sr-only {
    position: absolute; width: 1px; height: 1px;
    padding: 0; margin: -1px; overflow: hidden;
    clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* лебдећа админ трака (за пријављеног уредника) */
.admin-traka {
    position: fixed; right: 20px; bottom: 20px; z-index: 250;
    display: flex; align-items: stretch; gap: 1px;
    border-radius: 12px; overflow: hidden;
    box-shadow: 0 8px 26px rgba(10, 42, 70, .28);
    font-size: 14px; font-weight: 600;
}
.admin-traka a { display: flex; align-items: center; gap: 9px; padding: 11px 15px; text-decoration: none; color: #14213a; }
.admin-traka svg { width: 18px; height: 18px; flex: none; }
.admin-traka-glavno { background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna)); font-weight: 700; }
.admin-traka-glavno:hover { background: linear-gradient(135deg, #e0ad2e, var(--zlatna)); color: #14213a; }
.admin-traka-tabla { background: var(--zlatna-tamna); padding: 11px 13px; }
.admin-traka-tabla:hover { background: #8a650d; color: #fff; }
.admin-traka-odjava { background: var(--zlatna-tamna); padding: 11px 13px; }
.admin-traka-odjava:hover { background: var(--crvena); color: #fff; }
.admin-traka-x { background: var(--zlatna-tamna); padding: 11px 12px; opacity: .85; }
.admin-traka-x:hover { background: var(--crvena); opacity: 1; color: #fff; }
@media (max-width: 600px) {
    .admin-traka { right: 12px; bottom: 12px; }
    .admin-traka-glavno span { display: none; }
}
@media print { .admin-traka { display: none !important; } }

/* ---------- сагласност за колачиће ---------- */
.kolacici-banner {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 260;
    background: #fff; border-top: 3px solid var(--zlatna);
    box-shadow: 0 -6px 30px rgba(10, 42, 70, .2);
    padding: 18px 0;
    animation: kolacic-ulaz .4s ease;
}
@keyframes kolacic-ulaz { from { transform: translateY(100%); } to { transform: none; } }
.kolacici-banner-red { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.kolacici-tekst { flex: 1; min-width: 260px; }
.kolacici-tekst strong { display: block; color: var(--plava-tamna); font-size: 16px; margin-bottom: 4px; }
.kolacici-tekst p { margin: 0; color: var(--tekst-bledi); font-size: 14px; line-height: 1.55; }
.kolacici-tekst a { color: var(--plava-svetla); font-weight: 600; }
.kolacici-dugmad { display: flex; gap: 10px; flex-wrap: wrap; }

.kolacic-dugme {
    font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
    padding: 10px 20px; border-radius: 8px; border: 1.5px solid var(--ivica);
    background: #fff; color: var(--plava-tamna); white-space: nowrap;
    transition: background var(--prelaz), border-color var(--prelaz), color var(--prelaz);
}
.kolacic-dugme:hover { border-color: var(--plava-svetla); }
.kolacic-prihvati, .kolacic-sacuvaj {
    background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna));
    border-color: transparent; color: #14213a;
}
.kolacic-prihvati:hover, .kolacic-sacuvaj:hover { background: linear-gradient(135deg, #e0ad2e, var(--zlatna)); color: #14213a; }

/* модал са подешавањима */
.kolacici-modal {
    position: fixed; inset: 0; z-index: 270;
    background: rgba(8, 18, 30, .55);
    display: flex; align-items: center; justify-content: center; padding: 20px;
}
.kolacici-modal[hidden] { display: none; }
.kolacici-modal-kutija {
    position: relative; background: #fff; border-radius: 16px;
    max-width: 560px; width: 100%; max-height: 90vh; overflow-y: auto;
    padding: clamp(24px, 4vw, 36px); box-shadow: 0 20px 60px rgba(0,0,0,.4);
}
.kolacici-modal-x {
    position: absolute; top: 16px; right: 16px; width: 34px; height: 34px;
    border: 0; border-radius: 50%; background: var(--pozadina-siva); color: var(--tekst-bledi);
    font-size: 15px; cursor: pointer;
}
.kolacici-modal-x:hover { background: var(--crvena); color: #fff; }
.kolacici-modal-kutija h2 { margin: 0 0 6px; color: var(--plava-tamna); }
.kolacici-modal-uvod { margin: 0 0 20px; color: var(--tekst-bledi); font-size: 14.5px; }

.kolacic-kat { border: 1px solid var(--ivica); border-radius: 12px; padding: 16px 18px; margin-bottom: 14px; }
.kolacic-kat-vrh { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.kolacic-kat-naslov { font-weight: 700; color: var(--plava-tamna); }
.kolacic-kat p { margin: 0; color: var(--tekst-bledi); font-size: 13.5px; line-height: 1.5; }
.kolacic-uvek { font-size: 12px; font-weight: 700; color: var(--akcenat); text-transform: uppercase; letter-spacing: .04em; }

/* прекидач (toggle) */
.kolacic-prekidac { position: relative; display: inline-block; width: 46px; height: 26px; flex: none; }
.kolacic-prekidac input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.kolacic-klizac {
    position: absolute; inset: 0; border-radius: 99px; background: #cbd3dd; transition: background var(--prelaz);
}
.kolacic-klizac::before {
    content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px;
    background: #fff; border-radius: 50%; transition: transform var(--prelaz); box-shadow: 0 1px 3px rgba(0,0,0,.3);
}
.kolacic-prekidac input:checked + .kolacic-klizac { background: var(--akcenat); }
.kolacic-prekidac input:checked + .kolacic-klizac::before { transform: translateX(20px); }
.kolacic-prekidac input:focus-visible + .kolacic-klizac { outline: 2px solid var(--zlatna); outline-offset: 2px; }

.kolacici-modal-akcije { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.kolacici-modal-akcije .kolacic-dugme { flex: 1; text-align: center; }

/* мини линкови у подножју */
.podnozje-mini-link {
    background: none; border: 0; padding: 0; margin-left: 14px;
    color: #cfdcea; font: inherit; font-size: 13px; cursor: pointer; text-decoration: underline;
}
.podnozje-mini-link:hover { color: #fff; }

@media (max-width: 640px) {
    .kolacici-dugmad { width: 100%; }
    .kolacici-dugmad .kolacic-dugme { flex: 1; text-align: center; }
}

/* трака при прегледу из администрације */
.pregled-traka {
    position: sticky; top: 0; z-index: 300;
    background: linear-gradient(90deg, var(--zlatna), var(--zlatna-tamna));
    color: #14213a; font-size: 13.5px; font-weight: 600;
    padding: 9px clamp(20px, 4vw, 72px);
    box-shadow: 0 2px 10px rgba(0,0,0,.18);
}
.pregled-traka strong { letter-spacing: .08em; }
/* објављена страница у прегледу — зелена трака уместо златне */
.pregled-traka.pregled-objavljeno {
    background: linear-gradient(90deg, #1e7a46, #14663a); color: #eafaf0;
}
.je-pregled .zaglavlje { top: 38px; }

.preskoci {
    position: absolute; left: -9999px; top: 0;
    background: var(--plava-tamna); color: #fff;
    padding: 10px 18px; z-index: 200; border-radius: 0 0 8px 0;
}
.preskoci:focus { left: 0; color: #fff; }

/* ---------- горња трака ---------- */

.traka-vrh {
    position: relative;
    background: linear-gradient(90deg, var(--plava-tamna) 0%, #144361 52%, var(--plava-tamna) 100%);
    color: #cfdcea; font-size: 13.5px;
}
.traka-vrh::after {                       /* танка златна нит испод траке */
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
    background: linear-gradient(90deg, transparent, rgba(201,151,28,.75) 22%, rgba(201,151,28,.75) 78%, transparent);
}
.traka-vrh-red { display: flex; justify-content: space-between; align-items: center; min-height: 52px; gap: 12px; flex-wrap: wrap; padding-block: 6px; }

/* контакти — истакнути, са златним иконицама */
.traka-kontakt { display: flex; gap: 12px; flex-wrap: wrap; }
.traka-kontakt span, .traka-kontakt a {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 5px 16px 5px 5px;
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .11);
    border-radius: 99px;
    font-size: 14.5px; font-weight: 600; letter-spacing: .01em;
    color: #eaf1f8; text-decoration: none;
    transition: background var(--prelaz), border-color var(--prelaz), color var(--prelaz);
}
.traka-kontakt svg {
    width: 30px; height: 30px; padding: 7px; flex: none;
    background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna));
    color: #16273d; border-radius: 50%;
    box-shadow: 0 2px 8px rgba(201, 151, 28, .35);
}
.traka-kontakt a:hover {
    background: rgba(255, 255, 255, .14);
    border-color: rgba(201, 151, 28, .55);
    color: #fff;
}

.traka-jezici {
    display: flex; gap: 3px; padding: 3px;
    background: rgba(255,255,255,.09);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 99px;
}
.traka-jezici a {
    color: #cfdcea; text-decoration: none;
    padding: 4px 14px; border-radius: 99px;
    font-size: 12.5px; font-weight: 600; letter-spacing: .02em;
    transition: background var(--prelaz), color var(--prelaz);
}
.traka-jezici a:hover { background: rgba(255,255,255,.14); color: #fff; }
.traka-jezici a.aktivan {
    background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna));
    color: #14213a; font-weight: 800;
    box-shadow: 0 2px 8px rgba(201,151,28,.35);
}

/* ---------- заглавље и мени ---------- */

.zaglavlje {
    background: rgba(255, 255, 255, .97);
    backdrop-filter: saturate(180%) blur(10px);
    border-bottom: 1px solid var(--ivica);
    position: sticky; top: 0; z-index: 100;
    box-shadow: 0 1px 4px rgba(10, 42, 70, .06);
    transition: box-shadow .3s ease;
}
.zaglavlje.skupljeno { box-shadow: 0 6px 24px rgba(10, 42, 70, .13); }
.zaglavlje-red {
    display: flex; align-items: center; justify-content: space-between; gap: 18px;
    min-height: 86px; transition: min-height .3s ease;
}
.zaglavlje.skupljeno .zaglavlje-red { min-height: 66px; }

.logo { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.logo img { height: 58px; width: auto; transition: height .3s ease; }
.zaglavlje.skupljeno .logo img { height: 46px; }
.logo-tekst {
    display: grid; place-items: center; width: 52px; height: 52px;
    background: var(--plava); color: #fff; font-weight: 800; font-size: 19px; border-radius: 10px;
}
.logo-naziv {
    position: relative; padding-left: 16px;
    font-weight: 800; color: var(--plava-tamna); font-size: 17.5px; line-height: 1.22;
    max-width: 250px; letter-spacing: -.01em;
}
.logo-naziv::before {                     /* златна вертикална нит уз назив */
    content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
    width: 3px; height: 38px; border-radius: 3px;
    background: linear-gradient(180deg, var(--zlatna), rgba(201,151,28,.15));
}

/* ставке иду целом висином заглавља — падајући мени тако креће тачно испод њега */
.nav { align-self: stretch; display: flex; }
.nav-lista { list-style: none; margin: 0; padding: 0; display: flex; align-items: stretch; gap: 2px; }
.nav-stavka { position: relative; display: flex; }
.nav-stavka > a {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 0 15px; text-decoration: none;
    color: var(--tekst); font-weight: 600; font-size: 15px;
    transition: color var(--prelaz), background var(--prelaz);
}
.nav-stavka > a::after {                  /* златна линија расте из средине */
    content: ""; position: absolute; left: 50%; right: 50%; bottom: 0; height: 3px;
    background: linear-gradient(90deg, var(--zlatna), var(--zlatna-tamna));
    border-radius: 3px;
    transition: left .28s ease, right .28s ease;
}
.nav-stavka:hover > a, .nav-stavka:focus-within > a { color: var(--plava-tamna); background: rgba(16,60,98,.05); }
.nav-stavka:hover > a::after, .nav-stavka:focus-within > a::after { left: 15px; right: 15px; }
.nav-strelica {
    width: 10px; height: 7px; flex: none; opacity: .5;
    transition: transform .28s ease, opacity .28s ease;
}
.nav-stavka:hover > a .nav-strelica, .nav-stavka:focus-within > a .nav-strelica {
    transform: rotate(180deg); opacity: 1;
}

.nav-pretraga { align-items: center; }
.nav-pretraga > a {
    width: 40px; height: 40px; padding: 0; margin-left: 10px;
    border-radius: 50%; justify-content: center;
    background: var(--pozadina-siva); color: var(--plava);
    transition: background var(--prelaz), color var(--prelaz), transform var(--prelaz);
}
.nav-pretraga > a::after { content: none; }
.nav-stavka.nav-pretraga:hover > a { background: var(--plava); color: #fff; transform: scale(1.06); }

.pod-meni {
    list-style: none; margin: 0; padding: 10px 0;
    position: absolute; top: 100%; left: 0; min-width: 268px;
    background: #fff; border: 0; border-top: 3px solid var(--zlatna);
    border-radius: 0 0 14px 14px;
    /* БЕЗ overflow:hidden — иначе се трећи ниво (лево/десно) одсеца */
    box-shadow: 0 14px 36px rgba(10, 42, 70, .17);
    opacity: 0; visibility: hidden; transform: translateY(8px);
    transition: opacity var(--prelaz), transform var(--prelaz), visibility var(--prelaz);
    z-index: 90;
}
.nav-stavka:hover > .pod-meni,
.nav-stavka:focus-within > .pod-meni,
.pod-meni li:hover > .pod-meni,
.pod-meni li:focus-within > .pod-meni {
    opacity: 1; visibility: visible; transform: translateY(0);
}
.pod-meni li { position: relative; }
.pod-meni a {
    position: relative; display: block;
    padding: 10px 20px; text-decoration: none;
    color: var(--tekst); font-size: 14.5px;
    transition: background var(--prelaz), color var(--prelaz), padding-left var(--prelaz);
}
.pod-meni a::before {                     /* златна црта уз ставку на ховер */
    content: ""; position: absolute; left: 0; top: 7px; bottom: 7px; width: 3px;
    background: var(--zlatna); border-radius: 0 3px 3px 0;
    transform: scaleY(0); transform-origin: center;
    transition: transform .24s ease;
}
.pod-meni a:hover { background: #f5f8fc; color: var(--plava-tamna); padding-left: 25px; }
.pod-meni a:hover::before { transform: scaleY(1); }

/* иконице сектора уз ставке секторских већа у менију */
.pod-meni .meni-sa-ikonom > a { display: flex; align-items: center; gap: 11px; }
.meni-ikona-sektora {
    width: 19px; height: 19px; flex: 0 0 19px;
    color: var(--zlatna-tamna); transition: color var(--prelaz), transform var(--prelaz);
}
.pod-meni .meni-sa-ikonom > a:hover .meni-ikona-sektora { color: var(--plava-svetla); transform: scale(1.08); }
.pod-meni .ima-pod > a::after { content: " ▸"; float: right; color: var(--tekst-bledi); }
.pod-meni-desno { top: -10px; left: 100%; border-radius: 14px; border-top-width: 3px; }
.pod-projekat a { padding-left: 34px; font-size: 13.5px; }

@media (min-width: 1021px) {
    /* дугачки називи се преламају у више редова уместо да сужавају мени */
    .pod-meni a { white-space: normal; line-height: 1.35; }

    /* мени са много ставки (нпр. секторска већа) иде у две колоне */
    .pod-meni:has(> li:nth-child(9)) {
        display: grid; grid-template-columns: repeat(2, minmax(270px, 1fr));
        width: max-content; max-width: min(760px, calc(100vw - 32px));
        column-gap: 4px;
    }

    /* ако мени нема свој подмени, сме да се скролује кад је виши од екрана */
    .pod-meni:not(:has(.pod-meni)) {
        max-height: calc(100vh - 130px);
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    /* аутоматско окретање кад би мени изашао ван десне ивице екрана (класу додаје JS) */
    .pod-meni.pod-meni-levo { left: auto; right: 0; }
    .pod-meni-desno.pod-meni-levo { left: auto; right: 100%; }
}

.meni-dugme { display: none; background: none; border: 0; cursor: pointer; padding: 10px; }
.meni-crta { display: block; width: 26px; height: 3px; background: var(--plava-tamna); margin: 5px 0; border-radius: 2px; transition: transform var(--prelaz), opacity var(--prelaz); }
.meni-dugme[aria-expanded="true"] .meni-crta:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.meni-dugme[aria-expanded="true"] .meni-crta:nth-child(2) { opacity: 0; }
.meni-dugme[aria-expanded="true"] .meni-crta:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* група (језици + хамбургер) — видљива само на мобилном; на десктопу празна/невидљива */
.zaglavlje-alat { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.jezici-mobilni { display: none; }
/* слајд приказан као box — само на мобилном (специфичније од .box да не искочи на десктопу) */
.box.box-slajd-mobilni { display: none; }
/* слика за дељење (мобилни хероб) — само на мобилном */
.hero-mobilni { display: none; }
/* дугме за затварање менија — само на мобилном */
.nav-zatvori { display: none; }

/* ---------- слајдер (добро сложен) ---------- */

.slajder {
    position: relative; overflow: hidden;
    /* дискретан градијент попуњава празнину ако је слика ужа од слајдера */
    background:
        radial-gradient(120% 140% at 50% 0%, rgba(43,92,143,.55), transparent 60%),
        linear-gradient(180deg, var(--plava-tamna), #0a2035 55%, var(--plava-tamna));
}
.slajder-traka { display: flex; transition: transform .5s ease; }
/* однос 1920×600 као изворне слике — слике се НЕ одсецају */
.slajd { position: relative; flex: 0 0 100%; aspect-ratio: 1920 / 600; min-height: 260px; }
.slajd img.slajd-slika {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: contain;   /* цела слика видљива; ужа се центрира, празнина иде на градијент */
    object-position: center;
}
/* тамни прелаз само кад слајд има свој текст (читљивост) */
.slajd:has(.slajd-tekst)::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(90deg, rgba(10,42,70,.72) 0%, rgba(10,42,70,.4) 45%, rgba(10,42,70,.05) 75%);
}
/* слајд само са дугметом: дугме прати положај (text-align се задаје у HTML-у) */
.slajd-dugme-red {
    position: absolute; left: 0; right: 0; z-index: 4; text-align: center;
    padding: 0 clamp(20px, 4vw, 72px);
}
.slajd-tekst {
    position: absolute; inset: 0; z-index: 2;
    width: 100%; margin: 0 auto; padding: 0 clamp(20px, 4vw, 72px);
    display: flex; flex-direction: column; justify-content: center;
}
.slajd-tekst-kutija { max-width: 840px; display: flex; flex-direction: column; }
/* положај текста на слајду: лево / центар / десно — прате и наслов, и поднаслов, и дугме */
.slajd-poravnanje-levo   { align-items: flex-start; text-align: left; }
.slajd-poravnanje-centar { align-items: center;     text-align: center; }
.slajd-poravnanje-desno  { align-items: flex-end;   text-align: right; }
.slajd-poravnanje-levo   .slajd-tekst-kutija { align-items: flex-start; }
.slajd-poravnanje-centar .slajd-tekst-kutija { align-items: center; }
.slajd-poravnanje-desno  .slajd-tekst-kutija { align-items: flex-end; }
/* прекривач прати поравнање да текст увек има довољан контраст */
.slajd:has(.slajd-poravnanje-centar)::after {
    background: linear-gradient(90deg, rgba(10,42,70,.15) 0%, rgba(10,42,70,.55) 50%, rgba(10,42,70,.15) 100%);
}
.slajd:has(.slajd-poravnanje-desno)::after {
    background: linear-gradient(270deg, rgba(10,42,70,.72) 0%, rgba(10,42,70,.4) 45%, rgba(10,42,70,.05) 75%);
}
.slajd-naslov {
    color: #fff; font-size: clamp(34px, 4.8vw, 62px); line-height: 1.08;
    margin: 0 0 18px; text-wrap: balance; text-shadow: 0 2px 12px rgba(0,0,0,.35);
}
.slajd-podnaslov { color: #e8eef5; font-size: clamp(21px, 2.1vw, 27px); margin: 0 0 28px; }
.slajd-dugme {
    display: inline-block; background: var(--zlatna); color: #14213a;
    font-weight: 700; text-decoration: none; padding: 15px 36px; border-radius: 10px;
    font-size: clamp(13px, 1.4vw, 21px);
    transition: background var(--prelaz);
}
.slajd-dugme:hover { background: #e0ad2e; color: #14213a; }

/* дискретан зум/пан слике активног слајда (Ken Burns) */
.slajd-aktivan img.slajd-slika { animation: slajd-zum 7s ease-out both; }
@keyframes slajd-zum {
    from { transform: scale(1); }
    to   { transform: scale(1.06) translate(-0.8%, -0.6%); }
}
/* дискретан улазак наслова, поднаслова и дугмета (само кад JS ради) */
.slajder-anim .slajd-naslov,
.slajder-anim .slajd-podnaslov,
.slajder-anim .slajd-dugme { opacity: 0; }
.slajder-anim .slajd-aktivan .slajd-naslov    { animation: slajd-ulaz .7s ease-out .15s both; }
.slajder-anim .slajd-aktivan .slajd-podnaslov { animation: slajd-ulaz .7s ease-out .30s both; }
.slajder-anim .slajd-aktivan .slajd-dugme     { animation: slajd-ulaz .7s ease-out .45s both; }
@keyframes slajd-ulaz {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    .slajd-aktivan img.slajd-slika { animation: none; }
    .slajder-anim .slajd-naslov,
    .slajder-anim .slajd-podnaslov,
    .slajder-anim .slajd-dugme { opacity: 1; animation: none; }
}
.slajd-cela-povrsina { position: absolute; inset: 0; z-index: 3; }

.slajder-kontrole {
    position: absolute; left: 0; right: 0; bottom: 18px; z-index: 5;
    display: flex; justify-content: center; align-items: center; gap: 10px;
}
.slajder-tacka {
    width: 12px; height: 12px; border-radius: 50%; border: 2px solid #fff;
    background: transparent; cursor: pointer; padding: 0;
}
.slajder-tacka[aria-current="true"] { background: var(--zlatna); border-color: var(--zlatna); }
.slajder-strelica, .slajder-pauza {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
    background: rgba(255,255,255,.14); color: #fff; border: 0; cursor: pointer;
    width: 44px; height: 44px; border-radius: 50%; font-size: 19px;
    display: grid; place-items: center;
    transition: background var(--prelaz);
    backdrop-filter: blur(4px);
}
.slajder-strelica:hover, .slajder-pauza:hover { background: rgba(255,255,255,.3); }
.slajder-levo { left: 16px; }
.slajder-desno { right: 16px; }
.slajder-pauza { top: auto; bottom: 12px; right: 16px; transform: none; width: 36px; height: 36px; font-size: 14px; }

/* ---------- секције почетне ---------- */

.sekcija { padding: clamp(36px, 6vw, 72px) 0; }
.sekcija-siva { background: var(--pozadina-siva); }
.sekcija-naslov { text-align: center; margin: 0 0 8px; }
.sekcija-uvod { text-align: center; color: var(--tekst-bledi); max-width: 640px; margin: 0 auto 36px; }
.sekcija-naslov::after {
    content: ""; display: block; width: 64px; height: 4px;
    background: var(--zlatna); margin: 14px auto 0; border-radius: 2px;
}

.boxovi { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 30px; }
.box {
    position: relative; border-radius: 20px; overflow: hidden;
    min-height: 400px; display: flex; align-items: flex-end;
    text-decoration: none; box-shadow: var(--senka);
    isolation: isolate;
    /* фолбек позадина кад бокс нема слику (нпр. бокс-тастери у садржају) */
    background: linear-gradient(135deg, var(--plava) 0%, var(--plava-tamna) 100%);
    transition: transform .32s ease, box-shadow .32s ease;
}
.box img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .55s ease; }
.box::after {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background:
        linear-gradient(0deg, rgba(8,32,54,.95) 0%, rgba(9,36,60,.72) 38%, rgba(10,42,70,.18) 72%, rgba(10,42,70,.05) 100%);
    transition: background .3s ease;
}
.box::before {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px; z-index: 1;
    background: linear-gradient(90deg, var(--zlatna), var(--zlatna-tamna));
    transform: scaleX(0); transform-origin: left;
    transition: transform .35s ease;
}
.box:hover { transform: translateY(-7px); box-shadow: 0 14px 30px rgba(10,42,70,.2), 0 30px 68px rgba(10,42,70,.16); }
.box:hover img { transform: scale(1.07); }
.box:hover::after { background: linear-gradient(0deg, rgba(8,32,54,.97) 0%, rgba(9,36,60,.8) 42%, rgba(10,42,70,.24) 76%, rgba(10,42,70,.06) 100%); }
.box:hover::before { transform: scaleX(1); }

.box-telo { padding: clamp(26px, 2.6vw, 34px); width: 100%; }
.box-crta {
    display: block; width: 54px; height: 4px; border-radius: 3px;
    background: linear-gradient(90deg, var(--zlatna), var(--zlatna-tamna));
    margin-bottom: 18px;
    transition: width .35s ease;
}
.box:hover .box-crta { width: 92px; }
.box-naslov {
    display: block; color: #fff;
    font-size: clamp(21px, 1.9vw, 26px); line-height: 1.3; font-weight: 700;
    margin: 0 0 10px; text-wrap: balance;
    text-shadow: 0 2px 12px rgba(0,0,0,.35);
}
.box-opis {
    display: block; color: #dde7f1;
    font-size: 15.5px; line-height: 1.62; margin: 0 0 16px;
}
.box-strelica {
    display: inline-flex; align-items: center; gap: 9px;
    color: var(--zlatna); font-weight: 700; font-size: 15px;
    opacity: .75; transform: translateX(-4px);
    transition: opacity .3s ease, transform .3s ease;
}
.box:hover .box-strelica { opacity: 1; transform: none; }

.kartice-vesti { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }
/* на широким екранима тачно 4 вести у реду (почетна: 2 реда по 4) */
@media (min-width: 1200px) {
    .kartice-vesti { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---------- херо вести: наслов лево, претрага десно ---------- */
.vesti-hero-okvir { display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.vesti-hero-tekst { min-width: 0; }
.vesti-pretraga {
    display: flex; align-items: center; gap: 8px;
    background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 999px; padding: 6px 6px 6px 16px; backdrop-filter: blur(4px);
    width: min(420px, 100%); transition: border-color var(--prelaz), background var(--prelaz);
}
.vesti-pretraga:focus-within { background: rgba(255, 255, 255, .18); border-color: var(--zlatna); }
.vesti-pretraga-ikona { display: flex; color: #cde0f0; }
.vesti-pretraga-ikona svg { width: 20px; height: 20px; }
.vesti-pretraga input {
    flex: 1; min-width: 0; background: transparent; border: 0; outline: none;
    color: #fff; font-size: 15px; padding: 8px 0;
}
.vesti-pretraga input::placeholder { color: #c3d4e4; }
.vesti-pretraga input::-webkit-search-cancel-button { filter: invert(1) opacity(.6); }
.vesti-pretraga button {
    flex: 0 0 auto; border: 0; cursor: pointer; border-radius: 999px;
    background: var(--zlatna); color: #14213a; font-weight: 700; font-size: 14px;
    padding: 10px 20px; transition: background var(--prelaz);
}
.vesti-pretraga button:hover { background: #e0ad2e; }
@media (max-width: 640px) { .vesti-pretraga { width: 100%; } }

.vesti-rezultat { margin: 0 0 22px; color: var(--tekst); font-size: 15px; }
.vesti-rezultat b { color: var(--plava-tamna); }
.vesti-ocisti { margin-left: 10px; font-weight: 600; white-space: nowrap; }

/* ---------- лениво учитавање ---------- */
.vesti-jos { display: flex; flex-direction: column; align-items: center; gap: 14px; margin: 38px 0 0; min-height: 20px; }
.vesti-jos-dugme {
    border: 1px solid var(--ivica); background: #fff; color: var(--plava-tamna);
    font-weight: 700; font-size: 15px; padding: 12px 30px; border-radius: 999px; cursor: pointer;
    transition: border-color var(--prelaz), background var(--prelaz);
}
.vesti-jos-dugme:hover { border-color: var(--plava-svetla); background: #f5f8fc; }
.vesti-spinner {
    display: none; width: 30px; height: 30px; border-radius: 50%;
    border: 3px solid var(--ivica); border-top-color: var(--zlatna);
    animation: vesti-vrti .8s linear infinite;
}
.vesti-jos.ucitava .vesti-spinner { display: block; }
.vesti-jos.ucitava .vesti-jos-dugme { display: none; }
@keyframes vesti-vrti { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .vesti-spinner { animation: none; } }
.kartica-vest {
    background: #fff; border: 1px solid var(--ivica); border-radius: 14px;
    overflow: hidden; box-shadow: var(--senka); display: flex; flex-direction: column;
    transition: transform var(--prelaz), box-shadow var(--prelaz);
}
.kartica-vest:hover { transform: translateY(-5px); box-shadow: 0 8px 18px rgba(10,42,70,.13), 0 20px 52px rgba(10,42,70,.12); }
.kartica-vest-slika { display: block; overflow: hidden; }
.kartica-vest-slika img, .kartica-vest > a > img { width: 100%; aspect-ratio: 16/9; object-fit: cover; transition: transform .5s ease; }
.kartica-vest:hover .kartica-vest-slika img { transform: scale(1.06); }
.kartica-vest-telo { padding: 18px 20px 16px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.kartica-vest-naslov { margin: 0; font-size: 17px; line-height: 1.4; }
.kartica-vest-naslov a { color: var(--plava-tamna); text-decoration: none; }
.kartica-vest-naslov a:hover { color: var(--plava-svetla); }
.kartica-vest-opis { color: var(--tekst-bledi); font-size: 14.5px; margin: 0; line-height: 1.55; }

/* датум лево, локација десно — увек у једном реду (без преламања) */
.kartica-vest-dno {
    margin-top: auto; padding-top: 14px; border-top: 1px solid var(--ivica);
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; flex-wrap: nowrap;
}
.kv-meta { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; color: var(--tekst-bledi); min-width: 0; }
.kv-meta svg { width: 15px; height: 15px; flex: none; }
.kv-meta > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kv-datum { flex: none; color: var(--zlatna-tamna); }              /* датум се не скраћује */
.kv-datum svg { color: var(--zlatna); }
.kv-lokacija { margin-left: auto; justify-content: flex-end; }     /* локација десно, скраћује се на … */
.kv-lokacija svg { color: var(--plava-svetla); }

/* ---------- пречице: модеран минималистички стил ---------- */

.sekcija-precice { padding-top: clamp(30px, 4vw, 52px); }
/* увек 4 у реду на десктопу */
.precice { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }

/* златне картице у стилу видео картице (иконица у кругу горе, садржај доле) */
.precica {
    position: relative; overflow: hidden;
    display: flex; flex-direction: column; min-height: 250px;
    padding: 26px 24px 24px; text-decoration: none;
    border-radius: 18px; color: #14213a;
    background:
        radial-gradient(circle at 82% 6%, rgba(255,255,255,.28), transparent 55%),
        linear-gradient(150deg, #d6a52a 0%, var(--zlatna) 52%, var(--zlatna-tamna) 130%);
    box-shadow: 0 8px 22px rgba(201,151,28,.28);
    transition: transform .3s ease, box-shadow .3s ease;
}
.precica::after {                     /* суптилна мрежа у позадини (као видео) */
    content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background:
        repeating-linear-gradient(90deg, rgba(20,33,58,.05) 0 1px, transparent 1px 46px),
        repeating-linear-gradient(0deg, rgba(20,33,58,.04) 0 1px, transparent 1px 46px);
    -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%);
            mask-image: linear-gradient(180deg, #000, transparent 85%);
}
.precica > * { position: relative; z-index: 1; }
.precica:hover { transform: translateY(-6px); box-shadow: 0 14px 30px rgba(201,151,28,.36); }

/* кружни знак са иконицом — таман, да искаче на златном */
.precica-znak {
    position: relative; flex: none; width: 64px; height: 64px; border-radius: 50%;
    display: grid; place-items: center;
    background: #14213a; color: #fff;
    box-shadow: 0 8px 18px rgba(20,33,58,.3);
    transition: transform .3s ease;
}
.precica-znak::before {               /* пулсирајући прстен на ховер */
    content: ""; position: absolute; inset: -6px; border-radius: 50%;
    border: 2px solid rgba(20,33,58,.35);
    opacity: 0; transition: opacity .3s ease;
}
.precica-znak svg { width: 32px; height: 32px; }
.precica:hover .precica-znak { transform: scale(1.08); }
.precica:hover .precica-znak::before { opacity: 1; }

.precica-telo { margin-top: auto; display: flex; flex-direction: column; gap: 4px; padding-top: 20px; }
.precica-oznaka { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: rgba(20,33,58,.6); }
.precica-naslov { color: #14213a; font-weight: 800; font-size: 16px; line-height: 1.35; }
.precica-cta {
    display: inline-flex; align-items: center; gap: 7px; margin-top: 8px;
    color: #14213a; font-weight: 700; font-size: 13px;
}
.precica-cta svg { width: 16px; height: 16px; transition: transform .25s ease; }
.precica:hover .precica-cta svg { transform: translateX(4px); }

@media (max-width: 1080px) { .precice { grid-template-columns: repeat(2, 1fr); } }
/* мобилни: пречице као компактни тастери — 1 у реду, иконица лево, наслов, стрелица десно */
@media (max-width: 560px) {
    .precice { grid-template-columns: 1fr; gap: 10px; }
    .precica {
        flex-direction: row; align-items: center; gap: 14px;
        min-height: 0; padding: 12px 42px 12px 12px; border-radius: 12px;
    }
    .precica::after { display: none; }                 /* без позадинске мреже — чистије */
    .precica-znak { width: 44px; height: 44px; }
    .precica-znak svg { width: 22px; height: 22px; }
    .precica-telo { margin-top: 0; padding-top: 0; gap: 0; flex: 1; min-width: 0; }
    .precica-oznaka, .precica-cta { display: none; }   /* сакриј „Услуга“ и „Отвори“ — компактно */
    .precica-naslov { font-size: 15px; line-height: 1.25; }
    .precica::before {                                 /* стрелица десно (као на тастеру) */
        content: "›"; position: absolute; right: 16px; top: 50%; z-index: 1;
        transform: translateY(-52%); font-size: 26px; font-weight: 700; color: rgba(20,33,58,.5);
    }
    .precica:hover { transform: none; }                /* без подизања — понаша се као тастер */
}

/* Улазна анимација — чист CSS, без JS-а.
   Увек се завршава видљивим стањем (animation-fill-mode: both), па садржај
   не може да „нестане“ ако скрипта закаже. Где прегледач подржава анимације
   везане за скроловање, елементи се појављују тек кад уђу у екран. */
@media (prefers-reduced-motion: no-preference) {
    .animiraj { animation: ulaz .6s cubic-bezier(.2, .7, .3, 1) both; }
    .animiraj:nth-child(2) { animation-delay: .09s; }
    .animiraj:nth-child(3) { animation-delay: .18s; }
    .animiraj:nth-child(4) { animation-delay: .27s; }

    @supports (animation-timeline: view()) {
        .animiraj {
            animation: ulaz linear both;
            animation-timeline: view();
            animation-range: entry 10% entry 75%;
            animation-delay: 0s;
        }
    }
}
@keyframes ulaz {
    from { opacity: 0; transform: translateY(26px); }
    to   { opacity: 1; transform: none; }
}

/* ---------- истакнуте акције: видео упутство + упитник ---------- */

.video-okvir { width: 100%; margin: 0 auto; }
.video-okvir iframe, .video-okvir video {
    width: 100%; aspect-ratio: 16/9; border: 0; border-radius: var(--radius); box-shadow: var(--senka);
}

.akcije-mreza {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px; align-items: stretch;
}
.akcije-mreza.jedna-kolona { grid-template-columns: minmax(0, 780px); justify-content: center; }

.akcija-kartica {
    position: relative; overflow: hidden;
    display: flex; flex-direction: column;
    min-height: 460px;
    border-radius: 20px;
    text-decoration: none;
    box-shadow: var(--senka);
    transition: transform .32s ease, box-shadow .32s ease;
}
.akcija-kartica::before {                    /* горња акцент линија на ховер */
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; z-index: 4;
    background: linear-gradient(90deg, var(--zlatna), var(--zlatna-tamna));
    transform: scaleX(0); transform-origin: left;
    transition: transform .45s ease;
}
.akcija-kartica:hover {
    transform: translateY(-7px);
    box-shadow: 0 14px 30px rgba(10,42,70,.18), 0 30px 70px rgba(10,42,70,.16);
}
.akcija-kartica:hover::before { transform: scaleX(1); }

.akcija-vizual {
    position: relative; z-index: 2; flex: 1;
    display: grid; place-items: center;
    min-height: 250px;
    padding: clamp(28px, 3.4vw, 46px) clamp(24px, 3vw, 40px) 8px;
}
.akcija-telo {
    position: relative; z-index: 2;
    padding: 0 clamp(24px, 3vw, 38px) clamp(26px, 3vw, 36px);
    display: flex; flex-direction: column; gap: 10px;
}
.akcija-oznaka {
    align-self: flex-start;
    font-size: 11.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
    padding: 5px 13px; border-radius: 99px;
}
.akcija-naslov {
    margin: 0; font-size: clamp(19px, 1.6vw, 23px); line-height: 1.32;
    font-weight: 700; text-wrap: balance;
}
.akcija-opis { margin: 0; font-size: 15px; line-height: 1.65; }
.akcija-cta {
    display: inline-flex; align-items: center; gap: 9px;
    font-weight: 700; font-size: 15px; margin-top: 6px;
}
.akcija-cta svg { width: 19px; height: 19px; transition: transform .3s ease; }
.akcija-kartica:hover .akcija-cta svg { transform: translateX(7px); }

/* --- тамна картица (видео / иницијатива) --- */
.akcija-video {
    background:
        radial-gradient(circle at 80% 10%, rgba(201,151,28,.24), transparent 52%),
        linear-gradient(150deg, var(--plava-tamna) 0%, #113f68 58%, var(--plava-svetla) 135%);
    color: #fff;
}
.akcija-video::after {                       /* суптилна мрежа у позадини */
    content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background:
        repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 56px),
        repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 56px);
    -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 80%);
            mask-image: linear-gradient(180deg, #000 0%, transparent 80%);
}
.akcija-video .akcija-oznaka { background: rgba(255,255,255,.15); color: #ffd97a; }
.akcija-video .akcija-naslov { color: #fff; }
.akcija-video .akcija-opis { color: #cfdcea; }
.akcija-video .akcija-cta { color: var(--zlatna); }

/* илустрација која попуњава простор видео картице */
.akcija-ilustracija {
    position: absolute; inset: 0; z-index: 1;
    width: 100%; height: 100%;
    pointer-events: none;
}

.akcija-play {
    position: relative; z-index: 2;
    width: clamp(92px, 9vw, 112px); aspect-ratio: 1;
    border-radius: 50%; display: grid; place-items: center;
    background: rgba(255,255,255,.13);
    border: 2px solid rgba(255,255,255,.55);
    color: #fff;
    backdrop-filter: blur(4px);
    transition: transform .32s ease, background .32s ease, border-color .32s ease, color .32s ease;
}
.akcija-play svg { width: 42%; height: 42%; margin-left: 6%; }
.akcija-play::before, .akcija-play::after {
    content: ""; position: absolute; inset: -16px; border-radius: 50%;
    border: 2px solid rgba(255,255,255,.26);
    animation: akcija-puls 2.8s ease-out infinite;
}
.akcija-play::after { animation-delay: 1.4s; }
@keyframes akcija-puls {
    0%   { transform: scale(.82); opacity: .9; }
    100% { transform: scale(1.34); opacity: 0; }
}
.akcija-kartica:hover .akcija-play {
    transform: scale(1.08);
    background: var(--zlatna); border-color: var(--zlatna); color: #10243c;
}

/* --- светла картица (упитник) --- */
.akcija-upitnik { background: #fff; border: 1px solid var(--ivica); }
.akcija-upitnik .akcija-vizual {
    background: linear-gradient(155deg, #fffdf6 0%, #fdf3e1 52%, #f6e6c6 100%);
    overflow: hidden; flex: 0 0 auto; min-height: 0;
    padding: clamp(24px, 2.8vw, 36px);
}
.akcija-upitnik .akcija-telo {
    padding-top: clamp(20px, 2.4vw, 28px);
    border-top: 1px solid rgba(201, 151, 28, .22);
}
.akcija-upitnik .akcija-oznaka { background: rgba(201,151,28,.15); color: var(--zlatna-tamna); }
.akcija-upitnik .akcija-naslov { color: var(--plava-tamna); }
.akcija-upitnik .akcija-opis { color: var(--tekst-bledi); }
.akcija-upitnik .akcija-cta { color: var(--zlatna-tamna); }

/* декоративна подлога картице упитника */
.akcija-ukras { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }

/* слика упитника као „лист“ у белом оквиру са златним печатом */
.akcija-list {
    position: relative; z-index: 1;
    width: min(74%, 268px);
    background: #fff; border-radius: 16px; padding: 11px;
    box-shadow: 0 16px 36px rgba(120, 88, 20, .22), 0 2px 6px rgba(0, 0, 0, .07);
    transform: rotate(-2.2deg);
    transition: transform .38s ease, box-shadow .38s ease;
}
.akcija-list img { display: block; width: 100%; height: auto; border-radius: 9px; }
.akcija-kartica:hover .akcija-list {
    transform: rotate(0deg) translateY(-7px) scale(1.03);
    box-shadow: 0 24px 48px rgba(120, 88, 20, .3), 0 3px 8px rgba(0, 0, 0, .08);
}
.akcija-bedz {
    position: absolute; top: -16px; right: -16px; z-index: 2;
    width: 54px; height: 54px; border-radius: 50%;
    display: grid; place-items: center;
    background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna));
    color: #fff; border: 3px solid #fff;
    box-shadow: 0 8px 20px rgba(201, 151, 28, .45);
    transition: transform .38s ease;
}
.akcija-bedz svg { width: 26px; height: 26px; }
.akcija-kartica:hover .akcija-bedz { transform: rotate(8deg) scale(1.08); }

.akcija-ikona {
    width: clamp(92px, 9vw, 112px); aspect-ratio: 1; border-radius: 28px;
    display: grid; place-items: center;
    background: linear-gradient(135deg, var(--plava), var(--plava-svetla));
    color: #fff; box-shadow: 0 10px 22px rgba(16,60,98,.28);
    transition: transform .3s ease, border-radius .3s ease;
}
.akcija-ikona svg { width: 44%; height: 44%; }
.akcija-kartica:hover .akcija-ikona { transform: translateY(-4px); border-radius: 50%; }

@media (prefers-reduced-motion: reduce) {
    .akcija-play::before, .akcija-play::after { animation: none; }
    .akcija-kartica:hover { transform: none; }
}
@media (max-width: 1020px) {
    .akcije-mreza { grid-template-columns: 1fr; }
    .akcija-kartica { min-height: 400px; }
}

.dugme-veliko {
    display: inline-block; background: var(--plava); color: #fff; text-decoration: none;
    font-weight: 700; padding: 12px 30px; border-radius: 8px; border: 0; cursor: pointer; font-size: 15px;
    transition: background var(--prelaz);
}
.dugme-veliko:hover { background: var(--plava-svetla); color: #fff; }
.centar { text-align: center; }

/* дугме за улазак на платформу обука */
.obuke-cta {
    display: inline-flex; align-items: center; gap: 10px;
    background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna));
    color: #fff; text-decoration: none; font-weight: 700; font-size: 16px;
    padding: 14px 32px; border-radius: 999px;
    box-shadow: 0 8px 20px rgba(201, 151, 28, .3);
    transition: transform var(--prelaz), box-shadow var(--prelaz);
}
.obuke-cta::before {
    content: "▶"; font-size: 13px; display: inline-grid; place-items: center;
    width: 26px; height: 26px; border-radius: 50%; background: rgba(255, 255, 255, .22);
}
.obuke-cta:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 12px 26px rgba(201, 151, 28, .42); }

/* ---------- унутрашње стране ---------- */

.strana-vrh {
    background: linear-gradient(120deg, var(--plava-tamna), var(--plava-svetla));
    color: #fff; padding: clamp(30px, 5vw, 56px) 0;
}
.strana-vrh h1 { color: #fff; margin: 0; text-wrap: balance; }
.strana-vrh .podnaslov { color: #d6e2ee; margin: 8px 0 0; font-size: clamp(15px, 1.4vw, 18px); }
.mrvice { font-size: 13.5px; margin: 0 0 10px; color: #b9cbdc; }
.mrvice a { color: #d6e2ee; text-decoration: none; }
.mrvice a:hover { color: #fff; text-decoration: underline; }

/* херо секторског већа: текст лево, дискретан анимирани амблем десно */
.vece-hero-okvir { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.vece-hero-tekst { min-width: 0; }
.vece-hero-amblem {
    position: relative; flex: 0 0 auto; width: 160px; height: 160px;
    filter: drop-shadow(0 6px 16px rgba(0, 0, 0, .22));
}
.vece-grafika { width: 100%; height: 100%; display: block; }
@media (max-width: 720px) { .vece-hero-amblem { display: none; } }
@media (prefers-reduced-motion: reduce) { .vece-grafika * { animation: none !important; } }

/* главна слика странице: центрирана ако је ужа од садржаја, скалира ако је шира */
.strana-glavna-slika {
    display: block; max-width: 100%; height: auto;
    margin: 0 auto 20px; border-radius: 12px;
}

/* ---------- организационе јединице као дугмад (нпр. страна „О Агенцији“) ---------- */
.org-mreza { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 18px 0 10px; }
@media (max-width: 640px) { .org-mreza { grid-template-columns: 1fr; } }
.org-dugme {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 15px 20px; background: #fff; border: 1px solid var(--ivica); border-radius: 12px;
    text-decoration: none; color: var(--plava-tamna); font-weight: 700; font-size: 15.5px; line-height: 1.3;
    position: relative; overflow: hidden;
    transition: border-color var(--prelaz), box-shadow var(--prelaz), transform var(--prelaz);
}
.org-dugme::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--zlatna); transform: scaleY(0); transition: transform var(--prelaz); }
.org-dugme:hover { border-color: var(--zlatna); box-shadow: 0 8px 22px rgba(16, 60, 98, .1); transform: translateY(-2px); color: var(--plava-tamna); }
.org-dugme:hover::before { transform: scaleY(1); }
.org-dugme::after { content: "→"; flex: 0 0 auto; color: var(--zlatna-tamna); font-weight: 800; transition: transform var(--prelaz); }
.org-dugme:hover::after { transform: translateX(4px); }

/* истакнут блок текста (нпр. основне информације) */
.info-blok { background: var(--pozadina-siva); border-left: 4px solid var(--plava-svetla); border-radius: 0 12px 12px 0; padding: 16px 22px; margin: 16px 0; }
.info-blok p:last-child { margin-bottom: 0; }

/* списак надлежности (задржава законско нумерисање, без тачкица) */
.nadleznosti { list-style: none; padding: 0; margin: 14px 0; }
.nadleznosti > li { padding: 10px 4px 10px 0; border-bottom: 1px solid var(--ivica); }
.nadleznosti > li:last-child { border-bottom: 0; }
.nadleznosti > li > b { color: var(--plava-svetla); margin-right: 6px; }

/* поднаслов секције унутар садржаја */
.sadrzaj-tekst .pododeljak { display: flex; align-items: center; gap: 12px; margin: 30px 0 6px; color: var(--plava-tamna); font-size: 19px; font-weight: 800; }
.sadrzaj-tekst .pododeljak::before { content: ""; width: 5px; height: 22px; border-radius: 3px; background: linear-gradient(180deg, var(--zlatna), var(--zlatna-tamna)); flex: 0 0 auto; }

/* ---------- тастери (дугмад са линком) унутар садржаја ---------- */
.tasteri { display: flex; flex-wrap: wrap; gap: 12px; margin: 20px 0; }
.tasteri.kol-1 .taster { flex: 1 1 100%; }
.tasteri.kol-2 .taster { flex: 1 1 calc(50% - 12px); }
.tasteri.kol-3 .taster { flex: 1 1 calc(33.333% - 12px); }
.tasteri.kol-4 .taster { flex: 1 1 calc(25% - 12px); }
.tasteri.kol-5 .taster { flex: 1 1 calc(20% - 12px); }
@media (max-width: 680px) { .tasteri .taster { flex: 1 1 100% !important; } }
.taster {
    display: inline-flex; align-items: center; justify-content: center; gap: 9px;
    padding: 13px 24px; border-radius: 10px; text-decoration: none;
    font-weight: 700; font-size: 15px; line-height: 1.25; text-align: center;
    border: 2px solid transparent; cursor: pointer;
    transition: transform var(--prelaz), box-shadow var(--prelaz), background var(--prelaz), color var(--prelaz), border-color var(--prelaz);
}
.taster:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(16,60,98,.16); }
.taster-plava  { background: var(--plava); color: #fff; }
.taster-plava:hover  { background: var(--plava-svetla); color: #fff; }
.taster-zlatna { background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna)); color: #14213a; }
.taster-zlatna:hover { color: #14213a; }
.taster-zelena { background: #1e7a46; color: #fff; }
.taster-zelena:hover { background: #176035; color: #fff; }
.taster-crvena { background: var(--crvena); color: #fff; }
.taster-crvena:hover { color: #fff; }
.taster-tamna  { background: var(--plava-tamna); color: #fff; }
.taster-tamna:hover { color: #fff; }
.taster-okvir  { background: #fff; color: var(--plava-tamna); border-color: var(--plava); }
.taster-okvir:hover { background: var(--pozadina-siva); color: var(--plava-tamna); }
/* иконице (SVG mask — боји се у боју текста тастера) */
.taster[class*="taster-ik-"]::before {
    content: ""; flex: 0 0 auto; width: 18px; height: 18px; background: currentColor;
    -webkit-mask: var(--ik) center / contain no-repeat; mask: var(--ik) center / contain no-repeat;
}
.taster-ik-strelica { --ik: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); }
.taster-ik-preuzmi { --ik: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12M7 11l5 5 5-5M5 21h14'/%3E%3C/svg%3E"); }
.taster-ik-dokument { --ik: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H6a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z'/%3E%3Cpath d='M14 3v6h6M8 13h8M8 17h6'/%3E%3C/svg%3E"); }
.taster-ik-spolja { --ik: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14 21 3'/%3E%3C/svg%3E"); }
.taster-ik-info { --ik: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 16v-4M12 8h.01'/%3E%3C/svg%3E"); }
.taster-ik-telefon { --ik: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.4-1.2a2 2 0 0 1 2.1-.5c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E"); }
.taster-ik-mejl { --ik: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4.5' width='19' height='15' rx='2.5'/%3E%3Cpath d='m3 6.5 9 6 9-6'/%3E%3C/svg%3E"); }
.taster-ik-cek { --ik: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"); }

/* === Истакнуто дугме „Е-пријава“ (CTA: иконица авиона, сјај, благи пулс) === */
.taster-eprijava {
    padding: 14px 32px;
    border-radius: 999px;
    font-weight: 800;
    letter-spacing: .01em;
    color: #14213a;
    background:
        linear-gradient(100deg, transparent 34%, rgba(255,255,255,.55) 46%, transparent 58%) no-repeat,
        linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna));
    background-size: 250% 100%, 100% 100%;
    background-position: 160% 0, 0 0;
    box-shadow: 0 6px 16px rgba(201,151,28,.4), inset 0 1px 0 rgba(255,255,255,.4);
    transition: background-position .7s ease, transform .25s ease, box-shadow .25s ease;
    animation: eprijava-puls 2.6s ease-out infinite;
    --ik-eprijava: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='22' y1='2' x2='11' y2='13'/%3E%3Cpolygon points='22 2 15 22 11 13 2 9 22 2'/%3E%3C/svg%3E");
}
.taster-eprijava::before {
    content: ""; flex: 0 0 auto; width: 20px; height: 20px;
    background: currentColor;
    -webkit-mask: var(--ik-eprijava) center / contain no-repeat;
    mask: var(--ik-eprijava) center / contain no-repeat;
    transition: transform .3s ease;
}
.taster-eprijava:hover {
    color: #14213a;
    transform: translateY(-3px);
    background-position: -60% 0, 0 0;
    box-shadow: 0 12px 26px rgba(201,151,28,.52), inset 0 1px 0 rgba(255,255,255,.45);
    animation-play-state: paused;
}
.taster-eprijava:hover::before { transform: translateX(3px) rotate(-14deg) scale(1.1); }
.taster-eprijava:active { transform: translateY(-1px); }
@keyframes eprijava-puls {
    0%   { box-shadow: 0 6px 16px rgba(201,151,28,.4), 0 0 0 0 rgba(201,151,28,.5); }
    70%  { box-shadow: 0 6px 16px rgba(201,151,28,.4), 0 0 0 12px rgba(201,151,28,0); }
    100% { box-shadow: 0 6px 16px rgba(201,151,28,.4), 0 0 0 0 rgba(201,151,28,0); }
}
@media (prefers-reduced-motion: reduce) {
    .taster-eprijava { animation: none; transition: transform .2s ease; }
}

/* тастери у изгледу „бокс“ (исти изглед као боксови на почетној страни) */
.boks-mreza { display: grid; gap: 24px; margin: 22px 0; grid-template-columns: repeat(2, 1fr); }
.boks-mreza.kol-1 { grid-template-columns: 1fr; }
.boks-mreza.kol-3 { grid-template-columns: repeat(3, 1fr); }
.boks-mreza.kol-4 { grid-template-columns: repeat(4, 1fr); }
.boks-mreza.kol-5 { grid-template-columns: repeat(5, 1fr); }
.boks-mreza .box { min-height: 200px; }
/* златна линија изнад наслова (преко CSS-а — TinyMCE брише празан <span class="box-crta">) */
.boks-mreza .box-telo::before {
    content: ""; display: block; width: 54px; height: 4px; border-radius: 3px;
    background: linear-gradient(90deg, var(--zlatna), var(--zlatna-tamna));
    margin-bottom: 18px; transition: width .35s ease;
}
.boks-mreza .box:hover .box-telo::before { width: 92px; }
/* ако постоји и стари ручни <span class="box-crta"> — сакриј дупликат */
.boks-mreza .box-crta { display: none; }

/* боја бокса (позадина картице) — бира се у едитору */
.boks-mreza .box.box-plava  { background: linear-gradient(135deg, var(--plava), var(--plava-tamna)); }
.boks-mreza .box.box-tamna  { background: linear-gradient(135deg, var(--plava-tamna), #06182a); }
.boks-mreza .box.box-zelena { background: linear-gradient(135deg, #2a9d5c, #176035); }
.boks-mreza .box.box-crvena { background: linear-gradient(135deg, #d0493b, #9e241a); }
.boks-mreza .box.box-zlatna { background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna)); }
.boks-mreza .box.box-okvir  { background: #fff; box-shadow: inset 0 0 0 2px var(--plava), var(--senka); }
/* за боксове без слике — уклони тамни прелив да се боја види чисто
   (:has пада грациозно: где није подржан, прелив остаје као и досад) */
.boks-mreza .box:not(:has(img))::after { display: none; }
/* златни бокс: тамни текст и акценти да се виде на злату */
.boks-mreza .box.box-zlatna .box-naslov { color: #14213a; text-shadow: none; }
.boks-mreza .box.box-zlatna .box-opis { color: #33301f; }
.boks-mreza .box.box-zlatna .box-strelica { color: #14213a; }
.boks-mreza .box.box-zlatna .box-telo::before { background: #14213a; }
/* бокс са оквиром (бела картица): тамни текст, златна линија, плава стрелица */
.boks-mreza .box.box-okvir .box-naslov { color: var(--plava-tamna); text-shadow: none; }
.boks-mreza .box.box-okvir .box-opis { color: var(--tekst-bledi); }
.boks-mreza .box.box-okvir .box-strelica { color: var(--plava-svetla); }
/* бокс са иконицом: садржај се поравна уз ВРХ (иконица горе, наслов одмах испод) */
.boks-mreza .box:has(.box-ikona) { align-items: flex-start; }
/* Font Awesome иконица — кружни беџ на врху, у нормалном току,
   са позадином и hover-анимацијом (дух као „precica-znak“ на почетној) */
.boks-mreza .box-ikona {
    position: relative; z-index: 2; margin-bottom: 16px;
    width: 60px; height: 60px; border-radius: 50%;
    display: grid; place-items: center;
    background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna));
    color: #14213a; font-size: 25px; line-height: 1;
    box-shadow: 0 8px 20px rgba(0,0,0,.26);
    transition: transform .32s ease, box-shadow .32s ease;
}
.boks-mreza .box-ikona i { line-height: 1; }
.boks-mreza .box-ikona::before {           /* пулсирајући прстен на ховер */
    content: ""; position: absolute; inset: -6px; border-radius: 50%;
    border: 2px solid rgba(201,151,28,.55); opacity: 0; transform: scale(.9);
    transition: opacity .35s ease, transform .35s ease;
}
.boks-mreza .box:hover .box-ikona { transform: translateY(-3px) scale(1.08); box-shadow: 0 14px 28px rgba(0,0,0,.34); }
.boks-mreza .box:hover .box-ikona::before { opacity: 1; transform: scale(1); }
/* златни/бели бокс: тамноплави беџ са БЕЛОМ иконицом (не бојом бокса) */
.boks-mreza .box.box-zlatna .box-ikona,
.boks-mreza .box.box-okvir .box-ikona { background: linear-gradient(135deg, var(--plava-svetla), var(--plava-tamna)); color: #fff; }
.boks-mreza .box.box-zlatna .box-ikona::before,
.boks-mreza .box.box-okvir .box-ikona::before { border-color: rgba(27,90,142,.6); }
/* кад је иконица присутна: сакриј златну линију (беџ је замењује) */
.boks-mreza .box-telo:has(.box-ikona)::before { display: none; }
@media (max-width: 780px) { .boks-mreza { grid-template-columns: 1fr !important; } }

.strana-telo { padding: clamp(28px, 4vw, 52px) 0; }
.strana-mreza { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
.strana-mreza.bez-sidebara { grid-template-columns: minmax(0, 1fr); }

/* једнообразна типографија садржаја: исти фонт свуда, основна боја црна */
.sadrzaj-tekst {
    overflow-wrap: break-word;
    color: #1a1a1a;
    font-size: 16.5px;
    line-height: 1.7;
}
.sadrzaj-tekst p,
.sadrzaj-tekst li,
.sadrzaj-tekst td,
.sadrzaj-tekst span,
.sadrzaj-tekst div,
.sadrzaj-tekst a,
.sadrzaj-tekst strong,
.sadrzaj-tekst em {
    font-family: inherit !important;   /* поништи наслеђени Poppins из старог садржаја */
}
.sadrzaj-tekst p { margin: 0 0 1em; }
.sadrzaj-tekst h2, .sadrzaj-tekst h3, .sadrzaj-tekst h4 { color: var(--plava-tamna); margin: 1.4em 0 .5em; }
.sadrzaj-tekst a { color: var(--plava-svetla); }
.sadrzaj-tekst a:hover { color: var(--plava-tamna); }
.sadrzaj-tekst img { border-radius: 8px; height: auto; }
.sadrzaj-tekst table { border-collapse: collapse; width: 100%; margin: 18px 0; display: block; overflow-x: auto; }
.sadrzaj-tekst td, .sadrzaj-tekst th { border: 1px solid var(--ivica); padding: 8px 12px; }
.sadrzaj-tekst th { background: var(--pozadina-siva); }
.sadrzaj-tekst blockquote {
    border-left: 4px solid var(--zlatna); margin: 18px 0; padding: 8px 20px;
    background: var(--pozadina-siva); border-radius: 0 8px 8px 0;
}
.sadrzaj-tekst iframe { max-width: 100%; border: 0; border-radius: 8px; }

.sidebar {
    background: var(--pozadina-siva); border: 1px solid var(--ivica);
    border-radius: var(--radius); padding: 24px;
}

/* хармоника (детаils) — и из едитора (.harmonika) и табови докумената */
details.harmonika, .tab-grupa {
    border: 1px solid var(--ivica); border-radius: 10px; margin: 12px 0; overflow: hidden; background: #fff;
}
details.harmonika > summary, .tab-grupa > summary {
    cursor: pointer; padding: 14px 20px; font-weight: 700;
    background: var(--plava); color: #fff; list-style: none;
    display: flex; justify-content: space-between; align-items: center;
}
details.harmonika > summary::-webkit-details-marker, .tab-grupa > summary::-webkit-details-marker { display: none; }
details.harmonika > summary::after, .tab-grupa > summary::after { content: "+"; font-size: 20px; font-weight: 400; }
details[open].harmonika > summary::after, details[open].tab-grupa > summary::after { content: "–"; }
details.harmonika > summary:hover, .tab-grupa > summary:hover { background: var(--plava-svetla); }
.harmonika-telo, .tab-telo { padding: 16px 20px; }

.tab-grupa > summary .tab-datum {
    font-weight: 500; font-size: 13px; opacity: .85; margin-left: 10px;
}
.objava-naslov { margin: 16px 0 8px; color: var(--plava-tamna); }
.tab-stavka { margin: 10px 0; }
.tab-stavka-dugme {
    display: flex; align-items: center; gap: 10px;
    background: var(--pozadina-siva); border: 1px solid var(--ivica);
    padding: 11px 16px; border-radius: 8px; text-decoration: none;
    color: var(--plava-tamna); font-weight: 600; font-size: 14.5px;
    transition: border-color var(--prelaz), background var(--prelaz);
}
.tab-stavka-dugme:hover { border-color: var(--zlatna); background: #fdf8ec; }
.tab-stavka-dugme::before { content: "⭳"; color: var(--zlatna-tamna); font-size: 17px; }
.tab-stavka-dugme.spoljni::before { content: "↗"; }

/* галерија — истакнут сегмент са панелом */
.galerija-blok {
    position: relative; margin: 40px 0;
    background: linear-gradient(165deg, #f6f9fc 0%, #eef3f9 100%);
    border: 1px solid var(--ivica); border-radius: 18px;
    padding: clamp(20px, 3vw, 30px);
    box-shadow: var(--senka);
    overflow: hidden;
}
.galerija-blok::before {              /* златна трака уз горњу ивицу */
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, var(--zlatna), var(--zlatna-tamna), var(--plava-svetla));
}
.galerija-zaglavlje {
    display: flex; align-items: center; gap: 14px;
    margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--ivica);
}
.galerija-ikona {
    flex: none; width: 44px; height: 44px; border-radius: 12px;
    display: grid; place-items: center;
    background: linear-gradient(135deg, var(--plava), var(--plava-svetla));
    color: #fff; box-shadow: 0 6px 14px rgba(16,60,98,.25);
}
.galerija-ikona svg { width: 24px; height: 24px; }
.galerija-naslov { margin: 0; font-size: clamp(19px, 2vw, 24px); color: var(--plava-tamna); flex: 1; }
.galerija-broj {
    color: var(--zlatna-tamna); font-size: 13px; font-weight: 700; white-space: nowrap;
    text-transform: uppercase; letter-spacing: .04em;
    background: rgba(201,151,28,.14); padding: 5px 12px; border-radius: 99px;
}

/* карусел: један ред са хоризонталним клизањем */
.galerija-karusel { position: relative; }
.galerija {
    display: flex; gap: 12px; margin: 0;
    overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x proximity;
    padding-bottom: 2px;
    scrollbar-width: none;                /* Firefox: сакриј траку */
}
.galerija::-webkit-scrollbar { display: none; }
.galerija-slika {
    position: relative; display: block;
    /* grow:1 → кад слика има мало, растежу се и попуне ред;
       shrink:0 → кад их има више, задрже ширину и ред се листа (карусел) */
    flex: 1 0 clamp(200px, 23%, 250px);
    border-radius: 12px; overflow: hidden;
    aspect-ratio: 4 / 3;                  /* све слике истог односа = уједначено */
    scroll-snap-align: start;
    box-shadow: 0 2px 8px rgba(10,42,70,.1);
    transition: box-shadow var(--prelaz), transform var(--prelaz);
}

/* стрелице каросела */
.galerija-strelica {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
    width: 42px; height: 42px; border-radius: 50%; cursor: pointer;
    border: 1px solid var(--ivica); background: rgba(255,255,255,.96);
    color: var(--plava-tamna); font-size: 24px; line-height: 1;
    display: grid; place-items: center;
    box-shadow: 0 4px 14px rgba(10,42,70,.2);
    transition: background var(--prelaz), color var(--prelaz), opacity var(--prelaz);
}
.galerija-strelica:hover { background: var(--plava); color: #fff; }
.galerija-strelica[hidden] { display: none; }
.galerija-levo { left: -8px; }
.galerija-desno { right: -8px; }
@media (max-width: 560px) {
    .galerija-slika { flex-basis: 60%; }
    .galerija-strelica { display: none; }   /* на мобилном само превлачење */
}
.galerija-slika img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.galerija-slika::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(0deg, rgba(10,42,70,.28), transparent 55%);
    opacity: 0; transition: opacity var(--prelaz);
}
.galerija-zum {
    position: absolute; right: 12px; bottom: 12px; z-index: 2;
    width: 38px; height: 38px; border-radius: 50%;
    background: rgba(255,255,255,.92); color: var(--plava-tamna);
    display: grid; place-items: center;
    opacity: 0; transform: scale(.7); transition: opacity var(--prelaz), transform var(--prelaz);
    box-shadow: 0 3px 10px rgba(0,0,0,.2);
}
.galerija-zum::before {
    content: ""; width: 15px; height: 15px; border-radius: 50%;
    border: 2px solid currentColor; position: relative;
    box-shadow: 8px 8px 0 -6px currentColor;   /* дршка лупе */
}
.galerija-slika:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(10,42,70,.2); }
.galerija-slika:hover img { transform: scale(1.08); }
.galerija-slika:hover::after { opacity: 1; }
.galerija-slika:hover .galerija-zum { opacity: 1; transform: scale(1); }

/* лajтбокс */
.lightbox {
    position: fixed; inset: 0; z-index: 300; background: rgba(8, 18, 30, .92);
    display: none; align-items: center; justify-content: center; padding: 40px;
}
.lightbox.otvoren { display: flex; }
.lightbox img { max-width: 92vw; max-height: 86vh; border-radius: 8px; box-shadow: 0 12px 60px rgba(0,0,0,.6); }
.lightbox-zatvori, .lightbox-levo, .lightbox-desno {
    position: absolute; background: rgba(255,255,255,.12); color: #fff; border: 0;
    width: 46px; height: 46px; border-radius: 50%; font-size: 20px; cursor: pointer;
}
.lightbox-zatvori { top: 18px; right: 18px; }
.lightbox-levo { left: 18px; top: 50%; transform: translateY(-50%); }
.lightbox-desno { right: 18px; top: 50%; transform: translateY(-50%); }

/* списак већа */
/* списак секторских већа — картице са иконицом сектора (3 у реду на десктопу) */
.veca-mreza { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 8px 0; }
@media (min-width: 620px)  { .veca-mreza { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px)  { .veca-mreza { grid-template-columns: repeat(3, 1fr); } }
.veca-kartica {
    display: flex; align-items: center; gap: 16px;
    padding: 16px 18px; background: #fff;
    border: 1px solid var(--ivica); border-radius: 14px; text-decoration: none;
    position: relative; overflow: hidden;
    transition: border-color var(--prelaz), box-shadow var(--prelaz), transform var(--prelaz);
}
.veca-kartica::before {
    content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
    background: var(--zlatna); transform: scaleY(0); transform-origin: center;
    transition: transform var(--prelaz);
}
.veca-kartica:hover {
    border-color: var(--zlatna); box-shadow: 0 10px 26px rgba(16, 60, 98, .12); transform: translateY(-2px);
}
.veca-kartica:hover::before { transform: scaleY(1); }
.veca-kartica-ikona {
    flex: 0 0 auto; display: grid; place-items: center;
    width: 54px; height: 54px; border-radius: 12px;
    background: linear-gradient(135deg, #f3f7fb, #e7eef6); color: var(--plava);
    transition: background var(--prelaz), color var(--prelaz);
}
.veca-kartica:hover .veca-kartica-ikona { background: linear-gradient(135deg, var(--plava), var(--plava-svetla)); color: #fff; }
.veca-kartica-ikona .meni-ikona-sektora { width: 30px; height: 30px; stroke-width: 1.6; }
.veca-kartica-telo { min-width: 0; flex: 1; }
.veca-kartica-naziv { display: block; color: var(--plava-tamna); font-weight: 700; font-size: 15.5px; line-height: 1.3; }
.veca-kartica-opis { display: block; color: var(--tekst-slabiji, #5a6b7b); font-size: 13px; margin-top: 3px; }
.veca-kartica-strelica { flex: 0 0 auto; color: var(--zlatna-tamna); transition: transform var(--prelaz); }
.veca-kartica-strelica svg { width: 20px; height: 20px; display: block; }
.veca-kartica:hover .veca-kartica-strelica { transform: translateX(4px); }

/* картице (већа, пројекти) */
.mreza-kartica { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }

/* ---------- контакт страна ---------- */

/* брзе картице (адреса/телефон/пошта) — преклапају hero */
.kontakt-brzo-okvir { margin-top: -34px; position: relative; z-index: 5; }
.kontakt-brzo {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px;
}
.kontakt-brzo-kartica {
    display: flex; align-items: center; gap: 15px; text-decoration: none;
    background: #fff; border: 1px solid var(--ivica); border-radius: 14px;
    padding: 20px 22px; box-shadow: var(--senka);
    transition: transform var(--prelaz), box-shadow var(--prelaz);
}
.kontakt-brzo-kartica:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(10,42,70,.14); }
.kontakt-brzo-ikona {
    flex: 0 0 48px; height: 48px; border-radius: 14px; display: grid; place-items: center;
    background: linear-gradient(135deg, var(--plava), var(--plava-svetla));
    color: #fff; box-shadow: 0 6px 14px rgba(16,60,98,.24);
}
.kontakt-brzo-ikona svg { width: 22px; height: 22px; }
.kontakt-brzo-naslov { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--zlatna-tamna); }
.kontakt-brzo-tekst { display: block; color: var(--plava-tamna); font-weight: 600; font-size: 15px; margin-top: 2px; }

.kontakt-glavna-mreza { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 40px; align-items: stretch; margin-top: 40px; }

/* leva kolona: kontakt podaci po centrima (iz podešavanja) */
.kontakt-info h3 {
    color: var(--plava-tamna); font-size: 17px; margin: 0 0 8px;
}
.kontakt-info > div { margin-bottom: 22px; }

/* desna kolona: formular + mapa; mapa se rasteže da poravna visinu sa levom kolonom */
.kontakt-desno { display: flex; flex-direction: column; gap: 22px; }
.kontakt-mapa {
    border-radius: 16px; overflow: hidden; box-shadow: var(--senka); line-height: 0;
    flex: 1 1 auto; min-height: 320px; display: flex;
}
.kontakt-mapa iframe { display: block; width: 100%; height: 100%; min-height: 320px; filter: grayscale(.12); }

/* formular */
.kontakt-forma-kutija {
    background: linear-gradient(160deg, #fff, #f7f9fc);
    border: 1px solid var(--ivica); border-radius: 18px;
    padding: clamp(24px, 3vw, 36px); box-shadow: var(--senka);
}
.kontakt-forma-naslov { margin: 0 0 6px; color: var(--plava-tamna); font-size: clamp(20px, 2vw, 25px); }
.kontakt-forma-uvod { margin: 0 0 22px; color: var(--tekst-bledi); }
.kontakt-forma label { display: block; margin-bottom: 16px; }
.kontakt-forma label > span { display: block; font-weight: 600; color: var(--plava-tamna); margin-bottom: 6px; font-size: 14px; }
.kontakt-forma input, .kontakt-forma textarea {
    width: 100%; padding: 12px 15px; font: inherit; font-size: 15px;
    border: 1.5px solid var(--ivica); border-radius: 10px; background: #fff;
    transition: border-color var(--prelaz), box-shadow var(--prelaz);
}
.kontakt-forma input:focus, .kontakt-forma textarea:focus {
    outline: none; border-color: var(--plava-svetla);
    box-shadow: 0 0 0 3px rgba(27,92,143,.12);
}
.kontakt-forma textarea { resize: vertical; min-height: 120px; }
.kontakt-red { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.kontakt-forma .dugme-veliko { width: 100%; margin-top: 6px; cursor: pointer; border: 0; }
.med { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.kontakt-odgovor { padding: 13px 18px; border-radius: 10px; margin: 0 0 20px; font-weight: 600; }
.kontakt-odgovor-ok { background: #e8f5e9; border: 1px solid #a5d6a7; color: #1b5e20; }
.kontakt-odgovor-greska { background: #fdecea; border: 1px solid #f5c6c1; color: #8c1d18; }

@media (max-width: 900px) {
    .kontakt-glavna-mreza { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
    .kontakt-red { grid-template-columns: 1fr; }
}

/* пагинација, обрасци */
.paginacija { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin: 34px 0 0; }
.paginacija a, .paginacija span {
    min-width: 40px; text-align: center; padding: 8px 12px;
    border: 1px solid var(--ivica); border-radius: 8px; text-decoration: none; color: var(--tekst);
}
.paginacija a:hover { border-color: var(--plava-svetla); }
.paginacija .aktivna { background: var(--plava); border-color: var(--plava); color: #fff; }

.polje-pretrage { display: flex; gap: 10px; max-width: 560px; margin: 0 auto 30px; }
.polje-pretrage input {
    flex: 1; padding: 12px 16px; border: 2px solid var(--ivica); border-radius: 8px; font: inherit;
}
.polje-pretrage input:focus { border-color: var(--plava-svetla); outline: none; }

.oznaka-datum { color: var(--zlatna-tamna); font-weight: 700; font-size: 14px; }

/* ---------- страница појединачне вести ---------- */

.vest-hero {
    background: linear-gradient(120deg, var(--plava-tamna) 0%, var(--plava) 60%, var(--plava-svetla) 130%);
    color: #fff; padding: clamp(28px, 5vw, 56px) 0 clamp(32px, 5vw, 60px);
    position: relative; overflow: hidden;
}
.vest-hero::after {
    content: ""; position: absolute; right: -80px; top: -80px; width: 300px; height: 300px;
    border-radius: 50%; background: radial-gradient(circle, rgba(201,151,28,.18), transparent 65%);
}
/* садржај hero-а поравнат лево (исто као чланак испод) */
.vest-hero .okvir { position: relative; z-index: 1; text-align: left; }
.vest-hero .vest-meta { justify-content: flex-start; }
.vest-hero h1 { max-width: 60ch; }
.vest-podnaslov { max-width: 70ch; }
.vest-hero .mrvice { color: #b9cbdc; }
.vest-hero .mrvice a { color: #d6e2ee; }
.vest-hero h1 { color: #fff; margin: 0; text-wrap: balance; font-size: clamp(25px, 3.2vw, 40px); }
.vest-podnaslov { color: #dbe7f2; font-size: clamp(16px, 1.6vw, 19px); margin: 14px 0 0; max-width: 760px; }

.vest-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.vest-cip {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18);
    padding: 6px 14px; border-radius: 99px; font-size: 14px; font-weight: 600; color: #fff;
}
.vest-cip svg { width: 16px; height: 16px; color: var(--zlatna); }

.vest-raspored { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 44px; align-items: start; }
.vest-clanak { min-width: 0; }
.vest-slika {
    position: relative; margin: 0 0 32px;
    border-radius: 18px; overflow: hidden;
    box-shadow: 0 10px 30px rgba(10, 42, 70, .22), 0 2px 8px rgba(10, 42, 70, .1);
    isolation: isolate;
}
.vest-slika::before {                 /* златни угаони акценат горе-лево */
    content: ""; position: absolute; top: 14px; left: 14px; z-index: 2;
    width: 46px; height: 46px; pointer-events: none;
    border-top: 3px solid var(--zlatna); border-left: 3px solid var(--zlatna);
    border-radius: 10px 0 0 0;
    opacity: .9;
}
.vest-slika::after {                  /* меки тамни прелив на дну ради дубине */
    content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(0deg, rgba(10,42,70,.28), transparent 34%);
}
.vest-slika img {
    width: 100%; height: auto; display: block;
    transition: transform .6s ease;
}
.vest-slika:hover img { transform: scale(1.03); }

.vest-podeli {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    margin-top: 34px; padding-top: 22px; border-top: 1px solid var(--ivica);
}
.vest-podeli > span { font-weight: 700; color: var(--plava-tamna); }
.vest-podeli a {
    width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center;
    background: var(--pozadina-siva); color: var(--plava);
    transition: background var(--prelaz), color var(--prelaz), transform var(--prelaz);
}
.vest-podeli a svg { width: 18px; height: 18px; }
.vest-podeli a:hover { background: var(--plava); color: #fff; transform: translateY(-3px); }

.vest-bocno { position: sticky; top: 100px; }
.vest-nazad { margin-bottom: 20px; }
.vest-nazad a { font-weight: 700; text-decoration: none; color: var(--plava); }
.vest-nazad a:hover { color: var(--plava-tamna); }
.vest-bocno-naslov {
    font-size: 16px; color: var(--plava-tamna); margin: 0 0 16px; padding-bottom: 10px;
    border-bottom: 2px solid var(--zlatna); display: inline-block;
}
.vest-druge { list-style: none; margin: 0; padding: 0; }
.vest-druge li { margin-bottom: 14px; }
.vest-druge a { display: flex; gap: 12px; text-decoration: none; align-items: center; }
.vest-druge img { width: 74px; height: 56px; object-fit: cover; border-radius: 8px; flex: none; }
.vest-druge-datum { display: block; color: var(--zlatna-tamna); font-size: 12px; font-weight: 700; }
.vest-druge-naslov { display: block; color: var(--plava-tamna); font-size: 14px; line-height: 1.4; font-weight: 600; }
.vest-druge a:hover .vest-druge-naslov { color: var(--plava-svetla); }

@media (max-width: 1000px) {
    .vest-raspored { grid-template-columns: 1fr; gap: 30px; }
    .vest-bocno { position: static; }
}

/* ---------- мобилни ---------- */

@media (max-width: 1020px) {
    .okvir { padding: 0 14px; }

    /* ---- заглавље ---- */
    .zaglavlje-red { gap: 8px; min-height: 66px; flex-wrap: nowrap; }
    .logo { gap: 8px; min-width: 0; flex: 1 1 auto; overflow: hidden; }
    .logo img { height: 40px; flex: 0 0 auto; }
    .logo-naziv { display: block; font-size: 12px; line-height: 1.1; max-width: 140px; padding-left: 7px; min-width: 0; }
    .logo-naziv::before { height: 26px; }
    .zaglavlje-alat { flex: 0 0 auto; }
    /* поткровни мени на мобилном без наметнуте минималне ширине (inline sirina) */
    .pod-meni { min-width: 0 !important; }

    /* горња трака: само контакти (језици иду поред хамбургера) */
    .traka-vrh .traka-jezici { display: none; }
    /* адреса се на мобилном не приказује (дугачка је; остаје у футеру) */
    .traka-kontakt .traka-adresa { display: none; }
    .traka-vrh-red { justify-content: center; gap: 6px; }
    .traka-kontakt { width: 100%; justify-content: center; gap: 6px; }
    .traka-kontakt span, .traka-kontakt a { max-width: 100%; padding: 3px 10px 3px 3px; font-size: 11.5px; gap: 6px; }
    .traka-kontakt svg { width: 22px; height: 22px; padding: 5px; }

    /* језици поред дугмета за мени (светла варијанта на белом заглављу) */
    .jezici-mobilni { display: flex; gap: 1px; background: var(--pozadina-siva); border-color: var(--ivica); padding: 2px; }
    .jezici-mobilni a { color: var(--plava); padding: 4px 6px; font-size: 10.5px; letter-spacing: 0; }
    .jezici-mobilni a:hover { background: rgba(16,60,98,.08); color: var(--plava-tamna); }
    .zaglavlje-alat { gap: 4px; }
    .meni-dugme { padding: 6px; }
    .meni-crta { width: 22px; }

    /* на мобилном нема слајдера — прво слика за дељење, па означени слајдови као боксови */
    .slajder { display: none; }
    .hero-mobilni { display: block; line-height: 0; }
    .hero-mobilni img { width: 100%; height: auto; display: block; }
    .boxovi { grid-template-columns: 1fr; }   /* једна колона — без прелива */

    /* слајд као box: цела слика (по ширини и висини), текст преко дна */
    .box.box-slajd-mobilni { display: block; min-height: 0; background: var(--plava-tamna); }
    .box-slajd-mobilni > img { position: static; width: 100%; height: auto; object-fit: contain; display: block; z-index: 0; }
    .box-slajd-mobilni::after { display: none; }
    .box-slajd-mobilni .box-telo {
        position: absolute; bottom: 0; left: 0; right: 0; z-index: 2;
        background: linear-gradient(0deg, rgba(8,32,54,.92), rgba(8,32,54,.55) 55%, transparent);
        padding-top: 46px;
    }

    /* дугме за затварање менија (горе десно у off-canvas менију) */
    .nav-zatvori {
        display: block; position: absolute; top: 14px; right: 14px;
        width: 40px; height: 40px; border: 0; border-radius: 10px; cursor: pointer;
        background: var(--pozadina-siva); color: var(--plava-tamna);
    }
    .nav-zatvori svg { width: 22px; height: 22px; }
    .nav-zatvori:hover { background: #eaeff5; }

    .meni-dugme { display: block; }
    .nav {
        position: fixed; top: 0; right: 0; width: 300px; max-width: 84vw; height: 100dvh;
        background: #fff; z-index: 150; overflow-y: auto;
        box-shadow: -8px 0 32px rgba(0,0,0,.18);
        padding: 70px 0 30px; align-self: auto;
        display: none;                       /* затворен: уклоњен из тока → без хоризонталног прелива */
    }
    .nav.otvoren { display: block; animation: nav-uklizi .25s ease; }
    .nav-stavka { display: block; }
    .nav-lista { flex-direction: column; align-items: stretch; }
    .nav-stavka > a {
        display: flex; justify-content: space-between;
        padding: 13px 24px; border-bottom: 1px solid var(--ivica); border-radius: 0;
    }
    .nav-stavka > a::after { content: none; }         /* без златне линије на мобилном */
    .nav-stavka:hover > a { background: none; }
    .nav-pretraga > a {
        width: auto; height: auto; margin-left: 0; border-radius: 0;
        justify-content: flex-start; padding: 13px 24px; background: none;
    }
    .nav-stavka.nav-pretraga:hover > a { transform: none; background: var(--pozadina-siva); color: var(--plava); }
    .zaglavlje.skupljeno .zaglavlje-red { min-height: 70px; }
    .zaglavlje.skupljeno .logo img { height: 44px; }
    .pod-meni {
        position: static; opacity: 1; visibility: visible; transform: none;
        border: 0; box-shadow: none; border-radius: 0; padding: 0;
        background: var(--pozadina-siva); display: none;
    }
    .pod-meni a:hover { padding-left: 36px; }
    .nav-stavka.otvorena > .pod-meni, .pod-meni li.otvorena > .pod-meni { display: block; }
    .pod-meni a { padding: 11px 36px; }
    .pod-meni-desno a { padding-left: 52px; }

    .strana-mreza { grid-template-columns: 1fr; }
    .slajder-strelica { display: none; }
}

@media print {
    .traka-vrh, .zaglavlje, .podnozje, .slajder-kontrole, .meni-dugme { display: none !important; }
}

/* ---------- подножје ---------- */

.podnozje {
    position: relative; overflow: hidden;
    background: var(--plava-tamna); color: #bfcfdf;
    margin-top: 48px;
}
.podnozje::before {                       /* златна нит преко врха подножја */
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
    background: linear-gradient(90deg, var(--plava-svetla), var(--zlatna) 40%, var(--zlatna-tamna) 62%, var(--plava-svetla));
}
.podnozje::after {                        /* топли сјај у углу */
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background: radial-gradient(circle at 88% -10%, rgba(201,151,28,.16), transparent 45%);
}
.podnozje > * { position: relative; z-index: 1; }
/* подножје користи ИСТИ .okvir као и садржај страна — леве/десне ивице се поклапају */
.podnozje a { color: #dfe9f2; }
.podnozje a:hover { color: #fff; }

/* истакнуте контакт картице у врху подножја */
.podnozje-istaknuto {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
    padding-top: clamp(34px, 4vw, 48px);
    margin-bottom: clamp(30px, 4vw, 44px);
}
.pi-kartica {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px;
    padding: 24px 20px; text-decoration: none;
    background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.09);
    border-radius: 14px;
    transition: background var(--prelaz), border-color var(--prelaz), transform var(--prelaz);
}
.pi-kartica:hover { background: rgba(255,255,255,.08); border-color: rgba(201,151,28,.5); transform: translateY(-3px); }
.pi-ikona {
    width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center;
    background: linear-gradient(135deg, var(--zlatna), var(--zlatna-tamna));
    color: #14213a; margin-bottom: 6px;
    box-shadow: 0 6px 16px rgba(201,151,28,.3);
}
.pi-ikona svg { width: 24px; height: 24px; }
.pi-naslov { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #9db3c8; }
.pi-tekst { color: #fff; font-weight: 600; font-size: 15px; }

.podnozje-mreza {
    display: grid; grid-template-columns: 1.7fr 1fr 1fr 1.1fr;
    gap: clamp(24px, 3vw, 48px);
    padding-top: clamp(30px, 4vw, 44px);
    padding-bottom: clamp(28px, 4vw, 40px);
    border-top: 1px solid rgba(255,255,255,.1);
}
.podnozje-kolona { min-width: 0; }
.podnozje-brend .podnozje-tekst { margin-bottom: 18px; }

.podnozje-logo { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.podnozje-logo img { height: 54px; width: auto; }
.podnozje-logo span {
    display: flex; flex-direction: column; gap: 2px;
    color: #fff; font-weight: 800; font-size: 17px; line-height: 1.25;
}
.podnozje-logo small { font-weight: 500; font-size: 12.5px; color: #9db3c8; letter-spacing: .06em; text-transform: uppercase; }

.podnozje-naslov {
    color: #fff; font-size: 15px; margin: 0 0 18px;
    text-transform: uppercase; letter-spacing: .08em;
}
.podnozje-naslov::after {
    content: ""; display: block; width: 42px; height: 3px; border-radius: 3px;
    background: linear-gradient(90deg, var(--zlatna), var(--zlatna-tamna));
    margin-top: 10px;
}
.podnozje-tekst { font-size: 14.5px; line-height: 1.65; margin: 0 0 14px; }

.podnozje-red { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 12px; font-size: 14.5px; line-height: 1.55; }
.podnozje-red svg {
    width: 32px; height: 32px; padding: 7px; flex: none; border-radius: 50%;
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.10);
    color: var(--zlatna);
}
.podnozje-red a { text-decoration: none; }
.podnozje-red a:hover { text-decoration: underline; }

.podnozje-linkovi { list-style: none; margin: 0; padding: 0; }
.podnozje-linkovi li { margin: 10px 0; }
.podnozje-linkovi a {
    display: inline-flex; align-items: center; gap: 9px;
    text-decoration: none; font-size: 14.5px;
    transition: transform var(--prelaz), color var(--prelaz);
}
.podnozje-linkovi a::before { content: "›"; color: var(--zlatna); font-weight: 800; font-size: 17px; line-height: 1; }
.podnozje-linkovi a:hover { transform: translateX(5px); }

.podnozje-drustvene { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.podnozje-drustvene a {
    width: 38px; height: 38px; display: grid; place-items: center;
    border-radius: 50%; color: #dfe9f2;
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
    transition: background var(--prelaz), color var(--prelaz), border-color var(--prelaz), transform var(--prelaz);
}
.podnozje-drustvene a:hover {
    background: var(--zlatna); border-color: var(--zlatna); color: #14213a; transform: translateY(-3px);
}
.podnozje-drustvene svg { width: 18px; height: 18px; }

.podnozje-dno-red {
    display: flex; justify-content: space-between; align-items: center;
    gap: 16px; flex-wrap: wrap; font-size: 13.5px;
    border-top: 1px solid rgba(255,255,255,.14);
    padding-top: 20px; padding-bottom: 26px;
}
.podnozje-dno-red p { margin: 0; }
.podnozje-ministarstvo {
    display: flex; align-items: center; gap: 11px;
    padding: 7px 18px 7px 8px; border-radius: 99px;
    background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.11);
    color: #dfe9f2; text-decoration: none; font-size: 13px;
    transition: background var(--prelaz), border-color var(--prelaz), color var(--prelaz);
}
.podnozje-ministarstvo img { height: 32px; width: auto; }
.podnozje-ministarstvo:hover { background: rgba(255,255,255,.12); border-color: rgba(201,151,28,.55); color: #fff; }
.offline { color: #e2b93b; }

.podnozje-spoljni a { display: inline-flex; align-items: center; gap: 8px; }
.podnozje-spoljni a::after {
    content: "↗"; font-size: 12px; opacity: .6;
}

@media (max-width: 980px) {
    .podnozje-mreza { grid-template-columns: 1fr 1fr; row-gap: 32px; }
    .podnozje-brend { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
    .podnozje-istaknuto { grid-template-columns: 1fr; max-width: 460px; margin-left: auto; margin-right: auto; }
}
@media (max-width: 560px) {
    /* подножје центрирано на мобилном (садржај померен у средину) */
    .podnozje-mreza { grid-template-columns: 1fr; text-align: center; }
    .podnozje-kolona { align-items: center; }
    .podnozje-naslov::after { margin-left: auto; margin-right: auto; }
    .podnozje-logo { justify-content: center; }
    .podnozje-red { justify-content: center; text-align: left; }
    .podnozje-drustvene { justify-content: center; }
    .podnozje-tekst { max-width: 440px; margin-left: auto; margin-right: auto; }
    .podnozje-dno-red { flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 14px; }
}

@keyframes nav-uklizi { from { transform: translateX(100%); } to { transform: translateX(0); } }