/* Shared report styles for both media outputs */

.report-cover--chapter .report-cover-inner {
	position: relative;
	padding-top: 3rem;
}

.report-cover-title,
.report-cover--chapter .report-cover-title {
	position: relative;
	padding: 0.35rem 1.75rem;
	border-radius: 999px;
	background-color: var(--c-headings-soft);
	display: inline-block;
}

.report-cover--chapter .report-cover-name {
	font-size: 1.1rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #6c757d;
	margin-bottom: .25rem;
}

.report-cover--chapter .report-cover-date.fs-4 {
	font-size: 1.5rem !important;
	font-weight: 700;
	color: var(--c-headings, #222);
	letter-spacing: .06em;
}

.report-cover {
	min-height: 100vh;
	padding: 4rem 2rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	text-align: center;
}

.report-cover-inner {
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.report-cover-tag {
	letter-spacing: .18em;
	font-size: .85rem;
	text-transform: uppercase;
	color: #6c757d;
	margin-bottom: 1.5rem;
}

.report-cover-subtitle {
	font-size: 1.2rem;
	font-weight: 400;
	margin-bottom: 2rem;
	color: #4b5563;
	max-width: 30rem;
	line-height: 1.5;
}

.report-cover-hero {
	margin: 1.5rem auto 2.5rem;
	max-width: 420px;
	width: 100%;
}

.report-cover-section-hero {
	margin: 5.5rem auto 4.5rem;
	max-width: 400px;
	width: 100%;
	display: flex;
	justify-content: center;
	gap: 0.75rem;
}

.report-cover-hero img,
.report-cover-section-hero img {
	display: block;
	border-radius: 20px;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
	object-fit: cover;
}

.report-cover-hero img { width: 100%; }
.report-cover-section-hero img { width: 48%; }

.report-cover-name-label {
	font-size: 0.95rem;
	text-transform: uppercase;
	letter-spacing: .16em;
	color: #6c757d;
	margin-bottom: .4rem;
}

.report-cover-name {
	font-size: 1.6rem;
	font-weight: 700;
	margin-bottom: 0.3rem;
}

.report-cover-date { font-size: 0.95rem; color: #6c757d; }

.report-cover-divider {
	width: 80px;
	height: 2px;
	background: var(--c-headings, #333);
	border-radius: 999px;
	margin: 1.5rem auto 1.8rem;
}

.report-cover h3 { font-size: 1em !important; }

svg text, .lbl, .arc-text { font-family: GothamSSm, ui-sans-serif, system-ui, sans-serif; }

.rim { stroke: #d9dde2; stroke-width: 8; fill: none; opacity: 1; vector-effect: non-scaling-stroke; pointer-events: none; }
.rim-inner { stroke: #9aa3af; stroke-width: 6; fill: none; opacity: .28; filter: url(#rimSoften); vector-effect: non-scaling-stroke; pointer-events: none; }
.arc-track { stroke: var(--c-border); stroke-width: 14; fill: none; stroke-linecap: butt; opacity: .35; vector-effect: non-scaling-stroke; pointer-events: none; }
.fill-bg { stroke-width: 16; fill: none; stroke-linecap: butt; vector-effect: non-scaling-stroke; stroke: url(#arcGrad); }
.tick-major { stroke: var(--c-muted-2); stroke-width: 2; stroke-linecap: round; vector-effect: non-scaling-stroke; pointer-events: none; }
.lbl { font-weight: 500; font-size: 8.8px; line-height: 1; fill: #495057; letter-spacing: .005em; pointer-events: none; }
.arc-text { font-weight: 700; font-size: 13.5px; line-height: 1; fill: var(--c-headings); letter-spacing: .06em; }
.dot-halo { fill: var(--c-paper); stroke: var(--c-border); stroke-width: 0.5; vector-effect: non-scaling-stroke; }
.dot-core { fill: var(--c-subhead); }

.fill-anim {
	stroke-dasharray: 0 200;
	animation: cdp-fill var(--dur, 900ms) ease-out forwards;
	animation-play-state: var(--play, paused);
}

.value-dot-rot {
	transform-origin: 110px 110px;
	transform: rotate(-225deg);
	animation: cdp-dot-rot var(--dur, 900ms) ease-out forwards;
	animation-play-state: var(--play, paused);
	pointer-events: none;
}

.needle-anim {
	transform-origin: 110px 110px;
	transform: rotate(-225deg);
	animation: cdp-needle var(--dur, 900ms) ease-out forwards;
	animation-play-state: var(--play, paused);
}

@keyframes cdp-fill { from { stroke-dasharray: 0 200; } to { stroke-dasharray: var(--fill) 200; } }
@keyframes cdp-dot-rot { from { transform: rotate(-225deg); } to { transform: rotate(calc(-225deg + 1.35deg * var(--fill))); } }
@keyframes cdp-needle { from { transform: rotate(-225deg); } to { transform: rotate(calc(-225deg + 1.35deg * var(--needle))); } }

.tacho-grid { max-width: 900px; margin: 0 auto; }

.tacho-headline {
	grid-column: 1 / -1;
	font-size: 0.95rem !important;
	font-weight: 500;
	letter-spacing: .1em;
	background-color: var(--c-muted);
	color: #fff;
	margin: 0 0 1.2rem;
	padding: 0.55rem 1.75rem;
	text-align: left;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.tacho-headline .tacho-subhead { font-weight: 600; font-size: 0.8rem; opacity: 0.9; }

.tacho-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 2.5rem;
	row-gap: 1.2rem;
	margin-bottom: 2.5rem;
}

.tacho-meta { display: flex; flex-direction: column; align-items: stretch; }
.tacho-meta .tacho-wrap { display: flex; justify-content: center; align-items: center; }
.tacho { display: block; width: 100%; height: auto; max-width: 240px; }
.tacho-text { font-size: 14px; line-height: 1.4; color: var(--c-text); margin-top: 4px; }

.interpretation {
	background-color: #f4f6f8;
	padding: 0.75rem 0.9rem;
	border-left: 4px solid var(--c-muted);
	margin-top: 0.2rem;
}

.interpretation h4 {
	font-size: 0.95rem;
	text-transform: uppercase;
	letter-spacing: .12em;
	color: #495057;
	margin-bottom: 0.35rem;
}

.interpretation p { font-size: 0.9rem; margin-bottom: .4rem; }
.interpretation p:last-child { margin-bottom: 0; }

@media (max-width: 700px) {
	.report-cover { padding: 2.5rem 1.25rem; }
	.report-cover-title { font-size: 1.9rem; }
	.report-cover-subtitle { font-size: 1.05rem; margin-bottom: 2rem; }
	.report-cover-hero { margin: 1.25rem auto 2rem; max-width: 360px; }
	.report-cover-name { font-size: 1.4rem; }
	.tacho-headline { font-size: 1.2em !important; }
	.tacho-row { display: flex; flex-direction: column; gap: 1rem; }

	.tacho-row > * { order: 0; }
	.tacho-row > :nth-child(1) { order: 1; }
	.tacho-row > :nth-child(3) { order: 2; }
	.tacho-row > :nth-child(2) { order: 3; }
	.tacho-row > :nth-child(4) { order: 4; }
}
