/**
 * Components — classes fk-* used in Divi Code modules.
 * Principle: simplicity and finesse. One accent colour, lots of white space,
 * nothing that competes with the main call to action.
 */

/* ---------- Base refinements ---------- */

.fk-section {
	padding-block: var(--fk-space-6);
}

.fk-container {
	width: min(100% - 2 * var(--fk-space-3), var(--fk-container));
	margin-inline: auto;
}

.fk-eyebrow {
	font-family: var(--fk-font-body);
	font-size: var(--fk-size-small);
	letter-spacing: 0.04em;
	color: var(--fk-accent);
	margin: 0 0 var(--fk-space-2);
}

.fk-h1,
.fk-h2,
.fk-h3 {
	font-family: var(--fk-font-heading);
	color: var(--fk-ink);
	line-height: var(--fk-leading-tight);
	margin: 0 0 var(--fk-space-3);
	padding: 0;
}

.fk-h1 { font-size: var(--fk-size-h1); font-weight: var(--fk-weight-display); }
.fk-h2 { font-size: var(--fk-size-h2); font-weight: var(--fk-weight-heading); }
.fk-h3 { font-size: var(--fk-size-h3); font-weight: var(--fk-weight-heading); }

.fk-lead,
.fk-text {
	font-family: var(--fk-font-body);
	font-size: var(--fk-size-body);
	line-height: var(--fk-leading);
	color: var(--fk-text);
	max-width: var(--fk-measure);
	text-align: left; /* never justified */
}

.fk-lead {
	font-size: calc(var(--fk-size-body) * 1.15);
}

.fk-muted {
	color: var(--fk-text-muted);
	font-size: var(--fk-size-small);
}

.fk-center { text-align: center; }
.fk-center .fk-lead,
.fk-center .fk-text { margin-inline: auto; }

/* ---------- Buttons ---------- */

.fk-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--fk-space-1);
	min-height: 48px; /* touch target */
	padding: 0.75rem 1.5rem;
	border-radius: var(--fk-radius);
	font-family: var(--fk-font-body);
	font-size: var(--fk-size-body);
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color var(--fk-transition), color var(--fk-transition), border-color var(--fk-transition);
}

.fk-btn--primary {
	background: var(--fk-accent);
	border: 2px solid var(--fk-accent);
	color: var(--fk-on-dark);
}

.fk-btn--primary:hover,
.fk-btn--primary:focus-visible {
	background: var(--fk-accent-dark);
	border-color: var(--fk-accent-dark);
	color: var(--fk-on-dark);
}

.fk-btn--secondary {
	background: transparent;
	border: 2px solid var(--fk-ink);
	color: var(--fk-ink);
}

.fk-btn--secondary:hover,
.fk-btn--secondary:focus-visible {
	background: var(--fk-ink);
	color: var(--fk-on-dark);
}

.fk-btn--whatsapp {
	background: var(--fk-whatsapp);
	border: 2px solid var(--fk-whatsapp);
	color: #0b2e17;
}

.fk-btn:focus-visible {
	outline: 3px solid var(--fk-accent);
	outline-offset: 3px;
}

.fk-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fk-space-2);
	align-items: center;
	margin-top: var(--fk-space-4);
}

.fk-center .fk-actions { justify-content: center; }

/* Reassurance line right under a CTA (risk reversal, proof). */
.fk-reassure {
	margin-top: var(--fk-space-2);
	font-size: var(--fk-size-small);
	color: var(--fk-text-muted);
}

/* ---------- Cards ---------- */

.fk-grid {
	display: grid;
	gap: var(--fk-space-4);
	grid-template-columns: 1fr;
}

@media (min-width: 768px) {
	.fk-grid--2 { grid-template-columns: repeat(2, 1fr); }
	.fk-grid--3 { grid-template-columns: repeat(3, 1fr); }
}

.fk-card {
	display: flex;
	flex-direction: column;
	gap: var(--fk-space-2);
	padding: var(--fk-space-4);
	background: var(--fk-bg);
	border: var(--fk-border);
	border-radius: var(--fk-radius);
	box-shadow: var(--fk-shadow);
	transition: box-shadow var(--fk-transition);
}

.fk-card:hover { box-shadow: var(--fk-shadow-hover); }

.fk-card--featured { border: var(--fk-border-accent); }

.fk-card__title {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-h3);
	color: var(--fk-ink);
	margin: 0;
	padding: 0;
}

.fk-card__text {
	color: var(--fk-text);
	line-height: var(--fk-leading);
	margin: 0;
	flex-grow: 1;
}

.fk-offer__price {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: 1.75rem;
	color: var(--fk-ink);
	margin: 0;
}

.fk-card .fk-btn { align-self: flex-start; }

/* ---------- Proof ---------- */

.fk-logos {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fk-space-4);
	align-items: center;
	justify-content: center;
}

.fk-logos img {
	height: 36px;
	width: auto;
	filter: grayscale(1);
	opacity: 0.7;
}

.fk-quote {
	border-left: 3px solid var(--fk-accent);
	padding-left: var(--fk-space-3);
	margin: 0;
}

.fk-quote p {
	font-style: italic;
	font-size: calc(var(--fk-size-body) * 1.1);
	color: var(--fk-ink);
}

.fk-quote cite {
	display: block;
	margin-top: var(--fk-space-1);
	font-style: normal;
	font-size: var(--fk-size-small);
	color: var(--fk-text-muted);
}

/* ---------- Steps ---------- */

.fk-steps {
	counter-reset: fk-step;
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: var(--fk-space-4);
}

@media (min-width: 768px) {
	.fk-steps { grid-template-columns: repeat(4, 1fr); }
}

.fk-steps li { counter-increment: fk-step; }

.fk-steps li::before {
	content: counter(fk-step, decimal-leading-zero);
	display: block;
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: 2rem;
	color: var(--fk-accent);
	margin-bottom: var(--fk-space-1);
}

/* ---------- Dark band (final CTA, footer style) ---------- */

.fk-band-dark {
	background: var(--fk-bg-dark);
	color: var(--fk-on-dark);
	border-radius: var(--fk-radius);
	padding: var(--fk-space-6) var(--fk-space-4);
}

.fk-band-dark .fk-h2,
.fk-band-dark .fk-lead { color: var(--fk-on-dark); }

/* #666 on black is only 3.7:1, below WCAG AA for small text. */
.fk-band-dark .fk-reassure,
.fk-band-dark .fk-muted { color: var(--fk-on-dark-muted); }

/* ---------- Mobile sticky CTA bar ---------- */

.fk-sticky-cta {
	position: fixed;
	inset: auto 0 0 0;
	z-index: 9999;
	display: flex;
	gap: var(--fk-space-1);
	padding: var(--fk-space-1) var(--fk-space-2) calc(var(--fk-space-1) + env(safe-area-inset-bottom));
	background: var(--fk-bg);
	border-top: var(--fk-border);
	transform: translateY(110%);
	/* Hidden = out of the tab order and the accessibility tree, after the slide-out. */
	visibility: hidden;
	transition: transform var(--fk-transition), visibility 0s linear 180ms;
}

.fk-sticky-cta.is-visible {
	transform: translateY(0);
	visibility: visible;
	transition: transform var(--fk-transition);
}

.fk-sticky-cta .fk-btn { flex: 1; min-height: 44px; padding-inline: var(--fk-space-2); }

/* Keep the end of the page (footer links) clear of the bar. */
@media (max-width: 767px) {
	body:has(.fk-sticky-cta) { padding-bottom: calc(44px + 2 * var(--fk-space-1) + env(safe-area-inset-bottom)); }
}

@media (min-width: 768px) {
	.fk-sticky-cta { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.fk-card,
	.fk-btn,
	.fk-sticky-cta { transition: none; }
}

/* ==========================================================================
   Homepage world: "the query".
   The page opens on the exact question customers type into Google and
   ChatGPT, and Fokwa is the answer. The search query (a line of type with a
   blue caret) is the one recurring motif; black and white carry the page,
   the accent blue marks the caret, the cited name and the action.
   ========================================================================== */

::selection { background: var(--fk-accent); color: var(--fk-on-dark); }
input, textarea { caret-color: var(--fk-accent); }

.fk-dark {
	background: var(--fk-bg-dark);
	color: var(--fk-on-dark);
}

.fk-dark .fk-h1,
.fk-dark .fk-h2,
.fk-dark .fk-h3 { color: var(--fk-on-dark); }

.fk-dark .fk-lead,
.fk-dark .fk-text { color: var(--fk-on-dark-muted); }

.fk-dark .fk-reassure { color: var(--fk-on-dark-muted); }

/* Blinking caret: the page's one authored motion. */
.fk-caret {
	display: inline-block;
	width: 0.12em;
	height: 0.82em;
	margin-left: 0.08em;
	background: var(--fk-accent);
	vertical-align: -0.06em;
	animation: fk-blink 1.1s steps(1, end) infinite;
}

@keyframes fk-blink { 50% { opacity: 0; } }

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

/* ---------- Hero: the query ---------- */

.fk-query {
	padding-block: var(--fk-space-6) var(--fk-space-5);
}

/* The opening query starts right under the header. It used to fill 88% of the
   screen with the text at the bottom: Fokwa saw the empty black band above the
   heading as wasted space (25 Oct 2026). */
.fk-query--hero {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.fk-query__q {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: clamp(2.75rem, 1.4rem + 5.4vw, 6rem);
	line-height: 0.98;
	letter-spacing: -0.02em;
	color: var(--fk-on-dark);
	margin: 0;
	max-width: 17ch;
	text-wrap: balance;
}

.fk-query__answer {
	display: grid;
	gap: var(--fk-space-4);
	margin-top: var(--fk-space-5);
	padding-top: var(--fk-space-4);
	border-top: 1px solid #333333;
}

@media (min-width: 900px) {
	.fk-query__answer {
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: end;
	}
}

.fk-query__answer p {
	margin: 0;
	max-width: 52ch;
	font-size: calc(var(--fk-size-body) * 1.2);
	line-height: 1.55;
	color: var(--fk-on-dark-muted);
}

.fk-query__answer strong {
	color: var(--fk-on-dark);
	font-weight: normal;
	font-style: italic;
}

.fk-query__action .fk-reassure { margin-bottom: 0; }

@media (min-width: 900px) {
	.fk-query__action { text-align: right; }
}

.fk-btn--lg {
	min-height: 60px;
	padding: 1rem 1.75rem;
	font-size: calc(var(--fk-size-body) * 1.15);
}

/* ---------- Hero aside (24 Oct 2026) ----------
   The space next to the query holds something useful: a measured proof, the
   steps, the guide covers, a photo or the latest article. Phones: under the
   answer, so the button stays near the top. Light motion in heroes is allowed
   by Fokwa (24 Oct 2026, see CLAUDE.md §3bis); it waits for the typed query. */

.fk-query--aside .fk-container {
	display: grid;
	grid-template-areas: "q" "answer" "aside";
	row-gap: var(--fk-space-5);
}
.fk-query--aside .fk-query__q { grid-area: q; }
.fk-query--aside .fk-query__answer { grid-area: answer; margin-top: 0; }
.fk-query__aside { grid-area: aside; min-width: 0; }

@media (min-width: 900px) {
	.fk-query--aside .fk-container {
		grid-template-columns: minmax(0, 1fr) minmax(15rem, 22rem);
		grid-template-areas: "q aside" "answer answer";
		column-gap: var(--fk-space-5);
		align-items: end;
	}
	.fk-query--aside .fk-query__q { font-size: clamp(2.75rem, 1.4rem + 4vw, 4.75rem); }
}

/* Proof: 20 AI answers, the ones that cite Fokwa in the accent colour. */
.fk-ai-meter { margin: 0; padding: var(--fk-space-3); border: 1px solid #333333; border-radius: var(--fk-radius); }
.fk-ai-meter__label { margin: 0 0 var(--fk-space-2); font-size: var(--fk-size-small); color: var(--fk-on-dark-muted); }
.fk-ai-meter__dots { display: grid; grid-template-columns: repeat(10, 1fr); gap: 0.45rem; margin: 0 0 var(--fk-space-3); padding: 0; list-style: none; }
.fk-ai-meter__dots li { aspect-ratio: 1; margin: 0; padding: 0; border: 1px solid #333333; border-radius: 50%; }
.fk-ai-meter__dots li.is-hit { background: var(--fk-accent); border-color: var(--fk-accent); }
.fk-ai-meter figcaption { font-size: var(--fk-size-small); line-height: 1.5; color: var(--fk-on-dark-muted); }
.fk-ai-meter figcaption strong {
	display: block;
	margin-bottom: 0.35rem;
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: 2.5rem;
	line-height: 1;
	color: var(--fk-on-dark);
}

/* Steps: how working together starts. */
.fk-hero-steps { margin: 0; padding: 0; list-style: none; border-left: 1px solid #333333; }
.fk-hero-steps li { position: relative; margin: 0; padding: 0 0 var(--fk-space-3) var(--fk-space-4); font-size: var(--fk-size-small); line-height: 1.5; color: var(--fk-on-dark-muted); }
.fk-hero-steps li:last-child { padding-bottom: 0; }
.fk-hero-steps li::before {
	content: counter(list-item);
	position: absolute;
	left: -0.8rem;
	top: 0;
	display: grid;
	place-items: center;
	width: 1.6rem;
	height: 1.6rem;
	border: 1px solid var(--fk-accent);
	border-radius: 50%;
	background: var(--fk-bg-dark);
	font-size: 0.8125rem;
	color: var(--fk-on-dark);
}
.fk-hero-steps strong { display: block; font-family: var(--fk-font-heading); font-weight: var(--fk-weight-heading); font-size: 1.2rem; line-height: 1.25; color: var(--fk-on-dark); }

/* Guide covers, fanned out. */
.fk-hero-covers { --fk-fan: 6.5rem; position: relative; display: block; height: 15rem; }

.fk-hero-covers__img {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 9.5rem;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	border-radius: var(--fk-radius);
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.5);
	transform-origin: 50% 100%;
}
.fk-hero-covers__img:nth-child(1) { transform: translateX(-50%) translateX(calc(-1 * var(--fk-fan))) rotate(-8deg); }
.fk-hero-covers__img:nth-child(2) { transform: translateX(-50%) translateX(var(--fk-fan)) rotate(8deg); }
.fk-hero-covers__img:nth-child(3) { transform: translateX(-50%); z-index: 1; }

@media (max-width: 899px) {
	.fk-hero-covers { --fk-fan: 4.5rem; height: 11rem; }
	.fk-hero-covers__img { width: 7rem; }
}

/* Photo next to the query. */
.fk-hero-photo.fk-query__aside { aspect-ratio: 4 / 5; max-height: 18rem; object-fit: cover; object-position: center 20%; }

@media (max-width: 899px) {
	.fk-hero-photo.fk-query__aside { max-height: 16rem; }
}

/* Signature on the thank-you pages. */
.fk-signature { display: flex; align-items: center; gap: var(--fk-space-3); }
.fk-signature img { flex: none; width: 88px; height: 88px; border-radius: 50%; object-fit: cover; object-position: center 25%; }
.fk-signature p { margin: 0; font-size: var(--fk-size-small); line-height: 1.5; color: var(--fk-on-dark-muted); }
.fk-signature strong { display: block; font-family: var(--fk-font-heading); font-weight: var(--fk-weight-heading); font-size: 1.25rem; color: var(--fk-on-dark); }

/* Latest article (Insights). */
.fk-latest { display: block; padding: var(--fk-space-3); border: 1px solid #333333; border-radius: var(--fk-radius); text-decoration: none; transition: border-color var(--fk-transition); }
.fk-latest:hover { border-color: var(--fk-accent); }
.fk-latest__label { display: block; margin-bottom: var(--fk-space-1); font-size: var(--fk-size-small); color: var(--fk-accent); }
.fk-latest__title { display: block; font-family: var(--fk-font-heading); font-weight: var(--fk-weight-heading); font-size: 1.35rem; line-height: 1.2; color: var(--fk-on-dark); }
.fk-latest__meta { display: block; margin-top: var(--fk-space-2); font-size: var(--fk-size-small); color: var(--fk-on-dark-muted); }

.et_pb_code_inner .fk-ai-meter__dots,
.et_pb_code_inner .fk-hero-steps { padding: 0; list-style: none; line-height: inherit; }
.et_pb_code_inner .fk-hero-steps { padding-left: 0; }

/* Motion: the aside enters once the query is typed; the cited answers light up one by one,
   the steps follow each other, the covers fan out. */
.fk-motion .fk-query__aside { opacity: 0; transform: translateY(14px); }
.fk-motion .fk-query.is-typed .fk-query__aside {
	opacity: 1;
	transform: none;
	transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.2s, transform 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.2s;
}

@keyframes fk-hit {
	from { background: transparent; border-color: #333333; transform: scale(0.6); }
	to { background: var(--fk-accent); border-color: var(--fk-accent); transform: scale(1); }
}
.fk-motion .fk-ai-meter__dots li.is-hit { background: transparent; border-color: #333333; }
.fk-motion .fk-query.is-typed .fk-ai-meter__dots li.is-hit { animation: fk-hit 0.45s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.fk-motion .fk-query.is-typed .fk-ai-meter__dots li:nth-child(2) { animation-delay: 0.7s; }
.fk-motion .fk-query.is-typed .fk-ai-meter__dots li:nth-child(5) { animation-delay: 0.95s; }
.fk-motion .fk-query.is-typed .fk-ai-meter__dots li:nth-child(9) { animation-delay: 1.2s; }
.fk-motion .fk-query.is-typed .fk-ai-meter__dots li:nth-child(12) { animation-delay: 1.45s; }
.fk-motion .fk-query.is-typed .fk-ai-meter__dots li:nth-child(16) { animation-delay: 1.7s; }
.fk-motion .fk-query.is-typed .fk-ai-meter__dots li:nth-child(19) { animation-delay: 1.95s; }

.fk-motion .fk-hero-steps li { opacity: 0; transform: translateX(-8px); }
.fk-motion .fk-query.is-typed .fk-hero-steps li { opacity: 1; transform: none; transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
.fk-motion .fk-query.is-typed .fk-hero-steps li:nth-child(1) { transition-delay: 0.4s; }
.fk-motion .fk-query.is-typed .fk-hero-steps li:nth-child(2) { transition-delay: 0.75s; }
.fk-motion .fk-query.is-typed .fk-hero-steps li:nth-child(3) { transition-delay: 1.1s; }

.fk-motion .fk-hero-covers__img:nth-child(n) { transform: translateX(-50%); }
.fk-motion .fk-query.is-typed .fk-hero-covers__img { transition: transform 1.1s cubic-bezier(0.16, 1, 0.3, 1) 0.45s; }
.fk-motion .fk-query.is-typed .fk-hero-covers__img:nth-child(1) { transform: translateX(-50%) translateX(calc(-1 * var(--fk-fan))) rotate(-8deg); }
.fk-motion .fk-query.is-typed .fk-hero-covers__img:nth-child(2) { transform: translateX(-50%) translateX(var(--fk-fan)) rotate(8deg); }
.fk-motion .fk-query.is-typed .fk-hero-covers__img:nth-child(3) { transform: translateX(-50%); }

/* ---------- Proof: an AI answer that cites the site ---------- */

.fk-proof {
	display: grid;
	gap: var(--fk-space-5);
	align-items: center;
}

@media (min-width: 900px) {
	.fk-proof { grid-template-columns: 1fr 1.1fr; }
}

.fk-ai {
	border: var(--fk-border);
	border-radius: var(--fk-radius);
	box-shadow: var(--fk-shadow-hover);
	padding: var(--fk-space-4);
	background: var(--fk-bg);
	font-size: var(--fk-size-body);
}

.fk-ai__ask {
	margin: 0 0 var(--fk-space-3) auto;
	max-width: 30ch;
	background: #f2f2f2;
	border-radius: var(--fk-radius);
	padding: 0.75rem 1rem;
	color: var(--fk-ink);
}

.fk-ai__text { margin: 0; line-height: var(--fk-leading); color: var(--fk-text); }

.fk-ai__text mark {
	background: none;
	color: var(--fk-accent);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.fk-ai__sources {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fk-space-1);
	margin-top: var(--fk-space-3);
	padding: 0;
	list-style: none;
	font-size: var(--fk-size-small);
}

.fk-ai__sources li {
	border: 1px solid var(--fk-line);
	border-radius: 999px;
	padding: 0.2rem 0.75rem;
	color: var(--fk-text-muted);
}

.fk-ai__sources li:first-child { border-color: var(--fk-accent); color: var(--fk-accent); }

.fk-ai__note {
	margin: var(--fk-space-2) 0 0;
	font-size: var(--fk-size-small);
	color: var(--fk-text-muted);
}

.fk-stat {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	color: var(--fk-ink);
	white-space: nowrap;
}

/* ---------- Queries list: the shift ---------- */

.fk-queries {
	list-style: none;
	padding: 0;
	margin: 0;
	border-top: 1px solid var(--fk-ink);
}

.fk-queries li {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--fk-space-2);
	align-items: baseline;
	padding: var(--fk-space-3) 0;
	border-bottom: 1px solid var(--fk-line);
}

.fk-queries svg {
	width: 1.1rem;
	height: 1.1rem;
	color: var(--fk-text-muted);
	transform: translateY(0.15em);
}

.fk-queries__q {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-h3);
	color: var(--fk-ink);
	line-height: 1.25;
}

.fk-queries__q span {
	display: block;
	margin-top: 0.35rem;
	font-family: var(--fk-font-body);
	font-weight: normal;
	font-size: var(--fk-size-body);
	color: var(--fk-text);
}

/* ---------- Beliefs: large statements, no cards ---------- */

.fk-beliefs {
	display: grid;
	gap: var(--fk-space-5);
}

@media (min-width: 900px) {
	.fk-beliefs { grid-template-columns: repeat(3, 1fr); gap: var(--fk-space-4); }
}

.fk-belief__title {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.25rem);
	line-height: 1.05;
	letter-spacing: -0.01em;
	margin: 0 0 var(--fk-space-2);
	color: var(--fk-on-dark);
}

.fk-belief p { margin: 0; color: var(--fk-on-dark-muted); max-width: 38ch; }

/* ---------- Story ---------- */

.fk-story {
	display: grid;
	gap: var(--fk-space-4);
}

@media (min-width: 900px) {
	.fk-story { grid-template-columns: 1fr 1.4fr; gap: var(--fk-space-6); }
}

.fk-story .fk-text { margin: 0 0 var(--fk-space-3); }

/* ---------- Offers: editorial rows, not a card row ---------- */

.fk-offers {
	border-top: 1px solid var(--fk-ink);
}

.fk-offer-row {
	display: grid;
	gap: var(--fk-space-2);
	padding: var(--fk-space-4) 0;
	border-bottom: 1px solid var(--fk-line);
}

@media (min-width: 900px) {
	.fk-offer-row {
		grid-template-columns: 1.1fr 1.6fr 0.8fr auto;
		gap: var(--fk-space-4);
		align-items: start;
	}
}

.fk-offer-row__name {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: var(--fk-size-h3);
	line-height: 1.15;
	margin: 0;
	color: var(--fk-ink);
}

.fk-offer-row__for {
	display: block;
	margin-top: var(--fk-space-1);
	font-family: var(--fk-font-body);
	font-weight: normal;
	font-size: var(--fk-size-small);
	color: var(--fk-text-muted);
}

.fk-offer-row__what { margin: 0; color: var(--fk-text); }

.fk-offer-row__price {
	margin: 0;
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-h3);
	color: var(--fk-ink);
}

.fk-offer-row__price small {
	display: block;
	font-family: var(--fk-font-body);
	font-weight: normal;
	font-size: var(--fk-size-small);
	color: var(--fk-text-muted);
}

.fk-link {
	color: var(--fk-accent);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 5px;
	white-space: nowrap;
}

.fk-link:hover { color: var(--fk-accent-dark); }

.fk-dark .fk-link { color: var(--fk-on-dark); text-decoration-color: var(--fk-accent); }

/* ---------- Section rhythm (homepage and offer pages) ---------- */

.fk-section--tint { background: #f7f7f7; }

.fk-section__head { margin-bottom: var(--fk-space-5); }
.fk-section__head .fk-lead { margin-top: 0; }

.fk-gap { margin-top: var(--fk-space-6); }

.fk-after {
	margin-top: var(--fk-space-4);
	font-style: italic;
}

.fk-more { margin-top: var(--fk-space-4); }
.fk-more .fk-link { white-space: normal; }

.fk-who h3,
.fk-steps h3 { margin-bottom: var(--fk-space-1); }

.fk-who p,
.fk-steps p { margin: 0; }

/* ---------- Article list ---------- */

.fk-posts li { grid-template-columns: 1fr; gap: var(--fk-space-1); }
.fk-posts a { text-decoration: none; }
.fk-posts a:hover { color: var(--fk-accent); }

.fk-post__meta {
	font-size: var(--fk-size-small);
	color: var(--fk-text-muted);
	margin: 0;
}

/* ---------- FAQ ---------- */

.fk-faq { max-width: 760px; }

.fk-faq details {
	border-bottom: var(--fk-border);
	padding: var(--fk-space-3) 0;
}

.fk-faq summary {
	cursor: pointer;
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-h3);
	color: var(--fk-ink);
	list-style: none;
}

.fk-faq summary::-webkit-details-marker { display: none; }
.fk-faq summary::after { content: " +"; color: var(--fk-accent); }
.fk-faq details[open] summary::after { content: " −"; }
.fk-faq details p { margin: var(--fk-space-2) 0 0; max-width: var(--fk-measure); }

/* ---------- Inside Divi Code modules ----------
   Divi gives every p, ul and heading of the content area its own padding,
   list bullets and line height. Inside fk-* sections the child theme owns
   the rhythm, so those defaults are neutralised here. */

.et_pb_code_inner [class*="fk-"] p,
.et_pb_code_inner [class*="fk-"] h1,
.et_pb_code_inner [class*="fk-"] h2,
.et_pb_code_inner [class*="fk-"] h3 { padding-bottom: 0; }

.et_pb_code_inner .fk-queries,
.et_pb_code_inner .fk-steps,
.et_pb_code_inner .fk-ai__sources {
	padding: 0;
	list-style: none;
	line-height: inherit;
}

.et_pb_code_inner .fk-section,
.et_pb_code_inner .fk-query { font-family: var(--fk-font-body); font-size: var(--fk-size-body); line-height: var(--fk-leading); }

/* Paragraph rhythm that Divi's padding used to give, as the browser default. */
.et_pb_code_inner .fk-lead,
.et_pb_code_inner .fk-text { margin-bottom: 1em; }

.et_pb_code_inner .fk-text,
.et_pb_code_inner .fk-who p,
.et_pb_code_inner .fk-steps p,
.et_pb_code_inner .fk-faq p,
.et_pb_code_inner .fk-belief p { font-size: var(--fk-size-body); }

/* ==========================================================================
   Global header and footer (Theme Builder layouts 330 / 331)
   ========================================================================== */

/* The header stays in reach while reading. */
.et-l--header {
	position: sticky;
	top: 0;
	z-index: 1000;
}

.admin-bar .et-l--header { top: 32px; }

@media (max-width: 782px) {
	.admin-bar .et-l--header { top: 46px; }
}

.fk-site-header {
	background: var(--fk-bg-dark);
	border-bottom: 1px solid #222222;
}

.fk-site-header__inner {
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--fk-space-3);
	min-height: 72px;
}

.fk-site-header__logo img {
	display: block;
	width: 132px;
	height: auto;
	filter: invert(1);
}

.fk-nav {
	display: none;
	gap: var(--fk-space-3);
	margin-left: auto;
}

.fk-nav a,
.fk-menu__panel a:not(.fk-btn) {
	color: var(--fk-on-dark-muted);
	font-family: var(--fk-font-body);
	font-size: var(--fk-size-small);
	text-decoration: none;
}

.fk-nav a:hover,
.fk-menu__panel a:not(.fk-btn):hover { color: var(--fk-on-dark); }

.fk-site-header__cta {
	min-height: 42px;
	padding: 0.5rem 1rem;
	font-size: var(--fk-size-small);
	white-space: nowrap;
	margin-left: auto;
}

.fk-menu summary {
	list-style: none;
	cursor: pointer;
	color: var(--fk-on-dark);
	font-family: var(--fk-font-body);
	font-size: var(--fk-size-small);
	padding: 0.6rem 0.25rem;
	min-height: 44px;
	display: flex;
	align-items: center;
}

.fk-menu summary::-webkit-details-marker { display: none; }
.fk-menu[open] summary { color: var(--fk-accent); }

.fk-menu__panel {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	display: grid;
	gap: var(--fk-space-2);
	padding: var(--fk-space-3) 0 var(--fk-space-4);
	background: var(--fk-bg-dark);
	border-bottom: 1px solid #222222;
}

.fk-menu__panel a:not(.fk-btn) { font-size: var(--fk-size-body); padding: 0.25rem 0; }
.fk-menu__panel .fk-btn { justify-self: start; margin-top: var(--fk-space-1); }

@media (max-width: 479px) {
	.fk-site-header__cta { display: none; }
	.fk-menu { margin-left: auto; }
}

@media (min-width: 960px) {
	.fk-nav { display: flex; }
	.fk-site-header__cta { margin-left: var(--fk-space-2); }
	.fk-menu { display: none; }
}

/* ---------- Footer ---------- */

.fk-site-footer {
	background: var(--fk-bg-dark);
	color: var(--fk-on-dark-muted);
	padding-block: var(--fk-space-6) var(--fk-space-4);
	font-family: var(--fk-font-body);
	font-size: var(--fk-size-small);
	line-height: var(--fk-leading);
}

.fk-site-footer__grid {
	display: grid;
	gap: var(--fk-space-4);
}

@media (min-width: 768px) {
	.fk-site-footer__grid { grid-template-columns: 1.6fr 1fr 1fr 1fr; }
}

.fk-site-footer p { margin: 0 0 var(--fk-space-2); padding: 0; }
.fk-site-footer p.fk-site-footer__name {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: var(--fk-size-h3);
	color: var(--fk-on-dark);
}

.fk-site-footer p.fk-site-footer__label { color: var(--fk-on-dark); font-weight: 600; }
.fk-site-footer ul { list-style: none; padding: 0; margin: 0; }
.fk-site-footer li { margin-bottom: var(--fk-space-1); }
.fk-site-footer a { color: var(--fk-on-dark-muted); text-decoration: none; }
.fk-site-footer a:hover { color: var(--fk-on-dark); }
.fk-site-footer address { font-style: normal; }
.fk-site-footer address a { color: var(--fk-on-dark); text-decoration: underline; text-decoration-color: var(--fk-accent); text-underline-offset: 4px; }

.fk-site-footer p.fk-site-footer__bottom {
	margin: var(--fk-space-5) 0 0;
	padding-top: var(--fk-space-3);
	border-top: 1px solid #333333;
}

/* Footer in three rows: links, newsletter slot (Email Optin module), bottom line. */
.fk-site-footer--top { padding-bottom: var(--fk-space-4); }

.fk-site-footer--newsletter {
	padding: var(--fk-space-4) 0 var(--fk-space-2);
	border-top: 1px solid #333333;
}

.fk-site-footer--newsletter p:last-child { max-width: 52ch; }

.fk-site-footer--bottom { padding-top: 0; padding-bottom: var(--fk-space-4); }
.fk-site-footer--bottom p.fk-site-footer__bottom { margin-top: var(--fk-space-3); }

/* Divi Email Optin module dropped into the newsletter row. */
.et-l--footer .et_pb_newsletter {
	background: transparent !important;
	padding: 0 0 var(--fk-space-3) !important;
}

.et-l--footer .et_pb_newsletter_description { display: none; }

.et-l--footer .et_pb_newsletter_form input[type="text"],
.et-l--footer .et_pb_newsletter_form input[type="email"] {
	background: #111111 !important;
	color: var(--fk-on-dark) !important;
	border: 1px solid #333333 !important;
	border-radius: var(--fk-radius) !important;
	font-family: var(--fk-font-body) !important;
}

.et-l--footer .et_pb_newsletter_button {
	background: var(--fk-accent) !important;
	border: 0 !important;
	border-radius: var(--fk-radius) !important;
	color: var(--fk-on-dark) !important;
	font-family: var(--fk-font-body) !important;
}

/* ---------- Portrait (story) ---------- */

.fk-portrait {
	display: block;
	width: 100%;
	max-width: 360px;
	height: auto;
	margin-top: var(--fk-space-3);
	border-radius: var(--fk-radius);
	background: #e9e9e9;
}

/* ==========================================================================
   Motion. Only active when assets/js/main.js adds .fk-motion to <html>
   (JavaScript running and no reduced-motion preference).
   ========================================================================== */

/* Typed queries. Hidden until main.js has split the heading, so the full
   text never flashes first. Hidden characters keep their width: no shift. */
.fk-motion .fk-query__q:not(.is-ready) { visibility: hidden; }
.fk-motion .fk-query .fk-char { visibility: hidden; }
.fk-motion .fk-query .fk-char.is-on { visibility: visible; }
.fk-motion .fk-query.is-typing .fk-caret { animation: none; }

.fk-motion .fk-query__answer {
	opacity: 0;
	transform: translateY(14px);
}

.fk-motion .fk-query.is-typed .fk-query__answer {
	opacity: 1;
	transform: none;
	transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.15s, transform 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.15s;
}

/* Section reveals. */
.fk-motion .fk-reveal {
	opacity: 0;
	transform: translateY(18px);
	filter: blur(6px);
	transition:
		opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
		transform 0.8s cubic-bezier(0.16, 1, 0.3, 1),
		filter 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.fk-motion .fk-reveal.is-in {
	opacity: 1;
	transform: none;
	filter: none;
}

/* The portrait is uncovered from the bottom rather than faded. */
.fk-motion .fk-portrait.fk-reveal {
	opacity: 1;
	transform: none;
	filter: none;
	clip-path: inset(100% 0 0 0 round var(--fk-radius));
	transition: clip-path 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.fk-motion .fk-portrait.fk-reveal.is-in { clip-path: inset(0 0 0 0 round var(--fk-radius)); }

/* In the AI answer, the citation of Fokwa's name is underlined once the card is in. */
.fk-motion .fk-ai mark {
	text-decoration: none;
	background-image: linear-gradient(currentColor, currentColor);
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0% 2px;
	transition: background-size 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.7s;
}

.fk-motion .fk-ai.is-in mark { background-size: 100% 2px; }

.fk-motion .fk-ai__sources li:first-child {
	transition: background-color 0.6s ease-out 1.3s, color 0.6s ease-out 1.3s;
}

.fk-motion .fk-ai.is-in .fk-ai__sources li:first-child {
	background: var(--fk-accent);
	color: var(--fk-on-dark);
}

/* ==========================================================================
   Services page: one block per offer, then a comparison table.
   ========================================================================== */

.fk-service {
	display: grid;
	gap: var(--fk-space-3);
	padding: var(--fk-space-5) 0;
	border-top: 1px solid var(--fk-ink);
}

@media (min-width: 900px) {
	.fk-service {
		grid-template-columns: 1fr 1.5fr;
		gap: var(--fk-space-6);
	}
}

.fk-service__name {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: var(--fk-size-h2);
	line-height: 1.05;
	color: var(--fk-ink);
	margin: 0 0 var(--fk-space-2);
}

.fk-service__for { margin: 0 0 var(--fk-space-3); color: var(--fk-text-muted); }

.fk-service__price {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-h3);
	color: var(--fk-ink);
	margin: 0 0 var(--fk-space-3);
}

.fk-service__price small {
	display: block;
	font-family: var(--fk-font-body);
	font-weight: normal;
	font-size: var(--fk-size-small);
	color: var(--fk-text-muted);
}

.fk-service h3 {
	font-family: var(--fk-font-body);
	font-weight: 600;
	font-size: var(--fk-size-body);
	color: var(--fk-ink);
	margin: 0 0 var(--fk-space-1);
}

.fk-service ul {
	margin: 0 0 var(--fk-space-3);
	padding-left: 1.1em;
}

.fk-service li { margin-bottom: 0.35rem; }
.fk-service li::marker { color: var(--fk-accent); }

.fk-service__proof {
	margin: 0;
	padding-top: var(--fk-space-2);
	border-top: var(--fk-border);
	font-size: var(--fk-size-small);
	color: var(--fk-text-muted);
}

.fk-service--featured .fk-service__name::after {
	content: "";
	display: block;
	width: 48px;
	height: 4px;
	margin-top: var(--fk-space-2);
	background: var(--fk-accent);
}

.fk-compare-wrap { overflow-x: auto; }

.fk-compare {
	width: 100%;
	min-width: 640px;
	border-collapse: collapse;
	font-size: var(--fk-size-small);
}

.fk-compare th,
.fk-compare td {
	text-align: left;
	vertical-align: top;
	padding: var(--fk-space-2);
	border-bottom: var(--fk-border);
}

.fk-compare thead th {
	font-family: var(--fk-font-body);
	font-weight: 600;
	color: var(--fk-ink);
	border-bottom: 1px solid var(--fk-ink);
}

.fk-compare tbody th {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-body);
	color: var(--fk-ink);
}

.fk-compare td { font-variant-numeric: tabular-nums; }

.et_pb_code_inner .fk-service ul { list-style: disc; padding: 0 0 0 1.1em; line-height: inherit; }

/* ==========================================================================
   About page: query hero with a photo, three roles, a dated path,
   a wide photo with the motto, ways of working.
   ========================================================================== */

.fk-query--split .fk-container {
	display: grid;
	gap: var(--fk-space-5);
	align-items: end;
}

@media (min-width: 900px) {
	.fk-query--split .fk-container { grid-template-columns: 1.15fr 1fr; }
}

.fk-query--split .fk-query__q { max-width: 12ch; }

.fk-hero-photo {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--fk-radius);
}

.fk-path {
	list-style: none;
	margin: 0;
	padding: 0;
	border-left: 2px solid var(--fk-ink);
}

.fk-path li {
	position: relative;
	display: grid;
	gap: var(--fk-space-1);
	padding: 0 0 var(--fk-space-5) var(--fk-space-4);
}

@media (min-width: 900px) {
	.fk-path li {
		grid-template-columns: 9rem 1fr;
		gap: var(--fk-space-4);
	}
}

.fk-path li::before {
	content: "";
	position: absolute;
	left: -7px;
	top: 0.55em;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--fk-accent);
}

.fk-path__when {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: var(--fk-size-h3);
	color: var(--fk-accent);
	line-height: 1.2;
	margin: 0;
}

.fk-path__what h3 { margin: 0 0 var(--fk-space-1); }
.fk-path__what p { margin: 0; max-width: var(--fk-measure); }

.fk-wide-photo {
	margin: 0;
}

.fk-wide-photo img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 640px;
	object-fit: cover;
	border-radius: var(--fk-radius);
}

.fk-motto {
	margin: var(--fk-space-5) auto 0;
	max-width: 22ch;
	text-align: center;
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: clamp(2rem, 1.4rem + 2.4vw, 3.5rem);
	line-height: 1.05;
	letter-spacing: -0.015em;
	color: var(--fk-ink);
	text-wrap: balance;
}

.fk-motto cite {
	display: block;
	margin-top: var(--fk-space-2);
	font-family: var(--fk-font-body);
	font-weight: normal;
	font-style: normal;
	font-size: var(--fk-size-small);
	letter-spacing: 0;
	color: var(--fk-text-muted);
}

@media (min-width: 768px) {
	.fk-who--4 { grid-template-columns: repeat(2, 1fr); }
}

.et_pb_code_inner .fk-path { padding: 0; list-style: none; line-height: inherit; }

.fk-motion .fk-hero-photo {
	opacity: 0;
	transform: scale(1.02);
}

.fk-motion .fk-query.is-typed .fk-hero-photo {
	opacity: 1;
	transform: none;
	transition: opacity 1.1s cubic-bezier(0.16, 1, 0.3, 1) 0.3s, transform 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.3s;
}

/* In the split hero, the answer sits in a narrow column: text then button, stacked. */
@media (min-width: 900px) {
	.fk-query--split .fk-query__answer { grid-template-columns: 1fr; }
	.fk-query--split .fk-query__action { text-align: left; }
}

/* ==========================================================================
   Contact page: booking and message side by side, direct lines, next steps.
   ========================================================================== */

.fk-contact {
	display: grid;
	gap: var(--fk-space-5);
	align-items: start;
}

@media (min-width: 960px) {
	.fk-contact { grid-template-columns: 1.1fr 1fr; gap: var(--fk-space-6); }
}

.fk-panel {
	border: var(--fk-border);
	border-radius: var(--fk-radius);
	padding: var(--fk-space-4);
	background: var(--fk-bg);
	box-shadow: var(--fk-shadow);
}

.fk-panel--accent { border: 2px solid var(--fk-accent); }

.fk-panel__title {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	font-size: var(--fk-size-h3);
	color: var(--fk-ink);
	margin: 0 0 var(--fk-space-1);
}

.fk-panel__note { margin: 0 0 var(--fk-space-3); color: var(--fk-text-muted); font-size: var(--fk-size-small); }

.fk-form { display: grid; gap: var(--fk-space-2); }

.fk-form label {
	display: grid;
	gap: 0.35rem;
	font-size: var(--fk-size-small);
	font-weight: 600;
	color: var(--fk-ink);
}

.fk-form label small { font-weight: normal; font-size: inherit; color: var(--fk-text-muted); }

.fk-form input,
.fk-form select,
.fk-form textarea {
	width: 100%;
	min-height: 48px;
	padding: 0.7rem 0.85rem;
	border: 1px solid #bdbdbd;
	border-radius: var(--fk-radius);
	background: var(--fk-bg);
	color: var(--fk-ink);
	font: inherit;
	font-size: var(--fk-size-body);
	font-weight: normal;
}

.fk-form textarea { min-height: 140px; resize: vertical; }

.fk-form input:focus-visible,
.fk-form select:focus-visible,
.fk-form textarea:focus-visible {
	outline: 3px solid var(--fk-accent);
	outline-offset: 1px;
	border-color: var(--fk-accent);
}

.fk-form__row { display: grid; gap: var(--fk-space-2); }

@media (min-width: 600px) {
	.fk-form__row { grid-template-columns: 1fr 1fr; }
}

/* Honeypot: invisible to people, filled by bots. */
.fk-form__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.fk-form .fk-btn { justify-self: start; margin-top: var(--fk-space-1); }

.fk-form__consent { font-size: var(--fk-size-small); color: var(--fk-text-muted); margin: 0; }

.fk-lines {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--fk-space-3);
}

@media (min-width: 768px) {
	.fk-lines { grid-template-columns: repeat(4, 1fr); }
}

.fk-lines li { border-top: 1px solid var(--fk-ink); padding-top: var(--fk-space-2); }

.fk-lines__label {
	display: block;
	font-size: var(--fk-size-small);
	color: var(--fk-text-muted);
	margin-bottom: 0.25rem;
}

.fk-lines a { color: var(--fk-ink); font-weight: 600; text-decoration-color: var(--fk-accent); text-underline-offset: 4px; }

.et_pb_code_inner .fk-lines { padding: 0; list-style: none; line-height: inherit; }

/* Contact form result message (filled by main.js from ?sent=). */
.fk-form-status {
	margin: 0 0 var(--fk-space-3);
	padding: var(--fk-space-2) var(--fk-space-3);
	border-radius: var(--fk-radius);
	font-size: var(--fk-size-small);
}

.fk-form-status.is-ok { background: var(--fk-accent-soft); color: var(--fk-accent-dark); }
.fk-form-status.is-error { background: #fdecec; color: #8a1c1c; }

/* ---------- Legal pages (privacy, refund, terms) ---------- */

.fk-legal { max-width: 760px; }
.fk-legal .fk-h1 { font-size: clamp(2.25rem, 1.6rem + 2.4vw, 3.5rem); }
.fk-legal .fk-h2 { font-size: var(--fk-size-h3); margin: var(--fk-space-5) 0 var(--fk-space-2); }
.fk-legal .fk-h3 { font-size: var(--fk-size-body); font-family: var(--fk-font-body); font-weight: 600; margin: var(--fk-space-3) 0 var(--fk-space-1); }
.fk-legal p,
.fk-legal li { font-family: var(--fk-font-body); font-size: var(--fk-size-body); line-height: var(--fk-leading); color: var(--fk-text); }
.fk-legal p { margin: 0 0 var(--fk-space-2); }
.fk-legal ul { margin: 0 0 var(--fk-space-2); padding-left: 1.2em; }
.et_pb_code_inner .fk-legal ul { list-style: disc; padding: 0 0 0 1.2em; }
.fk-legal a { color: var(--fk-accent); }

/* ---------- Analytics consent banner (drawn by main.js) ---------- */

.fk-consent {
	position: fixed;
	z-index: 10000;
	left: var(--fk-space-2);
	right: var(--fk-space-2);
	bottom: var(--fk-space-2);
	max-width: 420px;
	padding: var(--fk-space-3);
	background: var(--fk-bg);
	color: var(--fk-text);
	border: var(--fk-border);
	border-radius: var(--fk-radius);
	box-shadow: var(--fk-shadow-hover);
	font-family: var(--fk-font-body);
	font-size: var(--fk-size-small);
	line-height: 1.5;
}

.fk-consent p { margin: 0 0 var(--fk-space-2); }
.fk-consent a { color: var(--fk-accent); }
.fk-consent__actions { display: flex; gap: var(--fk-space-1); }
.fk-consent .fk-btn { min-height: 44px; padding: 0.5rem 1rem; font-size: var(--fk-size-small); }

@media (max-width: 767px) {
	/* Sit above the sticky call bar. */
	.fk-consent { bottom: calc(76px + env(safe-area-inset-bottom)); }
}

.fk-site-footer button.fk-site-footer__link {
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	color: var(--fk-on-dark-muted);
	cursor: pointer;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ==========================================================================
   Insights: article template and article list.
   ========================================================================== */

.fk-article-head { padding-block: var(--fk-space-6) var(--fk-space-4); }

.fk-crumbs {
	margin: 0 0 var(--fk-space-3);
	font-size: var(--fk-size-small);
	color: var(--fk-on-dark-muted);
}

.fk-crumbs a { color: var(--fk-on-dark-muted); text-decoration: none; }
.fk-crumbs a:hover { color: var(--fk-on-dark); }

.fk-article-head .fk-h1 {
	font-size: clamp(2.25rem, 1.5rem + 3vw, 4rem);
	max-width: 22ch;
	text-wrap: balance;
	color: var(--fk-on-dark);
}

.fk-article-meta {
	margin: var(--fk-space-3) 0 0;
	font-size: var(--fk-size-small);
	color: var(--fk-on-dark-muted);
}

.fk-article-layout {
	display: grid;
	gap: var(--fk-space-5);
	padding-block: var(--fk-space-5) var(--fk-space-6);
}

@media (min-width: 1000px) {
	.fk-article-layout { grid-template-columns: 15rem minmax(0, 1fr); gap: var(--fk-space-6); }
	.fk-article-layout--single { grid-template-columns: minmax(0, 1fr) 18rem; gap: var(--fk-space-5); }
	/* With a table of contents, the sidebar goes under the article until there is room for three columns. */
	.fk-article-layout .fk-side { grid-column: 2; }
	.fk-article-layout--single .fk-side { grid-column: auto; position: sticky; top: 104px; align-self: start; }
}

@media (min-width: 1200px) {
	.fk-article-layout:not(.fk-article-layout--single) { grid-template-columns: 12rem minmax(0, 1fr) 16rem; gap: var(--fk-space-4); }
	.fk-article-layout .fk-side { grid-column: auto; position: sticky; top: 104px; align-self: start; }
}

.fk-toc {
	align-self: start;
	font-size: var(--fk-size-small);
}

@media (min-width: 1000px) {
	.fk-toc { position: sticky; top: 104px; }
}

.fk-toc__title { margin: 0 0 var(--fk-space-2); font-weight: 600; color: var(--fk-ink); }
.fk-toc ol { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--fk-line); }
.fk-toc li { margin: 0; }
.fk-toc a {
	display: block;
	padding: 0.35rem 0 0.35rem var(--fk-space-2);
	margin-left: -2px;
	border-left: 2px solid transparent;
	color: var(--fk-text-muted);
	text-decoration: none;
	line-height: 1.4;
}

.fk-toc a:hover,
.fk-toc a.is-current { color: var(--fk-ink); border-left-color: var(--fk-accent); }

.fk-answer {
	margin: 0 0 var(--fk-space-5);
	padding: var(--fk-space-3) var(--fk-space-4);
	background: var(--fk-accent-soft);
	border-radius: var(--fk-radius);
}

.fk-answer__label {
	display: block;
	margin-bottom: var(--fk-space-1);
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-display);
	color: var(--fk-accent-dark);
}

.fk-answer p { margin: 0; font-size: calc(var(--fk-size-body) * 1.08); color: var(--fk-ink); line-height: 1.6; }

/* Long-form reading. */
.fk-prose { max-width: 70ch; font-family: var(--fk-font-body); font-size: calc(var(--fk-size-body) * 1.06); line-height: 1.75; color: var(--fk-text); }
.fk-prose > * + * { margin-top: 1.1em; }
.fk-prose p { margin: 0 0 1.1em; padding: 0; }
.fk-prose > * + * { margin-top: 0; }
.fk-prose h2 {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-h2);
	line-height: 1.15;
	color: var(--fk-ink);
	margin: 2.2em 0 0.6em;
	padding: 0;
	scroll-margin-top: 110px;
}
.fk-prose h3 {
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-h3);
	line-height: 1.25;
	color: var(--fk-ink);
	margin: 1.8em 0 0.4em;
	padding: 0;
	scroll-margin-top: 110px;
}
.fk-prose a { color: var(--fk-accent); text-underline-offset: 3px; }
.fk-prose ul,
.fk-prose ol { padding-left: 1.3em; }
.fk-prose li + li { margin-top: 0.4em; }
.fk-prose li::marker { color: var(--fk-accent); }
.fk-prose strong { color: var(--fk-ink); }
.fk-prose blockquote {
	margin: 1.6em 0;
	padding: 0 0 0 var(--fk-space-3);
	border-left: 3px solid var(--fk-accent);
	font-style: italic;
	color: var(--fk-ink);
}
.fk-prose img { max-width: 100%; height: auto; border-radius: var(--fk-radius); }
.fk-prose table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--fk-size-small);
	display: block;
	overflow-x: auto;
}
.fk-prose th,
.fk-prose td { padding: 0.6rem 0.75rem; border-bottom: var(--fk-border); text-align: left; vertical-align: top; }
.fk-prose th { color: var(--fk-ink); border-bottom-color: var(--fk-ink); }
.fk-prose hr { border: 0; border-top: var(--fk-border); margin: 2em 0; }

.fk-cta-box {
	margin: var(--fk-space-6) 0 0;
	padding: var(--fk-space-4);
	background: var(--fk-bg-dark);
	color: var(--fk-on-dark-muted);
	border-radius: var(--fk-radius);
}
.fk-cta-box .fk-h3 { color: var(--fk-on-dark); margin-bottom: var(--fk-space-1); }
.fk-cta-box p { margin: 0 0 var(--fk-space-3); max-width: 52ch; }

.fk-author {
	display: grid;
	grid-template-columns: 72px 1fr;
	gap: var(--fk-space-3);
	align-items: center;
	margin-top: var(--fk-space-5);
	padding-top: var(--fk-space-4);
	border-top: var(--fk-border);
}
.fk-author img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; object-position: center 20%; }
.fk-author p { margin: 0; font-size: var(--fk-size-small); }
.fk-comments { margin-top: var(--fk-space-5); padding-top: var(--fk-space-4); border-top: var(--fk-border); }
.fk-author strong { display: block; font-family: var(--fk-font-heading); font-size: var(--fk-size-body); color: var(--fk-ink); }

/* Article sidebar: the free call first, then what I build, then the tools I use (affiliate links). */
.fk-side { display: grid; gap: 0.75rem; align-content: start; font-size: var(--fk-size-small); }
.fk-side__card { padding: 0.875rem 1rem; border: var(--fk-border); border-radius: var(--fk-radius); background: var(--fk-bg); }
.fk-side__card--dark { background: var(--fk-bg-dark); border-color: var(--fk-bg-dark); color: var(--fk-on-dark-muted); }
.fk-side__title {
	margin: 0 0 var(--fk-space-1);
	padding: 0;
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: 1.25rem;
	line-height: 1.2;
	color: var(--fk-ink);
}
.fk-side__card--dark .fk-side__title { color: var(--fk-on-dark); }
.fk-side__text { margin: 0 0 0.75rem; padding: 0; line-height: 1.45; }
.fk-side .fk-btn { display: block; text-align: center; padding-inline: 0.75rem; white-space: nowrap; }
.fk-side__list { list-style: none; margin: 0; padding: 0; }
.fk-side__list li { margin: 0; padding: 0; border-bottom: var(--fk-border); }
.fk-side__list li:last-child { border-bottom: 0; }
.fk-side__list a { display: block; padding: 0.25rem 0; color: var(--fk-text-muted); font-size: 0.8125rem; text-decoration: none; line-height: 1.3; }
.fk-side__list strong { display: block; color: var(--fk-ink); font-size: var(--fk-size-small); }
.fk-side__list a:hover strong { color: var(--fk-accent); }
.fk-side__note { margin: var(--fk-space-1) 0 0; padding: 0; font-size: 0.8125rem; line-height: 1.4; color: var(--fk-text-muted); }

/* Article list (Insights page, related articles). */
.fk-chips { display: flex; flex-wrap: wrap; gap: var(--fk-space-1); margin: 0 0 var(--fk-space-4); padding: 0; list-style: none; }
.fk-chips a {
	display: inline-block;
	padding: 0.35rem 0.85rem;
	border: 1px solid var(--fk-line);
	border-radius: 999px;
	font-size: var(--fk-size-small);
	color: var(--fk-ink);
	text-decoration: none;
}
.fk-chips a:hover,
.fk-chips a.is-current { border-color: var(--fk-accent); color: var(--fk-accent); }

.fk-post-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--fk-ink); }
.fk-post-list li { border-bottom: var(--fk-border); }
.fk-post-list a {
	display: grid;
	gap: var(--fk-space-1);
	padding: var(--fk-space-4) 0;
	text-decoration: none;
	color: inherit;
}
@media (min-width: 900px) {
	.fk-post-list a { grid-template-columns: 10rem 1fr; gap: var(--fk-space-4); }
}
.fk-post-list__meta { font-size: var(--fk-size-small); color: var(--fk-text-muted); }
.fk-post-list__title {
	display: block;
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-h3);
	line-height: 1.2;
	color: var(--fk-ink);
	margin: 0 0 var(--fk-space-1);
}
.fk-post-list a:hover .fk-post-list__title { color: var(--fk-accent); }
.fk-post-list__excerpt { display: block; margin: 0; color: var(--fk-text); max-width: 70ch; }

.et_pb_code_inner .fk-post-list,
.et_pb_code_inner .fk-chips,
.et_pb_code_inner .fk-toc ol { padding: 0; list-style: none; line-height: inherit; }

/* ==========================================================================
   Resources: guides by language (product cards with covers).
   ========================================================================== */

.fk-shelf {
	display: grid;
	gap: var(--fk-space-4);
	grid-template-columns: repeat(auto-fill, minmax(min(150px, 42%), 1fr));
	column-gap: var(--fk-space-3);
	margin: 0 0 var(--fk-space-6);
	padding: 0;
	list-style: none;
}

.fk-book a {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
}

.fk-book__cover {
	aspect-ratio: 3 / 4;
	width: 100%;
	object-fit: cover;
	border-radius: var(--fk-radius);
	background: #eeeeee;
	box-shadow: var(--fk-shadow);
	transition: box-shadow var(--fk-transition), transform var(--fk-transition);
}

.fk-book a:hover .fk-book__cover { box-shadow: var(--fk-shadow-hover); transform: translateY(-3px); }

.fk-book__title {
	margin: var(--fk-space-2) 0 var(--fk-space-1);
	font-family: var(--fk-font-heading);
	font-weight: var(--fk-weight-heading);
	font-size: var(--fk-size-body);
	line-height: 1.25;
	color: var(--fk-ink);
}

.fk-book__price { margin: auto 0 0; font-size: var(--fk-size-small); color: var(--fk-text-muted); font-variant-numeric: tabular-nums; }
.fk-book__price strong { color: var(--fk-ink); }

.fk-lang-head { display: flex; align-items: baseline; gap: var(--fk-space-2); margin-bottom: var(--fk-space-3); }
.fk-lang-head .fk-h2 { margin: 0; }
.fk-lang-head span { font-size: var(--fk-size-small); color: var(--fk-text-muted); }

.et_pb_code_inner .fk-shelf { padding: 0; list-style: none; line-height: inherit; }

@media (min-width: 700px) {
	.fk-shelf { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); column-gap: var(--fk-space-4); }
}

@media (prefers-reduced-motion: reduce) {
	.fk-book__cover { transition: none; }
}

/* ---------- Language switch (header) ---------- */

.fk-lang-switch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	min-height: 2.5rem;
	border: 1px solid var(--fk-on-dark-muted);
	border-radius: 999px;
	color: var(--fk-on-dark);
	font-family: var(--fk-font-body);
	font-size: var(--fk-size-small);
	letter-spacing: 0.04em;
	text-decoration: none;
}
.fk-lang-switch:hover { background: var(--fk-on-dark); color: #000; }
.fk-nav .fk-lang-switch { color: var(--fk-on-dark); }
.fk-menu__panel .fk-lang-switch { justify-self: start; }