/* ==========================================================================
   The long-form article layout: breadcrumbs, title, content column and the
   sticky contents rail. Also the author archive, which reuses the same
   typography. Rich text, tables, FAQ and the signature come from main.css.
   ========================================================================== */

.pp93-entry { padding-block: 48px 80px; }

/* --- Breadcrumbs ---------------------------------------------------------- */

.pp93-trail {
	margin-bottom: 20px;
	font-size: 13px;
	line-height: 20px;
	color: var(--pp93-muted);
}

.pp93-trail__list { display: flex; flex-wrap: wrap; gap: 6px; }

.pp93-trail__item + .pp93-trail__item::before {
	content: '/';
	margin-right: 6px;
	color: rgba(61, 79, 183, .18);
}

.pp93-trail a { transition: color .18s ease; }
.pp93-trail a:hover { color: var(--pp93-ink); text-decoration: underline; text-underline-offset: 3px; }
.pp93-trail [aria-current="page"] { color: var(--pp93-ink); font-weight: 600; }

/* --- Kicker and fact chips -------------------------------------------------
   The article head used to be a run of "label value · label value" text. It is a
   row of chips now: each fact carries its own icon and sits in its own box, so the
   row reads as a set of properties rather than one long sentence. */

.pp93-entry__kicker { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }

.pp93-entry__term {
	display: inline-flex;
	align-items: center;
	padding: 6px 16px;
	border-radius: 999px;
	background: linear-gradient(97deg, #00096A, #243DC6);
	color: #FFFFFF;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .6px;
	text-transform: uppercase;
	transition: filter .18s ease;
}

.pp93-entry__term:hover { filter: brightness(1.15); }

.pp93-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 28px;
}

.pp93-fact {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 18px 10px 12px;
	border-radius: 14px;
	background: #F5F7FE;
	box-shadow: inset 0 0 0 1px rgba(61, 79, 183, .16);
}

.pp93-fact__icon {
	display: grid;
	place-items: center;
	flex: none;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #FFFFFF;
	box-shadow: 0 2px 6px rgba(0, 9, 106, .12);
	color: var(--pp93-blue);
	overflow: hidden;
}

.pp93-fact__icon svg { width: 20px; height: 20px; }

/* The author chip carries a face instead of a glyph. */
.pp93-fact__icon--face { background: linear-gradient(97deg, #00096A, #243DC6); }
.pp93-fact__icon--face img { width: 100%; height: 100%; object-fit: cover; }
.pp93-fact__icon--face .pp93-author__initial { font-size: 15px; }

.pp93-fact__body { display: flex; flex-direction: column; line-height: 1.25; }

.pp93-fact__key {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--pp93-muted);
}

.pp93-fact__val { font-size: 15px; font-weight: 600; color: var(--pp93-ink); }
a.pp93-fact__val:hover { color: var(--pp93-blue); text-decoration: underline; text-underline-offset: 3px; }

/* --- The live chip -------------------------------------------------------- */

.pp93-fact--live { background: rgba(47, 168, 79, .09); box-shadow: inset 0 0 0 1px rgba(47, 168, 79, .28); }
.pp93-fact--live .pp93-fact__val { color: #1E7A38; }

.pp93-fact__pulse {
	flex: none;
	width: 10px;
	height: 10px;
	margin-left: 6px;
	border-radius: 50%;
	background: #2FA84F;
	box-shadow: 0 0 0 0 rgba(47, 168, 79, .55);
	animation: pp93-live 2s ease-out infinite;
}

@keyframes pp93-live {
	70%  { box-shadow: 0 0 0 9px rgba(47, 168, 79, 0); }
	100% { box-shadow: 0 0 0 0 rgba(47, 168, 79, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.pp93-fact__pulse { animation: none; }
}

/* --- Head ----------------------------------------------------------------- */

.pp93-entry__head { margin-bottom: 48px; }

.pp93-entry__title {
	font-size: 44px;
	line-height: 52px;
	font-weight: 800;
	letter-spacing: -0.5px;
}

.pp93-entry__lead {
	margin-top: 16px;
	max-width: 760px;
	font-size: 18px;
	line-height: 28px;
	color: #48484A;
}

.pp93-entry__cover {
	margin-top: 32px;
	overflow: hidden;
	border: 1px solid rgba(61, 79, 183, .18);
	border-radius: var(--pp93-radius-lg);
	background: #F5F7FE;
}

.pp93-entry__cover-img {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.pp93-entry__cover-caption {
	padding: 12px 20px;
	border-top: 1px solid rgba(61, 79, 183, .18);
	color: var(--pp93-muted);
	font-size: 13px;
	line-height: 20px;
}

/* --- Two-column body ------------------------------------------------------ */

/* One grid for the whole article: the head and the copy stack in the left column and
   the rail occupies the right one from the very top, so the contents card lines up with
   the breadcrumbs rather than starting below the title. */
.pp93-entry__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	column-gap: 64px;
	align-items: start;
}

.pp93-entry__head  { grid-column: 1; grid-row: 1; }
.pp93-entry__main { grid-column: 1; grid-row: 2; min-width: 0; }
.pp93-entry__rail { grid-column: 2; grid-row: 1 / span 2; position: sticky; top: 104px; }

.pp93-entry__body { min-width: 0; }

/* --- Author archive -------------------------------------------------------- */

.pp93-author-page { padding-block: 48px 80px; }

.pp93-author-page__head {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr);
	gap: 28px;
	align-items: center;
	margin-bottom: 28px;
}

.pp93-author-page__avatar {
	width: 120px;
	height: 120px;
	overflow: hidden;
	border-radius: 50%;
	background: var(--pp93-ink);
}

.pp93-author-page__avatar img { width: 100%; height: 100%; object-fit: cover; }

.pp93-author-page__avatar .pp93-author__initial { font-size: 40px; }

.pp93-author-page__eyebrow {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--pp93-blue);
}

.pp93-author-page__name {
	margin-top: 6px;
	font-size: 40px;
	line-height: 48px;
	font-weight: 800;
}

.pp93-author-page__role { margin-top: 4px; color: var(--pp93-muted); }

.pp93-author-page__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	margin-top: 12px;
	font-size: 14px;
	color: var(--pp93-muted);
}

.pp93-author-page__facts strong { color: var(--pp93-ink); }

.pp93-author-page__bio { max-width: 900px; }

.pp93-author-page__list { margin-top: 56px; }

.pp93-author-page__list-title {
	margin-bottom: 24px;
	font-size: 28px;
	line-height: 34px;
	font-weight: 800;
}

.pp93-author-page__empty { color: var(--pp93-muted); }

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1279px) {
	/* One column below this width: a 320px rail beside the copy leaves the text under
	   600px, which is too narrow to read comfortably. The rail moves above the copy,
	   where it still works as a jump menu, and stops being sticky — a bar that follows
	   the reader on a small screen costs more room than it returns. */
	.pp93-entry__grid { grid-template-columns: minmax(0, 1fr); row-gap: 32px; }
	.pp93-entry__head  { grid-column: 1; grid-row: 1; }
	.pp93-entry__rail { grid-column: 1; grid-row: 2; position: static; }
	.pp93-entry__main { grid-column: 1; grid-row: 3; }
}

@media (max-width: 1023px) {
	.pp93-entry__title { font-size: 34px; line-height: 42px; }
	.pp93-author-page__name { font-size: 32px; line-height: 40px; }
}

@media (max-width: 767px) {
	.pp93-facts { gap: 8px; margin-top: 20px; }
	.pp93-fact { padding: 8px 14px 8px 10px; gap: 10px; border-radius: 12px; }
	.pp93-fact__icon { width: 30px; height: 30px; }
	.pp93-fact__icon svg { width: 16px; height: 16px; }
	.pp93-fact__key { font-size: 10px; }
	.pp93-fact__val { font-size: 14px; }
	.pp93-entry__term { padding: 5px 12px; font-size: 12px; }

	.pp93-entry { padding-block: 28px 56px; }
	.pp93-entry__head { margin-bottom: 28px; }
	.pp93-entry__title { font-size: 27px; line-height: 34px; }
	.pp93-entry__lead { font-size: 16px; line-height: 25px; }
	.pp93-entry__cover { margin-top: 24px; }

	.pp93-author-page { padding-block: 28px 56px; }
	.pp93-author-page__head { grid-template-columns: 1fr; gap: 18px; }
	.pp93-author-page__avatar { width: 88px; height: 88px; }
	.pp93-author-page__avatar .pp93-author__initial { font-size: 30px; }
	.pp93-author-page__name { font-size: 26px; line-height: 32px; }
	.pp93-author-page__list-title { font-size: 22px; line-height: 28px; }
}
