/* Topic reading surfaces and their home/resource entry points. */
.topic-guide {
	margin: 0 0 36px;
	padding: clamp(20px, 3vw, 36px);
	border-radius: var(--dafa-radius);
	background: var(--dafa-surface);
	color: var(--dafa-text);
}
.topic-guide__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 24px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--dafa-border);
}
.topic-guide__label {
	margin: 0;
	font-size: 14px;
	font-weight: 650;
	color: var(--dafa-accent);
}
.topic-guide__skip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	color: var(--dafa-text-soft);
	font-size: 13px;
	text-decoration: none;
}
.topic-guide__skip:hover { color: var(--dafa-accent); }
.topic-guide .topic-guide__body {
	max-width: none;
	font-size: 16px;
	line-height: 1.95;
	overflow-wrap: anywhere;
}
.topic-guide .topic-guide__body > :first-child { margin-top: 0; }
.topic-guide .topic-guide__body > :last-child { margin-bottom: 0; }
.topic-guide .topic-guide__body h2 {
	margin: 32px 0 14px;
	padding: 0;
	border: 0;
	font-size: clamp(19px, 1.8vw, 23px);
	line-height: 1.5;
	letter-spacing: -.02em;
	background: none;
}
.topic-guide .topic-guide__body h2::before,
.topic-guide .topic-guide__body h2::after { display: none; }
.topic-guide .topic-guide__body p { margin: 0 0 16px; }
.topic-guide .topic-guide__body a {
	text-decoration: underline;
	text-decoration-color: var(--dafa-border);
	text-underline-offset: 4px;
}
.topic-guide .topic-guide__body a:hover { text-decoration-color: currentColor; }
.topic-guide .topic-guide__body table {
	display: table;
	width: 100%;
	min-width: 0;
	table-layout: fixed;
	border-collapse: collapse;
	margin: 20px 0;
	font-size: 14px;
	line-height: 1.8;
}
.topic-guide .topic-guide__body :is(th, td) {
	padding: 12px 14px;
	border: 1px solid var(--dafa-border);
	vertical-align: top;
	text-align: left;
	white-space: normal;
	overflow-wrap: anywhere;
}
.topic-guide .topic-guide__body th { background: var(--dafa-bg); }
.topic-guide .topic-guide__body :is(th, td):first-child { width: 25%; }
.topic-resources-heading {
	margin: 0 0 20px;
	padding: 0 0 16px;
	border-bottom: 1px solid var(--dafa-border);
	scroll-margin-top: calc(var(--dafa-header-height, 72px) + 28px);
}
.topic-resources-heading h2 { margin: 0; font-size: 23px; line-height: 1.5; }
.topic-guide-links { margin-top: 32px; }
.topic-guide-links--home { margin-top: 48px; }
.topic-guide-links__heading { padding-bottom: 18px; border-bottom: 1px solid var(--dafa-border); }
.topic-guide-links__heading h2 { margin: 0; font-size: 23px; line-height: 1.5; letter-spacing: -.02em; }
.topic-guide-links__items { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 16px; padding-top: 20px; }
.topic-guide-links__item { min-width: 0; }
.topic-guide-links__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 22px;
	border-radius: var(--dafa-radius);
	background: var(--dafa-surface);
	color: var(--dafa-text);
	text-decoration: none;
	overflow-wrap: anywhere;
}
.single-page .topic-guide-links__link { background: var(--dafa-bg); }
.topic-guide-links__link h3 { margin: 0 0 10px; font-size: 18px; line-height: 1.65; color: var(--dafa-text); }
.topic-guide-links__link p { margin: 0 0 20px; font-size: 14px; line-height: 1.85; color: var(--dafa-text-soft); }
.topic-guide-links__action { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: auto; font-size: 13px; color: var(--dafa-accent); }
.topic-guide-links__link:hover h3 { color: var(--dafa-accent); }
.topic-guide-links__link:focus-visible,
.topic-guide__skip:focus-visible { outline: 2px solid var(--dafa-accent); outline-offset: 4px; }
@media (max-width: 600px) {
	.topic-guide { padding: 20px 18px; margin-bottom: 28px; }
	.topic-guide__header { margin-bottom: 18px; padding-bottom: 10px; }
	.topic-guide .topic-guide__body { font-size: 15px; line-height: 1.9; }
	.topic-guide .topic-guide__body h2 { margin-top: 26px; }
	.topic-guide .topic-guide__body :is(th, td) { padding: 9px 8px; }
	.topic-guide .topic-guide__body table { font-size: 13px; }
	.topic-guide-links--home { margin-top: 32px; }
	.topic-guide-links__items { grid-template-columns: 1fr; gap: 12px; padding-top: 16px; }
	.topic-guide-links__link { padding: 20px; }
	.topic-guide-links__heading h2, .topic-resources-heading h2 { font-size: 21px; }
}