/* Mi.Ko. fixes (loaded after main.css) */
/* Mobile: the Light/Dark settings tab sat in the vertical middle of the right edge and covered text.
   Move it to the lower-right corner and make it smaller. */
@media (max-width: 767px) {
  .tp-theme-settings-area {
    top: auto;
    bottom: 16px;
    transform: translateX(100%);
  }
  .tp-theme-settings-area.settings-opened {
    transform: translateX(0);
  }
  .tp-theme-settings-open button {
    width: 44px;
    height: 44px;
    line-height: 44px;
    font-size: 18px;
    opacity: 0.9;
  }
}

/* Dark theme: these headings kept the light-theme dark color (contrast ~1.1:1, invisible). */
.miko-dark-active .tp-award-list-title {
  color: var(--tp-common-white-solid, #fff);
}
.miko-dark-active .ab-2-hero-subtitle {
  color: rgba(255, 255, 255, 0.6);
}

/* Blog liste: citati sa izvorom — link nasleđuje boju teksta (bez podrazumevane ljubičaste) */
.postbox__link-post-wrap p a,.postbox__blockquote-info a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.postbox__link-post-wrap p a:hover,.postbox__blockquote-info a:hover{opacity:.7}

/* ===== Futer (2026-10-17): linkovi u dve kolone, 4 jednake kolone, linije, tipografija ===== */
/* Sitemap (8) i Details (7) u dve kolone linkova na svim širinama */
.tp-footer-2-widget-menu ul{
  display:grid;grid-auto-flow:column;grid-template-rows:repeat(4,auto);
  grid-template-columns:repeat(2,max-content);column-gap:26px;row-gap:0;
  margin:0;padding:0;justify-content:start;
}
.tp-footer-2-widget-menu ul li{margin-bottom:0;line-height:37px;white-space:nowrap}
.tp-footer-2-widget-menu ul li a{font-size:16px;line-height:inherit}
/* 992-1199: stari raspored kolona, tanka linija izmedju Sitemap i Details */
@media (min-width:992px){
  .tp-footer-2-area .row>div:nth-child(3){border-left:1px solid rgba(255,255,255,.2)}
  .tp-footer-2-area .row>div:nth-child(3) .footer-col-2-2{padding-left:35px}
}
@media (min-width:992px){.tp-footer-2-widget-text p{font-size:15px;white-space:nowrap}}
/* >=1200: 4 jednake kolone, sadrzaj centriran, linije Sitemap|Details i Details|Office */
@media (min-width:1200px){
  .tp-footer-2-area .row>div{flex:0 0 25%;max-width:25%;padding-left:0;padding-right:0;margin-bottom:0}
  .tp-footer-2-area .row>div:nth-child(2),
  .tp-footer-2-area .row>div:nth-child(3),
  .tp-footer-2-area .row>div:nth-child(4){border-left:0}
  .tp-footer-2-area .row>div:nth-child(3),
  .tp-footer-2-area .row>div:nth-child(4){border-left:1px solid rgba(255,255,255,.2)}
  .tp-footer-2-area .tp-footer-2-widget{padding-left:0;padding-right:0;display:flex;flex-direction:column;align-items:center;text-align:center}
  .tp-footer-2-area .footer-col-2-2,.tp-footer-2-area .footer-col-2-3{padding-left:0;padding-right:0}
  .tp-footer-2-widget-menu{display:flex;flex-direction:column;align-items:center}
  .tp-footer-2-widget-menu ul{justify-content:center;text-align:left}
  .tp-footer-2-widget-title{text-align:center}
  .tp-footer-2-contact-item{margin-bottom:0}
  .tp-footer-2-contact-item span{font-size:13px;line-height:37px;margin-bottom:0;display:block}
}
/* >=992: uzak ekran (992-1199) u starom rasporedu ne sme da prelomi linkove */
@media (min-width:992px) and (max-width:1199px){
  .tp-footer-2-area .row>div:nth-child(1){flex:0 0 27%;max-width:27%}
  .tp-footer-2-area .row>div:nth-child(2){flex:0 0 38%;max-width:38%;padding-right:0}
  .tp-footer-2-area .row>div:nth-child(3){flex:0 0 35%;max-width:35%}
  .tp-footer-2-contact-item span{font-size:13px}
}
@media (max-width:991px){
  .tp-footer-2-area .row>div{border-left:0}
}

/* Blog: sličice u sidebar-u (Recent posts) su 100×100 – nove slike su isecane u kvadrat 200×200 */
.rc__post-thumb img{width:100px;height:100px;object-fit:cover;display:block}

/* About stranica (2026-10-19): traka sa case studies + linkovi u slajderu (Gallery / Lab) */
.ab-2-portfolio-thumb a{display:block}
.ab-2-portfolio-thumb img{display:block;width:100%;height:auto}
.mk-case-cap{display:flex;flex-direction:column;gap:4px;margin-top:16px;color:inherit;text-decoration:none}
.mk-case-cap span{font-size:14px;letter-spacing:.04em;text-transform:uppercase;opacity:.6}
.mk-case-cap b{font-size:24px;font-weight:500;line-height:1.1;letter-spacing:-.01em}
.mk-case-cap:hover{opacity:.7}
.tp-team-area .tp-hover-btn-item>a{display:block;line-height:0}
.tp-team-area .tp-team-item::after{pointer-events:none}
/* About slider: mirniji hover (umesto 1.3x zoom koji seče kartice) */
.tp-team-area .tp-team-item:hover img{transform:scale(1.04)}

/* A11y: vidljiv fokus tastature (template je gasio outline na a:focus / button:focus) */
html a:focus-visible,
html button:focus-visible,
html summary:focus-visible,
html input:focus-visible,
html select:focus-visible,
html textarea:focus-visible,
html [tabindex]:focus-visible {
  outline: 2px solid var(--mk-color-accent) !important;
  outline-offset: 3px !important;
}
/* A11y: zatvoren offcanvas ne sme da prima fokus tastature (prelaz 'all' u main.css odlaze skrivanje do kraja klizanja) */
.tp-offcanvas-area { visibility: hidden; }
.tp-offcanvas-area.opened { visibility: visible; }

/* Skip to main content (unutrašnje stranice) */
.mk-skip-link{position:fixed;left:12px;top:12px;z-index:100000;padding:12px 18px;background:#fff;color:#111!important;font:600 15px/1.2 Arial,sans-serif;text-decoration:none;border:2px solid #111;border-radius:6px;transform:translateY(-200%);transition:none}
.mk-skip-link:focus,.mk-skip-link:focus-visible{transform:none;outline:3px solid #6aa8ff;outline-offset:2px}
main#main-content:focus{outline:none}

/* Lab: hijerarhija naslova (h1 > h2 > h3). Retagirani h4/h5 zadržavaju ranije osnovne stilove (iste specifičnosti kao element selektor). */
:is(h2,h3):where(.mk-h4){font-size:24px;letter-spacing:var(--mk-letter-spacing-heading)}
:is(h2,h3):where(.mk-h5){font-size:20px;letter-spacing:normal}
.project-details-1-info h3.mk-h4{font-size:20px;font-weight:500;line-height:1;margin-bottom:0;letter-spacing:-.4px;color:var(--tp-common-black)}
.miko-dark-active .project-details-1-info h3.mk-h4{color:var(--tp-common-white)}

/* Header locked to the top look (2026-10-30): same shape and position on every page, before and after scrolling; only the background changes.
   Active on pages whose <body> has class mk-hdr-lock and whose header has id header-lock. */
body.mk-hdr-lock #header-lock{position:fixed;top:0;left:0;right:0;width:100%;z-index:999;transition:background-color .4s ease,box-shadow .4s ease}
body.mk-hdr-lock #header-lock.is-solid{background:rgba(255,255,255,.9);box-shadow:0 1px 3px 0 rgba(18,20,32,.14);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
html.miko-dark-active body.mk-hdr-lock #header-lock.is-solid{background:rgba(36,36,36,.85)}

/* ===== Aktivna stranica u navigaciji (ljubicasta + bold bez promene sirine) ===== */
html .tp-header-menu>nav>ul>li>a[aria-current="page"],
html .tp-main-menu-mobile .tp-main-menu-content ul li a[aria-current="page"],
html .tp-offcanvas-menu a[aria-current="page"]{
  color:var(--mk-color-accent)!important;
  -webkit-text-stroke:.55px currentColor; /* "bold" bez sirenja teksta: meni se ne pomera */
}

/* ===== Aktivna stranica: ikonica shopa i footer ===== */
html .tp-header-shop[aria-current="page"],
html.miko-dark-active .tp-header-shop[aria-current="page"],
html.miko-dark-active .tp-header-shop[aria-current="page"]:not(:hover):not(:focus-visible){color:var(--mk-color-accent)!important}
/* footer je uvek tamne pozadine (i u svetloj temi), pa je aktivna stranica uvek svetlija ljubicasta */
html .miko-site-footer a[aria-current="page"]{color:var(--mk-color-violet-400,#b983ff)!important;-webkit-text-stroke:.55px currentColor}

/* Mi.Ko. a11y (2026-11-01): naslovi offcanvas panela su sada <p> (nisu naslovi stranice).
   Pravila vracaju tacno isti izgled koji su imali kao <h3>. */
.tp-offcanvas-content p.tp-offcanvas-title:not(.sm) { font-size: 40px; line-height: 1; letter-spacing: -0.8px; font-weight: 700; color: var(--tp-common-black); }
.miko-dark-active .tp-offcanvas-content p.tp-offcanvas-title:not(.sm) { color: var(--tp-common-white); }
.tp-offcanvas-social p.sidebar__widget-title { letter-spacing: var(--mk-letter-spacing-heading); }

/* Mi.Ko. a11y (2026-11-01): ispravljeni nivoi naslova (h1-h6), ove klase cuvaju stari izgled naslova kojima je promenjen tag. */
html body .mkh-1 { font-size: 20px !important; line-height: 24px !important; letter-spacing: normal !important; }
html body .mkh-2 { font-size: 22px !important; line-height: 26.4px !important; letter-spacing: normal !important; margin-bottom: 14px !important; }
html body .mkh-3 { font-size: 24px !important; line-height: 28.8px !important; letter-spacing: -0.24px !important; margin-bottom: 14px !important; }
html body .mkh-4 { font-size: 20px !important; line-height: 24px !important; letter-spacing: normal !important; margin-bottom: 12px !important; color: rgb(27, 55, 74) !important; }
html body .mkh-5 { font-size: 69.12px !important; line-height: 69.12px !important; letter-spacing: -1.3824px !important; margin-bottom: 32px !important; }
html body .mkh-6 { font-family: Roboto, Arial, sans-serif !important; font-size: 28.16px !important; line-height: 33.792px !important; letter-spacing: -0.2816px !important; margin-bottom: 26px !important; }
html body .mkh-7 { font-family: "Noto Sans", Arial, sans-serif !important; font-size: 28.16px !important; line-height: 33.792px !important; letter-spacing: -0.2816px !important; margin-bottom: 26px !important; }
html body .mkh-8 { font-size: 28.16px !important; line-height: 33.792px !important; letter-spacing: -0.2816px !important; margin-bottom: 18px !important; }
html body .mkh-9 { font-size: 20px !important; line-height: 24px !important; letter-spacing: -0.2px !important; margin-top: 14px !important; margin-bottom: 0px !important; }
html body .mkh-10 { font-size: 20px !important; line-height: 20px !important; letter-spacing: -0.4px !important; margin-bottom: 0px !important; }
html body .mkh-11 { color: rgb(238, 242, 245) !important; }
/* tamna tema: boje naslova kojima je promenjen tag */
html.miko-dark-active body .mkd-1 { color: rgb(238, 143, 68) !important; }
html.miko-dark-active body .mkd-2 { color: rgb(245, 247, 245) !important; }
/* phd.html: naslov stranice je H1, nivoi ispravljeni */
html body .mkh-12 { font-size: 20px !important; line-height: 24px !important; letter-spacing: -0.2px !important; }
html body .mkh-13 { font-size: 20px !important; line-height: 26px !important; letter-spacing: -0.2px !important; }
html.miko-dark-active body .mkd-3 { color: rgb(245, 247, 245) !important; }
/* About: dugme Pause/Play za pozadinski video */
.tp-video-wrap .mk-video-toggle { position: absolute; right: 20px; bottom: 20px; z-index: 6; width: 44px; height: 44px; padding: 0; border-radius: 50%; border: 1px solid rgba(255,255,255,.6); background: rgba(0,0,0,.5); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .2s; }
.tp-video-wrap .mk-video-toggle:hover { background: rgba(0,0,0,.75); }
/* case-study-mojedelo: 4 naslova sa promenjenim nivoom, ista pravila kao za stare tagove (responsivne vrednosti ostaju) */
.mk-system-intro-main h3 { font-size: var(--md-h2); font-weight: var(--mk-font-weight-medium); line-height: 1; letter-spacing: var(--mk-letter-spacing-heading-lg); margin: 0 0 32px; text-wrap: balance; }
.mk-anatomy-copy h3 { font-size: var(--md-h5); line-height: 1.2; letter-spacing: var(--mk-letter-spacing-heading); margin: 0 0 18px; text-wrap: balance; }
.mk-type-sample h4 { margin: 0 0 26px; font-size: var(--md-h5); line-height: 1.2; letter-spacing: var(--mk-letter-spacing-heading); text-wrap: balance; }
.mk-type-sample--roboto h4 { font-family: 'Roboto', Arial, sans-serif; }
.mk-type-sample--noto h4 { font-family: 'Noto Sans', Arial, sans-serif; }
html.miko-dark-active :is(.mk-system-intro-main h3, .mk-anatomy-copy h3, .mk-type-sample h4) { color: var(--mk-color-text-strong); }
@media (max-width: 767px) { .mk-system-intro-main h3 { margin-bottom: 22px; } }