/* CodeArt blog (child theme): /blog/, category + search archives, single post. Everything is scoped to body.kt-blog. */
body.kt-blog { background-color: #0E0F11 !important; color: #fff; }
html:has(body.kt-blog) { background-color: #0E0F11; }
/* .kt-container (width + side padding = header width): assets/kt-container.css */
.kt-blog .kt-hl { color: #FF5722; }
.kt-blog .kt-dot { display: inline-block; width: 8px; height: 8px; margin-right: 10px; border-radius: 50%; background: #FF5722; vertical-align: middle; position: relative; top: -1px; }
.kt-blog .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- header menu: current item (Blog) orange + underline ---------- */
body.kt-blog .tp-header-menu li.kt-current > a, body.kt-blog .tp-header-menu li.kt-current > a span { color: #FF5722 !important; }
body.kt-blog .tp-header-menu li.kt-current > a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }

/* ---------- list: hero ---------- */
.kt-list .kt-hero { position: relative; padding: 168px 0 0; overflow: hidden; }
.kt-list .kt-hero .kt-container { position: relative; }
.kt-list .kt-hero__in { position: relative; z-index: 1; max-width: 760px; }
.kt-list .svc-label p { margin: 0; }
.kt-list .kt-h1 { margin: 22px 0 0; font-family: inherit; font-size: 64px; line-height: 1.05; font-weight: 800; letter-spacing: -0.035em; color: #fff; text-transform: none; }
.kt-list .kt-lead { max-width: 620px; margin: 22px 0 0; font-size: 17px; line-height: 1.65; color: rgba(255,255,255,0.7); }
.kt-hero__decor { position: absolute; z-index: 0; right: var(--kt-side); top: -30px; width: 420px; height: 360px; pointer-events: none; }
.kt-hero__shape { position: absolute; right: 30px; top: 20px; width: 300px; height: 300px; border-radius: 56px; transform: rotate(14deg); background: linear-gradient(135deg, #FF5722 0%, rgba(255,87,34,0.18) 100%); opacity: 0.9; }
.kt-hero__mark { position: absolute; right: 230px; top: 130px; display: block; filter: drop-shadow(0 8px 24px rgba(0,0,0,0.35)); }

/* ---------- search field (single post sidebar) ---------- */
.kt-search { position: relative; width: 100%; margin: 0; }
.kt-search input[type="search"] { display: block; width: 100%; height: 46px; margin: 0; padding: 0 46px 0 16px; border: 1px solid rgba(255,255,255,0.1); border-radius: 10px; background: rgba(255,255,255,0.04); box-shadow: none; color: #fff; font-family: inherit; font-size: 15px; outline: none; transition: border-color 0.2s ease; -webkit-appearance: none; appearance: none; }
.kt-search input[type="search"]::placeholder { color: rgba(255,255,255,0.5); opacity: 1; }
.kt-search input[type="search"]:focus { border-color: #FF5722; }
.kt-search button { position: absolute; right: 4px; top: 4px; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: rgba(255,255,255,0.7); font-size: 15px; cursor: pointer; transition: color 0.2s ease; }
.kt-search button:hover { color: #FF5722; }

/* ---------- cards (list, featured, related) ---------- */
.kt-posts { padding: 64px 0 100px; }
.kt-featured { margin: 0 0 24px; }
.kt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.kt-card { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; overflow: hidden; background: #070707; border: 1px solid rgba(255,255,255,0.08); border-radius: 16px; color: #fff; text-decoration: none; transition: border-color 0.3s ease; }
.kt-card:hover, .kt-card:focus-visible { border-color: #FF5722; color: #fff; outline: none; }
/* card image frame = the ratio of the cover images (1672 x 941), so nothing is cropped; cover + center only matters for other ratios */
.kt-card__media { position: relative; display: block; width: 100%; aspect-ratio: 1672 / 941; overflow: hidden; background: #111214; }
.kt-img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; transform: scale(1); transition: transform 0.3s ease; }
.kt-card:hover .kt-img, .kt-card:focus-visible .kt-img { transform: scale(1.04); }
.kt-img--ph { display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #17181c, #0b0b0d); }
.kt-card__body { display: flex; flex: 1 1 auto; flex-direction: column; padding: 24px; }
.kt-card__meta { display: flex; align-items: center; gap: 14px; font-size: 13px; line-height: 1.4; color: rgba(255,255,255,0.5); }
.kt-card__cat { font-size: 12px; font-weight: 500; letter-spacing: 1.2px; text-transform: uppercase; color: #FF5722; }
.kt-card__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; min-height: 2.6em; margin: 14px 0 0; padding: 0; font-family: inherit; font-size: 22px; line-height: 1.3; font-weight: 700; letter-spacing: -0.01em; color: #fff; text-transform: none; }
.kt-card__excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; margin: 12px 0 0; font-size: 15px; line-height: 1.55; color: rgba(255,255,255,0.65); }
.kt-card__more { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 20px; font-size: 15px; font-weight: 600; color: #FF5722; }
.kt-card__more svg { transition: transform 0.2s ease; }
.kt-card:hover .kt-card__more svg { transform: translateX(4px); }
/* featured: full width, image left ~55%, text right */
.kt-card--featured { flex-direction: row; }
.kt-card--featured .kt-card__media { flex: 0 0 55%; align-self: flex-start; aspect-ratio: 1672 / 941; }
.kt-card--featured .kt-card__body { justify-content: center; padding: 40px; }
.kt-card--featured .kt-card__title { -webkit-line-clamp: 3; line-clamp: 3; min-height: 0; margin-top: 18px; font-size: 32px; line-height: 1.2; letter-spacing: -0.02em; }
.kt-card--featured .kt-card__excerpt { -webkit-line-clamp: 3; line-clamp: 3; margin-top: 16px; }
.kt-card--featured .kt-card__more { margin-top: 28px; padding-top: 0; }
.kt-empty { margin: 40px 0; text-align: center; color: rgba(255,255,255,0.6); font-size: 17px; }

/* ---------- pagination ---------- */
.kt-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 48px; }
.kt-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,0.12); border-radius: 50%; color: #fff; font-size: 15px; line-height: 1; text-decoration: none; transition: border-color 0.2s ease, background-color 0.2s ease; }
.kt-pagination a.page-numbers:hover { border-color: #FF5722; color: #fff; }
.kt-pagination .page-numbers.current { background: #FF5722; border-color: #FF5722; color: #fff; }
.kt-pagination .page-numbers.dots { border-color: transparent; }

/* ---------- single post ---------- */
.kt-single { padding: 168px 0 100px; }
.kt-single__grid { display: grid; grid-template-columns: minmax(0, 68fr) minmax(0, 32fr); align-items: stretch; }
.kt-article { min-width: 0; padding-right: 48px; }
.kt-side { display: flex; flex-direction: column; gap: 24px; min-width: 0; padding-left: 40px; border-left: 1px solid rgba(255,255,255,0.06); }
.kt-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; margin: 0 0 28px; padding: 0; list-style: none; font-size: 13px; line-height: 1.5; color: rgba(255,255,255,0.5); }
.kt-crumbs li { display: inline-flex; align-items: center; margin: 0; padding: 0; }
.kt-crumbs a { color: rgba(255,255,255,0.5); text-decoration: none; transition: color 0.2s ease; }
.kt-crumbs a:hover { color: #FF5722; }
.kt-crumbs__sep { margin: 0 10px; }
.kt-crumbs [aria-current] { color: #fff; }
.kt-article__cat { margin: 0 0 18px; font-size: 13px; font-weight: 500; letter-spacing: 3px; text-transform: uppercase; color: #FF5722; }
.kt-article__title { margin: 0; font-family: inherit; font-size: 56px; line-height: 1.05; font-weight: 800; letter-spacing: -0.035em; color: #fff; text-transform: none; }
.kt-article__sub { margin: 24px 0 0; font-size: 20px; line-height: 1.55; color: rgba(255,255,255,0.75); }
.kt-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; margin: 30px 0 32px; }
.kt-meta__info { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 26px; }
.kt-meta__info span { display: inline-flex; align-items: center; gap: 9px; font-size: 14px; line-height: 1.4; color: rgba(255,255,255,0.6); }
.kt-meta__info i { font-size: 15px; color: rgba(255,255,255,0.6); }
.kt-share { position: relative; display: flex; gap: 10px; }
.kt-share__btn { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 42px; height: 42px; padding: 0; border: 1px solid rgba(255,255,255,0.15); border-radius: 50%; background: transparent; color: #fff; font-size: 15px; line-height: 1; text-decoration: none; cursor: pointer; transition: background-color 0.2s ease, border-color 0.2s ease; }
.kt-share__btn:hover, .kt-share__btn:focus-visible { background: #FF5722; border-color: #FF5722; color: #fff; outline: none; }
.kt-toast { position: absolute; right: 0; bottom: calc(100% + 10px); padding: 6px 12px; border-radius: 8px; background: #FF5722; color: #fff; font-size: 13px; line-height: 1.3; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity 0.2s ease; }
.kt-toast.is-on { opacity: 1; }
.kt-article__img { margin: 0 0 40px; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 16px; background: #111214; }
.kt-article__img img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
/* post content */
.kt-post-content { max-width: 760px; font-size: 17px; line-height: 1.75; color: #fff; }
.kt-post-content > :first-child { margin-top: 0; }
/* the parent theme colours every <p> directly (p { color: var(--tp-text-body) } = #2e2d2d), which beats the colour inherited from the container, so the text colour is set on the elements themselves */
.kt-post-content p { margin: 0 0 1.4em; color: #fff; }
.kt-post-content strong, .kt-post-content b { font-weight: 600; color: #fff; }
.kt-post-content h2 { position: relative; margin: 2em 0 0.8em; padding-left: 18px; font-family: inherit; font-size: 24px; line-height: 1.3; font-weight: 700; color: #fff; text-transform: none; letter-spacing: 0; }
.kt-post-content h2::before { content: ""; position: absolute; left: 0; top: 0.12em; bottom: 0.12em; width: 4px; border-radius: 2px; background: #FF5722; }
.kt-post-content h3 { margin: 1.8em 0 0.6em; font-family: inherit; font-size: 20px; line-height: 1.35; font-weight: 700; color: #fff; text-transform: none; letter-spacing: 0; }
.kt-post-content ul, .kt-post-content ol { margin: 0 0 1.4em; padding: 0; list-style: none; }
.kt-post-content ol { counter-reset: kt-ol; }
.kt-post-content li { position: relative; margin: 0 0 0.6em; padding-left: 26px; color: #fff; }
.kt-post-content ul > li::before { content: ""; position: absolute; left: 0; top: 0.72em; width: 6px; height: 6px; border-radius: 50%; background: #FF5722; }
.kt-post-content ol > li { counter-increment: kt-ol; }
.kt-post-content ol > li::before { content: counter(kt-ol) "."; position: absolute; left: 0; top: 0; font-weight: 700; color: #FF5722; }
.kt-post-content a { color: #FF5722; text-decoration: underline; text-underline-offset: 3px; }
.kt-post-content a:hover { color: #FF7A4D; }
.kt-post-content blockquote { margin: 1.8em 0; padding: 4px 0 4px 24px; border: 0; border-left: 4px solid #FF5722; background: none; font-size: 19px; font-style: italic; color: #fff; }
.kt-post-content blockquote p:last-child { margin-bottom: 0; }
.kt-post-content img { display: block; max-width: 100%; height: auto; border-radius: 16px; }
.kt-post-content figure { margin: 2em 0; }
.kt-post-content figcaption { margin-top: 12px; font-size: 14px; line-height: 1.5; text-align: center; color: rgba(255,255,255,0.7); }
/* small print under the article (e.g. "Napomena: ...") */
.kt-post-content .kt-note { margin: 2.4em 0 0; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.08); font-size: 14px; line-height: 1.6; color: rgba(255,255,255,0.7); }
/* callout box and 3-card steps inside posts (.kt-callout, .kt-steps > .kt-step) */
.kt-post-content .kt-callout { margin: 1.8em 0; padding: 20px 24px; border-left: 4px solid #FF5722; border-radius: 12px; background: rgba(255,87,34,0.08); }
.kt-post-content .kt-callout p { margin: 0; color: #fff; }
.kt-post-content .kt-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 1.8em 0; }
.kt-post-content .kt-step { box-sizing: border-box; padding: 22px; border: 1px solid rgba(255,255,255,0.08); border-radius: 16px; background: #070707; }
.kt-post-content .kt-step__n { display: block; margin: 0 0 12px; font-size: 12px; line-height: 1.4; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #FF5722; }
.kt-post-content .kt-step h3 { margin: 0 0 8px; font-size: 18px; line-height: 1.35; color: #fff; }
.kt-post-content .kt-step p { margin: 0; font-size: 15px; line-height: 1.6; color: rgba(255,255,255,0.7); }
@media (max-width: 767px) { .kt-post-content .kt-steps { grid-template-columns: minmax(0, 1fr); } }
/* 4-card variant (.kt-steps--4): 4 columns on desktop (a bit wider than the text column from 1400px), 2 up to 1199px, 1 up to 767px */
.kt-post-content .kt-steps--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.kt-post-content .kt-steps--4 .kt-step { padding: 18px; }
.kt-post-content .kt-steps--4 .kt-step p { font-size: 14px; }
@media (min-width: 1400px) { .kt-post-content .kt-steps--4 { width: calc(100% + 80px); } }
@media (max-width: 1199px) { .kt-post-content .kt-steps--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .kt-post-content .kt-steps--4 { grid-template-columns: minmax(0, 1fr); } .kt-post-content .kt-steps--4 .kt-step { padding: 22px; } }
.kt-post-content pre { margin: 1.6em 0; padding: 20px; overflow: auto; border-radius: 10px; background: #070707; color: rgba(255,255,255,0.85); font-size: 14px; line-height: 1.6; }
.kt-post-content code { font-size: 0.92em; }
.kt-post-content :not(pre) > code { padding: 2px 6px; border-radius: 6px; background: #070707; }
/* sidebar */
.kt-box { box-sizing: border-box; padding: 24px; background: #0E0F10; border: 1px solid rgba(255,255,255,0.06); border-radius: 16px; }
.kt-box--search { padding: 16px; }
.kt-box__title { display: flex; align-items: center; margin: 0 0 18px; font-family: inherit; font-size: 18px; line-height: 1.3; font-weight: 700; color: #fff; text-transform: none; letter-spacing: 0; }
.kt-catlist, .kt-recent { margin: 0; padding: 0; list-style: none; }
.kt-catlist li { margin: 0 0 4px; padding: 0; border-left: 3px solid transparent; border-radius: 4px 8px 8px 4px; }
.kt-catlist li.is-active { border-left-color: #FF5722; background: rgba(255,255,255,0.05); }
.kt-catlist a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px; color: rgba(255,255,255,0.8); font-size: 15px; line-height: 1.4; text-decoration: none; transition: color 0.2s ease; }
.kt-catlist a:hover, .kt-catlist li.is-active a { color: #fff; }
.kt-catlist em { font-style: normal; font-size: 13px; color: rgba(255,255,255,0.45); }
.kt-recent li { margin: 0 0 16px; padding: 0; }
.kt-recent li:last-child { margin-bottom: 0; }
.kt-recent a { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.kt-recent__img { flex: none; display: block; width: 84px; aspect-ratio: 1672 / 941; overflow: hidden; border-radius: 8px; background: #111214; }
.kt-recent__img img, .kt-recent__img .kt-img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.kt-recent__tx { display: block; min-width: 0; }
.kt-recent__tx strong { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; font-size: 15px; line-height: 1.4; font-weight: 600; color: #fff; transition: color 0.2s ease; }
.kt-recent a:hover strong { color: #FF5722; }
.kt-recent__tx time { display: block; margin-top: 4px; font-size: 13px; color: rgba(255,255,255,0.5); }
.kt-cta { position: sticky; top: 100px; overflow: hidden; background: #070707; background-image: radial-gradient(circle at 100% 0, rgba(255,87,34,0.32) 0, rgba(255,87,34,0) 62%); }
.kt-cta::after { content: ""; position: absolute; right: -90px; top: -90px; width: 220px; height: 220px; border-radius: 50%; border: 1.5px solid rgba(255,87,34,0.28); pointer-events: none; }
.kt-cta > * { position: relative; z-index: 1; }
.kt-cta__label { display: block; font-size: 12px; font-weight: 600; letter-spacing: 3px; color: #FF5722; }
.kt-cta__title { margin: 14px 0 0; font-family: inherit; font-size: 28px; line-height: 1.15; font-weight: 800; letter-spacing: -0.02em; color: #fff; text-transform: none; }
.kt-cta__text { margin: 14px 0 0; font-size: 15px; line-height: 1.6; color: rgba(255,255,255,0.7); }
.kt-cta__btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; margin-top: 22px; height: 50px; padding: 0 26px; border-radius: 999px; background: #FF5722; color: #fff; font-size: 15px; font-weight: 700; text-decoration: none; transition: background-color 0.2s ease; }
.kt-cta__btn:hover { background: #E64A19; color: #fff; }
.kt-cta__btn svg { transition: transform 0.2s ease; }
.kt-cta__btn:hover svg { transform: translateX(4px); }
/* related */
.kt-related { margin-top: 96px; }
.kt-related__title { display: flex; align-items: center; margin: 0 0 32px; font-family: inherit; font-size: 28px; line-height: 1.2; font-weight: 700; color: #fff; text-transform: none; letter-spacing: -0.01em; }

/* ---------- responsive ---------- */
@media (max-width: 1199px) {
	.kt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kt-card--featured .kt-card__body { padding: 28px; }
	.kt-card--featured .kt-card__title { font-size: 28px; }
}
@media (max-width: 1024px) {
	.kt-list .kt-h1 { font-size: 46px; }
	.kt-card--featured { flex-direction: column; }
	.kt-card--featured .kt-card__media { flex: none; width: 100%; }
	.kt-single__grid { grid-template-columns: minmax(0, 1fr); }
	.kt-article { padding-right: 0; }
	.kt-side { margin-top: 56px; padding-left: 0; border-left: 0; }
	.kt-cta { position: relative; top: auto; } /* not sticky below 1025px; relative (not static) so the decorative circle stays clipped by overflow:hidden */
	.kt-article__title { font-size: 42px; }
}
@media (max-width: 767px) {
	.kt-hero__decor { display: none; }
	.kt-list .kt-h1 { font-size: 34px; }
	.kt-list .kt-lead { font-size: 16px; }
	.kt-grid { grid-template-columns: minmax(0, 1fr); }
	.kt-posts { padding: 48px 0 70px; }
	.kt-card--featured .kt-card__body { padding: 24px; }
	.kt-card--featured .kt-card__title { font-size: 24px; }
	.kt-single { padding-bottom: 70px; }
	.kt-article__title { font-size: 32px; }
	.kt-article__sub { font-size: 18px; }
	.kt-meta { flex-direction: column; align-items: flex-start; }
	.kt-post-content { font-size: 16px; }
	.kt-post-content h2 { font-size: 22px; }
	.kt-related { margin-top: 64px; }
}

/* legal pages (inc/kt-legal.php): "last changed" line under the H1 */
.kt-legal .kt-legal__date { margin: 18px 0 0; font-size: 14px; line-height: 1.5; color: rgba(255,255,255,0.6); }