body { font-size: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem); line-height: 1.6; font-variant-numeric: tabular-nums; font-family: 'Archivo', ui-sans-serif, system-ui, sans-serif;}
.body { background-color: #F2F5F8!important;}
h1 { font-size: clamp(2.375rem, 1.6rem + 3.2vw, 4.625rem); font-weight: 800; font-stretch: 75%; line-height: 1.02; letter-spacing: -0.012em; text-wrap: balance; }
h2 { font-size: clamp(2.25rem, 1.9rem + 1.3vw, 2.875rem); font-weight: 800; font-stretch: 75%; }
h1, h2, h3, h4 {background: transparent!important; font-weight: 800!important; font-stretch: 75%; letter-spacing: -.012em;  line-height: 1.02!important; text-wrap: auto; white-space: normal!important;}
.btn{  padding: 12px 25px!important;border-radius: 4px; font: inherit; font-weight: 700!important;  font-size: 16px!important;  border: 0;  cursor: pointer; white-space: normal;  transition: transform .15s cubic-bezier(.2, .8, .2, 1), background-color .15s ease, color .15s ease;}
.btn:hover {text-decoration:unset!important;}
p {font-size: 17px;line-height: 1.65;color: #3b4a5c;  max-width: 68ch;}
.col-lg-9 ul li {font-size: 17px;line-height: 1.65;color: #3b4a5c;  max-width: 68ch; margin-bottom:12px;}
.col-lg-9 ul {margin-left:30px; margin-bottom:30px;}
.col-lg-9 ol li {font-size: 17px;line-height: 1.65;color: #3b4a5c;  max-width: 68ch; margin-bottom:12px;}
.col-lg-9 ol {margin-left:30px; margin-bottom:30px;}

:root {
    --brand: #0C549E;
    --ink:#0D1B2E;
}

/* ==== KOMPONENTE (dizajn v1 „Obrtnička pločica") ===================================
   Shared classes for every new Page Builder page. Same names as the design (docs/uo-dugo-selo),
   except where Bootstrap/Constructor already use the name: design .card -> .ui-card,
   .link -> .ui-link, .tab -> .ui-tab, .crumb -> .ui-crumb, .date -> .ui-date, .photo -> .ui-photo.
   Live examples with markup: entry "Komponente" (#275086, disabled; enable it in the CP to view /komponente)
   ================================================================================== */
:root {
    --brand-2: #0A4687;
    --ink-2: #3B4A5C;
    --ink-3: #55657A;
    --paper: #F2F5F8;
    --paper-2: #E6ECF2;
    --white: #FFFFFF;
    --line: #D3DBE5;
    --accent: #F2C230;
    --accent-2: #DDAA0E;
    --on-brand-2: #DCE8F7;
    --mark: #FFEC8A;
}
/* Type */
.cond { font-stretch: 75%; }
.semi { font-stretch: 87.5%; }
.h-d { font-weight: 800 !important; font-stretch: 75%; letter-spacing: -.012em; line-height: 1.02 !important; text-wrap: balance; }
.h3 { font-size: 25px; font-weight: 700 !important; font-stretch: 87.5%; line-height: 1.18 !important; letter-spacing: -.005em; text-wrap: balance; color: var(--ink); }
.h4 { font-size: 19px; font-weight: 700 !important; font-stretch: 87.5%; line-height: 1.25 !important; color: var(--ink); }
.lead { font-size: 19px; font-weight: 400; line-height: 1.55; color: var(--ink-2); max-width: 60ch; }
.meta { font-size: 14px; color: var(--ink-3); }
.ui-date { font-weight: 800; font-stretch: 75%; line-height: 1; }
.mark { background: var(--mark); box-shadow: 0 0 0 3px var(--mark); border-radius: 2px; padding: 0; }
/* Links */
.ui-link { color: var(--brand); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.ui-link:hover { text-decoration-thickness: 3px; color: var(--brand); }
.more { display: inline-flex; align-items: center; gap: 8px; color: var(--brand); font-weight: 700; font-size: 16px; text-decoration: none; }
.more:hover { color: var(--brand); text-decoration: underline; text-underline-offset: 4px; }
/* Buttons: <a class="btn btn-y">… (btn-y yellow, btn-b blue, btn-o outline, btn-w outline on blue) */
.btn.btn-y, .btn.btn-b, .btn.btn-o, .btn.btn-w { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; border: 0; border-radius: 4px; font-weight: 700; text-decoration: none; }
.btn.btn-y { background: var(--accent); color: var(--ink); }
.btn.btn-y:hover, .btn.btn-y:focus-visible { background: var(--accent-2); color: var(--ink); }
.btn.btn-b { background: var(--brand); color: #FFFFFF; }
.btn.btn-b:hover, .btn.btn-b:focus-visible { background: var(--brand-2); color: #FFFFFF; }
.btn.btn-o { background: transparent; color: var(--brand); box-shadow: inset 0 0 0 2px var(--brand); }
.btn.btn-o:hover, .btn.btn-o:focus-visible { background: var(--brand); color: #FFFFFF; }
.btn.btn-w { background: transparent; color: #FFFFFF; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .7); }
.btn.btn-w:hover, .btn.btn-w:focus-visible { background: #FFFFFF; color: var(--brand); }
.btn[disabled] { background: var(--paper-2) !important; color: #6F7C8E !important; cursor: not-allowed; box-shadow: none !important; }
/* Enamel plate */
.plate { background: var(--brand); color: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 4px var(--brand), inset 0 0 0 5.5px rgba(255, 255, 255, .85); padding: 14px 18px; }
.plate-name { font-weight: 800; font-stretch: 75%; text-transform: uppercase; letter-spacing: .025em; font-size: 20px; line-height: 1.1; }
.plate-sub { font-size: 13.5px; color: var(--on-brand-2); line-height: 1.35; }
/* Chips (filters, tags) */
.chip { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 15px; border-radius: 4px; background: var(--white); box-shadow: inset 0 0 0 1px var(--line); border: 0; font: inherit; font-size: 15px; font-weight: 600; color: var(--ink); cursor: pointer; white-space: nowrap; text-decoration: none; transition: box-shadow .15s ease, color .15s ease; }
.chip:hover { box-shadow: inset 0 0 0 1.5px var(--brand); color: var(--brand); }
.chip.on { background: var(--brand); color: #FFFFFF; box-shadow: none; }
.chip-n { font-weight: 500; color: var(--ink-3); }
.chip.on .chip-n { color: var(--on-brand-2); }
/* Card, rule, tabs, breadcrumb, photo, checkbox, icon */
.ui-card { background: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 1px var(--line); padding: 24px; }
.rule { height: 1px; background: var(--line); border: 0; margin: 0; }
.ui-tab { font: inherit; font-weight: 700; font-size: 16px; padding: 12px 2px; border: 0; background: none; color: var(--ink-3); cursor: pointer; box-shadow: inset 0 -2px 0 transparent; }
.ui-tab.on { color: var(--brand); box-shadow: inset 0 -3px 0 var(--brand); }
.ui-crumb { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 14px; color: var(--ink-3); }
.ui-crumb a { color: var(--ink-3); }
.ui-crumb a:hover { color: var(--brand); text-decoration: underline; }
.ui-photo { display: block; width: 100%; object-fit: cover; border-radius: 4px; }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; color: var(--ink-2); }
.check input { width: 20px; height: 20px; accent-color: var(--brand); margin: 2px 0 0; flex: none; }
.i { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.i-s { width: 17px; height: 17px; }
/* Yellow buttons inside dark boxes keep ink text (dev rule .on-dark a forced white) */
.najave-flex-right .on-dark a.btn-y, .on-dark a.btn.btn-y { color: var(--ink) !important; }
/* ==== /KOMPONENTE ==== */


.container-xl { max-width: 1800px;}
.wide .container-xl { max-width: 1800px;}
.mt-4, .my-4 { margin-top: 0 !important;}
.section-padding {padding:105px 0px;}
.section-pages {padding:35px 15px 90px;}
.section-white {background-color:#FFFFFF; padding-left:15px; padding-right:15px;}
.section-60 {padding:60px 0;}
.white-bg {background-color:#FFFFFF;}
.section-blue {background:#0C549E;}
.arrow-btn {padding: 0 !important; margin: 0!important;}
.arrow-btn:hover { text-decoration: underline;  text-underline-offset: 4px;}

#header .header-logo img { width: 348px;}
#header .header-logo {top: 41px;}
#header .header-nav.down-menu { min-height: 95px;  position: relative;}
#header .header-row.container-xl .nav.nav-pills a { position: relative; font: inherit; font-weight: 600; font-size: 20.5px;  background: none; border: 0; color:#0d1b2e; text-transform: none; cursor: pointer; display: inline-flex; align-items: center; }
#header .header-row.container-xl .nav.nav-pills a i:before { font-size: 16px; font-weight: 500; height: 2px;}
#header .header-row.container-xl .nav.nav-pills a i {margin-left: 10px; margin-top: -5px;}
.sticky-header-active #header .header-row.container-xl .nav.nav-pills a .fa-magnifying-glass {margin-top: -27px;}
#header .header-row.container-xl .nav.nav-pills a .fa-magnifying-glass:before {font-size: 19px;}
#header .header-nav.header-nav-line.header-nav-bottom-line nav>ul>li>a:before, #header .header-nav.header-nav-line.header-nav-bottom-line nav>ul>li:hover>a:before {height:2px;}
.header-nav-top-icon {display: flex;}
.header-nav-features i:hover:before {color:#0c549e;}
.header-nav-features i:before {color: #0d1b2e; font-size: 18px; transition: transform .15s cubic-bezier(.2, .8, .2, 1), background-color .15s ease, color .15s ease; z-index:0; position: relative;}
.header-nav-top li a{ color:#0d1b2e!important; padding: 0px 25px !important; font-size: 18.5px!important;}
.header-nav-top li a:before {display:none;}
.header-nav-top li {padding-right:0!important; height:58px; margin-left:20px; background:#f2c230!important; border-radius:4px; transition: transform .15s cubic-bezier(.2, .8, .2, 1), background-color .15s ease, color .15s ease;}
.header-nav-top li:hover {background:#ddaa0e!important;}
.header-nav-main { position: absolute; left: 0; right: 0;  display: flex; justify-content: center; align-items: center;  top: 0; bottom: 0;}
.dropdown-menu {background: #FFFFFF;  border-radius:4px!important; box-shadow: 0 18px 40px rgba(13, 27, 46, .16), 0 0 0 1px #D3DBE5!important; padding: 12px!important; top: 81px!important; border-radius:4px!important;}
.dropdown-menu li a {background-color: transparent; font-size: 17px !important;}
.dropdown-menu li a:hover{color:#0c549e!important;}
.header-nav-main nav, .header-nav-main nav > ul {height:auto!important;}
@media (min-width: 992px) {
#header .header-nav-main nav > ul > li > .dropdown-menu { top: 100% !important; visibility: hidden !important; opacity: 0 !important;  pointer-events: none !important; }
#header .header-nav-main nav > ul > li { display: flex;  align-items: center;  padding: 15px 0; position: relative;}
#header .header-nav-main nav > ul > li > .dropdown-menu lu {background:transparent!important;}
#header .header-nav-main nav > ul > li > .dropdown-menu::before { content: "";  position: absolute;   left: 0; right: 0;  top: -15px;  height: 15px;}
#header .header-nav-main nav > ul > li:hover > .dropdown-menu, #header .header-nav-main nav > ul > li:focus-within > .dropdown-menu {  margin-top: -13px !important; border-radius:4px!important;  visibility: visible !important; opacity: 1 !important;pointer-events: auto !important;}}
#header .header-nav-main.header-nav-main-dropdown-no-borders nav>ul>li.dropdown .dropdown-menu {border-radius:4px!important;}
#header .header-nav-main nav>ul>li.dropdown .dropdown-menu li:hover>a, #header .header-nav-main nav>ul>li.dropdown .dropdown-menu li:focus>a, #header .header-nav-main nav>ul>li.dropdown .dropdown-menu li.active>a, #header .header-nav-main nav>ul>li.dropdown .dropdown-menu li:active>a { background-color: transparent;}

.page-header-top { border-top: 1px solid #D3DBE5;}
.page-header-top .breadcrumb li{color:#55657a!important:}
.page-header-top .breadcrumb li a{color:#55657a!important:}
.page-header-top .breadcrumb a:hover{color:#0D1B2E!important:}
.page-header-top .breadcrumb { margin-bottom: 25px!important;}
.page-header-top h1 { font-size: 62px!important; max-width: 980px;}
.page-header-bottom {border-bottom: 1px solid rgba(255, 255, 255, .18);}
.page-header-bottom:after {display:none;}
.page-header-bottom .breadcrumb a {color:#FFFFFF!important;}
.page-header .breadcrumb>li+li:before {font-size: 12px;}
.page-header-title-border {display:none!important;}
.page-header {margin: 0!important;}

.heading-title h2{font-weight: 800!important; font-size: 46px;}
.heading-title p {font-size: 19px;  line-height: 1.55; color: #3B4A5C;  max-width: 60ch;}
.heading-title .button-tag { position: absolute; top: 0; bottom: 0;display: flex; right: 0; left: auto; align-items: normal; justify-content: end;}
.heading-title .button-tag a {font-size:18px!important; transition: transform .15s cubic-bezier(.2, .8, .2, 1), background-color .15s ease, color .15s ease;}
.heading-title .button-tag a:hover{text-decoration: underline; text-underline-offset: 4px;}
.heading-title .button-tag a i:before {font-size: 16px;}
.heading-title .button-tag a i {margin-left:8px;}
.heading-title-white p{ color: #DCE8F7;}
.heading-title .table td strong, .table th strong { font-size: 19px;font-weight: 700; font-stretch: 87.5%;  line-height: 1.25; color:#0D1B2E;}
.heading-title .table td a strong, .table th a strong{color:#3b4a5c!important;}
.heading-title .table td a strong:hover, .table th a strong:hover {color:#0D1B2E!important;}
.heading-title .table td, .table th { color: #3B4A5C; font-size: 17px;  line-height: 1.55; padding:20px 20px 20px 0!important; vertical-align: top; border-bottom: 1px solid #D3DBE5; border-top:0;}
.heading-title .table td p, .table th p{margin-bottom:0;}
.heading-btn {padding: 0 !important; margin: 0!important;}

.hero-sekcija {display:flex; align-items:center; background-color:#0C549E; }
.hero-sekcija .hero-left {padding: 80px 64px 60px; color:#FFFFFF; width: 58%; flex-grow: 0; flex-shrink: 0;}
.hero-sekcija .hero-left h1 { font-size: 84px; color: #FFFFFF;max-width: 820px; font-weight: 800!important;}
.hero-sekcija .hero-left p { color: #DCE8F7; font-size: 23px; margin-top: 25px;}
.hero-sekcija .swiper-slide img {width: 100%;  object-fit: cover; height: 100%; object-position: 92% 50%;} /* 11.10.: 1600px original, keep the roll-up banner (right) in frame */
.hero-svi-obrti{ padding: 0!important; margin: 0!important; text-decoration: underline; text-underline-offset: 5px; font-weight: 700; font-size: 16px; font-size: 16px !important;}
.hero-svi-obrti i {margin-right:8px;}
.hero-svi-obrti i:before {font-size: 20px;}
.swiper-slide-text {position: absolute; left: 28px; bottom: 28px; max-width: 380px; text-align: left; background:#0C549E; color: #fff; padding: 15px 18px; border-radius: 4px; box-shadow: inset 0 0 0 4px var(--brand), inset 0 0 0 5.5px rgba(255, 255, 255, .85); }
.swiper-slide-text p {font-size: 14.5px; color: #DCE8F7; line-height: 1.8; margin-bottom:0;}
.swiper-slide-text p strong {font-size: 16px; font-weight: 800; font-stretch: 75%; text-transform: uppercase; letter-spacing: .025em; line-height: 1.1; color:#FFFFFF; margin-bottom:10px; margin-bottom:5px!important;}

.plate { background:#0C549E;   color: #fff;  border-radius: 4px; box-shadow: inset 0 0 0 4px var(--brand), inset 0 0 0 5.5px rgba(255, 255, 255, .85); padding: 14px 18px;}
.plate-name {  font-weight: 800; font-stretch: 75%;  text-transform: uppercase;  letter-spacing: .025em;  font-size: 20px; line-height: 1.1;}

.carousel-hero { background: #FFFFFF;  border-bottom: 1px solid #D3DBE5; align-items: center; flex: none; padding-left: 64px; padding-right: 64px;}
.carousel-hero h4{font-size: 34px; color: #0C549E; margin-bottom: 6px;}
.carousel-hero img {display:none!important;}
.carousel-hero p {color:#55657A; margin-bottom:0;}
.carousel-hero .header-lists {display:none!important;}
.carousel-hero .owl-item {border-left: 1px solid #D3DBE5; padding: 10px 0 0 28px;}
.carousel-hero .owl-item:first-child {padding-left:0; border:0;}
.carousel-hero picture, .carousel-hero .owl-item img { display: none !important; } /* stats strip is numbers only: no Site Settings "If There Is No Picture" fallback */

.medijski-sponzor { background: #FFFFFF; padding: 50px 0;}
.medijski-sponzor table { width: 100%;}
.medijski-sponzor table td {padding:0; font-size: 17px; color: #55657A; border-left: 1px solid #D3DBE5; padding-left: 48px; border-top:0;}
.medijski-sponzor table td:first-child {border:0; padding-left:0;}
.medijski-sponzor table td strong{font-size: 32px; font-weight: 800;  font-stretch: 75%; color: #0D1B2E;}
.medijski-sponzor .table {margin-bottom:0!important;}

.glightbox-gallary {margin-left:0!important;}
.glightbox-gallary li {margin-bottom:0!important;}
.glightbox-gallary img {width:100%; transform:unset;}

.article-load-vijesti .col-xl-1-5 { flex: unset;  max-width:unset; }
.article-load-vijesti .sprig-component .row[id^="id-"] {  display: grid; grid-template-columns: 1.2fr 1fr; grid-template-rows: repeat(4, auto); gap: 24px; margin: 0; }
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:first-child { grid-row: 1 / span 4;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post {  display: flex; gap: 16px; }
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-image {  flex: 0 0 40%;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:first-child h4 {font-size: 34px !important; font-weight: 700 !important; font-stretch: 87.5%; letter-spacing: -.005em;text-wrap: balance; margin-top: 20px;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:first-child h4 a{color:#0d1b2e!important; transition: transform .15s cubic-bezier(.2, .8, .2, 1), background-color .15s ease, color .15s ease;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:first-child h4 a:hover {color:#0c549e!important;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:first-child .post {color: #55657a; font-size: 17px;}
.article-load-vijesti .img-thumbnail.img-thumbnail-no-borders { border-radius: 4px !important;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post {display: grid; grid-template-columns: 0.7fr 1fr; grid-template-rows: repeat(4, auto); gap: 24px; margin: 0;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-image {grid-row: 1 / span 4;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-content p {display:none;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) h4 { font-size: 23px!important;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) h4 a{color: #0d1b2e !important; transition: transform .15s cubic-bezier(.2, .8, .2, 1), background-color .15s ease, color .15s ease;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-image {margin-bottom:0!important;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) h4 a:hover {color:#0c549e!important;}
.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) { padding-top: 25px; border-top: 1px solid #D3DBE5; padding-left:0; padding-right:0;}

.article-load-vijesti-more {padding:0;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:first-child {  grid-column: 1 / -1; grid-template-columns: 1fr 0fr; display: grid; padding:0;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] {grid-template-columns:1fr;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:first-child .post { display: grid; grid-template-columns: 3fr 2fr; font-size: 15px;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:first-child .post #text {display:none!important;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:first-child .post-image{  margin-right: 50px; grid-row: 1 / span 4; display: grid; margin-bottom:0;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:first-child .post-content span a {font-weight: 600; font-size: 16px;  background: #0C549E; color:#FFFFFF; border-radius:4px; padding: 8px 19px;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:first-child .post-content { margin-top: 15px;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-content p {display:block;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post { display: grid; grid-template-columns: 1fr 2fr; gap:0; font-size: 15px;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post .post-meta {display:none;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) h4 { font-size: 28px !important; text-wrap: auto; margin-top: 14px;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-content span a {font-weight: 600;}
.article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-image {margin-right:40px;}

.article-load-vijesti-home .article-load {padding-left:0;}
.article-load-vijesti-home {padding-left:0;}
.vijesti-banner .heading-title {padding-left:0;}

.tab-content {background-color: transparent!important;}
.nav-tabs {  border-bottom: 0;}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {background-color: transparent!important; box-shadow: inset 0 -3px 0 #0c549e;}
.nav-tabs li .nav-link, .nav-tabs li .nav-link:hover { background: transparent;  border-bottom: none;  border-left: 0; border-right: 0;  border-top: 0; font-weight: 700; font-size: 16px;  color: #55657a !important;}
.nav-tabs li.active .nav-link, .nav-tabs li.active .nav-link:hover, .nav-tabs li.active .nav-link:focus { background-color: transparent!important; color: #0c549e; box-shadow: inset 0 -3px 0 #0c549e; border-top:0; }

.article-load-galerija .row > .article-load { flex: 0 0 33.3333%; max-width: 33.3333%; }
.article-load-galerija .row > .article-load:nth-child(5n + 1),.article-load-galerija .row > .article-load:nth-child(5n + 2) { flex: 0 0 50%;  max-width: 50%;}
.article-load-galerija h4 a {font-weight: 700; font-stretch: 87.5%; font-size: 28px;color: #0d1b2e;}
.article-load-galerija .post { color: #55657a; font-size: 16px;}
.article-load-galerija .post-image { margin-bottom: 20px!important;}
.galerija-detalji .glightbox-gallary img { max-height: 280px; width: 100%;  max-width: unset; transform: unset;}

.article-load-najave h4 { font-weight: 700 !important;  font-stretch: 87.5%; line-height: 1.25 !important;}
.article-load-najave h4 a {color:#0d1b2e!important;}
.article-load-najave .post-content p { color: #55657A; margin-bottom: 0; line-height:1.55;}
.article-load-najave .article-load { border-top: 1px solid #D3DBE5; padding:0;}
.article-load-najave .article-load:first-child {border-top:0;}
.article-load-najave .post-image {display:none!important;}
.article-load-najave .post-large {padding:15px 0;}
.article-load-najave .post-meta {display:none!important;}

.main .row {justify-content: space-between;}
.main .col-lg-3 {flex: 0 0 20%; max-width: 20%;}
.img-thumbnail img { border-radius: 4px!important;}
.img-thumbnail.img-thumbnail-no-borders { border-radius: 4px!important;}
.post-date {  background: #0c549e; color: #fff;  border-radius: 4px; box-shadow: inset 0 0 0 4px #0c549e, inset 0 0 0 5.5px rgba(255, 255, 255, .85); padding: 12px 0; margin-right: 30px!important; text-align: center; min-width: 90px;}
.recent-posts .date .day, article.post .post-date .day {  color: #FFFFFF; background: transparent;}
.recent-posts .date .month, article.post .post-date .month {  background-color: transparent;}

.sidebar .simple-post-list li:hover { background: transparent;}
.sidebar-settings .sidebar h5 {background-color: transparent;  color: #ffffff; padding: 15px 0px !important;  font-size: 22px;  color: #0D1B2E;}
.sidebar-settings .sidebar li a{ font-weight: 700; font-stretch: 87.5%;line-height: 1.25; color: #0d1b2e; font-size: 17px;}
.sidebar-settings .sidebar li {border-bottom:1px solid #D3DBE5;}
.sidebar-settings .sidebar .post-meta { background: #0c549e; color: #fff; margin-bottom: 12px; border-radius: 4px; box-shadow: inset 0 0 0 4px #0c549e, inset 0 0 0 5.5px rgba(255, 255, 255, .85); display: flex; flex-direction: column;align-items: center; padding: 8px 0; width: 100px;}
.sidebar-facebook { background: #fff; border-radius: 4px; box-shadow: inset 0 0 0 1px #d3dbe5;  padding: 22px;}
.sidebar-facebook ul {margin-bottom:0;}
.sidebar-facebook ul li i { width: 44px;  height: 44px; border-radius: 4px; background: #0C549E; color: #FFFFFF;  display: flex; align-items: center; justify-content: center;flex: none; margin-right: 15px !important;}
.sidebar-imenik { background: #0C549E; border-radius: 4px; padding: 26px!important; display: flex; flex-direction: column;}
.sidebar-imenik p {color:#dce8f7;}
.sidebar-imenik p strong {color: #FFFFFF; font-size: 20px; margin-bottom: 0px !important;}
.sidebar-imenik .col-sm-12 {padding:0;}
.sidebar-imenik .btn {margin:0!important; padding: 14px 25px !important; font-size: 18.5px !important;}
.sidebar-imenik .btn:hover {background:#ddaa0e!important;}
.sidebar-padding {display:flex; }
.sidebar-padding .sidebar-section {flex: 0 0 20%; max-width: 20%;}
.sidebar-padding .col-lg-3 { flex: 0 0 100%; max-width: 100%;}
.sidebar-najave .post-image{display:none!important;}

.najave-flex { display: flex; justify-content: space-between; width:1800px; margin: auto;padding: 0 15px;}
.najave-flex-right{ width: 725px;  flex-grow: 0;flex-shrink: 0;  margin-left: 100px;}
.najave-flex-left .heading-title { padding-left: 0;}
.najave-flex-right .on-dark a {color:#FFFFFF!important;}
.on-dark {background: #0C549E; color: #FFFFFF;  border-radius: 4px; padding: 48px; display: flex;  flex-direction: column;}
.on-dark h4 {font-size: 44px; color: #FFFFFF;  margin-bottom: 8px !important;}
.on-dark p { font-size: 17px; line-height: 1.6; color: #DCE8F7;}
.on-dark ul {list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr;  gap: 12px 20px; font-size: 16px;}
.on-dark li i:before {color: #F2C230; font-size: 20px;}
.on-dark a {color: #0d1b2e; text-decoration: none;}
.on-dark .btn-y {background:#f2c230; padding: 14px 25px !important; font-size:18px!important;}
.on-dark .btn-y:hover {background: #ddaa0e;}

.hero-sekcija-onama h2 {color:#0d1b2e!important; font-size: 84px; color: #FFFFFF;max-width: 820px; font-weight: 800!important;}
.hero-sekcija-onama .hero-left p { color: #3B4A5C;}
.hero-sekcija-onama {background:#FFFFFF;}
.hero-sekcija-onama .table td, .table th { border-top: 1px solid #D3DBE5; padding: 24px 0 0 0; color:#55657a; font-size:17px;}
.hero-sekcija-onama .table td strong, .table th strong {color:#0d1b2e; font-size: 21px;}
.hero-sekcija-onama .table {margin-top: 60px;}

.counter-about .counter strong { font-size: 64px;  color: #0C549E; font-weight: 800;  font-stretch: 75%;line-height: 1;}
.counter-about .counter p {font-size: 19px;color: #0d1b2e;font-weight: 600; margin-bottom:0;}
.counter-about .counters .col-sm-6 { padding: 28px!important; display: flex; flex-direction: column;gap: 6px;border-bottom: 1px solid #D3DBE5; border-left: 1px solid #D3DBE5; flex: 0 0 33%;  max-width: 33%;}
.counter-about .counters > .col-sm-6:nth-last-child(-n+3) { border-bottom: none;}
.counter-about .counters > .col-sm-6:first-child { border-left: none; padding-left:0!important;}
.counter-about .counters > .col-sm-6:nth-child(4) { border-left: none; padding-left:0!important;}
.counter-about .counters .counter { text-align: left;}
.flex-column-right .section {padding:0!important; margin:0; border-top: 2px solid #0C549E!important;}

.carousel-blue {padding:15px 0 0!important;}
.carousel-blue .owl-item { width: calc(100% / 4 - 20px) !important; margin-bottom:20px; border-radius: 4px;box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .75); padding: 22px 24px; min-height: 140px; justify-content: space-between;}
.carousel-blue .owl-item:last-child {background: #F2C230; box-shadow: inset 0 0 0 1.5px rgba(240, 194, 48, 1);}
.carousel-blue .header-lists {display:none!important;}
.carousel-blue .owl-item h4 {color: #FFFFFF;  text-transform: uppercase; font-size: 25px;}
.carousel-blue .owl-item p {color:#dce8f7; font-size:17px; margin-bottom:0; position:absolute; bottom:24px;}
.carousel-blue .owl-item h4 a {color: #0d1b2e!important;  text-transform: none!important; font-size: 25px!important;}
.carousel-blue .owl-item .arrow-btn {position:absolute; bottom:24px; text-transform:none!important; font-size:19px!important;}
.carousel-blue .box {max-width:1800px;}
.carousel-blue .owl-item img {display:none!important;}

.flex-col {display:flex; align-items: flex-start; justify-content: space-between;}
.flex-column-left {width:40%;}
.flex-column-right {width:54%; }

.column-half {display:flex; align-items: flex-start; justify-content: space-between;}
.column-half-left {width:47%;}
.column-half-right {width:47%; }

.single-post .post-content p {max-width: 105ch;}
.single-post .post-content span a {font-weight: 600; font-size: 16px;  background: #0C549E; color:#FFFFFF; border-radius:4px; padding: 8px 19px;}
.single-post .image-thumbnail-block img {border-radius:4px!important; margin-top:30px;}
.single-post p {font-size: 19px; line-height: 1.7;}
.single-post .col-md-6 {  flex: 0 0 47%; max-width: 47%;}
.single-post .col-md-6 .btn {color: #0d1b2e; padding: 0px !important; font-size: 18px !important;padding: 24px !important; background-color: #ffffff!important; border-radius: 4px;  box-shadow: inset 0 0 0 1px #d3dbe5; width: 100%; height: 100%;}
.single-post .col-md-6.text-right .btn{text-align: right!important;}
.single-post .col-md-6.text-left .btn{text-align: left!important;}
.single-post .link-tags-block {display:none!important;}
.btn:active {color:#0d1b2e!important;}

.link-box { background: #fff; border-radius: 4px; box-shadow: inset 0 0 0 1px #d3dbe5; padding: 32px 32px 22px!important; width:48%; height: 190px; display: flex;  align-items: center;}
.link-box  h2 { color: #0d1b2e;  font-weight: 700 !important;font-stretch: 87.5%; line-height: 1.25 !important; font-size: 27px;}
.link-box p {margin-bottom:10px; font-size: 20px;}
.link-box a {margin-bottom:10px; font-size: 20px!important;}
.link-box .heading.heading-border { margin-bottom: 0px;}
.link-box .col-sm-12 {padding:0;}

.kontakt-icons .feature-box { display: flex;border-bottom: 1px solid #D3DBE5; padding: 22px 0;}
.kontakt-icons .feature-box .feature-box-icon {background:transparent; display: flex; align-items: flex-start; justify-content: flex-start; padding: 0; width: 25px; height: auto;}
.kontakt-icons .feature-box .feature-box-icon i:before {color:#0c549e; font-size: 21px;}
.kontakt-icons .feature-box-info h4 p { font-size: 25px;  margin-bottom: 0; color: #0D1B2E;font-weight: 600;  font-stretch: 87.5%; line-height: 1.25;  text-underline-offset: 4px;}
.kontakt-icons .feature-box-info h4 {margin-bottom: 0 !important;}
.kontakt-icons .feature-box-info p {font-size: 16px;  color: #55657a; margin-bottom:0;}
.kontakt-icons .feature-box-info { padding-left: 40px;}
.kontakt-icons .row.featured-boxes-sidebar .col-lg-12 .row .col-lg-12{padding:0;}
.feature-box-info .mb-4 {display:none;}
.feature-box:hover, html .featured-boxes-full .featured-box-full-primary:hover { background: transparent;}
.karta {border-radius:4px;}
.karta .col-lg-12 {padding-left:0;}

.forma-pretraga{background: #FFFFFF; border-radius: 4px; padding: 22px; display: flex; flex-direction: column; gap: 14px; color: #0D1B2E; max-width: 80%; box-shadow: 0 20px 44px rgba(4,20,40,.28); margin: 0 15px 38px;}
.field{display:flex;flex-direction:column;gap:7px}
.label{font-size:14.5px;font-weight:700;color:var(--ink)}
.input{height:50px;border-radius:4px;border:1.5px solid #7A8799;background:#fff;padding:0 14px;font:inherit;font-size:16px;color:var(--ink);width:100%;appearance:none}
.input::placeholder{color:#5F6B7C}
.input:focus{border-color:var(--brand)}
.input.bad{border-color:#B3261E}
select.input{background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 22px,calc(100% - 15px) 22px;background-size:5px 5px;background-repeat:no-repeat;padding-right:38px}
textarea.input{height:auto;padding:12px 14px;min-height:130px;line-height:1.55;resize:vertical}

.footer-sekcija { border-top: 0!important;}
.footer-sekcija .col-lg-2 h5 {font-size: 19px; font-weight: 700;}
.footer-sekcija .col-lg-3 h5 {font-size: 19px; font-weight: 700;}
.footer-sekcija .col-lg-2 {margin-top:100px;}
.footer-sekcija .col-lg-2 .mb-1 {margin-bottom:12px!important;}
.footer-col-logo img{width:430px; margin-bottom: 25px;}
.footer-col-logo {padding-top:30px;}
.footer-col-logo p {font-size: 17px; line-height: 1.6; color: #DCE8F7; max-width: 52ch;}
.footer-col-kontakt {display: flex;align-items: center;  justify-content: end;}
.footer-col-sjediste a {text-decoration: underline; text-underline-offset: 4px;}
.footer-col-pratite .col-sm-12 {display:block!important;}
.footer-col-pratite p strong { font-size: 20px; font-weight: 800;  font-stretch: 75%; color: #FFFFFF; line-height: 44px;}
.footer-btn {background: #F2C230;}
.footer-btn:hover {background:#DDAA0E;}
.footer-btn:hover a{left: 0!important;}
.footer-btn a{ color: #FFFFFF !important;}
.footer-tel { display: flex; align-items: center; gap: 10px; font-size: 22px;  font-weight: 800; font-stretch: 75%; color: #FFFFFF; margin-right: 35px;}
.footer-tel a{ color: #FFFFFF!important;}
#footer a:not(.btn) { color: #DCE8F7;}
#footer p { color: #DCE8F7;}
/* ==== Početna: Imenik obrta (global element #273646) ==== */
/* Chips: tags2 block over "Obrti - Categories"; hash and count hidden via the tag-* hooks */
.imenik-home .container-xl:has(> .tag-link) { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 36px; margin-bottom: 36px; }
.imenik-home .tag-link { text-decoration: none; }
.imenik-home .tag-badge { display: inline-flex; align-items: center; height: 40px; padding: 0 15px !important; margin: 0 !important; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #D3DBE5; font-size: 15px; font-weight: 600; color: #0D1B2E; text-transform: none !important; letter-spacing: 0; white-space: nowrap; transition: box-shadow .15s ease, color .15s ease; }
.imenik-home .tag-link:hover .tag-badge, .imenik-home .tag-link:focus .tag-badge, .imenik-home .tag-link:focus-visible .tag-badge { background: #FFFFFF !important; box-shadow: inset 0 0 0 1.5px #0C549E; color: #0C549E; }
.imenik-home .tag-hash, .imenik-home .tag-count { display: none; }

/* Map | recently added */
.imenik-home__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 48px; align-items: start; }
.imenik-home__map { margin: 0; display: flex; flex-direction: column; gap: 12px; }
.imenik-home__map .map-new { border-radius: 4px; overflow: hidden; box-shadow: inset 0 0 0 1px #D3DBE5; }
.imenik-home__map .gm-map { width: 100% !important; height: 360px !important; }
.imenik-home .meta { font-size: 14px; color: #55657A; }
.imenik-home__recent { display: flex; flex-direction: column; gap: 14px; }
.imenik-home__recent .h3 { font-size: 25px; font-weight: 700 !important; font-stretch: 87.5%; line-height: 1.18 !important; color: #0D1B2E; margin: 0; }

/* Grid block rendered as enamel plates */
.imenik-recent { padding: 0; }
.imenik-recent .row { margin: 0; }
.imenik-recent .row > [class*="col-"], .imenik-recent .article-load { padding: 0; }
.imenik-recent .post { position: relative; margin: 0 0 14px; padding: 14px 18px; border-radius: 4px; background: #0C549E; color: #FFFFFF; box-shadow: inset 0 0 0 4px #0C549E, inset 0 0 0 5.5px rgba(255, 255, 255, .85); transition: background-color .15s ease; }
.imenik-recent .post:hover { background: #0A4687; box-shadow: inset 0 0 0 4px #0A4687, inset 0 0 0 5.5px rgba(255, 255, 255, .85); }
.imenik-recent .post-content { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 4px; align-items: start; }
.imenik-recent .post-content h4 { grid-column: 1; grid-row: 1; margin: 0 !important; font-size: 20px !important; font-weight: 800 !important; font-stretch: 75%; line-height: 1.1 !important; letter-spacing: .025em; text-transform: uppercase; }
.imenik-recent .post-content h4 a { color: #FFFFFF; text-decoration: none; }
.imenik-recent .post-content h4 a::after { content: ""; position: absolute; inset: 0; }
.imenik-recent .plate-place { grid-column: 2; grid-row: 1; justify-self: end; text-align: right; font-size: 13.5px; line-height: 1.35; color: #DCE8F7; white-space: nowrap; }
.imenik-recent .post-content p { grid-column: 1; grid-row: 2; margin: 0; max-width: none; font-size: 13.5px; line-height: 1.35; color: #DCE8F7; }
.imenik-recent .post-content .post-meta { display: none !important; }

.imenik-home__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 10px; }
.imenik-home__actions .arrow-btn { display: inline-flex; align-items: center; gap: 8px; color: #0C549E; font-weight: 700; font-size: 16px; }
.imenik-home__actions .btn-y { background: #F2C230; color: #0D1B2E; }
.imenik-home__actions .btn-y:hover { background: #DDAA0E; }

@media (min-width: 992px) {
    .imenik-home__grid { grid-template-columns: minmax(0, 1000fr) minmax(320px, 672fr); gap: 64px; }
    .imenik-home__map .gm-map { height: 600px !important; }
}
/* Djelatnost page (dizajn "Reference - Category"): plates in a 3-column grid with gutters */
.imenik-grid .row[id^="id-"] { margin: 0 -7px; justify-content: flex-start; }
.imenik-grid .article-load { padding: 0 7px !important; }
.imenik-grid .post { height: calc(100% - 14px); }
/* ==== /Imenik obrta ==== */

/* ==== Hero: tražilica imenika (code block #274659) ==== */
.forma-pretraga__row { display: grid; grid-template-columns: 1.25fr 1fr auto; gap: 12px; align-items: end; }
.forma-pretraga .i { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.forma-pretraga .forma-pretraga__btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 50px; margin: 0; padding: 0 30px !important; background: #F2C230; color: #0D1B2E; white-space: nowrap; }
.forma-pretraga .forma-pretraga__btn:hover, .forma-pretraga .forma-pretraga__btn:focus-visible { background: #DDAA0E; color: #0D1B2E; }
.forma-pretraga .input:focus { outline: none; border-color: #0C549E; box-shadow: 0 0 0 3px rgba(12, 84, 158, .18); }
@media (max-width: 767px) {
    .forma-pretraga { max-width: none; margin: 0 0 32px; }
    .forma-pretraga__row { grid-template-columns: minmax(0, 1fr); }
    .forma-pretraga .forma-pretraga__btn { width: 100%; }
}
/* ==== /Hero tražilica ==== */

/* ==== Hero: tablet/mobile (stack text above the photo so the search form gets full width) ==== */
@media (max-width: 991px) {
    .hero-sekcija { flex-direction: column; align-items: stretch; }
    .hero-sekcija .hero-left { width: 100%; padding: 48px 16px 40px; }
    .hero-sekcija .hero-left h1 { font-size: clamp(2.375rem, 1.6rem + 3.2vw, 4.625rem); }
    .hero-sekcija .hero-left p { font-size: 19px; margin-top: 16px; }
}
/* ==== /Hero mobile ==== */

/* ==== Imenik obrta page: filters | list | map (grids #274949 with both sidebars) ==== */
.imenik-list .card-filters { border: 0; border-bottom: 1px solid #D3DBE5; border-radius: 0; background: transparent; padding: 0 0 18px; margin-bottom: 22px; }
.imenik-list .card-filters:last-child { border-bottom: 0; }
.imenik-list .card-filters .card-header { background: transparent; border: 0; text-transform: none !important; }
.imenik-list .card-filters .card-header a { padding: 0 0 10px !important; font-size: 17px; font-weight: 700; color: #0D1B2E; text-decoration: none; pointer-events: none; }
.imenik-list .card-filters .card-header a::before, .imenik-list .card-filters .card-header a::after { display: none !important; }
.imenik-list .card-filters .collapse:not(.show) { display: block; }
.imenik-list .card-filters .card-body { background: transparent; }
.imenik-list .card-filters label { font-size: 15px; color: #0D1B2E; cursor: pointer; }
.imenik-list .filter-form-sidebar-input { width: 18px; height: 18px; accent-color: #0C549E; vertical-align: -3px; }
.imenik-list .card-filters input[type="search"], .imenik-list .card-filters input[type="text"] { height: 46px; border-radius: 4px; border: 1.5px solid #7A8799; background: #FFFFFF; padding: 0 12px; font-size: 15px; color: #0D1B2E; }
.imenik-list .card-filters input[type="search"]:focus, .imenik-list .card-filters input[type="text"]:focus { outline: none; border-color: #0C549E; box-shadow: 0 0 0 3px rgba(12, 84, 158, .18); }
.imenik-list .sidebar .gm-map { width: 100% !important; height: 480px !important; border-radius: 4px; }
@media (min-width: 992px) {
   /* .imenik-list .row > .col-lg-3:first-child { flex: 0 0 22%; max-width: 22%; }
    .imenik-list .row > .col-lg-6 { flex: 0 0 41%; max-width: 41%; }
    /*.imenik-list .row > .col-lg-6 + .col-lg-3 { flex: 0 0 37%; max-width: 37%; }*/
    /*.imenik-list .row > .col-lg-6 + .col-lg-3 .sidebar { position: sticky; top: 120px; }*/
    .imenik-list .sidebar .gm-map { height: 640px !important; }
}
@media (min-width: 992px) {
    /*.imenik-list .row > .col-lg-3:first-child { padding-right: 32px !important; }
    .imenik-list .row > .col-lg-6 + .col-lg-3 { padding-left: 32px !important; }*/
}
/* ==== /Imenik obrta page ==== */

/* ==== Profil obrta (dizajn "Reference - Entry" #4709) ==== */
.obrt-hero { background: #0C549E; color: #FFFFFF; padding: 40px 0 44px; }
.obrt-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: 13.5px; color: #DCE8F7; margin-bottom: 26px; }
.obrt-crumbs a { color: #DCE8F7; text-decoration: none; }
.obrt-crumbs a:hover { color: #FFFFFF; text-decoration: underline; text-underline-offset: 3px; }
.obrt-crumbs [aria-current] { color: #FFFFFF; }
.obrt-hero__row { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 36px; align-items: start; }
.obrt-hero__logo { width: 150px; height: 150px; border-radius: 4px; background: #FFFFFF; display: grid; place-items: center; overflow: hidden; }
.obrt-hero__logo img { width: 100%; height: 100%; object-fit: contain; padding: 12px; }
.obrt-hero__logo span { font-size: 64px; font-weight: 800; font-stretch: 75%; color: #0C549E; }
.obrt-hero h1 { color: #FFFFFF; text-transform: uppercase; letter-spacing: .02em; font-size: clamp(2.25rem, 1.6rem + 2.4vw, 4rem); margin: 0; }
.obrt-hero__sub { color: #DCE8F7; font-size: 19px; margin: 12px 0 0; max-width: 60ch; }
.obrt-hero__chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.obrt-chip { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border-radius: 4px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55); color: #FFFFFF; font-size: 14.5px; font-weight: 600; text-decoration: none; }
a.obrt-chip:hover { background: #FFFFFF; color: #0C549E; }
.obrt-chip--muted { box-shadow: none; padding-left: 0; color: #DCE8F7; font-weight: 500; }
.obrt-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; align-self: center; }
.obrt-hero__actions .btn { display: inline-flex; align-items: center; gap: 10px; margin: 0; }
.obrt-hero__actions .btn-y { background: #F2C230; color: #0D1B2E; }
.obrt-hero__actions .btn-y:hover { background: #DDAA0E; }
.obrt-btn-w { background: transparent; color: #FFFFFF; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .7); }
.obrt-btn-w:hover { background: #FFFFFF; color: #0C549E; }

.obrt-main { padding: 56px 0 96px; }
.obrt-main__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
.obrt-main__content h2 { font-size: 34px; color: #0D1B2E; margin: 48px 0 18px; }
.obrt-main__content > h2:first-child { margin-top: 0; }
.obrt-text p { font-size: 17px; line-height: 1.65; color: #3B4A5C; max-width: none; }  /* full column width, overrides the global p 68ch (Marinko 16.10.2026) */
.obrt-gallery__main { width: 100%; height: auto; aspect-ratio: 1240 / 680; object-fit: cover; border-radius: 4px; display: block; }
.obrt-gallery__thumbs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.obrt-gallery__thumbs button { padding: 0; border: 0; border-radius: 4px; overflow: hidden; background: #E3E9F0; cursor: pointer; box-shadow: inset 0 0 0 0 transparent; }
.obrt-gallery__thumbs button img { width: 100%; height: auto; aspect-ratio: 300 / 170; object-fit: cover; display: block; }
.obrt-gallery__thumbs button.is-active { outline: 3px solid #F2C230; outline-offset: -3px; }
.obrt-usluge { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 32px; }
.obrt-usluge li { display: flex; gap: 12px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid #D3DBE5; font-size: 16px; color: #0D1B2E; }
.obrt-usluge i { color: #0C549E; }

.obrt-main__side { display: flex; flex-direction: column; gap: 20px; }
.obrt-card { background: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 1px #D3DBE5; padding: 24px; }
.obrt-card h3 { display: flex; align-items: center; gap: 10px; font-size: 21px; color: #0D1B2E; margin: 0 0 16px; }
.obrt-card h3 i { color: #0C549E; font-size: 18px; }
.obrt-contact { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.obrt-contact li { display: flex; gap: 12px; align-items: baseline; font-size: 15.5px; color: #3B4A5C; overflow-wrap: anywhere; }
.obrt-contact i { color: #0C549E; width: 16px; flex: none; text-align: center; }
.obrt-contact a { color: #0D1B2E; }
.obrt-map { border-radius: 4px; overflow: hidden; }
.obrt-map .gm-map { width: 100% !important; height: 220px !important; }
.obrt-more { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-weight: 700; font-size: 15px; color: #0C549E; }
.obrt-hours { width: 100%; font-size: 15.5px; }
.obrt-hours th { font-weight: 500; color: #3B4A5C; padding: 6px 0; }
.obrt-hours td { text-align: right; color: #0D1B2E; font-weight: 600; padding: 6px 0; }
.obrt-hours td.is-closed { color: #55657A; font-weight: 500; }

.obrt-related { background: #FFFFFF; padding: 72px 0 88px; }
.obrt-related__head { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.obrt-related__head h2 { font-size: 40px; color: #0D1B2E; margin: 0; }
.obrt-related__head .arrow-btn { color: #0D1B2E; font-weight: 700; white-space: nowrap; }
.obrt-related__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.obrt-plate { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 4px; text-decoration: none; color: #FFFFFF; }
.obrt-plate:hover { background: #0A4687; box-shadow: inset 0 0 0 4px #0A4687, inset 0 0 0 5.5px rgba(255, 255, 255, .85); color: #FFFFFF; }
.obrt-plate__place { grid-column: 2; grid-row: 1; justify-self: end; font-size: 13.5px; color: #DCE8F7; white-space: nowrap; }
.obrt-plate__sub { grid-column: 1; font-size: 13.5px; color: #DCE8F7; line-height: 1.35; }
.obrt-cta { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 16px 18px; border-radius: 4px; box-shadow: inset 0 0 0 1px #D3DBE5; }
.obrt-cta strong { font-size: 17px; color: #0D1B2E; }
.obrt-cta p { margin: 4px 0 0; font-size: 14px; color: #55657A; }
.obrt-cta .btn-y { background: #F2C230; color: #0D1B2E; margin: 0; }
.obrt-cta .btn-y:hover { background: #DDAA0E; }

@media (min-width: 992px) {
    .obrt-main__grid { grid-template-columns: minmax(0, 1fr) 410px; gap: 64px; }
    .obrt-usluge { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .obrt-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .obrt-hero__row { grid-template-columns: 88px minmax(0, 1fr); gap: 18px; }
    .obrt-hero__logo { width: 88px; height: 88px; }
    .obrt-hero__logo span { font-size: 40px; }
    .obrt-hero__actions { grid-column: 1 / -1; }
    .obrt-hero__actions .btn { flex: 1 1 auto; justify-content: center; }
    .obrt-related__head h2 { font-size: 30px; }
}
/* ==== /Profil obrta ==== */

/* ==== Imenik obrta: obrt plates (card type grid-types-obrt) + map card ==== */
.imenik-list-grid .row[id^="id-"] { counter-reset: obrt; }
.col-lg-3.media-order.imenik-list-grid{padding-left:0;}
.obrt-item { counter-increment: obrt; margin-bottom: 14px; background: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 1px #D3DBE5; }
.obrt-item__plate { display: flex; align-items: center; gap: 14px; text-decoration: none; color: #FFFFFF; border-radius: 4px 4px 0 0; transition: background-color .15s ease; }
.obrt-item__plate:hover, .obrt-item.is-active .obrt-item__plate { background: #0A4687; box-shadow: inset 0 0 0 4px #0A4687, inset 0 0 0 5.5px rgba(255, 255, 255, .85); color: #FFFFFF; }
.obrt-item__num { flex: none; width: 28px; height: 28px; display: grid; place-items: center; background: #FFFFFF; color: #0C549E; border-radius: 3px; font-weight: 800; font-size: 14px; }
.obrt-item__num::before { content: counter(obrt); }
.obrt-item.is-active .obrt-item__num, .obrt-item:hover .obrt-item__num { background: #F2C230; color: #0D1B2E; }
.obrt-item__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.obrt-item__sub { font-size: 13.5px; line-height: 1.35; color: #DCE8F7; }
.obrt-item__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 15px 16px; font-size: 14px; color: #3B4A5C; }
.obrt-item__foot i { color: #55657A; margin-right: 8px; }
.obrt-item__foot a { font-weight: 700; color: #0D1B2E; white-space: nowrap; text-decoration: none; }
.obrt-item__foot a:hover { color: #0C549E; }
.imenik-list .map-new { position: relative; }
.imenik-map-card { position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 5; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 16px; background: #FFFFFF; border-radius: 4px; box-shadow: 0 8px 24px rgba(13, 27, 46, .2); text-align: left; }
.imenik-map-card strong { display: block; font-size: 17px; color: #0D1B2E; }
.imenik-map-card span { font-size: 13.5px; color: #55657A; }
.imenik-map-card .btn { background: #0C549E; color: #FFFFFF; margin: 0; }
.imenik-map-card .btn:hover { background: #0A4687; color: #FFFFFF; }
.imenik-home__map .map-new { position: relative; }  /* homepage map card (other-js homePins) anchors to the map, 16.10.2026 */
/* ==== /Imenik obrta plates ==== */

/* ==== Upis obrta / Moj obrt (templates/_obrti) ==== */
.upis-page { padding: 32px 0 96px; }
.upis-lead { font-size: 19px; line-height: 1.55; color: #3B4A5C; max-width: 60ch; margin: 0 0 32px; }
.upis-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; }
.upis-layout--narrow { max-width: 900px; }
.upis-form fieldset { border: 0; padding: 0; margin: 0 0 44px; }
.upis-form legend { font-size: 28px; font-weight: 800; font-stretch: 75%; color: #0D1B2E; margin-bottom: 18px; }
.upis-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px 20px; }
.upis-form .field { margin-bottom: 18px; }
.upis-grid .field { margin-bottom: 0; }
.upis-help { font-size: 15px; color: #55657A; margin: 6px 0 0; max-width: none; margin-bottom: 15px;}
.upis-opt { font-weight: 400; color: #55657A; }
.upis-err { font-size: 13.5px; color: #B3261E; font-weight: 600; margin: 6px 0 0; }
.upis-form .input.is-bad, .upis-drop.is-bad { border-color: #B3261E !important; box-shadow: 0 0 0 1px #B3261E; }
.upis-alert { padding: 14px 18px; margin-bottom: 24px; border-radius: 4px; background: #FDECEA; color: #8C1D18; font-weight: 600; }
.upis-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.upis-form textarea.input { height: auto; padding: 12px 14px; line-height: 1.55; resize: vertical; }
.upis-map { margin-top: 10px; border-radius: 4px; overflow: hidden; box-shadow: inset 0 0 0 1px #D3DBE5; }
.upis-map .gm-map { width: 100% !important; height: 320px !important; }
.upis-files { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.upis-drop { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 120px; padding: 18px; border: 1.5px dashed #7A8799; border-radius: 4px; background: #FFFFFF; color: #3B4A5C; font-size: 14px; text-align: center; cursor: pointer; }
.upis-drop:hover { border-color: #0C549E; }
.upis-drop strong { color: #0C549E; }
.upis-drop small { color: #55657A; }
.upis-drop i { font-size: 18px; color: #3B4A5C; }
.upis-drop input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.upis-thumb { width: 96px; height: 96px; object-fit: contain; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #D3DBE5; margin-bottom: 8px; }
.upis-photos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 10px; }
.upis-photo { position: relative; margin: 0; cursor: pointer; }
.upis-photo img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 4px; display: block; }
.upis-photo__badge { position: absolute; top: 6px; left: 6px; background: #F2C230; color: #0D1B2E; font-size: 12px; font-weight: 700; padding: 2px 6px; border-radius: 3px; }
.upis-photo__rm { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #3B4A5C; margin-top: 4px; }
.upis-hours { background: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 1px #D3DBE5; padding: 6px 16px; }
.upis-hours__row { display: grid; grid-template-columns: 1fr; gap: 8px; align-items: center; padding: 12px 0; border-bottom: 1px solid #E3E9F0; }
.upis-hours__row:last-of-type { border-bottom: 0; }
.upis-hours__row .input { height: 42px; }
.upis-hours__row.is-closed .input { background: #E3E9F0; }
.upis-hours__row > span { color: #55657A; font-size: 14px; }
.upis-check { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; color: #3B4A5C; margin: 10px 0 0; cursor: pointer; }
.upis-check input { width: 18px; height: 18px; margin-top: 2px; accent-color: #0C549E; flex: none; }
.upis-check a { color: #0D1B2E; font-weight: 700; }
.upis-submit { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding-top: 24px; border-top: 1px solid #D3DBE5; }
.upis-submit .btn-y, .upis-page .btn-y { background: #F2C230; color: #0D1B2E; margin: 0; }
.upis-page .btn-y:hover { background: #DDAA0E; }
.upis-btn-o { background: transparent; color: #0C549E; box-shadow: inset 0 0 0 2px #0C549E; margin: 0; }
.upis-btn-o:hover { background: #0C549E; color: #FFFFFF; }
.upis-btn-b { background: #0C549E; color: #FFFFFF; margin: 0; }
.upis-btn-b:hover { background: #0A4687; color: #FFFFFF; }
.upis-side { display: flex; flex-direction: column; gap: 20px; }
.upis-side__label { font-size: 13.5px; font-weight: 700; color: #0D1B2E; margin: 0 0 -10px; }
.upis-preview .obrt-item__plate { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; border-radius: 4px 4px 0 0; cursor: default; }
.upis-preview__place { font-size: 13.5px; color: #DCE8F7; white-space: nowrap; }
.upis-preview__profil { font-weight: 700; color: #0C549E; }
.upis-loginform .field { margin-bottom: 14px; }
.upis-loginform__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.upis-loginform__row a { font-size: 14px; font-weight: 700; color: #0D1B2E; }
.upis-helpline { position: relative; padding-left: 26px; font-size: 14px; color: #3B4A5C; max-width: none; }
.upis-helpline i { position: absolute; left: 0; top: 4px; color: #0C549E; }
.upis-done__card { max-width: 720px; margin: 24px auto; text-align: center; padding: 48px 32px; }
.upis-done__icon { font-size: 48px; color: #1E7B34; margin-bottom: 12px; }
.upis-done__card h2 { color: #0D1B2E; }
.upis-done__card p { margin: 12px auto 0; }
.upis-done__actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
.moj-top { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.moj-top__actions { display: flex; align-items: center; gap: 18px; }
.moj-logout { font-weight: 700; color: #0D1B2E; }
.moj-notice { display: flex; gap: 14px; padding: 16px 20px; margin-bottom: 24px; background: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 1px #D3DBE5; border-top: 3px solid #F2C230; }
.moj-notice i { color: #0C549E; margin-top: 4px; }
.moj-notice p { margin: 4px 0 0; font-size: 14.5px; color: #3B4A5C; }
.moj-notice--ok { border-top-color: #1E7B34; }
.moj-notice--ok i { color: #1E7B34; }
.moj-status { margin: 0; padding: 12px 16px; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.moj-status div { display: flex; justify-content: space-between; gap: 12px; }
.moj-status dt { font-weight: 400; color: #55657A; }
.moj-status dd { margin: 0; color: #0D1B2E; text-align: right; }
.moj-status dd.is-live { color: #1E7B34; font-weight: 700; }
.moj-status dd.is-pending { color: #8A6100; font-weight: 700; }
@media (min-width: 768px) {
    .upis-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .upis-files { grid-template-columns: 180px minmax(0, 1fr); }
    .upis-hours__row { grid-template-columns: 180px 130px auto 130px 1fr; gap: 14px; }
    .upis-hours__row .upis-check { justify-self: end; margin: 0; }
    .upis-layout--narrow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
    .upis-layout { grid-template-columns: minmax(0, 1fr) 400px; gap: 64px; }
    .upis-layout--narrow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
    .upis-side { position: sticky; top: 130px; }
}
/* ==== /Upis obrta ==== */

/* ==== Mobile / tablet: header, Najave, stats carousel, sponsors, news sidebar ==== */
.najave-flex { width: auto; max-width: 1800px; }
.hero-sekcija { overflow: hidden; }
.main { overflow-x: clip; }
.footer-sekcija img, .main img { max-width: 100%; height: auto; }
@media (max-width: 1199px) {
    .najave-flex-right { width: 46%; margin-left: 48px; }
}
@media (max-width: 991px) {
    #header .header-logo { top: 42px; }
    #header .header-logo img { width: 210px; }
    #header .header-nav.down-menu { min-height: 72px; display: flex; justify-content: flex-end; align-items: center; }
    #header .desktopAndMobileClass:has(.header-btn-collapse-nav) { order: 5; }
    #header .header-btn-collapse-nav { background: transparent !important; color: #0D1B2E !important; box-shadow: none !important; width: 44px; height: 44px; padding: 0 !important; margin: 0 !important; }
    #header .header-btn-collapse-nav i { font-size: 22px; color: #0D1B2E; }
    #header .header-nav-main nav > ul > li > a.active { color: #0C549E !important; background: transparent !important; }
    .najave-flex { flex-direction: column; padding: 0 16px; }
    .najave-flex-right { width: 100%; margin: 32px 0 0; }
    .carousel-hero { padding-left: 16px; padding-right: 16px; }
    .medijski-sponzor table, .medijski-sponzor tbody, .medijski-sponzor tr { display: block; width: 100%; }
    .medijski-sponzor table td { display: block; border-left: 0; border-top: 1px solid #D3DBE5; padding: 16px 0 !important; }
    .medijski-sponzor table td:first-child { border-top: 0; }
    .sidebar-padding { flex-wrap: wrap; }
    .sidebar-padding .vijesti-banner, .sidebar-padding .sidebar-section { flex: 0 0 100%; max-width: 100%; width: 100%; margin-left: 0; }
    .heading-title h2 { font-size: 34px;  margin-bottom: 0 !important;}
}
@media (max-width: 767px) {
    .section-padding { padding: 64px 0; }
}
@media (max-width: 767px) {
    .article-load-vijesti .sprig-component .row[id^="id-"] { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: 20px; }
    .article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:first-child { grid-row: auto; }
    .article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:first-child h4 { font-size: 26px !important; }
    /*.article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post { grid-template-columns: 110px minmax(0, 1fr); grid-template-rows: none; gap: 14px; }
    .article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-image, .article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-image { grid-column: 1; grid-row: 1; }
    .article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-content, .article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-content { grid-column: 2; grid-row: 1; }*/
    .article-load-vijesti .sprig-component .row[id^="id-"] > .article-load:not(:first-child) h4 { font-size: 22px !important; line-height: 1.2 !important; margin-top:10px; }
    .article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:first-child, .article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:first-child .post { grid-template-columns: minmax(0, 1fr); }
    .article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:first-child .post-image, .article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post-image { margin-right: 0; grid-row: auto; }
    .article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) .post { grid-template-columns: 110px minmax(0, 1fr); gap: 14px; }
    .article-load-vijesti-more .sprig-component .row[id^="id-"] > .article-load:not(:first-child) h4 { font-size: 20px !important; }
}
/* ==== /Mobile ==== */

/* ==== Hero: instant search suggestions (Datastar, _obrti/instant.twig) ==== */
.forma-pretraga__q { position: relative; }
.instant-results { display: none; position: absolute; left: 0; right: 0; top: 100%; z-index: 20; margin-top: 6px; background: #FFFFFF; border-radius: 4px; box-shadow: 0 16px 40px rgba(4, 20, 40, .28), inset 0 0 0 1px #D3DBE5; padding: 6px; max-height: 420px; overflow: auto; }
.forma-pretraga__q:focus-within .instant-results.is-open { display: block; }
.instant-item { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 10px 12px; border-radius: 3px; text-decoration: none; color: #0D1B2E; }
.instant-item:hover, .instant-item:focus { background: #EEF3F9; outline: none; }
.instant-item__name { font-weight: 700; }
.instant-item__meta { font-size: 13.5px; color: #55657A; text-align: right; }
.instant-empty { margin: 0; padding: 10px 12px; font-size: 15px; color: #3B4A5C; }
.instant-all { display: flex; align-items: center; gap: 8px; padding: 10px 12px; margin-top: 4px; border-top: 1px solid #E3E9F0; font-weight: 700; color: #0C549E; text-decoration: none; }
@media (max-width: 767px) { .instant-item { flex-direction: column; gap: 2px; } .instant-item__meta { text-align: left; } }
/* ==== /Instant search ==== */

/* ==== Upis / Moj obrt: submit loader ==== */
.upis-submit .btn.is-sending { display: inline-flex; align-items: center; gap: 10px; cursor: progress; opacity: .85; }
.upis-spinner { width: 16px; height: 16px; border: 2px solid rgba(13, 27, 46, .25); border-top-color: #0D1B2E; border-radius: 50%; animation: upis-spin .7s linear infinite; }
@keyframes upis-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .upis-spinner { animation-duration: 2s; } }
/* ==== /submit loader ==== */

/* ==== Oglasi: slots A (top) and B (side), house ad until a plugin is chosen ==== */
.oglas-top { background: #F2F5F8; padding: 10px 16px; display: flex; justify-content: center; }
.oglas-top--m { display: none; }
.oglas-top .oglas__house { margin-bottom: 0; } /* top band: ad centred, 10px above and below (design 120 band, 100 ad); margin-bottom stays for B in sidebars */
.oglas { display: block; margin: 0 auto; width: 100%; max-width: var(--oglas-w); }
.oglas__house { display: flex; flex-direction: column; align-items: center; justify-content: center; margin-bottom:25px; gap: 2px; width: 100%; aspect-ratio: calc(var(--oglas-w) / var(--oglas-h)); max-height: var(--oglas-h); background: #E3E9F0; box-shadow: inset 0 0 0 1px #D3DBE5; border-radius: 4px; text-decoration: none; color: #3B4A5C; text-align: center; padding: 8px; }
.oglas__house:hover { box-shadow: inset 0 0 0 1.5px #0C549E; color: #0C549E; }
.oglas__label { font-size: 12px; color: #55657A; }
.oglas__house strong { font-size: 14px; font-weight: 700; }
.oglas__cta { font-size: 12.5px; color: #55657A; }
.oglas--a .oglas__cta { display: none; }
.oglas__dim--m { display: none; }
.oglas--b { margin-top: 20px; }
.oglas--b .oglas__house { gap: 6px; }
@media (max-width: 991px) {
    .oglas-top--d { display: none; }
    .oglas-top--m { display: flex; }
    .oglas { max-width: var(--oglas-mw); }
    .oglas__house { aspect-ratio: calc(var(--oglas-mw) / var(--oglas-mh)); max-height: var(--oglas-mh); }
    .oglas__dim--d { display: none; }
    .oglas__dim--m { display: inline; }
}
/* ==== /Oglasi ==== */

/* ==== Pop-up C: najava in the homepage corner (Info and Marketing, contentPopup) ==== */
.swal2-popup.contentPopup-popup { width: 400px !important; max-width: calc(100vw - 32px); padding: 20px 22px 18px !important; border-radius: 4px; box-shadow: 0 16px 40px rgba(4, 20, 40, .28); font-family: inherit; text-align: left; }
.contentPopup-popup .swal2-title { font-size: 13px !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: .04em; color: #0C549E; padding: 0 !important; margin: 0 0 6px; text-align: left; }
.contentPopup-popup .swal2-html-container { margin: 0 !important; padding: 0 !important; text-align: left; }
.contentPopup-popup .contentPopup-title { font-size: 21px; font-weight: 800; font-stretch: 75%; line-height: 1.15; color: #0D1B2E; margin-bottom: 8px; }
.contentPopup-popup .contentPopup-text p { font-size: 15px; color: #3B4A5C; margin: 0 0 6px; }
.contentPopup-popup .contentPopup-text a { font-weight: 700; color: #0C549E; }
.contentPopup-popup .custom-close-button { color: #55657A; }
.contentPopup-popup .swal2-timer-progress-bar { background: #F2C230; }
.swal2-popup.contentPopup-popup { height: auto !important; min-height: 0 !important; max-height: none !important; grid-template-rows: auto auto auto !important; align-content: start !important; }
.contentPopup-popup .swal2-title, .contentPopup-popup .swal2-html-container { align-self: start !important; height: auto !important; min-height: 0 !important; }
.contentPopup-popup .contentPopup-content { display: block !important; height: auto !important; min-height: 0 !important; }
.contentPopup-popup .contentPopup-text p:last-child { margin-bottom: 0; }
.contentPopup-popup .contentPopup-inner { padding: 0 !important; }
.contentPopup-popup .contentPopup-title { padding: 0 32px 0 0 !important; border: 0 !important; }
.contentPopup-popup .contentPopup-text { padding: 0 !important; border: 0 !important; }
/* ==== /Pop-up C ==== */

/* ==== Pop-ups (Info and Marketing): brand look for Welcome Message, Formie Pop-Up and the top notice bar ==== */
.swal2-popup.welcomeMsg-popup, .swal2-popup.dropdownMenu-popup, .swal2-popup.custom-popup, .swal2-popup.promoBanner-popup, .swal2-popup.timeBanner-popup, .swal2-popup.couponCode-popup { font-family: inherit; border-radius: 4px; box-shadow: 0 16px 40px rgba(4, 20, 40, .28); }
.swal2-popup .custom-close-button { color: #55657A !important; }
.swal2-popup .custom-close-button:focus { box-shadow: none; }
.swal2-popup .swal2-timer-progress-bar { background: #F2C230 !important; }

/* Welcome Message / Formie Pop-Up (both use welcomeMsg-*) */
.swal2-popup.welcomeMsg-popup { width: 440px !important; max-width: calc(100vw - 32px); padding: 24px 24px 20px !important; text-align: left; height: auto !important; min-height: 0 !important; grid-template-rows: auto auto auto !important; align-content: start !important; }
.welcomeMsg-popup .swal2-title { font-size: 13px !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: .04em; color: #0C549E !important; padding: 0 !important; margin: 0 0 6px !important; text-align: left; line-height: 1.2 !important; }
.welcomeMsg-popup .swal2-html-container { margin: 0 !important; padding: 0 !important; text-align: left; overflow: visible; }
.welcomeMsg-popup .welcomeMsg-content { display: block !important; padding: 0 !important; height: auto !important; }
.welcomeMsg-popup .welcomeMsg-title { font-size: 24px; font-weight: 800; font-stretch: 75%; line-height: 1.1; color: #0D1B2E; margin: 0 32px 10px 0; padding: 0; }
.welcomeMsg-popup .welcomeMsg-text, .welcomeMsg-popup .welcomeMsg-text p { font-size: 15.5px; line-height: 1.55; color: #3B4A5C; margin: 0; padding: 0; max-width: none; }
.welcomeMsg-popup .welcomeMsg-link { display: inline-flex; margin-top: 16px !important; background: #F2C230 !important; color: #0D1B2E !important; border: 0; }
.welcomeMsg-popup .welcomeMsg-link:hover { background: #DDAA0E !important; }
.welcomeMsg-popup form { margin-top: 14px; text-align: left; }

/* Dropdown TOP Banner = notice bar across the top */
.swal2-container.swal2-top:has(.dropdownMenu-popup) { padding: 0 !important; }
.swal2-popup.dropdownMenu-popup { width: 100% !important; max-width: none; border-radius: 0; box-shadow: 0 4px 14px rgba(13, 27, 46, .18); }
.dropdownMenu-popup .swal2-html-container { margin: 0 !important; padding: 0 !important; }
.dropdownMenu-popup .dropdownMenu-content { flex-direction: row !important; flex-wrap: wrap; justify-content: center; gap: 12px 16px; padding: 12px 56px 12px 16px; }
.dropdownMenu-popup .dropdownMenu-icon, .dropdownMenu-popup .dropdownMenu-title { padding: 0 !important; color: #0D1B2E !important; font-size: 15px !important; font-weight: 500 !important; }
.dropdownMenu-popup .dropdownMenu-title p { margin: 0; color: #0D1B2E; max-width: none; font-size: 15px; }
.dropdownMenu-popup .dropdownMenu-link { background: #0D1B2E !important; color: #FFFFFF !important; padding: 8px 16px !important; font-size: 14px !important; border-radius: 4px; }
.dropdownMenu-popup .custom-close-button { color: #0D1B2E !important; }
/* ==== /Pop-ups brand ==== */

/* ==== Greetings: centred Content Popup + Simple image pop-up ==== */
.swal2-container.swal2-center .swal2-popup.contentPopup-popup { width: 480px !important; padding: 32px 32px 26px !important; text-align: center; border-top: 4px solid #F2C230; }
.swal2-container.swal2-center .contentPopup-popup .swal2-title, .swal2-container.swal2-center .contentPopup-popup .swal2-html-container { text-align: center; }
.swal2-container.swal2-center .contentPopup-popup .contentPopup-title { font-size: 32px; padding: 0 28px !important; margin-bottom: 12px; }
.swal2-container.swal2-center .contentPopup-popup .contentPopup-text p { font-size: 16.5px; line-height: 1.55; }
.contentPopup-popup .cestitka-potpis { margin-top: 14px !important; font-weight: 700; color: #0C549E !important; font-size: 15px !important; }
.swal2-popup.custom-popup { padding: 0 !important; overflow: hidden; width: auto !important; max-width: min(640px, calc(100vw - 32px)); }
.custom-popup .custom-popup-image { display: block; width: 100%; height: auto; border-radius: 4px; }
/* ==== /Greetings ==== */

/* ==== Imenik filters: options on the page background, ink text, search icon ==== */
.imenik-list .card-filters .card-body, .imenik-list .card-filters .list-group, .imenik-list .card-filters .list-group-item, .imenik-list .card-filters .catfilter { background: transparent !important; border: 0 !important; }
.imenik-list .card-filters .list-group-item { padding: 6px 0 !important; align-items: center; }
.imenik-list .card-filters label, .imenik-list .card-filters .list-group-item > span:not(.ml-auto) { color: #0D1B2E !important; font-size: 15.5px; }
.imenik-list .card-filters .list-group-item .ml-auto { color: #55657A; font-size: 14px; }
.imenik-list .card-filters input[type="search"], .imenik-list .card-filters input[type="text"] { padding-left: 40px !important; background: #FFFFFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2355657A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='10' r='7'/%3E%3Cpath d='M21 21l-6-6'/%3E%3C/svg%3E") no-repeat 12px 50%; }
.imenik-list .card-filters input::placeholder { color: #7A8799; }

.imenik-list .search-form.input-group, .imenik-list .card-filters .list-group-item { overflow: visible !important; }
.imenik-list .search-form .form-control { width: 100% !important; max-width: 100%; margin: 0 !important; flex: 1 1 100%; }
/* ==== /Imenik filters ==== */

/* ==== /oglasavanje (Oglasavanje.dc.html) ==== */
.ogl { padding: 24px 0 96px; }
.ogl-lead { font-size: 19px; line-height: 1.55; color: #3B4A5C; max-width: 60ch; margin: 0 0 40px; }
.ogl-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 48px; align-items: start; }
.ogl-pos { list-style: none; margin: 0; padding: 0; }
.ogl-pos li { border-bottom: 1px solid #D3DBE5; }
.ogl-pos__item { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 20px; align-items: start; width: 100%; padding: 24px 0; background: none; border: 0; text-align: left; cursor: pointer; font: inherit; }
.ogl-pos__key { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 3px; background: #0C549E; color: #FFFFFF; font-weight: 800; font-size: 20px; }
.ogl-pos__item.is-on .ogl-pos__key { background: #F2C230; color: #0D1B2E; }
.ogl-pos__text { display: flex; flex-direction: column; gap: 6px; }
.ogl-pos__text strong { font-size: 25px; font-weight: 700; font-stretch: 87.5%; color: #0D1B2E; line-height: 1.15; }
.ogl-pos__text span { font-size: 16px; line-height: 1.55; color: #3B4A5C; }
.ogl-pos__size { font-size: 25px; font-weight: 800; font-stretch: 75%; color: #0C549E; white-space: nowrap; }
.ogl-pos__item:hover .ogl-pos__text strong { color: #0C549E; }
.ogl-pos__item:focus-visible { outline: 3px solid #0C549E; outline-offset: 4px; }
.ogl-box { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 32px; padding: 26px 28px; background: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 1px #D3DBE5; }
.ogl-box h3 { font-size: 19px; color: #0D1B2E; margin: 0 0 12px; }
.ogl-box ul { margin: 0; padding-left: 20px; }
.ogl-box li, .ogl-box p { font-size: 16px; line-height: 1.55; color: #3B4A5C; margin: 0 0 8px; }
.ogl-box a { color: #0C549E; font-weight: 700; }
.ogl-schema { margin: 0; }
.ogl-mock { display: flex; flex-direction: column; gap: 12px; padding: 18px; background: #FFFFFF; border-radius: 4px; box-shadow: 0 12px 32px rgba(13, 27, 46, .12), inset 0 0 0 1px #D3DBE5; }
.ogl-mock__slot { display: grid; place-items: center; text-align: center; border-radius: 3px; font-weight: 800; font-size: 15px; color: #55657A; background: #E6ECF2; box-shadow: inset 0 0 0 1px #D3DBE5; transition: background-color .15s ease, color .15s ease, box-shadow .15s ease; }
.ogl-mock__slot.is-on { background: #F2C230; color: #0D1B2E; box-shadow: 0 0 0 3px #0C549E; }
.ogl-mock__a { height: 60px; }
.ogl-mock__bar { display: flex; align-items: center; gap: 10px; height: 28px; padding: 0 10px; background: #E6ECF2; border-radius: 3px; }
.ogl-mock__bar span { width: 16px; height: 16px; border-radius: 50%; background: #0C549E; }
.ogl-mock__bar i { width: 110px; height: 6px; background: #8A97A8; border-radius: 3px; }
.ogl-mock__hero { height: 136px; background: #0C549E; border-radius: 3px; display: flex; align-items: center; padding: 0 22px; }
.ogl-mock__hero i { width: 46%; height: 12px; background: #9FB8D6; border-radius: 3px; }
.ogl-mock__row { display: grid; grid-template-columns: minmax(0, 1fr) 30%; gap: 12px; }
.ogl-mock__news { display: flex; flex-direction: column; gap: 10px; }
.ogl-mock__news .t { height: 100px; background: #E6ECF2; border-radius: 3px; }
.ogl-mock__news .t.s { height: 64px; }
.ogl-mock__news .l { height: 10px; width: 80%; background: #D3DBE5; border-radius: 3px; }
.ogl-mock__news .l.s { width: 60%; }
.ogl-mock__news .l.m { width: 70%; }
.ogl-mock__b { min-height: 245px; line-height: 1.4; }
.ogl-mock__foot { display: flex; justify-content: flex-end; padding: 8px; background: #E6ECF2; border-radius: 3px; }
.ogl-mock__c { width: 36%; height: 62px; background: #F2F5F8; }
.ogl-schema figcaption { font-size: 14px; color: #55657A; margin-top: 12px; }
@media (min-width: 768px) {
    .ogl-box { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
}
@media (min-width: 1200px) {
    .ogl-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr); gap: 88px; }
}
@media (max-width: 575px) {
    .ogl-pos__item { grid-template-columns: 44px minmax(0, 1fr); gap: 14px; }
    .ogl-pos__key { width: 44px; height: 44px; font-size: 17px; }
    .ogl-pos__size { grid-column: 2; font-size: 20px; }
    .ogl-pos__text strong { font-size: 21px; }
}
/* ==== /oglasavanje ==== */

/* ==== /komponente style guide ==== */
.kmp { padding: 24px 0 96px; }
.kmp .lead { margin-bottom: 32px; }
.kmp-item { padding: 28px 0; border-top: 1px solid var(--line); }
.kmp-item > .h4 { margin: 0 0 6px; }
.kmp-demo { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-start; margin: 16px 0; padding: 24px; background: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 1px var(--line); }
.kmp-demo > * { margin: 0; }
.kmp-demo .plate, .kmp-demo .ui-card, .kmp-demo .field { min-width: 280px; }
.kmp-demo .rule { flex-basis: 100%; }
.kmp-code { margin: 0; padding: 14px 16px; background: var(--ink); color: #DCE8F7; border-radius: 4px; font-size: 13px; line-height: 1.5; overflow-x: auto; white-space: pre; }
.kmp-swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-top: 14px; }
.kmp-swatch { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.kmp-swatch span { height: 56px; border-radius: 4px; box-shadow: inset 0 0 0 1px var(--line); }
.kmp-swatch small { color: var(--ink-3); }
/* ==== /komponente ==== */

/* ==== Natječaji i potpore (Natjecaji.dc.html) ==== */
.natj { padding: 35px 0 96px; }
.natj .lead { margin: 0 0 24px; }
.natj-tabs { display: flex; flex-wrap: wrap; gap: 28px; align-items: flex-end; border-bottom: 1px solid var(--line); margin-bottom: 32px; }
.natj-tabs .container-xl { display: contents; }
.natj-tab, .natj-tabs .tag-badge { display: inline-block; padding: 0 2px 12px !important; margin: 0 !important; background: none !important; border-radius: 0 !important; font-size: 16px !important; font-weight: 700 !important; color: var(--ink-3) !important; text-transform: none !important; text-decoration: none; box-shadow: inset 0 -2px 0 transparent; }
.natj-tab.is-on, .natj-tabs .tag-link.is-on .tag-badge { color: var(--brand) !important; box-shadow: inset 0 -3px 0 var(--brand); }
.natj-tabs .tag-link:hover .tag-badge, .natj-tab:hover { color: var(--brand) !important; }
.natj-tabs .tag-hash, .natj-tabs .tag-count { display: none; }
.natj-grid .row[id^="id-"] { margin: 0; }
.natj-grid .article-load { padding: 0 !important; }
.natj-item { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 26px 0; border-bottom: 1px solid var(--line); }
.natj-item__meta { display: flex; gap: 12px; align-items: baseline; font-size: 14px; color: var(--ink-3); }
.natj-item__meta a { font-weight: 700; color: var(--brand); text-decoration: none; }
.natj-item__main .h3 { margin: 0 0 6px; }
.natj-item__main .h3 a { color: var(--ink); text-decoration: none; }
.natj-item__main .h3 a:hover { color: var(--brand); }
.natj-item__main p { margin: 0; color: var(--ink-2); font-size: 16px; }
.natj-item__side { display: flex; gap: 16px; align-items: center; }
.natj-rok { display: inline-block; padding: 5px 10px; border-radius: 3px; background: var(--mark); color: var(--ink); font-size: 14px; font-weight: 700; white-space: nowrap; }
.natj-rok.is-past { background: var(--paper-2); color: var(--ink-3); }
.natj-item__side .more { color: var(--ink); }
.natj .sidebar .ck-content h3, .imenik-cat .sidebar h3 { font-size: 21px; color: var(--ink); margin: 0 0 10px; }
@media (min-width: 992px) {
    .natj-item { grid-template-columns: 150px minmax(0, 1fr) auto; gap: 24px; align-items: start; }
    .natj-item__meta { flex-direction: column; gap: 4px; }
    .natj-item__side { flex-direction: column; align-items: flex-end; gap: 14px; }
}
.natj-grid .sidebar > .container-xl { background: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 1px var(--line); padding: 24px !important; margin: 0 !important;}
.natj-grid .sidebar .btn.arrow-btn { background: none !important; border: 0 !important; box-shadow: none !important; color: var(--ink) !important; padding: 0 !important; font-weight: 700; font-size: 16px; }
.natj-grid .sidebar .btn.arrow-btn:hover { color: var(--brand) !important; text-decoration: underline!important; text-underline-offset: 4px; }
.natj-grid .sidebar h3 { font-size: 21px; color: var(--ink); margin: 0 0 10px; }
/* ==== /Natječaji ==== */

/* ==== Dokumenti i obrasci (Dokumenti.dc.html) ==== */
.dok { padding: 35px 0 96px; }
.dok-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 36px; }
.dok-chips .container-xl { display: contents; }
.dok-chips .tag-link { text-decoration: none; }
.dok-chips .tag-badge { display: inline-flex; align-items: center; height: 40px; padding: 0 15px !important; margin: 0 !important; border-radius: 4px; background: #FFFFFF !important; box-shadow: inset 0 0 0 1px var(--line); font-size: 15px !important; font-weight: 600 !important; color: var(--ink) !important; text-transform: none !important; }
.dok-chips .tag-link:hover .tag-badge { box-shadow: inset 0 0 0 1.5px var(--brand); color: var(--brand) !important; }
.dok-chips .tag-hash, .dok-chips .tag-count { display: none; }
.dok .dok-heading h3, .dok-heading h3 { font-size: 25px !important; margin: 28px 0 0; }
.dok-heading { border-bottom: 2px solid var(--brand); padding-bottom: 8px; }
.dok-grid { padding: 0 !important; }
.dok-grid .row[id^="id-"] { margin: 0; }
.dok-grid .article-load { padding: 0 !important; }
.dok-item { display: grid; grid-template-columns: 44px minmax(0, 1fr) 32px; gap: 16px; align-items: center; padding: 14px 16px; background: #FFFFFF; border-bottom: 1px solid var(--line); }
.dok-item__badge { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 3px; background: var(--paper-2); color: var(--brand); font-size: 12px; font-weight: 800; }
.dok-item__main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.dok-item__title { font-weight: 700; color: var(--ink); text-decoration: none; font-size: 16px; }
a.dok-item__title:hover { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }
.dok-item__sub { font-size: 13.5px; color: var(--ink-3); }
.dok-item__src, .dok-item__size { display: none; font-size: 14px; color: var(--ink-3); }
.dok-item__dl { color: var(--brand); font-size: 18px; text-align: center; }
@media (min-width: 992px) {
    .dok-item { grid-template-columns: 44px minmax(0, 1fr) 240px 100px 32px; }
    .dok-item__src, .dok-item__size { display: block; }
    .dok-item__size { text-align: right; }
}
.dok .heading, .dok .heading-wrapper { text-align: left !important; }
.dok .heading { margin: 36px 0 0 !important; padding-bottom: 10px; }
.dok .heading::before, .dok .heading::after, .dok .heading-wrapper::before, .dok .heading-wrapper::after { display: none !important; }
.dok .heading h3 { font-size: 25px !important; font-weight: 700 !important; font-stretch: 87.5%; color: var(--ink); background: none !important; padding: 0 !important; margin: 0; }
.dok .heading-title { padding: 0 !important; }
.dok .heading-wrapper { display: block !important; }
.dok .heading-wrapper > :not(h1):not(h2):not(h3):not(h4) { display: none !important; }
/* ==== /Dokumenti ==== */

/* ==== Natječaji: Campaign sign-up card ==== */
.natj-grid .sidebar > .container-xl:has(.natj-signup) { background: var(--brand); box-shadow: none; margin-bottom:25px!important;}
.natj-signup h3 { color: #FFFFFF !important; font-size: 21px; margin: 0 0 8px; }
.natj-signup p { color: var(--on-brand-2); font-size: 15px; }
.natj-signup .container-xl {padding-left:0;}
.natj-signup__msg{font-size: 15px; background: #FDECEA; color: #8C1D18!important;}
.natj-signup__form { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.natj-signup__form .label { color: #FFFFFF; }
.natj-signup__form .input { height: 46px; }
.natj-signup__form .check { color: var(--on-brand-2); font-size: 14px; }
.natj-signup__form .btn-y { width: 100%; margin-top: 4px; }
.natj-signup__msg { margin: 4px 0 0; padding: 8px 10px; border-radius: 3px; background: #FDECEA; color: #8C1D18 !important; font-size: 14px; font-weight: 600; }
.natj-signup__msg.is-ok { background: #E6F4EA; color: #1E5E2E !important; }
.natj-grid .sidebar .row { margin: 0 !important; }
.natj-grid .sidebar [class*="col-"] { padding: 0 !important; }
.natj-signup { padding: 0 !important; background: none !important; }
@media (min-width: 992px) {
    .row:has(> .natj-grid) > .col-lg-9, .row:has(> .natj-grid) > [class*="col-lg"]:not(.natj-grid) { flex: 0 0 68%; max-width: 68%; }
    .row:has(> .natj-grid) > .natj-grid { flex: 0 0 32%; max-width: 32%; padding-left: 40px !important; }
}
/* ==== /sign-up ==== */

/* Imenik map anchor (#karta): land below the sticky header */
.imenik-karta-anchor { display: block; position: relative; top: -140px; visibility: hidden; }

/* ==== /imenik-obrta/karta (all Obrti, clustered) ==== */
.karta { padding: 8px 0 72px; }
.karta .lead { margin: 0 0 24px; }
.karta-filters { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.karta-filters__row { display: flex; flex-wrap: wrap; gap: 8px; }
.karta-count { margin: 4px 0 0; }
.karta-map { position: relative; border-radius: 4px; overflow: hidden; box-shadow: inset 0 0 0 1px var(--line); }
.karta-map .gm-map { width: 100% !important; height: max(520px, 72vh) !important; }
.karta-map .imenik-map-card { left: auto; right: 16px; bottom: 16px; width: min(380px, calc(100% - 32px)); }
.karta-more { margin: 0 0 12px; }
.imenik-karta-anchor + .karta-more, .imenik-list .karta-more { display: inline-flex; }
/* ==== /karta ==== */

/* ==== Za obrtnike: Članstvo, Pogodnosti, Obrazovanje (section.zo; content in native Page Builder blocks) ==== */
/* Blocks inside the .zo wrapper open their own container-xl: drop the second gutter */
.zo { padding:0px 0 96px; color: var(--ink-2); }
.zo > .container-xl > [class*="container"] { padding-left: 0 !important; padding-right: 0 !important; }
.zo > .container-xl > [class*="container"] > .row { margin-left: 0; margin-right: 0; }
.zo > .container-xl > [class*="container"] > .row > [class*="col"] { padding-left: 0; padding-right: 0; }
.zo p, .zo li { font-size: 17px; line-height: 1.6; }
.zo .lead { font-size: 19px; margin: 0 0 8px; }
.zo .heading-title {padding-left:0;}
.zo .col-lg-12 {padding-left:0;}
.zo .meta { font-size: 14px; color: var(--ink-3); margin-top: 24px; }
.zo h4 { font-size: 19px; font-weight: 700; font-stretch: 87.5%; color: var(--ink); margin: 24px 0 8px; }
.zo a:not(.btn):not(.more) { color: var(--brand); font-weight: 600; text-underline-offset: 4px; }
/* Heading block (class "heading-title zo-h"): left, display type, no middle rules */
.zo-h .heading, .zo-h .heading-wrapper { display: block !important; text-align: left !important; }
.zo-h .heading { margin: 56px 0 12px !important; padding: 0 !important; border: 0 !important; }
.zo-h .heading::before, .zo-h .heading::after, .zo-h .heading-wrapper-left, .zo-h .heading-wrapper-right { display: none !important; }
.zo-h h2, .zo-h h3 { margin: 0 !important; padding: 0 !important; background: none !important; color: var(--ink) !important; text-wrap: balance; }
.zo-h h2 { font-size: clamp(30px, 3.4vw, 42px) !important; font-weight: 800 !important; font-stretch: 75%; letter-spacing: -.012em; line-height: 1.04 !important; }
.zo-h h3 { font-size: 25px !important; font-weight: 700 !important; font-stretch: 87.5%; line-height: 1.18 !important; }
/* Lists from CKEditor: rows with a brand tick */
.zo .container-xl:not(.call-to-action) ul { list-style: none; margin: 8px 0 0; padding: 0; max-width: 820px; }
.zo .container-xl:not(.call-to-action) ul li { position: relative; padding: 13px 0 13px 32px; border-bottom: 1px solid var(--line); }
.zo .container-xl:not(.call-to-action) ul li:last-child { border-bottom: 0; }
.zo .container-xl:not(.call-to-action) ul li::before { content: ""; position: absolute; left: 4px; top: 21px; width: 12px; height: 7px; border-left: 2px solid var(--brand); border-bottom: 2px solid var(--brand); transform: rotate(-45deg); }
/* Button block: outline buttons from the design */
.zo .button-tag .col-sm-12 { flex-wrap: wrap; gap: 12px; padding-top: 8px; }
.zo .button-tag .btn { display: inline-flex; align-items: center; min-height: 48px; margin: 0 !important; padding: 0 20px !important; border: 0 !important; border-radius: 4px !important; background: transparent !important; color: var(--brand) !important; box-shadow: inset 0 0 0 2px var(--brand) !important; font-size: 16px !important; font-weight: 700 !important; text-transform: none !important; }
.zo .button-tag .btn:hover, .zo .button-tag .btn:focus-visible { background: var(--brand) !important; color: #FFFFFF !important; }

.zo2 .button-tag .col-sm-12 { flex-wrap: wrap; gap: 12px; padding-top: 8px; }
.zo2 .button-tag .btn { display: inline-flex; align-items: center; min-height: 48px; margin: 0 !important; padding: 0 20px !important; border: 0 !important; border-radius: 4px !important; background: transparent !important; color: var(--brand) !important; box-shadow: inset 0 0 0 2px var(--brand) !important; font-size: 16px !important; font-weight: 700 !important; text-transform: none !important; }
.zo2 .button-tag .btn:hover, .zo .button-tag .btn:focus-visible { background: var(--brand) !important; color: #FFFFFF !important; }
/* CTA block: blue band with a yellow button; a yellow CTA (#F2C230) gets a blue button */
.zo .call-to-action { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 40px; margin: 56px 0 8px !important; padding: 36px 40px !important; border: 0 !important; border-radius: 4px; }
.zo .call-to-action > [class*="col-"] { flex: 1 1 360px; max-width: none; padding: 0; }
.zo .call-to-action > [class*="col-"]:last-child { flex: 0 0 auto; }
.zo .call-to-action h3 { margin: 0 0 8px; color: inherit; font-size: clamp(26px, 2.6vw, 34px); font-weight: 800; font-stretch: 75%; line-height: 1.05; letter-spacing: -.01em; }
.zo .call-to-action-content { text-align: left !important; }
.zo .call-to-action p { margin: 0; color: inherit; opacity: .88; font-size: 18px; max-width: 60ch; }
.zo .call-to-action .btn { min-height: 48px; display: inline-flex; align-items: center; margin: 0 !important; padding: 0 22px !important; border: 0 !important; border-radius: 4px !important; background: var(--accent) !important; color: var(--ink) !important; font-size: 16px !important; font-weight: 700 !important; text-transform: none !important; }
.zo .call-to-action .btn:hover { background: var(--accent-2) !important; }
.zo .call-to-action[style*="#f2c230" i] .btn { background: var(--brand) !important; color: #FFFFFF !important; }
.zo .call-to-action[style*="#f2c230" i] .btn:hover { background: var(--brand-2) !important; }
/* Icon box "zo-razine" (1 per row) = the plate ladder HOK > OKZ > Udruženje */
.zo-razine { margin-top: 28px; margin-bottom:96px; }
.zo-razine .featured-boxes { max-width: 760px; }
.zo-razine .featured-boxes .row > [class*="col-"] { margin-bottom: 10px; }
.zo-razine a { display: block; text-decoration: none !important; }
.zo-razine .featured-box { margin: 0 !important; border: 0 !important; border-radius: 4px; min-height:unset; background: var(--brand) !important; color: #FFFFFF; text-align: left; box-shadow: inset 0 0 0 4px var(--brand), inset 0 0 0 5.5px rgba(255, 255, 255, .85); transition: transform .15s ease; }
.zo-razine a:hover .featured-box { transform: translateX(4px); }
.zo-razine .box-content { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; column-gap: 16px; padding: 23px 18px !important; border: 0 !important; }
.zo-razine .box-content .row, .zo-razine .box-content .col { display: contents; }
.zo-razine .icon-featured, .zo-razine .box-content button, .zo-razine .box-content p:empty { display: none !important; }
.zo-razine h2 { flex: 1 1 260px; margin: 0 !important; color: inherit !important; font-size: 20px !important; font-weight: 800 !important; font-stretch: 75%; text-transform: uppercase; letter-spacing: .025em; line-height: 1.1; }
.zo-razine .box-content p { margin: 0; font-size: 13.5px; line-height: 1.35; color: var(--on-brand-2); }
.zo-razine .featured-boxes .row > [class*="col-"]:nth-child(3) .featured-box { background: var(--accent) !important; color: var(--ink); box-shadow: none; }
.zo-razine .featured-boxes .row > [class*="col-"]:nth-child(3) .box-content p { color: var(--ink); }
.zo-pogodnosti {margin-top:35px;}
.pogodnosti-right { max-width: 505px;  margin-left: 60px; padding:0;}
.pogodnosti-right .container-xl.py-2 {padding-left:0; padding-right;}
.obrazovanje-flex {display:flex; align-items: self-start; justify-content: space-between;}
.obrtnicko-uciliste .button-tag .col-sm-12 { justify-content: end!important;}
.zo.pravno {padding-top:35px;}
@media (min-width: 768px) {
    .zo-razine .featured-boxes .row > [class*="col-"]:nth-child(2) .featured-box { margin-left: 40px !important; }
    .zo-razine .featured-boxes .row > [class*="col-"]:nth-child(3) .featured-box { margin-left: 80px !important; }
}
/* Toggle block "zo-faq": open rows with a bottom rule */
.zo-faq { max-width: 900px; margin-left: 0 !important; }
.zo .natj-tabs { margin-top: 32px; }
.zo-faq .toggle { border-top: 1px solid var(--line); }
.zo-faq section.toggle { margin: 0 !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; background: none !important; }
.zo-faq .toggle-title { position: relative; padding: 20px 44px 20px 0 !important; background: none !important; border: 0 !important; color: var(--ink) !important; font-size: 19px !important; font-weight: 700 !important; line-height: 1.3; cursor: pointer; }
.zo-faq .toggle-title::before, .zo-faq .toggle-title::after { border-color: var(--brand) !important; color: var(--brand) !important; }
.zo-faq section.toggle.active .toggle-title, .zo-faq .toggle-title:hover { color: var(--brand) !important; }
.zo-faq .toggle-content { padding: 0 44px 20px 0 !important; border: 0 !important; }
.zo-faq .toggle-content p { margin: 0; color: var(--ink-2); }
/* CKEditor table: exam terms */
.zo figure.table { margin: 8px 0 0; max-width: 820px; overflow-x: auto; }
.zo figure.table table { width: 100%; border-collapse: collapse; border: 0; }
.zo figure.table th { padding: 10px 16px 10px 0; border: 0; border-bottom: 2px solid var(--brand); background: none; text-align: left; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); }
.zo figure.table td { padding: 15px 16px 15px 0; border: 0; border-bottom: 1px solid var(--line); font-size: 17px; color: var(--ink-2); }
.zo figure.table td:first-child { font-weight: 700; color: var(--ink); }
.zo figure.table tr:last-child td { background: var(--mark); }
.zo figure.table tr:last-child td:first-child { padding-left: 12px; }
/* Pogodnosti: partner cards (card type grid-types-partner) */
.partner-grid { padding: 0 !important; margin-top: 8px; }
.partner-grid .row[id^="id-"] { margin: 0 -7px; justify-content: flex-start !important; }
.partner-grid .article-load { padding: 7px !important; }
.partner-item { height: 100%; min-height: 150px; display: flex; flex-direction: column; gap: 6px; padding: 24px; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.partner-item__name { order: -1; font-size: 21px; font-weight: 700; font-stretch: 87.5%; line-height: 1.2; color: var(--ink); }
.partner-item__cat, .partner-item__sub { font-size: 14px; color: var(--ink-3); }
.partner-item .more { margin-top: auto; padding-top: 10px; font-size: 15px; }
@media (max-width: 767px) {
    .zo .call-to-action { padding: 28px 0px !important;  margin: 15px 0 0px !important; }
    .zo-h .heading { margin-top: 40px !important; }
}
/* ==== /Za obrtnike ==== */

/* ==== Pozicija D: istaknuti obrt na Karti obrta (logo pin + traka Istaknuti obrti) ==== */
.karta-logo-pin { position: absolute; transform: translate(-50%, calc(-100% - 8px)); width: 56px; height: 56px; padding: 5px; border: 2px solid var(--brand); border-radius: 6px; background: #FFFFFF; box-shadow: 0 4px 12px rgba(13, 27, 46, .28); cursor: pointer; z-index: 5; transition: transform .15s ease; }
.karta-logo-pin::after { content: ""; position: absolute; left: 50%; bottom: -9px; width: 14px; height: 14px; margin-left: -7px; background: #FFFFFF; border-right: 2px solid var(--brand); border-bottom: 2px solid var(--brand); transform: rotate(45deg); }
.karta-logo-pin img { position: relative; z-index: 1; display: block; width: 100%; height: 100%; object-fit: contain; }
.karta-logo-pin:hover, .karta-logo-pin:focus-visible { transform: translate(-50%, calc(-100% - 8px)) scale(1.12); outline: none; border-color: var(--accent-2); }
.karta-istaknuti { margin-top: 28px; }
.karta-istaknuti__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.karta-istaknuti__head .h4 { margin: 0; }
.karta-istaknuti__oglas { padding: 2px 8px; border-radius: 3px; background: var(--paper-2); color: var(--ink-3); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.karta-istaknuti__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.karta-istaknuti__list a { display: flex; align-items: center; gap: 14px; height: 100%; padding: 12px 16px; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); color: var(--ink); text-decoration: none; }
.karta-istaknuti__list a:hover { box-shadow: inset 0 0 0 1.5px var(--brand); }
.karta-istaknuti__list img { flex: none; width: 64px; height: 64px; object-fit: contain; }
.karta-istaknuti__list strong { display: block; font-size: 17px; line-height: 1.25; }
.karta-istaknuti__list .meta { font-size: 14px; }
/* ==== /Pozicija D ==== */

/* ==== Header 992-1599: logo, centred nav and the right cluster share one row without overlapping ====
   The dev's nav is absolutely centred across the whole row (right for 1800 px). Below 1600 px the logo (348 px),
   nav (~720 px) and search/user/button (~320 px) no longer fit, so the nav gets a corridor between the logo
   and the right cluster, and type, gaps and logo step down per breakpoint. */
@media (min-width: 992px) and (max-width: 1599px) {
    #header .header-logo img { width: 280px; }
    #header .header-logo { top: 46px; }
    #header .header-nav-main { left: 300px; right: 330px; }
    #header .header-row.container-xl .header-nav-main .nav.nav-pills > li > a { font-size: 18px; padding-left: 11px !important; padding-right: 11px !important; }
    #header .header-row.container-xl .header-nav-main .nav.nav-pills > li > a i { margin-left: 6px; }
    .header-nav-top li { margin-left: 14px; height: 52px; }
    .header-nav-top li a { padding: 0 18px !important; font-size: 17px !important; }
}
@media (min-width: 992px) and (max-width: 1399px) {
    #header .header-logo img { width: 240px; }
    #header .header-logo { top: 50px; }
    #header .header-nav-main { left: 245px; right: 325px; }
    #header .header-row.container-xl .header-nav-main .nav.nav-pills > li > a { font-size: 16.5px; padding-left: 8px !important; padding-right: 8px !important; }
}
@media (min-width: 992px) and (max-width: 1199px) {
    #header .header-logo img { width: 200px; }
    #header .header-logo { top: 54px; }
    /* No room for the yellow button here: Upis stays in the Za obrtnike menu, the hero and the footer */
   /* #header .header-nav-top { display: none !important; }*/
    #header .header-nav-main { left: 209px; right: auto; }
    #header .header-row.container-xl .header-nav-main .nav.nav-pills > li > a { font-size: 15.5px; padding-left: 7px !important; padding-right: 7px !important; }
}
/* ==== /Header 992-1599 ==== */

/* ==== Sticky header (≥992): Porto keeps .header-body at -52 px, so only the bottom 63 px of the 95 px row show.
   Push the row content into that band: nav and logo centred, icons and button moved down, smaller logo and button. ==== */
@media (min-width: 992px) {
    html.sticky-header-active #header .header-nav.down-menu { min-height: 95px; padding-top: 32px; }
    html.sticky-header-active #header .header-nav-main { top: 32px; }
    html.sticky-header-active #header .header-logo img { width: 220px; }
    html.sticky-header-active #header .header-logo { top: 31px; }
    html.sticky-header-active #header .header-nav .icon-social, html.sticky-header-active #header .header-nav-top { transform: translateY(16px); }
    html.sticky-header-active .header-nav-top li { height: 46px; }
}
@media (min-width: 992px) and (max-width: 1199px) {
    html.sticky-header-active #header .header-logo img { width: 200px; }
    html.sticky-header-active #header .header-logo { top: 33px; }
}
/* ==== /Sticky header ==== */

/* ==== Pravne stranice (Pravno.dc.html): menu (global element) | article (heading + ckEditor blocks) ==== */
.pravno-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; }
.pravno-grid [class*="container"] { max-width: none; padding-left: 0 !important; padding-right: 0 !important; }
.pravno-grid .row { margin-left: 0; margin-right: 0; }
.pravno-grid .row > [class*="col"] { padding-left: 0; padding-right: 0; }
.pravno-nav { display: flex; flex-direction: column; gap: 4px; }
.pravno-nav a { display: block; padding: 13px 16px; border-radius: 4px; color: var(--ink) !important; font-size: 17px !important; font-weight: 600 !important; text-decoration: none !important; }
.pravno-nav a:hover { background: var(--paper-2); }
.pravno-nav a.is-on { background: var(--brand); color: #FFFFFF !important; }
.pravno-nav .meta { margin: 16px 0 0; padding-left: 16px; font-size: 14px; line-height: 1.5; }
.pravno-article { max-width: 820px; }
.pravno-article .zo-h .heading { margin-top: 32px !important; }
.pravno-article .meta { margin: 0; }
.pravno-note { margin-top: 32px; padding: 20px 24px; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
@media (min-width: 992px) {
    .pravno-grid { grid-template-columns: 300px minmax(0, 1fr); gap: 80px; }
    .pravno-nav { position: sticky; top: 110px; }
}
/* ==== /Pravne stranice ==== */

/* ==== Pretraga (/rezultati-pretrage, templates/_pretraga): big field, tabs, grouped results ==== */
.pretraga-page { padding: 35px 0 96px; }
.pretraga-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; max-width: 1100px; margin-bottom: 28px; }
.pretraga-form .input { width: 100%; height: 64px; padding: 0 20px; border: 0; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1.5px var(--line); color: var(--ink); font-size: 24px; font-weight: 600; }
.pretraga-form .input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--brand); }
.pretraga-form .btn { height: 64px; padding: 0 32px; font-size: 18px; }
.pretraga-tabs { display: flex; flex-wrap: wrap; gap: 4px 32px; max-width: 1100px; margin-bottom: 40px; border-bottom: 1px solid var(--line); }
.pretraga-n { font-weight: 500; color: var(--ink-3); }
.pretraga-group { max-width: 1100px; margin-bottom: 44px; }
.pretraga-group h2.h3 { margin: 0; padding-bottom: 12px; border-bottom: 2px solid var(--brand); font-size: 26px; }
.pretraga-item { display: flex; flex-direction: column; gap: 6px; padding: 20px 0; border-bottom: 1px solid var(--line); text-decoration: none !important; }
.pretraga-item__title { color: var(--brand); font-size: 22px; font-weight: 700; font-stretch: 87.5%; line-height: 1.25; }
.pretraga-item:hover .pretraga-item__title { text-decoration: underline; text-underline-offset: 4px; }
.pretraga-item__snip { color: var(--ink-2); font-size: 16px; line-height: 1.55; }
.pretraga-empty { max-width: 760px; padding: 28px; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.pretraga-empty p { margin: 0 0 8px; color: var(--ink-2); }
.pretraga-empty a { color: var(--brand); font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 575px) {
    .pretraga-form .input { height: 54px; font-size: 19px; }
    .pretraga-form .btn { height: 54px; padding: 0 18px; font-size: 16px; }
    .pretraga-tabs { gap: 4px 20px; }
}
/* ==== /Pretraga ==== */

/* ==== Header search: instant suggestions (other-js + templates/pretraga-predlozi.twig) ==== */
.hs-panel-wrap { position: absolute; left: 1rem; right: 1rem; top: 100%; z-index: 30; }
.hs-panel-wrap:empty { display: none; }
.hs-panel { max-width: 760px; max-height: min(70vh, 640px); overflow-y: auto; margin: 0; padding: 12px; border-radius: 0 0 6px 6px; background: #FFFFFF; box-shadow: 0 18px 40px rgba(13, 27, 46, .16), 0 0 0 1px var(--line); text-align: left; }
.hs-group + .hs-group { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line); }
.hs-group__name { display: block; padding: 6px 12px 2px; color: var(--ink-3); font-size: 12.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.hs-item { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; border-radius: 4px; color: var(--ink) !important; text-decoration: none !important; }
.hs-item:hover, .hs-item:focus-visible { background: var(--paper); outline: none; }
.hs-item__title { font-size: 16px; font-weight: 600; line-height: 1.3; }
.hs-item:hover .hs-item__title, .hs-item:focus-visible .hs-item__title { color: var(--brand); }
.hs-item__meta { color: var(--ink-3); font-size: 13.5px; }
.hs-empty { margin: 0; padding: 12px; color: var(--ink-2); }
.hs-all { display: flex; align-items: center; gap: 8px; margin-top: 8px; padding: 12px; border-top: 1px solid var(--line); color: var(--brand) !important; font-weight: 700; text-decoration: none !important; }
.hs-all:hover, .hs-all:focus-visible { text-decoration: underline !important; text-underline-offset: 4px; outline: none; }
/* ==== /Header search ==== */

/* ==== Header search bar (desktop .search-full): framed 760 px field instead of a full-width underline ==== */
#header .search-full form { max-width: 760px; margin: 0 auto; }
#header .search-full .big-search-header { position: relative; }
#header .search-full .big-search-header > .header-nav-top-icon { position: absolute; left: 18px; top: 50%; z-index: 2; transform: translateY(-50%); pointer-events: none; }
#header .search-full .big-search-header > .header-nav-top-icon i { color: var(--ink-3); font-size: 18px; }
#header .search-full .big-search-header input { height: 56px !important; padding: 0 52px 0 50px !important; border: 0 !important; border-radius: 4px !important; background: var(--paper) !important; box-shadow: inset 0 0 0 1.5px var(--line) !important; color: var(--ink); font-size: 19px !important; }
#header .search-full .big-search-header input:focus { background: #FFFFFF !important; box-shadow: inset 0 0 0 2px var(--brand) !important; outline: none; }
#header .search-full .big-search-header input::placeholder { color: var(--ink-3); }
#header .search-full .big-search-header input::-webkit-search-cancel-button { display: none; -webkit-appearance: none; }
#header .search-full .header-nav-features-search-hide-icon { right: 18px !important; top: 50% !important; z-index: 2; margin-top: 0 !important; transform: translateY(-50%); }
#header .search-full > .hs-panel-wrap { left: 50%; right: auto; top: calc(50% + 32px); width: min(760px, calc(100% - 2rem)); transform: translateX(-50%); }
#header .search-full .hs-panel { max-width: none; border-radius: 6px; }
/* ==== /Header search bar ==== */

/* ==== Header search bar: cover only the main menu (same corridor as .header-nav-main), keep logo and right cluster visible ==== */
@media (min-width: 992px) {
    #header .header-nav-features .header-nav-features-search-reveal-big-search.search-full { left: 390px; right: 350px; width: auto; }
    #header .search-full form { max-width: 760px; }
}
@media (min-width: 992px) and (max-width: 1599px) {
    #header .header-nav-features .header-nav-features-search-reveal-big-search.search-full { left: 300px; right: 330px; }
}
@media (min-width: 992px) and (max-width: 1399px) {
    #header .header-nav-features .header-nav-features-search-reveal-big-search.search-full { left: 265px; right: 325px; }
}
@media (min-width: 992px) and (max-width: 1199px) {
    #header .header-nav-features .header-nav-features-search-reveal-big-search.search-full { left: 210px; right: 110px; }
}
/* ==== /Header search corridor ==== */

/* ==== 404 (Greska404.dc.html) on the page404 entry: plate, heading, lead, search | link rows (button block) ==== */
.e404 { padding: 64px 0 112px; }
.e404-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 48px; align-items: center; }
.e404-grid [class*="container"] { max-width: none; padding-left: 0 !important; padding-right: 0 !important; }
.e404-grid .row { margin-left: 0; margin-right: 0; }
.e404-grid .row > [class*="col"] { padding-left: 0; padding-right: 0; }
.e404-plate { display: inline-block; padding: 18px 28px; margin-bottom: 8px; }
.e404-plate .plate-name { font-size: 64px; letter-spacing: .04em; }
.e404-h .heading, .e404-h .heading-wrapper { display: block !important; margin: 14px 0 12px !important; padding: 0 !important; border: 0 !important; text-align: left !important; }
.e404-h .heading::before, .e404-h .heading::after, .e404-h .heading-wrapper-left, .e404-h .heading-wrapper-right { display: none !important; }
.e404-h h1 { margin: 0 !important; padding: 0 !important; background: none !important; color: var(--ink) !important; font-size: clamp(40px, 4.4vw, 60px) !important; font-weight: 800 !important; font-stretch: 75%; letter-spacing: -.012em; line-height: 1.02 !important; }
.e404 .lead { margin: 0 0 22px; }
.e404-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; max-width: 640px; }
.e404-search .input { width: 100%; height: 50px; padding: 0 16px; border: 0; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1.5px var(--line); color: var(--ink); font-size: 17px; }
.e404-search .input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--brand); }
.e404-search .btn { height: 50px; padding: 0 24px; }
.e404-links .button-tag .col-sm-12 { flex-direction: column; align-items: stretch !important; }
.e404-links .button-tag .btn { display: flex; justify-content: space-between; align-items: center; margin: 0 !important; padding: 24px 0 !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; color: var(--ink) !important; font-size: 25px !important; font-weight: 700 !important; font-stretch: 87.5%; text-transform: none !important; text-align: left; }
.e404-links .button-tag .btn:last-child { border-bottom: 0 !important; }
.e404-links .button-tag .btn::after { content: "\2192"; color: var(--brand); font-size: 24px; font-weight: 400; }
.e404-links .button-tag .btn:hover { color: var(--brand) !important; }
@media (min-width: 992px) {
    .e404 { padding: 96px 0 140px; }
    .e404-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 96px; }
}
/* ==== /404 ==== */

/* ==== Footer per Footer.dc.html: logo row with a rule under it, four equal columns (16 px links), bottom bar ==== */
#footer .footer-col-logo { padding-top: 0; }
#footer .footer-col-logo img { width: auto; height: 64px; margin-bottom: 20px; }
#footer .footer-btn a { color: var(--ink) !important; }
/* Rule between the logo/phone row and the columns: a flex pseudo-item ordered between them */
#footer .row.py-5 { padding-top: 64px !important; padding-bottom: 44px !important; }
#footer .row.py-5 > .footer-col-logo, #footer .row.py-5 > .footer-col-kontakt { order: 1; align-self: flex-end; padding-bottom: 44px; }
#footer .row.py-5::after { content: ""; order: 2; flex: 0 0 calc(100% - 30px); height: 1px; margin: 0 15px 44px; background: rgba(255, 255, 255, .18); }
#footer .row.py-5 > :not(.footer-col-logo):not(.footer-col-kontakt) { order: 3; margin-top: 0 !important; }
/* Column type */
#footer .row.py-5 > :not(.footer-col-logo):not(.footer-col-kontakt) h5 { margin-bottom: 16px !important; color: #FFFFFF !important; font-size: 15px !important; font-weight: 700; }
#footer .row.py-5 > :not(.footer-col-logo):not(.footer-col-kontakt) :is(p, a:not(.btn), .text-4) { color: #DCE8F7; font-size: 16px !important; line-height: 1.5; }
#footer .row.py-5 > :not(.footer-col-logo):not(.footer-col-kontakt) .button-tag .mb-1, #footer .footer-col-sjediste p { margin: 0 0 10px !important; }
#footer .footer-col-sjediste a { color: #FFFFFF !important; }
#footer .row.py-5 a:not(.btn):hover { color: #FFFFFF !important; text-decoration: underline; text-underline-offset: 4px; }
/* Pratite nas: links first, then the media sponsor (template prints the text first) */
#footer .footer-col-pratite { display: flex; flex-direction: column; }
#footer .footer-col-pratite > .row { order: 1; margin: 0; }
#footer .footer-col-pratite > .row .button-tag, #footer .footer-col-pratite > .row [class*="col"] { padding: 0; }
#footer .footer-col-pratite > .text-4 { order: 2; margin-top: 12px; }
#footer .footer-col-pratite > .text-4 p { font-size: 14px !important; }
#footer .footer-col-pratite p strong { display: block; margin-top: 4px; line-height: 1.2; }
/* Bottom bar: © + OIB | legal links | Izrađeno u Dugom Selu */
#footer .footer-copyright { border-top: 1px solid rgba(255, 255, 255, .18); background: none !important; }
#footer .footer-copyright .py-2 { padding: 0 !important; }
#footer .footer-copyright .row { align-items: center; row-gap: 8px; padding: 20px 0 !important; }
#footer .footer-copyright :is(span, p, a) { margin: 0 !important; color: #DCE8F7; font-size: 14px !important; }
#footer .footer-down-links .button-tag { display: flex; flex-wrap: wrap; gap: 6px 24px; }
#footer .footer-down-links a:hover { color: #FFFFFF !important; text-decoration: underline; text-underline-offset: 4px; }
#footer .footer-down-made p { color: #FFFFFF !important; font-weight: 600; }
@media (max-width: 991px) {
    #footer .footer-col-sjediste, #footer .footer-col-pratite { margin-bottom: 32px !important; }
    #footer .row.py-5 > .footer-col-kontakt { justify-content: flex-start; }
}
/* Mobile: centred footer (Marinko 12.10.2026, iPhone 14 Pro Max) */
@media (max-width: 991px) {
    #footer .row.py-5 > [class*="col"], #footer .footer-copyright [class*="col"] { text-align: center; }
    #footer .footer-col-logo img { display: block; margin-left: auto; margin-right: auto; }
    #footer .footer-col-logo p { margin-left: auto; margin-right: auto; }
    #footer .row.py-5 > [class*="col"]:not(.footer-col-logo) p { max-width: none; }
    #footer .row.py-5 > .footer-col-kontakt { justify-content: center; }
    #footer .row.py-5 [style*="justify-content: left"] { justify-content: center !important; flex-wrap: wrap; gap: 12px 24px; }
    #footer .footer-tel { justify-content: center; margin-right: 0; }
    #footer .footer-col-pratite { align-items: center; }
    #footer .footer-col-pratite > .row .button-tag p { justify-content: center; }
    #footer .footer-down-links .button-tag { justify-content: center; }
    #footer .footer-copyright { margin-left: 0 !important; margin-right: 0 !important; }
    #footer .footer-copyright .row { justify-content: center !important; margin-left: 0; margin-right: 0; }
    #footer .footer-copyright p { max-width: none; margin-left: auto; margin-right: auto; }
    #footer .footer-copyright .row > [class*="col"] { flex: 0 0 100%; max-width: 100%; padding-left: 0; padding-right: 0; }
    /* the fixed accessibility button sits bottom-left: keep the last line clear of it */
    #footer .footer-copyright .row { padding-bottom: 72px !important; }
}
/* ==== /Footer ==== */

/* ==== Banneri (section "banneri", _oglasi/slot.twig): image banners with rotation, ad network code ==== */
.oglas--zakupljen { position: relative; }
.oglas__tag { position: absolute; top: 4px; left: 4px; z-index: 2; padding: 1px 6px; border-radius: 3px; background: rgba(13, 27, 46, .55); color: #FFFFFF; font-size: 10.5px; font-weight: 600; letter-spacing: .03em; pointer-events: none; }
.oglas__rot { display: grid; width: 100%; aspect-ratio: calc(var(--oglas-w) / var(--oglas-h)); overflow: hidden; border-radius: 4px; background: #E3E9F0; }
.oglas__slajd { grid-area: 1 / 1; display: block; opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility .5s; }
.oglas__slajd.is-aktivan { opacity: 1; visibility: visible; }
.oglas__slajd img { display: block; width: 100%; height: 100%; object-fit: cover; }
.oglas__kod { display: flex; justify-content: center; min-height: var(--oglas-h); }
@media (max-width: 991px) {
    .oglas__rot { aspect-ratio: calc(var(--oglas-mw) / var(--oglas-mh)); }
    .oglas__kod { min-height: var(--oglas-mh); }
}
@media (prefers-reduced-motion: reduce) { .oglas__slajd { transition: none; } }
/* ==== /Banneri ==== */

/* ==== Najave (Najave.dc.html, templates/_najave/lista.twig): tabs, months, date plate, .ics button | banner B ==== */
.naj-page { padding:35px 0 96px; }
.naj-page > .container-xl > [class*="container"] { padding-left: 0 !important; padding-right: 0 !important; }
.naj-page > .container-xl > [class*="container"] > .row { margin-left: 0; margin-right: 0; }
.naj-page > .container-xl > [class*="container"] > .row > [class*="col"] { padding-left: 0; padding-right: 0; }
.naj-page .lead { margin: 0 0 8px; }
.naj-tabs { display: flex; flex-wrap: wrap; gap: 4px 32px; margin: 16px 0 48px; border-bottom: 1px solid var(--line); }
.naj-n { font-weight: 500; color: var(--ink-3); }
.naj-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 48px; align-items: start; }
.naj-mjesec + .naj-mjesec { margin-top: 44px; }
.naj-mjesec__h { margin: 0; padding-bottom: 14px; border-bottom: 1px solid var(--line); color: var(--ink); font-size: 28px; font-weight: 700; font-stretch: 87.5%; line-height: 1.15; }
.naj-item { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 16px 24px; align-items: start; padding: 28px 0; border-bottom: 1px solid var(--line); }
.naj-plate { display: flex; flex-direction: column; align-items: center; padding: 12px 0; }
.naj-plate__d { font-size: 34px; font-weight: 800; font-stretch: 75%; line-height: 1; }
/* Past events: muted plate instead of the blue enamel one */
.naj-plate:not(.is-up) { background: var(--paper-2) !important; color: var(--ink-3); box-shadow: inset 0 0 0 1px var(--line); }
.naj-plate__m { margin-top: 4px; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.naj-item__main { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.naj-item__meta { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 15px; }
.naj-item__meta i { margin-right: 4px; color: var(--brand); }
.naj-item__title { margin: 0; font-size: clamp(22px, 2.2vw, 28px); font-weight: 700; font-stretch: 87.5%; line-height: 1.15; text-wrap: balance; }
.naj-item__title a { color: var(--ink); text-decoration: none; }
.naj-item__title a:hover { color: var(--brand); text-decoration: underline; text-underline-offset: 4px; }
.naj-item p { margin: 0; max-width: 65ch; color: var(--ink-2); }
.naj-item__side { grid-column: 2; }
.naj-ics.btn { min-height: 44px; padding: 0 16px; font-size: 15px; }
.naj-empty { padding: 24px; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); color: var(--ink-2); }
.naj-empty a { color: var(--brand); font-weight: 600; }
.naj-aside .oglas--b { margin-top: 0; }
@media (min-width: 768px) {
    .naj-item { grid-template-columns: 96px minmax(0, 1fr) auto; gap: 32px; }
    .naj-plate__d { font-size: 40px; }
    .naj-item__side { grid-column: 3; }
}
@media (min-width: 992px) {
    .naj-grid { grid-template-columns: minmax(0, 1fr) 300px; gap: 80px; }
    .naj-aside { position: sticky; top: 110px; }
}
/* ==== /Najave ==== */

/* ==== Najava detalj (templates/_najave/detalj.twig, entry design #4854): event block, text, share | B, upcoming, CTA ==== */
.najd-page { padding: 35px 0 96px; }
.najd-page > .container-xl > [class*="container"] { padding-left: 0 !important; padding-right: 0 !important; }
.najd-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 48px; align-items: start; }
.najd { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.najd-event { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 20px 24px; align-items: start; padding: 24px; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.najd-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px 24px; margin: 0; }
.najd-facts dt { margin-bottom: 2px; color: var(--ink-3); font-size: 12.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.najd-facts dd { margin: 0; color: var(--ink); font-size: 17px; font-weight: 600; line-height: 1.35; }
.najd-event__cta { grid-column: 1 / -1; }
.najd-past { color: var(--ink-3); font-size: 15px; font-weight: 600; }
.najd-photo { margin: 0; }
.najd-body { max-width: 760px; color: var(--ink-2); font-size: 19px; line-height: 1.7; }
.najd-body p { margin: 0 0 1em; }
.najd-share { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding-top: 4px; }
.najd-share__label { color: var(--ink); font-size: 15px; font-weight: 600; }
.najd-share a.chip { width: 44px; height: 44px; padding: 0; justify-content: center; }
.najd-nav { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 12px; }
.najd-nav__card { display: flex; flex-direction: column; gap: 8px; color: var(--ink) !important; text-decoration: none !important; }
.najd-nav__card:hover { box-shadow: inset 0 0 0 1.5px var(--brand); }
.najd-nav__card .meta i { color: var(--brand); }
.najd-nav__t { color: var(--ink); font-size: 19px; font-weight: 700; font-stretch: 87.5%; line-height: 1.25; }
.najd-aside { display: flex; flex-direction: column; gap: 36px; }
.najd-aside .oglas--b { margin-top: 0; }
.najd-list__h { margin: 0 0 14px; color: var(--ink); font-size: 22px; font-weight: 700; font-stretch: 87.5%; }
.najd-list__item { display: flex; flex-direction: column; gap: 4px; padding: 16px 0; border-top: 1px solid var(--line); text-decoration: none !important; }
.najd-list__t { color: var(--ink); font-size: 17px; font-weight: 700; font-stretch: 87.5%; line-height: 1.3; }
.najd-list__item:hover .najd-list__t { color: var(--brand); }
.najd-cta { display: flex; flex-direction: column; gap: 14px; padding: 26px; border-radius: 4px; background: var(--brand); color: #FFFFFF; }
.najd-cta__h { font-size: 20px; font-weight: 700; font-stretch: 87.5%; }
.najd-cta__p { color: var(--on-brand-2); font-size: 15px; }
.najd-cta .btn-y { align-self: flex-start; }
@media (min-width: 768px) {
    .najd-event { grid-template-columns: 96px minmax(0, 1fr) auto; gap: 28px; align-items: center; }
    .najd-event__cta { grid-column: auto; }
    .najd-nav { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .najd-nav__card--next { align-items: flex-end; text-align: right; }
}
@media (min-width: 992px) {
    .najd-grid { grid-template-columns: minmax(0, 1fr) 300px; gap: 80px; }
    .najd-aside { position: sticky; top: 110px; }
}
/* ==== /Najava detalj ==== */

/* ==== Najave: month calendar in the aside (templates/_najave/lista.twig) ==== */
.naj-aside { display: flex; flex-direction: column; gap: 32px; }
.naj-cal { display: flex; flex-direction: column; gap: 16px; padding: 24px; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.naj-cal__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.naj-cal__title { color: var(--ink); font-size: 18px; font-weight: 700; font-stretch: 87.5%; }
.naj-cal__nav { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 0; border-radius: 4px; background: none; color: var(--ink); font-size: 18px; cursor: pointer; }
.naj-cal__nav:hover:not([disabled]), .naj-cal__nav:focus-visible { background: var(--paper); color: var(--brand); outline: none; }
.naj-cal__nav[disabled] { color: var(--line); cursor: default; }
.naj-cal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.naj-cal__wd { padding-bottom: 6px; color: var(--ink-3); font-size: 12.5px; font-weight: 700; text-align: center; }
.naj-cal__d { display: flex; align-items: center; justify-content: center; height: 36px; border-radius: 4px; color: var(--ink); font-size: 14.5px; font-weight: 500; font-variant-numeric: tabular-nums; }
.naj-cal__d.is-today { box-shadow: inset 0 0 0 1.5px var(--line); font-weight: 700; }
a.naj-cal__d.is-ev { background: var(--brand); color: #FFFFFF !important; font-weight: 800; text-decoration: none !important; }
a.naj-cal__d.is-ev:hover, a.naj-cal__d.is-ev:focus-visible { background: var(--brand-2); outline: none; }
.naj-cal__legend { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.naj-cal__legend i { width: 14px; height: 14px; border-radius: 3px; background: var(--brand); }
.naj-item { scroll-margin-top: 130px; }
.naj-item:target, .naj-item.is-flash { animation: naj-flash 1.6s ease-out; }
@keyframes naj-flash { from { background: var(--paper-2); } to { background: transparent; } }
@media (prefers-reduced-motion: reduce) { .naj-item:target, .naj-item.is-flash { animation: none; } }
/* ==== /Najave calendar ==== */
/* ==== /Zaboravljena lozinka ==== */
.reset-info {margin-bottom:0;}
.reset-info {margin-bottom:0; max-width: 59%;}.reset-input .input { width: 100%; height: 50px; padding: 0 16px; border: 0; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1.5px var(--line); color: var(--ink); font-size: 17px; }
.reset-input .mt-3 input { width: 100%; height: 50px; padding: 0 16px; border: 0; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1.5px var(--line); color: var(--ink); font-size: 17px; }
.reset-input .mt-3 input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--brand); }
.reset-input .btn { height: 50px; padding: 0 24px; background: #f2c230; color: #0d1b2e;}
.reset-input .btn:hover {background:#ddaa0e;}
/* ===== Dokumenti: search + chips row (Dokumenti.dc.html), filtering in other-js ===== */
.dok [hidden] { display: none !important; }
.dok-tools { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px 24px; align-items: end; margin-bottom: 36px; }
.dok-tools .dok-chips { margin-bottom: 0; }
.dok-q { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.dok-q .label { margin: 0; }
.dok-q__field { position: relative; display: block; }
.dok-q__field i { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--ink-3); pointer-events: none; }
.dok-q .input { padding-left: 44px; }
.dok-q .input::-webkit-search-cancel-button { cursor: pointer; }
.dok-chips .tag-link.is-on .tag-badge { background: var(--brand) !important; color: #FFFFFF !important; box-shadow: none; }
.dok-empty { margin: 36px 0 0; padding: 24px; background: #FFFFFF; border-radius: 4px; box-shadow: inset 0 0 0 1px var(--line); color: var(--ink-2); font-size: 17px; }
.dok-empty a { color: var(--brand); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 1200px) {
    .dok-tools { grid-template-columns: 480px minmax(0, 1fr); }
    .dok-tools .chip, .dok-tools .dok-chips .tag-badge { height: 50px; }
}

/* ===== Cehovi (/cehovi, templates/_cehovi/lista.twig, Ceh.dc.html) ===== */
.ceh-page { padding: 35px 0 96px; }
.ceh { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: start; }
.ceh-nav { display: flex; gap: 8px; overflow-x: auto; margin: 0 -15px; padding: 0 15px 6px; scrollbar-width: thin; }
.ceh-nav__label { display: none; }
.ceh-nav__link { flex: none; display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 11px 15px; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); font-size: 16px; font-weight: 600; line-height: 1.25; color: var(--ink); text-decoration: none; white-space: nowrap; }
.ceh-nav__link:hover { color: var(--brand); text-decoration: none; box-shadow: inset 0 0 0 1.5px var(--brand); }
.ceh-nav__link.is-on, .ceh-nav__link.is-on:hover { background: var(--brand); color: #FFFFFF; box-shadow: none; }
.ceh-nav__n { min-width: 24px; height: 22px; padding: 0 7px; border-radius: 11px; display: inline-grid; place-items: center; background: var(--paper-2); color: var(--brand); font-size: 13px; font-weight: 700; }
.ceh-nav__link.is-on .ceh-nav__n { background: rgba(255, 255, 255, .2); color: #FFFFFF; }
.ceh-panels { display: flex; flex-direction: column; gap: 72px; min-width: 0; scroll-margin-top: 110px; }
.ceh-panel { display: flex; flex-direction: column; gap: 48px; scroll-margin-top: 110px; }
.ceh-panel[hidden] { display: none !important; }
.ceh-hero { display: grid; gap: 24px; padding: 28px 24px; border-radius: 4px; background: var(--brand); color: #FFFFFF; }
.ceh-hero__h { margin: 0; font-size: 36px !important; text-transform: uppercase; color: #FFFFFF !important; }
.ceh-hero__p { margin: 12px 0 0; max-width: 60ch; font-size: 18px; line-height: 1.55; color: var(--on-brand-2); }
.ceh-hero__dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-self: end; padding: 20px 24px; border-radius: 4px; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .6); }
.ceh-hero__dl dt { font-size: 14px; font-weight: 400; color: var(--on-brand-2); }
.ceh-hero__dl dd { margin: 4px 0 0; font-size: 18px; font-weight: 700; color: #FFFFFF; }
.ceh-block { display: flex; flex-direction: column; gap: 18px; }
.ceh-block__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 16px; }
.ceh-block__h { margin: 0; font-size: 32px !important; color: var(--ink); }
.ceh-obrti { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.ceh-obrt { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 22px; color: #FFFFFF; text-decoration: none; }
.ceh-obrt:hover, .ceh-obrt:focus-visible { background: var(--brand-2); color: #FFFFFF; text-decoration: none; }
.ceh-obrt__txt { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ceh-obrt .plate-name { font-size: 22px; }
.ceh-obrt > .plate-sub { flex: none; text-align: right; }
.ceh-upis { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 22px; color: var(--ink); text-decoration: none; }
.ceh-upis:hover { color: var(--ink); text-decoration: none; box-shadow: inset 0 0 0 1.5px var(--brand); }
.ceh-upis__txt { display: flex; flex-direction: column; gap: 4px; }
.ceh-objava { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 20px; align-items: center; padding-bottom: 20px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.ceh-objava:hover { color: var(--ink); text-decoration: none; }
.ceh-objava:hover .h4 { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }
.ceh-objava .ui-photo { height: auto; aspect-ratio: 11 / 7; }
.ceh-objava__txt { display: flex; flex-direction: column; gap: 6px; }
.ceh-sjednica { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 20px; }
.ceh-sjednica__h { display: flex; align-items: center; gap: 14px; }
.ceh-sjednica__h i { font-size: 22px; color: var(--brand); }
@media (min-width: 768px) {
    .ceh-obrti { grid-template-columns: 1fr 1fr; }
    .ceh-objava { grid-template-columns: 220px minmax(0, 1fr); gap: 28px; }
}
@media (min-width: 992px) {
    .ceh { grid-template-columns: 280px minmax(0, 1fr); gap: 56px; }
    .ceh-nav { position: sticky; top: 110px; flex-direction: column; gap: 4px; overflow: visible; margin: 0; padding: 0; }
    .ceh-nav__label { display: block; margin-bottom: 10px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
    .ceh-nav__link { padding: 13px 16px; background: transparent; box-shadow: none; font-size: 17px; white-space: normal; }
    .ceh-nav__link:hover { background: var(--paper-2); box-shadow: none; }
    .ceh-hero { grid-template-columns: minmax(0, 1fr) auto; padding: 36px 40px; }
    .ceh-hero__h { font-size: 48px !important; }
    .ceh-hero__dl { min-width: 340px; }
}
@media (min-width: 1400px) {
    .ceh { grid-template-columns: 340px minmax(0, 1fr); gap: 88px; }
    .ceh-hero__h { font-size: 60px !important; }
    .ceh-block__h { font-size: 38px !important; }
}

/* ==========================================================================
   NATJEČAJI v2 (10.10.2026.) – list rows with the Najave date plate, tabs from
   templates/_natjecaji/tabs.twig, detail templates/_natjecaji/detalj.twig
   ========================================================================== */
.natj-tabs2 { display: flex; flex-wrap: wrap; gap: 4px 32px; margin: 8px 0 32px; border-bottom: 1px solid var(--line); }
.natj-tabs2 .ui-tab { display: inline-block; text-decoration: none !important; }
.natj-tabs2 .ui-tab:hover { color: var(--brand); }
.natj-tabs2 .ui-tab.on .naj-n { color: var(--brand); }
.natj .lead + .natj-tabs2 { margin-top: 0; }

.natj-item--v2 { grid-template-columns: 80px minmax(0, 1fr); gap: 16px 24px; padding: 28px 0; }
.natj-item--v2 .natj-item__main { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.natj-item--v2 .naj-item__meta a { font-weight: 700; color: var(--brand); text-decoration: none; }
.natj-item--v2 .naj-item__meta a:hover { text-decoration: underline; text-underline-offset: 3px; }
.natj-item--v2 .natj-item__main p { max-width: 65ch; }
.natj-item--v2 .natj-item__side { grid-column: 2; }
@media (min-width: 768px) {
    .natj-item--v2 { grid-template-columns: 96px minmax(0, 1fr) auto; gap: 32px; }
    .natj-item--v2 .natj-item__side { grid-column: 3; flex-direction: column; align-items: flex-end; gap: 14px; }
}

/* Detail */
.natjd-event .najd-facts dd a { color: var(--brand); font-weight: 700; text-decoration: none; }
.natjd-event .najd-facts dd a:hover { text-decoration: underline; text-underline-offset: 3px; }
.natjd-event .natj-rok { font-size: 13px; padding: 3px 8px; vertical-align: 2px; }
.natjd-h { margin: 0 0 12px; color: var(--ink); font-size: 24px; font-weight: 700; font-stretch: 87.5%; line-height: 1.2; }
.najd-body ul { margin: 0 0 1em; padding-left: 22px; }
.najd-body li + li { margin-top: 6px; }
.najd-body a { color: var(--brand); font-weight: 600; }
.natjd-docs ul { list-style: none; margin: 0; padding: 0; max-width: 760px; }
.natjd-docs li a { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.natjd-docs li:last-child a { border-bottom: 1px solid var(--line); }
.natjd-docs li a i { color: var(--brand); font-size: 20px; }
.natjd-docs__t { flex: 1; font-weight: 700; }
.natjd-docs li a:hover .natjd-docs__t { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }
.natjd-help { display: flex; flex-direction: column; gap: 18px; padding: 26px; border-radius: 4px; background: var(--paper-2, #F2F5F8); box-shadow: inset 0 0 0 1px var(--line); max-width: 760px; }
.natjd-help p { margin: 0; color: var(--ink-2); }
.natjd-help__cta { display: flex; flex-wrap: wrap; gap: 12px; }
.natjd-help__cta .btn { min-height: 46px; }
.natjd-signup .media-order { flex: none; max-width: none; width: 100%; padding: 0 !important; }
.natjd-signup .sidebar > .container-xl { margin-bottom: 0 !important; }
.natjd-aside .najd-list__item .meta { font-size: 14px; }
@media (min-width: 992px) {
    .natjd-help { flex-direction: row; align-items: center; justify-content: space-between; }
    .natjd-help__cta { flex-direction: column; flex: none; }
}
/* Natječaji: nested Bootstrap containers (grid .container-fluid, ckEditor lead .container-xl) added 15px, rows sat right of the title/tabs */
.natj .container-fluid.natj-grid, .natj > .container-xl > .container-xl { padding-left: 0 !important; padding-right: 0 !important; }

/* Dokumenti i obrasci (Za obrtnike): Udruzenje documents moved to Udruzenje > Dokumenti Udruzenja (12.10.2026) */
.dok-tools a.tag-link[href$="/dokumenti/udruzenje"] { display: none; }

/* Pogodnosti za članove: "Najam dvorane Udruženja" card in the right column (Marinko 12.10.2026) */
.dvorana-card { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; padding: 24px; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.dvorana-card__ill { display: block; width: 100%; height: auto; margin-bottom: 6px; }
.dvorana-card__h { margin: 0; color: var(--ink); font-size: 21px; font-weight: 700; font-stretch: 87.5%; line-height: 1.2; }
.dvorana-card p { margin: 0; color: var(--ink-2); font-size: 15.5px; line-height: 1.55; }
.dvorana-card__kontakt a { color: var(--brand); font-weight: 700; text-decoration: none; white-space: nowrap; }
.dvorana-card__kontakt a:hover { text-decoration: underline; text-underline-offset: 3px; }
.pogodnosti-izvor { margin-top: 16px; }

/* ==== Pogodnosti za članove: "Pogodnosti kod lokalnih obrtnika" (first) + "HOK Obrtnik plus" sections (13.10.2026) ==== */
.pog-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 32px; margin: 8px 0 22px; }
.pog-head__h { margin: 0 0 6px; color: var(--ink); font-size: clamp(26px, 2.6vw, 34px); font-weight: 800; font-stretch: 75%; line-height: 1.1; }
.pog-head__p { margin: 0; max-width: 62ch; color: var(--ink-2); font-size: 17px; }
.pog-head__btn { flex: none; }
.pog-head--hok { margin-top: 0; padding-top: 48px; border-top: 1px solid var(--line); }
.pog-lokalne { margin-bottom: 56px; }
.pog-lokalne > .column-half { align-items: flex-start; }
.pog-lokalne__list { flex: 1; min-width: 0; }
.lp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.lp-card__top { display: flex; align-items: center; gap: 14px; }
.lp-card__logo { flex: none; width: 56px; height: 56px; object-fit: contain; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.lp-card__name { margin: 0; }
.lp-card__name a { color: var(--ink); text-decoration: none; }
.lp-card__name a:hover { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }
.lp-card__p { margin: 4px 0 0; color: var(--ink-2); font-size: 15.5px; line-height: 1.45; }
.pog-lokalne .pogodnosti-right .dvorana-card { margin-top: 0; }
/* detail page */
.lp-head__logo { width: 96px; height: 96px; object-fit: contain; border-radius: 4px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.lp-head__plate { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; padding: 0; font-size: 40px; font-weight: 800; font-stretch: 75%; }
.lp-head__pogodnost dd { color: var(--brand); font-size: 19px; }
.lp-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; max-width: 760px; }
.lp-gallery img { display: block; width: 100%; height: auto; border-radius: 4px; }
.lp-kontakt .obrt-contact { margin-bottom: 12px; }
@media (max-width: 991px) {
    .pog-lokalne > .column-half { flex-direction: column; gap: 24px; }
    .pog-lokalne .pogodnosti-right { margin-left: 0; max-width: none; width: 100%; }
}
.lp-card .lp-card__name a { color: var(--ink) !important; }
.lp-card .lp-card__name a:hover { color: var(--brand) !important; }

/* Palette (command palette, logged-in users only): its button sits at bottom/right 20px, on top of .scroll-to-top.
   Its bottom is a layered !important, which beats any unlayered override, so lift it with margin instead. */
button.p\:fixed.p\:bottom-5.p\:right-5 { margin-bottom: 55px; }

/* Homepage map: "Cijelo područje" button back to the area view (other-js homeReset, 16.10.2026) */
.map-reset { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; padding: 0 14px; height: 40px; border: 0; border-radius: 2px; background: #FFFFFF; color: #0C549E; font: 600 14px/1 Archivo, Arial, sans-serif; box-shadow: rgba(0, 0, 0, .3) 0 1px 4px -1px; cursor: pointer; }
.map-reset:hover { background: #F2F5F9; }
.map-reset[hidden] { display: none; }

/* Sidebar post thumbnails (Najnovije vijesti …): fill the 130×74 box without squashing 4:3 images (16.10.2026) */
.post-image .img-thumbnail img { object-fit: cover; }

/* Vijest: Podijelite ispod teksta (20.10.2026.) */
.vij-share { margin: 28px 0 8px; padding-top: 22px; border-top: 1px solid var(--line); }

/* Udruženje: kartice cehova u plavoj traci (_cehovi/kartice.twig, 20.10.2026.) */
.ceh-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; padding: 15px 0 20px; }
.ceh-card { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; min-height: 140px; padding: 22px 24px; border-radius: 4px; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .75); color: #FFFFFF; text-decoration: none; transition: background-color .15s ease; }
.ceh-card:hover, .ceh-card:focus-visible { background: rgba(255, 255, 255, .08); color: #FFFFFF; text-decoration: none; }
.ceh-card__h { font-size: 25px; font-weight: 800; line-height: 1.02; letter-spacing: -0.3px; text-transform: uppercase; }
.ceh-card__p { color: #DCE8F7; font-size: 17px; line-height: 1.5; }
.ceh-card--cta { background: #F2C230; box-shadow: inset 0 0 0 1.5px #F2C230; color: #0D1B2E; }
.ceh-card--cta:hover, .ceh-card--cta:focus-visible { background: #F5CE55; color: #0D1B2E; }
.ceh-card--cta .ceh-card__h { text-transform: none; }
.ceh-card__more { font-size: 19px; font-weight: 700; }
.ceh-card__more i { margin-left: 6px; }
@media (max-width: 1199px) { .ceh-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) { .ceh-cards { grid-template-columns: 1fr; gap: 14px; } .ceh-card { min-height: 0; } .ceh-card__h { font-size: 22px; } }

/* Cehovi: e-mail ceha u okviru predsjednika (20.10.2026.) */
.ceh-hero__mail { grid-column: 1 / -1; }
.ceh-hero__dl dd a { color: #FFFFFF; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }


/* Natječaj detail: text and its boxes fill the column on desktop, not 760px / global p 68ch (Marinko 04.11.2026.) */
.natjd .najd-body, .natjd .natjd-help, .natjd-docs ul { max-width: none; }
.natjd .najd-body p, .natjd .najd-body li { max-width: none; }