/* Case Studies page — bespoke, one-off */

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

.pg-cs-hero-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 72px 64px 80px;
	display: grid;
	grid-template-columns: 1.08fr 0.92fr;
	gap: 60px;
	align-items: center;
}

/* 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-cs-hero-pill {
	font: 700 12.5px/1.5 'Hanken Grotesk', sans-serif;
	letter-spacing: .16em;
	color: #fff;
	margin-bottom: 24px;
}

@keyframes pgCsLivePulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: .6; transform: scale(.85); }
}

.pg-cs-h1 {
	font: 700 64px/1.02 'Bricolage Grotesque', sans-serif !important;
	letter-spacing: -0.025em;
	margin: 0 0 26px !important;
	color: #fff !important;
}

.pg-cs-h1 .accent { color: #FF6477; }

.pg-cs-hero-sub {
	font: 400 20px/1.6 'Hanken Grotesk', sans-serif !important;
	color: #B8C0D2 !important;
	max-width: 560px;
	margin: 0 0 38px !important;
}

.pg-cs-hero-sub strong { color: #fff; font-weight: 700; }

.pg-cs-hero-ctas {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 42px;
	flex-wrap: wrap;
}

.pg-cs-btn-solid {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	white-space: nowrap;
	background: #CB0E2A;
	color: #fff;
	padding: 17px 30px;
	border-radius: 4px;
	font: 700 15.5px/1 'Hanken Grotesk', sans-serif;
	text-decoration: none;
	box-shadow: 0 12px 30px rgba(203,14,42,.32);
	transition: transform .16s ease, box-shadow .16s ease;
}

.pg-cs-btn-solid:hover { transform: translateY(-2px); box-shadow: 0 16px 38px rgba(203,14,42,.4); }

.pg-cs-btn-ghost {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	white-space: nowrap;
	color: #fff;
	padding: 17px 24px;
	border-radius: 4px;
	border: 1px solid rgba(255,255,255,.22);
	font: 600 15px/1 'Hanken Grotesk', sans-serif;
	text-decoration: none;
	background: transparent;
	transition: border-color .16s ease;
}

.pg-cs-btn-ghost:hover { border-color: #fff; }

.pg-cs-hero-trust {
	display: flex;
	align-items: center;
	gap: 22px;
	font: 500 13px/1.5 'Hanken Grotesk', sans-serif;
	color: #fff;
	flex-wrap: wrap;
}

.pg-cs-hero-trust .strong { color: #fff; font-weight: 700; }

.pg-cs-hero-trust .dot {
	width: 4px;
	height: 4px;
	background: #CB0E2A;
	border-radius: 50%;
}

/* Hero live-metrics card */
.pg-cs-metrics-card {
	background: #0C1A3A;
	border-radius: 3px;
	padding: 32px;
	box-shadow: 0 30px 70px rgba(14,16,22,.28);
	position: relative;
}

.pg-cs-metrics-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 22px;
	font: 500 12.5px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .12em;
	color: #C2C8D4;
}

.pg-cs-metrics-head .live {
	display: flex;
	align-items: center;
	gap: 7px;
	color: #46C2A8;
}

.pg-cs-metrics-head .live .dot {
	width: 6px;
	height: 6px;
	background: #46C2A8;
	border-radius: 50%;
	animation: pgCsLivePulse 2s ease-in-out infinite;
}

.pg-cs-metric-hero {
	background: linear-gradient(135deg,#14B981 0%,#0E9468 100%);
	border-radius: 3px;
	padding: 24px 26px;
	margin-bottom: 14px;
}

.pg-cs-metric-hero .label {
	font: 500 12.5px/1 'Hanken Grotesk', sans-serif;
	color: #CFF3E5;
	margin-bottom: 10px;
}

.pg-cs-metric-hero .row {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

.pg-cs-metric-hero .v {
	font: 700 52px/0.9 'Bricolage Grotesque', sans-serif;
	color: #fff;
	letter-spacing: -0.02em;
}

.pg-cs-metric-hero .v .unit { font-size: 26px; }

.pg-cs-metric-hero .bars {
	display: flex;
	gap: 4px;
	align-items: flex-end;
	height: 42px;
}

.pg-cs-metric-hero .bars div { width: 7px; border-radius: 2px; }

.pg-cs-metrics-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

.pg-cs-metric-box {
	background: #15294F;
	border: 1px solid rgba(255,255,255,.06);
	border-radius: 3px;
	padding: 18px;
}

.pg-cs-metric-box .label {
	font: 500 11px/1.3 'Hanken Grotesk', sans-serif;
	color: #C2C8D4;
	margin-bottom: 10px;
}

.pg-cs-metric-box .v {
	font: 700 32px/0.9 'Bricolage Grotesque', sans-serif;
	color: #46C2A8;
}

.pg-cs-metric-box .v.blue { color: #4FA3FF; }
.pg-cs-metric-box .v .unit { font-size: 16px; }

/* ---------- Shared numbered badge / heading ---------- */
.pg-cs-badge {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 18px;
}

.pg-cs-badge .num {
	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-cs-badge .label {
	font: 700 11.5px/1.5 'Hanken Grotesk', sans-serif;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #0C1A3A;
}

.pg-cs-h2 {
	font: 700 44px/1.08 'Bricolage Grotesque', sans-serif !important;
	letter-spacing: -0.024em;
	margin: 0 0 16px !important;
	max-width: 880px;
	color: #14161E !important;
}

.pg-cs-section-sub {
	font: 400 18px/1.6 'Hanken Grotesk', sans-serif !important;
	color: #4D5260 !important;
	max-width: 780px;
	margin: 0 0 44px !important;
}

/* ---------- Named flagship case studies ---------- */
.pg-cs-named-section {
	background: #fff;
}

.pg-cs-named-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 88px 64px 80px;
}

.pg-cs-case-card {
	border: 1px solid #E8EAEF;
	border-radius: 3px;
	overflow: hidden;
	margin-bottom: 26px;
	display: grid;
	grid-template-columns: 1fr 320px;
}

.pg-cs-case-card:last-child { margin-bottom: 0; }

.pg-cs-case-main {
	padding: 42px 46px 40px;
}

.pg-cs-case-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin-bottom: 26px;
}

.pg-cs-case-head img { height: 30px; width: auto; }

.pg-cs-case-tag {
	font: 600 11.5px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .12em;
	color: #15294F;
	background: #EDF1F7;
	padding: 7px 12px;
	border-radius: 7px;
}

.pg-cs-case-tag.is-red { color: #CB0E2A; background: #FCE9EB; }

.pg-cs-case-main h3 {
	font: 700 27px/1.2 'Bricolage Grotesque', sans-serif !important;
	letter-spacing: -0.015em;
	margin: 0 0 22px !important;
	max-width: 560px;
	color: #14161E !important;
}

.pg-cs-case-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 26px 32px;
}

.pg-cs-case-grid .label {
	font: 700 12px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .12em;
	color: #9097A4;
	margin-bottom: 9px;
}

.pg-cs-case-grid .label.is-green { color: #12996B; }

.pg-cs-case-grid p {
	font: 400 14px/1.62 'Hanken Grotesk', sans-serif !important;
	color: #5A5F6E !important;
	margin: 0 !important;
}

.pg-cs-case-outcome {
	grid-column: 1 / -1;
	background: #F7F8FA;
	border-radius: 3px;
	padding: 20px 24px;
}

.pg-cs-case-outcome p { color: #42475A !important; }

.pg-cs-case-quote {
	grid-column: 1 / -1;
	background: #fff;
	border: 1px solid #ECEEF2;
	border-left: 3px solid #12996B;
	border-radius: 3px;
	padding: 22px 26px;
}

.pg-cs-case-quote p {
	font: 400 14px/1.66 'Hanken Grotesk', sans-serif !important;
	color: #42475A !important;
	margin: 0 0 12px !important;
}

/* Aug-12 "last minute" drop: attribution names drop from semibold to regular
   (both case-quote attributions on this page — Lipman and Gionfriddo). */
.pg-cs-case-quote .who {
	font: 400 13px/1.4 'Hanken Grotesk', sans-serif;
	color: #14161E;
}

.pg-cs-case-quote .who span { color: #5F6675; }

.pg-cs-case-side {
	background: #0C1A3A;
	color: #fff;
	padding: 42px 34px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 26px;
}

.pg-cs-case-side-label {
	font: 500 12px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .12em;
	color: #8FA0BE;
}

.pg-cs-case-side-body {
	display: flex;
	flex-direction: column;
	gap: 26px;
}

.pg-cs-case-side-body img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 3px;
}

.pg-cs-case-side-body .caption {
	font: 500 11.5px/1.5 'Hanken Grotesk', sans-serif;
	letter-spacing: .08em;
	color: #8FA0BE;
	margin-top: 9px;
}

.pg-cs-case-side-body .stat-v {
	font: 800 46px/1 'Bricolage Grotesque', sans-serif;
	letter-spacing: -0.025em;
}

.pg-cs-case-side-body .stat-v.red { color: #FF6477; }
.pg-cs-case-side-body .stat-v.green { color: #46C2A8; }

.pg-cs-case-side-body .stat-k {
	font: 500 12.5px/1.4 'Hanken Grotesk', sans-serif;
	color: #AEB6C8;
	margin-top: 6px;
}

/* ---------- Case Study Index ---------- */
.pg-cs-index-section {
	background: #EEF2F8;
	border-top: 1px solid #DEE5F0;
}

.pg-cs-index-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 80px 64px;
}

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

.pg-cs-index-card {
	text-decoration: none;
	background: #fff;
	border: 1px solid #E8EAEF;
	border-radius: 3px;
	padding: 30px 30px 26px;
	display: flex;
	flex-direction: column;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.pg-cs-index-card:hover { transform: translateY(-3px); box-shadow: 0 18px 44px rgba(20,22,30,.1); border-color: #D9DEE8; }

.pg-cs-index-card .tag {
	font: 700 11.5px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .12em;
	color: #CB0E2A;
}

.pg-cs-index-card .tag.is-blue { color: #15294F; }

.pg-cs-index-card .t {
	font: 700 20px/1.25 'Bricolage Grotesque', sans-serif;
	color: #14161E;
	margin: 14px 0 10px;
}

.pg-cs-index-card .d {
	font: 400 14px/1.6 'Hanken Grotesk', sans-serif;
	color: #5A5F6E;
	flex: 1;
}

.pg-cs-index-card .foot {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid #EEF0F4;
}

.pg-cs-index-card .foot .meta {
	font: 600 12px/1.4 'Hanken Grotesk', sans-serif;
	color: #9097A4;
}

.pg-cs-index-card .foot .cta {
	font: 700 13px/1 'Hanken Grotesk', sans-serif;
	color: #CB0E2A;
}

/* ---------- Media & Press strip ---------- */
.pg-cs-media-section {
	background: #EEF2F8;
	border-top: 1px solid #DEE5F0;
}

.pg-cs-media-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 80px 64px;
}

.pg-cs-media-head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 46px;
	gap: 40px;
	flex-wrap: wrap;
}

.pg-cs-media-head h2 {
	font: 700 46px/1.06 'Bricolage Grotesque', sans-serif !important;
	letter-spacing: -0.022em;
	margin: 0 !important;
	max-width: 640px;
	color: #14161E !important;
}

.pg-cs-media-head .aside {
	flex-shrink: 0;
	font: 500 13px/1.5 'Hanken Grotesk', sans-serif;
	color: #5F6675;
	max-width: 280px;
	text-align: right;
}

.pg-cs-media-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
	margin-bottom: 26px;
}

.pg-cs-media-card {
	background: #fff;
	border: 1px solid #ECEEF2;
	border-radius: 3px;
	padding: 26px 28px 28px;
	text-decoration: none;
	color: #14161E;
	display: flex;
	flex-direction: column;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.pg-cs-media-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(20,22,30,.08); border-color: #D9DDE5; }

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

.pg-cs-media-card .cat {
	font: 600 12px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .1em;
	padding: 6px 11px;
	border-radius: 6px;
}

.pg-cs-media-card .cat.red { color: #CB0E2A; background: #FCE9EB; }
.pg-cs-media-card .cat.green { color: #12996B; background: #E6F6F0; }
.pg-cs-media-card .cat.blue { color: #2F6FED; background: #EAF1FE; }

.pg-cs-media-card .src {
	font: 500 12px/1 'Hanken Grotesk', sans-serif;
	color: #646B7B;
}

.pg-cs-media-card .t {
	font: 700 17px/1.35 'Bricolage Grotesque', sans-serif;
	letter-spacing: -0.01em;
	margin-bottom: 18px;
}

.pg-cs-media-card .readmore {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font: 600 13px/1 'Hanken Grotesk', sans-serif;
	color: #CB0E2A;
}

.pg-cs-media-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	padding-top: 22px;
	border-top: 1px solid #E4E7EC;
}

.pg-cs-media-footer .note {
	font: 400 13.5px/1.55 'Hanken Grotesk', sans-serif;
	color: #646B7B;
}

.pg-cs-media-footer a {
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font: 700 13.5px/1 'Hanken Grotesk', sans-serif;
	color: #CB0E2A;
}

/* ---------- FAQ ---------- */
.pg-cs-faq-section {
	background: #EEF2F8;
	border-top: 1px solid #DEE5F0;
}

.pg-cs-faq-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 80px 64px;
}

.pg-cs-faq-cols {
	column-count: 2;
	column-gap: 20px;
}

.pg-cs-faq-item {
	background: #fff;
	border: 1px solid #ECEEF2;
	border-radius: 10px;
	overflow: hidden;
	margin: 0 0 16px;
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
}

.pg-cs-faq-item summary {
	cursor: pointer;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	padding: 22px 24px;
	font: 700 16px/1.4 'Bricolage Grotesque', sans-serif;
	color: #14161E;
	list-style: none;
}

.pg-cs-faq-item summary::-webkit-details-marker { display: none; }

.pg-cs-faq-item .ic {
	flex-shrink: 0;
	font: 300 28px/0.7 'Hanken Grotesk', sans-serif;
	color: #CB0E2A;
}

.pg-cs-faq-item .a {
	padding: 0 24px 22px;
	font: 400 14.5px/1.62 'Hanken Grotesk', sans-serif;
	color: #5A5F6E;
}

.pg-cs-faq-item .who {
	display: block;
	margin-top: 13px;
	font: 600 12px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .08em;
	color: #CB0E2A;
}

/* ---------- Segments & Related ---------- */
.pg-cs-segments-section {
	background: #EEF2F8;
	border-top: 1px solid #DEE5F0;
}

.pg-cs-segments-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 54px 64px 52px;
}

.pg-cs-segments-eyebrow {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 28px;
}

.pg-cs-segments-eyebrow .bar { width: 24px; height: 2px; background: #CB0E2A; }

.pg-cs-segments-eyebrow span:last-child {
	font: 700 11.5px/1 'Hanken Grotesk', sans-serif;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #646B7B;
}

.pg-cs-segments-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.pg-cs-segments-pills span,
.pg-cs-segments-pills a {
	display: inline-flex;
	align-items: center;
	padding: 13px 22px;
	background: #fff;
	border: 1px solid #E4E7EC;
	border-radius: 999px;
	font: 600 14.5px/1 'Hanken Grotesk', sans-serif;
	color: #2A2E37;
	text-decoration: none;
}

.pg-cs-segments-pills a:hover {
	border-color: #B8BEC9;
	color: #14161E;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
	.pg-cs-hero-inner,
	.pg-cs-case-card,
	.pg-cs-index-grid,
	.pg-cs-media-grid,
	.pg-cs-metrics-grid,
	.pg-cs-media-head {
		grid-template-columns: 1fr;
	}
	.pg-cs-faq-cols { column-count: 1; }
	.pg-cs-case-grid { grid-template-columns: 1fr; }
	.pg-cs-media-head .aside { text-align: left; max-width: none; }
}

/* ---------- Mobile-only section padding ----------
   560px is intentionally narrower than the 900px tablet-collapse tier above, so this never fires on
   tablets or larger. .pg-cs-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, so every section's left/right edge still lines up with the hero. !important guards
   against inline per-section padding. */
@media (max-width: 560px) {
	.pg-cs-hero-inner { padding: 40px 30px !important; }
	.pg-cs-named-inner,
	.pg-cs-index-inner,
	.pg-cs-media-inner,
	.pg-cs-faq-inner,
	.pg-cs-segments-inner {
		padding-left: 30px !important;
		padding-right: 30px !important;
	}
}

/* Media footer: disclaimer removed — coverage link right on desktop, left on phones */
.pg-cs-media-footer a { margin-left: auto; }
@media (max-width: 560px) {
	.pg-cs-media-footer a { margin-left: 0; }
}