/* Mladi bez ovisnosti – odvažan, mladenački stil: debeli obrubi, tvrde sjene, jake boje. */
:root {
	--ink: var(--wp--preset--color--contrast, #16123A);
	--paper: var(--wp--preset--color--base, #FBFAF6);
	--violet: var(--wp--preset--color--ljubicasta, #5B3BEA);
	--lime: var(--wp--preset--color--limeta, #D7F75B);
	--coral: var(--wp--preset--color--koralj, #FF6B57);
	--sky: var(--wp--preset--color--nebo, #8ED6FF);
	--lila: var(--wp--preset--color--lila, #ECE7FF);
	--muted: var(--wp--preset--color--siva, #5E5A7A);
	--line: 2.5px solid var(--ink);
	--radius: 22px;
	--shadow: 6px 6px 0 var(--ink);
	--shadow-sm: 4px 4px 0 var(--ink);
	--gutter: clamp(1rem, 4vw, 2.5rem);
}

body { -webkit-font-smoothing: antialiased; }
::selection { background: var(--lime); color: var(--ink); }
:where(a, button, input, summary):focus-visible { outline: 3px solid var(--violet); outline-offset: 3px; border-radius: 6px; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block-start: 0; }
.mbo-main { padding-inline: var(--gutter); padding-bottom: 5rem; }
.mbo-main--front { padding-bottom: 0; padding-inline: 0; }
.mbo-main--front > .wp-block-post-content > .alignfull { margin-inline: 0 !important; }
.mbo-main > .wp-block-post-content > *:first-child { margin-top: 0; }
mark { background: var(--lime); color: var(--ink); padding: 0 .15em; border-radius: 6px; }
.has-contrast-background-color mark, .mbo-dark mark { color: var(--ink); }
img { border-radius: inherit; }
h1, h2, h3, h4 { text-wrap: balance; }
p { text-wrap: pretty; }

/* ------- Top bar + header ------- */
.mbo-topbar { background: var(--ink); color: #fff; font-size: .88rem; padding: .45rem var(--gutter); }
.mbo-topbar p { margin: 0; text-align: center; }
.mbo-topbar a { color: var(--lime); font-weight: 700; text-decoration: none; }
.mbo-topbar a:hover { text-decoration: underline; color: #fff; }
.mbo-head-wrap { position: sticky; top: 0; z-index: 50; }
.admin-bar .mbo-head-wrap { top: 32px; }
@media (max-width: 782px) { .admin-bar .mbo-head-wrap { top: 0; } }
.mbo-header { background: color-mix(in srgb, var(--paper) 92%, transparent); backdrop-filter: blur(10px); border-bottom: var(--line); padding: .7rem var(--gutter); }
.mbo-header__in { gap: 1rem; }
.mbo-brand { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--ink); flex-shrink: 0; }
.mbo-brand__znak { width: 44px; height: 44px; transition: transform .3s; }
.mbo-brand:hover .mbo-brand__znak { transform: rotate(-12deg) scale(1.05); }
.mbo-brand__txt { display: flex; flex-direction: column; font-family: var(--wp--preset--font-family--naslov); font-weight: 800; line-height: .95; font-size: 1.15rem; letter-spacing: -.02em; }
.mbo-brand__txt span:last-child { color: var(--violet); }
.mbo-nav { font-weight: 600; font-size: .98rem; }
.mbo-nav .wp-block-navigation__container { gap: .15rem; }
.mbo-nav .wp-block-navigation-item__content { padding: .45rem .7rem !important; border-radius: 999px; text-decoration: none; transition: background .15s; }
.mbo-nav .wp-block-navigation-item__content:hover { background: var(--lila); color: var(--ink); }
.mbo-nav .current-menu-item > .wp-block-navigation-item__content,
.mbo-nav .wp-block-navigation-item__content[aria-current] { background: var(--lime); }
.mbo-nav .mbo-nav__pomoc > a { background: var(--coral); border: var(--line); box-shadow: 3px 3px 0 var(--ink); margin-left: .35rem; }
.mbo-nav .mbo-nav__pomoc > a:hover { background: var(--coral); transform: translate(-1px, -1px); box-shadow: 4px 4px 0 var(--ink); }
.mbo-nav .wp-block-navigation__responsive-container-open { border: var(--line); border-radius: 12px; padding: .45rem; background: var(--lime); }
.mbo-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--ink) !important; color: #fff !important; padding: 2rem var(--gutter); }
.mbo-nav .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 3rem; }
.mbo-nav .is-menu-open .wp-block-navigation__container { gap: .6rem !important; }
.mbo-nav .is-menu-open .wp-block-navigation-item__content { font-family: var(--wp--preset--font-family--naslov); font-size: 1.8rem; font-weight: 800; color: #fff; padding: .2rem 0 !important; }
.mbo-nav .is-menu-open .wp-block-navigation-item__content:hover { background: none; color: var(--lime); }
.mbo-nav .is-menu-open .mbo-nav__pomoc > a { color: var(--ink); padding: .3rem 1rem !important; margin: .8rem 0 0; }
@media (min-width: 600px) and (max-width: 1180px) {
	.mbo-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.mbo-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}

/* ------- Page head band ------- */
.mbo-pagehead { background: var(--lila); border-bottom: var(--line); padding: clamp(2.5rem, 6vw, 5rem) var(--gutter) clamp(2rem, 5vw, 3.5rem); margin-bottom: clamp(2rem, 5vw, 3.5rem); position: relative; overflow: hidden; }
.mbo-pagehead::after { content: ""; position: absolute; right: -60px; top: -60px; width: 260px; height: 260px; border-radius: 50%; border: 28px solid var(--lime); opacity: .9; pointer-events: none; }
.mbo-pagehead > * { position: relative; z-index: 1; }
.mbo-pagehead h1 { margin: 0; max-width: 16ch; }
.mbo-pagehead .mbo-lead, .mbo-lead { font-size: clamp(1.15rem, 2vw, 1.4rem); line-height: 1.5; max-width: 44rem; color: var(--ink); margin-top: 1rem; }
.mbo-pagehead .wp-block-post-excerpt__more-text { display: none; }
.mbo-pagehead--post { background: var(--paper); margin-bottom: 2rem; }
.mbo-pagehead--post h1 { max-width: 22ch; font-size: clamp(2.2rem, 5vw, 3.6rem); }
.mbo-pagehead--post::after { border-color: var(--sky); }
.mbo-za-roditelji .mbo-pagehead--post::after { border-color: var(--coral); }
.mbo-za-mladi .mbo-pagehead--post::after { border-color: var(--lime); }
.mbo-meta { color: var(--muted); font-size: .95rem; gap: .4rem 1.2rem; margin-top: 1rem; }
.mbo-meta p { margin: 0; }
.mbo-meta > * + *::before { content: "•"; margin-right: 1.2rem; color: var(--coral); }
.mbo-article__img img { border: var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.mbo-404 h1 { max-width: 20ch; }

/* ------- Chips ------- */
.mbo-chips { display: flex; flex-wrap: wrap; gap: .4rem; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.mbo-chips a { text-decoration: none; color: var(--ink); background: var(--lila); border: 2px solid var(--ink); padding: .15rem .65rem; border-radius: 999px; }
.mbo-chips .wp-block-post-terms__separator { display: none; }
.mbo-chips a[href*="/mladi/"] { background: var(--lime); }
.mbo-chips a[href*="/roditelji/"] { background: var(--coral); }
.mbo-chips a[href*="/nastavnici/"] { background: var(--sky); }

/* ------- Content typography ------- */
.mbo-content > h2 { margin-top: 2.6rem; font-size: clamp(1.6rem, 3vw, 2.1rem); }
.mbo-content > h3 { margin-top: 2rem; }
.mbo-content > p:first-child { font-size: 1.25rem; line-height: 1.55; }
.mbo-content ul:not([class*="mbo-"]) li, .mbo-content ol:not([class*="mbo-"]) li { margin-bottom: .45rem; }
.mbo-content ul:not([class*="mbo-"]) li::marker { color: var(--violet); }
.mbo-content blockquote, .wp-block-quote { border: none; border-left: 8px solid var(--lime); padding: .3rem 0 .3rem 1.4rem; margin-left: 0; font-family: var(--wp--preset--font-family--naslov); font-size: 1.45rem; font-weight: 600; line-height: 1.35; }
.wp-block-quote cite { display: block; margin-top: .5rem; font-family: var(--wp--preset--font-family--tekst); font-size: .95rem; font-weight: 500; color: var(--muted); }
.wp-block-separator { border: none; border-top: var(--line); opacity: 1; }

/* ------- Boxes ------- */
.mbo-box, .mbo-helpbox, .mbo-callout {
	background: #fff; border: var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
	padding: clamp(1.25rem, 3vw, 2rem);
}
.mbo-box > :first-child, .mbo-helpbox > :first-child, .mbo-callout > :first-child { margin-top: 0; }
.mbo-box > :last-child, .mbo-helpbox > :last-child, .mbo-callout > :last-child { margin-bottom: 0; }
.mbo-box--lime { background: var(--lime); }
.mbo-box--koralj { background: var(--coral); }
.mbo-box--nebo { background: var(--sky); }
.mbo-box--lila { background: var(--lila); }
.mbo-box--tinta { background: var(--ink); color: #fff; }
.mbo-box--tinta a { color: var(--lime); }
.mbo-box h3 { margin-top: 0; }
.mbo-helpbox { background: var(--lime); margin-top: 3rem; }
.mbo-callout { background: var(--lila); border-style: dashed; box-shadow: none; }
.mbo-callout::before { content: "Važno"; display: inline-block; font-family: var(--wp--preset--font-family--naslov); font-weight: 800; background: var(--ink); color: var(--lime); border-radius: 999px; padding: .1rem .7rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; margin-bottom: .6rem; }
.mbo-callout--savjet::before { content: "Savjet"; }
.mbo-callout--mit::before { content: "Mit ili činjenica?"; }

.wp-block-columns.mbo-boxes { gap: 1.5rem; }
.wp-block-columns.mbo-boxes > .wp-block-column { display: flex; }
.wp-block-columns.mbo-boxes > .wp-block-column > .mbo-box { flex: 1; }

/* Numerirani koraci */
ol.mbo-steps { list-style: none; counter-reset: k; padding: 0; display: grid; gap: 1rem; }
ol.mbo-steps > li { counter-increment: k; position: relative; padding: 1.1rem 1.25rem 1.1rem 4.6rem; background: #fff; border: var(--line); border-radius: 18px; min-height: 3.5rem; }
ol.mbo-steps > li::before { content: counter(k); position: absolute; left: 1rem; top: 1rem; width: 2.5rem; height: 2.5rem; display: grid; place-items: center; background: var(--lime); border: var(--line); border-radius: 50%; font-family: var(--wp--preset--font-family--naslov); font-weight: 800; font-size: 1.15rem; }
ol.mbo-steps > li:nth-child(3n+2)::before { background: var(--coral); }
ol.mbo-steps > li:nth-child(3n)::before { background: var(--sky); }

/* Kvačice */
ul.mbo-checks { list-style: none; padding: 0; display: grid; gap: .65rem; }
ul.mbo-checks > li { position: relative; padding-left: 2.2rem; }
ul.mbo-checks > li::before { content: ""; position: absolute; left: 0; top: .2rem; width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%2316123A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/70% no-repeat; border: 2px solid var(--ink); }
ul.mbo-crosses { list-style: none; padding: 0; display: grid; gap: .65rem; }
ul.mbo-crosses > li { position: relative; padding-left: 2.2rem; }
ul.mbo-crosses > li::before { content: ""; position: absolute; left: 0; top: .2rem; width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--coral) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M17 7 7 17' fill='none' stroke='%2316123A' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center/62% no-repeat; border: 2px solid var(--ink); }

/* ------- Buttons ------- */
.wp-block-button__link { border: var(--line) !important; box-shadow: var(--shadow-sm); transition: transform .12s, box-shadow .12s; }
.wp-block-button__link:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--ink); }
.wp-block-button__link:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--ink); }
.wp-block-button.is-style-outline > .wp-block-button__link { background: #fff; color: var(--ink); }
.wp-block-button.mbo-btn-lime > .wp-block-button__link { background: var(--lime); color: var(--ink); }
.wp-block-button.mbo-btn-koralj > .wp-block-button__link { background: var(--coral); color: var(--ink); }
.wp-block-button.mbo-btn-nebo > .wp-block-button__link { background: var(--sky); color: var(--ink); }

/* ------- Cards (query) ------- */
.mbo-cards { gap: 1.6rem !important; }
.mbo-card { height: 100%; background: #fff; border: var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; transition: transform .15s, box-shadow .15s; }
.mbo-card:hover { transform: translate(-3px, -3px); box-shadow: var(--shadow); }
.mbo-card .wp-block-post-featured-image { margin: 0; border-bottom: var(--line); }
.mbo-card .wp-block-post-featured-image img { border-radius: 0; transition: transform .4s; }
.mbo-card:hover .wp-block-post-featured-image img { transform: scale(1.04); }
.mbo-card__body { padding: 1.2rem 1.3rem 1.4rem; display: flex; flex-direction: column; gap: .6rem; }
.mbo-card__body > * { margin: 0 !important; }
.mbo-card h3 { font-size: 1.35rem; line-height: 1.15; }
.mbo-card h3 a { text-decoration: none; color: var(--ink); }
.mbo-card h3 a:hover { color: var(--violet); }
.mbo-card .wp-block-post-excerpt { color: var(--muted); font-size: 1rem; line-height: 1.5; }
.mbo-card .wp-block-post-excerpt__more-text { display: none; }
@media (max-width: 900px) { .mbo-cards.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 600px) { .mbo-cards.is-layout-grid { grid-template-columns: 1fr !important; } }
.wp-block-query-pagination { margin-top: 3rem; font-weight: 700; gap: .5rem; }
.wp-block-query-pagination a, .wp-block-query-pagination .current { border: var(--line); border-radius: 999px; padding: .3rem .9rem; text-decoration: none; color: var(--ink); background: #fff; }
.wp-block-query-pagination .current { background: var(--lime); }

.mbo-filter { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.6rem; }
.mbo-filter a { border: var(--line); border-radius: 999px; padding: .4rem 1.05rem; background: #fff; color: var(--ink); text-decoration: none; font-weight: 700; box-shadow: 3px 3px 0 var(--ink); }
.mbo-filter a.za-mlade { background: var(--lime); }
.mbo-filter a.za-roditelje { background: var(--coral); }
.mbo-filter a.za-nastavnike { background: var(--sky); }
.mbo-filter a:hover { transform: translate(-1px, -1px); box-shadow: 4px 4px 0 var(--ink); }

.mbo-more { margin-top: 5rem !important; }
.mbo-more h2 { margin-bottom: 1.5rem; }

/* ------- Search ------- */
.wp-block-search__inside-wrapper { border: var(--line) !important; border-radius: 999px; background: #fff; padding: 4px; max-width: 34rem; }
.wp-block-search__input { border: none !important; background: none; padding: .5rem 1rem; font-size: 1.05rem; }
.wp-block-search__button { border-radius: 999px !important; background: var(--ink) !important; color: #fff !important; border: none !important; font-weight: 700; }

/* =========================================================
   Početna
   ========================================================= */
.mbo-hero { background: var(--ink); color: #fff; padding: clamp(3rem, 9vw, 7.5rem) var(--gutter) clamp(3.5rem, 9vw, 7rem); position: relative; overflow: hidden; margin-top: 0 !important; }
.mbo-hero::before, .mbo-hero::after { content: ""; position: absolute; pointer-events: none; }
.mbo-hero::before { right: -8vw; top: 50%; width: min(56vw, 640px); aspect-ratio: 1; transform: translateY(-50%); background: url(../img/hero.svg) center/contain no-repeat; }
.mbo-hero > * { position: relative; z-index: 1; }
.mbo-hero .mbo-kicker { color: var(--lime); }
.mbo-hero h1 { font-size: clamp(3rem, 9.5vw, 7.4rem); line-height: .92; letter-spacing: -.045em; max-width: 9.5ch; margin: .6rem 0 1.4rem; color: #fff; }
.mbo-hero h1 mark { background: none; color: var(--lime); padding: 0; position: relative; white-space: nowrap; }
.mbo-hero h1 mark::after { content: ""; position: absolute; left: 0; right: 0; bottom: .02em; height: .14em; background: var(--coral); border-radius: 99px; transform: rotate(-1.5deg); z-index: -1; }
.mbo-hero .mbo-hero__lead { font-size: clamp(1.1rem, 2vw, 1.4rem); max-width: 34rem; color: #E7E4FF; line-height: 1.55; }
.mbo-hero .wp-block-buttons { margin-top: 2rem; gap: .8rem; }
.mbo-hero .wp-block-button__link { box-shadow: 4px 4px 0 #000; border-color: #000 !important; }
@media (max-width: 860px) { .mbo-hero::before { opacity: .25; right: -30vw; width: 90vw; } }

.mbo-kicker { font-family: var(--wp--preset--font-family--naslov); font-weight: 700; text-transform: uppercase; letter-spacing: .14em; font-size: .85rem; color: var(--violet); margin-bottom: .2rem !important; }

/* Ticker */
.mbo-ticker { background: var(--lime); border-block: var(--line); overflow: hidden; white-space: nowrap; margin-top: 0 !important; }
.mbo-ticker__track { display: inline-flex; animation: mbo-ticker 42s linear infinite; padding: .85rem 0; }
.mbo-ticker__track span { font-family: var(--wp--preset--font-family--naslov); font-weight: 800; font-size: clamp(1.1rem, 2vw, 1.45rem); letter-spacing: -.01em; padding-inline: 1.4rem; display: inline-flex; align-items: center; gap: 2.8rem; }
.mbo-ticker__track span::after { content: "✺"; color: var(--violet); }
@keyframes mbo-ticker { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .mbo-ticker__track { animation: none; } }

/* Sekcije */
.mbo-section { padding: clamp(3.5rem, 8vw, 6.5rem) var(--gutter); margin-top: 0 !important; }
.mbo-section > .wp-block-heading:first-of-type, .mbo-section__title { max-width: 18ch; margin-top: 0; }
.mbo-section--lila { background: var(--lila); border-block: var(--line); }
.mbo-section--tinta { background: var(--ink); color: #fff; }
.mbo-section--tinta a:not(.wp-block-button__link) { color: var(--lime); }
.mbo-section--tinta .mbo-kicker { color: var(--lime); }
.mbo-section--koralj { background: var(--coral); border-block: var(--line); }
.mbo-section--lime { background: var(--lime); border-block: var(--line); }
.mbo-section__intro { max-width: 40rem; font-size: 1.2rem; }

/* Tko si ti — kartice publike */
.mbo-who { gap: 1.5rem !important; margin-top: 2.5rem !important; }
.mbo-who > .wp-block-column { border: var(--line); border-radius: 28px; padding: 1.8rem 1.6rem 1.6rem; box-shadow: var(--shadow); display: flex; flex-direction: column; position: relative; overflow: hidden; transition: transform .15s, box-shadow .15s; }
.mbo-who > .wp-block-column:hover { transform: translate(-3px, -3px) rotate(-.4deg); box-shadow: 9px 9px 0 var(--ink); }
.mbo-who > .wp-block-column:nth-child(1) { background: var(--lime); }
.mbo-who > .wp-block-column:nth-child(2) { background: var(--coral); }
.mbo-who > .wp-block-column:nth-child(3) { background: var(--sky); }
.mbo-who h3 { font-size: clamp(1.8rem, 3vw, 2.4rem); margin: 0 0 .6rem; }
.mbo-who .mbo-emoji { font-size: 2.6rem; line-height: 1; margin: 0 0 1rem; }
.mbo-who .wp-block-buttons { margin-top: auto; padding-top: 1rem; }
.mbo-who ul { padding-left: 1.1rem; margin: 0; }

/* Teme */
.mbo-topics { gap: 1.5rem !important; margin-top: 2.5rem !important; }
.mbo-topic { background: #fff; border: var(--line); border-radius: var(--radius); padding: 1.6rem; height: 100%; }
.mbo-topic .mbo-topic__num { font-family: var(--wp--preset--font-family--naslov); font-size: 3.6rem; font-weight: 800; line-height: 1; color: var(--violet); margin: 0 0 .4rem; letter-spacing: -.04em; }
.mbo-topic h3 { margin: 0 0 .6rem; font-size: 1.6rem; }
.mbo-topic p { margin: .5rem 0; }

/* Aktivnosti */
.mbo-acts { list-style: none; counter-reset: a; padding: 0; margin: 2.5rem 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1.2rem; }
.mbo-acts > li { counter-increment: a; border: 2.5px solid #fff; border-radius: var(--radius); padding: 1.4rem; position: relative; }
.mbo-acts > li::before { content: "0" counter(a); display: block; font-family: var(--wp--preset--font-family--naslov); font-size: 2.8rem; font-weight: 800; color: var(--lime); line-height: 1; margin-bottom: .8rem; }
.mbo-acts > li strong { display: block; font-family: var(--wp--preset--font-family--naslov); font-size: 1.25rem; line-height: 1.2; margin-bottom: .4rem; }
.mbo-acts > li { color: #D9D6F2; font-size: 1rem; line-height: 1.5; }
.mbo-acts > li strong { color: #fff; }

/* Standardi */
.mbo-standards { gap: 1.5rem !important; margin-top: 2rem !important; }
.mbo-standards .mbo-box { height: 100%; }

/* Help CTA */
.mbo-cta { display: grid; grid-template-columns: 1.2fr 1fr; gap: 2rem; align-items: center; }
.mbo-cta h2 { font-size: clamp(2.2rem, 5vw, 3.8rem); margin: 0; }
.mbo-cta .mbo-cta__sos { font-family: var(--wp--preset--font-family--naslov); font-weight: 800; font-size: clamp(3.5rem, 9vw, 6.5rem); line-height: .9; letter-spacing: -.04em; margin: 0; }
.mbo-cta .mbo-cta__sos a { color: var(--ink); text-decoration: none; }
@media (max-width: 780px) { .mbo-cta { grid-template-columns: 1fr; } }

/* Audience page hero */
.mbo-audhero { padding: clamp(3rem, 8vw, 6rem) var(--gutter) clamp(2.5rem, 6vw, 4.5rem); border-bottom: var(--line); position: relative; overflow: hidden; margin-top: 0 !important; margin-bottom: 3rem; }
.mbo-audhero--lime { background: var(--lime); }
.mbo-audhero--koralj { background: var(--coral); }
.mbo-audhero--nebo { background: var(--sky); }
.mbo-audhero--lila { background: var(--lila); }
.mbo-audhero h1 { font-size: clamp(2.8rem, 8vw, 6rem); line-height: .95; letter-spacing: -.045em; max-width: 11ch; margin: .5rem 0 1rem; }
.mbo-audhero .mbo-kicker { color: var(--ink); }
.mbo-audhero::after { content: ""; position: absolute; right: -40px; bottom: -80px; width: 320px; height: 320px; border-radius: 50%; background: var(--ink); opacity: .08; pointer-events: none; }
.mbo-audhero::before { content: ""; position: absolute; right: 8%; top: 18%; width: 110px; height: 110px; background: url(../img/zvijezda.svg) center/contain no-repeat; pointer-events: none; animation: mbo-spin 18s linear infinite; }
@keyframes mbo-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .mbo-audhero::before { animation: none; } }
@media (max-width: 700px) { .mbo-audhero::before { width: 64px; height: 64px; top: 8%; right: 6%; } }

/* Emergency box */
.mbo-sos { background: var(--coral); border: var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(1.25rem, 3vw, 2rem); }
.mbo-sos h2 { margin-top: 0 !important; }
.mbo-sos a { color: var(--ink); }
.mbo-sos .mbo-sos__num { font-family: var(--wp--preset--font-family--naslov); font-weight: 800; font-size: 1.6rem; }

/* Print / vodiči */
.mbo-printbar { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; margin-bottom: 2rem; }
.mbo-printbtn { font: 700 1rem var(--wp--preset--font-family--naslov); border: var(--line); border-radius: 999px; padding: .6rem 1.2rem; background: var(--lime); color: var(--ink); box-shadow: var(--shadow-sm); cursor: pointer; }
.mbo-printbtn:hover { transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--ink); }
.mbo-guides { gap: 1.5rem !important; }
.mbo-guides .mbo-box { height: 100%; display: flex; flex-direction: column; }
.mbo-guides .mbo-box .wp-block-buttons { margin-top: auto; padding-top: .8rem; }

/* Kampanja kartice */
.mbo-gallery { gap: 1.2rem !important; }
.mbo-gallery .wp-block-image img { border: var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.mbo-gallery figcaption { text-align: left; font-size: .95rem; color: var(--muted); }
.mbo-hashtag { font-family: var(--wp--preset--font-family--naslov); font-weight: 800; font-size: clamp(2.6rem, 8vw, 5.5rem); letter-spacing: -.04em; line-height: 1; margin: 0; }

/* Footer */
.mbo-footer { background: var(--ink); color: #D9D6F2; padding: clamp(3rem, 7vw, 5rem) var(--gutter) 2rem; border-top: var(--line); }
.mbo-footer h3 { color: #fff; font-size: 1.15rem; margin-bottom: .8rem; }
.mbo-footer a { color: #fff; text-decoration: none; }
.mbo-footer a:hover { color: var(--lime); text-decoration: underline; }
.mbo-footer__big p { font-family: var(--wp--preset--font-family--naslov); font-weight: 800; font-size: clamp(2.8rem, 9vw, 7rem); line-height: .92; letter-spacing: -.045em; color: #fff; margin: 0 0 3rem; }
.mbo-footer__big mark { background: none; color: var(--lime); padding: 0; }
.mbo-footer__cols { gap: 2.5rem; font-size: 1rem; }
.mbo-footer__links { list-style: none; padding: 0; margin: 0; display: grid; gap: .4rem; }
.mbo-footer__sos { font-size: 1.05rem; }
.mbo-footer__sos a { font-family: var(--wp--preset--font-family--naslov); font-weight: 800; font-size: 1.6rem; color: var(--lime); margin-right: .3rem; }
.mbo-footer__note { border-top: 1px solid #3A3566; padding-top: 1.5rem; margin-top: 3rem; font-size: .88rem; color: #A7A3C8; }

/* Tables */
.wp-block-table table { border-collapse: separate; border-spacing: 0; border: var(--line); border-radius: 16px; overflow: hidden; background: #fff; }
.wp-block-table th { background: var(--ink); color: #fff; text-align: left; }
.wp-block-table td, .wp-block-table th { border: none; border-bottom: 1px solid #DDD8F0; padding: .7rem 1rem; }
.wp-block-table tr:last-child td { border-bottom: none; }

/* Details (FAQ) */
.wp-block-details { border: var(--line); border-radius: 16px; background: #fff; padding: 0; margin-block: .8rem; overflow: hidden; }
.wp-block-details summary { cursor: pointer; padding: 1rem 1.25rem; font-family: var(--wp--preset--font-family--naslov); font-weight: 700; font-size: 1.15rem; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; font-size: 1.6rem; line-height: 1; transition: transform .2s; }
.wp-block-details[open] summary { background: var(--lila); border-bottom: 2px solid var(--ink); }
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { padding-inline: 1.25rem; }
.wp-block-details > :last-child { padding-bottom: 1rem; }

/* Reveal on scroll */
@media (prefers-reduced-motion: no-preference) {
	.js .mbo-reveal { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
	.js .mbo-reveal.is-in { opacity: 1; transform: none; }
}

@media print {
	.mbo-topbar, .mbo-head-wrap, .mbo-footer, .mbo-printbar, .mbo-helpbox, .mbo-more { display: none !important; }
	body { background: #fff; font-size: 11pt; }
	.mbo-pagehead { background: none; border: none; padding: 0 0 1rem; margin: 0; }
	.mbo-pagehead::after { display: none; }
	.mbo-box, .mbo-callout, .mbo-sos, ol.mbo-steps > li { box-shadow: none; break-inside: avoid; }
	a { color: inherit; }
	.mbo-main { padding: 0; }
}

/* Uski naslovi/uvodi unutar constrained (1240px) sekcija poravnati su lijevo s rubom sadržaja, a ne centrirani. */
:is(.mbo-hero, .mbo-audhero, .mbo-section, .mbo-pagehead) > :is(h1, h2, .mbo-lead, .mbo-hero__lead, .mbo-section__intro) {
	margin-left: max(0px, calc((100% - 1240px) / 2)) !important;
}
.mbo-pagehead--post > :is(h1, h2, .mbo-lead) { margin-left: max(0px, calc((100% - 980px) / 2)) !important; }
.mbo-section > :is(.mbo-kviz, .mbo-sc) { max-width: 760px !important; }