/*
Theme Name:        KG Labs Foundation Block
Status:            [Foundation Block] — ACTIVE / EFFECTIVE on kglabs.org production (v1.0.2). Successor to the [Living Network] legacy prototype. Hosts the timeline PHP page template (page-timeline.php) plus the v1.0.2 block-system wiring with eight new editorial patterns.
Theme URI:         https://kglabs.org
Author:            KG Labs Foundation
Author URI:        https://kglabs.org
Description:       Block theme for KG Labs Foundation. Built for WordPress 6.9+ with Site Editor templates, KG Labs global styles, and reusable editorial patterns.
Version:           1.1.2
Requires at least: 6.9
Tested up to:      6.9
Requires PHP:      7.4
License:           GPL v2 or later
License URI:       https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:       kglabsfoundationblock
Tags:              full-site-editing, block-patterns, block-styles, custom-colors, custom-logo, editor-style, featured-images, translation-ready
*/

/* Legacy CSS variable bridge — maps old design tokens to KG Labs palette */
:root {
	--gold:  var(--wp--preset--color--kg-lime);
	--teal:  var(--wp--preset--color--kg-leaf);
	--ink:   var(--wp--preset--color--kg-neutral-800);
	--paper: var(--wp--preset--color--kg-neutral-50);
	--slate: var(--wp--preset--color--kg-neutral-400);
	--rust:  #C45D3A;
	--kg-lime: var(--wp--preset--color--kg-lime);
}

html {
	scroll-behavior: smooth;
}

body {
	-webkit-font-smoothing: antialiased;
}

/* A11y · system-audit s15 / R-06
   Keyboard focus: 2 px deep-green outline, 2 px offset.
   Reduced motion: kill all transitions, animations, smooth scroll. */
:focus-visible {
	outline: 2px solid var(--wp--preset--color--kg-deep);
	outline-offset: 2px;
}

/* Skip link — visually hidden until focused, then anchored top-left.
   Mirrors WP Twenty Twenty-Four pattern. Paired with kglabs_block_skip_link()
   on wp_body_open and id="main" injected via the_render_block filter. */
.skip-link.screen-reader-text {
	position: absolute;
	top: -100px;
	left: 0;
	z-index: 100000;
	background: var(--wp--preset--color--kg-deep);
	color: var(--wp--preset--color--white);
	padding: 0.75rem 1.25rem;
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: var(--wp--preset--font-size--eyebrow);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
}
.skip-link.screen-reader-text:focus {
	top: 0;
	clip: auto !important;
	clip-path: none;
	height: auto;
	width: auto;
	white-space: normal;
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

/* Use :where() so per-element textColor (has-kg-lime-color etc.) wins.
   Without it, .kg-eyebrow forces every eyebrow to kg-deep — unreadable on
   dark sections (repository-section, cta-band, mission-band gradient). */
:where(.kg-eyebrow) {
	color: var(--wp--preset--color--kg-deep);
}
.kg-eyebrow {
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: var(--wp--preset--font-size--eyebrow);
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

/* Links on dark sections — without these, theme.json elements.link forces
   kg-deep, which is unreadable on kg-neutral-800. */
.has-kg-neutral-800-background-color a:where(:not(.wp-element-button)),
.kg-mission a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--kg-lime);
}
.has-kg-neutral-800-background-color a:where(:not(.wp-element-button)):hover,
.kg-mission a:where(:not(.wp-element-button)):hover {
	color: #fff;
}

.kg-eyebrow::before {
	content: '— ';
}

.kg-header {
	border-bottom: 3px solid var(--wp--preset--color--kg-leaf);
}

.kg-header .wp-block-navigation {
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: var(--wp--preset--font-size--eyebrow);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.kg-hero {
	background:
		radial-gradient(circle at 1px 1px, rgba(63, 169, 60, 0.08) 1px, transparent 0) 0 0 / 24px 24px,
		linear-gradient(180deg, #fff 0%, var(--wp--preset--color--kg-green-50) 100%);
}

.kg-hero__mark img {
	filter: drop-shadow(0 20px 56px rgba(26, 159, 65, 0.22));
}

.kg-rule-gradient {
	background: linear-gradient(90deg, var(--wp--preset--color--kg-lime) 0%, var(--wp--preset--color--kg-leaf) 50%, var(--wp--preset--color--kg-deep) 100%);
	min-height: 3px;
}

.kg-mission {
	background: linear-gradient(180deg, var(--wp--preset--color--kg-lime) 0%, var(--wp--preset--color--kg-leaf) 50%, var(--wp--preset--color--kg-deep) 100%);
}

.kg-pillar {
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.24);
	border-radius: 4px;
}

.kg-post-card {
	border-top: 3px solid var(--wp--preset--color--kg-leaf);
}

.kg-hedcut img,
.kg-hedcut-placeholder {
	aspect-ratio: 1;
	border-radius: 999px;
	filter: grayscale(1) contrast(1.25);
	object-fit: cover;
}

.kg-hedcut-placeholder {
	background:
		radial-gradient(circle at 50% 34%, var(--wp--preset--color--kg-neutral-800) 0 18%, transparent 19%),
		radial-gradient(ellipse at 50% 92%, var(--wp--preset--color--kg-neutral-800) 0 34%, transparent 35%),
		var(--wp--preset--color--kg-neutral-50);
	opacity: 0.32;
}

.kg-footer {
	border-top: 3px solid var(--wp--preset--color--kg-leaf);
}

.wp-block-query-pagination {
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: var(--wp--preset--font-size--eyebrow);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

@media (max-width: 780px) {
	.kg-hero .wp-block-columns,
	.kg-footer .wp-block-columns {
		gap: var(--wp--preset--spacing--50);
	}
}

:where(a:hover) {
	color: var(--wp--preset--color--kg-green-800);
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--wp--preset--color--kg-leaf);
	box-shadow: 0 0 0 3px var(--wp--preset--color--kg-green-50);
	outline: none;
}

.wp-block-post-content > p:first-of-type::first-letter {
	font-family: var(--wp--preset--font-family--playfair-display);
	font-size: 3.6rem;
	font-weight: 900;
	float: left;
	line-height: 0.82;
	margin: 8px 12px 0 0;
	color: var(--wp--preset--color--kg-deep);
}

.wp-block-post-content blockquote {
	margin: 36px 0;
	padding: 24px 32px;
	border-left: 4px solid var(--wp--preset--color--kg-leaf);
	background: var(--wp--preset--color--kg-green-50);
	font-style: italic;
	font-family: var(--wp--preset--font-family--playfair-display);
	font-size: 1.25rem;
	color: var(--wp--preset--color--kg-neutral-800);
	line-height: 1.5;
}

.kg-post-card:hover {
	border-top-color: var(--wp--preset--color--kg-deep);
	transform: translateY(-3px);
	box-shadow: 0 12px 32px rgba(26, 159, 65, 0.1);
}

.kg-pillar:hover {
	background: rgba(255, 255, 255, 0.18);
	transform: translateY(-2px);
}

.kg-hedcut__frame {
	border: 2px solid var(--wp--preset--color--kg-neutral-100);
	border-radius: 50%;
	padding: 4px;
	overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}

/* =========================================================
   KG Labs CTA Block — .kg-cta
   ========================================================= */

.kg-cta {
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}
.kg-cta__inner {
	display: flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--50);
	max-width: 960px;
	margin: 0 auto;
}
.kg-cta__icon {
	flex-shrink: 0;
	width: 56px;
	height: 56px;
	opacity: 0.85;
}

.kg-cta__icon svg {
	width: 100%;
	height: 100%;
}
.kg-cta__body { flex: 1; }
.kg-cta__eyebrow { display: block; margin-bottom: 0.6rem; }
.kg-cta__heading {
	font-family: var(--wp--preset--font-family--playfair-display);
	font-size: clamp(1.4rem, 2.5vw, 1.85rem);
	font-weight: 800;
	line-height: 1.2;
	margin-bottom: 0.85rem;
}
.kg-cta__text {
	font-size: 1rem;
	line-height: 1.75;
	margin-bottom: var(--wp--preset--spacing--40);
}
.kg-cta__actions { display: flex; gap: 0.75rem; flex-wrap: wrap; }

/* Buttons inherit wp-element-button base; variants below override colours */
.kg-cta__btn-primary,
.kg-cta__btn-secondary {
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: 0.72rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 600;
	padding: 0.65em 1.4em;
	border: 2px solid transparent;
	border-radius: 2px;
	text-decoration: none;
	display: inline-block;
	transition: background 0.15s, color 0.15s, border-color 0.15s;
}

/* ── expertise: green tint, leaf accent ── */
.kg-cta--expertise {
	background: var(--wp--preset--color--kg-green-50);
	border-top: 3px solid var(--wp--preset--color--kg-leaf);
}
.kg-cta--expertise .kg-cta__icon { color: var(--wp--preset--color--kg-leaf); }
.kg-cta--expertise .kg-eyebrow   { color: var(--wp--preset--color--kg-leaf); }
.kg-cta--expertise .kg-cta__heading { color: var(--wp--preset--color--kg-neutral-800); }
.kg-cta--expertise .kg-cta__text    { color: var(--wp--preset--color--kg-neutral-600); }
.kg-cta--expertise .kg-cta__btn-primary  { background: var(--wp--preset--color--kg-deep); color: #fff; border-color: var(--wp--preset--color--kg-deep); }
.kg-cta--expertise .kg-cta__btn-secondary { color: var(--wp--preset--color--kg-deep); border-color: var(--wp--preset--color--kg-deep); }

/* ── research: white, wordmark accent ── */
.kg-cta--research {
	background: var(--wp--preset--color--white);
	border-top: 3px solid var(--wp--preset--color--kg-wordmark);
	border-bottom: 1px solid var(--wp--preset--color--kg-neutral-100);
}
.kg-cta--research .kg-cta__icon  { color: var(--wp--preset--color--kg-wordmark); }
.kg-cta--research .kg-eyebrow    { color: var(--wp--preset--color--kg-wordmark); }
.kg-cta--research .kg-cta__heading { color: var(--wp--preset--color--kg-neutral-800); }
.kg-cta--research .kg-cta__text    { color: var(--wp--preset--color--kg-neutral-600); }
.kg-cta--research .kg-cta__btn-primary  { background: var(--wp--preset--color--kg-deep); color: #fff; border-color: var(--wp--preset--color--kg-deep); }
.kg-cta--research .kg-cta__btn-secondary { color: var(--wp--preset--color--kg-deep); border-color: var(--wp--preset--color--kg-deep); }

/* ── consultancy: green tint, lime accent ── */
.kg-cta--consultancy {
	background: var(--wp--preset--color--kg-green-50);
	border-top: 3px solid var(--wp--preset--color--kg-lime);
}
.kg-cta--consultancy .kg-cta__icon { color: var(--wp--preset--color--kg-lime); }
.kg-cta--consultancy .kg-eyebrow   { color: var(--wp--preset--color--kg-lime); }
.kg-cta--consultancy .kg-cta__heading { color: var(--wp--preset--color--kg-neutral-800); }
.kg-cta--consultancy .kg-cta__text    { color: var(--wp--preset--color--kg-neutral-600); }
.kg-cta--consultancy .kg-cta__btn-primary  { background: var(--wp--preset--color--kg-deep); color: #fff; border-color: var(--wp--preset--color--kg-deep); }
.kg-cta--consultancy .kg-cta__btn-secondary { color: var(--wp--preset--color--kg-deep); border-color: var(--wp--preset--color--kg-deep); }

/* ── coapplicant: dark, inverted ── */
.kg-cta--coapplicant {
	background: var(--wp--preset--color--kg-green-800);
	border-top: 3px solid var(--wp--preset--color--kg-lime);
}
.kg-cta--coapplicant .kg-cta__icon  { color: rgba(255, 255, 255, 0.75); }
.kg-cta--coapplicant .kg-eyebrow    { color: var(--wp--preset--color--kg-lime); }
.kg-cta--coapplicant .kg-cta__heading { color: #fff; }
.kg-cta--coapplicant .kg-cta__text    { color: rgba(255,255,255,0.8); }
.kg-cta--coapplicant .kg-cta__btn-primary  { background: #fff; color: var(--wp--preset--color--kg-green-800); border-color: #fff; }
.kg-cta--coapplicant .kg-cta__btn-primary:hover { background: var(--wp--preset--color--kg-green-50); }
.kg-cta--coapplicant .kg-cta__btn-secondary { color: rgba(255,255,255,0.85); border-color: rgba(255,255,255,0.35); }
.kg-cta--coapplicant .kg-cta__btn-secondary:hover { background: rgba(255,255,255,0.1); color: #fff; }

/* ── general: deep green, inverted ── */
.kg-cta--general {
	background: var(--wp--preset--color--kg-deep);
	border-top: 3px solid var(--wp--preset--color--kg-lime);
}
.kg-cta--general .kg-cta__icon  { color: var(--wp--preset--color--kg-lime); }
.kg-cta--general .kg-eyebrow    { color: var(--wp--preset--color--kg-lime); }
.kg-cta--general .kg-cta__heading { color: #fff; }
.kg-cta--general .kg-cta__text    { color: rgba(255,255,255,0.8); }
.kg-cta--general .kg-cta__btn-primary  { background: #fff; color: var(--wp--preset--color--kg-deep); border-color: #fff; }
.kg-cta--general .kg-cta__btn-primary:hover { background: var(--wp--preset--color--kg-green-50); }
.kg-cta--general .kg-cta__btn-secondary { color: rgba(255,255,255,0.85); border-color: rgba(255,255,255,0.35); }
.kg-cta--general .kg-cta__btn-secondary:hover { background: rgba(255,255,255,0.1); color: #fff; }

/* ── whatsapp: mint, WhatsApp green ── */
.kg-cta--whatsapp {
	background: #ECFDF5;
	border-top: 3px solid #25D366;
}
.kg-cta--whatsapp .kg-cta__icon  { color: #25D366; }
.kg-cta--whatsapp .kg-eyebrow    { color: #128C7E; }
.kg-cta--whatsapp .kg-cta__heading { color: var(--wp--preset--color--kg-neutral-800); }
.kg-cta--whatsapp .kg-cta__text    { color: var(--wp--preset--color--kg-neutral-600); }
.kg-cta--whatsapp .kg-cta__btn-primary  { background: #25D366; border-color: #25D366; color: #fff; }
.kg-cta--whatsapp .kg-cta__btn-primary:hover { background: #128C7E; border-color: #128C7E; }
.kg-cta--whatsapp .kg-cta__btn-secondary { color: var(--wp--preset--color--kg-deep); border-color: var(--wp--preset--color--kg-deep); }

/* ── Mobile ── */
@media (max-width: 680px) {
	.kg-cta { padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40); }
	.kg-cta__inner { flex-direction: column; gap: var(--wp--preset--spacing--40); }
	.kg-cta__icon  { width: 40px; height: 40px; }
	.kg-cta__actions { flex-direction: column; }
	.kg-cta__actions .kg-cta__btn-primary,
	.kg-cta__actions .kg-cta__btn-secondary { width: 100%; text-align: center; }
}

/* =========================================================
   Featured Articles — .kg-featured-card
   ========================================================= */

.kg-featured-card {
	border-top: 3px solid var(--wp--preset--color--kg-leaf);
}

.kg-featured-card:hover {
	border-top-color: var(--wp--preset--color--kg-deep);
	transform: translateY(-3px);
	box-shadow: 0 12px 32px rgba(26, 159, 65, 0.1);
}

.kg-featured-card .wp-block-post-featured-image {
	margin-bottom: var(--wp--preset--spacing--30);
}

.kg-featured-card .wp-block-post-featured-image img {
	aspect-ratio: 16 / 9;
	object-fit: cover;
	width: 100%;
	display: block;
}

.kg-featured-card .wp-block-post-excerpt p {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* =========================================================
   Current Projects — .kg-project-card
   ========================================================= */

.kg-project-card {
	border-left: 4px solid var(--wp--preset--color--kg-leaf);
	padding-left: 1.25rem !important;
}

.kg-project-card:hover {
	border-left-color: var(--wp--preset--color--kg-deep);
	box-shadow: 0 4px 20px rgba(26, 159, 65, 0.08);
}

.kg-status-badge {
	display: inline-block;
	background: var(--wp--preset--color--kg-green-100);
	color: var(--wp--preset--color--kg-green-800);
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: var(--wp--preset--font-size--eyebrow);
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 0.2em 0.7em;
	border-radius: 2px;
	margin-bottom: 0.6rem;
}

/* =========================================================
   Artefacts — .kg-artefact-card
   ========================================================= */

.kg-artefact-card {
	border-top: 3px solid var(--wp--preset--color--kg-leaf);
}

.kg-artefact-card:hover {
	border-top-color: var(--wp--preset--color--kg-deep);
	box-shadow: 0 4px 16px rgba(97, 180, 49, 0.1);
}

.kg-artefact-card .wp-block-post-title,
.kg-artefact-card .wp-block-post-title a {
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-weight: 600;
	letter-spacing: 0.02em;
}

.kg-artefact-card .wp-block-post-excerpt p {
	font-family: var(--wp--preset--font-family--source-serif-4);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--kg-neutral-600);
}

.kg-format-badge {
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: var(--wp--preset--font-size--eyebrow);
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--kg-deep);
	margin-bottom: 0.5rem;
	display: block;
}

/* =========================================================
   Editorial utility cards and grids
   ========================================================= */

.kg-resource-card,
.kg-person-card,
.kg-partner-card,
.kg-program-card {
	border-top: 3px solid var(--wp--preset--color--kg-leaf);
}

.kg-resource-card:hover,
.kg-person-card:hover,
.kg-partner-card:hover,
.kg-program-card:hover {
	border-top-color: var(--wp--preset--color--kg-deep);
	box-shadow: 0 10px 28px rgba(26, 159, 65, 0.08);
	transform: translateY(-2px);
}

.kg-partner-card {
	min-height: 8rem;
}

.kg-contact-list {
	list-style: none;
	padding-left: 0 !important;
}

.kg-contact-list li + li {
	margin-top: 0.55rem;
}

@media (max-width: 680px) {
	.kg-project-card {
		padding-left: 1rem !important;
	}
}
/* =========================================================
   Timeline Page (kg-tl-*) — ported from kglabs-foundation
   classic theme. Used by page-timeline.php custom template.
   ========================================================= */
:root {
  --kg-lime: #A1C623;
  --kg-leaf: #61B431;
  --kg-wordmark: #3FA93C;
  --kg-deep: #1A9F41;
  --kg-green-50: #F2F8E6;
  --kg-green-100: #E3F0C7;
  --kg-green-200: #CBE291;
  --kg-green-700: #1A9F41;
  --kg-green-800: #136B2C;
  --kg-n-50: #F9FAFB;
  --kg-n-100: #E5E7EB;
  --kg-n-200: #CBD0D8;
  --kg-n-300: #A8AFBD;
  --kg-n-400: #7C8495;
  --kg-n-500: #565E6E;
  --kg-n-600: #3A4150;
  --kg-n-700: #262B36;
  --kg-n-800: #1E1E1E;
  --kg-n-900: #0A0A0A;
  --badge-grad: linear-gradient(180deg, var(--kg-lime) 0%, var(--kg-leaf) 50%, var(--kg-deep) 100%);
  --rule-grad:  linear-gradient(90deg, var(--kg-lime) 0%, var(--kg-leaf) 50%, var(--kg-deep) 100%);
  --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-mono:    'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --wrap-wide: 1280px;
  --wrap-content: 960px;
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
}
.kg-wrap { max-width: var(--wrap-wide); margin: 0 auto; padding: 0 40px; }
.kg-wrap--content { max-width: var(--wrap-content); margin: 0 auto; padding: 0 40px; }
.kg-eyebrow { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 600; color: var(--kg-deep); display: inline-block; }

.kg-pillars { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.kg-pillar { background: rgba(255,255,255,0.1); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,0.2); border-radius: 4px; padding: 24px 20px; transition: all 220ms var(--ease-out); }
.kg-pillar:hover { background: rgba(255,255,255,0.18); transform: translateY(-2px); }
.kg-pillar__label { font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.2em; color: var(--kg-green-100); margin-bottom: 10px; font-weight: 600; }
.kg-pillar__desc { font-family: var(--font-display); font-size: 1rem; line-height: 1.45; color: var(--kg-n-300); }
.kg-pillar__icon { margin-bottom: 16px; }
@media (max-width: 900px) { .kg-pillars { grid-template-columns: 1fr 1fr; } }

.kg-tl-hero { background: var(--kg-n-800); padding: 80px 0 72px; border-bottom: 3px solid; border-image: var(--rule-grad) 1; }
.kg-tl-hero__inner { max-width: 760px; }
.kg-tl-hero .kg-eyebrow { color: var(--kg-lime); margin-bottom: 12px; }
.kg-tl-hero__title { color: #fff; font-size: clamp(2.6rem, 5vw, 4rem); font-weight: 900; line-height: 1.04; margin-bottom: 20px; font-family: var(--font-display); }
.kg-tl-hero__lead { color: var(--kg-n-300); font-size: 1.15rem; line-height: 1.65; margin: 0; max-width: 640px; }

.kg-timeline-nav { position: sticky; top: 57px; z-index: 90; background: #fff; border-bottom: 1px solid var(--kg-n-100); padding: 0 40px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.kg-timeline-nav__list { display: flex; gap: 4px; list-style: none; margin: 0; padding: 10px 0; min-width: max-content; }
.kg-timeline-nav__pill { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600; color: var(--kg-n-500); padding: 7px 14px; border-radius: 20px; border: 1px solid transparent; white-space: nowrap; transition: all 180ms var(--ease-out); text-decoration: none; }
.kg-timeline-nav__pill:hover { color: var(--kg-deep); border-color: var(--kg-leaf); }
.kg-timeline-nav__pill.is-active { background: var(--kg-deep); color: #fff; border-color: var(--kg-deep); }

.kg-tl-arc { background: var(--kg-n-800); padding: 56px 0; }
.kg-tl-arc .kg-eyebrow { color: var(--kg-lime); }
.kg-tl-arc__heading { color: #fff; margin-bottom: 32px; font-size: clamp(1.4rem, 2.5vw, 2rem); font-family: var(--font-display); }
.kg-tl-arc .kg-pillar { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.1); }
.kg-tl-arc .kg-pillar__label { color: #fff; }
.kg-tl-arc .kg-pillar__desc { color: var(--kg-n-300); }
.kg-tl-arc .kg-pillar__icon img { opacity: 0.85; filter: brightness(1.4); }

.kg-tl-impact { background: var(--kg-green-50); padding: 40px 0; border-top: 3px solid var(--kg-lime); border-bottom: 3px solid var(--kg-lime); }
.kg-tl-impact__inner { display: flex; gap: 0; justify-content: center; flex-wrap: wrap; }
.kg-tl-impact__item { display: flex; flex-direction: column; align-items: center; padding: 16px 40px; border-right: 1px solid var(--kg-green-200); text-align: center; }
.kg-tl-impact__item:last-child { border-right: none; }
.kg-tl-impact__value { font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3rem); font-weight: 900; color: var(--kg-deep); line-height: 1; }
.kg-tl-impact__label { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--kg-n-700); font-weight: 600; margin-top: 6px; }
.kg-tl-impact__note { font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--kg-n-400); margin-top: 2px; }

.kg-tl-body { position: relative; padding: 64px 0 32px; }
.kg-tl-body__line { position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); width: 2px; background: var(--kg-leaf); opacity: 0.25; pointer-events: none; }

.kg-tl-era { padding: 48px 0 16px; scroll-margin-top: 110px; }
.kg-tl-era__header { display: flex; align-items: flex-start; gap: 18px; margin-bottom: 8px; position: relative; z-index: 1; }
.kg-tl-era__runa { width: 48px; height: 48px; flex-shrink: 0; opacity: 0.7; margin-top: 4px; }
.kg-tl-era__heading { font-size: clamp(1.5rem, 2.5vw, 2.1rem); color: var(--kg-n-800); margin-bottom: 0; font-family: var(--font-display); }
.kg-tl-era__context { max-width: 680px; color: var(--kg-n-500); font-size: 0.97rem; line-height: 1.7; margin-bottom: 36px; padding-left: 66px; }

.kg-tl-era__events { position: relative; }
.kg-tl-event-wrap { display: flex; width: 50%; padding-bottom: 32px; }
.kg-tl-event-wrap--left { justify-content: flex-end; padding-right: 40px; }
.kg-tl-event-wrap--right { margin-left: 50%; padding-left: 40px; }

.kg-tl-event { position: relative; max-width: 440px; width: 100%; }
.kg-tl-event__dot { position: absolute; width: 12px; height: 12px; border-radius: 50%; background: var(--kg-leaf); border: 2px solid #fff; box-shadow: 0 0 0 2px var(--kg-leaf); top: 20px; }
.kg-tl-event-wrap--left  .kg-tl-event__dot { right: -46px; }
.kg-tl-event-wrap--right .kg-tl-event__dot { left: -46px; }
.kg-tl-event--hackathon     .kg-tl-event__dot { background: var(--kg-lime);     box-shadow: 0 0 0 2px var(--kg-lime); }
.kg-tl-event--international .kg-tl-event__dot { background: var(--kg-leaf);     box-shadow: 0 0 0 2px var(--kg-leaf); }
.kg-tl-event--policy        .kg-tl-event__dot { background: var(--kg-deep);     box-shadow: 0 0 0 2px var(--kg-deep); }
.kg-tl-event--ai            .kg-tl-event__dot { background: var(--kg-wordmark); box-shadow: 0 0 0 2px var(--kg-wordmark); }
.kg-tl-event__card { background: #fff; border: 1px solid var(--kg-n-100); border-top: 3px solid var(--kg-leaf); padding: 20px 22px; border-radius: 2px; transition: box-shadow 180ms var(--ease-out); }
.kg-tl-event--hackathon     .kg-tl-event__card { border-top-color: var(--kg-lime); }
.kg-tl-event--international .kg-tl-event__card { border-top-color: var(--kg-leaf); }
.kg-tl-event--policy        .kg-tl-event__card { border-top-color: var(--kg-deep); }
.kg-tl-event--ai            .kg-tl-event__card { border-top-color: var(--kg-wordmark); }
.kg-tl-event__card:hover { box-shadow: 0 8px 24px rgba(10,10,10,0.08); }
.kg-tl-event__meta { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.kg-tl-event__date { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; color: var(--kg-deep); }
.kg-tl-event__cat { text-transform: capitalize; font-size: 0.62rem; }
.kg-tl-event__title { font-size: 1.05rem; font-weight: 700; margin-bottom: 8px; line-height: 1.3; color: var(--kg-n-800); font-family: var(--font-display); }
.kg-tl-event__body { font-size: 0.9rem; line-height: 1.65; color: var(--kg-n-600); margin-bottom: 10px; }
.kg-tl-event__partners { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.kg-tl-event__more { display: inline-block; margin-top: 10px; font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600; color: var(--kg-deep); text-decoration: none; }

.kg-tag { display: inline-block; font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600; padding: 3px 8px; background: var(--kg-green-50); color: var(--kg-deep); border-radius: 2px; border: 1px solid var(--kg-green-200); }
.kg-tag--sm { font-size: 0.58rem; padding: 2px 6px; }

.kg-tl-map { padding: 64px 0; background: var(--kg-n-800); }
.kg-tl-map .kg-eyebrow { color: var(--kg-lime); }
.kg-tl-map__heading { color: #fff; margin-bottom: 8px; font-family: var(--font-display); }
.kg-tl-map__lead { color: var(--kg-n-300); max-width: 540px; margin-bottom: 32px; }
.kg-tl-map__figure { margin: 0 0 24px; }
.kg-tl-map__figure svg { width: 100%; height: auto; max-height: 400px; }
.kg-tl-map__figure .world-land   { fill: var(--kg-n-600); }
.kg-tl-map__figure .world-line   { stroke: var(--kg-lime); stroke-width: 1.2; fill: none; stroke-dasharray: 4 3; opacity: 0.7; }
.kg-tl-map__figure .world-origin { fill: var(--kg-lime); }
.kg-tl-map__figure .world-dest   { fill: var(--kg-leaf); }
.kg-tl-map__figure .world-label  { fill: var(--kg-n-200); font-family: var(--font-mono); font-size: 7px; }
.kg-tl-map__caption { color: var(--kg-n-400); text-align: left; }
.kg-tl-map__legend { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 12px 28px; }
.kg-tl-map__legend li { font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--kg-n-300); display: flex; align-items: center; gap: 8px; }
.kg-tl-map__dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--kg-leaf); flex-shrink: 0; }

.kg-tl-table-section { padding: 64px 0; }
.kg-tl-table-section .kg-eyebrow { margin-bottom: 6px; }
.kg-tl-table-wrap { overflow-x: auto; margin: 28px 0 8px; }
.kg-tl-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.kg-tl-table th { font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--kg-n-500); font-weight: 600; padding: 10px 14px; text-align: left; border-bottom: 2px solid var(--kg-leaf); white-space: nowrap; }
.kg-tl-table td { padding: 14px; border-bottom: 1px solid var(--kg-n-100); color: var(--kg-n-700); vertical-align: top; }
.kg-tl-table tr:last-child td { border-bottom: none; }
.kg-tl-table tr:hover td { background: var(--kg-green-50); }
.kg-tl-table td:first-child { font-family: var(--font-mono); font-weight: 700; color: var(--kg-deep); font-size: 0.88rem; white-space: nowrap; }
.kg-tl-table__note { font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--kg-n-400); }

@media (max-width: 900px) {
  .kg-tl-hero { padding: 48px 0; }
  .kg-tl-hero__title { font-size: 2.2rem; }
  .kg-timeline-nav { padding: 0 20px; top: 52px; }
  .kg-tl-body__line { left: 24px; transform: none; }
  .kg-tl-event-wrap { width: 100%; margin-left: 0; padding-left: 56px; padding-right: 0; justify-content: flex-start; }
  .kg-tl-event-wrap--left { padding-right: 0; justify-content: flex-start; padding-left: 56px; }
  .kg-tl-event-wrap--right { margin-left: 0; padding-left: 56px; }
  .kg-tl-event-wrap--left  .kg-tl-event__dot,
  .kg-tl-event-wrap--right .kg-tl-event__dot { left: -32px; right: auto; }
  .kg-tl-impact__item { padding: 16px 20px; }
}

/* =========================================================
   CTA Block — alignfull offset fix
   Prevents the block from being shifted left when WordPress
   generates negative-margin rules for alignfull inside
   a default-layout parent.
   ========================================================= */

.kg-cta.alignfull {
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: 100% !important;
	width: 100%;
}

/* =========================================================
   Key Takeaway block style (core/quote with style kg-key-takeaway)
   ========================================================= */

.is-style-kg-key-takeaway.wp-block-quote {
	border-left: 4px solid var(--wp--preset--color--kg-lime) !important;
	border-right: 0 !important;
	border-top: 0 !important;
	border-bottom: 0 !important;
	border-radius: 0 4px 4px 0;
	background: var(--wp--preset--color--kg-green-50) !important;
	padding: 1.5rem 1.75rem !important;
	margin: 2rem 0;
}

.is-style-kg-key-takeaway.wp-block-quote::before {
	content: "Key Takeaway";
	display: block;
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: var(--wp--preset--font-size--eyebrow);
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--kg-deep);
	margin-bottom: 0.6rem;
}

.is-style-kg-key-takeaway.wp-block-quote p {
	font-size: 1.05rem;
	font-style: normal !important;
	color: var(--wp--preset--color--kg-neutral-800);
	margin: 0;
}

.is-style-kg-key-takeaway.wp-block-quote cite {
	display: none;
}

/* =========================================================
   Pullquote — ensure left-border shorthand renders correctly
   (theme.json border.width "0 0 0 4px" varies across WP versions)
   ========================================================= */

.wp-block-pullquote {
	border-left: 4px solid var(--wp--preset--color--kg-leaf) !important;
	border-right: 0 !important;
	border-top: 0 !important;
	border-bottom: 0 !important;
	border-radius: 0 4px 4px 0;
	padding: 1.5rem 2rem !important;
}

/* =========================================================
   Classic-theme compatibility (Issue #9)
   Pages built with .kg-article, .entry-hero, .cta-block
   from the classic theme render correctly in the block theme.
   ========================================================= */

.kg-article {
	max-width: 820px;
	margin: 0 auto;
	padding: 3rem 1.5rem;
	line-height: 1.75;
}

.kg-article blockquote {
	border-left: 4px solid var(--wp--preset--color--kg-leaf);
	background: var(--wp--preset--color--kg-green-50);
	padding: 1.25rem 1.5rem;
	margin: 2rem 0;
	border-radius: 0 4px 4px 0;
	font-family: var(--wp--preset--font-family--playfair-display);
	font-style: italic;
}

.entry-hero {
	width: 100%;
	max-height: 480px;
	object-fit: cover;
	margin-bottom: 2rem;
	display: block;
}

.cta-block {
	background: var(--wp--preset--color--kg-neutral-800);
	color: #fff;
	text-align: center;
	padding: 3rem 2rem;
	margin-top: 3rem;
}

.cta-block__heading {
	color: #fff;
	font-family: var(--wp--preset--font-family--playfair-display);
	margin-bottom: 1.5rem;
}

.cta-block__actions {
	display: flex;
	gap: 1rem;
	justify-content: center;
	flex-wrap: wrap;
}

.btn--primary,
.btn--outline {
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: 0.72rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 600;
	padding: 0.75rem 1.4rem;
	border-radius: 2px;
	text-decoration: none;
	display: inline-block;
}

.btn--primary {
	background: var(--wp--preset--color--kg-deep);
	color: #fff;
	border: 2px solid var(--wp--preset--color--kg-deep);
}

.btn--outline {
	background: transparent;
	color: #fff;
	border: 2px solid rgba(255, 255, 255, 0.4);
}

.related-articles {
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid var(--wp--preset--color--kg-neutral-100);
}

.entry-card {
	border-top: 3px solid var(--wp--preset--color--kg-leaf);
	padding: 1.25rem;
	background: var(--wp--preset--color--white);
	text-decoration: none;
	color: inherit;
	display: block;
	transition: transform 200ms ease, box-shadow 200ms ease;
}

.entry-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(26, 159, 65, 0.1);
}

/* ─── Hackathon / event page compat ─────────────────────────────────────── */
.cover {
	background: linear-gradient(180deg, #A1C623 0%, #61B431 50%, #1A9F41 100%);
	color: #fff;
	padding: 64px var(--wp--preset--spacing--50, 2rem);
}
.cover-label {
	font-family: var(--wp--preset--font-family--jetbrains-mono);
	font-size: 0.68rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	opacity: 0.78;
	margin-bottom: 1rem;
}
.cover-title { font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1.05; margin: 0 0 1rem; }
.cover-body  { opacity: 0.88; max-width: 820px; font-size: 1.06rem; line-height: 1.8; margin-top: 18px; }
.cover-meta  { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 36px; max-width: 720px; }
.meta-box    { border-top: 1px solid rgba(255,255,255,.2); padding-top: 12px; }
.meta-num    { font-family: var(--wp--preset--font-family--playfair-display); color: var(--gold); font-size: 2rem; line-height: 1.1; display: block; }
.meta-label  { font-family: var(--wp--preset--font-family--jetbrains-mono); font-size: .62rem; letter-spacing: .08em; opacity: .75; display: block; margin-top: 4px; }
.section-lead    { color: var(--slate); margin-bottom: 32px; max-width: 700px; font-size: 1.02rem; }
.solutions-grid  { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-bottom: 48px; }
.solution-card   { background: #fff; border: 1px solid rgba(0,0,0,.08); border-top: 4px solid var(--gold); padding: 24px; display: flex; flex-direction: column; }
.solution-place  { font-family: var(--wp--preset--font-family--playfair-display); font-size: 2rem; font-weight: 700; color: var(--gold); opacity: .35; display: block; margin-bottom: 8px; }
.solution-kicker { font-family: var(--wp--preset--font-family--jetbrains-mono); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--teal); margin-bottom: 8px; }
.solution-card h3 { font-family: var(--wp--preset--font-family--playfair-display); font-size: 1.18rem; line-height: 1.28; margin-bottom: 10px; }
.solution-card p  { color: var(--slate); font-size: .93rem; flex: 1; margin-bottom: 12px; }
.solution-outcome { font-family: var(--wp--preset--font-family--jetbrains-mono); font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; color: var(--rust); border-top: 1px solid rgba(0,0,0,.06); padding-top: 10px; margin-top: auto; }
.pull-quote        { margin: 36px 0; padding: 28px 32px; background: var(--ink); color: #fff; position: relative; }
.pull-quote::before { content: '\201C'; font-family: var(--wp--preset--font-family--playfair-display); font-size: 5rem; position: absolute; top: -8px; left: 16px; color: var(--gold); opacity: .55; line-height: 1; }
.pull-quote p      { font-family: var(--wp--preset--font-family--playfair-display); font-style: italic; font-size: 1.18rem; line-height: 1.5; color: #fff; padding-left: 44px; margin: 0; }
.pull-quote cite   { display: block; margin-top: 10px; padding-left: 44px; font-family: var(--wp--preset--font-family--jetbrains-mono); font-size: .66rem; letter-spacing: .08em; color: rgba(255,255,255,.6); font-style: normal; }
.criteria-grid   { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 28px 0 48px; }
.criterion       { background: #fff; border: 1px solid rgba(0,0,0,.08); padding: 18px; border-top: 3px solid var(--kg-lime); }
.criterion-label { font-family: var(--wp--preset--font-family--jetbrains-mono); font-size: .65rem; letter-spacing: .12em; text-transform: uppercase; color: var(--teal); margin-bottom: 8px; display: block; }
.criterion-desc  { font-size: .9rem; color: var(--slate); }
.next-event  { background: var(--ink); color: #fff; padding: 28px 32px; margin-bottom: 48px; }
.next-label  { font-family: var(--wp--preset--font-family--jetbrains-mono); font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); margin-bottom: 12px; }
.next-title  { font-family: var(--wp--preset--font-family--playfair-display); font-size: 1.5rem; font-weight: 700; margin-bottom: 10px; }
.next-body   { opacity: .82; font-size: .97rem; max-width: 640px; margin-bottom: 18px; }
.stat-row   { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 32px 0; }
.stat-box   { background: #fff; border: 1px solid rgba(0,0,0,.08); border-top: 3px solid var(--gold); padding: 20px; text-align: center; }
.stat-num   { font-family: var(--wp--preset--font-family--playfair-display); font-size: 2.2rem; font-weight: 700; color: var(--teal); display: block; }
.stat-label { font-family: var(--wp--preset--font-family--jetbrains-mono); font-size: .62rem; letter-spacing: .06em; color: var(--slate); margin-top: 6px; display: block; line-height: 1.4; }
.btn-inline { display: inline-block; font-family: var(--wp--preset--font-family--jetbrains-mono); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; padding: 10px 22px; text-decoration: none; border-radius: 2px; background: var(--gold); color: var(--ink); }
@media (max-width: 900px) {
	.cover-meta, .solutions-grid, .criteria-grid { grid-template-columns: 1fr 1fr; }
	.cover { padding: 48px 22px; }
}
@media (max-width: 600px) {
	.criteria-grid, .stat-row, .cover-meta { grid-template-columns: 1fr; }
	.solutions-grid { grid-template-columns: 1fr; }
}