/* Micro-fabriek homepage — supplementary styles.
 * theme.json carries colors/type/spacing. This file is for things theme.json
 * can't express AND for layouts inside wp:html blocks (where block-level
 * attributes don't apply).
 */

/* ─── Polylang language switcher in the navbar ─────────────────────
 * Renders as a <ul> of <li><a>NL/EN/FR</a></li>. Styling matches the
 * prototype's pill-toggle design — uppercase, rounded, current language
 * shown as a filled white pill on the dark navbar.
 */
.mfk-header .wp-block-polylang-language-switcher,
.mfk-header ul.pll-switcher-ul,
.mfk-header ul.pll-switcher {
	list-style: none;
	margin: 0;
	padding: 0;
	display: inline-flex;
	gap: 4px;
}
.mfk-header .wp-block-polylang-language-switcher li,
.mfk-header .pll-switcher-ul li {
	margin: 0;
	padding: 0;
	display: inline-block;
}
.mfk-header .wp-block-polylang-language-switcher a,
.mfk-header .pll-switcher-ul a {
	display: inline-flex;
	align-items: center;
	padding: 2px 10px;
	border-radius: 9999px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	color: #a3a3a3;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.2);
	text-decoration: none;
	line-height: 1.4;
	transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}
.mfk-header .wp-block-polylang-language-switcher a:hover,
.mfk-header .pll-switcher-ul a:hover {
	color: var(--wp--preset--color--paper);
	border-color: rgba(255, 255, 255, 0.45);
}
.mfk-header .wp-block-polylang-language-switcher .current-lang a,
.mfk-header .wp-block-polylang-language-switcher li.current-lang > a,
.mfk-header .pll-switcher-ul .current-lang a {
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--paper);
}

/* ─── Footer legal-links row (Privacy · Verzending · etc.) ─────────── */
.mfk-footer__legal a {
	color: inherit;
	text-decoration: none;
}
.mfk-footer__legal a:hover {
	text-decoration: underline;
	color: var(--wp--preset--color--paper);
}

/* ─── Footer social icons (matches prototype's 28×28 outlined squares) ─── */

.mfk-socials {
	margin-top: 20px;
	display: inline-flex;
	gap: 8px;
}
.mfk-social {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	color: #ffffff;
	text-decoration: none;
	transition: border-color 150ms ease, background 150ms ease;
}
.mfk-social:hover {
	border-color: rgba(255, 255, 255, 0.45);
	background: rgba(255, 255, 255, 0.06);
}

/* ─── Header tweaks (sticky on top, thin hairline, flush against next section) ─── */

/* Sticky must live on the OUTER wp-block-template-part wrapper, not on
 * .mfk-header itself — sticky needs a scroll-tall ancestor and the template-
 * part wrapper is the body-level child, while .mfk-header sits inside it.  */
body > div > header.wp-block-template-part,
header.wp-block-template-part:has(.mfk-header) {
	position: sticky;
	top: 0;
	z-index: 100;
}
.mfk-header {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	margin-bottom: 0 !important;
}

/* Smooth-scroll anchors + offset so the section heading doesn't slide under the sticky navbar */
html { scroll-behavior: smooth; }
.mfk-hero,
.mfk-pijlers,
.mfk-manifest,
.mfk-founders,
.mfk-atelier,
.mfk-workshops,
.mfk-shop,
.mfk-projects,
.mfk-news {
	scroll-margin-top: 80px;
}

/* Kill the default block-gap between header template-part and main content
 * so dark navbar sits flush against dark hero. */
.wp-site-blocks > main,
.wp-site-blocks > main.wp-block-group {
	margin-top: 0 !important;
	padding-top: 0 !important;
}
.mfk-header + main,
header.wp-block-template-part + main { margin-top: 0; }

/* ─── Shared utilities ───────────────────────────────────────────── */

.mfk-eyebrow {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-faint);
}

.mfk-mono {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 11px;
	color: var(--wp--preset--color--text-faint);
}

/* ─── Hero ───────────────────────────────────────────────────────── */

.mfk-hero {
	position: relative;
	overflow: hidden;
}

.mfk-hero__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 28px 32px 0;
	position: relative;
}

.mfk-hero__top-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 48px;
}

.mfk-hero__eyebrow { color: var(--wp--preset--color--accent); }

.mfk-hero__headline-wrap { position: relative; }

.mfk-hero__h1 {
	margin: 0;
	font-size: clamp(64px, 9.4vw, 150px);
	font-weight: 800;
	line-height: 0.9;
	letter-spacing: -0.045em;
	text-wrap: balance;
	color: var(--wp--preset--color--paper);
	position: relative;
	z-index: 1;
}

.mfk-hero__accent { color: var(--wp--preset--color--accent); }

/* Recycle motif — top-right of headline */
.mfk-recycle-mark {
	position: absolute;
	top: -6%;
	right: 0;
	width: 220px;
	height: 220px;
	color: var(--wp--preset--color--accent);
	pointer-events: none;
	z-index: 0;
}
.mfk-recycle-mark svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* Bottom row — lede paragraph + CTA cluster */
.mfk-hero__bottom-row {
	margin-top: 34px;
	display: grid;
	grid-template-columns: 1.15fr 0.85fr;
	gap: 40px;
	align-items: end;
	padding-bottom: 34px;
}

.mfk-hero__lede {
	margin: 0;
	font-size: 19px;
	line-height: 1.5;
	color: #d4d4d4;
	max-width: 580px;
	text-wrap: pretty;
}

.mfk-hero__lede-strong {
	color: var(--wp--preset--color--paper);
	font-weight: 600;
}

.mfk-hero__lede-accent {
	color: var(--wp--preset--color--accent);
	font-style: italic;
}

.mfk-hero__cta-cluster {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 12px;
}

.mfk-hero__cta-row {
	display: flex;
	gap: 12px;
}

.mfk-hero__scroll-hint {
	margin: 0;
	text-align: right;
}

/* Buttons (primary + ghost) — used in the hero CTA cluster */
.mfk-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 20px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	line-height: 1;
	transition: background 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.mfk-btn--primary {
	background: var(--wp--preset--color--accent);
	color: #ffffff;
	border: 1px solid var(--wp--preset--color--accent);
}
.mfk-btn--primary:hover {
	background: var(--wp--preset--color--accent-dark);
	border-color: var(--wp--preset--color--accent-dark);
}

.mfk-btn--ghost {
	background: transparent;
	color: var(--wp--preset--color--paper);
	border: 1px solid rgba(255, 255, 255, 0.25);
}
.mfk-btn--ghost:hover {
	border-color: rgba(255, 255, 255, 0.55);
}

/* ─── Ticker strip — seamless marquee ─────────────────────────────── */

.mfk-ticker {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	margin-top: 0;
	height: 43px;
	display: flex;
	align-items: center;
	overflow: hidden;
	white-space: nowrap;
}

.mfk-ticker__track {
	display: inline-flex;
	align-items: center;
	gap: 26px;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #a3a3a3;
	padding-left: 28px;
	animation: mfk-ticker 60s linear infinite;
	will-change: transform;
}

.mfk-ticker__sep { color: var(--wp--preset--color--accent); }

@keyframes mfk-ticker {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

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

/* ─── Pijlers (three pillar cards) ────────────────────────────────── */

.mfk-pijlers {
	padding: 68px 0;
}

.mfk-pijlers__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 32px;
}

.mfk-pijlers__head {
	margin-bottom: 28px;
	padding-bottom: 18px;
	border-bottom: 1px solid rgba(17, 17, 17, 0.12);
}

.mfk-pijlers__eyebrow {
	display: block;
	margin-bottom: 10px;
	color: var(--wp--preset--color--accent-dark);
}

.mfk-pijlers__h2 {
	margin: 0;
	max-width: 880px;
	font-size: clamp(32px, 4.2vw, 50px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--ink);
	text-wrap: balance;
}

.mfk-pijlers__h2-em {
	color: var(--wp--preset--color--accent-dark);
	font-style: italic;
	font-weight: 700;
}

.mfk-pijlers__aside {
	margin: 0;
	max-width: 280px;
	text-align: right;
	font-size: 13px;
	color: var(--wp--preset--color--text-faint);
	line-height: 1.55;
}

.mfk-pijlers__grid {
	display: grid;
	grid-template-columns: 1.25fr 1fr 1fr;
	gap: 14px;
}

/* Pillar card (used in Pijlers; also reusable for similar 3-card layouts).
 * Cards are <article> containers with a "stretched-link" pattern: the h3 link
 * carries an invisible ::after that covers the whole card, making it fully
 * clickable. Inline links inside the body sit above that overlay via z-index. */
.mfk-pillar {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 210px;
	padding: 22px;
	border-radius: 18px;
	background: #ffffff;
	color: var(--wp--preset--color--ink);
	border: 1px solid #e6e4dd;
	transition: transform 150ms ease, border-color 150ms ease;
}
.mfk-pillar:hover {
	transform: translateY(-2px);
	border-color: var(--wp--preset--color--accent);
}

/* The title's link doubles as the whole-card click target via ::after overlay. */
.mfk-pillar__title-link {
	color: inherit;
	text-decoration: none;
}
.mfk-pillar__title-link::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	z-index: 1;
}

/* Inline links (e.g. "klaargemaakt model" inside the body) need to sit
 * above the stretched-link overlay so they remain clickable. */
.mfk-pillar__lede,
.mfk-pillar__inline-link {
	position: relative;
	z-index: 2;
}
.mfk-pillar__inline-link {
	color: var(--wp--preset--color--accent);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.mfk-pillar--dark .mfk-pillar__inline-link {
	color: var(--wp--preset--color--accent);
}
.mfk-pillar__inline-link:hover {
	text-decoration-thickness: 2px;
}

.mfk-pillar--big {
	padding: 26px;
}

.mfk-pillar--dark {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	border-color: #1f1f1f;
}

.mfk-pillar__top {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 20px;
}
.mfk-pillar--big .mfk-pillar__top {
	margin-bottom: 30px;
}

.mfk-pillar__num {
	font-size: 44px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.04em;
	color: var(--wp--preset--color--accent);
}
.mfk-pillar--big .mfk-pillar__num {
	font-size: 60px;
}

.mfk-pillar__tag {
	color: var(--wp--preset--color--accent-dark);
}
.mfk-pillar__tag--on-dark {
	color: var(--wp--preset--color--accent);
}

.mfk-pillar__title {
	margin: 0 0 11px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.02em;
	text-wrap: balance;
	color: inherit;
}
.mfk-pillar--big .mfk-pillar__title {
	font-size: 29px;
}

.mfk-pillar__lede {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
	color: #6b7280;
}
.mfk-pillar--dark .mfk-pillar__lede {
	color: #a3a3a3;
}

.mfk-pillar__link {
	margin-top: 18px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--accent);
}

/* ─── Manifest wall ───────────────────────────────────────────────── */

.mfk-manifest {
	position: relative;
	overflow: hidden;
	padding: 78px 0;
}

.mfk-manifest__inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 32px;
	position: relative;
	z-index: 1;
}

.mfk-manifest__eyebrow {
	color: var(--wp--preset--color--ink);
	opacity: 0.6;
	margin: 0;
}

.mfk-manifest__quote {
	margin: 32px 0 0;
	max-width: 1040px;
	font-size: clamp(30px, 3.9vw, 52px);
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.025em;
	text-wrap: balance;
	color: var(--wp--preset--color--ink);
}

.mfk-manifest__u {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 6px;
}

.mfk-manifest__sig {
	margin-top: 48px;
	display: flex;
	gap: 32px;
	align-items: center;
}

.mfk-manifest__sig-mark {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--accent);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 36px;
	font-weight: 700;
	line-height: 1;
}

.mfk-manifest__sig-text {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.mfk-manifest__sig-name {
	font-size: 14px;
	font-weight: 700;
	color: var(--wp--preset--color--ink);
}

.mfk-manifest__sig-role {
	font-size: 12px;
	color: var(--wp--preset--color--ink);
	opacity: 0.7;
}

.mfk-manifest__flourish {
	position: absolute;
	right: -120px;
	bottom: -120px;
	width: 520px;
	height: 520px;
	opacity: 0.12;
	color: var(--wp--preset--color--ink);
	pointer-events: none;
	z-index: 0;
}
.mfk-manifest__flourish svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* ─── Reusable section primitives ─────────────────────────────────── */

.mfk-section-head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
	margin-bottom: 40px;
}
.mfk-section-head__aside {
	max-width: 320px;
	text-align: right;
	font-size: 13px;
	color: var(--wp--preset--color--text-faint);
	line-height: 1.55;
}

.mfk-h2-display {
	margin: 14px 0 0;
	font-size: clamp(32px, 4.2vw, 50px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--ink);
	text-wrap: balance;
}
.mfk-h2-em {
	color: var(--wp--preset--color--accent-dark);
	font-style: italic;
	font-weight: 700;
}

.mfk-eyebrow--accent      { color: var(--wp--preset--color--accent); }
.mfk-eyebrow--accent-dark { color: var(--wp--preset--color--accent-dark); }

.mfk-link-accent {
	color: var(--wp--preset--color--accent-dark);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}
.mfk-link-accent:hover { text-decoration: underline; }

/* Ghost button variant for light surfaces */
.mfk-btn--ghost-on-light {
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
}
.mfk-btn--ghost-on-light:hover { background: rgba(0, 0, 0, 0.04); }

/* ─── Placeholder (striped fill, used until photos arrive) ────────── */

.mfk-placeholder {
	position: relative;
	width: 100%;
	border-radius: 12px;
	overflow: hidden;
	background: repeating-linear-gradient(135deg, #f0efed 0 14px, #e5e1d8 14px 15px);
}
.mfk-placeholder--cream  { background: repeating-linear-gradient(135deg, #f5f1e8 0 14px, #ebe5d4 14px 15px); }
.mfk-placeholder--sand   { background: repeating-linear-gradient(135deg, #e8e2d4 0 14px, #ddd5c2 14px 15px); }
.mfk-placeholder--dark   { background: repeating-linear-gradient(135deg, #1a1a1a 0 14px, #262626 14px 15px); }
.mfk-placeholder--accent { background: repeating-linear-gradient(135deg, #fff1e6 0 14px, #ffe1c8 14px 15px); }
.mfk-placeholder--fill   { height: 100%; }
.mfk-placeholder__label {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 11px;
	color: #737373;
	background: #f0efed;
	padding: 6px 10px;
	border-radius: 4px;
	letter-spacing: 0.02em;
	max-width: 80%;
	text-align: center;
}
.mfk-placeholder--cream  .mfk-placeholder__label { background: #f5f1e8; color: #8c7a52; }
.mfk-placeholder--sand   .mfk-placeholder__label { background: #e8e2d4; color: #6b6357; }
.mfk-placeholder--dark   .mfk-placeholder__label { background: #1a1a1a; color: #a3a3a3; }
.mfk-placeholder--accent .mfk-placeholder__label { background: #fff1e6; color: #c2410c; }

/* ─── Founders (Wie zijn wij) ─────────────────────────────────────── */

.mfk-founders { padding: 68px 0; }
.mfk-founders__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 32px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 64px;
	align-items: start;
}
.mfk-founders__col--left { position: sticky; top: 24px; }
.mfk-founders__eyebrow { color: var(--wp--preset--color--accent-dark); }
.mfk-founders__h2 {
	margin: 16px 0 24px;
	font-size: clamp(38px, 4.6vw, 60px);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--ink);
	text-wrap: balance;
}
.mfk-founders__h2-em {
	color: var(--wp--preset--color--accent-dark);
	font-style: italic;
	font-weight: 700;
}
.mfk-founders__body {
	margin: 0 0 16px;
	max-width: 520px;
	font-size: 17px;
	line-height: 1.6;
	color: var(--wp--preset--color--text-muted);
}
.mfk-founders__body:last-of-type { margin-bottom: 28px; }
.mfk-founders__body em { font-style: italic; }
.mfk-founders__ctas { display: flex; gap: 12px; align-items: center; }
.mfk-founders__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 4px;
	color: var(--wp--preset--color--accent-dark);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
}

.mfk-founders__cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.mfk-founder--up   { transform: translateY(-32px); }
.mfk-founder--down { transform: translateY(32px); }
.mfk-founder__img {
	display: block;
	width: 100%;
	max-width: 320px;
	height: auto;
	margin: 0 auto;
	border-radius: 12px;
}
.mfk-founder__meta { margin-top: 14px; }
.mfk-founder__name {
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--ink);
}
.mfk-founder__role { margin-top: 2px; }
.mfk-founder__quote {
	margin: 12px 0 0;
	padding-left: 12px;
	border-left: 2px solid var(--wp--preset--color--accent);
	font-size: 14px;
	color: var(--wp--preset--color--text-muted);
	line-height: 1.55;
	font-style: italic;
}
.mfk-founders__wide { grid-column: 1 / -1; margin-top: 8px; }

/* ─── Atelier feature ─────────────────────────────────────────────── */

.mfk-atelier { padding: 68px 0; }
.mfk-atelier__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 32px;
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 56px;
	align-items: center;
}
.mfk-atelier__eyebrow { color: var(--wp--preset--color--accent); }
.mfk-atelier__h2 {
	margin: 14px 0 20px;
	font-size: clamp(34px, 4.2vw, 52px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--paper);
}
.mfk-atelier__h2-em { color: var(--wp--preset--color--accent); }
.mfk-atelier__body {
	margin: 0 0 28px;
	max-width: 520px;
	font-size: 17px;
	line-height: 1.6;
	color: #a3a3a3;
}
.mfk-atelier__features {
	list-style: none;
	margin: 0 0 32px;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	font-size: 14px;
	color: var(--wp--preset--color--paper);
}
.mfk-atelier__features li { display: flex; align-items: center; gap: 10px; }
.mfk-atelier__dot {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	background: #1f1f1f;
	font-size: 11px;
	font-weight: 700;
}
.mfk-atelier__dot--cut   { color: #ef4444; }  /* red — cut */
.mfk-atelier__dot--line  { color: #3b82f6; }  /* blue — line engrave */
.mfk-atelier__dot--fill  { color: #4b5563; }  /* grey — fill engrave */
.mfk-atelier__dot--print { color: #10b981; }  /* green — 3D print */
.mfk-atelier__dot--mark  { color: var(--wp--preset--color--accent); }
.mfk-atelier__ctas { display: flex; gap: 12px; }

/* Invitation row for other makers */
.mfk-atelier__invite {
	margin-top: 32px;
	padding-top: 20px;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	max-width: 560px;
}
.mfk-atelier__invite-eyebrow {
	color: var(--wp--preset--color--accent);
	display: inline-block;
	margin-bottom: 8px;
}
.mfk-atelier__invite-body {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: #d4d4d4;
}
.mfk-atelier__invite-link {
	color: var(--wp--preset--color--accent);
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}
.mfk-atelier__invite-link:hover { text-decoration: underline; }

.mfk-atelier__shot { position: relative; }
.mfk-atelier__img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
}
.mfk-atelier__sticker {
	position: absolute;
	right: -16px;
	bottom: -16px;
}

/* ─── Workshops (3 cards + chips) ─────────────────────────────────── */

.mfk-workshops { padding: 68px 0; }
.mfk-workshops__inner { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
.mfk-workshops__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
	gap: 16px;
	align-items: stretch;
}

.mfk-workshop {
	display: block;
	text-decoration: none;
	color: inherit;
}
.mfk-workshop__media { position: relative; }
.mfk-workshop__media img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 12px;
	display: block;
}
.mfk-workshop__date {
	position: absolute;
	top: 12px;
	left: 12px;
	background: var(--wp--preset--color--ink);
	color: #fff;
	padding: 6px 10px;
	border-radius: 9999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
}
.mfk-workshop__spots {
	position: absolute;
	top: 12px;
	right: 12px;
	background: var(--wp--preset--color--accent);
	color: #fff;
	padding: 6px 10px;
	border-radius: 9999px;
	font-size: 11px;
	font-weight: 700;
}
.mfk-workshop__spots.is-full { background: #737373; }
.mfk-workshop__body { margin-top: 16px; }
.mfk-workshop__title {
	margin: 8px 0;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.015em;
	color: var(--wp--preset--color--ink);
}
.mfk-workshop__lede {
	margin: 0;
	font-size: 13px;
	color: #6b7280;
	line-height: 1.55;
}

/* "Binnenkort meer workshops" filler card (shown when real workshops < 3) */
.mfk-workshop--soon { display: block; min-width: 0; height: 100%; }
.mfk-workshop__soon {
	box-sizing: border-box;
	width: 100%;
	min-height: 100%;
	border-radius: 12px;
	background: rgba(0, 0, 0, 0.02);
	border: 1px dashed var(--wp--preset--color--card-border);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 24px;
	transition: border-color 150ms ease, transform 150ms ease;
}
.mfk-workshop--soon:hover .mfk-workshop__soon {
	border-color: var(--wp--preset--color--accent);
	transform: translateY(-2px);
}
.mfk-workshop__soon-glyph {
	display: block;
	font-size: 36px;
	color: var(--wp--preset--color--accent);
	margin-bottom: 12px;
	line-height: 1;
}
.mfk-workshop__soon-title {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 700;
	color: var(--wp--preset--color--ink);
	letter-spacing: -0.01em;
}
.mfk-workshop__soon-link {
	font-size: 13px;
	font-weight: 700;
	color: var(--wp--preset--color--accent-dark);
	letter-spacing: 0.02em;
}

.mfk-workshops__chips {
	list-style: none;
	margin: 24px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.mfk-chip {
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	border-radius: 9999px;
	background: #fff;
	border: 1px solid #e5e5e0;
	font-size: 12px;
	color: var(--wp--preset--color--text-muted);
	font-weight: 500;
}

/* ─── Shop (4 product cards) ──────────────────────────────────────── */

.mfk-shop { padding: 68px 0; }
.mfk-shop__inner { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
.mfk-shop__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}

.mfk-product { display: block; text-decoration: none; color: inherit; }
.mfk-product__media {
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
}
.mfk-product__media img {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	display: block;
}
.mfk-product__row {
	margin-top: 12px;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
}
.mfk-product__name { font-size: 14px; font-weight: 600; color: var(--wp--preset--color--ink); }
.mfk-product__price {
	font-size: 13px;
	font-weight: 600;
	color: var(--wp--preset--color--text-muted);
	font-variant-numeric: tabular-nums;
}
.mfk-product__caption { margin-top: 4px; font-size: 11px; color: var(--wp--preset--color--text-faint); }

/* Sub-row: atelier "op bestelling" featured products */
.mfk-shop__atelier-divider {
	margin: 56px 0 0;
	border-top: 2px dashed var(--wp--preset--color--accent);
	position: relative;
	height: 0;
}
.mfk-shop__op-bestelling {
	position: absolute;
	top: -12px;
	left: 0;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding-right: 14px;
	background: var(--wp--preset--color--cream);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent-dark);
}
.mfk-shop__op-bestelling .mfk-recycle-svg {
	display: inline-block;
	color: var(--wp--preset--color--accent);
}
.mfk-shop__atelier-head {
	margin: 24px 0 24px;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 24px;
	flex-wrap: wrap;
}
.mfk-shop__atelier-head .mfk-link-accent {
	margin-left: auto;
}
.mfk-shop__atelier-line {
	margin: 0;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--wp--preset--color--ink);
	letter-spacing: -0.01em;
}
.mfk-shop__atelier-h3 {
	margin: 0;
	font-size: clamp(24px, 3vw, 36px);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--ink);
	text-wrap: balance;
}
.mfk-shop__atelier-link {
	color: var(--wp--preset--color--accent-dark);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}
.mfk-shop__atelier-link:hover { color: var(--wp--preset--color--accent); }
.mfk-shop__grid--atelier { margin-top: 0; }

/* "Binnenkort meer producten" filler card (shown when featured products < 4) */
.mfk-product--soon { display: block; }
.mfk-product__soon {
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 12px;
	background: rgba(0, 0, 0, 0.02);
	border: 1px dashed var(--wp--preset--color--card-border);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 20px;
	transition: border-color 150ms ease, transform 150ms ease;
}
.mfk-product--soon:hover .mfk-product__soon {
	border-color: var(--wp--preset--color--accent);
	transform: translateY(-2px);
}
.mfk-product__soon-glyph {
	display: block;
	font-size: 32px;
	color: var(--wp--preset--color--accent);
	margin-bottom: 10px;
	line-height: 1;
}
.mfk-product__soon-title {
	margin: 0 0 6px;
	font-size: 15px;
	font-weight: 700;
	color: var(--wp--preset--color--ink);
	letter-spacing: -0.01em;
}
.mfk-product__soon-link {
	font-size: 12px;
	font-weight: 700;
	color: var(--wp--preset--color--accent-dark);
	letter-spacing: 0.02em;
}

/* ─── Projects (bento gallery) ─────────────────────────────────────── */

.mfk-projects { padding: 68px 0; }
.mfk-projects__inner { max-width: 1280px; margin: 0 auto; padding: 0 32px; }

.mfk-bento {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	grid-auto-rows: 152px;
	grid-auto-flow: dense;
	gap: 14px;
}
.mfk-bento__tile {
	position: relative;
	border-radius: 12px;
	overflow: hidden;
	text-decoration: none;
	color: var(--wp--preset--color--ink);
}
.mfk-bento__fill { position: absolute; inset: 0; }
.mfk-bento__fill img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mfk-bento__overlay {
	position: absolute;
	inset: 0;
	padding: 16px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	pointer-events: none;
}
.mfk-bento__tag {
	align-self: flex-start;
	background: var(--wp--preset--color--ink);
	color: #fff;
	padding: 4px 10px;
	border-radius: 9999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
}
.mfk-bento__label {
	background: rgba(255, 255, 255, 0.92);
	color: var(--wp--preset--color--ink);
	padding: 8px 12px;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	align-self: flex-start;
	max-width: 90%;
}

/* ─── Newsletter + Contact ────────────────────────────────────────── */

.mfk-news {
	padding: 120px 0;
	position: relative;
	overflow: hidden;
}
.mfk-news__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 32px;
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 56px;
	position: relative;
	z-index: 1;
}
.mfk-news__h2 {
	margin: 16px 0 0;
	font-size: clamp(44px, 5.5vw, 72px);
	font-weight: 800;
	line-height: 0.98;
	letter-spacing: -0.035em;
	color: var(--wp--preset--color--paper);
	text-wrap: balance;
}
.mfk-news__h2-em { color: var(--wp--preset--color--accent); }
.mfk-news__body {
	margin: 20px 0 28px;
	max-width: 480px;
	font-size: 17px;
	line-height: 1.55;
	color: #a3a3a3;
}
.mfk-news__form {
	display: flex;
	max-width: 480px;
	border-bottom: 2px solid var(--wp--preset--color--accent);
}
.mfk-news__input {
	flex: 1;
	padding: 16px 0;
	background: transparent;
	border: 0;
	font-size: 16px;
	font-family: inherit;
	color: var(--wp--preset--color--paper);
	outline: none;
}
.mfk-news__input::placeholder { color: #737373; }
.mfk-news__submit {
	padding: 16px 0;
	background: transparent;
	color: var(--wp--preset--color--accent);
	border: 0;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	font-family: inherit;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.mfk-news__stat { margin-top: 16px; color: #525252; }

.mfk-news__col--contact {
	background: #1f1f1f;
	border-radius: 20px;
	padding: 32px;
	position: relative;
	overflow: hidden;
}
.mfk-news__address {
	margin: 14px 0 4px;
	font-size: 32px;
	font-weight: 800;
	letter-spacing: -0.025em;
	color: var(--wp--preset--color--paper);
}
.mfk-news__city { font-size: 14px; color: #a3a3a3; }
.mfk-news__details {
	list-style: none;
	margin: 24px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
	font-size: 14px;
	color: #d4d4d4;
}
.mfk-news__details a { color: inherit; text-decoration: none; }
.mfk-news__details a:hover { text-decoration: underline; }
.mfk-news__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	margin-right: 8px;
	color: var(--wp--preset--color--accent);
}
.mfk-news__flourish {
	position: absolute;
	right: -40px;
	bottom: -40px;
	width: 180px;
	height: 180px;
	opacity: 0.18;
	color: var(--wp--preset--color--accent);
	pointer-events: none;
}
.mfk-news__flourish svg { width: 100%; height: 100%; display: block; }

/* ─── Responsive ─────────────────────────────────────────────────── */

@media (max-width: 900px) {
	.mfk-hero__inner { padding: 48px 20px 24px; }
	.mfk-recycle-mark { width: 180px; height: 180px; opacity: 0.6; }
	.mfk-hero__bottom-row { grid-template-columns: 1fr; gap: 32px; align-items: start; }
	.mfk-hero__cta-cluster { align-items: flex-start; }
	.mfk-hero__scroll-hint { text-align: left; }

	.mfk-pijlers { padding: 64px 0; }
	.mfk-pijlers__inner { padding: 0 20px; }
	.mfk-pijlers__head { flex-direction: column; align-items: flex-start; }
	.mfk-pijlers__aside { text-align: left; max-width: none; }
	.mfk-pijlers__grid { grid-template-columns: 1fr; }
	.mfk-pillar, .mfk-pillar--big { min-height: 0; }

	.mfk-manifest { padding: 80px 0; }
	.mfk-manifest__inner { padding: 0 20px; }
	.mfk-manifest__flourish { width: 320px; height: 320px; right: -80px; bottom: -80px; }

	.mfk-founders { padding: 80px 0; }
	.mfk-founders__inner { grid-template-columns: 1fr; gap: 40px; padding: 0 20px; }
	.mfk-founders__col--left { position: static; }
	.mfk-founders__cards { grid-template-columns: 1fr 1fr; }
	.mfk-founder--up, .mfk-founder--down { transform: none; }

	.mfk-atelier { padding: 64px 0; }
	.mfk-atelier__inner { grid-template-columns: 1fr; gap: 40px; padding: 0 20px; }
	.mfk-atelier__features { grid-template-columns: 1fr; }

	.mfk-workshops { padding: 64px 0; }
	.mfk-workshops__inner { padding: 0 20px; }
	.mfk-workshops__grid { grid-template-columns: 1fr; }

	.mfk-shop { padding: 64px 0; }
	.mfk-shop__inner { padding: 0 20px; }
	.mfk-shop__grid { grid-template-columns: 1fr 1fr; }

	.mfk-projects { padding: 64px 0; }
	.mfk-projects__inner { padding: 0 20px; }
	.mfk-bento { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; }
	.mfk-bento__tile { grid-column: span 1 !important; grid-row: span 1 !important; }

	.mfk-news { padding: 80px 0; }
	.mfk-news__inner { grid-template-columns: 1fr; gap: 32px; padding: 0 20px; }
	.mfk-section-head { flex-direction: column; align-items: flex-start; }
	.mfk-section-head__aside { text-align: left; max-width: none; }
}

/* ─── v2 polish: kill the inter-section block-gap ─────────────────────
 * The block-theme main flow layout adds a margin-block-start equal to
 * --wp--style--block-gap on every direct child, creating a visible paper-
 * coloured strip between sections that change background (e.g. cream→ink,
 * cream→accent). Drop it for section-level children of <main>. */
main.wp-block-group.is-layout-flow > section { margin-block-start: 0; }

/* Header: tighter padding + smaller logo for the v2 compact look. */
.mfk-header { padding-top: 8px !important; padding-bottom: 8px !important; }
.mfk-header .wp-block-site-logo img { max-width: 44px !important; height: auto; }

/* ─── Footer v2 polish ──────────────────────────────────────────────
 * Override TT5's default link colour (which inherits accent) so column
 * links read as muted white; remove the disc bullets from the lists;
 * give the Instagram lockup (icon + handle) a tight, inline-aligned look. */
footer.wp-block-template-part .wp-block-list,
footer.wp-block-template-part ul {
	list-style: none;
	padding-left: 0;
	margin: 0;
}
footer.wp-block-template-part .wp-block-list li,
footer.wp-block-template-part ul li {
	margin: 0 0 9px;
}
footer.wp-block-template-part .wp-block-list a,
footer.wp-block-template-part ul a {
	color: #d4d4d4;
	text-decoration: none;
}
footer.wp-block-template-part .wp-block-list a:hover,
footer.wp-block-template-part ul a:hover {
	color: var(--wp--preset--color--paper);
	text-decoration: underline;
}

.mfk-ig {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin-top: 18px;
	color: #d4d4d4;
	font-size: 13px;
	text-decoration: none;
}
.mfk-ig:hover { color: var(--wp--preset--color--paper); }
.mfk-ig__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 7px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	color: #ffffff;
}

/* Hide the wordmark tagline in the header on small viewports — keeps the
 * brand block compact when horizontal space is tight. */
@media (max-width: 700px) {
	.mfk-header .wp-block-site-tagline { display: none; }
}