/* ---------- Hero ---------- */
.pg-kc-hero {
	background: radial-gradient(130% 120% at 84% -10%, #16294C 0%, #0E1B3A 42%, #0A1430 100%);
	border-bottom: 1px solid #0A1430;
	color: #fff;
}

.pg-kc-hero-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 70px 64px 64px;
}

/* Matches .pg-lead-eyebrow-pill's styling exactly (leadership-page.css), which itself matches
   .pg-home-hero-kicker white — a plain label, no pill/background/border/padding. */
.pg-kc-hero-badge {
	font: 700 12.5px/1.5 'Hanken Grotesk', sans-serif;
	letter-spacing: .16em;
	color: #fff;
	margin-bottom: 24px;
}

.pg-kc-hero-grid {
	display: grid;
	grid-template-columns: 1.25fr 0.75fr;
	gap: 60px;
	align-items: end;
}

.pg-kc-hero-grid h1 {
	font: 700 60px/1.03 'Bricolage Grotesque', sans-serif !important;
	letter-spacing: -0.025em;
	margin: 0 0 22px !important;
	color: #fff !important;
}

.pg-kc-hero-grid p {
	font: 400 19px/1.62 'Hanken Grotesk', sans-serif !important;
	color: #B8C0D2 !important;
	max-width: 640px;
	margin: 0 !important;
	text-wrap: pretty;
}

.pg-kc-hero-side {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.pg-kc-hero-search {
	display: flex;
	background: rgba(255,255,255,.06);
	border: 1px solid rgba(255,255,255,.16);
	border-radius: 4px;
	overflow: hidden;
}

.pg-kc-hero-search input {
	flex: 1;
	min-width: 0;
	background: transparent;
	border: none;
	outline: none;
	color: #fff;
	font: 500 14px/1 'Hanken Grotesk', sans-serif;
	padding: 15px 18px;
}

.pg-kc-hero-search button {
	display: flex;
	align-items: center;
	padding: 0 16px;
	color: #8A93A6;
	background: none;
	border: none;
	cursor: pointer;
}

.pg-kc-hero-stats {
	display: flex;
	gap: 22px;
}

.pg-kc-hero-stats .num {
	font: 700 30px/1 'Bricolage Grotesque', sans-serif;
	color: #fff;
}

.pg-kc-hero-stats .label {
	font: 500 11.5px/1.3 'Hanken Grotesk', sans-serif;
	color: #8A93A6;
	margin-top: 5px;
}

/* ---------- Shared section eyebrow (numbered) ---------- */
.pg-kc-section-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 30px;
}

.pg-kc-section-eyebrow .n {
	flex-shrink: 0;
	width: 30px;
	height: 30px;
	background: #CB0E2A;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 3px;
	font: 800 13px/1 'Hanken Grotesk', sans-serif;
}

.pg-kc-section-eyebrow .t {
	font: 700 11.5px/1.5 'Hanken Grotesk', sans-serif;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #0C1A3A;
}

/* ---------- Today's Features ---------- */
.pg-kc-features {
	background: #fff;
	border-bottom: 1px solid #EEF0F4;
}

.pg-kc-features-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 64px 64px;
}

.pg-kc-features-grid {
	display: grid;
	grid-template-columns: 1.15fr 0.85fr;
	gap: 34px;
	align-items: stretch;
}

.pg-kc-feature-main {
	text-decoration: none;
	display: flex;
	flex-direction: column;
	background: #0C1A3A;
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(12,26,58,.16);
	transition: transform .15s ease;
}

.pg-kc-feature-main:hover { transform: translateY(-3px); }

.pg-kc-feature-main .img {
	display: block;
	width: 100%;
	height: 280px;
	background: #15294F center/cover no-repeat;
}

.pg-kc-feature-main .body { padding: 30px 34px 34px; }

.pg-kc-feature-main .meta {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px;
}

.pg-kc-feature-main .tag {
	font: 600 11.5px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .1em;
	color: #fff;
	background: #CB0E2A;
	padding: 7px 12px;
	border-radius: 6px;
}

.pg-kc-feature-main .cat {
	font: 600 11.5px/1 'Hanken Grotesk', sans-serif;
	color: #8FA0BE;
}

.pg-kc-feature-main .title {
	font: 700 28px/1.22 'Bricolage Grotesque', sans-serif;
	color: #fff;
	letter-spacing: -0.015em;
	margin-bottom: 14px;
	text-wrap: pretty;
}

.pg-kc-feature-main .excerpt {
	font: 400 15px/1.6 'Hanken Grotesk', sans-serif;
	color: #B8C0D2;
	margin-bottom: 22px;
	text-wrap: pretty;
}

.pg-kc-feature-main .cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font: 700 13.5px/1 'Hanken Grotesk', sans-serif;
	color: #fff;
}

.pg-kc-feature-main .cta span { color: #FF6477; }

.pg-kc-feature-list {
	display: flex;
	flex-direction: column;
	gap: 14px;
	justify-content: space-between;
}

.pg-kc-feature-item {
	text-decoration: none;
	display: flex;
	gap: 16px;
	padding: 18px 20px;
	background: #fff;
	border: 1px solid #ECEEF2;
	border-radius: 3px;
	transition: transform .15s ease, box-shadow .15s ease;
}

.pg-kc-feature-item:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 32px rgba(20,22,30,.09);
}

.pg-kc-feature-item .icon {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border-radius: 11px;
	background: #FCE9EB;
	color: #CB0E2A;
	display: flex;
	align-items: center;
	justify-content: center;
	font: 700 15px/1 'Bricolage Grotesque', sans-serif;
}

.pg-kc-feature-item .cat {
	display: block;
	font: 600 11.5px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .08em;
	color: #CB0E2A;
	margin-bottom: 7px;
}

.pg-kc-feature-item .title {
	display: block;
	font: 700 15px/1.3 'Bricolage Grotesque', sans-serif;
	color: #14161E;
}

/* ---------- Article grid + filter ---------- */
.pg-kc-articles {
	background: #F7F8FA;
	border-bottom: 1px solid #ECEEF2;
}

.pg-kc-articles-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 60px 64px 72px;
}

.pg-kc-articles-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 30px;
	flex-wrap: wrap;
	margin-bottom: 28px;
}

.pg-kc-articles-head h2 {
	font: 700 36px/1.08 'Bricolage Grotesque', sans-serif !important;
	letter-spacing: -0.022em;
	margin: 0 !important;
}

.pg-kc-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 34px;
}

.pg-kc-chip {
	cursor: pointer;
	font: 600 13px/1 'Hanken Grotesk', sans-serif;
	padding: 11px 18px;
	border-radius: 999px;
	border: 1px solid #E2E6EC;
	background: #fff;
	color: #42475A;
	transition: all .15s ease;
	text-decoration: none;
	display: inline-block;
}

.pg-kc-chip.is-active {
	border-color: #CB0E2A;
	background: #CB0E2A;
	color: #fff;
}

.pg-kc-grid-wrap {
	transition: opacity .15s ease;
}

.pg-kc-grid-wrap.is-loading {
	opacity: .45;
	pointer-events: none;
}

.pg-kc-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.pg-kc-card {
	text-decoration: none;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #ECEEF2;
	border-radius: 3px;
	overflow: hidden;
	transition: transform .15s ease, box-shadow .15s ease;
}

.pg-kc-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(20,22,30,.09);
}

.pg-kc-card .bar {
	height: 6px;
	background: linear-gradient(90deg, #CB0E2A, #E11D33);
}

.pg-kc-card .body {
	padding: 26px 26px 24px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.pg-kc-card .meta {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
}

.pg-kc-card .cat {
	font: 600 11.5px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .08em;
	color: #CB0E2A;
	background: #FCE9EB;
	padding: 6px 10px;
	border-radius: 6px;
}

.pg-kc-card .read-time {
	font: 500 11.5px/1 'Hanken Grotesk', sans-serif;
	color: #9097A4;
}

.pg-kc-card .title {
	font: 700 19px/1.32 'Bricolage Grotesque', sans-serif;
	color: #14161E;
	letter-spacing: -0.01em;
	margin-bottom: 11px;
	text-wrap: pretty;
}

.pg-kc-card .excerpt {
	font: 400 14px/1.6 'Hanken Grotesk', sans-serif;
	color: #5A5F6E;
	margin-bottom: 20px;
	text-wrap: pretty;
	flex: 1;
}

.pg-kc-card .cta {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font: 700 13px/1 'Hanken Grotesk', sans-serif;
	color: #14161E;
}

.pg-kc-card:hover .cta { color: #CB0E2A; }

.pg-kc-empty {
	padding: 50px 0;
	text-align: center;
	font: 500 15px/1.5 'Hanken Grotesk', sans-serif;
	color: #5A5F6E;
}

.pg-kc-pagination {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: 40px;
	padding-top: 26px;
	border-top: 1px solid #E2E6EC;
}

.pg-kc-pagination .info {
	font: 500 13px/1.5 'Hanken Grotesk', sans-serif;
	color: #646B7B;
}

.pg-kc-pagination .info strong { color: #14161E; }

.pg-kc-pagination .nav {
	display: flex;
	align-items: center;
	gap: 8px;
}

/* Page-number pills don't fit a phone in one row (244 pages → "1 2 3 … 244
   Next" is ~350px+); let them wrap and tighten the pill padding. */
@media (max-width: 700px) {
	.pg-kc-pagination .nav {
		flex-wrap: wrap;
		justify-content: center;
	}
	.pg-kc-pagination .nav a,
	.pg-kc-pagination .nav span {
		padding: 9px 13px;
	}
}

.pg-kc-pagination .nav a,
.pg-kc-pagination .nav span {
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #fff;
	border: 1px solid #E2E6EC;
	color: #42475A;
	padding: 11px 18px;
	border-radius: 4px;
	font: 700 13.5px/1 'Hanken Grotesk', sans-serif;
}

.pg-kc-pagination .nav a.next {
	background: #15294F;
	color: #fff;
	border-color: #15294F;
}

.pg-kc-pagination .nav a.next:hover { background: #CB0E2A; border-color: #CB0E2A; }

.pg-kc-pagination .nav span.current {
	background: #CB0E2A;
	border-color: #CB0E2A;
	color: #fff;
}

/* ---------- Mid CTA ---------- */
.pg-kc-cta {
	position: relative;
	overflow: hidden;
	background: radial-gradient(120% 150% at 78% -10%, #E11D33 0%, #CB0E2A 46%, #9E0A20 100%);
	color: #fff;
}

.pg-kc-cta-glow {
	position: absolute;
	top: -130px;
	right: -80px;
	width: 420px;
	height: 420px;
	background: radial-gradient(circle, rgba(255,255,255,.16), transparent 70%);
	border-radius: 50%;
}

.pg-kc-cta-inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 84px 64px;
	position: relative;
	text-align: center;
}

.pg-kc-cta-inner h2 {
	font: 700 44px/1.08 'Bricolage Grotesque', sans-serif !important;
	letter-spacing: -0.026em;
	margin: 0 auto 18px !important;
	max-width: 780px;
	color: #fff !important;
}

.pg-kc-cta-inner p {
	font: 400 18px/1.6 'Hanken Grotesk', sans-serif !important;
	color: #FCE3E7 !important;
	max-width: 620px;
	margin: 0 auto 38px !important;
	text-wrap: pretty;
}

.pg-kc-cta-btn {
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: #fff;
	color: #CB0E2A;
	padding: 19px 40px;
	border-radius: 5px;
	font: 700 16px/1 'Hanken Grotesk', sans-serif;
	box-shadow: 0 18px 44px rgba(0,0,0,.26);
	transition: transform .16s ease;
}

.pg-kc-cta-btn:hover { transform: translateY(-3px); }

@media (max-width: 900px) {
	.pg-kc-hero-grid,
	.pg-kc-features-grid {
		grid-template-columns: 1fr;
	}
	.pg-kc-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.pg-kc-grid {
		grid-template-columns: 1fr;
	}
}

/* ---------- Mobile-only section padding ----------
   600px matches this file's own existing smallest tier above, intentionally narrower than the 900px
   tablet-collapse tier, so this never fires on tablets or larger. .pg-kc-hero-inner gets the full
   padding swap to 40px/30px per instruction. The other 64px-horizontal-inset wrappers below keep
   their own tuned vertical rhythm and only get the horizontal fix. !important guards against inline
   per-section padding. */
@media (max-width: 600px) {
	.pg-kc-hero-inner { padding: 40px 30px !important; }
	.pg-kc-features-inner,
	.pg-kc-articles-inner,
	.pg-kc-cta-inner {
		padding-left: 30px !important;
		padding-right: 30px !important;
	}
}
