.article-full-image.float-img-fluid {
    max-width: 100% !important;
    width: 100% !important;
    float: none !important;
}

.article-full-image.float-img-fluid img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block;
}

iframe[src*="youtube.com"], iframe[src*="youtu.be"] {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
    display: block;
}

.article-intro-image.float-img-fluid {
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
	 margin-top: 0px !important;
    float: none !important;
}

.article-intro-image.float-img-fluid img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto;
    display: block;
}

/* Zoom on hover - moderna tranzicija na intro slici (blog/kategorija liste) */
.article-intro-image.float-img-fluid {
    overflow: hidden;
    border-radius: 8px;
}

.article-intro-image.float-img-fluid img {
    transition: transform 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.article-intro-image.float-img-fluid:hover img {
    transform: scale(1.08);
}

.article-list.cols-2 .row {
    display: flex;
    flex-wrap: wrap;
}

.article-list.cols-2 .row > [class*="col-"] {
    display: flex;
}

.article-list.cols-2 .article {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.article-list.cols-2 .article-body {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.article-list.cols-2 .article-introtext {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.article-list.cols-2 .readmore {
    margin-top: auto;
}

.article-list.cols-2 .article-intro-image img {
    height: 220px;
    object-fit: cover;
}

.impressum-wrapper {
    max-width: 850px;
    margin: 40px auto;
    padding: 20px;
    font-family: "Inter", Arial, sans-serif;
    color: #333;
}


.impressum-header {
    text-align: center;
    margin-bottom: 35px;
}


.impressum-header h1 {
    font-size: 34px;
    margin-bottom: 10px;
    font-weight: 700;
    color: #111;
}


.impressum-header h2 {
    font-size: 26px;
    margin: 0;
    color: #0066cc;
    letter-spacing: 2px;
}


.impressum-header p {
    color: #777;
    font-size: 16px;
}


.impressum-card {
    background: #fff;
    border-radius: 16px;
    padding: 35px;
    box-shadow: 0 10px 35px rgba(0,0,0,0.08);
}


.impressum-item {
    padding: 22px 0;
    border-bottom: 1px solid #eee;
}


.impressum-item:last-child {
    border-bottom: none;
}


.impressum-item h3 {
    margin: 0 0 10px;
    font-size: 17px;
    text-transform: uppercase;
    color: #0066cc;
    letter-spacing: .5px;
}


.impressum-item p {
    margin: 5px 0;
    font-size: 16px;
    line-height: 1.7;
}


.impressum-item a {
    color: #0066cc;
    text-decoration: none;
    transition: .3s;
}


.impressum-item a:hover {
    color: #004080;
}


.impressum-item ul {
    padding-left: 20px;
    margin: 0;
}


.impressum-item li {
    margin-bottom: 8px;
    font-size: 16px;
}


.highlight {
    background: linear-gradient(135deg,#0066cc,#00a8ff);
    color: white;
    border-radius: 12px;
    padding: 25px;
    text-align: center;
    margin-bottom: 15px;
}


.highlight span {
    display:block;
    text-transform:uppercase;
    font-size:14px;
    opacity:.85;
    margin-bottom:8px;
}


.highlight strong {
    font-size:28px;
    letter-spacing:2px;
}


@media(max-width:600px){

    .impressum-wrapper {
        padding:15px;
    }

    .impressum-card {
        padding:20px;
    }

    .impressum-header h1 {
        font-size:28px;
    }

}

.itemid-101 #sp-main {padding-top: 0px}

#sp-section-2 {background:#f5f5f5; padding:25px 0}

h4.jacl-item__title {font-size:18px}

/* Blog/category liste — sve slike ista visina, bez izobličenja */
.blog.com-content-category-blog .article-list.cols-3 .article-intro-image img {
    display: block;
    height: 180px!important;       /* podesi po ukusu, npr. 180-240px */
	margin-bottom:30px;
    overflow: hidden;
    border-radius: 6px;  /* opciono, prati stil kartica */
}

.article-intro-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;   /* seče višak, popunjava kontejner bez razvlačenja */
    display: block;
}

.bottom-logo {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
    filter: brightness(0) invert(1);
}


/* ==========================
   Modern Breadcrumbs
========================== */

.mod-breadcrumbs {
    margin: 20px 0;
}

.mod-breadcrumbs.breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
    padding: 12px 20px;
    background: #fff;
    border: 1px solid #e9edf3;
    border-radius: 14px;
    box-shadow: 0 8px 25px rgba(0,0,0,.05);
    font-size: 15px;
    font-weight: 500;
}

.mod-breadcrumbs li {
    display: flex;
    align-items: center;
}

.mod-breadcrumbs li + li::before {
    content: "›";
    color: #b8c2cc;
    font-size: 18px;
    margin: 0 .7rem;
    font-weight: 400;
}

.mod-breadcrumbs a {
    color: #5b6472;
    text-decoration: none;
    transition: .25s ease;
}

.mod-breadcrumbs a:hover {
    color: #2563eb;
}

.mod-breadcrumbs .active,
.mod-breadcrumbs li:last-child {
    color: #111827;
    font-weight: 700;
}

.mod-breadcrumbs svg,
.mod-breadcrumbs i {
    margin-right: 6px;
    color: #2563eb;
}

/* Custom header layout: banner slot next to logo, full-width menu bar below */

#sp-header .row {
  flex-wrap: nowrap;
}

#sp-header #sp-top3 {
  min-height: 1px;
  min-width: 0;
  overflow: hidden;
}

#sp-header #sp-top3 img,
#sp-header #sp-top3 iframe {
  max-width: 100%;
  height: auto;
}

/* Desktop/tablet: #sp-header has a fixed height, so cap the banner's
   own height to fit inside it instead of just constraining its width —
   otherwise a tall image pushes the row taller than the header box and
   overlaps the menu bar underneath it. */
@media (min-width: 768px) {
    #sp-header #sp-top3 img, #sp-header #sp-top3 iframe {
        width: auto !important;
        max-height: 120px !important;
        margin-top: 15px;
    }
}

@media (max-width: 767px) {
  #sp-header .row {
    flex-wrap: wrap;
  }

  #sp-header .sp-header-topline,
  #sp-header #sp-top3 {
    flex: 0 0 100%;
    max-width: 100%;
  }

  #sp-header #sp-top3 {
    overflow: visible;
    margin-top: 12px;
  }

  #sp-header #sp-top3 .sp-column {
    justify-content: center !important;
  }

  /* #sp-header has a fixed height in the theme; let it grow so the
     stacked banner doesn't overflow into (and get covered under) the
     menu bar / hamburger below it */
  #sp-header {
    height: auto;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  #sp-header .container-inner > .row {
    min-height: 0;
  }
}

#sp-menu-bar {
  width: 100%;
  background: #fff;
 /* border-top: 1px solid rgba(0, 0, 0, 0.08);*/
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.06);
  position: relative;
  z-index: 98;
border-top: 1px solid #eee;
    margin-top: 15px;
}

#sp-menu-bar #sp-menu {
  min-height: 50px;
}


@media (max-width:991px) {
	
	.container-inner div.row {justify-content: center;}
	
}

@media (min-width:1200px) and (max-width:1670px) {
	
	.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    display: inline-block;
    padding: 0 5px;
    line-height: 130px;
    font-size: 15px;
    margin: 0;
    text-transform: uppercase;
}

.header-modules .sp-module  {display:none!important}

}

@media (min-width: 991px) and (max-width: 1200px) {
    .sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
        display: inline-block;
        padding: 0 2px;
        line-height: 130px;
        font-size: 13px;
        margin: 0;
        text-transform: uppercase;
    }
	
	.header-modules .sp-module  {display:none!important}
}

@media (min-width: 768px) and (max-width:991px) {
    #sp-header #sp-top3 img, #sp-header #sp-top3 iframe {
        width: auto !important;
        max-height: 110px !important;
        margin-top: 6px;
    }
}

@media (max-width: 576px) {
.blog.com-content-category-blog .article-list.cols-3 .article-intro-image img{ height: 160px; }
}

/* ==========================================================
   mod_articles override styling ("Poslednji članci" i sl.)
   NAPOMENA: PHP override fajlovi u templates/magazine_mic/html/mod_articles/
   se ne učitavaju na sajtu (nema mic-articles-widget klase u DOM-u), pa je
   sav stajling urađen isključivo preko Module Class Suffix-a (mic-articles-latest)
   i core mod_articles klasa (mod-articles-*). Nije potreban nijedan .php fajl.
   Podešavanje: modul → Advanced tab → Module Class Suffix = mic-articles-latest
   (sa razmakom ispred, kako Joomla obično traži)
========================================================== */

.mic-articles-latest .sp-module-title {
  color: #0a1f44;
  font-weight: 700;
  font-size: 19px;
  position: relative;
  padding-bottom: 12px;
  margin: 0 0 20px 0;
}

.mic-articles-latest .sp-module-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 180px;
  height: 1px;
  background: #e45e4d;
  border-radius: 2px;
}

.mic-articles-latest .sp-module-content {
  background: #ffffff;
  border: 1px solid #e9edf3;
  border-radius: 14px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
  padding: 24px;
}

.mic-articles-latest .mod-articles-items,
.mic-articles-latest .mod-articles {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mic-articles-latest .mod-articles-items > li,
.mic-articles-latest .mod-articles > li {
  padding: 24px 0;
  border-bottom: 1px solid #e3e7ee;
  overflow: hidden;
}

.mic-articles-latest .mod-articles-items > li:first-child,
.mic-articles-latest .mod-articles > li:first-child {
  padding-top: 0;
}

.mic-articles-latest .mod-articles-items > li:last-child,
.mic-articles-latest .mod-articles > li:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

.mic-articles-latest article.mod-articles-item {
  display: block;
}

.mic-articles-latest .mod-articles-items > li:last-child article.mod-articles-item {
  margin-bottom: 0;
}

.mic-articles-latest .mod-articles-title {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.35;
  margin: 0 0 10px 0;
}

.mic-articles-latest .mod-articles-title a {
  color: #0a1f44;
  text-decoration: none;
}

.mic-articles-latest .mod-articles-title a:hover {
  color: #2563eb;
}

.mic-articles-latest dl.list-unstyled {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin: 0 0 14px 0;
}

.mic-articles-latest dl.list-unstyled dt {
  display: none;
}

.mic-articles-latest dl.list-unstyled dd {
  margin: 0;
}

.mic-articles-latest .mod-articles-category,
.mic-articles-latest .mod-articles-category a {
  display: inline-block;
  background: #eaf1ff;
  color: #2563eb;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 4px 10px;
  border-radius: 20px;
  text-decoration: none;
}

.mic-articles-latest .mod-articles-category a:hover {
  background: #2563eb;
  color: #ffffff;
}

.mic-articles-latest .mod-articles-date,
.mic-articles-latest .mod-articles-writtenby,
.mic-articles-latest .mod-articles-hits {
  color: #8a94a6;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.mic-articles-latest .mod-articles-image,
.mic-articles-latest .article-intro-image {
  margin-top: 4px;
  border-radius: 10px;
  overflow: hidden;
}

.mic-articles-latest .mod-articles-image img,
.mic-articles-latest .article-intro-image img {
  width: 100%;
  height: 190px;
  object-fit: cover;
  display: block;
  border-radius: 10px;
  transition: transform 0.35s ease;
}

.mic-articles-latest .mod-articles-items > li:hover .mod-articles-image img,
.mic-articles-latest .mod-articles-items > li:hover .article-intro-image img {
  transform: scale(1.04);
}

@media (max-width: 480px) {
  .mic-articles-latest .mod-articles-image img,
  .mic-articles-latest .article-intro-image img {
    height: 160px;
  }
}