/* ==========================================================================
   Design tokens (ported from the FM Expert design system)
   ========================================================================== */
:root{
	--navy-950:oklch(0.16 0.035 264);
	--navy-900:oklch(0.19 0.04 264);
	--navy-850:oklch(0.22 0.045 264);
	--navy-800:oklch(0.26 0.045 264);
	--navy-700:oklch(0.33 0.045 264);
	--navy-600:oklch(0.42 0.045 264);
	--navy-500:oklch(0.52 0.04 264);
	--navy-400:oklch(0.64 0.035 264);
	--navy-300:oklch(0.76 0.03 264);
	--navy-200:oklch(0.86 0.02 264);
	--navy-100:oklch(0.93 0.012 264);
	--white:oklch(0.98 0.004 264);
	--rose-700:oklch(0.41 0.19 339);
	--rose-600:oklch(0.50 0.215 339);
	--rose-500:oklch(0.59 0.235 339);
	--rose-400:oklch(0.69 0.19 339);
	--rose-300:oklch(0.80 0.12 339);
	--purple-700:oklch(0.42 0.15 305);
	--purple-600:oklch(0.52 0.18 305);
	--purple-500:oklch(0.60 0.20 305);
	--purple-400:oklch(0.70 0.16 305);
	--purple-300:oklch(0.81 0.10 305);
	--win:oklch(0.68 0.16 148);
	--draw:oklch(0.78 0.14 90);
	--loss:oklch(0.62 0.20 25);

	--surface-app:var(--navy-950);
	--surface-sunken:oklch(0.13 0.03 264);
	--surface-card:var(--navy-900);
	--surface-raised:var(--navy-850);
	--surface-overlay:oklch(0.22 0.045 264 / 0.92);
	--border-subtle:oklch(1 0 0 / 0.08);
	--border-default:oklch(1 0 0 / 0.14);
	--border-strong:oklch(1 0 0 / 0.24);
	--border-accent:var(--rose-500);
	--text-primary:var(--white);
	--text-secondary:var(--navy-200);
	--text-tertiary:var(--navy-400);
	--text-disabled:var(--navy-600);
	--link:var(--rose-300);
	--link-hover:var(--rose-400);
	--focus-ring:var(--purple-400);

	--hero-navy:oklch(0.13 0.025 264);
	--hero-text-primary:var(--white);
	--hero-text-secondary:oklch(1 0 0 / 0.75);
	--hero-text-tertiary:oklch(1 0 0 / 0.6);

	--school-bg:oklch(0.15 0.03 305);
	--school-glow-1:oklch(0.52 0.18 305 / 0.35);
	--school-glow-2:oklch(0.60 0.20 305 / 0.25);

	--font-display:'Barlow Condensed',system-ui,sans-serif;
	--font-body:'Inter',system-ui,sans-serif;
	--font-mono:'JetBrains Mono',ui-monospace,monospace;
	--fs-display-xl:clamp(2.75rem,2rem + 3vw,4.5rem);
	--fs-display-lg:clamp(2.25rem,1.8rem + 2vw,3.25rem);
	--fs-display-md:clamp(1.75rem,1.5rem + 1vw,2.25rem);
	--fs-display-sm:1.5rem;
	--fs-heading-lg:1.375rem;
	--fs-heading-md:1.125rem;
	--fs-body-lg:1.0625rem;
	--fs-body-md:0.9375rem;
	--fs-body-sm:0.8125rem;
	--fs-caption:0.6875rem;
	--lh-tight:1.05;
	--lh-snug:1.2;
	--lh-normal:1.5;
	--lh-relaxed:1.65;
	--ls-display:0.01em;
	--ls-caps:0.08em;
	--fw-regular:400;
	--fw-medium:500;
	--fw-semibold:600;
	--fw-bold:700;
	--fw-display:650;

	--space-1:4px;
	--space-2:8px;
	--space-3:12px;
	--space-4:16px;
	--space-5:20px;
	--space-6:24px;
	--space-8:32px;
	--radius-xs:3px;
	--radius-sm:6px;
	--radius-md:10px;
	--radius-lg:14px;
	--radius-pill:999px;
	--container-max:1200px;

	--shadow-sm:0 1px 2px oklch(0.05 0.02 264 / 0.4);
	--shadow-md:0 4px 12px oklch(0.05 0.02 264 / 0.45),0 1px 2px oklch(0.05 0.02 264 / 0.3);
	--shadow-lg:0 12px 32px oklch(0.05 0.02 264 / 0.5),0 2px 6px oklch(0.05 0.02 264 / 0.35);
	--ease-standard:cubic-bezier(.2,.7,.3,1);
	--duration-base:180ms;
	--duration-slow:280ms;
	--blur-glass:14px;
}

html[data-theme="light"]{
	--surface-app: oklch(0.975 0.005 264);
	--surface-sunken: oklch(0.945 0.008 264);
	--surface-card: oklch(0.995 0.002 264);
	--surface-raised: oklch(0.96 0.006 264);
	--surface-overlay: oklch(0.98 0.004 264 / 0.94);
	--border-subtle: oklch(0.2 0.02 264 / 0.08);
	--border-default: oklch(0.2 0.02 264 / 0.13);
	--border-strong: oklch(0.2 0.02 264 / 0.22);
	--text-primary: oklch(0.19 0.04 264);
	--text-secondary: oklch(0.34 0.045 264);
	--text-tertiary: oklch(0.52 0.04 264);
	--text-disabled: oklch(0.76 0.03 264);
	--rose-300: oklch(0.44 0.19 339);
	--purple-300: oklch(0.45 0.16 305);
	--link: var(--rose-600);
	--link-hover: var(--rose-700);
	--hero-navy: oklch(0.975 0.005 264);
	--hero-text-primary: var(--text-primary);
	--hero-text-secondary: var(--text-secondary);
	--hero-text-tertiary: var(--text-tertiary);

	--school-bg: oklch(0.94 0.02 305);
	--school-glow-1: oklch(0.60 0.20 305 / 0.16);
	--school-glow-2: oklch(0.52 0.18 305 / 0.13);
}

/* ==========================================================================
   Base
   ========================================================================== */
html{ background:var(--surface-app); color-scheme:dark; }
html[data-theme="light"]{ color-scheme:light; }
body{
	margin:0;
	background:var(--surface-app);
	color:var(--text-primary);
	font-family:var(--font-body);
	font-size:var(--fs-body-md);
	line-height:var(--lh-normal);
	-webkit-font-smoothing:antialiased;
	transition:background var(--duration-slow) var(--ease-standard), color var(--duration-slow) var(--ease-standard);
}
a{ color:var(--link); text-decoration:none; }
a:hover{ color:var(--link-hover); }
/* Author bylines now link to the author archive, but keep whatever color the surrounding text already had. */
.author-link{ color:inherit; text-decoration:none; }
.author-link:hover{ color:inherit; }
::selection{ background:var(--rose-600); color:var(--white); }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:var(--fw-display); letter-spacing:var(--ls-display); margin:0; }
img{ max-width:100%; }

.screen-reader-text{
	position:absolute;
	width:1px;height:1px;
	padding:0;margin:-1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
	white-space:nowrap;
	border:0;
}

.skip-link:focus{
	position:fixed;
	top:12px;
	left:12px;
	width:auto;
	height:auto;
	padding:12px 20px;
	margin:0;
	clip:auto;
	overflow:visible;
	white-space:normal;
	background:var(--rose-600);
	color:var(--white);
	font-family:var(--font-body);
	font-weight:var(--fw-medium);
	font-size:var(--fs-body-sm);
	border-radius:var(--radius-sm);
	box-shadow:var(--shadow-lg);
	z-index:9999;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
[tabindex]:focus-visible{
	outline:2px solid var(--focus-ring);
	outline-offset:2px;
}

/* ==========================================================================
   Site header
   ========================================================================== */
.site-header{
	background:var(--surface-sunken);
	border-bottom:1px solid var(--border-subtle);
}
.site-header__bar{
	max-width:var(--container-max);
	margin:0 auto;
	padding:16px 32px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:24px;
	flex-wrap:wrap;
}
.site-logo{ display:block; line-height:0; }
.site-logo img{ height:44px; width:auto; display:block; }
.custom-logo-link img{ height:44px; width:auto; display:block; }

.site-search{ flex:1; min-width:140px; max-width:280px; }
.site-search__inner{
	display:flex;
	align-items:center;
	gap:8px;
	border-bottom:1px solid var(--border-subtle);
	padding:6px 2px;
}
.site-search__inner svg{ flex-shrink:0; color:var(--text-disabled); }
.site-search input[type="search"]{
	flex:1;
	width:100%;
	background:transparent;
	border:none;
	outline:none;
	color:var(--text-secondary);
	font-family:var(--font-body);
	font-size:var(--fs-body-sm);
}
.site-search--desktop{ display:flex; }
.site-search--mobile{ display:none; padding:0 32px 14px; max-width:none; }
@media (max-width:880px){
	.site-search--desktop{ display:none; }
	.site-search--mobile{ display:block; }
}

.header-actions{ display:flex; align-items:center; gap:14px; }

.theme-toggle{
	width:36px; height:36px;
	border-radius:var(--radius-sm);
	background:var(--surface-raised);
	border:1px solid var(--border-subtle);
	display:flex; align-items:center; justify-content:center;
	cursor:pointer;
	color:var(--text-secondary);
	padding:0;
}
.theme-toggle .icon-moon{ display:none; }
html[data-theme="light"] .theme-toggle .icon-sun{ display:none; }
html[data-theme="light"] .theme-toggle .icon-moon{ display:block; }

.btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	font-family:var(--font-body);
	font-weight:var(--fw-medium);
	font-size:var(--fs-body-sm);
	border:none;
	cursor:pointer;
	text-decoration:none;
	transition:filter var(--duration-base) var(--ease-standard);
}
.btn:hover{ filter:brightness(1.1); text-decoration:none; }
.btn-primary{ background:var(--rose-600); color:var(--white); }
.btn-pill{ border-radius:var(--radius-pill); padding:10px 20px; height:38px; }

.navbar-toggler{
	display:none;
	align-items:center;
	justify-content:center;
	width:36px; height:36px;
	background:var(--surface-raised);
	border:1px solid var(--border-subtle);
	border-radius:var(--radius-sm);
	color:var(--text-secondary);
	cursor:pointer;
	padding:0;
}
@media (max-width:880px){
	.navbar-toggler{ display:inline-flex; }
}

/* ==========================================================================
   Primary navigation
   ========================================================================== */
.primary-nav-wrap{
	max-width:var(--container-max);
	margin:0 auto;
	padding:0 32px;
	border-top:1px solid var(--border-subtle);
}
@media (min-width:881px){
	.primary-nav-wrap.collapse{ display:block !important; }
}
.primary-menu{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:4px;
	list-style:none;
	margin:0;
	padding:0;
	flex-wrap:wrap;
}
.primary-menu li{ position:relative; }
.primary-menu > li > a{
	display:flex;
	align-items:center;
	gap:5px;
	padding:15px 16px;
	white-space:nowrap;
	border-bottom:2px solid transparent;
	color:var(--text-tertiary);
	font-family:var(--font-body);
	font-weight:var(--fw-medium);
	font-size:var(--fs-body-sm);
	text-transform:uppercase;
	letter-spacing:0.045em;
	text-decoration:none;
}
.primary-menu > li > a:hover,
.primary-menu > li.current-menu-item > a,
.primary-menu > li.current-menu-ancestor > a,
.primary-menu > li.current-menu-parent > a{
	color:var(--text-primary);
	border-bottom-color:var(--rose-500);
}
.primary-menu li.menu-item-has-children > a::after{
	content:'';
	width:6px; height:6px;
	border-right:1.5px solid currentColor;
	border-bottom:1.5px solid currentColor;
	transform:rotate(45deg);
	margin-top:-3px;
	opacity:.6;
}
.primary-menu .sub-menu{
	list-style:none;
	margin:0;
	padding:8px;
	position:absolute;
	top:100%;
	left:0;
	min-width:220px;
	background:var(--surface-card);
	border:1px solid var(--border-subtle);
	border-radius:var(--radius-sm);
	box-shadow:var(--shadow-md);
	opacity:0;
	visibility:hidden;
	transform:translateY(4px);
	transition:opacity var(--duration-base) var(--ease-standard), transform var(--duration-base) var(--ease-standard);
	z-index:20;
}
.primary-menu li.menu-item-has-children:hover > .sub-menu,
.primary-menu li.menu-item-has-children:focus-within > .sub-menu{
	opacity:1; visibility:visible; transform:translateY(0);
}
.primary-menu .sub-menu a{
	display:block;
	padding:8px 12px;
	color:var(--text-secondary);
	font-size:var(--fs-body-sm);
	text-transform:none;
	letter-spacing:normal;
	border-radius:var(--radius-xs);
	text-decoration:none;
}
.primary-menu .sub-menu a:hover{ background:var(--surface-raised); color:var(--text-primary); }

@media (max-width:880px){
	.primary-nav-wrap{ padding:0; }
	.primary-menu{ flex-direction:column; align-items:stretch; padding:8px 16px 16px; }
	.primary-menu > li > a{ border-bottom:none; border-left:2px solid transparent; padding:10px 12px; }
	.primary-menu > li.current-menu-item > a{ border-left-color:var(--rose-500); border-bottom-color:transparent; }
	.primary-menu .sub-menu{ position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none; background:transparent; padding:0 0 0 16px; display:none; }
	.primary-menu li.menu-item-has-children:hover > .sub-menu,
	.primary-menu li.menu-item-has-children:focus-within > .sub-menu{ display:block; }
}

/* ==========================================================================
   Page hero
   ========================================================================== */
.page-hero{ position:relative; overflow:hidden; background:var(--hero-navy); }
.page-hero__glow{ position:absolute; border-radius:50%; filter:blur(60px); pointer-events:none; }
.page-hero__glow--1{ top:-220px; left:-8%; width:640px; height:520px; background:radial-gradient(circle, oklch(0.50 0.215 339 / 0.30), transparent 70%); }
.page-hero__glow--2{ bottom:-200px; right:-10%; width:600px; height:480px; background:radial-gradient(circle, oklch(0.52 0.18 305 / 0.24), transparent 70%); }
.page-hero__inner{ position:relative; max-width:var(--container-max); margin:0 auto; padding:72px 32px 56px; }
.eyebrow{
	display:inline-block;
	font-family:var(--font-mono);
	font-size:var(--fs-caption);
	letter-spacing:var(--ls-caps);
	text-transform:uppercase;
	font-weight:var(--fw-semibold);
	color:var(--rose-400);
	text-decoration:none;
}
a.eyebrow:hover{ color:var(--rose-300); text-decoration:underline; }
.page-hero h1{
	margin-top:16px;
	font-size:var(--fs-display-lg);
	line-height:var(--lh-tight);
	color:var(--hero-text-primary);
	text-transform:uppercase;
}
.page-hero__desc{
	margin:16px 0 0;
	font-size:var(--fs-body-lg);
	line-height:var(--lh-relaxed);
	color:var(--hero-text-secondary);
	max-width:65ch;
}

/* ==========================================================================
   Post loop / cards
   ========================================================================== */
.post-loop-wrap{ max-width:var(--container-max); margin:0 auto; padding:56px 32px 96px; }
.post-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width:1100px){ .post-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .post-grid{ grid-template-columns:1fr; } }

.post-grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
@media (max-width:880px){ .post-grid-4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .post-grid-4{ grid-template-columns:1fr; } }

.post-card{
	background:var(--surface-card);
	border:1px solid var(--border-subtle);
	border-radius:var(--radius-md);
	box-shadow:var(--shadow-sm);
	overflow:hidden;
	display:flex;
	flex-direction:column;
	transition:border-color var(--duration-base) var(--ease-standard);
}
.post-card:hover{ border-color:var(--border-strong); }
.post-card__thumb{ display:block; aspect-ratio:16/9; overflow:hidden; background:var(--surface-raised); }
.post-card__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.post-card__body{ padding:18px; display:flex; flex-direction:column; gap:10px; flex:1; }
.post-card__tag{
	align-self:flex-start;
	font-family:var(--font-mono);
	font-size:var(--fs-caption);
	letter-spacing:var(--ls-caps);
	text-transform:uppercase;
	font-weight:var(--fw-semibold);
	color:var(--rose-400);
	text-decoration:none;
}
.post-card__tag:hover{ color:var(--rose-300); text-decoration:underline; }
.post-card__title{ margin:0; font-family:var(--font-body); font-weight:var(--fw-semibold); font-size:var(--fs-heading-md); line-height:var(--lh-snug); }
.post-card__title a{ color:var(--text-primary); text-decoration:none; }
.post-card__title a:hover{ color:var(--rose-400); }
.post-card__excerpt{ margin:0; font-size:var(--fs-body-sm); color:var(--text-tertiary); flex:1; }
.post-card__excerpt p{ margin:0; }
.post-card__meta{ display:flex; gap:8px; align-items:center; font-size:var(--fs-caption); color:var(--text-disabled); font-family:var(--font-mono); }

.no-results{ padding:64px 32px; text-align:center; color:var(--text-tertiary); font-size:var(--fs-body-lg); }

/* ==========================================================================
   Pagination (the_posts_pagination markup)
   ========================================================================== */
.pagination{ margin-top:56px; }
.pagination .nav-links{ display:flex; justify-content:center; align-items:center; gap:8px; flex-wrap:wrap; }
.pagination .page-numbers{
	display:flex;
	align-items:center;
	justify-content:center;
	min-width:40px;
	height:40px;
	padding:0 8px;
	border-radius:var(--radius-sm);
	background:var(--surface-card);
	border:1px solid var(--border-subtle);
	color:var(--text-secondary);
	font-family:var(--font-mono);
	font-size:var(--fs-body-sm);
	font-weight:var(--fw-medium);
	text-decoration:none;
}
.pagination .page-numbers.current{ background:var(--rose-500); border-color:var(--rose-500); color:var(--white); }
.pagination .page-numbers:hover:not(.current){ border-color:var(--border-strong); color:var(--text-primary); text-decoration:none; }
.pagination .page-numbers.dots{ background:transparent; border-color:transparent; }

/* ==========================================================================
   Site footer
   ========================================================================== */
.site-footer{ background:var(--surface-app); border-top:1px solid var(--border-subtle); }
.site-footer__top{
	max-width:var(--container-max);
	margin:0 auto;
	padding:72px 32px 40px;
	display:grid;
	grid-template-columns:1.4fr 1fr 1fr 1.2fr;
	gap:40px;
}
@media (max-width:880px){
	.site-footer__top{ grid-template-columns:1fr; gap:32px; padding:56px 32px 32px; }
}

.site-footer__brand{ display:flex; flex-direction:column; gap:16px; }
.site-footer__brand img{ height:26px; width:auto; }
.site-footer__tagline{ margin:0; color:var(--text-tertiary); font-size:var(--fs-body-sm); max-width:280px; line-height:var(--lh-relaxed); }

.site-footer__socials{ display:flex; gap:10px; margin-top:8px; }
.site-footer__socials a{
	width:36px; height:36px;
	border-radius:var(--radius-sm);
	background:var(--surface-raised);
	border:1px solid var(--border-subtle);
	display:flex; align-items:center; justify-content:center;
	color:var(--text-secondary);
}
.site-footer__socials a:hover{ color:var(--text-primary); border-color:var(--border-strong); text-decoration:none; }

.site-footer__heading{
	font-family:var(--font-mono);
	font-size:var(--fs-caption);
	letter-spacing:var(--ls-caps);
	text-transform:uppercase;
	color:var(--text-tertiary);
	margin-bottom:4px;
}
.site-footer__col{ display:flex; flex-direction:column; gap:12px; }
.site-footer__links{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.site-footer__links a{ color:var(--text-secondary); font-size:var(--fs-body-sm); text-decoration:none; }
.site-footer__links a:hover{ color:var(--text-primary); text-decoration:underline; }
.site-footer__links .sub-menu{ list-style:none; margin:8px 0 0; padding:0 0 0 14px; display:flex; flex-direction:column; gap:10px; }

.site-footer__bottom{ border-top:1px solid var(--border-subtle); }
.site-footer__bottom-inner{
	max-width:var(--container-max);
	margin:0 auto;
	padding:20px 32px;
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex-wrap:wrap;
	gap:10px;
}
.site-footer__copyright{ color:var(--text-disabled); font-size:var(--fs-caption); }
.site-footer__copyright a{ color:var(--text-disabled); text-decoration:underline; }
.site-footer__legal{ display:flex; gap:20px; }
.site-footer__legal a{ color:var(--text-disabled); font-size:var(--fs-caption); text-decoration:none; }
.site-footer__legal a:hover{ color:var(--text-secondary); text-decoration:underline; }

.site-footer__newsletter-copy{ margin:0; color:var(--text-tertiary); font-size:var(--fs-body-sm); }
.site-footer__newsletter{ display:flex; gap:8px; }
.site-footer__newsletter input[type="email"]{
	flex:1;
	min-width:0;
	background:var(--surface-raised);
	border:1px solid var(--border-subtle);
	border-radius:var(--radius-sm);
	padding:10px 12px;
	color:var(--text-primary);
	font-family:var(--font-body);
	font-size:var(--fs-body-sm);
	outline:none;
}
.site-footer__newsletter input[type="email"]:focus{ border-color:var(--border-strong); }
.site-footer__newsletter .btn{ padding:0 20px; border-radius:var(--radius-sm); flex-shrink:0; }
.site-footer__newsletter-msg{ margin:8px 0 0; font-size:var(--fs-caption); min-height:1em; }
.site-footer__newsletter-msg.is-success{ color:oklch(0.6 0.14 150); }
.site-footer__newsletter-msg.is-error{ color:var(--rose-400); }

/* ==========================================================================
   Section heading (eyebrow + bar + title + "more" link)
   ========================================================================== */
.section-heading{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:32px; flex-wrap:wrap; gap:12px; }
.section-heading .eyebrow{ margin-bottom:8px; }
.section-heading__row{ display:flex; align-items:center; gap:12px; }
.section-heading__bar{ width:4px; height:26px; background:var(--rose-500); border-radius:2px; flex-shrink:0; }
.section-heading h2{ font-size:var(--fs-display-sm); color:var(--text-primary); text-transform:uppercase; }
.section-heading__more{ color:var(--text-tertiary); font-size:var(--fs-body-sm); text-decoration:none; }
.section-heading__more:hover{ color:var(--text-primary); text-decoration:underline; }
.post-loop-wrap--related{ padding-top:64px; }

/* ==========================================================================
   Article hero
   ========================================================================== */
.article-hero{ position:relative; overflow:hidden; background:var(--hero-navy); }
.article-hero__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0.55; }
.article-hero__scrim{
	position:absolute; inset:0;
	background:linear-gradient(180deg, var(--hero-navy) 0%, var(--hero-navy) 5%, transparent 40%, var(--hero-navy) 95%);
	opacity:0.9;
}
.article-hero__glow{ position:absolute; border-radius:50%; filter:blur(60px); pointer-events:none; }
.article-hero__glow--1{ top:-220px; left:-8%; width:640px; height:800px; background:radial-gradient(circle, oklch(0.50 0.215 339 / 0.30), transparent 70%); }
.article-hero__glow--2{ bottom:-200px; right:-10%; width:600px; height:600px; background:radial-gradient(circle, oklch(0.52 0.18 305 / 0.24), transparent 70%); }
.article-hero__inner{ position:relative; max-width:var(--container-max); margin:0 auto; padding:150px 32px 90px; }
.article-hero__inner h1{
	margin-top:16px;
	font-size:var(--fs-display-lg);
	line-height:var(--lh-tight);
	color:var(--hero-text-primary);
	max-width:80%;
}
.article-hero__dek{
	margin:18px 0 0;
	font-size:var(--fs-body-lg);
	line-height:var(--lh-relaxed);
	color:var(--hero-text-secondary);
	max-width:65ch;
}
.article-hero__meta{ display:flex; align-items:center; gap:12px; margin-top:28px; flex-wrap:wrap; }
.article-hero__meta span{ font-size:var(--fs-body-sm); color:var(--hero-text-tertiary); }
.article-hero__author{ color:var(--hero-text-primary); font-weight:var(--fw-medium); }
.article-hero__avatar{ width:36px; height:36px; border-radius:50%; flex-shrink:0; display:block; }
@media (max-width:880px){
	.article-hero__inner{ padding:64px 24px 56px; }
	.article-hero__inner h1{ max-width:100%; }
}

.article-hero--centered .article-hero__inner{ display:flex; flex-direction:column; align-items:center; text-align:center; }
.article-hero--centered .article-hero__inner h1{ max-width:78ch; }
.article-hero--centered .article-hero__meta{ justify-content:center; }

/* ==========================================================================
   Article layout (TOC sidebar + content)
   ========================================================================== */
.article-section{ max-width:var(--container-max); margin:0 auto; padding:64px 32px 48px; }
.article-layout{ display:grid; grid-template-columns:300px 1fr; gap:56px; }
@media (max-width:880px){
	.article-layout{ grid-template-columns:1fr; }
	.article-aside{ position:static !important; }
}

.article-aside{ position:sticky; top:24px; align-self:start; display:flex; flex-direction:column; gap:24px; }
.toc-card{
	background:var(--surface-card);
	border:1px solid var(--border-subtle);
	border-radius:var(--radius-md);
	padding:20px;
	display:flex;
	flex-direction:column;
	gap:12px;
}
@media (min-width:1600px){
	.toc-card{ width:460px; margin-left:-160px; }
}
.toc-link{
	display:flex;
	gap:8px;
	color:var(--text-secondary);
	font-size:var(--fs-body-sm);
	line-height:var(--lh-snug);
	text-decoration:none;
	transition:color var(--duration-fast) var(--ease-standard);
}
.toc-link:hover{ color:var(--text-primary); text-decoration:none; }
.toc-link__number{ font-family:var(--font-mono); color:var(--rose-400); flex-shrink:0; }
.toc-link.is-active{ color:var(--purple-300); }
.toc-link.is-active .toc-link__number{ color:var(--purple-300); }

/* ==========================================================================
   Career episodes sidebar widget
   ========================================================================== */
.episodes-widget{ display:flex; flex-direction:column; gap:14px; }
.episodes-widget__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.episodes-widget__head a{ font-size:var(--fs-caption); color:var(--rose-400); font-weight:var(--fw-medium); white-space:nowrap; text-decoration:none; }
.episodes-widget__head a:hover{ color:var(--rose-300); text-decoration:underline; }
.episode-list{ display:flex; flex-direction:column; gap:12px; }
.episode-card{
	position:relative;
	border-radius:var(--radius-md);
	overflow:hidden;
	min-height:88px;
	display:flex;
	align-items:flex-end;
	background:var(--surface-card);
	border:1px solid var(--border-subtle);
	text-decoration:none;
}
.episode-card:hover{ border-color:var(--border-strong); text-decoration:none; }
.episode-card__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0.3; }
.episode-card__scrim{ position:absolute; inset:0; background:linear-gradient(120deg, var(--surface-card) 15%, transparent 100%); }
.episode-card__number{ position:absolute; top:10px; left:12px; font-family:var(--font-mono); font-size:var(--fs-heading-md); font-weight:var(--fw-semibold); color:var(--rose-400); }
.episode-card__body{ position:relative; width:100%; padding:14px 16px; }
.episode-card__title{ font-size:var(--fs-body-sm); font-weight:var(--fw-medium); color:var(--text-primary); line-height:var(--lh-snug); }
.episode-card.is-active{ border-color:var(--rose-500); }
.episode-card.is-active .episode-card__scrim{ background:linear-gradient(120deg, oklch(0.50 0.215 339 / 0.55) 15%, transparent 100%); }
.episode-card.is-active .episode-card__number,
.episode-card.is-active .episode-card__title{ color:var(--white); }

/* ==========================================================================
   Article content typography
   ========================================================================== */
/*
 * Deliberately block layout, not flex. Post content is arbitrary HTML
 * (manually pasted ad embeds, Gutenberg blocks, etc.) that may carry its
 * own `flex` shorthand — e.g. an AdSense snippet using `flex:0 0 100%`
 * assumes a normal block parent. Inside a column flex container that
 * percentage resolves against the main (vertical) axis instead of width,
 * which can inflate an empty ad slot to thousands of pixels tall. Plain
 * block flow with margin-top spacing sidesteps that entirely.
 */
.article-content{ min-width:0; font-size:var(--fs-body-lg); line-height:var(--lh-relaxed); color:var(--text-secondary); }
.article-content > *{ margin-top:24px; }
.article-content > *:first-child{ margin-top:0; }
.article-content p{ margin-right:0; margin-bottom:0; margin-left:0; font-size:var(--fs-body-lg); line-height:var(--lh-relaxed); color:var(--text-secondary); }
.article-content h2{ margin-top:36px; margin-right:0; margin-bottom:0; margin-left:0; font-size:var(--fs-display-md); color:var(--text-primary); }
.article-content h3{ margin-top:32px; margin-right:0; margin-bottom:0; margin-left:0; font-size:var(--fs-display-sm); color:var(--text-primary); }
.article-content h4{ margin-top:28px; margin-right:0; margin-bottom:0; margin-left:0; font-size:var(--fs-heading-md); color:var(--text-primary); }
.article-content a{ color:var(--link); text-decoration:underline; }
.article-content a:hover{ color:var(--link-hover); }
.article-content ul,
.article-content ol{ margin-right:0; margin-bottom:0; margin-left:0; padding-left:1.4em; }
.article-content li{ margin:0 0 8px; }
.article-content blockquote{
	margin-right:0;
	margin-bottom:0;
	margin-left:0;
	padding:20px 24px;
	border-left:3px solid var(--rose-500);
	background:var(--surface-card);
	border-radius:var(--radius-sm);
	font-size:var(--fs-body-lg);
	color:var(--text-primary);
	font-style:italic;
}
.article-content blockquote p{ margin:0; color:inherit; font-size:inherit; }
.article-content figure{ margin-top:24px; margin-right:0; margin-bottom:8px; margin-left:0; }
.article-content img{ max-width:100%; height:auto; display:block; border-radius:var(--radius-md); }
.article-content figcaption{ margin-top:10px; font-size:var(--fs-body-sm); line-height:var(--lh-snug); color:var(--text-tertiary); }
/*
 * Editor-applied "wide" class on an image or gallery block — breaks out to
 * the right past the content column. Gated to >=1600px, the same threshold
 * the TOC card breakout already uses: below that, the article-section's own
 * outer margin isn't big enough to absorb the overflow without causing real
 * page-level horizontal scroll.
 */
@media (min-width:1600px){
	.article-content .wp-block-image.wide,
	.article-content .wp-block-gallery.wide{ width:120%; }
	.article-content .wp-block-image.wide img{ width:100%; }
}
/* Caption overlaid on the image itself instead of sitting below it, with a scrim so the text stays legible — scrim color follows the theme (dark navy in dark mode, near-white in light mode), same tokens the article hero scrim uses. */
.article-content figure.wp-block-image{ position:relative; }
.article-content figure.wp-block-image figcaption.wp-element-caption{
	position:absolute;
	left:0; right:0; bottom:0;
	margin:0;
	padding:48px 20px 16px;
	background:linear-gradient(180deg, transparent 0%, var(--hero-navy) 100%);
	border-radius:0 0 var(--radius-md) var(--radius-md);
	color:var(--hero-text-primary);
	font-size:var(--fs-body-sm);
	line-height:var(--lh-snug);
}
.article-content ins.adsbygoogle{ max-width:100%; }
.article-content-banner{ display:block; max-width:300px; margin:40px auto; line-height:0; }
.article-content-banner__img{ width:100%; height:auto; object-fit:cover; display:block; }
@media (min-width:881px){
	.article-content-banner{ display:none; }
}
.article-content__edit{ margin:0; }
.article-content__edit a{ color:var(--text-disabled); font-size:var(--fs-caption); }

/* ==========================================================================
   Post navigation (prev/next)
   ========================================================================== */
.navigation.post-navigation{
	max-width:var(--container-max);
	margin:48px auto 64px;
	padding:0 32px;
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:16px;
}
.navigation.post-navigation .nav-links{ display:contents; }
.navigation.post-navigation .nav-previous,
.navigation.post-navigation .nav-next{
	background:var(--surface-card);
	border:1px solid var(--border-subtle);
	border-radius:var(--radius-md);
	padding:16px 20px;
}
.navigation.post-navigation .nav-next{ text-align:right; }
.navigation.post-navigation a{ text-decoration:none; display:flex; flex-direction:column; gap:4px; }
.navigation.post-navigation .nav-subtitle{ font-family:var(--font-mono); font-size:var(--fs-caption); letter-spacing:var(--ls-caps); text-transform:uppercase; color:var(--text-tertiary); }
.navigation.post-navigation .nav-title{ color:var(--text-primary); font-size:var(--fs-body-sm); font-weight:var(--fw-medium); }
.navigation.post-navigation a:hover .nav-title{ color:var(--rose-400); }
@media (max-width:640px){
	.navigation.post-navigation{ grid-template-columns:1fr; }
	.navigation.post-navigation .nav-next{ text-align:left; }
}

/* ==========================================================================
   Home hero (front-page.php)
   ========================================================================== */
.home-hero{ position:relative; overflow:hidden; border-bottom:1px solid var(--border-subtle); }
.home-hero__glow{ position:absolute; border-radius:50%; filter:blur(50px); pointer-events:none; z-index:0; }
.home-hero__glow--1{ top:-220px; left:-8%; width:640px; height:640px; background:radial-gradient(circle, oklch(0.50 0.215 339 / 0.22), transparent 70%); }
.home-hero__glow--2{ top:-140px; right:-10%; width:620px; height:620px; background:radial-gradient(circle, oklch(0.52 0.18 305 / 0.18), transparent 70%); }
.home-hero__glow--3{ bottom:-260px; left:40%; width:560px; height:560px; background:radial-gradient(circle, oklch(0.50 0.215 339 / 0.12), transparent 70%); }
.home-hero__inner{ max-width:1600px; margin:0 auto; padding:72px 32px 96px; position:relative; z-index:1; }

.hero-grid{ display:grid; grid-template-columns:1fr 340px; gap:32px; align-items:stretch; }
.hero-feed{ display:grid; grid-template-columns:1fr 1fr; gap:36px; min-width:0; align-items:start; }
@media (max-width:1599px){
	.hero-grid{ grid-template-columns:1fr; }
}
@media (max-width:880px){
	.hero-feed{ grid-template-columns:1fr !important; }
}

.hero-feature{ min-width:0; }
.hero-feature__thumb{ display:block; width:100%; aspect-ratio:16/9; border-radius:var(--radius-md); overflow:hidden; background:var(--surface-raised); }
.hero-feature__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.hero-feature__meta{ margin-top:20px; font-size:var(--fs-body-sm); color:var(--text-tertiary); }
.hero-feature__meta a{ color:var(--rose-400); }
.hero-feature__meta a.author-link{ color:inherit; }
.hero-feature__title{ margin-top:10px; font-size:var(--fs-display-sm); line-height:var(--lh-tight); color:var(--text-primary); }
.hero-feature__title a{ color:inherit; text-decoration:none; }
.hero-feature__title a:hover{ color:var(--rose-400); }
.hero-feature__excerpt{ margin:14px 0 0; font-size:var(--fs-body-md); line-height:var(--lh-relaxed); color:var(--text-secondary); max-width:60ch; }

.hero-list{ min-width:0; display:flex; flex-direction:column; }
.hero-list__row{ display:flex; gap:16px; padding:16px 0; border-top:1px solid var(--border-subtle); }
.hero-list__row:first-child{ border-top:none; }
.hero-list__thumb{ display:block; width:120px; height:88px; flex-shrink:0; border-radius:var(--radius-sm); overflow:hidden; background:var(--surface-raised); }
.hero-list__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.hero-list__body{ min-width:0; display:flex; flex-direction:column; gap:5px; }
.hero-list__meta{ font-size:var(--fs-caption); color:var(--text-tertiary); }
.hero-list__meta a{ color:var(--rose-400); }
.hero-list__meta a.author-link{ color:inherit; }
.hero-list__title{ font-size:var(--fs-heading-md); font-weight:var(--fw-semibold); color:var(--text-primary); line-height:var(--lh-snug); }
.hero-list__title a{ color:inherit; text-decoration:none; }
.hero-list__title a:hover{ color:var(--rose-400); }
.hero-list__excerpt{ margin:0; font-size:var(--fs-body-md); color:var(--text-tertiary); line-height:var(--lh-normal); }

.hero-banner{ position:relative; border-radius:var(--radius-md); box-shadow:var(--shadow-md); overflow:hidden; min-height:400px; background:var(--surface-card); display:flex; }
.hero-banner .naslovna-oglas-horizontal-row{ width:100%; display:flex; align-items:center; justify-content:center; }
.hero-banner__link{ position:absolute; inset:0; display:block; }
.hero-banner__img{ width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width:1599px){ .hero-banner{ display:none; } }

/* Below 1600px the vertical sidebar banner is replaced by a full-width
   banner under the article feed: 920x170 down to 768px, then 1:1 square. */
.hero-banner-responsive{ display:none; margin-top:32px; }
@media (max-width:1599px){ .hero-banner-responsive{ display:block; } }
.hero-banner-responsive__link{ display:block; max-width:920px; margin:0 auto; border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-md); }
.hero-banner-responsive__img{ width:100%; height:auto; aspect-ratio:920/170; object-fit:cover; display:block; }
@media (max-width:767px){
	.hero-banner-responsive__link{ max-width:480px; }
	.hero-banner-responsive__img{ aspect-ratio:1/1; }
}

/* ==========================================================================
   Home sections (Trending / Creative Workshop / Careers / FM School / Downloads)
   ========================================================================== */
.home-section{ max-width:var(--container-max); margin:0 auto; padding:96px 32px; }
.home-section--tinted{ background:var(--surface-sunken); border-top:1px solid var(--border-subtle); border-bottom:1px solid var(--border-subtle); position:relative; overflow:hidden; }
.home-section--tinted .home-section__inner{ max-width:var(--container-max); margin:0 auto; padding:96px 32px; position:relative; z-index:1; }

.home-section--school{ background:var(--school-bg); }

.home-section__glow{ position:absolute; border-radius:50%; filter:blur(50px); pointer-events:none; z-index:0; }

/*
 * Manually-placed AdSense slot, dropped between page sections. min-height
 * reserves space up front so the layout doesn't jump once the ad actually
 * loads (on localhost / an unverified domain it never fills, so without
 * this the slot would just be invisible here). Margin is intentionally
 * asymmetric — tighter above (reads as belonging to what precedes it),
 * looser below (clear separation before the next section starts) rather
 * than an even gap on both sides, which read as glued to whatever came
 * after it (especially against a tinted section background).
 */
.content-ad-slot{ max-width:var(--container-max); margin:24px auto 64px; padding:0 32px; }
.content-ad-slot ins{ display:flex; align-items:center; justify-content:center; min-height:120px; }
/* If an ad blocker prevents the ad from ever rendering, the JS in google-custom-ad.php
   adds this class so the slot (and its margins) collapse away entirely instead of
   leaving a suspicious empty gap. */
.content-ad-slot.is-empty{ display:none; }

.glow-workshop-1{ top:-180px; right:-10%; width:560px; height:560px; background:radial-gradient(circle, oklch(0.52 0.18 305 / 0.16), transparent 70%); }
.glow-workshop-2{ bottom:-220px; left:-8%; width:520px; height:520px; background:radial-gradient(circle, oklch(0.50 0.215 339 / 0.12), transparent 70%); }

.glow-school-1{ top:-200px; left:10%; width:600px; height:600px; filter:blur(60px); background:radial-gradient(circle, var(--school-glow-1), transparent 70%); }
.glow-school-2{ bottom:-240px; right:5%; width:560px; height:560px; filter:blur(60px); background:radial-gradient(circle, var(--school-glow-2), transparent 70%); }

.glow-downloads-1{ top:-200px; left:-8%; width:600px; height:600px; background:radial-gradient(circle, oklch(0.50 0.215 339 / 0.18), transparent 70%); }
.glow-downloads-2{ bottom:-200px; right:-10%; width:540px; height:540px; background:radial-gradient(circle, oklch(0.52 0.18 305 / 0.13), transparent 70%); }

.download-icon-badge{
	position:absolute; bottom:10px; right:10px;
	width:32px; height:32px;
	border-radius:var(--radius-sm);
	background:var(--surface-overlay);
	display:flex; align-items:center; justify-content:center;
	backdrop-filter:blur(var(--blur-glass));
	color:var(--white);
}

/* Creative Workshop split layout */
.workshop-layout{ display:grid; grid-template-columns:1.3fr 1fr; gap:28px; align-items:stretch; }
@media (max-width:880px){ .workshop-layout{ grid-template-columns:1fr; } }
.workshop-feature{ background:var(--surface-card); border:1px solid var(--border-subtle); border-radius:var(--radius-md); box-shadow:var(--shadow-md); overflow:hidden; display:flex; flex-direction:column; }
.workshop-feature__thumb{ display:block; width:100%; aspect-ratio:16/9; overflow:hidden; }
.workshop-feature__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.workshop-feature__body{ padding:22px; display:flex; flex-direction:column; gap:10px; }
.workshop-feature__title{ font-size:var(--fs-heading-lg); color:var(--text-primary); font-family:var(--font-body); font-weight:var(--fw-semibold); margin:0; }
.workshop-feature__title a{ color:inherit; text-decoration:none; }
.workshop-feature__title a:hover{ color:var(--purple-400); }
.workshop-feature__excerpt{ margin:0; color:var(--text-secondary); font-size:var(--fs-body-md); }
.workshop-feature__date{ font-size:var(--fs-caption); color:var(--text-disabled); font-family:var(--font-mono); margin-top:4px; }

.workshop-list{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-content:start; }
.workshop-list__item{ display:flex; flex-direction:column; gap:10px; min-width:0; }
.workshop-list__thumb{ display:block; width:100%; aspect-ratio:16/11; border-radius:var(--radius-sm); overflow:hidden; background:var(--surface-raised); }
.workshop-list__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.workshop-list__title{ font-size:var(--fs-body-md); font-weight:var(--fw-semibold); color:var(--text-primary); line-height:var(--lh-snug); }
.workshop-list__title a{ color:inherit; text-decoration:none; }
.workshop-list__title a:hover{ color:var(--purple-400); }
.workshop-list__date{ font-size:var(--fs-caption); color:var(--text-disabled); font-family:var(--font-mono); }

/* Career series cards */
.career-card{ background:var(--surface-card); border:1px solid var(--border-subtle); border-radius:var(--radius-md); box-shadow:var(--shadow-sm); overflow:hidden; display:flex; flex-direction:column; transition:border-color var(--duration-base) var(--ease-standard); }
.career-card:hover{ border-color:var(--border-strong); }
.career-card__thumb{ display:block; width:100%; aspect-ratio:16/9; overflow:hidden; background:var(--surface-raised); }
.career-card__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.career-card__body{ padding:18px; display:flex; flex-direction:column; gap:10px; flex:1; }
.career-card__episodes{ display:flex; align-items:center; gap:6px; color:var(--text-tertiary); font-size:var(--fs-body-sm); }
.career-card__title{ font-size:var(--fs-heading-lg); color:var(--text-primary); font-family:var(--font-body); font-weight:var(--fw-semibold); line-height:var(--lh-snug); margin:0; }
.career-card__title a{ color:inherit; text-decoration:none; }
.career-card__title a:hover{ color:var(--rose-400); }
.career-card__desc{ margin:0; color:var(--text-secondary); font-size:var(--fs-body-sm); flex:1; }
.career-card__latest{ border-top:1px solid var(--border-subtle); padding-top:10px; display:flex; align-items:center; gap:8px; }
.career-card__latest-dot{ width:7px; height:7px; border-radius:50%; background:var(--rose-500); flex-shrink:0; }
.career-card__latest-text{ font-size:var(--fs-body-sm); font-weight:var(--fw-medium); color:var(--text-primary); }
.career-card__updated{ font-size:var(--fs-caption); color:var(--text-disabled); font-family:var(--font-mono); }

/* Career series rows — author.php (Author.dc.html), distinct from the .career-card grid above */
.career-row-list{ display:flex; flex-direction:column; gap:16px; }
.career-row{ text-decoration:none; background:var(--surface-card); border:1px solid var(--border-subtle); border-radius:var(--radius-md); box-shadow:var(--shadow-sm); overflow:hidden; display:flex; align-items:stretch; transition:border-color var(--duration-base) var(--ease-standard); }
.career-row:hover{ border-color:var(--border-strong); }
.career-row__thumb{ position:relative; width:240px; flex-shrink:0; background:var(--surface-raised); }
.career-row__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.career-row__badge{ position:absolute; top:10px; left:10px; padding:4px 8px; border-radius:var(--radius-xs); color:var(--white); font-family:var(--font-mono); font-size:var(--fs-caption); letter-spacing:var(--ls-caps); text-transform:uppercase; font-weight:var(--fw-semibold); }
.career-row__badge--ongoing{ background:oklch(0.5 0.14 150); }
.career-row__badge--complete{ background:var(--rose-500); }
.career-row__body{ padding:20px 24px; display:flex; flex-direction:column; gap:8px; flex:1; justify-content:center; min-width:0; }
.career-row__episodes{ display:flex; align-items:center; gap:6px; color:var(--text-tertiary); font-size:var(--fs-caption); }
.career-row__title{ margin:0; font-family:var(--font-body); font-weight:var(--fw-semibold); font-size:var(--fs-heading-md); color:var(--text-primary); line-height:var(--lh-snug); }
.career-row__desc{ margin:0; font-size:var(--fs-body-sm); line-height:var(--lh-relaxed); color:var(--text-secondary); }
.career-row__meta{ font-size:var(--fs-caption); color:var(--text-disabled); font-family:var(--font-mono); }
.career-row__latest{ border-top:1px solid var(--border-subtle); padding-top:10px; margin-top:4px; display:flex; align-items:center; gap:8px; }
.career-row__latest-dot{ width:6px; height:6px; border-radius:50%; background:var(--rose-500); flex-shrink:0; }
.career-row__latest-text{ font-size:var(--fs-body-sm); color:var(--text-secondary); }
@media (max-width:640px){
	.career-row{ flex-direction:column; }
	.career-row__thumb{ width:100%; aspect-ratio:16/9; }
}

/* ==========================================================================
   Home: Latest News list + sidebar
   ========================================================================== */
.home-news-layout{ display:grid; grid-template-columns:1fr 320px; gap:32px; align-items:start; }
@media (max-width:880px){ .home-news-layout{ grid-template-columns:1fr; } }

.post-row-list{ display:flex; flex-direction:column; gap:18px; }
.post-row{ display:flex; gap:20px; align-items:stretch; padding:16px 0; border-bottom:1px solid var(--border-subtle); }
.post-row__thumb{ display:block; width:180px; flex-shrink:0; border-radius:var(--radius-sm); overflow:hidden; background:var(--surface-raised); aspect-ratio:16/11; }
.post-row__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.post-row__body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; justify-content:center; }
.post-row__title{ font-size:var(--fs-heading-lg); font-weight:var(--fw-semibold); color:var(--text-primary); line-height:var(--lh-snug); margin:0; }
.post-row__title a{ color:inherit; text-decoration:none; }
.post-row__title a:hover{ color:var(--rose-400); }
.post-row__excerpt{ margin:0; font-size:var(--fs-body-sm); color:var(--text-tertiary); }
.post-row__meta{ font-size:var(--fs-caption); color:var(--text-disabled); font-family:var(--font-mono); }

.home-sidebar{ display:flex; flex-direction:column; gap:20px; position:sticky; top:24px; align-self:start; }
@media (max-width:880px){ .home-sidebar{ position:static; } }
.sidebar-widget{ background:var(--surface-card); border:1px solid var(--border-subtle); border-radius:var(--radius-md); padding:18px; display:flex; flex-direction:column; gap:14px; }
.sidebar-widget .naslovna-oglas-horizontal-row{ display:flex; justify-content:center; }
.sidebar-widget--banner{ padding:0; overflow:hidden; border:none; background:transparent; border-radius:0; box-shadow:none; }
.sidebar-banner__link{ display:block; line-height:0; max-width:300px; margin:0 auto; }
.sidebar-banner__img{ width:100%; height:auto; display:block; }
@media (max-width:880px){
	.article-aside .sidebar-widget--banner{ display:none; }
}

.popular-posts-list{ display:flex; flex-direction:column; }
.popular-posts-list a{ display:flex; flex-direction:column; gap:4px; padding:0 0 12px; margin-bottom:12px; border-bottom:1px solid var(--border-subtle); text-decoration:none; }
.popular-posts-list a:last-child{ border-bottom:none; margin-bottom:0; padding-bottom:0; }
.popular-posts-list__title{ font-size:var(--fs-body-sm); font-weight:var(--fw-medium); color:var(--text-primary); line-height:var(--lh-snug); }
.popular-posts-list__cat{ font-size:var(--fs-caption); color:var(--text-disabled); }

.promo-box{ border-radius:var(--radius-md); padding:18px; display:flex; flex-direction:column; gap:8px; }
.promo-box--purple{ background:var(--purple-600); }
.promo-box__eyebrow{ font-family:var(--font-mono); font-size:var(--fs-caption); letter-spacing:var(--ls-caps); text-transform:uppercase; color:oklch(1 0 0 / 0.75); }
.promo-box__title{ font-family:var(--font-display); font-weight:var(--fw-display); color:var(--white); text-transform:uppercase; font-size:var(--fs-heading-lg); }
.promo-box__desc{ margin:0; color:oklch(1 0 0 / 0.85); font-size:var(--fs-body-sm); }

.categories-list{ display:flex; flex-direction:column; gap:12px; }
.categories-list__row{ display:flex; justify-content:space-between; align-items:center; font-size:var(--fs-body-sm); text-decoration:none; }
.categories-list__row:hover .categories-list__name{ color:var(--text-primary); }
.categories-list__name{ color:var(--text-secondary); }

/* ==========================================================================
   404
   ========================================================================== */
.not-found-hero{
	max-width:var(--container-max);
	margin:0 auto;
	padding:96px 32px;
	text-align:center;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:14px;
}
.not-found-hero__numeral{
	font-family:var(--font-mono);
	font-size:clamp(4rem, 3rem + 6vw, 8rem);
	line-height:1;
	font-weight:var(--fw-semibold);
	color:var(--rose-500);
}
.not-found-hero h1{ font-size:var(--fs-display-lg); color:var(--text-primary); margin:0; }
.not-found-hero p{ max-width:50ch; color:var(--text-secondary); font-size:var(--fs-body-lg); line-height:var(--lh-relaxed); margin:0; }
.not-found-hero .btn{ margin-top:10px; }
.categories-list__count{ color:var(--text-disabled); font-family:var(--font-mono); }

/* ==========================================================================
   Popular mini-list (thumbnail + title + date) — article/page sidebars
   ========================================================================== */
.popular-mini-list-wrap{ display:flex; flex-direction:column; gap:14px; }
.popular-mini-list{ display:flex; flex-direction:column; gap:12px; }
.popular-mini-list__item{ display:flex; gap:12px; align-items:flex-start; text-decoration:none; }
.popular-mini-list__thumb{ display:block; width:72px; height:52px; flex-shrink:0; border-radius:var(--radius-sm); overflow:hidden; background:var(--surface-raised); }
.popular-mini-list__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.popular-mini-list__body{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.popular-mini-list__title{ font-size:var(--fs-body-sm); font-weight:var(--fw-medium); color:var(--text-primary); line-height:var(--lh-snug); }
.popular-mini-list__date{ font-size:var(--fs-caption); font-family:var(--font-mono); color:var(--text-disabled); }

.page-links{ margin-top:8px; font-size:var(--fs-body-sm); color:var(--text-tertiary); }

/* ==========================================================================
   Archive (category/tag/taxonomy/date)
   ========================================================================== */
.archive-hero{ position:relative; overflow:hidden; background:var(--hero-navy); }
.archive-hero__inner{ position:relative; max-width:var(--container-max); margin:0 auto; padding:88px 32px 64px; }
.archive-hero h1{ margin-top:16px; font-size:var(--fs-display-lg); line-height:var(--lh-tight); color:var(--hero-text-primary); text-transform:uppercase; max-width:24ch; }
.archive-hero__desc{ margin:18px 0 40px; font-size:var(--fs-body-lg); line-height:var(--lh-relaxed); color:var(--hero-text-secondary); max-width:65ch; }
.archive-hero__desc p{ margin:0; }

.featured-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:40px; }
@media (max-width:1100px){ .featured-row{ grid-template-columns:1fr; } }
.featured-row__item{
	display:flex;
	gap:14px;
	align-items:center;
	background:oklch(1 0 0 / 0.05);
	border:1px solid oklch(1 0 0 / 0.1);
	border-radius:var(--radius-md);
	padding:12px;
	backdrop-filter:blur(6px);
	text-decoration:none;
	transition:background var(--duration-base) var(--ease-standard), border-color var(--duration-base) var(--ease-standard);
}
.featured-row__item:hover{ background:oklch(1 0 0 / 0.1); border-color:oklch(1 0 0 / 0.2); text-decoration:none; }
.featured-row__thumb{ display:block; width:96px; height:72px; flex-shrink:0; border-radius:var(--radius-sm); overflow:hidden; }
.featured-row__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.featured-row__body{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.featured-row__eyebrow{ font-family:var(--font-mono); font-size:var(--fs-caption); letter-spacing:var(--ls-caps); text-transform:uppercase; color:var(--rose-400); }
.featured-row__title{ font-size:var(--fs-body-sm); font-weight:var(--fw-semibold); color:var(--hero-text-primary); line-height:var(--lh-snug); }

.archive-section{ max-width:var(--container-max); margin:0 auto; padding:64px 32px 120px; }
.archive-layout{ display:grid; grid-template-columns:1fr 300px; gap:56px; }
@media (max-width:1100px){
	.archive-layout{ grid-template-columns:1fr; }
	.archive-aside{ position:static !important; }
}
.archive-aside{ position:sticky; top:24px; align-self:start; display:flex; flex-direction:column; gap:24px; }

.archive-view-toggle{ display:flex; justify-content:flex-end; gap:8px; margin-bottom:20px; }
.archive-view-toggle__btn{
	width:36px; height:36px;
	border-radius:var(--radius-sm);
	background:var(--surface-card);
	border:1px solid var(--border-subtle);
	display:flex; align-items:center; justify-content:center;
	color:var(--text-secondary);
	cursor:pointer;
	padding:0;
}
.archive-view-toggle__btn.is-active{ background:var(--rose-500); border-color:var(--rose-500); color:var(--white); }

.archive-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
@media (max-width:640px){ .archive-grid{ grid-template-columns:1fr; } }
.archive-grid.is-list{ grid-template-columns:1fr; }
.archive-grid.is-list .post-card{ flex-direction:row; }
.archive-grid.is-list .post-card__thumb{ width:180px; flex-shrink:0; aspect-ratio:auto; height:auto; }
@media (max-width:640px){
	.archive-grid.is-list .post-card{ flex-direction:column; }
	.archive-grid.is-list .post-card__thumb{ width:100%; aspect-ratio:16/9; }
}

.archive-section .pagination{ margin-top:56px; }

/* ==========================================================================
   Author archive
   ========================================================================== */
.author-hero{ position:relative; overflow:hidden; background:var(--hero-navy); }
.author-hero__inner{
	position:relative;
	max-width:var(--container-max);
	margin:0 auto;
	padding:72px 32px;
	display:flex;
	align-items:center;
	gap:28px;
	flex-wrap:wrap;
}
.author-hero__avatar{ flex-shrink:0; line-height:0; }
.author-hero__avatar img{ width:120px; height:120px; border-radius:50%; display:block; border:3px solid var(--border-subtle); }
.author-hero__body{ min-width:0; }
.author-hero__body h1{ margin-top:10px; font-size:var(--fs-display-lg); line-height:var(--lh-tight); color:var(--hero-text-primary); }
.author-hero__bio{ margin:14px 0 0; font-size:var(--fs-body-lg); line-height:var(--lh-relaxed); color:var(--hero-text-secondary); max-width:65ch; }
@media (max-width:640px){
	.author-hero__inner{ flex-direction:column; text-align:center; }
}

/*
 * Deliberately not .home-section here — that class carries 96px top+bottom
 * padding meant for visually distinct full-width homepage sections, which
 * doubles up to ~190px between consecutive shelves when stacked plainly.
 * The gap below (matching the Author.dc.html mockup) replaces that.
 */
.author-shelves{ max-width:var(--container-max); margin:0 auto; padding:64px 32px 120px; display:flex; flex-direction:column; gap:56px; }