/* ---------------------------------------------------------------------
   Event Portfolio Scorecard v2 ([peilmark_scorecard2]).
   Builds on scorecard.css (tokens, buttons, gate box), loaded first.
   Status colours always come with their text label.
   --------------------------------------------------------------------- */

.pm-sc2 {
	--pm-sc2-green: #2E7D4F;
	--pm-sc2-amber: #B7791F;
	--pm-sc2-red: #B0442C;
	--pm-sc2-gray: #7A808C;
}

.pm-sc2-p { font-size: 17px; line-height: 1.6; color: var(--pm-sc-soft); max-width: 40em; }
.pm-sc2-big { font-size: 19px; color: rgba(15, 26, 46, 0.84); }
.pm-sc2-small { font-size: 14px; color: var(--pm-sc-soft); max-width: 44em; }

/* Intro */
.pm-sc2-intro { display: grid; gap: 20px; }
.pm-sc2-intro .pm-sc-h1 { max-width: 16em; margin-bottom: 6px; }
.pm-sc2-start { display: grid; gap: 12px; justify-items: start; margin-top: 18px; }

/* Questions */
.pm-sc2-progress { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 36px; }
.pm-sc2-progress span { height: 3px; background: var(--pm-sc-line); border-radius: 2px; }
.pm-sc2-progress span.done { background: var(--pm-sc-ink); }
.pm-sc2-progress span.now { background: var(--pm-sc-cerise); }

.pm-sc .pm-sc2-q { border: 0; margin: 0; padding: 26px 0; border-top: 1px solid var(--pm-sc-line); min-width: 0; display: grid; gap: 12px; }
.pm-sc .pm-sc2-q[hidden] { display: none; }
.pm-sc .pm-sc2-q legend { padding: 0; float: left; width: 100%; }
.pm-sc .pm-sc2-q legend + * { clear: both; }
.pm-sc2-qtext { display: block; font-size: 18px; line-height: 1.45; font-weight: 500; max-width: 38em; }
.pm-sc2-hint { font-size: 14px; color: var(--pm-sc-soft); }

/* Follow-up questions sit under their parent. */
.pm-sc .pm-sc2-branch { border-top: 0; margin-top: -10px; padding: 4px 0 26px 20px; border-left: 2px solid var(--pm-sc-wash); }
.pm-sc .pm-sc2-branch .pm-sc2-qtext { font-size: 17px; }

.pm-sc2-options { display: grid; gap: 6px; max-width: 40em; }
.pm-sc2-opt[hidden] { display: none; }
.pm-sc2-opt input { position: absolute; opacity: 0; pointer-events: none; }
.pm-sc2-opt label {
	display: block;
	margin: 0;
	padding: 12px 16px 12px 44px;
	position: relative;
	font-size: 15px;
	line-height: 1.45;
	background: var(--pm-sc-surface);
	border: 1px solid var(--pm-sc-line);
	border-radius: 2px;
	cursor: pointer;
	transition: border-color .12s, background .12s;
}
.pm-sc2-opt label::before {
	content: "";
	position: absolute;
	left: 16px;
	top: 15px;
	width: 14px;
	height: 14px;
	border: 1.5px solid var(--pm-sc-faint);
	border-radius: 50%;
	background: var(--pm-sc-surface);
}
.pm-sc2-opt label:hover { border-color: var(--pm-sc-faint); }
.pm-sc2-opt input:checked + label { border-color: var(--pm-sc-cerise-ink); background: var(--pm-sc-wash); font-weight: 600; }
.pm-sc2-opt input:checked + label::before { border-color: var(--pm-sc-cerise-ink); background: var(--pm-sc-cerise-ink); box-shadow: inset 0 0 0 3px var(--pm-sc-surface); }
.pm-sc2-opt input:focus-visible + label { outline: 2px solid var(--pm-sc-ink); outline-offset: 2px; }

.pm-sc2-err { font-size: 14px; font-weight: 600; color: var(--pm-sc-cerise-ink); }
.pm-sc2-err[hidden] { display: none; }
.pm-sc .pm-sc2-q[aria-invalid="true"] .pm-sc2-opt label { border-color: rgba(181, 58, 101, 0.5); }

.pm-sc2-note { margin-top: 10px; padding: 24px; background: var(--pm-sc-surface); border: 1px solid var(--pm-sc-line); border-radius: 2px; display: grid; gap: 10px; }
.pm-sc2-note p { font-size: 15px; color: var(--pm-sc-soft); max-width: 40em; }

/* Result */
.pm-sc2-result { display: grid; gap: 40px; }
.pm-sc2-head { display: grid; gap: 14px; }

.pm-sc .pm-sc2-areas { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--pm-sc-line); }
.pm-sc .pm-sc2-area { margin: 0; padding: 22px 0 22px 18px; border-top: 1px solid var(--pm-sc-line); display: grid; gap: 8px; position: relative; }
.pm-sc2-area::before { content: ""; position: absolute; left: 0; top: 22px; bottom: 22px; width: 4px; border-radius: 2px; background: var(--pm-sc2-gray); }
.pm-sc2-area-green::before { background: var(--pm-sc2-green); }
.pm-sc2-area-amber::before { background: var(--pm-sc2-amber); }
.pm-sc2-area-red::before { background: var(--pm-sc2-red); }
.pm-sc2-area-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; }
.pm-sc2-num { font-family: var(--pm-sc-serif); color: var(--pm-sc-cerise-ink); font-size: 15px; }
.pm-sc2-area p { font-size: 16px; color: var(--pm-sc-soft); max-width: 40em; }

.pm-sc2-chip { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--pm-sc-ink); }
.pm-sc2-chip i { width: 11px; height: 11px; border-radius: 50%; background: var(--pm-sc2-gray); flex: none; }
.pm-sc2-green i { background: var(--pm-sc2-green); }
.pm-sc2-amber i { background: var(--pm-sc2-amber); }
.pm-sc2-red i { background: var(--pm-sc2-red); }

.pm-sc2-first { display: grid; gap: 12px; padding: 30px 32px; background: var(--pm-sc-surface); border: 1px solid var(--pm-sc-line); border-left: 3px solid var(--pm-sc-cerise-ink); border-radius: 2px; }
.pm-sc2-first .pm-sc-eyebrow { margin: 0; color: var(--pm-sc-cerise-ink); }
.pm-sc2-first-text { font-family: var(--pm-sc-serif); font-size: 21px; line-height: 1.4; max-width: 34em; }
.pm-sc2-why { font-size: 15px; color: var(--pm-sc-soft); }

.pm-sc2-notes { display: grid; gap: 10px; }
.pm-sc .pm-sc2-notes ul { margin: 0; padding: 0 0 0 18px; display: grid; gap: 6px; }
.pm-sc2-notes li { font-size: 15px; color: var(--pm-sc-soft); max-width: 42em; }

.pm-sc2-support .pm-sc2-q { padding-bottom: 0; }

.pm-sc2-report p { max-width: 40em; }
.pm-sc .pm-sc2-report input[aria-invalid="true"] { border-color: var(--pm-sc-cerise); }
.pm-sc .pm-sc2-quiet-light { color: rgba(250, 247, 242, 0.85); }

.pm-sc2-discuss { display: grid; gap: 14px; }
.pm-sc .pm-sc2-btn-ink { background: var(--pm-sc-ink); }
.pm-sc .pm-sc2-btn-ink:hover,
.pm-sc .pm-sc2-btn-ink:focus-visible { background: var(--pm-sc-cerise-ink); }

/* EPM box on the result: the gap comes from the grid. */
.pm-sc2-result .pm-sc-epm { margin-top: 0; }

/* Thank-you page (/confirmed/?list=scorecard). */
.pm-sc.pm-sc2-thanks { max-width: none; margin: 0; padding: 0 0 8px; display: grid; gap: 16px; }
.pm-sc2-thanks .pm-sc-keep { border-top-color: var(--pm-sc-line); }
.pm-sc2-thanks .pm-sc-legal { font-size: 13px; color: var(--pm-sc-soft); }
/* pages.css styles every content link (ink, cerise underline) at 0,4,2;
   buttons opt out. The doubled class lifts this to 0,5,1 so it wins. */
.pm-pages .entry-content .pm-sc2-thanks a.pm-sc-btn.pm-sc-btn { color: var(--pm-sc-paper); text-decoration: none; }
.pm-pages .entry-content .pm-sc2-thanks a.pm-sc-btn.pm-sc-btn:hover,
.pm-pages .entry-content .pm-sc2-thanks a.pm-sc-btn.pm-sc-btn:focus-visible { background: var(--pm-sc-ink); color: var(--pm-sc-paper); }

@media (max-width: 640px) {
	.pm-sc2-first { padding: 24px 20px; }
	.pm-sc .pm-sc2-branch { padding-left: 14px; }
	.pm-sc2-opt label { padding-left: 40px; }
	.pm-sc2-opt label::before { left: 14px; }
}

/* Print or save as PDF: the profile and the first step, nothing interactive. */
@media print {
	header, footer, .site-header, .site-footer, #masthead, #colophon, .pm-announce, .pm-sc2-noprint { display: none !important; }
	.pm-sc2-result { gap: 20px; }
	.pm-sc2-area::before, .pm-sc2-chip i { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.pm-sc2-first { border: 1px solid #999; }
}