/**
 * QueryFeedz AI Use Cases — frontend styles.
 *
 * Same visual language as the QueryFeedz Tools / Startups / Glossary
 * plugins: theme typography (inherit), square corners, hairline borders,
 * near-black primary actions, white boxes on the theme's page background.
 *
 * Loaded only on the AI Use Cases archive and single views. Everything is
 * scoped to .qfuc; component rules use ".qfuc .x" so theme element styles
 * (Blocksy heading/list/paragraph spacing) never leak in.
 */

/* ---------- Tokens (mirrors .qf-scope) ---------- */
.qfuc {
	--qf-container: 1320px;
	--qf-container-profile: 1160px;
	--qf-gap: 20px;
	--qf-radius: 0px;
	--qf-radius-sm: 0px;

	--qf-surface: #ffffff;
	--qf-surface-alt: #f7f8fa;
	--qf-border: #e5e7eb;
	--qf-border-strong: #d4d8df;
	--qf-text: #111827;
	--qf-muted: #5f6570;
	--qf-accent: #262626;
	--qf-accent-hover: #000000;
	--qf-accent-contrast: #ffffff;
	--qf-accent-soft: #f1f1f1;
	--qf-link: #1d4ed8;
	--qf-link-soft: #eef3ff;
	--qf-focus: #262626;

	--qf-featured: #7a5200;
	--qf-featured-soft: #fff4d6;
	--qf-featured-border: #ecd9a3;
	--qf-pinned: #12805c;
	--qf-pinned-soft: #e7f6ef;
	--qf-pinned-border: #bfe3d3;

	--qf-shadow-hover: 0 6px 18px rgba(16, 24, 40, .06);
	--qf-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

	display: block;
	padding: 0 0 64px;
	color: var(--qf-text);
	font-family: inherit;
	line-height: 1.5;
	overflow-wrap: break-word;
}

.qfuc *,
.qfuc *::before,
.qfuc *::after {
	box-sizing: border-box;
}

/* Reset theme spacing inside the plugin only. */
.qfuc :is(h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote) {
	margin: 0;
}

.qfuc :is(ul, ol) {
	padding: 0;
	list-style: none;
}

.qfuc li {
	margin: 0;
}

.qfuc :is(h1, h2, h3, h4) {
	color: var(--theme-headings-color, var(--qf-text));
}

.qfuc img {
	max-width: 100%;
	height: auto;
}

.qfuc a {
	text-decoration: none;
}

.qfuc :is(a, button, input, select, summary, pre):focus-visible {
	outline: 2px solid var(--qf-focus);
	outline-offset: 2px;
}

.qfuc .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.qfuc .qfuc-icon {
	flex: none;
	vertical-align: middle;
}

.qfuc .qfuc-container {
	width: 100%;
	max-width: var(--qf-container);
	margin-inline: auto;
	padding-inline: 20px;
}

.qfuc-single .qfuc-container {
	max-width: var(--qf-container-profile);
}

/* ---------- Buttons ---------- */
.qfuc .qfuc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	min-height: 40px;
	margin: 0;
	padding: .55rem 1rem;
	border: 1px solid transparent;
	border-radius: var(--qf-radius-sm);
	font: inherit;
	font-size: .9rem;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.qfuc .qfuc-btn--primary {
	background: var(--qf-accent);
	color: var(--qf-accent-contrast);
}

.qfuc .qfuc-btn--primary:hover {
	background: var(--qf-accent-hover);
	color: var(--qf-accent-contrast);
}

.qfuc .qfuc-btn--ghost {
	background: var(--qf-surface);
	border-color: var(--qf-border-strong);
	color: var(--qf-text);
}

.qfuc .qfuc-btn--ghost:hover {
	border-color: var(--qf-text);
	color: var(--qf-text);
}

.qfuc .qfuc-btn--card {
	width: 100%;
	background: var(--qf-surface-alt);
	border-color: var(--qf-border);
	color: var(--qf-text);
}

.qfuc .qfuc-btn--card:hover {
	background: var(--qf-accent);
	border-color: var(--qf-accent);
	color: var(--qf-accent-contrast);
}

.qfuc .qfuc-btn--lg {
	min-height: 44px;
	padding: 0 22px;
	font-size: .9375rem;
}

.qfuc .qfuc-btn--block {
	width: 100%;
}

.qfuc .qfuc-more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--qf-text);
	font-size: .875rem;
	font-weight: 650;
}

.qfuc .qfuc-more:hover {
	text-decoration: underline;
}

/* ---------- Chips & labels ---------- */
.qfuc .qfuc-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.qfuc .qfuc-chip {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 11px;
	background: var(--qf-surface);
	border: 1px solid var(--qf-border);
	border-radius: var(--qf-radius-sm);
	color: var(--qf-muted);
	font-size: .75rem;
	font-weight: 600;
	line-height: 1.5;
	white-space: nowrap;
}

.qfuc a.qfuc-chip:hover {
	border-color: var(--qf-border-strong);
	color: var(--qf-text);
}

.qfuc .qfuc-chip__label {
	font-weight: 500;
}

.qfuc .qfuc-chip--removable {
	background: var(--qf-surface-alt);
	color: var(--qf-text);
}

.qfuc .qfuc-chip--removable .qfuc-icon {
	width: 12px;
	height: 12px;
}

.qfuc .qfuc-chip--difficulty::before {
	content: "";
	width: 6px;
	height: 6px;
	margin-right: 2px;
	background: var(--qf-muted);
}

.qfuc .qfuc-chip--difficulty:is([data-level*="beginner"], [data-level*="easy"], [data-level*="low"])::before { background: #16a34a; }
.qfuc .qfuc-chip--difficulty:is([data-level*="intermediate"], [data-level*="medium"], [data-level*="moderate"])::before { background: #d97706; }
.qfuc .qfuc-chip--difficulty:is([data-level*="advanced"], [data-level*="expert"], [data-level*="high"])::before { background: #dc2626; }

.qfuc .qfuc-eyebrow {
	margin-bottom: 8px;
	color: var(--qf-muted);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.qfuc .qfuc-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	background: var(--qf-accent);
	color: var(--qf-accent-contrast);
	font-size: .75rem;
}

/* ---------- Boxes & panels ---------- */
.qfuc .qfuc-box {
	padding: 28px 32px;
	background: var(--qf-surface);
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-box__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px 16px;
	margin-bottom: 20px;
}

.qfuc .qfuc-box__head .qfuc-section__title {
	margin: 0;
}

.qfuc .qfuc-section__title {
	margin: 0 0 20px;
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -.015em;
}

.qfuc .qfuc-panel {
	padding: 24px;
	background: var(--qf-surface);
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-panel__title {
	margin: 0 0 12px;
	color: var(--qf-muted);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

/* ---------- Select ---------- */
.qfuc .qfuc-select {
	position: relative;
	display: block;
}

.qfuc .qfuc-select select {
	appearance: none;
	-webkit-appearance: none;
	width: 100%;
	min-height: 40px;
	margin: 0;
	padding: 8px 34px 8px 12px;
	background: var(--qf-surface);
	border: 1px solid var(--qf-border-strong);
	border-radius: var(--qf-radius-sm);
	color: var(--qf-text);
	font: inherit;
	font-size: .875rem;
	line-height: 1.3;
	cursor: pointer;
}

.qfuc .qfuc-select select:hover {
	border-color: var(--qf-text);
}

.qfuc .qfuc-select .qfuc-icon {
	position: absolute;
	top: 50%;
	right: 10px;
	width: 14px;
	height: 14px;
	transform: translateY(-50%);
	color: var(--qf-muted);
	pointer-events: none;
}

/* ---------- Breadcrumbs ---------- */
.qfuc .qfuc-breadcrumbs {
	padding: 24px 0 0;
	color: var(--qf-muted);
	font-size: .8125rem;
}

.qfuc .qfuc-breadcrumbs__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

.qfuc .qfuc-breadcrumbs__item {
	min-width: 0;
}

.qfuc .qfuc-breadcrumbs__item:not(:last-child)::after {
	content: "/";
	margin-left: 6px;
	color: var(--qf-border-strong);
}

.qfuc .qfuc-breadcrumbs a {
	color: var(--qf-muted);
}

.qfuc .qfuc-breadcrumbs a:hover {
	color: var(--qf-text);
	text-decoration: underline;
}

.qfuc .qfuc-breadcrumbs [aria-current="page"] {
	color: var(--qf-text);
}

/* =========================================================
   ARCHIVE
   ========================================================= */
.qfuc-archive {
	padding-top: 36px;
}

.qfuc .qfuc-dhero {
	margin-bottom: 28px;
	padding: 36px 32px 32px;
	background: var(--qf-surface-alt);
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-dhero__title {
	font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.35rem);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.02em;
}

.qfuc .qfuc-dhero__lede {
	max-width: 62ch;
	margin-top: 10px;
	color: var(--qf-muted);
	font-size: 1rem;
	line-height: 1.55;
}

.qfuc .qfuc-search {
	display: flex;
	gap: 8px;
	max-width: 700px;
	margin-top: 22px;
}

.qfuc .qfuc-search__field {
	position: relative;
	display: flex;
	flex: 1;
	align-items: center;
	min-width: 0;
}

.qfuc .qfuc-search__field .qfuc-icon {
	position: absolute;
	left: 14px;
	color: var(--qf-muted);
	pointer-events: none;
}

.qfuc .qfuc-search__input {
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 8px 12px 8px 40px;
	background: var(--qf-surface);
	border: 1px solid var(--qf-border-strong);
	border-radius: var(--qf-radius-sm);
	color: var(--qf-text);
	font: inherit;
	font-size: .9375rem;
}

.qfuc .qfuc-search__input:focus {
	border-color: var(--qf-text);
	outline: none;
	box-shadow: 0 0 0 1px var(--qf-text);
}

.qfuc .qfuc-search .qfuc-btn {
	min-height: 44px;
	padding-inline: 20px;
}

.qfuc .qfuc-filters {
	margin-top: 24px;
	padding-top: 24px;
	border-top: 1px solid var(--qf-border);
}

.qfuc .qfuc-filters__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
	gap: 14px 16px;
}

.qfuc .qfuc-field__label {
	display: block;
	margin-bottom: 6px;
	color: var(--qf-text);
	font-size: .8125rem;
	font-weight: 500;
}

.qfuc .qfuc-filters__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 18px;
}

.qfuc .qfuc-filters__toggle .qfuc-icon {
	width: 14px;
	height: 14px;
}

/* Featured strip */
.qfuc .qfuc-featured {
	margin-bottom: 32px;
	padding: 22px 20px 24px;
	background: linear-gradient(180deg, var(--qf-featured-soft), var(--qf-surface-alt));
	border: 1px solid var(--qf-featured-border);
}

.qfuc .qfuc-featured .qfuc-section-head {
	margin-bottom: 16px;
}

.qfuc .qfuc-section-head__title,
.qfuc .qfuc-results__title {
	font-size: 1.35rem;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -.015em;
}

/* Results */
.qfuc .qfuc-results__header {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px 16px;
	margin-bottom: 16px;
}

.qfuc .qfuc-results__count {
	margin-top: 2px;
	color: var(--qf-muted);
	font-size: .875rem;
}

.qfuc .qfuc-sort {
	display: flex;
	align-items: center;
	gap: 8px;
}

.qfuc .qfuc-sort__label {
	color: var(--qf-muted);
	font-size: .8125rem;
	white-space: nowrap;
}

.qfuc .qfuc-sort .qfuc-select {
	min-width: 190px;
}

.qfuc .qfuc-active {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin-bottom: 18px;
}

.qfuc .qfuc-active__label {
	color: var(--qf-muted);
	font-size: .8125rem;
}

.qfuc .qfuc-active__list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

/* Grid & cards */
.qfuc .qfuc-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: var(--qf-gap);
}

.qfuc .qfuc-grid--featured {
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.qfuc .qfuc-grid__item {
	display: flex;
	min-width: 0;
}

.qfuc .qfuc-grid__full {
	grid-column: 1 / -1;
}

.qfuc .qfuc-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: .5rem;
	width: 100%;
	min-width: 0;
	padding: 1.1rem;
	background: var(--qf-surface);
	border: 1px solid var(--qf-border);
	border-radius: var(--qf-radius);
	transition: border-color .15s ease, box-shadow .15s ease;
}

.qfuc .qfuc-card:hover,
.qfuc .qfuc-card:focus-within {
	border-color: var(--qf-border-strong);
	box-shadow: var(--qf-shadow-hover);
}

.qfuc .qfuc-card--featured {
	border-color: var(--qf-featured-border);
}

.qfuc .qfuc-card--pinned {
	border-color: var(--qf-pinned-border);
}

.qfuc .qfuc-card__top {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	margin-bottom: .25rem;
}

.qfuc .qfuc-card__media {
	display: grid;
	flex: none;
	place-items: center;
	width: 44px;
	height: 44px;
	overflow: hidden;
	background: var(--qf-surface-alt);
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-card__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.qfuc .qfuc-card__monogram {
	color: var(--qf-text);
	font-size: 1rem;
	font-weight: 700;
}

.qfuc .qfuc-card__kicker {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	color: var(--qf-muted);
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.qfuc .qfuc-badge {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: 4px;
	padding: 2px 8px;
	border: 1px solid;
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
}

.qfuc .qfuc-badge .qfuc-icon {
	width: 11px;
	height: 11px;
}

.qfuc .qfuc-badge--featured {
	background: var(--qf-featured-soft);
	border-color: var(--qf-featured-border);
	color: var(--qf-featured);
}

.qfuc .qfuc-badge--pinned {
	background: var(--qf-pinned-soft);
	border-color: var(--qf-pinned-border);
	color: var(--qf-pinned);
}

.qfuc .qfuc-card__title {
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.3;
}

.qfuc .qfuc-card__title a {
	color: inherit;
}

.qfuc .qfuc-card__title a:hover {
	text-decoration: underline;
}

.qfuc .qfuc-card__excerpt {
	display: -webkit-box;
	overflow: hidden;
	color: var(--qf-muted);
	font-size: .875rem;
	line-height: 1.5;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.qfuc .qfuc-card__tags {
	color: var(--qf-muted);
	font-size: .8125rem;
	font-weight: 600;
}

.qfuc .qfuc-card__goal {
	padding: 10px 12px;
	background: var(--qf-surface-alt);
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-card__goal-label {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--qf-muted);
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.qfuc .qfuc-card__goal-label .qfuc-icon {
	width: 12px;
	height: 12px;
}

.qfuc .qfuc-card__goal-text {
	margin-top: 3px;
	color: var(--qf-text);
	font-size: .8125rem;
	line-height: 1.45;
}

.qfuc .qfuc-card__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.qfuc .qfuc-card__cta {
	margin-top: auto;
}

.qfuc .qfuc-card__cta .qfuc-icon {
	width: 14px;
	height: 14px;
}

/* Empty & pagination */
.qfuc .qfuc-empty {
	text-align: center;
}

.qfuc .qfuc-empty__title {
	margin-bottom: 6px;
	font-size: 1.15rem;
}

.qfuc .qfuc-empty p {
	margin-bottom: 18px;
	color: var(--qf-muted);
}

.qfuc .qfuc-pagination {
	margin-top: 36px;
}

.qfuc .qfuc-pagination ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
}

.qfuc .qfuc-pagination .page-numbers:not(ul) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	min-height: 40px;
	padding: 0 12px;
	background: var(--qf-surface);
	border: 1px solid var(--qf-border);
	color: var(--qf-text);
	font-size: .875rem;
	font-weight: 600;
}

.qfuc .qfuc-pagination a.page-numbers:hover {
	border-color: var(--qf-text);
}

.qfuc .qfuc-pagination .page-numbers.current {
	background: var(--qf-accent);
	border-color: var(--qf-accent);
	color: var(--qf-accent-contrast);
}

.qfuc .qfuc-pagination .page-numbers.dots {
	background: transparent;
	border-color: transparent;
}

/* Ads */
.qfuc .qfuc-ad {
	margin: 8px 0;
}

.qfuc .qfuc-ad__label {
	display: block;
	margin-bottom: 6px;
	color: var(--qf-muted);
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.qfuc .qfuc-ad__frame {
	position: relative;
	overflow: hidden;
	aspect-ratio: var(--qfuc-ad-ratio, 12 / 5);
	background: var(--qf-surface-alt);
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-ad--archive-full-width .qfuc-ad__frame {
	max-width: 1200px;
	margin-inline: auto;
}

.qfuc .qfuc-ad__link,
.qfuc .qfuc-ad__img {
	display: block;
	width: 100%;
	height: 100%;
}

.qfuc .qfuc-ad__img {
	object-fit: cover;
}

.qfuc .qfuc-ad__placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--qf-muted);
	font-family: var(--qf-mono);
	font-size: .8125rem;
}

.qfuc .qfuc-pbody__aside .qfuc-ad {
	margin: 0;
	padding: 20px;
	background: var(--qf-surface);
	border: 1px solid var(--qf-border);
}

/* =========================================================
   SINGLE
   ========================================================= */
.qfuc .qfuc-phero {
	margin: 20px 0 24px;
	padding: 28px 32px 32px;
	background: var(--qf-surface);
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-phero__top {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
}

.qfuc .qfuc-phero__top:not(:last-child) {
	padding-bottom: 24px;
}

.qfuc .qfuc-phero__title {
	font-size: clamp(1.6rem, 1.15rem + 1.7vw, 2.3rem);
	font-weight: 700;
	line-height: 1.12;
	letter-spacing: -.025em;
	overflow-wrap: anywhere;
}

.qfuc .qfuc-phero__summary {
	max-width: 65ch;
	margin-top: 10px;
	color: var(--qf-muted);
	font-size: .975rem;
	line-height: 1.55;
}

.qfuc .qfuc-phero .qfuc-chips {
	margin-top: 14px;
}

.qfuc .qfuc-phero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 20px;
}

.qfuc .qfuc-phero__actions .qfuc-icon {
	width: 15px;
	height: 15px;
}

.qfuc .qfuc-phero__media {
	overflow: hidden;
	background: var(--qf-surface-alt);
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-phero__img {
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

/* Stat bar */
.qfuc .qfuc-statbar {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	background: var(--qf-surface);
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-statbar__item {
	padding: 14px 18px;
	border-right: 1px solid var(--qf-border);
}

.qfuc .qfuc-statbar__item:last-child {
	border-right: 0;
}

.qfuc .qfuc-statbar dt,
.qfuc .qfuc-factgrid dt {
	color: var(--qf-muted);
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.qfuc .qfuc-statbar dd {
	margin-top: 3px;
	font-size: 1rem;
	font-weight: 650;
}

/* Body grid */
.qfuc .qfuc-pbody {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 32px;
}

.qfuc .qfuc-pbody__main {
	display: flex;
	flex-direction: column;
	gap: 24px;
	min-width: 0;
}

.qfuc .qfuc-pbody__aside {
	display: grid;
	gap: 20px;
	align-self: start;
	min-width: 0;
}

.qfuc .qfuc-section {
	scroll-margin-top: 90px;
}

.qfuc .qfuc-pair {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
}

/* Prose */
.qfuc .qfuc-prose {
	color: var(--theme-text-color, var(--qf-text));
	font-size: 1rem;
	line-height: 1.7;
}

.qfuc .qfuc-prose :is(p, ul, ol, blockquote, figure, table, pre) {
	margin: 0 0 1em;
}

.qfuc .qfuc-prose :is(ul, ol) {
	padding-left: 1.35em;
}

.qfuc .qfuc-prose ul > li {
	list-style: disc;
}

.qfuc .qfuc-prose ol > li {
	list-style: decimal;
}

.qfuc .qfuc-prose li + li {
	margin-top: .3em;
}

.qfuc .qfuc-prose > :last-child {
	margin-bottom: 0;
}

.qfuc .qfuc-prose :is(h2, h3, h4) {
	margin: 1.6em 0 .5em;
	line-height: 1.3;
}

.qfuc .qfuc-prose > :is(h2, h3, h4):first-child {
	margin-top: 0;
}

.qfuc .qfuc-prose h2 { font-size: 1.2rem; }
.qfuc .qfuc-prose h3 { font-size: 1.075rem; }
.qfuc .qfuc-prose h4 { font-size: 1rem; }

.qfuc .qfuc-prose a {
	color: var(--qf-link);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.qfuc .qfuc-prose blockquote {
	padding-left: 14px;
	border-left: 3px solid var(--qf-border-strong);
	color: var(--qf-muted);
}

.qfuc .qfuc-prose table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
}

.qfuc .qfuc-prose pre {
	overflow-x: auto;
}

/* Quick facts */
.qfuc .qfuc-factgrid {
	display: flex;
	flex-wrap: wrap;
	border-top: 1px solid var(--qf-border);
	border-left: 1px solid var(--qf-border);
}

.qfuc .qfuc-factgrid__item {
	flex: 1 1 180px;
	padding: 14px 18px;
	background: var(--qf-surface);
	border-right: 1px solid var(--qf-border);
	border-bottom: 1px solid var(--qf-border);
}

.qfuc .qfuc-factgrid__item--primary_goal {
	flex-basis: 100%;
	background: var(--qf-surface-alt);
}

.qfuc .qfuc-factgrid dd {
	margin-top: 4px;
	font-size: 1rem;
	font-weight: 650;
	line-height: 1.45;
}

/* Workflow steps */
.qfuc .qfuc-steps {
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-steps__item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 12px 16px;
}

.qfuc .qfuc-steps__item + .qfuc-steps__item {
	border-top: 1px solid var(--qf-border);
}

.qfuc .qfuc-steps__num {
	display: grid;
	flex: none;
	place-items: center;
	min-width: 26px;
	height: 26px;
	padding: 0 4px;
	background: var(--qf-surface-alt);
	border: 1px solid var(--qf-border);
	color: var(--qf-text);
	font-size: .75rem;
	font-weight: 700;
}

.qfuc .qfuc-steps__body {
	min-width: 0;
	padding-top: 2px;
}

.qfuc .qfuc-steps__title {
	font-size: .975rem;
	font-weight: 650;
	line-height: 1.4;
}

.qfuc .qfuc-steps__text {
	margin-top: 2px;
	color: var(--qf-muted);
	font-size: .9rem;
	line-height: 1.55;
}

.qfuc .qfuc-steps__text.is-solo {
	margin-top: 0;
	color: var(--qf-text);
	font-size: .975rem;
}

/* Prompt */
.qfuc .qfuc-prompt {
	overflow: hidden;
	background: #111827;
	border: 1px solid #111827;
}

.qfuc .qfuc-prompt__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 8px 8px 8px 16px;
	border-bottom: 1px solid #1f2937;
}

.qfuc .qfuc-prompt__label {
	color: #9ca3af;
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.qfuc .qfuc-prompt__copy {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 32px;
	margin: 0;
	padding: 4px 12px;
	background: transparent;
	border: 1px solid #374151;
	border-radius: 0;
	color: #e5e7eb;
	font: inherit;
	font-size: .8125rem;
	font-weight: 600;
	cursor: pointer;
}

.qfuc .qfuc-prompt__copy[hidden] {
	display: none;
}

.qfuc .qfuc-prompt__copy:hover {
	background: #1f2937;
}

.qfuc .qfuc-prompt__copy.is-copied {
	border-color: #22c55e;
	color: #bbf7d0;
}

.qfuc .qfuc-prompt__copy:focus-visible {
	outline-color: #e5e7eb;
}

.qfuc .qfuc-prompt__body {
	max-height: 440px;
	margin: 0;
	padding: 18px 16px;
	overflow: auto;
	background: transparent;
	border: 0;
	color: #e5e7eb;
	font: 400 .875rem/1.7 var(--qf-mono);
	white-space: pre-wrap;
	word-break: break-word;
}

.qfuc .qfuc-prompt__body code {
	padding: 0;
	background: none;
	color: inherit;
	font: inherit;
}

/* Insight — editorial, distinct from descriptive copy. */
.qfuc .qfuc-insight {
	border-left: 3px solid var(--qf-accent);
}

.qfuc .qfuc-insight__title {
	margin: 0 0 8px;
	color: var(--qf-muted);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.qfuc .qfuc-insight__body {
	color: var(--qf-text);
	font-size: 1rem;
	line-height: 1.65;
}

/* FAQ */
.qfuc .qfuc-faq {
	border: 1px solid var(--qf-border);
}

.qfuc .qfuc-faq__item + .qfuc-faq__item {
	border-top: 1px solid var(--qf-border);
}

.qfuc .qfuc-faq__question {
	padding: 14px 18px 0;
	font-size: 1rem;
	font-weight: 650;
	line-height: 1.45;
}

.qfuc .qfuc-faq__answer {
	padding: 6px 18px 16px;
	font-size: .95rem;
}

.qfuc .qfuc-faq.is-enhanced .qfuc-faq__question {
	padding: 0;
}

.qfuc .qfuc-faq__button {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: 12px 18px;
	background: transparent;
	border: 0;
	border-radius: 0;
	color: var(--theme-headings-color, var(--qf-text));
	font: inherit;
	font-size: 1rem;
	font-weight: 650;
	line-height: 1.45;
	text-align: left;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
}

.qfuc .qfuc-faq__button:hover {
	background: var(--qf-surface-alt);
}

.qfuc .qfuc-faq__button .qfuc-icon {
	color: var(--qf-muted);
	transition: transform .15s ease;
}

.qfuc .qfuc-faq__button[aria-expanded="true"] .qfuc-icon {
	transform: rotate(180deg);
}

/* Explore more tiles */
.qfuc .qfuc-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 12px;
}

.qfuc .qfuc-tile {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	height: 100%;
	padding: 12px 14px;
	border: 1px solid var(--qf-border);
	color: var(--qf-text);
	font-size: .9375rem;
	font-weight: 600;
	line-height: 1.35;
	transition: border-color .12s ease, background-color .12s ease;
}

.qfuc .qfuc-tile:hover {
	background: var(--qf-surface-alt);
	border-color: var(--qf-border-strong);
	color: var(--qf-text);
}

.qfuc .qfuc-tile .qfuc-icon {
	width: 14px;
	height: 14px;
	color: var(--qf-muted);
}

/* ---------- Sidebar ---------- */
.qfuc .qfuc-toc__list {
	counter-reset: none;
	margin: 0 -24px;
}

.qfuc .qfuc-toc__link {
	display: flex;
	align-items: baseline;
	gap: 10px;
	padding: 6px 24px 6px 21px;
	border-left: 3px solid transparent;
	color: var(--qf-muted);
	font-size: .875rem;
	line-height: 1.4;
}

.qfuc .qfuc-toc__link:hover {
	color: var(--qf-text);
}

.qfuc .qfuc-toc__link.is-active {
	background: var(--qf-link-soft);
	border-left-color: var(--qf-link);
	color: var(--qf-link);
	font-weight: 600;
}

.qfuc .qfuc-toc__num {
	flex: none;
	min-width: 1.4em;
	color: var(--qf-muted);
	font-family: var(--qf-mono);
	font-size: .6875rem;
	font-weight: 400;
}

.qfuc .qfuc-toc__link.is-active .qfuc-toc__num {
	color: var(--qf-link);
}

.qfuc .qfuc-spec__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	padding: 10px 0;
	border-bottom: 1px solid var(--qf-border);
}

.qfuc .qfuc-spec__row:first-child {
	padding-top: 0;
}

.qfuc .qfuc-spec__row:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.qfuc .qfuc-spec dt {
	flex: 0 0 auto;
	color: var(--qf-muted);
	font-size: .8125rem;
}

.qfuc .qfuc-spec dd {
	font-size: .875rem;
	font-weight: 600;
	text-align: right;
	overflow-wrap: anywhere;
}

.qfuc .qfuc-spec dd a {
	color: var(--qf-text);
}

.qfuc .qfuc-spec dd a:hover {
	text-decoration: underline;
}

.qfuc .qfuc-glance__cta {
	margin-top: 18px;
}

.qfuc .qfuc-linklist__item {
	display: flex;
	flex-direction: column;
	padding: 10px 0;
	border-bottom: 1px solid var(--qf-border);
}

.qfuc .qfuc-linklist__item:first-child {
	padding-top: 0;
}

.qfuc .qfuc-linklist__item:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.qfuc .qfuc-linklist__link,
.qfuc .qfuc-linklist__text {
	color: var(--qf-text);
	font-size: .9rem;
	font-weight: 600;
	line-height: 1.4;
}

.qfuc .qfuc-linklist__link:hover {
	text-decoration: underline;
}

.qfuc .qfuc-linklist__meta {
	margin-top: 2px;
	color: var(--qf-muted);
	font-size: .78rem;
	line-height: 1.45;
}

/* ---------- Responsive ---------- */
@media (min-width: 768px) {
	.qfuc .qfuc-pair {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.qfuc .qfuc-filters__toggle,
	.qfuc .qfuc-filters__toggle[hidden] {
		display: none !important;
	}
}

@media (min-width: 960px) {
	.qfuc .qfuc-phero__top.has-media {
		grid-template-columns: minmax(0, 1fr) 340px;
		gap: 32px;
		align-items: center;
	}

	.qfuc .qfuc-pbody {
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: 40px;
		align-items: start;
	}

	/* Sticky only when the whole sidebar fits the viewport (set by JS). */
	.qfuc .qfuc-pbody__aside.is-sticky {
		position: sticky;
		top: calc(24px + var(--admin-bar, 0px));
	}

	.admin-bar .qfuc {
		--admin-bar: 32px;
	}
}

@media (max-width: 767px) {
	.qfuc-archive {
		padding-top: 20px;
	}

	.qfuc .qfuc-dhero,
	.qfuc .qfuc-phero,
	.qfuc .qfuc-box {
		padding: 20px;
	}

	.qfuc .qfuc-panel {
		padding: 20px;
	}

	.qfuc .qfuc-toc__list {
		margin: 0 -20px;
	}

	.qfuc .qfuc-toc__link {
		padding-inline: 17px 20px;
	}

	.qfuc .qfuc-search {
		flex-wrap: wrap;
	}

	.qfuc .qfuc-search .qfuc-btn {
		width: 100%;
	}

	/* Compact filter panel once JS is available. */
	.qfuc .qfuc-filters.is-enhanced .qfuc-filters__toggle {
		display: inline-flex;
	}

	.qfuc .qfuc-filters.is-enhanced:not(.is-open) .qfuc-filters__form {
		display: none;
	}

	.qfuc .qfuc-filters.is-enhanced .qfuc-filters__form {
		margin-top: 16px;
	}

	.qfuc .qfuc-filters__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.qfuc .qfuc-filters__actions .qfuc-btn {
		flex: 1;
	}

	.qfuc .qfuc-results__header {
		align-items: stretch;
	}

	.qfuc .qfuc-sort {
		width: 100%;
	}

	.qfuc .qfuc-sort .qfuc-select {
		flex: 1;
		min-width: 0;
	}

	.qfuc .qfuc-grid,
	.qfuc .qfuc-grid--featured {
		grid-template-columns: minmax(0, 1fr);
	}

	.qfuc .qfuc-phero__actions,
	.qfuc .qfuc-phero__actions .qfuc-btn {
		width: 100%;
	}

	.qfuc .qfuc-statbar {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.qfuc .qfuc-statbar__item:nth-child(2n) {
		border-right: 0;
	}

	.qfuc .qfuc-statbar__item:nth-child(n+3) {
		border-top: 1px solid var(--qf-border);
	}

	.qfuc .qfuc-pagination .page-numbers:not(ul) {
		min-width: 36px;
		padding: 0 8px;
	}
}

@media (max-width: 420px) {
	.qfuc .qfuc-filters__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {
	.qfuc *,
	.qfuc *::before,
	.qfuc *::after {
		transition: none !important;
	}
}
