/* =====================================================================
 * KlickKiste v3.0.0 — main.css
 * KOMPLETT NEU cinematic 3D rewrite.
 *
 * 1. Tokens & resets
 * 2. Typography
 * 3. Layout primitives
 * 4. Scroll progress + glass header + mobile drawer + search overlay
 * 5. Cinematic hero (split-letter rotateX entrance + mouse parallax + sparkles)
 * 6. Section reveals (clip-path inset wipe)
 * 7. Cover story
 * 8. Trending tag pills
 * 9. Editor strip + popular grid
 * 10. Author strip
 * 11. Trust strip
 * 12. 4-up category grid with gradient numerals
 * 13. Newsletter stage + confetti burst
 * 14. Testimonials
 * 15. Pinterest embed
 * 16. Sister network
 * 17. Versprechen
 * 18. FAQ
 * 19. Anchor pitch
 * 20. Cards / pin-cards
 * 21. Single article reading view
 * 22. Squiggle dividers
 * 23. Footer
 * 24. News bar + mobile pin
 * 25. WP block / form / a11y
 * 26. Reduced motion
 * 27. Responsive breakpoints
 * ===================================================================== */

/* =========================== 1. Tokens & reset =========================== */
:root {
	--kk-accent: #8b5cf6;
	--kk-accent-dark: #6d28d9;
	--kk-deep: #1a0a3e;
	--kk-cream: #faf5ff;
	--kk-highlight: #ffd24a;

	--kk-ink: #1a0a3e;
	--kk-ink-soft: rgba(26, 10, 62, .68);
	--kk-ink-mute: rgba(26, 10, 62, .48);

	--kk-paper: #faf5ff;
	--kk-paper-2: #f3e8ff;
	--kk-paper-3: #ede9fe;
	--kk-line: rgba(139, 92, 246, .16);
	--kk-line-strong: rgba(139, 92, 246, .32);

	--kk-shadow-sm: 0 4px 14px rgba(45, 16, 96, .08);
	--kk-shadow-md: 0 16px 44px rgba(45, 16, 96, .12);
	--kk-shadow-lg: 0 32px 80px rgba(45, 16, 96, .18);
	--kk-shadow-deep: 0 48px 120px rgba(45, 16, 96, .22);

	--kk-serif: "Playfair Display", "DM Serif Display", Georgia, "Times New Roman", serif;
	--kk-sans: "Inter", "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--kk-script: "Caveat", "Brush Script MT", cursive;

	--kk-radius-sm: 10px;
	--kk-radius-md: 18px;
	--kk-radius-lg: 28px;
	--kk-radius-pill: 999px;

	--kk-shell-x: clamp(20px, 5vw, 64px);
	--kk-shell-max: 1280px;
	--kk-narrow-max: 720px;

	--kk-ease: cubic-bezier(.16, 1, .3, 1);
	--kk-ease-soft: cubic-bezier(.4, 0, .2, 1);

	--kk-mx: 0;
	--kk-my: 0;
	--kk-scroll: 0;
}

* { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

body {
	margin: 0;
	background: var(--kk-paper);
	color: var(--kk-ink);
	font-family: var(--kk-sans);
	font-size: 17px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: clip;
	background-image:
		radial-gradient(1100px 700px at 80% -8%, rgba(139, 92, 246, .12), transparent 60%),
		radial-gradient(900px 600px at -10% 18%, rgba(255, 210, 74, .08), transparent 60%);
	background-attachment: fixed;
}

a {
	color: var(--kk-accent-dark);
	text-decoration: none;
	transition: color .25s var(--kk-ease);
}
a:hover, a:focus-visible { color: var(--kk-accent); }
a:focus-visible {
	outline: 2px solid var(--kk-accent);
	outline-offset: 3px;
	border-radius: 4px;
}

img { max-width: 100%; height: auto; display: block; }

button, input, select, textarea {
	font: inherit;
	color: inherit;
}

button { cursor: pointer; }

::selection { background: rgba(139, 92, 246, .28); color: var(--kk-deep); }

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px; width: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	word-wrap: normal !important;
}

.skip-link {
	background: var(--kk-deep);
	color: #fff;
	left: 50%;
	padding: 12px 20px;
	position: absolute;
	top: -200px;
	transform: translateX(-50%);
	transition: top .2s var(--kk-ease);
	z-index: 9999;
	border-radius: 0 0 var(--kk-radius-sm) var(--kk-radius-sm);
}
.skip-link:focus { top: 0; color: #fff; }

/* =========================== 2. Typography =========================== */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--kk-serif);
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1.08;
	margin: 0 0 .6em;
	color: var(--kk-deep);
}
h1 { font-size: clamp(2.4rem, 6vw, 4.6rem); }
h2 { font-size: clamp(2rem, 4.4vw, 3.2rem); }
h3 { font-size: clamp(1.4rem, 2.6vw, 1.8rem); }
h4 { font-size: 1.15rem; }
p { margin: 0 0 1.1em; }

.kk-eyebrow,
.kk-section-kicker {
	font-family: var(--kk-sans);
	font-size: .76rem;
	font-weight: 700;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--kk-accent-dark);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 14px;
}
.kk-eyebrow::before {
	content: "";
	display: inline-block;
	width: 28px;
	height: 2px;
	background: var(--kk-accent);
	border-radius: 2px;
}

.kk-script {
	font-family: var(--kk-script);
	font-weight: 700;
	font-size: clamp(1.6rem, 3vw, 2.4rem);
	color: var(--kk-accent);
	display: block;
	line-height: 1;
}

.kk-section-head {
	max-width: 760px;
	margin: 0 auto 48px;
	text-align: center;
}
.kk-section-head h2 { margin: 0 0 .5em; }
.kk-section-head p { color: var(--kk-ink-soft); font-size: 1.06rem; }

/* =========================== 3. Layout =========================== */
.kk-main {
	display: block;
	min-height: 60vh;
	padding-top: 88px;
}
.kk-home-active .kk-main { padding-top: 0; }
.kk-home-wrap { display: block; }

.kk-shell {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	padding: 0 var(--kk-shell-x);
}

.kk-scene {
	position: relative;
	padding: clamp(64px, 9vw, 120px) var(--kk-shell-x);
	max-width: 100%;
}
.kk-scene > * { position: relative; z-index: 1; }
.kk-scene .layer { position: absolute; inset: 0; pointer-events: none; }
.kk-scene .layer.depth-4 {
	position: relative;
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	z-index: 5;
	pointer-events: auto;
}
.kk-blob {
	position: absolute;
	width: 360px; height: 360px;
	border-radius: 50%;
	filter: blur(80px);
	opacity: .42;
	pointer-events: none;
}
.kk-blob-a { background: radial-gradient(circle, var(--kk-accent) 0%, transparent 70%); top: -10%; left: -10%; }
.kk-blob-c { background: radial-gradient(circle, var(--kk-highlight) 0%, transparent 70%); bottom: -10%; right: -10%; opacity: .3; }
.kk-blob-pink { background: radial-gradient(circle, #c084fc 0%, transparent 70%); }

/* =========================== 4. Header / Drawer / Search — v3.2 rebuild =========================== */
.kk-progress {
	position: fixed;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: rgba(139, 92, 246, .08);
	z-index: 1001;
	pointer-events: none;
}
.kk-progress-fill {
	display: block;
	height: 100%;
	width: 0%;
	background: linear-gradient(90deg, var(--kk-accent) 0%, var(--kk-accent-dark) 55%, var(--kk-highlight) 100%);
	box-shadow: 0 1px 8px rgba(139, 92, 246, .5);
	transition: width .12s linear;
}

.kk-site-header {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: 1000;
	background: rgba(250, 245, 255, .72);
	-webkit-backdrop-filter: blur(20px) saturate(1.5);
	backdrop-filter: blur(20px) saturate(1.5);
	border-bottom: 1px solid transparent;
	transition: transform .35s var(--kk-ease), background .25s var(--kk-ease), border-color .25s var(--kk-ease), box-shadow .25s var(--kk-ease);
	will-change: transform;
}
.kk-site-header.is-scrolled {
	background: rgba(250, 245, 255, .92);
	border-bottom-color: var(--kk-line);
	box-shadow: 0 8px 30px rgba(45, 16, 96, .08);
}
.kk-site-header.is-hidden { transform: translateY(-110%); }

.kk-header-shell {
	display: flex;
	align-items: center;
	gap: clamp(12px, 2vw, 28px);
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	padding: 14px var(--kk-shell-x);
	transition: padding .25s var(--kk-ease);
}
.kk-site-header.is-scrolled .kk-header-shell { padding-top: 9px; padding-bottom: 9px; }

.kk-brand {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: var(--kk-deep);
	font-family: var(--kk-serif);
	font-weight: 800;
	font-size: 1.45rem;
	letter-spacing: -.015em;
	flex-shrink: 0;
	transition: transform .35s var(--kk-ease), color .25s var(--kk-ease);
}
.kk-brand:hover { color: var(--kk-accent-dark); transform: translateY(-1px); }
.kk-brand-img { max-height: 42px; width: auto; display: block; }
.kk-site-header.is-scrolled .kk-brand-img { max-height: 34px; }
.kk-brand-glyph {
	display: inline-grid;
	place-items: center;
	width: 44px; height: 44px;
	border-radius: 14px;
	background: linear-gradient(135deg, var(--kk-accent) 0%, var(--kk-accent-dark) 100%);
	color: #fff;
	font-weight: 900;
	font-size: 1.3rem;
	letter-spacing: 0;
	box-shadow: 0 8px 22px rgba(139, 92, 246, .35), inset 0 1px 0 rgba(255, 255, 255, .25);
	transition: transform .35s var(--kk-ease), box-shadow .35s var(--kk-ease), width .25s var(--kk-ease), height .25s var(--kk-ease);
}
.kk-brand:hover .kk-brand-glyph {
	transform: rotate(-6deg) scale(1.05);
	box-shadow: 0 12px 30px rgba(139, 92, 246, .5), inset 0 1px 0 rgba(255, 255, 255, .35);
}
.kk-site-header.is-scrolled .kk-brand-glyph {
	width: 38px; height: 38px;
	border-radius: 12px;
	font-size: 1.1rem;
}
.kk-brand-name { font-size: clamp(1.15rem, 1.6vw, 1.4rem); white-space: nowrap; }
.kk-site-header.is-scrolled .kk-brand-name { font-size: 1.05rem; }

.kk-nav {
	display: flex;
	justify-content: center;
	flex: 1 1 auto;
	min-width: 0;
}
.kk-nav-list {
	list-style: none;
	display: flex;
	align-items: center;
	gap: 2px;
	margin: 0;
	padding: 0;
	flex-wrap: nowrap !important;
	white-space: nowrap;
}
.kk-nav-list li {
	position: relative;
	flex: 0 0 auto;
	white-space: nowrap;
}
.kk-nav-list a,
.kk-nav-list a span,
.kk-nav-list li a {
	white-space: nowrap !important;
	text-wrap: nowrap !important;
	word-break: keep-all !important;
}
.kk-nav-list a {
	display: inline-flex;
	align-items: center;
	padding: 10px clamp(9px, 1.2vw, 16px);
	color: var(--kk-deep);
	font-weight: 500;
	font-size: clamp(.82rem, .95vw, .94rem);
	line-height: 1.2;
	border-radius: var(--kk-radius-pill);
	position: relative;
	transition: color .2s var(--kk-ease), background .2s var(--kk-ease);
}
.kk-nav-list a::after {
	content: "";
	position: absolute;
	left: 50%; bottom: 4px;
	transform: translateX(-50%) scaleX(0);
	transform-origin: center;
	height: 2px; width: 22px;
	background: linear-gradient(90deg, var(--kk-accent), var(--kk-accent-dark));
	border-radius: 2px;
	transition: transform .3s var(--kk-ease);
}
.kk-nav-list a:hover::after,
.kk-nav-list a[aria-current="page"]::after { transform: translateX(-50%) scaleX(1); }
.kk-nav-list a:hover { color: var(--kk-accent-dark); background: rgba(139, 92, 246, .06); }

.kk-header-tools {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}
.kk-tool-btn {
	display: inline-grid;
	place-items: center;
	width: 42px; height: 42px;
	background: transparent;
	border: 1px solid var(--kk-line);
	border-radius: 50%;
	color: var(--kk-deep);
	cursor: pointer;
	transition: background .2s var(--kk-ease), border-color .2s var(--kk-ease), transform .2s var(--kk-ease), color .2s var(--kk-ease);
}
.kk-tool-btn:hover {
	background: rgba(139, 92, 246, .1);
	border-color: var(--kk-line-strong);
	color: var(--kk-accent-dark);
	transform: translateY(-1px);
}
.kk-tool-btn:active { transform: translateY(0); }

.kk-header-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 22px;
	background: linear-gradient(135deg, var(--kk-accent) 0%, var(--kk-accent-dark) 100%);
	color: #fff;
	font-weight: 600;
	font-size: .92rem;
	border-radius: var(--kk-radius-pill);
	box-shadow: 0 8px 24px rgba(139, 92, 246, .35), inset 0 1px 0 rgba(255, 255, 255, .25);
	transition: transform .25s var(--kk-ease), box-shadow .25s var(--kk-ease);
	white-space: nowrap;
}
.kk-header-cta:hover {
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 14px 36px rgba(139, 92, 246, .5), inset 0 1px 0 rgba(255, 255, 255, .35);
}
.kk-header-cta:active { transform: translateY(0); }

.kk-burger {
	display: none;
	width: 42px; height: 42px;
	background: transparent;
	border: 1px solid var(--kk-line);
	border-radius: 50%;
	position: relative;
	cursor: pointer;
	transition: background .2s var(--kk-ease), border-color .2s var(--kk-ease);
}
.kk-burger:hover { background: rgba(139, 92, 246, .08); border-color: var(--kk-line-strong); }
.kk-burger span {
	position: absolute;
	left: 12px; right: 12px;
	height: 2px;
	background: var(--kk-deep);
	border-radius: 2px;
	transition: transform .3s var(--kk-ease), opacity .25s var(--kk-ease);
}
.kk-burger span:nth-child(1) { top: 14px; }
.kk-burger span:nth-child(2) { top: 20px; }
.kk-burger span:nth-child(3) { top: 26px; }
.kk-burger.is-open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.kk-burger.is-open span:nth-child(2) { opacity: 0; }
.kk-burger.is-open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Breakpoints — 7-item nav doesn't fit below 1100px */
@media (max-width: 1100px) {
	.kk-nav { display: none; }
	.kk-burger { display: inline-block; }
}
@media (max-width: 720px) {
	.kk-header-shell { padding: 12px var(--kk-shell-x); gap: 10px; }
	.kk-header-cta span { display: none; }
	.kk-header-cta { padding: 0; width: 42px; height: 42px; justify-content: center; gap: 0; }
	.kk-brand-name { display: none; }
	.kk-brand-glyph { width: 40px; height: 40px; font-size: 1.2rem; border-radius: 12px; }
}
@media (max-width: 480px) {
	.kk-header-tools { gap: 6px; }
	.kk-tool-btn, .kk-burger, .kk-header-cta { width: 40px; height: 40px; }
	.kk-tool-btn svg { width: 18px; height: 18px; }
}

.kk-mobile-drawer {
	position: fixed;
	top: 0; right: 0;
	width: min(380px, 92vw);
	height: 100dvh;
	background: linear-gradient(180deg, var(--kk-paper) 0%, var(--kk-paper-2) 100%);
	border-left: 1px solid var(--kk-line);
	box-shadow: -32px 0 60px rgba(45, 16, 96, .25);
	transform: translateX(100%);
	transition: transform .45s var(--kk-ease);
	z-index: 1100;
	display: flex;
	flex-direction: column;
	padding: 22px 22px max(22px, env(safe-area-inset-bottom)) 22px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
}
.kk-mobile-drawer.is-open { transform: translateX(0); }
.kk-drawer-head {
	display: flex; align-items: center; justify-content: space-between;
	margin-bottom: 24px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--kk-line);
}
.kk-drawer-brand {
	font-family: var(--kk-serif);
	font-weight: 800;
	font-size: 1.5rem;
	color: var(--kk-deep);
	letter-spacing: -.01em;
}
.kk-drawer-close {
	width: 42px; height: 42px;
	background: transparent;
	border: 1px solid var(--kk-line);
	border-radius: 50%;
	display: inline-grid; place-items: center;
	color: var(--kk-deep);
	cursor: pointer;
	transition: background .2s var(--kk-ease), border-color .2s var(--kk-ease), transform .2s var(--kk-ease);
}
.kk-drawer-close:hover { background: rgba(139, 92, 246, .08); border-color: var(--kk-line-strong); transform: rotate(90deg); }
.kk-drawer-list {
	list-style: none;
	padding: 0; margin: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.kk-drawer-list li {
	opacity: 0;
	transform: translateX(20px);
	transition: opacity .35s var(--kk-ease), transform .35s var(--kk-ease);
	transition-delay: calc(var(--kk-i, 0) * 50ms);
}
.kk-mobile-drawer.is-open .kk-drawer-list li {
	opacity: 1;
	transform: translateX(0);
}
.kk-drawer-list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 16px;
	min-height: 56px;
	font-family: var(--kk-serif);
	font-size: 1.35rem;
	font-weight: 600;
	color: var(--kk-deep);
	border-radius: var(--kk-radius-md);
	transition: background .2s var(--kk-ease), color .2s var(--kk-ease), padding-left .25s var(--kk-ease);
}
.kk-drawer-list a::after {
	content: "→";
	font-family: var(--kk-sans);
	font-size: 1rem;
	color: var(--kk-accent);
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity .25s var(--kk-ease), transform .25s var(--kk-ease);
}
.kk-drawer-list a:hover,
.kk-drawer-list a:focus {
	background: rgba(255, 255, 255, .6);
	color: var(--kk-accent-dark);
	padding-left: 24px;
}
.kk-drawer-list a:hover::after,
.kk-drawer-list a:focus::after { opacity: 1; transform: translateX(0); }
.kk-drawer-list a[aria-current="page"] { background: rgba(139, 92, 246, .08); color: var(--kk-accent-dark); }
.kk-drawer-foot {
	margin-top: auto;
	padding-top: 22px;
	border-top: 1px solid var(--kk-line);
}
.kk-drawer-cta {
	display: block;
	text-align: center;
	padding: 16px 20px;
	min-height: 52px;
	background: linear-gradient(135deg, var(--kk-accent) 0%, var(--kk-accent-dark) 100%);
	color: #fff;
	border-radius: var(--kk-radius-pill);
	font-weight: 700;
	font-size: 1rem;
	box-shadow: 0 10px 28px rgba(139, 92, 246, .4), inset 0 1px 0 rgba(255, 255, 255, .25);
	transition: transform .25s var(--kk-ease), box-shadow .25s var(--kk-ease);
}
.kk-drawer-cta:hover {
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 14px 36px rgba(139, 92, 246, .55), inset 0 1px 0 rgba(255, 255, 255, .35);
}

.kk-drawer-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(26, 10, 62, .55);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	opacity: 0;
	pointer-events: none;
	transition: opacity .35s var(--kk-ease);
	z-index: 1050;
}
.kk-drawer-backdrop.is-visible { opacity: 1; pointer-events: auto; }

.kk-search-overlay {
	position: fixed;
	inset: 0;
	background: rgba(26, 10, 62, .92);
	-webkit-backdrop-filter: blur(18px);
	backdrop-filter: blur(18px);
	opacity: 0;
	pointer-events: none;
	transition: opacity .35s var(--kk-ease);
	z-index: 1200;
	display: grid;
	place-items: center;
	padding: var(--kk-shell-x);
}
.kk-search-overlay.is-open { opacity: 1; pointer-events: auto; }
.kk-search-close {
	position: absolute;
	top: 24px; right: 24px;
	width: 44px; height: 44px;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .15);
	border-radius: 50%;
	color: #fff;
}
.kk-search-shell {
	max-width: 640px;
	width: 100%;
	color: #fff;
	transform: translateY(20px);
	transition: transform .45s var(--kk-ease);
}
.kk-search-overlay.is-open .kk-search-shell { transform: translateY(0); }
.kk-search-shell .kk-eyebrow { color: var(--kk-highlight); }
.kk-search-shell .kk-eyebrow::before { background: var(--kk-highlight); }
.kk-search-shell .search-form { display: flex; gap: 10px; margin: 12px 0 20px; }
.kk-search-shell .search-field {
	flex: 1;
	background: transparent;
	border: none;
	border-bottom: 2px solid rgba(255, 255, 255, .35);
	color: #fff;
	font-family: var(--kk-serif);
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	padding: 12px 0;
	outline: none;
	transition: border-color .25s var(--kk-ease);
}
.kk-search-shell .search-field:focus { border-bottom-color: var(--kk-highlight); }
.kk-search-shell .search-field::placeholder { color: rgba(255, 255, 255, .4); }
.kk-search-shell .search-submit {
	padding: 12px 22px;
	background: var(--kk-highlight);
	color: var(--kk-deep);
	border: none;
	border-radius: var(--kk-radius-pill);
	font-weight: 700;
}
.kk-search-hint { color: rgba(255, 255, 255, .6); font-size: .92rem; }
.kk-kbd {
	display: inline-block;
	padding: 2px 8px;
	background: rgba(255, 255, 255, .12);
	border: 1px solid rgba(255, 255, 255, .2);
	border-radius: 6px;
	font-family: ui-monospace, SFMono-Regular, monospace;
	font-size: .82rem;
}

/* =========================== 5. Hero =========================== */
.kk-hero {
	position: relative;
	min-height: 100vh;
	min-height: 100dvh;
	display: grid;
	place-items: center;
	overflow: hidden;
	padding: 140px var(--kk-shell-x) 80px;
	background:
		radial-gradient(900px 600px at calc(50% + var(--kk-mx) * 60px) calc(30% + var(--kk-my) * 30px), rgba(139, 92, 246, .22), transparent 60%),
		radial-gradient(700px 500px at calc(85% - var(--kk-mx) * 40px) calc(85% + var(--kk-my) * 20px), rgba(255, 210, 74, .14), transparent 60%),
		radial-gradient(800px 500px at calc(8% + var(--kk-mx) * 30px) 70%, rgba(192, 132, 252, .14), transparent 60%),
		var(--kk-cream);
}
.kk-hero-bg {
	position: absolute; inset: -10%;
	background-size: cover;
	background-position: center;
	opacity: .14;
	mix-blend-mode: multiply;
	z-index: 0;
	will-change: transform;
}
.kk-hero-inner {
	position: relative;
	z-index: 2;
	max-width: 1100px;
	text-align: center;
	transform: translate3d(calc(var(--kk-mx) * -8px), calc(var(--kk-my) * -6px), 0);
	transition: transform .4s var(--kk-ease);
}
.kk-hero-eyebrow {
	font-family: var(--kk-script);
	font-size: clamp(1.4rem, 2.4vw, 1.9rem);
	color: var(--kk-accent-dark);
	display: inline-block;
	margin-bottom: 18px;
	opacity: 0;
	transform: translateY(14px);
	animation: kkFadeUp .9s var(--kk-ease) .15s forwards;
}
.kk-hero-title {
	font-family: var(--kk-serif);
	font-weight: 900;
	font-size: clamp(2.8rem, 8.2vw, 7.2rem);
	line-height: .98;
	letter-spacing: -.035em;
	color: var(--kk-deep);
	margin: 0 0 24px;
	perspective: 800px;
}
.kk-hero-title .kk-word {
	display: inline-block;
	opacity: 0;
	transform-origin: 50% 100%;
	transform: translateY(40px) rotateX(45deg);
	transition: opacity .6s var(--kk-ease), transform .8s var(--kk-ease);
	transition-delay: calc(var(--kk-word-i, 0) * 60ms + 200ms);
}
.kk-hero-title.is-revealed .kk-word {
	opacity: 1;
	transform: translateY(0) rotateX(0);
}
.kk-underline {
	position: relative;
	display: inline-block;
	background: linear-gradient(120deg, var(--kk-accent) 0%, var(--kk-accent-dark) 50%, #c084fc 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}
.kk-underline::after {
	content: "";
	position: absolute;
	left: 0; right: 0;
	bottom: 6%;
	height: 14px;
	background: var(--kk-highlight);
	opacity: .55;
	z-index: -1;
	border-radius: 4px;
	transform: scaleX(0);
	transform-origin: left;
	animation: kkUnderline 1s var(--kk-ease) 1.4s forwards;
}
@keyframes kkUnderline { to { transform: scaleX(1); } }
.kk-hero-sub {
	max-width: 640px;
	margin: 0 auto 36px;
	font-size: clamp(1.05rem, 1.4vw, 1.22rem);
	color: var(--kk-ink-soft);
	opacity: 0;
	transform: translateY(20px);
	animation: kkFadeUp 1s var(--kk-ease) 1.2s forwards;
}
.kk-hero-ctas {
	display: inline-flex;
	gap: 12px;
	flex-wrap: wrap;
	justify-content: center;
	opacity: 0;
	transform: translateY(20px);
	animation: kkFadeUp 1s var(--kk-ease) 1.4s forwards;
}

@keyframes kkFadeUp {
	from { opacity: 0; transform: translateY(20px); }
	to { opacity: 1; transform: translateY(0); }
}

.kk-sparkle-deco {
	position: absolute;
	width: 36px; height: 36px;
	aspect-ratio: 1;
	opacity: .65;
	z-index: 1;
	animation: kkFloat 6s ease-in-out infinite;
	will-change: transform;
}
.kk-sparkle-deco svg { width: 100%; height: 100%; display: block; }
.kk-sparkle-1 { top: 14%; left: 8%; width: 42px; height: 42px; animation-delay: 0s; }
.kk-sparkle-2 { top: 22%; right: 12%; width: 56px; height: 56px; animation-delay: 1.2s; }
.kk-sparkle-3 { bottom: 24%; left: 14%; width: 30px; height: 30px; animation-delay: .6s; }
.kk-sparkle-4 { bottom: 18%; right: 10%; width: 44px; height: 44px; animation-delay: 1.8s; }
.kk-sparkle-5 { top: 50%; left: 4%; width: 28px; height: 28px; animation-delay: .9s; opacity: .45; }
.kk-sparkle-6 { top: 60%; right: 5%; width: 34px; height: 34px; animation-delay: 2.4s; opacity: .5; }

@keyframes kkFloat {
	0%, 100% { transform: translate3d(0, 0, 0) rotate(0); }
	50% { transform: translate3d(0, -16px, 0) rotate(8deg); }
}

.kk-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 14px 28px;
	border-radius: var(--kk-radius-pill);
	font-weight: 600;
	font-size: 1rem;
	border: none;
	cursor: pointer;
	text-decoration: none;
	transition: transform .25s var(--kk-ease), box-shadow .25s var(--kk-ease), background .25s var(--kk-ease), color .25s var(--kk-ease);
	will-change: transform;
}
.kk-btn-pill, .kk-cta-primary {
	background: linear-gradient(135deg, var(--kk-accent) 0%, var(--kk-accent-dark) 100%);
	color: #fff;
	box-shadow: 0 14px 38px rgba(139, 92, 246, .42);
}
.kk-cta-primary:hover, .kk-btn-pill:hover {
	color: #fff;
	box-shadow: 0 20px 50px rgba(139, 92, 246, .56);
}
.kk-btn-ghost, .kk-cta-ghost {
	background: rgba(255, 255, 255, .7);
	color: var(--kk-deep);
	border: 1px solid var(--kk-line-strong);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	padding: 14px 28px;
}
.kk-btn-ghost:hover, .kk-cta-ghost:hover {
	background: #fff;
	color: var(--kk-accent-dark);
}
.kk-btn-light {
	background: #fff;
	color: var(--kk-deep);
	box-shadow: var(--kk-shadow-md);
}
.kk-btn-light:hover { color: var(--kk-accent-dark); }

/* =========================== 6. Reveal =========================== */
.kk-reveal {
	opacity: 0;
	clip-path: inset(4% 0 4% 0 round 4px);
	transform: translateY(36px);
	transition: opacity .9s var(--kk-ease), clip-path .9s var(--kk-ease), transform .9s var(--kk-ease);
	will-change: opacity, clip-path, transform;
}
.kk-reveal.is-revealed {
	opacity: 1;
	clip-path: inset(0 round 4px);
	transform: translateY(0);
}

/* =========================== 7. Cover story =========================== */
.kk-cover-story {
	position: relative;
	margin: clamp(40px, 7vw, 90px) auto;
	max-width: 1320px;
	min-height: 540px;
	border-radius: var(--kk-radius-lg);
	overflow: hidden;
	display: grid;
	place-items: end start;
	color: #fff;
	padding: clamp(40px, 6vw, 80px);
	background: linear-gradient(135deg, var(--kk-deep) 0%, var(--kk-accent-dark) 100%);
	box-shadow: var(--kk-shadow-deep);
	isolation: isolate;
}
.kk-cover-story h1, .kk-cover-story h2, .kk-cover-story p { color: inherit; }
.kk-cover-story-img {
	position: absolute; inset: -8%;
	background-size: cover;
	background-position: center;
	opacity: .55;
	z-index: 0;
	transform: scale(1.06);
	transition: transform 1.6s var(--kk-ease);
	will-change: transform;
}
.kk-cover-story:hover .kk-cover-story-img { transform: scale(1.12); }
.kk-cover-story-gradient {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(26, 10, 62, .15) 0%, rgba(26, 10, 62, .55) 50%, rgba(26, 10, 62, .9) 100%);
	z-index: 1;
}
.kk-cover-story-body {
	position: relative;
	z-index: 4;
	max-width: 720px;
}
.kk-cover-badge {
	display: inline-block;
	padding: 6px 14px;
	background: var(--kk-highlight);
	color: var(--kk-deep);
	border-radius: var(--kk-radius-pill);
	font-size: .82rem;
	font-weight: 700;
	letter-spacing: .04em;
	margin-bottom: 14px;
}
.kk-cover-cat {
	display: inline-block;
	padding: 4px 12px;
	margin-left: 8px;
	border: 1px solid rgba(255, 255, 255, .35);
	color: #fff;
	border-radius: var(--kk-radius-pill);
	font-size: .82rem;
}
.kk-cover-title {
	font-size: clamp(2rem, 4.6vw, 3.4rem);
	color: #fff;
	margin-bottom: 18px;
}
.kk-cover-excerpt {
	font-size: 1.1rem;
	color: rgba(255, 255, 255, .82);
	margin-bottom: 26px;
}
.kk-cover-story .kk-cta-primary { color: #fff; }

/* =========================== 8. Trending =========================== */
.kk-trending {
	padding: clamp(20px, 4vw, 36px) var(--kk-shell-x);
}
.kk-trending-inner {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	justify-content: center;
}
.kk-trending-label {
	color: var(--kk-ink-soft);
	font-weight: 600;
	margin-right: 8px;
}
.kk-pill {
	display: inline-flex;
	align-items: center;
	padding: 8px 16px;
	background: linear-gradient(135deg, var(--kk-accent) 0%, var(--kk-accent-dark) 100%);
	color: #fff;
	border-radius: var(--kk-radius-pill);
	font-weight: 500;
	font-size: .92rem;
	transition: transform .25s var(--kk-ease), box-shadow .25s var(--kk-ease);
	box-shadow: 0 6px 16px rgba(139, 92, 246, .28);
}
.kk-pill:hover { color: #fff; transform: translateY(-3px); box-shadow: 0 14px 30px rgba(139, 92, 246, .42); }
.kk-pill-ghost {
	background: rgba(255, 255, 255, .85);
	color: var(--kk-accent-dark);
	border: 1px solid var(--kk-line-strong);
	box-shadow: var(--kk-shadow-sm);
}
.kk-pill-ghost:hover { color: var(--kk-accent-dark); background: #fff; }

/* =========================== 9. Editor strip & popular =========================== */
.kk-editor-strip,
.kk-popular {
	padding: clamp(40px, 6vw, 80px) var(--kk-shell-x);
}
.kk-editor-strip .kk-section-head,
.kk-popular .kk-section-head { text-align: center; }
.kk-editor-strip-grid,
.kk-popular-grid {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 28px;
}

/* =========================== 10. Author strip =========================== */
.kk-author-strip {
	padding: clamp(60px, 8vw, 100px) var(--kk-shell-x);
	background:
		radial-gradient(800px 400px at 20% 0%, rgba(139, 92, 246, .1), transparent 60%),
		var(--kk-paper);
}
.kk-author-strip-inner {
	max-width: 1080px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: 56px;
	align-items: center;
}
.kk-author-strip-photo {
	position: relative;
	aspect-ratio: 1;
	border-radius: 50%;
	overflow: hidden;
	box-shadow: var(--kk-shadow-lg);
}
.kk-author-strip-photo::before {
	content: "";
	position: absolute;
	inset: -8px;
	background: conic-gradient(from 0deg, var(--kk-accent), var(--kk-highlight), var(--kk-accent-dark), var(--kk-accent));
	border-radius: 50%;
	z-index: -1;
	animation: kkSpin 16s linear infinite;
}
.kk-author-strip-photo img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
@keyframes kkSpin { to { transform: rotate(360deg); } }
.kk-author-strip-body .kk-script { color: var(--kk-accent); margin-bottom: 6px; }
.kk-author-strip-body h2 { font-size: clamp(1.8rem, 3.2vw, 2.6rem); }
.kk-author-strip-body p { color: var(--kk-ink-soft); font-size: 1.06rem; max-width: 560px; }
.kk-author-strip-signature {
	font-family: var(--kk-script);
	font-size: 2rem;
	color: var(--kk-accent-dark);
}
@media (max-width: 720px) {
	.kk-author-strip-inner { grid-template-columns: 1fr; gap: 32px; text-align: center; }
	.kk-author-strip-photo { max-width: 200px; margin: 0 auto; }
}

/* =========================== 11. Trust strip =========================== */
.kk-trust-strip {
	background: var(--kk-paper-3);
	padding: clamp(40px, 5vw, 60px) var(--kk-shell-x);
}
.kk-trust-grid {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 24px;
}
.kk-trust-item {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: .96rem;
	color: var(--kk-ink);
}
.kk-trust-item-icon {
	width: 44px; height: 44px;
	display: grid; place-items: center;
	background: #fff;
	border-radius: 50%;
	box-shadow: var(--kk-shadow-sm);
	color: var(--kk-accent-dark);
	flex-shrink: 0;
}
.kk-trust-item strong { display: block; color: var(--kk-deep); }

/* =========================== 12. 4-up category grid =========================== */
.kk-cat-4up {
	padding: clamp(60px, 8vw, 100px) var(--kk-shell-x);
}
.kk-cat-4up-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 24px;
	max-width: 1320px;
	margin: 0 auto;
}
.kk-cat-tile {
	position: relative;
	border-radius: var(--kk-radius-lg);
	overflow: hidden;
	min-height: 380px;
	background: var(--kk-deep);
	transition: transform .5s var(--kk-ease), box-shadow .5s var(--kk-ease);
	box-shadow: var(--kk-shadow-md);
}
.kk-cat-tile:hover {
	transform: translateY(-10px);
	box-shadow: var(--kk-shadow-deep);
}
.kk-cat-tile-link {
	display: block;
	position: absolute;
	inset: 0;
	z-index: 2;
}
.kk-cat-tile-bg {
	position: absolute; inset: 0;
	background-size: cover; background-position: center;
	transition: transform 1s var(--kk-ease);
	z-index: 1;
}
.kk-cat-tile:hover .kk-cat-tile-bg { transform: scale(1.08); }
.kk-cat-tile-link::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(26, 10, 62, .15) 0%, rgba(26, 10, 62, .55) 50%, rgba(26, 10, 62, .92) 100%);
	z-index: 2;
}
.kk-cat-tile-head {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: 28px;
	z-index: 4;
	color: #fff;
	pointer-events: none;
}
.kk-cat-tile-num {
	display: block;
	font-family: var(--kk-serif);
	font-size: 3.4rem;
	font-weight: 900;
	line-height: 1;
	background: linear-gradient(120deg, var(--kk-highlight) 0%, #fff 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	margin-bottom: 6px;
	opacity: .9;
}
.kk-cat-tile-head h3 { color: #fff; font-size: 1.6rem; margin: 0 0 6px; }
.kk-cat-tile-meta { color: rgba(255, 255, 255, .78); font-size: .92rem; margin: 0; }
.kk-cat-tile-recent {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: 28px;
	list-style: none;
	margin: 0;
	z-index: 5;
	background: linear-gradient(180deg, rgba(26, 10, 62, 0) 0%, rgba(26, 10, 62, .92) 30%);
	color: #fff;
	opacity: 0;
	transform: translateY(20px);
	transition: opacity .4s var(--kk-ease), transform .4s var(--kk-ease);
	pointer-events: none;
}
.kk-cat-tile:hover .kk-cat-tile-recent { opacity: 1; transform: translateY(0); pointer-events: auto; }
.kk-cat-tile-recent li { margin-bottom: 8px; }
.kk-cat-tile-recent a {
	color: #fff;
	display: block;
	font-size: .92rem;
	border-bottom: 1px solid rgba(255, 255, 255, .15);
	padding-bottom: 6px;
	pointer-events: auto;
	position: relative;
	z-index: 6;
}
.kk-cat-tile-recent a:hover { color: var(--kk-highlight); }
@media (hover: none) {
	.kk-cat-tile-recent { display: none; }
}

/* =========================== 13. Newsletter =========================== */
.kk-newsletter,
.kk-newsletter-inline {
	position: relative;
	overflow: hidden;
	color: #fff;
}
.kk-newsletter-inline { padding: clamp(60px, 9vw, 120px) var(--kk-shell-x); }
.kk-newsletter-card {
	position: relative;
	max-width: 760px;
	margin: 0 auto;
	padding: clamp(40px, 6vw, 70px);
	background: linear-gradient(135deg, var(--kk-deep) 0%, var(--kk-accent-dark) 50%, var(--kk-accent) 100%);
	border-radius: var(--kk-radius-lg);
	color: #fff;
	box-shadow: var(--kk-shadow-deep);
	text-align: center;
	overflow: hidden;
	isolation: isolate;
}
.kk-newsletter-card::before {
	content: "";
	position: absolute; inset: 0;
	background:
		radial-gradient(600px 400px at 80% 10%, rgba(255, 210, 74, .25), transparent 60%),
		radial-gradient(500px 400px at 10% 100%, rgba(192, 132, 252, .35), transparent 60%);
	z-index: -1;
}
.kk-newsletter-card h2 { color: #fff; font-size: clamp(1.8rem, 3.8vw, 2.6rem); }
.kk-newsletter-card p { color: rgba(255, 255, 255, .85); }
.kk-newsletter-lead {
	display: inline-block;
	margin-top: 4px !important;
	padding: 8px 18px;
	background: rgba(255, 255, 255, .14);
	border: 1px solid rgba(255, 255, 255, .25);
	border-radius: var(--kk-radius-pill);
	font-size: .94rem;
}
.kk-card-tag {
	display: inline-flex;
	align-items: center;
	padding: 6px 14px;
	background: var(--kk-highlight);
	color: var(--kk-deep);
	border-radius: var(--kk-radius-pill);
	font-size: .82rem;
	font-weight: 700;
	margin-bottom: 16px;
}
.kk-newsletter-card .kk-card-tag { background: rgba(255, 210, 74, .92); }

.kk-nl-form,
.kk-nl-mini {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	max-width: 520px;
	margin: 24px auto 0;
	position: relative;
}
.kk-nl-form input[type="email"],
.kk-nl-mini input[type="email"] {
	flex: 1;
	min-width: 200px;
	padding: 14px 18px;
	border: 1px solid rgba(255, 255, 255, .25);
	background: rgba(255, 255, 255, .12);
	color: #fff;
	border-radius: var(--kk-radius-pill);
	outline: none;
	transition: border-color .25s var(--kk-ease), background .25s var(--kk-ease);
}
.kk-nl-form input[type="email"]::placeholder,
.kk-nl-mini input[type="email"]::placeholder { color: rgba(255, 255, 255, .55); }
.kk-nl-form input[type="email"]:focus,
.kk-nl-mini input[type="email"]:focus { background: rgba(255, 255, 255, .2); border-color: var(--kk-highlight); }
.kk-nl-form button,
.kk-nl-mini button {
	padding: 14px 24px;
	background: var(--kk-highlight);
	color: var(--kk-deep);
	border: none;
	border-radius: var(--kk-radius-pill);
	font-weight: 700;
	transition: transform .25s var(--kk-ease), box-shadow .25s var(--kk-ease);
}
.kk-nl-form button:hover,
.kk-nl-mini button:hover { box-shadow: 0 14px 30px rgba(255, 210, 74, .45); }
.kk-nl-msg {
	flex-basis: 100%;
	color: rgba(255, 255, 255, .92);
	font-size: .9rem;
	min-height: 1.2em;
	text-align: center;
}

.kk-confetti {
	position: absolute;
	pointer-events: none;
	z-index: 10;
	width: 8px; height: 14px;
	border-radius: 2px;
	opacity: 0;
}
.kk-confetti.is-firing { animation: kkConfetti 1.6s var(--kk-ease) forwards; }
@keyframes kkConfetti {
	0% { transform: translate3d(0, 0, 0) rotate(0); opacity: 1; }
	100% { transform: translate3d(var(--kk-cdx, 0), var(--kk-cdy, -200px), 0) rotate(var(--kk-cdr, 540deg)); opacity: 0; }
}

/* =========================== 14. Testimonials =========================== */
.kk-testimonials {
	padding: clamp(60px, 8vw, 100px) var(--kk-shell-x);
}
.kk-testimonials-grid {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 24px;
}
.kk-testimonial {
	padding: 32px;
	background: #fff;
	border-radius: var(--kk-radius-lg);
	box-shadow: var(--kk-shadow-md);
	border: 1px solid var(--kk-line);
	transition: transform .35s var(--kk-ease), box-shadow .35s var(--kk-ease);
	position: relative;
	overflow: hidden;
}
.kk-testimonial:hover { transform: translateY(-6px); box-shadow: var(--kk-shadow-lg); }
.kk-testimonial::before {
	content: "\201C";
	position: absolute;
	top: -40px; left: 18px;
	font-family: var(--kk-serif);
	font-size: 8rem;
	color: var(--kk-paper-3);
	line-height: 1;
}
.kk-testimonial blockquote {
	margin: 0 0 16px;
	font-size: 1.05rem;
	color: var(--kk-ink);
	font-style: italic;
	position: relative;
	z-index: 1;
}
.kk-testimonial cite {
	color: var(--kk-accent-dark);
	font-weight: 600;
	font-style: normal;
}

/* =========================== 15. Pinterest embed =========================== */
.kk-pinterest-embed {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	padding: clamp(40px, 6vw, 80px) var(--kk-shell-x);
	text-align: center;
}

/* =========================== 16. Sister network =========================== */
.kk-sister-network {
	padding: clamp(60px, 8vw, 100px) var(--kk-shell-x);
	background: linear-gradient(180deg, var(--kk-paper) 0%, var(--kk-paper-3) 100%);
}
.kk-sister-grid {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 20px;
}
.kk-sister-card {
	display: block;
	padding: 28px;
	background: #fff;
	border-radius: var(--kk-radius-md);
	border: 1px solid var(--kk-line);
	color: var(--kk-deep);
	transition: transform .35s var(--kk-ease), box-shadow .35s var(--kk-ease), border-color .35s var(--kk-ease);
}
.kk-sister-card:hover {
	color: var(--kk-deep);
	transform: translateY(-6px);
	box-shadow: var(--kk-shadow-md);
	border-color: var(--kk-line-strong);
}
.kk-sister-card h3 { font-size: 1.2rem; margin: 0 0 6px; }
.kk-sister-card p { color: var(--kk-ink-soft); font-size: .92rem; margin: 0; }

/* =========================== 17. Versprechen =========================== */
.kk-versprechen {
	padding: clamp(60px, 8vw, 100px) var(--kk-shell-x);
}
.kk-versprechen-list {
	max-width: 920px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 24px;
	list-style: none;
	padding: 0;
}
.kk-versprechen-list li {
	padding: 28px;
	background: var(--kk-paper-3);
	border-radius: var(--kk-radius-md);
	border-left: 4px solid var(--kk-accent);
	transition: transform .35s var(--kk-ease);
}
.kk-versprechen-list li:hover { transform: translateY(-4px); }
.kk-versprechen-list strong { display: block; color: var(--kk-deep); margin-bottom: 6px; }

/* =========================== 18. FAQ =========================== */
.kk-faq {
	padding: clamp(60px, 8vw, 100px) var(--kk-shell-x);
}
.kk-faq-list {
	max-width: 760px;
	margin: 0 auto;
}
.kk-faq-item {
	border-bottom: 1px solid var(--kk-line);
	padding: 20px 0;
}
.kk-faq-item summary {
	font-family: var(--kk-serif);
	font-size: 1.2rem;
	color: var(--kk-deep);
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 14px;
	font-weight: 700;
}
.kk-faq-item summary::-webkit-details-marker { display: none; }
.kk-faq-item summary::after {
	content: "+";
	font-family: var(--kk-sans);
	font-weight: 300;
	font-size: 1.8rem;
	color: var(--kk-accent);
	width: 32px; height: 32px;
	display: grid; place-items: center;
	border: 1px solid var(--kk-line-strong);
	border-radius: 50%;
	transition: transform .35s var(--kk-ease);
	flex-shrink: 0;
}
.kk-faq-item[open] summary::after { transform: rotate(45deg); color: var(--kk-accent-dark); }
.kk-faq-item-body { padding-top: 14px; color: var(--kk-ink-soft); }

/* =========================== 19. Anchor pitch =========================== */
.kk-anchor-pitch {
	padding: clamp(60px, 8vw, 100px) var(--kk-shell-x);
	text-align: center;
}
.kk-anchor-pitch-card {
	max-width: 720px;
	margin: 0 auto;
	padding: clamp(36px, 6vw, 60px);
	background: var(--kk-paper-3);
	border: 1px solid var(--kk-line);
	border-radius: var(--kk-radius-lg);
}

/* =========================== 20. Cards =========================== */
.kk-card-grid {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 28px;
}
.kk-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: var(--kk-radius-lg);
	overflow: hidden;
	border: 1px solid var(--kk-line);
	box-shadow: var(--kk-shadow-sm);
	transition: transform .35s var(--kk-ease), box-shadow .35s var(--kk-ease), border-color .35s var(--kk-ease);
	position: relative;
}
.kk-card:hover {
	transform: translateY(-8px);
	box-shadow: var(--kk-shadow-deep);
	border-color: var(--kk-line-strong);
}
.kk-card-media {
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--kk-paper-3);
}
.kk-card-media img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform .8s var(--kk-ease);
}
.kk-card:hover .kk-card-media img { transform: scale(1.06); }
.kk-card-body { padding: 20px 22px 26px; display: flex; flex-direction: column; gap: 10px; }
.kk-card-body h3 {
	font-size: 1.2rem;
	margin: 0 0 6px;
	line-height: 1.2;
	color: var(--kk-deep);
}
.kk-card-body h3 a { color: inherit; }
.kk-card-body h3 a:hover { color: var(--kk-accent-dark); }
.kk-card-meta {
	display: flex;
	gap: 8px;
	align-items: center;
	font-size: .82rem;
	color: var(--kk-ink-mute);
}
.kk-card-cat {
	display: inline-block;
	padding: 2px 10px;
	background: var(--kk-paper-3);
	color: var(--kk-accent-dark);
	border-radius: var(--kk-radius-pill);
	font-weight: 600;
	font-size: .78rem;
}

/* =========================== 21. Single article =========================== */
.kk-single-wrap {
	max-width: 1240px;
	margin: 0 auto;
	padding: 40px var(--kk-shell-x) 80px;
}
.kk-article-header {
	max-width: 800px;
	margin: 0 auto 48px;
	text-align: center;
}
.kk-article-header .entry-title {
	font-size: clamp(2rem, 5.4vw, 3.6rem);
	margin-bottom: 18px;
}
.kk-post-meta-top {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center;
	align-items: center;
	font-size: .9rem;
	color: var(--kk-ink-soft);
}
.kk-meta-cat a { color: var(--kk-accent-dark); font-weight: 600; }
.kk-meta-dot { opacity: .5; }
.kk-bookmark {
	background: transparent;
	border: 1px solid var(--kk-line-strong);
	color: var(--kk-deep);
	padding: 4px 12px;
	border-radius: var(--kk-radius-pill);
	font-size: .82rem;
}
.kk-article-hero {
	max-width: 1100px;
	margin: 40px auto 0;
	border-radius: var(--kk-radius-lg);
	overflow: hidden;
	box-shadow: var(--kk-shadow-lg);
}
.kk-article-hero-img { width: 100%; height: auto; display: block; }

.kk-quick-answer {
	max-width: 760px;
	margin: 0 auto 28px;
	padding: 24px 28px;
	background: var(--kk-paper-3);
	border-radius: var(--kk-radius-md);
	border-left: 4px solid var(--kk-accent);
}
.kk-quick-answer p { margin: 6px 0 0; color: var(--kk-deep); font-size: 1.05rem; }

.kk-toc {
	max-width: 760px;
	margin: 0 auto 36px;
	padding: 24px 28px;
	background: #fff;
	border: 1px solid var(--kk-line);
	border-radius: var(--kk-radius-md);
}
.kk-toc-title { font-family: var(--kk-serif); font-weight: 800; margin-bottom: 12px; color: var(--kk-deep); }
.kk-toc-list { list-style: none; padding: 0; margin: 0; counter-reset: kk-toc; }
.kk-toc-list li { counter-increment: kk-toc; padding: 4px 0; }
.kk-toc-list li::before {
	content: counter(kk-toc, decimal-leading-zero);
	color: var(--kk-accent);
	font-weight: 700;
	margin-right: 10px;
	font-family: var(--kk-serif);
}
.kk-toc-list a { color: var(--kk-ink); transition: color .2s var(--kk-ease), padding-left .25s var(--kk-ease); display: inline-block; }
.kk-toc-list a:hover, .kk-toc-list a.is-active { color: var(--kk-accent-dark); padding-left: 4px; }

.entry-content {
	max-width: 720px;
	margin: 0 auto;
	font-size: 1.08rem;
	line-height: 1.78;
	color: var(--kk-ink);
}
.entry-content > * { margin-bottom: 1.2em; }
.entry-content h2 { margin-top: 2em; }
.entry-content h3 { margin-top: 1.6em; }
.entry-content img { border-radius: var(--kk-radius-md); margin: 1.6em auto; }
.entry-content blockquote {
	border-left: 4px solid var(--kk-accent);
	background: var(--kk-paper-3);
	padding: 20px 24px;
	border-radius: 0 var(--kk-radius-md) var(--kk-radius-md) 0;
	margin: 1.6em 0;
	font-family: var(--kk-serif);
	font-style: italic;
	font-size: 1.18rem;
}
.entry-content a { font-weight: 600; border-bottom: 1px dashed var(--kk-line-strong); }
.entry-content a:hover { border-bottom-style: solid; }
.entry-content ul, .entry-content ol { padding-left: 1.4em; }
.entry-content li { margin-bottom: .5em; }

.kk-img-wrap { position: relative; display: block; }
.kk-img-pin {
	position: absolute;
	top: 14px; left: 14px;
	padding: 6px 12px;
	background: rgba(255, 255, 255, .9);
	color: var(--kk-accent-dark);
	border-radius: var(--kk-radius-pill);
	font-size: .82rem;
	font-weight: 600;
	opacity: 0;
	transition: opacity .25s var(--kk-ease);
}
.kk-img-wrap:hover .kk-img-pin { opacity: 1; }

.kk-aff-disclosure {
	max-width: 720px;
	margin: 0 auto 24px;
	padding: 14px 18px;
	background: var(--kk-paper-3);
	border-radius: var(--kk-radius-sm);
	font-size: .88rem;
	color: var(--kk-ink-soft);
	border: 1px solid var(--kk-line);
}

.kk-tags {
	max-width: 720px;
	margin: 28px auto;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	font-size: .88rem;
}
.kk-tags span { color: var(--kk-ink-soft); margin-right: 4px; }
.kk-tags a {
	display: inline-block;
	padding: 4px 12px;
	background: var(--kk-paper-3);
	color: var(--kk-accent-dark);
	border-radius: var(--kk-radius-pill);
	font-size: .82rem;
}

.kk-author-card {
	max-width: 760px;
	margin: 48px auto;
	padding: 32px;
	background: #fff;
	border-radius: var(--kk-radius-lg);
	border: 1px solid var(--kk-line);
	box-shadow: var(--kk-shadow-md);
	display: grid;
	grid-template-columns: 88px 1fr;
	gap: 24px;
	align-items: center;
}
.kk-author-photo {
	width: 88px; height: 88px;
	border-radius: 50%;
	overflow: hidden;
	border: 3px solid var(--kk-accent);
}
.kk-author-photo img { width: 100%; height: 100%; object-fit: cover; }
.kk-author-initials {
	width: 100%; height: 100%;
	display: grid; place-items: center;
	background: linear-gradient(135deg, var(--kk-accent), var(--kk-accent-dark));
	color: #fff;
	font-family: var(--kk-serif);
	font-size: 2.4rem;
	font-weight: 800;
}
.kk-author-body h3 { margin: 4px 0 6px; }
.kk-author-body p { margin: 0 0 10px; color: var(--kk-ink-soft); font-size: .96rem; }
.kk-author-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.kk-author-link { color: var(--kk-accent-dark); font-weight: 600; }
.kk-author-icon {
	width: 32px; height: 32px;
	display: inline-grid; place-items: center;
	background: var(--kk-paper-3);
	color: var(--kk-accent-dark);
	border-radius: 50%;
}
@media (max-width: 600px) {
	.kk-author-card { grid-template-columns: 1fr; text-align: center; }
	.kk-author-photo { margin: 0 auto; }
	.kk-author-actions { justify-content: center; }
}

.kk-prevnext {
	max-width: 1100px;
	margin: 48px auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.kk-pn {
	display: grid;
	grid-template-columns: 80px 1fr;
	gap: 16px;
	padding: 16px;
	background: #fff;
	border-radius: var(--kk-radius-md);
	border: 1px solid var(--kk-line);
	transition: transform .25s var(--kk-ease), box-shadow .25s var(--kk-ease);
	align-items: center;
	color: var(--kk-deep);
}
.kk-pn:hover { transform: translateY(-4px); box-shadow: var(--kk-shadow-md); color: var(--kk-deep); }
.kk-pn-next { grid-template-columns: 1fr 80px; text-align: right; }
.kk-pn-thumb {
	width: 80px; height: 80px;
	border-radius: var(--kk-radius-sm);
	background-size: cover;
	background-position: center;
}
.kk-pn-body span { display: block; font-size: .82rem; color: var(--kk-ink-mute); margin-bottom: 4px; }
.kk-pn-body b { font-family: var(--kk-serif); font-weight: 700; font-size: 1rem; color: var(--kk-deep); }
@media (max-width: 720px) {
	.kk-prevnext { grid-template-columns: 1fr; }
	.kk-pn-next { grid-template-columns: 80px 1fr; text-align: left; }
	.kk-pn-next .kk-pn-thumb { order: -1; }
}

.kk-related {
	max-width: var(--kk-shell-max);
	margin: 60px auto;
}
.kk-related .kk-section-title {
	text-align: center;
	margin-bottom: 36px;
	font-size: clamp(1.5rem, 3vw, 2.2rem);
}

.kk-share-rail {
	position: fixed;
	left: 24px; top: 50%;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	gap: 10px;
	z-index: 50;
}
.kk-share-rail a, .kk-share-copy {
	width: 42px; height: 42px;
	display: grid; place-items: center;
	background: #fff;
	border: 1px solid var(--kk-line);
	border-radius: 50%;
	color: var(--kk-deep);
	box-shadow: var(--kk-shadow-sm);
	transition: transform .25s var(--kk-ease), color .25s var(--kk-ease), box-shadow .25s var(--kk-ease);
}
.kk-share-rail a:hover, .kk-share-copy:hover { transform: translateY(-3px); color: var(--kk-accent-dark); box-shadow: var(--kk-shadow-md); }
@media (max-width: 1100px) { .kk-share-rail { display: none; } }

.kk-mobile-pin {
	position: fixed;
	bottom: 22px; right: 22px;
	width: 52px; height: 52px;
	border-radius: 50%;
	display: none;
	place-items: center;
	background: var(--kk-accent);
	color: #fff;
	font-size: 1.4rem;
	box-shadow: var(--kk-shadow-md);
	z-index: 90;
}
@media (max-width: 720px) {
	.kk-single-active .kk-mobile-pin { display: grid; }
}

.kk-breadcrumb {
	max-width: 1240px;
	margin: 0 auto 24px;
	font-size: .88rem;
	color: var(--kk-ink-mute);
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}
.kk-breadcrumb a { color: var(--kk-accent-dark); }
.kk-bc-sep { color: var(--kk-ink-mute); }
.kk-bc-current { color: var(--kk-deep); font-weight: 500; }

/* =========================== 22. Squiggle =========================== */
.kk-divider-squiggle {
	max-width: 320px;
	margin: clamp(40px, 6vw, 80px) auto;
	color: var(--kk-accent);
	display: block;
	height: 28px;
}
.kk-divider-squiggle svg {
	width: 100%; height: 28px;
	display: block;
}
.kk-divider-squiggle svg path {
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
	animation: kkSquiggle 2.4s var(--kk-ease) forwards;
	animation-delay: .8s;
}
@keyframes kkSquiggle { to { stroke-dashoffset: 0; } }

/* =========================== 23. Footer =========================== */
.kk-site-footer {
	position: relative;
	background: linear-gradient(180deg, var(--kk-deep) 0%, #0d0524 100%);
	color: rgba(255, 255, 255, .85);
	padding: clamp(60px, 8vw, 120px) var(--kk-shell-x) 40px;
	margin-top: 60px;
	overflow: hidden;
	isolation: isolate;
}
.kk-site-footer::before {
	content: "";
	position: absolute; inset: 0;
	background:
		radial-gradient(900px 600px at 18% 0%, rgba(139, 92, 246, .28), transparent 60%),
		radial-gradient(700px 500px at 85% 100%, rgba(192, 132, 252, .18), transparent 60%);
	z-index: -1;
}
.kk-site-footer h2, .kk-site-footer h3, .kk-site-footer h4, .kk-site-footer p { color: #fff; }
.kk-site-footer a { color: rgba(255, 255, 255, .8); }
.kk-site-footer a:hover { color: var(--kk-highlight); }

.kk-footer-inner {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	position: relative;
}
.kk-footer-sparkle {
	position: absolute;
	color: rgba(255, 210, 74, .35);
	pointer-events: none;
}
.kk-anim-float { animation: kkFloat 6s ease-in-out infinite; }

.kk-footer-cta {
	text-align: center;
	margin-bottom: 64px;
	max-width: 720px;
	margin-inline: auto;
}
.kk-footer-cta .kk-script { color: var(--kk-highlight); }
.kk-footer-cta h2 { font-size: clamp(1.8rem, 3.8vw, 2.8rem); margin: 12px 0 16px; }
.kk-footer-cta p { color: rgba(255, 255, 255, .78); margin-bottom: 28px; }

.kk-footer-cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 40px;
	padding: 48px 0;
	border-top: 1px solid rgba(255, 255, 255, .12);
	border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.kk-footer-col h4 {
	font-family: var(--kk-sans);
	font-size: .82rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--kk-highlight);
	margin-bottom: 18px;
}
.kk-footer-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.kk-footer-socials { display: flex; gap: 10px; margin-bottom: 20px; }
.kk-footer-socials a {
	width: 38px; height: 38px;
	display: grid; place-items: center;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: 50%;
	transition: background .25s var(--kk-ease), transform .25s var(--kk-ease);
}
.kk-footer-socials a:hover { background: var(--kk-accent); transform: translateY(-3px); color: #fff; }

.kk-footer-network {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	align-items: center;
	justify-content: center;
	padding: 28px 0;
	font-size: .88rem;
	color: rgba(255, 255, 255, .6);
}
.kk-footer-network-label { font-weight: 600; color: rgba(255, 255, 255, .7); }
.kk-footer-network a { padding: 4px 12px; border: 1px solid rgba(255, 255, 255, .12); border-radius: var(--kk-radius-pill); }
.kk-footer-network a:hover { background: rgba(255, 210, 74, .1); border-color: var(--kk-highlight); color: var(--kk-highlight); }

.kk-footer-disclosure {
	max-width: 760px;
	margin: 28px auto 0;
	font-size: .82rem;
	color: rgba(255, 255, 255, .5);
	text-align: center;
}
.kk-footer-signature {
	text-align: center;
	margin: 36px 0 24px;
}
.kk-footer-signature .kk-script { color: var(--kk-highlight); font-size: 2rem; }

.kk-footer-bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 24px;
	border-top: 1px solid rgba(255, 255, 255, .08);
	font-size: .84rem;
	color: rgba(255, 255, 255, .5);
	flex-wrap: wrap;
	gap: 12px;
}
.kk-footer-nav { list-style: none; padding: 0; margin: 0; display: flex; gap: 16px; }
.kk-footer-nav a { font-size: .84rem; }

/* =========================== 24. News bar =========================== */
.kk-news-bar {
	position: fixed;
	left: 50%;
	bottom: 24px;
	transform: translate(-50%, 200%);
	width: min(680px, 92vw);
	background: rgba(26, 10, 62, .96);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	color: #fff;
	border-radius: var(--kk-radius-lg);
	box-shadow: var(--kk-shadow-deep);
	padding: 18px 24px;
	display: grid;
	grid-template-columns: 1fr auto auto;
	gap: 14px;
	align-items: center;
	transition: transform .55s var(--kk-ease);
	z-index: 900;
}
.kk-news-bar.is-visible { transform: translate(-50%, 0); }
.kk-news-bar-text strong { display: block; font-family: var(--kk-serif); font-size: 1.1rem; color: #fff; margin-bottom: 4px; }
.kk-news-bar-text { font-size: .88rem; color: rgba(255, 255, 255, .7); }
.kk-news-bar .kk-nl-mini { margin: 0; max-width: 320px; flex-wrap: nowrap; }
.kk-news-bar-close {
	background: transparent;
	border: 1px solid rgba(255, 255, 255, .2);
	color: #fff;
	border-radius: 50%;
	width: 32px; height: 32px;
	font-size: 1.2rem;
	line-height: 1;
}
@media (max-width: 720px) {
	.kk-news-bar { grid-template-columns: 1fr; padding: 16px 18px; bottom: 12px; }
	.kk-news-bar .kk-nl-mini { max-width: 100%; }
	.kk-news-bar-close { position: absolute; top: 8px; right: 8px; }
}

/* =========================== 25. WP / blocks / a11y =========================== */
.alignwide { max-width: 1100px; margin-inline: auto; }
.alignfull { max-width: 100%; }
.wp-block-image img { border-radius: var(--kk-radius-md); }
.wp-block-pullquote, .wp-block-quote {
	border-left: 4px solid var(--kk-accent);
	background: var(--kk-paper-3);
	padding: 20px 28px;
	border-radius: 0 var(--kk-radius-md) var(--kk-radius-md) 0;
	font-family: var(--kk-serif);
	font-style: italic;
}

.search-form { display: flex; gap: 8px; }
.search-form .search-field {
	padding: 12px 18px;
	border: 1px solid var(--kk-line);
	border-radius: var(--kk-radius-pill);
	background: #fff;
	flex: 1;
}
.search-form .search-submit {
	padding: 12px 22px;
	border: none;
	background: var(--kk-accent);
	color: #fff;
	border-radius: var(--kk-radius-pill);
	font-weight: 600;
}

.kk-archive-wrap,
.kk-category-wrap {
	max-width: var(--kk-shell-max);
	margin: 0 auto;
	padding: 40px var(--kk-shell-x) 80px;
}
.kk-archive-hero {
	text-align: center;
	margin-bottom: 48px;
}
.kk-archive-title { font-size: clamp(2rem, 5vw, 3.2rem); }
.kk-archive-meta { color: var(--kk-ink-mute); font-size: .94rem; }
.kk-archive-grid { margin-top: 40px; }

/* Category hero — full-bleed gradient banner */
.kk-category-hero {
	position: relative;
	overflow: hidden;
	border-radius: clamp(16px, 2vw, 28px);
	padding: clamp(40px, 7vw, 80px) clamp(24px, 5vw, 56px);
	margin: 0 0 clamp(32px, 5vw, 48px);
	background:
		linear-gradient(135deg, rgba(45, 16, 96, .92), rgba(139, 92, 246, .78)),
		radial-gradient(900px 500px at 80% 0%, rgba(255, 210, 74, .15), transparent 60%);
	background-size: cover;
	background-position: center;
	box-shadow: 0 18px 60px rgba(45, 16, 96, .18);
	color: #fff;
	isolation: isolate;
}
.kk-category-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(26, 10, 62, .15), rgba(139, 92, 246, .3));
	mix-blend-mode: multiply;
	pointer-events: none;
	z-index: 0;
}
.kk-category-hero-inner {
	position: relative;
	z-index: 1;
	max-width: 760px;
}
.kk-category-kicker {
	display: inline-block;
	font-family: var(--kk-sans);
	font-size: .78rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .14em;
	padding: 6px 14px;
	background: rgba(255, 255, 255, .18);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-radius: var(--kk-radius-pill);
	color: var(--kk-highlight);
	margin-bottom: 16px;
}
.kk-category-title {
	font-family: var(--kk-serif);
	font-size: clamp(2.4rem, 6vw, 4rem);
	font-weight: 800;
	line-height: 1.05;
	margin: 0 0 14px;
	color: #fff;
	letter-spacing: -.02em;
	text-shadow: 0 4px 18px rgba(0, 0, 0, .18);
}
.kk-category-desc {
	font-size: clamp(1rem, 1.4vw, 1.12rem);
	line-height: 1.55;
	color: rgba(255, 255, 255, .92);
	margin: 0 0 14px;
	max-width: 56ch;
}
.kk-category-count {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: .92rem;
	font-weight: 500;
	color: rgba(255, 255, 255, .85);
	margin: 0;
}
.kk-category-count::before {
	content: "📚";
	font-size: 1rem;
}

/* Filter row — sub-category chips */
.kk-filter-row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 clamp(28px, 4vw, 40px);
	padding: 4px 0;
}
.kk-filter-chip {
	display: inline-flex;
	align-items: center;
	padding: 9px 18px;
	min-height: 38px;
	background: #fff;
	border: 1px solid var(--kk-line);
	border-radius: var(--kk-radius-pill);
	color: var(--kk-deep);
	font-size: .9rem;
	font-weight: 500;
	white-space: nowrap;
	transition: background .2s var(--kk-ease), border-color .2s var(--kk-ease), color .2s var(--kk-ease), transform .2s var(--kk-ease);
}
.kk-filter-chip:hover {
	background: rgba(139, 92, 246, .08);
	border-color: var(--kk-line-strong);
	color: var(--kk-accent-dark);
	transform: translateY(-1px);
}
.kk-filter-chip.is-active {
	background: linear-gradient(135deg, var(--kk-accent) 0%, var(--kk-accent-dark) 100%);
	color: #fff;
	border-color: transparent;
	box-shadow: 0 8px 20px rgba(139, 92, 246, .35);
}
.kk-filter-chip.is-active:hover { color: #fff; transform: translateY(-1px); }

@media (max-width: 720px) {
	.kk-category-hero { padding: 36px 22px; border-radius: 18px; }
	.kk-category-title { font-size: clamp(1.8rem, 8vw, 2.6rem); }
	.kk-filter-row { gap: 6px; }
	.kk-filter-chip { padding: 8px 14px; font-size: .85rem; min-height: 36px; }
}
.kk-archive-empty {
	max-width: 520px;
	margin: 80px auto;
	text-align: center;
}
.kk-pagination {
	margin: 60px auto 0;
	text-align: center;
}
.kk-pagination .page-numbers {
	display: inline-block;
	padding: 8px 14px;
	margin: 0 4px;
	border-radius: var(--kk-radius-sm);
	color: var(--kk-deep);
	border: 1px solid var(--kk-line);
	background: #fff;
	transition: all .25s var(--kk-ease);
}
.kk-pagination .page-numbers.current,
.kk-pagination .page-numbers:hover { background: var(--kk-accent); color: #fff; border-color: var(--kk-accent); }

.kk-pagelinks { margin: 24px 0; }

.kk-aff-card {
	display: grid;
	grid-template-columns: 120px 1fr auto;
	gap: 18px;
	align-items: center;
	padding: 18px;
	background: #fff;
	border: 1px solid var(--kk-line);
	border-radius: var(--kk-radius-md);
	margin: 18px 0;
	box-shadow: var(--kk-shadow-sm);
}
.kk-aff-card img { border-radius: var(--kk-radius-sm); }
@media (max-width: 600px) {
	.kk-aff-card { grid-template-columns: 1fr; text-align: center; }
}

/* =========================== 26. Reduced motion =========================== */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
	.kk-reveal { opacity: 1; clip-path: none; transform: none; }
	.kk-hero-title .kk-word { opacity: 1; transform: none; }
	.kk-sparkle-deco { display: none; }
}

/* =========================== 27. Responsive =========================== */
@media (max-width: 1024px) {
	.kk-cover-story { min-height: 460px; padding: 40px; }
}
@media (max-width: 720px) {
	body { font-size: 16px; }
	.kk-hero { padding-top: 120px; }
	.kk-hero-title { font-size: clamp(2.2rem, 11vw, 3.6rem); }
	.kk-cover-story { padding: 28px; min-height: 380px; }
	.kk-section-head { margin-bottom: 32px; }
	.kk-cat-tile { min-height: 320px; }
}

/* =========================== 28. Legacy template-part compat =========================== */

/* author-strip (small inline variant in section-author-strip.php) */
.kk-author-strip-text {
	display: flex; gap: 8px; align-items: center;
	color: var(--kk-ink-soft); font-size: .95rem;
}
.kk-author-strip-text a { color: var(--kk-deep); font-weight: 500; }
.kk-author-strip-text b { color: var(--kk-deep); }
.kk-author-strip-dot { opacity: .5; }
.kk-author-strip-since { color: var(--kk-ink-mute); }
.kk-author-strip-pin {
	margin-left: auto;
	display: inline-flex; align-items: center; gap: 6px;
	padding: 8px 16px;
	background: rgba(139, 92, 246, .12);
	color: var(--kk-accent-dark);
	border-radius: var(--kk-radius-pill);
	font-size: .88rem; font-weight: 600;
	transition: background .25s var(--kk-ease), transform .25s var(--kk-ease);
}
.kk-author-strip-pin:hover { background: var(--kk-accent); color: #fff; transform: translateY(-2px); }
.kk-author-strip-initials {
	width: 56px; height: 56px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--kk-accent), var(--kk-accent-dark));
	color: #fff;
	font-family: var(--kk-serif); font-weight: 800; font-size: 1.6rem;
	display: grid; place-items: center;
}

/* trust-strip simple pills variant */
.kk-trust-strip {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	align-items: center;
}
.kk-trust-pill {
	display: inline-flex; align-items: center; gap: 4px;
	padding: 8px 16px;
	background: #fff;
	color: var(--kk-deep);
	border: 1px solid var(--kk-line);
	border-radius: var(--kk-radius-pill);
	font-size: .9rem; font-weight: 600;
	box-shadow: var(--kk-shadow-sm);
}

/* card layout used by content-card.php with .kk-card-img */
.kk-card-img {
	aspect-ratio: 4 / 5;
	background-size: cover; background-position: center;
	transition: transform .8s var(--kk-ease);
}
.kk-card:hover .kk-card-img { transform: scale(1.05); }
.kk-card-img-fallback {
	background: linear-gradient(135deg, var(--kk-paper-3), var(--kk-paper-2));
}
.kk-card-title {
	font-size: 1.15rem; margin: 6px 0 4px; color: var(--kk-deep);
	font-family: var(--kk-serif); line-height: 1.25;
}
.kk-card-tag {
	display: inline-block;
	padding: 4px 12px;
	background: var(--kk-paper-3);
	color: var(--kk-accent-dark);
	border-radius: var(--kk-radius-pill);
	font-weight: 600; font-size: .78rem;
	margin-bottom: 4px;
}
.kk-link-arrow,
.kk-link-arrow-sm {
	display: inline-block;
	color: var(--kk-accent-dark);
	font-weight: 600;
	margin-top: 6px;
	transition: transform .25s var(--kk-ease);
}
.kk-card:hover .kk-link-arrow,
.kk-card:hover .kk-link-arrow-sm { transform: translateX(4px); }

/* featured hero card */
.kk-featured-card {
	position: relative;
	display: block;
	min-height: 480px;
	border-radius: var(--kk-radius-lg);
	overflow: hidden;
	color: #fff;
	background: var(--kk-deep);
	padding: 40px;
	box-shadow: var(--kk-shadow-lg);
	transition: transform .35s var(--kk-ease), box-shadow .35s var(--kk-ease);
}
.kk-featured-card:hover { transform: translateY(-6px); box-shadow: var(--kk-shadow-deep); color: #fff; }
.kk-featured-img {
	position: absolute; inset: 0;
	background-size: cover; background-position: center;
	z-index: 1;
}
.kk-featured-card::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, transparent 30%, rgba(26, 10, 62, .9) 100%);
	z-index: 2;
}
.kk-featured-body {
	position: absolute;
	left: 40px; right: 40px; bottom: 40px;
	z-index: 3;
}
.kk-featured-title { color: #fff; font-size: clamp(1.6rem, 3vw, 2.4rem); margin: 10px 0 8px; }
.kk-featured-excerpt { color: rgba(255, 255, 255, .8); margin-bottom: 14px; }
.kk-featured-card .kk-card-tag { background: var(--kk-highlight); color: var(--kk-deep); }

/* testimonials carousel (kk-tm-*) */
.kk-tm-carousel { max-width: var(--kk-shell-max); margin: 0 auto; }
.kk-tm-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 24px;
}
.kk-tm-card {
	margin: 0;
	padding: 32px;
	background: #fff;
	border-radius: var(--kk-radius-lg);
	border: 1px solid var(--kk-line);
	box-shadow: var(--kk-shadow-md);
	position: relative;
	overflow: hidden;
	transition: transform .35s var(--kk-ease), box-shadow .35s var(--kk-ease);
}
.kk-tm-card:hover { transform: translateY(-6px); box-shadow: var(--kk-shadow-lg); }
.kk-tm-card::before {
	content: "\201C";
	position: absolute;
	top: -50px; left: 14px;
	font-family: var(--kk-serif);
	font-size: 8rem;
	color: var(--kk-paper-3);
	line-height: 1;
}
.kk-tm-card blockquote {
	margin: 0 0 14px;
	font-size: 1.02rem;
	font-style: italic;
	color: var(--kk-ink);
	position: relative; z-index: 1;
}
.kk-tm-card figcaption b { display: block; color: var(--kk-deep); font-weight: 600; }
.kk-tm-card figcaption span { color: var(--kk-ink-mute); font-size: .88rem; }
.kk-tm-dots { display: none; }

/* promise grid (section-versprechen.php) */
.kk-promise { padding: clamp(60px, 8vw, 100px) var(--kk-shell-x); }
.kk-promise-grid {
	max-width: 1100px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 24px;
}
.kk-promise-card {
	padding: 32px;
	background: var(--kk-paper-3);
	border-radius: var(--kk-radius-lg);
	border-left: 4px solid var(--kk-accent);
	transition: transform .35s var(--kk-ease), box-shadow .35s var(--kk-ease);
}
.kk-promise-card:hover { transform: translateY(-4px); box-shadow: var(--kk-shadow-md); }
.kk-promise-icon {
	display: inline-grid; place-items: center;
	width: 56px; height: 56px;
	background: #fff;
	border-radius: 50%;
	margin-bottom: 16px;
	font-size: 1.6rem;
	box-shadow: var(--kk-shadow-sm);
}
.kk-promise-card h3 { margin: 0 0 6px; }
.kk-promise-card p { color: var(--kk-ink-soft); margin: 0; }

/* anchor pitch card (section-anchor-pitch.php) */
.kk-anchor-card {
	max-width: 720px;
	margin: 0 auto;
	padding: clamp(40px, 6vw, 60px);
	background: linear-gradient(135deg, var(--kk-deep) 0%, var(--kk-accent-dark) 100%);
	color: #fff;
	border-radius: var(--kk-radius-lg);
	box-shadow: var(--kk-shadow-deep);
	text-align: center;
	position: relative;
	overflow: hidden;
}
.kk-anchor-card h2 { color: #fff; }
.kk-anchor-card p { color: rgba(255, 255, 255, .82); }
.kk-card-tag-gold { background: var(--kk-highlight) !important; color: var(--kk-deep) !important; }
.kk-anchor-form { max-width: 480px; }
.kk-blob-d.kk-blob-gold { background: radial-gradient(circle, var(--kk-highlight) 0%, transparent 70%); }

/* home FAQ dl/dt/dd accordion (section-faq.php uses native <dl>) */
.kk-home-faq { padding: clamp(60px, 8vw, 100px) var(--kk-shell-x); }
.kk-home-faq .kk-section-title { text-align: center; margin-bottom: 36px; }
dl.kk-faq {
	max-width: 760px;
	margin: 0 auto;
}
dl.kk-faq dt {
	font-family: var(--kk-serif);
	font-weight: 700;
	font-size: 1.18rem;
	color: var(--kk-deep);
	padding: 18px 0 8px;
	border-top: 1px solid var(--kk-line);
	cursor: pointer;
	position: relative;
	padding-right: 40px;
}
dl.kk-faq dt::after {
	content: "+";
	position: absolute;
	right: 0; top: 18px;
	width: 28px; height: 28px;
	display: grid; place-items: center;
	border: 1px solid var(--kk-line-strong);
	border-radius: 50%;
	color: var(--kk-accent);
	font-weight: 300; font-size: 1.4rem;
	transition: transform .3s var(--kk-ease);
}
dl.kk-faq dt.is-open::after { transform: rotate(45deg); }
dl.kk-faq dd {
	margin: 0 0 14px;
	color: var(--kk-ink-soft);
	padding-bottom: 6px;
	max-height: 0;
	overflow: hidden;
	transition: max-height .45s var(--kk-ease);
}
dl.kk-faq dd.is-open { max-height: 400px; padding-bottom: 18px; }
dl.kk-faq dt:first-of-type { border-top: none; }

/* sister-network cards on homepage (kk-sister-card defined above; sister-grid handled) */

/* cover-story blob/sparkle decor */
.kk-cover-story .kk-blob-a { background: radial-gradient(circle, rgba(255, 210, 74, .35) 0%, transparent 70%); top: -20%; left: -10%; }
.kk-cover-story .kk-sparkle {
	position: absolute;
	top: 14%; right: 12%;
	font-size: 2rem;
	z-index: 3;
	animation: kkFloat 4s ease-in-out infinite;
}

/* section-title used across many parts */
.kk-section-title {
	font-family: var(--kk-serif);
	font-weight: 800;
	font-size: clamp(1.7rem, 3.4vw, 2.6rem);
	margin: 0 0 .5em;
	letter-spacing: -.02em;
}

/* Pinterest embed inner wrap */
.kk-pin-iframe-wrap { border-radius: var(--kk-radius-md); overflow: hidden; box-shadow: var(--kk-shadow-md); margin-bottom: 24px; }
.kk-pin-follow { text-align: center; }
.kk-cta-secondary {
	display: inline-block;
	padding: 10px 22px;
	background: rgba(139, 92, 246, .12);
	color: var(--kk-accent-dark);
	border-radius: var(--kk-radius-pill);
	font-weight: 600;
	transition: background .25s var(--kk-ease), transform .25s var(--kk-ease);
}
.kk-cta-secondary:hover { background: var(--kk-accent); color: #fff; transform: translateY(-2px); }

/* kk-snap-mobile (editor strip horizontal scroll on mobile) */
@media (max-width: 720px) {
	.kk-snap-mobile {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		gap: 16px;
		padding-bottom: 12px;
	}
	.kk-snap-mobile > * {
		flex: 0 0 80%;
		scroll-snap-align: start;
	}
}

/* magnetic-card alias used by content-featured */
.magnetic-card { transition: transform .35s var(--kk-ease), box-shadow .35s var(--kk-ease); }
.magnetic-card:hover { transform: translateY(-6px); }

/* parallax-img class noise from older templates */
.parallax-img { will-change: transform; }

/* fallback kk-anim-color-cycle no-op (left for class continuity) */
.kk-anim-color-cycle { color: inherit; }
.kk-noise { isolation: isolate; }

/* bookmark saved state */
.kk-bookmark.is-saved { background: var(--kk-accent); color: #fff; border-color: var(--kk-accent); }

/* =========================== 29. Hero v3 add-ons =========================== */
.kk-stage {
	transform-style: preserve-3d;
	perspective: 1400px;
}
.kk-hero-mesh {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
	opacity: .55;
}
.kk-hero-mesh-blob {
	position: absolute;
	border-radius: 50%;
	filter: blur(80px);
	mix-blend-mode: screen;
	will-change: transform;
}
.kk-hero-mesh-blob-1 {
	top: -10%;
	left: -8%;
	width: 55vw;
	height: 55vw;
	background: radial-gradient(circle at 30% 30%, rgba(139, 92, 246, .55), transparent 70%);
	animation: kkBlob 22s ease-in-out infinite alternate;
}
.kk-hero-mesh-blob-2 {
	bottom: -15%;
	right: -10%;
	width: 50vw;
	height: 50vw;
	background: radial-gradient(circle at 60% 50%, rgba(255, 210, 74, .45), transparent 70%);
	animation: kkBlob 28s ease-in-out -6s infinite alternate;
}
.kk-hero-mesh-blob-3 {
	top: 30%;
	right: 20%;
	width: 32vw;
	height: 32vw;
	background: radial-gradient(circle at 50% 50%, rgba(196, 181, 253, .5), transparent 70%);
	animation: kkBlob 18s ease-in-out -3s infinite alternate;
}
@keyframes kkBlob {
	0%   { transform: translate3d(0, 0, 0) scale(1); }
	50%  { transform: translate3d(4vw, -3vw, 0) scale(1.15); }
	100% { transform: translate3d(-3vw, 5vw, 0) scale(.92); }
}

.kk-hero-cards {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	transform-style: preserve-3d;
}
.kk-hero-card {
	position: absolute;
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 16px 20px;
	min-width: 180px;
	background: rgba(255, 255, 255, .65);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	border: 1px solid rgba(255, 255, 255, .8);
	border-radius: 20px;
	box-shadow: 0 22px 60px rgba(109, 40, 217, .22);
	will-change: transform;
	transition: transform .6s var(--kk-ease);
	animation: kkCardFloat 9s ease-in-out infinite;
}
.kk-hero-card-emoji {
	font-size: 1.7rem;
	line-height: 1;
}
.kk-hero-card strong {
	font-family: var(--kk-serif);
	font-size: 1rem;
	color: var(--kk-deep);
	line-height: 1.15;
}
.kk-hero-card small {
	font-size: .76rem;
	color: var(--kk-ink-soft);
	letter-spacing: .03em;
}
.kk-hero-card-1 {
	top: 14%;
	left: 6%;
	transform: rotate(-6deg) translateZ(60px);
	animation-delay: 0s;
}
.kk-hero-card-2 {
	bottom: 18%;
	right: 7%;
	transform: rotate(5deg) translateZ(80px);
	animation-delay: 2s;
}
.kk-hero-card-3 {
	top: 22%;
	right: 9%;
	transform: rotate(8deg) translateZ(40px);
	animation-delay: 4s;
}
@keyframes kkCardFloat {
	0%, 100% { transform: var(--kk-card-rest, rotate(0) translateZ(0)) translateY(0); }
	50%      { transform: var(--kk-card-rest, rotate(0) translateZ(0)) translateY(-12px); }
}
.kk-hero-card-1 { --kk-card-rest: rotate(-6deg) translateZ(60px); }
.kk-hero-card-2 { --kk-card-rest: rotate(5deg) translateZ(80px); }
.kk-hero-card-3 { --kk-card-rest: rotate(8deg) translateZ(40px); }

.kk-eye-dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--kk-accent);
	box-shadow: 0 0 0 0 rgba(139, 92, 246, .55);
	margin-right: 8px;
	vertical-align: middle;
	animation: kkPulseDot 2.2s ease-out infinite;
}
@keyframes kkPulseDot {
	0%   { box-shadow: 0 0 0 0 rgba(139, 92, 246, .55); }
	70%  { box-shadow: 0 0 0 14px rgba(139, 92, 246, 0); }
	100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0); }
}

.kk-hero-stats {
	list-style: none;
	margin: 36px auto 0;
	padding: 0;
	display: inline-flex;
	flex-wrap: wrap;
	gap: 22px 40px;
	justify-content: center;
	opacity: 0;
	transform: translateY(20px);
	animation: kkFadeUp 1s var(--kk-ease) 1.7s forwards;
}
.kk-hero-stats li {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}
.kk-hero-stats b {
	font-family: var(--kk-serif);
	font-size: clamp(1.6rem, 2.6vw, 2.1rem);
	font-weight: 800;
	color: var(--kk-accent-dark);
	line-height: 1;
}
.kk-hero-stats span {
	font-size: .82rem;
	color: var(--kk-ink-soft);
	letter-spacing: .04em;
	text-transform: uppercase;
}

.kk-hero-scroll {
	position: absolute;
	bottom: 28px;
	left: 50%;
	transform: translateX(-50%);
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	color: var(--kk-ink-soft);
	text-decoration: none;
	font-size: .76rem;
	letter-spacing: .25em;
	text-transform: uppercase;
	z-index: 3;
	opacity: 0;
	animation: kkFadeUp 1s var(--kk-ease) 2s forwards;
}
.kk-hero-scroll-line {
	display: block;
	width: 1px;
	height: 42px;
	background: linear-gradient(to bottom, transparent, var(--kk-accent-dark));
	animation: kkScrollLine 1.8s ease-in-out infinite;
	transform-origin: top;
}
@keyframes kkScrollLine {
	0%   { transform: scaleY(0); }
	50%  { transform: scaleY(1); }
	100% { transform: scaleY(0); transform-origin: bottom; }
}
.kk-hero-scroll:hover { color: var(--kk-accent-dark); }

@media (max-width: 900px) {
	.kk-hero-card-1 { top: 8%; left: 3%; min-width: 140px; padding: 10px 14px; }
	.kk-hero-card-2 { bottom: 8%; right: 3%; min-width: 140px; padding: 10px 14px; }
	.kk-hero-card-3 { display: none; }
	.kk-hero-card strong { font-size: .9rem; }
	.kk-hero-card-emoji { font-size: 1.3rem; }
}
@media (max-width: 600px) {
	.kk-hero-cards { display: none; }
	.kk-hero-stats { gap: 14px 22px; }
	.kk-hero-scroll { display: none; }
}

/* =========================== 30. About-Me v3 =========================== */
.kk-about-me {
	position: relative;
	padding: clamp(80px, 10vw, 140px) var(--kk-shell-x);
	background:
		radial-gradient(900px 500px at 18% 12%, rgba(139, 92, 246, .08), transparent 60%),
		var(--kk-paper);
	overflow: hidden;
	isolation: isolate;
}
.kk-about-deco {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}
.kk-about-blob {
	position: absolute;
	border-radius: 50%;
	filter: blur(90px);
	opacity: .14;
	will-change: transform;
}
.kk-about-blob-1 {
	top: -10%;
	left: -8%;
	width: 480px;
	height: 480px;
	background: var(--kk-accent);
	animation: kkBlob 24s ease-in-out infinite alternate;
}
.kk-about-blob-2 {
	bottom: -10%;
	right: -6%;
	width: 380px;
	height: 380px;
	background: var(--kk-highlight);
	animation: kkBlob 30s ease-in-out -8s infinite alternate;
}

.kk-about-inner {
	position: relative;
	z-index: 1;
	max-width: 1180px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 380px 1fr;
	gap: 80px;
	align-items: center;
}

.kk-about-photo-frame {
	position: relative;
	margin: 0;
	transform-style: preserve-3d;
	will-change: transform;
}
.kk-about-polaroid {
	position: relative;
	padding: 18px 18px 56px;
	background: #fff;
	border-radius: 6px;
	box-shadow:
		0 28px 60px rgba(26, 10, 62, .22),
		0 4px 12px rgba(26, 10, 62, .08);
	transform: rotate(-2.4deg);
	transition: transform .6s var(--kk-ease), box-shadow .6s var(--kk-ease);
}
.kk-about-photo-frame:hover .kk-about-polaroid {
	transform: rotate(0deg) translateY(-6px);
	box-shadow:
		0 36px 80px rgba(26, 10, 62, .28),
		0 6px 16px rgba(26, 10, 62, .1);
}
.kk-about-ring {
	position: absolute;
	inset: 8px 8px 50px;
	border-radius: 4px;
	z-index: 0;
	background: conic-gradient(from 0deg, var(--kk-accent), var(--kk-highlight), var(--kk-accent-dark), var(--kk-accent));
	opacity: 0;
	transition: opacity .5s var(--kk-ease);
}
.kk-about-photo-frame:hover .kk-about-ring {
	opacity: .85;
	animation: kkSpin 16s linear infinite;
}
.kk-about-photo {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	aspect-ratio: 1;
	height: auto;
	object-fit: cover;
	border-radius: 2px;
}
.kk-about-initial {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 100%;
	aspect-ratio: 1;
	background: linear-gradient(135deg, var(--kk-accent) 0%, var(--kk-accent-dark) 100%);
	color: #fff;
	font-family: var(--kk-serif);
	font-size: 7rem;
	font-weight: 800;
	border-radius: 2px;
}
.kk-about-caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 14px;
	text-align: center;
	font-family: var(--kk-script);
	font-size: 1.4rem;
	color: var(--kk-deep);
}
.kk-about-caption-pin {
	display: inline-block;
	margin-right: 4px;
	transform: translateY(-1px);
	font-size: .9em;
}
.kk-about-tape {
	position: absolute;
	width: 90px;
	height: 26px;
	background:
		repeating-linear-gradient(135deg, rgba(255, 210, 74, .85) 0 8px, rgba(255, 210, 74, .55) 8px 14px);
	box-shadow: 0 4px 12px rgba(26, 10, 62, .14);
	z-index: 3;
	pointer-events: none;
}
.kk-about-tape-1 {
	top: -8px;
	left: -14px;
	transform: rotate(-22deg);
}
.kk-about-tape-2 {
	top: -10px;
	right: -10px;
	transform: rotate(18deg);
	background: repeating-linear-gradient(135deg, rgba(196, 181, 253, .85) 0 8px, rgba(196, 181, 253, .55) 8px 14px);
}

.kk-about-body { position: relative; }
.kk-about-body .kk-eyebrow {
	display: inline-block;
	margin-bottom: 10px;
	color: var(--kk-accent-dark);
	font-weight: 700;
	font-size: .82rem;
	letter-spacing: .14em;
	text-transform: uppercase;
}
.kk-about-body h2 {
	font-family: var(--kk-serif);
	font-size: clamp(2rem, 4vw, 3.2rem);
	line-height: 1.05;
	letter-spacing: -.02em;
	color: var(--kk-deep);
	margin: 0 0 22px;
}
.kk-about-lead {
	font-size: clamp(1.1rem, 1.5vw, 1.28rem);
	line-height: 1.55;
	color: var(--kk-ink);
	margin: 0 0 16px;
	max-width: 580px;
}
.kk-about-body p {
	color: var(--kk-ink-soft);
	line-height: 1.65;
	max-width: 580px;
	margin: 0 0 24px;
}
.kk-about-stats {
	list-style: none;
	padding: 22px 26px;
	margin: 0 0 32px;
	display: flex;
	gap: 38px;
	flex-wrap: wrap;
	background: rgba(255, 255, 255, .65);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, .9);
	border-radius: 18px;
	box-shadow: 0 14px 40px rgba(109, 40, 217, .08);
}
.kk-about-stats li {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.kk-about-stats b {
	font-family: var(--kk-serif);
	font-size: clamp(1.7rem, 2.8vw, 2.3rem);
	color: var(--kk-accent-dark);
	line-height: 1;
}
.kk-about-stats span {
	font-size: .8rem;
	color: var(--kk-ink-soft);
	text-transform: uppercase;
	letter-spacing: .08em;
}
.kk-about-ctas {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 24px;
}
.kk-about-signature {
	font-family: var(--kk-script);
	font-size: clamp(2.2rem, 3.5vw, 3rem);
	color: var(--kk-accent-dark);
	margin: 0;
	line-height: 1;
}

@media (max-width: 900px) {
	.kk-about-inner { grid-template-columns: 1fr; gap: 48px; }
	.kk-about-photo-frame { max-width: 320px; margin: 0 auto; }
	.kk-about-stats { gap: 22px 28px; padding: 18px 22px; }
}

/* =========================== 31. Tilt3D + perf =========================== */
[data-kk-tilt] {
	transform-style: preserve-3d;
	will-change: transform;
}
.kk-sparkle-deco,
.kk-hero-card,
.kk-cover-story-img,
.kk-cat-tile-bg {
	transform: translateZ(0);
}

/* content-visibility for off-screen sections (NOT hero/cover — above-fold) */
.kk-trust-strip,
.kk-cat-4up,
.kk-popular,
.kk-testimonials,
.kk-pinterest-embed,
.kk-sister-network,
.kk-versprechen,
.kk-faq,
.kk-anchor-pitch,
.kk-about-me {
	content-visibility: auto;
	contain-intrinsic-size: 1px 620px;
}

@media (prefers-reduced-motion: reduce) {
	.kk-hero-mesh-blob,
	.kk-hero-card,
	.kk-about-blob,
	.kk-eye-dot,
	.kk-hero-scroll-line { animation: none !important; }
	.kk-hero-card { transform: none !important; }
}
