/*!
Theme Name: DES Theme
Theme URI: https://digitaleconomicssociety.org
Author: Digital Economics Society
Author URI: https://digitaleconomicssociety.org
Description: Official theme for the Digital Economics Society - A research organization focused on digital economics in Africa.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: des-theme
Tags: research, think-tank, economics, africa, custom-post-types, custom-menu, featured-images, translation-ready
*/

/* ==========================================================================
   CSS Custom Properties — Palette institutionnelle DES
   ========================================================================== */

:root {
	/* ── Palette principale ── */
	--color-primary:      #0C1523;   /* navy-black profond — RGB(12, 21, 35) */
	--color-accent:       #0099E6;   /* cyan-bleu — RGB(0, 153, 230) */
	--color-accent-dark:  #0077B6;   /* variante assombrie pour hover/active */
	--color-white:        #FFFFFF;
	--color-bg-light:     #F8FAFC;   /* slate-50 */
	--color-text:         #0C1523;
	--color-text-muted:   #64748B;   /* slate-500 */
	--color-text-light:   #94A3B8;   /* slate-400 */
	--color-footer-bg:    #060D18;
	--color-border:       #E2E8F0;   /* slate-200 */
	--color-border-light: #F1F5F9;   /* slate-100 */

	/* ── Palette africaine — plus vive ── */
	--color-terracotta:    #E05026;
	--color-terracotta-lt: rgba(224, 80, 38, 0.08);
	--color-gold:          #D97706;   /* amber-600 */
	--color-gold-lt:       rgba(217, 119, 6, 0.10);
	--color-green-africa:  #16A34A;   /* green-600 */
	--color-green-lt:      rgba(22, 163, 74, 0.08);
	--color-bg-warm:       #FEFCE8;   /* amber-50 */

	/* ── Typographie ── */
	--font-heading: 'Plus Jakarta Sans', system-ui, sans-serif;
	--font-body:    'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;

	/* ── Mise en page ── */
	--container-max:  1200px;
	--container-wide: 1440px;

	
	--gutter:         1.5rem;

	/* ── Style moderne ── */
	--border-radius:    10px;
	--border-radius-sm: 6px;
	--transition:       0.22s ease;
	--header-height: 96px;
	--shadow-card:      0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
	--shadow-hover:     0 8px 24px rgba(0, 0, 0, 0.08), 0 24px 48px rgba(0, 0, 0, 0.05);
}

/* ==========================================================================
   Reset & Base
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
	font-size: 16px;
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

body {
	font-family: var(--font-body);
	font-size: 1rem;
	line-height: 1.75;
	color: var(--color-text);
	background-color: var(--color-white);
	-webkit-font-smoothing: antialiased;
	font-feature-settings: "kern" 1, "liga" 1;
}

img, picture, video, canvas, svg { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; }
p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }

a {
	color: var(--color-accent);
	text-decoration: none;
	transition: color var(--transition);
}
a:hover, a:focus { color: var(--color-accent-dark); text-decoration: underline; }
ul, ol { list-style: none; }

/* ==========================================================================
   Typographie — style éditorial / think tank
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	font-weight: 700;
	line-height: 1.3;      /* Merriweather besoin de plus d'air */
	color: var(--color-primary);
	letter-spacing: -0.01em;
}

h1 { font-size: clamp(1.75rem, 3.2vw, 2.5rem);  line-height: 1.25; }
h2 { font-size: clamp(1.35rem, 2.5vw, 1.875rem); line-height: 1.3;  }
h3 { font-size: clamp(1.1rem,  1.8vw, 1.35rem);  line-height: 1.35; }
h4 { font-size: 1.1rem;  }
h5 { font-size: 0.975rem; }
h6 { font-size: 0.9rem;  }

p { margin-bottom: 1.25rem; }
p:last-child { margin-bottom: 0; }

blockquote {
	border-left: 4px solid var(--color-accent);
	padding: 1.25rem 2rem;
	margin: 2.5rem 0;
	font-family: var(--font-heading);
	font-style: italic;
	font-weight: 300;
	font-size: 1.125rem;
	line-height: 1.75;
	color: var(--color-primary);
	background: var(--color-bg-light);
	position: relative;
}

blockquote::before {
	content: '\201C';
	position: absolute;
	top: -0.5rem;
	left: 1.5rem;
	font-size: 4rem;
	line-height: 1;
	color: var(--color-accent);
	opacity: 0.25;
	font-family: Georgia, serif;
}

strong { font-weight: 700; }

.entry-content ul, .entry-content ol {
	list-style: revert;
	margin: 1rem 0 1.25rem 1.5rem;
}
.entry-content li { margin-bottom: 0.4rem; }

/* ==========================================================================
   Layout
   ========================================================================== */

.container {
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.container--wide {
	max-width: var(--container-wide);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.section { padding-block: 5rem; }

.section--alt {
	background-color: var(--color-bg-warm);
	/* Motif Bogolan/Adinkra en terracotta sur fond chaud */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Crect x='0.5' y='0.5' width='79' height='79' fill='none' stroke='rgba(192,75,47,0.07)' stroke-width='0.5'/%3E%3Ccircle cx='40' cy='40' r='13' fill='none' stroke='rgba(192,75,47,0.08)' stroke-width='1'/%3E%3Cline x1='40' y1='27' x2='40' y2='53' stroke='rgba(192,75,47,0.08)' stroke-width='1.5'/%3E%3Cline x1='27' y1='40' x2='53' y2='40' stroke='rgba(192,75,47,0.08)' stroke-width='1.5'/%3E%3Cpath d='M40 27L53 40 40 53 27 40Z' fill='none' stroke='rgba(192,75,47,0.06)' stroke-width='0.75'/%3E%3Cpath d='M0 12L12 12 12 0' fill='none' stroke='rgba(192,75,47,0.07)' stroke-width='1'/%3E%3Cpath d='M80 12L68 12 68 0' fill='none' stroke='rgba(192,75,47,0.07)' stroke-width='1'/%3E%3Cpath d='M0 68L12 68 12 80' fill='none' stroke='rgba(192,75,47,0.07)' stroke-width='1'/%3E%3Cpath d='M80 68L68 68 68 80' fill='none' stroke='rgba(192,75,47,0.07)' stroke-width='1'/%3E%3Ccircle cx='40' cy='0' r='2' fill='rgba(192,75,47,0.07)'/%3E%3Ccircle cx='0' cy='40' r='2' fill='rgba(192,75,47,0.07)'/%3E%3Ccircle cx='80' cy='40' r='2' fill='rgba(192,75,47,0.07)'/%3E%3Ccircle cx='40' cy='80' r='2' fill='rgba(192,75,47,0.07)'/%3E%3Ccircle cx='40' cy='40' r='2.5' fill='rgba(192,75,47,0.08)'/%3E%3C/svg%3E");
	background-size: 80px 80px;
}

/* En-tête de section */
.section__header { margin-bottom: 3rem; }
.section__header--centered { text-align: center; }

.section__label {
	display: block;
	font-family: var(--font-body);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-terracotta);
	margin-bottom: 0.6rem;
}

.section__label--gold  { color: var(--color-gold); }
.section__label--blue  { color: var(--color-accent); }
.section__label--green { color: var(--color-green-africa); }

/* Titre de section avec filet — signature éditoriale */
.section__title {
	position: relative;
	padding-bottom: 1rem;
	margin-bottom: 0.75rem;
}

.section__title::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 44px;
	height: 3px;
	background: linear-gradient(to right, var(--color-terracotta), var(--color-gold));
}

.section__header--centered .section__title::after {
	left: 50%;
	transform: translateX(-50%);
}

.section__subtitle {
	font-size: 1.02rem;
	color: var(--color-text-muted);
	max-width: 640px;
	line-height: 1.75;
	margin-top: 1rem;
}

.section__header--centered .section__subtitle { margin-inline: auto; }

/* section__title dans un flex-between — pas de padding-bottom qui décale */
.section__title--flush {
	padding-bottom: 0;
	margin-bottom: 0;
}

.section__title--flush::after { display: none; }

/* Grilles */
.grid-3 { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 2rem; }
.grid-4 { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.5rem; }
.grid-2 { display: grid; grid-template-columns: repeat(auto-fill, minmax(440px, 1fr)); gap: 2rem; }

.flex-between {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
}

.text-center  { text-align: center; }
.text-muted   { color: var(--color-text-muted); }

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

/* ==========================================================================
   Boutons — discrets, institutionnels
   ========================================================================== */

.btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.65rem 1.5rem;
	font-family: var(--font-body);
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1;
	border-radius: var(--border-radius-sm);
	border: 2px solid transparent;
	cursor: pointer;
	transition: background-color var(--transition), color var(--transition), border-color var(--transition);
	text-decoration: none;
}

.btn:hover, .btn:focus { text-decoration: none; }
.btn:focus { outline: 3px solid var(--color-accent); outline-offset: 2px; }

.btn--primary { background-color: var(--color-accent); color: var(--color-white); border-color: var(--color-accent); }
.btn--primary:hover, .btn--primary:focus { background-color: var(--color-accent-dark); border-color: var(--color-accent-dark); color: var(--color-white); }

.btn--outline { background-color: transparent; color: var(--color-accent); border-color: var(--color-accent); }
.btn--outline:hover, .btn--outline:focus { background-color: var(--color-accent); color: var(--color-white); }

.btn--outline-dark { background-color: transparent; color: var(--color-primary); border-color: var(--color-primary); }
.btn--outline-dark:hover { background-color: var(--color-primary); color: var(--color-white); }

.btn--outline-white { background-color: transparent; color: var(--color-white); border-color: rgba(255,255,255,0.6); }
.btn--outline-white:hover { background-color: var(--color-white); color: var(--color-primary); border-color: var(--color-white); }

.btn--white { background-color: var(--color-white); color: var(--color-primary); border-color: var(--color-white); }
.btn--white:hover { background-color: var(--color-bg-light); }

.btn--sm  { padding: 0.45rem 1rem;  font-size: 0.75rem; }
.btn--lg  { padding: 0.85rem 2rem;  font-size: 0.88rem; }

/* ==========================================================================
   Tags
   ========================================================================== */

.tag {
	display: inline-flex;
	align-items: center;
	padding: 0.18rem 0.6rem;
	font-family: var(--font-body);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border-radius: var(--border-radius-sm);
	text-decoration: none;
	transition: background-color var(--transition), color var(--transition);
}

.tag--primary {
	background-color: rgba(58, 123, 213, 0.1);
	color: var(--color-accent);
	border: 1px solid rgba(58, 123, 213, 0.2);
}

.tag--primary:hover {
	background-color: var(--color-accent);
	color: var(--color-white);
	text-decoration: none;
}

.tag--dark { background-color: var(--color-primary); color: var(--color-white); }

.tag--terracotta {
	background-color: var(--color-terracotta-lt);
	color: var(--color-terracotta);
	border: 1px solid rgba(192, 75, 47, 0.22);
}
.tag--terracotta:hover { background-color: var(--color-terracotta); color: var(--color-white); text-decoration: none; }

.tag--gold {
	background-color: var(--color-gold-lt);
	color: var(--color-gold);
	border: 1px solid rgba(201, 139, 21, 0.25);
}
.tag--gold:hover { background-color: var(--color-gold); color: var(--color-white); text-decoration: none; }

.tag--green {
	background-color: var(--color-green-lt);
	color: var(--color-green-africa);
	border: 1px solid rgba(39, 107, 72, 0.22);
}
.tag--green:hover { background-color: var(--color-green-africa); color: var(--color-white); text-decoration: none; }

/* ==========================================================================
   Skip link
   ========================================================================== */

.skip-link {
	position: absolute;
	top: -100px;
	left: 1rem;
	padding: 0.75rem 1.25rem;
	background-color: var(--color-primary);
	color: var(--color-white);
	font-weight: 700;
	z-index: 9999;
	text-decoration: none;
	transition: top var(--transition);
}
.skip-link:focus { top: 0; }

/* ==========================================================================
   HEADER — sobre, signature éditoriale
   ========================================================================== */

.site-header {
	position: sticky;
	top: 0;
	z-index: 1000;
	background-color: var(--color-white);
	border-bottom: 3px solid var(--color-primary);
	height: var(--header-height);
	display: flex;
	align-items: center;
	overflow: visible;
	transition: box-shadow var(--transition);
}

.site-header .container,
.header-inner,
.primary-nav,
.primary-nav .nav-menu { overflow: visible; }

.site-header.scrolled {
	box-shadow: 0 2px 20px rgba(27, 58, 92, 0.16);
	height: calc(var(--header-height) - 8px);
	transition: height 0.25s ease, box-shadow 0.25s ease;
}

.site-header .container { width: 100%; }

.header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
}

/* Logo */
.site-logo { flex-shrink: 0; }

.site-logo a {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	text-decoration: none;
	color: var(--color-primary);
}

.site-logo img,
.site-logo .des-logo-img {
	height: 72px;
	width: auto;
	max-width: 360px;
}

/* New PNG logo — wider aspect, sized for readability of the text mark. */
.site-logo .des-logo-img {
	object-fit: contain;
}

/* Light/dark variant switcher tied to the global theme attribute.
   Specificity bumped via .site-logo prefix so the variant hiding wins. */
.site-logo .des-logo-img--light { display: block; }
.site-logo .des-logo-img--dark  { display: none; }
:root[data-theme="dark"] .site-logo .des-logo-img--light { display: none; }
:root[data-theme="dark"] .site-logo .des-logo-img--dark  { display: block; }

@media (max-width: 600px) {
	.site-logo img,
	.site-logo .des-logo-img { height: 54px; max-width: 240px; }
}

.site-logo .logo-text {
	display: flex;
	flex-direction: row;
	align-items: center;
	line-height: 1;
	gap: 0.65rem;
}

.site-logo .logo-abbr {
	font-family: var(--font-heading);
	font-size: 1.65rem;
	font-weight: 700;
	color: var(--color-primary);
	letter-spacing: -0.02em;
	flex-shrink: 0;
}

.site-logo .logo-full {
	font-size: 0.6rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	max-width: 112px;
	line-height: 1.45;
}

.site-logo .logo-separator {
	display: block;
	width: 1px;
	height: 28px;
	background-color: var(--color-border);
	flex-shrink: 0;
}

/* Navigation — style journal */
.primary-nav { display: flex; align-items: center; }

.primary-nav .nav-menu {
	display: flex;
	align-items: center;
	gap: 0;
}

.primary-nav .nav-menu > li { position: relative; }

.primary-nav .nav-menu > li > a {
	display: flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.5rem 0.85rem;
	font-family: var(--font-body);
	font-size: 0.74rem;      /* IBM Plex Sans lisible à petite taille */
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-primary);
	text-decoration: none;
	white-space: nowrap;
	transition: color var(--transition);
	border-bottom: 3px solid transparent;
	margin-bottom: -3px;
	padding-bottom: calc(0.5rem + 3px);
}

.primary-nav .nav-menu > li > a:hover,
.primary-nav .nav-menu > li > a:focus,
.primary-nav .nav-menu > li.current-menu-item > a,
.primary-nav .nav-menu > li.current-menu-ancestor > a {
	color: var(--color-accent);
	border-bottom-color: var(--color-accent);
	text-decoration: none;
}

.primary-nav .nav-menu > li.menu-item-has-children > a::after {
	content: '';
	display: inline-block;
	width: 0; height: 0;
	border-left: 3px solid transparent;
	border-right: 3px solid transparent;
	border-top: 4px solid currentColor;
	opacity: 0.5;
	margin-top: 1px;
}

/* Dropdown */
.primary-nav .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 210px;
	background-color: var(--color-white);
	border-top: 3px solid var(--color-primary);
	border: 1px solid var(--color-border);
	border-top: 3px solid var(--color-primary);
	box-shadow: var(--shadow-hover);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity var(--transition), visibility var(--transition), transform var(--transition);
	z-index: 100;
}

.primary-nav .nav-menu > li:hover > .sub-menu,
.primary-nav .nav-menu > li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.primary-nav .sub-menu li { border-bottom: 1px solid var(--color-border-light); }
.primary-nav .sub-menu li:last-child { border-bottom: none; }

.primary-nav .sub-menu li a {
	display: block;
	padding: 0.65rem 1.25rem;
	font-family: var(--font-body);
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--color-primary);
	text-decoration: none;
	transition: color var(--transition), background-color var(--transition), padding-left var(--transition);
	border-left: 3px solid transparent;
}

.primary-nav .sub-menu li a:hover,
.primary-nav .sub-menu li.current-menu-item > a {
	color: var(--color-accent);
	background-color: var(--color-bg-light);
	border-left-color: var(--color-accent);
	padding-left: calc(1.25rem + 3px);
}

/* Header actions */
.header-actions {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
}

.header-search-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px; height: 34px;
	background: transparent;
	border: 1px solid var(--color-border);
	color: var(--color-text-muted);
	cursor: pointer;
	transition: color var(--transition), border-color var(--transition);
}

.header-search-toggle:hover { color: var(--color-primary); border-color: var(--color-primary); }
.header-search-toggle svg { width: 15px; height: 15px; }

/* Log in pill — visible only when user is logged out */
.header-login {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	height: 34px;
	padding: 0 0.85rem;
	background: transparent;
	border: 1px solid var(--color-border);
	border-radius: 999px;
	color: var(--color-text-muted);
	font-family: var(--font-body);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: color var(--transition), border-color var(--transition), background-color var(--transition);
}

.header-login:hover,
.header-login:focus-visible {
	color: var(--color-white);
	background: var(--color-primary);
	border-color: var(--color-primary);
	text-decoration: none;
	outline: none;
}

.header-login svg { flex-shrink: 0; }

/* Hide the text on narrow screens, keep just the icon as a tap target */
@media (max-width: 600px) {
	.header-login { padding: 0; width: 34px; justify-content: center; }
	.header-login span { display: none; }
}

/* Theme (dark/light) toggle — switch pilule avec pouce coulissant */
.theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	cursor: pointer;
	flex-shrink: 0;
	color: inherit;
	-webkit-tap-highlight-color: transparent;
}

.theme-toggle:focus { outline: none; }

.theme-toggle__track {
	position: relative;
	display: inline-block;
	width: 56px;
	height: 30px;
	border-radius: 999px;
	background: linear-gradient(135deg, #fef3c7 0%, #dbeafe 100%);
	border: 1px solid var(--color-border);
	box-shadow:
		inset 0 1px 2px rgba(0, 0, 0, 0.07),
		inset 0 -1px 1px rgba(255, 255, 255, 0.5);
	transition:
		background 0.2s ease,
		border-color 0.15s ease,
		box-shadow 0.15s ease;
}

.theme-toggle:hover .theme-toggle__track,
.theme-toggle:focus-visible .theme-toggle__track {
	border-color: var(--color-accent);
	box-shadow:
		inset 0 1px 2px rgba(0, 0, 0, 0.07),
		inset 0 -1px 1px rgba(255, 255, 255, 0.5),
		0 0 0 3px rgba(37, 99, 235, 0.15);
}

.theme-toggle__icon {
	position: absolute;
	top: 50%;
	width: 14px;
	height: 14px;
	transform: translateY(-50%);
	transition: opacity 0.18s ease, color 0.18s ease;
	pointer-events: none;
}

.theme-toggle__icon--sun {
	left: 7px;
	color: #D97706;        /* amber-600 */
	opacity: 1;
}

.theme-toggle__icon--moon {
	right: 7px;
	color: #475569;        /* slate-600 */
	opacity: 0.35;
}

.theme-toggle__thumb {
	position: absolute;
	top: 50%;
	left: 3px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: linear-gradient(160deg, #ffffff 0%, #f8fafc 100%);
	box-shadow:
		0 1px 2px rgba(0, 0, 0, 0.18),
		0 2px 6px rgba(0, 0, 0, 0.12),
		inset 0 1px 0 rgba(255, 255, 255, 0.9);
	transform: translateY(-50%);
	transition:
		transform 0.22s cubic-bezier(0.4, 0, 0.2, 1),
		background 0.18s ease,
		box-shadow 0.18s ease;
}

.theme-toggle:active .theme-toggle__thumb {
	transform: translateY(-50%) scale(0.94);
}

/* État sombre : pouce à droite + skin nocturne */
:root[data-theme="dark"] .theme-toggle__track {
	background: linear-gradient(135deg, #1E1B4B 0%, #0F172A 100%);
	border-color: rgba(255, 255, 255, 0.1);
	box-shadow:
		inset 0 1px 2px rgba(0, 0, 0, 0.4),
		inset 0 -1px 1px rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .theme-toggle:hover .theme-toggle__track,
:root[data-theme="dark"] .theme-toggle:focus-visible .theme-toggle__track {
	border-color: rgba(96, 165, 250, 0.6);
	box-shadow:
		inset 0 1px 2px rgba(0, 0, 0, 0.4),
		0 0 0 3px rgba(96, 165, 250, 0.18);
}

:root[data-theme="dark"] .theme-toggle__icon--sun {
	opacity: 0.35;
	color: #FBBF24;
}

:root[data-theme="dark"] .theme-toggle__icon--moon {
	opacity: 1;
	color: #E0E7FF;
}

:root[data-theme="dark"] .theme-toggle__thumb {
	transform: translate(26px, -50%);
	background: linear-gradient(160deg, #E2E8F0 0%, #94A3B8 100%);
	box-shadow:
		0 1px 2px rgba(0, 0, 0, 0.6),
		0 2px 8px rgba(0, 0, 0, 0.5),
		inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

:root[data-theme="dark"] .theme-toggle:active .theme-toggle__thumb {
	transform: translate(26px, -50%) scale(0.94);
}

/* Hamburger mobile */
.nav-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 38px; height: 38px;
	background: transparent;
	border: 1px solid var(--color-border);
	cursor: pointer;
	padding: 0.5rem;
}

.nav-toggle .bar {
	display: block;
	width: 18px; height: 2px;
	background-color: var(--color-primary);
	transition: transform var(--transition), opacity var(--transition);
}

.nav-toggle[aria-expanded="true"] .bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .bar:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] .bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ==========================================================================
   HERO — sobre, éditorial
   ========================================================================== */

.hero {
	position: relative;
	min-height: 400px;
	display: flex;
	align-items: center;
	background-color: var(--color-primary);
	overflow: hidden;
	border-bottom: none;
}

/* Bande kente supprimée */
.hero::after {
	display: none;
}

.hero__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
}

.hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(12, 21, 35, 0.85) 0%, rgba(6, 13, 24, 0.78) 100%);
}

/*
 * Motif Adinkra + Bogolan — tuile SVG 80×80
 * Cercle central (Nyame Dua), croix, coins en L (kente border), points d'ancrage
 */
.hero__pattern {
	position: absolute;
	inset: 0;
	z-index: 1;
	background-size: 80px 80px;
	opacity: 0.48;
	pointer-events: none;
}

.hero .container {
	position: relative;
	z-index: 2;
	padding-block: 4rem;
}

/* ── Split layout: text left / stats right ── */
.hero__inner {
	display: grid;
	grid-template-columns: 1fr 340px;
	gap: 5rem;
	align-items: center;
}

.hero__content { max-width: 780px; }

.hero__label {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	font-family: var(--font-body);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.45);
	margin-bottom: 1.75rem;
}

.hero__label::before {
	content: '';
	display: block;
	width: 36px;
	height: 2px;
	background: linear-gradient(to right, var(--color-terracotta), var(--color-gold));
	flex-shrink: 0;
}

.hero__title {
	font-family: var(--font-heading);
	font-size: clamp(1.9rem, 4vw, 3.1rem);
	font-weight: 900;
	color: var(--color-white);
	line-height: 1.12;
	margin-bottom: 1.25rem;
	letter-spacing: -0.025em;
	text-wrap: balance;
}

.hero__subtitle {
	font-family: var(--font-body);
	font-size: 1rem;
	color: rgba(255, 255, 255, 0.62);
	line-height: 1.65;
	margin-bottom: 2.25rem;
	max-width: 640px;
	text-wrap: balance;
}

/* ── Aside: key figures panel ── */
.hero__aside {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.09);
}

.hero__stat {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	padding: 1.5rem 1.25rem;
	background: rgba(6,13,24,0.55);
	position: relative;
}

.hero__stat::before {
	content: '';
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 2px;
}
.hero__stat:nth-child(1)::before { background: var(--color-gold); }
.hero__stat:nth-child(2)::before { background: var(--color-terracotta); }
.hero__stat:nth-child(3)::before { background: var(--color-accent); }
.hero__stat:nth-child(4)::before { background: var(--color-green-africa); }

.hero__stat-num {
	font-family: var(--font-heading);
	font-size: 2.8rem;
	font-weight: 900;
	color: var(--color-white);
	line-height: 1;
	letter-spacing: -0.04em;
}

.hero__stat-sup {
	font-size: 1.4rem;
	font-weight: 700;
	vertical-align: super;
	color: var(--color-gold);
}

.hero__stat-label {
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.45);
	line-height: 1.4;
}

/* ── Responsive hero ── */
@media (max-width: 900px) {
	.hero__inner {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}
	.hero__aside {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 600px) {
	.hero__aside {
		grid-template-columns: 1fr 1fr;
	}
	.hero__title {
		font-size: 1.75rem;
	}
}

.hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; }

/* ── Globe canvas ── */
.hero__globe-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	aspect-ratio: 1;
	max-width: 380px;
	margin: 0 auto;
}

.hero__globe {
	display: block;
	width: 100%;
	height: 100%;
}

.hero__stats {
	display: flex;
	gap: 0;
	margin-top: 4rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(255,255,255,0.1);
}

.hero__stat {
	padding-right: 2.5rem;
	margin-right: 2.5rem;
	border-right: 1px solid rgba(255,255,255,0.1);
}

.hero__stat:last-child {
	padding-right: 0;
	margin-right: 0;
	border-right: none;
}

.hero__stat-number {
	font-family: var(--font-heading);
	font-size: 2rem;
	font-weight: 900;
	color: var(--color-gold);
	line-height: 1;
	letter-spacing: -0.02em;
}

.hero__stat-label {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.4);
	margin-top: 0.35rem;
}

/* ==========================================================================
   CARDS — style "journal académique"
   Bordure supérieure colorée au lieu de coins arrondis et ombres lourdes
   ========================================================================== */

.card {
	background-color: var(--color-white);
	border: 1px solid var(--color-border);
	display: flex;
	flex-direction: column;
	transition: border-color var(--transition), box-shadow var(--transition);
}

.card:hover {
	border-color: var(--color-accent);
	box-shadow: var(--shadow-hover);
}

.card__image { aspect-ratio: 16/9; overflow: hidden; }

.card__image img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.card:hover .card__image img { transform: scale(1.03); }

.card__body {
	padding: 1.5rem;
	flex: 1;
	display: flex;
	flex-direction: column;
	border-top: 3px solid var(--color-primary);
	transition: border-top-color var(--transition), border-left-color var(--transition);
}

/* Rotation des couleurs africaines sur les cartes — vivant, pas monotone */
.card:nth-child(4n+1) .card__body { border-top-color: var(--color-primary); }
.card:nth-child(4n+2) .card__body { border-top-color: var(--color-terracotta); }
.card:nth-child(4n+3) .card__body { border-top-color: var(--color-green-africa); }
.card:nth-child(4n+4) .card__body { border-top-color: var(--color-gold); }

.card:hover .card__body { border-top-color: var(--color-accent); }

.card__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 0.75rem;
}

.card__date {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--color-text-light);
	text-transform: uppercase;
}

.card__title {
	font-family: var(--font-heading);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1.38;
	margin-bottom: 0.75rem;
}

.card__title a { color: inherit; text-decoration: none; transition: color var(--transition); }
.card__title a:hover { color: var(--color-accent); }

.card__authors {
	font-size: 0.83rem;
	color: var(--color-text-muted);
	font-style: italic;
	margin-bottom: 0.5rem;
}

.card__excerpt {
	font-size: 0.9rem;
	color: var(--color-text-muted);
	line-height: 1.7;
	flex: 1;
	margin-bottom: 1.25rem;
}

.card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 1rem;
	border-top: 1px solid var(--color-border-light);
	margin-top: auto;
}

.card__link {
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--color-accent);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	transition: gap var(--transition), color var(--transition);
}

.card__link:hover { gap: 0.7rem; color: var(--color-primary); }
.card__link-arrow { font-size: 1rem; }

/* Card featured — carte éditoriale lead story (image + corps côte à côte) */
.card--featured {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	margin-bottom: 2rem;
}

.card--featured .card__image {
	aspect-ratio: unset;
	min-height: 280px;
	height: 100%;
}

.card--featured .card__body {
	border-top: none;
	border-left: 4px solid var(--color-primary);
	padding: 2rem 2rem 1.75rem;
}

.card--featured:hover .card__body {
	border-left-color: var(--color-accent);
	border-top-color: transparent;
}

.card--featured .card__title {
	font-size: 1.3rem;
	line-height: 1.3;
	margin-bottom: 1rem;
}

.card--featured .card__excerpt { font-size: 0.92rem; }

/* Publication card */
.pub-card {
	background-color: var(--color-white);
	border: 1px solid var(--color-border);
	border-left: 4px solid var(--color-primary);
	padding: 1.5rem;
	display: flex;
	gap: 1.25rem;
	transition: border-left-color var(--transition), box-shadow var(--transition);
}

.pub-card:nth-child(3n+1) { border-left-color: var(--color-primary); }
.pub-card:nth-child(3n+2) { border-left-color: var(--color-terracotta); }
.pub-card:nth-child(3n+3) { border-left-color: var(--color-green-africa); }

.pub-card:hover { border-left-color: var(--color-gold); box-shadow: var(--shadow-hover); }

.pub-card__cover {
	flex-shrink: 0;
	width: 72px; height: 96px;
	overflow: hidden;
	background-color: var(--color-primary);
}

.pub-card__cover img { width: 100%; height: 100%; object-fit: cover; }

.pub-card__body { flex: 1; min-width: 0; }

.pub-card__title {
	font-family: var(--font-heading);
	font-size: 0.98rem;
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1.4;
	margin-bottom: 0.4rem;
}

.pub-card__title a { color: inherit; text-decoration: none; }
.pub-card__title a:hover { color: var(--color-accent); }

.pub-card__authors { font-size: 0.82rem; color: var(--color-text-muted); margin-bottom: 0.3rem; }

.pub-card__date {
	font-size: 0.75rem;
	color: var(--color-text-light);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-weight: 700;
}

/* ── Fellows grid ── */
.fellows-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}

/* ── Fellow card (fcard) ── */
.fcard {
	background: var(--color-white);
	border: 1px solid rgba(27, 58, 92, 0.08);
	box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
	display: flex;
	flex-direction: column;
	transition: transform 0.25s ease, box-shadow var(--transition), border-color var(--transition);
}

.fcard:hover {
	transform: translateY(-3px);
	box-shadow:
		0 10px 24px rgba(15, 23, 42, 0.04),
		0 20px 40px rgba(15, 23, 42, 0.08);
	border-color: rgba(37, 99, 235, 0.14);
}

/* Photo */
.fcard__photo-wrap {
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--color-bg-warm);
	flex-shrink: 0;
}

.fcard__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 22%;
	display: block;
	transition: transform 0.5s ease;
}

.fcard:hover .fcard__img { transform: scale(1.02); }

.fcard__initials {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-heading);
	font-size: 2.5rem;
	font-weight: 700;
	color: var(--color-white);
	background: linear-gradient(160deg, var(--color-primary) 0%, #2A5080 60%, var(--color-terracotta) 100%);
	letter-spacing: 0.05em;
}

/* Body */
.fcard__body {
	padding: 1.2rem 1.25rem 1rem;
	display: flex;
	flex-direction: column;
	flex: 1;
	border-top: 3px solid var(--color-primary);
}


.fcard__cohort {
	display: inline-block;
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.35rem;
}

.fcard__name {
	font-family: var(--font-heading);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 0.25rem;
}

.fcard__name a { color: var(--color-primary); text-decoration: none; }
.fcard__name a:hover { color: var(--color-terracotta); }

.fcard__position {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-terracotta);
	margin: 0 0 0.2rem;
}

.fcard__institution {
	font-size: 0.8rem;
	color: var(--color-text-muted);
	margin: 0 0 0.75rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Footer */
.fcard__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	margin-top: auto;
	padding-top: 0.75rem;
	border-top: 1px solid var(--color-border);
}

.fcard__country {
	display: flex;
	align-items: center;
	gap: 0.3rem;
	font-size: 0.72rem;
	color: var(--color-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.fcard__links {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	flex-shrink: 0;
}

.fcard__social {
	display: flex;
	align-items: center;
	color: var(--color-text-muted);
	transition: color var(--transition);
}

.fcard__social:hover { color: #0077B5; }

.fcard__profile-link {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	color: var(--color-primary);
	text-decoration: none;
	white-space: nowrap;
	transition: color var(--transition);
}

.fcard__profile-link:hover { color: var(--color-terracotta); }

@media (max-width: 1100px) {
	.fellows-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
	.fellows-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
	.fellows-grid { grid-template-columns: 1fr; }
}

/* Event card */
.event-card {
	background-color: var(--color-white);
	border: 1px solid var(--color-border);
	border-left: 4px solid var(--color-primary);
	display: flex;
	transition: border-left-color var(--transition), box-shadow var(--transition);
}

.event-card:nth-child(3n+1) { border-left-color: var(--color-primary); }
.event-card:nth-child(3n+2) { border-left-color: var(--color-terracotta); }
.event-card:nth-child(3n+3) { border-left-color: var(--color-green-africa); }

.event-card:hover { border-left-color: var(--color-gold); box-shadow: var(--shadow-hover); }

.event-card__date-block {
	flex-shrink: 0;
	width: 68px;
	background-color: var(--color-primary);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 1rem 0.5rem;
	color: var(--color-white);
}

.event-card__date-day { font-family: var(--font-heading); font-size: 1.7rem; font-weight: 700; line-height: 1; }
.event-card__date-month { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; opacity: 0.65; margin-top: 0.2rem; }

.event-card__body { padding: 1.25rem; flex: 1; }

.event-card__title { font-family: var(--font-heading); font-size: 1rem; font-weight: 700; color: var(--color-primary); margin-bottom: 0.5rem; }
.event-card__title a { color: inherit; text-decoration: none; }
.event-card__title a:hover { color: var(--color-accent); }

.event-card__meta { display: flex; flex-wrap: wrap; gap: 0.75rem; font-size: 0.8rem; color: var(--color-text-muted); }
.event-card__meta-item { display: flex; align-items: center; gap: 0.3rem; }

/* ==========================================================================
   PAGE HERO
   ========================================================================== */

.page-hero {
	background-color: var(--color-primary);
	padding: 4rem 0 3.5rem;
	border-bottom: none;
	position: relative;
	overflow: hidden;
}

/* Bande kente en bas */
.page-hero::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 5px;
	background: linear-gradient(
		to right,
		var(--color-terracotta) 0%, var(--color-terracotta) 33.33%,
		var(--color-gold)       33.33%, var(--color-gold)       66.66%,
		var(--color-green-africa) 66.66%, var(--color-green-africa) 100%
	);
	z-index: 2;
}

/* Motif africain switchable sur le page-hero */
.page-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background-size: 80px 80px;
	pointer-events: none;
	opacity: 0.35;
}

/* Pattern A — Kente Weave (défaut) */
.page-hero::before,
body:not([data-pattern]) .page-hero::before,
body[data-pattern="a"] .page-hero::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cline x1='0' y1='18' x2='80' y2='18' stroke='rgba(201,139,21,0.45)' stroke-width='1.5'/%3E%3Cline x1='0' y1='62' x2='80' y2='62' stroke='rgba(201,139,21,0.45)' stroke-width='1.5'/%3E%3Cpolyline points='0,9 8,3 16,9 24,3 32,9 40,3 48,9 56,3 64,9 72,3 80,9' stroke='rgba(255,255,255,0.22)' stroke-width='1' fill='none'/%3E%3Cpolyline points='0,71 8,65 16,71 24,65 32,71 40,65 48,71 56,65 64,71 72,65 80,71' stroke='rgba(255,255,255,0.22)' stroke-width='1' fill='none'/%3E%3Cpolygon points='40,24 56,40 40,56 24,40' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1'/%3E%3Cpolygon points='40,32 48,40 40,48 32,40' fill='none' stroke='rgba(255,255,255,0.14)' stroke-width='0.8'/%3E%3Ccircle cx='0' cy='0' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='80' cy='0' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='0' cy='80' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='80' cy='80' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3C/svg%3E");
	background-size: 80px 80px;
}

/* Pattern B — Adinkra Dwennimmen */
body[data-pattern="b"] .page-hero::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cpath d='M32,32 Q32,16 16,16 Q16,32 32,32' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.2'/%3E%3Cpath d='M32,32 Q48,32 48,16 Q32,16 32,32' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.2'/%3E%3Cpath d='M32,32 Q16,32 16,48 Q32,48 32,32' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.2'/%3E%3Cpath d='M32,32 Q32,48 48,48 Q48,32 32,32' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.2'/%3E%3Cpath d='M32,32 Q24,24 20,20' fill='none' stroke='rgba(255,255,255,0.1)' stroke-width='0.7'/%3E%3Cpath d='M32,32 Q40,24 44,20' fill='none' stroke='rgba(255,255,255,0.1)' stroke-width='0.7'/%3E%3Cpath d='M32,32 Q24,40 20,44' fill='none' stroke='rgba(255,255,255,0.1)' stroke-width='0.7'/%3E%3Cpath d='M32,32 Q40,40 44,44' fill='none' stroke='rgba(255,255,255,0.1)' stroke-width='0.7'/%3E%3Ccircle cx='32' cy='32' r='2.5' fill='rgba(255,255,255,0.18)'/%3E%3Ccircle cx='16' cy='16' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='48' cy='16' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='16' cy='48' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='48' cy='48' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3C/svg%3E");
	background-size: 64px 64px;
}

/* Pattern C — Bogolan/Mudcloth */
body[data-pattern="c"] .page-hero::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Crect x='26' y='8' width='8' height='44' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1'/%3E%3Crect x='8' y='26' width='44' height='8' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1'/%3E%3Crect x='23' y='4' width='14' height='7' fill='rgba(255,255,255,0.12)'/%3E%3Crect x='23' y='49' width='14' height='7' fill='rgba(255,255,255,0.12)'/%3E%3Crect x='4' y='23' width='7' height='14' fill='rgba(255,255,255,0.12)'/%3E%3Crect x='49' y='23' width='7' height='14' fill='rgba(255,255,255,0.12)'/%3E%3Ccircle cx='30' cy='30' r='4' fill='none' stroke='rgba(201,139,21,0.5)' stroke-width='1.2'/%3E%3Ccircle cx='30' cy='30' r='1.8' fill='rgba(201,139,21,0.45)'/%3E%3Cpolygon points='8,8 11,5 14,8 11,11' fill='rgba(201,139,21,0.45)'/%3E%3Cpolygon points='52,8 55,5 58,8 55,11' fill='rgba(201,139,21,0.45)'/%3E%3Cpolygon points='8,52 11,49 14,52 11,55' fill='rgba(201,139,21,0.45)'/%3E%3Cpolygon points='52,52 55,49 58,52 55,55' fill='rgba(201,139,21,0.45)'/%3E%3C/svg%3E");
	background-size: 60px 60px;
}

/* Pattern D — Kuba Maze */
body[data-pattern="d"] .page-hero::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M2,2 L22,2 L22,10 L10,10 L10,22 L2,22 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M46,2 L26,2 L26,10 L38,10 L38,22 L46,22 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M2,46 L22,46 L22,38 L10,38 L10,26 L2,26 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M46,46 L26,46 L26,38 L38,38 L38,26 L46,26 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Crect x='22' y='22' width='4' height='4' fill='rgba(201,139,21,0.55)'/%3E%3Cline x1='22' y1='10' x2='26' y2='10' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3Cline x1='22' y1='38' x2='26' y2='38' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3Cline x1='10' y1='22' x2='10' y2='26' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3Cline x1='38' y1='22' x2='38' y2='26' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3C/svg%3E");
	background-size: 48px 48px;
}

/* Pattern E — Ndebele Step */
body[data-pattern="e"] .page-hero::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cpath d='M4,4 L28,4 L28,10 L10,10 L10,28 L4,28 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M4,4 L20,4 L20,10 L10,10 L10,20 L4,20 Z' fill='rgba(255,255,255,0.07)'/%3E%3Cpath d='M60,4 L36,4 L36,10 L54,10 L54,28 L60,28 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M60,4 L44,4 L44,10 L54,10 L54,20 L60,20 Z' fill='rgba(255,255,255,0.07)'/%3E%3Cpath d='M4,60 L28,60 L28,54 L10,54 L10,36 L4,36 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M4,60 L20,60 L20,54 L10,54 L10,44 L4,44 Z' fill='rgba(255,255,255,0.07)'/%3E%3Cpath d='M60,60 L36,60 L36,54 L54,54 L54,36 L60,36 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M60,60 L44,60 L44,54 L54,54 L54,44 L60,44 Z' fill='rgba(255,255,255,0.07)'/%3E%3Cpolygon points='32,24 40,32 32,40 24,32' fill='none' stroke='rgba(201,139,21,0.5)' stroke-width='1.2'/%3E%3Ccircle cx='32' cy='32' r='2.5' fill='rgba(201,139,21,0.45)'/%3E%3C/svg%3E");
	background-size: 64px 64px;
}

.page-hero .container { position: relative; z-index: 1; }

.page-hero .container { position: relative; z-index: 1; }

.page-hero__label {
	font-family: var(--font-body);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-gold);
	margin-bottom: 0.6rem;
}

.page-hero__title {
	font-family: var(--font-heading);
	font-size: clamp(1.7rem, 3.5vw, 2.5rem);
	color: var(--color-white);
	margin-bottom: 0.6rem;
	line-height: 1.2;
}

.page-hero__subtitle {
	font-size: 1rem;
	color: rgba(255,255,255,0.68);
	max-width: 620px;
	line-height: 1.75;
}

/* ==========================================================================
   BREADCRUMB
   ========================================================================== */

.breadcrumb {
	background-color: var(--color-bg-light);
	padding: 0.6rem 0;
	border-bottom: 1px solid var(--color-border);
}

.breadcrumb-list { display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem; font-size: 0.78rem; }
.breadcrumb-list li { display: flex; align-items: center; gap: 0.4rem; }
.breadcrumb-list li:not(:last-child)::after { content: '›'; color: var(--color-text-light); }
.breadcrumb-list a { color: var(--color-accent); font-weight: 600; }
.breadcrumb-list li:last-child { color: var(--color-text-muted); }

/* ==========================================================================
   CONTENT + SIDEBAR
   ========================================================================== */

.content-sidebar-layout {
	display: grid;
	grid-template-columns: 1fr 300px;
	gap: 3rem;
	align-items: start;
	padding-block: 4rem;
}

.content-sidebar-layout.no-sidebar {
	grid-template-columns: 1fr;
	max-width: 820px;
	margin-inline: auto;
}

/* ==========================================================================
   FILTER BAR
   ========================================================================== */

.filter-bar {
	background-color: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 3px solid var(--color-primary);
	padding: 1rem 1.5rem;
	margin-bottom: 2rem;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: center;
}

.filter-bar__label {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: var(--color-text-muted);
	text-transform: uppercase;
	white-space: nowrap;
}

.filter-bar__tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }

.filter-tag {
	padding: 0.3rem 0.85rem;
	font-family: var(--font-body);
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	border: 1px solid var(--color-border);
	color: var(--color-text-muted);
	background-color: var(--color-white);
	cursor: pointer;
	transition: all var(--transition);
	text-decoration: none;
}

.filter-tag:hover,
.filter-tag.active,
.filter-tag[aria-pressed="true"] {
	background-color: var(--color-terracotta);
	border-color: var(--color-terracotta);
	color: var(--color-white);
	text-decoration: none;
}

/* ==========================================================================
   SEARCH BOX
   ========================================================================== */

.search-box {
	display: flex;
	border: 1px solid var(--color-border);
	overflow: hidden;
}

.search-box input[type="search"] {
	flex: 1;
	padding: 0.7rem 1.25rem;
	font-size: 0.9rem;
	border: none;
	outline: none;
	background: var(--color-white);
	color: var(--color-text);
}

.search-box button {
	padding: 0.7rem 1.25rem;
	background-color: var(--color-primary);
	color: var(--color-white);
	border: none;
	cursor: pointer;
	transition: background-color var(--transition);
	display: flex;
	align-items: center;
}

.search-box button:hover { background-color: var(--color-accent); }

/* ==========================================================================
   ARTICLE — single post
   ========================================================================== */

.article-header {
	padding-bottom: 2rem;
	border-bottom: 1px solid var(--color-border);
	margin-bottom: 2.5rem;
}

.article-title {
	font-family: var(--font-heading);
	font-size: clamp(1.6rem, 3.5vw, 2.4rem);
	color: var(--color-primary);
	line-height: 1.25;
	margin: 1rem 0;
}

.article-meta { display: flex; flex-wrap: wrap; gap: 1.5rem; font-size: 0.82rem; color: var(--color-text-muted); }
.article-meta-item { display: flex; align-items: center; gap: 0.4rem; }

.article-featured-image { margin-bottom: 2.5rem; border: 1px solid var(--color-border); }
.article-featured-image img { width: 100%; max-height: 460px; object-fit: cover; }

.entry-content {
	font-size: 1.02rem;
	line-height: 1.85;
	color: var(--color-text);
	max-width: 740px;
}

.entry-content h2, .entry-content h3, .entry-content h4 { margin-top: 2.5rem; margin-bottom: 0.75rem; }
.entry-content a { text-decoration: underline; }
.entry-content img { border: 1px solid var(--color-border); margin-block: 1.5rem; }

.entry-content table { width: 100%; border-collapse: collapse; margin-block: 1.5rem; font-size: 0.9rem; }
.entry-content th, .entry-content td { padding: 0.65rem 1rem; border: 1px solid var(--color-border); text-align: left; }
.entry-content th {
	background-color: var(--color-primary);
	color: var(--color-white);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.entry-content pre {
	background-color: var(--color-primary);
	color: rgba(255,255,255,0.9);
	padding: 1.5rem;
	overflow-x: auto;
	font-size: 0.85rem;
	line-height: 1.6;
	margin-block: 1.5rem;
}

.article-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	align-items: center;
	margin-top: 3rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--color-border);
}

.article-tags__label {
	font-size: 0.7rem;
	font-weight: 700;
	color: var(--color-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

/* ==========================================================================
   SIDEBAR
   ========================================================================== */

.sidebar { position: sticky; top: calc(var(--header-height) + 1.5rem); }

.widget {
	background-color: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 3px solid var(--color-primary);
	padding: 1.5rem;
	margin-bottom: 1.5rem;
}

.widget-title {
	font-family: var(--font-body);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-primary);
	margin-bottom: 1.25rem;
	padding-bottom: 0.65rem;
	border-bottom: 1px solid var(--color-border);
}

.widget ul li { padding: 0.5rem 0; border-bottom: 1px solid var(--color-border-light); font-size: 0.88rem; }
.widget ul li:last-child { border-bottom: none; }
.widget ul li a { color: var(--color-text); text-decoration: none; font-weight: 600; transition: color var(--transition); }
.widget ul li a:hover { color: var(--color-accent); }

/* ==========================================================================
   ABOUT SECTION
   ========================================================================== */

.about-section__content {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5rem;
	align-items: center;
}

.about-section__image {
	overflow: hidden;
	border: 1px solid var(--color-border);
	position: relative;
	min-height: 400px;
}

/* Accent border top sur l'image — signature institutionnelle */
.about-section__image::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 4px;
	background-color: var(--color-accent);
	z-index: 1;
}

.about-section__intro {
	max-width: 640px;
	margin: 1rem 0 0;
	font-size: 1.02rem;
	line-height: 1.75;
	color: var(--color-text-muted);
}

.about-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(320px, 1fr));
	gap: 1.75rem;
	margin-top: 3rem;
	align-items: stretch;
	padding: 1.75rem;
	background: rgba(244, 250, 255, 0.92);
	border-radius: 36px;
}

@media (max-width: 1080px) {
	.about-cards {
		grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	}
}

.about-card {
	display: flex;
	flex-direction: column;
	position: relative;
	border: 1px solid rgba(36, 72, 112, 0.08);
	border-radius: 32px;
	overflow: hidden;
	background: #ffffff;
	box-shadow: 0 26px 56px rgba(22, 59, 104, 0.08);
	min-height: 100%;
}

.about-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 5rem;
	height: 4px;
	background: linear-gradient(90deg, var(--color-accent), rgba(0, 130, 219, 0.25));
}

.about-card::after {
	content: '';
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 66px;
	height: 66px;
	border-radius: 20px;
	background: rgba(37, 115, 189, 0.08);
}

.about-card__icon {
	position: absolute;
	top: 1.5rem;
	right: 1.5rem;
	width: 50px;
	height: 50px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 18px;
	background: rgba(0, 122, 255, 0.12);
	color: var(--color-accent);
	flex-shrink: 0;
}

.about-card__icon svg {
	width: 1.3rem;
	height: 1.3rem;
	display: block;
}

.about-card__body {
	position: relative;
	z-index: 1;
	padding: 2.5rem 2rem;
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	flex: 1;
}

.about-card__title {
	font-size: clamp(1.4rem, 1.9vw, 1.85rem);
	margin: 0;
	line-height: 1.15;
	padding-right: 4rem;
	text-wrap: balance;
	overflow-wrap: break-word;
	hyphens: auto;
}

@media (max-width: 600px) {
	.about-card__body { padding: 2rem 1.5rem; gap: 1.25rem; }
	.about-card__title { font-size: 1.35rem; padding-right: 3.5rem; }
	.about-card__icon { width: 42px; height: 42px; top: 1.25rem; right: 1.25rem; border-radius: 14px; }
	.about-card::after { width: 56px; height: 56px; top: 0.75rem; right: 0.75rem; border-radius: 16px; }
}

.about-card__text {
	font-size: 1rem;
	line-height: 1.85;
	color: var(--color-text);
	margin: 0;
}

.about-card__text + .about-card__text {
	margin-top: 0.85rem;
}

.about-card__text strong {
	display: inline;
	font-weight: 700;
	margin-right: 0.4rem;
	color: var(--color-primary);
}

/* Dark mode — labels en gras doivent passer en clair */
:root[data-theme="dark"] .about-card__text strong { color: var(--color-text); }

.about-card:hover {
	border-color: var(--color-accent);
	box-shadow: 0 28px 70px rgba(19, 58, 92, 0.12);
}

.about-section__image img { width: 100%; height: 100%; object-fit: cover; display: block; }

.about-section__image-placeholder {
	width: 100%;
	height: 100%;
	min-height: 400px;
	background: linear-gradient(155deg, #2A0A02 0%, #5C1F0A 35%, #1B3A5C 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}

/* Losanges africains sur fond de la section about */
.about-section__image-placeholder::after {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Crect x='0.5' y='0.5' width='79' height='79' fill='none' stroke='rgba(201,139,21,0.1)' stroke-width='0.5'/%3E%3Ccircle cx='40' cy='40' r='13' fill='none' stroke='rgba(201,139,21,0.12)' stroke-width='1'/%3E%3Cline x1='40' y1='27' x2='40' y2='53' stroke='rgba(201,139,21,0.13)' stroke-width='1.5'/%3E%3Cline x1='27' y1='40' x2='53' y2='40' stroke='rgba(201,139,21,0.13)' stroke-width='1.5'/%3E%3Cpath d='M40 27L53 40 40 53 27 40Z' fill='none' stroke='rgba(201,139,21,0.09)' stroke-width='0.75'/%3E%3Cpath d='M0 12L12 12 12 0' fill='none' stroke='rgba(201,139,21,0.1)' stroke-width='1'/%3E%3Cpath d='M80 12L68 12 68 0' fill='none' stroke='rgba(201,139,21,0.1)' stroke-width='1'/%3E%3Cpath d='M0 68L12 68 12 80' fill='none' stroke='rgba(201,139,21,0.1)' stroke-width='1'/%3E%3Cpath d='M80 68L68 68 68 80' fill='none' stroke='rgba(201,139,21,0.1)' stroke-width='1'/%3E%3Ccircle cx='40' cy='0' r='2' fill='rgba(201,139,21,0.1)'/%3E%3Ccircle cx='0' cy='40' r='2' fill='rgba(201,139,21,0.1)'/%3E%3Ccircle cx='80' cy='40' r='2' fill='rgba(201,139,21,0.1)'/%3E%3Ccircle cx='40' cy='80' r='2' fill='rgba(201,139,21,0.1)'/%3E%3Ccircle cx='40' cy='40' r='2.5' fill='rgba(201,139,21,0.12)'/%3E%3C/svg%3E");
	background-size: 80px 80px;
}

.about-section__image-placeholder-inner {
	position: relative;
	z-index: 1;
	text-align: center;
	color: var(--color-white);
	border: 1px solid rgba(255,255,255,0.1);
	padding: 3rem 3.5rem;
}

.about-section__image-placeholder-inner::before {
	content: '';
	display: block;
	width: 36px;
	height: 3px;
	background: linear-gradient(to right, var(--color-terracotta), var(--color-gold));
	margin: 0 auto 1.5rem;
}

.about-section__image-stat {
	display: block;
	font-family: var(--font-heading);
	font-size: 5rem;
	font-weight: 700;
	line-height: 1;
	color: var(--color-gold);
	margin-bottom: 0.5rem;
}

.about-section__image-label {
	display: block;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: rgba(201, 139, 21, 0.85);
}

.about-section__image-sublabel {
	display: block;
	font-size: 0.78rem;
	color: rgba(255,255,255,0.4);
	margin-top: 0.4rem;
}

.about-section__pillars {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	margin-top: 2rem;
	border: 1px solid var(--color-border);
}

.pillar-item {
	display: flex;
	gap: 0.85rem;
	align-items: flex-start;
	padding: 1rem 1.1rem;
	border-right: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
}

.pillar-item:nth-child(2n) { border-right: none; }
.pillar-item:nth-last-child(-n+2) { border-bottom: none; }

.pillar-item__icon {
	flex-shrink: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	margin-top: 0.4rem;
}

.pillar-item:nth-child(4n+1) .pillar-item__icon { background-color: var(--color-terracotta); }
.pillar-item:nth-child(4n+2) .pillar-item__icon { background-color: var(--color-gold); }
.pillar-item:nth-child(4n+3) .pillar-item__icon { background-color: var(--color-green-africa); }
.pillar-item:nth-child(4n+4) .pillar-item__icon { background-color: var(--color-accent); }

.pillar-item__title {
	font-size: 0.78rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--color-primary);
	margin-bottom: 0.2rem;
}

.pillar-item__text { font-size: 0.82rem; color: var(--color-text-muted); line-height: 1.5; }

/* ==========================================================================
   NEWSLETTER — deux colonnes, style rapport annuel
   ========================================================================== */

.newsletter-section {
	background: linear-gradient(135deg, #3D1505 0%, #5C2210 40%, #1B3A5C 100%);
	padding-block: 5rem;
	border-top: 5px solid var(--color-gold);
	position: relative;
	overflow: hidden;
}

/* Motif Adinkra/Bogolan sur fond newsletter */
.newsletter-section::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Crect x='0.5' y='0.5' width='79' height='79' fill='none' stroke='rgba(255,255,255,0.04)' stroke-width='0.5'/%3E%3Ccircle cx='40' cy='40' r='13' fill='none' stroke='rgba(255,255,255,0.055)' stroke-width='1'/%3E%3Cline x1='40' y1='27' x2='40' y2='53' stroke='rgba(255,255,255,0.065)' stroke-width='1.5'/%3E%3Cline x1='27' y1='40' x2='53' y2='40' stroke='rgba(255,255,255,0.065)' stroke-width='1.5'/%3E%3Cpath d='M40 27L53 40 40 53 27 40Z' fill='none' stroke='rgba(255,255,255,0.04)' stroke-width='0.75'/%3E%3Cpath d='M0 12L12 12 12 0' fill='none' stroke='rgba(255,255,255,0.05)' stroke-width='1'/%3E%3Cpath d='M80 12L68 12 68 0' fill='none' stroke='rgba(255,255,255,0.05)' stroke-width='1'/%3E%3Cpath d='M0 68L12 68 12 80' fill='none' stroke='rgba(255,255,255,0.05)' stroke-width='1'/%3E%3Cpath d='M80 68L68 68 68 80' fill='none' stroke='rgba(255,255,255,0.05)' stroke-width='1'/%3E%3Ccircle cx='40' cy='0' r='2' fill='rgba(255,255,255,0.05)'/%3E%3Ccircle cx='0' cy='40' r='2' fill='rgba(255,255,255,0.05)'/%3E%3Ccircle cx='80' cy='40' r='2' fill='rgba(255,255,255,0.05)'/%3E%3Ccircle cx='40' cy='80' r='2' fill='rgba(255,255,255,0.05)'/%3E%3Ccircle cx='40' cy='40' r='2.5' fill='rgba(255,255,255,0.05)'/%3E%3C/svg%3E");
	background-size: 80px 80px;
	pointer-events: none;
}

.newsletter-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5rem;
	align-items: center;
	position: relative;
	z-index: 1;
}

.newsletter-copy .section__label { color: var(--color-gold); }

.newsletter-copy .section__title {
	color: var(--color-white);
	font-size: clamp(1.4rem, 2.5vw, 2rem);
}

.newsletter-copy .section__title::after { background: linear-gradient(to right, var(--color-gold), var(--color-terracotta)); }

.newsletter-copy p {
	color: rgba(255,255,255,0.6);
	font-size: 0.95rem;
	line-height: 1.8;
	margin-top: 1.25rem;
}

.newsletter-form {
	display: flex;
	border: 1px solid rgba(255,255,255,0.2);
}

.newsletter-form input[type="email"] {
	flex: 1;
	padding: 0.85rem 1.25rem;
	font-family: var(--font-body);
	font-size: 0.9rem;
	border: none;
	background-color: rgba(255,255,255,0.07);
	color: var(--color-white);
	outline: none;
}

.newsletter-form input[type="email"]::placeholder { color: rgba(255,255,255,0.35); }
.newsletter-form input[type="email"]:focus { background-color: rgba(255,255,255,0.12); }

.newsletter-form button {
	background-color: var(--color-terracotta);
	color: var(--color-white);
	border: none;
	padding: 0.85rem 1.5rem;
	font-family: var(--font-body);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color var(--transition);
	white-space: nowrap;
}

.newsletter-form button:hover { background-color: #a33e25; }

/* ==========================================================================
   ANALYTICS
   ========================================================================== */

.analytics-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 1.5rem;
	margin-bottom: 3rem;
}

.stat-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 3px solid var(--color-primary);
	padding: 1.75rem;
	text-align: center;
}

.stat-card__value {
	font-family: var(--font-heading);
	font-size: 2.4rem;
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1;
	margin-bottom: 0.5rem;
}

.stat-card__label {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

.chart-placeholder {
	background: var(--color-bg-light);
	border: 1px dashed var(--color-border);
	padding: 4rem 2rem;
	text-align: center;
	color: var(--color-text-muted);
}

.chart-placeholder__icon { font-size: 2.5rem; margin-bottom: 1rem; opacity: 0.3; }

/* ==========================================================================
   DATA HUB
   ========================================================================== */

.dataset-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-left: 4px solid var(--color-primary);
	padding: 1.5rem;
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	transition: border-left-color var(--transition), box-shadow var(--transition);
}

.dataset-card:hover { border-left-color: var(--color-accent); box-shadow: var(--shadow-hover); }

.dataset-card__icon {
	flex-shrink: 0;
	width: 44px; height: 44px;
	background-color: var(--color-primary);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.3rem;
}

.dataset-card__title { font-family: var(--font-heading); font-size: 1rem; font-weight: 700; color: var(--color-primary); margin-bottom: 0.4rem; }
.dataset-card__desc { font-size: 0.87rem; color: var(--color-text-muted); line-height: 1.55; margin-bottom: 0.75rem; }

/* ==========================================================================
   EVENTS
   ========================================================================== */

/* ==========================================================================
   EVENTS — page complète
   ========================================================================== */

/* Événement vedette — prochain événement mis en avant */
.event-featured {
	display: grid;
	grid-template-columns: 1fr 1fr;
	border: 1px solid var(--color-border);
	border-top: 5px solid var(--color-terracotta);
	margin-bottom: 3.5rem;
	background: var(--color-white);
}

.event-featured__date-panel {
	background: linear-gradient(155deg, #2A0A02 0%, #5C1F0A 50%, #1B3A5C 100%);
	color: var(--color-white);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 3rem 2rem;
	text-align: center;
	position: relative;
}

/* Petit label "Next Event" en haut */
.event-featured__badge {
	position: absolute;
	top: 1.25rem;
	left: 50%;
	transform: translateX(-50%);
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-gold);
	white-space: nowrap;
}

.event-featured__day {
	font-family: var(--font-heading);
	font-size: 5rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: -0.04em;
}

.event-featured__month {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.55);
	margin-top: 0.4rem;
}

.event-featured__year {
	font-size: 0.72rem;
	color: rgba(255,255,255,0.3);
	margin-top: 0.2rem;
	letter-spacing: 0.12em;
}

.event-featured__body {
	padding: 2.5rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.event-featured__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-bottom: 1rem;
}

.event-featured__title {
	font-family: var(--font-heading);
	font-size: clamp(1.2rem, 2vw, 1.5rem);
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1.3;
	margin-bottom: 1rem;
}

.event-featured__title a { color: inherit; text-decoration: none; }
.event-featured__title a:hover { color: var(--color-accent); }

.event-featured__meta {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin-bottom: 1.5rem;
}

.event-featured__meta-item {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.85rem;
	color: var(--color-text-muted);
}

.event-featured__meta-icon {
	width: 16px;
	text-align: center;
	flex-shrink: 0;
	color: var(--color-accent);
}

.event-featured__actions {
	display: flex;
	gap: 0.75rem;
	flex-wrap: wrap;
}

/* Timeline heading */
.events-timeline { margin-bottom: 3rem; }

.events-timeline__heading {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	font-family: var(--font-body);
	font-size: 0.7rem;
	font-weight: 700;
	color: var(--color-primary);
	text-transform: uppercase;
	letter-spacing: 0.16em;
	margin-bottom: 1rem;
	padding-bottom: 0.65rem;
	border-bottom: 2px solid var(--color-primary);
}

/* Dot — pseudo-élément, plus d'inline style */
.events-timeline__heading::before {
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--color-accent);
	flex-shrink: 0;
}

.events-timeline__heading--past { color: var(--color-text-muted); border-bottom-color: var(--color-border); }
.events-timeline__heading--past::before { background: var(--color-text-light); }

/* Event row */
.event-row {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-left: 4px solid var(--color-primary);
	padding: 1.25rem 1.5rem;
	margin-bottom: 0.5rem;
	display: grid;
	grid-template-columns: 72px 1fr auto;
	gap: 1.5rem;
	align-items: center;
	transition: border-left-color var(--transition), box-shadow var(--transition);
}

.event-row:hover {
	border-left-color: var(--color-accent);
	box-shadow: var(--shadow-card);
}

.event-row--past {
	border-left-color: var(--color-border);
	background: var(--color-bg-light);
}

.event-row--past:hover { border-left-color: var(--color-text-light); box-shadow: none; }

.event-row__date {
	text-align: center;
	background: var(--color-primary);
	color: var(--color-white);
	padding: 0.65rem 0.4rem;
	flex-shrink: 0;
}

.event-row--past .event-row__date {
	background: var(--color-text-light);
	opacity: 0.7;
}

.event-row__date-day { font-family: var(--font-heading); font-size: 1.6rem; font-weight: 700; line-height: 1; }
.event-row__date-month { font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.1em; opacity: 0.65; margin-top: 0.2rem; display: block; }

.event-row__body { min-width: 0; }

.event-row__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-bottom: 0.4rem;
}

.event-row__title {
	font-family: var(--font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-primary);
	margin-bottom: 0.35rem;
	line-height: 1.35;
}

.event-row__title a { color: inherit; text-decoration: none; }
.event-row__title a:hover { color: var(--color-accent); }

.event-row--past .event-row__title { color: var(--color-text-muted); }
.event-row--past .event-row__title a:hover { color: var(--color-primary); }

.event-row__details {
	font-size: 0.81rem;
	color: var(--color-text-muted);
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 1.25rem;
}

.event-row__action { align-self: center; white-space: nowrap; flex-shrink: 0; }

/* Tag muted — événements passés */
.tag--muted {
	background-color: rgba(0,0,0,0.05);
	color: var(--color-text-muted);
	border: 1px solid transparent;
}

/* Governance */
.gov-subsection { margin-top: 2.5rem; }
.gov-subsection + .gov-subsection { margin-top: 3rem; }

.gov-subsection__title {
	font-family: var(--font-heading);
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--color-primary);
	letter-spacing: -0.01em;
	margin-bottom: 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid var(--color-accent);
	display: inline-block;
}

.gov-subsection .gov-grid { margin-top: 0; }

.gov-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 1px;
	background: var(--color-border);
	border: 1px solid var(--color-border);
	margin-top: 2.5rem;
}

.gov-card {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1.1rem 1.25rem;
	background: var(--color-white);
	transition: background var(--transition);
}

.gov-card:hover { background: var(--color-bg-warm); }

.gov-card__photo { flex-shrink: 0; }

.gov-card__img {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	border: 2px solid var(--color-bg-light);
}

.gov-card__initials {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-terracotta) 100%);
	color: rgba(255,255,255,0.9);
	font-size: 1rem;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.gov-card__info {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	min-width: 0;
}

.gov-card__role {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-terracotta);
}

.gov-card__name {
	font-size: 0.92rem;
	font-weight: 700;
	color: var(--color-primary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gov-card__name a { color: inherit; text-decoration: none; }
.gov-card__name a:hover { color: var(--color-terracotta); text-decoration: underline; }

/* Dark mode — gov-card body stays white; force name to navy for contrast */
:root[data-theme="dark"] .gov-card__name,
:root[data-theme="dark"] .gov-card__name a { color: var(--color-primary) !important; }
:root[data-theme="dark"] .gov-card__name a:hover { color: var(--color-terracotta) !important; }
:root[data-theme="dark"] .gov-card:hover { background: #F4F1EA !important; }

.gov-card__institution {
	font-size: 0.78rem;
	color: var(--color-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gov-card__country {
	font-size: 0.74rem;
	color: var(--color-text-light);
}

.gov-card__linkedin {
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--color-accent);
	text-decoration: none;
	letter-spacing: 0.04em;
}

.gov-card__linkedin:hover { text-decoration: underline; }

@media (max-width: 640px) {
	.gov-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   PAGINATION
   ========================================================================== */

.pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.25rem;
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid var(--color-border);
}

.pagination .page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 36px; height: 36px;
	padding: 0 0.65rem;
	font-family: var(--font-body);
	font-size: 0.8rem;
	font-weight: 700;
	color: var(--color-text-muted);
	background-color: var(--color-white);
	border: 1px solid var(--color-border);
	text-decoration: none;
	transition: all var(--transition);
}

.pagination .page-numbers:hover,
.pagination .page-numbers.current {
	background-color: var(--color-primary);
	border-color: var(--color-primary);
	color: var(--color-white);
}

/* ==========================================================================
   404
   ========================================================================== */

.error-page {
	min-height: 60vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 5rem 1.5rem;
}

.error-page__code {
	font-family: var(--font-heading);
	font-size: clamp(5rem, 15vw, 10rem);
	font-weight: 700;
	color: var(--color-primary);
	opacity: 0.07;
	line-height: 1;
	margin-bottom: -2rem;
}

.error-page__title { font-family: var(--font-heading); font-size: 1.75rem; color: var(--color-primary); margin-bottom: 1rem; position: relative; z-index: 1; }
.error-page__text { color: var(--color-text-muted); max-width: 480px; margin-bottom: 2rem; }

/* ==========================================================================
   FOOTER — sobre, foncé, 4 colonnes
   ========================================================================== */

.site-footer {
	background-color: var(--color-footer-bg);
	color: rgba(255,255,255,0.65);
	border-top: none;
	position: relative;
}

/* Bande kente en haut du footer */
.site-footer::before {
	content: '';
	display: block;
	height: 5px;
	background: linear-gradient(
		to right,
		var(--color-terracotta) 0%, var(--color-terracotta) 33.33%,
		var(--color-gold)       33.33%, var(--color-gold)       66.66%,
		var(--color-green-africa) 66.66%, var(--color-green-africa) 100%
	);
}

.footer-main {
	padding-block: 4rem;
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1.5fr;
	gap: 3rem;
}

.footer-brand .site-logo-footer { display: flex; align-items: center; gap: 0.65rem; margin-bottom: 1.5rem; }
.des-logo-footer-img {
	display: block;
	height: 80px;
	width: auto;
	max-width: 360px;
	object-fit: contain;
	opacity: 0.95;
	transition: opacity var(--transition);
}
.site-logo-footer a:hover .des-logo-footer-img { opacity: 1; }
@media (max-width: 600px) {
	.des-logo-footer-img { height: 64px; max-width: 280px; }
}
.footer-brand .logo-abbr { font-family: var(--font-heading); font-size: 1.65rem; font-weight: 700; color: var(--color-white); letter-spacing: -0.02em; }
.footer-brand .logo-separator { display: block; width: 1px; height: 28px; background-color: rgba(255,255,255,0.15); flex-shrink: 0; }
.footer-brand .logo-full { font-size: 0.6rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.35); max-width: 100px; line-height: 1.45; }
.footer-brand img,
.footer-brand .des-logo-footer-img { height: 80px; width: auto; max-width: 360px; }
@media (max-width: 600px) {
	.footer-brand img,
	.footer-brand .des-logo-footer-img { height: 64px; max-width: 280px; }
}
.footer-brand p { font-size: 0.87rem; line-height: 1.7; color: rgba(255,255,255,0.5); margin-bottom: 1.5rem; }

.footer-social { display: flex; gap: 0.4rem; }

.footer-social a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px; height: 32px;
	background-color: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.1);
	color: rgba(255,255,255,0.5);
	text-decoration: none;
	transition: background-color var(--transition), color var(--transition), border-color var(--transition);
}

.footer-social a:hover {
	background-color: var(--color-accent);
	border-color: var(--color-accent);
	color: var(--color-white);
}

.footer-col__title {
	font-family: var(--font-body);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-white);
	margin-bottom: 1.25rem;
	padding-bottom: 0.65rem;
	border-bottom: 1px solid rgba(255,255,255,0.1);
}

.footer-nav { 
	display: flex; 
	flex-direction: column; 
	gap: 0.35rem; 
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-nav li {
	display: block;
	width: 100%;
}

.footer-nav ul {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-nav a {
	font-size: 0.87rem;
	color: rgba(255,255,255,0.5);
	text-decoration: none;
	padding: 0.2rem 0;
	border-left: 2px solid transparent;
	transition: color var(--transition), border-left-color var(--transition), padding-left var(--transition);
}

.footer-nav a:hover { color: var(--color-white); border-left-color: var(--color-accent); padding-left: 0.5rem; }

.footer-contact { display: flex; flex-direction: column; gap: 0.75rem; }

.footer-contact-item { display: flex; align-items: flex-start; gap: 0.6rem; font-size: 0.85rem; color: rgba(255,255,255,0.5); }
.footer-contact-item__icon { flex-shrink: 0; margin-top: 0.15rem; color: var(--color-accent); }

/* Footer Contact CTA — matches site .btn system */
.footer-contact-cta,
.footer-privacy-cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	width: 100%;
	max-width: 220px;
	white-space: nowrap;
}
.footer-contact-cta svg,
.footer-privacy-cta svg { flex-shrink: 0; }

/* Newsletter feedback message */
.newsletter-msg {
	margin: 0.6rem 0 0;
	font-size: 0.8rem;
	line-height: 1.45;
	color: rgba(255,255,255,0.7);
}
.newsletter-msg[data-kind="success"] { color: #6ee7b7; }
.newsletter-msg[data-kind="error"]   { color: #fca5a5; }

/* Pestel — floating access button on the homepage */
.pestel-fab {
	position: fixed;
	right: 1.5rem;
	bottom: 1.5rem;
	z-index: 1200;
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	padding: 0.7rem 1.1rem 0.7rem 0.75rem;
	background: linear-gradient(135deg, #0099E6 0%, #0077C2 100%);
	color: #fff;
	border-radius: 999px;
	text-decoration: none !important;
	font-family: var(--font-body);
	font-weight: 600;
	letter-spacing: 0.01em;
	box-shadow:
		0 10px 28px rgba(0, 153, 230, 0.38),
		0 2px 6px rgba(0, 0, 0, 0.14),
		inset 0 1px 0 rgba(255, 255, 255, 0.24);
	transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.25s ease;
	overflow: visible;
	isolation: isolate;
}
.pestel-fab:hover,
.pestel-fab:focus-visible {
	color: #fff;
	transform: translateY(-3px);
	box-shadow:
		0 16px 40px rgba(0, 153, 230, 0.5),
		0 3px 8px rgba(0, 0, 0, 0.18),
		inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.pestel-fab__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.16);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
	color: #fff;
	flex-shrink: 0;
	position: relative;
	z-index: 1;
}
.pestel-fab__body {
	display: flex;
	flex-direction: column;
	line-height: 1.15;
	position: relative;
	z-index: 1;
}
.pestel-fab__eyebrow {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	opacity: 0.75;
	text-transform: uppercase;
}
.pestel-fab__label {
	font-size: 0.92rem;
	font-weight: 700;
}

/* Attention pulse */
.pestel-fab__pulse {
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: rgba(0, 153, 230, 0.55);
	z-index: 0;
	animation: pestel-fab-pulse 2.4s cubic-bezier(0.2, 0.8, 0.2, 1) infinite;
	pointer-events: none;
}
@keyframes pestel-fab-pulse {
	0%   { transform: scale(1);   opacity: 0.55; }
	70%  { transform: scale(1.18); opacity: 0;    }
	100% { transform: scale(1.18); opacity: 0;    }
}
@media (prefers-reduced-motion: reduce) {
	.pestel-fab__pulse { animation: none; }
	.pestel-fab { transition: none; }
}
@media (max-width: 640px) {
	.pestel-fab {
		right: 1rem;
		bottom: 1rem;
		padding: 0.55rem 0.85rem 0.55rem 0.55rem;
	}
	.pestel-fab__icon { width: 32px; height: 32px; }
	.pestel-fab__eyebrow { font-size: 0.6rem; }
	.pestel-fab__label   { font-size: 0.85rem; }
}
:root[data-theme="dark"] .pestel-fab {
	box-shadow:
		0 12px 32px rgba(0, 153, 230, 0.42),
		0 3px 8px rgba(0, 0, 0, 0.4),
		inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

/* ==========================================================================
   OPPORTUNITIES — job listings
   ========================================================================== */

.jobs-page { padding-block: 2.5rem 4rem; }

.jobs-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	background: var(--color-bg-light);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius-sm);
	padding: 0.9rem 1rem;
	margin-bottom: 1.25rem;
}
.jobs-filters__group {
	flex: 1 1 auto;
	min-width: 180px;
}
.jobs-filters input[type="search"],
.jobs-filters select {
	width: 100%;
	padding: 0.55rem 0.85rem;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: 0.9rem;
}
.jobs-filters__clear {
	font-size: 0.85rem;
	color: var(--color-text-muted);
	text-decoration: underline;
}

.jobs-count {
	font-size: 0.85rem;
	color: var(--color-text-muted);
	margin-bottom: 1.25rem;
	letter-spacing: 0.02em;
}

.jobs-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: 1.5rem;
	margin-bottom: 2.5rem;
}
@media (max-width: 640px) {
	.jobs-grid { grid-template-columns: 1fr; }
}

.job-card {
	background: var(--color-white);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius);
	padding: 1.4rem 1.5rem 1.25rem;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
	position: relative;
	overflow: hidden;
}
.job-card::before {
	content: '';
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 3px;
	background: var(--color-accent);
	opacity: 0.85;
}
.job-card[data-status="closed"] { opacity: 0.62; }
.job-card[data-status="closed"]::before { background: var(--color-border); opacity: 0.5; }
.job-card[data-status="closing"]::before { background: #E67E22; }

.job-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 32px rgba(12, 21, 35, 0.08);
	border-color: rgba(0, 153, 230, 0.28);
}

.job-card__header {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}
.job-card__badge {
	display: inline-flex;
	align-items: center;
	padding: 3px 10px;
	border-radius: 999px;
	background: rgba(0, 153, 230, 0.12);
	color: var(--color-accent);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.job-card__badge--thematic {
	background: rgba(212, 166, 74, 0.15);
	color: #a37d24;
}

.job-card__title {
	font-family: var(--font-heading);
	font-size: 1.18rem;
	font-weight: 700;
	line-height: 1.3;
	margin: 0;
}
.job-card__title a {
	color: var(--color-primary);
	text-decoration: none;
	transition: color var(--transition);
}
.job-card__title a:hover { color: var(--color-accent); }

.job-card__org { margin: 0; font-size: 0.9rem; color: var(--color-text-muted); }
.job-card__org-name { font-weight: 600; color: var(--color-primary); }

.job-card__meta {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}
.job-card__meta-item {
	display: flex;
	align-items: center;
	gap: 0.45rem;
	font-size: 0.85rem;
	color: var(--color-text);
}
.job-card__meta-item svg {
	color: var(--color-text-muted);
	flex-shrink: 0;
}

.job-card__footer {
	margin-top: auto;
	padding-top: 0.6rem;
	border-top: 1px dashed var(--color-border-light);
}
.job-card__link {
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--color-accent);
	text-decoration: none;
}
.job-card__link:hover { color: var(--color-accent-dark); }

/* Dark mode — card body stays white, ensure text stays legible */
:root[data-theme="dark"] .job-card { background: var(--color-white); }
:root[data-theme="dark"] .job-card__title a { color: var(--color-primary) !important; }
:root[data-theme="dark"] .job-card__title a:hover { color: var(--color-accent) !important; }
:root[data-theme="dark"] .job-card__org-name { color: var(--color-primary); }
:root[data-theme="dark"] .job-card__meta-item { color: var(--color-primary); }

/* ── Single opportunity ── */
.job-single { padding-block: 2rem 4rem; }
.job-single__hero {
	max-width: 780px;
	margin: 0 auto 2rem;
	padding-bottom: 1.75rem;
	border-bottom: 1px solid var(--color-border-light);
}
.job-single__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-bottom: 1rem;
}
.job-single__title {
	font-family: var(--font-heading);
	font-size: clamp(1.7rem, 2.4vw, 2.15rem);
	line-height: 1.2;
	color: var(--color-primary);
	margin: 0 0 0.5rem;
}
.job-single__org {
	font-size: 1.05rem;
	color: var(--color-text-muted);
	margin: 0 0 1.25rem;
}
.job-single__meta {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 0.85rem 1.25rem;
	margin: 0 0 1.75rem;
}
.job-single__meta-item {
	background: var(--color-bg-light);
	padding: 0.7rem 0.85rem;
	border-radius: var(--border-radius-sm);
	border-left: 3px solid var(--color-accent);
}
.job-single__meta-item dt {
	font-size: 0.7rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	font-weight: 700;
	margin-bottom: 0.2rem;
}
.job-single__meta-item dd {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--color-primary);
}
.job-single__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 0.75rem;
}
.job-single__closed {
	background: rgba(139, 149, 161, 0.12);
	padding: 0.9rem 1.1rem;
	border-radius: var(--border-radius-sm);
	color: var(--color-text-muted);
	font-style: italic;
}
.job-single__body {
	max-width: 780px;
	margin: 0 auto;
	font-size: 1rem;
	line-height: 1.75;
	color: var(--color-text);
}
.job-single__footer {
	max-width: 780px;
	margin: 2.5rem auto 0;
	padding-top: 1.5rem;
	border-top: 1px solid var(--color-border-light);
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}

/* Contact page — grid of cards */
.contact-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1.25rem;
	max-width: 1040px;
	margin-inline: auto;
}
.contact-card {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.5rem 1.5rem;
	background: var(--color-white);
	border: 1px solid rgba(12, 21, 35, 0.08);
	border-radius: var(--border-radius);
	color: var(--color-primary);
	text-decoration: none;
	box-shadow: 0 2px 8px rgba(12, 21, 35, 0.04);
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
	position: relative;
	overflow: hidden;
}
.contact-card::before {
	content: "";
	position: absolute;
	left: 0; top: 0; bottom: 0;
	width: 3px;
	background: var(--color-accent);
	opacity: 0;
	transition: opacity 0.25s ease;
}
.contact-card:hover,
.contact-card:focus-visible {
	transform: translateY(-3px);
	box-shadow: 0 14px 36px rgba(12, 21, 35, 0.10);
	border-color: rgba(0, 153, 230, 0.32);
	color: var(--color-primary);
}
.contact-card:hover::before,
.contact-card:focus-visible::before { opacity: 1; }
.contact-card__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: rgba(0, 153, 230, 0.10);
	color: var(--color-accent);
}
.contact-card__body {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	flex: 1;
	min-width: 0;
}
.contact-card__label {
	font-family: var(--font-body);
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--color-text-muted);
}
.contact-card__value {
	font-family: var(--font-heading);
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--color-primary);
	word-break: break-word;
}
.contact-card__value-sm {
	font-size: 0.9rem;
	color: var(--color-primary);
	line-height: 1.45;
}
.contact-card__hint {
	margin-top: 0.2rem;
	font-size: 0.78rem;
	font-style: italic;
	color: var(--color-text-muted);
}
.contact-card__arrow {
	align-self: center;
	color: var(--color-accent);
	font-size: 1.4rem;
	transition: transform 0.25s ease;
}
.contact-card:hover .contact-card__arrow,
.contact-card:focus-visible .contact-card__arrow {
	transform: translateX(4px);
}
.contact-card--primary {
	grid-column: 1 / -1;
	background: linear-gradient(135deg, #0C1523 0%, #1B3A5C 100%);
	border-color: transparent;
	color: var(--color-white);
}
.contact-card--primary::before { background: var(--color-accent); opacity: 1; }
.contact-card--primary .contact-card__icon {
	background: rgba(255,255,255,0.10);
	color: var(--color-white);
}
.contact-card--primary .contact-card__label { color: rgba(255,255,255,0.65); }
.contact-card--primary .contact-card__value { color: var(--color-white); font-size: 1.4rem; }
.contact-card--primary .contact-card__hint { color: rgba(255,255,255,0.55); }
.contact-card--primary .contact-card__arrow { color: var(--color-white); }
.contact-card--primary:hover,
.contact-card--primary:focus-visible { color: var(--color-white); }
.contact-card--static { cursor: default; }
.contact-card--static:hover,
.contact-card--static:focus-visible {
	transform: none;
	box-shadow: 0 2px 8px rgba(12, 21, 35, 0.04);
	border-color: rgba(12, 21, 35, 0.08);
}
.contact-card--static:hover::before { opacity: 0; }

.contact-social {
	margin: 3rem auto 0;
	max-width: 1040px;
	text-align: center;
}
.contact-social__label {
	font-family: var(--font-body);
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: var(--color-text-muted);
	margin-bottom: 1rem;
}
.contact-social__row {
	display: inline-flex;
	gap: 0.6rem;
}
.contact-social__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--color-white);
	border: 1px solid rgba(12, 21, 35, 0.10);
	color: var(--color-primary);
	transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.contact-social__btn:hover,
.contact-social__btn:focus-visible {
	background: var(--color-accent);
	border-color: var(--color-accent);
	color: var(--color-white);
	transform: translateY(-2px);
}

@media (max-width: 640px) {
	.contact-card { padding: 1.25rem; }
	.contact-card--primary .contact-card__value { font-size: 1.15rem; }
}

.footer-newsletter-form { margin-top: 0.75rem; }

.footer-newsletter-form input[type="email"] {
	width: 100%;
	padding: 0.65rem 1rem;
	background: rgba(255,255,255,0.06);
	border: 1px solid rgba(255,255,255,0.12);
	color: var(--color-white);
	font-family: var(--font-body);
	font-size: 0.87rem;
	outline: none;
	transition: border-color var(--transition);
	margin-bottom: 0.5rem;
}

.footer-newsletter-form input[type="email"]::placeholder { color: rgba(255,255,255,0.28); }
.footer-newsletter-form input[type="email"]:focus { border-color: var(--color-accent); }

.footer-newsletter-form button {
	width: 100%;
	padding: 0.65rem;
	background-color: var(--color-accent);
	color: var(--color-white);
	border: none;
	font-family: var(--font-body);
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color var(--transition);
}

.footer-newsletter-form button:hover { background-color: var(--color-accent-dark); }

.footer-bottom { background-color: rgba(0,0,0,0.22); padding-block: 1rem; border-top: 1px solid rgba(255,255,255,0.05); }

.footer-bottom-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.75rem;
	font-size: 0.76rem;
	color: rgba(255,255,255,0.3);
}

.footer-bottom a { color: rgba(255,255,255,0.4); text-decoration: none; }
.footer-bottom a:hover { color: var(--color-white); }

/* ==========================================================================
   Misc
   ========================================================================== */

.section-view-all {
	text-align: center;
	margin-top: 2.5rem;
	padding-top: 2rem;
	border-top: 1px solid var(--color-border);
}

/* Spacing helper for section grids */
.section-grid { margin-top: 2.5rem; }

/* Empty state */
.empty-state {
	text-align: center;
	padding: 3rem;
	color: var(--color-text-muted);
	border: 1px dashed var(--color-border);
}

/* About section CTA */
.about-section__cta { margin-top: 2rem; }

/* Archive controls — search + filter stacked */
.pub-archive-controls { display: flex; flex-direction: column; gap: 1.25rem; margin-bottom: 2.5rem; }
.pub-archive-controls__search { max-width: 480px; }

/* Archive count line */
.archive-count {
	font-size: 0.85rem;
	color: var(--color-text-muted);
	margin-bottom: 1.5rem;
}

/* Card footer meta (pages + pdf) */
.card__footer-meta { display: flex; align-items: center; gap: 0.5rem; }
.card__pages { font-size: 0.8rem; color: var(--color-text-light); }

/* Card byline */
.card__byline { font-size: 0.82rem; color: var(--color-text-light); }


/* Fellows join section */
.fellows-join {
	max-width: 600px;
	margin-inline: auto;
	text-align: center;
}

.fellows-join p {
	color: var(--color-text-muted);
	margin-bottom: 2rem;
}

/* ==========================================================================
   Search panel
   ========================================================================== */

.header-search-panel {
	background: var(--color-bg-light);
	border-top: 1px solid var(--color-border);
	padding: 1rem 0;
}

.header-search-panel .search-box { max-width: 600px; }

/* ==========================================================================
   PUBLICATIONS — Magazine editorial layout
   ========================================================================== */

/* ─── Pub section wrapper ─── */
.pub-section { /* inherits .section padding */ }

/* ─── Showcase grid: featured (left big) + stack (right) ─── */
.pub-showcase {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 2.5rem;
	align-items: start;
}

/* ─── Featured publication ─── */
.pub-showcase__featured {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--color-border);
	transition: box-shadow var(--transition);
}

.pub-showcase__featured:hover {
	box-shadow: 0 8px 40px rgba(27,58,92,0.14);
}

/* Image zone */
.pub-feature-img {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.pub-feature-img__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.6s ease;
}

.pub-showcase__featured:hover .pub-feature-img__img { transform: scale(1.04); }

.pub-feature-img__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(11,28,52,0.72) 0%, transparent 55%);
}

.pub-feature-img__badge {
	position: absolute;
	top: 1rem;
	left: 1rem;
}

.pub-feature-img__badge span {
	display: inline-block;
	padding: 0.3rem 0.75rem;
	background: var(--color-gold);
	color: var(--color-primary);
	font-size: 0.6rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

/* Placeholder if no image */
.pub-feature-placeholder {
	position: relative;
	aspect-ratio: 16 / 9;
	background: linear-gradient(135deg, #2A0A02 0%, #5C1F0A 45%, #1B3A5C 100%);
	overflow: hidden;
}

.pub-feature-placeholder__inner {
	position: absolute;
	inset: 0;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Crect x='0.5' y='0.5' width='79' height='79' fill='none' stroke='rgba(201,139,21,0.09)' stroke-width='0.5'/%3E%3Ccircle cx='40' cy='40' r='13' fill='none' stroke='rgba(201,139,21,0.11)' stroke-width='1'/%3E%3Cline x1='40' y1='27' x2='40' y2='53' stroke='rgba(201,139,21,0.12)' stroke-width='1.5'/%3E%3Cline x1='27' y1='40' x2='53' y2='40' stroke='rgba(201,139,21,0.12)' stroke-width='1.5'/%3E%3Cpath d='M40 27L53 40 40 53 27 40Z' fill='none' stroke='rgba(201,139,21,0.08)' stroke-width='0.75'/%3E%3Cpath d='M0 12L12 12 12 0' fill='none' stroke='rgba(201,139,21,0.09)' stroke-width='1'/%3E%3Cpath d='M80 12L68 12 68 0' fill='none' stroke='rgba(201,139,21,0.09)' stroke-width='1'/%3E%3Cpath d='M0 68L12 68 12 80' fill='none' stroke='rgba(201,139,21,0.09)' stroke-width='1'/%3E%3Cpath d='M80 68L68 68 68 80' fill='none' stroke='rgba(201,139,21,0.09)' stroke-width='1'/%3E%3Ccircle cx='40' cy='0' r='2' fill='rgba(201,139,21,0.09)'/%3E%3Ccircle cx='0' cy='40' r='2' fill='rgba(201,139,21,0.09)'/%3E%3Ccircle cx='80' cy='40' r='2' fill='rgba(201,139,21,0.09)'/%3E%3Ccircle cx='40' cy='80' r='2' fill='rgba(201,139,21,0.09)'/%3E%3Ccircle cx='40' cy='40' r='2.5' fill='rgba(201,139,21,0.11)'/%3E%3C/svg%3E");
}

/* Body */
.pub-feature-body {
	padding: 2rem;
	border-top: 4px solid var(--color-terracotta);
	background: var(--color-white);
	flex: 1;
}

.pub-feature-body__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
}

.pub-feature-body__date {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-light);
}

.pub-feature-body__title {
	font-family: var(--font-heading);
	font-size: clamp(1.2rem, 2.2vw, 1.55rem);
	font-weight: 700;
	line-height: 1.3;
	color: var(--color-primary);
	margin-bottom: 0.85rem;
}

.pub-feature-body__title a {
	color: inherit;
	text-decoration: none;
}

.pub-feature-body__title a:hover { color: var(--color-terracotta); text-decoration: none; }

.pub-feature-body__authors {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.83rem;
	font-style: italic;
	color: var(--color-text-muted);
	margin-bottom: 0.85rem;
}

.pub-feature-body__authors svg { flex-shrink: 0; color: var(--color-terracotta); }

.pub-feature-body__excerpt {
	font-size: 0.92rem;
	line-height: 1.75;
	color: var(--color-text-muted);
	margin-bottom: 1.25rem;
}

.pub-feature-body__meta-row {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
	margin-bottom: 1.5rem;
}

.pub-feature-body__meta-chip {
	display: inline-block;
	padding: 0.2rem 0.6rem;
	background: var(--color-bg-light);
	border: 1px solid var(--color-border);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

.pub-feature-body__actions {
	display: flex;
	gap: 0.75rem;
	align-items: center;
	padding-top: 1.25rem;
	border-top: 1px solid var(--color-border-light);
}

/* ─── Stack of secondary pubs ─── */
.pub-showcase__stack {
	display: flex;
	flex-direction: column;
	gap: 1.75rem;
}

.pub-strip {
	display: grid;
	grid-template-columns: 3rem 140px 1fr;
	gap: 0 1.5rem;
	align-items: start;
	padding: 1.75rem;
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius);
	border-left: 5px solid var(--strip-color, var(--color-primary));
	background: var(--color-white);
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
	transition: all var(--transition), transform var(--transition);
}

.pub-strip:hover {
	box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
	transform: translateY(-2px);
	border-left-color: var(--strip-color, var(--color-accent));
}

.pub-strip__num {
	font-family: var(--font-heading);
	font-size: 2rem;
	font-weight: 900;
	color: var(--strip-color, var(--color-primary));
	line-height: 1;
	letter-spacing: -0.06em;
	opacity: 0.5;
	transition: opacity var(--transition);
	user-select: none;
	padding-top: 0.5rem;
}

.pub-strip:hover .pub-strip__num { opacity: 1; }

.pub-strip__thumb {
	position: relative;
	aspect-ratio: 3/4;
	overflow: hidden;
	border-radius: 8px;
	flex-shrink: 0;
	display: block;
	text-decoration: none;
	line-height: 0;
	background-color: #f3f4f6;
}

.pub-strip__thumb-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	transition: transform 0.4s ease;
}

.pub-strip:hover .pub-strip__thumb-img {
	transform: scale(1.05);
}

.pub-strip__body {
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.pub-strip__top {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
	margin-bottom: 0.8rem;
}

.pub-strip__top .tag {
	display: inline-block;
	padding: 0.35rem 0.85rem;
	background: #eff6ff;
	color: var(--strip-color, var(--color-accent));
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border-radius: 6px;
	border: 1px solid var(--strip-color, var(--color-accent));
	text-decoration: none;
}

.pub-strip__top .tag:hover {
	background: #dbeafe;
	border-color: var(--strip-color, var(--color-accent));
}

.pub-strip__date {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-light);
	margin-left: auto;
}

.pub-strip__title {
	font-family: var(--font-heading);
	font-size: 1.2rem;
	font-weight: 800;
	line-height: 1.3;
	color: var(--color-primary);
	margin-bottom: 0.6rem;
}

.pub-strip__title a {
	color: inherit;
	text-decoration: none;
	transition: color var(--transition);
}

.pub-strip__title a:hover {
	color: var(--strip-color, var(--color-accent));
}

.pub-strip__authors {
	font-size: 0.85rem;
	font-style: italic;
	color: var(--color-text-muted);
	margin-bottom: 0.8rem;
	line-height: 1.5;
}

.pub-strip__footer {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	margin-top: auto;
	padding-top: 1rem;
}

.pub-strip__read-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.65rem 1.5rem;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: #fff;
	background: var(--color-accent);
	border: 2px solid var(--color-accent);
	border-radius: var(--border-radius-sm);
	cursor: pointer;
	text-decoration: none;
	transition: background-color var(--transition), border-color var(--transition), color var(--transition);
}

.pub-strip__read-link:hover {
	background: var(--color-accent-dark);
	border-color: var(--color-accent-dark);
	color: #fff;
}

.pub-strip__pdf-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--color-accent);
	text-decoration: none;
	padding: 0.65rem 1.5rem;
	border: 2px solid var(--color-accent);
	border-radius: var(--border-radius-sm);
	transition: background-color var(--transition), border-color var(--transition), color var(--transition);
}

.pub-strip__pdf-link:hover {
	border-color: var(--color-accent);
	color: var(--color-white);
	background: var(--color-accent);
}

.pub-stack__footer {
	padding-top: 1.5rem;
	text-align: right;
}

/* ==========================================================================
   EVENTS SHOWCASE — dark immersive section
   ========================================================================== */

.events-showcase {
	background: linear-gradient(160deg, #0A1929 0%, #0D2137 55%, #12172B 100%);
	padding-block: 5rem;
	position: relative;
	overflow: hidden;
}

/* Motif Adinkra/Bogolan sur section events — traits or discrets */
.events-showcase::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Crect x='0.5' y='0.5' width='79' height='79' fill='none' stroke='rgba(201,139,21,0.06)' stroke-width='0.5'/%3E%3Ccircle cx='40' cy='40' r='13' fill='none' stroke='rgba(201,139,21,0.08)' stroke-width='1'/%3E%3Cline x1='40' y1='27' x2='40' y2='53' stroke='rgba(201,139,21,0.09)' stroke-width='1.5'/%3E%3Cline x1='27' y1='40' x2='53' y2='40' stroke='rgba(201,139,21,0.09)' stroke-width='1.5'/%3E%3Cpath d='M40 27L53 40 40 53 27 40Z' fill='none' stroke='rgba(201,139,21,0.06)' stroke-width='0.75'/%3E%3Cpath d='M0 12L12 12 12 0' fill='none' stroke='rgba(201,139,21,0.07)' stroke-width='1'/%3E%3Cpath d='M80 12L68 12 68 0' fill='none' stroke='rgba(201,139,21,0.07)' stroke-width='1'/%3E%3Cpath d='M0 68L12 68 12 80' fill='none' stroke='rgba(201,139,21,0.07)' stroke-width='1'/%3E%3Cpath d='M80 68L68 68 68 80' fill='none' stroke='rgba(201,139,21,0.07)' stroke-width='1'/%3E%3Ccircle cx='40' cy='0' r='2' fill='rgba(201,139,21,0.07)'/%3E%3Ccircle cx='0' cy='40' r='2' fill='rgba(201,139,21,0.07)'/%3E%3Ccircle cx='80' cy='40' r='2' fill='rgba(201,139,21,0.07)'/%3E%3Ccircle cx='40' cy='80' r='2' fill='rgba(201,139,21,0.07)'/%3E%3Ccircle cx='40' cy='40' r='2.5' fill='rgba(201,139,21,0.07)'/%3E%3C/svg%3E");
	background-size: 80px 80px;
	pointer-events: none;
}

/* Kente stripe on top */
.events-showcase::after {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 4px;
	background: linear-gradient(
		to right,
		var(--color-terracotta) 0%, var(--color-terracotta) 33.33%,
		var(--color-gold)       33.33%, var(--color-gold)       66.66%,
		var(--color-green-africa) 66.66%, var(--color-green-africa) 100%
	);
}

/* ─── Header ─── */
.events-showcase__header {
	padding-bottom: 3rem;
	position: relative;
	z-index: 1;
}

.events-showcase__header-inner {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.5rem;
	flex-wrap: wrap;
}

.events-showcase__label {
	display: block;
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-gold);
	margin-bottom: 0.5rem;
}

.events-showcase__title {
	font-family: var(--font-heading);
	font-size: clamp(1.7rem, 3vw, 2.4rem);
	font-weight: 700;
	color: var(--color-white);
	margin: 0;
	line-height: 1.2;
}

/* ─── Grid ─── */
.events-showcase__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	position: relative;
	z-index: 1;
}

.events-showcase__empty {
	color: rgba(255,255,255,0.45);
	font-size: 0.9rem;
	text-align: center;
	padding: 3rem 0;
	position: relative;
	z-index: 1;
}

/* ─── Event card ─── */
.evcard {
	background: rgba(255,255,255,0.04);
	border: 1px solid rgba(255,255,255,0.08);
	border-top: 3px solid var(--evcard-accent, var(--color-gold));
	display: flex;
	flex-direction: column;
	transition: background-color var(--transition), transform var(--transition), box-shadow var(--transition);
	position: relative;
	overflow: hidden;
}

.evcard:hover {
	background: rgba(255,255,255,0.07);
	transform: translateY(-4px);
	box-shadow: 0 16px 48px rgba(0,0,0,0.4);
}

/* Subtle glow on hover using accent color */
.evcard::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 80px;
	background: linear-gradient(to bottom, rgba(var(--evcard-accent-raw,201,139,21), 0.06), transparent);
	pointer-events: none;
}

/* ─── Date panel ─── */
.evcard__date {
	display: flex;
	align-items: center;
	gap: 0;
	padding: 1.5rem 1.5rem 0;
	position: relative;
}

.evcard__date-dow {
	font-size: 0.6rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.35);
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	margin-right: 1rem;
	line-height: 1;
}

.evcard__date-day {
	font-family: var(--font-heading);
	font-size: 4.5rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: -0.04em;
	color: var(--evcard-accent, var(--color-gold));
}

.evcard__date-mon {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding-bottom: 0.5rem;
	padding-left: 0.5rem;
}

.evcard__date-mon {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.55);
	line-height: 1.4;
}

.evcard__date-yr {
	font-size: 0.65rem;
	color: rgba(255,255,255,0.28);
	font-weight: 600;
	letter-spacing: 0.06em;
	padding-left: 0.5rem;
	padding-bottom: 0.5rem;
	align-self: flex-end;
}

/* ─── Body ─── */
.evcard__body {
	padding: 1rem 1.5rem 1.75rem;
	display: flex;
	flex-direction: column;
	flex: 1;
	border-top: 1px solid rgba(255,255,255,0.06);
	margin-top: 1rem;
}

.evcard__top {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-wrap: wrap;
	margin-bottom: 0.85rem;
}

.evcard__virtual-badge {
	font-size: 0.6rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.45);
	border: 1px solid rgba(255,255,255,0.15);
	padding: 0.15rem 0.5rem;
}

.evcard__title {
	font-family: var(--font-heading);
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.38;
	color: var(--color-white);
	margin-bottom: 1rem;
	flex: 1;
}

.evcard__title a {
	color: inherit;
	text-decoration: none;
	transition: color var(--transition);
}

.evcard__title a:hover { color: var(--evcard-accent, var(--color-gold)); text-decoration: none; }

.evcard__meta {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin-bottom: 1.5rem;
}

.evcard__meta-item {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.8rem;
	color: rgba(255,255,255,0.5);
	line-height: 1.45;
}

.evcard__meta-item svg {
	flex-shrink: 0;
	margin-top: 0.1rem;
	color: var(--evcard-accent, var(--color-gold));
	opacity: 0.8;
}

/* ─── Register button ─── */
.evcard__register {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.6rem 1.25rem;
	background: var(--evcard-accent, var(--color-gold));
	color: var(--color-primary);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	align-self: flex-start;
	transition: filter var(--transition), gap var(--transition);
	margin-top: auto;
}

.evcard__register:hover { filter: brightness(1.1); gap: 0.75rem; text-decoration: none; }

.evcard__register--ghost {
	background: transparent;
	color: rgba(255,255,255,0.55);
	border: 1px solid rgba(255,255,255,0.18);
}

.evcard__register--ghost:hover {
	background: rgba(255,255,255,0.06);
	color: var(--color-white);
	filter: none;
}

/* ==========================================================================
   RESEARCH PAGE — Institutional layout
   ========================================================================== */

.research-page {
	background: var(--color-bg-light);
	padding-block: 3rem;
}

.research-page__inner {
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 2.5rem;
	align-items: start;
}

/* ─── Sidebar ─── */
.research-sidebar {
	position: sticky;
	top: calc(var(--header-height) + 1.5rem);
}

.research-sidebar__block {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	padding: 1.25rem;
	margin-bottom: 1rem;
}

.research-sidebar__heading {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.85rem;
	padding-bottom: 0.6rem;
	border-bottom: 1px solid var(--color-border-light);
}

.research-search-box {
	display: flex;
	border: 1px solid var(--color-border);
	overflow: hidden;
}

.research-search-box input[type="search"] {
	flex: 1;
	padding: 0.6rem 0.85rem;
	font-size: 0.85rem;
	border: none;
	outline: none;
	background: var(--color-white);
	color: var(--color-text);
	min-width: 0;
}

.research-search-box button {
	padding: 0.6rem 0.85rem;
	background: var(--color-primary);
	color: var(--color-white);
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	transition: background-color var(--transition);
	flex-shrink: 0;
}

.research-search-box button:hover { background: var(--color-accent); }

.research-topic-list { list-style: none; }

.research-topic-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.5rem 0.6rem;
	font-size: 0.84rem;
	color: var(--color-text);
	text-decoration: none;
	border-left: 2px solid transparent;
	border-bottom: 1px solid var(--color-border-light);
	transition: background-color var(--transition), border-left-color var(--transition);
}

.research-topic-list li:last-child .research-topic-item { border-bottom: none; }

.research-topic-item:hover {
	background: var(--color-bg-light);
	border-left-color: var(--color-accent);
	color: var(--color-primary);
	text-decoration: none;
}

.research-topic-item.is-active {
	background: var(--color-bg-light);
	border-left-color: var(--color-primary);
	color: var(--color-primary);
	font-weight: 600;
}

.research-topic-item__count {
	font-size: 0.68rem;
	color: var(--color-text-light);
	flex-shrink: 0;
}

/* ─── Main ─── */
.research-main { min-width: 0; }

.research-results-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-bottom: 0.85rem;
	border-bottom: 1px solid var(--color-border);
	margin-bottom: 1.5rem;
}

.research-results-bar__count {
	font-size: 0.82rem;
	color: var(--color-text-muted);
	margin: 0;
}

.research-results-bar__count span { color: var(--color-primary); font-weight: 600; }

.research-results-bar__clear {
	font-size: 0.75rem;
	color: var(--color-text-muted);
	text-decoration: none;
	white-space: nowrap;
}

.research-results-bar__clear:hover { color: var(--color-primary); text-decoration: underline; }

/* ─── Publication entries ─── */
.pub-list {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.pub-entry {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-left: 3px solid var(--color-primary);
	padding: 1.75rem 2rem;
	margin-bottom: -1px;
	transition: border-left-color var(--transition), box-shadow var(--transition);
}

.pub-entry:hover {
	border-left-color: var(--color-accent);
	box-shadow: var(--shadow-hover);
	position: relative;
	z-index: 1;
}

.pub-entry:nth-child(3n+2) { border-left-color: var(--color-terracotta); }
.pub-entry:nth-child(3n+2):hover { border-left-color: var(--color-terracotta); }
.pub-entry:nth-child(3n+3) { border-left-color: var(--color-green-africa); }
.pub-entry:nth-child(3n+3):hover { border-left-color: var(--color-green-africa); }

.pub-entry__meta {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.6rem;
}

.pub-entry__year {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--color-text-light);
}

.pub-entry__title {
	font-family: var(--font-heading);
	font-size: 1.08rem;
	font-weight: 700;
	line-height: 1.38;
	color: var(--color-primary);
	margin-bottom: 0.4rem;
}

.pub-entry__title a { color: inherit; text-decoration: none; }
.pub-entry__title a:hover { color: var(--color-accent); text-decoration: none; }

.pub-entry__authors {
	font-size: 0.82rem;
	font-style: italic;
	color: var(--color-text-muted);
	margin-bottom: 0.7rem;
}

.pub-entry__excerpt {
	font-size: 0.88rem;
	line-height: 1.72;
	color: var(--color-text-muted);
	margin-bottom: 1.1rem;
}

.pub-entry__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 0.85rem;
	border-top: 1px solid var(--color-border-light);
	gap: 1rem;
	flex-wrap: wrap;
}

.pub-entry__read {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--color-accent);
	text-decoration: none;
	transition: color var(--transition);
}

.pub-entry__read:hover { color: var(--color-primary); text-decoration: none; }

.pub-entry__actions {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.pub-entry__chip {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.2rem 0.55rem;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--color-text-light);
	background: var(--color-bg-light);
	border: 1px solid var(--color-border);
}

.pub-entry__chip--link {
	text-decoration: none;
	color: var(--color-text-muted);
	transition: border-color var(--transition), color var(--transition);
}

.pub-entry__chip--link:hover { border-color: var(--color-accent); color: var(--color-accent); text-decoration: none; }

/* ─── Responsive ─── */
@media (max-width: 900px) {
	.research-page__inner { grid-template-columns: 1fr; }
	.research-sidebar { position: static; }
}

@media (max-width: 640px) {
	.pub-entry { padding: 1.25rem; }
}

/* ==========================================================================
   INSIGHTS PAGE
   ========================================================================== */

.insights-page {
	padding-block: 3rem 5rem;
}

/* ─── Category tabs ─── */
.insights-tabs {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.4rem;
	border-bottom: 2px solid var(--color-border);
	padding-bottom: 0;
	margin-bottom: 2.5rem;
}

.insights-tab {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.55rem 1.1rem;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-text-muted);
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
	transition: color var(--transition), border-color var(--transition);
}

.insights-tab:hover { color: var(--color-primary); }

.insights-tab.is-active {
	color: var(--color-terracotta);
	border-bottom-color: var(--color-terracotta);
}

.insights-tab__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.4rem;
	height: 1.4rem;
	padding: 0 0.3rem;
	font-size: 0.68rem;
	font-weight: 700;
	background: var(--color-bg-warm);
	color: var(--color-text-muted);
	border-radius: 999px;
	line-height: 1;
}

.insights-tab.is-active .insights-tab__count {
	background: #FDE8E3;
	color: var(--color-terracotta);
}

/* ─── Search in tabs row ─── */
.insights-search {
	display: flex;
	align-items: center;
	gap: 0;
	margin-left: auto;
	border: 1px solid var(--color-border);
	border-radius: 999px;
	overflow: hidden;
	height: 2rem;
}

.insights-search input[type="search"] {
	border: none;
	outline: none;
	padding: 0 0.75rem;
	font-size: 0.8rem;
	background: transparent;
	color: var(--color-text);
	width: 160px;
}

.insights-search button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border: none;
	background: var(--color-primary);
	color: var(--color-white);
	cursor: pointer;
	flex-shrink: 0;
	transition: background var(--transition);
}

.insights-search button:hover { background: var(--color-terracotta); }

/* ─── Results bar ─── */
.insights-results-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 2rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--color-border);
}

.insights-results-bar__count {
	font-size: 0.82rem;
	color: var(--color-text-muted);
}

.insights-results-bar__count span { font-weight: 700; color: var(--color-text); }

.insights-results-bar__clear {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	color: var(--color-text-muted);
	text-decoration: none;
}

.insights-results-bar__clear:hover { color: var(--color-terracotta); text-decoration: underline; }

/* ─── Featured insight ─── */
.insight-featured {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 0;
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius);
	border-left: 5px solid var(--color-terracotta);
	margin-bottom: 3rem;
	background: var(--color-white);
	overflow: hidden;
	transition: box-shadow var(--transition), transform var(--transition);
	box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
}

.insight-featured:hover {
	box-shadow: 0 14px 40px rgba(15, 23, 42, 0.14);
	transform: translateY(-2px);
}

.insight-featured__image {
	aspect-ratio: 16/10;
	overflow: hidden;
	background: linear-gradient(135deg, #e0ebff 0%, #f0f4ff 100%);
}

.insight-featured__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.55s ease;
	display: block;
}

.insight-featured:hover .insight-featured__image img {
	transform: scale(1.05);
}

.insight-featured__body {
	padding: 2.5rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 1rem;
}

.insight-featured__meta {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
}

.insight-featured__date {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-light);
}

.insight-featured__title {
	font-family: var(--font-heading);
	font-size: 1.65rem;
	font-weight: 800;
	line-height: 1.3;
	color: var(--color-primary);
	margin: 0;
}

.insight-featured__title a {
	color: inherit;
	text-decoration: none;
	transition: color var(--transition);
}

.insight-featured__title a:hover {
	color: var(--color-terracotta);
}

.insight-featured__excerpt {
	font-size: 1rem;
	color: var(--color-text-muted);
	line-height: 1.75;
	margin: 0;
}

.insight-featured__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	margin-top: auto;
	padding-top: 1rem;
	border-top: 1px solid var(--color-border);
}

.insight-featured__byline {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	font-size: 0.85rem;
	color: var(--color-text-muted);
}

.insight-featured__avatar {
	width: 36px !important;
	height: 36px !important;
	border-radius: 50%;
	flex-shrink: 0;
	object-fit: cover;
}

.insight-featured__read {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.4rem 0.8rem;
	background: #f1f5f9;
	border-radius: 6px;
	color: var(--color-accent);
	transition: all var(--transition);
}

.insight-featured__read:hover {
	background: #e0ebff;
	color: var(--color-accent-dark);
}

/* ─── Insights grid ─── */
.insights-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
	margin-bottom: 3rem;
}

/* ─── Insight card ─── */
.insight-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius);
	display: flex;
	flex-direction: column;
	transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

.insight-card:hover {
	border-color: var(--color-accent);
	box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
	transform: translateY(-3px);
}

.insight-card__image {
	aspect-ratio: 16/9;
	overflow: hidden;
	border-radius: var(--border-radius) var(--border-radius) 0 0;
	background: linear-gradient(135deg, #e0ebff 0%, #f0f4ff 100%);
}

.insight-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.5s ease;
}

.insight-card:hover .insight-card__image img {
	transform: scale(1.05);
}

.insight-card__body {
	padding: 1.6rem;
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	border-top: 4px solid var(--color-accent);
}

.insight-card:nth-child(3n+1) .insight-card__body { border-top-color: var(--color-primary); }
.insight-card:nth-child(3n+2) .insight-card__body { border-top-color: var(--color-terracotta); }
.insight-card:nth-child(3n+3) .insight-card__body { border-top-color: var(--color-green-africa); }

.insight-card:hover .insight-card__body { border-top-color: var(--color-accent); }

.insight-card__meta {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
}

.insight-card__meta .tag {
	padding: 0.35rem 0.85rem;
	font-size: 0.7rem;
	border-radius: 6px;
	border: 1px solid currentColor;
}

.insight-card__date {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-light);
	margin-left: auto;
}

.insight-card__title {
	font-family: var(--font-heading);
	font-size: 1.15rem;
	font-weight: 800;
	line-height: 1.35;
	color: var(--color-primary);
	margin: 0;
	margin-bottom: 0.2rem;
}

.insight-card__title a {
	color: inherit;
	text-decoration: none;
	transition: color var(--transition);
}

.insight-card__title a:hover {
	color: var(--color-accent);
}

.insight-card__excerpt {
	font-size: 0.9rem;
	color: var(--color-text-muted);
	line-height: 1.7;
	flex: 1;
	margin-bottom: 0.5rem;
}

.insight-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding-top: 1rem;
	border-top: 1px solid var(--color-border);
	margin-top: auto;
}

.insight-card__read {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-accent);
	text-decoration: none;
	transition: all var(--transition);
}

.insight-card__read:hover {
	gap: 0.6rem;
	color: var(--color-accent-dark);
}

.insight-card__byline {
	font-size: 0.75rem;
	color: var(--color-text-light);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-weight: 600;
}

/* ─── Responsive ─── */
@media (max-width: 1024px) {
	.insight-featured { grid-template-columns: 1fr; }
	.insight-featured__image { aspect-ratio: 16/7; }
	.insights-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
	.insights-tabs { gap: 0.25rem; }
	.insights-tab { padding: 0.45rem 0.75rem; font-size: 0.72rem; }
	.insights-search { margin-left: 0; width: 100%; border-radius: 4px; }
	.insights-search input[type="search"] { width: 100%; }
	.insight-featured__body { padding: 1.5rem; }
	.insight-featured__title { font-size: 1.25rem; }
	.insights-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   SINGLE CPT LAYOUT
   ========================================================================== */

.single-cpt-layout {
	display: grid;
	grid-template-columns: 1fr 300px;
	gap: 3.5rem;
	align-items: start;
	padding-block: 3rem;
}

/* Publication / Event / Insight header */
.pub-header {
	padding-bottom: 2rem;
	margin-bottom: 2rem;
	border-bottom: 1px solid var(--color-border);
}

.pub-header__topics {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-bottom: 1.25rem;
}

.pub-header__title {
	font-family: var(--font-serif);
	font-size: clamp(1.7rem, 3.5vw, 2.5rem);
	font-weight: 700;
	line-height: 1.2;
	color: var(--color-heading);
	margin: 0 0 1.5rem;
}

.pub-header__meta {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 1rem 2rem;
	padding: 1.25rem 0;
	border-top: 1px solid var(--color-border-light);
	border-bottom: 1px solid var(--color-border-light);
	margin-bottom: 1.5rem;
}

.pub-header__meta-item {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}

.pub-header__meta-label {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

.pub-header__meta-value {
	font-size: 0.9rem;
	color: var(--color-text);
	font-weight: 500;
}

.pub-header__meta-value a {
	color: var(--color-primary);
}

.pub-header__actions {
	display: flex;
	gap: 0.75rem;
	flex-wrap: wrap;
}

/* Article featured image */
.article-featured-image {
	margin-bottom: 2rem;
	border: 1px solid var(--color-border-light);
}

.article-featured-image img {
	display: block;
	width: 100%;
	height: auto;
}

/* Entry content */
.entry-content {
	font-size: 1rem;
	line-height: 1.85;
	color: var(--color-text);
}

.entry-content h2,
.entry-content h3,
.entry-content h4 {
	font-family: var(--font-serif);
	color: var(--color-heading);
	margin-top: 2rem;
	margin-bottom: 0.75rem;
}

.entry-content p { margin-bottom: 1.25rem; }
.entry-content ul,
.entry-content ol {
	margin: 0 0 1.25rem 1.5rem;
}

.entry-content blockquote {
	border-left: 4px solid var(--color-primary);
	margin: 2rem 0;
	padding: 1rem 1.5rem;
	background: var(--color-bg-subtle);
	font-style: italic;
	color: var(--color-text-muted);
}

.pub-body { }

/* Prev/Next navigation */
.single-cpt-nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid var(--color-border);
}

.single-cpt-nav__prev { text-align: left; }
.single-cpt-nav__next { text-align: right; }

.single-cpt-nav__dir {
	display: block;
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.4rem;
}

.single-cpt-nav__title a {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--color-primary);
	line-height: 1.4;
	text-decoration: none;
}

.single-cpt-nav__title a:hover { text-decoration: underline; }

/* Sidebar */
.single-cpt-sidebar {
	position: sticky;
	top: calc(var(--header-height) + 1.5rem);
	display: flex;
	flex-direction: column;
	gap: 0;
}

.cpt-sidebar-widget {
	padding: 1.25rem 0;
	border-bottom: 1px solid var(--color-border-light);
}

.cpt-sidebar-widget:first-child { padding-top: 0; }
.cpt-sidebar-widget:last-child { border-bottom: none; }

.cpt-sidebar-widget__title {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin: 0 0 0.85rem;
}

.cpt-sidebar-citation {
	font-size: 0.82rem;
	line-height: 1.65;
	color: var(--color-text-muted);
	margin: 0;
	padding: 0.75rem;
	background: var(--color-bg-subtle);
	border-left: 3px solid var(--color-border);
}

/* Author widget */
.cpt-sidebar-author {
	display: flex;
	gap: 0.85rem;
	align-items: flex-start;
}

.cpt-sidebar-author__avatar {
	width: 52px !important;
	height: 52px !important;
	border-radius: 50%;
	flex-shrink: 0;
	border: 2px solid var(--color-border-light);
}

.cpt-sidebar-author__name {
	display: block;
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--color-heading);
	margin-bottom: 0.3rem;
}

.cpt-sidebar-author__bio {
	font-size: 0.8rem;
	color: var(--color-text-muted);
	line-height: 1.55;
	margin: 0;
}

/* Event date widget */
.event-date-widget {
	text-align: center;
	padding: 1.5rem;
	background: linear-gradient(135deg, #2A0A02, #5C1F0A 60%, #1B3A5C);
	color: var(--color-white);
}

.event-date-widget__day {
	font-family: var(--font-serif);
	font-size: 3.5rem;
	font-weight: 900;
	line-height: 1;
	display: block;
}

.event-date-widget__month {
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	opacity: 0.85;
	display: block;
	margin-top: 0.25rem;
}

.event-date-widget__time {
	font-size: 0.8rem;
	opacity: 0.7;
	display: block;
	margin-top: 0.4rem;
}

/* Fellow single */
.fellow-profile {
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: 3rem;
	align-items: start;
}

.fellow-profile__photo img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	object-position: center 22%;
	display: block;
	border: 1px solid var(--color-border-light);
}

.fellow-profile__photo-placeholder {
	width: 100%;
	aspect-ratio: 1;
	background: linear-gradient(135deg, #2A0A02, #5C1F0A 50%, #1B3A5C);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-heading);
	font-size: 4rem;
	font-weight: 900;
	color: rgba(201, 139, 21, 0.4);
	letter-spacing: -0.02em;
}

.fellow-profile__name {
	font-family: var(--font-heading);
	font-size: clamp(1.5rem, 3vw, 2.2rem);
	font-weight: 700;
	color: var(--color-primary);
	margin: 0 0 0.4rem;
}

.fellow-profile__title {
	font-size: 1rem;
	color: var(--color-terracotta);
	font-weight: 600;
	margin: 0 0 0.25rem;
}

.fellow-profile__institution {
	font-size: 0.9rem;
	color: var(--color-text-muted);
	margin: 0 0 1.25rem;
}

.fellow-profile__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	margin-bottom: 1.5rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--color-border-light);
}

.fellow-profile__meta-item {
	font-size: 0.82rem;
	color: var(--color-text-muted);
	display: flex;
	align-items: center;
	gap: 0.35rem;
}

.fellow-profile__bio {
	font-size: 1rem;
	line-height: 1.85;
	color: var(--color-text);
	margin-bottom: 1.5rem;
}

.fellow-profile__links {
	display: flex;
	gap: 0.75rem;
	flex-wrap: wrap;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 1024px) {
	.footer-main { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
	.about-section__content { grid-template-columns: 1fr; gap: 2.5rem; }
	.content-sidebar-layout { grid-template-columns: 1fr; }
	.sidebar { position: static; }
	.single-cpt-layout { grid-template-columns: 1fr; gap: 2.5rem; }
	.single-cpt-sidebar { position: static; }
	.fellow-profile { grid-template-columns: 160px 1fr; gap: 2rem; }
	.pub-showcase { grid-template-columns: 1fr; }
	.pub-strip { grid-template-columns: 2.5rem 100px 1fr; gap: 0 1rem; padding: 1.35rem; }
	.events-showcase__grid { grid-template-columns: 1fr; gap: 1rem; }
}

@media (max-width: 768px) {
	:root { --header-height: 64px; --gutter: 1rem; }
	.section { padding-block: 3rem; }
	body.nav-open { overflow: hidden; }

	.nav-toggle { display: flex; }

	.primary-nav {
		position: fixed;
		top: var(--header-height);
		left: 0; right: 0; bottom: 0;
		background-color: var(--color-white);
		overflow-y: auto;
		padding: 1.5rem var(--gutter) 3rem;
		transform: translateX(-100%);
		transition: transform 0.3s ease;
		z-index: 999;
		border-top: 3px solid var(--color-primary);
	}

	.primary-nav.is-open { transform: translateX(0); }

	.primary-nav .nav-menu { flex-direction: column; align-items: flex-start; gap: 0; }

	.primary-nav .nav-menu > li { width: 100%; border-bottom: 1px solid var(--color-border-light); }

	.primary-nav .nav-menu > li > a {
		padding: 0.85rem 0;
		font-size: 0.86rem;
		width: 100%;
		border-bottom: none;
		margin-bottom: 0;
	}

	.primary-nav .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: none;
		border-left: 3px solid var(--color-accent);
		margin-left: 1rem;
		display: none;
	}

	.primary-nav .nav-menu > li.submenu-open > .sub-menu { display: block; }

	.hero .container { padding-block: 3.5rem; }
	.hero__stats { flex-wrap: wrap; gap: 1.5rem; margin-top: 2.5rem; }

	.newsletter-inner { grid-template-columns: 1fr; gap: 2.5rem; }
	.newsletter-form {
		flex-direction: column;
		border: none;
		gap: 0.5rem;
	}
	.newsletter-form input[type="email"] { border: 1px solid rgba(255,255,255,0.2); }
	.newsletter-form button { padding: 0.85rem; }

	.grid-3, .grid-4, .grid-2 { grid-template-columns: 1fr; }
	.card--featured { grid-template-columns: 1fr; }
	.card--featured .card__image { min-height: 200px; }
	.card--featured .card__body { border-left: none; border-top: 3px solid var(--color-primary); }
	.about-section__pillars { grid-template-columns: 1fr 1fr; }
	.pillar-item:nth-child(2n) { border-right: none; }
	.pillar-item:nth-last-child(-n+2) { border-bottom: 1px solid var(--color-border); }
	.pillar-item:last-child { border-bottom: none; }
	.footer-main { grid-template-columns: 1fr; gap: 2rem; }
	.footer-bottom-inner { flex-direction: column; text-align: center; }
	.event-row { grid-template-columns: 60px 1fr; }
	.event-row__action { grid-column: 1 / -1; }
	.event-featured { grid-template-columns: 1fr; }
	.event-featured__date-panel { padding: 2rem; flex-direction: row; justify-content: flex-start; gap: 1.5rem; }
	.event-featured__badge { position: static; transform: none; margin-bottom: 0; }
	.event-featured__day { font-size: 3rem; }
	.event-featured__body { padding: 1.5rem; }
	.pub-card { flex-direction: column; }
	.pub-card__cover { width: 100%; height: 140px; }
	.pub-strip { grid-template-columns: 2rem 1fr; gap: 0 0.75rem; padding: 1.15rem; }
	.pub-strip__thumb { display: none; }
	.pub-strip__num { font-size: 1.4rem; }
	.pub-strip__title { font-size: 1rem; }
	.pub-strip__authors { font-size: 0.8rem; }
	.pub-strip__footer { flex-wrap: wrap; }
	.events-showcase__grid { grid-template-columns: 1fr 1fr; }
	.evcard__date-day { font-size: 3.5rem; }
	.single-cpt-nav { grid-template-columns: 1fr; }
	.single-cpt-nav__next { text-align: left; }
	.pub-header__meta { grid-template-columns: 1fr 1fr; }
	.fellow-profile { grid-template-columns: 1fr; }
	.fellow-profile__photo,
	.fellow-profile__photo-placeholder { max-width: 200px; }
}

@media (max-width: 480px) {
	.hero__actions { flex-direction: column; }
	.hero__actions .btn { width: 100%; justify-content: center; }
	.filter-bar { flex-direction: column; align-items: flex-start; }
}

@media print {
	.site-header, .site-footer, .sidebar, .filter-bar, .pagination, .nav-toggle { display: none !important; }
	body { font-size: 11pt; }
	a[href]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #666; }
}

/* ==========================================================================
   SVG LOGO — Digital globe with Africa silhouette
   ========================================================================== */

.des-logo-link { display: flex; align-items: center; text-decoration: none; }

.des-logo-svg {
	height: 46px;
	width: auto;
	display: block;
	overflow: visible;
}

.des-logo-ring    { stroke: var(--color-accent); }
.des-logo-grid    { stroke: var(--color-accent); }
.des-logo-africa  { fill: var(--color-gold); opacity: 0.88; }
.des-logo-node    { fill: var(--color-accent); }
.des-logo-connector { stroke: var(--color-accent); }
.des-logo-sep     { stroke: var(--color-border); }

.des-logo-abbr {
	font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
	font-size: 26px;
	font-weight: 800;
	fill: var(--color-primary);
	letter-spacing: -0.5px;
}

.des-logo-name {
	font-family: 'IBM Plex Sans', Arial, sans-serif;
	font-size: 7.2px;
	font-weight: 700;
	letter-spacing: 1.4px;
	fill: var(--color-text-muted);
}

/* Pulse animation on the Africa shape — subtle, on hover */
.des-logo-link:hover .des-logo-africa {
	animation: africa-pulse 1.8s ease-in-out infinite;
}

.des-logo-link:hover .des-logo-node {
	animation: node-blink 1.2s ease-in-out infinite;
}

@keyframes africa-pulse {
	0%, 100% { opacity: 0.88; }
	50%       { opacity: 1; }
}

@keyframes node-blink {
	0%, 100% { opacity: 1; }
	50%       { opacity: 0.4; }
}

/* ==========================================================================
   BACKGROUND PATTERNS — toggle via body.pattern-b (default = pattern-a)
   ========================================================================== */

/* ==========================================================================
   AFRICAN BACKGROUND PATTERNS — 5 authentic textile / symbol traditions
   ========================================================================== */

/* Background color base (warm off-white) for all section--alt patterns */
body[data-pattern] .section--alt,
body:not([data-pattern]) .section--alt {
	background-color: var(--color-bg-warm);
}

/* ─── Pattern A: Kente Weave ─── */

.section--alt,
body:not([data-pattern]) .section--alt,
body[data-pattern="a"] .section--alt {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cline x1='0' y1='18' x2='80' y2='18' stroke='rgba(201,139,21,0.18)' stroke-width='1.2'/%3E%3Cline x1='0' y1='62' x2='80' y2='62' stroke='rgba(201,139,21,0.18)' stroke-width='1.2'/%3E%3Cpolyline points='0,9 8,3 16,9 24,3 32,9 40,3 48,9 56,3 64,9 72,3 80,9' stroke='rgba(27,58,92,0.12)' stroke-width='0.9' fill='none'/%3E%3Cpolyline points='0,71 8,65 16,71 24,65 32,71 40,65 48,71 56,65 64,71 72,65 80,71' stroke='rgba(27,58,92,0.12)' stroke-width='0.9' fill='none'/%3E%3Cpolygon points='40,24 56,40 40,56 24,40' fill='none' stroke='rgba(27,58,92,0.1)' stroke-width='0.9'/%3E%3Cpolygon points='40,32 48,40 40,48 32,40' fill='none' stroke='rgba(27,58,92,0.09)' stroke-width='0.7'/%3E%3Cline x1='40' y1='24' x2='40' y2='56' stroke='rgba(27,58,92,0.06)' stroke-width='0.6'/%3E%3Cline x1='24' y1='40' x2='56' y2='40' stroke='rgba(27,58,92,0.06)' stroke-width='0.6'/%3E%3Ccircle cx='0' cy='0' r='2' fill='rgba(201,139,21,0.2)'/%3E%3Ccircle cx='80' cy='0' r='2' fill='rgba(201,139,21,0.2)'/%3E%3Ccircle cx='0' cy='80' r='2' fill='rgba(201,139,21,0.2)'/%3E%3Ccircle cx='80' cy='80' r='2' fill='rgba(201,139,21,0.2)'/%3E%3C/svg%3E");
	background-size: 80px 80px;
}
body[data-pattern="a"] .hero__pattern,
body:not([data-pattern]) .hero__pattern,
.hero__pattern {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cline x1='0' y1='18' x2='80' y2='18' stroke='rgba(201,139,21,0.45)' stroke-width='1.5'/%3E%3Cline x1='0' y1='62' x2='80' y2='62' stroke='rgba(201,139,21,0.45)' stroke-width='1.5'/%3E%3Cpolyline points='0,9 8,3 16,9 24,3 32,9 40,3 48,9 56,3 64,9 72,3 80,9' stroke='rgba(255,255,255,0.22)' stroke-width='1' fill='none'/%3E%3Cpolyline points='0,71 8,65 16,71 24,65 32,71 40,65 48,71 56,65 64,71 72,65 80,71' stroke='rgba(255,255,255,0.22)' stroke-width='1' fill='none'/%3E%3Cpolygon points='40,24 56,40 40,56 24,40' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1'/%3E%3Cpolygon points='40,32 48,40 40,48 32,40' fill='none' stroke='rgba(255,255,255,0.14)' stroke-width='0.8'/%3E%3Ccircle cx='0' cy='0' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='80' cy='0' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='0' cy='80' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='80' cy='80' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3C/svg%3E");
	background-size: 80px 80px;
}
body[data-pattern="b"] .hero__pattern {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cpath d='M32,32 Q32,16 16,16 Q16,32 32,32' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.2'/%3E%3Cpath d='M32,32 Q48,32 48,16 Q32,16 32,32' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.2'/%3E%3Cpath d='M32,32 Q16,32 16,48 Q32,48 32,32' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.2'/%3E%3Cpath d='M32,32 Q32,48 48,48 Q48,32 32,32' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.2'/%3E%3Cpath d='M32,32 Q24,24 20,20' fill='none' stroke='rgba(255,255,255,0.1)' stroke-width='0.7'/%3E%3Cpath d='M32,32 Q40,24 44,20' fill='none' stroke='rgba(255,255,255,0.1)' stroke-width='0.7'/%3E%3Cpath d='M32,32 Q24,40 20,44' fill='none' stroke='rgba(255,255,255,0.1)' stroke-width='0.7'/%3E%3Cpath d='M32,32 Q40,40 44,44' fill='none' stroke='rgba(255,255,255,0.1)' stroke-width='0.7'/%3E%3Ccircle cx='32' cy='32' r='2.5' fill='rgba(255,255,255,0.18)'/%3E%3Ccircle cx='16' cy='16' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='48' cy='16' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='16' cy='48' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3Ccircle cx='48' cy='48' r='2.5' fill='rgba(201,139,21,0.5)'/%3E%3C/svg%3E");
	background-size: 64px 64px;
}
body[data-pattern="c"] .hero__pattern {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Crect x='26' y='8' width='8' height='44' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1'/%3E%3Crect x='8' y='26' width='44' height='8' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1'/%3E%3Crect x='23' y='4' width='14' height='7' fill='rgba(255,255,255,0.12)'/%3E%3Crect x='23' y='49' width='14' height='7' fill='rgba(255,255,255,0.12)'/%3E%3Crect x='4' y='23' width='7' height='14' fill='rgba(255,255,255,0.12)'/%3E%3Crect x='49' y='23' width='7' height='14' fill='rgba(255,255,255,0.12)'/%3E%3Ccircle cx='30' cy='30' r='4' fill='none' stroke='rgba(201,139,21,0.5)' stroke-width='1.2'/%3E%3Ccircle cx='30' cy='30' r='1.8' fill='rgba(201,139,21,0.45)'/%3E%3Cpolygon points='8,8 11,5 14,8 11,11' fill='rgba(201,139,21,0.45)'/%3E%3Cpolygon points='52,8 55,5 58,8 55,11' fill='rgba(201,139,21,0.45)'/%3E%3Cpolygon points='8,52 11,49 14,52 11,55' fill='rgba(201,139,21,0.45)'/%3E%3Cpolygon points='52,52 55,49 58,52 55,55' fill='rgba(201,139,21,0.45)'/%3E%3C/svg%3E");
	background-size: 60px 60px;
}
body[data-pattern="d"] .hero__pattern {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M2,2 L22,2 L22,10 L10,10 L10,22 L2,22 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M46,2 L26,2 L26,10 L38,10 L38,22 L46,22 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M2,46 L22,46 L22,38 L10,38 L10,26 L2,26 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M46,46 L26,46 L26,38 L38,38 L38,26 L46,26 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Crect x='22' y='22' width='4' height='4' fill='rgba(201,139,21,0.55)'/%3E%3Cline x1='22' y1='10' x2='26' y2='10' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3Cline x1='22' y1='38' x2='26' y2='38' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3Cline x1='10' y1='22' x2='10' y2='26' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3Cline x1='38' y1='22' x2='38' y2='26' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3C/svg%3E");
	background-size: 48px 48px;
}
body[data-pattern="e"] .hero__pattern {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cpath d='M4,4 L28,4 L28,10 L10,10 L10,28 L4,28 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M4,4 L20,4 L20,10 L10,10 L10,20 L4,20 Z' fill='rgba(255,255,255,0.07)'/%3E%3Cpath d='M60,4 L36,4 L36,10 L54,10 L54,28 L60,28 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M60,4 L44,4 L44,10 L54,10 L54,20 L60,20 Z' fill='rgba(255,255,255,0.07)'/%3E%3Cpath d='M4,60 L28,60 L28,54 L10,54 L10,36 L4,36 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M4,60 L20,60 L20,54 L10,54 L10,44 L4,44 Z' fill='rgba(255,255,255,0.07)'/%3E%3Cpath d='M60,60 L36,60 L36,54 L54,54 L54,36 L60,36 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M60,60 L44,60 L44,54 L54,54 L54,44 L60,44 Z' fill='rgba(255,255,255,0.07)'/%3E%3Cpolygon points='32,24 40,32 32,40 24,32' fill='none' stroke='rgba(201,139,21,0.5)' stroke-width='1.2'/%3E%3Ccircle cx='32' cy='32' r='2.5' fill='rgba(201,139,21,0.45)'/%3E%3C/svg%3E");
	background-size: 64px 64px;
}


/* ==========================================================================
   HERO DYNAMISM — decorative globe visual + floating particles
   ========================================================================== */

.hero {
	overflow: hidden;
}

/* Animated hero globe — hidden, replaced by pattern */
.hero__visual {
	display: none !important;
	position: absolute;
	right: -40px;
	top: 50%;
	transform: translateY(-50%);
	width: 420px;
	height: 420px;
	opacity: 0.18;
	pointer-events: none;
	z-index: 1;
}

@media (max-width: 1024px) { .hero__visual { width: 300px; height: 300px; right: -60px; opacity: 0.12; } }
@media (max-width: 768px)  { .hero__visual { display: none; } }

.hero-globe-svg {
	width: 100%;
	height: 100%;
	animation: globe-spin 40s linear infinite;
}

@keyframes globe-spin {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}

/* Floating data-point particles */
.hero__particles {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 1;
	overflow: hidden;
}

.hero__particle {
	position: absolute;
	border-radius: 50%;
	background: var(--color-gold);
	animation: float-up linear infinite;
	opacity: 0;
}

.hero__particle:nth-child(1)  { width:3px; height:3px; left:8%;   animation-duration:12s; animation-delay:0s;    }
.hero__particle:nth-child(2)  { width:2px; height:2px; left:16%;  animation-duration:15s; animation-delay:2s;    }
.hero__particle:nth-child(3)  { width:4px; height:4px; left:25%;  animation-duration:18s; animation-delay:5s;    }
.hero__particle:nth-child(4)  { width:2px; height:2px; left:35%;  animation-duration:11s; animation-delay:1.5s;  }
.hero__particle:nth-child(5)  { width:3px; height:3px; left:48%;  animation-duration:14s; animation-delay:3.5s;  }
.hero__particle:nth-child(6)  { width:2px; height:2px; left:60%;  animation-duration:16s; animation-delay:0.5s;  }
.hero__particle:nth-child(7)  { width:4px; height:4px; left:72%;  animation-duration:20s; animation-delay:4s;    }
.hero__particle:nth-child(8)  { width:2px; height:2px; left:85%;  animation-duration:13s; animation-delay:6s;    }

@keyframes float-up {
	0%   { bottom: -10px; opacity: 0; transform: translateX(0); }
	10%  { opacity: 0.7; }
	80%  { opacity: 0.5; }
	100% { bottom: 110%; opacity: 0; transform: translateX(20px); }
}

/* Hero title entrance animation */
.hero__label,
.hero__title,
.hero__subtitle,
.hero__actions {
	animation: hero-fade-up 0.8s ease both;
}
.hero__label    { animation-delay: 0.1s; }
.hero__title    { animation-delay: 0.25s; }
.hero__subtitle { animation-delay: 0.4s; }
.hero__actions  { animation-delay: 0.55s; }

@keyframes hero-fade-up {
	from { opacity: 0; transform: translateY(22px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* Animated section title underline — expands on scroll-in */
.section__title.is-visible::after {
	animation: underline-expand 0.5s ease both;
}

@keyframes underline-expand {
	from { width: 0; }
	to   { width: 44px; }
}

/* Card entrance via Intersection Observer (class added by JS) */
.card,
.fcard,
.pub-strip,
.pillar-item,
.evcard {
	transition: opacity 0.5s ease, transform 0.5s ease;
}

.card.animate-hidden,
.fcard.animate-hidden,
.pub-strip.animate-hidden,
.pillar-item.animate-hidden,
.evcard.animate-hidden {
	opacity: 0;
	transform: translateY(24px);
}

/* Stat counter number — pop-in */
.hero__stat-number,
.stat-number {
	display: inline-block;
	animation: stat-pop 0.6s cubic-bezier(0.34,1.56,0.64,1) both;
}

@keyframes stat-pop {
	from { opacity: 0; transform: scale(0.7); }
	to   { opacity: 1; transform: scale(1); }
}

/* ==========================================================================
   TALENTS PAGE — Distinguished / Fellows / Associates
   ========================================================================== */

.talents-hero { }

.talent-type-nav {
	display: flex;
	gap: 0;
	border-bottom: 2px solid var(--color-border);
	margin-bottom: 3rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.talent-type-nav__btn {
	padding: 0.75rem 1.5rem;
	font-family: var(--font-body);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	background: transparent;
	border: none;
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
	cursor: pointer;
	white-space: nowrap;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.talent-type-nav__btn:hover { color: var(--color-primary); }
.talent-type-nav__btn.active { color: var(--color-primary); border-bottom-color: var(--color-accent); }

.talent-type-section { display: none; }
.talent-type-section.active { display: block; }

/* Distinguished Fellows — larger, more prominent cards */
.distinguished-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 2rem;
	margin-bottom: 1rem;
}

.fcard--distinguished {
	border: 1px solid var(--color-border-light);
	border-top: 4px solid var(--color-gold);
}

.fcard--distinguished .fcard__photo-wrap {
	aspect-ratio: 1 / 1;
}

.fcard--associate {
	border-top-color: var(--color-green-africa);
}

/* Talent type badge */
.talent-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.18rem 0.55rem;
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border-radius: var(--border-radius-sm);
	margin-bottom: 0.5rem;
}

.talent-badge--distinguished { background: var(--color-gold-lt); color: var(--color-gold); border: 1px solid rgba(201,139,21,0.25); }
.talent-badge--fellow        { background: rgba(58,123,213,0.1);  color: var(--color-accent); border: 1px solid rgba(58,123,213,0.2); }
.talent-badge--associate     { background: var(--color-green-lt); color: var(--color-green-africa); border: 1px solid rgba(39,107,72,0.22); }

/* Talent count chips */
.talent-section-header {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-bottom: 2rem;
}

.talent-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--color-bg-light);
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--color-text-muted);
	flex-shrink: 0;
}

/* ==========================================================================
   BOARD, PARTNERS, GOVERNANCE PAGES
   ========================================================================== */

.board-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 1.75rem;
}

.board-card {
	border: 1px solid var(--color-border-light);
	border-top: 3px solid var(--color-primary);
	padding: 1.5rem;
	background: var(--color-white);
	transition: box-shadow var(--transition);
}

.board-card:hover { box-shadow: var(--shadow-hover); }

.board-card__photo {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	object-fit: cover;
	object-position: center 22%;
	margin-bottom: 1rem;
	border: 2px solid var(--color-border-light);
}

.board-card__initials {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-heading);
	font-size: 1.4rem;
	font-weight: 700;
	color: var(--color-white);
	margin-bottom: 1rem;
}

.board-card__name {
	font-family: var(--font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-primary);
	margin-bottom: 0.25rem;
}

.board-card__role {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--color-terracotta);
	margin-bottom: 0.2rem;
}

.board-card__institution {
	font-size: 0.78rem;
	color: var(--color-text-muted);
}

/* Partners */
.partners-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 1.5rem;
}

.partner-card {
	border: 1px solid var(--color-border-light);
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.75rem;
	background: var(--color-white);
	transition: box-shadow var(--transition), transform var(--transition);
}

.partner-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }

.partner-card__logo {
	height: 56px;
	width: auto;
	max-width: 140px;
	object-fit: contain;
}

.partner-card__logo-placeholder {
	width: 56px;
	height: 56px;
	background: var(--color-bg-light);
	border-radius: var(--border-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.6rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--color-text-muted);
}

.partner-card__name {
	font-size: 0.84rem;
	font-weight: 600;
	color: var(--color-primary);
	line-height: 1.3;
}

.partner-card__type {
	font-size: 0.66rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-light);
}

/* ==========================================================================
   INITIATIVES PAGES — Academies, Hub, Awards
   ========================================================================== */

/* Academies */
.academy-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 2rem;
}

.academy-card {
	border: 1px solid var(--color-border-light);
	border-left: 4px solid var(--color-accent);
	padding: 1.75rem;
	background: var(--color-white);
	transition: box-shadow var(--transition);
}

.academy-card:hover { box-shadow: var(--shadow-hover); }

.academy-card__label {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-accent);
	margin-bottom: 0.5rem;
}

.academy-card__title {
	font-family: var(--font-heading);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--color-primary);
	margin-bottom: 0.75rem;
}

.academy-card__desc {
	font-size: 0.88rem;
	color: var(--color-text-muted);
	line-height: 1.7;
}

/* Hub / AI Agent */
.hub-hero-section {
	background-color: var(--color-primary);
	color: var(--color-white);
	padding: 5rem 0;
	position: relative;
	overflow: hidden;
}

.hub-hero-section::before {
	content: '';
	position: absolute;
	inset: 0;
	opacity: 0.35;
	pointer-events: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M2,2 L22,2 L22,10 L10,10 L10,22 L2,22 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M46,2 L26,2 L26,10 L38,10 L38,22 L46,22 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M2,46 L22,46 L22,38 L10,38 L10,26 L2,26 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Cpath d='M46,46 L26,46 L26,38 L38,38 L38,26 L46,26 Z' fill='none' stroke='rgba(255,255,255,0.2)' stroke-width='1.1'/%3E%3Crect x='22' y='22' width='4' height='4' fill='rgba(201,139,21,0.55)'/%3E%3Cline x1='22' y1='10' x2='26' y2='10' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3Cline x1='22' y1='38' x2='26' y2='38' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3Cline x1='10' y1='22' x2='10' y2='26' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3Cline x1='38' y1='22' x2='38' y2='26' stroke='rgba(255,255,255,0.12)' stroke-width='0.8'/%3E%3C/svg%3E");
	background-size: 48px 48px;
}

.hub-agent-icon {
	width: 56px;
	height: 56px;
	background: linear-gradient(135deg, var(--color-accent), var(--color-primary));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.hub-agent-icon svg { width: 28px; height: 28px; stroke: white; }

/* ──────────────────────────────────────────────────────────────────────
   Pestel chat widget — search-based bot embedded on the Pestel page
   ────────────────────────────────────────────────────────────────────── */

.pestel-chat {
	background: var(--color-white);
	border: 1px solid var(--color-border-light);
	border-top: 3px solid var(--color-accent);
	border-radius: var(--border-radius);
	max-width: 760px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-shadow: var(--shadow-card);
}

.pestel-chat__header {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1.5rem 1.75rem;
	border-bottom: 1px solid var(--color-border-light);
	background: var(--color-bg-light);
}

.pestel-chat__title {
	font-family: var(--font-heading);
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--color-primary);
	margin: 0 0 0.15rem;
	line-height: 1.2;
}

.pestel-chat__subtitle {
	font-size: 0.85rem;
	color: var(--color-text-muted);
	margin: 0;
	line-height: 1.45;
}

.pestel-chat__messages {
	flex: 1;
	max-height: 480px;
	min-height: 320px;
	overflow-y: auto;
	padding: 1.5rem 1.75rem;
	background: var(--color-white);
	scroll-behavior: smooth;
}

/* Message bubble */
.pestel-msg {
	margin-bottom: 1.5rem;
	max-width: 88%;
}

.pestel-msg:last-child { margin-bottom: 0; }

.pestel-msg--user {
	margin-left: auto;
	text-align: right;
}

.pestel-msg--bot {
	margin-right: auto;
}

.pestel-msg__author {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.35rem;
}

.pestel-msg__body {
	display: inline-block;
	padding: 0.7rem 1rem;
	border-radius: 14px;
	font-size: 0.92rem;
	line-height: 1.55;
	color: var(--color-text);
	background: var(--color-bg-light);
	border: 1px solid var(--color-border-light);
	text-align: left;
}

.pestel-msg--user .pestel-msg__body {
	background: var(--color-accent);
	color: var(--color-white);
	border-color: var(--color-accent);
	border-bottom-right-radius: 4px;
}

.pestel-msg--bot .pestel-msg__body {
	background: var(--color-bg-light);
	border-bottom-left-radius: 4px;
}

/* Loading dots */
.pestel-msg--loading .pestel-msg__body {
	display: inline-flex;
	gap: 0.3rem;
	padding: 0.85rem 1rem;
}

.pestel-dot {
	display: inline-block;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--color-text-muted);
	opacity: 0.4;
	animation: pestel-blink 1.2s ease-in-out infinite both;
}

.pestel-dot:nth-child(2) { animation-delay: 0.18s; }
.pestel-dot:nth-child(3) { animation-delay: 0.36s; }

@keyframes pestel-blink {
	0%, 80%, 100% { opacity: 0.25; transform: translateY(0); }
	40%           { opacity: 1;    transform: translateY(-2px); }
}

/* Source cards under bot replies */
.pestel-sources {
	list-style: none;
	margin: 0.85rem 0 0;
	padding: 0;
	display: grid;
	gap: 0.5rem;
}

.pestel-source__link {
	display: block;
	padding: 0.85rem 1rem;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	color: inherit;
	text-decoration: none;
	transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.pestel-source__link:hover,
.pestel-source__link:focus-visible {
	border-color: var(--color-accent);
	box-shadow: 0 4px 14px rgba(0, 153, 230, 0.12);
	transform: translateY(-1px);
	outline: none;
	text-decoration: none;
	color: inherit;
}

.pestel-source__meta {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-accent);
	margin-bottom: 0.3rem;
}

.pestel-source__date {
	color: var(--color-text-muted);
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: none;
}

.pestel-source__title {
	font-family: var(--font-heading);
	font-size: 0.98rem;
	font-weight: 700;
	color: var(--color-primary);
	margin: 0 0 0.3rem;
	line-height: 1.35;
}

.pestel-source__excerpt {
	font-size: 0.82rem;
	color: var(--color-text-muted);
	line-height: 1.55;
	margin: 0 0 0.4rem;
}

.pestel-source__cta {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	color: var(--color-accent);
	text-transform: uppercase;
}

/* Form */
.pestel-chat__form {
	display: flex;
	gap: 0.6rem;
	align-items: stretch;
	padding: 1rem 1.75rem;
	border-top: 1px solid var(--color-border-light);
	background: var(--color-white);
}

.pestel-chat__input {
	flex: 1;
	border: 1.5px solid var(--color-border);
	border-radius: 999px;
	padding: 0.65rem 1rem;
	font-family: var(--font-body);
	font-size: 0.92rem;
	background: var(--color-white);
	color: var(--color-text);
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.pestel-chat__input:focus {
	outline: none;
	border-color: var(--color-accent);
	box-shadow: 0 0 0 3px rgba(0, 153, 230, 0.15);
}

.pestel-chat__send {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	border-radius: 999px;
	padding: 0.6rem 1.25rem;
	font-size: 0.82rem;
}

.pestel-chat__form--busy .pestel-chat__send {
	opacity: 0.65;
	cursor: progress;
}

.pestel-chat__footnote {
	margin: 0;
	padding: 0.7rem 1.75rem 1rem;
	font-size: 0.72rem;
	color: var(--color-text-light);
	text-align: center;
	border-top: 1px solid var(--color-border-light);
	background: var(--color-bg-light);
}

/* Mobile */
@media (max-width: 600px) {
	.pestel-chat__header { padding: 1.25rem 1rem; gap: 0.75rem; }
	.pestel-chat__messages { padding: 1rem; max-height: 60vh; }
	.pestel-chat__form { padding: 0.85rem 1rem; }
	.pestel-msg { max-width: 95%; }
	.pestel-chat__send span { display: none; }
}

/* Dark mode */
:root[data-theme="dark"] .pestel-chat {
	background: var(--color-surface-2);
	border-color: var(--color-border);
}

:root[data-theme="dark"] .pestel-chat__header,
:root[data-theme="dark"] .pestel-chat__footnote {
	background: var(--color-surface);
	border-color: var(--color-border);
}

:root[data-theme="dark"] .pestel-chat__messages,
:root[data-theme="dark"] .pestel-chat__form { background: var(--color-surface-2); border-color: var(--color-border); }

:root[data-theme="dark"] .pestel-msg--bot .pestel-msg__body {
	background: var(--color-surface);
	border-color: var(--color-border);
	color: var(--color-text);
}

:root[data-theme="dark"] .pestel-source__link {
	background: var(--color-surface);
	border-color: var(--color-border);
}

:root[data-theme="dark"] .pestel-chat__input {
	background: var(--color-surface);
	border-color: var(--color-border);
	color: var(--color-text);
}

/* Awards */
.awards-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 2rem;
}

.award-card {
	border: 1px solid var(--color-border-light);
	padding: 0;
	overflow: hidden;
	background: var(--color-white);
	transition: box-shadow var(--transition), transform var(--transition);
}

.award-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-3px); }

.award-card__header {
	padding: 1.5rem;
	background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
	color: var(--color-white);
	text-align: center;
}

.award-card__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin-bottom: 0.85rem;
	background: var(--color-gold-lt);
	color: var(--color-gold);
	border-radius: var(--border-radius);
	transition: background var(--transition), color var(--transition), transform var(--transition);
}
.award-card:hover .award-card__icon {
	background: var(--color-gold);
	color: var(--color-white);
	transform: rotate(-3deg) scale(1.04);
}
.award-card__icon svg { width: 30px; height: 30px; display: block; }

.award-card__title {
	font-family: var(--font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-white);
	margin: 0;
}

.award-card__body {
	padding: 1.5rem;
}

.award-card__desc {
	font-size: 0.88rem;
	color: var(--color-text-muted);
	line-height: 1.7;
	margin-bottom: 1rem;
}

/* ==========================================================================
   RESPONSIVE additions for new components
   ========================================================================== */

@media (max-width: 768px) {
	.des-logo-svg { height: 38px; }
	.talent-type-nav { margin-bottom: 2rem; }
	.distinguished-grid,
	.board-grid,
	.partners-grid,
	.academy-grid,
	.awards-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
	.des-logo-name { display: none; }
	.des-logo-sep  { display: none; }
}

/* ==========================================================================
   HERO — Binary 0/1 digital pattern (replaces Adinkra motif)
   ========================================================================== */

.hero__binary {
	display: flex !important;
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	font-family: 'IBM Plex Mono', 'Courier New', monospace;
	font-size: 0.75rem;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.07);
	flex-wrap: wrap;
	align-content: flex-start;
	padding: 1rem;
	gap: 0;
	user-select: none;
}

.hero__binary span {
	display: inline-block;
	width: 1.1em;
	text-align: center;
	animation: binary-flicker 4s ease-in-out infinite;
}

@keyframes binary-flicker {
	0%, 100% { opacity: var(--bin-opacity, 0.07); }
	50%       { opacity: calc(var(--bin-opacity, 0.07) * 3); }
}

/* ==========================================================================
   INSIGHTS SLIDER — full-width horizontal carousel (editorial redesign)
   ========================================================================== */

/* ── DES signature tricolor separator ── */
.des-sep {
	display: flex;
	height: 4px;
	width: 100%;
}

.des-sep__bar {
	flex: 1;
	display: block;
}

.des-sep__bar--1 { background: var(--color-terracotta); }
.des-sep__bar--2 { background: var(--color-gold); }
.des-sep__bar--3 { background: var(--color-green-africa); }

/* ─────────────────────── */

/* Smooth transitions */
body {
	transition: background-color 0.3s ease, color 0.3s ease;
}

body.dark-mode .site-header,
body.dark-mode .hero,
body.dark-mode .section,
body.dark-mode .footer {
	transition: background-color 0.3s ease, border-color 0.3s ease;
}

body.dark-mode .icard,
body.dark-mode .rframe,
body.dark-mode .survey-card {
	transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

/* Ambient radial blobs for depth */
.insights-slider::before {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse at 10% 60%, rgba(58, 123, 213, 0.055) 0%, transparent 50%),
		radial-gradient(ellipse at 90% 20%, rgba(201, 139, 21, 0.045) 0%, transparent 45%),
		radial-gradient(ellipse at 55% 90%, rgba(27, 58, 92, 0.035) 0%, transparent 40%);
	pointer-events: none;
}

	margin: 0 auto;
}

/* Full-width blue background extension */
.insights-slider::after {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100vw;
	height: 100vh;
	background: linear-gradient(135deg, #1e3a8a 0%, #2c5282 100%);
	z-index: -1;
	pointer-events: none;
}

.insights-slider::after { display: none; }

.insights-slider__header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
	margin: 3rem 0;
	position: relative;
	z-index: 1;
}

.insights-slider__controls {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
	background: var(--color-bg-light);
	border-radius: 100px;
	padding: 0.3rem;
}

.slider-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: none;
	background: transparent;
	color: var(--color-text-muted);
	cursor: pointer;
	border-radius: 100px;
	transition: background 0.22s ease, color 0.22s ease, transform 0.22s ease;
}

.slider-btn:hover, .slider-btn:focus {
	background: var(--color-white);
	color: var(--color-primary);
	transform: scale(1.05);
	box-shadow: 0 2px 10px rgba(27, 58, 92, 0.14);
}

.slider-btn:disabled {
	opacity: 0.35;
	cursor: not-allowed;
	transform: none;
	box-shadow: none;
}

.insights-slider__viewport {
	overflow: hidden;
	width: 100%;
	position: relative;
	z-index: 1;
	margin-top: 0;
}

.insights-slider__track {
	display: flex;
	gap: 1rem;
	transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	will-change: transform;
}

/* ── icard — design éditorial ── */

.insights-slider__track { counter-reset: icard-n; }

.icard {
	counter-increment: icard-n;
	flex: 0 0 calc(33.333% - 0.75rem);
	display: flex;
	flex-direction: column;
	background: var(--color-white);
	border-radius: 0;
	overflow: hidden;
	border: 1px solid rgba(27, 58, 92, 0.10);
	border-top: 3px solid var(--color-primary);
	box-shadow: 0 2px 12px rgba(27, 58, 92, 0.06);
	margin-bottom: 5rem;
	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	border-top-color 0.25s ease;
	position: relative;
}

.icard[data-type="publication"] { border-top-color: var(--color-terracotta); }
.icard[data-type="insight"]     { border-top-color: var(--color-accent); }

.icard::before { display: none !important; }

.icard:hover {
	transform: translateY(-2px);
	box-shadow:
		0 8px 18px rgba(15, 23, 42, 0.04),
		0 16px 36px rgba(15, 23, 42, 0.06);
}

/* ── Media (image zone) ── */
.icard__media {
	display: block;
	position: relative;
	height: 185px;
	overflow: hidden;
	text-decoration: none;
	flex-shrink: 0;
}

.icard__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

.icard:hover .icard__img { transform: scale(1.03); }

/* Gradient overlay for readability */
.icard__media::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, transparent 42%, rgba(8, 22, 48, 0.52) 100%);
	z-index: 1;
	pointer-events: none;
}

/* Rich placeholder — no SVG icon, just gradient mesh */
.icard__img-placeholder {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	background: linear-gradient(150deg, #0f2847 0%, #1B3A5C 40%, #0a1e38 100%);
}

.icard__img-placeholder::before {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 72% 22%, rgba(58, 123, 213, 0.40) 0%, transparent 52%),
		radial-gradient(circle at 18% 82%, rgba(201, 139, 21, 0.22) 0%, transparent 48%),
		radial-gradient(circle at 48% 55%, rgba(39, 107, 72, 0.12) 0%, transparent 40%);
}

.icard__img-placeholder::after {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='1.2' fill='rgba(255,255,255,0.055)'/%3E%3C/svg%3E");
	background-size: 32px 32px;
}

/* Category pill — top-left, solid by type */
.icard__cat {
	position: absolute;
	top: 1rem;
	left: 1rem;
	z-index: 3;
	font-size: 0.6rem;
	font-weight: 800;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	padding: 0.25rem 0.7rem;
	border-radius: 100px;
	color: var(--color-white);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.icard[data-type="publication"] .icard__cat { background: var(--color-terracotta); }
.icard[data-type="insight"]     .icard__cat,
.icard:not([data-type])         .icard__cat { background: var(--color-accent); }

/* ── Body ── */
.icard__body {
	padding: 1.25rem 1.4rem 1.5rem;
	display: flex;
	flex-direction: column;
	flex: 1;
	position: relative;
	overflow: hidden;
}

.icard__body::after {
	content: counter(icard-n, decimal-leading-zero);
	position: absolute;
	bottom: -0.75rem;
	right: 0.6rem;
	font-family: var(--font-heading);
	font-size: 5.5rem;
	font-weight: 900;
	letter-spacing: -0.05em;
	line-height: 1;
	color: rgba(27,58,92,0.045);
	pointer-events: none;
	user-select: none;
}

/* Meta row: colored dot + date */
.icard__meta {
	display: flex;
	align-items: center;
	gap: 0.45rem;
	margin-bottom: 0.6rem;
}

.icard__type-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	flex-shrink: 0;
}

.icard[data-type="publication"] .icard__type-dot { background: var(--color-terracotta); }
.icard[data-type="insight"]     .icard__type-dot,
.icard:not([data-type])         .icard__type-dot { background: var(--color-accent); }

.icard__date {
	font-size: 0.72rem;
	font-weight: 600;
	color: var(--color-text-light);
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

/* Title */
.icard__title {
	font-family: var(--font-heading);
	font-size: 1.05rem;
	font-weight: 800;
	color: var(--color-primary);
	line-height: 1.38;
	margin: 0 0 0.65rem;
	letter-spacing: -0.01em;
}

.icard__title a {
	color: inherit;
	text-decoration: none;
	transition: color 0.22s;
}

.icard__title a:hover { color: var(--color-accent); }

/* Excerpt — 2 lines max */
.icard__excerpt {
	font-size: 0.875rem;
	color: var(--color-text-muted);
	line-height: 1.75;
	flex: 1;
	margin-bottom: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* CTA — inline animated arrow */
.icard__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-primary);
	text-decoration: none;
	border-top: 1px solid var(--color-border-light);
	padding-top: 0.85rem;
	margin-top: 1rem;
	transition: gap 0.22s ease, color 0.22s ease;
}

.icard__cta svg {
	transition: transform 0.22s ease;
	flex-shrink: 0;
}

.icard__cta:hover {
	color: var(--color-accent);
	gap: 0.75rem;
	text-decoration: none;
}

.icard__cta:hover svg { transform: translateX(4px); }

/* Legacy aliases — in case old classes are somewhere */
.icard__image   { display: none; }
.icard__badge   { display: none; }
.icard__footer  { display: none; }
.icard__read-more { display: none; }

/* ==========================================================================
   PILLAR SECTION — 4 static blocks (Analytics, Data, Research, Initiative)
   ========================================================================== */

/* Institutional navy backdrop — deep gradient with subtle cobalt highlights */
.pillar-section {
	background:
		radial-gradient(circle at 18% 22%, rgba(0, 153, 230, 0.20) 0%, transparent 55%),
		radial-gradient(circle at 82% 78%, rgba(0, 153, 230, 0.14) 0%, transparent 55%),
		linear-gradient(155deg, #0A1224 0%, #112647 45%, #1B3A5C 100%);
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

/* Kuba pattern overlay — DES signature motif, visible but disciplined */
.pillar-section::before {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56'%3E%3Cpath d='M2,2 L26,2 L26,12 L12,12 L12,26 L2,26 Z' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='1.2'/%3E%3Cpath d='M54,2 L30,2 L30,12 L44,12 L44,26 L54,26 Z' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='1.2'/%3E%3Cpath d='M2,54 L26,54 L26,44 L12,44 L12,30 L2,30 Z' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='1.2'/%3E%3Cpath d='M54,54 L30,54 L30,44 L44,44 L44,30 L54,30 Z' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='1.2'/%3E%3Crect x='26' y='26' width='4' height='4' fill='rgba(217,119,6,0.85)'/%3E%3Cline x1='26' y1='12' x2='30' y2='12' stroke='rgba(255,255,255,0.16)' stroke-width='0.9'/%3E%3Cline x1='26' y1='44' x2='30' y2='44' stroke='rgba(255,255,255,0.16)' stroke-width='0.9'/%3E%3Cline x1='12' y1='26' x2='12' y2='30' stroke='rgba(255,255,255,0.16)' stroke-width='0.9'/%3E%3Cline x1='44' y1='26' x2='44' y2='30' stroke='rgba(255,255,255,0.16)' stroke-width='0.9'/%3E%3C/svg%3E");
	background-size: 56px 56px;
	opacity: 0.6;
}

/* Soft vignette — pulls the eye toward the cards in the middle */
.pillar-section::after {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	background: radial-gradient(ellipse at center, transparent 45%, rgba(8, 14, 28, 0.45) 100%);
}

.pillar-section .container { position: relative; z-index: 1; }

.pillar-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}

/* Institutional cards — white paper floating over navy */
.pillar-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 2.1rem 1.85rem 1.75rem;
	background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-left: 3px solid var(--_pillar-color, #0C1523);
	border-radius: 8px;
	text-decoration: none;
	color: var(--color-text);
	transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease, border-left-width 0.3s ease;
	position: relative;
	box-shadow:
		0 8px 28px rgba(8, 14, 28, 0.30),
		0 1px 3px rgba(8, 14, 28, 0.15);
}

/* Small family-colored corner mark — discreet institutional flourish */
.pillar-card::before {
	content: '';
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--_pillar-color, #0C1523);
	opacity: 0.55;
	transition: opacity 0.3s ease, transform 0.3s ease;
}
.pillar-card::after { content: none; }

.pillar-card:hover {
	transform: translateY(-5px);
	box-shadow:
		0 18px 42px rgba(8, 14, 28, 0.42),
		0 2px 6px rgba(8, 14, 28, 0.18);
	border-left-width: 5px;
	text-decoration: none;
	color: var(--color-text);
}
.pillar-card:hover::before {
	opacity: 1;
	transform: scale(1.3);
}

.pillar-card__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: var(--border-radius);
	margin-bottom: 1.85rem;
	flex-shrink: 0;
}

/* Institutional icon — family color outlined chip on a near-white surface */
.pillar-card__icon--blue,
.pillar-card__icon--green,
.pillar-card__icon--terracotta,
.pillar-card__icon--gold {
	background: rgba(8, 14, 28, 0.04);
	color: var(--_pillar-color, #0C1523);
	border: 1px solid rgba(8, 14, 28, 0.08);
	transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.pillar-card:hover .pillar-card__icon--blue,
.pillar-card:hover .pillar-card__icon--green,
.pillar-card:hover .pillar-card__icon--terracotta,
.pillar-card:hover .pillar-card__icon--gold {
	background: var(--_pillar-color, #0C1523);
	color: var(--color-white);
	border-color: var(--_pillar-color, #0C1523);
}
.pillar-card:hover .pillar-card__icon--blue,
.pillar-card:hover .pillar-card__icon--green,
.pillar-card:hover .pillar-card__icon--terracotta,
.pillar-card:hover .pillar-card__icon--gold {
	background: var(--_pillar-color, #0C1523);
	color: var(--color-white);
	border-color: var(--_pillar-color, #0C1523);
}

/* Per-card institutional palette — saturated DES family colors */
.pillar-card[aria-label="Data"],
.pillar-card[aria-label="Academies"]   { --_pillar-color: #2E7D32; }   /* vert africain */
.pillar-card[aria-label="Research"],
.pillar-card[aria-label="Membership"]  { --_pillar-color: #C04026; }   /* terracotta */
.pillar-card[aria-label="Analytics"],
.pillar-card[aria-label="Pestel"]      { --_pillar-color: #0077B6; }   /* bleu profond */
.pillar-card[aria-label="Events"],
.pillar-card[aria-label="Awards"]      { --_pillar-color: #B36905; }   /* ambre */

.pillar-card__title {
	font-family: var(--font-heading);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--color-primary);
	margin-bottom: 0.55rem;
	letter-spacing: -0.01em;
}

.pillar-card__desc {
	font-size: 0.86rem;
	color: rgba(15, 23, 42, 0.66);
	line-height: 1.6;
	flex: 1;
	margin-bottom: 1.1rem;
}

.pillar-card__arrow {
	font-size: 1.1rem;
	color: rgba(15, 23, 42, 0.4);
	transition: transform 0.25s ease, color 0.25s ease;
}
.pillar-card:hover .pillar-card__arrow {
	color: var(--_pillar-color, #0C1523);
	transform: translateX(4px);
}

.pillar-card:hover .pillar-card__arrow { transform: translateX(4px); }

/* ==========================================================================
   FELLOWS SECTION — horizontal carousel
   ========================================================================== */

.fellows-section {
	padding-block: 5rem;
	position: relative;
	background: linear-gradient(180deg, rgba(37, 99, 235, 0.12), rgba(255, 255, 255, 0.96));
	border-top: 1px solid rgba(37, 99, 235, 0.16);
	overflow: hidden;
}

.fellows-section::before {
	display: none;
}

.fellows-section .container { position: relative; z-index: 1; }

.fellows-section .section__label {
	color: var(--color-accent);
}

.fellows-section__all-link {
	color: var(--color-primary);
}

.fellows-section__all-link:hover {
	color: var(--color-accent);
}

.fellows-section__header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
	margin-bottom: 2.5rem;
}

.fellows-section__all-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-accent);
	text-decoration: none;
	white-space: nowrap;
	transition: gap var(--transition), color var(--transition);
}

.fellows-section__all-link:hover {
	gap: 0.6rem;
	color: var(--color-accent-dark);
	text-decoration: none;
}

/* Leadership block — rendered inside the Fellows section, after the carousel.
   Sits at the container width, same alignment as the Meet-the-Fellows header. */
.fellows-section__header--leadership {
	margin-top: 4rem;
	padding-top: 2.5rem;
	border-top: 1px solid var(--color-border-light);
}

.leadership-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.5rem;
}

@media (max-width: 960px) {
	.leadership-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Mobile & small tablet — turn the grid into a horizontal swipe carousel */
@media (max-width: 640px) {
	.leadership-grid {
		display: flex;
		grid-template-columns: none;
		gap: 1rem;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding: 0.25rem var(--gutter, 1rem) 0.75rem;
		margin-inline: calc(var(--gutter, 1rem) * -1);
		scroll-padding-inline: var(--gutter, 1rem);
	}
	.leadership-grid::-webkit-scrollbar { display: none; }
	.leadership-grid > .fcard {
		flex: 0 0 78%;
		max-width: 320px;
		scroll-snap-align: start;
	}
}

@media (max-width: 380px) {
	.leadership-grid > .fcard { flex-basis: 84%; }
}

.fellows-carousel-wrap {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.fellows-carousel__viewport {
	flex: 1;
	overflow: hidden;
}

.fellows-carousel__track {
	display: flex;
	gap: 1.5rem;
	transition: transform 0.4s ease;
	will-change: transform;
}

.fslide {
	flex: 0 0 calc(33.333% - 1rem);
}

/* fcard — fellow card in carousel */
.fcard {
	background: var(--color-white);
	border: 1px solid rgba(27, 58, 92, 0.1);
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform 0.25s ease, box-shadow var(--transition), border-color var(--transition);
	height: 100%;
}

.fcard:hover {
	transform: translateY(-2px);
	box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
	border-color: rgba(37, 99, 235, 0.14);
}

.fcard__photo-wrap {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--color-bg-light);
}

.fcard__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 22%;
	display: block;
	transition: transform 0.5s ease;
}

.fcard:hover .fcard__img { transform: scale(1.04); }

.fcard__initials {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-heading);
	font-size: 2.5rem;
	font-weight: 900;
	color: var(--color-white);
	background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);
}

.fcard__body {
	padding: 1.25rem 1.5rem;
	border-top: 3px solid var(--color-primary);
	flex: 1;
}

.fcard__name {
	font-family: var(--font-heading);
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--color-primary);
	margin-bottom: 0.3rem;
}

.fcard__name a {
	color: inherit;
	text-decoration: none;
	transition: color var(--transition);
}

.fcard__name a:hover { color: var(--color-accent); }

.fcard__position {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--color-accent);
	margin-bottom: 0.25rem;
}

.fcard__institution {
	font-size: 0.8rem;
	color: var(--color-text-muted);
}

/* Navigation buttons */
.fellows-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	flex-shrink: 0;
	border: 2px solid var(--color-primary);
	background: var(--color-white);
	color: var(--color-primary);
	cursor: pointer;
	border-radius: 50%;
	transition: background-color var(--transition), color var(--transition);
}

.fellows-nav:hover, .fellows-nav:focus {
	background: var(--color-primary);
	color: var(--color-white);
}

.fellows-nav:disabled {
	opacity: 0.3;
	cursor: not-allowed;
}

/* ==========================================================================
   CONTACT SECTION
   ========================================================================== */

.contact-section {
	background: linear-gradient(135deg, var(--color-primary) 0%, #0D2137 100%);
	position: relative;
	overflow: hidden;
}

.contact-section::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Ccircle cx='30' cy='30' r='1' fill='rgba(255,255,255,0.04)'/%3E%3C/svg%3E");
	background-size: 60px 60px;
	pointer-events: none;
}

.contact-inner {
	position: relative;
	z-index: 1;
	max-width: 680px;
}

.contact-copy .section__label { color: var(--color-gold); }

.contact-copy .section__title {
	color: var(--color-white);
}

.contact-copy .section__title::after {
	background: linear-gradient(to right, var(--color-gold), var(--color-terracotta));
}

.contact-copy__text {
	font-size: 1.05rem;
	color: rgba(255, 255, 255, 0.7);
	line-height: 1.8;
	margin-bottom: 2rem;
}

.contact-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.25rem;
}

.contact-linkedin {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.65rem 1.5rem;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-white);
	border: 2px solid rgba(255, 255, 255, 0.35);
	text-decoration: none;
	border-radius: var(--border-radius-sm);
	transition: background-color var(--transition), border-color var(--transition);
}

.contact-linkedin:hover {
	background: rgba(255, 255, 255, 0.1);
	border-color: rgba(255, 255, 255, 0.6);
	color: var(--color-white);
	text-decoration: none;
}

.contact-linkedin svg { flex-shrink: 0; }

/* ==========================================================================
   PARTNERS SECTION
   ========================================================================== */

.partners-section {
	padding-block: 4rem;
	background: var(--color-white);
	border-top: 1px solid var(--color-border-light);
}

.partners-section__title {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--color-primary);
	text-align: center;
	margin-bottom: 3rem;
	position: relative;
	padding-bottom: 1rem;
}

.partners-section__title::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 44px;
	height: 3px;
	background: linear-gradient(to right, var(--color-terracotta), var(--color-gold));
}

.partners-logos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 1rem;
}

.partner-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 130px;
	height: 60px;
	flex-shrink: 0;
}

.partner-logo img {
	max-height: 40px;
	max-width: 105px;
	width: auto;
	height: auto;
	object-fit: contain;
	filter: grayscale(1);
	opacity: 0.55;
	transition: filter var(--transition), opacity var(--transition);
}

.partner-logo img:hover {
	filter: grayscale(0);
	opacity: 1;
}

.partner-logo__placeholder {
	width: 140px;
	height: 60px;
	background: var(--color-bg-light);
	border: 1px dashed var(--color-border);
	border-radius: var(--border-radius);
	opacity: 0.6;
}

/* ==========================================================================
   RESPONSIVE — new front page sections
   ========================================================================== */

@media (max-width: 1024px) {
	.pillar-grid { grid-template-columns: repeat(2, 1fr); }
	.icard { flex: 0 0 calc(50% - 0.875rem); }
	.fslide { flex: 0 0 calc(50% - 0.75rem); }
}

@media (max-width: 768px) {
	.insights-slider { padding: 2.5rem 0; }
	.pillar-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
	.pillar-card { padding: 1.5rem 1.25rem; }
	.icard { flex: 0 0 calc(50% - 0.875rem); }
	.icard__image { height: 160px; }
	.fslide { flex: 0 0 calc(50% - 0.75rem); }
	.fellows-carousel-wrap { gap: 0.5rem; }
	.fellows-nav { width: 36px; height: 36px; }
	.contact-actions { flex-direction: column; align-items: flex-start; }
	.partners-logos { gap: 1.25rem; }
	.partner-logo__placeholder { width: 110px; height: 48px; }
}

@media (max-width: 480px) {
	.pillar-grid { grid-template-columns: 1fr; }
	.icard { flex: 0 0 90%; }
	.icard__image { height: 140px; }
	.fslide { flex: 0 0 85%; }
	.insights-slider__header { flex-direction: column; align-items: flex-start; }
	.fellows-section__header { flex-direction: column; align-items: flex-start; }
}

/* ==========================================================================
   KNOWLEDGE PAGE — template-knowledge.php
   ========================================================================== */

.knowledge-hero {
	background: linear-gradient(135deg, var(--color-primary) 0%, #0D2137 100%);
}

.knowledge-hero .page-hero__label { color: var(--color-gold); }
.knowledge-hero .page-hero__title,
.knowledge-hero .page-hero__subtitle { color: rgba(255,255,255,0.9); }

/* ── Sticky tabs navigation ── */
.knowledge-tabs {
	position: sticky;
	top: var(--header-height);
	z-index: 500;
	background: var(--color-white);
	border-bottom: 3px solid var(--color-primary);
	box-shadow: 0 2px 12px rgba(27,58,92,0.08);
}

.knowledge-tabs__inner {
	display: flex;
	overflow-x: auto;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.knowledge-tabs__inner::-webkit-scrollbar { display: none; }

.knowledge-tab {
	flex-shrink: 0;
	padding: 1rem 1.75rem;
	font-family: var(--font-body);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	text-decoration: none;
	border-bottom: 3px solid transparent;
	margin-bottom: -3px;
	transition: color var(--transition), border-color var(--transition);
	white-space: nowrap;
}

.knowledge-tab:hover,
.knowledge-tab.is-active {
	color: var(--color-primary);
	border-bottom-color: var(--color-accent);
	text-decoration: none;
}

/* ── Section layout ── */
.knowledge-section {
	padding-block: 5rem;
	border-top: 1px solid var(--color-border-light);
}

.knowledge-section--alt {
	background-color: var(--color-bg-warm);
}

.knowledge-section__label-row { margin-bottom: 0.25rem; }

.knowledge-section__title {
	font-family: var(--font-heading);
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 900;
	color: var(--color-primary);
	margin-bottom: 2.5rem;
	position: relative;
	padding-bottom: 1rem;
}

.knowledge-section__title::after {
	content: '';
	position: absolute;
	bottom: 0; left: 0;
	width: 44px; height: 3px;
	background: linear-gradient(to right, var(--color-terracotta), var(--color-gold));
}

.knowledge-empty {
	color: var(--color-text-muted);
	font-style: italic;
	padding: 2rem 0;
}

/* ── Surveys placeholder ── */
.surveys-placeholder {
	max-width: 600px;
	margin: 0 auto;
	text-align: center;
	padding: 4rem 2rem;
	background: var(--color-white);
	border: 1px dashed var(--color-border);
	border-radius: 8px;
}

.surveys-placeholder__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 88px; height: 88px;
	border-radius: 50%;
	background: rgba(58, 123, 213, 0.08);
	color: var(--color-accent);
	margin-bottom: 1.5rem;
}

.surveys-placeholder h3 {
	font-size: 1.25rem;
	color: var(--color-primary);
	margin-bottom: 0.75rem;
}

.surveys-placeholder p {
	font-size: 0.95rem;
	color: var(--color-text-muted);
	line-height: 1.8;
}

/* ── Research carousel ── */
.research-carousel-wrap {
	display: flex;
	align-items: center;
	gap: 0;
	position: relative;
	max-width: var(--container-max-width, 1200px);
	margin: 0 auto;
}

.rc-nav {
	flex-shrink: 0;
	width: 52px;
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-white);
	border: 2px solid var(--color-primary);
	color: var(--color-primary);
	cursor: pointer;
	z-index: 2;
	transition: background-color var(--transition), color var(--transition), transform var(--transition);
	flex-shrink: 0;
}

.rc-nav:hover, .rc-nav:focus {
	background: var(--color-primary);
	color: var(--color-white);
}

.rc-nav:disabled { opacity: 0.25; cursor: not-allowed; }
.rc-nav--prev { border-radius: 50% 0 0 50%; }
.rc-nav--next { border-radius: 0 50% 50% 0; }

.research-carousel__viewport {
	flex: 1;
	overflow: hidden;
}

.research-carousel__track {
	display: flex;
	transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Research frame */
.rframe {
	flex: 0 0 100%;
	display: grid;
	grid-template-columns: 1fr 1.4fr;
	background: var(--color-white);
	min-height: 380px;
}

.rframe__image {
	position: relative;
	overflow: hidden;
	background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);
}

.rframe__image img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}

.rframe__img-placeholder {
	width: 100%; height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255,255,255,0.25);
	min-height: 300px;
}

.rframe__body {
	padding: 2.5rem 3rem;
	display: flex;
	flex-direction: column;
	background: var(--color-white);
	border-top: 4px solid var(--color-accent);
}

.rframe__title {
	font-family: var(--font-heading);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--color-text);
	line-height: 1.4;
	margin-bottom: 1rem;
}

.rframe__title {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}

.rframe__title:hover {
	color: var(--color-primary);
}

.rframe__abstract {
	font-size: 0.95rem;
	color: var(--color-text-muted);
	line-height: 1.8;
	flex: 1;
	margin-bottom: 1.25rem;
}

.rframe__authors {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.82rem;
	color: var(--color-text-muted);
	font-style: italic;
	margin-bottom: 1rem;
}

.rframe__pub-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 1.5rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid var(--color-border-light);
}

.rframe__pub-link {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--color-accent);
	text-decoration: none;
	transition: color var(--transition);
}

.rframe__pub-link:hover { color: var(--color-accent-dark); text-decoration: underline; }

.rframe__doi {
	font-size: 0.72rem;
	color: var(--color-text-light);
	font-family: monospace;
}

.rframe__actions {
	display: flex;
	gap: 0.75rem;
	flex-wrap: wrap;
}

/* Carousel dots */
.rc-dots {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin-top: 1.5rem;
}

.rc-dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--color-border);
	cursor: pointer;
	transition: background-color var(--transition), transform var(--transition);
}

.rc-dot--active {
	background: var(--color-accent);
	transform: scale(1.3);
}

/* ── Insights / Policy Notes — shared layout ── */
.kframe-layout {
	display: grid;
	grid-template-columns: 1.6fr 1fr;
	gap: 2.5rem;
	align-items: start;
}

/* Main display frame */
.kframe {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 4px solid var(--color-accent);
	overflow: hidden;
}

.kframe__title {
	font-family: var(--font-heading);
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--color-primary);
	text-align: center;
	padding: 1.5rem 2rem 1.25rem;
	border-bottom: 1px solid var(--color-border-light);
	line-height: 1.4;
	transition: opacity 0.25s ease;
}

.kframe__content {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.kframe__image {
	position: relative;
	overflow: hidden;
	background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);
	aspect-ratio: 1/1;
}

.kframe__image img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	transition: opacity 0.3s ease;
}

.kframe__img-placeholder {
	width: 100%; height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255,255,255,0.25);
	min-height: 260px;
}

.kframe__text {
	padding: 1.5rem;
	font-size: 0.88rem;
	line-height: 1.8;
	color: var(--color-text-muted);
	overflow-y: auto;
	max-height: 320px;
	aspect-ratio: 1/1;
	transition: opacity 0.25s ease;
}

.kframe__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.75rem 1.5rem;
	border-top: 1px solid var(--color-border-light);
	background: var(--color-bg-light);
}

.kframe__date {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-text-light);
}

.kframe__link {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--color-accent);
	text-decoration: none;
	transition: color var(--transition);
}

.kframe__link:hover { color: var(--color-accent-dark); text-decoration: underline; }

/* ── Sidebar: filters + list ── */
.kframe-sidebar {
	position: sticky;
	top: calc(var(--header-height) + 56px);
}

.kframe-filters {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin-bottom: 1.25rem;
}

.kframe-filter-select {
	width: 100%;
	padding: 0.6rem 1rem;
	font-family: var(--font-body);
	font-size: 0.82rem;
	color: var(--color-text);
	background: var(--color-white);
	border: 2px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	cursor: pointer;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234a5568' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 16px;
	padding-right: 2.5rem;
	transition: border-color var(--transition);
}

.kframe-filter-select:focus {
	outline: 2px solid var(--color-accent);
	border-color: var(--color-accent);
}

/* Item list */
.kframe-list {
	background: var(--color-white);
	border: 1px solid var(--color-border);
}

.kframe-list__item {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 0.9rem 1rem;
	cursor: pointer;
	border-bottom: 1px solid var(--color-border-light);
	transition: background-color var(--transition);
}

.kframe-list__item:last-child { border-bottom: none; }

.kframe-list__item:hover,
.kframe-list__item:focus {
	background: var(--color-bg-light);
	outline: none;
}

.kframe-list__item--active {
	background: rgba(58, 123, 213, 0.06);
	border-left: 3px solid var(--color-accent);
}

.kframe-list__arrow {
	font-size: 1.1rem;
	color: var(--color-accent);
	flex-shrink: 0;
	line-height: 1.2;
	transition: transform var(--transition);
}

.kframe-list__item--active .kframe-list__arrow,
.kframe-list__item:hover .kframe-list__arrow { transform: translateX(2px); }

.kframe-list__title {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1.4;
	display: block;
	margin-bottom: 0.15rem;
}

.kframe-list__teaser {
	font-size: 0.76rem;
	color: var(--color-text-muted);
	line-height: 1.5;
	margin: 0;
}

/* Show all button + expanded list */
.kframe-show-all-wrap { margin-top: 0.5rem; }

.kframe-show-all {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	width: 100%;
	padding: 0.75rem 1rem;
	font-family: var(--font-body);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-accent);
	background: transparent;
	border: 1.5px solid var(--color-accent);
	cursor: pointer;
	transition: background-color var(--transition), color var(--transition);
	justify-content: center;
}

.kframe-show-all:hover {
	background: var(--color-accent);
	color: var(--color-white);
}

.kframe-show-all[aria-expanded="true"] svg { transform: rotate(180deg); }

.kframe-list--all {
	max-height: 300px;
	overflow-y: auto;
	border-top: 1px solid var(--color-border-light);
}

/* ── Data section ── */
.dataset-layout {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 2.5rem;
	align-items: start;
}

.dataset-sidebar__heading {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.75rem;
}

.dataset-frame {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-top: 4px solid var(--color-green-africa);
}

.dataset-placeholder-notice {
	padding: 3rem 2.5rem;
	text-align: center;
}

.dataset-placeholder-notice__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 80px; height: 80px;
	border-radius: 50%;
	background: var(--color-green-lt);
	color: var(--color-green-africa);
	margin-bottom: 1.25rem;
}

.dataset-placeholder-notice h3 {
	font-size: 1.15rem;
	color: var(--color-primary);
	margin-bottom: 0.75rem;
}

.dataset-placeholder-notice p {
	font-size: 0.9rem;
	color: var(--color-text-muted);
	line-height: 1.8;
	max-width: 480px;
	margin-inline: auto;
}

.dataset-placeholder-notice__sub {
	font-size: 0.8rem !important;
	color: var(--color-text-light) !important;
	margin-top: 1rem !important;
}

/* Fade animation for frame content update */
@keyframes kframe-fade {
	from { opacity: 0.3; transform: translateY(4px); }
	to   { opacity: 1;   transform: translateY(0); }
}

.kframe.is-updating .kframe__title,
.kframe.is-updating .kframe__content { animation: kframe-fade 0.3s ease forwards; }

/* ── Responsive ── */
@media (max-width: 1024px) {
	.kframe-layout { grid-template-columns: 1fr; }
	.kframe-sidebar { position: static; }
	.dataset-layout { grid-template-columns: 1fr; }
	.rframe { grid-template-columns: 1fr 1.2fr; }
}

@media (max-width: 768px) {
	.knowledge-section { padding-block: 3rem; }
	.kframe__content { grid-template-columns: 1fr; }
	.kframe__image { aspect-ratio: 16/9; }
	.kframe__text { max-height: none; aspect-ratio: auto; }
	.rframe { grid-template-columns: 1fr; }
	.rframe__image { min-height: 220px; }
	.rframe__body { padding: 1.75rem; }
	.research-carousel-wrap { gap: 0; }
}

/* ==========================================================================
   DYNAMIC UI — Scroll animations · Modern interactions · Visual depth
   ========================================================================== */

/* ─── 1. Scroll-reveal system ─── */
.reveal {
	opacity: 0;
	transform: translateY(26px);
	transition:
		opacity   0.65s cubic-bezier(0.22, 1, 0.36, 1) var(--reveal-delay, 0s),
		transform 0.65s cubic-bezier(0.22, 1, 0.36, 1) var(--reveal-delay, 0s);
	will-change: opacity, transform;
}
.reveal.is-visible {
	opacity: 1;
	transform: none;
}
.reveal--left  { transform: translateX(-26px); }
.reveal--right { transform: translateX( 26px); }
.reveal--left.is-visible,
.reveal--right.is-visible { transform: none; }
.reveal--scale {
	transform: scale(0.94) translateY(16px);
}
.reveal--scale.is-visible { transform: none; }

@media (prefers-reduced-motion: reduce) {
	.reveal, .reveal--left, .reveal--right, .reveal--scale {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* ─── 2. Header — true glassmorphism on scroll ─── */
.site-header.scrolled {
	background: rgba(255, 255, 255, 0.82) !important;
	backdrop-filter: blur(20px) saturate(200%) !important;
	-webkit-backdrop-filter: blur(20px) saturate(200%) !important;
	box-shadow: 0 0 0 1px rgba(27, 58, 92, 0.07), 0 8px 32px rgba(27, 58, 92, 0.10) !important;
	border-bottom-color: transparent !important;
}

/* ─── 3. Navigation — pill style, active contrast ─── */
.primary-nav .nav-menu > li > a {
	border-radius: 100px;
	border-bottom: none !important;
	margin-bottom: 0 !important;
	padding-bottom: 0.5rem !important;
	transition: color 0.2s, background 0.2s;
}
.primary-nav .nav-menu > li > a:hover,
.primary-nav .nav-menu > li > a:focus {
	color: var(--color-primary);
	background: var(--color-bg-light);
	text-decoration: none;
}
.primary-nav .nav-menu > li.current-menu-item > a,
.primary-nav .nav-menu > li.current-menu-ancestor > a {
	color: var(--color-white);
	background: var(--color-primary);
	border-bottom: none !important;
}

/* ─── 4. Buttons — shimmer sweep on hover ─── */
.btn {
	position: relative;
	overflow: hidden;
}
.btn::after {
	content: '';
	position: absolute;
	top: 0;
	left: -110%;
	width: 65%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,0.22), transparent);
	transform: skewX(-22deg);
	transition: left 0.55s ease;
}
.btn:hover::after { left: 155%; }

/* ─── 5. Cards — spring lift, uniform ─── */
.card,
.fcard,
.insight-card,
.pub-card,
.icard,
.rframe,
.kframe,
.pillar-card {
	transition:
		transform   0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow  0.35s ease,
		border-color 0.22s ease !important;
}
.card:hover          { transform: translateY(-5px) !important; box-shadow: 0 10px 28px rgba(15,23,42,0.08) !important; }
.fcard:hover         { transform: translateY(-3px) !important; box-shadow: 0 10px 28px rgba(15,23,42,0.08) !important; }
.insight-card:hover  { transform: translateY(-5px) !important; box-shadow: 0 10px 28px rgba(15,23,42,0.08) !important; }
.pub-card:hover      { transform: translateX(5px)  !important; box-shadow: 0 6px 24px rgba(27,58,92,0.10) !important; }
.icard:hover         { transform: translateY(-3px) !important; box-shadow: 0 10px 28px rgba(15,23,42,0.08) !important; }

/* ─── 6. Card image overlay on hover ─── */
.card__image,
.insight-card__image,
.insight-featured__image,
.fcard__photo-wrap,
.icard__image {
	position: relative;
	overflow: hidden;
}
.card__image::after,
.insight-card__image::after,
.insight-featured__image::after,
.icard__image::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(11, 28, 52, 0.55) 0%, transparent 60%);
	opacity: 0;
	transition: opacity 0.35s ease;
	z-index: 1;
	pointer-events: none;
}
.card:hover .card__image::after,
.insight-card:hover .insight-card__image::after,
.insight-featured:hover .insight-featured__image::after,
.icard:hover .icard__image::after { opacity: 1; }

/* Image zoom stays in sync */
.card__image img,
.insight-card__image img,
.insight-featured__image img,
.fcard__img,
.icard__img {
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1) !important;
}
.card:hover .card__image img,
.insight-card:hover .insight-card__image img,
.insight-featured:hover .insight-featured__image img { transform: scale(1.07) !important; }
.fcard:hover .fcard__img  { transform: scale(1.06) !important; }
.icard:hover .icard__img  { transform: scale(1.06) !important; }

/* ─── 7. Animated section label line ─── */
.section__label {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
}
.section__label::before {
	content: '';
	display: block;
	flex-shrink: 0;
	height: 2px;
	width: 0;
	background: currentColor;
	transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.1s;
}
.section__label.is-visible::before { width: 22px; }

/* ─── 8. Page hero — entrance ─── */
.page-hero {
	position: relative;
	overflow: hidden;
}
.page-hero .container { position: relative; z-index: 1; }

.page-hero__label {
	animation: ui-entrance 0.65s cubic-bezier(0.22, 1, 0.36, 1) 0.05s both;
}
.page-hero__title {
	animation: ui-entrance 0.65s cubic-bezier(0.22, 1, 0.36, 1) 0.15s both;
}
.page-hero__subtitle {
	animation: ui-entrance 0.65s cubic-bezier(0.22, 1, 0.36, 1) 0.25s both;
}

@keyframes ui-entrance {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: none; }
}

/* ─── 9. Hero content entrance ─── */
.hero__content > * {
	animation: ui-entrance 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.hero__content > .hero__label     { animation-delay: 0.10s; }
.hero__content > .hero__title     { animation-delay: 0.22s; }
.hero__content > .hero__subtitle  { animation-delay: 0.34s; }
.hero__content > .hero__actions   { animation-delay: 0.44s; }
.hero__content > .hero__stats     { animation-delay: 0.54s; }

/* Hero stat counter flash */
@keyframes stat-tick {
	0%, 100% { opacity: 1; }
	50%       { opacity: 0.55; }
}
.hero__stat-number.is-counting {
	animation: stat-tick 0.07s step-end infinite;
}

/* ─── 10. Insight archive — modern pill tabs ─── */
.insights-tabs {
	position: sticky;
	top: var(--header-height);
	background: var(--color-white);
	z-index: 200;
	padding: 0.85rem 0;
	border-bottom: 1px solid var(--color-border-light) !important;
	margin-bottom: 2rem !important;
	gap: 0.3rem !important;
	box-shadow: 0 4px 16px rgba(27,58,92,0.06);
}
.insights-tab {
	border-radius: 100px !important;
	border-bottom: none !important;
	margin-bottom: 0 !important;
	padding: 0.4rem 0.9rem !important;
	font-size: 0.75rem !important;
	border: 1.5px solid transparent;
	transition: all 0.22s ease !important;
}
.insights-tab:hover {
	color: var(--color-primary) !important;
	background: var(--color-bg-light) !important;
	border-color: var(--color-border) !important;
}
.insights-tab.is-active {
	color: var(--color-white) !important;
	background: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
}
.insights-tab__count {
	background: rgba(255,255,255,0.2) !important;
}
.insights-tab:not(.is-active) .insights-tab__count {
	background: var(--color-bg-light) !important;
	color: var(--color-text-light) !important;
}

/* ─── 11. Insights search — pill style ─── */
.insights-search {
	border-radius: 100px !important;
	border: 1.5px solid var(--color-border) !important;
	overflow: hidden;
	transition: border-color 0.22s, box-shadow 0.22s;
}
.insights-search:focus-within {
	border-color: var(--color-accent) !important;
	box-shadow: 0 0 0 3px rgba(58,123,213,0.12);
}
.insights-search input[type="search"] {
	border: none !important;
	outline: none !important;
}
.insights-search button {
	border-radius: 0 100px 100px 0 !important;
}

/* ─── 12. Featured insight — bolder left accent ─── */
.insight-featured {
	border-left-width: 5px !important;
	transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), box-shadow 0.35s ease !important;
}
.insight-featured:hover {
	transform: translateY(-4px) !important;
	box-shadow: 0 20px 56px rgba(27,58,92,0.13) !important;
}

/* ─── 13. Pillar cards — scale + glow ─── */
.pillar-card {
	transition:
		transform  0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s ease !important;
}
.pillar-card:hover {
	transform: translateY(-10px) scale(1.025) !important;
	box-shadow: 0 24px 60px rgba(27,58,92,0.15) !important;
}

/* ─── 14. Fellows carousel — smoother easing ─── */
#fellows-track {
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1) !important;
}
.fslide {
	transition: opacity 0.3s ease !important;
}

/* ─── 15. Section mesh gradient backgrounds ─── */
.front-page .insights-section,
.front-page .fellows-section,
.front-page .partners-section {
	background-image:
		radial-gradient(ellipse at 8% 60%, rgba(58, 123, 213, 0.055) 0%, transparent 55%),
		radial-gradient(ellipse at 92% 20%, rgba(201, 139, 21, 0.04) 0%, transparent 50%);
}

/* ─── 16. Knowledge sections — subtle depth ─── */
.knowledge-section:not(.knowledge-section--alt) {
	background-image:
		radial-gradient(ellipse at 5% 50%, rgba(58, 123, 213, 0.04) 0%, transparent 55%);
}

/* ─── 17. Animated link underline ─── */
.card__link,
.insight-card__read,
.fcard__name a,
.kframe__link {
	background-image: linear-gradient(currentColor, currentColor);
	background-size: 0% 1.5px;
	background-repeat: no-repeat;
	background-position: 0 100%;
	transition:
		background-size 0.3s ease,
		gap 0.2s ease,
		color 0.2s ease !important;
}
.card__link:hover,
.insight-card__read:hover,
.fcard__name a:hover,
.kframe__link:hover {
	background-size: 100% 1.5px;
	text-decoration: none !important;
}

/* ─── 18. Pagination — pill style ─── */
.pagination .page-numbers {
	border-radius: 8px !important;
	font-weight: 700 !important;
	transition: all 0.22s ease !important;
}
.pagination .page-numbers:hover {
	background: var(--color-bg-light) !important;
	color: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
}
.pagination .page-numbers.current {
	background: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
	color: white !important;
}

/* ─── 19. Partners — smooth fade-in on hover ─── */
.partner-logo__placeholder,
.partner-logo {
	transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s ease, opacity 0.3s !important;
}
.partner-logo__placeholder:hover,
.partner-logo:hover {
	transform: translateY(-4px) !important;
	box-shadow: 0 8px 24px rgba(27,58,92,0.12) !important;
}

/* ─── 21. Focus-visible — clean ring ─── */
:focus-visible {
	outline: 2px solid var(--color-accent) !important;
	outline-offset: 3px !important;
}

/* ─── 22. Responsive — mobile tweaks ─── */
@media (max-width: 900px) {
	.insights-tabs { top: calc(var(--header-height) - 10px); }
}
@media (max-width: 640px) {
	.insights-tabs { padding: 0.65rem 0; }
	.insight-featured { border-left-width: 0 !important; border-top: 4px solid var(--color-terracotta); }
	.primary-nav .nav-menu > li.current-menu-item > a,
	.primary-nav .nav-menu > li.current-menu-ancestor > a {
		background: none;
		color: var(--color-primary);
		border-bottom: 2px solid var(--color-primary) !important;
	}
}

/* ==========================================================================
   HORIZON — Refonte globale UI/UX
   Nouveau système de design · typographie moderne · composants premium
   ========================================================================== */

/* ─── 1. Base globale ─── */
body {
	background: #FAFAF9;
	font-size: 1rem;
	line-height: 1.75;
	color: var(--color-text);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	letter-spacing: -0.02em;
	line-height: 1.2;
}

a { transition: color 0.2s ease; }

/* ─── 2. Topbar — visible (utility bar for login + socials) ─── */

/* ─── 3. Header — propre, moderne ─── */
.site-header {
	height: var(--header-height) !important;
	background: rgba(255, 255, 255, 0.97) !important;
	border-bottom: 1px solid var(--color-border-light) !important;
	box-shadow: none !important;
	transition: background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
}

.site-header.scrolled {
	background: rgba(255, 255, 255, 0.92) !important;
	backdrop-filter: blur(20px) saturate(180%) !important;
	-webkit-backdrop-filter: blur(20px) saturate(180%) !important;
	box-shadow: 0 1px 0 var(--color-border-light), 0 4px 24px rgba(0, 0, 0, 0.05) !important;
	border-bottom-color: transparent !important;
}

/* ─── 4. Navigation — navy primary at rest, accent on interaction ─── */
.primary-nav .nav-menu > li > a {
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	letter-spacing: 0em !important;
	text-transform: none !important;
	color: var(--color-primary) !important;
	padding: 0.5rem 0.9rem !important;
	border-radius: 0 !important;
	background: none !important;
	border-bottom: 2px solid transparent !important;
	margin-bottom: -1px !important;
	transition: color 0.2s, border-color 0.2s !important;
}

.primary-nav .nav-menu > li > a:hover,
.primary-nav .nav-menu > li > a:focus {
	color: var(--color-accent) !important;
	background: none !important;
	border-bottom-color: var(--color-accent) !important;
}

.primary-nav .nav-menu > li.current-menu-item > a,
.primary-nav .nav-menu > li.current-menu-ancestor > a {
	color: var(--color-accent) !important;
	background: none !important;
	border-bottom-color: var(--color-accent) !important;
}

/* Dropdown redesign */
.primary-nav .sub-menu {
	border-radius: 14px !important;
	border: 1px solid var(--color-border-light) !important;
	border-top: none !important;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.10), 0 2px 8px rgba(0, 0, 0, 0.05) !important;
	overflow: hidden !important;
	margin-top: 10px !important;
	padding: 0.4rem 0 !important;
}

.primary-nav .sub-menu li a {
	font-size: 0.85rem !important;
	font-weight: 600 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	border-left: none !important;
	padding: 0.65rem 1.3rem !important;
	color: var(--color-primary) !important;
}

.primary-nav .sub-menu li a:hover {
	background: var(--color-bg-light) !important;
	color: var(--color-accent) !important;
	border-left: none !important;
	padding-left: 1.3rem !important;
}

/* ─── 5. Header actions ─── */
.header-search-toggle {
	border-radius: 8px !important;
	border-color: var(--color-border-light) !important;
}

.nav-toggle { border-radius: 8px !important; }

/* ─── 6. Hero — grand, dramatique ─── */
.hero {
	min-height: 420px !important;
	background: linear-gradient(150deg, #060D18 0%, #0C1523 30%, #101e38 65%, #060D18 100%) !important;
}

.hero::after {
	display: none !important;
}

.hero__label {
	font-size: 0.65rem !important;
	letter-spacing: 0.2em !important;
	color: rgba(255, 255, 255, 0.45) !important;
}

.hero__title {
	font-size: clamp(1.9rem, 3.4vw, 2.85rem) !important;
	font-weight: 800 !important;
	letter-spacing: -0.025em !important;
	line-height: 1.15 !important;
	max-width: 22ch !important;
	text-wrap: balance !important;
}

.hero__subtitle {
	font-size: clamp(0.95rem, 1.3vw, 1.05rem) !important;
	line-height: 1.6 !important;
	color: rgba(255, 255, 255, 0.65) !important;
	max-width: 56ch !important;
	text-wrap: balance !important;
}

.hero__stat-number,
.hero__stat-num {
	font-size: 2.8rem !important;
	font-weight: 900 !important;
	letter-spacing: -0.04em !important;
	color: var(--color-white) !important;
}

.hero__stat-sup {
	font-size: 1.4rem !important;
	color: var(--color-gold) !important;
	vertical-align: super !important;
}

.hero__stat-label {
	font-size: 0.66rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	color: rgba(255,255,255,0.42) !important;
}

.hero__stat-label {
	font-size: 0.63rem !important;
	letter-spacing: 0.15em !important;
	color: rgba(255, 255, 255, 0.35) !important;
}

/* ─── 7. Labels de section ─── */
.section__label {
	font-size: 0.65rem !important;
	letter-spacing: 0.2em !important;
	font-weight: 700 !important;
	color: var(--color-accent) !important;
	text-transform: uppercase !important;
}

.section__label::before { display: none !important; }

/* ─── 8. Titres de section ─── */
.section__title {
	font-size: clamp(1.75rem, 3vw, 2.5rem) !important;
	font-weight: 800 !important;
	letter-spacing: -0.025em !important;
	line-height: 1.15 !important;
	color: var(--color-primary) !important;
}
.contact-copy .section__title,
.newsletter-copy .section__title { color: var(--color-white) !important; }

/* ─── 9. Boutons — pill, couleurs nettes ─── */
.btn {
	border-radius: 100px !important;
	font-family: var(--font-body) !important;
	font-weight: 700 !important;
	font-size: 0.82rem !important;
	letter-spacing: 0.03em !important;
	padding: 0.62rem 1.5rem !important;
	text-transform: none !important;
}

.btn::after { display: none !important; } /* remove shimmer */

.btn--primary {
	background: var(--color-accent) !important;
	border-color: var(--color-accent) !important;
	color: #fff !important;
	box-shadow: 0 1px 3px rgba(37, 99, 235, 0.20) !important;
}
.btn--primary:hover, .btn--primary:focus {
	background: var(--color-accent-dark) !important;
	border-color: var(--color-accent-dark) !important;
	color: #fff !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 16px rgba(37, 99, 235, 0.30) !important;
}

.btn--outline {
	background: transparent !important;
	border-color: var(--color-border) !important;
	color: var(--color-text) !important;
}
.btn--outline:hover, .btn--outline:focus {
	border-color: var(--color-accent) !important;
	color: var(--color-accent) !important;
	background: rgba(37, 99, 235, 0.04) !important;
}

.btn--outline-white {
	border-color: rgba(255, 255, 255, 0.35) !important;
	color: rgba(255, 255, 255, 0.88) !important;
	background: transparent !important;
}
.btn--outline-white:hover {
	background: rgba(255, 255, 255, 0.10) !important;
	border-color: rgba(255, 255, 255, 0.65) !important;
	color: #fff !important;
}

.btn--white {
	background: #fff !important;
	color: var(--color-accent) !important;
	border-color: #fff !important;
}
.btn--white:hover {
	background: rgba(255, 255, 255, 0.92) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
}

/* ─── 10. Tags — pill ─── */
.tag {
	border-radius: 100px !important;
	font-size: 0.65rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.09em !important;
	padding: 0.22rem 0.7rem !important;
	text-transform: uppercase !important;
}

/* ─── 11. Cards universelles — shadow propre, radius 14px ─── */
.card {
	border-radius: 14px !important;
	border: 1px solid var(--color-border-light) !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.03) !important;
}

.card:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.07), 0 24px 48px rgba(0, 0, 0, 0.05) !important;
}

.card__body {
	border-top: none !important;
	border-left: 3px solid transparent !important;
	transition: border-color 0.22s !important;
}

.card:nth-child(n) .card__body { border-top-color: transparent !important; }

.card:hover .card__body { border-left-color: var(--color-accent) !important; }

/* ─── 12. Fellow cards ─── */
.fcard {
	border-radius: 14px !important;
	border: 1px solid var(--color-border-light) !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.03) !important;
}

.fcard:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.07), 0 24px 48px rgba(0, 0, 0, 0.05) !important;
}

.fcard__body {
	border-top: 2px solid var(--color-border-light) !important;
}

.fcard:hover .fcard__body { border-top-color: var(--color-accent) !important; }

.fcard:nth-child(n) .fcard__body { border-top-color: var(--color-border-light) !important; }

.fcard__initials {
	background: linear-gradient(145deg, var(--color-primary) 0%, var(--color-accent) 100%) !important;
}

.fcard__name a:hover { color: var(--color-accent) !important; }

.fcard__position { color: var(--color-accent) !important; }

/* Dark mode — fcard body stays white (see line 6383); names must stay navy for contrast */
:root[data-theme="dark"] .fcard__name,
:root[data-theme="dark"] .fcard__name a { color: var(--color-primary) !important; }
:root[data-theme="dark"] .fcard__name a:hover { color: var(--color-accent) !important; }

/* ─── 13. Publication cards ─── */
.pub-card {
	border-radius: 10px !important;
	border: 1px solid var(--color-border-light) !important;
	border-left: 4px solid var(--color-border-light) !important;
}

.pub-card:nth-child(n) { border-left-color: var(--color-border-light) !important; }
.pub-card:hover { border-left-color: var(--color-accent) !important; }

/* ─── 14. iCards (slider homepage) ─── */
.icard { border-radius: 14px !important; }

/* ─── 15. Pillar cards (size tokens — keep aligned with main rules at L5955+) ─── */
.pillar-card__icon {
	width: 50px !important;
	height: 50px !important;
	border-radius: 12px !important;
	margin-bottom: 1.5rem !important;
}

.pillar-card__title {
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	letter-spacing: -0.015em !important;
}

.pillar-card__desc {
	font-size: 0.86rem !important;
	line-height: 1.6 !important;
}

/* ─── 16. Page hero (pages internes) ─── */
.page-hero {
	background: linear-gradient(150deg, #060D18 0%, #0C1523 35%, #101e38 75%, #060D18 100%) !important;
	padding: 4.5rem 0 5rem !important;
}

.page-hero__label {
	font-size: 0.65rem !important;
	letter-spacing: 0.2em !important;
	color: var(--color-accent) !important;
	font-weight: 700 !important;
	margin-bottom: 0.75rem !important;
}

.page-hero__title {
	font-size: clamp(2rem, 4vw, 3.1rem) !important;
	font-weight: 800 !important;
	letter-spacing: -0.03em !important;
	line-height: 1.12 !important;
	color: #fff !important;
	margin-bottom: 1rem !important;
}

.page-hero__subtitle {
	font-size: 1rem !important;
	color: rgba(255, 255, 255, 0.62) !important;
	line-height: 1.8 !important;
	max-width: 540px !important;
}

/* ─── 17. Breadcrumb ─── */
.breadcrumb {
	background: var(--color-white) !important;
	border-bottom: 1px solid var(--color-border-light) !important;
}

.breadcrumb-list a { color: var(--color-text-muted) !important; }
.breadcrumb-list a:hover { color: var(--color-accent) !important; }

/* ─── 18. Insights archive — tabs pill ─── */
.insights-tabs {
	background: var(--color-white) !important;
	border-bottom: 1px solid var(--color-border-light) !important;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04) !important;
}

.insights-tab {
	border-radius: 100px !important;
	border: 1.5px solid transparent !important;
	border-bottom: none !important;
	margin-bottom: 0 !important;
	font-size: 0.78rem !important;
	font-weight: 600 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

.insights-tab:hover {
	background: var(--color-bg-light) !important;
	color: var(--color-primary) !important;
	border-color: var(--color-border-light) !important;
}

.insights-tab.is-active {
	background: var(--color-primary) !important;
	color: #fff !important;
	border-color: var(--color-primary) !important;
}

/* ─── 19. Insight featured card ─── */
.insight-featured {
	border-radius: 16px !important;
	border: 1px solid var(--color-border-light) !important;
	border-left: none !important;
	border-top: 4px solid var(--color-accent) !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.03) !important;
}

.insight-featured__body {
	border-left: none !important;
	padding: 2.5rem !important;
}

.insight-featured__title {
	font-weight: 800 !important;
	letter-spacing: -0.02em !important;
}

/* ─── 20. Insight cards (archive grid) ─── */
.insight-card {
	border-radius: 14px !important;
	border: 1px solid var(--color-border-light) !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.insight-card:nth-child(n) .insight-card__body { border-top-color: var(--color-border-light) !important; }

/* ─── 21. Pagination ─── */
.pagination .page-numbers {
	border-radius: 10px !important;
	border-color: var(--color-border-light) !important;
	color: var(--color-text-muted) !important;
	font-weight: 600 !important;
}

.pagination .page-numbers:hover {
	background: var(--color-bg-light) !important;
	border-color: var(--color-border) !important;
	color: var(--color-primary) !important;
}

.pagination .page-numbers.current {
	background: var(--color-accent) !important;
	border-color: var(--color-accent) !important;
	color: #fff !important;
}

/* ─── 22. Knowledge page ─── */
.knowledge-tabs {
	border-bottom: 1px solid var(--color-border-light) !important;
	box-shadow: 0 2px 16px rgba(0, 0, 0, 0.04) !important;
}

.knowledge-tab {
	font-size: 0.82rem !important;
	font-weight: 600 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	border-radius: 0 !important;
	border-bottom: 2px solid transparent !important;
	background: none !important;
	color: var(--color-text-muted) !important;
	padding: 0.8rem 1.1rem !important;
}

.knowledge-tab:hover {
	color: var(--color-primary) !important;
	background: none !important;
}

.knowledge-tab.is-active {
	color: var(--color-accent) !important;
	background: none !important;
	border-bottom-color: var(--color-accent) !important;
}

.knowledge-section__title {
	font-size: clamp(1.6rem, 2.5vw, 2.2rem) !important;
	font-weight: 800 !important;
	letter-spacing: -0.025em !important;
}

.kframe {
	border-radius: 16px !important;
	border: 1px solid var(--color-border-light) !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.rframe {
	border-radius: 16px !important;
	border: 1px solid var(--color-border-light) !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
	overflow: hidden !important;
}

.rc-dot {
	border-radius: 100px !important;
}

.rc-dot--active {
	background: var(--color-accent) !important;
}

/* ─── 23. Contact section ─── */
.contact-section {
	background: linear-gradient(150deg, #060D18 0%, #0C1523 40%, #101e38 100%) !important;
}

/* ─── 24. Partners ─── */
.partner-logo__placeholder {
	border-radius: 12px !important;
	background: var(--color-bg-light) !important;
	border-color: var(--color-border-light) !important;
}

/* ─── 25. Footer ─── */
.site-footer {
	background: #060D18 !important;
}

.footer-main {
	border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.footer-col__title {
	font-size: 0.65rem !important;
	letter-spacing: 0.18em !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: rgba(255, 255, 255, 0.35) !important;
	margin-bottom: 1rem !important;
}

.site-logo-footer .logo-abbr {
	font-family: var(--font-heading) !important;
	font-weight: 800 !important;
}

/* Footer newsletter */
.footer-newsletter-form input[type="email"] {
	border-radius: 8px 0 0 8px !important;
}
.footer-newsletter-form .btn {
	border-radius: 0 8px 8px 0 !important;
}

/* ─── 27. Back to top ─── */
#back-to-top {
	border-radius: 12px !important;
}

/* ─── 28. Inputs / formulaires ─── */
input[type="text"],
input[type="email"],
input[type="search"],
textarea,
select,
.kframe-filter-select {
	border-radius: 8px !important;
	border-color: var(--color-border) !important;
	font-family: var(--font-body) !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus,
.kframe-filter-select:focus {
	border-color: var(--color-accent) !important;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10) !important;
	outline: none !important;
}

/* ─── 29. Slider buttons ─── */
.rc-nav {
	border-radius: 100px !important;
	background: var(--color-white) !important;
	border: 1.5px solid var(--color-border) !important;
	color: var(--color-text-muted) !important;
}

.rc-nav:hover {
	background: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
	color: #fff !important;
}

/* ─── 30. Sections alternées — fond propre ─── */
.knowledge-section--alt,
.insights-slider {
	background: var(--color-bg-light) !important;
}

/* ─── 31. Surveys placeholder ─── */
.surveys-placeholder {
	border-radius: 16px !important;
	background: var(--color-white) !important;
	border: 1px solid var(--color-border-light) !important;
}

/* ─── 32. Responsive ─── */
@media (max-width: 900px) {
	.hero__title { font-size: clamp(2rem, 6vw, 3rem) !important; }
	.section__title { font-size: clamp(1.5rem, 4vw, 2rem) !important; }
	.page-hero__title { font-size: clamp(1.75rem, 5vw, 2.5rem) !important; }
}

@media (max-width: 600px) {
	.hero { min-height: 360px !important; }
	.hero__title { font-size: clamp(1.8rem, 7vw, 2.5rem) !important; }
}

/* ==========================================================================
   Dark mode — activé par [data-theme="dark"] sur <html>
   ========================================================================== */

:root[data-theme="dark"] {
	/* --color-primary reste sombre : utilisé comme fond pour le hero, le footer, .tag--dark, .page-hero, le skip-link, etc. */
	--color-text:         #E2E8F0;   /* slate-200 */
	--color-text-muted:   #94A3B8;   /* slate-400 */
	--color-text-light:   #64748B;   /* slate-500 */
	--color-bg-light:     #1E293B;   /* slate-800 — sections alt */
	--color-bg-warm:      #1F1B14;   /* terre sombre */
	--color-border:       #334155;   /* slate-700 */
	--color-border-light: #1E293B;
	--color-surface:      #0F172A;   /* slate-900 — base body */
	--color-surface-2:    #111C30;   /* surfaces (cards) */
	--shadow-card:        0 1px 3px rgba(0, 0, 0, 0.4), 0 4px 12px rgba(0, 0, 0, 0.35);
	--shadow-hover:       0 8px 24px rgba(0, 0, 0, 0.55), 0 24px 48px rgba(0, 0, 0, 0.4);
	color-scheme: dark;
}

/* Tous les titres et libellés qui utilisent var(--color-primary) comme couleur de texte
   doivent basculer en clair en mode sombre. */
:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] h4,
:root[data-theme="dark"] h5,
:root[data-theme="dark"] h6,
:root[data-theme="dark"] blockquote,
:root[data-theme="dark"] .site-logo a,
:root[data-theme="dark"] .site-logo .logo-abbr,
:root[data-theme="dark"] .card__title,
:root[data-theme="dark"] .card__link:hover,
:root[data-theme="dark"] .pub-card__title,
:root[data-theme="dark"] .event-card__title,
:root[data-theme="dark"] .insight-card__title,
:root[data-theme="dark"] .publication-card__title,
:root[data-theme="dark"] .fellow-card__title,
:root[data-theme="dark"] .fcard__profile-link,
:root[data-theme="dark"] .dataset-card__title,
:root[data-theme="dark"] .article-title,
:root[data-theme="dark"] .partners-section__title,
:root[data-theme="dark"] .pillar-card__title,
:root[data-theme="dark"] .section__title,
:root[data-theme="dark"] .page-hero__title,
:root[data-theme="dark"] .widget-title,
:root[data-theme="dark"] .footer-title,
:root[data-theme="dark"] .footer-widget-title {
	color: var(--color-text);
}

/* Navigation principale — état par défaut blanc en dark (override sur les !important light) */
:root[data-theme="dark"] .primary-nav .nav-menu > li > a {
	color: var(--color-text) !important;
}
:root[data-theme="dark"] .primary-nav .sub-menu li a {
	color: var(--color-text) !important;
}
/* Hover / focus / current — passent en cobalt pour rester visibles sur dark */
:root[data-theme="dark"] .primary-nav .nav-menu > li > a:hover,
:root[data-theme="dark"] .primary-nav .nav-menu > li > a:focus,
:root[data-theme="dark"] .primary-nav .nav-menu > li.current-menu-item > a,
:root[data-theme="dark"] .primary-nav .nav-menu > li.current-menu-ancestor > a,
:root[data-theme="dark"] .primary-nav .sub-menu li a:hover,
:root[data-theme="dark"] .primary-nav .sub-menu li.current-menu-item > a {
	color: var(--color-accent) !important;
}

:root[data-theme="dark"] .primary-nav .sub-menu {
	background-color: var(--color-surface-2);
	border-color: var(--color-border);
	border-top-color: var(--color-accent);
}

:root[data-theme="dark"] .primary-nav .sub-menu li {
	border-bottom-color: var(--color-border);
}

:root[data-theme="dark"] .primary-nav .sub-menu li a {
	color: var(--color-text);
}

:root[data-theme="dark"] .primary-nav .sub-menu li a:hover,
:root[data-theme="dark"] .primary-nav .sub-menu li.current-menu-item > a {
	background-color: var(--color-bg-light);
}

/* Hover des toggle buttons (search & theme) — doivent rester visibles */
:root[data-theme="dark"] .header-search-toggle:hover,
:root[data-theme="dark"] .header-theme-toggle:hover,
:root[data-theme="dark"] .header-theme-toggle:focus-visible {
	color: var(--color-text);
	border-color: var(--color-text);
}

/* Boutons "outline-dark" : encadré sombre invisible sur fond sombre */
:root[data-theme="dark"] .btn--outline-dark {
	color: var(--color-text);
	border-color: var(--color-border);
}
:root[data-theme="dark"] .btn--outline-dark:hover {
	background-color: var(--color-surface-2);
	color: var(--color-text);
	border-color: var(--color-text);
}

/* Body / base */
:root[data-theme="dark"] body {
	background-color: var(--color-surface);
	color: var(--color-text);
}

/* Surfaces blanches → surface-2 */
:root[data-theme="dark"] .site-header,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .event-card,
:root[data-theme="dark"] .insight-card,
:root[data-theme="dark"] .publication-card,
:root[data-theme="dark"] .fellow-card,
:root[data-theme="dark"] .surveys-placeholder,
:root[data-theme="dark"] .rc-nav {
	background-color: var(--color-surface-2) !important;
	border-color: var(--color-border);
}

:root[data-theme="dark"] .site-header {
	border-bottom-color: var(--color-border);
}

/* Panneau de recherche */
:root[data-theme="dark"] .header-search-panel {
	background: var(--color-surface-2);
	border-top-color: var(--color-border);
}

:root[data-theme="dark"] .search-box,
:root[data-theme="dark"] input[type="search"],
:root[data-theme="dark"] input[type="text"],
:root[data-theme="dark"] input[type="email"],
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select {
	background-color: var(--color-surface);
	color: var(--color-text);
	border-color: var(--color-border);
}

:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
	color: var(--color-text-light);
}

/* Sections alternées : motif Adinkra reste discret */
:root[data-theme="dark"] .section--alt {
	background-color: var(--color-bg-light);
}

/* Blockquote */
:root[data-theme="dark"] blockquote {
	background: var(--color-bg-light);
	color: var(--color-text);
}

/* Tags & badges qui ont un fond clair */
:root[data-theme="dark"] .tag:not(.tag--dark):not(.tag--terracotta):not(.tag--gold):not(.tag--green) {
	background-color: rgba(255, 255, 255, 0.06);
	color: var(--color-text);
}

/* Boutons "white" : adaptation surface sombre */
:root[data-theme="dark"] .btn--white {
	background-color: var(--color-surface-2);
	color: var(--color-text);
	border-color: var(--color-border);
}

/* Liens dans le corps */
:root[data-theme="dark"] a { color: #60A5FA; }
:root[data-theme="dark"] a:hover,
:root[data-theme="dark"] a:focus { color: #93C5FD; }

/* Placeholder d'image */
:root[data-theme="dark"] .thumbnail-placeholder {
	background-color: var(--color-bg-light);
}

/* Sections explicitement claires utilisées dans certains templates */
:root[data-theme="dark"] .knowledge-section--alt,
:root[data-theme="dark"] .insights-slider {
	background: var(--color-bg-light) !important;
}

/* Pillar cards (Analytics · Data · Research · Initiative) */
:root[data-theme="dark"] .pillar-section { background: var(--color-surface); }
:root[data-theme="dark"] .pillar-card {
	background: var(--color-surface-2);
	border-color: var(--color-border);
	color: var(--color-text);
}
:root[data-theme="dark"] .pillar-card::before {
	background: linear-gradient(135deg, transparent 60%, rgba(255, 255, 255, 0.04) 100%);
}
:root[data-theme="dark"] .pillar-card__title { color: var(--color-text); }
:root[data-theme="dark"] .pillar-card__desc  { color: var(--color-text-muted); }
/* Pastilles d'icônes : un peu plus opaques pour rester lisibles sur fond sombre */
:root[data-theme="dark"] .pillar-card__icon--blue       { background: rgba(96, 165, 250, 0.16); }
:root[data-theme="dark"] .pillar-card__icon--green      { background: rgba(34, 197, 94, 0.16); }
:root[data-theme="dark"] .pillar-card__icon--terracotta { background: rgba(224, 80, 38, 0.18); }
:root[data-theme="dark"] .pillar-card__icon--gold       { background: rgba(217, 119, 6, 0.18); }

/* Partners & Affiliates */
:root[data-theme="dark"] .partners-section {
	background: var(--color-surface);
	border-top-color: var(--color-border);
}
:root[data-theme="dark"] .partners-section__title { color: var(--color-text); }
/* Le mesh gradient du front-page reste mais beaucoup plus subtil */
:root[data-theme="dark"] .front-page .insights-section,
:root[data-theme="dark"] .front-page .fellows-section,
:root[data-theme="dark"] .front-page .partners-section {
	background-color: var(--color-surface);
	background-image:
		radial-gradient(ellipse at 8% 60%, rgba(96, 165, 250, 0.05) 0%, transparent 55%),
		radial-gradient(ellipse at 92% 20%, rgba(217, 119, 6, 0.04) 0%, transparent 50%);
}
/* Logos partenaires : on désactive le grayscale en mode sombre pour conserver
   la couleur de marque, et on les pose sur une plaque claire arrondie afin
   que les logos sombres/transparents restent lisibles sur fond sombre.
   Les dimensions fixes de .partner-logo (160×64) garantissent l'alignement. */
:root[data-theme="dark"] .partner-logo {
	background-color: rgba(255, 255, 255, 0.92);
	border-radius: var(--border-radius);
}
:root[data-theme="dark"] .partner-logo img {
	filter: none;
	opacity: 1;
}
:root[data-theme="dark"] .partner-logo:hover {
	background-color: var(--color-white);
}
:root[data-theme="dark"] .partner-logo__placeholder {
	background: var(--color-bg-light);
	border-color: var(--color-border);
}

/* Sections knowledge avec dégradé subtil */
:root[data-theme="dark"] .knowledge-section:not(.knowledge-section--alt) {
	background-color: var(--color-surface);
	background-image:
		radial-gradient(ellipse at 5% 50%, rgba(96, 165, 250, 0.05) 0%, transparent 55%);
}

/* Override !important pour titres surchargés ailleurs avec !important */
:root[data-theme="dark"] .section__title,
:root[data-theme="dark"] .section__title--flush {
	color: var(--color-text) !important;
}

/* Évite le flash lors du chargement (les transitions sur bg sont coupées au boot) */
:root[data-theme-booting] *,
:root[data-theme-booting] *::before,
:root[data-theme-booting] *::after {
	transition: none !important;
}

/* ==========================================================================
   SINGLE INSIGHT / PUBLICATION — Executive Brief layout (Direction A)
   ========================================================================== */

/* Reading progress bar */
.reading-progress {
	position: fixed; top: 0; left: 0; right: 0;
	height: 3px; z-index: 200; pointer-events: none;
}
.reading-progress__bar {
	height: 100%; width: 100%;
	background: linear-gradient(to right, var(--color-accent), var(--color-gold));
	transform: scaleX(0); transform-origin: left center;
	transition: transform 0.05s linear;
}

/* Breadcrumb strip */
.brief-breadcrumb {
	background: var(--color-bg-light);
	border-bottom: 1px solid var(--color-border-light);
	font-size: 0.78rem; color: var(--color-text-muted);
}
.brief-breadcrumb .container {
	display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem;
	padding-top: 0.7rem; padding-bottom: 0.7rem;
}
.brief-breadcrumb a { color: var(--color-text-muted); text-decoration: none; transition: color var(--transition); }
.brief-breadcrumb a:hover { color: var(--color-primary); }
.brief-breadcrumb span[aria-hidden] { color: var(--color-border); }
.brief-breadcrumb [aria-current] { color: var(--color-primary); font-weight: 600; }

/* ── Hero — 2 cols (text left, image right) + Kuba pattern overlay ── */
.brief-hero {
	background: var(--color-white);
	position: relative;
	overflow: hidden;
}
.brief-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M2,2 L22,2 L22,10 L10,10 L10,22 L2,22 Z' fill='none' stroke='rgba(12,21,35,0.16)' stroke-width='1.1'/%3E%3Cpath d='M46,2 L26,2 L26,10 L38,10 L38,22 L46,22 Z' fill='none' stroke='rgba(12,21,35,0.16)' stroke-width='1.1'/%3E%3Cpath d='M2,46 L22,46 L22,38 L10,38 L10,26 L2,26 Z' fill='none' stroke='rgba(12,21,35,0.16)' stroke-width='1.1'/%3E%3Cpath d='M46,46 L26,46 L26,38 L38,38 L38,26 L46,26 Z' fill='none' stroke='rgba(12,21,35,0.16)' stroke-width='1.1'/%3E%3Crect x='22' y='22' width='4' height='4' fill='rgba(217,119,6,0.4)'/%3E%3Cline x1='22' y1='10' x2='26' y2='10' stroke='rgba(12,21,35,0.1)' stroke-width='0.8'/%3E%3Cline x1='22' y1='38' x2='26' y2='38' stroke='rgba(12,21,35,0.1)' stroke-width='0.8'/%3E%3Cline x1='10' y1='22' x2='10' y2='26' stroke='rgba(12,21,35,0.1)' stroke-width='0.8'/%3E%3Cline x1='38' y1='22' x2='38' y2='26' stroke='rgba(12,21,35,0.1)' stroke-width='0.8'/%3E%3C/svg%3E");
	background-size: 48px 48px;
	opacity: 0.36;
}
.brief-hero__inner {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: 3.5rem;
	padding: 3.5rem 1.5rem 3rem;
	align-items: center;
}
@media (max-width: 900px) {
	.brief-hero__inner { grid-template-columns: 1fr; gap: 2.25rem; padding-top: 2.5rem; padding-bottom: 2.25rem; }
}

.brief-hero__text { min-width: 0; }

.brief-hero__eyebrow {
	display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
	font-family: var(--font-body);
	font-size: 0.7rem; font-weight: 700;
	letter-spacing: 0.16em;
	color: var(--color-accent);
	margin-bottom: 1.25rem;
}
.brief-hero__eyebrow-kind { color: var(--color-accent); }
.brief-hero__eyebrow-dot { color: var(--color-border); font-weight: 400; }
.brief-hero__eyebrow span:not(.brief-hero__eyebrow-kind):not(.brief-hero__eyebrow-dot) {
	color: var(--color-text-muted);
}

.brief-hero__title {
	font-family: var(--font-heading);
	font-size: clamp(1.85rem, 3.5vw, 2.85rem) !important;
	font-weight: 700;
	color: var(--color-primary) !important;
	letter-spacing: -0.02em;
	line-height: 1.18;
	margin: 0 0 1.75rem !important;
}

.brief-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0 2.25rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--color-border-light);
}
.brief-hero__meta-item {
	display: flex; flex-direction: column; gap: 0.2rem;
	padding-block: 0.65rem;
}
.brief-hero__meta-label {
	font-family: var(--font-body);
	font-size: 0.62rem; font-weight: 700;
	letter-spacing: 0.14em; text-transform: uppercase;
	color: var(--color-text-muted);
}
.brief-hero__meta-value {
	font-size: 0.92rem; font-weight: 600;
	color: var(--color-primary);
}
.brief-hero__meta-link { color: var(--color-accent) !important; text-decoration: underline; text-underline-offset: 3px; }

.brief-hero__actions {
	display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
	margin-top: 1.5rem;
}

/* Download CTA on publications */
.brief-download {
	display: inline-flex; align-items: center; gap: 0.55rem;
	padding: 0.7rem 1.25rem;
	background: var(--color-accent); color: var(--color-white);
	border: 1px solid var(--color-accent);
	border-radius: 999px;
	font-family: var(--font-body);
	font-size: 0.85rem; font-weight: 700;
	letter-spacing: 0.04em;
	text-decoration: none;
	transition: background var(--transition), border-color var(--transition), transform 0.15s ease, box-shadow var(--transition);
	margin-right: 0.5rem;
	box-shadow: 0 2px 8px rgba(0, 153, 230, 0.22);
}
.brief-download:hover {
	background: var(--color-accent-dark); border-color: var(--color-accent-dark);
	color: var(--color-white); text-decoration: none;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(0, 153, 230, 0.3);
}

/* Share icon buttons */
.brief-share {
	display: inline-flex; align-items: center; justify-content: center;
	width: 36px; height: 36px;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: 50%;
	color: var(--color-text-muted);
	cursor: pointer; text-decoration: none;
	transition: all 0.15s ease;
}
.brief-share:hover { border-color: var(--color-accent); color: var(--color-accent); text-decoration: none; transform: translateY(-1px); }
.brief-share.is-copied { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-white); }

/* Cover image — fills the right column */
.brief-hero__cover {
	border-radius: var(--border-radius-sm);
	overflow: hidden;
	box-shadow: 0 4px 16px rgba(12, 21, 35, 0.1), 0 24px 60px rgba(12, 21, 35, 0.08);
}
.brief-hero__cover-img {
	display: block;
	width: 100%; height: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/* Tricolor accent bar under the hero */
.brief-hero__bar {
	height: 4px;
	background: linear-gradient(
		to right,
		var(--color-terracotta) 0%, var(--color-terracotta) 33.33%,
		var(--color-gold)       33.33%, var(--color-gold)       66.66%,
		var(--color-accent)     66.66%, var(--color-accent)     100%
	);
}

/* ── Body — single column 720px centered ── */
.brief-body { padding: 3rem 0 4rem; background: var(--color-white); }
.brief-body__inner { max-width: 720px; margin-inline: auto; padding-inline: 1rem; }

/* Key Highlights callout */
.brief-highlights {
	margin: 0 0 2.5rem;
	padding: 1.25rem 1.5rem 1.4rem;
	background: rgba(0, 153, 230, 0.06);
	border-left: 4px solid var(--color-accent);
	border-radius: 0 var(--border-radius-sm) var(--border-radius-sm) 0;
}
.brief-highlights__label {
	display: block;
	font-family: var(--font-body);
	font-size: 0.65rem; font-weight: 700;
	letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--color-accent);
	margin-bottom: 0.85rem;
}
.brief-highlights__list {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-direction: column; gap: 0.55rem;
}
.brief-highlights__list li {
	position: relative;
	padding-left: 1.25rem;
	font-size: 0.95rem; line-height: 1.55;
	color: var(--color-primary);
}
.brief-highlights__list li::before {
	content: ''; position: absolute;
	left: 0; top: 0.6rem;
	width: 6px; height: 6px;
	background: var(--color-accent);
	border-radius: 50%;
}

/* Pull-out stat — floating box */
.brief-pullout {
	float: right;
	width: 250px;
	margin: 0.5rem 0 1.25rem 1.75rem;
	padding: 1.5rem 1.4rem;
	background: var(--color-primary);
	color: var(--color-white);
	border-radius: var(--border-radius-sm);
	text-align: center;
}
.brief-pullout__value {
	display: block;
	font-family: var(--font-heading);
	font-size: 2.85rem; font-weight: 800;
	color: var(--color-accent);
	line-height: 1;
	letter-spacing: -0.02em;
	margin-bottom: 0.65rem;
}
.brief-pullout__label {
	display: block;
	font-family: var(--font-body);
	font-size: 0.82rem; line-height: 1.45;
	color: rgba(255, 255, 255, 0.85);
}
@media (max-width: 600px) {
	.brief-pullout { float: none; width: 100%; margin: 0 0 1.5rem; }
}

/* Body typography — sober, no drop cap */
.brief-content {
	font-size: 1.05rem; line-height: 1.75;
	color: var(--color-text);
}
.brief-content p { margin: 0 0 1.4rem; }
.brief-content p:last-child { margin: 0; }

.brief-content h2 {
	font-family: var(--font-heading);
	font-size: 1.5rem; font-weight: 700;
	color: var(--color-primary);
	letter-spacing: -0.015em;
	margin: 2.75rem 0 1rem;
	padding-top: 1rem;
	border-top: 1px solid var(--color-border-light);
}
.brief-content h3 {
	font-family: var(--font-heading);
	font-size: 1.2rem; font-weight: 700;
	color: var(--color-primary);
	margin: 2rem 0 0.75rem;
}

.brief-content ul,
.brief-content ol { margin: 0 0 1.4rem 1.5rem; padding: 0; }
.brief-content li { margin-bottom: 0.5rem; line-height: 1.7; }

.brief-content blockquote {
	margin: 2rem 0;
	padding: 0 0 0 1.5rem;
	background: none; border: 0;
	border-left: 3px solid var(--color-accent);
	font-family: var(--font-heading);
	font-size: 1.15rem; line-height: 1.55;
	font-style: italic;
	font-weight: 500;
	color: var(--color-primary);
}
.brief-content blockquote::before { display: none; }
.brief-content blockquote p { margin: 0 0 0.5rem; }
.brief-content blockquote p:last-child { margin: 0; }

.brief-content a {
	color: var(--color-accent);
	text-decoration: underline; text-underline-offset: 3px;
	text-decoration-thickness: 1.5px;
}
.brief-content a:hover { color: var(--color-accent-dark); }

.brief-content strong { font-weight: 700; color: var(--color-primary); }

.brief-content img { display: block; max-width: 100%; height: auto; border-radius: var(--border-radius-sm); margin: 2rem auto; }
.brief-content figure { margin: 2rem 0; }
.brief-content figcaption {
	font-size: 0.82rem; color: var(--color-text-muted);
	text-align: center; margin-top: 0.65rem; font-style: italic;
}

/* Citation block (publications) */
.brief-cite {
	clear: both;
	margin: 2.75rem 0 0;
	padding: 1.5rem 1.75rem;
	background: var(--color-bg-light);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius-sm);
	position: relative;
}
.brief-cite__label {
	display: block;
	font-family: var(--font-body);
	font-size: 0.65rem; font-weight: 700;
	letter-spacing: 0.14em; text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.6rem;
}
.brief-cite__text {
	font-family: var(--font-heading);
	font-size: 0.92rem; line-height: 1.6;
	color: var(--color-text);
	margin: 0 0 0.85rem;
}
.brief-cite__text em { color: var(--color-primary); font-weight: 600; }
.brief-cite__copy {
	background: transparent; border: 0; padding: 0; cursor: pointer;
	font-family: var(--font-body);
	font-size: 0.75rem; font-weight: 700;
	letter-spacing: 0.06em; text-transform: uppercase;
	color: var(--color-accent);
}
.brief-cite__copy:hover { color: var(--color-accent-dark); }

/* Compact author footer */
.brief-author {
	clear: both;
	display: flex; align-items: center; gap: 1rem;
	margin: 2.5rem 0 0;
	padding: 1.25rem 0 0;
	border-top: 1px solid var(--color-border-light);
}
.brief-author__avatar { border-radius: 50%; width: 48px; height: 48px; flex-shrink: 0; }
.brief-author__icon {
	width: 48px; height: 48px;
	border-radius: 50%;
	background: var(--color-bg-light);
	color: var(--color-accent);
	display: flex; align-items: center; justify-content: center;
	flex-shrink: 0;
}
.brief-author__body { flex: 1; min-width: 0; }
.brief-author__name { display: block; font-family: var(--font-heading); font-size: 0.95rem; font-weight: 700; color: var(--color-primary); }
.brief-author__bio { display: block; font-size: 0.82rem; color: var(--color-text-muted); margin-top: 0.15rem; }
.brief-author__link {
	display: inline-flex; align-items: center; gap: 0.35rem;
	font-size: 0.78rem; font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--color-accent); text-decoration: none;
	flex-shrink: 0;
}
.brief-author__link:hover { color: var(--color-accent-dark); text-decoration: none; }

/* Sticky PDF button (publications) */
.brief-sticky-pdf {
	position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 100;
	display: inline-flex; align-items: center; gap: 0.45rem;
	padding: 0.75rem 1.1rem;
	background: var(--color-accent); color: var(--color-white);
	border-radius: 999px;
	font-family: var(--font-body);
	font-size: 0.82rem; font-weight: 700;
	letter-spacing: 0.06em; text-transform: uppercase;
	text-decoration: none;
	box-shadow: 0 4px 16px rgba(0, 153, 230, 0.32), 0 12px 24px rgba(12, 21, 35, 0.16);
	transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
}
.brief-sticky-pdf:hover { background: var(--color-accent-dark); color: var(--color-white); transform: translateY(-2px); text-decoration: none; }
@media (max-width: 600px) {
	.brief-sticky-pdf { bottom: 1rem; right: 1rem; padding: 0.6rem 0.85rem; }
	.brief-sticky-pdf__text { display: none; }
}

/* ── Related — 3 uniform cards ── */
.brief-related {
	padding: 3.5rem 0 4rem;
	background: var(--color-bg-light);
	border-top: 1px solid var(--color-border-light);
}
.brief-related__head {
	display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline;
	gap: 1rem;
	margin-bottom: 1.75rem;
	padding-bottom: 1rem;
	border-bottom: 2px solid var(--color-primary);
}
.brief-related__title {
	font-family: var(--font-heading);
	font-size: 1.4rem; font-weight: 700;
	color: var(--color-primary);
	letter-spacing: -0.015em;
	margin: 0;
}
.brief-related__all {
	font-family: var(--font-body);
	font-size: 0.78rem; font-weight: 700;
	letter-spacing: 0.06em; text-transform: uppercase;
	color: var(--color-accent); text-decoration: none;
}
.brief-related__all:hover { color: var(--color-accent-dark); }

.brief-related__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
}
@media (max-width: 900px) { .brief-related__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .brief-related__grid { grid-template-columns: 1fr; } }

.brief-rel-card {
	background: var(--color-white);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius-sm);
	overflow: hidden;
	transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}
.brief-rel-card:hover {
	transform: translateY(-3px);
	border-color: var(--color-accent);
	box-shadow: 0 8px 24px rgba(12, 21, 35, 0.08);
}
.brief-rel-card__link { display: block; text-decoration: none; color: inherit; }
.brief-rel-card__link:hover { text-decoration: none; color: inherit; }

.brief-rel-card__img-wrap { aspect-ratio: 16 / 10; overflow: hidden; background: var(--color-bg-light); }
.brief-rel-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.brief-rel-card:hover .brief-rel-card__img { transform: scale(1.04); }

.brief-rel-card__body { padding: 1rem 1.15rem 1.25rem; }
.brief-rel-card__meta {
	display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
	margin-bottom: 0.5rem; font-size: 0.68rem;
}
.brief-rel-card__tag {
	font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
	color: var(--color-accent);
}
.brief-rel-card__date { color: var(--color-text-muted); }

.brief-rel-card__title {
	font-family: var(--font-heading);
	font-size: 1rem; font-weight: 700;
	color: var(--color-primary);
	line-height: 1.35;
	margin: 0 0 0.4rem;
}
.brief-rel-card__authors {
	display: block;
	font-size: 0.78rem; color: var(--color-text-muted);
}

/* Mobile */
@media (max-width: 720px) {
	.brief-hero__inner { padding-left: 1rem; padding-right: 1rem; }
	.brief-content { font-size: 1rem; line-height: 1.7; }
	.brief-author { flex-wrap: wrap; }
}

/* Dark mode */
:root[data-theme="dark"] .brief-breadcrumb,
:root[data-theme="dark"] .brief-related { background: var(--color-surface); border-color: var(--color-border); }
:root[data-theme="dark"] .brief-hero,
:root[data-theme="dark"] .brief-body { background: var(--color-surface-2); }
:root[data-theme="dark"] .brief-hero::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M2,2 L22,2 L22,10 L10,10 L10,22 L2,22 Z' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1.1'/%3E%3Cpath d='M46,2 L26,2 L26,10 L38,10 L38,22 L46,22 Z' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1.1'/%3E%3Cpath d='M2,46 L22,46 L22,38 L10,38 L10,26 L2,26 Z' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1.1'/%3E%3Cpath d='M46,46 L26,46 L26,38 L38,38 L38,26 L46,26 Z' fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='1.1'/%3E%3Crect x='22' y='22' width='4' height='4' fill='rgba(217,119,6,0.5)'/%3E%3Cline x1='22' y1='10' x2='26' y2='10' stroke='rgba(255,255,255,0.1)' stroke-width='0.8'/%3E%3Cline x1='22' y1='38' x2='26' y2='38' stroke='rgba(255,255,255,0.1)' stroke-width='0.8'/%3E%3Cline x1='10' y1='22' x2='10' y2='26' stroke='rgba(255,255,255,0.1)' stroke-width='0.8'/%3E%3Cline x1='38' y1='22' x2='38' y2='26' stroke='rgba(255,255,255,0.1)' stroke-width='0.8'/%3E%3C/svg%3E");
	opacity: 0.45;
}
:root[data-theme="dark"] .brief-highlights { background: rgba(0, 153, 230, 0.12); }
:root[data-theme="dark"] .brief-cite,
:root[data-theme="dark"] .brief-share,
:root[data-theme="dark"] .brief-rel-card { background: var(--color-surface); border-color: var(--color-border); color: var(--color-text); }
:root[data-theme="dark"] .brief-content h2,
:root[data-theme="dark"] .brief-content h3,
:root[data-theme="dark"] .brief-content strong,
:root[data-theme="dark"] .brief-content blockquote,
:root[data-theme="dark"] .brief-highlights__list li,
:root[data-theme="dark"] .brief-rel-card__title,
:root[data-theme="dark"] .brief-author__name,
:root[data-theme="dark"] .brief-related__title,
:root[data-theme="dark"] .brief-hero__title,
:root[data-theme="dark"] .brief-hero__meta-value { color: var(--color-text) !important; }
:root[data-theme="dark"] .brief-author__icon { background: var(--color-surface-2); }

/* ==========================================================================
   DIGITAL INTELLIGENCE DATA VIEWER — /knowledge#data
   Two-pane layout: dataset list (left) + dynamic frame (right).
   ========================================================================== */

.data-viewer { font-family: var(--font-body); }

.data-viewer__state {
	padding: 3rem 1rem;
	text-align: center;
	color: var(--color-text-muted);
	background: var(--color-bg-light);
	border-radius: var(--border-radius);
}
.data-viewer__state--error {
	background: rgba(224, 80, 38, 0.08);
	color: var(--color-terracotta);
}

.data-viewer__layout {
	display: grid;
	grid-template-columns: 300px 1fr;
	gap: 1.5rem;
	align-items: start;
}

@media (max-width: 900px) {
	.data-viewer__layout { grid-template-columns: 1fr; }
}

/* ── Left sidebar ── */
.data-viewer__sidebar {
	background: var(--color-white);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius);
	padding: 1.25rem 1rem;
	position: sticky;
	top: 5.5rem;
}

@media (max-width: 900px) {
	.data-viewer__sidebar { position: static; }
}

.data-viewer__sidebar-title {
	font-family: var(--font-body);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin: 0 0 0.85rem;
	padding-bottom: 0.6rem;
	border-bottom: 1px solid var(--color-border-light);
}

.data-viewer__list {
	list-style: none;
	margin: 0 0 0.85rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.data-viewer__item {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	padding: 0.65rem 0.7rem;
	border-radius: var(--border-radius-sm);
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.data-viewer__item:hover { background: var(--color-bg-light); }
.data-viewer__item:focus-visible {
	outline: 2px solid var(--color-accent);
	outline-offset: 2px;
}

.data-viewer__item.is-active {
	background: rgba(0, 153, 230, 0.08);
	color: var(--color-primary);
}

.data-viewer__item-arrow {
	color: var(--color-text-light);
	font-size: 1.1rem;
	line-height: 1.2;
	flex-shrink: 0;
}
.data-viewer__item.is-active .data-viewer__item-arrow { color: var(--color-accent); }

.data-viewer__item-body { min-width: 0; flex: 1; }

.data-viewer__item-title {
	display: block;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--color-text);
	line-height: 1.35;
	margin-bottom: 0.15rem;
}
.data-viewer__item.is-active .data-viewer__item-title { color: var(--color-primary); }

.data-viewer__item-meta {
	font-size: 0.7rem;
	color: var(--color-text-muted);
}

.data-viewer__toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.15rem;
	width: 100%;
	padding: 0.6rem 0.85rem;
	margin-top: 0.4rem;
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	color: var(--color-accent);
	font-family: var(--font-body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	cursor: pointer;
	transition: border-color 0.15s ease, color 0.15s ease;
}
.data-viewer__toggle:hover {
	border-color: var(--color-accent);
}

/* ── Search input (shown when expanded) ── */
.data-viewer__search {
	position: relative;
	display: flex;
	align-items: center;
	margin-bottom: 0.5rem;
}
.data-viewer__search-icon {
	position: absolute;
	left: 0.65rem;
	width: 15px;
	height: 15px;
	color: var(--color-text-muted);
	pointer-events: none;
}
.data-viewer__search-input {
	width: 100%;
	padding: 0.55rem 2.1rem 0.55rem 2rem;
	font-family: var(--font-body);
	font-size: 0.85rem;
	color: var(--color-primary);
	background: var(--color-bg-light);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
	-webkit-appearance: none;
	appearance: none;
}
.data-viewer__search-input:focus {
	outline: none;
	border-color: var(--color-accent);
	background: var(--color-white);
	box-shadow: 0 0 0 3px rgba(0, 153, 230, 0.12);
}
.data-viewer__search-input::placeholder { color: var(--color-text-muted); opacity: 0.7; }
.data-viewer__search-input::-webkit-search-cancel-button { display: none; }
.data-viewer__search-clear {
	position: absolute;
	right: 0.5rem;
	width: 22px;
	height: 22px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--color-border-light);
	color: var(--color-text);
	border: none;
	border-radius: 50%;
	font-size: 0.95rem;
	font-weight: 700;
	cursor: pointer;
	line-height: 1;
	transition: background 0.15s ease;
}
.data-viewer__search-clear:hover { background: var(--color-text-muted); color: var(--color-white); }

/* ── List wrap: scrollable when expanded ── */
.data-viewer__list-wrap {
	position: relative;
}
.data-viewer__list-wrap.is-scrollable {
	max-height: 480px;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding-right: 4px;
	border-top: 1px solid var(--color-border-light);
	padding-top: 0.35rem;
	scrollbar-width: thin;
	scrollbar-color: var(--color-border) transparent;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, black 8px, black calc(100% - 16px), transparent 100%);
	        mask-image: linear-gradient(to bottom, transparent 0, black 8px, black calc(100% - 16px), transparent 100%);
}
.data-viewer__list-wrap.is-scrollable::-webkit-scrollbar { width: 8px; }
.data-viewer__list-wrap.is-scrollable::-webkit-scrollbar-track { background: transparent; }
.data-viewer__list-wrap.is-scrollable::-webkit-scrollbar-thumb {
	background: var(--color-border);
	border-radius: 4px;
}
.data-viewer__list-wrap.is-scrollable::-webkit-scrollbar-thumb:hover {
	background: var(--color-text-muted);
}

.data-viewer__no-match {
	padding: 1rem 0.75rem;
	font-size: 0.85rem;
	color: var(--color-text-muted);
	text-align: center;
	font-style: italic;
}

/* ── Right frame ── */
.data-viewer__frame {
	background: var(--color-white);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius);
	padding: 1.75rem;
}

.dv-frame__head {
	margin-bottom: 1.5rem;
	scroll-margin-top: calc(var(--header-height) + 1rem);
}

.dv-frame__title {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--color-primary);
	letter-spacing: -0.01em;
	margin: 0 0 0.65rem;
	padding-bottom: 0.65rem;
	border-bottom: 2px solid var(--color-primary);
}

.dv-frame__desc {
	font-size: 0.95rem;
	color: var(--color-text);
	line-height: 1.7;
	margin: 0;
}

.dv-frame__sub {
	font-family: var(--font-body);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-accent);
	margin: 0 0 0.85rem;
}

/* Variables list */
.dv-vars { margin-top: 2rem; }

.dv-vars__list {
	display: grid;
	grid-template-columns: minmax(180px, 220px) 1fr;
	gap: 0.5rem 1.25rem;
	margin: 0;
	background: var(--color-bg-light);
	padding: 1.1rem 1.25rem;
	border-radius: var(--border-radius-sm);
	border: 1px solid var(--color-border-light);
}

@media (max-width: 600px) {
	.dv-vars__list { grid-template-columns: 1fr; gap: 0.85rem; }
}

.dv-vars__row {
	display: contents;
}

.dv-vars__name {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--color-primary);
	margin: 0;
	padding: 0.35rem 0;
}

.dv-vars__desc {
	font-size: 0.85rem;
	color: var(--color-text-muted);
	line-height: 1.55;
	margin: 0;
	padding: 0.35rem 0;
}

@media (max-width: 600px) {
	.dv-vars__row + .dv-vars__row { border-top: 1px solid var(--color-border-light); padding-top: 0.85rem; }
}

/* Preview table */
.dv-preview { margin-top: 2rem; }

.dv-preview__scroll {
	overflow-x: auto;
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius-sm);
	background: var(--color-white);
}

.dv-table {
	width: 100%;
	min-width: 900px;
	border-collapse: collapse;
	font-size: 0.82rem;
}

.dv-table th,
.dv-table td {
	padding: 0.7rem 0.85rem;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--color-border-light);
	line-height: 1.55;
}

.dv-table thead th {
	background: var(--color-bg-light);
	font-weight: 700;
	font-size: 0.7rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	border-bottom: 2px solid var(--color-border);
	white-space: nowrap;
	position: sticky;
	top: 0;
}

.dv-table tbody tr:last-child td { border-bottom: none; }

.dv-table tbody tr:nth-child(even) td { background: var(--color-bg-light); }

.dv-table td {
	color: var(--color-text);
	max-width: 260px;
	overflow-wrap: break-word;
}

/* Bouncing chevron — used on "Show all" + "View all data" buttons to hint at the
   reveal direction. Bounces gently every 1.6s; pauses on hover so the click feels
   intentional rather than chaotic. */
.dv-chevron {
	flex-shrink: 0;
	margin-left: 0.35rem;
	vertical-align: middle;
}
.dv-chevron--bounce {
	animation: dv-chevron-bounce 1.6s ease-in-out infinite;
	transform-origin: center;
}
@keyframes dv-chevron-bounce {
	0%, 20%, 100% { transform: translateY(0); }
	10%           { transform: translateY(-2px); }
	50%           { transform: translateY(4px); }
	60%           { transform: translateY(0); }
}
.data-viewer__toggle:hover .dv-chevron--bounce,
.dv-view-all-btn:hover .dv-chevron--bounce {
	animation-play-state: paused;
	transform: translateY(2px);
}
@media (prefers-reduced-motion: reduce) {
	.dv-chevron--bounce { animation: none; }
}

/* "Scroll down to explore" hint — sober one-liner that fades in below the CTA buttons */
.data-viewer__hint,
.dv-actions__hint {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	margin: 0.55rem 0 0;
	font-family: var(--font-body);
	font-size: 0.72rem;
	font-style: italic;
	font-weight: 500;
	color: var(--color-text-muted);
	letter-spacing: 0.04em;
	opacity: 0.78;
	animation: dv-hint-fade-in 0.5s ease 0.15s both;
}
/* Critical: our display:flex above overrides the [hidden] attribute default
   (display:none). Force it back so toggling .hidden in JS actually works. */
.data-viewer__hint[hidden],
.dv-actions__hint[hidden] { display: none !important; }
.data-viewer__hint::before,
.dv-actions__hint::before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 1px;
	background: currentColor;
	opacity: 0.55;
}
.data-viewer__hint::after,
.dv-actions__hint::after {
	content: '↓';
	font-style: normal;
	font-weight: 700;
	color: var(--color-accent);
	font-size: 0.8rem;
	animation: dv-hint-arrow-bob 1.8s ease-in-out infinite;
}
@keyframes dv-hint-fade-in {
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 0.78; transform: translateY(0); }
}
@keyframes dv-hint-arrow-bob {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(3px); }
}
@media (prefers-reduced-motion: reduce) {
	.data-viewer__hint::after,
	.dv-actions__hint::after,
	.data-viewer__hint,
	.dv-actions__hint { animation: none; }
}

/* Actions — single "View all data" button */
.dv-actions {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--color-border-light);
}

.dv-view-all-btn {
	display: inline-flex !important;
	align-items: center;
	gap: 0.5rem;
	min-width: 240px;
	justify-content: center;
}

.dv-view-all-btn__count {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	opacity: 0.85;
	margin-left: 0.25rem;
}

.dv-view-all-btn:disabled {
	opacity: 0.7;
	cursor: progress;
}

/* Full-data view (after click on View all data) */
.dv-preview--all .dv-preview__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.65rem;
}

.dv-preview--all .dv-preview__count {
	font-size: 0.78rem;
	font-weight: 700;
	color: var(--color-accent);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.dv-preview--all .dv-preview__scroll {
	max-height: 540px;
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	scrollbar-color: var(--color-border) transparent;
}
.dv-preview--all .dv-preview__scroll::-webkit-scrollbar { width: 10px; height: 10px; }
.dv-preview--all .dv-preview__scroll::-webkit-scrollbar-track { background: transparent; }
.dv-preview--all .dv-preview__scroll::-webkit-scrollbar-thumb {
	background: var(--color-border);
	border-radius: 5px;
}
.dv-preview--all .dv-preview__scroll::-webkit-scrollbar-thumb:hover {
	background: var(--color-text-muted);
}

/* Dark mode */
:root[data-theme="dark"] .data-viewer__sidebar,
:root[data-theme="dark"] .data-viewer__frame,
:root[data-theme="dark"] .data-viewer__state,
:root[data-theme="dark"] .data-viewer__toggle,
:root[data-theme="dark"] .dv-preview__scroll {
	background: var(--color-surface-2);
	border-color: var(--color-border);
}
:root[data-theme="dark"] .dv-vars__list,
:root[data-theme="dark"] .dv-table thead th,
:root[data-theme="dark"] .dv-table tbody tr:nth-child(even) td {
	background: var(--color-surface);
	border-color: var(--color-border);
}
:root[data-theme="dark"] .data-viewer__item:hover { background: var(--color-surface); }
:root[data-theme="dark"] .data-viewer__item.is-active { background: rgba(0, 153, 230, 0.12); }
:root[data-theme="dark"] .dv-frame__title { border-bottom-color: var(--color-border); }
:root[data-theme="dark"] .dv-table th,
:root[data-theme="dark"] .dv-table td { border-color: var(--color-border); }
/* Variables list bg becomes dark in dark mode → text must be light */
:root[data-theme="dark"] .dv-vars__name { color: var(--color-text); }
:root[data-theme="dark"] .dv-table th,
:root[data-theme="dark"] .dv-table td { color: var(--color-text); }

/* Knowledge frame (kframe) — card body stays white; force title to navy
   (global dark-mode h3 override forces it pale otherwise). */
:root[data-theme="dark"] .kframe__title { color: var(--color-primary) !important; }

/* Research carousel (rframe) — same: white body, force title to navy */
:root[data-theme="dark"] .rframe__title,
:root[data-theme="dark"] a.rframe__title { color: var(--color-primary) !important; }
:root[data-theme="dark"] .rframe__title:hover,
:root[data-theme="dark"] a.rframe__title:hover { color: var(--color-accent) !important; }

/* ==========================================================================
   ACADEMY APPLICATION FORM — public submission template
   ========================================================================== */

.application-wrap {
	max-width: 760px;
	margin-inline: auto;
}

/* Intro block above the form — explains what happens after submission */
.application-form__intro {
	background: rgba(0, 153, 230, 0.06);
	border: 1px solid rgba(0, 153, 230, 0.22);
	border-radius: var(--border-radius);
	padding: 1.25rem 1.5rem 1.1rem;
	margin-bottom: 1.5rem;
}
.application-form__intro-title {
	margin: 0 0 0.65rem;
	font-family: var(--font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-primary);
}
.application-form__intro-list {
	margin: 0;
	padding-left: 1.15rem;
	color: var(--color-text);
	font-size: 0.92rem;
	line-height: 1.6;
}
.application-form__intro-list li + li { margin-top: 0.35rem; }
.application-form__intro-list a { color: var(--color-accent); font-weight: 600; }
:root[data-theme="dark"] .application-form__intro {
	background: rgba(0, 153, 230, 0.09);
	border-color: rgba(0, 153, 230, 0.32);
}
:root[data-theme="dark"] .application-form__intro-title { color: var(--color-text); }

.application-form {
	background: var(--color-white);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius);
	padding: 2.25rem 2.25rem 2rem;
	box-shadow: 0 1px 3px rgba(12, 21, 35, 0.04);
}
@media (max-width: 600px) {
	.application-form { padding: 1.5rem 1.25rem; }
}

.application-form .hp-field {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.application-form__group {
	border: 0;
	padding: 0;
	margin: 0 0 1.75rem;
}
.application-form__group:last-of-type { margin-bottom: 0; }

.application-form__legend {
	font-family: var(--font-heading);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-accent);
	padding: 0;
	margin-bottom: 1rem;
	display: block;
	width: 100%;
	border-bottom: 1px solid var(--color-border-light);
	padding-bottom: 0.55rem;
}

.application-form__row { margin-bottom: 1rem; }
.application-form__row:last-child { margin-bottom: 0; }
.application-form__row--2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}
@media (max-width: 600px) {
	.application-form__row--2 { grid-template-columns: 1fr; }
}

.application-form__label {
	display: block;
	font-family: var(--font-body);
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--color-primary);
	margin-bottom: 0.4rem;
}
.application-form__label .req { color: var(--color-terracotta); margin-left: 0.15rem; }

.application-form__input {
	width: 100%;
	display: block;
	padding: 0.7rem 0.85rem;
	font-family: var(--font-body);
	font-size: 0.95rem;
	color: var(--color-primary);
	background: var(--color-bg-light);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
	-webkit-appearance: none;
	appearance: none;
}
.application-form__input:focus {
	outline: none;
	border-color: var(--color-accent);
	background: var(--color-white);
	box-shadow: 0 0 0 3px rgba(0, 153, 230, 0.12);
}
.application-form__input::placeholder { color: var(--color-text-muted); opacity: 0.7; }

.application-form__input--textarea { resize: vertical; min-height: 130px; line-height: 1.55; }

select.application-form__input {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 14px;
	padding-right: 2.25rem;
}

.application-form__counter {
	margin: 0.4rem 0 0;
	font-size: 0.78rem;
	color: var(--color-text-muted);
	text-align: right;
}
.application-form__counter.is-near-limit { color: var(--color-terracotta); font-weight: 600; }

.application-form__row--consent { margin: 1.5rem 0; }
.application-form__consent {
	display: flex;
	align-items: flex-start;
	gap: 0.65rem;
	font-size: 0.85rem;
	color: var(--color-text);
	line-height: 1.55;
	cursor: pointer;
}
.application-form__consent input[type="checkbox"] { margin-top: 0.18rem; flex-shrink: 0; }
.application-form__consent a { color: var(--color-accent); text-decoration: underline; text-underline-offset: 2px; }

.application-form__actions {
	display: flex; justify-content: flex-end;
	padding-top: 1rem;
	border-top: 1px solid var(--color-border-light);
}
.application-form__actions .btn { min-width: 200px; }
@media (max-width: 600px) {
	.application-form__actions .btn { width: 100%; }
}

.application-form__alert {
	margin-top: 1.25rem;
	padding: 0.9rem 1rem;
	border-radius: var(--border-radius-sm);
	font-size: 0.92rem;
	line-height: 1.5;
}
.application-form__alert--error {
	background: rgba(192, 64, 38, 0.08);
	border-left: 4px solid var(--color-terracotta);
	color: var(--color-terracotta);
}
.application-form__alert--success {
	background: rgba(46, 125, 50, 0.08);
	border-left: 4px solid var(--color-green-africa);
	color: var(--color-green-africa);
	font-weight: 600;
}

/* Dark mode */
:root[data-theme="dark"] .application-form { background: var(--color-surface); border-color: var(--color-border); }
:root[data-theme="dark"] .application-form__input { background: var(--color-surface-2); border-color: var(--color-border); color: var(--color-text); }
:root[data-theme="dark"] .application-form__input:focus { background: var(--color-surface); }
:root[data-theme="dark"] .application-form__label,
:root[data-theme="dark"] .application-form__consent { color: var(--color-text); }

/* ==========================================================================
   GOVERNANCE FELLOW CARDS — used on /governance/ template
   ========================================================================== */

.fellow-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 0;
	gap: 0.5rem;
}

.fellow-card__photo,
.fellow-card__photo-placeholder {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: center 22%;
	display: block;
	background: var(--color-bg-light);
	border-radius: var(--border-radius-sm);
	margin-bottom: 0.5rem;
}
.fellow-card__photo-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-muted);
}

/* Carousel tracks — touch-friendly behaviour */
#insights-track,
#fellows-track,
#rc-track,
.research-carousel__viewport,
.fellows-carousel__viewport,
.insights-slider__viewport {
	user-select: none;
	-webkit-user-select: none;
	-webkit-tap-highlight-color: transparent;
}

/* ==========================================================================
   RESPONSIVE FOUNDATION — site-wide adjustments for tablet & mobile
   ========================================================================== */

/* ── Tablet ≤ 1024px ── */
@media (max-width: 1024px) {
	.kframe-layout { grid-template-columns: 1fr; gap: 2rem; }
	.kframe-sidebar { position: static; top: auto; }
	.research-carousel-wrap { max-width: 100%; }
	.rc-nav { width: 44px; height: 44px; }
	.gov-grid { grid-template-columns: repeat(2, 1fr); }
	.awards-grid { grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
	.partners-grid { grid-template-columns: repeat(3, 1fr); }
	.contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ── Phablet ≤ 768px ── */
@media (max-width: 768px) {
	.page-hero { padding-block: 2.5rem; }
	.page-hero__title { font-size: clamp(1.6rem, 6vw, 2.1rem); }
	.page-hero__subtitle { font-size: 0.95rem; }
	.section__title { font-size: clamp(1.5rem, 5vw, 1.95rem); }
	.section__subtitle { font-size: 0.95rem; }
	.section__header { margin-bottom: 2rem; }

	/* Research carousel — stack image over text */
	.rframe { grid-template-columns: 1fr; min-height: 0; }
	.rframe__image { aspect-ratio: 16 / 9; min-height: 200px; }
	.rframe__body { padding: 1.5rem 1.25rem; border-top-width: 3px; }
	.rframe__title { font-size: 1rem; }
	.rframe__abstract { font-size: 0.9rem; line-height: 1.65; }
	.rframe__actions { flex-direction: column; align-items: stretch; }
	.rframe__actions .btn { width: 100%; justify-content: center; }

	/* Knowledge frame (insights/policies) — stack image + text */
	.kframe__content { grid-template-columns: 1fr; }
	.kframe__image { aspect-ratio: 16 / 9; }
	.kframe__text {
		aspect-ratio: auto;
		max-height: none;
		padding: 1.25rem;
	}
	.kframe__title { font-size: 1rem; padding: 1.25rem 1.25rem 1rem; }
	.kframe__meta { flex-wrap: wrap; gap: 0.5rem; padding: 0.75rem 1.25rem; }

	/* Governance & awards & partners stacking */
	.gov-grid { grid-template-columns: 1fr; gap: 0.75rem; }
	.gov-card { padding: 1rem; }
	.awards-grid { grid-template-columns: 1fr; gap: 1rem; }
	.award-card { padding: 1.25rem; }
	.partners-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }

	/* Knowledge tabs scroll horizontally */
	.knowledge-tabs__inner {
		overflow-x: auto;
		flex-wrap: nowrap;
		scrollbar-width: none;
		padding-bottom: 0.25rem;
	}
	.knowledge-tabs__inner::-webkit-scrollbar { display: none; }
	.knowledge-tab { white-space: nowrap; flex-shrink: 0; }

	/* Contact page grid */
	.contact-grid { grid-template-columns: 1fr; }
	.contact-card { padding: 1.1rem 1.25rem; }
	.contact-card--primary .contact-card__value { font-size: 1.2rem; }

	/* Data viewer — already stacks at 900, tighten now */
	.data-viewer__sidebar { padding: 1rem 0.85rem; }
	.data-viewer__list-wrap { max-height: 320px; }
	.dv-frame__title { font-size: 1.2rem; }
	.dv-frame__desc { font-size: 0.88rem; }

	/* Application forms */
	.application-form { padding: 1.5rem 1.25rem; }
	.application-form__row { grid-template-columns: 1fr; gap: 1rem; }
	.application-form__legend { font-size: 0.68rem; }

	/* Footer */
	.footer-bottom-inner { gap: 1rem; }
	.site-logo-footer img,
	.des-logo-footer-img { max-width: 220px; }

	/* Fellows carousel — smaller nav */
	.fellows-nav { width: 40px; height: 40px; }
	.fslide { flex: 0 0 100% !important; }

	/* Pillar / about cards already handled in their own block */
}

/* ── Mobile ≤ 480px ── */
@media (max-width: 480px) {
	:root { --gutter: 0.85rem; }
	.section { padding-block: 2.5rem; }
	.page-hero { padding-block: 2rem; }
	.page-hero__label { font-size: 0.7rem; }
	.page-hero__title { font-size: 1.5rem; line-height: 1.2; }
	.page-hero__subtitle { font-size: 0.9rem; line-height: 1.55; }

	.breadcrumb-list { font-size: 0.78rem; flex-wrap: wrap; }
	.breadcrumb-list li { white-space: normal; }

	.btn { padding: 0.55rem 1.1rem; font-size: 0.78rem; }
	.btn--lg { padding: 0.75rem 1.4rem; font-size: 0.84rem; }

	/* Tables → horizontal scroll fallback */
	table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }

	/* Forms */
	.application-form { padding: 1.25rem 1rem; border-radius: 12px; }
	.application-form__field input,
	.application-form__field textarea,
	.application-form__field select { font-size: 16px; } /* prevents iOS zoom */

	/* Newsletter footer */
	.footer-newsletter-form input[type="email"],
	.footer-newsletter-form button { font-size: 0.9rem; }

	/* Section headers */
	.section__label { font-size: 0.68rem; }

	/* Fellows single page header */
	.fellow-profile__name { font-size: 1.5rem; }

	/* Single insight/publication brief */
	.brief-title { font-size: clamp(1.4rem, 5.5vw, 1.9rem); }
	.brief-body { padding: 1.25rem 1rem; }

	/* Pestel chat */
	.pestel-chat__form,
	.pestel-chat__feed { padding: 1rem; }

	/* Knowledge tabs slightly smaller */
	.knowledge-tab { font-size: 0.78rem; padding: 0.55rem 0.85rem; }

	/* Data viewer preview table */
	.dv-table { font-size: 0.74rem; min-width: 640px; }
}

/* ── Prevent horizontal overflow on tiny screens ── */
@media (max-width: 360px) {
	html, body { overflow-x: hidden; }
	.page-hero__title { font-size: 1.35rem; }
	.section__title { font-size: 1.3rem; }
}