/*
 * KOG Performance Rehab — Custom Block & Pattern Styles
 * Brand Identity System v1.0 · 2026
 *
 * Design tokens live in theme.json. This file styles the custom
 * KOG pattern classes (.kog-*) that can't be expressed by block
 * supports alone — the 3px card seams, gold accent bars, hover states,
 * oversized pillar numerals, etc.
 *
 * Font families and colors are referenced via WP's generated custom
 * properties:
 *   --wp--preset--color--gold          #C4973A
 *   --wp--preset--color--black         #1A3A2A  (Forest)
 *   --wp--preset--color--card          #1D3D2A
 *   --wp--preset--color--card-hover    #2D5C3E  (Forest Mid)
 *   --wp--preset--color--border        #2A4A38
 *   --wp--preset--color--gray          #7A7A72  (Warm Gray)
 *   --wp--preset--color--light         #F4F0E6  (Cream)
 *   --wp--preset--color--white         #FAF8F3  (Warm White)
 *   --wp--preset--font-family--playfair
 *   --wp--preset--font-family--dm-sans
 *
 * Transition standard: 240ms ease-out (brand spec)
 * Border radius: 6px (sm) · 10px (md) · 20px (lg)
 * Spacing base: 8px grid
 */

/* ==========================================================================
   1. KEYFRAMES (shared)
   ========================================================================== */

@keyframes kog-fadeUp {
	from { opacity: 0; transform: translateY(28px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes kog-fadeIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}
@keyframes kog-lineGrow {
	from { transform: scaleX(0); }
	to   { transform: scaleX(1); }
}

.kog-fade { opacity: 0; animation: kog-fadeUp 0.6s ease-out forwards; }
.kog-fade.d1 { animation-delay: 0.10s; }
.kog-fade.d2 { animation-delay: 0.25s; }
.kog-fade.d3 { animation-delay: 0.40s; }
.kog-fade.d4 { animation-delay: 0.55s; }
.kog-fade.d5 { animation-delay: 0.70s; }
.kog-fade.d6 { animation-delay: 0.85s; }
.kog-fade.d7 { animation-delay: 1.00s; }

@media (prefers-reduced-motion: reduce) {
	.kog-fade { animation: none !important; opacity: 1 !important; transform: none !important; }
}

/* ==========================================================================
   2. BLOCK STYLE VARIATIONS (registered in functions.php)
   ========================================================================== */

/* ---- Eyebrow paragraph ------------------------------------------------ */
.is-style-kog-eyebrow {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem !important;
	font-weight: 600;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold) !important;
	margin-bottom: 1rem !important;
}

/* ---- Italic-gold heading emphasis ------------------------------------- */
.is-style-kog-italic-gold em,
.is-style-kog-italic-gold i {
	font-style: italic;
	color: var(--wp--preset--color--gold);
}

/* ---- Card group ------------------------------------------------------- */
.is-style-kog-card {
	background: var(--wp--preset--color--card);
	padding: 2.25rem 1.75rem;
	position: relative;
	overflow: hidden;
	transition: background 240ms ease-out;
	border-left: 3px solid transparent;
}
.is-style-kog-card:hover {
	background: var(--wp--preset--color--card-hover);
	border-left-color: var(--wp--preset--color--gold);
}

/* ---- Pillar group (with gold left bar + bg numeral) ------------------- */
.is-style-kog-pillar {
	background: var(--wp--preset--color--card);
	padding: 2.5rem 2rem 2.25rem;
	position: relative;
	overflow: hidden;
	transition: background 240ms ease-out;
}
.is-style-kog-pillar::before {
	content: '';
	position: absolute;
	top: 0; left: 0;
	width: 3px; height: 100%;
	background: var(--wp--preset--color--gold);
	transform: scaleY(0);
	transform-origin: top;
	transition: transform 240ms ease-out;
}
.is-style-kog-pillar:hover::before { transform: scaleY(1); }
.is-style-kog-pillar:hover { background: var(--wp--preset--color--card-hover); }

/* ---- Gold callout bar ------------------------------------------------- */
.is-style-kog-gold-callout {
	background: var(--wp--preset--color--gold) !important;
	padding: 2.5rem 3rem !important;
	color: var(--wp--preset--color--charcoal);
	border-radius: 10px;
}
.is-style-kog-gold-callout * { color: var(--wp--preset--color--charcoal); }
.is-style-kog-gold-callout .wp-block-heading,
.is-style-kog-gold-callout h1,
.is-style-kog-gold-callout h2,
.is-style-kog-gold-callout h3 {
	font-family: var(--wp--preset--font-family--playfair);
	font-weight: 700;
	line-height: 1.3;
}

/* ---- Ghost buttons ---------------------------------------------------- */
.is-style-kog-ghost-on-gold .wp-block-button__link,
.wp-block-button.is-style-kog-ghost-on-gold .wp-block-button__link {
	background: var(--wp--preset--color--black) !important;
	color: var(--wp--preset--color--gold) !important;
	border-radius: 6px !important;
	transition: background 240ms ease-out !important;
}
.is-style-kog-ghost-on-gold .wp-block-button__link:hover,
.wp-block-button.is-style-kog-ghost-on-gold .wp-block-button__link:hover {
	background: var(--wp--preset--color--dark) !important;
	color: var(--wp--preset--color--gold) !important;
}

.is-style-kog-ghost-on-dark .wp-block-button__link,
.wp-block-button.is-style-kog-ghost-on-dark .wp-block-button__link {
	background: transparent !important;
	color: var(--wp--preset--color--gold) !important;
	border: 1px solid var(--wp--preset--color--border) !important;
	border-radius: 6px !important;
	letter-spacing: 0.22em;
	font-size: 0.625rem !important;
	transition: border-color 240ms ease-out, background 240ms ease-out !important;
}
.is-style-kog-ghost-on-dark .wp-block-button__link:hover,
.wp-block-button.is-style-kog-ghost-on-dark .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--gold) !important;
	background: rgba(196,151,58,0.06) !important;
}

/* ==========================================================================
   3. PROBLEM SECTION (stat trio, problem cards)
   ========================================================================== */

.kog-problem-headline em,
.kog-problem-headline i {
	font-style: italic;
	color: var(--wp--preset--color--gold);
}

/* Stat trio ------------------------------------------------------------- */
.kog-stat-row {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 3px;
}
.kog-stat-card {
	background: var(--wp--preset--color--card);
	padding: 2.25rem 1.75rem;
	position: relative;
	overflow: hidden;
	transition: background 240ms ease-out;
}
.kog-stat-card::after {
	content: '';
	position: absolute;
	bottom: 0; left: 0;
	width: 100%; height: 2px;
	background: var(--wp--preset--color--gold);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 240ms ease-out;
}
.kog-stat-card:hover::after { transform: scaleX(1); }
.kog-stat-card:hover { background: var(--wp--preset--color--card-hover); }

.kog-stat-number {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: clamp(40px, 5vw, 64px) !important;
	font-weight: 700 !important;
	color: var(--wp--preset--color--gold) !important;
	line-height: 1 !important;
	margin: 0 0 0.625rem !important;
}
.kog-stat-label {
	font-size: 0.875rem !important;
	color: var(--wp--preset--color--light) !important;
	line-height: 1.6 !important;
	margin: 0 0 0.625rem !important;
	font-weight: 500 !important;
}
.kog-stat-source {
	font-size: 0.625rem !important;
	color: var(--wp--preset--color--gray) !important;
	letter-spacing: 0.05em !important;
	margin: 0 !important;
}

/* Problem cards (2-up) -------------------------------------------------- */
.kog-problem-body {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3px;
}
.kog-problem-card {
	background: var(--wp--preset--color--card);
	padding: 2rem 1.75rem;
	border-left: 3px solid transparent;
	transition: border-color 240ms ease-out, background 240ms ease-out;
}
.kog-problem-card:hover {
	border-left-color: var(--wp--preset--color--gold);
	background: var(--wp--preset--color--card-hover);
}
.kog-problem-card-icon {
	font-size: 1.75rem !important;
	margin: 0 0 1rem !important;
	line-height: 1 !important;
}
.kog-problem-card-title {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: 1.25rem !important;
	font-weight: 700 !important;
	color: var(--wp--preset--color--white) !important;
	margin: 0 0 0.625rem !important;
	line-height: 1.25 !important;
}
.kog-problem-card-body {
	font-size: 0.875rem !important;
	color: var(--wp--preset--color--gray) !important;
	line-height: 1.75 !important;
	margin: 0 !important;
}

/* ==========================================================================
   4. FRAMEWORK PILLARS
   ========================================================================== */

.kog-pillars {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 3px;
}
.kog-pillar {
	background: var(--wp--preset--color--card);
	padding: 2.5rem 2rem 2.25rem;
	position: relative;
	overflow: hidden;
	transition: background 240ms ease-out;
}
.kog-pillar::before {
	content: '';
	position: absolute;
	top: 0; left: 0;
	width: 3px; height: 100%;
	background: var(--wp--preset--color--gold);
	transform: scaleY(0);
	transform-origin: top;
	transition: transform 240ms ease-out;
}
.kog-pillar:hover::before { transform: scaleY(1); }
.kog-pillar:hover { background: var(--wp--preset--color--card-hover); }

.kog-pillar-bg-num {
	position: absolute;
	bottom: -10px; right: 16px;
	font-family: var(--wp--preset--font-family--playfair);
	font-size: 100px;
	font-weight: 700;
	color: rgba(196,151,58,0.05);
	line-height: 1;
	pointer-events: none;
	transition: color 240ms ease-out;
	user-select: none;
}
.kog-pillar:hover .kog-pillar-bg-num { color: rgba(196,151,58,0.10); }

.kog-pillar-tag {
	font-size: 0.625rem !important;
	letter-spacing: 0.25em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--gold) !important;
	font-weight: 600 !important;
	margin: 0 0 1.25rem !important;
	display: block;
}

.kog-pillar-title {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: 1.375rem !important;
	font-weight: 700 !important;
	color: var(--wp--preset--color--white) !important;
	line-height: 1.25 !important;
	margin: 0 0 1rem !important;
	position: relative;
	z-index: 1;
}

.kog-pillar-body {
	font-size: 0.875rem !important;
	color: var(--wp--preset--color--gray) !important;
	line-height: 1.8 !important;
	position: relative;
	z-index: 1;
}
.kog-pillar-body strong {
	color: var(--wp--preset--color--light);
	font-weight: 500;
}

/* ==========================================================================
   5. GOLD CALLOUT BAR (bottom CTA)
   ========================================================================== */

.kog-gold-callout {
	background: var(--wp--preset--color--gold);
	padding: 2.5rem 3rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	flex-wrap: wrap;
	border-radius: 10px;
}
.kog-gold-callout .kog-callout-text,
.kog-gold-callout > p,
.kog-gold-callout > h1,
.kog-gold-callout > h2,
.kog-gold-callout > h3 {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: clamp(1.125rem, 2.5vw, 1.625rem);
	font-weight: 700;
	color: var(--wp--preset--color--charcoal);
	line-height: 1.3;
	max-width: 640px;
	margin: 0;
}
.kog-gold-callout .wp-block-button__link {
	background: var(--wp--preset--color--black);
	color: var(--wp--preset--color--gold);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	padding: 1rem 1.75rem;
	border-radius: 6px;
	white-space: nowrap;
	transition: background 240ms ease-out;
}
.kog-gold-callout .wp-block-button__link:hover {
	background: var(--wp--preset--color--dark);
	color: var(--wp--preset--color--gold);
}

/* ==========================================================================
   6. KEYNOTE / WORKSHOP GRID
   ========================================================================== */

.kog-grid-4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 3px;
}
.kog-grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 3px;
}
.kog-grid-2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 3px;
}
.kog-pillars-5 {
	grid-template-columns: repeat(5, 1fr);
}

.kog-offering-card {
	background: var(--wp--preset--color--card);
	display: flex;
	flex-direction: column;
	position: relative;
	overflow: hidden;
	transition: background 240ms ease-out;
}
.kog-offering-card:hover { background: var(--wp--preset--color--card-hover); }
.kog-offering-card::before {
	content: '';
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 3px;
	background: var(--wp--preset--color--gold);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 240ms ease-out;
}
.kog-offering-card:hover::before { transform: scaleX(1); }

.kog-offering-card-top { padding: 2.25rem 1.75rem 1.75rem; flex: 1; }
.kog-offering-card-footer { padding: 0 1.75rem 1.75rem; }

/* Signature badge --------------------------------------------------------*/
.kog-signature-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background: var(--wp--preset--color--gold-dim);
	border: 1px solid var(--wp--preset--color--gold-border);
	padding: 5px 12px 5px 10px;
	margin-bottom: 1.25rem;
	border-radius: 6px;
}
.kog-signature-badge::before {
	content: '';
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--wp--preset--color--gold);
	flex-shrink: 0;
}
.kog-signature-badge-text {
	font-size: 0.5625rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold);
	font-weight: 600;
}

.kog-offering-number {
	font-size: 0.625rem !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--gold) !important;
	font-weight: 600 !important;
	margin: 0 0 1.25rem !important;
	display: block;
}
.kog-offering-category {
	font-size: 0.625rem !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--gray) !important;
	margin: 0 0 0.75rem !important;
	line-height: 1.6 !important;
	display: block;
}
.kog-offering-title {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: clamp(1.25rem, 2vw, 1.625rem) !important;
	font-weight: 700 !important;
	color: var(--wp--preset--color--white) !important;
	line-height: 1.15 !important;
	margin: 0 0 1.125rem !important;
}
.kog-offering-title em,
.kog-offering-title i { font-style: italic; color: var(--wp--preset--color--gold); }

.kog-offering-tagline {
	font-size: 0.8125rem !important;
	color: var(--wp--preset--color--gold) !important;
	font-style: italic;
	line-height: 1.65 !important;
	margin: 0 0 1.25rem !important;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid var(--wp--preset--color--border);
	font-weight: 500;
}
.kog-offering-description {
	font-size: 0.8125rem !important;
	color: var(--wp--preset--color--gray) !important;
	line-height: 1.85 !important;
	margin: 0 !important;
}

/* Meta pills (workshops) ------------------------------------------------ */
.kog-card-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 1.25rem;
}
.kog-meta-pill {
	background: var(--wp--preset--color--dark);
	border: 1px solid var(--wp--preset--color--border);
	padding: 0.5rem 0.75rem;
	flex: 1 1 auto;
	min-width: 0;
	border-radius: 6px;
}
.kog-meta-label {
	display: block;
	font-size: 0.5625rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gray);
	margin-bottom: 2px;
}
.kog-meta-value {
	display: block;
	font-size: 0.75rem;
	color: var(--wp--preset--color--light);
	font-weight: 500;
}

/* Keynote-link tag (workshops) ----------------------------------------- */
.kog-keynote-link-tag {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1.125rem;
}
.kog-keynote-link-tag::before {
	content: '';
	width: 5px; height: 5px;
	border-radius: 50%;
	background: var(--wp--preset--color--gold);
}
.kog-keynote-link-tag-text {
	font-size: 0.5625rem;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gray);
	font-weight: 500;
}

/* ==========================================================================
   7. PAGE/SECTION SCAFFOLDING
   ========================================================================== */

.kog-eyebrow {
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold);
	margin-bottom: 1rem !important;
}

.kog-section-headline {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: clamp(1.875rem, 4vw, 3rem) !important;
	font-weight: 700 !important;
	line-height: 1.08 !important;
	margin-bottom: 0.75rem !important;
}
.kog-section-headline em,
.kog-section-headline i { font-style: italic; color: var(--wp--preset--color--gold); }

.kog-section-sub {
	font-size: 0.9375rem !important;
	color: var(--wp--preset--color--gray) !important;
	max-width: 580px;
	line-height: 1.75 !important;
	margin-bottom: 3rem !important;
}

.kog-section-divider {
	border: none;
	border-top: 1px solid var(--wp--preset--color--border);
	margin: 4.5rem 0;
	transform-origin: left;
	animation: kog-lineGrow 1s ease-out forwards 0.3s;
}

/* ==========================================================================
   7B. PAGE-BUILDING COMPONENTS
   ========================================================================== */

.kog-section-sub-center {
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Home hero ------------------------------------------------------------- */
.kog-home-hero {
	position: relative;
	overflow: hidden;
}
.kog-home-hero-title {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: var(--wp--preset--font-size--hero) !important;
	font-weight: 700 !important;
	line-height: 1.02 !important;
	color: var(--wp--preset--color--warm-white) !important;
	max-width: 820px;
	margin: 0 0 1.25rem !important;
}
.kog-home-hero-sub {
	font-size: 1.0625rem !important;
	line-height: 1.75 !important;
	color: rgba(244,240,230,0.82) !important;
	max-width: 680px;
	margin-bottom: 2rem !important;
}
.kog-home-hero-card {
	background: var(--wp--preset--color--card);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 10px;
	position: relative;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(19,45,33,0.32);
}
.kog-home-hero-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: var(--wp--preset--color--gold);
}
.kog-home-hero-card-label {
	font-size: 0.625rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--gold) !important;
	margin: 0 0 1rem !important;
}
.kog-home-hero-card-title {
	font-size: clamp(1.75rem, 3vw, 2.5rem) !important;
	font-weight: 700 !important;
	line-height: 1.08 !important;
	color: var(--wp--preset--color--warm-white) !important;
	margin: 0 0 2rem !important;
}
.kog-home-hero-metrics {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 3px;
}
.kog-home-hero-metric {
	background: var(--wp--preset--color--dark);
	padding: 1rem 0.875rem;
	border-radius: 6px;
}
.kog-home-hero-metric-value {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: 1.625rem !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	color: var(--wp--preset--color--gold) !important;
	margin: 0 0 0.375rem !important;
}
.kog-home-hero-metric-label {
	font-size: 0.625rem !important;
	letter-spacing: 0.16em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--gray) !important;
	margin: 0 !important;
}

/* Home hero — Video variant -------------------------------------------- */
.kog-hero-video {
	position: relative;
	overflow: hidden;
	background: #000;
	color: var(--wp--preset--color--warm-white);
	min-height: clamp(560px, 80vh, 820px);
	display: flex;
	align-items: center;
	padding: clamp(3rem, 7vw, 6rem) var(--wp--preset--spacing--30);
	/* Break out of constrained ancestors by cancelling the root global padding,
	   not 100vw (which overshoots by the scrollbar width and causes h-scroll). */
	width: auto;
	max-width: none;
	margin-left: calc(var(--wp--style--root--padding-left, 0px) * -1);
	margin-right: calc(var(--wp--style--root--padding-right, 0px) * -1);
	/* Sit flush against the header — cancel the block-gap above main. */
	margin-top: calc(var(--wp--style--block-gap, 1.5rem) * -1);
}
.kog-hero-video::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.35) 40%, rgba(0,0,0,0.75) 100%),
		linear-gradient(90deg, rgba(26,58,42,0.45) 0%, rgba(0,0,0,0) 60%);
	pointer-events: none;
	z-index: 1;
}
.kog-hero-video-bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
	z-index: 0;
}
.kog-hero-video-bg iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	width: max(100%, 177.78vh);
	height: max(100%, 56.25vw);
	transform: translate(-50%, -50%);
	border: 0;
	pointer-events: none;
}
.kog-hero-video-content {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 1100px;
	margin-inline: auto;
}
.kog-hero-video-title {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: var(--wp--preset--font-size--hero) !important;
	font-weight: 700 !important;
	line-height: 1.05 !important;
	letter-spacing: -0.01em !important;
	color: var(--wp--preset--color--warm-white) !important;
	margin: 0 0 1.25rem !important;
	max-width: 22ch;
	text-shadow: 0 2px 24px rgba(0,0,0,0.35);
}
.kog-hero-video-sub {
	font-size: clamp(1rem, 0.95rem + 0.4vw, 1.25rem) !important;
	line-height: 1.55 !important;
	color: var(--wp--preset--color--cream) !important;
	max-width: 52ch;
	margin: 0 0 2rem !important;
	text-shadow: 0 1px 12px rgba(0,0,0,0.4);
}
@media (max-width: 640px) {
	.kog-hero-video { min-height: 520px; }
	.kog-hero-video-title { max-width: none; }
}

/* Outcomes grid --------------------------------------------------------- */
.kog-outcomes-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 3px;
}
.kog-outcome-card {
	background: var(--wp--preset--color--cream);
	border: 1px solid rgba(26,58,42,0.10);
	border-radius: 10px;
	padding: 2rem 1.5rem;
	position: relative;
	overflow: hidden;
	transition: background 240ms ease-out, border-color 240ms ease-out, transform 240ms ease-out;
}
.kog-outcome-card:hover {
	background: var(--wp--preset--color--gold-pale);
	border-color: rgba(196,151,58,0.36);
	transform: translateY(-2px);
}
.kog-outcome-number {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: 3rem !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	color: rgba(196,151,58,0.42) !important;
	margin: 0 0 1.25rem !important;
}
.kog-outcome-title {
	font-size: 1.25rem !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	color: var(--wp--preset--color--charcoal) !important;
	margin: 0 0 0.875rem !important;
}
.kog-outcome-body {
	font-size: 0.875rem !important;
	line-height: 1.7 !important;
	color: var(--wp--preset--color--warm-gray) !important;
	margin: 0 !important;
}

/* Logo wall ------------------------------------------------------------- */
.kog-logo-wall {
	gap: 0.75rem !important;
	padding-top: 0.75rem;
}
.kog-logo-wall-item {
	border: 1px solid rgba(26,58,42,0.14);
	background: var(--wp--preset--color--cream);
	border-radius: 6px;
	color: var(--wp--preset--color--forest) !important;
	font-size: 0.6875rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.16em !important;
	line-height: 1 !important;
	margin: 0 !important;
	padding: 0.875rem 1rem;
	text-transform: uppercase !important;
	transition: border-color 240ms ease-out, background 240ms ease-out;
}
.kog-logo-wall-item:hover {
	background: var(--wp--preset--color--gold-pale);
	border-color: rgba(196,151,58,0.38);
}

/* Featured testimonial -------------------------------------------------- */
.kog-featured-testimonial {
	background: var(--wp--preset--color--gold-pale);
	border-left: 4px solid var(--wp--preset--color--forest);
	border-radius: 0 10px 10px 0;
	padding: clamp(2rem, 5vw, 4rem);
	position: relative;
}
.kog-featured-testimonial::after {
	content: '“';
	position: absolute;
	top: 0.5rem;
	right: 1.5rem;
	font-family: var(--wp--preset--font-family--playfair);
	font-size: clamp(5rem, 12vw, 9rem);
	line-height: 1;
	color: rgba(196,151,58,0.22);
	pointer-events: none;
}
.kog-featured-testimonial-quote {
	font-size: clamp(1.5rem, 3vw, 2.375rem) !important;
	font-style: italic !important;
	font-weight: 400 !important;
	line-height: 1.32 !important;
	color: var(--wp--preset--color--charcoal) !important;
	max-width: 840px;
	margin: 0 0 1.5rem !important;
	position: relative;
	z-index: 1;
}
.kog-featured-testimonial-attr {
	font-size: 0.75rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--forest) !important;
	margin: 0 !important;
}

/* ==========================================================================
   8. HEADER / NAV / FOOTER
   ========================================================================== */

/* Header shell — Forest bg, sticky */
.kog-site-header {
	background: var(--wp--preset--color--forest);
	border-bottom: 1px solid rgba(255,255,255,0.06);
	position: sticky;
	top: 0;
	z-index: 200;
}
.kog-site-header > .wp-block-group {
	padding-top: 2rem;
	padding-bottom: 2rem;
}

/* Wordmark */
.kog-site-title {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: 1.125rem !important;
	font-weight: 700 !important;
	color: var(--wp--preset--color--warm-white) !important;
	letter-spacing: 0.02em;
	text-decoration: none !important;
}
.kog-site-title em,
.kog-site-title i { color: var(--wp--preset--color--gold); font-style: italic; }

/* ---- Desktop nav links ------------------------------------------------- */
.kog-site-nav .wp-block-navigation-item__content,
.kog-site-nav .wp-block-navigation-item__content:visited {
	font-family: var(--wp--preset--font-family--dm-sans) !important;
	font-size: 0.6875rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	color: rgba(250,248,243,0.75) !important;
	transition: color 240ms ease-out !important;
	padding: 0 !important;
}
.kog-site-nav .wp-block-navigation-item__content:hover,
.kog-site-nav .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.kog-site-nav .wp-block-navigation-item.current-page-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--gold) !important;
}

/* Fallback for nav blocks outside .kog-site-nav */
.wp-block-navigation .wp-block-navigation-item__content {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	text-decoration: none;
	color: rgba(250,248,243,0.75);
	transition: color 240ms ease-out;
}
.wp-block-navigation .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--gold);
}

/* ---- Mobile toggle button --------------------------------------------- */
.kog-site-nav .wp-block-navigation__responsive-container-open,
.kog-site-nav .wp-block-navigation__responsive-container-close {
	color: var(--wp--preset--color--warm-white) !important;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}
.kog-site-nav .wp-block-navigation__responsive-container-open svg,
.kog-site-nav .wp-block-navigation__responsive-container-close svg {
	fill: var(--wp--preset--color--warm-white) !important;
}

/* ---- Mobile overlay ---------------------------------------------------- */
.kog-site-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--forest) !important;
	padding: 1.5rem 2rem 2rem;
}
.kog-site-nav .wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item__content {
	font-size: 1.125rem !important;
	letter-spacing: 0.08em !important;
	color: var(--wp--preset--color--warm-white) !important;
	padding: 0.875rem 0 !important;
	border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}
.kog-site-nav .wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--gold) !important;
}
.kog-site-nav .wp-block-navigation__responsive-container-close {
	color: var(--wp--preset--color--warm-white) !important;
}

/* Hide the Book CTA button inside the mobile overlay */
@media (max-width: 599px) {
	.kog-site-header .wp-block-buttons { display: none; }
}

/* ---- Footer ------------------------------------------------------------ */
.kog-page-footer {
	background: var(--wp--preset--color--forest);
}
.kog-page-footer > .wp-block-group {
	padding-top: 1rem;
	padding-bottom: 1rem;
}
.kog-footer-brand {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	color: var(--wp--preset--color--cream) !important;
	letter-spacing: 0.01em;
	margin: 0 !important;
}
.kog-footer-credits {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem !important;
	color: var(--wp--preset--color--warm-gray) !important;
	letter-spacing: 0.08em;
	text-align: right;
	line-height: 1.8;
	margin: 0 !important;
}
.kog-page-footer a {
	color: var(--wp--preset--color--warm-gray);
	text-decoration: none;
	transition: color 240ms ease-out;
}
.kog-page-footer a:hover { color: var(--wp--preset--color--gold); }
@media (max-width: 600px) {
	.kog-footer-credits { text-align: left; }
}

/* ==========================================================================
   9. POSTS (single / archive)
   ========================================================================== */

.kog-post-meta {
	font-size: 0.75rem;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gray);
}
.kog-post-meta a { color: var(--wp--preset--color--gold); text-decoration: none; }
.kog-post-meta a:hover { color: var(--wp--preset--color--gold-light); }

.wp-block-post-title a { color: inherit; text-decoration: none; }
.wp-block-post-title a:hover { color: var(--wp--preset--color--gold); }

/* ==========================================================================
  10. RESPONSIVE
   ========================================================================== */

@media (max-width: 1100px) {
	.kog-pillars-5 { grid-template-columns: repeat(3, 1fr); }
	.kog-outcomes-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
	.kog-grid-4 { grid-template-columns: repeat(2, 1fr); }
	.kog-pillars-5 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
	.kog-stat-row,
	.kog-pillars,
	.kog-pillars-5,
	.kog-grid-3,
	.kog-grid-2 { grid-template-columns: 1fr; }
	.kog-outcomes-grid { grid-template-columns: 1fr; }
	.kog-home-hero-metrics { grid-template-columns: 1fr; }
	.kog-problem-body { grid-template-columns: 1fr; }
	.kog-gold-callout { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 560px) {
	.kog-grid-4 { grid-template-columns: 1fr; }
}

/* ==========================================================================
  11. EDITOR TWEAKS
   ========================================================================== */

.editor-styles-wrapper {
	background: var(--wp--preset--color--warm-white);
}

.block-editor-block-list__layout .kog-pillar,
.block-editor-block-list__layout .kog-stat-card,
.block-editor-block-list__layout .kog-offering-card,
.block-editor-block-list__layout .kog-problem-card {
	outline: 1px dashed rgba(196,151,58,0.10);
	outline-offset: -1px;
}

/* ==========================================================================
  12. LIGHT CONTENT CARDS
   ========================================================================== */

/* Cream card — voice pillars, social content, general content */
.is-style-kog-card-light,
.kog-card-light {
	background: var(--wp--preset--color--cream);
	padding: 2rem 1.75rem;
	border-radius: 10px;
	color: var(--wp--preset--color--charcoal);
	transition: background 240ms ease-out;
}
.is-style-kog-card-light:hover {
	background: var(--wp--preset--color--gold-pale);
}

/* Gold Pale card — tinted accent backgrounds, tags sections */
.is-style-kog-card-pale,
.kog-card-pale {
	background: var(--wp--preset--color--gold-pale);
	padding: 2rem 1.75rem;
	border-radius: 10px;
	color: var(--wp--preset--color--charcoal);
}

/* Lift dark Forest cards off the Warm White page background */
.kog-offering-card,
.kog-stat-card,
.kog-pillar,
.is-style-kog-card,
.is-style-kog-pillar {
	box-shadow: 0 4px 24px rgba(26,58,42,0.14);
}

/* ==========================================================================
  13. TAG PILLS & BADGES
   ========================================================================== */

/* Forest filled pill — voice attributes, keyword badges */
.kog-tag {
	display: inline-flex;
	align-items: center;
	background: var(--wp--preset--color--forest);
	color: var(--wp--preset--color--warm-white);
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	padding: 0.3rem 0.625rem;
	border-radius: 6px;
	line-height: 1;
}

/* Forest Mid variant */
.kog-tag--mid {
	background: var(--wp--preset--color--forest-mid);
}

/* Sage variant */
.kog-tag--sage {
	background: var(--wp--preset--color--sage);
}

/* Outlined — transparent bg with Forest border and text */
.kog-tag--outline {
	background: transparent;
	color: var(--wp--preset--color--forest);
	border: 1px solid var(--wp--preset--color--forest);
}

/* Hashtag pills — social content */
.kog-hashtag {
	display: inline-flex;
	align-items: center;
	background: var(--wp--preset--color--forest);
	color: var(--wp--preset--color--warm-white) !important;
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.6875rem;
	font-weight: 500;
	padding: 0.375rem 0.75rem;
	border-radius: 6px;
	text-decoration: none;
	transition: background 240ms ease-out;
}
.kog-hashtag:hover {
	background: var(--wp--preset--color--forest-mid);
	color: var(--wp--preset--color--warm-white) !important;
}
.kog-hashtag-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 1rem;
}

/* ==========================================================================
  14. TESTIMONIAL / PULL QUOTE
   ========================================================================== */

.kog-testimonial,
.is-style-kog-testimonial {
	background: var(--wp--preset--color--gold-pale);
	border-left: 4px solid var(--wp--preset--color--forest);
	padding: 2.5rem 2.5rem 2.25rem;
	border-radius: 0 10px 10px 0;
}

.kog-testimonial-quote {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-style: italic !important;
	font-size: clamp(1.125rem, 2.5vw, 1.5rem) !important;
	font-weight: 400 !important;
	color: var(--wp--preset--color--charcoal) !important;
	line-height: 1.7 !important;
	margin: 0 0 1.25rem !important;
}

.kog-testimonial-attr {
	font-family: var(--wp--preset--font-family--dm-sans) !important;
	font-size: 0.75rem !important;
	font-weight: 500 !important;
	color: var(--wp--preset--color--forest) !important;
	letter-spacing: 0.1em !important;
	margin: 0 !important;
}

/* ==========================================================================
  15. VOICE & TONE COMPONENTS
   ========================================================================== */

/* Voice pillar card (Confident / Warm / Urgent) */
.kog-voice-card {
	background: var(--wp--preset--color--cream);
	padding: 2rem 1.75rem;
	border-radius: 10px;
	color: var(--wp--preset--color--charcoal);
}

.kog-voice-card-title {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: 1.125rem !important;
	font-weight: 700 !important;
	color: var(--wp--preset--color--charcoal) !important;
	margin: 0 0 0.75rem !important;
	line-height: 1.3 !important;
}

.kog-voice-card-body {
	font-size: 0.875rem !important;
	color: var(--wp--preset--color--charcoal) !important;
	line-height: 1.75 !important;
	margin: 0 0 1.25rem !important;
}

.kog-voice-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem;
}

/* "What we say" quote rows — Forest left border, Gold Pale bg, italic */
.kog-say-row {
	background: var(--wp--preset--color--gold-pale);
	border-left: 3px solid var(--wp--preset--color--forest);
	padding: 0.875rem 1.25rem;
	border-radius: 0 6px 6px 0;
	font-family: var(--wp--preset--font-family--playfair);
	font-style: italic;
	font-size: 0.9375rem !important;
	color: var(--wp--preset--color--charcoal) !important;
	margin-bottom: 0.5rem !important;
}

/* "What we avoid" rows — Warm Gray left border, Cream bg */
.kog-avoid-row {
	background: var(--wp--preset--color--cream);
	border-left: 3px solid var(--wp--preset--color--warm-gray);
	padding: 0.875rem 1.25rem;
	border-radius: 0 6px 6px 0;
	font-size: 0.9375rem !important;
	color: var(--wp--preset--color--warm-gray) !important;
	margin-bottom: 0.5rem !important;
}

/* Voice spectrum bar */
.kog-voice-spectrum {
	position: relative;
	padding: 0.5rem 0 1.5rem;
	margin: 1rem 0;
}
.kog-voice-spectrum-bar {
	height: 2px;
	background: linear-gradient(to right, var(--wp--preset--color--warm-gray), var(--wp--preset--color--forest), var(--wp--preset--color--warm-gray));
	border-radius: 1px;
	margin-bottom: 0.5rem;
}
.kog-voice-spectrum-labels {
	display: flex;
	justify-content: space-between;
	font-size: 0.625rem;
	color: var(--wp--preset--color--warm-gray);
	font-style: italic;
	letter-spacing: 0.05em;
}

/* ==========================================================================
  16. LOGO LOCKUP CARDS
   ========================================================================== */

.kog-logo-card {
	padding: 2rem 1.5rem;
	border-radius: 10px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.kog-logo-card--dark  { background: var(--wp--preset--color--forest); }
.kog-logo-card--light { background: var(--wp--preset--color--cream); border: 1px solid rgba(26,58,42,0.12); }
.kog-logo-card--gold  { background: var(--wp--preset--color--gold); }

.kog-logo-kicker {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.5rem;
	font-weight: 600;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	margin: 0 0 0.375rem;
	opacity: 0.65;
}
.kog-logo-card--dark .kog-logo-kicker,
.kog-logo-card--dark .kog-logo-tagline  { color: var(--wp--preset--color--warm-white); }
.kog-logo-card--light .kog-logo-kicker,
.kog-logo-card--light .kog-logo-tagline { color: var(--wp--preset--color--forest); }
.kog-logo-card--gold .kog-logo-kicker,
.kog-logo-card--gold .kog-logo-tagline  { color: var(--wp--preset--color--forest); }

.kog-logo-performance {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 1.125rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.1;
	margin: 0;
}
.kog-logo-card--dark .kog-logo-performance  { color: var(--wp--preset--color--warm-white); }
.kog-logo-card--light .kog-logo-performance { color: var(--wp--preset--color--forest); }
.kog-logo-card--gold .kog-logo-performance  { color: var(--wp--preset--color--forest); }

.kog-logo-rehab {
	font-family: var(--wp--preset--font-family--playfair);
	font-style: italic;
	font-size: 1.25rem;
	font-weight: 400;
	line-height: 1.2;
	margin: 0.125rem 0 0.625rem;
}
.kog-logo-card--dark .kog-logo-rehab  { color: var(--wp--preset--color--gold); }
.kog-logo-card--light .kog-logo-rehab { color: var(--wp--preset--color--gold); }
.kog-logo-card--gold .kog-logo-rehab  { color: var(--wp--preset--color--forest); }

.kog-logo-tagline {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.4375rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	line-height: 1.6;
	margin: 0;
	opacity: 0.55;
}

/* ==========================================================================
  17. SECTION LABEL / DIVIDER
   ========================================================================== */

.kog-section-label {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	padding-top: 1rem;
	border-top: 1px solid var(--wp--preset--color--gold);
	margin-bottom: 2.5rem;
}
.kog-section-num {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	color: var(--wp--preset--color--gold);
	white-space: nowrap;
}
.kog-section-name {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--charcoal);
}

/* ==========================================================================
  18. SOCIAL CONTENT CARD
   ========================================================================== */

.kog-social-card,
.is-style-kog-social-card {
	background: var(--wp--preset--color--gold-pale);
	border-left: 4px solid var(--wp--preset--color--sage);
	padding: 2rem 1.75rem;
	border-radius: 0 10px 10px 0;
	color: var(--wp--preset--color--charcoal);
}
.kog-social-card-eyebrow {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.25em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--gold) !important;
	margin-bottom: 0.75rem !important;
}
.kog-social-card-headline {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-size: clamp(1.375rem, 3vw, 1.75rem) !important;
	font-weight: 700 !important;
	color: var(--wp--preset--color--charcoal) !important;
	line-height: 1.2 !important;
	margin: 0 0 0.875rem !important;
}
.kog-social-card-body {
	font-size: 0.9375rem !important;
	color: var(--wp--preset--color--warm-gray) !important;
	line-height: 1.75 !important;
	margin: 0 0 1rem !important;
}

/* ==========================================================================
   19. CULTURE AUDIT — Interactive quiz page
   ========================================================================== */

.kog-culture-audit-wrap {
	background: var(--wp--preset--color--warm-white);
	min-height: 100vh;
}

/* Hero */
.kog-audit-hero {
	background: var(--wp--preset--color--card);
	border-bottom: 1px solid var(--wp--preset--color--border);
	padding: 4rem 3rem 3.5rem;
	text-align: center;
}
.kog-audit-eyebrow {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold);
	margin-bottom: 1rem;
}
.kog-audit-title {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: clamp(1.75rem, 4vw, 3.25rem);
	font-weight: 700;
	line-height: 1.1;
	color: var(--wp--preset--color--light);
	margin-bottom: 1rem;
}
.kog-audit-title em { font-style: italic; color: var(--wp--preset--color--gold); }
.kog-audit-sub {
	font-size: 1rem;
	color: var(--wp--preset--color--gray);
	max-width: 560px;
	margin: 0 auto 2rem;
	line-height: 1.75;
}
.kog-audit-meta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	flex-wrap: wrap;
}
.kog-audit-meta-item {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.75rem;
	color: var(--wp--preset--color--gray);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.kog-audit-meta-item span {
	color: var(--wp--preset--color--gold);
	font-weight: 600;
}

/* Progress bar */
.kog-audit-progress {
	background: var(--wp--preset--color--black);
	padding: 1rem 3rem;
	border-bottom: 1px solid var(--wp--preset--color--border);
	display: flex;
	align-items: center;
	gap: 1.25rem;
}
.kog-audit-progress-label {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.6875rem;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gray);
	white-space: nowrap;
	min-width: 80px;
}
.kog-audit-progress-track {
	flex: 1;
	height: 2px;
	background: var(--wp--preset--color--border);
}
.kog-audit-progress-fill {
	height: 100%;
	background: var(--wp--preset--color--gold);
	transition: width 0.5s ease;
	width: 0%;
}
.kog-audit-progress-count {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.6875rem;
	color: var(--wp--preset--color--gold);
	font-weight: 600;
	white-space: nowrap;
	min-width: 50px;
	text-align: right;
}

/* Main question area */
.kog-audit-main {
	max-width: 780px;
	margin: 0 auto;
	padding: 3.5rem 1.5rem 5rem;
}

/* Question screen */
.kog-audit-question { display: none; }
.kog-audit-question.active { display: block; animation: kog-fadeUp 0.5s ease-out forwards; }

.kog-audit-q-category {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold);
	font-weight: 600;
	margin-bottom: 0.75rem;
}
.kog-audit-q-number {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--gray);
	margin-bottom: 1.25rem;
}
.kog-audit-q-text {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	font-weight: 700;
	color: var(--wp--preset--color--charcoal);
	line-height: 1.3;
	margin-bottom: 2.5rem;
}
.kog-audit-q-context {
	font-size: 0.875rem;
	color: var(--wp--preset--color--warm-gray);
	line-height: 1.7;
	margin-bottom: 2.25rem;
	padding: 1.25rem 1.5rem;
	border-left: 2px solid var(--wp--preset--color--border);
	font-style: italic;
	background: var(--wp--preset--color--gold-pale);
}

/* Answer buttons */
.kog-audit-answers {
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
	margin-bottom: 2.5rem;
}
.kog-audit-answer {
	background: var(--wp--preset--color--card);
	border: 1px solid var(--wp--preset--color--border);
	color: var(--wp--preset--color--light);
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.9375rem;
	padding: 1.25rem 1.5rem;
	text-align: left;
	cursor: pointer;
	transition: all 240ms ease-out;
	display: flex;
	align-items: center;
	gap: 1rem;
	line-height: 1.5;
	border-radius: 6px;
	width: 100%;
}
.kog-audit-answer:hover {
	background: var(--wp--preset--color--card-hover);
	border-color: rgba(196,151,58,0.4);
	color: var(--wp--preset--color--white);
}
.kog-audit-answer.selected {
	background: rgba(196,151,58,0.12);
	border-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--white);
}
.kog-audit-answer-indicator {
	width: 28px; height: 28px;
	border-radius: 50%;
	border: 1px solid var(--wp--preset--color--border);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	font-size: 0.6875rem;
	color: var(--wp--preset--color--gray);
	font-weight: 600;
	transition: all 240ms ease-out;
}
.kog-audit-answer.selected .kog-audit-answer-indicator {
	background: var(--wp--preset--color--gold);
	border-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--charcoal);
}

/* Nav buttons */
.kog-audit-q-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
.kog-audit-nav-btn {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	padding: 0.875rem 1.75rem;
	border: none;
	cursor: pointer;
	transition: all 240ms ease-out;
	border-radius: 6px;
}
.kog-audit-nav-back {
	background: transparent;
	border: 1px solid var(--wp--preset--color--border);
	color: var(--wp--preset--color--gray);
}
.kog-audit-nav-back:hover {
	border-color: var(--wp--preset--color--gray);
	color: var(--wp--preset--color--warm-gray);
}
.kog-audit-nav-next {
	background: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--charcoal);
	opacity: 0.35;
	pointer-events: none;
}
.kog-audit-nav-next.enabled {
	opacity: 1;
	pointer-events: all;
}
.kog-audit-nav-next.enabled:hover { opacity: 0.85; }

/* Results screen */
.kog-audit-results { display: none; }
.kog-audit-results.active { display: block; animation: kog-fadeUp 0.6s ease-out forwards; }

.kog-audit-results-header {
	text-align: center;
	margin-bottom: 3.25rem;
}
.kog-audit-results-title {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: clamp(1.625rem, 3.5vw, 2.625rem);
	font-weight: 700;
	line-height: 1.15;
	color: var(--wp--preset--color--charcoal);
	margin-bottom: 1rem;
}
.kog-audit-results-title em { font-style: italic; color: var(--wp--preset--color--gold); }
.kog-audit-results-sub {
	font-size: 0.9375rem;
	color: var(--wp--preset--color--warm-gray);
	max-width: 520px;
	margin: 0 auto;
	line-height: 1.7;
}

/* Score display */
.kog-audit-score-display {
	background: var(--wp--preset--color--card);
	padding: 2.5rem;
	text-align: center;
	margin-bottom: 3px;
	border-radius: 10px 10px 0 0;
}
.kog-audit-score-label {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.6875rem;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gray);
	margin-bottom: 1rem;
}
.kog-audit-score-number {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: 5rem;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 0.5rem;
	color: var(--wp--preset--color--gold);
}
.kog-audit-score-of {
	font-size: 0.875rem;
	color: var(--wp--preset--color--gray);
	margin-bottom: 1.25rem;
}
.kog-audit-score-verdict {
	font-size: 1.125rem;
	font-weight: 600;
	margin-bottom: 0.5rem;
	color: var(--wp--preset--color--light);
}
.kog-audit-score-desc {
	font-size: 0.875rem;
	color: var(--wp--preset--color--gray);
	max-width: 480px;
	margin: 0 auto;
	line-height: 1.7;
}

/* Category scores */
.kog-audit-cat-scores {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 3px;
	margin-bottom: 3px;
}
.kog-audit-cat-card {
	background: var(--wp--preset--color--card);
	padding: 1.75rem 1.5rem;
}
.kog-audit-cat-label {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold);
	font-weight: 600;
	margin-bottom: 1rem;
	display: block;
}
.kog-audit-cat-bar-track {
	height: 3px;
	background: var(--wp--preset--color--border);
	margin-bottom: 0.625rem;
	overflow: hidden;
}
.kog-audit-cat-bar-fill {
	height: 100%;
	background: var(--wp--preset--color--gold);
	transition: width 1s ease 0.3s;
	width: 0%;
}
.kog-audit-cat-num {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: 2rem;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 0.375rem;
	color: var(--wp--preset--color--gold);
}
.kog-audit-cat-text {
	font-size: 0.75rem;
	color: var(--wp--preset--color--gray);
	line-height: 1.6;
}

/* Recommendations */
.kog-audit-recs {
	background: var(--wp--preset--color--card);
	padding: 2.5rem;
	margin-bottom: 3px;
}
.kog-audit-recs-title {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: 1.375rem;
	font-weight: 700;
	color: var(--wp--preset--color--light);
	margin-bottom: 1.5rem;
}
.kog-audit-rec-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.kog-audit-rec-item {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
}
.kog-audit-rec-dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--wp--preset--color--gold);
	flex-shrink: 0;
	margin-top: 6px;
}
.kog-audit-rec-text {
	font-size: 0.875rem;
	color: var(--wp--preset--color--light);
	line-height: 1.7;
}

/* CTA block */
.kog-audit-results-cta {
	background: var(--wp--preset--color--gold);
	padding: 2.5rem 3rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	flex-wrap: wrap;
	border-radius: 0 0 10px 10px;
}
.kog-audit-cta-headline {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: clamp(1.125rem, 2.2vw, 1.625rem);
	font-weight: 700;
	color: var(--wp--preset--color--charcoal);
	margin-bottom: 0.5rem;
	line-height: 1.25;
}
.kog-audit-cta-sub {
	font-size: 0.8125rem;
	color: rgba(28,28,26,0.65);
	line-height: 1.6;
	max-width: 440px;
}
.kog-audit-cta-btn {
	background: var(--wp--preset--color--charcoal);
	color: var(--wp--preset--color--gold);
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	padding: 1rem 1.75rem;
	border: none;
	cursor: pointer;
	white-space: nowrap;
	transition: background 240ms ease-out;
	flex-shrink: 0;
	border-radius: 6px;
	text-decoration: none;
	display: inline-block;
}
.kog-audit-cta-btn:hover {
	background: var(--wp--preset--color--black);
	color: var(--wp--preset--color--gold);
}

.kog-audit-retake {
	display: block;
	text-align: center;
	margin-top: 2rem;
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.75rem;
	color: var(--wp--preset--color--gray);
	letter-spacing: 0.15em;
	text-transform: uppercase;
	cursor: pointer;
	transition: color 240ms ease-out;
	background: none;
	border: none;
	width: 100%;
}
.kog-audit-retake:hover { color: var(--wp--preset--color--warm-gray); }

@media (max-width: 640px) {
	.kog-audit-hero { padding: 2.5rem 1.5rem; }
	.kog-audit-progress { padding: 0.875rem 1.5rem; }
	.kog-audit-cat-scores { grid-template-columns: 1fr; }
	.kog-audit-results-cta { flex-direction: column; }
	.kog-audit-meta { gap: 1rem; }
}

/* ==========================================================================
   20. PAGE HEADER (template part — parts/page-header.html)
   ========================================================================== */

.kog-page-hero {
	background: var(--wp--preset--color--black);
	border-bottom: 1px solid var(--wp--preset--color--border);
}
.kog-page-hero-title.wp-block-post-title,
.kog-page-hero .wp-block-post-title {
	color: var(--wp--preset--color--light) !important;
	font-family: var(--wp--preset--font-family--playfair);
}

/* ==========================================================================
   21. HERO — DEFAULT (patterns/hero-default.php)
   ========================================================================== */

.kog-hero-default {
	background: var(--wp--preset--color--black);
	border-bottom: 1px solid var(--wp--preset--color--border);
}

/* ==========================================================================
   22. FEATURE SPLIT (patterns/section-feature-split.php)
   ========================================================================== */

.kog-feature-split-image img {
	width: 100%;
	object-fit: cover;
	border-radius: 10px;
	aspect-ratio: 4 / 3;
	display: block;
	background: var(--wp--preset--color--card);
}
/* Empty image placeholder styling until photo is uploaded */
.kog-feature-split-image:not(:has(img[src])),
.kog-feature-split-image img[src=""] {
	background: var(--wp--preset--color--card);
	min-height: 360px;
	border-radius: 10px;
	display: block;
}

/* ==========================================================================
   23. TESTIMONIALS (patterns/section-testimonials.php)
   ========================================================================== */

.kog-testimonial-quote {
	margin-bottom: 1.25rem !important;
}
.kog-testimonial-org {
	margin-top: 0.25rem !important;
}

/* ==========================================================================
   24. FAQ (patterns/section-faq.php)
   ========================================================================== */

.kog-faq-section {}

.kog-faq-item {
	border-bottom: 1px solid var(--wp--preset--color--border);
}
.kog-faq-item:last-child {
	border-bottom: none;
}
.kog-faq-q {
	color: var(--wp--preset--color--charcoal);
	padding-bottom: 0 !important;
}
.kog-faq-a {
	color: var(--wp--preset--color--warm-gray) !important;
}

/* ==========================================================================
   25. CONTACT SECTION (patterns/section-contact.php)
   ========================================================================== */

.kog-contact-label {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold);
	margin-bottom: 0.375rem !important;
	display: block;
}
.kog-contact-value {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--wp--preset--color--charcoal);
}

/* ==========================================================================
   26. PRICING / PACKAGES (patterns/section-pricing.php)
   ========================================================================== */

.kog-pricing-badge {
	display: inline-block;
	margin-bottom: 1.25rem;
	background: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--charcoal);
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	padding: 0.3rem 0.875rem;
	border-radius: 4px;
}

/* ==========================================================================
   27. ABOUT INTRO (patterns/section-about-intro.php)
   ========================================================================== */

.kog-about-intro {}
.kog-about-intro .wp-block-quote.is-style-kog-testimonial {
	border-left: 4px solid var(--wp--preset--color--gold);
	background: var(--wp--preset--color--gold-pale);
	padding: 1.5rem 1.75rem;
	border-radius: 0 10px 10px 0;
}
.kog-about-intro .wp-block-quote.is-style-kog-testimonial cite {
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--warm-gray);
	font-style: normal;
	display: block;
	margin-top: 0.75rem;
}