/* =============================================================
 * Eekad — main stylesheet
 * RTL-only, dark theme. Tokens mirror theme.json so PHP templates
 * and the block editor share one source of truth.
 * =========================================================== */

:root {
	/* ----- Brand (unchanged between modes) ----- */
	--c-lime:         #CDFE64;
	--c-indigo:       #5050D1;
	--c-indigo-deep:  #4040A8;
	--c-indigo-soft:  #8a8af0;
	--c-indigo-muted: #4040A8;
	--c-coral:        #d13636;

	/* ----- Backgrounds ----- */
	--c-bg-base:     #0E1012;
	--c-bg-alt:      #16191C;
	--c-bg-surface:  #1C1F24;
	--c-bg-elevated: #2A2F36;

	/* ----- Text ----- */
	--c-text:          #EAECF0;
	--c-text-2:        #D5DCDC;
	--c-text-3:        #C9D1D0;
	--c-text-muted:    #ABB7B6;
	--c-text-faint:    #727A79;
	--c-text-on-accent: #0E1012;

	/* ----- Borders / overlays (rgb channel list) ----- */
	--c-border-rgb: 255, 255, 255;

	/* ----- Brand-colour rgb channels (for rgba overlays) ----- */
	--c-lime-rgb: 205, 254, 100;

	/* ----- Surface-colour rgb channels (for rgba overlays) ----- */
	--c-bg-base-rgb:     14, 16, 18;
	--c-bg-alt-rgb:      22, 25, 28;
	--c-bg-surface-rgb:  28, 31, 36;
	--c-bg-elevated-rgb: 42, 47, 54;

	/* ----- Tints ----- */
	--c-tint-green: #2D3533;

	/* ----- Legacy aliases (keep until fully migrated) ----- */
	--c-bg:      var(--c-bg-elevated);
	--c-surface: var(--c-bg-elevated);
	--c-ink:     var(--c-text-on-accent);
	--c-grey-50:  var(--c-text);
	--c-grey-100: var(--c-text-2);
	--c-grey-200: var(--c-text-3);
	--c-grey-300: var(--c-text-muted);
	--c-grey-500: var(--c-text-faint);
	--c-white:    #ffffff;

	/* ----- Type ----- */
	--font-sans: "itf Somaya Arabic", "Tajawal", system-ui, -apple-system, sans-serif;
	--font-mono: "DM Mono", "Tajawal", ui-monospace, SFMono-Regular, Menlo, monospace;

	--fs-xs:   12px;
	--fs-sm:   17px;
	--fs-base: 20px;
	--fs-lg:   24px;
	--fs-h3:   30px;
	--fs-h2:   40px;
	--fs-h1:   52px;
	--fs-article: 24px;
	--fs-article-mobile: 21px;

	--lh-tight: 1.2;
	--lh-base:  1.6;

	/* ----- Layout ----- */
	--container:    1232px;
	--container-px: 24px;
}
/* ----- Font faces (loaded from /assets/fonts/) ----- */
@font-face {
	font-family: "itf Somaya Arabic";
	src: url("../fonts/SomayaArabic-Light.woff2") format("woff2");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "itf Somaya Arabic";
	src: url("../fonts/SomayaArabic-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "itf Somaya Arabic";
	src: url("../fonts/SomayaArabic-Medium.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "itf Somaya Arabic";
	src: url("../fonts/SomayaArabic-Bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* ----- Reset (minimal) ----- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: hidden; }
body {
	margin: 0;
	background: var(--c-bg-surface);
	color: var(--c-text);
	font-family: var(--font-sans);
	font-size: var(--fs-base);
	line-height: var(--lh-base);
	font-weight: 500;
	direction: rtl;
	text-align: right;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
img, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }

/* Alternating section backgrounds — odd/even auto-striping so
   sections always contrast regardless of which ones render.
   --card-bg flips so cards always contrast with their section.
   --section-bg echoes the section color for deeper nesting. */
.eekad-main > section:nth-of-type(odd)  { background: var(--c-bg-elevated); --card-bg: var(--c-bg-surface); --section-bg: var(--c-bg-elevated); }
.eekad-main > section:nth-of-type(even) { background: var(--c-bg-surface);  --card-bg: var(--c-bg-elevated); --section-bg: var(--c-bg-surface); }

/* =============================================================
 * Entrance Animations
 * =========================================================== */

/* --- Hero scan line --- */
.eekad-hero__scan-line {
	position: absolute;
	top: 0;
	inset-inline-end: 100%;
	width: 100%;
	height: 100%;
	z-index: 10;
	pointer-events: none;
	background: linear-gradient(
		to left,
		transparent 0%,
		rgba(205, 254, 100, .06) 20%,
		rgba(205, 254, 100, .12) 50%,
		rgba(205, 254, 100, .06) 80%,
		transparent 100%
	);
	opacity: 0;
}
.eekad-hero__scan-line.is-active {
	opacity: 1;
	animation: hero-scan 1.6s cubic-bezier(.25,.1,.25,1) forwards;
}
@keyframes hero-scan {
	0%   { inset-inline-end: 100%; }
	100% { inset-inline-end: -100%; }
}

/* --- Scroll reveal --- */
.eekad-reveal {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .5s cubic-bezier(.25, .1, .25, 1),
	            transform .6s cubic-bezier(.19, 1, .22, 1);
}
.eekad-reveal.is-revealed {
	opacity: 1;
	transform: translateY(0);
}
/* Cards get a slightly different compose: scale from 98% + fade */
.eekad-reveal.eekad-reveal--card {
	transform: translateY(10px) scale(.98);
	transition: opacity .5s cubic-bezier(.25, .1, .25, 1),
	            transform .6s cubic-bezier(.19, 1, .22, 1);
}
.eekad-reveal--card.is-revealed {
	transform: translateY(0) scale(1);
}

/* --- Section bracket expansion --- */
.eekad-bracket-anim {
	display: inline-block;
	opacity: 0;
	transition: opacity .8s ease, transform 1s cubic-bezier(.19,1,.22,1);
}
/* Determine which bracket slides which direction */
.eekad-bracket-anim:first-child {
	transform: translateX(-12px);
}
.eekad-bracket-anim:last-child {
	transform: translateX(12px);
}
.eekad-bracket-anim.is-expanded {
	opacity: 1;
	transform: translateX(0);
}

/* --- Cursor glow (scoped to OSINT hero) --- */
.eekad-cursor-glow {
	position: absolute;
	top: 0;
	left: 0;
	width: 140px;
	height: 140px;
	margin: -70px 0 0 -70px;
	border-radius: 50%;
	background: radial-gradient(
		circle,
		rgba(205, 254, 100, .12) 0%,
		rgba(205, 254, 100, .04) 40%,
		transparent 70%
	);
	pointer-events: none;
	z-index: 5;
	opacity: 0;
	transition: opacity .4s ease;
	will-change: transform;
}

/* --- Crosshair cursor (archive hero zones) --- */
.eekad-crosshair-zone { overflow: hidden; }

.eekad-xhair__dot {
	position: absolute;
	top: 0; left: 0;
	width: 8px; height: 8px;
	margin: -4px 0 0 -4px;
	border-radius: 0;
	background: var(--c-coral);
	box-shadow: 0 0 6px 1px rgba(209, 54, 54, .5);
	pointer-events: none;
	z-index: 20;
	opacity: 0;
	will-change: transform;
}
.eekad-xhair__line-h {
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 1px;
	background: rgba(var(--c-border-rgb), .15);
	pointer-events: none;
	z-index: 19;
	opacity: 0;
	will-change: transform;
}
.eekad-xhair__line-v {
	position: absolute;
	top: 0; bottom: 0; left: 0;
	width: 1px;
	background: rgba(var(--c-border-rgb), .15);
	pointer-events: none;
	z-index: 19;
	opacity: 0;
	will-change: transform;
}
.eekad-xhair__coords {
	position: absolute;
	bottom: 24px;
	left: 24px;
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-family: var(--font-mono, monospace);
	font-size: 11px;
	letter-spacing: 0.06em;
	color: var(--c-text-muted);
	pointer-events: none;
	z-index: 20;
	opacity: 0;
	user-select: none;
}

/* ----- Layout primitives (will grow as templates need them) ----- */
.eekad-container {
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--container-px);
}

/* =============================================================
 * Site header
 *
 * Layout: 3-column grid — logo on the right (column 1 in RTL),
 * nav truly centered in the viewport (column 2), spacer left.
 *
 * Background is fully transparent at the top of the page. Once the
 * page scrolls > 12px, the .is-scrolled class is added by the small
 * script in footer.php and the header gains a translucent backdrop.
 * =========================================================== */
/* --- Header shell --- */
.eekad-site-header {
	position: fixed;
	top: 0;
	inset-inline: 0;
	z-index: 100;
	background: transparent;
	transition: background .3s ease;
	overflow: visible;
}
.eekad-site-header.is-scrolled::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(var(--c-bg-alt-rgb), .82);
	backdrop-filter: blur(24px);
	-webkit-backdrop-filter: blur(24px);
	z-index: -1;
}

/* --- Inner container --- */
.eekad-site-header__inner {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 64px;
	max-width: 1280px;
	margin-inline: auto;
	padding-inline: 32px;
}

/* --- Logo --- */
.eekad-site-header__logo {
	position: absolute;
	inset-inline-start: 32px;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	color: var(--c-text);
	flex-shrink: 0;
}
.eekad-site-header__logo svg {
	width: 64px;
	height: auto;
	display: block;
	filter: drop-shadow(0 0 0 rgba(213, 254, 119, 0));
	transition: transform .35s ease-out,
	            filter .35s ease-out;
}
.eekad-site-header__logo:hover {
	color: var(--c-lime);
}
.eekad-site-header__logo:hover svg {
	transform: scale(1.08);
	filter: drop-shadow(0 0 8px rgba(213, 254, 119, .6))
	        drop-shadow(0 0 24px rgba(213, 254, 119, .3));
}

/* --- Header actions (verify pill + OSINT CTA) --- */
.eekad-site-header__actions {
	position: absolute;
	inset-inline-end: 32px;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

/* Prominent "تحقق" pill — lime-accented so it stands out from the rest
   of the nav. This is the primary call-to-action for the fact-checking
   product and we want editors/visitors to spot it immediately. */
.eekad-site-header__verify {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .01em;
	line-height: 1;
	color: var(--c-text);
	text-decoration: none;
	padding: 8px 14px;
	border: 1px solid rgba(var(--c-border-rgb), .12);
	transition: background .2s, border-color .2s, color .2s;
}
.eekad-site-header__verify svg {
	width: 18px;
	height: 18px;
	display: block;
}
.eekad-site-header__verify:hover {
	color: var(--c-lime, #CDFE64);
	background: rgba(213, 254, 119, .06);
	border-color: rgba(213, 254, 119, .2);
}

/* --- CTA button --- */
.eekad-site-header__cta {
	position: absolute;
	inset-inline-end: 32px;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .01em;
	line-height: 1;
	color: var(--c-text);
	text-decoration: none;
	padding: 8px 14px;
	border: 1px solid rgba(var(--c-border-rgb), .12);
	transition: background .2s, border-color .2s, color .2s;
}
.eekad-site-header__cta svg {
	width: 18px;
	height: 18px;
	display: block;
}
.eekad-site-header__cta:hover {
	color: var(--c-lime, #CDFE64);
	background: rgba(213, 254, 119, .06);
	border-color: rgba(213, 254, 119, .2);
}

/* --- Primary nav list --- */
.eekad-nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 4px;
}
.eekad-nav > li {
	display: inline-flex;
}

/* --- Nav links --- */
.eekad-nav > li > a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--c-text);
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	padding: 10px 14px;
	text-decoration: none;
	transition: color .18s;
}
.eekad-nav > li > a:hover {
	color: var(--c-text);
}
.eekad-nav > li.current-menu-item > a,
.eekad-nav > li.current_page_item > a,
.eekad-nav > li.current-menu-ancestor > a {
	color: var(--c-lime);
}

/* --- Dropdown parent --- */
.eekad-nav .menu-item-has-children {
	position: relative;
}

/* --- Dropdown card (dark panel anchored to its trigger, sharp edges) --- */
.eekad-nav .sub-menu {
	list-style: none;
	margin: 0;
	padding: 8px;
	position: absolute;
	top: calc(100% + 10px);
	inset-inline-start: 0;
	min-width: 200px;
	width: max-content;
	background: rgba(20, 22, 28, .72);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	box-shadow:
		0 20px 50px rgba(0, 0, 0, .45),
		0 4px 12px rgba(0, 0, 0, .25),
		0 0 0 1px rgba(var(--c-border-rgb), .06);
	display: flex;
	flex-direction: column;
	gap: 2px;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(-6px);
	transition: opacity .2s ease, transform .2s ease, visibility .2s;
	z-index: 51;
}
/* Bridge the gap between trigger and card so the dropdown doesn't
   vanish when the cursor crosses the space between them. */
.eekad-nav .sub-menu::before {
	content: "";
	position: absolute;
	top: -12px;
	inset-inline: 0;
	height: 12px;
}
.eekad-nav .menu-item-has-children:hover > .sub-menu,
.eekad-nav .menu-item-has-children:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
}

/* --- Dropdown items --- */
.eekad-nav .sub-menu li {
	display: block;
}
.eekad-nav .sub-menu a {
	display: block;
	padding: 10px 14px;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--c-text-2);
	text-align: start;
	white-space: nowrap;
	transition: background .15s, color .15s;
}
.eekad-nav .sub-menu a:hover {
	background: rgba(var(--c-border-rgb), .06);
	color: var(--c-text);
}
.eekad-nav .sub-menu .current-menu-item > a {
	background: rgba(213, 254, 119, .08);
	color: var(--c-lime);
}

/* --- Mega menu (Apple-style category browser) --- */
.eekad-nav__mega { position: relative; }
.eekad-nav__mega-trigger {
	cursor: pointer;
}
.eekad-nav__mega-trigger[aria-expanded="true"] {
	color: var(--c-text);
}
/* Backdrop — starts BELOW the header so the nav itself stays crisp.
   Blurs/darkens the page area visible below the panel. */
.eekad-nav__mega-backdrop {
	position: fixed;
	top: 64px;
	inset-inline: 0;
	bottom: 0;
	background: rgba(0, 0, 0, .35);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	transition: opacity .42s cubic-bezier(.32, .72, 0, 1), visibility 0s linear .42s;
	z-index: 89;
}
.eekad-nav__mega-backdrop.is-open {
	opacity: 1;
	visibility: visible;
	transition: opacity .42s cubic-bezier(.32, .72, 0, 1), visibility 0s;
}
/* Panel — fixed full-viewport-width strip flush below the header,
   so it sits edge-to-edge regardless of the centered nav container.
   Background matches the header's scrolled state so the two read as
   one continuous surface. Slide-down reveal via clip-path. */
.eekad-nav__mega-panel {
	position: fixed;
	top: 64px;
	inset-inline: 0;
	background: rgba(var(--c-bg-alt-rgb), .82);
	backdrop-filter: blur(24px);
	-webkit-backdrop-filter: blur(24px);
	clip-path: inset(0 0 100% 0);
	opacity: 0;
	visibility: hidden;
	transition:
		clip-path .52s cubic-bezier(.32, .72, 0, 1),
		opacity .3s ease,
		visibility 0s linear .52s;
	z-index: 99; /* below the header (100) so the nav still paints over */
}
.eekad-nav__mega-panel.is-open {
	clip-path: inset(0 0 0 0);
	opacity: 1;
	visibility: visible;
	transition:
		clip-path .52s cubic-bezier(.32, .72, 0, 1),
		opacity .25s ease-out,
		visibility 0s;
}
/* While the mega is open, force a matching opaque-ish bg on the header
   even on transparent-header pages, so the nav and panel read as one
   continuous surface (no boundary line). Higher specificity than the
   .is-scrolled rule so it wins regardless of scroll position. */
body.has-mega-open .eekad-site-header {
	background: var(--c-bg-surface);
}
body.has-mega-open .eekad-site-header::before {
	display: none;
}
body.has-mega-open .eekad-nav__mega-panel {
	background: var(--c-bg-surface);
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}
.eekad-nav__mega-grid {
	max-width: 1280px;
	margin-inline: auto;
	padding: 56px 48px 64px;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	column-gap: 40px;
	align-items: start;
}
@media (max-width: 1100px) {
	.eekad-nav__mega-grid {
		grid-template-columns: repeat(3, 1fr);
		padding: 48px 32px 56px;
		column-gap: 32px;
		row-gap: 32px;
	}
}
.eekad-nav__mega-col {
	display: flex;
	flex-direction: column;
	text-align: start; /* RTL: hugs the right edge of each column */
	min-width: 0;
}
/* Standalones column packs its big-text items tighter so they read
   as a single grouped list rather than as a column with a heading. */
.eekad-nav__mega-col--standalones {
	gap: 16px;
}
.eekad-nav__mega-head {
	display: block;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--c-text);
	margin-block-end: 16px;
}
a.eekad-nav__mega-head {
	transition: color .15s ease;
}
a.eekad-nav__mega-head:hover {
	color: var(--c-lime);
}
.eekad-nav__mega-sub {
	--mega-child-indent: 24px;
	--mega-item-height: 34px;
	--mega-rail-x: 5px;
	--mega-dot-size: 7px;
	list-style: none;
	margin: 0;
	padding: 0;
	padding-inline-start: var(--mega-child-indent);
	display: flex;
	flex-direction: column;
	gap: 8px;
	position: relative;
}
.eekad-nav__mega-sub::before {
	content: "";
	position: absolute;
	inset-inline-start: var(--mega-rail-x);
	top: 17px;
	bottom: 17px;
	width: 1px;
	background: rgba(var(--c-border-rgb), .24);
}
.eekad-nav__mega-sub li {
	position: relative;
	min-height: var(--mega-item-height);
	display: flex;
	align-items: center;
}
.eekad-nav__mega-sub a {
	position: relative;
	display: inline-flex;
	align-items: center;
	width: fit-content;
	min-height: 34px;
	padding: 5px 10px;
	font-size: 15px;
	font-weight: 400;
	color: var(--c-text-2);
	line-height: 1.4;
	border-radius: 4px;
	transition: background .15s ease, color .15s ease;
}
.eekad-nav__mega-sub li::before {
	content: "";
	position: absolute;
	inset-inline-start: -22px;
	top: calc(50% - 3.5px);
	width: var(--mega-dot-size);
	height: var(--mega-dot-size);
	border-radius: 999px;
	background: rgba(var(--c-border-rgb), .52);
	border: 0;
	z-index: 1;
}
.eekad-nav__mega-sub a:hover {
	background: rgba(var(--c-border-rgb), .06);
	color: var(--c-text);
}
.eekad-nav__mega-sub li:hover::before {
	background: var(--c-lime);
	border-color: var(--c-lime);
}

/* --- Hamburger button (hidden on desktop) --- */
.eekad-burger {
	display: none;
	position: absolute;
	inset-inline-end: 16px;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	background: none;
	border: none;
	color: var(--c-text);
	align-items: center;
	justify-content: center;
	z-index: 101;
	padding: 0;
}
.eekad-burger svg { width: 24px; height: 24px; display: block; }
.eekad-burger.is-active line:nth-child(1) { transform: translateY(6px) rotate(45deg); transform-origin: center; }
.eekad-burger.is-active line:nth-child(2) { opacity: 0; }
.eekad-burger.is-active line:nth-child(3) { transform: translateY(-6px) rotate(-45deg); transform-origin: center; }
.eekad-burger line { transition: transform .25s ease, opacity .2s ease; }
/* Scroll lock for the mobile menu — touch-action approach, no
   position:fixed body trick. `touch-action: none` on body blocks the
   underlying page from scrolling on iOS; the menu's scrollable
   panels opt back in with `touch-action: pan-y` (set further down).
   `overflow: hidden` suppresses the desktop scrollbar. Body stays
   in normal flow so safe-area zones paint correctly. */
body.menu-open {
	overflow: hidden;
	touch-action: none;
}

/* --- Fullscreen mobile menu overlay --- */
/* A plain fullscreen modal. Hidden until .is-open. No transition by
   design — every animation we tried (opacity fade, slide-up) exposed
   the page beneath mid-animation, and Safari's URL-bar backdrop blur
   sampled the colour shift as a flash. Snap show / snap hide. */
.eekad-mobile-menu {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 200;
	background: var(--c-bg-surface);
	flex-direction: column;
	overflow: hidden;
	padding-inline: max(24px, env(safe-area-inset-left), env(safe-area-inset-right));
}
.eekad-mobile-menu.is-open { display: flex; }

/* When the menu is on a deeper page (e.g. الأقسام), the social
   footer of the root page should disappear so the subpage owns the
   screen. JS sets `is-on-subpage` on push, drops it on pop/close. */
.eekad-mobile-menu.is-on-subpage .eekad-mobile-menu__footer {
	display: none;
}

/* Floating UI (TOC, verify FAB, investigation action dock with the
   network + attachments buttons, standalone network FAB) sits above
   the mobile menu by default. Hide them while the menu is open so
   they don't punch through the overlay. */
body.menu-open .eekad-toc,
body.menu-open .eekad-verify-fab,
body.menu-open .eekad-action-dock,
body.menu-open .eekad-network-fab {
	display: none !important;
}

.eekad-mobile-menu__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	/* env() pushes the row below the notch/dynamic island when
	   viewport-fit=cover is enabled, falls back cleanly to 0 elsewhere. */
	padding: calc(20px + env(safe-area-inset-top)) 0 20px;
	flex-shrink: 0;
	gap: 12px;
}
.eekad-mobile-menu__logo svg {
	width: 48px;
	height: auto;
	color: var(--c-text);
}
.eekad-mobile-menu__close,
.eekad-mobile-menu__back {
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	color: var(--c-text);
	cursor: pointer;
	padding: 0;
}
.eekad-mobile-menu__close svg,
.eekad-mobile-menu__back svg { width: 24px; height: 24px; }
.eekad-mobile-menu__back { margin-inline-end: auto; }
.eekad-mobile-menu__back[hidden] { display: none; }
/* When on a subpage, hide the logo so the back chevron sits where the
   logo was (Apple pattern: leading-edge back arrow, trailing-edge X). */
.eekad-mobile-menu.is-on-subpage .eekad-mobile-menu__logo { display: none; }

/* Nav viewport — clips the off-screen panels. Each panel is positioned
   absolutely so the viewport size stays stable while panels slide. */
.eekad-mobile-menu__nav {
	flex: 1;
	display: flex;
	min-height: 0;
}
.eekad-mobile-menu__viewport {
	position: relative;
	flex: 1;
	overflow: hidden;
}
.eekad-mobile-nav__page {
	list-style: none;
	margin: 0;
	padding: 16px 0 16px;
	position: absolute;
	inset: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	/* Re-enable vertical pan inside the menu's scroll surface — body
	   has touch-action: none while the menu is open. */
	touch-action: pan-y;
	/* Default: parked on the trailing edge (visual left in RTL) — this is
	   where unvisited "future" pages and just-popped pages live. */
	transform: translateX(-100%);
	transition: transform .42s cubic-bezier(.32, .72, 0, 1);
	-webkit-overflow-scrolling: touch;
}
.eekad-mobile-nav__page.is-active {
	transform: translateX(0);
}
/* Pages we've pushed past — parked on the leading edge (visual right in RTL).
   Pop animation slides them back into view. */
.eekad-mobile-nav__page.is-prev {
	transform: translateX(100%);
}

.eekad-mobile-nav__page > li {
	border-bottom: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-mobile-nav__page > li > a,
.eekad-mobile-nav__page > li > .eekad-mobile-nav__push {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	font-size: 22px;
	font-weight: 500;
	color: var(--c-text);
	padding: 18px 0;
	text-decoration: none;
	min-height: 60px;
	background: none;
	border: 0;
	font-family: inherit;
	text-align: inherit;
	cursor: pointer;
}
/* Push-button chevron — points in the "forward" direction.
   In RTL, forward = visual left, so we render a left-pointing arrow. */
.eekad-mobile-nav__page > li > .eekad-mobile-nav__push::after {
	content: '';
	width: 10px;
	height: 10px;
	border-top: 2px solid var(--c-text-muted);
	border-left: 2px solid var(--c-text-muted);
	transform: rotate(-45deg);
	flex-shrink: 0;
	margin-inline-start: 12px;
}

/* Subpage row — the entire row toggles the inline expand. The category
   title is an inline-block link inside the row that hugs its own text,
   so a tap precisely on the text navigates to the category archive
   while a tap on the chevron / surrounding gutter just toggles. */
.eekad-mobile-nav__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 18px 0;
	min-height: 60px;
	cursor: pointer;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
}
.eekad-mobile-nav__row:focus-visible {
	outline: 2px solid var(--c-lime);
	outline-offset: -2px;
}
.eekad-mobile-nav__title {
	display: inline-block;
	font-size: 22px;
	font-weight: 500;
	color: var(--c-text);
	text-decoration: none;
	padding: 4px 2px;
	cursor: pointer;
}
.eekad-mobile-nav__chev {
	width: 10px;
	height: 10px;
	border-right: 2px solid var(--c-text-muted);
	border-bottom: 2px solid var(--c-text-muted);
	transform: rotate(45deg);
	transition: transform .25s ease;
	display: inline-block;
	flex-shrink: 0;
	margin-inline-end: 16px;
}
li.is-expanded > .eekad-mobile-nav__row .eekad-mobile-nav__chev {
	transform: rotate(-135deg);
}

/* Inline sub-items — sub-categories revealed when the parent is expanded. */
.eekad-mobile-nav__sub {
	list-style: none;
	margin: 0;
	padding: 0 0 12px;
	display: none;
}
li.is-expanded > .eekad-mobile-nav__sub {
	display: block;
}
.eekad-mobile-nav__sub li {
	border: 0;
}
.eekad-mobile-nav__sub a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 0;
	font-size: 15px;
	color: var(--c-text-3);
	text-decoration: none;
	min-height: 40px;
	transition: color .15s ease;
}
.eekad-mobile-nav__sub a:hover { color: var(--c-text); }
.eekad-mobile-nav__sub a::after {
	content: '↗';
	font-size: 14px;
	color: var(--c-text-muted);
	margin-inline-start: 8px;
}

/* Database entry — rendered as a plain nav item to match the list rhythm */
/* Footer social links — icon squares matching the desktop site footer
   so the visual language stays consistent between surfaces. */
.eekad-mobile-menu__footer {
	list-style: none;
	display: flex;
	justify-content: center;
	gap: 12px;
	/* Bottom inset so the row sits above the home indicator on iOS. */
	padding: 24px 0 calc(32px + env(safe-area-inset-bottom));
	margin: auto 0 0;
	flex-shrink: 0;
}
.eekad-mobile-menu__footer a {
	display: inline-flex;
	width: 40px;
	height: 40px;
	align-items: center;
	justify-content: center;
	border: 1px solid rgba(var(--c-border-rgb), .18);
	color: var(--c-text-2);
	text-decoration: none;
	transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.eekad-mobile-menu__footer a:hover {
	background: var(--c-lime);
	border-color: var(--c-lime);
	color: var(--c-text-on-accent);
}
.eekad-mobile-menu__footer svg {
	width: 18px;
	height: 18px;
}

@media (max-width: 768px) {
	.eekad-burger { display: inline-flex; }
	.eekad-site-header__nav .eekad-nav { display: none; }
	.eekad-nav__mega-panel,
	.eekad-nav__mega-backdrop { display: none !important; }
	.eekad-site-header__cta { display: none; }
	.eekad-site-header__inner {
		padding-inline: 16px;
		min-height: 56px;
	}
	.eekad-site-header__logo { inset-inline-start: 16px; }
	.eekad-site-header__logo svg { width: 48px; }
}

@media (max-width: 480px) {
	.eekad-site-header__inner { min-height: 48px; }
	.eekad-site-header__logo svg { width: 40px; }
}

/* Hide mobile menu on desktop */
@media (min-width: 769px) {
	.eekad-mobile-menu { display: none !important; }
}
/* =============================================================
 * Reusable atoms
 * =========================================================== */

/* ----- Pill / badge ----- */
.eekad-pill {
	display: inline-flex;
	align-items: center;
	padding: 8px 18px;
	border-radius: 0;
	font-size: var(--fs-sm);
	font-weight: 700;
	line-height: 1;
	letter-spacing: .2px;
}
.eekad-pill--lime {
	background: var(--c-lime);
	color: var(--c-text-on-accent);
}

/* ----- Select / dropdown ----- */
.eekad-select-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
}
.eekad-select {
	appearance: none;
	-webkit-appearance: none;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .08);
	color: var(--c-text);
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	padding: 10px 16px;
	padding-inline-end: 40px;
	cursor: pointer;
	transition: border-color .2s;
	min-width: 160px;
}
.eekad-select:hover { border-color: rgba(var(--c-border-rgb), .15); }
.eekad-select:focus { outline: none; border-color: var(--c-lime, #CDFE64); }
.eekad-select option { background: var(--c-bg-surface); color: var(--c-text); }
.eekad-select__arrow {
	position: absolute;
	inset-inline-end: 12px;
	width: 16px;
	height: 16px;
	color: var(--c-text-faint);
	pointer-events: none;
}

/* ----- Buttons ----- */
.eekad-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 26px;
	border-radius: 0;
	font-size: var(--fs-base);
	font-weight: 700;
	line-height: 1;
	border: 2px solid transparent;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.eekad-btn--primary {
	background: var(--c-lime);
	color: var(--c-text-on-accent);
}
.eekad-btn--primary:hover {
	background: var(--c-white);
	transform: translateY(-1px);
}
.eekad-btn--ghost {
	background: transparent;
	color: var(--c-text);
	border-color: rgba(var(--c-border-rgb), .35);
}
.eekad-btn--ghost:hover {
	border-color: var(--c-lime);
	color: var(--c-lime);
}

/* =============================================================
 * Homepage — shared section styling (all sections except hero)
 * =========================================================== */
.eekad-news,
.eekad-verify,
.eekad-picks,
.eekad-home-db,
.eekad-tv,
.eekad-categories {
	border-top: 1px solid rgba(var(--c-border-rgb), .08);
}

/* =============================================================
 * Homepage — Hero ("أبرز الملفات" featured-file dossier)
 * =========================================================== */
.eekad-hero-pin {
	position: relative;
}
.eekad-hero {
	position: relative;
	height: 100vh;
	display: flex;
	flex-direction: column;
	color: var(--c-text);
	padding-block-start: 208px; /* 80px header + 128px top padding per Figma */
	padding-block-end: 48px;
	overflow: hidden;
	isolation: isolate;
}
.eekad-hero__media {
	position: absolute;
	inset: 0;
	z-index: -2;
}
.eekad-hero__media-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	opacity: 0;
	transition: opacity .9s ease;
}
.eekad-hero__media-img.is-active {
	opacity: 1;
	/* Ken Burns: very slow zoom + drift while the image is active.
	   Restarts each time the class is re-added (on slide change). */
	animation: eekad-hero-kenburns 22s ease-out both;
}
@keyframes eekad-hero-kenburns {
	0%   { transform: scale(1)    translate3d(0, 0, 0); }
	100% { transform: scale(1.06) translate3d(-1.5%, -1%, 0); }
}
@media (prefers-reduced-motion: reduce) {
	.eekad-hero__media-img.is-active { animation: none; }
}
.eekad-hero__overlay {
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(180deg, rgba(var(--c-bg-elevated-rgb), .15) 0%, rgba(var(--c-bg-elevated-rgb), .10) 35%, rgba(var(--c-bg-elevated-rgb), .55) 100%);
}

/* ----- Content stack ----- */
.eekad-hero__content {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 0;
	padding-block: 0;
	position: relative;
}

/* ----- Indigo content card -----
   SVG viewBox 1216×240. Shape: M1216 240H8V34H1051.88V0H1216V240Z
   — rectangle from (8,34) to (1216,240) with raised step at top-right
     (1051.88,0)→(1216,34). All child elements absolutely positioned
     using exact Figma coordinates as percentages of 1216×240. */
.eekad-hero__card {
	position: relative;
	height: 200px;
	margin-block-end: 32px; /* gap to tab strip */
}
/* Tabs sit flush at the hero's very bottom edge */
.eekad-hero__tabs {
	flex-shrink: 0;
}
.eekad-hero__card-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
	pointer-events: none;
}
/* Text block — Figma: content flex at (27,70) in 1208×240 card;
   text starts after CTA(123)+gap(164)=314 → SVG x=322, y=70. */
.eekad-hero__card-text {
	position: absolute;
	z-index: 1;
	left: calc(170 / 1216 * 100%);
	top: calc(46 / 240 * 100%);
	right: calc(104 / 1216 * 100%); /* 16px gap before the arrow */
	color: var(--c-text);
	text-align: right;
}
.eekad-hero__card-file {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .03em;
	color: var(--c-text);
	background: transparent;
	border: 1px solid rgba(var(--c-border-rgb), .5);
	padding: 4px 12px;
	margin-bottom: 10px;
	transition: border-color .15s ease, background .15s ease;
	position: relative;
	z-index: 2;
}
.eekad-hero__card-file:hover {
	border-color: var(--c-text);
	background: rgba(var(--c-border-rgb), .1);
}
.eekad-hero__title {
	font-size: clamp(22px, 2.4vw, 34px);
	font-weight: 500;
	line-height: 1.15;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.eekad-hero__title a {
	color: inherit;
	transition: opacity .15s ease;
}
.eekad-hero__title a:hover { opacity: .82; }
.eekad-hero__excerpt {
	font-size: clamp(15px, 1.4vw, 20px);
	font-weight: 300;
	line-height: 1.5;
	color: var(--c-text);
	margin: 8px 0 0;
	opacity: .85;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
/* CTA button — 123×48 at (35, 70) in the Figma SVG. */
.eekad-hero__cta {
	position: absolute;
	z-index: 2;
	inset-inline-end: 20px;
	top: calc(34 / 240 * 100% + 20px);
	width: calc(123 / 1216 * 100%);
	min-width: 100px;
	height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 12px;
	background: var(--c-lime);
	color: var(--c-text-on-accent);
	font-size: var(--fs-base);
	font-weight: 500;
	line-height: 24px;
	white-space: nowrap;
	transition: background .15s ease, transform .15s ease;
}
.eekad-hero__cta:hover {
	background: #CDFE64;
	transform: translateY(-1px);
}
/* Expand arrow — Figma: 25×25 at (1120,52) in card. */
.eekad-hero__card-expand {
	position: absolute;
	z-index: 2;
	left: calc(1128 / 1216 * 100%);
	top: calc(52 / 240 * 100%);
	width: 25px;
	height: 25px;
	color: var(--c-lime);
	transition: opacity .15s ease;
}
.eekad-hero__card-expand:hover { opacity: .7; }
.eekad-hero__card-expand svg { width: 100%; height: 100%; display: block; }

/* ----- Tab strip -----
   Rail + draggable reel. The rail is a single continuous line at the
   vertical center of the strip; the reel holds the tab boxes. Only
   the reel transforms on drag, so the rail reads as a stable track
   and the boxes slide along it. */
.eekad-hero__tabs {
	position: relative;
	height: 57px;
	flex-shrink: 0;
	width: 100vw;
	margin-inline-start: calc(50% - 50vw);
	overflow: hidden;
}
/* Rail is an empty container now — JS paints line segments into it
   that sit in the gaps between boxes, so the track reads as continuous
   across the viewport while the boxes stay fully transparent. */
.eekad-hero__tab-rail {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	height: 1px;
	margin-top: -.5px;
	pointer-events: none;
	z-index: 1;
}
.eekad-hero__tab-rail-seg {
	position: absolute;
	top: 0;
	height: 1px;
	background: var(--c-white);
}
.eekad-hero__tab-reel {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: stretch;
	height: 100%;
	gap: 40px;
	/* Lead/tail padding mirrors the old --lead/--tail line sizing so
	   the resting position of the boxes stays exactly where it was. */
	padding-inline-start: calc((100vw - var(--container)) / 2 + var(--container-px));
	padding-inline-end: 40px;
	cursor: grab;
	touch-action: pan-y;
	-webkit-user-select: none;
	user-select: none;
	will-change: transform;
}
.eekad-hero__tab-reel.is-dragging {
	cursor: grabbing;
}
@media (prefers-reduced-motion: reduce) {
	.eekad-hero__tab-reel { transform: none !important; }
}
.eekad-hero__tab {
	flex: none;
	display: block;
	position: relative;
	line-height: 55px;
	padding: 0 16px;
	font-size: var(--fs-sm);
	font-weight: 500;
	text-align: center;
	white-space: nowrap;
	color: var(--c-text);
	background: transparent;
	border: 1px solid var(--c-white);
	box-sizing: border-box;
	transition: background .15s ease, color .15s ease;
}
.eekad-hero__tab-file {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .03em;
	color: #cdfe64;
	vertical-align: middle;
	margin-inline-end: 4px;
}
.eekad-hero__tab.is-active .eekad-hero__tab-file {
	color: var(--c-text-on-accent);
	background: #cdfe64;
	padding: 2px 8px;
}
/* Single label per tab. The span holds the full title; its visible
   width is clamped by max-width to the "short" measurement, with
   ellipsis hiding the overflow. Hovering opens the clamp to the
   pre-measured "full" width, so the text reveals by growing the
   visible window — no cross-fade, no bulge, no bounce. */
.eekad-hero__tab-label {
	display: inline-block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	vertical-align: middle;
	max-width: var(--label-short, 160px);
	transition: max-width .7s cubic-bezier(.4, 0, .2, 1);
	transition-delay: 0ms;
}
.eekad-hero__tab:hover {
	background: rgba(var(--c-border-rgb), .08);
}
/* Hover uses a short delay to ignore drive-by mouse-overs. */
.eekad-hero__tab:hover .eekad-hero__tab-label {
	max-width: var(--label-full, 720px);
	transition-delay: 220ms;
}
/* Active and keyboard-focused tabs expand immediately — they've
   been intentionally picked, no delay needed. The active tab also
   starts expanded on page load since it's selected by default. */
.eekad-hero__tab.is-active .eekad-hero__tab-label,
.eekad-hero__tab:focus-visible .eekad-hero__tab-label {
	max-width: var(--label-full, 720px);
	transition-delay: 0ms;
}
.eekad-hero__tab.is-active {
	background: var(--c-white);
	color: var(--c-text-on-accent);
	border-color: var(--c-white);
}

/* ----- Hero responsive -----
   Mobile hero is a cinematic story layout: full-bleed image, dark
   gradient at the bottom, content overlaid directly on the image
   (no indigo card), and the tab reel transformed into thin story-
   style progress bars at the top. Swipe left/right changes slides;
   tapping a progress bar jumps to that slide. */
@media (max-width: 768px) {
	.eekad-hero {
		padding-block-start: 120px;
		padding-block-end: 32px;
		/* Tell the browser to only pan vertically — horizontal touch
		   gestures are reserved for our swipe handler so the page won't
		   commit to a scroll mid-gesture. */
		touch-action: pan-y;
	}
	/* Let the absolute tab bars position relative to the hero itself,
	   not the content container. Dropping the content's positioning
	   context walks the ancestor chain up to .eekad-hero (sticky). */
	.eekad-hero__content { position: static; }
	/* Overlay darkens the bottom third so large white text reads
	   cleanly over any image. */
	.eekad-hero__overlay {
		background: linear-gradient(180deg,
			rgba(0, 0, 0, 0)   0%,
			rgba(0, 0, 0, .05) 40%,
			rgba(0, 0, 0, .72) 78%,
			rgba(0, 0, 0, .92) 100%);
	}

	/* Card becomes a frameless wrapper; no fill, no box shadow, no
	   stepped SVG. Content sits directly on the overlay gradient.
	   Horizontal padding moves to card-text (and the CTA's own
	   margin) so the padding is applied uniformly whether there's
	   one flex child or two. */
	.eekad-hero__card {
		height: auto;
		margin: 0;
		padding: 0;
		background: transparent;
		box-shadow: none;
		display: flex;
		flex-direction: column;
	}
	.eekad-hero__card-bg { display: none; }
	.eekad-hero__card-expand { display: none; }
	.eekad-hero__card-text {
		position: relative;
		left: auto;
		top: auto;
		right: auto;
		width: 100%;
		max-width: 100%;
		padding: 0 24px 14px;
		order: 1;
	}
	.eekad-hero__title {
		white-space: normal;
		font-size: clamp(22px, 6.4vw, 30px);
		line-height: 1.2;
		letter-spacing: -.01em;
		font-weight: 700;
		color: var(--c-text);
		text-shadow: 0 2px 16px rgba(0, 0, 0, .35);
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		/* Reserve exactly two lines of height regardless of title
		   length, so short titles don't cause the bars above to jump
		   up and long titles don't push them down between slides. */
		min-height: 2.4em; /* 2 × 1.2 line-height */
	}
	.eekad-hero__excerpt {
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		/* Belt and braces: explicit width cap + word-break so any
		   rogue long string can't push the line past the container
		   and hit the viewport edge. */
		width: 100%;
		max-width: 100%;
		overflow-wrap: break-word;
		word-break: break-word;
		font-size: 13.5px;
		line-height: 1.6;
		color: var(--c-text);
		text-shadow: 0 1px 6px rgba(0, 0, 0, .4);
		/* Reserve exactly two lines so the stack height stays
		   constant across slides. */
		min-height: 3.2em; /* 2 × 1.6 line-height */
	}
	.eekad-hero__cta {
		position: relative;
		inset-inline-end: auto;
		top: auto;
		width: auto;
		margin: 6px 24px 0;
		padding: 14px 24px;
		display: inline-flex;
		align-self: flex-start;
		order: 2;
		background: var(--c-lime);
		color: var(--c-text-on-accent);
		font-weight: 700;
		font-size: 14px;
		border: 0;
	}

	/* Tab reel → story-style progress bars sitting just above the
	   title. Placing them in the content flex flow with order: -1
	   anchors them to the card instead of leaving them floating in
	   the middle of the image — they read as "pagination for this
	   content", not a free-standing element.
	   Width/margin reset: desktop uses a 100vw full-bleed trick
	   (width:100vw + negative margin-inline-start). Explicitly
	   neutralising both so the bars stay inside the content flow
	   with symmetric side padding. */
	.eekad-hero__tabs {
		position: static;
		top: auto;
		left: auto;
		right: auto;
		order: -1;
		height: 3px;
		width: auto;
		margin-inline-start: 24px;
		margin-inline-end: 24px;
		margin-block: 0 22px;
		overflow: visible;
		z-index: 3;
	}
	.eekad-hero__tab-rail { display: none; }
	.eekad-hero__tab-reel {
		display: flex;
		gap: 4px;
		padding: 0;
		width: 100%;
		transform: none !important;
	}
	.eekad-hero__tab {
		flex: 1 1 0;
		min-width: 0; /* let many tabs shrink below their natural size */
		height: 3px;
		padding: 0;
		background: rgba(var(--c-border-rgb), .25);
		border: 0;
		color: transparent;
		font-size: 0;
		line-height: 0;
		transition: background .25s ease;
	}
	.eekad-hero__tab:hover,
	.eekad-hero__tab.is-active {
		background: var(--c-text);
		border: 0;
	}
	.eekad-hero__tab-label { display: none; }
	.eekad-hero__tab-file { display: none; }

	/* Kill rail/segment leftovers on mobile — bars replace them. */
	.eekad-hero__tab-rail-seg { display: none; }
}
@media (max-width: 480px) {
	.eekad-hero { padding-block-start: 100px; }
	.eekad-hero__title { font-size: clamp(20px, 6vw, 26px); }
	.eekad-hero__excerpt { font-size: 13px; -webkit-line-clamp: 2; }
	.eekad-hero__card-text { padding: 0 20px 12px; }
	.eekad-hero__cta { margin: 6px 20px 0; }
	.eekad-hero__tabs { margin: 0 20px 20px; }
	/* Keep bars at 3px height — don't let the tighter screen media
	   query re-inherit desktop tab font/padding that would blow them
	   up into full-size chips. */
	.eekad-hero__tab { padding: 0; font-size: 0; line-height: 0; height: 3px; }
}

/* =============================================================
 * Eekad TV Archive — /tv/
 * =========================================================== */
.eekad-tv-archive {
	background: var(--c-bg-elevated);
}
.eekad-tv-archive__hero {
	position: relative;
	padding-block: 100px 40px;
	background: var(--c-bg-surface);
	border-block-end: 1px solid rgba(var(--c-border-rgb), .05);
	overflow: hidden;
}
.eekad-tv-archive__label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #cdfe64;
	margin-block-end: 16px;
}
.eekad-tv-archive__title {
	font-size: 48px;
	font-weight: 700;
	line-height: 1.15;
	margin: 0 0 16px;
	color: var(--c-text);
}
.eekad-tv-archive__desc {
	font-size: 16px;
	color: var(--c-text-3);
	max-width: 640px;
	margin: 0 0 20px;
	line-height: 1.7;
}
.eekad-tv-archive__count {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: #cdfe64;
	font-family: var(--font-mono, monospace);
	font-size: 13px;
	font-weight: 600;
}

/* Filter pills — matches /news/ style */
.eekad-tv-archive__filters {
	padding-block: 24px;
	margin-block-end: 16px;
}
/* Search + series dropdown toolbar */
.eekad-tv-archive__toolbar {
	display: flex;
	align-items: stretch;
	gap: 0;
	max-width: 480px;
	margin-block-end: 20px;
}
.eekad-tv-archive__search {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 10px;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .08);
	padding: 10px 16px;
	transition: border-color .2s;
}
.eekad-tv-archive__search:focus-within {
	border-color: var(--c-lime, #CDFE64);
}
.eekad-tv-archive__search svg {
	width: 18px;
	height: 18px;
	color: var(--c-text-faint);
	flex-shrink: 0;
}
.eekad-tv-archive__search input[type="text"] {
	background: none;
	border: none;
	color: var(--c-text);
	font-size: 14px;
	font-family: inherit;
	outline: none;
	width: 100%;
	min-width: 0;
	padding: 0;
}
.eekad-tv-archive__search input[type="text"]::placeholder {
	color: var(--c-text-faint);
}
@media (max-width: 768px) {
	.eekad-tv-archive__toolbar { max-width: none; }
	.eekad-tv-archive__search { width: 100%; min-width: 0; }
}

/* Pills */
.eekad-tv-archive__pills {
	display: flex;
	gap: 10px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-bottom: 4px;
}
.eekad-tv-archive__pills::-webkit-scrollbar { display: none; }
.eekad-tv-archive__pill {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 600;
	color: var(--c-text-2);
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .06);
	text-decoration: none;
	white-space: nowrap;
	transition: background .2s, color .2s, border-color .2s;
}
.eekad-tv-archive__pill:hover {
	background: rgba(205, 254, 100, .08);
	color: #cdfe64;
	border-color: rgba(205, 254, 100, .25);
}
.eekad-tv-archive__pill.is-active {
	background: #cdfe64;
	color: var(--c-text-on-accent);
	border-color: #cdfe64;
}

/* Search results (flat grid) */
.eekad-tv-archive__search-results {
	margin-block-end: 48px;
}

/* Featured */
/* --- Playlist layout (series page) --- */
.eekad-playlist {
	margin-block: 32px 0;
	padding-block-end: 80px;
}
.eekad-playlist__layout {
	display: grid;
	grid-template-columns: 380px 1fr;
	grid-template-rows: auto;
	gap: 20px;
}

/* Player */
.eekad-playlist__main {
	min-width: 0;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-playlist__player {
	position: relative;
	aspect-ratio: 16 / 9;
	background: #000;
	overflow: hidden;
	cursor: pointer;
}
.eekad-playlist__poster {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: filter .3s;
}
.eekad-playlist__player:hover .eekad-playlist__poster {
	filter: brightness(.7);
}
.eekad-playlist__play-btn {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
}
.eekad-playlist__play-circle {
	width: 72px;
	height: 72px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(205, 254, 100, .9);
	border: 2px solid #cdfe64;
	transition: transform .3s ease;
}
.eekad-playlist__play-btn:hover .eekad-playlist__play-circle {
	transform: scale(1.12);
}
.eekad-playlist__play-circle svg {
	width: 28px;
	height: 28px;
	color: var(--c-text-on-accent);
}
.eekad-playlist__player iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* Video info */
.eekad-playlist__info {
	padding: 20px 24px 24px;
}
.eekad-playlist__title {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 12px;
	color: var(--c-text);
}
.eekad-playlist__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	font-size: 13px;
	color: var(--c-text-muted);
}
.eekad-playlist__date {
	font-family: var(--font-mono);
	letter-spacing: .02em;
}
.eekad-playlist__sep {
	width: 1px;
	height: 14px;
	background: rgba(var(--c-border-rgb), .15);
}
.eekad-playlist__series {
	color: var(--c-lime);
	font-weight: 600;
}
.eekad-playlist__permalink {
	color: var(--c-text-muted);
	text-decoration: none;
	transition: color .2s;
}
.eekad-playlist__permalink:hover { color: var(--c-lime); }

/* Sidebar */
.eekad-playlist__sidebar {
	display: flex;
	flex-direction: column;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .06);
	height: min(680px, 80vh);
	align-self: start;
}
.eekad-playlist__sidebar-header {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	background: rgba(var(--c-border-rgb), .03);
	border-block-end: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-playlist__sidebar-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--c-text);
}
.eekad-playlist__sidebar-count {
	font-family: var(--font-mono);
	font-size: 12px;
	color: var(--c-text-muted);
}
.eekad-playlist__list {
	flex: 1;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(var(--c-border-rgb), .12) transparent;
}
.eekad-playlist__list::-webkit-scrollbar { width: 4px; }
.eekad-playlist__list::-webkit-scrollbar-track { background: transparent; }
.eekad-playlist__list::-webkit-scrollbar-thumb { background: rgba(var(--c-border-rgb), .12); }

/* Playlist item */
.eekad-playlist__item {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 10px 16px;
	background: none;
	border: none;
	border-block-end: 1px solid rgba(var(--c-border-rgb), .04);
	cursor: pointer;
	text-align: start;
	transition: background .2s;
	color: var(--c-text);
}
.eekad-playlist__item:hover {
	background: rgba(var(--c-border-rgb), .04);
}
.eekad-playlist__item.is-active {
	background: rgba(205, 254, 100, .08);
	box-shadow: inset -3px 0 0 var(--c-lime);
}
.eekad-playlist__item-num {
	flex-shrink: 0;
	width: 20px;
	font-family: var(--font-mono);
	font-size: 12px;
	color: var(--c-text-faint);
	text-align: center;
}
.eekad-playlist__item.is-active .eekad-playlist__item-num {
	color: var(--c-lime);
}
.eekad-playlist__item-thumb {
	flex-shrink: 0;
	position: relative;
	width: 100px;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #000;
}
.eekad-playlist__item-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.eekad-playlist__item-dur {
	position: absolute;
	bottom: 3px;
	right: 3px;
	background: rgba(0, 0, 0, .8);
	color: var(--c-text);
	font-family: var(--font-mono);
	font-size: 10px;
	font-weight: 600;
	padding: 2px 4px;
	line-height: 1;
	direction: ltr;
}
.eekad-playlist__item-body {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.eekad-playlist__item-title {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eekad-playlist__item-date {
	font-family: var(--font-mono);
	font-size: 11px;
	color: var(--c-text-faint);
}

/* Playlist responsive */
@media (max-width: 1024px) {
	.eekad-playlist__layout {
		grid-template-columns: 1fr;
	}
	.eekad-playlist__sidebar {
		max-height: 420px;
		order: 2;
	}
	.eekad-playlist__main {
		order: 1;
	}
}
@media (max-width: 768px) {
	.eekad-playlist__info { padding: 16px; }
	.eekad-playlist__title { font-size: 17px; }
	.eekad-playlist__item-thumb { width: 80px; }
	.eekad-playlist__item-num { display: none; }
}

/* Video grid */
.eekad-tv-archive__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	margin-block-end: 48px;
}
.eekad-tv-archive__card {
	overflow: hidden;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .04);
	transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease;
}
.eekad-tv-archive__card:hover {
	border-color: rgba(205, 254, 100, .15);
	transform: translateY(-4px);
	box-shadow: 0 12px 32px rgba(0, 0, 0, .4);
}
.eekad-tv-archive__card-media {
	display: block;
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #000;
}
.eekad-tv-archive__card-media::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 50%;
	background: linear-gradient(to top, rgba(0, 0, 0, .6), transparent);
	z-index: 1;
	pointer-events: none;
}
.eekad-tv-archive__card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: brightness(.85);
	transition: transform .5s cubic-bezier(.25, .46, .45, .94), filter .4s ease;
}
.eekad-tv-archive__card:hover .eekad-tv-archive__card-media img {
	transform: scale(1.06);
	filter: brightness(1);
}
.eekad-tv-archive__card-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	z-index: 2;
	transition: opacity .3s ease;
}
.eekad-tv-archive__card-play-circle {
	width: 52px;
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(205, 254, 100, .9);
	border: 2px solid #cdfe64;
	transition: transform .3s ease, background .3s ease;
}
.eekad-tv-archive__card:hover .eekad-tv-archive__card-play-circle {
	transform: scale(1.1);
}
.eekad-tv-archive__card-duration {
	position: absolute;
	bottom: 8px;
	right: 8px;
	background: rgba(0, 0, 0, .75);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	color: var(--c-text);
	font-family: var(--font-mono);
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	padding: 4px 6px;
	letter-spacing: .03em;
	z-index: 2;
	direction: ltr;
}
.eekad-tv-archive__card:hover .eekad-tv-archive__card-play { opacity: 1; }
.eekad-tv-archive__card-play svg {
	width: 22px;
	height: 22px;
	color: var(--c-text-on-accent);
}
.eekad-tv-archive__card-body {
	padding: 14px 16px 18px;
}
.eekad-tv-archive__card-series {
	font-size: 11px;
	font-weight: 700;
	color: var(--c-lime, #cdfe64);
	text-transform: uppercase;
	letter-spacing: .04em;
	display: block;
	margin-block-end: 6px;
}
.eekad-tv-archive__card-title {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.5;
	margin: 0 0 8px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eekad-tv-archive__card-title a { transition: color .2s; }
.eekad-tv-archive__card-title a:hover { color: var(--c-lime); }
.eekad-tv-archive__card-date {
	font-family: var(--font-mono);
	font-size: 12px;
	color: var(--c-text-faint);
	letter-spacing: .02em;
}

/* Pagination */
.eekad-tv-archive__pagination {
	margin-block-end: 64px;
	display: flex;
	justify-content: center;
}
.eekad-tv-archive__pagination .page-numbers {
	list-style: none;
	display: flex;
	gap: 4px;
	padding: 0;
	margin: 0;
}
.eekad-tv-archive__pagination .page-numbers li a,
.eekad-tv-archive__pagination .page-numbers li span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	font-size: 14px;
	font-weight: 500;
	color: var(--c-text-muted);
	background: rgba(var(--c-border-rgb), .04);
	transition: background .2s, color .2s;
}
.eekad-tv-archive__pagination .page-numbers li a:hover {
	background: rgba(var(--c-border-rgb), .08);
	color: var(--c-text);
}
.eekad-tv-archive__pagination .page-numbers li span.current {
	background: var(--c-lime);
	color: var(--c-text-on-accent);
	font-weight: 700;
}

/* --- Series rows --- */
.eekad-tv-archive__row {
	margin-block-end: 56px;
	padding-block-end: 56px;
	border-block-end: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-tv-archive__row:last-child {
	border-block-end: none;
}
/* Hero row — first series uses a grid instead of horizontal scroll */
.eekad-tv-archive__row--hero .eekad-tv-archive__row-title {
	font-size: 26px;
}
.eekad-tv-archive__row-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.eekad-tv-archive__row-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-block-end: 16px;
}
.eekad-tv-archive__row-title {
	font-size: 22px;
	font-weight: 700;
	color: var(--c-text);
	margin: 0;
}
.eekad-tv-archive__row-more {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 14px;
	color: var(--c-lime);
	text-decoration: none;
	transition: opacity .2s;
}
.eekad-tv-archive__row-more:hover { opacity: .75; }
.eekad-tv-archive__row-more svg { width: 16px; height: 16px; }
.eekad-tv-archive__row-scroll {
	display: flex;
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-block: 4px;
}
.eekad-tv-archive__row-scroll::-webkit-scrollbar { display: none; }
.eekad-tv-archive__row-card {
	flex: 0 0 300px;
	scroll-snap-align: start;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .04);
	transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease;
}
.eekad-tv-archive__row-card:hover {
	border-color: rgba(205, 254, 100, .15);
	transform: translateY(-4px);
	box-shadow: 0 12px 32px rgba(0, 0, 0, .4);
}
.eekad-tv-archive__row-card .eekad-tv-archive__card-media {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	position: relative;
}
.eekad-tv-archive__row-card .eekad-tv-archive__card-media::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 50%;
	background: linear-gradient(to top, rgba(0, 0, 0, .6), transparent);
	z-index: 1;
	pointer-events: none;
}
.eekad-tv-archive__row-card .eekad-tv-archive__card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: brightness(.85);
	transition: transform .5s cubic-bezier(.25, .46, .45, .94), filter .4s ease;
}
.eekad-tv-archive__row-card:hover .eekad-tv-archive__card-media img {
	transform: scale(1.06);
	filter: brightness(1);
}
.eekad-tv-archive__row-card .eekad-tv-archive__card-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	z-index: 2;
	transition: opacity .3s ease;
}
.eekad-tv-archive__row-card:hover .eekad-tv-archive__card-play { opacity: 1; }
.eekad-tv-archive__row-card .eekad-tv-archive__card-play svg {
	width: 22px;
	height: 22px;
	color: var(--c-text-on-accent);
}
.eekad-tv-archive__row-card .eekad-tv-archive__card-body {
	padding: 12px 14px 16px;
}
.eekad-tv-archive__row-card .eekad-tv-archive__card-title {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.6;
	margin: 0 0 6px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eekad-tv-archive__row-card .eekad-tv-archive__card-title a {
	color: var(--c-text);
	text-decoration: none;
	transition: color .2s;
}
.eekad-tv-archive__row-card .eekad-tv-archive__card-title a:hover { color: var(--c-lime); }
.eekad-tv-archive__row-card .eekad-tv-archive__card-date {
	font-family: var(--font-mono);
	font-size: 12px;
	color: var(--c-text-faint);
	letter-spacing: .02em;
}

@media (max-width: 1024px) {
	.eekad-tv-archive__grid { grid-template-columns: repeat(2, 1fr); }
	.eekad-tv-archive__row-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
	.eekad-tv-archive__hero { padding-block: 80px 28px; }
	.eekad-tv-archive__title { font-size: 32px; }
	.eekad-tv-archive__grid { grid-template-columns: 1fr; }
	.eekad-tv-archive__row-title { font-size: 18px; }
	.eekad-tv-archive__row-grid .eekad-tv-archive__card:nth-child(n+5) { display: none; }
}

/* =============================================================
 * Single Video — /tv/{slug}/
 * =========================================================== */
.eekad-video-single {
	background: var(--c-bg-alt);
	color: var(--c-text-2);
	padding-block-start: 72px;
	padding-block-end: 80px;
}
.eekad-video-single__player-wrap {
	background: #000;
}
.eekad-video-single__player {
	max-width: 1200px;
	margin: 0 auto;
	aspect-ratio: 16 / 9;
	position: relative;
}
.eekad-video-single__player iframe,
.eekad-video-single__player img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.eekad-video-single__yt-poster {
	display: block;
	position: absolute;
	inset: 0;
}
.eekad-video-single__yt-poster img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.eekad-video-single__yt-poster-badge {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	background: rgba(0,0,0,.45);
	color: var(--c-text);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	transition: background .2s;
}
.eekad-video-single__yt-poster:hover .eekad-video-single__yt-poster-badge {
	background: rgba(0,0,0,.6);
}
.eekad-video-single__layout {
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: 48px;
	padding-block-start: 40px;
	align-items: start;
}
.eekad-video-single__header {
	margin-block-end: 24px;
}
.eekad-video-single__series {
	display: inline-block;
	font-size: 13px;
	font-weight: 600;
	color: var(--c-lime);
	text-decoration: none;
	margin-block-end: 10px;
	transition: opacity .2s;
}
.eekad-video-single__series:hover { opacity: .75; }
.eekad-video-single__title {
	font-size: 28px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 12px;
}
.eekad-video-single__meta {
	font-size: 14px;
	color: rgba(255,255,255,.5);
}
.eekad-video-single__desc {
	font-size: 16px;
	line-height: 1.8;
	color: rgba(255,255,255,.7);
	margin-block-end: 24px;
}
.eekad-video-single__desc p { margin: 0; }
.eekad-video-single__yt-link {
	margin-block-start: 24px;
}
.eekad-video-single__yt-link a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: rgba(255,255,255,.6);
	text-decoration: none;
	transition: color .2s;
}
.eekad-video-single__yt-link a:hover { color: #ff0000; }
.eekad-video-single__yt-link svg { flex-shrink: 0; }

/* Related sidebar */
.eekad-video-single__related-heading {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 20px;
	padding-block-end: 12px;
	border-bottom: 1px solid rgba(var(--c-border-rgb),.1);
}
.eekad-video-single__related-list {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.eekad-video-single__related-card {
	display: grid;
	grid-template-columns: 160px 1fr;
	gap: 12px;
	text-decoration: none;
	color: var(--c-text);
	transition: opacity .2s;
}
.eekad-video-single__related-card:hover { opacity: .85; }
.eekad-video-single__related-thumb {
	aspect-ratio: 16 / 9;
	border-radius: 0;
	overflow: hidden;
	position: relative;
	background: rgba(var(--c-border-rgb),.05);
}
.eekad-video-single__related-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.eekad-video-single__related-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,.2);
	opacity: 0;
	transition: opacity .2s;
}
.eekad-video-single__related-card:hover .eekad-video-single__related-play { opacity: 1; }
.eekad-video-single__related-play svg {
	width: 28px;
	height: 28px;
	fill: #fff;
}
.eekad-video-single__related-info h3 {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.5;
	margin: 0 0 4px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eekad-video-single__related-info span {
	font-size: 12px;
	color: rgba(255,255,255,.45);
}
.eekad-video-single__related-all {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-block-start: 20px;
	font-size: 14px;
	color: var(--c-lime);
	text-decoration: none;
	transition: opacity .2s;
}
.eekad-video-single__related-all:hover { opacity: .75; }

@media (max-width: 960px) {
	.eekad-video-single__layout {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.eekad-video-single__related-card {
		grid-template-columns: 140px 1fr;
	}
}
@media (max-width: 768px) {
	.eekad-video-single__title { font-size: 22px; }
	.eekad-video-single__related-card {
		grid-template-columns: 120px 1fr;
	}
}

/* =============================================================
 * Homepage — Eekad TV
 * =========================================================== */
.eekad-tv {
	padding-block: 80px;
}
.eekad-tv > .eekad-container {
	max-width: 1280px;
	padding-inline: 32px;
}

/* Header: logo top-right (inline-start), date bottom-left (inline-end) */
.eekad-tv__header {
	position: relative;
	min-height: 60px;
	margin-block-end: 16px;
}
.eekad-tv__heading {
	position: absolute;
	inset-inline-start: 0;
	top: 0;
	margin: 0;
	line-height: 1;
}
.eekad-tv__logo {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	direction: ltr;
}
.eekad-tv__logo-tv {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #d13636;
	color: #fff;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: .5px;
	padding: 4px 8px;
	line-height: 1;
}
.eekad-tv__logo-name {
	font-size: 28px;
	font-weight: 800;
	color: var(--c-lime, #CDFE64);
	line-height: 1;
}
.eekad-tv__header-date {
	position: absolute;
	top: -36px;
	inset-inline-end: 0;
	z-index: 1;
	font-size: 18px;
	color: var(--c-text);
	font-weight: 500;
}

.eekad-tv__layout {
	display: grid;
	grid-template-columns: 55% 1fr;
	grid-template-rows: 1fr;
	gap: 24px;
	align-items: stretch;
}

/* Featured frame: outer container with stepped-corner border (subtract shape) */
.eekad-tv__featured {
	position: relative;
	padding: 20px;
	display: flex;
	flex-direction: column;
}
.eekad-tv__frame {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 0;
}

/* Player: image area inside the frame */
.eekad-tv__player {
	position: relative;
	z-index: 1;
	aspect-ratio: 16 / 7.2;
	background: #000;
	overflow: hidden;
}
.eekad-tv__poster {
	width: 100%;
	height: 100%;
	object-fit: cover;
	cursor: pointer;
}
.eekad-tv__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
}
.eekad-tv__play svg {
	width: 68px;
	height: 48px;
	opacity: .85;
	transition: opacity .2s, transform .2s;
}
.eekad-tv__play:hover svg {
	opacity: 1;
	transform: scale(1.08);
}
.eekad-tv__player iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* Title area: below the image, inside the frame */
.eekad-tv__featured-body {
	position: relative;
	z-index: 1;
	padding-block-start: 24px;
}
.eekad-tv__featured-title {
	font-size: 28px;
	font-weight: 700;
	line-height: 1.5;
	margin: 0;
	color: #fff;
	border-inline-start: 5px solid var(--c-lime, #CDFE64);
	padding-inline-start: 16px;
}
.eekad-tv__featured-title a {
	color: inherit;
	transition: color .2s;
}
.eekad-tv__featured-title a:hover { color: var(--c-lime); }

/* Sidebar list — height matches the main rectangle of the frame,
   excluding the notch + title area below it. */
.eekad-tv__list {
	display: flex;
	flex-direction: column;
	gap: 12px;
	overflow-y: scroll;
	scrollbar-width: thin;
	scrollbar-color: var(--c-text-faint) var(--c-bg-elevated);
	max-height: 460px;
	padding-inline-end: 10px;
}
.eekad-tv__list::-webkit-scrollbar { width: 6px; }
.eekad-tv__list::-webkit-scrollbar-track { background: var(--c-bg-elevated); }
.eekad-tv__list::-webkit-scrollbar-thumb { background: var(--c-text-faint); border-radius: 3px; }
.eekad-tv__item {
	display: flex;
	gap: 16px;
	padding: 18px;
	background: var(--card-bg, var(--c-bg-surface));
	text-decoration: none;
	color: var(--c-text);
	transition: background .2s;
	cursor: pointer;
	align-items: center;
}
.eekad-tv__item:hover { background: var(--card-bg, var(--c-bg-surface)); filter: brightness(1.1); }
.eekad-tv__item.is-active {
	background: rgba(205, 254, 100, .06);
	box-shadow: inset -3px 0 0 var(--c-lime, #cdfe64);
}
.eekad-tv__item.is-active .eekad-tv__item-title { color: var(--c-lime, #cdfe64); }
.eekad-tv__item-thumb {
	position: relative;
	flex-shrink: 0;
	width: 195px;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}
.eekad-tv__item-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.eekad-tv__item-body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
	flex: 1;
}
.eekad-tv__item-title {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-block-end: 8px;
}
.eekad-tv__item-date {
	font-size: 13px;
	color: var(--c-text-faint);
}
@media (max-width: 900px) {
	.eekad-tv > .eekad-container { padding-inline: 0; }
	.eekad-tv__layout {
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		gap: 0;
		align-items: start;
	}
	.eekad-tv__frame { display: none; }
	.eekad-tv__featured { padding: 0; display: flex; flex-direction: column; }
	.eekad-tv__player {
		order: 1;
		aspect-ratio: 16 / 9;
		position: relative;
	}
	.eekad-tv__featured-body { order: 2; padding: 16px 20px 0; }
	.eekad-tv__featured-title {
		font-size: 18px;
		line-height: 1.5;
		border-inline-start: none;
		padding-inline-start: 0;
		text-align: start;
	}
	.eekad-tv__header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		min-height: auto;
		margin-block-end: 0;
		padding: 0 20px 14px;
	}
	.eekad-tv__heading { position: static; }
	.eekad-tv__header-date {
		position: static;
		font-size: 13px;
		color: var(--c-text-muted);
		order: 3;
		padding: 4px 20px 20px;
	}
	/* "Up Next" list — vertical stack of compact rows.
	   Each row: thumbnail (~40% width, 16:9) + title/date stacked. */
	.eekad-tv__list {
		flex-direction: column;
		overflow: visible;
		max-height: none;
		gap: 0;
		padding: 0;
		margin: 16px 0 0;
	}
	.eekad-tv__item {
		flex-direction: row;
		flex: initial;
		padding: 12px 20px;
		gap: 14px;
		background: transparent;
		border-block-end: 1px solid rgba(var(--c-border-rgb), .06);
		align-items: flex-start;
	}
	.eekad-tv__item:last-child { border-block-end: none; }
	.eekad-tv__item:hover { background: rgba(var(--c-border-rgb), .03); }
	.eekad-tv__item.is-active {
		background: rgba(205, 254, 100, .06);
		box-shadow: none;
		border-inline-start: 3px solid var(--c-lime);
		padding-inline-start: 17px;
	}
	.eekad-tv__item-thumb {
		width: 40%;
		max-width: 168px;
		aspect-ratio: 16 / 9;
		flex-shrink: 0;
	}
	.eekad-tv__item-body {
		padding: 0;
		min-width: 0;
		flex: 1;
		gap: 4px;
	}
	.eekad-tv__item-title {
		font-size: 14px;
		font-weight: 700;
		line-height: 1.45;
		-webkit-line-clamp: 3;
		margin-block-end: 4px;
	}
	.eekad-tv__item-date {
		display: block;
		font-size: 12px;
		color: var(--c-text-faint);
	}
	/* Cap the up-next list at 4 items by default; the expand button
	   reveals the rest inline (one-shot — once expanded, the button
	   removes itself). */
	.eekad-tv__list .eekad-tv__item:nth-child(n + 5) { display: none; }
	.eekad-tv__list.is-expanded .eekad-tv__item:nth-child(n + 5) { display: flex; }
	/* Wrapper centres the button just like the category archive's
	   "عرض المزيد" — same chrome reused so both surfaces speak the
	   same load-more language. */
	.eekad-tv__expand-wrap {
		display: flex;
		justify-content: center;
		padding-inline: 20px;
	}
	.eekad-tv__expand {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		margin: 24px auto 0;
		padding: 10px 28px;
		font-size: 14px;
		font-weight: 600;
		font-family: inherit;
		color: var(--c-text-muted);
		background: none;
		border: 1px solid rgba(var(--c-border-rgb), .1);
		cursor: pointer;
		transition: color .2s, border-color .2s;
	}
	.eekad-tv__expand:hover {
		color: var(--c-text);
		border-color: var(--c-lime, #cdfe64);
	}
}
@media (min-width: 901px) {
	/* Desktop sidebar already has its own scrollable container — the
	   expand button is mobile-only. */
	.eekad-tv__expand-wrap { display: none; }
}
@media (max-width: 480px) {
	.eekad-tv { padding-block: 32px; }
	.eekad-tv__logo-tv { font-size: 13px; padding: 3px 6px; }
	.eekad-tv__logo-name { font-size: 18px; }
	.eekad-tv__featured-title { font-size: 16px; }
	.eekad-tv__featured-body { padding: 14px 16px 0; }
	.eekad-tv__header { padding: 0 16px 12px; }
	.eekad-tv__header-date { padding: 4px 16px 16px; font-size: 12px; }
	.eekad-tv__list { padding: 0 16px; gap: 10px; }
	.eekad-tv__item { flex: 0 0 60%; }
	.eekad-tv__item-title { font-size: 13px; }
}

/* =============================================================
 * Homepage — Categories (full-bleed horizontal scroll row)
 * =========================================================== */
.eekad-categories {
	overflow: hidden;
}
.eekad-categories__row {
	display: flex;
	align-items: stretch;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}
.eekad-categories__row::-webkit-scrollbar { display: none; }

.eekad-category {
	position: relative;
	flex: 0 0 418px;
	min-height: 664px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 64px;
	overflow: hidden;
	scroll-snap-align: start;
	isolation: isolate;
	border-inline-end: 1px solid rgba(var(--c-border-rgb), .04);
}
.eekad-category__bg {
	position: absolute;
	inset: 0;
	background-image: var(--cat-bg);
	background-size: cover;
	background-position: center;
	z-index: -2;
	filter: grayscale(.8) brightness(.5);
	transition: filter .4s ease;
}
.eekad-category:hover .eekad-category__bg {
	filter: grayscale(0) brightness(.7);
}
.eekad-category::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(var(--c-bg-elevated-rgb), .35) 0%, rgba(var(--c-bg-elevated-rgb), .65) 50%, rgba(var(--c-bg-elevated-rgb), .95) 100%);
	z-index: -1;
	pointer-events: none;
	transition: opacity .4s ease;
}
.eekad-category:hover::after {
	opacity: .75;
}
.eekad-category__glow {
	display: none;
}

.eekad-category__body {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	width: 100%;
	color: var(--c-text);
	text-align: center;
	opacity: .45;
	transition: opacity .4s ease;
}
.eekad-category:hover .eekad-category__body {
	opacity: 1;
}

.eekad-category__title {
	font-size: var(--fs-h3);
	font-weight: 700;
	line-height: 1.1;
	margin: 0;
}
.eekad-category__bracket {
	color: var(--c-lime);
}
.eekad-section-bracket {
	color: var(--c-lime);
}
.eekad-category__desc {
	font-size: var(--fs-sm);
	font-weight: 500;
	line-height: 1.55;
	color: var(--c-text-muted);
	margin: 0;
}
.eekad-category__stats {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	font-family: var(--font-mono);
	font-size: 16px;
	color: var(--c-text);
	padding: 8px 12px;
}
.eekad-category__stats-sep {
	width: 1px;
	height: 14px;
	background: rgba(var(--c-border-rgb), .35);
}
.eekad-category__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 28px;
	background: var(--c-text-faint);
	color: var(--c-text-on-accent);
	border: none;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
	transition: background .4s ease, color .4s ease, border-color .4s ease;
}
.eekad-category:hover .eekad-category__cta {
	background: var(--c-lime);
	color: var(--c-text-on-accent);
	border-color: var(--c-lime);
}
/* --- Categories: row wrapper --- */
.eekad-categories__row-wrap {
	position: relative;
}

/* --- Categories: arrow buttons --- */
.eekad-categories__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 1px solid rgba(var(--c-border-rgb), .15);
	background: rgba(var(--c-bg-base-rgb), .75);
	color: var(--c-text);
	cursor: pointer;
	opacity: 0;
	transition: opacity .3s ease, background .2s ease;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}
.eekad-categories__arrow:hover {
	background: rgba(205, 254, 100, .15);
	border-color: rgba(205, 254, 100, .3);
	color: #cdfe64;
}
.eekad-categories__arrow--prev { right: 16px; }
.eekad-categories__arrow--next { left: 16px; }
.eekad-categories__row-wrap.has-overflow-start .eekad-categories__arrow--prev { opacity: 1; }
.eekad-categories__row-wrap.has-overflow-end .eekad-categories__arrow--next { opacity: 1; }

/* --- Categories responsive --- */
@media (max-width: 768px) {
	.eekad-category {
		flex: 0 0 240px;
		min-height: 480px;
		padding: 32px;
	}
	.eekad-category__title { font-size: 24px; }
	.eekad-category__desc { font-size: 15px; }
	.eekad-category__cta { font-size: 16px; padding: 10px 22px; }
	.eekad-category__stats { font-size: 14px; }
	.eekad-categories__arrow { display: none; }
}
@media (max-width: 480px) {
	.eekad-category {
		flex: 0 0 208px;
		min-height: 400px;
		padding: 24px;
	}
	.eekad-category__title { font-size: 20px; }
	.eekad-category__desc { font-size: 14px; }
	.eekad-category__cta { font-size: 14px; padding: 8px 18px; }
	.eekad-category__stats { font-size: 13px; gap: 10px; }
	.eekad-category__body { gap: 8px; }
}

/* =============================================================
 * "الأكثر قراءة" — most-read section
 * =============================================================
 * Layout: a 2-column grid of 4 cards (top-right is the highlighted
 * "rank #1" card with an indigo background). Each card is a 3-column
 * mini-grid: big numeral on the visual LEFT, title + meta in the
 * middle, square thumbnail on the visual far edge. The section header
 * is a lime "tag" badge with the Figma Subtract path inlined as SVG.
 */
.eekad-picks {
	color: var(--c-text);
}
.eekad-picks__wrap {
	max-width: 1280px;
	margin-inline: auto;
	padding: 80px 32px;
	display: flex;
	flex-direction: column;
	align-items: flex-start; /* RTL: visual right */
}

/* --- Header: brackets + title --- */
.eekad-picks__header {
	display: flex;
	justify-content: flex-start; /* RTL: visual right */
	margin-bottom: 32px;
}
.eekad-picks__title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-weight: 700;
	font-size: 30px;
	line-height: 1;
}
.eekad-picks__title-text { padding-inline: 4px; }

/* --- 2×2 grid --- */
.eekad-picks__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 200px 200px;
	grid-auto-flow: column;
	gap: 32px;
	width: 100%;
}

/* --- Card --- */
.eekad-picks__card {
	position: relative;
	display: flex;
	flex-direction: row-reverse; /* RTL: thumb right, rank left */
	align-items: center;
	gap: 16px;
	padding: 24px;
	min-width: 0;
	background: var(--card-bg, var(--c-bg-elevated));
	color: var(--c-text);
	transition: background .2s ease;
}

/* Featured card — lime */
.eekad-picks__card.is-featured {
	background: var(--c-lime);
	color: var(--c-text-on-accent);
	box-shadow: 0 8px 5px rgba(0,0,0,.05), 0 3px 3px rgba(0,0,0,.09), 0 1px 2px rgba(0,0,0,.1);
}
.eekad-picks__card.is-featured:hover { background: #CDFE64; }

/* Lime tab on featured card */
.eekad-picks__tag {
	position: absolute;
	top: 0;
	inset-inline-end: calc(100% + 0px);
	display: flex;
	align-items: center;
	padding: 13px 7px;
	background: var(--c-lime);
}
.eekad-picks__tag-bar {
	display: block;
	width: 10px;
	height: 27px;
	background: var(--c-bg-elevated);
}

/* Body: meta + title */
.eekad-picks__body {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
	text-align: right;
}
.eekad-picks__meta {
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: flex-start; /* RTL: visual right */
	gap: 16px;
	font-size: 20px;
	color: var(--c-text-2);
}
.eekad-picks__card.is-featured .eekad-picks__meta {
	color: var(--c-text-on-accent);
}
.eekad-picks__sep {
	display: inline-block;
	width: 1px;
	align-self: stretch;
	background: currentColor;
	opacity: .4;
}
.eekad-picks__card-title {
	margin: 0;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
/* Thumbnail — square */
.eekad-picks__thumb {
	flex: 0 0 auto;
	width: 140px;
	height: 140px;
	overflow: hidden;
}
.eekad-picks__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* --- Filter pills (category-hot) --- */
.eekad-picks__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 24px;
}
.eekad-picks__pill {
	appearance: none;
	border: 0;
	background: var(--c-bg-surface);
	color: var(--c-text);
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	padding: 10px 22px;
	cursor: pointer;
	transition: background .15s, color .15s;
}
.eekad-picks__pill:hover {
	background: var(--c-bg-elevated);
	color: var(--c-text);
}
.eekad-picks__pill.is-active {
	background: var(--c-lime);
	color: var(--c-text-on-accent);
}

/* --- Panels (one per pill) --- */
.eekad-picks__panel { width: 100%; display: none; }
.eekad-picks__panel.is-active { display: block; }

/* --- Responsive --- */
@media (max-width: 900px) {
	.eekad-picks__grid {
		grid-template-columns: 1fr;
		grid-auto-flow: row;
	}
}
@media (max-width: 768px) {
	.eekad-picks__wrap { padding: 48px 16px; }
	.eekad-picks__grid { grid-template-rows: auto; gap: 16px; }
	.eekad-picks__card { padding: 16px; height: auto; min-height: 140px; }
	.eekad-picks__thumb { width: 100px; height: 100px; flex: 0 0 100px; }
	.eekad-picks__card-title { font-size: 18px; }
	.eekad-picks__meta { font-size: 16px; }
	.eekad-picks__title { font-size: 24px; }
	.eekad-picks__pills {
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}
	.eekad-picks__pills::-webkit-scrollbar { display: none; }
	.eekad-picks__pill { flex-shrink: 0; }
}
@media (max-width: 480px) {
	.eekad-picks__wrap { padding: 32px 12px; }
	.eekad-picks__card { padding: 12px; gap: 10px; }
	.eekad-picks__thumb { width: 80px; height: 80px; flex: 0 0 80px; }
	.eekad-picks__card-title { font-size: 16px; }
	.eekad-picks__meta { font-size: 14px; }
	.eekad-picks__title { font-size: 22px; }
}

/* =============================================================
 * "تحقق معنا" — verification carousel
 * =============================================================
 * Horizontal scroller of fact-check cards. Each card is a square
 * image stacked above a dark (or indigo, when featured) body that
 * contains a kicker line, the verdict title, and a CTA button. A
 * red "مضلل" / green "صحيح" sticker plus a small QR sticker are
 * pinned over the bottom edge of the image.
 */
.eekad-verify {
	position: relative;
	padding-block: 80px;
	color: var(--c-text);
	overflow: hidden;
}
.eekad-verify__bg,
.eekad-verify__bg-veil {
	display: none;
}
.eekad-verify .eekad-container { position: relative; z-index: 1; }
.eekad-verify__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-block-end: 32px;
}
.eekad-verify__title {
	margin: 0;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-size: 30px;
	font-weight: 700;
	line-height: 1;
	color: var(--c-text);
}
.eekad-verify__header-actions {
	display: inline-flex;
	align-items: center;
	gap: 20px;
}
.eekad-verify__all-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 600;
	color: var(--c-text-on-accent);
	background: var(--c-lime, #cdfe64);
	border-radius: 0;
	transition: transform .2s, box-shadow .2s;
}
.eekad-verify__all-link:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 14px rgba(205, 254, 100, .3);
}
.eekad-verify__all-link svg { flex-shrink: 0; }
.eekad-verify__nav {
	display: inline-flex;
	gap: 12px;
}
.eekad-verify__nav-btn {
	width: 48px;
	height: 48px;
	background: transparent;
	border: 1px solid rgba(var(--c-border-rgb), .25);
	color: var(--c-text);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 0;
	transition: background .15s ease, border-color .15s ease;
}
.eekad-verify__nav-btn:hover {
	background: rgba(var(--c-border-rgb), .08);
	border-color: rgba(var(--c-border-rgb), .5);
}
.eekad-verify__nav-btn svg { width: 22px; height: 22px; }

/* Carousel viewport masks the rail to the container; the rail
   itself is wider than the viewport and is translated by JS. */
.eekad-verify__viewport {
	position: relative;
	z-index: 1;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-padding-inline-start: max(var(--container-px), calc((100vw - var(--container)) / 2 + var(--container-px)));
	scrollbar-width: none;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-inline: contain;
}
.eekad-verify__viewport::-webkit-scrollbar { display: none; }
/* Full-bleed wrapper: pads the leading edge so the rail starts aligned
   with .eekad-container's leading edge, but the trailing side runs all
   the way to the screen edge so the last card can extend past. */
.eekad-verify__viewport .eekad-container-bleed {
	padding-inline-start: max(var(--container-px), calc((100vw - var(--container)) / 2 + var(--container-px)));
	padding-inline-end: 24px;
}
.eekad-verify__rail {
	display: flex;
	gap: 32px;
	width: max-content;
}

/* Each card: ~360px wide, ~560px tall. The photo fills the entire
   card; the body is absolutely positioned over the bottom portion
   with a clip-path tab on the leading edge so the photo bleeds
   through the cutout (matches Figma boolean Subtract shape). */
.eekad-verify__card {
	flex: 0 0 360px;
	height: 560px;
	position: relative;
	background: var(--card-bg, var(--c-bg-surface));
	overflow: hidden;
	scroll-snap-align: start;
	transition: transform .25s ease;
}

.eekad-verify__media {
	position: absolute;
	inset: 0;
	overflow: hidden;
	background: var(--c-bg-base);
}
.eekad-verify__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .4s ease;
}

/* Verdict sticker */
.eekad-verify__sticker {
	position: absolute;
	display: block;
	width: 196px;
	height: auto;
	inset-inline-end: 24px;
	bottom: 218px;
	z-index: 2;
	pointer-events: none;
}

/* Body shape: NOT a plain rectangle. Matches Figma "Subtract"
   boolean op (94:1466 / 94:1764) exactly. Path:
     M294.377 22.417 H394.333 V219 H-0.667 V0 H294.377 V22.417 Z
   Read: the LEFT 75% of the body extends up to y=0 (full height),
   then steps DOWN to y≈10% for the RIGHT 25%. So the body has a
   TAB on its left side (visual left) — same side as the sticker,
   making the body wrap around it slightly. The photo behind the
   card bleeds through the recessed area on the right.
   In RTL, physical left of the box = visual left = where the
   sticker sits and where the tab pokes up. */
.eekad-verify__body {
	position: absolute;
	inset-inline: -1px;
	bottom: -1px;
	height: 242px;
	padding: 56px 26px 22px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	background: var(--card-bg, var(--c-bg-surface));
	z-index: 1;
	clip-path: polygon(
		0% 0%,
		74.5% 0%,
		74.5% 9.13%,
		100% 9.13%,
		100% 100%,
		0% 100%
	);
}
.eekad-verify__kicker {
	margin: 0;
	font-size: 13px;
	font-weight: 400;
	color: var(--c-text-2);
	text-align: center;
}
.eekad-verify__heading {
	margin: 0;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
	color: var(--c-text);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eekad-verify__heading a { color: inherit; }
.eekad-verify__heading a:hover { opacity: .85; }
.eekad-verify__cta {
	align-self: flex-start; /* RTL: visual right edge of body */
	margin-block-start: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 110px;
	padding: 10px 20px;
	background: var(--c-indigo);
	color: var(--c-text);
	font-size: 14px;
	font-weight: 600;
	transition: background .15s ease, transform .15s ease;
}
.eekad-verify__cta:hover {
	background: var(--c-indigo-deep);
	transform: translateY(-1px);
}
/* --- Verify responsive --- */
@media (max-width: 768px) {
	.eekad-verify { padding-block: 48px; }
	.eekad-verify__header { flex-wrap: wrap; gap: 16px; }
	.eekad-verify__title { font-size: 24px; }
	.eekad-verify__card { flex: 0 0 280px; height: 460px; }
	.eekad-verify__rail { gap: 20px; }
	.eekad-verify__body { height: 200px; padding: 40px 20px 18px; }
	.eekad-verify__heading { font-size: 18px; }
	.eekad-verify__sticker { width: 140px; }
}
@media (max-width: 480px) {
	.eekad-verify { padding-block: 40px; }
	.eekad-verify__card { flex: 0 0 240px; height: 400px; }
	.eekad-verify__body { height: 180px; padding: 36px 16px 14px; }
	.eekad-verify__heading { font-size: 16px; }
	.eekad-verify__sticker { width: 112px; }
	.eekad-verify__kicker { font-size: 12px; }
	.eekad-verify__cta { padding: 8px 14px; font-size: 13px; }
	.eekad-verify__title { font-size: 20px; }
}

/* =============================================================
 * Skeleton page placeholder (delete once homepage is built)
 * =========================================================== */
.eekad-skeleton {
	max-width: 720px;
	margin: 80px auto;
	padding: 32px;
	background: var(--c-bg-elevated);
	border: 1px solid var(--c-indigo-muted);
	border-radius: 0;
}
.eekad-skeleton h1 {
	font-size: var(--fs-h2);
	margin: 0 0 12px;
	color: var(--c-lime);
	font-weight: 700;
}
.eekad-skeleton p { color: var(--c-text-3); margin: 0 0 8px; }
.eekad-skeleton code {
	font-family: var(--font-mono);
	color: var(--c-lime);
	background: var(--c-bg-elevated);
	padding: 2px 6px;
	border-radius: 0;
}

/* =============================================================
 * Hot Articles section ("مقالات الساخنة") — Figma node 53:2
 * Two-column: featured card on the visual right, three small
 * cards stacked on the visual left. Indigo bg with subtle dot grid.
 * =========================================================== */
.eekad-hot {
	position: relative;
	padding-block: 80px;
	background: var(--c-bg-surface);
	color: var(--c-text);
	overflow: hidden;
}

/* --- Header --- */
.eekad-hot__header {
	display: flex;
	justify-content: flex-start; /* RTL: visually right */
	margin-block-end: 32px;
}
.eekad-hot__title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	color: var(--c-text);
	font-family: var(--font-sans);
	font-weight: 700;
	font-size: 30px;
	line-height: 1;
}
.eekad-hot__title-text { display: inline-block; padding-inline: 4px; }

/* --- Two-column grid --- */
.eekad-hot__grid {
	display: grid;
	grid-template-columns: 650px 1fr; /* featured | small stack — col 1 is visual right in RTL */
	gap: 32px;
	align-items: start;
}

/* --- Small cards stack --- */
.eekad-hot__list {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.eekad-hot__card {
	display: grid;
	grid-template-columns: 174px 1fr 24px;
	gap: 16px;
	align-items: stretch;
	height: 206px;
	padding: 16px;
	background: var(--c-bg-elevated);
	color: var(--c-text);
	cursor: pointer;
	transition: background .2s ease;
}
.eekad-hot__card.is-active {
	background: var(--c-bg-elevated);
}
.eekad-hot__card-thumb { order: -1; }
.eekad-hot__card-icon {
	display: block;
	width: 24px;
	height: 24px;
	order: 1;
	align-self: start;
}
.eekad-hot__card-icon svg { width: 100%; height: 100%; display: block; transform: scaleX(-1); }
.eekad-hot__card-text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
	min-width: 0;
}
.eekad-hot__card-heading {
	margin: 0;
	font-family: var(--font-sans);
	font-weight: 700;
	font-size: 18px;
	line-height: 1.5;
	color: var(--c-text);
}
.eekad-hot__card-heading a {
	color: inherit;
	text-decoration: none;
}
.eekad-hot__card-heading a:hover { color: var(--c-lime); }
.eekad-hot__card-thumb {
	width: 174px;
	overflow: hidden;
	background: var(--c-bg-elevated);
	align-self: stretch;
}
.eekad-hot__card-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* --- Featured card --- */
.eekad-hot__featured {
	position: relative;
	width: 650px;
	height: 650px;
}
.eekad-hot__featured-media {
	position: absolute;
	inset: 0;
	background: var(--c-bg-elevated);
	overflow: hidden;
	/* Subtract path: M522.658 40 H650 V650 H59 V596 H0 V0 H522.658 Z
	   Top-right notch (522.658×40) and bottom-left notch (59×54). */
	clip-path: polygon(
		80.41% 6.15%,
		100%   6.15%,
		100%   100%,
		9.08%  100%,
		9.08%  91.69%,
		0%     91.69%,
		0%     0%,
		80.41% 0%
	);
}
.eekad-hot__featured-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: opacity .25s ease;
}
.eekad-hot__featured-body {
	position: absolute;
	left: 44px;
	top: 388px;
	width: 561px;
	height: 219px;
	background: var(--c-bg-elevated);
	color: var(--c-text);
	/* Subtract path: M419.037 22.417 H561 V219 H71 V171 H0 V0 H419.037 Z
	   Top-right notch (142×22) and bottom-left notch (71×48). */
	clip-path: polygon(
		74.69% 10.24%,
		100%   10.24%,
		100%   100%,
		12.66% 100%,
		12.66% 78.08%,
		0%     78.08%,
		0%     0%,
		74.69% 0%
	);
}
.eekad-hot__featured-text {
	position: absolute;
	left: 140px;
	top: 50px;
	right: 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.eekad-hot__featured-heading {
	margin: 0;
	font-family: var(--font-sans);
	font-weight: 700;
	font-size: 20px;
	line-height: 1.4;
	color: var(--c-text);
}
.eekad-hot__featured-heading a { color: inherit; text-decoration: none; }
.eekad-hot__featured-heading a:hover { color: var(--c-lime); }
.eekad-hot__cta {
	position: absolute;
	left: 21px;  /* 65 - 44 */
	top: 21px;   /* 409 - 388 */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 20px;
	background: var(--c-indigo);
	color: var(--c-text);
	font-family: var(--font-sans);
	font-weight: 600;
	font-size: 14px;
	line-height: 24px;
	text-decoration: none;
	transition: background-color .15s ease;
}
.eekad-hot__cta:hover { background: var(--c-indigo-deep); }

/* --- Shared text styles for views + meta row --- */
.eekad-hot__views {
	margin: 0;
	font-family: var(--font-sans);
	font-weight: 300;
	font-size: 16px;
	line-height: 1.3;
	color: var(--c-text-2);
}
.eekad-hot__featured-text .eekad-hot__views { font-size: 18px; }
.eekad-hot__meta {
	margin: 0;
	display: flex;
	align-items: center;
	gap: 16px;
	font-family: var(--font-sans);
	font-weight: 300;
	font-size: 16px;
	line-height: 1.3;
	color: var(--c-text-2);
}
.eekad-hot__featured-text .eekad-hot__meta { font-size: 18px; }
.eekad-hot__meta-sep {
	display: inline-block;
	width: 21px;
	height: 1px;
	background: var(--c-text-2);
}
.eekad-hot__featured-text .eekad-hot__meta-sep { width: 24px; }

/* --- Responsive: collapse below the desktop layout --- */
@media (max-width: 1100px) {
	.eekad-hot__grid {
		grid-template-columns: 1fr;
	}
	/* Flatten featured card: image on top, body below — no clip-path */
	.eekad-hot__featured {
		width: 100%;
		height: auto;
	}
	.eekad-hot__featured-media {
		position: relative;
		aspect-ratio: 16 / 9;
		clip-path: none;
	}
	.eekad-hot__featured-media img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
	}
	.eekad-hot__featured-body {
		position: relative;
		left: auto;
		top: auto;
		bottom: auto;
		width: 100%;
		height: auto;
		min-height: 140px;
		clip-path: none;
		padding: 20px;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}
	.eekad-hot__featured-text {
		position: relative;
		left: auto;
		top: auto;
		width: 100%;
	}
	.eekad-hot__featured-heading {
		min-height: 3em;
	}
	.eekad-hot__cta {
		position: relative;
		left: auto;
		top: auto;
		align-self: flex-start;
	}
}
@media (max-width: 768px) {
	.eekad-hot { padding-block: 48px; }
	.eekad-hot__header { margin-block-end: 28px; }
	.eekad-hot__title { font-size: 24px; }
	.eekad-hot__featured-media { aspect-ratio: 16 / 10; }
	.eekad-hot__featured-heading { font-size: 18px; }
	.eekad-hot__featured-text .eekad-hot__views { font-size: 15px; }
	.eekad-hot__featured-text .eekad-hot__meta { font-size: 14px; }
	.eekad-hot__card {
		grid-template-columns: 120px 1fr 24px;
		height: auto;
		min-height: 120px;
		padding: 14px;
		gap: 12px;
	}
	.eekad-hot__card-thumb { width: 120px; }
	.eekad-hot__card-heading { font-size: 15px; line-height: 1.5; }
	.eekad-hot__views { font-size: 13px; }
	.eekad-hot__meta { font-size: 13px; gap: 10px; }
}
@media (max-width: 480px) {
	.eekad-hot { padding-block: 32px; }
	.eekad-hot__title { font-size: 22px; }
	.eekad-hot__featured-heading { font-size: 16px; min-height: 3em; }
	.eekad-hot__featured-body { padding: 16px; }
	.eekad-hot__featured-text .eekad-hot__views { font-size: 14px; }
	.eekad-hot__featured-text .eekad-hot__meta { font-size: 13px; }
	.eekad-hot__card {
		grid-template-columns: 100px 1fr;
		padding: 12px;
		gap: 10px;
		min-height: 100px;
	}
	.eekad-hot__card-icon { display: none; }
	.eekad-hot__card-thumb { width: 100px; }
	.eekad-hot__card-heading { font-size: 14px; }
}

/* =============================================================
 * Featured Investigations section ("أبرز التحقيقات") — Figma 157:3069
 * Dark section with bordered image showcase, nav arrows, title +
 * excerpt, and a 3-card strip below.
 * =========================================================== */
.eekad-feat {
	position: relative;
	background: var(--c-bg-surface);
	color: var(--c-text);
	overflow: hidden;
	isolation: isolate;
}

/* Blurred backdrop image */
.eekad-feat__backdrop {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	filter: blur(3.5px);
	opacity: .5;
	z-index: 0;
}

/* Inner wrapper — matches Figma "Text Frame": 1280px, 32px px, 64px py */
.eekad-feat__wrap {
	position: relative;
	z-index: 1;
	max-width: 1280px;
	margin-inline: auto;
	padding: 80px 32px;
	display: flex;
	flex-direction: column;
	align-items: flex-start; /* RTL: visual right */
}

/* --- Header: filled brackets + title --- */
.eekad-feat__header {
	display: flex;
	justify-content: flex-start; /* RTL: visual right */
	margin-bottom: 32px;
}
.eekad-feat__title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	color: var(--c-text);
	font-weight: 700;
	font-size: 30px;
	line-height: 1;
}
.eekad-feat__title-text { padding-inline: 4px; }

/* --- Main showcase image area --- */
.eekad-feat__showcase {
	position: relative;
	width: 100%;
	min-height: 670px;
	border: 19px solid var(--c-coral);
	border-bottom: none;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 32px;
	padding-inline-start: 0;
}
/* Image wrapper clips content without affecting card overlap */
.eekad-feat__showcase-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
	opacity: 0;
	transition: opacity .6s ease;
}
.eekad-feat__showcase-img.is-active {
	opacity: 1;
}
/* Dark overlays on top of the image — Figma layers 157:3079 + 157:3078 */
.eekad-feat__showcase::before,
.eekad-feat__showcase::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
}
/* Solid black tint */
.eekad-feat__showcase::before {
	background: #000;
	opacity: .10;
	z-index: 1;
}
/* Gradient: stronger at bottom (text area) → transparent top */
.eekad-feat__showcase::after {
	background: linear-gradient(to top, rgba(0,0,0,.6) 0%, rgba(0,0,0,0) 50%);
	opacity: 1;
	z-index: 1;
}

/* Top prev/next nav — white bordered square buttons */
.eekad-feat__nav {
	position: relative;
	z-index: 3;
	display: flex;
	justify-content: space-between;
	padding-inline-start: 32px;
}
.eekad-feat__nav-btn {
	width: 40px;
	height: 40px;
	background: transparent;
	border: 1px solid #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--c-text);
	padding: 8px;
	transition: background-color .15s ease, color .15s ease;
}
.eekad-feat__nav-btn:hover {
	background: var(--c-text);
	color: var(--c-text-on-accent);
}
.eekad-feat__nav-btn svg { width: 24px; height: 24px; display: block; }

/* Content block: date, title, excerpt */
.eekad-feat__content {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: flex-start; /* RTL: visual right */
	gap: 24px;
	padding-inline-start: 64px;
	padding-inline-end: 64px;
	width: 100%;
	box-sizing: border-box;
	transition: opacity .25s ease;
}
.eekad-feat__date {
	font-family: var(--font-mono);
	font-size: 16px;
	color: var(--c-text);
	text-align: right;
}
.eekad-feat__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start; /* RTL: visual right */
	gap: 16px;
	text-align: right;
	width: 100%;
	min-width: 0;
}
.eekad-feat__headline {
	font-size: 44px;
	font-weight: 500;
	line-height: 1.4;
	margin: 0;
	max-width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.eekad-feat__headline a {
	display: block;
	color: inherit;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: opacity .15s ease;
}
.eekad-feat__headline a:hover { opacity: .82; }
.eekad-feat__desc {
	margin: 0;
	max-width: 800px;
	font-weight: 300;
	font-size: 20px;
	line-height: 1.5;
}

/* Lime expand arrow — Figma: (1107, 385) in 1216×670 showcase */
.eekad-feat__expand {
	position: absolute;
	z-index: 3;
	right: calc(84 / 1216 * 100%);
	top: calc(385 / 670 * 100%);
	width: 25px;
	height: 25px;
	color: var(--c-lime);
	transition: opacity .15s ease;
}
.eekad-feat__expand:hover { opacity: .7; }
.eekad-feat__expand svg { width: 100%; height: 100%; display: block; }

/* --- 3-card strip below the showcase --- */
.eekad-feat__cards {
	display: flex;
	flex-direction: row-reverse; /* RTL: active card appears on visual right */
	width: 100%;
}
.eekad-feat__card {
	flex: 1 1 0;
	display: flex;
	flex-direction: row-reverse; /* RTL: thumb right, text left */
	align-items: center;
	gap: 24px;
	height: calc(134px + 19px); /* content height + top border */
	padding: 16px;
	color: var(--c-text);
	text-decoration: none;
	border-top: 19px solid var(--c-coral);
	box-sizing: border-box;
	transition: background-color .3s ease;
}
.eekad-feat__card.is-active {
	background: var(--c-coral);
	border-top-color: transparent;
	padding-top: calc(16px + 19px); /* absorb the hidden border space */
	box-shadow: 0 3px 3px rgba(0,0,0,.09), 0 1px 2px rgba(0,0,0,.1);
}
.eekad-feat__card:not(.is-active):hover {
	background: rgba(var(--c-border-rgb),.06);
}
.eekad-feat__card-text {
	flex: 1 1 0;
	min-width: 0;
	font-weight: 500;
	font-size: 22px;
	line-height: 1.4;
	text-align: right;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eekad-feat__card-thumb {
	flex: 0 0 102px;
	width: 102px;
	height: 102px;
	overflow: hidden;
}
.eekad-feat__card-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* --- Responsive --- */
@media (max-width: 1100px) {
	.eekad-feat__showcase {
		min-height: 500px;
		border: none;
	}
	.eekad-feat__cards {
		flex-direction: column;
		margin-top: 16px;
	}
	.eekad-feat__card {
		border-top: none;
		border-bottom: 1px solid rgba(var(--c-border-rgb),.08);
	}
	.eekad-feat__card:last-child { border-bottom: none; }
	.eekad-feat__card.is-active {
		background: rgba(var(--c-border-rgb),.06);
		border-top: none;
		padding-top: 16px;
	}
}
@media (max-width: 700px) {
	.eekad-feat__showcase { min-height: 400px; border: none; }
	.eekad-feat__headline { font-size: 28px; white-space: normal; }
	.eekad-feat__desc { font-size: 16px; }
	.eekad-feat__content { padding-inline-end: 16px; }
	.eekad-feat__cards { margin-top: 12px; }
	.eekad-feat__card {
		height: auto;
		min-height: 80px;
		border-top: none;
		border-bottom: 1px solid rgba(var(--c-border-rgb),.08);
	}
	.eekad-feat__card:last-child { border-bottom: none; }
	.eekad-feat__card.is-active {
		padding-top: 16px;
		background: rgba(var(--c-border-rgb),.06);
	}
	.eekad-feat__card-thumb { flex: 0 0 80px; width: 80px; height: 80px; }
}
@media (max-width: 480px) {
	.eekad-feat__wrap { padding: 24px 12px; }
	.eekad-feat__title { font-size: 20px; }
	.eekad-feat__header { margin-bottom: 16px; }

	/* Showcase: taller image with only title overlay at bottom */
	.eekad-feat__showcase {
		min-height: 64vw;
		border: none;
		padding: 0;
		position: relative;
	}

	.eekad-feat__showcase::before { opacity: .12; }
	.eekad-feat__showcase::after {
		display: block;
		background: linear-gradient(to top, rgba(0,0,0,.9) 0%, rgba(0,0,0,.2) 45%, transparent 100%);
	}

	/* Nav over image */
	.eekad-feat__nav {
		position: absolute;
		top: 10px;
		left: 10px;
		right: 10px;
		z-index: 5;
		padding: 0;
	}
	.eekad-feat__nav-btn {
		width: 30px;
		height: 30px;
		background: rgba(0,0,0,.45);
		border-color: rgba(var(--c-border-rgb),.35);
	}

	/* Content: only headline, pinned to bottom */
	.eekad-feat__content {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		padding: 14px;
		gap: 6px;
	}
	.eekad-feat__text { gap: 0; }
	.eekad-feat__date { font-size: 11px; opacity: .6; }
	.eekad-feat__headline {
		font-size: 16px;
		font-weight: 600;
		white-space: normal;
		line-height: 1.4;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	/* Hide description on mobile — too much text over image */
	.eekad-feat__desc { display: none; }
	.eekad-feat__expand { display: none; }

	/* Cards: compact list */
	.eekad-feat__cards {
		margin-top: 8px;
		gap: 0;
	}
	.eekad-feat__card {
		padding: 12px;
		height: auto;
		min-height: auto;
		border-top: none;
		border-bottom: 1px solid rgba(var(--c-border-rgb),.08);
		gap: 12px;
	}
	.eekad-feat__card:last-child { border-bottom: none; }
	.eekad-feat__card.is-active {
		background: rgba(var(--c-border-rgb),.06);
		padding-top: 12px;
		border-top: none;
	}
	.eekad-feat__card-text {
		font-size: 13px;
		font-weight: 400;
		-webkit-line-clamp: 1;
	}
	.eekad-feat__card-thumb { display: none; }
}

/* =============================================================
 * Site footer — surveillance/intel dark theme matching the rest
 * of the site. Top tech strip + 3-column main + bottom bar.
 * =========================================================== */
.eekad-site-footer {
	background: var(--c-bg-alt);
	color: var(--c-text-2);
	border-top: 1px solid rgba(var(--c-border-rgb), .08);
	font-family: var(--font-sans);
}

/* --- Top tech strip --- */
/* --- Main grid ---
   Two-row layout so the social row tucks under the brand column on
   desktop while sitting between nav and newsletter when stacked on
   mobile (HTML order does that for free). */
.eekad-site-footer__main {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1.2fr;
	grid-template-rows: auto auto;
	gap: 32px 64px;
	padding-block: 72px 56px;
	align-items: start;
}
.eekad-site-footer__brand        { grid-column: 1; grid-row: 1; }
.eekad-site-footer__social-row   { grid-column: 1; grid-row: 2; }
.eekad-site-footer__nav          { grid-column: 2; grid-row: 1 / span 2; }
.eekad-site-footer__newsletter   { grid-column: 3; grid-row: 1 / span 2; }

/* --- Brand column --- */
.eekad-site-footer__logo {
	display: inline-block;
	color: var(--c-text);
	margin-block-end: 20px;
	transition: color .15s ease;
}
.eekad-site-footer__logo:hover { color: var(--c-lime); }
.eekad-site-footer__logo svg {
	display: block;
	height: 36px;
	width: auto;
}
.eekad-site-footer__logo-text {
	font-size: 28px;
	font-weight: 700;
	letter-spacing: .02em;
}
.eekad-site-footer__tagline {
	margin: 0 0 24px;
	max-width: 360px;
	color: var(--c-text-3);
	font-size: 15px;
	line-height: 1.7;
}
.eekad-site-footer__social {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 12px;
}
.eekad-site-footer__social a {
	display: inline-flex;
	width: 40px;
	height: 40px;
	align-items: center;
	justify-content: center;
	border: 1px solid rgba(var(--c-border-rgb), .18);
	color: var(--c-text-2);
	transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.eekad-site-footer__social a:hover {
	background: var(--c-lime);
	border-color: var(--c-lime);
	color: var(--c-text-on-accent);
}
.eekad-site-footer__social svg {
	width: 18px;
	height: 18px;
	display: block;
}

/* --- Section headings (lime accent line) --- */
.eekad-site-footer__heading {
	margin: 0 0 20px;
	color: var(--c-text);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .02em;
	position: relative;
	padding-inline-start: 14px;
}
.eekad-site-footer__heading::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: 4px;
	bottom: 4px;
	width: 3px;
	background: var(--c-lime);
}

/* --- Nav menu --- */
.eekad-site-footer__menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 24px;
}
.eekad-site-footer__menu li { margin: 0; }
.eekad-site-footer__menu a {
	color: var(--c-text-2);
	text-decoration: none;
	font-size: 15px;
	line-height: 1.6;
	transition: color .15s ease;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.eekad-site-footer__menu a::before {
	content: "›";
	color: var(--c-lime);
	font-size: 16px;
	line-height: 1;
}
.eekad-site-footer__menu a:hover { color: var(--c-lime); }

/* --- Newsletter --- */
.eekad-site-footer__newsletter-blurb {
	margin: 0 0 16px;
	color: var(--c-text-3);
	font-size: 14px;
	line-height: 1.6;
}
.eekad-site-footer__form {
	display: flex;
	gap: 0;
	max-width: 420px;
	border: 1px solid rgba(var(--c-border-rgb), .2);
	background: rgba(var(--c-border-rgb), .04);
	transition: border-color .15s ease;
}
.eekad-site-footer__form:focus-within {
	border-color: var(--c-lime);
}
.eekad-site-footer__form input {
	flex: 1 1 auto;
	min-width: 0;
	padding: 10px 16px;
	background: transparent;
	border: none;
	color: var(--c-text);
	font-family: inherit;
	font-size: 14px;
}
.eekad-site-footer__form input::placeholder {
	color: var(--c-text-muted);
}
.eekad-site-footer__form input:focus { outline: none; }
.eekad-site-footer__form button {
	padding: 10px 24px;
	background: var(--c-lime);
	color: var(--c-text-on-accent);
	border: none;
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	transition: background .15s ease;
	white-space: nowrap;
}
.eekad-site-footer__form button:hover {
	background: #CDFE64;
}

/* --- Bottom bar --- */
.eekad-site-footer__bottom {
	border-top: 1px solid rgba(var(--c-border-rgb), .08);
	background: var(--c-bg-base);
}
.eekad-site-footer__bottom-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	padding-block: 20px;
	flex-wrap: wrap;
}
.eekad-site-footer__copy {
	margin: 0;
	color: var(--c-text-muted);
	font-size: 13px;
}
.eekad-site-footer__legal {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 24px;
}
.eekad-site-footer__legal a {
	color: var(--c-text-muted);
	text-decoration: none;
	font-size: 13px;
	transition: color .15s ease;
}
.eekad-site-footer__legal a:hover { color: var(--c-lime); }

/* --- Footer mobile --- */
@media (max-width: 768px) {
	.eekad-site-footer__main {
		grid-template-columns: 1fr;
		gap: 40px;
		padding-block: 48px 40px;
		padding-inline: 20px;
	}

	/* Brand: center logo, tagline, and social */
	.eekad-site-footer__brand {
		text-align: center;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.eekad-site-footer__logo {
		margin-block-end: 16px;
	}
	.eekad-site-footer__logo svg {
		height: 40px;
	}
	.eekad-site-footer__tagline {
		max-width: 300px;
		font-size: 14px;
		margin-block-end: 20px;
	}
	.eekad-site-footer__social {
		justify-content: center;
		gap: 10px;
	}
	.eekad-site-footer__social a {
		width: 38px;
		height: 38px;
	}

	/* Nav: single column, tighter */
	.eekad-site-footer__menu {
		grid-template-columns: 1fr;
		gap: 0;
	}
	.eekad-site-footer__menu li {
		border-bottom: 1px solid rgba(var(--c-border-rgb), .06);
	}
	.eekad-site-footer__menu li:last-child {
		border-bottom: none;
	}
	.eekad-site-footer__menu a {
		padding: 14px 0;
		font-size: 15px;
		width: 100%;
	}

	/* Newsletter: stack form vertically */
	.eekad-site-footer__newsletter-blurb {
		font-size: 14px;
	}
	.eekad-site-footer__form {
		max-width: 100%;
	}
	.eekad-site-footer__form input {
		padding: 10px 12px;
		font-size: 13px;
	}
	.eekad-site-footer__form button {
		padding: 10px 16px;
		font-size: 13px;
	}

	.eekad-site-footer__bottom-inner {
		padding-inline: 20px;
	}
	.eekad-site-footer__legal {
		gap: 16px;
	}
}

/* --- Responsive --- */
@media (max-width: 900px) {
	.eekad-site-footer__main {
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		gap: 48px;
		padding-block: 56px 40px;
	}
	/* Reset desktop placement so HTML order drives the mobile stack:
	   brand → nav → social → newsletter. */
	.eekad-site-footer__brand,
	.eekad-site-footer__social-row,
	.eekad-site-footer__nav,
	.eekad-site-footer__newsletter {
		grid-column: auto;
		grid-row: auto;
	}
	.eekad-site-footer__social-row { display: flex; justify-content: center; }
	.eekad-site-footer__tagline { max-width: none; }
}
@media (max-width: 600px) {
	.eekad-site-footer__menu { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
	.eekad-site-footer__main { gap: 32px; padding-block: 40px 32px; }
	.eekad-site-footer__tagline { font-size: 14px; }
	.eekad-site-footer__heading { font-size: 16px; }
	.eekad-site-footer__form input { padding: 8px 10px; font-size: 13px; }
	.eekad-site-footer__form button { padding: 8px 14px; font-size: 13px; }
	.eekad-site-footer__bottom-inner { padding-block: 16px; }
	.eekad-site-footer__legal { gap: 16px; flex-wrap: wrap; }
	.eekad-site-footer__copy { font-size: 12px; }
}

/* =============================================================
 * Investigation single template — 3-column article grid
 *
 * Every direct child of .eekad-investigation__body lands in one of
 * three named columns:
 *   narrow  (~720px max)  default
 *   wide    (~960px max)  alignwide / .is-wide
 *   bleed   (100vw)       alignfull / .is-bleed
 * Block CSS only needs to size the inner content; placement is
 * handled by the grid here so blocks stay decoupled.
 * =========================================================== */
.eekad-investigation {
	background: var(--c-bg-alt);
	color: var(--c-text-2);
	padding-block: 0 120px;
}
.eekad-investigation__body {
	display: grid;
	grid-template-columns:
		[bleed-start]
			minmax(var(--container-px), 1fr)
		[wide-start]
			minmax(0, 120px)
		[narrow-start]
			minmax(0, 720px)
		[narrow-end]
			minmax(0, 120px)
		[wide-end]
			minmax(var(--container-px), 1fr)
		[bleed-end];
	row-gap: 40px;
}
.eekad-investigation__body > * {
	grid-column: narrow;
	min-width: 0;
}
.eekad-investigation__body > .alignwide,
.eekad-investigation__body > .is-wide {
	grid-column: wide;
}
.eekad-investigation__body > .alignfull,
.eekad-investigation__body > .is-bleed {
	grid-column: bleed;
}

/* Evidence blocks that should always sit in the narrow column for
   consistent article rhythm, even on legacy posts that saved them
   with .alignwide / .alignfull. Higher specificity beats the generic
   alignwide / alignfull rules above. The "big moments" (network-map,
   map, gallery, cover, immersive-scroll, sticky-scroll) keep their
   wide / full options. */
.eekad-investigation__body > .alignwide.eekad-iv-ba,
.eekad-investigation__body > .alignfull.eekad-iv-ba,
.eekad-investigation__body > .alignwide.eekad-iv-claim-verdict,
.eekad-investigation__body > .alignfull.eekad-iv-claim-verdict,
.eekad-investigation__body > .alignwide.eekad-iv-pullquote,
.eekad-investigation__body > .alignfull.eekad-iv-pullquote,
.eekad-investigation__body > .alignwide.eekad-iv-sources,
.eekad-investigation__body > .alignfull.eekad-iv-sources,
.eekad-investigation__body > .alignwide.eekad-iv-stats,
.eekad-investigation__body > .alignfull.eekad-iv-stats,
.eekad-investigation__body > .alignwide.eekad-iv-timeline,
.eekad-investigation__body > .alignfull.eekad-iv-timeline,
.eekad-investigation__body > .is-wide.eekad-iv-ba,
.eekad-investigation__body > .is-bleed.eekad-iv-ba {
	grid-column: narrow;
}

@media (max-width: 768px) {
	.eekad-investigation__body {
		grid-template-columns:
			[bleed-start]
				var(--container-px)
			[wide-start narrow-start]
				1fr
			[narrow-end wide-end]
				var(--container-px)
			[bleed-end];
	}
}

/* Default block typography — applies to core paragraph/heading/list. */
.eekad-investigation__body p,
.eekad-investigation__body li {
	font-family: var(--font-sans);
	font-size: var(--fs-article);
	font-weight: 400;
	line-height: 1.85;
	color: var(--c-text-2);
	margin: 0;
}
.eekad-investigation__body p + p {
	margin-top: 1.4em;
}
.eekad-investigation__body h2,
.eekad-investigation__body h3 {
	font-family: var(--font-sans);
	color: var(--c-text);
	margin: 0;
}
.eekad-investigation__body h2 { font-size: 32px; line-height: 1.25; font-weight: 700; }
.eekad-investigation__body h3 { font-size: 24px; line-height: 1.3; font-weight: 700; }
.eekad-investigation__body a {
	color: var(--c-lime);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
}
.eekad-investigation__body a:hover { color: var(--c-text); }
.eekad-investigation__body ul,
.eekad-investigation__body ol {
	margin: 0;
	padding-inline-start: 24px;
}
.eekad-investigation__body ul li + li,
.eekad-investigation__body ol li + li {
	margin-top: .6em;
}

/* --- Cover block — full-bleed dossier hero --- */
.eekad-iv-cover {
	position: relative;
	min-height: 720px;
	display: flex;
	align-items: flex-end;
	color: var(--c-text);
	overflow: hidden;
	isolation: isolate;
	margin-block: 0 -40px;
	padding-block-end: 56px;
}
.eekad-iv-cover__bg {
	position: absolute;
	inset: 0;
	background-image: var(--iv-cover-bg);
	background-size: cover;
	background-position: center;
	z-index: -2;
}
.eekad-iv-cover__veil {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg,
			rgba(var(--c-bg-alt-rgb), .55) 0%,
			rgba(var(--c-bg-alt-rgb), .08) 25%,
			rgba(var(--c-bg-alt-rgb), .50) 60%,
			rgba(var(--c-bg-alt-rgb), .92) 80%,
			var(--c-bg-alt) 95%);
	z-index: -1;
}
.eekad-iv-cover__inner {
	position: relative;
	width: 100%;
	max-width: var(--container);
	padding-block: 120px 36px;
	padding-inline: var(--container-px);
	margin-inline: auto;
}
.eekad-iv-cover__badge {
	position: relative;
	display: inline-block;
	width: 98px;
	aspect-ratio: 465 / 159;
	margin-block-end: 28px;
}
.eekad-iv-cover__badge-shape {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
}
.eekad-iv-cover__badge-label {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--c-text-on-accent);
	font-family: var(--font-sans);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: .04em;
}
.eekad-iv-cover__geo {
	display: flex;
	gap: 16px;
	margin-block-end: 20px;
	font-family: var(--font-mono);
	font-size: 13px;
	letter-spacing: .04em;
	color: var(--c-lime);
}
.eekad-iv-cover__title {
	margin: 0 0 16px;
	font-family: var(--font-sans);
	font-weight: 700;
	font-size: clamp(36px, 5vw, 64px);
	line-height: 1.1;
	color: var(--c-text);
	max-width: 42ch;
}
.eekad-iv-cover__kicker {
	margin: 0 0 32px;
	max-width: 60ch;
	font-family: var(--font-sans);
	font-weight: 300;
	font-size: clamp(18px, 1.6vw, 22px);
	line-height: 1.55;
	color: var(--c-text-2);
}
.eekad-iv-cover__date {
	display: inline-block;
	font-family: var(--font-mono);
	font-size: 13px;
	letter-spacing: .08em;
	color: var(--c-text-3);
	padding-top: 16px;
	border-top: 1px solid rgba(var(--c-border-rgb), .15);
}

/* --- Lead block --- */
.eekad-iv-lead {
	font-family: var(--font-sans);
	font-size: clamp(21px, 2vw, 28px);
	font-weight: 300;
	line-height: 1.7;
	color: var(--c-text);
	margin: 32px 0;
	padding-inline-start: 28px;
	padding-block-start: 20px;
	position: relative;
}
.eekad-iv-cover + .eekad-iv-lead {
	margin-block-start: 12px;
}
.eekad-iv-lead::before {
	content: '';
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: 0;
	inset-block-end: 0;
	width: 3px;
	background: var(--c-lime);
}
/* Lime "marker" highlight for bolded/marked phrases inside the lead. */
.eekad-iv-lead strong,
.eekad-iv-lead mark {
	font-weight: 600;
	color: var(--c-text-on-accent);
	background-color: var(--c-lime);
	box-shadow: 0.18em 0 0 var(--c-lime), -0.18em 0 0 var(--c-lime);
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* --- Section heading block --- */
/* Spacing rhythm note:
 * Block-to-block gaps come from `.eekad-investigation__body { row-gap }`.
 * Per-block top/bottom margins compounded with row-gap and made the
 * vertical rhythm unpredictable, so they're all 0. Headings get extra
 * breathing room ABOVE via padding, so the heading clings to its
 * following content (tight bottom) and chapter breaks stay visible. */
.eekad-iv-section-heading {
	margin: 0;
	padding-block-start: 32px;
	font-family: var(--font-sans);
	font-weight: 700;
	font-size: 32px;
	line-height: 1.25;
	color: var(--c-text);
	scroll-margin-top: 96px;
}

/* --- Floating table of contents --- */
.eekad-toc {
	position: fixed;
	top: 50%;
	inset-inline-start: 0;
	transform: translateY(-50%);
	z-index: 900;
	width: 220px;
	max-height: 70vh;
	background: rgba(var(--c-bg-base-rgb), .25);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	padding: 20px 18px;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(var(--c-border-rgb),.08) transparent;
	transition: opacity .35s ease, transform .35s ease;
}
.eekad-toc.is-hidden {
	opacity: 0;
	pointer-events: none;
	transform: translateY(-50%) translateX(20px);
}
.eekad-toc__head {
	margin-block-end: 14px;
}
.eekad-toc__label {
	font-family: var(--font-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	color: var(--c-lime);
}
.eekad-toc__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.eekad-toc__list[hidden] { display: none; }
.eekad-toc__item {
	margin: 0;
}
.eekad-toc__link {
	display: block;
	padding: 6px 12px;
	font-family: var(--font-sans);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--c-text-muted);
	text-decoration: none;
	border-inline-start: 2px solid transparent;
	transition: color .2s, border-color .2s, background .2s;
}
.eekad-toc__link:hover {
	color: var(--c-text);
	background: rgba(var(--c-border-rgb),.04);
}
.eekad-toc__link.is-active {
	color: var(--c-lime);
	border-inline-start-color: var(--c-lime);
	background: rgba(205, 254, 100, .06);
}
@media (max-width: 1400px) {
	.eekad-toc { display: none; }
}

/* --- Pull quote block — editorial, no card chrome --- */
.eekad-iv-pullquote {
	margin: 0;
	padding: 0;
	background: transparent;
	color: var(--c-text);
}
/* Big lime quote mark stacked above the text. It sits flush with the
   leading edge of the text column so the prose itself stays aligned
   with the surrounding body paragraphs. The negative margin-block-end
   pulls the text up into the empty descender space below the glyph
   so they sit close, not separated by a half-empty line-box. */
.eekad-iv-pullquote::before {
	content: "\201D"; /* Arabic uses the closing glyph as the opening mark */
	display: block;
	font-family: var(--font-sans);
	font-size: clamp(80px, 8vw, 110px);
	font-weight: 700;
	line-height: 1;
	color: var(--c-lime);
	margin-block-end: -0.42em;
	pointer-events: none;
	user-select: none;
}
.eekad-iv-pullquote__text {
	margin: 0;
	font-family: var(--font-sans);
	font-weight: 500;
	/* Body prose is 19px — the quote needs to sit clearly above that. */
	font-size: clamp(26px, 2.6vw, 36px);
	line-height: 1.5;
	color: var(--c-text);
}
.eekad-iv-pullquote__cite {
	display: block;
	margin-top: 28px;
	font-family: var(--font-sans);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .08em;
	color: var(--c-lime);
}
.eekad-iv-pullquote__cite::before {
	content: "— ";
}

/* --- Claim Verdict block — quiet dossier card --- */
.eekad-iv-claim-verdict {
	position: relative;
	margin: 0;
	background: rgba(var(--c-border-rgb), 0.025);
	border: 1px solid rgba(var(--c-border-rgb), 0.06);
	padding: 28px 32px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.25);
	overflow: hidden;
}

/* Header — bold tracked sans + a small dot mark, separated from the
   body by a hairline. Sets up the card as a fact-check (genre)
   without competing with the verdict for attention. */
.eekad-iv-claim-verdict__header {
	margin-block-end: 28px;
	padding-block-end: 16px;
	border-block-end: 1px solid rgba(var(--c-border-rgb), 0.08);
}
.eekad-iv-claim-verdict__title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--font-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .14em;
	color: var(--c-text-2);
}
.eekad-iv-claim-verdict__title::before {
	content: '';
	display: inline-block;
	width: 6px;
	height: 6px;
	background: var(--c-text-muted);
	border-radius: 50%;
	flex-shrink: 0;
}

/* Verdict colours — single moment per card, on the verdict word. */
.eekad-iv-claim-verdict.is-false      .eekad-iv-claim-verdict__verdict p { color: #ed5d5d; }
.eekad-iv-claim-verdict.is-misleading .eekad-iv-claim-verdict__verdict p { color: #fbbf24; }
.eekad-iv-claim-verdict.is-true       .eekad-iv-claim-verdict__verdict p { color: var(--c-lime); }
.eekad-iv-claim-verdict.is-unverified .eekad-iv-claim-verdict__verdict p { color: var(--c-text-muted); }

/* Sections — no inline borders, just generous spacing */
.eekad-iv-claim-verdict__claim,
.eekad-iv-claim-verdict__evidence,
.eekad-iv-claim-verdict__verdict {
	padding: 0;
	margin-block-end: 24px;
}
.eekad-iv-claim-verdict__claim:last-child,
.eekad-iv-claim-verdict__evidence:last-child,
.eekad-iv-claim-verdict__verdict:last-child {
	margin-block-end: 0;
}

/* Quiet section labels — single neutral colour for all three */
.eekad-iv-claim-verdict__label {
	display: block;
	font-family: var(--font-sans);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .04em;
	color: var(--c-text-muted);
	margin-bottom: 6px;
}

.eekad-iv-claim-verdict__claim p,
.eekad-iv-claim-verdict__evidence p,
.eekad-iv-claim-verdict__verdict p {
	margin: 0;
	font-family: var(--font-sans);
	font-size: 17px;
	line-height: 1.65;
	color: var(--c-text);
}
/* Claim is the question — a touch more weight to read as the lede */
.eekad-iv-claim-verdict__claim p {
	font-size: 18px;
	font-weight: 500;
}
/* Verdict section — the visual climax. No horizontal rules (they
   read as a text-input's top/bottom border); rely on big size, the
   rating colour, and a soft halo glow so the word lands like a
   stamped conclusion. */
.eekad-iv-claim-verdict__verdict {
	margin-block-start: 32px;
	padding-block: 4px;
}

.eekad-iv-claim-verdict__verdict .eekad-iv-claim-verdict__label {
	margin-bottom: 10px;
}

.eekad-iv-claim-verdict__verdict p {
	font-size: clamp(44px, 5vw, 64px);
	font-weight: 800;
	letter-spacing: .02em;
	line-height: 1.05;
}

.eekad-iv-claim-verdict__source {
	margin-top: 20px;
	font-family: var(--font-sans);
	font-size: 13px;
	font-weight: 500;
	color: var(--c-text-muted);
	text-align: start;
}
.eekad-iv-claim-verdict__source::before {
	content: 'المصدر: ';
	color: var(--c-text-faint);
	font-weight: 600;
	letter-spacing: .04em;
	margin-inline-end: 4px;
}

@media (max-width: 600px) {
	.eekad-iv-claim-verdict { padding: 20px; margin: 36px 0; }
	.eekad-iv-claim-verdict__claim p { font-size: 16px; }
	.eekad-iv-claim-verdict__verdict p { font-size: 22px; }
}

.eekad-iv-claim-verdict__source {
	padding: 12px 24px;
	font-family: var(--font-mono, monospace);
	font-size: 12px;
	color: var(--c-text-faint);
	background: rgba(0,0,0,.15);
}
.eekad-iv-claim-verdict__source a {
	color: #60a5fa;
	text-decoration: none;
}
.eekad-iv-claim-verdict__source a:hover {
	text-decoration: underline;
}

/* Mobile */
@media (max-width: 600px) {
	.eekad-iv-claim-verdict__claim,
	.eekad-iv-claim-verdict__evidence,
	.eekad-iv-claim-verdict__verdict {
		padding: 16px 16px;
	}
	.eekad-iv-claim-verdict__header {
		padding: 12px 16px;
	}
	.eekad-iv-claim-verdict__claim p {
		font-size: 16px;
	}
}

/* --- Figure block — evidence exhibit treatment --- */
.eekad-iv-figure {
	margin: 0;
	background: rgba(var(--c-border-rgb), 0.025);
	border: 1px solid rgba(var(--c-border-rgb), 0.06);
	padding: 12px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.25);
	overflow: hidden;
}

/* Image area — Facebook-style crop. Tall images render at natural
   aspect at 100% width but the container clips at max-height, so the
   user sees the top portion (the "preview") in the article and the
   full image in the lightbox. Short images fall well under the cap and
   render whole. */
.eekad-iv-figure__media {
	display: block;
	overflow: hidden;
	max-height: var(--eekad-figure-cap, 560px);
	background: var(--c-bg-base);
}
.eekad-iv-figure__media img {
	width: 100%;
	height: auto;
	display: block;
	cursor: zoom-in;
}

/* Caption — sits inside the matted container */
.eekad-iv-figure__caption {
	padding: 14px 4px 4px;
	font-family: var(--font-sans);
	font-size: 14px;
	line-height: 1.55;
	color: var(--c-text-muted);
	display: block;
}
.eekad-iv-figure__num {
	color: var(--c-text-3);
	font-weight: 600;
	margin-inline-end: 6px;
}
.eekad-iv-figure__num::after {
	content: " · ";
	color: var(--c-text-faint);
	margin-inline-start: 4px;
}
.eekad-iv-figure__caption-text {
	color: var(--c-text-2);
}
.eekad-iv-figure__credit {
	display: block;
	margin-top: 4px;
	font-family: var(--font-sans);
	font-size: 12px;
	color: var(--c-text-faint);
}

/* Mobile */
@media (max-width: 600px) {
	.eekad-iv-figure { padding: 8px; }
	.eekad-iv-figure__caption { font-size: 13px; padding: 12px 2px 2px; }
}

/* --- Social block — live embed with OSINT-safe fallback --- */
.eekad-iv-social {
	margin: 0;
	color: var(--c-text);
}
.eekad-iv-social__shell {
	position: relative;
	overflow: hidden;
	width: min(100%, 640px);
	margin-inline: auto;
	background: rgba(var(--c-border-rgb), .025);
	border: 1px solid rgba(var(--c-border-rgb), .07);
	box-shadow: none;
}
.eekad-iv-social__shell::before {
	content: '';
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	width: 2px;
	background: var(--c-lime);
	opacity: .75;
}
.eekad-iv-social__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 16px 20px;
	border-block-end: 1px solid rgba(var(--c-border-rgb), .06);
	font-family: var(--font-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	color: var(--c-text-2);
}
.eekad-iv-social__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--c-lime);
	flex: 0 0 auto;
}
.eekad-iv-social__platform {
	color: var(--c-text);
}
.eekad-iv-social__host,
.eekad-iv-social__archive {
	color: var(--c-text-muted);
	font-weight: 500;
	letter-spacing: .04em;
	margin-inline-start: auto;
}
.eekad-iv-social__archive {
	margin-inline-start: 0;
	color: var(--c-lime);
}
.eekad-iv-social__embed {
	padding: 12px;
	display: flex;
	justify-content: center;
	background: var(--c-bg-alt);
}
.eekad-iv-social__embed > * {
	width: 100% !important;
	max-width: 100% !important;
	margin-inline: auto !important;
}
.eekad-iv-social__embed iframe {
	width: 100% !important;
	max-width: 100%;
}
.eekad-iv-social__fallback-media {
	display: block;
	background: var(--c-bg-base);
}
.eekad-iv-social__fallback-media img,
.eekad-iv-social__screenshot {
	display: block;
	width: 100%;
	height: auto;
	max-height: 560px;
	object-fit: contain;
	background: var(--c-bg-base);
}
.eekad-iv-social__fallback-card {
	display: grid;
	gap: 8px;
	padding: 28px 32px;
	min-height: 150px;
	align-content: center;
	text-decoration: none;
	background: rgba(0, 0, 0, .14);
}
.eekad-iv-social__fallback-card:hover .eekad-iv-social__fallback-url {
	color: var(--c-lime);
}
.eekad-iv-social__fallback-label {
	font-family: var(--font-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .08em;
	color: var(--c-lime);
}
.eekad-iv-social__fallback-url {
	font-family: var(--font-sans);
	font-size: clamp(18px, 2vw, 26px);
	font-weight: 600;
	line-height: 1.35;
	color: var(--c-text);
	overflow-wrap: anywhere;
	transition: color .18s ease;
}
.eekad-iv-social__caption {
	margin: 0;
	padding: 18px 20px 0;
	font-size: 16px;
	line-height: 1.7;
	color: var(--c-text-2);
}
.eekad-iv-social__links {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px 20px 18px;
	font-family: var(--font-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
}
.eekad-iv-social__links a {
	color: var(--c-text-muted);
	text-decoration: none;
	border-block-end: 1px solid rgba(var(--c-border-rgb), .18);
	transition: color .18s ease, border-color .18s ease;
}
.eekad-iv-social__links a:hover {
	color: var(--c-lime);
	border-block-end-color: var(--c-lime);
}
.editor-styles-wrapper .eekad-iv-social__placeholder {
	display: grid;
	gap: 12px;
	padding: 32px;
	min-height: 180px;
	align-content: center;
	background: rgba(0, 0, 0, .18);
	color: var(--c-text-muted);
}
@media (max-width: 600px) {
	.eekad-iv-social__meta,
	.eekad-iv-social__caption,
	.eekad-iv-social__links {
		padding-inline: 16px;
	}
	.eekad-iv-social__host { display: none; }
	.eekad-iv-social__embed { padding: 12px; }
}

/* ── Figure carousel ── */
.eekad-iv-carousel .eekad-iv-figure__exhibit {
	justify-content: space-between;
}
.eekad-iv-carousel__counter {
	font-family: var(--font-mono, var(--font-sans));
	font-size: 11px;
	font-weight: 600;
	color: var(--c-text-muted);
	letter-spacing: .04em;
}
.eekad-iv-carousel__track-wrapper {
	position: relative;
	overflow: hidden;
}
.eekad-iv-carousel__track {
	display: flex;
	transition: transform .35s ease;
}
.eekad-iv-carousel__slide {
	flex: 0 0 100%;
	min-width: 0;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	/* Fixed slot keeps the carousel from snapping to the tallest image.
	   Mixed portrait/landscape evidence all renders inside the same box. */
	aspect-ratio: 4 / 3;
	max-height: 75vh;
	overflow: hidden;
}
.eekad-iv-carousel__slide img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
	display: block;
	cursor: zoom-in;
}
.eekad-iv-carousel__dock {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	justify-content: center;
	gap: 4px;
	padding: 8px 16px;
	background: linear-gradient(transparent, rgba(0,0,0,.7));
	opacity: 0;
	transition: opacity .6s ease;
}
.eekad-iv-carousel__dock.is-visible {
	opacity: 1;
}
.eekad-iv-carousel__thumb {
	flex: 0 0 56px;
	height: 40px;
	padding: 0;
	border: 2px solid transparent;
	background: none;
	cursor: pointer;
	overflow: hidden;
	opacity: .5;
	transition: opacity .2s ease, border-color .2s ease;
}
.eekad-iv-carousel__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.eekad-iv-carousel__thumb.is-active {
	border-color: var(--c-lime);
	opacity: 1;
}
@keyframes dock-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(205,254,100,0); }
	50% { box-shadow: 0 0 8px 2px rgba(205,254,100,.5); }
}
.eekad-iv-carousel__dock.is-visible .eekad-iv-carousel__thumb.is-active {
	animation: dock-pulse .8s ease 1;
}
.eekad-iv-carousel__thumb:hover {
	opacity: .85;
}
.eekad-iv-carousel__caption-slide {
	display: none;
}
.eekad-iv-carousel__caption-slide.is-active {
	display: inline;
}

@media (max-width: 600px) {
	.eekad-iv-carousel__thumb { flex: 0 0 44px; height: 32px; }
	.eekad-iv-carousel__dock { padding: 6px 10px; gap: 3px; }
}

/* =============================================================
 * Investigation — Phase 2 blocks
 * =========================================================== */

/* ----- Findings / stats grid ------------------------------- */
.eekad-iv-stats {
	display: grid;
	gap: 24px;
	margin: 0;
	counter-reset: eekad-stat;
}
.eekad-iv-stats.has-cols-2 { grid-template-columns: repeat(2, 1fr); }
.eekad-iv-stats.has-cols-3 { grid-template-columns: repeat(3, 1fr); }
.eekad-iv-stats.has-cols-4 { grid-template-columns: repeat(4, 1fr); }

.eekad-iv-stat-card {
	position: relative;
	padding: 28px 24px 24px;
	background: rgba(var(--c-border-rgb), 0.03);
	border: 1px solid rgba(var(--c-border-rgb), 0.08);
	display: flex;
	flex-direction: column;
	gap: 12px;
	counter-increment: eekad-stat;
}
.eekad-iv-stat-card__num {
	font-family: var(--font-sans);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .12em;
	color: var(--c-text-faint);
}
/* Auto-numbered cards: ignore stored value and use the CSS counter. */
.eekad-iv-stat-card__num.is-auto::before {
	content: counter(eekad-stat, decimal-leading-zero);
}
.eekad-iv-stat-card__label {
	font-family: var(--font-sans);
	font-size: 28px;
	font-weight: 700;
	color: var(--c-text);
	line-height: 1.2;
}
.eekad-iv-stat-card__body {
	font-size: 15px;
	color: var(--c-text-3);
	margin: 0;
}

/* Headline mode — manual `number` becomes the dominant figure;
   label collapses to a small unit eyebrow underneath. */
.eekad-iv-stat-card.is-headline {
	gap: 6px;
}
.eekad-iv-stat-card.is-headline .eekad-iv-stat-card__num {
	font-size: clamp(48px, 6vw, 76px);
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1;
	color: var(--c-text);
}
.eekad-iv-stat-card.is-headline .eekad-iv-stat-card__label {
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .08em;
	color: var(--c-text-faint);
	margin-bottom: 10px;
}
.eekad-iv-stat-card.is-headline .eekad-iv-stat-card__body {
	font-size: 15px;
	color: var(--c-text-2);
	line-height: 1.55;
}

/* ----- Timeline -------------------------------------------- */
/* Note: selectors below use `ol.eekad-iv-timeline` to outrank
   `.eekad-investigation__body ol` (which sets padding-inline-start: 24px
   for prose lists). Without this, the line and the markers end up offset
   from each other by the body OL padding. */
ol.eekad-iv-timeline {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
	--timeline-fill: 0px;
}
.eekad-investigation__body ol.eekad-iv-timeline li + li {
	margin-top: 0;
}
/* Base track — runs only between the FIRST and LAST marker centers.
   Endpoints are measured by JS and exposed as CSS variables. */
.eekad-iv-timeline::before {
	content: '';
	position: absolute;
	top: var(--timeline-track-start, 0);
	height: calc(var(--timeline-track-end, 0px) - var(--timeline-track-start, 0px));
	inset-inline-start: 11px;
	width: 2px;
	background: rgba(var(--c-border-rgb), 0.18);
	z-index: 0;
}
/* Progress fill — lime line that grows from the first marker down to the
   current marker as the reader scrolls. */
.eekad-iv-timeline::after {
	content: '';
	position: absolute;
	top: var(--timeline-track-start, 0);
	height: max(0px, calc(var(--timeline-fill, 0px) - var(--timeline-track-start, 0px)));
	inset-inline-start: 11px;
	width: 2px;
	background: var(--c-lime);
	transition: height 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
	z-index: 1;
	box-shadow: 0 0 12px rgba(190, 242, 100, 0.4);
}
.eekad-iv-timeline__event {
	position: relative;
	padding-inline-start: 56px;
	padding-block: 16px;
}
/* Content (date/title/body) wrapper — hidden until this event becomes
   the current one. Reaching the dot reveals the entry. */
.eekad-iv-timeline__content {
	opacity: 0;
	transform: translateY(20px);
	transition:
		opacity 0.6s ease,
		transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.eekad-iv-timeline__event.is-current .eekad-iv-timeline__content,
.eekad-iv-timeline__event.is-passed  .eekad-iv-timeline__content {
	opacity: 1;
	transform: translateY(0);
}
/* Marker — solid-fill ring. Background matches the page so the line
   passing behind it is *hidden* by the marker disc; only the segment of
   line above and below the disc remains visible, which makes the dots
   look like beads strung along the line. */
.eekad-iv-timeline__marker {
	position: absolute;
	box-sizing: border-box;
	inset-inline-start: 0;
	inset-block-start: 22px;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--c-bg-base);
	border: 3px solid rgba(var(--c-border-rgb), 0.28);
	z-index: 2;
	transition:
		background 0.5s ease,
		border-color 0.5s ease,
		box-shadow 0.5s ease;
}
/* Inner dot — appears when the event is current/passed. Starts collapsed,
   scales up when its parent gets `is-current` or `is-passed`. */
.eekad-iv-timeline__marker::after {
	content: '';
	position: absolute;
	inset: 4px;
	border-radius: 50%;
	background: var(--c-lime);
	transform: scale(0);
	transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Passed (the reader is below this marker) — keep filled and lit, no pulse. */
.eekad-iv-timeline__event.is-passed .eekad-iv-timeline__marker {
	border-color: var(--c-lime);
	background: var(--c-bg-base);
	box-shadow: 0 0 14px rgba(190, 242, 100, 0.35);
}
.eekad-iv-timeline__event.is-passed .eekad-iv-timeline__marker::after {
	transform: scale(1);
}

/* Current (the marker the reader has just reached) — filled + pulsing. */
.eekad-iv-timeline__event.is-current .eekad-iv-timeline__marker {
	border-color: var(--c-lime);
	background: var(--c-bg-base);
	animation: eekad-timeline-pulse 1.8s ease-out infinite;
}
.eekad-iv-timeline__event.is-current .eekad-iv-timeline__marker::after {
	transform: scale(1);
}

@keyframes eekad-timeline-pulse {
	0% {
		box-shadow:
			0 0 0 0 rgba(190, 242, 100, 0.55),
			0 0 14px rgba(190, 242, 100, 0.4);
	}
	70% {
		box-shadow:
			0 0 0 14px rgba(190, 242, 100, 0),
			0 0 18px rgba(190, 242, 100, 0.5);
	}
	100% {
		box-shadow:
			0 0 0 0 rgba(190, 242, 100, 0),
			0 0 14px rgba(190, 242, 100, 0.4);
	}
}
.eekad-iv-timeline__date {
	display: inline-block;
	font-family: var(--font-mono);
	font-size: 12px;
	letter-spacing: .12em;
	color: var(--c-lime);
	text-transform: uppercase;
	margin-block-end: 6px;
}
.eekad-iv-timeline__title {
	font-size: 22px;
	font-weight: 700;
	color: var(--c-text);
	margin: 0 0 6px;
}
.eekad-iv-timeline__body {
	font-size: 16px;
	color: var(--c-text-3);
	margin: 0;
	line-height: 1.65;
}
/* Reduced motion — show everything immediately, no transitions */
@media (prefers-reduced-motion: reduce) {
	.eekad-iv-timeline__content {
		opacity: 1;
		transform: none;
		transition: none;
	}
	.eekad-iv-timeline::after {
		transition: none;
	}
	.eekad-iv-timeline__marker,
	.eekad-iv-timeline__marker::after {
		transition: none;
		animation: none;
	}
	.eekad-iv-timeline__event.is-current .eekad-iv-timeline__marker {
		animation: none;
	}
}

/* ----- Evidence gallery ------------------------------------ */
/* Wrapped in the same exhibit chrome as .eekad-iv-figure so the whole
   grid reads as one collective piece of evidence rather than loose tiles. */
.eekad-iv-gallery {
	margin: 0;
	background: rgba(var(--c-border-rgb), 0.025);
	border: 1px solid rgba(var(--c-border-rgb), 0.06);
	padding: 24px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.25);
}
.eekad-iv-gallery__label {
	display: block;
	font-family: var(--font-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .02em;
	color: var(--c-text);
	margin-block-end: 18px;
}
.eekad-iv-gallery__grid {
	display: grid;
	gap: 16px;
}
.eekad-iv-gallery.has-cols-2 .eekad-iv-gallery__grid { grid-template-columns: repeat(2, 1fr); }
.eekad-iv-gallery.has-cols-3 .eekad-iv-gallery__grid { grid-template-columns: repeat(3, 1fr); }
.eekad-iv-gallery.has-cols-4 .eekad-iv-gallery__grid { grid-template-columns: repeat(4, 1fr); }
.eekad-iv-gallery__cell {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.eekad-iv-gallery__media {
	position: relative;
	background: var(--c-bg-surface);
	overflow: hidden;
}
.eekad-iv-gallery__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 4 / 3;
}
/* Index pill — solid #16191C fill matching how the drawer pill
   reads on its dark panel. Alpha-on-photo would vanish, so we
   bake the effective color in directly. */
.eekad-iv-gallery__seq {
	position: absolute;
	inset-block-start: 8px;
	inset-inline-start: 8px;
	min-width: 24px;
	height: 24px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 6px;
	background: var(--c-bg-alt);
	border: 1px solid var(--c-bg-surface);
	color: var(--c-text-muted);
	font-family: var(--font-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .04em;
}
.eekad-iv-gallery__caption {
	font-family: var(--font-sans);
	font-size: 13px;
	line-height: 1.5;
	color: var(--c-text-2);
}

/* ----- Sources list — quiet reference card --------------- */
.eekad-iv-sources {
	margin: 0;
	padding: 28px 32px;
	background: rgba(var(--c-border-rgb), 0.025);
	border: 1px solid rgba(var(--c-border-rgb), 0.06);
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.25);
}
.eekad-iv-sources__label {
	font-family: var(--font-sans);
	font-size: 22px;
	font-weight: 700;
	color: var(--c-text);
	margin: 0 0 20px;
}
.eekad-iv-sources__list {
	margin: 0;
	padding-inline-start: 24px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.eekad-iv-source {
	font-size: 15px;
	color: var(--c-text-2);
	line-height: 1.6;
}
/* Type chip — neutral pill, same idiom as the evidence drawer */
.eekad-iv-source__type {
	display: inline-block;
	background: rgba(var(--c-border-rgb), 0.06);
	color: var(--c-text-muted);
	border: 1px solid rgba(var(--c-border-rgb), 0.08);
	font-family: var(--font-sans);
	font-size: 10px;
	font-weight: 600;
	padding: 2px 8px;
	letter-spacing: .04em;
	margin-inline-end: 8px;
	vertical-align: middle;
}
/* Single underline — keep the body <a> rule's text-decoration as
   the only underline and just retint its colour. Higher specificity
   so we win the colour from the body link rule (which would
   otherwise paint the title lime by default). */
.eekad-iv-sources a.eekad-iv-source__title {
	color: var(--c-text);
	text-decoration-color: rgba(var(--c-border-rgb), 0.3);
	transition: text-decoration-color 0.15s ease;
}
.eekad-iv-sources a.eekad-iv-source__title:hover {
	color: var(--c-text);
	text-decoration-color: var(--c-lime);
}
.eekad-iv-source__note {
	display: block;
	margin-block-start: 4px;
	color: var(--c-text-muted);
	font-size: 13px;
}

/* ----- Sticky scroll steps --------------------------------- */
.eekad-iv-sticky {
	position: relative;
	background: var(--c-bg-base);
	padding-block: 80px;
}
.eekad-iv-sticky__inner {
	max-width: 1320px;
	margin: 0 auto;
	padding-inline: var(--container-px);
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 72px;
	align-items: start;
}
.eekad-iv-sticky.is-side-end .eekad-iv-sticky__inner { direction: ltr; }
.eekad-iv-sticky.is-side-end .eekad-iv-sticky__media,
.eekad-iv-sticky.is-side-end .eekad-iv-sticky__steps { direction: rtl; }

.eekad-iv-sticky__media {
	position: sticky;
	top: 80px;
	height: calc(100vh - 160px);
	min-height: 480px;
	background: var(--c-bg-base);
	overflow: hidden;
	border: 1px solid rgba(190, 242, 100, 0.18);
	box-shadow:
		inset 0 0 0 1px rgba(var(--c-border-rgb), 0.04),
		0 30px 80px -30px rgba(0, 0, 0, 0.8);
}
/* Vignette + film-grain overlay sits above the slots */
.eekad-iv-sticky__media::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background:
		radial-gradient(ellipse at center,
			transparent 55%,
			rgba(0, 0, 0, 0.55) 100%),
		linear-gradient(180deg,
			rgba(20, 23, 28, 0.35) 0%,
			transparent 22%,
			transparent 70%,
			rgba(20, 23, 28, 0.55) 100%);
}
/* Corner brackets — frame the media like a viewfinder */
.eekad-iv-sticky__media::after {
	content: '';
	position: absolute;
	inset: 12px;
	z-index: 3;
	pointer-events: none;
	background:
		linear-gradient(to right,  var(--c-lime) 0 32px, transparent 32px) top    left  / 32px 3px no-repeat,
		linear-gradient(to bottom, var(--c-lime) 0 32px, transparent 32px) top    left  / 3px 32px no-repeat,
		linear-gradient(to left,   var(--c-lime) 0 32px, transparent 32px) top    right / 32px 3px no-repeat,
		linear-gradient(to bottom, var(--c-lime) 0 32px, transparent 32px) top    right / 3px 32px no-repeat,
		linear-gradient(to right,  var(--c-lime) 0 32px, transparent 32px) bottom left  / 32px 3px no-repeat,
		linear-gradient(to top,    var(--c-lime) 0 32px, transparent 32px) bottom left  / 3px 32px no-repeat,
		linear-gradient(to left,   var(--c-lime) 0 32px, transparent 32px) bottom right / 32px 3px no-repeat,
		linear-gradient(to top,    var(--c-lime) 0 32px, transparent 32px) bottom right / 3px 32px no-repeat;
	opacity: .9;
}
.eekad-iv-sticky__slot {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 0.5s ease;
}
.eekad-iv-sticky__slot img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: saturate(1.05) contrast(1.05);
}
.eekad-iv-sticky[data-active-step="0"]  .eekad-iv-sticky__slot[data-step="0"],
.eekad-iv-sticky[data-active-step="1"]  .eekad-iv-sticky__slot[data-step="1"],
.eekad-iv-sticky[data-active-step="2"]  .eekad-iv-sticky__slot[data-step="2"],
.eekad-iv-sticky[data-active-step="3"]  .eekad-iv-sticky__slot[data-step="3"],
.eekad-iv-sticky[data-active-step="4"]  .eekad-iv-sticky__slot[data-step="4"],
.eekad-iv-sticky[data-active-step="5"]  .eekad-iv-sticky__slot[data-step="5"],
.eekad-iv-sticky[data-active-step="6"]  .eekad-iv-sticky__slot[data-step="6"],
.eekad-iv-sticky[data-active-step="7"]  .eekad-iv-sticky__slot[data-step="7"],
.eekad-iv-sticky[data-active-step="8"]  .eekad-iv-sticky__slot[data-step="8"],
.eekad-iv-sticky[data-active-step="9"]  .eekad-iv-sticky__slot[data-step="9"],
.eekad-iv-sticky[data-active-step="10"] .eekad-iv-sticky__slot[data-step="10"],
.eekad-iv-sticky[data-active-step="11"] .eekad-iv-sticky__slot[data-step="11"] {
	opacity: 1;
}

.eekad-iv-sticky__steps {
	display: flex;
	flex-direction: column;
	gap: 50vh;
	padding-block: 22vh;
	counter-reset: eekad-step;
}
.eekad-iv-sticky__step {
	position: relative;
	background: linear-gradient(135deg,
		rgba(20, 23, 28, 0.92) 0%,
		rgba(14, 17, 22, 0.88) 100%);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	padding: 44px 44px 44px 48px;
	border-inline-start: 3px solid rgba(var(--c-lime-rgb), 0.35);
	box-shadow:
		0 24px 48px -24px rgba(0, 0, 0, 0.8),
		inset 0 1px 0 rgba(var(--c-border-rgb), 0.04);
	transition:
		border-inline-start-width 0.4s ease,
		border-inline-start-color 0.4s ease,
		box-shadow 0.4s ease,
		background 0.4s ease;
}
/* "You are here" spotlight on the active step — thicker accent + lime ring */
.eekad-iv-sticky[data-active-step="0"]  .eekad-iv-sticky__step[data-scroll-step="0"],
.eekad-iv-sticky[data-active-step="1"]  .eekad-iv-sticky__step[data-scroll-step="1"],
.eekad-iv-sticky[data-active-step="2"]  .eekad-iv-sticky__step[data-scroll-step="2"],
.eekad-iv-sticky[data-active-step="3"]  .eekad-iv-sticky__step[data-scroll-step="3"],
.eekad-iv-sticky[data-active-step="4"]  .eekad-iv-sticky__step[data-scroll-step="4"],
.eekad-iv-sticky[data-active-step="5"]  .eekad-iv-sticky__step[data-scroll-step="5"],
.eekad-iv-sticky[data-active-step="6"]  .eekad-iv-sticky__step[data-scroll-step="6"],
.eekad-iv-sticky[data-active-step="7"]  .eekad-iv-sticky__step[data-scroll-step="7"],
.eekad-iv-sticky[data-active-step="8"]  .eekad-iv-sticky__step[data-scroll-step="8"],
.eekad-iv-sticky[data-active-step="9"]  .eekad-iv-sticky__step[data-scroll-step="9"],
.eekad-iv-sticky[data-active-step="10"] .eekad-iv-sticky__step[data-scroll-step="10"],
.eekad-iv-sticky[data-active-step="11"] .eekad-iv-sticky__step[data-scroll-step="11"] {
	border-inline-start-color: var(--c-lime);
	border-inline-start-width: 5px;
	box-shadow:
		0 30px 64px -20px rgba(0, 0, 0, 0.95),
		inset 0 1px 0 rgba(var(--c-border-rgb), 0.06),
		0 0 0 1px rgba(var(--c-lime-rgb), 0.18);
}
/* Step counter — "01" badge floating above the card */
.eekad-iv-sticky__step::before {
	content: counter(eekad-step, decimal-leading-zero);
	counter-increment: eekad-step;
	position: absolute;
	inset-block-start: -14px;
	inset-inline-start: 36px;
	background: var(--c-lime);
	color: var(--c-text-on-accent);
	font-family: var(--font-mono);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .16em;
	padding: 6px 14px;
}
.eekad-iv-sticky__kicker {
	font-family: var(--font-sans);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .12em;
	color: var(--c-lime);
	margin-block-end: 18px;
	display: flex;
	align-items: center;
	gap: 12px;
}
.eekad-iv-sticky__kicker::after {
	content: '';
	flex: 1;
	height: 1px;
	background: linear-gradient(to right, var(--c-lime), transparent);
	opacity: .4;
}
.eekad-iv-sticky__body {
	font-size: 22px;
	color: var(--c-text);
	line-height: 1.65;
	font-weight: 400;
}

/* Inline per-step media. Desktop hides this and shows the pinned
   __media slots instead; mobile flips that. */
.eekad-iv-sticky__step-media {
	display: none;
}

/* ----- Before / after slider ------------------------------- */
/* Matched to the figure block's matted-exhibit treatment: subtle
   container, hairline border, breathing mat around the stage,
   caption inside. Functional lime stays on the handle and the
   "after" label accent — those are interactive / meaningful. */
.eekad-iv-ba {
	margin: 0;
	display: flex;
	flex-direction: column;
	--ba-pos: 50%;
	background: rgba(var(--c-border-rgb), 0.025);
	border: 1px solid rgba(var(--c-border-rgb), 0.06);
	padding: 12px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.25);
	overflow: hidden;
}

.eekad-iv-ba__stage {
	position: relative;
	overflow: hidden;
	user-select: none;
	background: var(--c-bg-base);
	aspect-ratio: 16 / 9;
}
.eekad-iv-ba__before,
.eekad-iv-ba__after {
	position: absolute;
	inset: 0;
}
.eekad-iv-ba__before img,
.eekad-iv-ba__after img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	pointer-events: none;
}
.eekad-iv-ba__after {
	clip-path: inset(0 0 0 var(--ba-pos));
}

/* Labels — plain white text in the bottom corners, classic style */
.eekad-iv-ba__label {
	position: absolute;
	inset-block-end: 14px;
	font-family: var(--font-sans);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .04em;
	color: #fff;
	background: transparent;
	padding: 0;
	border: 0;
	z-index: 2;
	text-shadow:
		0 1px 2px rgba(0, 0, 0, 0.6),
		0 0 8px rgba(0, 0, 0, 0.35);
	pointer-events: none;
}
.eekad-iv-ba__label.is-before { inset-inline-end: 18px; }
.eekad-iv-ba__label.is-after  { inset-inline-start: 18px; }

/* Drag handle — classic white divider + white disc with black arrows */
.eekad-iv-ba__handle {
	position: absolute;
	top: 0;
	bottom: 0;
	left: var(--ba-pos);
	transform: translateX(-50%);
	width: 44px;
	background: transparent;
	border: 0;
	cursor: ew-resize;
	z-index: 3;
	padding: 0;
}
/* Solid white divider line, full height. */
.eekad-iv-ba__handle::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 2px;
	background: #fff;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18);
}
/* White disc with black left/right arrows, centered on the divider. */
.eekad-iv-ba__handle::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.92);
	box-shadow:
		0 2px 10px rgba(0, 0, 0, 0.35),
		0 0 0 1px rgba(0, 0, 0, 0.06);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='%23111'%3E%3Cpolygon points='10,4 10,20 3,12'/%3E%3Cpolygon points='14,4 14,20 21,12'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.eekad-iv-ba.is-dragging { cursor: ew-resize; }
.eekad-iv-ba__handle:hover::after,
.eekad-iv-ba.is-dragging .eekad-iv-ba__handle::after {
	transform: translate(-50%, -50%) scale(1.06);
	box-shadow:
		0 4px 14px rgba(0, 0, 0, 0.45),
		0 0 0 1px rgba(0, 0, 0, 0.06);
}

/* Initial reveal-pulse halo — drawn while the auto-reveal sweep runs,
   removed by JS once the user interacts. Pulses a soft white ring. */
.eekad-iv-ba.is-revealing .eekad-iv-ba__handle::after {
	animation: eekad-ba-reveal-pulse 1.4s ease-out infinite;
}
@keyframes eekad-ba-reveal-pulse {
	0%   { box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35), 0 0 0 0   rgba(255, 255, 255, 0.55); }
	100% { box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35), 0 0 0 16px rgba(255, 255, 255, 0); }
}

/* Caption — sits inside the matted container, matches the figure block */
.eekad-iv-ba__caption {
	padding: 14px 4px 4px;
	font-family: var(--font-sans);
	font-size: 14px;
	line-height: 1.55;
	color: var(--c-text-2);
}

@media (max-width: 600px) {
	.eekad-iv-ba { margin: 36px 0; padding: 8px; }
	.eekad-iv-ba__caption { font-size: 13px; padding: 12px 2px 2px; }
	.eekad-iv-ba__label { font-size: 11px; padding: 4px 10px; }
}

/* ----- Map (Mapbox) ---------------------------------------- */
/* Frame mirrors .eekad-network-map so the two blocks read as a pair. */
.eekad-iv-map {
	position: relative;
	margin: 0;
	background: var(--c-bg-alt);
	border: 1px solid rgba(203, 255, 0, .1);
	border-radius: 0;
	overflow: hidden;
	display: block;
}
.eekad-iv-map__header {
	padding: 24px 32px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	position: relative;
	z-index: 2;
}
.eekad-iv-map__badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--font-sans);
	font-size: 11px;
	font-weight: 700;
	color: var(--c-lime);
	letter-spacing: .04em;
}
.eekad-iv-map__badge-dot {
	width: 6px;
	height: 6px;
	background: var(--c-lime);
	animation: nm-pulse 2s ease-in-out infinite;
}
.eekad-iv-map__toggle {
	background: transparent;
	color: var(--c-lime);
	border: 1px solid rgba(203, 255, 0, .35);
	padding: 8px 14px;
	font-family: var(--font-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	cursor: pointer;
	transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.eekad-iv-map__toggle:hover {
	background: rgba(203, 255, 0, .08);
	border-color: rgba(203, 255, 0, .6);
}
.eekad-iv-map__toggle:focus-visible {
	outline: 2px solid var(--c-lime);
	outline-offset: 2px;
}
.eekad-iv-map__toggle-label[hidden] { display: none; }
.eekad-iv-map__canvas-wrap {
	position: relative;
	width: 100%;
	height: var(--map-height, 560px);
}
/* Corner brackets — same viewfinder pattern as network-map */
.eekad-iv-map__canvas-wrap::after {
	content: '';
	position: absolute;
	inset: 16px;
	z-index: 4;
	pointer-events: none;
	background:
		linear-gradient(to right,  rgba(203,255,0,.3) 0 28px, transparent 28px) top    left  / 28px 1.5px no-repeat,
		linear-gradient(to bottom, rgba(203,255,0,.3) 0 28px, transparent 28px) top    left  / 1.5px 28px no-repeat,
		linear-gradient(to left,   rgba(203,255,0,.3) 0 28px, transparent 28px) top    right / 28px 1.5px no-repeat,
		linear-gradient(to bottom, rgba(203,255,0,.3) 0 28px, transparent 28px) top    right / 1.5px 28px no-repeat,
		linear-gradient(to right,  rgba(203,255,0,.3) 0 28px, transparent 28px) bottom left  / 28px 1.5px no-repeat,
		linear-gradient(to top,    rgba(203,255,0,.3) 0 28px, transparent 28px) bottom left  / 1.5px 28px no-repeat,
		linear-gradient(to left,   rgba(203,255,0,.3) 0 28px, transparent 28px) bottom right / 28px 1.5px no-repeat,
		linear-gradient(to top,    rgba(203,255,0,.3) 0 28px, transparent 28px) bottom right / 1.5px 28px no-repeat;
}
.eekad-iv-map__canvas {
	width: 100%;
	height: 100%;
	background: var(--c-bg-base);
}
.eekad-iv-map__caption {
	padding: 16px 32px 24px;
	font-family: var(--font-mono);
	font-size: 11px;
	color: var(--c-text-muted);
	letter-spacing: .04em;
	border-top: 1px solid rgba(203, 255, 0, .06);
}
.eekad-iv-map__error {
	display: grid;
	place-items: center;
	background: var(--c-bg-surface);
	border: 1px dashed rgba(var(--c-border-rgb), 0.18);
	color: var(--c-text-muted);
	font-family: var(--font-mono);
	font-size: 12px;
	padding: 24px;
	text-align: center;
}
.eekad-iv-map__error code {
	background: var(--c-bg-alt);
	color: var(--c-lime);
	padding: 2px 6px;
	font-size: 11px;
}
.eekad-iv-map__pin {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--c-lime);
	color: var(--c-text-on-accent);
	font-family: var(--font-mono);
	font-size: 11px;
	font-weight: 700;
	display: grid;
	place-items: center;
	border: 2px solid var(--c-bg-alt);
	box-shadow: 0 0 0 2px var(--c-lime);
	cursor: pointer;
}
.mapboxgl-popup-content {
	background: var(--c-bg-alt) !important;
	color: var(--c-text) !important;
	border-inline-start: 2px solid var(--c-lime);
	border-radius: 0 !important;
	font-family: var(--font-sans);
	padding: 14px 16px !important;
}
.mapboxgl-popup-content strong { color: var(--c-lime); display: block; margin-block-end: 4px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.mapboxgl-popup-content p { margin: 0; font-size: 14px; }
.mapboxgl-popup-tip { display: none; }

/* --- Network Map block — force-directed OSINT graph --- */
.eekad-network-map {
	position: relative;
	background: var(--c-bg-alt);
	border: 1px solid rgba(203,255,0,.1);
	border-radius: 0;
	overflow: hidden;
	margin: 0;
}
.eekad-network-map.is-bleed {
	margin-inline: calc(-50vw + 50%);
	width: 100vw;
	border-radius: 0;
	border-inline: none;
}
.eekad-network-map__header {
	padding: 24px 32px;
	position: relative;
	z-index: 2;
}
.eekad-network-map__badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--font-sans);
	font-size: 11px;
	font-weight: 700;
	color: var(--c-lime);
	letter-spacing: .04em;
	margin-block-end: 12px;
}
.eekad-network-map__badge-dot {
	width: 6px;
	height: 6px;
	background: var(--c-lime);
	animation: nm-pulse 2s ease-in-out infinite;
}
@keyframes nm-pulse {
	0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(203,255,0,.4); }
	50% { opacity: .6; box-shadow: 0 0 0 6px rgba(203,255,0,0); }
}
.eekad-network-map__title {
	margin: 0;
	font-family: var(--font-sans);
	font-size: clamp(20px, 3vw, 28px);
	font-weight: 700;
	color: var(--c-text);
}
.eekad-network-map__canvas {
	position: relative;
	height: var(--nm-height, 700px);
	width: 100%;
}
/* Corner brackets — viewfinder / intelligence aesthetic */
.eekad-network-map__canvas::after {
	content: '';
	position: absolute;
	inset: 16px;
	z-index: 4;
	pointer-events: none;
	background:
		linear-gradient(to right,  rgba(203,255,0,.3) 0 28px, transparent 28px) top    left  / 28px 1.5px no-repeat,
		linear-gradient(to bottom, rgba(203,255,0,.3) 0 28px, transparent 28px) top    left  / 1.5px 28px no-repeat,
		linear-gradient(to left,   rgba(203,255,0,.3) 0 28px, transparent 28px) top    right / 28px 1.5px no-repeat,
		linear-gradient(to bottom, rgba(203,255,0,.3) 0 28px, transparent 28px) top    right / 1.5px 28px no-repeat,
		linear-gradient(to right,  rgba(203,255,0,.3) 0 28px, transparent 28px) bottom left  / 28px 1.5px no-repeat,
		linear-gradient(to top,    rgba(203,255,0,.3) 0 28px, transparent 28px) bottom left  / 1.5px 28px no-repeat,
		linear-gradient(to left,   rgba(203,255,0,.3) 0 28px, transparent 28px) bottom right / 28px 1.5px no-repeat,
		linear-gradient(to top,    rgba(203,255,0,.3) 0 28px, transparent 28px) bottom right / 1.5px 28px no-repeat;
}
/* Faint grid lines behind the graph */
.eekad-network-map__canvas::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(203,255,0,.03) 1px, transparent 1px),
		linear-gradient(90deg, rgba(203,255,0,.03) 1px, transparent 1px);
	background-size: 80px 80px;
	mask-image: radial-gradient(ellipse at center, rgba(0,0,0,.5) 0%, transparent 75%);
	-webkit-mask-image: radial-gradient(ellipse at center, rgba(0,0,0,.5) 0%, transparent 75%);
}
.eekad-network-map__svg {
	display: block;
	width: 100%;
	height: 100%;
}

/* Nodes */
.nm-node { transition: opacity .4s ease; }
.nm-node--reveal {
	animation: nm-materialize .6s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes nm-materialize {
	from { opacity: 0; }
	to   { opacity: 1; }
}
.nm-node--dim { opacity: .15 !important; }
.nm-node--highlight .nm-node__ring {
	filter: url(#nm-glow);
}
.nm-node__glow {
	transition: opacity .3s ease;
}
.nm-node__photo {
	transition: opacity .3s ease;
}
.nm-node__ring {
	fill: var(--c-bg-surface);
}
.nm-node__status-dot {
	stroke: var(--c-bg-base);
}
.nm-node__label {
	fill: var(--c-text);
	pointer-events: none;
	text-shadow: 0 1px 4px rgba(0,0,0,.8);
}
.nm-node__role {
	fill: var(--c-text-muted);
}
.nm-edge-label {
	fill: var(--c-text-muted);
}
.nm-node__role {
	pointer-events: none;
}

/* Node status pulse */
.nm-node--active .nm-node__status-dot {
	animation: nm-status-pulse 2.5s ease-in-out infinite;
}
@keyframes nm-status-pulse {
	0%, 100% { r: 5; }
	50% { r: 7; }
}

/* Edges */
.nm-edge {
	opacity: 0;
	transition: stroke .3s ease, stroke-width .3s ease, opacity .4s ease;
}
.nm-edge--reveal {
	opacity: 1;
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
	animation: nm-draw-edge 1.2s ease forwards;
}
@keyframes nm-draw-edge {
	to { stroke-dashoffset: 0; }
}
.nm-edge-label {
	pointer-events: none;
	transition: opacity .3s ease;
	text-shadow: 0 1px 3px rgba(0,0,0,.9);
}

/* Scan line */
.nm-scan-line {
	transition: opacity .5s ease;
	filter: blur(1px);
}

/* Detail panel */
.eekad-network-map__detail {
	position: absolute;
	top: 16px;
	left: 16px;
	width: 320px;
	max-height: calc(var(--nm-height, 700px) - 32px);
	overflow-y: auto;
	background: rgba(var(--c-bg-alt-rgb),.95);
	border: 1px solid rgba(203,255,0,.2);
	border-radius: 0;
	backdrop-filter: blur(12px);
	z-index: 10;
	padding: 20px;
	opacity: 0;
	transform: translateX(-20px);
	transition: opacity .3s ease, transform .3s ease;
}
.eekad-network-map__detail.nm-detail--open {
	opacity: 1;
	transform: translateX(0);
}
.eekad-network-map__detail-close {
	position: absolute;
	top: 8px;
	left: 8px;
	background: none;
	border: none;
	color: var(--c-text-muted);
	font-size: 24px;
	cursor: pointer;
	line-height: 1;
	padding: 4px 8px;
}
.eekad-network-map__detail-close:hover { color: var(--c-text); }

.nm-detail__header {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-block-end: 16px;
	padding-block-end: 16px;
	border-block-end: 1px solid rgba(var(--c-border-rgb),.08);
}
.nm-detail__photo {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--status-color, var(--c-lime));
}
.nm-detail__name {
	font-family: var(--font-sans);
	font-weight: 700;
	font-size: 16px;
	color: var(--c-text);
}
.nm-detail__name-en {
	font-family: var(--font-sans);
	font-size: 12px;
	color: var(--c-text-muted);
	direction: ltr;
}
.nm-detail__status {
	font-family: var(--font-sans);
	font-size: 12px;
	font-weight: 600;
}
.nm-detail__summary {
	font-family: var(--font-sans);
	font-size: 13px;
	line-height: 1.6;
	color: var(--c-text-2);
	margin: 0 0 16px;
}
.nm-detail__meta {
	font-family: var(--font-sans);
	font-size: 12px;
	color: var(--c-text-muted);
	margin-block-end: 16px;
}
.nm-detail__conns {
	border-block-start: 1px solid rgba(var(--c-border-rgb),.08);
	padding-block-start: 12px;
}
.nm-detail__conns-title {
	font-family: var(--font-sans);
	font-size: 11px;
	font-weight: 700;
	color: var(--c-lime);
	margin-block-end: 8px;
}
.nm-detail__conn {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: var(--font-sans);
	font-size: 13px;
	color: var(--c-text-2);
	padding: 4px 0;
}
.nm-detail__conn-arrow {
	color: var(--c-lime);
	font-size: 11px;
}
.nm-detail__conn-role {
	margin-inline-start: auto;
	font-size: 11px;
	color: var(--c-text-muted);
}

/* Legend */
.eekad-network-map__legend {
	position: absolute;
	bottom: 12px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 10;
	display: flex;
	gap: 20px;
	padding: 0;
}
.eekad-network-map__legend-item {
	display: flex;
	align-items: center;
	gap: 6px;
	font-family: var(--font-sans);
	font-size: 11px;
	color: var(--c-text-muted);
}
.eekad-network-map__legend-item[data-status="active"]  .eekad-network-map__legend-dot { background: #CDFE64; }
.eekad-network-map__legend-item[data-status="killed"]  .eekad-network-map__legend-dot { background: #ff4d4f; }
.eekad-network-map__legend-item[data-status="arrested"] .eekad-network-map__legend-dot { background: #fa8c16; }
.eekad-network-map__legend-item[data-status="org"]     .eekad-network-map__legend-dot { background: #5050D1; border-radius: 0; }
.eekad-network-map__legend-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

/* ── Fullscreen expand ──────────────────────────────── */
.eekad-network-map__expand-btn {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 12;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: rgba(var(--c-bg-alt-rgb),.85);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(203,255,0,.2);
	border-radius: 0;
	color: #CDFE64;
	font-family: var(--font-sans);
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s, border-color .2s;
}
.eekad-network-map__expand-btn:hover {
	background: rgba(203,255,0,.12);
	border-color: rgba(203,255,0,.4);
}
/* Zoom button bar */
.nm-zoom-bar {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	inset-inline-start: 16px;
	z-index: 12;
	display: flex;
	flex-direction: column;
	gap: 0;
	background: rgba(var(--c-bg-elevated-rgb),.92);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(var(--c-border-rgb),.12);
	border-radius: 0;
	overflow: hidden;
}
.nm-zoom-bar__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: none;
	border: none;
	border-bottom: 1px solid rgba(var(--c-border-rgb),.08);
	color: var(--c-text);
	cursor: pointer;
	transition: background .15s, color .15s;
}
.nm-zoom-bar__btn svg {
	width: 20px;
	height: 20px;
}
.nm-zoom-bar__btn:last-child { border-bottom: none; }
.nm-zoom-bar__btn:hover { background: rgba(203,255,0,.15); color: #CDFE64; }

/* ── Mobile tuning ──
   On phones the article column is far too narrow for a useful network
   graph (the simulation letterboxes into a tiny strip). Break out to
   the full viewport width, shorten the canvas, and shrink the zoom bar
   + legend so chrome doesn't dominate the limited screen real estate. */
@media (max-width: 768px) {
	.eekad-network-map {
		/* Break out of the narrow article column but keep a 16px gutter on
		   each side so the map is a card, not edge-to-edge. */
		margin-inline: calc(50% - 50vw + 16px);
		width: calc(100vw - 32px);
	}
	.eekad-network-map__header {
		padding: 18px 20px;
	}
	.eekad-network-map__title {
		font-size: 18px;
	}
	.eekad-network-map__canvas {
		height: clamp(420px, 70vh, 560px);
	}
	.nm-zoom-bar { inset-inline-start: 8px; }
	.nm-zoom-bar__btn { width: 36px; height: 36px; }
	.nm-zoom-bar__btn svg { width: 16px; height: 16px; }
	.eekad-network-map__legend {
		gap: 12px;
		bottom: 10px;
		flex-wrap: wrap;
		justify-content: center;
		max-width: calc(100% - 32px);
	}
	.eekad-network-map__legend-item { font-size: 10px; }
	.eekad-network-map__detail {
		width: calc(100% - 32px);
		max-width: 320px;
	}
}

.eekad-network-map__canvas {
	cursor: grab;
}
.eekad-network-map__canvas:active {
	cursor: grabbing;
}
/* Empty state — animated ghost network */
.nm-empty-state {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0;
	z-index: 5;
	pointer-events: none;
}
.nm-empty-state__graph {
	width: 580px;
	height: 430px;
	margin-bottom: 24px;
}
.nm-empty-state__text {
	color: rgba(255,255,255,.5);
	font-size: 17px;
	font-family: inherit;
	margin-bottom: 6px;
}
.nm-empty-state__sub {
	color: rgba(255,255,255,.25);
	font-size: 13px;
	font-family: inherit;
}

/* Ghost edges — curved paths with draw-on effect */
.nm-ghost-edge {
	stroke: rgba(203,255,0,.1);
	stroke-width: 1;
	fill: none;
	stroke-dasharray: 300;
	stroke-dashoffset: 300;
	animation: nm-draw 1.8s ease forwards;
}
@keyframes nm-draw {
	to { stroke-dashoffset: 0; }
}

/* Ghost nodes — fade in + gentle float */
.nm-ghost-node {
	fill: rgba(203,255,0,.12);
	stroke: rgba(203,255,0,.2);
	stroke-width: .8;
	opacity: 0;
	animation: nm-appear .6s ease forwards, nm-float 6s ease-in-out infinite;
}
.nm-ghost-node--hub {
	fill: rgba(203,255,0,.18);
	stroke: rgba(203,255,0,.3);
	stroke-width: 1;
}
@keyframes nm-appear {
	to { opacity: 1; }
}
@keyframes nm-float {
	0%, 100% { transform: translate(0, 0); }
	33% { transform: translate(2px, -3px); }
	66% { transform: translate(-2px, 2px); }
}

/* Hub glow rings */
.nm-ghost-glow {
	fill: none;
	stroke: rgba(203,255,0,.06);
	stroke-width: .8;
	opacity: 0;
	animation: nm-appear .8s ease forwards, nm-glow-pulse 5s ease-in-out infinite;
}
@keyframes nm-glow-pulse {
	0%, 100% { opacity: 1; stroke-width: .8; }
	50% { opacity: 0; stroke-width: 3; }
}
.eekad-network-map__expand-btn svg {
	width: 14px;
	height: 14px;
	fill: currentColor;
}

.eekad-network-map.is-fullscreen {
	position: fixed !important;
	inset: 0 !important;
	z-index: 100001 !important;
	margin: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	border: none !important;
	border-radius: 0 !important;
}
.eekad-network-map.is-fullscreen .eekad-network-map__canvas {
	height: calc(100vh - 100px) !important;
}
.eekad-network-map.is-fullscreen .eekad-network-map__detail {
	max-height: calc(100vh - 100px);
}

/* ── Network FAB (now lives inside .eekad-action-dock) ─ */
/* Dock handles positioning; these are just overrides.    */
.eekad-network-fab svg {
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Responsive */
@media (max-width: 800px) {
	.eekad-action-dock {
		bottom: 16px;
		left: 16px;
	}
}

/* Responsive tweaks */
@media (max-width: 800px) {
	.eekad-iv-cover { min-height: 560px; }
	.eekad-iv-cover__inner { padding-block: 96px 36px; }
	.eekad-iv-pullquote { margin: 48px 0; }
	.eekad-iv-pullquote::before { font-size: 72px; margin-block-end: -0.42em; }
	.eekad-iv-pullquote__text { font-size: 22px; line-height: 1.55; }
	.eekad-iv-pullquote__cite { margin-top: 20px; }
	.eekad-investigation__body { row-gap: 28px; }
	.eekad-investigation__body p,
	.eekad-investigation__body li {
		font-size: var(--fs-article-mobile);
	}

	.eekad-iv-stats.has-cols-3,
	.eekad-iv-stats.has-cols-4 { grid-template-columns: 1fr; }
	.eekad-iv-stats.has-cols-2 { grid-template-columns: 1fr; }
	.eekad-iv-gallery.has-cols-3 .eekad-iv-gallery__grid,
	.eekad-iv-gallery.has-cols-4 .eekad-iv-gallery__grid { grid-template-columns: repeat(2, 1fr); }
	/* Mobile sticky-scroll: simple editorial stack — image then text,
	   no card chrome. The desktop active-step highlight is irrelevant
	   in a single-column flow, so we strip the lime border, the 01/02
	   number badge, the kicker line, the box shadow. One quiet kicker
	   is enough rhythm. */
	.eekad-iv-sticky { padding-block: 16px; background: transparent; }
	.eekad-iv-sticky__inner {
		grid-template-columns: 1fr;
		gap: 0;
		padding-inline: 16px;
	}
	.eekad-iv-sticky__media { display: none; }
	.eekad-iv-sticky__steps {
		gap: 48px;
		padding-block: 0;
		display: flex;
		flex-direction: column;
	}
	.eekad-iv-sticky__step-media {
		display: block;
		margin: 0 0 18px;
		border: none;
		overflow: hidden;
		aspect-ratio: 4 / 3;
	}
	.eekad-iv-sticky__step-media img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}
	.eekad-iv-sticky__step,
	.eekad-iv-sticky[data-active-step] .eekad-iv-sticky__step,
	.eekad-iv-sticky[data-active-step] .eekad-iv-sticky__step[data-scroll-step] {
		padding: 0;
		background: transparent;
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		border: none;
		border-inline-start: 0;
		box-shadow: none;
	}
	.eekad-iv-sticky__step::before { display: none; }
	.eekad-iv-sticky__kicker {
		font-size: 11px;
		letter-spacing: .14em;
		text-transform: uppercase;
		color: var(--c-lime);
		margin-block-end: 10px;
		display: block;
	}
	.eekad-iv-sticky__kicker::after { display: none; }
	.eekad-iv-sticky__body {
		font-size: 17px;
		line-height: 1.7;
		color: var(--c-text);
	}

	.eekad-iv-immersive__card {
		max-width: calc(100% - 32px);
		margin-inline: 16px;
		padding: 32px 28px;
	}
	.eekad-iv-immersive__body { font-size: 19px; line-height: 1.55; }
	.eekad-iv-immersive__card::before {
		inset-inline-start: 24px;
		font-size: 11px;
		padding: 4px 10px;
	}
}

/* =============================================================
 * Immersive Scroll — full-bleed cinematic scrollytelling
 * =========================================================== */
.eekad-iv-immersive {
	position: relative;
}

/* ----- Background plates: stacked, full-viewport, crossfading ----- */
.eekad-iv-immersive__bg {
	position: sticky;
	top: 0;
	height: 100vh;
	width: 100%;
	overflow: hidden;
	z-index: 0;
}

.eekad-iv-immersive__plate {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 1.2s ease;
}

.eekad-iv-immersive__plate img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: saturate(1.08) contrast(1.04);
}

/* Dimming overlay per plate — controlled by --dim custom property */
.eekad-iv-immersive__plate::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, var(--dim, 0.55));
	pointer-events: none;
}

/* Active plate */
.eekad-iv-immersive[data-active-step="0"] .eekad-iv-immersive__plate[data-step="0"],
.eekad-iv-immersive[data-active-step="1"] .eekad-iv-immersive__plate[data-step="1"],
.eekad-iv-immersive[data-active-step="2"] .eekad-iv-immersive__plate[data-step="2"],
.eekad-iv-immersive[data-active-step="3"] .eekad-iv-immersive__plate[data-step="3"],
.eekad-iv-immersive[data-active-step="4"] .eekad-iv-immersive__plate[data-step="4"],
.eekad-iv-immersive[data-active-step="5"] .eekad-iv-immersive__plate[data-step="5"],
.eekad-iv-immersive[data-active-step="6"] .eekad-iv-immersive__plate[data-step="6"],
.eekad-iv-immersive[data-active-step="7"] .eekad-iv-immersive__plate[data-step="7"] {
	opacity: 1;
}

/* Vignette + cinematic gradient on the bg container */
.eekad-iv-immersive__bg::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background:
		radial-gradient(ellipse at center,
			transparent 35%,
			rgba(0, 0, 0, 0.55) 100%),
		linear-gradient(180deg,
			rgba(0, 0, 0, 0.25) 0%,
			transparent 25%,
			transparent 60%,
			rgba(0, 0, 0, 0.55) 100%);
}

/* ----- Text track: scrolls over the sticky background ----- */
.eekad-iv-immersive__track {
	position: relative;
	z-index: 1;
	margin-top: -100vh; /* pull the track over the sticky bg */
	display: flex;
	flex-direction: column;
	gap: 80vh;
	padding-block: 40vh;
}

/* ----- Text cards — cinematic NYT-style ----- */
.eekad-iv-immersive__card {
	max-width: 580px;
	background: linear-gradient(135deg,
		rgba(var(--c-bg-base-rgb), 0.82) 0%,
		rgba(var(--c-bg-base-rgb), 0.66) 100%);
	backdrop-filter: blur(20px) saturate(1.1);
	-webkit-backdrop-filter: blur(20px) saturate(1.1);
	padding: 52px 52px 48px 52px;
	border: 1px solid rgba(var(--c-border-rgb), 0.06);
	box-shadow:
		0 32px 80px -20px rgba(0, 0, 0, 0.85),
		inset 0 1px 0 rgba(var(--c-border-rgb), 0.04);
	counter-increment: eekad-imm-step;
}

.eekad-iv-immersive__track {
	counter-reset: eekad-imm-step;
}

/* Text position variants — desktop only. On mobile we ignore the
   editor's start/end/center pick and centre the card in a single
   column, since pushing it to one side just makes it overflow the
   viewport. The .eekad-iv-immersive__card mobile rule (above) sets
   the centred margin-inline / max-width directly. */
@media (min-width: 801px) {
	.eekad-iv-immersive.is-text-start .eekad-iv-immersive__card {
		margin-inline-start: max(24px, calc((100vw - 1280px) / 2 + 24px));
		margin-inline-end: auto;
	}
	.eekad-iv-immersive.is-text-end .eekad-iv-immersive__card {
		margin-inline-end: max(24px, calc((100vw - 1280px) / 2 + 24px));
		margin-inline-start: auto;
	}
	.eekad-iv-immersive.is-text-center .eekad-iv-immersive__card {
		margin-inline: auto;
		max-width: 640px;
		text-align: center;
	}
}

/* Step counter — refined floating chip on card top-leading corner */
.eekad-iv-immersive__card::before {
	content: counter(eekad-imm-step, decimal-leading-zero);
	position: absolute;
	inset-block-start: -16px;
	inset-inline-start: 36px;
	background: var(--c-lime);
	color: var(--c-text-on-accent);
	font-family: var(--font-mono);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .16em;
	padding: 6px 14px;
	z-index: 2;
}

/* Kicker — eyebrow line above body, optional */
.eekad-iv-immersive__kicker {
	font-family: var(--font-sans);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .12em;
	color: var(--c-lime);
	margin-block-end: 24px;
	display: flex;
	align-items: center;
	gap: 14px;
}
.eekad-iv-immersive__kicker::after {
	content: '';
	flex: 1;
	height: 1px;
	background: linear-gradient(to right, var(--c-lime), transparent);
	opacity: .35;
}
.eekad-iv-immersive.is-text-center .eekad-iv-immersive__kicker {
	justify-content: center;
}
.eekad-iv-immersive.is-text-center .eekad-iv-immersive__kicker::after {
	display: none;
}

/* Body text — cinematic, large for "voice in the dark" reading */
.eekad-iv-immersive__body {
	font-size: 26px;
	color: var(--c-text);
	line-height: 1.55;
	font-weight: 400;
}
.eekad-iv-immersive__body p {
	margin: 0 0 1em;
}
.eekad-iv-immersive__body p:last-child {
	margin-bottom: 0;
}

/* ----- Editor styles ----- */
.eekad-iv-immersive__editor-hint {
	background: rgba(213, 254, 119, 0.08);
	border-inline-start: 3px solid var(--c-lime);
	color: var(--c-text-2);
	font-size: 13px;
	padding: 10px 16px;
	margin-bottom: 16px;
}

.eekad-iv-immersive__step-edit {
	position: relative;
	min-height: 280px;
	background-color: var(--c-bg-alt);
	background-size: cover;
	background-position: center;
	border-radius: 0;
	overflow: hidden;
	margin-bottom: 12px;
}

.eekad-iv-immersive__step-overlay {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.eekad-iv-immersive__step-content {
	position: relative;
	z-index: 1;
	padding: 24px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 280px;
}

/* =============================================================
 * Category archive
 * =========================================================== */

/* --- Page background --- */
.eekad-archive { background: var(--c-bg-elevated); padding-block-end: 80px; }

/* --- Hero --- */
.eekad-archive__hero {
	position: relative;
	padding-block: 100px 40px;
	background: var(--c-bg-surface);
	border-block-end: 1px solid rgba(var(--c-border-rgb), .05);
	overflow: hidden;
}
.eekad-archive__hero-bg {
	display: none;
}
.eekad-archive__hero .eekad-container {
	position: relative;
	z-index: 1;
}
.eekad-archive__breadcrumb {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--c-text-muted);
	margin-block-end: 20px;
}
.eekad-archive__breadcrumb a {
	color: #cdfe64;
	transition: opacity .2s;
}
.eekad-archive__breadcrumb a:hover { opacity: .7; }
.eekad-archive__breadcrumb-sep {
	color: var(--c-text-faint);
}
.eekad-archive__title {
	font-size: 48px;
	font-weight: 700;
	line-height: 1.15;
	margin: 0 0 16px;
}
.eekad-archive__desc {
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--c-text-3);
	max-width: 640px;
	margin: 0 0 20px;
}
.eekad-archive__meta {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 13px;
	color: var(--c-text-faint);
}
.eekad-archive__accent-line {
	width: 32px;
	height: 3px;
	background: #cdfe64;
	flex-shrink: 0;
}
.eekad-archive__count {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

/* --- Subcategory pills (matches news archive pill style) --- */
.eekad-archive__subs {
	padding-block: 0;
	background: none;
	border: none;
}
.eekad-archive__subs-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
	padding-top: 48px;
	padding-bottom: 24px;
	border-bottom: 1px solid rgba(var(--c-border-rgb), .06);
	margin-bottom: 48px;
}
.eekad-archive__sub-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 600;
	color: var(--c-text-2);
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .06);
	text-decoration: none;
	transition: color .2s, background .2s, border-color .2s;
}
.eekad-archive__sub-pill:hover {
	color: #cdfe64;
	background: rgba(205, 254, 100, .08);
	border-color: rgba(205, 254, 100, .25);
}
.eekad-archive__sub-pill.is-active {
	color: var(--c-text-on-accent);
	background: #cdfe64;
	border-color: #cdfe64;
	font-weight: 600;
}
.eekad-archive__sub-count {
	font-size: 11px;
	opacity: .5;
	background: rgba(var(--c-border-rgb), .08);
	padding: 2px 6px;
	line-height: 1;
}
.eekad-archive__sub-pill.is-active .eekad-archive__sub-count {
	background: rgba(var(--c-border-rgb), .1);
	opacity: .7;
}

/* --- Featured post --- */
.eekad-archive__featured {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 0;
	margin-block: 40px;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .05);
	border-inline-start: 3px solid #cdfe64;
	border-radius: 0;
	overflow: hidden;
}
.eekad-archive__featured-media {
	display: block;
	overflow: hidden;
	max-height: 420px;
}
.eekad-archive__featured-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s ease;
}
.eekad-archive__featured:hover .eekad-archive__featured-media img {
	transform: scale(1.03);
}
.eekad-archive__featured-body {
	padding: 36px 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 0;
}
.eekad-archive__featured-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--c-text-muted);
	margin: 0 0 16px;
}
.eekad-archive__featured-cat {
	color: #cdfe64;
	font-weight: 600;
}
.eekad-archive__meta-sep {
	width: 3px;
	height: 3px;
	background: rgba(var(--c-border-rgb), .2);
	border-radius: 50%;
	flex-shrink: 0;
}
.eekad-archive__featured-title {
	font-size: 28px;
	font-weight: 700;
	line-height: 1.35;
	margin: 0 0 14px;
}
.eekad-archive__featured-title a {
	transition: color .2s;
}
.eekad-archive__featured-title a:hover {
	color: #cdfe64;
}
.eekad-archive__featured-excerpt {
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--c-text-3);
	margin: 0 0 24px;
}
.eekad-archive__featured-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 600;
	color: #cdfe64;
	transition: opacity .2s;
}
.eekad-archive__featured-cta svg {
	width: 18px;
	height: 18px;
}
.eekad-archive__featured-cta:hover { opacity: .7; }

/* --- Category featured reports --- */
.eekad-cat-featured {
	padding-block: 48px 56px;
}
.eekad-cat-featured__header {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	margin-bottom: 32px;
	padding-bottom: 24px;
	border-bottom: 1px solid rgba(var(--c-border-rgb), 0.06);
}
.eekad-cat-featured__title {
	font-family: var(--font-sans);
	font-size: 28px;
	font-weight: 700;
	color: var(--c-text);
	margin: 0;
}
.eekad-cat-featured__pills {
	margin: 0;
}
.eekad-cat-featured__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.eekad-cat-featured__grid[hidden] { display: none; }
@media (max-width: 960px) {
	.eekad-cat-featured__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
	.eekad-cat-featured__grid { grid-template-columns: 1fr; }
}

/* --- Posts grid --- */
.eekad-archive__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
	margin-block-end: 48px;
}
.eekad-archive__card {
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .05);
	border-radius: 0;
	overflow: hidden;
	transition: transform .2s, border-color .2s;
}
.eekad-archive__card:hover {
	transform: translateY(-3px);
	border-color: rgba(205, 254, 100, .35);
}
.eekad-archive__card-media {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
}
.eekad-archive__card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s ease;
}
.eekad-archive__card:hover .eekad-archive__card-media img {
	transform: scale(1.03);
}
.eekad-archive__card-body {
	padding: 20px 24px 24px;
}
.eekad-archive__card-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	color: var(--c-text-muted);
	margin: 0 0 10px;
}
.eekad-archive__card-cat {
	color: #cdfe64;
	font-weight: 600;
}
.eekad-archive__card-title {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 8px;
}
.eekad-archive__card-title a {
	transition: color .2s;
}
.eekad-archive__card-title a:hover {
	color: #cdfe64;
}
.eekad-archive__card-excerpt {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.65;
	color: var(--c-text-muted);
	margin: 0;
}

/* --- Pagination --- */
.eekad-archive__pagination {
	margin-block: 40px 48px;
	display: flex;
	justify-content: center;
}
.eekad-archive__pagination .page-numbers {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 4px;
}
.eekad-archive__pagination .page-numbers li {
	display: inline-flex;
}
.eekad-archive__pagination .page-numbers a,
.eekad-archive__pagination .page-numbers span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	font-size: 14px;
	font-weight: 500;
	color: var(--c-text-muted);
	border: 1px solid rgba(var(--c-border-rgb), .06);
	transition: color .2s, background .2s, border-color .2s;
}
.eekad-archive__pagination .page-numbers a:hover {
	color: var(--c-text);
	background: rgba(var(--c-border-rgb), .06);
	border-color: rgba(var(--c-border-rgb), .1);
}
.eekad-archive__pagination .page-numbers .current {
	color: var(--c-text-on-accent);
	background: #cdfe64;
	border-color: #cdfe64;
	font-weight: 700;
}

/* --- Related entities --- */
.eekad-archive__entities {
	margin-block: 16px 56px;
	padding-block-start: 32px;
	border-block-start: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-archive__entities-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-block-end: 20px;
}
.eekad-archive__entities-title {
	font-size: 20px;
	font-weight: 700;
	margin: 0;
}
.eekad-archive__entities-more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 500;
	color: var(--archive-accent, var(--c-lime));
	transition: opacity .2s;
}
.eekad-archive__entities-more svg {
	width: 16px;
	height: 16px;
}
.eekad-archive__entities-more:hover { opacity: .7; }
.eekad-archive__entities-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}
.eekad-archive__entity {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px;
	background: rgba(var(--c-border-rgb), .03);
	border: 1px solid rgba(var(--c-border-rgb), .04);
	text-decoration: none;
	transition: background .2s, border-color .2s;
}
.eekad-archive__entity:hover {
	background: rgba(var(--c-border-rgb), .06);
	border-color: rgba(var(--c-border-rgb), .08);
}
.eekad-archive__entity-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex-shrink: 0;
}
.eekad-archive__entity-name {
	flex: 1;
	font-size: 14px;
	font-weight: 600;
	color: var(--c-text);
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.eekad-archive__entity-type {
	font-size: 11px;
	color: var(--c-text-faint);
	flex-shrink: 0;
}

/* --- Responsive --- */
@media (max-width: 768px) {
	.eekad-archive__hero { padding-block: 80px 28px; }
	.eekad-archive__title { font-size: 32px; }
	.eekad-archive__featured { grid-template-columns: 1fr; }
	.eekad-archive__featured-body { padding: 24px; }
	.eekad-archive__grid { grid-template-columns: 1fr; }
	.eekad-archive__entities-grid { grid-template-columns: 1fr; }
}

/* =============================================================
 * Category — All Posts section
 * =========================================================== */
.eekad-cat-all {
	padding-block: 56px 80px;
}
.eekad-cat-all__header {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-bottom: 32px;
}
.eekad-cat-all__title {
	font-size: 28px;
	font-weight: 700;
	color: var(--c-text);
	margin: 0;
	padding-bottom: 16px;
	border-bottom: 1px solid rgba(var(--c-border-rgb), 0.06);
}
.eekad-cat-all__search {
	display: flex;
	align-items: center;
	gap: 10px;
	max-width: 420px;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .08);
	padding: 10px 16px;
	transition: border-color .2s;
}
.eekad-cat-all__search:focus-within {
	border-color: var(--c-lime, #CDFE64);
}
.eekad-cat-all__search-label {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	color: var(--c-text-faint);
	cursor: pointer;
}
.eekad-cat-all__search-label svg { width: 18px; height: 18px; }
.eekad-cat-all__search-input {
	flex: 1;
	min-width: 0;
	background: none;
	border: 0;
	outline: 0;
	color: var(--c-text);
	font-size: 14px;
	font-family: inherit;
	padding: 0;
	width: 100%;
}
.eekad-cat-all__search-input::placeholder { color: var(--c-text-faint); }
.eekad-cat-all__search-input::-webkit-search-cancel-button { display: none; }
.eekad-cat-all__search-clear {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	color: var(--c-text-faint);
	transition: color .2s;
}
.eekad-cat-all__search-clear:hover { color: var(--c-text); }
.eekad-cat-all__search-clear svg { width: 14px; height: 14px; }
.eekad-cat-all__results {
	transition: opacity .2s;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.eekad-cat-all__empty {
	color: var(--c-text-muted);
	font-size: 15px;
	text-align: center;
	padding: 48px 0;
}
.eekad-cat-all .eekad-news-archive__grid {
	grid-template-columns: repeat(4, 1fr);
	width: 100%;
}
@media (max-width: 1100px) {
	.eekad-cat-all .eekad-news-archive__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
	.eekad-cat-all .eekad-news-archive__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
	.eekad-cat-all__search { max-width: none; }
}
@media (max-width: 640px) {
	.eekad-cat-all .eekad-news-archive__grid { grid-template-columns: 1fr; }
}
.eekad-cat-all__load-more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 48px auto 0;
	padding: 10px 28px;
	font-size: 14px;
	font-weight: 600;
	font-family: inherit;
	color: var(--c-text-muted);
	background: none;
	border: 1px solid rgba(var(--c-border-rgb), .1);
	cursor: pointer;
	transition: color .2s, border-color .2s;
}
.eekad-cat-all__load-more:hover {
	color: var(--c-text);
	border-color: var(--c-lime, #cdfe64);
}
.eekad-cat-all__load-more:disabled {
	opacity: .5;
	cursor: default;
}

/* =============================================================
 * Eekad File (ملف إيكاد)
 * =========================================================== */

/* --- Hero overlay HUD (floating file badge on the hero) --- */
.eekad-file-hud {
	position: absolute;
	top: 80px;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	background: rgba(0, 0, 0, .55);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(var(--c-border-rgb), .08);
	inset-inline-end: clamp(16px, 4vw, 80px);
}
.eekad-file-hud__label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--c-lime, #cdfe64);
}
.eekad-file-hud__name {
	font-size: 14px;
	font-weight: 600;
	color: var(--c-text);
}
.eekad-file-hud__status {
	font-size: 11px;
	font-weight: 600;
	padding: 3px 8px;
	color: var(--c-text-3);
	background: rgba(var(--c-border-rgb), .08);
}
.eekad-file-hud__status--active { color: #55ce5c; background: rgba(85, 206, 92, .12); }
.eekad-file-hud__status--developing { color: #fdec4b; background: rgba(253, 236, 75, .12); }
.eekad-file-hud__status--archived { color: rgba(var(--c-border-rgb), .35); }

/* --- Context bar (sticky dossier strip below the hero) --- */
.eekad-file-bar {
	position: sticky;
	top: 56px;
	z-index: 90;
	background: var(--c-bg-alt);
	border-block-end: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-file-bar__inner {
	display: flex;
	align-items: center;
	gap: 24px;
	padding-block: 18px;
}
.eekad-file-bar__id {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}
.eekad-file-bar__label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--c-lime, #cdfe64);
}
.eekad-file-bar__name {
	font-size: 14px;
	font-weight: 600;
	color: var(--c-text);
}
.eekad-file-bar__status {
	font-size: 10px;
	font-weight: 600;
	padding: 2px 7px;
	color: var(--c-text-muted);
	background: rgba(var(--c-border-rgb), .06);
}
.eekad-file-bar__status--active { color: #55ce5c; background: rgba(85, 206, 92, .1); }
.eekad-file-bar__status--developing { color: #fdec4b; background: rgba(253, 236, 75, .1); }
.eekad-file-bar__stats {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-inline-start: auto;
}
.eekad-file-bar__stat {
	font-size: 12px;
	color: var(--c-text-muted);
}
.eekad-file-bar__stat strong {
	color: var(--c-text);
	font-weight: 600;
	margin-inline-end: 3px;
}
.eekad-file-bar__cta {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 600;
	color: var(--c-lime, #cdfe64);
	text-decoration: none;
	white-space: nowrap;
	flex-shrink: 0;
	transition: opacity .2s;
}
.eekad-file-bar__cta:hover { opacity: .7; }

/* --- Close button on the context bar --- */
.eekad-file-bar__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	flex-shrink: 0;
	color: var(--c-text-faint);
	background: transparent;
	border: 1px solid rgba(var(--c-border-rgb), .08);
	cursor: pointer;
	transition: color .2s, border-color .2s;
	padding: 0;
	margin-inline-start: 12px;
}
.eekad-file-bar__close:hover {
	color: var(--c-text);
	border-color: rgba(var(--c-border-rgb), .2);
}
.eekad-file-bar__close svg { width: 14px; height: 14px; }

@media (max-width: 768px) {
	.eekad-file-hud { top: 68px; padding: 6px 12px; gap: 6px; }
	.eekad-file-hud__name { font-size: 13px; }
	.eekad-file-bar__inner { flex-wrap: wrap; gap: 8px 16px; }
	.eekad-file-bar__stats { margin-inline-start: 0; }
	.eekad-file-bar__cta { margin-inline-start: auto; }
}

/* --- Hero (legacy, kept for compatibility) --- */
.eekad-file__hero {
	position: relative;
	padding-block: 100px 40px;
	background: var(--c-bg-surface);
	overflow: hidden;
}
.eekad-file__hero-bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: .3;
}
.eekad-file__hero-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, var(--c-bg-surface) 0%, transparent 60%);
}
.eekad-file__hero-content {
	position: relative;
	z-index: 1;
}

/* Badge row */
.eekad-file__hero-badge {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-block-end: 20px;
}
.eekad-file__hero-label {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #cdfe64;
}
.eekad-file__hero-status {
	font-size: 12px;
	font-weight: 600;
	padding: 5px 12px;
	color: var(--c-text-2);
	background: rgba(var(--c-border-rgb), .08);
}
.eekad-file__hero-status--active {
	color: #55ce5c;
	background: rgba(85, 206, 92, .1);
}
.eekad-file__hero-status--developing {
	color: #fdec4b;
	background: rgba(253, 236, 75, .1);
}
.eekad-file__hero-status--archived {
	color: var(--c-text-muted);
}

/* Title & text */
.eekad-file__hero-title {
	font-size: 48px;
	font-weight: 700;
	line-height: 1.15;
	margin: 0 0 16px;
}
.eekad-file__hero-desc {
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--c-text-3);
	max-width: 640px;
	margin: 0 0 16px;
}
.eekad-file__hero-date {
	font-size: 13px;
	color: var(--c-text-faint);
	margin: 0 0 24px;
}

/* Stats */
.eekad-file__stats {
	display: flex;
	gap: 24px;
}
.eekad-file__stat {
	font-size: 14px;
	color: var(--c-text-muted);
	display: flex;
	align-items: baseline;
	gap: 6px;
}
.eekad-file__stat-num {
	font-size: 28px;
	font-weight: 700;
	color: var(--c-text);
	line-height: 1;
}

/* --- Featured (full-bleed image card) --- */
.eekad-file__featured {
	display: block;
	position: relative;
	margin-block: 40px;
	min-height: 420px;
	background-size: cover;
	background-position: center;
	overflow: hidden;
	text-decoration: none;
	color: var(--c-text);
}
.eekad-file__featured-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .3) 50%, rgba(0, 0, 0, .1) 100%);
	transition: background .3s;
}
.eekad-file__featured:hover .eekad-file__featured-overlay {
	background: linear-gradient(to top, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .4) 50%, rgba(0, 0, 0, .15) 100%);
}
.eekad-file__featured-body {
	position: relative;
	z-index: 1;
	padding: 40px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 420px;
}
.eekad-file__featured-badges {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-block-end: 14px;
}
.eekad-file__type-badge {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .03em;
	padding: 4px 10px;
	color: var(--c-lime, #CDFE64);
	background: rgba(213, 254, 119, .15);
}
.eekad-file__featured-cat {
	font-size: 12px;
	color: var(--c-text-muted);
}
.eekad-file__featured-title {
	font-size: 32px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 12px;
	max-width: 700px;
}
.eekad-file__featured-excerpt {
	font-size: 16px;
	line-height: 1.7;
	color: var(--c-text-2);
	margin: 0 0 16px;
	max-width: 600px;
}
.eekad-file__featured-date {
	font-size: 13px;
	color: var(--c-text-faint);
}

/* --- Lead article cards (2-col) --- */
.eekad-file__lead-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	margin-block-end: 24px;
}
.eekad-file__lead-card {
	background: var(--c-bg-elevated);
	overflow: hidden;
	transition: transform .2s;
}
.eekad-file__lead-card:hover { transform: translateY(-2px); }
.eekad-file__lead-media {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
}
.eekad-file__lead-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s;
}
.eekad-file__lead-card:hover .eekad-file__lead-media img { transform: scale(1.03); }
.eekad-file__lead-body {
	padding: 18px 22px 22px;
}
.eekad-file__lead-title {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	margin: 6px 0 8px;
}
.eekad-file__lead-title a { transition: color .2s; }
.eekad-file__lead-title a:hover { color: var(--c-lime); }

/* --- Sections --- */
.eekad-file__section {
	margin-block-end: 48px;
	padding-block-start: 32px;
	border-block-start: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-file__section-title {
	font-size: 22px;
	font-weight: 700;
	margin: 0 0 20px;
}

/* --- Investigation cards --- */
.eekad-file__inv-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}
.eekad-file__inv-card {
	display: flex;
	flex-direction: column;
	background: var(--c-bg-elevated);
	overflow: hidden;
	text-decoration: none;
	transition: transform .2s;
}
.eekad-file__inv-card:hover { transform: translateY(-2px); }
.eekad-file__inv-thumb {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
}
.eekad-file__inv-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s;
}
.eekad-file__inv-card:hover .eekad-file__inv-thumb img { transform: scale(1.03); }
.eekad-file__inv-body {
	padding: 16px 20px 20px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.eekad-file__inv-title {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--c-text);
}
.eekad-file__inv-date {
	font-size: 12px;
	color: var(--c-text-faint);
}

/* --- Article rows --- */
.eekad-file__articles {
	display: flex;
	flex-direction: column;
	gap: 0;
}
.eekad-file__article-row {
	display: flex;
	gap: 20px;
	padding-block: 20px;
	border-block-end: 1px solid rgba(var(--c-border-rgb), .04);
	align-items: center;
}
.eekad-file__article-row:last-child { border-block-end: none; }
.eekad-file__article-thumb {
	flex-shrink: 0;
	width: 160px;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	display: block;
}
.eekad-file__article-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .3s;
}
.eekad-file__article-row:hover .eekad-file__article-thumb img { transform: scale(1.03); }
.eekad-file__article-body {
	flex: 1;
	min-width: 0;
}
.eekad-file__article-cat {
	font-size: 12px;
	font-weight: 600;
	color: var(--c-lime, #CDFE64);
	margin-block-end: 4px;
	display: block;
}
.eekad-file__article-title {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 6px;
}
.eekad-file__article-title a { transition: color .2s; }
.eekad-file__article-title a:hover { color: var(--c-lime); }
.eekad-file__article-excerpt {
	font-size: 14px;
	line-height: 1.6;
	color: var(--c-text-muted);
	margin: 0 0 6px;
}
.eekad-file__article-date {
	font-size: 12px;
	color: var(--c-text-faint);
}

/* --- Entities --- */
.eekad-file__entities-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-block-end: 20px;
}
.eekad-file__entities-header .eekad-file__section-title { margin: 0; }
.eekad-file__entities-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 500;
	color: var(--c-lime, #CDFE64);
	transition: opacity .2s;
}
.eekad-file__entities-link svg { width: 16px; height: 16px; }
.eekad-file__entities-link:hover { opacity: .7; }
.eekad-file__entities-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	margin-block-end: 48px;
}
.eekad-file__entity {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px;
	background: rgba(var(--c-border-rgb), .03);
	border: 1px solid rgba(var(--c-border-rgb), .04);
	text-decoration: none;
	transition: background .2s, border-color .2s;
}
.eekad-file__entity:hover {
	background: rgba(var(--c-border-rgb), .06);
	border-color: rgba(var(--c-border-rgb), .08);
}
.eekad-file__entity-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex-shrink: 0;
}
.eekad-file__entity-name {
	flex: 1;
	font-size: 14px;
	font-weight: 600;
	color: var(--c-text);
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.eekad-file__entity-type {
	font-size: 11px;
	color: var(--c-text-faint);
	flex-shrink: 0;
}

/* --- Responsive --- */
@media (max-width: 768px) {
	.eekad-file__hero { padding-block: 80px 28px; }
	.eekad-file__hero-title { font-size: 32px; }
	.eekad-file__stats { flex-wrap: wrap; gap: 16px; }
}


/* =============================================================
 * Investigations Archive — /investigations/
 * =========================================================== */

.eekad-inv-archive__hero {
	position: relative;
	padding-block: 100px 40px;
	background: var(--c-bg-surface);
	overflow: hidden;
}
.eekad-inv-archive__hero-bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: .25;
}
.eekad-inv-archive__hero-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, var(--c-bg-surface) 0%, transparent 60%);
}
.eekad-inv-archive__hero-inner {
	position: relative;
	z-index: 1;
}
.eekad-inv-archive__hero-label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #cdfe64;
	margin-block-end: 16px;
}
.eekad-inv-archive__hero-title {
	font-size: 48px;
	font-weight: 700;
	line-height: 1.15;
	margin: 0 0 16px;
}
.eekad-inv-archive__hero-desc {
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--c-text-3);
	max-width: 640px;
	margin: 0 0 20px;
}
.eekad-inv-archive__hero-count {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: #cdfe64;
	font-family: var(--font-mono, monospace);
	font-size: 13px;
	font-weight: 600;
}

/* Featured */
.eekad-inv-archive__featured {
	display: block;
	position: relative;
	margin-block: 40px;
	min-height: 420px;
	background-size: cover;
	background-position: center;
	overflow: hidden;
	text-decoration: none;
	color: var(--c-text);
}
.eekad-inv-archive__featured-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .3) 50%, rgba(0, 0, 0, .1) 100%);
	transition: background .3s;
}
.eekad-inv-archive__featured:hover .eekad-inv-archive__featured-overlay {
	background: linear-gradient(to top, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .4) 50%, rgba(0, 0, 0, .15) 100%);
}
.eekad-inv-archive__featured-body {
	position: relative;
	z-index: 1;
	padding: 40px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 420px;
}
.eekad-inv-archive__featured-badges {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-block-end: 14px;
}
.eekad-inv-archive__badge {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .03em;
	padding: 4px 10px;
	color: var(--c-lime, #CDFE64);
	background: rgba(213, 254, 119, .15);
}
.eekad-inv-archive__featured-file {
	font-size: 12px;
	color: var(--c-text-muted);
}
.eekad-inv-archive__featured-title {
	font-size: 32px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 12px;
	max-width: 700px;
}
.eekad-inv-archive__featured-excerpt {
	font-size: 16px;
	line-height: 1.7;
	color: var(--c-text-2);
	margin: 0 0 16px;
	max-width: 600px;
}
.eekad-inv-archive__featured-date {
	font-size: 13px;
	color: var(--c-text-faint);
}

/* Grid */
.eekad-inv-archive__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-block-end: 48px;
}
.eekad-inv-archive__card {
	background: var(--c-bg-elevated);
	overflow: hidden;
	transition: transform .2s;
}
.eekad-inv-archive__card:hover { transform: translateY(-2px); }
.eekad-inv-archive__card-media {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
}
.eekad-inv-archive__card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s;
}
.eekad-inv-archive__card:hover .eekad-inv-archive__card-media img { transform: scale(1.03); }
.eekad-inv-archive__card-body {
	padding: 18px 22px 22px;
}
.eekad-inv-archive__card-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-block-end: 8px;
}
.eekad-inv-archive__card-file {
	font-size: 12px;
	color: var(--c-text-muted);
}
.eekad-inv-archive__card-title {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 8px;
}
.eekad-inv-archive__card-title a { transition: color .2s; }
.eekad-inv-archive__card-title a:hover { color: var(--c-lime); }
.eekad-inv-archive__card-excerpt {
	font-size: 14px;
	line-height: 1.6;
	color: var(--c-text-muted);
	margin: 0 0 10px;
}
.eekad-inv-archive__card-date {
	font-size: 12px;
	color: var(--c-text-faint);
}

/* Pagination */
.eekad-inv-archive__pagination {
	margin-block-end: 64px;
	display: flex;
	justify-content: center;
}
.eekad-inv-archive__pagination .page-numbers {
	list-style: none;
	display: flex;
	gap: 4px;
	padding: 0;
	margin: 0;
}
.eekad-inv-archive__pagination .page-numbers li a,
.eekad-inv-archive__pagination .page-numbers li span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	font-size: 14px;
	font-weight: 500;
	color: var(--c-text-muted);
	background: rgba(var(--c-border-rgb), .04);
	transition: background .2s, color .2s;
}
.eekad-inv-archive__pagination .page-numbers li a:hover {
	background: rgba(var(--c-border-rgb), .08);
	color: var(--c-text);
}
.eekad-inv-archive__pagination .page-numbers li span.current {
	background: var(--c-lime);
	color: var(--c-text-on-accent);
	font-weight: 700;
}

@media (max-width: 768px) {
	.eekad-inv-archive__hero { padding-block: 80px 28px; }
	.eekad-inv-archive__hero-title { font-size: 32px; }
	.eekad-inv-archive__featured { min-height: 300px; }
	.eekad-inv-archive__featured-body { min-height: 300px; padding: 24px; }
	.eekad-inv-archive__featured-title { font-size: 24px; }
	.eekad-inv-archive__grid { grid-template-columns: 1fr; }
}


/* =============================================================
 * Files Index — /files/
 * =========================================================== */

.eekad-files-index__hero {
	padding-block: 100px 40px;
	background: var(--c-bg-elevated);
}
.eekad-files-index__hero-inner {
	position: relative;
	z-index: 1;
}
.eekad-files-index__hero-label {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--c-lime, #CDFE64);
	background: rgba(213, 254, 119, .1);
	padding: 5px 12px;
	margin-block-end: 20px;
}
.eekad-files-index__hero-title {
	font-size: 48px;
	font-weight: 700;
	line-height: 1.15;
	margin: 0 0 16px;
}
.eekad-files-index__hero-desc {
	font-size: 18px;
	font-weight: 400;
	line-height: 1.7;
	color: var(--c-text-3);
	max-width: 680px;
	margin: 0 0 16px;
}
.eekad-files-index__hero-count {
	font-size: 14px;
	color: var(--c-text-faint);
}

/* Sections */
.eekad-files-index__section {
	padding-block: 40px;
	border-block-start: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-files-index__section:first-child { border-block-start: none; }
.eekad-files-index__section-title {
	font-size: 22px;
	font-weight: 700;
	margin: 0 0 24px;
}

/* Card grid */
.eekad-files-index__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}
.eekad-files-index__grid--archived {
	grid-template-columns: repeat(3, 1fr);
}

/* File card */
.eekad-files-index__card {
	display: block;
	position: relative;
	min-height: 280px;
	overflow: hidden;
	text-decoration: none;
	color: var(--c-text);
	background: var(--c-bg-elevated);
	transition: transform .2s;
}
.eekad-files-index__card:hover { transform: translateY(-2px); }
.eekad-files-index__card-cover {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform .5s;
}
.eekad-files-index__card:hover .eekad-files-index__card-cover { transform: scale(1.03); }
.eekad-files-index__card-cover--empty {
	background: linear-gradient(135deg, rgba(213, 254, 119, .06) 0%, rgba(var(--c-bg-elevated-rgb), .8) 100%);
}
.eekad-files-index__card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .3) 50%, rgba(0, 0, 0, .05) 100%);
}
.eekad-files-index__card-body {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 28px;
	min-height: 280px;
}

/* Badges */
.eekad-files-index__card-badges {
	margin-block-end: 12px;
}
.eekad-files-index__card-status {
	font-size: 11px;
	font-weight: 600;
	padding: 3px 10px;
	color: var(--c-text-3);
	background: rgba(var(--c-border-rgb), .08);
}
.eekad-files-index__card-status--active {
	color: #55ce5c;
	background: rgba(85, 206, 92, .12);
}
.eekad-files-index__card-status--developing {
	color: #fdec4b;
	background: rgba(253, 236, 75, .12);
}
.eekad-files-index__card-status--archived {
	color: var(--c-text-muted);
}

/* Card text */
.eekad-files-index__card-title {
	font-size: 26px;
	font-weight: 700;
	line-height: 1.3;
	margin-block-end: 8px;
}
.eekad-files-index__card-desc {
	font-size: 14px;
	line-height: 1.6;
	color: var(--c-text-muted);
	margin-block-end: 14px;
	display: block;
}
.eekad-files-index__card-stats {
	display: flex;
	gap: 14px;
	font-size: 12px;
	color: var(--c-text-faint);
}
.eekad-files-index__card-stats span {
	display: inline-flex;
	align-items: center;
}

/* Archived cards — simpler, no cover image */
.eekad-files-index__card--archived {
	min-height: auto;
	background: rgba(var(--c-border-rgb), .03);
	border: 1px solid rgba(var(--c-border-rgb), .04);
}
.eekad-files-index__card--archived:hover {
	background: rgba(var(--c-border-rgb), .05);
	border-color: rgba(var(--c-border-rgb), .08);
}
.eekad-files-index__card--archived .eekad-files-index__card-body {
	min-height: auto;
	padding: 20px 24px;
}
.eekad-files-index__card--archived .eekad-files-index__card-title {
	font-size: 17px;
}

/* Empty state */
.eekad-files-index__empty {
	text-align: center;
	padding-block: 80px;
	font-size: 16px;
	color: var(--c-text-muted);
}

@media (max-width: 768px) {
	.eekad-files-index__hero { padding-block: 80px 28px; }
	.eekad-files-index__hero-title { font-size: 32px; }
	.eekad-files-index__grid { grid-template-columns: 1fr; }
	.eekad-files-index__grid--archived { grid-template-columns: 1fr; }
}

/* ============================================================
   Latest News — homepage strip + category page strip
   ============================================================ */

.eekad-news { padding-block: 80px; }
.eekad-news__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 32px;
}
.eekad-news__title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	color: var(--c-text);
	font-size: 30px;
	font-weight: 700;
	line-height: 1;
}
.eekad-news__more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--c-text-muted);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	transition: color .2s;
}
.eekad-news__more svg { width: 16px; height: 16px; }
.eekad-news__more:hover { color: #cdfe64; }

/* File-filter pills */
.eekad-news__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 20px;
}
.eekad-news__pill {
	appearance: none;
	border: 0;
	background: var(--c-bg-surface);
	color: var(--c-text);
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	padding: 10px 22px;
	cursor: pointer;
	transition: background .15s, color .15s;
}
.eekad-news__pill:hover {
	background: var(--c-bg-elevated);
	color: var(--c-text);
}
.eekad-news__pill.is-active {
	background: var(--c-lime);
	color: var(--c-text-on-accent);
}

.eekad-news__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: none;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}
.eekad-news__list.is-active { display: grid; }
.eekad-news__item {
	margin: 0;
}
@media (max-width: 900px) {
	.eekad-news__list { grid-template-columns: 1fr; }
}
.eekad-news__link {
	display: flex;
	gap: 20px;
	align-items: center;
	padding: 20px 24px;
	background: var(--card-bg, var(--c-bg-elevated));
	text-decoration: none;
	transition: background .2s, filter .2s;
	height: 100%;
}
.eekad-news__thumb {
	flex-shrink: 0;
	width: 140px;
	height: 94px;
	overflow: hidden;
	background: var(--c-bg-surface);
}
.eekad-news__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .3s ease;
}
.eekad-news__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 6px;
	min-width: 0;
	flex: 1;
}
.eekad-news__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	color: var(--c-text-muted);
}
.eekad-news__cat { color: var(--c-lime); font-weight: 600; font-size: 13px; }
.eekad-news__sep {
	display: inline-block;
	width: 21px;
	height: 1px;
	background: rgba(var(--c-border-rgb), .3);
}
.eekad-news__heading {
	color: var(--c-text);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eekad-news__link:hover .eekad-news__heading { color: var(--c-text); }

@media (max-width: 900px) {
	.eekad-news__list { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
	.eekad-news__pills {
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		margin-inline: -16px;
		padding-inline: 16px;
	}
	.eekad-news__pills::-webkit-scrollbar { display: none; }
	.eekad-news__pill { flex-shrink: 0; }
}
@media (max-width: 560px) {
	.eekad-news__list { grid-template-columns: 1fr; }
	.eekad-news__title { font-size: 22px; }
}
@media (max-width: 480px) {
	.eekad-news { padding-block: 48px; }
	.eekad-news__link { padding: 14px; gap: 14px; }
	.eekad-news__thumb { width: 110px; height: 74px; }
	.eekad-news__heading { font-size: 15px; }
	.eekad-news__title { font-size: 20px; }
	.eekad-news__meta { font-size: 12px; }
	.eekad-news__header { margin-bottom: 16px; }
}

/* ============================================================
   Category page — "آخر أخبار [category]" strip
   ============================================================ */

.eekad-archive__news {
	margin-block: 24px 40px;
	padding: 24px;
	background: linear-gradient(135deg, rgba(205, 254, 100, 0.04), transparent);
	border: 1px solid rgba(205, 254, 100, 0.15);
	border-radius: 0;
}
.eekad-archive__news-header { margin-bottom: 18px; }
.eekad-archive__news-title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	color: var(--c-text);
	font-size: 22px;
	font-weight: 700;
}
.eekad-archive__news-dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--archive-accent, #cdfe64);
	box-shadow: 0 0 0 4px rgba(205, 254, 100, 0.15);
}
.eekad-archive__news-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 12px;
}
.eekad-archive__news-item { margin: 0; }
.eekad-archive__news-link {
	display: flex;
	gap: 12px;
	align-items: center;
	padding: 10px;
	background: rgba(var(--c-border-rgb), 0.03);
	border: 1px solid transparent;
	border-radius: 0;
	text-decoration: none;
	transition: background 0.2s, border-color 0.2s;
}
.eekad-archive__news-link:hover {
	background: rgba(205, 254, 100, 0.06);
	border-color: rgba(205, 254, 100, 0.3);
}
.eekad-archive__news-thumb {
	flex-shrink: 0;
	width: 64px;
	height: 64px;
	border-radius: 0;
	overflow: hidden;
	background: var(--c-bg-surface);
}
.eekad-archive__news-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.eekad-archive__news-body {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	flex: 1;
}
.eekad-archive__news-time {
	font-size: 11px;
	color: var(--archive-accent, #cdfe64);
	font-weight: 600;
}
.eekad-archive__news-heading {
	color: var(--c-text);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eekad-archive__news-link:hover .eekad-archive__news-heading { color: var(--c-text); }

/* Hub-only: news count link in the hero meta row */
.eekad-archive__count--news {
	color: var(--archive-accent, #cdfe64);
	text-decoration: none;
	transition: opacity 0.2s;
}
.eekad-archive__count--news:hover { opacity: 0.75; }

/* ============================================================
   Coverage-area hub — big subcategory cards grid
   ============================================================ */
.eekad-archive__hub-subs {
	padding-block: 48px 16px;
}
.eekad-archive__hub-subs-header {
	margin-bottom: 28px;
}
.eekad-archive__hub-subs-title {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	color: var(--c-text);
	font-size: 26px;
	font-weight: 700;
}
.eekad-archive__hub-subs-accent {
	width: 4px;
	height: 24px;
	background: var(--archive-accent, #cdfe64);
}
.eekad-archive__hub-subs-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 20px;
}
.eekad-archive__hub-sub-card {
	position: relative;
	display: block;
	min-height: 220px;
	overflow: hidden;
	border-radius: 0;
	background: var(--c-bg-surface);
	text-decoration: none;
	color: var(--c-text);
	isolation: isolate;
	transition: transform 0.3s, box-shadow 0.3s;
}
.eekad-archive__hub-sub-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
}
.eekad-archive__hub-sub-bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	z-index: 0;
	transition: transform 0.6s;
}
.eekad-archive__hub-sub-card:hover .eekad-archive__hub-sub-bg {
	transform: scale(1.06);
}
.eekad-archive__hub-sub-overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(
		180deg,
		rgba(15, 17, 22, 0.35) 0%,
		rgba(15, 17, 22, 0.7) 55%,
		rgba(15, 17, 22, 0.94) 100%
	);
}
.eekad-archive__hub-sub-body {
	position: absolute;
	inset-inline-start: 24px;
	inset-inline-end: 24px;
	bottom: 24px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.eekad-archive__hub-sub-name {
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--c-text);
	transition: color 0.2s;
}
.eekad-archive__hub-sub-card:hover .eekad-archive__hub-sub-name {
	color: var(--archive-accent, #cdfe64);
}
.eekad-archive__hub-sub-count {
	font-size: 13px;
	color: var(--c-text-3);
	font-family: var(--font-mono, monospace);
}
.eekad-archive__hub-sub-arrow {
	position: absolute;
	top: 20px;
	inset-inline-end: 20px;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.55);
	border: 1px solid rgba(var(--c-border-rgb), 0.1);
	border-radius: 50%;
	color: var(--archive-accent, #cdfe64);
	z-index: 2;
	transition: background 0.2s, border-color 0.2s;
}
.eekad-archive__hub-sub-arrow svg { width: 16px; height: 16px; }
.eekad-archive__hub-sub-card:hover .eekad-archive__hub-sub-arrow {
	background: var(--archive-accent, #cdfe64);
	color: var(--c-text-on-accent);
	border-color: var(--archive-accent, #cdfe64);
}

@media (max-width: 560px) {
	.eekad-archive__hub-subs-grid { grid-template-columns: 1fr; }
	.eekad-archive__hub-sub-card { min-height: 180px; }
}

/* ============================================================
   Dedicated /news/ archive — hero + timeline of news cards
   ============================================================ */
.eekad-news-archive { padding-block: 0 80px; background: var(--c-bg-elevated); }
.eekad-news-archive__hero {
	position: relative;
	padding-block: 100px 40px;
	margin-bottom: 48px;
	background: var(--c-bg-surface);
	border-bottom: 1px solid rgba(var(--c-border-rgb), .05);
	color: var(--c-text);
	overflow: hidden;
}
.eekad-news-archive__kicker {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 16px;
	color: #cdfe64;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}
.eekad-news-archive__dot {
	width: 10px;
	height: 10px;
	background: var(--c-lime);
	box-shadow: 0 0 8px rgba(203, 255, 0, .7);
	animation: eekad-news-pulse 2s ease-in-out infinite;
}
@keyframes eekad-news-pulse {
	0%, 100% { opacity: 1; }
	50%      { opacity: .35; }
}
.eekad-news-archive__title {
	margin: 0 0 16px;
	color: var(--c-text);
	font-size: 48px;
	font-weight: 700;
	line-height: 1.15;
}
.eekad-news-archive__desc {
	max-width: 640px;
	margin: 0 0 20px;
	color: var(--c-text-3);
	font-size: 16px;
	line-height: 1.7;
}
.eekad-news-archive__meta {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: #cdfe64;
	font-family: var(--font-mono, monospace);
	font-size: 13px;
	font-weight: 600;
}
.eekad-news-archive__meta-sep {
	width: 24px;
	height: 2px;
	background: #cdfe64;
}

/* Toolbar — search + dropdown filters on one line (matches OSINT workspace) */
.eekad-news-archive__toolbar {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 48px;
	padding-bottom: 24px;
	border-bottom: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-news-archive__search {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 1;
	max-width: 420px;
	min-width: 200px;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .08);
	padding: 10px 16px;
	transition: border-color .2s;
}
.eekad-news-archive__search:focus-within {
	border-color: var(--c-lime, #CDFE64);
}
.eekad-news-archive__search-label {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	color: var(--c-text-faint);
	cursor: pointer;
}
.eekad-news-archive__search-label svg { width: 18px; height: 18px; }
.eekad-news-archive__search-input {
	flex: 1;
	min-width: 0;
	background: none;
	border: 0;
	outline: 0;
	color: var(--c-text);
	font-size: 14px;
	font-family: inherit;
	padding: 0;
	width: 100%;
}
.eekad-news-archive__search-input::placeholder { color: var(--c-text-faint); }
.eekad-news-archive__search-input::-webkit-search-cancel-button { display: none; }
.eekad-news-archive__search-clear {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	color: var(--c-text-faint);
	transition: color .2s;
}
.eekad-news-archive__search-clear:hover { color: var(--c-text); }
.eekad-news-archive__search-clear svg { width: 14px; height: 14px; }

/* Dropdown group */
.eekad-news-archive__dropdowns {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-shrink: 0;
}

@media (max-width: 768px) {
	.eekad-news-archive__toolbar { flex-direction: column; gap: 10px; }
	.eekad-news-archive__search { width: 100%; max-width: none; }
	.eekad-news-archive__dropdowns { width: 100%; }
	.eekad-news-archive__dropdowns .eekad-select-wrap { flex: 1; }
	.eekad-news-archive__dropdowns .eekad-select { width: 100%; min-width: 0; }
}

.eekad-news-archive__timeline {
	position: relative;
	padding-inline-start: 28px;
}
.eekad-news-archive__timeline::before {
	content: '';
	position: absolute;
	inset-inline-start: 4px;
	top: 6px;
	bottom: 6px;
	width: 2px;
	background: rgba(205, 254, 100, 0.12);
}
.eekad-news-archive__day { margin-bottom: 36px; }
.eekad-news-archive__day:last-child { margin-bottom: 0; }
.eekad-news-archive__day-title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 14px;
	padding: 0;
	color: var(--c-text);
	font-size: 18px;
	font-weight: 600;
	border: none;
	position: relative;
}
.eekad-news-archive__day-bullet {
	position: absolute;
	inset-inline-start: -28px;
	top: 50%;
	transform: translateY(-50%);
	width: 10px;
	height: 10px;
	background: var(--c-lime);
	box-shadow: 0 0 8px rgba(203, 255, 0, 0.5);
	z-index: 1;
}

.eekad-news-archive__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.eekad-news-archive__card {
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), 0.05);
	border-radius: 0;
	overflow: hidden;
	transition: border-color 0.2s, transform 0.2s;
}
.eekad-news-archive__card:hover {
	border-color: rgba(205, 254, 100, 0.35);
	transform: translateY(-3px);
}
.eekad-news-archive__card-media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--c-bg-surface);
}
.eekad-news-archive__card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s;
}
.eekad-news-archive__card:hover .eekad-news-archive__card-media img {
	transform: scale(1.05);
}
.eekad-news-archive__card-time {
	display: none;
	border-radius: 0;
}
.eekad-news-archive__card-body { padding: 18px; }
.eekad-news-archive__card-cat {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 8px;
	color: #cdfe64;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
.eekad-news-archive__card-cat .eekad-news-label,
.eekad-news-label {
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: none;
	color: var(--c-text-on-accent);
	background: #cdfe64;
	line-height: 1;
}
.eekad-news-archive__card-title {
	margin: 0 0 10px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.35;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eekad-news-archive__card-title a {
	color: var(--c-text);
	text-decoration: none;
	transition: color 0.2s;
}
.eekad-news-archive__card:hover .eekad-news-archive__card-title a { color: #cdfe64; }
.eekad-news-archive__card-excerpt {
	margin: 0;
	color: var(--c-text-3);
	font-size: 14px;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.eekad-news-archive__empty {
	padding: 60px 0;
	color: var(--c-text-muted);
	text-align: center;
	font-size: 16px;
}

.eekad-news-archive__pagination {
	margin-top: 48px;
	padding-top: 32px;
	border-top: 1px solid rgba(var(--c-border-rgb), 0.08);
}
.eekad-news-archive__pagination ul {
	display: flex;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
	justify-content: center;
}
.eekad-news-archive__pagination a,
.eekad-news-archive__pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 14px;
	background: var(--c-bg-surface);
	color: var(--c-text-2);
	font-size: 14px;
	font-weight: 600;
	border-radius: 0;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}
.eekad-news-archive__pagination a:hover {
	background: rgba(205, 254, 100, 0.1);
	color: #cdfe64;
}
.eekad-news-archive__pagination .current {
	background: #cdfe64;
	color: var(--c-text-on-accent);
}

@media (max-width: 900px) {
	.eekad-news-archive__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
	.eekad-news-archive__hero { padding-block: 80px 28px; }
	.eekad-news-archive__title { font-size: 32px; }
	.eekad-news-archive__grid { grid-template-columns: 1fr; }
}

/* --- News archive: map / list view toggle --- */
.eekad-news-archive__view-toggle {
	display: flex;
	gap: 0;
	margin-block-end: 24px;
	border: 1px solid rgba(var(--c-border-rgb), .1);
	width: fit-content;
}
.eekad-news-archive__view-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 18px;
	font-size: 13px;
	font-family: var(--font-sans);
	font-weight: 600;
	background: none;
	border: none;
	color: var(--c-text-muted);
	cursor: pointer;
	transition: background .2s, color .2s;
}
.eekad-news-archive__view-btn:not(:last-child) {
	border-inline-end: 1px solid rgba(var(--c-border-rgb), .1);
}
.eekad-news-archive__view-btn:hover {
	color: var(--c-text);
	background: rgba(var(--c-border-rgb), .04);
}
.eekad-news-archive__view-btn.is-active {
	color: var(--c-lime);
	background: rgba(205, 254, 100, .08);
}
.eekad-news-archive__view-btn svg {
	flex-shrink: 0;
}

/* --- News map container --- */
.eekad-news-archive__map-wrap {
	margin-block-end: 32px;
}
.eekad-news-archive__map {
	width: 100%;
	height: 500px;
	background: var(--c-bg-alt);
}

/* --- Mapbox popup overrides --- */
.eekad-mapbox-popup .mapboxgl-popup-content {
	background: var(--c-bg-elevated);
	color: var(--c-text);
	padding: 0;
	overflow: hidden;
}
.eekad-mapbox-popup .mapboxgl-popup-close-button {
	color: var(--c-text-muted);
	font-size: 18px;
	padding: 4px 8px;
}
.eekad-mapbox-popup .mapboxgl-popup-tip {
	border-top-color: var(--c-bg-elevated);
}
.eekad-map-popup img {
	width: 100%;
	height: 120px;
	object-fit: cover;
	display: block;
}
.eekad-map-popup__body {
	padding: 10px 14px 12px;
}
.eekad-map-popup__cat {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--c-lime);
	margin-block-end: 4px;
}
.eekad-map-popup__title {
	display: block;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--c-text);
	text-decoration: none;
	margin-block-end: 4px;
}
.eekad-map-popup__title:hover {
	color: var(--c-lime);
}
.eekad-map-popup__date {
	font-size: 11px;
	color: var(--c-text-faint);
}

@media (max-width: 768px) {
	.eekad-news-archive__map {
		height: 350px;
	}
}

/* =============================================================
 * Verifications archive — /verifications/
 * Top: file filter tabs + three editor-picked cards per file.
 * Bottom: newest-first grid of every verification, paginated.
 * Cards reuse the homepage .eekad-verify__card language via a
 * --grid modifier that unlocks the fixed rail width.
 * =========================================================== */
.eekad-verify-archive__featured {
	margin-block: 40px 72px;
}
.eekad-verify-archive__featured-header {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	margin-bottom: 32px;
	padding-bottom: 24px;
	border-bottom: 1px solid rgba(var(--c-border-rgb), 0.06);
}
.eekad-verify-archive__featured-heading {
	margin: 0;
	font-size: 28px;
	font-weight: 700;
	color: var(--c-text);
}
.eekad-verify-archive__filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}
.eekad-verify-archive__tab {
	display: inline-flex;
	align-items: center;
	padding: 10px 18px;
	background: var(--c-bg-surface);
	color: var(--c-text-2);
	font-size: 14px;
	font-weight: 600;
	border: 1px solid rgba(var(--c-border-rgb), 0.06);
	cursor: pointer;
	transition: all 0.2s ease;
	font-family: inherit;
}
.eekad-verify-archive__tab:hover {
	background: rgba(205, 254, 100, 0.08);
	color: #cdfe64;
	border-color: rgba(205, 254, 100, 0.25);
}
.eekad-verify-archive__tab.is-active {
	background: #cdfe64;
	color: var(--c-text-on-accent);
	border-color: #cdfe64;
}

.eekad-verify-archive__featured-rail {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.eekad-verify-archive__featured-rail[hidden] { display: none; }
.eekad-verify-archive__featured-rail:not(.is-active) { display: none; }

.eekad-verify-archive__recent-heading {
	margin: 0 0 32px;
	font-size: 28px;
	font-weight: 700;
	color: var(--c-text);
	padding-bottom: 16px;
	border-bottom: 1px solid rgba(var(--c-border-rgb), 0.06);
}

.eekad-verify-archive__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin-bottom: 56px;
}

/* Grid-mode override for the homepage verify card: lose the fixed
   width from the rail, fit whatever grid cell it lands in, and
   slightly shorter for archive density. */
.eekad-verify__card--grid {
	flex: initial;
	width: 100%;
	height: 520px;
}
.eekad-verify__card--grid .eekad-verify__sticker {
	width: 168px;
	bottom: 198px;
}

@media (max-width: 960px) {
	.eekad-verify-archive__featured-rail,
	.eekad-verify-archive__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 640px) {
	.eekad-verify-archive__featured-rail,
	.eekad-verify-archive__grid {
		grid-template-columns: 1fr;
	}
	.eekad-verify__card--grid {
		max-width: 420px;
		margin-inline: auto;
	}
}

/* =============================================================
 * Verification submit form
 * =========================================================== */
.eekad-verify-submit__notice {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 24px;
	margin-block-end: 24px;
	font-size: 15px;
	font-weight: 600;
	color: var(--c-text-on-accent);
	background: #cdfe64;
}
.eekad-verify-submit__notice svg {
	width: 22px;
	height: 22px;
	flex-shrink: 0;
}

.eekad-verify-submit {
	margin-block: 64px 72px;
	padding: 48px;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-verify-submit__inner {
	display: grid;
	grid-template-columns: 1fr 1.6fr;
	gap: 48px;
	align-items: start;
}
.eekad-verify-submit__intro {
	position: sticky;
	top: 100px;
}
.eekad-verify-submit__title {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 16px;
	font-size: 26px;
	font-weight: 700;
	color: var(--c-text);
}
.eekad-verify-submit__icon {
	width: 28px;
	height: 28px;
	color: #cdfe64;
	flex-shrink: 0;
}
.eekad-verify-submit__desc {
	margin: 0;
	font-size: 15px;
	line-height: 1.75;
	color: var(--c-text-3);
}

/* Trust badges */
.eekad-verify-submit__badges {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-block-start: 28px;
	padding-block-start: 24px;
	border-block-start: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-verify-submit__badge {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 14px;
	font-weight: 500;
	color: var(--c-text-3);
}
.eekad-verify-submit__badge svg {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	color: #cdfe64;
}

/* How it works steps */
.eekad-verify-submit__steps {
	list-style: none;
	margin: 24px 0 0;
	padding: 24px 0 0;
	border-block-start: 1px solid rgba(var(--c-border-rgb), .06);
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.eekad-verify-submit__steps li {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 14px;
	font-weight: 500;
	color: var(--c-text-3);
}
.eekad-verify-submit__step-num {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 700;
	color: #cdfe64;
	border: 1px solid rgba(205, 254, 100, .25);
	background: rgba(205, 254, 100, .06);
}

/* --- Form fields --- */
.eekad-verify-submit__form {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.eekad-verify-submit__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}
.eekad-verify-submit__field {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.eekad-verify-submit__field label {
	font-size: 13px;
	font-weight: 600;
	color: var(--c-text-2);
	letter-spacing: .01em;
}
.eekad-verify-submit__field input,
.eekad-verify-submit__field textarea {
	padding: 12px 16px;
	background: rgba(var(--c-border-rgb), .04);
	border: 1px solid rgba(var(--c-border-rgb), .1);
	color: var(--c-text);
	font-size: 15px;
	font-family: inherit;
	line-height: 1.6;
	transition: border-color .2s, background .2s;
	resize: vertical;
}
.eekad-verify-submit__field input::placeholder,
.eekad-verify-submit__field textarea::placeholder {
	color: var(--c-text-faint);
}
.eekad-verify-submit__field input:focus,
.eekad-verify-submit__field textarea:focus {
	outline: none;
	border-color: rgba(205, 254, 100, .4);
	background: rgba(205, 254, 100, .04);
}

/* --- Submit button --- */
.eekad-verify-submit__btn {
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	gap: 8px;
	padding: 12px 28px;
	font-size: 15px;
	font-weight: 700;
	font-family: inherit;
	color: var(--c-text-on-accent);
	background: #cdfe64;
	border: 1px solid #cdfe64;
	cursor: pointer;
	transition: background .2s, border-color .2s, transform .2s;
}
.eekad-verify-submit__btn svg {
	width: 18px;
	height: 18px;
}
.eekad-verify-submit__btn:hover {
	background: #CDFE64;
	border-color: #CDFE64;
	transform: translateY(-1px);
}

@media (max-width: 860px) {
	.eekad-verify-submit { padding: 32px 24px; }
	.eekad-verify-submit__inner {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.eekad-verify-submit__intro { position: static; }
	.eekad-verify-submit__stats { justify-content: center; }
	.eekad-verify-submit__row { grid-template-columns: 1fr; }
}

/* Floating "submit claim" icon — matches investigation sidebar
   style: dark bg, lime border, icon-only with hover tooltip. */
.eekad-verify-fab {
	position: fixed;
	inset-inline-end: 24px;
	bottom: 40px;
	z-index: 900;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: var(--c-bg-elevated);
	border: 1px solid rgba(205, 254, 100, .35);
	color: var(--c-lime);
	transition: border-color .2s ease, background .2s ease, opacity .35s ease, transform .35s ease;
}
.eekad-verify-fab svg {
	width: 22px;
	height: 22px;
}
.eekad-verify-fab__label {
	position: absolute;
	inset-inline-end: calc(100% + 10px);
	top: 50%;
	transform: translateY(-50%);
	white-space: nowrap;
	background: var(--c-bg-elevated);
	border: 1px solid rgba(205, 254, 100, .35);
	color: var(--c-lime);
	font-size: 13px;
	font-weight: 700;
	padding: 8px 14px;
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s ease;
}
.eekad-verify-fab:hover .eekad-verify-fab__label {
	opacity: 1;
}
.eekad-verify-fab:hover {
	border-color: var(--c-lime);
	background: var(--c-bg-alt);
	color: var(--c-lime);
}
.eekad-verify-fab.is-hidden {
	opacity: 0;
	pointer-events: none;
	transform: translateY(20px);
}
@media (max-width: 768px) {
	.eekad-verify-fab {
		inset-inline-end: 16px;
		bottom: 20px;
	}
}

/* =============================================================
 * Single post — articles, fact-checks, reports
 * =========================================================== */
.eekad-single {
	background: var(--c-bg-elevated);
	min-height: 100vh;
}

/* --- Header (no cover block) --- */
.eekad-single__header {
	position: relative;
	padding: 80px 0 40px;
	background: var(--c-bg-surface);
}
.eekad-single__header.has-cover {
	min-height: 70vh;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
}
.eekad-single__header-media {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.eekad-single__header-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.eekad-single__header-overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(var(--c-bg-surface-rgb), .3) 0%, rgba(var(--c-bg-surface-rgb), .5) 40%, rgba(var(--c-bg-surface-rgb), .9) 100%);
}
.eekad-single__header-inner {
	position: relative;
	z-index: 2;
}
.eekad-single__breadcrumb {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 20px;
	font-family: var(--font-mono, monospace);
	font-size: 13px;
}
.eekad-single__breadcrumb a {
	color: var(--c-lime);
	text-decoration: none;
}
.eekad-single__breadcrumb a:hover {
	text-decoration: underline;
}
.eekad-single__breadcrumb-sep {
	color: var(--c-text-faint);
}
.eekad-single__title {
	font-family: var(--font-sans);
	font-size: clamp(28px, 4vw, 48px);
	font-weight: 700;
	line-height: 1.25;
	color: var(--c-text);
	margin: 0 0 16px;
}
.eekad-single__meta {
	font-family: var(--font-mono, monospace);
	font-size: 13px;
	color: var(--c-text-muted);
}

/* --- Post body --- */
.eekad-single__body {
	max-width: 780px;
	margin: 0 auto;
	padding: 0 24px 64px;
}
.eekad-single__body > p {
	font-family: var(--font-sans);
	font-size: var(--fs-article);
	font-weight: 400;
	line-height: 1.8;
	color: var(--c-text-3);
	margin: 0 0 20px;
}
.eekad-single__body > p:first-of-type {
	font-size: var(--fs-article);
}

/* Let investigation blocks inside posts break out of the narrow column */
.eekad-single__body .eekad-iv-cover {
	margin-inline: calc(-50vw + 50%);
	width: 100vw;
}
.eekad-single__body .eekad-iv-ba.is-wide {
	margin-inline: -60px;
	width: calc(100% + 120px);
}

/* --- OSINT intel section --- */
.eekad-single__intel {
	background: var(--c-bg-alt);
	padding: 64px 0;
	border-top: 1px solid rgba(var(--c-border-rgb),.06);
}
.eekad-single__intel-title {
	font-family: var(--font-sans);
	font-size: 22px;
	font-weight: 600;
	color: var(--c-text);
	margin: 0 0 24px;
	display: flex;
	align-items: center;
	gap: 12px;
}
.eekad-single__intel-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	height: 28px;
	padding: 0 8px;
	background: rgba(205,254,100,.12);
	color: var(--c-lime);
	font-family: var(--font-mono);
	font-size: 13px;
	font-weight: 600;
	border-radius: 0;
}

/* Entity chips */
.eekad-single__entities {
	margin-bottom: 48px;
}
.eekad-single__entities-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.eekad-single__entity {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb),.06);
	color: var(--c-text);
	text-decoration: none;
	font-size: 14px;
	transition: border-color .15s;
}
.eekad-single__entity:hover {
	border-color: var(--c-lime);
}
.eekad-single__entity-schema {
	font-family: var(--font-mono);
	font-size: 11px;
	color: var(--c-text-muted);
	letter-spacing: .05em;
}
.eekad-single__entity-name {
	font-weight: 500;
}

/* Relationships */
.eekad-single__rel-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.eekad-single__rel {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	background: var(--c-bg-surface);
	border: 1px solid rgba(var(--c-border-rgb),.06);
}
.eekad-single__rel-edge {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1;
	min-width: 0;
}
.eekad-single__rel-node {
	font-size: 14px;
	font-weight: 500;
	color: var(--c-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.eekad-single__rel-arrow {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}
.eekad-single__rel-arrow::before,
.eekad-single__rel-arrow::after {
	content: "";
	width: 20px;
	height: 1px;
	background: var(--c-text-faint);
}
.eekad-single__rel-type {
	font-family: var(--font-mono);
	font-size: 11px;
	color: #60a5fa;
	white-space: nowrap;
	padding: 2px 8px;
	background: rgba(96,165,250,.1);
	border-radius: 0;
}
.eekad-single__rel-role {
	font-size: 12px;
	color: var(--c-text-muted);
	flex-shrink: 0;
}
.eekad-single__rel-conf {
	font-family: var(--font-mono);
	font-size: 12px;
	color: var(--c-lime);
	flex-shrink: 0;
}

/* --- Single post mobile --- */
@media (max-width: 768px) {
	.eekad-single__header { padding: 48px 0 24px; }
	.eekad-single__title { font-size: 24px; }
	.eekad-single__body { padding: 0 16px 48px; }
	.eekad-single__body > p {
		font-size: var(--fs-article-mobile);
	}
	.eekad-single__body .eekad-iv-ba.is-wide {
		margin-inline: -16px;
		width: calc(100% + 32px);
	}
	.eekad-single__intel { padding: 40px 0; }
	.eekad-single__rel {
		flex-direction: column;
		align-items: flex-start;
	}
	.eekad-single__rel-edge {
		flex-wrap: wrap;
	}
}

/* =================================================================
   Evidence Drawer — المرفقات والأدلة
   Sticky FAB + slide-out panel + lightbox for article media.
   ================================================================= */

/* ── Action Dock (vertical icon bar) ───────────────────── */
.eekad-action-dock {
	position: fixed;
	bottom: 28px;
	left: 28px;
	z-index: 1000;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 6px;
	background: rgba(var(--c-bg-base-rgb), .25);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid rgba(205, 254, 100, .15);
	animation: eekad-dock-in .5s cubic-bezier(.16, 1, .3, 1) both;
	transition: opacity .25s, transform .25s;
}
.eekad-action-dock.is-hidden {
	opacity: 0;
	pointer-events: none;
	transform: translateY(20px);
}
.eekad-action-dock__btn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: none;
	color: var(--c-lime);
	border: none;
	border-radius: 0;
	cursor: pointer;
	transition: color .2s, opacity .2s;
	opacity: .7;
}
.eekad-action-dock__btn:hover {
	opacity: 1;
}
.eekad-action-dock__btn + .eekad-action-dock__btn {
	border-top: none;
}
.eekad-action-dock__btn svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	flex-shrink: 0;
}
/* Tooltip */
.eekad-action-dock__btn::after {
	content: attr(data-tooltip);
	position: absolute;
	left: calc(100% + 10px);
	top: 50%;
	transform: translateY(-50%) translateX(-4px);
	padding: 5px 12px;
	background: rgba(var(--c-bg-base-rgb), .9);
	border: 1px solid rgba(var(--c-border-rgb), .08);
	color: var(--c-lime);
	font-family: var(--font-sans);
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
	pointer-events: none;
	opacity: 0;
	transition: opacity .15s, transform .15s;
}
.eekad-action-dock__btn:hover::after {
	opacity: 1;
	transform: translateY(-50%) translateX(0);
}
/* Label strip — hidden, dock is icon-only */
.eekad-action-dock__label { display: none; }
@keyframes eekad-dock-in {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}
@media (max-width: 600px) {
	.eekad-action-dock {
		bottom: 16px;
		left: 16px;
	}
	.eekad-action-dock__btn::after {
		display: none;
	}
}

/* ── Drawer panel ──────────────────────────────────────── */
.eekad-evidence-drawer {
	position: fixed;
	inset: 0;
	z-index: 10000;
	pointer-events: none;
	visibility: hidden;
}
.eekad-evidence-drawer.is-open {
	pointer-events: auto;
	visibility: visible;
}
.eekad-evidence-drawer__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .6);
	opacity: 0;
	transition: opacity .3s ease;
}
.eekad-evidence-drawer.is-open .eekad-evidence-drawer__backdrop {
	opacity: 1;
}
.eekad-evidence-drawer__panel {
	position: absolute;
	top: 0;
	right: 0;
	width: 520px;
	max-width: 90vw;
	height: 100%;
	background: var(--c-bg-alt);
	border-inline-start: 1px solid rgba(var(--c-border-rgb), .06);
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform .35s cubic-bezier(.16, 1, .3, 1);
	overflow: hidden;
}
[dir="rtl"] .eekad-evidence-drawer__panel {
	right: auto;
	left: 0;
	transform: translateX(-100%);
	border-inline-start: none;
	border-inline-end: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-evidence-drawer.is-open .eekad-evidence-drawer__panel {
	transform: translateX(0);
}
.eekad-evidence-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 24px;
	border-block-end: 1px solid rgba(var(--c-border-rgb), .06);
	flex-shrink: 0;
}
.eekad-evidence-drawer__title {
	font-family: var(--font-sans);
	font-size: 16px;
	font-weight: 700;
	color: var(--c-text);
	margin: 0;
	display: flex;
	align-items: center;
	gap: 10px;
}
.eekad-evidence-drawer__count {
	background: rgba(var(--c-border-rgb), .08);
	color: var(--c-text-muted);
	font-size: 11px;
	font-weight: 600;
	min-width: 22px;
	height: 22px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 6px;
	letter-spacing: .04em;
}
.eekad-evidence-drawer__close {
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(var(--c-border-rgb), .04);
	border: 1px solid rgba(var(--c-border-rgb), .08);
	border-radius: 0;
	color: var(--c-text);
	cursor: pointer;
	transition: background .15s;
}
.eekad-evidence-drawer__close:hover {
	background: rgba(var(--c-border-rgb), .1);
}
.eekad-evidence-drawer__close svg {
	width: 18px;
	height: 18px;
}

/* ── Grid ──────────────────────────────────────────────── */
.eekad-evidence-drawer__grid {
	flex: 1 1 0;
	min-height: 0;
	overflow-y: auto;
	padding: 20px;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-auto-rows: min-content;
	gap: 12px;
}
.eekad-evidence-drawer__card {
	display: flex;
	flex-direction: column;
	background: rgba(var(--c-border-rgb), .03);
	border: 1px solid rgba(var(--c-border-rgb), .06);
	border-radius: 0;
	cursor: pointer;
	overflow: hidden;
	transition: border-color .2s, transform .2s;
	text-align: start;
	padding: 0;
	color: inherit;
	font: inherit;
}
.eekad-evidence-drawer__card:hover {
	border-color: rgba(var(--c-border-rgb), .25);
	transform: translateY(-2px);
}
.eekad-evidence-drawer__thumb {
	width: 100%;
	min-height: 130px;
	flex-shrink: 0;
	overflow: hidden;
	background: rgba(0, 0, 0, .3);
}
.eekad-evidence-drawer__thumb img {
	width: 100%;
	height: 130px;
	object-fit: cover;
	display: block;
}
.eekad-evidence-drawer__thumb--embed {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--c-text-muted);
}
.eekad-evidence-drawer__thumb--embed svg {
	width: 32px;
	height: 32px;
}
.eekad-evidence-drawer__type {
	display: inline-block;
	margin: 8px 10px 0;
	padding: 2px 8px;
	background: rgba(var(--c-border-rgb), .06);
	color: var(--c-text-muted);
	border: 1px solid rgba(var(--c-border-rgb), .08);
	font-family: var(--font-sans);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .04em;
	align-self: flex-start;
}
.eekad-evidence-drawer__caption {
	display: block;
	padding: 6px 10px 10px;
	font-size: 12px;
	color: var(--c-text-muted);
	line-height: 1.5;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ── Lightbox ──────────────────────────────────────────── */
.eekad-evidence-lightbox {
	position: fixed;
	inset: 0;
	z-index: 10001;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	visibility: hidden;
}
.eekad-evidence-lightbox.is-open {
	pointer-events: auto;
	visibility: visible;
}
.eekad-evidence-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .92);
	opacity: 0;
	transition: opacity .25s;
}
.eekad-evidence-lightbox.is-open .eekad-evidence-lightbox__backdrop {
	opacity: 1;
}
.eekad-evidence-lightbox__content {
	position: relative;
	z-index: 1;
	max-width: 90vw;
	max-height: 85vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	opacity: 0;
	transform: scale(.95);
	transition: opacity .25s, transform .25s;
}
.eekad-evidence-lightbox.is-open .eekad-evidence-lightbox__content {
	opacity: 1;
	transform: scale(1);
}
.eekad-evidence-lightbox__img {
	max-width: 90vw;
	max-height: 80vh;
	object-fit: contain;
	display: block;
}
.eekad-evidence-lightbox__caption {
	margin-top: 12px;
	font-family: var(--font-sans);
	font-size: 14px;
	color: var(--c-text-2);
	text-align: center;
	max-width: 600px;
}
.eekad-evidence-lightbox__close {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 2;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(var(--c-border-rgb), .08);
	border: 1px solid rgba(var(--c-border-rgb), .12);
	border-radius: 0;
	color: var(--c-text);
	cursor: pointer;
	transition: background .15s;
}
.eekad-evidence-lightbox__close:hover {
	background: rgba(var(--c-border-rgb), .18);
}
.eekad-evidence-lightbox__close svg {
	width: 22px;
	height: 22px;
}
.eekad-evidence-lightbox__prev,
.eekad-evidence-lightbox__next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(var(--c-border-rgb), .06);
	border: 1px solid rgba(var(--c-border-rgb), .1);
	border-radius: 0;
	color: var(--c-text);
	cursor: pointer;
	transition: background .15s;
}
.eekad-evidence-lightbox__prev:hover,
.eekad-evidence-lightbox__next:hover {
	background: rgba(var(--c-border-rgb), .15);
}
.eekad-evidence-lightbox__prev svg,
.eekad-evidence-lightbox__next svg {
	width: 24px;
	height: 24px;
}
.eekad-evidence-lightbox__prev {
	left: 20px;
}
.eekad-evidence-lightbox__next {
	right: 20px;
}
.eekad-evidence-lightbox__counter {
	position: absolute;
	top: 24px;
	left: 50%;
	transform: translateX(-50%);
	font-family: var(--font-sans);
	font-size: 13px;
	color: var(--c-text-muted);
	z-index: 2;
}
.eekad-evidence-lightbox__locate {
	position: absolute;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	background: rgba(var(--c-border-rgb), .08);
	border: 1px solid rgba(var(--c-border-rgb), .12);
	border-radius: 0;
	color: var(--c-lime);
	font-family: var(--font-sans);
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s;
}
.eekad-evidence-lightbox__locate:hover {
	background: rgba(205, 254, 100, .12);
}
.eekad-evidence-lightbox__locate svg {
	width: 16px;
	height: 16px;
}

/* ── Responsive ────────────────────────────────────────── */
@media (max-width: 600px) {
	.eekad-action-dock__btn {
		font-size: 11px;
		padding: 8px 14px;
	}
	.eekad-evidence-drawer__panel {
		width: 100vw;
		max-width: 100vw;
	}
	.eekad-evidence-drawer__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 8px;
		padding: 12px;
	}
	.eekad-evidence-lightbox__prev,
	.eekad-evidence-lightbox__next {
		width: 40px;
		height: 40px;
	}
	.eekad-evidence-lightbox__prev { left: 8px; }
	.eekad-evidence-lightbox__next { right: 8px; }
	.eekad-evidence-lightbox__locate {
		bottom: 16px;
		font-size: 11px;
	}
}

/* Scrollbar in drawer */
.eekad-evidence-drawer__grid::-webkit-scrollbar {
	width: 4px;
}
.eekad-evidence-drawer__grid::-webkit-scrollbar-track {
	background: transparent;
}
.eekad-evidence-drawer__grid::-webkit-scrollbar-thumb {
	background: rgba(var(--c-border-rgb), .1);
}

/* =============================================================
 * Shared pill row — staggered reveal animation
 * =============================================================
 * Adding .eekad-pill-row to ANY flex/inline container is enough —
 * pills.js stamps each direct child with a --pill-delay based on its
 * index, then adds .is-revealed once the row enters the viewport, and
 * the CSS below transitions every child in sequence.
 *
 * The visual look of each pill is still owned by its section's own
 * class (eekad-news__pill, eekad-archive__sub-pill, etc.) — we only
 * touch opacity + transform here so we never fight section styling.
 *
 * For NEW pill rows without their own styling, add .eekad-pill to
 * each child to pick up the shared look too.
 */
.eekad-pill-row > * {
	opacity: 0;
	transform: translateY(14px) scale(.94);
	transition:
		opacity .6s cubic-bezier(.22, 1, .36, 1),
		transform .6s cubic-bezier(.22, 1, .36, 1);
	transition-delay: var(--pill-delay, 0ms);
	will-change: opacity, transform;
}
.eekad-pill-row.is-revealed > * {
	opacity: 1;
	transform: translateY(0) scale(1);
}
@media (prefers-reduced-motion: reduce) {
	.eekad-pill-row > * {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* --- Base look for unstyled pill rows (opt-in) --- */
.eekad-pill {
	appearance: none;
	border: 0;
	background: var(--c-bg-surface);
	color: var(--c-text);
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	padding: 10px 22px;
	cursor: pointer;
	line-height: 1.2;
	transition: background .18s ease, color .18s ease;
}
.eekad-pill:hover {
	background: var(--c-bg-elevated);
	color: var(--c-text);
}
.eekad-pill.is-active {
	background: var(--c-lime);
	color: var(--c-text-on-accent);
}

/* =============================================================
 * Homepage "قاعدة بيانات" — unified intelligence-device preview
 * =============================================================
 * One framed device: title on top, toolbar with tab switcher + primary
 * CTA, a single stage that swaps between live network graph (default)
 * and a rich entity grid, and a monospace status strip at the bottom.
 * HUD-style corner brackets frame the device for a console feel.
 *
 * Bound to one admin-picked eekad_file term at a time — namespaced so
 * nothing collides with the OSINT workspace or the standalone network
 * map on other pages.
 */
.eekad-home-db {
	color: var(--c-text);
	padding-block: 80px;
	position: relative;
	overflow: hidden;
}
.eekad-home-db__wrap {
	position: relative;
	max-width: 1280px;
	margin-inline: auto;
	padding-inline: 32px;
	display: flex;
	flex-direction: column;
	gap: 28px;
}

/* --- Lead: title + description --- */
.eekad-home-db__lead {
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: flex-start;
}
.eekad-home-db__title {
	margin: 0;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.1;
}
.eekad-home-db__title-kicker { padding-inline: 4px; color: var(--c-text); }

/* --- Device frame --- */
.eekad-home-db__device {
	position: relative;
	background: var(--card-bg, var(--c-bg-base));
	border: 1px solid rgba(var(--c-border-rgb), .08);
	display: flex;
	flex-direction: column;
}

/* HUD corner brackets */
.eekad-home-db__corner {
	position: absolute;
	width: 18px;
	height: 18px;
	border-color: var(--c-lime);
	border-style: solid;
	pointer-events: none;
}
.eekad-home-db__corner--tl { top: -1px; left: -1px;    border-width: 2px 0 0 2px; transform-origin: top left; }
.eekad-home-db__corner--tr { top: -1px; right: -1px;   border-width: 2px 2px 0 0; transform-origin: top right; }
.eekad-home-db__corner--bl { bottom: -1px; left: -1px; border-width: 0 0 2px 2px; transform-origin: bottom left; }
.eekad-home-db__corner--br { bottom: -1px; right: -1px;border-width: 0 2px 2px 0; transform-origin: bottom right; }

/* --- Reveal choreography.
   JS adds `is-armed` on load (if IntersectionObserver + no reduced
   motion), which puts the device in its "off" state. When the device
   enters the viewport, JS adds `is-revealed` and the sequence plays
   once: corners lock in with stagger, top scanline draws across,
   content reveals top-down via clip-path, a single vertical scan
   sweep finishes the motion. Status counters tick via JS.

   No-JS / reduced-motion users never get `is-armed`, so the device
   renders in its final state immediately. */
.eekad-home-db__scanline,
.eekad-home-db__scan-sweep {
	position: absolute;
	left: 0;
	right: 0;
	pointer-events: none;
	z-index: 5;
	opacity: 0;
}
.eekad-home-db__scanline {
	top: -1px;
	height: 1px;
	background: var(--c-lime);
	transform: scaleX(0);
	transform-origin: center;
	box-shadow: 0 0 12px rgba(205, 254, 100, .7);
}
.eekad-home-db__scan-sweep {
	top: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent 0%, rgba(205, 254, 100, .55) 50%, transparent 100%);
}

/* Armed (pre-reveal) state — hide content that's about to animate in. */
.eekad-home-db__device.is-armed .eekad-home-db__corner {
	transform: scale(0);
	opacity: 0;
}
.eekad-home-db__device.is-armed .eekad-home-db__devhead,
.eekad-home-db__device.is-armed .eekad-home-db__toolbar,
.eekad-home-db__device.is-armed .eekad-home-db__stage,
.eekad-home-db__device.is-armed .eekad-home-db__status {
	clip-path: inset(0 0 100% 0);
	opacity: 0;
}

/* Revealed — play each beat with its delay.
   Middle-ground pacing: fast enough to feel responsive, slow enough
   that each beat registers as its own moment. Total runtime ~2.1s. */
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__scanline {
	animation: eekad-db-scan-draw 750ms cubic-bezier(.16, 1, .3, 1) forwards;
}
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__corner {
	animation: eekad-db-corner-in 600ms cubic-bezier(.16, 1, .3, 1) forwards;
}
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__corner--tl { animation-delay: 120ms; }
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__corner--tr { animation-delay: 220ms; }
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__corner--bl { animation-delay: 320ms; }
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__corner--br { animation-delay: 420ms; }

.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__devhead {
	animation: eekad-db-reveal 800ms cubic-bezier(.16, 1, .3, 1) 420ms forwards;
}
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__toolbar {
	animation: eekad-db-reveal 800ms cubic-bezier(.16, 1, .3, 1) 620ms forwards;
}
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__stage {
	animation: eekad-db-reveal 800ms cubic-bezier(.16, 1, .3, 1) 780ms forwards;
}
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__status {
	animation: eekad-db-reveal 800ms cubic-bezier(.16, 1, .3, 1) 950ms forwards;
}
.eekad-home-db__device.is-armed.is-revealed .eekad-home-db__scan-sweep {
	animation: eekad-db-sweep 1450ms cubic-bezier(.4, 0, .2, 1) 700ms forwards;
}

@keyframes eekad-db-corner-in {
	from { transform: scale(0); opacity: 0; }
	to   { transform: scale(1); opacity: 1; }
}
@keyframes eekad-db-reveal {
	from { clip-path: inset(0 0 100% 0); opacity: 0; }
	to   { clip-path: inset(0 0 0 0);    opacity: 1; }
}
@keyframes eekad-db-scan-draw {
	0%   { transform: scaleX(0); opacity: 0; }
	10%  { opacity: 1; }
	70%  { transform: scaleX(1); opacity: 1; }
	100% { transform: scaleX(1); opacity: 0; }
}
@keyframes eekad-db-sweep {
	0%   { top: 0;    opacity: 0; }
	15%  { opacity: .5; }
	85%  { opacity: .5; }
	100% { top: 100%; opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.eekad-home-db__device.is-armed,
	.eekad-home-db__device.is-armed * {
		animation: none !important;
		clip-path: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}

/* --- Device header: file readout.
   Two-line layout: name + ID on one row (ID sits on the far edge,
   baseline-aligned with the title), description on the second row. */
.eekad-home-db__devhead {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 22px 24px 20px;
	background: var(--card-bg, var(--c-bg-surface));
	border-bottom: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-home-db__devhead-heading {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
}
.eekad-home-db__devhead-name {
	margin: 0;
	color: var(--c-text);
	font-size: 36px;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.005em;
}
.eekad-home-db__devhead-id {
	flex-shrink: 0;
	font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
	font-size: 12px;
	color: var(--c-text-muted);
	letter-spacing: .08em;
}
.eekad-home-db__devhead-desc {
	margin: 0;
	max-width: 780px;
	color: var(--c-text-2);
	font-size: 15px;
	line-height: 1.65;
}

/* --- Toolbar: tabs + CTA --- */
.eekad-home-db__toolbar {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	gap: 16px;
	padding: 14px 16px;
	border-bottom: 1px solid rgba(var(--c-border-rgb), .06);
	background: var(--card-bg, var(--c-bg-surface));
}
.eekad-home-db__tabs {
	display: flex;
	gap: 4px;
}
.eekad-home-db__tab {
	appearance: none;
	border: 0;
	background: transparent;
	color: var(--c-text-3);
	font-family: inherit;
	font-weight: 600;
	font-size: 15px;
	line-height: 1;
	padding: 12px 16px;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	position: relative;
	transition: color .2s ease, background .2s ease;
}
.eekad-home-db__tab svg { width: 16px; height: 16px; opacity: .75; }
.eekad-home-db__tab:hover { color: var(--c-text); background: rgba(var(--c-border-rgb), .03); }
.eekad-home-db__tab.is-active {
	color: var(--c-lime);
	background: rgba(203, 255, 0, .06);
}
.eekad-home-db__tab.is-active svg { opacity: 1; }
.eekad-home-db__tab.is-active::after {
	content: '';
	position: absolute;
	left: 10px; right: 10px;
	bottom: -1px;
	height: 2px;
	background: var(--c-lime);
}
.eekad-home-db__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	background: transparent;
	color: var(--c-text);
	font-weight: 600;
	font-size: 13px;
	text-decoration: none;
	border: 1px solid rgba(var(--c-border-rgb), .12);
	transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.eekad-home-db__cta:hover {
	color: var(--c-lime);
	border-color: rgba(203, 255, 0, .5);
	background: rgba(203, 255, 0, .04);
}
.eekad-home-db__cta svg { width: 14px; height: 14px; opacity: .7; transition: opacity .2s ease; }
.eekad-home-db__cta:hover svg { opacity: 1; }

/* --- Stage: the big canvas area.
   Matches the section background (Ink) so graph/entities/map read
   as one continuous surface with the outer section. */
.eekad-home-db__stage {
	position: relative;
	background: var(--section-bg, var(--c-bg-alt));
	min-height: 336px;
}
/* The device frame already shows HUD brackets — hide the map's own pair. */
.eekad-home-db__map .eekad-network-map__canvas::after { display: none; }
.eekad-home-db__view { display: none; }
.eekad-home-db__view.is-active { display: block; }
.eekad-home-db__view { animation: eekad-home-db-fade .35s ease both; }
@keyframes eekad-home-db-fade {
	from { opacity: 0; transform: translateY(4px); }
	to   { opacity: 1; transform: none; }
}

/* Graph view — let the existing network map fill the stage
   edge-to-edge. The network block ships with vertical margins for
   the in-article embeds, which inside our stage show up as black
   bands top and bottom. Reset them here. */
.eekad-home-db__map {
	background: transparent;
	border: 0;
	margin: 0;
	--nm-height: 336px;
}

/* Entities view — the panel itself scrolls so we don't blow the
   page layout when a file has dozens of entities. */
.eekad-home-db__view[data-db-view="entities"] {
	max-height: 336px;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(var(--c-border-rgb), .2) transparent;
}
.eekad-home-db__view[data-db-view="entities"]::-webkit-scrollbar {
	width: 8px;
}
.eekad-home-db__view[data-db-view="entities"]::-webkit-scrollbar-thumb {
	background: rgba(var(--c-border-rgb), .15);
}
.eekad-home-db__view[data-db-view="entities"]::-webkit-scrollbar-thumb:hover {
	background: rgba(203, 255, 0, .3);
}
/* Grid: give each card its own surface with air between.
   No shared backgrounds; cards sit on the stage as discrete objects. */
.eekad-home-db__entity-grid {
	list-style: none;
	margin: 0;
	padding: 24px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}
.eekad-home-db__entity { margin: 0; display: flex; }
.eekad-home-db__entity-card {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: auto auto 1fr;
	align-items: start;
	column-gap: 16px;
	row-gap: 6px;
	padding: 20px;
	background: var(--card-bg, var(--c-bg-surface));
	border: 1px solid rgba(var(--c-border-rgb), .06);
	color: inherit;
	text-decoration: none;
	width: 100%;
	position: relative;
	transition:
		border-color .2s ease,
		background .2s ease,
		box-shadow .25s ease,
		transform .2s ease;
	min-width: 0;
}
/* Subtle top highlight = quiet depth cue, no gradient on the surface. */
.eekad-home-db__entity-card::before {
	content: '';
	position: absolute;
	inset: 0 0 auto 0;
	height: 1px;
	background: rgba(var(--c-border-rgb), .04);
	pointer-events: none;
}
/* Lime edge slides in from the inline-start on hover — Eekad accent
   without washing the card in color. */
.eekad-home-db__entity-card::after {
	content: '';
	position: absolute;
	top: 0; bottom: 0;
	inset-inline-start: 0;
	width: 2px;
	background: var(--c-lime);
	transform: scaleY(0);
	transform-origin: top;
	transition: transform .25s ease;
}
.eekad-home-db__entity-card:hover {
	border-color: rgba(var(--c-border-rgb), .12);
	background: var(--c-bg-surface);
	box-shadow: 0 8px 24px -12px rgba(0, 0, 0, .6);
	transform: translateY(-1px);
}
.eekad-home-db__entity-card:hover::after { transform: scaleY(1); }

.eekad-home-db__entity-avatar {
	width: 48px;
	height: 48px;
	display: grid;
	place-items: center;
	background: var(--c-bg-base);
	overflow: hidden;
	grid-row: 1 / span 3;
}
.eekad-home-db__entity-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.eekad-home-db__entity-initial {
	font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
	font-size: 18px;
	font-weight: 700;
	color: var(--c-text-muted);
}
.eekad-home-db__entity-body { display: contents; }

.eekad-home-db__entity-name {
	font-weight: 700;
	font-size: 16px;
	color: var(--c-text);
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	letter-spacing: -.005em;
}
.eekad-home-db__entity-meta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	color: var(--c-text-3);
	font-weight: 500;
}
.eekad-home-db__entity-dot {
	width: 6px;
	height: 6px;
	background: var(--ent-color, rgba(var(--c-border-rgb), .3));
	flex: 0 0 auto;
}
.eekad-home-db__entity-schema { color: rgba(var(--c-border-rgb), .8); font-weight: 600; }
.eekad-home-db__entity-sep { color: rgba(var(--c-border-rgb), .2); }
.eekad-home-db__entity-country { color: rgba(var(--c-border-rgb), .55); }
.eekad-home-db__entity-summary {
	font-size: 13px;
	line-height: 1.55;
	color: var(--c-text-muted);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 2px;
}

/* --- Map view --- */
.eekad-home-db__map-canvas {
	width: 100%;
	height: 336px;
	background: var(--c-bg-alt); /* Ink — matches section; Mapbox recolors its own layers on load */
}

/* Marker.
   Mapbox applies its own `transform: translate(X,Y)` to the outer
   marker element to position it on the map. Any CSS transform on
   the outer element overwrites that, so all animation lives on
   `.eekad-home-db__marker-inner`. Three concentric children:
   dot (solid lime) • ring (hairline) • pulse (animated halo). */
.eekad-home-db__marker {
	width: 24px;
	height: 24px;
	cursor: pointer;
	position: relative;
}
.eekad-home-db__marker-inner {
	position: absolute;
	inset: 0;
	opacity: 0;
	transform: scale(.6);
	transform-origin: center;
	animation: eekad-home-db-marker-in .5s cubic-bezier(.16, 1, .3, 1) forwards;
}
.eekad-home-db__marker-inner > * {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	pointer-events: none;
}
.eekad-home-db__marker-dot {
	width: 8px;
	height: 8px;
	background: var(--c-lime);
	box-shadow: 0 0 0 1px rgba(var(--c-bg-base-rgb), .8);
	transition: width .15s ease, height .15s ease;
}
.eekad-home-db__marker-ring {
	width: 18px;
	height: 18px;
	border: 1px solid rgba(205, 254, 100, .55);
	transition: border-color .2s ease;
}
.eekad-home-db__marker-pulse {
	width: 18px;
	height: 18px;
	background: var(--c-lime);
	opacity: 0;
	animation: eekad-home-db-marker-pulse 2.4s ease-out infinite;
}
.eekad-home-db__marker:hover .eekad-home-db__marker-dot {
	width: 10px;
	height: 10px;
}
.eekad-home-db__marker:hover .eekad-home-db__marker-ring {
	border-color: var(--c-lime);
}
@keyframes eekad-home-db-marker-in {
	to { opacity: 1; transform: scale(1); }
}
@keyframes eekad-home-db-marker-pulse {
	0%   { transform: translate(-50%, -50%) scale(1);   opacity: .35; }
	70%  { transform: translate(-50%, -50%) scale(2.2); opacity: 0; }
	100% { transform: translate(-50%, -50%) scale(2.2); opacity: 0; }
}

/* Map popup hosts the entity card verbatim — same component the
   entities tab uses. Only job here: strip Mapbox's default chrome
   so the card sits flat, and tweak the tip + min width for the
   denser map context. Card visuals (hairline border, top highlight,
   lime stripe on hover) come from .eekad-home-db__entity-card. */
.eekad-home-db__map-popup-card {
	min-width: 240px;
	box-shadow: 0 14px 40px -12px rgba(0, 0, 0, .8);
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-popup-content {
	background: transparent;
	padding: 0;
	box-shadow: none;
	border: 0;
	border-radius: 0;
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-popup-tip {
	border-top-color: var(--c-bg-surface);
	border-bottom-color: var(--c-bg-surface);
}

/* Recolor Mapbox's navigation controls to match the device chrome. */
.eekad-home-db__view[data-db-view="map"] .mapboxgl-ctrl-group {
	background: rgba(var(--c-bg-surface-rgb), .9);
	border: 1px solid rgba(var(--c-border-rgb), .08);
	border-radius: 0;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-ctrl-group button {
	background: transparent;
	width: 32px;
	height: 32px;
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-ctrl-group button + button {
	border-top: 1px solid rgba(var(--c-border-rgb), .06);
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-ctrl-group button:hover {
	background: rgba(203, 255, 0, .08);
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-ctrl-group button .mapboxgl-ctrl-icon {
	filter: invert(1) brightness(.9);
	opacity: .75;
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-ctrl-group button:hover .mapboxgl-ctrl-icon {
	opacity: 1;
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-ctrl-attrib {
	background: rgba(var(--c-bg-base-rgb), .75);
	color: var(--c-text-muted);
	font-size: 10px;
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-ctrl-attrib a {
	color: var(--c-text-3);
}
.eekad-home-db__view[data-db-view="map"] .mapboxgl-ctrl-attrib a:hover {
	color: var(--c-lime);
}

/* --- Status bar footer --- */
.eekad-home-db__status {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 16px;
	background: var(--card-bg, var(--c-bg-surface));
	border-top: 1px solid rgba(var(--c-border-rgb), .06);
	font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
	font-size: 12px;
	color: var(--c-text-3);
	flex-wrap: wrap;
}
.eekad-home-db__status-group {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.eekad-home-db__status-num {
	color: var(--c-lime);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
.eekad-home-db__status-dot {
	width: 7px;
	height: 7px;
	background: var(--c-lime);
	box-shadow: 0 0 8px rgba(203, 255, 0, .7);
	animation: eekad-home-db-pulse 2s ease-in-out infinite;
	/* flex `align-items: center` puts the dot at the line-box center,
	   but the Arabic fallback font's line-box has extra room above for
	   diacritics, so the dot reads as low. Nudge it up to sit at the
	   optical center of "متصل" instead of the metric center. */
	transform: translateY(-2px);
}
@keyframes eekad-home-db-pulse {
	0%, 100% { opacity: 1; }
	50%      { opacity: .35; }
}
.eekad-home-db__status-sep { color: rgba(var(--c-border-rgb), .18); }

/* --- Responsive --- */
@media (max-width: 960px) {
	.eekad-home-db__stage { min-height: 368px; }
	.eekad-home-db__map { --nm-height: 368px; }
	.eekad-home-db__map-canvas { height: 368px; }
	.eekad-home-db__entity-grid { grid-template-columns: repeat(2, 1fr); }
	.eekad-home-db__view[data-db-view="entities"] { max-height: 368px; }
}
@media (max-width: 600px) {
	.eekad-home-db { padding-block: 48px; }
	.eekad-home-db__wrap { padding-inline: 16px; gap: 20px; }
	.eekad-home-db__title { font-size: 26px; }
	.eekad-home-db__devhead { padding: 16px 16px 14px; gap: 6px; }
	.eekad-home-db__devhead-heading { gap: 12px; }
	.eekad-home-db__devhead-name { font-size: 26px; }
	.eekad-home-db__devhead-id { font-size: 11px; }
	.eekad-home-db__devhead-desc { font-size: 14px; }
	.eekad-home-db__stage { min-height: 304px; }
	.eekad-home-db__map { --nm-height: 304px; }
	.eekad-home-db__map-canvas { height: 304px; }
	.eekad-home-db__entity-grid { grid-template-columns: 1fr; padding: 16px; }
	.eekad-home-db__view[data-db-view="entities"] { max-height: 304px; }
	.eekad-home-db__tabs { flex: 1 1 auto; flex-wrap: nowrap; min-width: 0; }
	.eekad-home-db__tab { flex: 1; justify-content: center; padding: 10px 8px; font-size: 13px; }
	/* CTA collapses to an icon chip in the corner — text label would
	   dominate the toolbar row. Aria label keeps it discoverable. */
	.eekad-home-db__cta {
		flex: 0 0 auto;
		padding: 10px;
		gap: 0;
	}
	.eekad-home-db__cta span { display: none; }
	.eekad-home-db__cta svg { width: 16px; height: 16px; opacity: .9; }
	.eekad-home-db__status { font-size: 11px; padding: 8px 12px; gap: 8px; }
}

/* =============================================================
 * PAGE SCANLINE — lime sweep on initial load (all pages except home)
 * =========================================================== */
.eekad-page-scanline {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	z-index: 9999;
	pointer-events: none;
	background: linear-gradient(
		to left,
		transparent,
		var(--c-lime, #cdfe64) 30%,
		var(--c-lime, #cdfe64) 70%,
		transparent
	);
	transform: scaleX(0);
	transform-origin: right;
	animation: eekad-page-scan .6s ease-out .1s forwards;
}
@keyframes eekad-page-scan {
	0%   { opacity: .8; transform: scaleX(0); }
	50%  { opacity: 1; }
	100% { opacity: 0; transform: scaleX(1); }
}